@charset "utf-8";

/*전체 메뉴 시 컨텐츠 쪽 스크롤 방지*/
html.noneScroll, body.noneScroll  {overflow: hidden;}

/* [ HEADER ] */
header{background:#ffffff; position: sticky; width: 100%; top: 0; /* left: 50%; transform: translateX(-50%);  */padding:10px 0; box-sizing: border-box; z-index: 999; box-shadow: 10px 5px 20px 0px rgb(0 0 0 / 5%)}
header .h_inner{display: flex; align-items: center;}

    /* ham_btn */
header .ham_btn, header .ham_btn span {display: inline-block; z-index: 200; transition: all .3s ease-in-out; box-sizing: border-box;}
header .ham_btn {display:none; position: absolute; top: 10px;right: 0;cursor: pointer;z-index: 200;-webkit-transform: translateZ(0);}
header .ham_btn p {position: relative; width: 26px; height: 20px; margin: 10px; box-sizing: border-box;}
header .ham_btn span {position: absolute; left: 0; width: 100%; height: 2px; background-color: #333;}
header.active .ham_btn span {background-color: #000;}
header .ham_btn span:nth-of-type(1) {top: 0;}
header .ham_btn span:nth-of-type(2) {top: 9px;}
header .ham_btn span:nth-of-type(3) {bottom: 0;}
header .ham_btn.active {position: fixed; top:10px;}
header .ham_btn.active span:nth-of-type(1) {-webkit-transform : translateY(10px) rotate(-45deg); transform : translateY(10px) rotate(-45deg);}
header .ham_btn.active span:nth-of-type(2) {opacity: 0;}
header .ham_btn.active span:nth-of-type(3) {-webkit-transform : translateY(-8px) rotate(45deg); transform : translateY(-8px) rotate(45deg);}

    /* logo */
header .logo{width: 140px; text-align: left;}
header .logo img{width: 100%;}

    /* gnb */
header .gnb{width: calc(100% - 180px); text-align: right;}
header .gnb li{display: inline-block; font-size: 18px; font-weight: 500; margin-right: 30px; word-break: keep-all; line-height: 1.5;}
header .gnb li:last-child{margin-right: 0;}
header .gnb li a{-webkit-transition: all .4s 0s; -o-transition: all .4s 0s; transition: all .4s 0s;}
header .gnb li:hover a{color: #EC0000;}
header .gnb li .menu-06{border: 1px solid #333;border-radius: 50px;padding: 0px 10px;}
header .gnb li .menu-06:hover{background:#333; color:#fff;}

    /* mobile_gnb */
.mobile_menu {background: rgba(0,0,0,.3); display: none; box-sizing:border-box; position: fixed; left: 0; width: 100%; height: 100vh; top: 0;}
.mobile_menu .right_wrap {display: none;}

.mobile_menu .m_gnb {position: absolute;top: 0; right: -70%; box-sizing: border-box; background: #fff url(/resources/img/main/sec_bg.png) no-repeat 50% 50% / cover; overflow-y: hidden; width: 70%; height: 100vh; padding:70px 30px 0;}
.mobile_menu .m_gnb > ul::after {display: block; content: ""; clear: both; height: 0;}
.mobile_menu .m_gnb > ul > li { width:100%; display: block; vertical-align: top; box-sizing: border-box; text-align: left; float: left; margin-bottom: 45px;}
.mobile_menu .m_gnb > ul > li:last-child {margin-bottom: 0;}
.mobile_menu .m_gnb > ul > li > a {position:relative; line-height:160%; color:#333; padding-left: 30px; display:inline-block; font-weight: 500; font-size: 22px; letter-spacing: -.5px; transition: .3s ease; word-break: keep-all; position: relative;}
.mobile_menu .m_gnb > ul > li:hover > a{color: #EC0000;}
.mobile_menu .m_gnb > ul > li > a::before {position: absolute; content: ""; top:50%; left: 0; transform: translateY(-50%); background:url(/resources/img/main/tit_ico.png) no-repeat top center/cover; width:21px; height:20px;}
.mobile_menu .m_gnb > ul > li > a.daytour{padding-left:0px;}
.mobile_menu .m_gnb > ul > li > a.daytour::before{display:none;}





/* responsive */
@media screen and (max-width:1024px){
    header .h_inner{display: block;}
    header .logo{margin: 0 auto; text-align: center;}

    header .gnb{width: 100%; text-align: center; margin-top: 30px;}
    header .gnb ul{display: flex; align-items: center;}
    header .gnb li{flex:1; font-size: 16px; margin-right: 0; padding:0 15px; box-sizing: border-box; position: relative;}
    header .gnb li::after{position: absolute; top: 50%; right:0; transform: translateY(-50%); content: ''; width: 1px; height: 70%; background:#aaa;}
    header .gnb li:last-child:after{display: none;}
}

@media screen and (max-width:768px){
    header .logo img{width: 80%;}

    header .gnb li{font-size: 15px;}
}

@media screen and (max-width:600px){
    header .logo{margin-left: 0; text-align:left;}
    header .logo img{width: 70%;}

    header .gnb{display: none;}
    header .ham_btn{display: block;}

    .mobile_menu .right_wrap {z-index: 1;top: 28px;right: 84px; display: block;}
}


@media screen and (max-width:500px){
    .mobile_menu .m_gnb{padding: 60px 20px 0;}
    .mobile_menu .m_gnb > ul > li{margin-bottom: 35px;}
    .mobile_menu .m_gnb > ul > li > a{font-size: 18px;}
}