/* 202401 add style [S] */

/* common [S] */
::-webkit-scrollbar {
    display: none;
}

:root {
    --default-font-size: 16px;
    --base-font-size: 16;
    --breakpoint-laptop-lg: 1799px;
    --breakpoint-laptop-md: 1599px;
    --breakpoint-laptop-sm: 1399px;
    --breakpoint-laptop: 1199px;
    --breakpoint-tablet: 999px;
    --breakpoint-tablet-sm: 799px;
    --breakpoint-mobile: 599px;
    --breakpoint-mobile-sm: 399px;
    --breakpoint-min: 320px;
    --color-pastel-skyblue: #C4E6F6;
    --color-pastel-blue: #CADAF3;
    --color-pastel-green: #D7F0DA;
    --color-pastel-orange: #EFD3B6;
    --color-pastel-yellow: #F5EBB2;
    --color-pastel-pink: #F2D2DB;
    --color-pastel-gray: #DFEAF4;
    --color-midtone-blue: #467BAB;
    --color-midtone-green: #4D9F54;
    --color-midtone-mint: #4B909E;
    --color-blue1: #159EDE;
    --color-blue2: #0C58CA;
    --color-blue3: #1039A1;
    --color-blue4: #14243C;
    --color-gray1: #FFFFFF;
    --color-gray2: #EEEEEE;
    --color-gray3: #E2E2E2;
    --color-gray4: #DDDDDD;
    --color-gray5: #CCCCCC;
    --color-gray6: #999999;
    --color-gray7: #666666;
    --color-gray8: #000000;
    --color-gray9: #010101;
    --color-grayish1: #F5F9FD;
    --color-grayish2: #EAF0F7;
    --color-grayish3: #D9E2EC;
    --color-grayish4: #C8D3DE;
    --color-grayish5: #B1BECA;
    --color-grayish6: #99A4A;
    --color-grayish7: #7D8890;
    --color-grayish8: #5C656D;
    --color-grayish9: #434B53;
    --color-grayish10: #1B2024;
    --color-default: #010101 !important;
    --border-radius-xl: 2.25rem;
    --border-radius-l: 2rem;
    --border-radius-m: 1.5rem;
    --border-radius-s: 1rem;
    --spacing-xl: 10rem;
    --grid-gutter: 1rem;
}
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/*
@font-face {
  font-family: 'Pretendard Variable';
  font-weight: 45 920;
  font-style: normal;
  font-display: swap;
  src: url('../fonts/pretendard/public/variable/PretendardVariable-872a6c5775ec910058a9a409a201972a.ttf') format('woff2-variations');
}
*/

html,
body {
    font-size: 1rem;
    line-height: normal;
    color: #010101;
    letter-spacing: normal
}

html *,
body * {
    font-family: "Pretendard Variable", --apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif !important
}

body img {
    object-fit: contain;
}

p {
    line-height: normal;
    color: #010101;
}

b,
strong {
    font-weight: 600 !important;
}

input {
    display: flex !important;
    align-items: center;
    margin-top: 0.62rem !important;
    padding: 0 1rem !important;
    border: 1px solid #eee !important;
    border-radius: 0.5rem !important;
    width: 100%;
    height: 3rem !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    text-overflow: ellipsis;
}

input.calender {
    background: url(/to-be/images/calender.svg) no-repeat calc(100% - 0.74rem) center / 1.5rem 1.5rem !important;
}

input::placeholder {
    color: #aaa !important;
}

textarea {
    padding: 1.25rem;
    border-radius: 1rem !important;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1);
    overflow-y: scroll;
    width: 100%;
    height: 60vw;
    background: #fff;
    font-size: 0.875rem !important;
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
    resize: vertical;
}
button {border: 0;     background: inherit;}
em {
    font-style: normal;
}

body .wrapper .fw2 {
    font-weight: 200 !important;
}

body .wrapper .fw3 {
    font-weight: 300 !important;
}

body .wrapper .fw4 {
    font-weight: 400 !important;
}

body .wrapper .fw5 {
    font-weight: 500 !important;
}

body .wrapper .fw6 {
    font-weight: 600 !important;
}

body .wrapper .m0 {
    margin: 0 !important;
}

body .wrapper .mt {
    margin-top: 0 !important;
}

body .wrapper .mr {
    margin-right: 0 !important;
}

body .wrapper .mb {
    margin-bottom: 0 !important;
}

body .wrapper .ml {
    margin-left: 0 !important;
}

body .wrapper .mt1 {
    margin-top: 1rem !important;
}

body .wrapper .mb1 {
    margin-bottom: 1rem !important;
}

body .wrapper .mt15 {
    margin-top: 1.5rem !important;
}

body .wrapper .mb15 {
    margin-bottom: 1.5rem !important;
}

body .wrapper .mt2 {
    margin-top: 2rem !important;
}

body .wrapper .mb2 {
    margin-bottom: 2rem !important;
}

body .wrapper .mt25 {
    margin-top: 2.5rem !important;
}

body .wrapper .mb25 {
    margin-bottom: 2.5rem !important;
}

body .wrapper .mt375 {
    margin-top: 3.75rem !important;
}

body .wrapper .mb375 {
    margin-bottom: 3.75rem !important;
}

body .wrapper .mt475 {
    margin-top: 4.75rem !important;
}

body .wrapper .mb475 {
    margin-bottom: 4.75rem !important;
}

body .wrapper .fs_1 {
    font-size: 1rem !important;
    font-weight: 400;
    line-height: 1.375rem !important;
}

body .wrapper .fs_08125 {
    font-size: 0.8125rem !important;
    font-weight: 400;
    line-height: 1.125rem !important;
    letter-spacing: -0.02rem;
}

body .wrapper .fs_0875 {
    font-size: 0.875rem !important;
    font-weight: 600;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
}

body .wrapper .fs_125 {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    line-height: 1.75rem;
    letter-spacing: -0.03rem;
}

body .wrapper .fs_1125 {
    font-size: 1.125rem !important;
    font-weight: 400 !important;
    line-height: 1.5rem;
    letter-spacing: -0.03rem;
}

body .wrapper .fw4 {
    font-weight: 400 !important;
}

body .wrapper .fw6 {
    font-weight: 600 !important;
}

body .wrapper .flex15 {
    display: flex !important;
    gap: 1.5rem !important;
}

body .wrapper .flex15 .hd_box {
    margin: 0 !important;
}

body .wrapper .f_column {
    flex-direction: column !important;
}

body .wrapper .fc434b53 {
    color: #434b53 !important;
}

body .wrapper .red {
    color: #f90f00 !important;
}

body .wrapper .txtBlue {
    color: #1039a1 !important;
}

body .wrapper .txtBlue02 {
    color: #0c58ca !important;
}

body .wrapper .tl {
    text-align: left !important;
}

body .wrapper .tc {
    text-align: center !important;
}

body .wrapper .tr {
    text-align: right !important;
}

body .wrapper .bks {
    background: #f5f9fd !important;
}

body .wrapper .grayColor {
    color: #666 !important;
}
body .wrapper .underline {
    text-decoration: underline;
}

.rotate-45 {
    -webkit-transform: rotate(45deg) !important;
    transform: rotate(45deg) !important;
}

.rotate-90 {
    -webkit-transform: rotate(90deg) !important;
    transform: rotate(90deg) !important;
}

.rotate-135 {
    -webkit-transform: rotate(135deg) !important;
    transform: rotate(135deg) !important;
}

.rotate-180 {
    -webkit-transform: rotate(180deg) !important;
    transform: rotate(180deg) !important;
}

