@charset "UTF-8";:root {
    --ds-border: #dce1e5;
    --ds-primary: #0b0d11;
    --ds-secondary: #394046;
    --ds-tertiary: #6a747c;
    --ds-lowest: #8c98a1;
    --ds-disabled: rgba(11, 13, 17, 0.12);
    --ds-invert: #ffffff;
    --ds-default: #eaedf0;
    --ds-brand: #AD38D2;
    --ds-brand-light: #E7EDFF;
    --ds-brand-dark: #1E357C;
    --ds-point: #f6464c;
    --ds-dimmed: rgba(11, 13, 17, 0.4);
    --ds-overlay: rgba(255, 255, 255, 0.8);
    --ds-text-primary: #0b0d11;
    --ds-text-secondary: #394046;
    --ds-text-tertiary: #6a747c;
    --ds-text-lowest: #8c98a1;
    --ds-text-disabled: rgba(11, 13, 17, 0.24);
    --ds-text-invert: #ffffff;
    --ds-text-brand: #AD38D2;
    --ds-text-brand-light: #E7EDFF;
    --ds-text-brand-dark: #1E357C;
    --ds-text-point: #f6464c;
    --ds-text-error: #f33b54;
    --ds-font-brand: Pretendard, Noto Sans CJK KR, Roboto;
    --ds-font-pretendard: Pretendard;
    --ds-font-noto: Noto Sans CJK KR;
    --ds-font-roboto: Roboto;
    --ds-font-gmarket: Gmarket Sans;
}

@font-face {
    font-family: "SUIT Variable";
    font-weight: 100 900;
    font-display: swap;
    src: url(../fonts/SUIT-Variable.woff2) format("woff2-variations")
}

@font-face {
    font-family: "Noto Sans CJK KR";
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url(../fonts/NotoSansKR-Light.woff2) format("woff2"),url(../fonts/NotoSansKR-Light.woff) format("woff")
}

@font-face {
    font-family: "Noto Sans CJK KR";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/NotoSansKR-Regular.woff2) format("woff2"),url(../fonts/NotoSansKR-Regular.woff) format("woff")
}

@font-face {
    font-family: "Noto Sans CJK KR";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/NotoSansKR-Medium.woff2) format("woff2"),url(../fonts/NotoSansKR-Medium.woff) format("woff")
}

@font-face {
    font-family: "Noto Sans CJK KR";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url(../fonts/NotoSansKR-Bold.woff2) format("woff2"),url(../fonts/NotoSansKR-Bold.woff) format("woff")
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 100;
    font-display: swap;
    src: url(../fonts/Roboto-Light.woff2) format("woff2"),url(../fonts/Roboto-Light.woff) format("woff")
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url(../fonts/Roboto-Regular.woff2) format("woff2"),url(../fonts/Roboto-Regular.woff) format("woff")
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/Roboto-Medium.woff2) format("woff2"),url(../fonts/Roboto-Medium.woff) format("woff")
}

@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url(../fonts/Roboto-Bold.woff2) format("woff2"),url(../fonts/Roboto-Bold.woff) format("woff")
}

@font-face {
    font-family: "Pretendard Variable";
    font-weight: 45 920;
    font-style: normal;
    font-display: swap;
    src: url(../fonts/PretendardVariable.woff2) format("woff2-variations")
}


