@charset "utf-8";
/* 폰트적용 */
@import "fonts.css";
@import url('https://fonts.googleapis.com/css?family=Black+Ops+One&display=swap');
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800); /* Open Sans*/
@import url('https://fonts.googleapis.com/css?family=Lato:400,700,900&display=swap');

/* 속도느려짐 확인 */
@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; }
@font-face { font-family: 'S-CoreDream-4Regular'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.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-7ExtraBold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-7ExtraBold.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face {
    font-family: 'Jal_Onuel';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10-21@1.0/Jal_Onuel.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 : 2017.02.07
* Update : 2018.10.24
* Copyright(c) 2018 OLYM Communications. All Rights Reserved.
*/

/* 기본설정 */
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-family:"S-CoreDream-4Regular", "Noto Sans Korean",'맑은 고딕', 'Malgun Gothic', 'Open Sans', '나눔 고딕', 'Nanum Gothic', '돋움', 'dotum'; word-wrap:break-word; -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; }

#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%; }

/* flex 속성 */
.fx{display:flex; -ms-display:flex; -webkit-display:flex;}



/* 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:#f4364c; font-family:'verdana'; margin:0 3px; line-height:1em;} /* *표시 */
.font_em { color:#ff674b !important;}
.font_em2 { color:#df4241 !important; font-weight:600;}
.font_em3 { color:#00a53c;}
.font_em4 { color: #0000ff !important; font-weight: bold !important;}

.font_105 { font-size:1.05em;}
.font_m { font-size:1.25em;}
.font_s { font-size:0.875em;}
.font_normal { font-weight:normal !important; }
.font_bold { font-weight:600;}
.black_bold { font-weight:600; color:#333;}
.t_black { color:#333333; }
.t_orange { color:#df4241; }

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

.mobile { display:none;}
.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;}
.mgR20 { margin-right:20px !important;}
.mgR10 { margin-right:10px !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;}
.poA { position:absolute !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:15px; word-break:keep-all; background-color: #fff;} /* 단어 기준으로 줄바꿈 */
#wrap { width:100%; overflow-x:hidden;}
.wrap_box { width:90%; max-width: 1600px; margin:0 auto; position:relative; }
.wrap_con { width:100%; max-width: 1200px; margin:0 auto; position:relative;}

/* header */
#header { position:relative; transition: all .3s ease;}
#header .header_in { position:absolute; top:0; left:0; width:100%; z-index:2000 !important; background:#fff; }
#header .header_on {background: #000}

#header h1 { position:absolute; top:28px; left:2%; z-index:2200 !important;}
#gnb { position:absolute; top:37px; right:0; z-index:2200 !important; }
#gnb > ul > li { float:left; padding-left:20px;}
#gnb > ul > li a { color:#666; line-height:26px;}
#gnb > ul > li a.lan { border:1px solid #ddd; border-radius:5px; display:inline-block; padding:0 10px;}

#lnb { position:relative; z-index:2100 !important; float: right; right: 240px;}
#lnb .lnb_wrap { position:relative; overflow:hidden; visibility:hidden; z-index:2100 !important;padding-top: 14px;}
#lnb .lnb_wrap > ul > li { float:left;}
#lnb .lnb_wrap > ul > li > a { display:block; text-align:center; font-size:1.2em; color:#333; padding:0 35px; height:70px; line-height:70px; font-family:"S-CoreDream-7ExtraBold";}
#lnb .lnb_wrap > ul > li > a:after { display:block; content:""; height:3px; background:#000; transform:scale(0, 1); transition:all .3s ease;}
#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(1.5, 1);}
#lnb .lnb_sub { padding-top:20px; }
#lnb .lnb_sub li a {display:block; color:#666; padding:5px 0; text-align: center;}
#lnb .lnb_sub li a:hover { color:#000;}

#m_gnb .btn_sitemap { display:none;}

/* header - sns 박스 */
.sns_box {  position: absolute; top: 35px; left: 16%; display: flex; flex-direction: row; align-items: center; gap: 15px; }
.sns_box > a { display: flex; flex-direction: row; align-items: center; font-size: 0.8125rem;  color: #000; gap: 8px; }
.sns_box > a > i { display: flex; align-items: center; justify-content: center; width: 35px; height: 35px; border-radius: 100%; color: #fff; font-size: 1.25rem; font-weight: normal; transition: all .3s ease; }
.sns_box > a > p { display: none; } 

.sns_box > a > i.sns1 { background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5); }
.sns_box > a > i.sns1:hover { background: #000; }
.sns_box > a > i.sns2 { background-color: #1877F2; }
.sns_box > a > i.sns2:hover { background: #000; }
.sns_box > a > i.sns3 { background-color: #FF0000; }
.sns_box > a > i.sns3:hover { background: #000; }
.sns_box > a > i.sns4 { background-color: #00C73C; }
.sns_box > a > i.sns4:hover { background: #000; }

/* sitemap - sns 박스 */
.sns_box2 { border-top: 1px solid #eee; padding: 20px 40px; gap: 20px 5px; display: grid; grid-template-columns: 1fr 1fr; }
.sns_box2 > a { display: flex; flex-direction: column; align-items: center; font-size: 0.8125rem;  color: #000; gap: 8px; }
.sns_box2 > a > i { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 100%; color: #fff; font-size: 1.25rem; font-weight: normal; transition: all .3s ease; }

.sns_box2 > a > i.sns1 { background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5); }
.sns_box2 > a > i.sns1:hover { background: #000; }
.sns_box2 > a > i.sns2 { background-color: #1877F2; }
.sns_box2 > a > i.sns2:hover { background: #000; }
.sns_box2 > a > i.sns3 { background-color: #FF0000; }
.sns_box2 > a > i.sns3:hover { background: #000; }
.sns_box2 > a > i.sns4 { background-color: #00C73C; }
.sns_box2 > a > i.sns4:hover { background: #000; }


@media all and (max-width: 1600px) { 
	.sns_box { left: 20%; }
}
@media all and (max-width: 1260px) { 
	#header h1 img { height: 35px; }

	.sns_box { left: 21%; }
	.sns_box { gap: 10px; }
	.sns_box > a > i { width: 30px; height: 30px; font-size: 1rem; }
}
@media all and (max-width: 1100px) { 
	.sns_box { display: none; }
}
/* // header - sns 박스 */


/* 상단메뉴 스크롤시 고정 */
.jbFixed .header_in { position:fixed !important;  min-height:100px !important; border-bottom:none !important; box-shadow:0 3px 10px rgba(0,0,0,0.1);}
.jbFixed #lnb .lnb_sub li a:hover, .jbFixed #lnb li:nth-child(2) .lnb_sub li a:hover { color:#008a54;}

#container { min-height:1000px; position:relative; padding-top:105px;}

/* footer */
#footer { background:#333; padding:60px 0; }
.footer_box address { color: #fff; line-height: 1.6em; opacity: 0.5}
.footer_box .pa_left { padding-right:25px; }
.footer_box .btn_right { position:absolute; top:0; right:0;}
.footer_box .btn_right li { float:left; padding-left:20px;}


/* 추가 */
.footer_box { display: flex; flex-direction: row; }

.footer_left .copyright { margin-bottom: 35px; font-size: 16px; color: #ccc; font-weight: 600; }
.footer_left .footer_info { display: flex; flex-direction: column; gap: 8px; font-size: 15px; color: #999; }
.footer_left .footer_info ul.info_box { display: flex; flex-direction: row; gap: 25px; flex-wrap: wrap; }
.footer_left .footer_info ul.info_box > li { position: relative; } 
.footer_left .footer_info ul.info_box > li::after { position: absolute; top: 50%; right: 0; width: 1px; height: 12px; background: #686868; display: block; content: ""; transform: translate(14px, -50%); }
.footer_left .footer_info ul.info_box > li:last-child::after  { display: none; }

@media (max-width: 1260px) {
    .footer_box { flex-direction: column; gap: 10px;}
    .footer_left .copyright { font-size: 14px; margin-bottom: 25px; }
    .footer_left .footer_info { font-size: 13px; gap: 10px; }
    .footer_left .footer_info ul.info_box { gap: 5px; }
    .footer_left .footer_info ul.info_box > li::after { transform: translate(5.5px, -50%); }
}



/* top 버튼 */
#back-top { z-index:1000; position:fixed; bottom:60px; right:60px; }
#back-top a { width:48px; height:48px; display:block; text-indent:-9999px; background:rgba(255,255,255,0.95) url("/project/design/com/bg_btn_top.png") no-repeat center; background-size:20px; border-radius:100%; transition: all 0.7s ease; box-shadow:0 0 10px rgba(0,0,0,0.3);}

 /* 모바일 메뉴 */
#sitemap {display:none; display:block; position:relative; z-index:5000;}
#sitemap .lan_box { position:absolute; top:12px; left:15px;}
#sitemap .lan_box a { color:#666; border:1px solid #ddd; border-radius:5px; display:inline-block; padding:5px 10px;}
#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.2em; 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 0; text-align:center; background:rgba(0, 165, 60, 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:10px 20px; text-align:left; 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; }

@media all and (max-width:1440px) {
#lnb { right: 200px;}
#lnb .lnb_wrap > ul > li > a { padding:0 25px;}
#footer { padding:40px 0; }
.footer_box .btn_right { right:50px;}
.footer_box .btn_right li { padding-left:20px;}
#back-top { bottom:40px;  right:40px; }
}

/* 태블릿 가로 */
@media all and (max-width:1260px) {
#wrap { min-width:100%;}
}

/* 태블릿 세로 */
@media all and (max-width:1100px) {
#wrap {min-width:320px;}
#header h1 { top:22px; left:0;}
#header h1 img { height:26px;}
#lnb { display:none;}
.jbFixed .header_in { position:absolute !important; background:#fff !important; min-height:70px !important; box-shadow:none;}
.jbFixed h1 { display:block !important;}
#gnb { display:none;}
#m_gnb { position:absolute; top:0; right:0;}
#m_gnb .btn_sitemap { display:block; width:50px; height:70px; text-indent:-9999px; background:url(/project/design/com/btn_sitemap.png) no-repeat center; background-size:24px;}
#container { padding-top:70px;}
.footer_box .btn_right { position:relative; top:auto; right:auto;}
.footer_box .btn_right li { padding:15px 15px 0 0;}
.footer_box .btn_right li img { width:40px;}
#back-top { right:5%; }
#back-top a { width:40px; height:40px; }
}

/* 모바일 가로 */
@media all and (max-width:820px) {
body { font-size:13px;}
#container { min-height:500px;}
#footer { padding:30px 0; }
#back-top { bottom:30px;  right:30px; }
}

/* 모바일 세로 */
@media all and (max-width:440px) {
.mobile { display:block;}
}