.rotate-225 {
    -webkit-transform: rotate(225deg) !important;
    transform: rotate(225deg) !important;
}

.rotate-270 {
    -webkit-transform: rotate(270deg) !important;
    transform: rotate(270deg) !important;
}

.rotate-315 {
    -webkit-transform: rotate(315deg) !important;
    transform: rotate(315deg) !important;
}

.rotate-45,
.rotate-90,
.rotate-135,
.rotate-180,
.rotate-225,
.rotate-270,
.rotate-315 {
    transition: all 500ms ease;
}

.shadowBox {
    border-radius: 0.75rem;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1);
}

.not-yet {
    -webkit-pointer-events: none;
    pointer-events: none;
}

/* common [E] */

/* header [S] */
body .wrapper #header {}

body .wrapper #header * {
    transition: all 250ms ease;
}

body .wrapper .page-header {
    position: fixed;
    top: 0px;
    right: 0px;
    left: 0px;
    z-index: 998;
    height: 3.5rem;
    min-height: 3.5rem;
    background: #fff;
}

body .wrapper .page-header .header-title {
    display: block;
    padding: 0 1.25rem;
    font-size: 1.125rem;
    font-weight: 500 !important;
    line-height: 3.5rem;
    color: #010101;
    text-align: center;
    word-spacing: -0.1rem;
}

body .wrapper .page-header .close-button.func-prev {
    position: absolute;
    top: 50%;
    left: 0.8rem;
    width: 1.5rem;
    height: 1.5rem;
    background: url(/to-be/images/sun_bank/icon_arrow02-9df0eba7199cd881605ca285b538b0a2.svg) no-repeat center center / 1.5rem 1.5rem;
    font-size: 1rem;
    line-height: 1rem;
    color: #fff;
    text-align: center;
    word-break: keep-all;
    text-indent: -999px;
    transform: translateY(-50%);
}

body .wrapper .page-header .close-button.func-cancle {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1rem;
    border: 1px solid #ccc;
    border-radius: 1.25rem;
    right: 10px;
    height: 2.125rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    color: #010101;
    letter-spacing: -0.02rem;
}

body .wrapper .page-header .close-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

/* header [E] */

/* container [S] */
body .wrapper .content {
    margin: 0;
}

body .wrapper #page-content {
    padding: 3.48rem 0 9.55rem;
}

body .wrapper #page-content-scroll {
    padding: 0 1.25rem !important;
}

body .wrapper .sun-main .con_top {
    margin: 2.5rem 0 2.5rem 0;
    padding: 2.5rem 1.25rem 1.25rem;
    border-radius: 1rem;
    background: #51b74f;
}

body .wrapper .sun-main .con_top .cont_top {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: column;
    color: #010101;
}

body .wrapper .sun-main .con_top .cont_top p {
    margin: 0 0 1rem 0;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25rem;
}

body .wrapper .sun-main .con_top .cont_top h2 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 200;
    line-height: 2rem;
    text-align: center;
}

body .wrapper .sun-main .sunBox {
    display: flex;
    justify-content: center;
    margin: 1rem 0 1.5rem;
}

body .wrapper .sun-main .sunBox>img {
    width: 120px;
    height: 120px;
}

body .wrapper .sun-main .con_top .cont_bottom {
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    border-radius: 16px;
    background: #41933f;
}

body .wrapper .sun-main .con_top .cont_bottom>div {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    flex-direction: column;
    width: 50%;
    height: 88px;
}

body .wrapper .sun-main .con_top .cont_bottom>div p {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.125rem;
    color: #fff;
}

body .wrapper .sun-main .con_top .cont_bottom>div h4 {
    padding-top: 4px;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.375rem;
    color: #fff;
}

body .wrapper .sun-main .con_top .cont_bottom+p {
    margin: 0.75rem 0 0 0;
    font-size: 0.8125rem;
    font-weight: 400;
    color: #fff;
    text-align: center;
}

body .wrapper .conMi {
    display: flex;
    gap: 1.5rem;
    flex-direction: column;
    margin: 0 !important;
    padding: 0 !important;
}

body .wrapper .conMi h4.tit {
    margin-bottom: 1.25rem;
    padding: 0;
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 2rem;
}

body .wrapper .con_ul {
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
}

body .wrapper .con_ul.mt25 {
    margin-top: 2.5rem !important;
}

body .wrapper .con_ul li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: #010101;
    word-break: keep-all;
}

body .wrapper .con_ul li .form-item {
    flex: 1 1 0;
}

body .wrapper .con_ul .inputFieldBox {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    padding: 1.5rem 1.25rem;
    border-radius: 0.75rem;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1);
    width: 100%;
    background: #fff;
}

body .wrapper .con_ul .inputFieldBox ul {
    display: flex;
    flex-direction: column;
    width: 100%;
}

body .wrapper .con_ul .inputFieldBox ul li {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    border: 0;
    width: 100%;
}

body .wrapper .con_ul .inputFieldBox label {
    margin-bottom: 0.75rem;
    width: 100%;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #666;
}

body .wrapper .con_ul .inputFieldBox label+input {
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #eee;
    width: 100%;
    font-size: 1.125rem !important;
    font-weight: 600;
    line-height: 1.5rem;
    color: var(--color-default);
}

body .wrapper .con_ul .inputFieldBox+.tit {
    margin-top: 1.5rem !important;
}

body .wrapper .con_ul .hd {}

body .wrapper .con_ul .hd:before {
    margin-right: 0.38rem;
    border-radius: 50%;
    width: 0.25rem;
    height: 0.25rem;
    background-color: #159ede;
    content: "";
}

body .wrapper .con_ul .hd2 {
    display: flex !important;
    gap: 0.58rem;
    flex-direction: row;
}

body .wrapper .con_ul .hd2:before {
    border-radius: 50%;
    width: 0;
    height: 0;
    background-color: #666;
    font-size: 1.6rem;
    line-height: 1.22rem;
    content: "·";
}

body .wrapper .con_ul .hd.l2 {
    margin: 1.5rem 0;
}

body .wrapper .con_ul .hd.l2:before {
    margin-top: -1.2rem;
    content: "";
}

body .wrapper .con_ul .hd_box,
.con_ul .hd_box>p {
    display: flex !important;
    gap: 0.62rem;
    align-items: flex-start;
    flex-direction: column;
    margin: 0.63rem 0 0 0;
    padding: 1rem 1rem;
    border-radius: 0.75rem;
    background-color: #f5f9fd;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: #666;
}

body .wrapper .con_ul .hd_box>p {
    margin: 0;
    padding: 0;
}

body .wrapper .con_ul .hd_box+.hd {
    margin-top: 1.5rem;
}

body .wrapper .headLine p {
    display: flex !important;
    align-items: baseline;
}

body .wrapper .headLine p+p {
    padding-top: 0.36rem !important;
}

body .wrapper .con_ul .hd_box.headLine span {
    display: block;
    padding-top: 0.88rem;
    color: #666 !important;
}

body .wrapper .headLine p:before {
    margin: 0.26rem;
    border-radius: 50%;
    position: relative;
    top: -0.24rem;
    width: 3px;
    height: 3px;
    background: #666;
    content: '';
}

body .wrapper .con_ul .hd_small {
    margin-top: 1rem;
    font-size: 0.812rem;
    font-weight: 400;
    line-height: 1.125rem;
    color: #010101;
}

body .wrapper .con_ul .hd_small:before {
    margin-right: 0.24rem;
    content: "* ";
}

body .wrapper .con_ul.box {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
}

