﻿@charset "utf-8";
/* 폰트적용 */
@import "fonts.css";
@import url('https://webfontworld.github.io/SCoreDream/SCoreDream.css');
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansBold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
    font-weight: 400;
    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 : 2022.05.31
* Update : 2022.05.31
* Copyright(c) 2022 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, p, span { padding:0; margin:0; line-height:1.6em; font-weight: 400; font-family: 'SCoreDream','Noto Sans KR'; word-wrap:break-word; -webkit-text-size-adjust:none;}
/* -webkit-text-size-adjust 모바일에서 폰트사이즈 고정 */
ol, ul, li { list-style:none; text-decoration: none; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; font-size:100%;  /*  transform: rotate(-0.03deg); 나눔바른고딕 큰글씨 등 폰트가 깨질때 사용 */}
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%; }

/* form css */
input, textarea, select, img { vertical-align: middle; } /* 이미지, form 세로중앙정렬 */
input, textarea, select { font-family:inherit; font-size:inherit;} /* 폰트, 사이즈 상속 */
@media all and (max-width:800px) {
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 #7c4848; 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-color:#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_105 { font-size:1.05em;}
.font_m { font-size:1.25em;}
.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; }

.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;}
.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:15px; word-break:keep-all;} /* 단어 기준으로 줄바꿈 */
#wrap { width:100%; overflow-x:hidden;}
.wrap_box { width:1600px; margin:0 auto; position:relative; z-index: 1;}
#contents{ padding-top: 0; padding-bottom: 150px; color: #686868; font-size: 1em;}

/* header */
#header { position:relative; z-index: 1000; min-height:100px}
/* #header { position:absolute; left: 0; z-index: 1000; min-height:100px; transition: all 0.2s;} */
#header .header_in { position:absolute; top:0; left:0; width:100%; z-index:2000 !important;}
#header h1 { position:absolute; top:35px; left:70px; z-index:2200 !important;transition: all .3s ease;}
#header h1 a {display: flex; align-items: center;}
#header h1 span {padding-left: 20px; color:#fff; font-size:1.8em; font-weight: 700;}
#gnb { position:absolute; top:50px; right:130px; z-index:2200 !important; transition: all .3s ease;}
#gnb > ul { display: flex; gap: 30px; align-items: center;}
#gnb > ul > li a { color:#fff; font-size: 30px;}
#m_gnb { position:absolute; top:41px; right:70px;transition: all .3s ease;}
#m_gnb .btn_sitemap { display:block; width:40px; height:40px; position: relative; z-index: 2400;font-size: 0;}
#m_gnb .btn_sitemap::after { display: block; content: "\EF36"; color: #fff;  font-family: remixicon; font-size:36px; position: absolute; top: 10px; left: 50%; transform: translateX(-50%); transition: all 0.2s;}
#m_gnb .btn_sitemap:hover::after {color: #FF783E;}

#lnb { position:relative; z-index:2100 !important;}
#lnb .lnb_wrap { position:relative; overflow:hidden; visibility:hidden; z-index:2100 !important; padding: 40px 0; /* background: rgba(0, 0, 0, 0.5); */}
/* #lnb .lnb_wrap > ul { margin:0 auto; display:table;} */
#lnb .lnb_wrap > ul { display: flex; justify-content: right; margin-right: 240px;}
#lnb .lnb_wrap > ul > li { display:table-cell;}
#lnb .lnb_wrap > ul > li > a { display:block; text-align:center; font-size:20px; color:#fff; height:50px; line-height:50px; font-weight: 600; padding: 0 50px;}
#lnb .lnb_wrap > ul > li > a:after { display:block; content:""; height:3px; background:#FF783E; 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:#FF783E; }
#lnb .lnb_wrap > ul > li.current > a:after, #lnb .lnb_wrap > ul > li.actived > a:after {transform:scale(1.1, 1);}
#lnb .lnb_sub { padding-top:35px; }
#lnb .lnb_sub li a { display:block; color:#fff; padding:5px 0 5px 50px; }
#lnb .lnb_sub li a:hover { color:#FF783E;}
.header_on #lnb .lnb_wrap{ background: rgba(0,0,0,0.5);}



