/*******************************/
/***** 공통 						   	    *****/
/*******************************/

	
body {position:relative; color:#222; height:100%; font-family:"KBFGDisplayL", sans-serif, serif; font-size:14px; line-height:20px;}

/* 팝업 관련 스크롤 테스트
body {position:fixed; top:0; left:0; width:100%; height:100%; overflow:hidden;}
#contsWrap {height:100%; overflow-y:auto;}
#contsHeader .btn-icon.ico-menu {rigt:2px;}
 팝업 관련 스크롤 테스트 */

/* kakao posiiton bug */
-webkit-transform:translateZ(0);

/* 여백 (margin, padding) */
.mg0 {margin:0 !important;}
.mg-t0 {margin-top:0 !important;}
.mg-t5 {margin-top:5px !important;}
.mg-t10 {margin-top:10px !important;}
.mg-t15 {margin-top:15px !important;}
.mg-t20 {margin-top:20px !important;}
.mg-t25 {margin-top:25px !important;}
.mg-t30 {margin-top:30px !important;}
.mg-t35 {margin-top:35px !important;}
.mg-t40 {margin-top:40px !important;}
.mg-t45 {margin-top:45px !important;}
.mg-t50 {margin-top:50px !important;}
.mg-t58 {margin-top:58px !important;}
.mg-b0 {margin-bottom:0 !important;}
.mg-b5 {margin-bottom:5px !important;}
.mg-b10 {margin-bottom:10px !important;}
.mg-b15 {margin-bottom:15px !important;}
.mg-b20 {margin-bottom:20px !important;}
.mg-b30 {margin-bottom:30px !important;}
.mg-b50 {margin-bottom:50px !important;}
.mg-b60 {margin-bottom:60px !important;}
.mg-b-40 {margin-bottom:-40px !important;}
.mg-l29 {margin-left:29px !important;}
.mg-at {margin:0 auto;}
.mg-h10 {margin-left:10px !important; margin-right:10px !important;}
.mg-h19 {margin-left:19px !important; margin-right:19px !important;}
.mg-h29 {margin-left:29px !important; margin-right:29px !important;}
.pd0 {padding:0 !important;}
.pd-t0 {padding-top:0 !important;}
.pd-t10 {padding-top:10px !important;}
.pd-t20 {padding-top:20px !important;}
.pd-t50 {padding-top:50px !important;}
.pd-b0 {padding-bottom:0 !important;}
.pd-b30 {padding-bottom:30px !important;}
.pd-b40 {padding-bottom:40px !important;}
.pd-b50 {padding-bottom:50px !important;}
.pd-r70 {padding-right:70px !important;}
.pd-h0 {padding-left:0 !important; padding-right:0 !important;}
.pd-h20 {padding-left:20px !important; padding-right:20px !important;}
.pd-h30 {padding-left:30px !important; padding-right:30px !important;}
.pd-h38 {padding-left:38px !important; padding-right:38px !important;}
ul ul, ol ol {margin:0; padding:0;}

/* display */
.f-auto {flex:auto !important;}
.f-none {flex:none !important;}

/* overflow */
.of-auto {overflow:auto !important;}
.of-hide {overflow:hidden !important;}

/* 정렬 */
.txt-left {text-align:left !important;}
.txt-center, .center-align {text-align:center !important;}	
.txt-right {text-align:right !important;}
.ver-top {vertical-align:top !important;}
.ver-mid {vertical-align:middle !important;}
.hidden {display:block; position:absolute; top:0; left:0; width:0; height:0; font-size:0; opacity:0; overflow:hidden;}
.sr-only {position:absolute; margin:0 !important; width:1px; height:1px; font-size:1px; line-height:2; opacity:0; overflow:hidden; z-index:-1;}
.fl_l {float:left;}
.fl_r {float:right;}
.clear::after {content:""; display:block; clear:both;}
.w-break {word-break:break-all;}

/* 텍스트 강조 */
.nm {font-family:"KBFGDisplayL" !important;}
em, .em {font-family:"KBFGDisplayM" !important;}
strong, .bold { /*font-family:"KBFGDisplayB" !important;*/}
.uline {text-decoration:underline;}

/* 폰트 사이즈 */
.fs12 {font-size:12px !important; line-height:16px;}
.fs13 {font-size:13px !important; line-height:18px;}
.fs14 {font-size:14px !important; line-height:1;}	/* default */
.fs16 {font-size:16px !important;}
.fs18 {font-size:18px !important;}
.fs20 {font-size:20px !important; line-height:28px !important;}
.fs21 {font-size:21px !important;}
.fs24 {font-size:24px !important;}

/* 폭(넓이) */
.mw100 {min-width:100px;}
.w40p {width:40% !important;}
.w50p {width:50% !important;}
.w60p {width:60% !important;}
.w90p {width:90% !important;}
.w100p {width:100% !important;}

/* 높이 */
.hei100p {height:100% !important;}
.min-h_auto {min-height:auto !important;}
.lh18 {line-height:18px !important;}
.lh20 {line-height:20px !important;}
.lh24 {line-height:24px !important;}


/*******************************/
/***** 컬러 							    *****/
/* 노란색계열(포인트컬러 1) :#ffde33, #ffde33 */
/* 갈색계열(포인트컬러 2, 버튼에 사용) :#60584c, #8c734b, #967a4c */
/* 무채색(텍스트, 라인 이나 박스 배경) :#222, #333, #666, #777, #ccc, #bbb, #b0b0b0, #fff */ 
/*******************************/
/* 텍스트 컬러 */
.txt-c1 {color:#222 !important;}
.txt-c2 {color:#666 !important;}
.txt-c3 {color:#fff !important;}
.txt-c4 {color:#f46600 !important;}
.txt-c5 {color:#967a4c !important;}
.txt-c6 {color:#7da7d9 !important;}
.txt-c7 {color:#ff3d3d !important;}
.txt-c8 {color:#0066ff !important;}
.txt-c9 {color:#82ca9c !important;}

.bg-c3 .txt-c3 {color:#222 !important;}

/* 배경 컬러 */
.bg-c1 {background:#eee !important;} /* 기본 회색 배경 */
.bg-c2 {background:#f7f3e8 !important;} /* 입력 폼 */
.bg-c3 {background:#ffde33 !important;} /* 노란 배경, 상단 요약폼 있을 때 */
.bg-c4 {background:#fff !important;} /* 흰 배경, 보험금 청구신청 등 상단에 step 있을 때 */
.bg-c5 {background:#e2ddf9 !important;} /* 보라 */
.bg-c6 {background:#8ec0fb !important;} /* 파랑 */ 
.bg-c7 {background:#fafafa !important;}
.bg-c8 {background:#e9dec6 !important;} /*노란 계열 컬러 추가*/

.bor_none {border:none;}

/* 배경이 흰색이고, 상단에 회색 라인 있을 때
.line1 {position:relative; margin-top:10px; background:#fff;}
.line1:after {content:''; position:absolute; top:-10px; left:0; width:100%; height:10px; background:#eee;} */
.t-line1 {border-top:10px solid #eee;}
.t-line2 {border-top:1px solid #eee;}

/* 하단에 회색 라인 있을 때 */
.b-line1 {border-bottom:10px solid #eee;}
.b-line2 {border-bottom:1px solid #eee;}


/*******************************/
/***** 섹션 영역 	   	   *****/
/******************************/
/* 기본 */
.conts-area1 {padding:0 19px;}
.conts-area2 {padding:20px 19px;}
.conts-area3 {padding:30px 19px;}
.conts-area4 {padding:40px 19px;}
.conts-area5 {padding:50px 19px;}
.conts-area6 {padding:30px 48px;}
.conts-area7 {padding:50px 48px;}

.conts-area .simple-form .input-select .select {width:100%;}
.conts-area3 .info-sum.t1 dt {color:#666; text-align:center;}
.conts-area3 .info-sum.t1 dd {text-align:center;}
.conts-area5 .simple-form {margin:30px auto 0;}
.conts-area7 .list-item.card.t4 {margin:0 -29px;}

.conts-area2 .tit-sub1:first-child, .conts-area3 .tit-sub1:first-child, .conts-area4 .tit-sub1:first-child, .conts-area5 .tit-sub1:first-child {margin-top:0px;}
.conts-area2 fieldset legend + .tit-sub1, .conts-area3 fieldset legend + .tit-sub1, .conts-area4 fieldset legend + .tit-sub1, .conts-area5 fieldset legend + .tit-sub1 {margin-top:0;}

.img-wrap, .movie-wrap, .map-wrap {margin:16px 0; width:100%;}
.map-wrap {min-height:200px; background:#ddd;}
.img-wrap > img, .movie-wrap > img {width:100%;}


/******************************/
/***** 폼 						  		  *****/
/******************************/
/* placeholder 색상 */
::placeholder {color:#b0b0b0; font-size:14px; font-family:"KBFGDisplayL"; opacity:1; /* Firefox */;}
:-ms-input-placeholder {color:#b0b0b0; font-size:14px; font-family:"KBFGDisplayL"; /* Internet Explorer 10-11 */;}
::-ms-input-placeholder {color:#b0b0b0; font-size:14px; font-family:"KBFGDisplayL"; /* Microsoft Edge */;}

/* input */
input[type="text"], input[type="password"], input[type="tel"], input[type="search"], input[type="number"], textarea {font-family:"KBFGDisplayL"; font-size:14px; border:none; border-radius:0; box-sizing:border-box; outline:none; -webkit-appearance:none;}
input.text, textarea.textarea {display:inline-block; padding:10px 2px; height:45px; font-family:"KBFGDisplayL"; font-size:14px; line-height:24px; background:transparent; border-bottom:1px solid #c5c5c5;}
input.text:focus, input.text:active, textarea.textarea:focus, textarea.textarea:active {border-bottom-color:#ffde33;}
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {margin:0; -webkit-appearance:none;}
textarea.textarea {display:block; width:100%; height:auto;}
.textarea:not(textarea) {display:block; position:relative; padding:0 0 30px;}
.textarea:not(textarea) > textarea {display:block; width:100%; padding:10px 2px 0; height:100%; font-family:"KBFGDisplayM"; font-size:16px; line-height:24px; background:transparent; border:none; resize:none;}
.textarea:not(textarea) > textarea + .count {display:block; position:absolute; bottom:0; left:0; width:100%; height:29px; line-height:29px; border-bottom:1px solid #c5c5c5;}
.textarea:not(textarea) > textarea:focus + .count, .textarea:not(textarea) > textarea:active + .count {border-bottom-color:#ffde33;}

.input-readonly {margin:5px 0; font-family:"KBFGDisplayM"; color:#222; font-size:16px; margin-top:10px;}

/* 단위가 있는 100% */
.input-wrap1 {position:relative;}
.input-wrap1 input.text {margin:0; padding-right:30px; width:100%; text-align:right; z-index:1;}
.input-wrap1 input.text + .unit {position:absolute; top:0; right:3px; line-height:45px; z-index:2;}

/* 오류 체크 */
.input-check {position:relative;}
.input-check input.text {margin:0; padding-right:30px; width:100%; z-index:1;}
.input-check .txt-err {display:none; position:absolute; left:0; margin-top:5px; font-size:12px; color:#ff3d3d; line-height:18px;}
.input-check.chk input.text {border-bottom-color:#ffde33;}
.input-check.chk:before, .input-check.chk:after {content:""; display:block; position:absolute; height:2px; background:#ffde33; border-radius:1px;}
.input-check.chk:before {top:22px; right:16px; width:9px; -webkit-transform:rotate(45deg); transform:rotate(45deg);}
.input-check.chk:after {top:21px; right:5px; width:15px; -webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
.input-check.err input.text {border-bottom-color:#ff3d3d;}
.input-check.err .txt-err {display:block;}

/* 한 라인에 여러개의 인풋이 들어가는 경우 */
.input-area {position:relative;}
.input-area .unit {float:left; width:20px; height:45px; line-height:45px; text-align:center; vertical-align:middle;}
.input-area .unit.mask {margin:0 0 0 10px; width:auto; letter-spacing:5px;}
.input-area:after {content:""; display:block; clear:both;}

/* 날짜 두개 */
.input-area.date .input-date {width:calc(50% - 10px); float:left;}

/* 연월일 입력 */
.input-area.date .input-wrap1 {width:calc(100%/3 - 10px); float:left;}
.input-area.date .input-wrap1 + .input-wrap1 {margin-left:15px;}
.input-area.date .input-wrap1 .text {margin-bottom:10px;}
.input-area.date .input-wrap1 span {color:#666;}

/* 연월일 입력 */
.input-area.date-time .input-select {width:calc(50% - 10px); float:left;}
.input-area.date-time .input-select select {margin-top:0;}
.input-area.date-time .input-select span {color:#666;}

/* 휴대폰 번호 등 input - input - input */
.input-area.tel .text, .input-area.tel div[class^="input-"] {float:left; margin-top:0; width:calc(33.3% - 13px);}
.input-area.tel .text:first-child, .input-area.tel .select:first-child, .input-area.tel div[class^="input-"]:first-child {width:calc(33.33% - 14px);}
.input-area.tel .select {width:100%; margin-top:0;}
.input-area.personal .text {float:left; margin-top:0; width:calc(50% - 13px);}

/* 주민등록번호 (뒷자리 1자리만 입력) */
.input-area.personal2 .text {float:left; margin-top:0; width:calc(50% - 13px);}
.input-area.personal2 .text.back {width:45px; text-align:center;}

/* 휴대폰 번호 type2 */
.input-area.tel2 {position:relative;}
.input-area.tel2 .chg-tel {position:absolute; top:0; right:0; width:130px; font-family:"KBFGDisplayL"; z-index:1;}
.input-area.tel2 .text:first-of-type {padding-right:150px;}

.input-area.auth-num {position:relative; padding:0 30px 0 0;}
.input-area.auth-num div[class^="input-"], .input-area.auth-num .text {float:left; margin-top:0; width:calc(33.3% - 15px);}
.input-area.auth-num .text {border-bottom-color:#ffde33;}
.input-area.auth-num .btn-refresh {position:absolute; top:5px; right:0; width:30px; height:30px; text-indent:-9999px; background:url(../images/comm/ico-set.png) -90px -80px no-repeat; background-size:300px auto;}

/* 인증번호 요청 및 입력 */
.input-area.vercode {position:relative;}
.input-area.vercode .text {width:100%; padding-right:200px;}
.input-area.vercode .timer {position:absolute; top:50%; right:150px; color:#f00; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.input-area.vercode .btn-vercode {position:absolute; top:0; right:0; width:130px; font-family:"KBFGDisplayL";}

/* 우편번호 */
.input-area.adrs {position:relative;}
.input-area.adrs .zip-code {width:130px; position:absolute; top:0; right:0; font-family:"KBFGDisplayL"; z-index:1;}
.input-area.adrs .text:first-of-type {padding-right:150px;}
.input-area.adrs .text {width:100%;}

/* 메일 */
.input-area.mail .text, .input-area.mail div[class^="input-"] {float:left; margin:0; width:calc(50% - 12px);}
.input-area.mail .select {width:100%; margin-top:0;}
.input-area.mail .input-select + input.text {margin:10px 0 0 0; width:100%;}

/* 신용카드 정보 */
.input-area.card-num > .text, .input-area.card-num > div[class^="input-"] {width:calc(25% - 15px); float:left; margin-top:0;}
.input-area.card-exp .input-select {float:left; width:95px; margin-top:0;}
.input-area.card-exp .select {margin-top:0;}
.input-area.card-exp .unit + .input-select {margin:0 0 0 14px;}
.input-area.card-pw > .text, .input-area.card-pw > div[class^="input-"] {width:80px; float:left; margin-top:0;}

/* up/down 수치 */
.input-area.qty {position:relative;}
.input-area.qty .text {padding:0 40px; width:100%;}
.input-area.qty .btn-icon {position:absolute; top:0; width:0; height:45px; padding-right:30px; z-index:9;}
.input-area.qty .btn-icon.qty-down {left:0;}
.input-area.qty .btn-icon.qty-up {right:0;}
.input-area.qty .btn-icon i {width:30px; height:45px; background-position:-30px -120px;}
.input-area.qty .btn-icon.qty-down i {background-position:-30px -120px;}
.input-area.qty .btn-icon.qty-up i {background-position:0 -120px;}

/* 날짜 선택 */
.input-date {display:inline-block; position:relative;}
.input-date .text {width:100%; padding-right:40px;}
.input-date:before {content:""; display:block; position:absolute; top:50%; right:2px; width:18px; height:18px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px; background-position:-18px 0; z-index:-1; -webkit-transform:translateY(-50%); transform:translateY(-50%);}

/* 첨부파일 */
.input-file1 {display:inline-block; position:relative; width:140px; height:45px; overflow:hidden; cursor:pointer;}
.input-file1 input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; z-index:-1;}
.input-file1 span {display:inline-block; width:100%; height:100%; padding:10px 15px; background:#8c734b; color:#fff; line-height:25px; font-family:"KBFGDisplayB"; font-size:14px; text-align:center;}
.input-file1 input:disabled + span {background:#666; opacity:0.6;}
.input-file1 span[class^="ico"]:before {content:""; display:inline-block; position:relative; width:20px; height:20px; margin-right:8px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px; vertical-align:top;}
.input-file1 span.ico-cam:before {background-position:0 -40px;}
.input-file1 span.ico-file:before {background-position:-20px -40px;}

.area-file {position:relative; width:100%; margin:10px 0; overflow:hidden; cursor:pointer;}
.area-file .input-file1 {position:absolute; right:0; top:0; width:60px; z-index:1;}
.area-file .input-file1 span.hidden {width:0; height:0; padding:0; font-size:0;}
.area-file .input-file1 span.ico-file:before {margin-right:0;}
.area-file .input-readonly {margin:0; padding:10px 70px 10px 2px; height:45px; color:#666; font-size:14px; line-height:24px; background:transparent; border-bottom:1px solid #c5c5c5;}
.area-file .input-readonly .txt-sub {float:right; font-family:"KBFGDisplayL"; font-size:12px; color:#666;}

/* 보안문자(캡챠) */
.captcha-area {width:100%; border-bottom:1px solid #c5c5c5; background-color:#fff; height:45px;}
.captcha-area + .btn-area {margin-top:10px;}

/* 약관 전체동의를 필두로 하는 list-toggle */
.all-agree {/*margin-top:auto;*/ flex:1; background-color:#fff;}
.all-agree > .label-check {width:100%; padding:10px 48px 10px 19px; color:#666;}
.label-check.chk-all > label {font-family:"KBFGDisplayM"; color:#222;}
.chk-comp {padding:15px 19px 40px 19px; color:#222; font-family:"KBFGDisplayM";}
.label-check.chk-comp, .all-agree > .label-check.chk-comp {padding:10px 48px 40px 19px; width:100%; color:#222; font-family:"KBFGDisplayL";}

/* 보험상품 */
.input-area.multi + .multi {margin-top:25px}
.input-area.multi li {display:flex; flex-direction:row; float:left; position:relative; width:calc(50% - 9px);}
.input-area.multi li .tit {display:block; padding-right:10px; line-height:45px; color:#222;}
.input-area.multi li .input-select {display:block; width:100%;}
.input-area.multi li .input-select .select {margin:0;}
.input-area.multi li.left {margin-right:9px;}
.input-area.multi li.right {margin-left:9px;}
.input-area.multi li.full {display:block; width:100%; margin-top:10px;}
.input-area.multi li.full:first-child {margin-top:0px;}
.input-area.multi li.full .tit {position:absolute; top:0; left:0; width:0; height:0; font-size:0; opacity:0; overflow:hidden;}
.input-area.multi li.full .label-check {color:#222;}

/* 우편번호 찾기 선택 */
.zip-search {position:relative; margin-top:20px; margin-bottom:10px;}
.input-wrap1.zip-search input.text {width:100%; text-align:left; padding-left:10px; padding-right:56px !important;}
.zip-search .btn-search {position:absolute !important; top:5px; right:0; width:40px !important; height:40px;}
.zip-search .btn-search::before, .zip-search .btn-search::after {content:''; display:block; position:absolute;}
.zip-search .btn-search::before {top:8px; left:8px; width:15px; height:15px; background:transparent; border:2px solid #000; border-radius:50%;}
.zip-search .btn-search::after {top:26px; left:22px; width:8px; height:2px; background:#000; border-radius:1px; -webkit-transform:rotate(45deg); transform:rotate(45deg);}

/** textarea **/
.input-area.text {position:relative;}
.input-area.text .count {position:absolute; bottom:0; margin-bottom:6px; color:#757575;}

/** select **/
.input-select {position:relative;}
select.select {display:inline-block; position:relative; padding:10px 25px 10px 0; width:100%; height:45px; font-family:"KBFGDisplayL"; font-size:14px; line-height:24px; background:transparent url(../images/comm/ico-select.png) no-repeat right center; background-size:18px 8px; border:none; border-bottom:1px solid #c5c5c5; border-radius:0; box-sizing:border-box; outline:none; 
	-webkit-appearance:none; /* 네이티브 외형 감추기 */ 
	-moz-appearance:none; 
	appearance:none; 
}
select.select.al-center {text-align-last:center;}
select.select.al-left {text-align-last:left;}
select.select.al-right {text-align-last:right;}
select.select.selected {background-position:right center; border-bottom-color:#ffde33;}
.input-select > .btn-select {display:block; position:absolute; top:0; left:0; width:100%; height:100%; text-indent:-9999px; background:transparent; z-index:2;}
.btn-select:focus, .btn-select:active {outline:none;}
.btn-select:focus + select.select, .btn-select:active + select.select {border-bottom-color:#ffde33;}
.input-select > .btn-select.deactive + select.select {opacity:0.5;}
.input-select.t2 .select {padding-left:10px; padding-right:35px; background-color:#e8a900; background-image:url(../images/comm/ico-select3.png); background-size:28px 8px; color:#fff; border-bottom:none;}

.input-area > .label-check + .input-select {position:absolute; top:0; right:0; width:calc(100%/3 - 10px);}
.input-area > .label-check + .input-select select.select {margin:0; padding:0 25px 0 0; height:40px; font-size:14px;}

/** checkbox, radio **/
[class^="label-check"] > label {position:relative; overflow:hidden; cursor:pointer;}
[class^="label-check"] > label > input {position:absolute; top:0; left:0; width:0px; height:0px; opacity:0;}

/* 기본형 */
.label-check {display:inline-block; line-height:0;}
.label-check > label {display:inline-block; min-height:40px; padding:9px 9px 9px 30px; line-height:22px;}
.label-check > label > input + span {display:block; color:#666;}
.label-check > label > input:checked + span {color:rgba(34,34,34,1);}
.label-check > label > input + span:before, .label-check > label > input + span:after {content :""; position:absolute; top:50%;}
.label-check > label > input + span:before {left:0; width:20px; height:20px; background:transparent; border:1px solid #b5b5b5; border-radius:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.label-check > label > input[type="checkbox"] + span:after {left:8px; margin-top:-2px; width:8px; height:5px; border:solid #b5b5b5; border-width:0 0 1px 1px; -webkit-transform:rotate(-45deg) translateY(-50%); transform:rotate(-45deg) translateY(-50%);}
.label-check > label > input[type="radio"] + span:after {left:5px; width:10px; height:10px; border:1px solid #b5b5b5; border-radius:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.label-check > label > input:checked + span:before {border-color:#ffde33; background:#ffde33;}
.label-check > label > input:checked + span:after {border-color:#fff;}
.bottom-area .list-toggle + .label-check {margin:10px 0 30px 19px;}

.tbl-data td .label-check > label {margin:0 0 -5px; padding:12px 9px 9px 30px;}

.label-check.top > label > input + span:before {top:10px; -webkit-transform:translateY(0); transform:translateY(0);}
.label-check.top > label > input[type="checkbox"] + span:after, .label-check.top > label > input[type="radio"] + span:after {top:21px;}

.label-check.full > label {width:100%; margin-top:5px;}
.label-check.full > label:first-child {margin-top:0;}
.label-check.n3, .label-check.n4 {width:100%;}
.label-check.n3 > label {min-width:calc(100%/3 - 15px);}
.label-check.n4 > label {min-width:calc(25% - 15px);}
.label-check.n3 > label + label, .label-check.n4 > label + label {margin-left:10px;}

/** checkbox **/
/* 스위치 */
.switch-wrap label {display:inline-block; position:relative;}
input[type="checkbox"].switch {position:absolute; top:0; left:0; width:100%; opacity:0; z-index:-1;}
input[type="checkbox"].switch + span {display:block; position:relative; width:54px; height:30px; text-align:left; text-indent:-9999px; background:#eee; border-radius:15px;}
input[type="checkbox"].switch + span:before {content:""; display:block; position:absolute; top:1px; left:1px; width:28px; height:28px; background:#fff; border-radius:50%; box-shadow:0 2px 2px -12px rgba(0,0,0,.5); transition:.3s ease-in-out;}
input[type="checkbox"].switch:checked + span {background:#ffde33;}
input[type="checkbox"].switch:checked + span:before {left:25px;}

/* 버튼형 1 (통신사 선택) */
.label-check2 {display:block; margin:10px 0;}
.label-check2:after {content:""; display:block; clear:both;}
.label-check2 > label {display:block; float:left; width:33.33%; height:44px; text-align:center; line-height:0; overflow:visible;}
.label-check2 > label:nth-child(3n) {width:calc(33.33% - 1px);}
.label-check2 > label span {display:flex; align-items:center; justify-content:center; position:relative; padding:10px; width:calc(100% + 2px); height:calc(100% + 1px); font-size:12px; line-height:1.4; word-break:break-all; color:#666; background:#fff; border:1px solid #eee;}
.label-check2 > label > input:checked + span {border:1px solid #ffde33; border-right-color:#eee; background:#ffde33; color:#222; font-family:"KBFGDisplayM"; z-index:10;}
.label-check2 > label:nth-child(3n) > input:checked + span {border-color:#ffde33;}
.label-check2.t1 {margin:0;}
.label-check2.t1 > label {height:54px;}
.label-check2.t1 > label span {padding:10px 5px;}

.label-check2.full > label {width:100% !important; margin-top:10px;}
.label-check2.full > label:first-child {margin-top:0;}

/* 버튼형 2 (날짜 선택) */
.label-check3 {display:flex; -webkit-display:flex; flex-direction:row; -webkit-flex-direction:row; width:100%; margin:10px 0;}
.label-check3:after {content:""; display:block; clear:both;}
.label-check3 > label {display:block; min-width:0; height:30px; float:left; color:#666; text-align:center; width:100%;}
.label-check3 > label + label {margin:0 0 0 4px;}
.label-check3 > label span {display:block; height:100%; padding:5px; border:1px solid #bbb; font-size:12px; line-height:18px; color:#666;}
.label-check3 > label > input:checked + span {border:1px solid #666; background:#666; color:#fff; font-family:"KBFGDisplayM";}

/* 동그란 버튼형 */
.label-check4 {display:inline-block; overflow:hidden; vertical-align:middle;}
.label-check4 > label {display:inline-block;}
.label-check4 > label:not(:last-child) {margin-right:2px;}
.label-check4 > label span {display:inline-block; height:30px; padding:7px 10px 6px; border-radius:15px; background:#666; color:#fff; text-align:center; font-size:13px; line-height:18px;}

/* 컬러목록 */
.label-check4 > label.c1 > input + span {background:#8c734b;}
.label-check4 > label.c2 > input + span {background:#666;}
.label-check4 > label.c3 > input + span {background:#ffde33;}
.label-check4 > label.c4 > input + span {background:#f68429;}
.label-check4 > label > input:not(:checked) + span {background:#666; opacity:0.6;}

.label-check5 {display:block; position:relative; margin:0 29px; counter-reset: step;}
.label-check5::after {content:""; display:block; position:absolute; top:11px; left:0; width:100%; height:0; border-top:1px dotted #ddd; z-index:-1;}
.label-check5 > label {float:left; width:20%; height:28px; overflow:auto;}
.label-check5 > label > input + span {display:block; position:absolute; top:0; width:22px; height:22px; text-indent:-9999px; overflow:hidden;}
.label-check5 > label:first-of-type > input + span {left:0; margin-left:0;}
.label-check5 > label:nth-of-type(2) > input + span {left:35%; margin-left:-11px;}
.label-check5 > label:nth-of-type(3) > input + span {left:50%; margin-left:-11px;}
.label-check5 > label:nth-of-type(4) > input + span {left:85%; margin-left:-21px;}
.label-check5 > label:last-of-type > input + span {left:100%; margin-left:-22px;}
.label-check5 > label > input + span::before, .label-check5 > label > input + span::after {content:""; display:block; position:absolute; top:0; left:50%; width:22px; height:22px; background:#ddd; border-radius:50%; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.label-check5 > label > input + span::after {counter-increment: step; content: counter(step); display:block; font-family: "KBFGDisplayB"; font-size: 12px; color: #fff; line-height: 22px; text-indent: 0; text-align: center;  background-color: transparent;}
.label-check5 > span.text {display:block; position:relative; clear:both; text-align:center; text-indent:-9999px;}
.label-check5 > span.text::before, .label-check5 > span.text::after {display:inline-block; position:absolute; top:0; width:22px; font-size:13px; color:#666; text-indent:0; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.label-check5 > span.text::before {content:"비동의"; left:0;}
.label-check5 > span.text::after {content:"동의"; left:100%; margin:0 -11px;}
.label-check5 > label input:checked + span::before {background:#f1a381;}
.label-check5.t2 > label {overflow:visible;}
.label-check5.t2 > label span.script {position:absolute; top:30px; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.label-check5.t2 > label:first-of-type span.script {left:0; margin-left:11px;}
.label-check5.t2 > label:nth-of-type(2) span.script {left:35%;}
.label-check5.t2 > label:nth-of-type(3) span.script {left:50%;}
.label-check5.t2 > label:nth-of-type(4) span.script {left:85%; margin-left:-11px;}
.label-check5.t2 > label:last-of-type span.script {left:100%; margin-left:-11px;}
.label-check5.t2 > span.text::before, .label-check5.t2 > span.text::after {display:none;}

/* 여러 checkbox, radio */
.input-area.chk-ra li:after {content:""; display:block; clear:both;}
.input-area.chk-ra li .right {float:right;}
.input-area.chk-ra li .input-wrap1.right {width:40%;}


/*******************************/
/***** 버튼, 아이콘 영역 						    *****/
/*******************************/
/***** 버튼 :영역 *****/
.btn-area {display:block; text-align:center; line-height:1;}
.btn-area:after {content:""; display:block; clear:both;}
.btn-area.left {text-align:left;}
.btn-area.left .sub {float:right;}
.btn-area.right {text-align:right;}

.tbl-data td .btn-area {float:right;}

/***** 버튼 :공통 *****/
button[class^="btn-"], a[class^="btn-"] {display:inline-block; position:relative; border:none; vertical-align:top; box-sizing:border-box;}
.btn-area.full [class^="btn-"], .btn-area.full [class^="input-"] {display:block; float:left; width:100%;}
/** 비활성 **/
a.disabled, button:disabled {cursor:not-allowed;}
a.disabled:not(.btn-main), button:not(.btn-main):disabled {background:#d8cfbf;}

/** 레벨 1 :페이지 하단 버튼 **/
.btn-main {padding:15px 15px; width:100%; height:58px; font-family:"KBFGDisplayM"; font-size:18px; color:#fff; line-height:28px; text-align:center; background:#60584c;}
.btn-main:disabled, .btn-main.disabled {background:#666; opacity:0.6; cursor:not-allowed;}
.btn-area.full .btn-main:first-of-type:not(:last-of-type) {width:40%;}
.btn-area.full .btn-main:last-of-type:not(:only-child) {margin:0 0 0 1px; width:calc(60% - 1px);}
.btn-area.full .btn-main.w50p + .btn-main {width:calc(50% - 1px);}
.btn-area.full .btn-main.w100p + .w100p {margin:1px 0 0 0;}
.btn-area.full .btn-main.fs14 {padding:12px 15px; line-height:34px;}
.btn-main.c1 {background:#ffde33;}
.btn-main.c2 {background:#b0b0b0;}

/** 2019.04.02 자동이체 버튼 추가 9820043 **/
.btn-main2 {padding:15px 15px; width:100%; height:58px; font-family:"KBFGDisplayM"; font-size:18px; color:#fff; line-height:28px; text-align:center; background:#60584c;}
.btn-main2:disabled, .btn-main2.disabled {background:#666; opacity:0.6; cursor:not-allowed;}
.btn-area.full .btn-main2:first-of-type:not(:last-of-type) {width:50%;}
.btn-area.full .btn-main2:last-of-type:not(:only-child) {margin:0 0 0 1px; width:calc(50% - 1px);}
.btn-area.full .btn-main2.w50p + .btn-main2 {width:calc(50% - 1px);}
.btn-area.full .btn-main2.w100p + .w100p {margin:1px 0 0 0;}
.btn-area.full .btn-main2.fs14 {padding:12px 15px; line-height:34px;}
.btn-main2.c1 {background:#ffde33;}
.btn-main2.c2 {background:#b0b0b0;}

/** 레벨 2 :콘텐츠 내부 버튼 **/
.btn-com {padding:10px 15px; min-width:80px; height:45px; font-family:"KBFGDisplayM"; font-size:14px; color:#fff; line-height:25px; text-align:center; background:#8c734b;}
.btn-com.disabled, .btn-com:disabled {background:#d8cfbf; cursor:not-allowed;}
.btn-area.full .btn-com {width:100%;}
.btn-area.full *.w100 {width:100% !important;}
.btn-area.full *.w50 {width:50% !important;}
.btn-area.full .w50:nth-child(even) {width:calc(50% - 1px) !important; margin-left:1px !important;}
.btn-area.full .w50 + .w50 + .w50 {margin-top:1px !important;}
.btn-area.full *.w30 {width:33.32%;}
.btn-area.full .w30 + .w30 {width:calc(33.34% - 1px); margin-left:1px !important;}
.btn-com.c1 {background:#60584c;}
.btn-com.c2 {background:transparent; color:#666; border:1px solid #eee;}
.btn-com.c3 {background:#ffde33; color:#fff; border:1px solid #ffde33;}
.btn-com.c4 {background:#b0b0b0;}

/*.btn-com:disabled {background:#666; opacity:0.6;}*/
.btn-com i {display:inline-block; margin:0 8px 0 0; width:20px; height:20px; vertical-align:top; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px;}
.btn-com i.ico-cam {background-position:0 -40px;} /* 카메라 */
.btn-com i.ico-file {background-position:-20px -40px;} /* 파일 */
.btn-com i.ico-re {background-position:-80px -20px;} /* 새로고침 */
.btn-com i.ico-voi {background-position:-100px -20px;} /* 파일 */
.btn-com i.ico-calc {background-position:-120px -20px;} /* 보험료계산 */
.btn-com span[class^="ico"] {display:inline-block; position:relative; padding:0 0 0 26px; line-height:18px;}
.btn-com span[class^="ico"]::before {content:""; display:block; position:absolute; top:0; left:0; width:20px; height:20px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px;}
.btn-com span.ico-terms::before {width:18px; height:18px; background-position:-80px -40px;}
.btn-com span.ico-inquiry::before {width:18px; height:18px; background-position:-98px -40px;}
.btn-com.t1 {height:auto;}
.btn-com.t1 em {display:block; font-size:18px;}

.btn-com.t2 {color:#666; background:transparent; border:1px solid #eee;}
.btn-com.t2.w50 + .btn-com.t2.w50 {margin:0 0 0 -1px !important; width:50% !important;}

.btn-com.clear {height:53px; color:#222; line-height:33px; background:transparent;}

/** 레벨 3 :타이틀 영역 버튼 (팝업 호출, 우편번호 등) **/
.link-com {display:inline-block; position:relative; padding:1px 20px 0 10px; height:24px; font-size:11px; color:#fff; line-height:23px; text-decoration:none; vertical-align:top; background:#ffde33; border-radius:12px;}
.link-com:before, .link-com:after {content:""; display:block; position:absolute; top:50%; right:12px; margin-top:-1px; width:5px; height:1px; background:#fff; border-radius:1px; -webkit-transform-origin:right center; transform-origin:right center;}
.link-com:before {transform:rotate(45deg);}
.link-com:after {transform:rotate(-45deg);}
.link-com.c1 {background:#645b4c;}
.link-com.c2 {background:#b0b0b0;}
.link-com.c3 {background:#8c734b;}
.link-com.c4 {color:#8c734b; background:transparent; border:1px solid #8c734b;}
.link-com.c4:before, .link-com.c4:after {background:#8c734b;}
.link-com.c5 {background:#eee; color:#666;}
.link-com.c6 {color:#fff; background:transparent; border:1px solid #fff;}
.link-com.c7 {color:#666; background:transparent; border:1px solid #666; margin-top:15px;}
.link-com.c7:before, .link-com.c7:after {content:""; display:block; position:absolute; top:50%; right:12px; margin-top:-1px; width:5px; height:1px; background:#666; border-radius:1px; -webkit-transform-origin:right center; transform-origin:right center;}
.link-com.ico {padding-left:34px;}
.link-com.ico i[class^="ico"] {display:block; position:absolute; top:3px; left:11px; width:18px; height:18px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px;}
.link-com.ico i.ico1 {background-position:0 0;}
.link-com.cl {padding:1px 10px 0;}
.link-com.cl:before, .link-com.cl:after {display:none;}

.link-com.sb {padding:0 35px 0 20px; min-width:170px; height:40px; font-size:16px; line-height:40px; border-radius:20px; -webkit-box-shadow:0 2px 3px 0 rgba(0,0,0,.2); box-shadow:0 2px 3px 0 rgba(0,0,0,.2);}
.link-com.sb:before, .link-com.sb:after {right:22px; width:8px;}

.link-com.sb2 {padding:4px 16px 3px 10px; height:auto; text-align:center; line-height:16px; border-radius:8px;}
.link-com.sb2.cl {padding:4px 10px;}
.link-com.sb2::before, .link-com.sb2::after {right:8px;}

.tbl-data table .link-com {height:18px; padding:1px 20px 0 10px; line-height:17px;}
.tbl-data table .link-com.cl { padding:1px 10px 0 10px;}
.tbl-data table .link-com:before, .tbl-data table .link-com:after {right:10px; width:4px;}

/** 레벨 4 :추가정보 확인하기 (더보기, 상세내역 보기) **/
a.btn-sub, button.btn-sub {padding:0 10px; min-width:76px; height:24px; font-size:12px; color:#8c734b; text-align:center; background:transparent; border:1px solid #8c734b; border-radius:12px;}
.btn-sub > span {display:inline-block; position:relative; padding-right:10px; height:22px; line-height:22px; letter-spacing:1px;}
a.btn-sub > span {line-height:23px;}
.btn-sub > span:after {content:""; display:block; position:absolute; top:50%; right:2px; width:5px; height:5px; border:1px solid transparent; border-top-color:#8c734b; border-left-color:#8c734b; border-radius:1px; -webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg); -webkit-transform-origin:center; transform-origin:center;}
.btn-sub.cl > span {padding-right:0;}
.btn-sub.cl > span:after {display:none;}
a.btn-sub.btn-toggle, button.btn-sub.btn-toggle {border-color:#ffde33;}
.btn-sub.btn-toggle > span {font-family:'KBFGDisplayM'; color:#ffde33; line-height:23px;}
.btn-sub.btn-toggle > span:after {right:0; width:6px; height:6px; margin-top:-2px; border-top-color:#ffde33; border-left-color:#ffde33; -webkit-transform:translateY(-50%) rotate(225deg); transform:translateY(-50%) rotate(225deg); -webkit-transform-origin:center; transform-origin:center;}
.btn-sub.btn-toggle.active > span:after {margin-top:2px; -webkit-transform:translateY(-50%) rotate(45deg); transform:translateY(-50%) rotate(45deg);}

/** 기타 **/
/* 텍스트 링크 */
.btn-txt {display:inline-block !important;}
.btn-area.full .btn-txt {float:none; width:auto; line-height:normal;}
.btn-area > .btn-txt + .btn-txt {margin:0 0 0 10px;}
.btn-area > .btn-txt + .btn-txt:before {content:""; display:inline-block; margin:2px 10px 0 0; width:1px; height:12px; background:#ccc;}
a.link-txt, button.link-txt {display:block; position:relative; padding:10px 15px; font-family:"KBFGDisplayM"; font-size:14px; color:#967a4c; text-decoration:none; text-align:center; vertical-align:top;}
.link-txt:not(a):not(button), a.link-txt > span, button.link-txt > span {display:inline-block; position:relative; padding-right:10px; line-height:30px;}
.link-txt:not(a):not(button):after, a.link-txt > span:after, button.link-txt > span:after {content:""; display:block; position:absolute; top:50%; right:0; width:8px; height:8px; border:1px solid transparent; border-top-color:#666; border-left-color:#666; border-radius:1px; -webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg); -wewbkit-transform-origin:center; transform-origin:center;}
.link-txt.left:not(a):not(button), a.link-txt.left > span, button.link-txt.left > span {padding-left:10px; padding-right:0px;}
.link-txt.left:not(a):not(button):after, a.link-txt.left > span:after, button.link-txt.left > span:after {right:auto; left:0; -webkit-transform:translateY(-50%) rotate(-45deg); transform:translateY(-50%) rotate(-45deg);}
.link-txt2 {display:block; position:relative; padding-right:20px;}
.link-txt2:after {content:""; display:block; position:absolute; top:50%; right:0px; width:8px; height:8px; border:1px solid transparent; border-top-color:#bbb; border-left-color:#bbb; -webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg); -wewbkit-transform-origin:center; transform-origin:center;}
.link-txt3, .link-txt3:hover {text-decoration:underline;}
a.link-txt4, button.link-txt4 {display:inline-block; position:relative; padding-right:10px; text-decoration:none; vertical-align:top;}
.link-txt4:not(a):not(button):after, a.link-txt4 > span:after, button.link-txt4 > span:after {content:""; display:block; position:absolute; top:50%; right:0; width:8px; height:8px; border:1px solid transparent; border-top-color:#ffde33; border-left-color:#ffde33; border-radius:1px; -webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg); -wewbkit-transform-origin:center; transform-origin:center;}

/* 해당 항목 삭제 버튼 */
.btn-tag {display:inline-block; position:relative; padding:1px 30px 0 15px; height:33px; color:#fff; line-height:32px; text-decoration:none; vertical-align:top; background:#8c734b; border-radius:16px;}
.btn-tag:before, .btn-tag:after {content:""; display:block; position:absolute; top:50%; right:12px; width:12px; height:1px; background:#fff; border-radius:1px; -webkit-transform-origin:center; transform-origin:center;}
.btn-tag:before {transform:translateY(-50%) rotate(45deg);}
.btn-tag:after {transform:translateY(-50%) rotate(-45deg);}

/* 선택할 수령계좌가 없을 때 */
button.none {display:block; padding:15px; width:100%; color:#b0b0b0; background:transparent; border:1px dashed #b0b0b0; cursor:none;}
button.none:active, button.none:focus {outline:none;}

/* 플로팅 버튼 (문의하기, top 버튼 등) */
.float-area {position:fixed; right:25px; bottom:20px; z-index:2001;}
.menu-float {position:relative; width:42px; height:42px; background:#febe0e; border-radius:21px; -webkit-transition:height 0.2s; transition:height 0.2s;}
.menu-float.active {height:210px;} /* 메뉴 갯수 x 42 + 42(토글 버튼 높이) */
.menu-float .btn-icon {display:block; position:absolute !important; bottom:0; left:0; width:42px; height:42px; -webkit-transform:rotate(0deg); transform:rotate(0deg); -webkit-transition:all .2s; transition:all .2s;}
.menu-float .btn-icon:before {content:""; display:block; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:20px; height:24px; background:url(../images/comm/ico-set.png) no-repeat 0 0/300px 300px; background-position:-60px -20px;}
.menu-float.active .btn-icon {-webkit-transform:rotate(135deg); transform:rotate(135deg);}
.menu-float.active .btn-icon:before, .menu-float.active .btn-icon:after {content:""; display:block; position:absolute; top:50%; left:50%; width:20px; height:2px; background:#fff;}
.menu-float.active .btn-icon:before {-webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.menu-float.active .btn-icon:after {-webkit-transform:translate(-50%, -50%) rotate(90deg); transform:translate(-50%, -50%) rotate(90deg);}

/* 플로팅 버튼 메뉴 */
.menu-float > ul {display:none; position:absolute; top:0; right:0; min-width:300px;}
.menu-float.active > ul {display:block;}
.menu-float > ul li {text-align:right;}
.menu-float > ul li a {display:inline-block; position:relative; padding:0 68px 0 18px; height:42px; font-size:12px; font-family:"KBFGDisplayM"; color:#fff; line-height:42px; border-radius:21px;}
.menu-float > ul li a:after {content:""; display:block; position:absolute; top:50%; right:11px; width:20px; height:20px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.menu-float > ul li a:hover, .menu-float > ul li a:focus, .menu-float > ul li a:active {color:#222; background:#fff;}
.menu-float ul a.ico1:after {height:24px; background-position:-60px -20px;} /* 콜센터 */
.menu-float ul a.ico2:after {background-position:0 -20px;} /* 전화 */
.menu-float ul a.ico3:after {background-position:-20px -20px;} /* 문자 */
.menu-float ul a.ico4:after {background-position:-40px -20px;} /* 카톡 */

/* top 버튼 */
.goTop {display:none; position:relative; margin:8px 0 0 0; width:42px; height:42px; background:#fff; border:1px solid #ccc; border-radius:25px;}
.goTop.active {display:block;}
.goTop > span {position:relative; display:block; margin:13px auto; width:2px; height:14px; text-indent:-9999px; background:#b0b0b0; border-radius:1px;}
.goTop > span:before, .goTop > span:after {content:""; display:block; position:absolute; width:2px; height:10px; background:#b0b0b0; border-radius:1px;}
.goTop > span:before {top:0; left:0; -webkit-transform:rotate(45deg); transform:rotate(45deg); -webkit-transform-origin:top right; transform-origin:top right;}
.goTop > span:after {top:0; left:0; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); -webkit-transform-origin:top left; transform-origin:top left;}
.goTop:disabled {opacity:.2;}

/* 아이콘 버튼 */
.btn-icon:not(.btn-com), .btn-icon:not(.ico-notice), .btn-icon:not(.ico-close), .btn-icon:not(.btn-search), .btn-icon:not(.btn-edit) {position:relative; width:0; height:40px; padding:0 40px 0 0; background-color:transparent; text-indent:-999px; font-size:0; overflow:hidden;}
.btn-icon i, .btn-icon > span {display:block; position:absolute; top:0; left:0; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px;}
.btn-icon i:before, .btn-icon i:after, .btn-icon > span:before, .btn-icon > span:after {display:block; position:absolute;}

/* 아이콘 버튼2 */
.btn-icon2 {width:0; height:16px; padding:0 16px 0 0; border-radius:50%; background:#8e8f91; text-align:left; text-indent:-999px; overflow:hidden;}
.btn-icon2:before {content:""; display:block; position:absolute; top:0; left:0; width:16px; height:16px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px;}
.btn-icon2.ico1:before {background-position:-36px 0;}

/***** 아이콘 *****/
/** header 영역 **/
/* 뒤로가기 */
.btn-icon.ico-back span {top:50%; left:12px; width:14px; height:2px; background:#222; border-radius:1px; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.btn-icon.ico-back span:after, .btn-icon.ico-back span:before {content:""; top:50%; left:-2px; width:9px; height:2px; background:#222; border-radius:1px; transform-origin:left center;}
.btn-icon.ico-back span:before {-webkit-transform:translateY(-50%) rotate(-45deg); transform:translateY(-50%) rotate(-45deg);}
.btn-icon.ico-back span:after {-webkit-transform:translateY(-50%) rotate(45deg); transform:translateY(-50%) rotate(45deg);}

.btn-icon.ico-back.single {
	position:absolute;
	top:5px;
	left:8px;
	z-index:99;
}

.btn-icon.ico-back.single-fixed {
	position:fixed;
	top:5px;
	left:8px;
	z-index:99;
}

/*검색 */
.btn-icon.ico-search span {top:10px; left:12px; width:15px; height:15px; background:transparent; border:2px solid #222; border-radius:50%;}
.btn-icon.ico-search span:before {content:""; top:11px; left:9px; width:8px; height:2px; background:#222; border-radius:1px; -webkit-transform:rotate(45deg); transform:rotate(45deg);}

/* 메뉴 */
.btn-icon.ico-menu:before, .btn-icon.ico-menu:after, .btn-icon.ico-menu span:before {content:""; display:block; position:absolute; right:11px; height:2px; background:#222;}
.btn-icon.ico-menu:before {top:11px; width:21px;}
.btn-icon.ico-menu:after {top:18px; width:16px;}
.btn-icon.ico-menu span {top:0; left:0; bottom:0; right:0; background:transparent;}
.btn-icon.ico-menu span:before {top:25px; width:11px;}
.btn-icon.ico-menu span:after {content:""; display:block; position:absolute; top:24px; left:8px; width:4px; height:4px; background:#eea616;}

/** 컨텐츠 영역 **/
/* 뱃지 타입(텍스트 아이콘) */
.icon-txt1 {display:inline-block; padding:1px 8px 0px; min-width:30px; height:17px; font-size:11px; color:#fff; line-height:16px; text-align:center; border-radius:10px;}
.icon-txt1.c1 {background:#8c734b;}
.icon-txt1.c2 {background:#666;}
.icon-txt1.c3 {background:#ffde33;}
.icon-txt1.c4 {background:#f68429;}
.icon-txt1.c5 {background:#ff3d3d;}
.icon-txt1.c6 {background:#82ca9c;}
.icon-txt1.c7 {background:#0066ff;}
.icon-txt1.c8 {background:#759626;}

.icon-txt2 {display:inline-block; padding:1px 15px 0px; min-width:40px; height:27px; font-size:12px; color:#fff; line-height:26px; text-align:center; border-radius:15px;}
.icon-txt2.c1 {background:#8c734b;}
.icon-txt2.c2 {background:#666;}
.icon-txt2.c3 {background:#ffde33;}
.icon-txt2.c4 {background:#f68429;}
.icon-txt2.c5 {background:#ff3d3d;}
.icon-txt2.c6 {background:#82ca9c;}
.icon-txt2.c7 {background:#0066ff;}
.icon-txt2.c8 {background:#759626;}
.icon-txt2.c9 {color:#8c734b; background:transparent; border:1px solid #8c734b;}

/* 전화, 문자, 메신저 */
.btn-icon i.ico-call, .btn-icon i.ico-mms, .btn-icon i.ico-msg {top:10px; left:10px; width:20px; height:20px;}
.btn-icon i.ico-call {background-position:0 -20px;}
.btn-icon i.ico-mms {background-position:-20px -20px;}
.btn-icon i.ico-msg {background-position:-40px -20px;}

/* 더보기 */
.btn-icon i.ico-more, .btn-icon i.ico-more:before, .btn-icon i.ico-more:after {content:""; top:50%; margin:-2px 0 0 0; width:4px; height:4px; background:#fdb913; border-radius:2px;}
.btn-icon i.ico-more {left:8px;} 
.btn-icon i.ico-more:before {left:18px;}
.btn-icon i.ico-more:after {left:9px;}

/* 닫기 */
.btn-icon i.ico-close {display:block; position:absolute; top:0; right:0; bottom:0; left:0; background:none;}
.btn-icon i.ico-close:before, .btn-icon i.ico-close:after {content:""; position:absolute; top:50%; left:50%; width:20px; height:2px; background:#222; border-radius:1px; -webkit-transform-origin:center; transform-origin:center;}
.btn-icon i.ico-close:before {-webkit-transform:translate(-50%, -50%) rotate(45deg); transform:translate(-50%, -50%) rotate(45deg);}
.btn-icon i.ico-close:after {-webkit-transform:translate(-50%, -50%) rotate(-45deg); transform:translate(-50%, -50%) rotate(-45deg);}

/* 편집(수정하기) */
.btn-icon.btn-edit {position:absolute; top:0; right:10px; padding:0 30px 0 0; width:30px; height:30px; background:#eee; border-radius:50%;}
.btn-icon.btn-edit > span {width:30px; height:30px; background-position:-120px -80px;}

/* 드롭다운 (▼), 토글 여닫기 */
.btn-icon i.ico-toggle {display:block; position:absolute; top:14px; left:16px; width:9px; height:9px; background:none; border:solid #bbb; border-width:0 1px 1px 0; -webkit-transform-origin:center; transform-origin:center; -webkit-transform:rotate(45deg); transform:rotate(45deg);}

/* 증가/감소 화살표, 가감문구 [ex) 환율, 증시현황 관련] */
.arr-type1 {position:relative; display:inline-block; padding-left:12px; margin-left:10px;}
.arr-type1.up {color:#ff3d3d;}
.arr-type1.down {color:#0066ff;}
.arr-type1:after {content:""; position:absolute; top:50%; left:0; margin-top:-4px; width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent;}
.arr-type1.up:after {border-bottom:7px solid #ff3d3d;}
.arr-type1.down:after {border-bottom:7px solid #0066ff;}

/** 인증 **/
.list-link .btn-proof {position:relative; display:inline-block; padding:0 0 0 50px; font-family:"KBFGDisplayM"; font-size:14px; color:#222;}
.list-link li.disabled .btn-proof {color:#666;}
.list-link .btn-proof:before {content:""; display:block; position:absolute; top:50%; left:0; width:32px; height:28px; background:url(../images/comm/ico-proof.png) no-repeat; background-size:300px 300px; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.list-link li .btn-proof.ico1:before,							/* 공인인증 */
.list-link li.active .btn-proof.ico1:before {background-position:0 -28px;}
.list-link li.disabled .btn-proof.ico1:before {background-position:0 0;}
.list-link li .btn-proof.ico2:before,						/* 지문/FACE ID 인증 */
.list-link li.active .btn-proof.ico2:before {background-position:-32px -28px;}
.list-link li.disabled .btn-proof.ico2:before {background-position:-32px 0;}
.list-link li .btn-proof.ico3:before,						/* 휴대폰 인증 */
.list-link li.active .btn-proof.ico3:before {background-position:-64px -28px;}
.list-link li.disabled .btn-proof.ico3:before {background-position:-64px 0;}
.list-link li .btn-proof.ico4:before,					/* 카카오페이 인증 */
.list-link li.active .btn-proof.ico4:before {background-position:-96px -28px;}
.list-link li.disabled .btn-proof.ico4:before {background-position:-96px 0;}
.list-link li .btn-proof.ico5:before,						/* 신용카드 인증 */
.list-link li.active .btn-proof.ico5:before {background-position:-128px -28px;}
.list-link li.disabled .btn-proof.ico5:before {background-position:-128px 0;}
.list-link li .btn-proof.ico6:before,					/* 이체비밀번호 */
.list-link li.active .btn-proof.ico6:before {background-position:-160px -28px;}
.list-link li.disabled .btn-proof.ico6:before {background-position:-160px 0;}

/* 스마트알림 리스트 아이콘 */
.icon-flag {display:inline-block; position:relative; min-width:30px; height:17px; padding:1px 6px 0px; border-radius:10px; text-indent:-9999px; font-size:0; overflow:hidden;}
.icon-flag.c1 {background:#dab385;}
.icon-flag.c2 {background:#6fb969;}
.icon-flag.c3 {background:#4aa543;}
.icon-flag.c1:before, .icon-flag.c2:before {content:""; display:block; position:absolute; top:2px; left:50%; width:15px; height:12px; background:url(../images/comm/ico-menu.png) -133px 0 no-repeat; background-size:300px auto; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.icon-flag.c1:before {background-position:-133px 0;}
.icon-flag.c2:before {background-position:-148px 0;}
.icon-flag.c3:before {background-position:-168px 0;}
.icon-flag i {background:#666;}

/*******************************/
/***** 텍스트 :타이틀 				    *****/
/*******************************/
/* 페이지 타이틀 (헤더) */
.tit-con1 {display:inline-block; padding:8px 0; font-size:20px; line-height:27px; vertical-align:top;}

/* 항목 타이틀 */
.tit-sub1 {position:relative; margin:36px 0 16px;}
div.tit-sub1:after {content:""; display:block; clear:both;}
div.tit-sub1 > h2, div.tit-sub1 > h3, div.tit-sub1 > h4 {display:inline-block; font-family:"KBFGDisplayB"; font-size:20px; color:#222; line-height:28px;}
.tit-sub1:not(div) {font-family:"KBFGDisplayM"; font-size:20px; color:#222; line-height:28px; word-break:keep-all;}
div.tit-sub1 > .sub {float:right; padding-top:4px;}
div.tit-sub1 > .sub.box {margin:3px 0 0; padding:2px 10px; background:#fafafa; border-radius:12px;}
div.tit-sub1.t2 > h2, div.tit-sub1.t2 > h3, div.tit-sub1.t2 > h4, .tit-sub1.t2:not(div) {font-family:"KBFGDisplayL";}
div.tit-sub1 > h2 em {line-height:30px;}

.tit-sub2 {position:relative; margin:20px 0 0px; line-height:24px;}
div.tit-sub2:after {content:""; display:block; clear:both;}
div.tit-sub2 > h2, div.tit-sub2 > h3, div.tit-sub2 > h4 {display:inline-block; font-family:'KBFGDisplayM'; font-size:16px; color:#666;}
div.tit-sub2.strong > h4, div.tit-sub2.strong > span {font-size:16px; color:#222;}
div.tit-sub2.strong > h4 + span {margin-left:10px;}
div.tit-sub2 > .sub {float:right;}
.tit-sub2:not(div) {font-size:16px; color:#666;}
div.tit-sub2 .btn-icon2 {margin-top:2px;}
div.tit-sub2.t2 > h2, div.tit-sub2.t2 > h3, div.tit-sub2.t2 > h4, .tit-sub2.t2:not(div) {font-family:"KBFGDisplayL";}

.tit-sub3, .tit-sub3:not(div) {position:relative; font-family:'KBFGDisplayM'; font-size:14px; color:#666; line-height:20px;}
div.tit-sub3 {margin:20px 0 0px;}
.tit-sub3 > h3, .tit-sub3 > h4 {display:inline-block;}
div.tit-sub3 > .sub {float:right; font-size:11px;}

/* 타이틀만 좌우 패딩 있을 때 [ex).list-item에 타이틀이 있는 경우(지급>신청내역 페이지)] */
.conts-tit1 {padding:36px 19px 20px;}
.conts-tit1 [class*="tit-sub"]:first-child, .conts-tit1 [class*="tit-sub"]:only-child {margin:0px;}
.conts-tit1 + .list-item {margin-top:-10px;}
.form-area2 .conts-tit1 {padding:36px 0 15px;}
.form-area2 div.conts-tit1:first-of-type {padding-top:0;}


/*******************************/
/***** 텍스트 :메시지 				    *****/
/*******************************/
/* 상단 카피 메세지 */
.mes-t1 {margin:0 0 15px; font-family:"KBFGDisplayM"; font-size:24px; line-height:34px;}
.mes-t1 + .tit-sub1 {margin-top:0;}
.mes-t1 .sub {display:block; max-width:200px; margin:10px 0 0; color:#666; font-size:14px; line-height:20px; word-break:keep-all;}
.mes-t1 .sub.full {max-width:100%;}
.mes-t1 em {font-family:"KBFGDisplayL"; color:#ffde33;}
.pop-body .mes-t1 {margin:60px 48px 40px;}

.mes-t1.t2 {margin:10px 0 35px; font-family:"KBFGDisplayL"; font-size:20px; line-height:27px;}
.mes-t1.t3 {position:relative; margin:20px 19px 30px; padding:70px 0 0 0; font-family:"KBFGDisplayL"; font-size:20px; line-height:27px;}
.mes-t1.t3:before {position:absolute; content:""; left:0; top:0; width:50px; height:50px; background:url(../images/comm/clipart-set2.png) no-repeat; background-size:300px 300px;}
.mes-t1.t3.ico1:before {background-position:0px 0px;}
.mes-t1.t3.ico2:before {background-position:-50px 0px;}

.mes-t2 {position:relative; margin:30px 0 15px; padding:0 0 0 68px; font-family:"KBFGDisplayM"; font-size:24px; line-height:34px;}
.mes-t2 .sub {display:block; max-width:200px; margin:10px 0 0; color:#666; font-family:"KBFGDisplayL"; font-size:14px; line-height:20px; word-break:keep-all;}
.mes-t2 .sub em {font-family:"KBFGDisplayM"; text-decoration:underline;}
.mes-t2:before {position:absolute; content:""; left:7px; top:7px; width:43px; height:49px; background:url(../images/comm/ico-cs.png) no-repeat; background-size:300px 300px;}
.mes-t2.ico1:before {background-position:0px 0px;}
.mes-t2.ico2:before {background-position:-50px 0px;}
.mes-t2.ico3:before {background-position:-100px 0px;}
.mes-t2.ico4:before {background-position:-150px 0px;}
.mes-t2.ico5:before {background-position:-200px 0px;}
.mes-t2.ico6:before {background-position:-250px 0px;}

.mes-t3 {margin:30px 0 15px; padding:0; width:150px; font-family:"KBFGDisplayL"; font-size:16px; color:#222; line-height:20px; word-break:keep-all;}
.mes-comp + .mes-t3 {margin:-30px 0 15px;}

/* 상단 요약 */
.info-sum {display:flex; justify-content:space-between; position:relative; margin:0 -30px 25px;}
.info-sum dl {padding:0 0 0 10px; min-width:48%; text-align:left; font-size:14px;}
.info-sum dl:first-of-type {padding:0;}
.info-sum dt {margin:0 0 10px; color:#222;}
.info-sum dd {color:#222; font-family:"KBFGDisplayM";}
.info-sum dd strong {margin-right:5px; font-size:18px;}
.info-sum > span, .info-sum > span.sep {display:block; width:1px; text-indent:-9999px; border-left:1px dotted #fff;}
@media screen and (max-width:360px) {
	.info-sum dd strong {font-size:16px;}
}

.info-sum.t1 {margin-bottom:0;}
.info-sum.t1 dl {display:block; width:100%; font-size:16px;}
.info-sum.t1 dt {display:inline-block; vertical-align:middle; width:calc(50% - 3px); margin-bottom:0;}
.info-sum.t1 dd {display:inline-block; vertical-align:middle; width:calc(50% - 3px); text-align:right;}

.info-sum.row {display:block;}
.info-sum.row dt, .info-sum.row dd {text-align:left;}
.info-sum.row > span.sep {margin:10px 0; width:100%; height:1px; border-top:1px dotted #fff; border-left:none;}

/* 완료 메세지 */
.mes-comp {position:relative; margin:0 0 60px 0; padding:100px 0 0; font-size:20px; line-height:30px; color:#222;}
.mes-comp:before {content:""; display:block; position:absolute; top:0; left:0; width:65px; height:65px; background:url(../images/comm/clipart-set.png) no-repeat; background-size:400px auto;}
.mes-comp .sub {display:block; max-width:200px; margin:10px 0 0; font-size:14px; line-height:20px; word-break:keep-all;}
.mes-comp .sub.full {max-width:100%;}
.mes-comp .sub-copy {font-size:16px; line-height:20px; color:#222; margin:28px 0 0;}
/* 공통 */
.mes-comp.ico1:before {background-position:0 -40px;} /* 알려드립니다 */
.mes-comp.ico2:before {background-position:-65px -40px;} /* 요청하신 페이지를 찾을 수 없습니다 */
.mes-comp.ico3:before {background-position:-130px -40px;} /* 현재 서비스 접속이 원활하지 않습니다 */
.mes-comp.ico4:before {background-position:-195px -40px;} /* 서비스 점검 중입니다 */
.mes-comp.ico5:before {background-position:-260px -40px;} /* 네트워크 연결 오류 */
.mes-comp.ico6:before {background-position:-325px -40px;} /* 조회내역이 없습니다 */
.mes-comp.ico7:before {background-position:0 -105px;} /* 자동 로그아웃 되었습니다 */
/* 보험료 납입 */
.mes-comp.ico8:before {background-position:-65px -105px;} /* 보험료 납입이 완료되었습니다 */
/* 변경/해지 */
.mes-comp.ico9:before {background-position:-130px -105px;} /* 납입 자동이체변경 완료 */
.mes-comp.ico10:before {background-position:-195px -105px;} /* 대출이자 자동이체변경 완료 */ 
.mes-comp.ico11:before {background-position:-260px -105px;} /* 송금계좌변경 완료 */
.mes-comp.ico12:before {background-position:-325px -105px;} /* 품질보증신청 완료 */
.mes-comp.ico13:before {background-position:0 -170px;} /* 품질보증신청 취소 */
.mes-comp.ico14:before {background-position:-65px -170px;} /* 청약절회신청 완료 */
.mes-comp.ico15:before {background-position:-130px -170px;} /* 보험료 감액 완료 */
.mes-comp.ico16:before {background-position:-195px -170px;} /* 보험료 증액 완료 */
.mes-comp.ico17:before {background-position:-260px -170px;} /* 납입중지 신청 완료 */
.mes-comp.ico18:before {background-position:-325px -170px;} /* 납입중지 해지 완료 */
.mes-comp.ico19:before {background-position:0 -235px;} /* 태아등재 완료 */
/* 지급 */
.mes-comp.ico20:before {background-position:-65px -235px;}  /* 만기보험금, 해지환급금, 휴면보험금, 중도인출, 분할보험금, 배당금 지급 완료 */
/* 청구 */
.mes-comp.ico21:before {background-position:-130px -235px;} /* 보험금청구신청 완료 */
.mes-comp.ico22:before {background-position:-195px -235px;} /* 추가서류접수 완료 */
/* 서류접수 */
.mes-comp.ico23:before {background-position:-260px -235px;} /* 변경서류 접수 완료 */
.mes-comp.ico24:before {background-position:-325px -235px;} /* 보험계약대출 지급서류 접수 완료 */
.mes-comp.ico25:before {background-position:0 -300px;} /* 중도인출, 해지환급금, 연금, 분할보험금, 만기보험금, 휴면보험금, 배당금 지급서류접수 완료 */
.mes-comp.ico26:before {background-position:-65px -300px;} /* 기관서류발급 제출 완료 */
/* 대출 */
.mes-comp.ico27:before {background-position:-130px -300px;} /* 보험계약대출, 보험계약대출이자납입 신청 완료 */
.mes-comp.ico28:before {background-position:-195px -300px;} /* 보험계약대출상환 신청 완료 */
/* 변액 */
.mes-comp.ico29:before {background-position:-260px -300px;} /* 펀드편입비율변경, 펀드변경, 채권형펀드 자동변경옵션 신청 완료 */
.mes-comp.ico30:before {background-position:-325px -300px;} /* 펀드자동재배분신청 완료 */
.mes-comp.ico31:before {background-position:0 -365px;} /* 펀드자동재배분해지, 채권형펀드 자동변경옵션 해지 완료 */
/* 증명서 발급 */
.mes-comp.ico32:before {background-position:-65px -365px;} /* 소득, 세액공제납입증명서, 보험료잔액증명서 발급 완료 */
.mes-comp.ico33:before {background-position:-130px -365px;} /* 증권재발행 신청 완료 */
/* 고객정보 */
.mes-comp.ico34:before {background-position:-195px -365px;} /* 내정보 변경 완료 */
.mes-comp.ico35:before {background-position:-260px -365px;} /* 정보제공동의변경 완료 */
.mes-comp.ico36:before {background-position:-325px -365px;} /* 금융주소 한번에 서비스 신청 완료 */
/* 인증센터 */
.mes-comp.ico37:before {background-position:0 -430px;} /* 지문/FACE ID 인증 등록 완료 */
.mes-comp.ico38:before {background-position:-65px -430px;} /* 지문/FACE ID 인증 해지 완료 */
.mes-comp.ico39:before {background-position:-130px -430px;} /* 이체비밀번호 등록, 인증 완료 */
.mes-comp.ico40:before {background-position:-195px -430px;} /* 이제비밀번호 재발급 접수 완료, 재발급 신청 완료 */
/* 고객케어 */
.mes-comp.ico41:before {background-position:-260px -430px;} /* 설문조사 완료 */

.mes-comp.none {padding:20px 0 0;}		/* 아이콘 없이 메세지만 있을 경우 */
.mes-comp.none:before {display:none;}

div.mes-comp > .btn-area {margin:20px 0 0 0;}
div.mes-comp + div.mes-comp {margin-top:-20px;}
.mes-alert {margin:30px 0; font-size:16px;}

/* 데이터 없을 때, 보장분석 - 조회된 보험 계약이 없음 */
.mes-noneData {position:relative; margin:0 0 20px 0; padding:68px 0 0; font-family:"KBFGDisplayM"; font-size:16px; text-align:center; line-height:30px; color:#222;}
.mes-noneData::before {content:""; display:block; position:absolute; top:0; left:50%; width:58px; height:58px; background:url(../images/comm/clipart-set2.png) -196px 0 no-repeat; background-size:300px auto; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.mes-noneData.t2 {margin:-19px; padding:19px; height:296px; line-height:296px; background:url() no-repeat;}
.mes-noneData.t2::before {display:none;}
.mes-noneData.t2 p {margin:100px 0 80px; font-size:26px; color:#666; line-height:36px;}
.mes-noneData.t2 p em {color:#f46600;}
.mes-noneData.t2 .txt-num3 li {padding:0 0 0 30px; font-family:"KBFGDisplayL"; font-size:13px; text-align:left; line-height:18px;}
.mes-noneData.t2 .txt-num3 li span:first-of-type {font-family:"KBFGDisplayM";}

.btn-area #btn-main{width:100%}

/* 로그인 메시지 */
.mes-login {position:relative; margin:50px 0 40px 0; padding:85px 0 0; font-size:20px; color:#222; text-align:center; line-height:30px;}
.mes-login:before {content:""; display:block; position:absolute; top:0; left:50%; width:66px; height:66px; background:url(../images/comm/ico-proof.png) no-repeat; background-size:300px 300px; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.mes-login.ico1:before {background-position:0 -122px;} /* 공인인증 사용 */
.mes-login.ico2:before {background-position:0 -56px;} /* 공인인증 미등록 */
.mes-login.ico3:before {background-position:-66px -122px;} /* 지문인증 사용 */
.mes-login.ico4:before {background-position:-66px -56px;} /* 지문인증 미등록 */
.mes-login.ico5:before {background-position:-132px -122px;} /* 홍채인증 사용 */
.mes-login.ico6:before {background-position:-132px -56px;} /* 홍채인증 미등록 */

/* 스마트안내장 메시지 */
.mes-sinfo {position:relative; margin:50px 48px 20px; font-size:16px; color:#222; line-height:24px;}
.mes-sinfo .sub {margin:5px 0 0 0; font-size:14px; line-height:20px; word-break:keep-all;}
.mes-sinfo .sub em {color:#f46600;}

/* app 설치 안내 */
.mes-app-info {position:relative; margin:0 0 60px 0; padding:115px 0 0; font-size:20px; line-height:30px; color:#222; text-align:center;}
.mes-app-info::before {content:''; display:block; position:absolute; top:0; left:50%; width:84px; height:84px; background:url(../images/comm/icon-app.png) 0 0 no-repeat; background-size:100%; -webkit-transform:translateX(-50%); transform:translateX(-50%);}
.mes-app-info .sub {display:block; margin:25px 0 0; font-size:14px; line-height:20px; text-align:left; word-break:keep-all;}


/*******************************/
/***** 텍스트 :기타 				    *****/
/*******************************/
/* 정보 */
.txt-info {width:100%; display:flex; flex-wrap:wrap;}
.txt-info:after {content:""; display:block; clear:both;}
.txt-info dt:not(.sub) {width:35%; font-size:12px; color:#666; text-align:left;}
.txt-info.set-info dt {font-size:14px;}
.txt-info dd:not(.sub) {width:65%; font-size:14px; color:#222; text-align:right; font-family:"KBFGDisplayM";}
.txt-info dd strong {font-family:"KBFGDisplayB";}
.txt-info input.text {font-size:14px; color:#666;}
.txt-info .sub {width:auto; text-align:right; color:#666; font-size:12px;}
.txt-info dt.sub {margin:0 5px 0 auto;}

/* dd에 버튼이 오는 경우 */
.txt-info dd.pro-state {line-height:24px;}
.txt-info dd.pro-state span {line-height:22px; padding-top:1px;}

/* 정보 상세보기 */
.txt-info + .detail {display:none; margin:28px -18px -15px; padding:30px 18px; border-top:1px solid #eee; background:#fafafa;}
.txt-info + .detail.active {display:block;}
.detail .txt-cont {margin-top:15px; font-size:13px;}

/* 상세보기 (상품별 대출가능금액 확인) */
.form-area2 .detail {display:none; margin:28px -19px -15px; padding:30px 18px; border-top:1px solid #e8e5dc; background:#e8e5dc;}
.form-area2 .detail.active {display:block;}

/* 타이틀을 숨기는 정보 */
dl.hide-tit {position:relative;}
dl.hide-tit dt {position:absolute; top:0; left:0; width:0; height:0; font-size:0; opacity:0; overflow:hidden;}

/* 공인인증서 리스트 */
.txt-info.certificate-info {position:relative; padding:0 0 0 56px;}
.txt-info.certificate-info:before {content:""; display:block; position:absolute; top:50%; left:0; width:38px; height:42px; background:url(../images/comm/ico-proof.png) 0 -188px no-repeat; background-size:300px 300px; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.txt-info.certificate-info.icon-arrow:after {content:""; display:block; position:absolute; top:50%; right:50px; width:8px; height:8px; border:1px solid transparent; border-top-color:#666; border-left-color:#666; border-radius: 1px; -webkit-transform: translateY(-50%) rotate(135deg); transform: translateY(-50%) rotate(135deg); -webkit-transform-origin: center; transform-origin: center}
.txt-info.certificate-info dt {font-size:0; line-height:0; width:100%;}
.txt-info.certificate-info dd {width:100%; font-family:'KBFGDisplayL'; font-size:12px; color:#666; text-align:left;}
.txt-info.certificate-info dd:first-of-type {font-family:'KBFGDisplayM'; font-size:13px; color:#222;}
.txt-info.certificate-info dd em {font-family:'KBFGDisplayM'; font-weight:normal;}

/* 완료페이지 하단 정보 */
.info-comp {padding:30px 19px; text-align:center;}
.info-comp > dl {text-align:left;}
.info-comp > dl dt {color:#222; font-size:16px; font-family:"KBFGDisplayM";}
.info-comp > dl dd.last {color:#666; font-size:12px;}
.info-comp > [class^="tbl-"] .wcol1 {width:120px;}
.info-comp > dl + .link-com, .info-comp > .tbl-data + .link-com {margin:19px 29px 0;}
.info-comp > .tit-sub1:first-child {margin-top:0;}

/* 상기 내용 확인 문구 */
.txt-above {padding-top:10px;}
.txt-above .txt {font-size:13px; font-family:"KBFGDisplayM"; color:#222}
.txt-above .txt-bul1 {font-size:12px;}
.txt-above .date {padding-top:10px; font-size:13px; text-align:right; font-family:"KBFGDisplayM"; color:#222}

/* 완료화면 다건 처리결과 */
.payin-result li {margin-top:10px; padding:17px 20px;}
.payin-result li.comp {background:#f1fcf4;}
.payin-result li.fail {background:#fff9f6;}
.payin-result li dl:after {content:''; display:block; clear:both;}
.payin-result li dl dt {position:relative; float:left; width:100px; padding-left:28px;}
.payin-result li dl dt:after {content:''; position:absolute; top:0; left:0; width:21px; height:21px; background:url(../images/comm/ico-set.png) no-repeat 0 0; background-size:300px;}
.payin-result li.comp dl dt:after {background-position:-140px -20px;}
.payin-result li.fail dl dt:after {background-position:-161px -20px;}
.payin-result li dl dd {float:right; width:calc(100% - 100px);}
.payin-result li dl dt, .payin-result li dl dd p {color:#222; font-family:"KBFGDisplayM";}
.payin-result li dl dd + dd {margin-top:10px;}
.payin-result li dl dd p.err {font-size:12px; color:#666; font-family:"KBFGDisplayL";}


/*******************************/
/***** 텍스트 :블릿 				    *****/
/*******************************/
/* 블릿 타입1, 2, 3 공통 */
[class*="txt-bul"]:not(ul):not(ol):not(dl), [class*="txt-bul"] > li, .txt-bul1 > dt {position:relative; padding:0 0 0 10px; word-break:keep-all;}
[class*="txt-bul"]:not(ul):not(ol):not(dl):before, [class*="txt-bul"] > li:before, .txt-bul1 > dt:before {content:""; display:block; position:absolute; top:2px; left:0;}
[class*="txt-bul"] [class*="txt-bul"]:not(ul):not(ol):not(dl), [class*="txt-bul"] [class*="txt-bul"] > li,
[class*="txt-num"] [class*="txt-bul"]:not(ul):not(ol):not(dl), [class*="txt-num"] [class*="txt-bul"] > li,
[class*="txt-bul"] [class*="txt-num"]:not(ul):not(ol):not(dl), [class*="txt-bul"] [class*="txt-num"] > li,
[class*="txt-num"] [class*="txt-num"]:not(ul):not(ol):not(dl), [class*="txt-num"] [class*="txt-num"] > li {font-size:12px; color:#666;}

/* 블릿 타입1 */
.txt-bul1:not(ul):not(ol):not(dl):before, .txt-bul1 > li:before, .txt-bul1 > dt:before {top:7px; width:3px; height:3px; background:#222; border-radius:50%;}
.txt-bul1.txt-c2:not(ul):not(ol):not(dl):before, .txt-bul1.txt-c2 > li:before, .txt-bul1.txt-c2 > dt:before {background:#666;}
dl.txt-bul1 dt {display:block; font-family:'KBFGDisplayM';}
dl.txt-bul1 dt:not(:first-child) {margin-top:20px;}
dl.txt-bul1 dd {padding-left:10px; color:#666;}
.mes-comp > .txt-bul1 {font-size:14px; line-height:20px;}
.tbl-data + .txt-bul1 {margin-top:10px;}

/* 블릿 타입2 */
.txt-bul2:not(ul):not(ol):not(dl), .txt-bul2 > li {margin-bottom:4px; padding:0 0 0 16px;}
.txt-bul2:not(ul):not(ol):not(dl):before, .txt-bul2 > li:before {content:'※'; top:0;}

/* 블릿 타입3 */
.txt-bul3:not(ul):not(ol):not(dl):before, .txt-bul3 > li:before {content:'-';}

/* 블릿 타입4 */
.txt-bul4:not(ul):not(ol):not(dl), .txt-bul4 > li, .txt-bul4 > dt {position:relative; margin-top:10px; padding:0 0 0 12px;}
.txt-bul4:not(ul):not(ol):not(dl):before, .txt-bul4 > li:before, .txt-bul4 > dt:before {content:""; display:block; position:absolute; top:5px; left:0; width:8px; height:8px; background:#cec5b6;}
.txt-bul4 > dt {font-family:"KBFGDisplayM";}
.txt-bul4 > dt:not(:first-of-type) {margin-top:10px;}
.txt-bul4 > dd {position:relative; padding:0 0 0 12px;}
.txt-bul4 > dd:before {content:""; display:block; position:absolute; top:2px; left:0;}
.txt-bul4 > dd.t1:before {top:7px; width:3px; height:3px; background:#222; border-radius:50%;}
.txt-bul4 > dd.t2:before {content:"-";}

/* 블릿 타입5 (얼럿) */
.txt-alt1:not(ul):not(ol):not(dl), .txt-alt1 > li, .txt-alt1 > dt {position:relative; padding:0 0 0 18px; font-size:13px; word-break:keep-all;}
.txt-alt1:not(ul):not(ol):not(dl):before, .txt-alt1 > li:before, .txt-alt1 > dt:before {content:""; display:block; position:absolute; top:3px; left:0; width:12px; height:12px; background:url(../images/comm/ico-set.png) -24px -167px no-repeat; background-size:300px;}

/* 넘버 텍스트 .txt-num :1. / .txt-num2 :(1), .txt-num3 :숫자 직접입력 */
[class*="txt-num"]:not(.txt-num3) {counter-reset:num;}
[class*="txt-num"] > li {position:relative; margin:5px 0 0; padding:0 0 0 15px; line-height:17px;}
[class*="txt-num"]:not(.txt-num3) > li:before {counter-increment:num; position:absolute; left:0;}
.txt-num1 > li:before {content:counter(num)".";}
.txt-num2 > li, .txt-num3 > li {padding:0 0 0 20px; word-break:break-all;}
.txt-num2 > li:before {content:"("counter(num)")";}
.txt-num3 > li > span:first-of-type {position:absolute; top:0; left:0; line-height:17px;}

/* 불릿에 타이틀이 있을 때 */
.tit-bul {margin:24px 0 5px; font-size:13px; color:#222; font-family:"KBFGDisplayM";}

/* 불릿 내에 예시(박스)가 있는 경우 */
.bul-sample {margin:10px 0 15px; padding:20px 20px; background:#fffaec;}
.bul-sample.c1 {background:#fafafa;}
.bul-sample .tit-bul {display:block; margin:0 0 5px; color:#967a4c;}
.bul-sample .tit-sub2 {margin-bottom:10px;}
.bul-sample .tit-sub2:first-child {margin-top:0px;}
.bul-sample div.tit-sub2 > h2, .bul-sample div.tit-sub2 > h3, .bul-sample div.tit-sub2 > h4 {color:#222;}

/* 불릿 내에 예시 내용 설명일 경우 .txt-info */
.bul-sample .txt-info dt, .bul-sample .txt-info dd {width:100%;}
.bul-sample .txt-info dt {color:#222; font-size:14px; font-family:"KBFGDisplayM";}
.bul-sample .txt-info dt:not(:first-of-type) {margin-top:20px;}
.bul-sample .txt-info dd {font-family:"KBFGDisplayL"; text-align:left;}

/*******************************/
/***** 박스 등 영역			    *****/
/*******************************/
/* 메인 */
.area-maintop {padding:100px 48px 50px;}
.area-maintop .mes-t1 {font-size:24px; line-height:34px;}
.area-maintop .btn-com {background-color:#60584c;}
.main-bottom {flex:auto; position:relative; padding:50px 48px; background:#ffde33; color:#fff;}

.area-maintop.t2 {padding:100px 48px 50px;}
.area-maintop.t2 .mes-t1 {font-size:16px; line-height:24px;}
.area-maintop.t2 .mes-t1 span {display:block;}
.area-maintop.t2 .mes-t1 em {display:inline-block; position:relative; margin-top:10px; padding-right:40px; font-size:30px; color:#222; font-family:"KBFGDisplayM"; line-height:34px;}
.area-maintop.t2 .mes-t1 em:after {content:''; position:absolute; top:-3px; right:0; width:40px; height:40px; background:url(../images/comm/clipart-set.png) no-repeat; background-size:400px auto;}
.area-maintop.t2 .mes-t1.ico1 em:after {background-position:-40px 0;}

.area-subtop {position:relative; margin:-50px 0 0; padding:80px 48px 30px; text-align:center;}
.area-subtop::after {content:""; display:block; position:absolute; top:0; bottom:0; left:-50%; width:200%; background:#ffde33; z-index:-1;}
.area-subtop.no-pt {padding-top:30px;}
.conts-tab .area-subtop {margin:10px 0 0; padding:40px 38px;}
.conts-tab .area-subtop::after {z-index:0;}
.conts-tab .area-subtop > .info-sum {margin:0 auto; z-index:1;}
.conts-tab .area-subtop > .info-sum dl {min-width:100px;}

.area-subtop.t2 {padding:70px 20px 20px; text-align:left;}
.area-subtop.t2 > .tit-sub1 {margin:0; padding:0 0 0 52px; font-family:'KBFGDisplayL'; font-size:15px; line-height:20px;}
.area-subtop.t2 > .tit-sub1::before {content:""; position:absolute; top:50%; left:14px; margin-top:-17px; width:28px; height:33px; background:url(../images/comm/ico-cs.png) no-repeat; background-size:300px 300px;}
.area-subtop.t2 > .tit-sub1.ico1::before {background-position:0px -150px;}
.area-subtop.t2 > .tit-sub1.ico2::before {background-position:-28px -150px;}

.area-subtop2 {position:relative; padding:70px 18px 20px;}
.area-subtop2 .tit-sub1 {margin:0;}
.area-subtop2 + section > .list-item.card, .area-subtop2 + section > .list-item.card > li:only-child {margin:0;}

/* 무조건 젤 하단에 붙는 영역 */
.bottom-area {margin-top:auto; background:#fff;}
.bottom-area + .bottom-area, .all-agree + .bottom-area {margin-top:0;}
section.bottom-area:last-of-type, div.bottom-area:last-of-type {margin-bottom:-40px;}
.pop-body .bottom-area {margin:auto -19px -40px;}
.bottom-area.fixed {position: fixed;  width: 100%; left:0; bottom:40px;} /* 20191031 add */ 
.main_fixed {height:calc(100% - 58px); min-height:100%; padding:0 0 58px 0; overflow: hidden;} /* 20191101 add */
.cont_fixed {overflow-y:auto; z-index: 900;} /* 20191101 add */

/* 박스 */
.box {position:relative; padding:20px;}
.box.t1 {background:#f7f3e8;}
.box.t2 {min-height:376px; background:#fff;/* border-radius:6px;*/}
.box.t3 {/*min-height:280px;*/ background:#fff; border-radius:0 6px;}
.box.t4 {background:#fbf8ee;}
.box.t5 {background:#fff; border-radius:6px;}
.box.t6 {padding:0; line-height:0; border-radius:0 10px; overflow:hidden;}

.box .box-header {position:relative; padding:0 10px; height:40px; font-size:15px; color:#222; line-height:32px;}
.box .box-header:after {content:""; display:block; position:absolute; bottom:0; left:0; width:100%; height:1px; background:url(../images/comm/bg-dot2.gif) repeat-x; background-size:3px auto;}
.box .box-body {padding-top:20px;}

/* 완료 페이지 영역 */
.page-comp section:first-child {padding:50px 48px;}
.page-comp section:last-child:not(:first-child) {margin-top:auto; background:#fff;}
.page-comp section.bottom-area .list-item {margin-bottom:0;}
.page-comp .txt-bul2 {margin-top:45px;}
.page-comp .fs13.txt-bul2 {line-height:1.5;}

/* 검색 영역 */
.search-area1 {position:relative; padding:30px 19px 25px; background:#eeeeee; z-index:1;}
.search-area1 .wrap-search {position:relative; height:40px; padding:0; border-radius:0 10px; background:#fff;}
.search-area1 .wrap-search input {width:100%; height:40px; padding:0 46px 0 20px; line-height:20px; background:transparent;}
.search-area1 .wrap-search .btn-search {position:absolute; top:0; right:10px; width:40px; height:40px; text-indent:-9999px; background:transparent;}
.search-area1 .wrap-search .btn-search::before, .search-area1 .wrap-search .btn-search::after {content:""; display:block; position:absolute;}
.search-area1 .wrap-search .btn-search::before {top:8px; left:8px; width:15px; height:15px; border:2px solid #666; border-radius:50%; background:transparent;}
.search-area1 .wrap-search .btn-search::after {top:26px; left:22px; width:8px; height:2px; border-radius:1px; background:#666; -webkit-transform:rotate(45deg); transform:rotate(45deg);}
.search-area1 .keyword {display:block; height:18px; margin:8px 0 0; font-size:12px; overflow:hidden;}
.search-area1 .keyword dt, .search-area1 .keyword dd {display:inline-block; color:#666;}
.search-area1 .keyword a {color:#666; line-height:16px;}

/* 배너 영역 */
.conts-banner1 {display:block; position:relative; padding:30px 20px 30px 75px; font-size:14px; color:#222; background:#f7f3e8;}
.conts-banner1:before {content:""; display:block; position:absolute; top:50%; left:24px; width:40px; height:40px; background:url(../images/comm/clipart-set.png) no-repeat; background-size:400px auto; transform:translateY(-50%);}
.conts-banner1 .link-txt {margin:0; font-size:12px; color:#f46600; line-height:24px;}
.conts-banner1 .link-txt:after {right:2px; margin:-1px 0 0 0; width:6px; height:6px; border-top-color:#f46600; border-left-color:#f46600;}
.conts-banner1.ico1:before {background-position:0 0;}

.conts-banner2 {display:block; position:relative; padding:15px 29px; font-size:15px; color:#666; background:#ffde33; border-radius:0 6px;}
.conts-banner2.c1 {background:#febe0e;}
.conts-banner2:after {content:""; display:block; position:absolute; top:50%; right:20px; width:8px; height:8px; border:1px solid transparent; border-top-color:#fff; border-left-color:#fff; -webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg);}
.conts-banner2 span {display:inline-block; position:relative; margin-top:12px; width:100%; font-family:'KBFGDisplayM'; font-size:18px; color:#222;}

.conts-banner2 span:before, .conts-banner2 span:after {content:""; display:block; position:absolute; top:50%; right:15px; margin-top:-16px; width:48px; height:48px; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.conts-banner2 span:after {background:rgba(255,255,255,.8); border-radius:50%;} 
.conts-banner2 span.ico1:before {background:url(../images/comm/clipart-set2.png) -100px 0 no-repeat; background-size:300px auto; z-index:1;}
.conts-banner2 span.ico2:before {background:url(../images/comm/clipart-set2.png) -148px 0 no-repeat; background-size:300px auto; z-index:1;}
 
.conts-banner3 {display:block; position:relative; padding:5px 0px 5px 60px; font-size:16px; color:#222;}
.conts-banner3:before {content:""; display:block; position:absolute; top:10px; left:0px; width:45px; height:45px; background:url(../images/comm/ico-prd.png) no-repeat; background-size:400px 400px;}
.conts-banner3.ico1:before {background-position:0 -70px;}
.conts-banner3 .ans {font-size:14px;}
.conts-banner3 .sub {margin-top:5px; font-size:13px; line-height:16px;}

.box-banner {display:block; position:relative; padding:25px 29px; background:#fff; border-radius:6px;}
.box-banner > dl dt {margin:0 0 8px 0; font-family:"KBFGDisplayM"; font-size:14px; color:#222;}
.box-banner > dl dd {font-family:"KBFGDisplayL"; font-size:13px; color:#666;}

/* 첨부파일 영역 */
.addfile-box ul {overflow:hidden;}
.addfile-box li {width:100%; border-bottom:1px solid rgba(204,204,204,0.5);}
.addfile-box li .item {position:relative; padding:15px 50px 15px 25px;}
.addfile-box li .item:before {content:""; display:inline-block; position:absolute; top:15px; left:0px; width:20px; height:20px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px; background-position:-40px -40px; vertical-align:top;}
.addfile-box li .item .sub {margin-bottom:5px; font-size:14px; color:#222;}
.addfile-box li .item a {display:block; position:absolute; top:50%; right:0%; margin-top:-20px; width:40px; height:40px;}
.addfile-box li .item a:before {content:""; position:absolute; top:10px; left:20px; width:1px; height:20px; background:#666; transform:rotate(45deg);}
.addfile-box li .item a:after {content:""; position:absolute; top:10px; left:20px; width:1px; height:20px; background:#666; transform:rotate(-45deg);}
.addfile-box > .txt {margin-top:10px; color:#777; text-align:right;}

.addfile-box.ab-img ul {margin-left:-1px; padding:20px 0; border-bottom:1px solid #cccccc;}
.addfile-box.ab-img li {float:left; width:calc(50% - 1px); margin-left:1px; margin-bottom:1px; padding:0; border-bottom:none;}
.addfile-box.ab-img li .item {width:100%; padding:0; padding-bottom:63.82%; background:url(../images/comm/default-image.png) 50% 0 no-repeat #fff; background-size:cover; border:1px solid #ffde33; overflow:hidden;}
.addfile-box.ab-img li .item:before {content:""; display:none; position:static;}
.addfile-box.ab-img li .item img {display:block; position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%,-50%);}
.addfile-box.ab-img li .item a {top:0%; right:0%; margin-top:0px; width:40px; height:40px;}

/* 텍스트 아이콘만 있는 영역 (리스트 상단 필터) */
.list-tag {padding:20px 19px; text-align:center;}
.list-tag .icon-txt1 {min-width:75px; margin:9px 5px 0 0;}


/******************************/
/***** 테이블 						        ****/
/******************************/
/* 테이블 기본형 */
.tbl-data {position:relative;}
.tbl-data.scroll {overflow-x:hidden;}
.tbl-data.scroll .scroll-wrap {overflow-x:auto;}
.tbl-data table {width:100%; font-size:13px; color:#222; background-color:transparent; border-bottom:1px solid #eee; table-layout:fixed;}
.tbl-data.scroll table {width:auto; white-space:nowrap; table-layout:auto;} 
table caption {top:0; left:0; width:0; height:0; text-align:left; font-size:0; opacity:0; overflow:hidden; text-indent:-999px;}
.tbl-data th, .tbl-data td {padding:8px 10px; color:#222; line-height:20px; background-color:#fff; border-top:1px solid #eee;}
.tbl-data th {font-family:"KBFGDisplayM"; background:#f6f6f6;}
.tbl-data th .sub {font-family:"KBFGDisplayL"; font-size:12px;}
.tbl-data thead th {position:relative; padding:12px 10px; font-size:14px; text-align:center; vertical-align:middle; word-break:break-all;}
.tbl-data thead th + th:before {content:""; position:absolute; top:50%; left:0; width:1px; height:11px; background:#ccc; transform:translateY(-50%);}
.tbl-data thead + tbody td {text-align:center;}
.tbl-data thead + tbody td + td {vertical-align:middle;}
.tbl-data tbody th {border-right:1px solid #eee; text-align:left; vertical-align:middle;}
.tbl-data tbody td {text-align:left; word-break:break-all; vertical-align:middle;}
.tbl-data table.txt-left thead + tbody td {text-align:left;}
.tbl-data table.txt-right tbody td {text-align:right !important;}
.tbl-data table.txt-center th, .tbl-data table.txt-center td {text-align:center;}

/* 테이블 테마 */
.tbl-data.c1 table {border-bottom-color:#dfdfdf;}
.tbl-data.c1 th, .tbl-data.c1 td {border-top-color:#dfdfdf;}
.tbl-data.c1 th {background:#dfdfdf;}

/* 테이블 내 텍스트 정보 */
.tbl-data td .tit {display:block; margin-bottom:4px; font-family:"KBFGDisplayM";}
.tbl-data td dl.txt-info dt, .tbl-data td dl.txt-info dd {font-size:12px; color:#222;}
.tbl-data td dl.txt-info.type1 dt {color:#666;}
.tbl-data td dl.txt-info.type1 dd {font-family:"KBFGDisplayL";}
.tbl-data td dl.txt-info.type2 dt, .tbl-data td dl.txt-info.type2 dd {color:#666;}

/* 셀 너비 */
[class^="tbl-"] .wcol1 {width:100px;}
[class^="tbl-"] .wcol2 {width:120px;}
[class^="tbl-"] .wcol3 {width:140px;}
[class^="tbl-"] .wcol4 {width:56px;}
[class^="tbl-"] .wcol5 {width:90px;}
[class^="tbl-"] .wcol30p {width:30%;}

/* 테이블 여백 */
.tit-sub2 + .tbl-data {margin-top:10px;}
.tbl-data + .tbl-data {margin-top:20px;}

.conts-area1 > .tbl-data.scroll {margin:0 -19px;}
.conts-area1 > .tbl-data.scroll .scroll-wrap {margin:0 19px;}


/******************************/
/***** 리스트 							  *****/
/******************************/
/* 정보 목록 */
.list-item {margin-bottom:10px;}
section:last-of-type .list-item {margin-bottom:30px;}
.list-item > li {position:relative; padding:30px 19px; background:#fff;}
.list-item > li + li {margin-top:1px;}
.list-item > li.none {text-align:center;}
.list-item > a, .list-item > li > a {display:block; position:relative;}
.list-item > li > a:only-child {margin:-30px -48px; padding:30px 48px;}
.list-item > li > a:not(:only-child) {margin:-30px -48px 0; padding:30px 48px 0;}
.list-item .icon-txt1 + .tit-sub1 {margin-top:10px;}
.list-item .tit-sub1 {margin-top:0;}
.list-item .tit-sub1 p {margin:4px 0 0; font-size:12px; color:#666;}
.list-item .tit-sub1 .sub2 {margin:0 0 4px; font-size:14px; color:#666;}

.list-item .tit-sub2:first-child {margin-top:0; margin-bottom:16px;}
.list-item .tit-sub2 .info {margin:4px 0 0;}
.list-item .tit-sub2 .info .txt {font-family:"KBFGDisplayM"; font-size:20px; color:#222; line-height:28px;}

.list-item .tit-sub3:first-child {margin-top:0; margin-bottom:16px;}

.list-item > li.check {padding:30px 49px;}
.list-item > li.check > .tit-sub1 .label-check {margin-left:-30px;}

/* 타이틀이 없는 목록 */
div.list-item.no-tit, .list-item.no-tit > li {padding:20px 19px; background:#fff;}
div.list-item.card.no-tit, .list-item.card.no-tit > li {padding:30px 19px;}
.list-item.no-tit > li + li {margin-top:1px;}
.list-item.no-tit > li.none {text-align:center;}

/* 목록에서 타이틀을 숨기는 정보가 있을때 */
.list-item li > .hide-tit {overflow:hidden;}
.list-item li > .hide-tit dd {width:50%; float:left; font-family:"KBFGDisplayM"; font-size:13px; color:#222;}
.list-item li > .hide-tit dd:nth-of-type(even) {text-align:right;}
.list-item li > .hide-tit dd.last {width:100%; text-align:right; color:#222;}

/* 카드형 (아이템들 사이 간격이 좀 더 넓은게 다름) */
.list-item.card > li {margin-top:10px;}
.list-item.card > li:first-child {margin-top:0;}
.list-item.card > li > .btn-area .btn-icon.ico-more {right:-8px;}
.list-item.card .form-area {display:none;}
.list-item.card .form-area.active {display:block;}
.list-item.card .form-area .btn-com {height:40px; line-height:20px; font-size:12px;}
.list-item.card .form-area .btn-com.deact {background:#ccc;}

.list-item.card .link {color:#666; font-size:12px; padding-right:90px; position:relative;}
.list-item.card .link:before, .list-item.card .link:after {content:""; display:block; position:absolute; top:50%; right:42px; width:1px; height:7px; border-radius:1px; background:#bbb; transform-origin:center;}
.list-item.card .link:before {margin-top:-1px; transform:rotate(45deg);}
.list-item.card .link:after {margin-top:-6px; transform:rotate(-45deg);}
.list-item.card .link .tit {display:block; color:#333; font-family:"KBFGDisplayM"; font-size:14px;}

/* 체크박스 있는 목록 */
/*.list-item > li.check .label-check {margin-left:-30px;}*/
.list-item > li.check .label-check label {padding-right:0;}

/* 타이틀 없이 체크박스 있는 목록 */
.list-item.item-chk > li.check {padding-left:48px;}
.list-item.item-chk > li.check .label-check {position:absolute; top:20px; left:19px; margin-left:0;}
.list-item.item-chk > li.check .label-check span {width:0; height:20px; overflow:hidden; font-size:0; line-height:0;}

/* 하나만 있는거 */
div.list-item.card {position:relative; padding:30px 29px; margin:0; background:#fff;}
div.list-item.card > a:only-child {margin:-30px -29px; padding:30px 29px;}

.list-item.card.t2 {margin:0 19px;}
.list-item.card.t2:not(ul):not(ol), .list-item.card.t2 > li {padding:29px; border-radius:0 6px 0 6px;}
.list-item.card.t2 > li > a {display:block; position:relative; margin:-29px; padding:29px;}
.list-item.card.t2 > li > a:after {content:""; display:block; position:absolute; top:31px; right:21px; width:8px; height:8px; border:1px solid transparent; border-top-color:#bbb; border-left-color:#bbb; -webkit-transform:rotate(135deg); transform:rotate(135deg);}
.list-item.card.t2 .txt-info {display:block;}
.list-item.card.t2 .txt-info dt, .list-item.card.t2 .txt-info dd {font-family:'KBFGDisplayL'; font-size:13px; color:#666;}
.list-item.card.t2 .txt-info dt {width:100%; font-family:'KBFGDisplayM';}
.list-item.card.t2 .txt-info dd {float:left; width:auto;}
.list-item.card.t2 .txt-info dd + dd:not(:last-child):before {content:', '; display:inlin-block;}
.list-item.card.t2 .txt-info dd.sum {float:right; color:#222;}
.list-item.card.t2 .txt-info dd.sum em {font-size:20px; font-family:'KBFGDisplayM';}

.list-item.card.t3 > li {padding:24px 19px;}
.list-item.card.t3 > li .txt-info.certificate-info {margin:0 29px;}
 
/* 자세히보기/상세보기 있는 목록 */
.list-item.card.t3 div.tit-sub1 > h2, 
.list-item.card.t3 div.tit-sub1 > h3, 
.list-item.card.t3 div.tit-sub1 > h4 {font-family:"KBFGDisplayL";}

.list-item > li.more a {display:block; position:relative; padding-right:60px;}
.list-item > li.more a:after {content:''; display:block; position:absolute; top:50%; right:21px; width:8px; height:8px; border:1px solid transparent; border-top-color:#bbb; border-left-color:#bbb; -webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg);}
.list-item.card.t2 .txt-info {display:block;}

/* 1줄짜리 2단 카드형 */
.list-item.card.t4 {display:flex; padding:0;}
.list-item.card.t4 > li {display:flex; flex-direction:column; float:left; width:calc(50% - 5px); margin-top:0; padding:30px 19px; border-radius:3px;}
.list-item.card.t4.c1 > li {background-color:#eee;}
.list-item.card.t4 > li:nth-child(even) {margin-left:10px;}
.list-item.card.t4 > li:nth-child(n+2) {margin-top:10;}
.list-item.card.t4 > li .tit-sub3 {word-break:break-word;}
.list-item.card.t4 > li .tit-sub3:first-child {margin-top:0; margin-bottom:5px; color:#222;}
.list-item.card.t4 > li .txt-info2 {margin-top:auto; padding-top:5px; font-size:13px; border-top:1px solid #ccc;}

/* 왼쪽에 라인 */
.list-item.card.t5 > li:after {content:''; position:absolute; top:0; left:0; width:6px; height:100%; background-color:#97c8f9;;}
.list-item.card.t5 > li:nth-child(even):after {background-color:#d4c8ed;}

/* 목록에 오른쪽 이미지 있을 때 : KB금융그룹 - 국민카드 보유카드 조회 리스트 */
.list-item.img-right > li {padding:30px 130px 30px 19px;}
.list-item.img-right > li .th {display:block; position:absolute; bottom:30px; right:19px; width:106px; height:65px; background:#eee; border-radius:3px; overflow:hidden;}
.list-item.img-right > li .th img {width:100%;}
.list-item.img-right > li dt {width:60px;}
.list-item.img-right > li dd {width:calc(100% - 60px); text-align:left;}

/* 목록에 왼쪽 이미지 있을 때 : 이벤트 */
.list-item.img-left > li {display:flex; flex-direction:column; padding:20px 19px 20px 180px; min-height:125px;}
.list-item.img-left > li > a {display:block; position:relative; margin:0 0 0 -180px; padding:0 0 0 180px; min-height:85px;}
.list-item.img-left > li + li {margin-top:10px;}
.list-item.img-left > li .th {display:block; position:absolute; top:50%; left:19px;width:150px; height:85px; background:#eee; overflow:hidden; transform:translateY(-50%);}
.list-item.img-left > li .th img {width:100%; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);}
.list-item.img-left > li .tit-sub2 {margin-top:0}
.list-item.img-left > li .tit-sub2 h3, .list-item.img-left > li .tit-sub2 h4, .list-item.img-left > li .tit-sub2:not(div) {color:#222;}
.list-item.img-left > li .info-post {position:relative; margin-top:auto;}
.list-item.img-left > li .info-post .inq {position:relative; margin-left:5px; padding-left:10px;}
.list-item.img-left > li .info-post .inq:before {content:''; position:absolute; left:0; top:50%; margin-top:-5px; width:1px; height:10px; background:#666;}

/* 상단 보험목록 영역(노란색 배경) */
.items-wrap {background-color:#ffde33; margin:-50px 0 0 0; padding:69px 19px 40px;}
.items-wrap .list-item.card:not(:first-child) {margin-top:10px;}

/* 링크 목록 ( 한줄짜리 ) */
.list-link li + li {margin-top:10px;}
.list-link li a {display:block; position:relative; padding:15px 40px 15px 29px; background:#fff; line-height:30px; font-size:16px; color:#222;}
.list-link li a::after {content:""; display:block; position:absolute; top:50%; right:28px; width:8px; height:8px; border:1px solid transparent; border-top-color:#bbb; border-left-color:#bbb; border-radius:1px; -webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg); -wewbkit-transform-origin:center; transform-origin:center;}
.list-link li a:not(.btn-toggle):active, .list-link li a:not(.btn-toggle):focus {background:#ffde33;}
.list-link li a:not(.btn-toggle):active::after, .list-link li a:not(.btn-toggle):focus::after {border-top-color:#fff; border-left-color:#fff;}
.list-link li a.btn-toggle::after {margin-top:-3px; -webkit-transform:translateY(-50%) rotate(-135deg); transform:translateY(-50%) rotate(-135deg);}
.list-link li a.btn-toggle.active::after {margin-top:3px; -webkit-transform:translateY(-50%) rotate(45deg); transform:translateY(-50%) rotate(45deg);}
.list-link li a.btn-toggle + .toggle-cont {display:none;}
.list-link li a.btn-toggle.active + .toggle-cont {display:block;}

.list-link.t2 li + li {margin-top:1px;}
.list-link.t2 li a {font-size:14px;}

/* 박스형 */
.list-box1 {display:flex;}
.list-box1 li {flex-grow:1; padding:30px 0; border:solid #eee; border-width:1px 1px 1px 0; text-align:center; font-size:12px; line-height:20px;}
.list-box1 li:first-child {border-left-width:1px;}
.list-box1 li strong {display:block; font-size:14px; font-family:"KBFGDisplayB";}
.list-box1 li[class^="ico"] {padding-top:25px;}
.list-box1 li[class^="ico"]:before {content:""; display:block; position:relative; width:30px; height:30px; margin:0 auto 2px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px;}
.list-box1 li.ico1:before {background-position:0 -80px;}
.list-box1 li.ico2:before {background-position:-30px -80px;}
.list-box1 li.ico3:before {background-position:-60px -80px;}

/* 고객안내사항 박스 */
.exlst .item {position:relative; margin-top:10px; padding:20px 20px; background:#eee;}
.exlst .item:before {content:""; position:absolute; left:119px; top:20px; width:1px; height:calc(100% - 40px); background:#fff;}
.exlst .item:after {content:""; display:block; clear:both;}
.exlst .item .tit {float:left; width:100px; padding:0 10px 0 0; border-bottom:0; background:transparent; color:#222; line-height:normal; font-size:14px;}
.exlst .item .desc {float:left; width:calc(100% - 100px); padding-left:10px;} 

/* 신청내역 조회 */
.list-request li .tit-sub1 {margin:30px 0 10px !important; font-size:14px;}
.list-request li:first-child .tit-sub1 {margin-top:0 !important;}

/* 검색결과 */
.search-result1 {margin:0px 0px 50px; padding-top:20px;}
.search-result1 p.sub {padding:0 48px 20px; font-size:12px; color:#222; text-align:right;}
.list-search li {padding:26px 48px; background:#fff;}
.list-search li:after {content:""; display:block; clear:both;}
.list-search li + li {margin-top:1px;}

/* 계좌조회 */
.search-result1 .list-search li > .hide-tit dd {width:50%; float:left; font-family:"KBFGDisplayM"; font-size:13px;}
.search-result1 .list-search li > .hide-tit dd:nth-of-type(odd) {color:#666;}
.search-result1 .list-search li > .hide-tit dd:nth-of-type(even) {text-align:right; color:#222;}
.search-result1 .list-search li > .hide-tit dd:nth-of-type(odd):last-of-type {width:100%; text-align:right; color:#222;}

.search-result1 .list-search li > .hide-tit.t1 dd {width:50%; float:left; font-family:"KBFGDisplayM"; font-size:13px; color:#222;}
.search-result1 .list-search li > .hide-tit.t1 dd:nth-of-type(1),
.search-result1 .list-search li > .hide-tit.t1 dd:nth-of-type(2) {color:#666;}
.search-result1 .list-search li > .hide-tit.t1 dd.last {width:100%; text-align:right;}
.search-result1 .list-search li > .hide-tit.t1 dd:last-of-type {color:#666;}

/* 조회내역이 없을 경우 */
.no-result {margin:30px auto; text-align:center; color:#666;}
.no-result:before {content:""; display:block; margin:12px auto 20px; width:65px; height:65px; background:url(../images/comm/clipart-set.png) no-repeat -325px -40px/400px auto;}

.no-result2 {margin:30px auto; text-align:center; color:#666;}
.no-result2:before {content:""; display:block; padding:0; margin:12px auto 20px; width:80px; height:80px; background:url(../images/comm/clipart-set.png) no-repeat 0 -495px/400px auto;}

/* 리스트 상세보기 */
.btn-area.list-btm {margin:15px -48px -30px; border-top:1px solid #eee;}
.btn-area.list-btm > .btn-sub {display:block; padding:13px; width:100%; height:auto; background:transparent; border:none;}
.btn-area.list-btm > .btn-sub > span {display:inline-block; position:relative; padding:0 20px 0 10px; height:24px; line-height:24px; border:1px solid #ffde33; border-radius:12px;}
.btn-area.list-btm > .btn-sub > span:after {right:10px;}

/* 순서가 있는 안내 */
.list-num1, .list-num2 {counter-reset:listnum;}
.list-num1 > li {position:relative; padding:17px 29px 17px 54px; background:#eee; font-size:12px; color:#222; line-height:20px; word-break:keep-all;}
.list-num1 > li + li, .list-num2 > li + li {margin-top:16px;}
.list-num1 > li:before {counter-increment:listnum; content:"0" counter(listnum); display:block; position:absolute; top:21px; left:19px; width:25px; border-right:1px solid #fff; color:#ffde33; line-height:12px;}
.list-num1 > li:nth-child(9) ~ li:before, .list-num2 > li:nth-child(9) ~ li:before {content:counter(listnum);}
.list-num1 > li:after, .list-num2 > li:after {content:""; display:block; position:absolute; bottom:-4px; left:50%; width:8px; height:8px; margin-left:-4px; background:#eee; transform:rotate(45deg);}
.list-num1 > li:last-child:after, .list-num2 > li:last-child:after {display:none;}
.list-num2 > li {position:relative; background:#fff; font-size:12px; color:#222; line-height:20px;}
.list-num2 > li a {display:block; position:relative; padding:17px 29px 17px 54px;}
.list-num2 > li a:before {counter-increment:listnum; content:"0" counter(listnum); display:block; position:absolute; top:21px; left:19px; width:25px; border-right:1px solid #fafafa; color:#ffde33; line-height:12px;}
.list-num2 > li:after {background:#fff;}
.list-num1 + p {margin:18px 0 0 0;}

/* 토글 리스트 */
.list-toggle {border-top:1px solid #eee;}
.list-toggle li .tit {display:block; position:relative; padding:20px 48px 20px 19px; border-bottom:1px solid #eee; background:#fff; color:#666; font-size:14px; line-height:20px;}
.list-toggle li a.tit:before {content:""; display:block; position:absolute; top:24px; right:30px; width:8px; height:8px; border:solid #bbb; border-width:0 1px 1px 0; transform:rotate(45deg); transform-origin:center;}
.list-toggle li a.tit.active:before {transform:rotate(-135deg);}
.list-toggle li .tit:not(a) {padding:10px 48px 10px 19px; line-height:0;}
.list-toggle li .tit:not(a) .btn-icon {position:absolute; top:10px; right:15px;}
.list-toggle li .tit.active:not(a) .btn-icon i {transform:rotate(-135deg);}
.list-toggle li .tit .tit-sub2 {margin:0 0 5px; font-family:'KBFGDisplayM'; color:#222;}
.list-toggle li .tit .tit-sub3 {margin:0 0 5px; font-family:'KBFGDisplayM'; color:#222;}

.list-toggle li .conts {display:none; padding:25px 19px; border-bottom:1px solid #eee; background:#fafafa; color:#666; line-height:20px; font-size:13px;}
.list-toggle li .tit.active + .conts {display:block;}
.list-toggle li .conts > .tit-sub3 {margin:30px 0 10px; font-family:'KBFGDisplayM'; color:#222;}
.list-toggle li .conts > .tit-sub3:first-child {margin-top:0px;} 
.list-toggle li .conts > .conts_file{margin-top:10px;}
.list-toggle li .conts > .conts_file .conts_file_title{display:inline-block; padding-right:10px; color:#666}
.list-toggle li .conts > .conts_file > a{text-decoration:underline}
.list-toggle .list-item {margin-bottom:0 !important;}
.list-toggle .list-item > li {padding:30px 25px;}

.list-toggle + .label-check {padding:0 19px;}

.list-toggle.c1 li .conts {background:#f4f1f7;}
.list-toggle.c2 li .conts {background:#e3e7f0;}

/* 링크 목록 메뉴 */
/* .list-menu {margin-top:50px;} */
.list-menu .tit-sub1 {margin:20px 0 15px; padding:0 20px;}
.list-menu .list-link li + li {margin-top:1px;}

/* 약관 목록 */
.list-agree {margin-top:10px;}
.list-agree > li {position:relative; padding:10px 19px; background:#fff;}
.list-agree > li + li {margin:1px 0;}
.list-agree > li > .label-check {display:block; position:relative;}
.list-agree > li > .label-check label {width:100%;}
.list-agree > li:first-child .label-check span {font-family:'KBFGDisplayM';}
.list-agree > li .label-check + .link-txt3 {position:absolute; top:50%; right:9px; padding:10px; font-size:12px; color:#666; -webkit-transform:translateY(-50%); transform:translateY(-50%);}
.list-agree > li.agree-cont {padding:30px 19px; background:#fafafa;}
.list-agree > li.agree-cont .tit-sub2 {font-size:14px;}
.list-agree > li.agree-cont .tit-sub2:first-child {margin:0;}
dl.terms > dt {margin:26px 0 0 0;}
dl.terms > dt:first-child {margin:18px 0 0 0;}

/* 약관 토글 목록 */
.list-agree.list-toggle > li .label-check {float:left; max-width:80%; z-index:9;}
.list-agree.list-toggle a.tit {position:relative; margin:-10px 0; padding:10px 19px; width:100%; background:transparent; border:none; z-index:1;}
.list-agree.list-toggle a.tit::before {right:10px;}
.list-agree.list-toggle a.tit span {display:inline-block; position:absolute; top:0; left:0; text-indent:-9999px;}
.list-agree.list-toggle > li:first-child .label-check span {font-family:"KBFGDisplayL";}
.list-agree.list-toggle > li .conts {margin:10px -19px -10px; border-top:1px solid #eee; border-bottom:none;}
.list-agree.list-toggle > li .conts.scroll {max-height:200px; overflow:hidden; overflow-y:auto;}
.list-agree.list-toggle > li .conts .fullText {word-break:break-all;}


/* 리스트 영역 - 청구방법 안내 */
.areawrap {counter-reset:listnum;}
.areawrap li.area {margin:0; padding:40px 19px;}
.areawrap li.area + li.area {border-top:1px solid #eee;}
.areawrap .area > .tit-sub1 { margin:0 0 20px;}
.areawrap .area > .tit-sub1:after {counter-increment:listnum; content:counter(listnum); display:block; position:absolute; top:50%; right:-19px; padding:0 8px; width:29px; height:24px; font-family:'KBFGDisplayB'; font-size:13px; color:#fff; line-height:24px; background:#febe0e; border-radius:12px 0 0 12px; -webkit-transform:translateY(-50%); transform:translateY(-50%);}


/******************************/
/***** 기타 영역					      *****/
/******************************/
/** swiper 슬라이더 **/
.swiper-pagination.t2 {top:-8px; bottom:auto; left:auto; right:0; width:auto; text-align:right;}
.swiper-pagination.t2 .swiper-pagination-bullet {margin:0 0 0 4px !important; width:6px; height:6px; background:#d9d4c9; border-radius:3px; opacity:1;}
.swiper-pagination.t2 .swiper-pagination-bullet-active {width:14px; background:#8c734b;}

.swiper-main {position:relative; margin:0 auto; width:100%; height:100%;}
.swiper-main:after {content:""; display:block; position:absolute; top:0; bottom:0; left:-19px; right:-19px; z-index:-1;}
.swiper-main .swiper-slide {overflow:hidden;}
.swiper-main > .swiper-pagination.t2 {top:92px; bottom:auto; left:44px; right:auto;}
.swiper-main > .swiper-pagination.t2 .swiper-pagination-bullet {background:#fff;}
.swiper-main > .swiper-pagination.t2 .swiper-pagination-bullet-active {background:#8c734b;}

.swiper-container {position:relative; margin:-50px auto 0; padding:70px 0 50px; width:calc(100% - 38px); height:auto; background:#ffde33; overflow:visible;}
.swiper-container:after {content:""; display:block; position:absolute; top:0; bottom:0; left:-19px; right:-19px; background:inherit;}
.swiper-slide:not(.swiper-slide-active) {opacity:0.8;}
.swiper-container .swiper-pagination {right:0; bottom:28px; width:auto; padding:0 5px; font-family:"KBFGDisplayB"; font-size:12px; color:#fff; text-align:right;}
.swiper-container2 {position:relative; margin:0 auto; padding:0 !important; width:100%; height:auto; background:transparent; overflow:hidden;}
.swiper-container3 {position:relative; margin:0 auto; padding:48px 0 50px; width:calc(100% - 38px); height:auto; overflow:visible;}
.swiper-container3:after {content:""; display:block; position:absolute; top:0; bottom:0; left:-19px; right:-19px; z-index:-1;}
.swiper-container3.c1:after {background:#bbe8e5;}
.swiper-container3.c2:after {background:#d1e6f4;}
.swiper-container3.c3:after {background:#e2ddf9;}
.swiper-container3 .tit-sub1 {margin:0 0 20px 0; padding:0 29px;}
.swiper-container3 .list-item.card.t2 .goods-info2 .tit-sub1 {margin:0 0 20px 0; padding:0px; line-height:normal;}
.swiper-container4 {position:relative; margin:0 auto; padding:48px 0 50px; width:calc(100% - 96px); height:auto; overflow:visible;}
.swiper-container4:after {content:""; display:block; position:absolute; top:0; bottom:0; left:-19px; right:-19px; z-index:-1;}
.swiper-container4 .thumb {position:relative; width:100%; padding-bottom:56.25%; overflow:hidden;}
.swiper-container4 .tit-sub3 h3, .swiper-container4 .tit-sub3 h4,
.swiper-container4 .tit-sub3:not(div) {font-family:"KBFGDisplayL"; color:#222;}
.swiper-container4 .thumb img {position:absolute; top:50%; left:50%; width:100%; height:auto; transform:translate(-50%, -50%);}
.swiper-container4 .swiper-pagination.t2 {top:40px; bottom:auto; left:0; right:auto;}
.swiper-imgContainer {position:relative; margin:16px 0;}
.swiper-imgContainer .swiper-slide {position:relative; height:80px; background:url(../images/comm/default-image.png) 50% 0 no-repeat; background-size:cover; overflow:hidden; pacity:1;}
.swiper-imgContainer .swiper-slide img {position:absolute; top:50%; left:50%; width:auto; min-width:100%; height:80px; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.swiper-container5 {position:relative;}

.swiper-button-prev, .swiper-button-next {margin-top:0; width:29px; height:60px; background:none; transform:translateY(-50%);}
.swiper-button-prev {left:0;}
.swiper-button-next {right:0;}
.swiper-button-prev:after, .swiper-button-next:after {content:''; position:absolute; top:50%; left:50%; width:9px; height:9px; margin-left:-6px; border:1px solid transparent; border-top-color:#666; border-left-color:#666; border-radius:1px; -wewbkit-transform-origin:center; transform-origin:center;}
.swiper-button-prev:after {-webkit-transform:translateY(-50%) rotate(-45deg); transform:translateY(-50%) rotate(-45deg);}
.swiper-button-next:after {-webkit-transform:translateY(-50%) rotate(135deg); transform:translateY(-50%) rotate(135deg);}

.swiper-slide .list-item .tit-sub1 {height:30px;}
.swiper-slide .list-item .tit-sub1 > h3 {width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.swiper-slide .list-item .tit-sub1.ellipsis > h3 {width:calc(100% - 25px);}
.swiper-slide .list-item .tit-sub1 .more {display:none; float:right; margin:5px 0 0 0; width:18px; height:18px; background:#fff; border:1px solid #ccc; border-radius:50%;}
.swiper-slide .list-item .tit-sub1 .pop {display:none; position:absolute; top:35px; right:-20px; padding:8px; width:75%; background:#fff; border: 1px solid #d7bd8a; border-radius:4px; -webkit-box-shadow:0 4px 10px rgba(0,0,0,.05); box-shadow:0 4px 10px rgba(0,0,0,.05); z-index:99;}
.swiper-slide .list-item .tit-sub1.ellipsis .more {display:inline-block; position:relative;}
.swiper-slide .list-item .tit-sub1.ellipsis .more span {display:block; position:absolute; top:50%; left:50%; width:2px; height:2px; text-indent:-9999px; background:#ccc; border-radius:50%; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.swiper-slide .list-item .tit-sub1.ellipsis .more span:before, .swiper-slide .list-item .tit-sub1.ellipsis .more span:after {content:""; display:block; position:absolute; top:0; left:0; width:2px; height:2px; background:#ccc; border-radius:50%;}
.swiper-slide .list-item .tit-sub1.ellipsis .more span:before {left:-3px;}
.swiper-slide .list-item .tit-sub1.ellipsis .more span:after {left:3px;}
.swiper-slide .list-item .tit-sub1.ellipsis .pop.active {display:block;}
.swiper-slide .list-item .tit-sub1.ellipsis .pop::before, .swiper-slide .list-item .tit-sub1.ellipsis .pop::after {content:""; display:block; position:absolute; width:0; height:0;}
.swiper-slide .list-item .tit-sub1.ellipsis .pop::before {top:-7px; right:20px; border-bottom:7px solid #d7bd8a; border-right:6px solid transparent;}
.swiper-slide .list-item .tit-sub1.ellipsis .pop::after {top:-5px; right:22px; border-bottom:5px solid #fff; border-right:3px solid transparent;}

/** 탭 **/
.tab-list1 {position:relative; display:flex; padding:0 19px; margin:0 -19px; border-bottom:1px solid #eee;}
.tab-list1 ul {display:flex; position:relative; padding:0 19px; width:100%; background:#fff; overflow-x:auto; z-index:1;}
.tab-list1 ul::after {content:''; display:inline-block; padding:0 19px 0 0;}
.tab-list1 ul::-webkit-scrollbar {display:none;}
.tab-list1.b-line2 ul {margin:0 19px -1px;}
.tab-list1 ul li {flex:0 0 auto; width:33.33%;}
.tab-list1.col2 ul li {width:50%;}
.tab-list1 li > a {display:block; position:relative; padding:20px 0; text-align:center; font-size:16px; color:#666; line-height:20px; font-family:"KBFGDisplayM";}
.tab-list1 li > a .sub {font-size:14px; color:#b0b0b0;}
.tab-list1 li > a.active, .tab-list1 li > a.active .sub {color:#222;}
.tab-list1 li > a.active:after {content:""; display:block; position:absolute; left:0; bottom:0; width:100%; height:4px; background:#ffde33;}
.tab-list1 .tab-nav {display:none; position:absolute; top:0; width:100%; height:100%;}
.tab-list1 .tab-nav a {position:absolute; top:0; width:30px; height:60px; text-indent:-9999px; z-index:10;}
.tab-list1 .tab-nav a::after {content:""; display:block; position:absolute; top:50%; left:50%; width:18px; height:18px; border:1px solid transparent; border-top:1px solid #ddd; border-left:1px solid #ddd;}
.tab-list1 .tab-nav a.nav-prev {left:9px;}
.tab-list1 .tab-nav a.nav-prev::after {-webkit-transform:translate(-50%, -50%) rotate(-45deg); transform:translate(-50%, -50%) rotate(-45deg);}
.tab-list1 .tab-nav a.nav-next {right:44px;}
.tab-list1 .tab-nav a.nav-next::after {-webkit-transform:translate(-50%, -50%) rotate(135deg); transform:translate(-50%, -50%) rotate(135deg);}
.tab-list1.t2 ul {margin:0 19px; padding:0; background:transparent; border:none;}
.tab-list1.t2 a {margin:0 10px; padding:14px 0; font-size:14px;}
.tab-list1.t2 a.active:after {height:0; background:transparent; border-top:2px solid #ffde33;}

.tab-list2 ul {display:flex; background:transparent;}
.tab-list2 ul li {flex:1;}
.tab-list2 a {display:block; position:relative; padding:10px 0; text-align:center; font-size:14px; color:#ccc; line-height:20px; font-family:"KBFGDisplayM";}
.tab-list2 a:after {content:""; display:block; position:absolute; left:0; bottom:0; width:calc(100% - 1px); height:100%; border:1px solid #ccc;}
.tab-list2 a span {display:inline-block; position:relative;}
.tab-list2 a.active span {padding-left:20px;}
.tab-list2 a.active span:before, .tab-list2 a.active span:after {content:""; display:block; position:absolute; height:2px; border-radius:1px; background:#ffde33;}
.tab-list2 a.active span:before {top:10px; left:0px; width:7px; transform:rotate(45deg);}
.tab-list2 a.active span:after {top:9px; left:3px; width:12px; transform:rotate(-45deg);}
.tab-list2 a.active {color:#222;}
.tab-list2 a.active:after {border:1px solid #ffde33; z-index:2;}
.tit-sub1 + .tab-list2, .tit-sub2 + .tab-list2 {margin-top:10px;}

.tab-list3 {margin:32px 0;}
.tab-list3 ul {display:block; width:100%;}
.tab-list3 ul:after {content:""; display:block; clear:both;}
.tab-list3 ul > li {display:block; float:left; width:33.33%; height:43px; text-align:center; line-height:0; overflow:visible;}
.tab-list3 ul > li:nth-child(3n) {width:calc(33.33% - 1px);}
.tab-list3 ul > li a {display:flex; align-items:center; justify-content:center; position:relative; margin:0 -1px; padding:10px; width:calc(100% + 1px); height:100%; font-family:"KBFGDisplayM"; font-size:12px; line-height:1.4; color:#666; background:#fff; border:1px solid #ccc;}
.tab-list3 ul > li:nth-child(n+4) {margin:-1px 0 0 0;}
.tab-list3 ul > li a.active {color:#222; background:#ffde33; border:1px solid #ffde33; border-right-color:transparent; z-index:10;}
.tab-list3 ul > li:nth-child(3n) a.active {border-right-color:#ffde33;}

.tab-list4 {padding:0px 19px 25px;}
.tab-list4 ul:after {content:""; display:block; clear:both;}
.tab-list4 ul li {display:block; float:left; padding:0px 5px; width:50%; text-align:center; overflow:visible;}
.tab-list4 ul li a {display:table; width:100%; height:60px; color:#b0b0b0; font-family:"KBFGDisplayM";}
.tab-list4 ul li a.active {color:#222; border-bottom:2px dotted #8c734b;}
.tab-list4 ul li a span {display:table-cell; vertical-align:middle;}

.conts-tab {display:none; position:relative; background:#fff;}
.conts-tab.active {display:block;}
.conts-tab.t2 {min-height:calc(100% - 109px); padding:0 0 58px; background:#eee;}
.conts-tab.t2 .bottom-area {position:absolute; bottom:0; width:100%;}
.conts-tab .conts-area2:last-child, .conts-tab .conts-area3:last-child, .conts-tab .conts-area4:last-child, .conts-tab .conts-area5:last-child {padding-bottom:0;}
.conts-tab .search-area1 {margin:0px 0 40px;}
.pop-body .conts-tab {padding-bottom:0;}
.form-area2 .conts-tab {padding:20px 0 0 0;}
.bg-c3 .conts-tab {background:transparent;}
.bg-c3 .conts-tab {background:transparent;}
.tab-list2 + .conts-tab {background:transparent;}

.conts-tab .bottom-area {margin:auto auto -50px;}

/** 진행상황 Step **/
.step-info1 {display:table; position:relative; width:100%; padding:20px 29px; min-height:70px; background:#fff; counter-reset:step; z-index:1;}
.step-info1:after {content:""; display:block; position:absolute; top:0; bottom:0; left:-50%; width:200%; background:#fff; z-index:-1;}
.step-info1 > li {display:table-cell; position:relative; font-size:12px; font-family:"KBFGDisplayM"; color:#b0b0b0;}
.step-info1 > li::before {counter-increment:step; content:counter(step); display:block; margin:0 0 9px; padding:0 0 4px; border-bottom:2px solid #b0b0b0; color:#666; line-height:12px;}
.step-info1 > li > em {display:block; position:absolute; top:0px; left:0px; width:0; height:0; text-align:left; font-size:0; overflow:hidden; opacity:0;}
.step-info1 > li + li {padding-left:30px;}
.step-info1 > li + li::after {content:""; display:block; top:14px; left:9px; position:absolute; width:5px; height:5px; border:solid rgba(132,136,139, .5); border-width:2px 2px 0 0; transform:rotate(45deg);}
.step-info1 > li.active {color:#ffde33;}
.step-info1 > li.active::before {color:#ffde33; border-bottom-color:#ffde33;}

/* 진행상황이 번호만 있는 경우 */
.step-info1.no-txt {display:flex; flex-wrap:nowrap; flex-direction:row;}
.step-info1.no-txt li {width:100%;}

.step-info2 {display:inline-block; float:right; counter-reset:step; height:22px;}
.step-info2 li {position:relative; display:inline-block; width:22px; height:22px; background:#ddd; border-radius:50%; overflow:hidden;}
.step-info2 li + li {margin:0 0 0 8px;}
.step-info2 li::before {counter-increment:step; content:counter(step); display:block; font-family:"KBFGDisplayB"; font-size:12px; color:#fff; line-height:22px; text-align:center;}
.step-info2 li.active {background:#ffde33;}
.step-info2 li.active::before {color:#222;}
.step-info2 li.complete::before {content:""; position:absolute; top:50%; left:50%; width:6px; height:9px; border:1px solid transparent; border-top-color:#fff; border-left-color:#fff; -webkit-transform:translate(-50%, -70%) rotate(-145deg); transform:translate(-50%, -70%) rotate(-145deg);}
.step-info2 li span {visibility:hidden;}

/** 정보입력폼 **/
.form-area2 {flex:auto; margin:0; padding:50px 19px; background:#f7f3e8;}
.page > .form-area2:first-of-type {margin:-50px 0 0; padding:100px 19px 50px;}
.form-area2 fieldset:first-of-type legend + .tit-sub1 {margin-top:0;}
.form-area2 .input-date {display:block;}
.form-area2 .select, .form-area2 .text,
.form-area2 .textarea {display:block; width:100%; margin:10px 0; font-family:"KBFGDisplayL";}
.form-area2 .tit-sub1 {margin-bottom:10px;}
.form-area2 section + .tit-sub1 {margin-top:26px;}
.form-area2 .txt-bul1 {color:#666;}
.form-area2 + .form-area2 {padding-top:0;}
.form-area2.slim {padding:80px 19px 10px !important;}
.form-area2.slim2 {padding:30px 19px 10px !important;}

/* 상품별 대출가능금액 확인 */
.form-area2 .tit-sub1:first-child, .form-area2 div.tit-sub2:first-of-type {margin-top:0;}
.form-area2 .btn-area.list-btm {margin:15px -19px -50px; border-top:1px solid #e8e5dc;}
.form-area2 .btn-area.list-btm > button > span {color:#666; border:none; border-radius:unset;}
.form-area2 .btn-area.list-btm > button > span:after {border-top-color:#bbb; border-left-color:#bbb;}

/* 간단납입 */
/* 간단 납입 (횟수로) */
.simple-form {margin:18px -29px 0; padding:20px 29px; background:#eee; color:#666; font-size:14px;}
.simple-form .tit-sub2 {margin:0; font-size:13px;}
.simple-form .tit-sub2 h4 {color:#222;}
.simple-form .hide-tit + .tit-sub2 {margin-top:20px;}
.simple-form .hide-tit:after {content:""; display:block; clear:both;}
.simple-form .hide-tit dd {position:relative; float:left; line-height:45px;}
.simple-form .hide-tit dd strong {font-size:16px; color:#222; font-family:"KBFGDisplayB";}
.simple-form .hide-tit dd:nth-of-type(1):nth-last-of-type(2) {width:50%;}
.simple-form .hide-tit dd:nth-of-type(2):last-child {width:50%; padding-left:33px;}
.simple-form .hide-tit dd:nth-of-type(2):last-child:before {content:""; display:block; position:absolute; top:50%; left:0; width:1px; height:11px; margin-top:-5px; background:#b0b0b0;}
.simple-form .hide-tit dd:nth-of-type(1):nth-last-of-type(1) {width:100%; float:none;}
.simple-form dd .label-check {margin-left:0 !important;}
.simple-form dd .label-check label {padding-right:9px !important;}
.simple-form .input-select select.select {width:100%;}

/* 입력값 있을 때 */
.simple-form.checked {margin:18px -19px 0; background:#f7f3e8;}

/* 타이틀이 볼드일 때 */
.simple-form.tit-type .tit-sub2 h4 {font-family:"KBFGDisplayM";}

/* dt+dd가 한 세트일때 */
.simple-form dl.type1 dd {margin-left:50%; width:50% !important;}
@media screen and (max-width:360px) {
	.simple-form dl.type1 dd {float:right !important; margin-left:0; width:150px !important;}
}


/* 납입횟수 입력이 왼쪽에 올때 */
.simple-form .hide-tit.type2 dd:nth-of-type(1):nth-last-of-type(2) {padding-right:33px;}
.simple-form .hide-tit.type2 dd:nth-of-type(2):last-child {text-align:right;}

/* 납입횟수 입력이 왼쪽에 올때 */
.simple-form .hide-tit.type3 dd:nth-of-type(1):nth-last-of-type(2) {width:calc(100% - 120px);}
.simple-form .hide-tit.type3 dd:nth-of-type(2):last-child {width:120px; padding-left:0;}
.simple-form .hide-tit.type3 dd:nth-of-type(2):last-child:before {display:inline; position:static;}

/* checkbox 있을때 */
.simple-form .hide-tit dd:nth-of-type(1):nth-last-of-type(2) {width:50%;}
.simple-form .hide-tit dd:nth-of-type(2):last-child {width:50%; padding-left:33px;}

/* 중도인출신청금 */
.simple-form:not(.t2) dl:not(.hide-tit) dt {color:#222;}
.simple-form:not(.t2) dl:not(.hide-tit) dt span {color:#666; font-size:13px;}
.simple-form:not(.t2) dl:not(.hide-tit) dd {margin-left:60%; width:40%;}
.simple-form:not(.t2) dl:not(.hide-tit) dd input.text {padding:5px 0 0 0; width:calc(100% - 20px); height:40px;}

/* 출금신청 분할보험금 */
.simple-form.t2 {background:#f7f3e8;}
.simple-form.t2 .tit-sub2 {font-family:'KBFGDisplayM'; color:#222;}
.simple-form.t2 .tit-sub2 + ul {margin:20px 0 0 0;}
.simple-form.t2 ul > li {display:inline-block; position:relative; width:33%; vertical-align:top;}
.simple-form.t2 ul > li + li {margin:0 0 0 -3px; vertical-align:top;}
.simple-form.t2 ul > li + li:before {content:""; display:block; position:absolute; top:0; left:-1px; width:0; height:100%; min-height:32px; border-left:1px dashed #abbfd6;}
.simple-form.t2 ul > li dt, .simple-form.t2 ul > li dd {font-size:13px; color:#666; text-align:center;}
.simple-form.t2 ul > li dd strong {font-family:'KBFGDisplayM'; color:#222;}

/* 거래내역조회 */
.set-date {padding:0px 19px 50px; background:#fff;}
.set-date .btn-area.full {margin-top:20px;}

/* 청구 > 서류등록 (자동발급) */
.file-added {position:relative;}
.file-added .ico-file {position:absolute; display:inline-block; padding:15px 15px 0 0; height:45px;}
.file-added span[class^="ico"]:before {content:""; display:inline-block; position:relative; width:20px; height:20px; margin-right:8px; background:url(../images/comm/ico-set.png) no-repeat; background-size:300px 300px; vertical-align:top;}
.file-added span.ico-cam:before {background-position:0 -40px;}
.file-added span.ico-file:before {background-position:-40px -40px;}

/* 진행사항 > progress */
.progress {background-color:#fff; position:relative; padding-left:55px;}
.progress:before {content:""; position:absolute; left:55px; top:20px; bottom:20px; margin:10px 0 10px; z-index:1; display:block; width:1px; border-left:1px solid #ccc;}
.progress li {padding:19px 19px 19px 23px; position:relative; color:#666; border-bottom:1px solid #f0f0f0; font-size:12px; line-height:1.3;}
.progress li:last-child {border-bottom:none !important;}
.progress li em {display:block; color:#666; font-size:14px;}
.progress li:after {content:""; position:absolute; top:50%; left:-6px; z-index:2; margin-top:-7px; display:block; width:10px; height:10px; border-radius:50%; background-color:#fff; border:2px solid #222;}
.progress li.active {margin-left:-55px; padding-left:78px; color:#666; background-color:#fffdf6; border-bottom:none;}
.progress li.active em {color:#ffde33; margin-bottom:3px;}
.progress li.active:after {left:48px; border-color:#ffde33; background-color:#ffde33;}
.progress li.active + li {border-top:1px solid #f0f0f0;}
.progress li.active:before, .progress li.active ~li:not(:last-child):before {content:""; position:absolute; left:0; top:50%; z-index:2; display:block; width:1px; height:100%; background:url(../images/comm/bg-dot.gif) repeat-y 0 0/1px 5px;}
.progress li.active:before {left:55px;}


/*******************************/
/***** 그래프 							   *****/
/******************************/
.conts-graph3 {position:relative; width:100%; height:100px; margin:30px auto; display:flex; flex-wrap:nowrap; flex-direction:row;}
.conts-graph3:after {content:""; display:block; clear:both;}
.conts-graph3 li {position:relative; width:100%; margin-top:20px; margin-left:-3px; padding-top:10px; border-radius:0 10px 0 0; font-size:11px; color:#fff; font-family:'KBFGDisplayM'; text-align:center; box-shadow:1px 1px 1px rgba(100,100,100,0.2);}
.conts-graph3 li:nth-child(1) {background:#bcbcbc; margin-left:0;}
.conts-graph3 li:nth-child(2) {background:#b1b1b1;}
.conts-graph3 li:nth-child(3) {background:#a4a4a4;}
.conts-graph3 li:nth-child(4) {background:#9b9b9b;}
.conts-graph3 li:nth-child(5) {background:#929292;}
.conts-graph3 li:before {content:""; position:absolute; bottom:40px; left:10px; width:calc(100% - 20px); height:1px; background:rgba(97,80,77,.15);}
.conts-graph3 li:after {content:""; position:absolute; bottom:10px; left:calc(50% - 11px); width:22px; height:18px; background:url(../images/comm/ico-fund.png) no-repeat; background-size:300px auto; opacity:0.75;}
.conts-graph3 li:nth-child(1):after {background-position:0px 0px;}
.conts-graph3 li:nth-child(2):after {background-position:-24px 0px;}
.conts-graph3 li:nth-child(3):after {background-position:-48px 0px;}
.conts-graph3 li:nth-child(4):after {background-position:-72px 0px;}
.conts-graph3 li:nth-child(5):after {background-position:-96px 0px;}
.conts-graph3 li span {display:none; font-family:'KBFGDisplayL';}
.conts-graph3 li.active {background:rgba(225,211,35,0.9) !important; z-index:1; margin-top:0; color:#222;}
.conts-graph3 li.active:after {opacity:1;}
.conts-graph3 li.active span {display:block;}


/*******************************/
/***** 팝업 						   	   *****/ 
/******************************/
body.modal-open {position:fixed; width:100%; overflow:hidden !important;}
.pop-layer {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#fff; z-index:2001;}
.pop-layer.alert, .pop-layer.p-select {top:50%; left:50%; width:calc(100% - 56px); min-width:264px; max-width:600px; height:auto; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.pop-layer.active {display:block;}
.pop-layer.pop-slide {display:block; top:100%; -webkit-transition:all .5s; transition:all .5s;}
.pop-layer.pop-slide.active:not(.slide-t2) {top:0;}
.pop-layer.pop-slide.slide-t2 {height:auto; background:transparent;}
.pop-layer .pop-header {position:relative; padding:0; width:100%; border-bottom:1px solid #ddd;}
.pop-layer .pop-header.bt2 {border-color:#666;}
.pop-layer .pop-header .tit-con1 {padding:10px 0; width:100%; font-family:'KBFGDisplayM'; font-size:18px; line-height:30px; text-align:center;}
.pop-layer.alert .pop-header {display:none;}
.pop-layer.alert.t2 .pop-header {display:block; position:absolute; top:-36px; left:auto; right:0; padding:36px 0 0; width:20px; border:none;}
.pop-layer:not(.p-select) .pop-header > .tit-sub1 {margin:0; text-align:center; line-height:30px;}
.pop-layer.p-select .pop-header {position:relative; top:0; padding:0; height:50px; background:#eee;}
.pop-layer.p-select .pop-header > .tit-sub1 {margin:0; padding:0 30px; font-size:14px; line-height:50px;}
.pop-layer.pop-slide.slide-t2 .pop-header {display:none; position:absolute; top:-36px; left:auto; right:0; padding:36px 0 0; width:20px; border:none;}
.pop-layer.pop-slide.slide-t2.active .pop-header {display:block;}
.pop-header .btn-icon.ico-close {display:block; position:absolute; top:50%; right:15px; padding:0; margin:-10px 0; width:20px; height:20px; text-indent:-9999px;}
.pop-header .btn-icon.ico-close::before, .pop-header .btn-icon.ico-close::after {content:""; position:absolute; top:0; left:50%; width:1px; height:20px; background:#222; border-radius:1px;}
.pop-header .btn-icon.ico-close::before {-webkit-transform:translateX(-50%) rotate(45deg); transform:translateX(-50%) rotate(45deg);}
.pop-header .btn-icon.ico-close::after {-webkit-transform:translateX(-50%) rotate(-45deg); transform:translateX(-50%) rotate(-45deg);}
.pop-layer.alert.t2 .pop-header .btn-icon.ico-close {right:0;} 
.pop-layer.alert.t2 .pop-header .btn-icon.ico-close::before, .pop-layer.alert.t2 .pop-header .btn-icon.ico-close::after {background:#fff;}
.pop-layer.pop-slide.slide-t2 .pop-header .btn-icon.ico-close::before, .pop-layer.pop-slide.slide-t2 .pop-header .btn-icon.ico-close::after {background:#fff;}
.pop-layer .pop-body {display:block; position:relative; padding:0 0 60px; height:calc(100% - 60px); overflow-y:auto; -webkit-overflow-scrolling:touch;}
.pop-layer.alert .pop-body {padding:40px 30px 90px; height:auto; background:#eee; border-radius:0;}
.pop-layer.alert .pop-body.none {padding:40px 30px;}
.pop-layer.alert .pop-body p + p {margin:25px 0 15px;}
.pop-layer.alert.t2 .pop-body {padding:40px 30px 141px;}
.pop-layer.p-select .pop-body {padding:0; height:auto; border-radius:0;}
.pop-layer.pop-slide.slide-t2 .pop-body {height:100%; background:#eee; overflow:hidden;}
.pop-layer .pop-body > section {flex:auto;}
.pop-layer .pop-body .bottom-area {position:fixed; left:0; bottom:0; margin:0; width:100%; z-index:999;}
.pop-layer .pop-body .bottom-area .line2 {height:auto !important; min-height:58px; line-height:20px;}
.pop-layer.alert .pop-body .bottom-area .btn-not, .pop-layer.alert .pop-body .bottom-area .btn-main, .pop-layer.slide-t2 .btn-main {height:50px; line-height:20px;}
.pop-layer .pop-body .tab-list1 {margin:0; padding:0;}
.pop-layer.pop-slide.slide-t2 .tit-sub1 {margin:0 0 25px; font-family:"KBFGDisplayL"; font-size:20px;}
.pop-layer.pop-slide.slide-t2 .tit-sub2 > h4 {font-family:"KBFGDisplayL"; font-size:16px; color:#222;}
.pop-layer.pop-slide.slide-t2 p {color:#222;}
.pop-layer.pop-slide.slide-t2 .scroll-wrap {position:relative; height:100%;}
.pop-layer.pop-slide.slide-t2 .scroll-wrap::before, .pop-layer.pop-slide.slide-t2 .scroll-wrap::after {content:""; display:block; position:absolute; left:0; width:calc(100% - 10px); height:20px; z-index:1;}
.pop-layer.pop-slide.slide-t2 .scroll-wrap::before {top:45px; background:-webkit-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(238,238,238,0) 100%); background:linear-gradient(top, rgba(255,204,0,1) 0%, rgba(255,204,0,0) 100%);}
.pop-layer.pop-slide.slide-t2 .scroll-wrap::after {bottom:50px; background:-webkit-linear-gradient(top, rgba(238,238,238,0) 0%, rgba(238,238,238,1) 100%); background:linear-gradient(top, rgba(255,204,0,0) 0%, rgba(255,204,0,1) 100%);}
.pop-layer.pop-slide.slide-t2 .scroll-area {margin:0 -40px 0 0; padding:10px 40px 10px 0; height:100%; overflow-y:auto;}

/* select */
.pop-layer.p-select .pop-body .bottom-area a {height:50px !important;}
.pop-layer.p-select {max-height:476px; overflow:hidden;}
.pop-layer.p-select .pop-body {background:#fff; overflow:hidden;}
.pop-layer.p-select .pop-body .ovflow {max-height:420px; overflow-y:auto;}
.pop-layer.p-select .label-check {display:block; box-sizing:border-box;}
.pop-layer.p-select .label-check:last-child, .pop-layer.p-select .label-check:only-child {border-bottom:none;}
.pop-layer.p-select .label-check + .label-check {border-top:1px solid #eee;}
.pop-layer.p-select .label-check > label {display:block; padding:24px 30px;}
.pop-layer.p-select .label-check > label > input + span {display:inline-block; width:100%;}
.pop-layer.p-select .label-check > label > input + span:before {display:none;}
.pop-layer.p-select .label-check > label > input + span:after {left:auto; right:12px; width:13px; height:6px; border:solid transparent; border-width:0 0 2px 2px; border-radius:0; -webkit-transform:translateY(-100%) rotate(-40deg); transform:translateY(-100%) rotate(-40deg);}
.pop-layer.p-select .label-check > label > input:checked + span:after {border-color:#ffde33;}

/*팝업 버튼, 텍스트 컬러 변경*/
.pop-layer .pop-body .btn-area .btn-main.c1,
.pop-layer .pop-body .bottom-area .btn-main.c1 {background-color: #8c734b;}
.pop-layer .pop-body .btn-area .btn-main.c2 {background-color:#b4a894;}
.pop-layer .pop-body .txt-c7 {color:#f46600 !important;}
/* 팝업 메세지 */
.mes-noti {position:relative; padding:93px 0 0; margin:0 18px; font-size:14px; line-height:17px;}
.mes-noti:before {content:""; display:block; position:absolute; top:0; left:0; width:80px; height:80px; background:url(../images/comm/clipart-set.png) no-repeat; background-size:400px auto;}
.mes-noti.ico1:before {background-position:-80px -495px;}

.dim-layer {display:block; position:fixed; top:0; bottom:0; left:0; width:100%; height:100vh; background:rgba(0,0,0,0.8); z-index:2000;}

.area-poptop {padding-bottom:30px;}
.area-poptop .mes-t1 {margin-bottom:10px;}

/* 팝업 내 리스트*/
.pop-layer .pop-body .list-item > li, .pop-layer .pop-body div.list-item.card {background:#fafafa;}

/* 도움말 메세지 팝업 */
.btn-help {display:inline-block; margin:3px 0 0 0; width:12px; height:12px; text-indent:-999px; background:url(../images/comm/ico-set.png) 0 -167px no-repeat; background-size:300px auto; overflow:hidden;}
.btn-help.t1 {background-position:0 -167px;}
.btn-help.t2 {background-position:-12px -167px;}
.btn-help.t3 {background-position:-24px -167px;}
.btn-help.t1.em {background-position:-36px -167px;}
.btn-help.t2.em {background-position:-48px -167px;}
.btn-help.t3.em {background-position:-60px -167px;}
.btn-help.bs {width:16px; height:16px;}
.btn-help.t1.bs {background-position:0 -179px;}
.btn-help.t2.bs {background-position:-16px -179px;}
.btn-help.t3.bs {background-position:-32px -179px;}
.btn-help.t1.bs.em {background-position:-48px -179px;}
.btn-help.t2.bs.em {background-position:-64px -179px;}
.btn-help.t3.bs.em {background-position:-80px -179px;}
div.pop-help {display:none; position:absolute; left:0; top:auto; width:100%; padding:20px 30px 20px 20px; font-size:13px; color:#fff; text-align:left; background:rgba(96,88,76,0.9); z-index:999;}
div.pop-help.active {display:block;}
div.pop-help .close {display:block; position:absolute; top:10px; right:10px; width:16px; height:16px; font-size:0; text-indent:-999px; overflow:hidden;}
div.pop-help .close:before, div.pop-help .close:after {content:""; display:block; position:absolute; top:50%; left:50%; width:16px; height:1px; background:#fff;}
div.pop-help .close:before {transform:translate(-50%, -50%) rotate(45deg); -webkit-transform:translate(-50%, -50%) rotate(45deg); -moz-transform:translate(-50%, -50%) rotate(45deg);}
div.pop-help .close:after {transform:translate(-50%, -50%) rotate(-45deg); -webkit-transform:translate(-50%, -50%) rotate(-45deg); -moz-transform:translate(-50%, -50%) rotate(-45deg);}
div.pop-help * {color:#fff;}
div.pop-help .help-tit {font-family:"KBFGDisplayM"; font-size:15px;}
.txt-bul1:not(ul):not(ol):before, div.pop-help .txt-bul1 > li:before {background:#fff;}
.tit-sub1 div.pop-help * {font-size:14px; font-family:"KBFGDisplayL";}


/*******************************/
/***** 로딩 							    *****/
/*******************************/
.loadingClass:not(.dim-layer) {position:fixed; top:0; left:0; width:100%; height:100vh; z-index:3000;}
.loadingClass:not(.dim-layer) .img {position:absolute; top:calc(50% - 48px); left:50%; width:80px; height:14px; -webkit-transform:translate(-50%, -50%); transform:translateX(-50%, -50%);}
.loadingClass:not(.dim-layer) .img > i {display:block; position:absolute; top:0; left:0; width:14px; height:14px; text-indent:-9999px; background:#ffde33; border-radius:50%;}
.loadingClass:not(.dim-layer) .img > i:nth-child(1) {opacity:0; animation:one 0.5s infinite linear;}
.loadingClass:not(.dim-layer) .img > i:nth-child(2) {left:19px; animation:two-three 0.5s infinite linear;}
.loadingClass:not(.dim-layer) .img > i:nth-child(3) {left:33px; animation:two-three 0.5s infinite linear;}
.loadingClass:not(.dim-layer) .img > i:nth-child(4) {left:47px; animation:four 0.5s infinite linear;}
.loadingClass:not(.dim-layer) p {position:absolute; top:50%; left:50%; padding:0; font-size:14px; color:#fff; text-shadow:1px 1px 2px #000; -webkit-transform:translate(-50%, -50%); transform:translateX(-50%, -50%);}
.dim-layer.loadingClass {z-index:2001;}

@keyframes one {
	40% {transform:translateX(0); opacity:0;}
	100% {transform:translateX(19px); opacity:1;}
}
@keyframes two-three {
	0% {transform:translateX(0);}
	100% {transform:translateX(14px);}
}
@keyframes four {
	0% {transform:translateX(0); opacity:1;}
	70% {transform:translateX(19px); opacity:0;}
	100% {transform:translateX(19px); opacity:0;}
}


/***********************/
/* 온라인보험 헤더모양 */
/***********************/


header.chat_header_wrap {
  z-index: 12;
  position: relative;
  margin: 0 auto;
  width: 100%;
  height: 49px;
}

.chat_header {
  position: fixed;
  width: 100%;
  height: 45px;
  padding-bottom: 5px;
  background: none;
  z-index: 100;
  box-sizing:content-box;
}
.bg_chat_header {
  min-height: 49px;
  height: 49px;
  background: #60584c;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 2px 5px #000 rgba(0, 0, 0, 0.2);
}

.chat_header .logo {
  min-height: 49px;
  padding: 15px;
  line-height: 19px;
  font-size: 18px; 
  text-align: center;
  color: #fff;
}

.chat_header .back {
  position: absolute;
  top: 0;
  left: 0;
  text-indent:-9999px;
  width: 69px;
  height: 49px;
  background:transparent;
  border:none;
}

.chat_header .back::before,
.chat_header .back::after {
  content:"";
  display:block;
  position:absolute;
  left:40%;
  top:50%;
  width:12px;
}

.chat_header .back::before {
  height:12px;
  border:solid #fff;
  border-width:2px 2px 0 0;
  margin-top:-2px;
  transform-origin:center;
  transform:rotate(-135deg) translate(50%);
}

.chat_header .back::after {
  width:17px; 
  height:2px;
  margin:-1px 0 0 -5px;
  background:#fff;
}

.chat_header .close {
  position:absolute;
  top: 0;
  right: 0; 
  text-indent:-9999px;
  width: 60px;
  height: 49px;
  background:transparent;
  border:none;
}

.chat_header .close::before,
.chat_header .close::after {
  content:"";
  display:block;
  position:absolute;
  left:50%;
  top:50%;
  width:20px;
  height:2px;
  margin-top:-2px;
  border-radius:1px;
  background:#fff;
  transform-origin:center;
}

.chat_header .close::before {
  transform:translate(-50%) rotate(45deg);
}

.chat_header .close::after {
  transform:translate(-50%) rotate(-45deg);
}

/* 신용카드 본인인증 20191209 */
.page-ars {height:100vh !important;}
.cert-top {padding-top:80px !important;}
.input-area.inptext {padding:12px 2px 10px; height:45px; border-bottom:1px solid #c5c5c5;}
.input-area.card-com .select {width:100%; margin-top:0;}
.list-agree.cert {margin:-9px 0 0px; border-bottom:1px solid #c5c5c5;}
.list-agree.cert > li {position:relative;padding:10px 19px; background:transparent; border-bottom:1px dotted #e1e1e1;}
.list-agree.cert > li:last-child {border-bottom:0px;}
.ars-tbl {margin-top:20px;}
h2.cert {font-size:16px !important; line-height: 20px !important; margin-top:7px;}
.ars-box {position: relative; width:100%; margin-top:12px; margin-bottom:20px; padding:144px 0 30px 0; background: #fff; text-align: center;}
.ars-box:before {position: absolute; top: 30px; left: 50%; margin-left:-40px; display: block; width: 80px; height: 93px; content: '';  background: url("../images/comm/ico_ars01.png") no-repeat 0 0; background-size:100%; border:0px solid #00f;}
.ars-box .txt2 {font-size:14px; line-height: 24px; padding:4px 0 0 0;}
.ars-box .cert-time {position: relative; display: inline-block; font-size: 16px; padding:20px 0 0 0px;}
.ars-box .cert-time .time {color: #ff3d3d;}
.ars-box .button-wrap {padding-top:26px;}
.ars-box .button-wrap .btn-com {min-width: 120px;}
/* 블릿 타입5 */
.txt-bul5:not(ul):not(ol):not(dl):before, .txt-bul5 > li:before {top:7px; width:2px; height:2px; background:#666; border-radius:0;content:'';}
.card-num > input[readonly], input:disabled {opacity: .35;}


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

/* 2022.08 - 통합 구축 */

/*****************************/
.visible-pc {
  display: block !important;
}

.visible-mb {
  display: none !important;
}

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