@charset "utf-8";

/* reset */
*{font-size:100%; -webkit-backface-visibility: hidden; backface-visibility: hidden;}
body,h1,h2,h3,h4,h5,h6,div,p,ul,ol,li,dl,dt,dd,pre,form,blockquote,fieldset,input,address,th,td{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6,caption,address,em{ font-style:normal; font-weight:500;}
ul,ol,li,dl,dt,dd{list-style-type:none;list-style-position:outside;}
table{border-spacing:0;border-collapse:collapse;}
fieldset{border:none;}
img{border:0;vertical-align:bottom; width:100%; height:auto;}
br{letter-spacing:0;}
button,fieldset,form,input,label,legend,select,textarea,optgroup{font-family:inherit;font-style:inherit;font-weight:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline;}
optgroup{font-style:normal;}

/* clearfix */
.clearfix{ zoom:1;}
.clearfix:after{ content:""; display:block; clear:both;}

/* basic */
html,body{ width:100%;}
body{ font-family: "Roboto", "ヒラギノ角ゴ Pro W3", "Hiragino Kakugo Pro W3","游ゴシック", "Yu Gothic", "メイリオ", Meiryo, sans-serif; font-size:13px; font-weight:400; color:#000; line-height:1.8; background-color:#FFF;}

a{ color:#000; text-decoration:none;}
a:hover{}

.inner{ width:85%;/*544/640*/ margin:0 auto;}

#splash{ background:#FFF; position:fixed; top:0; right:0; bottom:0; left:0; z-index:9999; display:none;}
#splash .splash-logo{ width:200px; position:absolute; top:55%; left:50%; z-index:999; margin:-100px 0 0 -100px; opacity:0; transition:1s;}
#splash .splash-logo.action{ top:50%; opacity:1;}

#menu-open{ position:fixed; top:0; right:0; width:13.75%;/*88/640*/ padding:2.5% 2.5% 0 0;/*16 16 0 0/640*/ z-index:999; display:none;}

#menu{ background: rgba(0,0,0,0.9); width:100%; padding:40px 0; position:fixed; top:0; right:0; bottom:0; left:0; z-index:9999; display:none;}
#menu .menu-close{ width:6.875%;/*44/640*/ position:absolute; top:16px; right:16px;}
#menu .menu-list{ text-align:center; padding-top:31.25%;/*200/640*/}
#menu .menu-list li{ font-size:20px; font-weight:900; line-height:1; margin-bottom:25px;}
#menu .menu-list li span{ background:url(../img/icon_blank.png) no-repeat right center; background-size:16px auto; padding-right:24px;}
#menu .menu-list li a{ color:#FFF; border-left:3px solid #000; transition:0.2s; padding-left:20px;}

#top{ position:relative;}
#top .top-logo{ width:200px; position:absolute; top:50%; left:50%; z-index:999; margin:-100px 0 0 -100px;}
#top .top-scroll{ width:36px; position:absolute; bottom:30px; left:50%; z-index:999; margin-left:-26px;}
#top .main-slider{}
#top .main-slider li{ background-position:center; background-size:cover; background-repeat:no-repeat; height:100%;}

#concept{ padding:7.5% 0;/*48 0/640*/ border-bottom:1px solid #ddd;}
#concept .concept-inner{ padding-bottom:12.5%;/*80/640*/ margin:0 auto; background:url(../img/bg_concept.jpg) no-repeat center center; background-size:cover;}
#concept .concept-inner h2{ padding:7.35294% 0 12.86764% 0;/*40 0 70 0/544*/}
#concept .concept-txt{ width:70.58823%;/*384/544*/ margin:0 auto; background:#FFF; text-align:center; padding:25px; box-sizing:border-box;}
#concept .concept-txt h3{ width:133px; margin:0 auto; padding-bottom:30px;}

#news{ padding:18.75% 0 12.5% 0;/*120 0 80 0/640*/ border-bottom:1px solid #ddd;}
#news h2{ padding-bottom:7.35294%;/*40/544*/}
#news .news-body{ padding:5.5147% 0;/*30 0/544*/}
#news .news-body .date{ font-weight:900; line-height:21px; display:inline-block; padding-right:10px;}
#news .news-body .new-icon{ display:inline-block; width:40px;}
#news .news-body h3{ font-size:16px; border-bottom:2px solid #000; margin:15px 0;}
#news .news-body p{ margin-bottom:1em;}
#news .news-body a{ color: #000; text-decoration: underline;}
#news .news-more-btn{ text-align:center;}
#news .news-more-btn span{ display:inline-block; width:31.25%;/*200/640*/}

#items{ padding:18.75% 0 12.5% 0;/*120 0 80 0/640*/}
#items h2{ padding-bottom:7.35294%;/*40/544*/}
#items ul.item-list{}
#items ul.item-list li{ float:left; width:50%;/*272/544*/ margin-bottom:2.94117%;/*16/544*/}
#items .items-more-btn{ text-align:center; padding:40px 0;}
#items .items-more-btn span{ display:inline-block; width:31.25%;/*200/640*/}

.item-modal-top{ width:80.88235%;/*440/544*/ margin:0 auto; padding-top:60px;}
.item-modal-pic{}
.thumb-list{ margin-top:1px;}
.thumb-list li{ float:left; width:25%; padding:0 1px 1px 0; box-sizing:border-box;}
.thumb-list li img{ width:100%; height:auto;}
.item-modal-btm{ color:#FFF; margin-top:10px;}
.item-modal-btm h3{ font-size:16px; border-bottom:2px solid #FFF; padding:10px 0; margin-bottom:10px;}
.item-modal-btm p{ margin-bottom:15px;}
.modal-btn-online-store{ text-align:center;}
.modal-btn-online-store span{ display: inline-block; width:167px;}

#dealer-list{ padding:18.75% 0 12.5% 0;/*120 0 80 0/640*/ background:url(../img/bg_dealer_list.jpg) no-repeat center center; background-size:cover;}
#dealer-list h2{ padding-bottom:7.35294%;/*40/544*/}
#dealer-list .dealer-menu{ position:relative;}
#dealer-list .dealer-menu-icon{ width:16px; position:absolute; top:-2px; right:0; z-index:999;}
#dealer-list .scroll-area{ margin-bottom:38px;}
#dealer-list .scroll-area ul{ width:94.11764%;/*512/544*/ overflow-x:scroll; white-space:nowrap;}
#dealer-list .scroll-area li{ display:inline-block; color:#FFF; border-right:1px solid #FFF; width:70px; text-align:center; color:#FFF; line-height:1; cursor:pointer;}
#dealer-list .dealer-body{ height:378px; background:#FFF; padding:40px; overflow-y:auto;}
#dealer-list .dealer-area{}
#dealer-list .dealer-area li{ border-bottom:1px solid #ccc; padding:30px 0;}
#dealer-list .dealer-area li:last-child{ border:none;}
#dealer-list .dealer-area li table{ width:100%;}
#dealer-list .dealer-area li table th{ font-size:16px; margin-bottom:10px;}
#dealer-list .dealer-area li table td{ display:block;}

#contact{ background:#000; padding:18.75% 0 12.5% 0;/*120 0 80 0/640*/}
#contact h2{ padding-bottom:7.35294%;/*40/544*/}
#contact .contact-inner{}
#contact table{ display:block; color:#FFF;}
#contact table tbody,#contact table tr{ display:block;}
#contact table th{ display:block; text-align:left; margin-bottom:10px; font-size:12px;}
#contact table td{ display:block; padding-bottom:25px;}
#contact table input,#contact select,#contact textarea{ width:100%; border:none; border-radius:0; background:#FFF; padding:10px; box-sizing:border-box; font-size:16px;-webkit-appearance: none; appearance: none}
#contact table td div{ margin-bottom:20px;}
#contact input.name{}
#contact input.tel{}
#contact input.mail{}
#contact input.zip01{ width:60px; margin:0 5px;}
#contact input.zip02{ width:70px; margin:0 5px;}
#contact input.address{}
#contact textarea.inquiry{}
#contact .submit-btn{ text-align:center;}
#contact .submit-btn input{ background:url(../img/btn_confirm.png) no-repeat 0 0; width:180px; height:54px; background-size:contain; border:none; cursor:pointer; margin-bottom:200px;}

#footer{ background:#FFF; color:#000; height:32px; line-height:32px;}
#footer .copyright{ text-align:center; font-size:10px;}