body .wrapper .con_ul.box li {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    margin-bottom: 0;
    padding: 1rem 1.5rem;
    border-radius: 0.75rem;
    width: 100%;
    line-height: 1.5rem;
    letter-spacing: -0.02rem;
}

body .wrapper .con_ul.box li {
    font-size: 1.125rem;
    text-align: left;
}

body .wrapper .con_ul.box li.bl {
    background-color: #3370cc;
}

body .wrapper .con_ul.box li.gr {
    background-color: #57af70;
}

body .wrapper .con_ul.box li.dg {
    display: block;
    background-color: #57a4af;
}

body .wrapper .con_ul.box li+li {
    margin-top: 0.62rem;
}

body .wrapper .con_ul.box li p {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.65rem;
    color: #fff;
    text-align: left;
    letter-spacing: -0.03rem;
}

body .wrapper .con_ul.box li small {
    display: block;
    font-size: 0.75rem;
    font-weight: 400;
    color: #fff;
    letter-spacing: -0.018rem;
}

body .wrapper .con_ul.box li.btn {
    display: flex;
    gap: 0.5rem;
    flex-direction: row;
    margin-top: 1.25rem;
    padding: 0;
}

body .wrapper .con_ul.box li.btn a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1 1 0;
    padding: 0.5rem 0.62rem 0.5rem 0.88rem;
    border: 1px solid #ddd;
    border-radius: 0.375rem;
    width: 50%;
    height: 2.75rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.14rem;
    color: #010101;
    letter-spacing: -0.03rem;
    word-spacing: -0.15rem
}

body .wrapper .con_ul.box li.btn a:after {
    width: 1.125rem;
    height: 1.125rem;
    background: url(/to-be/images/sun_bank/icon_arrow01-5203a2bd5ee3dff0e380117837bd8905.svg) no-repeat center center / 1.125rem 1.125rem;
    content: "";
}

body .wrapper .con_ul>li>ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
}

body .wrapper .con_ul>li>ul>li {
    display: flex;
    align-items: center;
    flex-basis: calc(25% - 0.38rem);
    flex-direction: column;
    margin-bottom: 0.5rem;
    padding: 0.88rem 0;
    border: 1px solid #eee;
    border-radius: 0.75rem;
}

body .wrapper .con_ul>li>ul>li+li {
    margin-left: 0.5rem;
}

body .wrapper .con_ul>li>ul>li span {
    display: block;
    padding: 0 1.013rem;
    font-size: 0.75rem;
    line-height: 1.125rem;
    color: #666;
}

body .wrapper .con_ul>li>ul>li img {
    margin: 0 0 0.25rem;
    width: 1.5rem;
    height: 1.5rem;
}

body .wrapper .con_ul>li>ul.bank img {
    width: auto;
    height: auto;
    max-width: 24px;
}

body .wrapper .con_ul>li>ul.bank {
    margin-bottom: 0 !important;
    width: auto;
    max-width: inherit;
    height: auto;
    max-height: inherit;
    background-size: cover;
}

body .wrapper .con_ul .tit {
    position: relative;
}

body .wrapper .con_ul.bk .tit {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 3.25rem 0 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: #010101;
    word-break: keep-all;
}

body .wrapper .con_ul.bk .tit a {
    margin-left: 0.62rem;
}

.grayBox {
    margin: 2.5rem 0;
    position: relative;
    left: -1.25rem;
    width: calc(100% - -2.5rem);
    height: 0.625rem;
    background-color: #eee;
}

/* container [E] */

/*  */
body .wrapper .full-page {}

/* step 스텝 [S] */
body .wrapper .stepIcon .tit+li {
    margin-top: 0.6rem;
    padding: 1.4rem 1.25rem;
    border-radius: 1rem;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1);
}

body .wrapper .stepIcon img {
    margin: 0 !important;
}

body .wrapper .stepIcon div {
    display: flex;
    gap: 0.88rem;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    margin-left: 0.64rem;
}

body .wrapper .stepIcon p {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.62rem;
    letter-spacing: -0.02rem;
}

/* step 스텝 [E] */

/* table 테이블 [S] */
body .wrapper .table {
    margin-top: 0.63rem;
}

body .wrapper .table.small * {
    font-size: 0.875rem;
}

body .wrapper .table th {
    padding: 1rem 0.6rem;
    border: 1px solid #b6d6e5;
    background: #eaf0f7;
    line-height: 1.25;
    color: #010101;
}

body .wrapper .table td {
    padding: 1rem 0.6rem;
    line-height: 1.25;
    color: #666;
}

body .wrapper .table td.center {
    text-align: center;
}

/* table 테이블 [E] */

.txt_caution {
    margin-top: 1.5rem;
    font-size: 0.875rem;
    line-height: 1.25;
    color: #666;
}

/* tooltip 툴팁 [S] */
body .wrapper .tooltip {
    display: block;
}

body .wrapper .tit .tooltip {
    margin-left: 0.62rem;
    position: relative;
}

body .wrapper .tooltipPop {
    display: none;
    gap: 0.5rem;
    flex-direction: column;
    padding: 1rem !important;
    border: 1px solid #159ede;
    border-radius: 1rem;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.12);
    position: absolute;
    left: 50%;
    z-index: 11;
    width: calc(100% - 5.6rem);
    height: auto;
    background: #f5f9fd;
    transform: translateX(-50%);
}

body .wrapper .tooltipPop.show {
    display: inline-flex;
}

body .wrapper .tooltipPop.top {
    top: 1.34rem;
}

body .wrapper .tooltipPop.bottom {
    bottom: 1.35rem;
}

body .wrapper .tooltipPop .titBox {
    position: relative;
}

body .wrapper .tooltipPop .titBox p {
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.125rem;
    color: #1b2024 !important;
}

body .wrapper .tooltipPop .titBox p+p {
    padding-top: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 400;
    line-height: 1rem;
    color: #434b53 !important;
}

body .wrapper .tooltipPop .close {
    padding: 0.25rem;
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 2;
}

body .wrapper .tooltipPop .close img {}

/* tooltip 툴팁 [E] */

/* 토스트 toast pop [S] */
.toast .toast_header .emph_toast {
    margin-bottom: 1.25rem;
    padding: 0;
    font-size: 1.375rem;
    font-weight: 500;
    line-height: 2rem;
}

.toast .toast_container {
    margin-top: 1.5rem;
    position: relative;
}

.layer_area.toast .inner_area {
    padding: 2.5rem 1.5rem;
    border-radius: 1.5rem 1.5rem 0 0;
}

.toast_footer button {
    position: absolute;
    top: 0.75rem;
    right: -0.5rem;
    left: unset;
    width: 1.5rem;
    height: 1.5rem;
    background: url(/to-be/images/icon_close-4bcb632c8d28174c615376001d918079.svg) no-repeat center center / 1.5rem 1.5rem;
    font-size: 1rem;
    line-height: 1rem;
    color: #fff;
    text-align: center;
    word-break: keep-all;
    text-indent: -999px;
    transform: translateY(-50%);
}

.toast_footer [class*='btn_'] span {
    background: transparent;
}

/* 토스트 toast pop [E] */

/* 셀렉트박스 [S] */
body .wrapper select {
    display: flex !important;
    align-items: center;
    padding: 0 1rem !important;
    border: 1px solid #eee !important;
    border-radius: 0.5rem !important;
    height: 3rem !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    -webkit-appearance: none;
    appearance: none;
}

body .wrapper select option {}

body .wrapper select option+option {
    padding: 0.32rem 0 0;
}

body .wrapper select option[value='none'] {
    color: #666 !important;
}

/* 셀렉트박스 [E] */