/* 상단메뉴 스크롤시 고정 */
.jbMenu {background-color: rgba(0, 0, 0, 0);}
.jbFixed .header_in { position:fixed !important; min-height:100px; background-color: rgba(0, 0, 0, 0.5); transition: all 0.3s;}
#container { width:100%; min-height:1000px; position:relative;}

/* banner */
.banner { border-top: 1px solid #E2E2E2; border-bottom: 1px solid #E2E2E2;} 
.banner_box { display: flex; align-items: center; gap: 40px; overflow: hidden;} 
.banner .slide_area { position: relative; width: 96%; } 
.banner .slide_ctrl { display: flex; align-items: center; gap: 5px;} 
.banner .slide_ctrl a { display: flex; justify-content: center; align-items: center; cursor: pointer; } 
.banner .slide_ctrl i { font-size: 24px; color: #000;}
.banner .slide_ctrl .xi-angle-left-min, .banner .slide_ctrl .xi-angle-right-min {font-weight: bold;}


.banner .owl-stage {display: flex; align-items: center;}
.banner .owl-carousel .owl-stage-outer { width: 100%; padding: 26px 0;} 
.banner .owl-carousel .owl-item a { display: flex; justify-content: center; max-height: 50px;}
.banner .owl-carousel .owl-item a img { width: auto !important; max-height: 50px;}


/* footer */
#footer { color:#666; padding:50px 0; }
#footer a { font-weight:500; color:#000; font-size: 14px; }
#footer .footer_btn { margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;}
#footer .footer_btn > ul { display: flex; gap: 40px;}
#footer .footer_btn .social {display: flex; align-items: center; gap: 20px;}
#footer .footer_btn .social .link_btn {display: flex; align-items: center;}
#footer .footer_btn .social .link_btn a { display: flex; box-sizing: border-box; justify-content: center; align-items: center; padding: 5px;}
#footer .footer_btn .social .link_btn a i { color: #000; font-size: 30px;}
#footer .footer_btn .social select { border: 1px solid #EEEEEE; border-radius: 5px; padding: 10px 8px 10px 24px; width: 260px; appearance:none; background: url(/project/design/com/dropup.png) no-repeat 220px / 20px; color: #000;}

#footer .footer_btn .social select:focus {
    background: url(/project/design/com/dropdown.png) no-repeat 220px / 20px;
}

#footer .footer_btn .social select option { color: #000;}

#footer address { margin-bottom: 10px;}
#footer address > ul { display: flex; gap: 40px;}
#footer address > ul li { font-size: 14px; color: #858585;}
#footer .copyright {font-size: 15px;}

/* top 버튼 */
#back-top { z-index:1000; position:fixed; bottom:30px; right:30px;}
#back-top a { width:80px; height:80px; display:flex; justify-content: center; align-items: center; color: #FF783E; font-size: 30px; background:rgba(255,255,255,0.9); box-shadow:0 0 10px rgba(0, 0, 0, 0.15); border-radius:100%; transition: all 0.7s ease;}

/* 사이트맵 */
#sitemap { display: none; display:block; position:relative; z-index:5000;}
#sitemap .m_menu { position:absolute; top:0; right:-310px; width:310px; background:#fff; z-index:5000; }
#sitemap .m_menu h2 { text-indent:-9999px; height: 0;}

#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 .sitemap_top { padding: 50px 20px 30px 30px; display: flex; justify-content: space-between; align-items: center;}
#sitemap .logo img { height: 40px;}
#sitemap .gnb_sitemap { display: flex; flex-direction: column; gap: 5px;}
#sitemap .gnb_sitemap a { display: inline-block; border:1px solid rgb(198, 198, 198); color:#666; width: 66px; line-height: 24px; border-radius:40px; text-align: center; font-size: 12px; margin-left: 5px; }
#sitemap .gnb_sitemap a:hover {border:1px solid #545454; background-color:#545454; color:#fff;}

#sitemap .lang ul { display: flex; border-top:1px solid #f4f4f4; border-bottom:1px solid #f4f4f4;}
#sitemap .lang ul li {width: 100%;}
#sitemap .lang ul li a { border-right:1px solid #f4f4f4; display: block; font-size:12px; color:#666; line-height:37px; text-align: center;}
#sitemap .lang ul li a:hover {color:#2d2d2d; }
#sitemap .lang ul li:last-child a { border-right:none;}

#sitemap .m_menu h3 a { position:relative; color:#333; font-size:1.2em; font-weight: 600; border-bottom:1px solid #f4f4f4; display:block; padding:23px 35px;}
#sitemap .m_menu h3 a:hover { background:#fafafa;}
#sitemap .m_menu h3 a:after { display:inline-block; content:""; position:absolute; right:35px; top:50%; transform:translate(0,-50%); background:url("/project/design/com/bg_h3_off.png") no-repeat center / 100%; width:9px; height:9px; transition:.3s all ease;}
#sitemap .m_menu h3.on a:after {background:url("/project/design/com/bg_h3_on.png") no-repeat center / 100%;}

 #sitemap .m_menu .depth2 { display:none; border-left:5px solid; border-image:linear-gradient(to bottom, #70448e, #13a3b0); border-image-slice:1;} /* 컬러변경 */ 
#sitemap .m_menu .depth2 li a { color:#666; display:block; padding:15px 30px; background:#fafafa;}
#sitemap .m_menu .depth2 li a:hover { color:#000}


#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(255, 255, 255, 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:1600px) {
.wrap_box { width:90%;}
}

