@charset "utf-8";
/* CSS Document */

/* promo ************************************************************************************************************************/

#promo{
	padding-top:14px;
	margin-bottom:20px;
	}
#promo .promo{
	overflow:hidden;
	}
#promo .promo ul{
	width:30000px;
	}
#promo .promo li{
	float:left;
	width:auto;
	}
#promo .promo ul:after{
	content:"";
	display:block;
	clear:both;
	}
	
#promo>div{
	text-align:center;
	}
#promo>div span{
	width:12px;
	height:12px;
	border-radius:20px;
	background:#ddd;
	display:inline-block;
	margin:10px 4px 0;
	}
#promo>div span.now{
	background:#aaa;
	}
	
#promo .rightZone>div{
	position:relative;
	display:block;
	margin:0 auto 14px;
	height:232px;
	width:240px;
	}
#promo .rightZone>div>img{
	position:absolute;
	left:0;
	top:0;
	}
#promo .rightZone>div .button{
	position:absolute;
	left:10px;
	top:130px;
	}

@media screen and (min-width: 541px) {
#promo{
	padding-top:20px;
	}
#promo>div{
	width:980px;
	margin:0 auto;
	}
#promo{
	background:url(../../image/home/section1-back.png) left top repeat-x;
	height:400px;
	}
#promo .promoBody{
	width:720px;
	float:left;
	}
#promo .promo{
	width:720px;
	float:left;
	}
.rightZone{
	width:240px;
	float:right;
	}
.pcnone {
	display:none;
	}
}
@media screen and (max-width: 540px) {
#promo .promo{
	width:100%;
	}
}

/************************************************************************************************************************ promo */

/* nomal ************************************************************************************************************************/

.bannerBox:after, .step3:after{
	content:"";
	display:block;
	clear:both;
	}
.bannerBox li{
	float:left;
	display:block;
	list-style-type:none;
	}

.step3 li{
	width:214px;
	margin:0 auto;
	position:relative;
	}
.step3 li span.serif{
	display:block;
	text-align:center;
	}
.step3 li p{
	font-size:10px;
	line-height:1.8em;
	margin-top:0 !important;
	}

.assessment .step3 li p{
	font-size:12px;
	}
.assessment .step3 li{
	width:203px;
	}
	
.brandList{
	background:#edeae0;
	padding:10px;
	margin-top:7px!important;
	margin-bottom:20px!important;
	}
.brandList li{
	display:inline-block;
	word-break:keep-all;
	font-size:12px;
	}
.brandList li:after{
	content:" / ";
	}
.purchaseList:after{
	content:"";
	display:block;
	clear:both;
	}
.purchaseList li{
	float:left;
	font-size:12px;
	}
	
.contactBanner{
	text-align:center;
	margin:30px 0;
	}
.contactBanner .tel{
	color:#333;
	font-size:12px;
	display:inline-block;
	}
.contactBanner .tel span{
	display:inline-block;
	word-break:keep-all;
	position:relative;
	bottom:-4px;
	margin:0 10px;
	}

