@charset "utf-8";
/* 花椿 CSS */

*{
margin:0;
padding:0;
border:none;
font-size:100%;
font-style:normal;
font-weight:normal;
text-align:left;
outline:none;
zoom:1;
}

html{ overflow-y:scroll;}

body {
text-align:center;
font-family:verdana,Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
font-size:80%;
line-height: 1.6;
color:#303030;
background:url(../img/bg.gif);
}

h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-style: normal;
font-weight: normal; 
}

ul,li { margin: 0; padding: 0;list-style:none; }


/* mainArea */
#contents{ 
width:960px;
height:600px;
margin:22px auto 0;
}

#header{ 
width:896px;
height:87px;
padding:31px 32px 0;
background:url(../img/bxbg_top.gif) no-repeat;
}
#header div{
height:87px;
background:url(../img/dot.gif) bottom no-repeat;
}
#header h1{
float:left;
}
#header p{
padding:23px 0 0;
float:right;
}
#mainArea{ 
width:960px;
background:#ffffff url(../img/bxbg_mdl.gif) repeat-y;
clear:both;
}

#mainArea #left{
width:194px;
height:460px;
margin-left:32px;
float:left;
}
#mainArea #left ul{
display:block;
}

#mainArea #left li{
padding:0 0 1px;
background:url(../img/dot.gif) left bottom no-repeat;
}
#mainArea #right{
width:650px;
margin-right:32px;
float:right;
}


/* main Slide */
#slideshow {
   position: relative;
   width:  650px;
   height: 460px;
}
#slideshow img {
   position: absolute;
   top: 0;
   left:0;
   z-index: 8;
   opacity: 0.0;
}
#slideshow img.active {
   z-index: 10;
   opacity: 1.0;
}
#slideshow img.last-active {
   z-index: 9;
}


#mainArea #right #flash {
width: 650px;
height: 460px;
}
#mainArea #right #noneflash {
visibility:hidden;
width: 650px;
height: 460px;
margin-top:-460px;
background:url(../img/img.gif) no-repeat;
}
#mainArea #right #noneflash a img{
margin:426px 0 0 498px;
}

#mainArea #right .notice{ 
width:620px;
padding:15px 0 15px 22px;
font-size:90%;
color:#5f5b5c;
background:url(../img/bg_pink.gif);
}
#mainArea #right .notice li{ 
margin-bottom:3px;
padding:0 0 0 20px;
background:url(../img/blt01.gif) no-repeat 0px 3px;
}

#contents_btm{ 
width:960px;
height:16px;
margin:auto;
background:#ffffff url(../img/bxbg_mdl.gif) repeat-y;
clear:both;
}

#contents_btm2{ 
width:960px;
height:16px;
margin:auto;
background:url(../img/bxbg_btm.gif) bottom no-repeat;
clear:both;
}

/*------------------------------------------------------------

	モーダル

------------------------------------------------------------*/
#overLay {
	position: absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
	background: #7f7f7f;
	z-index: 500;
}
#displayContent {
	position: absolute;
	top:50%;
	left:50%;
	margin: -50px 0 0 -50px;
	width: 100px;
	height: 100px;
	z-index: 600;
}
#getContents {
	width: 100%;
	height: 100%;
	background: #fff;
}
#closeBox {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 50px;
	height: 13px;
}


/*------------------------------------------------------------

	レイヤー

------------------------------------------------------------*/

#layer{
width:560px;
height:465px;
position:relative;
background:#ffffff url(../img/layer_top.gif) top no-repeat;
}
#layer .logo{
padding:21px 0 0 30px;
float:left;
}
#layer .about{
height:444px;
padding:21px 0 0 50px;
background:url(../img/layer_btm.gif) bottom no-repeat;
}
#layer .close{ position:absolute;
top:12px; right:13px;
}

#mobile{
width:500px;
position:relative;
background:#ffffff url(../img/mob_top.gif) top no-repeat;
}
#mobile .logo{
padding:21px 0 0 30px;
float:left;
}
#mobile .txt1{
height:180px;
padding:21px 0 0 50px;
}
#mobile .txt2{
height:76px;
padding:0 0 0 150px;
}
#mobile .txt3{
height:78px;
padding:0 0 0 50px;
background:url(../img/mob_btm.gif) bottom no-repeat;
}
#mobile .close{ position:absolute;
top:12px; right:13px;
}

/*------------------------------------------------------------

	カウンセリング

------------------------------------------------------------*/