/* 이용약관 [S] */
body .wrapper .youth-c {
    margin: 0;
    padding: 0;
}

body .wrapper .youth-c * {
    color: #010101 !important;
}

body .wrapper .agr-y-tit {
    padding: 1.5rem 0 2.5rem;
}

body .wrapper .all-check-agree {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

body .wrapper .all-check-agree .form-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 1rem;
    border-radius: 0.75rem;
    background-color: #eaf0f7;
}

body .wrapper .all-check-agree .form-item label:before {
    display: none;
}

body .wrapper .agree-youth .chapter-title {
    padding: 0;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
}

body .wrapper .agree-youth .chapter-title:before {
    display: none;
}

body .wrapper .agree-youth .youth-law {
    margin: 0;
    padding: 0;
    border: 0;
    background-color: transparent;
}

body .wrapper .agree-youth .chapter-title {
    margin-top: 2.5rem;
}

body .wrapper .agree-youth .chapter-title:before {
    display: none !important;
}

body .wrapper .agree-youth .youth-check li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.5rem;
}

body .wrapper .agree-youth .youth-check .form {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

body .wrapper .agree-youth .youth-check label {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
}

body .wrapper .agree-youth .agreement-contents {
    width: 1.2rem;
    height: 1.2rem;
    background: url(/to-be/images/main/mainicon_arrow02-0fcdaea4f1ac6744106b66ba05d7fe0f.svg) no-repeat center center / 1.2rem;
    font-size: 1rem;
    line-height: 1rem;
    color: #fff;
    text-align: center;
    word-break: keep-all;
    text-indent: -9999px;
}

body .wrapper .agreement-cont .bottom-text {
    padding: 0;
}

body .wrapper .youth-c+.submit-btn a {
    width: 100%;
    background-color: #159ede;
}

body .wrapper .youth-c+.submit-btn a.not-yet {
    background-color: #b6d6e5;
}

/* 이용약관 [E] */

/* 문답 작성 [S] */
body .wrapper .page-alert {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 1.5rem 0 1.5rem;
}

body .wrapper .page-alert p {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    line-height: 1.75rem !important;
    text-align: left;
    letter-spacing: -0.03rem;
}

body .wrapper .survey-content {
    padding: 0;
}

body .wrapper .survey-content .tit-q {
    margin-bottom: 1rem;
    padding: 0 0 0 2.2rem;
    background: none;
    font-size: 1rem !important;
    font-weight: 400;
    line-height: 1.375rem !important;
    letter-spacing: -0.025rem;
    text-indent: -1.1rem;
}

body .wrapper .survey-content .tit-q:before {
    display: inline-block;
    padding-right: 1rem;
    position: relative;
    top: 0.14rem;
    font-size: 1.5rem;
    font-weight: 500;
    color: #159ede;
    content: 'Q';
}

body .wrapper .survey-content .tit-q>p {
    padding: 0.3rem 0 0 0;
    font-size: 0.875rem !important;
    font-weight: normal;
    line-height: 1.25rem;
    color: #666 !important;
    word-break: break-all;
    text-indent: 0;
}

/* padding: 0.3rem 0 0 1rem;text-indent: -0.96rem; */
body .wrapper .survey-content .field-item .f-labels {
    display: inline-flex;
    gap: 0.7rem 0;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: column;
    padding-left: 2.26rem;
}

body .wrapper .survey-content .field-item .f-labels.addStyle {
    align-items: flex-start;
    flex-wrap: wrap;
    flex-direction: column;
}

body .wrapper .survey-content .field-item .f-labels>p {
    padding: 0;
    background: transparent;
}

/* 문답 작성 [E] */

/* 라디오 체크 사항 안내 [S] */
body .wrapper .agree-layout .agree-part {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

body .wrapper .agree-layout .agree__box {
    display: none;
}

body .wrapper .agree-layout .agree-part__text01 {
    width: calc(100% - 2.25rem);
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
}

body .wrapper .agree-youth {
    margin: 0 !important;
    padding: 0 1.25rem;
    left: -1.25rem;
    width: calc(100% - -2.5rem);
}

body .wrapper .agree-youth.agree-layout {
    padding: 2.5rem 1.25rem;
}

body .wrapper .agree-youth .youth-law label span {
    font-weight: 600;
    color: #ea573f !important;
}

body .wrapper .agree-youth .allBtn {
    margin: 2.5rem 0 -2.5rem;
    padding: 1.2rem 1.25rem 1.5rem;
    left: -1.25rem;
    width: calc(100% - -2.5rem);
    background: #ffffff;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: -0.02rem;
}

/* 라디오 체크 사항 안내 [E] */

/* 탑 레이어 알림창 np-layer-bg [S] */
body .np-layer-bg {
    background: rgba(0, 0, 0, 0.7);
}

body .np-layer-bg p,
body .np-layer-bg span {
    font-size: 1rem;
}

body .np-layer-content {
    margin: 5rem auto 0;
    padding: 1.6rem 1.6rem 1.6rem;
    border-radius: 1.8rem;
    position: relative;
    width: calc(100% - 3.76rem);
    height: auto;
}

body .np-layer-content .np-layer-top-icon {
    margin-bottom: 1rem;
    padding: 0;
    width: 100%;
    background: url(/to-be/images/menu/mbti/check_large-2a5965aa9fa891c4ad886f07ce7ea31f.svg) no-repeat center center / 3.2rem 3.2rem;
    text-align: center;
}

body .np-layer-content .np-layer-top-icon:before {
    display: block;
    text-indent: -9999px;
    content: "앱 무결성 아이콘";
}

body .np-layer-content .np-layer-top-icon img {
    display: none;
}

body .np-layer-content .btn-bottom .button {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 !important;
    border: 0;
    border-radius: 1rem;
    width: 100%;
    height: 3.25rem !important;
    background: #159ede;
    font-size: 1.125rem !important;
    font-weight: 400 !important;
    line-height: 4.5rem !important;
    color: #fff !important;
    text-align: center;
}

/* 탑 레이어 알림창 np-layer-bg [E] */

/* 알림창 [S] */
body .layer_single .dummy {
    background: rgba(0, 0, 0, 0.7);
    oapcity: 1;
}

body .layer_area .inner_cell {
    padding: 0 1.88rem;
}

body .layer_area .inner_area {
    width: 100% !important;
}

body .layer_area .page-content {
    padding: 0;
}

body .layer_area .page-content .agr-y-tit {
    padding-top: 0;
}

body .layer_area .box_alert * {
    font-size: 1rem;
    word-break: keep-all;
}

body .layer_area button,
.layer_area button * {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    width: 100%;
    height: 3.25rem !important;
    background: #159ede;
    font-size: 1.125rem !important;
    font-weight: 400 !important;
    line-height: 4.5rem !important;
    color: #fff !important;
}

body .layer_area button[disabled],
.layer_area button[disabled] * {
    background-color: #b6d6e5;
}

/* 알림창 [E] */

/* 신청 안내 [S] */

/* 신청 안내 [E] */

/* footer [S] */
body .wrapper .submit-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    padding: 0 1.25rem 2.5rem;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10;
    background: #fff;
    font-size: 0;
}

body .wrapper .submit-btn:before {
    display: block;
    position: absolute;
    top: -1.4rem;
    z-index: 10;
    width: 100%;
    height: 1.4rem;
    background: #fff;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
    content: '';
}

body .wrapper .submit-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    width: 100%;
    height: 3.25rem !important;
    background-color: #222;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 4.5rem !important;
    color: #fff !important;
}

body .wrapper .submit-btn a+a {
    margin-left: 0.5rem;
}

