@charset "utf-8";

*{-webkit-text-size-adjust: none;}
.header_wrap .gnb_menu_container{position: absolute; margin-left: 236px; left:0; width: calc(100% - 236px);}

/* gnb */
.header_wrap {position:absolute; top:0; left:0; z-index: 100; padding-top: 20px;}
.sub_layout .header_wrap{position: fixed; padding-top: 20px;}
.header_wrap .header_left_con{float: left;}
.header_wrap .header_right_con{float: right; padding-top: 5px;}
.sub_layout .header_wrap .menu_icon_box{margin-top: 0;}

.header_wrap .logo_con{display: inline-block; vertical-align: middle; float:none;}
.header_wrap .logo_con img{width: 120px;}
.header_wrap .header_util_list_con{display: none; vertical-align: middle; margin-top: -2px;}
.header_wrap .header_util_list{position: relative; display: inline-block; padding-left:17px; padding-right: 17px;}
.header_wrap .header_util_list:after{content: ''; position: absolute; top:50%; right: 0; transform: translate(50%, -50%); height: 14px; border-right:1px solid rgba(255,255,255,0.23);}
.header_wrap .header_util_list:first-child{padding-left: 0;}
.header_wrap .header_util_list:last-child{padding-right: 0;}
.header_wrap .header_util_list:last-child:after{display: none;}
.header_wrap .header_util_list > a{font-size: 15px; font-size: 1.5rem; line-height: 21px; line-height: 2.1rem; letter-spacing: -0.015em; font-weight: 400; color:#fff; transition: all 0.3s;}
.header_wrap .header_util_list > a:hover{color: #000;}

.header_wrap .menu_wrap{display: none; vertical-align: middle; float:none; overflow: hidden; margin-top: 5px; margin-right: 44px;}
.header_wrap .gnb_wrap{display: none; overflow: hidden;}
.header_wrap .gnb_wrap > div > ul > li{overflow: hidden; display:inline-block; vertical-align: top;}
.header_wrap .gnb_wrap > div > ul > li > a{display:block; position: relative; margin-right: 44px;
    font-size:16px; font-size:1.6rem; line-height:22px; line-height:2.2rem; letter-spacing: 0.04em; color:#fff; font-weight:400; transition: all 0.3s;}
.header_wrap .gnb_wrap > div > ul > li:last-child > a{margin-right:0;}
.header_wrap .gnb_wrap > div > ul > li > a:hover{color:#000;}
.header_wrap .gnb_wrap > div > ul > li > ul{display: none;}

.header_wrap .menu_icon_box{display: inline-block; vertical-align: middle; float:none; margin-top: 2px;}
.header_wrap .menu_icon_box .menu_icon{display:inline-block; width:35px; height:20px; position: relative; overflow: hidden;}
.header_wrap .menu_icon_box .menu_icon span{width:35px; height:2px; background-color:#fff; position: absolute; top:50%; left:0; margin-top:-1px; transition: all 0.3s;}
.header_wrap .menu_icon_box .menu_icon:before{content:""; position: absolute; top:0px; left:0; width:35px; height:2px; background-color:#fff; transition: all 0.3s;}
.header_wrap .menu_icon_box .menu_icon:after{content:""; position: absolute; bottom:0px; left:0; width:35px; height:2px; background-color:#fff; transition: all 0.3s;}
.header_wrap .member_menu_wrap{vertical-align: middle; margin-top: 1px; margin-right: 50px; float:none;}
.header_wrap .member_menu_wrap .btn_style_0_con{float:none; display: inline-block; vertical-align: middle;}


/*hover gnb*/
.click_header_dim{width: 100%; position: fixed; height: 100%; left: 0; top: 0; background-color: #000; opacity: 0.6; z-index: 100; display: none;}
.click_header_wrap{position: fixed; right:-100%; z-index: 101; height: 100%; transition: all 0.5s; background-color: rgba(0, 0, 0, 0);}
.click_header_wrap .web_close_btn {position: absolute; top: 40px; right: 40px; width: 47px; height: 47px;}
.click_header_wrap.active{right:0;}
.click_header_wrap > div{overflow-y:scroll; width: 100%; height: 100%; margin-right: 0px; background-color: #000;}
.click_header_wrap > div::-webkit-scrollbar {display: none;}
.click_header_wrap .header_fixed_menu_box{background-color: #1b1b1b; margin-bottom: 44px; padding-left:40px; padding-right:40px; padding-top: 13px; padding-bottom: 15px;}
.click_header_wrap .logo_box{display: table; width: 100%; box-sizing: border-box; padding-top: 40px; padding-right: 40px; padding-bottom: 38px; padding-left: 40px;}
.click_header_wrap .logo_box .title{font-size:53px; font-size:5.3rem; line-height:59px; line-height:5.9rem; font-weight: 700; color:#fff;}
.click_header_wrap .logo_box > div{padding-bottom:9px;}
.click_header_wrap .logo_box > div, .click_header_wrap .logo_box > a{display: table-cell; vertical-align: middle;}
.click_header_wrap .logo_box > div img, .click_header_wrap .logo_box > a.m_logo img{width:149px;}
.click_header_wrap .logo_box > .close_menu{width: 32px;}
.click_header_wrap .logo_box > a{cursor: pointer;}
.click_header_wrap .logo_box .m_logo{display: table-cell; text-align: left;}
.click_header_wrap .gnb_wrap > div{font-size:0; text-align: left;}
.click_header_wrap .gnb_wrap > div > ul > li{position:relative; display:block; box-sizing:border-box; /*margin-bottom: 25px;*/}
.click_header_wrap .gnb_wrap > div > ul > li > a{display: block; padding-bottom: 20px; margin-bottom: 20px;
    transition:all 0.3s; border-bottom: 2px solid transparent; font-family: 'Helvetica Neue','Noto Sans KR';
    font-size:17px; font-size:1.7rem; line-height:23px; line-height:2.3rem;  letter-spacing: 0.04em; font-weight: 400; color:#fff;  position: relative;}
.click_header_wrap .gnb_wrap > div > ul > li > a:after{content: ''; position:absolute; width:0px; top:9px; right:0; border-bottom: 2px solid #5ab1e5; transition: width 0.3s;}
.click_header_wrap .gnb_wrap > div > ul > li.list_on > a {color:#5ab1e5; transition:all 0.3s; background-size: 21px 0px;}
.click_header_wrap .gnb_wrap > div > ul > li.list_on > a:after{content: ''; max-width:368px; width: calc(100% - 104px); transition: width 0.3s;}
.click_header_wrap .gnb_wrap > div > ul > li > ul{height:0; overflow: hidden;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li{font-size:17px; font-size:1.7rem; line-height:30px; line-height:3.0rem; color: #fff; font-weight: 300; letter-spacing: -0.03em; background-position: right center;}
.click_header_wrap .gnb_wrap > div > ul > li.active.list_on > ul{margin-bottom: 30px;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li.active{color:#fff;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li.active > a{background-position: right center;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > a{display: block; padding-top:12px; padding-bottom:1px; background-position: right center; transition:all 0.3s;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_0 > ul > li{font-family:"Helvetica Neue";margin-bottom: 0; letter-spacing: 0.02em; font-weight: 200; line-height: 22px; line-height: 2.2rem;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_0 > ul > li > a {padding-top: 15px; background-position: right top 9px;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_1 > ul > li{font-family:"Helvetica Neue";margin-bottom: 0; letter-spacing: 0.02em; font-weight: 200; line-height: 22px; line-height: 2.2rem;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_1 > ul > li > a {padding-top: 15px; background-position: right top 9px;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_3 > ul > li.menu_2_2{font-family:"Helvetica Neue";margin-bottom: 0; letter-spacing: 0.02em; font-weight: 200; line-height: 22px; line-height: 2.2rem;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_3 > ul > li.menu_2_2 > a {padding-top: 15px; background-position: right top 10px;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li:first-child > a{padding-top:0;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_0 > ul > li:first-child > a{padding-top:7px;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_1 > ul > li:first-child > a{padding-top:7px;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li:last-child > a{padding-bottom:0px;}
.click_header_wrap .member_menu_wrap {display: inline-block; vertical-align: middle; margin-top: 1px; float:none;}
.click_header_wrap .member_menu_wrap ul > li {position: relative; display: inline-block; font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.015em; color: #fff; font-weight: 300;}
.click_header_wrap .member_menu_wrap ul > li {padding-right: 16px; margin-right: 13px;}
.click_header_wrap .member_menu_wrap ul > li:after{content:''; position: absolute; top:50%; right:0; transform: translateY(calc(-50% + 1px)); height: 13px; border-right:1px solid rgba(255,255,255,0.5);}
.click_header_wrap .member_menu_wrap ul > li:hover{color:#5ab1e5;}
.click_header_wrap .member_menu_wrap ul > li:last-child:after{content:none;}
.click_header_close_con{display: none; position: absolute; top:40px; right: 40px; cursor: pointer;}
.click_header_close_con img{width:47px;}
.click_header_close_con img.default_img{display:inline;}
.click_header_close_con img.hover_img{display:none;}

/* fixed */
.fixed_header_wrap {position:fixed; top:0; left:0; z-index: 100; padding-top: 13px; padding-bottom: 13px; display: none; background-color: rgba(255,255,255,0.9); border-bottom:1px solid #eee;}
.fixed_header_wrap .header_left_con{float: left;}
.fixed_header_wrap .header_right_con{float: right; padding-top: 2px;}
.sub_layout .fixed_header_wrap .header_right_con{padding-top: 3px;}

.fixed_header_wrap .logo_con{display: inline-block; vertical-align: middle; float:none;}
.fixed_header_wrap .logo_con img{width: 120px; height: 25px;}
.fixed_header_wrap .header_util_list_con{display: none; vertical-align: middle;}
.fixed_header_wrap .header_util_list{position: relative; display: inline-block; padding-left:17px; padding-right: 17px;}
.fixed_header_wrap .header_util_list:after{content: ''; position: absolute; top:50%; right: 0; transform: translate(50%, -50%); height: 14px; border-right:1px solid rgba(138,182,208,0.23);}
.fixed_header_wrap .header_util_list:first-child{padding-left: 0;}
.fixed_header_wrap .header_util_list:last-child{padding-right: 0;}
.fixed_header_wrap .header_util_list:last-child:after{display: none;}
.fixed_header_wrap .header_util_list > a{font-size: 15px; font-size: 1.5rem; line-height: 21px; line-height: 2.1rem; letter-spacing: -0.015em; font-weight: 400; color:#8ab6d0; transition: all 0.3s;}
.fixed_header_wrap .header_util_list > a:hover{color: #000;}

.fixed_header_wrap .menu_wrap{display: none; vertical-align: middle; float:none; overflow: hidden; margin-right: 45px; margin-top: 7px;}
.fixed_header_wrap .gnb_wrap{display: none; overflow: hidden;}
.fixed_header_wrap .gnb_wrap > div > ul > li{overflow: hidden; display:inline-block; vertical-align: top;}
.fixed_header_wrap .gnb_wrap > div > ul > li > a{display:block; position: relative; margin-right: 44px;
    font-size:16px; font-size:1.6rem; line-height:22px; line-height:2.2rem; letter-spacing: 0.04em; color:#8ab6d0; font-weight:400; transition: all 0.3s;}
.fixed_header_wrap .gnb_wrap > div > ul > li:last-child > a{margin-right:0;}
.fixed_header_wrap .gnb_wrap > div > ul > li > a:hover{color:#000;}
.fixed_header_wrap .gnb_wrap > div > ul > li > ul{display: none;}

.fixed_header_wrap .menu_icon_box{display: inline-block; vertical-align: middle; float:none; padding-top: 2px;}
.fixed_header_wrap .menu_icon_box .menu_icon{display:inline-block; width:35px; height:20px; position: relative; overflow: hidden;}
.fixed_header_wrap .menu_icon_box .menu_icon span{width:35px; height:2px; background-color:#8ab6d0; position: absolute; top:50%; left:0; margin-top:-1px; transition: all 0.3s;}
.fixed_header_wrap .menu_icon_box .menu_icon:before{content:""; position: absolute; top:0px; left:0; width:35px; height:2px; background-color:#8ab6d0; transition: all 0.3s;}
.fixed_header_wrap .menu_icon_box .menu_icon:after{content:""; position: absolute; bottom:0px; left:0; width:35px; height:2px; background-color:#8ab6d0; transition: all 0.3s;}
.fixed_header_wrap .member_menu_wrap{vertical-align: middle; margin-top: 1px; margin-right: 50px; float:none;}
.fixed_header_wrap .member_menu_wrap .btn_style_0_con{float:none; display: inline-block; vertical-align: middle;}

/*popupBanner*/
.banner_popup_wrap{background-color: transparent !important; max-height: 100vh;}
.banner_popup_wrap .banner_popup_con{}
.banner_popup_wrap .banner_popup_contents_con{border-radius: 20px; overflow: hidden; max-height: calc(100vh - 43px - 74px); overflow-y: auto;}
.banner_popup_wrap .banner_popup_close_btn_con{z-index: 10; cursor: pointer;}
.banner_popup_wrap .day_close_btn_con a{display: inline-block; box-sizing:  border-box; border: 1px solid #fff; padding: 9px 21px 11px 21px; border-radius: 30px;}
.banner_popup_wrap .day_close_btn_con a > span{font-size: 16px; font-size: 1.6rem; line-height: 22px; line-height: 2.2rem; font-weight: 500; letter-spacing: -0.015em; color: #fff;}

/* Coming Soon */
/*.header_wrap .menu_icon_box .menu_icon{display: none !important;}
.header_wrap .header_util_list_con{display: none !important;}
.header_wrap .header_right_con{display: none !important;}*/

@media all and (min-width:768px){
    .header_wrap .logo_con{margin-right: 39px;}
    .header_wrap .header_util_list_con{display: inline-block;}

    .header_wrap .menu_icon_box:hover .menu_icon span{background-color: #000;}
    .header_wrap .menu_icon_box:hover .menu_icon:before{background-color: #000;}
    .header_wrap .menu_icon_box:hover .menu_icon:after{background-color: #000;}

    .fixed_header_wrap .logo_con{margin-right: 19px;}
    .fixed_header_wrap .header_util_list_con{display: inline-block; margin-top: 3px;}

    .fixed_header_wrap .menu_icon_box:hover .menu_icon span{background-color: #000;}
    .fixed_header_wrap .menu_icon_box:hover .menu_icon:before{background-color: #000;}
    .fixed_header_wrap .menu_icon_box:hover .menu_icon:after{background-color: #000;}
}

@media all and (min-width:992px){
    .header_wrap{padding-top: 28px;}
    .header_wrap .header_right_con{padding-top: 3px;}
    .sub_layout .header_wrap{padding-top: 33px;}
    .header_wrap .logo_con img{width: 149px;}

    .fixed_header_wrap .gnb_wrap{display: block;}
    .sub_layout .fixed_header_wrap .header_right_con{padding-top: 1px;}

    /*click header*/
    .click_header_wrap{width: 100%; background-color: rgba(0,0,0,0.9);}
    .click_header_wrap > div{max-width: none; width: 100%; background-color: transparent;}
    .click_header_wrap .click_header_con{top:50%; transform: translateY(-50%);}
    .click_header_wrap .click_header_con > div{padding-bottom: 130px;}
    .click_header_wrap .logo_wrap{margin-bottom: 55px;}
    .click_header_wrap .logo_box{padding-right:0px; padding-left:0px; padding-top: 0; padding-bottom: 0;}
    .click_header_wrap .logo_box > div, .click_header_wrap .logo_box > a{padding-bottom:0; vertical-align: middle;}
    .click_header_wrap .logo_box > div img, .click_header_wrap .logo_box > a.m_logo img{width:295px;}
    .click_header_wrap .logo_box .close_menu > img{width: 24px; height: 24px; display: none;}
    .click_header_wrap .header_fixed_menu_box{position: absolute; width: auto; right: 85px; bottom:0; background-color: transparent; margin-bottom: 0; padding:0;}
    .click_header_wrap .gnb_wrap > div > ul{width:calc(100% + 90px); margin-left: -90px;}
    .click_header_wrap .gnb_wrap > div > ul > li{display: inline-block; width:25%; padding-left: 90px; box-sizing: border-box; vertical-align: top; margin-bottom: 6px;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul{height:auto; overflow: hidden;}
    .click_header_wrap .gnb_wrap > div > ul > li.list_on > ul{margin-bottom: 0px;}
    /*.click_header_wrap .gnb_wrap > div > ul > li:hover > a{color:#fff; border-color: #fff;}*/
    .click_header_wrap .gnb_wrap > div > ul > li:hover > a{color:#5ab1e5;}
    .click_header_wrap .gnb_wrap > div > ul > li:hover > a:before{width:100%;}
    .click_header_wrap .gnb_wrap > div > ul > li.active > a:before{width:100%;}
    .click_header_wrap .gnb_wrap > div > ul > li.active > a{color:#5ab1e5;/* border-color: #fff;*/}

    .click_header_wrap .gnb_wrap > div > ul > li > a{padding-bottom:15px; margin-bottom: 18px; background-image: none;}
    .click_header_wrap .gnb_wrap > div > ul > li > a:before{content:""; position: absolute; bottom:0; left:0; width:0; border-bottom:2px solid #5ab1e5; transition:all .3s;}
    .click_header_wrap .gnb_wrap > div > ul > li > a:after{display: none;}

    .click_header_wrap .gnb_wrap > div > ul > li > ul > li:hover > a{color:#5ab1e5; background-image: url("../img/arr_blue_right_btn.png"); background-size: 6px 11px; background-repeat:no-repeat;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li.active > a{color:#5ab1e5; background-image: url("../img/arr_blue_right_btn.png"); background-size: 6px 11px; background-repeat:no-repeat;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > a{display:inline-block; padding-top: 0; padding-right:19px;}
    .click_header_wrap .gnb_wrap > div > ul > li.menu_1_0 > ul > li > a {padding-top: 7px; margin-bottom: -5px;}
    .click_header_wrap .gnb_wrap > div > ul > li.menu_1_1 > ul > li > a {padding-top: 7px; margin-bottom: -5px;}
    .click_header_wrap .gnb_wrap > div > ul > li.menu_1_3 > ul > li.menu_2_2 > a {padding-top: 7px; margin-bottom: -5px;}
    .click_header_wrap .gnb_wrap > div > ul > li:last-child > ul{transform:translateY(2px);}
    .click_header_close_con{display: inline-block;}

    /* Coming Soon */
    /*.header_wrap{padding-top: 43px;}*/
}

@media all and (min-width: 1200px){
    .header_wrap .menu_wrap{display: inline-block;}
    .header_wrap .gnb_wrap{display: block;}

    .fixed_header_wrap .menu_wrap{display: inline-block;}
}