html{
  scroll-behavior: smooth;
}

body, .sub-wrap,.main-wrap{background-color: #E5E5E3;}
section,div,p,th,tr,td{font-family: 'Pretendard';}
img{vertical-align: bottom;}
/* header */
#header{position: fixed;top: 30px;left: 50%;transform: translateX(-50%);  width: 100%; max-width: 1680px;display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; z-index: 1111;     mix-blend-mode: difference;}
#header .menu-btn{color: #E5E5E3; cursor: pointer; font-family: 'DarkerGrotesque', sans-serif; font-size: 18px;font-weight: 600;}
.m-br{display: none;}
.p-br{display:block;}
.m-img{display: none;}
.pc-img{display:block;}
.m-txt{display: none;}
.pc-txt{display:block;}
@media(max-width:1024px){
  .m-txt{display: block;}
.pc-txt{display:none;}
  .m-img{display: block;}
.pc-img{display:none;}
  .m-br{display: block;}
.p-br{display:none;}
  #header{padding: 0 10px;}
  #header > div{flex: 1;text-align: center;}
  #header .logo img{max-width: 92px;;}
  #header .menu-btn{text-align: right;}
}

/* 왼 → 오른쪽 움직임 화살표 */
/*#header .go-reser .arrow-ani {overflow: hidden;position: relative;display: flex;align-items: center;justify-content: center;width: 40px;height: 33px;font-size: 30px;cursor: pointer;transition: 0.5s; margin-left:10px;}
#header .go-reser .arrow-ani::after  {content: '';position: absolute;left: 0;top: 50%;transition: .5s;  background-image: url('../image/arrow-right.png'); width: 36px;height: 18px; transform: translateY(-50%); background-repeat: no-repeat;}
#header .go-reser .arrow-ani::before{content: '';position: absolute;left: -100%;top: 50%;  transition: .5s;background-image: url('../image/arrow-right.png');width: 36px;height: 18px;transform: translateY(-50%);  background-repeat: no-repeat;}
#header .go-reser a{border-radius: 30px; transition: 0.3s; display: inline-flex; align-items: center;}

#header .go-reser a:hover .arrow-ani::before {left: 0%;top: 50%;}
#header .go-reser a:hover .arrow-ani::after {left: 100%;top:50%;}*/

#header .go-reser a {display: flex; align-items: center; gap:10px;}
#header .go-reser a img{ opacity: 0; visibility: hidden; transition: 0.3s;}
#header .go-reser:hover a img{opacity: 1; visibility: visible;}
.heritage-introduct{background-color: #E5E5E3;padding: 70px;}
.heritage-introduct .box{color:#172439;  text-align: center;}
.heritage-introduct .box h4{font-size: 20px;  font-family: 'Big_Caslon_CC'; }
.heritage-introduct .box h4 + p {font-size: 17px;  margin: 40px 0 20px 0; font-weight: 500; color: rgba(23,36,57,0.5);}
.heritage-introduct .box p:last-child{font-size: 15px; font-family: 'Big_Caslon_CC';color: #C1C3C6;}
#header .go-reser{    color: #E5E5E3;
    cursor: pointer;
    font-family: 'DarkerGrotesque', sans-serif;
    font-size: 18px;
    font-weight: 600;
    mix-blend-mode: unset;
   
    transition: 0.3s;
    
    box-sizing: border-box;}
 
@media(max-width:1680px){
  #header{padding: 0 20px;}
}
@media(max-width:1024px){
    #header .go-reser a img{display: none;}
    #header .go-reser .arrow-ani::after,#header .go-reser .arrow-ani::before{display: none;}

    #header .go-reser{font-size: 14px; text-align: left;}
  .heritage-introduct{padding: 60px 20px;}
  .heritage-introduct .box h4 + p{font-size: 14px; margin: 20px 0 20px 0;}
  .heritage-introduct .box p:last-child{font-size: 12px;}
}



.heritage-slide .box{position: relative;}
.heritage-slide .box .content{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2;}
.heritage-slide .box .content h2{font-size: 50px; color: #fff; text-align: center; font-family: 'Big_Caslon_CC', sans-serif; font-weight: 700; letter-spacing: 5px;}
.heritage-slide .box .content h2 small{font-size: 30px;  font-family: 'DarkerGrotesque', sans-serif; letter-spacing: 20px; font-weight: 300;}
.heritage-slide .box .swiper-slide img{object-fit: cover; width: 100%;}
.heritage-slide .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after, .heritage-slide .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{content: "";}
.heritage-slide .swiper-button-next, .heritage-slide .swiper-button-prev{color: #fff; outline: none; font-size: 24px; font-weight: 400;font-family: 'DarkerGrotesque', sans-serif; }
.heritage-slide .swiper-button-next{right: 40px; }
.heritage-slide .swiper-button-prev{left: 40px;}
.heritage-slide .swiper-button-prev::after{content: ""; position: absolute; width: 160px; height: 160px; border:1px solid #fff; right: -20px; } 
.heritage-slide .swiper-button-next::after{content: ""; position: absolute; width: 160px; height: 160px; border:1px solid #fff; left: -20px;  ;}
.heritage-slide .swiper-button-next::after,.heritage-slide .swiper-button-prev::after{top: 50%; transform: translateY(-50%); border-radius: 100%; transition: 0.3s ;opacity: 0;}
.heritage-slide .swiper-button-next:hover::after,.heritage-slide .swiper-button-prev:hover::after{opacity: 1;}
.heritage-slide .m-swiper-line{width: 0.5px; height: 17.5px;position: absolute; left: 50%; bottom:4.7%;  background-color: #fff; opacity: 0.5;   transform: translateX(-50%); z-index: 1;}
.heritage-slide .swiper-button-prev small, .heritage-slide .swiper-button-next small{opacity: 0;}
@media(max-width:1024px){
  .heritage-slide{height: auto;}
  .heritage-slide .box, .heritage-slide .box .heritage-slide-swiper,.heritage-slide .box .heritage-slide-swiper .swiper-slide, .heritage-slide .box, .heritage-slide .box .heritage-slide-swiper, .swiper-slide img{width: 100%;}

   
  
  .heritage-slide .swiper-button-prev small, .heritage-slide .swiper-button-next small{opacity: 1;}
  .heritage-slide .swiper-button-next, .heritage-slide .swiper-button-prev{bottom: 3px; top: auto; display: flex; gap: 10px; align-items: center; font-size: 18px; font-size: 17px; letter-spacing:2px ;} 
  .heritage-slide .swiper-button-next{right: 30%;} 
  .heritage-slide .swiper-button-prev{left: 30%;} 
  .heritage-slide .swiper-button-prev::after{display: none;}
  .heritage-slide .swiper-button-next::after,.heritage-slide .swiper-button-next::after{display: none;}
}

/*footer */
#footer{ box-sizing: border-box; border-radius:10px ; padding: 60px 0; ;}
#footer .footer-box{display: flex;justify-content: space-between; align-items: center; background-color: rgba(206, 206, 206, 0.5);  max-width: 1800px; margin: 0 auto; padding: 30px 100px; box-sizing: border-box;border-radius: 10px;}
#footer .footer-box > div{flex: 1;}
#footer .footer-box .footer-info{display: flex; align-items: center; color: #172439;}
#footer .footer-box .footer-info .footer-navi{padding-right: 70px;}
#footer .footer-box .footer-info .footer-navi ul{position: relative;}
#footer .footer-box .footer-info .footer-navi ul::after{content: ""; position: absolute;right: -35px; top:0; height: 100%; width: 0.5px; background-color: #172439; opacity: 0.5;}
#footer .footer-box .footer-info .footer-navi ul li{margin: 15px 0; text-align: right;}
#footer .footer-box .footer-info .footer-navi ul li a{font-size: 26px; font-family: 'Big_Caslon_CC', sans-serif;}
#footer .footer-box .footer-info .footer-navi ul li a small{font-size: 15px;}
#footer .footer-box .footer-info .footer-disc .number{font-family: 'Big_Caslon_CC', sans-serif;font-size: 30px; font-weight: 700;letter-spacing: 3px;text-transform: uppercase; margin-bottom: 30px;}
#footer .footer-box .footer-info .footer-disc .number a{display: inline-block;}
#footer .footer-box .footer-info .footer-disc{display: flex; flex-direction: column; }
#footer .footer-box .footer-info .footer-disc p{font-weight: 500; margin: 5px 0;}
#footer .footer-box .footer-info .footer-disc .copyright{font-size: 12px; display: flex; align-self: center; margin-top: 5px; gap: 5px;}
#footer .footer-box .footer-info .footer-disc .copyright p{ font-weight: 300; margin: 0;}
#footer .footer-box .footer-info .footer-disc .copyright a{text-decoration: underline;}
#footer .footer-box .footer-info .footer-disc .copyright > a{margin-top: 9px;}


#footer .m-copyright{display: none;}
#footer .footer-box .footer-info .footer-disc .m-copyright p a,#footer .footer-box .footer-info .footer-disc .copyright p a{text-decoration: none;}

@media(max-width:1024px){
  #footer .footer-box .logo img{max-width: 155px;}
  #footer .footer-box .footer-info .footer-disc .copyright{display: none; }
  #footer .footer-box .footer-info .footer-disc .m-copyright{display: block; font-weight: 300; margin-top: 10px; }
  #footer .footer-box .footer-info .footer-disc p{font-size: 14px;}
  #footer .footer-box .footer-info .footer-disc .number a{font-size: 27px;}
  #footer .footer-box .footer-info .footer-disc .m-copyright p{font-weight: 300; color: rgba(23,36,57,0.5); font-size: 14px;}
  #footer .footer-box .footer-info .footer-disc .m-copyright a{font-weight: 500; text-decoration: underline; display: inline-block; margin-top: 10px;}
  #footer .footer-box{padding: 30px 10px; max-width: 94%; }
  #footer .footer-box .footer-info .footer-navi{display: none;}
  #footer .footer-box .footer-info .footer-disc .number{margin:30px 0;}
  #footer .footer-box .footer-info{flex-direction: column; text-align: center;}
  #footer .footer-box{flex-direction: column;}
}


/* screnn */
.screen-menu{position: fixed; top: 0;left: 0; width: 100%; height: 100%; background-color:#CECECE ; opacity: 0; visibility: hidden; transition: 0.3s; z-index: 11111;}
.screen-menu.show{opacity: 1;visibility: visible;}
.screen-menu .screen-menu-innder{max-width: 1720px; width: 100%; height: 100%; margin: 0 auto; padding: 170px 20px;box-sizing: border-box; }
.screen-menu .screen-menu-box{display: flex; height: 100%;}
.screen-menu .screen-menu-box .screen-disc{margin-top: auto;margin-bottom: 0; color: #172439;}
.screen-menu .screen-menu-box .screen-disc p{font-size: 14px; opacity: 70%; font-family: 'Pretendard', sans-serif; font-weight: 400;  }
.screen-menu .screen-menu-box .screen-disc h4{font-family: 'Big_Caslon_CC', sans-serif; font-weight: 700; font-size: 30px; margin-bottom: 80px;}
.screen-menu .screen-menu-box .screen-disc h4 small{font-size: 20px;} 

.screen-menu .screen-menu-box > div{flex: 1;}
.screen-menu .screen-menu-box .secrenn-nav {position: relative;}
.screen-menu .screen-menu-box .secrenn-nav-box{color: #172439;}
.screen-menu .screen-menu-box .secrenn-nav-box > ul > li{padding-bottom: 30px;}
.screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a{font-family: 'Big_Caslon_CC', sans-serif;  font-size: 45px;  display: inline-block;width: 100%;padding-bottom: 20px;border-bottom: 0.7px solid #4E5766;}
.screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a small{font-size: 30px;}
.screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul{padding-top: 15px; width: 65%; margin-left: auto; margin-right: 0;}
.screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu  ul li{border-bottom: 0.5px solid #AAACB0; padding-bottom: 15px; margin-bottom: 15px; padding-left: 50px;}
.screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu  ul li a{ font-family: 'Pretendard', sans-serif;font-size: 15px; }
.screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul li a span{font-family: 'Big_Caslon_CC', sans-serif;   font-size: 23px; margin-right: 10px;}

.screen-menu .screen-top{position: fixed; top: 0;left: 50%; transform: translateX(-50%); max-width: 1680px; width: 100%; margin: 0 auto; display: flex; gap: 20px; justify-content:space-between;align-items: center; padding-top: 30px ; box-sizing: border-box;}
.screen-menu .screen-top .screen-sns ul{display: flex; gap: 20px; align-items: center;}
.screen-menu .screen-top .screen-close{cursor: pointer;font-family: 'DarkerGrotesque', sans-serif; font-size: 18px;font-weight: 600;}

.secrenn-thumbnail{ position: absolute; right: calc(100% + 50px);  top:20px; }
.secrenn-thumbnail img{ position: absolute; right: calc(100% + 50px);  top:20px; opacity: 0;visibility: hidden; transition: 0.3s;}
.secrenn-thumbnail img.active{opacity: 1; visibility: visible;}
.m-screen-thumbnail{display: none; width: 30%;}
.m-screen-thumbnail img{width: 100%;}
.two-dep-menu-box {display: flex; padding: 0 0;}
@media(max-width:1024px){
  .screen-menu .screen-top{padding: 30px 20px 0 20px;}
  .screen-menu .screen-menu-innder{padding: 120px 20px;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li{padding-bottom:20px ;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a{font-size: 24px;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul{padding-top: 15px;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul li a span{font-size: 17px;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul li a{font-size: 12px;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul li{padding-bottom: 10px; margin-bottom: 10px; padding-left: 30px;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul li:last-child{border-bottom: none;}
  .m-screen-thumbnail{display: block;}
  .screen-menu .screen-menu-box .secrenn-nav-box > ul > li > a + .two-dep-menu ul{margin: 0; width: 70%; margin-left: 0; margin-right: 0; }
.screen-disc{display: none;}
}

/*main  visual*/
.visual-sec img{width: 100%;} 
.visual-sec{position: relative;}
.visual-sec .visual-content{position: absolute; left: 120px; top: 25%; color: #E5E5E3;}
.visual-sec .visual-content .txt{margin-bottom: 100px;}
.visual-sec .visual-content .txt h2{font-size: 80px; font-family: 'Big_Caslon_CC', sans-serif; margin-bottom: 15px;letter-spacing: 10px; font-weight: 700;}
.visual-sec .visual-content .txt h2 small{font-size: 50px; font-family: 'DarkerGrotesque', sans-serif;  letter-spacing: 25px;font-weight: 400;}
.visual-sec .visual-content .txt p{font-size: 16px; font-family: 'DarkerGrotesque', sans-serif;  font-weight: 500; color:rgba(229,229,227,0.5) ;}
.visual-sec .visual-content .txt .go-reser a{padding: 14px 50px; border: 1px solid #fff; border-radius: 30px;  display: inline-block; margin-top: 30px; font-size: 22px;}
.visual-sec .visual-content .txt .go-reser.active{position: fixed;z-index: 111;left: 109px;top: 3px; z-index: 111;}
    
.visual-sec .visual-content .visual-video{position: relative;}
.visual-sec .visual-content .visual-video .disc{color:#172439 ; position: relative; z-index: 1;  font-family: 'DarkerGrotesque', sans-serif; font-size: 17px; font-weight: 500; text-align: right; margin-top: 8px;}
.visual-sec .visual-content .visual-video img{z-index: 1;position: relative;}
.visual-sec .visual-content .visual-video-bg {position: absolute;left: 50%; top: 50%; width: 100% ;height: 100%;transform: translate(-50%,-50%); border-radius: 10px;opacity: 0.6;background: rgba(229, 229, 227, 0.40); padding: 20px 20px 10px 20px;}
.visual-sec .visual-video-box{width: 100%; max-width: 586px; height: 363px;}
@media(max-width:1024px){
  .visual-video{display: none;}
  .visual-sec{height: 100vh;}
  .visual-sec .visual-thumbnail{height: 100%;}
  .visual-sec .visual-thumbnail img{height: 100%; object-fit: cover; object-position: center;}
  .visual-sec .visual-content{left: 20px;}
  .visual-sec .visual-content  .txt h2{font-size: 30px; letter-spacing: 3px; margin-bottom: 30px;}
  .visual-sec .visual-content  .txt h2 small{font-size: 20px; letter-spacing: 10px; margin-top: 10px; display: inline-block;}
  .visual-sec .visual-content  .txt p{font-size: 14px;}
  
}

/*main  sec02*/
.sec02 {height: 100vh; overflow: hidden;}
.sec02 .box , .sec02 .box .sec02-bg {height: 100%;width: 100%;}
.sec02 .sec02-bg img{height: 100%;width: 100%; object-fit: cover;}
.sec02 .box {position: relative;}
.sec02  .box .content {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; max-width: 955px;}
.sec02  .box .content .video-bg{position: absolute;left: 50%; top: 50%; width: 100% ;height: 100%;transform: translate(-50%,-50%); border-radius: 10px;opacity: 0.6;background: rgba(229, 229, 227, 0.40); padding: 30px 20px 10px 20px;}
.sec02  .box .content .video-box {width: 100%; max-width: 952px; height: 540px;}
.sec02  .box .content .video-box img{width: 100%; max-width: 1132px; ;}
.sec02  .box .content .video-box{z-index: 1; position: relative;}
.sec02  .box .content .disc{color: #fff; position: relative; z-index: 1;  font-family: 'DarkerGrotesque', sans-serif; font-size: 24px; font-weight: 500; text-align: right; margin-top: 8px;}

@media(max-width:1024px){
  .sec02{height: 45vh;}
  .sec02 .box .content{height: 191px; width: 92%; max-width: 955px;}
  .sec02  .box .content .video-bg{ top: 52%;   padding: 20px 20px 40px 20px; opacity: 0;}
  .sec02 .box .content .video-box, .sec02 .box, .sec02 .sec02-bg{height: 100%;}
  .sec02 .sec02-bg img{object-fit: cover;height: 100%; display: none;}
  .sec02 .box .content .video-box img{height: 100%;object-fit: cover;}
  .sec02 .box .content .disc{font-size: 18px; display: none; }

}
/*main  sec03*/

.sec03 .box{position: relative;}
.sec03 .box .content{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2;}
.sec03 .box .content h2{font-size: 50px; color: #fff; text-align: center; font-family: 'Big_Caslon_CC', sans-serif; font-weight: 700; letter-spacing: 5px;}
.sec03 .box .content h2 small{font-size: 30px;  font-family: 'DarkerGrotesque', sans-serif; letter-spacing: 20px; font-weight: 300;}
.sec03 .box .swiper-slide img{width: 100%;}
.sec03 .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after, .sec03 .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{content: "";}
.sec03 .swiper-button-next, .sec03 .swiper-button-prev{color: #fff; outline: none; font-size: 24px; font-weight: 400;font-family: 'DarkerGrotesque', sans-serif;  font-weight: 600;}
.sec03 .swiper-button-next{right: 40px; }
.sec03 .swiper-button-prev{left: 40px;}
.sec03 .swiper-button-prev::after{content: ""; position: absolute; width: 160px; height: 160px; border:1px solid #fff; right: -20px; } 
.sec03 .swiper-button-next::after{content: ""; position: absolute; width: 160px; height: 160px; border:1px solid #fff; left: -20px;  ;}
.sec03 .swiper-button-next::after,.sec03 .swiper-button-prev::after{top: 50%; transform: translateY(-50%); border-radius: 100%; transition: 0.3s ;opacity: 0;}
.sec03 .swiper-button-next small, .sec03 .swiper-button-prev small{display: none;}
.sec03 .swiper-button-next:hover::after,.sec03 .swiper-button-prev:hover::after{opacity: 1;}
.sec03 .m-swiper-line{width: 0.5px; height: 17.5px;position: absolute; left: 50%; bottom:4.7%;  background-color: #fff; opacity: 0.5;   transform: translateX(-50%); z-index: 1;}
@media(max-width:1024px){
  .sec03 .swiper-slide img{height: 300px;}
  .sec03 .box .content h2{font-size: 32px;}
  .sec03 .swiper-button-next small, .sec03 .swiper-button-prev small{display: block;}
  .sec03 .swiper-button-next, .sec03 .swiper-button-prev{bottom: 40px; top: auto; display: flex; gap: 10px; align-items: center;font-size:17px; bottom: 3px;letter-spacing:2px ; }   
  .sec03 .swiper-button-next{right: 30%;}  
  .sec03 .swiper-button-prev{left: 30%; }  
  .sec03 .swiper-button-prev::after{display: none;}
  .sec03 .swiper-button-next::after,.sec03 .swiper-button-next::after{display: none;}
  
}

/*main  sec04*/
.sec04{background-color: #E5E5E3;padding: 70px;}
.sec04 .box{color:#172439;  text-align: center;}
.sec04 .box h4{font-size: 20px;  font-family: 'Big_Caslon_CC'; }
.sec04 .box h4 + p {font-size: 17px;  margin: 40px 0 20px 0; font-weight: 500;}
.sec04 .box p:last-child{font-size: 15px; font-family: 'Big_Caslon_CC';color: rgba(23,36,57,0.8);}

@media(max-width:1024px){
  .sec04 {padding: 50px 20px;}
  .sec04 .box h4 + p{font-size: 14px; margin-top: 20px;}
  .sec04 .box p:last-child{font-size: 12px;}
}
.sec05{overflow: hidden;}
.sec05 .scroll-trigger {height: 100vh !important;max-height: 100vh !important;display: flex;padding:0 !important;justify-content: center;align-items: start;padding: 5rem;background-color: black; height: 100%;}
.sec05 .slide-container {display: inline-block;margin-left: 0;width: calc(90% - 2rem);position: relative;}
.sec05  .slide-container .slide {width: 100vw;margin: 0 auto;position: absolute;left: 50%;transform: translateX(-50%);transition: opacity 0.5s ease-in-out;-webkit-transition: opacity 0.5s ease-in-out;-moz-transition: opacity 0.5s ease-in-out;-ms-transition: opacity 0.5s ease-in-out;-o-transition: opacity 0.5s ease-in-out;}
.sec05  img {width: 100%;transition: opacity 0.3s ease-in;}
.sec05 .slide {position: absolute;opacity: 0;width: 100vw;height: 300px;left: 50%;transform: translateX(-50%);transition: opacity 0.5s ease-in-out;}
.sec05 .slide[data-slide='1'] {opacity: 1; }
.sec05 .slide-container {position: relative;width: 100%;height: 100%; }
.sec05 .slide {position: absolute;top: 0;left: 50%;transform: translateX(-50%);width: 100%;height: 100%;opacity: 0;transition: opacity 0.5s ease-in-out;}
.sec05 .slide[data-slide="1"] {opacity: 1;}

.sec05 .triger-txt{position: absolute; top: 32%; left: 29%; transform: translate(-50%,-50%); color: #fff; transition: 0.8s; text-align: right;}
.sec05 .triger-txt h3{font-family: 'Big_Caslon_CC'; font-size: 65px;} 
.sec05 .triger-txt p{ font-family: 'DarkerGrotesque', sans-serif;font-size: 30px;}
.sec05 .triger-txt.active{top: 73%;left: 19%;}
.sec05 .triger-txt.active .night{display: block;}
.sec05 .triger-txt .night{display: none}
.sec05 .triger-txt.active .moning{display: none;}
.sec05 .triger-txt .moning{display: block;}
.sec05 .triger-dott{position: absolute; top: 36%; left: 42%; transform: translate(-50%,-50%); color: #fff; transition: 0.8s;}
.sec05 .triger-dott.active{top: 77%;left: 31%;}

@media(max-width:1024px){
  .sec05 .triger-txt.active,.sec05 .triger-txt{top: 30%; left: 73%;}
  .sec05 .triger-dott{display: none;}
  .sec05 .triger-txt h3{font-size: 24px;}
  .sec05 .triger-txt p{font-size: 17px;}
  .sec05 img{height: 100%; object-fit: cover;}
}
/*main  sec06*/
.sec06{width: 100%; height: 100vh; background-image: url('../image/sec06-bg1.jpg'); background-position:center; background-repeat: no-repeat; background-size: cover;  transition: background-image 0.4s ease;  transition: 0.3s; z-index: 1; position: relative; cursor: pointer;}
.sec06 .box {position: relative; height: 100%;}
.sec06 .box .room-navi{position: absolute; bottom: 50px;  left: 50%; transform: translateX(-50%); z-index: 1; display: grid;  grid-template-columns: repeat(3,1fr); gap: 80px;}
.sec06 .box .room-navi .room-navi-btn{position: relative;}
.sec06 .box .room-navi .room-navi-btn .bg{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; border-radius: 7px;
background: rgba(217, 217, 217, 0.50); opacity: 0.6; padding: 10px;}
.sec06 .box .room-navi .room-navi-btn .info{display: flex; align-items: center; gap: 20px; position: relative; z-index: 1; color: #fff;}
.sec06 .box .room-navi .room-navi-btn .info * {white-space: nowrap;}
.sec06 .box .room-navi .room-navi-btn .info img{border-radius: 5px;}
.sec06 .box .room-navi .room-navi-btn .info h5{font-size: 27px; font-family: 'Big_Caslon_CC'; }
.sec06 .box .room-navi .room-navi-btn .info span{margin: 15px 0 7px 0; display: inline-block;}
.sec06 .box .room-navi .room-navi-btn .info p{font-family: 'DarkerGrotesque', sans-serif; opacity: 0.5;}
.sec06 .box .room-name{position: absolute; top: 50%;left: 50%; transform: translate(-50%,-50%); display: flex; align-items: center; color: #fff;}
.sec06 .box .room-name h3{font-size: 60px;font-family: 'Big_Caslon_CC';}
.sec06 .box .room-name .room-detail{margin-left: 20px;}
.sec06 .box .room-name .room-detail p{margin-top: 5px; font-family: 'DarkerGrotesque', sans-serif; }

.sec06 .m-box{position: relative; display: none;}
.sec06 .m-box , .sec06 .m-box .m-thumbnails{height: 100%;}
.sec06 .m-box .m-thumbnails img{width: 100%; height: 100%; object-fit: cover;}
.sec06 .m-box .m-room-navi{width: 90%; position: absolute; bottom: 40px; display: flex;justify-content: space-between; left: 50%; transform: translateX(-50%); color: #fff; padding-top: 20px; border-top:1px solid rgba(255,255,255,0.5) }
.sec06 .m-box .m-room-navi li{text-align: center; position: relative;}
.sec06 .m-box .m-room-navi li h5{font-family: 'Big_Caslon_CC';font-size: 18px; margin-bottom: 6px;}
.sec06 .m-box .m-room-navi li span{font-size: 12px;}
.sec06 .m-box .m-room-navi li::after{display: none;}
.sec06 .m-box .m-room-navi li.active::after{display: block; content: ""; position: absolute; top: -8px;left: 0px; width:28px ; height: 28px; background-color: rgba(229,229,227,0.3); border-radius: 100%;}
.sec06 .m-box .room-name{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);color: #fff; width: 100%;font-family: 'Big_Caslon_CC';  font-size: 40px; text-align: center;}
@media(max-width:1024px){
  .sec06{background-color: #E5E5E3;}
  .sec06 .m-box{display: block;}
  .sec06{cursor: unset;}
  .sec06 .box{display: none;}
  .sec06{background-image: none !important;}
}

/*main  sec07*/
.sec07{padding:150px 0; box-sizing: border-box; background-image: url('../image/sec07-bg.jpg'); background-position: center; background-size: cover;background-repeat: no-repeat; background-color: #E5E5E3;}
.sec07 .box{display: flex; height: auto; max-width: 1580px ; margin: 0 auto;}
.sec07 .box > div{flex:1;} 
.sec07 .box > .special-preview-txt{padding-top: 100px; padding-left: 100px; position: sticky;top: 0;width: 100%; height: 100%;  z-index: 1;}
.sec07 .special-list{display: flex; gap: 25px;}
.sec07 .special-list .right{margin-top: 180px;}
.sec07 .special-list ul li{margin-bottom: 25px; position: relative;}
.sec07 .special-list ul li .thumbnail img{width: 100%; border-radius: 10px;}
.sec07 .special-list ul li .iframe-thumbnail{height: 488px;}
.sec07 .special-list ul li .iframe-thumbnail iframe{ border-radius: 10px;}
.sec07 .special-list ul li .go-special{position: absolute; bottom:20px; left:50%; transform: translateX(-50%); color: #fff; font-size: 17px;  padding: 8px 25px;   border: 1px solid transparent;transition: border-color 0.3s; border-radius: 25px;}
.sec07 .special-list ul li:hover .go-special{ border-color: #fff;}
.sec07 .special-list ul li .special-name{position: absolute; top:50px; left:50%; transform: translateX(-50%);  color: #fff; font-size: 20px; font-family: 'Big_Caslon_CC';font-style: normal;font-weight: 700;line-height: normal;letter-spacing: 1px;text-transform: uppercase; width: 100%; text-align: center;}
.sec07 .m-special-list .iframe-thumbnail{ height: 435px; border-radius: 30px; overflow: hidden;}

.sec07 .m-special-list .iframe-thumbnail iframe {width: 120% !important; height: 120% !important;}
.sec07 .special-preview-txt{color: #172439;}
.sec07 .special-preview-txt h3{font-size: 80px;font-style: normal;font-weight: 700;letter-spacing: 4px;text-transform: uppercase;font-family: 'Big_Caslon_CC';}
.sec07 .special-preview-txt h4 {font-family: 'DarkerGrotesque', sans-serif;font-size: 50px;font-style: normal;font-weight: 400;line-height: 70px;letter-spacing: 25px;text-transform: uppercase;}
.sec07 .special-preview-txt h4 small{font-size: 30px;font-family: 'Big_Caslon_CC'; letter-spacing: 0; margin-left: -40px;}
.sec07 .special-preview-txt p{font-size: 18px; font-weight: 500; margin-top: 40px;}
.sec07 .m-special-list{padding-left: 40px; display: none;}
.sec07 .m-special-list .swiper-slide{position: relative;}
.sec07 .m-special-list .swiper-slide img{width: 100%; border-radius: 10px;}
.sec07 .m-special-list .swiper-slide .special-name{position: absolute; left: 50%;transform: translateX(-50%); z-index: 1; color: #fff; }
.sec07 .m-special-list .swiper-slide .name-en{top:50px ;font-family: 'Big_Caslon_CC'; font-size: 20px;}
.sec07 .m-special-list .swiper-slide .name-kr{bottom: 30px; font-size: 17px;}



@media(max-width:1024px){
  
  .sec07 .m-special-list .swiper-slide .special-name{width: 100%; text-align: center;}
  .sec07{padding:50px 0 150px 0 ;}
  .sec07 .m-special-list .swiper-slide{max-height: 435px;}
  .sec07 .m-special-list .swiper-slide .iframe-thumbnail1{border-radius: 10px;  overflow: hidden;}
  
  .sec07 .m-special-list{display: block;}
  .sec07 .box{flex-direction: column;}
  .sec07 .special-list{display: none;}
  .sec07 .box > .special-preview-txt{position: unset; padding-left: 0; padding-bottom: 60px; padding-top: 0;}
  .sec07 .special-preview-txt {text-align: center;}
  .sec07 .special-preview-txt h3{font-size: 42px;}
  .sec07 .special-preview-txt h4{font-size: 24px; letter-spacing: 10px; line-height: 40px;}
  .sec07 .special-preview-txt h4 small{font-size: 14px;font-size: 14px;margin-left: -16px;letter-spacing: 3px;}
  .sec07 .special-preview-txt p{font-size: 14px; margin-top: 30px; line-height: 1.3;}
}



/* common*/
.m-br{display:none;}
  .pc-br{display: block;}
@media(max-width:1024px){
  .m-br{display: block;}
  .pc-br{display: none;}
}


/* sub location*/
.sub-wrap{background-color: #E5E5E3;}
.sub-wrap .sub-top-section{padding-top:200px}
.sub-wrap .sub-top-section .title{display: flex; justify-content: space-between; align-items: center; margin: 0 120px;  padding-bottom: 60px; box-sizing: border-box; color: #172439;}
.sub-wrap .sub-top-section .title h2{ font-family: 'Big_Caslon_CC'; font-size: 80px;}
.sub-wrap .sub-top-section .title p{font-size:20px;font-family: 'DarkerGrotesque', sans-serif; text-align: right;; color: rgba(23,36,57,0.5);}
.sub-wrap .sub-top-visual .thumbnail img{width: 100%;}
.root_daum_roughmap .wrap_controllers, .root_daum_roughmap .cont .section.lst{display: none;}
#location .sub-location-bottom{padding: 250px 0 40px 0;}
#location .sub-location-bottom .info{display: flex; justify-content: space-between; align-items: center; margin:0 120px ; color: #172439;}
#location .sub-location-bottom .info h2{font-size: 40px; font-family: 'Big_Caslon_CC';}
#location .sub-location-bottom .info p:first-child{font-size: 27px; display: flex; align-items: center; margin-bottom: 5px; font-weight: 600; color: rgba(23,36,57,0.8);}
#location .sub-location-bottom .info p img{margin-right: 10px;}
#location .sub-location-bottom .info p{font-size: 22px;  font-weight: 400;}

@media(max-width:1024px){
  .sub-wrap .sub-top-visual .thumbnail img{height: 220px; object-fit: cover;}
  .sub-wrap .sub-top-section{padding-top: 150px;}
  .sub-wrap .sub-top-section .title{flex-direction: column; margin: 0 20px; padding-bottom: 30px;}
  .sub-wrap .sub-top-section .title h2{text-align: left; font-size: 40px; width: 100%; margin-bottom: 20px;}  
  .sub-wrap .sub-top-section .title p{font-size: 14px; text-align: left; width: 100%;} 
  .sub-wrap .wrap_map{height: 300px !important;}
  #location .sub-location-bottom{padding: 100px 0 40px 0;}
  #location .sub-location-bottom .info{flex-direction: column-reverse; align-items: flex-start; margin: 0 20px;}
  #location .sub-location-bottom .info h2{font-size: 27px; font-family: 'Big_Caslon_CC';}
  #location .sub-location-bottom .info p:first-child{font-size: 19px; margin-top: 10px;}
  #location .sub-location-bottom .info p{font-size: 16px;}
}

/* sub reservation*/

#reservation .reservation-info{text-align: center; padding:200px 0;}
#reservation .reservation-info h4{font-size: 40px; font-family: 'Big_Caslon_CC'; color: #172439; margin-bottom:60px ;}
#reservation .reservation-info p{font-size:23px ; color: rgba(23,36,57,0.8); font-weight: 500; margin: 15px 0;}
#reservation .reservation-info p strong{ font-weight: 600;}
#reservation .reservation-title{display: flex; align-items: center; margin-left: 200px; font-family: 'Big_Caslon_CC'; font-size: 40px; color: #172439; font-weight: 700; position: relative; overflow: hidden; }
#reservation .reservation-title::after{content: ""; position: absolute; top: 50%; left: 250px; background-color: #172439; height: 0.5px; width: 100%;}
#reservation .reservation-title small{font-family: 'Pretendard'; font-size: 27px; display: inline-block; padding: 0 10px 0 20px; font-weight: 600;}

#reservation .price-box{width:100%;overflow-x:auto; max-width: 1440px; margin: 0 auto; padding: 50px 0;}
#reservation .price-box table{width:100%;border-collapse:collapse;min-width:720px;}
#reservation .price-box th,#reservation .price-box td{border:1px solid #ddd;padding:12px;text-align:center;vertical-align:top;  background-color: #D5D5D5; font-weight: 500;}
#reservation .price-box th{background-color:#172439; color:#E5E5E3;}
#reservation .price-box td{line-height: 1.5; text-align: center; vertical-align: middle;}

#reservation .inner-con{max-width: 1240px; margin:0 auto; padding: 100px 0;}

@media(max-width:1024px){
  #reservation .reservation-info{padding: 100px 0;}
  #reservation .reservation-info h4{font-size: 28px;}
  #reservation .reservation-info p{font-size: 16px;}
  #reservation .reservation-title{margin-left: 20px; font-size: 28px;}
  #reservation .reservation-title::after{left: 180px;}
  #reservation .reservation-title small{font-size: 16px;}
  #reservation .price-box th, #reservation .price-box  td{font-size: 14px;}
  #reservation .price-box{padding:20px; box-sizing: border-box;}
  #reservation .price-box table{min-width: auto;}
  #reservation .price-box  table,#reservation .price-box thead,#reservation .price-box tbody,#reservation .price-box th,#reservation .price-box td,#reservation .price-box tr{display:block;width:100%;}
  #reservation .price-box thead{display:none;}
  #reservation .price-box tr{margin-bottom:20px;border-bottom:2px solid #eee;}
  #reservation .price-box td{position:relative;border:none;border-bottom:1px solid #ccc; box-sizing: border-box;}
  #reservation .price-box td:first-child{background-color:#172439; color: #e5e5e3;     border-radius: 5px 5px 0 0;}
  #reservation .price-box td:last-child{border-radius: 0 0 5px 5px;}
  #reservation .price-box td:first-child::before{top:20px;}
  #reservation .price-box td::before{content:attr(data-title);position:absolute;left:10px;top:12px;font-weight:bold;white-space:nowrap;}
}

#reservation .reservation-user{padding: 200px 0;}
#reservation .reservation-user .reservation-title::after{left:430px}
#reservation .reservation-user .guide-box{padding:50px 0 ; box-sizing: border-box;}
#reservation .reservation-user ul{display: flex; max-width: 1440px; margin: 0 auto; gap:80px ;}
#reservation .reservation-user ul li {position: relative;}
#reservation .reservation-user ul li .bg, #reservation .reservation-user ul li .disc,#reservation .reservation-user ul li .title{position: absolute; color: #0A182D;}  
#reservation .reservation-user ul li .title{top: 50%;left: 50%; transform: translate(-50%); text-align: center; transition: 0.5s; z-index: 1; width: 100%;}
#reservation .reservation-user ul li .title h5{ font-size: 30px; font-weight: 700; margin-bottom: 10px;font-family: 'Big_Caslon_CC';}
#reservation .reservation-user ul li .title p{font-size: 20px; font-weight: 400; font-weight: 500;}
#reservation .reservation-user ul li:hover .title{top: 15%; }
#reservation .reservation-user ul li .disc{bottom:20% ; left: 50%; transform: translateX(-50%); width: 100%; text-align: center; z-index: 1; opacity: 0; visibility: hidden; transition: 0.5s;}
#reservation .reservation-user ul li .disc .row-line{margin-bottom: 50px;}
#reservation .reservation-user ul li .disc p {line-height: 1.5; font-weight: 500;}
#reservation .reservation-user ul li:hover .disc{opacity: 1; visibility: visible;}
#reservation .reservation-user ul li .thumbnail img{border-radius: 15px; width: 100%;}
#reservation .reservation-user ul li .bg{top: 0;left: 0; width: 100%; height: 100%; background-color: rgba(229,229,227,0.3); transition: 0.5s;} 
#reservation .reservation-user ul li:hover .bg{background-color: rgba(229,229,227,0.8);}
@media(max-width:1024px){
  #reservation .reservation-user{padding: 100px 0;}
#reservation .reservation-user .reservation-title::after{left: 300px;}
#reservation .reservation-user .guide-box{padding: 50px 20px; }
#reservation .reservation-user ul{flex-direction: column; gap: 20px;}
#reservation .reservation-user ul li .title h5{font-size: 24px;}
#reservation .reservation-user ul li .title p{font-size: 16px;}
}
#reservation .reservation-guide{padding-bottom: 200px;}
#reservation .reservation-guide .reservation-title::after{left: 600px;}
#reservation .reservation-guide .guide-info{max-width: 1440px; margin: 0 auto; padding-top: 60px;}
#reservation .reservation-guide .guide-info ul li{margin-bottom: 50px;}
#reservation .reservation-guide .guide-info ul li h5{font-size: 24px; font-weight: 600;  color:#172439; margin-bottom: 15px;} 
#reservation .reservation-guide .guide-info ul li p{font-size: 20px; font-weight: 400; color:rgba(23,36,57,0.5); margin: 10px 0; text-indent: 10px;}

@media(max-width:1024px){
  #reservation .reservation-guide{padding-bottom: 0;}
  #reservation .reservation-guide .reservation-title::after{left: 430px;}
#reservation .reservation-guide .guide-info{padding: 60px 20px 0 20px ;}
#reservation .reservation-guide .guide-info ul li h5{font-size:20px ;}  
#reservation .reservation-guide .guide-info ul li p{font-size:14px ;}  
#reservation .reservation-guide .guide-info ul li{margin-bottom: 30px;}
#reservation .reservation-guide .guide-info ul li p{text-indent: -10px; margin-left: 10px;}
}

#reservation .reservation-refund{padding-bottom: 100px;}
#reservation .reservation-refund .reservation-title::after{left: 500px;}
.reservation-refund .reservation-refund-box{max-width: 1440px; margin: 0 auto; padding-top: 50px;}
.reservation-refund table {width: 100%;margin: 0px auto;border-collapse: collapse;border: 1px solid #23435a;margin:50px; }
.reservation-refund  tr:first-child {border-bottom: 1px solid #dbd9d8;}
.reservation-refund  tr p {padding: 2px 30px;}
.reservation-refund  tr p {font-weight: 400;}
.reservation-refund  tr:last-child td:last-child {color: #23435a;font-weight: 400;}
.reservation-refund  tr td:last-child p {border-right: 0;}
.reservation-refund  th {color: #FFFFFF;background-color: #172439;padding: 20px 0px;font-size: 16px;}
.reservation-refund  td {text-align: center;padding: 20px 0;font-size: 15px;font-weight: 400;color: #746F69;vertical-align: middle;}
.reservation-refund  td strong{color:#BC3232; font-weight: 600;}
.reservation-refund .refund-info{}
.reservation-refund .refund-info p{color: rgba(23,36,57,0.5); margin-bottom: 10px; font-size: 20px; font-weight: 400;} 

@media(max-width:1024px){
  .reservation-refund  tr:first-child {border-bottom: none;}
  #reservation .reservation-guide .reservation-title ,#reservation .reservation-refund .reservation-title{        flex-direction: column;align-items: flex-start;}
  #reservation .reservation-guide .reservation-title small, #reservation .reservation-refund .reservation-title small{padding: 0; margin-top: 10px;}
  #reservation .reservation-refund .reservation-title{margin-left: 0;}
  .reservation-refund{padding: 20px; box-sizing: border-box; }
  .reservation-refund .refund-info p{font-size: 14px; text-indent: -10px; margin-left: 10px;}
  .reservation-refund table{margin: 40px 0;}
  .reservation-refund table tbody{display: flex;}
  .reservation-refund table tbody tr{width: 50%;display: flex;flex-direction: column;}
  .reservation-refund table tbody th,.reservation-refund table tbody td{font-size: 14px;}
  .reservation-refund table tbody th,.reservation-refund table tbody td{padding: 10px 0; display: flex; justify-content: center;}
  .reservation-refund table tbody td p,.reservation-refund tr p{padding: 5px 0 ; text-align: center;}
}

/*tour*/
#tour .tour-list{max-width: 1680px; margin: 0 auto;}
#tour .tour-list .tour-item {overflow: hidden;}
#tour .tour-place{overflow-x: hidden;}
#tour .tour-place .tour-number{ position: relative; margin-bottom: 60px; max-width: 1680px; margin: 0 auto 60px auto;}
#tour .tour-place .tour-number h2{ font-size: 150px;  font-weight: 300; color: rgba(23,36,57,0.5);font-family: 'DarkerGrotesque', sans-serif;}
#tour .tour-place h2::after{content: "";position: absolute; top: 60%;right:-6%; transform: translateY(-50%); background-color: rgba(23,36,57,0.5); width: 97%; height: 0.5px;}
#tour .tour-list {max-width: 1680px; margin: 0 auto;}
#tour .tour-list .tour-item{margin-bottom: 100px;}
#tour .tour-list .tour-item .tour-disc .swiper{width: 100%;}
#tour .tour-list .tour-item .tour-content{display: flex;}
#tour .tour-list .tour-item .tour-content .tour-disc{display: flex; width: 75%; gap: 60px;}
#tour .tour-list .tour-item .tour-content .tour-disc p{font-size: 18px; color: rgba(23,36,57,0.5);font-weight: 500; line-height: 1.5; max-width: 512px;}
#tour .tour-list .tour-item .tour-content .tour-disc img{border-radius: 15px;}
#tour .tour-list .tour-item .tour-content .tour-name{width: 25%; color: #172439;}
#tour .tour-list .tour-item .tour-content .tour-name h3{font-size: 43px; font-weight: 700; margin-bottom: 15px;}
#tour .tour-list .tour-item .tour-content .tour-name p{font-size: 20px; font-weight: 500;}
#tour .tour-list .tour-item .tour-content .tour-name p img{margin-right: 10px;}
#tour .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,#tour .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{background-color: #fff;}

#tour .tour-list {position: relative;height: 100vh;overflow: hidden;}
#tour .tour-item {position: absolute;top: 10%;left: 0;width: 100%;opacity: 0;transition: opacity 0.5s ease;}
#tour .tour-item.active {opacity: 1;transform: translateY(0);}
#tour #tour .tour-place{overflow: unset; height: 100%;}



@media(max-width:1024px){
  #tour .tour-item{top: 10%;}
  #tour .tour-list {padding: 0 20px; box-sizing: border-box;}
  #tour .tour-list .tour-item{margin-bottom: 50px; padding:  0 20px; box-sizing: border-box;}
  #tour .tour-list .tour-item .tour-content{flex-direction: column;}
  #tour .tour-list .tour-item .tour-content .tour-name{width: 100%; margin-bottom: 20px;}
  #tour .tour-list .tour-item .tour-content .tour-disc{flex-direction: column; width: 100%; gap: 20px;}
  #tour .tour-list .tour-item .tour-content .tour-disc img{width: 100%;}
  #tour .tour-list .tour-item .tour-content .tour-disc p{font-size:13px ;}
  #tour .tour-list .tour-item .tour-content .tour-name h3 {font-size: 20px;margin-bottom: 5px;}
  #tour .tour-list .tour-item .tour-content .tour-name p {font-size: 16px; }
  #tour .tour-list .tour-item .tour-number{margin-bottom: 10px;}
  #tour .tour-list .tour-item .tour-number h2{font-size: 40px;} 
  #tour .tour-list .tour-item h2::after{right: -19%;}
}


/*view */
.top-visual{position: relative;}
.top-visual .thumbnail img{width: 100%;}
.top-visual .visual-title{position: absolute; top: 19%; left: 50%; transform: translateX(-50%); text-align: center; z-index: 1;}
.top-visual .visual-title h1{font-size: 80px; color: #172439; font-family: 'Big_Caslon_CC'; margin-bottom: 40px; letter-spacing: 4px;}
.top-visual .visual-title p{font-size: 20px; color: rgba(23,36,57,0.8); font-weight: 700;}
.top-visual .bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2); }
.top-visual .room-ty{    position: absolute;bottom: 200px;left: 50%;transform: translateX(-50%);color: #fff;font-weight: 500;font-size: 22px;border: 1px solid #fff;padding: 10px 50px;border-radius: 35px;}
.top-visual .room-ty b{font-family: 'Big_Caslon_CC';}
@media(max-width:1024px){
  .top-visual .room-ty{font-size: 17px; bottom: 60px;}
  .top-visual{height: 100vh;}
  .top-visual .thumbnail{height: 100%;}
  .top-visual .thumbnail img{height: 100%; object-fit: cover;}
  .top-visual .visual-title{width: 100%;}
  .top-visual .visual-title h1{font-size: 40px;}
  .top-visual .visual-title p{line-height: 1.5; }

}

#view .view-info{max-width: 1580px; margin: 0 auto; padding: 100px 0; overflow: hidden;}
#view .view-info .view-info-box{display: flex;  gap: 80px; margin-bottom: 300px ;}
#view .view-info .view-info-box2{flex-direction: row-reverse;}
#view .view-info .view-info-box .info-txt{width: 65%; display: flex;flex-direction: column;justify-content: flex-end;color: #172439; padding-left: 80px; padding-bottom: 40px; position: relative;}
#view .view-info .view-info-box2 .info-txt{padding-left: 0;}
#view .view-info .view-info-box .info-txt h3{font-size: 68px; font-family: 'Big_Caslon_CC'; margin-bottom: 120px;}
#view .view-info .view-info-box2 .info-txt h3, #view .view-info .view-info-box1 .info-txt h3{margin-bottom: 40px;}

#view .view-info .view-info-box .info-txt p{ font-size: 18px; color: rgba(23,36,57,0.8); line-height: 1.5;}
#view .view-info .view-info-box1 .info-txt::after{content: ""; position: absolute; top: 0;left: 0; background-color: rgba(23,36,57,0.3); width: 0%; height: 2px; transition: 1s;}
#view .view-info .view-info-box1 .info-txt::before{content: ""; position: absolute; top: -4px;left: 0; background-color: rgba(23,36,57,1); width: 10px; height: 10px; border-radius: 10px;}
#view .view-info .view-info-box2 .info-txt::after{content: ""; position: absolute; top: 0;right: 0; background-color: rgba(23,36,57,0.3); width: 0%; height: 2px; transition: 1s;}
#view .view-info .view-info-box2 .info-txt::before{content: ""; position: absolute; top: -4px;right: 0; background-color: rgba(23,36,57,1); width: 10px; height: 10px; border-radius: 10px;}
#view .view-info .view-info-box.active .info-txt::after{width: 100%;}
#view .view-info .view-info-box .info-vid{width: 35%;}
#view .view-info .view-info-box .info-vid2{height: 562px;}
#view .view-info .view-info-box .info-vid .video{height: 100%;}
#view .view-info .view-info-box .info-vid1{height: 533px;}

@media(max-width:1024px){
  #view .heritage-introduct{padding: 20px;}
  #view .view-info .view-info-box .info-vid1{height: 348px;}
  #view .view-info .view-info-box .info-vid2{height: 343px;}
  #view .view-info .view-info-box .info-txt,  #view .view-info .view-info-box .info-vid{width: 100%;}
  #view .view-info{padding: 100px 20px 30px 20px; box-sizing: border-box;}
  #view .info-vid img{width: 100%;}
  #view .view-info .view-info-box{flex-direction: column; margin-bottom: 60px;}
  #view .view-info .view-info-box .info-txt{padding-left: 0; padding-top: 40px;}
  #view .view-info .view-info-box .info-txt h3{margin-bottom: 20px; font-size: 40px;}
  #view .view-info .view-info-box .info-txt p{font-size: 16px;}
}

#view .view-clock-box{text-align: center; display: flex; justify-content: center;}
#view .clock {position: relative;width: 700px;height: 700px;border: 3px solid transparent;border-radius: 50%;background-color: transparent;background-image: linear-gradient(#E5E5E3, #E5E5E3),linear-gradient(to bottom, #fff 0%, #172439 100%);background-origin: border-box;background-clip: content-box, border-box;box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);}
#view .center-dot {position: absolute;top: 50%;left: 50%;width: 32px;height: 32px;background: #172439;border-radius: 50%;transform: translate(-50%, -50%);z-index: 10;}
#view .hand {position: absolute;top: 50%;left: 50%;transform-origin: left center;transform: rotate(0deg);transition: transform 0.5s ease-in-out;border-radius: 13px;}
#view .hour-hand {width: 30%;height: 13px;background: #172439;z-index: 5;}
#view .minute-hand {width: 40%;height: 6px;background: #172439;z-index: 4;}
#view .view-clock {padding: 200px 0;}
#view .view-clock .view-clock-box{position: relative; max-width: 1240px; margin:  0 auto;}
#view .view-clock .view-clock-box .txt-bg{position: absolute; top: 50%; left: 50%; transform:translate(-50%,-50%);}
#view .view-clock .view-clock-box .clock-view-img{position: absolute;}
#view .view-clock .view-clock-box .clock-view-img img{transition: 0.5s; border-radius: 15px;}
#view .view-clock .view-clock-box .clock-view-img1{top: -18%;right: 4%;}
#view .view-clock .view-clock-box .clock-view-img2{top: 54%; left: 5%;}  
#view .view-clock .view-clock-box .clock-view-img1 img{width: 85%;}
#view .view-clock .view-clock-box .clock-view-img2 img{width: 70%;}
#view .view-clock .view-clock-box.active .clock-view-img1 img{width: 70%;}
#view .view-clock .view-clock-box.active .clock-view-img2 img{width: 85%;}
#view .view-clock .view-clock-box .clock-view-txt{position: absolute; left: 0; top: 0;}
#view .view-clock .view-clock-box .clock-view-txt h3{font-size: 65px; font-family: 'Big_Caslon_CC';}
#view .view-clock .view-clock-box .clock-view-txt p{font-size:30px ;}
#view .view-clock .view-clock-box .clock-view-txt1 {top: 0; left:-5%; color: #fff; text-align: right;}
#view .view-clock .view-clock-box .clock-view-txt2 {top: 80%;left: 80%; color: #172439; text-align: left;}

@media(max-width:1024px){
  #view .view-clock .view-clock-box .clock-view-img{top: -50%;right: auto; left: 50%; transform: translateX(-50%);}
#view .clock{width: 487px; height: 487px;}
#view .view-clock .view-clock-box.active .clock-view-img img{width: 100%;}
#view .view-clock .view-clock-box.active .clock-view-img1 img{opacity: 0; width: 100%;}
#view .view-clock .view-clock-box.active .clock-view-img2 img{opacity: 1; width: 100%;}
#view .view-clock .view-clock-box .clock-view-img1 img{opacity: 1;width: 100%;}
#view .view-clock .view-clock-box .clock-view-img2 img{opacity: 0;width: 100%;}
#view .view-clock .view-clock-box .clock-view-txt{text-align: center;}
#view .view-clock .view-clock-box .clock-view-txt h3{font-size:40px ;}
#view .view-clock .view-clock-box .clock-view-txt p{font-size: 18px;}
#view .view-clock .view-clock-box .clock-view-txt1,#view .view-clock .view-clock-box .clock-view-txt2{top: -33%; left: 38%;}
#view .view-clock .view-clock-box.active .clock-view-txt1{opacity: 0;}
#view .view-clock .view-clock-box .clock-view-txt1{opacity: 1;}
#view .view-clock .view-clock-box.active .clock-view-txt2{opacity: 1;}
#view .view-clock .view-clock-box .clock-view-txt2{opacity: 0;}
#view .view-clock .view-clock-box .clock-view-txt2{color: #fff;}
#view .view-clock .view-clock-box .clock-view-txt1{color: #172439;}
#view .hour-hand{height: 8px;}
#view .view-clock .view-clock-box .txt-bg{width: 90%;}
#view .view-clock .view-clock-box .txt-bg img{width: 100%;}
}
@media(max-width:768px){
  #view .view-clock{padding: 200px 0 100px 0;}
  #view .view-clock .view-clock-box .clock-view-img{width: 80%;}
 #view .clock{width: 340px; height: 340px;} 
 #view .view-clock .view-clock-box .clock-view-txt h3{font-size: 32px;}
 #view .view-clock .view-clock-box .clock-view-txt1, #view .view-clock .view-clock-box .clock-view-txt2{top:-26%;left: 50%; transform: translateX(-50%); display: none;}
#view .hour-hand{height: 6px;}
#view .minute-hand{height: 4px;}
}

#view .view-booking{position: relative;}
#view .view-booking .thumbnail img{width: 100%;}

#view .view-booking .txt{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #fff; text-align: center; z-index: 1;}
#view .view-booking .txt span{font-size: 30px;  font-family: 'DarkerGrotesque', sans-serif; font-weight: 300;}
#view .view-booking .txt h2{font-size: 67px; font-family: 'Big_Caslon_CC'; margin: 20px 0 70px 0;}
#view .view-booking .txt a{font-size: 17px; padding:15px 50px; border: 1px solid #fff; border-radius: 30px; transition: 0.3s; font-weight: 400;}
#view .view-booking .txt a:hover{background-color: #fff;color: #172439;}
#view .view-booking .bg{     position: absolute; top: 0;left: 0;   width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);}
@media(max-width:1024px){
  #view .view-booking{height: 400px;}
  #view .view-booking .thumbnail{ height: 100%;}
  #view .view-booking .thumbnail img{height: 100%; object-fit: cover;}
  #view .view-booking .txt span{font-size: 20px;}
  #view .view-booking .txt h2{font-size: 32px; margin: 15px 0 50px 0;}
  #view .view-booking .txt a{font-size: 14px; padding: 10px 30px;}
}
  

#special .special-animate{padding: 150px 0 150px 0; overflow: hidden;}
.special-animate .page-forword {margin-bottom: 150px; text-align: center; font-weight: 700; font-size: 20; color: #172439; ;}
.special-animate .page-forword span{position: relative; display: inline-block;  padding: 0 5px 7px  5px;}
.special-animate .page-forword span::after{content:""; position: absolute; bottom: 0; left: 0; width: 100%; height: 0.5px; background-color: #172439;}
#special .special-animate .special-animate-box{max-width: 1640px;  display: flex; justify-content: space-between; align-items: flex-end; margin: 0 auto; gap: 20px;}
#special .special-animate .special-animate-box .thumbnail{z-index: 1; width: 100%; height: 630px;}
#special .special-animate .special-animate-box .thumbnail img{width: 100%;}
#special .special-animate .special-animate-box .txt{ max-width: 350px;}
#special .special-animate .special-animate-box .txt h2{font-size: 100px;font-family: 'Big_Caslon_CC'; color: #172439; }
#special .special-animate .special-animate-box .txt h2:first-child{font-style: normal;text-transform: uppercase;-webkit-text-stroke: 1px #172439;color: transparent;}
#special .special-animate .special-animate-box .txt b{display: none;}
@media(max-width:1024px){
  .special-animate .page-forword{margin-bottom: 100px; margin-bottom: 50px;}
  #special .special-animate .special-animate-box .thumbnail{width: 80%;text-align: center; margin: 0 auto;  height: 200px;}
  #special .special-animate{padding: 50px 0;}
  #special .special-animate .special-animate-box{flex-direction: column; align-items: center; }
  #special .special-animate .special-animate-box .txt h2{font-size: 32px;font-family: 'Big_Caslon_CC'; color: #172439; }
  #special .special-animate .special-animate-box .txt2{display: none;}
  #special .special-animate .special-animate-box .txt{margin-bottom: 30px;}
  #special .special-animate .special-animate-box .txt h2:first-child{text-align: center; margin-bottom: 5px;    -webkit-text-stroke: 0.5px #172439;}
  #special .special-animate .special-animate-box .txt h2:nth-child(3){font-style: normal;text-transform: uppercase;-webkit-text-stroke: 0.5px #172439;color: transparent;}
  #special .special-animate .special-animate-box .txt b{display: inline-block;}
}



/*room */
#room .room-detail{padding: 200px 0 100px 0;}
#room .room-detail .room-detail-box .detail-thumbnail img{width: 100%;}
#room .room-detail .room-detail-box{max-width:1440px; margin:0 auto; display: flex; gap: 150px;} 
#room .room-detail .room-detail-box .detail-info{display: flex; flex-direction: column;}
#room .room-detail .room-detail-box .detail-info .room-name{display: flex;align-items: center; color: #172439;}
#room .room-detail .room-detail-box .detail-info .room-name .diagonal-line{margin: 0 20px;}
#room .room-detail .room-detail-box .detail-info .room-name h3{font-size:50px ; font-family: 'Big_Caslon_CC';}
#room .room-detail .room-detail-box .detail-info .room-name h4{font-size: 24px; font-weight: 700;}
#room .room-detail .room-detail-box .detail-info .room-name h5{font-size: 20px; color: rgba(23,36,57,0.5); margin-top: 5px;}
#room .room-detail .room-detail-box .detail-info .room-disc{display: flex; gap: 40px; margin-bottom: 40px;}
#room .room-detail .room-detail-box .detail-info .room-disc .disc h5{font-size: 18px; color: #172439; font-weight: 600;}
#room .room-detail .room-detail-box .detail-info .room-disc .disc p{font-size: 20px; color: rgba(23,36,57,0.5);padding: 10px;}
#room .room-detail .room-detail-box .detail-info .room-type span{font-size: 17px; font-weight: 500; padding: 15px; border: 1px solid #172439; border-radius: 30px; display: inline-block; margin:80px 0 ;}
#room .room-detail .room-detail-box .detail-info .room-fixtures > h5{font-size: 18px; color: #172439; font-weight: 600;margin-bottom: 20px;}
#room .room-detail .room-detail-box .detail-info .room-fixtures ol{display: grid; grid-template-columns: repeat(7,1fr); gap:40px 20px;}
#room .room-detail .room-detail-box .detail-info .room-fixtures ol li {text-align: center;}
#room .room-detail .room-detail-box .detail-info .room-fixtures ol li span{display: inline-block; margin-top: 10px; font-size: 14px;}
#room .room-detail .room-detail-box .detail-info .room-fixtures ol li img{object-fit: cover;}

#room .view-booking .pc-booking-video{display: block;}
#room .view-booking .m-booking-video{display: none;}
@media(max-width:1024px){
  #room .view-booking .pc-booking-video{display: none;}
  #room .view-booking .m-booking-video{display: block;}
  #room .room-detail{padding: 100px 0 50px 0;}
  #room .room-detail .room-detail-box {flex-direction: column; gap: 50px;} 
  #room .room-detail .room-detail-box .detail-info{padding: 0 20px;}
  #room .room-detail .room-detail-box .detail-info .room-name{flex-direction: column; align-items: flex-start;}
  #room .room-detail .room-detail-box .detail-info .room-name h3{font-size: 32px;}
  #room .room-detail .room-detail-box .detail-info .room-name h4{font-size: 18px;}
  #room .room-detail .room-detail-box .detail-info .room-name h5{font-size: 16px;}
  #room .room-detail .room-detail-box .detail-info .room-name .room-category{margin-top: 10px;}
  #room .room-detail .room-detail-box .detail-info .room-name .diagonal-line{display: none;}
  #room .room-detail .room-detail-box .detail-info .room-disc{flex-direction: column; gap: 20px; margin-bottom: 20px;}
  #room .room-detail .room-detail-box .detail-info .room-fixtures ol{    grid-template-columns: repeat(5, 1fr); gap: 30px 10px;}
  #room .room-detail .room-detail-box .detail-info .room-type span{margin: 40px 0; font-size: 18px; padding: 10px;}
  #room .room-detail .room-detail-box .detail-info .room-fixtures > h5, .room-detail .room-detail-box .detail-info .room-disc .disc h5{font-size: 16px;}
  #room .room-detail .room-detail-box .detail-info .room-disc .disc p{font-size: 18px;}

}
@media(max-width:400x){
  #room .room-detail .room-detail-box .detail-info .room-fixtures ol{ grid-template-columns: repeat(4, 1fr); }
}




#room .price-box{width:100%;overflow-x:auto; max-width: 1440px; margin: 0 auto; padding: 50px 0; margin-bottom: 200px}
#room .price-box > h5{margin: 20px 0; color: #172439; font-size: 20px; font-weight: 500;}
#room .price-box table{width:100%;border-collapse:collapse;min-width:720px;}
#room .price-box th,#room .price-box td{border:1px solid #ddd;padding:12px;text-align:center;vertical-align:top;  background-color: #D5D5D5; font-weight: 500;}
#room .price-box th{background-color:#172439; color:#E5E5E3;}
#room .price-box td{line-height: 1.5; text-align: center; vertical-align: middle;}
#room .price-box td::before{color: #e5e5e3;}
@media(max-width:1024px){
  #room .price-box td{padding-left: 50px;}
  #room .price-box{margin-bottom: 50px;}
  #room .price-box th, #room .price-box  td{font-size: 14px;}
  #room .price-box {padding:20px; box-sizing: border-box;}
  #room .price-box table{min-width: auto;}
  #room .price-box table,#room .price-box thead,#room .price-box tbody,#room .price-box th,#room .price-box td,#room .price-box tr{display:block;width:100%; box-sizing: border-box;}
  #room .price-box thead{display:none;}
  #room .price-box tr{margin-bottom:20px;padding-bottom:10px;}
  #room .price-box td{position:relative;border:none;border-bottom:1px solid #ccc; box-sizing: border-box;}
  #room .price-box td:first-child{background-color:#172439; color: #e5e5e3; border-radius: 5px 5px 0 0;}
  #room .price-box td:last-child{border-radius:  0 0 5px 5px;}
  #room .price-box td::before{content:attr(data-title);position:absolute;left:20px;top:12px;font-weight:bold;color:#333;white-space:nowrap;}
  #room .price-box td:first-child::before{color: #e5e5e3; top: 20px;}
}




#room .view-booking{position: relative; ;}
#room .view-booking .thumbnail{height: 800px;}
#room .view-booking .thumbnail img{width: 100%;}

#room .view-booking .txt{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: #fff; text-align: center;}
#room .view-booking .txt span{font-size: 37px; font-family: 'Big_Caslon_CC';  font-weight: 300;}
#room .view-booking .txt h2{font-size: 23px;  margin: 20px 0 70px 0;}
#room .view-booking .txt a{font-size: 17px; padding:15px 50px; border: 1px solid #fff; border-radius: 30px; transition: 0.3s; font-weight: 400;}
#room .view-booking .txt a:hover{background-color: #fff;color: #172439;}
@media(max-width:1024px){
  #room .view-booking{height: 200px; }
  #room .view-booking .thumbnail{ height: 100%;}
  #room .view-booking .thumbnail img{height: 100%; object-fit: cover;}
  #room .view-booking .txt span{font-size: 14px; white-space: nowrap;}
  #room .view-booking .txt h2{font-size: 15px; margin: 10px 0 30px 0;  white-space: nowrap;}
  #room .view-booking .txt a{font-size: 14px; padding: 5px 30px;}


  
}



#room .room-layout{padding:200px 0 100px 0;}
#room .room-layout .room-layout-box{max-width: 1440px; margin: 0 auto;}
#room .room-layout .room-layout-box img{width: 100%;}
#room .room-layout .m-room-layout-box{display: none;}
#room .room-layout .pc-room-layout-box{display: block;}
#room .room-layout h2{font-size: 50px; font-family: 'Big_Caslon_CC'; text-align: center; margin-bottom: 50px;}
@media(max-width: 1024px){
  #room .room-layout{padding: 100px 0;}
  #room .room-layout h2{font-size: 32px;}
  #room .room-layout .room-layout-box{padding: 0 20px;}
  #room .room-layout .m-room-layout-box{display: block; }
  #room .room-layout .pc-room-layout-box{display: none;}
}