﻿@charset "utf-8";
/* 폰트적용 */
@import "fonts.css";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Roboto:ital,wght@0,400;0,500;0,700;0,900;1,400;1,500;1,700;1,900&display=swap');


@import url('https://fonts.googleapis.com/css?family=Lato:400,700,900&display=swap');

/**
* OLYM Cascading Style Sheets
* File Name : default.css
* Description : 기본 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2020.06.01
* Update : 2020.06.01
* Copyright(c) 2020 OLYM Communications. All Rights Reserved.
*/

/* 기본설정 */

/* #header h1 a { border: 1px solid #000;} */

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.6em; font-family:'Noto Sans KR'; word-wrap:break-word; -webkit-text-size-adjust:none; text-rendering: optimizeLegibility;    -webkit-font-smoothing: antialiased;}
/* -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{
    line-height: 1.8rem;
    margin-bottom: 20px;
}
address, caption, em { font-weight:normal; font-style:normal; color:#959595;}
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: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;} /* 모바일 라디오버튼 */
}

/* + */
.txt_form input {
    display: block;
    border: 0;
    background: #F5F6F8;
    margin-bottom: 15px;
    width: 100%;
    box-sizing: border-box;
    outline: 0;
    padding: 25px 20px 25px;
}
::placeholder {color: #c6c6c6;}


.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%; }
.inp

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

/* 공통 */
.fx{display: flex; -ms-display:flex; -webkit-display:flex;}
.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;}
.mgB80 { margin-bottom:80px !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; }

.fL { float:left;}
.fR { float:right;}

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

/* header 
#header { position:relative;}
#header h1 { position:absolute; top:47px; left:0;  z-index:2000;}
#header h1 a {width:113px; height:152px; display:block; background:url("/project/design/com/logo.png") no-repeat center; background-size:cover; text-indent:-9999px;}*/


/* header */
#header { position:relative; height: 100px;}
#header .header_in { position:absolute; top:0; left:0; width:100%; z-index:2000 !important; background:#fff; border-bottom:1px solid #ddd;min-height:100px;}
#header h1 { position:absolute; top:25px; left:0; z-index:2200 !important;}
#header h1 a { width:100%; height:54px; display:block; background:url("/project/design/com/main_logo.png") no-repeat center; background-size:contain; text-indent:-9999px; width: 335px; height: 50px;}

#header .wrap_box {width:1400px; height: 100px;}

#gnb {
    position: absolute;
    top: 37px;
    right: 0;
    z-index: 2200 !important;
}



#gnb > ul > li { float:left; padding-left:15px;}
#gnb > ul > li:first-of-type {position:relative;padding-right:0px;padding-left:0;}
#gnb > ul > li a { color:#fff;font-family: 'Noto Sans KR'; background: #4b73ee;  border-radius: 3px;  padding: 4px 20px;}
#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;}

#gnb > ul > li:last-child a{
    color: #535353;
    font-family: 'Noto Sans KR';
    background:#F2F2F2;
    border-radius: 3px;
    padding: 4px 20px;
}

#gnb > ul > li a:hover{
    opacity: 0.9;
}







