@charset "UTF-8";
@import url(html5reset-1.6.1.css);

/* CSS Document */

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    width: 100%;
	margin:0 auto;
	padding:0;
	font: 14px/1.231 "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro W3","ＭＳ Ｐゴシック","MS PGothic",Verdana,Arial,sans-serif;
    line-height: 140%;
	color:#333;
	background:#fff;
}

/* common classes */
a {outline:none; text-decoration:none; }
a:link {color:#333; text-decoration:underline; }
a:visited {color:#333; text-decoration:underline; }
a:hover {color:#1e356a; text-decoration:none; }
a:focus {color:#333; text-decoration:none;}
a:active {color:#1e356a; text-decoration:none;}

a:hover img
{
    opacity: 0.75;
    filter: alpha(opacity=75);
    -ms-filter: "alpha(opacity=75)";
}

a:hover img.op100
{
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter: "alpha( opacity=100 )";
}

.clearfix:after
{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clear{	clear:both;}
.left{		float:left;}
.right{	float:right;}
.tleft{		text-align:left;}
.center{	text-align:center;}
.tright{	text-align:right;}

img{		max-width:100%; height:auto;}

.tm15{margin-top:15px;}
.bm15{margin-bottom:15px;}
.tm30{margin-top:30px;}
.bm30{margin-bottom:30px;}
.bm40{margin-bottom:40px;}
.lm10{margin-left:10px;}
.lm20{margin-left:20px;}

.w280{width: 280px;}
.w450{width: 450px;}
.w455{width: 455px;}
.w645{width: 645px;}

.red{	color:#ce0000;}

.dotright
{
	background:url(../images/dot_right.png) no-repeat top right;
	background-size:contain;
	padding:0 20px 0 0;
}

/* base layout */
#wrap
{
	width:100%;
	text-align:left;
}

#base
{
    width: 980px;
    margin: 0 auto;
    position: static;
}

.container
{
    position: relative;
}

/* header */
#header
{
    width:100%;
    height: 165px;
    position: relative;
    top: 0;
    left:0;
    z-index:5;
}

#header .base
{
    width: 980px;
    height: 80px;
    margin: 0 auto;
    position: relative;
}

#header #logo
{
    background: #fff;
    top: 35px;
    left:50%;
    position: absolute;
    transform: translate(-50%, 0);
    z-index: 10;
}

#header #logo img
{
    box-shadow: 0px 2px 5px #666;
    margin: auto;

}

#header h1
{
    width:50%;
    padding: 10px 0 5px 0;
}

#header #header_links
{
    width: 420px;
}

#header #header_links li
{
    width: 210px;
    padding: 0 5px;
    float: left;
}

#header #header_links li:first-child
{
    text-align: right;
}

#header #header_fd
{
    position: absolute;
    top: 15px;
    right: 0;
}

#header #global
{
    width: 100%;
    height:41px;
    position: absolute;
    top:80px;
    background: #2b4b95;
    border-bottom: 1px solid #fff;
    box-shadow:0 2px 2px #999;
    z-index: 6;
}

#header #global ul
{
    margin: 0 auto;
    width: 980px;
}
    
#header #global ul li
{
    float:left;
    width:14opx;
}

/* footer */
#totop
{
    width: 980px;
    margin: 0 auto;
    text-align: right;
}

#footer
{
    background: #f6f6f6;
    border-top: 1px solid #c5c5c5;
    padding: 15px 0;
    text-align: center;
}

#footer .copyright
{
    margin: 100px 0 0 0;
}

/* common */
.cbox
{
    border: 5px solid #f6f6f6;
    padding: 20px;
    margin: 0 auto 30px auto;
}

.cbox h2
{
    width: 980px;
    padding: 0 0 5px 0;
    background: url(../images/h2bg.png) no-repeat bottom center;
    position: relative;
    top: -10px;
    left: -25px;
    z-index: 3;
}

.cbox h2 span
{
    display: block;
    width: 100%;
    padding: 10px;
    background: #2b4b95 ;
    color: #fff;
    font-size: 170%;
    font-weight: bold;
}

.cbox h3
{
    background: url(../images/h3bg.png) no-repeat left center #ffab09;
    color:#fff;
    font-size: 140%;
    padding: 10px 0 10px 20px;
    margin: 0 0 10px 0;
}

.cbox .onethird
{
    width: 300px;
}

.cbox .twothirds
{
    width: 615px;
}

.cbox .quarter
{
	width: 210px;
}

.cbox .half
{
	width: 450px;
}

.cbox p
{
    padding:0 0 10px 0;
    line-height: 170%;
}

.cbox p.llh
{
	line-height: 130%;
}

#subvisual
{
    width: 100%;
    height: 266px;
    margin: 0 auto;
    position: relative;
    top: -42px;
    background: #f6f6f6;
    margin: 0 0 -20px 0;
    border-bottom: 1px solid #c5c5c5;
}
#subvisual #sv
{
    width: 980px;
    height: 265px;
    margin: 0 auto;
    position: relative;
}
#subvisual img
{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
}

#breadcrumb
{
    width: 420px;
    position: absolute;
    top: 0;
    left: 0;
    z-index:5;
    padding: 5px 0 0 10px;
}

/* top */
#mainvisual
{
    width: 100%;
    height: 341px;
    margin: 0 auto;
    position: relative;
    top: -42px;
    background: #f6f6f6;
    margin:0 0 -20px 0;
    border-bottom: 1px solid #c5c5c5;
}

#mainvisual #mv
{
    width: 980px;
    margin: 0 auto;
}

#mainvisual ul li
{
    padding:10px 0 0 0;
}

.top_brandlist
{
    width:300px;
    height: 100px;
    position: relative;
    margin: 0 0 15px 0;
}

.top_brandlist dt
{
    width:300px;
    height: 100px;
    position: relative;
    top:0;
    left: 0;
    z-index: 4;
}

.top_brandlist dd
{
    display: inline;
    position: relative;
    top:-40px;
    left: 10px;
    z-index: 5;
}

.top_brandlist dd a
{
    text-decoration:none;
}

.newslist
{
    
}
.newslist dt,
.newslist dd
{
    padding: 8px 0 3px 10px;
    border-bottom: 1px dotted #000;
}

.newslist dt
{
    width:10%;
    float: left;
}

.newslist dd
{
    width:90%;
    float: right;
}

.top_shop
{
    width: 930px;
    height:160px;
    margin: 0 0 15px 0;
    background: url(../images/top_shop.jpg) no-repeat left top;
}

.top_deliver
{
    width: 930px;
    height:165px;
    background: url(../images/top_deliver.jpg) no-repeat left top;
}

.top_shop li,
.top_deliver li
{
    float: left;
    display: block;
    width: 185px;
    padding: 10px 0;
}

.top_shop li img,
.top_deliver li img
{
    margin: 0 0 10px 0;
}

.top_shop li.step1,
.top_deliver li.step1
{
    margin: 0 0 0 115px;
}

.top_shop li.step2,
.top_shop li.step3,
.top_deliver li.step2,
.top_deliver li.step3
{
    margin: 0 0 0 125px;
}

/* shop */
.shop_step1,
.shop_step2,
.shop_step3
{
    height: 235px;
}

.shop_step1 p,
.shop_step2 p,
.shop_step3 p,
.shop_step4 p
{
    padding:10px 300px 0 0;
}
.shop_step1
{
    background: url(../images/shop_step1_bg.jpg) no-repeat right 35px;
}

.shop_step2
{
    background: url(../images/shop_step2_bg.jpg) no-repeat right 34px;
}

.shop_step3
{
    background: url(../images/shop_step3_bg.jpg) no-repeat right 35px;
}

.shop_step4
{
    background: url(../images/shop_step4_bg.jpg) no-repeat right 34px;
    height: 215px;
}

#gmap
{
    width: 455px;
    height:515px;
    float: left;
}

.shop_detail
{
    width: 455px;
    float: right;
    border-bottom: 1px dotted #000;
}

.shop_detail dt,
.shop_detail dd
{
    border-top: 1px dotted #000;
    padding: 10px 0;
    float: left;
}

.shop_detail dt
{
    width: 80px;
}

.shop_detail dd
{
    width: 375px;
}

/* delivery */
.delivery_merit1,
.delivery_merit2,
.delivery_merit3,
.delivery_merit4
{
    width:455px;
    height:235px;
}

.delivery_merit1
{
    background: url(../images/delivery_merit1_bg.jpg) no-repeat top left;
    margin:0 0 15px 0;
}

.delivery_merit2
{
    background: url(../images/delivery_merit2_bg.jpg) no-repeat top left;
    margin:0 0 15px 0;
}

.delivery_merit3
{
    background: url(../images/delivery_merit3_bg.jpg) no-repeat top left;
}

.delivery_merit4
{
    background: url(../images/delivery_merit4_bg.jpg) no-repeat top left;
}

.delivery_merit1 dt,
.delivery_merit2 dt,
.delivery_merit3 dt,
.delivery_merit4 dt
{
    text-align: center;
    padding: 9px 0 0 0;
}

.delivery_merit1 dd,
.delivery_merit2 dd,
.delivery_merit4 dd
{
    padding:30px 10px 0 220px;
}

.delivery_merit3 dd
{
    padding:60px 10px 0 220px;
}

/* kit */
.kit_steptext
{
	width:600px;
	float:left;
	margin: 0 20px 20px 0;
}

.kit_steptext p
{
	padding: 10px 0 20px 0;
}

.kit_steptext img
{
	margin: 0 5px;
}

/* visit */
.visit_merit
{
    width: 210px;
}

.visit_merit dt
{
    padding:0 0 10px 0;
}

/* diamond */
.bought_shop,
.bought_delivery,
.bought_visit
{
	width: 80%;
	margin: 5px auto;
}

.bought_shop dt,
.bought_delivery dt,
.bought_visit dt,
.bought_shop dd,
.bought_delivery dd,
.bought_visit dd
{
	padding: 3px 0;
	width: 50%;
	text-align: center;
	float: left;
}

.bought_shop dt,
.bought_delivery dt,
.bought_visit dt
{
	color: #fff;
}

.bought_shop dt
{
	border: 2px solid #1695e5;
	background: #1695e5;
}

.bought_delivery dt
{
	border: 2px solid #ff9f09;
	background: #ff9f09;
}

.bought_visit dt
{
	border: 2px solid #fc6238;
	background: #fc6238;
}

.bought_shop dd
{
	border: 2px solid #1695e5;
}

.bought_delivery dd
{
	border: 2px solid #ff9f09;
}

.bought_visit dd
{
	border: 2px solid #fc6238;
}


/* quote */
.form_quote dl
{
    width: 60%;
	margin: 0 auto;
}

.form_kit dl
{
    width: 80%;
	margin: 0 auto;
}

.form_quote dt,
.form_kit dt
{
    padding:11px 0 10px 0;
	line-height: 140%;
	float: left;
	width: 40%;
}

.form_kit dt
{
	width: 25%;
}

.form_quote dd,
.form_kit dd
{
    padding:10px 0;
	border-top: 1px dotted #000;
}

.form_kit dd dl
{
	width: 75%;
	background: #eee;
	float: right;
	margin:0 0 10px 0;
	border: 1px solid #bbb;

}

.form_kit dd dl dt,
.form_kit dd dl dd
{
	border: none;
	float:left;
	padding: 5px;
}

.form_kit dd dl dt.kftitle
{
	float:none;
	width: 100%;
	border-bottom: 1px solid #bbb;
	background: #fff;
}

.form_kit dd dl dt
{
	width: calc(16% - 10px);
}
.form_kit dd dl dd
{
	width: calc(37% - 10px);
}

.form_kit dd dl dd.kfw
{
	width: 100%;
}

.form_kit dd dl dd input
{
	width: 100%;
}

.form_quote dd input,
.form_quote dd select,
.form_kit dd input,
.form_kit dd select
{
	width: 60%;
}

.form_quote dd input.short,
.form_kit dd input.short
{
	width: 20%;
}

.form_quote dd textarea.mid
{
	width: 60%;
	height:100px;
}

.form_kit dd.kfw textarea
{
	width: 100%;
	height:100px;
}

.form_quote dd input[type="radio"],
.form_kit dd input[type="radio"]

{
	width: auto;
}

.form_quote .send,
.form_quote .reset,
.form_kit .send,
.form_kit .reset
{
	width: 30%;
	margin: 10px 5px;
	padding: 5px 0;
	font-size: 180%;
}

/* company */
.company
{
	width: 80%;
	margin: 0 auto;
	border-top: 1px dotted #000;
}

.company dt,
.company dd
{
	padding: 10px 0;
	border-bottom: 1px dotted #000;
}

.company dt
{
	width: 30%;
	float: left;
}
.company dd
{
	width: 70%;
	float: right;
}

img.cal /* for demo purpose only - use WordPress Spider Calendar */
{
	width: 200px;
	margin: 0 10px;
}

ol.privacy
{
	list-style: decimal;
	margin: 0 0 0 25px;
	font-size: 160%;
	line-height: 120%;
}

ol.privacy ul
{
	font-size: 63%;
	line-height: 140%;
	margin: 5px 0 15px 0;
}

ol.privacy ul li.sublist
{
	list-style: square;
	margin: 0 0 0 20px;
}

/* faq */
.faq
{
	border-bottom: 1px dotted #000;
}

.faq dt
{
	background: url(../images/icon_q.png) no-repeat left center;
	padding:0 30px;
}

.faq dd
{
	background: url(../images/icon_a.png) no-repeat left top;
	padding: 5px 30px;
	display: none;
}

.faq dt p
{
	background: url(../images/icon_open.png) no-repeat right center;
	padding: 10px 0;
}

.faq dt p.open
{
	background: url(../images/icon_close.png) no-repeat right center;
}
