@charset "utf-8";

.header_wrap{position: absolute; top:0; left:0; z-index: 10;}
.sub .header_wrap{width: auto; left:auto; right: 0; padding-top: 18px; padding-left: 20px; padding-right: 20px;}

/* gnb (왼쪽) */
.header_wrap .gnb_container{display: none; position: absolute; z-index: 2; width: 100%; height: 100%; text-align: left; padding-left: 40px; padding-right: 104px;  background-color: #101010;}
.header_wrap .gnb_top_con{display: flex; align-items: center; height: 100%;}
.header_wrap .gnb_container .logo_con{width: auto; margin-right: 30px;}
.header_wrap .logo_con .logo{display:inline-block;}
.main .header_wrap .logo_con .logo .sub{display:none !important;}
.main .header_wrap .logo_con .logo .main{display:inline;}
.header_wrap .logo_con .web{display: none;}
.header_wrap .logo_con .mobile{display: inline;}
.sub .header_wrap .logo_con .logo .main{display:none !important;}
.header_wrap .gnb_wrapper{width: auto; flex: 1;}
.header_wrap .gnb_wrapper{width: auto;}
.header_wrap .gnb_wrap{font-size:0; line-height:0; text-align: left;}
.header_wrap .gnb_wrap > li{display:none; text-align: left; padding-right:20px;}
.header_wrap .gnb_wrap > li:nth-child(1){display: inline-block;}
.header_wrap .gnb_wrap > li:nth-child(2){display: inline-block;}
.header_wrap .gnb_wrap > li:nth-child(3){display: inline-block;}
.header_wrap .gnb_wrap > li:nth-child(4){display: inline-block;}
.header_wrap .gnb_wrap > li:nth-child(5){display: inline-block; padding-right: 0;}
.header_wrap .gnb_wrap > li > a{font-size:16px; font-size:1.6rem; line-height:22px; line-height:2.2rem; letter-spacing: -0.02em; color:#fff; font-weight:400;}
.header_wrap .gnb_wrap > li > a.active{color:#7b7efe;}
.header_wrap .gnb_wrap > li > a > span{}


.header_wrap .header_util_list_wrap{width: auto;}
.header_wrap .header_util_list_con{font-size:0; line-height:0;}
.header_wrap .header_util_list{position: relative; display: inline-block; padding-right: 18px;}
.header_wrap .header_util_list:first-child{padding-top: 0px;}
.header_wrap .header_util_list:last-child{padding-bottom: 0px; padding-right: 0;}
.header_wrap .header_util_list:last-child:after{display: none;}
.header_wrap .header_util_list > a{display: inline-block; font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.02em; color:#fff; font-weight:300;}
.header_wrap .gnb_bottom_con{display: none; position: absolute; left:0; bottom:85px;}
.header_wrap .header_sns_list_con{font-size:0; line-height:0; text-align: center; margin-bottom:46px;}
.header_wrap .header_sns_list{display:block; vertical-align: middle; margin-bottom: 25px;}
.header_wrap .header_sns_list:last-child{margin-bottom: 0;}
.header_wrap .header_sns_list > a{display: inline-block;}
.header_wrap .header_sns_list.facebook img{width:27px;}
.header_wrap .header_sns_list.youtube img{width:27px;}
.header_wrap .header_sns_list.insta img{width:27px;}
.header_wrap .header_sns_list.band img{width:24px;}
.header_wrap .go_top_btn_con{text-align: center; font-size:0; line-height:0;}
.header_wrap .go_top_btn{display:inline-block; vertical-align: middle;}

/* 메뉴 */
.header_wrap .menu_container{position: relative; z-index: 2; float: right; display: block; width: auto; top:0px; right: 0px;}
.header_wrap .menu_icon_con{float:right; margin-top: 7px; margin-bottom: 7px;}
.header_wrap .menu_icon{display:block; position: relative; width:34px; height:20px;}
.header_wrap .menu_icon > span{position: absolute; width:100%; height:2px; background-color:#000; top:50%; left:0px; transform: translateY(-50%); transition: all 0.3s;}
.header_wrap .menu_icon > span:before{content:""; position: absolute; width: 23px; height:100%; background-color:#000; top: 11px; left:0; transition: all 0.3s;}


/* 상단 header */
.header_wrap .header_contents_inner{position: absolute; bottom:0; right: 0; float:right; width: auto;}
.header_wrap .header_top_container{display: flex; align-items: center; justify-content: flex-end; width: 100%; height: 100%; float: none; overflow: hidden;}
.header_wrap .header_top_container .btn_style_1_con{display: none; margin-right: 27px;}
.header_wrap .header_top_container .menu_icon_con{display: none;}
.header_wrap .member_img_con{display: none; margin-right: 15px;}
.header_wrap .member_img{width: 42px; height: 42px; border-radius: 50%; background-color: #eee; background-image: url('../img/new/default_member_img.png'); background-size: cover; background-repeat: no-repeat; background-position: center;}
.header_wrap .member_id_con{display: none; margin-right: 28px;}
.header_wrap .member_id{font-size: 15px; font-size: 1.5rem; line-height: 21px; line-height: 2.1rem; font-weight: 500; letter-spacing: 0.02em !important; color:#000;}
[data-wv-agent="ie"] .header_wrap .member_id_con{margin-top:1px;}
[data-wv-agent="edge"] .header_wrap .member_id_con{margin-top:1px;}
[data-wv-agent="ipad"] .header_wrap .member_id_con{margin-top:3px;}
[data-wv-agent="Mac"] .header_wrap .member_id_con{margin-top:2px;}


.preload * {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
}

/* guide_container */
.header_wrap .guide_open_btn_con{position: fixed; right: 20px; bottom: 30px; display:block; float:right;}
.header_wrap .guide_open_btn{display:inline-block; width: 67px; height: 67px; background-color: #6d13ff; border-radius: 50%;
    background-image: url('../img/new/guide_open_plus_icon.png'); background-repeat: no-repeat; background-position: center;
    transition: width 0.3s ease;
    -ms-transition: width 0.3s ease;
    box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.19);}
.header_wrap .guide_open_btn_inner{display: none; font-size: 13px; font-size: 1.3rem; line-height: 19px; line-height: 1.9rem; letter-spacing: -0.02em; font-weight: 400; color:#fff; text-align: left; padding-left: 75px; transition:padding 0.2s ease;}
.header_wrap .guide_open_btn_con .guide_open_text_inner{transition:margin .2s ease;}
.header_wrap .guide_open_btn_con .guide_open_text{}
.header_wrap .guide_open_btn_con .guide_open_arrow{}
.theme .header_wrap .guide_open_btn_con{display: block;}
.header_wrap .guide_open_btn_con .guide_open_text_con{}
/*.theme .header_wrap .guide_open_btn{background-image: none; margin-right: -35px;}  모바일에선 보여야해서 옮김kej*/
/*.theme .header_wrap .guide_open_btn{display: block;}*/

.header_wrap .guide_container{position: fixed; top:0; right: 0; width: 318px; height: 100vh; background-color: #f3fcfd; z-index: 101; transform: translateX(100%);}
.theme .header_wrap .guide_container{transform: translateX(100%);}
.theme .header_wrap .header_contents_inner{padding-right: 0;}
.guide_container .guide_container_inner{height:100%; /*padding-top: 196px; padding-right: 40px; padding-left: 40px;*/}
.guide_container .title_con{/*padding-bottom: 63px;*/ padding-top: 196px; padding-right: 40px; padding-left: 40px;}
.guide_container .title_con .title{/*margin-bottom: 79px;*/ margin-bottom: 39px; font-size:30px; font-size:3.0rem; line-height:36px; line-height:3.6rem; letter-spacing: -0.06em; font-weight: 500;}
.guide_close_btn_con{display: block; text-align: right; position: absolute; top:83px; right:0;}
.wrapper.theme .guide_close_btn_con{display: block;}
.guide_close_btn_con .guide_close_btn{font-size:13px; font-size:1.3rem; line-height:19px; line-height:1.9rem; letter-spacing: -0.02em; font-weight: 400; color:#fff;
    transition: all 0.2s ease;
    padding:10px 33px 11px 24px; margin-right: -18px; display: inline-block;
    background-image: url("../img/new/close_icon_11x10.png"); background-repeat: no-repeat; background-position: right 7px center;
    background-color: #6d13ff; border-top-left-radius:20px; border-bottom-left-radius:20px;}
.guide_container .guide_contents_wrap{/*height:calc(100vh - 425px);*/ height:calc(100vh - 322px);}
.guide_container .guide_contents_inner{padding-right: 40px; padding-left: 40px;}
.guide_container .contents_box{}
.guide_container .contents_box:first-child{padding-top: 63px;}/* 최대한 스크롤 영역 늘리기위해 title_con.mb대신 넣음 */
.guide_container .contents_box:last-child{padding-bottom: 140px;}/* 임시여백 mb70으로하니까 ie에서 여백이 없이나와서 pb70으로 변경 */
.guide_container .contents_title_con{display: flex; justify-content: space-between; align-items: center; padding-bottom: 13px; border-bottom:1px solid #b1b1b1;}
.guide_container .contents_title_con.border_none{border:none;}
.guide_container .contents_title{font-size:17px; font-size:1.7rem; line-height:23px; line-height:2.3rem; letter-spacing: -0.02em; font-weight: 500; color:#101010;}
.guide_container .contents_sub_title{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.02em; font-weight: 500; color:#101010; transition: color 0.3s ease;}
.guide_container .contents_sub_title.after_triangle{padding-left: 13px;}
.guide_container .contents_sub_title.after_triangle::after{content: ''; position: absolute; top:6px; left:0; width: 0; height: 0; /*top:50%; transform:translateY(-50%);*/
    border-top: 4px solid transparent; border-left: 5px solid #000; border-bottom: 4px solid transparent;}
/*.guide_container .contents{padding-top: 24px;}*//* 공통으로 빼려했으나 처음 오는 폰트에 따라 여백이 달라지므로 ptxx로 표기하기로함 */
.guide_container .contents_desc{word-break:keep-all; font-size:15px; font-size:1.5rem; line-height:24px; line-height:2.4rem; letter-spacing: -0.02em; font-weight: 300; color:#000;}
/*.guide_container .guide_more_btn{display:inline-block; width:54px; height:54px; background-color: #6d13ff; border-radius: 50%;
    background-image: url("../img/new/guide_more_btn.png"); background-repeat: no-repeat; background-position:center; background-size: 20px 20px; transition: all 0.2s ease;}*/
.guide_container .guide_more_btn{position:relative; display:inline-block; width:54px; height:54px; background-color: #6d13ff; border-radius: 50%;}
.guide_container .guide_more_btn > span{width: 20px; height: 20px; display: inline-block; position: relative; height: 100%; vertical-align: middle;}
.guide_container .guide_more_btn > span::before{content:''; position: absolute; top:50%; left:50%; width: 20px; height: 2px; transform: translate(-50%,-50%) rotate(0deg); background-color: #fff; transform-origin:right;}
.guide_container .guide_more_btn > span::after{content:''; position: absolute; top:50%; left:50%; width: 2px; height: 20px; transform: translate(-50%,-50%) rotate(0deg); background-color: #fff; transform-origin:right;}


.guide_container .guide_more_btn > span::before {
    -webkit-transition-duration: 0.15s, 0.15s , 0.15s;
    transition-duration: 0.15s, 0.15s , 0.15s ;
    -webkit-transition-delay: 0.0s, 0s , 0s;
    transition-delay: 0.0s, 0s ,0s;
    -webkit-transition-timing-function : ease;
    transition-timing-function : ease;
}
.guide_container .guide_more_btn > span::after{
    -webkit-transition-duration: 0.15s, 0.15s , 0.15s;
    transition-duration: 0.15s, 0.15s , 0.15s ;
    -webkit-transition-delay: 0.0s, 0s , 0s;
    transition-delay: 0.0s, 0s ,0s;
    -webkit-transition-timing-function : ease;
    transition-timing-function : ease;
}
.guide_container .guide_more_btn > span::before {
    -webkit-transition-property: -webkit-transform , width , height;
    transition-property: transform , width , height;
}
.guide_container .guide_more_btn > span::after {
    -webkit-transition-property: -webkit-transform , width , height;
    transition-property: transform , width, height;
}
.guide_container .guide_more_btn:hover > span::before{transform:translate(-50%,-50%) rotate(45deg); width: 13px; height: 2px;}
.guide_container .guide_more_btn:hover > span::after{transform:translate(-50%,-50%) rotate(45deg); /*width: 13px; height: 2px;*/
    top:59%; left:56%; width: 2px; height: 12px;}



.guide_container .guide_swiper{}
.guide_container .guide_swiper .img_box{min-height: auto;}/* content.board.custom.css 에서 img_box에 min-height 들어가있음 */
.guide_container .guide_swiper_util{display: flex; justify-content: center; align-items: baseline;}
.guide_container .guide_rolling_btn{width:6px; height:11px; cursor: pointer; outline: none; transition: all 0.2s ease;}
.guide_container .guide_rolling_btn::after{content: ''; position: absolute; bottom: -5px; border-bottom: 1px solid transparent; width: 12px; transition: border-color 0.2s ease;}
.guide_container .guide_rolling_btn.left{background-image: url('../img/new/guide_swiper_rolling_btn_left.png'); background-repeat: no-repeat; background-position: center;}
.guide_container .guide_rolling_btn.right{background-image: url('../img/new/guide_swiper_rolling_btn_right.png'); background-repeat: no-repeat; background-position: center;}
.guide_container .guide_rolling_btn.right{}
.guide_container .guide_rolling_btn.left::after{left: -2px;}
.guide_container .guide_rolling_btn.right::after{left: -4px;}
.guide_container .guide_rolling_btn.left:hover{background-image: url('../img/new/guide_swiper_rolling_btn_left_h.png'); background-repeat: no-repeat; background-position: center;}
.guide_container .guide_rolling_btn.right:hover{background-image: url('../img/new/guide_swiper_rolling_btn_right_h.png'); background-repeat: no-repeat; background-position: center;}
.guide_container .guide_rolling_btn:hover::after{border-color:#6d13ff;}

.guide_container .guide_rolling_btn:hover{}
.guide_container .guide_rolling_btn:hover::after{border-color:#6d13ff;}

.guide_container .guide_pagination.swiper-pagination{position: static; width: auto;}
.guide_container .guide_pagination.swiper-pagination > span{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.02em;}

.guide_container .video_con{}
.guide_container .video_con .video{display:flex; align-items:center; justify-content:center; width:100%; height:152px;
    background-image: url("../img/new/guide_video_thumbnail.jpg"); background-position: center; background-size: cover; background-repeat: no-repeat;}

.guide_container .guide_list{}
.guide_container .guide_list > li{position: relative; padding-left: 14px; margin-bottom: 8px; transition: border-color 0.2s ease;}
.guide_container .guide_list > li:last-child{margin-bottom: 0;}
.guide_container .guide_list > li:first-child{display: none !important;}
.guide_container .guide_list > li::after{content:''; position: absolute; top:13px; left:0; width: 5px; border-bottom:1px solid #000;}
.guide_container .guide_list > li > a.contents_desc{transition: all 0.2s ease; font-weight: 300; color:#000;}


/* main */
.main .header_wrap{padding-top: 20px;}
.main .header_wrap .gnb_container{display: block; position: absolute; width: auto; height: auto; background-color: transparent; padding-top:0; padding-left: 20px; padding-right: 0;}
.main .header_wrap .gnb_top_con{display: flex; align-items: center; justify-content: center;}
.main .header_wrap .gnb_container .logo_con{flex: 1; text-align: left; width: auto; margin-bottom: 0px;}
.main .header_wrap .gnb_wrapper{display: none;}
.main .header_wrap .logo_con .logo > img{width: auto;}
.main .header_wrap .menu_container{display: flex; width: auto; height: 32px; top:0px; right: 20px; padding-left:0;}
.main .header_wrap .menu_icon > span{background-color: #fff;}
.main .header_wrap .menu_icon > span:before{background-color: #fff;}
.main .header_wrap .menu_icon > span:after{background-color: #fff;}
.main .header_wrap .header_util_list_wrap{display: none; width: auto; margin-top:2px;}
.main .header_wrap .header_util_list{display: inline-block; padding-top:0; padding-bottom:0; padding-left: 10px; padding-right: 10px;}
.main .header_wrap .header_util_list:first-child{padding-left: 0;}
.main .header_wrap .header_util_list:last-child{padding-right: 0;}
.main .header_wrap .header_util_list:after{display:none;}
.main .header_wrap .gnb_bottom_con{display: none;}

.main .header_wrap .header_contents_inner{display: none;}
.main .header_wrap .guide_container{display: none;}
.main .header_wrap .customer_view_con{display:none;}

/* 클릭 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); width: 424px;}
.click_header_wrap.active{right:0;}
.click_header_wrap > div{overflow-y:auto; width: 100%; height: 100%; margin-right: 0px; background-color: #000;}
.click_header_wrap .header_fixed_menu_box{background-color: #1b1b1b; margin-bottom: 36px; padding-left:36px; padding-right:36px; padding-top: 18px; padding-bottom: 20px;}
.click_header_wrap .logo_box{display: table; width: 100%; box-sizing: border-box; padding-top: 32px; padding-right: 36px; padding-bottom: 32px; padding-left: 36px;}
.click_header_wrap .logo_box .title{}
/*.click_header_wrap .logo_box > div, .click_header_wrap .logo_box > a{display: table-cell; vertical-align: bottom;}*/
.click_header_wrap .logo_box > div img, .click_header_wrap .logo_box > a img{/*width:241px;*/}
.click_header_wrap .logo_box .close_menu {display:table-cell; cursor: pointer;}
.click_header_wrap .logo_box .close_menu > img{width: 29px; height: 29px;}
.click_header_wrap .logo_box .m_logo{display: table-cell; text-align: left;}
.click_header_wrap .gnb_wrap{text-align: left !important;}
.click_header_wrap .gnb_wrap > li{text-align: left !important;}
.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;*/ padding-right: 0;}
.click_header_wrap .gnb_wrap > div > ul > li > a{display: block; padding-bottom: 20px; margin-bottom: 20px;
    background-image:url("../img/new/m_arrow.png"); background-repeat: no-repeat; background-position: right top 10px; background-size:16px 9px;
    transition:all 0s; transition-delay: .3s; border-bottom: 2px solid transparent;
    font-size:20px; font-size:2.0rem; line-height:26px; line-height:2.6rem; letter-spacing: -0.045em; font-weight: 500; color:#fff;  position: relative;}
.click_header_wrap .gnb_wrap > div > ul > li > a:after{content: ''; position:absolute; width:0px; top:11px; right:0; border-bottom: 3px solid #7b7efe; transition: width 0.5s; transform: translateY(50%);}
.click_header_wrap .gnb_wrap > div > ul > li.list_on > a {color:#7b7efe; transition:all 0s; transition-delay:0s; background-size: 21px 0px;}
.click_header_wrap .gnb_wrap > div > ul > li.list_on > a:after{content: ''; width:100%; transition: width 0.5s;}
.click_header_wrap .gnb_wrap > div > ul > li > a > span{display: inline-block; background-color: #000; padding-right: 27px; position: relative; z-index: 1;}
.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:18px; font-size:1.8rem; line-height:24px; line-height:2.4rem; letter-spacing: -0.045em; color: #fff; font-weight: 400;}
.click_header_wrap .gnb_wrap > div > ul > li.active.list_on > ul{margin-bottom: 55px;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li.active{color:#7b7efe;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li:first-child > a{padding-top:0;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li:last-child > a{padding-bottom:0px;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > a{display: block; padding-top:12px; padding-bottom:5px;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul{padding-top: 15px; padding-bottom: 15px;} /*3depth*/
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li{display: block; margin-bottom: 11px;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_0 > ul > li.menu_2_0.active > a{color:#fff;}/* 3depth메뉴갖고있는2depth */
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li:last-child{margin-bottom: 0px;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li > a{position: relative; display:inline-block; padding-left: 20px; color:#fff;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li > a::after{content:''; position: absolute; top:10px; left:0; width:9px; border-bottom:2px solid #fff;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li.active > a{color:#7b7efe;}
.click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li.active > a::after{border-color:#7b7efe;}


.click_header_wrap .member_menu_wrap{}
.click_header_wrap .header_util_list_wrap{}
.click_header_wrap .header_util_list_wrap .header_util_list_con{font-size: 0;}
.click_header_wrap .header_util_list_wrap .header_util_list{display: inline-block; vertical-align: middle; position: relative;}
.click_header_wrap .header_util_list_wrap .header_util_list > a{display: inline-block; vertical-align: middle;
    font-size:16px; font-size:1.6rem; line-height:22px; line-height:2.2rem; letter-spacing: -0.045em; font-weight: 300; color:#fff;}
.click_header_wrap .header_util_list_wrap .header_util_list:first-child{/*padding-right: 24px; margin-right: 19px;*/padding-right: 18px; margin-right: 13px;}
.click_header_wrap .header_util_list_wrap .header_util_list:first-child::after{content: ''; position: absolute; top:4px; right:0; height: 18px; border-left:2px solid rgba(255,255,255,0.15);}
.click_header_wrap .header_video_con{float:right; margin-top: 2px;}
.click_header_wrap .header_video_con > a{display: inline-block; padding-left: 24px; /*padding-bottom: 2px;*/
    font-size:13px; font-size:1.3rem; line-height:19px; line-height:1.9rem; letter-spacing: -0.045em; font-weight: 300; color:#fff;
    background-image: url('../img/new/video_play_icon.png'); background-position: left center; background-size: 16px 16px; background-repeat: no-repeat;}
.click_header_close_con{display: none; position: absolute; top:60px; right: 60px; cursor: pointer; opacity: 0.4; transition: all 0.2s ease;}
.click_header_close_con img{width:38px;}
.click_header_close_con img.default_img{display:inline;}
.click_header_close_con img.hover_img{display:none;}

/* 업그레이드 로그인 비밀번호찾기 회원가입 숨김 */
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_5{display: none;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_6{display: none;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_7{display: none;}
.click_header_wrap .gnb_wrap > div > ul > li.menu_1_8{display: none;}

/* fixed_header_wrap */
.fixed_header_wrap{position: fixed; top:0; left:0; z-index: 100; background-color:rgba(255,255,255,0.95); border-bottom:1px solid rgba(0, 0, 0, 0.2); padding-top:20px; padding-bottom:21px; transform:translateY(-100%); transition: all 0.4s;}
.fixed_header_wrap.fixed{transform: translateY(0);}
.fixed_header_wrap .fixed_header_inner{}
.fixed_header_wrap .fixed_logo_con{float:left; font-size:0; line-height:0; margin-top:5px;}
.fixed_header_wrap .fixed_menu_con{display: none; position: absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.fixed_header_wrap .fixed_menu_list{text-align: center; font-size:0; line-height:0;}
.fixed_header_wrap .fixed_menu_list > li{display:inline-block; vertical-align: middle; padding-right:23px; margin-right:24px; position: relative;}
.fixed_header_wrap .fixed_menu_list > li:after{content:""; position: absolute; top:50%; right:0; transform: translateY(-50%); margin-top:1px; height:15px; border-right:1px solid #000; opacity: 0.15; filter:alpha(opacity=15);}
.fixed_header_wrap .fixed_menu_list > li > a{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; font-weight: 400;  display:block;}
.fixed_header_wrap .fixed_menu_list > li:nth-child(5){padding-right:0; margin-right:0;}
.fixed_header_wrap .fixed_menu_list > li:nth-child(5):after{display:none;}
.fixed_header_wrap .fixed_menu_list > li:nth-child(6){display:none;}
.fixed_header_wrap .fixed_menu_list > li:nth-child(7){display:none;}
.fixed_header_wrap .fixed_menu_list > li:nth-child(8){display:none;}
.fixed_header_wrap .fixed_menu_list > li:nth-child(9){display:none;}
.fixed_header_wrap h1{}
.fixed_header_wrap .fixed_logo{}
.fixed_header_wrap .fixed_logo img{}
.fixed_header_wrap .fixed_util_con{float:right; padding-top: 1px; padding-bottom: 1px;}
.fixed_header_wrap .fixed_header_util_list_wrap{float:left;}
.fixed_header_wrap .header_util_list_con{font-size:0; line-height:0; margin-right: 37px;}
.fixed_header_wrap .header_util_list_con > li{display:inline-block; vertical-align: middle; margin-right: 18px;}
.fixed_header_wrap .header_util_list_con > li:last-child{margin-right: 0;}
.fixed_header_wrap .header_util_list_con > li > a{font-size:13px; font-size:1.3rem; line-height:19px; line-height:1.9rem; letter-spacing: -0.035em; color:#000; font-weight:400;
    display:block; padding-right: 0; transition: all .3s; background-repeat: no-repeat; background-position: right 3px top 5px;}
.fixed_header_wrap .menu_icon_con{float:left; margin-top:2px;}
.fixed_header_wrap .menu_icon{display:block; position: relative; width:33px; height:17px;}
.fixed_header_wrap .menu_icon span{}
.fixed_header_wrap .menu_icon > span{position: absolute; width:100%; height:2px; background-color:#000; top:50%; left:0px; transform: translateY(-50%);}
.fixed_header_wrap .menu_icon > span:before{content:""; position: absolute; width:100%; height:100%; background-color:#000; top:-7px; left:0;}
.fixed_header_wrap .menu_icon > span:after{content:""; position: absolute; width:100%; height:100%; background-color:#000; top:7px; left:0;}

.sub .fixed_header_wrap{display: none;}

/* sub fixed gnb */
.sub_fixed_header_wrap{position: fixed; width: auto; top:0px; right:0; z-index: 9; padding-left: 20px; padding-right: 20px; transform:translateY(-100%); transition: all 0.4s; transition-delay: 0s;}
.sub_fixed_header_wrap.fixed{transform:translateY(0);}
.sub_fixed_header_wrap .menu_icon_con{float:right; padding:25px 19px; background-color: #e8f7fc; border-radius: 50%; margin-top: 30px;}
.sub_fixed_header_wrap .menu_icon{display:block; position: relative; width:29px; height:17px;}
.sub_fixed_header_wrap .menu_icon > span{position: absolute; width:100%; height:3px; background-color:#6d13ff; top:50%; left:0px; transform: translateY(-50%);}
.sub_fixed_header_wrap .menu_icon > span:before{content:""; position: absolute; width:100%; height:100%; background-color:#6d13ff; top:-8px; left:0;}
.sub_fixed_header_wrap .menu_icon > span:after{content:""; position: absolute; width:100%; height:100%; background-color:#6d13ff; top:8px; left:0;}

.main .sub_fixed_header_wrap{display: none;}

@media all and (min-width: 992px){
    .header_wrap{height: 150px;}
    .sub .header_wrap{width: 100%; left:0; padding-top: 0; padding-left: 0; padding-right: 0; margin-top:0 !important;}

    .header_wrap .gnb_container{display: block; height: 80px;}
    .header_wrap .guide_open_btn_con{position: relative; bottom:0; right: 0;}
    .header_wrap .guide_open_btn{display: table; width: 52px; height: 40px; border-radius: 0; border-top-left-radius: 20px; border-bottom-left-radius: 20px;
        background-image:none; box-shadow: none;}
    .theme .header_wrap .guide_open_btn{width:98px;}
    .header_wrap .guide_open_btn_inner{display: table-cell; vertical-align: middle; font-size:0; line-height:0; text-align: left; padding-left:18px;}
    .theme .header_wrap .guide_open_btn_inner{text-align: right; padding-left:24px; padding-right:14px;}
    .theme .header_wrap .guide_open_btn_con:hover .guide_open_btn_inner{padding-left:0; padding-right:20px;}
    .header_wrap .guide_open_btn_con:hover .guide_open_btn{width:133px;}
    .header_wrap .guide_open_btn_con .guide_open_text_con{font-size:0; line-height:0; overflow: hidden; white-space: nowrap;}
    .header_wrap .guide_open_btn_con .guide_open_text_inner{margin-right:-69px; overflow: hidden;}
    .theme .header_wrap .guide_open_btn_con .guide_open_text_inner{margin-right:0; margin-left:-37px;}
    .theme .header_wrap .guide_open_btn_con:hover .guide_open_text_inner{margin-left:0;}
    .header_wrap .guide_open_btn_con .guide_open_arrow{display:inline-block; vertical-align: middle; margin-bottom:4px; margin-right:11px;}
    .header_wrap .guide_open_btn_con .guide_open_text{font-size: 13px; font-size: 1.3rem; line-height: 19px; line-height: 1.9rem; letter-spacing: -0.02em; font-weight: 400; color: #fff;
        display:inline-block; vertical-align: middle;}

    .header_wrap .menu_container{position: absolute; float:left; display: flex; align-items: center; justify-content: center; height: 80px; top:0px; right: 40px;}

    .header_wrap .menu_icon_con{float:left; margin-top: 0; margin-bottom: 0;}
    .main .header_wrap{padding-top: 52px;}
    .main .header_wrap .menu_icon:hover > span{background-color: #7b7efe;}
    .main .header_wrap .menu_icon:hover > span:before{background-color: #7b7efe;}
    .main .header_wrap .menu_icon:hover > span:after{background-color: #7b7efe;}

    .header_wrap .header_contents_inner{display: block;}
    .header_wrap .header_top_container .menu_icon_con{display: none;}

    .header_wrap .member_img_con{display: block;}
    .header_wrap .member_id_con{display: block;}

    /* main */
    .main .header_wrap .gnb_container{width: calc(100% - 95px); padding-left: 60px; padding-right: 37px;}
    .main .header_wrap .logo_con .logo > img{width: auto;}
    .main .header_wrap .menu_container{top:52px; right: 60px;}
    .main .header_wrap .header_util_list_wrap{display: block;}
    .main .header_wrap .header_top_container{padding-right: 54px; margin-top: 42px;}

    /* 클릭 gnb */
    .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 .logo_wrap{margin-bottom: 82px;}
    .click_header_wrap .logo_box{width: auto; padding: 0;}
    .click_header_wrap .logo_box .close_menu{display: none;}
    .click_header_wrap .logo_box .m_logo{display: none;}
/*    .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 img{width:281px;}*/
    .click_header_wrap .logo_box .close_menu > img{width: 24px; height: 24px;}
    .click_header_wrap .header_fixed_menu_box{position: absolute; width: auto; top:3px; left:253px; background-color: transparent; margin-bottom: 0; padding:0;}
    .click_header_wrap .gnb_wrap > li:nth-child(4){padding-right: 0px;}
    .click_header_wrap .gnb_wrap > div > ul{width:calc(100% + 30px); margin-left: -30px;}
    .click_header_wrap .gnb_wrap > div > ul > li{display: inline-block; width:20%; padding-left: 30px; 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:#7b7efe;}*/
    .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%; border-color:#7b7efe;}
    .click_header_wrap .gnb_wrap > div > ul > li.active > a{color:#7b7efe;/* border-color: #fff;*/}

    .click_header_wrap .gnb_wrap > div > ul > li > a{padding-bottom:15px; margin-bottom: 24px; 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 #fff; transition:all .3s;}
    .click_header_wrap .gnb_wrap > div > ul > li > a:after{display: none;}
    .click_header_wrap .gnb_wrap > div > ul > li.list_on > a{width: 200px;}
    .click_header_wrap .gnb_wrap > div > ul > li > a > span{display: inline; background-color: transparent; padding-right: 0;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li{font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.01em; font-weight: 300; margin-bottom: 6px;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li:hover > a{color:#7b7efe;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li.active > a{color:#7b7efe;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > a{display:inline-block; padding-top: 0; padding-right:10px; transition:all .3s;}
    .click_header_wrap .gnb_wrap > div > ul > li:last-child > ul{transform:translateY(2px);}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul{padding-top: 6px; padding-bottom: 13px;} /*3depth*/
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li{margin-bottom: 7px;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li > a{padding-left: 13px; transition: all 0.2s ease;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li > a::after{top:10px; width:5px; border-bottom:1px solid #fff;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li:hover > a{color:#7b7efe;}
    .click_header_wrap .gnb_wrap > div > ul > li > ul > li > ul > li:hover > a::after{border-color:#7b7efe;}

    .click_header_close_con{display: inline-block;}
    .click_header_wrap .header_util_list_wrap .header_util_list{margin-right: 29px;}
    .click_header_wrap .header_util_list_wrap .header_util_list:first-child{padding-right: 0;}
    .click_header_wrap .header_util_list_wrap .header_util_list:first-child::after{border-left:none;}
    .click_header_wrap .header_util_list_wrap .header_util_list:last-child{margin-right: 0;}
    .click_header_wrap .header_util_list_wrap .header_util_list > a{padding-right: 19px;
        font-size:15px; font-size:1.5rem; line-height:21px; line-height:2.1rem; letter-spacing: -0.01em;
        background-image: url("../img/new/btn_style_8_type_2_arrow.png"); background-repeat: no-repeat; background-position: right center;}
    .click_header_wrap .header_video_con{display: none;}
    .click_header_close_con:hover{opacity: 1;}


    .fixed_header_wrap .fixed_menu_con{display: block;}
    .fixed_header_wrap .fixed_menu_list > li:hover > a{color:#6d13ff;}
    .fixed_header_wrap .header_util_list_con > li:hover > a{background-image: url('../img/new/header_util_right_arrow.png'); padding-right: 16px; background-size: 6px 11px;}

    .sub_fixed_header_wrap{display: none;}



    /* guide_container */
    .guide_close_btn_con .guide_close_btn:hover{margin-right: 0; background-position: right 14px center;}
    .guide_container .guide_list > li:hover > a.contents_desc{color:#6d13ff; /*font-weight: 500;*/ font-weight: 400;}
    .guide_container .guide_list > li:hover::after{border-color:#6d13ff;}
    .guide_container .guide_swiper .swiper-slide{cursor: pointer;}
    .guide_container .guide_swiper .swiper-slide:hover .contents_sub_title{color:#6d13ff;}
    .guide_container .contents_box:last-child{padding-bottom: 70px;}

}

@media all and (min-width:1280px){
    .header_wrap{height: auto; background-color: transparent;}

    .header_wrap .gnb_top_con{display: block; height: auto;}
    .header_wrap .gnb_wrapper{width: 100%; margin-bottom: 50px;}
    .header_wrap .gnb_wrap > li{text-align: center; margin-bottom: 15px; padding-right: 0;}
    .header_wrap .gnb_wrap > li:nth-child(1){display: block;}
    .header_wrap .gnb_wrap > li:nth-child(2){display: block;}
    .header_wrap .gnb_wrap > li:nth-child(3){display: block;}
    .header_wrap .gnb_wrap > li:nth-child(4){display: block; margin-bottom: 0;}
    .header_wrap .gnb_wrap > li > a{font-size:18px; font-size:1.8rem; line-height:24px; line-height:2.4rem;}
    .header_wrap .logo_con .web{display: inline;}
    .header_wrap .logo_con .mobile{display: none;}
    .header_wrap .header_util_list_wrap{width: 100%;}
    .header_wrap .header_util_list{display: block; padding-top: 14px; padding-bottom: 14px; padding-right: 0;}
    .header_wrap .header_util_list:after{content: ''; position: absolute; bottom: 0; left:0; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.2);}
    .header_wrap .gnb_bottom_con{display: block;}

    .header_wrap .menu_container{display: none; justify-content: flex-end; width:100%; height: 40px; top:85px; right: 0px; padding-left: 158px;}
    .header_wrap .menu_icon > span{background-color:#000;}
    .header_wrap .menu_icon > span:before{background-color:#000;}
    .header_wrap .menu_icon > span:after{background-color:#000;}

    .header_wrap .header_contents_inner{position: absolute; float:left; padding-left: 158px; bottom:auto; height:250px;}
    .header_wrap .header_top_container{height: auto; padding-right: 0px; margin-top: 85px;}
    .header_wrap .header_top_container .btn_style_1_con{display: inline-block; margin-right: 27px;}
    .header_wrap .header_top_container .menu_icon_con{display: block; margin-right: 30px;}

    .header_wrap .member_id_con{margin-right: 15px;}

    .header_wrap .guide_container{width: 318px;}

}

@media all and (min-width:1600px){

}

@media all and (min-width:1920px){
    .header_wrap .menu_icon_con{}
    .header_wrap .header_contents_inner{padding-left: 188px; padding-right: 318px;}
    .header_wrap .header_top_container{max-width: calc(1344px - 50px);}
    .theme .header_wrap .header_top_container{max-width: calc(1654px - 50px);}
    .header_wrap .header_top_container .btn_style_1_con{margin-right: 30px;}
    .header_wrap .guide_container{width: 318px; transform: translateX(0);}

    /* guide_container */
    .header_wrap .guide_open_btn_con{display:none;}
    /*.guide_container .guide_container_inner{padding-right: 45px; padding-left: 45px;}*/
    .guide_container .title_con{padding-right: 45px; padding-left: 45px;}
    .guide_container .guide_contents_inner{padding-right: 45px; padding-left: 45px;}
    .guide_close_btn_con{display: none;}

}

@media all and (min-width:2560px){
    .header_wrap .header_contents_inner{padding-left: 218px; padding-right: 388px;}
    .header_wrap .header_top_container{max-width: none; margin-top: 85px;}
    .header_wrap .header_top_container .menu_icon_con{margin-right: 70px;}
    .theme .header_wrap .header_top_container{max-width: none;}
    .header_wrap .guide_container{width: 388px;}

    /* guide_container */
   /* .guide_container .guide_container_inner{padding-right: 55px; padding-left: 55px;}*/
    .guide_container .title_con{padding-right: 55px; padding-left: 55px;}
    .guide_container .guide_contents_inner{padding-right: 55px; padding-left: 55px;}
}