@charset "utf-8";
/* 

CSS page.css
下層各自cssで微調整するときに使用してください。

*/

#index #mainv{position: relative;height: 100vh;min-height: 980px;padding-left: 90px;padding-top: 80px;box-sizing: border-box;width: 100%;padding-right: 10px;}
#index #mainv .copybox{padding-left: 280px;position: relative;display: inline-block;z-index: 5000000000;}
#index #mainv .copybox>.inwrap{ -webkit-writing-mode: vertical-rl;-ms-writing-mode: tb-rl;writing-mode: vertical-rl; letter-spacing: 0.4em; }
#index #mainv .copybox>.inwrap .subcopy{ font-size: 1.7rem; margin-left: 10px; }
#index #mainv .copybox>.inwrap .maincopy{ font-size: 2.8rem; line-height: 1.8; }
#index #mainv .scrollbox{position: absolute;bottom: 90px;right: 10px;line-height: 1.4;width: 25px;height: 140px;display: flex;flex-direction: column;align-items: center;}
#index #mainv .scrollbox .scrollarr{position: relative;width: 1px;height: 50px;overflow: hidden;margin-right: 5px;}
#index #mainv .scrollbox .scrollarr>span{display: inline-block;width: 3px;height: 50px;background: #000;position: absolute;top: 0;left: -1px;right: 0;margin-left: auto;margin-right: auto;animation: pathmove 2s ease-in-out infinite;opacity:0;}
#index #mainv .scrollbox .scrolltxt{margin-top: 10px;-webkit-writing-mode: vertical-rl;-ms-writing-mode: tb-rl;writing-mode: vertical-rl;text-orientation: sideways}
#index #mainv .address{text-align: right;position: absolute;bottom: 20px;width: 100%;left: 0;right: 0;padding-right: 20px;box-sizing: border-box;line-height: 1.4;}
#index #mainv .address>.inwrap{ font-size: 1.3rem; display: inline-block;  }
#index #mainv .address>.inwrap .tellist{ margin-left: -10px; }
#index #mainv .address>.inwrap .tellist>li{ display: inline-block;vertical-align: middle; margin-left: 10px; }
#index #mainv .slidelist{ position: absolute; bottom: 0; left: 0;right: 0; top: 0; z-index: -1; }

#index #mainv .slidelist { width: 100%; height: 100%; box-sizing: border-box; position: absolute; top: 0; left: 0; z-index: -1; }
#index #mainv .slick-list,
#index #mainv .slick-track,
#index #mainv .slidelist ul,
#index #mainv .slidelist li { height: 100%; width: 100%; position: relative;  }
#index #mainv .slidelist li .bg { object-fit: cover; font-family: 'object-fit: cover;'; display: block; width: 100%; height: 100%; transition: 5s cubic-bezier(.645, .045, .355, 1); z-index: -1; }
@keyframes pathmove{
	0%{ height:0; top:0; opacity: 0; }
	30%{ height:30px; opacity: 1; }
	100%{ height:0; top:50px; opacity: 0; }
}
@media screen and (max-width: 1200px) {
	#index #mainv{ padding-left: 0; padding-top: 40px; min-height: inherit; }
	#index #mainv .copybox{width: 100%;height: 100%;padding-left: 0;display: flex;align-items: center;justify-content: center;color: #fff;z-index: 1000;}
	#index #mainv .address{ display: none; }
	#index #mainv .scrollbox{ bottom: 20px; }
}
@media screen and (max-width: 767px) { 

}
@media screen and (max-width: 500px) { 
}

