@charset "utf-8";
/* CSS Document */

body { font-size:calc(18 * 0.2vw); }
:target { scroll-margin-top: 21vw; }


.fs12vw { font-size:calc(12 * 0.22vw); }
.fs14vw { font-size:calc(14 * 0.21vw); }
.fs15vw { font-size:calc(15 * 0.21vw); }
.fs16vw { font-size:calc(16 * 0.21vw); }
.fs17vw { font-size:calc(17 * 0.2vw); }
.fs18vw { font-size:calc(18 * 0.2vw); }
.fs20vw { font-size:calc(20 * 0.2vw); }
.fs21vw { font-size:calc(21 * 0.19vw); }
.fs22vw { font-size:calc(22 * 0.19vw); }
.fs23vw { font-size:calc(23 * 0.18vw); }
.fs24vw { font-size:calc(24 * 0.18vw); }
.fs25vw { font-size:calc(25 * 0.18vw); }
.fs26vw { font-size:calc(26 * 0.17vw); }
.fs27vw { font-size:calc(27 * 0.17vw); }
.fs28vw { font-size:calc(28 * 0.17vw); }
.fs29vw { font-size:calc(29 * 0.17vw); }
.fs30vw { font-size:calc(30 * 0.17vw); }
.fs31vw { font-size:calc(31 * 0.17vw); }
.fs32vw { font-size:calc(32 * 0.16vw); }
.fs33vw { font-size:calc(33 * 0.16vw); }
.fs34vw { font-size:calc(34 * 0.16vw); }
.fs35vw { font-size:calc(35 * 0.16vw); }
.fs36vw { font-size:calc(36 * 0.16vw); }
.fs37vw { font-size:calc(37 * 0.16vw); }
.fs38vw { font-size:calc(38 * 0.16vw); }
.fs40vw { font-size:calc(40 * 0.15vw); }
.fs42vw { font-size:calc(42 * 0.15vw); }
.fs45vw { font-size:calc(45 * 0.14vw); }
.fs48vw { font-size:calc(48 * 0.14vw); }
.fs50vw { font-size:calc(50 * 0.14vw); }
.fs52vw { font-size:calc(52 * 0.14vw); }
.fs53vw { font-size:calc(53 * 0.14vw); }
.fs54vw { font-size:calc(54 * 0.14vw); }
.fs55vw { font-size:calc(55 * 0.14vw); }
.fs56vw { font-size:calc(56 * 0.14vw); }
.fs60vw { font-size:calc(60 * 0.14vw); }
.fs62vw { font-size:calc(62 * 0.14vw); }
.fs64vw { font-size:calc(64 * 0.14vw); }
.fs65vw { font-size:calc(65 * 0.14vw); }
.fs66vw { font-size:calc(66 * 0.14vw); }
.fs68vw { font-size:calc(68 * 0.13vw); }
.fs70vw { font-size:calc(70 * 0.13vw); }
.fs72vw { font-size:calc(72 * 0.13vw); }
.fs80vw { font-size:calc(80 * 0.12vw); }
.fs84vw { font-size:calc(84 * 0.095vw); }
.fs100vw { font-size:calc(100 * 0.07vw); }
.fs110vw { font-size:calc(100 * 0.07vw); }
.fs140vw { font-size:calc(140 * 0.1vw); }

.pc { display: none; }
.sp { display: unset; }
.sp_left { text-align:left; }

.more { width: 60vw; height: 13vw; line-height: 13vw; margin: 2em auto 2em auto; }
.more i { right: 4.5vw; line-height: 13vw;}
.more.center {  margin: 2em auto 2em auto;}


.middle_inner { width: 92%; max-width: unset; }
.low_inner { width: 92%; max-width: unset; }


