@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Noto+Sans);

/* font */
/* @font-face {
    font-family: 'NexonLv2Gothic';
    font-weight: 300;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicLight.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicLight.eot?#iefix') format('embedded-opentype'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicLight.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicLight.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicLight.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'NexonLv2Gothic';
    font-weight: 400;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicRegular.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicRegular.eot?#iefix') format('embedded-opentype'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicRegular.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicRegular.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicRegular.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'NexonLv2Gothic';
    font-weight: 500;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicMedium.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicMedium.eot?#iefix') format('embedded-opentype'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicMedium.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicMedium.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicMedium.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'NexonLv2Gothic';
    font-weight: 700;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicBold.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicBold.eot?#iefix') format('embedded-opentype'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicBold.woff2') format('woff2'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicBold.woff') format('woff'),
         url('https://cdn.jsdelivr.net/gh/webfontworld/NexonLv2Gothic/NexonLv2GothicBold.ttf') format("truetype");
    font-display: swap;
} */

@font-face {
    font-family: 'NexonLv2Gothic';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.1/NEXON Lv2 Gothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }

.nexon{font-family:'NexonLv2Gothic';}

/* @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 400;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 500;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');}

@font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');}
 */

.noto{font-family:'Noto Sans';}


/* @font-face {
    font-family: "jalnan";
    font-weight: normal;
    font-style: normal;
    src: url("https://cdn.jsdelivr.net/gh/websfont/jalnan/jalnan.eot");
    src: url("https://cdn.jsdelivr.net/gh/websfont/jalnan/jalnan.eot?#iefix") format("embedded-opentype"),
         url("https://cdn.jsdelivr.net/gh/websfont/jalnan/jalnan.woff2") format("woff2"),
         url("https://cdn.jsdelivr.net/gh/websfont/jalnan/jalnan.woff") format("woff"),
         url("https://cdn.jsdelivr.net/gh/websfont/jalnan/jalnan.ttf") format("truetype");
    font-display: swap;
}
  */

@font-face {
    font-family: 'jalnan';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }
.jalnan {
    font-family: "jalnan";
}