@media screen and (min-width: 541px) {
.assessment .satei_title {
	display:block;
	margin:0 auto;
	width:679px;
	text-align:center;
	color:#fff;
	font-size:18px;
	padding:8px 0;
	background:url(../../image/home/satei_title.png);
	}
.imageBox{
	border:1px solid #ccc;
	}
.imageBox img{
	float:left;
	}
.imageBox:after{
	content:"";
	display:block;
	clear:both;
	}

.bannerBox li{
	margin-right:14px;
	margin-bottom:10px;
	}
.bannerBox li:nth-of-type(4n+1){
	clear:both;
	}
.bannerBox li:nth-of-type(4n+3){
	margin:0;
	}
.bannerBox li:nth-of-type(4n){
	margin:0;
	float:right;
	}
	
.step3 li{
	float:left;
	}
.step3 li:nth-of-type(3n+1){
	margin-right:39px;
	clear:both;
	}
.step3 li:nth-of-type(3n){
	float:right;
	}
.step3 li:not(:nth-of-type(3n)):after{
	content:url(../../image/home/section5-arror01.png);
	right:-34px;
	top:80px;
	position:absolute;
	}
.assessment .step3 li:nth-of-type(4):after{
	content:"";
	}
.assessment .step3{
	padding:0px 6px;
	}
	
.purchaseList li{
	width:33.3%;
	}
	
.contactBanner{
	background:url(../../image/home/section10-1.png) center top no-repeat;
	height:162px;
	padding-top:50px;
	}
.contactBanner .tel{
	margin:20px 0;
	}
}
@media screen and (max-width: 540px) {
.assessment .satei_title {
	display:block;
	margin:0 auto;
	text-align:center;
	color:#fff;
	font-size:18px;
	padding:8px 0;
	background:url(../../image/home/satei_title.png);
	}
.imageBox img{
	display:block;
	margin:0 auto;
	}

.step3 li:not(:nth-of-type(3n)), .assessment .step3 li:not(:nth-of-type(5n)){
	padding-bottom:30px;
	}
.step3 li:not(:nth-of-type(3n)):after, .assessment .step3 li:not(:nth-of-type(5n)):after{
	content:url(../../image/home/section5-arror02.png);
	left:62px;
	bottom:0;
	position:absolute;
	}
.assessment .step3 li:nth-of-type(3){
	padding-bottom:40px;
	}
.assessment .step3 li:nth-of-type(5){
	margin-bottom:0;
	}
.assessment .step3 li:nth-of-type(5):after{
	content:"";
	}

.purchaseList li{
	width:50%;
	}
.contactBanner{
	background:#faf5e2;
	padding:10px 10px 20px;
	}
.contactBanner .tel{
	display:block;
	width:100%;
	}
}
@media screen and (max-width: 540px) and (min-width: 381px){
.bannerBox li{
	margin:6px 4px;
	}
}
@media screen and (max-width: 380px) {
.bannerBox li{
	width:auto;
	max-width:49%;
	float:left;
	margin-bottom:10px;
	}
.bannerBox li:nth-of-type(2n){
	float:right;
	}
}

/************************************************************************************************************************ nomal */

/* reason ************************************************************************************************************************/

.reason{
	background:#faf9f5;
	padding:20px;
	position:relative;
	line-height:1.65em;
	}
.reason h3{
	background:url(../../image/home/section6-line.png) left bottom no-repeat;
	padding-left:50px;
	font-weight:normal;
	font-size:25px;
	padding-bottom:10px;
	margin-bottom:30px;
	}
.reason .icon{
	position:absolute;
	left:0px;
	top:-6px;
	}

.reason .notice{
	font-size:smaller;
	line-height:1.5;
	margin-bottom:15px!important;
	}

@media screen and (min-width: 541px) {
.reason{
	margin:10px 0;
	background:url(../../image/home/section6-back02.png) top left no-repeat,
			   url(../../image/home/section6-back03.png) bottom left no-repeat,
			   url(../../image/home/section6-back01.png) left top repeat-y;
	}
.reason:nth-of-type(1){
	background:url(../../image/home/section6-back02.png) top left no-repeat,
			   url(../../image/home/section6-back04.png) bottom right no-repeat,
			   url(../../image/home/section6-back03.png) bottom left no-repeat,
			   url(../../image/home/section6-back01.png) left top repeat-y;
	}
.reason .rightImage{
	margin-right:10px;
	margin-bottom:30px;
	margin-left:16px;
	margin-top:10px;
	}
.reason .leftImage{
	margin-right:12px;
	}
.reason div img{
	display:block;
	float:left;
	}
.reason div img:nth-of-type(1){
	margin-right:22px;
	}
.reason div img:nth-of-type(3){
	float:right;
	}
.reason div:after{
	content:"";
	display:block;
	clear:both;
	}
}
@media screen and (max-width: 540px) {
.reason{
	margin:20px 0;
	border:1px solid #cdb054;
	}
.reason h3{
	font-size:14px;
	line-height:16px;
	padding-bottom:10px;
	margin-bottom:20px;
	}
.reason .spGold{
	display:block;
	color:#af902e;
	}
.reason div{
	text-align:center;
	}
.reason div img{
	margin-bottom:10px;
	}
}



/************************************************************************************************************************ reason */

/* assessment ************************************************************************************************************************/

.assessment{
	margin:10px auto;
	padding:10px;
	}
.assessment>img{
	display:block;
	margin:0 auto;
	}
.assessment h3{
	text-align:center;
	margin:10px 0 20px;
	}
.assessment .result{
	margin:20px 0 30px;
	text-align:center;
	}
	
.assessment .estimate{
	padding:10px;
	}
.assessment .estimate .serif{
	display:block;
	font-size:24px;
	text-align:center;
	margin:20px 0 10px;
	}
.assessment .estimate li b{
	display:block;
	text-align:center;
	}
	
