@charset "utf-8";

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Basic

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
body, h1, h2, h3, h4, h5, h6, th, td, input, select, textarea, label {font-family:'Nanum Barun Gothic','돋움',Dotum,Helvetica,Verdana,Arial,sans-serif; color:#333;}
@media screen and (max-width:640px){
	body, h1, h2, h3, h4, h5, h6, th, td, input, select, textarea, label {line-height:21px; font-size:14px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Heading

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
h2, h3, h4, h5, h6 {transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
h4, .h4{padding-left:0; font-size:24px; line-height:30px;  color:#333333; margin:45px 0 15px 0;}
h4 span, .h4 span {font-size:16px; line-height:20px; font-weight:400;}
h4 em.table_tip {float:right; color:#404040; font-size:15px; line-height:19px; font-weight:400; margin-top:9px;}
h5, .h5{padding-top:0; font-size:20px; line-height:26px; color:#333; margin:25px 0px 10px 0px; position:relative; padding:0 0 0 20px;}
h5:before, h5:after {content:""; display:block; position:absolute; left:0;}
h5:before {width:7px; height:7px; background:#1398a1; left:6px; top:4px; z-index:5;}
h5:after {width:11px; height:11px; background:#b8e0e3; top:6px;}
h5 span, .h5 span {font-size:16px; line-height:20px;}
h5 em.table_tip {float:right; color:#404040; font-size:15px; line-height:19px; font-weight:400; margin-top:9px;}
h6, .h6{font-size:18px; line-height:25px; color:#333; margin:15px 0px 5px 0;}

@media screen and (max-width:840px){
    /*Heading*/
    h4, .h4{font-size:22px; line-height:26px; margin:35px 0 14px 0;}
	h4 span, .h4 span {font-size:15px;}
    h5, .h5{font-size:18px; line-height:24px; margin:25px 0px 10px 0px;}
	h5 em.table_tip {font-size:14px; margin-top:7px;}
    h6, .h6{font-size:16px; line-height:21px;}
}
@media screen and (max-width:740px){
    /*Heading*/
    h5 em.table_tip {margin-top:3px;}
}
@media screen and (max-width:640px){
    /*Heading*/
    h4, .h4{font-size:20px; line-height:24px; margin:33px 0 12px 0;}
	h4 span, .h4 span {font-size:14px;}
    h5, .h5{font-size:17px; line-height:22px; margin:20px 0px 7px 0px;}
}
@media screen and (max-width:480px){
    /*Heading*/
    h4, .h4{font-size:19px; line-height:23px; margin:30px 0 12px 0;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	 List - Basic

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.list_01{margin:0 0px 15px 0;}
.list_01>li{position: relative; padding-left:12px; margin-top:5px;}
.list_01>li:first-child {margin-top:0;}
.list_01>li:before{content:""; display:block; position: absolute; left:2px; top:9px; width:3px; height:3px; background:#1a5bb1;}
.list_02{margin:10px 0px 0 0px;}
.list_02>li{position: relative; padding-left:12px; margin-top:3px;}
.list_02>li:first-child {margin-top:0;}
.list_02>li:before{content:""; display:block; position: absolute; left:2px; top:10px; width:5px; height:2px; background:#919191;}
.num_list {}
.num_list li {margin-top:14px; padding-left:30px; position:relative;}
.num_list li:first-child {margin-top:0;}
.num_list li em {background:#e5ecf8; color:#1a5bb1; font-size:14px; width:24px; height:24px; display:inline-block; text-align:center; line-height:24px; border-radius:50%; -webkit-border-radius:50%; margin-right:7px; position:absolute; left:0; top:-1px;}
.num_list li ul {margin-top:5px; margin-bottom:0;}
.num_list li ul li {margin-top:5px; padding-left:12px;}

@media screen and (max-width:840px){
    .list_01>li{margin-top:5px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	List - Order

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
ol.num_list_01 li:first-child{margin-top:0;}
ol.num_list_01 li{line-height:23px; position: relative; padding: 0 0 0 28px; margin-top:10px; min-height:24px;}
ol.num_list_01 li em{display:block;  width:22px;  height:22px;  background:#dee3e6;  color:#858585;  text-align:center;  border-radius:50%; -webkit-border-radius:50%;  line-height:22px;  position:absolute;  left:0; top:0px; font-style:normal; font-size:13px; transition:all 0.3s ease;  -webkit-transition:all 0.3s ease; }
ol.num_list_02 li:first-child{margin-top:0;}
ol.num_list_02 li{line-height:23px; position:relative; padding:0 0 0 28px; margin-top:10px; min-height:24px;}
ol.num_list_02 li em{display:block;  width:22px;  height:22px;  background:#dee3e6;  color:#858585;  text-align:center; line-height:22px;  position:absolute;  left:0; top:0px; font-style:normal; font-size:13px; transition:all 0.3s ease;  -webkit-transition:all 0.3s ease; }

@media screen and (max-width:640px){
    /*number*/
    ol.num_list_01 li, ol.num_list_02 li {line-height:20px;}
    ol.num_list_01 li em, ol.num_list_02 li em{width:20px; height:20px; line-height:20px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Table

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.table {border-top:2px solid #666666;}
.table th,
.table td {padding:10px 10px; line-height:19px; vertical-align:middle !important; text-align:center; border:0; border-bottom:1px solid #b9b9b9 !important; border-left:1px solid #b9b9b9; word-break:keep-all;}
.table th {font-weight:600; color:#333;}
.table th:first-child,
.table td:first-child {border-left:0;}
.table th.point,
.table td.point{background:#f2f3f0;}
.table .t_left {border-left:1px solid #b9b9b9 !important;}
.table tr td input[type=text],
.table tr td input[type=password],
.table tr td textarea{width:100%; max-width:100%; height:35px; line-height:35px; margin:1px 0px; vertical-align:middle; border:1px solid #ccc; box-sizing:border-box;}
.table tr td textarea{height:auto; line-height:22px;}
.table tr td .btn{vertical-align:middle; padding:3px 10px; min-width:10px; margin:0;}

@media screen and (max-width:740px){
    /*Table*/
    .table td ul li:after {top:6px;}
	.table_scroll {position:relative;}
	.table_scroll:before {content:"좌우로 터치해서 보세요."; font-size:13px; width:168px; margin:0 auto; box-sizing:border-box; padding:0 0 0 25px; line-height:25px; color:#00589b; display:block; background:url(../../../images/site/skin/scroll_ico.png) no-repeat left top; height:22px; background-size:auto 100%;}
	.table_scroll .move {overflow:auto; margin-top:10px;}
    .table_scroll .move .table {width:700px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Form

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
input[type=radio]:focus,input[type=checkbox]:focus {outline:1px dotted ; outline-offset:0}
.bootstrap-datetimepicker-widget {z-index:200;}
.datetimepicker_group {display:flex; width:100%;}
.datetimepicker_group span {display:inline-block; line-height:30px; margin:0 3px;}
.datetimepicker_group .input-group .form-control {width:100%; box-shadow:none; -webkit-box-shadow:none;}
.datetimepicker_group .input-group .input-group-addon {background:url(/images/web/content/cal_ico.png) no-repeat center 50%; border:0; overflow:hidden; text-indent:-9999px;}
select {height:30px; line-height:30px; border:1px solid #ccc; background:none;}
input[type="text"], input[type="number"], input[type="date"], input[type="password"] {height:30px; line-height:30px; border:1px solid #ccc; min-width:70px; padding:0 5px; box-sizing:border-box; -webkit-box-sizing:border-box;}
input:disabled  {background:#f8f8f8;}
textarea {width:100%; min-height:150px; border:1px solid #ccc; resize:none; display:block; padding:5px;}
.dsi_radio {position:relative; display:inline-block; vertical-align:top; margin-right:20px;}
.dsi_radio input[type="radio"] {position:absolute; left:1px; top:50%; margin:0; margin-top:-7px; z-index:5; width:12px; height:12px;}
.dsi_radio label {position:relative; cursor:pointer; padding:0 0 0 20px; color:#222; display:inline-block; vertical-align:top; margin-bottom:0; font-weight:400;}
.dsi_radio label:before,
.dsi_radio label:after {content:""; display:block; box-sizing:border-box; border-radius:50%; -webkit-border-radius:50%; position:absolute; left:0; top:50%; z-index:10;
transition : all 0.3s ease; -webkit-transition : all 0.3s ease;}
.dsi_radio label:before {width:8px; height:8px; left:3px; margin-top:-5px; background:#0075ff; z-index:20; opacity:0; -webkit-opacity:0; }
.dsi_radio label:after {width:14px; height:14px; border:1px solid #9d9d9d; margin-top:-8px; background:#fff;}
.dsi_radio input[type="radio"]:checked + label:before {opacity:1; -webkit-opacity:1;}
.dsi_radio input[type="radio"]:checked + label:after {border:1px solid #0075ff;}
.dsi_check {position:relative; display:inline-block; vertical-align:top; margin-right:20px;}
.dsi_check input[type="checkbox"] {position:absolute; left:0; top:50%; margin:0; margin-top:-8px; z-index:5; width:13px !important; height:13px !important; line-height:12px !important; border-radius:2px; -webkit-border-radius:2px;}
.dsi_check label {position:relative; cursor:pointer; padding:0 0 0 18px; color:#222; display:inline-block; vertical-align:top; margin:0 !important; font-weight:400 !important;}
.dsi_check label:before,
.dsi_check label:after {content:""; display:block; box-sizing:border-box; position:absolute; left:0; top:50%; z-index:10; margin-top:-8px; border-radius:2px; -webkit-border-radius:2px;
transition : all 0.3s ease; -webkit-transition : all 0.3s ease;}
.dsi_check label:before {width:13px; height:13px; background:url(/images/web/layout/dsi_checkbg.png) no-repeat center 50%; z-index:20; opacity:0; -webkit-opacity:0;}
.dsi_check label:after {width:13px; height:13px; border:1px solid #9d9d9d; background:#fff;}
.dsi_check input[type="checkbox"]:checked + label:before {opacity:1; -webkit-opacity:1;}
.dsi_check input[type="checkbox"]:checked + label:after {border:1px solid #0075ff;}
.search_box .checkbox li > .word_group{display: inline-block;overflow: hidden;height: 14px;text-indent: -1000px;vertical-align: middle;width: 1px;background: #888;margin-right: 20px;}

@media screen and (max-width:640px){
    select {min-width:100px;}
	textarea {min-height:120px;}
}
@media screen and (max-width:480px){
	textarea {min-height:110px;}
}
@media screen and (max-width:400px){
    select {min-width:85px;}
	textarea {min-height:100px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Button

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.btn_group {margin-top:30px; text-align:right;}
a.blank:after {background:url(/images/web/layout/blank_ico2.png) no-repeat center 50%; width:14px; height:14px; vertical-align:top; margin:4px 0 0 5px; transition:all 0.3s ease; -webkit-transition:all 0.3s ease; vertical-align:top; margin:2px 0 0 7px;}
a.blank:hover, a.blank:active {color:#1a5bb1;}
a.blank:hover:after, a.blank:active:after {background:url(/images/web/layout/blank_ico2_on.png) no-repeat center 50%;}
a.btn {min-width:60px;  border-radius:0; -webkit-border-radius:0; font-size:14px; height:auto; line-height:21px; padding:9px 30px; box-sizing:border-box; text-decoration:none; margin-left:5px;}
a.btn,
a.btn:link,
a.btn:visited,
a.btn:active{background:#fff; border:1px solid #909090; color:#222;}
a.btn:hover{background:#909090; border:1px solid #909090; color:#fff;}

a.btn.bg_01:link,
a.btn.bg_01:visited,
a.btn.bg_01:active{background:#163a82; border:1px solid #163a82; color:#fff;}
a.btn.bg_01:link:hover,
a.btn.bg_01:visited:hover,
a.btn.bg_01:active:hover{background:#fff; border:1px solid #163a82; color:#163a82;}

a.btn.bg_02:link,
a.btn.bg_02:visited,
a.btn.bg_02:active{background:#45474d; border:1px solid #45474d; color:#fff;}
a.btn.bg_02:link:hover,
a.btn.bg_02:visited:hover,
a.btn.bg_02:active:hover{background:#fff; border:1px solid #45474d; color:#45474d;}

a.btn.bg_03:link,
a.btn.bg_03:visited,
a.btn.bg_03:active{background:#0c4f54; border:1px solid #0c4f54; color:#fff;}
a.btn.bg_03:link:hover,
a.btn.bg_03:visited:hover,
a.btn.bg_03:active:hover{background:#fff; border:1px solid #0c4f54; color:#0c4f54;}

a.btn.bg_04:link,
a.btn.bg_04:visited,
a.btn.bg_04:active{background:#db2929; border:1px solid #db2929; color:#fff;}
a.btn.bg_04:link:hover,
a.btn.bg_04:visited:hover,
a.btn.bg_04:active:hover{background:#fff; border:1px solid #db2929; color:#db2929;}


a.btn.down {padding:12px 18px; min-width:10px;}
.btn.down:link,
.btn.down:visited,
.btn.down:active {background:#909090; border:1px solid #909090; color:#fff;}
a.btn.down:before {display:none;}
a.btn.down:after {content:""; display:inline-block; width:16px; height:14px; margin-top:2px; margin-left:7px; background-image:url(/images/web/layout/btn_down_ico.png); vertical-align:top; transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
.btn.down.small:link,
.btn.down.small:visited,
.btn.down.small:active {background:#fff; border:1px solid #909090; color:#222;}
a.btn.small,
a.btn.small.down {min-width:10px; height:auto; font-size:13px; line-height:18px; padding:5px 10px;}
a.btn.down:hover,
a.btn.down.small:hover {background:#909090; border:1px solid #909090; color:#fff;}
a.btn.down:hover:after {background-image:url(/images/web/layout/btn_down_ico_on.png);}

@media screen and (max-width:840px){
	.btn_group {margin-top:25px;}
	a.btn{padding:7px 20px;}
	a.btn.down {padding:10px 15px;}
}
@media screen and (max-width:640px){
	a.btn{padding:6px 15px;}
	a.btn.down {font-size:14px; min-width:90px;}
}
@media screen and (max-width:480px){
	.btn_group {margin-top:20px;}
	a.btn.down {min-width:80px; padding:8px 15px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Tip

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.tip {color:#444; background:url(../../../images/site/kor/content/tip_ico.png) no-repeat left 4px; display:block; font-size:15px;}
.tip.ty2 {color:#1a5bb1; background:url(../../../images/site/kor/content/tip_ico2.png) no-repeat left 4px;}

@media screen and (max-width:640px){
.tip {font-size:14px;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Tab

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.js_tab {margin-bottom:20px;}
.js_tab ul {padding:1px 0 0 1px;}
.js_tab ul:after {content:""; display:block; clear:both;}
.js_tab ul li {width:20%;}
.js_tab ul li a {border:1px solid #e4e4e4; border-top:1px solid #1398a1; margin:-1px 0 0 -1px; height:auto; padding:12px 4px; font-size:14px; line-height:19px; color:#333; position:relative;
transition:all 0.3s ease, color 0.3s ease; -webkit-transition:all 0.3s ease, color 0.3s ease;}
.js_tab ul li a strong {display:block; font-weight:700; margin-top:3px;}
.js_tab ul li a:hover,
.js_tab ul li a:active,
.js_tab ul li a:visited,
.js_tab ul li a:link {text-decoration:none; color:#333;}
.js_tab ul li a.blank:hover:after,
.js_tab ul li a.blank:active:after {background:url(/images/web/layout/blank_ico2.png) no-repeat center 50%;}
.js_tab ul li.on a {background:#1398a1; border:1px solid #1398a1; z-index:7; color:#fff;}
/*
.js_tab ul li a:hover, .js_tab ul li.on a:link, .js_tab ul li.on a:visited, .js_tab ul li.on a:active, .js_tab ul li.on a:hover {background:#1398a1; border:1px solid #1398a1; z-index:10;}
*/
.js_tab.size2 ul li {width:50%;}
.js_tab.size3 ul li {width:33.333%;}
.js_tab.size4 ul li {width:25%;}
.js_tab.size5 ul li {width:20%;}

@media screen and (max-width:1024px){
.js_tab.select {background:#1398a1; position:relative; overflow:visible; margin-bottom:20px;}
.js_tab.select .title {margin-bottom:0;}
.js_tab.select .title a {font-size:14px; height:auto; line-height:19px; padding:12px 2%; font-weight:400; position:relative;}
.js_tab.select .title a strong {font-weight:400;}
.js_tab.select .title a:after {content:""; display:block; position:absolute; right:15px; top:50%; margin-top:-4px; width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:8px solid #fff;
transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
.js_tab.select .title a.on:after {transform:rotate(180deg); -webkit-transform:rotate(180deg);}
.js_tab.select ul {position:absolute; z-index:500; width:100%; box-sizing:border-box; border:1px solid #e1e1e1; border-top:0; background:#fff;}
.js_tab.select ul li {width:auto;}
.js_tab.select ul li a {height:auto; font-size:14px; line-height:19px; padding:10px 2%; border:0 !important; color:#323330 !important; background:#fff !important; border-top:1px solid #e1e1e1 !important;}
.js_tab.select ul li:first-child a {border:0 !important;}
.js_tab.select ul li a strong {display:inline-block; font-weight:400; margin-top:0;}
.js_tab.select ul li a.blank:hover:after,
.js_tab.select ul li a.blank:active:after {background:url(/images/web/layout/blank_ico2.png) no-repeat center 50% !important;}
}
@media screen and (max-width:640px){
.js_tab.select {margin-bottom:15px;}
.js_tab.select .title a {font-size:15px; padding:10px 15px;}
.js_tab.select ul li a {font-size:14px; padding:9px 15px;}
.js_tab ul li a:link {font-size:12px;}
a.blank:after{display:none;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

	Color

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.red {color:#d20000 !important;}
.black {color:#333 !important;}
.blue {color:#1a5bb1 !important;}
.sky {color:#1398a1 !important;}
.orange {color:#e18705 !important;}


@media screen and (max-width:1024px){
	.js_tab.select.visible ul {position:relative; display: block; border: none; z-index: 11;}
	.js_tab.select.visible ul li {width: 50%; float: left;}
	.js_tab.select.visible ul li a {border:1px solid #e1e1e1 !important; text-align: center;}
	.js_tab.select.visible ul li:first-child a {border-right:none !important;}
	.js_tab.select.visible ul li a {border-top: 1px solid #1398a1 !important;}
	.js_tab.select.visible ul li.on a {background:#1398a1 !important; color: #fff !important; border: 1px solid #1398a1;}
}