/* 검색 */
.search_box { position:absolute; top:40px; right:0; z-index:2300; width:60px;}
.searcharea { position:relative; width: 60px; height: 60px; margin:0 auto;}
.searcharea button { border:0; cursor: pointer;  border-radius:100%; background:none;}
.searcharea .search { position:relative;  width: 100%; height: 100%; outline:0;}
.searcharea .search i {font-size:28px;color:#222;}
.searcharea .searchClose { position: absolute; top:50%; right:-40px; margin-top:-20px; background:#fff url("/project/design/com/bg_close.png") no-repeat center; background-size:20px auto; width:40px; height:40px; opacity: 0; transition: all .3s ease; }
.viewSearh { position: absolute; top: 0; right: 0; width: 0;opacity: 0; background: #fff; border:1px solid #222; border-radius: 50px; transition: all .2s ease; }
.viewSearh.on { padding:0 35px; width: 300px; opacity: 1;}
.viewSearh input { width: 100%; height: 60px; border: 0; outline: 0; background:none; color: #222;}
.viewSearh input::placeholder{ color: #222;}

#lnb { position:relative; z-index:2100 !important;}
#lnb .lnb_wrap { position:relative; overflow:hidden; visibility:hidden; z-index:2100 !important;  height: 100px!;}
#lnb .lnb_wrap > ul { width:41%; margin:0 auto; display:table; margin-left: 41%;}
#lnb .lnb_wrap > ul > li { display:inline-block; text-align: center;}
#lnb .lnb_wrap > ul > li > a { 
    text-align: center;
    font-size: 20px;
    color: #535353;
    font-weight: 600;
    letter-spacing: -0.02rem;
    font-family: 'Noto Sans kr';
    padding: 0 30px;
    line-height: 100px;
}
#lnb .lnb_wrap > ul > li > a span {position:relative; transform: all .3s ease; }
#lnb .lnb_wrap > ul > li > a span::before {display:none;position: absolute; content:''; left:-5px; top:0; transform: translateX(-50%); width:7px; height:7px; background:#c63210; border-radius: 50%; transition: all .3s ease; opacity: 0;}
#lnb .lnb_wrap > ul > li > a span:hover {color:#c63210;}
#lnb .lnb_wrap > ul > li:hover > a span::before{opacity: 1;}
#lnb .lnb_wrap > ul > li:last-child > a { background:none;}
#lnb .lnb_wrap > ul > li.over > a span, #lnb .lnb_wrap > ul > li.actived > a span { color:#c63210; }
#lnb .lnb_wrap > ul > li.over > a span:before, #lnb .lnb_wrap > ul > li.actived > a span:before {opacity: 1;}
#lnb .lnb_sub { padding-top:10px; }
#lnb .lnb_sub li a { display:block; color:#666; padding:5px 0; text-align:center;}
#lnb .lnb_sub li a:hover { color:#f90;}



#lnb .lnb_sub li a{position: relative; transform: all .3s ease;}
#lnb .lnb_sub li a::before{position: absolute; content:''; left:50%; top:0; transform: translateX(-50%); width:7px; height:7px; background:#f90; border-radius: 50%; transition: all .3s ease; opacity: 0;}
#lnb .lnb_sub li:hover a::before{opacity: 1;}

#m_gnb .btn_sitemap { display:none;}

#container { width:100%; min-height:1000px; position:relative;}
/* footer */
#footer { position:relative; background:#363636; padding:40px 0;
 margin: 0 auto;}
#footer .wrap_box { padding-left:0px; box-sizing:border-box;}
#footer .footer_btn { padding-bottom:20px; display:flex;}
#footer .footer_btn li { float:left; padding-right:20px;}
#footer .footer_btn li a {color: #ffffff;}
/* #footer .pa_fa { padding-left:20px; } */
/* #footer address br { display:none;} */
#footer .foo_logo { position:absolute; top:5px; left:0;}

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

/* 채널톡 */
#cha_tok { z-index:2000; position:fixed; bottom:120px; right:40px;}
#cha_tok a { width:60px; height:60px; display:block; text-indent:-9999px; background:url("/project/design/com/img_cht.png") no-repeat center; background-size:cover; transition: all 0.7s ease; border-radius:100%; box-shadow:5px 5px 10px rgba(0,0,0,0.2);}

 /* 모바일 메뉴 */
#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; display: none; }
#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:10px 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:5px 25px; text-align:left; background:rgba(198, 50, 16, 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:#888;}
#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) {
#wrap { min-width:100%;}
.wrap_box { width:95%;}//
#header .wrap_box { width:95%;}
} */

@media all and (max-width:1280px) {
#contents img {max-width:100%;}
}

@media all and (max-width:1200px) {
#lnb .lnb_wrap > ul > li > a {font-size:1.125em;}
#gnb {right:70px;}
#gnb > ul > li a {font-size:0.875em;}
#gnb > ul > li { padding-left:10px;}
#gnb > ul > li:first-of-type {padding-right:10px;}
}

@media all and (max-width:1024px) {
body { font-size:14px; }
/* #wrap { min-width:320px;} */

#lnb { display:none;}
.jbFixed .header_in { position:absolute !important; background:#fff !important; min-height:70px !important;}
.jbFixed h1 { display:block !important;}
#m_gnb { position:absolute; top:0; right:90px;}
#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;}
#gnb {top:22px;right:180px;}
#gnb > ul > li a {font-size:1em;}
#header .header_in {min-height:70px;}
.search_box {top:5px;right:20px;}
#header h1 {top:14px;}
#header h1 a {background-size:contain;height:42px;background-position:left center;}

#footer .wrap_box {padding-left:25%;}
#footer address br {display:inline;}
#footer address{
    /* display:inline-block; */
}
/* #footer address span:first-of-type {padding-left:0;} */
#footer .foo_logo img {height:60px;}
}

@media all and (max-width:768px) {
#header h1 {top:18px;}
#header h1 a {height:34px;}
#footer {padding:30px 0;}
#footer .wrap_box {padding-left:0;}
#footer .foo_logo {position:relative;margin-bottom:20px;transform:scale(0.6);transform-origin:left bottom;}
}

@media all and (max-width:425px) {
#header h1 {top:20px;}
#header h1 a {height:30px;}
.viewSearh.on {width:210px;}
#footer {padding:2rem 0;}
.search_box {right:10px;}
.searcharea .searchClose {right:-30px;z-index:-1;}
#m_gnb {right:50px;}
#gnb {right:120px;}
#gnb > ul > li a {font-size:0.875em;}
#gnb > ul > li {padding-left:5px;}
#gnb > ul > li:first-of-type {padding-right:5px;}
}