.assessment .procedure h3{
	background:url(../../image/home/section7-title3.png) left top no-repeat;
	font-size:24px;
	padding-left:44px;
	text-align:left;
	display:table-cell;
	width:1000px;
	vertical-align:middle;
	height:80px;
	font-weight:normal;
	color:#d60505;
	}
.assessment .procedure .step3{
	margin-top:-20px;
	}
@media screen and (min-width: 541px) {
.assessment{
	background:url(../../image/home/section7-back04.png) top left no-repeat,
			   url(../../image/home/section7-back02.png) top left no-repeat,
			   url(../../image/home/section7-back03.png) bottom left no-repeat,
			   url(../../image/home/section7-back01.png) left top repeat-y;
	padding-bottom:20px;
	}
.assessment .result img:nth-of-type(1){
	display:block;
	margin:0 auto;
	}
	
.assessment .procedure{
	background:url(../../image/home/section7-title2-back.png) right top no-repeat;
	}
.assessment .procedure div{
	text-align:center;
	margin-bottom:30px;
	}
	
.assessment .estimate{
	background:url(../../image/home/section7-back06.png) top left no-repeat,
			   url(../../image/home/section7-back07.png) bottom left no-repeat,
			   url(../../image/home/section7-back05.png) left top repeat-y;
	width:659px;
	margin:0 auto;
	}
.assessment .estimate ul{
	background:url(../../image/home/section7-back13.png) left top no-repeat;
	width:631px;
	margin:0 auto 20px;
	}
.assessment .estimate li{
	width:190px;
	font-size:12px;
	line-height:14px;
	float:left;
	margin:6px 10px;
	}
.assessment .estimate ul:after{
	content:"";
	display:block;
	clear:both;
	}
.assessment .estimate ul:nth-of-type(2) li{
	float:none;
	padding:6px 0;
	margin:0 auto;
	}
.assessment .estimate ul p{
	margin-top:6px !important;
	}
.assessment .estimate{
	position:relative;
	}
.assessment .estimate ul:nth-of-type(1):before{
	position:absolute;
	content:url(../../image/home/section7-back09.png);
	left:0;
	top:0;
	}
.assessment .estimate:before{
	position:absolute;
	content:url(../../image/home/section7-back10.png);
	right:0;
	top:0;
	}
.assessment .estimate ul:nth-of-type(2):before{
	position:absolute;
	content:url(../../image/home/section7-back11.png);
	left:0;
	bottom:-8px;
	}
.assessment .estimate:after{
	position:absolute;
	content:url(../../image/home/section7-back12.png);
	right:0;
	bottom:-8px;
	}
}
@media screen and (max-width: 540px) {
.assessment{
	background:#f6f6f6;
	border:1px solid #bebebe;
	}
.assessment .result img{
	display:block;
	margin:0 auto;
	}
.assessment .result img:nth-of-type(2){
	display:none;
	}
	
.assessment .procedure div{
	text-align:center;
	}
.assessment .procedure img{
	display:block;
	margin:0 auto 10px;
	}
.assessment .procedure div img{
	display:inline-block;
	}
	
.assessment .estimate{
	background:#fff;
	border:1px solid #ad8715;
	}
.assessment .estimate .serif{
	font-size:18px;
	}
.assessment .estimate img{
	display:block;
	margin:0 auto;
	}
.assessment .estimate ul:nth-of-type(1){
	margin-bottom:30px;
	}
}

/************************************************************************************************************************ assessment */

/* purchase ************************************************************************************************************************/

.purchase h3, .purchaseList h3{
	background:url(../../image/home/section8-title.png) left bottom no-repeat;
	display:table-cell;
	vertical-align:middle;
	width:1000px;
	height:30px;
	color:#fff;
	font-weight:normal;
	padding-top:4px;
	padding-left:10px;
	font-size:18px;
	}
.purchase ul{
	margin:10px 0;
	}
.purchase ul:after{
	content:"";
	display:block;
	clear:both;
	}
.purchase li{
	width:170px;
	float:left;
	font-size:12px;
	line-height:1.8em;
	}
.purchase li>span{
	display:block;
	text-align:center;
	color:#fff;
	background:#545454;
	margin-top:8px;
	padding:4px 0 2px;
	}
.purchase li>p{
	margin-top:6px !important;
	}
.purchase li>p b{
	color:#e24723;
	display:inline-block;
	word-break:keep-all;
	}