.ttl { margin: 4.5vw auto 3em auto; text-align:center; width: max-content; }
.ttl .slug { padding: 0 0 0.5em 0;}
.ttl .ja { padding: 0; line-height: 1.4;}
.ttl::before { top: calc(-116vw / 6.2); left: 0; right: 0; margin: auto; width: calc(116vw / 7.2); height: calc(116vw / 7.2); }
.ttl::after { bottom: -1em; width: 100%;  height: calc(12vw / 7.2); }

#top_fitting_scene .ttl::after { bottom: -1em; width: 100%;  height: calc(12vw / 7.2); }
#top_sales .ttl::after { bottom: -1em; width: 100%;  height: calc(12vw / 7.2); }

.bottom_contact .inner .ttl::after { bottom: -1em; width: 100%;  height: calc(12vw / 7.2); }
#lineup .ttl::after .ttl::after { bottom: -1em; width: 100%;  height: calc(12vw / 7.2); }


#header { height: 21vw; background-color: #FFF;}

#header .logo { width: 100%; padding: 3vw 0 3vw 2vw; border-bottom-right-radius: 0; }
#header .logo img { width: 47vw;}




#header .right_menu_box .menu_button .icon { display: inline-block; }


.zdo_drawer_menu .zdo_drawer_nav_wrapper.open {overflow-y: scroll;}


#header .right_menu_box ul { margin: 25vw 0 0 0; padding: 0 0 7.2vw 0;}
#header .right_menu_box ul li.page_name { margin: 0; padding: 0.8em 0 0.8em 0; border-top: solid 1px #442c16;}
#header .right_menu_box ul li.page_name:last-of-type { border-bottom: solid 1px #442c16;}
#header .right_menu_box ul li.page_name a { position: relative; display: block; padding: 0;line-height: 1.5; }
#header .right_menu_box ul li.page_name a i { position: absolute; align-content: center; top: 0; bottom: 0; margin: auto; right: 0;}

#header .right_menu_box ul li.page_name a .slug { display:block; }

#header .right_menu_box .tel_btn {
	display: block; width: 80%; height: calc(82vw / 5); padding: 3vw 0 0 0; border-radius: 50vmax; margin: 0.8em auto 1em auto; line-height: 4.5vw; border: solid 1px #442c16;
}
#header .right_menu_box .tel_btn i { margin-right: 1.2vw; }
#header .right_menu_box .tel_btn span { display:block; }


.bottom_contact .inner { padding: 7em calc(72vw / 19.2) 3em calc(72vw / 19.2);}
.bottom_contact .inner .flex { display: block; width: 80%; margin: auto; }
.bottom_contact .inner .flex .box { width: 100%; margin: 1em auto 1em auto;}

.bottom_contact .box { float: none; width: 66vw;margin: auto;}
.bottom_contact .inner .flex .box .tel_btn {display: block; width: 100%; height: calc(82vw / 5.8); padding: 3vw 0 0 0; margin: 0.5em 0 1em 0; line-height: 4.5vw;}
.bottom_contact .inner .flex .box .email_btn { display: block; width: 100%; height: calc(82vw / 5.8); padding: 4.8vw 0 0 0; margin: 0.5em 0 1em 0; line-height: 4.5vw;}

.bottom_contact .inner .flex .box .tel_btn i ,
.bottom_contact .inner .flex .box .email_btn i { margin-right: 1.2vw;}

.bottom_contact .inner .ttl::after { bottom: -1em; width: 100%; height: calc(12vw / 7.2); }


#footer .middle_inner { padding: 4.5vw 0 4.5vw 0;}

#footer .logo {  }
#footer .logo img { width: 47vw;}
#footer .site_name address {  }
#footer .site_name { width: 100%; float:none;}
#footer .site_info { width: 100%; float:none; margin: 2em 0 0 0; }
#footer .site_info .box a { margin: 3vw 0 3vw 0;}
#footer .copy { padding: 1.5vw 0 1.5vw 0;}

#ptop { width: 12.5vw; height: 12.5vw;  line-height: 12.5vw; padding: 1vw; }



.page_header { height: 40vw; background-size: 200%;}
.page_header .page_title {  margin: 0; line-height: 1; }
.page_header .page_title .slug { vertical-align: top; }


