@charset "utf-8";

@import url('/assets/m/css/font.css');
@import url('/assets/m/css/reset.css');

html,
body{display: block; height: 100vh; font-size: 16px; line-height: 1.5; color: rgb(34, 34, 34); letter-spacing: -1px;}

/* WEBSQUARE OVERRIDE - COMMON */
input, select, textarea, button, option {font-family: "Noto Sans KR", "맑은 고딕", "돋움", dotum, sans-serif!important;}
.w2group.field-outline {background-color: transparent !important;}
/* WEBSQUARE OVERRIDE - INPUTCALENDAR */
.field-calendar {display: flex!important; align-items: stretch; height: 48px; border: 0; background-color: transparent;}
.field-calendar:focus {outline: none;}
.field-calendar * {background: transparent;}
.field-calendar .w2inputCalendar_div_input {flex: 1; position: relative; float: initial!important; margin: 0; padding: initial!important; width: initial!important; height: initial!important;}
.field-calendar .w2inputCalendar_divInput {margin: 0; padding: 0 16px!important; border: 0; width: 100%!important; height: 100%!important; font-family: "돋움",Dotum; font-size: 16px!important; ime-mode: disabled;}
.field-text + .field-calendar .w2inputCalendar_divInput {padding-left: 0!important;}
.field-calendar .w2inputCalendar_divInput:focus {outline: none;}
.field-calendar .w2inputCalendar_div_img {flex-grow: 0; flex-shrink: 0; flex-basis: auto; display: flex; align-items: center; padding: 0 16px; width: initial!important; height: 100%;}
.field-calendar .w2inputCalendar_button {overflow: visible; position: relative; top: initial!important; margin: 0; padding: 0; width: 24px; height: 24px; border: 0; background-image: url("/assets/m/images/common/icn_calendar.svg")!important; background-repeat: no-repeat; background-position: 0 0; font-size: 0; line-height: 0; cursor: pointer;}
/* WEBSQUARE OVERRIDE - RADIO */
.field-radio-wq div {display: inline-flex; align-items: center; position: relative; margin-right: 32px; height: 48px;}
.field-radio-wq div:last-child {margin-right: 0!important;}
.field-radio-wq label {display: flex; align-items: center; font-size: 16px; line-height: 1; cursor: pointer;}
.field-radio-wq label::before {content: ''; flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-right: 8px; width: 20px; height: 20px; background: url("/assets/m/images/common/icns_radio.svg"); background-repeat: no-repeat; background-position: 0 0;}
.field-radio-wq input:checked ~ label::before {background-position: 0 -20px;}
.field-radio-wq input:disabled ~ .label::before {background-position: -20px 0;}
.field-radio-wq input:checked:disabled ~ label::before {background-position: -20px -20px;}
.field-radio-wq.type {flex-grow: 1; flex-shrink: 1; flex-basis: auto; display: flex;}
.field-radio-wq.type div {flex-grow: 1; flex-shrink: 1; flex-basis: 0; margin-right: 12px;}
.field-radio-wq.type label {flex: 1 0 0; display: flex; justify-content: center; align-items: center; position: relative; padding: 0; min-width: 80px; height: 48px; border-radius: 5px; background-color: rgb(255, 255, 255); box-shadow: 0 0 0 1px rgb(187, 187, 187); font-size: 16px; cursor: pointer;}
.field-radio-wq.type label::before {display: none;}
.field-radio-wq.type input:checked ~ label {box-shadow: 0 0 0 2px rgb(196, 133, 69);}
.field-radio-wq.type input:disabled ~ label {box-shadow: 0 0 0 1px rgb(187, 187, 187);}
.field-radio-wq.type input:checked:disabled ~ label {box-shadow: 0 0 0 2px rgb(187, 187, 187);}
.field-radio-wq.type.group {flex-grow: 1; flex-shrink: 1; flex-basis: auto; border-radius: 5px; box-shadow: inset 0 0 0 1px rgb(187, 187, 187);}
.field-radio-wq.type.group > div {margin-right: 0;}
.field-radio-wq.type.group label {background-color: transparent; box-shadow: none;}
.field-radio-wq.type.group input:checked ~ label {box-shadow: inset 0 0 0 2px rgb(196, 133, 69);}
.field-radio-wq.type.group input:checked:disabled ~ label {box-shadow: 0 0 0 2px rgb(187, 187, 187);}
.field-radio-wq.type.sm > div {margin-right: 8px;}
.field-radio-wq.type.sm label {min-width: auto; height: 32px;}
.field-radio-wq.block div {display: flex;}
.field-radio-wq.block div + div {margin-top: 16px;}
/* WEBSQUARE OVERRIDE - CHECKBOX */
.field-checkbox-wq div {display: inline-flex; align-items: center; position: relative; margin-right: 32px; height: 48px;}
.field-checkbox-wq div:last-child {margin-right: 0!important;}
.field-checkbox-wq label {display: flex; align-items: center; font-size: 16px; cursor: pointer;}
.field-checkbox-wq label::before {content: ''; flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-right: 8px; width: 20px; height: 20px; background: url("/assets/m/images/common/icns_checkbox.svg"); background-repeat: no-repeat; background-position: 0 0;}
.field-checkbox-wq input:checked ~ label::before {background-position: 0 -20px;}
.field-checkbox-wq input:disabled ~ .label::before {background-position: -20px 0;}
.field-checkbox-wq input:checked:disabled ~ label::before {background-position: -20px -20px;}
.field-checkbox-wq.type label {display: flex; align-items: center; font-size: 16px; cursor: pointer;}
.field-checkbox-wq.type label::before {content: ''; margin-right: 8px; width: 20px; height: 20px; background: url("/assets/m/images/common/icns_checkbox.svg"); background-repeat: no-repeat; background-position: -40px 0;}
.field-checkbox-wq.type input:checked ~ label::before {background-position: -40px -20px;}
.field-checkbox-wq.type input:disabled ~ .label::before {background-position: -60px 0;}
.field-checkbox-wq.type input:checked:disabled ~ label::before {background-position: -60px -20px;}
.field-checkbox-wq.dark {height: 20px;}
.field-checkbox-wq.dark div {height: auto;}
.field-checkbox-wq.dark label {font-size: 14px; color: rgb(255, 255, 255);}
.field-checkbox-wq.dark label::before {background: url("/assets/m/images/common/icns_checkbox_01.svg");}
.field-checkbox-wq.dark input:checked ~ label::before {background-position: -20px 0;}
/* WEBSQUARE OVERRIDE - RADIO, CHECKBOX */
.field-group .field-checkbox-wq,
.field-group .field-radio-wq {flex-grow: 1; display: flex; align-items: center; height: 48px;}
.field-group .field-checkbox-wq.sm,
.field-group .field-radio-wq.sm {flex-grow: 1; height: 32px;}
.field-checkbox-wq input,
.field-checkbox-inside input,
.field-radio-wq input {overflow: hidden; position: absolute; top: 0; left: 0; z-index: -1; width: 0; height: 0; opacity: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; pointer-events: none;}
.field-checkbox-wq.bold label,
.field-radio-wq.bold label {font-weight: bold;}
.field-checkbox-wq.sm label,
.field-checkbox-inside.sm label,
.field-radio-wq.sm label {font-size: 14px;}
.field-checkbox-wq.color1 label,
.field-radio-wq.color1 label {color: rgb(34, 34, 34);}
.field-checkbox-wq.color2 label,
.field-radio-wq.color2 label {color: rgb(85, 85, 85);}
.field-checkbox-wq.color3 label,
.field-radio-wq.color3 label {color: rgb(136, 136, 136);}
.field-checkbox-wq.top label,
.field-radio-wq.top label {align-items: flex-start;}
.field-checkbox-wq.col-1,
.field-radio-wq.col-1,
.field-checkbox-wq.col-2,
.field-radio-wq.col-2,
.field-checkbox-wq.col-3,
.field-radio-wq.col-3 {display: flex;}
.field-checkbox-wq.col-1 div,
.field-radio-wq.col-1 div {flex-grow: 0; flex-shrink: 0; flex-basis: 100%; margin-right: 0;}
.field-checkbox-wq.col-2 div,
.field-checkbox-inside.col-2 div,
.field-radio-wq.col-2 div {flex-grow: 0; flex-shrink: 0; flex-basis: calc(100% / 2); margin-right: 0;}
.field-checkbox-wq.col-3 div,
.field-radio-wq.col-3 div {flex-grow: 0; flex-shrink: 0; flex-basis: calc(100% / 3); margin-right: 0;}
.field-checkbox-wq.none-events *,
.field-radio-wq.none-events * {pointer-events: none!important;}
.field-checkbox-wq.auto,
.field-checkbox-inside.auto,
.field-radio-wq.auto,
.field-checkbox-wq.auto div,
.field-checkbox-inside.auto div,
.field-radio-wq.auto div {height: auto;}
.field-checkbox-wq.wrap,
.field-radio-wq.wrap {display: flex; flex-wrap: wrap; margin-top: -16px; margin-bottom: 16px;}
.field-checkbox-wq.wrap div,
.field-checkbox-inside.wrap div,
.field-radio-wq.wrap div {margin-top: 16px; margin-bottom: 0!important;}
/* WEBSQUARE OVERRIDE - FILE */
.field-file.single {position: relative; width: 100%; height: 48px;}
.field-file.single form {height: 100%!important;}
.field-file.single fieldset {padding: 0!important; margin: 0!important; width: 100%!important; height: 100%!important; border: 0!important;}
.field-file.single fieldset > input {padding: 0!important; height: 100%!important; border: 0!important;}
.field-file.single fieldset > input {position: absolute; z-index: 0; top: 0; left: 0; width: 100%; background-color: transparent; opacity: 0;}
.field-file.single fieldset span {z-index: 1; top: 0!important; left: 0!important; margin: 0!important; width: 100%!important; height: 100%!important; background-image: none!important;}
.field-file.single fieldset span {flex-grow: 0; flex-shrink: 1; flex-basis: 100%; display: flex; justify-content: center; align-items: center; padding: 0 16px; border-radius: 10px; background-color: rgb(119, 16, 57); vertical-align: middle; font-weight: bold; font-size: 16px; color: rgb(255, 255, 255); white-space: nowrap;}
.field-file.single fieldset span::before {content: '파일선택';}
.field-file.single fieldset span input {margin: 0!important; padding: 0!important; opacity: 0!important; width: 100%!important; height: 100%!important;}
.field-file.single fieldset span input {position: absolute; z-index: 2; top: 0; left: 0;}
.field-file.single fieldset span:focus-within {background-color: rgb(77, 40, 13);}
.field-file.single.disabled fieldset span {background-color: rgb(204, 204, 204); color: rgb(238, 238, 238); pointer-events: none;}
/* WEBSQUARE OVERRIDE - FILE(MULTIPLE) */
.field-file.multiple {display: flex; position: relative;}
.field-file.multiple span {flex-grow: 1; display: flex; justify-content: center; align-items: center; padding: 0 16px; height: 48px; border-radius: 10px; background-color: rgb(119, 16, 57); vertical-align: middle; font-weight: bold; font-size: 16px; color: rgb(255, 255, 255); white-space: nowrap;}
.field-file.multiple span::before {content: '파일선택';}
.field-file.multiple input {position: absolute; top: 0; height: 0; z-index: 1; width: 100%; height: 100%; background-color: transparent;}
.field-file.multiple span:focus-within {background-color: rgb(77, 40, 13);}
.field-file.multiple.disabled span {background-color: rgb(204, 204, 204); color: rgb(238, 238, 238); pointer-events: none;}
/* WEBSQUARE OVERRIDE - LOADING */
#___processbar2.w2modal{background-color:rgba(255, 255, 255, .6) !important;opacity:1;transition:all .4s;}/* 20240206 로딩화면 터치 현상 해결 : pointer-events:none; 삭제 */
#___processbar2.w2modal.block{opacity:1;}

/* LAYOUT */
.container {display: flex; flex-direction: column; min-height: 100%;}
html.none-scroll {overflow: hidden;}
html.none-scroll body {overflow: hidden;}
body.none-scroll {overflow: hidden;}
html.none-scroll .container,
html.none-scroll form {overflow: hidden; position: fixed; z-index: 0; top: 0; left: 0; width: 100vw; height: 100vh;}
/* LAYOUT - HEADER */
.header {display: flex; align-items: center; position: fixed; top: 0; left: 0; padding: 0 16px; width: 100%; height: 64px; border-bottom: 1px solid rgb(204, 204, 204); background-color: rgb(255, 255, 255); transition: top 200ms ease-in-out;}
.header-left {margin-right: auto;}
.header-right {margin-left: auto;}
.header-title {display: flex; align-items: center; position: absolute; top: 50%; left: 50%; font-weight: normal; font-size: 18px; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); letter-spacing: -2px; white-space: nowrap;}
.header-button {display: flex; justify-content: center; align-items: center; width: 32px; height: 32px;}
.header-button + .header-button {margin-left: 16px;}
.header-button.icon-keybank {margin-left: 8px; border-radius: 10px; box-shadow: 0 5px 10px rgb(0, 0, 0, 0.2);}
.header.color {background-color: rgb(248, 246, 245); border-bottom: 0;}
/* LAYOUT - MAIN */
.main {flex-grow: 1; flex-shrink: 1; flex-basis: auto; display: flex; flex-direction: column; padding-top: 64px; transition: padding-top 200ms ease-in-out;}
.section {flex-grow: 1; flex-shrink: 1; flex-basis: auto; display: flex; flex-direction: column; position: relative; z-index: 10; background-color: rgb(255, 255, 255);}
/* LAYOUT - NAV */
.nav {padding-top: 8px;}
.nav a {display: flex; align-items: center; padding: 0 24px; height: 48px; font-size: 14px; color: rgb(34, 34, 34);}
.nav a.bold {align-items: flex-start; padding-top: 22px; font-weight: bold; color: rgb(136, 136, 136);}
.nav a.bold {font-size: 1rem;}/* 20230712 추가 */
.nav .gnb .a3 > ul > li > a {margin-top: 24px; padding: 0; height: auto; font-weight: bold; font-size: 16px;}
.nav .gnb .a3 > ul > li > a > .nav-icon {margin-right: 7px; width: 32px; height: 32px;}
.nav a + .a4 {margin-top: 16px;}
.nav .gnb .a4 > ul > li {margin-top: 8px; border-radius: 10px; background-color: rgb(255, 255, 255);}
.nav .gnb .a5 {padding-bottom: 10px;}
.nav .gnb .a5 > ul > li > a {padding-left: 40px;}/* 20230712 추가 */
.nav a + .a4.group {padding: 10px 0; border-radius: 10px; background-color: rgb(255, 255, 255);}
.nav .gnb .a4.group > ul > li {margin-top: 0;}
/* LAYOUT - FOOTER */
/* .footer {} */

/* INSET */
.inset {padding: 0 24px;}
.inset::before {content: ''; overflow: hidden; display: block; clear: both;}
.inset.color {background-color: rgb(246, 246, 246);}
.inset.color1 {background-color: rgb(242, 242, 242);}
.inset.color2 {background-color: rgb(119, 16, 57);}
.inset.full {flex-grow: 1; flex-shrink: 1; flex-basis: auto;}
.inset.bottom {padding-bottom: 48px;}
.inset.bottom.sm {padding-bottom: 32px;}
.inset.bottom.lg {padding-bottom: 126px;}
.inset.middle {display: flex; flex-direction: column; justify-content: center;}
.inset.gradient {margin-top: -64px; padding-top: 64px; min-height: 480px; background: linear-gradient(rgba(248, 246, 245, 1), rgba(248, 246, 245, 0));}
.inset.overflow-x {overflow-x: hidden; width: 100%;}

/* HIDDEN */
.hidden {overflow: hidden; visibility: hidden; width: 0; height: 0; font-size: 0; line-height: 0; pointer-events: none;}

/* DIVIDE */
.divide {margin: 0; border: 0; border-top: 1px solid rgb(187, 187, 187);}

/* SPACE */
.space-xxl {margin-top: 64px!important;}
.space-xl {margin-top: 48px!important;}
.space-lg {margin-top: 32px!important;}
.space-md {margin-top: 24px!important;}
.space-sm {margin-top: 16px!important;}
.space-xs {margin-top: 8px!important;}
.space-none {margin-top: 0!important;}
.space-inset {padding: 52px 0;}

