﻿@charset "utf-8";
/* 폰트적용 */
@import "fonts.css";
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');
@import url('https://webfontworld.github.io/DdangFonts/TangsBudaeJjigae.css');
@font-face {
     font-family: 'S-CoreDream-9Black';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-9Black.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
@font-face {
     font-family: 'S-CoreDream-6Bold';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-6Bold.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
@font-face {
     font-family: 'S-CoreDream-5Medium';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-5Medium.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
@font-face {
     font-family: 'S-CoreDream-3Light';
     src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}
/**
* OLYM Cascading Style Sheets
* File Name : default.css
* Description : 기본 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2020.10.03
* Update : 2020.10.25
* Copyright(c) 2020 OLYM Communications. All Rights Reserved.
*/

/* 기본설정 */
.fx{display: flex; -ms-display: flex; -webkit-display: flex;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { padding:0; margin:0; line-height:1.4em; font-weight:400; font-family:'Pretendard', '맑은 고딕', 'Malgun Gothic', 'Open Sans', '나눔 고딕', 'Nanum Gothic', '돋움', 'dotum'; word-break:keep-all; -webkit-text-size-adjust:none;}
/* -webkit-text-size-adjust 모바일에서 폰트사이즈 고정 */
ol, ul, li { list-style:none; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; font-size:100%; }
form, fieldset { border:0; }
address, caption, em { font-weight:normal; font-style:normal; }
img { border:0; margin:0; padding:0; }
a { text-decoration:none;}
a:link, a:visited, a:hover, a:active { text-decoration:none !important; }
br{font-family:'Noto Sans Korean', '맑은 고딕', 'Malgun Gothic', 'Open Sans', '나눔 고딕', 'Nanum Gothic', '돋움', 'dotum';}

#wrap a { transition: all .3s ease;}
#wrap a:hover { transition: all .3s ease;}

/* 숨김영역 */
#accessibility, #accessibility_footer, hr, legend, .skip { position:absolute; width:0; height:0; font-size:0; line-height:0; overflow:hidden; visibility:hidden; }
caption { display:none; }

/* float 속성 초기화 */
.space { display:block; clear:both; float:none; width:100%; height:0; line-height:0 !important; font-size:0 !important; margin:0 !important; padding:0 !important; overflow:hidden; }
.clearfix { display: block; }
.clearfix:after { display:block; clear:both; content:"."; visibility:hidden; height:0; }
* html .clearfix { height:1%; }

/* form css */
input, textarea, select, img { vertical-align: middle; } /* 이미지, form 세로중앙정렬 */
input, textarea, select { font-family:inherit; font-size:inherit;} /* 폰트, 사이즈 상속 */
@media all and (max-width:767px) {
input, textarea {-webkit-border-radius:0; -webkit-appearance:none;} /* 모바일 input 라운드0, 기본속성없애기 */
select {-webkit-border-radius:0; -webkit-appearance:none; background:#fff url("/admode/module/board/images/kor/bg_select.png") no-repeat right center; background-size:auto 80%;} /* 모바일 select 화살표 이미지*/
input[type="checkbox"] { -webkit-border-radius:2px; -webkit-appearance:checkbox; border:1px solid #000;} /* 모바일 체크박스 */
input[type="radio"] { -webkit-border-radius:10px; -webkit-appearance:radio; border:1px solid #000;} /* 모바일 라디오버튼 */
}
.input_form { border:1px solid #ddd; border-radius:3px; color:#666; background:#f5f5f5; box-sizing:border-box; height:28px; line-height:28px; padding:0 3px;}
.input_form:focus { border:1px solid #000;}
.select_form { border:1px solid #ddd; border-radius:3px; color:#666; background:#f5f5f5; box-sizing:border-box; height:28px; padding-left:3px; }
.textarea_form { border:1px solid #ddd; border-radius:3px; color:#666; background:#f5f5f5; box-sizing:border-box; padding:3px 3px 3px 10px; width:100%;  margin:8px 0; }
.textarea_form:focus { border:1px solid #000;}
.input_file { height:28px; width:80%; }

/* 드래그시 배경컬러 */
::-moz-selection {background:#716365; color:#fff;}
::selection {background:#716365; color:#fff;}

/* 공통 */
.font_star { font-weight:600; color:#ff6600; font-family:'verdana';} /* *표시 */
.font_em { color:#ff674b !important;}
.font_em2 { color:#df4241 !important; font-weight:600;}
.font_em3 { color:#f221a9 !important; font-weight:700;}
.font_105 { font-size:1.05em;}
.font_m { font-size:1.25em;}
.font_normal { font-weight:normal !important; }
.font_bold { font-weight:500;}
.black_bold { font-weight:500; color:#222;}
.t_black { color:#333333; }
.t_orange { color:#df4241; }

.bg_purple { background:#887da6; }
.bg_orange { background:#f48473; }
.bg_pink { background:#f49ac1; }
.bg_yellow { background:#fecd67; }

.mg20 { margin:20px !important;}
.mg40 { margin:40px !important;}
.mgT5 { margin-top:5px !important;}
.mgT10 { margin-top:10px !important;}
.mgT20 { margin-top:20px !important;}
.mgT30 { margin-top:30px !important;}
.mgT40 { margin-top:40px !important;}
.mgT50 { margin-top:50px !important;}
.mgT60 { margin-top:60px !important;}
.mgL10 { margin-left:10px !important;}
.mgL20 { margin-left:20px !important;}
.mgL25 { margin-left:25px !important;}
.mgL30 { margin-left:30px !important;}
.mgL35 { margin-left:35px !important;}
.mgL40 { margin-left:40px !important;}
.mgL60 { margin-left:60px !important;}
.mgR10 { margin-right:10px !important;}
.mgR20 { margin-right:20px !important;}
.mgR30 { margin-right:30px !important;}
.mgB10 { margin-bottom:10px !important;}
.mgB20 { margin-bottom:20px !important;}
.mgB30 { margin-bottom:30px !important;}
.mgB40 { margin-bottom:40px !important;}
.txL { text-align:left !important;}
.txC { text-align:center !important;}
.txR { text-align:right !important;}
.poR { position:relative !important;}
.bdT1 { border-top:1px solid #efefef;}
.pdT10 { padding-top:10px !important;}
.pdT20 { padding-top:20px !important; }
.pdT30 { padding-top:30px !important; }
.pdB20 { padding-bottom:20px !important; }
.pdB30 { padding-bottom:30px !important; }

/* Layout */
html, body { height:100%;}
body { font-size:16px; word-break:keep-all;} /* 단어 기준으로 줄바꿈 */
#wrap { width:100%; min-width:1200px; overflow-x:hidden;}
.wrap_box { width:1400px; margin:0 auto; position:relative;}

/* header */
#header { position:relative;}
#header .header_in { position:absolute; top:0; left:0; width:100%; z-index:2000 !important; background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);}
#header h1 { position:absolute; top:36px; left:10px; z-index:2200 !important;}
#header h1 a { color:#333; font-size:1.8em;background:url("/project/design/com/logo.png") no-repeat center; background-size:cover; width:124px; height:68px; display:block; text-indent:-9999px;}

#gnb { position:absolute; top:11px; right:0; z-index:2400 !important; }
#gnb > ul > li { float:left; padding-left:14px;position:relative;}
#gnb > ul > li:first-of-type {padding-right:14px;}
#gnb > ul > li:first-of-type:after {position:absolute;display:block;content:"";width:1px;height:13px;background:#ddd;right:0;top:5px;}
#gnb > ul > li a { color:#666;color:#888;font-weight:700;font-size:15px;}
#gnb .popupTop_pc_open { display:inline-block; background:#fff url("/project/design/com/bg_gnb5.png") no-repeat 10px center; padding:0 16px 0 28px;}
#gnb .popupTop_pc_close { display:inline-block; background:#fff url("/project/design/com/bg_gnb5_2.png") no-repeat 10px center; padding:0 16px 0 28px;}


#gnb2 {display:flex;position:absolute;right:0;top:60px;z-index:2300;align-items:center;}
#gnb2 .sns {position:relative;top:3px;}
#gnb2 .sns ul {display:flex; gap:20px;}
#gnb2 .sns ul li a i {font-size:20px;color:#000;transition:.3s all ease;display:inline-block;}
#gnb2 .sns ul li:nth-of-type(1) a:hover i {color:#ef4a5e;transition:.3s all ease;}
#gnb2 .sns ul li:nth-of-type(2) a:hover i {color:#1778f2;transition:.3s all ease;}
#gnb2 .sns ul li:nth-of-type(3) a:hover i {color:#f70000;transition:.3s all ease;}
#gnb2 .sns ul li:nth-of-type(4) a:hover i {color:#0eca61;transition:.3s all ease;}
#gnb2 .plat a {color:#000;font-weight:700;display:inline-block;position:relative;top:1px;line-height:1.2em;text-align:center;}


.dropdown2 {position:relative;top:-8px;}


/*QR다운로드*/
.dropbtn {
  background-color: #fff;
  color: white;
  padding: 0.6rem 0;
  font-size: 16px;
  border: none;
  cursor: pointer;
  color:#000;
  border:1px solid #000;
  border-radius:2em;
  transition:.3s all ease;
  font-family:'Pretendard';
  font-weight:700;
  width:160px !important;
}

.dropbtn:hover, .dropbtn:focus {
  background-color: #000;
  color:#fff;
  transition:.3s all ease;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #fff;
  min-width: 160px;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-radius:20px;
}

.dropdown-content a {
  color: black;
  text-decoration: none;
  display: block;
}

.dropdown a:hover {background-color: #fff;}

.show {display: block;}



/*다국어*/
.dropbtn2 {
  background-color: #fff;
  color: #000;
  padding: 0.6rem;
  font-size: 16px;
  border: none;
  cursor: pointer;
  font-family:'Pretendard';
  font-weight:700;
}

.dropbtn2:hover, .dropbtn2:focus {
  background-color: #fff;
}

.dropdown2 {
  position: relative;
  display: inline-block;
}

.dropdown-content2 {
  display: none;
  position: absolute;
  background-color: #fff;
  min-width: 65px;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content2 a {
  color: black;
  padding: 0.6rem;
  text-decoration: none;
  display: block;
  color:#000 !important;
}

.dropdown2 a:hover {background-color: #f6f6f6;}

.show2 {display: block;}



/* 검색 */
.search_box { position:absolute; top:40px; right:0; z-index:2000; width:10%;}
.searcharea { position:relative; width: 26px; height: 26px; margin:0 auto;}
.searcharea button { border:0; cursor: pointer;  border-radius:100%; }
.searcharea .search { position:relative;  background:url("/project/design/com/serch.png") no-repeat center top;  width: 100%; height: 100%; outline:0;}
.searcharea .searchClose { position: absolute; top:50%; right:-80px; margin-top:-25px; background:rgba(0,0,0,0.9) url("/project/design/com/bg_close.png") no-repeat center; background-size:20px auto; width:50px; height:50px; opacity: 0; transition: all .3s ease; z-index: 1;}
.viewSearh { position: absolute; top: -12px; right: -20px; width: 0;opacity: 0; background: #efefef; border-radius: 50px; transition: all .2s ease; }
.viewSearh.on { padding:0 35px; width: 250px; opacity: 1;}
.viewSearh input { width: 100%; height: 50px; border: 0; outline: 0; background:none; color: #666;}
.viewSearh input::placeholder{ color: #666;}

#lnb { position:relative; z-index:2100 !important;}
#lnb .lnb_wrap { position:relative; overflow:hidden; visibility:hidden; z-index:2100 !important; padding-top:45px;padding-left:200px;width:45%;}
#lnb .lnb_wrap > ul { width:100%; margin:0 auto; display:table;}
#lnb .lnb_wrap > ul > li { display:table-cell;width:25%;}
#lnb .lnb_wrap > ul > li > a { display:block; text-align:center; font-size:1.25em; color:#000; font-weight:700; height:50px; line-height:50px;}
#lnb .lnb_wrap > ul > li > a:after { display:block; content:""; height:3px; background:#76569b; -webkit-transform:scale(0, 1); -moz-transform:scale(0, 1); -ms-transform:scale(0, 1); -o-transform:scale(0, 1); transform:scale(0, 1); transition:all .3s ease;}
#lnb .lnb_wrap > ul > li:last-child > a { background:none;}
#lnb .lnb_wrap > ul > li.current > a, #lnb .lnb_wrap > ul > li.actived > a { color:#333; }
#lnb .lnb_wrap > ul > li.current > a:after, #lnb .lnb_wrap > ul > li.actived > a:after {transform:scale(0.9, 1);}
#lnb .lnb_sub { padding-top:10px; }
#lnb .lnb_sub li a { display:block; color:#666; padding:5px 0 5px 20px; }
#lnb .lnb_sub li a:hover { color:#76569b;}
#m_gnb .btn_sitemap { display:none;}

/* 상단메뉴 스크롤시 고정 */
.jbFixed .header_in { position:fixed !important; background:rgba(255,255,255,0.95) !important; min-height:50px !important; border-bottom:none !important;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.05);}
.jbFixed #lnb .lnb_wrap { padding-top:0;}
.jbFixed #lnb .lnb_wrap > ul {border-top:none !important;}
.jbFixed h1, .jbFixed #gnb, .jbFixed #gnb2 { display:none !important;}

#container { width:100%; min-height:1000px; position:relative;margin-top:140px;}

/* footer */
#footer { color:#666;border-top:2px solid #000;}
.footer_box {padding:50px 0; }
.footer_box address { padding-top:40px;line-height:1.8em;color:#666;}
.footer_box .pa_left { padding-left:20px; }
.footer_box .em { color:#333;}
.footer_box .footer_btn li { float:left; padding-right:30px;}
.footer_box .footer_btn li a { color:#222;font-weight:700;}
.footer_box .footer_btn2 { position:absolute; bottom:60px; right:0;}
.footer_box .footer_btn2 li { float:left; padding-right:20px;}
.footer_box .footer_btn2 li:last-of-type {padding-right:0;}

#footer .site_link { position:absolute; top:40px; right:0; width:265px;}
#footer .site_link > a { display:block; border:1px solid #dfdfdf; padding-left:20px; color:#858585; font-weight:500; line-height:40px; background:#fff url("/project/design/com/bg_ar2.png") no-repeat 92% center; border-radius:10px;}
#footer .link_box { display:none; position:absolute; width:100%; bottom:41px; border:1px solid #dfdfdf; background:#fff; overflow:hidden; box-sizing:border-box;border-radius:10px; overflow:hidden;z-index: 99999}
#footer .link_box > ul > li > a { display:block; border-bottom:1px solid #dfdfdf; padding:7px 20px; color:#666;}
#footer .link_box > ul > li > a:hover { background:#f9f9f9;}
#footer .link_box > ul > li:last-child > a { border-bottom:none;}
br.mo_block {display:none;}

/* top 버튼 */
#back-top { z-index:1000000; position:fixed; bottom:85px; right:20px;}
#back-top a { width:50px; height:50px; display:block; text-indent:-9999px; border:2px solid #000; background:#fff url("/project/design/com/bg_btn_top2.png") no-repeat center; background-size:12px; border-radius:50px; transition: all 0.7s ease;}


/*검색*/
.fix_search { z-index:1000000; position:fixed;bottom:20px;right:20px;}
.fix_search a {width:54px;height:54px;border-radius:54px;background:#000;color:#fff;display:inline-block;text-indent:-9999px;background:#000 url("/project/design/com/bg_btn_search.png") no-repeat center;background-size:20px;}

 /* 모바일 메뉴 */
#sitemap {display:none; display:block; position:relative; z-index:5000;}
#sitemap .m_menu { position:absolute; top:0; right:-200px; width:200px; background:#fff; z-index:5000; }
#sitemap .m_menu .close { width:30px; height:30px; background:url("/project/design/com/bg_close.png") no-repeat center; background-size:20px; display:block; text-indent:-9999px; position:absolute; top:10px; right:10px;}
#sitemap .m_menu h2 { line-height:40px; color:#333; font-size:1.4em; padding-left:20px; background:#fff; text-indent:-9999px;}
#sitemap .m_menu h3 a { color:#333; font-size:1.25em; font-weight:300; display:block; padding:15px 0; text-align:center;}
#sitemap .m_menu h3.on a { color:#333; }
#sitemap .m_menu .depth1 { background:none;}
#sitemap .m_menu .depth2 { display:none;}
#sitemap .m_menu .depth2 li a { color:rgba(255, 255, 255, 0.8); display:block; padding:15px 25px; text-align:left; background:rgba(96, 145, 187, 1); border-bottom:1px solid rgba(255, 255, 255, 0.2);}
#sitemap .m_menu .depth2 li.on a { background:rgba(0, 0, 0, 0.1); }
#sitemap .m_menu .depth3 { background:rgba(0, 0, 0, 0.5);}
#sitemap .m_menu .depth3 li a { font-size:0.95em; display:block; padding:5px 20px 5px 35px; background:rgba(0, 0, 0, 0.5);}
#sitemap .m_menu .depth3 li a:before { content:"· ";}
#sitemap .shadow_bg { width:100%; height:100%; position:fixed; left:0; top:0;  background:rgba(0, 0, 0, 0.8); z-index:10; display:none; }


.sidenav {
  height: 280px;
  width: 0;
  position: absolute;
  z-index: 1;
  top: 260px;
  left: 360px;
  background:rgba(255,255,255,0.95) url("/project/design/com/bg_menu_logo.png") no-repeat 110% 135%;
  overflow-x: hidden;
  transition: 0.5s;
  padding: 50px 0;
  z-index:100000 !important;
  border-radius:0 20px 20px 0;
  overflow:hidden;
}
.sidenav > div {position:relative;margin-bottom:38px;}
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 17px;
  color: #818181;
  display: inline-block;
  transition: 0.3s;
}

.sidenav a:hover {
  color: #555;
  font-weight:500;
}

.sidenav .closebtn {
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 36px;
  margin-left: 50px;
}
.fromLeft:after {display:block;content:"";border-bottom:solid 2px #555;transform:scaleX(0);transition:transform 250ms ease-in-out;}
.fromLeft:hover:after {transform:scaleX(1);transform-origin:0% 50%;}



@media all and (max-width:1400px) {
#wrap { min-width:100%;}
.wrap_box { width:95%;}
#footer .site_link {position:relative;top:auto;margin-top:20px;}
.footer_box .footer_btn2 {position:relative;bottom:auto;margin-top:40px;}
#lnb .lnb_wrap {padding-left:12%;}
}



@media all and (max-width:1279px) {
#wrap {min-width:320px;}
#header .wrap_box { width:100%;}
#header h1 { top:14px; left:2.5%;}
#header h1 a {zoom:0.6;}
#lnb { display:none;}
.jbFixed .header_in { position:absolute !important; background:#fff !important; min-height:70px !important;}
.jbFixed h1 { display:block !important;}
#gnb { display:none;}
#m_gnb { position:absolute; top:22px; right:2.5%;}
#m_gnb .btn_sitemap { display:block; width:70px; height:70px; text-indent:-9999px; background:url(/project/design/com/btn_sitemap.png) no-repeat center; background-size:30px;}
#container {margin-top:70px;}
#gnb2 {top:13px;right:80px;}

.sitemap_box {display:inline;width:26px;height:26px;margin-left:30px;}
.sitemap_box a {display:inline-block;background:url("/project/design/com/sitemap.png") no-repeat center top;width:26px;height:26px;}

.sitemap_mem {margin-top:30px;}
.sitemap_mem ul li, .sitemap_lang ul li {flex:1;text-align:center;position:relative;}
.sitemap_mem ul li a {color:#666;padding:10px;display:block;background:#f7f7f7;border-top:1px solid #f0f0f0;}
.sitemap_mem ul li:first-of-type:after {position:absolute;content:"";display:inline-block;width:1px;height:100%;background:rgba(0,0,0,0.05);right:0;top:0;}

.sitemap_lang ul li:after {position:absolute;content:"";display:inline-block;width:1px;height:100%;background:rgba(255,255,255,0.2);right:0;top:0;}
.sitemap_lang ul li:last-of-type:after {display:none;}
.sitemap_lang ul li a {color:#fff;background:#000;display:block;padding:10px;}
.dropdown {display:none;}
}



@media all and (max-width:1024px) {
body {font-size:15px;}
}



@media all and (max-width:820px) {
.footer_box {font-size:12px;padding:30px 0;}
.footer_box address {padding-top:20px;}
.footer_box .pa_left {display:block;padding-left:0;}
.footer_box .footer_btn2 {margin-top:20px;}
.footer_box .footer_btn2 li img {height:24px;}
#back-top {bottom:75px;}
#back-top a {width:40px;height:40px;}
.fix_search a {width:44px;height:44px;}
}




@media all and (max-width:700px) {
#gnb2 {top:87px;right:auto;left:2.5%;}
#container {margin-top:136px;}
#header .wrap_box {height:70px;box-shadow:0 10px 20px rgba(0,0,0,0.1);}

.jbFixed #gnb2 { display:flex !important;}
#gnb2 {gap:20px;}
#gnb2 .plat a {font-size:13px;}
.dropbtn {font-size:13px;width:auto !important;padding:0.5rem;}
#gnb2 .sns ul {gap:10px;}
}