#index #mainv~.mvorderlist{ background: #f7f7f7; padding-left: 90px; }
#index #mainv~.mvorderlist>ul{ display: flex;flex-direction: row; justify-content: center; }
#index #mainv~.mvorderlist>ul>li{position: relative;display: flex;}
#index #mainv~.mvorderlist>ul>li:not(:first-child):before{content: "";background: #000;position: absolute;left: 0;top: 0;bottom: 0;margin-top: auto;margin-bottom: auto;width: 1px;height: 60px;display: inline-block;z-index: 4;}
#index #mainv~.mvorderlist>ul>li .fukidashi{position: absolute;top: -45px;left: 0;right: 0;margin-left: auto;margin-right: auto;text-align: center;padding-bottom: 8px;height: 38px;transform-origin: top; animation: balloonAnime 3s ease-out 0s infinite normal both;}
#index #mainv~.mvorderlist>ul>li .fukidashi::before{ content: ""; background: linear-gradient(to left top, transparent 50%, rgb(255, 250, 0) 51%) right top / 50% 100% no-repeat, linear-gradient(to right top, transparent 50%, rgb(255, 250, 0) 51%) left bottom / 50% 100% no-repeat; width: 26px; height: 8px; display: inline-block; position: absolute; bottom: 0; left: 0; right: 0; margin-left: auto; margin-right: auto; }
#index #mainv~.mvorderlist>ul>li .fukidashi>p{font-size: 1.5rem;border-radius: 10px;background: #fffa00;line-height: 1.4;padding: 4px 22px 2px;display: inline-block;letter-spacing: 0;}
#index #mainv~.mvorderlist>ul>li>a{display: flex;align-items: center;justify-content: center;flex-direction: row;background: #fff;padding: 22px 30px 17px;padding-left: 20px;position: relative;}
#index #mainv~.mvorderlist>ul>li>a .mainbox{ display: flex;align-items: center;justify-content: center;flex-direction: row; }
#index #mainv~.mvorderlist>ul>li>a .txt,
#index #mainv~.mvorderlist>ul>li>a .icon{ margin-left: 10px; display: flex;justify-content: center; }
#index #mainv~.mvorderlist .titlebox{display: flex;}
#index #mainv~.mvorderlist .titlebox>a{ background: #808080;color: #fff;text-align: center;padding: 15px 25px 10px;line-height: 1.6; display: flex;align-items: center;justify-content: center;flex-direction: column; }
#index #mainv~.mvorderlist .titlebox .jn{ font-size: 1.3rem; }
#index #mainv~.mvorderlist .titlebox .en{ font-size: 1.8rem; }
#index #mainv~.mvorderlist .titlebox>a:hover,
#index #mainv~.mvorderlist>ul>li>a:hover{ background: #BCBCBC; color: #fff; opacity: 1; }
#index #mainv~.mvorderlist>ul>li>a:hover .st0{ fill:#fff }
@keyframes balloonAnime {
0% { top: -45px; }
10% { top: -50px; }
20% { top: -45px; }
30% { top: -48px; }
40% { top: -45px; }
100% { top: -45px; }
}
@media screen and (max-width: 1200px) {
	#index #mainv~.mvorderlist .titlebox{ order: 1; width: 100%; }
	#index #mainv~.mvorderlist .titlebox>a{ width: 100%; }
	#index #mainv~.mvorderlist>ul>li{ order: 2; }
	#index #mainv~.mvorderlist>ul{ flex-wrap: wrap; }
	#index #mainv~.mvorderlist{ padding-left: 0; padding-left: 8%; padding-right: 8%; }
	#index #mainv~.mvorderlist>ul>li{display: block;background: #fff;width: 33.33%;}
	#index #mainv~.mvorderlist>ul>li>a{flex-direction: column;padding-top: 4px;justify-content: flex-end;}
	#index #mainv~.mvorderlist>ul>li .fukidashi{position: static;padding-top: 5px;margin-bottom: auto;height: auto;padding-bottom: 0;}
	#index #mainv~.mvorderlist>ul>li .fukidashi::before{ content: none; }
	#index #mainv~.mvorderlist>ul>li>a .mainbox{flex-direction: column;height: 90px;box-sizing: border-box;}
	#index #mainv~.mvorderlist>ul>li>a .txt,
	#index #mainv~.mvorderlist>ul>li>a .icon{ margin-left: 0;  }
	#index #mainv~.mvorderlist>ul>li>a:hover{ color: inherit; }
	#index #mainv~.mvorderlist>ul>li>a:hover .st0{ fill:#000 }
}
@media screen and (max-width: 767px) { 
	#index #mainv~.mvorderlist{ padding-left: 0; padding-right: 0; }
}
@media screen and (max-width: 639px) { 
	#index #mainv~.mvorderlist{ padding-left: 0; padding-right: 0%;border-bottom: 1px solid #000; }
	#index #mainv~.mvorderlist>ul{display: column;padding: 0 0%;text-align: center;}
	#index #mainv~.mvorderlist>ul>li:not(:first-child){ border-top: 1px solid #000; }
	#index #mainv~.mvorderlist>ul>li:not(:first-child):before{ content: none; }
	#index #mainv~.mvorderlist>ul>li>a .mainbox{height: inherit;}
	#index #mainv~.mvorderlist>ul>li{width: 100%;}
}

