@charset "UTF-8";
/*//////////////// ____________________________________ common ///////////////*/
#sp-wrapper { max-width: 750px; margin: 0 auto; }
#sp-wrapper #main-cont a.link { color: #FD3354; text-decoration: underline; }
#sp-wrapper img { max-width: 100%; }
#sp-wrapper input[type="image"] { width: 96%; margin: 0 2% 1em; }
#sp-wrapper input[type=checkbox], #sp-wrapper input[type=radio] { display: none; margin: 0; }
#sp-wrapper input[type=checkbox] + label, #sp-wrapper input[type=radio] + label { padding: 0 0 0 30px; position: relative; display: inline-block; margin-right: 12px; font-size: 13px; line-height: 38px; cursor: pointer; }
#sp-wrapper input[type=checkbox] + label::before, #sp-wrapper input[type=radio] + label::before { content: ""; position: absolute; top: 40%; left: 0; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 26px; height: 26px; margin-top: -9px; background: #FFF; border: 2px solid #ccc; }
#sp-wrapper input[type=radio] + label::before { border-radius: 16px; }
#sp-wrapper input[type=checkbox]:checked + label::after, #sp-wrapper input[type=radio]:checked + label::after { content: ""; position: absolute; top: 50%; -moz-box-sizing: border-box; box-sizing: border-box; display: block; }
#sp-wrapper input[type=checkbox]:checked + label::after { left: 3px; width: 23px; height: 15px; margin-top: -12px; border-left: 3px solid #E71063; border-bottom: 3px solid #E71063; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
#sp-wrapper input[type=radio]:checked + label::after { left: 5px; width: 8px; height: 8px; margin-top: -6px; background: #E71063; border-radius: 9px; }
#sp-wrapper input[type=radio]:checked + label::after { left: 4px; width: 18px; height: 18px; margin-top: -9px; border-left: 3px solid #E71063; border-bottom: 3px solid #E71063; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
#sp-wrapper .bnr { width: 96%; margin: 0 2%; }
#sp-wrapper .txt { font-size: 108%; text-align: left; margin: 0 2% 0.2em; }
#sp-wrapper .txt-right { text-align: right; }
#sp-wrapper .txt-bold { font-weight: bold; }
#sp-wrapper .txt-pink { color: #FF6E6E; }
#sp-wrapper .cont { width: 96%; margin: 0 2% 0.5em; }
#sp-wrapper #header { border-bottom: 2px solid #FF6E6E; }
#sp-wrapper #header .logo { width: 32.2%; padding: 5px 2.5%; float: left; border-right: 1px solid #A3A3A3; }
#sp-wrapper #header .tel { width: 51%; padding: 5px 2.5%; float: left; border-right: 1px solid #A3A3A3; }
#sp-wrapper #footer nav ul { border-bottom: 1px solid #5b5b5b; }
#sp-wrapper #footer nav li { width: 100%; font-size: 115.4%; }
#sp-wrapper #footer nav li a { width: 100%; display: block; border-top: 1px solid #5b5b5b; padding: 0.5em 0.8em; clear: both; color: #3d3d3d; text-decoration: none; }
#sp-wrapper #footer nav li a i { float: right; font-size: 130.7%; line-height: 30px; }
#sp-wrapper #copy small { display: block; padding: 1.5em 0 1em; text-align: center; }
#sp-wrapper table { width: 96%; margin: 0 2% 2em; border: 1px solid #a3a3a3; }
#sp-wrapper table th { width: 25%; background: #FFEFEF; }
#sp-wrapper table th, #sp-wrapper table td { padding: 0.4em 0.8em; border-bottom: 1px solid #a3a3a3; }

