@charset "UTF-8";

article{overflow: hidden;}

/* メニュー */
.menu_wrap .menu > *[href*="#"]::after{transform: rotate(135deg);}


/* メイン */
main{overflow: hidden;height: calc(56.25vw - 10px);}
main img{width: 100%;}
main > *:nth-child(n+2){position: absolute;left: 0;top: 0;width: 100%;opacity: 0;}
main .main_access_copy{width: 60%;right: 1%;left: auto;top: auto;bottom: 2%;}
main .main_tit{width: 30%;left: 8%;top: 9%;}
main .main_new{width: 100%;}

main .main_visual {
	opacity: 0;
	position: absolute;
	top: 0;
	height: 100%;
	width: 100%;
	transition: 1s;
}
main .main_visual.on{
	opacity: 1;
}
main .main_visual figure{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

main .main_visual figure.main_access_copy{width: 60%;right: 1%;left: auto;top: auto;bottom: 2%;height: auto;}
main .main_movie {
	position: relative;
	transition: 1s;
}
main .main_movie.off{
	opacity: 0;
}
main .main_movie video{
	width: 100%;
}

@media only screen and (max-width: 768px){
main{height: 117.1875vw;}
main .main_visual figure.main_access_copy{width: 97%;right: 0;bottom: 5%;}
main .main_tit{width: 90%;left: 5%;top: 15%;}
}




/* イントロ */
#intro .koudou{background: #4e4449;padding: 3em 0 2em 0;display: flex;justify-content: center;align-items: flex-end;}
#intro .koudou p{font-size: 2.5em;color: #fff;padding: 0 0.5em;}
#intro .koudou p small{display: block;font-size: 0.35em;margin: 0 0 -2em 0.5em;}
#intro .koudou p span{font-size: 0.8em;}
#intro .koudou p big{font-size: 2.8em;line-height: 0.5;font-family: "EB Garamond", serif;background: linear-gradient(165deg, #a67425 25%, #c1b049, #e5c217); -webkit-background-clip: text;-webkit-text-fill-color: transparent;}
#intro .koudou dd p big{font-size: 2em;line-height: 1;}
#intro .koudou dd::before{content: "";position: absolute;left: -1px;bottom: 0.5em;width: 2px;height: 3.7em;background: #fff;}
#intro .point{padding: 3em 0;display: flex;justify-content: center;align-items: center;gap: 0 0.5em;background: #f7f7f7;}
#intro .point span{font-size: 3em;line-height: 1;}
#intro .point i{font-size: 2.3em;width: 1.8em;height: 1.8em;}
#intro .point i::before{content: "";width: 2.5em;height: 1px;background: #333;display: block;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(45deg);}
#intro .point i::after{content: "";width: 2.5em;height: 1px;background: #333;display: block;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(-45deg);}
#intro .device{display: flex;font-size: 1vw;}
#intro .device > li{flex: 1;animation-name: fadeIn;}
#intro .device > li img{width: 100%;}
#intro .device > li i{position: absolute;left: 0;top: 0;width: 100%;height: 100%;animation-name: fadeIn;animation-delay: 0.2s;}
#intro .device > li p{position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;font-size: 1.4em;color: #fff;letter-spacing: 0.05em;text-align:center; animation-delay: 0.4s;}
#intro .device > li i{background: rgba(0,0,0,0.6);}
/* #intro .device > li:nth-of-type(1) i{background: rgba(0,0,0,0.5);}
#intro .device > li:nth-of-type(2) i{background: rgba(74,4,4,0.5);}
#intro .device > li:nth-of-type(3) i{background: rgba(27,40,54,0.7);} */

#intro .residence{display: flex;font-size: 1vw;margin:2em auto;width: 33.33436em;}
#intro .residence{flex: 1;animation-name: fadeIn;}
#intro .residence img{width: 100%;}
#intro .residence i{position: absolute;left: 0;top: 0;width: 100%;height: 100%;animation-name: fadeIn;animation-delay: 0.2s;}
#intro .residence p{position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;font-size: 1.8em;color: #fff;letter-spacing: 0.05em;text-align:center; animation-delay: 0.4s;}
#intro .residence i{background: rgba(1,18,38,0.5);}


#akashi_bridge{overflow: hidden;margin-top: 2.5em;}
#akashi_bridge video{width: 100%;height: 40vw;object-fit: cover;object-position: left 48%;}
#akashi_bridge p{color: #fff;font-size: 2.2em;letter-spacing: 0.1em;position: absolute;left: 0;bottom: 50%;width: 100%;animation-delay: 0.5s;animation-name: bokashi;text-align: center;text-shadow:0 0 0.1em #000000, 0 0 0.1em #000000, 0 0 0.1em #000000}

@media only screen and (min-width: 769px) and (max-width: 1400px){
#intro .point{font-size: 1.4vw;}
}

@media only screen and (min-width: 769px){
#intro .koudou dd p{animation-delay: 0.2s;}
#intro .point *:nth-child(2){animation-delay: 0.2s;}
#intro .point *:nth-child(3){animation-delay: 0.4s;}
#intro .point *:nth-child(4){animation-delay: 0.6s;}
#intro .point *:nth-child(5){animation-delay: 0.8s;}
#intro .device > li:nth-of-type(2){animation-delay: 0.3s;}
#intro .device > li:nth-of-type(2) i{animation-delay: 0.5s;}
#intro .device > li:nth-of-type(2) p{animation-delay: 0.7s;}
#intro .device > li:nth-of-type(3){animation-delay: 0.6s;}
#intro .device > li:nth-of-type(3) i{animation-delay: 0.8s;}
#intro .device > li:nth-of-type(3) p{animation-delay: 1.0s;}
#intro .device > li:nth-of-type(4){animation-delay: 0.9s;}
#intro .device > li:nth-of-type(4) i{animation-delay: 1.1s;}
#intro .device > li:nth-of-type(4) p{animation-delay: 1.3s;}
#intro .device > li:nth-of-type(4) p small{animation-delay: 1.4s;padding: 0.1em 0.5em;background:#b50000;margin-right:0.5em;font-size: 0.8em;line-height: 1.6;}
#intro .device > li:nth-of-type(4) p big{font-size: 0.4em;display: block;}
#intro .device > li:nth-of-type(4) p span{font-size: 0.7em;display: contents;}
}

@media only screen and (max-width: 768px){
#intro .koudou{flex-wrap: wrap;}
#intro .koudou p{font-size: 2.2em;padding: 0;display: inline-block;text-align: left;}
#intro .koudou > *{width: 100%;text-align: center;}
#intro .koudou dt{padding-bottom: 1.3em;}
#intro .koudou dd::before{left: 5vw;bottom: auto;top: 0;width: 90vw;height: 1px;}
#intro .koudou dd{padding-top: 1.5em;}
#intro .point{padding: 2em 0;flex-wrap: wrap;gap: 0.8em 0;}
#intro .point span{font-size: 2.3em;width: 100%;text-align: center;}
#intro .point i{font-size: 1.3em;}
#intro .point *:nth-child(2){animation-delay: 0.1s;}
#intro .point *:nth-child(3){animation-delay: 0.2s;}
#intro .device{flex-wrap: wrap;font-size: 2.8vw}
#intro .device > li{flex: auto;height: 17em;object-fit: cover;overflow: hidden;}
#intro .device > li p{font-size: 2.4em;}
#intro .device > li:nth-of-type(4) p small{animation-delay: 1.3s;padding: 0.1em 0.5em;background:#b50000;margin-right:0.5em;font-size: 0.8em;}
#intro .device > li:nth-of-type(4) p big{font-size: 0.5em;display: block;}
#intro .device > li:nth-of-type(4) p span{font-size: 0.7em;display: contents;}
#intro .device > li .cap_wb{bottom: 5.7em;}
#akashi_bridge video{width: 100%;height: 60vw;object-fit: cover;object-position: center 100%;}
#akashi_bridge p{font-size: 1.3em;bottom: 40%;}
}


/* コンテンツ共通 */
.contents_area{padding: 4em 0;}
.contents_area.panel::before{content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: url("../img/completion_bk.webp") no-repeat center bottom;mix-blend-mode: screen;}
.contents_area.panel + .panel{margin-top: 1.5em;}
.contents_area_wrap{width: 70em;margin-inline: auto;display: flex;align-items: center;gap: 0 2.5em;}
.contents_area_wrap > dt{width: 35em;}
.contents_area_tit{font-family: "EB Garamond", serif;background: linear-gradient(115deg, #bf9000, #ebc40d); -webkit-background-clip: text;-webkit-text-fill-color: transparent;font-size: 5em;line-height: 1;animation-name: bokashi;}
.contents_area_subtit{font-size: 2.1em;letter-spacing: 0.05em;}
.contents_area_subtit + p{font-size: 1em;margin-top: 0.3em;}
.read_more_btn{font-family: "EB Garamond", serif;font-size: 0.8em;display: inline-block;margin-top: 2em;padding-right: 3em;transition: 0.3s all;color: #000;animation-name: fadeInLeft;}
.read_more_btn::before{content: "";width: 100%;height: 1px;background: #000;position: absolute;left: 0;bottom: 0;}
.read_more_btn::after{content: "";width: 1em;height: 1px;background: #000;position: absolute;right: 0;bottom: 0;transform: rotate(20deg);transform-origin: right bottom;}

.contents_tit{font-family: YakuHanMP, "EB Garamond", "Zen Old Mincho", serif;text-align: center;font-size: 3em;animation-name: bokashi;}
.contents_tit + p{font-size: 1.4em;margin-top: 1em;letter-spacing: 0.1em;animation-name: bokashi;text-align: center;}
.contents_tit_area{text-align: center;}
.contents_tit_area > div i{font-size: 12.5em;line-height: 0.5;color: rgba(0,0,0,0.1);display: inline-block;opacity: 0;}
.contents_tit_area > div i.text_ani{animation: 0.7s fadeInDown 0s forwards;}
.contents_tit_area > span{position: absolute;top: 0.5em;left: 0; display: block;width: 100%;}
.contents_tit_area > span .contents_tit{font-size: 2.3em;}
.contents_tit_area > span .contents_tit + p{margin-top: 1.3em;}
.front_main{margin-top: 1.5em;font-size: 1vw;}
.front_main h4{position: absolute;left: 2.5em;top: 2.5em;animation-name: fadeInLeft;}
.front_main h4 img{height: 4.65em;}
.front_main figure::after{content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: linear-gradient(150deg,rgba(21,17,78,0.4),transparent 40%)}
.front_main figure img{width: 100%;}
.front_main .view_more_btn{position: absolute;right: 2.5em;bottom: 2.5em;animation-name: fadeInRight;}
.view_more_btn{font-family: "EB Garamond", serif;font-size: 1.2em;display: flex;justify-content: center;align-items: center;width: 11.7em;height: 2.5em;color: #fff;background: linear-gradient(120deg,#6c5010 35%,#9a792d 65%);transition: 0.3s all;}
.view_more_btn::before{content: "";display: block;width: calc(100% - 2px);height: calc(100% - 2px);position: absolute;inset: 0;margin: auto;background: #fff;opacity: 0;transition: 0.3s all;}
.view_more_btn i{display: inline-block;width: 1.04em;height: 0.125em;margin: auto 0;border-radius: 9999px;background-color: #fff;position: absolute;right: 0.6em;top: 0;bottom: 0;transition: 0.3s all;}
.view_more_btn i::before,
.view_more_btn i::after{content: "";position: absolute;top: calc(50% - 0.0625em);right: 0;width: 0.5em;height: 0.125em;border-radius: 9999px;background-color: #fff;transform-origin: calc(100% - 0.0625em) 50%;transition: 0.3s all;}
.view_more_btn i::before{transform: rotate(45deg);}
.view_more_btn i::after{transform: rotate(-45deg);}

.detail_slide{margin-top: 2.25em;}
.detail_slide .slick-track li{margin: 0 1em;}
.detail_slide .slick-disabled{opacity: 0;transition: 0.3s;pointer-events:none;}
.detail_slide .slick-arrow{height: 1.8em;position: absolute;inset: 0;margin: auto; z-index: 1;cursor: pointer;pointer-events: none;}
.detail_slide .slick-arrow img{height: 100%;pointer-events: painted;}
.detail_slide .slide_next{text-align: right;}
.detail_slide .slick-dots li{width: 2em;height: 0.4em;background: #bab8ba;}
.detail_slide .slick-dots li.slick-active{background: #896a23;}
.detail_slide .slick-dots li button{width: 100%;height: 100%;}
.detail_slide .slick-dots li button::before{display: none;}

.detail_slide02{margin-top: 2.25em;}
.detail_slide02 .slick-track li{margin: 0 1em;}
.detail_slide02 .slick-disabled{opacity: 0;transition: 0.3s;pointer-events:none;}
.detail_slide02 .slick-arrow{height: 1.8em;position: absolute;inset: 0;margin: auto; z-index: 1;cursor: pointer;pointer-events: none;}
.detail_slide02 .slick-arrow img{height: 100%;pointer-events: painted;}
.detail_slide02 .slide_next{text-align: right;}
.detail_slide02 .slick-dots li{width: 2em;height: 0.4em;background: #bab8ba;}
.detail_slide02 .slick-dots li.slick-active{background: #896a23;}
.detail_slide02 .slick-dots li button{width: 100%;height: 100%;}
.detail_slide02 .slick-dots li button::before{display: none;}

.accordion_wrap + .accordion_wrap{margin-top: 1em;}
.accordion_btn{cursor: pointer;background: #f1edea;padding: 0.3em;display: flex;align-items: center;justify-content: space-between;transition: 0.3s all;}
.accordion_btn::before{content: "";border: 1px solid #876813;position: absolute;left: 0.25em;top: 0.25em;width: calc(100% - 0.55em);height: calc(100% - 0.55em);pointer-events: none;}
.accordion_btn::after{content: "＋";font-size: 1.2em;font-family: "Noto Sans JP", sans-serif;line-height: 1;color: #fff;font-weight: 800;width: 1.7em;height: 1.7em;display: flex;justify-content: center;align-items: center;background: linear-gradient(45deg,#7e6125,#bea438,#7e6125);border-radius: 50%;position: absolute;right: 1.5em;top: 2.5em;}
.accordion_btn > figure{width: 10em;}
.accordion_btn > p{color: #333;font-size: 1.2em;width: calc(100% - 9.58em);}
.accordion_btn > p strong{color: #6f5b3b;}
.accordion_detail{display: none;cursor: pointer;z-index: 1;margin-top: -7.6em;}
.accordion_detail::after{content: "ー";font-size: 1.2em;font-family: "Noto Sans JP", sans-serif;line-height: 1;color: #fff;font-weight: 800;width: 1.7em;height: 1.7em;display: flex;justify-content: center;align-items: center;background: linear-gradient(45deg,#7e6125,#bea438,#7e6125);border-radius: 50%;position: absolute;right: 1.5em;top: 2.5em;}




@media only screen and (min-width: 769px) and (max-width: 1500px){
.contents_area_wrap{font-size: 1.3vw;}
}

@media only screen and (min-width: 769px){
.contents_area.panel:nth-child(odd) .contents_area_wrap > dd{order: 2;}
.read_more_btn:hover{padding-right: 4em;}
.view_more_btn:hover{color: #6c5010;}
.view_more_btn:hover::before{opacity: 1;}
.view_more_btn:hover i{transform: translateX(0.2em);background: #6c5010;}
.view_more_btn:hover i::before,
.view_more_btn:hover i::after{background: #6c5010;}
.accordion_btn:hover{opacity: 0.6;}
}

@media only screen and (max-width: 768px){
.contents_area{padding: 2em 1em;}
.contents_area_wrap{width: 100%;flex-wrap: wrap;gap: 1.8em 0;}
.contents_area_wrap > dt{width: 100%;}
.contents_area_tit{font-size: 4em;}
.contents_area_subtit{font-size: 1.6em;margin-top: 0.3em;}
.read_more_btn{font-size: 1em;}

.contents_tit{font-size: 2.2em;}
.contents_tit + p{font-size: 1.1em;margin-top: 0.7em;}
.contents_tit_area > div i{font-size: 4.1em;}
.contents_tit_area > span{top: -1em;}
.contents_tit_area > span .contents_tit{font-size: 1.9em;}
.contents_tit_area > span .contents_tit + p{margin-top: 0.5em;}
.front_main{margin-top: 4em;font-size: 3vw;}
.front_main h4{left: 1.5em;top: 1.5em;}
.front_main h4 img{height: 4em;}
.front_main .view_more_btn{font-size: 1.5em;right: 1em;bottom: 1em;}

.accordion_btn::after{right: 0.7em;top: 1.5em;}
.accordion_btn > figure{width: 8em;}
.accordion_btn > p{font-size: 0.9em;width: calc(100% - 9.5em);}
.accordion_btn > p strong{color: #6f5b3b;}
.accordion_btn > p strong.ch{transform: scaleX(0.85);display: inline-block;transform-origin: left;}
.accordion_detail{margin-top: -24.8vw;}
.accordion_detail::after{right: 0.7em;top: 1.5em;}
}


/* brand */
.history_wrap{overflow-x: auto;width: calc(50vw + 29em - 2.4em);padding: 0 0 1em 0;margin-left: -2em;-webkit-overflow-scrolling: touch;cursor: grab;user-select: none;-webkit-user-select: none;}
.history_wrap:active{cursor: grabbing;}
.history{display: flex;color: #231815;margin-top: 3.5em;margin-right: calc(50% - 50vw);width: calc(50vw + 29em - 2.4em);}
.history > li{overflow: hidden;padding: 0 0.75em;flex-shrink: 0;}
.history > li h5{display: inline-block;text-align: center;}
.history > li h5 span{font-family: "EB Garamond", serif;font-style: italic;font-size: 1.8em;letter-spacing: 0.1em;display: inline-block;padding-left: 0.1em;line-height: 1;opacity: 0;}
.history > li h5 small{font-size: 0.7em;display: block;opacity: 0;}
.history > li h5 i{width: 1.2em;height: 1.2em;border-radius: 50%;background: #4e4449;display: block;margin: 1em auto 0;}
.history > li h5 i::before{content: "";height: 1px;width: 100vw;background: #231815;position: absolute;top: 0;bottom: 0;margin: auto 0;right: 100%;}
.history > li h5 i::after{content: "";height: 1px;width: 100vw;background: #231815;position: absolute;top: 0;bottom: 0;margin: auto 0;left: 100%;}
.history > li:first-of-type h5 i::before{display: none;}
.history > li:last-of-type h5 i::after{display: none;}
.history > li p{font-size: 0.8em;margin: 1em 0 0 1.8em;white-space: nowrap;opacity: 0;}
.history > li.text_ani h5 span,
.history > li.text_ani h5 small,
.history > li.text_ani p
{animation: 0.7s fadeInLeft 0s forwards;}

@media only screen and (min-width: 769px){
#brand .img_list dl{display:flex;justify-content: space-between;}
#brand .img_list dt{width:75%;}
#brand .img_list dd{width:20%;}
#brand .img_list > figure{width: 16em;}
}

@media only screen and (max-width: 768px){
.history_wrap{overflow-x: auto;width: 100vw;padding: 0 0 1em 0;margin: 0 -6vw;}
.history{font-size: 0.9em;margin-top: 3.5em;margin-right: 0;width: 100%;}
}


/* Position */
/* #position{background: linear-gradient(to right,#9a782d,#6d5011);color: #fff;} 
 #position .read_more_btn{color: #fff;}
#position .read_more_btn::before,
#position .read_more_btn::after{background: #fff;} */

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

/* Akashi Front */
/* #akashi_life{background: linear-gradient(to right,#c4dfff,#15a5f1);} */
#akashi_life{margin-bottom: 1.5em;}

@media only screen and (min-width: 769px){
}


/* Completion */
#completion{background: url("../img/completion_bk.webp") top center/cover;}
#completion .catch{background: linear-gradient(to right, #725614, #9a792d, #725614);font-size: 1.4em;margin: 1em auto 0;animation-name: bokashi;text-align: center;color:#fff;padding: 0.3em;}
#completion .contents_wrap{margin-top: 2em;}
#completion .accordion_btn::after{top: 1.7em;}
#completion .accordion_detail::after{top: 1.7em;}
#completion .contents_wrap .accordion_detail{background: #f1edea;width: 100%;margin-top: -6.1em;}
#completion .contents_wrap .accordion_detail::before{content: "";border: 1px solid #876813;position: absolute;left: 0.25em;top: 0.25em;width: calc(100% - 0.55em);height: calc(100% - 0.55em);pointer-events: none;}
#completion .contents_wrap .accordion_detail .wrap{width: 100%;height: 100%;padding: 5em 1.5em 3em;display: grid;justify-content: space-between;grid-template-columns: 21em 25em;}
#completion .contents_wrap .accordion_detail .wrap .completion_lead{margin-top: 1.5em;}
#completion .contents_wrap .accordion_detail .wrap figure{grid-row: 1/3;grid-column: 2/3;}
#completion .contents_wrap .accordion_detail .wrap figure img{width: 100%;}
#completion .contents_wrap .accordion_detail .completion_tit{font-size: 1.4em;color: #6f5b3b;display: flex;flex-direction: column;justify-content: flex-end;}
#completion .contents_wrap .accordion_detail .completion_tit span{font-size: 1.2em;font-family: "EB Garamond", serif;display: block;margin-bottom: 0.3em;color: #000;line-height: 1;letter-spacing: 0.05em;}
#completion .contents_wrap .accordion_detail .completion_lead p{font-size: 0.8em;letter-spacing: 0.05em;}
#completion .contents_wrap .accordion_detail .completion_lead p + p{margin-top: 1em;}
#completion .contents_wrap .merit2 .accordion_detail .wrap .completion_lead{display: flex;flex-direction: column;justify-content: flex-end;margin-top: 0;}
#completion .contents_wrap .merit2 .accordion_detail .wrap figure{grid-row: 2/3;grid-column: 1/3;margin-top: 1.25em;}



@media only screen and (max-width: 768px){
#completion .contents_wrap{padding: 0;}
#completion .catch{font-size: 1.2em;}
#completion .accordion_btn::after{top: 1.3em;}
#completion .accordion_detail::after{top: 1.3em;}

#completion .contents_wrap .accordion_detail{margin-top: -20vw;}
#completion .contents_wrap .accordion_detail .wrap{display: flex;flex-direction: column;padding: 1.5em;font-size: 3.4vw;}
#completion .contents_wrap .accordion_detail .completion_tit{font-size: 1.2em;letter-spacing: 0.05em;}
#completion .contents_wrap .accordion_detail .wrap .completion_tit + figure{height: 50vw;overflow: hidden;}
#completion .contents_wrap .accordion_detail .completion_lead{margin-top: 0.7em;}
#completion .contents_wrap .accordion_detail .completion_lead + figure{margin-top: 1.2em;}
#completion .contents_wrap .merit2 .accordion_detail .wrap .completion_lead{margin-top: 0.7em;}
#completion .contents_wrap .merit2 .accordion_detail .wrap .completion_lead + figure{width: 80vw;height: 50vw;overflow: hidden;}
#completion .contents_wrap .merit2 .accordion_detail .wrap .completion_lead + figure img{width: auto;height: 100%;left: 50%;transform: translateX(-50%);max-width: none;}
}


/* Plan */
#plan{background: #f7f7f7;}
#plan .plan_slide{margin-top: 2.25em;font-family: YakuHanMP, "EB Garamond","Zen Old Mincho", serif;display: flex;flex-wrap: wrap;gap: 3em 0;justify-content: space-between;}
#plan .plan_slide li{width: 23em;}
#plan .plan_slide li{cursor: pointer;transition: 0.3s all;display: flex;flex-direction: column;justify-content: space-between;background: #fff;padding: 1.5em 1.5em 1.25em;box-shadow: 0.05em 0.05em 0.2em rgba(0,0,0,0.4);}
#plan .type_tit_wrap{display: flex;justify-content: space-between;border-bottom: 1px solid #333;color: #231815;padding-bottom: 0.3em;}
#plan .type_tit{font-size: 1.4em;text-align: center;color: #51a6dd;}
#plan .type_tit big{font-size: 2.1em;line-height: 1;letter-spacing: 0.1em;}
#plan .square{font-size: 2em;text-align: center;margin-top: 0.3em;line-height: 1;color: #231815;}
#plan .square strong{color: #51a6dd;}
#plan .square small{font-size: 0.4em;margin-right: 0.8em;vertical-align: 0.5em;}
#plan .square big{font-size: 1.25em;line-height: 1;}
#plan .ldk{text-align: center;font-size: 1.8em;margin: 0.2em 0;letter-spacing: 0.05em;color: #231815;}
#plan .ldk span{color: #51a6dd;}
#plan .ldk big{font-size: 1.4em;line-height: 1;}
#plan .ldk small{font-size: 0.85em;}
#plan .plan_slide li figure{margin-top: auto;text-align: center;}
#plan .plan_slide li figure img{display: inline-block;}
#plan .plan_slide li figure::before{content: "";width: 2.4em;height: 1.35em;background: url("../img/top/direction.svg") no-repeat center center/contain;position: absolute;}
#plan .plan_slide li .view_more_btn{font-size: 0.9em;width: 13.3em;height: 2.2em;margin: 1.5em auto 0;}
#plan .plan_slide li .view_more_btn::after{content: "";width: 1.17em;height: 1.17em;position: absolute;right: 0.7em;top: 0;bottom: 0;margin: auto 0;background: url("../img/zoom_in.svg") no-repeat center center/contain;transition: 0.3s all;}
#plan .plan_slide li.Atype_btn figure::before{bottom: 0;right: 2.2em;}
#plan .plan_slide li.Atype_btn figure img{height: 25em;}
#plan .plan_slide li.Btype_btn figure img{height: 25em;}
#plan .plan_slide li.Ctype_btn figure img{height: 25em;}
#plan .plan_slide li.Dtype_btn figure img{height: 25em;}

#plan .slide_modal > *{pointer-events: auto;}
#plan .slide_modal{z-index: 1000001;position: fixed;display: none;overflow-y: auto;width: 50em;max-height: calc(80vh - 2.5em);height: 40em;inset: 0;top: -3em;padding: 2em;margin: auto;background: #fff;}
#plan .slide_modal .type_modal_item{display: grid;justify-content: space-between;grid-template-columns: 20em 23em;grid-template-rows: max-content 1fr max-content;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area{font-family: YakuHanMP, "EB Garamond","Zen Old Mincho", serif;display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 1em;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .type_tit{display: flex;padding-bottom: 0.5em;align-items: flex-end;text-align: left;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .type_tit i{height: 1.8em;width: 1px;background: #333;margin-left: 0.5em;margin-right: 0.5em;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .type_tit .ldk{text-align: left;font-size: 1.4em;margin: 0 0 -5px 0;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square{text-align: left;display: inline-block;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square small{display: block;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square big{font-size: 1.5em;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square span{font-size: 0.4em;display: block;text-align: right;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square_case{margin-top: 1.5em;font-size: 0.75em;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square_case th{text-align: left;padding-bottom: 0;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square_case td:first-of-type{padding: 0 0.3em 0;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square_case td{text-align: right;padding-bottom: 0;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square_case + .note{margin-top: 0.5em;}
#plan .slide_modal .type_modal_item > .feature{margin-top: 1em;}
#plan .slide_modal .type_modal_item > .feature p{font-size: 0.75em;padding: 0.8em 0;border-top: 1px solid #333;}
#plan .slide_modal .type_modal_item > .feature p:last-of-type{border-bottom: 1px solid #333;}
#plan .slide_modal .type_modal_item > .feature dl{display: flex;flex-wrap: wrap;justify-content: center;}
#plan .slide_modal .type_modal_item > .feature dl dt{width: 70%;margin-top:1em;}
#plan .slide_modal .type_modal_item > .feature dl dd{width: 70%;margin-top:0.5em;}
#plan .slide_modal .type_modal_item > .plan_note{margin-top: 0.5em;grid-row: 3/4;}
#plan .slide_modal .type_modal_item > .plan_img{text-align: center;grid-row: 1/4;grid-column: 2/3;}
#plan .slide_modal .type_modal_item > .plan_img img{height: 34em;}
#plan .slide_modal .type_modal_item > .plan_img::before{content: "";width: 2.4em;height: 1.35em;background: url("../img/top/direction.svg") no-repeat center center/contain;position: absolute;}
#plan .slide_modal .type_modal_item + .note{margin-top: 1em;}
#plan .slide_modal .close_btn{background: #3d2414;text-align: center;font-size: 0.9em;color: #fff;padding: 0.1em;border: 1px solid #3d2414;width: 11em;margin: 1.5em auto 0;transition: 0.3s all;cursor: pointer;}
#plan #Atype .type_modal_item > .plan_img::before{bottom: 0;right: 1em;}
#plan #Gtype .type_modal_item > .plan_img::before{bottom: 1em;right: -3em;transform: rotate(180deg);}
#plan #Jtype .type_modal_item > .plan_img::before{bottom: 0;right: 1em;}
.modal_bk{display: none;position: fixed;z-index: 1000000;inset: 0;background: rgba(0,0,0,0.9);cursor: pointer;}
.close_btn{display: none;position: fixed;z-index: 1000001;bottom: 2em;left: 0;right: 0;margin-inline: auto; font-family: "EB Garamond", serif;font-size: 0.9em;width: 13.3em;color: #fff;background: linear-gradient(120deg,#6c5010 35%,#9a792d 65%);transition: 0.3s all;padding: 0.2em;text-align: center;cursor: pointer;}
.close_btn::before{content: "";display: block;width: calc(100% - 2px);height: calc(100% - 2px);position: absolute;inset: 0;margin: auto;background: #fff;opacity: 0;transition: 0.3s all;}
.close_btn i{width: 1.8em;height: 1.8em;position: absolute;top: 0;bottom: 0;margin: auto 0;left: 1.5em;font-size: 0.5em;}
.close_btn i::before{content: "";width: 2.5em;height: 1px;background: #fff;display: block;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(45deg);transition: 0.3s all;}
.close_btn i::after{content: "";width: 2.5em;height: 1px;background: #fff;display: block;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%) rotate(-45deg);transition: 0.3s all;}

@media only screen and (min-width: 769px){
#plan .plan_slide li .view_more_btn:hover::after{background: url("../img/zoom_in_on.svg") no-repeat center center/contain;}
.close_btn:hover{color: #6c5010;}
.close_btn:hover::before{opacity: 1;}
.close_btn:hover i::before,
.close_btn:hover i::after{background: #6c5010;}
}

@media only screen and (max-width: 768px){
#plan .plan_slide{justify-content: center;}
#plan .plan_slide li{font-size: 0.8em;}
#plan .slide_modal{width: 90vw;height: 90vh;inset: 0;top: -3em;padding: 2em 1em;}
#plan .slide_modal .type_modal_item{gap: 1.5em 1.5em;display: block;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area{display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 1em;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square big{font-size: 1.5em;}
#plan .slide_modal .type_modal_item > .type_modal_tit_area .square_case{align-self: flex-end;}
#plan .slide_modal .type_modal_item > .plan_img img{height: auto;width: calc(100% - 4em)}
#plan .slide_modal .type_modal_item > .feature dl dt{width: 80%;}
#plan .slide_modal .type_modal_item > .feature dl dd{width: 80%;}
#plan .slide_modal .type_modal_item > .plan_note{margin-top: 1em;}

#plan #Gtype .type_modal_item > .plan_img::before{bottom: 1em;right: 1em;}

.close_btn{bottom: 2em;}
}






/* Quality */
#quality{background: url("../img/quality_bk.webp") no-repeat top left;}
#quality .contents_wrap{margin-top: 2em;}

@media only screen and (max-width: 768px){
#quality{background: url("../img/quality_bk.webp") no-repeat top left 10%;}
#quality .contents_wrap{padding: 0;}
}