#index #article{ padding-left: 90px; }
#index #swrap_1{ padding-top: 140px; padding-bottom: 130px; }
#index #swrap_1 #sec_1 .aboutbox{margin-top: 50px;}
#index #swrap_1 #sec_1 .aboutbox .box1{ display: flex;flex-direction: row; justify-content: center; margin-left: -30px; align-items: center; }
#index #swrap_1 #sec_1 .aboutbox .box1 .copybox{margin-left: 30px;}
#index #swrap_1 #sec_1 .aboutbox .box1 .copybox .inwrap{font-size: 2.8rem;line-height: 2;font-weight: normal;letter-spacing: 0.15em;}
#index #swrap_1 #sec_1 .aboutbox .box1 .linklist{ margin-left: 15px; }
#index #swrap_1 #sec_1 .aboutbox .box1 .linklist>ul>li{ display: inline-block; margin-left: 15px; vertical-align: middle; }
@media screen and (max-width: 1200px) {
	#index #article{ padding-left: 0; }
	#index #swrap_1{ padding-top: 100px; padding-bottom: 90px; }
	#index #swrap_1 #sec_1 .aboutbox .box1 .copybox .inwrap{font-size: 2.4rem;}
}
@media screen and (max-width: 767px) { 
	#index #swrap_1{ padding-top: 80px; padding-bottom: 70px; }
	#index #swrap_1 #sec_1 .aboutbox{margin-top: 70px;}
	#index #swrap_1 #sec_1 .aboutbox .box1{ display: block;margin-left: -0;text-align: center; }
	#index #swrap_1 #sec_1 .aboutbox .box1 .copybox{margin-left: 0;margin-bottom: 30px;}
	#index #swrap_1 #sec_1 .aboutbox .box1 .copybox .inwrap{font-size: 1.8rem;}
	#index #swrap_1 #sec_1 .aboutbox .box1 .linklist{ margin-left: -15px; }
}
@media screen and (max-width: 500px) { 
	#index #swrap_1{ padding-top: 60px; padding-bottom: 50px; }
}

#index #swrap_2 .seclist1>ul>li>section{ display: flex;flex-direction: row-reverse; }
#index #swrap_2 .seclist1>ul>li>section .txtbox{width: 100%;background: #f7f7f7;padding: 80px 10%;display: flex;align-items: center;justify-content: center;flex-direction: column;line-height: 2;}
#index #swrap_2 .seclist1>ul>li>section .txtbox .linklist{margin-top: 40px;background: #fff;padding: 24px 10%;box-sizing: border-box;width: 100%;}
#index #swrap_2 .seclist1>ul>li>section .txtbox .linklist>ul{margin-left: -15px;text-align: center;}
#index #swrap_2 .seclist1>ul>li>section .txtbox .linklist>ul>li{ display: inline-block; margin-left: 15px; vertical-align: middle; }
#index #swrap_2 .seclist1>ul>li>section .imgbox{width: 52%;flex-shrink: 0;}
#index #swrap_2 .seclist1>ul>li:nth-child(even)>section{ display: flex;flex-direction: row; }
#index #swrap_2 .seclist1>ul>li:nth-child(even)>section .imgbox{width: 53%;}
@media screen and (max-width: 1200px) {
	#index #swrap_2 .seclist1>ul>li>section .imgbox,
	#index #swrap_2 .seclist1>ul>li:nth-child(even)>section .imgbox{width: 50%;}
}
@media screen and (max-width: 767px) { 
	#index #swrap_2 .seclist1>ul>li>section .txtbox{padding: 60px 10%;}
	#index #swrap_2 .seclist1>ul>li>section,
	#index #swrap_2 .seclist1>ul>li:nth-child(even)>section{ display: block; }
	#index #swrap_2 .seclist1>ul>li>section .imgbox,
	#index #swrap_2 .seclist1>ul>li:nth-child(even)>section .imgbox{width: 100%;}
	#index #swrap_2 .seclist1>ul>li>section .txtbox .linklist{ margin-top: 30px; }
}
@media screen and (max-width: 500px) { 
}

#index #swrap_2 .seclist2{ margin-top: 100px; }
#index #swrap_2 .seclist2>.incnt>ul>li>section{ display: flex;flex-direction: row; }
#index #swrap_2 .seclist2>.incnt>ul>li>section .titlebox{ flex-shrink: 0; width: 50%; position: relative; display: flex; align-items: center; justify-content: center; }
#index #swrap_2 .seclist2>.incnt>ul>li>section .titlebox .topsectitle{color: #fff;position: relative;z-index: 2;margin-bottom: 0;}
#index #swrap_2 .seclist2>.incnt>ul>li>section .titlebox .topsectitle>.inwrap::before{ background: #fff; max-width: 144px; width: 100%; }
#index #swrap_2 .seclist2>.incnt>ul>li>section .titlebox .bg{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: 1; }
#index #swrap_2 .seclist2>.incnt>ul>li>section .txtbox{width: 100%;background: #f7f7f7;padding: 40px 6% 45px;min-height: 440px;display: flex;flex-direction: column;justify-content: center;line-height: 2;}
#index #swrap_2 .seclist2>.incnt>ul>li>section .txtbox .link{ margin-top: 25px; }
#index #swrap_2 .seclist2>.incnt>ul>li:nth-child(even)>section{ display: flex;flex-direction: row-reverse; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
	#index #swrap_2 .seclist2>.incnt>ul>li>section,
	#index #swrap_2 .seclist2>.incnt>ul>li:nth-child(even)>section{ display: block; }
	#index #swrap_2 .seclist2>.incnt>ul>li>section .titlebox{  width: 100%; height: 300px; }
	#index #swrap_2 .seclist2>.incnt>ul>li>section .txtbox{padding: 40px 10%;min-height: inherit;}
	#index #swrap_2 .seclist2>.incnt>ul>li>section .txtbox .link{ text-align: center; }
	#index #swrap_2 .seclist2>.incnt>ul>li>section .titlebox .topsectitle>.inwrap::before{ max-width: 100px; }
}
@media screen and (max-width: 500px) { 
	#index #swrap_2 .seclist2{ margin-top: 60px; }
	#index #swrap_2 .seclist2>.incnt>ul>li>section .titlebox{  height: 250px; }
}