body .wrapper .submit-btn a.backBlue,
body .wrapper .submit-btn a.send,
body .wrapper .submit-btn a.green-send {
    background-color: #159ede;
}

body .wrapper .submit-btn a.not-yet {
    background-color: #b6d6e5;
}

/* footer [E] */

/* check [S] */
body .wrapper .check {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 1.5rem;
    line-height: 1;
}

body .wrapper input[type=checkbox] {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    width: 1.5rem !important;
    height: 1.5rem !important;
    visibility: visible;
    background: url(/to-be/images/checkbox_off-19258e380e60faeddd161f41374229b2.svg) no-repeat center center / 1.5rem 1.5rem;
    opacity: 1;
    -webkit-appearance: none;
    appearance: none;
}

body .wrapper input[type=checkbox]:checked {
    width: 1.5rem !important;
    height: 1.5rem !important;
    background: url(/to-be/images/checkbox_on-d9fbae01e811a2a9756f635f36f24c02.svg) no-repeat center center / 1.5rem 1.5rem;
}

body .wrapper input[type=checkbox]+label {
    flex: 1 1 0;
    margin: 0;
    padding-left: 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.375rem;
}

body .wrapper input[type=checkbox]+label:before {
    display: none;
}

/* check [E] */

/* accordion [S] */
.accordion-list {
    display: flex;
    gap: 1.25rem;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    font-size: 0.875rem;
}

.accordionClick {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.accordionClick span {
    display: flex !important;
    gap: 0.5rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    letter-spacing: -0.025rem;
}

.accordionClick span b {
    font-size: 1.125rem;
    color: var(--color-blue1);
}

/*.accordionClick img{transition:all 0.3s ease;}*/
.accordion-list .answer {
    display: none;
    margin: -0.25rem 0 0 0;
    padding-top: 1rem;
    border-top: 1px solid #eee;
}

.accordionClick.active+.answer {
    display: flex !important;
    gap: 0.75rem;
    flex-direction: column;
}

.accordion-list .answer li {
    line-height: 1.25rem;
    color: #666;
}

.accordion-list .answer li.tit {
    margin: 0;
    color: #010101;
}

.accordion-list .answer li dl {
    display: flex;
    gap: 0.4rem;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    margin-bottom: 0.25rem;
}

.accordion-list .answer li dl dd,
.accordion-list .answer li dl dt {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    padding-left: 0.64rem;
    text-indent: -0.64rem;
}

.accordion-list .answer li dl a {
    padding: 0 1rem 0 0.2rem;
    text-decoration: underline;
    text-indent: 0;
}

.accordion-list img {
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
}

/* accordion [E] */

/* accordion + check [S] */
/* KFA_DMT_01030200 [참조] */
/* accordion + check [E] */

/* popup [S] */
body .wrapper .layer-youth .layer-box {
    padding: 2.5rem 1.5rem;
    border-radius: 1.5rem 1.5rem 0 0;
    top: auto;
    bottom: 0;
    left: 0;
    width: 100%;
    transform: translateY(0%);
}

body .wrapper .layer-youth .body {
    padding: 0;
    color: #010101;
}

body .wrapper .layer-youth .body .layer-alert {
    margin: 0 0 3rem;
    text-align: left;
    word-break: keep-all;
}

body .wrapper .layer-youth .body .layer-alert .tit-le {
    display: block;
    padding-bottom: 1.5rem;
    font-weight: bold;
}

body .wrapper .layer-youth .body .layer-alert .sub_tit {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
}

body .wrapper .layer-youth .body .layer-alert .sub_tit span {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.37rem;
}

body .wrapper .layer-youth .body .layer-alert .sub_tit img {
    margin: 0 1.5vw;
    width: 6.2vw;
}

body .wrapper .layer-youth .body .layer-alert .desc {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

body .wrapper .layer-youth .body .layer-alert .desc span {
    display: inline;
    color: #010101;
    word-break: keep-all;
}

body .wrapper .layer-youth .body .layer-alert .check {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: 1.5rem;
    line-height: 1;
}

body .wrapper .layer-youth .layer-alert .con_ul.box {
    margin-top: 1.5rem !important;
}

body .wrapper .layer-youth .layer-alert .con_ul.box li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    border-radius: 1rem;
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.08);
}

body .wrapper .layer-youth .layer-alert .con_ul.box li span {
    position: relative;
}

body .wrapper .layer-youth .layer-alert .con_ul.box li img {}

body .wrapper .layer-youth .body .hd_box {
    margin: 0;
}


body .wrapper .hd_box dl * {
    font-size: 0.875rem;
}

body .wrapper .layer-youth .body .hd_box .tit {
    padding-bottom: 0.38rem;
    font-weight: 600;
}

body .wrapper .layer-youth .body .hd_box .tit+dd {
    padding-bottom: 0.62rem;
    color: #010101;
}

body .wrapper .blue_t {
    color: #1039a1 !important;
}

body .red_t,
body .wrapper .red_t {
    color: #f90f00 !important;
}

body .bold {
	font-weight: 500 !important;
}
body .wrapper .hd_box dt {
    padding-bottom: 0.38rem;
    font-weight: 600;
}

body .wrapper .hd_box dd {}

body .wrapper .hd_box dd p {
    padding-left: 1.2rem;
    color: #666;
    text-indent: -1.2rem;
}

body .wrapper .hd_box dd p+p {}

body .wrapper .layer-youth .submit-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0;
}

body .wrapper .layer-youth .submit-btn:before {
    display: none;
}

body .wrapper .layer-youth .submit-btn>a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.88rem 1rem;
    border-radius: 0.75rem;
    height: 3.25rem;
    background-color: #222;
    font-size: 1.125rem;
    line-height: 1.5rem;
    color: #fff;
}

body .wrapper .layer-youth .submit-btn>a.send {
    background-color: #159ede;
}

body .wrapper .layer-youth .submit-btn>a+a {
    margin-left: 0.5rem;
}

/* popup [E] */

/* layer_wrapper [S] */
body .layer_wrapper .inner_wrapper {
    overflow-x: hidden;
    overscroll-behavior: contain;
}

body .layer_wrapper .fs_125 {
    font-size: 1.25rem !important;
    line-height: 1.75rem;
    letter-spacing: -0.03rem;
}

body .layer_wrapper .layer_area.toast {}

body .layer_wrapper .layer_area.toast.active {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: calc(100vh - 3.5rem);
}

/*body .layer_wrapper .layer_area.toast .inner_area{border-radius: 0;padding:1.5rem 2.5rem 9.55rem;}*/
body .layer_wrapper .layer_area.toast .inner_area.full {
    padding: 1.5rem 1.25rem 9.55rem;
    border-radius: 0;
    height: calc(100vh - 3.5rem);
}

body .layer_wrapper .layer_area.toast .inner_cell {
    padding: 0;
}

body .layer_wrapper .inner_area .page-header {
    position: fixed;
    top: 0px;
    right: 0px;
    left: 0px;
    z-index: 998;
    height: 3.5rem;
    min-height: 3.5rem;
    background: #fff;
    transition: all 350ms ease;
}

body .layer_wrapper .inner_area .page-header * {
    transition: all 250ms ease;
}

body .layer_wrapper .inner_area .page-header .header-title {
    display: block;
    padding: 0 1.25rem;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 3.5rem;
    color: #010101;
    text-align: center;
    word-spacing: -0.1rem;
}