main { margin-block-start: 21vw; }

#fv {  height:70vw; background-size: cover; background-position: center;}

#fv .swiper-slide { background-size: 200%; background-position: left center; }

#fv .fv_center { top: 0; bottom: 0; left: 0; right: 0; margin: auto; width: 100%;}




#top_about { padding:18vw 0 13vw 0; }
#top_about .text { width: 100%; margin-left: 0;}
#top_about .thumb { width: 100%; padding: 8px; }

#top_about .decoration { position: absolute; left: 16%; width: calc(110vw / 10); }
#top_about .decoration::after {left: calc(-90vw / 6.2); width: 100%; height: 100%; background-size: 50%; }

#top_fitting_scene { padding:24vw 0 13vw 0; }
#top_fitting_scene .box_wrapper { width: 100%; margin: 1em 0 1em 0; padding: 8px; }
#top_fitting_scene .ttl,
#top_sales .ttl,
.bottom_contact .inner .ttl { width: max-content;}

#top_fitting_scene .box dl dt::before { top: 0.9vw; left: -5vw; width: calc(22vw / 6); height: calc(31vw / 6); }
#top_fitting_scene .box dl dt { margin: 0 0 0 5vw; }

#top_fitting_scene .box dl dd { padding: 1em 0 1.5em 0; }

#top_fitting_scene .box .subheading::before,
#top_fitting_scene .box .subheading::after { bottom: calc(-6* 0.22vw);font-size: calc(12* 0.22vw); }

#top_fitting_scene .box .subheading {
	padding-bottom: 0.5em; margin-block-end: 1.5em; background: linear-gradient(to bottom, transparent calc(100% - 1px), #442c16 50%, #442c16 calc(100% + 1px), transparent calc(100% + 1px));
}


.slider { height: calc(170vw / 14.2); }
.slider #in_slide .roll li { width: calc(440vw / 14.2); }


#top_sales { padding:18vw 0 13vw 0; }

#top_sales .item_box { width: 100%; margin: 1em 0 1em 0;}

#top_sales .item_box figcaption dl.table dd .open::after { inline-size: 2.7vw; block-size: 1.8vw; }


#about_contents1 .link_group .more { margin: 0.6em; }

#features { padding: 3.83vw 0 3em 0; }
#features .wrapper { padding: 8px; }
#features .wrapper .box { padding: 1vw 1em 1vw 1em; }
#features .wrapper .box .thumb { padding: 8px; width: 100%; margin-block-end: 1.5em; }
#features .wrapper .box .text { width: 100%; }

#features .wrapper .box .subheading {
	padding-bottom: 0.5em; margin-block-end: 1.5em; background: linear-gradient(to bottom, transparent calc(100% - 1px), #442c16 50%, #442c16 calc(100% + 1px), transparent calc(100% + 1px));
}

#features .wrapper .box .subheading::before,
#features .wrapper .box .subheading::after { bottom: calc(-6* 0.22vw);font-size: calc(12* 0.22vw); }

#features .wrapper .box .notice { width: 100%; max-width: fit-content; }



#lineup { padding: 24vw 0 2.8em 0; }
#lineup .ttl { text-align:center; width: max-content; }


#items .item_box { padding: 0.5em 1em 1.5em 1em; }

#items .item_box dl.table { display: block; width: 100%; border-top: solid 1px #c2bab2; border-bottom: solid 1px #c2bab2; margin: 1.5em 0 1.5em 0;}

#items .item_box dl.table.half { width: 100%; float: none; border-top: solid 1px #c2bab2; border-bottom: solid 1px #c2bab2; margin: 1.5em 0 1.5em 0; }

#items .item_box dl.table.half dt { width: 100%; padding: 0.35em 0 0.35em 0; font-size: calc(20* 0.2vw);}