#index #swrap_3{ margin-top: 140px; }
#index #swrap_3 #sec_6 .titlebox{ text-align: center; margin-bottom: 50px; }
#index #swrap_3 #sec_6 .titlebox .topsectitle{ margin-bottom: 0; }
#index #swrap_3 #sec_6 .titlebox .jn>.inwrap{display: inline-block;position: relative;font-size: 1.8rem;font-weight: normal;padding-left: 37px;padding-right: 37px;}
#index #swrap_3 #sec_6 .titlebox .jn>.inwrap::before,
#index #swrap_3 #sec_6 .titlebox .jn>.inwrap::after{content: "";background: url(../img/index/s6_title_left.svg) no-repeat;background-size: contain;position: absolute;top: 0;bottom: 0;margin-top: auto;margin-bottom: auto;display: inline-block;width: 16px;height: 24px;}
#index #swrap_3 #sec_6 .titlebox .jn>.inwrap::before{ left: 0; }
#index #swrap_3 #sec_6 .titlebox .jn>.inwrap::after{ right: 0; transform : rotate(180deg) scale(1, -1); }
#index #swrap_3 #sec_6 .txtbox{ margin-top: 45px; }
#index #swrap_3 #sec_6 .txtbox>.incnt{ width: 80%; }
#index #swrap_3 #sec_6 .txtbox>.incnt>.inwrap{ display: flex;flex-direction: row; justify-content: space-between; align-items: center; }
#index #swrap_3 #sec_6 .txtbox>.incnt>.inwrap .txt{ width: 100%; }
#index #swrap_3 #sec_6 .txtbox>.incnt>.inwrap .link{ margin-left: 10%; flex-shrink: 0; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
	#index #swrap_3{ margin-top: 100px; }
	#index #swrap_3 #sec_6 .txtbox>.incnt>.inwrap{ display: block; }
	#index #swrap_3 #sec_6 .txtbox>.incnt>.inwrap .link{ margin-left: 0%; margin-top: 30px; text-align: center; }
	#index #swrap_3 #sec_6 .imgbox img{ height: 300px; }
	#index #swrap_3 #sec_6 .titlebox .jn>.inwrap{ font-size: 1em; padding-left: 30px;padding-right: 25px;}
	#index #swrap_3 #sec_6 .titlebox .jn>.inwrap::before,
	#index #swrap_3 #sec_6 .titlebox .jn>.inwrap::after{width: 12px;height: 20px;top: 4px;}
	#index #swrap_3 #sec_6 .txtbox{ margin-top: 35px; }
}
@media screen and (max-width: 500px) { 
}

#index #swrap_4{ margin-top: 150px; background: #f7f7f7; padding-top: 110px; padding-bottom: 110px; }
#index #swrap_4 #sec_7 .topsectitle>.inwrap{padding-bottom: 0;}
#index #swrap_4 #sec_7 .topsectitle>.inwrap::before{ content: none; }
@media screen and (max-width: 1200px) {
	#index #swrap_4{ margin-top: 100px; padding-top: 90px; padding-bottom: 80px; }
}
@media screen and (max-width: 767px) { 
	#index #swrap_4{ margin-top: 80px; padding-top: 60px; padding-bottom: 60px; }
}
@media screen and (max-width: 500px) { 
}


#faq #sec_1 .incnt{ max-width: 770px; }
#faq #sec_1 .inpagenav{margin-top: 50px;background: #f7f7f7;padding: 20px 40px;font-size: 1.8rem;text-align: center;letter-spacing: 0.2em;}
#faq #sec_1 .inpagenav>ol>li{ display: inline-block; vertical-align: middle; }
#faq #sec_1 .inpagenav>ol>li:not(:first-child)::before{ content: "・"; }
#faq #sec_1 .inpagenav>ol>li>a:hover{ opacity: 1; color: #808080; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) {
	#faq #sec_1 .inpagenav{ margin-top: 40px; font-size: 1.6rem; }
}
@media screen and (max-width: 500px) {
}

