@charset "UTF-8";

/* メイン */
main{text-align:center;}

.main_slide{height: calc(52vw - 8px - 10%);overflow: hidden;z-index: 1;}
.main_slide li{margin: 0 20px;}
.main_slide img{width: 100%;}
.main_slide p{position: absolute;left: 0;top: 0;width: 100%;z-index: 1;display: none;}
.main_slide_copy{width: 43%;position: absolute;left: 3%;bottom: 5%;z-index: 2;filter: drop-shadow(0 0 0.1vw #403000) drop-shadow(0 0 0.1vw #403000) drop-shadow(0 0 0.1vw #403000) drop-shadow(0 0 0.1vw #403000);opacity: 0;animation: 2s fadeIn 1s forwards;}
.main_slide .slick-arrow{height: 40px;position: absolute;top: 0;bottom: 0;margin: auto 0;filter: drop-shadow(0 0 0.1em #000) drop-shadow(0 0 0.15em #000);z-index: 1;cursor: pointer;}
.main_slide .slick-arrow img{height: 40px;}
.main_slide .prev_btn{left: 4%;}
.main_slide .next_btn{right: 4%;}

@media screen and (min-width: 2000px) {
.main_slide{height: 1080px;}
.main_slide img{width: 1920px;height: 1080px;}
.main_slide .slick-arrow{width: 1985px;margin: auto;pointer-events: none;left: 0;right: 0;cursor: none;}
.main_slide .prev_btn img{pointer-events: painted;cursor: pointer;width: 22px;}
.main_slide .next_btn{text-align: right;}
.main_slide .next_btn img{pointer-events: painted;cursor: pointer;width: 22px;}
}

@media screen and (max-width: 768px) {
.main_slide{height: 100vw;}
.main_slide li{margin: 0;}
.main_slide_copy{width: 55%;left: 3%;bottom: 5%;filter: drop-shadow(0 0 0.5vw #403000) drop-shadow(0 0 0.5vw #403000) drop-shadow(0 0 0.5vw #403000) drop-shadow(0 0 0.5vw #403000);}
.main_slide .slick-arrow{height: 30px;}
.main_slide .prev_btn{left: 3%;}
.main_slide .next_btn{right: 3%;}
}

/* 行動提起 */
#koudou{padding: 50px 0 0;}
.koudou_tit{text-align: center;margin:0 auto;animation-name: fadeIn;}
.koudou_tit img{width: 680px;}
.koudou_item{display: flex;justify-content: center;flex-wrap: wrap; margin-top: 35px;background: #50746b;animation-name: fadeInUp;padding-bottom: 10px;}
.koudou_item > *{text-align: center;padding: 15px;}
.koudou_item > dt{background: #6c9d91;width: 100%;border-bottom: 1px solid #fff;}
.koudou_item > dt img{width: 840px;}
.koudou_item > dd{animation-name: fadeInUp;padding: 8px 40px;border-right: 1px solid #fff;margin-top: 10px;}
.koudou_item > dd:last-of-type{border-right: none;}
.koudou_item > dd img{height: 105px;}

#koudou .reservation_btn{display: block;width: 620px;margin: 40px auto 0;overflow: hidden;}
#koudou .reservation_btn::before{content: "";display: block; width: calc(100% - 12px);height: calc(100% - 12px);border: 1px solid #fff;position: absolute;top:0;bottom:0;left:0;right: 0;margin: auto;z-index: 1;pointer-events: none;}
#koudou .reservation_btn::after{content:"";position: absolute;display: inline-block;top: -180px;left: 0;width: 30px;height: 100%;background-color: #fff; animation: shiny 3s ease-in-out infinite;z-index: 1;pointer-events: none;}
#koudou .reservation_btn a{font-size: 32px;padding: 25px 0 28px;}
#koudou .reservation_btn a span{font-size: 0.6em;display: block;}

@keyframes shiny {
    0% { transform: scale(0) rotate(45deg); opacity: 0; }
    10% { transform: scale(0) rotate(45deg); opacity: 0.5; }
    11% { transform: scale(4) rotate(45deg); opacity: 1; }
    30% { transform: scale(50) rotate(45deg); opacity: 0; }
    100%{ transform: scale(50) rotate(45deg); opacity: 0; }
}

@media screen and (min-width: 769px) {
.koudou_item > *:nth-of-type(2){animation-delay: 0.2s;}
.koudou_item > *:nth-of-type(3){animation-delay: 0.4s;}
#koudou .reservation_btn:hover::after{animation: none;}
}

@media screen and (max-width: 768px) {
#koudou{padding: 20px 0 0;}
.koudou_tit{}
.koudou_item{flex-wrap: wrap;margin-top: 20px;padding-bottom: 2vw;}
.koudou_item > *{padding: 3vw 5vw;}
.koudou_item > dd{padding: 1vw 3vw;margin-top: 2vw;}
.koudou_item > dd img{height: 16.3vw;}

#koudou .reservation_btn{width: 100%;margin: 30px auto 0;max-width: 600px;}
#koudou .reservation_btn::before{width: calc(100% - 10px);height: calc(100% - 10px);}
#koudou .reservation_btn a{font-size: 22px;padding: 18px 0 20px;}
}


.linkpanel_slide{margin-top: 50px;}
.linkpanel_slide a{margin: 0 15px;cursor: pointer;color: #fff;}
.linkpanel_slide a figure{overflow: hidden;}
.linkpanel_slide a figure > img{transition: 0.6s all;}
.linkpanel_slide a figure figcaption{text-decoration: none;font-size: 0.65em;position: absolute;right: 1.5em;bottom: 0.8em;z-index: 4;}
.linkpanel_slide .slick-arrow{height: 40px;position: absolute;top: 0;bottom: 0;margin: auto 0;filter: drop-shadow(0 0 0.1em #000) drop-shadow(0 0 0.15em #000);z-index: 1;cursor: pointer;}
.linkpanel_slide .slick-arrow img{height: 100%;}
.linkpanel_slide .prev_btn{left: 3%;}
.linkpanel_slide .next_btn{right: 3%;}
.linkpanel_slide a sup{vertical-align: 0.4em;font-size: 0.6em;}
#merit .linkpanel_slide a{width: 400px;font-size: 20px;}
#merit .linkpanel_slide a figure::before{content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: linear-gradient(to bottom,transparent 50%,rgba(0,0,0,0.9) 100%);z-index: 1;}
#merit .linkpanel_slide a.bnr_youtube figure::after{content: "";display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: url("../img/merit_slide01_yt.png") no-repeat center center/contain;z-index: 2;}
#merit .linkpanel_slide a p{text-decoration: none;position: absolute;left: 0;bottom: 0;padding: 0 1em 0.5em;z-index: 4;}
#merit .linkpanel_slide a p small{text-decoration: none;display: inline-block;margin-top: 0.8em;font-size: 0.8em;}

@media screen and (min-width: 769px) {
.linkpanel_slide a:hover figure > img{transform: scale(1.05);}
}

@media screen and (max-width: 768px) {
.linkpanel_slide{margin-top: 30px;}
.linkpanel_slide a{margin: 0 2vw;}
.linkpanel_slide a figure > img{width: 100%;}
.linkpanel_slide .slick-arrow{height: 30px;}
#merit .linkpanel_slide a{width: 70vw;font-size: 4vw;}
}


/* バナー（YouTube） */
#bnr_youtube{text-align:center;max-width: 1024px;margin: 0 auto;}
#bnr_youtube > a{margin-top: 50px;display: inline-block;animation-name: fadeInUp;}
.bnr_youtube{display: inline-block;cursor: pointer;}
.bnr_youtube_modal{display: none;padding: 0;background-color: #ffffff;color: #666666;position:fixed;z-index: 10002;max-width: 1400px;max-height: 787.5px;width: 80vw;height: 45vw;top: 0;bottom: 0;left: 0;right: 0;margin: auto;}
.youtube_res{padding-top: 56.25%;width: 100%;position: relative;}
.youtube_res iframe {position: absolute;top: 0;right: 0;width: 100% !important;height: 100% !important;}
.bnr_youtube_modal .youtube_modalClose{position: absolute;font-size: 30px;color:#fff;display: inline-block;right: 0;top:-35px;line-height: 1;cursor: pointer;}
#top #modal-main {display: none;width: 800px;height: 520px;margin: 0;padding: 0;background-color: #ffffff;color: #666666;position:fixed;z-index: 10001;}
#modal-bg{display:none;width:100%;	height:100%;background-color: rgba(0,0,0,0.8);position:fixed;top:0;left:0;z-index: 10000;}
#top .modalClose{width: 40px;height:40px;position: absolute;top:5px;right: 5px;cursor: pointer;}
#bnr_youtube a:hover{opacity:0.8}

@media screen and (max-width: 768px) {
#bnr_youtube{text-align:center;margin: 0 5px;}
#bnr_youtube > a{margin-top: 30px;}
.bnr_youtube_modal{width: 95vw;height: 50.625vw;}
#modal-bg {display:none;width:100%;height:100%;background-color: rgba(0,0,0,0.75);	position:fixed;top:0;left:0;z-index: 10001;}
}


/* 各項目へのリンク */
#link_area{margin: 0 auto;/* max-width: 1920px; */background: #f0f4f3;padding: 60px 0 50px;}
.link_area_tit{font-size: 60px;text-align: center;color: #8c7e71;letter-spacing: 0.1em;padding-left: 0.1em;font-family: 'EB Garamond', serif;line-height: 1;}
#link_area .linkpanel_slide a{width: 380px;font-size: 22px;}
#link_area .linkpanel_slide a figure{border-radius: 15px;}
#link_area .linkpanel_slide a .copy{position: absolute;top: 14%;left: 0;z-index: 1;width: 100%;text-align: center;}
#link_area .linkpanel_slide a .copy h3{font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;letter-spacing: 0.1em;line-height: 1;font-size: 1.65em;padding-left: 0.1em;}
#link_area .linkpanel_slide a .copy h3 + p{margin-top: 0.7em;}
#link_area .linkpanel_slide a .vm_btn{font-size: 0.7em;padding: 0.5em;width: 11em;text-align: center;border: 1px solid #fff;background: rgba(0,0,0,0.5);position: absolute;left: 0;right: 0;margin: 0 auto;bottom: 20%;}


@media screen and (min-width: 1921px) {
.link_area_item > dt figcaption{font-size: 12px;}
.link_area_item > dd{font-size: 32px;}
}

@media screen and (max-width: 768px) {
#link_area{padding: 30px 0 30px;}
.link_area_tit{font-size: 30px;}
#link_area .linkpanel_slide a{width: 75vw;font-size: 4.2vw;}
}




/* cococi */
#cococi{background: url("../img/cococi_bk.webp") no-repeat center center/cover;font-size: 30px;padding: 3em 1em;margin-top: 50px;color: #333;}
#cococi > i{animation-name: fadeIn;display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: rgba(255,255,255,0.8);}
.cococi_tit{width: 16.3em;margin: 0 auto;z-index: 2;animation-name: fadeInUp;animation-delay: 0.1s;}
.cococi_tit + p{text-align: center;margin-top: 1em;z-index: 2;letter-spacing: 0.05em;animation-name: fadeInUp;animation-delay: 0.1s;}
.cococi_item{display: flex;flex-wrap: wrap;height: 21.9334em;z-index: 2;width: 25em;margin: 1em auto 0;}
.cococi_item > i{display: block;width: 100%;height: 100%;position: absolute;left: 0;top: 0;background: url("../img/cococi_i.png") no-repeat center center/contain;animation-name: cococi_i;animation-delay: 0.1s;}
.cococi_item li{z-index: 3;width: 50%;height: 50%;text-align: center;display: flex;justify-content: center;align-items: center;flex-direction: column;animation-delay: 0.3s;animation-name: fadeIn;}
.cococi_item li:nth-of-type(even){animation-delay: 0.6s;}
.cococi_item li p{font-size: 1.2em;letter-spacing: 0.1em;}
.cococi_btn{color: #fff;font-size: 0.6em;background: #888176;width: 13em;padding: 0.5em;text-align: center;margin-top: 0.5em;}
.cococi_btn::before{content: "";width: 1.2em;height: 0.8em;display: block;position: absolute;right: 1.2em;top: 0;bottom: 0;margin: auto 0;transition: 0.3s all;background: url("../img/btn_arrow.svg") no-repeat center center/contain;}

@keyframes cococi_i {
0% {transform: rotate(10deg);opacity: 0;}
100% {transform: rotate(0deg);opacity: 1;}
}

@media screen and (min-width: 769px) {
.cococi_btn:hover::before{transform: translate(8px);}
}

@media screen and (max-width: 768px) {
#cococi{font-size: 20px;padding: 3em 0;margin-top: 30px;}
.cococi_tit{width: 14em;}
.cococi_tit + p{font-size: 0.9em;}
.cococi_item{height: 90vw;width: 95vw;}
.cococi_item li{font-size: 3.8vw;}
.cococi_btn{font-size: 0.8em;}
}


/* エコノスシティ */
#econos_city{background: url("../img/econos_city_bk.jpg") no-repeat right bottom;padding: 80px 0 70px 0;text-align: center;}
#econos_city .logo_img{width:25%;margin:0 auto 30px;animation-name: fadeInUp;}
.lead_tit{font-size: 30px;letter-spacing: 0.05em;animation-name: fadeIn;}
.lead_tit span{display: inline-block;}
.lead_tit + p{margin-top: 20px;line-height: 1.8;animation-name: fadeIn;}

@media screen and (max-width: 768px) {
#econos_city{background: url("../img/econos_city_bk_sp.jpg") no-repeat right bottom;padding: 30px 0;margin-top: 30px;}
#econos_city .logo_img{width:40%;}
.lead_tit{font-size: 22px;}
.lead_tit + p{margin-top: 15px;text-align: left;}
}


@media screen and (max-width: 768px) {
footer{padding-top: 0;}
}


/* バナー */
.bnrArea{max-width:1024px;margin:50px auto;}
.bnrArea a:hover{opacity:0.6;}

@media screen and (max-width: 768px) {
.bnrArea{max-width:100%;margin:20px auto;}
}


/* Floating */
.floating_btn{display: none;position: fixed;right: 0;bottom: 5%;z-index: 10000;transition: 0.3s all;}
.floating_btn .close_btn{line-height: 1;font-size: 18px;color: #fff;font-weight: 500;display: flex;justify-content: center;align-items: center;background: #000;width:30px;height: 30px;position: absolute;top: 3px;right: 2px;border-radius: 5px;z-index: 1;cursor: pointer;}
.floating_btn .close_btn::before,
.floating_btn .close_btn::after{content: "";display: block;height: 3px;width: 50%;background: #fff;position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;}
.floating_btn .close_btn::before{transform: rotate(45deg);}
.floating_btn .close_btn::after{transform: rotate(-45deg);}
.floating_btn.bn_off{opacity: 0;pointer-events: none;}

.floating_btn{display: none;position: fixed;right: 0;bottom: 0;z-index: 10000;transition: 0.3s all;max-width: 500px;width:50%;}
.floating_btn a:hover{opacity:0.8;}
.floating_btn img{width:100%;}
.floating_btn i{line-height: 1;display: flex;justify-content: center;align-items: center;font-size: 18px;width: 1.5em;height: 1.5em;color: #fff;background: #000;position: absolute;right: 0;top: 0;z-index: 1;cursor: pointer;}
.floating_btn.bn_off{opacity: 0;pointer-events: none;}

@media screen and (max-width: 768px) {
.floating_btn{width: 100%;left: 0;right: 0;bottom: 55px;margin: 0 auto;}
.floating_btn i{top: -1.5em;}
.floating_btn .close_btn{top: 4px;}

}