@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&subset=japanese');

/* --------------------------------------------------
 normalize.css v3.0.2 | MIT License | git.io/normalize
--------------------------------------------------- */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0;}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block;}audio,canvas,progress,video{display:inline-block;vertical-align:baseline;}audio:not([controls]){display:none;height:0;}[hidden],template{display:none;}a{background:transparent;}a:active,a:hover{outline:0;}h1,h2,h3,h4,h5{font-weight:normal;font-size:100%;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}mark{background:#ff0;color:#000;}small{font-size:80%;}sub,sup{position:relative;vertical-align:baseline;font-size:75%;line-height:0;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;vertical-align:bottom;}svg:not(:root){overflow:hidden;}figure{margin:0;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}pre{overflow:auto;}code,kbd,pre,samp{font-size:1em;font-family:monospace,monospace;}button,input,optgroup,select,textarea{margin:0;color:inherit;font:inherit;}button{overflow:visible;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button;}button[disabled],html input[disabled]{cursor:default;}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0;}input{line-height:normal;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto;}input[type="search"]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}fieldset{margin:0 2px;padding:.35em .625em .75em;border:1px solid silver;}legend{padding:0;border:0;}textarea{overflow:auto;}optgroup{font-weight:bold;}table{border-spacing:0;border-collapse:collapse;}td,th{padding:0;}ul{padding:0;}ul li{list-style:none;}address{ font-style: normal;}

/* --------------------------------------------------
 common
--------------------------------------------------- */
html{ width: 100%; font-size: 62.5%;}
body{
    min-width: 1100px;
    width: 100%;
    background: #6f2406;
    color: #64463a;
    font-size: 1.4rem;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1;

    -webkit-text-size-adjust: 100%;
}

@media screen and (max-width: 768px){
    body{
        min-width: 0;
    }
}

#wrap{ overflow: hidden;}
*, *:after, *:before{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
a{ color: #6f2406; text-decoration: underline;}
a:hover{ text-decoration: none;}
#wrap{ overflow: hidden;}
img{ max-width: 100%; width: 100%;}
.sp{ display: none;}

@media screen and (max-width: 768px){
    img{ max-width: auto; width: auto;}
    .pc{ display: none;}
    .sp{ display: block;}
}

/* --------------------------------------------------
 header
--------------------------------------------------- */
.header{ height: 90px; background: #6f2406 url(/img_common/blt_header.gif) top left repeat-x;}
.header-inner{ position: relative;}
.header h1{ position: absolute; top: 5px; left: 50px;}
.header .logo{ position: absolute; top: 5px; left: 0;}
.header nav:after{ display: block; clear: both; content: "";}
.header nav ul{position: absolute; top: 5px; right: 0;  display: flex; border-left: 1px solid #55210c; justify-content: flex-end; }
.header nav li{ border-right: 1px solid #55210c;}
.header nav a{ display: block; padding: 0 30px; height: 85px; color: #fff; vertical-align: middle; text-decoration: none;line-height: 85px; }
.header nav a:hover{ background: #55210c;}
.header nav a span{ display: inline-block;padding: 20px 0 0;line-height: normal; }
.stuck{ position: fixed; top: 0; left: 0; z-index: 99999; width: 100%;}

@media screen and (max-width: 768px){
    .header{ height: 65px;}
    .header-inner{ width: 100%;}
    .header nav{ display: none;}
    .header h1{ position: relative; top: auto; left: auto; padding: 10px 0 0; text-align: center;}
    .header h1 a.sp{ display: inline-block; color: #fff; text-decoration: none; font-weight: 700; font-size: 1.2rem; line-height: 1.5;}
    .header h1 span{ display: block; font-size: 1.8rem;}
}

/* --------------------------------------------------
 layout
--------------------------------------------------- */
.content{ background: #ece5df url(/img_common/bg_2nd.png) top center;}
.content-inner{ margin: 0 auto; padding: 30px 0 60px; width: 1080px;}
article{ position: relative; z-index: 999; margin: -80px auto 0; padding: 0 0 60px; width: 1080px;}
.reserve{ margin: 0 auto; padding: 30px 0 60px;}
section + section{ margin: 30px 0 0;}
.tpl-2nd article header h1{ overflow: hidden; height: 0; text-indent: 100%; white-space: nowrap;}
.row2{ display: flex; margin: 30px 0 0; padding: 30px; border-radius: 5px; background: #fff; box-shadow: 0px 0px 3px 1px rgba(0,0,0,.1); justify-content: space-between;}
.row2 .row{ padding: 0 30px 0 0; width: 61.8%;}
.row2 .row + .row{ padding: 0 0 0 30px; width: 38.2%;}
section p{ margin: 15px 0 0; line-height: 1.8;}

@media screen and (max-width: 768px){
    .content-inner{ padding: 20px 20px 40px; width: 100%;}
    article{ margin: 0; padding: 20px 20px 40px; width: 100%;}
    .reserve{ margin: 0; padding: 20px 20px 40px;}
    section + section{ margin: 20px 0 0;}
    .row2{ display: block; margin: 20px 0 0; padding: 20px;}
    .row2 .row{ padding: 0; width: 100%;}
    .row2 .row + .row{ margin: 20px 0 0; padding: 0; width: 100%;}
    section p{ margin: 10px 0 0;}
}

/* --------------------------------------------------
 module
--------------------------------------------------- */
.main{ position: relative;}
.main-inner{ margin: 0 auto;}
.main ul{ display: flex;}
.main li{ position: relative; width: 25%;}
.main a{ display: block;}
.main figcaption{ position: absolute; bottom: 4%; left: 4%; width: 100%;}
.main span{ display: inline-block; padding: 8px 16px; background: #fff; font-weight: 700;}
.main .name{ font-size: 2.4rem;}
.main i{ display: inline-block; margin: 0 0 0 1rem;}
.main img{ width: 100%;}

@media screen and (max-width: 768px){
    .main ul{ display: block; max-width: none;}
    .main li{ position: relative; width: 100%;}
    .main .name{ font-size: 2.4rem;}
}

.box{ padding: 30px; border-radius: 5px; background: #fff; box-shadow: 0px 0px 3px 1px rgba(0,0,0,.1);}
.slider + .box{ margin: 30px 0 0;}
.box dl{ display: flex; justify-content: space-between;}
.box dt{ width: 30%; font-weight: 700; font-size: 3rem; line-height: 1.5;}
.box dt span{ display: block; margin: 5px 0 0; font-weight: 400; font-size: 1.6rem;}
.box dd{ display: flex; width: 70%; justify-content: space-between; align-items: center;}
.box dd div{ padding: 30px 0; width: 32%; border-radius: 5px; background: #6f2406; box-shadow: 0px 0px 3px 1px rgba(0,0,0,.1); color: #fff; text-align: center;}
.box h2{ font-weight: 700; font-size: 2rem;}
.box ul{ display: flex; margin: 15px -10px 0; justify-content:center;}
.box li{ padding: 0 10px;}
.box i{ display: inline-block; margin: 0 .5rem 0 0;}
.box li a{ color: #fff; font-size: 1.6rem;}

@media screen and (max-width: 768px){
    .box{ padding: 20px;}
    .slider + .box{ margin: 20px 0 0;}
    .box dl{ display: block;}
    .box dt{ width: 100%; text-align: center; font-size: 2.4rem;}
    .box dt span{ font-size: 1.6rem;}
    .box dd{ display: block; width: 100%;}
    .box dd div{ margin: 10px 0 0; padding: 20px 0; width: 100%;}
    .box h2{ font-size: 2rem;}
    .box ul{ margin: 10px -10px 0;}
    .box li a{ color: #fff; font-size: 1.8rem;}
}

.info-wrap{ margin: 0 -15px; text-align: left;}
.info{ display: inline-block; margin: 30px 0 0; padding: 0 15px; width: calc(100% /3); vertical-align: top; font-size: 1.4rem; line-height: 1.5;}
.info .inner{ position: relative; padding: 30px; border-radius: 5px; background: #fff; box-shadow: 0px 0px 3px 1px rgba(0,0,0,.1);}
.info time{ display: inline-block; font-size: 1.2rem;}
.info time + span{ position: absolute; top: 0px; right: 30px; display: inline-block; padding: 10px; background: #6f2406; color: #fcf4ec; font-size: 1.2rem; line-height: 1;}
.info h3{ padding: 0 0 5px; border-bottom: 1px solid; font-weight: 700; font-size: 2rem;}
.info .entry-body{ margin: 15px 0 0;}
.info .entry-body p{ margin: 0;}
.info .entry-body p + p{ margin: 1em 0 0;}

@media screen and (max-width: 768px){
    .info-wrap{ margin: 0;}
    .info{ display: block; margin: 20px 0 0; padding: 00; width: 100%;}
    .info .inner{ padding: 20px;}
    .info time + span{ right: 20px;}
    .info h3{ font-size: 1.6rem;}
    .info .entry-body{ margin: 10px 0 0;}
}

.tpl-2nd .box1 dt{ width: 50%; font-size: 2.8rem;}
.tpl-2nd .box1 dt span{ margin: 5px 0 0;}
.tpl-2nd .box1 dd{ width: 50%;}
.tpl-2nd .box1 dd div{ width: 48%;}
.tpl-2nd .box2 dt{ width: 50%; font-size: 2.8rem;}
.tpl-2nd .box2 dt span{ margin: 5px 0 0;}
.tpl-2nd .box2 dd{ width: 50%;}
.tpl-2nd .box2 dd div{ padding: 0; width: 100%; border-radius: 0; background: none; box-shadow: none;}
.tpl-2nd .box2 li a{ display: block; padding: 30px; border-radius: 5px; background: #6f2406; box-shadow: 0px 0px 3px 1px rgba(0,0,0,.1); color: #fff; font-size: 2.4rem;}

@media screen and (max-width: 768px){
    .tpl-2nd .box1 dt{ width: 100%; font-size: 2rem;}
    .tpl-2nd .box1 dt span{ text-align: left; font-size: 1.4rem;}
    .tpl-2nd .box1 dd{ width: 100%;}
    .tpl-2nd .box1 dd div{ width: 100%;}
    .tpl-2nd .box2 dt{ width: 100%; font-size: 2rem;}
    .tpl-2nd .box2 dt span{ text-align: left; font-size: 1.4rem;}
    .tpl-2nd .box2 dd{ width: 100%;}
    .tpl-2nd .box2 li a{ padding: 20px; font-size: 1.6rem;}
}

.slider{ overflow: hidden; margin: 0 auto; max-width: 1360px;}

@media screen and (max-width: 768px){
    .slider{ max-width: none;}
}

.concept{ line-height: 1.8;}
.concept h2{ margin: 30px 0 0; font-weight: 700; font-size: 2rem;}
.concept h2:first-child{ margin: 0;}

@media screen and (max-width: 768px){
    .concept h2{ margin: 20px 0 0; font-size: 1.6rem; line-height: 1.5;}
    .concept h2:first-child{ margin: 0;}
}

.list-price{ padding: 15px 45px; border: 3px double; line-height: 1.5;}
.list-price li{ font-size: 2.4rem;}
.list-price span{ display: inline-block; margin: 0 0 0 .2rem; font-weight: normal; font-size: 1.2rem;}

@media screen and (max-width: 768px){
    .list-price{ padding: 20px;}
    .list-price li{ font-size: 1.8rem;}
    .list-price span{ margin: 0 0 0 .1rem;}
}

.system h2{ margin: 30px 0 0; font-weight: 700; font-size: 2rem;}

@media screen and (max-width: 768px){
    .system h2{ margin: 20px 0 0; font-size: 1.6rem;}
}

.list-num{ margin: 15px 0 0 1.8rem; line-height: 1.5;}
.list-num li{ margin: 10px 0 0;}
.list-num li:first-child{ margin: 0;}

@media screen and (max-width: 768px){
    .list-num{ margin: 10px 0 0 1.6rem;}
}

.list-imp{ margin: 15px 0 0; line-height: 1.5;}
.list-imp li{ padding: 0 0 0 1.4rem; text-indent: -1.4rem;}

@media screen and (max-width: 768px){
    .list-imp{ margin: 10px 0 0;}
}

.shopinfo h2{ margin: 45px 0 0; padding: 0 0 10px; border-bottom: 1px solid; font-weight: 700; font-size: 2rem;}
.shopinfo h2:first-child{ margin: 0;}
.shopinfo p:first-child{ margin: 0;}
.shopinfo .map{ margin: 15px 0 0;}
.map iframe{ width: 100%; height: 300px; vertical-align: bottom;}

@media screen and (max-width: 768px){
    .shopinfo h2{ margin: 20px 0 0; font-size: 1.6rem;}
    .shopinfo .map{ margin: 10px 0 0;}
    .map iframe{ height: 200px;}
}

.row2s{ margin: 30px 0 0; padding: 60px; border-radius: 5px; background: #fff; box-shadow: 0px 0px 3px 1px rgba(0,0,0,.1); text-align: center; line-height: 1.8;}
.row2s h2{ position: relative; margin: 60px 0 0; font-weight: 700; font-size: 2rem;}
.row2s h2:after{ position: absolute; top: 50%; left: 50%; width: 60%; height: 1px; background: #64463a; content: ""; transform: translate(-50%,-50%);}
.row2s h2 span{ position: relative; z-index: 20; display: inline-block; padding: 0 2em; background: #fff;}
.row2s > h2:first-child{ margin: 0;}
.row2s > h2:first-child:after{ content: none;}
.row2s h2 + p{ margin: 15px 0 0; font-size: 1.6rem;}
.row2s .list-num{ display: inline-block; margin: 30px 0 0; font-size: 1.6rem;}
.row2s .list-num > li{ text-align: left;}
.row2s .list-num + p{ margin: 15px 0 0; font-size: 1.3rem;}
.row2s .list-row{ display: flex; justify-content: space-between;}
.row2s .list-row > li{ padding: 0 15px; width: calc(50% - 15px); text-align: left;}
.row2s .list-row h2{ margin: 0;}
.row2s .list-row h2:after{ width: 100%;}
.row2s .list-row h2 span{ padding: 0 2em 0 0;}
.row2s .list-row p{ margin: 15px 0 0; font-size: 1.3rem;}
.row2s .list-price{ margin: 30px 0 0;}
.row2s .map{ margin: 30px 0 0;}

@media screen and (max-width: 768px){
    .row2s{ margin: 30px 0 0; padding: 20px;}
    .row2s h2{ margin: 40px 0 0;}
    .row2s h2:after{ width: 100%;}
    .row2s h2 span{ padding: 0 1em;}
    .row2s h2 + p{ font-size: 1.4rem;}
    .row2s .list-num{ margin: 20px 0 0 1.4rem; display: block; font-size: 1.4rem;}
    .row2s .list-num > li{ text-align: left;}
    .row2s .list-num + p{ margin: 10px 0 0; font-size: 1.4rem; text-align: left;}
    .row2s .list-row{ flex-direction: column;}
    .row2s .list-row > li{ padding: 0; width: 100%;}
    .row2s .list-row > li + li{ margin: 40px 0 0;}
    .row2s .list-row h2 span{ padding: 0 1em 0 0;}
    .row2s .list-row p{ margin: 10px 0 0; font-size: 1.4rem;}
    .row2s .list-price{ margin: 20px 0 0;}
    .row2s .map{ margin: 20px 0 0;}
}

.how{ margin: 30px 0 0; padding: 30px; border-radius: 5px; background: #fff; box-shadow: 0px 0px 3px 1px rgba(0,0,0,.1);}
.hide{ display: none;}
.tab{ display: flex; justify-content: space-between;}
.tab li{ width: 50%; height: 60px; background: #f5f5f5; text-align: center; font-weight: 700; font-size: 2rem; line-height: 60px; cursor: pointer;}
.tab li.select{ position: relative; background: #4196ee; color: #fff;}
.tab li.select:after{ position: absolute; bottom: -10px; left: 50%; margin: 0 0 0 -5px; border-width: 10px 10px 0 10px; border-style: solid; border-color: #4195ee transparent transparent transparent; content: "";}
.tab-content figure{ display: flex; margin: 30px 0 0; justify-content: space-between; align-items: flex-start;}
.tab-content img{ width: 38.2%; border: 10px solid #eee;}
.tab-content figcaption{ padding: 0 0 0 30px;  width: 61.8%; line-height: 1.8;}
.tab-content h2{ color: #4196ee; font-weight: 700; font-size: 2.4rem;}
.tab-content h2 span{ display: inline-block; margin: 0 1.6rem 0 0;}
.tab-content p{ font-size: 1.6rem;}
.tab-content h2 + p{ margin: 15px 0 0;}
.tab-content .imp{ margin: 30px 0 0; color: #f00; font-weight: 700; font-size: 1.6rem;}
.tab-content .step{ padding: 30px 0 0; border-top: 2px solid #eee;}
.tab-content figcaption ul{ margin: 0 0 0 2rem; font-size: 1.6rem;}
.tab-content figcaption li{ margin: 15px 0 0; list-style: disc;}

@media screen and (max-width: 768px){
    .how{ margin: 20px 0 0; padding: 20px;}
    .tab li{ font-size: 1.6rem;}
    .tab-content figure{ display: block; margin: 20px 0 0;}
    .tab-content img{ width: 100%;}
    .tab-content figcaption{ margin: 10px 0 0; padding: 0; width: 100%;}
    .tab-content figcaption h2{ display: none;}
    .tab-content h2{ font-size: 1.8rem;}
    .tab-content h2 span{ margin: 0 1rem 0 0;}
    .tab-content h2 + img{ margin: 10px 0 0;}
    .tab-content p{ font-size: 1.4rem;}
    .tab-content h2 + p{ margin: 10px 0 0;}
    .tab-content .imp{ margin: 20px 0 0; font-size: 1.6rem;}
    .tab-content .step{ padding: 20px 0 0;}
    .tab-content figcaption ul{ font-size: 1.4rem;}
    .tab-content figcaption li{ margin: 10px 0 0;}
}

/* --------------------------------------------------
 footer
--------------------------------------------------- */
.footer-inner{ display: flex; padding: 25px 50px; color: #fff; justify-content: space-between;}
.footer-right{ position: relative; display: flex; flex-direction: column; text-align: right;justify-content: flex-end; }
.footer address{ display: block; color: #fff; line-height: 1.5;}
.footer address dt{ margin: 10px 0 0;}
.footer .pagetop{ position: absolute; top: 15px; right: 0; width: 45px;}
.footer nav ul{ text-align: right; font-size: 0;}
.footer nav li{ display: inline-block; margin: 0 0 0 15px; padding: 0 0 0 15px; border-left: 1px solid #fff; font-size: 1.4rem;}
.footer nav li:first-child{ border: none;}
.footer nav a{ color: #fff; text-decoration: none;}
.footer nav a:hover{ color: #fff; text-decoration: underline;}
.footer small{ display: block; margin: 10px 0 0;}

@media screen and (max-width: 768px){
    .footer-inner{ display: block; padding: 20px 20px 60px; width: 100%;}
    .footer-left{ display: block; width: 100%;}
    .footer-right{ display: block; width: 100%;}
    .footer address{ display: block; color: #fff; line-height: 1.5;}
    .footer address dt{ margin: 10px 0 0;}
    .footer .pagetop{ position: absolute; top: 0; right: 0;}
    .footer nav {display: none;}
    .footer small{ display: block; margin: 20px 0 0; text-align: left;}
}