#sp-wrapper table.keyword{font-size:0.8em;}
#sp-wrapper table.keyword th {background: #FFEFEF;}
#sp-wrapper table.keyword th,
#sp-wrapper table.keyword td { padding: 0.4em; border-bottom: 1px solid #a3a3a3;  border-right: 1px solid #a3a3a3; text-align:center; }
#sp-wrapper table.keyword th.name { width:50%;}
#sp-wrapper table.keyword th.price { width:30%;}
#sp-wrapper table.keyword th.btn { width:20%;}
#sp-wrapper table.keyword td input[type="button"]{
	background: -moz-linear-gradient(top, #fff, #F1F1F1 1%, #F1F1F1 50%, #DFDFDF 99%, #ccc);  
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(0.01, #F1F1F1), color-stop(0.5, #F1F1F1), color-stop(0.99, #DFDFDF), to(#ccc));
	border-radius:3px;
	border:1px solid #CCC;
	padding:1px 5px;
	font-size:1.2em;
}
nav.pNavi ul{
	text-align:center;
	margin:2em 0;
	}
nav.pNavi li{
	display:inline-block;
	}
nav.pNavi li a{
	border:1px solid #ccc;
	padding:0 0.5em;
	margin:0 0.2em;
	display:block;
	}

#pagetop { text-align: center; }
#pagetop a { color: #FF6E6E; font-size: 5em; }

input.assess_btn01 { width: 96%; padding: 0.5em 20%; border: 1px solid #FD3354; border-radius: 3px; background: -moz-linear-gradient(top, #ff6e6e 0%, #fd3354 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff6e6e), color-stop(100%, #fd3354)); background: linear-gradient(to bottom, #ff6e6e 0%, #fd3354 100%); }

#sp-wrapper .assess { padding-bottom: 1em; }
#sp-wrapper .assess .select { width: 96%; margin: 0 auto; padding: 0.8em 0 0; background: #ffffff; text-align: center; }
#sp-wrapper .assess .select select { width: 96%; padding: 0.4em 0.8em; margin: 0 2% 0.6em; font-size: 123%; -webkit-appearance: none; background: url(../images/common/arw_01.png) 96% center no-repeat, -moz-linear-gradient(top, #ffffff 0%, #dcdddd 100%); /* FF3.6+ */ background: url(../images/common/arw_01.png) 96% center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #dcdddd)); /* Chrome,Safari4+ */ background: url(../images/common/arw_01.png) 96% center no-repeat, linear-gradient(to bottom, #ffffff 0%, #dcdddd 100%); /* W3C */ background-size: auto 26%, 100% 100%; }

#sp-wrapper .search-box { background: #3FBB1C; padding-bottom: 1em; }
#sp-wrapper .search-box .inner { width: 96%; margin: 0 2%; background: #ffffff; padding: 1.5em 0 0.5em; }
#sp-wrapper .search-box .inner input.txtbox { width: 96%; margin: 0 2% 0.5em; font-size: 146.2%; padding: 0 0.4em; }

#sp-wrapper .btn-area { margin: 5em 0 0; }
#sp-wrapper .btn-area .bnr { margin-bottom: 25px; }

#sp-wrapper .breadcrumb ol { width: 96%; margin: 1em 2% 0; }
#sp-wrapper .breadcrumb ol li { width: 33.2%; float: left; }
#sp-wrapper .breadcrumb ol li img { width: 100%; }

/*//////////////// ____________________________________ top ///////////////*/
#sp-wrapper .top .assess { background: #3FBB1C; }

#sp-wrapper .valueup { width: 96%; margin: 0 2%; padding: 1.6em 0; }
#sp-wrapper .valueup h3 { border-left: 7px solid #FF6E6E; padding-left: 0.6em; font-size: 146.2%; }
#sp-wrapper .valueup table { width: 100%; margin: 1.5em 0; }
#sp-wrapper .valueup table tbody tr td { width: 33%; padding: 0.5em 0; text-align: center; border: 1px solid #a3a3a3; }
#sp-wrapper .valueup table .style2 { color: #ff0000; }

#sp-wrapper .top #topic { padding: 0.2em 2%; font-size: 138.5%; border-top: 1px solid #5b5b5b; border-bottom: 1px solid #5b5b5b; }

#sp-wrapper .top .btn-area ul { margin: 2em 0 1em 2.15%; }
#sp-wrapper .top .btn-area ul li { width: 31%; float: left; margin-right: 2.15%; margin-bottom: 1em; }

/*//////////////// ____________________________________ assess01 ///////////////*/
#sp-wrapper .assess01 h1 { margin: 1em 2%; background: #FFD5D5; padding: 3px 8px; clear:both; }
#sp-wrapper .assess01 dl { border: 2px solid #FFD5D5; margin: 0 2% 1em; }
#sp-wrapper .assess01 dl dt { background: #FFD5D5; }
#sp-wrapper .assess01 dl dt, #sp-wrapper .assess01 dl dd { padding: 3px 8px; }
#sp-wrapper .assess01 dl dd { min-height: 2em; }
#sp-wrapper .assess01 .search-box { margin: 1.5em 0 3em; }
#sp-wrapper .assess01 .accessories .inner { width: 96%; margin: 0 2% 1.5em; padding: 0.5em 3%; text-align: left; border: 2px solid #a3a3a3; }
#sp-wrapper .assess01 table { margin-bottom: 0.5em; }

/*//////////////// ____________________________________ result ///////////////*/
.result h1 { margin: 1.5em 2% 0.2em; background: #FFD5D5; font-size: 130.7%; font-weight: bold; padding: 0 2%; }
.result .total-price { color: #ff0000; font-weight: bold; font-size: 200%; margin: 0 2%; }
.result .btn-block-2 { width: 96%; margin: 0.5em 2% 2em; }
.result .btn-block-2 li { width: 49%; float: left; }
.result .btn-block-2 li + li { margin-left: 2%; }
.result .btn-block-2 li a { background: #ff0000; display: block; text-align: center; border-radius: 5px; padding: 2px 5% 2px; }
.result .btn-block-2 li.grn a { background: -webkit-linear-gradient(top, #7cf065 0%, #0a920d 100%); /* Chrome10+,Safari5.1+ */ background: linear-gradient(to bottom, #7cf065 0%, #0a920d 100%); /* W3C */ border: 1px solid #5DCF53; }
.result .btn-block-2 li.red a { background: -webkit-linear-gradient(top, #ff0000 0%, #c20000 100%); /* Chrome10+,Safari5.1+ */ background: linear-gradient(to bottom, #ff0000 0%, #c20000 100%); /* W3C */ border: 1px solid #FF6865; }
.result ul.detail { width: 96%; margin: 0 2%; }
.result ul.detail .subtotal, .result ul.detail .subttl { color: #FF6E6E; font-size: 138.5%; font-weight: bold; margin: 0 2%; }
.result ul.detail .subtotal span, .result ul.detail .subttl span { color: #ff0000; }
.result ul.detail .close-btn { width: 24px; height: 24px; position: absolute; right: 2%; top: 0; }
.result ul.detail li { position: relative; margin-bottom: 30px; }
.result .btn-tel { width: 96%; margin: 1.5em 2%; padding: 0.5em 20%; border: 1px solid #FF6E6E; border-radius: 3px; background: -webkit-linear-gradient(top, #ffffff 37%, #dcdddd 100%); /* Chrome10+,Safari5.1+ */ background: linear-gradient(to bottom, #ffffff 37%, #dcdddd 100%); /* W3C */ }

/*//////////////// ____________________________________ form ///////////////*/
.form h1 { background: url(../images/common/hline_ico.png) left top no-repeat; background-size: contain; padding-left: 1em; margin-bottom: 0.6em; }
.form .pnk-bg { width: 96%; margin: 0 2% 0.5em; padding: 0 2%; background: #FFD5D5; }
.form .bdpnk { width: 96%; margin: 0 2%; padding: 5px; border: 4px solid #FF6E6E; }
.form .bdpnk span.txt-bold { display: block; }
.form .caution { padding: 1em 2%; }
.form .txt-red { color: #ff0000; }
.form .to-conf a { width: 94%; margin: 0 3%; padding: 0.5em 0; border-radius: 5px; font-size: 161.5%; display: block; background: #FF6E6E; color: #ffffff; text-align: center; }
.form dd.iframe .wrap { width: 100%; height: 180px; overflow: scroll; -webkit-overflow-scrolling: touch; position: relative; }

#sp-wrapper .form dl dd { padding: 8px; }
#sp-wrapper .form dl dd input[type=text], #sp-wrapper .form dl dd textarea { width: 98%; height: 2em; font-size: 123%; margin: 0 1%; }
#sp-wrapper .form dl dd textarea { height: 8em; }
#sp-wrapper .form dl dd span { display: block; margin-top: 0.2em; }
#sp-wrapper .form dl dd span.red { color: #ff0000; }
#sp-wrapper .form dl dd input[type=checkbox] { width: auto; }
#sp-wrapper .form dl dd select { padding: 0.4em 0.8em; font-size: 123%; -webkit-appearance: none; background: url(../images/common/arw_01.png) 96% center no-repeat, -moz-linear-gradient(top, #ffffff 0%, #dcdddd 100%); /* FF3.6+ */ background: url(../images/common/arw_01.png) 96% center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #dcdddd)); /* Chrome,Safari4+ */ background: url(../images/common/arw_01.png) 96% center no-repeat, linear-gradient(to bottom, #ffffff 0%, #dcdddd 100%); /* W3C */ background-size: auto 26%, 100% 100%; }
#sp-wrapper .form dl dd select.wide { width: 96%; margin: 0 2%; }
#sp-wrapper .form dl dd .caution { font-size: 85%; }

/*//////////////// ____________________________________ drawer menu ///////////////*/
html, body, #sp-wrapper { height: 100%; }

#sp-wrapper { position: relative; -webkit-transition: all .2s; transition: all .2s; }

#sp-wrapper.open { -webkit-transform: translate3d(-250px, 0, 0); transform: translate3d(-250px, 0, 0); overflow: hidden; }

#drawer { position: fixed; top: 0; right: -250px; width: 250px; height: 100%; overflow-x: hidden; -webkit-overflow-scrolling: touch; -webkit-transition: all .2s; transition: all .2s; background-color: #dedede; box-shadow: 0px 9px 3px -3px rgba(0, 0, 0, 0.6); -webkit-box-shadow: 0px 9px 3px -3px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0px 9px 3px -3px rgba(0, 0, 0, 0.6); }

#drawer.open { -webkit-transform: translate3d(-250px, 0, 0); transform: translate3d(-250px, 0, 0); }
#drawer.open nav ul li a { display: block; font-size: 115.4%; padding: 0.5em 1.5em; border-top: 1px solid #e4e4e4; border-bottom: 1px solid #d5d5d5; }
#drawer.open .drawer-button { padding: 3px; font-size: 28px; line-height: 35px; background: #555555; color: #ffffff; text-align: center; }

#overlay { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 9999; background: rgba(0, 0, 0, 0.6); }

/* 開閉ボタン */
.drawer-button { display: block; width: 16.8%; float: right; padding: 5px 4% 7px; }
.displaynone { display:none;}