@charset "utf-8";

/* TOP 詳しくはコチラ*/
/* popup-open */

#spot .popup-open{margin: 0 auto 9vw;width: 81.3%;}
#spot .popup-open{display: flex;justify-content: center;align-items: center;height: 12.8vw;border-radius: 9999px;background: #CF2C37 url(../../asset/images/spot/arrow.png) no-repeat right 10.5vw center;background-size: 8.53vw auto;}
#spot .popup-open span{color: #fff;font-size: 6.13vw;font-weight: 500;line-height: 1;padding: 0 16vw 0 0;background: none;}
.popup {z-index: 10;position: fixed;top: 0;left: 0;width: 100%;height: 100%;transform: scale(0);background-color: rgba(0, 0, 0, 0.8);opacity: 0;transition: opacity 0.3s, transform 0s 0.3s;}
.popup__btn {display: block;z-index: 13;position: absolute;top: 1vh;right: 4vh;width: 5vh;height: 5vh;cursor: pointer;}
.popup__btn::before,.popup__btn::after {position: absolute;top: 50%;width: 100%;height: 2px;margin-top: -1px;background-color: #fff;content: '';}
.popup__btn::before {transform: rotate(45deg);}
.popup__btn::after {transform: rotate(-45deg);}
.popup__btnarea {z-index: 12;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.popup__img {z-index: 11;position: absolute;top: 15%;left: 5%;width: 90%;height: 90%;}
.popup__img_inner{width: 100%;}
.popup__img_inner img {width: 100%;height: auto;/* object-fit: contain; */padding: 0.5vw;}
input[type="checkbox"] { display: none;}
input[type="checkbox"]:checked ~ .popup {transform: scale(1);opacity: 1;transition: opacity 0.3s;}

@media screen and (min-width: 1024px) {
.popup-open{margin: 0 auto 68px !important;width: 81.3% !important;}
.popup-open{height: 96px !important;background-position:right 80px center !important;background-size: 60px auto !important;}
.popup-open span{font-size: 46px !important;padding: 0 120px 0 0 !important;}
.popup {overflow-y: scroll;}
.popup__img {top: 12%;left: 25%;width: 50%;height: 100%;}
.popup__img_inner img {width: 100%;}
}