/* TITLE */
.title-wrap {padding-top: 32px;}
.title-wrap.inset-md {padding-top: 24px;}
.title-flex {display: flex; align-items: flex-start;}
.title-left {margin-right: auto;}
.title-right {margin-left: auto;}
.title {font-weight: bold; color: rgb(34, 34, 34);}
.title.lg {font-size: 24px;}
.title.h1 {font-size: 22px;}
.title.h2 {font-size: 22px;}
.title.h3 {font-size: 18px;}
.title .normal {font-weight: normal;}
.title .linear {background: repeating-linear-gradient(0deg, rgb(251, 229, 204) 2px, rgb(251, 229, 204) 10px, transparent 10px, transparent); color: rgb(169, 15, 57);}
.title .linear.color {background: repeating-linear-gradient(0deg, rgb(251, 229, 204) 2px, rgb(251, 229, 204) 10px, transparent 10px, transparent); color: rgb(169, 15, 57);}
.title.color1,
.title .color1 {color: rgb(13, 135, 50);}
.title.color2,
.title .color2 {color: rgb(169, 15, 57);}
.text + .title.h1 {margin-top: 11px;}
.text.sm + .title.h3 {margin-top: 8px;}
.title.h1.lh {line-height: 1.25em;}
.title-wrap.center {text-align: center;}
.title.center {text-align: center;}
/* TITLE - IMAGE */
.title-wrap.image {display: flex; flex-direction: column; min-height: 196px;}
.title-wrap.image.sm {min-height: 148px;}
.title-wrap.image.lg {min-height: 264px;}
.title-wrap.image .title {flex-grow: 0; flex-shrink: 0; flex-basis: auto;}
.title-wrap.image .title-flex {flex-grow: 1; flex-shrink: 1; flex-basis: auto;}
@media (max-width: 374px) {
	.title-wrap.image .title-flex {flex-direction: column;}
}
.title-wrap.image .title-flex .text {margin-top: 16px; padding-bottom: 16px;}
.title-wrap.image img {align-self: flex-end; flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-left: auto;}
.title-wrap.image.fixed {position: relative;}
.title-wrap.image.fixed img {position: absolute; bottom: 0; right: 0;}

/* TEXT */
.inset .text-wrap {margin: 0 -24px; padding: 12px 24px; background-color: rgb(245, 246, 249);}
.text {font-size: 16px; color: rgb(34, 34, 34); word-break: keep-all;}
.text.xxl {font-size: 22px;}
.text.xl {font-size: 20px;}
.text.lg {font-size: 18px;}
.text.md {font-size: 16px;}
.text.sm {font-size: 14px;}
.text.xs {font-size: 12px;}
.text.xxs {font-size: 10px;}
.text.normal {font-weight: normal;}
.text.bold {font-weight: bold;}
.text.color1 {color: rgb(34, 34, 34);}
.text.color2 {color: rgb(85, 85, 85);}
.text.color3 {color: rgb(136, 136, 136);}
.text.color4 {color: rgb(169, 15, 57);}
.text.color5 {color: rgb(169, 15, 57);}
.text.color6 {color: rgb(255, 255, 255);}
.text.color7 {color: rgb(227, 190, 162);}
.text.color8 {color: rgb(169, 15, 57)!important;}
.text.color9 {color: rgb(13, 135, 50)!important;}
.text.color10{color: #5088c7;}
.text.left {text-align: left;}
.text.right {text-align: right;}
.text.center {text-align: center;}
.text.flex {display: flex; align-items: center;}
.text.flex .text.left {margin-right: auto;}
.text.flex .text.right {margin-left: auto;}
.text.ellipsis {overflow: hidden; display: block; max-width: 100%; font-size: inherit; white-space: nowrap; text-overflow: ellipsis;}
.title.h1 + .text {margin-top: 16px;}
.text.underline {text-decoration: underline;}

.text.xs .text-item {display: inline-flex; position: relative;}
.text.xs .text-item + .text-item {margin-left: 4px; padding-left: 4px;}
.text.xs .text-item + .text-item::before {content: ''; position: absolute; top: 50%; left: 0; border-left: 1px solid rgb(136, 136, 136); height: 10px; transform: translateY(-50%);}

.less-br {word-break: keep-all;}
.less-br br {display: none;}

/* BULLET */
.bullet-list {font-size: 14px; color: rgb(84, 84, 84);}
.bullet-list.type {padding: 16px; border-top: 1px solid rgb(85, 85, 85); border-bottom: 1px solid rgb(221, 221, 221);}
.bullet-list.xs {font-size: 12px;}
.bullet-list.color2 {color: rgb(85, 85, 85);}
.bullet-list.color3 {color: rgb(136, 136, 136);}
.bullet-item {display: flex; align-items: stretch; font-weight: inherit; font-size: inherit; color: inherit;}
.bullet-item + .bullet-item {margin-top: 8px;}
.bullet {margin-right: 4px; font-weight: inherit; font-size: inherit; color: inherit; white-space: nowrap;}
.bullet-list .bullet-list {margin-top: 8px;}
.bullet-list.icon .bullet-item + .bullet-item {margin-top: 24px;}
.bullet-list.icon img {margin-right: 16px;}
.bullet-list.date .bullet-item + .bullet-item {margin-top: 16px;}
.bullet-list.date .bullet {margin-right: 16px; color: rgb(136, 136, 136);}
.bullet-item.color {color: rgb(169, 15, 57);}
.bullet-item .text {font-size: inherit; color: inherit;}

/* BUTTON */
.button-group {display: block;}
.button-group.left {text-align: left;}
.button-group.right {text-align: right;}
.button-group.center {text-align: center;}
.button-group.flex {display: flex;}
.button-group.gradient {position: relative; background-color: rgb(255, 255, 255);}
.button-group.gradient::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 32px; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1)); transform: translateY(-100%);}
.round .button-group + .button-group {margin-top: 8px;}
.button-fixed {height: 64px;}
.button-fixed .button-group {position: fixed; bottom: 0; left: 0; width: 100%; height: 64px;}
.button {flex-grow: 0; flex-shrink: 1; flex-basis: 100%; display: inline-flex; justify-content: center; align-items: center; padding: 0 16px; height: 64px; background-color: rgb(169, 15, 57); vertical-align: middle; font-weight: bold; font-size: 16px; color: rgb(255, 255, 255); white-space: nowrap;}
.button.disabled,
.button:disabled {background-color: rgb(204, 204, 204); color: rgb(255, 255, 255); pointer-events: none;}
.button.cancel {flex-basis: 50%; background-color: rgb(245, 245, 245); color: rgb(34, 34, 34);}
.button.cancel:focus {background-color: rgb(204, 204, 204);}
.button.cancel.disabled,
.button.cancel:disabled {background-color: rgb(220, 220, 220); color: rgb(153, 153, 153);}
.button-label {font-size: inherit; color: inherit; white-space: nowrap;}
.button-label.xs {font-size: 12px;}
.button.option {height: 48px; border-radius: 10px; background-color: rgb(119, 16, 57);}
.button.option.disabled,
.button.option:disabled {background-color: rgb(204, 204, 204); color: rgb(255, 255, 255);}
.button.option + .button.option {margin-left: 8px;}
.button.option.light {border: 2px solid  rgb(119, 16, 57); background-color: rgb(255, 255, 255); color: rgb(119, 16, 57);}
.button.table {padding: 0 13px; height: 28px; border-radius: 5px; border: 1px solid rgb(187, 187, 187); background-color: rgb(255, 255, 255); font-weight: normal; font-size: 13px; color: rgb(85, 85, 85);}
.button.table:focus {background-color: rgb(246, 246, 246);}
.button.table.disabled,
.button.table:disabled {border-color: rgb(238, 238, 238); color: rgb(204, 204, 204);}
.button.icon {padding: 10px 16px; max-width: 100%; min-height: 40px; height: auto; border-radius: 20px; border: 1px solid rgb(204, 204, 204); background-color: rgb(255, 255, 255); font-weight: normal; font-size: 14px; color: rgb(84, 84, 84);}
.button.icon:focus {background-color: rgb(238, 238, 238); border-color: rgb(187, 187, 187);}
.button.icon.disabled,
.button.icon:disabled {border-color: rgb(237, 237, 237); color: rgb(204, 204, 204);}
.button.icon .button-label {word-break: normal; white-space: initial;}
.button.icon .button-icon {flex-grow: 0; flex-shrink: 0; flex-basis: 16px;}
.button.icon .button-label + .button-icon {margin-left: 8px;}
.button.icon .button-icon + .button-label {margin-left: 8px;}
.button.icon.more {height: 64px; border: 0; border-radius: 0; font-size: 16px;}
.button.icon.more .button-icon {margin-left: 4px;}
.button-group.center .button.icon {padding-left: 24px; padding-right: 24px;}
.button-group.flex .button.icon + .button.icon {margin-left: 8px;}
.button.dark.icon {border-color: rgb(34, 34, 34); background-color: rgb(34, 34, 34); color: rgb(255, 255, 255);}
.button.dark.icon:focus {border-color: rgb(34, 34, 34); background-color: rgb(34, 34, 34);}
.button.dark.icon.disabled,
.button.dark.icon:disabled {border-color: rgb(204, 204, 204); background-color: rgb(204, 204, 204);}
.button.link {padding: 0; height: auto; background-color: transparent; font-weight: normal; line-height: 1; color: rgb(85, 85, 85); text-decoration: underline;}
.button.link:focus {color: rgb(34, 34, 34);}
.button.link.disabled,
.button.link:disabled {color: rgb(204, 204, 204);}
.button.bottom {justify-content: space-between; padding-left: 40px; height: 64px; border-radius: 10px 10px 0 0; background-color: rgb(119, 63, 21); box-shadow: 0 -10px 20px rgba(0, 0, 0, 0.16);}
.button.radio {flex: 1 0 0; display: flex; justify-content: center; align-items: center; position: relative; padding: 0; height: 32px; border-radius: 5px; background-color: rgb(255, 255, 255); box-shadow: 0 0 0 1px rgb(187 187 187); font-weight: normal; font-size: 14px; color: rgb(34, 34, 34); letter-spacing: -1px; cursor: pointer;}
.button.radio:focus {box-shadow: 0 0 0 2px rgb(196, 133, 69);}
.button.radio + .button.radio {margin-left: 8px;}
.button.sm {font-size: 14px;}
.button-icon.icon-googleplay + .button-label,
.button-icon.icon-appstore + .button-label {word-break: keep-all;}

