@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-display: swap;
  src: url("../fonts/NotoSans-Regular.woff2") format("woff2"), url("../fonts/NotoSans-Regular.woff") format("woff");
}
@font-face {
  font-family: "Lato";
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Lato-Regular.woff2") format("woff2"), url("../fonts/Lato-Regular.woff") format("woff");
  unicode-range: U+0030-0039, U+0041-005A, U+0061-007A;
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/NotoSans-Light.woff2") format("woff2"), url("../fonts/NotoSans-Light.woff") format("woff");
}
@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/Lato-Light.woff2") format("woff2"), url("../fonts/Lato-Light.woff") format("woff");
  unicode-range: U+0030-0039, U+0041-005A, U+0061-007A;
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/NotoSans-Regular.woff2") format("woff2"), url("../fonts/NotoSans-Regular.woff") format("woff");
}
@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/Lato-Regular.woff2") format("woff2"), url("../fonts/Lato-Regular.woff") format("woff");
  unicode-range: U+0030-0039, U+0041-005A, U+0061-007A;
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/NotoSans-Medium.woff2") format("woff2"), url("../fonts/NotoSans-Medium.woff") format("woff");
}
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/NotoSans-Bold.woff2") format("woff2"), url("../fonts/NotoSans-Bold.woff") format("woff");
}
@font-face {
  font-family: "Lato";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/Lato-Bold.woff2") format("woff2"), url("../fonts/Lato-Bold.woff") format("woff");
  unicode-range: U+0030-0039, U+0041-005A, U+0061-007A;
}
@font-face {
  font-family: "Lato";
  font-weight: 700;
  src: url("../fonts/Lato-Bold.woff2") format("woff2"), url("../fonts/Lato-Bold.woff") format("woff");
  unicode-range: U+0030-0039, U+0041-005A, U+0061-007A;
}
@font-face {
  font-family: "Lato";
  font-weight: 800;
  src: url("../fonts/Lato-Black.woff2") format("woff2"), url("../fonts/Lato-Black.woff") format("woff");
  unicode-range: U+0030-0039, U+0041-005A, U+0061-007A;
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Poppins-ExtraLight.woff2") format("woff2"), url("../fonts/Poppins-ExtraLight.woff") format("woff");
}
@font-face {
  font-family: "Poppins md";
  font-style: normal;
  font-display: swap;
  src: url("../fonts/Poppins-Medium.woff2") format("woff2"), url("../fonts/Poppins-Medium.woff") format("woff");
}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  margin: 0;
  font-family: "Lato", "Noto Sans KR", "sans-serif";
  font-size: 16px;
}
ul,
ol,
li {
  margin: 0;
  padding: 0;
  list-style: none;
}
input, textarea {font-family: "Lato", "Noto Sans KR", "sans-serif";}
dl,
dt,
dd {
  margin: 0;
}
em {
  font-style: normal;
  display: inherit;
}
button {
  border: 0;
  margin: 0;
  padding: 0;
  font-family: "Lato", "Noto Sans KR", "sans-serif";
  cursor: pointer;
}
::placeholder {color:#969696;}
p {
  margin: 0;
}
a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

.blur {
  -webkit-filter: blur(5px);
  filter: blur(5px);
}
.w_auto {
  width: auto !important;
}
.w_100p {
  width: 100% !important;
}
.w_50p {
  width: 50% !important;
}
.w_33p {
  width: 33.3% !important;
}
.w_0 {
  width: 0 !important;
}
.w_28 {
  width: 28px !important;
}
.w_84 {
  width: 84px !important;
}
.w_90 {
  width: 90px !important;
}
.w_100 {
  width: 100px !important;
}
.w_105 {
  width: 105px !important;
}
.w_74 {
  width: 74px !important;
}
.w_80 {
  width: 80px !important;
}
.w_110 {
  width: 110px !important;
}
.w_112 {
  width: 112px !important;
}
.w_120 {
  width: 120px !important;
}
.w_130 {
  width: 130px !important;
}
.w_132 {
  width: 132px !important;
}
.w_135 {
  width: 135px !important;
}
.w_140 {
  width: 140px !important;
}
.w_156 {
  width: 156px !important;
}
.w_160 {
  width: 160px !important;
}
.w_170 {
  width: 170px !important;
}
.w_180 {
  width: 180px !important;
}
.w_142 {
  width: 142px !important;
}
.w_196 {
  width: 196px !important;
}
.w_200 {
  width: 200px !important;
}
.w_220 {
  width: 220px !important;
}
.w_240 {
  width: 240px !important;
}
.w_260 {
  width: 240px !important;
}
.w_270 {
  width: 270px !important;
}
.w_280 {
  width: 280px !important;
}
.w_304 {
  width: 304px !important;
}
.w_340 {
  width: 340px !important;
}
.w_360 {
  width: 360px !important;
}
.w_400 {
  width: 400px !important;
}
.w_450 {
  width: 450px !important;
}
.w_496 {
  width: 496px !important;
}
.w_650 {
  width: 650px !important;
}
.w_680 {
  width: 680px !important;
}
.w_695 {
  width: 695px !important;
}
.w_730 {
  width: 730px !important;
}
.w_880 {
  width: 860px !important;
}
.w_1136 {
  width: 1136px !important;
}
.w_1200 {
  width: 1200px !important;
}
.w_1230 {
  width: 1230px !important;
}
.w_1500 {
  width: 1500px !important;
}
.min_auto {
  min-width: auto !important;
}
.min_40 {
  min-width: 40px !important;
}
.min_45 {
  min-width: 45px !important;
}
.min_54 {
  min-width: 54px !important;
}
.min_62 {
  min-width: 62px !important;
}
.min_74 {
  min-width: 74px !important;
}
.min_82 {
  min-width: 82px !important;
}
.min_90 {
  min-width: 90px !important;
}
.min_106 {
  min-width: 106px !important;
}
.min_100 {
  min-width: 100px !important;
}
.min_110 {
  min-width: 110px !important;
}
.min_140 {
  min-width: 140px !important;
}
.min_144 {
  min-width: 144px !important;
}
.min_150 {
  min-width: 150px !important;
}
.min_180 {
  min-width: 180px !important;
}
.min_200 {
  min-width: 200px !important;
}
.min_260 {
  min-width: 260px !important;
}
.min_280 {
  min-width: 280px !important;
}
.min_410 {
  min-width: 410px !important;
}
.min_450 {
  min-width: 450px !important;
}
.min_500 {
  min-width: 500px !important;
}
.min_515 {
  min-width: 515px !important;
}
.min_586 {
  min-width: 586px !important;
}
.h_100p {
  height:100% !important;
}
.h_160 {
  height: 154px !important;
}
.h_280 {
  height: 280px !important;
}
.pt_0 {
  padding-top: 0 !important;
}
.pt_24 {
  padding-top: 24px !important;
}
.pt_50 {
  padding-top: 50px !important;
}
.pr_0 {
  padding-right: 0 !important;
}
.pr_4 {
  padding-right: 4px !important;
}
.pb_0 {
  padding-bottom: 0 !important;
}
.pl_0 {
  padding-left: 0 !important;
}
.pl_24 {
  padding-left: 24px !important;
}
.pl_30 {
  padding-left: 30px !important;
}
.pr_10 {
  padding-right: 10px !important;
}
.margin_at {
  margin: 0 auto !important;
}
.m_0 {
  margin: 0 !important;
}
.mt_0 {
  margin-top: 0 !important;
}
.mt_4 {
  margin-top: 4px !important;
}
.mt_6 {
  margin-top: 4px !important;
}
.mt_8 {
  margin-top: 8px !important;
}
.mt_10 {
  margin-top: 10px !important;
}
.mt_12 {
  margin-top: 12px !important;
}
.mt_16 {
  margin-top: 16px !important;
}
.mt_18 {
  margin-top: 18px !important;
}
.mt_20 {
  margin-top: 20px !important;
}
.mt_24 {
  margin-top: 24px !important;
}
.mt_25 {
  margin-top: 25px !important;
}
.mt_28 {
  margin-top: 28px !important;
}
.mt_30 {
  margin-top: 30px !important;
}
.mt_32 {
  margin-top: 32px !important;
}
.mt_36 {
  margin-top: 36px !important;
}
.mt_40 {
  margin-top: 40px !important;
}
.mt_45 {
  margin-top: 45px !important;
}
.mt_48 {
  margin-top: 48px !important;
}
.mt_50 {
  margin-top: 50px !important;
}
.mt_60 {
  margin-top: 60px !important;
}
.mt_64 {
  margin-top: 64px !important;
}
.mt_70 {
  margin-top: 70px !important;
}
.mt_76 {
  margin-top: 76px !important;
}
.mt_80 {
  margin-top: 80px !important;
}
.mt_90 {
  margin-top: 90px !important;
}
.mt_100 {
  margin-top: 100px !important;
}
.mt_150 {
  margin-top: 150px !important;
}
.mr_0 {
  margin-right: 0 !important;
}
.mr_4 {
  margin-right: 4px !important;
}
.mr_8 {
  margin-right: 8px !important;
}
.mr_10 {
  margin-right: 10px !important;
}
.mr_12 {
  margin-right: 12px !important;
}
.mr_24 {
  margin-right: 24px !important;
}
.mb_0 {
  margin-bottom: 0 !important;
}
.mb_8 {
  margin-bottom: 8px !important;
}
.mb_12 {
  margin-bottom: 12px !important;
}
.mb_15 {
  margin-bottom: 15px !important;
}
.mb_16 {
  margin-bottom: 16px !important;
}
.mb_18 {
  margin-bottom: 18px !important;
}
.mb_20 {
  margin-bottom: 20px !important;
}
.mb_24 {
  margin-bottom: 24px !important;
}
.mb_25 {
  margin-bottom: 25px !important;
}
.mb_26 {
  margin-bottom: 26px !important;
}
.mb_30 {
  margin-bottom: 30px !important;
}
.mb_40 {
  margin-bottom: 40px !important;
}
.mb_48 {
  margin-bottom: 48px !important;
}
.mb_50 {
  margin-bottom: 50px !important;
}
.mb_60 {
  margin-bottom: 60px !important;
}
.mb_80 {
  margin-bottom: 80px !important;
}
.mb_100 {
  margin-bottom: 100px !important;
}
.ml_0 {
  margin-left: 0 !important;
}
.ml_4 {
  margin-left: 4px !important;
}
.ml_6 {
  margin-left: 6px !important;
}
.ml_8 {
  margin-left: 8px !important;
}
.ml_10 {
  margin-left: 10px !important;
}
.ml_12 {
  margin-left: 12px !important;
}
.ml_16 {
  margin-left: 16px !important;
}
.ml_17 {
  margin-left: 17px !important;
}
.ml_20 {
  margin-left: 20px !important;
}
.ml_22 {
  margin-left: 22px !important;
}
.ml_24 {
  margin-left: 24px !important;
}
.ml_40 {
  margin-left: 40px !important;
}
.ml_56 {
  margin-left: 56px !important;
}
.ml_60 {
  margin-left: 60px !important;
}
.ml_62 {
  margin-left: 62px !important;
}
.ml_64 {
  margin-left: 64px !important;
}
.ml_75 {
  margin-left: 75px !important;
}
.ml_90 {
  margin-left: 90px !important;
}
.ml_95 {
  margin-left: 95px !important;
}
.ml_100 {
  margin-left: 100px !important;
}
.ml_130 {
  margin-left: 130px !important;
}
.fw_3 {
  font-weight: 300 !important;
}
.fw_4 {
  font-weight: 400 !important;
}
.fw_5 {
  font-weight: 500 !important;
}
.fw_6 {
  font-weight: 600 !important;
}
.fw_7 {
  font-weight: 700 !important;
}
.fw_8 {
  font-weight: 800 !important;
}
.fw_n {
  font-weight: normal !important;
}
.fs_12 {
  font-size: 12px !important;
}
.fs_14 {
  font-size: 14px !important;
}
.fs_16 {
  font-size: 16px !important;
}
.fs_18 {
  font-size: 18px !important;
}
.fs_20 {
  font-size: 20px !important;
}
.fs_24 {
  font-size: 24px !important;
}
.fc_1 {
  color: #ff5d5d !important;
}
.fc_2 {
  color: #10a1a7 !important;
}
.fc_3 {
  color: #30aaff !important;
}
.fc_4 {
  color: #172a88 !important;
}
.fc_5 {
  color: dimgray !important;
}
.fc_6 {
  color: #1ab7b7 !important;
}
.fc_7 {
  color: #000 !important;
}
.fc_8 {
  color: #666 !important;
}
.fc_9 {
  color: #999 !important;
}
.fc_10 {
  color: #e23751 !important;
}
.fc_11 {
  color: #067ab4 !important;
}
.back_f {
  background-color: #fff !important;
}
.po_r {
  position: relative !important;
}
.po_a {
  position: absolute !important;
}
.po_t_10 {
  top: -10px;
}
.underline {
  text-decoration: underline !important;
}
.ta_c {
  text-align: center !important;
}
.ta_l {
  text-align: left !important;
}
.ta_r {
  text-align: right !important;
}
.nowrap {
  white-space: nowrap !important;
}
.keep_all {
  word-break: keep-all !important;
}
.fx_none {
  -webkit-box-flex: 0 !important;
  -moz-box-flex: 0 !important;
  -ms-flex: none !important;
  flex: none !important;
}
.fx_auto {
  -webkit-box-flex: 1 !important;
  -moz-box-flex: 1 !important;
  -ms-flex: auto !important;
  flex: auto !important;
}
.fx_dis {
  display: -webkit-box !important;
  display: -moz-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.fx_dis > *:nth-child(1) {
  width: 400px;
}
.fx_dis > *:nth-child(2) {
  margin-left: 4px;
}
.fx_bet {
  display: -webkit-box !important;
  display: -moz-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: justify !important;
  -moz-box-pack: justify !important;
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}
.fx_end {
  display: -webkit-box !important;
  display: -moz-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-pack: end !important;
  -moz-box-pack: end !important;
  -ms-flex-pack: end !important;
  justify-content: flex-end !important;
}
.al_center {
  -webkit-box-align: center !important;
  -moz-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
}
.al_stretch {
  -webkit-box-align: stretch !important;
  -moz-box-align: stretch !important;
  -ms-flex-align: stretch !important;
  align-items: stretch !important;
}
.al_start {
  -webkit-box-align: start !important;
  -moz-box-align: start !important;
  -ms-flex-align: start !important;
  align-items: flex-start !important;
}
.gap_20 {
  gap: 20px !important;
}
.gap_12 {
  gap: 12px !important;
}
.jc_fx_end {
  -webkit-box-pack: end !important;
  -moz-box-pack: end !important;
  -ms-flex-pack: end !important;
  justify-content: flex-end !important;
}
.ver_t {
  vertical-align: top !important;
}
.ver_m {
  vertical-align: middle !important;
}
.ver_b {
  vertical-align: bottom !important;
}
.dis_block {
  display: block !important;
}
.dis_in_block {
  display: inline-block !important;
}
.border-leftN {
  border-left:none !important;
}
.flex_wrap {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.flex_wrap.flex_end {
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}
.flex_wrap.center {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.flex_wrap.col {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.flex_wrap.for_lb_cont {
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  gap: 24px;
}
.flex_wrap.for_lb_cont > .lb_cont {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-box-pack: stretch;
  -moz-box-pack: stretch;
  -ms-flex-pack: stretch;
  justify-content: stretch;
  width: 100%;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: auto;
  flex: auto;
  margin: 0 !important;
}
.flex_wrap.for_lb_cont > .lb_cont > h4 {
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex: none;
  flex: none;
}
.flex_wrap.for_lb_cont > .lb_cont > .g_box_wp {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: auto;
  flex: auto;
}
.flex_wrap.for_lb_cont_col2 {
  position: relative;
  -webkit-box-align: stretch;
  -moz-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  gap: 24px;
}
.flex_wrap.for_lb_cont_col2 > .col {
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex: none;
  flex: none;
  width: calc(50% - 12px);
  position: relative;
}
.flex_wrap.for_lb_cont_col2 > .col .lb_cont {
  width: 100%;
  margin: 0;
}
.g_4 {
  gap: 4px;
}
.g_8 {
  gap: 8px;
}
.g_10 {
  gap: 10px;
}
.g_12 {
  gap: 8px;
}
.g_16 {
  gap: 16px;
}
.g_20 {
  gap: 20px;
}
.g_24 {
  gap: 24px;
}
.g_32 {
  gap: 32px;
}
.g_40 {
  gap: 40px;
}




/* header */
header {padding:0 70px; height:105px; position: absolute; top: 0; z-index: 100; left: 0; right: 0; height:105px}
header .inner {height:100%; background:url(../img/common/top-line.png) repeat-x 0 bottom;}
header .inner h1 {padding-right:70px;}
header .inner .logo-box {position:absolute; top:36px; display:flex;}
header .inner nav {position:absolute; left:500px; top:0;}
.en header .inner nav {left:645px;}
header .inner nav > ul {display:flex;}
header .inner nav > ul > li {margin-left:75px; position:relative}
.en header .inner nav > ul > li {margin-left:55px;}
header .inner nav > ul > li > a {color:#fff; font-size:16px; display:flex; height:105px; box-sizing:border-box; padding-top:43px;}
header .inner nav > ul > li > a:hover,
header .inner nav > ul > li > a.on {border-bottom:2px solid #ffffff;}
header .inner nav .depth2 {display:none; position:absolute; top:104px; left:10px; width:500px;}
header .inner nav li.active .depth2 {display:block}
header .inner nav .depth2 li {float:left;}
header .inner nav .depth2 li a {font-size:15px; color:rgba(255,255,255, .6); display:block; padding-right:25px; padding-top:22px;}
header .inner nav .depth2 li.active a,
header .inner nav .depth2 li a:hover,
header .inner nav .depth2 li a:focus {color:rgba(255,255,255, 1);}
header .inner .lang {position:absolute; right:70px; top:43px;}
header .inner .lang button {color:#fff; font-size:16px; background:transparent; display: flex; align-items: center;}
header .inner .lang button i.globe {font-size:23px;}
header .inner .lang span {padding:0 10px 0 2px; font-weight:600;}
header .inner .lang .lang-list {margin-top:5px; display:none;} /* 이벤트 */
header .inner .lang .lang-list li {text-align:center; padding:2px 0}
header .inner .lang .lang-list li a {font-weight:600; color:#fff; opacity: .5;}
header .inner .lang .lang-list li a:hover,
header .inner .lang .lang-list li a.active {opacity:1;}
header .inner .search-wrap {position:absolute; right:175px; top:45px; width:22px; height:22px; font-size:0}
header .inner .search-wrap button {background:url(../img/icon/top-search.png) no-repeat 0 0; width:22px; height:22px; font-size:0} 
header .inner .top-famsite button {color:#fff; font-size:15px; font-weight:400; background:transparent; border:1px solid #f3f3f3; border-radius:50px; padding:8px 21px;} 
header .inner .top-famsite button i {padding-left:10px;}
header .inner .top-famsite .list-famsite {display:none; border:1px solid #f3f3f3; border-radius:15px; margin-top:10px;} /* 이벤트 */
header .inner .top-famsite .list-famsite > ul {padding:10px 0;}
header .inner .top-famsite .list-famsite li a {color:rgba(255,255,255, .7); font-weight:100; font-size:15px; padding:3px 21px; display: block; font-weight:400}
header .inner .top-famsite .list-famsite li a:hover {color:rgba(255,255,255, 1); }

/* header - search-modal*/
.search-pop.active {background:rgba(0,0,0,0.5); pointer-events:auto}
.search-pop {position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0); transition: background-color .5s ease-in-out; pointer-events: none;}
.search-pop.active .search-pop-wrap {top:0}
.search-pop .search-pop-wrap {position:fixed; top:-100vh; right:0; left:0; background:#fff; padding-top:75px; padding-bottom:95px; text-align:center; transition: top .5s ease-in-out;}
.search-pop .search-pop-wrap .search-text {color:#000; font-size:50px; font-weight:700; padding-bottom:40px;}
.search-pop .search-pop-wrap .search-form {display:flex; justify-content: center;}
.search-pop .search-pop-wrap .search-input-wrap {position:relative; width:600px;}
.search-pop .search-pop-wrap .search-input-wrap .search-input {width:100%; height:60px; border:2px solid #0959d1; border-radius:50px; padding:0 35px; font-size:20px; color:#000; font-weight:400;}
.search-pop .search-pop-wrap .close-btn {position:absolute; right:40px; top:30px; background:none;}
.search-pop .search-pop-wrap .close-btn i {font-size:37px; background:none}
.search-pop .search-input-wrap .search-clear-btn {display:flex; align-items: center; justify-content: center; position:absolute; top:16px; right:85px; background:#efefef; width:30px; height:30px; border-radius: 100%;}
.search-pop .search-input-wrap .search-btn {position:absolute; top:18px; right:40px; font-size:0; background:url(../img/icon/icon-search.png) no-repeat 0 0; width:27px; height:26px;}

/* header - scroll hover */
  header.active {background-color:
#fff; 
border-bottom:1px
solid 
#e5e5e5}

  header.active
.inner 
nav ul
li a {color:#222;}

  header.active
.inner 
.lang button {color:#222}

  header.active
.inner 
.search-wrap 
button {background:url(../img/icon/top-search-on.png)
no-repeat 
0 0}

  header.active
.inner 
.top-famsite 
button {color:#000;
border:1px
solid 
#ccc}

  header.active
.inner 
nav ul
li a:hover {border-bottom:2px
solid 
#0052ce; color:#0052ce}

  header.active
.inner 
.top-famsite 
.list-famsite {background:#ffffff;
border:1px
solid 
#ccc;}

  header.active
.inner 
.top-famsite 
.list-famsite 
li a {color:#888}

  header.active
.inner 
.top-famsite 
.list-famsite 
li a:hover {color:#000000}

  header.active
.inner 
.lang .lang-list
li a {color:#222222}

/* footer */
footer {background:#1d1e21; width:100%; padding:40px 0; margin-top:130px}
.main-wrap footer {margin-top:0}
.intro-wrap footer {margin-top:0}
.login footer {position:fixed; bottom:0}
footer .inner {padding:0 70px; display:flex; justify-content: space-between; align-items: center;}
.en footer .inner {align-items:flex-start;}
.intro-wrap footer .inner {justify-content: flex-start;}
footer .inner .foot-left {display:flex;}
.copy-wrap,
.copy-wrap .admin {display:flex; align-items: center;}
.copy-wrap .admin a {color:#888; font-size:13px; padding-left:20px}
footer .inner h2 {padding-right:70px;}
footer .inner .contact {display:flex; padding-bottom:6px;}
.en footer .inner .contact {display:block; width:820px; overflow: hidden;}
footer .contact li:first-child {padding-left:0}
.en footer .contact li:first-child {background:none;}
.en footer .contact li:nth-child(2) {padding-left:0}
footer .contact li:last-child {background:none;}
footer .contact li {font-size:13px; font-weight: 100; color:#ffffff; background:url(../img/common/footer-bar.png) no-repeat right center; padding:0 13px 0 11px}
.en footer .contact li {float:left}
footer .contact li strong {font-weight: 400;}
footer .copy {font-size:13px; color:#888888; font-weight: 500;}
footer .btn-famsite {}
.en footer .btn-famsite {width:150px;}
footer .btn-famsite i {padding-left:33px}
footer .fam-list {margin-top:5px; display:none} /* 이벤트 */
footer .fam-list li a {padding-top:5px; padding-bottom:5px; display:block; }
.footer-famsite {color:#ffffff; font-size:13px; font-weight:200; display:flex; gap:8px; padding-right:100px;}
.footer-famsite li a {color:#e9e9e9; font-size:13px; font-weight:300}
.footer-famsite li a:hover {color:#ffffff;} 
.footer-famsite li:last-child {position:relative;}
.footer-famsite > li > a,
.footer-famsite button {border:1px solid #808080; padding:9px 20px; display:block; color:#ffffff; font-size:13px; font-weight:300}
.footer-famsite button {background:transparent}
.footer-famsite li .fam-list {width:100%; position:absolute; bottom:calc(100% - 1px); border: 1px solid #808080;padding: 9px 13px; background-color: rgba(47,49,53, .6);}

/* scroll Top */
#scroll_top {display:none; position:fixed; right:70px; bottom:40px; z-index:100}
#scroll_top a {display:flex; align-items: center; justify-content: center; width:40px; height:40px; border-radius:100%; background:rgba(28,102,241,.5);}
#scroll_top a:hover, #scroll_top a:hover {background:rgba(28,102,241,1);}
#scroll_top a i {color:#fff; font-size:20px}

/* pop */
.pop-wrap {position:absolute; top:50px; left:50px; z-index:100; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
.pop-wrap .pop-content {display:flex; flex-direction: column; width:100%; max-width:900px; max-height:100%; background:#fff; overflow:hidden;}
.pop-wrap.center {width:100%; display: flex; align-items: center; justify-content: center; top: 0; left: 0; z-index: 100; height: 100vh; position:fixed; box-shadow: none;}
.pop-wrap.center .pop-content {width:440px; border:1px solid #cfcfcf; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
    /*pop 사이즈*/
.pop1-lg .pop-content {width:850px;}
.pop1-md .pop-content {width:700px;}
.pop1-sm .pop-content {width:560px;}
.pop1-ss .pop-content {width:375px;}

.pop-wrap .pop-content .tit {width:100%; height:65px; background: linear-gradient(90deg, rgba(44,139,235,1) 0%, rgba(79,54,205,1) 100%); color:#fff; font-size:22px; font-weight:500;
    position:relative; display:flex; align-items: center; justify-content: center;
}
.pop-wrap .pop-content .tit button {background:none; position:absolute; right:28px; height:20px; line-height:0; font-size:0}
.pop-wrap .pop-content .tit button i {color: #fff; font-size:22px;}
.pop-wrap .pop-content .layer-cnt {padding:30px;}
.pop-wrap .pop-content .layer-cnt .cnt01 {color:#222; font-size:19px; font-weight:500; line-height:1.3; padding-bottom:25px;}
.pop-wrap .pop-content .layer-cnt .cnt01-1 {color:#222; font-size:19px; font-weight:500; line-height:1.3; border-bottom:1px solid #e3e3e3; padding-bottom:30px; margin-bottom:25px;}
.pop-wrap .pop-content .layer-cnt .cnt02 {color:#222; font-size:16px; font-weight:400; line-height:1.3; padding-bottom:10px}
.pop-wrap .pop-content .layer-cnt .cnt03 {color:#888; font-size:16px; font-weight:400; line-height:1.5;}
.pop-wrap .pop-content .bottom {background:#f4f4f4;}
.pop-wrap .pop-content .notice-area {display: flex; height:53px; align-items: center; justify-content: space-between; padding:0 30px; font-size:15px;}
.pop-wrap .pop-content .notice-area .layer-close {background:transparent; }
.pop-wrap .pop-content .notice-area .layer-close:hover {color:#0052ce}
.btn-area {display:flex; align-items: center; justify-content: center; gap:7px; padding:10px 0 40px}
.btn-area button {border:1px solid #205fd6; border-radius:50px; padding:0 55px; height:47px; color:#205fd6; background:transparent; font-size:15px; font-weight:500}
.btn-area.btn1 {padding:0 0 40px}
.btn-area.btn2 {padding:0 0 40px}
.btn-area.btn2 .full-btn {background:#205fd6; color:#fff;}
.btn-area.btn2 button {height:47px; padding:0 45px}

/*sub 공통*/
.subtop-container {width:100%; position:relative;}
.subtop-container > .inner {width:100%; height:581px;}
.subtop-container > .inner h2 {text-align:center; color:#fff; font-size:58px; font-weight: 700; padding-top:245px;}
.subtop-container .sub1 {background:url(../img/common/subtop01.jpg) no-repeat center 0; width:100%; height:581px; }
.subtop-container .sub2 {background:url(../img/common/subtop02.jpg) no-repeat center 0; width:100%; height:581px; }
.subtop-container .sub3 {background:url(../img/common/subtop03.jpg) no-repeat center 0; width:100%; height:581px; }
.subtop-container .sub4 {background:url(../img/common/subtop04.jpg) no-repeat center 0; width:100%; height:581px; }
.subtop-container .sub5 {background:url(../img/common/subtop05.jpg) no-repeat center 0; width:100%; height:581px; }
.subtop-container .navi-wrap {position:absolute; left:0; bottom:0; width:100%;}
.subtop-container .navi-wrap .inner {display:flex; justify-content: space-between; align-items: center; height:78px; }
.subtop-container .navi-wrap .navi-list > ul {display:flex; color:#fff;}
.subtop-container .navi-wrap .navi-list > ul > li > a {display:flex; height:78px; align-items:center; padding:0 75px;}
.subtop-container .navi-wrap .navi-list > ul > li > a:hover {color:#e2f4ff;}
.subtop-container .navi-wrap .navi-list > ul > li.active > a {background:#fff; color:#000; font-weight:500;}
.subtop-container .navi-wrap .breadcrumb {color:#fff; display: flex; gap:7px; align-items: center; font-size:14px; font-weight:200}

/*sub 공통*/
h3.sub-tit {padding:100px 0 80px; text-align: center;}
h3.subtit-history {padding:130px 0 50px; text-align: center;}
h3.sub-tit span {color:#0052ce; font-size:17px; font-weight: 500; font-weight:800;}
h3.sub-tit p {font-size: 45px; color: #222; font-weight: 500;}

/* 체크박스 */
.check-con {position:relative; line-height:1}
.css-checkbox {position: absolute; border:0 none; clip:rect(0,0,0,0); height:18px; margin:-1px; overflow:hidden; padding:0; width:18px;}
.css-label {background:url(../img/icon/checkbox-icon.png) no-repeat 0 0; cursor:pointer; display:inline-block; height:18px; line-height:17px; padding-left:25px; vertical-align:middle;}
input.checked + .css-label {background-position:0 -18px;}