#counseling h2{
padding:37px 0 0;
}
#counseling .text{
height:80px;
padding:36px 0 0;
}
#counseling .text li{ float:left;}

#counseling .karte{
/*height:158px;*/
}
#counseling .karte span{ float:left;}
#counseling .karte p{ padding:15px 0px 50px 0px;
line-height:1.8;
}

/*------------------------------------------------------------

	ご購入製品お取替えサービス

------------------------------------------------------------*/

#guarantee h2{
padding:37px 0 0;
}
#guarantee h3{
padding:32px 0 18px;
}
#guarantee p{ 
padding:0px 0px 36px 2px;
line-height:1.8;
}

#promise{
width:650px;
height:460x;
overflow:auto;
}

/*------------------------------------------------------------

	規約

------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP&display=swap');
.mincho{
	font-family: 'Noto Serif JP', serif;
	font-weight: 500;
	font-size: 18px; 
	letter-spacing: 0.5px;
  }


#promise h2{
padding:37px 0 0;
}
#promise .text p{ 
width:588px;
padding:20px 0 15px 22px;
}
#promise .text ul{ 
padding:0 0 15px 22px;
}
#promise .text li{
margin:0 0 5px;
padding:0 0 0 16px;
background:url(../promise/img/blt.gif) no-repeat 0px 3px;
}
#promise .text span{ 
padding:0 0 10px;
display:block;
text-align:center;
}

#promise .kiyaku{
width:610px;
}
/* #promise h3{
margin-bottom:15px;
} */

#promise h3{
	width:609px;
	height:31px;
	margin-bottom:15px;
	color: #d2003c;
	text-align: center;
}

#promise .bg_border{
	background-color: #ffe6e6;
	background-image: repeating-linear-gradient(-45deg,#fff, #fff 1px,transparent 0, transparent 3px);
}

#promise .kiyaku p{
padding:0 16px 20px;
}
#promise .kiyaku h4{
margin:5px 16px 8px;
padding:0 0 3px;
font-weight:bold;
color:#656262;
background:url(../img/dot.gif) bottom left no-repeat;
}
#promise .kiyaku dl{
padding:0 16px 30px;
}
#promise .kiyaku dt{ 
float:left;
clear:both;
}
#promise .kiyaku dd{
padding:0 0 0 25px;
}
#promise .kiyaku .contact{
padding:0 16px 20px;
text-align:center;
}
#promise .kiyaku .contact img{ 
margin-left:5px;
vertical-align:text-bottom;
}
#promise .pagetop{
width:610px;
text-align:right;
}

.dl-table{
	margin: 0 16px 20px;
}
.dl-table dl{
  padding:0 !important;
  display:flex;
  flex-wrap: wrap;
  border: 1px solid #ccc;
  border-top: none;
}
.dl-table dt{
  background: #fff;
  width: 30%;
  padding: 10px !important;
  box-sizing: border-box;
  border-top: 1px solid #ccc; 
}
.dl-table dd{
  padding: 10px !important;
  margin: 0;
  border-left: 1px solid #ccc;
  border-top: 1px solid #ccc; 
  width: 70%;
  background: #fff;
  box-sizing: border-box;
}

.ul-disc li{
	list-style-type: disc;
	margin-left: 15px;
  }

.color_bg-gray{
	background: #ddd !important;
}


/*------------------------------------------------------------

	ワタシプラスのご案内

------------------------------------------------------------*/
#merit h2{
padding:37px 0 0;
}
#merit h3{
padding:32px 0 10px;
}
#merit p{ 
padding:0px 0px 10px 2px;
line-height:1.5;
}
#merit p span{
padding:18px 0px 16px 2px;
display:block;
text-align:left;
}

#mainArea #right #merit .notice{ 
width:614px;
margin-left:4px;
padding:12px 0 12px 22px;
font-size:90%;
color:#5f5b5c;
background:url(../img/bg_pink.gif);
}

#mainArea #right #merit .notice li{
font-size:12px;
padding:0 0 0 20px;
background:url(../img/blt01.gif) no-repeat 0px 5px;
}
#merit .notice li a{
  font-size:14px;
  font-weight:bold;
  color:#d4003b;
}
#merit .notice li a:hover{
text-decoration:none;
}

/*------------------------------------------------------------

	FOOTER

------------------------------------------------------------*/
#footer    { position:fixed; bottom:0; left:0; height:36px; width:100%;}
* html #footer    { position:absolute; }