/* LIST */
.list {font-size: 14px;}
.list-item {display: flex;}
.list-item + .list-item {margin-top: 16px;}
.list-left {margin-right: auto; font-size: inherit; color: rgb(136, 136, 136);}
.list-right {margin-left: auto; text-align: right; font-size: inherit; color: rgb(85, 85, 85);}
.list.type .list-item:first-child .list-left,
.list.type .list-item:first-child .list-right {font-weight: bold; color: rgb(33, 33, 33);}
.list.type .list-item + .list-item {margin-top: 4px;}
.list.type .list-item:first-child + .list-item {margin-top: 16px;}
dl.list dt {font-weight: bold;}
dl.list.color1 dt {color: rgb(34, 34, 34);}
dl.list dd {margin-top: 4px; color: rgb(85, 85, 85);}
dl.list dd + dt {margin-top: 16px;}
dl.list.type dt {margin-top: 16px; padding: 14px; min-height: 50px; border-bottom: 1px solid rgb(221, 221, 221); background-color: rgb(246, 246, 246); text-align: center;}
dl.list.type dd {margin-top: 16px; padding: 0 12px;}
dl.list.type .bullet-list {color: rgb(33, 33, 33);}
.list.line {padding: 16px; border-top: 1px solid #555; border-bottom: 1px solid #ddd;}
.list.line.each {padding: 0;}
.list.line.each .list-item {align-items: center; padding: 15px 0 15px 16px; min-height: 48px; color: rgb(85, 85, 85);}
.list.line.each .list-item + .list-item {margin: 0; border-top: 1px solid #ddd;}
.list.link {font-size: 16px;}
.list.link .list-item {align-items: center; padding: 0 48px 0 24px; min-height: 88px; border-radius: 10px; border: 1px solid rgb(221, 221, 221); background-color: rgb(255, 255, 255); background-image: url("/assets/m/images/common/icn_rang.svg"); background-repeat: no-repeat; background-position: calc(100% - 24px) 50%; background-size: 16px 16px;}
.list.link .list-item + .list-item {margin-top: 8px;}
.list.link .list-image {margin-right: 8px;}
.list.link .text.right {margin-left: auto;}
.list.flex {display: flex;}
.list.flex .list-item {flex-grow: 0; flex-shrink: 0; flex-basis: calc(100% / 3); display: flex; flex-direction: column; align-items: center;}
.list.flex .list-item.quarter{flex-basis: calc(100% / 4);} /*20230109 추가*/
.list.flex .list-item + .list-item {margin-top: 0;}
.list.flex .list-image {margin-bottom: 10px; width: 48px; height: 48px;}
.list.dl .list-item {display: block;}
.list.dl .list-dt {font-weight: bold;}
.list.dl .list-dd {margin-top: 4px; color: rgb(85, 85, 85);}
.list.dl img {width: 100%!important; height: auto!important;}
.list.dl .list-dd .img-size img{width: 25% !important; padding-top: 4px; image-rendering: -webkit-optimize-contrast;}/* 20240508 예금자보호 이미지 사이즈 수정*/
.list.dl .list-dd .img-size span{display: inline-block; width: calc(75% - 8px);}
.list-item.color * {color: rgb(214, 38, 38)!important;}

/* TABLE */
.table-wrap {overflow: hidden; width: 100%; border-top: 1px solid rgb(85, 85, 85);}
.table-wrap.none-line {margin-top: -2px; border-top: 0;}
table.table {table-layout: fixed; margin-left: -1px; width: calc(100% + 2px); border-top: 0; border-bottom: 0; font-size: 14px; color: rgb(34, 34, 34); vertical-align: top;}
table.table th,
table.table td {padding: 13px 0; border-bottom: 1px solid rgb(221, 221, 221); border-right: 1px solid rgb(221, 221, 221); word-break: keep-all;}
table.table th {background-color: rgb(246, 246, 246); font-size: inherit; color: inherit;}
table.table td {text-align: center; font-size: inherit; color: inherit;}
table.table tbody th + td {padding-left: 15px; text-align: left;}
table.table.center th,
table.table.center td {padding-left: 0; text-align: center;}
table.table.left th,
table.table.left td {padding-left: 15px; text-align: left;}
table.table th.left,
table.table td.left {padding-left: 15px; text-align: left;}
table.table th.right,
table.table td.right {padding-right: 15px; text-align: right;}
table.table th.center,
table.table td.center {padding-left: 0; text-align: center;}
table.table.none-line th,
table.table.none-line td {border-right: 0!important;}
table.table.none-break th,
table.table.none-break td {word-break: normal;}
table.table.sm,
table.table .sm {font-size: 14px;}
table.table.xs,
table.table .xs {font-size: 12px;}
.table.type th {padding: 12px; border-right: 0; background-color: transparent; text-align: left; font-weight: normal; color: rgb(136, 136, 136);}
.table.type td {padding: 12px; border-right: 0; height: 60px; text-align: left;}
.table.type td + td {padding-left: 0;}
.table.type td:last-child {width: 92px;}
.table.type .text {word-break: break-all;}

/* FORM */
.field + .field {margin-top: 16px;}
.field.sticky {position: sticky; top: 64px; margin: 0 -24px; padding: 24px 24px 0; background-color: rgb(255, 255, 255);}
.field.sticky::after {content: ''; position: absolute; z-index: 0; bottom: -24px; left: 0; width: 100%; height: 24px; background: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));}
.field.sticky [class*=field] {position: relative; z-index: 1;}
.field-group {overflow: hidden; display: flex; align-items: stretch; position: relative; min-height: 48px;}
.field-group + .field-group,
.field-flex + .field-group,
.field-grou + .field-flex,
.field-flex + .field-flex {margin-top: 8px;}
.field-group.size-sm {min-height: 40px;}
.field-group.inline {display: inline-flex; vertical-align: middle;}
.field-group.inline + .field-group.inline {margin-top: 0; margin-left: 12px;}
.field-group > * + *,
.field-group > * + * input {padding-left: 0!important;}
.field-flex {display: flex;}
.field-left {margin-right: auto; font-weight: inherit; font-size: inherit; color: inherit;}
.field-right {margin-left: auto; font-weight: inherit; font-size: inherit; color: inherit;}
.field-flex > .field-group {flex-grow: 1;}
.field-flex > .field-group.none-grow {flex-grow: 0; flex-shrink: 0;}
.field-flex .field-group + .field-group {margin-top: 0; margin-left: 8px; flex-basis: auto;}
.field-group.grow {flex-grow: 1; flex-shrink: 0; flex-basis: 0;}
/* FORM - INPUT */
.field-input {flex-grow: 1; flex-shrink: 0; flex-basis: 0; display: flex;}
.field-input input {flex-grow: 1; flex-shrink: 1; flex-basis: 100%; display: block; padding: 0 16px; min-width: 0; width: 100%; height: 48px; border: 0; background-color: transparent; font-size: 16px; color: rgb(34, 34, 34); caret-color: rgb(0, 0, 0);}
.field-input input:focus {outline: none;}
.field-input input::-ms-clear,
.field-input input::-ms-reveal {display: none; width: 0; height: 0;}
.field-input input::placeholder {color: rgb(187, 187, 187);}
.field-input input:-ms-input-placeholder {color: rgb(187, 187, 187);}
.field-input input::search-decoration,
.field-input input::search-cancel-button,
.field-input input::search-results-button,
.field-input input::search-results-decoration {display: none;}
.field-input input::-webkit-search-decoration,
.field-input input::-webkit-search-cancel-button,
.field-input input::-webkit-search-results-button,
.field-input input::-webkit-search-results-decoration {display: none;}
.field-input input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
.field-input input::-webkit-calendar-picker-indicator {-webkit-appearance: none;}
.field-input input:-internal-autofill-selected {background-color: transparent!important;}
.field-input.left input {text-align: left;}
.field-input.right input {text-align: right;}
.field-input.center input {text-align: center;}
.field-input input {caret-color: rgb(196, 133, 69);}
/* FORM - PASSWORD */
.field-input.password {position: relative;}
.field-input.password .field-digit {display: flex; justify-content: flex-start; align-items: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none;}
.field-input.password .field-digit i {flex-grow: 0; flex-shrink: 0; flex-basis: auto; width: 12px; height: 12px; border-radius: 6px; background-color: rgb(204, 204, 204);}
.field-input.password .field-digit i + i {margin-left: 4px;}
.field-input.password .field-digit i.active {background-color: rgb(136, 136, 136);}
.field-input.password input {color: transparent; caret-color: transparent;}
/* FORM - TEXTAREA */
.field-textarea {flex-grow: 1; flex-shrink: 1; flex-basis: auto; display: flex; padding: 10px 16px;}
.field-textarea textarea {flex-grow: 1; flex-shrink: 1; flex-basis: 100%; display: block; min-width: 0; width: 100%; min-height: 100px; height: 100%; border: 0; background-color: transparent; font-size: 16px; line-height: 1.5; word-break: break-all; resize: none; -ms-overflow-style: none; scrollbar-width: none;}
.field-textarea textarea::-webkit-scrollbar {display: none;}
.field-textarea textarea::placeholder {color: rgb(200, 200, 200);}
.field-textarea textarea.left {text-align: left;}
.field-textarea textarea.right {text-align: right;}
.field-textarea textarea.center {text-align: center;}
.field-textarea textarea:focus {outline: none;}
/* FORM - CHECKBOX, RADIO */
.field-checkbox input,
.field-radio input {overflow: hidden; position: absolute; top: 0; left: 0; z-index: -1; width: 0; height: 0; opacity: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; pointer-events: none;}
/* FORM - CHECKBOX */
.field-checkbox {display: inline-flex; align-items: center; margin-right: 12px; height: 48px;}
.field-checkbox .icn {width: 20px; height: 20px; background: url("/assets/m/images/common/icns_checkbox.svg"); background-repeat: no-repeat; background-position: 0 0; cursor: pointer;}
.field-checkbox .lbl {display: flex; align-items: center; padding-left: 8px; font-size: 16px; line-height: 1; cursor: pointer;}
.field-checkbox input:checked ~ .icn {background-position: 0 -20px;}
.field-checkbox input:disabled ~ .icn {background-position: -20px 0;}
.field-checkbox input:checked:disabled ~ .icn {background-position: -20px -20px;}
.field-checkbox input:disabled ~ .lbl {opacity: 0.25;}
/* FORM - RADIO */
.field-radio {display: inline-flex; align-items: center; margin-right: 32px; height: 48px;}
.field-group.space-md .field-radio {margin-right: 32px;}
.field-group.space-sm .field-radio {margin-right: 24px;}
.field-group.space-xs .field-radio {margin-right: 10px;}
.field-radio:last-child {margin-right: 0!important;}
.field-radio.grow {flex: 1;}
.field-radio .icn {width: 20px; height: 20px; background: url("/assets/m/images/common/icns_radio.svg"); background-repeat: no-repeat; background-position: 0 0; cursor: pointer;}
.field-radio .lbl {display: flex; align-items: center; padding-left: 8px; font-size: 16px; line-height: 1; cursor: pointer;}
.field-radio input:checked ~ .icn {background-position: 0 -20px;}
.field-radio input:disabled ~ .icn {background-position: -20px 0;}
.field-radio input:checked:disabled ~ .icn {background-position: -20px -20px;}
.field-radio input:disabled ~ .lbl {opacity: 0.25;}
.field-radio .lbl01 {flex: 1; display: flex; justify-content: center; align-items: center; position: relative; padding: 0 10px!important; min-width: 82px; height: 48px; background-color: rgb(255, 255, 255); font-size: 16px; cursor: pointer;}
.field-radio .lbl01::before {content: ''; position: absolute; top: 0; left: -1px; box-sizing: border-box; width: calc(100% + 1px); height: 100%; border: 1px solid rgb(187, 187, 187); border-radius: 5px;}
.field-radio input:checked ~ .lbl01::before {z-index: 1; border-width: 2px; border-color: rgb(55, 143, 238);}
.field-radio input:disabled ~ .lbl01::before {border-color: rgb(187, 187, 187); cursor: not-allowed;}
/* FORM - SELECT */
select.field-select {flex-grow: 1; flex-shrink: 1; flex-basis: auto; display: block; padding: 0 36px 0 16px; min-width: 0; height: 48px; border: 0; background-color: transparent; background-image: url("/assets/m/images/common/icn_dang.svg"); background-repeat: no-repeat; background-position: calc(100% - 12px) 50%; background-size: 16px 16px; font-size: 16px; color: rgb(0, 0, 0); appearance: none; -webkit-appearance: none;}
select.field-select.none-grow {flex-grow: 0;}
select.field-select::-ms-expand {display: none;}
select.field-select:focus {outline: none;}
button.field-select {flex-grow: 1; flex-shrink: 0; flex-basis: 0; overflow: hidden; display: flex; align-items: center; padding: 0 0 0 16px; background-image: url("/assets/m/images/common/icn_dang.svg"); background-repeat: no-repeat; background-position: calc(100% - 16px) 50%; background-size: 16px 16px; font-size: 16px; color: rgb(34, 34, 34);}
button.field-select * {flex-grow: 1; flex-shrink: 0; flex-basis: 0; overflow: hidden; margin-right: 32px; padding-right: 8px; text-overflow: ellipsis; white-space: nowrap;}
button.field-select.selected {color: rgb(34, 34, 34);}
/* button.field-select::after {content: ''; margin-left: auto; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_dang.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px;} */
/* FORM - LABEL */
.field-label {display: flex; align-items: center; margin-bottom: 8px; font-size: 12px; color: rgb(34, 34, 34);}
.field-label.inline {display: inline-flex; vertical-align: middle;}
/* FORM - TEXT */
.field-text {flex-shrink: 0; display: flex; align-items: center; padding: 0 16px; font-size: 16px; color: rgb(34, 34, 34);}
.field-text.inline {display: inline-flex; padding: 0; vertical-align: middle; font-size: 14px; color: rgb(34, 34, 34);}
.field-group + .field-text.inline {margin-left: 10px; height: 48px;}
.field-text.blue {color: rgb(55, 143, 238);}
.field-text.top {align-self: flex-start;}
.field-text.bottom {align-self: flex-end;}
/* FORM - OUTLINE */
.field-group {border-radius: 5px; box-shadow: 0 0 0 1px rgb(187, 187, 187); background-color: rgb(255, 255, 255); transition: all .2s ease;}
.field-group:focus-within {box-shadow: 0 0 0 2px rgb(196, 133, 69);}
.field-group.none-outline {overflow: initial; flex-wrap: wrap; min-height: auto; box-shadow: none; background-color: transparent;}
.field.invalid .field-group:not(.none-outline) {box-shadow: 0 0 0 2px rgb(169, 15, 57);}
/* FORM - MESSAGE */
.field-info,
.field-message {display: block; margin-top: 8px; font-size: 12px; color: rgb(136, 136, 136);}
.field-message + .field-message,
.field-message + .field-info {margin-top: 2px;}
.field.invalid .field-message {color: rgb(169, 15, 57);}
/* FORM - DISABLED */
.field-group.disabled {background-color: rgb(238, 238, 238)!important;}
.field-group.disabled input,
.field-group.disabled textarea {color: rgb(204, 204, 204);}
.field-group.disabled input::placeholder,
.field-group.disabled textarea::placeholder {color: rgb(204, 204, 204);}
.field-group.disabled input:-ms-input-placeholder,
.field-group.disabled textarea:-ms-input-placeholder {color: rgb(204, 204, 204);}
.field-group.readonly {background-color: rgb(238, 238, 238)!important;}
.field-group.readonly input,
.field-group.readonly textarea {color: rgb(34, 34, 34);}
.field-group.readonly input::placeholder,
.field-group.readonly textarea::placeholder {color: rgb(204, 204, 204);}
.field-group.readonly input:-ms-input-placeholder,
.field-group.readonly textarea:-ms-input-placeholder {color: rgb(204, 204, 204);}
.field-group.disabled *,
.field-group.readonly * {background-color: transparent!important; pointer-events: none!important;}
/* FORM - BUTTON */
.field-button {flex-grow: 0; flex-shrink: 0; flex-basis: auto; display: flex; align-items: center; padding: 0 16px;}
.field-button.option {justify-content: center; margin-left: 8px; min-width: 100px; height: 48px; border-radius: 5px; background-color: rgb(119, 16, 57); font-weight: bold; font-size: 16px; color: rgb(255, 255, 255);}
.field-button.option.disabled,
.field-button.option:disabled {background-color: rgb(204, 204, 204); color: rgb(238, 238, 238);}
/* FORM INTERACTIONS */
.field-radio input[type="radio"] ~ .icn,
.field-checkbox input[type="checkbox"] ~ .icn {box-shadow: 0 0 0 0 rgba(0, 0, 0, .08); transition: box-shadow .2s ease;}
.field-radio input[type="radio"] ~ .icn {border-radius: 50%;}
.field-checkbox input[type="checkbox"] ~ .icn {border-radius: 4px;}
.field-radio:hover input[type="radio"] ~ .icn,
.field-checkbox:hover input[type="checkbox"] ~ .icn{box-shadow:0 0 0 8px rgba(0, 0, 0, .08);}
.field-radio input[type="radio"][read-only] ~ .icn,
.field-radio input[type="radio"][read-only] ~ .lbl,
.field-radio input[type="radio"][disabled] ~ .icn,
.field-radio input[type="radio"][disabled] ~ .lbl,
.field-checkbox input[type="checkbox"][read-only] ~ .icn,
.field-checkbox input[type="checkbox"][read-only] ~ .lbl,
.field-checkbox input[type="checkbox"][disabled] ~ .icn,
.field-checkbox input[type="checkbox"][disabled] ~ .lbl{cursor:not-allowed;}
.field-radio input[type="radio"][read-only] ~ .icn,
.field-radio input[type="radio"][disabled] ~ .icn,
.field-checkbox input[type="checkbox"][read-only] ~ .icn,
.field-checkbox input[type="checkbox"][disabled] ~ .icn{box-shadow:none;}
/* FORM - CAPTCHA */
.field-group.captcha {min-height: 96px; background-color: #F5F6F9;}
.field-group.captcha img {flex-grow: 1;}
.field-group.captcha .field-button {align-self: flex-start; margin-left: auto; padding: 16px;}
/* FORM - AUTOFILL STYLE CLEAR */
.field-input input:-webkit-autofill,
.field-input input:-webkit-autofill:hover,
.field-input input:-webkit-autofill:focus,
.field-input input:-webkit-autofill:active,
.field-textarea textarea:-webkit-autofill,
.field-textarea textarea:-webkit-autofill:hover,
.field-textarea textarea:-webkit-autofill:focus,
.field-textarea textarea:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s;}

/* DROPDOWN */
.dropdown {display: block; position: relative; height: 48px;}
.dropdown.inline {display: inline-block;}
.dropdown:focus-within {z-index: 1;}
.dropdown__button {display: flex; justify-content: space-between; align-items: center; padding: 0 16px; width: 100%; height: 100%; border: 1px solid rgb(220, 220, 220); border-radius: 5px; font-size: 16px; background-color: rgb(255, 255, 255); color: rgb(34, 34, 34);}
.dropdown__button::after {content: ''; flex-shrink: 0; margin-left: 10px; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_dang.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: contain;}
.dropdown__button[aria-expanded=true] {border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.dropdown__button[aria-expanded=true]::after {transform: rotate(180deg);}
.dropdown__menu {overflow: hidden; display: none; position: absolute; bottom: -4px; left: 0; width: 100%; height: 120px; border-radius: 5px; background-color: rgb(255, 255, 255); transform: translateY(100%);}
.dropdown__menu[aria-hidden=false] {overflow-x: hidden; overflow-y: auto; display: block; z-index: 1; border: 1px solid rgb(220, 220, 220);}
.dropdown__item {display: flex; align-items: center; width: 100%; padding: 0 16px; height: 40px; background-color: rgb(255, 255, 255); font-size: 16px; color: rgb(102, 102, 102); cursor: pointer;}
.dropdown__item[aria-selected=true] {background-color: rgb(238, 238, 238);}
.dropdown.reverse .dropdown__button::after {transform: rotate(180deg);}
.dropdown.reverse .dropdown__button[aria-expanded=true]::after {transform: rotate(0deg);}
.dropdown.reverse .dropdown__menu {top: -4px; bottom: initial; transform: translateY(-100%);}
.dropdown.disabled .dropdown__button {background-color: rgb(238, 238, 238); color: rgb(204, 204, 204);}
.dropdown.readonly .dropdown__button {background-color: rgb(238, 238, 238);}
.dropdown.disabled,
.dropdown.readonly * {pointer-events: none;}

/* TERMS */
.terms {overflow: hidden; border-radius: 5px; border: 1px solid rgb(204, 204, 204);}
.terms-item {padding: 16px;}
.terms-item + .terms-item {padding-top: 0;}
.terms-item.line {padding-top: 16px; border-top: 1px solid rgb(204, 204, 204);}
.terms-item.bg {background-color: rgb(245, 246, 249);}
.terms-flex {display: flex;}
.terms-left {margin-right: auto;}
.terms-right {margin-left: auto;}
.terms-left.middle,
.terms-right.middle {display: flex; align-items: center;}
.terms-link {width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_rang.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px;}
.terms-item.space {padding-left: 42px;}
.terms-item .text {margin-bottom: 16px;}
.terms-item .text + .field-radio-wq > div,
.terms-item .text + .field-checkbox-wq > div {margin-bottom: 16px;}
.terms-left .text {margin-bottom: 0;}
.terms.data-collapse .terms-link {transform: rotate(90deg); transition: transform 200ms ease-in-out;}
.terms.data-collapse .terms-link.data-active {transform: rotate(-90deg);}
.terms.data-collapse .terms-content {overflow: hidden; height: 0;}
.terms.data-collapse .terms-content.data-active {overflow: hidden; height: auto;}
.terms.data-collapse .terms-inner {padding-top: 8px;}
.terms.data-collapse .terms-space {padding-left: 28px;}

/* TABS */
.tab-buttons {overflow: hidden; display: flex; position: relative; height: 40px; border-radius: 10px; background-color: rgb(245, 246, 249); box-shadow: inset 0 0 0 1px rgb(204, 204, 204);}
.tab-button {flex-grow: 1; flex-shrink: 0; flex-basis: 0; height: 100%; text-align: center; color: rgb(102, 102, 102); white-space: nowrap;}
.tab-button.data-active {border-radius: 10px; background-color: rgb(34, 34, 34); font-weight: bold; color: rgb(255, 255, 255);}
.tab-panel {display: none; padding-top: 24px;}
.tab-panel.data-active {display: block;}
.tab-panels.space-none .tab-panel,
.tab-panel.space-none {padding-top: 0;}
.tab.type .tab-buttons {margin: -4px 0 0 -4px; height: auto; border-radius: 0; background-color: transparent; box-shadow: none;}
.tab.type .tab-button {margin: 4px 0 0 4px; height: 38px; border-radius: 5px; background-color: rgb(249, 249, 249); border: 1px solid rgb(221, 221, 221); font-size: 12px;}
.tab.type .tab-button.data-active {border-color: rgb(119, 16, 57); background-color: rgb(119, 16, 57); color: rgb(255, 255, 255);}
.tab.type .tab-buttons.col-3,
.tab.type .tab-buttons.col-4 {flex-wrap: wrap;}
.tab.type .tab-buttons.col-3 .tab-button {flex-grow: 0; flex-basis: calc(100% / 3 - 4px);}
.tab.type .tab-buttons.col-4 .tab-button {flex-grow: 0; flex-basis: calc(100% / 4 - 4px);}
.tab.underline {position: relative;}
.tab.underline .tab-buttons {height: auto; border-radius: 0; background-color: transparent; box-shadow: inset 0 -1px 0px rgb(221, 221, 221);}
.tab.underline .tab-button {position: relative; height: 48px; border-radius: 0px; font-size: 14px;}
.tab.underline .tab-button::after {content: ''; position: absolute; z-index: 1; bottom: 0; left: 0; width: 100%; border-bottom: 4px solid transparent;}
.tab.underline .tab-button.data-active {background-color: transparent; color: rgb(34, 34, 34);}
.tab.underline .tab-button.data-active::after {border-color: rgb(34, 34, 34);}
.tab.gradient {position: relative;}
.tab.gradient .tab-sticky {position: sticky; top: 64px; left: 0; width: 100%;}
.tab.gradient .tab-sticky::before {content: ''; position: absolute; z-index: 2; top: 0; right: 0; width: 48px; height: 48px; background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); pointer-events: none;}
.tab.gradient .tab-sticky.reverse::before {left: initial; left: 0; background: linear-gradient(90deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));}
.tab.gradient .tab-buttons {overflow-x: auto; background-color: rgb(255, 255, 255);}
.tab.gradient .tab-buttons::-webkit-scrollbar {display: none; width: 0; height: 0; background-color: transparent; -webkit-appearance: none;}
.tab.gradient .tab-button {flex-grow: 0; flex-shrink: 0; flex-basis: 102px;}
.tab.gradient .tab-button span {transition: color 200ms ease-in-out;}
.tab.gradient .tab-button::after {left: 50%; width: 0; transform: translateX(-50%); transition: width 200ms ease-in-out;}
.tab.gradient .tab-button.data-active::after {width: 100%;}
.tab.gradient .tab-panel {display: block;}

