@charset "utf-8";

/* ------------------------------------------------------------ index */

#firstview { background: #000; text-align: center; }
#firstview { position: relative; }
#firstview p { position: absolute; z-index: 10; width: 1100px; left: 0; right: 0; margin: 0 auto; text-align: left; padding: 90px 0 0;}
#firstview ul.thumb-item { position: relative; padding-top: 45.75%; }
#firstview ul.thumb-item li { position: absolute; top: 0; left: 0; right: 0; background: #231815; display: none; }
#firstview ul.thumb-item li.t1 { display: block; }
#firstview ul.thumb-item li img { width: 100%; height: auto; margin: 0 auto;}
#firstview ul.thumb-item-nav { position: absolute; bottom: -28px; text-align: center; width: 100%; }
#firstview ul.thumb-item-nav li { display: inline-block; *display: inline; float: none;  width: 118px !important;}
#firstview ul.thumb-item-nav li img { border: 1px solid #7e7e7e; cursor: pointer; }
#firstview ul.thumb-item-nav .slick-track { margin: 0 auto; }
#firstview ul.thumb-item-nav .slick-track li { cursor: pointer; }

#firstview .PC { display: block; }
#firstview .SP { display: none; }


#about { background: url(../images/index/bg_01.gif) center top no-repeat #060606; text-align: center; padding: 185px 0 100px;}
#about h2 { font-size: 20px; letter-spacing: 4px; line-height: 40px; padding: 0 0 35px; font-family: serif; }
#about p { line-height: 34px; padding: 0 0 20px;}

#order { background: url(../images/index/bg_02.jpg) center top no-repeat #000; text-align: center; padding: 70px 0 90px; }
#order h3 { padding: 0 0 230px;}
#order ul li { float: left; width: 50%;}
#order ul li h4 { padding: 0 0 20px;}

#reservation { background: url(../images/index/bg_03.jpg) center top no-repeat #000; padding: 70px 0;}
#reservation .box { float: right; width: 490px; text-align: center;}
#reservation .box h3 { font-size: 16px; padding: 0 0 45px;}
#reservation .box p { font-size: 16px; line-height: 28px; letter-spacing: 1px;}

#stock { background: url(../images/index/bg_08.jpg) center bottom no-repeat #1a1a1a; padding: 70px 0 60px; background-size: contain;}
#stock ul.top { max-width: 1400px; margin: 0 auto; }
#stock .inner { padding: 70px 0 60px; background-size: contain;}
#stock #wrap-stock-category { width: 100%; background: #0d0a0a; }

#entrance { background: url(../images/index/bg_12.jpg) center top no-repeat #000; padding: 50px 0 70px; background-size: cover;}
#entrance h3 span { font-size: 60px;}
#entrance .rental,
#entrance .consultation { float: left; width: 540px; text-align: center; padding: 310px 0 40px;}
#entrance p.text { font-size: 16px; padding: 10px 0 0;} 
#entrance .rental { background: url(../images/index/pic_28.jpg) center top no-repeat #1a1a1a; margin: 0 20px 0 0;}
#entrance .consultation { background: url(../images/index/pic_29.jpg) center top no-repeat #1a1a1a;}

@media only screen and (max-width:640px){

/* ------------------------------------------------------------ common */

/* ------------------------------------------------------------ firstview */

#firstview p img { width: 100%; margin: auto; height: auto; }
#firstview p { width: 90%; padding: 10% 5%; }
#firstview ul.thumb-item { padding-top: 107.28%; }
#firstview ul.thumb-item-nav { bottom: -5%; }
#firstview ul.thumb-item-nav li { width: 18% !important; padding: 0 0.5% 0;  }
#firstview ul.thumb-item-nav li img { width: 100%; height: auto; }
#firstview .PC { display: none; }
#firstview .SP { display: block; }

/* ------------------------------------------------------------ about */

#about { background: url(../images/index/bg_01_sp.jpg) center 8% no-repeat #000; padding: 110px 5% 50px; background-size: cover; }
#about h2 { font-size: 17px; line-height: 170%; letter-spacing: 2px; padding: 0 0 15px;}
#about p { font-size: 14px; padding: 10px 0 0; line-height: 220%; }

/* ------------------------------------------------------------ order */

#order { background: #000; padding: 5% 0 0; }
#order .inner { width: 100%; padding: 0; }
#order h3 { padding: 0 0 2%;}
#order ul li { float: none; width: 100%; }
#order ul li h4 { font-size: 50px; line-height: 120%; padding: 0 0 15px; }
#order ul li h4 span { font-size: 14px; }
#order ul li.order_1 { background: url(../images/index/order_bg1_sp.jpg) center top no-repeat #000; background-size: 100% auto; padding: 60% 0 5%; }
#order ul li.order_2 { background: url(../images/index/order_bg2_sp.jpg) center center no-repeat #000; background-size: 100% auto; padding: 60% 0 10%; }

/* ------------------------------------------------------------ stock */
#stock .inner { padding: 0; }

/* ------------------------------------------------------------ reservation */

#reservation { background: url(../images/index/bg_03_sp.jpg) center top no-repeat #000; background-size: contain; padding: 8% 0 65px; }
#reservation .box { float: none; width: 100%; text-align: center;}
#reservation .box h3 { padding: 0 0 18%; font-size: 14px; }
#reservation .box h3 span { font-size: 55px; padding: 0; }
#reservation .box p { font-size: 13px; }
/* ------------------------------------------------------------ reservation */

#stock { background: url(../images/index/bg_08.jpg) center top no-repeat #000; padding: 40px 0 10%; background-size: contain;}

#entrance { padding: 5% 0; }
#entrance p.text { font-size: 12px; }
#entrance .rental, #entrance .consultation { width: 100%; margin-bottom: 10px; background-size: contain; padding: 55% 0 30px; }
#entrance h3 span { font-size: 50px; }

}