#items .item_box dl.table dt { display: block; width: 100%; padding: 0.35em 0 0.35em 0; border-left: solid 1px #c2bab2; border-right: solid 1px #c2bab2; }
#items .item_box dl.table dd { display: block; border-left: solid 1px #c2bab2; border-right: solid 1px #c2bab2; padding: 0.35em 0.35em 0.35em 0.35em;}

#items .item_box .contact_box { display: block; }
#items .item_box .contact_box .box { width: 80%; margin: 1em auto 1em auto;}

#items .item_box .contact_box .box .tel_btn {display: block; width: 100%; height: calc(82vw / 5.8); padding: 3vw 0 0 0; margin: 0.5em 0 1em 0; line-height: 4.5vw;}
#items .item_box .contact_box .box .email_btn { display: block; width: 100%; height: calc(82vw / 5.8); padding: 4.8vw 0 0 0; margin: 0.5em 0 1em 0; line-height: 4.5vw;}

#items .item_box .contact_box .box .tel_btn i ,
#items .item_box .contact_box .box .email_btn i { margin-right: 1.2vw;}


#items .item_box .item_name { margin: 1vw 0 2em 0; }
#items .item_box .item_name::after { width: 100%; height: calc(14vw / 7.2); background-size: 200%; }
#items .item_box .item_name::before { top: 0.5em; bottom: auto; width: calc(116vw / 8.2); height: calc(72vw / 8.2); }


#company, #privacy { padding: 24vw 0 2.8em 0; }

#company .ttl, #privacy .ttl { text-align:center; width: 100%; }
#company .ttl::after, #privacy .ttl::after { bottom: -1em; width: 100%;  height: calc(12vw / 7.2); }
#company .ttl .illust, #privacy .ttl .illust { top: 0.5em; bottom: auto; width: calc(116vw / 8.2); height: calc(72vw / 8.2); }

#company .company_detail dt { padding: 0.5em; width: 7em; }


#gmap { height: 320px;}


#contact_contents1 .tel_box { width: 100%; padding: 1em 3.125vw; }
#contact_contents1 .tel_box dt { display: block; }
#contact_contents1 .tel_box dd { display: block; margin: 0; }

#contact { width: 92%; margin: 2em auto 4em auto; padding: 8px; }
#contact .wrapper { padding: 2.5vw 1em 2.5vw 1em; }

#form { padding: 6.25vw 0 3em 0; }

#form .middle_inner {padding: 4.166666vw 5.729166vw 10.208333vw 5.729166vw;}

#form .form_ttl { margin: 0 auto 9.375vw auto;}
#form .form_ttl .icon { width: 13.208333vw; height: 13.208333vw; line-height: 11.2vw; }
#form .form_ttl::after { bottom: -3vw; width: 6.25vw; }

#form .box { display: block; margin: 0; }
#form .box dt { display: block; width: 100%; padding: 1em 0 1em 0; border-bottom: solid 2px #c2bab2; }

#form .box dt .required { padding: 0.9vw 2vw 1.1vw 2vw;}
#form .box dt .any { padding: 0.9vw 2vw 1.1vw 2vw; }
#form .box dd { display: block; width: 100%; margin: 0; padding: 1em 0 1em 0;}
#contact.confirm #form .box dd { padding: 2em 0 1em 0;}

#form .box dd input[type="checkbox"] + label.amount { width: 100%; margin: 1.5em 0 1em 0;}
#form .box dd input[type="tel"].amount { margin-bottom: 1em; }


#form .next { width: 62.4vw; height: 12.45vw; }

#form .send_btn { float: none; width: 62vw; height: 13vw; margin: 2em auto 2em auto;}
#form .back_btn { float: none; width: 62vw; height: 13vw; margin: 3.645833vw auto 0 auto; line-height: 13vw;}
#form .back_btn i { line-height: 13vw; }

#form .send_btn i { line-height: 1.4;}

#link { width: 92%; margin: 2em auto 4em auto; padding: 8px; }
#link .wrapper { padding: 2.5vw 1em 2.5vw 1em;}


