@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@200;300;400;600;700&display=swap');

.wrap_step{display:flex;justify-content:space-between;align-items:center;position:relative;margin-bottom:50px;}
.wrap_step:before{content:"";display:block;width:100%;height:1px;background:#EEE;position:absolute;top:50%;left:0;}
.wrap_step li{width:170px;height:170px;padding:5px;background:url(/sites/style_guide/images/common/pattern_11.png);border-radius:100%;}
.wrap_step div{width:100%;height:100%;padding:10px;border:2px solid #FFF;background:#EEE;text-align:center;font-weight:500;border-radius:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;position:relative;}
.wrap_step strong{font-weight:700;font-size:14px;font-family: 'Titillium Web', sans-serif;}
.wrap_step li.active div{color:#FFF;background:#0065b3;}

.wrap_box{background:#f5f5f5;padding:30px;border:1px solid #EEE;}
.wrap_box h3{padding-bottom:10px;}

.wrap_agree{padding:20px 0;text-align:center;font-weight:400;}
.wrap_agree span{margin:0 15px;}
.wrap_agree input{margin-right:6px;width:20px;height:20px;vertical-align:-2px;}

.btn{text-align:center;margin-top:50px;}
.btn input{padding:10px;width:150px;color:#FFF;background:#0065b3;font-size:18px;border-radius:30px;cursor:pointer;}
@media only screen and (max-width:768px){
	.wrap_step{margin-bottom:0;}
	.wrap_step li{display:none;width:100%;height:auto;border-radius:0;padding:0;background:none;}
	.wrap_step li.active{display:block;}
	.wrap_step div{border-radius:0;padding:0 0 10px 0;text-align:left;flex-direction:row;justify-content:flex-start;}
	.wrap_step li.active div{color:#000;background:#FFF;border-bottom:1px solid #0065b3;font-size:20px;}
	.wrap_step strong{font-size:25px;padding-right:10px;color:#0065b3;}
}


.table_form{border-top:2px solid #162b58;border-bottom:1px solid #162b58;}
.table_form table{width:100%;}
.table_form caption{text-indent:-9999px;height:0;position:absolute;left:9999px;top:9999px;}
.table_form th{background:#f5f5f5;border-bottom:1px solid #FFF;border-left:1px solid #FFF;font-weight:400;}
.table_form td{background:#FFF;text-align:left;border-bottom:1px solid #eaeaea;}
.table_form th,
.table_form td{padding:15px;line-height:1.3;text-align:left;}
.table_form th:first-child,
.table_form td:first-child{border-left:0;}
.table_form select,
.table_form input[type=text],
.table_form input[type=password],
.table_form input[type=button]{height:36px;padding:0 10px;border-color:#DDD;font-size:16px;}
.table_form input[type=button]{background:#888;color:#FFF;cursor:pointer;}
.table_form .wrap_1,
.table_form .wrap_2,
.table_form .wrap_8{margin-top:5px;}
.table_form span{padding:0 5px;}
.table_form select,
.table_form input[type=text]{}
.table_form input[type=radio]{display:inline-block;vertical-align:2px;}
.table_form input[type=checkbox]{display:inline-block;vertical-align:0;}
.table_form .wS{width:150px;}
.table_form .wL{width:49%;}
.table_form .colw{width:200px;}
.table_form .wrap_4{display:flex;}
.table_form .wrap_6{display:flex;}
.table_form .wrap_7 li{padding:5px 0;}
.table_form .wrap_7 li i{display:inline-block;width:230px;}
.table_form .wrap_6 li{display:flex;}
.table_form .wrap_5{margin:5px 0;}
.table_form .wrap_5 span{display:inline-block;width:100px;}
.table_form .wrap_8 select{margin:3px 0;}
.table_form_title{font-weight:700;padding:20px 0 10px 0;font-size:20px;}
@media only screen and (max-width:1024px){
	.table_form .wrap_6{display:block;}
	.table_form .wrap_6 li{padding:2px 0;}
	.table_form .wrap_7 li i{display:block;width:100%;margin-bottom:5px;}
}
@media only screen and (max-width:768px){
	.table_form .colw{width:100%;}
	.table_form tr{display:flex;align-items:center;flex-direction:column;}
	.table_form th,
	.table_form td{width:100% !important;border:0;}
	.table_form td{padding:10px 0;}
	.table_form select,
	.table_form input[type=text],
	.table_form input[type=password]{width:99.5%;}
	.table_form .wrap_2 input[type=text]{margin-top:5px;}
	.table_form .wrap_3{position:relative;}
	.table_form .wrap_3 input[type=button]{position:absolute;left:150px;top:0;}
	.table_form .wS{width:150px !important;}
	.table_form .wrap_5 span{display:block;width:100%;margin-bottom:5px;}
	.table_form .wrap_9 input[type=text]{width:calc(100% - 30px);}
}
@media only screen and (max-width:420px){
	.table_form .wrap_3 input[type=button]{left:auto;right:0;}
	.table_form .wS{width:100% !important;}
	.table_form .wrap_4{display:block;}
	.table_form .wrap_4 li{padding:2px 0;}
}


/* 220209 추가 */
.custom-check input {display: none;}
.custom-check label {font-size: 16px; line-height: 35px; color: #666666; padding-left: 30px; background: url("../images/checkbox.jpg") no-repeat left center;}
.custom-check input:checked + label {font-size: 16px; line-height: 35px; color: #666666; padding-left: 30px; background: url("../images/checkbox_on.jpg") no-repeat left center;}

.iphak-func-bx {padding: 5px; background: url("../images/line_bg.png"); margin-top: 35px; margin-bottom: 45px;}
.iphak-func-bx .iphak-func-inner {background: #F6F6F6 url("../images/func_bg.png") no-repeat right bottom; padding: 25px; min-height: 585px;}
.iphak-func-img {position: relative; float: left; width: 49%;}
.iphak-func-img .imgbx {position: absolute; width: 100%; left: 0; top: 0; height: 600px; background: url("../images/func_img.jpg") no-repeat center; background-size: cover;}
.iphak-func-img .imgbx::after {content: ""; position: absolute; border: 1px solid #fff; left: 10px; top: 10px; right: 10px; bottom: 10px;}
.iphak-func-img .imgbx img {width: 100%;}
.iphak-func-info {float: right; padding-left: 3%; width: 51%;}

@media all and (max-width: 768px){
	.iphak-func-bx {margin-bottom: 0px; margin-top: 0px;}
	.iphak-func-img {float: none; width: 100%;}
	.iphak-func-img .imgbx {position: static; height: 200px; margin-bottom: 25px;}
	.iphak-func-info {float: none; width: 100%; padding: 0;}
}

.cnct-input {overflow: hidden; background: #efefef; padding: 10px; margin-bottom: 10px; margin-top: 10px;}
.cnct-input li {float: left;}
.cnct-input li:first-child {margin-right: 10px;}

.board-table {position: relative; line-height: 1.6;}
.board-table:after {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #fff;}
.board-table table {position: relative;}
.board-table table:after {content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 2px; background: #104650}
.board-table table:before {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #FFF;}
.board-table thead th {padding: 14px 10px; background: #f7f8f9; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; font-size: 16px; font-weight: normal; color: #111;}
.board-table tbody {display: table-header-group;}
.board-table tbody th {padding: 13px 20px; background:#fbfbfb; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; font-weight: normal; color: #000; font-size: 15px;}
.board-table tbody td {padding: 13px 20px; background:#fff; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; text-align: left; color: #666; font-size: 15px;}
.board-table tbody td .link {position: relative; color: #666;}
.board-table tbody td .link::after {content: ''; position: relative; top: -2px; display: inline-block; width: 15px; height: 15px; background: url('../../images/guide/ic_tbl_link.png') no-repeat center center; margin-left: 10px; vertical-align: middle;}
.board-table .list > li {position: relative; padding-left: 10px;}
.board-table .list > li:after {content: ''; position: absolute; left: 0; top: 11px; width: 4px; height: 4px; background: #A8A9AD; border-radius: 100%;}
.board-table .align-l {text-align: left;}
.board-table .align-c {text-align: center;}
.board-table .align-r {text-align: right;}
.board-table strong {font-weight: 400; color: #000;}
.board-table input[type="text"] {padding: 0 10px;}
.board-table input[type="button"] {padding: 4px 10px; background: #898989; color: #fff;}
.board-table .essential-icon {display: inline-block; color: #ff0000; vertical-align: super;}

.board-table ._addMajor {margin-top: 10px;}

@media all and (max-width: 768px){
	.board-table table, .board-table tbody, .board-table tbody tr, .board-table tbody th, .board-table tbody td {display: block; width: 100%;}
	.board-table table .m-blank {display: block;}
	.board-table input[type="text"] {width: 100%;}
	.board-table input.short {width: 22%;}
	.board-table input.half {width: 50%;}
	.board-table .table-title {background: #dfdfdf;}
}

.percent-table {position: relative; line-height: 1.6;}
.percent-table:after {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #fff;}
.percent-table table {position: relative;}
.percent-table table:after {content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 2px; background: #104650}
.percent-table table:before {content: ''; position: absolute; right: 0px; top: 0px; width: 1px; height: 100%; background: #FFF;}
.percent-table thead th {padding: 14px 10px; background: #f7f8f9; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; font-size: 16px; font-weight: normal; color: #111;}
.percent-table tbody {display: table-header-group;}
.percent-table tbody th {padding: 13px 20px; background:#fbfbfb; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; font-weight: normal; color: #000; font-size: 15px;}
.percent-table tbody td {padding: 13px 20px; background:#fff; border-right: 1px solid #dddee0; border-bottom: 1px solid #dddee0; font-weight: 400; text-align: left; color: #666; font-size: 15px;}
.percent-table tbody td .link {position: relative; color: #666;}
.percent-table tbody td .link::after {content: ''; position: relative; top: -2px; display: inline-block; width: 15px; height: 15px; background: url('../../images/guide/ic_tbl_link.png') no-repeat center center; margin-left: 10px; vertical-align: middle;}
.percent-table .list > li {position: relative; padding-left: 10px;}
.percent-table .list > li:after {content: ''; position: absolute; left: 0; top: 11px; width: 4px; height: 4px; background: #A8A9AD; border-radius: 100%;}
.percent-table .align-l {text-align: left;}
.percent-table .align-c {text-align: center;}
.percent-table .align-r {text-align: right;}
.percent-table strong {font-weight: 400; color: #000;}
.percent-table input[type="text"], .percent-table input[type="password"] {padding: 0 10px;}
.percent-table input[type="button"] {padding: 4px 10px; background: #898989; color: #fff;}
.percent-table .essential-icon {display: inline-block; color: #ff0000; vertical-align: super;}