@charset "UTF-8";

/* HEADER */

.ico-count {display: block; position: absolute; top: 0; right: 0; width: 16px; height: 16px; line-height: 15px; background-color: #ef300a; border-radius: 50%; font-size: 0.75rem; font-weight: 400; letter-spacing: -0.012rem; color: #fff; text-align: center;}

header {position: fixed; top: 0; left: 0; width: 100%; height: 120px; background-color: #fff; border-bottom: 1px solid #e4e4e4; z-index: 10;}
header.hide {top: -121px;}
header .header-wrap{/*position: relative;*/max-width: 1596px; height: 100%; margin: 0 auto;}
header .header-wrap h1 {float: left; font-size: 0; padding-top: 29px;}
header .header-wrap h1 a {display: block; width: 130px; padding: 20px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.pa-platform header .header-wrap h1 a{width: 163px;}
header .header-wrap .gnb-wrap {float :left; font-size: 1.125rem;}
/*.pa-expert header .header-wrap h1 + .gnb-wrap {margin-left: 61px;}*/
.pa-center header .header-wrap,
.pa-platform header .header-wrap{position: relative;text-align: left;}
/*.pa-center header .header-wrap h1{position: absolute;left: 00px;top: 0;}*/
/*.pa-center header .header-wrap .gnb-wrap{display: inline-block;float: none;width: 100%;margin-left: 0;}*/
/*.pa-center header .header-wrap .gnb-wrap {display: inline-block}*/
/*.pa-center header .header-wrap .right-wrap{position: absolute;right: 0px;top: 0;}*/
/*.pa-center header .header-wrap .gnb-wrap .gnb > li{display: inline-block;float: none;}*/

/*
.pa-center header .header-wrap .gnb-wrap .gnb > li.menu01{width: 185px;}
.pa-center header .header-wrap .gnb-wrap .gnb > li.menu02{width: 146px;}
.pa-center header .header-wrap .gnb-wrap .gnb > li.menu03{width: 158px;}
.pa-center header .header-wrap .gnb-wrap .gnb > li.menu04{width: auto;}
*/

header .header-wrap .gnb-wrap .gnb {float: left; width: 100%;}
header .header-wrap .gnb-wrap .gnb > li {float: left; position: relative; text-align: left; padding: 30px 0px 26px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease;}
/*
header .header-wrap .gnb-wrap .gnb > li.menu01 {width: 209px;}
header .header-wrap .gnb-wrap .gnb > li.menu02 {width: 152px;}
header .header-wrap .gnb-wrap .gnb > li.menu03 {width: 163px;}
header .header-wrap .gnb-wrap .gnb > li.menu04 {width: 174px;}
header .header-wrap .gnb-wrap .gnb > li.menu05 {width: 120px;}
*/

/*
.pa-platform header .header-wrap .gnb-wrap .gnb > li{padding-left: 50px;padding-right: 50px;}
.pa-platform header .header-wrap .gnb-wrap .gnb > li.menu01{width: auto;padding-left: 0;}
.pa-platform header .header-wrap .gnb-wrap .gnb > li.menu02{width: auto;}
.pa-platform header .header-wrap .gnb-wrap .gnb > li.menu03{width: auto;}
.pa-platform header .header-wrap .gnb-wrap .gnb > li.menu04{width: auto;padding-right: 0;}
*/



header .header-wrap .gnb-wrap .gnb .depth01{display: inline-block; text-align: left; padding: 20px 0;}
header .header-wrap .gnb-wrap .gnb .depth01 span {display: inline-block; position: relative; line-height: 1;  font-weight: 400; color: #000; letter-spacing: -0.025rem;}
header .header-wrap .gnb-wrap .gnb .depth01 span::before,
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a span::before {content: ''; display: inline-block; position: absolute; top: 4px; right: -6px; width: 6px; height: 6px; background-color: #ef300a; border-radius: 50%; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; -webkit-transform: rotate(0deg) scale(0); -ms-transform: rotate(0deg) scale(0); -o-transform: rotate(0deg) scale(0); transform: rotate(0deg) scale(0); -webkit-transform-origin: right top; -moz-transform-origin: right top; -ms-transform-origin: right top; -o-transform-origin: right top; transform-origin: right top; -webkit-transform-style: preserve-3D; -moz-transform-style: preserve-3D; -ms-transform-style: preserve-3D; transform-style: preserve-3D; opacity: 0;}
header .header-wrap .gnb-wrap .gnb .depth01:hover span::before,
header .header-wrap .gnb-wrap .gnb .depth01.active span::before,
header .header-wrap .gnb-wrap .gnb > li.onmouse .depth01 span::before,
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a:hover span::before {-webkit-transform: rotate(-200deg) scale(1); -ms-transform: rotate(-200deg) scale(1); -o-transform: rotate(-200deg) scale(1); transform: rotate(-200deg) scale(1); opacity: 1;}
header .header-wrap .gnb-wrap .gnb .depth02 {opacity: 0; position: absolute; top: 100px; left: 0; width: 100%; line-height: 1; font-size: 0.875rem; padding-top: 19px;}
header .header-wrap .gnb-wrap .gnb .depth02 li {padding: 11px 0; text-align: left;}
header .header-wrap .gnb-wrap .gnb .depth02 li a {display: inline-block; text-align: left; font-weight: 400; color: #000; letter-spacing: -0.025rem;}
/*
.pa-platform header .header-wrap .gnb-wrap .gnb .depth02 li a{padding-left: 50px;}
.pa-platform header .header-wrap .gnb-wrap .gnb .menu01 .depth02 li a{padding-left: 0;}
*/
header .header-wrap .gnb-wrap .gnb .depth02 li a:hover {color: #ef300a;}
header .header-wrap .right-wrap {float: right;}
header .header-wrap .right-wrap .input-wrap {float: left; padding-top: 37px;}
header .header-wrap .right-wrap .input-wrap .input-search {width: 228px;}
header .header-wrap .right-wrap .input-wrap + .profile-wrap {margin-left: 35px; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease;}
header .header-wrap .right-wrap .profile-wrap {float: right;}
header .header-wrap .right-wrap .profile-wrap .profile {position: relative; padding-right: 28px; margin-top: 35px;}
header .header-wrap .right-wrap .profile-wrap .profile .user-profile {position: relative; display: block;}
header .header-wrap .right-wrap .profile-wrap .profile .user-profile::before {content: ''; display: inline-block; position: absolute; top: 50%; right: -28px; width: 11px; height: 6px; background-image: url(../images/common/profile_arrow.png); background-repeat: no-repeat; background-position: 0 0; -webkit-transition: transform 0.2s ease-in-out; -o-transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out;}
header .header-wrap .right-wrap .profile-wrap.active .profile .user-profile::before {-webkit-transform: rotate(180deg);-ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
header .header-wrap .right-wrap .profile-wrap .profile .user-profile .ico-count {right: -4px;}
header .header-wrap .right-wrap .profile-wrap .profile img.profile-img {display: block; width: 51px; height: 51px; border: 1px solid #e4e4e4; border-radius: 50%; vertical-align: top;}
header .header-wrap .right-wrap .profile-wrap .profile .user-name {display: none;}
header .header-wrap .right-wrap .profile-wrap .profile .list-box {display: none; position: absolute; top: 60px; right: 0; width: 138px; background-color: #fff; border: 1px solid #e4e4e4; border-radius: 8px; padding: 3px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
header .header-wrap .right-wrap .profile-wrap.active .profile .list-box {display: block;}
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li {height: 40px; line-height: 40px;}
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a {display: block; position: relative; width: 100%; height: 100%; font-size: 0.875rem; font-weight: 400; letter-spacing: -0.025rem; color: #000; text-align: left; padding-left: 20px;}
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a:hover {background-color: #f4f4f4;}
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a span {position: relative; display: inline-block;}
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a:hover span::before {opacity: 0;}
header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a .ico-count {position: relative; top: 0px; display: inline-block; margin-left: 4px; }
header .header-wrap .right-wrap .login-area{float: right;padding-top: 47px;padding-left: 10px;}
header .header-wrap .right-wrap .login-area > a{display: inline-block;}
header .header-wrap .right-wrap .login-area .log-in{font-size: 0.875rem;color: #ef300a;line-height: 1;}
header .header-wrap .right-wrap .login-area .join{font-size: 0.875rem;color: #000;line-height: 1;}
header .header-wrap .right-wrap .login-area .join::before{content: '';display: inline-block;width: 1px;height: 10px;margin-left: 11px;margin-right: 13px;background-color: #b2b2b2;}


header .open-gnb {display: none; position: absolute; left: 30px; top: 25px; width: 20px; height: 15px; background:url(../images/common/ico_gnb.png) no-repeat 0 0; background-size: 20px 15px; text-indent: -9999px; overflow: hidden;}
header .close-gnb {display: none; position: absolute; right: 30px; top: 24px; width: 18px; height: 18px; background: url('../images/common/ico_close.png') no-repeat 0 0; background-size: 18px 18px; text-indent: -9999px; overflow: hidden;}

.depth02-bg {display: none;position: fixed; left: 0; top: 120px; width: 100%; height: auto; background-color: #fff; border-bottom: 1px solid #e4e4e4; overflow: hidden; z-index: 9;}
.depth02-bg .inner {position: relative; max-width: 1596px; height: 100%; margin: 0 auto;}
.depth02-bg .inner .img-box {position: absolute; right: 0; top: 50%; width: 422px; height: 155px; background: #f4f4f4;}
.pa-center .depth02-bg .inner .img-box{display: none;}

body.mobile-gnb,
body.mobile-profile{position: relative; height: 100%; overflow-y: hidden; touch-action: none;}



@media only screen and (min-width:1920px){
    header .header-wrap .gnb-wrap .gnb {padding-left: 200px;}
}

@media only screen and (max-width:1720px){
    header .header-wrap {padding: 0 60px;}
/*    .pa-platform header .header-wrap .gnb-wrap .gnb > li{padding-left: 40px;padding-right: 40px;}*/
    .depth02-bg .inner {padding: 0 60px;}
    .depth02-bg .inner .img-box {right: 60px;}
}

@media only screen and (min-width:1440px) and (max-width:1920px){
    header .header-wrap .gnb-wrap .gnb {padding-left: 150px;}
}

@media only screen and (min-width:1440px) {
    header .header-wrap .gnb-wrap {min-width: calc(100% - (140px + 400px));}
}

@media only screen and (min-width:1281px) and (max-width:1440px){
    header .header-wrap .gnb-wrap {min-width: calc(100% - (140px + 320px));}
    header .header-wrap .gnb-wrap .gnb {padding-left: 80px;}
}

@media only screen and (max-width:1596px){
/*
    header .header-wrap .gnb-wrap .gnb > li.menu01,
    header .header-wrap .gnb-wrap .gnb > li.menu02,
    header .header-wrap .gnb-wrap .gnb > li.menu03,
    header .header-wrap .gnb-wrap .gnb > li.menu04,
    header .header-wrap .gnb-wrap .gnb > li.menu05 {width: auto;}
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu01,
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu02,
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu03,
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu04,
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu05 {width: auto;}
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu04 {padding-right: 0 !important;}

    header .header-wrap .gnb-wrap .gnb > li {padding-left: 0;}
    .pa-platform header .header-wrap .gnb-wrap .gnb > li{padding-left: 0;}
    header .header-wrap .gnb-wrap .gnb .depth02 li a {padding-left: 0; padding-right: 0;}
    .pa-platform header .header-wrap .gnb-wrap .gnb .depth02 li a{padding-left: 0;}
*/
    header .header-wrap .right-wrap .input-wrap + .profile-wrap {margin-left: 15px;}
}

@media only screen and (min-width:1281px) and (max-width:1596px){
/*
    header .header-wrap .gnb-wrap .gnb > li {padding-right: 4.688vw;}
    .pa-platform header .header-wrap .gnb-wrap .gnb > li {padding-right: 3.5vw;}
    header .header-wrap .gnb-wrap .gnb > li.menu04 {padding-right: 6.042vw;}
*/
    header .header-wrap .right-wrap .input-wrap + .profile-wrap {margin-left: 15px;}
}

@media only screen and (max-width:1440px){
    header .header-wrap .right-wrap .input-wrap .input-search {width: 160px; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease;}
    .depth02-bg .inner .img-box {width: 21.531vw; /* height: 8.073vw; */}
    header .header-wrap .right-wrap .login-area{padding-left: 20px;}
}

@media only screen and (min-width:1281px){
/*    .pa-center header .header-wrap .gnb-wrap {transform: translateX(50%);}*/
/*    .pa-platform header .header-wrap .gnb-wrap {transform: translateX(50%);}*/
}

@media only screen and (min-width:961px) and (max-width:1280px){
    header .header-wrap .gnb-wrap {width: calc(100% - (140px + 150px)); font-size: 1.063rem;}
    header .header-wrap .gnb-wrap .gnb {padding-left: 50px;}
/*
    header .header-wrap .gnb-wrap .gnb > li {padding-right: 5%;}
    .pa-center header .header-wrap .gnb-wrap .gnb > li {padding-right: 12%;}
    .pa-platform header .header-wrap .gnb-wrap .gnb > li{padding-right: 12%;}
*/
/*    header .header-wrap .gnb-wrap .gnb > li.menu04 {padding-right: 10%;}*/
    header .header-wrap .right-wrap .input-wrap + .profile-wrap {margin-left: 0;}
    header .header-wrap .right-wrap .input-wrap {display: none;}
    header .header-wrap .right-wrap .login-area {padding-left: 0;}
/*    .pa-expert header .header-wrap h1 + .gnb-wrap {margin-left: 5.556vw;}*/
    .depth02-bg .inner .img-box {display: none;}
/*    header .header-wrap .right-wrap .login-area{position: absolute;right: 60px;top: 0;}*/
    
}

@media only screen and (max-width:1035px){
    header .header-wrap .gnb-wrap {font-size: 1rem;}
}

@media only screen and (min-width:960px){
    header .header-wrap {display: flex; flex-direction: row; justify-content: space-between;}
    header .header-wrap .gnb-wrap .gnb{display: flex; flex-direction: row;}
    header .header-wrap .gnb-wrap .gnb > li {flex: 1;}
/*
    .pa-center header .header-wrap .gnb-wrap .gnb{float: none; display: inline-flex; justify-content: center;}
    .pa-platform header .header-wrap .gnb-wrap .gnb{float: none; display: inline-flex; justify-content: center;}
*/
    .depth02-bg .inner .img-box {transform: translateY(-50%);}
    header.hide .header-wrap .gnb-wrap .gnb .depth02 {display: none !important; top: 0 !important; height: 0 !important; opacity: 0 !important;}
header.hide + .depth02-bg{ display: none !important; top: 0 !important;}
}

@media only screen and (max-width:960px){
    header {height: 65px;}
    header.hide {top: -65px;}
    header .ico-count{display: none;}
    header .header-wrap h1 {float: none; text-align: center; padding-top: 24px;}
    .pa-center header .header-wrap h1{position: static;left: auto;top: auto;}
    .pa-expert header .header-wrap h1{position: static;left: auto;top: auto;}
    header .header-wrap h1 a {display: inline-block; width: auto; padding: 0;}
    .pa-center header .header-wrap h1 a{width: 100px;height: 21px;background: url('../images/common/logo_03_m.png') 0 0 no-repeat;-webkit-background-size: 100px auto;background-size: 100px auto;}
    .pa-expert header .header-wrap h1 a{width: 100px;height: 21px;background: url('../images/common/logo_04_m.png') 0 0 no-repeat;-webkit-background-size: 100px auto;background-size: 100px auto;}
    header .header-wrap h1 a img {width: 32px; height: 32px;margin-top: -7px;}
    .pa-center header .header-wrap h1 a img{display: none;}
    .pa-expert header .header-wrap h1 a img{display: none;}
    .pa-platform.main header .header-wrap h1 a{ display:none;width: 125px; height: 18px;background: url(../images/common/logo_0.png) 0 0 no-repeat;-webkit-background-size: 125px auto;background-size: 125px auto;}
    .pa-platform.main header .header-wrap h1 a img{display: none;}
    header .header-wrap h1 + .gnb-wrap {margin-left: 0 !important;}
    header .header-wrap .gnb-wrap {position: fixed; top: 0; left: -100%; width: 100%; height: 100%; background-color: #fff; font-size: 1rem; /* padding-bottom: 150px; */ -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; z-index:2;}
    .mobile-gnb header .header-wrap .gnb-wrap {left: 0;}
    header .header-wrap .gnb-wrap .gnb {float: none; width: 100%; height: 100%; border-top: 1px solid #e4e4e4; margin-top: 65px; padding-top: 185px;/*padding-top: 132px;*/ padding-bottom: 150px; overflow-y: scroll;}
    header.after-login .header-wrap .gnb-wrap .gnb{padding-top: 132px;}
    .pa-center header .header-wrap .gnb-wrap .gnb,
    .pa-platform header .header-wrap .gnb-wrap .gnb{padding-top: 58px;}
    .pa-center header.after-login .header-wrap .gnb-wrap .gnb,
    .pa-platform header.after-login .header-wrap .gnb-wrap .gnb{padding-top: 24px;}
    header .header-wrap .gnb-wrap .gnb > li,
    .pa-platform header .header-wrap .gnb-wrap .gnb > li {display: block; width: 100% !important; padding: 13px 30px;}
    .pa-platform header .header-wrap .gnb-wrap .gnb > li.menu01{display: block;
    width: 100% !important;
    padding: 13px 30px;}
    header .header-wrap .gnb-wrap .gnb .depth01 {padding: 0;}
    header .header-wrap .gnb-wrap .gnb > li a {background-repeat: no-repeat; background-position: 0 center; background-size: 24px 24px;}
    header .header-wrap .gnb-wrap .gnb .depth01.active span::before,
    header .header-wrap .gnb-wrap .gnb .depth01:hover span::before,
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a:hover span::before{width: 5px; height: 5px;}
    header .header-wrap .gnb-wrap .gnb .depth02 {display: none; opacity: 1; position: relative; top: 0; height: auto; font-size: 0.938rem; padding-top: 15px; padding-bottom: 18px;}
    .mobile header .header-wrap .gnb-wrap .gnb .depth02 {}
    header .header-wrap .gnb-wrap .gnb .depth02 li {padding: 15px 54px;}
    header .header-wrap .gnb-wrap .gnb .depth02 li a {padding: 0;}
    /* header .header-wrap .gnb-wrap .gnb > li.menu01 > a {background-image: url('../images/common/ico_gnb_contents.png');}
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu01 > a {background-image: url('../images/common/ico_gnb_center.png');}
    header .header-wrap .gnb-wrap .gnb > li.menu02 > a {background-image: url('../images/common/ico_gnb_community.png');}
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu02 > a {background-image: url('../images/common/ico_gnb_contents_02.png');}
    header .header-wrap .gnb-wrap .gnb > li.menu03 > a {background-image: url('../images/common/ico_gnb_academy.png');}
    header .header-wrap .gnb-wrap .gnb > li.menu04 > a {background-image: url('../images/common/ico_gnb_people.png');}
    .pa-center header .header-wrap .gnb-wrap .gnb > li.menu04 > a {background-image: url('../images/common/ico_gnb_customer.png');}
    header .header-wrap .gnb-wrap .gnb > li.menu05 > a {background-image: url('../images/common/ico_gnb_customer.png');} */
    header .header-wrap .right-wrap {float: none;}
    .pa-center header .header-wrap .right-wrap{position: static;right: auto;top: auto;}
    header .header-wrap .right-wrap .input-wrap {position: absolute; top: 15px; left: -100%; padding-top: 0;  z-index: 2; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease;}
    .mobile-gnb header .header-wrap .right-wrap .input-wrap {left: 30px;}
    header .header-wrap .right-wrap .input-wrap + .profile-wrap {margin-left: 0;}
    header .header-wrap .right-wrap .input-wrap .input-search {width: 207px;}
    header .header-wrap .right-wrap .profile-wrap {float: none; position: fixed; top: 0; left: -100%; width: 100%; height: 100%; background-color: #fff; margin-left: 0; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; z-index: 1;}
    header .header-wrap .right-wrap .profile-wrap .profile {padding-right: 0; margin-top: 0;}
    header .header-wrap .right-wrap .profile-wrap .profile .user-profile::before {display: none;}
    header .header-wrap .right-wrap .profile-wrap .profile .user-profile {position: fixed; top: 12px; right: 29px; transition: all 0.5s ease 0s;}
    header.hide .header-wrap .right-wrap .profile-wrap .profile .user-profile {top: -65px;}
    header .header-wrap .right-wrap .profile-wrap .profile img.profile-img {width: 43px; height: 43px;}
    header .header-wrap .right-wrap .profile-wrap.active .profile .list-box {display:block !important; opacity: 1 !important; top: 0px !important; width: 100%; height: 100%; top: 0; border: none; border-radius: 0; margin-top: 65px; border-top: 1px solid #e4e4e4; padding: 0; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease;}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li {height: auto; padding: 16px 30px;}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a {background-repeat: no-repeat; background-position: 0 100%; background-size: 21px 20px; line-height: 1.25rem; font-size: 1rem; letter-spacing: -0.012rem; padding-left: 0;}
    /* header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li.profile-mypage a {background-image: url('../images/common/ico_profile_mypage.png')}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li.profile-write a {background-image: url('../images/common/ico_profile_write.png')}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li.profile-message a {background-image: url('../images/common/ico_profile_message.png')}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li.profile-contents a {background-image: url('../images/common/ico_profile_contents.png')}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li.profile-inquiry a {background-image: url('../images/common/ico_profile_inquiry.png')}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li.profile-apply a {background-image: url('../images/common/ico_profile_apply.png')}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li.profile-change a {background-image: url('../images/common/ico_profile_change.png')} */
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a:hover{background-color: #fff;}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a:active span::before,
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a:focus span::before{opacity: 1;}
    header .header-wrap .right-wrap .profile-wrap .profile .list-box ul li a .ico-count {display: none;}
    header .header-wrap .right-wrap .profile-wrap .profile .user-name  {display: none; line-height: 65px; padding-left: 30px; font-size: 1rem;}

    header .header-wrap .right-wrap .login-area{display: none;float: none;position: fixed;left: 0; width: 100%; background-color: #fff; padding-left: 30px; padding-top: 23px; padding-bottom: 26px; margin-top: 24px; -webkit-transition: 0.3s ease;-o-transition: 0.3s ease;transition: 0.3s ease;z-index: 20;}
    .mobile-gnb header {z-index: 100;}
    .mobile-gnb header .header-wrap .right-wrap .login-area{display: block; text-align: left;}


    .mobile header .header-wrap .right-wrap .profile-wrap.active {left:0;}
    .mobile header .header-wrap .right-wrap .profile-wrap.active .profile {left: 0;}
    .mobile header .header-wrap .right-wrap .profile-wrap.active .profile .user-name {display: block;text-align: left;}
    .mobile header .header-wrap .right-wrap .profile-wrap.active .profile .user-profile {display: none;}
    .mobile header .header-wrap .right-wrap .profile-wrap.active .profile .list-box{display:block;padding-top: 21px;}

    header .open-gnb {display: block;}
    .mobile header .close-gnb,
    .mobile header .profile-wrap.active .close-gnb {display: block;}

    .mobile .mobile-gnb {height: 100%; overflow: hidden;}

    .mobile .depth02-bg {display: block; top: 139px; /*top: 85px;*/ left: -100%; height: auto;  border-bottom: none; padding: 0 30px; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; z-index: 10;}
    .mobile .after-login + .depth02-bg{top: 85px;}
    .mobile .mobile-gnb .depth02-bg {left: 0;  height: auto !important;}
    .mobile .depth02-bg .inner {width: 100%; padding: 0;}
    .mobile .depth02-bg .inner .img-box {opacity: 0; position: relative; top: 0; width: 100%; height: 90px; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; -ms-transition: 0.3s ease;}
    .mobile .mobile-gnb .depth02-bg .inner .img-box {opacity: 1; right: auto; left: 0;}
    

    /* gnb icon*/
    header .gnb .ico ,
    header .profile .ico {width: 24px; height: 24px; background-size: cover; background-repeat: no-repeat; background-position: 0 0; margin-right: 8px; vertical-align: -6px;}

    header .ico.pa-check {background-image: url('../images/common/ico_pa-check.png');}
    header .ico.pa-timer {background-image: url('../images/common/ico_pa-timer.png');}
    header .ico.wellness {background-image: url('../images/common/ico_wellness.png');}
    header .ico.pa-customer {background-image: url('../images/common/ico_pa-customer.png');}
    header .ico.pa-platform {background-image: url('../images/common/ico_pa-platform.png');}
    header .ico.pa-center {background-image: url('../images/common/ico_pa-center.png');}

    header .ico.pa-platform-intro {background-image: url('../images/common/ico_pa-platform-intro.png');}
    header .ico.pa-contents {background-image: url('../images/common/ico_pa-contents.png');}
    header .ico.pa-channel {background-image: url('../images/common/ico_pa-channel.png');}

    header .ico.dashboard {background-image: url('../images/common/ico_dashboard.png');}
    header .ico.message {background-image: url('../images/common/ico_message.png');}
    header .ico.my-profile {background-image: url('../images/common/ico_myprofile.png');}
    header .ico.my-contents {background-image: url('../images/common/ico_my-contents.png');}
    header .ico.fin-onoff {background-image: url('../images/common/ico_fitonoff.png'); background-size: 19px auto; background-position: 50% 50%;}
    header .ico.diary {background-image: url('../images/common/ico_diary.png');}
    header .ico.my-inquiry {background-image: url('../images/common/ico_my-inquiry.png');}
    header .ico.logout {background-image: url('../images/common/ico_logout.png');}
}