@charset "utf-8";

/* ##########################################################
	# 2019 비대면 차세대 UI/UX구축
	# 공통UI 신규가이드 추가
########################################################## */
/* --------------------------------------------------------------------------------
	# as-is 초기화스타일 우선적용
--------------------------------------------------------------------------------- */
/* body, h1, h2, h3, h4, h5, dl, dt, dd, th, td, div, p, a, form, fieldset, legend, input, button, label, textarea, li {color:#5a5a5a;} */

/* --------------------------------------------------------------------------------
	# 폼객체 :고정사이즈용
--------------------------------------------------------------------------------- */
.w-per25 {width:25%;*width:20%;}

/* --------------------------------------------------------------------------------
	# 폼객체 :라디오, 체크박스 :디자인용
-------------------------------------------------------------------------------- */
/* 유형2 기본 */
.label-check_2019 {display:inline-block;*display:inline;*zoom:1;}
.label-check_2019 input[type="radio"], 
.label-check_2019 input[type="checkbox"] {width:16px;height:35px;margin:0 -16px 0 0;opacity:0;z-index:auto;}
.label-check_2019 label {display:inline-block;position:relative;padding:0 16px 0 28px;line-height:35px;*display:inline;*zoom:1;}
.label-check_2019 label:before, 
.label-check_2019 label:after {content:'';position:absolute;left:0;top:9px;display:block;}
.label-check_2019 label:before {width:16px;height:16px;border:1px solid #b1b1b1;background:#fff;border-radius:50%;}
.label-check_2019 input:focus + label:before {outline:1px dotted #999;}
.label-check_2019 input[type="radio"]:checked + label:before, 
.label-check_2019 input[type="checkbox"]:checked + label:before {background-color:#ffd700;border-color:#ffd700;}
.label-check_2019 input[type="radio"]:checked + label:after, 
.label-check_2019 input[type="checkbox"]:checked + label:after {width:7px;height:3px;margin:5px 4px;border-left:2px solid #fff;border-bottom:2px solid #fff;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.label-check_2019 input[disabled] + label, 
.label-check_2019 input:checked[disabled] + label {color:#8c8c8c;}
.label-check_2019 input[disabled] + label:before {background:#e8e8e8; border-color:#b1b1b1;}
.label-check_2019 input:checked[disabled] + label:before{background:#e8e8e8; border-color:#e8e8e8;}
.input + .label-check_2019, 
.selbox + .label-check_2019 {margin-left:6px;}

@media \0screen\,screen\9 {
	.label-check_2019 label {padding-left:20px;}
	.label-check_2019 input {width:24px;height:auto;margin:-2px -20px 0 -4px;}
	.label-check_2019 label:before, .label-check_2019 label:after {display:none;}
}

/* 리스트형 */
.label-check_2019.list {display:block;}
.label-check_2019.list:after {content:'';display:block;clear:both;}
.label-check_2019.list > [class*="w-per"] {float:left;}

/* 단일형 */
.label-check_2019.one label {padding:0 0 0 18px;width:0;overflow:hidden;white-space:nowrap;word-break:normal;word-wrap:normal;}
.label-check_2019.one input {float:left;}

/* --------------------------------------------------------------------------------
	# 리스트
--------------------------------------------------------------------------------- */
/* 불릿형 */
.txt-bul1:not(ul):not(ol):not(dl), .txt-bul1 > li, .txt-bul1 > dt {position:relative; padding:0 0 0 15px; color:#4d3d32; background:url('https://oimg1.kbstar.com/img/ocommon/bullet/bult_element3.gif') no-repeat 0px 6px;}
.txt-bul1 > dt {font-weight:bold; margin:0 0 5px;}
.txt-bul1 > li + li, .txt-bul1 > dd, .txt-bul1 > li > ul, .txt-bul1 > dd > ul, .txt-bul1 > li > dl, .txt-bul1 > dd > dl {margin:5px 0 0;}
.txt-bul1 > dt ~ dd {padding:0 0 0 15px;}
.txt-bul1 > dd ~ dt {margin-top:15px;}
.txt-bul1 + .txt-bul1 {margin:10px 0 0;}

/* --------------------------------------------------------------------------------
	# 초기화스타일 충돌 수정
--------------------------------------------------------------------------------- */
#RENO_2015 .lnbTitle {font-weight:bold !important;}

/* --------------------------------------------------------------------------------
	# 메세지타입1
-------------------------------------------------------------------------------- */
/* 이미지유형1 :스타링크 */
.box_type1.mes-t1.img1 {position:relative;background:url('https://oimg1.kbstar.com/img/ocommon/2019/img_mes1.png') no-repeat 40px center; min-height:76px;}
.box_type1.mes-t1.img1 p:first-child:only-child {font-weight:normal; position:absolute;top:50%;left:194px;-webkit-transform:translateY(-50%);transform:translateY(-50%);}
/* 이미지유형2 :스타링크 */
.box_type2.mes-t2{padding:28px 260px 10px 39px;background:url('https://oimg1.kbstar.com/img/ocommon/2020/img_mes01.png') no-repeat 466px center; min-height:110px;}
.mes-t2 *{font-family: 'KBText', '맑은 고딕', 'Malgun Gothic' !important; }
.mes-t2 > dl dt {font-size:20px;color:#222222; padding-bottom:8px;letter-spacing:-1px;}
.mes-t2 > dl dd {font-size:14px;color:#5a5a5a; letter-spacing:-0.9px; line-height:1.45;}
.mes-t2 > dl dd > .bgline {position:relative;display:inline-block;font-weight:bold;color:#222222;}
.mes-t2 > dl dd > .bgline:after {content:'';display:block;position:absolute;top:4px;bottom:0; width:100%;background:url('https://oimg1.kbstar.com/img/ocommon/2020/img_mes_bgline.png') repeat-x;z-index:-1; }
/* --------------------------------------------------------------------------------
	# 타이틀
--------------------------------------------------------------------------------- */
.tit_dep2 + .tit_dep3 {margin-top:0;}
.tit_dep2 + p + .box_type1 {margin-top:25px;}
.tit_dep2 + .info-data7 {margin-top:23px;}
div.tit_dep2 > *:first-child > .link_blank:after {top:8px;}

/* --------------------------------------------------------------------------------
	# 주석
--------------------------------------------------------------------------------- */
.txt-footnote {display:inline-block; vertical-align:baseline !important;}
.txt-footnote sup {vertical-align:super !important;}
.txt-footnote sub {vertical-align:sub !important;}

/* --------------------------------------------------------------------------------
	# 데이터유형(정보형)
-------------------------------------------------------------------------------- */
/* 유형6 */
.info-data6 {margin:40px 0; text-align:center;}
.info-data6 dl{display:inline-block; *display:inline;*zoom:1;position:relative; padding-left:60px; height:40px;line-height:40px;}
.info-data6 dl:before {content:''; width:40px; height:40px; position:absolute; top:0; left:0px;}
.info-data6 dt, .info-data6 dd {display:inline;font-family:'KBText', '맑은 고딕', 'Malgun Gothic' !important; font-size:16px; font-weight:bold; color:#222;*line-height:40px;}
.info-data6 dt:after {content:':';}

.info-data6 .img1:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade1.png');}
.info-data6 .img2:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade2.png');}
.info-data6 .img3:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade3.png');}
.info-data6 .img4:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade4.png');}
.info-data6 .img5:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade5.png');}

@media \0screen\,screen\9 {
	.info-data6 dl:before {background:none;}
}

.info-data6 dl {*background-repeat:no-repeat;*background-position:0 0;}
.info-data6 .img1 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade1.png');}
.info-data6 .img2 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade2.png');}
.info-data6 .img3 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade3.png');}
.info-data6 .img4 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade4.png');}
.info-data6 .img5 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_grade5.png');}

/* 유형7 */
.info-data7 {display:table;*display:block;*overflow:hidden;*clear:both;table-layout:fixed;width:100%;}
.info-data7 li {font-family:'KBText', '맑은 고딕', 'Malgun Gothic' !important; color:#707070; text-align:center;font-weight:normal;}
.info-data7 > li {display:table-cell;position:relative;vertical-align:top !important;*display:inline;*zoom:1;*width:144px;position:relative;text-align:center;}
.info-data7 > li > strong {font-size:14px; color:#222; font-weight:bold;}
.info-data7 > li > ul {margin-top:12px;}
.info-data7 > li[class*="img"]:before, .info-data7 > li[class*="img"]:after {content:'';display:block; width:78px;height:78px; margin:0 auto 20px;background-repeat:no-repeat;}
.info-data7 > li[class*="img"]:after {position:absolute;top:0;left:50%;margin-left:-39px;background:#f7f7f7;border-radius:50%;z-index:-1;}
.info-data7 .img6, .info-data7 .img7, .info-data7 .img8, .info-data7 .img9 {*width:180px;*padding-top:118px;}
.info-data7 .img6:before, .info-data7 .img7:before, .info-data7 .img8:before, .info-data7 .img9:before {width:137px !important; height:98px !important;}

.info-data7 .img1:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info1.png');}
.info-data7 .img2:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info2.png');}
.info-data7 .img3:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info3.png');}
.info-data7 .img4:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info4.png');}
.info-data7 .img5:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info5.png');}
.info-data7 .img6:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info6.png');}
.info-data7 .img7:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info7.png');}
.info-data7 .img8:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info8.png');}
.info-data7 .img9:before {background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info9.png');}

@media \0screen\,screen\9 {
	.info-data7 > li[class*="img"]:after {background:none;}
}

.info-data7 > li[class*="img"] {*background-repeat:no-repeat;*background-position:33px 0;*padding-top:98px;}
.info-data7 .img1 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info1.png');}
.info-data7 .img2 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info2.png');}
.info-data7 .img3 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info3.png');}
.info-data7 .img4 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info4.png');}
.info-data7 .img5 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info5.png');}
.info-data7 .img6 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info6.png');}
.info-data7 .img7 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info7.png');}
.info-data7 .img8 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info8.png');}
.info-data7 .img9 {*background-image:url('https://oimg1.kbstar.com/img/ocommon/2019/icon_info9.png');}

/* --------------------------------------------------------------------------------
	# 플로팅 바
-------------------------------------------------------------------------------- */
.help-notice {visibility:hidden;position:relative;margin:-60px 0 0;padding:12px 30px;height:36px;background:#4b5767;color:#fff;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;transition:all 0.5s ease;-webkit-transition-delay:0.1s;-moz-transition-delay:0.1;transition-delay:0.1s;}
.help-notice:before {content:'';display:block;position:absolute;left:50%;top:0;bottom:0;width:4000px;margin:0 0 0 -2000px;background:#4b5767;z-index:-1;}
.help-notice:after {content:'';clear:both;display:table;}
.help-notice p {position:relative;display:inline-block;font-size:16px;line-height:36px;margin-right:160px;color:#fff;}
.help-notice p a {overflow:hidden;display:block;position:absolute;left:0;right:-25px;top:0;bottom:0;padding-right:25px;text-indent:-9999px;}
.help-notice p a:before, .help-notice p a:after {content:'';display:block;position:absolute;right:0;top:50%;width:0;height:0;}
.help-notice p a:before {margin:-5px 0;border:6px solid transparent;border-left:6px solid #fff;}
.help-notice p a:after {margin:-3px 4px;border:4px solid transparent;border-left:4px solid #4b5767;}
.help-notice .sub {position:absolute;top:50%;margin-top:-18px;right:20px;}
.help-notice .btn-icon1.ic6 {background-position:-200px -460px}
.help-notice.open {visibility:visible;margin:0;-webkit-transition-delay:0.6s;-moz-transition-delay:0.6;transition-delay:0.6s;}

.help-notice .sub a.btn_help {color:#fff;text-decoration: underline;line-height:33px;}
.help-notice .sub:not(.open) .cont {display:none;}
.help-notice .sub.open .cont {display:block;position:absolute;top:36px;right:0;left:auto;margin-bottom:14px;width:235px;padding:17px 20px; background:#fff; border:1px solid #b7b7b7;border-radius:4px;text-align:left; z-index:1000;}
.help-notice .cont::before,
.help-notice .cont::after {content:'';position:absolute;right:25px;display:block;width:0;border-style:solid;border-style:solid;border-width:0 6px 6px;}
.help-notice .cont::before {top:-7px;border-color:#b7b7b7 transparent;}
.help-notice .cont::after {top:-5px;border-color:#fff transparent;}
.help-notice .cont p {display:block;margin:0;font-size:12px;font-weight:bold;color:#666;line-height:1.5;}
.help-notice .cont p.sub {display:block;position:relative;top:0;right:auto;margin-top:5px;font-size:12px;color:#666;font-weight:normal;line-height:20px;}
.help-notice .cont p.sub a {display:inline;position:relative;padding:0;font-size:12px;font-weight:normal;text-decoration:underline;color:#06809b;}
.help-notice .cont p.sub a::before,
.help-notice .cont p.sub a::after {display:none;}
.help-notice .cont ul {margin-top:8px;}
.help-notice .cont ul li {position:relative;padding-left:10px;}
.help-notice .cont ul li:before {content:'';position:absolute;top:8px;left:0;width:3px;height:3px;background:#bbab9e;}
.help-notice .cont ul li ~ li {margin-top:6px;}
.help-notice .cont ul li a {display:block;}

/* 서브페이지 인 경우 */
.help-notice.sub {margin:-105px 0 0;}
.help-notice.sub.open {margin:-42px 0 0;}

/* --------------------------------------------------------------------------------
	# 플로팅버튼
-------------------------------------------------------------------------------- */
.nav-aside2 {position:fixed;right:100px;top:217px;width:225px;-webkit-transition:all 0.1s ease;-moz-transition:all 0.1s ease;transition:all 0.1s ease;z-index:10000;text-align:right;}
.nav-aside2.close {display:none;}
.nav-aside2 .cont {display:block; position:absolute; top:0; left:0; width:100%; border:1px solid #d8d5d1; background:#fff; text-align:left;}
.nav-aside2 .cont .header {position:relative; padding:7px 34px 7px 14px; border-bottom:1px solid #d8d5d1; background:#f5f5f7; color:#222; letter-spacing:-0.03em;}
.nav-aside2 .cont .header p {line-height:24px;}
.nav-aside2 .cont .header .close {position:absolute; top:0; right:0; width:38px; height:38px; text-align:left; text-indent:-999px; overflow:hidden;}
.nav-aside2 .cont .header .close::before,
.nav-aside2 .cont .header .close::after {content:""; display:block; position:absolute; top:12px; left:18px; width:1px; height:12px; background:#222; transform-origin: center;}
.nav-aside2 .cont .header .close::before {transform:rotate(45deg);}
.nav-aside2 .cont .header .close::after {transform:rotate(-45deg);}
.nav-aside2 .cont ul li + li {border-top:1px solid #efefef;}
.nav-aside2 .cont ul li a {display:block; padding:5px; text-align:center; line-height:18px;}

.nav-aside2 .cont.type02 .header {padding-top:20px; border-bottom:none; background:none; text-align:center;}
.nav-aside2 .cont.type02 .header p {font-size:17px; font-weight:bold; font-family:'KBText', '맑은 고딕', 'Malgun Gothic' !important; }
.nav-aside2 .cont.type02 > p { padding:0 15px; font-size:12px; color:#3a3129; font-family:'KBText', '맑은 고딕', 'Malgun Gothic' !important; text-align:center; letter-spacing:-0.05em;}
.nav-aside2 .cont.type02 > p em {color:#0757c0;}
.nav-aside2 .cont.type02 ul {padding:15px 15px 20px; text-align:center;}
.nav-aside2 .cont.type02 ul li {display:inline-block; position:relative; border-top:none; vertical-align:top;}
.nav-aside2 .cont.type02 ul li a {position:relative; padding-top:54px; text-align:center; text-decoration:underline;}
.nav-aside2 .cont.type02 ul li a::before {content:""; display:block; position:absolute; top:0; left:calc(50% - 24px); width:48px; height:48px; border-radius:50%; background:#f6f6f6;}
.nav-aside2 .cont.type02 ul li a::after {content:""; display:block; position:absolute; top:12px; left:calc(50% - 12px); width:24px; height:24px; background-position:center; background-repeat: no-repeat;}
.nav-aside2 .cont.type02 ul li a.ico01::after {background-image: url('https://oimg1.kbstar.com/img/obank/2020/ico_helpbanner_01.png')}
.nav-aside2 .cont.type02 ul li a.ico02::after {background-image: url('https://oimg1.kbstar.com/img/obank/2020/ico_helpbanner_02.png')}
.nav-aside2 .cont.type02 ul li a.ico03::after {background-image: url('https://oimg1.kbstar.com/img/obank/2020/ico_helpbanner_03.png')}
.nav-aside2 .cont.type02 ul li a.ico04::after {background-image: url('https://oimg1.kbstar.com/img/obank/2020/ico_helpbanner_04.png')}
.nav-aside2 .cont.type02 ul li a.ico05::after {background-image: url('https://oimg1.kbstar.com/img/obank/2020/ico_helpbanner_05.png')}
.nav-aside2 .cont.type02 .area_btn {padding:0 20px 20px;}
.nav-aside2 .cont.type02 .area_btn a {display:block; padding:10px 0; background:#fed03a; color:#222; font-size:14px; font-weight:bold; font-family:'KBText', '맑은 고딕', 'Malgun Gothic' !important; text-align:center; line-height:20px;}

.nav-aside2 .cont.type03 .header {padding:0; border:none;}
.nav-aside2 .cont.type03 img {width:100%; height:auto;}
.nav-aside2 .cont.type03 .area_btn {position:absolute; bottom:0; left:0; width:100%; padding:20px; box-sizing:border-box;}
.nav-aside2 .cont.type03 .area_btn a {display:block; padding:10px 0; background:#fed03a; color:#222; font-size:14px; font-weight:bold; font-family:'KBText', '맑은 고딕', 'Malgun Gothic' !important; text-align:center; line-height:20px;}

@media only screen and (max-width:1190px) {
	.nav-aside2 {margin-right:-100px;}
	.nav-aside2 .cont {display:none;}
}

@media screen and (max-height:870px){
}

@media screen and (max-height:700px){
	.nav-aside2 {display:none;}
}

@media \0screen\,screen\9 {
	.nav-aside2 .cont ul {margin-top:12px;}

	.uiWidthMin .nav-aside2 {margin-right:-100px;}
	.uiWidthMin .nav-aside2 .cont {margin-right:-310px;}

	.uiHeightMin .nav-aside2 {display:none;}
}