/* COLLAPSE */
.collapse {overflow: hidden;}
.collapse-item {position: relative;}
.collapse-button {display: flex; align-items: center; width: 100%; height: 56px; padding: 16px 0; text-align: left; font-size: 16px; color: rgb(34, 34, 34);}
.collapse-label {font-size: inherit; color: inherit;}
.collapse-icon {flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-left: auto; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_dang_01.svg"); background-repeat: no-repeat; background-position: 0 0; transition: transform 200ms ease-in-out;}
.collapse-button.data-active .collapse-icon {transform: rotate(-180deg);}
.collapse-content {overflow: hidden; box-sizing: border-box; height: 0; /* max-height: 100px; */}
.collapse-content.data-active {/* overflow-y: auto; */ height: auto;}
.collapse.faq .collapse-inner {padding: 24px; border-radius: 10px; background-color: #f5f6f9; font-size: 14px; color: #555;}
.collapse.faq .collapse-button {padding: 16px 0; min-height: 72px; font-size: 14px; color: #222;}
.collapse.faq .collapse-label {flex-grow: 1; flex-shrink: 1; flex-basis: auto; display: flex; align-items: flex-start;}
.collapse.faq .collapse-icon {margin-left: 8px;}
.collapse.faq .collapse-label::before {content: 'Q'; margin-right: 8px; font-weight: bold; font-size: inherit; color: rgb(169, 15, 57);}
.collapse.faq .collapse-content {border-bottom: 1px solid #bbb;}
.collapse.faq .collapse-content.data-active {border-bottom: 0;}

/* MODAL */
.modal {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0);}
.modal.data-active {display: block;}
.modal-inner {display: flex; justify-content: center; align-items: center; position: relative; width: 100%; height: 100%;}
/* MODAL - TOP */
.modal.data-top .modal-content {position: absolute; top: -100%; left: 0; width: 100%;}
/* MODAL - RIGHT */
.modal.data-right .modal-content {display: flex; flex-direction: column; position: absolute; top: 0; right: -100%; width: 100%; height: 100%; background-color: rgb(245, 245, 245);}
.modal.data-right .modal-header {display: flex; align-items: center; padding: 0 16px; width: 100%; height: 64px;}
.modal.data-right .modal-body {flex: 1; overflow-y: auto; padding: 0 24px 48px;}
.modal.data-right .modal-close {margin-left: auto; width: 32px; height: 32px; background-image: url("/assets/m/images/common/icn_close.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px;}
/* MODAL - BOTTOM */
.modal.data-bottom .modal-header {display: flex; align-items: center; padding: 24px 24px 0;}
.modal.data-bottom .modal-content {position: absolute; bottom: -100%; left: 0; width: 100%; border-radius: 30px 30px 0 0; background-color: rgb(255, 255, 255);}
.modal.data-bottom .modal-body {overflow-y: auto; padding: 32px 24px; max-height: 60vh;}
.modal.data-bottom .modal-close {margin-left: auto; width: 32px; height: 32px; background-image: url("/assets/m/images/common/icn_close.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px;}
/* MODAL - LEFT */
.modal.data-left .modal-content {display: flex; flex-direction: column; position: absolute; top: 0; left: -100%; width: 50%; height: 100%;}
.modal.data-left .modal-body {flex: 1;}
/* MODAL - FULL */
.modal.data-full .modal-header {display: flex; align-items: center; position: relative; padding: 0 16px; width: 100%; height: 64px; border-bottom: 1px solid rgb(204, 204, 204);}
.modal.data-full .header-title {position: absolute; top: 50%; left: 50%; font-weight: normal; font-size: 18px; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);}
.modal.data-full .modal-content {flex: 1; display: flex; flex-direction: column;  width: 100%; height: 100%; background-color: rgb(255, 255, 255); opacity: 0;}
.modal.data-full .modal-body {flex: 1; overflow-x: hidden; overflow-y: auto;}
/* MODAL - CENTER */
.modal.data-center .modal-content {width: calc(100% - 48px); border-radius: 10px; background-color: rgb(255, 255, 255); opacity: 0;}
.modal.data-center .modal-body {padding: 48px 24px 24px;}
.modal.data-center .button-group {margin-top: 32px;}
/* MODAL - SELECT */
.modal-select {overflow-y: auto; padding: 24px 0 16px; max-height: 60vh;}
.modal-option {display: flex; position: relative; width: 100%; min-height: 64px; padding: 20px 48px 20px 24px; font-size: 16px;}
.modal-option.data-active {background-color: rgb(251, 229, 204);}
.modal-option.data-active::after {content: ''; position: absolute; top: 50%; right: 24px; width: 20px; height: 20px; background-image: url("/assets/m/images/common/icns_checkbox.svg"); background-repeat: no-repeat; background-position: -40px -20px; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
/* MODAL - HAMMER */
.modal.data-hammer {display: block; top: initial; bottom: calc(-100% + 78px); border-radius: 30px 30px 0 0; background-color: rgb(255, 255, 255); box-shadow: 0 -10px 20px rgba(0, 0, 0, 0.16); transition: bottom 200ms ease-in-out;}
.modal.data-hammer .modal-content {overflow-x: hidden; overflow-y: auto; display: flex; flex-direction: column; position: initial; width: 100%; height: calc(100%); border-radius: 30px 30px 0 0; background-color: rgb(255, 255, 255);}
.modal.data-hammer .modal-body {flex-grow: 1; overflow-y: auto; display: flex; flex-direction: column;}
.modal.data-hammer .button.hammer {flex-direction: column; align-items: center; height: 78px; border-radius: 30px 30px 0 0; background-color: rgb(119, 16, 57); color: rgb(255, 255, 255); transition: all 200ms ease-in-out;}
.modal.data-hammer .button.hammer::before {content: ''; margin-bottom: 10px; width: 16px; height: 16px; background-image: url('/assets/m/images/common/icn_dang_01_w.svg'); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; transform: rotate(180deg);}
.modal.data-hammer.data-active {bottom: 0;}
.modal.data-hammer.data-active .button.hammer {background-color: rgb(255, 255, 255); color: rgb(34, 34, 34);}
.modal.data-hammer.data-active .button.hammer::before {background-image: url('/assets/m/images/common/icn_dang_01.svg'); transform: rotate(0);}
/* MODAL - LOADING */
.modal.data-loading {display: block; background-color: rgb(255, 255, 255, 0.8); opacity: 0; pointer-events: none; transition: all 250ms ease-in-out;} 
.modal.data-loading.data-active {opacity: 1; pointer-events: initial;}
.modal.data-loading .loading {display: flex;}
.modal.data-loading .loading-item{width: 60px; height: 60px; border-radius: 30px; animation-name: loading; animation-duration: .875s; animation-iteration-count: infinite; animation-direction: alternate; animation-fill-mode: both; animation-timing-function: cubic-bezier(0.75, 0, 0.25, 1);}
.modal.data-loading .loading-item:nth-child(1){margin-right: -12px; background-color: rgb(169, 15, 57);}
.modal.data-loading .loading-item:nth-child(2){margin-left: -12px; background-color: rgb(196, 133, 69); animation-delay: .875s; opacity: 0;}
@keyframes loading {
	0% {transform: scale(0); opacity: 0;}
	100% {transform: scale(1); opacity: 1;}
}
/* MODAL - PDF */
.modal.data-pdf .modal-body {overflow: hidden; position: relative;}
.modal.data-pdf .pdf {overflow: hidden; width: 100%; height: 100%; border: 0;}
.modal.data-pdf .swiper-container {height: 100%;}
.modal.data-pdf .swiper-button-prev,
.modal.data-pdf .swiper-button-next {position: absolute; z-index: 10; top: 50%; width: 40px; height: 40px; border: 1px solid rgba(0, 0, 0, 0.25); border-radius: 50%; background-color: rgba(255, 255, 255, 0.75); transform: translateY(-50%); transition: opacity 200ms ease-in-out;}
.modal.data-pdf .swiper-button-prev {left: 8px;}
.modal.data-pdf .swiper-button-next {right: 8px;}
.modal.data-pdf .swiper-button-prev::after,
.modal.data-pdf .swiper-button-next::after {content: ''; position: absolute; top: 50%; left: 50%; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_rang.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px;}
.modal.data-pdf .swiper-button-prev::after {transform: translate(-55%, -50%) rotate(180deg);}
.modal.data-pdf .swiper-button-next::after {transform: translate(-45%, -50%);}
.modal.data-pdf .swiper-button-prev[aria-disabled=true],
.modal.data-pdf .swiper-button-next[aria-disabled=true] {opacity: 0.25;}
/* MODAL - PREPDF */
.modal.data-prepdf {display: block; visibility: hidden; z-index: -1; pointer-events: none;}
.modal.data-prepdf.data-active {display: block; visibility: visible; z-index: 10000; pointer-events: initial;}
.modal.data-prepdf .modal-body {overflow: hidden; position: relative;}
.modal.data-prepdf .pdf {overflow: hidden; width: 100%; height: 100%; border: 0;}
.modal.data-prepdf .swiper-container {height: 100%;}
.modal.data-prepdf .swiper-button-prev,
.modal.data-prepdf .swiper-button-next {position: absolute; z-index: 10; top: 50%; width: 40px; height: 40px; border: 1px solid rgba(0, 0, 0, 0.25); border-radius: 50%; background-color: rgba(255, 255, 255, 0.75); transform: translateY(-50%); transition: opacity 200ms ease-in-out;}
.modal.data-prepdf .swiper-button-prev {left: 8px;}
.modal.data-prepdf .swiper-button-next {right: 8px;}
.modal.data-prepdf .swiper-button-prev::after,
.modal.data-prepdf .swiper-button-next::after {content: ''; position: absolute; top: 50%; left: 50%; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_rang.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px;}
.modal.data-prepdf .swiper-button-prev::after {transform: translate(-55%, -50%) rotate(180deg);}
.modal.data-prepdf .swiper-button-next::after {transform: translate(-45%, -50%);}
.modal.data-prepdf .swiper-button-prev[aria-disabled=true],
.modal.data-prepdf .swiper-button-next[aria-disabled=true] {opacity: 0.25;}

/* ALERT */
.alert {text-align: center;}
.alert-image {display: inline-block; margin-bottom: 16px;}
.alert-image img {width: 60px; height: 60px; vertical-align: top;}
.alert-message {display: block; font-weight: bold; font-size: 16px; color: rgb(34, 34, 34);}

/* ROUND */
.round-wrap {padding-top: 24px;}
.round {padding: 24px; border-radius: 10px; background-color: rgb(249, 247, 246);}
.round.has-benefit {padding: 24px 12px;}
.round.center {text-align: center;}
.round.center .round-text {justify-content: center;}
.round-text {display: flex; align-items: center; font-size: 14px; color: #555;}
.round-text.lg {font-weight: bold; font-size: 18px; color: #222;}
.round-text.bold {font-weight: bold;}
.round .round-text {margin-top: 8px;}
.round > :first-child {margin-top: 0;}
.round > .round-text.lg + .round-text {margin-top: 4px;}
.round-flex {display: flex; }
.round-flex.col-2 > * {flex-grow: 0; flex-shrink: 0; flex-basis: calc(100% / 2);}
.round.type {border: 1px solid rgb(186, 186, 186); background-color: rgb(255, 255, 255);}
.round.shadow {background-color: rgb(255, 255, 255); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.16);}
.round.shadow + .round.shadow {margin-top: 24px;}
.round.message {padding: 16px; background-color: rgb(251, 238, 241); text-align: center;}
.round.color {background-color: rgb(245, 246, 249);}
.round.scroll {overflow-y: auto; height: 200px;}

/* BENEFIT */
.benefit {display: flex;}
.benefit-item {flex-grow: 0; flex-shrink: 1; flex-basis: calc(100% / 3); display: flex; flex-direction: column; align-items: center;}
.benefit-icon {margin-bottom: 14px; width: 32px; height: 32px;}
.benefit-text {text-align: center; font-size: 12px; color: rgb(85, 85, 85);}
.benefit-text.lg {font-weight: bold; font-size: 14px; color: #222222;}

/* RESULT */
.result {text-align: center;}
.result.valid {padding-top: 100px; background-image: url("/assets/m/images/common/icn_valid.svg"); background-repeat: no-repeat; background-position: 50% 0; background-size: 100px 100px;}
.result.invalid {padding-top: 100px; background-image: url("/assets/m/images/common/icn_invalid.svg"); background-repeat: no-repeat; background-position: 50% 0; background-size: 100px 100px;}
.result.none {padding-top: 100px; background-image: url("/assets/m/images/common/icn_empty.svg"); background-repeat: no-repeat; background-position: 50% 0; background-size: 100px 100px;}
.result.valid > :first-child,
.result.invalid > :first-child {margin-top: 8px;}
.result .text + .text {margin-top: 16px;}
.result .round.message {margin-top: 32px;}

/* TIMELINE */
.timeline-list {position: relative;}
.timeline-list::before {content: ''; position: absolute; z-index: 0; top: 0px; left: 6px; width: 1px; height: 100%; background-image: linear-gradient(180deg, #BBB, #BBB 2px, transparent 2px, transparent 100%); background-size: 1px 5px;}
.timeline-item {position: relative; padding-left: 20px;}
.timeline-item::before {content: ''; position: absolute; z-index: 1; top: 0; left: 0; width: 12px; height: 12px; border-radius: 50%; background-color: rgb(169, 15, 57); transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.timeline-item + .timeline-item {margin-top: 16px;}
.timeline-item:last-child::after {content: ''; position: absolute; z-index: 0; top: 0; left: 0; width: 20px; height: 100%; background-color: rgb(255, 255, 255);}
.timeline-round {padding: 24px; border-radius: 0 10px 10px 10px; background-color: rgb(245, 246, 247);}
.timeline.none-line .timeline-list::before,
.timeline.none-line .timeline-item::before,
.timeline.none-line .timeline-item::after {display: none;}
.timeline.none-line .timeline-item {padding-left: 0;}

/* GUIDE */
.guide {flex-grow: 1; flex-shrink: 1; flex-basis: auto; padding: 16px 24px 48px; background-color: rgb(242, 242, 242);}
.inset .guide {margin: 0 -24px;}
.guide-title {font-weight: bold; font-size: 16px; color: #222;}
.guide .bullet-list {margin-top: 16px; font-size: 12px; color: rgb(136, 136, 136);}

/* TILE */
.tile-wrap {overflow: hidden;}
.tile-list {display: flex; flex-wrap: wrap; margin-top: -8px;}
.tile-item {flex-grow: 1; flex-shrink: 1; flex-basis: 100%; display: flex; flex-direction: column; align-items: center; margin-top: 8px; padding: 16px 0; border: 1px solid rgb(221, 221, 221); border-radius: 10px; background-color: rgb(255, 255, 255);}
.tile-icon {position: relative; margin-bottom: 4px; width: 56px; height: 56px; border-radius: 50%;}
.tile-icon img {position: absolute; top: 50%; left: 50%; width: 100%; height: auto; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);}
.tile-text {font-size: 14px; color: rgb(33, 33, 33); word-break: keep-all;}
.tile-list.col-2 {margin: -8px 0 0 -8px;}
.tile-list.col-2 .tile-item {flex: 0; flex-basis: calc(100% / 2 - 8px); margin: 8px 0 0 8px;}
.tile-list.type {margin-top: -16px;}
.tile-list.type .tile-item {align-items: flex-start; position: relative; margin-top: 16px; padding: 24px 24px 24px 100px;}
.tile-list.type .tile-icon {position: absolute; top: 50%; left: 24px; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.tile-list.type .tile-title {display: flex; align-items: center; margin-bottom: 4px; font-weight: bold; font-size: 16px; color: #222;}
.tile-list.type .tile-title::after {content: ''; margin-left: 4px; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_rang_01.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px;}
.tile-list.type .tile-text {color: #555;}
.tile-list.once .tile-item {align-items: flex-start; position: relative; margin-top: 16px; padding: 24px 32px 24px 92px; background-image: url("/assets/m/images/common/icn_rang_01.svg"); background-repeat: no-repeat; background-position: calc(100% - 16px) 50%; background-size: 16px 16px;}
.tile-list.once .tile-icon {position: absolute; top: 50%; left: 16px; transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.tile-list.once .tile-text {font-size: 12px; color: #555;}
.tile-list.once .tile-title {display: flex; align-items: center; font-weight: bold; font-size: 14px; color: #222;}

/* STEP */
.step {padding-left: 36px; counter-reset: stepcount;}
.step-list {position: relative; padding-top: 6px;}
.step-list::before {content: ''; position: absolute; z-index: 0; top: 0px; left: 19px; width: 2px; height: 100%; background-image: linear-gradient(180deg, rgb(169, 15, 57), rgb(169, 15, 57) 100%); background-size: 2px 2px;}
.step-item {position: relative; padding-left: 54px;}
.step-item + .step-item {margin-top: 40px;}
.step-item::before {content: counter(stepcount); counter-increment: stepcount; display: flex; justify-content: center; align-items: center; position: absolute; z-index: 2; top: -6px; left: 0; width: 38px; height: 38px; border-radius: 50%; border: 2px solid rgb(169, 15, 57); background-color: rgb(255, 255, 255); font-weight: bold; font-size: 18px; color: rgb(169, 15, 57);}
.step-item:last-child::after {content: ''; position: absolute; z-index: 1; top: 0; left: 0; width: 38px; height: 100%; background-color: #fff;}
.step-title {margin-bottom: 16px; font-weight: bold; font-size: 18px;}

/* FRAME */
.frame {display: flex; flex-direction: column;}
.frame::before {content: ''; width: 100%; height: 27.2222vw; background-image: url("/assets/m/images/hlp/frame_01_01.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 100% auto;}
.frame::after {content: ''; width: 100%; height: 3.8888vw; background-image: url("/assets/m/images/hlp/frame_01_03.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 100% auto;}
.frame-inner {padding: 0 11.1111vw 7.2222vw; background-image: url("/assets/m/images/hlp/frame_01_02.svg"); background-repeat: repeat-y; background-position: 0 0; background-size: 100% auto; text-align: center;}
.frame-title {margin-top: -5vw; font-size: 5vw;}
.frame-text {margin-top: 6.6666vw; font-size: 3.3333vw;}
.frame.type {position: relative; padding: 24px 8px; border-top: 1px solid rgb(187, 187, 187); border-bottom: 1px solid rgb(187, 187, 187);}
.frame.type::before {position: absolute; top: 2px; left: 0; width: 100%; height: 1px; background-image: linear-gradient(90deg, rgb(187, 187, 187), rgb(187, 187, 187) 1px, transparent 1px, transparent 100%); background-repeat: repeat-x; background-size: 3px 1px;}
.frame.type::after {position: absolute; bottom: 2px; left: 0; width: 100%; height: 1px; background-image: linear-gradient(90deg, rgb(187, 187, 187), rgb(187, 187, 187) 1px, transparent 1px, transparent 100%); background-repeat: repeat-x; background-size: 3px 1px;}
.frame.type .bullet-list {font-size: 12px; color: rgb(34, 34, 34);}
.frame.type .bullet {margin-right: 8px; font-weight: bold;}

/* LOGO BLOCK */
.logo-block {padding-bottom: 40px; background-image: url("/assets/m/images/common/icn_logo_01.svg"); background-repeat: no-repeat; background-position: 50% 100%; background-size: 100px auto; text-align: center;}
.logo-block .text + .text {margin-top: 4px;}

/* IMAGE */
.image-wrap {text-align: center;}
.image-wrap img {width: 100%; vertical-align: top;}
.image01 {width: 90px;}
.float-image {overflow: hidden;}
.float-image img {float: left; margin-right: 8px;}

/* YOUTUBE */
.size-youtube {min-width: 86.6666vw; min-height: 48.8888vw;}

/* BBS - LIST */
.bbs-list .bbs-item {display: flex; flex-direction: column; justify-content: center; padding: 16px 24px 16px 0; min-height: 94px; border-bottom: 1px solid rgb(187, 187, 187);}
.bbs-list .bbs-item.link {background-image: url("/assets/m/images/common/icn_rang.svg"); background-repeat: no-repeat; background-position: 100% 50%; background-size: 16px 16px;}
.bbs-list .bbs-title {display: block; font-size: 14px; color: rgb(34, 34, 34);}
.bbs-list .bbs-title span:not([class*=badge]) {display: block;}
.bbs-list .bbs-text {display: flex; align-items: center; font-size: 12px; color: rgb(136, 136, 136);}
.bbs-list .bbs-text span {position: relative;}
.bbs-list .bbs-text span + span {margin-left: 8px; padding-left: 8px;}
.bbs-list .bbs-text span + span::before {content: ''; position: absolute; top: 50%; left: 0; height: 10px; border-left: 1px solid rgb(187, 187, 187); transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.bbs-list .bbs-title + .bbs-text {margin-top: 4px;}
.bbs-list.type .bbs-item {padding: 24px 0;}
.bbs-list.type .bbs-title {display: flex; align-items: center; font-weight: bold; font-size: 16px;}
.bbs-list.type .bbs-title + .bbs-text {margin-top: 8px;}
.bbs-list.type .bbs-status {flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-left: auto; font-weight: normal; font-size: 14px; color: rgb(13, 135, 50);}
.bbs-list.type .bbs-text span {font-size: 14px;}
.bbs-list.light .bbs-item {border-color: rgb(221, 221, 221);}
/* BBS - VIEW */
.bbs-view .bbs-head {padding: 16px 0; border-top: 1px solid rgb(85, 85, 85); border-bottom: 1px solid rgb(187, 187, 187);}
.bbs-view .bbs-title {display: block; font-size: 14px; color: rgb(34, 34, 34);}
.bbs-view .bbs-title span:not([class*=badge]) {display: block;}
.bbs-view .bbs-text {display: block; font-size: 12px; color: rgb(136, 136, 136);}
.bbs-view .bbs-text {display: flex; align-items: center; font-size: 12px; color: rgb(136, 136, 136);}
.bbs-view .bbs-text span {position: relative;}
.bbs-view .bbs-text span + span {margin-left: 8px; padding-left: 8px;}
.bbs-view .bbs-text span + span::before {content: ''; position: absolute; top: 50%; left: 0; height: 10px; border-left: 1px solid rgb(187, 187, 187); transform: translateY(-50%); -webkit-transform: translateY(-50%);}
.bbs-view .bbs-title + .bbs-text {margin-top: 4px;}
.bbs-view .bbs-file {padding: 16px; border-radius: 5px; background-color: #f5f6f9;}
.bbs-view .bbs-head + .bbs-file {margin-top: 24px;}
.bbs-view .bbs-file + .bbs-file {margin-top: 8px;}
.bbs-view .bbs-item {display: flex; align-items: center; font-size: 14px; color: rgb(85, 85, 85);}
.bbs-view .bbs-item::before {content: ''; flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-right: 8px; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_file.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px;}
.bbs-view .bbs-item + .bbs-item {margin-top: 8px;}
.bbs-view .bbs-body {margin-top: 24px; padding-bottom: 24px; font-size: 14px; color: rgb(85, 85, 85);}
.bbs-view img {max-width: 100%!important; height: auto!important;}
.bbs-view table {float: none!important; max-width: 100%!important; width: auto!important;}

/* BADGE */
.badge {display: inline-flex; align-items: center; margin-right: 8px; padding: 0 6px; height: 20px; border-radius: 5px; vertical-align: middle; font-weight: bold; font-size: 10px;}
.badge.color1 {background-color: rgb(251, 238, 241); color: rgb(169, 15, 57);}
.badge.color2 {background-color: rgb(230, 243, 234); color: rgb(13, 135, 50);}
.badge.color3 {background-color: rgb(169, 15, 57); color: rgb(255, 255, 255);}
.badge.bbs {font-size: 12px;}
.bbs-title .badge {margin-bottom: 4px; padding: 0 8px; border-radius: 2px; font-weight: normal; font-size: 12px;}

/* SCROLL TO TOP */
.scrolltop {display: flex; justify-content: center; align-items: center; position: fixed; right: 24px; bottom: 24px; width: 48px; height: 48px; border-radius: 50%; background-image: url('/assets/m/images/common/icn_top.svg'); background-repeat: no-repeat; background-position: 0 0; background-size: 48px 48px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15); font-size: 12px; color: rgb(255, 255, 255); opacity: 0; pointer-events: none; transition: opacity 600ms ease-in-out;}
.scrolltop.data-active {opacity: 1; pointer-events: initial;}

/* POPOVER */
.popover {overflow: hidden; position: absolute; z-index: 1; top: calc(50% - 16px); left: calc(100% + 7px); width: 143px; height: 32px; opacity: 0; pointer-events: none; transform-origin: 0% 50%; animation-fill-mode: forwards;}
.popover-message {display: inline-flex; justify-content: center; align-items: center; position: absolute; left: 11px; top: 0; width: 132px; height: 32px; border-radius: 16px; background-color: rgb(49, 49, 49); font-size: 12px; color: rgb(255, 255, 255); white-space: nowrap;}
.popover-message::before {content: ''; position: absolute; top: 50%; left: 2px; width: 0; height: 0; border-top: 6.5px solid transparent; border-bottom: 6.5px solid transparent; border-right: 11px solid rgb(49, 49, 49); transform: translate(-100%, -50%);}
.popover.fadein {animation-name: popover-fadein; animation-duration: 500ms;}
.popover.fadeinout {animation-name: popover-fadeinout; animation-delay: 1000ms; animation-duration: 4000ms;}
@keyframes popover-fadein {
	0% {opacity: 0; width: 0;}
	100% {opacity: 1; width: 143px;}
}
@keyframes popover-fadeinout {
	0% {opacity: 0; width: 0;}
	12.5% {opacity: 1; width: 143px;}
	87.5% {opacity: 1; width: 143px;}
	100%{opacity: 0; width: 0;}
}

/* CARD */
.card-wrap {overflow: initial;}
.card-item {display: flex; flex-direction: column; align-items: center; padding: 16px; width: 130px; min-height: 156px; border-radius: 10px; background-color: rgb(255, 255, 255); box-shadow: 10px 20px 20px rgba(0, 0, 0, 0.16);}
.card-item + .card-item {margin-left: 8px;}
.card-image {margin-bottom: 6px;}
.card-image img {width: 32px; height: 32px; vertical-align: top;}
.card-image + .text {margin-bottom: auto;}
.card-flex {display: flex; justify-content: center; align-items: center; margin-top: 16px; min-height: 36px;}
.card-item .text {text-align: center; word-break: keep-all;}
.card-flex .text + .text {margin-left: 4px;}

/* BANNER */
.banner-item {text-align: center;}
.banner-item a {display: block;}
.banner-item img {width: 100%;}
.banner-index {display: flex; justify-content: center; position: absolute; z-index: 1; bottom: 8px; left: 50%; transform: translateX(-50%);}
.banner-index .swiper-pagination-bullet {width: 8px; height: 8px; border-radius: 4px; background-color: rgba(255, 255, 255, 0.6); transition: all 200ms ease-in-out;}
.banner-index .swiper-pagination-bullet + .swiper-pagination-bullet {margin-left: 8px;}
.banner-index .swiper-pagination-bullet-active {width: 24px; background-color: rgb(255, 255, 255);}
.banner-prev {position: absolute; z-index: 1; top: 50%; left: 0; width: 24px; height: 32px; background-image: url('/assets/m/images/common/icn_prev.svg'); background-repeat: no-repeat; background-position: 0 0; background-size: 24px 32px; transform: translateY(-50%); transition: opacity 200ms ease-in-out;}
.banner-next {position: absolute; z-index: 1; top: 50%; right: 0; width: 24px; height: 32px; background-image: url('/assets/m/images/common/icn_next.svg'); background-repeat: no-repeat; background-position: 0 0; background-size: 24px 32px; transform: translateY(-50%); transition: opacity 200ms ease-in-out;}
.banner-bottom {display: flex; align-items: center; padding: 0 8px; height: 32px; background-color: rgb(0, 0, 0);}
.banner-close {margin-left: auto; width: 20px; height: 20px; background-image: url('/assets/m/images/common/icn_close_w.svg'); background-repeat: no-repeat; background-position: 0 0; background-size: 20px 20px;}
.banner-wrap .banner-index,
.banner-wrap .banner-prev,
.banner-wrap .banner-next {visibility: hidden; pointer-events: none;}
.banner-wrap.data-active .banner-index,
.banner-wrap.data-active .banner-prev,
.banner-wrap.data-active .banner-next {visibility: visible; pointer-events: initial;}
.banner-wrap.data-active .banner-prev.swiper-button-disabled,
.banner-wrap.data-active .banner-next.swiper-button-disabled {opacity: 0.5;}
.banner.fixed {display: none; position: fixed; top: 0; left: 0; width: 100%; height: auto;}
.banner.fixed .banner-wrap {background-color: rgb(255, 255, 255);}
.banner.fixed .banner-item img {height: 37.7777vw;}
.banner.fixed.data-active {display: initial; z-index: 8000;}
.banner.modal .modal-content {overflow-y: auto; width: calc(100% - 64px); max-height: 100%; border-radius: initial; background-color: transparent;}
.banner.modal .text-popup div > ul > div > div:first-child {max-height: 450px; padding: 20px;}/* 20231011 메인 모달팝업 높이고정 */
.banner.modal .text-popup div > ul > div > div:first-child > div:first-child {max-height: 400px; overflow-y: auto; overflow-x: hidden;}/* 20231011 메인 모달팝업 스크롤 추가 */
.banner.modal .banner-item a {overflow: hidden; display: block; border-radius: 30px;}
.banner.modal .banner-prev,
.banner.modal .banner-next {transform: translateY(-100%);}
.banner.modal .banner-index {position: initial; padding: 16px 0; transform: initial;}
.banner.modal .banner-bottom {background-color: transparent;}
@media (min-width: 429px) {
	.banner.fixed .banner-wrap img {width: auto; height: 120px;}
	.banner.modal .modal-content {width: 280px; height: auto;}
}

/* ARROW */
.increment::before {content:''; display: inline-block; margin: 0 2px; border-bottom: 6px solid rgba(255, 0, 0); border-left: 4px solid transparent; border-right: 4px solid transparent; transform: translateY(-25%);}
.decrement::before {content:''; display: inline-block; margin: 0 2px; border-top: 6px solid rgba(0, 0, 255); border-left: 4px solid transparent; border-right: 4px solid transparent; transform: translateY(-25%);}

/* Z-INDEX (FIXED) */
.header {z-index: 1000;}
.button-fixed .button-group {z-index: 1000;}
.scrolltop {z-index: 1000;}
.modal.data-hammer {z-index: 9000;}
.modal {z-index: 10000;}
.modal.data-loading {z-index: 11000;}
#___processbar2 {z-index: 11000;}
#___processbar2_i {position: fixed!important; z-index: 11000; top: 50%!important; left: 50%!important; width: 115px!important; transform: translate(-50%, -50%)!important;}
#___processbar2_i iframe {width: 115px!important;}
.modal.fixed {z-index: 8000;}
/* Z-INDEX (STICKY) */
.field.sticky {z-index: 1000;}
.tab.gradient .tab-sticky {z-index: 1000;}

/* ICON */
.icon-clear {display: inline-block; width: 24px; height: 24px; background-image: url("/assets/m/images/common/icn_clear.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 24px 24px; vertical-align: middle;}
.icon-calendar {display: inline-block; width: 24px; height: 24px; background-image: url("/assets/m/images/common/icn_calendar.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 24px 24px; vertical-align: middle;}
.icon-search {display: inline-block; width: 24px; height: 24px; background-image: url("/assets/m/images/common/icn_search.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 24px 24px; vertical-align: middle;}
.icon-back {display: inline-block; width: 32px; height: 32px; background-image: url("/assets/m/images/common/icn_back.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px; vertical-align: middle;}
.icon-menu {display: inline-block; width: 32px; height: 32px; background-image: url("/assets/m/images/common/icn_menu.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px; vertical-align: middle;}
.icon-keybank {display: inline-block; width: 40px; height: 40px; background-image: url("/assets/m/images/common/icn_keybank.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 40px 40px; vertical-align: middle;}
.icon-home {display: inline-block; width: 32px; height: 32px; background-image: url("/assets/m/images/common/icn_home.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px; vertical-align: middle;}
.icon-logo {display: inline-block; width: 154px; height: 20px; background-image: url("/assets/m/images/common/icn_logo.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 154px 20px; vertical-align: middle;}
.icon-refresh {display: inline-block; width: 20px; height: 20px; background-image: url("/assets/m/images/common/icn_refresh.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 20px 20px; vertical-align: middle;}
.icon-rang {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_rang.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-rang01 {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_rang_01.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-dang {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_dang.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-list {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_list.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-call {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_call.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-googleplay {display: inline-block; width: 17px; height: 17px; background-image: url("/assets/m/images/common/icn_googleplay.png"); background-repeat: no-repeat; background-position: 0 0; background-size: 17px 17px; vertical-align: middle;}
.icon-appstore {display: inline-block; width: 17px; height: 18px; background-image: url("/assets/m/images/common/icn_appstore.png"); background-repeat: no-repeat; background-position: 0 0; background-size: 17px 18px; vertical-align: middle;}
.icon-more {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_dang_02.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-close {display: inline-block; width: 32px; height: 32px; background-image: url("/assets/m/images/common/icn_close.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px; vertical-align: middle;}
.icon-file {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_file.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-download {display: inline-block; width: 16px; height: 16px; background-image: url("/assets/m/images/common/icn_down.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 16px 16px; vertical-align: middle;}
.icon-exit {display: inline-block; width: 32px; height: 32px; background-image: url("/assets/m/images/cln/icn_exit.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px; vertical-align: middle;}

/* APP DATA STYLE */
.appdata,
.appdata * {font-size: 14px!important;}
.appdata table {table-layout: fixed; margin-top: 16px; width: 100%; border-top: 1px solid rgb(85, 85, 85); border-right: 0; border-bottom: 0; border-left: 0; font-size: 14px; color: rgb(34, 34, 34); vertical-align: top;}
.appdata table th,
.appdata table td {padding: 13px 0; border-top: 0; border-right: 1px solid rgb(221, 221, 221); border-bottom: 1px solid rgb(221, 221, 221); border-left: 0; text-align: center; font-size: inherit; color: inherit; word-break: keep-all;}
.appdata table tr :last-child {border-right: 0;}

/* KIBANK APP STYLE COPY */
/* 색상 - 글자 */
.kibankapp .fc_00{color:#222222 !important;}
.kibankapp .fc_01{color:#555555 !important;}
.kibankapp .fc_02{color:#ffffff !important;}
.kibankapp .fc_03{color:#adb4be !important;}
.kibankapp .fc_04{color:#888888 !important;}
.kibankapp .fc_05{color:#5be5ef !important;}
.kibankapp .fc_06{color:#ff4242 !important;}
.kibankapp .fc_07{color:#31ccf6 !important;}
.kibankapp .fc_08 {color:#00A3AA !important;}
.kibankapp .fc_09 {color:#31333e !important;}
.kibankapp .fc_10{color:#378fee !important;}
.kibankapp .fc_11{color:#2c7040 !important;}
.kibankapp .fc_12{color:#378fee !important;}
/* 고객센터 영업점안내 */
.kibankapp .info_wrap li{padding-top: 18px;}
.kibankapp .info_wrap li:before{content: ''; display: block; width: 16px; height: 16px; position: absolute; left: 24px;}
.kibankapp .info_wrap li.sub:before{background-image: url(/assets/images/ic_subway.png);}
.kibankapp .info_wrap li.bus:before{background-image: url(/assets/images/ic_bus.png);}
.kibankapp .info_wrap li.car:before{background-image: url(/assets/images/ic_car.png);}
.kibankapp .info_wrap li p{font-size: 14px;}
.kibankapp .info_wrap li p.ty01{display: inline-block; padding: 3px 4px; color: #fff; border-radius: 2px;}
.kibankapp .info_wrap li p.ty02{padding-top: 4px;}
.kibankapp .info_wrap li p.ty01:nth-child(n+2){margin-left: 4px;}
.kibankapp .info_wrap li p.ty01.st01{background: #ffc400;}
.kibankapp .info_wrap li p.ty01.st02{background: #2e5384;}
.kibankapp .info_wrap li p.ty01.st03{background: #00a14c;}
.kibankapp .info_wrap li p.ty01.st04{background: #fb7f21;}
.kibankapp .info_wrap li p.ty01.st05{background: #3768ee;}
.kibankapp .info_wrap li p.ty01.st06{background: #8038df;}
.kibankapp .info_wrap li p.ty01.st07{background: #6e3706;}
.kibankapp .info_wrap li p.ty01.st08{background: #747F00;}
.kibankapp .info_wrap li p.ty01.st09{background: #e52e8f;}
.kibankapp .info_wrap li p.ty01.st10{background: #ff4242;}
.kibankapp .info_wrap li p.ty01.st11{background: #888;}
.kibankapp .info_wrap li p.ty01.st12{background: #58b133;}
.kibankapp .info_wrap li p.ty01.st13{background: #3e95e2;}
.kibankapp .info_wrap li ul{display: flex; flex-direction: row; flex-wrap: wrap; padding-top: 5px;}
.kibankapp .info_wrap li ul li{padding-top: 0!important; padding-right: 17px; position: relative;}
.kibankapp .info_wrap li ul li:after{content: ''; display: block; position: absolute; top: 4px; right: 8px; width:1px; height: 12px; background: #e8e8e8;}
.kibankapp .info_wrap li ul li:last-child{padding: 0;}
.kibankapp .info_wrap li ul li:last-child:after{display: none;}
/* 여백 */
.kibankapp .pd00 {padding:0 !important;}
.kibankapp .pt0 {padding-top:0 !important;}
.kibankapp .pt8 {padding-top:8px !important;}
.kibankapp .pt10 {padding-top:10px !important;}
.kibankapp .pt16 {padding-top:16px !important;}
.kibankapp .pt24 {padding-top:24px !important;}
.kibankapp .pt32 {padding-top:32px !important;}
.kibankapp .pt42 {padding-top:42px !important;}
.kibankapp .pt56 {padding-top:56px !important;}
.kibankapp .pt64 {padding-top:64px !important;}
.kibankapp .pt80 {padding-top:80px !important;}
.kibankapp .pl0 {padding-left:0 !important;}
.kibankapp .pl5 {padding-left:5px !important;}
.kibankapp .pl10 {padding-left:10px !important;}
.kibankapp .pl15 {padding-left:15px !important;}
.kibankapp .pl32 {padding-left:32px !important;}
.kibankapp .pb0 {padding-bottom:0 !important;}
.kibankapp .pb8 {padding-bottom:8px !important;}
.kibankapp .pb10 {padding-bottom:10px !important;}
.kibankapp .pb16 {padding-bottom:16px !important;}
.kibankapp .pb24 {padding-bottom:24px !important;}
.kibankapp .pb32 {padding-bottom:32px !important;}
.kibankapp .pb250 {padding-bottom:250px !important;}
.kibankapp .plr0 {padding-left:0 !important; padding-right:0 !important;}
.kibankapp .plr24 {padding-left:24px !important; padding-right:24px !important;}
.kibankapp .mt0 {margin-top:0 !important;}
.kibankapp .mt8 {margin-top:8px !important;}
.kibankapp .mt10 {margin-top:10px !important;}
.kibankapp .mt12{margin-top: 12px !important;}
.kibankapp .mt16{margin-top: 16px !important;}
.kibankapp .mt24 {margin-top:24px !important;}
.kibankapp .mt32 {margin-top:32px !important;}
.kibankapp .mb16 {margin-bottom:16px !important;}
.kibankapp .mb32 {margin-bottom:32px !important;}
.kibankapp .mb0 {margin-bottom: 0px !important;}
.kibankapp .mb-32{margin-bottom:-32px !important;}
.kibankapp .ml0 {margin-left:0 !important;}
.kibankapp .ml8 {margin-left:8px !important;}
.kibankapp .ml16 {margin-left:16px !important;}
/* 20231006 FLEX */
.kibankapp .flex_center{display: flex; justify-content: center !important;}
.kibankapp .flex_end{display: flex; justify-content: flex-end !important;}
.kibankapp .flex_start{display: flex; justify-content: flex-start !important;}
.kibankapp .flex_space{display: flex; justify-content: space-between !important;}
.vertical_center{align-items: center;}
/* 20231006 bg-color */
.kibankapp .btn_bg_primary1{background-color: rgb(169, 15, 57) !important;}

/*20221108 개인정보수집동의 POPUP*/
.popup_m {
	display: none;
}
.popup_m .mask {
	background: rgb(0, 0, 0); left: 0px; top: 0px; right: 0px; bottom: 0px; position: fixed; z-index: 100; opacity: 0.7;
}
.popup_m .popup_content {
	background: rgb(255, 255, 255); left: 3%; top: 50%; width: 94%; margin-top: -40vw; position: fixed; z-index: 101;
}
.modal01 .modal_tit {
	background: rgb(13, 158, 187); height: 12.2vw; text-align: center; color: rgb(255, 255, 255); line-height: 12.2vw; font-size: 4vw; font-weight: bold;
}
.modal01 .modal_cont {
	padding: 3vw;
}
.modal01 .modal_cont .scroll2 {
	padding: 2vw; border: 1px solid rgb(209, 209, 209); border-image: none; height: 40vw; margin-bottom: 2vw; overflow-y: auto;
}
.modal01 .modal_cont * {
	font-size: 3.6vw;
}
.modal01 .modal_cont h1 {
	font-size: 4vw;
}
.modal01 .modal_cont .txt01 {
	background: rgb(242, 245, 248); padding: 4vw 5vw; color: rgb(0, 0, 0); line-height: 5.6vw; font-size: 3.6vw; font-weight: bold;
}
.modal01 .modal_cont .txt02 {
	padding: 2vw 5vw 0px; color: rgb(0, 0, 0); line-height: 4.2vw; font-size: 2.6vw;
}
.modal01 .modal_cont .txt02.pl0 {
	padding: 0px;
}
.modal01 .modal_cont .txt03 {
	text-indent: -3vw; padding-left: 3vw;
}
.modal01 .modal_cont .mt20 {
	margin-top: 4vw;
}
.modal01 .modal_cont .mt10 {
	margin-top: 2vw;
}
.modal01 .modal_bottom {
	background: url("/assets/lad/images/MOW/logo.png") no-repeat 2vw 3.4vw / 40vw auto; padding: 2.4vw 2.6vw 4vw; height: 13vw; border-top-color: rgb(63, 109, 146); border-top-width: 1px; border-top-style: solid; min-height: 4vw;
}
.modal01 .modal_bottom.nobtn {
	background: url("/assets/lad/images/MOW/logo.png") no-repeat 2vw 2.6vw;
}
.modal01 .modal_bottom .right {
	float: right;
}
.modal01 .modal_bottom .btn_data01 {
	background: rgb(62, 80, 103); width: 30.6vw; height: 7.8vw; text-align: center; color: rgb(255, 255, 255); line-height: 8vw; font-size: 4vw; display: inline-block;
}
.modal01 .modal_bottom .btn_data02 {
	background: rgb(241, 241, 241); border: 1px solid rgb(62, 80, 103); border-image: none; width: 30.2vw; height: 7.4vw; text-align: center; color: rgb(0, 0, 0); line-height: 6.6vw; font-size: 4vw; display: inline-block;
}
.modal01 .btn_close {
	background: url("/assets/lad/images/MOW/btn_modal01_close.png") no-repeat left top / 100% auto; top: -5vw; width: 3.6vw; height: 3.6vw; right: 0px; text-indent: -1000px; display: block; position: absolute;
}
.modal01 .bnt_ok {
	background: rgb(62, 80, 103); padding: 1.4vw 0px 0px; width: 30.6vw; height: 6.4vw; text-align: center; color: rgb(255, 255, 255); line-height: 1em; font-size: 4vw; display: inline-block;
}

/* 20230117 추가 금융학습센터 */
.edu_box{position: relative; width: 100%; display: flex; border: 1px solid rgb(221, 221, 221); border-radius: 10px; background-color: rgb(255, 255, 255); padding: 24px; margin-top: 16px;}
.edu_box .left_icon{flex-shrink: 0; width: 79px; position: absolute; top: 40%; transform: translateY(-50%);}
.edu_box .left_icon img{width: 56px;}
.edu_box .left_icon div{position: absolute; left: -12px; font-size: 9px;}
.edu_box .right_box{margin-left: 80px;}
.edu_box .right_box .btn_youtube{width: 120px; background: #a91039; color: #fff; border-radius: 6px; padding: 4px 8px; font-size: 13px; margin-top: 8px;}								

/* 20230524 여신결재 회의록 추가 */
.app_process_box{padding: 13px;}
.app_process_box > div{display: flex; justify-content: center; align-items: center;}
.app_process_box span{display: inline-block;}
.app_process_box span.box{margin: 8px 2px; line-height: 24px; font-weight: 700; border-radius: 10px; padding: 6px 16px; background: #dcdcdc;}
.app_process_box span.w50{width: 50px;}
.app_process_box span.w40{width: 40px;}
.app_process_box span.w25{width: 25px;}
.app_process_box_wrap .toggle_btn{display: flex; align-items: center; width: 100%; height: 56px; padding: 16px 0; text-align: left; font-size: 16px; color: rgb(34, 34, 34); background: url(/assets/m/images/common/ic_arrow_hide.jpg) no-repeat right; background-size: 16px 16px;}
.app_process_box_wrap .toggle_btn.hide{background: url(/assets/m/images/common/ic_arrow_show.jpg) no-repeat right; background-size: 16px 16px;}
.app_process_box_wrap .box_scroll{font-size: 14px; width: 100%; height: 136px; padding: 12px 16px; border-radius: 10px; border: 1px solid #bbb; background: #f6f6f6; overflow-y: auto;}
.app_process_box_wrap .sign_name{display: flex; align-items: center; justify-content: space-around; padding: 22px; border-bottom: 1px solid rgb(221, 221, 221); border-top: 1px solid rgb(221, 221, 221); background: #f6f6f6;}
.border_bt{padding: 16px 0; border-bottom: 1px solid rgb(85, 85, 85);}
.app_process_box_wrap .check_list_box{padding: 24px; border-radius: 10px; border: 1px solid #bbb; background: #f6f6f6; transition: all .4s ease;}
.app_process_box_wrap .check_list_box > div{margin-top: 22px;}
.app_process_box_wrap .check_list_box > div:first-child{margin-top: 0;}
.app_process_box_wrap .collapse-icon.rotate{transform: rotate(-180deg);}
.app_process_box_wrap .check_list_box.hide{display: none;}
.app_process_box_wrap .field-group .field-radio-wq{justify-content: space-around; flex-wrap: wrap;}
.app_process_box_wrap .field-radio-wq div{margin-right: 0; min-width: 50%;}
.app_process_box_wrap .field-radio-wq div:nth-child(3),
.app_process_box_wrap .field-radio-wq div:nth-child(4){margin-top: 14px;}
.list-item.select_box{align-items: center;}
.list-item.select_box .field-group{min-height: 32px;}
.list-item.select_box .field-group button{padding: 0 0 0 13px; font-size: 13px; background-position: calc(100% - 8px) 50%;}
.list-item.select_box .field-group  span{margin-right: 22px; padding-right: 8px;}

.list_mark01{display: flex;}
.list_mark01::before{content: '※'; display: block; padding-right: 4px;}

/* 20230608 영상관 */
.youtube_wrap li{border: 1px solid #dedede; border-radius: 28px; background: #fff; box-shadow: 0 8px 10px rgba(0,0,0,0.1); padding: 18px; margin-bottom: 24px;}
.youtube_wrap .youtube_title{font-weight: 700; padding-left: 30px; background: url('/assets/m/images/prd/youtube_logo.png') no-repeat left 50%; background-size: 24px; line-height: 30px;}
.youtube_thumb{position: relative; display: inline-block; text-align: center;}
.youtube_thumb a{margin: auto;}
.youtube_thumb img.youtube_play{position: absolute; z-index: 9; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 44px !important; box-shadow: 0 5px 10px rgba(0,0,0,0.1); border-radius: 50%;}
.youtube_thumb img.youtube_thumbnail{border-radius: 18px; width: 100%;}

/* 20230728 FAQ MENU */
.faq_menu{display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 8px; padding-top: 20px;}
.faq_menu li input[type=button]{border: 1px solid #dcdcdc; border-radius: 20px; background-color: #fff; color: #959595; padding: 6px 14px;}
.faq_menu li.on input[type=button]{border: 1px solid transparent; background-color: #000; color: #fff;}

/* 20230804 만기 자동재예치 */
.guide-title.ic01{padding-left: 20px; background-image: url(/assets/m/images/common/ico_01.png); background-size: 16px 16px; background-repeat: no-repeat; background-position: left center;}
.bottom_popup_list li{display: flex; padding-bottom: 14px;}
.bottom_popup_list li > span:first-child{font-weight: 700;}
.list.ty05 li.obank .name{position: relative; display: block; padding-left: 40px;}
.list.ty05 li.obank .name::after{content:''; display: block; position: absolute; left: 4px; top: 4px; width: 32px; height: 33px; background-image: url(/assets/m/images/@sample_logo.png); background-position: left center; background-repeat: no-repeat;}
.acc_list_box_wrap{border-radius: 15px; box-shadow: 0 2px 15px 3px rgba(0, 0, 0, 0.1);}
.acc_list_box{border-radius: 15px; padding: 26px; background-color: rgb(255, 255, 255);}
.acc_list_box.on{box-shadow: 0 0 0 2px #A90F39;}
.acc_list_box .field-radio-wq.type label{background-color: #f5f5f5; box-shadow: none;}
.acc_list_box .field-radio-wq.type input:checked ~ label{box-shadow: none; background: #771039; color: #fff;}
/* Tab Menu */
.stick_tabs{display: flex; align-items: center; justify-content: space-around; padding: 0 0 6px;}
.stick_tabs a{display:block; position: relative; width: 100%; text-align: center; font-size:1rem; line-height: 48px; color: #888;}
.stick_tabs a.on{color: #31333e; font-weight: 600;}
.stick_tabs a.on::before{content: ""; display:block; width: 100%; height: 6px; background: #003150; position: absolute; left: 0; bottom: -6px;}
.list.scroll_y{overflow-y:auto; max-height: 384px;}
/* Bank Bottom Popup */
.list.scroll_y {overflow-y: auto; max-height: 384px;}
.list.flex_row02 ul {display: flex; flex-wrap: wrap; flex-direction: row;}
.list.flex_row02 ul li {width: 50%;}
.list.flex_row02 ul.obank li a {display: block; color: #222; padding: 56px 0 16px 0; font-size: 0.875rem; line-height: initial; text-align: center;}
.list .obank li a {position: relative;}
.list.flex_row02 ul.obank li a:after {content: ''; position: absolute; left: 50%; top: 16px; transform: translateX(-50%); display: block; width: 32px; height: 33px;}

/* 20230922 임직원 톡 */
.field-radio-wq.col_2 div{width: 33.3%; margin-right: 0; height: 24px;}
.field-radio-wq.col_3 div{width: 25%; margin-right: 0; height: 24px;}
.field-checkbox-wq.type.po input:checked ~ label::before {background-position: -41px -20px;}
.field-checkbox-wq.type.po label::before {background-position: -41px 0;}
.tab-buttons.flew_w{flex-wrap: wrap;}
.tab.type .tab-buttons.col-2 .tab-button {flex-grow: 0; flex-basis: calc(100% / 2 - 4px);}
.terms-height .terms{max-height: 270px; overflow-y: auto; border-bottom: none; border-radius: 5px 5px 0 0; transition: all .4s ease;}
/* list viewHide */
.tab_wrap.on .terms-height .terms{overflow: hidden; max-height: 0; transition: all .3s ease; border: none;}
.tab_wrap.on .terms-height .terms-close{border-top: 1px solid rgb(204, 204, 204); border-radius: 5px;}
.tab_wrap.on .terms-height .terms-close > img{transform: rotate(180deg); -webkit-transform: rotate(180deg); transition: all .3s ease;}
.tab_wrap .btn-search-bottom{width: 100%;}
.tab_wrap.on .btn-search-bottom{display: none;}
/* list viewHide */
.terms-height .terms-close{text-align: center; border: 1px solid rgb(204, 204, 204); border-top: none; border-radius: 0 0 5px 5px; padding-bottom: 5px;}
.terms-height .terms-close > span{display: inline-block; font-size: 13px; padding-right: 4px;}
.terms-height .field-checkbox-wq div{width: 100%;}
.chk_bg{display: inline-block; margin: -3px 3px; background: url(/assets/m/images/common/icns_checkbox.svg) no-repeat; background-position: 1px -16px; width: 16px; height: 16px; background-size: 61px;}	
.gridview_wrap{width: 100%; overflow-x: auto; overflow-y: hidden;}
.gridview-custom nobr{padding:0;word-wrap: break-word;white-space: normal;}/* gridview text 자동개행 */
.gridview-custom td.gridBodyDefault input[type="checkbox"]{vertical-align:-2px; width:16px; height:16px;}
.grid-ty3 {box-sizing:content-box; margin-top: 10px; text-align: left; border-top: 1px solid #fff;}
.grid-ty3[style*=height] {padding-bottom:10px; margin-bottom:-10px;} /*grid 높이값 설정이 불안정하여 여유 padding 추가 컨텐츠 없을경우제외(height값이 있음을 체크함)*/
.grid-ty3 .gridBodyDefault_rowNumber{background: transparent !important;}
.grid-ty3.tac {text-align: center !important;}
.grid-ty3.tac th, .grid-ty3.tac td {padding-left: 0; padding-right: 0;}
.grid-ty3 table {border:none;}
.grid-ty3 * {box-sizing: content-box;}
.grid-ty3 thead {border:none !important}
.grid-ty3 tr {background-color: #fff !important;}
.grid-ty3 th, .grid-ty3 td {position: relative; font-size: 0.825rem !important; padding:0 10px 0 26px; border-bottom: 1px solid #ddd !important; border-width:0 0 1px 0 !important;}
.grid-ty3 th {height:48px !important; background: #f6f6f6 !important;}
.grid-ty3 a {text-decoration: underline;}
.grid-ty3 .w2input {font-size: inherit !important; text-align: center;}
.grid-ty3 .chkbox input {overflow: hidden; position: absolute; top: 0; left: 0; z-index: -1; width: 0; height: 0; opacity: 0;}
.grid-ty3 .chkbox label{font-size: 0;}
.grid-ty3 .chkbox label::before {position: absolute; top: 31%; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); content: ''; display: block; width: 20px; height: 20px; background: url(/assets/m/images/common/icns_checkbox.svg); background-repeat: no-repeat; background-position: 0 0;}
.grid-ty3 .chkbox input:checked ~ label::before {background-position: 0 -20px;}
.nonedata {padding: 50px 0 50px; text-align: center;}
.nonedata-image {display: inline-block; width: 80px; height: 80px; background: url('/assets/m/images/cln/icn_empty.svg') no-repeat; background-size: 100%;}
.nonedata-text {margin-top: 24px; text-align: inherit; font-size: 16px; color: rgb(85, 85, 85);}
.round.color.arrow{background: #f6f6f6 url(/assets/m/images/common/icn_rang.svg) no-repeat 95% 50%; padding: 24px 36px 24px 20px;}
.round.color.arrow .basis_left > strong{font-size: inherit; color: rgb(136, 136, 136); flex-basis: 60px; flex-shrink: 0;}
.round.color.arrow.w83 .basis_left > strong{flex-basis: 83px; flex-shrink: 0;}
.round.color.arrow .basis_left > span{font-size: inherit; color: rgb(85, 85, 85);}
.div_disabled{background: rgb(238, 238, 238)!important;}
.div_disabled span{padding: 10px 0 10px 15px; width: 100%;}
.div_disabled div{height: 100%; overflow-y: auto; overflow-x: hidden;}
@media (max-width: 359px) {
	.field-radio-wq.col_2 div{width: 50%;}
	.field-radio-wq.col_3 div{width: 33.3%;}
}

/* 20240108 check icon */
.icon_checked{background: url(/assets/p/images/common/icn_checked.gif) no-repeat 0 top; background-size: 18px; padding-left: 22px;}

/* 20240523 금융계산기 단리/복리 이미지 */
.cal_ic_wrap{text-align: center; padding: 16px 0; border: 1px solid #d9d9d9; border-radius: 5px; margin-top: 20px;}
.cal_ic_wrap .cal_title{color: #555; font-size: 14px;}
.cal_ic_wrap .cal_ic_box{display: flex; justify-content: space-evenly; align-items: center; margin: 20px auto 0; max-width: 300px;}
.cal_ic_wrap .cal_ic_box div{position: relative; height: 80px;}
.cal_ic_wrap .cal_ic_box div:first-child{background: url(/assets/m/images/prd/poket_gold.png) no-repeat; background-size: 49px; width: 50px;}
.cal_ic_wrap .cal_ic_box div:last-child{background: url(/assets/m/images/prd/coin_gold.png) no-repeat center 16px; background-size: 51px; width: 51px;}
.cal_ic_wrap .cal_ic_box div:first-child.cal_pc{background: url(/assets/m/images/prd/pocket_coin_gold.png) no-repeat center 0; background-size: 71px; width: 77px;}
.cal_ic_wrap .cal_ic_box div p{position: absolute; bottom: 0; left: 50%; transform: translate(-50%); font-size: 12px; color: #222;}
.cal_ic_wrap .cal_ic_box div:first-child.cal_pc p{width: 100%;}

/* 20240603 KCB 본인인증 */
.kcb_wrap .field-input input,
.kcb_wrap button.field-select{padding: 0;}
.kcb_wrap button.field-select{outline: none;}
.kcb_wrap .field-group{box-shadow: 0 2px 0 -1px #bbb; border-radius: 0;}
.kcb_wrap .field-group:focus-within{box-shadow: 0 3px 0 -1px #c78c50;}
.kcb_wrap .field.invalid .field-group:not(.none-outline){box-shadow: 0 3px 0 -1px #a90f39;}
.kcb_wrap .field-label{margin-bottom: 0; font-weight: bold;}
.kcb_wrap .circle {position: relative; display: inline-block; width: 12px; height: 12px; border-radius: 50%; background-color: #bbb!important;}
.kcb_wrap .auth_box div{display: flex; gap: 8px; justify-content: space-between;}
.kcb_wrap .auth_box .auth_id_1{width: 49%;}
.kcb_wrap .auth_box .auth_id_2 {display: flex; justify-content: space-between; gap: 4px; max-width: 30px;}
.kcb_wrap .auth_box .auth_id_2 div{width: 100%; display: flex; justify-content: space-around; align-items: center;}
.kcb_wrap .auth_box .auth_id_2 input[type=text]{padding: 0; width: 20px; text-align: center;}
.kcb_wrap .auth_box .auth_id_2 input[type=text]::placeholder{color: #ddd; text-align: center;}
.kcb_wrap .circle_box{display: flex; align-items: center; gap: 4px;}

/*************** 비대면 프로세스 *****************/
.pos_wrap .pos_primary{background-color: #9a6d4a;}/* button color */
.pos_wrap .pos_primary.disabled,
.pos_wrap .pos_primary:disabled{background-color: rgb(204, 204, 204);}
.pos_wrap .pos_box_border{border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 14px 0;}
.pos_wrap .txt_underline strong{background: repeating-linear-gradient(0deg, rgb(251, 229, 204) 2px, rgb(251, 229, 204) 10px, transparent 10px, transparent); color: rgb(169, 15, 57);}
.pos_wrap .field-label{margin-bottom: 0; font-weight: bold;}
.pos_wrap .field-message + .field-message, .pos_wrap .field-message + .field-info{margin-top: 8px;}
/* 20240730 BUTTON-LOADING */
.pos_wrap .button.pos_primary{position: relative; overflow: hidden;}
.pos_wrap .button.pos_primary:before{position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(117, 67, 27, .4); box-shadow:0 0 40px 40px rgba(117, 67, 27, .4); opacity:0; content:""; transform:scaleX(0); transition:transform 0s linear .3s, opacity .3s;}
.pos_wrap .button.pos_primary:active:before{opacity:1; transform:scaleX(1); transition:transform .3s ease;}
/* loading */
.btn-ui-loading{z-index: 9; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: transparent !important;}
.btn_loading div{width: 100%; background: transparent; display: flex; justify-content: center; align-items: center;}
.btn_loading div span{display: inline-block; width: 10px; height: 10px; border-radius: 50%; animation: btnloading 1s linear infinite; background-color: rgb(255,255,255); box-shadow: 0px 1px 5px rgb(84 41 7 / 90%);}
.btn_loading div span:nth-child(1){animation-delay: 0s;}
.btn_loading div span:nth-child(2){animation-delay: 0.2s; margin: 0px 10px;}
.btn_loading div span:nth-child(3){animation-delay: 0.4s;}
@keyframes btnloading {
	0%, 100% {transform: scale(0.5); opacity: 0;}
	50% {transform: scale(1.2); opacity: 1;}
}
@-webkit-keyframes btnloading {
	0%, 100% {-webkit-transform: scale(0.5); opacity: 0;}
	50% {-webkit-transform: scale(1.2); opacity: 1;}
}
/* title background-icon */
.pos_wrap .title.h1{line-height: 30px;}
.pos_wrap .pos_title_h1_img1{background: url(/assets/m/images/hlp/icn_23.svg); background-repeat: no-repeat; background-position: left 20px; padding-top: 90px;}
.pos_wrap .pos_title_h1_img2{background: url(/assets/m/images/hlp/icn_21.svg); background-repeat: no-repeat; background-position: left 20px; padding-top: 90px;}
.pos_wrap .pos_title_h1_img3{background: url(/assets/m/images/common/icn_invalid.svg); background-repeat: no-repeat; background-position: left 20px; padding-top: 90px; background-size: 70px;}
.pos_wrap .pos_title_h1_img4{background: url(/assets/m/images/common/icn_valid.svg); background-repeat: no-repeat; background-position: left 20px; padding-top: 90px; background-size: 70px;}
.pos_wrap .pos_title_h1_img5{background: url(/assets/m/images/common/icn_done.svg); background-repeat: no-repeat; background-position: left 20px; padding-top: 90px; background-size: 70px;}
.pos_wrap .pos_title_h1_toss50{background: url(/assets/m/images/pos/ci_toss.png); background-repeat: no-repeat; background-position: left 50px; padding-left: 63px; background-size: 50px;}/* 20241008 수정 */
.pos_wrap .pos_title_h1_naver50{background: url(/assets/m/images/pos/ci_naver.svg); background-repeat: no-repeat; background-position: left 50px; padding-left: 63px; background-size: 50px;}/* 20241008 수정 */
.pos_wrap .pos_title_h1_pass50{background: url(/assets/m/images/pos/ci_pass.svg); background-repeat: no-repeat; background-position: left 50px; padding-left: 63px; background-size: 50px;}/* 20241008 수정 */
.pos_wrap .pos_title_h1_toss{background: url(/assets/m/images/pos/ci_toss.png); background-repeat: no-repeat; background-position: left 75px; padding-left: 63px; background-size: 50px;}/* 20241008 수정 */
.pos_wrap .pos_title_h1_naver{background: url(/assets/m/images/pos/ci_naver.svg); background-repeat: no-repeat; background-position: left 75px; padding-left: 63px; background-size: 50px;}/* 20241008 수정 */
.pos_wrap .pos_title_h1_pass{background: url(/assets/m/images/pos/ci_pass.svg); background-repeat: no-repeat; background-position: left 75px; padding-left: 63px; background-size: 50px;}/* 20241008 수정 */
.pos_wrap .pos_phone{background: url(/assets/m/images/common/icn_04.svg); background-repeat: no-repeat; background-position: left center; background-size: 48px; padding-left: 55px;}
/* 버튼 */
.pos_fixed{position: fixed; bottom: 0; left: 0; width: 100%; text-align: center; z-index: 9;}/* 20241008 padding 삭제 /padding: 0 20px/ */
.pos_fixed .button{width: 100%; border-radius: 0;}/* 20241008 border-radius: 10px 삭제 */
.pos_fixed .button.disabled, .pos_fixed .button:disabled {background-color: rgb(204, 204, 204); pointer-events: none;}
.pos_fixed div,
.pos_fixed a{color: #8f8f8f; font-size: 14px; padding: 16px; width: 100%; background: #fff;}
.pos_fixed a{display: inline-block; width: 100%; text-decoration: underline;}
.pos_fixed .btn_txt{text-align: center; width: 100%; padding: 14px; background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,1), rgba(255,255,255,1), #fff);}
.pos_pop_btn{width: 100%; padding: 20px; text-align: center;}
.pos_pop_btn button{width: 100%; text-align: center;}
.pos_pop_btn button.field-button{background-color: #9a6d4a; margin: 0;}
.pos_pop_btn button.btn_text{color: #8f8f8f; padding: 20px 0;}
.pos_btn_s{background: #e9e9e9; font-size: 12px; border-radius: 10px; padding: 10px;}
.pos_wrap .button.small.arrow{display: block; margin-top: 6px; color: rgb(84, 84, 84); height: auto; padding: 6px 18px 6px 10px; min-height: auto; font-weight: normal; font-size: 12px; background: #fff url(/assets/m/images/common/icn_rang.svg) no-repeat 95% center; background-size: 12px; border-radius: 20px; border: 1px solid rgb(204, 204, 204);}
.pos_wrap .text.arrow{background: url(/assets/m/images/common/icn_rang.svg) no-repeat right center; padding-right: 16px; background-size: 12px;}
.pos_wrap .text.arrow.ico_blue{background: url(/assets/m/images/pos/arrow_blue.svg) no-repeat right center; background-size: 18px; padding-right: 22px;}
.pos_wrap button.field-select{background-position: right;}
.pos_wrap .button-fixed .field-checkbox-wq{position: fixed; background: #fff; bottom: 64px; left: 16px;}/* fixed btn 체크박스 */
.pos_wrap .chk_bottom_wrap{position: fixed; bottom: 0; width: 100%;}
.pos_wrap .chk_bottom_wrap .field-checkbox-wq{background: #fff; margin-left: 24px;}
.pos_wrap .chk_bottom_wrap .h101{height: 101px;}
.pos_pop_btn_round{height: 48px; border-radius: 10px; width: 100%; margin:0 24px 24px;}
/* 여백 */
.pos_wrap .bottom{padding-bottom: 150px;}
.pos_wrap .bottom.plus{padding-bottom: 200px;}
.pos_wrap .bottom.short{padding-bottom: 60px;}
/* text */
.pos_wrap .text.negative{color: rgb(169, 15, 57);}
/* input style */
.pos_wrap .field-input input,
.pos_wrap button.field-select{padding: 0;}
.pos_wrap .field-group{border-radius: 0; box-shadow: 0 2px 0 -1px #bbb;}
.pos_wrap .field-group:focus-within{box-shadow: 0 3px 0 -1px #5088c7;}
.pos_wrap .field.invalid .field-group:not(.none-outline){box-shadow: 0 3px 0 -1px #a90f39;}
.pos_wrap .field-group .field-text{padding: 0 1px;}
/* 주민등록번호 */
.pos_id_box div{display: flex; gap: 8px; justify-content: space-between; align-items: center;}/* 20240816 세로정렬 추가 */
.pos_id_box .id_box_1{width: 49%;}
.pos_id_box .id_box_2{display: flex; justify-content: space-between; gap: 4px; max-width: 30px;}
.pos_id_box .id_box_2 div{width: 100%; display: flex; justify-content: space-around; align-items: center;}
.pos_id_box .id_box_2 input[type=text]{padding: 0; width: 20px; text-align: center;}
.pos_id_box .id_box_2 input[type=text]::placeholder{color: #222; text-align: center;}
.pos_id_box .circle_box{display: flex; align-items: center; gap: 4px;}
.pos_id_box .circle_box .circle{position: relative; display: inline-block; width: 12px; height: 12px; border-radius: 50%; background-color: #888;}
/* 동의서 */
.pos_wrap .pos_terms_flex{padding: 12px 20px; border: 1px solid #ddd; border-radius: 10px; margin-top: 20px;}
/* 인증 */
.pos_wrap .flow_num{counter-reset: stepcount;}
.pos_wrap .flow_num > div{margin-top: 26px;}
.pos_wrap .flow_num > div::before{content: counter(stepcount); counter-increment: stepcount; display: block; width: 30px; height: 30px; line-height: 29px; text-align: center; background: #eee; border-radius: 50%; margin-bottom: 8px;}
/* 적합성 적정성 */
.pos_wrap .cus_chk_wrap button{width: 100%; background-image: url(/assets/m/images/common/icn_rang.svg); background-repeat: no-repeat; background-position: right center; background-size: 16px 16px; padding: 14px 0;}
.pos_wrap .cus_chk_bottom{margin-top: 24px;}
.pos_wrap .cus_chk_bottom p{padding-left: 28px; padding-top: 14px;}
.toast_box{opacity: 0; position: fixed; pointer-events: none; transition: all .4s ease; bottom: 250px; left: 50%; transform: translateX(-50%); border-radius: 26px; padding: 10px; background: rgba(112,112,112,0.8); color: #fff; font-size: 14px; background-size: 22px;}
.toast_box.active{opacity: 100%;}
/* 외부 인증서 */
.pos_wrap .auth_list button{border: 1px solid #d3d3d3; border-radius: 10px; padding: 16px 12px; width: 100%; margin-top: 20px; font-size: 16px;}
.pos_wrap .auth_list button{background-repeat: no-repeat; background-size: 26px; background-position: 20px center; padding-left: 56px;}

.pos_wrap .auth_list button:nth-child(1){background-image: url(/assets/m/images/pos/ci_toss.png)}
.pos_wrap .auth_list button:nth-child(2){background-image: url(/assets/m/images/pos/ci_naver.svg)}
.pos_wrap .auth_list button:nth-child(3){background-image: url(/assets/m/images/pos/ci_pass.svg)}
.pos_wrap .auth_list button:nth-child(4){background-image: url(/assets/m/images/pos/ci_kakao.png)}
.pos_wrap .auth_list button.tossImg{background-image: url(/assets/m/images/pos/ci_toss.png)}
.pos_wrap .auth_list button.naverImg{background-image: url(/assets/m/images/pos/ci_naver.svg)}
.pos_wrap .auth_list button.passImg{background-image: url(/assets/m/images/pos/ci_pass.svg)}
.pos_wrap .auth_list button.kakaoImg{background-image: url(/assets/m/images/pos/ci_kakao.png)}
.pos_wrap .auth_list button.ci_cer{background-image: url(/assets/m/images/pos/ci_cer.svg)}
.pos_wrap .step_box{background: #fdf0df; color: rgb(169, 15, 57); font-size: 12px; border-radius: 20px; padding: 2px 6px; margin: 16px 0;}
.auth_list2{display: flex; gap: 4px;} 
.pos_wrap .auth_list2 button{background-size: 18px; background-position: 7px center; text-align: center; padding: 8px 0 8px 21px; margin-top: 16px; font-size: 12px;}
.pos_wrap .auth_list2 button{border: 1px solid #d3d3d3; border-radius: 10px; width: 100%; margin-top: 16px; font-size: 12px;}
.pos_wrap .auth_list2 button{background-repeat: no-repeat;}
.pos_wrap .auth_list2 button:nth-child(1){background-image: url(/assets/m/images/pos/ci_pass.svg)}
.pos_wrap .auth_list2 button:nth-child(2){background-image: url(/assets/m/images/pos/ci_kakao.png)}
/* 대출 조건 확인 */
.pos_wrap .loan_chk_box{display: flex; justify-content: space-between; align-items: center;}
.pos_wrap .loan_chk_box > div > div{font-size: 22px; font-weight: bold;}
.pos_wrap .loan_chk_box p{font-size: 12px; color: #aaa;}
.pos_wrap .loan_chk_box .btn_non_icon{color: #888; border: 1px solid #888; padding: 4px 8px; border-radius: 5px; font-size: 12px;}
/* input del button style */
.pos_wrap .btn_del_type{align-items: center;}
.pos_wrap .btn_del_type.input_focus{position: relative;}
.pos_wrap .btn_del_type.input_focus .field-input + .btn_del{position: absolute; right: 0; width:24px; height:24px; background:url(/assets/m/images/pos/btn_del.png) no-repeat 0 0; background-size:24px 24px;}
.pos_wrap .btn_del_type.input_focus .field-text{margin-right: 30px;}
/* 이자 계산기 */
.pos_cal_wrap .cal_loan{color: #5088c7; font-weight: bold; font-size: 26px;}
.pos_cal_wrap ul{border-top: 1px solid #888; border-bottom: 1px solid #bbb; padding: 20px 0; margin-top: 8px;}
.pos_cal_wrap ul li{display: flex; justify-content: space-between; padding-bottom: 20px;}
.pos_cal_wrap ul li:last-child{padding-bottom: 0;}
.pos_cal_wrap ul li p{color: #5088c7;}
.pos_cal_wrap ul li div div.title{font-weight: bold;}
.pos_cal_wrap ul li div div span{font-size: 14px; color: #555;}
/* 주소*/
.pos_wrap .add_wrap{margin-top: 14px;}
.pos_wrap .add_wrap li{padding: 6px 0 12px; border-bottom: 1px solid #c8c8c8; font-size: 14px;}
.pos_wrap .add_wrap li div{font-size: 12px; padding-top: 8px;}
.pos_wrap .add_wrap li span{margin-right: 4px;}
.pos_wrap .add_wrap li span.new_add,
.pos_wrap .add_wrap li span.old_add{padding: 2px 4px; border-radius: 4px;}
.pos_wrap .add_wrap li span.new_add{background: #a1f1b9; color: #0d8732;}
.pos_wrap .add_wrap li span.old_add{background: #e2e2e2; color: #888;}
/* 1원 인증 */
.pos_acc_bank_wrap{position: relative;}
.pos_acc_bank{padding-left: 40px; font-size: 14px; margin: 10px 0 20px; line-height: 18px;}
.pos_acc_bank::after{content: ''; position: absolute; display: block; width: 32px; height: 33px; top: 2px; left: 0;}
/* 고객 확인 사항 */
.pos_list_wrap .list-dt{font-size: 16px; line-height: 20px; background-repeat: no-repeat; padding-top: 60px;}
.pos_list_wrap .list-dt.img_ty01{background-image: url('/assets/m/images/hlp/icn_30.svg');}
.pos_list_wrap .list-dt.img_ty02{background-image: url('/assets/m/images/hlp/icn_35.svg'); padding-top: 40px;}
.pos_list_wrap .list-dt.img_ty03{background-image: url('/assets/m/images/hlp/icn_32.svg');}
.pos_list_wrap .list-dt.img_ty04{background-image: url('/assets/m/images/hlp/icn_31.svg'); padding-top: 40px;}
.pos_list_wrap .list-dd{padding-top: 10px;}
/* 직업선택 */
.job_depth_wrap ul li button{width: 100%; outline: none; padding: 16px; border-radius: 12px; margin-top: 10px; display: flex; justify-content: space-between; align-items: center;}
.job_depth_wrap ul li button span.arrow{display: inline-block; width: 13px; height: 10px; background-image: url(/assets/m/images/common/icn_dang.svg); background-repeat: no-repeat; background-position: center; transition: transform .4s ease;}
.job_depth_wrap ul.job_depth1 > li button{background-color: #f5f5f5;}
.job_depth_wrap ul.job_depth2 > li button{border: 1px solid #ddd; background-color: #fff;}
.job_depth_wrap ul.job_depth3 > li button{border: none; padding: 16px 24px; background-image: none;}
.job_depth_wrap ul.job_depth2, 
.job_depth_wrap ul.job_depth3{display:none; overflow: hidden;}
.job_depth_wrap ul.job_depth1 li.open ul.job_depth2, ul.job_depth2 li.open ul.job_depth3{display: block;}
.job_depth_wrap ul.job_depth1 > li span.open, 
.job_depth_wrap ul.job_depth2 > li span.open{transform: rotate(-180deg); transition: transform .4s ease;}
.job_depth_wrap ul.job_depth2 > li button.open{border: 1px solid #c48545;}
.job_depth_wrap ul.job_depth3 > li button.open{border: none; background: rgb(251, 229, 204);}
/* ALERT 전체화면 */
.alert_full_page{position: relative;}
.alert_full_page > div{position: absolute; left: 50%; transform: translateX(-50%); text-align: center; top: 50%;}
/* 약관동의 아이콘 */
.pos_wrap .btn_pop_icon{width: 22px; height: 22px; background-image: url(/assets/m/images/common/icn_search.svg); background-repeat: no-repeat; background-position: 0 0; background-size: 22px 22px; outline: none;}
/* 체크박스 native type S */
.chk_native_type{display: flex; align-items: center;}
.chk_native_type input{outline: none; border: none; vertical-align: middle; -webkit-appearance: none; -webkit-border-radius: 0;}
.chk_native_type label{display: flex; cursor: pointer; align-items: flex-start; color: rgb(85,85,85); font-size: 14px;}
.chk_native_type [type="checkbox"]{display: block; margin-right: 8px; width: 20px; height: 20px; background: url(/assets/m/images/common/icns_checkbox.svg); background-repeat: no-repeat; background-position: -40px 0;}
.chk_native_type [type="checkbox"]:checked {background-position: -40px -20px;}
/* 체크박스 native type L */
.chk_native_type_l label{display: flex; align-items: center; font-size: 16px; cursor: pointer; color: rgb(34, 34, 34); font-weight: bold;}
.chk_native_type_l input{overflow: hidden; position: absolute; top: 0; left: 0; z-index: -1; width: 0; height: 0; opacity: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; pointer-events: none;}
.chk_native_type_l label::before{content: ''; flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-right: 8px; width: 20px; height: 20px; background: url(/assets/m/images/common/icns_checkbox.svg); background-repeat: no-repeat; background-position: 0 0;}
.chk_native_type_l input:checked ~ label::before {background-position: 0 -20px;}
/* INSIDE - CHECKBOX */
.field-checkbox-inside{display: flex; flex-wrap: wrap; margin-top: -10px; margin-bottom: 16px; height: auto;}
.field-checkbox-inside div {display: inline-flex; align-items: center; position: relative; margin-right: 32px; height: 48px;}
.field-checkbox-inside div:last-child {margin-right: 0!important;}
.field-checkbox-inside label {display: flex; align-items: center; font-size: 16px; cursor: pointer;}
.field-checkbox-inside label::before {content: ''; flex-grow: 0; flex-shrink: 0; flex-basis: auto; margin-right: 8px; width: 20px; height: 20px; background: url("/assets/m/images/common/icns_checkbox.svg"); background-repeat: no-repeat; background-position: 0 0;}
.field-checkbox-inside input:checked ~ label::before {background-position: 0 -20px;}
.field-checkbox-inside input:disabled ~ .label::before {background-position: -20px 0;}
.field-checkbox-inside input:checked:disabled ~ label::before {background-position: -20px -20px;}
.field-checkbox-inside.color3 label{color: rgb(136, 136, 136);}
/* loading */
.pos-ui-loading{z-index: 99; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.pos-ui-loading .md {display: flex;}
.pos-ui-loading .loading-item{width: 60px; height: 60px; border-radius: 30px; animation-name: loading; animation-duration: .875s; animation-iteration-count: infinite; animation-direction: alternate; animation-fill-mode: both; animation-timing-function: cubic-bezier(0.75, 0, 0.25, 1);}
.pos-ui-loading .loading-item:nth-child(1){margin-right: -12px; background-color: rgb(169, 15, 57);}
.pos-ui-loading .loading-item:nth-child(2){margin-left: -12px; background-color: rgb(196, 133, 69); animation-delay: .875s; opacity: 0;}
@keyframes loading {
	0% {transform: scale(0); -webkit-transform: scale(0); opacity: 0;}/* 20231004 -webkit 추가 */
	100% {transform: scale(1); -webkit-transform: scale(1); opacity: 1;}/* 20231004 -webkit 추가 */
}
/* 20231004 -webkit 추가 */
@-webkit-keyframes loading {
	0% {transform: scale(0); -webkit-transform: scale(0); opacity: 0;}
	100% {transform: scale(1); -webkit-transform: scale(1); opacity: 1;}
}
/* 20240730 BUTTON-LOADING */
.pos_wrap .button.pos_primary{position: relative; overflow: hidden;}
.pos_wrap .button.pos_primary:before{position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(117, 67, 27, .4); box-shadow:0 0 40px 40px rgba(117, 67, 27, .4); opacity:0; content:""; transform:scaleX(0); transition:transform 0s linear .3s, opacity .3s;}
.pos_wrap .button.pos_primary:active:before{opacity:1; transform:scaleX(1); transition:transform .3s ease;}
/* loading */
.btn-ui-loading{z-index: 9; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: transparent !important;}
.btn_loading div{width: 100%; background: transparent; display: flex; justify-content: center; align-items: center;}
.btn_loading div span{display: inline-block; width: 10px; height: 10px; border-radius: 50%; animation: btnloading 1s linear infinite; background-color: rgb(255,255,255); box-shadow: 0px 1px 5px rgb(84 41 7 / 90%);}
.btn_loading div span:nth-child(1){animation-delay: 0s;}
.btn_loading div span:nth-child(2){animation-delay: 0.2s; margin: 0px 10px;}
.btn_loading div span:nth-child(3){animation-delay: 0.4s;}
@keyframes btnloading {
	0%, 100% {transform: scale(0.5); opacity: 0;}
	50% {transform: scale(1.2); opacity: 1;}
}
@-webkit-keyframes btnloading {
	0%, 100% {-webkit-transform: scale(0.5); opacity: 0;}
	50% {-webkit-transform: scale(1.2); opacity: 1;}
}

/* 20240814 웹대출 */
.pos_fixed span.btn_txt_toss{background-image: url(/assets/m/images/common/icn_rang.svg); background-repeat: no-repeat; padding-right: 20px; background-position: right 3px;}
.pos_wrap .field.invalid .field-group:not(.none-outline).disabled{box-shadow: 0 2px 0 -1px #bbb;}
.pos_wrap .title.bg_ico{padding-bottom: 106px; background-image: url(/assets/m/images/prd/ico_lon_done.svg); background-repeat: no-repeat; background-position: center 76px;}
.button.inner-btn{height: 48px; border-radius: 10px; width: 100%;}
.lon-modal-content{position:absolute; background: #fff; width: 90%; top: 50%; left: 50%; transform: translate(-50%,-50%); border-radius: 30px;}
.lon-modal-content .modal-footer{margin: 20px;}
.lon-modal-content .modal-footer .button{height: 48px;border-radius: 10px; width: 100%;}
.lon-modal-content .modal-footer .button.cancel{margin-right: 4px;}
/* 20240823 추가 */
.pos_confirm .button:first-child{color: #9a6d4a; border: 1px solid #9a6d4a;}
.pos_confirm .button:last-child{background: #9a6d4a;}
.tip_ico{background: url(/assets/m/images/prd/ico_tip.svg) no-repeat; padding-right: 17px; background-size: 14px; background-position: right 2px;}
.tip_container{position: relative;}
.tip_container .tip_content{display: none; position: absolute; width: 140px; background: #fff; border: 1px solid skyblue; border-radius: 10px; box-shadow: 0 2px 4px 1px rgba(0,0,0,0.2); font-size: 12px; padding: 10px;}
.tip_container .tip_content.show{display: block;}
.tip_container .tip_content.tip_fir{left: 49px; top: -98px;}
.tip_container .tip_content.tip_sec{left: 103px; top: -97px;}
.tip_container .tip_content.tip_th{left: 65px; top: -80px;}
.tip_content .tip_btn_close{display: inline-block; position: absolute; right: 12px; bottom: 10px; font-weight: 700; color: #9a6d4a;}
/* 바텀팝업 버튼 */
.pop_btn_radius{height: 48px;border-radius: 10px; width: 100%;}
/* 20241008 웹대출 수정 */
.list_mark02{display: flex;}
.list_mark02::before{content: '-'; display: block; padding-right: 4px;}
span.btn_small{font-size: 0.8em; border-radius: 4px; padding: 0px 3px; background-color: #e9e9e9; margin-left: 4px; font-weight: normal;}
.pos_wrap .tit_img01{padding-bottom: 130px; background: url(/assets/m/images/pos/img_10.png) no-repeat center 56px;}
.pos_wrap .chk_list_ico{background: url(/assets/m/images/pos/ico_check_list.png) no-repeat 0 1px; padding-left: 30px; font-weight: 700;}
.pos_wrap .pl22{padding-left: 22px;}
.pos_wrap .loan_chk_box .btn_non_icon.btn_blue{background: dodgerblue; border: none; color: #fff;}
.pos_wrap .button.small.arrow.btn_blue{background: dodgerblue url(/assets/m/images/common/icn_rang_w.svg) no-repeat 95% center; border: none; color: #fff; background-size: 13px;}
.pos_wrap .pos_fixed .pos_button_two{display: flex; padding: 0;}
/* 20241011 페이지 상단 close 버튼 추가 */
.pos_wrap .title-wrap{position: relative;}
.pos_wrap .title-wrap .page_btn_colse{position: absolute; right: 0; top: 16px; z-index: 9; margin-left: auto; width: 32px; height: 32px; background-image: url("/assets/m/images/common/icn_close.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 32px 32px;}

/* 웹대출v2 헤더 css 수정 */
#mf_wfm_contents_v2_root header { z-index: 1000; background-color:transparent; }