@charset "UTF-8";
@import "/static/compat/css/kosme_tokens.css";

body {
    font-family: 'Pretendard GOV' , sans-serif;
}

#wrap.kosme-wrap {
    display: flex;
    align-items: normal;
    justify-content: flex-start;
    flex-direction: column;
    position: static;
    min-height: 100%;
    z-index: 1000;
}

#krds-header .kosme-gnb .gnb-menu {
    gap:unset;
    justify-content: space-between;
}

/*
#krds-header .kosme-gnb .gnb-menu li {
    width: 100%;
}
*/

#krds-header .kosme-gnb .gnb-line-height-02{
    line-height: var(--krds-samll-line-height);
}

#krds-header .kosme-gnb .gnb-main-trigger {
    line-height: var(--krds-samll-line-height);
}

#krds-footer > .inner {
    padding-left: var(--krds-contents-padding-x);
    padding-right: var(--krds-contents-padding-x);
}

.inner {
    width: 100%;
    max-width: 130rem;
}

.inner.page-step {
    position: relative;
}

.cont-page-title {
    font-family: var(--kosme-font-serif);
    font-weight: 700;
}

.main-page-title {
    font-size: var(--krds-pc-font-size-heading-large);
    font-family: var(--kosme-font-title);
    font-weight: 700;
}

.krds-btn.link:visited {
    color: transparent;
}

.krds-btn.link:visited > .underline {
    text-decoration: none;
}

.krds-btn.link:visited .svg-icon {
    background-color: var(--krds-light-color-text-basic);
}

@media (min-width: 1024px) {
    .inner {
        padding-left: 1rem;
        padding-right:1rem;
        margin: 0 auto;
    }
}

@media (max-width:1023px) {
    #wrap.kosme-wrap {
        min-width: 100%;
    }
}

.btn-top {
    position: fixed;
    right: 2.4rem;
    bottom: 2.4rem;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 5.6rem;
    height: 5.6rem;

    border: 1px solid var(--krds-color-border-gray-light, #d8dee8);
    border-radius: 50%;

    background-color: #fff;

    box-shadow: 0 .4rem 1.2rem rgba(0,0,0,.12);

    cursor: pointer;

    opacity: 0;
    visibility: hidden;

    transition:
        opacity .2s ease,
        transform .2s ease,
        visibility .2s ease;

    z-index: 1000;
}

.btn-top.is-active {
    opacity: 1;
    visibility: visible;
}

.btn-top:hover,
.btn-top:focus {
    transform: translateY(-2px);
}

.btn-top .svg-icon {
    width: 2rem;
    height: 2rem;
}

@media (max-width: 767px) {

    .btn-top {
        right: 1.6rem;
        bottom: 1.6rem;

        width: 4.8rem;
        height: 4.8rem;
    }

}