/* placeholder */
::-webkit-input-placeholder { /* WebKit browsers */ color: #bdbdbd; }
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #bdbdbd; opacity: 1; }
::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #bdbdbd; opacity: 1; }
:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #bdbdbd; }

/* reset */
*{padding:0; margin:0;}
html{font-size:62.5%;height:auto; font-family: 'Noto Sans KR' sans-serif;font-weight:400;color:#333; font-smoothing: antialiased; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;}
body{font-size:16px;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display: block;}
audio, canvas, progress, video{display: inline-block; vertical-align: baseline;}
audio:not([controls]) {display: none; height: 0;}
[hidden], template{display: none;}
a{background-color: transparent; text-decoration:none;}
a:active, a:hover{outline: 0;}
li{list-style:none;}
abbr[title]{border-bottom: 1px dotted;}
b, strong{font-weight: bold;}
dfn{font-style: italic;}
h1{font-size: 2em; margin:0;}
mark{background: #ff0; color: #000;}
small{font-size: 80%;}
sub, sup{font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup{top: -0.5em;}
sub{bottom: -0.25em;}
img{border: 0; width:100%;vertical-align:top;}
svg:not(:root){overflow: hidden;}
hr{-moz-box-sizing: content-box; box-sizing: content-box; height: 0;}
pre{overflow: auto;}
code, kbd, pre, samp{font-family: monospace, monospace; font-size: 1em;}
button, input, optgroup, select, textarea{color: inherit; font: inherit; margin: 0;}
button{overflow: visible;border:none;background:transparent;}
button, select{text-transform: none;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;}
button[disabled], html input[disabled]{cursor: default;}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0;}
input{line-height: normal;}
input[type="checkbox"], input[type="radio"] {box-sizing: border-box; padding: 0;}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button{height: auto;}
input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
fieldset {border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}
legend {border: 0; padding: 0;}
textarea {overflow: auto;}
optgroup {font-weight: bold;}
table {border-collapse: collapse; border-spacing: 0;}
td, th {padding: 0;}
.hide{height:0; font: 0/0 a; text-shadow: none; color: transparent; overflow:hidden;} 
.cboth{height:0; font: 0/0 a; text-shadow: none; color: transparent; overflow:hidden; clear:both;} 
em{font-style:normal;}


:root {

    --gray:#f9f9f9;
    --bk-0: #000;
    --bk-2: #222;
    --bk-4:  #444;
    --bk-6: #666;
    --bk-8: #888;
    
    --wh-0: #ffffff;
    --wh-2: #f1f1f1;
    --wh-4: #f9f9f9;
    --wh-6: #ddd;
    --wh-8: #ccc;
    --wh-10: #aaa;

    --point-g: #00BF86;
    --point-y: #FFC200;
    --point-n: #17547B;
    --point-o: #FC7422;

    --pd-10: 0 1rem;

  }


/* 공통 fade효과 */
.fade-Up {
    opacity: 0;
    transform: translateY(50px); /* 초기에는 아래로 이동한 상태로 시작합니다. */
    transition: opacity 0.8s ease, transform 0.8s ease; /* 트랜지션 효과를 적용합니다. */
  }
  
  .fade-Up.active {
    opacity: 1; /* active 클래스가 추가될 때 opacity를 1로 변경합니다. */
    transform: translateY(0); /* active 클래스가 추가될 때 이동 효과를 없앱니다. */
  }
  
  .fade-Up2 {
    transition-delay: 0.5s;
  }
  
  .fade-Up3 {
    transition-delay: 1s;
  }
  
  .fade-Up4 {
    transition-delay: 2s;
  }
  
  
  .fade-Left{
    opacity: 0;
    transform: translateX(-50px); /* 시작 위치를 왼쪽으로 이동 */
    transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; /* 트랜지션 속성 추가 */
  }
  
  .fade-Left.active {
    opacity: 1;
    transform: translateX(0); /* 최종 위치를 원래 위치로 이동 */
  }
  
  .fade-Left2 {
    transition-delay: 0.5s;
  }
  
  .fade-Left3 {
    transition-delay: 1s;
  }
  
  .fade-Left4 {
    transition-delay: 1.5s;
  }
  


/* common */
.point_box{background:#00BF86;color:#fff;font-weight:500;}
.point_txt{color:#00BF86;}
.page h2{width:100%;}
.header.nav-up {top: -8rem !important;}
.ico_news{display:inline-block;background:var(--point-g);color:#fff;border-radius:5rem;text-align:center;width:5.6rem;height:2.6rem;line-height:2.6rem;font-size:1.3rem;}
.ico_event{display:inline-block;background:var(--point-y);color:#fff;border-radius:5rem;text-align:center;width:5.6rem;height:2.6rem;line-height:2.6rem;font-size:1.3rem;}
.not_scroll{position:fixed;overflow:hidden;/* width:100%;height:100% */}    
.layout-open{touch-action: none;}
.g_bottom{-webkit-box-shadow: 0px 10px 11px -8px rgba(0,0,0,0.8); 
    box-shadow: 0px 8px 11px -8px rgba(0,0,0,0.3);}
.top_btn_wrap {position: fixed; right:3rem;bottom:3rem;z-index: 99;}
.top_btn_wrap img{width:5rem;}
.sns img{width:3rem;}
#toTop, .btn_top{display:none !important;}
.btn_top{padding-bottom:1rem;}
.sub_con{padding-top:8.5rem;}
.mo{display:none;}



/* header 공통 + pc*/
.h_mo{display:none;}
.header{position:fixed;top:0;left:0;right:0;background:transparent; width:100%;transition:background 0.25s ease-out, top 0.5s ease-in-out; z-index: 3;}
.header_wrap{border-bottom:1px solid #ddd;}
.inner_header{position:relative;margin:0 auto;text-align:center;display:flex;justify-content: space-between;}
.header h1{display:inline-block;width:9.5rem;height:4rem;background:url(/img/common/logo_w.png) no-repeat;background-size:contain;font-size:0;cursor:pointer;position:absolute;top:1.5rem;left:0;}
.inner_header .shop{display:inline-block;width:20.9rem;height:2.8rem;background:url(/img/common/btn_shop_w.png) no-repeat;background-size:contain;font-size:0;cursor:pointer;vertical-align:middle;margin-top:-0.5rem;}
.inner_header .gnb_w{display:inline-block;vertical-align:top;}
.inner_header .gnb_w nav>ul{text-align:center;font-size:0}
.inner_header .gnb_w nav>ul>li{display:inline-block;vertical-align:top;padding:0 5rem;text-align:left;cursor: pointer;} 
.inner_header .gnb_w nav>ul>li.brand_nav{padding-right:0;}
.inner_header .gnb_w .link_gnb{position:relative; display:inline-block;height:8.5rem; line-height:8.5rem;font-size:2rem;color:#fff;text-align:left;}
.inner_header .btn_header {position:absolute;top:15px;right:80px;display:inline-block;width:130px;padding:10px;text-align:center;font-size:15px;color:#fff;border:2px solid #fff;border-radius:200px;font-weight:500}
.inner_header .btn_header a{color:#fff}


.inner_header.sub{border-bottom:1px solid #eee;background:#fff}
.inner_header.sub .link_gnb{color:#222}
.inner_header.sub .btn_header{color:#222;border:2px solid #222;}


.inner_header{width:100%;max-width:140rem;margin:0 auto;}
.inner_header nav > ul{display:flex;padding-left:18rem;}



.header .rt{display:flex;}
.header .shop_wrap{line-height:8.5rem;}


/*gnb line*/
.inner_header .gnb_w .link_gnb:before{content: '';position: absolute;width: 0%;height:3px;background:rgba(0, 191, 134, 1);left: 0;bottom:0;z-index: 6;
-webkit-transition: width 0.3s;
-moz-transition: width 0.3s;
-ms-transition: width 0.3s;
transition: width 0.3s;}
.inner_header .gnb_w .link_gnb.on:before{width:100%;}
.inner_header .gnb_w .link_gnb.on {color:var(--bk-2) !important}

/*gnb*/
.header.on{background:#fff;}
.header.on .gnb_w .link_gnb{color:#222}
.header.on .h1{background:url(/img/common/logo.png) no-repeat;background-size:contain;}
.header.on .inner_header .shop{background:url(/img/common/btn_shop.png) no-repeat;background-size:contain;}
.header.on .inner_header .btn_header{color:#222;border:2px solid #222;}
.header.gnb_enter{background:#fff;}
.header.gnb_enter:after, .header.gnb_enter2:after{content:'';position:absolute;width:100%;height:1px;top:8.5rem;background:#ddd;left:0;}

.header.gnb_enter .gnb_w .link_gnb{color:#222}
.header.gnb_enter h1{background:url(/img/common/logo.png) no-repeat;background-size:contain;}
.header.gnb_enter .inner_header .shop{background:url(/img/common/btn_shop.png) no-repeat;background-size:contain;}
.header.gnb_enter .inner_header .btn_header{color:#222;border:2px solid #222;}
.header.gnb_enter .inner_header .btn_header a{color:#282F3A}


.header.gnb_enter2{background:#fff;}
.header.gnb_enter2 .gnb_w .link_gnb{color:#222}
.header.gnb_enter2 h1{background:url(/img/common/logo.png) no-repeat;background-size:contain;}
.header.gnb_enter2 .inner_header .shop{background:url(/img/common/btn_shop.png) no-repeat;background-size:contain;}
.header.gnb_enter2 .inner_header .btn_header{color:#222;border:2px solid #222;}
.header.gnb_enter2 .inner_header .btn_header a{color:#282F3A}

.dep2_area{position: relative;left: 0;right: 0;z-index: 5;height: 0;overflow: hidden;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: all 0.3s;
transition: all 0.3s;font-family:'NexonLv2Gothic';padding:0 0;}
/* .dep2_area.l_line{border-left: 1px solid rgba(0,0,0,0.08);} */
.dep2_area.on{height:40rem;opacity:0.9;}
/* .dep2_area ul{padding:20px 0;} */
.dep2_area ul{padding:1rem 0 2rem;}
.dep2_area ul li{color:#222;text-align:left;display:block;}
.dep2_area ul li a{font-size:1.6rem;line-height:4.5rem;display:block;text-align:left;padding-right:2.5rem;color:#666;position:relative;}
.dep2_area ul li a:hover{color:var(--point-g);}
.dep2_area ul li a span{display:inline-block;}
.dep2_area ul li a:hover span:after{content:'';display:inline-block;width:4px;height:4px;background:var(--point-g);position:absolute;border-radius:50%;top:5px;}


.nation{margin:2.3rem 2.5rem 0 0;z-index:2;}
.nation .button-dropdown {position: relative;}
.nation li a {display: block;color:#222;background: transparent;width:7rem;height:3.8rem;line-height:3.6rem;text-decoration: none;text-align:left;padding-left:1rem;border:1px solid transparent;box-sizing:border-box;}

.nation li a.dropdown-toggle:after{content:'';display:inline-block;width:1.2rem;height:1.2rem;background: url("data:image/svg+xml,%3Csvg width='64px' height='64px' viewBox='0 -4.5 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23000000' transform='rotate(180)'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Ctitle%3Earrow_up %5B%23340%5D%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Dribbble-Light-Preview' transform='translate(-140.000000, -6683.000000)' fill='%23fff'%3E%3Cg id='icons' transform='translate(56.000000, 160.000000)'%3E%3Cpath d='M84,6532.61035 L85.4053672,6534 L94.0131154,6525.73862 L94.9311945,6526.61986 L94.9261501,6526.61502 L102.573446,6533.95545 L104,6532.58614 C101.8864,6530.55736 95.9854722,6524.89321 94.0131154,6523 C92.5472155,6524.40611 93.9757869,6523.03486 84,6532.61035' id='arrow_up-%5B%23340%5D'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat;background-size:contain;position:absolute;right:1rem;top:1.4rem;transform: rotate(0);transition: all 0.2s;}

.nation li a.dropdown-toggle.active:after{content:'';display:inline-block;width:1.2rem;height:1.2rem;background: url("data:image/svg+xml,%3Csvg width='64px' height='64px' viewBox='0 -4.5 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23000000' transform='rotate(180)'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Ctitle%3Earrow_up %5B%23340%5D%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Dribbble-Light-Preview' transform='translate(-140.000000, -6683.000000)' fill='%23fff'%3E%3Cg id='icons' transform='translate(56.000000, 160.000000)'%3E%3Cpath d='M84,6532.61035 L85.4053672,6534 L94.0131154,6525.73862 L94.9311945,6526.61986 L94.9261501,6526.61502 L102.573446,6533.95545 L104,6532.58614 C101.8864,6530.55736 95.9854722,6524.89321 94.0131154,6523 C92.5472155,6524.40611 93.9757869,6523.03486 84,6532.61035' id='arrow_up-%5B%23340%5D'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat;background-size:contain;position:absolute;right:1rem;top:1.4rem;transform: rotate(-180deg);transition: all 0.2s;}

.gnb_enter .nation li a.dropdown-toggle:after, .gnb_enter2 .nation li a.dropdown-toggle:after {content:'';display:inline-block;width:1.2rem;height:1.2rem;background: url("data:image/svg+xml,%3Csvg width='64px' height='64px' viewBox='0 -4.5 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23000000' transform='rotate(180)'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Ctitle%3Earrow_up %5B%23340%5D%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Dribbble-Light-Preview' transform='translate(-140.000000, -6683.000000)' fill='%23222'%3E%3Cg id='icons' transform='translate(56.000000, 160.000000)'%3E%3Cpath d='M84,6532.61035 L85.4053672,6534 L94.0131154,6525.73862 L94.9311945,6526.61986 L94.9261501,6526.61502 L102.573446,6533.95545 L104,6532.58614 C101.8864,6530.55736 95.9854722,6524.89321 94.0131154,6523 C92.5472155,6524.40611 93.9757869,6523.03486 84,6532.61035' id='arrow_up-%5B%23340%5D'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat;background-size:contain;position:absolute;right:1rem;top:1.4rem;transform: rotate(0);transition: all 0.2s;}

.gnb_enter .nation li a.dropdown-toggle.active:after, .gnb_enter2 .nation li a.dropdown-toggle.active:after{content:'';display:inline-block;width:1.2rem;height:1.2rem;background: url("data:image/svg+xml,%3Csvg width='64px' height='64px' viewBox='0 -4.5 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23000000' transform='rotate(180)'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Ctitle%3Earrow_up %5B%23340%5D%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Dribbble-Light-Preview' transform='translate(-140.000000, -6683.000000)' fill='%23222'%3E%3Cg id='icons' transform='translate(56.000000, 160.000000)'%3E%3Cpath d='M84,6532.61035 L85.4053672,6534 L94.0131154,6525.73862 L94.9311945,6526.61986 L94.9261501,6526.61502 L102.573446,6533.95545 L104,6532.58614 C101.8864,6530.55736 95.9854722,6524.89321 94.0131154,6523 C92.5472155,6524.40611 93.9757869,6523.03486 84,6532.61035' id='arrow_up-%5B%23340%5D'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat;background-size:contain;position:absolute;right:1rem;top:1.4rem;transform: rotate(-180deg);transition: all 0.2s;}
.nation li a.dropdown-toggle.active {background: transparent;color: #fff;border:1px solid #ddd;box-sizing:border-box;width:7rem;height:3.8rem;line-height:3.6rem;}
.gnb_enter .nation li a.dropdown-toggle.active, .gnb_enter2 .nation li a.dropdown-toggle.active{background: #fff;color: #222;}
.nation li .dropdown-menu {display: none;position: absolute;left: 0;margin-top:-0.1rem;text-align: left;color:#aaa;border:1px solid #ddd;box-sizing:border-box;background:transparent;width:7rem;height:3.8rem;line-height:3.6rem;padding:0 0 !important;}
.gnb_enter .nation li .dropdown-menu, .gnb_enter2 .nation li .dropdown-menu{background:#fff;color:#666;}
.nation li .dropdown-menu.active {display: block;}
.inner_header .nation li a{color:#fff;}
.nation li .dropdown-menu li a{color:#ddd;}
.gnb_enter .nation li .dropdown-menu li a, .gnb_enter2 .nation li .dropdown-menu li a{color:#666;}
.gnb_enter .nation li a, .gnb_enter2 .nation li a{color:#222;}

/* 모바일 헤더 */

.mobile-top-bar {position:absolute;top:4rem;right:0;width:100%;z-index:999;}

/* 토글 사이드바 버튼 아이콘 */
.ico {position:absolute;top:-1px;right:2rem;width:20px;height:20px;transform:translatey(-50%);cursor:pointer;z-index:9999;}
.ico > div {position:absolute;top:0;right:0;width:100%;height:2px;background:#fff;transition: all 0.15s ease; /* 추가 */}
.ico > div:nth-child(2) {top:40%;width:80%;transition:visibility 0s .15s;}
.ico.active > div:nth-child(2) {visibility:hidden;transition:visibility 0s;}
.ico > div:nth-child(3) {top:80%;width:60%;}
.ico > div:nth-child(1), .ico > div:nth-child(3) {transition:top .15s .15s, transform .15s;}
.ico.active > div:nth-child(1), .ico.active > div:nth-child(3) {top:40%;transform:rotate(45deg);transition:top .15s, transform .15s .15s;width:100%;}
.ico.active > div:nth-child(2){/* width:100%; */visibility: hidden;
    width: 0; /* 변경 */}
.ico.active > div:nth-child(3) {transform:rotate(-45deg);}
.ico.active > div{background:#555;width: 100%; /* 추가 */}

.gnb_enter .ico > div, .gnb_enter2 .ico > div{background:#555;}

.side-bar-box {position:fixed;top:0;right:0;width:100%;height:100%;visibility:hidden;transition:visibility .5s, background-color .5s;}
.side-bar-box.active {visibility:visible;}

/* 좌측 사이드바 */
.side-bar {position:fixed;top:0;right:-100%;/* max-width:60rem; */width:100%;height:auto;
    min-height:100%;background:#fff;transition:right .5s;z-index:999999;height:-webkit-fill-available;overscroll-behavior-y: contain;
    overflow-y: auto;}
.side-bar-box.active > .side-bar {right:0;}

.side-bar .s_top h1{background:url(/img/common/logo_toytree.png) no-repeat;background-size:contain;}
.side-bar .s_top{width:100%;height:7rem;border-bottom:1px solid #ddd;position:fixed;background:#fff;}
.side_con{width:100%;padding:2.5rem;box-sizing:border-box;padding-top:8rem;}
.side_con .big a{color:#333;font-size:1.7rem;font-weight:500;}
.side_con .big{border-bottom:1px dashed #ddd;padding:1.5rem 0;}
.side_con .big:last-child{border-bottom:none;}
.side_con .s_brand{display:flex;align-items: baseline;}
.side_con .s_brand ul{padding-left:10rem;font-size:0;}
.side_con .s_brand ul > li{padding-bottom:3rem;}
.side_con .s_brand ul > li:last-child{padding-bottom:1.5rem;}
.side_con .s_brand > ul > li >  a{font-size:1.5rem;color:#666;font-weight:normal;}
.side_con .s_bottom{display:flex;justify-content: flex-end;align-items: center;padding:0 0 20px;}

.side_con .s_brand ul{display:none;}
.side_con .s_brand.open ul{display: block;}


.s_bottom a{color:#656565;}
.s_bottom ul#menu{position: relative;height:3rem;margin:0;padding:0 10px;background:#fff;color:#222;}
.s_bottom ul#menu > li{float:left;list-style-type:none;position:relative;}
.s_bottom label{position:relative;display:block;line-height:3rem;transition:border 0.1s;cursor:pointer;border:1px solid #fff;width:5.5rem;padding-left:1rem;font-size:1.4rem;color:#656565;}
.s_bottom label:after, .fs_wrap:after{content:'';display:inline-block;width:1.2rem;height:1.2rem;background: url("data:image/svg+xml,%3Csvg viewBox='0 -4.5 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23000000' transform='rotate(180)'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Ctitle%3Earrow_up %5B%23340%5D%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Dribbble-Light-Preview' transform='translate(-140.000000, -6683.000000)' fill='%23656565'%3E%3Cg id='icons' transform='translate(56.000000, 160.000000)'%3E%3Cpath d='M84,6532.61035 L85.4053672,6534 L94.0131154,6525.73862 L94.9311945,6526.61986 L94.9261501,6526.61502 L102.573446,6533.95545 L104,6532.58614 C101.8864,6530.55736 95.9854722,6524.89321 94.0131154,6523 C92.5472155,6524.40611 93.9757869,6523.03486 84,6532.61035' id='arrow_up-%5B%23340%5D'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat;background-size:contain;position:absolute;right:1rem;top:1rem;transform: rotate(0);transition: all 0.2s;}
.s_bottom label:active, .s_bottom input:checked ~ label{border:1px solid #ddd;}
.s_bottom input:checked ~ label:after, .fs_wrap_down:after{content:'';display:inline-block;width:1.2rem;height:1.2rem;background:url("data:image/svg+xml,%3Csvg viewBox='0 -4.5 20 20' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23000000' transform='rotate(180)'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Ctitle%3Earrow_up %5B%23340%5D%3C/title%3E%3Cdesc%3ECreated with Sketch.%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Dribbble-Light-Preview' transform='translate(-140.000000, -6683.000000)' fill='%23656565'%3E%3Cg id='icons' transform='translate(56.000000, 160.000000)'%3E%3Cpath d='M84,6532.61035 L85.4053672,6534 L94.0131154,6525.73862 L94.9311945,6526.61986 L94.9261501,6526.61502 L102.573446,6533.95545 L104,6532.58614 C101.8864,6530.55736 95.9854722,6524.89321 94.0131154,6523 C92.5472155,6524.40611 93.9757869,6523.03486 84,6532.61035' id='arrow_up-%5B%23340%5D'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); no-repeat;background-size:contain;position:absolute;right:1rem;top:1rem;transform: rotate(-180deg);transition: all 0.2s;}
.s_bottom input{display:none}
.s_bottom input:checked ~ ul.submenu{max-height:300px;transition:max-height 0.2s ease-in;border:1px solid #ddd;border-top:none;box-sizing:border-box;}
.s_bottom ul.submenu{max-height:0;padding:0;overflow:hidden;list-style-type:none;background:#fff;transition:max-height 0.2s ease-out;position:absolute;min-width:100%;}
.s_bottom ul.submenu li a{display:block;color:#656565;text-decoration:none;white-space:nowrap;height:3rem;line-height:2.8rem;padding-left:1rem;font-size:1.4rem;}
.header .s_bottom .shop_wrap{line-height:inherit;position:relative;}
.s_bottom .shop_wrap a{color:#656565;padding-left:25px;font-size:1.4rem;}
.s_bottom .shop_wrap a:before{content:'';display:inline-block;width:22px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-smart-home' width='44' height='44' viewBox='0 0 24 24' stroke-width='1' stroke='%23656565' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M19 8.71l-5.333 -4.148a2.666 2.666 0 0 0 -3.274 0l-5.334 4.148a2.665 2.665 0 0 0 -1.029 2.105v7.2a2 2 0 0 0 2 2h12a2 2 0 0 0 2 -2v-7.2c0 -.823 -.38 -1.6 -1.03 -2.105' /%3E%3Cpath d='M16 15c-2.21 1.333 -5.792 1.333 -8 0' /%3E%3C/svg%3E") no-repeat; background-size:contain;position:absolute;top:2px;left:0;}



/* footer */
.footer{width:100%;background:#3d3d3d;padding:4rem 0;}
.footer .f_wrap{width:100%;max-width:140rem;margin:0 auto;position:relative;}
.footer .con1{display:flex;margin-bottom:2rem;}
.footer .con1 a{color:var(--wh-0);padding-right:4rem;font-size:1.7rem;font-weight:400;}
.footer .con2 p{color:var(--wh-10);font-size:1.5rem;line-height:2.5rem;}
.footer .con2 span{font-weight:500;color:var(--wh-8);}
.footer .con3{color:var(--bk-8);font-size:1.4rem;margin-top:1.5rem;}
.footer .con4{position:absolute;top:0;right:0;}
.footer .con5{float:right;position:absolute;top:4rem;right:0;display:flex;width:100%;max-width:30rem;justify-content: space-between;margin-top:2rem;align-items: center;}
.footer .qna{font-weight:600 !important;}



/*family site*/
.con4{width:100%;max-width:30rem;}
.family{width:100%;max-width:30rem;}
.fs_wrap, .fs_wrap_down{width:100%; height:4rem; line-height:4rem; font-size:1.6rem; text-indent:1rem; color:#ccc; cursor:pointer;font-weight:400;color:var(--bk-6);background:#fff;border-radius:0.7rem;}
.fs_wrap:after, .fs_wrap_down:after{top:1.5rem;}
.fs_wrap_down{display:none;border-radius:0 0 0.7rem 0.7rem;background:#f9f9f9;border:1px solid #ddd;border-top:none;box-sizing:border-box;}
.fs_list{width:100%; height:25rem; padding:0 8px; overflow:hidden; background:#f9f9f9;border:1px solid #ddd;box-sizing:border-box; position:absolute; bottom:4rem; right:0;z-index:9000; display:none;}
.fs_list li{border-bottom:1px dotted #ddd; text-indent:5px; font-size:1.3rem; height:3rem; line-height:3rem;}
.fs_list li:last-child{border-bottom:none;}
.fs_list li:hover a{color:#222;font-weight:bold;}
.fs_list li a{display:block; width:100%; height:100%;color:#666;}
.fs_list li.close{border-bottom:0; height:18px; padding:6px 0 0; text-align:right;cursor: pointer;}
.fs_list li.close:hover{background:none;}
.fs_list li.close a{display:inline-block; width:25px; zoom:1; *display:inline;}

.con5 .customer span{color:#ccc;font-size:1.5rem;}
.con5 .customer p{color:#fff;font-size:2rem;font-weight:bold;}
.con5 .sns{font-size:0;}
.con5 .sns a{display:inline-block;width:3rem;height:3rem;}
.con5 .sns a+a{margin-left:1rem;}


/* paging */
.page_wrap {text-align:center;font-size:0;}
.paging {display:inline-block;}
.paging .none {display:none;}
.paging a {display:block;margin:0 3px;float:left;border:1px solid #f1f1f1;width:28px;height:28px;line-height:28px;text-align:center;background-color:#fff;font-size:13px;color:#333;text-decoration:none;border-radius:8px;font-weight:500;}
.paging .pprev {background:url("data:image/svg+xml,%3Csvg fill='' width='133px' height='133px' viewBox='-1920 -1920 5760.00 5760.00' xmlns='http://www.w3.org/2000/svg' stroke='' stroke-width='192'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round' stroke='%23000000' stroke-width='115.2'%3E%3Cg fill-rule='evenodd'%3E%3Cpath d='M1052 92.168 959.701 0-.234 959.935 959.701 1920l92.299-92.43-867.636-867.635L1052 92.168Z'%3E%3C/path%3E%3Cpath d='M1920 92.168 1827.7 0 867.766 959.935 1827.7 1920l92.3-92.43-867.64-867.635L1920 92.168Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cg fill-rule='evenodd'%3E%3Cpath d='M1052 92.168 959.701 0-.234 959.935 959.701 1920l92.299-92.43-867.636-867.635L1052 92.168Z'%3E%3C/path%3E%3Cpath d='M1920 92.168 1827.7 0 867.766 959.935 1827.7 1920l92.3-92.43-867.64-867.635L1920 92.168Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E")no-repeat center;background-size:80%;margin-left:0;}
.paging .prev {background:url("data:image/svg+xml,%3Csvg fill='%23000000' width='133px' height='133px' viewBox='-1920 -1920 5760.00 5760.00' xmlns='http://www.w3.org/2000/svg' stroke='%23000000' stroke-width='192'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round' stroke='%23000000' stroke-width='11.52'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath d='m1394.006 0 92.299 92.168-867.636 867.767 867.636 867.636-92.299 92.429-959.935-960.065z' fill-rule='evenodd'%3E%3C/path%3E%3C/g%3E%3C/svg%3E")no-repeat center;background-size:80%;margin-right:7px;}
.paging .next {background:url("data:image/svg+xml,%3Csvg fill='%23000000' width='133px' height='133px' viewBox='-1920 -1920 5760.00 5760.00' xmlns='http://www.w3.org/2000/svg' stroke='%23000000' stroke-width='192'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round' stroke='%23000000' stroke-width='11.52'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath d='m1394.006 0 92.299 92.168-867.636 867.767 867.636 867.636-92.299 92.429-959.935-960.065z' fill-rule='evenodd'%3E%3C/path%3E%3C/g%3E%3C/svg%3E")no-repeat center;background-size:80%;transform: rotate(-180deg);margin-left:7px;}
.paging .nnext {background:url("data:image/svg+xml,%3Csvg fill='' width='133px' height='133px' viewBox='-1920 -1920 5760.00 5760.00' xmlns='http://www.w3.org/2000/svg' stroke='' stroke-width='192'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round' stroke='%23000000' stroke-width='115.2'%3E%3Cg fill-rule='evenodd'%3E%3Cpath d='M1052 92.168 959.701 0-.234 959.935 959.701 1920l92.299-92.43-867.636-867.635L1052 92.168Z'%3E%3C/path%3E%3Cpath d='M1920 92.168 1827.7 0 867.766 959.935 1827.7 1920l92.3-92.43-867.64-867.635L1920 92.168Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cg fill-rule='evenodd'%3E%3Cpath d='M1052 92.168 959.701 0-.234 959.935 959.701 1920l92.299-92.43-867.636-867.635L1052 92.168Z'%3E%3C/path%3E%3Cpath d='M1920 92.168 1827.7 0 867.766 959.935 1827.7 1920l92.3-92.43-867.64-867.635L1920 92.168Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E")no-repeat center;background-size:80%;transform: rotate(-180deg);margin-right:0;}
.paging a.active {background: var(--point-n);color:#fff;border:1px solid var(--point-n);}


/* footer 팝업 */
/* .pop_wrap {max-width:80rem; max-height:60rem; background:#fff; border: solid 1px #666666; position:fixed; top:50%; left:50%; margin:-30rem 0 0 -40rem; z-index:9999; display:none;font-size:1.6rem;overflow:hidden;overflow-y:auto;}
#mask {width:100%; height:100%; position:fixed; background:rgba(0,0,0,0.7) repeat; top:0; left:0; z-index:999; display:none;} */
.popup-cont01 {width:100%; /* margin: 40px auto; */ padding:2rem;box-sizing:border-box;text-align: left;/* padding-top:8rem; */word-break: keep-all;}
/* .pop_wrap button {position:absolute;top:1.2rem;right:1.8rem;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' fill='%23000000'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cpath fill='%23fff' d='M195.2 195.2a64 64 0 0 1 90.496 0L512 421.504 738.304 195.2a64 64 0 0 1 90.496 90.496L602.496 512 828.8 738.304a64 64 0 0 1-90.496 90.496L512 602.496 285.696 828.8a64 64 0 0 1-90.496-90.496L421.504 512 195.2 285.696a64 64 0 0 1 0-90.496z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E") no-repeat;background-size:contain;width:3rem;height:3rem;z-index:1;} */
.pop_wrap{width:100%;max-width:140rem;margin:4rem auto;}
.pop_wrap strong{color:var(--point-n);}
.pop_wrap .inner{padding-left:1rem;box-sizing:border-box;color:#666;}
.pop_wrap span{display:block;color:var(--bk-8);font-size:1.5rem;padding:0.2rem 0;}
.pop_wrap .inner_line{border:1px solid #ddd;padding:1.5rem;box-sizing:border-box;color:#666;margin:2rem 0;}
.pop_wrap .phead{width:100%;max-width:80rem;height:6rem;line-height:6rem;text-align:center;color:#fff;font-size:2.5rem;background:var(--point-g);position:fixed;}


/* 250618 사이트수정 */
.header h1{background:url(/img/common/logo_toytree_w.png) no-repeat;width:13.5rem;height:3.1rem;background-size:contain;top:2.7rem;}
.header.gnb_enter h1, .header.gnb_enter2 h1{background:url(/img/common/logo_toytree.png) no-repeat;background-size:contain;}


@media screen and (max-width: 1440px){/*PC 작은 모니터*/
    html{font-size:55%;}
}


@media screen and (max-width: 1024px){/*PC 작은 모니터*/
    html{font-size:50%;}
    .header{padding:0 2rem;box-sizing:border-box;}
    .footer{padding:4rem 2rem;box-sizing:border-box;}
}

@media screen and (max-width: 950px){/*PC 작은 모니터*/
    html{font-size:47%;}
    /* header */
    .h_pc{display:none !important;}
    .h_mo{display:block;}
    .header{width:100%;height:7rem;display:flex;justify-content: flex-end;align-items: center;padding:0 2rem;z-index:999;}
    .sub_con{padding-top:7rem;}
    .header.gnb_enter:after, .header.gnb_enter2:after{top:7rem;}
    .header h1{/* width:10.5rem;height:3.9rem; */left:2rem;top:2.1rem;}
    

}
 
@media screen and (max-width: 768px){/*테블릿 사이즈*/
    .pc{display:none;}
    .mo{display:block;}
}

@media screen and (max-width: 640px){/*모바일~테블릿 사이즈*/
    html{font-size:55%;}
    .footer .f_wrap{display:flex;flex-wrap: wrap;}
    .footer .con1{display:flex;margin-bottom:3rem;order:2;}
    .footer .con1 a{padding-right:3rem;}
    .footer .con1 a:last-child{padding-right:0;}
    .footer .con2{order:3;margin-bottom:3rem;}
    .footer .con3{margin-top:0;order:5;}
    .footer .con4{position:relative;top:auto;right:auto;order:1;max-width:none;margin-bottom:3rem;}
    .fs_wrap, .fs_wrap_down{height:5rem;line-height:5rem;}
    .footer .con4 .family{max-width: none;}
    .footer .con5{float:none;position:relative;top:auto;right:auto;order:4;max-width:none;margin-bottom:3rem;}
    }

@media screen and (max-width: 480px){/*모바일 사이즈*/
    html{font-size:62.5%;}
    .fs_wrap, .fs_wrap_down{font-size:1.5rem;}
    .fs_wrap:after, .fs_wrap_down:after{top:2rem;}
    .fs_list{bottom:5rem;}
    .footer .con1, .footer .con2{margin-bottom:2.5rem;}
    .footer .con1 a{font-size:1.3rem;}
    .footer .con2 p{font-size:1.3rem;}
    .con5 .customer span{font-size:1.3rem;}
    .con5 .customer p{font-size:1.7rem;}
    .footer .con3{font-size:1.2rem;}
    .footer .con5{margin-top:0;}
    .top_btn_wrap{right:2rem;bottom:2rem;}

    .popup-cont01{padding-top:0;}


}

@media screen and (max-width: 320px){/*모바일 iPhone5*/

}

