/* header */
.header .logo-wrap img.logo-normal{opacity: 0;}
.header .logo-wrap img.logo-scroll{opacity: 1;}
.header {position: fixed; height: 80px; transition: tranform 0.3s;  top: 0;}
.header:after{height: 100%; background-color: rgba(255,255,255,.6); backdrop-filter: blur(10px); transform: scaleY(1); z-index: -1;}
.header .menu-icon_wrap{ color: #222;}
.header .menu-icon_wrap .line{ background-color: #222;}
.header .header-icon{ color: #81A69B;}
body.nav-active .header .header-wrapper{ border-bottom: 1px solid rgba(255,255,255,.3);}
body.nav-active .header:after{height: 100%; background-color: transparent; transform: scaleY(1); z-index: -1;}
body.nav-active .header .logo-wrap img.logo-normal{opacity: 0;}
body.nav-active .header .logo-wrap img.logo-scroll{opacity: 1;}
body.nav-active .header .header-icon > a.reser-btn{ display: inline-block; border: 1px solid #fff; background-color: transparent; color: #fff; }
body.nav-active .header .header-icon > a i{ color: #fff;}
body.nav-active .header .menu-icon__line{ background-color: #fff; }
body.nav-active .header{ background: transparent;}
body.nav-active .header .header-icon i, body.nav-active .header .header-icon div{color:#fff;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
  .header{ height: 50px; top: 0;}
  .header:after{height: 100%; background-color: #EEF7F5; backdrop-filter: unset; transform: scaleY(1); z-index: -1;}
  body.nav-active .header .header-icon > a.reser-btn {border: 1px solid rgba(255,255,255,.5); position: relative; color: #fff; }

}

/* section01 */
#section01{ width: 100%; height: 100vh;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
  #section01{ width: 100%; height: 64.10vw; margin-top: 50px;}
}


#section02{ background-color: #EEF7F5; text-align: left; }
#section02 .wrap1600{ padding-bottom: 160px; border-bottom: 1px solid rgba(153,153,153,.5);}
#section02 .tit{ width: 520px; height: 85px; background-color: #fff; position: absolute; top: -40px; z-index: 100; text-align: center; left: 0; right: 0; margin: 0 auto; padding-top: 20px;}
#section02 .tit h3{ padding-bottom: 10px;}
#section02 .content{ line-height: 26px; width: 1060px; background-color: #fff; left: 0; right: 0; margin: 0 auto; padding: 85px 0 80px;}
#section02 .content span{ line-height: 26px; font-size: 16px!important; font-family: 'Pretendard'!important;}
/* =================== 1100px =================== */
@media (max-width: 1100px) {
  #section02 .content{ width: 96.36vw; }

}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
  #section02{ overflow: visible;}
  #section02 .wrap1600{ padding-bottom: 80px; position: relative; width: calc(100% - 40px); }
  #section02 .tit{ width: calc(100% - 40px); height: 60px;  top: -10px; padding-top: 10px;}
  #section02 .content{ line-height: 24px; width: calc(100% + 80px); padding: 68px 20px 40px; position: relative; left: -40px;}
  #section02 .content span{ line-height: 24px; font-size: 14px!important; font-family: 'Pretendard'!important;}
}


#section03{ position: relative; text-align: center; background-color: #EEF7F5; padding: 200px 0 160px;}
#section03 > img{ position: absolute; left: 0; right: 0; margin: 0 auto; top: 160px;}
#section03 #tit{ padding-bottom: 40px;}
#section03 .travel-wrap{ overflow: hidden; width: 100%;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #section03{ padding: 80px 0;}
    #section03 #tit{ padding-bottom: 20px;}
    #section03 .travel-wrap{ overflow: hidden; width: 100%;}
}