body .layer_wrapper .inner_area .page-header .func-prev {
    position: absolute;
    top: 50%;
    left: 0.8rem;
    width: 1.5rem;
    height: 1.5rem;
    background: url(/to-be/images/icon_back-9df0eba7199cd881605ca285b538b0a2.svg) no-repeat center center / 1.5rem 1.5rem;
    font-size: 1rem;
    line-height: 1rem;
    color: #fff;
    text-align: center;
    word-break: keep-all;
    text-indent: -999px;
    transform: translateY(-50%);
}

body .layer_wrapper .inner_area .page-header .func-cancle {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    position: absolute;
    top: 50%;
    right: 1.25rem;
    left: unset;
    width: 1.5rem;
    height: 1.5rem;
    background: url(/to-be/images/sun/index/sun_you/icon_close02.svg) no-repeat center right / contain;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
    text-indent: -9999px;
    transform: translateY(-50%);
}

body .layer_wrapper .inner_area .agree-youth {
    margin: 0;
    padding: 0;
    width: 100%;
}


body .layer_wrapper.toast .layer_area .inner_cell {
    padding: 0;
}

body .layer_wrapper.toast .popup_dmt_01020001_agree .page-header .close-button.func-cancle {
    border: 0;
    background: url(/to-be/images/icon_close-4bcb632c8d28174c615376001d918079.svg) no-repeat center center / auto;
    text-indent: -9999px;
}

body .inner_gravity {
    padding: 0 1.25rem 2.5rem;
    background: #fff
}

body .inner_gravity:before {
    display: block;
    position: absolute;
    top: -1.4rem;
    left: 0;
    z-index: 10;
    width: 100%;
    height: 1.4rem;
    background: #fff;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
    content: '';
}

body .layer_wrapper .dummy {
    background-color: #000;
    opacity: 0.7;
}

/* layer_wrapper [E] */

body .wrapper .form-item .field-item .f-tit {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.375;
    letter-spacing: -0.025rem;
}

/* 결과 페이지 [S] */
body .wrapper .full-page {
    display: flex;
    justify-items: center;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 3.5rem 1.25rem 0 !important;
    height: auto;
}

body .wrapper .page-alert img {
    display: block;
    margin: 1rem 0;
}

body .wrapper .page-result {
    padding: 0;
    width: 100%;
}

body .wrapper .page-result p {
    text-align: left !important;
}

body .wrapper .page-result p.desc {
    margin: 0.75rem 0 0 !important;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    color: #666 !important;
    letter-spacing: -0.02rem;
    word-break: keep-all;
}

body .wrapper .page-result p.strong {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.75rem;
    color: #323232 !important;
    letter-spacing: -0.03rem;
    word-break: keep-all;
}

body .wrapper .page-result span {
    display: inline-block;
    color: #0c58ca !important;
}

/*body .wrapper .con_ul.bk .tit{margin: 3.25rem 0 0.75rem;}*/
body .wrapper .full-page .con_ul.bk+p {
    margin-top: 1.5rem;
    font-weight: 400;
}

body .wrapper .full-page .con_ul.bk+p:before {
    display: flex;
    margin-right: 0.32rem;
    content: '*';
}

/* 결과 페이지 [E] */

/* 햇살론뱅크 정보입력 [S] */
body .wrapper .form-item .field-item .note-p {
    display: flex;
    margin-top: 1.5rem;
    padding: 0;
    font-size: 0.8125rem;
    line-height: 1.125rem;
}

body .wrapper .form-item .field-item .note-p:before {
    display: block;
    margin-right: 0.32rem;
    content: '*';
}

body .wrapper .fixed-on-btn {
    padding-bottom: 120px;
    bottom: 0;
}

body .wrapper .fixed-on-btn>p {
    display: flex;
    padding: 0;
    font-size: 0.8125rem;
    line-height: 1.125rem;
}

body .wrapper .fixed-on-btn>p:before {
    display: block;
    margin-right: 0.32rem;
    content: '*';
}

body .wrapper .form-item .field-item .f-row {
    display: flex;
    position: relative;
}

body .wrapper .form-item .field-item .f-row>span+span {
    margin-top: -0.52rem;
    position: absolute;
    top: 50%;
    right: 1rem;
}

body .wrapper .form-item .field-item .f-row>span input {
    padding: 0 3.4rem 0 1rem !important;
}

/* 햇살론뱅크 정보입력 [E] */

@media only screen and (min-width: 320px) and (max-width: 359px) {

    html,
    body {
        font-size: 1rem !important;
    }
}

/* 202401 add style [E] */





/* 특례전세보증 style */
.container {
    display: flex;
    gap: 2.5rem;
    flex-direction: column;
    padding: 3.5rem 1.25rem 2.4rem !important
}

.container.gap-0 {
    gap: 0;
}

.container * {
    word-break: keep-all;
}

.container.keep-all * {
    word-break: keep-all;
    -webkit-word-break: keep-all;
}

.area_comm {
    padding: 0;
}

.con_top {
    display: flex;
    gap: 0.62rem;
    align-items: center;
    flex-direction: column;
    margin: 0.75rem 0 0;
    padding: 2.5rem 1.25rem 1.25rem;
    border-radius: 1rem;
    width: auto;
    background: #cadaf3;
}

body .wrapper .page-header .header-title {
    letter-spacing: -0.03rem;
}

.con_top .cont_top {
    display: flex;
    gap: 0.62rem;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 0;
    background: transparent;
}

.con_top .cont_top p {
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25rem;
    color: #010101;
}

.con_top .cont_top h2 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 200;
    line-height: 2rem;
    text-align: center;
}

.con_top .cont_top h2 b {
    display: block;
    font-weight: 600 !important;
}

.con_middle_1 {
    display: flex;
    gap: 1.5rem;
    align-items: center;
    flex-direction: column;
    width: 100%;
}

.btn_comm.full {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 0.75rem;
    height: 3.25rem;
    background: #0c58ca;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: #fff;
}

.txt_comm {
    display: flex;
    gap: 0.5rem;
    flex-direction: column;
}

.h1-box {
    display: flex;
    gap: 0.75rem;
    flex-direction: column;
    margin-top: 1.25rem;
}

.h1-tit {
    margin: 0;
}

.h1-tit .tit_comm2 {
    display: flex !important;
    gap: 0.73rem;
    align-items: flex-start;
    flex-direction: row;
    font-size: 1rem;
    color: #666;
}


.h1-tit .tit_comm2:before {
    margin: 0;
    border-radius: 50%;
    width: 0;
    height: 0;
    background-color: rgb(102, 102, 102);
    font-size: 1.6rem;
    line-height: 1.22rem;
    content: "·";
}
.h1-tit .tit_comm2.info-txt {
	color: #010101;
}
.h1-tit .tit_comm2.info-txt::before {
	background-color: #010101;
}

.grp_half {
    font-size: inherit;
}

.tab-list li {
    padding: 0;
    font-size: 0.875rem;
}

.list_comm {
    display: flex;
    gap: 1.5rem;
    flex-direction: column;
}

.list_comm dd {
    display: flex;
    gap: 1.5rem;
    flex-direction: column;
}

.list_comm dd h3 {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 0.625rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: #010101;
    word-break: keep-all;
}

.list_comm dd h3:before {
    align-self: self-start;
    margin-top: 0.5rem;
    border-radius: 50%;
    width: 0.25rem;
    height: 0.25rem;
    background-color: #159ede;
    content: "";
}