#faq section:nth-child(n + 2){ margin-top: 145px; }
@media screen and (max-width: 1200px) {
	#faq section:nth-child(n + 2){ margin-top: 125px; }
}
@media screen and (max-width: 767px) {
	#faq section:nth-child(n + 2){ margin-top: 100px; }
}
@media screen and (max-width: 500px) {
}

#showroom #sec_1 #s1_insec1 .box1{margin-top: 85px;}
#showroom #sec_1 #s1_insec1 .box1 .txt{line-height: 1.9;text-align: center;}
#showroom #sec_1 #s1_insec1 .box1 .bottomlink{ margin-top: 45px; }
#showroom #sec_1 #s1_insec1 .box1 .teltxtlink1{ margin-top: 25px; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) {
	#showroom #sec_1 #s1_insec1 .box1{margin-top: 50px;}
	#showroom #sec_1 #s1_insec1 .box1 .txt{text-align: justify;}
	#showroom #sec_1 #s1_insec1 .box1 .bottomlink{ margin-top: 30px; }
}
@media screen and (max-width: 500px) {
}


#showroom #sec_1 #s1_insec2{margin-top: 80px;}
#showroom #sec_1 #s1_insec2 .underincntwrap>.inwrap{position: relative;height: 95vh;width: 100vw;}
#showroom #sec_1 #s1_insec2 .underincntwrap>.inwrap::before{content: "";width: 77%;height: 55%;background: #f7f7f7;display: block;position: absolute;top: 0;bottom: 0;margin-top: auto;margin-bottom: auto;left: 0;z-index: 1;}
#showroom #sec_1 #s1_insec2 .imglist{position: relative;z-index: 2;width: 100%;height: 100%;}
#showroom #sec_1 #s1_insec2 .imglist>li:nth-child(1){position: absolute;top: 4%;width: 34%;height: 45%;left: 6%;}
#showroom #sec_1 #s1_insec2 .imglist>li:nth-child(2){position: absolute;top: 0;width: 54%;height: 65%;right: 0;}
#showroom #sec_1 #s1_insec2 .imglist>li:nth-child(3){position: absolute;bottom: 0;width: 29%;height: 45%;left: 14%;}
@media screen and (max-width: 1200px) {
	#showroom #sec_1 #s1_insec2 .underincntwrap>.inwrap{height: 75vh;}
	#showroom #sec_1 #s1_insec2 .imglist>li:nth-child(3){ left: 13%; }
}
@media screen and (max-width: 767px) {
	#showroom #sec_1 #s1_insec2{margin-top: 50px;}
	#showroom #sec_1 #s1_insec2 .underincntwrap>.inwrap{height: 55vh;}
	#showroom #sec_1 #s1_insec2 .imglist>li:nth-child(3){ left: 11%; }
}
@media screen and (max-width: 500px) {
}


#showroom #sec_2 .undersectitlebox{ margin-top: -10px; }
#showroom #sec_2 .txtbox{ text-align: center; }
#showroom #sec_2 .txtbox .address{ margin-top: -10px; }
#showroom #sec_2 .txtbox .list{ margin-top: 75px; }
#showroom #sec_2 .txtbox .list>li:not(:last-child){ margin-bottom: 55px; }
#showroom #sec_2 .txtbox .list>li .title{ font-size: 2rem; margin-bottom: 5px; }
#showroom #sec_2 .txtbox .list>li .link{ margin-top: 5px; }
#showroom #sec_2 .imgbox{ margin-top: 55px; }
@media screen and (max-width: 1200px) {
	#showroom #sec_2 .txtbox .list{ margin-top: 65px; }
}
@media screen and (max-width: 767px) {
	#showroom #sec_2 .txtbox .list{ margin-top: 45px; }
	#showroom #sec_2 .txtbox .list>li:not(:last-child){ margin-bottom: 35px; }
	#showroom #sec_2 .txtbox .list>li .title{ font-size: 1.8rem; }
	#showroom #sec_2 .imgbox .map iframe{ height: 400px; }
}
@media screen and (max-width: 500px) {
}


#contact.index #sec_1 .box1{margin-top: 65px;}
#contact.index #sec_1 .box1 .borderbox{ padding-bottom: 50px; padding-top: 60px; }
#contact.index #sec_1 .box1 .txt{line-height: 1.9;text-align: center;}
#contact.index #sec_1 .box1 .teltxtlink1{ margin-top: 15px; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) {
	#contact.index #sec_1 .box1{margin-top: 50px;}
	#contact.index #sec_1 .box1 .borderbox{ padding-bottom: 40px; padding-top: 40px; }
	#contact.index #sec_1 .box1 .txt{text-align: justify;}
	#contact.index #sec_1 .box1 .bottomlink{ margin-top: 30px; }
}
@media screen and (max-width: 500px) {
}


