﻿/*
* OLYM Cascading Style Sheets
* File Name : default.css
* Description : 기본 스타일시트
* Author : Web business Team / Kim min yi
* Email : odesign@olym.co.kr
* Date : 2024.11.15
* Update : 2024.11.15
* Copyright(c) 2024 OLYM Communications. All Rights Reserved.
*/


@charset "utf-8";

/* font */
@import "fonts.css";
/* // font */

/* default */
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: 'SUIT'; -webkit-text-size-adjust:none; transition: all .4s ease; box-sizing: border-box; letter-spacing: -0.2px; transition: all .3s ease;}
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; }
#container a { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease;}
#container a:hover { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease;}
.eff, .eff:hover { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease;}
/* //default */


/* 숨김영역 */
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%; }

/* 이미지 인풋등 세로중앙정렬 */
input, textarea, select, img { vertical-align: middle; }
input, textarea, select { font-family:inherit;}
@media all and (max-width:740px) {
input, textarea { -webkit-border-radius:0; } 
/* 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 87% center; background-size:16px;} */
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;}
}

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

/* form css */
.input_form { height:20px; line-height:20px; padding:3px 0 0 3px; border:1px solid; border-color:#d1d1d1 #e7e7e7 #e7e7e7 #d1d1d1; color:#565656; background:#f5f5f5; font-size:1em; }
.select_form { padding:0 0 0 3px; height:20px; border:1px solid; border-color:#d1d1d1 #e7e7e7 #e7e7e7 #d1d1d1; color:#565656; background:#f5f5f5; font-size:1em; }
.textarea_form { border:1px solid #dbe1e7; padding:3px 0 0 3px; color:#767676; margin:8px 0 9px 0; }


/* ========== common ========== */
.font_star { font-weight:600; color:#ff6600; font-family:'verdana';}
.font_em { color:#ff6600 !important;}
.font_em2 { color:#0778b4 !important;}
.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;}
.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; }

.fx { display: flex; }

/* br */
.br1 { display: block; }
.br2 { display: block; }


/*  h_tit */
h1.h_tit { font-size: 90px; font-weight: bold; }
h2.h_tit { font-size: 48px; font-weight: 800; }
h3.h_tit { font-size: 40px; font-weight: 800; font-family: 'Montserrat'; color: #00133F; }
h4.h_tit { font-size: 36px; font-weight: 800; }
h5.h_tit { font-size: 32px; font-weight: 800; }

/* btn_more */
.btn_more { display: inline-block; width: 85px; height: 35px; line-height: 35px; border: 1px solid #00257E; background: #00257E; border-radius: 7px; text-align: center; font-family: 'Montserrat'; font-size: 14px; font-weight: 700; color: #fff; }
.btn_more:hover { border: 1px solid #00257E; background: #fff; color: #00257E; }

@media all and (max-width: 1440px) { 
    .br2 { display: none; }
    h1.h_tit { font-size: 70px; }
}
@media all and (max-width: 1260px) { 
    h1.h_tit { font-size: 60px; }
    h2.h_tit { font-size: 40px; }
    h4.h_tit { font-size: 30px; }
}
@media all and (max-width: 1024px) { 
    h1.h_tit { font-size: 50px; }
    h2.h_tit { font-size: 35px; }
    h3.h_tit { font-size: 32px; }
    h5.h_tit { font-size: 28px; }
}
@media all and (max-width: 800px) { 
    .br1 { display: none; }
    h1.h_tit { font-size: 30px; }
    h2.h_tit { font-size: 25px; }
    h3.h_tit { font-size: 23px; }
    h4.h_tit { font-size: 25px; }
    h5.h_tit { font-size: 22px; }
    .btn_more { width: 75px; height: 32px; line-height: 30px; font-size: 12px; }
}
/* ========== // common ========== */


/* ========== Layout ========== */
html, body { height:100%;}
body { font-size:0.875em;}
.contents { margin-bottom: 150px;}

#wrap { width:100%; min-width:1600px; overflow: hidden; position: relative; }
.wrap_box1 { width:1800px; margin:0 auto; position:relative; }
.wrap_box2 { width:1600px; margin:0 auto; position:relative; }
.wrap_box3 { width:1920px; margin:0 auto; position:relative; }

@media all and (max-width:1800px) {
    #wrap { min-width:100%;}
    .wrap_box1 { width: 95%;}
    .wrap_box2 { width: 90%;}
    .wrap_box3 { width: 90%;}
}
@media all and (max-width: 800px) {
    .wrap_box1 { width: 90%;}
    .contents { margin-bottom: 50px;}
}
/* ========== // Layout ========== */


/* ========== tab_type1 ========== */
.tab_type1 { display: flex; flex-direction: row; justify-content: space-between; gap: 25px; }
.tab_type1 > li { width: 100%; }
.tab_type1 > li > a { padding: 22px; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid #ddd; border-radius: 50px; font-size: 18px; font-weight: 700; color: #B4B4B4; text-align: center; }
.tab_type1 > li > a.on { color: #fff; background: linear-gradient(to left, #00257E, #00133F); }

@media all and (max-width: 1260px) {
    .tab_type1 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .tab_type1 > li > a { padding: 15px; font-size: 16px; }
}
@media all and (max-width: 500px) { 
    .tab_type1 { display: flex; flex-wrap: wrap; gap: 10px; }
    .tab_type1 > li > a { padding: 12px; font-size: 14px; }
}
/* ========== // tab_type1 ========== */


/* ========== header ========== */
#header { position: relative; width: 100%; height: 90px; margin: 0 auto; display: flex; justify-content: center; align-items: center; background: #fff; }
#header .header_inner { width: 100%; margin: 0 40px 0 60px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; }

@media all and (max-width: 1000px) {
    #header { height: 70px; }
    #header .header_inner { width: 100%; height: 100%; margin: 0 30px; }
    #header img { height: 30px !important; }
}
/* ========== // header ========== */

/* .jbFixed { position: fixed !important; z-index: 9999;  background-color: rgba(255, 255, 255, 0.5) !important; backdrop-filter: blur(10px);} */

/* ========== lnb ========== */
#lnb .lnb_wrap { height: 100%; }
#lnb .lnb_wrap > ul { height: 100%; display: flex; flex-direction: row; }
#lnb .lnb_wrap > ul > li > a { display: block; text-align: center; width: auto; height: 50px; line-height: 50px; padding: 0 46px; text-align: center; font-size: 17px; font-weight: 700; color: #111; }
#lnb .lnb_wrap > ul > li > a:hover { color: #00257E; }
#lnb .lnb_wrap > ul > li > a:after { display: block; content: ""; width: 100%; height: 2px; background: #00257E; transform: scale(0, 1); transition: all .3s ease; }
#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:30px 0;}
#lnb .lnb_sub li { word-break:keep-all; text-align:center;}
#lnb .lnb_sub li a { display:inline-block; color:#666; font-weight:300; font-size:14px; line-height:1.2em; padding:3px 5px; transition: all .3s ease; margin-bottom:3px; }
#lnb .lnb_sub li a:hover { background:#092b6b; color:#fff;}

/* 모바일 번역 */
.m_translation .goog-te-combo { width: 70px; font-size: 12px; right: 10%; padding-left: 5px; }

/* 번역 */
.goog-te-combo { z-index: 100; width: 90px; height: 30px; border: 1px solid #00133F; border-radius: 50px; margin: 0 !important; position: absolute; top: 50%; transform: translate(0, -50%); }
.goog-te-gadget { color: #fff !important;}
.goog-te-gadget span { color: #fff !important;  }
.goog-te-gadget span > a { color: #fff !important;  }
.goog-te-gadget span > a > img { filter: brightness(0) invert(1); }

@media all and (max-width: 1024px) {
    .goog-te-combo { display: block !important; }
    #lnb .lnb_wrap > ul > li > a { font-size: 14px;}
}
@media all and (max-width: 500px) {
    .m_translation .goog-te-combo { right: 15%; }

}
/* ========== // lnb ========== */


/* ========== footer ========== */
#footer { background: #111; bottom: 0; }
#footer .footer_box { display: flex; flex-direction: column; gap: 30px; padding: 55px 0; color: #fff; }

.footer_box .bottom { display: flex; flex-direction: column; gap: 20px;}
.footer_box .bottom ul.btn { display: flex; flex-direction: row; gap: 40px; }
.footer_box .bottom ul.btn > li { position: relative; }
.footer_box .bottom ul.btn > li::before {  position: absolute; top: 50%; right: 0; width: 1px; height: 13px; background: #707070; display: block; content: ""; transform: translate(20px, -50%); }
.footer_box .bottom ul.btn > li:last-child::before { display: none; }
.footer_box .bottom ul.btn > li > a { font-size: 16px; font-weight: 700; color: #fff;}
.footer_box .bottom ul.btn > li > a:hover { color: #cccccc;}

.footer_info { display: flex; flex-direction: column; gap: 10px; color: #aaa; }
.footer_info ul.info_box { display: flex; flex-direction: row; gap: 30px; }
.footer_info ul.info_box > li { position: relative; }
.footer_info ul.info_box > li::before { position: absolute; top: 50%; right: 0; width: 1px; height: 13px; background: #686868; display: block; content: ""; transform: translate(15px, -50%); }
.footer_info ul.info_box > li:last-child::before { display: none; }
.footer_info ul.info_box > li > span { padding-right: 10px; font-weight: 800;}

@media all and (max-width: 1024px) { 
    #footer .footer_box {  gap: 20px; padding: 30px 0; }
    #footer .footer_box .top > img { height: 30px; }

    .footer_box .bottom { gap: 15px; }
    .footer_box .bottom ul.btn { gap: 30px; }
    .footer_box .bottom ul.btn > li::before { transform: translate(15px, -50%); }
    .footer_box .bottom ul.btn > li > a { font-size: 14px; }

    .footer_info { font-size: 13px; }
    .footer_info ul.info_box { flex-direction: column; gap: 5px; }
    .footer_info ul.info_box > li::before { display: none; }
}
/* ========== // footer ========== */

/* ========== Top 버튼 ========== */
#back-top { z-index:1000; position:fixed; bottom:40px; right:40px;}
#back-top a { width:55px; height:55px; display:flex; justify-content: center; align-items: center; color: #fff; font-size: 20px; background: #00257E; border-radius:100%; transition: all 0.7s ease;}
#back-top a i { font-size: 25px; padding-bottom: 3px;}
@media all and (max-width: 1024px) { 
    #back-top { bottom: 20px; right: 20px;}
    #back-top a { width: 40px; height: 40px; }
    #back-top a i { font-size: 15px; padding-bottom: 0;}
}
/* ========== // Top 버튼 ========== */

/* ========== sitemap ========== */
#sitemap { display: none; display:block; position:relative; z-index:5000;}
#sitemap .m_menu { position:absolute; top:0; right:-200px; width:200px; height: auto; background:#fff; z-index:5000; }
#sitemap .m_menu h2 { text-indent:-9999px; height: 0;}
#sitemap .m_menu .close { width:28px; height:28px; background:url('/project/design/common/bg_close1.svg') no-repeat center; background-size:30px; display:block; text-indent:-9999px; position:absolute; top:20px; right:25px; color: #072F63;}
#sitemap .sitemap_top { padding: 50px 20px 30px 30px; display: flex; justify-content: space-between; align-items: center;}
#sitemap .logo img { height: 30px;}

#sitemap .m_menu h3 a { position:relative; color:#000; font-size: 16px; border-bottom:1px solid #f4f4f4; display:block; padding: 20px 30px;}
#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: 4px solid; border-image:linear-gradient(to bottom, #AEC6E7, #33527C); 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; }
/* ========== // sitemap ========== */


@media all and (max-width:1260px) {
    #lnb .lnb_wrap > ul > li > a { padding: 0 25px;}
}
@media all and (max-width:1000px) {
    #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;}
    #gnb { display:none;}
    #m_gnb { position:absolute; top:0; right:0;}
    .search {display:none;}
}
@media all and (max-width: 1000px) {
    #m_gnb .btn_sitemap { position: relative; display:block; width:70px; height:70px;  background-size:30px;}
    #m_gnb .btn_sitemap::after { display: block; content: "\EF36"; color: #000 !important; font-family: 'remixicon'; font-size: 26px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    #sitemap .sitemap_top { padding: 20px 30px; }
    #sitemap .sitemap_top > .logo > a > img { height: 30px;}
}