@charset "utf-8";

/* @import url('jquery-ui.css');
@import url('swiper.min.css'); */

.tempArea {padding:64px 0; background-color:#aaa; color:#fff; font-size:18px; font-weight:500; letter-spacing:0; text-align:center;}

.bgGrayArea {margin:0 -24px 30px; padding:26px 24px; background-color:#f8f8f8;}

/* bgGrayArea 관련 재정의 */
.bgGrayArea .noData:not(tr),
.content.prdList .noData:not(tr) {background-image:url(../../assets/images/smart/common/msg_no_cyber_w.svg);}
.bgGrayArea .conBlock .noData:not(tr) {background-image:url(../../assets/images/smart/common/msg_no_cyber.svg);}
.bgGrayArea .conBlock .txtList.remark {margin-bottom:20px;}
.bgGrayArea .conBlock + .srchFilt.sticky {margin-top:-32px; margin-bottom:32px;}
.bgGrayArea .conBlock .infoVisual {margin-top:-32px; margin-bottom:0;}


/*================================================== Text ==================================================*/
/* 텍스트 사이즈 */
.txt2XL {font-size:2.8rem !important; letter-spacing:-0.055rem;}
.txtXL {font-size:2.0rem !important; letter-spacing:-0.05rem;}
.txtL {font-size:1.8rem !important;}
.txtM {font-size:1.6rem !important;}
.txtS {font-size:1.4rem !important;}
.txtSS {font-size:1.3rem !important;}
.txtXS {font-size:1.2rem !important;}
.txtRQ {font-size:1.7rem !important;} /* 정보보호 요청 디지털보험 동의서용 폰트사이즈 */

/* 텍스트 컬러 */
.basicC1 {color:#222 !important;}
.basicC2 {color:#666 !important;}
.basicC3 {color:#959595 !important;}
.basicC4 {color:#bbb !important;}
.pointC1 {color:#445fe6 !important;} /* 링크, 선택 */
.pointC2 {color:#b87900 !important;} /* 중요고지 */
.pointC3 {color:#3e9100 !important;} /* 승인, 알림 */
.pointC4 {color:#e91b10 !important;} /* 경고, 필수항목 */
.pointC5 {color:#5642bf !important;} /* 안내고지, 강조 */
.pointC6 {color:#e658b2 !important;}
.pointC7 {color:#00a3bb !important;} /* 민트 */
.pointC8 {color:#715deb !important;} /* 퍼플-라이트 */ 

/* 텍스트 굵기 */ 
.fwL {font-weight:300 !important;}
.fwM {font-weight:500 !important;}
.fwB {font-weight:700 !important;}

hr {height:10px; margin:32px -24px 30px; background-color:#f8f8f8;}
hr.s {height:1px; margin-left:0; margin-right:0; background-color:#eee;}

.lineH17 {line-height:1.7;}

/*선택금지용 알파값 박스*/
.alBox {position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: transparent;}
/*================================================== dispaly ==================================================*/
dpIb {display:inline-block;}
/*================================================== z-index ==================================================*/
.zi1 {z-index:1;}
.zi2 {z-index:2;}
.zi3 {z-index:3;}
.zi4 {z-index:4;}
.zi5 {z-index:5;}
.zi6 {z-index:6;}
.zi7 {z-index:7;}
.zi8 {z-index:8;}
.zi9 {z-index:9;}
.zi10 {z-index:10;}

.wdF {width:100% !important;}
/*================================================== Title ==================================================*/
[class*=titH] {position:relative; color:#222; font-weight:500; letter-spacing:0; word-break:keep-all;}
.titH1 {font-size:2.4rem; letter-spacing:-0.05rem;}
.titH2 {margin:0 0 18px; font-size:2.0rem; letter-spacing:-0.05rem;}
.titH3 {margin:0 0 10px; font-size:1.8rem;}
.titH4 {margin:0 0 8px; font-size:1.6rem;}
.titH4.dot {padding-left:12px;}
.titH4.dot:before {content:''; position:absolute; left:0; top:11px; width:4px; height:4px; border-radius:50%; background-color:#5d88fb;}
.titH5 {margin:20px 0 8px; font-size:1.4rem;}

[class*=titH].titIco {margin-bottom:24px;}
[class*=tit].titIco {display:flex; align-items:center;}
[class*=tit].titIco [class*=ico] {margin-right:12px;}
[class*=tit].titIco .ico {width:32px; height:32px;}
[class*=tit].titIco .icoL {width:48px; height:48px;}
[class*=tit].titIco .bgC {width:48px; height:48px; padding:4px; border-radius:14px; background-color:#f1f9fb;}
[class*=tit] + [class*=titH].titIco {margin-top:20px;}

/* 컨텐츠 타이틀 */
.pRel {position:relative;} /* 231014-디지털보험 수정요청 */
.titArea {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; width:100%; margin:0 0 18px;}
.titArea > [class*=titH] {flex-grow:1; margin:0 !important; padding-right:10px;}
.titArea > *:not([class*=titH]) {flex-grow:0;}
.titArea .single {margin:0;}
.titArea .single .ipt + label {font-size:1.4rem; line-height:25px;}
.titArea .icoBtn_infoPop {margin:4px 0;}


/*================================================== 텍스트 ==================================================*/
.txt {margin-bottom:24px;}
.txt + .txt {margin-top:-12px;}

/* txtItem */
.txtItem {overflow:hidden;}
.txtItem > * {position:relative; display:inline-block; margin-right:16px;}
.txtItem > *:last-child {margin-right:0;}
.txtItem > *:not(:first-child):before {content:''; position:absolute; left:-10px; top:5px; bottom:4px; /*top:50%; height:13px; margin-top:-6px;*/ border-right:1px solid #ddd;}

/* 오른쪽 정렬시 */
.rCont {display:flex; flex-direction:column; align-items:flex-end; }

/* linkGroup */
.linkGroup {margin-top:5px;}
.linkGroup > .links {margin:0 16px 0 0; font-size:1.4rem;}
.linkGroup > .links:after {display:none;}
.linkGroup > .links:not(:first-child):before {content:''; position:absolute; left:-10px; top:5px; bottom:4px; /*top:50%; height:13px; margin-top:-6px;*/ border-right:1px solid #ddd;}

.linkGroup.flex {display:flex; justify-content:space-between;}
.linkGroup.flex > .links {margin:0; color:#222;}
.linkGroup.flex > .links:before {content:none;}
.linkGroup.flex > .links:last-child {font-weight:500;}
.linkGroup.flex > .links:only-child {width:100%; text-align:center;}

/*================================================== Button ==================================================*/
/* 텍스트 버튼 */
[class^=btn_] {display:block; width:100%; min-height:56px; margin:16px 0 4px; padding:5px 5px; border:1px solid transparent; font-size:18px; font-weight:500; text-align:center; vertical-align:middle;}
[class^=btn_] > span {display:inline-block; position:relative;}
[class^=btn_][disabled],
[class^=btn_].disabled {border-color:#eee !important; color:#aaa !important; box-shadow:none !important;}

.btn_p {border-color:#715deb; background-color:#715deb; color:#fff; box-shadow:4px 4px 8px rgba(113, 93, 235, 0.24);}
.btn_p.m,
.btn_p.s {border-color:#5d88fb; background-color:#5d88fb; box-shadow:4px 4px 8px rgba(93, 136, 251, 0.24);}
.btn_p[disabled],
.btn_p.disabled {background-color:#eee !important;}

.btn_s {border-color:#ccc; background-color:#fff; color:#444;}
.btn_s.s {border-color:#5d88fb; color:#445fe6;}
.btn_s.m.more {margin:32px 0 4px;}
.btn_s.m.more em {color:#445fe6;}
.btn_s.m.more > span {padding-right:27px;}
.btn_s.m.more > span::after {content:''; position:absolute; right:0; top:50%; width:9px; height:9px; margin-top:-1px; border:1px solid #222; border-width:0 1px 1px 0; box-sizing:border-box; transform:translate(-50%, -50%) rotate(45deg);}
.btn_s.b {font-size: 16px; background-color: #f2f6ff; color:#445fe6; min-height: 45px; margin-top: 24px;}

.btn_s.m2.more {margin:32px 0 4px;}
.btn_s.m2.more > span {padding-right:27px;}
.btn_s.m2.more > span::after {content:''; position:absolute; right:0; top:50%; width:9px; height:9px; margin-top:-1px; border:1px solid #222; border-width:0 2px 2px 0; box-sizing:border-box; transform:translate(-50%, -50%) rotate(45deg);}

.btn_t {border-color:#d6e1fe; background-color:#f2f6ff; color:#445fe6;}

.btn_g {height:36px; min-height:36px; margin:0; padding:0; border-radius:4px; background-color:#f8f8f8; color:#666; font-size:14px !important; font-weight:300 !important;}
.btn_fc {height:36px; min-height:36px; margin:0; padding:0; border-radius:4px; background-color:#e7e3fc; color:#715deb; font-size:14px !important; font-weight:300 !important;}/* 230308 추가:고객관리우수FC */
.btn_g.talk > span {padding-left:27px; background:url(../../assets/images/smart/content/bnn_img_talk.png) no-repeat 0 center; background-size:16px;}
a.btn_g {line-height:35px !important;}

.btn_d {border: 1px dashed #cccccc; color: #445fe6; background-color: #ffffff;}
.btn_d img {width: 20px; margin-top: -3px; margin-right: 5px;}
[class^=btn_].m {min-height:44px; padding:5px 10px; border-radius:2px; font-size:16px; font-weight:300;}
[class^=btn_].m2 {min-height:56px; padding:10px 20px; border-radius:3px; font-size:18px; font-weight:500;}
[class^=btn_].m.point {border-color:#5d88fb; color:#445fe6;}
[class^=btn_].s {min-height:36px; margin:4px 0; padding:4px 6px; border-radius:2px; font-size:14px; font-weight:300;}
[class^=btn_]:not(button) {line-height:44px;}
[class^=btn_]:not(button).m {line-height:32px;}
[class^=btn_]:not(button).s {line-height:26px;}
.btn_g:not(button) {line-height:36px;}


.btnGroup {display:flex; position:relative; width:100%; flex-direction:row; flex-wrap:nowrap; margin:16px 0; padding:0; align-items:center; z-index:1;}
.btnGroup [class^=btn_] {flex-grow:1; height:36px; margin:0 4px;}
.btnGroup [class^=btn_]:first-child {margin-left:0;}
.btnGroup [class^=btn_]:last-child {margin-right:0;}

.accoBody .btnGroup,
.tabPanel .btnGroup {margin-top:32px;}

.btnArea {display:flex; position:relative; flex-direction:row; flex-wrap:nowrap; margin:32px -4px; background-color:transparent; align-items:center;}
.btnArea [class^=btn_] {flex-grow:1; width:33.3333%; min-width:auto; margin:0 4px;}
.btnArea [class^=btn_]:last-child {width:66.6667%;}

.btnArea.reverse {flex-direction:row;}
.btnArea.reverse [class^=btn_] {width:66.6667%;}
.btnArea.reverse [class^=btn_]:last-child {flex-grow:1; width:33.3333%;}

.btnArea.half [class^=btn_],
.btnArea.half [class^=btn_]:last-child {width:50%;}

.btnArea.half.wrap {flex-wrap:wrap;}
.btnArea.half.wrap [class^=btn_] {width:calc(50% - 8px); flex-grow:0; margin:4px;}
.btnArea.half.wrap [class^=btn_]:only-child,
.btnArea.half.wrap [class^=btn_]:last-child:nth-child(odd) {width:100%;}
@media all and (max-width:320px) {
	.btnArea.half [class^=btn_],
	.btnArea.half [class^=btn_] {font-size:17px;}
}
.btnArea.full {flex-wrap:wrap; margin-left:0; margin-right:0;}
.btnArea.full [class^=btn_] {width:100%; margin:4px 0;}

.btnArea.sticky {position:sticky; left:0; bottom:8px; margin:32px -20px 0; background-color:transparent; z-index:1501;}
/* .isIOS .btnArea.sticky {bottom:40px;} */
body:not(.digital) .content .btnArea.sticky .btn_s {border-color:#7d7a8e; background-color:#7d7a8e; color:#fff;}

/*--- 버튼뒤 흰색배경처리 ---*/
.btnBg {width:100vw; height:66px; position:absolute; bottom:0px; left:0px; background-color:#ffffff; margin-left:-10px; margin-bottom:-10px;}

/*--- 아이콘 + 텍스트버튼 ---*/
/* [class^=btn_].addIco > span {vertical-align:baseline;} */
[class^=btn_].addIco > span:after {content:none;}
[class^=btn_].addIco > span {margin:0 8px 0 0;}
[class^=btn_].addIco > [class*=ico_] {vertical-align:sub;}
[class^=btn_].addIco > [class*=ico_] + span {margin:0 0 0 8px;}
[class^=btn_].addIco.s {width:auto;}
[class*=ico_] {display:inline-block; position:relative;}

/*오른쪽 화살표*/
.ico_arrow {top:1px; width:21px; height:21px;}
.ico_arrow:before {content:''; position:absolute; right:8px; top:7px; width:9px; height:9px; border:1px solid #1a75e4; border-width:2px 2px 0 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg); transition:all 0.25s ease-in-out; z-index:1;}
.ico_arrow:after {content:''; position:absolute; left:auto; right:0; top:50%; bottom:auto; width:21px; height:21px; border:0; border-radius:50%; background-color:transparent; transform:translateY(-50%); transition:all 0.15s ease-in-out;}
.ico_arrow.g {top:1px; width:21px; height:21px;}
.ico_arrow.g:before {width:10px; height:10px; border-color:#666;}

/* 새창 */
.ico_newWin {width:15px; height:15px;}
.ico_newWin:before,
.ico_newWin:after {content:''; position:absolute; box-sizing:border-box;}
.ico_newWin:before {right:0; bottom:0; width:14px; height:14px; border:2px solid #715deb; border-radius: 0; transition: all 0.05s ease-in-out;}
.ico_newWin:after {right:-1px; top:-1px; width:9px; height:9px; background:#fff url(../../assets/images/cdh/common/ico_newwin_arrow.png) no-repeat center center;}
.btn_t:not(.a) .ico_newWin:after {background-color:#ecf6ff;}

/* 팝업 */
.ico_popup {width:21px; height:21px;}
.ico_popup:before,
.ico_popup:after {content:''; position:absolute; width:14px; height:14px; border:2px solid #666; background:#fff; box-sizing:border-box;}
.ico_popup:before {left:6px; top:2px; z-index:1;}
.ico_popup:after {left:2px; top:6px;}

/* 아이콘 파일첨부 */
.btnFileArea {margin-top:16px; text-align:center;}
.btnFile {display:inline-block; width:64px; margin:0 32px; padding-top:78px; text-align:center; color:#222; background-repeat:no-repeat; background-position:0 0; vertical-align:top;}
.btnFile.camera {background-image:url('../../assets/images/smart/common/ico_camera.svg');}
.btnFile.file {background-image:url('../../assets/images/smart/common/ico_folder.svg');}

/* 다운로드 */
[class^=btn_].down {display:block;}
[class^=btn_].down span {position:relative; padding-right:24px;}
[class^=btn_].down span:before {content:''; position:absolute; top:50%; right:3px; width:10px; height:11px; margin-top:-6px; background:url(../../assets/images/smart/common/ico_down_arrow.png) no-repeat center center; background-size:10px auto;}
[class^=btn_].down span:after {content:''; position:absolute; top:50%; right:0;  width:16px; height:5px; margin-top:4px; border:2px solid #715deb; border-top:0; box-sizing:border-box; transition:all 0.1s ease-in-out;}
[class^=btn_].down.s {width:auto;}

.btn_p.down span:before {background-image:url(../../assets/images/smart/common/ico_down_arrow_w.png);}
.btn_p.down span:after {border-color:#fff;}

.btnIco_down {display:flex; align-items:center; width:100%; height:72px; padding:12px 0; font-size:1.4rem; font-weight:500; text-align:left; border-bottom:1px solid #eee;}
.btnIco_down span:not(.ico_file) {position:relative; display:block; width:100%; padding-right:24px;}
.btnIco_down span:not(.ico_file):before {content:''; position:absolute; top:50%; right:3px; width:10px; height:11px; margin-top:-7px; background:url(../../assets/images/smart/common/ico_down_arrow_g.png) no-repeat center center; background-size:10px auto;}
.btnIco_down span:not(.ico_file):after {content:''; position:absolute; top:50%; right:0;  width:16px; height:5px; margin-top:3px; border:2px solid #666; border-top:0; box-sizing:border-box; transition:all 0.1s ease-in-out;}
.btnIco_down .ico_file {min-width:48px; height:48px; margin-right:16px; border-radius:13px;}
.btnIco_down .ico_file.pdf {background-color:#fef3f2;}
.downBtnGroup {margin-top:20px;}

/* 파일 */
.ico_file {width:24px; height:24px; background-image:url('../../assets/images/smart/common/ico_file.svg'); background-repeat:no-repeat; background-position:center center;}
.ico_file.doc {background-image:url('../../assets/images/smart/common/ico_file_doc.svg');}
.ico_file.pdf {background-image:url('../../assets/images/smart/common/ico_file_pdf.svg');}
.ico_file.xls {background-image:url('../../assets/images/smart/common/ico_file_xls.svg');}
.ico_file.zip {background-image:url('../../assets/images/smart/common/ico_file_zip.svg');}

/* 플러스(더보기) */
.ico_plus {top:3px; width:20px; height:20px;}
.ico_plus:before,
.ico_plus:after {content:''; position:absolute; left:50%; top:50%; width:1px; height:11px; margin:-5px 0 0 0; background-color:#1a75e4;}
.ico_plus:after {width:11px; height:1px; margin:0 0 0 -5px;}
.links.txtS .ico_plus {top:0;}

/* 전체삭제 */
.ico_del {width:13px; height:13px; background:url(../../assets/images/smart/common/ico_file_del.png) no-repeat center center;}

/* 초기화 */
[class^=btn_].reset span {padding-left:20px; background:url(../../assets/images/smart/common/ico_reset.png) no-repeat 0 5px;}

/* 플러스(추가) */
[class^=btn_].plus {width:100%;}
[class^=btn_].plus span {padding-right:20px;}
[class^=btn_].plus span:before,
[class^=btn_].plus span:after {content:''; position:absolute; left:inherit; right:0; top:50%; width:2px; height:12px; margin:-6px 5px 0 0; background-color:#445fe6; border:none; transition:none;}
[class^=btn_].plus span:after {width:12px; height:2px; margin:-1px 0 0 -5px;}
[class^=btn_].plus:focus > span:after {width:12px; left:inherit;}
.btn_s.plus span:after,
.btn_s.plus span:before {background-color:#666;} 


/* 아이콘 버튼 */
[class*=icoBtn_] {display:inline-block; position:relative; background-color:transparent; background-repeat:no-repeat; background-position:0 0; vertical-align:middle; overflow:hidden;}
/* 아이콘(CSS) */
.icoBtn_close,
.icoBtn_del {width:36px; height:36px;}
.icoBtn_close:before,
.icoBtn_close:after,
.icoBtn_del:before,
.icoBtn_del:after {content:''; position:absolute; left:50%; top:50%; width:2px; height:25px; background-color:#222; transform:translate(-50%, -50%) rotate(45deg);}
.icoBtn_close:after,
.icoBtn_del:after {transform:translate(-50%, -50%) rotate(135deg);}

.icoBtn_prev,
.icoBtn_next,
.icoBtn_start,
.icoBtn_end {width:32px; height:32px;}
.icoBtn_prev:before,
.icoBtn_next:before {content:''; position:absolute; left:14px; top:50%; width:8px; height:8px; border:1px solid #444; border-width:0 0 2px 2px; background-color:transparent; box-sizing:border-box; transform:translateY(-50%) rotate(45deg);}
.icoBtn_next:before {left:auto; right:14px; transform:translateY(-50%) rotate(-135deg);}
.icoBtn_start:before,
.icoBtn_end:before {content:''; position:absolute; left:17px; top:50%; width:8px; height:8px; border:1px solid #444; border-width:0 0 2px 2px; background-color:transparent; box-sizing:border-box; transform:translateY(-50%) rotate(45deg);}
.icoBtn_end:before {left:auto; right:17px; transform:translateY(-50%) rotate(-135deg);}
.icoBtn_start:after,
.icoBtn_end:after {content:''; position:absolute; left:10px; top:50%; width:8px; height:8px; border:1px solid #444; border-width:0 0 2px 2px; background-color:transparent; box-sizing:border-box; transform:translateY(-50%) rotate(45deg);}
.icoBtn_end:after {left:auto; right:10px; transform:translateY(-50%) rotate(-135deg);}

/* 약관상세 보기 */
.icoBtn_arrow {width:55px; height:62px;}
.icoBtn_arrow:after {content:''; position:absolute; left:50%; top:50%; width:11px; height:11px; margin-left:-3px; border:1px solid #222; border-width:0 2px 2px 0; transform:translate(-50%, -50%) rotate(-45deg); transition:transform 0.25s;}

.icoBtn_open {width:24px; height:24px;}
.icoBtn_open::after {content:''; position:absolute; left:50%; top:50%; width:9px; height:9px; margin-top:-1px; border:1px solid #222; border-width:0 0 2px 2px; vertical-align:-webkit-baseline-middle; transform:translate(-50%, -50%) rotate(-45deg); transition:transform 0.25s; box-sizing:border-box;}
.on:not(.popBody):not(.tabPanel):not(.swiperWrap) .icoBtn_open::after {margin-top:2px; transform:translate(-50%, -50%) rotate(-225deg);}

/* 초기화 */
.icoBtn_reset {margin:0 4px; min-width:56px; height:56px; background:#7d7a8e url(../../assets/images/cda/content/ico_reset_lg.png) no-repeat 50% 50%;}

/* 상세정보 팝업 (?) */
.icoBtn_infoPop {position:relative; min-width:16px; height:16px; margin-top:-4px; padding-right:18px; font-size:14px; line-height:16px;}
.icoBtn_infoPop:before {content:'?'; display:inline-block; position:absolute; top:50%; right:0; width:16px; height:16px; color:#6f6f6f; font-size:12px; font-weight:700; line-height:14px; text-align:center; border:1px solid #6f6f6f; border-radius:50%; transform:translateY(-50%); box-sizing:border-box;}
.icoBtn_infoPop.info {height:18px; padding-right:22px;}
.icoBtn_infoPop.info:before {content:'!'; width:18px; height:18px; font-size:14px; line-height:16px; color:#ccc; border-color:#ccc;}

/* 아이콘(SVG) */
.icoBtn_home {width:32px; height:32px; background:url(../../assets/images/smart/common/ico_home.svg) no-repeat center center;}
.icoBtn_sns {width:32px; height:32px; background:url(../../assets/images/smart/common/ico_sns.svg) no-repeat center center;}
.icoBtn_zoom {width:32px; height:32px; background:url(../../assets/images/smart/common/ico_zoom.svg) no-repeat center center;}
.icoBtn_more {width:32px; height:32px; background:url(../../assets/images/smart/common/ico_sns_more.svg) no-repeat center center;}
.icoBtn_keypad {display:none !important; width:35px; height:42px; background:url(../../assets/images/smart/common/ico_ipt_mouse.svg) no-repeat 5px 9px;}
[class^=icoBtn_sum] {width:48px; height:48px; border:1px solid #eee; border-radius:50%; background-color:#fff; background-repeat:no-repeat; background-position:center center;}
.icoBtn_sumList {background-image:url(../../assets/images/smart/content/ico_sum_list.svg);}
.icoBtn_sumCard {background-image:url(../../assets/images/smart/content/ico_sum_card.svg);}

/* 아이콘 화살표 버튼  */
.arwBtnList {margin-top:10px;}
.arwBtnList li {position:relative; padding:12px 40px 12px 32px; font-size:16px; color:#222; text-align:left;}
.arwBtnList .icoBtn_arrow {position:absolute; top:0; right:0; width:100%; height:48px;}
.arwBtnList .icoBtn_arrow:after {left:inherit; right:6px;}
.arwBtnList .icoBtn_infoPop + .icoBtn_arrow {width:36px;}

/* 작은 아이콘 */
.icoS {display:inline-block; width:24px; height:24px; margin-right:4px; border-radius:50%; overflow:hidden; vertical-align:top;}
.icoXS {display:inline-block; width:14px; height:14px; margin-right:4px;}
li > .icoS {position:absolute; top:12px; left:0; margin-right:0;}

/* 메시지 Tip  */
.msgTip {display:inline-block; position:absolute; min-height:28px; padding:0 12px; border-radius:14px; background-color:#3d99e6; color:#fff; font-size:1.3rem; font-weight:300; line-height:28px; white-space:nowrap; z-index:0;}
.msgTip::before {content:''; position:absolute; right:14px; bottom:-5px; width:10px; height:10px; background-color:#3d99e6; transform:rotate(45deg) skew(10deg, 10deg); z-index:-1;}
.msgTip.over,
.msgTip.over:before {background-color:#e9473f;}

button.msgTip {padding-right:25px;}
button.msgTip::after {content:''; position:absolute; right:14px; top:50%; width:8px; height:8px; margin-left:3px; border:1px solid #fff; border-width:2px 2px 0 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:translateY(-50%) rotate(45deg);}
.btnArea .msgTip {top:-40px; right:16px;}
.btnArea .msgTip:first-child {left:16px; right:auto;}
.btnArea .msgTip:first-child:before {left:16px;}
.btnArea .msgTip.sticky {top:-10px;}

/* 오른쪽 화살표 full버튼 */
.btn_arrow {position:relative; display:flex; align-items:flex-start; flex-wrap:wrap; min-height:50px; line-height:1.3; padding:15px 24px 15px 17px; font-size:14px; color:#fff; font-weight:300; text-align:left; border-radius:10px; background:#715deb;}
.btn_arrow:after {content:''; position:absolute; right:15px; top:50%; width:8px; height:8px; border:1px solid #fff; border-width:0 1px 1px 0; transform:translate(-50%, -50%) rotate(-45deg); transition:transform 0.25s;}
.btn_arrow.gray {color:#666; border-radius:0; background:#f8f8f8;}
.btn_arrow.gray:after {border-color:transparent #bbb #bbb transparent;}
.btn_arrow em {display:block; width:100%; margin-bottom:3px; color:#222;}
.btn_arrow .txt {margin-bottom:0; margin-left:6px; max-width:calc(100% - 90px); }
.btn_arrow .ico {width:24px; height:24px; margin-right:10px;}
.btn_arrow .ico + .txt em {margin-bottom:10px;}
.btn_arrow.new {padding-left:66px;}
.btn_arrow.new em {position:absolute; top:15px; left:18px; width:auto; color:#fff;}
.btn_arrow.lg {min-height:72px; align-items:center; padding:26px 40px 26px 26px; border-radius:4px; box-shadow:4px 4px 18px rgba(0,0,0,0.08);}

.bgGrayArea .btn_arrow {color:#666; background-color:#fff;}
.bgGrayArea .btn_arrow:after {border-color:#bcbcbc;}
.btn_arrow + .titArea {margin-top:24px;}
.content > .btn_arrow:first-child {margin-top:0; margin-bottom:24px;}

/* 인증센터  버튼 */
.btnCert {position:absolute; right:16px; bottom:72px; width:68px; height:68px; padding-top:12px; border:1px solid #678ffb; border-radius:50%; color:#445fe6; font-size:13px; font-weight:500; background-color:#fff; background-image:url(../../assets/images/smart/content/ico_certifi_center.png); background-size:14px 16px; background-repeat:no-repeat; background-position:center 12px; box-shadow:0 6px 9px rgba(93,136,251,0.1);}
.btnCert:only-child {bottom:20px;}


/*================================================== A Link ==================================================*/
/* links */
.links {display:inline-block; position:relative; margin:0 5px; color:#445fe6; font-size:inherit; white-space:nowrap;}
.links:after {content:''; position:absolute; left:0; right:0; bottom:0; border-bottom:1px solid #445fe6; transition:all 0.15s ease-in-out;}
.links.b {color:#222;}
.links.b:after {border-color:#222;}

/* links + 오른쪽 화살표 */
.links.arrow {padding-right:11px; font-size:1.6rem; vertical-align:middle;}
.links.arrow::before {content:''; position:absolute; right:0; top:50%; width:8px; height:8px; border:1px solid #4560e6; border-width:1px 1px 0 0; box-sizing:border-box; transform:translateY(-50%) rotate(45deg); z-index:1;}
.links.arrow::after {content:none;}
.links.arrow.info {padding-left:18px;}
.links.arrow.info::after {content:'!'; left:0; top:50%; width:14px; height:14px; border-radius:50%; background-color:#715deb; border:none; color:#fff; font-size:13px; font-weight:700; font-family:'Dotum', '돋움'; line-height:14px; text-align:center; transform:translateY(-50%);}


/*================================================== Text List ==================================================*/
/* 공통 */
.txtList {margin-bottom:20px; color:#666; line-height:1.6; word-break:keep-all;}
.txtList > li {position:relative; margin-top:15px; color:inherit; text-align:left;}
.txtList > li:first-child {margin-top:0 !important;}
.txtList > li:before,
.txtList:not(ol):not(ul):before {position:absolute; left:0;}
.txtList:not(ol):not(ul) {position:relative; margin-top:1rem; text-align:left;}
.txtList.mm, .txtList.mm > li {font-size:1.5rem;}/* 230329 추가 */
.txtList.mm > li + li {margin-top:8px;}/* 230329 추가 */
.txtList.sm > li {font-size:1.4rem;}
.txtList.sm > li + li {margin-top:8px;}

.txtList.div_2 {font-size:0;}
.txtList.div_2 > li {display:inline-block; width:50%; font-size:1.6rem; vertical-align:top;}
.txtList.div_2 > li:first-child {margin-top:8px !important;}

/* finish */
.txtList > li.finish {padding-right:24px;}
.txtList > li.finish:after {content:''; position:absolute; top:3px; right:5px; width:8px; height:12px; border:1px solid transparent; border-width:0 2px 2px 0; border-color:#3e9100; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}

/* 숫자 */
.txtList.numL {margin-top:16px; margin-bottom:24px; padding-left:20px;}
.txtList.numL > li {margin-top:12px; list-style:decimal;}

.txtList.numM {margin-top:12px; counter-reset:count;}
.txtList.numM > li {margin-top:8px; padding-left:28px;}
.txtList.numM > li:before {content:'('counter(count)')'; counter-increment:count; top:0; width:auto; height:auto; font-size:1.5rem; z-index:1;}
.txtList.numM .basicC1 {margin-bottom:8px;}
.txtList.numM .txt {margin-bottom:16px; color:#666;}
.txtList.numM .txtList.dash {margin:7px 0 16px;}
.txtList.numM .txtList.dash > li {margin-top:0;}

.txtList.numS {margin-top:12px; counter-reset:count;}
.txtList.numS > li {margin-top:8px; padding-left:20px;}
.txtList.numS > li:before {content:counter(count); counter-increment:count; top:5px; width:13px; height:14px; padding-right:1px; border:1px solid #666; border-radius:50%; font-size:10px; letter-spacing:-0.075rem; line-height:13px; text-align:center; z-index:1;}
.txtS .txtList.numS > li:before {top:3px;}

/* disc */
.txtList.disc > li {margin-top:8px; padding-left:12px;}
.txtList.disc > li:before,
.txtList.disc:not(ul):before {content:''; top:10px; width:4px; height:4px; border-radius:50%; background-color:#666;}
.txtList.disc:not(ul) {padding-left:12px;}
.txtList.disc li > .txtList {font-size:1.4rem;}
.txtList.disc.sm {margin-bottom:8px;}
.txtList.disc.sm:not(ol):not(ul),
.txtList.disc.sm > li {padding-left:10px; font-size:1.4rem;}
.txtList.disc.sm > li + li {margin-top:4px;}
.txtList.disc.sm > li:before,
.txtList.disc.sm:not(ol):not(ul):before{width:2px; height:2px;}

/* dot */
.txtList.dot {color:#222;}
.txtList.dot > li {margin-top:24px; padding-left:12px;}
.txtList.dot > li:before,
.txtList.dot:not(ul):before {content:''; top:10px; width:4px; height:4px; border-radius:50%; background-color:#715deb;}
.txtList.dot:not(ul) {margin-top:24px; padding-left:12px;}

/* dash */
.txtList.dash > li {margin-top:7px; padding-left:14px;}
.txtList.dash > li:before,
.txtList.dash:not(ul):before {content:''; top:12px; width:6px; height:1px; background-color:#666;}
.txtList.dash:not(ul) {padding-left:14px;}
.txtList.dash.sm:not(ol):not(ul),
.txtList.dash.sm > li{padding-left:10px; font-size:1.4rem;}
.txtList.dash.sm > li + li {margin-top:2px;}/* 230329 추가 */
.txtList.dash.sm > li:before,
.txtList.dash.sm:not(ul):before {top:10px;}

/* reference mark(※ : 참조문헌) */
.txtList.remark {margin:8px 0 2px; font-size:1.4rem; line-height:1.5;}
.txtList.remark > li {margin-top:7px; padding-left:18px;}
.txtList.remark > li:before,
.txtList.remark:not(ul):before {content:'※'; top:0;}
.txtList.remark:not(ul) {padding-left:18px;}
.txtList.remark .links {font-size:1.4rem; vertical-align:baseline;}

/* star */
.txtList.star {margin:8px 0 2px; font-size:14px; line-height:1.5;}
.txtList.star > li {margin-top:7px; padding-left:18px;}
.txtList.star > li:before,
.txtList.star:not(ul):before {content:'*'; left:2px; top:3px;}
.txtList.star:not(ul) {padding-left:18px;}
.txtList.star .links {font-size:14px; vertical-align:baseline;}
.txtList.star.red > li:before,
.txtList.star.red:not(ul):before {color:#e91b10;}
.txtList.star li.noMark {padding-left:0;}
.txtList.star li.noMark:before {content:none;}
.txtSign.star {padding-left: 15px !important; position: relative;}
.txtSign.star:before {position: absolute; top: 0px; left: 0px; color:#445fe6; content:"*"}


/* check */
.txtList.check {margin:8px 0 2px; font-size:1.6rem; line-height:1.5; color:#222;}
.txtList.check > li {margin-top:24px; padding-left:24px;}
.txtList.check > li:before,
.txtList.check:not(ul):before {content:''; position:absolute; top:3px; left:5px; width:8px; height:12px; border:1px solid transparent; border-width:0 2px 2px 0; border-color:#00a3bb; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}
.txtList.check:not(ul) {padding-left:18px;}

/* caution */
.txtList.caution {margin:5px 0; padding-left:20px; color:#3e9100; font-size:14px; line-height:1.5; word-break:normal;}
.txtList.caution:before {content:'!'; top:3px; width:14px; height:14px; border-radius:50%; border:1px solid #3e9100; color:#3e9100; font-family:'Dotum', '돋움'; font-size:12px; font-weight:700; line-height:14px; text-align:center;}
.txtList.caution.bgP {color:#666;}
.txtList.caution.bgP:before {color:#fff; background-color:#715deb; border-color:#715deb; }
.txtList.caution.bgG {color:#666;}
.txtList.caution.bgG:before {border-color:#666; color:#666;}

/* step */
.txtList.step {position:relative; margin:20px 0; counter-reset:count;}
.txtList.step:before {content:''; position:absolute; top:0; left:12px; bottom:0; border-left:1px solid #eee;}
.txtList.step > li {margin-top:25px; padding-left:34px; color:#222;}
.txtList.step > li:before {content:counter(count); counter-increment:count; top:-1px; width:27px; height:27px; text-align:center; line-height:27px; color:#445fe6; font-size:13px; font-weight:500; background-color:#f2f6ff; border-radius:50%; z-index:1;}
.txtList.step > li:last-child:after {content:''; position:absolute; top:0; left:12px; bottom:0; border-left:1px solid #fff;}
.txtList.step .links.arrow {margin:5px 0; font-size:1.3rem;}
.txtList.step.lg {font-size:1.4rem;}
.txtList.step.lg:before,
.txtList.step.lg > li:last-child:after {left:18px;}
.txtList.step.lg > li {margin-top:30px; padding-left:48px; color:#666;}
.txtList.step.lg > li [class*=titH] {display:block; margin-bottom:5px;}
.txtList.step.lg > li:before {width:36px; height:36px; line-height:36px; font-size:1.6rem;}
.txtList.step.lg > li.p:before {background-color:#5d88fb; color:#fff;}
.txtList.step.txtS > li:before {top:-3px;}

/* step : 박스형태 (s) */
.txtList.step.bl:before {top:25px;left:33px;border-left: 1px solid #b6caff; z-index:1;}
.txtList.step.bl > li {position:relative;margin-top: 15px; color: #445fe6;background-color:#f7f9ff;padding: 20px 20px 20px 60px;}
.txtList.step.bl > li:before {top: 20px;left: 20px;color: #fff; background-color: #5d88fb; z-index:3;}
.txtList.step.bl > li:first-child {margin-bottom:50px;}
.txtList.step.bl > li:last-child:after {top: 25px;left: 33px;border-left: 1px solid #f2f6ff; z-index:2;}
.txtList.step.bl > li .pushHistory {position:absolute; left: 55px; bottom:-38px;}
.txtList.step.bl > li .pushHistory:before {content: '';position: absolute;left: -21px;top: 12px;width: 30px;height: 1px;background-color: #b6caff;}
.txtList.step.bl > li .pushHistory .date {font-size: 1.5rem;}
/* step : 박스형태 (e) */

/* 한글 */
.txtList.hangul > li {margin-top:8px; padding-left:20px;}
.txtList.hangul > li > .count {position:absolute; top:0; left:0;}

.accoBody .txtList.step > li:before {background-color:#fff;}
.accoBody .txtList.step > li:last-child:after {border-color:#f8f8f8;}

/* stepbox */
.txtList.stepBox {margin-top:20px; margin-bottom:0;}
.txtList.stepBox > li {position:relative; margin-top:8px; padding:26px 10px 24px 95px; color:#222; font-weight:500; border:1px solid #dad5f9; border-radius:10px; background:#fff; box-shadow:2px 2px 4px rgba(31,25,67,0.10);}
.txtList.stepBox .step {position:absolute; top:50%; left:15px; width:72px; height:29px; text-align:center; line-height:29px; font-size:1.4rem; color:#5642bf; border-radius:15px; background:#f2f6ff; transform:translateY(-50%);}

/* progress */
.txtList.prog {position:relative; margin-top:15px; }
.txtList.prog:before {content:''; position:absolute; top:10px; left:5px; bottom:0; border-left:1px solid #ddd;}
.txtList.prog > li {position:relative; padding-left:18px;}
.txtList.prog > li:before {content:''; position:absolute; top:8px; left:2px; width:8px; height:8px; border:2px solid #715deb; background-color:#fff; border-radius:50%; box-sizing:border-box; z-index:1;}
.txtList.prog > li:last-child:after {content:''; position:absolute; top:10px; left:5px; bottom:0; border-left:1px solid #fff;}
.txtList.prog > li .tit,
.txtList.prog > li .desc {display:block;}
.txtList.prog > li .tit {margin-bottom:2px; color:#5642bf; font-weight:500;}
.txtList.prog li.ok .tit {color:#00a3bb;}
.txtList.prog li.ok:before {border-color:#1eaec3;}
.txtList.prog li.re .tit {color:#e91b10;}
.txtList.prog li.re:before {border-color:#e91b10;}
.accoBody .txtList.prog > li:last-child:after {border-color:#f8f8f8;}

/* ling */
.txtList.ling {margin-top:14px;}
.txtList.ling > li {position:relative; margin-top:0; padding-bottom:20px; padding-left:27px; color:#222}
.txtList.ling > li:after {content:""; position:absolute; top:7px; left:0; width:11px; height:11px; border:2px solid #5d88fb; background-color:#fff; box-shadow:6px 6px 5px rgba(93,136,251,0.08); border-radius:50%; box-sizing:border-box; z-index:1;}
.txtList.ling > li:before {content:''; top:10px; left:5px; height:100%; border-left:1px solid #e8ecff;}
.txtList.ling > li:last-child:before {border-left:none;}
ol.txtList.ling {counter-reset: count;}
ol.txtList.ling > li {padding-left:55px;}
ol.txtList.ling > li:before {content:'0'counter(count)'.'; counter-increment:count; width:41px; font-size:1.6rem; line-height:0.5; text-align:right;}


/* 간격 */
.txtList .txtList {margin-top:8px;}
.txtList.sm .txtList {margin-top:4px;}

/* icon */
.txtList[class*=icon] > li {position:relative; padding-left:40px;}
.txtList[class*=icon] > li:not(:last-child):after {content:""; position:absolute; top:20px; bottom:-30px; left:12px; width:1px; background:url(../../assets/images/smart/content/bg_border_dotted.png) repeat-y 0 0;}
.txtList[class*=icon] [class^=ico] {position:absolute; left:0; z-index:1;}
.txtList[class*=icon] .icoS {top:5px;}
.txtList[class*=icon] .icoL {top:-3px;}
.txtList[class*=icon] .tit {color:#222; font-weight:500;}
.txtList[class*=icon] .txtList {color:#222;}
.txtList.iconL > li {margin-top:30px; padding-left:64px;}
.txtList.iconL > li:not(:last-child):after {display:none;}

/* rhombus */
.txtList.rhombus {padding-left: 16px; position: relative;}
.txtList.rhombus:before {position: absolute; content: '◇'; top: 0; left: 0px; color:#666;}

/*================================================== Form ==================================================*/
.sign {display:inline-block; width:16px; margin:0; color:#222; font-size:16px; font-weight:300; line-height:44px; text-align:center; vertical-align:middle;}
.space {width:0; margin:0 4px 0 3px; vertical-align:middle;}

/* basic */
.ipt {width:100%; height:44px; padding:0 15px; border:1px solid #ccc; border-radius:4px; background-color:#fff; transition:border-color ease-in-out 0.225s, box-shadow ease-in-out 0.225s;}

textarea.ipt {width:100%; min-height:150px; margin:4px 0; padding:15px; line-height:1.5;}
textarea.ipt.lg {min-height:280px;}

.ipt:focus {border-color:#5d88fb; box-shadow:2px 2px 4px rgba(93,136,251,0.16); outline:rgba(0,0,0,0);}
.ipt[disabled] {border-color:#eee; background-color:#f8f8f8 !important; color:#8a8a8a;}
.ipt[readonly] {background-color:#f8f8f8 !important;}
.ipt[readonly]:focus {border-color:#ccc !important; box-shadow:none;}

.digital .ipt[disabled] {border-color:#ccc; background-color:#f1f1f1 !important; color:#8a8a8a;}

/* error & success */
.ipt.error {border-color:#e9473f !important; color:#e9473f;}
.ipt.error:focus {border-color:#e9473f; box-shadow:2px 4px 6px rgba(233,71,63,0.12);}
.ipt.success {border-color:#7ec04d;}

/* field관련 메시지 */
.fieldMsg {margin-top:5px; color:#666; font-size:14px;}
.fieldMsg.error {color:#e9473f;}
.fieldMsg.success {color:#7ec04d;}

/* iptWrap 사이즈 정의 */
.iptWrap,
.keypad,
.selectWrap {display:inline-block; position:relative; width:100%; margin:4px 0; vertical-align:middle;}

/* 삭제버튼 */
.iptWrap .icoBtn_del {visibility:hidden; position:absolute; right:1px !important; top:50% !important; width:32px; height:32px; border:8px solid #fff; border-radius:50%; box-shadow:inset 0px 0px 0px 12px #715deb; transform:translateY(-50%);}
.iptWrap .icoBtn_del:before,
.iptWrap .icoBtn_del:after {content:''; position:absolute; left:50%; top:50%; width:2px; height:10px !important; background-color:#fff !important; transform:translate(-50%, -50%) rotate(45deg);}
.iptWrap .icoBtn_del:after {transform:translate(-50%, -50%) rotate(135deg);}

.iptWrap.on .icoBtn_del {visibility:visible;}
.iptWrap.on:not(.date) .ipt:focus {padding-right:33px;}
.iptWrap .ipt[disabled],
.iptWrap .ipt[readonly] {padding-right:15px;}
.iptWrap.date .icoBtn_del,
.ipt[disabled] + .icoBtn_del,
.ipt[readonly] + .icoBtn_del {visibility:hidden;}
.iptWrap.date .ipt::-webkit-calendar-picker-indicator {padding:0; margin:0}

/* select 버튼 */
select.ipt {padding:0 40px 0 15px; background:#fff url(../../assets/images/smart/common/ico_arrow_down.svg) no-repeat right 8px center;}
select.ipt:focus {box-shadow:none;}
/* select.ipt[disabled] {filter:opacity(0.5);} */

.selectWrap .selectBtn {display:block; position:absolute; left:0; top:0; bottom:0; width:100%; z-index:2;}
.selectWrap.on {z-index:2;}
.selectWrap.on select.ipt {color:#445fe6 !important;}

/* 단위 */
.iptWrap span.unit {position:absolute; right:0; top:50%; padding:0 14px 0 5px; font-size:16px; font-weight:300; transform:translateY(-50%);}
.iptWrap .ipt.front ~ span.unit {left:0; right:auto; padding:0 5px 0 15px;}
.iptWrap.on .ipt:focus:not(.front) ~ .unit {display:none}
.iptWrap.on .ipt[disabled]:focus ~ .unit,
.iptWrap.on .ipt[readonly]:focus ~ .unit {display:inline-block;}
.iptWrap .ipt.unit:not(.front) {text-align:right;}
.iptWrap .ipt.unit:not(.front)::placeholder {text-align:right;}
.iptWrap .ipt.unit:not(.front)::-webkit-input-placeholder {text-align:right;}
.iptWrap .ipt.unit:not(.front):-ms-input-placeholder {text-align:right;}

.iptWrap .count {position:absolute; right:0; top:1px; padding:0 14px 0 5px; color:#c48100; font-size:12px; line-height:43px;}
.iptWrap textarea.ipt {margin:0;}
.iptWrap .byteTxt {position:absolute; right:20px; bottom:10px; font-size:12px;}

/* 이메일 */
.ipt[type=email] {width:100%; margin:4px 0;}
.mailtip {margin-top:5px !important; border:1px solid #0083cd; border-radius:8px; background-color:#fff; font-size:14px; text-align:left; overflow:hidden; box-shadow:2px 4px 8px rgba(0,0,0,0.1); zoom:1; z-index: 1000 !important}
.mailtip > li.active {background-color:#ecfeff; color:#0083cd;}
.mailtip > li.hover {background-color:#ecfeff; color:#0083cd; font-weight:500;}
.mailtip p {margin:0 9px; padding:8px 5px; text-align:left; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; cursor:pointer;}

/* 파일첨부 */
label.fileAttach {cursor: pointer;}
label.fileAttach + input[type=file] {display:none;}
.ipt[type=file] {width:100%; margin:4px 0; padding:0; background-color:#F8F8F8;}
.ipt[type=file]::-webkit-file-upload-button {height:42px; margin:0 15px 0 0; padding:0 15px; border:0; border-right:1px solid #ccc; background-color:#eee;}
.ipt[type=file]::-ms-value {border:0; border-radius:6px; background-color:#F8F8F8;}
.ipt[type=file]::-ms-browse {border:none; border-left:1px solid #ddd; background-color:#eee; box-shadow:none;}
.ipt[type=file]::file-selector-button {height:42px; margin:0 15px 0 0; padding:0 15px; border:0; border-right:1px solid #ccc; background-color:#eee;}

/* body .ipt[type=password] {padding-left:9px; padding-bottom:5px; font-size:40px; font-family:caption; letter-spacing:-0.08em;}
.ipt[type=password]::-webkit-input-placeholder {font-size:14px; font-family:'OneShinhan', '원신한', 'Malgun Gothic', 'Dotum', '돋움', 'gulim', '굴림', Helvetica, sans-serif; letter-spacing:0; transform:translateY(-30%);}
.ipt[type=password]::-moz-placeholder {font-size:14px; letter-spacing:0;}
.ipt[type=password]::-ms-input-placeholder {font-size:14px; letter-spacing:-0.25em;} */

/* 보안키패드 */
.ipt[type=password] {padding:0 12px 4px; font-size:40px; font-family:'Malgun Gothic', 'Dotum', '돋움', 'gulim', '굴림', Helvetica, sans-serif; letter-spacing:-0.05em; line-height:42px;}
.ipt[type=password]::placeholder {padding-bottom:7px; font-size:14px; font-family:'OneShinhan', '원신한', 'Malgun Gothic', 'Dotum', '돋움', 'gulim', '굴림', Helvetica, sans-serif; letter-spacing:0; /* for test : border:1px solid red;*/}

.isDevice .ipt[type=password] {font-family:caption, sans-serif; font-size:50px;}
.isDevice .ipt[type=password]::placeholder {font-family:caption, sans-serif; letter-spacing:0;}
.isDevice .certiIpt .keypad .ipt[type=password] {padding:0 0 15px 0 !important; font-size:58px; letter-spacing:0.07em;}
.isDevice .certiIpt .keypad .block .ipt[type=password] {padding:0 0 17px 0 !important; font-size:50px;}
.isDevice .certiIpt .keypad .ipt[type=password]::placeholder {padding:0 0 0 0 !important; font-size:20px; letter-spacing:0.3em; transform:translate(0, -7px);}
.isDevice .certiIpt .keypad .block .ipt[type=password]::placeholder {padding:0 0 0 0 !important; font-size:15px; transform:translate(0, -6px);}
.isDevice .setCard.security .keypad .ipt[type=password] {font-size:35px; letter-spacing:0;}

.isDevice.isIOS .ipt[type=password] {font-size:20px; padding-bottom:0; padding-top:4px;}
.isDevice.isIOS .certiIpt .keypad .ipt[type=password] {padding:3px 0 0 0 !important; font-size:24px; letter-spacing:0.07em;}
.isDevice.isIOS .certiIpt .keypad .block .ipt[type=password] {padding:3px 0 0 0 !important; font-size:18px;}
.isDevice.isIOS .certiIpt .keypad .ipt[type=password]::placeholder {padding:0 0 0 0 !important; font-size:24px; letter-spacing:0.07em; transform:translate(0, 1px);}
.isDevice.isIOS .certiIpt .keypad .block .ipt[type=password]::placeholder {padding:0 0 0 0 !important; font-size:18px; transform:translate(0, 1px);}
.isDevice.isIOS .setCard.security .keypad .ipt[type=password] {font-size:14px; letter-spacing:0; padding-bottom:0 !important; transform:translate(0, -2px);}

.keypad .ipt[type=password]:not([readonly]) {border-color:#d6e1fe; background-color:#f2f6ff;}
.keypad .icoBtn_keypad {position:absolute; right:0; top:1px;}
.keypad .ipt[disabled] + .icoBtn_keypad,
.keypad .ipt[readonly] + .icoBtn_keypad {display:none;}

/* 주민등록번호 뒤 1자리 */
.setHalf .keypad.letter1:after {content:'******'; padding-left:5px; color:#222; font-size:14px; letter-spacing:1px; vertical-align:middle; speak:none;}
.setHalf .keypad.letter1 .ipt {width:44px;}
.setHalf .keypad.letter1 .ipt[type=password] {width:50%;}
.setHalf .keypad.letter1 .icoBtn_keypad {left:auto; right:50%; margin-right:0;}

/* 카드 비밀번호 앞 2자리 */
.keypad.letter2 {padding-right:16px;}
.keypad.letter2:after {content:'**'; position:absolute; top:50%; left:55%; padding-top:2px; color:#222; font-size:14px; letter-spacing:0.5rem; transform:translateY(-50%);}
.keypad.letter2 .ipt {width:50%;}
.keypad.letter2 .icoBtn_keypad {right:50%; margin-right:8px;}

/* 그룹 서식 */
[class^=set] {display:inline-block; width:100%; position:relative; margin:4px 0; vertical-align:middle;}
[class^=set]:after {display:block; content:''; clear:both;}
[class^=set] .iptWrap,
[class^=set] .keypad {margin:0;}

/* 양분 기본 */
.setHalf {display:block; width:auto; margin:0 -8px; font-size:0;}
.setHalf .sign {position:absolute; left:50%; margin:4px 0; transform:translateX(-50%);}
.setHalf .iptWrap,
.setHalf .keypad,
.setHalf .selectWrap {float:left; width:calc(50% - 16px); margin:4px 8px;}
.setHalf .iptWrap .icoBtn_del {right:10px;}
/* .setHalf .keypad .icoBtn_keypad {margin-right:7px;} */
.setHalf > *:first-child:nth-last-child(2) {width:calc(50% - 12px); margin-right:4px;}
.setHalf > *:last-child:nth-child(2) {width:calc(50% - 12px); margin-left:4px;}

.setRatio {display:flex; width:auto;}
.setRatio > *:first-child {min-width:35%; width:auto; margin-right:8px;}

/* 삼등분  */
.setHalf.div_3 {margin:0 -4px;}
.setHalf.div_3 .selectWrap {width:calc(33.3% - 8px); margin:4px 4px;}

/* 어린이보험 강제 분할값지정  */
div.iptChild02 {width: 12px !important; position: absolute; left: calc(50% + 20px); bottom: 0px; margin: 4px 0px !important; z-index: 1;}
.iptChild02 .ipt { padding: 0px 0px !important; border: 0px; background-color: transparent !important;}
.iptChild03 .ipt[type=password] {padding-left: 24px;}

/* 전화번호 230621-웹접근성으로 인해 수정 */
.setPhone {font-size:0; text-align:left; width: 100%; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; background-color: #fff; transition:border-color ease-in-out 0.225s, box-shadow ease-in-out 0.225s;}
.setPhone.readonlyBox,
.setPhone.readonlyBox select.ipt {background-color:#f8f8f8;}
.setPhone .selectWrap {width:33% !important;margin:0 5px 0 0;border-right:1px solid #ccc;}
.setPhone .selectWrap select.ipt {border:none;}
.setPhone .ipt[type=tel] {width:28.5%; height:34px; padding:0; line-height:34px; text-align:center;border:none;}
.setPhone .ipt[type=tel]:focus {box-shadow:none !important; outline:rgba(0,0,0,0);}
.setPhone .ipt[readonly] {border-color:#ccc !important; box-shadow:none !important;}

/* 입력서식 + 버튼 */
.setBtnAdd {display:inline-flex; flex-direction:row; flex-wrap:nowrap; margin:4px 0; align-items:center;}
.setBtnAdd > .ipt,
.setBtnAdd .iptWrap {flex-grow:1;}
.setBtnAdd .setCount {margin:0;}
.setBtnAdd [class^=btn_].m {flex-grow:0; width:auto; margin:0 0 0 8px !important; padding:5px 20px; white-space:nowrap;}

/* 주소입력 */
.setAddr {margin:0;}
.setAddr .iptWrap {margin:4px 0;}

/* 인증번호 */
.setCount {width:100%; margin:4px 0;}
.setCount .ipt {padding-right:60px;}
.setCount .count {position:absolute; top:0; right:15px; color:#c48100; font-size:12px; line-height:44px;}

/* 카드번호 */
.setCard {width:100%; margin:4px 0; padding-left:10px; font-size:0; text-align:left;}
.setCard .ipt:not(:last-of-type),
.setCard .sign {position:relative; border:0; border-radius:0; background-color:transparent !important; z-index:1;}
.setCard .ipt:not(:last-of-type) {width:51px; height:34px; padding:0; line-height:34px; text-align:center; z-index:2;}
.setCard .ipt:last-of-type {position:absolute; left:0; top:0; padding-left:214px; z-index:0;}
.setCard .ipt:not(:last-of-type):focus {/*background-color:#ebf4fc !important;*/ box-shadow:none !important;}
.setCard .ipt:focus ~ .ipt:last-of-type {border-color:#0083cd; box-shadow:2px 2px 4px rgba(93,136,251,0.16); outline:rgba(0,0,0,0);}

/* 카드번호 보안키패드 */
.setCard.security {display:flex; align-items:center; padding:0 10px; border:1px solid #ccc; border-radius:4px; overflow:hidden; transition:border-color ease-in-out 0.225s, box-shadow ease-in-out 0.225s;}
.setCard.security .ipt {width:25%;}
.setCard.security .ipt:last-of-type {position:static; /*width:51px;*/ height:34px; padding:0 !important; text-align:center; border:none; box-shadow:none !important; border-radius:0;}
.setCard.security .ipt:last-of-type:focus {border-radius:0;}
.setCard.security .keypad {width:25%; /*width:71px;*/ z-index:2;}
.setCard.security .keypad .ipt {position:static; width:100% !important; height:34px; padding:0 0 4px 0 !important; text-align:center; letter-spacing: -0.12em; border:none; background-color:transparent; box-shadow:none !important;}
.setCard.security .keypad .ipt:focus {border-radius:0;}
.setCard.security .keypad .icoBtn_keypad {display:block !important; top:0; width:20px; height:34px; background:#fff url(../../assets/images/smart/common/ico_ipt_keypad.svg) no-repeat center center; background-size:16px;}
/* script focus */
.setCard.security.on {border-color:#5d88fb; box-shadow:2px 2px 4px rgba(93,136,251,0.16); outline:rgba(0,0,0,0);}

.setCard.security.useIcon .ipt {width:51px;}
.setCard.security.useIcon .keypad {width:71px;}
.setCard.security.useIcon .keypad .ipt {padding:0 20px 4px 0 !important;}

/* 납세자번호(TIN) & 사업자등록번호 */
.setNum {width:100%; margin:4px 0; padding-left:10px; font-size:0; text-align:left;}
.setNum .ipt:not(:last-of-type),
.setNum .sign {position:relative; border:0; border-radius:0; background-color:transparent !important; z-index:1;}
.setNum .ipt:not(:last-of-type) {width:20%; height:34px; padding:0; line-height:34px; text-align:center; z-index:2;}
.setNum .ipt:last-of-type {position:absolute; left:0; top:0; padding-left:58%; z-index:0;}
.setNum .ipt:not(:last-of-type):focus {/*background-color:#ebf4fc !important;*/ box-shadow:none !important;}
.setNum .ipt:focus ~ .ipt:last-of-type {border-color:#0083cd; box-shadow:2px 2px 4px rgba(93,136,251,0.16); outline:rgba(0,0,0,0);}

/* 운전면허번호 */
.setDriver {width:100%; margin:4px 0; font-size:0; text-align:left;}
.setDriver .selectWrap {margin:0 0 8px;}
.setDriver input.ipt:not(:last-of-type),
.setDriver .sign {position:relative; border:0; border-radius:0; background-color:transparent !important; z-index:1;}
.setDriver input.ipt:not(:last-of-type) {height:34px; padding:0; line-height:34px; text-align:center; z-index:2;}
.setDriver input.ipt:nth-of-type(1) {width:15%; margin:0 10px;}
.setDriver input.ipt:nth-of-type(2) {width:30%; margin:0 10px;}
.setDriver input.ipt:last-of-type {position:absolute; left:0; bottom:0; width:100%; padding-left:74%; z-index:0;}
.setDriver input.ipt:not(:last-of-type):focus {/*background-color:#ebf4fc !important;*/ box-shadow:none !important;}
.setDriver .ipt:focus ~ input.ipt:last-of-type {border-color:#0083cd; box-shadow:2px 2px 4px rgba(93,136,251,0.16); outline:rgba(0,0,0,0);}
.setDriver .ipt[readonly] ~ input.ipt:last-of-type {border-color:#ccc !important; box-shadow:none !important;}
.setDriver .sign {margin:0 -2px;}
.setDriver .icoBtn_keypad {position:absolute; bottom:1px; right:0;}
.setDriver .ipt[readonly]:last-of-type {background:linear-gradient(to right, #fff 58%, #f8f8f8 70%) !important;}

/* 외국인등록증 일련번호 */
.serialNum .setDriver {padding: 5px 0;}
.serialNum .setDriver input.ipt {height:34px;padding:0;line-height:34px;text-align:center;padding: 0 10px; margin:0;z-index:2;}
.serialNum .setDriver input.ipt:nth-of-type(1) {width: 15%;margin-left: 2px;padding-left: 20px;}
.serialNum .setDriver input.ipt:nth-of-type(2) {width: 23%;}
.serialNum .setDriver input.ipt:nth-of-type(3) {width: 23%;}
.serialNum .setDriver input.ipt:last-of-type {position:absolute;left:0;bottom:0;padding-left: 74%;z-index:0;height: 44px;line-height: 44px;}
.serialNum .setDriver input.ipt:not(:last-of-type):focus,
.serialNum .setDriver input.ipt:not(:last-of-type):hover {background-color:#fff !important; box-shadow:none !important;}
.serialNum .setDriver .sign {line-height:34px;}
.serialNote .idCard {display:none;}
.serialNote .idCard img {width:165px;}
.serialNote.on .idCard {display:block;}
.serialNote.on .bgG::before {color: #fff; background-color: #715deb; border-color: #715deb;}
@media all and (max-width:280px) {
	.serialNum .setDriver input.ipt:nth-of-type(1) {padding-left: 12px;}
	.serialNum .setDriver input.ipt:last-of-type {padding-left: 77%;}
}

/* 디지털보험 운전면허번호 */
.digital .setDriver .selectWrap {width: 32%; z-index: 1; margin: 0;}   
.digital .setDriver select.ipt {border-top-right-radius: 0px; border-bottom-right-radius: 0px; background-position: right -1px center; font-size: 14px; letter-spacing: -0.5px; padding: 0 15px 0 15px;}
.digital .setDriver input.ipt:nth-of-type(1) {margin: 0 5px 0 10px; width: 14%;}
.digital .setDriver input.ipt:nth-of-type(2) {width: 25%; margin: 0 5px 0 0; border: none !important;}
.digital .setDriver input.ipt:last-of-type {padding-left: 88%; padding-right: 10px;}
.digital .setCard .keypad .ipt {border:none !important;}
.isDevice .digital .setDriver .ipt[type=password] {font-size:35px; padding-bottom: 10px;}
.isDevice.isIOS .digital .setDriver .ipt[type=password] {font-size:14px; letter-spacing:0; padding-bottom:0 !important; transform:translate(0, -2px);}

/* 달력 */
.ipt.date,
.ipt.month {background-color:#fff; background-image:url(../../assets/images/smart/common/ico_ipt_calendar.svg); background-repeat:no-repeat; background-position:right 6px top 9px; letter-spacing:-0.05rem; white-space: nowrap !important; font-size: 1.4rem !important;}
.ipt.date[disabled] + button,
.ipt.month[disabled] + button
.ipt.date[readonly] + button,
.ipt.month[readonly] + button {display:none;}

/* 추가입력 */
.addIpt {position:relative; display:inline-block; width:100%; margin:4px 0; padding-right:44px;}
.addIpt .iptWrap {margin:0;}
.addIpt .ico_del {position:absolute; top:0; right:0; width:44px; height:44px; min-width:44px;}

/* 추가입력영역 */
.addIptArea > .single {display:block; margin-top:32px; padding-bottom:13px; border-bottom:1px solid #222;}

/* GIIN 번호 */
.setCard.giin .ipt:nth-of-type(1) {width:25%;}
.setCard.giin .ipt:nth-of-type(2) {width:22%;}
.setCard.giin .ipt:nth-of-type(3) {width:17%}
.setCard.giin .ipt:last-of-type {padding-left:85%;}

/*================================================== Form - checkbox & radio ==================================================*/
.ipt[type=checkbox],
.ipt[type=radio] {position:absolute; top:auto; width:24px; min-width:auto; height:24px; margin:0; padding:0; opacity:0; z-index:-1;}
.ipt[type=checkbox] + label,
.ipt[type=radio] + label {display:inline-block; position:relative; padding-left:31px; color:#222; font-size:16px; line-height:1.6; vertical-align:middle; cursor:pointer; z-index:1;}
.ipt[type=checkbox] + label:before,
.ipt[type=radio] + label:before {content:''; position:absolute; top:1px; left:0; width:24px; height:24px; border:2px solid #ccc; border-radius:2px; background-color:#fff; overflow:hidden; box-sizing:border-box; transition:all ease-in-out 0.15s;}
.ipt[type=checkbox]:focus + label:before,
.ipt[type=radio]:focus + label:before {border-color:#1a75e4;}
.ipt[type=checkbox] + label.blind,
.ipt[type=radio] + label.blind {position:static !important; width:24px; height:24px; margin:0; padding:0 0 0 24px; overflow:hidden; clip-path:none;}

/* checkbox */
.ipt[type=checkbox] + label:after {content:''; position:absolute; top:4px; left:8px; width:8px; height:12px; border:1px solid transparent; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}
.ipt[type=checkbox]:checked + label:before {border-color:#5d88fb; background-color:#fff;}
.ipt[type=checkbox]:checked + label:after {border-color:#5d88fb;}
.ipt[type=checkbox]:checked:focus + label:before {background-color:#5d88fb;}
.ipt[type=checkbox]:checked:focus + label:after {border-color:#fff;}

/* checkbox lg */
.ipt + label.lg {min-height:24px; padding-left:31px; font-weight:500;}
.ipt + label.lg:before {border-radius:0; transition:none;}
.ipt:checked + label.lg:before {border-color:#715deb; background-color:#715deb;}
.ipt:checked + label.lg:after {left:9px; top:6px; width:7px; height:11px; border-color:#fff;}
.ipt:checked:focus + label.lg:before {background-color:#715deb; transition:none;}
.ipt:checked:focus + label.lg:after {border-color:#fff; transition:none;}
.ipt:focus + label.lg:before {border-color:#5642bf;}

/* checkbox sm */
.ipt[type=checkbox] + label.sm {min-height:21px; padding-left:20px; font-size:1.4rem; color:#666; vertical-align:top;}
.ipt[type=checkbox] + label.sm:before {border-color:transparent; background-color:transparent !important;}
.ipt[type=checkbox] + label.sm:after {top:3px; left:2px; border-color:transparent;} /* 230621-웹접근성으로 인해 수정 */
.ipt[type=checkbox]:checked + label.sm {color:#1a75e4;}
.ipt[type=checkbox]:checked + label.sm:after {border-color:#1d3574;}
.ipt[type=checkbox][disabled] + label.sm:before {border-color:transparent !important; background-color:transparent !important;}
.ipt[type=checkbox][disabled] + label.sm:after {border-color: transparent !important;}

/* checkbox 전체동의 */
.ipt + label.allChk {width:100%; min-height:48px; padding:10px 48px; border:1px solid #ddd; background-color:#fff; color:#222; font-size:16px; font-weight:300; text-align:left;}
.ipt + label.allChk:before {content:none;}
.ipt + label.allChk:after {left:20px !important; top:15px !important; width:9px !important; height:14px !important; border-color:#eee; border-width:0 3px 3px 0 !important; transition:none;}
.ipt:checked + label.allChk {border-color:#5642bf; color:#5642bf; box-shadow:3px 3px 6px rgba(86, 66, 191, .08); font-weight:500;}
.ipt:checked + label.allChk:after {border-color:#715deb !important;}
.ipt:focus + label.allChk {border-color:#5642bf;}

/* checkbox tit */
.ipt + label.tit {min-height:28px; padding-left:38px; color:#222; font-size:18px; font-weight:500;}
.ipt + label.tit:before {top:0; width:28px; height:28px; border-radius:0;}
.ipt:checked + label.tit:before {border-color:#5d88fb; background-color:#5d88fb;}
.ipt:checked + label.tit:after {left:10px; top:6px; width:8px; height:12px; border-color:#fff;}
.ipt:checked:focus + label.tit:before {background-color:#5d88fb; transition:none;}
.ipt:checked:focus + label.tit:after {border-color:#fff; transition:none;}
.ipt:focus + label.tit:before {border-color:#1a75e4;}

/* radio */
.ipt[type=radio] + label:before {border-radius:50%; transition:border 0.225s, box-shadow ease-in-out 0.225s;}
.ipt[type=radio]:checked + label:before {border-color:#5d88fb; background-color:#5d88fb; box-shadow:inset 0 0 0 4px #fff;}
.ipt[type=radio]:checked:focus + label:before {border-width:6px; background-color:#fff; /*box-shadow:inset 0 0 0 6px #0083cd;*/}

/* disabled */
.ipt[type=checkbox][disabled] + label,
.ipt[type=radio][disabled] + label,
.ipt[type=checkbox][readonly] + label, 
.ipt[type=radio][readonly] + label {color:#999; text-decoration:none; cursor:default;}
.ipt[type=checkbox][disabled] + label:before,
.ipt[type=radio][disabled] + label:before,
.ipt[type=checkbox][readonly] + label:before,
.ipt[type=radio][readonly] + label:before {border-color:#ddd !important; background-color:#eee !important;}
.ipt[type=checkbox][disabled]:checked + label:after,
.ipt[type=checkbox][readonly]:checked + label:after {border-color:#ccc !important;}
.ipt[type=radio][disabled]:checked + label:before,
.ipt[type=radio][readonly]:checked + label:before {background-color:#ccc !important; box-shadow:inset 0 0 0 4px #eee;}

/* single */
.single {display:inline-block; position:relative; margin:6px 0 4px; vertical-align:middle; overflow:hidden;}
.single .ipt + label {min-height:25px; margin-right:9px;}
.tblX .single {margin:0;}

.single.rvt label {margin-right:0; padding:0 31px 0 0;}
.single.rvt .ipt[type=checkbox] + label:before,
.single.rvt .ipt[type=radio] + label:before {left:auto; right:0;}
.single.rvt .ipt[type=checkbox] + label:after {left:auto; right:8px;}

/* 기본묶음 */
.iptGroup {vertical-align:middle;}
.iptGroup > li {display:inline-block; position:relative; margin:4px 10px 4px 0; font-size:0; vertical-align:top;}
.iptGroup.vertical > li {display:block; margin:22px 0;}
.formList .iptGroup.vertical > li {margin:10px 0;}
.iptGroup .ipt + label {font-size:16px;}
.iptGroup label + .tip {margin-left:5px;}
.iptGroup[class*=div_] {margin-right:-10px; font-size:0;}
.iptGroup[class*=div_] > li {margin-right:0; padding-right:10px; font-size:16px;}
.iptGroup.div_2 > li {width:50%;}
.iptGroup.div_3 > li {width:33.3333%;}
.iptGroup.div_4 > li {width:25%;}
.iptGroup.div_5 > li {width:20%;}

.iptGroup .iptWrap {margin:-10px 1px 8px 6px;}
.iptGroup.vertical > li .iptWrap,
.iptGroup > li.full .iptWrap {margin:10px 2px 4px 2px;}

/* 소팅 */
.iptSort {display:inline-block; vertical-align:middle; overflow:hidden;}
.iptSort > li {position:relative; display:inline-block; margin-left:14px; vertical-align:top;}
.iptSort > li:first-child {margin-left:0;}
.iptSort .ipt + label {padding-right:16px; padding-left:0; font-size:14px; color:#666;}
.iptSort .ipt + label:before {content:none;}
.iptSort .ipt + label:after {content:''; position:absolute; top:50%; right:0px; margin-top:-2px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid #ccc;}
.iptSort .ipt:checked + label {color:#1a75e4; font-weight:500;}
.iptSort .ipt:checked + label:after {border-top-color:#1a75e4;}

/* 필터 */
.iptFilt {position:relative; display:table; width:100%; margin:4px 0 16px; font-size:0; vertical-align:middle; table-layout:fixed; z-index:0;}
.iptFilt > li {display:table-cell; margin:0; text-align:center;}
.iptFilt .ipt + label {position:relative; min-width:100% !important; padding:2px 0 0; border:0; background-color:#fff; color:#666; font-size:14px; line-height:42px; vertical-align:middle;}
.iptFilt .ipt + label::before {content:none !important;}
.iptFilt .ipt + label::after {content:'';position:absolute; left:0; right:0; top:0; bottom:0; border:1px solid #ccc; border-width:1px 1px 1px 0;}
.iptFilt > li:first-child .ipt + label:after {border-width:1px; border-radius:4px 0 0 4px;}
.iptFilt > li:last-child .ipt + label:after {border-radius:0 4px 4px 0;}
.iptFilt > li:only-child .ipt + label:after {width:auto; height:auto; border-radius:4px; transform:none; transition:none;}
/* 230612 웹접근성으로 인해 추가 (s) */
.iptFilt > li:first-child .ipt + label {border-width:1px; border-radius:4px 0 0 4px;}
.iptFilt > li:last-child .ipt + label {border-radius:0 4px 4px 0;}
.iptFilt > li:only-child .ipt + label {width:auto; height:auto; border-radius:4px; transform:none; transition:none;}
/* 230612 웹접근성으로 인해 추가 (e) */
.iptFilt .ipt:checked + label {background-color:#5d88fb; color:#fff; font-weight:500; z-index:2;} /* 230612 웹접근성으로 인해 수정 */
.iptFilt .ipt.m:checked + label {background-color:#f2f6ff; color:#445fe6; font-weight:500; z-index:2;} /* 230612 웹접근성으로 인해 수정 */
/* .iptFilt .ipt:checked + label {background-color:#f2f6ff; color:#445fe6; font-weight:500; z-index:2;} 기존 */
.iptFilt .ipt:checked + label:after {left:-1px; border:1px solid #5d88fb;}
.iptFilt .ipt.m:checked + label:after {left:-1px; border:1px solid #5d88fb;}
/* .iptFilt .ipt[readonly] + label {color:#959595;}
.iptFilt .ipt[readonly]:checked + label {color:#222; background-color:#f8f8f8;}
.iptFilt .ipt[readonly]:checked + label:after {border-color:#ccc;} */
.iptFilt .ipt[disabled] + label {color:#959595; background-color:#f8f8f8;}
.iptFilt:not([class*=div_]) .ipt[disabled] + label:after {border-color:#eee;}
.iptFilt .ipt[disabled]:checked + label {color:#aaa; background-color:#eee;}
.iptFilt .ipt[disabled]:checked + label:after {border-color:#ddd;}
.iptFilt > li:first-child .ipt:checked + label:after {left:0;}
.iptFilt .ipt:focus + label:after {border-color:#000;}

.iptFilt.agency > li:nth-child(3) label:after {border-radius:0;}
.iptFilt.agency > li:last-child {width:125px;}
.iptFilt.agency .selectWrap {margin:0;}
.iptFilt.agency select.ipt {padding:0 30px 0 10px; border-radius:0 4px 4px 0; border-width:1px 1px 1px 0; color:#666; font-size:14px; line-height:43px;}
.iptFilt.agency .selectWrap.on {left:-1px;}
.iptFilt.agency .selectWrap.on select.ipt {border-color:#5d88fb; border-width:1px; background-color:#f2f6ff; color:#445fe6 !important;}

.iptFilt[class*=div_] {display:flex; flex-wrap:wrap; width:auto; padding:1px 0 0 1px;}
.iptFilt[class*=div_] > li {display:block; margin:-1px 0 0 -1px;}
.iptFilt[class*=div_] > li .ipt + label:after {left:0; border-radius:0; border-width:1px;}
.iptFilt.div_1 > li {width:100%;}
.iptFilt.div_2 {margin-right:-2px;}
.iptFilt.div_2 > li {width:50%;}
.iptFilt.div_2 > li.merge2 {width:calc(100% - 1px) !important;}
.iptFilt.div_3 {margin-right:-3px;}
.iptFilt.div_3 > li {width: 33.33333333333%;}
.iptFilt.div_3 > li.merge3 {width: calc(100% - 2px) !important;}

.iptFilt[class*=div_] > li.brtl .ipt + label:after {border-top-left-radius:4px;}
.iptFilt[class*=div_] > li.brtr .ipt + label:after {border-top-right-radius:4px;}
.iptFilt[class*=div_] > li.brbl .ipt + label:after {border-bottom-left-radius:4px;}
.iptFilt[class*=div_] > li.brbr .ipt + label:after {border-bottom-right-radius:4px;}

.iptFilt.div_1 > li:first-child .ipt + label:after {border-radius:4px 4px 0 0;}
.iptFilt.div_1 > li:last-child .ipt + label:after {border-radius:0 0 4px 4px;}

/* 230612 웹접근성으로 인해 추가 (s) */
.iptFilt[class*=div_] > li.brtl .ipt + label {border-top-left-radius:4px;}
.iptFilt[class*=div_] > li.brtr .ipt + label {border-top-right-radius:4px;}
.iptFilt[class*=div_] > li.brbl .ipt + label {border-bottom-left-radius:4px;}
.iptFilt[class*=div_] > li.brbr .ipt + label {border-bottom-right-radius:4px;}
.iptFilt.div_1 > li:first-child .ipt + label {border-radius:4px 4px 0 0;}
.iptFilt.div_1 > li:last-child .ipt + label {border-radius:0 0 4px 4px;}
/* 230612 웹접근성으로 인해 추가 (e) */

/* tab 스타일 */
.iptFilt.tab {margin-bottom:32px; background-color:#eee; border-radius:4px;}
.iptFilt.tab .ipt + label {padding:0; background-color:transparent; border:3px solid transparent;}
.iptFilt.tab .ipt + label:after {border-color:transparent;}
.iptFilt.tab .ipt:checked + label {color:#222;}
.iptFilt.tab .ipt:checked + label:after {background-color:#fff; border-radius:3px; z-index:-1;}

/* btn 스타일 */
.iptFilt.btn {display:flex; flex-wrap:wrap; width:calc(100% + 8px); margin:0 -4px 4px; gap:8px 0;}
.iptFilt.btn > li {display:inline-block; width:50%; padding:0 4px;}
.iptFilt.btn > li:last-child:nth-child(odd) {width:100%;}
.iptFilt.btn .selectWrap {margin:0;}
.iptFilt.btn select.ipt,
.iptFilt.btn .ipt + label {padding-top:0; color:#222; font-size:1.4rem; border:1px solid #ccc; border-radius:2px; background-color:#fff;}
.iptFilt.btn .ipt + label:after {display:none;}
.iptFilt.btn select.ipt.on,
.iptFilt.btn .ipt:checked + label {color:#5d88fb; font-weight:300; border-color:#5d88fb; background-color:#fff; text-decoration:none;}
.iptFilt.btn.ipblue .ipt + label {line-height: 36px;}
.iptFilt.btn.ipblue .ipt:checked + label {color:#fff;background-color:#5d88fb;}
div.iptFilt.btn .selectWrap {margin:4px 0; padding:0 4px;}

.iptFilt.bigblue.btn {width:calc(94% + 8px); margin: 0 auto; justify-content: center;}
.iptFilt.bigblue.btn > li {width: 48%;}
.iptFilt.bigblue.btn select.ipt,
.iptFilt.bigblue.btn .ipt + label {padding-top:0;color:#666;font-size:1.3rem;border:1px solid #ccc;background-color:#fff;border-radius: 10px;padding: 15px 0;line-height: inherit;}
.iptFilt.bigblue.btn .ipt + label .iptxt {display:block;margin-top: 5px;color:#666;font-size: 1.9rem;font-weight:500;}
.iptFilt.bigblue.btn .ipt + label:after {display:none;}
.iptFilt.bigblue.btn select.ipt.on,
.iptFilt.bigblue.btn .ipt:checked + label {border-color:#556de8; border-width:2.5px; background-color:#f2f6ff; text-decoration:none;} /* 230630-웹접근성 border-width */
.iptFilt.bigblue.btn select.ipt.on,
.iptFilt.bigblue.btn .ipt:checked + label .iptxt {color:#556de8;font-weight: 700;} /* 230630-웹접근성 font-weight */

.iptCheck > li {display:inline-block; position:relative; margin:4px 30px 4px 0; min-height:28px; font-size:0; vertical-align:top;}
.iptCheck .ipt + label {padding-left:36px;}
.iptCheck .ipt + label:before {content:'' !important; top:-1px !important; width:28px; height:28px; border:none; box-shadow:none; border-radius:50%; background-color:#f8f8f8; transition:all ease-in-out 0.15s;}
.iptCheck .ipt + label:after {content:''; position:absolute; top:5px; left:10px; width:8px; height:12px; border:1px solid #bbb; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}
.iptCheck .ipt:checked + label:before,
.iptCheck .ipt:checked:focus + label:before {border:none; box-shadow:none; background-color:#5d88fb !important;}
.iptCheck .ipt:checked + label:after {border-color:#fff;}

.iptCheck .ipt + label .tit {font-weight:500;}
.iptCheck .ipt + label .desc {display:block; margin-top:8px; color:#666; font-size:1.4rem;}

.iptCheck.vertical > li {display:block; margin:10px 0 0 0; text-align:left;}
.iptCheck.ac {margin-left:-10px !important; margin-right:-10px !important;}
.iptCheck.ac > li {margin:4px 10px;}
div.iptCheck {margin-top:10px;}

/* 추가 버튼 */
.btnItemAdd {display:block; width:100%; margin:8px 0; padding:100px 40px 36px; text-align:center; border-radius:8px; background:#f7f9ff url(../../assets/images/smart/content/item_add.svg) no-repeat center 40px;}
.btnItemAdd .tit {display:block; color:#445fe6; font-weight:500;}
.btnItemAdd .desc {display:block; margin-top:8px; font-size:14px; color:#222;}

.accoBody .btnItemAdd,
.bgGrayArea .btnItemAdd {background-color:#fff; background-image:url(../../assets/images/smart/content/item_add_w.svg); box-shadow:0 16px 37px rgba(0,0,0,0.06);}
.accoBody .btnItemAdd .tit,
.bgGrayArea .btnItemAdd .tit {color:#222;}
.accoBody .btnItemAdd .desc,
.bgGrayArea .btnItemAdd .desc {color:#666;}

/* 계좌 버튼 */
.btnAccount {position:relative; max-height:80px; min-height:44px; padding:16px 54px 16px 67px; margin:8px 0 32px; color:#222; border-radius:4px; border:1px solid #ccc;}
.btnAccount:after {content:''; position:absolute; right:21px; top:50%; width:9px; height:9px; margin-top:-2px; border:1px solid #222; border-width:0 0 2px 2px; vertical-align:-webkit-baseline-middle; transform:translate(-50%, -50%) rotate(-45deg); transition:transform 0.25s; box-sizing:border-box;}
.btnAccount .desc {position:absolute; top:50%; left:15px; right:50px; color:#959595; transform:translateY(-50%);}
.btnAccount.disabled {border-color:#eee; border-radius:0;}
.btnAccount.disabled:after {display:none;}

[class*=Account] .img {position:absolute; top:50%; left:15px; width:40px; height:40px; border-radius:50%; transform:translateY(-50%);}
[class*=Account] .img.empty {line-height:40px; color:#fff; background-image:url(../../assets/images/smart/common/bank_logo_non.svg); text-align:center;}
[class*=Account] [class^=acc] {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
[class*=Account] .accNum {margin-top:1px; font-size:14px; color:#666;}

.btnAccount + .single {margin-top:-32px;}
.btnAccount + .txtList.remark,
.formList .btnAccount + [class^=btn_].m {margin-top:-24px;} 
.formList .btnAccount:last-child {margin-bottom:8px;}

/* .listAccount {margin:0;}
.listAccount button {display:block; position:relative; width:100%; height:70px; color:#222; text-align:left; padding:12px 0 12px 58px;}
.listAccount .img {left:0;} */

/* 토글 */
.toggleSwitch {position:relative; display:inline-block; margin:0; font-size:0; vertical-align:middle; text-align:right;}
.toggleSwitch input {position:absolute; top:0; width:20px; height:20px; opacity:0; z-index:0;}
.toggleSwitch input + label {display:inline-block; position:relative; padding-left:36px; height:22px; cursor:pointer;}
.toggleSwitch input + label:before {display:block; content:''; position:absolute; top:0; left:0; width:36px; height:22px; background-color:#eee; border-radius:11px; box-shadow:0 3px 6px -6px rgba(0,0,0,0.5) inset; transition:background 0.4s;}
.toggleSwitch input + label:after {display:block; content:''; position:absolute; top:2px; left:2px; bottom:0; width:18px; height:18px; margin-left:0; border:none; background-color:#fff; border-radius:50%; box-sizing:border-box; transition:margin 0.4s; box-shadow:0 1px 2px rgba(0, 0, 0, 0.15); z-index:1;}
.toggleSwitch input:focus + label {outline: auto;}
.toggleSwitch input:checked + label:before {background-color:#f2f6ff;}
.toggleSwitch input:checked + label:after {margin-left:14px; background-color:#5d88fb;}
.toggleSwitch input + label > span {position:relative; display:inline-block; margin-left:4px; font-size:1.6rem; line-height:1.4; vertical-align:top; overflow:hidden;}
.toggleSwitch input + label .off,
.toggleSwitch input:checked + label .on {position:relative; top:0; left:0; opacity:1; transition:all ease-in-out 0.4s;}
.toggleSwitch input + label .on,
.toggleSwitch input:checked + label .off {position:absolute; opacity:0; white-space:nowrap;}
.toggleSwitch input:checked:disabled + label:after {background-color: #5d88fb !important;} /*디지털보험 기본체크 및 클릭안되게 해논 버튼 */
.toggleSwitch input:checked:disabled + label:before {background-color: #f2f6ff !important;} /*디지털보험 기본체크 및 클릭안되게 해논 버튼 */
.toggleSwitch input:checked:disabled + label:after {background-color: #5d88fb !important;} /*디지털보험 기본체크 및 클릭안되게 해논 버튼 */
.toggleSwitch input:checked:disabled + label .on {color: #445fe6 !important;} /*디지털보험 기본체크 및 클릭안되게 해논 버튼 */

.toggleSwitch.front input + label {padding:0 36px 0 0;}
.toggleSwitch.front input + label:before {left:auto; right:0;}
.toggleSwitch.front input + label:after {left:auto; right:2px; margin:0;}
.toggleSwitch.front input:checked + label:after {margin:0 14px 0 0;}
.toggleSwitch.front input + label > span {margin:0 4px 0 0;}

.toggleSwitch.lg input + label {height:32px; padding-left:0;}
.toggleSwitch.lg input + label:before {width:100%; height:32px; border-radius:18px;}
.toggleSwitch.lg input + label:after {top:4px; left:4px; width:24px; height:24px;}
.toggleSwitch.lg input:checked + label:after {margin-left:calc(100% - 32px);}
.toggleSwitch.lg input + label > span {margin:4px; padding:0 6px 0 30px; font-size:1.4rem; line-height:24px; transition:all 0.4s;}
.toggleSwitch.lg input:checked + label > span {padding:0 30px 0 6px;}
.toggleSwitch.lg input + label .off,
.toggleSwitch.lg input + label .on {transition:none;}

.toggleSwitch input:checked + label .on,
.toggleSwitch.lg input:checked + label > span {color:#445fe6;}

.tblInfo .toggleSwitch input + label > span {position:relative; top:1px; font-size:1.4rem;}

/* 박스 */
.iptBox {margin:4px 0 8px; padding-bottom:4px;}
.iptBox.minH {min-height: 100px;}
.iptBox > li + li {margin-top:8px;}
.iptBox > li:after {content:""; display:block; clear:both;}
.iptBox .ipt + label {width:100%; height:100%; padding:20px 22px 20px 55px; color:#666; font-size:16px; background:#fff; border:1px solid #eee; border-radius:4px; transition: all ease-in-out 0.15s;}
.iptBox .ipt + label .tit {position:absolute;top: 47.5%;left: 55px;transform: translateY(-50%); font-size: 1.6rem; color: #222;}
.iptBox .ipt + label .money {float:right; font-size:1.6rem; color:#222;}
.iptBox .ipt + label:before {top:50%; left:23px; transform:translateY(-50%);}
.iptBox .ipt:checked + label {color:#222; font-weight:500; border-color:#5d88fb; box-shadow:4px 4px 4px rgba(93,136,251,0.1);}
.iptBox .ipt:checked + label .money {color:#e658b2;}
.iptBox p.txtS {margin-top:5px; color:#666;}
.iptBox > li {position:relative;}
.iptBox .state {position:absolute; top:18px; right:22px; z-index: 1;}

.iptBox.sm .ipt + label {padding:13px 15px 13px 48px; font-size:1.4rem;}
.iptBox.sm .ipt + label:before {left:16px;}
.iptBox.sm.div_2 {display:flex; margin:4px -4px 8px; flex-wrap:wrap;}
.iptBox.sm.div_2 > li {width:calc(50% - 8px); margin:4px;}
.iptBox.sm.div_2 > li.full,
.iptBox.sm.div_2 > li:nth-child(2n-1):last-child {width:100%;}
.iptBox.sm.div_2 .ipt + label {display:flex; align-items:center;}

.iptBox.check .ipt + label:before {content:none;}
.iptBox.check .ipt + label:after {content:''; position:absolute; top:50%; left:17px; width:8px; height:12px; border:1px solid #bbb; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg) translateY(-11px);}
.iptBox.check .ipt:checked + label {border-color:#5d88fb; background-color:#fff; box-shadow:none;}
.iptBox.check .ipt:checked + label:after {border-color:#5d88fb;}
.iptBox.check.right .ipt + label {padding-left:22px; padding-right:72px;}
.iptBox.check.right .ipt + label:before {content:'' !important; top:50% !important; left:auto; right:24px; width:28px; height:28px; border:none; box-shadow:none; border-radius:50%; background-color:#f8f8f8; transform:translateY(-50%); transition:all ease-in-out 0.15s;}
.iptBox.check.right .ipt + label:after {top:50% !important; left:auto; right:41px;}
.iptBox.check.right .ipt:checked + label:before,
.iptBox.check.right .ipt:checked:focus + label:before {border:none; box-shadow:none; background-color:#5d88fb !important;}
.iptBox.check.right .ipt:checked + label:after {border-color:#fff;}

/* 20230926 : 아이콘 박스 추가 (s) */
.iptBox.icoBox .ipt + label {padding-left: 70px;}
.iptBox.icoBox .ipt + label:before{content: ''; position:absolute; top:15px; left:auto; right:25px; width:9px; height:14px; border:1px solid #bbb; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg) translateY(-11px); border-radius: 0;}
.iptBox.icoBox .ipt:checked + label:before{border:1px solid #5d88fb; border-width: 0 2px 2px 0;}
.iptBox.icoBox .ipt + label:after{content:"";position:absolute;top:50%;left: 17px;transform:translateY(-50%);width:40px;height:40px;background-size: 100%;}
.iptBox.icoBox .ipt + label.ico_01:after {background:url(../../assets/images/smart/content/ico_deputy_01.png) 0 0 no-repeat;background-size: 100%;}
.iptBox.icoBox .ipt + label.ico_02:after {background:url(../../assets/images/smart/content/ico_deputy_02.png) 0 0 no-repeat;background-size: 100%;}
.iptBox.icoBox .ipt + label.ico_03:after {background:url(../../assets/images/smart/content/ico_deputy_03.png) 0 0 no-repeat;background-size: 100%;}
.iptBox.icoBox .ipt:checked + label.ico_01:after {background:url(../../assets/images/smart/content/ico_deputy_01_on.png) 0 0 no-repeat;background-size: 100%;}
.iptBox.icoBox .ipt:checked + label.ico_02:after {background:url(../../assets/images/smart/content/ico_deputy_02_on.png) 0 0 no-repeat;background-size: 100%;}
.iptBox.icoBox .ipt:checked + label.ico_03:after {background:url(../../assets/images/smart/content/ico_deputy_03_on.png) 0 0 no-repeat;background-size: 100%;}
/* 20230926 : 아이콘 박스 추가 (e) */

.bgGrayArea .iptBox .ipt + label {padding-left:72px; font-weight:300; color:#222; border:none; border-radius:10px; box-shadow:none;}
.bgGrayArea .iptBox .ipt + label:before {top:24px; transform:none;}
.bgGrayArea .iptBox .ipt + label .txtS {display:block; margin-top:3px; line-height:1.3;}
.bgGrayArea .iptBox .ipt[type=checkbox] + label:before {content:none;}
.bgGrayArea .iptBox .ipt[type=checkbox] + label:after {top:24px;}

.iptBox .ipt.bf:checked + label {color:#00a3bb; font-weight:500; border-color:#009cc3; box-shadow:4px 4px 4px rgba(93,136,251,0.1);}
.ipt.bf[type=radio] + label:before {border-radius:50%; transition:border 0.225s, box-shadow ease-in-out 0.225s; border-color:#009cc3;}
.ipt.bf[type=radio]:checked + label:before {border-color:#009cc3; background-color:#009cc3; box-shadow:inset 0 0 0 4px #fff;}
.ipt.bf[type=radio]:checked:focus + label:before {border-width:6px; background-color:#fff; /*box-shadow:inset 0 0 0 6px #0083cd;*/}

.iptBox.existing > li + li {margin-top: 15px;}
.iptBox.existing .ipt[type=checkbox]:focus + label,
.iptBox.existing .ipt[type=radio]:focus + label {text-decoration:none;}
.iptBox.existing .ipt + label {padding: 18px 26px 18px 60px; border: 1px solid #eee;}
.iptBox.existing .ipt + label .txt {margin: 0; font-size: 1.5rem;}
.iptBox.existing .ipt + label:before {top:20px;}
.iptBox.existing .infoDetail {margin: 0; padding: 0; background-color: transparent;}
.iptBox.existing .infoDetail .infoList > li {padding: 1px 0 !important;}
.iptBox.existing .ipt:checked + label {color: #222; font-weight: 500; border: 1px solid #5d88fb; box-shadow: 4px 4px 4px rgba(93,136,251,0.1);}
.iptBox.existing .infoList {margin-top:5px; padding-top: 5px; border-top: 1px solid #eee;}

.iptBox.existing .state {position:initial; margin-bottom:0;}
.iptBox.existing .infoList .item.case1 {min-width:60px; max-width: fit-content; padding-right:0;}
.iptBox.existing .infoList .item.case2 {min-width:120px; max-width: fit-content; padding-right:0;}
.iptBox.existing .infoList .val {min-width:auto;}
.iptBox.existing .ipt:checked + label .infoList {font-weight:300;}

/* 만족도조사 */
.iptSurvey {margin:-14px 0 24px; padding-bottom:4px;}
.iptSurvey > li + li {margin-top:8px;}
.iptSurvey > li:after {content:""; display:block; clear:both;}
.iptSurvey .ipt + label {width:100%; height:100%; padding:20px 22px 20px 104px; color:#666; font-size:16px; background:#fff; border:1px solid transparent; border-radius:4px; transition: all ease-in-out 0.15s;}
.iptSurvey .ipt + label:before {content:none;}
.iptSurvey .ipt + label:after {content:''; position:absolute; top:50%; left:40px; width:60px; height:56px; margin-top:-28px; background-color:#eee;}
.iptSurvey .ipt:checked + label {color:#222; font-weight:500; border-color:#5d88fb; box-shadow:4px 4px 4px rgba(93,136,251,0.1);}

.iptSurvey .ipt + label.score5:after {background:url(../../assets/images/smart/content/ico_survey_score_5_off.svg) no-repeat 0 50%;}
.iptSurvey .ipt + label.score4:after {background:url(../../assets/images/smart/content/ico_survey_score_4_off.svg) no-repeat 0 50%;}
.iptSurvey .ipt + label.score3:after {background:url(../../assets/images/smart/content/ico_survey_score_3_off.svg) no-repeat 0 50%;}
.iptSurvey .ipt + label.score2:after {background:url(../../assets/images/smart/content/ico_survey_score_2_off.svg) no-repeat 0 50%;}
.iptSurvey .ipt + label.score1:after {background:url(../../assets/images/smart/content/ico_survey_score_1_off.svg) no-repeat 0 50%;}
.iptSurvey .ipt:checked + label.score5:after {background:url(../../assets/images/smart/content/ico_survey_score_5.svg) no-repeat 0 0;}
.iptSurvey .ipt:checked + label.score4:after {background:url(../../assets/images/smart/content/ico_survey_score_4.svg) no-repeat 0 0;}
.iptSurvey .ipt:checked + label.score3:after {background:url(../../assets/images/smart/content/ico_survey_score_3.svg) no-repeat 0 0;}
.iptSurvey .ipt:checked + label.score2:after {background:url(../../assets/images/smart/content/ico_survey_score_2.svg) no-repeat 0 0;}
.iptSurvey .ipt:checked + label.score1:after {background:url(../../assets/images/smart/content/ico_survey_score_1.svg) no-repeat 0 0;}


/*================================================== Form(입력) List ==================================================*/
.formList {margin:0 0 22px;}
.formList .itemTh {margin-top:22px; padding:0 0 4px; color:#222; font-size:14px; font-weight:500; word-break:keep-all;}
.formList > li:first-child .itemTh {margin-top:0;}
.formList .itemTh:after {content:''; display:block; clear:both;}
.formList .itemTh .num {display:inline-block; width:16px; height:16px; margin:-2px 3px 0 0; border-radius:50%; background-color:#5d88fb; color:#fff; font-size:1rem; font-weight:500; line-height:16px; text-align:center; vertical-align:middle;}
.formList .itemTh .point,
.formList .itemTh .single,
.formList .itemTh .links {float:right; margin:0; font-size:1.4rem; font-weight:300;}
.formList .itemTh .point {color:#445fe6;}
.formList .itemTh .point .links {float:none; vertical-align:baseline;}
.formList .itemTh .single .ipt + label.sm {margin-right:0;}
.formList .iptGroup {margin:3px 0 1px;}
.formList .iptFilt {margin-bottom:12px; /*padding-bottom:4px;*/}
.formList .single {padding-left:0;}
.formList * + .single {margin-left:0;}
.formList [class^=btn_].m {display:inline-block; margin:4px 0;}
.formList .infoDetail {margin-bottom:32px;}

ul.formList .btnGroup {margin:1px -3px;}
ul.formList .btnGroup [class^=btn_].m {width:auto; margin:3px;}

* + ul.formList {margin-top:12px;}
.popup div.formList {margin-bottom:32px;}

.formList .na_dis {margin-top: 7px;width:100%;height:44px;line-height: 44px;padding:0 15px;color: #222;border:1px solid #ccc;border-radius:4px;border-color: #eee;background-color: #f8f8f8;text-overflow: ellipsis;white-space:nowrap;overflow:hidden;}

.formWrap {position: relative; padding-top: 20px; margin-top:30px; border-top: 1px solid #eee;}
.formWrap .icoBtn_close {position:absolute;right:0;top:15px;}
.formWrap .icoBtn_close:before,
.formWrap .icoBtn_close:after {position:absolute;left:50%;top:50%;width:2px;height: 18px;background-color: #959595;}
.formWrap .w48p {width: 48%;}

/* 필수입력 */
.required {color:#e91b10;}
.titH2 .required {font-size:1.6rem; font-weight:300;}


/*================================================== Tooltip ==================================================*/
.tip {display:inline-block; position:relative; margin-top:-2px; font-size:0; font-weight:300; vertical-align:middle; white-space:normal;}
.tip [class*=col_] {float:none;}
.tip + p {margin-left:10px; vertical-align:middle;}

.tipWrap {display:inline-block; position:relative; width:16px; height:16px; text-align:left; vertical-align:middle;}
.tipWrap .icoBtn_tip {display:inline-block; width:16px; height:16px; border-radius:50%; border:1px solid #696969; background-color:#fff; vertical-align:middle; overflow:hidden;}
.tipWrap .icoBtn_tip:after {content:'?'; position:absolute; top:0; left:0; width:14px; padding:0; color:#696969; font-size:13px; font-family:'Malgun Gothic', '맑은 고딕', 'Dotum', '돋움'; font-weight:700; line-height:14px; text-align:center; box-sizing:border-box;}
.tipWrap.on .tooltip {display:block; opacity:1; outline:rgba(0,0,0,0); z-index: 1600}
.tipWrap.on .icoBtn_close {display:block;}
.tipWrap.info .icoBtn_tip:after {content:'i';}
body:not(.isIE):not(.isFF) .tipWrap.info .icoBtn_tip:after {padding-right:1px;}
.tipWrap .icoBtn_tip.bgP {display:block; margin-top: -1px; border: 1px solid #715deb;background-color: #715deb;}
.tipWrap .icoBtn_tip.bgP:after {color: #fff;}

.tooltip {display:none; position:absolute; top:50%; left:0; width:auto; min-width:150px; margin-left:30px; padding:17px 22px; border:1px solid #5d88fb; background-color:#fff; color:#666; font-size:14px; line-height:1.5; text-align:left; box-shadow:3px 3px 7px rgba(93, 136, 251, .16); box-sizing:border-box; opacity:0; z-index:500; transition:opacity .15s linear;}
.tooltip.in {display:block; opacity:1;}
.tooltip > .tit {display:block; margin-bottom:10px; border-radius:5px 5px 0 0; line-height:1;}
.tooltip .cont {padding-right:7px;}
.tooltip .cont [class^=titH] {display:inline-block;}
.tooltip .cont [class^=titH]:first-child {margin-top:0;}
.tooltip .cont .titH5 {margin-bottom:8px;}
.tooltip .cont .txtList:not(.remark) {margin:0 !important;}
.tooltip .cont .txtList:not(.prog):not(.step) > li {margin-top:7px;}
.tooltip .cont [class^=titH] + .txtList {margin-top:0 !important;}
.tooltip .icoBtn_close {display:none; position:absolute !important; top:17px; right:10px; width:20px; height:20px;}
.tooltip .icoBtn_close:before,
.tooltip .icoBtn_close:after {height:12px;}

.tooltip .arrow {position:absolute; left:-4px; top:50%; width:7px; height:7px; border:1px solid #1a75e4; border-width:0 0 1px 1px; background-color:#fff; box-sizing:border-box; transform:translateY(-50%) rotate(45deg);}
.left .tooltip {margin-left:-10px;}
.left .tooltip .arrow {left:auto; right:-4px; border-width:1px 1px 0 0;}
.top .tooltip {top:auto; bottom:31px; margin-left:10px;}
.top .tooltip .arrow {left:50%; top:auto; bottom:-4px; border-width:0 1px 1px 0; transform:translateX(-50%) rotate(45deg);}
.bottom .tooltip {left:-50%; top:31px; margin-left:12px; margin-top: -6px !important; }
.bottom .tooltip .arrow {left:50%; top:-4px; border-width:1px 0 0 1px; transform:translateX(-50%) rotate(45deg);}


/*================================================== Paging ==================================================*/
.paging {margin:64px -24px 0;}
.paging ul {padding:0 3px;}
.paging li {padding:0 1px;}


/*================================================== Progress ==================================================*/
.insuStep {margin: -26px -24px 32px;padding: 20px 20px 24px;background-color: #00b2bc;}
.insuStep ol {display:flex; position:relative; flex-direction:row; flex-wrap:nowrap; padding:0; align-items:flex-start;}
.insuStep ol::before {content:''; position:absolute; left:0; top:44px; width:100%; height:2px; background-color:#fff; opacity:0.2;}
.insuStep ol > li {position:relative;width:25%;flex-grow:1;padding:61px 0 0;color: #a3dbdf;font-size:14px;text-align:center;}
.insuStep ol > li::after {content:'';position:absolute;left:50%;top:41px;width:8px;height:8px;border: 2px solid #7ac8cc;border-radius:50%;background-color: #00b2bc;transform:translateX(-50%);box-sizing:border-box;opacity:0.7;}
.insuStep ol > li:first-child::before,
.insuStep ol > li:last-child::before {content:'';position:absolute;top:44px;width:50%;height:2px;background-color: #00b2bc;}
.insuStep ol > li:first-child::before {left:0;}
.insuStep ol > li:last-child::before {right:0;}
.insuStep li .msgTip {display:none;}
.insuStep li.on {padding-top: 59px;color: #fff;font-size:1.8rem;font-weight:500;}
.insuStep li.on::after {top:40px;width:10px;height:10px;border: 2px solid #fff;opacity:1;}
.insuStep li.on .msgTip {display:inline-block;left:50%;top: 0px;transform:translateX(-50%);background-color: #fff;color: #00b2bc;}
.insuStep li.on .msgTip::before {left:50%;right:auto;bottom: -6px;transform:translateX(-50%) rotate(45deg) skew(10deg, 10deg);border-bottom: 1px solid #00b2bc;border-right: 1px solid #00b2bc;background-color: #fff;color: #00b2bc;}

/*================================================== 정보 리스트 ==================================================*/
.addInfo {display:block; margin-top:2px; color:#666; font-size:1.4rem; font-weight:300;}
.addInfo.pointC5 {font-weight:500;}

.infoHead {padding:4px 0 12px; border-bottom:1px solid #eee; color:#222; font-size:1.6rem;}
.infoHead .addInfo {margin-top:5px;}
.infoHead .addInfo + .tit {margin-top:5px;}
.infoHead.lg {margin-bottom:26px; padding:0; border-bottom:0;}
.infoHead.lg .tit {font-size:2.0rem;}
.infoDesc {display:flex; margin-top:16px; border-top:1px solid #eee;}
.infoDesc .links {margin:13px auto 0;}
.infoDesc .single {margin:13px 0 0 0;}

.infoList {width:100%; margin:12px 0; text-align:left;}
.infoList > li {display:flex; position:relative; flex-direction:row; flex-wrap:nowrap; padding:7px 0; justify-content:space-between; align-items:baseline;}
.infoList > li > div {flex-grow:1;}
.infoList .item {min-width:30%; padding-right:15px; color:#666; font-size:1.4rem; font-weight:300;}
.infoList .val {min-width:40%; color:#222; text-align:right;}
.infoList .val .pointC6 {display:inline-block;}
.infoList .date {color:#959595;}
.infoList .txtS {color:#666;}
.infoList .icoS + .item {padding-left:32px;}
.infoList:not(.half) > li:first-child {padding-top:0;}
.infoList:not(.half) > li:last-child {padding-bottom:0;}
.infoList > li:first-child.total {margin-bottom:7px;}
.infoList > li:not(:first-child).total {margin-top:7px; padding-top:12px !important; border-top:1px solid #eee;}

li.flex {flex-wrap:wrap;}
li.flex > div:not(.item):not(.val),
li.flex > .infoList {flex-grow:1; width:100%;}
li.flex .infoDetail {margin-bottom:0;}
li.flex .infoList {margin-top:0; padding:3px 0 0 10px;}
li.flex .infoList > li {padding:5px 0 0 11px !important;}
li.flex .infoList > li::before {content:''; position:absolute; left:0; top:9px; width:7px; height:8px; border-left:1px solid #aaa; border-bottom:1px solid #666; box-sizing:border-box;}
li.flex .infoList > li.total::before {top:16px;}
li.flex .infoList .item {font-size:1.3rem;}
li.flex .infoList .val {font-size:1.4rem;}
li.flex .infoList > li:not(.total) .val {color:#666;}

.infoList > li.accoItem.line,
.infoList > li.accoItem.flex {margin-top:7px; padding:12px 14px 5px 0 !important; border-top:1px solid #eee;}
.infoList > li.accoItem.line:not(.flex) {padding-right:0 !important;}
.infoHead + .infoList > li:first-child.accoItem.flex,
.infoList > li.accoItem.line + li.accoItem.flex,
.infoList > li.accoItem.flex + li.accoItem.flex,
.infoList > li:first-child.accoItem.flex {margin-top:0; border-top:0;}
.infoList .accoBody {width:100%;}
.infoList .icoBtn_acco {position:absolute; left:0; top:6px; width:100%; height:32px;}
.infoList .icoBtn_acco:after {left:auto; right:0; width:10px; height:10px; margin-top:3px; border:1px solid #666; border-width:5px; border-color:#666 transparent transparent transparent; transform-origin:center center; transform:translateY(-50%) rotate(0) scaleX(0.7);}
.infoList > li.accoItem.flex.on .icoBtn_acco:after {margin-top:-2px; transform:translateY(-50%) rotate(-180deg) scaleX(0.7);}

.infoDetail {width:100%; margin:16px 0; padding:16px 24px 15px; background-color:#f8f8f8;}
.infoDetail .infoList {margin:0;}
.infoDetail .infoList > li {padding:5px 0 !important;}
.infoDetail .infoList .val {font-size:1.4rem;}
.infoDetail .infoList > li.hasLink {padding-right:16px !important;}
.infoDetail .infoList > li.hasLink::after {content:''; position:absolute; right:1px; top:50%; width:7px; height:7px; margin-top:-3px; border:1px solid #222; border-width:0 0 1px 1px; transform:translateY(-50%) rotate(-45deg); box-sizing:border-box;}
.infoDetail .links.arrow {font-size:1.4rem;}
.infoDetail .infoHead {margin-bottom:7px;}
.infoDetail .infoHead .addInfo [class^=flag_prd] {height:20px; margin:0 4px; padding:0 6px; border:1px solid #eee; border-radius:10px; background-color:#fff !important; font-size:1.2rem !important; font-weight:300 !important; line-height:18px; vertical-align:text-top;}
.infoDetail .infoDesc {margin-top:8px; display:block;}
.infoDetail > [class^=btn_].m {margin-top:12px;}
.infoDetail li.total > div {color:#222; font-weight:500;}
.infoDetail .infoHead:only-child {border-bottom:none; padding-bottom:0;}

.infoList .iptWrap,
.infoList .selectWrap {display:inline-block; width:150px; margin:0;}
.infoList .iptWrap.sm {width:70px;}
.infoList .selectWrap {width:85px;}
.infoList .ipt {height:36px; padding:0 32px 0 10px; font-size:14px;}
.infoList span.unit {font-size:14px;}
.infoList select.ipt {padding:0 32px 0 10px}
.infoList .val .btn_t.s {display:inline-block; width:auto; margin:0;}
.infoList .sellRate {display:inline-block; width:165px;}
.sellRate .iptFilt {display:inline-block; width:auto; margin:0 0 5px;}
.sellRate .iptFilt > li {width:80px;}
.sellRate .iptFilt .ipt + label {line-height:34px;}
.sellRate .iptWrap {width:107px;}

.infoDetail .infoList.form {margin:-13px 0 -13px;}
.infoList.form > li {min-height:59px; padding:19px 0 !important; border-bottom:1px solid #eee; align-items:center;}
.infoList.form > li:last-child {border-bottom:0;}
.infoList.form > li > div {vertical-align:middle;}
.infoList.form .item {flex-grow:1; padding-right:5px; white-space:normal;}
.infoList.form .item em {color:#222; font-weight:300;}
.infoList.form .tit {padding-bottom:4px; color:#222; font-size:1.6rem;}
.infoList.form .val {min-width:auto; flex-grow:0; white-space:nowrap;}
.infoList.form .val span {color:#666; vertical-align:middle;}
.infoList.form .iptWrap {margin-left:5px;}
.infoList.total {width:auto; margin:24px -8px 0 !important; padding:20px 24px !important; border-top:0 !important; background-color:#fff;}
.infoList.total .item {color:#222;}
.infoList.total .item em {font-size:1.4rem;}
.infoList.total .tit {padding-bottom:3px; font-size:1.6rem; font-weight:500;}
.infoList.total .val .point {color:#5642bf; font-size:1.8rem;}

.infoList.half::after {display:block; content:''; clear:both;}
.infoList.half > li {display:inline-block; float:left; width:auto; vertical-align:middle;}
.infoList.half > li:nth-child(even) {float:right; text-align:right;}
.infoList.half > li > div {display:inline-block; vertical-align:middle;}
.infoList.half > li.al {width:100%; text-align:left;}
.infoList.half .item {min-width:auto; padding-right:5px;}
.infoList.half .val {min-width:auto; font-size:1.4rem;}
.infoList.half .name {display:inline-block; max-width:70px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.infoList.half .money {font-size:1.5rem !important; font-weight:500;}
.infoList.half .money.pointC6 em {font-size:1.8rem; letter-spacing:-0.05rem;}
.infoList.half .money.del {position:relative; color:#959595;}
.infoList.half .money.del:after {content:""; position:absolute; top:50%; left:0; width:100%; border-top:1px solid #959595;}

.infoList + .infoList {margin-top:15px; padding-top:15px; border-top:1px solid #eee;}
.infoDetail + .infoList {margin-top:20px; padding-top:15px; border-top:1px solid #eee;}

/*.content.prdList .infoList.half > li > div {display:inline-flex; align-items: center;}*/
.content.prdList .summaryCard .summary > .inner {min-height: 244px;}

/* 완료 */
.infoList.finish {margin-bottom:32px;}
.infoList.finish li {padding:12px 0 !important; border-bottom:1px solid #eee;}
.infoList.finish .val {font-weight:500;}

/* 동의 현황 */
.infoList.assentState li {padding:20px 0; border-top:1px solid #eee;}
.infoList.assentState li:first-child {padding-top:0; border-top:none;}
.infoList.assentState li,
.infoList.assentState li > div {display:block;}
.infoList.assentState .val {display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:2px; }
.infoList.assentState .val > span {width:50%; text-align:right;}
.infoList.assentState .val > span:first-child {text-align:left;}
.infoList.assentState .links.arrow {margin:15px 0 0 0;}

/* 지급 내역 */
.payHistory {margin:-26px -24px 32px;padding:20px 24px 30px;background: #00b2bc url(../../assets/images/smart/common/bg_pattern_zigzag.svg) repeat-x left bottom;background-size:16px 4px;}
.payHistory .infoList {margin:0;}
.payHistory .infoList .item {color: #cbeaec;}
.payHistory .infoList .val {color:#fff;}
.payHistory .infoList .val.pointC6 {color:#ffdf60 !important;}

/* 번외 */
div.infoList {display:flex; flex-direction:row; flex-wrap:wrap; margin:0; align-items:flex-end;}
div.infoList .item {display:inline-block; padding-right:0 !important;}
div.infoList:not(.total) .item em {font-size:1.6rem; color:#222;}
div.infoList .val {display:block;}
div.infoList > div {flex-grow:1; color:#222; font-size:1.6rem;}
div.infoList > div:first-child:not(:only-child) .val {text-align:left;}
div.infoList > div:last-child {text-align:right;}

/* 펀드 자동재배분 */
.infoList.fund > div {flex-grow:0; padding-right:20px; text-align:left !important;}
.infoList.fund > div:last-child {padding-right:0;}
.infoList.fund .val {font-size:1.8rem; text-align:left}
.infoList.fund img {vertical-align:text-bottom;}

/* 라인 */
.infoList.line:not(.half) > li {padding:16px 0; border-bottom:1px solid #eee;}
.infoList.line .item {white-space:inherit;}
.infoList.line .val {min-width:70px; vertical-align:middle;}
.infoList.line  .ipt[type=checkbox] + label:before {top:-1px;}

.infoWrap {margin:20px 0 12px;}
.infoWrap .infoList:not(:last-of-type) {margin-bottom:20px; padding-bottom:12px; border-bottom:1px solid #eee;}
.infoWrap .infoList + .infoList {margin-top:-8px; padding-top:0; border-top:none;}
.infoWrap .infoList > li {align-items:center;}
.infoWrap .infoDetail {margin:10px 0 20px;}

/* infoRowList */
.infoRowList {display:flex; flex-wrap:wrap;}
.infoRowList > li {position:relative; }
.infoRowList > li:not(:first-child) {margin-left:28px;}
.infoRowList .item {margin-bottom:4px; color:#666; font-size:1.4rem;}
.infoRowList .val {color:#222; font-size:1.8rem; word-break:keep-all;}
.infoRowList .icoS ~ .val {padding-left:32px;}
.infoRowList .icoS {top:27px;}

.infoRowList.half > li {width:50%; margin-left:0; padding-right:16px;}
.infoRowList.half > li:not(:first-child) {padding-left:16px; border-left:1px solid #eee;}

.infoRowList.third {margin:5px 0 10px;}
.infoRowList.third > li {width:33.3333%; text-align:center; margin-left:0; padding-right:8px;}
.infoRowList.third > li:not(:first-child) {padding-left:8px; border-left:1px solid #eee;}

/*================================================== 상품 정보 박스 ==================================================*/
[class^=flag_] {display:inline-block; min-width:48px; height:28px; margin:2px 0; padding:0 9px; border-radius:14px; background-color:#f8f8f8; color:#666; font-size:1.3rem !important; font-weight:500 !important; line-height:28px; text-align:center; vertical-align:middle;}

.flag_prd1 {color:#009cc3 !important; background-color:#f1fafd;}
.flag_prd2 {color:#445fe6 !important; background-color:#f2f6ff;}
.flag_prd3 {color:#666 !important; background-color:#f8f8f8;}
.flag_prd4 {color:#e9473f !important; background-color:#fdf3f3;}
.flag_prd5 {color:#e658b2 !important; background-color:#fef6fb;}
.flag_prd6 {color:#5642bf !important; background-color:#f6f5fd;}
.flag_prd7 {color:#00a3bb !important; background-color:#f0f6eb;}
.flag_prd8 {color:#3e9100 !important; background-color:#f5f9f2;}
.flag_prd9 {color:#ec750d !important; background-color:#fff7f1;}

.digital .tblY .flag_prd1 {color:#f1fafd !important; background-color: #009cc3;} 
.digital .tblY .flag_prd2 {color:#f2f6ff !important; background-color:#445fe6;}
.digital .tblY .flag_prd3 {color:#f8f8f8 !important; background-color:#666;}
.digital .tblY .flag_prd4 {color:#fdf3f3 !important; background-color:#e9473f;}
.digital .tblY .flag_prd5 {color:#fef6fb !important; background-color:#e658b2;}
.digital .tblY .flag_prd6 {color:#f6f5fd !important; background-color:#5642bf;}
.digital .tblY .flag_prd7 {color:#f0f6eb !important; background-color:#00a3bb;}
.digital .tblY .flag_prd8 {color:#f5f9f2 !important; background-color:#3e9100;}
.digital .tblY .flag_prd9 {color:#fff7f1 !important; background-color:#ec750d;}

.flag_recom {color:#fff !important; background-color:#715deb;}

div.state {margin-bottom:17px;}
div.state.flex {display:flex; align-items:center;}
div.state .date {margin-left:auto; font-size:1.3rem; color:#959595;}
div.state .date .txtItem {padding-bottom:0;}

.infoBox {display:block; position:relative; margin-bottom:16px; padding-left:23px; padding-right:23px; border:1px solid #fff; border-radius:8px; background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1); transition:border-color ease-in-out 0.25s;}

.infoBox > .inner {display:block; padding:23px 0 9px;}
.infoBox > a.inner {position:relative; margin:0 -24px; padding-left:24px; padding-right:24px; color:#666;}
.infoBox > a.inner::after {content:''; position:absolute; right:25px; top:30px; width:9px; height:9px; border:1px solid #b4b4b4; border-width:1px 1px 0 0; box-sizing:border-box; transform:rotate(45deg); z-index:1;}
.infoBox > a.inner .tit {display:block; padding-right:24px;}
.infoBox > a.inner .state ~ .tit {padding-right:0;}

.infoBox > .inner.disabled .tit,
.infoBox > .inner.disabled .txtItem {color:#959595;}
.infoBox > .inner.disabled [class^=flag_prd] {color:#959595 !important; background-color:#f8f8f8;}
.infoBox > a.inner.disabled::after {display:none;}

.infoBox > .single {position:absolute; left:24px; top:22px; margin:0;}
.infoBox > .single + .inner {padding:23px 0 18px 45px;}
.infoBox > .single + .inner .infoDetail .infoList {width: calc(100% + 45px); margin-left: -45px;}
.infoBox > .inner > .single {position:absolute; right:24px; top:22px; margin:0;}
.infoBox > .inner > .single + .tit,
.infoBox > .inner.hasAcco .single + .tit {padding-right:30px;}
.infoBox > .inner > .single + .state ~ .tit {padding-right:0;}
.infoBox.active {border-color:#5d88fb;}

.infoBox [class^=flag_prd] {margin:0 1px 0 0;}
.infoBox .state {margin-bottom:14px;}
.infoBox .state .info {display:inline-block; font-size:1.4rem; vertical-align:middle;}
.infoBox .state .info em {padding-left:2px; font-weight:500;}
.infoBox .state .info em.point {color:#e658b2;}
.infoBox .state * + .info {margin-left:7px;}
.infoBox .date {color:#959595;}
.infoBox .pointC6 {font-weight:500;}

.infoBox .target {position:absolute;top:23px;right:50px;font-size: 1.5rem;}
.infoBox .target .tip {left:3px;}
.infoBox .target .tipWrap .icoBtn_tip {border-color:#222;}

.infoBox .rightInfo {position:absolute; right:23px; top:22px; background-color:#fff; z-index:2; font-size:1.5rem; color:#222; font-weight:500;}

.infoBox .tit {margin-bottom:1px; color:#222; font-size:1.5rem; text-align:left;}
.infoBox button.tit {padding-right:12px;}
.infoBox button.tit > span {position:relative; color:#222;}
.infoBox button.tit > span::after {content:''; position:absolute; right:-12px; bottom:6px; width:8px; height:8px; margin-top:1px; border:1px solid #222; border-width:1px 1px 0 0; box-sizing:border-box; transform:rotate(45deg); z-index:1;}
.infoBox .linkArea {padding:5px 0 4px; text-align:right;}
.infoBox .infoList {margin:0;}
.infoBox .tit + .infoDetail {margin:16px 0 0;}
.infoBox .infoList .val {font-size:1.4rem;}

.infoBox .tit.titIco {margin:-4px 0 0; padding-bottom:8px; font-size:1.8rem; font-weight:500; border-bottom:1px solid #eee;}
.infoBox .tit.titIco .ico {width:40px; height:40px; margin-right:8px;}
.infoBox .tit.titIco [class^=flag_prd] {margin-left:auto;}
.infoBox .tit.titIco + .infoDetail .infoList {padding-top:0; border-top:none;}
.infoBox .tit.titIco + .infoDetail .titH5:first-child {margin-top:0;}

.infoBox .infoList.half > li {min-width:37%; padding:0 0 12px;}
.infoBox .infoList.half .item {padding-right:1px;}

/* IOS float 높이 안맞을 때 */
/*.isDevice.isIOS .infoBox .infoList.half > li {clear:left; min-height:38px;}
.isDevice.isIOS .infoBox .infoList.half > li:nth-child(even) {clear:right;}*/
.infoBox .infoList.half {display: flex; justify-content: space-between; flex-wrap: wrap;}
.infoBox .infoList.half > li {float: none;}
.infoList.half > li:nth-child(even) {margin: 0 0 0 auto;}

.infoBox .infoList.srch {position:relative; display:flex; flex-wrap:wrap; background-color:#fff; z-index:2;}
.infoBox .infoList.srch > li {width:100%; padding:0 0 12px;}
.infoBox .infoList.srch > li .blind + .val {color:#666; text-align:unset;}
.infoBox .infoList.srch > li:nth-child(1),
.infoBox .infoList.srch > li:nth-child(2) {width:50%; padding-bottom:0;}
.infoBox .infoList.srch > li:nth-child(2) {text-align:right;}
.infoBox .infoList.srch > li:nth-child(1) .val,
.infoBox .infoList.srch > li:nth-child(2) .val {font-size:1.5rem; color:#222; font-weight:500;}
.infoBox .infoList.srch > li.cate {width:auto; max-width:30%;}
.infoBox .infoList.srch > li.cate .val {color:#445fe6;}
.infoBox .infoList.srch > li.cate + .tit {width:auto; max-width:70%; padding-left:10px; text-align:left;}

.infoBox .infoDetail {position:relative; margin:0; padding:3px 0 6px; background-color:#fff !important; z-index:1;}
.infoBox .infoDetail .infoList {padding-top:11px; border-top:1px solid #eee;}
.infoBox .state + ul.infoList.half {margin-bottom:5px;}
.infoBox .state + ul.infoList.half > li {padding-bottom:7px;}

.infoBox .btnGroup {margin:0; padding-bottom:23px;}
.infoBox .btnGroup .btn_g {margin:0; color:#445fe6;}
.infoBox .btnGroup .btn_g:first-child {border-radius:4px 0 0 4px;}
.infoBox .btnGroup .btn_g:last-child {border-left:1px solid #eee; border-radius:0 4px 4px 0;}
.infoBox .btnGroup .btn_g:only-child {border-left:0; border-radius:4px !important;}

.infoBox .inner.hasAcco .tit {padding-right:24px;}
.infoBox .inner.hasAcco .infoDetail {display:none;}
.infoBox .icoBtn_open {position:absolute; left:0; right:0; top:0; bottom:0; width:100%; height:auto; background-color:transparent; z-index:1;}
.infoBox .icoBtn_open::after {left:auto; right:25px; top:29px; border-color:#b4b4b4; transform:rotate(-45deg);}
.infoBox .icoBtn_del {position:absolute; right:11px; top:19px;}
.infoBox .icoBtn_del::before,
.infoBox .icoBtn_del::after {height:16px; background-color:#959595;}

.infoBox .single ~ .icoBtn_open {position:relative; height:36px; margin:-7px 0 -9px;}
.infoBox .single ~ .icoBtn_open::after {left:50%; right:auto; top:50%; transform:translate(-50%, -50%) rotate(-45deg);}
.infoBox .inner.on .single ~ .icoBtn_open {margin-top:0;}

.infoBox .icon {position:absolute; top:23px; right:23px; background-color:#fff; z-index:2;}
.infoBox .icon img {width:48px; height:48px;}
.infoBox .icon ~ .tit,
.infoBox .icon ~ .desc {padding-right:65px !important; word-break:keep-all;}
.infoBox .icon ~ .desc {margin:5px 0 11px;}

.reverse {display:flex; flex-flow:column-reverse; margin-bottom:16px;}
.reverse .item {margin-top:4px; color:#666; font-size:1.4rem;}

.formBlock {display:table; width:100%; margin:8px 0;}
.formBlock > div {display:table-cell; font-size:1.4rem; vertical-align:middle;}
.formBlock * {vertical-align:middle;}
.formBlock em {color:#222; vertical-align:baseline;}
.formBlock .tit {color:#222; font-size:1.6rem;}
.formBlock .info {white-space:nowrap;}
.formBlock .form {text-align:right;}
.formBlock .form > span {display:inline-block;}
.formBlock .form em {font-weight:300;}
.formBlock .iptWrap,
.formBlock .selectWrap {display:inline-block; width:110px; margin:0 0 0 5px;}
.formBlock .iptWrap .ipt.unit:not(.front) {padding-right:32px;}

.infoBox .formBlock {margin:18px 0 14px;}
.infoBox .formBlock em {font-weight:300;}
.infoBox .formBlock .ipt,
.infoDetail .formBlock .ipt {height:36px; font-size:14px;}
.infoBox .formBlock .iptWrap,
.infoBox .formBlock .selectWrap,
.infoDetail .formBlock .iptWrap {width:100px;}
.infoBox .formBlock span.unit,
.infoDetail .formBlock span.unit {font-size:14px;}

.infoBox .accoItem .formBlock {position:relative; z-index:2;}

.addCon {display:flex; min-height:44px; margin:12px -9px -9px; padding:3px 12px; border-radius:7px; background-color:#f8f8f8; font-size:1.3rem; text-align:center;}
.addCon > div:only-child {margin:auto;}
.infoBox .addCon {position:relative; margin:9px -7px 7px; padding:3px 16px; font-size:1.4rem; justify-content:space-between; align-items:center;}
.infoBox .addCon > .item {color:#222; font-size:1.3rem;}
.infoBox .addCon em {color:#222;}
.infoBox .addCon:after {content:''; position:absolute; right:16%; top:-4px; width:10px; height:10px; background-color:#f8f8f8; transform:rotate(45deg) skew(13deg, 13deg); z-index:0;}
.infoBox .check {margin:16px -24px 0; padding:5px 0 3px; border-top:1px solid #eee; text-align:center;}

.infoBox > .icoS {position:absolute; left:24px; top:22px; }
.infoBox > .icoS + .inner {padding:23px 23px 23px 56px;}
.infoBox .desc {margin-top:11px; font-size:14px;}
.infoBox .graph {display:table; width:100%; margin-top:24px; table-layout:fixed;}
.infoBox .graph > span {display:table-cell; height:6px; border:1px solid #fff; background-color:#eee;}

.infoBox.fund_1 span.on {background-color:#715deb;}
.infoBox.fund_2 span.on {background-color:#5d88fb;}
.infoBox.fund_3 span.on {background-color:#00a3bb;}
.infoBox.fund_4 span.on {background-color:#e658b2;}

.infoBox .txtArea {display:flex; margin-top:8px; font-size:1.4rem; justify-content:space-between; align-items:flex-end;}
.infoBox .txtArea > span:not(:first-child) {text-align:right;}
.infoBox .txtArea em {color:#222;}
.infoBox .txtArea em span {font-size:1.8rem;}
.infoBox .txtItem {padding-bottom:14px; font-size:1.4rem;}

.infoBox .infoHead {padding:0 0 20px; border-bottom:0;}
.infoBox .infoBlock {position:relative; margin:0; padding:17px 72px 17px 0; border-top:1px solid #eee; font-size:1.4rem;}
.infoBox .infoBlock .tit {margin:4px 0 0; font-weight:500; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.infoBox .infoBlock .addInfo {margin-top:4px; font-size:1.3rem;}
.infoBox .infoBlock .consentOk {position:absolute; right:0; top:50%; padding-left:19px; color:#3e9100; font-size:1.4rem; transform:translateY(-50%);}
.infoBox .infoBlock .consentOk::before {content:''; position:absolute; left:4px; top:2px; width:8px; height:12px; border:1px solid #3e9100; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}
.infoBox .infoBlock .btn_s.s {position:absolute; right:0; top:50%; width:72px; margin:0; border:0; background-color:#f8f8f8; transform:translateY(-50%);}
.infoBox .infoBlock + .btn_p.s {margin:3px 0 14px;}
.infoBox .infoBlock .info-ico {position:absolute; right:0; top:50%; transform:translateY(-50%);}
.infoBox .formList {margin:12px 0; padding-top:14px; border-top:1px solid #eee;}
.infoBox.nonLine .inner div:nth-child(2) {border-top: none;}

/*================================================== summary ===========================================*/
.content.topBg .summary > .inner {padding-top:85px;}
.content.prdDetail .summary > .inner {min-height:260px; padding-top:52px;}

.summary {position:relative; margin:0 -24px 30px; line-height:1.6;}
.summary > .inner {padding:52px 24px 65px; background-color:#5d88fb; color:#fff;}
.summary > .inner:only-child,
.summary > .inner.onlyChild {padding-bottom:25px;}
.summary.bg_1 > .inner {background-color:#715deb;}
.summary.bg_2 > .inner {background-color:#5d88fb;}
.summary.bg_3 > .inner {background-color:#00a3bb;}
.summary.bg_4 > .inner {background-color:#3e9100;}
.summary.bg_5 > .inner {background-color:#e658b2;}
.summary > .inner [class^=flag_] {margin:0; background-color:rgba(0, 0, 0, .15); color:#fff !important;}
.summary .tit {font-size:2.0rem;}
.summary .tit .sm {font-size:1.4rem;}
.summary .tit .icoBtn_open {top:-3px;}
.summary .tit .icoBtn_open:after {border-color:#fff;}
.summary .addInfo {margin-top:6px; color:#fff;}
.summary div.infoList {margin-top:10px;}

.summary .relateInfo {margin-bottom:19px; text-align:right;}
.summary .relateInfo .date,
.summary .relateInfo .links {color:#fff; font-size:1.4rem; line-height:24px;}
.summary .relateInfo .links:before {margin-top:1px; border-color:#fff;}
.summary .relateInfo .toggleSwitch input + label:before {background-color:#5073ef;}
.summary .relateInfo .toggleSwitch input:not(:checked) + label:after {background-color:#adc3fd;}
.summary .relateInfo .toggleSwitch input:checked + label:before {background-color:#fefeff;}
.summary .relateInfo .toggleSwitch input + label > span {font-size:1.4rem;}
.summary .relateInfo .tipWrap .icoBtn_tip {background-color:transparent; border-color:#fff;}
.summary .relateInfo .tipWrap .icoBtn_tip:after {color:#fff;}
.summary .state + .relateInfo {position:absolute; top:85px; right:24px;}

/* 연금 */
.summary .pensionInfo {position:absolute; right:17px; top:85px; z-index:10;}
.pensionInfo .icoBtn_pension {position:relative; width:36px; height:36px; border-radius:50%; background:url(../../assets/images/smart/common/ico_more_info.svg) no-repeat center center;}
.pensionType {display:none; position:absolute; right:36px; top:3px; width:145px; border:1px solid #d6e1fe; border-radius:1px; background-color:#f2f6ff;}
.pensionType button {width:100%; padding:10px 12px; border-top:1px solid #d6e1fe; color:#445fe6; text-align:left;}
.pensionType button:first-child {border-top:0;}
.pensionType .icoBtn_close {position:absolute; right:0; top:3px;}
.pensionType .icoBtn_close:before,
.pensionType .icoBtn_close:after {height:15px; background-color:#445fe6;}
.pensionInfo.on .pensionType {display:block;}
.pensionInfo.on .icoBtn_pension {background-image:none;}
.pensionInfo.on .icoBtn_pension::before,
.pensionInfo.on .icoBtn_pension::after {content:''; position:absolute; left:50%; top:50%; width:2px; height:25px; background-color:#fff; transform:translate(-50%, -50%) rotate(45deg);}
.pensionInfo.on .icoBtn_pension::after {transform:translate(-50%, -50%) rotate(135deg);}

.summary .pensionInfo + .tit {padding-right:40px;}

.summary .infoBox {margin-top:-40px; margin-bottom:0; padding:0 16px; border:none; border-radius:0; background-color:transparent; box-shadow:none;}
.summary .infoBox > .inner {position:relative; padding:16px 24px; border-radius:9px; background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, .06);}
.summary .infoBox > .inner.hasAcco {padding-bottom:36px;}
.summary .infoBox .item .icoS {vertical-align:text-bottom;}
.summary .infoBox .btnGroup {margin-top:11px; padding-bottom:0;}
.summary .infoBox .icoBtn_open {top:auto; height:36px;}
.summary .infoBox .icoBtn_open::after {left:50%; right:auto; top:50%; transform:translate(-50%, -50%) rotate(-45deg);}
.summary .infoBox .inner.hasAcco .infoDetail {padding-top:9px;}
.summary .infoBox div:not(.infoDetail) .infoList > li {padding:5px 0;}
.summary .infoBox .infoDetail .infoList {padding-top:12px;}
.summary .inner.on .icoBtn_open::after {transform:translate(-50%, -50%) rotate(-225deg);}
/* .summary .infoBox > .inner > .infoList > li {display:table; padding:7px 0 6px;}
.summary .infoBox > .inner > .infoList > li.on {margin-bottom:7px; border-bottom:1px solid #eee;} */
/* .summary .infoList .item {padding-right:20px; white-space:normal; word-break:keep-all;}
.summary .infoList .val {text-align:right !important;} */
.summary div.infoList .item {min-width:auto; color:#fff;}
.summary div.infoList .val {display:block; margin-top:25px; color:#fff; font-size:2.4rem; font-weight:500; line-height:1.3;}
.summary div.infoList .val .icoS {position:relative; top:4px; width:28px; height:28px; margin-right:0; vertical-align:baseline;}
.summary div.infoList .val em {font-size:2.8rem;}
.summary div.infoList .item + .val {margin-top:0;}
.summary div.infoList > div:first-child:not(:only-child) .val {display:inline-block; margin-top:0; color:rgba(255, 255, 255, .7); font-size:1.4rem; font-weight:300;}

.summary .addInfo .date {color:rgba(255,255,255,0.7);}
.summary div.infoList.div_2 {margin:30px 0;}
.summary div.infoList.div_2 > div .item,
.summary div.infoList.div_2 > div .val {display:block !important; text-align:center !important;}
.summary div.infoList.div_2 > div .val {color:#fff !important; font-size:2.4rem !important;}
.summary div.infoList.div_2 > div + div {position:relative;}
.summary div.infoList.div_2 > div + div:before {content:''; position:absolute; top:10px; bottom:12px; left:0; border-left:1px solid rgba(255,255,255,0.3);}
.summary div.infoList.div_2 ~ .addInfo {margin-bottom:-10px;}

.summary .accoBody {padding:5px 0; background-color:#fff;}
.summary .accoBody .infoList {padding-left:10px;}
.summary .accoBody .infoList > li {padding:4px 0 4px 11px !important;}
.summary .accoBody .infoList > li::before {content:''; position:absolute; left:0; top:9px; width:7px; height:8px; border-left:1px solid #aaa; border-bottom:1px solid #666; box-sizing:border-box;}
.summary .accoBody .infoList .item {font-size:1.3rem;}
.summary .accoBody .infoList .val {color:#666; font-size:1.3rem;}

.content.prdList {min-height:100vh; background:linear-gradient(-180deg, #fff, #f8f8f8 640px);}
.content.prdList .btn_arrow.gray {background-color:#eee;}
.content.prdList .helpWrap {background-color:#fff;}

.content.prdDetail .summary .tit {padding-right:40px;}
.content.prdDetail > .icoBtn_close {position:absolute; right:16px; top:16px; width:40px; height:40px; border-radius:50%; background-color:rgba(0, 0, 0, .3);}
.content.prdDetail > .icoBtn_close::before,
.content.prdDetail > .icoBtn_close::after {height:23px; background-color:#fff;}

.summaryTit {position:relative; margin:12px 16px 20px; padding:0; line-height:1.6;}
.summaryTit .titH2 {margin:0; padding-right:60px; font-weight:300;}
.summaryTit .titH2 em {color:#5642bf;}
.summaryTit [class^=icoBtn_sum] {position:absolute; right:0; top:50%; transform:translateY(-50%);}
.summaryList {margin:0 -24px; padding:0 24px;}
.summaryList .swiperWrap {margin:0 -24px 25px; padding-bottom:10px;}
.summaryList .swiper-container {padding:0 20px;}
.summaryList .slideList {padding-bottom:27px;}
.summaryList .swiper-slide {padding:0 20px;}
.summaryList .btnGroup {margin:0; padding:0 16px;}
.summaryCard {position:relative; border-radius:9px; background-color:#fff; box-shadow:0 8px 18px rgba(0, 0, 0, .06); overflow:hidden;}
.summaryCard .summary {margin:0; padding:0;}
.summaryCard .summary > .inner {padding:24px 24px 16px; overflow: hidden;}
.summaryCard .summary div.state {margin-bottom:11px;}
.summaryCard .summary .tit {padding-right:15px; font-size:1.6rem;}
.summaryCard .summary .addInfo {margin-top:2px; color:#666;}
.summaryCard .summary .total {font-size:1.4rem; font-weight:500; text-align:center;}
.summaryCard .summary .total .info {/*color:rgba(255, 255, 255, .7);*/ color:#fff; font-weight:300;}
.summaryCard .summary .total .num {font-size:1.8rem; line-height:1.4;}
.summaryCard .summary .total .num em {padding-right:2px; font-size:3.6rem; vertical-align:sub;}
.summaryCard .summary .total .money em {font-size:1.6rem;}
.summaryCard .summary > .inner .infoList {width:auto; margin:22px -8px 0; padding:6px 15px 4px; border-radius:7px; background-color:rgba(0, 0, 0, .12);}
.summaryCard .summary > .inner .infoList > li {padding:2px 0;}
.summaryCard .summary > .inner .infoList > li > div {color:#fff; font-size:1.3rem !important;}
.summaryCard .summary > .inner .infoList > li .item {opacity:0.8;}
.summaryCard .summary .infoBox {margin-top:0; padding:0;}
.summaryCard .summary .infoBox > .inner {padding:16px 24px 19px; background-color:transparent; box-shadow:none;}
.summaryCard .summary .infoBox > .inner::after {content:''; position:absolute; right:24px; top:25px; width:9px; height:9px; border:1px solid #b4b4b4; border-width:1px 1px 0 0; box-sizing:border-box; transform:rotate(45deg); z-index:1;}
.summaryCard .summary .infoBox .infoList {margin-top:9px;}
.summaryCard .summary .infoBox .infoList .item {padding-right:1px;}
.summaryCard .summary .infoBox .infoList .money.pointC6 em {font-size:1.4rem; letter-spacing:unset;}
.summaryCard .icoBtn_setting {position:absolute; top:29px; right:22px; padding-right:18px; background:url(../../assets/images/smart/content/ico_sum_setting.svg) no-repeat right center; color:rgba(255, 255, 255, .7); font-size:1.2rem;}

.summaryCard .graphAni {position:relative; height:58px; margin:24px -24px -16px; overflow:visible;}
.summaryCard .graphAni img {position:absolute; left:50%; top:0; width:544px; height:auto; transform:translateX(-50%);}
.summaryCard .graphAni img.bar {transform:translateX(-50%) rotate(-33deg); transition: transform 0.45s ease-in-out;}
.summaryCard + .btnGroup {margin-top:27px; padding:0;}

/* 대출 */
.sumLoan {position:relative; margin-bottom:3px; padding-left:41px; background:url(../../assets/images/smart/content/ico_loan_sum_unit.svg) no-repeat 0 50% / 32px 32px;}
.sumLoan.give {background-image:url(../../assets/images/smart/content/ico_loan_sum_give.png);}
.sumLoan .icoS {position:absolute; top:50%; left:0; width:32px; height:32px; margin-right:0; border-radius:0; transform:translateY(-50%);}
.sumLoan .tit {font-size:1.6rem;}
.sumLoan .tit .sm {color:rgba(255,255,255,0.7);}
.sumLoan .money {color:#222; font-size:2.4rem; font-weight:500; line-height:1.3;}
.sumLoan .money em {display:inline-block; margin-top:-2px; font-size:2.8rem; vertical-align:top;}
.sumLoan + .guideBox {margin-top:30px;}

.summary .sumLoan {padding-left:65px; background:url(../../assets/images/smart/content/ico_loan_sum_unit.png) no-repeat 0 50% / 48px 48px;}
.summary .sumLoan .icoS {width:48px; height:48px;}
.summary .sumLoan .money {margin-top:4px; color:#fff; font-size:2.8rem;}
.summary .sumLoan .money em {margin-top:0; font-size:2.8rem;}


/* 대출상단비주얼 */
.summaryVisual {padding-bottom:10px; text-align:center; color:#fff;}
.summaryVisual .tit {position:relative; display:inline-block; height:24px;}
.summaryVisual .tit em {padding-right:29px; font-size:1.6rem; font-weight:300; line-height:24px; color:rgba(255,255,255,0.7); vertical-align:top;}
.summaryVisual .tit em:only-child {padding-right:0;}
.summaryVisual .tit .icoBtn_select {position:absolute; top:0; left:0; right:0; width:100%; height:24px;}
.summaryVisual .tit .icoBtn_select:after {content:''; position:absolute; right:3px; top:10px; width:7px; height:7px; margin-left:-3px; border:1px solid rgba(255,255,255,0.7); border-width:0 1px 1px 0; transform:translate(-50%, -50%) rotate(45deg); transition:transform 0.25s;}
.summaryVisual .txtL em {font-size:2.4rem;}
.summaryVisual .money {font-size:2.8rem; letter-spacing:-0.05rem; font-weight:500;}
.summaryVisual .desc {font-size:1.4rem;}
.summaryVisual .motion {margin-top:10px;}
.summaryVisual .motion .imgZ {zoom:0.3333;}
.summaryVisual .addInfo {display:flex; justify-content:space-between; padding:0 9px; font-size:1.4rem;}
.summaryVisual .addInfo .info:not(.icoBtn_infoPop) {color:rgba(255,255,255,0.7); font-weight:500;}
.summaryVisual .addInfo .icoBtn_infoPop.info {margin-left:auto; color:#fff; font-size:1.4rem;}
.summaryVisual .addInfo .icoBtn_infoPop.info:before {width:16px; height:16px; line-height:14px; font-size:1.3rem; font-weight:300; color:#fff; border-color:#fff;}
.summaryVisual .addInfo .links.arrow {margin-left:auto; color:#fff; font-size:1.4rem;}
.summaryVisual .addInfo .links.arrow:before {border-color:#fff;}
.summaryVisual .addInfo .links.arrow:after {content:""; position:absolute; bottom:0; left:0; right:10px; border-bottom:1px solid rgba(255,255,255,0.7);}

.summaryVisual [class^=ani] {position:relative; width:136px; height:136px; margin:10px auto 0;}
.aniAppli [class^=tie] {position:absolute; left:50%; width:108px; height:11px; transform:translateX(-50%); overflow:hidden;}
.aniAppli .tieTop {top:0px; height:41px; background:url(../../assets/images/cdi/content/ani_app_tie1.svg) no-repeat center bottom; z-index:10;}
.aniAppli .tieTop:after {content: ''; position: absolute; top:0; left:0; right:0; height: 13px; background-color: #715deb}
.aniAppli .tieDown {top:41px; background:url(../../assets/images/cdi/content/ani_app_tie2.svg) no-repeat center center; z-index:1;}
.aniAppli .paperGroup {position:relative; width:108px; height:130px; margin:0 auto; z-index:2; overflow: hidden;}
.aniAppli .paper {display:inline-block; position:absolute; left:50%; top:0; width:108px; height:100%; background-repeat:no-repeat; background-position:center 0; transform:translate(-50%,-100%);}
.aniAppli .paper:nth-child(1) {background-image:url(../../assets/images/cdi/content/ani_app_paper1.svg);}
.aniAppli .paper:nth-child(2) {background-image:url(../../assets/images/cdi/content/ani_app_paper2.svg);}
.aniAppli .paper:nth-child(3) {background-image:url(../../assets/images/cdi/content/ani_app_paper3.svg);}
.aniAppli .paper:nth-child(4) {background-image:url(../../assets/images/cdi/content/ani_app_paper4.svg);}

/* PaperGroupAnimation */
.aniAppli .paper {animation: paperApear forwards cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-duration: 0.5s;}
.aniAppli .paper:nth-child(2) {animation-delay:0.7s;}
.aniAppli .paper:nth-child(3) {animation-delay:1.4s;}
.aniAppli .paper:nth-child(4) {animation-delay:2.1s;}
@keyframes paperApear{
	0% {transform:translate(-50%,-100%);}
	100% {transform:translate(-50%,0);}
}

.aniRepay .bag {display:inline-block; position:absolute; left:-5px; top:15px; width:104px; height:114px; background:url(../../assets/images/cdi/content/ani_repay_moneybag.svg) no-repeat center center;}
.aniRepay .coinGroup {position:absolute; right:-7px; bottom:0; width:80px; height:100%; z-index:2;}
.aniRepay .coin {display:inline-block; position:absolute; width:87px; height:46px; background:url(../../assets/images/cdi/content/ani_repay_coin.svg) no-repeat center 0;}
.aniRepay .coin:nth-child(1) {bottom:36px; right:2px; z-index:3;}
.aniRepay .coin:nth-child(2) {bottom:23px; right:-4px; z-index:2;}
.aniRepay .coin:nth-child(3) {bottom:10px; right:0; z-index:1;}
.aniRepay .coin:nth-child(4) {bottom:-2px; right:0; z-index:0;}

/* CoinAnimation */
.aniRepay .bag {opacity:0; transform:translate(-40px,0); animation: coinBagApear forwards cubic-bezier(0.165, 0.840, 0.440, 1.000); animation-duration: 0.8s; animation-delay:0.7s;}
.aniRepay .coin {opacity:0; transform:translate(0,-120px); animation: coinFalling forwards cubic-bezier(0.645, 0.045, 0.355, 1.000); animation-duration: 0.25s;}
.aniRepay .coin:nth-child(4) {animation-delay:1.4s;}
.aniRepay .coin:nth-child(3) {animation-delay:1.7s;}
.aniRepay .coin:nth-child(2) {animation-delay:2.1s;}
.aniRepay .coin:nth-child(1) {animation-delay:2.4s;}
@keyframes coinBagApear{
	100% {opacity:1; transform:translate(0,0)}
}
@keyframes coinFalling{
	0% {opacity:0.3;}
	100% {opacity:1; transform:translate(0,0)}
}

.infoBoxGroup {margin:-56px 0 0; padding:0 8px;}
.infoBoxGroup + .infoBoxGroup {margin-top:0 !important;} /*실사용x*/
.infoBoxGroup .infoBox {margin-top:0; margin-bottom:16px;}
.infoBoxGroup .infoBox > .inner, 
.infoBoxGroup .infoBox > .inner.hasAcco  {padding-top:24px; padding-bottom:28px;}
.infoBoxGroup .infoBox .state {padding-right:34px;}
.infoBoxGroup .infoBox .state .info {margin-right:2px;}
.infoBoxGroup .infoBox .flag_prd2 {color:#445fe6 !important; background-color:#f2f6ff;}
.infoBoxGroup .infoBox .tit {margin-bottom:12px; font-size:1.6rem;}
.infoBoxGroup .infoBox .on .tit {font-weight:500;}
.infoBoxGroup .infoBox .icoBtn_open {left:inherit; right:0; top:0; bottom:0; width:60px; height:60px;} 
.infoBoxGroup .infoBox .infoDetail .infoList {border-top:none;}
.infoBoxGroup .infoBox .pointC6 {font-weight:300;}
.infoBoxGroup .infoBox .reverse {margin-bottom:0;}

/* 대출상단 슬라이드 */
.infoBoxGroup.swiperWrap {margin:-56px 0 -16px; padding:0;}
.infoBoxGroup.swiperWrap .swiper-container {padding:0 8px 0 24px;}
.infoBoxGroup.swiperWrap .infoBox {padding:0 16px 24px 0; margin-bottom:0;}
.infoBoxGroup.swiperWrap .infoBox:only-child {padding-left:24px; padding-right:24px;}
.infoBoxGroup .swiper-controls {bottom:10px;}
.swiper-counter {display:inline-block; height:27px; padding:0 8px; line-height:27px; font-size:1.3rem; color:#fff; letter-spacing:-0.15rem; text-indent:-1px; border-radius:13px; background:rgba(0,0,0,0.48);}
.swiper-counter em {font-weight:300;}

/* 금액선택 */
.moneyCalc {display:flex; position:relative; margin-top:0; align-items:center; justify-content:center; flex-wrap:wrap; height:90px; border-bottom:0;}
.moneyCalc .txt {display:inline-block; margin-bottom:0; padding-left:32px; color:#949494; background:url(../../assets/images/smart/content/ico_total_price.png) no-repeat 0 50% / 24px 24px;}
.moneyCalc.on .txt {color:#222;}
.moneyCalc.minBox {height:60px;}
.moneyCalc.minBox .txt {padding-bottom:8px; border-bottom:1px solid #eee; background-position: 0 2px;}
.moneyCalc .money {margin:-9px -20px 0; width:calc(100% + 40px); font-size:3.2rem; letter-spacing:-0.05rem; text-align:center; font-weight:500; color:#222;}
.moneyCalc .icoBtn_money {position:absolute; top:0; left:0; width:100%; height:100%; z-index:10;}
.moneyCalc .icoBtn_money:not([disabled]) + .iptWrap .ipt {background-color:#fff !important;}
.moneyCalc .icoBtn_money:not([disabled]) + .iptWrap span.unit {color:#666;}

.hasAcco .moneyCalc {justify-content:flex-start; margin-top:12px; height:44px; margin-bottom:0; padding-left:32px; color:#bbb; border-bottom:1px solid #eee; background:url(../../assets/images/smart/content/ico_total_price.png) no-repeat 0 50% / 24px 24px;}
.hasAcco .moneyCalc .txt {padding:0; background:none; color:#666;}
.hasAcco .moneyCalc .money {display:none; width:100%; margin:0; text-align:left; font-size:1.6rem; font-weight:300;}
.hasAcco .moneyCalc .money em {font-weight:300;}
.hasAcco .moneyCalc.on .txt {display:inline-block; position:absolute !important; width:1px; height:1px; margin:-1px; border:0; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); clip-path:inset(50%);}
.hasAcco .moneyCalc.on .money {display:block;}
.bottomSheet .moneyCalc {margin-bottom:20px;}

.moneyCalc.input {height:44px; padding-left:0; margin-top:4px; background:none; border:none;}
.moneyCalc.input .iptWrap {margin:0;}

.bsKeypad {display:flex; flex-wrap:wrap; position:relative; margin:32px -24px -40px; width:100vw; padding-bottom:50px; border-top:1px solid #6955e2; }
.bsKeypad .btn_k {width:33.3333%; min-height:50px; margin:0; padding-bottom:6px; color:#fff; border-left:1px solid #6955e2; border-bottom:1px solid #6955e2; background-color:#715deb;}
.bsKeypad .btn_k:active {background-color:rgba(113,93,235,0.85);}
.bsKeypad .btn_k:nth-child(3n+1) {border-left-color:transparent;}
.bsKeypad .btn_k:nth-last-child(-n+2) {position:absolute; bottom:0;}
.bsKeypad .btn_k:nth-last-child(1) {right:0;}
.bsKeypad .btn_k:nth-last-child(3) {margin:0 auto -50px; border-left-color:#6955e2;}

/* 금액 filter */
.moneyFilt {display:flex; align-items:center; gap:0 4px; justify-content:center; margin-top:4px;}
.moneyFilt > li {max-width:67px; width:100%;}
.moneyFilt.full > li {max-width:inherit;}
.moneyFilt .btn_g,
.moneyFilt .ipt + label {width:100%; height:36px; padding:0 2px; line-height:34px; font-size:1.4rem; text-align:center; color:#666; border-radius:2px; background:#f7f8f8; transition: all 0.15s ease-out}
.moneyFilt .ipt + label {color:#445fe6; border:1px solid #d6e1fe; background:#f2f6ff;}
.moneyFilt .ipt + label:before {display:none;}
.moneyFilt .ipt:checked + label {color:#fff; border-color:#5d88fb; background:#5d88fb; box-shadow:0 9px 14px rgba(93,136,251,0.24);}
.moneyFilt + .selectWrap {margin-top:8px;}

/* bar 그래프 */
.barGraph {display:flex; flex-direction:column-reverse; margin-bottom:26px;}
.barGraph .graph {display:flex; height:4px; background-color:#eee;}
.barGraph .graph .bar {display:flex; margin-right:auto; background-color:#47435d;}
.barGraph .txtArea {display: flex; justify-content:space-between; align-items:flex-end; margin:8px 0 4px; font-size:1.2rem; color:#959595;}
.barGraph:nth-last-of-type(1) {margin-bottom:0;}

.infoBox .barGraph {display:block;}
.infoBox .barGraph .graph {margin-top:66px;}
.infoBox .barGraph .graph .bar {background-color:#e658b2;}
.infoBox .barGraph .graph .bar.full {background-color:transparent;}
.infoBox .barGraph .graph .bar.full .msgTip {margin-right:-18px;}
.infoBox .barGraph .graph .bar:not(.full) .msgTip:before {left:14px; right:inherit;}
.infoBox .barGraph .txtArea {margin:4px 0 0;}
.infoBox .barGraph .msgTip {position:relative; top:-40px; margin-left:auto; margin-right:-35px;}

/*================================================== Accordion(아코디언) ===========================================*/
.accoHead {position:relative;}
.accoBody {position:relative; background-color:#f8f8f8;}

.icoBtn_acco {width:70px; height:70px;}
.icoBtn_acco span {display:inline-block; position:absolute; width:1px; height:1px; margin:-1px; border:0; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); clip-path:inset(50%);}
.icoBtn_acco:after {content:''; position:absolute; left:50%; top:50%; width:11px; height:11px; margin-top:-3px; border:1px solid #222; border-width:0 2px 2px 0; box-sizing:border-box; transform:translate(-50%, -50%) rotate(45deg); transition:all 0.25s;}
.accoItem.on > .accoHead .icoBtn_acco:after {margin-top:3px; border-color:#715deb; transform:translate(-50%, -50%) rotate(-135deg);}


/*================================================== 본문 콘텐츠 아코디언 ==================================================*/
.accoList {margin:0 -24px 32px; border-top:1px solid #eee;}
.accoList > li {position:relative; border-bottom:1px solid #eee;}
.accoList > li.on {border-color:#aaa;}
.accoList .accoHead {padding-right:70px;}
.accoList .accoHead > .inner {min-height:71px; padding:24px 0 23px 24px;}
.accoList .accoHead .tit {color:#222;}
.accoList .accoHead .infoList {margin:0;}
.accoList .accoHead .infoList.half {margin-bottom:-16px;}
.accoList .accoHead div.infoList .item em {color:#222; font-size:1.6rem;}
.accoList .accoHead .icoBtn_acco {position:absolute; right:0; top:50%; transform:translateY(-50%);}
.accoList .accoBody {padding:20px 24px;}
.accoList .accoBody .btn_s.m.more {margin-bottom:0;}
.accoList .accoBody .infoList {margin:0;}
.accoList .accoBody .infoList + .infoList {margin-top:15px;}
.accoList .accoBody .ipt[disabled],
.accoList .accoBody .infoDetail {background-color:#eee;}

.accoList.info .accoHead .state ~ .tit {margin-right:-46px;}
.accoList.info .accoHead .infoList.half {width:auto; margin-right:-46px;}
.accoList.info .accoHead .infoList.half > li:last-child:nth-child(odd):not(:only-child) {width:100%; text-align:right;}
.accoList.info .accoHead .icoBtn_acco {top:0; transform:none;}
.accoList.detail .accoHead > .inner {padding:17px 0 17px 24px;}
.accoList.detail .accoHead .infoList.half {width:auto; margin:-4px -46px -2px 0;}
.accoList.detail .accoHead .infoList.half > li:first-child {width:100%; text-align:left;}
.accoList.detail .accoHead .infoList.half > li {float:right; padding:3px 0; text-align:right;}
.accoList.detail .accoHead .infoList.half > li:nth-child(even) {float:left; text-align:left;}
.accoList.detail .accoHead .icoBtn_acco {top:0; transform:none;}

.accoList .accoItem.on > .accoHead .tit,
.accoList .accoItem.on > .accoHead div.infoList > div {font-weight:500;}

.progressStep + .accoList,
.popup header + .accoList {border-top:0;}


/*================================================== Help(도움말) ==================================================*/
.helpWrap {margin:32px -24px 0; border-top:10px solid #f8f8f8; font-size:1.4rem;}
.helpWrap > li {border:1px solid #ddd; border-width:1px 0; color:#222;}
.helpWrap .icoBtn_acco {display:block; width: 100%; height: auto; padding:21px 62px 21px 52px; font-weight:500; text-align: left;}
.helpWrap .icoBtn_acco:before {content:'?'; position:absolute; left:24px; top:50%; width:18px; height:18px; border-radius:50%; background-color:#715deb; color:#fff; font-size:1.3rem; font-weight:700; line-height:18px; text-align:center; transform:translateY(-50%); box-sizing:border-box;}
.helpWrap .icoBtn_acco:after {left: auto; right: 18px;}
.helpWrap .accoBody {display:none; padding:23px 24px 28px;}
.helpWrap .txtList {margin-bottom:0;}
.helpWrap .txtList.disc {color:#222;}
.helpWrap .img > img {width:100%;}
.helpWrap li .links {margin:0;}

.bgGrayArea + .helpWrap {margin-top:-32px;}

/* 유의사항 */
.helpWrap.caution .icoBtn_acco:before,
div.helpWrap.caution .tit:before {content:'!'; font-size:1.2rem; line-height:16px;}

/* 박스타입 */
div.helpWrap {padding:0 24px 24px 24px; margin-left:0; margin-right:0; font-size:1.6rem; border:1px solid #ddd; background-color:#fff;}
div.helpWrap .tit {position:relative; margin:0 -24px 24px; padding:18px 24px 20px 48px; color:#222; font-weight:500; border-bottom:1px solid #f2f2f2;}
div.helpWrap .tit:before {content:'?'; position:absolute; left:22px; top:20px; width:18px; height:18px; border-radius:50%; background-color:#715deb; color:#fff; font-size:13px; font-weight:700; line-height:18px; text-align:center; box-sizing:border-box;}
div.helpWrap.caution .tit:before {color:#715deb; background-color:transparent; border:1px solid #715deb;}
div.helpWrap.txtP_wrap {padding:10px; background-color:#f3f3f7;}


/*================================================== FAQ ==================================================*/
.accoList.faq > li:last-child {border-color:#aaa;}
.accoList.faq .accoHead > .inner {padding:24px 0 24px 62px; background:transparent url(../../assets/images/smart/common/ico_faq_q.svg) no-repeat 24px 46px; font-size:1.6rem;}
.accoList.faq .accoHead .cate {display:block; margin-bottom:2px; color:#666; font-size:1.4rem; font-weight:300; overflow:hidden;}
.accoList.faq .accoHead .cate > span {position:relative; margin-right:18px;}
.accoList.faq .accoHead .cate > span:before {content:''; position:absolute; left:-16px; top:8px; width:7px; height:7px; border:1px solid #666; border-width:1px 1px 0 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg); transition:all 0.25s ease-in-out; z-index:1;}
.accoList.faq .accoBody {padding:30px 24px;}

/*================================================== 보험용어사전 ==================================================*/
.insTermDicList {padding-top: 60px;}
.insTermDicList > li {padding: 20px 0; border-bottom: 1px solid #ddd; font-size: 1.6rem;}
.insTermDicList .tit {color: #445fe6; font-weight: 400;}
.insTermDicList .accoBody {margin-top: 5px; background-color: transparent;}
.insTermDicList .accoBody p {color: #666;}

/*================================================== 계약정보 리스트 ==================================================*/
.contractInfoList {margin-top:-10px;}
.contractInfoList > li.accoWrap {margin-bottom:16px; border:1px solid #fff; border-radius:8px; background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1);}
.contractInfoList .accoHead {display:flex; position:relative; width:100%; padding:23px 50px 23px 23px; color:#222; text-align:left; align-items:center;}
.contractInfoList .accoHead .img {flex-grow:0; margin-right:7px;}
.contractInfoList .accoHead .img.empty {width:40px; height:40px; border-radius:50%; line-height:40px; color:#fff; background-color:#717592; text-align:center;}
.contractInfoList .accoHead .info {flex-grow:1; /*text-overflow:ellipsis; white-space:nowrap; overflow:hidden;*/}
.contractInfoList .accoHead span {display:block; font-weight:300;}
.contractInfoList .accoHead .icoBtn_acco {position:absolute; left:0; top:0; bottom:0; width:100%; height:auto;}
.contractInfoList .accoHead .icoBtn_acco::after {left:auto; right:23px; width:9px; height:9px; border-color:#bcbcbc; border-width:0 1px 1px 0; transform:translateY(-50%) rotate(45deg);}
.contractInfoList .accoBody {border-top:1px solid #eee; background-color:#fff;}
.contractInfoList > li.accoWrap .infoBox {margin:0; border-radius:0; box-shadow:none;}
.contractInfoList > li.accoWrap .infoBox:not(:first-child) > .inner {border-top:1px solid #eee;}
.contractInfoList > li.accoWrap.active {border-color:#5d88fb;}
.contractInfoList > li.accoWrap.active .infoBox.active {border-color:transparent;}
.contractInfoList .infoBox .infoList.half > li:nth-child(3):last-child {width:100%; text-align:right;}
.contractInfoList .btn_s.m.more {margin:0 0 4px; border:0; border-top:1px solid #eee; font-size:14px;}


/*================================================== 연금 유형 ==================================================*/
.pensionAccoList > li {margin-bottom:-1px;}
.pensionAccoList .accoHead .ipt + label.lg {width:100%; min-height:48px; padding:17px 15px 19px 46px; border:1px solid #e1e1e1; background-color:#fff; color:#222; font-size:16px; font-weight:300; text-align:left;}
.pensionAccoList .accoHead .ipt + label.lg::before {left:15px; top:18px;}
.pensionAccoList .accoHead .ipt + label.lg::after {left:24px; top:23px;}
.pensionAccoList .accoHead .ipt:checked + label {border-color:#715deb; color:#5642bf; font-weight:500; box-shadow:3px 3px 6px rgba(86, 66, 191, .08); z-index:2;}
.pensionAccoList .accoHead .icoBtn_acco {position:absolute; right:0; top:0; width:56px; height:64px; z-index:9;}
.pensionAccoList .infoTxt {position:absolute; right:56px; top:50%; color:#666; font-size:1.4rem; transform:translateY(-50%); z-index:9;}
.pensionAccoList .infoTxt em {display:inline-block; margin-left:3px; color:#e658b2;}
.pensionAccoList .accoBody {padding:28px 15px;}
.pensionAccoList .formList {margin:0;}

.pensionList {margin-bottom:32px;}

.formList .pensionAccoList > li:not(:first-child) {margin-top:9px;}
.formList .pensionAccoList .accoHead .ipt + label.lg {padding-top:14px; padding-bottom:15px;}
.formList .pensionAccoList .accoHead .icoBtn_acco {height:55px;}
.formList .pensionAccoList .accoHead .ipt + label.lg::before {top:15px;}
.formList .pensionAccoList .accoHead .ipt + label.lg::after {top:20px;}
.formList .pensionAccoList .accoBody {padding-top:14px; padding-bottom:20px;}
.formList .pensionAccoList li.flex,
.formList .pensionAccoList li.flex .val {display:flex; align-items:center; justify-content:space-between;}
.formList .pensionAccoList li.flex .val {width:125px;}
.formList .pensionAccoList li.flex .val .iptWrap {width:65%; margin:0;}
.formList .pensionAccoList li.flex .val .unit,
.formList .pensionAccoList li.flex .val .ipt {font-size:1.4rem;}
.formList .pensionAccoList .iptGroup + .iptGroup {margin-top:16px; padding-top:8px; border-top:1px solid #ddd;}

/*================================================ BBS ================================================*/
/* 게시판 리스트 */
.bbsList {margin:0 -24px; border-top:1px solid #ddd;}
.bbsHead {display:block; padding:20px 24px; border-bottom:1px solid #ddd;}
.bbsHead .titArea {margin:0;}
.bbsHead .tit {color:#222; display:-webkit-box; max-height:48px; color:#222; font-size:1.6rem; font-weight:500; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.playCard .bbsHead .tit {font-size:1.6rem !important;  font-weight:500 !important;}
.bbsHead .date {margin-top:6px; color:#909090; font-size:1.4rem; vertical-align:middle;}
.bbsHead img.icon {position:relative; top:-3px;}

.bbsList .bbsHead {display:flex; flex-wrap:wrap; align-items:flex-end;}
.bbsList .bbsHead .tit {padding-right:5px; max-width:calc(100% - 16px);}
.bbsList .bbsHead .state {width:100%; margin-bottom:9px;}
.bbsList .bbsHead .date {width:100%;}

/* 게시판 상세 */
.bbsView .bbsHead {margin-bottom:30px; padding:0 0 30px 0;}
.bbsView .bbsHead .titArea .tit {max-height:none; font-size:2rem; -webkit-line-clamp:unset;}
.bbsView .bbsHead .txtItem {margin-top:15px; font-size:1.4rem;}
.bbsView .bbsBody {margin-bottom:30px; line-height:1.8;}
.bbsView .img {margin:24px 0 32px;}
.bbsView .img > img {width:100%; height:auto;}

/* 게시판 상세 - 이전_다음글 */
.bbsPager {margin-top:30px; border:1px solid #aaa; border-width:1px 0; font-size:1.4rem;}
.bbsPager > li + li {border-top:1px solid #ddd;}
.bbsPager .tit {display:-webkit-box; vertical-align:middle; overflow:hidden; color:#666; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.bbsPager .itemPrev,
.bbsPager .itemNext {display:inline-block; width:80px; margin-right:15px; padding:15px 0; color:#222; background:#f8f8f8; text-align:center;}

/* 이벤트 게시판 */
[class*=event] .hashtag {display:inline-block; margin-right:3px; color:#1a75e4; font-size:13px;}
[class*=event] .date > span {display:inline-block; position:relative; font-size:13px;}
[class*=event] .date > span:not(:last-child) {padding-right:17px;}
[class*=event] .date > span.dDay {font-weight:500;}
[class*=event] img {width:100%; height:auto;}

.eventList {margin-top:24px;}
.eventList > li {margin-bottom:32px;}
.eventList .block {position:relative;}
.eventList .info {margin-top:10px;}
.eventList .info:after {display:block; content:''; clear:both;}
.eventList .date {color:#222;}
.eventList [class^=eventBtn_] {position:absolute; right:0; bottom:0; width:0; height:0; border-top:100px solid transparent; border-right:100px solid #715deb; color:#fff; font-size:14px;}
.eventList [class^=eventBtn_] > span {position:absolute; right:-85px; top:-50px; width:30px; line-height:1.4;}
.eventList .eventBtn_individ {border-right:100px solid #5d88fb;}

.bbsView.event .hashtagGroup {width:100%;}
.bbsView.event .allImg {margin-left:-24px; margin-right:-24px;}
.bbsView.event .titH3 {margin-top:32px;}

/* 퀴즈형 이벤트 */
.eventQuiz {margin:32px 0; padding:16px 24px; background-color:#f8f8f8;}
.eventQuiz > li {padding:10px 0;}
.eventQuiz > li > div {float:none; width:100%; padding:0;}
.eventQuiz .question {margin-top:0; padding:0 0 0 30px; background:url(../../assets/images/smart/common/ico_faq_q.svg) no-repeat 0 2px; color:#222; font-size:1.8rem; font-weight:500;}
.eventQuiz .answer {margin-top:16px;}
.eventQuiz .iptGroup > li {display:block; margin:8px 0; padding:0;}
.eventQuiz .iptGroup label {display:block; padding:20px 12px 16px 64px; background-color:#fff; color:#222; font-size:1.8rem;}
.eventQuiz .iptGroup label:before {content:none;}
.eventQuiz .iptGroup label::after {content:''; position:absolute; top:24px; left:32px; width:9px; height:13px; border:1px solid #ccc; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}
.eventQuiz .iptGroup .ipt:checked + label {background-color:#00b9ef; color:#fff; font-weight:500; box-shadow:4px 8px 16px #00428E3D; text-shadow:1px 1px 3px rgba(0,0,0,0.5);}
.eventQuiz .iptGroup .ipt:checked + label:after {border-color:#fff;}

/* 댓글 리스트 */
.cmntContent {padding:24px; border-bottom:1px solid #ddd;} /*1201추가*/
.commentWrap {margin:0 -24px; border-top:1px solid #ddd;}
.commentWrap > li {padding:24px; border-bottom:1px solid #ddd;}
.cmntOption .commentWrap > li {padding:0px !important; border-bottom:none !important;} /*1201추가*/
.commentWrap > li .name {margin-bottom:5px; color:#222; font-weight:500;}
.commentWrap > li .comment {margin-bottom:5px; color:#222;}
.commentWrap > li .date {font-size:1.4rem;}
.commentWrap > li .btn_s {border-color:#ccc; color:#444;}
.commentWrap > li [class^=btn_].s {width:auto; margin-top:15px; padding:0 15px;}


/*================================================== 이벤트 템플릿 ==================================================*/
.bbsView.event .eventTit {display:inline-block; position:absolute !important; width:1px; height:1px; margin:-1px; border:0; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); clip-path:inset(50%);}
.bbsView.event [class$=Ev] {margin-top:-31px; margin-bottom:32px;}

/* 매일매일 퀴즈 이벤트 */
.luckyQuizEv {margin-left:-24px; margin-right:-24px; padding-bottom:27%; background-color:#5642bf !important; background-repeat:no-repeat !important; background-position:center bottom !important; background-size:100% !important;}
.luckyQuizEv > .inner {padding:86% 14% 0; background-repeat:no-repeat !important; background-position:center 0 !important; background-size:100% !important;}
.luckyQuizEv [class$=Tit] {margin-bottom:10px; color:#222; font-size:2.4rem; font-weight:700; text-align:center;}
.luckyQuizEv .aTit {color:#5642bf;}
.luckyQuizEv .question {font-size:1.6rem; line-height:1.5;}
.luckyQuizEv .answer {display:flex; flex-flow:column-reverse; margin-top:36px; padding-top:32px; border-top:1px solid #ddd;}
.luckyQuizEv .quizHint {font-size:1.4rem;}
.luckyQuizEv .quizHint img {width:56px; height:26px;}
.luckyQuizEv .quizHint .hint {margin:7px 0 0;}
.answerIpt {position:relative; margin-bottom:30px;}
.answerIpt .iptWrap {width:100%; margin:0 0 16px;}
.answerIpt .ipt {height:64px; border:1px solid #ccc; border-radius:7px; font-size:18px; box-shadow:4px 4px 8px rgba(113, 93, 235, .24);}
.answerIpt .btn_p {min-width:100%; min-height:64px; border-radius:7px; margin:0;}

/* 룰렛 게임 이벤트 */
.rouletteEv {margin-left:-24px; margin-right:-24px; padding:74% 0 32px; background-color:#5642bf !important; background-repeat:no-repeat !important; background-position:center 0 !important; background-size:100% !important;}
.rouletteArea {position:relative; width:100%; max-width:500px; margin:0 auto; overflow:hidden;}
.rouletteArea .shadow {position:relative; left:50%; min-width:375px; transform:translateX(-50%);}
.rouletteArea .pin {position:absolute; left:50%; top:5.8673%; width:38px; height:53px; background:url(../../assets/images/smart/content/event_roulette_pin.png) no-repeat center 0; background-size:cover; transform:translateX(-50%); z-index:9;}
.rouletteArea .icoBtn_gameGo {position:absolute; left:50%; top:50%; width:87px; height:87px; background:url(../../assets/images/smart/content/event_roulette_btn.png) no-repeat center 0; background-size:cover; transform:translate(-50%, -50%); z-index:9;}
.rouletteArea .board {display:inline-block; position:absolute; left:8.9333%; right:8.9333%; top:10.7142%; bottom:10.7142%; background-repeat:no-repeat; background-position:center center; background-size:100%; z-index:2;}
.rouletteArea .item {position:absolute; left:0; top:0; width:100%; height:100%; padding-top:2.6rem; color:#445fe6; font-size:1.2rem; font-weight:500; letter-spacing:-0.08rem; text-align:center; transform-origin:center center;}
.rouletteArea .item > span {display:block;}
.rouletteArea .tit {margin-top:-6px; color:#222;}
.rouletteArea .prizes {width:30px; height:30px; margin-top:5px;}
.rouletteArea .total4 {background-image:url(../../assets/images/smart/content/event_roulette_board4.png);}
.rouletteArea .total4 .item:nth-of-type(1) {transform:rotate(45deg);}
.rouletteArea .total4 .item:nth-of-type(2) {transform:rotate(135deg);}
.rouletteArea .total4 .item:nth-of-type(3) {transform:rotate(225deg);}
.rouletteArea .total4 .item:nth-of-type(4) {transform:rotate(315deg);}
.rouletteArea .total4 .item:nth-of-type(4) ~ .item {display:none;}
.rouletteArea .total6 {background-image:url(../../assets/images/smart/content/event_roulette_board6.png);}
.rouletteArea .total6 .item:nth-of-type(1) {transform:rotate(0deg);}
.rouletteArea .total6 .item:nth-of-type(2) {transform:rotate(60deg);}
.rouletteArea .total6 .item:nth-of-type(3) {transform:rotate(120deg);}
.rouletteArea .total6 .item:nth-of-type(4) {transform:rotate(180deg);}
.rouletteArea .total6 .item:nth-of-type(5) {transform:rotate(240deg);}
.rouletteArea .total6 .item:nth-of-type(6) {transform:rotate(300deg);}
.rouletteArea .total6 .item:nth-of-type(6) ~ .item {display:none;}
.rouletteArea .total8 {background-image:url(../../assets/images/smart/content/event_roulette_board8.png);}
.rouletteArea .total8 .item:nth-of-type(1) {transform:rotate(0deg);}
.rouletteArea .total8 .item:nth-of-type(2) {transform:rotate(45deg);}
.rouletteArea .total8 .item:nth-of-type(3) {transform:rotate(90deg);}
.rouletteArea .total8 .item:nth-of-type(4) {transform:rotate(135deg);}
.rouletteArea .total8 .item:nth-of-type(5) {transform:rotate(180deg);}
.rouletteArea .total8 .item:nth-of-type(6) {transform:rotate(225deg);}
.rouletteArea .total8 .item:nth-of-type(7) {transform:rotate(270deg);}
.rouletteArea .total8 .item:nth-of-type(8) {transform:rotate(315deg);}

.rouletteArea .board.start {animation: rouletteStart 1s cubic-bezier(0.600, -0.280, 0.735, 0.045), rouletteLoop 11s 1s cubic-bezier(0.075, 0.820, 0.165, 1.000) forwards;}

/* 출석체크 이벤트 */
.attendanceEv .missionArea {margin:0 -24px; padding:83% 24px 44px; background-color:#5642bf !important; background-repeat:no-repeat !important; background-position:center 0 !important; background-size:100% !important; text-align:center;}
.missionArea .count {display:inline-block; margin-bottom:24px; padding:0 24px; border-radius:24px; background-color:#ff6581; color:#fff; font-size:1.8rem; font-weight:500; line-height:48px;}
.missionArea .eventProg {display:flex; flex-wrap:wrap;}
.eventProg > li {width:calc(50% - 16px); margin:8px;}
.eventProg > li:only-child {margin:8px auto;}
.eventProg .mission {display:flex; flex-flow:column-reverse; position:relative; width:100%; height:160px; padding-bottom:20px; border:1px dashed #726e85; border-radius:12px; color:#fff; font-size:1.6rem; text-align:center; line-height:initial;}
.eventProg .mission .prizes {width:56px; height:56px; margin:0 auto 10px;}
.eventProg .mission span {display:block; width:100%;}
.eventProg .mission .state {font-weight:500; opacity:.2;}
.eventProg .mission.success {border-color:transparent; background:#503db2 url(../../assets/images/smart/content/event_attendance_success.png) no-repeat center 13px; background-size:110px auto;}
.eventProg .mission.success .state {color:#fed266; opacity:1;}
.eventProg button.mission {padding-top:4px; color:#666; border-color:transparent; background:url(../../assets/images/smart/content/event_attendance_pattern.png) repeat 0 0; background-size:7px 7px; box-shadow:4px 4px 8px rgba(0, 0, 0, .16);}
.eventProg button.mission::before {content:''; position:absolute; left:10px; right:10px; top:10px; bottom:10px; border-radius:10px; background-color:#fff; z-index:0;}
.eventProg button.mission > * {position:relative; z-index:1;}
.eventProg button.mission .state {color:#ff6581; opacity:1;}

.attendanceEv .missionCheck {position:relative; padding-top:48px; text-align:center;}
.missionCheck::before {content:''; position:absolute; left:0; top:-15px; width:100%; height:30px; background:url(../../assets/images/smart/content/event_attendance_spring.png) repeat-x center 0; background-size:29px 30px;}
.missionCheck .month {margin-bottom:24px; color:#5642bf; font-size:2.4rem; font-weight:500;}
.missionCheck .iptFilt.tab {width:192px; margin:0 auto; background-color:#f6f5fc;}
.missionCheck .iptFilt.tab .ipt + label {color:#5642bf; opacity:.5;}
.missionCheck .iptFilt.tab .ipt:checked + label {color:#5642bf; opacity:1;}
.missionCheck .iptFilt.tab .ipt:checked + label:after {box-shadow:2px 2px 5px rgba(0, 0, 0, .1);}
.eventCalendar {display:inline-block; width:330px; margin:0 auto;}
.eventCalendar::after {display:block; content:''; clear:both;}
.eventCalendar > li {float:left; position:relative; width:60px; height:60px; margin:3px; background:url(../../assets/images/smart/content/event_attendance_pattern.png) repeat 0 0; background-size:7px 7px; color:#666; font-size:1.4rem; line-height:60px;}
.eventCalendar > li.today {background-image:url(../../assets/images/smart/content/event_attendance_pattern_on.png); color:#222;}
.eventCalendar > li.check::after {content:''; position:absolute; left:0; right:0; top:0; bottom:0; background:url(../../assets/images/smart/content/event_attendance_sticker.png) no-repeat center center; background-size:100% auto;}


/*================================================== Terms(약관) ==================================================*/
.iptGroup.agree > li {margin:0 20px 0 0;}
.termsWrap .desc {font-size:1.4rem;}
.termsWrap .accoHead .desc {margin:0 0 16px; padding:20px 23px; background-color:#f8f8f8;}
.termsWrap .iptGroup label {min-height:24px; padding-top:1px; font-size:1.4rem;}
.termsWrap .txtList:last-child {margin-bottom:0;}

ul.termsWrap {margin:12px 0; border:0;}
ul.termsWrap > li {padding:0; border-top:0 !important;}
ul.termsWrap > li + li {margin-top:-1px;}
ul.termsWrap .accoHead {margin-right:0; padding:0;}
ul.termsWrap .accoHead label.lg {display:block; padding:10px 35px 11px 46px; border:1px solid #ddd;}
ul.termsWrap .accoHead label.lg::before {left:15px; top:11px;}
ul.termsWrap .accoHead label.lg::after {left:24px; top:16px;}
ul.termsWrap .accoHead > span {display:block; padding-bottom:12px; background-color:#fff; color:#222; font-weight:500;}
ul.termsWrap .accoHead > span.tit {padding:10px 35px 11px 15px; border:1px solid #ddd;}
ul.termsWrap .accoHead [class^=flag_] {position:relative; margin:-1px 0 0 0;}
ul.termsWrap .accoHead [class^=icoBtn_] {position:absolute; right:1px; top:1px; width:35px; height:46px; border-left:0 !important; z-index:1;}
ul.termsWrap .accoHead .iptGroup.agree {display:block; float:none; margin:0; padding:23px; border-bottom:1px solid #eee; background-color:#f8f8f8;}
ul.termsWrap .accoBody {margin:0 0 23px; padding:0; border-top:0;}
ul.termsWrap .accoBody > .inner {padding:20px 23px; background-color:#f8f8f8; font-size:1.4rem;}
	
/* 전체동의 */
.termsAll {margin:24px 0;}
.termsAll > .accoHead [class^=icoBtn_] {position:absolute; right:1px; top:1px; width:46px; height:46px; z-index:2;}
.termsAll > .accoBody {padding:12px 0 0; background-color:#fff;}
.termsAll ul.termsWrap {margin:0;}
.termsAll ul.termsWrap > li + li {margin-top:0;}
.termsAll ul.termsWrap .accoHead {padding:4px 45px 4px 0;}
.termsAll ul.termsWrap .ipt + label.lg {padding:7px 0 8px 31px; border:0; font-weight:300;}
.termsAll ul.termsWrap label.lg::before {left:0; top:8px;}
.termsAll ul.termsWrap label.lg::after {left:9px; top:13px;}
.termsAll ul.termsWrap [class^=icoBtn_] {width:44px;}
.termsAll ul.termsWrap [class^=icoBtn_]:after {width:9px; height:9px; border-color:#aaa;}
.termsAll ul.termsWrap .accoHead > span {padding:8px 0; color:#222;}
.termsAll ul.termsWrap .accoBody {margin-bottom:9px; padding:0;}
.termsAll ul.termsWrap .termsBody {margin:0 0 12px;}

.icoBtn_arrow:after {width:8px; height:8px; border-color:#aaa;}

.termsWrap:not(ul) {border:0; font-size:1.4rem;}
.termsWrap:not(ul) > .inner {max-height:320px; margin-top:0; padding:24px; background-color:#f8f8f8; overflow-y:auto;}
.termsWrap:not(ul) > .inner::-webkit-scrollbar {-webkit-appearance:none;} 
.termsWrap:not(ul) > .inner::-webkit-scrollbar:vertical {width:4px;} 
.termsWrap:not(ul) > .inner::-webkit-scrollbar:horizontal {height:0;} 
.termsWrap:not(ul) > .inner::-webkit-scrollbar-thumb {border:0; border-radius:2px; background-color:rgba(0, 0, 0, .3);} 
.termsWrap:not(ul) > .inner::-webkit-scrollbar-track {border-radius:0; background-color:#f8f8f8;}
.termsWrap:not(ul) > .inner .tblWrap td {padding:10px;}
.termsWrap:not(ul) .consent {padding:15px 23px 23px; border-top:0; background-color:#f8f8f8;}
.termsWrap:not(ul) .consent > .desc {float:none; padding:0 0 15px;}
.termsWrap:not(ul) .consent > .iptGroup.agree {float:none; margin:0 -23px; padding:15px 23px 0; border-top: 1px solid #eee;}
.termsWrap:not(ul).scrlNone > .inner {max-height:none; padding-bottom:0;}
.termsWrap:not(ul) .consent.line {border-top:1px solid #eee;}

.formList .termsAll,
.formList ul.termsWrap {margin:8px 0;}

/* 종속 */
.cascadeWrap {display:block; table-layout:auto; background-color:#f8f8f8;}
.cascadeWrap > * {display:block !important; text-align:left !important;}
.cascadeWrap .itemTh {margin-top:0; margin-bottom:7px; font-size:1.4rem; color:#222; font-weight:500;}
.cascadeWrap .itemTh .desc {display:block; padding:5px 0 0 0; color:#666; font-weight:300;}
.cascadeWrap .iptGroup:after {display:block; content:''; clear:both;}
.cascadeWrap .iptGroup > li {float:left; min-width:50%; margin:4px 0px 4px 0; padding-right:10px;}
.cascadeWrap .iptGroup > li .ipt[type=checkbox]:checked + label:before {background-color:#5d88fb;}
.cascadeWrap .iptGroup > li .ipt[type=checkbox]:checked + label:after {border-color:#fff;}
.cascadeWrap .iptGroup > li label ~ .desc {margin-left:31px;}
.cascadeWrap .iptFilt {margin-top:15px; margin-bottom:8px;}

.cascadeWrap .iptGroup.vertical > li {margin-top:4px; margin-bottom:4px;}

ul.cascadeWrap {padding:17px 23px 0;}
ul.cascadeWrap > li {width:100%;}
ul.cascadeWrap > li + li {margin-top:17px; padding:17px 0 10px; border-left:0; border-top:1px solid #eee;}
ul.cascadeWrap > li .itemTh {margin-bottom:7px;}

.cascadeWrap:not(ul) .dataTd {width:100%;}

ul.termsWrap .accoBody > .inner .cascadeWrap {/*margin:-19px 0; padding:0;*/}
ul.termsWrap .accoBody > .inner .basicC1 + .txtList,
ul.termsWrap .accoBody > .inner .basicC1 + .cascadeWrap {margin:20px 0 0 0;}
ul.termsWrap .termsBody {margin:0 0 24px; padding:20px 23px 20px; border-top:0; background-color:#f8f8f8;}
ul.termsWrap .termsBody .desc {/*margin-bottom:0;*/}
ul.termsWrap .termsBody .cascadeWrap {margin-bottom:0; padding:0;}
ul.termsWrap .termsBody .desc + .cascadeWrap {margin-top:20px;}

/* 2depth */
ul.termsWrap [class*=Body] ul.termsWrap .accoHead {padding:0 45px 0 0;}
ul.termsWrap [class*=Body] ul.termsWrap .accoHead .tit {padding:0; border:none; background-color:transparent; font-size:1.4rem; font-weight:300;}
ul.termsWrap [class*=Body] ul.termsWrap [class^=icoBtn_] {top:-5px; right:-15px; width:32px; height:32px;}
ul.termsWrap [class*=Body] ul.termsWrap [class^=icoBtn_]:after {width:7px; height:7px; border-width:0 1px 1px 0;}

/* 내용확인에 대한 동의 */
.pithyTerms {margin-bottom:32px; padding:20px 23px; background-color:#f8f8f8; font-size:1.4rem;}
.pithyTerms .tit {margin-bottom:8px; color:#222; font-weight:500;}
.pithyTerms p.basicC1,
.pithyTerms .txtList {margin-bottom:15px;}
.pithyTerms .single:not(:first-child) {display:block; margin:15px -23px 0; padding:15px 23px 0; border-top:1px solid #eee;}
.pithyTerms .single:first-child {margin:0 0 15px 0;}
.pithyTerms .ipt + label.lg {font-weight:300;}
.pithyTerms hr {border-top:1px solid #eee; width:calc(100% - 12px); height:1px;} /*수정 20220831*/

.termsWrap.changeTg li.on {position:relative; z-index:2;}
.termsWrap.changeTg .accoHead::after {content:''; position:absolute; right:22px; top:27px; width:11px; height:11px; margin-top:-3px; border:1px solid #222; border-width:0 2px 2px 0; box-sizing:border-box; z-index:0; transform:rotate(45deg); transition:all 0.25s;}
.termsWrap.changeTg li.on .accoHead::after {margin-top:3px; border-color:#715deb; transform:rotate(-135deg);}
.termsWrap.changeTg .accoHead label.lg {padding:18px 35px 19px 46px;}
.termsWrap.changeTg .accoHead label.lg::before {top:19px;}
.termsWrap.changeTg .accoHead label.lg::after {top:24px;}
.termsWrap.changeTg .ipt[type=checkbox]:checked + label.lg {border-color:#715deb;}
.termsWrap.changeTg .ipt[type=checkbox]:disabled + label.lg {background-color:#fff; border-color:#ddd;}
.termsWrap.changeTg .accoHead [class^=icoBtn_] {height:62px;}
.termsWrap.changeTg .money {display:block; margin:11px -20px -7px -30px; font-weight:300;}
.termsWrap.changeTg .money::after {display:block; content:''; clear:both;}
.termsWrap.changeTg .money .item {float:left; padding-top:2px; color:#666; font-size:1.4rem;}
.termsWrap.changeTg .money .val {float:right;}
.termsWrap.changeTg .end {position:absolute; right:24px; top:50%; padding:0; color:#222; font-size:1.4rem; z-index:1; transform:translateY(-50%);}
.termsWrap.changeTg .accoBody {font-size:2.0rem;}
.termsWrap.changeTg .accoBody > .inner {padding:26px 23px 32px;}
.termsWrap.changeTg .accoBody .titH5 {margin-top:32px;}
.termsWrap.changeTg .accoBody .titH5:nth-of-type(1) {margin-top:0;}
.termsWrap.changeTg .accoBody div.single {margin:0; padding:20px 23px 26px;}
.termsWrap.changeTg .accoBody div.single + .inner {margin-top:-26px;}
.termsWrap.changeTg .relatChange {margin:0; padding:0; background-color:transparent;}

.relatChange {margin-top:4px; margin-bottom:30px; padding:21px 24px 23px; background-color:#f8f8f8; font-size:2.0rem; line-height:1.6;}
.relatChange em {color:#5642bf;}
.relatChange .iptWrap,
.relatChange .selectWrap {display:inline-block; width:auto; font-size:0; vertical-align:super;}
.relatChange .selectWrap {margin:4px 0;}
.relatChange .iptWrap.other {width:72% !important; margin:6px 0;}
.relatChange .iptWrap.other .ipt {padding:0; border:0; border-bottom:1px solid #666; border-radius:0; background-color:transparent; box-shadow:none !important;}
.relatChange .ipt[readonly],
.relatChange select.ipt {height:30px; border:0; border-radius:0; font-weight:500;}
.relatChange .ipt[readonly] {width:100px; margin:4px 0; padding:0 !important; background-color:#715deb !important; color:#fff; font-size:20px; text-align:center;}
.relatChange select.ipt {padding:0 25px 0 0; border-bottom:1px solid #666; background-color:transparent; background-position:right -3px center; color:#222; font-size:1.8rem;}

.relatChange .iptFilt {margin:16px 0 0 0;}

.formList .relatChange {margin-bottom:0;}

.relatIpt {color:#222;}
.relatIpt em {display:block; margin:22px 0 4px 0; font-size:1.4rem;}
.relatIpt .iptWrap,
.relatIpt .selectWrap {width:176px;}


/*================================================== MSG ==================================================*/
/* msg 기본 */
.msgArea {position:relative; text-align:center; margin-bottom:32px;}
.msgArea .copy {color:#222; font-size:2.1rem; font-weight:500;}
.msgArea .desc {margin:15px 0 20px;}
.msgArea .desc .links {top:-1px; vertical-align:baseline;}
.msgArea [class^=btn_].m {display:inline-block; width:auto; max-width:100%; padding:5px 30px;}
.msgArea .txtList.remark:not(ul),
.msgArea .txtList.star:not(ul) {padding:0; text-align:center;}
.msgArea .txtList.remark:not(ul):before,
.msgArea .txtList.star:not(ul):before {position:static; margin-right:5px;}
.msgArea .giftCard,
.msgArea .infoBox {margin-top:32px;}
.msgArea .infoDetail .infoList {text-align:left;}
.msgArea .eventProductImg {position: absolute; top: 25px;left: 50%;margin-left: -64px;}
.msgArea .eventProductImg img {width: 128px;}

.msgArea.succ {padding-top:136px; background:url(../../assets/images/smart/common/msg_succ.svg) no-repeat center 40px;}
.msgArea.fail {padding-top:136px; background:url(../../assets/images/smart/common/msg_fail.svg) no-repeat center 40px;}
.msgArea.invest {padding-top:200px;}
.msgArea.invest img {position:absolute; top:35px; left:50%; width:160px; height:160px; transform:translateX(-50%);}

.msgArea.certify {padding-top:136px; background:url(../../assets/images/smart/common/msg_certify.svg) no-repeat center 25px;} /* 보안매체 */
.msgArea.cloud {padding-top:170px; background:url(../../assets/images/smart/common/msg_cloudsign.svg) no-repeat center 48px;} /* 금융인증서 */
.msgArea.kakao {padding-top:160px; color:#222; background:url(../../assets/images/smart/common/msg_kakaopay_02.png) no-repeat center 48px;} /* 카카오인증서 230915 : 수정*/
.msgArea.shinhan {padding-top:160px; color:#222; background:url(../../assets/images/smart/common/msg_shinhan.png) no-repeat center 48px;} /* 신한sign 230915 : 수정*/
.msgArea.cloud .copy {font-size:1.6rem;}
.msgArea.kakao .copy {font-size:1.8rem;}

.msgArea.insuOk {padding-top:190px; background:url(../../assets/images/smart/common/msg_insu_ok.png) no-repeat center 0;}
.msgArea.insuFail {padding-top:210px; background:url(../../assets/images/cdh/common/msg_insu_noprd.png) no-repeat center 0;}
.msgArea.insuFail .desc {color:#222;}
.msgArea.insuGift {padding-top:190px; background:url(../../assets/images/smart/common/msg_insu_gift.png) no-repeat center 0; background-size:244px auto;}
.msgArea.joinOk {padding-top:210px; background:url(../../assets/images/smart/common/msg_join_ok.png) no-repeat center 0; background-size:244px auto;}
.msgArea.inputOk {padding-top:190px; background:url(../../assets/images/smart/common/msg_input_ok.png) no-repeat center 0; background-size:244px auto;}
.msgArea.eventWin {padding-top:190px; background:url(../../assets/images/smart/common/msg_event_win.png) no-repeat center 0; background-size:244px auto;}
.msgArea.eventFail {padding-top:190px; background:url(../../assets/images/smart/common/msg_event_fail.png) no-repeat center 0; background-size:244px auto;}

.msgArea.insuFail2 {padding-top:210px; background:url(../../assets/images/cdh/common/CDIMBB0325_01_IMG2.png) no-repeat center 0;}
.msgArea.insuFail2 .desc {color:#222;}

.msgArea.eventRegi {padding-top:185px; background:url(../../assets/images/smart/common/msg_event_regi.png) no-repeat center 25px; background-size:128px auto;}
.msgArea.eventSucc {padding-top:185px; background:url(../../assets/images/smart/common/msg_event_succ.png) no-repeat center 25px; background-size:128px auto;}
.msgArea.eventFail2 {padding-top:185px; background:url(../../assets/images/smart/common/msg_event_fail2.png) no-repeat center 25px; background-size:128px auto;}
.msgArea.eventNoti {padding-top:185px; background:url(../../assets/images/smart/common/msg_event_noti.png) no-repeat center 25px; background-size:128px auto;}

.msgArea.eventWin .infoBox .inner {padding:12px 0;}
.msgArea.eventWin .infoDetail .infoList {padding-top:0; border-top:0;}
.msgArea.eventWin .infoDetail .infoList .val {font-weight:500;}

.msgArea.eventFail .btnGroup {justify-content:center;}
.msgArea.eventFail .btnGroup .btn_s {max-width:175px; padding:5px 10px; line-height:32px;} 

.msgArea.customer {padding-top:190px; background:url(../../assets/images/smart/common/msg_customer.png) no-repeat center 0;}

.msgArea.charSucc {padding-top:190px; background:url(../../assets/images/smart/common/msg_char_succ.png) no-repeat center 0; background-size:220px auto;}
.msgArea.charCeleb {padding-top:190px; background:url(../../assets/images/smart/common/msg_char_celebrate.png) no-repeat center 0; background-size:325px auto;}
.msgArea.charFail {padding-top:220px; background:url(../../assets/images/smart/common/msg_char_fail.png) no-repeat center 0; background-size:327px auto;}

.msgArea.usingService {margin-bottom:60px; padding-top:0; padding-bottom:220px; text-align:left; background:url(../../assets/images/smart/common/msg_char_use_service.png) no-repeat center bottom; background-size:226px auto;}
.msgArea.usingService .copy {margin-bottom:15px;}
.msgArea.usingService .desc {margin:10px 0 0 0;}

.msgArea.passChange {padding-top:225px; background:url(../../assets/images/smart/common/msg_char_pass.png) no-repeat center 0; background-size:330px auto;}

/* ARS고객센터 */
.arsCenter {position:relative; margin-top:32px; padding:24px 24px 26px; border:1px solid #eee; font-size:1.4rem;}
.arsCenter .tit {margin-bottom:5px; font-size:2.0rem;}
.arsCenter .links {margin:0; font-size:1.4rem;}
.arsCenter .telInfo,
.arsCenter .txtList.disc {margin-top:20px; padding-top:20px; border-top:1px solid #eee;}
.arsCenter .txtList.disc em {display:block; font-size:1.4rem; color:#222;}
.arsCenter .txtList.remark {margin:0;}
.arsCenter .txtList:last-child {margin-bottom:0;}
.arsCenter .telInfo {padding-top:15px;}
.arsCenter .tel:not([class^=btn_]) {display:block; font-size:2.8rem; color:#5642bf; font-weight:500; line-height:1.3;}
.arsCenter .tit + .tel {font-size:2.4rem;}

.txtList.remark + .arsCenter {margin-top:10px;}

/* 결과없음 */
.noData:not(tr) {position:relative; padding-top:130px; padding-bottom:36px; color:#222; font-size:1.8rem; font-weight:500; background:url(../../assets/images/smart/common/msg_no_cyber.svg) no-repeat center 36px; text-align:center;}
.noData:not(tr) p {margin-bottom:5px;}
.noData:not(tr) .desc {font-size:1.6rem; font-weight:300;}
.noData:not(tr) .btn_p {width:auto; margin:32px auto 0; padding:5px 40px;}
.noData:not(tr) .txtList.remark:not(ul) {display:inline-block; padding:0; text-align:center; font-weight:300;}
.noData:not(tr) .txtList.remark:not(ul):before {content:'※ '; position:static;}

.noData.add {padding-top:130px; padding-bottom:0; background:url(../../assets/images/smart/common/msg_no_add.png) no-repeat center 24px; background-size:80px auto; font-size:2rem;}
.noData.insu {padding-top:110px; padding-bottom:22px; background:url(../../assets/images/smart/common/msg_no_insu.svg) no-repeat center 14px;}
.noData.apt {padding-top:110px; padding-bottom:22px; background:url(../../assets/images/smart/common/msg_no_apt.svg) no-repeat center 34px;}



/*================================================== Tab ==================================================*/
.tabWrap .tabPanel {display:none; text-align:left;}
.tabWrap .tabPanel.on {display:block;}

/* tabList */
.tabList {display:flex; width:calc(100% + 48px); margin:0 -24px; padding:0 20px; border-bottom:1px solid #eee; white-space:nowrap; overflow-x:auto;}
.tabList > li {position:relative; display:flex; width:100%; height:56px; padding:0 15px; justify-content:center; align-items:center; color:#666; font-size:1.6rem; line-height:1.3; text-align:center; cursor:pointer;}
.tabList > li.disable {cursor:default; opacity:0.5;}
.tabList > li.on {color:#445fe6; font-weight:500;}
.tabList > li.on:after {content:''; position:absolute; left:0; right:0; bottom:0; height:3px; background-color:#5d88fb;}

.isIOS .tabList > li[role*=tab]:focus,
.isIOS .tabList > li[role*=tab]:active {outline: 1px dotted transparent !important;}

.tabList.lg > li {height:76px;}

.tabList.iptFilt {position:relative;display:table;width:100%;margin: 0;padding: 0;font-size:0;border-bottom: none;vertical-align:middle;table-layout:fixed;white-space: normal;z-index:0;}
.tabList.iptFilt > li {display:table-cell; margin:0; padding: 0; height: auto; text-align:center;font-size: 14px; line-height: 42px;}
.tabList.iptFilt + .tabContents .tabPanel {padding-top:10px;}

/* subTab */
.tabList.subTab {width:100%; margin:0; padding:0; border-radius:4px; background-color:#eee; overflow:hidden; white-space:normal;}
.tabList.subTab > li {height:auto; padding:10px 5px; font-size:1.4rem; border:3px solid transparent; word-break:keep-all;}
.tabList.subTab > li.on {color:#222; border-color:#eee; z-index:0;}
.tabList.subTab > li.on:after {height:100%; border-radius:3px; background-color:#fff; z-index:-1;}

/* fundTab */
.tabList.fundTab {position:fixed; left:0; bottom:0; width:100%; margin:0; padding:0; border-bottom:none; border-top:1px solid #eee; background:#fff; overflow:hidden; white-space:normal;}
.tabList.fundTab > li {flex-direction:column; height:64px; padding:10px 5px; text-align:center; font-size:1.2rem; word-break:keep-all;}
.tabList.fundTab > li.on {color:#222; font-weight:300; z-index:0;}
.tabList.fundTab > li.on:after {height:100%; border-radius:3px; background-color:#fff; z-index:-1;}
.tabList.fundTab .ico {display:inline-block; width:20px; height:22px; margin-bottom:5px; background-position:50% 0; background-repeat:no-repeat; background-size:20px 22px;}
.tabList.fundTab .fnd1 {background-image:url(../../assets/images/smart/content/ico_invest_1.png);}
.tabList.fundTab .fnd2 {background-image:url(../../assets/images/smart/content/ico_invest_2.png);}
.tabList.fundTab .fnd3 {background-image:url(../../assets/images/smart/content/ico_invest_3.png);}
.tabList.fundTab .fnd4 {background-image:url(../../assets/images/smart/content/ico_invest_4.png);}
.tabList.fundTab .fnd5 {background-image:url(../../assets/images/smart/content/ico_invest_5.png);}
.tabList.fundTab li.on .fnd1 {background-image:url(../../assets/images/smart/content/ico_invest_b_1.png);}
.tabList.fundTab li.on .fnd2 {background-image:url(../../assets/images/smart/content/ico_invest_b_2.png);}
.tabList.fundTab li.on .fnd3 {background-image:url(../../assets/images/smart/content/ico_invest_b_3.png);}
.tabList.fundTab li.on .fnd4 {background-image:url(../../assets/images/smart/content/ico_invest_b_4.png);}
.tabList.fundTab li.on .fnd5 {background-image:url(../../assets/images/smart/content/ico_invest_b_5.png);}
.tabList.fundTab + .tabContents .tabPanel {padding-top:0; padding-bottom:30px;}

/* 간격 */
.tabPanel {padding-top:30px;}
.tabPanel > .notiBox:first-child,
.tabPanel > .guideTxt.waTxt + .notiBox,
.tabPanel > .guideBox:first-child,
.tabPanel > .guideTxt.waTxt + .guideBox,
.tabPanel > .btn_arrow:first-child
.tabPanel > .guideTxt.waTxt + .btn_arrow {margin-top:0; margin-bottom:24px;}
.tabPanel > .accoList:first-child {margin-top:-31px;}
.tabPanel > .srchFilt.bgGray,
.tabPanel > .guideTxt.waTxt + .srchFilt.bgGray,
.tabPanel > .bgGrayArea:first-child,
.tabPanel > .guideTxt.waTxt + .bgGrayArea {margin-top:-30px;}
.tabWrap .tabPanel .bgGrayArea:last-child {margin-bottom:-32px;}


/*================================================== 컨텐츠 간격 ==================================================*/
.popup header + .tabWrap,
.popup header + .accoList,
hr + .tabWrap {margin-top:-27px;}

.titH3 + .titH4,
.tblWrap + .titH4,
[class^=txt] + .titH4 {margin-top:20px;}
.tabWrap + .titH3,
[class^=txt] + .titH3,
.infoDetail + .titH3,
.notiBox + .titH3,
.popup .infoBox + .titH3,
.popup .titH3 ~ .titH3 {margin-top:24px;}
.tblWrap + .titH3,
[class^=txt]:not(.txtList) + .accoList,
.popup .tblWrap + .infoWrap {margin-top:32px;}


/*================================================== Summary ==================================================*/

/* 데이터 변경전_후 */
.alterBox {display:-webkit-flex; display:flex; flex-wrap:wrap; align-items:center; width:100%; margin-bottom:32px; background:#fff; border:1px solid #dad5f9; border-radius:8px; box-shadow:1px 2px 6px 2px rgba(113,93,235,0.08);}
.alterBox > div {position:relative; z-index:0;}
.alterBox > div:not(:first-child):before {content:''; position:absolute; top:0; left:0; bottom:0; border-left:1px solid #eceafc; z-index:-1;}
.alterBox > div:not(:first-child):after {content:''; position:absolute; top:50%; left:0; margin:-20px 0 0 -20px; width:40px; height:40px; background:#fff url(../../assets/images/smart/common/ico_sum_arrow.svg) no-repeat center center; border-radius:50%; box-shadow:1px 2px 6px 2px rgba(113,93,235,0.08); z-index:-1;}
.alterBox > div:not(:first-child).bgColor:before {content:''; position:absolute; top:-1px; right:0; right:-1px; bottom:-1px; background-color:#3d99e6; border:none; border-top-right-radius:8px; border-bottom-right-radius:8px; z-index:-2;}
.alterBox > div.bgColor .item,
.alterBox > div.bgColor .val {color:#fff;}
.alterBox .item {font-size:1.4rem; vertical-align:middle; white-space:nowrap;}
.alterBox .val {flex-grow:1; color:#222; font-size:1.6rem;}
.alterBox .infoList > li {padding:4px 0;}
.alterBox .infoList .item.tit {padding-bottom:4px; color:#222; font-weight:500;}

.alterBox .infoCell {width:50%; padding:35px 20px; text-align:center;}
.alterBox .infoDiv {display:-webkit-flex; display:flex; width:100%; padding:20px;}
.alterBox .infoDiv:not(:first-child):before {top:0; left:0; right:0; bottom:auto; border-bottom:1px solid #eceafc; border-right:none;}
.alterBox .infoDiv:not(:first-child):after {top:0; left:50%; transform:rotate(90deg);}
.alterBox .infoDiv:not(:first-child).bgColor:before {left:-1px;}
.alterBox .infoDiv .val {text-align:right;}

.accoBody .alterBox {margin-bottom:12px; box-shadow:none; border-color:#ddd;}
.accoBody .alterBox .infoDiv:not(:first-child):before {bottom:0; border-bottom:none; border-top:1px solid #ddd; background-color:#eee;}
.accoBody .alterBox .infoDiv .val {font-size:1.4rem; text-align:right;}
.bottomSheet .popBody .alterBox {z-index:12;}

.bottomSheet .popBody.non_pay {min-height:331px;}/* 231102 추가 */
.bottomSheet .popBody.non_pay .ht_42 {height:42px;}/* 231102 추가 */
.bottomSheet .popBody.non_pay .tit {font-size:2.3rem; letter-spacing: -0.05rem;}
@media all and (max-width:320px) {
	.bottomSheet .popBody.non_pay .tit {font-size:2.0rem;}
	.bottomSheet .popBody.non_pay .btnArea [class^=btn_] {font-size:15px;}
}
@media all and (max-width:280px) {
	.bottomSheet .popBody.non_pay .btnArea [class^=btn_] {font-size:13px;}
}

.alterBox > .infoList {margin:0;}
.alterBox > .infoList > li {position:relative; display:-webkit-flex; display:flex; flex-wrap:wrap; padding:20px 25px !important; justify-content:space-between; align-items:center;}
.alterBox > .infoList > li:not(:first-child) {border-top:1px solid #dad5f9;}
.alterBox > .infoList > li > div {flex-grow:unset; display:block; width:50%; padding-right:10px; color:#959595; text-align:left;}
.alterBox > .infoList > li .item {color:#222;}
.alterBox > .infoList > li .item.tit {width:100%; padding:0 0 10px 0; font-weight:300;}
.alterBox > .infoList > li .val:last-child {position:relative; padding:0 0 0 10px; color:#222; font-weight:500; text-align:right; white-space:nowrap;}
.alterBox > .infoList > li .val.money em {font-size:1.8rem;}
.alterBox > .infoList > li .val.del {text-decoration:line-through;}
.alterBox > .infoList > li .val + div:after {content:''; position:absolute; top:50%; left:0; margin:-10px 0 0 -10px; width:20px; height:20px; background:url(../../assets/images/smart/common/ico_sum_arrow.svg) no-repeat center center;}
.alterBox > .infoList > li .iptWrap {display:block; width:auto; margin:0 0 0 5px;}
.alterBox > .infoList > li .iptWrap .ipt {height:36px; font-size:1.4rem;}
.alterBox > .infoList > li .iptWrap .unit {font-size:1.4rem;}

.infoVisual.alter {min-height:0; padding-right:24px;}
.infoVisual.alter .titH3 {margin-bottom:20px; text-align:center;}
.infoVisual.alter .alterBox {margin:0;}

/* 결과값 노출 */
.moneyBox,
.prdBtnBox {margin-bottom:32px; padding:24px; border:1px solid #dad5f9; border-radius:10px; box-shadow:1px 2px 6px 2px rgba(113,93,235,0.08); text-align:center;}
.moneyBox {padding-bottom:20px;}
.moneyBox + .infoList {margin-top:-12px;}
.moneyBox .tit {display:inline-block; color:#222; font-weight:500; text-align:center;}
.moneyBox .tit .icoS {vertical-align:top;}
.moneyBox .money {margin:10px 0 5px; color:#5642bf; font-size:2.4rem; font-weight:500;}
.moneyBox .money em {font-size:2.8rem; letter-spacing: -0.01em;}
.moneyBox .date {margin-top:7px; color:#5642bf; font-size:2.4rem; font-weight:500;}
.moneyBox .txtList {display:inline-block;}

.moneyBox .infoList {margin:0;}
.moneyBox .infoList > li {padding:4px 0;}
.moneyBox .infoList .val {font-size:1.4rem;}
.moneyBox .infoList > li.total {margin-top:12px; margin-bottom:4px;}
.moneyBox .infoList > li.total .item {font-weight:300;}
.moneyBox .infoDesc {margin-top:12px; text-align:left;}
.moneyBox .infoDesc .txtList {margin-top:13px;}
.moneyBox .btnGroup {margin:13px 0 0; border-top:1px solid #f3f3f3;}
.moneyBox .btnGroup .txtList {margin-top:13px;}
.moneyBox .btnGroup .arrow {margin:14px 0 0; margin-left:auto; font-size:1.4rem;}
.moneyBox div.infoList {width:auto; margin:0 -20px 4px;}
.moneyBox div.infoList > div {width:50%; padding-top:3px; text-align:center;}
.moneyBox div.infoList > div + div {border-left:1px solid #eee;}
.moneyBox div.infoList .item {color:#222;}
.moneyBox div.infoList .val {margin-top:3px; font-size:1.6rem; font-weight:500; text-align:center !important;}
.moneyBox div.infoList .val em {font-size:2.0rem;}

/* 버튼 상품 노출 */
.prdBtnBox {display:block; width:100%;}
.prdBtnBox em {display:block;}
.prdBtnBox .arrow {margin-top:13px; color:#5642bf; font-size:2rem; font-weight:500;}
.prdBtnBox .arrow:before {border-color:#5642bf; border-width:2px 2px 0 0;}
.prdBtnBox .desc {display:block; margin-top:10px; font-size:1.4rem; color:#959595;}

/* 금액값 노출 */
.moneyResult {display:flex; flex-wrap:wrap; align-items:center; margin:20px 0; padding:0 8px; justify-content:space-between; letter-spacing:-0.015rem;}
.moneyResult .item {font-size:14px; color:#222; font-weight:500;}
.moneyResult .item .icoS {margin-right:2px;}
.moneyResult .item .icoBtn_infoPop {padding-right:20px; font-weight:500;}
.moneyResult .item em {color:#5642bf;}
.moneyResult .item .tip {margin-top:-4px;}
.moneyResult .money {font-size:16px; color:#222; font-weight:500; text-align:right;}
.moneyResult .money em {display:inline-block; margin-top:1px; font-size: 18px; line-height:1.2; vertical-align:top;}
.moneyResult .money span {padding-right:4px; font-size:14px; color:#666; font-weight:300;}
.moneyResult .msgTip {position:relative; width:calc(100% + 16px); height:inherit; margin:19px -8px 0; padding:5px 0 10px; color:#e9473f !important; line-height:1.6; text-align:center; border-radius:4px; background-color:#fef5f5;}
.moneyResult .msgTip em {position:relative;}
.moneyResult .msgTip em:after {content:""; position:absolute; bottom:-2px; left:0; width:100%; border-bottom:1px solid #e9473f;}
.moneyResult .msgTip::before {top:-5px; left:14px; bottom:inherit; right:inherit; background-color:#fef5f5;}
.moneyResult .infoDesc {width:calc(100% + 16px); margin-left:-8px; margin-right:-8px;}
.moneyResult .msgTip + .infoDesc {margin-top:0; border-top:none;}
.moneyResult .detail {display:flex; align-items:center; width:100%; margin-top:9px; padding-left:30px; justify-content:space-between;}
.moneyResult .detail .money,
.moneyResult .detail .money em {margin-top:0; font-size:14px; line-height:1.6; vertical-align:inherit;}

.txtItem + .moneyResult {margin-top:20px; padding:20px 0 0; border-top:1px solid #eee;}

/*================================================== Table ==================================================*/
.tblWrap {position:relative; margin:10px 0 15px -1px; background-color:#fff;}
.tblWrap:before {content:''; position:absolute; left:0; top:0; bottom:0; width:1px; background-color:#fff; z-index:1;}
.accoBody .tblWrap:before {background-color:#f8f8f8;}

.tblWrap.scroll {display:flex; gap:0 22px; overflow:auto; margin-right:-24px; margin-left:-24px; padding-left:24px;}
.tblWrap.scroll table {min-width:708px;} /* 임시 */
.tblWrap.scroll.s table {min-width:420px;} /* 임시 */
.tblWrap.scroll:before {left:24px;}
.tblWrap.scroll:after {content:""; border:1px solid transparent;}
.accoBody .tblWrap.scroll {background: none;}
.accoBody .tblWrap.scroll .tblX th,
.accoBody .tblWrap.scroll .tblX td {background-color: #fff;}

.txtList.numL > li > .tblWrap {margin-left:-20px;}

.tblWrap.sm th,
.tblWrap.sm td,
.tblWrap.sm .links {font-size:1.4rem;}
.tblWrap.sm th,
.tblWrap.sm td {padding:13px 4px;}
.tblWrap.sm .tblY td.ac {padding:13px 6px;}
.tblWrap.sm .tblY td.th {word-break:keep-all;}
.tblWrap.sm .tblX tr > .al {padding-left:10px;}
.tblWrap.sm .tblX tr > .ar {padding-right:10px;}
 
.tblWrap.xsm th,
.tblWrap.xsm td {padding:13px 4px; font-size:1.2rem;}
 
/* 가로형 & 세로형 공통 */
[class^=tbl]:not(.tblWrap):not(.tblInfo) {position:relative; border-top:1px solid #222; /*z-index:0;*/}
[class^=tbl]:not(.tblWrap):not(.tblInfo):after {content:''; position:absolute; left:0; right:0; bottom:0; border-bottom:1px solid #aaa;}
[class^=tbl] th,
[class^=tbl] td {border-left:1px solid #f2f2f2; border-bottom:1px solid #ddd; color:#666; font-size:1.4rem; line-height:1.5;}
[class^=tbl] th,
[class^=tbl] td.th {color:#222;}
[class^=tbl] .th_bg {background-color:#f8f8f8;}
[class^=tbl] th .links.arrow,
[class^=tbl] td:not(.ac) .links.arrow {margin:0;}

/* 가로형 */
.tblX th {padding:13px 8px;}
.tblX td {height:57px; padding:13px 8px;}
.tblX thead th {border-bottom:1px solid #aaa;}
.tblX tbody th:not(.ac),
.tblX tbody td:not(.ac).th {padding-left:24px; text-align:left;}
.tblX tbody th,
.tblX tbody td {border-top:1px solid #ddd; border-bottom:0}
.tblX tbody > tr:first-child th,
.tblX tbody > tr:first-child td {border-top:0;}
.tblX tfoot th,
.tblX tfoot td {border-top:1px solid #aaa; border-bottom:1px solid #aaa; background-color:#F9F9F9; color:#222; font-weight:500;}

.tblX td .txtList:first-child {margin-top:0;}
.tblX td .txtList:last-child {margin-bottom:0;}

.formList .tblX td {padding:10px;}
.formList .tblX td .selectWrap {margin:0;}

/* 세로형 */
.tblY td {height:57px; padding:13px 15px; text-align:left;}
.tblY td.th {color:#222; background-color:#f8f8f8;}
.tblY td .txtList:last-child {margin-bottom:0;}

/*border값 추가 */
.tblX .btB {border-top: 1px solid #ddd;}
.tblX .blB {border-left: 1px solid #ddd;}

/*====================================================== 안내/고지  ======================================================*/
/* tblInfo */
.tblInfo {display:flex; justify-content:space-between; align-items:flex-end; width:100%; margin-bottom:10px; font-size:1.4rem;}
.tblInfo .info {flex-grow:1;}
.tblInfo .fr {float:none; flex-grow:0; text-align:right;}
.tblInfo .fr:only-child {width:100%;}
.tblInfo .links {vertical-align:top;}
.tblInfo .txtList {display:inline-block; margin:0;}
.tblInfo [class^=btn_].s {display:inline-block; width:auto; margin:0;}
.tblInfo .info .val {color:#445fe6;}
.tblInfo .txtItem button {color:#666; font-size:1.4rem; vertical-align:baseline;}
.tblInfo .txtItem .btnCnl {color:#445fe6;}
.tblInfo .single {margin:0;}
.tblInfo .iptSort,
.tblInfo > [class^=icoBtn] {flex-grow:0; margin-left:auto;}

.bgGrayArea .tblInfo {margin-top:0;}

/* deliber */
.deliber {margin-bottom:15px;}
.deliber .num {color:#222; font-weight:500; font-size:1.2rem;}
.deliber .num:before {content:'* ';}

/*====================================================== 검색  ======================================================*/
.icoBtn_appSrch {position:relative; width:24px; height:24px;}
.icoBtn_appSrch:before,
.icoBtn_appSrch:after {content:''; position:absolute; left:50%; top:50%; box-sizing:border-box;}
.icoBtn_appSrch:before {width:20px; height:20px; border:2px solid #222; border-radius:50%;transform:translate(-53%, -54%);}
.icoBtn_appSrch:after {width:6px; border:1px solid #222;transform:translate(6px, 7px) rotate(45deg);}

.srchBar {position:relative;}
.srchBar .ipt {height:55px; padding-right:40px; border:1px solid #222; border-width:0 0 1px 0; border-radius:0; box-shadow:none;}
.srchBar .icoBtn_appSrch {position:absolute; right:0; top:0; width:45px; height:55px;}

.srchIpt {position:relative; margin-bottom:26px;}
.srchIpt .iptWrap {display:block;}
.srchIpt .icoBtn_appSrch {position:absolute; right:0; top:0; width:44px; height:44px;}
.srchIpt .icoBtn_del {right:32px;}

.srchIpt.line .ipt {height:52px; padding-left:0; border:none; border-bottom:2px solid #222; border-radius:0; box-shadow:none;}

.srchBar + .subTab {margin-top:25px;}

.keyword {margin:11px -24px 35px; padding:0 19px; font-size:0;}
.keyword .flag_srch {margin:5px; padding:0 16px; color:#445fe6; font-size:1.6rem !important; font-weight:300 !important; background-color:#f2f6ff;}

.keyword.nowrap {display:block; overflow-x:auto;}


/*================================================== 공통 컨텐츠 ==================================================*/
/* 상단인포 */
.popup .infoVisual {min-height:180px; margin:-27px -24px 28px;}
.popup .infoVisual .img {margin-top:0;}
.infoVisual {position:relative; min-height:200px; margin:0 -24px 28px; padding:32px 144px 32px 24px; background-color:#3d99e6; word-break:keep-all;}
.infoVisual.full {width:inherit !important; padding-right:24px;}
.infoVisual .img {position:absolute; top:50%; right:0; min-width:134px; margin-top:20px; transform:translateY(-50%);}
.infoVisual .img:not(.stick) img {max-width:120px;}
.infoVisual .img.stick img {max-width:144px;}
.infoVisual [class^=tit] {margin:0; font-size:2.0rem; color:#fff;}
.infoVisual .desc {margin-top:10px; margin-bottom:0; font-size:14px; color:rgba(255,255,255,0.8);}
.infoVisual .desc:first-child {margin-top:0; margin-bottom:8px;}
.infoVisual .icoBtn_infoPop {color:rgba(255,255,255,1);}
.infoVisual .icoBtn_infoPop.info:before {color:rgba(255,255,255,1); border-color:rgba(255,255,255,1);}
.infoVisual .titArea {margin-bottom:20px;}

.infoVisual.lg {padding-right:24px;}
.infoVisual.lg .img {position:static; margin-top:20px; text-align:center; transform:none;}
.infoVisual.lg .img img {max-width:327px;}

.infoVisual.srch {padding-right:80px; margin-bottom:0; line-height:1.7;}
.infoVisual .selectWrap {display:inline-block; width:auto; margin:0; font-size:0; vertical-align:text-bottom;}
.infoVisual select.ipt {min-width:80px !important; height:30px; padding:0 25px 0 0; border:0; border-bottom:1px solid #fff; border-radius:0; background:transparent url(../../assets/images/smart/common/ico_arrow_down_w.svg) no-repeat right -3px center; color:#fff; font-size:20px; font-weight:500;}

.infoVisual.fund {background:#f8f8f8 url(../../assets/images/smart/content/infovisual_fund2.png) no-repeat 100% 0; background-size:375px auto; padding-bottom:0; margin-bottom:0;}
.infoVisual.fund [class^=tit] {color:#222;}

.infoVisual.event,
.infoVisual.bgPurple {background:#715deb;}

.infoVisual.event {margin-bottom:30px; text-align:center;}
.infoVisual.event .img {position:relative; top:auto; bottom:-32px; margin:0 -24px -30px -24px;}
.infoVisual.event .img img {width:auto;}
.infoVisual.event.al .img {text-align:right;}

.aimWrap .infoVisual {background-color: #e6f1f2;}
.aimWrap .infoVisual [class^=tit] {color:#222;}

.bgGrayArea.event {margin-top:-30px; padding-top:64px; border-bottom:1px solid #eee; text-align:center;}
.bgGrayArea.event [class*=titH] {margin-bottom:10px;}
.bgGrayArea.event .infoList.line {margin:0;}
.bgGrayArea.event .infoList.line > li:last-child {border-bottom:none;}
.bgGrayArea.event [class^=btn_].m {display:inline-block; width:auto; max-width:100%; margin-top:0;}


/* 상단인포 겹치는 영역 */
.coverArea {display:block; position:relative; margin:-28px -24px 32px; padding:0 24px;}
.coverArea:after {content:""; position:absolute; top:0;left:0; width:100%; height:40px; background:#3d99e6;}
.coverArea .coverBox {position:relative; min-height:100px; padding:23px; border-radius:8px; background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1); z-index:1;}
.coverArea .relatChange {font-size:1.6rem; padding:0; margin:0; background:none;}
.coverArea .relatChange:not(:first-child) {padding-top:16px; margin-top:16px; border-top:1px solid #eee;}
.coverArea .relatChange em {display:block; margin-bottom:12px; color:#222;}
.coverArea .relatChange .selectWrap {display:inline-block; width:auto; margin:-6px 0 0; font-size:0; vertical-align:top;}
.coverArea .relatChange .val {margin-top:-6px; color:#666; vertical-align:top;}
.coverArea .relatChange select.ipt { background-position:right 4px center; color:#445fe6;}
.coverArea .relatChange select.ipt,
.coverArea .relatChange .val {display:inline-block; min-width:148px !important; height:39px; padding:0 25px 0 8px; border:0; border-radius:0; background-color:#f8f8f8; font-size:18px; font-weight:500; line-height:39px;}
.coverArea .relatChange .iptWrap {width:100%; margin:8px 0 0; vertical-align:middle;}
.coverArea .relatChange input.ipt {width:100%; height:44px; padding:0 15px !important; font-size:16px; font-weight:300; text-align:left; color:#222; border:1px solid #ccc; border-radius:4px; background-color:#fff !important;}


/* 대출상단 */
.content.topBg .summaryLoan {padding-top:85px;}
.summaryLoan {margin:0 -24px 40px; padding:0 0 52px; background-color:#715deb; }
.summaryLoan > .tit {font-size:2.4rem; letter-spacing:-0.05rem; color:#fff; text-align:center;} 

/* 대출 슬라이드 */
.loanSlider.swiperWrap {margin:28px 0 -30px; padding:0 0 40px 24px;}
.loanSlider .swiper-container {padding:0 18px; margin-left:-24px;}
.loanSlider .swiper-slide {padding:0 8px;}
.loanSlider .block {display:flex; flex-direction:column; justify-content:center; position:relative; height:144px; padding:24px 128px 24px 24px; background:#fff; border-radius:10px; word-break:keep-all;}
.loanSlider .desc {margin-top:2px; font-size:1.4rem; color:#666;}
.loanSlider .img {position:absolute; top:50%; right:24px; width:80px; height:80px; transform:translateY(-50%);}
.loanSlider button.swiper-pagination-bullet:before {background-color:rgba(255,255,255,0.45);}
.loanSlider button.swiper-pagination-bullet-active:before {background-color:#fff;}
.loanSlider .swiper-button-stop:before,
.loanSlider .swiper-button-stop:after {background-color:#fff;}
.loanSlider .swiper-button-play:after {border-left-color:#fff;}

/* 대출선택 */
.loanBox {position:relative; padding:32px 100px 0 32px; border-radius:10px; background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1);}
.loanBox:not(:first-child) {margin-top:16px;}
.loanBox .tit {margin-bottom:22px; font-size:1.4rem;}
.loanBox .desc {font-size:1.3rem; color:#959595;}
.loanBox .money {margin-right:-70px; font-size:2.4rem; color:#222; letter-spacing:-0.05rem; font-weight:500;}
.loanBox .icoL {position:absolute; top:32px; right:32px; width:48px; height:48px;}
.loanBox .btnGroup {margin:24px -100px 0 -34px; width:auto; border-top:1px solid #f4f4f4;}
.loanBox .btnGroup .btn_g {position:relative; height:51px; margin:0; line-height:50px; color:#445fe6; background:transparent;}
.loanBox .btnGroup .btn_g:not(:first-child):after {content:""; position:absolute; top:11px; bottom:16px; left:0; border-left:1px solid #f4f4f4;}
.bottomSheet .loanBox {margin-top:16px;}

/* 검색조건 */
.srchFilt {display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; width:100%; margin-bottom:10px; font-size:1.4rem;}
.srchFilt .single {margin:0;}

.srchFilt .icoBtn_open {width:auto; padding-right:20px; font-size:1.4rem; color:#666; white-space:nowrap;}
.srchFilt .icoBtn_open:after {left:auto; right:0; margin-top:-2px !important; border-color:#6a6a6a; transform:translate(-50%, -50%) rotate(-45deg) !important;}
.srchFilt .icoBtn_open .cond + .cond {position:relative; margin-left:7px;}
.srchFilt .icoBtn_open .cond + .cond:before {content:''; position:absolute; top:50%; left:-4px; width:1px; height:1px; background-color:#666;}
.srchFilt .icoBtn_open.on {max-width:40%; color:#1a75e4; overflow:hidden; text-overflow:ellipsis;}
.srchFilt .icoBtn_open.on:after {border-color:#1a75e4;}
.srchFilt .selectWrap {width:auto; margin:0;}
.srchFilt select.ipt {width:auto; height:24px; padding:0 20px 0 0; color:#666; font-size:1.4rem; border:none; /*direction:rtl;*/ background-position:right -3px center; background-color:transparent;}
.srchFilt .selectWrap .selectBtn {height:24px;}
.srchFilt > .icoBtn_open:not(.single):last-child,
.srchFilt > *:not(.single):only-child {margin-left:auto !important;}
.srchFilt.sticky {position: sticky; top: 56px; width: 100vw; margin:-26px -24px 0; padding:16px 24px 15px; border-bottom:1px solid #eee; background-color: #fff; z-index: 1000;}
.srchFilt.bgGray {width:auto; margin:0 -24px; padding:10px 24px; background-color:#f8f8f8;}

.icoBtn_mng {padding-left:23px; font-size:1.4rem; background-image:url(../../assets/images/smart/content/ico_manage.png); background-position:0 50%; background-size:16px 16px;}
.icoBtn_selDel .ico_del {position:relative; top:2px; background:none;}
.icoBtn_selDel .ico_del:before,
.icoBtn_selDel .ico_del:after {content:''; position:absolute; left:50%; top:50%; width:2px; height:14px; background-color:#a9a9a9;}
.icoBtn_selDel .ico_del:before {transform: translate(-50%, -50%) rotate(45deg);}
.icoBtn_selDel .ico_del:after {transform: translate(-50%, -50%) rotate(135deg);}

.bgGrayArea .srchFilt {margin-top:0;}

/* 검색조건_기간 */
.flag_period {display:block; width:200px; margin:15px auto; color:#fff; font-weight:300 !important; background-color:#ccc;}

/* 통 이미지 배너 */
.imgBanner {margin:32px 0;}
.imgBanner img {width:100%;}
.imgBanner.lg {margin:32px -24px -32px;}

/* 공통 롤링 */
.swiperWrap {position:relative; margin:24px 0 32px; padding-bottom:42px;}
.swiper-controls {position:absolute; left:50%; bottom:0; line-height:0; z-index:10; transform:translateX(-50%); white-space:nowrap;}
.swiper-pagination {display:inline-block; position:static !important;}
button.swiper-pagination-bullet {position:relative; width:14px; height:14px; margin:0 1px !important; border-radius:0; background:none; vertical-align:middle; opacity:1;}
button.swiper-pagination-bullet:before {content:''; position:absolute; top:50%; left:50%; width:4px; height:4px; border-radius:4px; background-color:#ddd; box-sizing:border-box; transform:translate(-50%, -50%); transition:all 0.25s ease-in-out;}
button.swiper-pagination-bullet-active {width:16px; margin:0 2px !important;}
button.swiper-pagination-bullet-active:before {width:16px; background-color:#222;}

[class^=swiper-button-] {display:inline-block; position:relative; width:18px; height:18px; margin-left:2px; overflow:hidden;}		
.swiper-button-stop:before,
.swiper-button-stop:after {content:''; position:absolute; top:4px; left:4px; bottom:4px; width:3px; background-color:#222;}
.swiper-button-stop:after {left:auto; right:4px;}

.swiper-button-play {display:none;}
.swiper-button-play:after {content:''; position:absolute; top:4px; left:6px; width:0; height:0; border-top:5px solid rgba(255,255,255,0); border-bottom:5px solid rgba(255,255,255,0); border-right:6px solid rgba(255,255,255,0); border-left:6px solid #222;}
.swiper-scrollbar {position: absolute; left: 0; right: 0; height: 5px; border-radius:2px; background-color: rgba(0,0,0,0.1);}

.swiper-controls.al {left:24px; transform:none;}

.swiperWrap.bulletW button.swiper-pagination-bullet-active:before {background-color:rgba(255,255,255,1) !important;}
.swiperWrap.bulletW .swiper-button-stop:before, 
.swiperWrap.bulletW .swiper-button-stop:after {background-color:rgba(255,255,255,1);}
.swiperWrap.bulletW .swiper-button-play:after {border-left-color:rgba(255,255,255,1);}

.swiperWrap.fullW {margin-top:-26px; padding-bottom:0;}
.swiperWrap.fullW .swiper-controls {bottom:10px;}
.swiperWrap.fullW img {width:100%;}

/* marketBanner 배너 */
.marketBanner {margin:32px 0;}
.marketBanner .block {position:relative; display:table; width:100%; margin:16px 0; padding:24px; background-color:#f7f9ff;}
.marketBanner .block .infoCell,
.marketBanner .block .imgCell {display:table-cell; vertical-align:middle;}
.marketBanner .block .imgCell {padding-left:25px; vertical-align:bottom; text-align:right;}
.marketBanner .block .imgCell img {height:64px;}
.marketBanner .block .tit {display:block; color:#445fe6; font-weight:500;}
.marketBanner .block .infoCell .tit + .desc,
.marketBanner .block .tit + .arrow {margin-top:8px;}
.marketBanner .block .tit + .desc,
.marketBanner .block .desc + .arrow {margin-top:16px;}
.marketBanner .block .desc {color:#666; font-size:1.4rem;}
.marketBanner .block .tit.full {display:block;}
.marketBanner .block .tit.full+.imgCell {display:block; padding-top:36px;}

.marketBanner .block .arrow {position:relative; display:inline-block; margin-left:0; padding-right:10px; color:#445fe6;}
.marketBanner .block .arrow::before {content:''; position:absolute; right:0; top:50%; width:8px; height:8px; border:1px solid #445fe6; border-width:1px 1px 0 0; box-sizing:border-box; transform:translateY(-50%) rotate(45deg); z-index:1;}

.marketBanner .block.bgColor01 {background-color:#f7f9ff;}
.marketBanner .block.bgColor01 .tit, 
.marketBanner .block.bgColor01 .arrow {color:#445fe6;}
.marketBanner .block.bgColor02 {background-color:#f2fafc;}
.marketBanner .block.bgColor02 .tit, 
.marketBanner .block.bgColor02 .arrow {color:#0096ad;}
.marketBanner .block.bgColor03 {background-color:#fef6fb;}
.marketBanner .block.bgColor03 .tit,
.marketBanner .block.bgColor03 .arrow {color:#e658b2;}
.marketBanner .block.bgColor04 {background-color:#445fe6;}
.marketBanner .block.bgColor04 .tit,
.marketBanner .block.bgColor04 .arrow {color:#fff;}
.marketBanner .block.bgColor04 .desc {color:rgba(255,255,255,0.5);}
.marketBanner .block.bgColor05 {background-color:#fff;}
.marketBanner .block.bgColor05 .tit,
.marketBanner .block.bgColor05 .arrow {color:#222;}
.marketBanner .block.bgColor05 .desc {color:#666;}

.marketBanner .block.bgColor01 .arrow::before {border-color:#445fe6;}
.marketBanner .block.bgColor02 .arrow::before {border-color:#00a3bb;}
.marketBanner .block.bgColor03 .arrow::before {border-color:#e658b2;}

.marketBanner.round .block {border-radius:8px;}
.marketBanner img.shadow {box-shadow:3px 3px 6px 1px rgba(0,0,0,0.08);}
.marketBanner img.round {border-radius:4px; overflow:hidden;}

.marketBanner.flex .block {display:flex; align-items:center;}
.marketBanner.flex .block > [class*=Cell] {display:block; padding-left:0; text-align:left;}
.marketBanner.flex .block > [class*=Cell]:last-child {padding-left:25px;}
.marketBanner.flex:not(.ac) .block .infoCell {flex:1; word-break:keep-all;}
.marketBanner.flex.ac .block {justify-content:center;}

/* marketBanner 롤링 */
.marketBnrArea {margin:0 -24px;}
.marketBnrArea .swiperWrap {margin:24px 0 32px; padding-left:24px; overflow:hidden;}
.marketBnrArea .swiper-container {padding:0 80px; margin-left:-85px;}
.marketBnrArea .swiper-container .slideList .swiper-slide {padding:0 5px;}
.marketBnrArea .marketBanner,
.marketBnrArea .marketBanner .block {margin:0;}

/* imgBanner 롤링 */
.imgBnrArea {margin-left:-24px; margin-right:-24px;}
.imgBnrArea .swiper-container {padding-left:24px; padding-right:24px;}
.imgBnrArea .slideList .swiper-slide {padding:0 5px;}
.imgBnrArea .imgBanner {margin:0;}

/* 담당설계사 */
.accountBox {display:flex; flex-direction:row; flex-wrap:wrap; margin-bottom:32px; padding:23px; border:1px solid #dad5f9; border-radius:10px; align-items:flex-start; box-shadow:1px 2px 6px 2px rgba(113,93,235,0.08);}
.accountBox > div:not(.btnGroup) {flex-grow:1; text-align:right;}
.accountBox > div:first-child {text-align:left;}
.accountBox .name {position:relative; color:#222; font-size:1.8rem; font-weight:500;}
.accountBox .name .logo_fc_ex {position: absolute; top: -7px; left: auto; width: 45px;}/* 230308 추가:고객관리우수FC */
.accountBox .info {margin-top:2px; font-size:1.4rem;}
.accountBox .info .icoS {vertical-align:top;}
.accountBox .info .icoXS {position:relative; top:4px; vertical-align:top;}
.accountBox a[href^=tel] {display:inline-block; color:#222; font-size:1.6rem; font-weight:500;}
.accountBox .msgTip {left:-7px; top:-39px; padding-left:32px; background:#00a3bb url(../../assets/images/smart/content/ico_planner_charge.svg) no-repeat 5px 50%; font-weight:500;}
.accountBox .msgTip:before {left:20px; right:auto; background-color:#00a3bb;}
.accountBox .btnGroup {margin:19px 0 0;}
.accountBox .btnGroup [class^=btn_]:first-child {width:33.3333%;}
.accountBox .btnGroup [class^=btn_]:last-child {width:66.6666%;}
.accountBox .popup.alert {text-align: left; z-index: 9999;}/* 230308 추가:고객관리우수FC */


/* 정보성 컨텐츠 */
.notiBox {margin:18px 0 20px; padding:20px 24px; font-size:1.6rem; color:#222; background:#f8f8f8;}
.notiBox .titIco {margin-bottom:14px; color:#445fe6; font-weight:500;}
.notiBox .titIco:only-child {margin-bottom:0; justify-content:center;}
.notiBox .titCon:not(:last-child) {margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #eee;}
.notiBox > [class^=btn_].m {width:100%;}
.notiBox > p:not([class^=tit]) + [class^=btn_].m {margin-top:15px;}
.notiBox:not([class*=bg]) .btn_t {background-color:#fff; border-color:#5d88fb; color:#445fe6;}
.notiBox .infoList {margin:0; text-align:left;}
.notiBox .infoList > li {padding:4px 0;}
.notiBox .infoList > li > div {font-size:1.4rem;}
.notiBox .infoList > li .icoS {top:3px;}
.notiBox .infoList .item {color:#666;}
.notiBox:not(.lineGray) .txtList.step {margin-top:27px;}
.notiBox:not(.lineGray) .txtList.step:before,
.notiBox:not(.lineGray) .txtList.step > li:last-child:after {content:none;}
.notiBox:not(.lineGray) .txtList.step > li {margin-top:7px; font-size:14px; color:#666;}
.notiBox:not(.lineGray) .txtList.step > li:before {top:-2px; color:#445fe6; background:#fff;}
.notiBox .titCon .txtList > li {margin-top:8px; color:#222;}
.notiBox .money {text-align:right; font-weight:500; color:#e658b2}
.notiBox .txtList.check > li {margin-top:8px; font-size:1.4rem; font-weight:300;}
.notiBox.bgBlue .txtList.check > li:before {border-color:#5d88fb;}
.notiBox .txtList.check .txtList {margin-top:0;}
.notiBox .txtList.check .txtList.sm > li + li {margin-top:0;}
.notiBox .icoL {width:64px; height:64px; margin-right:16px; padding:16px; border-radius:16px; background-color:#f7f9ff;}
.notiBox .icoL + .txtS {color:#222;}

.notiBox .sign {margin-top:15px; text-align:right;}
.notiBox .tel {color:#5642bf !important;}
.notiBox .tel.lg {font-size:2.0rem; font-weight:500;}

.notiBox .divCon {display:flex; align-items:flex-start;}
.notiBox .divCon + .divCon {margin-top:20px; padding-top:20px; border-top:1px solid #eee;}
.notiBox .divCon .info {margin-left:17px; color:#222;}
.notiBox .divCon .info .tit {margin-bottom:10px; font-weight:500;}
.notiBox .divCon .info .txt {margin:0; color:#666; font-size:14px;}
.notiBox .icoM {width:32px; height:32px;}

.notiBox.lineGray .txtBox {margin:-20px -24px 20px; padding:20px 24px; background-color:#f8f8f8;}
.notiBox.lineGray .txtBox:last-child {margin-top:20px; margin-bottom:-20px;}

.notiBox .titH5:first-child,
.notiBox .txtList.remark:first-child {margin-top:0;}
.notiBox .titCon [class^=tit],
.notiBox .txtList:last-child {margin-bottom:0;}

header + .notiBox,
.content > .notiBox:first-child,
[class^=tit] + .notiBox {margin-top:0;}
.txtList.dot > li > .notiBox {margin-left:-12px;}


.telGroup > a {position:relative; display:inline-block; margin-right:16px; font-size:16px; font-weight:500; color: #5642bf !important;}
.telGroup > a:last-child {margin-right:0;}
.telGroup > a:not(:first-child):before {content:''; position:absolute; left:-10px; top:5px; bottom:4px; border-right:1px solid #ddd;}

 
.notiBox[class*=bg] {border-radius:8px;}
.notiBox[class*=bg] [class^=btn_] {color:#445fe6; border-color:#d6e1fe;}
.notiBox[class*=bg] > [class^=ico] img {width:32px; height:32px;}
.notiBox[class*=bg] > .icoL ~ [class^=btn_] {border-color:#5d88fb;}
.notiBox[class*=bg] > .icoL {display:inline-block; width:64px; height:64px; margin-bottom:20px; padding:16px; border-radius:50%; background:#fff;}
.notiBox[class*=bg] > .icoL + [class^=tit] {color:#222;}
.notiBox.bgRed {color:#666; background-color:#fef5f5;}
.notiBox.bgRed .titH4 {color:#e9473f;}
.notiBox.bgRed [class^=btn_] {color:#fff; border-color:#e9473f; background-color:#e9473f;}
.notiBox.bgBlue {background-color:#f7f9ff;}
.notiBox.bgGreen {background-color:#f5f9f2;}
.notiBox.bgGreen p.txtS + .txtList.dash {margin-top:10px;}
.notiBox.bgGreen .txtList.disc > li:before {background-color:#3e9100;}
.notiBox.bgWhite {background-color:#fff;}
.notiBox.bgPurple {background-color:#f6f5fd;}
.notiBox[class*=line] {border-width:1px; border-style:solid; background:#fff;}
.notiBox.line {border-color:#dad5f9; border-radius:8px; box-shadow:2px 2px 5px rgba(113,60,92,0.1);}
.notiBox.line .infoList > li:first-child  > .icoS {top:0;}
.notiBox.lineGray {color:#666; border-color:#eee;}
.notiBox.lineGray .titCon:not(:last-child) {margin-bottom:12px; padding-bottom:12px;}
.notiBox.lineGray .links.arrow {margin:8px 0 0 0;}

.notiBox.lineGray .infoList .val {font-size:1.4rem; font-weight:500;}
.notiBox.lineGray div.infoList > div:last-child {text-align:left;}
.notiBox.lineGray .infoList > li {padding-bottom:0;}
.notiBox.lineGray .infoList > li:first-child {padding-top:0;}

.notiBox.boldLine {padding:0 40px; border:8px solid #eee; background-color:#fff;}
.notiBox.boldLine .infoCell {padding:40px 0px;}
.notiBox.boldLine .infoCell + .infoCell {border-top:1px solid #ddd;}

.notiBox[class*=cell] {display:flex; align-items:center; color:#666;}
.notiBox[class*=cell] + .cell {margin-top:-12px;}
.notiBox[class*=cell] > div {width:100%; flex-grow:1;}
.notiBox[class*=cell] > *:first-child {padding-right:14px;}
.notiBox[class*=cell] .titH3 {min-width:64px; width:64px; flex-grow:0; margin:0; color:#222;}
.notiBox.cellSide {justify-content:space-between;}

.notiGroup {display:flex; margin-top:10px; justify-content:space-between;}
.notiGroup .notiBox {width:100%; padding:24px 10px; text-align:center; border-radius:10px;}
.notiGroup .notiBox:not(:only-child) {width:calc((100% - 16px) / 2);}
.notiGroup .notiBox .val {display:flex; margin-top:5px; flex-grow:1; align-items:center; min-height:48px; justify-content:center;}

.notiRowGroup {margin-top:28px;}
.notiRowGroup .notiBox {margin:0;}
.notiRowGroup .notiBox.lineGray:not(:first-child) {border-top:none;}

/* guideBox */
.guideBox {position:relative; margin:20px 0; padding:12px 12px 14px; text-align:center; border-radius:8px; background-color:#f7f9ff;}
.guideBox .desc {margin-top:3px; font-size:13px; color:#666;}
.guideBox .desc:first-child {margin-bottom:3px; margin-top:0;}
.guideBox .tit {color:#445fe6; font-weight:500;}
.guideBox.prd {background-color:#f9f8ff;}
.guideBox.prd .tit {font-size:14px; color:#5642bf; font-weight:500;}
.guideBox.prd .desc {font-size:13px; color:#666; font-weight:300;}
.guideBox.elec {padding:25px; background-color:#f8f8f8;}
.guideBox.elec .desc {color:#959595;}

.guideBox[class*=fund] {margin:0 0 24px; border-style:solid; border-width:1px;}
.guideBox[class*=fund] .tit:before {content:'';  display:inline-block; position:relative; top:-2px; width:8px; height:12px; margin-right:10px; border:1px solid transparent; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}
.guideBox.fund1 {border-color:#d6e1fe; background-color:#f7f9ff;}
.guideBox.fund2 {border-color:#bfe8ee; background-color:#f2fafc;}
.guideBox.fund3 {border-color:#f9d5ec; background-color:#fef6fb;}
.guideBox.fund4 {border-color:#445fe6; background-color:#fff;}
.guideBox.fund5 {border-color:#009cc3; background-color:#fff;}
.guideBox.fund1 .tit {color:#445fe6;}
.guideBox.fund2 .tit {color:#00a3bb;}
.guideBox.fund3 .tit {color:#e658b2;}
.guideBox.fund5 .tit {color:#00a3bb;}
.guideBox.fund4 .tit:before,
.guideBox.fund5 .tit:before {display:none;}
.guideBox.fund1 .tit:before {border-color:#5d88fb;}
.guideBox.fund2 .tit:before {border-color:#00a3bb;}
.guideBox.fund3 .tit:before {border-color:#e658b2;}
.guideBox .state {position:absolute; top:7px; right:7px; z-index: 1;}

.msgArea + .guideBox {padding-top:24px; padding-bottom:24px;}
.guideBox.copy .desc {margin-bottom:12px; color:#222; font-weight:500;}
.guideBox.copy .tit {font-size:1.3rem; font-weight:300;}
.guideBox.copy [class^=btn_] {display:inline-block; width:auto; min-height:24px; margin:-2px 2px 0; padding:1px 4px 2px; border-radius:2px; font-size:1.3rem; font-weight:300; vertical-align:top; background-color:#fff;}

/* errorBox */
.errorBox {margin:20px 0; padding:20px 24px; text-align:center; border-radius:8px; background-color:#fef5f5;}
.errorBox [class^=titH] {color:#e9473f;}
.errorBox [class^=btn_] {width:100%; color:#fff; border-color:#e9473f; background-color:#e9473f;}
.errorBox .desc {margin-top:5px; font-size:14px;}

/* cautiBox */
.cautiBox {display:flex; flex-direction:column; align-items:center; min-height:40px; margin-bottom:24px; padding:4px 20px; background:#eff6e9; border-radius:20px;}

/* definBox */
.definBox {margin:16px 0; border:1px solid #d6e1fe;}
.definBox .tit {display:flex; align-items:center; min-height:56px; padding:16px 10px; color:#445fe6; font-weight:500; background:#f2f6ff; justify-content:center;}
.definBox .tit .desc {display:inline-block; margin-left:10px; color:#222;}
.definBox .cont {padding:22px 23px; color:#222;}
.definBox .txtList:last-child {margin-bottom:0;}

.definGroup.terms .definBox:nth-child(1) .tit {min-height:100px; background-color:#fff; color:#222;}
.definGroup.terms .definBox {position:relative;}
.definGroup.terms .definBox .sign {position:absolute; bottom:-37px; left:50%; font-size:22px; font-weight:500; transform:translateX(-50%);}
.definGroup.terms .definBox + .definBox {margin-top:30px;} 

/* iptGuide */
.iptGuide {position:relative; margin-bottom:15px; padding-bottom:20px; border-bottom:1px solid #eee;}
.iptGuide .ipt + label {position:static; padding-left:0; font-size:14px; color:#222;}
.iptGuide .ipt + label:before {top:10px; left:inherit; right:0; }
.iptGuide .ipt + label:after {top:13px; left:inherit; right:8px; }

/* (공통)자동 로그아웃 */
.timeMsg {text-align:center;}
.timeMsg .time {display:inline-block; font-weight:500; font-size:4.8rem;}
.timeMsg .time .num {position:relative; display:inline-block; color:#715deb; border-radius:50%; border:4px solid #ddd; width:120px; height:120px; line-height:116px;}
.timeMsg .time .num:before {content:''; position:absolute; top:-4px; left:-4px; right:-4px; bottom:-4px; border:4px solid #715deb; border-radius:50%; border-bottom-color:transparent; border-left-color:transparent; border-right-color:transparent; animation: logoutAni 1s cubic-bezier(0.785, 0.135, 0.150, 0.860) infinite;}
.timeMsg .desc {margin-top:20px; font-size:1.4rem; word-break:keep-all;}

@keyframes logoutAni {0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}


/* (공통)은행_증권사 선택 */
.accountArea {margin:-26px -24px -80px; padding:32px 24px 0; background:#f8f8f8;}
.accountArea .iptFilt.tab {margin-bottom:0;}
.bankList {display:flex; flex-wrap:wrap; margin:-8px 0 24px; align-content: flex-start;}
.bankList li {width:50%; padding:8px; margin:8px 0;}
.bankList button {position:relative; width:100%; padding-left:30px; color:#222; text-align:left; min-height:24px; max-height:46px; line-height:1.4; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2;}
.bankList > li button:active,
.bankList > li button:focus,
.bankList > li.on button {text-decoration:underline; color:#445fe6;}
.bankList .img {position:absolute; top:0; left:0; width:24px; height:24px; text-align:center; font-size:14px; color:#fff; line-height:24px; overflow:hidden; border-radius:50%;}
.bankList .img.empty {background-color:#717592;}
.bankList .img img {width:100%; vertical-align:top;}

.iptFilt.tab + .bankList {height:calc(100vh - 385px); margin:0 -24px; padding:24px; overflow-y:scroll;}

.bottomSheet .bankList li {width:100%; padding:6px 0; margin:0;}
.bottomSheet .bankList button {max-height:none; min-height:55px; padding:6px 0 6px 56px;}
.bottomSheet .bankList button:focus {text-decoration:none; color:#222;}
.bottomSheet .bankList .img {width:40px; height:40px; margin-top:7px; line-height:40px;}
.bottomSheet .bankList .accInfo {display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.bottomSheet .bankList .accNum {display:block; margin-top:1px; color:#666; font-size:14px;}

.bnkChkList li + li{margin-top:15px;}
.bnkChkList .logo{display:inline-block; margin-right:15px;}
.bnkChkList .ipt[type=radio] + label{display:block; position:relative; padding:15px 25px; background:#fff; border:1px solid transparent; border-radius:5px;}
.bnkChkList .ipt[type=radio] + label:before{content:none;}
.bnkChkList .ipt[type=radio] + label:after{content: ''; position:absolute; top:50%; right:43px; width:9px; height:14px; border:1px solid #bbb; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg) translateY(-11px);}
.bnkChkList .ipt:checked + label{font-weight:500; border:1px solid #5d88fb;}
.bnkChkList .ipt:checked + label:after{border:1px solid #5d88fb; border-width: 0 2px 2px 0;}

.accountIpt {height:244px; margin:0 -24px; padding:27px 24px 42px; text-align:center; background-color:#fff; box-shadow:0px -3px 18px rgba(34,34,34,0.08); z-index:999;}
.accountIpt .tit {margin-bottom:23px; color:#222; font-weight:500;}
.accountIpt .tit .img {position:relative; top:-2px; display:inline-block; width:32px; height:32px; font-size:14px; line-height:32px; vertical-align:middle;}
.accountIpt .tit .img img {width:100%; vertical-align:top;}
.accountIpt .tit .img.empty {color:#fff; border-radius:32px; background-color:#717592; text-align:center;}
.accountIpt .formArea {position:relative; }
.accountIpt .formArea .iptWrap {width:100%; margin:0;}
.accountIpt .formArea .iptWrap .ipt {height:56px; padding-left:98px;}
.accountIpt .formArea .label {position:absolute; top:0; left:22px; color:#222; line-height:56px; z-index:1;}
.accountIpt .btnArea {margin-top:8px;}

/* 첨부파일목록 */
.paperList {display:flex; margin:4px -8px; flex-wrap:wrap; }
.paperList > li {position:relative; width:calc((100% - 64px) / 4); height:19.27vw; padding:8px; overflow:hidden; box-sizing:content-box;}
.paperList .size {position:absolute; bottom:18px; left:18px; font-size:10px; color:#fff;}
.paperList .icoBtn_del {position:absolute; top:12px; right:12px; width:16px; height:16px; border-radius:50%; background:#3d3d3d;}
.paperList .icoBtn_del:before,
.paperList .icoBtn_del:after {height:50%; background-color:#fff;}
.paperList .icoBtn_thum {width:100%; height:100%; border-radius:4px;}
.paperList .icoBtn_thum img {width:100%;}
.paperList .icoBtn_thum:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.4);}
.paperList input[type=file] {display:none;}
.paperList .fileAttach {position:relative; width:100%; height:100%; margin:0; border:none; border-radius:4px; background-color:#f2f6ff; }
.paperList .fileAttach:before,
.paperList .fileAttach:after {content:""; position:absolute; left:50%; top:50%; margin-left:-9px; width:2px; height:18px; margin:-9px 0 0 0; background-color:#5d88fb; transform:rotate(0);}
.paperList .fileAttach:after {transform:rotate(90deg);}
.paperList + .titArea {margin-top:20px;}

/* 거래내역 */
.transHistory {padding-left:14px;}
.transHistory .month {display:block; width:80px; height:24px; margin:auto; font-size:1.4rem; color:#666; line-height:23px; text-align:center;}
.transHistory .month.current {position:sticky; top:142px; margin-bottom:20px; font-size:12px; color:#fff; font-weight:500; border-radius:12px; background:#7d7d7d; overflow:hidden; z-index:10;}
.transHistory .month.current > div {transition: transform 0.3s ease-out;}
.transHistory .month.current > div span {display:block; height:24px; text-align:center;}
.transHistory .month:not(.current) + .historyBox:before {top:-15px; height:calc(100% + 24px);}
.transHistory .historyBox {position:relative; padding-bottom:20px;}
.transHistory .historyBox:before {content:""; position:absolute; top:7px; left:-16px; height:100%; border-left:2px dotted #e3e3e3;}
.transHistory .historyBox:last-of-type:before {display:none;}

.transHistory .date {position:relative; font-size:1.3rem; color:#959595;}
.transHistory .date:before {content:''; position:absolute; top:7px; left:-15px; width:6px; height:6px; border-radius:50%; background-color:#47435d; z-index:999;}

.transHistory .history {position:relative; margin:10px 0 30px; padding:20px; border-radius:10px; background:#fff;}
.transHistory .history:before {content:''; position:absolute; top:-14px; bottom:0; left:-13px; margin-bottom:-60px; border-left:2px dotted #e3e3e3;}
.transHistory .history li:first-of-type:before {border-left: 3px solid #f8f8f8; z-index: 100;}
.transHistory .history:last-of-type:before {border-left: 3px solid #f8f8f8; z-index: 100; top: -15px;}
.transHistory .history > li {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin-bottom:30px;}
.transHistory .history > li:last-child {margin-bottom:0;}
.transHistory .history > li .item {background-image:url(../../assets/images/smart/content/ico_trans_item_1.png); background-repeat:no-repeat; background-position:left center; background-size:24px auto; padding-left:30px;}
.transHistory .history > li .item.give {background-image:url(../../assets/images/smart/content/ico_trans_item_2.png);}
.transHistory .history > li .item.give + .money {color:#e658b2;}
.transHistory .history > li .item .transInfo {display:inline-block; text-align:left; vertical-align:middle; font-size:1.4rem;}
.transHistory .history > li .item .transInfo time {display:block; font-size:1.3rem; color:#959595;}
.transHistory .history > li .money {vertical-align:middle; text-align:right; font-size:1.6rem; font-weight:500; color:#222;}

/* PUSH내역 */
.pushHistory .date {position:relative; display:flex; justify-content:space-between; padding-left:30px; font-size:1.3rem; line-height:24px; background-image:url(../../assets/images/smart/content/ico_push_item_1.png); background-repeat:no-repeat; background-position:left center; background-size:24px auto; z-index:1;}
.pushHistory .date time {color:#959595; font-weight:300;}
.pushHistory .message {position:relative; margin:10px 0 30px 32px; padding:20px; border-radius:10px; background:#fff; font-size:1.4rem; color:#222; z-index:0;}
.pushHistory .message:before {content:''; position:absolute; top:-14px; bottom:0; left:-20px; margin-bottom:-30px; border-left:2px dotted #e3e3e3;}
.pushHistory .message:last-of-type:before {border-left:3px solid #f8f8f8; z-index:1; top:-15px;}
.pushHistory .message[role=button] {padding-right:40px;}
.pushHistory .message[role=button]:after {content:''; position:absolute; right:20px; top:27px; width:9px; height:9px; border:1px solid #b4b4b4; border-width:1px 1px 0 0; box-sizing:border-box; transform:rotate(45deg); z-index:1;}
.pushHistory .imgBanner {width:auto; margin:10px 0 0 0;}
.pushHistory .btnGroup {width:auto; margin-bottom:0;}
.pushHistory .icoBtn_arrow {position:absolute; top:8px; right:0; width:46px; height:46px;}
.pushHistory .icoBtn_arrow:after {border-width:0 1px 1px 0;}

.pushHistory .date.trans {background-image:url(../../assets/images/smart/content/ico_push_item_2.png);} /* 거래 */
.pushHistory .date.gift {background-image:url(../../assets/images/smart/content/ico_push_item_3.png);} /* 혜택_이벤트 */
.pushHistory .date.mail1 {color:#5642bf; background-image:url(../../assets/images/smart/content/ico_push_mail_1.svg);} /* SMS */
.pushHistory .date.mail2 {color:#666; background-image:url(../../assets/images/smart/content/ico_push_mail_2.svg);} /* LMS */
.pushHistory .date.mail3 {color:#445fe6; background-image:url(../../assets/images/smart/content/ico_push_mail_3.svg);} /* 모바일안내장 */
.pushHistory .date.mail4 {color:#00a3bb; background-image:url(../../assets/images/smart/content/ico_push_mail_4.svg);} /* 이메일 */
.pushHistory .date.mail5 {color:#e658b2; background-image:url(../../assets/images/smart/content/ico_push_mail_5.svg);} /* 우편 */
.pushHistory .date.play {background-image:url(../../assets/images/smart/content/ico_push_item_4.png);} /* PLAY Square */

.pushHistory.check .single {margin:0;}
.pushHistory.check label:before {border-radius:50%;}
.pushHistory.check label:after {top:5px;}
.pushHistory.check .date {padding-left:0; background:none; font-size:1.3rem;}
.pushHistory.check time {padding-left:30px; vertical-align:middle;}
.pushHistory.check .message:before {content:none;}

.msgHead {padding:0 0 19px 0; border-bottom:1px solid #eee;}
.msgHead .addInfo {font-size:1.4rem; color:#959595;}
.msgHead .cate {margin-bottom:8px; padding-left:30px; font-size:1.3rem; line-height:24px; font-weight:500; background-repeat:no-repeat; background-position:left center; background-size:24px auto;}
.msgHead .cate.mail1 {color:#5642bf; background-image:url(../../assets/images/smart/content/ico_push_mail_1.svg);} /* SMS */
.msgHead .cate.mail2 {color:#666; background-image:url(../../assets/images/smart/content/ico_push_mail_2.svg);} /* LMS */
.msgHead .cate.mail3 {color:#445fe6; background-image:url(../../assets/images/smart/content/ico_push_mail_3.svg);} /* 모바일안내장 */
.msgHead .cate.mail4 {color:#00a3bb; background-image:url(../../assets/images/smart/content/ico_push_mail_4.svg);} /* 이메일 */
.msgHead .cate.mail5 {color:#e658b2; background-image:url(../../assets/images/smart/content/ico_push_mail_5.svg);} /* 우편 */
.msgBody {margin-top:20px;}
.bottomSheet .msgBody {max-height:192px; overflow:auto;}

/* invest */
.investC1 {color:#5d88fb;} /*초저위험*/
.investC2 {color:#00a3bb;} /*저위험*/
.investC3 {color:#3e9100;} /*중위험*/
.investC4 {color:#ed7d1b;} /*고위험*/
.investC5 {color:#e9473f;} /*초고위험*/

/* 투자성향분석 결과 */
.scoreBox {display:flex; align-items:center; margin:-21px -25px 0; padding:23px 24px 25px; font-size:14px; color:#fff; font-weight:500; border-radius:8px 8px 0 0; background-color:#715deb; justify-content:space-between;}
.scoreBox .score {font-size:18px; line-height:1;}
.scoreBox .score em {display:inline-block; margin:0px 2px 0 0; font-size:40px; vertical-align:text-bottom;}
.txtList.prog.invest {margin-top:26px;}
.txtList.prog.invest > li {display:flex; padding-left:20px; justify-content:space-between;}
.txtList.prog.invest > li:before {top:7px; left:0; width:11px; height:11px;}
.txtList.prog.invest:before {top:10px; bottom:10px; }
.txtList.prog.invest .tit {width:auto; margin-right:auto; color:#222; font-weight:300;}
.txtList.prog.invest .desc {margin-top:0; font-size:14px; color:#666; text-align:right;}
.txtList.prog.invest > li:last-child:after {top:8px;}
.txtList.prog.invest li:nth-child(1):before {border-color:#5d88fb;}
.txtList.prog.invest li:nth-child(2):before {border-color:#00a3bb;}
.txtList.prog.invest li:nth-child(3):before {border-color:#3e9100;}
.txtList.prog.invest li:nth-child(4):before {border-color:#ed7d1b;}
.txtList.prog.invest li:nth-child(5):before {border-color:#e9473f;}

/* 투자날씨 */
.weather {display:inline-block; width:48px; height:48px; margin:auto;}
.weatherSlider .swiper-slide {text-align:center;}
.weatherSlider .weather {width:120px; height:120px;}
.weatherSlider .notiBox {position:relative; margin-top:8px; font-size:1.4rem; text-align:left;}
.weatherSlider .notiBox::before {content:''; position:absolute; left:50%; top:-7px; width:10px; height:10px; margin-left:-5px; background-color:#fff; border:1px solid #dad5f9; border-bottom:none; border-right:none; transform:rotate(45deg) skew(10deg, 10deg); z-index:0;}
.weatherSlider [class^=swiper-button-] {width:28px; height:28px; margin-left:8px; border:2px solid #eee; border-radius:50%;}
.weatherSlider .swiper-button-stop:before,
.weatherSlider .swiper-button-stop:after {top:7px; bottom:7px; left:8px;}
.weatherSlider .swiper-button-stop:after {left:auto; right:7px;}
.weatherSlider .swiper-button-play:after {top:7px; left:10px;}
.weatherSlider .swiper-pagination-bullet {width:28px; height:34px; margin:0 4px !important;}
.weatherSlider .swiper-pagination-bullet:before {top:inherit; bottom:0; height:2px; border-radius:0; background-color:transparent;}
.weatherSlider .swiper-pagination-bullet-active:before {background-color:#222;}
.weatherSlider .swiper-pagination-bullet:after {content:""; position:absolute; top:0; left:0; width:28px; height:28px; background-position:0 0; background-size:28px 28px; background-repeat:no-repeat;}
.weatherSlider .swiper-pagination-bullet:nth-child(1):after {background-image:url(../../assets/images/smart/content/img_weather_1.png);}
.weatherSlider .swiper-pagination-bullet:nth-child(2):after {background-image:url(../../assets/images/smart/content/img_weather_2.png);}
.weatherSlider .swiper-pagination-bullet:nth-child(3):after {background-image:url(../../assets/images/smart/content/img_weather_3.png);}
.weatherSlider .swiper-pagination-bullet:nth-child(4):after {background-image:url(../../assets/images/smart/content/img_weather_4.png);}
.weatherSlider .swiper-pagination-bullet:nth-child(5):after {background-image:url(../../assets/images/smart/content/img_weather_5.png);}

.weatherInfo {margin-bottom:28px;}
.weatherInfo > li {position:relative; margin-bottom:8px; padding:20px 24px 20px 94px; font-size:1.4rem; background:#fff; box-shadow:0 16px 37px rgba(0,0,0,0.08); border-radius:10px;}
.weatherInfo > li:not(:last-child):after {content:""; position:absolute; bottom:0; left:88px; right:24px; border-bottom:1px solid #eee;}
.weatherInfo [class*=titH] {margin-bottom:12px;; padding-right:66px;}
.weatherInfo .month {display:flex; align-items:center; position:absolute; top:24px; left:24px; font-size:1.4rem; color:#959595; }
.weatherInfo .current {flex-direction:column-reverse;}
.weatherInfo .current em {display:block; margin-top:4px; font-size:1.2rem; font-weight:300; text-align:center;}
.weatherInfo .prev {left:inherit; right:24px;}
.weatherInfo .prev .weather {width:32px; height:32px; margin-left:6px;}
.charmInfo {display:flex; align-items:center; margin-top:12px; margin-left:-70px; padding-top:12px; border-top:1px solid #eee;}
.charmInfo > .tit {display:flex; align-items:center; width:70px; font-size:1.3rem; color:#222; font-weight:500;}
.charmInfo > .tit [class^=charm] {display:inline-block; width:16px; height:16px; background-repeat:no-repeat; background-position:center center; background-size:16px auto;}
.charmInfo .charmUp {background-image:url(../../assets/images/smart/content/ico_charm_up.png);}
.charmInfo .charmDw {background-image:url(../../assets/images/smart/content/ico_charm_down.png);}
.charmInfo .charmEq {background-image:url(../../assets/images/smart/content/ico_charm_equal.png);}
.charmInfo .charmScore li {display:flex; align-items:center;}
.charmInfo .charmScore li:not(:first-child) {margin-top:3px;}
.charmInfo .charmScore .tit {margin-right:4px; font-size:1.2rem; color:#959595;}
.charmInfo .iptStar {width:72px; height:12px; margin:0; background:url(../../assets/images/smart/content/ico_charm_star.png) no-repeat 0 0 / 72px auto;}

.charmInfo .iptStar .ipt {width:12px; height:12px;}
.charmInfo .iptStar .ipt + label {width:12px; height:12px; margin-right:2px;}
.charmInfo .iptStar .ipt + label:last-child {margin-right:0;}
.charmInfo .iptStar .ipt + label:after {background:url(../../assets/images/smart/content/ico_charm_star.png) no-repeat 0 -30px / 72px auto}


/* 설문 */
[class^=titH].titQ {position:relative; margin-bottom:28px; padding-left:21px;}
[class^=titH].titQ .desc {display:block; margin-top:4px; font-size:1.4rem; font-weight:300; color:#666;}
[class^=titH].titQ .num {position:absolute; top:0; left:0; letter-spacing:-0.125rem;}
[class^=titH].titQ em,
.mark {border-bottom:1px solid transparent; border-image-source:url(../../assets/images/smart/content/tit_mark.png); border-image-outset:0; border-image-repeat:repeat; border-image-width:auto; border-image-slice:0 0 12 0;}
[class^=titH].titQ.numN {padding-left:0;}
[class^=titH].titQ + .iptWrap {margin-top:-12px;}

/* 감액신청/특약해지 */
.insuRiderList {margin-bottom:32px; border:1px solid #eee;}
.insuRiderList > li {padding:0 24px; border-top:1px solid #eee;}
.insuRiderList > li:first-child {border-top:0;}
.insuRiderList > li > div {display:flex; flex-wrap:nowrap; justify-content:space-between; align-items:baseline;}
.insuRiderList > li > div > div {flex-grow:1;}
.insuRiderList .insuRiderHead {min-height:56px; margin:0 -24px; padding:10px 24px; border-bottom:1px solid #eee; background-color:#f8f8f8; align-items:center;}
.insuRiderList em {color:#222; font-weight:300;}
.insuRiderList .tit {color:#222;}
.insuRiderList .row {padding:20px 0; color:#666; font-size:1.4rem;}
.insuRiderList .row + .row {border-top:1px solid #eee;}
.insuRiderList .state {margin:0; padding-left:24px; color:#5642bf; font-size:1.4rem; font-weight:500; text-align:right; white-space:nowrap;}
.insuRiderList .single {margin:0;}
.insuRiderList .single .ipt + label {margin-right:0; padding:0 31px 0 0; color:#666; font-size:1.4rem; font-weight:300; line-height:25px;}
.insuRiderList .single .ipt[type=checkbox] + label:before {left:auto; right:0;}
.insuRiderList .single .ipt[type=checkbox] + label:after {left:auto; right:8px;}
.insuRiderList .single .ipt[type=checkbox]:checked + label {color:#445fe6;}
.insuRiderList .item {white-space:nowrap;}
.insuRiderList .val {text-align:right;}
.insuRiderList .val > div + div {margin-top:4px;}
.insuRiderList .val .iptWrap {width:140px; margin:1px 0 4px 5px;}
.insuRiderList .val .ipt {height:36px; font-size:14px;}
.insuRiderList > li.readonly .tit,
.insuRiderList > li.readonly .row,
.insuRiderList > li.readonly em,
.insuRiderList > li.readonly .pointC6 {color:#959595 !important;}

/*최소높이맞춤*/
.h100 {min-height:100vh;}
.isDevice.isIOS .h100 {min-height: -webkit-fill-available;}/*IOS 사파리 높이오류시 고정값*/
.isDevice.isIOS {min-height: -webkit-fill-available;}

/*================================================== progressStep ==================================================*/
.progressStep {font-size:0;}
.progressStep .bar {position:fixed; left:0; top:56px; width:100vw; height:3px; background-color:#eee; z-index:1400;}
.progressStep .bar > span {display:inline-block; width:0; height:3px; background-color:#e658b2; transition: width 0.4s 0.5s ease-in-out;}
.progressStep .num {display:inline-block; position:absolute; right:20px; top:67px; width:28px; height:16px; border-radius:8px; background-color:rgba(0, 0, 0, .08); color:#D258B2; font-size:1.0rem; font-weight:500; text-align:center; overflow:hidden; z-index:1400;}
.progressStep .num > span {color:#000; font-weight:300; opacity:.5;}
.topBg .progressStep .num {color:#fff; background-color:rgba(0, 0, 0, .2);}
.topBg .progressStep .num > span {color:#fff; opacity:.65;}
.progressStep + .moneyBox {margin-top:16px;}


/*================================================== barGraph ==================================================*/
.barGraph {position:relative; margin-top:48px; height:6px; background:#eee;}
.barGraph .bar {position:absolute; top:0; left:0; height:6px; color:#715deb; background-color:#715deb;}
.barGraph .bar em {position:absolute; right:0; bottom:9px; font-size:1.4rem; transform:translateX(50%);}
.barGraph.fail .bar {width:100%; color:#e9473f; background-color:#e9473f;}
.barGraph.fail .bar em {left:0; right:inherit; transform:translateX(0);}


/*================================================== 팝업 ==================================================*/
.popup {padding:82px 24px 30px;}
.popup header {display:table; position:fixed; left:0; top:0; width:100%; height:55px; border-bottom:1px solid #ccc; background-color:#fff; overflow:hidden; z-index:1000;}
.popup header h1 {display:table-cell; height:54px; padding:1px 60px 0 24px; color:#222; font-size:1.8rem; font-weight:500; line-height:1.2; vertical-align:middle;}
.popup .icoBtn_close {position:fixed; top:10px; right:15px; z-index:1001;}
.popup.topBg {padding-top:55px;}

.popup.alert {position:fixed; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; width:100%; height:100vh; padding:0; background-color:rgba(0,0,0,0.4); overflow:hidden; z-index:9999; outline:rgba(0,0,0,0.5); transition:opacity 0.4s;}
.popup.alert .popCont {position:relative; width:288px; padding:25px 24px 55px; background-color:#fff; border-radius:8px; box-shadow:7px 3px 27px rgba(0,0,0,0.35); overflow:hidden;}
.popup.alert .popCont .tit {margin-bottom:15px; color:#222;}
.popup.alert .btnArea {display:block; position:absolute; left:0; bottom:0; width:100%; margin:0; padding:0 5px 5px; text-align:right;}
.popup.alert .btnArea button {min-height:44px; margin:0 5px; padding:0 15px; border:0; background-color:#fff; font-size:14px; font-weight:500; line-height:44px;}
.popup.alert .btnArea button:first-child {color:#222;}
.popup.alert .btnArea button:last-child,
.popup.alert .btnArea button:only-child {color:#0083CD;}

.popup.alert2 {position:fixed; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; width:100%; height:100vh; padding:0; background-color:rgba(0,0,0,0.4); overflow:hidden; z-index:999; outline:rgba(0,0,0,0.5); transition:opacity 0.4s;}
.popup.alert2 .popCont {position:relative; width:288px; padding:25px 24px 55px; background-color:#fff; box-shadow:7px 3px 27px rgba(0,0,0,0.35); overflow:hidden;}
.popup.alert2 .popCont .tit {margin-bottom:15px; color:#222; font-weight:500;}
.popup.alert2 .popCont .desc {margin-top:5px; font-size:1.4rem;}

.popup.alert3 {position:fixed; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; width:100%; height:100vh; padding:0; background-color:rgba(0,0,0,0.4); overflow:hidden; z-index:9999; outline:rgba(0,0,0,0.5); transition:opacity 0.4s;}
.popup.alert3 .popCont {position:relative; width:85%; max-width: 350px; padding:25px 20px; background-color:#fff; border-radius:8px; box-shadow:7px 3px 27px rgba(0,0,0,0.35); overflow:hidden;}
.popup.alert3 .msgArea .copy {font-size: 2rem;}
.popup.alert3 .msgArea.fail {padding-top:88px; margin-bottom:0px;}
.popup.alert3 .msgArea.fail.bg-ma {background:url('../../assets/images/smart/common/icon_malicious.png') no-repeat center 0; background-size:80px;}
.popup.alert3 .msgArea.fail.bg-re {background:url('../../assets/images/smart/common/icon_remote.png') no-repeat center 0; background-size:80px;}
.popup.alert3 .msgArea .copy .pointC4 {border-bottom: 1px solid #e91b10;}
.popup.alert3 .msgArea .desc {margin:10px 0;font-size:1.4rem;}
.popup.alert3 .btnArea.sticky {margin:25px 0 0 0;}
.txticonlist {max-height: 172px; overflow-y: auto; margin-top:15px; color:#222;}
.txticonlist li {position:relative; padding:10px 20px 10px 78px; margin-top:10px; border:1px solid #eee; border-radius: 10px; font-size:1.4rem;}
.txticonlist li:first-child {margin-top:0;}
.txticonlist li img {position:absolute; top: 50%; left: 17px; transform: translateY(-50%); width:45px;}

@media all and (max-width:320px) {
	.txticonlist {max-height: 170px;}
	.popup.alert3 .msgArea .copy {font-size: 1.8rem;}
	.txticonlist li {font-size: 1.4rem;}
}

/* 마이페이지 공지사항 & 이벤트 */
.popup.notice {position:fixed; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; width:100%; height:100vh; padding:0; background-color:rgba(0,0,0,0.4); overflow:hidden; z-index:999; outline:rgba(0,0,0,0.5); transition:opacity 0.4s;}
.popup.notice .popCont {position:relative; width:288px; padding:25px 24px 48px; border-radius:8px; background:#fff url(../../assets/images/smart/content/notice_ico.svg) no-repeat right 26px top 26px; background-size:40px auto; box-shadow:7px 3px 27px rgba(0,0,0,0.35); overflow:hidden;}
.popup.notice .popCont .tit {margin-bottom:15px; padding-right:50px; color:#222; font-size:2.0rem; font-weight:300;}
.popup.notice .popCont .txt {margin-bottom:15px; color:#959595; font-size:1.3rem;}
.popup.notice .btnGroup {flex-wrap:wrap; margin:20px 0;}
.popup.notice .btnGroup button {margin:4px 0; color:#445fe6;}
.popup.notice .btnArea {display:block; position:absolute; left:0; bottom:0; width:100%; margin:0 !important; padding:0;}
.popup.notice .btnArea::after {display:block; content:''; clear:both;}
.popup.notice .btnArea button.close {position:absolute; right:0; bottom:0; min-height:48px; margin:0; padding:0 17px; border:0; background-color:#fff; font-size:14px; font-weight:300; line-height:48px;}
.popup.notice .eventSlider {margin:-25px -24px 0;}
.btnArea .single.toDay {display:block; width:100%; height:48px; margin:0; padding:10px 0 10px 17px; background-color:#fff;}
.single.toDay label {padding-top:2px; color:#666; font-size:14px;}
.single.toDay .ipt[type=checkbox] + label::before {border-radius:50%;}
.single.toDay .ipt[type=checkbox] + label::after {top:6px; height:11px; border-color:#ccc;}
.single.toDay .ipt[type=checkbox]:checked + label::before {background-color:#5d88fb;}
.single.toDay .ipt[type=checkbox]:checked + label::after {border-color:#fff;}

.popup:not(.notice) .btnArea .single.toDay {margin-bottom:-8px;}

.bottomSheet {position:fixed; top:0; left:0; right:0; bottom:0; display:flex; align-items:flex-end; justify-content:flex-start; width:100%; height:100vh; padding:0; background-color:rgba(0,0,0,0.4); overflow:hidden; z-index:1999; outline:rgba(0,0,0,0.5); transition:opacity 0.4s;}
.bottomSheet .popCont {position: fixed; left:0; bottom: 0; width: 100%; /*max-height: calc(100vh - 55px);*/ padding-top: 0; border-radius: 19px 19px 0 0; background-color: #fff; overflow: hidden;}
.bottomSheet header {position:absolute; top:0; left:0; display:table; width:100%; height:55px; border-bottom:1px solid #ccc; background-color:#fff; overflow:hidden; z-index: 2}
.bottomSheet header h1 {display:table-cell; height:54px; padding:1px 60px 0 24px; color:#222; font-size:1.8rem; font-weight:500; line-height:1.2; vertical-align:middle;}
.bottomSheet .icoBtn_close {position:absolute; top:10px; right:15px; z-index:11;}
.bottomSheet .popBody {max-height: calc(100vh - 55px); padding:36px 24px 40px; overflow-y:auto; transform:translate(0,0);}
.bottomSheet header ~ .popBody {padding-top:83px;}
.bottomSheet .btnArea.sticky {bottom: -16px; margin: 32px -4px -16px; left:-4px; width:calc(100% + 8px);}

.isDevice.isIOS .bottomSheet .popBody {max-height:77vh;}

.digital .bottomSheet .btnArea.sticky {bottom:-40px; left:-24px; margin-bottom:-40px;}

/* 상품정보 요약 */
.bottomSheet .infoBox {margin:0 -24px; box-shadow:none; border-bottom:1px solid #eee;}
.bottomSheet .infoBox .infoDetail {margin-bottom:15px; padding:12px 24px 12px; background-color:#f8f8f8 !important;}
.bottomSheet .infoBox .infoDetail .infoList {padding:0; border-top:0;}
.bottomSheet div:not(.accoBody):not(.infoDetail) > .infoList:not(.half) {margin:0;}
.bottomSheet div:not(.accoBody):not(.infoDetail) > .infoList:not(.half) li {padding:12px 0; border-bottom:1px solid #eee;}
.bottomSheet div:not(.accoBody):not(.infoDetail) > .infoList:not(.half) li.flex .infoList > li {border-bottom:none;}
.bottomSheet div:not(.accoBody):not(.infoDetail) > .infoList:not(.half) + .infoDesc {margin-top:0; border-top:none;}

.bottomSheet .popBody > .infoDetail {margin:8px 0 8px;}
.bottomSheet .popBody .titH3 + .infoDetail {margin-top:20px;}

/* sel 호출 */
.selList {margin:-28px -24px -16px;}
.selList > li {position:relative; padding:17px 60px 16px 24px; border-bottom:1px solid #eee; background-color:#fff; color:#222; font-size:16px;}
.digital .selList > li {letter-spacing: -0.8px; padding:17px 34px 16px 24px;} /*디지털보험 sel값 설정*/
.selList > li > div.tit {margin:-17px -60px 0 -24px; padding:13px 24px; color:#959595; background-color:#f8f8f8; font-size:1.4rem;}
.selList button,
.selList > li label,
.selList > li .block {position:relative; width:100vw; margin:-17px -60px -16px -24px; padding:17px 60px 16px 24px; background-color:#fff; font-size:16px; text-align:left;}
.selList .disabled {background-color:#f8f8f8; color:#959595;}
.selList .on {color:#445fe6; font-weight:500;}
.selList .on::after {content:''; position:absolute; right:24px; top:50%; width:8px; height:12px; border:1px solid #618bfb; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:translateY(-50%) rotate(45deg);}
.selList .selList {margin:0 -60px -16px -24px;}

.selList.num {height:220px; margin:0; counter-reset:count; overflow-y:scroll;}
.selList.num > li {padding:12px 20px 12px 38px;}
.selList.num > li .block {width:100%; margin:0; padding:0;}
.selList.num > li:before {content:counter(count)'.'; counter-increment:count; position:absolute; top:50%; left:0px; color:#222; transform:translateY(-50%);}
.selList.num .date {margin-bottom:3px; color:#959595; font-size:1.4rem;}

.selList.chk li {padding:12px 60px 12px 63px;}
.selList.chk label {padding:12px 60px 12px 63px; margin:-12px -60px -12px -63px;}
.selList.chk label:before,
.selList.chk label:after {top:50%; left:23px;}
.selList.chk label:before {transform:translateY(-50%);}
.selList.chk label:after {transform:rotate(45deg) translateY(-95%);}
.selList.chk .ipt[type=checkbox]:checked + label:before {border-color:#715deb; background-color:#715deb;}
.selList.chk .ipt[type=checkbox]:checked + label:after {border-color:#fff;}
.selList.chk .ipt[type=checkbox]:active + label:before,
.selList.chk .ipt[type=checkbox]:focus + label:before {border-color:#715deb;}

/* selectLayer */
.bottomSheet.selectLayer,
.bottomSheet.moneyKeypad {opacity: 0; transition: 0.1s opacity ease-out}
.bottomSheet.selectLayer .popCont,
.bottomSheet.moneyKeypad .popCont {transform: translate(0,100%); transition: 0.25s 0.2s transform ease-out;}
.bottomSheet.selectLayer.open,
.bottomSheet.moneyKeypad.open {opacity: 1}
.bottomSheet.selectLayer.open .popCont,
.bottomSheet.moneyKeypad.open .popCont {transform: translate(0,0);}
.bottomSheet.selectLayer.open.close .popCont,
.bottomSheet.moneyKeypad.open.close .popCont {transform: translate(0,100%); transition-delay:0s; transition-duration: 0.2s }
.bottomSheet.selectLayer.open.close,
.bottomSheet.moneyKeypad.open.close {opacity: 0; transition-delay:0.25s; transition-duration: 0.1s;}

/* 오늘 하루 */
.bottomSheet .noLookBtn {display:flex; position:relative; flex-direction:row; flex-wrap:nowrap; width:auto; margin:32px -24px 0; background-color:#fff; align-items:center; justify-content:space-between;}
.bottomSheet .noLookBtn .btn_day {width:auto; min-height:48px; flex-grow:0; margin:0; padding:0 24px; color:#222; font-size:14px; font-weight:500;}
.bottomSheet .noLookBtn .btn_day:nth-last-child(2) {color:#666; font-weight:300;}

/* 안내 팝업 */
.bottomSheet .infoCopy {display:flex; align-items:center; justify-content:space-between;}
.bottomSheet .infoCopy .copy {flex-grow:1; font-size:1.4rem;}
.bottomSheet .infoCopy img {width:88px; margin-left:20px;}
.bottomSheet .infoPopup {padding-bottom:0; background-color:#5d88fb; color:#fff;}
.bottomSheet .infoPopup h1.titH3 {color:#fff;}
.bottomSheet .infoPopup .copy {opacity:0.95;}
.bottomSheet .infoPopup .txtList {margin:10px 0 0; color:#fff; opacity:0.95;}
.bottomSheet .infoPopup .btn_s.m {border:none !important;}
.bottomSheet .infoPopup + .icoBtn_close:before,
.bottomSheet .infoPopup + .icoBtn_close:after {background-color:#fff;}

/* 공지사항팝업 */
.bottomSheet .notiPopup {padding-bottom:0; background-color:#efecff; font-size:1.4rem;}
.bottomSheet .notiPopup .swiperWrap {margin:0 -24px; padding-bottom:32px; z-index:0;}
.bottomSheet .notiPopup .swiperWrap .block {padding:0 24px;}
.bottomSheet .notiPopup .titH1 {margin-bottom:10px; font-size:1.8rem; text-align:center;}
.bottomSheet .notiPopup [class*=titH] .mark {border-image-slice:0 0 7 0; border-image-slice:0 0 7 0;}
.bottomSheet .notiPopup .btnArea {margin-top:20px; margin-bottom:0;}

/* 토스트팝업 */
.toastPop {position:fixed; left:0; right:0; bottom:20px; text-align:center; animation:toastPopAni 0.45s 1 cubic-bezier(0.455, 0.030, 0.515, 0.955); z-index:3000;}
.toastPop > * {position:relative; display:inline-block; max-width:90vw; padding:17px 60px 17px 24px; margin:0 auto; background-color:rgba(113, 93, 235, .9); border-radius:28px; color:#fff; font-size:1.4rem;
-webkit-box-shadow:4px 8px 18px rgba(113,93,235,0.08); box-shadow:4px 8px 18px rgba(113,93,235,0.08); text-align:left;}
.toastPop .icoBtn_close {position:absolute; top:50%; right:14px; transform:translate(0, -50%)}
.toastPop .icoBtn_close:before,
.toastPop .icoBtn_close:after {height:17px; background-color:#fff;}
@keyframes toastPopAni {
	0% {transform: translate(0,90px)}
	100% {transform: translate(0,0px)}
}

/*================================================== 페이지 내 컨텐츠 ==================================================*/
/* pointNum */
.pointNum {color:#ffdf60;}

/* imgCont */
.imgCont {display:flex; flex-direction:column; margin:15px 0; align-items:center;}
.imgCont:not(.full) img {max-width:327px;}
.imgCont.mainPop:not(.full) img {max-width:288px;}
.imgCont > *:last-child:not(img) {margin-top:10px;}
.imgCont img.char {max-width:208px !important;}
.imgCont.al {align-items:flex-start;}
.imgCont.full {width:auto !important; margin-left:-24px; margin-right:-24px;}
.imgCont.full img {width:100%;}
.tooltip .imgCont {margin:0;}
.content > .imgCont.full:first-child {margin-top:0; margin-bottom:28px;}
.imgCont.scroll {display:block; margin-left:-24px; margin-right:-24px; padding-left:24px; padding-right:24px; overflow-x:auto;}
.imgCont.scroll img {max-width:708px;}
.txtList.disc > li .imgCont.scroll {margin-left:-36px; padding-left:36px;}

.imgfloat {display:inline-block;}
.imgfloat.txtList > li {width:49%; float:left; margin: 0 0 5px 0; padding: 0; text-align: center; font-size: 1.4rem;}
.imgfloat.txtList > li:nth-child(1),
.imgfloat.txtList > li:nth-child(3) {margin-right: 5px;}
.imgfloat .imgCont {margin: 0;}
.imgfloat .imgCont:not(.full).imgsize50 img {width: 100%;max-width: 327px;}

/* boxCont */
.boxCont {padding:32px 24px; border-radius:10px; background:#fff; box-shadow:8px 8px 19px rgba(0, 0, 0, .08);}
.boxCont + .titArea {margin-top:32px;}

/* hideCont */
.hideCont {position:relative; max-height:300px; overflow:hidden;}
.hideCont:after {content:""; position:absolute; bottom:0; left:-24px; right:-24px; height:100px; box-shadow:inset 0 -75px 35px -25px #fff; z-index:1;}
.hideCont + [class^=btn_] {margin:0;}
.hideCont.visible {max-height:inherit; overflow:visible;}
.hideCont.visible:after {display:none;}

/* 납입유연제도 */
.rangeArea {padding-bottom:34px; margin-top:42px; text-align:center;  border-bottom:1px solid #eee;}
.rangeArea .money {font-size:2.4rem; color:#222; font-weight:500; letter-spacing:-0.05rem;}
.rangeArea .range {padding:0 28px; margin-top:30px;}
.rangeArea .txtArea {display:flex; justify-content:space-between; position:relative; margin-top:4px; font-size:1.3rem; color:#959595;}
.rangeArea .txtArea > span {position: absolute; transform: translate(-50%,0); }
.rangeArea .txtArea > span:eq(0) {left:0;}
.rangeArea .txtArea > span:last-child {right:0; transform: translate(50%,0);}
.rangeArea .txtArea .current {min-width:20px; color:#222; white-space: nowrap;}

.range {position:relative;}
.range .current {position:absolute; text-align:center;}
.range .current.msgTip {display:inline-block; left: 0; opacity:0; transform: rotate(-15deg) translate( calc(-100% + 18px),0); transform-origin: left bottom; transition: opacity 0.15s;}
.range .current.msgTip.on {opacity: 1;}
.range > .current {top:-42px;}

.range input[type="range"] {-webkit-appearance:none; -moz-appearance:none; margin:0; width:100%; background:transparent;}
.range input[type="range"]::-webkit-slider-runnable-track {width:100%; height:4px; cursor:pointer; background:transparent;}
.range input[type="range"]::-webkit-slider-thumb {-webkit-appearance:none !important; width:20px; height:20px; border-radius:50%; background:#fff; cursor:pointer; -webkit-appearance:none; margin-top:-8px; box-shadow:2px 2px 5px rgba(0,0,0,0.2);}
.range input[type="range"]:focus::-webkit-slider-runnable-track {background:#eee;}
.range input[type="range"]::-moz-range-track {width:100%; height:4px; cursor:pointer; animate:0.2s; background-image:none; background:transparent;}
.range input[type="range"]::-moz-range-thumb {width:20px; height:20px; border-radius:50%; border:none; background:#fff; cursor:pointer; box-shadow:2px 2px 5px rgba(0,0,0,0.2);}
.range input[type="range"]::-moz-range-progress {background-color:#47435d;}
.range input[type="range"]::-ms-track {width:100%; height:4px; cursor:pointer; animate:0.2s; background:transparent; border-color:transparent; border-width:10px 0; color:transparent;}
.range input[type="range"]::-ms-fill-lower {background:#47435d; border:none;}
.range input[type="range"]::-ms-fill-upper {background:#eee; border:none;}
.range input[type="range"]::-ms-thumb {width:20px; height:20px; border-radius:50%; border:none; background:#fff; cursor:pointer; box-shadow:2px 2px 5px rgba(0,0,0,0.2);}
.range input[type="range"]::-ms-tooltip {display:none;}
.range input[type="range"]:focus::-ms-fill-lower {background:#47435d;}
.range input[type="range"]:focus::-ms-fill-upper {background:#eee;}

@media screen and (-webkit-min-device-pixel-ratio:0){
	.range input[type="range"] {
		background-image:-webkit-gradient(linear, left top, right top, color-stop(0, #47435d), color-stop(0, #eee));
	}
}

/* 보험금신청 */
.receiptCase {margin-top:20px;}
.receiptCase > li {position:relative; }
.receiptCase > li:not(:last-child):after {content:""; position:absolute; bottom:0; left:0; right:80px; border-bottom:1px solid rgba(255,255,255,0.3);}
.receiptCase .btn {display:flex; align-items:center; width:100%; height:72px; color:#fff; justify-content:space-between;}
.receiptCase .tit {display:inline-block; position:relative; padding-right:16px; font-size:1.6rem;}
.receiptCase .tit:after {content:''; position:absolute; right:0; top:50%; width:8px; height:8px; margin-top:1px; border:1px solid rgba(255,255,255,0.7); border-width:0 1px 1px 0; transform:translate(-50%, -50%) rotate(-45deg); transition:transform 0.25s;}
.receiptCase .case {display:flex; width:56px; height:56px; font-size:1.4rem; font-weight:500; line-height:56px; border-radius:16px; box-shadow:0px 11px 18px rgba(0,0,0,0.3); justify-content:center;}
.receiptCase .case em {font-size:1.8rem;}
.receiptCase .case.bg1 {background-color:#715deb;}
.receiptCase .case.bg2 {background-color:#5d88fb;}
.receiptCase .case.bg3 {background-color:#00a3bb;}

/* 계약관계자변경 */
.infoSlider {margin:0 -24px; padding-left:24px; padding-bottom:0;}
.infoSlider .swiper-container {padding:0 24px; margin-left:-33px;}
.infoSlider .slideList .swiper-slide {padding:0 8px;}
.infoSlider .inner {min-height:320px; margin-bottom:40px; padding:0 24px 20px; font-size:14px; background:#fff; border-radius:10px; box-shadow:0px 16px 28px rgba(0,0,0,0.1);}
.infoSlider .img {height:120px; margin:0 -24px 22px; text-align:center; background:#3d99e6; border-radius:10px 10px 0 0;}
.infoSlider .img img {width:120px;}
.infoSlider [class*=titH] {color:#222;}

/* 펀드 상세정보 */
[class*=flag_fund] {color:#fff;}
.flag_fund1 {background-color:#5d88fb;}
.flag_fund2 {background-color:#00a3bb;}
.flag_fund3 {background-color:#e658b2;}
.infoFund {color:#222;}
.infoFund .state .info {display:inline-block; font-size:1.4rem; color:#959595; vertical-align:middle;}
.infoFund .state * + .info {margin-left:2px;}
.infoFund .tit {font-size:1.8rem; margin-bottom:10px;}
.fundPrdArea {padding:10px 24px 6px; background:#fff; border-radius:8px; box-shadow:0px 16px 37px rgba(0,0,0,0.06);}
.fundPrdArea .infoList {margin:0 0 6px;}
.fundPrdArea .infoList:last-child li:last-child {border-bottom:none;}
.fundPrdArea .btn_s.more {margin-top:0; border:none;}

/* 펀드 포트폴리오 */
.recFund {margin:20px -24px 0; padding:0 24px; background:#3d99e6;}
.recFund .recTit {display:flex; align-items:center; padding:12px 0; justify-content:space-between;}
.recFund .recTit .tit {font-size:14px; color:#fff;}
.recFund .toggleSwitch {position:relative;}
.recFund .toggleSwitch input + label > span {color:#666; /*color:rgba(255,255,255,0.7);*/}
.recFund .toggleSwitch input + label:before {background-color:#eee;}
.recFund .toggleSwitch input + label:after {background-color:#fff;}
.recFund .toggleSwitch input:checked + label .on,
.recFund .toggleSwitch input:checked + label > span {color:#6d4700;}
.recFund .toggleSwitch input:checked + label:before {background-color:#ffdf60;}
.recFund .toggleSwitch input:checked + label:after {background-color:#fff;}
.fundList {display:flex; overflow:auto; scroll-snap-type:x mandatory; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory; scroll-padding:24px; margin:0 -24px; padding:8px 24px 32px;}
.fundList > li {position:relative; display:block; float:none; -webkit-flex:none; flex:none; align-items:start; justify-content:start; scroll-snap-align:start; width:200px; height:178px; margin-right:8px; vertical-align:top; z-index:0;}
.fundList > li:last-child:not(:only-child) {width:calc(200px + 24px);}
.fundList > li:last-child:not(:only-child) .ipt + label {width:calc(100% - 24px);}
.fundList > li:last-child:not(:only-child) .ipt + label {width:calc(100% - 24px);}
.fundList .icoBtn_infoPop {position:absolute; top:23px; left:163px; width:18px; height:18px; z-index:1;}
.fundList .icoBtn_infoPop:before {content:"!";  width:18px; height:18px;}
.fundList .ipt + label {width:100%; height:100%; padding:27px 24px 0; background:#fff; border-radius:10px; transition:all 0.25s ease-in-out;}
.fundList .ipt + label:before, 
.fundList .ipt + label:after {display:none;}
.fundList .ipt + label .tit {display:block; margin-bottom:8px; color:#fff; font-weight:500;}
.fundList .ipt + label .desc {display:block; font-size:14px; color:rgba(255,255,255,0.7);}
.fundList .ipt + label .chk {position:absolute; bottom:16px; left:16px; right:16px; height:36px; text-align:center; font-size:14px; color:#fff; line-height:36px; background:#6b677d; border-radius:2px;}
.fundList .ipt + label .chk .off {display:inline-block;}
.fundList .ipt + label .chk .on {display:none;}
.fundList .ipt + label .chk:before {content:''; display:inline-block; width:8px; height:12px; margin-right:8px; border:1px solid #fff; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg) translateY(-1px);}
.fundList .ipt:not(:checked) + label .tit {color:#222;}
.fundList .ipt:not(:checked) + label .desc {color:#666;}
.fundList .ipt:not(:checked) + label .chk:before {border-color:#d6e1fe;}
.fundList .ipt:not(:checked) + label .chk {background-color:#f2f6ff; color:#445fe6;}
.fundList .ipt:checked + label .chk .off {display:none;}
.fundList .ipt:checked + label .chk .on {display:inline-block;}
.fundList .ipt:focus + label {text-decoration:none; box-shadow:inset 0px 0px 0px 4px rgba(255,255,255,0.15);}
.fundList  .ipt:checked + label ~ .icoBtn_infoPop:before {color:rgba(255,255,255,0.7); border-color:rgba(255,255,255,0.7);}
.fundList > li:nth-child(3n+1) .ipt:checked + label {background-color:#5d88fb;}
.fundList > li:nth-child(3n+2) .ipt:checked + label {background-color:#00a3bb;}
.fundList > li:nth-child(3n+3) .ipt:checked + label {background-color:#e658b2;}
.fundList > li:nth-child(3n+1) .ipt:checked + label .chk {background-color:#466ef9;}
.fundList > li:nth-child(3n+2) .ipt:checked + label .chk {background-color:#008ba7;}
.fundList > li:nth-child(3n+3) .ipt:checked + label .chk {background-color:#da3b97;}

.recResult {position:relative; margin:0 -24px; }
.recResult .recInfo {position:relative; display:flex; align-items:center; height:56px; padding:0 24px; justify-content:space-between; background:#fff; z-index:2; }
.recResult .icoBtn_acco {width:33px; height:56px; overflow:visible;}
.recResult .icoBtn_acco:before {content:""; position:absolute; bottom:0; right:0; width:calc(100vw - 48px); border-bottom:1px solid #eee;}
.recResult .icoBtn_acco:after {left:inherit; right:0; width:10px; height:10px; border-color:#715deb;}
.recResult .accoBody {position:absolute; top:56px; left:0; width:100%; padding:5px 24px 2px; background:#fff; box-shadow:0px 16px 28px rgba(0,0,0,0.1); z-index:1;}
.recResult .item {font-size:14px;}
.recResult .val {margin-left:auto; color:#222;}
.recResult .val em {color:#5642bf;}

/* 대출 조건선택 */
.selLoanArea {display:flex; justify-content:space-between;}
.selLoanArea .selLoan {width:calc((100% - 8px) / 2);}
.selLoan {position:relative; width:100%; margin-bottom:40px;}
.selLoan .inner {position:relative; width:100%; padding:25px 24px 24px; border:1px solid #f2f2f2; border-radius:10px; box-shadow:0px 6px 8px rgba(0,0,0,0.06);}
.selLoan .inner:after {content:""; display:block; clear:both;}
.selLoan span {display:block; letter-spacing:-0.0125rem;}
.selLoan .tit {margin-bottom:47px; padding-right:40px; color:#222;}
.selLoan .money {margin-right:-5px; font-size:1.4rem !important; color:#666;}
.selLoan .money em {display:block; font-size:1.6rem; color:#222; font-weight:500;}
.selLoan .rate {margin-top:7px; font-size:1.4rem; color:#666;}
.selLoan .rate em {color:#e658b2;}
.selLoan .ipt + label {position:absolute; top:0; left:0; width:100%; height:100%; padding:0; border-radius:10px;}
.selLoan .ipt + label:before {top:23px; left:auto; right:23px; width:28px; height:28px; border:none; box-shadow:none; border-radius:50%; background-color:#f8f8f8; transform:none; transition:none;}
.selLoan .ipt + label:after {content:''; position:absolute; top:36px; right:41px;  width:8px; height:12px; border:1px solid #bbb; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg) translateY(-11px);}
.selLoan .ipt:checked + label:after {border-color:#5d88fb;}
.selLoan .ipt:checked + label:before,
.selLoan .ipt:checked:focus + label:before {border:none; box-shadow:none; background-color:#5d4ae5;}
.selLoan .ipt:checked + label:after {border-color:#fff;}

.selLoan .inner.on,
.selLoan .ipt:checked ~ .inner {background-color:#715deb; border-color:#715deb;}
.selLoan .inner.on span:not(.tit),
.selLoan .ipt:checked ~ .inner span:not(.tit) {color:rgba(255,255,255,0.7);}
.selLoan .inner.on .rate {float:left; margin-top:2px;}
.selLoan .inner.on .money {float:right; margin-right:0;}
.selLoan .inner.on span em {display:inline-block;}
.selLoan .inner.on span.tit,
.selLoan .inner.on span em,
.selLoan .ipt:checked ~ .inner span.tit,
.selLoan .ipt:checked ~ .inner span em {color:#fff;}

/* 사고보험금접수 */
.infoRowList[class*=receipt] > li {width:100%; margin-top:24px; margin-left:0;}
.infoRowList.receipt > li:first-child {margin-top:0;}
.infoRowList[class*=receipt] > li:first-child {margin-top:0;}
.infoRowList.receipt {margin-top:40px; padding-right:120px; background:url(../../assets/images/smart/content/img_receipt_info.png) no-repeat 100% 100%; background-size:120px;}
.infoRowList.receipt .item {margin-bottom:0; color:rgba(255,255,255,1);}
.infoRowList.receipt .val {color:#fff;}
.infoRowList.receiptInfo {margin-bottom:32px;}
.infoRowList.receiptInfo > li {display:flex; flex-direction:column; padding-left:80px; min-height:64px; justify-content:center;}
.infoRowList.receiptInfo .icoL {position:absolute; top:50%; left:0; width:64px; height:64px; padding:16px; border-radius:18px; transform:translateY(-50%);}
.infoRowList.receiptInfo .item {margin-bottom:0;}
.infoRowList.receiptInfo .val {font-size:1.6rem; font-weight:500;}
.infoRowList.receiptInfo .c1 div {color:#5642bf;}
.infoRowList.receiptInfo .c2 div {color:#445fe6;}
.infoRowList.receiptInfo .c3 div {color:#00a3bb;}
.infoRowList.receiptInfo .c4 div {color:#d85ab1;}
.infoRowList.receiptInfo .c1 .icoL {background-color:#f8f7fe;}
.infoRowList.receiptInfo .c2 .icoL {background-color:#f7f9ff;}
.infoRowList.receiptInfo .c3 .icoL {background-color:#f2fafc;}
.infoRowList.receiptInfo .c4 .icoL {background-color:#fcf3f9;}

.aimWrap .arwBtnList {margin-top: 30px;}
.aimWrap .arwBtnList li {width: 100%; min-height: 70px; display: flex; align-items: center; padding: 10px 55px 10px 25px; margin-bottom: 6px; border-radius:8px; background-color:#fff; font-weight: 500; box-shadow: 8px 7px 10px rgba(209,219,220,0.6); word-break: normal;}
.aimWrap .arwBtnList .icoBtn_arrow {height: 100%;}
.aimWrap .arwBtnList .icoBtn_arrow::after {right: 28px;}
.aimWrap .arwBtnList span.num {width: 60px; min-width: 60px; display:inline-block; color:#fff;font-size:1.5rem;text-align: center;padding: 2px 10px 4px 10px;border-radius: 25px;}
.aimWrap .arwBtnList span.num em {font-size:1.8rem;}
.aimWrap .arwBtnList span.num.bg1 {background-color: #715deb; margin-left: 5px;}
.aimWrap .arwBtnList span.num.bg2 {background-color: #82a4fc; margin-left: 10px;}
body:not(.digital) .content.aimWrap .btnArea.sticky .btn_s {background-color: #fff; color: #222;}
.aimWrap .infoRowList.receiptInfo {margin-bottom: 60px;}

/* progList */
.progList {margin-bottom:16px;}
.progList > li {display:flex; align-items:center; justify-content:center; flex-direction:column; position:relative; min-height:76px; color:#666; font-weight:500; background:#f5f6f9;}
.progList > li:not(:first-child) {margin-top:28px;}
.progList > li:not(:last-child):before,
.progList > li:not(:last-child):after {content:""; position:absolute; bottom:0; left:50%; display:inline-block; transform:translateX(-50%);}
.progList > li:not(:last-child):before {bottom:-14px; width:12px; height:10px; background:#f5f6f9;}
.progList > li:not(:last-child):after {bottom:-34px; border-style:solid; border-width:10px 12px; border-color:#f5f6f9 transparent transparent transparent;}
.progList > li span {font-size:1.4rem; font-weight:300;}

.progList > li:nth-child(1) {background-color:#f0f4ff;}
.progList > li:nth-child(2) {background-color:#d8e3fe; color:#445fe6; padding: 10px 0;}
.progList > li:nth-child(3) {background-color:#5d88fb; color:#fff; padding: 10px 0;}
.progList > li:nth-child(4) {background-color:#715deb; color:#fff;}

/* 신한플러스 멤버십 */
.shScore {margin-top:24px; margin-bottom:16px; padding:30px 16px 16px; text-align:center; background:#715deb; border-radius:10px;}
.shScore .total {font-size:1.4rem; color:rgba(255,255,255,0.7); font-weight:300;}
.shScore .total em {display:block; margin-top:5px; font-size:2.4rem; font-weight:500; color:#fff; line-height:1.2;}
.shScore .family {display:flex; align-items:center; margin-top:22px; padding:10px 16px; font-size:1.4rem; background-color:#7f6eed; border-radius:4px; justify-content:space-between;}
.shScore .family span {color:rgba(255,255,255,0.7);}
.shScore .family em {color:#fff;}
[class*=shLevel] {padding:23px; font-size:1.4rem; border:1px solid #eee; border-radius:10px;}
.shLevelList {padding:0; margin-bottom:30px;}
.shLevelList > li {position:relative; padding:23px;}
.shLevelList > li:not(:first-child) {border-top:1px solid #eee;}
.shLevelList [class^=flag_mb] {position:absolute; top:23px; right:23px; margin:0;}
.shLevelList .tit {display:block; padding:3px 0; color:#222;}
.shLevelList .val {font-size:1.6rem; font-weight:500;}
.shLevelList .infoList {margin-bottom:0;}
.shLevelList .infoList > li {padding-bottom:0;}

.flag_mb1 {color:#b87900; background-color:#f8f1e5;}
.flag_mb2 {color:#47435d; background-color:#ececee;}
.flag_mb3 {color:#5642bf; background-color:#f1eefd;}
.flag_mb4 {color:#715deb; background-color:#f1eefd;}
.flag_mb5 {color:#715deb; background-color:#eceffc;}
.flag_mb6 {color:#3e9100; background-color:#ebf4e5;}
.flag_mb7 {color:#5d88fb; background-color:#eef3ff;}
.flag_mb8 {color:#666; background-color:#f8f8f8;}

/* 나의FC */
.fcArea {display:flex; margin:0 -23px; padding:23px;}
.fcArea .fcInfo {display:flex; align-items:center; margin-right:5px; word-break:keep-all;}
.fcArea .fcInfo .img {width:40px; height:40px; margin-right:9px; overflow:hidden; border-radius:50%; box-shadow:inset 0 0 0 1px #d7e2fe; }
.fcArea .fcInfo .img img {width:100%;}
.fcArea .fcInfo .name {font-size:1.8rem; color:#222; font-weight:500;}
.fcArea .branInfo {margin-left:auto; text-align:right;}
.fcArea .branInfo .tel {padding-left:29px; color:#222; line-height:24px; letter-spacing:-0.05rem; word-break:break-word; background:url(../../assets/images/smart/content/ico_tel.svg) no-repeat 0 0 / 24px 24px;}
.fcArea .branInfo .branch {font-size:1.3rem; color:#666;}
.fcArea + .btnGroup {gap:0 8px;}
.fcArea + .btnGroup .btn_g {color:#666; border-radius:4px !important; border:none !important;}
.fcArea + .btnGroup .btn_fc {color: #715deb;}/* 230308 추가:고객관리우수FC */
.fcArea + .btnGroup .btn_g:first-child {max-width:35%;}
.fcArea + .btnGroup .btn_g:last-child:not(:only-child) {max-width:65%;}
.fcArea + .btnGroup .btn_g:only-child {max-width:100%;}
.fcArea ~ .inner {position:relative; margin:0 -23px; padding:18px 23px; border-top:1px solid #eee;}
.fcArea ~ .inner.on > .tit {font-weight:500;}
.fcArea ~ .inner.on .icoBtn_open::after {margin-right:0;}
.fcArea ~ .inner .icoBtn_open::after {margin-top:-7px; margin-right:2px;}
.fcArea ~ .inner .tit {font-size:1.4rem;}
.fcArea ~ .inner .infoDetail {padding-top:24px; padding-bottom:0;}
.fcArea ~ .inner .infoDetail > li:not(:first-child) {margin-top:16px; padding-top:20px; border-top:1px solid #eee;}
.fcArea ~ .inner .infoDetail .infoList {padding-top:0; border-top:none;}

/* 설정 */
.setupArea {display:flex; flex-direction:column; height:calc(100vh - 108px); margin:0;}
.setupList > li {display:block; position:relative; min-height:52px; margin-bottom:16px; padding:15px; border-radius:7px; background-color:#fff; color:#222; font-size:1.4rem; text-align:left;}
.setupList > li[role=button]::after {content:''; position:absolute; right:17px; top:50%; width:9px; height:9px; border:1px solid #bcbcbc; border-width:1px 1px 0 0; box-sizing:border-box; transform:translateY(-50%) rotate(45deg); z-index:1;}
.setupList > li.btn_gray {line-height:21px; font-weight:300; background-color:#eee;}
.setupList > li.btn_gray:after {content:none;}
.setupList .toggleSwitch label {display:block; height:52px; margin:-15px; padding:15px;}
.setupList .toggleSwitch input + label::before {left:auto; right:16px; top:50%; transform:translateY(-50%);}
.setupList .toggleSwitch input + label::after {left:auto; right:18px; top:50%; transform:translateY(-50%);}
.setupList .toggleSwitch input:checked + label:after {margin-right:14px;}
.versionArea {margin-top:auto; padding:60px 0; text-align:center; font-size:1.4rem;}
.versionArea .versionList > li {position:relative; display:inline-block; margin-right:20px;}
.versionArea .versionList > *:not(:first-child):before {content:''; position:absolute; left:-12px; top:5px; bottom:5px; border-right:1px solid #ddd;}
.versionArea > .links {margin-top:20px;}
.versionArea > .desc {margin-top:20px; color:#959595;}

.appTrans {display:flex; flex-direction:column; align-items: center; justify-content: center; height:calc(100vh - 162px);}
.appTrans .logo {width:118px; height:auto; margin-bottom:10px;}

/* 검진정보간편조회 */
.flag_normal {min-width:36px; height:22px; margin:0 0 0 2px; padding:0 2px; font-size:1.2rem !important; color:#666; line-height:20px; vertical-align:top; border:1px solid #ddd; border-radius:2px; background:#fff;}
.valUp,
.valDown {display:inline-block; position:relative; color:#e9473f;}
.valDown:before,
.valUp:before {content:""; display:inline-block; margin-right:4px; border-width:6px 4px; border-style:solid; border-color:#e9473f transparent  transparent; vertical-align:middle;}
.valUp:before {margin-top:2px; border-color:transparent transparent #e9473f; vertical-align:top;}
.valInfo {font-size:1.3rem !important; color:#666; line-height:1;}
.healthState:not(ul),
.healthState > li {position:relative; padding-left:64px; min-height:55px; color:#222;}
.healthState > li {display:flex; align-items:center; padding-top:20px; padding-bottom:20px; border-bottom:1px solid #f2f2f2; box-sizing:content-box;}
.healthState .links.arrow {display:block; margin:8px 0 0; font-size:1.4rem;}
.healthState .ico {position:absolute; top:50%; left:0; min-width:32px; padding-top:36px; font-size:1.3rem; font-weight:500; text-align:center; background-size:32px 32px; background-position:50% 0; background-repeat:no-repeat; transform:translateY(-50%);}
.healthState .ico.good {color:#445fe6; background-image:url(../../assets/images/smart/content/ico_face_good.svg);}
.healthState .ico.normal {color:#3e9100; background-image:url(../../assets/images/smart/content/ico_face_normal.svg);}
.healthState .ico.bad {color:#e9473f; background-image:url(../../assets/images/smart/content/ico_face_bad.svg);}

/* 건강나이 자세히보기 */
.healthAge {margin-top:16px; padding:24px; border-radius:10px; background:#fff;}
.healthAge .item {word-break:keep-all;}
.bgGrayArea .healthAge {margin-bottom:16px; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1);}

.ageState > li {padding:19px 23px 19px 88px !important; margin-bottom:8px; border:1px solid #ddd; border-radius:4px;}
.ageState > li.on {border-color:#5d88fb; box-shadow:3px 3px 7px rgba(0, 0, 0, .08); background:url(../../assets/images/smart/content/account_ico_client.png) no-repeat 31px 50% / 24px 24px;}
.ageState > li.on .val em {font-weight:500;}
.ageState .item {font-size:1.6rem; color:#222;}
.ageState .item em {position:absolute; top:50%; left:23px; font-size:1.3rem; font-weight:500; transform:translateY(-50%);}
.ageState .val em {font-weight:300; margin-right:14px;}

/* 헬스톡 */
.healthTalk.content {padding-top:56px}
.healthTalk .btnArea.sticky {margin-top:8px;}
.healthTalk .section {padding:64px 24px; margin:0 -24px !important;}
.healthTalk .section.main {position:relative; height:calc(100vh - (56px + 72px)); margin-bottom:72px !important; text-align:center; color:#fff; background:url(../../assets/images/smart/content/img_health_talk.jpg) no-repeat 0 -56px; background-size:cover;}
.healthTalk .section.main .titH3 {color:#fff; margin-bottom:62px;}
.healthTalk .section.main .slogan {position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%, -70%);}
.healthTalk .section.main .more {position:absolute; bottom:29px; left:50%; padding-bottom:36px; font-size:1.4rem; transform:translateX(-50%);}
.healthTalk .section.main .more:before,
.healthTalk .section.main .more:after {content:""; animation:moreTrans infinite; animation-duration: 0.5s; position:absolute; bottom:0; left:50%; width:8px; height:8px; margin-left:-3px; border:1px solid #fff; border-width:0 1px 1px 0; transform:translate(-50%, -50%) rotate(45deg);}
.healthTalk .section.main .more:before {bottom:10px; opacity:0.5;}
.healthTalk .section.bg_1 {background:#f2f6ff;}
.healthTalk .section.bg_2 {background:#f2fafc;}
.healthTalk .section.bg_2 .boxCont {position:relative; margin-top:24px; text-align:center; box-shadow:8px 8px 19px rgba(0, 163, 187, .08);}
.healthTalk .section > .titH3 {margin-top:50px;}
.healthTalk .titH1 {text-align:center; margin-bottom:10px;}
.healthTalk .txt2XL {margin-bottom:10px;}
.healthTalk .titIco.titH3 {flex-direction:column; margin-bottom:20px;}
.healthTalk .titIco.titH3 .ico {width:40px; height:40px; margin-right:0; margin-bottom:10px;}
.healthTalk .titCheck {display:inline-block; margin:0 auto 10px; padding-left:26px; font-size:1.4rem; color:#666; background:url(../../assets/images/smart/content/ico_healthtalk_check.svg) no-repeat 0 50%;}
.healthTalk .boxCont + .boxCont:after {content:""; position:absolute; top:-38px; left:50%; width:52px; height:52px; border-radius:50%; background:#fff url(../../assets/images/smart/content/ico_healthtalk_arrow.png) no-repeat 50% 50% / 27px 24px; box-shadow:8px 8px 19px rgba(0, 163, 187, .08); transform:translateX(-50%);}
.healthTalk .imgCont:first-child {margin-top:0;}
.healthTalk .imgCont + .boxCont {margin-top:-15px;}
.healthTalk .infoRowList {text-align:left;}
.healthTalk .infoRowList .val {font-size:1.4rem;}
.healthTalk .infoIcoList > li {align-items:center; padding-top:18px; margin-bottom:0; color:#666;}
.healthTalk .infoIcoList > li:not(:first-child) {margin-top:18px;}

.healthTalk .logo {width:44px;}
.healthTalk .slgDesc {display:block; margin:34px auto 14px; width:200px; height:32px; text-align:center; line-height:32px; font-size:1.4rem; color:#fff; border-radius:16px; background:#715deb;}
.healthTalk .slgDesc span {color:#ffdf60;}
.healthTalk .shSelvas {margin:30px 0 7px;}
.healthTalk .shSelvas img {width:208px;}

@keyframes moreTrans {
	0% {transform:translate(-50%, -50%) rotate(45deg);}
	50% {transform:translate(-50%, -100%) rotate(45deg);}
}

/* full bg */
.content.fullBg {padding-top:56px;}
.content.fullBg > .inner {min-height:calc(100vh - 56px); margin-left:-24px; margin-right:-24px; padding:64px 24px;}
.content.fullBg > .inner.bg_1 {background:#f2f6ff;}
.content.fullBg [class*=titH].pointC5 {color:#715deb !important;}
.content.fullBg .titH1 {margin-bottom:18px;}
.content.fullBg .btnArea.sticky {margin-top:8px;}

/* 미래설계리포트 */
.txtList.descrip {margin:0 auto 15px; width:110px; font-size:1.4rem; color:#222;}
.txtList.descrip > li {display:flex; justify-content:space-between; padding-left:14px;}
.txtList.descrip > li:before {top:6px; width:6px; height:6px;}
.txtList.descrip > li:nth-child(2):before {background-color:#715deb;}
.txtList.descrip > li:nth-child(3):before {background-color:#5d88fb;}
.txtList.descrip > li:nth-child(4):before {background-color:#00a3bb;}
.txtList.descrip > li:nth-child(2) span {color:#715deb;}
.txtList.descrip > li:nth-child(3) span {color:#5d88fb;}
.txtList.descrip > li:nth-child(4) span {color:#00a3bb;}

.infoRowList.gender {margin:26px 0 20px; padding:0 24px;}
.infoRowList.gender > li {text-align:center; border:none !important}
.infoRowList.gender .item {margin:12px 0 0;}
.infoRowList.gender .val {font-size:1.6rem;}

/* 혈당수치 등록수정 */
.valKeypad {margin-top:36px; text-align:center; color:#222;}
.valKeypad .val {margin-top:8px; font-weight:500;}
.valKeypad .val em {font-size:3.2rem; letter-spacing:-0.05rem;}

.bloodSugar.setHalf > *:last-child:nth-child(2) {float:right; width:calc((100% - 40px) / 2); margin-right:8px;}
.bloodSugar.setHalf > *:first-child:nth-last-child(2) {width:calc((100% - 40px) / 2); margin-left:8px;}
.bloodSugar .ipt {padding:0; border:none; border-bottom:1px solid #222; border-radius:0;}
.bloodSugar .ipt:focus {box-shadow:none;}

.bloodKeypad {padding-bottom:240px !important;}
.bloodKeypad .bsKeypad {width:inherit; position:absolute; bottom:0; left:0; right:0; margin:0;}

/* 신한카드 상담신청 */
.shCardSlider.swiperWrap {margin:0 -24px; padding:0 0 30px;}
.shCardSlider.swiperWrap .swiper-container {padding:0 37.6666vw 0 24px;}
.shCardSlider .swiper-slide {text-align:center; padding-right:10px;}
.shCardSlider .swiper-slide > a {display:block;}
.shCardSlider .swiper-slide .card {display:flex; min-height:35vw; margin-bottom:10px; padding:3.4666vw 7.6666vw; align-items:center; justify-content:center; transition:all ease-in-out 0.25s;}
.shCardSlider .swiper-slide .tit {color:#222;}
.shCardSlider .swiper-slide .links {font-size:1.4rem;}
.shCardSlider .swiper-slide img {width:100%;}
.shCardSlider .swiper-slide.swiper-slide-active .tit {font-weight:500;}
.shCardSlider .swiper-slide.swiper-slide-active .card {padding:0;}
.shCardSlider .swiper-slide.swiper-slide-active .card img {border-radius:2vw; box-shadow:3px 3px 7px rgba(0,0,0,0.1);}


/* 인증방법 선택 */
.certiList {margin-top:32px;}
.certiList > li {margin:16px 0;}
.certiBtn {width:100%; padding:15px 0; border:1px solid #eee; border-radius:7px; background-color:#fff; color:#444; text-align:center;}
.certiBtn > span {display:inline-block; width:220px; text-align:left;}
.certiBtn .ico {display:inline-block; width:48px; margin-right:25px; text-align:center; vertical-align:middle;}
.certiBtn em {display:inline-block; font-weight:300; vertical-align:middle;}

/* iframe */
.iframeWrap iframe {width:100vw; height: 100vh}

/* 전자교부 안내 */
.conIcoList {box-shadow:0 2px 5px rgba(113,93,235,0.1);}
.conIcoList li {position:relative; padding:24px 24px 24px 71px; color:#222;}
.conIcoList li + li {border-top:1px solid #f0edfc;}
.conIcoList li img {position:absolute; top:50%; left:24px; width:32px; height:32px; transform:translateY(-50%);}

/* 단축번호 */
.arsNum{display:inline-block; width:28px; height:28px; font-size:1.3rem; text-align:center; line-height:28px; font-weight:500; border-radius:50%; vertical-align:top;}
.arsNum.c1{color:#fff;background:#5d88fb;}
.arsNum.c2{color:#445fe6;background:#f2f6ff;}
.arsNum.c3{color:#3e9100;background:#f5f9f2;}

.codeList {width:100%; margin:12px 0; text-align:left;}
.codeList > li {display:flex; position:relative; flex-direction:row; flex-wrap:nowrap; padding:7px 0; justify-content:space-between; align-items:baseline;}
.codeList .item {min-width:30%; padding-right:15px;}
.codeList .val {min-width:10%; text-align:right;}

/* 금융거래 10계명 */
.txtList.step.line:before {content:none;}
.txtList.step.line > li {margin:0; padding:25px 0;}
.txtList.step.line > li:before {content:counter(count,decimal-leading-zero); position:relative; display:block; width:40px; height:40px; font-size:1.4rem; line-height:40px;}
.txtList.step.line > li:first-child {padding-top:0;}
.txtList.step.line > li + li {border-top:1px solid #eee;}
.txtList.step.line > li [class^=tit] {display:block; margin:12px 0 0 0;}
.txtList.step.line > li .txtList {margin:18px 0 0 0;}
.txtList.step.line > li:last-child:after {content:none;}

/* 비대면 실명인증 박스 */
.lineGrayBox {border:1px solid #eee;}
.lineGrayBox > .block {padding:24px;}
.lineGrayBox > .block .caution {margin-bottom:8px; font-size:1.6rem; font-weight:500; color:#222;}
.lineGrayBox > .block.bg {background-color:#f8f8f8;}

/* 생명/보안카드 */
.cardBox {position:relative; max-width:420px; margin:0 auto 32px; padding:24px; border-radius:9px; background-color:#5d88fb; background-image:url(../../assets/images/smart/content/otp_pw.svg); background-position:right 24px top 24px; background-repeat:no-repeat; color:#fff; box-shadow:8px 8px 19px rgba(93, 136, 251, .1); overflow:hidden;}
.cardBox::before,
.cardBox::after {content:''; position:absolute; opacity:.07;}
.cardBox::before {left:0; bottom:0; width:100%; height:40px; background-color:#000;}
.cardBox::after {right:0; bottom:40px; width:40px; height:40px; border:20px solid #000; border-color:transparent #000 #000 transparent; box-sizing:border-box;}
.cardBox .state {margin-bottom:24px;}
.cardBox [class^=flag_] {min-width:56px; margin:0 3px 0 0; background-color:rgba(0, 0, 0, .15); color:#fff !important;}
.cardBox .info {display:inline-block; color:#fff; font-size:1.3rem; vertical-align:middle; opacity:0.9;}
.cardBox .tit {font-size:1.8rem; font-weight:500;}
.cardBox .addInfo {margin-top:4px; color:#fff; font-size:1.6rem; font-weight:500; opacity:0.9;}
.cardBox .desc {display:block; font-size:1.3rem; color:#fff; opacity:1; font-weight:300;}
.cardBox .money {margin:8px 0 23px; color:#fff; font-size:1.3rem;}
.cardBox .money .icoBtn_infoPop:before {color:#fff; border-color:#fff;}
.cardBox .btnGroup {margin:26px 0 0;}
.cardBox .btnGroup [class^=btn_] {border-color:transparent;}
.cardBox .infoList {margin:5px 0 0;}
.cardBox .infoList > li {padding:2px 0 !important;}
.cardBox .infoList > li > div {color:#fff !important; font-size:1.4rem !important; opacity:.7;}

.cardBox.life,
.cardBox.security {background-image:url(../../assets/images/smart/content/card_ci.svg); background-position:right 15px top 20px;}
.cardBox.life {background-color:#715deb; box-shadow:8px 8px 19px rgba(113, 93, 235, .1);}
.cardBox.security {/* background-color:#00a3bb; box-shadow:8px 8px 19px rgba(0, 163, 187, .1); 접근성 */}
.cardBox.security .btnGroup [class^=btn_] {/* color:#00a3bb; 접근성 */}

.cardBox + .cardBox {margin-top:-16px;}

/* 혈당관리  */
.statBtnGroup {display:flex; flex-wrap:wrap; justify-content:space-between; width:100%;}
.statBtnGroup .btn_arrow {display:block; width:calc(50% - 7px); padding:20px 17px;    color:#222; font-size:1.6rem;}
.statBtnGroup .btn_arrow:after {content:none;}
.statBtnGroup .btn_arrow img {display:block; width:40px; height:40px; margin-bottom:10px;}

.transHistory .history.blood > li {padding-right:25px; background-image:url(../../assets/images/smart/content/ico_pencil.png); background-repeat:no-repeat; background-position:right center; background-size:15px 15px;}
.transHistory .history.blood > li .item {background-image:url(../../assets/images/smart/content/ico_trans_item_3.png);}

/* 공통 보안매체 */
.certiWrap {margin-bottom:32px;}
.certiWrap .txtList {margin-bottom:0;}
.certiWrap .setBtnAdd [class^=btn_].m {min-width:130px; padding:5px 0;}
.certiIpt {display:flex; position:relative; margin:16px 0; border:1px solid #d6e1fe; border-radius:8px; background-color:#f2f6ff; justify-content:space-around; align-items:baseline;}
.certiIpt .label {display:block; margin-bottom:12px; color:#666; font-size:1.6rem; font-weight:500;}
.certiIpt .label em {color:#445fe6;}

.certiIpt .keypad {margin:0; padding:0;}
.certiIpt .keypad .ipt[type=password] {height:62px; padding:0 0 5px; color:#445fe6; font-size:58px; font-family:caption; border:0; background-color:transparent; letter-spacing:0; line-height:0; text-align:center;}
.certiIpt .keypad .ipt[type=password]:focus {box-shadow:none;}
.certiIpt .keypad .ipt[type=password]::placeholder {padding-left:6px; color:#d3d8ed; font-size:18px; font-family:caption; letter-spacing:6px; text-align:center !important; line-height:42px; transform:translateY(-30%);}
.certiIpt .block {display:inline-block; padding:24px 0 25px;}
.certiIpt .block .keypad::after {content:'●●'; left:auto; right:-4px; padding:0; color:#717592;}
.certiIpt .block .keypad .ipt[type=password] {width:64px; height:42px; padding-bottom:6px; border:1px solid #d6e1fe; background-color:#fff; font-size:50px;}
.certiIpt .block .keypad .ipt[type=password]::placeholder {font-size:15px; line-height:38px;}
.certiIpt .block:last-child::before {content:''; position:absolute; left:50%; top:0; bottom:0; width:1px; background-color:#d6e1fe;}
.certiIpt .block:last-child .keypad {padding-left:41px;}
.certiIpt .block:last-child .keypad::after {left:0; right:auto;}

.certiIpt > .iptBtn {display:inline-block; padding:24px 0 25px; text-align:left;}
.certiIpt > .iptBtn .dot {display:inline-block;}
.certiIpt > .iptBtn .dot em {display:inline-block; position:relative; width:13px; height:13px; margin:0 1px; border-radius:50%; background-color:#d3d8ed; overflow:hidden;}
.certiIpt > .iptBtn:not(:only-child) .dot {display:inline-block; position:relative; width:110px; height:44px; padding-left:14px; line-height:45px;}
.certiIpt > .iptBtn:not(:only-child) .dot::before {content:''; position:absolute; left:0; top:0; width:64px; height:44px; border:1px solid #d6e1fe; border-radius:4px; background-color:#fff; box-sizing:border-box; z-index:0;}
.certiIpt > .iptBtn:not(:only-child) .dot em:nth-child(3) {margin-left:20px;}
.certiIpt > .iptBtn:first-child:not(:only-child) .dot em:nth-child(3),
.certiIpt > .iptBtn:first-child:not(:only-child) .dot em:nth-child(4) {background-color:#717592;}
.certiIpt > .iptBtn:last-child:not(:only-child)::before {content:''; position:absolute; left:50%; top:0; bottom:0; width:1px; background-color:#d6e1fe;}
.certiIpt > .iptBtn:last-child:not(:only-child) .dot {padding-left:0;}
.certiIpt > .iptBtn:last-child:not(:only-child) .dot::before {left:auto; right:0;}
.certiIpt > .iptBtn:last-child:not(:only-child) .dot em:nth-child(1),
.certiIpt > .iptBtn:last-child:not(:only-child) .dot em:nth-child(2) {background-color:#717592;}
.certiIpt > .iptBtn:only-child {width:100%; padding:22px 0 17px; text-align:center;}
.certiIpt > .iptBtn:only-child .dot em {width:16px; height:16px;}
.certiIpt > .iptBtn.on .dot em {background-color:#445fe6;}

/* 공동인증서 내보내기 */
.certiPort .img {text-align:center;}
.certiPort .certiNumArea {margin:32px -24px; padding:46px 24px 30px; background-color:#5d88fb; text-align:center;}
.certiNumArea .copy {margin-bottom:16px; color:#fff; font-size:1.4rem; opacity:.93;}
.certiNumArea .certiNum {position:relative; margin:0 -20px 24px;}
.certiNumArea .certiNum .iptWrap {width:96px; margin:0;}
.certiNumArea .certiNum .ipt {padding:0 !important; border:none; background-color:transparent !important; color:#fff; font-size:2.8rem; font-weight:500; text-align:center;}
.certiNumArea .certiNum .sign {position:absolute; top:0; margin-left:-9px; color:#fff; font-size:2.8rem; opacity:.3;}
.certiNumArea .btn_s.m {border:none !important;}
.certiTxtList {position:relative; margin:12px 0 0; padding-left:26px; color:#222;}
.certiTxtList::before {content:''; position:absolute; left:5px; top:8px; bottom:0; width:1px; background-color:#e8ecff;}
.certiTxtList > li {position:relative; margin-bottom:26px;}
.certiTxtList > li:last-child {margin-bottom:0;}
.certiTxtList > li:last-child::before {content:''; position:absolute; left:-21px; top:15px; bottom:0; width:1px; background-color:#fff;}
.certiTxtList [class^=flag_] {display:block; width:62px; margin:0 0 7px; padding:0; background-color:#f2fafc; color:#00a3bb;}
.certiTxtList [class^=flag_]::before {content:''; position:absolute; left:-26px; top:9px; width:11px; height:11px; border:2px solid #06a5bd; border-radius:50%; background-color:#fff; box-shadow:3px 3px 5px rgba(0,163,187,.1); box-sizing:border-box;}
.certiTxtList .flag_pc {background-color:#f2f6ff; color:#445fe6;}
.certiTxtList .flag_pc::before {border-color:#5d88fb; box-shadow:3px 3px 5px rgba(93,136,251,.1);}

/* 인증서등록안내 */
.certiNotice {padding:24px 20px; border-radius:4px; background:#f8f8f8;}
.certiNotice:not(:first-child) {margin-top:8px;}
.certiNotice .txtList.disc {color:#222; font-size:1.4rem;}
.certiNotice .imgCont {margin:0 0 20px;flex-direction:row; justify-content:center; gap:32px;}
.certiNotice .btnArea {margin:0;}
.certiNotice [class^=btn_] {margin:0 2px; padding:5px 0; color:#445fe6; border-color:#d6e1fe;}

/* 230915 - 전자서명 인증 추가 (s) */
.arwBtnList.certify_se li {padding: 15px 40px 15px 55px;margin-bottom:10px;background-color:#fff;border:1px solid #e2e2e2; border-radius:7px;}/* 231013 - 수정 */
.arwBtnList.certify_se li > .icoS {top:15px;left:20px;}
.arwBtnList.certify_se .icoBtn_arrow {height:56px;}
.arwBtnList.certify_se .icoBtn_arrow:after {right:15px;}
/* 230915 - 전자서명 인증 추가 (e) */

/* 쿠폰 */
.couponWrap {position:relative; margin-top:22px; padding:23px 23px; border:1px solid #d6e1fe; border-radius:8px; background-color:#f2f6ff;}
.couponWrap:before,
.couponWrap:after {content:""; position:absolute; bottom:64px; left:-1px; width:13px; height:26px; background:url(../../assets/images/smart/content/bg_coupon.png) no-repeat 0 0 / 13px 26px;}
.couponWrap:after {left:inherit; right:-1px; transform:rotate(180deg);}
.couponWrap .btnCell {padding:16px 24px; margin:22px -23px -23px; border-top:1px dashed #d6e1fe;}
.couponWrap .btnCell .btn_p {margin:0;}
.couponWrap .btnCell .infoList:last-child {margin-bottom:0;}
.couponWrap .txtList {font-size:1.4rem; word-break:initial;}
.couponWrap .infoList .val {color:#222; font-size:1.4rem;}
.couponInfo {display:flex; flex-direction:column; justify-content:center; position:relative; min-height:74px; margin-bottom:22px; padding-left:93px;}
.couponInfo .img {position:absolute; top:50%; left:0; width:74px; height:74px; border-radius:50%; overflow:hidden; transform:translateY(-50%);}
.couponInfo .img img {width:100%;}
.couponInfo .tit {display:-webkit-box; color:#222; font-size:1.6rem; font-weight:500; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.couponInfo .desc {margin-top:2px; font-size:1.4rem; color:#666;}

/* 서비스신청목록 */
.infoBox .couponInfo {margin-bottom:12px; padding-left:0; padding-right:93px;}
.infoBox .couponInfo .img {left:inherit; right:0;}
.infoBox .couponInfo .tit {font-weight:300; padding-right:0 !important;}

/* 간편서비스계좌 */
.simpleSvc {margin:0 -24px 30px; padding:26px 24px; background-color:#f2f6ff;}
.simpleSvc .imgCont {margin-top:0; margin-bottom:20px;}
.simpleSvc .imgCont img {max-height:80px;}

/* 셀프체킹 안내 */
.icoNotice {display:flex; gap:0 10px; margin:70px 0 0; text-align:center; justify-content:center; font-size:1.2rem; color:#000;}
.icoNotice .ico {display:flex; justify-content:center; align-items:center; margin-bottom:8px; width:27.222vw; height:27.222vw; max-width:102px; max-height:102px; border-radius:50%; background-color:#f2f2f2;}

/* 우편번호 찾기 */
.resulList {border-top:1px solid #222;}
.resulList > li {border-bottom:1px solid #ddd;}
.resulList > li .block {display:table; width:100%; padding:23px 0; box-sizing:border-box; color:#445fe6; text-align:left;}
.resulList > li .block [class*=Cell]:first-child {padding-left:25px;}
.resulList > li .block [class*=Cell] {display:table-cell; padding-right:25px; vertical-align:middle;}
.resulList > li .block .numCell {width:110px;}
.resulList > li .block [class*=Cell] .tit,
.resulList > li .block [class*=Cell] .info {display:block; color:#222;}
.resulList > li .block [class*=Cell] .info {color:#999; font-size:1.4rem;}
.resulList > li .block [class*=Cell] .info > span {color:#666;}

/* boxLink */
.boxLink > li {margin-bottom:16px;}
.boxLink .block {position:relative; padding:27px 32px 32px 32px; width:100%; background-color:#f8f8f8; color:#666; font-size:1.4rem; text-align:left;}
.boxLink .block:not(div)::after {content:''; position:absolute; right:24px; top:50%; width:9px; height:9px; border:1px solid #676767; border-width:0 0 2px 2px; background-color:transparent; box-sizing:border-box; transform:translateY(-50%) rotate(-135deg);}
.boxLink .block .tit {display:block; margin-bottom:5px; color:#222; font-weight:500; font-size:1.6rem;}
.boxLink .block .tit .num {margin-right:3px; color:#445fe6; font-size:1.8rem;}
.boxLink .block .img {position:absolute; top:50%; left:32px; transform:translateY(-50%);}
.boxLink .block .img img {width:40px; height:40px;}
.boxLink .block .img ~ * {padding-left:56px;}
.boxLink .block .txtItem {display:block;}
.boxLink .block .txtItem + .tit {margin:5px 0 0;}

/* 지점찾기 */
.branchSrchArea {margin:0 -24px 30px; padding:76px 24px 24px; background-color:#715deb;}
.iptGroup.branch {position:relative;}
.iptGroup.branch::after {display:block; content:''; clear:both;}
.iptGroup.branch > li {float:left; width:50%; margin:0;}
.iptGroup.branch label {width:100%; height:45px; padding:12px 0 0; background-color:#634fd5; color:#fff; font-size:14px; text-align:center;}
.iptGroup.branch label:before {content:none;}
.iptGroup.branch .ipt[type=radio]:checked + label {background-color:#fff; color:#5642bf; font-weight:500;}
.iptGroup.branch .ipt[type=radio]:checked + label:hover,
.iptGroup.branch .ipt[type=radio]:checked:focus + label {text-decoration:underline;}
.branchSrchArea > .inner {padding:24px; background-color:#fff;}
.branchSrchArea .formList {margin-bottom:10px;}
.branchSrchArea .itemTh {margin-top:0; padding:0;}
.branchSrchArea .formList .iptGroup::after {display:block; content:''; clear:both;}
.branchSrchArea .formList .iptGroup > li {float:left; min-width:50%; margin:0 0 8px;}
.branchSrchArea .btn_p.m {margin:12px 0 0;}

.branchList {margin:0 -24px; border-bottom:1px solid #ddd;}
.branchList > li {position:relative; border-top:1px solid #ddd;}
.branchList .block {padding:20px 24px; color:#666; font-size:1.4rem;}
.branchList .block:nth-last-child(2) {padding-bottom:48px;}
.branchList .tit {margin-bottom:5px; color:#222; font-size:1.6rem; font-weight:500;}
.branchList .tel {position:absolute; left:24px; bottom:19px; color:#b87900; z-index:2;}

.branchMap {height:300px; margin:0 -24px 32px; padding:56px 0 0; overflow:hidden;}
.busyDay {display:block; height:auto; margin-top:32px;}
.busyDay > .tit {padding:20px; border-radius:8px; background-color:#1a75e4; color:#fff; font-size:1.6rem; box-shadow: 4px 8px 16px rgba(0, 66, 142, 0.24);}

/* 신한라이프pick */
[class*="shLifePick"] .thum {display:block; border-radius:10px; overflow:hidden;}
[class*="shLifePick"] .thum img {width:100%;}
[class*="shLifePick"] .btnLike {display:inline-block; height:24px; line-height:24px; padding:0 10px 0 30px; border-radius:12px; font-size:1.3rem; color:#fff; background:#7185eb url(../../assets/images/smart/content/ico_like_unchecked.svg) no-repeat 11px 5px / 14px 14px;}
[class*="shLifePick"] .btnLike.on {background-image:url(../../assets/images/smart/content/ico_like_check.svg);}
[class*="shLifePick"] .cate {font-size:1.4rem; color:#222; font-weight:500;}
[class*="shLifePick"].bbsView .thum {margin-bottom:30px;}
.shLifePickList > li:not(:first-child) {margin-top:30px;}
.shLifePickList .block {position:relative;}
.shLifePickList .block .btnLike {position:absolute; right:16px; bottom:16px;}
.shLifePickList .info {margin-top:12px;}
.shLifePickList .tit {display:-webkit-box; max-height:46px; margin-top:7px; color:#666; font-size:1.6rem; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}

/*================================================== 전자문서지갑 ==================================================*/

.qrCont {margin:12px 0 34px; text-align:center;}

.snsList {display:flex; justify-content:space-between; margin-top:40px;}
.snsList [class^=icoBtn_] {min-width:58px; padding-top:36px; font-size:1.4rem; color:#666; text-align:center;}
.notiBox .snsList {display:inline-flex;}
.notiBox .snsList [class^=icoBtn_] {margin:0 10px;}

.icoBtn_kk {background:url(../../assets/images/smart/common/ico_sns_kk.svg) no-repeat center top;}
.icoBtn_sms {background:url(../../assets/images/smart/common/ico_sns_sms.svg) no-repeat center top;}
.icoBtn_mail {background:url(../../assets/images/smart/common/ico_sns_mail.svg) no-repeat center top;}
.icoBtn_url {background:url(../../assets/images/smart/common/ico_sns_url.svg) no-repeat center top;}
.icoBtn_fb {background:url(../../assets/images/smart/common/ico_sns_fb.svg) no-repeat center top; background-size:32px;}
.icoBtn_tt {background:url(../../assets/images/smart/common/ico_sns_tt.svg) no-repeat center top; background-size:32px;}


.infoVisual.wallet {padding-right:24px; background:#715deb;}
.infoVisual.wallet [class^=tit] {font-size:2.4rem;}
.infoVisual.wallet [class^=btn_] {color:#5642bf; border-color:#fff;}
.infoVisual.wallet .img {position:static; margin-top:0; margin-right:-24px; text-align:right; transform:none;}
.infoVisual.wallet .img img {max-width:280px;}
.infoVisual.wallet .desc {font-size:1.6rem;}

.infoVisual.myWallet .icoBtn_alarm {position:absolute; top:82px; right:24px; width:24px; height:24px; background:url(../../assets/images/smart/content/ico_wallet_alarm.svg) no-repeat center top;}
.infoVisual.myWallet > .btnGroup {gap:0 16px; margin-top:26px;}
.infoVisual.myWallet > .btnGroup [class^=btn_] {display:flex; justify-content:center; align-items:flex-start; height:96px; margin:0; padding-top:56px; color:#fff; font-size:1.6rem; border-radius:8px;}
.infoVisual.myWallet > .btnGroup [class^=btn_].new {background:#715deb url(../../assets/images/smart/content/ico_wallet_new.svg) no-repeat center 20px;}
.infoVisual.myWallet > .btnGroup [class^=btn_].add {background:#5d88fb url(../../assets/images/smart/content/ico_wallet_address.svg) no-repeat center 20px;}
.infoVisual.myWallet .swiperWrap {padding-bottom:24px; margin:0 -24px -12px;}
.infoVisual.myWallet .swiper-slide {padding-left:24px; padding-right:24px;}
.infoVisual.myWallet .swiper-controls {bottom:-5px;}
.infoVisual.myWallet .swiper-pagination-bullet-active:before {background-color:#fff;}
.infoVisual.myWallet .infoBox {margin-bottom:0;}
.infoVisual.myWallet .infoBox [class^=tit] {margin-bottom:20px; font-size:1.6rem; font-weight:500;}
.infoVisual.myWallet .infoBox .btnGroup {margin-top:16px;}
.infoVisual.myWallet .noData {position:relative; font-size:1.6rem; font-weight:300; color:#fff; border-radius:8px; background:#656177;}
.infoVisual.myWallet .noData:before {content:""; position:absolute; top:45px; left:50%; width:72px; height:72px; background:#fff url(../../assets/images/smart/content/msg_no_wallet.svg) no-repeat 50% 50%; border-radius:50%; transform:translateX(-50%);}

.titVisual {display:flex; justify-content:space-between; align-items:flex-end;}
.titVisual .titArea {margin:0; padding-right:15px; word-break:keep-all;}
.titVisual .titArea > [class*=titH] {width:100%; margin-bottom:18px !important;}

.documentList > li {position:relative; display:flex; flex-direction:column; justify-content:center; min-height:72px; padding:10px 60px 10px 72px; border:1px solid #eee; border-radius:10px; background-image:url(../../assets/images/smart/content/ico_lock_p.svg); background-repeat:no-repeat; background-position:left 25px bottom 50%;}
.documentList > li + li {margin-top:8px;}
.documentList .date {margin-bottom:3px; color:#959595; font-size:1.3rem;}
.documentList .tit {color:#222; font-size:1.4rem; font-weight:500;}
.documentList .icoBtn_del {position:absolute; top:50%; right:22px; width:16px; height:16px; background-color:#666; border-radius:50%; transform:translateY(-50%);}
.documentList .icoBtn_del:before,
.documentList .icoBtn_del:after {background-color:#fff; height:50%;}

.notiBox.bgBlue .openNum {display:block; padding:5px 0 20px; color:#5642bf; font-size:2.4rem; font-weight:500; letter-spacing:2px;}
.notiBox.bgBlue .openNum + .snsList {margin:0; padding:25px 0 20px; border-top:1px solid #d4e0fe;}

/* 전자문서발급 - 납부자정보 */
.bottomSheet .notiBox.lineGray.payerInfo > .infoList:not(.half) li{padding:5px 0; border-bottom:none;}

.notiBox.lineGray.payerInfo {margin-top:25px; border:1px solid #ddd; border-radius:10px;}
.notiBox.lineGray.payerInfo .infoHead:after {content:''; display:block; clear:both;}
.notiBox.lineGray.payerInfo .infoHead .val {float:left; font-size:1.8rem;}
.notiBox.lineGray.payerInfo .infoHead .addInfo {float:right; margin-top:4px; font-size:1.3rem;}
.notiBox.lineGray.payerInfo .infoList {padding-top:12px;}
.notiBox.lineGray.payerInfo .infoList .item{font-size:1.3rem;}
.notiBox.lineGray.payerInfo .infoList .val{font-weight:300;}
.notiBox.lineGray.payerInfo .infoList + .btn_s.m {min-height: 35px; color: #445fe6; font-size: 1.4rem; background: #f8f8f8; border: none;}

/* 전자문서발급 - 정보입력(운전경력증명서) */
.txtIpt {font-size:1.4rem;}
.txtIpt .iptGroup {display:inline-block; margin:-4px 3px 0;}
.txtIpt .iptWrap{display:inline-block; width:78px; height:35px; margin:0;}
.txtIpt .iptWrap .ipt {height:35px;}
.txtIpt .iptWrap span.unit {color:#222; font-size:1.4rem;}
/*================================================== 마이 페이지 ==================================================*/
.icoBtn_setup {width:25px; height:25px; background-image:url(../../assets/images/smart/content/ico_btn_setup.svg); background-position:center center; vertical-align:sub;}

.myPage {padding:0 24px !important; background-color:#f8f8f8;}
.myPage .topVisual {margin:0 -24px 0; padding:70px 24px 26px;}
.myPage .userInfo {height:130px; margin:0 -24px; padding:0 140px 20px 24px; background:url(../../assets/images/smart/content/mypage_visual.svg) no-repeat right bottom; background-size:190px auto; color:#222; font-size:2.0rem; font-weight:500; word-break:keep-all;}
.myPage .userInfo .copy {color:#666; font-size:1.8rem; font-weight:300;}
.myPage .diseaseArea {margin-bottom:16px; padding:14px 15px 16px; border-radius:10px; background-color:#fff;}
.myPage .diseaseArea .copy {margin:0 -15px 8px; padding:0 14px 11px; border-bottom:1px solid #f8f8f8; color:#00a3bb; font-size:1.4rem; text-align:center;}
.myPage .diseaseArea .tip {margin-top:-3px;}
.myPage .diseaseArea .tipWrap .icoBtn_tip {border-color:#00a3bb; background-color:#00a3bb;}
.myPage .diseaseArea .tipWrap .icoBtn_tip:after {color:#fff;}
.myPage .diseaseArea .btn_s.s {border:0;}
.myPage .diseaseArea .btn_s.s > span {padding-left:20px; background:url(../../assets/images/smart/content/mypage_btn_srch.svg) no-repeat 0 center;}
.myPage .hashtagGroup {/*display:-webkit-flex; display:flex; align-items:center; justify-content:center;*/ margin:15px -15px 0; padding:0 14px; text-align:center; white-space:nowrap; overflow-x:auto; overflow:auto; scroll-snap-type:x mandatory; scroll-padding:19px; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory;}
.myPage .hashtagGroup button {display:inline-block; height:28px; margin:0 4px; padding:1px 10px 0; border-radius:14px; background-color:#f8f8f8; color:#888; font-size:13px; -webkit-flex:none; flex:none; align-items:start; justify-content:start; scroll-snap-align:start;}

.myPage .accoList {margin-bottom:0; border-top:0;}
.myPage .accoList .accoHead {margin-right:-24px; padding:20px 57px 20px 0; color:#222;}
.myPage .accoList .accoHead h2,
.myPage .accoList .accoHead [class^=titH] {display:inline-block; margin:0; color:inherit; font-size:1.8rem; font-weight:500;}
.myPage .accoList .accoHead .val {padding-top:2px; float:right; font-size:1.4rem;}
.myPage .accoList .accoHead .val > span {font-size:1.3rem; font-weight:300; opacity:.93;}
.myPage .accoList .accoHead .val > em {font-size:1.6rem;}
.myPage .accoList .accoHead .icoBtn_acco {right:24px; top:22px; width:24px; height:24px; border:1px solid rgba(0, 0, 0, .2); border-radius:50%; transform:none;}
.myPage .accoList .accoHead .icoBtn_acco:after {width:8px; height:8px; margin-top:-2px; opacity:.5;}
.myPage .accoList .accoItem.on > .accoHead .icoBtn_acco:after {margin-top:2px; border-color:#222; opacity:1;}
.myPage .accoList .accoBody {padding:0 0 40px; background-color:transparent;}
.myPage .accoList .titH4 {margin:30px 0 10px;}
.myPage .accoList .titArea .links.arrow {font-size:1.4rem; color:#666;}
.myPage .accoList .titArea .links.arrow::before {border-color:#666;}
.myPage .accoList .block:not(.bgColor01) {display:block; padding:23px; border-radius:10px; background-color:#fff;}
.myPage .accoList > li {margin-top:-10px; padding:0 24px 10px; border-bottom:0; border-radius:10px 10px 0 0; background-color:#fff; overflow:hidden;}
.myPage .accoList > li.insu {background-color:#5d88fb;}
.myPage .accoList > li.insu .accoHead .total {opacity:.93;}
.myPage .accoList > li.loan {background-color:#715def;}
.myPage .accoList > li.insu-money {background-color:#00a3bb;}/* 230216 보험금 추가, 230222 재수정 */
.myPage .accoList > li.insu .accoHead,
.myPage .accoList > li.insu-money .accoHead,/* 230216 보험금 추가 */
.myPage .accoList > li.loan .accoHead {color:#fff;}
.myPage .accoList > li.insu .accoHead .icoBtn_acco,
.myPage .accoList > li.insu-money .accoHead .icoBtn_acco,/* 230216 보험금 추가 */
.myPage .accoList > li.loan .accoHead .icoBtn_acco {border-color:rgba(255, 255, 255, .3);}
.myPage .accoList > li.insu .accoHead .icoBtn_acco:after,
.myPage .accoList > li.insu-money .accoHead .icoBtn_acco:after,/* 230216 보험금 추가 */
.myPage .accoList > li.loan .accoHead .icoBtn_acco:after {border-color:#fff !important; opacity:1;}
.myPage .accoList > li.insu .titH4,
.myPage .accoList > li.insu-money .titH4,/* 230216 보험금 추가 */
.myPage .accoList > li.loan .titH4 {color:#fff; font-size:1.6rem;}
.myPage .accoList > li.notice.on .newMsg {display:none;}
.myPage .accoList > li.notice .newMsg {height:28px; margin:11px -41px 4px -8px; padding:4px 10px 0 35px; border-radius:14px; background:#f2fafc url(../../assets/images/smart/content/mypage_ico_msg_new.svg) no-repeat 17px center; color:#00a3bb; font-size:1.3rem; font-weight:300; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; transition:all 0.5s ease-out;}
.myPage .accoList > li.benefit {box-shadow:0 -4px 5px rgba(0,0,0,0.1);}
.myPage .accoList > li.benefit .accoHead .val {font-weight:500;}
.myPage .accoList > li:only-child.benefit {box-shadow:none;}

.myPage .block p {margin-bottom:10px; color:#222; font-size:1.4rem;}
.myPage .block .tit {display:-webkit-box; height:45px; font-size:1.4rem; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.myPage .moneyArea {color:#222; font-size:1.4rem; font-weight:500; line-height:1.4;}
.myPage .moneyArea em {font-size:1.6rem; vertical-align:baseline;}
.myPage .money {font-size:1.6rem; font-weight:500;}
.myPage .money em {display:inline-block; padding:0 2px 5px; font-size:1.8rem; font-weight:500; vertical-align:middle;}

.myPage .myLevel {display:flex; align-items:center; min-height:88px; padding:22px 22px 22px 82px; font-size:1.3rem; color:#222; border-radius:8px; border:1px solid #eee; background:url(../../assets/images/smart/content/Ico_level_rating.svg) no-repeat 19px 50%; box-shadow:4px 4px 16px rgba(235,235,235,0.6);}

.myPage .myPoint {padding:24px 5px 22px; text-align:center; border-radius:8px; background:#f7f9ff;}
.myPage .myPoint .val {font-size:2.3rem; color:#445fe6; font-weight:500;}
.myPage .myPoint .txtItem {padding-top:20px;}
.myPage .myPoint .txtItem > *:before {border-color:#dee6ff;}
.myPage .myPoint .links {margin:0 10px; font-size:1.3rem; color:#666;}
.myPage .myPoint .links:after {display:none;}


.shlifeBanner {display:block; margin-bottom:16px; font-size:1.3rem; text-align:center; color:#666;}
.shlifeBanner span {display:inline-block; padding:4px 0;}
.shlifeBanner em {display:inline-block; min-height:22px; padding-left:27px; color:#445fe6; background:url(../../assets/images/smart/content/ico_mypage_shinhanplus.svg) no-repeat 0 50%;}

.myPrdList {margin:0 -24px; padding-bottom:32px;}
.myPrdList .swiper-slide {padding:0 24px;}
.myPrdList button.swiper-pagination-bullet:before {background-color:rgba(255, 255, 255, .5);}
.myPrdList button.swiper-pagination-bullet-active:before {background-color:rgba(255, 255, 255, 1);}
.myPrdList .block {position:relative; padding-top:19px !important; color:#fff;}
.myPrdList .block a {color:#fff;}
.myPrdList .flag_prd3 {height:auto; margin:0; padding:0; background-color:transparent; color:#fff !important; font-weight:300 !important; line-height:1.2;}
.myPrdList .moneyArea {margin-bottom:17px; color:#fff; font-size:1.3rem; font-weight:300; text-align:center;}
.myPrdList .moneyArea > div:not(.money) {opacity:.93;}
.myPrdList .moneyArea em {font-size:1.3rem; font-weight:300;}
.myPrdList .money {color:#fff !important; font-size:1.8rem;}
.myPrdList .money .item {font-size:1.4rem; font-weight:300; opacity:.93;}
.myPrdList .money em {font-size:2.4rem; font-weight:500;}
.myPrdList .btn_s.s {border-color:transparent;}
.myPrdList .block > .btnGroup {margin:0;}
.myPrdList .block .con p {margin-bottom:0; color:#fff !important; text-align:center;}
.myPrdList:not(.swiperWrap) {margin:0; padding-bottom:50px;}

/* 보험 */
.myPage .insu .myPrdList .block {background-color:#5072f0 !important; text-align:center;}
.myPage .insu .myPrdList .tit {margin-bottom:12px;}
.myPage .insu .myPrdList .tit > span {color:#fff; opacity:.93;}
.myPage .insu .myPrdList .money {margin-bottom:12px;}
.myPage .insu .myPrdList .graphAni {position:relative; width:100%; height:12px; margin-bottom:20px; background-color:rgba(255, 255, 255, .2);}
.myPage .insu .myPrdList .graphAni::before {content:''; position:absolute; left:0; top:0; width:100%; height:12px; background:url(../../assets/images/smart/content/mypage_insu_graph_bar_bg.png) repeat 0 0; background-size:4px 1px; z-index:1;}
.myPage .insu .myPrdList .graphAni > .bar {display:inline-block; position:absolute; left:0; top:0; width:0; height:12px; background-color:#87deff; transition: width 0.45s ease-in-out;}
.myPage .insu .myPrdList .graphAni:not(.aniOn) > .bar {width: 0% !important;}

.block.chartArea {margin-bottom:20px;}
.block.chartArea .titH4 {margin:5px 0 15px; color:#222 !important; text-align:center;}
.block.chartArea .info {margin-bottom:18px; color:#959595; font-size:1.2rem; text-align:right;}
.block.chartArea .info > span {display:inline-block; position:relative; margin-left:7px; padding-left:13px;}
.block.chartArea .info > span::before {content:''; position:absolute; left:0; top:50%; width:8px; height:8px; border-radius:1px; background-color:#ddd; transform:translateY(-50%);}
.block.chartArea .info > span.my::before {background-color:#40bacc;}
.block.chartArea .copy {margin-bottom:20px; color:#666; font-size:1.4rem; text-align:center;}
.block.chartArea .copy em {color:#e9473f;}
.block.chartArea .chart {overflow-x:auto;}
.comparison {margin:25px 0 19px; text-align:center;}
.comparison > div {display:inline-block; position:relative; width:80px; height:140px; margin-bottom:25px;}
.comparison span {position:absolute;left:0; bottom:-25px; width:100%; font-size:1.2rem;}
.comparison .bar {position:absolute; left:20px; bottom:0; width:40px; max-height:100% !important; margin:0 auto; border-radius:3px; background-color:#ccc; transition: height 0.75s ease-in-out}
.comparison .barAni:not(.aniOn) {height: 0% !important;}
.comparison .average .bar {height:100%; background-color:#ccc;}
.comparison .my.lack .bar {height:0; background-color:#e9473f;}
.comparison .my.suff .bar {height:0; background-color:#00a3bb;}
.comparison .my.lack .bar::after,
.comparison .my.suff .bar::after {content:''; position:absolute; left:50%; top:-16px; width:24px; height:24px; background-size:cover; transform:translateX(-50%);}
.comparison .my.lack .bar::after {background-image:url(../../assets/images/smart/content/mypage_comparison_lack.svg);}
.comparison .my.suff .bar::after {background-image:url(../../assets/images/smart/content/mypage_comparison_suff.svg);}
.comparison .my.before {width:165px; height:163px; margin-top:-23px;}
.comparison .my.before .bar {left:0; width:100%; height:100%; background:url(../../assets/images/smart/content/mypage_comparison_before.svg) no-repeat center center; background-size:cover;}

.ingInsu {display:-webkit-flex; display:flex; margin:0 -24px; padding:0 20px; overflow:auto; scroll-snap-type:x mandatory; scroll-padding:20px; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory;}
.ingInsu > li {display:block; float:none; width:100%; padding:0 4px; -webkit-flex:none; flex:none; align-items:start; justify-content:start; scroll-snap-align:start;}
.ingInsu > li:last-child {width:calc(100% + 20px); padding-right:24px;}
.ingInsu .block {padding:21px 23px 19px !important;}
.ingInsu .block .tit {margin-bottom:2px; color:#222;}
.ingInsu .state {margin-bottom:8px;}
.ingInsu time {color:#666; font-size:1.2rem;}
.ingInsu .money {margin:-3px 0 -5px; color:#222; text-align:right;}

.writingBanner {margin:20px 0 -15px; padding:5px 0; color:#fff; font-size:14px; text-align:center;}
.writingBanner .inner {display:inline-block; margin:0 auto; text-align:left;}
.writingBanner .inner::after {display:block; content:''; clear:both;}
.writingBanner .inner img {float:left;}
.writingBanner .con {float:right; padding-left:15px;}
.writingBanner p {display:block; margin-bottom:2px;}
.writingBanner .links {margin:0; color:#fff; font-size:14px; opacity:.7;}
.writingBanner .links.arrow::before {border-color:#fff;}

/* 대출 */
.myPage .loan .myPrdList .block {background-color:#00b2bc !important;}

.myPage .loan .block p {color:#666; font-size:1.3rem;}
.myPage .loan .money {color:#445fe6;}
.myPage .loan .block > .easyFast {background-image:url(../../assets/images/smart/content/mypage_easyfast_ico_1.svg); background-repeat:no-repeat; background-position:right 0 bottom 49px;}
.myPage .loan .block > .easyFast:nth-child(2) {margin-top:23px; padding-top:22px; border-top:1px solid #f8f8f8; background-image:url(../../assets/images/smart/content/mypage_easyfast_ico_2.svg);}
.myPage .loan .block > .easyFast:nth-child(2) .money {color:#00a3bb;}
.myPage .easyFast .btnGroup {margin:13px 0 0 !important;}
.recommLoan {display:-webkit-flex; display:flex; margin:0 -24px; padding:0 20px; overflow:auto; scroll-snap-type:x mandatory; scroll-padding:20px; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory;}
.recommLoan > li {display:block; float:none; width:100%; padding:0 4px; -webkit-flex:none; flex:none; align-items:start; justify-content:start; scroll-snap-align:start;}
.recommLoan > li:last-child {width:calc(100% + 20px); padding-right:24px;}
.recommLoan > li > .block {padding:21px 23px 19px !important; background-image:url(../../assets/images/smart/content/mypage_recomm_ico_1.svg); background-repeat:no-repeat; background-position:right 24px bottom 27px;}
.recommLoan > li:nth-child(3n+2) > .block {background-image:url(../../assets/images/smart/content/mypage_recomm_ico_2.svg);}
.recommLoan > li:nth-child(3n+3) > .block {background-image:url(../../assets/images/smart/content/mypage_recomm_ico_3.svg);}

.myPage .loan .tabList.subTab {border-bottom:0; background-color:#5642bf;}
.myPage .loan .tabList.subTab > li {color:#fff; opacity:.93;}
.myPage .loan .tabList.subTab > li.on {border-color:transparent; opacity:1;}
.myPage .loan .tabList.subTab > li.on::after {background-color:rgba(0,0,0,0.2);}
.myPage .loan .point {margin-bottom:27px; background-image:url(../../assets/images/smart/content/mypage_loan_point_1.svg); background-repeat:no-repeat; background-position:right 0 bottom 7px;}
.myPage .loan .point p {margin-bottom:18px; color:#fff;}
.myPage .loan .point .moneyArea > div:not(.money) {display:inline-block; height:28px; margin-bottom:4px; padding:6px 10px 0; border-radius:14px; background-color:#fff; color:#666; font-size:1.3rem;}
.myPage .loan .point .moneyArea > div:not(.money) em {font-size:1.3rem;}
.myPage .loan .point .money {color:#fff; font-size:2.0rem;}
.myPage .loan .point .money em {font-size:2.8rem;}
.myPage .loan .tabPanel:nth-child(2) .point {background-image:url(../../assets/images/smart/content/mypage_loan_point_2.svg);}
.myPage .loan .tabPanel:nth-child(3) .point {background-image:url(../../assets/images/smart/content/mypage_loan_point_3.svg);}
.myPage .loan .tabPanel .txtList {margin:-5px 0 0; color:#222; font-weight:500;}
.myPage .loan .tabPanel .txtList > li:not(:first-child) {margin-bottom:16px; padding-top:15px; border-top:1px solid #f8f8f8;}
.myPage .loan .tabPanel .txtList p {padding-top:2px; color:#666; font-size:1.4rem; font-weight:300;}
.myPage .loan .tabPanel .txtList p em {color:#5642bf;}

.graphBox {margin:15px 0;}
.graphBox img {max-width:100%; width:176px; height:auto;}

/* 보험금 230216 추가 230222 재수정 (s) */
.myPage .insu-money .subtitle {padding-bottom: 25px;}
.myPage .insu-money .subtitle p {color:#fff;}
.myPage .insu-money .listbox {display:flex; justify-content: space-between;}
.myPage .insu-money .listbox li {flex-grow:1;}
.myPage .insu-money .listbox li:first-child {margin-right:15px;}
.myPage .insu-money .listbox li a {display: block; width: 100%; border-radius: 10px; padding: 20px 18px; color: #cddef5; font-size: 1.3rem;}
.myPage .insu-money .listbox li:first-child a {background: url(../../assets/images/smart/content/mypage_insu_money_receipt_ico.svg) #008da3 no-repeat right 18px center; background-size: 42px;}
.myPage .insu-money .listbox li:nth-child(2) a {background: url(../../assets/images/smart/content/mypage_insu_money_process_ico.svg) #008da3 no-repeat right 18px center; background-size: 42px;}
.myPage .insu-money .listbox li a span {display: block; color: #fff; font-size: 1.6rem; font-weight: 500;}
/* 보험금 230216 230222 재수정 추가 (e) */

/* 알림리스트 */
.noticeList {position:relative; padding-left:32px;}
.noticeList::before {content:''; position:absolute; left:11px; top:10px; bottom:0; border-left:2px dotted #e5e5e5;}
.noticeList > li {position:relative; padding-top:24px;}
.noticeList > li:first-child {padding-top:0;}
.noticeList > li:first-child .item {top:1px;}
.noticeList > li:last-child::before {content:''; position:absolute; left:-21px; top:24px; bottom:0; width:2px; background-color:#fff;}
.noticeList time {font-size:1.3rem; opacity:.7;}
.noticeList .item {display:inline-block; position:absolute; left:-32px; top:25px; width:24px; height:24px; border-radius:50%; background-image:url(../../assets/images/smart/content/mypage_notice_ico_basic.svg); background-color:#ccc; background-position:center center; background-size:cover; color:transparent; overflow:hidden;}
.noticeList .item.insu {background-image:url(../../assets/images/smart/content/mypage_notice_ico_insu.svg);}
.noticeList .item.loan {background-image:url(../../assets/images/smart/content/mypage_notice_ico_loan.svg);}
.noticeList .item.certi {background-image:url(../../assets/images/smart/content/mypage_notice_ico_certi.svg);}
.noticeList > li.new .item {background-color:#715deb;}
.noticeList .cont {position:relative; margin-top:3px; padding:14px 24px 14px 16px; border-radius:0 10px 10px 10px; background-color:#f8f8f8; color:#959595; font-size:13px;}
.noticeList .cont p {margin-top:6px; color:#666; font-size:14px;}
.noticeList .cont p + small {display:block; text-align:right; font-size:12px;}
.noticeList .cont.hasLink::after {content:''; position:absolute; right:17px; top:50%; width:8px; height:8px; border:1px solid #999; border-width:0 1px 1px 0; box-sizing:border-box; transform:translateY(-50%) rotate(-45deg);}

.myPage li.notice .linkGroup {margin-top:15px; text-align:center;}
.myPage li.notice .linkGroup .links {margin:0 8px; color:#666;}

/* myPage Loading */
.myPage .nowLoading .myPrdList,
.myPage .nowLoading .ingInsu,
.myPage .nowLoading .recommLoan {margin:0;}
.myPage .nowLoading .myPrdList > *,
.myPage .nowLoading .chartArea > *,
.myPage .nowLoading .tabList > *,
.myPage .nowLoading .tabPanel .block > *,
.myPage .nowLoading.loan .accoBody > .block > *,
.myPage .nowLoading.loan .point .money,
.myPage .nowLoading.loan .tabList.subTab > li:after,
.myPage .nowLoading.loan .easyFast .btnGroup > * {position:relative; background-color: rgba(255,255,255,0.05) !important; background-image:none !important; color: rgba(255,255,255,0) !important; border: none !important; opacity: 1 !important; overflow: hidden;}
.myPage .nowLoading .myPrdList > * > *,
.myPage .nowLoading .chartArea > * > *,
.myPage .nowLoading .ingInsu > * > *,
.myPage .nowLoading .accoHead .val > * > *,
.myPage .nowLoading .writingBanner > * > *,
.myPage .nowLoading.insu .accoHead .total,
.myPage .nowLoading.loan .accoBody > .block > * > *,
.myPage .nowLoading.loan .tabPanel .txtList > * {opacity: 0 !important;}
.myPage .nowLoading .chartArea,
.myPage .nowLoading .ingInsu,
.myPage .nowLoading .accoHead .val,
.myPage .nowLoading .recommLoan,
.myPage .loan.nowLoading .accoBody > .block,
.myPage .nowLoading .writingBanner,
.myPage .nowLoading .accoBody .titH4,
.myPage .nowLoading .tabPanel .block,
.myPage .nowLoading.loan .tabList.subTab {background-color: rgba(255,255,255,0.05) !important; background-image: none !important; border: none !important;}
.myPage .nowLoading .accoHead .val,
.myPage .nowLoading .accoBody .titH4 {display:inline-block; color: rgba(255,255,255,0) !important; background-image: none !important; border: none !important;}
.myPage .nowLoading.loan .point p,
.myPage .nowLoading.loan .block p,
.myPage .nowLoading.loan .money,
.myPage .nowLoading.loan .point .money {display:inline-block; color: rgba(255,255,255,0) !important; background-color: rgba(255,255,255,0.05) !important;}
.myPage .nowLoading .accoHead .val, 
.myPage .nowLoading .accoBody .titH4,
.myPage .nowLoading.loan .money,
.myPage .nowLoading .ingInsu,
.myPage .nowLoading .writingBanner,
.myPage .nowLoading .tabList,
.nowLoading.loan .block .easyFast p {position:relative; overflow: hidden;}
.myPage .nowLoading.loan .point {background-image: none !important;}
.myPage .nowLoading .swiperWrap {max-height: 30px; overflow: hidden;}
.myPage .nowLoading .recommLoan,
.myPage .nowLoading .ingInsu,
.myPage .nowLoading .swiper-controls {display: none;}

.myPage .nowLoading .accoHead .val:before, 
.myPage .nowLoading .accoBody .titH4:before,
.myPage .nowLoading .myPrdList > *:before,
.myPage .nowLoading .chartArea > *:before,
.myPage .nowLoading .tabList:before,
.myPage .nowLoading.loan .accoBody > .block > *:before,
.myPage .nowLoading.loan .point .money:before,
.myPage .nowLoading.loan .money:before,
.myPage .nowLoading.loan .tabList.subTab:before,
.myPage .nowLoading .writingBanner:before,
.myPage .nowLoading.loan .easyFast .btnGroup > *:before,
.nowLoading.loan .block .easyFast p:before {content: ''; position: absolute; top: 0; left: 120px; bottom: 0px; width: 15px; background-color: #5d88fb; box-shadow: 0 0 20px 20px #5d88fb; z-index: 10; opacity:0.6; transform:skew(-10deg, 0); animation: mypageloading 1.8s infinite;}

.myPage .nowLoading .accoHead .val:before, 
.myPage .nowLoading .accoBody .titH4:before,
.nowLoading.loan .block .easyFast p:before {animation-duration: 1.3s; opacity: 0.8;}

.myPage .nowLoading.loan .accoHead .val:before, 
.myPage .nowLoading.loan .accoBody .titH4:before,
.myPage .nowLoading.loan .myPrdList > *:before,
.myPage .nowLoading.loan .chartArea > *:before,
.myPage .nowLoading.loan .tabList:before,
.myPage .nowLoading.loan .accoBody > .block > *:before,
.myPage .nowLoading.loan .point .money:before,
.myPage .nowLoading.loan .money:before,
.myPage .nowLoading.loan .tabList.subTab:before,
.myPage .nowLoading.loan .easyFast .btnGroup > *:before,
.nowLoading.loan .block .easyFast p:before {background-color: #715def; box-shadow: 0 0 20px 20px #715def; opacity: 0.4}
@keyframes mypageloading {
	0% {left:-100%;}
	100% {left:120%;}
}
/*
.myPage .nowLoading .accoBody:before {content: ''; position: absolute; top: 0; left: 120px; bottom: 30px; width: 15px; background-color: #5d88fb; box-shadow: 0 0 20px 20px #5d88fb; z-index: 10; opacity:0.4;animation: mypageloading 1.5s infinite;}
.myPage .nowLoading.loan .accoBody:before {background-color: #47435d; box-shadow: 0 0 20px 20px #47435d;}
@keyframes mypageloading {
	0% {left:-100%;}
	100% {left:120%;}
}*/


/* 이벤트 */
.eventSlider {margin:0; padding:0;}
.eventSlider .swiper-slide > a {display:block; position:relative;}
.eventSlider .swiper-slide > a:focus::before {content:''; position:absolute; left:0; right:0; top:0; bottom:0; border:2px solid rgba(0, 0, 0, .6); background-color:transparent;}
.eventSlider .swiper-controls {bottom:20px;}
.eventSlider button.swiper-pagination-bullet:before {background-color:rgba(255, 255, 255, .5);}
.eventSlider button.swiper-pagination-bullet-active:before,
.eventSlider .swiper-button-stop:before,
.eventSlider .swiper-button-stop:after {background-color:rgba(255, 255, 255, 1);}
.eventSlider .swiper-button-play:after {border-left-color:#fff;}
.myPage .eventSlider {margin:0 -24px 30px;}
.myPage .eventSlider .swiper-slide {padding:0 24px;}
.myPage .eventSlider .swiper-slide > a {border-radius:9px; overflow:hidden;}
.myPage .eventSlider .swiper-controls {bottom:12px;}

/* 운세/사주 */
.fortuneBtn {position:relative; width:128px; height:144px; padding:23px; border:1px solid #eee; border-radius:9px; background-color:#fff; color:#666; font-size:1.4rem; text-align:left;}
.fortuneBtn > img {position:absolute; left:25px; top:25px;}
.fortuneBtn > span {display:inline-block; position:absolute; left:23px; bottom:23px;}
.fortuneList {display:-webkit-flex; display:flex; margin:0 -24px; padding:0 20px; overflow:auto; scroll-snap-type:x mandatory; scroll-padding:20px; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory;}
.fortuneList > li {display:block; float:none; padding:0 4px; -webkit-flex:none; flex:none; align-items:start; justify-content:start; scroll-snap-align:start;}
.fortuneList > li:last-child {width:calc(128px + 28px); padding-right:24px;}

/* 링크 묶음 */
.myPage .arwBtnList {margin:0 0 16px; padding:0 12px 0 24px; border-radius:8px; background-color:#fff;}
.myPage .arwBtnList .icoBtn_arrow:after {width:7px; height:7px;}
.myPage .accoList .arwBtnList {margin-top:15px; padding:0; border-radius:0;}

.digitalBanner {display:flex; flex-wrap:nowrap; margin-bottom:16px; padding:23px 24px 22px; border-radius:8px; background-color:#fff; color:#333; font-size:14px; align-items:flex-end; justify-content:space-between;}
.digitalBanner .con {flex-grow:1; padding-right:20px;}
.digitalBanner .tit {display:block; margin-bottom:3px; color:#445fe6; font-size:16px; font-weight:500;}
.digitalBanner p {word-break:keep-all;}

.digitalBanner.mbWeb {display:block; text-align:center;}
.digitalBanner.mbWeb .con {padding:0; text-align:left;}
.digitalBanner.mbWeb .tit {color:#222;}
.digitalBanner.mbWeb .btn_g {margin-top:20px;}

.digitalBanner.noDataVer {flex-wrap: wrap;}
.digitalBanner.noDataVer .tit {margin-bottom:20px; flex-grow:2; text-align: center;}
.digitalBanner.noDataVer .con {width: 70%;}



/* 모바일 웹 */
.myPage .accoList.mbWeb {margin-top:-26px;}
.myPage .accoList.mbWeb .tabWrap {margin:0 -24px -10px;}
.myPage .accoList.mbWeb .tabList {margin:0; padding-left:12px;}
.myPage .accoList.mbWeb .tabList > li {width:auto; height:65px; padding:0 12px; color:#fff; opacity:.93;}
.myPage .accoList.mbWeb .tabList > li.on {opacity:1;}
.myPage .accoList.mbWeb .tabList > li.on:after {left:11px; right:11px; bottom:15px; height:2px; background-color:#fff;}
.myPage .accoList.mbWeb .tabList > li em {display:inline-block; margin-left:3px;}
.myPage .accoList.mbWeb .tabContents {margin:-66px 0 0;}
.myPage .accoList.mbWeb .tabPanel {padding:65px 24px 50px;}
.myPage .tabPanel.insu {background-color:#5d88fb;}
.myPage .tabPanel.loan {background-color:#715def;}
.myPage .tabPanel.loan .btn_s.s {color:#5642bf;}
.myPage .tabPanel.loan .myPrdList .caution {position:absolute; right:23px; top:23px; padding-left:19px; color:#fff; font-size:1.3rem; opacity:.93;}
.myPage .tabPanel.loan .myPrdList .caution::before {content:'!'; position:absolute; left:0; top:3px; width:14px; height:14px; border:1px solid #fff; border-radius:50%; color:#fff; font-size:11px; line-height:14px; text-align:center; box-sizing:border-box;}
.myPage .tabPanel.loan .point {margin-bottom:0; padding:23px; border-radius:10px; background-color:#00b2bc; background-position:right 23px bottom 80px; background-size:42px auto;}
.myPage .tabPanel.loan .point p {font-size:1.4rem;}
.myPage .tabPanel.loan .point .money {font-size:1.8rem; text-align:left;}
.myPage .tabPanel.loan .point .money em {font-size:2.4rem;}
.myPage .tabPanel.loan .point .btn_s.s {margin-top:12px; border:0;}

/*************************************************** media ***************************************************/
@media all and (min-width:768px) {
	/*================================================== 이벤트 템플릿 ==================================================*/
	/* 매일매일 퀴즈 이벤트 */
	.luckyQuizEv {padding-bottom:20%;}
	.luckyQuizEv > .inner {padding-top:83%;}

	/* 룰렛 게임 이벤트 */
	.rouletteEv {padding-top:65%;}

	/* 출석체크 이벤트 */
	.attendanceEv .missionArea {padding-top:71%;}
	.eventCalendar {width:660px;}

	.relatChange .iptWrap.other {display:inline-flex; width:70% !important;}
}

@media all and (max-width:360px) {
	.infoVisual.lg .img img,
	.imgCont:not(.full) img {max-width:100%;}
	.infoVisual.fund {background-size:100vw auto;}
	
	.infoBox .formBlock .iptWrap,
	.infoBox .formBlock .selectWrap {width:90px;}
	.infoBox .formBlock .ipt {padding:0 32px 0 10px;}

	.summary .infoList .item {padding-right:10px;}
	
	.infoRowList .val{font-size:1.6rem;}

	.moneyBox div.infoList .val em {font-size:1.8rem;}
	
	/* summaryCard */
	.summaryCard .graphAni {transform: scale(0.9);}
	
	/* 헬스톡 */
	.healthTalk .hiddenSD {display:none;}


	/*================================================== 이벤트 템플릿 ==================================================*/
	/* 룰렛 게임 이벤트 */
	.rouletteArea .board {left:6.9333%; right:6.9333%;}

	/* 출석체크 이벤트 */
	.attendanceEv .missionCheck {margin:0 -24px;}
	.eventCalendar {width:305px;}
	.eventCalendar > li {width:55px;}
}
@media all and (min-width:376px) {
	.setCard.security .ipt:last-of-type,
	.setCard.security .ipt:not(:last-of-type),
	.setCard.security .keypad {/*width:25%;*/}
}

@media all and (max-width:320px) {
	/* show, hide - small device */
	.hiddenSD {display:none !important;}
	
	/* common */
	.msgArea .copy {word-break:keep-all;}
	.msgArea .copy br,
	.msgArea .desc br {display:none;}
	
	.msgArea.charCeleb {padding-top:160px; background-size:272px auto;}
	
	.ipt {padding:0 9px;}
	select.ipt {padding:0 26px 0 9px; background-position:right 4px center;}
		
	.iptWrap .ipt[disabled],
	.iptWrap .ipt[readonly] {padding-right:9px;}

	.ipt.date,
	.ipt.month {display:inline-block; padding:0;}

	/* 마이페이지 */
		/* 보험금 230216 추가 media (s) */
	.myPage .insu-money .listbox li a {padding: 16px 13px;}
	.myPage .insu-money .listbox li:first-child a,
	.myPage .insu-money .listbox li:nth-child(2) a {background-size: 35px; background-position: right 10px center;}
		/* 보험금 230216 추가 media (s) */
		
	/* 보안키패드 */
	.ipt[type=password] {padding:0 9px 4px; letter-spacing:-0.12em;}
	
	/* 카드번호 보안키패드 */
	.setCard.security {flex-wrap:wrap;}
	.setCard.security .ipt,
	.setCard.security .keypad {width:calc(50% - 16px) !important;}
	.setCard.security .keypad .ipt {padding:0 20px 4px !important;}
	
	.setBtnAdd [class^=btn_].m {padding:5px 10px;}

	.infoList.half > li {display:table; float:none !important; width:100%; min-width:auto; padding:4px 0 5px; text-align:left !important;}
	.infoList.half > li > div {display:table-cell; vertical-align:middle;}
	.infoList.half .item.blind,
	.infoList.half .item .blind {position:static !important; width:auto; height:auto; margin:0; vertical-align:bottom; clip:unset; clip-path:none;}
	.infoList.half .name {display:table-cell;}
	.infoList.half .money.del {width:45%;}
	
	.infoList.total {margin-top:16px; padding:20px 16px !important;}
	
	/* 펀드 자동재배분 */
	.infoList.fund > div {padding-right:15px;}
	.infoList.fund .val {font-size:1.6rem;}

	.accoList .accoHead .infoList.half {margin-bottom:-11px;}
	.accoList.detail .accoHead .infoList.half > li:first-child .val {text-align:left;}
	.accoList.detail .accoHead .infoList.half > li:first-child .blind {position:absolute !important; width:1px; height:1px; margin:-1px; clip:rect(1px, 1px, 1px, 1px); clip-path:inset(50%);}

	.infoBox .state * + .info {margin-left:2px;}

	.formBlock .iptWrap,
	.formBlock .selectWrap {width:100px; margin:0;}
	.infoBox .formBlock .iptWrap {width:65px;}
	/* .infoBox .formBlock .iptWrap.on .icoBtn_del {display:none;} */
	.infoBox .formBlock .selectWrap {width:69px;}
	.infoBox .formBlock .ipt {padding:0 24px 0 4px;}

	.summaryTit {margin:12px 0 20px;}
	.summaryList {margin:0 -24px; padding:0 24px;}
	.summaryList .swiper-container {padding:0;}
	.summaryList .swiper-slide {padding:0 24px;}
	.summaryList .btnGroup {padding:0;}

	.relatChange {font-size:1.8rem;}
	
	/* 거래내역 */
	.transHistory .history > li .item {background-image:none; padding-left:0;}
	.transHistory .history > li .item.give {background-image:none; padding-left:0;}
	.transHistory .history > li .item .transInfo {width:80px}
	
	/* 혈당관리 */
	.transHistory .history.blood > li .item {background-image:none; padding-left:0;}
	
	/* 금액값 노출 */
	.moneyResult {padding:0;}

	/* 생명/보안카드 */
	.cardBox .state img {display:none;}

	.bottomSheet .infoPopup .btn_day {padding:0 12px;}

	/* 지점찾기 */
	.branchSrchArea .formList .iptGroup .ipt + label {font-size:14px; line-height:1.8;}
	

	/*================================================== 이벤트 템플릿 ==================================================*/
	/* 룰렛 게임 이벤트 */
	.rouletteArea .shadow {min-width:360px;}
	.rouletteArea .board {left:3.9333%; right:3.9333%;}
	
	/* 계좌 아코디언 */
	.contractInfoList .accoHead span {font-size:1.5rem}
	.contractInfoList .accoHead span:last-child {font-size:1.3rem}
}










/*================================================== 디지털보험 ==================================================*/
/*240227개정*/
.digital .prdIcon {padding:0;}
.digital .prdIcon .inner {text-align:center; padding:22px 24px;}
.digital .prdIcon .inner img {width:60px; margin:0px 10px;}
.icoList2 {margin: 60px -24px 0; font-size: 1.4rem;}
.icoList2 li {border-top: 1px solid #eee; color: #333; font-weight: 400;}
.icoList2 li a {color: #333; display: block; width: 100%; height: 100%; padding: 14px 60px 14px 24px; position: relative;}
.icoList2 li a:after {content: ''; position: absolute; left: auto; top: 50%; right: 25px; width: 11px; height: 11px; margin-top: -3px; border: 1px solid #222; border-width: 0 2px 2px 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(-45deg); -webkit-transition: all 0.25s; transition: all 0.25s;}
.digital.insuDetail .btnArea.sticky .selOpt {border-radius: 5px 5px 0px 0px;}
.digital.insuDetail .btnArea.sticky .selOpt {border-radius: 5px 5px 0px 0px; padding-top:8px;}
.digital.insuDetail .btnArea.sticky .selOpt >div {padding: 0px 10px 5px;}
.digital.insuDetail .btnArea.sticky .selOpt .setHalf .iptFilt {width: 86px; margin-right:0px; }
.digital.insuDetail .btnArea.sticky .selOpt .setHalf .iptWrap {width: 36%;}
.digital.insuDetail .btnArea.sticky .selOpt .setHalf .btn_p {min-height: 42px; margin-bottom: 0px; float: left; margin: 5px 0px; line-height: unset; width: calc(64% - 118px); font-size: 1.4rem;}


/* 메인상품 NEW 마크 */
/*.digital .digiPrdList > ul > li:nth-child(2) a {background-image: url(../../assets/images/cdi/content/newIcon.gif); background-repeat: no-repeat; background-size: 32px; background-position: right 8px top 8px;}
.digital .digiProduct.all .prdBlockList li:nth-child(2) a {overflow: hidden; background-image: url(../../assets/images/cdi/content/newIcon.gif); background-repeat: no-repeat; background-size: 35px;background-position: right 15px top 13px;}
.digital.main .digiProduct.all .prdBlockList li:nth-child(2) a img {margin-top: -28.6px;}
.digital .gnb #li0 .depth2 > li:nth-child(5) h3 a {background-image: url(../../assets/images/cdi/content/newIcon.gif); background-repeat: no-repeat; background-size: 38px; background-position: right 0px top 12px;} */
/*메인 타이틀로고 제어*/
/* .digital.main .header h1.logo > span {color: #ffffff !important;}	231014-디지털보험 수정요청 */
/*.digital.main .header:not(.sticky) .icoBtn_appMenu {background-image:url(../../assets/images/smart/common/app_ico_menu.svg) !important;}*/ /* 231014-디지털보험 수정요청 */
.digital .content .chkBtn.ok .btn_p {border-color: #dcd6fa; color: #dcd6fa; background-color: #ffffff;}
.digital .content .chkBtn .btn_p {border-color: #5642bf; color: #5642bf; background-color: #fff;}
.termsBox {overflow-y: auto; overflow-x: hidden; width: 100%; height: 75px; border: 1px solid #ccc; padding: 10px 20px; background-color: #f8f8f8; color: #666;}

/*.buttonBalloon{content:""; position:absolute; top:20px; bottom:-30px; left:12px; width:1px; background:url(../../assets/images/smart/content/bg_border_dotted.png) repeat-y 0 0;}

.buttonBalloon320 {position: relative;}
.buttonBalloon320 img {position: absolute; left: calc(52% - 84px); bottom: -23px;}
.buttonBalloon2 {position: relative;}
.buttonBalloon2 img {position: absolute; left: calc(52% - 84px); top: -18px;}*/


.buttonBalloon {position: relative;}
.buttonBalloon .buttonBalloonImg{position: absolute; left: 8px; bottom: 8px; max-width: 84px; width: calc(63% - 82px); animation-name: buttonBalloon; animation-duration: 3s; animation-iteration-count: infinite;}
@keyframes buttonBalloon {
				0% {left: 8px;}
				50% {left: 2px;}
				100% {left: 8px;}
			}
.buttonBalloon .buttonBalloonImg320 {position: absolute; display:none; left: calc(52% - 84px); bottom: -18px; width:100px;}
.buttonBalloon2 {position: relative;}
.buttonBalloon2 .buttonBalloonImg {position: absolute; max-width:70px; height:auto; width: calc(63% - 84px); bottom:18px; right: calc(50% + 50px);}
.buttonBalloon2 .buttonBalloonImg320 {position: absolute; left: -5px; top: -50px; width:120px; height:auto; }

.digital .titH1 {margin-bottom:15px;}
.digital .btnArea.sticky {bottom:0; width:auto; margin:32px -24px 0;}
.digital .btnArea.sticky [class^=btn_] {margin:0;}

/* 상품상세 보험료확이 버튼*/
.digital .btnArea.sticky.type2 [class^=btn_] {width: 35%; min-height:34px; line-height:34px; margin:4px 8px; }

.digital .tblInfo {margin-bottom:15px;}

.digital .tabWrap .tabList {margin-bottom:0;}

.digital .tabList {margin-bottom:25px;}
.digital .tabList.subTab {border-radius:0; border:1px solid #ddd; border-width:0 1px 0 1px; background-color:#fff;}
.digital .tabList.subTab > li {height:48px; border:1px solid #ddd; border-width:1px 1px 1px 0;}
.digital .tabList.subTab > li:last-child {border-right:0;}
.digital .tabList.subTab > li.on {color:#fff;}
.digital .tabList.subTab > li.on:after {top:-1px; bottom:-1px; left:-1px; right:-1px; height:auto; border-radius:0; background-color:#5d88fb;}

.digital .tabList.subTab.div_3 {border-width:1px 0 0 1px; border-color:#ddd; flex-wrap:wrap;}
.digital .tabList.subTab.div_3 li {width:calc(100% / 3); border-width:0 1px 1px 0;}
.digital .tabList.subTab.div_3 li:last-child {border-right:1px solid #ddd;}

.digital .swiperWrap button.swiper-pagination-bullet-active:before {background-color:#715deb;}

/*푸터 마크 추가*/
.digital .infoArea {position: relative;}
.digital .iconGroup {position: absolute; bottom: 0px; left: 242px;}
.digital .iconGroup a {display:block; width:100%; height:100%;}

/*청약 inputbox*/
.digital ul.termsWrap .accoBody > .inner {padding: 15px 18px;}
.digital hr {margin: 18px -24px 16px;}
.digital .cfrItem > .iptCheck {margin: 15px 0 0 0;}
.digital .subscription hr {margin: 18px -30px 16px;}
.digital .subscription hr.p {margin: 0px -30px 0px;}
.digital .subscription hr.e {margin:8px -30px 13px;}
.digital .subscription hr.t {margin:8px -30px 13px;}
.digital .dpB {display:block !important;}
.digital .subscription .formList .itemTh {margin-top:10px; display:none;}
.digital .subscription .btn_t {border-color: #5d88fb;}
.digital .subscription .btn_p2 {border-color:#715deb; background-color:#715deb; color:#fff; box-shadow:4px 4px 8px rgba(113, 93, 235, 0.24); position: absolute; bottom: 18px; left: 0;}
.digital .subscription .chkBtn.ok .btn_p2 {border-color:#dcd6fa; background-color:#dcd6fa; color:#fff; box-shadow:4px 4px 8px rgb(207 199 255 / 24%);}
.digital .subscription .btnB {position: absolute; bottom: 22px; left: 0px;}
.digital .subscription .chkBtn.chkBtnB.ok .btn_p span:before {border-color:#dcd6fa;}
.digital .subscription .sliderTitle {width: 100%; text-align: left; height: auto; padding: 15px 0px; margin-bottom: 0; padding-right: 30px;}
.digital .subscription .sliderTitle:after {content: ''; position: absolute; top: 20px; left: calc(100% - 18px); width: 12px; height: 12px; border: 1px solid #dcd6fa; border-width: 0 2px 2px 0; background-color: transparent; overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transform: rotate(45deg); transform: rotate(45deg); transition:all 0.3;}
.digital .subscription .sliderTitle.on:after {border: 1px solid #715deb; transform: rotate(225deg); -webkit-transform: rotate(225deg); border-width: 0 2px 2px 0; transition:all 0.2s;}
.digital .subscription .content {padding: 82px 30px 32px;}
.digital .subscription .dataTd {margin-top:35px;}

.digital .subscription .ipt:focus {border-bottom: 2px solid #5d88fb !important; border-left: 0px !important; border-right: 0px !important; border-top: 0px !important; box-shadow: none;}
.digital .subscription .keypad .ipt {background-color: #ffffff !important; border-top: 0px !important; border-left: 0px !important; border-right: 0px !important;}
.digital .subscription .keypad .ipt:focus {border-bottom: 2px solid #5d88fb !important;}

/* .digital .subscription.content {padding: 82px 30px 32px;} */
.digital .subscription .dataTd {margin-top:35px;}
.digital .subscription .ipt {border-top: 0px; border-left: 0px; border-right: 0px; border-radius: 0px;}
.digital .subscription .ipt.inputBox {border-right: 1px solid #ccc; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;} 
.iptFilt.agency .selectWrap.on select.ipt {border-left: 1px solid;}
.digital .subscription .ipt::placeholder {font-size:16px; opcity:1; letter-spacing: -0.4px; font-style: italic;}
.digital .subscription .ipt::-webkit-input-placeholder {font-size:16px; font-style: italic;}
.digital .subscription .ipt::-ms-input-placeholder {font-size:16px; font-style: italic;}
.digital .subscription .focusON {border-bottom: 1px solid #5d88fb !important;}
.digital .subscription .focusON >input {border-top: 0px !important; border-left: 0px !important; border-right: 0px !important; background-color:#ffffff !important;}
.digital .subscription .setPhone {position: relative; border: 0px;}
.digital .subscription .setPhone *:not(:last-child) {position:relative; border:0; border-radius:0; background-color:transparent !important; z-index:1;}
.digital .subscription .setPhone .selectWrap {border-right: 0px;}
.digital .subscription .setPhone .selectWrap .ipt {text-align:center; font-size: 12px; padding: 0 30px 0 10px; letter-spacing: -0.8px;}
.digital .subscription .setPhone .selectWrap + .ipt:not(select) {width:28.5%; height:34px; padding:0; line-height:34px; text-align:center;}
.digital .subscription .setPhone .selectWrap + .ipt:not(select):focus {border-bottom:0 !important; box-shadow:none !important;}
.digital .subscription .setPhone .selectWrap + .ipt:nth-child(2) {width: 15%; padding: 0px 5px;}
.digital .subscription .setPhone .selectWrap + .ipt:nth-child(4) {width: 19% !important; padding: 0px 5px; text-align: center;}
.digital .subscription .setPhone .ipt:last-child {padding-left: 82%; position:absolute; left:0; top:0; text-align:center; z-index:0; outline:rgba(0,0,0,0); border-bottom: 1px solid #d0d0d0;}
.digital .subscription .setPhone .ipt:focus ~ .ipt:last-child {box-shadow: none; border: 0px; border-bottom: 2px solid #5d88fb !important;}
.digital .subscription .setPhone .ipt[readonly] ~ .ipt:last-child {border-color:#ccc !important; box-shadow:none !important;}
.digital .subscription .setPhone .selectWrap.on select.ipt {color: #333 !important;}
.digital .subscription .telOne {height: 44px !important; width: 100% !important; text-align: left !important; padding-left: calc(36% + 15%) !important;}

.digital .subscription .ipt[readonly] {color:#a5a5a5;}
.digital .subscription .ipt[readonly]:focus {border-bottom: 1px solid #ccc !important;}
.digital .subscription .setDriver .ipt:nth-of-type(1):focus ~ .ipt:last-child {-webkit-box-shadow: none; box-shadow: none; border: 0px; border-bottom: 2px solid #5d88fb !important;}
.digital .subscription .setDriver input.ipt:nth-of-type(1):focus {border: 0px !important;}
.digital .subscription .setDriver .ipt[readonly] ~ input.ipt:last-of-type:focus {border-bottom: 2px solid #5d88fb !important;}
.digital .subscription .setDriver .selectWrap .ipt {background-color: transparent; border: 0px;}
.digital .subscription .setDriver .ipt[readonly]:focus {border:0 !important;}
.digital .subscription .setNum .ipt:focus ~ .ipt:last-of-type {border-bottom: 2px solid #5d88fb !important; box-shadow: none;}
.digital .subscription .setNum .ipt:not(:last-of-type):focus {border-bottom: 0px !important;}

.digital .subscription .keypad .ipt[type=password]:not([readonly]) {padding-bottom: 15px;}
.digital .subscription .keypad .ipt[type=password]::placeholder {font-size:16px; opcity:1; font-weight: 400; letter-spacing: -0.4px; font-style: italic;}
.digital .subscription .keypad .ipt[type=password]::-webkit-input-placeholder { font-size:16px;}
.digital .subscription .keypad .ipt[type=password]::-ms-input-placeholder {font-size:16px;}
.digital .subscription .iptBox.sm.div_2 .ipt + label {height:44px;}
.digital .subscription .helpWrap {margin: 32px -24px 0; border:0px;}

.digital .subscription .boxL{border-top: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; border-radius: 0px 4px 4px 0px;}
.digital .subscription .setHalf input {text-align: center;}
.digital .subscription .setHalf.noSlash > *:last-child:nth-child(2) {position: relative;}
.digital .subscription .setHalf.noSlash > *:last-child:nth-child(2):before {content: "/"; position: absolute; bottom: 0; left: -5px; font-size: 1.6rem;}.digital .iptFilt.iptBox.check .ipt + label {display: flex; align-items: center; line-height: normal; padding: 10.5px 15px 10.5px 48px; border: 1px solid #eee;}
.digital .subscription .iptBox.check .ipt:checked + label {border-color: #5d88fb; background-color: #f2f6ff; color: #445fe6;}
.digital .subscription .iptFilt.iptBox.check .ipt:checked + label {border: 1px solid #445fe6;}
.digital .subscription .iptFilt.iptBox.check > li:first-child .ipt + label{border-radius: 4px 0 0 4px;}
.digital .subscription .iptFilt.iptBox.check > li:first-child .ipt:checked + label {border-radius: 4px 0 0 4px;}
.digital .subscription .iptFilt.iptBox.check > li:first-child .ipt + label:after {left: 17px;}
.digital .subscription .iptFilt.iptBox.check > li:first-child .ipt + label:after {border-width: 0 2px 2px 0;}
.digital .subscription .iptFilt.iptBox.check > li:last-child .ipt + label {border-radius: 0 4px 4px 0;}
.digital .subscription .iptFilt.iptBox.check > li:last-child .ipt:checked + label {border-radius: 0 4px 4px 0;}
.digital .subscription .iptFilt.iptBox.check > li:last-child .ipt + label:after {border-radius: 0px;}
.digital .subscription .iptFilt.iptBox.check .ipt:checked + label:after {left: 17px; border-radius: 0;}

.digital .subscription button.btn_p2.m.chkBtn.ok {border-color: #dcd6fa; background-color: #dcd6fa; color: #fff; box-shadow: 4px 4px 8px rgb(207 199 255 / 24%);}
.digital .subscription .certBtnGroup2 {margin-bottom:15px;}
.digital .subscription .certBtnGroup2:after {content:""; display:block; clear:both;} 
.digital .subscription .certBtnGroup2.half [class^=btnCert_] {width: calc(100% / 2);}
.digital .subscription .certBtnGroup2 button {float: left; margin:0; background-size: 25px; background-position: 10px center; text-align: center; line-height: 53px; padding:0px; background-image: none;}
.digital .subscription .certBtnGroup2 button:nth-child(1){border-radius: 4px 0px 0px 4px;}
.digital .subscription .certBtnGroup2 button:nth-child(1).finish {}
.digital .subscription .certBtnGroup2 button:nth-child(2){border-radius: 0px 4px 4px 0px; border-left: 0px;}
.digital .subscription .certBtnGroup2 button.finish {background-image: none;}
.digital .subscription .certBtnGroup2 button .icon {background-size: cover; display: inline-block;margin-right: 5px; background-repeat: no-repeat; background-position: center;}

.digital .subscription .certBtnGroup2 .btnCert_phone.finish {background-color: #f2f6ff; color: #445fe6; font-weight: 400;}
.digital .subscription .certBtnGroup2 .btnCert_phone .icon {background-image:url(../../assets/images/smart/content/ico_certifi_phone.png); width: 25px; height: 30px; margin-bottom: -9px; background-size: 25px;}
.digital .subscription .certBtnGroup2 .btnCert_card .icon {background-image:url(../../assets/images/smart/content/ico_certifi_card.png); width: 30px; height: 30px; margin-bottom: -9px; background-size: 30px;}
.digital .subscription .certBtnGroup2 .btnCert_phone.finish .icon {background-image:url(../../assets/images/smart/content/ico_certifi_phone_b.png);}
.digital .subscription .certBtnGroup2 .btnCert_card.finish .icon {background-image:url(../../assets/images/smart/content/ico_certifi_card_b.png);}
.digital .subscription .certBtnGroup2 .btnCert_card[class^=btnCert_].finish {border-color: #5d88fb; background-color: #f2f6ff; color: #445fe6; border-left: 1px solid #5d88fb;}
.digital .subscription .certBtnGroup2 button[disabled] {background-color: #f8f8f8 !important; border-color: #ddd !important; color: #aaa !important;}
.digital .subscription .certBtnGroup2 button.finish[disabled] {background-color: #eeeeee !important; border-color: #ddd !important; color: #aaa !important; font-weight: 400 !important;}
.digital .subscription .certBtnGroup2 .btnCert_phone[disabled] .icon {background-image:url(../../assets/images/smart/content/ico_certifi_phone_g.png);}
.digital .subscription .certBtnGroup2 .btnCert_card[disabled] .icon {background-image:url(../../assets/images/smart/content/ico_certifi_card_g.png);}


.digital .subscription .step1Add .ipt[type=checkbox] + label:before, .ipt[type=radio] + label:before {border-color: #5d88fb;}
.digital .subscription .iptBox2 > li .ipt + label {border: 1px solid #ccc;}
.digital .subscription .iptBox2 > li .ipt + label:after {
	content: ''; position: absolute; top: 50%; left: 17px; width: 8px; height: 12px; border: 1px solid #bbb; border-width: 0 2px 2px 0; background-color: transparent;
    overflow: hidden; box-sizing: border-box; transform: rotate(45deg) translateY(-11px);
    }
.digital .subscription [class^=btn_][disabled], [class^=btn_].disabled {background-color: #eee !important;}
.digital .subscription .btn_p2[class^=btn_][disabled], [class^=btn_].disabled {border-color: #dcd6fa !important; background-color: #dcd6fa !important; color: #fff !important;}
.digital .subscription .setCard .ipt {width:25%;}
.digital .subscription .setCard:focus-within {border-bottom: 2px solid #5d88fb !important;}
.digital .subscription .setCard .ipt:focus {border-bottom: 0px !important;}
.digital .subscription .selectWrap.on select.ipt {color:#333 !important;}
.slide-up {transition:all 0.2s ease-in;}
.slide-up-enter-active,
.slide-up-leave-active {transition:all 0.2s ease-in;}
.slide-up-enter-from,
.slide-up-leave-to {opacity:0;}
.digital .subscription .sliderWrap {transition:all 0.2s ease-in; min-height: calc(100vh - 246px); position: relative; padding-bottom: 78px;}
.digital .subscription .sliderWrap.sliderWrap_f {min-height: calc(100vh - 227px);}
.digital .subscription .sliderWrap2 {transition:all 0.2s ease-in; min-height: calc(100vh - 118px); position: relative; padding-bottom: 78px;}
.digital .subscription .sliderWrap.sliderWrap_f2 {min-height: calc(100vh - 197px);}
.digital .subscription .sliderWrap.sliderWrap_s {min-height: calc(100vh - 245px);}
.digital .subscription .listWrap.on {min-height: calc(100vh - 116px);}
.digital .subscription .listWrap2.on {min-height: calc(100vh - 56px);}
.digital .subscription .listWrap3.on {min-height: calc(100vh - 356px);}
.digital .subscription .setInp{ opacity:0;}
.digital .subscription .setInp.showOn {animation: fade-in 0.3s; animation-fill-mode: forwards; }
@-webkit-keyframes fade-in {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
@-moz-keyframes fade-in {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
@-ms-keyframes fade-in {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
@-o-keyframes fade-in {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}
@keyframes fade-in {
	from {
		opacity:0;
	}
	to {
		opacity:1;
	}
}

/*모바일동의창*/
.digital .termsAll ul.termsWrap .accoHead {padding: 0px 45px 0px 0;}
.digital .termsAll ul.termsWrap .ipt + label.lg {padding: 5px 0 5px 31px;}
.digital .termsAll ul.termsWrap label.lg::before {top:6px;}
.digital .termsAll ul.termsWrap label.lg::after {top:10px;}
.digital .termsAll .ipt[type=checkbox][disabled] + label {border-color: #ddd;}
.digital ul.termsWrap .accoHead [class^=icoBtn_] {height: 35.59px;}
.digital .subscription .setCard.security {border-top: 0px !important; border-left: 0px !important; border-right: 0px !important; border-radius: 0px;}
/*프로그래스바*/
.digital .progress01 {overflow:hidden; margin: -29px -24px 30px;}
.digital .progress01.on {position: fixed; width: 100%; top: 28px; left: 24px; z-index: 1502; border-bottom: 1px solid #ccc; padding: 18px 24px;}
.digital .progress01 .progressPoint {float:left;}
.digital .progress01 .progressPoint li {width: 6px; height: 6px; vertical-align: middle; background-color:#ccc; transition:all 0.3s;}
.digital .progress01 .progressPoint li.on {width:20px; background-color:#715deb;}
.digital .progress01 .progressPoint li:before {content:""}
.digital .progress01 p {float:right; color:#8b8b8b;}
.digital .progress01 p span {color: #5d88fb;}

.progress01 {margin:-29px -24px 30px; padding:15px 24px; background-color:#f8f8f8;}
.progress01 span {font-size:1.4rem; color:#222; font-weight:500;}
.progress01 ol {position:relative; display:block; counter-reset:section; font-size:0; text-align:right;}
.progress01 li {display:inline-block; margin-top:8px; margin-right:10px; border-radius:20px; background-color:#715deb; color:#717592; font-size:1.2rem; line-height:20px; text-align:center; vertical-align:middle; z-index:1;}
.progress01 li:before {content:counter(section); counter-increment:section; width:auto; height:auto;}
.progress01 li:after {content:''; display:inline-block; width:4px; height:8px; margin:5px 0 0 -7px; border:1px solid #fff; border-width:0 1px 1px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; vertical-align:top; transform:rotate(45deg);}
.progress01 li.on:after,
.progress01 li.on ~ li:after {display:none;}
.progress01 li.on {background-color:#715deb; color:#fff;}
.progress01 li.on span {position:absolute; left:0;}
.progress01 li.on ~ li {background-color:#ddd;}

/*필수선택동의*/
.digital .subscription .tabList.lg > li {height: 56px !important;}
.digital .subscription .bottomSheet .popBody {height: 70vh;}
.digital .subscription .bottomSheet .btnArea.sticky {bottom:0; width:auto; margin:32px -24px 0;}
.digital .subscription .bottomSheet .btnArea [class^=btn_] {margin:0;}
.digital .subscription .termsAll.extra .accoList .accoHead > .inner {padding: 17px 0 16px 16px; min-height: 0px;}
.digital .subscription .keypad .ipt[readonly] {background-color:#ffffff;}
.digital .subscription #defaultKeypad {color: #000;}
.digital .subscription #chldRdreNo2 {color: #000;}
.digital .subscription #drvlicKeypad {color: #000;}
.digital .subscription #coorKeypad {color: #000;}
.digital .subscription #cardNum3 {color: #000;}
.digital .subscription #cardNum4 {color: #000;}
.digital .subscription .popBody .tabList {padding: 20px 0px 0px 0px;}
.digital .subscription .agreeCont.popCont .termsAll.extra .ipt + label.allChk {color: #fff; background-color: #715deb; border-color: #5642bf;}
.digital .subscription .agreeCont.popCont .termsAll.extra .ipt + label.allChk:after {border-color: #ffffff;}

.digital .subscription .setPhone .ipt:nth-child(2) {width: 15%; padding: 0px 5px;}

/*문서확인*/
.digital .subscription .docAtt .chkBtn .btn_p {text-align: left; letter-spacing: -0.8px;}
.digital .subscription .docAtt .chkBtn .btn_p span {margin-left: 10px; padding-left: 22px;}
.digital .subscription .content .docAtt .chkBtn.ok .btn_p {border-color: #dcd6fa; color: #dcd6fa; background-color: #ffffff;}
/*step2*/
.digital .subscription .cfrItem .notiBox {margin: 18px 0px 16px 0px; padding: 15px 20px; font-size: 1.4rem;}

/* 보험계산 후 */
.digital .setBtnAdd .selectWrap.pension2 {width:100% !important;} 
.digital .setBtnAdd .selectWrap.pension2 .ipt {width:100% !important;}
/* 보험계산 후 tip */
.digital .tipWrap {margin-bottom:2px; margin-left:3px; background: url(../../assets/images/cdi/common/tip_icon.png) no-repeat; background-size: cover;}
.digital .tipWrap .icoBtn_tip {background-color:transparent; border:0px;}
.digital .tipWrap .icoBtn_tip:after {content:'';}

/*231222가입후기 개선*/
.digital .section .reviewBbsList > li > .block.ratingBtn {padding: 20px 50px 20px 20px; height: auto; position: relative; min-height:206px;}
.digital .starWrap {overflow:hidden;}
.digital .starWrap .starRating {float: left;}
.digital .starNumb {float: left; margin-right: 10px; margin-top: -1px;}
.digital .ratingPf {float: left; width: 40px; height:40px; background: url(../../assets/images/cdi/content/ico_review_twentiesW.png) no-repeat; background-size: cover;}
.digital .ratingPf.twW {background: url(../../assets/images/cdi/content/ico_review_twentiesW.png) no-repeat; background-size: cover;}
.digital .ratingPf.twM {background: url(../../assets/images/cdi/content/ico_review_twentiesM.png) no-repeat; background-size: cover;}
.digital .ratingPf.foW {background: url(../../assets/images/cdi/content/ico_review_fortiesW.png) no-repeat; background-size: cover;}
.digital .ratingPf.foM {background: url(../../assets/images/cdi/content/ico_review_fortiesM.png) no-repeat; background-size: cover;}
.digital .ratingPf.siW {background: url(../../assets/images/cdi/content/ico_review_sixtiesW.png) no-repeat; background-size: cover;}
.digital .ratingPf.siM {background: url(../../assets/images/cdi/content/ico_review_sixtiesM.png) no-repeat; background-size: cover;}
.digital .ratingWrap {overflow: hidden;}
.digital .ratingInfo {float: left; width: 188px; overflow: hidden;}
.digital .ratingInfo .info {font-weight:700; letter-spacing:-0.5px;}
.digital .reviewBbsList .ratingBtn .descDiv .desc.ratingTxt { -webkit-line-clamp: 2;}
.digital .reviewBbsList .ratingBtn.on .descDiv .desc.ratingTxt { -webkit-line-clamp: unset;}
.digital .ratingBtn:after {content: ''; position: absolute; left: auto; top: 50%; right:25px; width: 11px; height: 11px; margin-top: -3px; border: 1px solid #222; border-width: 0 2px 2px 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); -webkit-transition: all 0.25s; transition: all 0.25s;}
.digital .ratingBtn.on:after {margin-top: 3px; border-color: #715deb; -webkit-transform: translate(-50%, -50%) rotate(-135deg); transform: translate(-50%, -50%) rotate(-135deg);}
.digital .ratingBest {position: absolute; top: 20px; right: 20px; padding: 2px 8px; background-color: #715def; color: #ffffff; border-radius: 30px; font-size: 10px;}
.digital .reviewPointer button.swiper-pagination-bullet:before {content: ''; position: absolute;top: 50%; left: 50%; width: 6px; height: 6px; border: 1px solid transparent; border-radius: 6px; background-color: rgba(102, 93, 207, .5); box-sizing: border-box; transform: translate(-50%, -50%); transition: all 0.25s ease-in-out;}
.digital .reviewPointer button.swiper-pagination-bullet-active:before {width: 16px; border-color: transparent; background-color: #665dcf;}
.digital .reviewBbsList.reviewBbsList03 {margin: 0 -24px 32px;}
.digital .reviewBbsList.reviewBbsList03 > li:first-child .block  {border-top: 1px solid #eee;}
.digital .reviewBbsList.reviewBbsList03 > li:last-child .block {border-bottom: 1px solid #aaa;}
.digital .reviewBbsList.reviewBbsList03 > li > .block {height: auto; position: relative; box-shadow: none; padding: 20px 65px 20px 24px; border-bottom: 1px solid #eee;}
.digital .reviewBbsList.reviewBbsList03 .descDiv {margin: 0; padding: 0; border-top: 0px}
.digital .reviewBbsList.reviewBbsList03 .reviewBbsList .info {margin-top:0px; color: #666; margin-left: 5px;}
.digital .reviewBbsList.reviewBbsList03 .ratingPf {width: 55px; height:55px;}
.digital .reviewBbsList.reviewBbsList03 .ratingInfo {width: calc(100% - 63px); margin-left:8px;}
.digital .reviewBbsList.reviewBbsList03 .ratingInfo .info {margin-top:0px; letter-spacing:0px;}
.digital .reviewBbsList.reviewBbsList03 .starNumb {margin-top: -2px;}
.digital .reviewBbsList.reviewBbsList03 > li + li {margin-top:0px;}
.digital .reviewBbsList.reviewBbsList03 .ratingBest {top:23px;}
/*240207 가입문의 개선*/
.digital .inquMetBox {display:inline;}
.digital .inquSelect {position: relative; padding-top: 134px; color: #222; font-size: 1.8rem; font-weight: 500; background: url(../../assets/images/cdi/content/inquiryImg02.png) no-repeat center top; text-align: center;}
.digital .inquBtnBox {width: 90%; margin: 0 auto;}
.digital .inquBtnBox button >span {position: relative; padding-left: 35px;}
.digital .inquBtnBox button {font-size:1.6rem;}
.digital .inquBtn01 >span:before {content: ""; position: absolute; width: 30px; height: 30px; left: 0px; top: -2px; background: url(../../assets/images/cdi/content/icon_inquiryBtn01.png) no-repeat; background-size: 28px;}
.digital .inquBtn02 {line-height: 16px;}
.digital .inquBtn02 a {display:block;}
.digital .inquBtn02 a >span {text-align: left; position:relative; padding-left:35px;}
.digital .inquBtn02 a >span:before {content: ""; position: absolute; width: 30px; height: 30px; left: 0px; top: 4px; background: url(../../assets/images/cdi/content/icon_inquiryBtn02.png) no-repeat; background-size: 30px;}
.digital .inquBtn02 a >span span {letter-spacing: -0.05rem; margin-left:18px; font-weight:300; font-size:1.0rem;}
.digital .inquTitle {padding-top: 110px; background: url(../../assets/images/cdi/content/inquiryImg04.png) no-repeat center top; background-size: 95px;}
.digital .inquFrom option {font-size:1.4rem;}
.digital .inquFrom select {font-size:1.4rem;}
.digital .inquFrom input {font-size:1.4rem;}
.digital .inquFrom .accoHead >div {display: block; padding: 10px 35px 11px 15px; border: 1px solid #ddd;}
.digital .inquFrom .txtList .txtList {margin-top: 0px;}
.digital .inquFrom .inquMetBox {display: inline;}
.digital .inquFrom .setPhone #email {border:0; height:34px; width: 65%;}
.digital .inquFrom .setPhone textarea {font-size:1.4rem;}
.digital .inquFrom .setPhone .ipt[disabled] {background-color:transparent !important;}
.digital .inquFrom .setPhone .ipt[type=tel] {width:60px;}
.digital .inquFrom .setPhone .ipt.telOne[type=tel] {width: calc(64% - 60px);}
.digital .inquFrom .iptWrap textarea.ipt {font-size:1.4rem;}
ul.termsWrap .accoHead2 {margin-right: 0; padding: 0; position: relative;}
.digital .inquFrom .accoHead2 >div {display: block; padding: 10px 35px 11px 15px; border: 1px solid #ddd;}
ul.termsWrap .accoHead2 [class^=icoBtn_] {position: absolute; right: 1px; top: 50%; margin-top: -23px; width: 35px; height: 46px; border-left: 0 !important; z-index: 1;}
ul.termsWrap .accoBody2 {margin: 0 0 23px; padding: 0; border-top: 0; position: relative; background-color: #f8f8f8;}
.digital ul.termsWrap .accoBody2 > .inner {padding: 15px 18px; background-color: #f8f8f8; font-size: 1.4rem;}
.digital .inquFrom .termsWrap .accoItem2 .accoBody2 {overflow:hidden; transition:all 0.25s; max-height:0px;}
.digital .inquFrom .termsWrap .accoItem2.on .accoBody2 {max-height:1000px;}
.icoBtn_acco2:after {content:''; position:absolute; left:50%; top:50%; width:11px; height:11px; margin-top:-3px; border:1px solid #222; border-width:0 2px 2px 0; box-sizing:border-box; transform:translate(-50%, -50%) rotate(45deg); transition:all 0.25s;}
.accoItem2.on > .accoHead2 .icoBtn_acco2:after {margin-top:3px; border-color:#715deb; transform:translate(-50%, -50%) rotate(-135deg);}

/*디지털보험 마케팅동의*/
.digital .meketing .titH1 {padding: 45px 0px;}
.digital .meketing .imgCont {width: 170px; margin: 0 auto; padding-top: 0px;}
.digital .meketing .imgCont img {width:100%;}
.digital .meketing .inquTitle {background: url(../../assets/images/cdi/content/inquiryImg03.png) no-repeat center top;}

/* content layout */
.section {position:relative; margin-bottom:64px;}
.section.fullH {min-height:calc(100vh - 56px);}
.section[class*=bg_] {margin-left:-24px; margin-right:-24px; margin-bottom:0; padding:64px 24px;}
.section[class*=bg_] + .section:not([class*=bg_]) {margin-top:64px;}
.section[class*=bg_]:first-of-type {margin-top:-26px;}
.digital .summary + .section:not([class*=bg_]) {margin-top:64px;}
.section ~ hr.s {margin:0 -24px 64px;}
.section ~ .btnArea.sticky {margin-top:8px;}
.section[class*=bg_] .notiBox.bgWhite {box-shadow:8px 8px 18px rgba(0,0,0,0.1);}

.section.sm {margin-bottom:32px;}
.section.sm[class*=bg_] {margin-bottom:0; padding:32px 24px;}
.section[class*=bg_] + .section.sm:not([class*=bg_]) {margin-top:32px;}
.section.sm .csBanner {margin-top:32px;}

.section.bg_1 {background-color:#f2f6ff;}
.section.bg_2 {background-color:#f3f1fe;}
.section.bg_3 {background-color:#f8f8f8;}
.section.bg_4 {background-color:#fff7f7;}
.section.bg_5 {background-color:#fff6e3;}

.section .titExtra {position:relative; margin-bottom:40px; text-align:center; color:#222;}
.section .titExtra .desc {display:block; margin:10px 0 20px; color:#666;}
.section .txtList:last-child {margin-bottom:0;}
.section:not([class*=bg_]) .titExtra.line {margin-top:128px;}
.section[class*=bg_] + .section:not([class*=bg_]) .titExtra.line {margin-top:0;}
.section .titExtra.line:before {content:''; position:absolute; top:-96px; left:50%; width:1px; height:64px; background:#e5e5e5;}

.section .tabList.subTab {padding-bottom:30px; border:0;}
.section .tabList.subTab > li {border-width:1px;}
.section .tabList.subTab > li:first-child {border-radius:4px 0 0 4px;}
.section .tabList.subTab > li:last-child {border-right:1px solid #ddd; border-radius:0 4px 4px 0;}
.section .tabList.subTab > li.on {color:#445fe6;}
.section .tabList.subTab > li.on:after {border:1px solid #5d88fb; background-color:#f2f6ff; box-shadow:0 4px 8px rgba(93,136,251,0.24);}
.section .tabList.subTab > li.on:first-child:after {border-radius:4px 0 0 4px;}
.section .tabList.subTab > li.on:last-child:after {border-radius:0 4px 4px 0;}
.section .tabList.subTab > li.on:first-child:after,
.section .tabList.subTab > li.on:last-child:after {border-width:1px;}
.section .tabList.subTab + .tabContents {padding:0 24px 30px; background:#fff;}
.section .tabList.subTab + .tabContents .tabPanel {padding-top:0;}

.section .swiperWrap {margin:0 -24px; padding-bottom:22px;}
.section .swiperWrap .swiper-container {padding:0 16px 0 24px;}
.section .swiperWrap .infoBox {padding-top:8px; border:none; border-radius:0; background-color:transparent; box-shadow:none;}
.section .swiperWrap .infoBox > .inner {background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, .06);}

.section .swiperWrap .infoBox.hasBtn .inner {padding-bottom:90px;}
.section .swiperWrap .infoBox.hasBtn .btnGroup {position:absolute; left:30px; bottom:40px; margin:0;}
.section .swiperWrap .infoBox .btnConsul,
.section .swiperWrap .infoBox .btnDirect {display:inline-block; padding:0 3px 0 33px; background-image:url(../../assets/images/smart/common/ico_btn_consul.png); background-repeat:no-repeat; background-position:3px 2px; background-size:24px; color:#222; font-size:14px; font-weight:500; line-height:28px; vertical-align:middle;}
.section .swiperWrap .infoBox .btnDirect {background-image:url(../../assets/images/smart/common/ico_btn_direct.png);}

.btnGroup.full {flex-wrap:wrap;}
.btnGroup.full [class^=btn_] {width:100%; margin:4px 0;}

.barAni {transition:width 0.5s ease-out;}
.barAni:not(.aniOn) {width:0 !important;}

.digital .txtList.dot > li:before,
.digital .txtList.dot:not(ul):before {background-color:#5d88fb;}

/* progress */
.progress {margin:-29px -24px 30px; padding:15px 24px; background-color:#f8f8f8;}
.progress span {font-size:1.4rem; color:#222; font-weight:500;}
.progress ol {position:relative; display:block; counter-reset:section; font-size:0; text-align:right;}
.progress li {display:inline-block; width:20px; height:20px; margin-left:5px; border-radius:20px; background-color:#715deb; color:#717592; font-size:1.2rem; line-height:20px; text-align:center; vertical-align:middle; z-index:1;}
.progress li:before {content:counter(section); counter-increment:section; width:auto; height:auto;}
.progress li:after {content:''; display:inline-block; width:4px; height:8px; margin:5px 0 0 -7px; border:1px solid #fff; border-width:0 1px 1px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; vertical-align:top; transform:rotate(45deg);}
.progress li.on:after,
.progress li.on ~ li:after {display:none;}
.progress li.on {background-color:#715deb; color:#fff;}
.progress li.on span {position:absolute; left:0;}
.progress li.on ~ li {background-color:#ddd;}

/* Paging */
.paging {margin:32px 0; text-align:center;}
.paging ul {display:inline-block; padding:0 8px; font-size:0; vertical-align:middle;}
.paging li {display:inline-block; padding:0 3px;}
.paging a,
.paging em {display:inline-block; position:relative; width:32px; border-radius:2px; color:#222; font-size:1.6rem; line-height:32px; text-align:center; overflow:hidden;}
.paging a:after {content:''; position:absolute; bottom:5px; left:50%; right:50%; border-bottom:1px solid #1a75e4; transition:all ease-in-out 0.125s;}
.paging a:hover,
.paging a:focus {color:#1a75e4; font-weight:500;}
.paging a:hover:after,
.paging a:focus:after {left:7px; right:5px;}
.paging .on em {background-color:#5d88fb; color:#fff; font-weight:500;}
.paging [class^=icoBtn_] {background-color:#fff; margin:0 2px;}
.paging [class^=icoBtn_]:not([disabled]):focus,
.paging [class^=icoBtn_]:not([disabled]):hover {border-radius:6px; background-color:#eee;}
.paging [class^=icoBtn_][disabled] {opacity:0.4;}

/* 본인인증 */
.certBtnGroup {display:flex; margin:0 -4px 30px -4px;}
[class^=btnCert_] {width:100%; margin:0 8px; padding:67px 10px 23px; font-size:1.4rem; font-weight:500; border:1px solid #ccc; background-position:center 25px; background-repeat:no-repeat; background-size:32px 32px;}
[class^=btnCert_].finish {border-color:#5d88fb; background-color:#5d88fb; color:#fff;}
.btnCert_phone {background-image:url(../../assets/images/smart/content/ico_phone.png);}
.btnCert_card {background-image:url(../../assets/images/smart/content/ico_card.png);}

.digital [class^=btnCert_] {margin:0 4px; padding:60px 5px 13px; font-weight:300; border-radius:4px; background-position:center 15px; background-size:40px 40px;}
.digital .btnCert_kakao {background-image:url(../../assets/images/smart/content/ico_certifi_kakao.png);}
.digital .btnCert_public {background-image:url(../../assets/images/smart/content/ico_certifi_public.png);}
.digital .btnCert_phone {background-image:url(../../assets/images/smart/content/ico_certifi_phone.png);}
.digital .btnCert_card {background-image:url(../../assets/images/smart/content/ico_certifi_card.png);}
.digital .btnCert_kakao.finish {background-image:url(../../assets/images/smart/content/ico_certifi_kakao_w.png);}
.digital .btnCert_public.finish {background-image:url(../../assets/images/smart/content/ico_certifi_public_w.png);}
.digital .btnCert_phone.finish {background-image:url(../../assets/images/smart/content/ico_certifi_phone_w.png);}
.digital .btnCert_card.finish {background-image:url(../../assets/images/smart/content/ico_certifi_card_w.png);}

.certBtnGroup.half {flex-wrap:wrap;}
.certBtnGroup.half [class^=btnCert_] {width:calc((100% - 16px) / 2);}
.certBtnGroup.half [class^=btnCert_]:not(:nth-child(-n+2)) {margin-top:8px;}

/* 필터 인증 */
.iptFilt [class *= certRadio] {padding:4px}
.iptFilt [class *= certRadio]:nth-child(even) {padding-right:0;}
.iptFilt [class *= certRadio]:nth-child(odd) {padding-left:0;}
.iptFilt [class *= certRadio] label {height:96px; padding-top:52px; margin:0; border:1px solid #ccc; border-radius:4px; color:#666;}
.iptFilt [class *= certRadio] label:after {content: '' !important; position: absolute; top:0px; left:0px; right:0px; bottom:0; height:96px; margin:0 auto; border:none; background: url(../../assets/images/smart/content/ico_cert_radio_pin.png) no-repeat center 0; background-size: 96px auto;}
.iptFilt [class *= certRadio] .ipt:checked + label {background-color: #5d88fb; border-color: #5d88fb; color:#fff;}
.iptFilt [class *= certRadio] .ipt:checked + label:after {border:none; background-position: center -96px;}
.iptFilt .certRadio_pass label:after {background-image: url(../../assets/images/smart/content/ico_cert_radio_pass.png)}
.iptFilt .certRadio_pass .ipt:checked + label:after {background-position: center -96px;}
.iptFilt .certRadio_kakao label:after {background-image: url(../../assets/images/smart/content/ico_cert_radio_kakao.png)}
.iptFilt .certRadio_kakao .ipt:checked + label:after {background-position: center -96px;}
.iptFilt .certRadio_sign label:after {background-image: url(../../assets/images/smart/content/ico_cert_radio_sign.png);}
.iptFilt .certRadio_sign .ipt:checked + label:after {background-position: center -96px;}

.iptFilt.div_3.sm {justify-content: space-between;}
.iptFilt.div_3.sm [class *= certRadio] {width:calc((100% / 3) - 12px); padding:4px 0;}
.iptFilt.div_3.sm [class *= certRadio] label {height:86px; padding-top:42px; font-size:13px;}
.iptFilt.div_3.sm [class *= certRadio] label:after {height:84px; background-size: 74px auto;}
.iptFilt.div_3.sm [class *= certRadio] .ipt:checked + label:after {background-position:center -74px;}

/* 신분증확인 */
.idCard {margin:16px 0 26px; text-align:center;}
.idCard img {width:100%; max-width:300px;}
.idCard .btn_t.m {background-color:#fff;}

/* 간편결제 - PAY */
.payList {display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; margin-top:12px;}
.payList > li {width:calc((100% / 2) - 4px);}
.payList img {width:auto; height:18px;}
.payList .ipt + label {display:flex; justify-content:center; align-items:center; width:100%; height:52px; padding:0; border:1px solid #ccc; background-color:#fff; vertical-align:top; border-radius:2px;}
.payList .ipt + label:before {display:none;}
.payList .ipt:checked + label {border-color:#5d88fb;}

[class^=btnPay_] {background-repeat:no-repeat; background-position:50% 50%; background-size:auto 18px;}

/* 납세정보 */
.addInForm {position:relative; margin:26px -24px; padding:26px 24px 0; border-top:1px solid #eee;}
.addInForm .tit {color:#222; font-weight:500;}
.addInForm > .icoBtn_del {position:absolute; top:26px; right:24px; margin:-8px -8px 0 0;}
.addInForm > .icoBtn_del:before,
.addInForm > .icoBtn_del:after {height:20px;}
.addInForm:only-of-type > .icoBtn_del {display:none;}
.addInForm .formList {margin-bottom:0;}
.addInForm .formList .itemTh {margin-top:20px;}

.addInForm .duration {position:relative; margin:13px 0 20px;}
.addInForm .duration .single {margin:2px 0 10px;} 
.addInForm .duration .toggleSwitch {position:absolute; top:0; right:0;}

.bgGrayArea .addInForm {margin:26px 0 0 0; padding:26px 0 0 0; border-color:#ddd;}
.bgGrayArea .addInForm:first-child {margin-top:-26px; border-top:0;}
.bgGrayArea .addInForm .tit {color:#445fe6; font-size:1.4rem; font-weight:500;}
.bgGrayArea .addInForm > .icoBtn_del {right:0;}

.addInForm .innerForm + .innerForm {margin-top:30px; padding-top:30px; border-top:1px solid #eee;}
.addInForm .innerForm .ico_del {display:block; width:auto; height:auto; margin:0 0 -12px auto; padding-left:15px; font-size:1.4rem; background-position:0 center;}
.addInForm .tit + .innerForm .ico_del {display:none;}

.cate + .addInForm {margin-top:0; padding-top:10px; border-top:none;}

.addInForm + .btnGroup {padding-top:25px; border-top:1px solid #ddd;}

/* 포인트 보험료결제 */
.chkInForm > li {position:relative; min-height:56px; margin:4px 0 8px 0; padding:4px 16px 7px; background-color:#f8f8f8; border-radius:4px;}
.chkInForm .point {margin:9px 0; padding-left:2px;}
.chkInForm .block {display:none; padding:1px 0 13px 0;}
.chkInForm .total {color:#445fe6; font-size:14px; text-align:right;}
.chkInForm .block .total {position:absolute; right:17px; top:16px;}
.chkInForm [class^=btn_].m {padding:5px 0; min-width:92px; background-color:#fff; border-color:#5d88fb;}

.chkInForm .total .links,
.chkInForm .single label {margin:0; font-size:1.4rem; vertical-align:baseline;}
.chkInForm .single {overflow:visible;}
.chkInForm .single label:before {top:-1px;}
.chkInForm .itemTh {margin-top:3px; color:#222; font-size:1.4rem; font-weight:500;}
.chkInForm > li.on {background-color:#f2f6ff;}
.chkInForm > li.on .block {display:block;}

.chkInForm.simple + .termsWrap {margin:30px 0 40px;}

.pointBtnArea {display:flex; justify-content:space-between; align-items:center;}
.pointBtnArea [class^=btn_] {max-width:58px;}

/*계좌선택*/
.bottomSheet .popBody.bankBody {padding: 65px 0px 40px 0px;}
.bankList.bankForm {margin-bottom: 0px;}
.bankList.bankForm li {border-bottom: 1px solid #ccc; padding: 8px 20px;}
.bankList.bankForm li:last-child {border-bottom: 0px}
.digital .bottomSheet .btnArea.sticky.bankBtn {width: 90%; margin-left: 5%; margin-top: 20px; bottom: -24px;}
.digital .btnAccount {padding:8px 54px 8px 53px;}
.digital .btnAccount .img {width:30px; height:30px;}
.digital .btnAccount .img img {width:100%;}

.digital .bottomSheet .bankList button {padding:0px 42px;}
.digital .bottomSheet .bankList .img {width:30px; height:30px; margin-top:11px;}

/* 확인사항 리스트 */
.cfrItem {font-size:1.4rem;}
.cfrItem .cate {display:block; margin-bottom:15px; color:#5642bf;}
.cfrItem .tit {color:#222; font-size:16px; font-weight:500;}
.cfrItem .desc {margin-top:10px; color:#959595;}
.cfrItem > .iptFilt {margin:30px 0 0 0;}
.cfrItem > .iptCheck {margin:25px 0 0 0;}
.cfrItem > .iptCheck:not(.vertical) > li {margin-right: 30px;}
.cfrItem .notiBox {margin-top:24px;}
.cfrItem .notiBox [class^=txtList] {color:#222;}
.cfrItem .notiBox [class^=txtList].div_2 > li:nth-child(-n+2) {margin-top:0 !important;}

.cfrList {border-top:1px solid #222;}
.cfrList .cfrItem {border-bottom:1px solid #ddd; padding:30px 0;}
.cfrList .cfrItem div.iptCheck.inB {margin:5px 0 0 0;}
.cfrList .cfrItem div.iptCheck.inB label {position:relative; top:-2px; color:#959595;}
.cfrList .cfrItem div.iptCheck.inB .ipt:checked + label {color:#445fe6;}

.cfrItem .infoBox .numbering {margin-bottom:14px; text-align:center;}
.cfrItem .infoBox .flag_num {font-weight:300 !important;}
.cfrItem .infoBox .tit {font-weight:300;}
.cfrItem .infoBox .iptGroup {margin:15px 0 5px; padding-top:15px; border-top:1px solid #ddd; text-align:center;}
.cfrItem .infoBox .iptGroup > li {margin:4px 10px; min-height:28px;}
.cfrItem .infoBox .iptGroup .ipt + label {padding-left:36px;}
.cfrItem .infoBox .iptGroup .ipt + label:before {content:'' !important; top:-1px !important; width:28px; height:28px; border:none; box-shadow:none; border-radius:50%; background-color:#f8f8f8; transition:all ease-in-out 0.15s;}
.cfrItem .infoBox .iptGroup .ipt + label:after {content:''; position:absolute; top:5px; left:10px; width:8px; height:12px; border:1px solid #bbb; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}
.cfrItem .infoBox .iptGroup .ipt:checked + label:before,
.cfrItem .infoBox .iptGroup .ipt:checked:focus + label:before {border:none; box-shadow:none; background-color:#5d88fb !important;}
.cfrItem .infoBox .iptGroup .ipt:checked + label:after {border-color:#fff;}
.cfrItem .infoBox .iptGroup.div_2 {text-align:left;}
.cfrItem .infoBox .iptGroup.div_2 > li {margin:5px 0;}
.cfrItem .infoBox .iptGroup.vertical > li {margin:10px 0; text-align:left;}
.cfrItem .infoBox textarea.ipt {margin:10px 0 15px;}
.cfrItem .infoBox .links {margin:7px 0 0 0;}

.cfrItem .formList .txtVal {margin:1px 0; padding:16px 0; font-size:16px;}
.cfrItem .formList .txtVal::after {content:'';display:block;clear:both;}
.cfrItem .formList .txtVal .icoBtn_del.txtDel {position:relative;width:16px;height:16px;margin:-3px 0 0 8px;background:#715deb;border-radius:50%;box-shadow:inset 0px 0px 0px 12px #715deb;}
.cfrItem .formList .txtVal .icoBtn_del.txtDel:before,
.cfrItem .formList .txtVal .icoBtn_del.txtDel:after {content:''; position:absolute; left:50%; top:50%; width:1px; height:8px; background-color:#fff; transform:translate(-50%, -50%) rotate(45deg);}
.cfrItem .formList .txtVal .icoBtn_del.txtDel:after {transform:translate(-50%, -50%) rotate(135deg);}

.bgGrayArea .cfrItem {margin-bottom:32px;}
.bgGrayArea .cfrItem:last-child {margin-bottom:0;}
.bgGrayArea .cfrItem > .titQ {margin-bottom:15px;}

.digital .cfrItem .titQ {padding-left:28px; background:url(../../assets/images/smart/common/ico_faq_q.svg) no-repeat 0 3px / 20px 20px;}
.digital .cfrItem > hr.s {margin-left:-24px; margin-right:-24px;}

/* 타이틀 아코디언 */
.titAcco .accoBody {background-color:#fff;}
.titAcco .accoHead {display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #222;}
.titAcco .accoHead [class^=titH] {margin-bottom:0;}
.titAcco .accoHead .icoBtn_acco {width:46px; height:46px;}
.titAcco .cfrList {border:none;}

/* 내용설명 아코디언 */
.accoTip {margin-top:26px;}
.accoTip .icoBtn_acco {position:absolute; top:0; right:0; width:80px; height:22px;}
.accoTip .icoBtn_acco:after {left:100%; width:8px; height:8px; margin-top:-2px; border-color:#445fe6; transform:translate(-15px, -50%) rotate(45deg);}
.accoTip.accoItem.on .icoBtn_acco:after {margin-top:1px; transform:translate(-15px, -50%) rotate(-135deg);}
.accoTip .accoHead {position:relative; padding-right:24px; text-align:right; font-size:1.4rem; color:#445fe6;}
.accoTip .accoBody {margin-top:18px; font-size:1.4rem; color:#666; background:transparent;}

/* 아이콘 리스트 */
[class^=infoIco] .info {width:100%; padding-right:20px; flex-grow:1;}
[class^=infoIco] [class^=ico] + .info {padding:0 0 0 15px;}
[class^=infoIco] [class^=ico] {width:40px; height:40px; min-width:40px;}
[class^=infoIco] [class^=ico] img {width:100%;}
[class^=infoIco] .info .txtList {margin-bottom:0;}

.infoIcoList > li {display:flex; width:100%; margin-bottom:30px; padding-top:30px; border-top:1px solid #eee;}
.infoIcoList > li:first-child {padding-top:0; border-top:none;}

.infoIcoWrap {display:flex; width:100%; margin-top:15px;}
.infoIcoWrap [class^=ico] {position:relative; top:4px; width:48px; height:48px; min-width:48px; padding:10px; border-radius:5px; background-color:#f5f3ff;}
.infoIcoWrap .icoG {background-color:#f8f8f8;}
.infoIcoWrap .icoB {background-color:#ecf2ff;}

.infoIcoWrap.round {align-items:center; margin-top:30px; color:#222;}
.infoIcoWrap.round [class^=ico] {top:0; width:80px; height:80px; min-width:80px; padding:20px; border-radius:50%;}
.infoIcoWrap.round:not(.sm) [class^=ico] + .info {padding-left:20px;}
.infoIcoWrap.round.sm [class^=ico] {width:64px; height:64px; min-width:64px; padding:16px;}
.infoIcoWrap.round.lg [class^=ico] {width:120px; height:120px; min-width:120px; padding:14px;}

.section[class*=bg_] .infoIcoWrap [class^=ico] {background-color:#fff;}
.section[class*=bg_] .infoIcoWrap.round:last-child {margin-bottom:0;}

.infoIcoWrap.block {flex-wrap:wrap; justify-content:center;}
.infoIcoWrap.block .info {width:100%; margin-top:20px; padding-left:0 !important; text-align:center;}
.infoIcoWrap.block .tit {margin:0 0 10px 0; font-size:1.8rem;}
.infoIcoWrap.block .desc {margin:10px 0 0 0; color:#959595; font-size:1.4rem;}
.infoIcoWrap.block p + p {margin:10px 0 0 0;}

.infoIcoWrap.link > a {display:flex; width:100%;}
.infoIcoWrap.link > a .info {color:#222;}
.infoIcoWrap.link > a .num {display:block; color:#5642bf; font-size:2.2rem; font-weight:500;}

.infoIcoWrap.etc {margin-top:20px;}
.infoIcoWrap.etc [class^=ico] {width:64px; height:64px; min-width:64px; padding:16px; border-radius:20px;}

/* 고객센터 전화번호 */
.telInfo {font-size:1.4rem;}
.telInfo .tel {color:#5642bf !important; font-size:2.1rem; font-weight:500;}
.telInfo .desc {display:inline-block;}
.alert .telInfo .tel {font-size:1.8rem;}

/* 분류선택 리스트 */
.resulBtnList {display:flex; flex-wrap:wrap; margin:35px -4px 0;}
.resulBtnList > li {width:calc(50% - 8px); margin:4px;}
.resulBtnList > li:nth-child(2n-1):last-child {width:100%;}
.resulBtnList .btn_t,
.resulBtnList .ipt + label {min-height:44px; height:100%; margin:0; padding:5px 32px; border:0; border-radius:50px; color:#222; font-size:16px; font-weight:300; background-color:#f2f2f2; text-align:center;}
.resulBtnList .ipt + label {display:flex; justify-content:center; align-items:center; width:100%;}
.resulBtnList .ipt + label:before {content:none;}
.resulBtnList > li.on .btn_t,
.resulBtnList .ipt:checked + label {background-color:#fff; color:#445fe6; border:1px solid #5d88fb;}
.popup .resulBtnList > li {width:100%;}
.formList .resulBtnList {margin-top:0;}

/* 동의 등급 */
.termsState {display:flex; margin:15px 0; padding:6px 0 8px; border-radius:4px; background-color:#f8f8f8;}
.termsState [class^=flag_prd] {position:relative; width:100%; min-width:0; height:24px; margin:0; padding:0; background-color:transparent; line-height:24px; z-index:0;}
.termsState [class^=flag_prd]::before {content:''; position:relative; top:-2px; display:inline-block; width:8px; height:8px; margin-right:4px; border-radius:50%; box-sizing:border-box; vertical-align:middle;}
.termsState [class^=flag_prd]::after {content:''; position:absolute; top:50%; left:-9.2%; width:18.4%; height:1px; z-index:-1;}
.termsState [class^=flag_prd]:first-child::after {content:none;}
.termsState [class^=flag_prd].on::before {width:16px; height:16px; background-image:url(../../assets/images/smart/content/ico_terms_state_chk.png); background-repeat:no-repeat; background-position:center center; background-size:12px auto;}

.termsState .flag_prd6::before {background-color:#445fe6;}
.termsState .flag_prd1::before {background-color:#009cc3;}
.termsState .flag_prd1::after {background-color:#ccebf3;}
.termsState .flag_prd8::before {background-color:#3e9100;}
.termsState .flag_prd8::after {background-color:#d3e3c6;}
.termsState .flag_prd9::before {background-color:#ec750d;}
.termsState .flag_prd9::after {background-color:#f6dec9;}
.termsState .flag_prd4::before {background-color:#e11409;}
.termsState .flag_prd4::after {background-color:#f3cac8;}
.termsState .flag_prd12 {color:#A38B29 ;}
.termsState .flag_prd12::before {background-color:#A38B29 ;}
.termsState .flag_prd12::after {background-color:#d3e3c6;}

.giftStep > li {position:relative; margin:26px 0 13px;}
.giftStep > li:not(:first-child):before {content:''; position:absolute; top:-26px; bottom:100%; left:0; width:100%; background:url(../../assets/images/smart/content/step_gift_dot.png) no-repeat 50% 50%;}
.giftStep > li .num {font-size:1.4rem; color:#5642bf;}
.giftStep > li .icoL {display:inline-block; width:60px; height:60px; margin-right:10px; border-radius:50%; vertical-align:middle;}
.giftStep > li .gift1 {background:#fff url(../../assets/images/smart/content/step_gift_1.png) no-repeat 50% 50%;}
.giftStep > li .gift2 {background:#fff url(../../assets/images/smart/content/step_gift_2.png) no-repeat 50% 50%;}
.giftStep > li .gift3 {background:#fff url(../../assets/images/smart/content/step_gift_3.png) no-repeat 50% 50%;}
.giftStep > li .gift4 {background:#fff url(../../assets/images/smart/content/step_gift_4.png) no-repeat 50% 50%;}
.notiBox.ac .giftStep {display:inline-block; text-align:left;}

/* 검색결과 */
.accoList.srch {border-color:#222;}
.accoList.srch .accoHead .infoList {align-items:center;}
.accoList.srch .accoHead .infoList .tit {font-size:1.8rem;}
.accoList.srch .accoHead .infoList .money {color:#445fe6; font-weight:500;}
.accoList.srch .accoBody {padding-top:32px; padding-bottom:32px;}
.accoList.srch .accoBody .btnGroup {margin-bottom:0;}

.infoList.stateTxt > li {padding-bottom:0;}
.accoList.srch .accoHead .cate {display:block; font-size:1.4rem; font-weight:300; color:#666;}
.accoList.srch .accoHead .state {margin:0; color:#3e9100; font-size:1.8rem; font-weight:300 !important;}
.stateTxt .item:before,
.accoList.srch .accoHead .state:before {content:""; position:relative; top:-2px; display:inline-block; width:16px; height:16px; margin:0 5px 0 0; vertical-align:middle; border-radius:50%; background-color:#3e9100;}

.insuGraph {margin-bottom:64px;}
.insuGraph .bgGrayArea {position:relative; padding-top:64px; padding-bottom:64px; text-align:center;}
.insuGraph .bgGrayArea .graph {margin-bottom:30px;}
.insuGraph .bgGrayArea .legend {display:inline-block; text-align:left;}
.insuGraph .bgGrayArea .legend span {display:block; position:relative; padding-left:30px; font-size:1.4rem; color:#222;}
.insuGraph .bgGrayArea .legend span:before {content:""; position:absolute; top:50%; left:0; display:inline-block; width:18px; height:6px; transform:translateY(-50%);}
.insuGraph .bgGrayArea .legend span + span {margin-top:4px;}
.insuGraph .bgGrayArea .legend .lg1:before {background:#666;}
.insuGraph .bgGrayArea .legend .lg2:before {background:#3e9100;}
.insuGraph .bgGrayArea .legend .lg3:before {background:#5642bf;}
.insuGraph .titH2 {margin:60px 0;}

.insuGraph .barWrap {position:relative; height:6px; margin:42px 0 30px; background-color:#d5d5ef;}
.insuGraph .bar {position:absolute; top:0; left:0; height:6px; background-color:#3e9100;}
.insuGraph .bar:after {content:""; position:absolute; top:-2px; right:0; width:1px; height:10px;}
.insuGraph .myData {position:absolute; bottom:19px; right:-1px; padding:5px 10px; text-align:center; font-size:1.4rem; color:#fff; background-color:#3e9100; box-shadow:10px 10px 18px rgba(0,0,0,0.12); transform:translateX(50%);}
.insuGraph .myData:after {content:""; position:absolute; bottom:-12px; left:50%; margin-left:-8px; width:0; height:0; border-width:6px; border-style:solid; border-color:transparent; border-top-color:#3e9100;}
.insuGraph .infoList.stateTxt .item {font-size:1.6rem;}
.insuGraph .tooltip .infoList.stateTxt .item {font-size:1.4rem;}
.accoBody .insuGraph {margin:0;}
.accoBody .insuGraph .infoList .val {font-size:1.8rem;}
.accoBody .insuGraph .infoList .val.pointC5 {font-weight:500;}

.insuGraph .barWrap.vertical {margin-bottom:0; padding-left:58.72%; padding-right:15px; height:auto; border-bottom:1px solid #ccc; background-color:transparent;}
.insuGraph .barWrap.vertical .bar {position:relative; height:240px; background-color:#eee; box-shadow:10px 10px 18px rgba(0,0,0,0.12);}
.insuGraph .barWrap.vertical .bar:after,
.insuGraph .barWrap.vertical .myData:after {content:none;}
.insuGraph .barWrap.vertical .myData {bottom:0; left:0; right:0; display:flex; height:0; padding:0; align-items:center; justify-content:center; transform:none; box-shadow:none; overflow:hidden;}
.insuGraph .barWrap.vertical .stateTxt {position:absolute; bottom:30px; left:0; width:122px; margin:0;}
.insuGraph .barWrap.vertical .grid {position:absolute; right:0; top:0; width:8px; z-index:1;}
.insuGraph .barWrap.vertical .grid > span {position:relative; display:block; height:48px; border-bottom:1px solid rgba(211,211,211,0.4);}
.insuGraph .barWrap.vertical .grid > span:after {content:''; display:block; height:24px; border-bottom:1px solid rgba(211,211,211,0.4); box-sizing:border-box;}
.insuGraph .barWrap.vertical .grid > span:last-child {border-color:transparent;}

.stateTxt .item,
.normal [class^=titH] .state {color:#3e9100;}
.enough [class^=titH] .state,
.stateTxt .enough .item,
.accoList.srch .enough .accoHead .state {color:#5455d9;}
.stateTxt .enough .item:before,
.enough .barWrap .bar,
.enough .barWrap .myData,
.accoList.srch .enough .accoHead .state:before {background-color:#5455d9;}
.enough .barWrap .bar:after {background-color:#5051d0;}
.enough .barWrap .myData:after {border-top-color:#5455d9;}
.insuff [class^=titH] .state,
.stateTxt .insuff .item,
.accoList.srch .insuff .accoHead .state {color:#e91b10;}
.stateTxt .insuff .item:before,
.insuff .barWrap .bar,
.insuff .barWrap .myData,
.accoList.srch .insuff .accoHead .state:before {background-color:#e91b10;}
.insuff .barWrap .bar:after {background-color:#c22536;}
.insuff .barWrap .myData:after {border-top-color:#e91b10;}

/* 상품리스트 */
.boxList {margin-bottom:32px;}
.boxList > .date {margin:32px 0 10px; color:#222;}
.boxList > .date:first-child {margin-top:0;}
.boxList .infoBox {border-color:#ddd; border-radius:0;}
.boxList .infoBox > .inner:not(a) {padding:23px 0;}
.boxList .infoBox > .inner > .single {position:relative; top:0; left:0; display:block; margin-bottom:17px;}
.boxList .infoBox .step {margin-bottom:8px; font-size:1.4rem; color:#5642bf; font-weight:500;}
.boxList .infoBox .tit {padding-right:0 !important; font-size:1.8rem; font-weight:500;}
.boxList .infoBox .btnGroup {width:auto; margin:0 -23px; padding-bottom:0; border-top:1px solid #ddd;}
.boxList .infoBox .btnGroup [class^=btn_] {position:relative; min-height:52px; background:none; border:none; font-size:1.6rem !important; font-weight:300;}
.boxList .infoBox .btnGroup [class^=btn_] + [class^=btn_]:before {content:''; position:absolute; top:15px; bottom:15px; left:-2px; border-left:1px solid #ddd;}
.boxList .infoBox .btnGroup .btn_g {color:#444;}
.boxList .infoBox .infoList:not(.half) {margin-top:8px; overflow:hidden;}
.boxList .infoBox .infoList:not(.half) > li {display:inline-block; width:auto; padding:0;}
.boxList .infoBox .infoList:not(.half) > li:not(:last-child) {margin-right:20px;}
.boxList .infoBox .infoList:not(.half) > li:not(:first-child):before {content:''; position:absolute; left:-11px; top:5px; bottom:4px; /*top:50%; height:13px; margin-top:-6px;*/ border-right:1px solid #ddd;}
.boxList .infoBox .infoList:not(.half) > li .item {display:inline-block; min-width:0; padding-right:0;}
.boxList .infoBox .infoList:not(.half) > li .val {display:inline-block; text-align:left;}
.boxList .infoBox .links {position:absolute; right:24px; top:24px; font-size:1.4rem;}
.boxList .infoBox .state {max-width:80%;}
.boxList .infoBox .txtBox {margin:23px -23px -23px -23px; padding:24px; background-color:#f8f8f8; border-top:1px solid #eee; font-size:1.4rem;}

.boxList.line {border-top:1px solid #222;}
.boxList.line .infoBox {margin-bottom:0; border-width:0 0 1px 0; box-shadow:none;}
.boxList.line .infoBox > .inner {padding:23px 23px 23px 0;}
.boxList.line .infoBox > a.inner:after {top:50%; right:3px; width:11px; height:11px; margin-top:-5px; border-width:2px 2px 0 0; border-color:#222;}

.boxList.line.sm .infoBox {padding:0;}
.boxList.line.sm .infoBox > .inner {padding:14px 0;}
.boxList.line.sm .infoBox > .inner .infoList:not(.half) li:not(:last-child) {margin-right:15px;}
.boxList.line.sm .infoBox > .inner .infoList li:before {content:none;}
.boxList.line.sm .infoBox > a.inner {margin:0;}
.boxList.line.sm .infoBox .infoList {margin-top:18px;}
.boxList.line.sm .infoBox .infoList li {margin-top:5px;}
.boxList.line.sm .infoBox .infoList .block {display:block;}
.boxList.line.sm .infoBox .infoList .val {min-width:0;}

.infoBox.gift {box-shadow:none; border-color:#ddd;}
.infoBox.gift .tit {max-height:44px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.infoBox.gift .btnGroup {width:auto; margin:0 -23px; padding-bottom:0; border-top:1px solid #ddd;}
.infoBox.gift .btnGroup [class^=btn_] {position:relative; min-height:52px; background:none; border:none; font-size:1.6rem !important; font-weight:300;}
.infoBox.gift .btnGroup [class^=btn_] + [class^=btn_]:before {content:''; position:absolute; top:15px; bottom:15px; left:-2px; border-left:1px solid #ddd;}
.infoBox.gift .btnGroup .btn_g {color:#444;}
.infoBox.gift .txtBox {margin:9px -23px -9px -23px; padding:13px 24px; background-color:#f8f8f8; font-size:1.4rem;}
.infoBox.gift .txtBox:last-child {border-bottom-left-radius:8px; border-bottom-right-radius:8px;}
.infoBox.gift .txtBox .infoList > li {padding:5px 0;}
.infoBox.gift .txtBox .flag_special {margin-top:-2px; margin-left:2px; color:#fff; background:#5d88fb;}
.infoBox.gift .txtBox .titArea {padding:10px 0 15px; margin-bottom:10px; border-bottom:1px solid #222;}
.infoBox.gift .txtBox .titArea .links.arrow {color:#666;}
.infoBox.gift .txtBox .titArea .links.arrow:before {border-color:#666;}

/* giftCard */
.giftCard {position:relative; margin-bottom:32px;}
.giftCard div[class^=cardBg] {margin-bottom:15px; padding:65.448% 24px 6px 24px; border-radius:18px; background-repeat:no-repeat; background-position:50% 0; background-size:100% auto;}
.giftCard [class^=cardBg] .msg,
.giftCard [class^=cardBg] .iptWrap {margin:0 0 10px;}
.giftCard [class^=cardBg] .msg,
.giftCard [class^=cardBg] textarea.ipt {min-height:100px; border-color:transparent; border-radius:8px; font-size:1.4rem;}
.giftCard .cardBg1 {background-color:#ffdb7c; background-image:url(../../assets/images/smart/content/img_gift_card01.png);}
.giftCard .cardBg2 {background-color:#ffdee9; background-image:url(../../assets/images/smart/content/img_gift_card02.png);}
.giftCard .cardBg3 {background-color:#b8e8ff; background-image:url(../../assets/images/smart/content/img_gift_card03.png);}
.giftCard .cardBg4 {background-color:#dad8fe; background-image:url(../../assets/images/smart/content/img_gift_card04.png);}
.giftCard .cardBg5 {background-color:#ffcb87; background-image:url(../../assets/images/smart/content/img_gift_card05.png);}
.giftCard .cardBg6 {background-color:#adecb4; background-image:url(../../assets/images/smart/content/img_gift_card06.png);}
.giftCard .tit {position:absolute; top:28px; left:0; width:100%; text-align:center; font-size:22px; font-weight:500; color:#222;}
.giftCard .msg {min-height:100px; padding:15px; border:1px solid #ccc; background-color:#fff; border-radius:4px; text-align:left;}
.giftCard .fromTo {margin:10px 0 30px 0; font-size:1.4rem; text-align:right;}
.giftCard .fromTo em {color:#222;}
.giftCard [class^=cardBg] .fromTo {margin:0 0 8px 0;}
.giftCard .iptWrap {display:block;}
.giftCard .cardIpt {position:relative; margin:17px -24px 0; padding:8px 18px 0 24px; overflow-x:auto; white-space:nowrap;}
.giftCard .cardIpt > li {display:inline-block; margin-right:6px;}
.giftCard .cardIpt > li .ipt[type=radio] + label {padding:24px 30px; border-radius:8px; background-image:none;}
.giftCard .cardIpt > li .ipt[type=radio] + label:before {background-color:transparent; border:0;}
.giftCard .cardIpt > li .ipt[type=radio]:checked + label:before {top:-8px; left:auto; right:-8px; background-color:#222; border:0; box-shadow:none;}
.giftCard .cardIpt > li .ipt[type=radio]:checked + label:after {content: ''; position:absolute; top:-2px; right:0; width:6px; height:12px; border:1px solid #fff; border-width:0 2px 2px 0; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}

.digital .swiperWrap .summaryCard .summary .infoBox {padding:0;}
.digital .swiperWrap .summaryCard .summary .infoBox > .inner {padding:16px 24px 19px;}
.digital .swiperWrap .summaryCard .summary .tit {font-size:1.6rem; font-weight:300;}
.digital .swiperWrap .summaryCard > .linkArea {margin-top:-15px; padding:0 24px 19px; font-size:1.4rem; color:#222;}
.digital .swiperWrap .summaryCard > .linkArea .links {font-size:1.4rem;}
.digital .swiperWrap .summaryCard > .linkArea .links:first-child {margin-left:0;}
.digital .summaryList .infoBox > .linkArea {margin-top:-15px; padding:0 0 23px; text-align:left; font-size:1.4rem; color:#222;}
.digital .summaryList .infoBox > .linkArea .links {font-size:1.4rem;}
.digital .summaryList .infoBox > .linkArea .links:first-child {margin-left:0;}

/* etc */
.titCopy {margin-bottom:30px; font-size:2rem; color:#222;}
.titCopy .tit {margin-bottom:5px;}
.titCopy .desc {font-size:1.6rem; color:#666; font-weight:300;}
.titCopy .icoBtn_open {width:auto; height:44px; margin:4px 0; padding-right:20px; border-bottom:2px solid #222; font-size:1.8rem; vertical-align:baseline;}
.titCopy .icoBtn_open:after {left:auto; right:0;}
.titCopy.lg {margin-bottom:50px; font-size:2.8rem; font-weight:500;}
.titCopy.sm {font-size:1.6rem;}

.btn_s.m.close > span {padding-right:27px;}
.btn_s.m.close > span::after {content:''; position:absolute; right:0; top:50%; width:9px; height:9px; margin-top:3px; border:1px solid #222; border-width:0 1px 1px 0; box-sizing:border-box; transform:translate(-50%, -50%) rotate(-135deg);}
.btn_arrow.lineBlue {margin:10px 0 4px; padding-top:17px; padding-bottom:17px; border-color:#d6e1fe; background-color:#f2f6ff; color:#444; border-radius:0; font-size:1.6rem; font-weight:500;}
.btn_arrow.lineBlue:after {border-color:#445fe6;}

/* 별점등록 */
.iptStar {position:relative; width:250px; margin-top:20px; font-size:0; z-index:0; background:url(../../assets/images/smart/content/ico_review_star.png) no-repeat 0 0;}
.iptStar .ipt + label {position:static; width:35px; height:35px; margin-right:15px; padding-left:0; box-sizing:border-box;}
.iptStar .ipt + label:before {content:none;}
.iptStar .ipt + label:after {content:''; position:absolute; top:0; left:0; bottom:0; background:url(../../assets/images/smart/content/ico_review_star.png) no-repeat 0 -35px; z-index:-1;}
.iptStar .ipt:checked + label {opacity:1;}
.iptStar .ipt:nth-of-type(1):checked + label:after {width:20%;}
.iptStar .ipt:nth-of-type(2):checked + label:after {width:40%;}
.iptStar .ipt:nth-of-type(3):checked + label:after {width:60%;}
.iptStar .ipt:nth-of-type(4):checked + label:after {width:80%;}
.iptStar .ipt:nth-of-type(5):checked + label:after {width:100%;}

.iptStar.sm {margin:20px auto 30px; width:194px; height:24px; background:url(../../assets/images/smart/content/ico_review_star_sm.png) no-repeat 0 0;}
.iptStar.sm .ipt + label {width:24px; height:24px; margin-right:18px;}
.iptStar.sm .ipt + label:last-child {margin-right:0;}
.iptStar.sm .ipt + label:after {background:url(../../assets/images/smart/content/ico_review_star_sm.png) no-repeat 0 -24px;}

/* 보험가입 진행순서 */
.insuStepBox {margin:20px 0; counter-reset:count;}
.insuStepBox > li > .block {position:relative; color:#445fe6; padding:25px 30px 25px 64px; background-color:#f7f9ff; border-radius:8px; overflow:hidden;}
.insuStepBox > li > .block:before {content:counter(count); counter-increment:count; position:absolute; top:25px; left:30px; width:23px; height:23px; text-align:center; line-height:23px; color:#fff; font-size:13px; font-weight:500; background-color:#5d88fb; border-radius:50%; z-index:1;}
.insuStepBox > li .arrow {display:block; padding:20px 30px 20px 64px; color:#666; font-size:1.4rem; background:url(../../assets/images/smart/content/step_box_arrow.png) no-repeat 36px 50%; background-size:14px auto;}
.insuStepBox > li.finished > .block {padding-right:80px;}
.insuStepBox > li.finished > .block:after {content:''; position:absolute; top:0; left:0; right:0; bottom:0; background-color:rgba(0,0,0,0.5); z-index:1;}
.insuStepBox > li.finished > .block .flag_prd1 {position:absolute; top:50%; right:30px; margin:-14px 0 0 0; z-index:2;}

/* 컨텐츠 슬라이드 */
.conSlider {margin:0 -24px;}
.conSlider .swiper-slide {padding:0 24px;}
.conSlider .btnArea {margin-bottom:0;}

/* 이벤트 참여 */
.eventEntry .titH2 {margin-bottom:5px;}
.eventEntry .formList {margin:22px 0;}
.eventEntry .infoDetail {margin:22px 0; padding:24px;}
.eventEntry .infoDetail .infoList .item {width:40%; min-width:40%; flex-grow:0; color:#222; font-weight:500;}
.eventEntry .infoDetail .infoList .val {min-width:0; text-align:left; font-size:1.6rem;}
.eventEntry [class^=btn_].m {margin-top:24px; margin-bottom:32px;}

/* 디지털보험 상단유형 */
.digital .summary .relatChange {margin:0; padding:0 24px; background-color:transparent; line-height:2;}
.digital .summary .relatChange .selectWrap {top:-4px; vertical-align:middle;}
.digital .summary .relatChange select.ipt {min-width:125px; height:44px; border-color:#fff; background:url(../../assets/images/smart/common/ico_arrow_down_w.svg) no-repeat right -3px center; font-size:2.0rem; color:#fff; font-weight:300;}
.digital .summary .relatChange .btn_p.m {display:inline-block; width:auto; margin:21px 0 0 0; padding:5px 15px; background-color:#fff; border-color:transparent; color:#5642bf; font-weight:500;}
.digital .summary .relatChange em {color:#fff;}

.digital .summary.sm > .inner {padding-bottom:48px;}

.digital .summary.lg > .inner {padding-bottom:104px;}
.digital .summary.lg .swiperWrap {margin-top:-56px; padding-bottom:22px;}
.digital .summary.lg .swiperWrap .swiper-container {padding:0 16px 0 24px;}
.digital .swiperWrap .infoBox {margin:0; padding:0 8px 24px 0;}
.digital .swiperWrap .infoBox:only-child {padding-left:24px; padding-right:24px;}
.digital .swiperWrap .infoBox > .inner {margin:0; padding:40px 30px; border-radius:0;}
.digital .swiperWrap .infoBox .tit {font-size:1.8rem; font-weight:500;}
.digital .swiperWrap .infoBox .infoList:not(.half) {margin-top:25px; display:flex; width:auto; overflow:hidden;}
.digital .swiperWrap .infoBox .infoList:not(.half) > li {display:block; width:auto; margin-right:60px; padding:0;}
.digital .swiperWrap .infoBox .infoList:not(.half) > li:last-child {margin-right:0;}
.digital .swiperWrap .infoBox .infoList:not(.half) > li:not(:first-child):before {content:''; position:absolute; left:-30px; top:5px; bottom:4px; /*top:50%; height:13px; margin-top:-6px;*/ border-right:1px solid #ddd;}
.digital .swiperWrap .infoBox .infoList:not(.half) > li .item {padding-right:0;}
.digital .swiperWrap .infoBox .infoList:not(.half) > li .val {text-align:left; font-size:1.8rem;}
.digital .swiperWrap .infoBox .infoList:not(.half) > li .val.pointC5 {font-weight:500;}

/* 보험계약상세차트 */
.digiPrdSum {text-align:center;}
.digiPrdSum .state {margin-bottom:7px;} 
.digiPrdSum .tit {color:#222; font-size:2rem; font-weight:500;}
.digiPrdSum .addInfo {margin-top:15px; font-size:1.6rem;}
.digiPrdSum .infoList {margin:30px 0; padding-top:20px; border-top:1px solid #ddd;}
.digiPrdSum .infoList.half {position:relative; display:flex; flex-wrap:wrap;}
.digiPrdSum .infoList.half:before {content:''; position:absolute; left:50%; top:20px; bottom:0; border-left:1px solid #ddd;}
.digiPrdSum .infoList.half > li {width:50%; padding:0 15px; float:none !important; text-align:left !important;}
.digiPrdSum .infoList.half > li > div {display:inline-block !important;}
.digiPrdSum .graphArea {position:relative; margin:50px 0 30px; padding:140px 15px 0;}
.digiPrdSum .graphArea::after {display:block; content:''; clear:both;}
.digiPrdSum .graphArea .date {float:left; font-size:1.4rem; text-align:left;}
.digiPrdSum .graphArea .date > span {display:block;}
.digiPrdSum .graphArea .date:nth-of-type(2) {float:right; text-align:right;}
.digiPrdSum .graphAni {position:absolute; left:0; top:0; width:100%; height:126px; overflow:hidden;}
.digiPrdSum .graphAni::after {content:''; position:absolute; left:50%; top:6px; width:240px; height:240px; border:12px solid #ddddf8; border-radius:50%; transform:translateX(-50%); box-sizing:border-box; z-index:0;}
.digiPrdSum .graphAni .bar {position:absolute; left:50%; top:6px; width:240px; height:240px; border:12px solid #715deb; border-top:12px solid transparent; border-right:12px solid transparent; border-radius:50%; transform:translateX(-50%) rotate(-45deg); z-index:1; transition: transform 0.5s ease-out;}
.digiPrdSum .graphAni .bar::before {content:''; position:absolute; left:27px; top:16px; width:1px; height:25px; background-color:#715deb; transform:rotate(-45deg); box-sizing:border-box;}
.digiPrdSum .paymentsNum {display:flex; position:absolute; flex-flow:column-reverse; left:50%; top:78px; color:#222; font-size:1.4rem; font-weight:500; line-height:1.3; transform:translateX(-50%);}
.digiPrdSum .paymentsNum .current {color:#715deb; font-size:2.4rem;}

.digital .summary .titArea {margin:0; padding:30px 8px 0 8px;}
.digital .summary .titArea [class^=tit] {color:#fff; font-size:32px;}
.digital .summary .titArea .desc {width:100%; margin-top:20px; font-size:18px;}

 /* 디지털보험 보험계약스퀘어 연결페이지 */
 .digital .prdSumNoticeImg {width: 170px; margin: 0 auto; margin-top: 74px; margin-bottom: 24px;}
 .digital .prdSumNotice p {text-align: center;}
 .digital .btn_s.b {font-size: 16px; background-color: #f2f6ff; border-color:#d6e1fe; color:#445fe6; min-height: 45px; margin-top: 24px;}
 .digital .prdSumNoticeT {margin-top: 64px; border-top: 1px solid #bbb; border-bottom: 1px solid #bbb; padding: 12px 0px; margin-bottom: 0px; text-align: center;}
 .digital .mt24{margin-top: 24px;}
 .digital .mt12{margin-top: 12px;}
 .digital .mt7{margin-top: 7px;}

/* 통합보장분석 상세 */
.insuGuarList {margin:20px 0;}
.insuGuarList > li {position:relative; margin-bottom:8px; padding:19px 22px 20px; border:1px solid #ddd; background:#fff; border-radius:4px; box-shadow:8px 8px 14px rgba(0,0,0,0.08);}
.insuGuarList .desc {margin-bottom:3px; font-size:14px; color:#666;}
.insuGuarList .tit {margin-bottom:8px; color:#222; font-weight:500;}
.insuGuarList .info > * {display:block; font-size:14px;}
.insuGuarList .info em {color:#445fe6; font-weight:300;}

/* 예상보험금 */
.iptFilt.tab3 {display:flex; flex-wrap:wrap; width:calc(100% + 8px); margin:0 -4px;}
.iptFilt.tab3 > li {display:block; width:calc(50% - 8px); margin:0 4px;}
.iptFilt.tab3 .ipt + label {border-radius:44px !important; border:1px solid #ccc;}
.iptFilt.tab3 .ipt + label::after {content:none !important;}
.iptFilt.tab3 .ipt:checked + label {border-color:#5d88fb;}
.iptFilt.tab3 .ipt:focus + label {border-color:#000;}
.iptFilt.tab3.vertical > li {width:100%;}

.digital.insuExpect .summary {margin-top:-26px;}
.digital.insuExpect .summary > .inner {padding:32px 24px; background-color:#f2f6ff; color:#222;}
.digital.insuExpect .summary .relatChange {padding:0; font-size:1.8rem;}
.digital.insuExpect .summary .relatChange em {color:#445fe6; font-weight:500;}
.digital.insuExpect .summary .relatChange .selectWrap {margin:0;}
.digital.insuExpect .summary .relatChange .selectWrap:after {content:''; position:absolute; top:50%; right:0; width:10px; height:10px; margin-top:-3px; border:1px solid #445fe6; border-width:0 2px 2px 0; box-sizing:border-box; transform:translate(-50%, -50%) rotate(45deg); transition:all 0.25s;}
.digital.insuExpect .summary .relatChange select.ipt {min-width:0; height:30px; font-size:1.8rem; color:#445fe6; font-weight:500; border-bottom:none; background:none;}
.digital.insuExpect .summary .relatChange .btn_p.m {width:100%; background-color:#715deb; color:#fff;}
.digital.insuExpect .summary .graph {margin-top:20px;}

.digital.insuExpect .iptFilt.tab3 .ipt:checked + label {border-color:#3e3e6b; background-color:#3e3e6b; color:#fff;}
.digital.insuExpect .iptFilt.tab3 .ipt:focus + label {border:1px solid #000;}
.digital.insuExpect .keyword.nowrap .flag_srch:before {content:'#'; margin-right:5px;}

.digital.insuExpect .accoList.srch {margin:0; border-top:none;}
.digital.insuExpect .accoList.srch > li {margin-bottom:10px; padding-bottom:20px; border-bottom:none; background-color:#fff; border-radius:8px;}
.digital.insuExpect .accoList.srch .accoHead > .inner {padding:20px 0 0 24px;}
.digital.insuExpect .accoList.srch .accoHead div.infoList .tit {width:100%; font-size:1.6rem;}
.digital.insuExpect .accoList.srch .accoHead div.infoList > div:not(.tit) {display:flex; justify-content:space-between; flex-wrap:wrap; width:calc(100% + 46px); margin:20px -46px 0 0; padding:10px 0 0 0; border-top:1px solid #ddd; text-align:left;}
.digital.insuExpect .accoList.srch .accoHead div.infoList .val {margin-left:auto;}
.digital.insuExpect .accoList.srch .accoHead .icoBtn_acco {top:20px; right:24px; width:24px; height:24px; border-radius:50%; background-color:#715deb; transform:none;}
.digital.insuExpect .accoList.srch .accoHead .icoBtn_acco:after {width:8px; height:8px; margin-top:-2px; border-color:#FFF;}
.digital.insuExpect .accoList.srch .accoItem.on > .accoHead .icoBtn_acco {background-color:#e8e4ff;}
.digital.insuExpect .accoList.srch .accoItem.on > .accoHead .icoBtn_acco:after {margin-top:1px; border-color:#715deb;}
.digital.insuExpect .accoList.srch .accoBody {padding-top:0; padding-bottom:0; background-color:transparent;}
.digital.insuExpect .accoList.srch .accoBody .tblInfo {margin:0; padding:3px 0;}
.digital.insuExpect .accoList.srch .accoBody .infoList + .infoList {margin-top:0; padding-top:0; border-top:none;}
.digital.insuExpect .accoList.srch .accoBody .infoList > li {padding:3px 0;}
.digital.insuExpect .accoList.srch .accoBody .btnGroup {margin-top:15px;}

.digital.insuExpect .formList.srch {margin:0 -24px; padding:26px 24px; background-color:#3e3e6b;}
.digital.insuExpect .formList.srch .selectWrap {margin:5px 0;}
.digital.insuExpect .formList.srch select.ipt {border-radius:44px; border-color:transparent;}

.digital.insuExpect .btnArea.sticky:last-child {margin:0 -24px -32px;}

/* 예상보험금 class수정으로인한 내용 */

.content2.digital .ipt[disabled] {background-color: transparent !important;}
.digital.content2 .summary .relatChange {padding:0; font-size:1.8rem;}
.digital.content2 .summary .relatChange em {font-weight:500;}
.digital.content2 .summary .relatChange .selectWrap {margin:0;}
.digital.content2 .summary .relatChange .selectWrap:after {content:''; position:absolute; top:50%; right:0; width:10px; height:10px; margin-top:-3px; border:1px solid #ffffff; border-width:0 2px 2px 0; box-sizing:border-box; transform:translate(-50%, -50%) rotate(45deg); transition:all 0.25s;}
.digital.content2 .summary .relatChange select.ipt {min-width:0; height:30px; font-size:1.8rem; color:#fff; font-weight:500; background:none;}
.digital.content2 .summary .relatChange .btn_p.m {width:100%; background-color:#fff; color:#715deb;}
.digital.content2 .summary .graph {margin-top:20px;}

.digital.content2 .keyword.nowrap .flag_srch:before {content:'#'; margin-right:5px;}

.digital.content2 .accoList.srch {margin:0; border-top:none;}
.digital.content2 .accoList.srch > li {margin-bottom:10px; padding-bottom:20px; border-bottom:none; background-color:#fff; border-radius:8px;}
.digital.content2 .accoList.srch .accoHead > .inner {padding:20px 0 0 24px;}
.digital.content2 .accoList.srch .accoHead div.infoList .tit {width:100%; font-size:1.6rem;}
.digital.content2 .accoList.srch .accoHead div.infoList > div:not(.tit) {display:flex; justify-content:space-between; flex-wrap:wrap; width:calc(100% + 46px); margin:20px -46px 0 0; padding:10px 0 0 0; border-top:1px solid #ddd; text-align:left;}
.digital.content2 .accoList.srch .accoHead div.infoList .val {margin-left:auto;}
.digital.content2 .accoList.srch .accoHead .icoBtn_acco {top:20px; right:24px; width:24px; height:24px; border-radius:50%; background-color:#715deb; transform:none;}
.digital.content2 .accoList.srch .accoHead .icoBtn_acco:after {width:8px; height:8px; margin-top:-2px; border-color:#FFF;}
.digital.content2 .accoList.srch .accoItem.on > .accoHead .icoBtn_acco {background-color:#e8e4ff;}
.digital.content2 .accoList.srch .accoItem.on > .accoHead .icoBtn_acco:after {margin-top:1px; border-color:#715deb;}
.digital.content2 .accoList.srch .accoBody {padding-top:0; padding-bottom:0; background-color:transparent;}
.digital.content2 .accoList.srch .accoBody .tblInfo {margin:0; padding:3px 0;}
.digital.content2 .accoList.srch .accoBody .infoList + .infoList {margin-top:0; padding-top:0; border-top:none;}
.digital.content2 .accoList.srch .accoBody .infoList > li {padding:3px 0;}
.digital.content2 .accoList.srch .accoBody .btnGroup {margin-top:15px;}

.digital.content2 .formList.srch {margin:0 -24px; padding:26px 24px; background-color:#3e3e6b;}
.digital.content2 .formList.srch .selectWrap {margin:5px 0;}
.digital.content2 .formList.srch select.ipt {border-radius:44px; border-color:transparent;}

.digital.content2 .btnArea.sticky:last-child {margin:0 -24px -32px;}

.headCp {position:absolute; background-color:#715deb; top:0; left:0; width:100%; height:20px; padding-top:56px;} /*최상단 메뉴컬러 715deb로 변경*/


/* 보험료 지급 현황 */
.payGraphSum {position:relative; margin:45px 0 0; padding:40px 40px 40px 32px; color:#fff; font-size:1.6rem; font-weight:500; background:#715deb; box-shadow:0px 14px 30px rgba(0,66,142,0.2);}
.payGraphSum:before {content:''; display:block; position:absolute; top:-6px; right:16px; width:56px; height:52px; box-sizing:border-box; background:url(../../assets/images/smart/content/ico_chart.png) center top 16px no-repeat #445fe6;}
.payGraphSum:after {content:''; display:block; position:absolute; top:46px; right:16px; border-top:12px solid #445fe6; border-left:28px solid transparent; border-right:28px solid transparent;}
.payGraphSum .infoCell + .infoCell {margin-top:25px;}
.payGraphSum .item {margin-bottom:5px;}
.payGraphSum .val {color:#fff222; font-size:1.6rem;}
.payGraphSum .val .numAni {font-size:2.4rem;}
.payGraphSum .date {margin-top:15px; color:#d6e1fe; font-size:1.4rem; font-weight:300;}

.payGraphList {font-size:0; margin-top:75px;}
.payGraphList > li {font-size:1.6rem;}
.payGraphList > li:last-child {margin-bottom:80px;}
.payGraphList > li + li {margin-top:64px;}
.payGraphList .tit {color:#222; font-size:2rem; font-weight:500;}
.payGraphList .info {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; margin-top:22px;}
.payGraphList .info + .info {margin-top:20px;}
.payGraphList .info .graph {width:100%; height:20px; margin-top:5px; overflow:hidden;}
.payGraphList .info .graph span {display:inline-block; height:20px; vertical-align:top;}
.payGraphList .info.cases .graph {background-color:#eef3ff;}
.payGraphList .info.cases .graph span {background:#5d88fb;}
.payGraphList .info.cases .data em {color:#5d88fb;}
.payGraphList .info.amount .graph {background:#fef9e6;}
.payGraphList .info.amount .graph span {background:url(../../assets/images/cdh/content/img_pay_graph.png) no-repeat;}
.payGraphList .info.amount .data em {color:#e55876;}
.payGraphList .info .data em {padding-right:3px; font-size:1.8rem; letter-spacing:-0.03rem;}

/*신한플러스안내*/
.shPlusCopy {position:relative; text-align:center; z-index:0; font-size:1.4rem;}
.shPlusCopy:before,
.shPlusCopy:after {content:''; position:absolute; background-position:0 0; background-repeat:no-repeat; background-size:cover; z-index:-1;}
.shPlusCopy:before {left:-14px; top:28px; width:82px; height:104px; background-image:url(../../assets/images/cdh/content/shplus_character_1_m.png);}
.shPlusCopy:after {right:-21px; top:14px; width:92px; height:117px; background-image:url(../../assets/images/cdh/content/shplus_character_2_m.png);}
.shPlusCopy > .inner {position:relative; z-index:1;}
.shPlusCopy em {display:block; padding-top:7px; font-size:2.0rem; line-height:1.3;}
.shPlusCopy .btn_p {margin-top:17px;}

.swiperWrap.shPlusInfo {padding-bottom:30px !important;}
.swiperWrap.shPlusInfo .slideList > li {padding:0 24px;}
.swiperWrap.shPlusInfo .slideList .block {text-align:center; font-size:1.4rem;}
.swiperWrap.shPlusInfo .slideList .block .img {width:230px; margin:0 auto; height:425px; padding:12px; background:transparent url(../../assets/images/cdh/content/shplus_phone_bg.png) no-repeat center 0; background-size:cover;}
.swiperWrap.shPlusInfo .slideList .block .img > img {position:relative; width:100%; z-index:-1;}
.swiperWrap.shPlusInfo .slideList .block [class*=shPlus] {display:inline-block; height:36px; margin:10px 0 11px; padding:0 15px; border-radius:18px; background-color:#715deb; color:#fff; font-weight:500; line-height:36px; vertical-align:top;}
.swiperWrap.shPlusInfo .slideList .block .shPlus2 {background-color:#5d88fb;}
.swiperWrap.shPlusInfo .slideList .block .shPlus3 {background-color:#00b2bc;}
.swiperWrap.shPlusInfo .swiper-counter {background-color:transparent; color:#999;}
.swiperWrap.shPlusInfo .swiper-counter em {color:#222;}
.swiperWrap.shPlusInfo .btnPrev, 
.swiperWrap.shPlusInfo .btnNext {position:absolute; width:50px; height:50px; top:35%; left:0; z-index:3;}
.swiperWrap.shPlusInfo .btnNext {left:auto; right:0;}
.swiperWrap.shPlusInfo .btnPrev:before, 
.swiperWrap.shPlusInfo .btnNext:before {content:''; position:absolute; top:50%; left:12px; width:8px; height:8px; margin:0; border:1px solid #000; border-width:0 0 2px 2px; transform:translateY(-50%) rotate(45deg);}
.swiperWrap.shPlusInfo .btnNext:before {left:auto; right:12px; transform:translateY(-50%) rotate(-135deg);}
.swiperWrap.shPlusInfo .btnPrev:after, 
.swiperWrap.shPlusInfo .btnNext:after {content:''; position:absolute; top:50%; left:12px; width:26px; margin-top:-1px; border:1px solid #000; box-sizing:border-box;}
.swiperWrap.shPlusInfo .btnNext:after {left:auto; right:12px;}

/* 보험가입 후기 */
.reviewBbsList {font-size:0;}
.reviewBbsList > li > .block {height:300px; padding:28px 24px; background:#fff; box-shadow:8px 8px 12px rgba(0,66,142,0.2);}
.reviewBbsList > li + li {margin-top:24px;}
.reviewBbsList .tit {display:-webkit-box; height:56px; color:#222; font-size:1.8rem; font-weight:500; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.reviewBbsList .info {margin-top:13px; color:#5642bf; font-size:14px;}
.reviewBbsList .info span {padding-right:7px;}
.reviewBbsList .info span:first-child {padding-left:0;}
.reviewBbsList .info span:first-child:before {content:none;}
.reviewBbsList .info span:before {content:''; display:inline-block; width:1px; height:16px; margin-top:-2px; padding-right:9px; vertical-align:middle; border-left:1px solid #ddd;}
.reviewBbsList .descDiv {margin:20px 0 0; padding:20px 0 0; border-top:1px solid #eee;}
.reviewBbsList .descDiv .desc {display:-webkit-box; margin-top:18px; color:#666;font-size:16px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical;}

/* 별점 */
.starRating {width:96px; height:16px; overflow:hidden; background:url(../../assets/images/cdh/content/ico_review_star.png) no-repeat 0 0; font-size:13px;}
.starRating span {display:inline-block; width:0; height:16px; background:url(../../assets/images/cdh/content/ico_review_star.png) no-repeat 0 -16px;}

/* 보험료 할인 혜택 */
.bttmLineBox {padding:34px 24px 32px 24px; background:#fff;}
.bttmLineBox .inner > li {position:relative; padding:40px 0;}
.bttmLineBox .inner > li:first-child {padding-top:0;}
.bttmLineBox .inner > li:first-child:after {content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background-color:#eee;}
.bttmLineBox .inner > li:last-child {padding-bottom:0;}

.bttmLineBox .inner > li > img {display:block; margin-bottom:25px;}
.bttmLineBox .inner > li img.logo {height:24px;}
.bttmLineBox .inner > li .tit {display:inline-block; margin-bottom:16px; color:#222; font-size:1.6rem; font-weight:500;}
.bttmLineBox .inner > li .desc {color:#666; font-size:1.6rem;}
.bttmLineBox .inner > li .btn_s.s {width:auto; margin-top:20px;}
.bttmLineBox .inner > li .notiBox {margin-bottom:0;}
bttmLineBox .inner > li .notiBox + .txtList.remark {margin-top:20px;}

.bttmLineBox.line {margin-bottom:20px; border:1px solid #ddd; border-radius:4px;}
.bttmLineBox.line .inner > li .btn_s.s {width:100%;}

.bttmLineBox.line .titH2 {margin-bottom:40px;}

.bttmLineBox.line .inner.plus > li:nth-of-type(1) {padding-bottom:70px;}
.bttmLineBox.line .inner.plus > li:nth-of-type(2) {padding-top:70px;}
.bttmLineBox.line .inner.plus > li:nth-of-type(2):before {content:''; position:absolute; top:-37px; left:50%; width:74px; height:74px; border:1px solid #eee; border-radius:50%; background:#fff; transform:translateX(-50%); }
.bttmLineBox.line .inner.plus > li:nth-of-type(2):after {content:''; position:absolute; top:0; left:50%; width:26px; height:26px; background:url(../../assets/images/smart/content/ico_plus.png) no-repeat center center; transform:translate(-50%,-50%); }

.infoStepList {counter-reset: count;}
.infoStepList > li {position:relative; min-height:80px; padding:16px 24px 16px 100px; color:#222;}
.infoStepList > li + li {margin-top:20px;}
.infoStepList > li:before {content:counter(count,decimal-leading-zero); counter-increment: count; position:absolute; top:50%; left:0; width:80px; height:80px; border-radius:50%; background:#ecf6ff; color:#1a75e4; font-size:20px; font-weight:500; line-height:80px; text-align:center; transform:translateY(-50%);}

.pointBnfList > li {padding:28px 28px 40px 30px; border:1px solid #d6e1fe; border-radius:10px; background:#fff; box-shadow: 0 17px 21px rgba(86,66,191,0.05);}
.pointBnfList > li + li {margin-top:16px;}
.pointBnfList > li .img {margin-bottom:25px;}
.pointBnfList > li .img img {width:40px; height:auto;}
.pointBnfList > li .tit {display:block; margin-bottom:10px; color:#222; font-size:1.8rem; font-weight:500;}

/* cs 배너 */
.csBanner {padding:32px 24px; background:#1a75e4; text-align:center;}
.csBanner .infoCell .desc {color:#fff; font-size:1.8rem;}
.csBanner .btnCell {margin-top:32px;}
.csBanner .btnCell a {display:inline-block; width:140px; height:48px; margin:0; border-radius:2px; background:#fff; color:#1a75e4; font-weight:500; line-height:48px;} 

.csBanner.bgPurple{background:#715deb;}
.csBanner.bgPurple .btnCell a{color:#715deb;}

/* 보험배너 */
.insuBnrList {display:-webkit-flex; display:flex; margin:0 -24px; padding:20px 16px 30px 16px; overflow:auto; scroll-snap-type:x mandatory; scroll-padding:24px; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory;}
.insuBnrList > li {-webkit-flex:none; padding:0 8px; position:relative; align-items:start; justify-content:start; scroll-snap-align:start; text-align:center;}
.insuBnrList > li:last-child {padding-right:24px;}
.insuBnrList > li .block {display:block; width:272px; height:100%; padding:30px 25px; background:#fff; box-shadow:9px 9px 20px rgba(45,113,196,0.12); letter-spacing:-0.03rem;}
.insuBnrList > li .block .tit {color:#222; font-size:1.8rem; font-weight:500;}
.insuBnrList > li .block .desc {margin-top:10px; color:#666; font-size:1.4rem;}
.insuBnrList > li .block .imgCont {margin:0 auto;}
.insuBnrList > li .block .imgCont img {width:140px;}

.specialBnf .recommInfo > li {display:inline-block; width:25%; padding:0 8px; font-size:16px;}
.specialBnf .recommInfo > li .block {display:inline-block; width:100%; min-height:216px; padding:40px 30px; border-color:transparent !important; box-shadow:9px 9px 20px rgba(45,113,196,0.12);}
.specialBnf .recommInfo > li .tit {font-size:18px; font-weight:500; color:#222;}
.specialBnf .recommInfo > li .desc {margin:10px 0 20px; color:#666;}
.specialBnf .recommInfo > li .coverage {color:#5d88fb;}


.bnfBtnGroup .btn_arrow {margin:0; padding:29px 80px 29px 30px; font-size:1.6rem; color:#445fe6; border-radius:0; background:#f7f9ff;}
.bnfBtnGroup .btn_arrow + .btn_arrow {margin-top:8px;}
.bnfBtnGroup .btn_arrow:after {right:30px; border-color:#445fe6;}

/* 전체상품 팝업 */
.popup.digiPrdAll header {background-color:#715deb;}
.popup.digiPrdAll header h1 {color:#fff; }
.popup.digiPrdAll .icoBtn_close:before,
.popup.digiPrdAll .icoBtn_close:after {background-color:#fff;}

.digiPrdList > ul > li:not(:last-child) {margin-bottom:12px;}
.digiPrdList .block {display:block; position:relative; min-height:128px; padding:20px 23px 34px; font-size:14px; border:1px solid transparent; background-color:#f8f8f8;}
.digiPrdList .img {position:absolute; right:0; bottom:0; width:120px; height:80px; z-index:0;}
.digiPrdList .tit {position:relative; color:#222; font-size:16px; font-weight:500; z-index:1;}
.digiPrdList .tit > .type {font-size:14px;}
.digiPrdList .desc {position:relative; margin:6px 80px 0 0; color:#666; z-index:1;}

.digiPrdList a.block::before,
.digiPrdList a.block::after {content:''; position:absolute; background-color:#715deb; box-sizing:border-box; z-index:2; transition:all 0.3s;}
.digiPrdList a.block::before {right:-1px; top:-1px; width:0; height:15px;}
.digiPrdList a.block::after {right:-1px; top:-1px; width:15px; height:0;}
.digiPrdList a.block:focus {border-color:#715deb; background-color:#fff;}
.digiPrdList a.block:focus:before {width:32px; height:8px;}
.digiPrdList a.block:focus:after {width:8px; height:32px;}


/* 톡상담 */
.popup .prdBlockList {display:flex; flex-wrap:wrap; justify-content:space-between; width:100%;}
.popup .prdBlockList li {width:calc((100% / 2) - 8px);}
.popup .prdBlockList li:nth-child(n+3) {margin-top:16px;}
.popup .prdBlockList li .ipt[type=radio] + label {display:block; min-height:200px; padding:16px 20px; color:#222; border:1px solid #fff; background:#fff; box-shadow: 12px 0px 57px rgba(45, 113, 196, 0.12);}
.popup .prdBlockList li .ipt[type=radio] + label img {display:block; width:112px; max-width:100%; margin:0 auto;}
.popup .prdBlockList li .ipt[type=radio] + label .tit {display:block; padding-top:20px; font-size:1.4rem; font-weight:500;}
.popup .prdBlockList li .ipt[type=radio] + label:before {content:none;}
.popup .prdBlockList li .ipt[type=radio]:checked + label {border-color:#5642bf; color:#5642bf;}

.section .imgBoxArea {position:relative; margin-bottom:40px;}
.section .imgBoxArea .imgCont {position:relative; margin-bottom:0 !important; z-index:0;}
.section .imgBoxArea .imgBg {position:absolute; left:0; bottom:0; width:100%; text-align:right;}
.section .imgBoxArea .imgBg img {max-width:100%;}
.section .imgBoxArea .inner {padding:30px 16px; background:#fff; border:2px solid #222; border-radius:10px;}
.section .imgBoxArea .inner > * {position:relative; z-index:1;}
.section .imgBoxArea .tit {color:#222; font-weight:500;}
.section .imgBoxArea [class^=txt] {color:#666;}

.section .imgBoxArea.bubble .inner {position:relative;}
.section .imgBoxArea.bubble .inner:after {content:''; position:absolute; bottom:-8px; right:24px; width:10px; height:10px; background-color:#fff; border:2px solid #222; border-width:0 2px 2px 0; transform:rotate(45deg);}
.section .imgBoxArea.bubble .inner + .imgCont {margin-top:40px;}

.section .txtList.star.red {margin-top:40px;}
.section .notiBox .txtList.star.red {margin-top:20px;}
.section .notiBox [class^=txt] + .txtList.star.red {margin-top:5px;}
.section .notiBox.bgWhite .txtS {color:#666;}
.section .links.arrow.basicC1 {margin-left:0;}
.section .links.arrow.basicC1::before {border-color:#222;}

.section .notiBox.bgPurple .txtList.numS.txtS > li {padding-left:28px;}
.section .notiBox.bgPurple .txtList.numS.txtS > li:before {top:0; width:20px; height:20px; line-height:20px; border-color:transparent; background-color:#5642bf; color:#fff;}

.section > .infoDesc {display:block; padding:30px 15px 0; border-color:#222;}
.section > .infoDesc .titH5 {margin-top:30px;}
.section .tblWrap {margin-top:15px;}
.section .tblWrap .bgColor1 {background-color:#f2f6ff;}
.section .tblWrap .bgColor2 {background-color:#fffcef;}
.section .tblWrap .bgColor3 {background-color:#fceef1;}
.section .tblWrap .brt {border-top:2px solid #445fe6;}
.section .tblWrap .brb {border-bottom:2px solid #445fe6;}
.section .tblWrap .brl {border-left:2px solid #445fe6;}
.section .tblWrap .brr {border-right:2px solid #445fe6;}

.section .reviewBbsList {display:-webkit-flex; display:flex; margin:7px -24px 0; padding:20px 16px; overflow:auto; scroll-snap-type:x mandatory; scroll-padding:24px; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory;}
.section .reviewBbsList > li {-webkit-flex:none; display:block; margin:0 !important; padding:0 8px; position:relative; align-items:start; justify-content:start; scroll-snap-align:start;}
.section .reviewBbsList > li:last-child {padding-right:24px;}
.section .reviewBbsList > li > .block {width:312px; height:100%;}
.section .reviewBbsList .descDiv {margin:0; padding:0; border:none;}
.section .reviewBbsList .descDiv .desc {margin:20px 0 37px; color:#222;}
.section .reviewBbsList .info {margin:0; color:#666;}
.section .reviewBbsList .info span{display:inline-block;}

.section ul.helpWrap {margin-top:24px; margin-left:0; margin-right:0; background-color:#fff; border-top:0;}
.section ul.helpWrap > li {border-width:1px 1px 1px 1px;}

/* 디지털보험 직업찾기 아코디언 */
.accoList.job {margin:0 0 32px;}
.accoList.job .accoHead {padding-right:30px;}
.accoList.job .accoHead .inner {padding:24px 0 23px;}
.accoList.job .accoHead .item {font-size:1.6rem; font-weight:500; color:#000;}

.accoList.job > li:first-child .infoList {padding-left:0;}
.accoList.job > li:first-child .infoList::before {content:none;}
.accoList.job > li+li+li .accoHead .infoList {padding-left:32px;}
.accoList.job > li+li+li .accoHead .infoList::before {margin-left:16px;}
.accoList.job .accoHead .infoList {position:relative; padding-left:16px;}
.accoList.job .accoHead .infoList::before {content:''; position:absolute; left:0; top:9px; width:7px; height:8px; border-left:1px solid #aaa; border-bottom:1px solid #666; box-sizing:border-box;}

.accoList.job .accoItem .accoHead .infoList {align-items:center;}
.accoList.job .accoItem .accoHead .infoList .item {max-width:30%;}
.accoList.job .accoItem:last-child .accoHead .infoList .item {text-align:left;}
.accoList.job .accoItem .accoHead .infoList .val {max-width:70%; color:#445fe6; font-weight:300; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.accoList.job .accoItem .icoBtn_acco {width:30px;}
.accoList.job .accoItem .icoBtn_acco:after {left:auto; right:0; transform:translate(-5px, -50%) rotate(45deg); border-color:#715deb;}
.accoList.job .accoItem.on .icoBtn_acco:after {transform:translate(-5px, -50%) rotate(-135deg);}

.accoList.job .accoBody {padding:0; background-color:#fff;}
.accoList.job .accoBody .resulBtnList {margin:0;}

.accoList.job .acco_disabled {border-bottom:0;}
.accoList.job .acco_disabled.on .accoBody {display:block !important;}
.accoList.job .acco_disabled .accoHead .icoBtn_acco:after {content:none;}

.resulBtnList.job {margin:0;}
.resulBtnList.job .btn_t,
.resulBtnList.job .ipt + label {background-color:#f8f8f8; border:0; border-radius:50px; color:#222;}
.resulBtnList.job .ipt:checked + label {background-color:#fff; color:#445fe6; border:1px solid #5d88fb;}

/* 필수 및 선택 동의 팝업 */
.termsAll.extra .ipt + label.allChk {display:flex; justify-content:center; flex-direction:row-reverse; margin-bottom:32px; text-align:center; font-weight:500; color:#5642bf; border-color:#5642bf;}
.termsAll.extra .ipt + label.allChk:after {position:static; display:inline-block; margin:4px 15px 0 0; border-color:#715deb;}
.termsAll.extra .ipt:checked + label.allChk {color:#fff; background-color:#715deb; border-color:#715deb;}
.termsAll.extra .ipt:checked + label.allChk:after {border-color:#fff !important;}
.termsAll.extra .titH3 {margin:32px 0 13px;}
.termsAll.extra .titH4 {margin:18px 0 13px;}
.termsAll.extra .accoItem.on > .accoHead .icoBtn_acco:after {border-color:#aaa;}

.termsAll.extra .tblY td, 
.termsAll.extra .tblY .txtList {color:#222;}
.termsAll.extra .tblY td.th {color:#666; font-weight:300; word-break:keep-all;}
.termsAll.extra .tblY td .titH5 {margin:0 0 5px; color:#666; font-weight:300;}
.termsAll.extra .tblY .iptFilt {width:calc(100% + 6px); margin:10px -3px 0;}
.termsAll.extra .tblY .iptFilt > li {padding:0 3px;}
.termsAll.extra .tblY .iptFilt > li .ipt + label {line-height:32px;}
.termsAll.extra .tblY .iptFilt > li .ipt + label:after {border-radius:0; border-width:1px;}
.termsAll.extra .tblY .iptFilt > li .ipt:checked + label {color:#fff; background-color:#445fe6; border-color:#445fe6;}

.termsAll.extra .notiBox {margin-bottom:40px;}
.termsAll.extra .iptGroup > li label {font-size:1.4rem;}
.termsAll.extra .cascadeWrap {background-color:transparent;}

.termsAll.extra .consentGuide {display:flex; margin:20px 0;}
.termsAll.extra .consentGuide .qrDiv > img {width:54px; height:auto;}
.termsAll.extra .consentGuide .txtList {margin:0 0 0 6px;}

.termsAll.extra .accoList {margin-left:0; margin-right:0; border-top-color:#222;}
.termsAll.extra .accoList > li {border-bottom-color:#ddd;}
.termsAll.extra .accoList .accoBody {padding-left:0; padding-right:0; border-top:1px solid #ddd; background-color:#fff;}
.termsAll.extra .accoList .accoHead > .inner {padding-left:16px;}
.termsAll.extra .accoList .accoHead .tit {font-weight:500; font-size:1.8rem;}
.termsAll.extra .accoList .accoHead .icoBtn_acco {width:55px;}

.termsAll.extra > .accoHead .ipt + label.allChk {display:block; margin:0; border:1px solid #ddd; background-color:#fff; color:#222; font-weight:300; text-align:left;} 
.termsAll.extra > .accoHead .ipt + label.allChk:after {position:absolute; left:20px !important; top:15px !important; width:9px !important; height:14px !important; margin:0; border-color:#eee; border-width:0 3px 3px 0 !important; transition:none;}
.termsAll.extra > .accoHead .ipt:checked + label.allChk {border-color:#5642bf; color:#5642bf; font-weight:500;}
.termsAll.extra > .accoHead .ipt:checked + label.allChk:after {border-color:#715deb !important;}
.termsAll.extra > .accoHead .ipt:focus + label.allChk {border-color:#5642bf;}
.termsAll.extra .termsWrap .accoBody {background-color:#fff;}

/* 셀렉트 형태 버튼 */
.icoBtn_open.sel {display:block; width:100%; height:auto; padding:10px 35px 10px 15px; border:1px solid #ccc; border-radius:4px; font-size:1.6rem; text-align:left; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.icoBtn_open.sel:after {width:10px; height:10px; left: auto; right: 10px; margin-top: -2px !important; border-color: #222; transform: translate(-50%, -50%) rotate(-45deg) !important;}
.icoBtn_open.sel .cond {margin-left:-6px;}
.icoBtn_open.sel .cond:after {content:'/'; display:inline-block;}
.icoBtn_open.sel .cond:only-child:after,
.icoBtn_open.sel .cond:last-child:after {content:none;}

/* 확인 체크 버튼 */
.chkBtn .btn_p {border-color:#5642bf; color:#5642bf; background-color:#fff;}
.chkBtn .btn_p span {padding-left:25px; font-weight:500;}
.chkBtn .btn_p span:before {content:''; position:absolute; top:2px; left:0px; width:10px; height:15px; border:1px solid transparent; border-width:0 3px 3px 0; border-color:#715deb; background-color:transparent; overflow:hidden; box-sizing:border-box; transform:rotate(45deg);}

.chkBtn.ok .btn_p {border-color:#5642bf; background-color:#5642bf; color:#fff;}
.chkBtn.chkBtnB.ok .btn_p span:before {border-color:#5d88fb;}
.chkBtn.ok .btn_p span:before {border-color:#fff;}

/* 질병상세설명 */
.digital .imgArea {display:flex; flex-wrap:wrap; align-items:center; margin:-10px -5px 0; text-align:left;}
.digital .imgArea .img {display:inline-block; width:156px; height:117px; margin:15px 5px 0; box-sizing:border-box; vertical-align:top;}
.digital .imgArea .img img {width:100%; height:100%;}
.digital .imgArea .img .imgTemp {width:100%; height:100%; background:#fde8e7; text-align:center;}
.diseaseInfo{margin-top:20px;}
.diseaseInfo .info {display:-webkit-box; max-height:220px; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:8; -webkit-box-orient:vertical;}
.diseaseInfo .info.on {display:block; max-height:100%;}
.diseaseInfo .btn_s.m.more {display:none;}
.diseaseInfo .btn_s.m.more > span {padding:0;}
.diseaseInfo .btn_s.m.more > span:after{content:none;}
.diseaseInfo .info.on + .btn_s.m.more {box-shadow:none;}
/*================================================== 디지털보험 상품상세 ==================================================*/
/* 네비게이션 본문 바로가기 */
#skipNavi span {display:block; position:fixed; top:0; left:0; width:100%; height:0; background-color:#2b64ce; color:#fff; font-size:14px; font-weight:bold; line-height:1; text-align:center; overflow:hidden; z-index:9999;}
#skipNavi span:focus,
#skipNavi span:active {height:auto; margin-top:0; padding:10px 0px; border:2px dashed white;}
.sitemapOpen #skipNavi {display: none;}

body[class*=insu] .setHalf .iptFilt {float:left; width:110px; margin:4px 4px 4px 8px;}
body[class*=insu] .setHalf .iptFilt + .iptWrap {width:calc(100% - 138px);}
body[class*=insu] .btnArea.sticky {flex-wrap:wrap;}
body[class*=insu] .btnArea.sticky [class^=btn_] {position:relative; z-index:1; line-height:44px;}
body[class*=insu] .btnArea.sticky .imgBanner {width:100%; margin:0;}
body[class*=insu] .btnArea.sticky .imgBanner a {display:inline-block; width:100%; height:100%;}

body.insuDetail .header h1 {display:block; text-overflow:ellipsis; white-space:nowrap; line-height:56px; overflow:hidden; opacity:0;}
body.insuDetail .header.sticky h1 {opacity:1;}

body.insuDetail .tabWrap .tabList {position:sticky; left:0; top:56px; background-color:#fff; z-index:1500;}

.insuDetail .summary {margin-bottom:19px;}
.insuDetail .summary > .inner {padding-top:75px !important; padding-bottom:68px; text-align:center;}
.insuDetail .summary .copy {font-size:2.4rem; font-weight:500; line-height:36px;}
.insuDetail .summary .desc {margin-top:20px; font-size:1.6rem;}
.insuDetail .summary .btn_p.m {width:auto; margin:20px auto 0; padding-left:15px; padding-right:15px; background-color:#fff; color:#715deb; border-color:transparent;}
.insuDetail .summary .infoBox > .inner {padding:32px 24px; border-radius:0;}
.insuDetail .summary .infoBox .tit {margin-bottom:16px; font-size:1.6rem;}
.insuDetail .summary .infoBox .tit .selectWrap {width:96px; margin:0;}
.insuDetail .summary .infoBox .tit .selectWrap .ipt {padding:0 25px 0 0; border-radius:0; border-width:0 0 2px 0; border-color:#222; background-position:right center;}
.insuDetail .summary .infoBox .btn_p.m {margin-top:8px; width:100%; background-color:#715deb; color:#fff; box-shadow:4px 4px 8px rgba(113, 93, 235, 0.24);}
/*무료보험 노출 텍스트*/
.subFree {text-align: center; margin-bottom: -21px; margin-top: 40px;}

.isDevice:not(.isIOS).insuDetail .btnArea.sticky.fixed {position: fixed; left: 0; right: 0; margin: 0;}
.isDevice.insuDetail .btnArea.sticky.rel {position: relative !important;}
.insuDetail .btnArea.sticky {transition: bottom 0.2s ease-out;}
.insuDetail .btnArea.sticky .selOpt {position:relative; width:100%; padding-top:15px; background-color:#fff; border-top:1px solid #715deb; box-shadow:0px 0px 15px rgba(185,183,183,0.5);}
.insuDetail .btnArea.sticky .selOpt .icoBtn_acco {position:absolute; top:-25px; left:0; width:100%; height:25px; background:url(../../assets/images/smart/content/img_arrow_bg.png) no-repeat 50% 0;}
.insuDetail .btnArea.sticky .selOpt .icoBtn_acco:after {width:8px; height:8px; margin-top:-1px; border-color:#715deb;}
.insuDetail .btnArea.sticky .selOpt.on .icoBtn_acco:after {margin-top:3px; transform:translate(-50%, -50%) rotate(-135deg);}
.insuDetail .btnArea.sticky .selOpt .accoBody {padding:0 24px 15px; background-color:#fff;}
.insuDetail .btnArea.sticky .selOpt .setHalf {margin-top:0; margin-bottom:0;}
.insuDetail .btnArea.sticky .selOpt .infoList {margin:0;}
.insuDetail .btnArea.sticky .selOpt .dataTd {display:flex; display:-webkit-flex;}
.insuDetail .btnArea.sticky .selOpt .dataTd .iptFilt {width:50%; margin:4px 10px 4px 0; padding:0;}
.insuDetail .btnArea.sticky .selOpt .infoList .item {color:#222;}
.insuDetail .btnArea.sticky .selOpt .infoList .val {font-size:1.4rem;}
.insuDetail .btnArea.sticky .selOpt .infoList .val .pointC5 {font-weight:500;}

.insuDetail .btnArea.sticky.hide {bottom: -190px;}

.insuDetail .tabPanel {padding-top:60px;}
.insuDetail .section .imgCont {margin:60px 0 40px;}
.insuDetail .section .imgCont > *:last-child:not(img) {margin-top:20px;}
.insuDetail .section .imgCont + .imgCont {margin-top:0;}
.insuDetail .section .notiBox .imgCont {margin:15px 0;}
.insuDetail .section .notiBox [class^=txt] + .imgCont {margin:30px 0 5px;}
.insuDetail .section .notiBox {padding:20px 22px; border-radius:0;}
.insuDetail .section .infoIcoWrap.round {margin:30px 0;}
.insuDetail .section .infoIcoWrap.round [class^=ico] {padding:16px;}
.insuDetail .section .infoIcoWrap.round.sm {margin:24px 0; padding:0 16px;}
.insuDetail .section .infoIcoWrap.round.sm [class^=ico] {width:60px; height:60px; min-width:60px; padding:6px;}
.insuDetail .section .infoIcoWrap.round.sm .info {font-size:1.4rem;}

.insuDetail .logoList > li {text-align:center;}
.insuDetail .logoList > li:not(:first-child) {margin-top:40px;}
.insuDetail .logoList > li .tit {margin-top:20px;}
.insuDetail .logoList > li img {height:24px;}
.insuDetail .logoList > li img.card {height:42px;}
.insuDetail .notiBox .logoList {margin:36px 0;}

.insuDetail div.helpWrap.caution {margin:60px -24px 0; padding:30px 24px; background-color:#f8f8f8; border-width:1px 0;}
.insuDetail div.helpWrap.caution .tit {margin:0 0 16px 0; padding:0 0 0 24px; border-color:transparent;}
.insuDetail div.helpWrap.caution .tit:before {top:4px; left:0;}
.insuDetail div.helpWrap.caution .info {margin:20px 0 0; color:#666; font-size:14px;}
.insuDetail div.helpWrap.caution .info span + span {position:relative; padding-left:16px}
.insuDetail div.helpWrap.caution .info span + span:before{content:''; position:absolute; top:7px; left:5px; display:block; width:1px; height:8px; border-left:1px solid #ccc;}

.insuDetail .csBanner {background-color:#715deb;}
.insuDetail .csBanner .btnCell a {color:#5642bf;}

.arwBtnList.line {margin:0 -24px; border-top:1px solid #eee;}
.arwBtnList.line > li {padding:24px 40px 24px 32px; border-bottom:1px solid #eee;}
.arwBtnList.line .icoBtn_arrow {height:73px;}
.arwBtnList.line .icoBtn_arrow:after {right:24px; border-color:#222;}

.insuDetail .tabPanel .arwBtnList.line:first-child {margin-top:-60px; margin-bottom:60px;}
.insuDetail .arwBtnList.line:before {content:''; display:block; width:100%; height:10px; margin-top:-2px; background:#f8f8f8; border:1px solid #eee; border-width:1px 0;}

.footNote {display:flex; color:#959595;}
.footNote .sup {margin-right:3px; padding-top:2px; font-size:1.2rem;}

.alphabetList {margin:40px 0;}
.infoIcoWrap.alphabet {margin:0 0 25px; min-height:48px;}
.infoIcoWrap.alphabet .ico {min-width:auto; width:34px; height:34px; color:#fff; font-size:1.4rem; font-weight:500; line-height:1.4rem; text-align:center; border-radius:10px; background:#5d88fb !important;}
.infoIcoWrap.alphabet .info {padding:3px 0 0 16px;}
.infoIcoWrap.alphabet .info [class^=tit] {margin:0; color:#5d88fb;}

.infoIcoWrap.alphabet + .infoIcoWrap.alphabet{position:relative;}
.infoIcoWrap.alphabet + .infoIcoWrap.alphabet:before{content:''; position:absolute; top:-16px; left:12px; display:block; width:8px; height:2px; background:#494949;}
.infoIcoWrap.alphabet + .infoIcoWrap.alphabet:after{content:''; position:absolute; top:-19px; left:15px; display:block; width:2px; height:8px; background:#494949;}
.infoIcoWrap.alphabet + .infoIcoWrap.alphabet .info [class^=tit] {color:#715deb;}
.infoIcoWrap.alphabet .ico.c1 {background:#917ffd !important;}
.infoIcoWrap.alphabet .ico.c2 {background:#d85ab1 !important;}

.alphabetInfo .infoIcoWrap.alphabet {margin:0; align-items:center;}
.alphabetInfo .infoIcoWrap.alphabet .ico {top:0;}
.alphabetInfo .infoIcoWrap.alphabet .desc {color:#222; font-size:1.4rem;}
.alphabetInfo .infoIcoWrap.alphabet + .infoIcoWrap.alphabet:before,
.alphabetInfo .infoIcoWrap.alphabet + .infoIcoWrap.alphabet:after {content:none;}

.insuDetail .section .helpWrap .icoBtn_acco:before {color:#715deb; border:1px solid #715deb; background:#fff;}
.insuDetail .section.bg_3 .helpWrap .accoBody {border-top:1px solid #ddd; background:#fff;}

/* 보험료 계산 결과 */
.insuCalc .summary {margin-bottom:0;}
.insuCalc .summary > .inner {padding:32px 24px;}
.insuCalc .summary .prdInfo {display:flex; justify-content:space-between; align-items:baseline;}
.insuCalc .summary .prdInfo .tit {font-size:16px; text-align:left;}
.insuCalc .summary .prdInfo .links.arrow {color:#fff; font-size:14px;}
.insuCalc .summary .prdInfo .links.arrow:before {border-color:#fff;}
.insuCalc .summary .userInfo {position:relative; margin:24px 0 0; padding:20px 0 0 40px; border-top:1px solid #9384f0;}
.insuCalc .summary .userInfo.noBtn {padding-top:26px;}
.insuCalc .summary .userInfo .info {display:flex; justify-content:space-between; flex-wrap: wrap; align-items: center;}
.insuCalc .summary .userInfo .info .ico {position:absolute; top:23px; left:0; width:30px; height:30px;}
.insuCalc .summary .userInfo .info .user {font-weight:500;}
.insuCalc .summary .userInfo .info .btnChange {box-sizing:border-box; padding:6px 38px 7px 18px; color:#fff; font-size:14px; background:url(../../assets/images/smart/content/ico_change_wh.png) no-repeat right 16px center #5744cd; background-size:14px auto; border-radius:30px;}
.insuCalc .summary .userInfo .txtList.dot {display:flex; flex-wrap:wrap; margin:20px 0 0;}
.insuCalc .summary .userInfo .txtList.dot > li {min-width:50%; margin:0;color:#fff; font-size:14px;}
.insuCalc .summary .userInfo .txtList.dot > li:before {background-color:#fff;}
.insuCalc .summary .btn_t.m {margin:30px 0 0 0; background-color:#fff; border-color:transparent;}

.insuCalc .tabList {margin-bottom:0;}
.insuCalc .tabList > li {display:block; height:61px; padding-bottom:20px;}
.insuCalc .tabList > li .val{display:block; margin-top:5px; font-size:14px;}
.insuCalc .bgGrayArea .btnArea{margin:25px -4px 0;}
.insuCalc .bgGrayArea .btnArea.half .btn_s.s{color:#666; border-color:#ccc;}
.insuCalc .bgGrayArea .btnArea.half .btn_s.s:nth-of-type(3) {width:100%;}
.insuCalc .bgGrayArea .btnArea.half + .btnArea {margin-top:8px;}

.insuSet {margin:32px 0;} 

.insuPlan .bgGrayArea {background:#f8f8f8;}
.insuPlan .btnArea {margin:0 -4px 22px -4px;}
.insuPlan .btnArea .btn_s.s {border-color:#ccc; color:#666; font-size:14px;}
.insuPlan .tblInfo {margin:0 0 5px; align-items:center;}
.insuPlan .tblInfo .selectWrap {margin:0;}
.insuPlan .tblInfo select.ipt {height:auto; padding:10px 40px 10px 0; color:#445fe6; font-size:16px; font-weight:500; background-color:transparent; border:none; background:url(../../assets/images/smart/common/ico_arrow_down_blue.png) no-repeat right 8px center; background-size:24px;}
.insuPlan .infoList {margin:0; padding-top:20px; border-top:1px solid #222;}
.insuPlan .infoList .item {font-size:16px;}   
.insuPlan .infoList .item .toggleSwitch {margin:6px 0 10px;}
.insuPlan .infoList .val {font-weight:500;}
.insuPlan .infoList > li.full {display:block;}
.insuPlan .infoList > li.full .val {display:flex; justify-content:space-between; margin:10px 0 8px; padding:8px 14px 8px 16px; background:#fff; border-radius:5px;}
.insuPlan .infoList > li.full .setBtnAdd {justify-content:flex-start;}
.insuPlan .infoList > li.full .setBtnAdd .selectWrap {width:auto;}
.insuPlan .infoList > li.full .setBtnAdd select.ipt {width:auto; border:none; padding:0 45px 0 10px;}
.insuPlan .infoList > li.full .setBtnAdd + .btn_t {min-width:59px; padding:4px 12px; color:#fff; border:none; background-color:#5d88fb;}
.insuPlan .infoList .toggleSwitch input:checked + label:after{box-shadow:2px 2px 8px rgba(0,66,142,0.24);}
.insuPlan .infoList > li:not(.total):last-child {padding-bottom:20px; border-bottom:1px solid #eee;}
.insuPlan .infoList > li:not(:first-child).total {margin-top:13px; border-top:1px solid #ccc;}
.insuPlan .infoList .total .val .pointC5 {margin-right:3px; font-size:24px;}
.insuPlan .infoList + .tblInfo{margin-top:30px;}
.insuPlan .prdCalcInfo {margin-bottom:32px;}

.links.arrow.basicC2:before {border-color:#666;}

.insuCalc .toggleSwitch input:checked:disabled + label:before {background-color:#eee;}
.insuCalc .toggleSwitch.lg input:checked:disabled + label .on {color:#666;}
.insuCalc .toggleSwitch input:checked:disabled + label:after {background:#fff; box-shadow:none;}

.insuCalc .infoList .infoList {border:none;}
.insuCalc .infoList .infoList li:before{content:none;}
.insuCalc .infoList .infoList .item,
.insuCalc .infoList .infoList li:not(.total) .val {color:#222; font-size:1.6rem;}
.insuCalc .infoList .infoList > li:not(.total):last-child {border:none;}

/* tab구조 */
.insuCalc .tabList {margin-top:30px;}
.tabSwiper {margin:0 -24px 32px;}
.tabSwiper .bgGrayArea {margin:0 !important; padding:30px 24px !important; background:#f8f8f8;}
.tabSwiper .btnArea {margin:0 -4px 22px -4px;}
.tabSwiper .btnArea .btn_s.s {border-color:#ccc; color:#666; font-size:14px;}
.tabSwiper .tblInfo {margin:0 0 5px; align-items:center;}
.tabSwiper .tblInfo .selectWrap {margin:0;}
.tabSwiper .tblInfo select.ipt {height:auto; padding:10px 40px 10px 0; color:#222; font-size:16px; font-weight:500; background-color:transparent; border:none;}
.tabSwiper .infoList {margin:0; padding-top:20px; border-top:1px solid #222;}
.tabSwiper .infoList .item {font-size:16px;}   
.tabSwiper .infoList .item .toggleSwitch {margin:6px 0 10px;}
.tabSwiper .infoList > li.full {display:block;}
.tabSwiper .infoList > li.full .val {display:flex; justify-content:space-between; margin:10px 0 8px; padding:8px 14px 8px 16px; background:#fff; border-radius:5px;}
.tabSwiper .infoList > li.full .setBtnAdd {justify-content:flex-start;}
.tabSwiper .infoList > li.full .setBtnAdd .selectWrap {width:auto;}
.tabSwiper .infoList > li.full .setBtnAdd select.ipt {width:auto; border:none; padding:0 45px 0 10px;}
.tabSwiper .infoList > li.full .setBtnAdd + .btn_t {min-width:59px; padding:4px 12px; color:#fff; border:none; background-color:#5d88fb;}
.tabSwiper .infoList .toggleSwitch input:checked + label:after{box-shadow:2px 2px 8px rgba(0,66,142,0.24);}
.tabSwiper .infoList > li:not(.total):last-child {padding-bottom:20px; border-bottom:1px solid #eee;}
.tabSwiper .infoList > li:not(:first-child).total {margin-top:13px; border-top:1px solid #eee;}
.tabSwiper .infoList .total .val .pointC5 {margin-right:3px; font-size:24px;}
.tabSwiper .infoList + .tblInfo{margin-top:30px;}
.insuCalc .prdCalcInfo{margin:0 24px;}

.tabPanel .icoList:first-child {margin-top:-35px;}
.icoList {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin-top:-4px; font-size:0;}
.icoList li {display:inline-block; width:50%; box-sizing:border-box; padding:4px; font-size:1.6rem;}
.icoList a {display:inline-block; width:100%; padding:30px 0 29px; color:#222;  text-align:center; border:1px solid #ddd;}
.icoList a:focus {border:1px solid #715deb;}
.icoList a .tit {display:block; margin-top:10px;}

/* 보험료 계산 */
body.insuCalc .bgGrayArea .conBlock {padding-top:0;}

.insuCalc .recResult  {border:1px solid #ddd; border-width:0 0 1px 0;}
.insuCalc .recResult.on {border-width:1px 0 0;}
.insuCalc .recResult .recInfo {height:70px; font-size:1.4rem;}
.insuCalc .recResult .val{color:#666;}
.insuCalc .recResult .icoBtn_acco:before{content:none;}
.insuCalc .recResult .icoBtn_acco:after{border-color:#222;}
.insuCalc .recResult .accoBody {top:70px; z-index:2; padding:0 24px 24px; border-bottom:1px solid #ddd;}
.insuCalc .recResult .accoBody [class^=btn_] {background:#715deb;}

.insuCalc .titExtra {margin:40px 0 0; text-align:center;}
.insuCalc .titExtra .titH3 {font-weight:300;}

.insuCalc .insuSwiper .swiper-container{padding:0 32px 0 50px; margin:0 -24px;}

.insuPlanList {margin-top:-10px; padding:20px 0;}
.insuPlanList > li {margin:0; padding: 0 16px 0 0;}
.insuPlanList .block {position:relative;padding:35px 33px 63px; background:#fff; box-shadow:-2px 5px 16px rgba(176,176,176,0.24);}
.insuPlanList .block .info {text-align:center;}
.insuPlanList .block .info .tit {margin-bottom:20px; color:#222; font-size:18px;}
.insuPlanList .block .info .item {font-size:14px;}
.insuPlanList .block .info .val {color:#222; font-size:20px;}
.insuPlanList .block .info .val .pointC5 {font-size:30px;}
.insuPlanList .infoList {margin:20px 0; padding:15px 15px 0; border-top:1px solid #eee;}
.insuPlanList .infoList li {padding:3px 0;}
.insuPlanList .infoList .val {color:#222; font-size:14px; font-weight:500;}
.insuPlanList .infoList + .btn_p {min-height:44px; margin:0; font-size:16px; font-weight:300;}
.insuPlanList .btnChange {position:absolute; bottom:20px; right:33px; padding:5px 23px 5px 10px; background:url(../../assets/images/smart/content/ico_change_gray.png) no-repeat right center; background-size:14px auto;}

.btnChange {color:#959595; font-size:14px;}

.insuCalc .btn_p.blink {animation:blinkBtn 1s step-end infinite;}
@keyframes blinkBtn {
	50% {background-color:#4e39d2; border-color:#4e39d2;}
}

/* 분류코드 팝업 */
.classifyCodeList {display:flex; flex-wrap:wrap; margin:16px -24px 8px; border-top:1px solid #d6e1fe;}
.classifyCodeList > li {display:flex; align-items:center; width:50%; padding:24px; border-bottom:1px solid #d6e1fe; background-color:#f2f6ff;}
.classifyCodeList > li a {color:#222; font-size:1.4rem;}
.classifyCodeList > li:nth-child(odd) {border-right:1px solid #d6e1fe;}

.codeDetailList > li {padding:20px 0; border-bottom:1px solid #eee;}
.codeDetailList .tit {display:inline-block; margin-bottom:8px; color:#222; font-size:1.4rem;}

/* 계약문서팝업 */
.docBtnArea {position:sticky; top:55px; left:0; right:0; display:flex; margin:-27px -28px 0; padding:15px 15px; background-color:#fff; z-index:2;}
.docBtnArea > li {width:100%; padding:0 4px;}

.docBtn {width:100%; height:100%; padding:4px 6px; color:#666; font-size:1.4rem; text-align:center; border:1px solid #d6e1fe; background-color:#f2f6ff; border-radius:2px;}
li.on .docBtn {border-color:#5d88fb; background-color:#5d88fb !important; color:#fff;}

.fullW {margin:0 -24px;}

/* 연금예상액(CDAMEH0601) */
.accoForm {position:relative; margin-top:25px; padding-bottom:55px;}
.accoForm .accoHead {position:static;}
.accoForm .accoHead:before {content:''; position:absolute; bottom:16px; left:0; right:0; height:1px; background-color:#eee;}
.accoForm .accoHead .icoBtn_acco {position:absolute; bottom:0; left:50%; width:32px; height:32px; border-color:#666; border-radius:50%; background-color:#fff; box-shadow:0px 2px 6px rgba(113,93,235,0.2); transform:translateX(-50%);}
.accoForm .accoHead .icoBtn_acco:after {width:9px; height:9px; border-color:#666;}
.accoForm.accoItem.on > .accoHead .icoBtn_acco:after {border-color:#666;}
.accoForm .accoBody {background-color:#fff;}
.accoForm .accoBody .formList {margin-top:20px;}
.accoForm .accoBody .formList .ipt[disabled] {color:#222;}

/*************************************************** media ***************************************************/
@media all and (max-width:767px) {
	
}

@media all and (max-width:425px) {
	/* 동의 등급 */ 
	.termsState {justify-content:center;}
	.termsState [class^=flag_prd] {width:auto;}
	.termsState [class^=flag_prd] + [class^=flag_prd] {margin-left:6%;}
	.termsState [class^=flag_prd]::after {left:-16px; width:12px;}
	
}

@media all and (max-width:320px) {
	/* 동의 등급 */ 
	.termsState [class^=flag_prd] {letter-spacing:-0.05rem;}
	.termsState [class^=flag_prd]::after {left:-7px; width:4px;}
	.termsState [class^=flag_prd] + [class^=flag_prd] {margin-left:10px;}
	
	/*상품상세 한번만내는 풍선 추가*/
	.buttonBalloon .buttonBalloonImg { display : none;}
	.buttonBalloon .buttonBalloonImg320{ display: block; }
	
	.digital .summary .relatChange {padding:0;}
	.digital .summary .relatChange select.ipt {font-size:1.8rem;}
	.digital .swiperWrap .infoBox .infoList:not(.half) > li {margin-right:30px;}
	.digital .swiperWrap .infoBox .infoList:not(.half) > li:not(:first-child):before {left:-15px;}
	
	/* 보험상세 */
	.insuDetail .reviewBbsList > li > .block {width:262px;}
}










/*================================================== 전략과제 ==================================================*/
body.play {font-size:1.4rem;}
body.play .header .bg {border-bottom:transparent;}
body.play .titH1 {margin:0 0 18px; font-size:2.8rem; font-weight:700;}
body.play .titH2 {font-size:2.4rem; font-weight:700;}
body.play .pointC5 {color:#715def !important;}

body.play [class^=btn_].m {font-size:1.4rem; font-weight:500;}
body.play .btn_s {background-color:transparent;}
body.play .btn_p.m {border-color:#715deb; background-color:#715deb;}

body.play [class^=btnTxt_] {width:100%; min-height:56px; font-size:1.4rem; font-weight:500;}
body.play [class^=btnTxt_]:not(:first-child),
body.play [class^=btnTxt_]:only-child {border-top:1px solid #ddd;} 
body.play .btnTxt_p {color:#715def;}

body.play .content > *:first-child.tabWrap, 
body.play .content > *:first-child.tabList,
body.play .content > *:first-child.boxBbsView,
body.play .popup header + .tabWrap, 
body.play .popup header + .tabList {margin-top:-26px;}
body.play .popup header + .iptFilt.tab2,
body.play .content > *:first-child.playFilt {margin-top:-27px;}

body.play .tabList {position:sticky; left:0; top:56px; margin-bottom:30px; padding:0; background-color:#fff; z-index:1500;}
body.play .tabList > li {color:#959595; font-size:1.3rem; font-weight:700;}
body.play .tabList > li.on {color:#222;}
body.play .tabList > li.on:after {background-color:#222;}

body.play .tabWrap .tabList {margin-bottom:0;}

body.play .content.bgGrayArea .helpWrap .icoBtn_acco {background-color:#fff;}

body.play .ipt:not([class*=titH]) {font-size:1.4rem;}

body.play select.ipt.sm {height:24px; padding:0 24px 3px 0; border:none; background-color:transparent; background-position:right center;}
body.play select.ipt.sm.titH3 {margin:0; font-weight:700;}

body.play .ipt[type=checkbox] + label.lg {font-size:1.4rem;}
body.play .ipt[type=checkbox] + label.lg:not(.allChk) {padding-top:3px;}
body.play .ipt[type=checkbox] + label.lg:not(.allChk):after {border-color:#eee;}
body.play .ipt[type=checkbox]:checked + label.lg:not(.allChk):after {top:4px; left:8px; width:8px; height:12px; border-color:#fff;}
body.play .termsAll > .accoHead .ipt[type=checkbox] + label.lg:not(.allChk) {width:100%; padding-bottom:15px; border-bottom:1px solid #eee;}
body.play .termsAll > .accoHead .ipt[type=checkbox] + label.lg.allChk {padding-top:13px;}
body.play .termsAll ul.termsWrap .accoHead {padding:0px 45px 0px 0;}
body.play .termsAll ul.termsWrap .accoHead [class^=icoBtn_] {top:0; height:34px;}
body.play .termsAll ul.termsWrap .accoHead .ipt[type=checkbox] + label.lg {padding-top:7px; font-size:1.2rem;}
body.play .termsAll ul.termsWrap .accoHead .ipt[type=checkbox] + label.lg:before {background-color:transparent; border-color:transparent;}
body.play .termsAll ul.termsWrap .accoHead .ipt[type=checkbox] + label.lg:after {top:9px; left:9px; width:7px; height:11px;}
body.play .termsAll ul.termsWrap .accoHead .ipt[type=checkbox]:checked  + label.lg:after {border-color:#715deb;}
body.play .termsAll ul.termsWrap .accoBody > .inner {font-size:1.2rem;}

body.play .tblInfo {flex-wrap:wrap; align-items:center;}
body.play .tblInfo .selectWrap {width:auto; margin:0;}
body.play .tblInfo > *:not(:only-child):last-child {margin-left:auto;}

body.play .bgGrayArea .iptFilt.tab {background-color:#dcdee5;}
body.play .bgGrayArea .btn_g {color:#fff; background-color:#7d7a8e;}
body.play .bgGrayArea .conBlock {padding-bottom:30px; border-radius:0 0 8px 8px; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1);}

body.play .notiBox {border-radius:8px;}
body.play .notiBox .infoList .item {flex-grow:0; width:25%; min-width:25%; padding-right:5px;}
body.play .notiBox .infoList .val {text-align:left;}

body.play .txtList .links.ellip {margin:0; vertical-align:top;}

body.play .marketBanner .block {margin:0; border-radius:8px;}
body.play .marketBanner .block .desc {font-size:1.2rem;}
.marketBanner .imgCell img.s {height:46px;}

.playMenu {text-align:center;}
[class^=menu_] {position:relative; margin:0 5px; padding:15px 10px; color:#888; font-size:18px; font-weight:700;}
[class^=menu_].on {color:#715def;}
[class^=menu_].on:after {content:''; position:absolute; left:10px; right:10px; bottom:15px; border-bottom:1px solid #715deb; box-sizing:border-box;}

.icoBtn_like {background:url(../../assets/images/play/common/ico_like.png) no-repeat 50% 50%; background-size:18px auto;}
.icoBtn_like.on {background:url(../../assets/images/play/common/ico_like_on.png) no-repeat 50% 50%; background-size:18px auto;}
.icoBtn_talk {background:url(../../assets/images/play/common/ico_talk.png) no-repeat 50% 50%; background-size:18px auto;}
.icoBtn_more2 {width:32px; height:32px; background:url(../../assets/images/play/common/ico_more_info.png) no-repeat 50% 50%; background-size:20px auto;}
.icoBtn_clover {background:url(../../assets/images/play/common/ico_btn_clover.png) no-repeat 50% 50%; background-size:20px auto;}
.icoBtn_share {background:url(../../assets/images/play/common/ico_btn_share_lg.png) no-repeat 50% 50%; background-size:32px auto;}
.icoBtn_setup2 {background:url(../../assets/images/play/common/ico_btn_setup.png) no-repeat 50% 50%; background-size:20px auto;}
.icoBtn_user {background:url(../../assets/images/play/common/ico_btn_other_user.png) no-repeat 50% 50%; background-size:20px auto;}

.icoBtn_appMore {right:4px; background:url(../../assets/images/play/common/ico_app_more.png) no-repeat 50% 50%; background-size:20px auto;}

.btnIco_consult {padding-right:24px; font-size:1.2rem; line-height:24px; color:#715def; font-weight:500; background:url(../../assets/images/play/common/ico_consult.png) no-repeat 100% 50%; background-size:18px auto;}
.btnIco_change {padding-right:24px; font-size:1.2rem; line-height:24px; color:#715def; font-weight:500; background:url(../../assets/images/play/common/ico_change.png) no-repeat 100% 50%; background-size:18px auto;}

[class^=playCard] .titArea [class*=icoBtn_] {width:36px; height:36px; margin:0 0 3px 0; background-size:20px auto !important;}
[class^=playCard] .titArea [class*=icoBtn_]:last-child {margin-right:-8px;}
[class^=playCard] .titArea [class*=btnIco_] {height:36px; margin-bottom:3px;}
[class^=playCard] .titArea .icoBtn_share {background:url(../../assets/images/play/common/ico_btn_share.png) no-repeat 50% 50%;}

.titBlock {margin-bottom:32px; text-align:center;}
.titBlock .txtXS {margin-bottom:6px;}
.titBlock .flag_play0 + .titH5 {margin:10px 0 3px;}

.mark {border-bottom:1px solid transparent; border-image-slice:0 0 10 0; background-size:10px auto; border-image-source:url(../../assets/images/play/content/tit_mark.png); border-image-outset:0; border-image-repeat:repeat; border-image-width:auto; border-image-slice:0 0 10 0;}

.mb_snap {position:relative; display:-webkit-flex; display:flex; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-scroll-snap-type:x mandatory; -ms-scroll-snap-type:x mandatory;}
.mb_snap > li {display:block; float:none; -webkit-flex:none; flex:none; width:100vw; align-items:start; justify-content:start; scroll-snap-align:start;}

.flag_play0 {background-color:#aeb1b9; color:#fff;}
.flag_play1 {background-color:#d6f5f9; color:#00a3bb;}
.flag_play2 {background-color:#40bacc; color:#fff;}
.flag_play3 {background-color:#ffe8ed; color:#e55876;}
.flag_play4 {background-color:#f6f5fd; color:#5642bf;}

/* 목록_공통 */
[class*=boxBbs] .block {position:relative; display:block; margin-bottom:16px; padding-left:23px; padding-right:23px; border:1px solid #fff; border-radius:8px; background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1); transition:border-color ease-in-out 0.25s;}
[class*=boxBbs] .block > .inner {display:block; padding:23px 0;}
[class*=boxBbs] .tit {color:#222; font-size:1.8rem; font-weight:500;}

[class*=boxBbs] div.state {margin-bottom:14px;}
[class*=boxBbs] [class^=flag_] {font-size:1.2rem !important;}
[class*=boxBbs] .hastag > span {margin-left:-3px; padding:0 2px; color:#959595;}

[class*=boxBbs] .btnGroup {margin:0; padding-bottom:25px;}
[class*=boxBbs] .btnGroup [class^=btn_] {min-height:44px; font-size:1.4rem;}
[class*=boxBbs] .btnGroup [class^=btnTxt_] {width:auto; min-height:0; border-top:none !important; font-size:1.4rem;}
[class*=boxBbs] .btnGroup .info {margin-left:auto;}

[class*=boxBbs] .relateInfo {display:flex; flex-wrap:wrap; justify-content:space-between; margin-top:-11px; margin-bottom:15px; padding-top:10px; border-top:1px solid #eee;}
[class*=boxBbs] .relateInfo > div {display:inline-block; color:#959595; font-size:1.2rem; line-height:23px; vertical-align:middle;}
[class*=boxBbs] .relateInfo > div:last-child {margin-left:auto;}
[class*=boxBbs] .relateInfo .item,
[class*=boxBbs] .relateInfo .val {display:inline;}
[class*=boxBbs] .relateInfo .item img {position:relative; top:-2px; width:20px;}
[class*=boxBbs] .relateInfo .val {margin:0 0 0 -1px; color:#222; font-size:1.4rem; font-weight:500;}
[class*=boxBbs] .relateInfo [class*=icoBtn_] {width:24px; height:24px;}
[class*=boxBbs] .relateInfo * + .val {margin-right:10px;}
[class*=boxBbs] .relateInfo .val:last-child {margin-right:0;}

[class^=boxBbs] .infoList {display:flex; justify-content:space-between; margin:6px 0 0 0;}
[class^=boxBbs] .infoList > li {display:block; padding:0 0 12px !important;}
[class^=boxBbs] .infoList > li > div {display:inline-block; min-width:0; padding-right:1px; vertical-align:middle;}
[class^=boxBbs] .infoDetail {position:relative; margin:0; padding:3px 0 6px; color:#959595; background-color:#fff;}

[class^=boxBbs] .txtList.dot {margin:10px 0; word-break:break-all;}
[class^=boxBbs] .txtList.dot > li {margin-top:10px;}
[class^=boxBbs] .txtList.dot > li:before, 
[class^=boxBbs] .txtList.dot:not(ul):before {background-color:#40bacc;}

.boxBbsList .img {width:100%; margin-top:20px; vertical-align:top; border-radius:4px; overflow:hidden;}
.boxBbsList .icoBtn_more2 {position:absolute; right:17px; top:23px; z-index:10;}

.boxBbsView,
.boxBbsList.comment {margin:0 -24px;}

/* 상세_공통 */
.boxBbsView .block:first-child {border-radius:0 0 8px 8px;}
.boxBbsView .infoDetail {color:#222;}

/* 목록_Q&A */
[class^=boxBbs].qna .tit {font-size:1.6rem; font-weight:500;}
[class^=boxBbs].qna .infoList li > div {font-size:1.2rem; color:#959595;}

/* 목록_댓글 */
.boxBbsList.comment {margin-bottom:16px; border-radius:8px; background-color:#fff; box-shadow:8px 8px 18px rgba(0, 0, 0, 0.1);}
.boxBbsList.comment > li + li {border-top:1px solid #eee;}
.boxBbsList.comment .block {margin:0; box-shadow:none; border-radius:0; border-color:transparent; background-color:transparent;}
.boxBbsList.comment .inner {padding-bottom:9px;}
.boxBbsList.comment .tit.name {font-size:1.4rem; line-height:32px;}
.boxBbsList.comment .tit.name [class^=flag_] {margin:0 5px 0 0; vertical-align:baseline;}
.boxBbsList.comment .infoDetail {margin:0; color:#222;}

/* 목록_주별 운세기록 */
.boxBbsList.week {display:flex; flex-wrap:wrap; margin:0 -8px;}
.boxBbsList.week > li {width:50%; padding:8px; text-align:center;}
.boxBbsList.week > li .block {height:100%; margin:0; padding:0 20px;}
.boxBbsList.week > li .block > .inner {padding-top:40px;}
.boxBbsList.week > li .date {color:#222; font-size:1.4rem; font-weight:500;}
.boxBbsList.week > li .tit {min-height:42px; font-size:1.4rem; word-break:keep-all;}
.boxBbsList.week > li .img {margin:0; max-width:114px;}
.boxBbsList.week > li:last-child .block {display:flex; justify-content:center; align-items:center; background-color:#dcdee5; border-color:#dcdee5;}
.boxBbsList.week > li:last-child .tit em {display:block; margin-bottom:8px;}

.boxBbsList.direct {display:flex; flex-wrap:wrap; margin:0 -4px;}
.boxBbsList.direct > li {width:33.3333%; padding:4px; text-align:center;}
.boxBbsList.direct > li .block {height:100%; margin:0; padding:0 5px;}
.boxBbsList.direct > li .block > .inner {padding:15px 0;}
.boxBbsList.direct > li .img {width:36px; margin:0 auto 5px;}
.boxBbsList.direct > li .tit {font-size:1.4rem; word-break:keep-all;}
.boxBbsList.direct > li .addInfo {font-size:1.3rem; word-break:keep-all;}

/* 목록_동영상 */
.videoBbsList > li {margin-top:20px;}
.videoBbsList .block {display:block; font-size:1.3rem;}
.videoBbsList .thum {position:relative; border-radius:8px; overflow:hidden;}
.videoBbsList .thum:before {content:''; position:absolute; top:0; bottom:0; left:0; right:0; background-color:rgba(0,0,0,0.2); z-index:1;}
.videoBbsList .thum:after {content:''; position:absolute; top:50%; left:50%; width:40px; height:40px; margin:-20px 0 0 -20px; border-radius:50%; overflow:hidden; background:rgba(255,255,255,0.8) url(../../assets/images/smart/temp/temp_playbtn.png) no-repeat 50% 50%; background-size:40px; z-index:2;}
.videoBbsList img {width:100%; vertical-align:top;}
.videoBbsList .tit {margin-top:8px; color:#222; font-weight:500; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.videoBbsList .user {margin-top:13px; color:#959595;}
.videoBbsList .user .img {position:relative; top:-2px; display:inline-block; width:28px; height:28px; border-radius:50%; overflow:hidden; vertical-align:middle;}

.videoBbsList.mb_snap {margin:0 -24px; padding:0 24px; scroll-padding:24px;}
.videoBbsList.mb_snap > li {width:auto; margin-top:0; padding-right:8px;}
.videoBbsList.mb_snap > li:last-child {padding-right:24px;}
.videoBbsList.mb_snap > li .block {width:calc(100vw - 48px);}

/* 목록_마음기록장 */
.weatherDiary .month,
.weatherDiary .selectWrap {display:block; margin:30px 0 15px; text-align:center; font-size:1.8rem; font-weight:500; color:#222;}
.weatherDiary .selectWrap select.ipt {display:inline-block; width:auto; font-size:1.8rem; font-weight:500;}
.weatherDiary ul.inner {border-top:1px solid #ddd;}
.weatherDiary .bbsHead {position:relative; min-height:160px; padding:20px 0 20px 140px; color:#222;}
.weatherDiary .img {position:absolute; top:20px; left:0; width:120px;}
.playCard .weatherDiary {padding-bottom: 24px;}
.playCard .weatherDiary .img {width:120px !important;}
.weatherDiary .img img {max-width:100%;}
.weatherDiary .date {margin-bottom:5px;}
.weatherDiary .score {margin-top:15px;}

/* 운세그래프_점수영역 */
.titScore {margin-bottom:32px; text-align:center;}
.titScore .item {position:relative; display:inline-block; margin:0 15px; font-size:1.4rem; color:#222; font-weight:500;}
.titScore .item:not(:first-child):before {content:''; position:absolute; left:-17px; top:10px; bottom:9px; border-right:1px solid #ddd;}
.titScore .item .val {display:block; font-size:2.8rem; font-weight:700;}

/* 운세그래프_기간선택 */
.weekFilt {text-align:center;}
.weekFilt .val {display:inline-block; vertical-align:middle; font-weight:500;}
.weekFilt .icoBtn_prev:before, 
.weekFilt .icoBtn_next:before {width:6px; height:6px; border-width:0 0 1px 1px; border-color:#222; z-index:1;}
.weekFilt .icoBtn_prev:after,
.weekFilt .icoBtn_next:after {content:''; position:absolute; top:50%; left:50%; width:16px; height:16px; margin:-9px 0 0 -9px; border:1px solid #ddd; background-color:#fff;}

/* 운세그래프_그래프영역 */
.fortuneGraph .graph {margin:32px 0;}
.fortuneGraph .noData {padding:80px 0; background:none !important; color:#666; font-size:1.4rem; font-weight:300;}

/* 오늘의운세 */
.fortuneChar {display:flex; justify-content:space-between; align-items:flex-end; min-height:110px; margin:0 -24px; padding:0 24px; background-color:#715deb; color:#fff;}
.fortuneChar .info {padding-bottom:20px;}
.fortuneChar .info .tit {font-size:2.5rem; font-weight:500;}
.fortuneChar .img {height:125px;}
.fortuneDetail {margin-top:32px;}
.fortuneDetail .titH3 {margin-bottom:20px;}
.fortuneDetail + .fortuneDetail {padding-top:32px; border-top:1px solid #715deb;}

/* 달력 */
.calendarTbl {margin:0 -24px; padding:0 24px 24px 24px; background-color:#fff;}
.calendarTbl th,
.calendarTbl td {height:76px; padding:13px 4px; font-size:1.2rem;}
.calendarTbl td {height:90px; vertical-align:top;}
.calendarTbl tbody > tr:not(:first-child) td {border-top:1px solid #ddd;}
.calendarTbl td a {display:block; min-height:64px; color:#666;}
.calendarTbl td img {display:block; max-width:36px; margin: 10px auto 0;}
.calendarTbl .holiday,
.calendarTbl .holiday a {color:#e91b10;}
.calendarTbl .old {color:#bababa !important;}
.calendarTbl td.today {position: relative;}
.calendarTbl td.today a {position: relative; color:#fff !important; z-index:2;}
.calendarTbl td.today:after {content: ''; position: absolute; top: 10px; left: 50%; display: block; width: 25px; height: 25px; border-radius: 50%; background-color: #715def !important; z-index: 1; transform: translate(-50%,0);}
.calendarTbl .tblInfo {flex-wrap:wrap;}
.calendarTbl .filter {margin-left:auto;}
.calendarTbl .filter > * {vertical-align:middle;}
.calendarTbl .filter [class^=flag_] {margin:0 0 0 5px;}
.calendarTbl .filter .img {position:relative; display:inline-block; white-space:nowrap;}
.calendarTbl .filter .img [class^=flag_] {position:relative; top:-4px; margin-left:-14px; min-width:0; line-height:25px; z-index:1;}
.bgGrayArea .calendarTbl {padding-top:24px;}

/* 폼_날씨 */
.iptWeather {display:flex; flex-wrap:wrap;}
.iptWeather > li {width:33.3333%; margin-top:25px; padding:0 15px; text-align:center;}
.iptWeather > li .ipt + label {padding:0; color:#777; font-size:1.2rem; word-break:keep-all;}
.iptWeather > li .ipt + label:before {position:static; display:block; width:56px; height:56px; margin:0 auto 5px; border:none !important; box-shadow:none !important; background-color:transparent !important; background-size:56px auto !important; border-radius:0;}
.iptWeather > li .ipt + label:after {content:none;}
.iptWeather > li .ipt:checked + label {color:#715def; font-weight:500;}
.iptWeather > li .ipt:checked + label > span {color:#715def !important;}

.iptWeather > li .ipt.weather_all + label:before {background:url(../../assets/images/play/content/img_weather_all.png) no-repeat 50% 50%; background-size:70px auto !important;}
.iptWeather > li .ipt.weather_1 + label:before {background:url(../../assets/images/play/content/img_weather_1_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_2 + label:before {background:url(../../assets/images/play/content/img_weather_2_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_3 + label:before {background:url(../../assets/images/play/content/img_weather_3_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_4 + label:before {background:url(../../assets/images/play/content/img_weather_4_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_5 + label:before {background:url(../../assets/images/play/content/img_weather_5_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_6 + label:before {background:url(../../assets/images/play/content/img_weather_6_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_7 + label:before {background:url(../../assets/images/play/content/img_weather_7_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_8 + label:before {background:url(../../assets/images/play/content/img_weather_8_off.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_9 + label:before {background:url(../../assets/images/play/content/img_weather_9_off.png) no-repeat 50% 50%;}

.iptWeather > li .ipt.weather_1:checked + label:before {background:url(../../assets/images/play/content/img_weather_1.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_2:checked + label:before {background:url(../../assets/images/play/content/img_weather_2.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_3:checked + label:before {background:url(../../assets/images/play/content/img_weather_3.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_4:checked + label:before {background:url(../../assets/images/play/content/img_weather_4.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_5:checked + label:before {background:url(../../assets/images/play/content/img_weather_5.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_6:checked + label:before {background:url(../../assets/images/play/content/img_weather_6.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_7:checked + label:before {background:url(../../assets/images/play/content/img_weather_7.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_8:checked + label:before {background:url(../../assets/images/play/content/img_weather_8.png) no-repeat 50% 50%;}
.iptWeather > li .ipt.weather_9:checked + label:before {background:url(../../assets/images/play/content/img_weather_9.png) no-repeat 50% 50%;}

/* 폼_띠,별자리 선택 */
.setFlex {display:inline-flex; margin:0 -8px; width:calc(100% + 16px)}
.setFlex > div,
.setFlex > .iptWrap {margin:4px;}
.setFlex > div:first-child {margin-left:8px;}
.setFlex > div:last-child {margin-right:8px;}
.setFlex.zodiac > div:first-child {width:110px; min-width:110px;}

/* 폼_댓글 */
.commentSheet .popCont {position: fixed; left: 0; right: 0; bottom: 0; margin: 0; padding: 16px 24px; background-color: #fff; border-radius: 8px 8px 0 0; box-shadow: -8px -8px 18px rgb(0 0 0 / 10%); z-index: 500;}
.commentSheet .iptWrap button {position:absolute; right:0; bottom:0; height:40px; padding:0 10px; font-size:1.2rem; font-weight:700; color:#715def;}
.commentSheet .iptWrap button[disabled] {color:#666;}
.commentSheet textarea.ipt {height:40px; min-height:40px; max-height:76px; padding:8px 40px 8px 10px; background-color:#f8f8f8;}
.commentSheet:not(.fixed) textarea.ipt {max-height:40px;}
.commentSheet textarea.ipt:not(:focus) {border-color:transparent;}
.commentSheet .txt {margin:4px 0 6px;}
.commentSheet.fixed {position:fixed; top:0; left:0; right:0; bottom:0; display:flex; align-items:flex-end; width:100%; height:100vh; padding:0; background-color:rgba(0,0,0,0.4); overflow:hidden; z-index:1999; outline:rgba(0,0,0,0.5);}

.bottomSheet.onlyBtn .btnArea.full {margin:-26px 0 -16px;}

/* tab 스타일 */
.iptFilt.tab2 {display:flex; width:calc(100% + 48px); margin:0 -24px; padding:0 20px; border-bottom:1px solid #eee; white-space:nowrap; overflow-x:auto;}
.iptFilt.tab2 > li {position:relative; display:flex; width:100%; height:56px; padding:0 15px; justify-content:center; align-items:center; color:#666; font-size:1.6rem;}
.iptFilt.tab2 .ipt + label {position:static; background-color:transparent; font-size:1.6rem;}
.iptFilt.tab2 .ipt + label:after {top:auto; height:3px; border:none; background-color:transparent;}
.iptFilt.tab2 .ipt:checked + label:after {top:auto; height:3px; background-color:#5d88fb;}
body.play .iptFilt.tab2 {position:sticky; left:0; top:55px; margin-bottom:30px; padding:0; background-color:#fff; z-index:1500;}
body.play .iptFilt.tab2 .ipt + label {color:#959595; font-size:1.3rem; font-weight:700;}
body.play .iptFilt.tab2 .ipt:checked + label {color:#222;}
body.play .iptFilt.tab2 .ipt:checked + label:after {background-color:#222;}

.playFilt {position:sticky; left:0; top:55px; display:flex; align-items:center; justify-content:space-between; margin:0 -24px 30px; background-color:#fff; z-index:1500;}
.playFilt:after {content: ''; position:absolute; left:0; right:0; top:0; bottom:0; border:1px solid #eee; border-width:0 0 1px 0;}
body.play .playFilt .iptFilt.tab2 {position:relative; top:0; left:0; width:100%; margin:0 !important;}
.playFilt [class^=btn_].s {margin:0 12px; width:auto; white-space:nowrap;}

/* iptHash */
.iptHash {display:inline-block; margin:0; font-size:0; vertical-align:middle;}
.iptHash:after {display:block; content:''; clear:both;}
.iptHash > li {float:left; margin:0 4px; text-align:center;}
.iptHash .ipt + label {height:28px; padding:1px 10px 0; border:1px solid #ddd; border-radius:14px; background-color:#fff; color:#666; font-size:1.3rem; line-height:24px; vertical-align:middle;}
.iptHash .ipt + label:before,
.iptHash .ipt + label:after {content:none !important;}
.iptHash .ipt:checked + label {border-color:#5d88fb; background-color:#5d88fb; color:#fff; box-shadow:2px 8px 16px rgba(0,66,142,0.24); z-index:2;}
.iptHash > li:first-child {margin-left:0;}

.hashRdoGroup {position:relative; margin:-32px -24px 0; background-color:#f8f8f8; z-index:2; overflow-x:auto;}
.hashRdoGroup .iptHash {margin-top:0; padding:14px 0; white-space:nowrap;}
.hashRdoGroup .iptHash > li {display:inline-block; float:none;}
.hashRdoGroup .iptHash > li:first-child {padding-left:24px;}
.hashRdoGroup .iptHash > li:last-child {padding-right:24px;}

[class^=btn_].s.write > span {padding-right:20px; background:url(../../assets/images/play/common/ico_write.png) no-repeat 100% 50%; background-size:14px auto;}

.digital .iptHash {display:flex; padding-bottom:10px;}

/* 메인 */
.playCard {position:relative; margin:-26px -24px 40px; padding:5px 24px; border-radius:0 0 11px 11px; background-color:#fff; box-shadow:0 8px 12px rgba(34,34,34,.08);}
.playCard .titArea {margin-bottom:5px;}
.playCard .tit {color:#222; font-size:2.8rem; font-weight:700;}
.playCard .subTit {padding-top:20px; color:#222; font-size:2.4rem; font-weight:500; text-align:center;}
.playCard .subTit > em {color:#715def; font-weight:700;}
.playCard .subTit .date {font-weight:300; font-size:1.3rem;}
.playCard .img {display:block; width:100%; height:auto; max-width:240px; margin:0 auto;}
.playCard .item {color:#8c9099; font-size:1.8rem; font-weight:500;}
.playCard .item .val {color:#222;}
.playCard .item .val em {color:#715def;}
.playCard .inactiveArea {color:#8c9099; font-size:1.6rem;}
.playCard .inactiveArea em {color:#222;}
.playCard .inactive {position:relative; width:180px; height:180px; margin:20px auto 19px; padding-top:115px; border:1px dashed #715def; border-radius:50%; color:#715def; font-size:1.4rem; line-height:1.4; text-align:center;}
.playCard .inactive::before {content:''; position:absolute; top:28px; left:50%; width:54px; height:78px; background:url(../../assets/images/play/common/ico_char_query.png) no-repeat 100% 50%; background-size:54px auto; transform:translateX(-50%);}
.playCard button.symbol {width:100%;}
.playCard .symbolArea {color:#715def; font-size:1.4rem; text-align:center;}
.playCard .symbolArea [class^=flag_] {margin:0 5px 0; vertical-align:baseline;}
.playCard .marketBanner {margin:16px 0 0;}

.playCard p.txtList {padding:0; text-align:center;}
.playCard p.txtList:before {position:static; margin-right:5px;}

.playCard + p.txt {padding-bottom:24px; border-bottom:1px solid #bbb;}

.content:not(.bgGrayArea) > .playCard,
.popup .playCard {border-radius:0; box-shadow:none;}

.playCard.hasLink {margin:0; text-align:center;}
.playCard.hasLink:before {content:''; position:absolute; left:0; right:0; top:80px; bottom:0; border-radius:11px; background-color:#fff; box-shadow:0 8px 12px rgba(34,34,34,.08); z-index:-1;}
.playCard.hasLink .subTit {height:85px; margin:0 -30px; padding-top:5px; color:#4d5158; font-size:1.4rem; font-weight:300; text-align:left;}
.playCard.hasLink .con {display:flex; position:absolute; left:30px; right:30px; bottom:30px; flex-wrap:nowrap; text-align:left; align-items:flex-end; justify-content:space-between;}
.playCard.hasLink .copy {color:#222; font-size:1.8rem;}
.playCard.hasLink .copy em {color:#222;}
.playCard.hasLink .sum {margin-top:5px; color:#8c9099; font-size:1.2rem;}
.playCard.hasLink .item {color:#715def; font-size:1.2rem; font-weight:300; text-align:right;}
.playCard.hasLink .item .val {display:block; margin-bottom:-7px; white-space:nowrap;}
.playCard.hasLink .item .val em {font-size:2.8rem; vertical-align:sub;}
.playCard.hasLink .inactive {margin:30px auto;}

.playCardList.grid {margin:0 -8px;}
.playCardList.grid .slideList::after {content:''; clear:both; display:block;}
.playCardList.grid .slideList > div {float:left; width:50%; padding:8px;}
.playCardList.grid .playCard {height:224px; padding:35px 14px 0; border-radius:11px; background-color:#fff;}
.playCardList.grid .playCard::before {content:none;}
.playCardList.grid .playCard .tit {position:absolute; left:0; bottom:30px; width:100%; font-size:1.6rem; font-weight:500; text-align:center;}
.playCardList.grid .playCard .subTit,
.playCardList.grid .playCard .con,
.playCardList.grid .playCard .inactive > span {display:none;}
.playCardList.grid .playCard .img {max-width:120px;}
.playCardList.grid .playCard .inactive {width:100px; height:100px; margin:10px auto; padding-top:0;}
.playCardList.grid .playCard .inactive::before {top:50%; transform:translate(-50%, -50%);}

.playCardList:not(.grid) {margin:0 -24px; padding-bottom:30px;}
.playCardList .swiper-container {padding:0 24px; overflow:visible;}
.playCardList .swiper-slide {padding-right:27px;}
.playCardList:not(.grid) .playCard {height:480px; padding:0 30px; background-color:transparent; box-shadow:none;}
.playCardList:not(.grid) .playCard .tit {margin:0 -30px; font-size:2.4rem; text-align:left;}

.playCardBtn {position:fixed; left:0; right:0; bottom:15px; text-align:center; z-index:999;}
[class^=playCard] [class^=icoBtn_] {width:42px; height:42px; margin:0 5px; background-repeat:no-repeat; background-position:center center; background-size:32px 32px;}
[class^=playCard] .ac [class^=icoBtn_] {margin-top:15px;}
.icoBtn_playCard {background-image:url(../../assets/images/play/common/btn_ico_play_card.png);}
.icoBtn_playCard.on {background-image:url(../../assets/images/play/common/btn_ico_play_card_on.png);}
.icoBtn_playList {background-image:url(../../assets/images/play/common/btn_ico_play_list.png);}
.icoBtn_playList.on {background-image:url(../../assets/images/play/common/btn_ico_play_list_on.png);}
.icoBtn_playSetup {background-image:url(../../assets/images/play/common/btn_ico_play_setup.png);}

.menuSetup {margin-bottom:40px;}
.menuSetup > li {position:relative; width:100%; margin-bottom:16px; padding:10px 65px; text-align:center; border-radius:10px; background-color:#fff; color:#222; font-size:1.4rem; font-weight:500; text-align:center;}
.menuSetup .btnOrder {position:absolute; top:50%; right:5px; margin-top:-21px; overflow:hidden; font-size:0;}
.menuSetup .btnOrder [class^=icoBtn_] {width:30px; height:42px; vertical-align:top; overflow:visible;}
.menuSetup .btnOrder [class^=icoBtn_]:before {content:''; position:absolute; top:50%; left:-1px; height:10px; margin-top:-5px; border-left:1px solid #ccc;}
.menuSetup .icoBtn_up:after {content:''; position:absolute; left:50%; top:50%; width:8px; height:8px; margin-top:-2px; border:1px solid #999; border-width:1px 1px 0 0; transform:translateX(-50%) rotate(315deg); box-sizing:border-box; z-index:1;}
.menuSetup .icoBtn_down:after {content:''; position:absolute; left:50%; top:50%; width:8px; height:8px; margin-top:-6px; border:1px solid #999; border-width:1px 1px 0 0; transform:translateX(-50%) rotate(135deg); box-sizing:border-box; z-index:1;}

body.play .quickLink {display:flex; position:fixed; left:0; right:0; bottom:0; flex-wrap:nowrap; margin:0; padding:16px 19px; border-top:1px solid #ddd; background-color:#fff; align-items:flex-start; justify-content:space-between; z-index:100;}
body.play .content.bgGrayArea .quickLink {background-color:#f8f8f8;}
body.play .quickLink > li {width:100%; padding:0 15px; flex-grow:1; padding:0 7px;}
body.play .quickLink > li:first-child {border-left:0;}
body.play .quickLink .block {width:100%; color:#222; font-size:14px; font-weight:500; text-align:center;}
body.play .quickLink .block img {width:48px; height:48px;}
body.play .quickLink .block span {display:block; margin-top:10px; word-break:keep-all;}

body.play .popup.notice .popCont {background-image:none;}
body.play .popup.notice .popCont .tit {padding-right:0;}
body.play .popup.notice .btnArea .btn_p.s {width:80%; margin:10px auto;}
.scrollFixCtrl {transform:translate(0,0%); transition: transform 0.18s ease-in-out;}
.scrollFixCtrl.off {transform:translate(0,100%);}

/* Tutorial */
.tutorialWrap {position: fixed; width:100vw; height: 100vh; background: rgba(0,0,0,.8) url(../../assets/images/smart/content/bg_tutorial_life.png) center top no-repeat; z-index: 10000;}
.play .tutorialWrap {background-image: url(../../assets/images/smart/content/bg_tutorial_play.png)}
.tutorialWrap .bottomArea {position: absolute; bottom: 0; left:0; right: 0; padding: 7px 20px; background-color: rgba(0,0,0,.3);}
.tutorialWrap .bottomArea .single.toDay label {color:#fff; font-size: 1.4rem;}
.tutorialWrap .bottomArea .close {float: right; height: 30px; padding: 0 10px; font-size: 1.4rem; color: #fff;}
.tutorialWrap .single.toDay .ipt[type=checkbox] + label::before {left:5px; top:3px; height: 20px; width:20px; background-color: transparent;}
.tutorialWrap .single.toDay .ipt[type=checkbox] + label::after {left: 12px; top: 7px; width: 6px; height: 9px; border-color: transparent;}
.tutorialWrap .single.toDay .ipt[type=checkbox]:checked + label::before {background-color: #5d88fb;}
.tutorialWrap .single.toDay .ipt[type=checkbox]:checked + label::after {border-color: #fff;}

/*************************************************** media ***************************************************/
@media all and (max-width:767px) {
	/* 질병상세설명 */
	.digital .imgArea .img{width:calc((100% - 20px)/2); height:31vw;}
	.diseaseInfo .btn_s.m.more {display:block; position: relative; z-index: 3; margin:23px 0 40px; box-shadow: 0px -20px 20px 20px #fff;}
}

@media all and (max-width:400px) {
	/* 운전면허증 ui설정 */
	.digital .setDriver select.ipt {padding: 0 15px 0 8px;}
	.digital .setDriver .selectWrap {width: 35%;}
	.digital .setDriver input.ipt:nth-of-type(1) {width: 12%;}
	.digital .setDriver input.ipt:nth-of-type(2) {width: 24%;}
}

@media all and (max-width:360px) {
	.playCardList.grid .playCard {height:215px; padding-top:25px;}

	.playCardList:not(.grid) .playCard {height:430px;}
	.playCardList:not(.grid) .playCard .subTit {height:60px;}
	
	.playCardList.sub .playCard {height:auto !important;}


	/* .digital .digiProduct.all .prdBlockList li:nth-child(2) a {background-size: 28px;}
	.digital.main .digiProduct.all .prdBlockList li:nth-child(2) a img {margin-top: -27%;} */
	.digital .digiProduct.all .prdBlockList > li > a span.tit:after {position: absolute; content: ""; background-color: #ffffff; width: 100%; height: 10px; top: 0px; left: 0px;}
}

@media all and (max-width:350px) {
	/* 운전면허증 ui설정 */
	.digital .setDriver select.ipt {letter-spacing: -0.5px; padding: 0 15px 0 8px;}
	.digital .setDriver .selectWrap {width: 38%;}
	.digital .setDriver input.ipt:nth-of-type(1) {width: 8%;}
	.digital .setDriver input.ipt:nth-of-type(2) {width: 24%;}
	.digital .setDriver input.ipt:last-of-type {padding-left: 88%;}
}
 
@media all and (max-width:320px) {
	.playCardList.grid .playCard {height:194px;}
	.playCardList.grid .playCard .inactive {margin:0 auto;}

	.playCardList:not(.grid) .playCard {height:390px;}
	.playCardList:not(.grid) .playCard .subTit {height:55px;}
	.playCardList:not(.grid) .playCard .con {left:15px; right:15px;}
	.playBtn {margin-top:12px;}

	.fortuneLink > li {padding:0;}
	
	/* mypage */
	.myPage .myPoint .links {margin:0 4px 0 8px; font-size:1.2rem;}
	
	/* 연금유형 */
	.pensionAccoList .accoHead .ipt + label.lg {font-size:1.4rem;}
	
	/* 운전면허증 ui설정 */
    .digital .setDriver .selectWrap {width: 100%; margin: 0 0 8px;}    
    .digital .setDriver select.ipt {border-top-right-radius: 4px; border-bottom-right-radius: 4px; background-position: right 8px center; padding: 0 40px 0 15px; font-size: 16px;}
    .digital .setDriver input.ipt:nth-of-type(1) {margin: 0 10px; width: 15%;}
    .digital .setDriver input.ipt:nth-of-type(2) {width: 40%; margin: 0 10px;}
}

@media all and (min-width:624px) {
	/* 운전면허증 ui설정 */
	.digital .setDriver input.ipt:nth-of-type(1) {width: 17%;}
}


/*================================================== 추가요청 ==================================================*/
/* 시스템점검 */
.msgArea.serverCheck {padding-top:170px; background:url(../../assets/images/smart/common/msg_server_check.png) no-repeat center 0; background-size:188px auto;}
.msgArea.serverCheck .copy {font-size:1.6rem;}

/* 2depth 약관번외 CDAMYU0200 */
.termsAll.extra .accoBody .inner {margin-top:-12px; padding:10px 5px 10px 24px; font-size:1.6rem; color:#222; background:#f8f8f8;}
.termsAll.extra ul.termsWrap .accoHead > span:not(.tit) {font-weight:300; background-color:transparent;}

/* 신한플러스 회원가입 */
.logoShplus {padding-left:24px; background:url(../../assets/images/smart/content/img_shplus_logo.png) no-repeat 0 center; background-size:20px auto;}
.imgCont.full.shPlus img {max-width:408px;}

/* 회색박스안에 disabled : 추가 시 쉼표(,)로 추가 */
.accoBody .formList .ipt[disabled],
.infoDetail .ipt[disabled],
.pensionAccoList .accoBody .ipt[disabled] {border-color:#ccc; background-color:#f1f1f1 !important; color:#8a8a8a;}
.accoBody .formList .setPhone select.ipt[disabled],
.infoDetail select.ipt[disabled],
.pensionAccoList .accoBody select.ipt[disabled] {background-color:transparent !important;}

/*ios 100vh오류*/
@supports (-webkit-touch-callout: none) {
	.digital {height: -webkit-fill-available;}
}

/* ios disabled 버그 */
.isDevice.isIOS .ipt[disabled] {opacity:1 !important;}
.isDevice.isIOS .setPhone select.ipt[disabled] {-webkit-text-fill-color:#222 !important;}
.isDevice.isIOS .setPhone .ipt[disabled]:not(:last-child):not(select) {background-color:#f8f8f8 !important;}
.isDevice.isIOS .accoBody .formList .setPhone .ipt[disabled]:not(:last-child):not(select) {background-color:#f1f1f1 !important;}

/* 신규앱설치유도 */
.msgArea.appNotice {padding-top:188px; background:url(../../assets/images/smart/common/msg_server_app.png) no-repeat center 0; background-size:208px auto;}
.msgArea.appNotice .copy {font-size:1.8rem;}

/* 약관 번외로 또 나옴 CDAMAC0500 */
.termsAll .accoBody .termsWrap .accoBody .termsWrap .accoHead > span {background-color: transparent; font-weight: 300}
.termsAll .accoBody .termsWrap .accoBody .termsWrap .accoHead > button {top:3px;}

/* 풀사이즈 기본 스와이퍼 */
.fullW > .swiperWrap .swiper-slide {padding-left:24px; padding-right:24px;}

/* 키패드 접근성 추가 */
.certiIpt .keypad .ipt[type=password][readonly] {border-radius:8px;}
.certiIpt .keypad .ipt[type=password][readonly] ~ button {position:absolute; top:0; bottom:0; left:0; width:100%; z-index:1;}
.keypad button:not(.icoBtn_keypad) {position:absolute; left:0; top:0; bottom:0; width:100%;}

/* 연금예상액조회/신청 */
sub,
sup {display:inline-block; padding-left:3px; color:#b87900; font-weight:300;}

.tblX tbody .tblX tbody > tr:not(:first-child) > th, 
.tblX tbody .tblX tbody > tr:not(:first-child) > td {border-top:1px solid #ddd;}
.tblWrap.scroll .tblX tbody .tblX {min-width:auto;}
.tblX.lg > tbody > tr > * {padding-left:15px; padding-right:15px;}

.conMath {display:block; margin-top:25px; font-weight:400; color:#222; font-size:1.4rem; white-space:nowrap; letter-spacing:-0.05rem;}
.conMath > * {display:inline-block; text-align:center; vertical-align:middle;}
.conMath .divide {position:relative; max-width:100%;}
.conMath .divide i {position:relative; display:block; margin-bottom:10px; padding:0 6px;}
.conMath .divide i:last-child {margin:0; padding:7px 6px 0;}
.conMath .divide i:last-child:after {content:''; position:absolute; top:-1px; left:0; right:0; border-bottom:1px solid #666;}
.conMath .result {display:block; margin-bottom:10px; color:#222; text-align:left;}
	
.conMath.midUp .divide {top:-12px;}
.conMath.midUp .result {padding-bottom:12px;}
.conMath.midDw {padding-bottom:12px;}
.conMath.midDw .divide {top:12px;}


/* s ----------- 2022-08-11*/
.playfloatingBtn {position:absolute; right:15px; bottom:20px; width:64px; z-index: 1000;}
.playfloatingBtn img {width:100%;}
/* e ----------- 2022-08-11*/


/* s ----------- 2022-08-22*/
.shlifeBanner_new { display:flex; justify-content:space-between; background:#fff; border-radius:8px; padding:10px 0; margin-bottom:16px;}
.shlifeBanner_new em {font-size:14px; color:#576ee8;  height:42px; line-height:42px; padding:0 0 0 46px; background-image:url(../../assets/images/smart/content/ico_mypage_shinhanplus.svg); background-repeat:no-repeat; background-position:left 16px top 50%; }
.shlifeBanner_new div {min-width:50%; display:flex; justify-content:flex-end; padding-right:16px;}
.shlifeBanner_new div a {display:block; margin-top:8px; width:78px; background-color:#fff; font-size:13px; font-weight:500;color:#222; height:28px; line-height:25px;border-radius:20px;  border:1px solid #d6e1fe; background:#eceffc; color:#445fe6; padding-left:35px; margin-left:14px; background-image:url(../../assets/images/smart/content/i_cp.png);  background-repeat:no-repeat; background-position:left 8px top 50%; }
.shlifeBanner_new div a:first-child {margin-left:0px; background-image:url(../../assets/images/smart/content/i_hm.png)}
/* e ----------- 2022-08-22*/


/* s ----------- 20221006 */
.loanRelativeInfo {background:#5d88fb; margin:0 -24px; padding-bottom:30px;}
.loanRelativeInfo > dl dt {text-align:center; padding-top:30px;}
.loanRelativeInfo > dl dt img {width:50%; max-width:190px;}
.loanRelativeInfo > dl dd {padding:40px 24px 0; color:#fff; font-size:16px;}
.loanRelativeInfo > dl dd h1 {padding:10px 0 15px;}
.loanRelativeInfo > .desc {padding-left:24px; color:#fff; font-size:13px; margin-top:10px;}

.loanRelativeInfo p.warningWhite {display:inline-flex; padding:3px 6px; background:rgba(255,255,255,0.2); color:#fff; font-size:13px; align-items:start; margin-top:16px;}
.loanRelativeInfo p.warningWhite strong {color:#5d88fb; background:#fff; border-radius:50%; display:inline-block;width:15px; height:15px; line-height:15px; text-align:center;  margin-right:3px;margin-top:2px;}
.loanRelativeInfo p.warningWhite span {width:calc(100% - 18px); padding-left:2px;}

.loanRelativeInfo .inner {padding:0 24px; margin-top:30px;}
.loanRelativeInfo .inner > div { background:#fff; border-radius:8px; padding:27px;}
.loanRelativeInfo .inner > div.card {margin-top:12px;}
.loanRelativeInfo .inner > div h2 {font-size:20px; font-weight:400; padding-bottom:3px;} 
.loanRelativeInfo .inner dl {border-radius:8px; background:#f8f8f8; padding:30px; margin-top:12px;}
.loanRelativeInfo .inner dl dt strong {display:inline-block; padding:4px 9px; font-size:14px;  color:#445fe6; background:#f2f6ff; border-radius:8px;}
.loanRelativeInfo .inner dl dd {margin-top:18px;}
.loanRelativeInfo .inner dl dd ul li {margin-top:24px;}
.loanRelativeInfo .inner dl dd strong {color:#222; font-size:16px;}
.loanRelativeInfo .inner dl dd small {font-size:14px;}
.loanRelativeInfo .inner dl dd p.desc {text-align:left;}
.loanRelativeInfo .inner dl dd ul li p {font-size:14px;}
.loanRelativeInfo .inner dl.first {min-height:250px;}
.loanRelativeInfo + .btnArea {margin:34px 0 72px;}
/* e ----------- 20221006 */



/* s ----------- 20221013 */
	.termsAll.new .accoHead .ipt + label.allChk:after {display:none;}
	.termsAll.new .accoHead .ipt + label.allChk {text-align:center;} 
	.termsAll.new ul.termsWrap .accoHead .iptGroup.agree {background:#fff; border-bottom:0px;}
	.termsAll.new + ul.termsWrap .accoHead {padding:4px 0px 4px 0;}
	.termsAll.new + ul.termsWrap .accoHead > span {padding:8px; border:none; font-weight:300;}
	.termsAll.new + ul.termsWrap .accoHead .iptGroup.agree {background:#fff; border-bottom:0px;}
/* e ----------- 20221013 */

/* s ----------- 20221128 */
.bottomSheet.main .popBody {overflow:hidden; padding:0;}
.bottomSheet.main .popBody .block.txt {padding:36px 24px 0px;}
.bottomSheet.main .popBody .block.txt > div {padding-bottom:70px;}
.bottomSheet.main .popBody .block.img img {width:100%;} 
.bottomSheet.main .popBody .swiperWrap {padding-bottom:0px;}
.bottomSheet.main .popBody .swiper-controls {bottom:12px;}
.bottomSheet.main .popBody .noLookBtn {margin-top:0px; width: calc(100% + 24px);}
.bottomSheet.main .popBody .noLookBtn .btn_day.today {padding-left:70px;}
.bottomSheet.main .popBody .noLookBtn .btn_day.today:before {    content: ''; position: absolute; top: 12px; left: 42px; width: 24px; height: 24px; border: 2px solid #ccc; border-radius: 2px; background-color: #fff; overflow: hidden; box-sizing: border-box; transition: all ease-in-out 0.15s;     border-radius: 50%;}
.bottomSheet.main .popBody .noLookBtn .btn_day.today:after {    content: ''; position: absolute; top: 17px; left: 50px; width: 8px; height: 12px; border: 1px solid transparent; border-width: 0 2px 2px 0; background-color: transparent; overflow: hidden; box-sizing: border-box; transform: rotate(45deg);  height: 11px; border-color: #ccc;}
/* e ----------- 20221128 */

/* s ----------- 2022-08-22 --------- 재수정 2022-12-26 재재수정230215 재재재수정230227 */ 

/* 231206 마이페이지 슈퍼쏠 영역 (s) */
.supersol_new_mydata {display:flex; justify-content:center;background:#fff;border-radius:8px;padding:13px 25px;margin-bottom:16px;}
.supersol_new_mydata .new_mydata_list {display: flex; justify-content:space-between; width: 100%; max-width: 360px;}
.supersol_new_mydata .new_mydata_list .supersol {display:inline-block;width:85px;}
.supersol_new_mydata .new_mydata_list .supersol img {width:100%;}
.supersol_new_mydata .new_mydata_list .new_mydata_txt a {position:relative;color:#666;font-weight:500;font-size:15px;margin-left: 30px;}
.supersol_new_mydata .new_mydata_list .new_mydata_txt a:before {content:'';position:absolute;left: -19px;top: 4px;bottom: 3px;width: 2px;background-color:#d9dadb;}
.supersol_new_mydata .new_mydata_list .new_mydata_txt a:first-child {margin-left:0;}
.supersol_new_mydata .new_mydata_list .new_mydata_txt a:first-child:before {display:none;}
@media all and (max-width:320px) {
	.supersol_new_mydata {padding:13px 15px;}
	.supersol_new_mydata .new_mydata_list .new_mydata_txt a {margin-left:20px;}
	.supersol_new_mydata .new_mydata_list .new_mydata_txt a:before {left:-14px;}
}
@media all and (max-width:280px) {
	.supersol_new_mydata .new_mydata_list .new_mydata_txt a {margin-left:10px;}
	.supersol_new_mydata .new_mydata_list .new_mydata_txt a:before {left:-8px;}
}
/* 231206 마이페이지 슈퍼쏠 영역 (e) */

.shlifeBanner_new_mydata { display:flex; justify-content:center; background:#fff; border-radius:8px; /*padding:10px 0;*/ margin-bottom:16px;}/* 230227::padding값 삭제  */
.shlifeBanner_new_mydata em {font-size:15px; letter-spacing: -0.2px; color:#576ee8;  height:42px; line-height:42px; padding:0 12px 0 42px; background-image:url(../../assets/images/smart/content/ico_mypage_shinhanplus.svg); background-repeat:no-repeat; background-position:left 12px top 50%; }
.shlifeBanner_new_mydata div {  display:flex; justify-content:flex-end;  }
.shlifeBanner_new_mydata div a {display:block; margin-top:8px; width:72px; background-color:#eceffc; font-size:14px; letter-spacing:-0.15rem; font-weight:500;color:#222; height:28px; line-height:25px;border-radius:20px;  border:1px solid #d6e1fe;  color:#445fe6; padding-left:33px; margin-right:15px; background-image:url(../../assets/images/smart/content/i_cp.png);  background-repeat:no-repeat; background-position:left 8px top 50%; }
.shlifeBanner_new_mydata div a:last-child {width:100px;  padding-left: 40px; margin-right:0px; background-image:url(../../assets/images/play/content/img_mydata_life.png); background-size:16px; background-position: left 18px top 50%;  background-color: rgba(0,0,0,0); border:0px; border-radius:0; border-left:1px solid #ddd;}

/* 20230215 신한플러스 버튼 수정 - 230227 재수정 (s) */
.shlifeBanner_new_mydata .mydata-list {display: flex; width: 100%; max-width: 360px; padding: 0 5px;}
.shlifeBanner_new_mydata .mydata-list li:first-child {width: 40%;}
.shlifeBanner_new_mydata .mydata-list li {width: 20%; margin: 9px 4px;}
.shlifeBanner_new_mydata .mydata-list li a {display: block; background-color: #eceffc; font-size: 15px; font-weight: 500; text-align: center; color: #445fe6; padding: 5px 0 6px 0; border-radius: 50px;}
.shlifeBanner_new_mydata .mydata-list li a.shinhan {padding-left: 20%; background-image:url(../../assets/images/smart/content/ico_mypage_shinhanplus.svg); background-repeat:no-repeat; background-position: left 13px top 50%; background-size: 22px;}
/* 20230215 신한플러스 버튼 수정 - 230227 재수정 (e) */
@media all and (min-width:460px) {
	.digital .iconGroup {bottom:38px; left:420px;}
}
@media all and (max-width:365px) {
	.shlifeBanner_new_mydata em {padding: 0 7px 0 39px;    font-size: 12px;}
	.shlifeBanner_new_mydata div a {margin-right:7px; font-size:12.5px; width: 67px;}
	.shlifeBanner_new_mydata div a:last-child {width:90px; background-position: left 10px top 50%; padding-left:30px;}
}

/* 20230215 신한플러스 버튼 수정 - 230227 재수정 (s) */
@media all and (max-width:375px) {
	.shlifeBanner_new_mydata .mydata-list li a.shinhan {background-position: left 8px top 50%;}
}
@media all and (max-width:360px) {
	.shlifeBanner_new_mydata .mydata-list li:first-child {width: 43%;}
	.shlifeBanner_new_mydata .mydata-list li {width: 19%;}
	.shlifeBanner_new_mydata .mydata-list li a.shinhan {background-position: left 11px top 50%; padding-left: 22%;}
}
@media all and (max-width:320px) {
	.shlifeBanner_new_mydata .mydata-list li {margin: 9px 3px;}
	.shlifeBanner_new_mydata .mydata-list li a {font-size: 14px; letter-spacing: -1px; border-radius: 15px;}
	.shlifeBanner_new_mydata .mydata-list li a.shinhan {background-position: left 7px top 50%;}
	.digital .iconGroup { top: 0px; right: 0px; width: 35px; left: unset; bottom: unset;} 
}
@media all and (max-width:280px) {
	.shlifeBanner_new_mydata .mydata-list li a.shinhan {background-position: left 3px top 50%; background-size: 18px;}
}
/* 20230215 신한플러스 버튼 수정 - 230227 재수정 (e) */

/* e ----------- 2022-08-22 --------- 재수정 2022-12-26 재재수정230215 재재재수정230227 */ 

/* s ----------- 20221219 */
.playCardList.grid .slideList .flg_new {}
.playCardList.grid .slideList .flg_new:before {content:"";position:absolute; top:0px; left:0px; width:60px; height:54px; display:block; z-index:2; background-image:url(../../assets/images/cda/content/i_new_tri.png); background-repeat:no-repeat; background-size:100%; overflow:hidden; border-radius:11px 0 0 0 ;}
/* e ----------- 20221219 */

/* s ----------- 2023-02-03*/
.popup.rdrenoti {position:fixed; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; width:100%; height:100vh; padding:0; background-color:rgba(0,0,0,0.4); overflow:hidden; z-index:999; outline:rgba(0,0,0,0.5); transition:opacity 0.4s;}
.popup.rdrenoti .popCont {position:relative; width:288px; padding:25px 22px 48px; border-radius:8px; background:#fff url() no-repeat right 26px top 26px; background-size:40px auto; box-shadow:7px 3px 27px rgba(0,0,0,0.35); overflow:hidden;}
.popup.rdrenoti .popCont .tit {margin-bottom:15px; padding-right:50px; color:#222; font-size:2.0rem; font-weight:300;}
.popup.rdrenoti .popCont .txt {margin-bottom:15px; color:#959595; font-size:1.3rem;}
/* e ----------- 2023-02-03*/

/* s ----------- 20230126 */
.mydataBanner {background-color: #f4f2ff; border-radius: 2px; padding: 0.4em 0; margin-top: 2em;}
.mydataBanner .inner {display: flex; align-items: center; justify-content: center;}
.mydataBanner .inner img {width: 20px; height: 24px;}
.mydataBanner .inner .con p {color: #5642bf;font-size: 1.4rem;font-weight: 400; letter-spacing: -1px; margin-left: 4px;}
/* e ----------- 20230126 */

/* s ----------- 230310 보험금대리청구인 가이드페이지 */
/* 메인 */
.agent-wrap {color:#222;padding: 56px 0 32px 0;}
.agent-visual {background-color:#fff1b7;padding-bottom:5px;}
.agent-visual img {width: 100%;}
.agent-visual ul {text-align: center;font-size: 1.3rem; margin-top:5px; line-height: 1.7;}
.agent-visual ul li {margin-bottom: 15px;}
.agent-list {padding:30px 24px 0 24px;}
.agent-wrap .tabWrap {margin-top:35px;}
.agent-wrap .tabList {border-bottom: 0; padding-bottom: 15px;}
.agent-wrap .tabList > li {align-items: normal; height: 100px; padding: 0 2px; color: #222;}
.agent-wrap .tabList > li:focus {outline: none;}
.agent-wrap .tabList li span {display:inline-block;border:1px solid #ebebeb;border-radius: 50px; width: 78px;height: 78px;line-height: 78px;}
.agent-wrap .tabList > li:after {content:''; position:absolute; left:0; right:0; bottom:0; height:3px; background-color:#ebebeb;}
.agent-wrap .tabList > li:before {content:'';position:absolute;left:50%;bottom:-9px;margin-left: -10px;width: 9px;height: 9px;background-color:#fff;border:6px solid #ebebeb;border-radius: 50px;z-index: 2;}
.agent-wrap .tabList > li.on span {border:1px solid #5d88fb;}
.agent-wrap .tabList > li.on:after {background-color:#5d88fb;}
.agent-wrap .tabList > li.on:before {bottom:-11px; margin-left: -13px; width: 25px; height: 25px; background-color:#5d88fb; border:none;}
.agent-wrap .tabList li span:before {content:'';position:absolute;bottom: 12px;left: 50%;margin-left: 0px;width: 2px;height: 11px;background-color: #ebebeb;}
.agent-wrap .tabList li.on span:before {margin-left: -1px;background-color: #5d88fb;}
.agent-wrap .tabList li.on span:after {content:'';position:absolute;bottom: -2px;left: 50%;margin-left: -4px;width:8px;height:12px;border:1px solid transparent;border-width:0 2px 2px 0;background-color:transparent;overflow:hidden;box-sizing:border-box;transform:rotate(45deg);border-color: #fff;z-index: 3;}
.agent-wrap .tabPanel {position: relative; margin-top:30px; padding:20px; border:1px solid #5d88fb; border-radius: 10px; color: #222;}
.agent-wrap .tabPanel .tit {font-size: 1.6rem; font-weight: 500; padding-bottom: 14px; border-bottom: 1px solid #eee;}
.agent-wrap .tabPanel .txt {text-align: center;}
.agent-wrap .tabPanel .txt dt {font-size: 1.8rem;font-weight:500;margin: 30px 0 20px 0; color: #5d88fb;}
.agent-wrap .tabPanel .txt dd {font-size: 1.5rem;line-height: 2.5rem;}
.agent-wrap .tabPanel .txt dd span {font-weight: 500;color: #715deb;}
.agent-wrap .tabPanel .num {position: absolute;top: 18px;right: 20px;font-size:1.2rem;color:#666;background-color:#f5f5f5;padding:5px 12px;border-radius: 20px;text-align:center;}
.agent-wrap .tabPanel .num span {color:#222;font-weight: 500;}
	/* 가이드 */
.agent_guide {background-color: #f6f6f6}
.agent_guide.popup {padding:82px 24px 30px;}
.agent_guide.popup .header {display:table; position:fixed; left:0; top:0; width:100%; min-height:70px; padding:0; border-bottom:1px solid #ccc; background-color:#fff; overflow:hidden; z-index:1000;}
.agent_guide.popup .header h1 {display:table-cell; height:54px; padding:1px 50px 0 20px; color:#222; text-align: left; font-size:1.8rem; font-weight:500; line-height:1.3; vertical-align:middle;}
.agent_guide.popup .icoBtn_close {position:fixed; top: 17px; right: 10px; z-index:1001;}
.popup.topBg {padding-top:55px;}
.agent_guide .qr_code {display: flex; justify-content: center; align-items: center; margin-bottom: 15px;}
.agent_guide .qr_code .img img {width: 70px; background-color: #fff; padding: 7px; border-radius: 5px;}
.agent_guide .qr_code .txt {font-size: 1.3rem; color: #705deb; margin: 0 0 0 10px;} 
.agent_guide img {width: 100%;}
.agent_guide .swiperWrap {padding-bottom: inherit; margin: 0; padding-top: 42px;}
.agent_guide .swiper-container {padding-top: 30px;}
.agent_guide.type2 .swiper-container {padding-top: 65px;}
.agent_guide .swiper-pagination {display:block;}
.agent_guide .swiper-controls {width:100%; white-space: normal; top: 10px; bottom: inherit;}
.agent_guide button.swiper-pagination-bullet {position:relative; width:70px; height:25px; margin:0 2px 5px 2px !important; font-size: 12px; border-radius:0; background:none; vertical-align:middle; opacity:1;}
.agent_guide button.swiper-pagination-bullet:before {position:absolute; top:50%; left:50%; width:70px; height:25px; border-radius:20px; background-color:#fff; color:#666; line-height: 23px; border: 1px solid #ddd; box-sizing:border-box; transform:translate(-50%, -50%); transition:all 0.25s ease-in-out;}
.agent_guide button.swiper-pagination-bullet:focus {outline:none;}
.agent_guide button:nth-child(1).swiper-pagination-bullet:before {content:'STEP 1';}
.agent_guide button:nth-child(2).swiper-pagination-bullet:before {content:'STEP 2';}
.agent_guide button:nth-child(3).swiper-pagination-bullet:before {content:'STEP 3';}
.agent_guide button:nth-child(4).swiper-pagination-bullet:before {content:'STEP 4';}
.agent_guide button:nth-child(5).swiper-pagination-bullet:before {content:'STEP 5';}
.agent_guide button:nth-child(6).swiper-pagination-bullet:before {content:'STEP 6';}
.agent_guide button:nth-child(7).swiper-pagination-bullet:before {content:'STEP 7';}
.agent_guide button:nth-child(8).swiper-pagination-bullet:before {content:'STEP 8';}
.agent_guide button.swiper-pagination-bullet-active:before {width:70px; background-color:#5d88fb; color:#fff; border: 1px solid #5d88fb}

@media all and (max-width:320px) {
	.agent-wrap .tabList > li {height: 87px;}
	.agent-wrap .tabList li span {width: 65px;height: 65px;line-height: 65px;font-size: 14px;}
}
/* e ----------- 230310 보험금대리청구인 가이드페이지 */

.popup .tabContents .hpTermSizeH{height:calc(100vh - 342px);}
.popup .tabContents .hpTermSizeH02{height:calc(100vh - 267px);}
.popup .tabWrap.topGap0{ margin-top:-27px;}

.popup.notice .popCont.limitTradeCont{width:327px;padding-bottom:30px;background:#fff;}
.popup.notice .popCont.limitTradeCont .txtList.disc > li{padding-right:12px;}
.popup.notice .popCont.limitTradeCont .notiBox{margin-top:10px;}
.popup.notice .popCont.limitTradeCont .btnGroup{margin:0 0 0}
.popup.notice .popCont.limitTradeCont .txtList.stepDown{margin-top:0}
.popup.notice .popCont.limitTradeCont .txtList.stepDown li{text-align:center;}
.popup.notice .popCont.limitTradeCont .txtList.stepDown li + li{text-align:center;margin-top:28px;}
.popup.notice .popCont.limitTradeCont .txtList.stepDown li:before{content:""; display:block; position:absolute; bottom:-20px; left:50%; transform:translateX(-50%); width:15px; height:15px; border-radius:50%; background:#fff;}
.popup.notice .popCont.limitTradeCont .txtList.stepDown li:after{content:""; display:block; position:absolute; bottom:-14px; left:50%; transform:translateX(-50%) rotate(-45deg); width:4px; height:4px; border-left:1px solid #666; border-bottom:1px solid #666;}
.popup.notice .popCont.limitTradeCont .txtList.stepDown li:last-child:before{display:none;}
.popup.notice .popCont.limitTradeCont .txtList.stepDown li:last-child:after{display:none;}
@media all and (max-width:320px) {
	.popup.notice .popCont.limitTradeCont{width:288px;}
}

/* 240116 - 대출만기연장 추가 (s) */
.notiBox .infoList .val .valInfo {line-height:1.2;}
.notiBox.bgDarkPurple {background-color:#47435d; box-shadow: 2px 2px 5px rgba(113,60,92,0.1);}
.notiBox.bgDarkPurple .infoList .item {color:#fff}
.notiBox.bgDarkPurple .infoList .val {color:#fff}
.notiBox.bgDarkPurple .infoList .val .valInfo{color:#fff}
.telCounseling {position:relative; margin-bottom:50px;}
.telCounseling::before {content:'';position:absolute;top:0;right:0;display:block;width:48px;height:48px;background:url(../../assets/images/smart/common/ico_tel_counseling.png) no-repeat 0 0 / 100%;}
.infoList.finish .val .valInfo{line-height:1.2;font-weight:300;}
.csCenterGuide {padding:20px 16px 20px 76px; background:#f2f6ff url(../../assets/images/smart/common/ico_tel_counseling_bl.png) no-repeat 16px center / 48px;}
.csCenterGuide dl dt{font-size:1.4rem; color:#222;}
.csCenterGuide dl dd .tel{font-size:1.8rem; font-weight:500; color:#5d88fb}
.csCenterGuide dl dd p{font-size: 1.3rem;}
/* 240116 - 대출만기연장 추가 (e) */

/* 240328 - 스크래핑 보험금 청구 (s) */
.tabList.subTab2 {width:100%; margin:0; padding:0; border-bottom:none; border-radius:4px; background-color:#fff; overflow:hidden; white-space:normal;}
.tabList.subTab2 > li{height:45px; padding:0px 5px; font-size:1.4rem; border:1px solid #ccc; border-left:0; word-break:keep-all;}
.tabList.subTab2 > li > em{margin:0 5px;}
.tabList.subTab2 > li:first-child{border-left:1px solid #ccc;border-radius:4px 0 0 4px;}
.tabList.subTab2 > li:last-child{border-radius:0 4px 4px 0;}
.tabList.subTab2 > li.on {color:#fff; border-color:#5d88fb; background:#5d88fb; z-index:0;}
.tabList.subTab2 > li.on:after {display:none;}

.msgArea.certify2 {padding-top:150px; margin-bottom: 25px; background:url(../../assets/images/smart/common/msg_certify2.png) no-repeat center 40px / 80px;} /* 인증절차진행 */

.txtList.step.cf_list {max-width:320px; margin: 20px auto 10px auto;}
.txtList.step.cf_list > li {border:1px solid #ccc; border-radius: 3px; padding: 10px 10px 10px 60px; margin-top:16px; background-color:#fff;}
.txtList.step.cf_list > li:before {top: 50%; transform: translateY(-50%); left: 15px; color: #5642bf; background-color: #f6f5fc;font-weight: 500;}
.txtList.step.cf_list:before {display:none;}

.imgCont.scrView{overflow:auto; margin:0; height:calc(100vh - 200px);}
.imgCont.scrView img{max-width:none;}

.progStepArea{padding:0 15px;margin:15px 0 40px}
.progStepArea .progList > li:not(:last-child):before {background:#e7e8ef;}
.progStepArea .progList > li:not(:last-child):after {border-color:#e7e8ef transparent transparent transparent;}

.btn_t.addArrow.s{line-height:1;padding-left:15px;padding-right:15px;width:auto;}
.btn_t.addArrow.s > span{padding-right:11px; font-size:1.4rem; vertical-align:middle;}
.btn_t.addArrow.s > span::before {content:''; position:absolute; right:0; top:50%; width:7px; height:7px; border:1px solid #4560e6; border-width:1px 1px 0 0; box-sizing:border-box; transform:translateY(-50%) rotate(45deg); z-index:1;}

.popup .transBarArea{margin:0 0 -25px}
.popup .transBarArea .msgBox{display:flex; align-items:center; justify-content:center; flex-direction:column; min-height:160px; text-align:center;}
.popup .transBarArea .msgBox > .tit:only-child{margin-bottom:0;}
.popup .transBarArea .barGraph.percentR{height:8px;margin-top:25px;}
.popup .transBarArea .barGraph.percentR .percent{position:absolute; right:0; bottom:9px; font-size:1.4rem; font-weight: 500; color: #5642bf;}
.popup .transBarArea .barGraph.percentR .bar{height:8px}

.infoBox .infoList.type2:last-child{margin-bottom:10px;}
.infoBox .infoList.type2 li .item{min-width:37%; padding-right:0px;}
.infoBox .infoList.type2 li .val{min-width:28%;}

.btnTxtArrow{position:relative; font-size:1.4rem; color:#666;}
.btnTxtArrow.prev{padding-left:15px;}
.btnTxtArrow.next{padding-right:15px;}
.btnTxtArrow::before{content:''; position:absolute;  top:50%; width:8px; height:8px; border:1px solid #666;  box-sizing:border-box; transform:translateY(-50%) rotate(45deg); z-index:1;}
.btnTxtArrow.prev::before{left:0; border-width:0 0 2px 2px;}
.btnTxtArrow.next::before{right:0; border-width:2px 2px 0 0;}

.msgArea.error{padding-top:136px; background:url(../../assets/images/smart/common/msg_no_cyber.svg) no-repeat center 40px;}

@media all and (max-width:320px) {
	.infoBox .infoList.type2 li .val{min-width:40%;}
}
/* 240328 - 스크래핑 보험금 청구 (s) */

/* 240509 - 보험요율 판정 누적 지급보험금 상세 (s) */
.infoList li.addTip .item{padding-right:0px;}
.infoList li.addTip .period{letter-spacing:-0.02em;}

.moneyBox.flex{display:flex; align-items:center; justify-content:space-between;}
.moneyBox.flex.s .tit{font-size:14px; font-weight:300; color:#666; line-height:24px;}
.moneyBox.flex.s .money{margin:0; font-size:14px; font-weight:700; color:#445fe6;}
.moneyBox.flex.s .money em{font-size:14px; font-weight:700;}
@media all and (max-width:320px) {
	.moneyBox.flex.s{padding: 24px 12px}
}

.infoBox.accoType .infoHead{padding:0 0 14px;}
.infoBox.accoType .infoHead .tit{margin-bottom:0; font-size:16px; font-weight:500;}
.infoBox.accoType .infoHead .icoBtn_open:after{top:32px; transform:translate(-50%, -50%) rotate(-45deg);}
.infoBox.accoType .infoDetail{z-index:2;}
.infoBox.accoType .tooltip .icoBtn_close{top:17px; right:10px;}
/* 240509 - 보험요율 판정 누적 지급보험금 상세 (e) */

/* 240516 - 스크래핑 보험금 청구 서류첨부화면예시 사이즈조절 (s) */
.imgCont.imgAddFileEx{margin-top:0; padding:0 !important; text-align:center;}
.imgCont.imgAddFileEx img{max-width:400px;}
/* 240516 - 스크래핑 보험금 청구 서류첨부화면예시 사이즈조절 (e) */

/* 240524 - 녹위부활 신청 프로세스 (s) */
[class^=btn_].xsr{display:inline-block; width:auto; min-width:64px; min-height:28px; margin:0 4px; line-height:1; padding:0px 11px; border-radius:14px; font-size:13px; font-weight:500; letter-spacing:-0.05em;}
[class^=btn_]:not(button).xsr {line-height:26px;}
[class^=btn_].xsr.arrow:after{display:inline-block; content:''; width:8px; height:8px; vertical-align:middle; margin:-3px 0 0 1px; border:1px solid #fff; border-width:1px 1px 0 0; box-sizing:border-box; transform:rotate(45deg); z-index:1;}

.infoList .val.addBtn [class^=btn_].xsr{margin-top:-4px;}
.msgArea.counselReq{padding-top:105px; background:url(../../assets/images/smart/common/msg_counsel_req.png) no-repeat center 8px / 108px;}
/* 240524 - 녹위부활 신청 프로세스 (e) */