#remake #sec_1{ margin-bottom: 180px; }
#remake #sec_1 .sectitle{ margin-bottom: 25px;  }
#remake #sec_1 .txt{ text-align: center; }
@media screen and (max-width: 1200px) {
	#remake #sec_1{ margin-bottom: 130px; }
}
@media screen and (max-width: 767px) {
	#remake #sec_1{ margin-bottom: 90px; }
	#remake #sec_1 .txt{ text-align: justify; }
}
@media screen and (max-width: 500px) {
}


#remake #sec_2 .list1>ul>li:not(:last-child){ margin-bottom: 60px; }
#remake #sec_2 .sectitle{ margin-bottom: 20px; letter-spacing: 0.15em; }
#remake #sec_2 .imgbox{ margin-top: 40px;  }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) {
	#remake #sec_2 .imgbox img{ height: 350px; }
}
@media screen and (max-width: 500px) {
}



#ordermade.index #sec_1 .list1{ margin-top: 100px; }
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap{ display: flex;flex-direction: row; }
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .titlebox{ flex-shrink: 0; width: 50%; position: relative; display: flex; align-items: center; justify-content: center; }
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .titlebox .topsectitle{color: #fff;position: relative;z-index: 2;margin-bottom: 0;}
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .titlebox .topsectitle>.inwrap::before{ background: #fff; max-width: 144px; width: 100%; }
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .titlebox .bg{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: 1; }
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox{width: 100%;background: #f7f7f7;padding: 40px 7% 45px;min-height: 380px;display: flex;flex-direction: column;justify-content: center;line-height: 2;}
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox .sectitle{ margin-bottom: 15px; }
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox .txt{ text-align: center; }
#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox .link{ margin-top: 35px; }
#ordermade.index #sec_1 .list1>.incnt>ul>li:nth-child(even)>.inwrap{ display: flex;flex-direction: row-reverse; }
@media screen and (max-width: 1200px) {
	#ordermade.index #sec_1 .list1{ margin-top: 80px; }
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap,
	#ordermade.index #sec_1 .list1>.incnt>ul>li:nth-child(even)>.inwrap{ display: block; }
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .titlebox{  width: 100%; height: 300px; }
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox{padding: 45px 10% 50px;min-height: inherit;}
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox .link{ text-align: center; }
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .titlebox .topsectitle>.inwrap::before{ max-width: 100px; }
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 500px) { 
	#ordermade.index #sec_1 .list1{ margin-top: 60px; }
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .titlebox{  height: 250px; }
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox .link{ margin-top: 25px; }
	#ordermade.index #sec_1 .list1>.incnt>ul>li>.inwrap .txtbox .txt{ text-align: justify; }
}

#ordermade.index #sec_2 .list1{ overflow: hidden; }
#ordermade.index #sec_2 .list1>ul{ display: flex;flex-direction: row; flex-wrap: wrap; margin-left: -20px; margin-bottom: -30px; }
#ordermade.index #sec_2 .list1>ul>li{ margin-left: 20px; width: calc(33.33% - 20px); margin-bottom: 30px; }
#ordermade.index #sec_2 .list1>ul>li .cap{ margin-top: 5px; }
@media screen and (max-width: 1200px) {
	#ordermade.index #sec_2 .list1>ul{ display: block;margin-left: -0; }
	#ordermade.index #sec_2 .list1>ul>li{ margin-left: 0; width: 100%; }
	#ordermade.index #sec_2 .list1>ul>li img{ height: 300px; }
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 500px) { 
	#ordermade.index #sec_2 .list1>ul>li img{ height: 250px; }
}


#ordermade.flow #sec_1 .toptxt{ font-size: 1em; }
#ordermade.flow #sec_1 .flowlist{ margin-top: 120px; }
@media screen and (max-width: 1200px) {
	#ordermade.flow #sec_1 .flowlist{ margin-top: 80px; }
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 500px) { 
	#ordermade.flow #sec_1 .flowlist{ margin-top: 60px; }
}

#ordermade.flow #sec_1 .bottomlinklist{ margin-top: 170px; }
#ordermade.flow #sec_1 .bottomlinklist>.incnt{ max-width: 850px; }
@media screen and (max-width: 1200px) {
	#ordermade.flow #sec_1 .bottomlinklist{ margin-top: 140px; }
}
@media screen and (max-width: 767px) { 
	#ordermade.flow #sec_1 .bottomlinklist{ margin-top: 70px; }
}
@media screen and (max-width: 500px) { 
}

#ordermade.maintenance #sec_1{ text-align: center; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
	#ordermade.maintenance #sec_1{ text-align: justify; }
}
@media screen and (max-width: 500px) { 
}



#about.index #sec_1 .link{ margin-top: 80px; text-align: center; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
	#about.index #sec_1 .link{ margin-top: 50px; }
}
@media screen and (max-width: 500px) { 
}

#about.index #sec_2 .box1{ position: relative; padding-bottom: 300px; }
#about.index #sec_2 .box1::before{content: "";background: #f7f7f7;display: block;position: absolute;bottom: 70px;left: 0;width: 92%;height: 580px;z-index: -1;}
#about.index #sec_2 .box1 .boxinwrap1{ display: flex; flex-direction: row; }
#about.index #sec_2 .box1 .txtbox{padding: 70px 8% 70px 10%;width: 100%;line-height: 1.9;position: relative; z-index: 1;}
#about.index #sec_2 .box1 .txtbox .sectitle{ margin-bottom: 35px; }
#about.index #sec_2 .box1 .imgbox{display: flex;flex-shrink: 0;width: 54%;height: 760px;}
#about.index #sec_2 .box1 .bg{position: absolute;bottom: 0;left: 8%;width: 50%;height: 450px;}
@media screen and (max-width: 1200px) {
	#about.index #sec_2 .box1{  padding-bottom: 0; }
	#about.index #sec_2 .box1::before{content: none;}
	#about.index #sec_2 .box1 .boxinwrap1{ display: block; }
	#about.index #sec_2 .box1 .txtbox{padding: 0 8%;line-height: 2;}
	#about.index #sec_2 .box1 .txtbox .sectitle{ text-align: center; }
	#about.index #sec_2 .box1 .imgbox{display: block;width: 100%;height: 660px;margin-top: 60px;}
	#about.index #sec_2 .box1 .bg{position: relative;left: 0%;width: 100%;height: 450px;}
}
@media screen and (max-width: 767px) { 
	#about.index #sec_2 .box1 .imgbox{ height: inherit; margin-top: 50px; }
	#about.index #sec_2 .box1 .bg{ height: inherit; }
}
@media screen and (max-width: 500px) { 
}

#about.index #sec_3 .sectitle{ text-align: center; }
#about.index #sec_3 .bottomlinklist{ margin-top: 50px; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 500px) { 
}

