@charset "utf-8";
/* ------------------------------------------------------------ set */
#view.pages{ background: url(../../images/hinata_hibino/information/view_01.jpg); }
#view.pages h2{ background: url(../../images/hinata_hibino/information/flower.png) no-repeat left center; padding: 10px 0 10px 120px; }

#read{ padding: 20px 0 30px;}

#lead { padding: 50px 0; text-align: center; }

#lead h3{ text-align: center; padding: 45px 0; font-size: 30px; color: #675a43; font-weight: bold; padding: 30px 0; }
#lead p { font-size: 16px; line-height: 200%; }

#main .bg_c { margin: 100px 0 0; padding: 0 0 100px; }
#main .service { padding: 50px 0 70px; }
#main .service ul{ width: 100%; padding: 0 }
#main .service li { width: 320px; float: left; font-size: 14px; text-align: center; color: #fff; margin: 0 0 20px; line-height: 3em; position: relative; }
#main .service li p { position: absolute; width: 100%; left: 0; bottom: 0; background: url(../../images/hinata_hibino/information/shadow.png) center center; text-align: left; text-indent: 10px; font-size: 14px; padding: 7px 0 2px; }

/* #main .bg_cl li p{ position: absolute; bottom: 0; left: 0; background: url(../../images/hinata_hibino/infomation/opc_b.png); color: #fff; width: 90%; padding: 3px 5%; } */

#main .container .etc li { color: #000; }
#main .container li.center { margin: 0 20px 20px; }

#main .container .flex{ display: flex; justify-content: space-between; }

#main .container .flex div img{ width: 100%; height: auto; }
#main .container .flex div:nth-child(2) img{padding: 36px 0 0;}
#main .container .flex div:first-of-type{ width: 390px; }
#main .container .flex div:last-of-type{ width: 420px; }

#main .service p{ padding: 0 0 50px; text-align: center; font-size: 16px; }
#main .service p span{ display: block; padding: 10px 0 0; font-size: 14px; }

#main .price dt{ float: left; font-size: 16px; width: 255px; padding: 30px; }
#main .price dd{ font-size: 16px; border-bottom: 1px solid #e5e5e5; padding: 30px; font-feature-settings: "palt"; }
#main .price dd.wide{ padding: 45px 30px; }
#main .price p{ padding: 10px 0 0; font-size: 16px; text-align: right; }

#main .bg_c .item{ width: 496px; margin: 0 auto; padding: 0 0 65px 0; display: block; }

#main .slider_box .slider_thumb{ margin: 0 5px; }
#main .slider_box .thumb{ padding: 14px 0 0; }
#main .slider_box .thumb .thumbnail-img{ width: 240px!important; margin: 0 5px; }
#main .slider_box .thumb .thumbnail-img img{ width: 100%; height: auto; }



/* ------------------------------------------------------------ mobile */
@media only screen and (max-width:640px){
/* ------------------------------------------------------------ set */
#main img { width: 100%; height: auto; }

#view.pages{ background: url(../../images/hinata_hibino/information/view_01.jpg) center; }
#view.pages h2{ padding: 10px 20px; background: none; }

#lead { }
#lead h3 { font-size: 26px; padding: 20px 0 15px; line-height: 150%; }
#lead h3 span { font-size: 17px; }
#lead p { font-size: 14px; text-align: left; }

#main .bg_c .item{ width: 100%; padding: 0 0 35px 0; }

.line{  background: url(../../images/common/line_01.png) repeat-x center center; background-size: 26px 13px; letter-spacing: 0; padding: 30px 0; }

#main .bg_c { padding: 0 0 60px; }
#main .service { width: 94%; padding: 7% 0; margin:0 3%; }
#main .service ul { width: 102%; margin: 0 0 0 -2%; }
#main .service li { width: 48%; min-height: 100px; font-size: 15px; margin: 0 0 10px 2%; }
#main .service li img { width: 100%; height: auto; }
#main .service li p { position: absolute; width: 100%; left: 0; bottom: 0; background: url(../../images/hinata_hibino/information/shadow.png) center center; text-align: left; text-indent: 10px; font-size: 12px; padding: 3px 0 0; }

#main .container .etc li { color: #000; }
#main .container li.center { margin: 0 0 10px 2%; }


#main .container .flex{ flex-direction: column; padding: 0 0 35px; }
#main .container .flex div:first-of-type,
#main .container .flex div:last-of-type{ width: 100%; margin: 0 auto; }
#main .container .flex div img{ width: 90%; margin: 0 auto; }


#main .price{ padding: 0 3% 60px; }
#main .price dt{ width: 35%; padding: 15px; }
#main .price dd.wide,
#main .price dd.wide_sp{ padding: 30px 15px; }
#main .price dd{ padding: 15px; }


#main .slider_box .thumb{ max-height: 150px; }



}