﻿@charset "euc-kr";

h1:focus { outline: none; }

.valid.modified:not([type=checkbox]) {outline: 1px solid #26b050;}

.invalid { outline: 1px solid #e50000;}

.validation-message { color: #e50000; }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}


/*********** main.css ***********/
#header {border-top: 2px solid #789d20;z-index: 998;height: auto !important;min-height: 250px;}
#header .tnb {position: absolute;top: 8px;left: 50%;z-index: 10;margin-left: 310px;}
#header .tnb:after {display: block;clear: both;content: '';}
#header .tnb li {float: left;position: relative;padding-left: 20px;}
#header .tnb li:after {display: block;content: '';width: 1px;height: 8px;background: #ddd;position: absolute;top: 50%;margin-top: -4px;left: 10px;}
#header .tnb li:first-child {padding-left: 0;}
#header .tnb li:first-child:after {display: none;}
#header .tnb li a {display: block;font-size: 11px;color: #444;letter-spacing: -0.02em;}
#header .subvis {width: 1000px;margin: 0 auto;padding: 68px 0 30px;}

/* main.css */
#header {width: 100%; margin: 0 auto; padding: 0; position: relative; height: 513px; }
#index_wrap	{ width:990px; height:120px; margin:0 auto; padding:0 0 0 10px;}
body#main {background:#fff; background:url(/images/index/bg.gif) center 0 repeat-x; }
#tabcontainer	{position:relative;margin:0; width:322px; height:120px; float:left;}
#tabcontainer	#tab	{margin:0;
	height:25px;
	width:322px;
	background: url('/images/index/bg_news.gif') repeat-x left bottom;
}
#tabcontainer	#tab	li	{float:left;display:block;margin:0;height:25px;}
#tabcontainer	#tab	li	img	{vertical-align:top;margin:0;}
#tabcontainer	li	span	{float:right;font-size:0.9em;}
#index_wrap	#content1, #index_wrap	#content2 {margin:9px 0 0 0;}
#index_wrap	#content1	li,
#index_wrap	#content2	li	{
	margin:0;
	padding:4px 0 4px 2px;
}
#tabcontainer	#content1	li.btn,
#tabcontainer	#content2	li.btn	{position:absolute;top:10px;right:1px;background:none; padding:0;}

#index_wrap	.main_quick	{ position:relative; width:240px; height:116px; padding:0 0 0 30px; float:left;}

#index_wrap	.main_right	{ width:360px; float:right; padding:0 10px 0 0;}
#index_wrap	.main_right 	.main_banner	{ overflow:hidden;width:360px;}
#index_wrap	.main_right 	.main_banner	li	{ float:left; padding:0 4px 0 0; margin:0;}
#index_wrap	.main_right	 .main_link	{ padding:10px 0 0 0; width:315px; height:55px;}

#footer	{width:100%; padding:20px 0 20px; z-index:10; margin:0 auto; clear:both;}

/* global.css */
@import url('nanumgothic/nanumgothic.css');

html, body {
    margin: 0;
    padding: 0;
}

body, table th, table td {
    font-family: dotum, '나눔고딕';
    text-align: center;
    font-size: 12px;
    color: #777;
    line-height: 130%;
}

fieldset, img { border:0; }
table th, table td   {text-align:left;font-size:1em;}

a:link 	{color:#666;text-decoration:none;}
a:visited	{color:#666;text-decoration:none;}
a:hover, a:focus	{color:#ea5959;text-decoration:underline;}
a:active	{color:#666;text-decoration:underline;}

a.blue:link, a.blue:visited, a.blue:hover, a.blue:active	{color:#82acd1;text-decoration:underline; font-weight:bold;}
/* //�ؽ�Ʈ �� �ĺ� ������ ��ũ ��Ÿ�� */

ul, li, ol, dl, dt, dd, h1, h2, h3, h4, h5, p, th, td, form, fieldset	{padding:0; margin:0;}
ul, ol, li {list-style:none;}
legend {display:none;}
p	{text-align:justify;}

input, select	{
	/* height:18px; */
	vertical-align:middle;
	font-family:dotum, '나눔고딕';
	font-size:1em;
	color: #656565;
}
/*input	{padding:3px 3px 1px 3px;}
html>body	input	{padding:3px 3px 1px 3px;}*/
input.nobrd	{
	margin:-1px 4px 1px 0;
	border:none;
	background:transparent;
}
.inp_reply	{ border:#bcbcbc 1px solid; background:#f1f1f1;}
.inp_reply2	{border:#bcbcbc 1px solid; background:#fff; font-size:11px; color:#777;}
textarea.write	{width:534px;height:260px;font-size:11px; color:#666;font-family:dotum, '����'; line-height:150%;}
textarea.write1	{width:96%;font-size:11px; color:#666;font-family:dotum, '����'; line-height:150%;}
textarea.write2	{width:610px;height:70px;font-size:11px; color:#666;font-family:dotum, '����'; line-height:150%;}

label	{margin:0;display:none;}
label.radio	{margin:0 20px 0 0;display:inline;}

colgroup, nobr, thead	{margin:0;padding:0;}

.fontNanum{ font-family: 'Nanum Gothic', "��������","나눔고딕", "����", Dotum, Gulim, serif; }


/**************************************************
  html로 변경 작업
***************************************************/
/* Webfonts */
@font-face{ font-family: ns; src: url(../font/notokr-regular.eot); src: local('※'), url(../font/notokr-regular.woff) format('woff'); }
@font-face{ font-family: ns; font-weight: bold; src: url(../font/notokr-bold.eot); src: local('※'), url(../font/notokr-bold.woff) format('woff'); }

/*********** Reset Elements ***********/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,
del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,select,button,
ul,li,fieldset,form,label,legend,caption,tbody,tfoot,thead,tr,textarea{margin: 0;padding: 0;}
body,td,form,select,input,button,textarea,div,option,pre,p,span,blockquote,li,dt,dd,legend,label,h1,h2,h3,h4,h5,h6{font-family: ns,dotum,gullim,Tahoma,Arial,Helvetica,sans-serif;font-size: 14px;color: #666666;}

#index_wrap {width: 1000px !important;padding: 0 !important;height: auto !important;}

.visual {display: block;margin-bottom: 50px;position: relative;}
.visual .bx-controls-direction a {position: absolute;top: 50%;z-index: 60;margin-top: -22px;width: 40px;height: 40px;line-height: 40px;border: 2px solid #ddd;background: #fff;text-align: center;font-size: 16px;color: #333;font-weight: bold;border-radius: 50%;box-shadow: 0 0 10px rgba(0,0,0,0.3);}
.visual .bx-controls-direction a:hover {text-decoration: none;}
.visual .bx-prev {left: 30px;}
.visual .bx-next {right: 30px;}
.visual .button {position: absolute;top: 30px;right: 30px;z-index: 60;text-align: right;border-top: 1px solid #ccc;}
.visual .button a {display: block;background: rgba(255,255,255,0.7);border-bottom: 1px solid #ccc;height: 30px;line-height: 30px;padding: 0 10px;font-size: 12px;color: #7288a3;letter-spacing: -0.02em;}

#main hgroup {display: block;}
#main hgroup h3 {display: block;font-size: 12px;color: #000;font-weight: bold;letter-spacing: -0.02em;background: none;margin: 0;padding-left: 0;}
#main .main_quick {position: relative;}
#main .main_quick .bx-pager {position: absolute;top: 2px;right: 0;}
#main .main_quick .bx-pager:after {display: block;clear: both;content: '';}
#main .main_quick .bx-pager-item {float: left;margin: 2px;}
#main .main_quick .bx-pager-item a {display: block;border-radius: 2px;width: 12px;height: 12px;line-height: 12px;text-align: center;border: 1px solid #ddd;font-size: 10px;color: #333;background: #f1f1f1;}
#main .main_quick .bx-pager-item a:hover {text-decoration: none;}
#main .main_quick .bx-pager-item a.active {background: #1d6cb6;color: #fff;text-decoration: none;}

#contents_wrap {margin: 0 auto !important;}

#leftmenu {border-right: 1px solid #ddd;padding-right: 5px;}
#leftmenu hgroup > * {display: block;line-height: 1.2em;}
#leftmenu hgroup span {font-size: 18px;color: #0e4194;font-weight: bold;letter-spacing: -0.02em;}
#leftmenu hgroup h3 {background: none;padding: 0;margin: 0;font-size: 28px;color: #333;font-weight: bold;letter-spacing: -0.02em;}
#leftmenu > ul {margin-top: 30px;}
#leftmenu > ul > li > a {display: block;padding-left: 15px;position: relative;border-bottom: 1px solid #ddd;font-size: 14px;color: #333;letter-spacing: -0.02em;height: 30px;line-height: 30px;}
#leftmenu > ul > li > a:after {display: block;content: '';position: absolute;top: 12px;left: 5px;width: 3px;height: 3px;background: #f1f1f1;border: 1px solid #ddd;}
#leftmenu > ul > li > ul {display: none;background: #f1f1f1;border: 1px solid #ddd;border-top: 0;border-right: 0;padding: 10px;}
#leftmenu > ul > li > ul > li > a {display: block;font-size: 12px;line-height: 20px;}
#leftmenu > ul > li.active > a {color: #0e4194;}
#leftmenu > ul > li.active > ul {display: block;}
#leftmenu > ul > li > ul > li.active > a {color: #0e4194;}
#leftmenu .button {margin-top: 80px;}
#leftmenu .button a {display: block;margin-bottom: 10px;}
#leftmenu .button a img {display: block;}

#contents {margin-top: 0 !important;}
#location {border-bottom: 2px solid #ddd;margin-bottom: 15px;position: static;}
#location:after {display: block;clear: both;content: '';}
#location h2 {float: left;margin: 0;font-size: 22px;color: #111;font-weight: bold;letter-spacing: -0.02em;position: relative;line-height: 40px;}
#location h2:after {display: block;content: '';position: absolute;bottom: -2px;left: 0;width: 100%;height: 2px;background: #0e4194;}
#location .navi {float: right;margin-top: 10px;}
#location .navi a {font-size: 12px;color: #555;letter-spacing: -0.02em;}

._tabw .box {display: none;}
._tabw .box.active {display: block;}
.tabwrap {margin-bottom: 50px;min-height: 390px;}
.tabwrap:after {display: block;clear: both;content: '';}
.tabwrap .tab {float: left;width: 42%;}
.tabwrap .tab:after {display: block;clear: both;content: '';}
.tabwrap .tab .btn {clear: none;float: left;margin: 1%;width: 31.33%;border: 1px solid #ddd;background: #f1f1f1;font-size: 13px;color: #111;font-weight: bold;letter-spacing: -0.02em;height: 40px;line-height: 40px;}
.tabwrap .tab .btn.active {background: #2462b5;color: #fff;}
.tabwrap .tabcon {float: right;width: 49%;border: 2px solid #2462b5;border-left: 0;border-right: 0;}


/*********** layout.css ***********/
#skipnavi { position:relative; width:995px; z-index:2;margin:0 auto;}
#skipnavi a { display:block; padding:0 10px; margin:0 10px;height:0; overflow:hidden; color:#000; text-align:right;}
#skipnavi a:hover, #skipnavi a:focus, #skipnavi a:active { height:auto;}

#returntotop { position:relative; bottom:0; width:995px; z-index:2;margin:0 auto;}
#returntotop a { display:block; padding:0 10px; height:0; overflow:hidden; color:#000; text-align:right;}
#returntotop a:hover, #returntotop a:focus, #returntotop a:active { height:auto;}

body	 {background:#fff url(../images/common/bg.gif) 0 0 repeat-x;}

#header	{width:100%; margin:0 auto; padding:0; position:relative; height:250px;}
#contents_wrap {
    clear: both;
    position: relative;
    width: 1000px;
    margin: -50px auto;
    overflow: hidden;
    padding: 0;
}
/* left menu */
#leftmenu {
    float: left;
    width: 180px;
    padding: 0;
    margin: 0;
}

.left_banner {
    padding: 20px 0 50px 10px;
}

    .left_banner li {
        padding: 4px 0;
        display: block;
        font-size: 0;
    }
/* //left menu */


/* contents layout & bg */
#contents {
    float: right;
    width: 730px;
    margin: 50px 30px 0 0;
    padding: 0 0 50px 0;
}
/* //contents layout & bg */

/* page location
#location	{
	padding:0px 0 0px 0;
	font-size:0.9em;
	height:11px;
	text-align:right;
	color:#8c8c8c;
	font-family:dotum, '????';
	position:absolute; top:60px; right:30px;
} */
#location strong {
    color: #333;
    font-weight: normal;
}

#location a:link, #location a:active, #location a:visited {
    color: #8c8c8c;
}

#location a:hover, #location a:focus {
    color: #8c8c8c;
}

#location a.home:link, #location a.home:active, #location a.home:hover, #location a.home:visited {
    padding: 0 0 0 12px;
    background: url(../images/common/blt_home.gif) 0 1px no-repeat;
}

#location a.home img {
    vertical-align: middle;
    margin: 0 0 2px 0;
}
/* //page location */

/* head title */
h2 {
    clear: both;
    margin: 0 0 25px 0;
    padding: 0 0 0 0;
    background: url(../images/common/blt_gray.gif) 0 bottom repeat-x;
    text-align: left;
}

h3 {
    clear: both;
    margin: 15px 0 5px 0;
    padding: 3px 0 1px 15px;
    color: #222;
    background: url(/images/common/blt_h3.gif) 0 5px no-repeat;
    font-family: 'Nanum Gothic', "????????","????", "????", Dotum, Gulim, serif;
}

    h3.first {
        margin: 0 0 15px 0;
    }

h4 {
    clear: both;
    font-family: 'Nanum Gothic', "????????","????", "????", Dotum, Gulim, serif;
    margin: 0 0 0 6px;
    padding: 5px 0 0 10px;
    color: #333;
    font-size: 12px;
    background: url(/images/common/rec_grey.gif) 0 10px no-repeat;
}

    h4.type2 {
        padding: 1px 0 0 14px;
        background: url('/images/front/common/blt_h4.gif') no-repeat 0 3px;
    }

    h4.notit {
        margin: 0;
    }

h5 {
    clear: both;
    margin: 0 0 5px 0;
    padding: 5px 0 0 13px;
    font-size: 1em;
    background: url('/images/front/common/blt_arw_purple.gif') no-repeat 0 7px;
}
/* //head title */

/* footer */
#footer {
    width: 100%;
    padding: 50px 0 20px;
    z-index: 10;
    margin: 0 auto;
    clear: both;
}

    #footer .footer_wrap {
        position: relative;
        width: 1000px;
        height: 50px;
        margin: 0 auto;
        padding: 15px 0 0 0;
        background: url(../images/common/footer_logo.gif) 10px 18px no-repeat;
        border-top: #eeeeee 1px solid;
    }

    #footer ul {
        padding: 0 0 0 32px;
        float: left;
    }

        #footer ul li {
            float: left;
            display: block;
            font-size: 0;
            padding: 0 8px 0 8px;
            background: url('../img/common/bar_ver_gray2.gif') no-repeat left 1px;
        }

            #footer ul li.first {
                padding: 0 5px 0 0;
                background: none;
            }

    #footer address {
        padding: 5px 0 0 170px;
        float: left;
        display: block;
    }

        #footer address img {
            margin: 0;
            vertical-align: middle;
        }

    #footer .copyright {
        padding: 4px 0 0 170px;
        clear: both;
        float: left;
        display: block;
    }

    #footer .linksite {
        position: absolute;
        top: 20px;
        right: 20px;
    }

        #footer .linksite img {
            vertical-align: middle;
        }
    /* //footer */

    #header .utility ul li,
    ul.gnb_submenu li,
    #quickmenu li,
    #footer ul li {
        font-size: 0;
        line-height: 100%;
    }

.logo {
    position: absolute;
    top: 10px;
    left: 50%;
    margin: 0 0 0 -450px;
    z-index: 9999;
}


/* 슬라이더 컨테이너: 자식 요소의 위치 기준점 */
.blazor-slider-container {
    position: relative;
    width: 100%;
    height: 400px; /* 슬라이더 높이를 지정하세요 */
    overflow: hidden;
}

/* 모든 슬라이드(li)를 겹치게 하고 기본적으로 숨김 */
.blazor-slider-list li {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0; /* 기본적으로 투명하게 */
    transition: opacity 0.5s ease-in-out; /* 부드러운 전환 효과 */
    visibility: hidden;
}
