@charset "utf-8";


/* reset */
body, html{ padding:0; margin:0; width:100%; height:100%; position:relative; z-index:1; }
body, input, textarea, select, button, table{
  font-family:'pt','noto', '나눔바른고딕', NanumBarunGothic, ng, '맑은 고딕', 'Malgun Gothic', '돋움', Dotum, '애플 SD 산돌고딕 Neo', 'Apple SD Gothic Neo', AppleGothic, Helvetica, sans-serif !important;
  -webkit-font-smoothing:antialiased
}
body.loaded{ overflow:unset; }
img, fieldset, button { border:0 }
ul, ol, li { margin:0; padding:0; list-style:none }
em, address { font-style:normal }
form, fieldset, h1, h2, h3, h4, h5, h6, p{ margin:0; padding:0; }
img{ max-width:100%; }
a, a:hover, a:active, a:focus{ text-decoration:none; }


/* scrollbar */
body::-webkit-scrollbar{ width:5px; background-color:transparent; position:fixed; z-index:999999; }
body::-moz-scrollbar{ width:5px; background-color:transparent; position:fixed; z-index:999999; }
body::-webkit-scrollbar-track{ background-color:#666; }
body::-moz-scrollbar-track{ background-color:#666; }
body::-webkit-scrollbar-thumb{ background-color:rgba(255, 255, 255, 0.4);  border-radius:20px; }
body::-moz-scrollbar-thumb{ background-color:rgba(255, 255, 255, 0.4);  border-radius:20px; }


/* header */
header{ position:fixed; z-index:9999; top:0; left:0; width:100%; padding:0 40px; transition:0.3s background-color; }
header.scr{ box-shadow:0 0 10px 0 rgba(0,0,0,.25); }
header, header *{ box-sizing:border-box; }
.hd_con{ max-width:1400px; width:100%; margin:0 auto; display:flex; justify-content:space-between; align-items:center; }
.hd_lg{ display:inline-block; margin-right:20px; padding:5px 0; }
.hd_lg > a{ display:block; font-size:0; }
.hd_lg > a:not(:last-child){ margin-right:10px; }
.hd_lg > a > img{ display:block; height:auto; max-height:40px; width:100%; }
.hd_lg > a > svg{ display:block; height:auto; max-height:40px; width:100%; }
.hd_lg > a > svg > *{ fill:#fff; transition:0.3s fill; }
header:hover .hd_lg > a > svg > *,
header.scr .hd_lg > a > svg > *{ fill:#333; }

#gnb{ display:flex; align-items:center; }
#gnb > ul{ font-family:'pt','noto'; font-size:0; }
#gnb > ul > li{ position:relative; z-index:1; display:inline-block; }
#gnb > ul > li > a{ display:block; padding:32px 15px; font-family:'cg','nm'; font-size:20px; font-weight:400; color:#fff; line-height:1em; transition:0.3s padding, 0.3s color; }
header.scr #gnb > ul > li > a{ padding:22px 15px; }
#gnb > ul > li:hover > a{ transition:0.3s color; }
#gnb > ol > li:hover > a{ transition:0.3s color; }
#gnb > ul > li > ul{ position:absolute; z-index:1; top:100%; left:0; min-width:200px; box-shadow:3px 3px 3px 0 rgba(0,0,0,.1); visibility:hidden; opacity:0; transform:translate(0, 10px); transition:0.3s visibility, 0.3s opacity, 0.3s transform; }
#gnb > ul > li:last-child > ul{ left:auto; right:0; }
#gnb > ul > li:hover > ul{ visibility:visible; opacity:1; transform:translate(0, 0); }
#gnb > ul > li > ul > li{ display:block; }
#gnb > ul > li > ul > li > a{ display:block; padding:15px 20px; font-size:16px; color:#fff; font-weight:300; }
#gnb > ul > li > ul > li:hover > a{ transition:0.3s color; }
#gnb > ul > li:last-child > ul > li > a{ text-align:right; }

#gnb > .pc_lang{ display:flex; margin-left:10px; }
#gnb > .pc_lang > li > a{ padding:15px 5px; text-transform:uppercase; font-family:'cg','nm'; font-size:20px; font-weight:400; color:#fff; transition:0.4s color; }
#gnb > .pc_lang > li:last-child > a{ padding:15px 0 15px 5px; }

#gnb > .gnb_add{ position:relative; z-index:1; margin-left:10px; width:40px; height:40px; border-radius:100%; overflow:hidden; cursor:pointer; transition:0.3s background-color; }
#gnb > .gnb_add:hover{ background-color:rgba(150,150,150,.3); }
#gnb > .gnb_add > .add_ic{ position:absolute; width:4px; height:4px; top:50%; left:50%; border-radius:100%; border:2px solid #fff; transform:translate(-50%, -50%); transition:0.3s width 0s, 0.3s height 0s; }
#gnb > .gnb_add > .add_ic:before{ content:''; position:absolute; top:0; left:0; width:4px; height:4px; margin:-10px 0 0 -2px; border-radius:100%; border:2px solid #fff; box-sizing:border-box; transition:0.15s margin 0.3s, 0s visibility 0.15s; }
#gnb > .gnb_add > .add_ic:after{ content:''; position:absolute; top:0; left:0; width:4px; height:4px; margin:6px 0 0 -2px; border-radius:100%; border:2px solid #fff; box-sizing:border-box; transition:0.15s margin 0.3s, 0s visibility 0.15s; }
#gnb > .gnb_add.act > .add_ic{ width:20px; height:20px; transition:0.3s width 0.15s, 0.3s height 0.15s; }
#gnb > .gnb_add.act > .add_ic:before{ margin:-2px 0 0 -2px; visibility:hidden; transition:0.15s margin, 0s visibility 0.15s; }
#gnb > .gnb_add.act > .add_ic:after{ margin:-2px 0 0 -2px; visibility:hidden; transition:0.15s margin, 0s visibility 0.15s; }

.mnb_btn{ display:none; position:relative; z-index:1; width:20px; height:40px; cursor:pointer; transition:0.3s background-color; }
.mnb_btn > .add_ic{ position:absolute; width:4px; height:4px; top:50%; left:50%; border-radius:100%; transform:translate(-50%, -50%); transition:0.3s width 0s, 0.3s height 0s; }
.mnb_btn > .add_ic:before{ content:''; position:absolute; top:0; left:0; width:4px; height:4px; margin:-10px 0 0 -2px; border-radius:100%; box-sizing:border-box; transition:0.15s margin 0.3s, 0s visibility 0.15s; }
.mnb_btn > .add_ic:after{ content:''; position:absolute; top:0; left:0; width:4px; height:4px; margin:6px 0 0 -2px; border-radius:100%; box-sizing:border-box; transition:0.15s margin 0.3s, 0s visibility 0.15s; }
.mnb_btn.act > .add_ic{ width:20px; height:20px; transition:0.3s width 0.15s, 0.3s height 0.15s; }
.mnb_btn.act > .add_ic:before{ margin:-2px 0 0 -2px; visibility:hidden; transition:0.15s margin, 0s visibility 0.15s; }
.mnb_btn.act > .add_ic:after{ margin:-2px 0 0 -2px; visibility:hidden; transition:0.15s margin, 0s visibility 0.15s; }

@media(max-width:1200px){
  #gnb > ul{ margin-right:unset; }
  #gnb > ul > li > a{ padding:32px 12px; }
  header.scr #gnb > ul > li > a{ padding:22px 12px; }
}
@media(max-width:991px){
  header{ position:fixed; padding:0 15px; }
  header.hidden{ margin:0; transition:0s transform; }
  header.hidden.show, header.hidden:hover{ transform:translate(0, 0); }
  .hd_lg{ padding:10px 0; }
  .hd_lg > a > img{ max-height:30px; }
	.hd_lg > a > svg{ height:30px; }
	.hd_lg > a > svg > *{ fill:#333; }

  #gnb{ display:none; }
  .mnb_btn{ display:block; }
}


/* mem_lang */
.add_wrap{ position:fixed; z-index:9999999999999999999; top:-10%; bottom:-10%; left:-10%; right:-10%; background-color:rgba(0,0,0,.5); opacity:0; visibility:hidden; transition:0.7s opacity, 0s visibility 0.7s; }
.add_wrap.act{ opacity:1; visibility:visible; transition:0.7s opacity, 0s visibility; }
.add_wrap, .add_wrap *{ box-sizing:border-box; }
.add{ position:absolute; z-index:1; top:50%; left:50%; width:calc(100vw - 30px); max-width:300px; transform:translate(-50%, -50%); padding:60px 20px 40px; box-shadow:7px 7px 10px 0 rgba(0,0,0,.4); }
.add_cl{ display:block; position:absolute; z-index:1; top:0; right:0; width:40px; height:40px; cursor:pointer; }
.add_cl:before{ content:''; position:absolute; z-index:1; top:50%; left:50%; width:24px; height:1px; transform:translate(-50%, -50%) rotate(45deg); }
.add_cl:after{ content:''; position:absolute; z-index:1; top:50%; left:50%; width:24px; height:1px; transform:translate(-50%, -50%) rotate(-45deg); }

.mem_input{ margin-bottom:20px; }
.mem_input > input{ display:block; position:relative; z-index:1; width:100%; padding:10px 0; border:none; font-size:14px; font-weight:300; }
.mem_input > input:not(:last-child){ margin-bottom:10px; }
.mem_input > input:focus,
.mem_input > input:hover,
.mem_input > input:active{ outline:none; }
.mem_input > input:-webkit-autofill,
.mem_input > input:-webkit-autofill:hover,
.mem_input > input:-webkit-autofill:focus,
.mem_input > input:-webkit-autofill:active{ padding:10px; caret-color:#333; }
.mem_add{ display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.mem_add > .keep_login{ display:flex; align-items:center; font-size:13px; font-weight:300; line-height:1em; }
.mem_add > .keep_login > input[type='checkbox']{ display:none; }
.mem_add > .keep_login > input[type='checkbox'] + label.chk_label{ width:13px; height:13px; margin:0 5px 0 0; border-radius:2px; }
.mem_add > a{ font-size:13px; font-weight:300; line-height:1.1em; }
.mem_btn{ display:flex; flex-flow:row wrap; margin:0 -3px; }
.mem_btn > li{ width:50%; padding:0 3px; }
.mem_btn > li > button{ display:block; width:100%; text-align:center; padding:10px 20px; line-height:1em; font-size:14px; font-weight:400; cursor:pointer; }
.mem_btn > li > a{ display:block; width:100%; text-align:center; padding:10px 20px; line-height:1em; font-size:14px; font-weight:400; cursor:pointer; }
.add_line{ width:100%; margin:30px 0; opacity:0.3; }
.add_lang{ display:block; width:100%; padding:10px 30px 10px 10px; border:none; font-size:14px; font-weight:300; }
.add_lang:hover, .add_lang:focus, .add_lang:active{ outline:none; }
.mem_logged > li{ display:block; }
.mem_logged > li:not(:last-child){ margin-bottom:5px; }
.mem_logged > li > a{ display:block; font-size:14px; font-weight:300; transition:0.3s padding-left, 0.3s color; }
.mem_logged > li:hover > a{ padding-left:10px; }


/* mnb */
#mnb{ position:fixed; z-index:99999999999; top:0; right:0; max-width:300px; width:calc(100% - 40px); height:100%; display:flex; flex-direction:column; justify-content:space-between; transform:translate(105%, 0); box-shadow:0 0 10px 0 rgba(0,0,0,.4); overflow:auto; transition:0.4s transform; }
#mnb, #mnb *{ box-sizing:border-box; }
#mnb::-webkit-scrollbar{ display:none; }
#mnb::-moz-scrollbar{ display:none; }
#mnb.act{ transform:translate(0, 0); }
.mnb_cl{ display:none; position:absolute; z-index:1; top:0; left:0; width:50px; height:50px; cursor:pointer; }
.mnb_cl:before{ content:''; position:absolute; z-index:1; top:50%; left:50%; width:24px; height:1px; transform:translate(-50%, -50%) rotate(45deg); }
.mnb_cl:after{ content:''; position:absolute; z-index:1; top:50%; left:50%; width:24px; height:1px; transform:translate(-50%, -50%) rotate(-45deg); }
.mnb_uu{ padding-bottom:30px; margin-bottom:22px; }
.mnb_lg{ padding:30px 15px 0; }
.mnb_lg > a{ display:block; max-width:150px; width:100%; margin:0 auto; }
.mnb_lg > a > img{ display:block; height:auto; max-height:30px; width:auto; margin:0 auto; }
.mnb_mem{ padding:20px 50px 0; }
.mm_input{ margin-bottom:10px; }
.mm_input > input{ width:100%; padding:5px; font-size:13px; font-weight:300; }
.mm_input > input:last-child{ margin-top:4px; }
.mm_add{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:20px; }
.mm_add > .keep_login{ display:flex; align-items:center; }
.mm_add > .keep_login > input[type='checkbox']{ display:none; }
.mm_add > .keep_login > label{ display:inline-block; }
.mm_add > .keep_login > .chk_label{ margin-right:5px; width:12px; height:12px; border-radius:2px; }
.mm_add > .keep_login > .title_label{ font-size:13px; font-weight:400; line-height:1em; }
.mm_add > a{ font-size:13px; font-weight:400; line-height:1em; }
.mm_btn{ display:flex; margin:0 -2px; }
.mm_btn > li{ width:50%; padding:0 2px; }
.mm_btn > li > button{ display:block; width:100%; padding:5px; text-align:center; border-radius:3px; font-size:13px; font-weight:300; }
.mm_btn > li > a{ display:block; width:100%; padding:5px; text-align:center; border-radius:3px; font-size:13px; font-weight:300; }
.mm_logged{ display:flex; align-items:center; justify-content:center; }
.mm_logged > li{ padding:0 5px; }
.mm_logged > li > a{ text-align:center; display:block; font-size:13px; font-weight:300; line-height:1em; }

.gnb_menu{ padding:0 0 30px; }
.gnb_menu > ul > li > a{ display:block; padding:10px 15px; font-family:'cg','nm'; font-size:20px; font-weight:300; text-align:center; }
/* .gnb_menu > ul > li > a.more{ padding:10px 36px 10px 15px; } */
.gnb_menu > ul > li > ul{ display:none; }
.gnb_menu > ul > li > ul > li > a{ display:block; padding:10px 15px 10px 20px; font-size:14px; font-weight:300; text-align:center;; }
/* .gnb_menu > ul > li > ul > li > a.more{ padding:10px 36px 10px 20px; } */
.gnb_menu > ul > li > ul > li > ul{ display:none; }
.gnb_menu > ul > li > ul > li > ul > li > a{ display:block; padding:10px 15px 10px 25px; font-size:14px; font-weight:300; }
.mnb_lang{ padding:0 15px 30px; }
.mnb_lang > select{ display:block; width:100%; padding:10px 30px 10px 10px; border:none; font-size:14px; font-weight:300; }
.mnb_lang > select:hover, .mnb_lang > select:focus, .mnb_lang > select:active{ outline:none; }

#mnb.Light{ background-color:#ffffff; }
#mnb.Light .mnb_cl:before{ background-color:#1f1f1f; }
#mnb.Light .mnb_cl:after{ background-color:#1f1f1f; }
#mnb.Light .mnb_uu{ border-bottom:1px solid #ddd; }
#mnb.Light .mm_input > input{ border:1px solid #ddd; border-radius:3px; background-color:#efefef; color:#1f1f1f; }
#mnb.Light .mm_input > input::placeholder{ color:#1f1f1f; }
#mnb.Light .mm_add > .keep_login > .chk_label{ border:1px solid #888; }
#mnb.Light .mm_add > .keep_login > .title_label{ color:#1f1f1f; }
#mnb.Light .mm_add > a{ color:#1f1f1f; }
#mnb.Light .mm_btn > li > a{ background-color:#ddd; color:#1f1f1f; }
#mnb.Light .mm_logged > li:not(:last-child){ border-right:1px solid #ccc; }
#mnb.Light .mm_logged > li > a{ color:#1f1f1f; }
#mnb.Light .gnb_menu > ul > li > a{ color:#1f1f1f; }
#mnb.Light .gnb_menu > ul > li > a.act,
#mnb.Light .gnb_menu > ul > li:hover > a,
#mnb.Light .gnb_menu > ul > li:focus > a,
#mnb.Light .gnb_menu > ul > li:active > a{ background-color:#f9f9f9; }
#mnb.Light .gnb_menu > ul > li > ul{ background-color:#efefef; box-shadow:inset 0 10px 10px -10px #ddd; }
#mnb.Light .gnb_menu > ul > li > ul > li > a{ color:#1f1f1f; }
#mnb.Light .gnb_menu > ul > li > ul > li > ul{ background-color:#ddd; box-shadow:inset 0 10px 10px -10px #ccc; }
#mnb.Light .gnb_menu > ul > li > ul > li > ul > li > a{ color:#1f1f1f; }
#mnb.Light .mnb_lang > select{ background-color:#efefef; color:#1f1f1f; }

#mnb.Dark{ background-color:#1f1f1f; }
#mnb.Dark .mnb_cl:before{ background-color:#888; }
#mnb.Dark .mnb_cl:after{ background-color:#888; }
#mnb.Dark .mnb_uu{ border-bottom:1px solid #555; }
#mnb.Dark .mm_input > input{ border:1px solid #444; border-radius:3px; background-color:#333; color:#fff; }
#mnb.Dark .mm_input > input::placeholder{ color:#aaa; }
#mnb.Dark .mm_add > .keep_login > .chk_label{ border:1px solid #aaa; }
#mnb.Dark .mm_add > .keep_login > .title_label{ color:#aaa; }
#mnb.Dark .mm_add > a{ color:#aaa; }
#mnb.Dark .mm_btn > li > a{ background-color:#ddd; color:#1f1f1f; }
#mnb.Dark .mm_logged > li:not(:last-child){ border-right:1px solid #ddd; }
#mnb.Dark .mm_logged > li > a{ color:#ddd; }
#mnb.Dark .gnb_menu > ul > li > a{ color:#fff; }
#mnb.Dark .gnb_menu > ul > li > a.act,
#mnb.Dark .gnb_menu > ul > li:hover > a,
#mnb.Dark .gnb_menu > ul > li:focus > a,
#mnb.Dark .gnb_menu > ul > li:active > a{ background-color:#444; }
#mnb.Dark .gnb_menu > ul > li > ul{ background-color:#333; box-shadow:inset 0 10px 10px -10px #222; }
#mnb.Dark .gnb_menu > ul > li > ul > li > a{ color:#ddd; }
#mnb.Dark .gnb_menu > ul > li > ul > li > ul{ background-color:#222; box-shadow:inset 0 10px 10px -10px #111; }
#mnb.Dark .gnb_menu > ul > li > ul > li > ul > li > a{ color:#ddd; }
#mnb.Dark .mnb_lang > select{ background-color:#444; color:#ddd; }


/* footer */
footer{ position:relative; background-color:#fff; border-top:1px solid #ddd; padding:80px 40px; }
footer, footer *{ box-sizing:border-box; }
.ft_up{ position:absolute; z-index:1; top:0; left:50%; transform:translate(-50%, -50%); border:1px solid #ddd; background-color:#fff; border-radius:100%; text-align:center; font-size:16px; color:#333; padding:20px; }
.ft_up:after{ content:''; position:absolute; top:50%; left:50%; transform:translate(-50%, -25%) rotate(-45deg); width:10px; height:10px; border-top:1px solid #333; border-right:1px solid #333; }
.ft_con{ max-width:1400px; width:100%; margin:0 auto; }
.ft_pt{ width:50%; padding:0 15px; word-break:break-all; }
.ft_lg{ max-width:106px; margin:0 auto 20px; }
.ft_lg > a{ display:block; }
.ft_lg > a > img{ display:block; height:auto; max-height:100px; width:100% }
.ft_lg > a > svg{ display:block; height:auto; max-height:100px; width:100% }
.ft_lg > a > svg > *{ fill:#888; }

.fnb{ overflow:hidden; text-align:center; margin:0 auto 10px; }
.fnb > li{ display:inline-block; margin-left:15px; }
.fnb > li:first-child{ margin-left:0; }
.fnb > li > a{ display:block; font-size:14px; font-weight:300; color:#888; }

.ft_if{ font-size:14px; font-weight:300; color:#888; text-align:center; line-height:1.5em; }
.ft_cp{ font-size:14px; font-weight:300; color:#888; text-align:center; line-height:1.5em; }

@media(max-width:991px){
  footer{ padding:80px 15px; }
}