#about.cando #sec_1 .list{margin-top: 100px;text-align: center;}
#about.cando #sec_1 .list>.inwrap>ul{ margin-left: -30px; text-align: center; margin-bottom: -20px; }
#about.cando #sec_1 .list>.inwrap>ul>li{ display: inline-block; vertical-align: middle; margin-left: 30px; margin-bottom: 20px; }
#about.cando #sec_1 .list>.inwrap>ul>li>a{ font-size: 2.8rem; padding-bottom: 15px; display: inline-block; position: relative; }
#about.cando #sec_1 .list>.inwrap>ul>li>a::before{ content: ""; background: linear-gradient(to left top, transparent 50%, rgb(0, 0, 0) 51%) right top / 50% 100% no-repeat, linear-gradient(to right top, transparent 50%, rgb(0, 0, 0) 51%) left bottom / 50% 100% no-repeat; width: 10px; height: 10px; display: block; position: absolute; bottom: 0; right: 0; left: 0; margin-left: auto; margin-right: auto; transition: .4s; }
#about.cando #sec_1 .list>.inwrap>ul>li>a:hover{ opacity: 1; color: #808080;  }
#about.cando #sec_1 .list>.inwrap>ul>li>a:hover::before{ bottom: -5px; background: linear-gradient(to left top, transparent 50%, rgb(128, 128, 128) 51%) right top / 50% 100% no-repeat, linear-gradient(to right top, transparent 50%, rgb(128, 128, 128) 51%) left bottom / 50% 100% no-repeat; }
@media screen and (max-width: 1200px) {
	#about.cando #sec_1 .list{margin-top: 60px;}
	#about.cando #sec_1 .list>.inwrap>ul>li>a{ font-size: 2.4rem; }
}
@media screen and (max-width: 767px) { 
	#about.cando #sec_1 .list{margin-top: 40px;}
	#about.cando #sec_1 .list>.inwrap>ul>li>a{ font-size: 2rem; }
	#about.cando #sec_1 .list>.inwrap>ul>li>a::before{ width: 8px; height: 8px; }
}
@media screen and (max-width: 500px) { 
}

#about.cando .aboutseclist{ margin-top: 140px; }
#about.cando .aboutseclist>ul>li>section{ padding: 150px 0 180px; }
#about.cando .aboutseclist>ul>li:nth-child(odd){ background: #f7f7f7; }
#about.cando .aboutseclist>ul>li>section .txtbox .bottomlink,
#about.cando .aboutseclist>ul>li>section .txtbox .bottomlinklist{ margin-top: 40px; }
#about.cando .aboutseclist>ul>li>section .imgbox{ margin-top: 80px; }
#about.cando .aboutseclist>ul>li:last-child>section{ padding-bottom: 0; }
@media screen and (max-width: 1200px) {
	#about.cando .aboutseclist{ margin-top: 100px; }
	#about.cando .aboutseclist>ul>li>section{ padding: 100px 0 120px; }
}
@media screen and (max-width: 767px) { 
	#about.cando .aboutseclist{ margin-top: 80px; }
	#about.cando .aboutseclist>ul>li>section{ padding: 80px 0 90px; }
	#about.cando .aboutseclist>ul>li>section .imgbox{ margin-top: 60px; }
	#about.cando .aboutseclist>ul>li>section .imgbox:not(._list) img{ height: 400px; }
	#about.cando .aboutseclist>ul>li>section .txtbox .bottomlink,
	#about.cando .aboutseclist>ul>li>section .txtbox .bottomlinklist{ margin-top: 35px; }
}
@media screen and (max-width: 500px) { 
}

