@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gabarito:wght@400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alata&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gelasio:ital,wght@0,400..700;1,400..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');


.dfw { display: flex ; flex-wrap: wrap; }

.MG25 ::selection { background: #F2F2F2; color:#2F2F2F; }
.MG25 { width: 100%; }


.ig25 { margin: 40px 0 0; }
.ig_top { position: relative;}
.ig_top .bg img { aspect-ratio: 2/1; object-fit: cover; height: 100%; width: 100%; border-radius: 30px 30px 0 0 ; object-position: center 48%; }
.ig_top .bgt { position: absolute; z-index: 1; left:0; right:0; bottom: -73px; }
.ig_top .bgt h2 { color:#FFBF61 !important; font-size: 2rem; font-family: "Zen Old Mincho", serif; font-weight: 400; font-style: normal; text-shadow: none !important; transform: scale(1, 1.6); letter-spacing: 8px; }
.ig_top .bgt p {color:#FFBF61 ; font-size: 0.9rem; font-weight: 900; padding: 10px 0; letter-spacing: 2px; }
.ig_top .bgt h1 {  margin:200px 0 20px; color:#FFBF61 ;  font-size: 5.2rem;  font-family: "Cormorant Garamond", serif; font-weight: 400;}

.grand_info { background-color: #3A7D85; padding:0 0 150px;background-image: url("https://www1.loyaltytour.com.tw/eWeb_loyaltytour/IMGDB/000211/00004662.PNG"); background-position: center bottom -80px; background-size: cover;}
.ig25 .grand_info .igc { margin:0 0 50px; padding:85px 0 25px; background-color: #326C73;}
.ig25 .grand_info .igc *, .ig25 .grand_info .igc_act * { color: #FFBF61; }
.ig25 .grand_info .igc h5 { margin:0 0 20px; font-family: "Noto Serif JP", serif;  font-weight: 600; font-size: 1.6rem; letter-spacing: 2px; }
.ig25 .grand_info .igc p { padding:0 60px; font-size: 14.5px;}
.ig25 .grand_info .igc .link { padding:15px 0 ; }
.ig25 .grand_info .igc .link a { color: #FFBF61;  background-color: #3B5659; font-size: 0.85rem; padding:5px 15px; }
div.act img { object-fit: cover; aspect-ratio: 1/1; border-radius: 50%; height: 100%; width: 100%; max-width:95%; }
.igc_act { padding: 0 90px 30px;}
.igc_act .act .a_info { text-align: left; padding: 0 15px 0 40px;  margin: auto;}
.igc_act .act.cave .a_info { text-align: right; padding: 0 40px 0 15px;  margin: auto;}
.room .a_img , .exp .a_img { justify-items: right;}
.room .a_img img { object-position: left center;}
.cave .a_img img { object-position: 20% center; }
.act.cave, .act.exp { margin:-8px 0 0 ;}
.igc_act .act .a_info h6 { font-size: 1.25rem; font-family: "Noto Serif JP", serif;  font-weight: 700; margin: 0 0 10px;}
.t_bg { margin: -260px 0 0; }
.act .a_info p { font-size: 14.5px;}

@media (max-width:1399px){ /*xxl*/
    .ig_top .bgt h1 { font-size: 4.8rem; margin: 170px 0 25px; }
    .ig_top .bgt {bottom: -70px; }
}


@media (max-width:1250px){ 
    .ig_top .bg img { aspect-ratio: 2 / 1.2;    object-position: center 20%;}
    .act.cave, .act.exp { margin: 0; }
    .igc_act { padding: 0 60px 30px; }
}

@media (max-width:1199px){ /*xl*/
   
    .ig_top .bgt { bottom: -65px; }
    .ig_top .bgt h1 {margin: 190px 0 20px; }

    .ig25 .grand_info .igc h5 { font-size: 1.45rem; letter-spacing: 1px; }
    .ig25 .grand_info .igc p { padding: 10px 0;font-size: 14px;  }
    .ig25 .grand_info .igc { padding: 65px 0 25px; margin: 0 0 40px;}
    
    .igc_act { padding: 0 45px 30px; }
    .act.cave { margin:10px 0;}
    .act .a_info p { font-size: 14px;}
    .t_bg { margin: -220px 0 0; }

}

@media (max-width:1050px){
    .ig_top .bgt { bottom: -60px; }
    .ig_top .bg img { aspect-ratio: 2 / 1.2;    object-position: center 15%;}
    .ig_top .bgt h1 { margin: 175px 0 15px; }
}

@media (max-width:1000px){

    .igc_act { padding: 0 30px 30px; }
    .act.cave { margin: 15px 0; }
    .igc_act .act .a_info {padding: 0 15px;}
    .igc_act .act.cave .a_info { padding: 0 15px;}
}

@media (max-width:991px){ /*lg*/

    .ig_top .bg img { aspect-ratio: 2 / 1.3; object-position: center 10%;}
    .ig_top .bgt { bottom: -68px; }
    .ig_top .bgt h1 { font-size: 3.8rem; margin: 175px 0 30px;}

    .ig25 .grand_info .igc {  padding: 55px 0 25px; }
    .ig25 .grand_info .igc p { padding: 0 65px; }
    .ig25 .grand_info .igc h5 { font-size: 1.3rem; letter-spacing: 0; }

    .t_bg { margin: -180px 0 0; }
    .act.cave { margin: 25px 0; }
    
}

@media (max-width:767px){ /*md*/

    .ig25 .grand_info .igc { padding: 70px 0 25px; }
    .ig_top .bg img { aspect-ratio: 1 / 1.1;  border-radius: 20px 20px 0 0;  object-position: 46% center;}
    .ig_top .bgt h1 { font-size: 4.5rem; margin: 270px 0 36px; line-height: 0.6; }
    .ig_top .bgt h1 span { color: #FFBF61; font-size: 3rem; font-family: "Cormorant Garamond", serif; font-weight: 400; }
    .ig_top .bgt { bottom: -73px; }
    .ig_top .bgt h2 {font-size: 1.6rem; }
    .ig25 .grand_info .igc h5 { font-size: 1.5rem; letter-spacing: 1.6px;  line-height: 1.6; }
    .ig25 .grand_info .igc p { padding: 0 50px; }

    div.act img { max-width: 100%; }
    .igc_act { padding: 15px 30px 30px; }
    .igc_act .act.cave .a_info { text-align: justify; margin: 15px 0 0; }
    .act { margin: 0 0 45px; }
    .act.cave { margin: 0 0 45px; }
    .igc_act .act .a_info { margin: 15px 0 0;text-align: justify; }
    .t_bg { margin: -180px 0 0; }
    .t_bg img { aspect-ratio: 1.2 / 1; height: 100%; width: 100%; object-fit: cover; object-position: 47%;}

}


@media (max-width:575px){ /*sm*/

    .ig_top .bgt h1 { margin: 330px 0 36px; }
}

@media (max-width:480px){ 


    .ig_top .bg img { aspect-ratio: 1 / 1.25; }
    .ig_top .bgt h1 { margin: 300px 0 36px; }
    .ig25 .grand_info .igc h5 { font-size: 1.35rem; }
    .ig25 .grand_info .igc p { padding: 0 40px; }

}   

@media (max-width:425px){ /*m*/

    .ig_top .bgt h2 { font-size: 1.45rem; }
    .ig_top .bgt p { font-size: 0.75rem; }
    .ig_top .bgt h1 { font-size: 4rem; margin:252px 0 36px; }
    .ig_top .bgt h1 span {font-size:3.5rem; }

    .ig25 .grand_info .igc h5 {  font-size: 1.25rem; }


}