@media all and (max-width:1440px) {
#lnb .lnb_wrap > ul { margin-right: 150px;}
#lnb .lnb_wrap > ul > li > a { font-size: 18px; padding: 0 30px;}
#lnb .lnb_sub li a { padding:5px 0 5px 30px; }
#m_gnb .btn_sitemap::after {font-size: 30px;}
}

/* 태블릿 가로 */
@media all and (max-width:1260px) {
#wrap {min-width:320px;}
#header { min-height:80px}
#header h1 { top:27px; left:25px;}
#header h1 img { height: 40px;}
#header h1 span { font-size: 1.5em;}
#lnb { display:none;}
#gnb { display:none;}
#m_gnb { top:20px; right:15px;}
.jbFixed .header_in { position:absolute !important; background:none !important; min-height:70px !important;}
.jbFixed h1 { display:block !important; top:25px !important;}
.jbFixed #m_gnb { top:20px;}
.jbFixed #m_gnb .btn_sitemap::after {color: #fff;}

#back-top { bottom:10px; right:10px;}
#back-top a { width:50px; height:50px; font-size: 20px;}
}

@media all and (max-width:900px) {
#footer { font-size:0.95em; }
#footer .footer_btn > ul { gap: 20px;}
#footer address > ul { flex-direction: column; gap: 0;}
#footer address > ul > li::after { display: none;}
}

/* 모바일 가로 */
@media all and (max-width:800px) {
body { font-size:14px;}
#container { min-height:500px;}
/* #header h1 a { flex-direction: column; align-items: baseline;} */
#header h1 span {font-size: 22px; padding-left: 10px;}
#header h1 img { height: 35px;}
}

@media all and (max-width: 550px) {
    #footer .footer_btn {  display: block; }
    #footer .footer_btn .social { margin-top: 10px;}
}

@media all and (max-width:550px) {
    #footer .footer_btn .social { margin: 0; padding: 20px 0;}
}

/* 모바일 세로 */
@media all and (max-width:440px) {
#header h1 { left:15px;}
#header h1 span {font-size: 18px; padding-left: 5px;}

#footer address > ul li { font-size: 12px;}
#footer .copyright {font-size: 12px;}
.banner_box {gap: 20px;} 
}

