/*-----기본-----*/
html{font-size:20px;}
body{font-size:1rem}
.tablet{display:none;}
.mob{display:none;}
#wrap{position:relative; line-height:1.5; overflow:hidden; font-size: .9rem;letter-spacing:-0.03rem;}
#wrap img { border:none; }
#wrap i{vertical-align:inherit;}
/* 아래의 모든 코드는 영역::코드로 사용 */
body::-webkit-scrollbar {
width: 5px; /* 스크롤바의 너비 */
}
body::-webkit-scrollbar-thumb {
height: 30%; /* 스크롤바의 길이 */
background: #2071f8; /* 스크롤바의 색상 */
border-radius: 10px;
}
body::-webkit-scrollbar-track {
background: rgba(255,255, 255, .1); /*스크롤바 뒷 배경 색상*/
}
.word-split{overflow:hidden; opacity:0; }
.word-split.splitting{opacity:1.0; }
.word-split.splitting .word{overflow:hidden; line-height:1.1; display:inline-block;}
.word-split.splitting .char{display:inline-block; position:relative; font-size:inherit; font-family:inherit; font-weight:inherit; opacity:0; }
.word-split.splitting .word{overflow: visible;}
/********************************************************/
#header{position:relative;z-index:99999;background:#fff;}
/**/
#header .header-top{height:3.5rem;}
#header .header-top .header-inn{width:1650px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-end;height:100%;position:relative;}
#header .header-top .header-inn .go-link{margin-bottom:0.35rem;}
#header .header-top .header-inn .go-link a{display: flex; width:24rem; height:2rem; line-height: 2rem; color:#fff; position: relative; font-size:0.9rem; font-weight:600; padding:0 1rem; border-radius: 0.5rem; background: #059fbb;letter-spacing:-0.025em ;justify-content:center;align-items:center;vertical-align: middle;}
#header .header-top .header-inn .go-link a span:nth-child(2):before {content: '|';display: inline-block;color: #fff;width: 1px;font-size: .6rem;height: 1rem;margin: 0 .5rem;position: relative;margin-top: -0.5rem;}
#header .header-top .header-inn .go-link a img{margin-right:0.7rem;}
#header .header-inn #nav {display: flex; flex-direction: row; align-items: center; box-sizing: border-box;}
#header .header-inn #nav ul {clear:both; position:relative; box-sizing:border-box;height:100%;width:100%;display: flex;justify-content: flex-start;}
#header .header-inn #nav ul li { display:inline-block; width: auto; float:none; vertical-align:top;position:relative;}
#header .header-inn #nav > ul > li {position:relative; }
#header .header-inn #nav > ul > li:before{content: '';display: block;position: absolute;left: 0;bottom: 0; width: 0;height: 3px;background-color: var(--blue);transition: width ease-out .2s; z-index:1;}
#header .header-inn #nav ul li.on:before{width:100%;}
#header .header-inn #nav ul li a{text-align:center; color:#333; display:inline-block; height:3.35rem; line-height:3.35rem; position:relative; font-size:1.1rem; font-weight: 700; padding:0 2.8rem;}
#header .header-inn #nav > ul > li.active > div a {color:#2071f8;}
#header .header-inn #nav ul li:first-child a{}
#header .header-inn #nav ul li ul {z-index: 10;display:none; position: absolute; width:100%; left:0; top:3.4rem; padding:1.5rem 0 .5rem; box-sizing:border-box; text-align:center; border-radius: .5rem; height:auto; display: none; animation-name: slide_down; animation-duration:0.5s; animation-duration: linear; animation-direction: alternate; animation-fill-mode: forwards;}
#header .header-inn #nav ul li ul li {display:block; margin:0; margin-bottom:0.8rem; line-height:1.5;}
#header .header-inn #nav ul li ul li a{display:inline-block; font-size:0.95rem; font-weight: 500; padding:0; height:auto; line-height:1.3; transition: all .2s; -webkit-transition: all .2s;position:relative;}
#header .header-inn #nav ul li ul li a:hover{color:#2071f8;}
#header .header-inn #nav ul li > div {text-align:center;}
#header .header-nav .header-inn{width:1650px;margin:0 auto;position:relative; display: flex; align-items: center; justify-content: space-between;}
#header .header-nav .header-inn .log-bx{margin-right:3.25rem; display: flex; align-items: center;}
#header .header-nav .header-inn .log-bx a{display: inline-block; width:4.75rem; height:2rem; line-height:2rem ; border-radius: 0.5rem; background:#eaedf7; color: #2149a6;font-size:0.9rem; font-weight: 500; text-align: center;border:1px solid #eaedf7}
#header .header-nav .header-inn .log-bx a:not(:last-child){margin-right:0.5rem;}
#header .header-nav .header-inn .log-bx a.logout{}
#header .header-nav .header-inn .log-bx a.mypage{ background:#eaedf7; color: #2149a6;}
.member #header .header-nav .header-inn .log-bx a.logout,
.member #header .header-nav .header-inn .log-bx a.mypage{display: inline-block;}
/*로그인 했을때*/
#header .header-nav .header-inn .log-bx .login-after{display:flex; align-items: center;}
#header .header-nav .header-inn .log-bx .login-after .point-bx{font-size:0.9rem;color:#333;font-weight:600;margin-right:1rem;padding-left:1.4rem;background:url(/images/default/content/point-icon.png)no-repeat left center;}
#header .header-nav .header-inn .log-bx .login-after .point-bx em{color:#2071f8;}
#header .header-nav .header-inn .log-bx a.mypage {color:#2149a6;border:1px solid #2149a6;background:#fff;}
/*헤더 호버 했을때*/
#header.over .header-nav:after{content:'';display:block;position:absolute;width:100%;height:1px;background:#ccc;left:0;bottom:0;}
.gnb_bg{display: none; opacity: 0; position: fixed; top: 6.8rem; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); transition: all 0.3s ease-out; z-index: 11;}
.bg_box {display: none; position: absolute; top: 6.8rem; left: 0; z-index:1; width: 100%; height: 18rem;background:#fff bottom+1.5rem right+6rem;border-radius:0 0 2.75rem 0;overflow:hidden;border-top:1px solid #ddd;}
.bg_box:after{content:'';display:block;position:absolute;width:100%;height:4px;background:#2071f8;left:0;bottom:0;}
.bg_box .bg{}
@media (max-width:1650px){
#header .header-nav .header-inn,
#header .header-top .header-inn{width:100%; padding:0 1rem;}
#header .header-nav #nav{width:calc(100% - 25rem);}
#header .header-inn #nav ul li a{padding:0 2rem;}
}
@media (max-width:1300px){
#header .header-inn #nav ul li a{padding:0 1.5rem;}
}
@media (max-width:1200px){
#header .header-inn #nav ul li a{padding:0 1.2rem;}
#header .header-nav #nav{width:calc(100% - 20rem);}
#header .header-nav .header-inn .log-bx .login-after .point-bx{width:5rem;}
#header .header-nav .header-inn .log-bx{margin-right:2rem;}
#header .header-nav .header-inn .log-bx .login-after .point-bx{margin-right:0.5rem;}
}
@media (max-width:1030px){
#header .header-top{height: 3.6rem;}
#header .header-nav #nav,
#header .header-nav .header-inn .log-bx,
#header .header-top .header-inn .go-link{display: none;}
#header .header-top .header-inn{ align-items: center;}
}
/*-----네비게이션-----*/
#header .header_inner #nav {display: flex; flex-direction: row; justify-content: center; align-items: center;}
#header .header_inner #nav{}
#header .header_inner #nav ul {clear:both; position:relative; box-sizing:border-box;height:100%;}
#header .header_inner #nav ul li { display:inline-block;width: auto; float:none; vertical-align:top;position:relative;}
#header .header_inner #nav ul li {position:relative; }
#header .header_inner #nav ul li a{text-align:center; color:#fff; display:inline-block; height:4.3rem; line-height:4.3rem; text-transform: uppercase; position:relative;padding:0 1.85rem; transition: all .2s; -webkit-transition: all .2s; }
#header .header_inner #nav ul li ul {z-index: 10;display:none; position: absolute; width:10rem; left:50%; margin-left:-5rem; top:4rem; padding:1.5rem 0 .5rem; box-sizing:border-box; text-align:center; background:#fff; border: 4px solid #083C6B; border-radius: .5rem; height:auto; display: none; animation-name: slide_down; animation-duration:0.5s; animation-duration: linear; animation-direction: alternate; animation-fill-mode: forwards;}
#header .header_inner #nav ul li ul:before {display: block; content: ''; position: absolute; z-index:0; top:-20px; left: 50%; transform:translateX(-50%); width: 10px; height: 10px; background: #083C6B; border-radius: 100%; z-index: -1;}
#header .header_inner #nav ul li ul li {display:block;margin:0; margin-bottom:13px; line-height:1.5;}
#header .header_inner #nav ul li ul li a{display:block;color:#000; font-size:0.85rem; padding:0; height:auto; font-weight: 400; line-height:1.5; transition: all .2s; -webkit-transition: all .2s;}
#header .header_inner #nav ul li ul li a:before{content:""; display:block; clear:both;}
#header .header_inner #nav ul li ul li a:hover{color:#083C6B; }
#header .header_inner #nav ul li.active > div > a{}
#header .header_inner #nav ul li.active ul li:after{display:none;}
/*-----회원서비스-----*/
.log_menu{position:absolute;right:8rem;top:50%;transform:translateY(-50%); color:#fff; font-size:0.75rem;}
.log_menu li{display:inline-block; margin-right:10px;}
.log_menu li a{color:#fff;}
/*-----언어별-----*/
.select_btn{position:absolute;right:4.5rem;top:50%;transform:translateY(-50%); color:#fff;}
.option_list { display:none; position: absolute; top: 4.3rem; right:4.3rem; z-index:1000; background: #fff; border: solid 1px #d9d9d9; padding: 15px 25px;}
.option_list li { margin-top: 5px;}
.option_list li a { display: block; font-size: 15px; color: #353535;}
.option_list li a:hover { text-decoration: underline !important;}
.option_list li:first-child { margin-top: 0;}
/*-----사이트맵 버튼-----*/
#header .btn-gnb-menu{position:absolute; right:0; top:50%; width:3.25rem; height:1.3rem; cursor:pointer; z-index:9999;text-align:center; -webkit-transition: all 0.25s; transition: all 0.25s; display: flex;transform:translateY(-50%);
justify-content: flex-end;}
#header .btn-gnb-menu.mobAll { display: none; }
#header .btnAll {position:relative; display:block; width:1.6rem; height:1.15rem;top:50%; transform:translateY(-50%);outline: none; z-index:9999; }
#header .btnAll span { display: inline-block; width: 100%; height: 2px; position: absolute; background-color: #333; -webkit-transition: all 0.25s; transition: all 0.25s; }
#header .btnAll > span:nth-child(1) { top: 0; right:0;}
#header .btnAll > span:nth-child(2) { top: 0.5rem; right:0; }
#header .btnAll > span:nth-child(3) { top: 1rem; right:0;}
#header.open .btnAll > span{}
#header.open .btnAll > span:nth-child(1) { top: 0.5rem; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); width: 1.5rem;}
#header.open .btnAll > span:nth-child(2) { top: 0; opacity: 0; width: 1.5rem;}
#header.open .btnAll > span:nth-child(3) { top: 0.5rem; -webkit-transform: rotate(135deg); transform: rotate(135deg); width: 1.5rem;}
@keyframes slide_down {
from {
transform: translateX(0px) translateY(-30px);
opacity:0;
}
to {
transform: translateX(0px) translateY(0px);
opacity:1;
}
}
@media (max-width:1650px){
#header .btn-gnb-menu{right:1rem;}
}
/* 헤더 오버스크롤 */
/*사이트맵*/
#header #navi{background:#fff; position:fixed; left:-100%; top:0; width:100%; height:100%; padding-top:0; overflow:hidden; z-index:20; display:flex;}
#header.open #navi{left:0px;}
#menuAll .navi-img{background: center / cover no-repeat url(/images/default/main/navi-img-bg.jpg);border-radius:0 0 2.75rem 0;position:absolute;left:0;top:0;height:100vh;transition: width 0.5s ease-out; transition: width 0.5s ease-out;width:0;opacity:0;padding:8.5rem 2rem 4rem 6.5rem;display:flex; flex-direction:column;
justify-content:space-between;}
#menuAll .navi-img p.tit {font-size:1.9rem;font-weight:bold;color:#fff;}
#menuAll .navi-img.active{width:33rem;opacity:1;}
#menuAll .navi-img ul.sns-bx{display:flex;gap:0.45rem;margin-bottom:1.5rem;}
#menuAll .navi-img ul.navi-list li{font-size:0.9rem;color:rgba(255,255,255,0.6);line-height:1;}
#menuAll .navi-img ul.navi-list li:not(:last-child){margin-bottom:0.75rem;}
#menuAll .navi-img ul.navi-list li span {color:#fff;margin-right:0.5rem;}
#menuAll .navi-img p.tit,
#menuAll .navi-img > div {opacity:0;transition: opacity 0.5s ease;
transition-delay: 0.5s;}
#menuAll .navi-img.active p.tit,
#menuAll .navi-img.active > div {opacity:1;}
#menuAll .top_menu{display:none;}
#menuAll h3{font-size:1.5rem; }
#menuAll .mobile_top{ height:100%; position:absolute;display: flex; flex-direction: column;padding-top:7rem;left:0;right:auto;opacity:0;}
#header.open #menuAll .mobile_top.active{width:calc(100% - 33rem);left:33rem;right:auto; transition: width 0.5s ease-out;opacity:1;}
#menuAll .mobile_top {width:0;}
#menuAll .mobile_top .mbtop{padding:0 7.9rem 0 7.35rem;}
#menuAll .mobile_top .mbtop > li {padding:1.5rem 0;}
#menuAll .mobile_top .mbtop > li:first-child{padding-top:0;}
#menuAll .mobile_top .mbtop > li:last-child{padding-bottom:0;}
#menuAll .mobile_top .mbtop > li:not(:last-child){border-bottom:1px solid #ddd;}
#menuAll .mobile_top .mbtop > li > a{position:relative; color:#333; font-size:1.75rem; line-height:1; font-weight: bold;padding-top:0;}
#menuAll .mobile_top .mbtop > li > a:before{content : ""; display : block; position : absolute; left : 0; top:20%; width :8px; height : 8px; background : #2071f8;border-radius:50%;left:0;top:1rem;opacity:0;transition-duration: 0.5s;}
#menuAll .mobile_top .mbtop > li:hover > a:before{top:-0.75rem;opacity:1;transition-duration: 0.5s;}
#menuAll .mobile_top ul li > a{display:block; padding:1rem 0 1.25rem 0; font-size:1.1rem; width:100%; position:relative; transition: all .5s; -webkit-transition: all .5s;}
#menuAll .mobile_top .mbtop > li > ul > li > ul{display:none;}
#menuAll .mobile_top ul li ul{display:flex;}
#menuAll .mobile_top ul li ul li{float:none;position:relative;}
#menuAll .mobile_top ul li ul li:not(:last-child){margin-right:4rem;}
#menuAll .mobile_top ul li ul li a{ display:block; background:none;font-size:1rem; text-align: left; padding:0; color:#666;font-weight:600;}
#menuAll .mobile_top ul li ul li a:hover{color:#2071f8;}
#menuAll .mobile_top ul li ul li ul{margin:.5rem 0 1rem;}
#menuAll .mobile_top ul li ul li ul li{margin-top: .2rem;}
#menuAll .mobile_top ul li ul li ul li:before{content : ""; display : block; position : absolute; left :0px; top:10px; background:#666; width: .2rem; height:.2rem; border-radius:50%; }
#menuAll .mobile_top ul li ul li ul li a{color:#777; font-weight:300; padding-left: .5rem; font-weight: 400;}
#menuAll .mobile_top ul li ul li a strong{position: relative; color: #000; font-weight: 400;}
#menuAll .mobile_top ul li ul li a strong:after{position: absolute; content: ''; display: block; width: 100%; height: 2px; background: #000; bottom:-.2rem; left: 50%; transform: translateX(-50%);}
#header #navi .navi-list > ul > li {opacity: 0; transform: translateX(100px);transition-duration: 0.5s;}
#header #navi .navi-list.active > ul > li{ opacity: 1;transform: translateX(0);transition-duration: 0.5s;}
#header #navi .navi-list.active > ul > li:nth-child(1){ transition-delay: .2s;transition-duration: 0.5s;padding-top:0;}
#header #navi .navi-list.active > ul > li:nth-child(2){ transition-delay: .4s;transition-duration: 0.5s;}
#header #navi .navi-list.active > ul > li:nth-child(3){ transition-delay: .6s;transition-duration: 0.5s;}
#header #navi .navi-list.active > ul > li:nth-child(4){ transition-delay: .8s;transition-duration: 0.5s;}
#header #navi .navi-list.active > ul > li:nth-child(5){ transition-delay: 1.0s;transition-duration: 0.5s;}
@media (max-width:1650px){
#menuAll .mobile_top .mbtop {padding:0 2rem 0;}
#header.open #menuAll .mobile_top.active{padding-top:6rem;}
#menuAll .navi-img{padding:6rem 2rem 4rem 6.5rem}
}
@media (max-width:1500px){
#menuAll .navi-img.active{width:20rem;}
#header.open #menuAll .mobile_top.active{left:20rem;width:calc(100% - 20rem);}
#header.open #menuAll .navi-img{padding:3rem 2rem 3rem 2rem;position:fixed;}
#header.open #menuAll .mobile_top.active{padding-top:3rem;}
#header #navi{overflow-y:scroll;}
}
@media (max-width:1400px){
#menuAll .navi-img.active{width:25rem;}
#header.open #menuAll .mobile_top.active{width:calc(100% - 25rem);left:25rem;}
#header.open #menuAll .navi-img{padding:6rem 2rem 4rem 2rem}
#menuAll .mobile_top ul li ul li:not(:last-child){margin-right:1rem;}
#menuAll .mobile_top .mbtop > li > a{font-size:1.5rem;}
#menuAll .mobile_top ul li ul{flex-wrap:wrap;}
}
@media (max-width:1030px){
#menuAll .top_menu {display:block;z-index:1;width:100%;padding:0 1rem;}
#menuAll .navi-img.active{display:none}
#header.open #menuAll .mobile_top.active{width:100%;left:0%;}
#header #navi{width:100%;}
#header.open #navi{left:0;}
#header.open #menuAll .mobile_top.active{padding-top:0;}
#menuAll .top_menu .top_menu_head {}
#menuAll .top_menu .top_menu_head .memberBtn{display:flex;align-items:center;padding:1rem 0 2rem 0;}
#menuAll .top_menu .top_menu_head .memberBtn a{padding:0 1rem;position:relative;background:#eaedf7;width:7rem;height:2.75rem;display:flex;justify-content:center;align-items:center;color:#2149a6;border-radius:0.5rem;}
#menuAll .top_menu .top_menu_head .memberBtn a:nth-child(1){margin-right:0.75rem;}
#menuAll .mobile_top .mbtop > li{padding:0;}
#menuAll .top_menu .top_menu_head .go-link a{background:#2071f8;padding:0.75rem 0.5rem;border-radius:0.5rem;color:#fff;width:100%;display:block;text-align:center;font-size:1.1rem;}
#menuAll .top_menu .top_menu_head .go-link a img {height:0.9rem; vertical-align: middle;margin-right:0.5rem;}
#menuAll .top_menu .top_menu_head .go-link .point-bx {}
#menuAll .top_menu .top_menu_head .go-link .point-bx{font-size:1.1rem;color:#333;font-weight:600;margin-right:1rem;padding-left:1.4rem;background:url(/images/default/content/point-icon.png)no-repeat left center;background-size:1.2rem;margin-bottom:1rem;}
#menuAll .top_menu .top_menu_head .go-link .point-bx em{color:#2071f8;}
}
@media (max-width:500px){
#header #navi{width:100%;}
#header.open #navi{left:0;}
#menuAll .top_menu .top_menu_head .memberBtn a{padding:0 0.5rem;}
#menuAll .top_menu .top_menu_head .go-link{}
#menuAll .top_menu .top_menu_head{display:block;}
}
/*푸터*/
#footer{background:#303030;padding:1rem 0 4rem}
.footer-top {display:flex;justify-content:space-between;padding-bottom:1rem;align-items:center;border-bottom:1px solid #666;}
.footer-top ul {display:flex;}
.footer-top ul li a{color:rgba(255,255,255,0.6);display:inline-block;padding:0 1rem;font-size:0.9rem;position:relative;}
.footer-top ul li:not(:last-child) a:after{content:'';display:block;position:absolute;width:1px;height:0.85rem;background:rgba(255,255,255,0.6);right:0;top:0.3rem;}
.footer-top ul li:first-child a{padding-left:0;color:#2071f8;font-weight:bold;}
.footer-top ul li:last-child a{padding-right:0;}
.footer-bottom {padding-top:3rem;}
.footer-bottom > div{display:flex;justify-content:space-between;}
.footer-bottom > div .footer-list li{color:rgba(255,255,255,0.6);font-size:0.9rem;line-height:1;}
.footer-bottom > div .footer-list li span {color:#fff;margin-right:0.5rem;}
.footer-bottom > div .footer-list li em {padding:0 1rem;}
.footer-bottom > div .footer-list li:not(:last-child){margin-bottom:1rem;}
.footer-bottom > div .sns-bx{display:flex;gap:0.5rem;margin-top:2.25rem;}
.footer-bottom p.copy{color:rgba(255,255,255,0.45);font-size:0.8rem;}
@media (max-width:767px){
.footer-bottom > div{display:block;}
.footer-bottom > div .sns-bx{margin-top:1.5rem;}
.footer-bottom p.copy{margin-top:2rem;}
}
@media (max-width:550px){
.footer-top{display:block;}
.footer-top ul{margin-top:0.5rem;}
}
@media (max-width:500px){
.footer-bottom > div .footer-list li em {display:block;color:#303030;}
#footer ul li img{height:1.5rem;}
#footer{padding:1.5rem 0 3rem;}
}
/*탑버튼*/
.top-btn{position:fixed; right:1rem; bottom:1rem; cursor:pointer; z-index:10; display: none;}
@media (max-width:500px){
.top-btn img{width:3rem;}
}
/*팝업 롤링 추가*/
.layerPopup {position:absolute;top:230px;left:10rem; width:450px; background:#fff;line-height:auto;z-index:99999;border:10px solid #15334F;box-shadow:0 0 4px rgba(0,0,0,0.2); padding-bottom:40px;}
.layerPopWrap{position:relative; width:100%; height:100%;}
.layerPopup ul li img{width:100%;}
.dim{background:rgba(0,0,0,0.5);position:fixed;left:0;top:0;width:100%;height:100%;z-index:999;display:none;}
.dim2{background:rgba(0,0,0,0.5);position:fixed;left:0;top:0;width:100%;height:100%;z-index:999;display:none;}
/********************************************************
■ 레이아웃 변경
********************************************************/
@media (max-width:1300px){
/*헤더*/
#header .header_inner{width: 100%;}
#header .header_inner #nav ul{}
#header .header_inner #nav ul li a {font-size: .9rem; padding: 0 1.5rem;}
#footer ul{left:80%;}
}
/********************************************************
■ 태블릿
********************************************************/
@media (max-width:1030px){
html{font-size:16px;}
body{font-size:1rem}
#wrap{font-size:1rem;}
.tablet{display:block;}
/*헤더*/
#header h1 img,
#footer h3 img{height: 2.75rem; vertical-align:middle; }
#header .header_inner {height: 4rem;}
#header .header_inner #nav {display: none;}
/*-----사이트맵 버튼-----*/
#header .btn-gnb-menu{width: 3.6rem; height: 3.6rem;top:0; transform: translateY(-100%);}
/*-----회원서비스-----*/
#wrap .log_menu{display:none;}
#menuAll h3{text-align:center; padding:15px 0 10px; font-weight:normal; font-size:1.2rem; color:#fff;}
#menuAll .log{display:block; width: 100%; position:absolute; left:0; top:0; padding-left:1.5rem; box-sizing:border-box; z-index:10;}
#menuAll .log li{display:inline-block; height:4rem; line-height:4rem; color: #fff; position:relative;}
#menuAll .log li a{padding: 0 1rem;}
#menuAll .log li:after{right: .75rem; background: #000; width: 2px;}
#menuAll .log li b{font-size:1.1rem;}
#menuAll .log li.log_join a{padding-left:0;}
#menuAll .log li.log_join:after{content : ""; display : block; position : absolute; right:0; top: 35%; width :1px; height : 30%; background:rgba(255, 255, 255, .3);}
/*-----마이페이지-----*/
#menuAll .membership{display: block; background: #DC4976; margin-top:4rem;}
#menuAll .membership {clear:both;overflow:hidden; }
#menuAll .membership li {position: relative; float:left;width: 50%; border-bottom:1px solid rgba(255, 255, 255, .3); text-align:center; line-height:1;padding:1.3rem 0;}
#menuAll .membership li:after{content : ""; display : block; position : absolute; right:0; top: 0; width :1px; height : 100%; background:rgba(255, 255, 255, .3);}
#menuAll .membership li:nth-of-type(2n):after{display: none;}
#menuAll .membership li a{color:#fff;}
#menuAll .membership li i{vertical-align:middle; margin-right:5px; font-size:1.1rem;}
/*전체메뉴*/
#header #navi{ background : #fff; overflow-y:scroll;}
#header #navi:after{content:'';display : block; position : absolute; left :0; top:0; width :100%; height : 4rem;}
#menuAll .mobile_top{width:100%;height:auto; background:transparent;}
#menuAll .mobile_top:before,
#menuAll .mobile_top:after{display: none;}
/*1차*/
#menuAll .mobile_top .mbtop{border: 0; width: 100%; padding:0; }
#menuAll .mobile_top .mbtop > li{width: 100%; margin:0 !important;}
#menuAll .mobile_top .mbtop > li:before{display:none;}
#menuAll .mobile_top .mbtop > li > a{border:0; border-radius: 0; font-size:1.5rem; padding: 2rem 1.5rem 2rem; color:#333; }
#menuAll .mobile_top .mbtop > li > a:before{display:none;}
#navi ul.mbtop {width:100%; margin:0; padding:0;}
#navi ul.mbtop li{margin:0; float:none; width:100%; border-bottom:1px solid rgba(0, 0, 0, .1); position:relative;}
#navi ul.mbtop li:after{ content: '';
display: block;
position: absolute;
width: 1.5rem;
height: 1.5rem;
background: url(/images/default/main/plus.svg) no-repeat center center;
background-size: cover;
top: 2rem;
right: 1rem; }
#navi ul.mbtop li.nosub:after{display:none;}
#navi ul.mbtop > li > a {padding:0; background: none; text-align:left; display:block; width:100%; padding: 1rem;box-sizing:border-box; font-size:1.15rem; font-weight: 700; color:#262626;}
#navi ul.mbtop li.open_li{position:relative;}
#navi ul.mbtop > li.open_li > a{}
#navi ul.mbtop li.open_li:after{background: url(/images/default/main/minus.svg) no-repeat center center;
background-size: cover;
height: 1rem;}
/*2차*/
#navi ul.mbtop li ul {display:none; float:none; position:relative; left:0; top:0; width:auto; height:auto; visibility:visible; padding:0 1.5rem 1rem 1.5rem; margin-top:0; margin-left: 0;}
#navi ul.mbtop li ul.on{display:block;}
#navi ul.mbtop li ul li {float:none;border:none; box-sizing:border-box; background: none; padding-left:0;}
#navi ul.mbtop li ul li a {background:url(none); height:auto; padding-left:0; font-size:1rem; color:#333;}
#navi ul.mbtop li ul li:after,
#navi ul.mbtop li ul li:before{display:none;}
/*3차*/
#navi ul.mbtop li ul li ul{display:none;border:none; height:0;background:none; margin:0; padding:0;}
#navi ul.mbtop li ul li ul li {display:none;}
/*팝업 롤링 추가*/
.layerPopup {left:50% !important; transform:translateX(-50%);}
/*푸터*/
#footer .inn{width:100%; padding:0 1rem;}
}
/********************************************************
■ 모바일
********************************************************/
@media (max-width:767px){
html,body,#wrap{height:auto;}
html{font-size:15px;}
body{font-size:1rem; position:relative;}
.web{display:none;}
.mob{display:block;}
/*팝업 롤링 추가*/
.mobile_dim{width: 100%; height:100%; position: absolute; top: 0; left: 0; margin: 0; z-index: 1039; display: inline-block; background: rgba(0,0,0,0.5);}
.layerPopup img{width:100% !important;}
.layerPopup {left:5% !important; transform:translateX(0%); width:90% !important; height:auto !important; top:130px;}
.chkvsb{font-size:0.7rem !important;}
}
/*포인트 팝업*/
.pop-zone {position:fixed;z-index:1000;left:50%;top:50%;transform:translate(-50%,-50%);width:310px;height:200px;border-radius:15px;background:#fff;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;opacity:0;}
.pop-zone img{width:1.65rem;}
.pop-zone .pop-tit{font-size:0.9rem;font-weight:700;color:#333;margin-top:0.5rem;}
.pop-zone .pop-txt{font-size:0.8rem;color:#666666;margin-top:0.65rem;}
.pop-zone .check {width:6.25rem;height:2.25rem;border-radius:5px;display:flex;justify-content:center;align-items:center;background:#e6f3ff;color:#2071f8;font-size:.8rem;margin:0 auto;margin-top:0.9rem;}
.pop-zone-qr-code {position:fixed;z-index:1000;left:50%;top:50%;transform:translate(-50%,-50%);width:430px;border-radius:15px;background:#f6f6f9;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;opacity:1;padding:1.75rem 1.75rem;z-index:99999;}
.pop-zone-qr-code .img-zone { width: 15rem;height: 15rem;display:flex;justify-content:center;align-items:center;background:url(/images/default/main/pop-bg.png)no-repeat center center;background-size:cover;margin:0 auto;}
.pop-zone-qr-code .img-zone img{max-width:100%;}
.pop-zone-qr-code p.pop-tit {font-size:1rem;font-weight:700;color:#333;margin-bottom:1rem;}
.pop-zone-qr-code .code-bx {background:#fff;border-radius:0.75rem;box-shadow: 5px 0 20px rgb(0 0 0 / 10%);width:100%;text-align:center;padding:1.5rem 1rem;}
.pop-zone-qr-code .code-bx .name {color:#333;font-size:1.2rem;font-weight:700;margin:1.25rem 0 0.75rem;}
.pop-zone-qr-code .code-bx .txt{font-size:0.8rem;color:#666;}
.pop-zone-qr-code span {display:flex;background:#2071f8;height:3rem;border-radius:0.5rem;color:#fff;font-size:0.9rem;width:100%;display:flex;justify-content:center;align-items:center;margin-top:6.75rem;}
@media (max-width:767px){
.pop-zone-qr-code {width:90%;}
.pop-zone-qr-code span{margin-top:1.5rem;}
.pop-zone-qr-code .img-zone{position:relative;border-radius:10px;overflow:hidden;}
.pop-zone-qr-code .img-zone .img-zone-bx {background:#fff;position:relative;z-index:1;width:calc(100% - 10px);height:calc(100% - 10px);}
.pop-zone-qr-code .img-zone .bg{ position: absolute;bottom: 0;left: 0;width: 100%;height: 100%; /* 선의 두께 */
background: linear-gradient(45deg, #ddebff, #2071f8, #856cd0);}
}