@charset "utf-8"; 
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css"); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900; 1,100..900&display=swap'); @font-face { font-family: 'NanumHuman'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2501-1@1.1/NanumHumanTTFExtraLight.woff2') format('woff2'); font-weight: 200; font-display: swap; } 
@font-face { font-family: 'NanumHuman'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/2501-1@1.1/NanumHumanTTFHeavy.woff2') format('woff2'); font-weight: 900; font-display: swap; } 
@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Thin.woff2') format('woff2'); font-weight: 100; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraLight.woff2') format('woff2'); font-weight: 200; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Light.woff2') format('woff2'); font-weight: 300; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-SemiBold.woff2') format('woff2'); font-weight: 600; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Bold.woff2') format('woff2'); font-weight: 700; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraBold.woff2') format('woff2'); font-weight: 800; font-display: swap; } 

@font-face { font-family: 'Pretendard'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Black.woff2') format('woff2'); font-weight: 900; font-display: swap; } 

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900; 1,100..900&display=swap');

:root { --font-Pretendard: "Pretendard", sans-serif; --font-NotoSans: "Noto Sans", sans-serif; --font-NanumHuman: "NanumHuman"; --color-main: #0039A2; --color1: #F6EBD7; --color-gray: #696969; } 
input, button,
html, body,h1,h2,h3 { font-size: 20px; font-family: var(--font-Pretendard); letter-spacing: -0.038rem; line-height: 1.4; word-break: keep-all; word-wrap: break-word; color:#000; touch-action: auto; overscroll-behavior: auto; text-size-adjust:100%; scroll-behavior: smooth; } 
html { overflow-x: hidden; } 
body { overflow-x: visible; } 
html.locked, 
body.locked { overflow: hidden; } 
body::after { content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,.5); position: fixed; top: 0; left: 0; opacity: 0; pointer-events: none; transition: .35s; z-index:100 } 
body.locked::after { opacity: 1; pointer-events: auto; } 
body { } 
.cinner { max-width: 1400px; width: 92%; margin: 0 auto; } 
.line-br { display: block; } 

@media all and (max-width: 1399px) { } 
@media all and (max-width: 1024px) { html, body { font-size: 18px; } 
 }
@media all and (max-width: 640px) { html, body { font-size: 16px; } 
 }


body::-webkit-scrollbar { width: 10px; } 
body::-webkit-scrollbar-thumb { background-color: var(--color-main); } 
body::-webkit-scrollbar-track { background-color: #f9f9f9; } 


#header { width: 100%; height: 100px; background: transparent; position: absolute; top: 0; left: 0; right: 0; margin: auto; z-index: 999; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.05); border-bottom: 1px solid rgba(255, 255, 255, .3); } 
#header .cinner { height: 100%; position: relative; display: flex; justify-content: space-between; align-items: center; } 
.header__gnb { position: absolute; top: 5px; right: 0; } 
.header__gnb ul { display: flex; justify-content: flex-end; gap: 15px; } 
.header__gnb ul > li { position: relative; } 
.header__gnb ul > li:not(:last-child) { padding-right: 15px; } 
.header__gnb ul > li > a { color: #666; font-size: 15px; transition: .35s; } 

.header__logo { height:100%} 

.header__logo > a {display:block; padding:10px 0; height:100% } 
 .header__logo > a img {width:auto; height:100%}
#header__nav { } 
#main-nav { height: 100%; left: 0; right: 0; bottom: 0; margin: auto; } 
.main-nav__depth1 { width: 100%; height: 100%; } 
.main-nav__depth1 .mn-ul1 { display: flex; justify-content: center; align-items: center; gap: 60px; width: 100%; height: 100%; } 
.main-nav__depth1 .mn-li1 { height: 100%; position: relative; } 
.main-nav__depth1 .mn-a1 { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; text-align: center; transition: .35s; font-family: "Montserrat"; color:#fff; font-size: 1.1em; } 

.main-nav__depth2 { min-width: 180px; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); visibility: hidden; opacity: 0; transition: .35s; } 
.main-nav__depth1 .mn-li1.gnb_1dli_over .main-nav__depth2 { visibility: visible; opacity: 1; } 
.main-nav__depth2 .mn-ul2 { width: 100%; box-sizing: border-box; background: var(--color-main); position: absolute; top: 0; left: 50%; transform: translateX(-50%); } 
.main-nav__depth2 .mn-li2:not(:last-child) { border-bottom: 1px solid rgba(255,255,255,.25); box-sizing: border-box; } 
.main-nav__depth2 .mn-a2 { display: block; padding: 15px 16px; color: #fff; font-size: 18px; font-weight: 500; text-align: center; position: relative; transition: .35s; } 



#util { flex: 0 0 auto; display: none; align-items: center; gap: 30px; position: absolute; top: 0; bottom: 0; right: 0; margin: auto; } 
#util .nav__btn { flex: 0 0 auto; } 
#util .nav__btn a { display: flex; align-items: center; width: 25px; height: 19px; position: relative; } 
#util .nav__btn a::before,
#util .nav__btn a::after { content: ''; display: block; width: 100%; height: 2px; border-radius: 3px; background: #fff; position: absolute; left: 0; right: 0; margin: auto; } 
#util .nav__btn a::before { top: 0; } 
#util .nav__btn a::after { bottom: 0; } 
#util .nav__btn a span { display: block; width: 100%; height: 2px; border-radius: 3px; background: #fff; } 


@media all and (max-width: 1399px){
 .main-nav__depth1 .mn-ul1 { gap: 45px; } 
 }
@media all and (max-width: 1199px){
 #header { height: 80px; } 
 
 .header__gnb { display: none; } 
 #header__nav { height: 100%; } 
 .main-nav__depth1 { display: none; } 
 #util { gap: 20px; display:flex} 
 #util > ul > li.lang-wrap { margin-left: 10px; } 
 }
@media all and (max-width: 1024px){
 }
@media all and (max-width: 640px){
 #header { height: 70px; } 
 #util { gap: 15px; } 
 #util > ul { gap: 10px; } 
 }


#sidebar { max-width: 450px; width: 100%; height: 100%; padding: 20px 0; box-sizing: border-box; background: #fff; position: fixed; top: 0; right: -100%; z-index: 9999; transition: .35s; visibility: hidden; opacity: 0; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); } 
#sidebar.active { right: 0; visibility: visible; opacity: 1; } 
.sidebar__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding: 0 20px; } 
.sidebar__header > .btn-adm { display: block; width: 60px; padding: 3px 0; background: #E04545; color: #fff; font-size: 16px; text-align: center; } 
.sidebar__header > .sidebar-btn_close { display: block; width: 24px; aspect-ratio: 1 / 1; border: 0; background: no-repeat; position: relative; } 
.sidebar__header > .sidebar-btn_close::before,
.sidebar__header > .sidebar-btn_close::after { content: ''; display: block; width: 100%; height: 3px; background: var(--color-main); position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } 
.sidebar__header > .sidebar-btn_close::before { transform: rotate(45deg); } 
.sidebar__header > .sidebar-btn_close::after { transform: rotate(-45deg); } 

.sidebar__cont { max-height: 92%; box-sizing: border-box; overflow-y: scroll; } 
.sidebar__cont::-webkit-scrollbar { width: 4px; } 
.sidebar__cont::-webkit-scrollbar-thumb { background-color: #bfbfbf; border-radius: 2px; } 
.sidebar__cont::-webkit-scrollbar-track { background-color: transparent; } 
.sidebar_user { margin-bottom: 20px; padding: 0 20px; } 
.sidebar_user > ul { display: flex; flex-wrap: wrap; gap: 12px; } 
.sidebar_user > ul > li { width: calc(50% - 6px); } 
.sidebar_user > ul > li:nth-child(1) { width: 100%; } 
.sidebar_user > ul > li > a { display: flex; justify-content: center; align-items: center; width: 100%; height: 45px; border: 1px solid var(--color-main); border-radius: 5px; color: var(--color-main); font-size: 16px; font-weight: 500; } 
.sidebar_user > ul > li > a.color { background: var(--color-main); color: #fff; } 

.sidebar__menu_depth1 a { color: #000; font-weight: 500; transition: .35s; } 
.sidebar__menu_depth1 a:hover { color: var(--color-main); } 
.sidebar__menu_depth1 .mn-ul1 { border-top: 1px solid #EBEBEB; } 
.sidebar__menu_depth1 .mn-li1 { border-bottom: 1px solid #EBEBEB; position: relative; } 
.sidebar__menu_depth1 .mn-li1:has(.sidebar__menu_depth2) >.toggle-arrow { display: block; width: 12px; height: 12px; border-top: 2px solid #000; border-right: 2px solid #000; position: absolute; top: 31px; right: 20px; transform: translateY(-50%) rotate(135deg); cursor: pointer; transition: transform 0.3s ease-in-out; } 
.sidebar__menu_depth1 .mn-li1:has(.sidebar__menu_depth2).active > .toggle-arrow { transform: rotate(-45deg); } 
.sidebar__menu_depth1 .mn-a1 { display: block; padding: 20px 30px; } 
.sidebar__menu_depth2 { max-height: 0; background: #fafafa; overflow: hidden; transition: max-height 0.3s ease-in-out; } 
.sidebar__menu_depth2 .mn-li2 { border-bottom: 1px solid rgba(255,255,255,.3); position: relative; } 
.sidebar__menu_depth2 .mn-li2:last-child { border-bottom: 0; } 
.sidebar__menu_depth2 .mn-li2:has(.sidebar__menu_depth3) > .toggle-arrow { display: block; width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: 29px; right: 10px; transform: translateY(-50%) rotate(135deg); cursor: pointer; transition: transform 0.3s ease-in-out; } 
.sidebar__menu_depth2 .mn-li2:has(.sidebar__menu_depth3).active > .toggle-arrow { transform: rotate(-45deg); } 
.sidebar__menu_depth2 .mn-a2 { display: block; padding: 15px 30px; color: #666; font-size: 18px; font-weight: 500; } 

@media all and (max-width: 1024px){
 .sidebar__menu_depth1 .mn-a1 { padding: 15px 30px; font-size: 18px; } 
 .sidebar__menu_depth1 .mn-li1:has(.sidebar__menu_depth2) >.toggle-arrow { top: 26px; } 
 .sidebar__menu_depth2 .mn-a2 { font-size: 16px; } 
 }
@media all and (max-width: 640px){
 .sidebar__header > .sidebar-btn_close { width: 30px; } 
 }




#footer { background: #3A3A3A; color: #fff; } 
.footer_wrap { } 
.footer_mid .cinner { padding: 50px 0; } 
.footer_mid .footer_info { display: flex; flex-direction: column; gap: 10px; margin-bottom: 30px; } 
.footer_mid .footer_info > div { display: flex; flex-wrap: wrap; gap: 10px 50px; font-size: 14px; } 
.footer_mid .footer_info > div span { color: rgba(255, 255, 255, .5); } 
.footer_mid .footer_info > div span i { font-style: normal; color: #fff; font-weight: 500; font-family: 'Montserrat'; margin-right: 5px; } 
.footer_mid p { font-size: 14px; line-height: 1.6; font-family: 'Montserrat'; margin-bottom: 20px; } 
.footer_mid p:last-child {margin-bottom:0}
.footer_bottom  {border-top:1px solid rgba(255,255,255,.1)}
.footer_bottom .cinner { display: flex; justify-content: space-between; padding: 20px 0; } 
.footer_bottom .copyright { font-family: 'Montserrat'; font-size: 14px; } 
.footer_bottom .menu { display: flex; gap: 40px; font-weight: 500; } 
.footer_bottom .menu a { font-size: 14px; color: #fff; } 
.footer_bottom .menu a:first-child { color: #5590FF; } 
@media (max-width:1000px) { } 



#container { margin-top: 130px; } 

@media all and (max-width: 1024px){
 #container { margin-top: 100px; } 
 #footer .cinner { flex-direction: column; gap:30px } 
 .footer__cont .ft_right { gap:30px; flex-wrap: wrap; } 
 .fixed_link_wrap { right:30px; bottom:30px } 
 .fixed_link_wrap img { max-width:80px; } 
 }

@media all and (max-width: 640px){
 #container { margin-top: 80px; } 
 .fixed_link_wrap { right:20px; transform:none; bottom:40px; top:unset } 
 .fixed_link_wrap img { max-width:70px; } 
.footer_mid p span {display:inline}
.footer_mid .footer_info > div {gap:10px 20px;}

 }




#headerSearchBox { position:absolute; left:0; top:130px; width:100%; z-index:10000; background:var(--color-main); } 
#headerSearchBox .cinner { display: flex; align-items: center; justify-content: center; padding:100px 0 } 
#headerSearchBox .cinner button { background: transparent; border: 0; } 
#headerSearchBox .cinner input { background: transparent; color: #fff; border: none; border-bottom: 2px solid #fff; padding: 10px; width: 350px; } 
#headerSearchBox .cinner input::placeholder { color:#fff } 
.msearch > form { display: flex; align-items: center; gap: 14px; } 
.msearch .search-cont { width: 100%; height: 80px; padding: 16px 50px; border: 2px solid var(--color1); border-radius: 40px; box-sizing: border-box; background: #fff; position: relative; cursor: pointer; } 
.msearch .search-cont.active { box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.1); } 
.msearch .search-cont > .txt { margin-bottom: 3px; color: var(--color-main); font-size: 16px; font-weight: 500; line-height: 1.0; } 
.msearch .search-cont > input[type="text"] { width: 100%; border: none; color: #999; font-size: 18px; } 
.msearch #sch_submit { flex: 0 0 auto; display: block; width: 78px; aspect-ratio: 1 / 1; border: 0; border-radius: 15px; background: var(--color-main) none center center / cover no-repeat; } 
.msearch .search-popup { display: none; width: 100%; border-radius: 20px; padding: 40px 50px; box-sizing: border-box; background: #fff; font-size: 16px; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 4px 20px 0px rgba(0,0,0,0.1); position: absolute; top: 100px; left: 0; z-index: 999; } 
.msearch .search-filter-cont > div:not(:last-child) { margin-bottom: 30px; } 
.msearch .search-filter-cont .tit { margin-bottom: 10px; color: var(--color-main); font-weight: 700; } 
.msearch .search-filter-cont .filter-keyword { display: flex; flex-wrap: wrap; gap: 14px; } 
.msearch .search-filter-cont .filter-keyword > .keyword { padding: 11px 36px; border: 1px solid #B3B3B3; border-radius: 20px; box-sizing: border-box; color: #B3B3B3; line-height: 1.0; } 
.msearch .search-filter-cont .filter-keyword > .keyword.active { border-color: var(--color-main); color: var(--color-main); } 
.msearch .search-auto-cont > .tit { margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid #D4D4D4; color: #000; font-weight: 600; } 

@media all and (max-width: 1199px){
 .msearch { margin-bottom: 40px; } 
 }
@media all and (max-width: 1024px){
 #headerSearchBox { top:100px; } 
 .msearch .search-cont { height: 60px; padding: 9px 30px; } 
 .msearch .search-cont > .txt { margin-bottom: 0; font-size: 14px; } 
 .msearch .search-cont > input[type="text"] { font-size: 16px; } 
 .msearch #sch_submit { width: 60px; } 
 .msearch .search-popup { padding: 30px; border-radius: 15px; top: 80px; } 
 .msearch .search-filter-cont .filter-keyword { gap: 10px; } 
 .msearch .search-filter-cont .filter-keyword > .keyword { padding: 8px 24px; } 
 }
@media all and (max-width: 768px){
 .msearch .search-cont { display: flex; align-items: center; gap: 10px; } 
 .msearch .search-cont > .txt { width: 46px; margin-bottom: 0; } 
 .msearch .search-cont > input[type="text"] { width: calc(100% - 56px); } 
 }
@media all and (max-width: 640px){
 #headerSearchBox { top:80px; } 
 .msearch { margin-bottom: 30px; } 
 .msearch > form { gap: 5px; } 
 .msearch .search-cont { height: 50px; padding: 6px 20px; } 
 .msearch .search-cont > input[type="text"] { font-size: 15px; } 
 .msearch #sch_submit { width: 50px; } 
 .msearch .search-popup { padding: 20px 20px; font-size: 15px; top: 70px; } 
 .msearch .search-filter-cont .filter-keyword > .keyword { padding: 8px 20px; } 
 }