@font-face {
    font-family: 'Gmarket Sans';
    src: url('../fonts/GmarketSansLight.woff2') format('woff2'),
        url('../fonts/GmarketSansLight.woff') format('woff'),
        url('../fonts/GmarketSansLight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gmarket Sans';
    src: url('../fonts/GmarketSansMedium.woff2') format('woff2'),
        url('../fonts/GmarketSansMedium.woff') format('woff'),
        url('../fonts/GmarketSansMedium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gmarket Sans';
    src: url('../fonts/GmarketSansBold.woff2') format('woff2'),
        url('../fonts/GmarketSansBold.woff') format('woff'),
        url('../fonts/GmarketSansBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
@keyframes banner-move {
    0% {
        transform: translateX(0)
    }

    to {
        transform: translateX(-100%)
    }
}

@keyframes fade-up {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes ctaAnimation {
  0% {
    background-position: 0 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0 50%;
  }
}

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
    font-size: 62.5%;
    color: #0b0d11
}

body,p {
    margin: 0
}

details,main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

code,kbd,pre,samp {
    font-family: monospace,monospace;
    font-size: 1em
}

a {
    background-color: transparent;
    color: initial;
    text-decoration: none;
    cursor: pointer
}

abbr[title] {
    border-bottom: none;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

sub,sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none;
    vertical-align: middle;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none
}

button,input,optgroup,select,textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,input {
    overflow: visible
}

button,select {
    text-transform: none
}

[type=button],[type=reset],[type=submit],button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    color: inherit;
    display: table;
    max-width: 100%;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],[type=radio],legend {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

[hidden],template {
    display: none
}

[data-aos=fade-up] {
    transform: translate3d(0,48px,0)
}

* {
    margin: 0;
    padding: 0;
    font-family: "Pretendard",Avenir,Helvetica,Arial,sans-serif;
    font-weight: 500;
    box-sizing: border-box;
    word-break: keep-all
}

body,html {
    width: 100%;
    height: 100%;
    letter-spacing: -0.02em;
}

body:is(.popup) {
    overflow: hidden
}

li,ol,ul {
    list-style: none
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

em {
    font-style: initial;
    text-decoration: none
}

input,select,textarea {
    vertical-align: middle;
    resize: none;
    outline: 0
}

button {
    border: 0;
    cursor: pointer;
    outline: 0;
    background: 0 0
}

.disabled,[disabled] {
    opacity: 1!important
}

input {
    /* -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0 */
}

input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
    /* -webkit-appearance: none;
    appearance: none */
}

select {
    /* -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none */
}

h1,h2,h3,h4,h5,h6 {
    font-weight: 700
}

.blind {
    position: absolute;
    clip: rect(0 0 0 0);
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden
}

.text-img {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden
}

.only-desktop {
    display: none!important
}

@media only screen and (min-width: 768px) {
    .only-desktop {
        display:none!important
    }
}

@media only screen and (min-width: 1025px) {
    .only-desktop {
        display:block!important
    }
}

.only-tablet {
    display: none!important
}

@media only screen and (min-width: 768px) {
    .only-tablet {
        display:block!important
    }
}

.only-mobile {
    display: block!important
}

@media only screen and (min-width: 768px) {
    .only-mobile {
        display:none!important
    }
}

@media only screen and (min-width: 1025px) {
    .only-mobile {
        display:none!important
    }
}

.only-mobile-tablet {
    display: block!important
}

@media only screen and (min-width: 768px) {
    .only-mobile-tablet {
        display:block!important
    }
}

@media only screen and (min-width: 1025px) {
    .only-mobile-tablet {
        display:none!important
    }
}

.only-tablet-desktop {
    display: none!important
}

@media only screen and (min-width: 768px) {
    .only-tablet-desktop {
        display:block!important
    }
}

@media only screen and (min-width: 1025px) {
    .only-tablet-desktop {
        display:block!important
    }
}

.font-display--large {
    font-size: 4.4rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .font-display--large {
        font-size:6.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-display--large {
        font-size:8rem
    }
}

.font-display--large {
    letter-spacing: 0
}

.font-display--medium {
    font-size: 3.4rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .font-display--medium {
        font-size:5.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-display--medium {
        font-size:6.6rem
    }
}

.font-display--medium {
    letter-spacing: 0
}

.font-display--small {
    font-size: 2.6rem;
    line-height: 136%
}

@media only screen and (min-width: 768px) {
    .font-display--small {
        font-size:3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-display--small {
        font-size:4.8rem
    }
}

.font-display--small {
    letter-spacing: 0
}

.font-header--large {
    font-size: 2.6rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .font-header--large {
        font-size:3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-header--large {
        font-size:3.8rem
    }
}

.font-header--large {
    letter-spacing: 0
}

.font-header--medium {
    font-size: 2rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .font-header--medium {
        font-size:2.4rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-header--medium {
        font-size:3rem
    }
}

.font-header--medium {
    letter-spacing: 0
}

.font-header--small {
    font-size: 1.8rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .font-header--small {
        font-size:2rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-header--small {
        font-size:2.4rem
    }
}

.font-header--small {
    letter-spacing: 0
}

.font-header--xsmall {
    font-size: 1.5rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .font-header--xsmall {
        font-size:1.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-header--xsmall {
        font-size:2.2rem
    }
}

.font-header--xsmall {
    letter-spacing: 0
}

.font-body--large {
    font-size: 1.7rem;
    line-height: 168%
}

@media only screen and (min-width: 768px) {
    .font-body--large {
        font-size:2rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-body--large {
        font-size:2.4rem
    }
}

.font-body--large {
    letter-spacing: 0
}

.font-body--medium {
    font-size: 1.5rem;
    line-height: 168%
}

@media only screen and (min-width: 768px) {
    .font-body--medium {
        font-size:1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-body--medium {
        font-size:2rem
    }
}

.font-body--medium {
    letter-spacing: 0
}

.font-body--small {
    font-size: 1.4rem;
    line-height: 160%
}

@media only screen and (min-width: 768px) {
    .font-body--small {
        font-size:1.5rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-body--small {
        font-size:1.8rem
    }
}

.font-body--small {
    letter-spacing: 0
}

.font-body--xsmall {
    font-size: 1.3rem;
    line-height: 160%
}

@media only screen and (min-width: 768px) {
    .font-body--xsmall {
        font-size:1.4rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-body--xsmall {
        font-size:1.4rem
    }
}

.font-body--xsmall {
    letter-spacing: 0
}

.font-action--large {
    font-size: 1.8rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .font-action--large {
        font-size:2rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-action--large {
        font-size:2.2rem
    }
}

.font-action--large {
    letter-spacing: 0
}

.font-action--medium {
    font-size: 1.6rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .font-action--medium {
        font-size:1.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-action--medium {
        font-size:2rem
    }
}

.font-action--medium {
    letter-spacing: 0
}

.font-action--small {
    font-size: 1.3rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .font-action--small {
        font-size:1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .font-action--small {
        font-size:1.8rem
    }
}

.font-action--small {
    letter-spacing: 0
}

.font-weight--black {
    font-weight: 800
}

.font-weight--bold {
    font-weight: 700
}

.font-weight--default {
    font-weight: 500
}

.font-weight--light {
    font-weight: 400
}

.background-border {
    background: #dce1e5!important
}

.background-primary {
    background: #0b0d11!important
}

.background-secondary {
    background: #394046!important
}

.background-tertiary {
    background: #6a747c!important
}

.background-lowest {
    background: #8c98a1!important
}

.background-disabled {
    background: rgba(11,13,17,.12)!important
}

.background-invert {
    background: #fff!important
}

.background-default {
    background: #eaedf0!important
}

.background-brand {
    background: #4169e1!important
}

.background-brand-light {
    background: #e7edff!important
}

.background-brand-dark {
    background: #1e357c!important
}

.background-point {
    background: #f6464c!important
}

.background-dimmed {
    background: rgba(11,13,17,.4)!important
}

.background-overlay {
    background: rgba(255,255,255,.8)!important
}

.font-primary {
    color: #0b0d11!important
}

.font-secondary {
    color: #394046!important
}

.font-tertiary {
    color: #6a747c!important
}

.font-lowest {
    color: #8c98a1!important
}

.font-disabled {
    color: rgba(11,13,17,.24)!important
}

.font-invert {
    color: #fff!important
}

.font-brand {
    color: #4169e1!important
}

.font-brand-light {
    color: #e7edff!important
}

.font-brand-dark {
    color: #1e357c!important
}

.font-point {
    color: #f6464c!important
}

.font-error {
    color: #f33b54!important
}

.align-left {
    text-align: left!important
}

.align-center {
    text-align: center!important
}

.align-right {
    text-align: right!important
}

.template-radius--1 {
    border-radius: 24px
}

@media only screen and (min-width: 768px) {
    .template-radius--1 {
        border-radius:36px
    }
}

@media only screen and (min-width: 1025px) {
    .template-radius--1 {
        border-radius:60px
    }
}

.template-radius--2 {
    border-radius: 24px
}

@media only screen and (min-width: 768px) {
    .template-radius--2 {
        border-radius:32px
    }
}

@media only screen and (min-width: 1025px) {
    .template-radius--2 {
        border-radius:40px
    }
}

.template-radius--3 {
    border-radius: 20px
}

@media only screen and (min-width: 768px) {
    .template-radius--3 {
        border-radius:24px
    }
}

@media only screen and (min-width: 1025px) {
    .template-radius--3 {
        border-radius:32px
    }
}

.template-radius--4 {
    border-radius: 14px
}

@media only screen and (min-width: 768px) {
    .template-radius--4 {
        border-radius:16px
    }
}

@media only screen and (min-width: 1025px) {
    .template-radius--4 {
        border-radius:20px
    }
}

.template-radius--5 {
    border-radius: 8px
}

@media only screen and (min-width: 768px) {
    .template-radius--5 {
        border-radius:12px
    }
}

@media only screen and (min-width: 1025px) {
    .template-radius--5 {
        border-radius:16px
    }
}

.template-radius--999 {
    border-radius: 999px
}

.ico-btn {
    display: block;
    padding: .4rem
}

.ico-btn__box {
    display: flex;
    justify-content: center;
    align-items: center
}

.ico-btn__effect {
    border-radius: 999px
}

.ico-btn__effect:hover {
    background: rgba(11,13,17,.08)
}

.ico-btn__effect:focus {
    background: rgba(11,13,17,.12)
}

.ico-btn__effect.active,.ico-btn__effect:active {
    background: rgba(11,13,17,.24)
}

.ico-btn__effect.disabled,.ico-btn__effect:disabled {
    opacity: .24
}

.ico-btn__nav-close::before,.ico-btn__nav-menu::before {
    background-image: url(../images/common/ico-nav-menu.svg);
    background-size: contain;
    background-repeat: no-repeat
}

.ico-btn__nav-close::before {
    background-image: url(../images/common/ico-nav-close.svg)
}

.header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    padding: .4rem 2.4rem;
    z-index: 1000
}

@media only screen and (min-width: 768px) {
    .header {
        padding:.6rem 3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .header {
        padding:.8rem 4.8rem
    }
}

.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center
}

@media only screen and (min-width: 1025px) {
    .header-inner {
        max-width:140rem;
        margin: 0 auto
    }
}

.header-logo {
    display: flex;
    align-items: center;
    padding: .5rem;
}
.header-logo .no-scroll-logo-img {
    display: block;
}
.header:is(.scroll) .header-logo .no-scroll-logo-img {
    display: none;
}
.header-logo .scroll-logo-img {
    display: none;
}
.header:is(.scroll) .header-logo .scroll-logo-img {
    display: block;
}

.header-menu__btn .ico-btn__nav-menu::before,.layer-wrap .layer-popup__header .ico-btn__nav-close::before,.mobile-menu__header .header-button .ico-btn__nav-close::before {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px
}

.header-menu__list>ul {
    display: flex;
    align-items: center;
    gap: 4.8rem
}

.header-menu__list>ul>li .list-menu {
    padding: .4rem .8rem;
    border-radius: 8px;
    color: #394046;
    font-size: 1.3rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .header-menu__list>ul>li .list-menu {
        font-size:1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .header-menu__list>ul>li .list-menu {
        font-size:1.8rem
    }
}

.header-menu__list>ul>li .list-menu {
    letter-spacing: 0
}

.header-menu__list>ul>li .list-menu:hover {
    color: #4169e1
}

.header-menu__list>ul>li .list-menu:focus {
    color: #4169e1;
    font-weight: 700
}

.header-menu__list>ul>li .list-menu.active,.header-menu__list>ul>li .list-menu:active {
    background: rgba(65,105,225,.12);
    color: #4169e1;
    font-weight: 700
}

.header-menu__list>ul>li .list-menu.disabled,.header-menu__list>ul>li .list-menu:disabled {
    color: rgba(11,13,17,.24);
    cursor: default
}

.header:is(.scroll) {
    background: rgba(255,255,255,.8);
    backdrop-filter: blur(12px)
}

.mobile-menu {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg,#fff 40%,rgba(255,255,255,0) 100%);
    backdrop-filter: blur(8px);
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 1500
}

@media only screen and (min-width: 1025px) {
    .mobile-menu {
        display:none!important
    }
}

.mobile-menu:is(.show) {
    display: block
}

.mobile-menu__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .4rem 2.4rem
}

@media only screen and (min-width: 768px) {
    .mobile-menu__header {
        padding:.6rem 3.2rem
    }
}

.mobile-menu__list {
    position: relative;
    padding: 3.6rem 4.8rem 1.6rem
}

@media only screen and (min-width: 768px) {
    .mobile-menu__list {
        padding-top:5.2rem
    }
}

.mobile-menu__list>ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2.6rem
}

@media only screen and (min-width: 768px) {
    .mobile-menu__list>ul {
        gap:3.2rem
    }
}

.mobile-menu__list>ul>li .list-menu {
    display: inline-block;
    min-width: 12rem;
    padding: .8rem 1.2rem;
    border-radius: 8px;
    color: #394046;
    text-align: center;
    font-size: 1.8rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .mobile-menu__list>ul>li .list-menu {
        font-size:2rem
    }
}

@media only screen and (min-width: 1025px) {
    .mobile-menu__list>ul>li .list-menu {
        font-size:2.2rem
    }
}

.mobile-menu__list>ul>li .list-menu {
    letter-spacing: 0
}

.mobile-menu__list>ul>li .list-menu:hover {
    color: #4169e1
}

.mobile-menu__list>ul>li .list-menu:focus {
    color: #4169e1;
    font-weight: 700
}

.mobile-menu__list>ul>li .list-menu.active,.mobile-menu__list>ul>li .list-menu:active {
    background: rgba(65,105,225,.12);
    color: #4169e1;
    font-weight: 700
}

.mobile-menu__list>ul>li .list-menu.disabled,.mobile-menu__list>ul>li .list-menu:disabled {
    color: rgba(11,13,17,.24);
    cursor: default
}

.footer {
    position: relative;
    background: #fff;
    border-top: 1px solid #DDE1E4;
    padding: 4rem 2rem 12rem;
    font-weight: 600
}

.footer * {
    font-weight: inherit
}

.footer-inner {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    position: relative;
    overflow: hidden
}

@media only screen and (min-width: 1025px) {
    .footer-inner {
        gap:0;
        max-width: 140rem;
        margin: 0 auto;
        padding-right: 26.4rem
    }
}

.footer .menu-list {
    display: flex;
    align-items: center;
    gap: 20px
}

.footer .menu-list a {
    font-size: 1.4rem;
    line-height: 140%;
    letter-spacing: 0;
    color: #8b919c;
    font-weight: inherit
}

@media only screen and (min-width: 1025px) {
    .footer .menu-list a {
        font-size:1.6rem;
        line-height: 140%;
        letter-spacing: 0
    }
}

.footer .menu-list b,.footer .menu-list strong {
    font-size: 1.6rem;
    line-height: 140%;
    letter-spacing: 0;
    color: #3c4047;
    font-weight: 800
}

@media only screen and (min-width: 1025px) {
    .footer .customer-center {
        position:absolute;
        top: 0;
        right: 0;
        width: 26.4rem
    }
}

.footer .customer-center__tel,.footer .customer-center__title {
    font-size: 1.6rem;
    line-height: 176%;
    letter-spacing: 0;
    color: #394046
}

.footer .customer-center__tel {
    margin-top: .4rem;
    font-size: 1.8rem;
    line-height: 140%;
    font-weight: 800
}

@media only screen and (min-width: 1025px) {
    .footer .customer-center__tel {
        margin-top:0;
        font-size: 2rem;
        line-height: 140%;
        letter-spacing: 0
    }
}

.footer .customer-center__operating-hours {
    font-size: 1.4rem;
    line-height: 160%;
    letter-spacing: 0;
    color: #6a747c
}

@media only screen and (min-width: 1025px) {
    .footer .company-info {
        display:flex;
        align-items: center;
        margin-top: 4.8rem
    }
}

.footer .company-info__logo {
    width: 120px;
    height: 44px;
    padding: .2rem;
    background-image: url(../images/common/ico-daekyo.svg);
    background-size: 120px 44px;
    background-repeat: no-repeat
}

@media only screen and (min-width: 1025px) {
    .footer .company-info__logo {
        flex-shrink:0;
        width: 152px;
        height: 56px;
        background-size: 152px 56px;
        background-repeat: no-repeat
    }
}

.footer .company-info__content {
    margin-top: 2rem
}

@media only screen and (min-width: 1025px) {
    .footer .company-info__content {
        margin-top:0;
        margin-left: 2.4rem
    }
}

.footer .company-info__content .info-name {
    display: flex;
    align-items: center;
    font-size: 1.2rem;
    line-height: 140%;
    letter-spacing: 0;
    color: #0b0d11;
    cursor: pointer
}

@media only screen and (min-width: 1025px) {
    .footer .company-info__content .info-name {
        font-size:1.4rem;
        line-height: 140%;
        letter-spacing: 0;
        cursor: initial
    }
}

.footer .company-info__content .info-name__title {
    font-weight: 800
}

.footer .company-info__content .info-name svg {
    transform: rotate(180deg)
}

@media only screen and (min-width: 1025px) {
    .footer .company-info__content .info-name svg {
        display:none
    }
}

.footer .company-info__content .info-name:is(.active) svg {
    transform: rotate(0)
}

.footer .company-info__content .info-address {
    display: none;
    font-size: 1.2rem;
    line-height: 140%;
    letter-spacing: 0;
    color: #6a747c
}

@media only screen and (min-width: 1025px) {
    .footer .company-info__content .info-address {
        font-size:1.4rem;
        line-height: 140%;
        letter-spacing: 0;
        display: block
    }
}

.footer .company-info__content .info-address__info {
    margin-top: .2rem
}

.footer .company-info__content .info-address__info:first-child {
    margin-top: .4rem
}

@media only screen and (min-width: 1025px) {
    .footer .company-info__content .info-address__info:first-child {
        margin-top:.8rem
    }
}

.footer .copyright {
    font-size: 1.2rem;
    line-height: 140%;
    letter-spacing: 0;
    font-weight: 400;
    color: #6a747c
}

@media only screen and (min-width: 1025px) {
    .footer .copyright {
        margin-top:4rem
    }
}
.container {
    overflow-x: hidden;
}
.section {
    position: relative
}

.section .card-list__type1>ul>li,.section img {
    width: 100%
}

.section-group {
    padding-top: 3.2rem
}

@media only screen and (min-width: 768px) {
    .section-group {
        padding-top:0
    }
}

.section-padding {
    padding: 3.2rem 2.4rem
}

@media only screen and (min-width: 768px) {
    .section-padding {
        padding:6rem 3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section-padding {
        padding:8.4rem 4.8rem 10rem;
    }

    .section-inner {
        max-width: 128rem;
        margin: 0 auto
    }

    .section-inner:is(.type2) {
        max-width: 88rem
    }
}

.section .section-header {
    padding: 3.2rem 0;
    text-align: center
}

@media only screen and (min-width: 768px) {
    .section .section-header {
        padding:3.8rem 0
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header {
        padding:4.8rem 0
    }
}

.section .section-header__title {
    font-size: 2.4rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .section .section-header__title {
        font-size:3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header__title {
        font-size:3.8rem
    }
}

.section .section-header__title {
    letter-spacing: 0;
    font-weight: 700
}

.section .section-header__title * {
    font-weight: inherit
}

.section .section-header__sub {
    padding-bottom: .6rem;
    font-size: 1.5rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .section .section-header__sub {
        font-size:1.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header__sub {
        font-size:2.2rem
    }
}

.section .section-header__sub {
    letter-spacing: 0;
    font-weight: 700;
    color: #1e357c
}

.section .section-header__sub * {
    font-weight: inherit
}

@media only screen and (min-width: 768px) {
    .section .section-header__sub {
        padding-bottom:.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header__sub {
        padding-top:1.2rem
    }
}

.section .section-header__desc {
    padding-top: 1rem;
    font-size: 1.5rem;
    line-height: 168%;
    color: #394046;
}

@media only screen and (min-width: 768px) {
    .section .section-header__desc {
        font-size: 1.6rem;
        padding-top: 1.6rem;
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header__desc {
        font-size:2rem
    }
}
.section .section-header__button {
    margin-top: 2.4rem;
    text-align: center
}

@media only screen and (min-width: 768px) {
    .section .section-header__button {
        margin-top:3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header__button {
        margin-top:4rem
    }
}

.section .section-header__button .btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    margin: 0 auto;
    padding: .8rem 1.6rem;
    text-align: center;
    border-radius: 8px;
    background: #fff
}

@media only screen and (min-width: 768px) {
    .section .section-header__button .btn {
        width:140px;
        padding: 1rem 2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header__button .btn {
        width:180px;
        padding: 1.2rem 2.4rem
    }
}

.section .section-header__button .btn * {
    font-size: 1.3rem;
    line-height: 144%
}

@media only screen and (min-width: 768px) {
    .section .section-header__button .btn * {
        font-size:1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-header__button .btn * {
        font-size:1.8rem
    }
}

.section .section-header__button .btn * {
    letter-spacing: 0;
    color: #fff
}

.section .section-img {
    overflow: hidden
}

.section .section-img img {
    height: 360px;
    -o-object-fit: cover;
    object-fit: cover
}

@media only screen and (min-width: 768px) {
    .section .section-img img {
        height:396px;
        -o-object-fit: contain;
        object-fit: contain
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-img img {
        height:720px;
        -o-object-fit: cover;
        object-fit: cover
    }
}

.section .section-img__radius {
    background: #fff;
    border: 1px solid #dce1e5;
    border-radius: 24px
}

@media only screen and (min-width: 768px) {
    .section .section-img__radius {
        border-radius:36px
    }
}

@media only screen and (min-width: 1025px) {
    .section .section-img__radius {
        border-radius:60px
    }
}

.section .slogan-inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1.2rem;
    padding: .8rem 0 1.2rem;
    color: #fff
}

@media only screen and (min-width: 768px) {
    .section .slogan-inner {
        gap:1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .slogan-inner {
        gap:2rem;
        padding: 1.6rem 0 2rem
    }
}

.section .slogan-inner.align-left {
    justify-content: flex-start;
    align-items: flex-start
}

.section .slogan-inner.align-center {
    justify-content: center;
    align-items: center
}

.section .slogan-inner.align-right {
    justify-content: flex-end;
    align-items: flex-end
}

.section .slogan .slogan-title {
    width: 100%;
    font-size: 2.6rem;
    line-height: 136%
}

@media only screen and (min-width: 768px) {
    .section .slogan .slogan-title {
        font-size:3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .slogan .slogan-title {
        font-size:4.8rem
    }
}

.section .slogan .slogan-title {
    letter-spacing: 0;
    font-weight: 700
}

.section .slogan .slogan-title>* {
    font-weight: inherit
}

.section .slogan .slogan-desc {
    width: 100%;
    font-size: 1.7rem;
    line-height: 168%
}

@media only screen and (min-width: 768px) {
    .section .slogan .slogan-desc {
        font-size:2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .slogan .slogan-desc {
        font-size:2.4rem
    }
}

.section .slogan .slogan-desc {
    letter-spacing: 0;
    font-weight: 400
}

.section .slogan .slogan-desc>* {
    font-weight: inherit
}

.section .box-list>ul {
    display: flex;
    flex-direction: column;
    gap: 2rem
}

@media only screen and (min-width: 768px) {
    .section .box-list>ul {
        gap:2.4rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .box-list>ul {
        flex-direction:row;
        gap: 3.2rem
    }
}

.section .box-list .box-group {
    display: flex;
    height: 100%;
    padding: 1.2rem;
    align-items: center;
    gap: 1.6rem;
    background: #fff;
    box-shadow: 0 8px 16px 0 rgba(11,13,17,.08);
    border-radius: 20px
}

@media only screen and (min-width: 768px) {
    .section .box-list .box-group {
        border-radius:24px
    }
}

@media only screen and (min-width: 1025px) {
    .section .box-list .box-group {
        border-radius:32px
    }
}

@media only screen and (min-width: 768px) {
    .section .box-list .box-group {
        padding:1.6rem;
        gap: 2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .box-list .box-group {
        flex:1;
        padding: 2rem;
        gap: 2.4rem
    }
}

.section .box-list__image {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    overflow: hidden;
    border-radius: 14px
}

@media only screen and (min-width: 768px) {
    .section .box-list__image {
        border-radius:16px
    }
}

@media only screen and (min-width: 1025px) {
    .section .box-list__image {
        border-radius:20px
    }
}

.section .box-list__image img {
    width: 72px;
    height: 72px
}

@media only screen and (min-width: 768px) {
    .section .box-list__image,.section .box-list__image img {
        width:108px;
        height: 108px
    }
}

@media only screen and (min-width: 1025px) {
    .section .box-list__image,.section .box-list__image img {
        width:120px;
        height: 120px
    }
}

.section .box-list__text {
    flex: 1
}

.section .box-list__text .text-title,.section .card-list__type3 .card-box__text .text-title {
    font-size: 1.5rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .section .box-list__text .text-title {
        font-size:1.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .box-list__text .text-title {
        font-size:2.2rem
    }
}

.section .box-list__text .text-title {
    letter-spacing: 0
}

.section .box-list__text .text-desc {
    padding-top: .4rem;
    font-size: 1.4rem;
    line-height: 160%
}

@media only screen and (min-width: 768px) {
    .section .box-list__text .text-desc {
        font-size:1.5rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .box-list__text .text-desc {
        font-size:1.8rem
    }
}

.section .box-list__text .text-desc {
    letter-spacing: 0;
    color: #6a747c
}

@media only screen and (min-width: 768px) {
    .section .box-list__text .text-desc {
        padding-top:.6rem
    }
}

.section .banner-wrap {
    position: relative;
    margin: 0 -2.4rem
}

@media only screen and (min-width: 768px) {
    .section .banner-wrap {
        margin:0 -3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .banner-wrap {
        margin:0 -4.8rem
    }
}

.section .card-list__type1>ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    padding: 1.6rem 0
}

@media only screen and (min-width: 768px) {
    .section .card-list__type1>ul {
        flex-direction:row;
        flex-wrap: wrap;
        gap: 0;
        margin: -1.2rem;
        padding: 2rem 0;
        justify-content: flex-start;
        align-items: flex-start;
        align-content: flex-start
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type1>ul {
        flex-wrap:nowrap;
        gap: 3.2rem;
        margin: 0;
        padding: 3.2rem 0
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type1>ul>li {
        width:50%;
        padding: 1.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type1>ul>li {
        flex:1;
        width: 100%;
        padding: 0
    }
}

.section .card-list__type1 .card-list__box {
    display: block;
    position: relative;
    width: 100%;
    height: 168px;
    padding: 2.6rem;
    background: #fff;
    overflow: hidden;
    border-radius: 24px
}

@media only screen and (min-width: 768px) {
    .section .card-list__type1 .card-list__box {
        border-radius:32px
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type1 .card-list__box {
        border-radius:40px
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type1 .card-list__box {
        height:280px;
        padding: 3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type1 .card-list__box {
        height:388px;
        padding: 4rem
    }
}

.section .card-list__type1 .card-list__text {
    position: relative;
    z-index: 5;
    font-size: 1.8rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .section .card-list__type1 .card-list__text {
        font-size:2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type1 .card-list__text {
        font-size:2.4rem
    }
}

.section .card-list__type1 .card-list__text {
    letter-spacing: 0
}

.section .card-list__type1 .card-list__image {
    position: absolute;
    bottom: 0;
    right: 0
}

.section .card-list__type1 .card-list__image img {
    width: 168px;
    height: 168px;
    -o-object-fit: contain;
    object-fit: contain
}

@media only screen and (min-width: 768px) {
    .section .card-list__type1 .card-list__image img {
        width:280px;
        height: 280px
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type1 .card-list__image img {
        width:388px;
        height: 388px
    }
}

.section .card-list__type2,.section .card-list__type4 {
    padding: 1.6rem 0
}

.section .card-list__type2>ul {
    display: flex;
    flex-direction: column;
    gap: 3.2rem
}

@media only screen and (min-width: 768px) {
    .section .card-list__type2>ul {
        flex-direction:row;
        flex-wrap: wrap;
        gap: 0;
        margin: -1.6rem;
        padding: 2rem 0;
        justify-content: flex-start;
        align-items: flex-start;
        align-content: flex-start
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type2>ul {
        flex-wrap:nowrap;
        gap: 3.2rem;
        margin: 0;
        padding: 2.4rem 0
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type2>ul>li {
        width:50%;
        padding: 1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type2>ul>li {
        flex:1;
        width: 100%;
        padding: 0
    }
}

.section .card-list__type2 .card-box__label {
    padding: 1.6rem 0;
    font-size: 1.5rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .section .card-list__type2 .card-box__label {
        font-size:1.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type2 .card-box__label {
        font-size:2.2rem
    }
}

.section .card-list__type2 .card-box__label {
    letter-spacing: 0;
    font-weight: 700;
    text-align: center
}

@media only screen and (min-width: 768px) {
    .section .card-list__type2 .card-box__label {
        padding:2rem 0
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type2 .card-box__label {
        padding:2.4rem 0
    }
}

.section .card-list__type3>ul {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 3.2rem
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3>ul {
        flex-direction:row;
        flex-wrap: wrap;
        gap: 0;
        margin: -1.6rem;
        justify-content: flex-start;
        align-items: flex-start;
        align-content: flex-start
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type3>ul {
        flex-wrap:nowrap;
        gap: 3.2rem;
        margin: 0;
        padding: 2.4rem 0
    }
}

.section .card-list__type3>ul>li {
    width: 100%
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3>ul>li {
        width:50%;
        padding: 1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type3>ul>li {
        flex:1;
        width: 100%;
        padding: 0
    }
}

.section .card-list__type3 .card-box {
    display: flex;
    flex-direction: column;
    width: 100%;
    background: #fff;
    overflow: hidden;
    border-radius: 20px
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3 .card-box {
        border-radius:24px
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type3 .card-box {
        border-radius:32px
    }
}

.section .card-list__type3 .card-box__image img {
    height: 192px;
    -o-object-fit: contain;
    object-fit: contain
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3 .card-box__image img {
        height:224px
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type3 .card-box__image img {
        height:324px
    }
}

.section .card-list__type3 .card-box__text {
    padding: 2rem 2rem 2.6rem
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3 .card-box__text {
        height:139px;
        padding: 2.4rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type3 .card-box__text {
        height:175px;
        padding: 3.2rem
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3 .card-box__text .text-title {
        font-size:1.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type3 .card-box__text .text-title {
        font-size:2.2rem
    }
}

.section .card-list__type3 .card-box__text .text-title {
    letter-spacing: 0;
    font-weight: 700
}

.section .card-list__type3 .card-box__text .text-desc {
    padding-top: .6rem;
    font-size: 1.4rem;
    line-height: 160%
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3 .card-box__text .text-desc {
        font-size:1.5rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type3 .card-box__text .text-desc {
        font-size:1.8rem
    }
}

.section .card-list__type3 .card-box__text .text-desc {
    letter-spacing: 0;
    color: #394046
}

@media only screen and (min-width: 768px) {
    .section .card-list__type3 .card-box__text .text-desc {
        -webkit-box-orient:vertical;
        display: block;
        display: -webkit-box;
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-all;
        -webkit-line-clamp: 2;
        padding-top: 1.2rem
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 {
        padding:2.4rem 0
    }
}

.section .card-list__type4>ul {
    display: flex;
    flex-direction: column;
    gap: 3.6rem
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4>ul {
        gap:5.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4>ul {
        gap:6.4rem
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box {
        display:flex;
        align-items: center;
        gap: 3.8rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box {
        gap:4.8rem
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__reverse {
        flex-direction:row-reverse
    }
}

.section .card-list__type4 .card-box__img {
    overflow: hidden;
    border-radius: 20px
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__img {
        border-radius:24px
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box__img {
        border-radius:32px
    }
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__img {
        flex:none
    }
}

.section .card-list__type4 .card-box__img img {
    height: 260px;
    -o-object-fit: contain;
    object-fit: contain
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__img img {
        width:268px;
        height: 223px
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box__img img {
        width:360px;
        height: 300px
    }
}

.section .card-list__type4 .card-box__text {
    margin-top: 2.6rem
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text {
        flex:1;
        margin-top: 0
    }
}

.section .card-list__type4 .card-box__text .text-sub {
    font-size: 1.8rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text .text-sub {
        font-size:2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box__text .text-sub {
        font-size:2.4rem
    }
}

.section .card-list__type4 .card-box__text .text-sub {
    letter-spacing: 0;
    font-weight: 700
}

.section .card-list__type4 .card-box__text .text-title {
    padding-top: .4rem;
    font-size: 2rem;
    line-height: 152%
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text .text-title {
        font-size:2.4rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box__text .text-title {
        font-size:3rem
    }
}

.section .card-list__type4 .card-box__text .text-title {
    letter-spacing: 0;
    font-weight: 700
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text .text-title {
        padding-top:.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box__text .text-title {
        padding-top:.8rem
    }
}

.section .card-list__type4 .card-box__text .text-list {
    padding-top: .4rem;
    text-align: left
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text .text-list {
        padding-top:1.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box__text .text-list {
        padding-top:1.6rem
    }
}

.section .card-list__type4 .card-box__text .text-list>ul {
    display: flex;
    flex-direction: column;
    gap: .4rem
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text .text-list>ul {
        gap:.6rem
    }
}

.section .card-list__type4 .card-box__text .text-list>ul li {
    position: relative;
    padding-left: 1rem;
    font-size: 1.5rem;
    line-height: 168%
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text .text-list>ul li {
        font-size:1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .section .card-list__type4 .card-box__text .text-list>ul li {
        font-size:2rem
    }
}

.section .card-list__type4 .card-box__text .text-list>ul li {
    letter-spacing: 0;
    color: #394046
}

@media only screen and (min-width: 768px) {
    .section .card-list__type4 .card-box__text .text-list>ul li {
        padding-left:1.2rem
    }
}

.section .card-list__type4 .card-box__text .text-list>ul li:before {
    position: absolute;
    top: 10px;
    left: 0;
    background: #394046;
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 999px
}

.section-main {
    padding-top: 7.6rem;
    background-image: url(../images/page/img-main_mo-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center; /* 260212 개인정보동의 항목 내용 수정 */
}

@media only screen and (min-width: 768px) {
    .section-main {
        padding-top:8.8rem;
        background-image: url(../images/page/img-main_tablet-bg.png);
        background-size: cover;
        background-repeat: no-repeat;   
    }
}

@media only screen and (min-width: 1025px) {
    .section-main {
        padding-top:11.2rem;
        background-image: url(../images/page/img-main_pc-bg.png);
        background-size: cover;
        background-repeat: no-repeat;        
    }
}

.section-main .vision-group {
    position: relative
}

.section-main .vision-group__top {
    display: flex;
    padding: 0 3.8rem 2.6rem
}

@media only screen and (min-width: 768px) {
    .section-main .vision-group__top {
        padding:0 3.8rem 0;
    }
}

.section-main .vision-group__top svg {
    width: 28.4rem;
    height: 5.8rem;
    margin: 0 auto;
    padding: .4rem 0 .8rem
}

@media only screen and (min-width: 768px) {
    .section-main .vision-group__top svg {
        width:31.4rem;
        height: auto;
    }
}

@media only screen and (min-width: 1025px) {
    .section-main .vision-group__center {
        max-width:1852px;
        margin: 0 auto
    }
}

.section-main .vision-group__center img {
    height: auto;
    -o-object-fit: cover;
    object-fit: cover
}

@media only screen and (min-width: 768px) {
    .section-main .vision-group__center img {
        margin-top: -3.4rem;
    }
}

@media only screen and (min-width: 1025px) {
    .section-main .vision-group__center img {
        height:640px;
    }
}

.section-main .vision-group__bottom {
    display: block;
    position: absolute;
    bottom: -1px;
    width: 100%;
    overflow: hidden
}

.section-main .vision-group__bottom .bottom-group {
    display: flex;
    height: 30px
}

.section-main .vision-group__bottom .bottom-group__background {
    height: 30px;
    flex: 1 0 0
}

.section-main .vision-group__bottom .bottom-group__point {
    width: 76px;
    height: 30px;
    flex-shrink: 0
}

.section-main .vision-group__bottom .bottom-group__point:nth-child(2) svg {
    margin-left: -2px
}

.section-main .vision-group__bottom .bottom-group__point:nth-child(3) svg {
    margin-right: -2px
}

.layer-wrap,.layer-wrap .layer-popup {
    display: none;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.layer-wrap {
    position: fixed;
    background: rgba(11,13,17,.4);
    z-index: 2000;
    overflow-y: auto;
    overflow-x: hidden
}
/* 
.layer-wrap__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    padding: 0;
    flex-direction: column;
    gap: 20px 0;
}
@media only screen and (min-width: 1025px) {
    .layer-wrap__inner {
        padding: 80px 0;
    }
}
.layer-wrap .layer-popup {
    position: initial;
    z-index: 3000;
    padding: 0 6.4rem
}

.layer-wrap .layer-popup__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    margin: 0 auto;
    background: #fff;
    overflow: hidden;
    border-radius: 20px
} */

.layer-wrap__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    padding: 80px 0;
}

.layer-wrap .layer-popup {
    position: initial;
    z-index: 3000;
    padding: 0 6.4rem;
    height: auto;
}

.layer-wrap .layer-popup__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    margin: 0 auto;
    background: #fff;
    overflow: hidden;
    border-radius: 20px
}


@media only screen and (min-width: 768px) {
    .layer-wrap .layer-popup__inner {
        border-radius:24px
    }
}

@media only screen and (min-width: 1025px) {
    .layer-wrap .layer-popup__inner {
        border-radius:32px
    }
}

@media only screen and (min-width: 768px) {
    .layer-wrap .layer-popup__inner {
        width:36rem
    }
}

.layer-wrap .layer-popup__header {
    flex: none;
    display: flex;
    padding: 0
}

.layer-wrap .layer-popup__header .header-button {
    margin-left: auto
}

.layer-wrap .layer-popup__body {
    flex-grow: 1;
    padding: 3.2rem 2rem 2.4rem;
    overflow-y: initial
}

@media only screen and (min-width: 768px) {
    .layer-wrap .layer-popup__body {
        padding:3.8rem 2.6rem 3.2rem
    }
}

@media only screen and (min-width: 1025px) {
    .layer-wrap .layer-popup__body {
        padding:4.8rem 3.2rem 4rem
    }
}

.layer-wrap .layer-popup__footer {
    flex: none
}

.layer-wrap .layer-popup__footer .footer-button {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 2rem 3.2rem;
    background-color: var(--ds-brand);
    font-size: 1.5rem;
    line-height: 168%
}

@media only screen and (min-width: 768px) {
    .layer-wrap .layer-popup__footer .footer-button {
        font-size:1.6rem
    }
}

@media only screen and (min-width: 1025px) {
    .layer-wrap .layer-popup__footer .footer-button {
        font-size:2rem
    }
}

.layer-wrap .layer-popup__footer .footer-button {
    letter-spacing: 0;
    font-weight: 700;
    color: #fff;
    text-align: center
}

.layer-wrap .layer-popup img {
    max-width: 100%
}

.layer-wrap .dimmed {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    background: rgba(11,13,17,.4);
}

@media only screen and (min-width: 1025px) {
    .layer-wrap .dimmed {
        display:none
    }
}

.popup {
    overflow: hidden
}

.popup .layer-wrap {
    display: block
}

.popup .layer-popup:is(.show) {
    display: block
}


/* button */
.btn {
    font-family: var(--ds-font-pretendard);
    opacity: 1;
    transition: opacity 0.2s ease-in-out;
}
.btn:hover{
    opacity: 0.9;
}

.btn-sm {
    font-size: 0.8rem;
    padding: 6px 12px;
}

.btn-md {
    font-size: 1.8rem;
    font-weight: 500;
    padding: 1rem 1.6rem;
    line-height: 1.44;
    border-radius: 8px;
}

.btn-lg {
  font-size: 2.2rem;
  font-weight: 500;
  padding: 1rem 1.2rem;
  line-height: 1.44;
  border-radius: 4px;
  letter-spacing: -0.04em;
}

.btn-full {
  display: block;
  width: 100%;
}
@media only screen and (min-width: 768px) {
    .btn {
    }

    .btn-sm {
        font-size: 0.8rem;
        padding: 6px 12px;
    }

    .btn-md {
        padding: 1.2rem 2rem;
    }

    .btn-lg {
        padding: 1rem 2rem 1.4rem;
        border-radius: 6px;
        min-width: 22.3rem;
        font-size: 2.4rem;
    }

    .btn-full {
        display: block;
        width: 100%;
    }
}

@media only screen and (min-width: 1025px) {
    .btn {
    }

    .btn-sm {
        font-size: 0.8rem;
        padding: 6px 12px;
    }

    .btn-md {
        padding: 1.6rem 2.4rem;
    }

    .btn-lg {
        padding: 1.6rem 2.4rem;
        border-radius: 8px;
    }

    .btn-full {
        display: block;
        width: 100%;
    }
}

.btn-primary {
    background-color: var(--ds-brand);
    color: #fff;
}
.btn-secondary {
    background-color: rgba(106, 116, 124, 0.70);
    color: #fff;
}

/* // button */

/* input - text */
.section input[type=text] {
    border: 1px solid #414141;
    background: #ffffff;
    height: 3.2rem;
    padding: .6rem .2rem .7rem .8rem;
    color: var(--ds-text-primary);
    font-size: 1.6rem;
    font-weight: 400;
    font-family: var(--ds-font-pretendard);
}
.section input[type=text]::placeholder {
    color: #999999;
}
.section input[type=text]:focus {
    border-color: var(--ds-brand)
}
@media only screen and (min-width: 768px) {
    .section input[type=text] {
        height: 4.2rem;
        font-size: 2rem;
    }
}

/* input - check */
.common_checkbox_wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 3rem;
}
@media only screen and (min-width: 768px) {
    .common_checkbox_wrap {
        gap: 0 6rem;
    }
}
.common_checkbox  {
  position: absolute;
  opacity: 0;
  width:0;
  height:0;
}
.common_checkbox + label {
  display: inline-block;
  position: relative;
  padding-left: 2.8rem;
  cursor: pointer;
  font-size: 1.6rem;
  line-height: 2.4rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.common_checkbox + label::before {
  content: '';
  position: absolute;
  top: 0.4rem;
  left: 0;
  width: 1.6rem;
  height: 1.6rem;
  background-color: white;
  border: 1px solid #747474;
  border-radius: 2px; 
}
.common_checkbox:checked + label::before {
    background-image: url(../images/common/ico_check.svg);
    background-size: 1.4rem auto;
    background-repeat: no-repeat;
    background-position: center;
    border-color: var(--ds-brand);
    background-color: var(--ds-brand);
}

/* popup type2 */
.layer-wrap-type2,.layer-wrap-type2 .layer-popup {
    /* display: none; */
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.layer-wrap-type2 {
    position: fixed;
    background: rgba(11,13,17,.4);
    z-index: 2000;
    overflow-y: auto;
    overflow-x: hidden
}

.layer-wrap-type2__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    padding: 80px 0
}
.layer-wrap-type2 .layer-popup {
    display: block;
    position: initial;
    z-index: 3000;
    padding: 0;
    max-width: 102.8rem;
    width: 100%;
    /* height: 100%; */
    height: auto;
    background: none;
}

@media only screen and (min-width: 768px) {
    .layer-wrap-type2 .layer-popup {
        padding: 0 3.4rem;
        height: auto;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2 .layer-popup {
        padding: 0 6.4rem;
    }
}
/* 260120 팝업 높이 계산 : 시작 */
.layer-wrap-type2 .layer-popup > iframe {
    width: 100%;
    min-height: 420px;
    height: 90vh;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2 .layer-popup > iframe {
        /* height: 468px; */
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2 .layer-popup > iframe {
        /* height: 460px; */
    }
}
.layer-wrap-type2-form {
    display: flex;
    align-items: center;
    width: 100%;
}
.layer-wrap-type2-inner {
    width: 100%;
}
/* 260120 팝업 높이 계산 : 끝 */
.layer-wrap-type2-inner .layer-popup__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 90rem;
    height: 100%;
    margin: 0 auto;
    background: #fff;
    overflow: hidden;
    border-radius: 12px;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .layer-popup__inner {
        height: auto;
        border-radius: 16px;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .layer-popup__inner {
        height: auto;
        border-radius: 20px;
    }
}

.layer-wrap-type2-inner .layer-popup__body {
    flex-grow: 1;
    padding: 0;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: calc(100vh - 30rem);
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .layer-popup__body {
        max-height: 50vh;
        padding: 0 2rem 0;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .layer-popup__body {
        max-height: 50vh;
        padding: 0 2rem 0;
    }
}

.layer-wrap-type2-inner .dimmed {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    background: rgba(11,13,17,.4);
}
.layer-wrap-type2-inner .layer-popup__header {
    padding: 3rem 2rem 2rem;
    position: relative;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .layer-popup__header {
        padding: 3rem 2rem 2rem;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .layer-popup__header {
        padding: 3rem 2rem 3rem;
    }
}
.layer-wrap-type2-inner .layer-popup__header .pop_header_tit {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--ds-primary);
    padding-right: 3rem;
}
.layer-wrap-type2-inner .layer-popup__header .pop_header_txt {
    color: #394046;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.6;
    margin-top: 1rem;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .layer-popup__header .pop_header_txt {
        font-size: 1.8rem;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .layer-popup__header .pop_header_txt {
        font-size: 1.8rem;
    }
}
.layer-wrap-type2-inner .layer-popup__header .pop_close {
    content: '';
    display: inline-block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url(../images/common/ico-close.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    padding: .3rem;
    position: absolute;
    top: 3rem;
    right: 2rem;
}
.layer-wrap-type2-inner .pop_btn_wrap {
    text-align: center;
    padding-bottom: 4rem;
    padding-top: 2rem;
}
.layer-wrap-type2-inner .pop_btn_wrap .btn {
    min-width: 12rem;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .pop_btn_wrap .btn {
        min-width: 14rem;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .pop_btn_wrap .btn {
        min-width: 18rem;
    }
}

.layer-wrap-type2-inner .pop_btn_wrap .btn + .btn {
    margin-left: 2rem;
}
.layer-wrap-type2-inner .pop_form_group_wrap {
    background-color: #F7F7F7;
    padding: 2rem;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .pop_form_group_wrap {
        padding: 2rem 0;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .pop_form_group_wrap {
        padding: 2rem 0;
    }
}

.layer-wrap-type2-inner .pop_form_group {
    max-width: 49.7rem;
    margin: 0 auto;
}
.layer-wrap-type2-inner .pop_form_group .form_group {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.layer-wrap-type2-inner .pop_form_group .form_group + .form_group {
    margin-top: 1rem;
}
.layer-wrap-type2-inner .pop_form_group .form_group .form_label {
    width: 8.7rem;
    font-size: 1.6rem;
    font-weight: 400;
    font-family: var(--ds-font-pretendard);
    color: var(--ds-text-primary);
    text-align: right;
}
.layer-wrap-type2-inner .pop_form_group .form_group .form_control {
    width: calc(100% - 7rem);
    flex: 1;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .pop_form_group .form_group .form_control {
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .pop_form_group .form_group .form_control {
    }
}
.layer-wrap-type2-inner .pop_tbl_group_wrap {
    width: 100%;
    padding: 0 2rem;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .pop_tbl_group_wrap {
        padding: 0;
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner .pop_tbl_group_wrap {
        padding: 0;
    }
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_cell {
    display: flex;
    flex-wrap: wrap;
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_cell:last-child {
    border-bottom: 1px solid #E5E5E5;
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_cell .point_color {
    color: var(--ds-brand);
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_tit {
    width: 30%;
    min-width: 11.4rem;
    color: #394046;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: normal;
    font-family: var(--ds-font-pretendard);
    text-align: left;
    background-color: #F7F7F7;
    padding: 1rem 1.4rem;
    display: flex;
    align-items: center;
    border-top: 1px solid #E5E5E5;
    border-right: 1px solid #E5E5E5;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_tit {
        width: 12rem;
    }
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_value {
    width: 50%;
    color: var(--ds-text-primary);
    font-size: 1.4rem;
    font-weight: 500;
    line-height: normal;
    font-family: var(--ds-font-pretendard);
    text-align: left;
    padding: 1rem 1.4rem;
    display: flex;
    align-items: center;
    border-top: 1px solid #E5E5E5;
    border-right: 1px solid #E5E5E5;
    flex: 1 0 auto;
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_value {
        flex: 1;
    }
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_value {
    border-right: 0;
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_value:last-child {
    border-right: 0;
}
@media only screen and (min-width: 768px) {
    
}
.layer-wrap-type2-inner .pop_tbl_group_wrap .tbl_value > span {
    font-family: var(--ds-font-pretendard);
}


/* popup input - text */
.layer-wrap-type2-inner input[type=text] {
    border: 1px solid #414141;
    background: #ffffff;
    height: 3.6rem;
    padding: .6rem .2rem .7rem .8rem;
    color: var(--ds-text-primary);
    font-size: 1.6rem;
    font-weight: 400;
    font-family: var(--ds-font-pretendard);
}
@media only screen and (min-width: 768px) {
    .layer-wrap-type2-inner input[type=text] {
    }
}
@media only screen and (min-width: 1025px) {
    .layer-wrap-type2-inner input[type=text] {
    }
}

.layer-wrap-type2-inner input[type=text]::placeholder {
    color: #999999;
}
.layer-wrap-type2-inner input[type=text]:focus {
    border-color: var(--ds-brand)
}


/* pc/tablet/mo */
.pc-only {
    display: none;
}
@media only screen and (min-width: 768px) {
    .pc-only {
        display: none;
    }
}
@media only screen and (min-width: 1025px) {
    .pc-only {
        display: block;
    }
}

.mo-only {
    display: block;
}
@media only screen and (min-width: 768px) {
    .mo-only {
        display: none;
    }    
}
@media only screen and (min-width: 1025px) {
    .mo-only {
        display: none;
    }
}

.pc-mo-only {
    display: block;
}
@media only screen and (min-width: 768px) {
    .pc-mo-only {
        display: none;
    }
}
@media only screen and (min-width: 1025px) {
    .pc-mo-only {
        display: block;
    }
}
.pc-tbl-only {
    display: none;
}
@media only screen and (min-width: 768px) {
    .pc-tbl-only {
        display: block;
    }
}
@media only screen and (min-width: 1025px) {
    .pc-tbl-only {
        display: block;
    }
}


 .h-100 {
    height: 100%;
 }