.list_comm ol,
.list_comm dd ol {
    display: flex;
    gap: 0.5rem;
    flex-direction: column;
    margin: 0.62rem 0 0 0;
    padding: 1rem;
    border-radius: 0.75rem;
    background-color: #f5f9fd;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    color: #010101;
}
.list_comm ol li {
	color: #010101;
	font-size: 1rem;
}
.list_comm dd li {
    padding-left: 0.59rem;
    line-height: 1.25rem;
    text-indent: -0.59rem;

    font-size: 1rem;
}
.info_accordion .tit_comm {
	display: block;
    padding-bottom: 0.62rem;
    font-size: 1.375rem;
    font-weight: 500 !important;
    line-height: 2rem;
    color: #010101;
}

.more .info dl {
    margin: 0;
    word-break: keep-all;
}

ul.bank,
.more .info dl dd ul.bank {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
    margin-bottom: 0 !important;
    width: auto;
    max-width: inherit;
    height: auto;
    max-height: inherit;
    background-size: cover;
}
ul.bank li,
.more .info dl dd ul.bank li {
    display: flex;
    align-items: center;
    flex-basis: calc(25% - 0.5rem);
    flex-direction: column;
    margin: 0 !important;
    margin-bottom: 0.5rem;
    padding: 0.88rem 0;
    border: 1px solid #eee;
    border-radius: 0.75rem;
    width: auto;
}

ul.bank li span,
.more .info dl dd ul.bank li span {
    margin: 0.25rem 0 0 0;
    padding: 0;
    font-size: 0.75rem;
    line-height: 1.125rem;
    color: #666;
    text-indent: 0;
}

ul.bank img, .more .info dl dd ul.bank img {
    /* width: auto; */
    height: auto;
    max-width: 24px;
    width: 100%;
    display: block;
}

.more .info dl dd ul li:after {
    display: none;
}

.more .info dl dt h2 {
    display: flex;
    gap: 0.4rem;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 0.625rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: #010101;
    word-break: keep-all;
}

.more .info dl dt h2:before {
    align-self: self-start;
    margin-top: 0.5rem;
    border-radius: 50%;
    width: 0.25rem;
    height: 0.25rem;
    background-color: #159ede;
    content: "";
}

.box-shadow dd {
    display: flex;
    gap: 1.5rem;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    margin: 0 !important;
    padding: 1rem;
    border-radius: 0.75rem;
    box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.1);
    width: auto;
    background: #fff;
}

.box-shadow dd p {
    font-size: 0.875rem !important;
    font-weight: 600;
    line-height: 1.25rem;
    color: #1039a1;
    letter-spacing: -0.02rem;
}

.box-shadow dd ul {
    flex-direction: row;
    width: 100%;
}

.box-shadow dd li {
    display: flex;
    gap: 0.38rem;
    align-items: center;
    flex-direction: column;
    width: 100% !important;
}

.box-shadow dd li img {
    width: 1.625rem;
}

.box-shadow dd span {
    margin: 0 !important;
    padding: 0;
    text-indent: 0;
}

.box-shadow dd li+li:before {
    position: absolute;
    top: 0.75rem;
    left: -0.3rem;
    width: 1.2rem;
    height: 2px;
    background: #ccc;
    content: '';
}

.layer_wrapper .layer_header .header {
    padding: 0;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 998;
    height: 3.5rem;
    min-height: 3.5rem;
    background: #fff;
    line-height: 55px;
    transition: all 350ms ease 0s;
}

.layer_wrapper .layer_header .header strong {
    padding: 0 1.25rem;
    font-size: 1.125rem;
    font-weight: 500 !important;
    line-height: 3.5rem;
    color: #010101;
    word-spacing: -0.1rem;
}

.layer_wrapper .layer_footer button {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: 1.5rem;
    height: 1.5rem !important;
    background: transparent url(<%= imagesPath%>/images/sun/index/sun_you/icon_close02.svg?v=${resourceVersion}) no-repeat top center / contain;
    font-size: 0.875rem;
    text-indent: -9999px;
    transform: translateY(-50%);
}

.layer_wrapper .layer_footer button span {
    background: transparent;
}

.toast_container .box_inp.all {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 1.5rem 0;
    padding: 1rem;
    border-radius: 0.75rem;
    background-color: #eaf0f7;
}

.toast_container .box_inp.all .txt_chk {
    padding: 0 0 0 0.75rem;
    font-size: 1.125rem;
    line-height: 1.375rem;
}

.toast_container input[type=checkbox] {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    position: relative;
    width: 1.5rem !important;
    height: 1.5rem !important;
    visibility: visible;
    background: url(<%= imagesPath%>/images/checkbox_off.svg?v=${resourceVersion}) no-repeat center center / 1.5rem 1.5rem;
    opacity: 1;
    -webkit-appearance: none;
    appearance: none;
}

.toast_container input[type=checkbox]:checked {
    background: url(<%= imagesPath%>/images/checkbox_on.svg?v=${resourceVersion}) no-repeat center center / 1.5rem 1.5rem;
}

.toast_header .emph_toast+.txt_toast {
    margin-top: 0.5rem;
    font-size: 0.875rem;
}

.box_inp+.list_agree.small {
    display: flex;
    gap: 1.5rem;
    flex-direction: column;
}

.box_inp+.list_agree.small {
    margin: 0;
}

.box_inp.thin .emph_chk {
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25rem;
}

.box_inp.thin .txt_chk {
    padding: 0;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
}

.box_inp .lab_chk {
    flex: 1 1 0;
}

.list_agree.small li {
    padding: 0;
}

.list_agree .box_inp {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    justify-content: space-between;
}

hr.thick {
    margin: 2.5rem 0 2.5rem -1.25rem;
    width: calc(100% - -2.5rem);
    height: 0.625rem;
    background: #eee;
}

body .layer_wrapper .layer_area.toast.active {
    height: auto;
}

body .close-button.func-cancle.handlePopupClose {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    position: absolute;
    top: 0.8rem;
    right: 0;
    left: unset;
    width: 1.5rem;
    height: 1.5rem;
    background: url(<%= imagesPath%>/images/sun/index/sun_you/icon_close02.svg?v=${resourceVersion}) no-repeat center right / contain;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    letter-spacing: -0.02rem;
    text-indent: -9999px;
    transform: translateY(-50%);
}

a[x-apple-data-detectors] {
    display: inline;
}


.result-container {
    display: flex;
    gap: 1rem;
    flex-direction: column;
}

.result-box {
    display: flex;
    gap: 3rem;
    flex-direction: column;
    padding: 1.5rem 1.5rem 1.5rem;
    border-radius: 1rem;
    background-color: #cddaf5;
}

.result-box img {
    display: block;
    margin: 0 auto;
    max-width: 9.5rem;
}
.result-box .result-txt-box h2 {
    font-weight: 600;
    letter-spacing: -.05rem;
}
.result-txt-box.txt-box {
	     display: flex
;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    margin: 0;
    padding: 0;
    background: transparent;
    font-size: inherit;
    line-height: inherit;}
.result-txt-box.txt-box h2 {
	    display: flex;
    flex-direction: column;
    align-items: center;
}
.result-txt-box.txt-box span {
	font-size: 1rem;
	font-weight: 400;
}
.info-txt-list {
    display: flex;
    gap: .5rem;
    flex-direction: column;
}

.info-txt {
    display: flex;
    gap: .25rem;
    font-weight: 400;
    font-size: 1rem;
    color: #666;
}

.info-txt.billard::before {
    content: "※";
}

.info-txt.clear {
    margin-left: .5rem;
}

.info-txt.clear::before {
    content: "";
}

.txt-box {
    display: flex;
    gap: 0.5rem;
    flex-direction: column;
    margin: 0.62rem 0 0 0;
    padding: 1rem;
    border-radius: 0.75rem;
    background-color: #f5f9fd;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.25rem;
    color: #010101;
}
.modal-btn {
    display: flex;
    align-items: center;
    padding: .5rem .8rem;
    border-radius: 2rem;
    background-color: #0c58ca;
    font-size: 1.2rem;
    line-height: 1;
    color: #fff;
    text-align: center
}