@media screen and (min-width: 541px) {
.purchase li:nth-of-type(4n+1), .purchase li:nth-of-type(4n+2){
	margin-right:14px;
	}
.purchase li:nth-of-type(4n){
	float:right;
	}
.purchase li:nth-of-type(4n+1){
	clear:both;
	}
}
@media screen and (max-width: 540px){
.purchase h3, .purchaseList h3{
	font-size:14px;
	}
.purchase li:nth-of-type(2n){
	margin-left:20px;
	}
.purchase li:nth-of-type(2n+1){
	clear:both;
	}
}
@media screen and (max-width: 380px) {
.purchase li{
	width:49%;
	}
.purchase li:nth-of-type(2n){
	margin:0;
	float:right;
	}
}

/************************************************************************************************************************ purchase */

/* voice ************************************************************************************************************************/

.voice{
	margin:10px 0;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#f0ecde');
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr = '#ffffff', endColorstr = '#f0ecde')";
	background-image: -moz-linear-gradient(top, #ffffff, #f0ecde);
	background-image: -ms-linear-gradient(top, #ffffff, #f0ecde);
	background-image: -o-linear-gradient(top, #ffffff, #f0ecde);
	background-image: -webkit-linear-gradient(top, #ffffff, #f0ecde);
	background-image: linear-gradient(top, #ffffff, #f0ecde);
	}
.voice p{
	margin-top: 4px !important;
	}

@media screen and (min-width: 541px) {
.voice div{
	background:url(../../image/home/section11-back02.png) top left no-repeat,
			   url(../../image/home/section11-back03.png) bottom left no-repeat,
			   url(../../image/home/section11-back01.png) top left repeat-y,
			   url(../../image/home/section11-back04.png) top left repeat-y;
	padding:16px 16px 24px;
	}
}
@media screen and (max-width: 540px) {
.voice div{
	background:url(../../image/home/section11-back04.png) top left repeat-y;
	padding:10px;
	padding-top:20px
	}
}

/************************************************************************************************************************ voice */

#search_box {background:#f6f2e9;padding:20px;margin:20px auto;}
#search_box input[type="text"] {margin:0 10px;padding:0.5rem;height:23px;width:90%;}
#search_form {border-bottom:solid 2px #e4d8c6;}
#search_form ul {overflow:hidden;}
#search_form li {float:left;margin:0;padding:0;height:60px;}
#search_form li:nth-child(2) {width:60%;}
#search_btn {border:0;width:89px;height:42px;background:url('../../image/common/search_btn.png') left center no-repeat;cursor:pointer;}

#search_result {overflow:hidden;padding:20px 0 0;}
#resultRate {float:left;width:30%;}
#resultInfo {float:left;width:65%;padding:20px 0;}
#resultName {font-size:1.8rem;color:#6c421c;margin-bottom:10px;}
.brandLink {width:auto;}
.brandLink a {display:block;color:#283d9e;text-decoration:none;padding:5px 5px 5px 35px;background:#fff;border:solid 1px #ccc;border-radius:2px;margin:10px 0 0;background:#fff url('../../image/common/search_ico.png') 10px center no-repeat;width:auto;}

@media screen and (max-width: 540px) {
	#search_box {background:#f6f2e9;padding:10px;}
	#search_box input[type="text"] {margin:0 10px;padding:0.5rem;height:23px;width:100%;}
	#search_form {border-bottom:solid 2px #e4d8c6;}
	#search_form ul {overflow:hidden;}
	#search_form li {float:left;margin:0;padding:0;height:60px;}
	#search_form li:nth-child(2) {width:90%;display:block;}
	#search_btn {border:0;width:89px;height:42px;background:url('../../image/common/search_btn.png') left center no-repeat;display:block;margin:0 auto;}

	#search_result {overflow:hidden;padding:20px 0 0;}
	#resultRate {float:left;width:100%;display:block;}
	#resultRate img {display:block;margin:0 auto;}
	#resultInfo {float:left;width:95%;padding:20px 0;display:block;}
	#resultName {font-size:1.8rem;color:#6c421c;margin-bottom:10px;}
	.brandLink {width:auto;}
	.brandLink a {display:block;color:#283d9e;text-decoration:none;padding:5px 5px 5px 35px;background:#fff;border:solid 1px #ccc;border-radius:2px;margin:10px 0 0;background:#fff url('../../image/common/search_ico.png') 10px center no-repeat;width:auto;width:85%;}
}