#about.cando #sec_3 .imgbox>.inwrap>ul{ display: flex; flex-direction: row; }
#about.cando #sec_3 .imgbox>.inwrap>ul>li{ width: 50%; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
	#about.cando #sec_3 .imgbox>.inwrap>ul{ display: block; }
	#about.cando #sec_3 .imgbox>.inwrap>ul>li{ width: 100%; height: 300px; }
}
@media screen and (max-width: 500px) { 
}

#renovation #sec_1 .imgbox{margin-top: 90px;padding-right: 13%;padding-left: 2%;}
#renovation #sec_1 .imgbox .imglist{position: relative;height: 570px;}
#renovation #sec_1 .imgbox .imglist>li:nth-child(2){position: absolute;top: 0;right: 0;width: 83%;height: calc(100% - 70px);z-index: 1;}
#renovation #sec_1 .imgbox .imglist>li:nth-child(1){position: absolute;bottom: 0;left: 0;width: 43%;height: calc(100% - 150px);z-index: 2;}
@media screen and (max-width: 1200px) {
	#renovation #sec_1 .toptxt{ text-align: justify; }
	#renovation #sec_1 .sectitle{ margin-bottom: 30px; }
	#renovation #sec_1 .imgbox{margin-top: 80px;padding-right: 4%;padding-left: 4%;}
}
@media screen and (max-width: 767px) { 
	#renovation #sec_1 .imgbox{margin-top: 50px;padding-right: 0%;padding-left: 0%;}
	#renovation #sec_1 .imgbox .imglist{height: auto;}
	#renovation #sec_1 .imgbox .imglist>li:nth-child(2),
	#renovation #sec_1 .imgbox .imglist>li:nth-child(1){position: relative;width: 100%;height: 400px;z-index: 2;}
}
@media screen and (max-width: 500px) { 
}


#renovation #sec_2 .list1>ul>li{ display: flex; flex-direction: row; }
#renovation #sec_2 .list1>ul>li .txtbox{width: 100%;background: #f7f7f7;padding: 110px 9% 90px;padding-right: 7%;}
#renovation #sec_2 .list1>ul>li .txtbox .sectitle{text-align: justify;letter-spacing: 0.1em;margin-bottom: 20px;}
#renovation #sec_2 .list1>ul>li .imgbox{ flex-shrink: 0; width: 50%; display: flex; }
#renovation #sec_2 .list1>ul>li .imgbox img{ display: flex; height: auto; }
#renovation #sec_2 .list1>ul>li:nth-child(even){ flex-direction: row-reverse; }
#renovation #sec_2 .list1>ul>li:nth-child(even) .txtbox{ padding: 110px 8% 90px; }
@media screen and (max-width: 1200px) {
	#renovation #sec_2 .list1>ul>li{ display: block; }
	#renovation #sec_2 .list1>ul>li .txtbox,
	#renovation #sec_2 .list1>ul>li:nth-child(even) .txtbox{background: #f7f7f7;padding: 80px 6% 60px;padding-right: 6%;}
	#renovation #sec_2 .list1>ul>li .txtbox .sectitle{text-align: center;}
	#renovation #sec_2 .list1>ul>li .imgbox{  width: 100%; }
	#renovation #sec_2 .list1>ul>li .imgbox{ display: block; }
	#renovation #sec_2 .list1>ul>li .imgbox img{ display: block; }
}
@media screen and (max-width: 767px) { 
	#renovation #sec_2 .list1>ul>li .txtbox,
	#renovation #sec_2 .list1>ul>li:nth-child(even) .txtbox{padding: 60px 6% 50px;}
}
@media screen and (max-width: 500px) { 
}

#renovation #sec_2 .box1{ margin-top: 85px; text-align: center; }
#renovation #sec_2 .box1 .title1{ font-size: 2rem; line-height: 1.8; }
#renovation #sec_2 .box1 .bottomlink{ margin-top: 30px; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 500px) { 
}

#privacy .list1>li:not(:last-child){ margin-bottom: 20px; }
@media screen and (max-width: 1200px) {
}
@media screen and (max-width: 767px) { 
}
@media screen and (max-width: 500px) { 
}