.view-detail-box {
    display: flex;
    gap: .8rem;
    align-items: center;
    flex-direction: column;
    padding: 2.4rem;
    border-radius: 1.2rem;
    background-color: #e5efff;
    font-size: 1.6rem;
}

.view-detail-box span {
    font-size: 1.4rem;
    font-weight: 500;
    color: #0c58ca;
}

.view-detail-box h2 {
    font-size: 2.4rem;
    font-weight: 400;
    text-align: center;
}

.view-detail-box a {
    margin-top: 1.8rem;
    padding: .6rem 1.6rem;
    border: .1rem solid #ccc;
    border-radius: 2rem;
}

.el-bg-popup {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
    min-height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.modal-wrapper {
    display: none;
    overflow: auto;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1002;
    width: 100%;
    max-width: 90%;
    max-height: 98%;
    transform: translate(-50%, -50%);
}

.modal-conts {
    display: flex;
    gap: 1.5rem;
    flex-direction: column;
    padding: 1.5rem;
    border-radius: 1.25rem;
    background-color: #fff;
}

.modal-title {
    display: flex;
    justify-content: space-between;
}

.modal-title h2 {
    font-size: 20px;
    font-weight: 600;
}

.modal-inner-conts {
    display: flex;
    gap: 1.2rem;
    flex-direction: column;
    font-size: 1.6rem;
    color: #666;
    word-break: keep-all;
}

.modal-wrapper.sns-share .modal-inner-conts ul {
    display: flex;
    gap: 1.2rem;
    flex-direction: row;
}

.modal-btn {
    display: flex;
    align-items: center;
    padding: 5px 8px;
    border: 0;
    border-radius: 20px;
    background-color: #0c58ca;
    font-size: 12px;
    line-height: 1;
    color: #fff;
    text-align: center
}

/* 조회 form input */
.reg-wrapper {
    margin-bottom: 2rem;
}
.reg-title {
    display: flex;
    gap: .5rem;
    align-items: center;
    margin-bottom: 1rem;
    font-size: 1.25rem;
    font-weight: 500;
}
.reg-conts {
    display: flex;
    gap: .25rem;
    flex-direction: column;
    margin-bottom: 1rem;
}
:last-child.reg-conts {
    margin-bottom: 0;
}

.reg-conts .reg-label {
    gap: 10px;
    padding-left: 0.5rem;
    position: relative;
    font-size: 1.125rem;
    font-weight: 500;
    color: #010101;
}

.reg-conts .reg-label::before {
    border-radius: 100%;
    position: absolute;
    top: 0.7rem;
    left: 0;
    width: 0.2rem;
    height: 0.2rem;
    background-color: #159ede;
    content: '';
}

.reg-conts .reg-input {
    position: relative;
}

.reg-conts .reg-input select,
.reg-conts .reg-input input[type='text'],
.reg-conts .reg-input input[type='number'] {
    padding: 0 2.2rem 0 1rem !important;
    text-align: right;
    transition: .3s;
    box-sizing: border-box;
}
.reg-conts .reg-input select {
    width: 100%;
    text-align: left;
    margin-top: 0.62rem !important;
    background: url(/tot_new/images/main/sprites/arrow_down-9ce0b33346239b1d0b67258624934800.svg) no-repeat 95% 50%/ 1rem;
}
.reg-conts .reg-input select:focus,
.reg-conts .reg-input input:focus {
    border: 1px solid var(--color-blue1) !important;
}

.reg-conts .reg-input span {
    position: absolute;
    top: 1.46rem;
    right: 1rem;
    color: #4d4f5b;
}
.result-btn {
        color: #fff !important;
    width: 100%;
    height: 3.25rem !important;
    border-radius: 0.75rem;
    font-weight: 400;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 4.5rem !important;
    padding: 0;
    background-color: #159ede;
}.acco-btn {
	margin: 1rem auto;
	background: #fff;
	color: #0c58ca;
	border: 1px solid #0c58ca;
	padding: .6rem 1rem;
	display: flex;
	align-items: center;
	gap: .5rem;
	border-radius: .75rem;
	    justify-content: center;
	    width: 100%;
}

.icon-sp {
    display: inline-block;
    overflow: hidden;
    position: relative;
    min-width: 10px;
    min-height: 10px;
    line-height: 0;
}
.icon-sp::before {
    display: inline-block;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    line-height: 0;
    content: "";
}
.icon-sp.ic_close{
		width: 24px;
	height: 24px;
}
.icon-sp.ic_close::before {
	background-image: url(/tot_new/images/tot/icon_x-932de99f26e52455e9b394df823f05f2.png);
	background-repeat: no-repeat;
		background-size: cover;
}
.icon-sp.ico-down {
	width: 1rem;
	height: 1rem;
}
button.acco-btn .icon-sp.ico-down::before {
	background-image: url(/tot_new/images/tot/arrow_down-9ce0b33346239b1d0b67258624934800.svg);
	background-repeat: no-repeat;
	background-size: cover;
}
button.acco-btn.up .icon-sp.ico-down::before {
	background-image: url(/tot_new/images/tot/arrow_up-bdffbaa59840c60290e3fb34b8b08601.svg);
	background-repeat: no-repeat;
	background-size: cover;
}

.result-btn {
        color: #fff !important;
    width: 100%;
    height: 3.25rem !important;
    border-radius: 0.75rem;
    font-weight: 400;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 4.5rem !important;
    padding: 0;
    background-color: #159ede;
}
.icon-sp {
    display: inline-block;
    overflow: hidden;
    position: relative;
    min-width: 10px;
    min-height: 10px;
    line-height: 0;
}
.icon-sp::before {
    display: inline-block;
    width: 100%;
    height: 100%;
    vertical-align: middle;
    line-height: 0;
    content: "";
}
.icon-sp.ic_close{
		width: 24px;
	height: 24px;
}
.icon-sp.ic_close::before {
    background-image: url(<%= imagesPath%>/tot_new/images/tot/icon_x-932de99….png);
    background-repeat: no-repeat;
    background-size: cover;
}
.icon-sp.ico-down {
	width: 1rem;
	height: 1rem;
}
button.acco-btn .icon-sp.ico-down::before {
	background-image: url(/tot_new/images/tot/arrow_down-9ce0b33346239b1d0b67258624934800.svg);
	background-repeat: no-repeat;
	background-size: cover;
}
button.acco-btn.up .icon-sp.ico-down::before {
	background-image: url(/tot_new/images/tot/arrow_up-bdffbaa59840c60290e3fb34b8b08601.svg);
	background-repeat: no-repeat;
	background-size: cover;
}
.totBtn__top.show {
    display: block;
    transform: translateY(0);
}
.totBtn__top {
    transition: .5s transform;
    transform: translateY(200px);
    position: fixed;
    z-index: 10;
    bottom: 2rem;
    right: 2rem;
    width: 48px;
    height: 48px;
    padding-top: 10px;
    border: 0;
    border-radius: 100%;
    background-color: rgba(17, 17, 17, 0.5);
}
.totBtn__top::before {
    position: absolute;
    left: 50%;
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border: 3px solid #fff;
    border-right: 0;
    border-bottom: 0;
    opacity: .5;
    transform: rotate(45deg) translateX(-80%);
    box-sizing: border-box;
}
.totBtn__top > span {
    color: #fff;
    font-weight: 700;
}