﻿@charset "utf-8";
/* header */
header.header{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 100%;
    height: var(--header-height);
    background-color: #fff;
    box-sizing: border-box;
    transition: var(--transition);
}
header.header.scroll-active{
    box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 1.6rem;
}
.header-head{
    width: 100%;
}
.header-head .header-inner{
    padding-top: 2rem;
    height: var(--header-head);
    display: flex;
    align-items: center;
    position: relative;
}
.header-head .language-w{
    margin-right: auto;
    position: relative;
    width: 11.6rem;
}
.header-head .language-w .language-btn{
    width: 100%;
    height: 3.2rem;
    display: flex;
    align-items: center;
    gap: 0 .4rem;
    padding: 0 3.2rem 0 .8rem;
    border-radius: .8rem;
    background-color: #fff;
    font-size: 1.7rem;
    color: var(--grey-base);
    font-weight: 400;
    position: relative;
    transition: var(--transition);
}
.header-head .language-w .language-btn::after{
    content: "";
    display: block;
    position: absolute;
    width: var(--icon-size-xs);
    height: var(--icon-size-xs);
    background-image: url(../../images/portal/icon/language-arrow.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    top: 50%;
    right: .8rem;
    transform: translateY(-50%);
    transition: var(--transition);
}
.header-head .language-w.active .language-btn::after{
    transform: translateY(-50%) rotate(-180deg);
}
.header-head .language-w .language-list{
    position: absolute;
    z-index: 10;
    width: 100%;
    padding: .8rem 0;
    border-radius: .8rem;
    background-color: #fff;
    box-shadow: 0 0 1.6rem rgba(0, 0, 0, .2);
    bottom: 0;
    left: 0;
    transform: translateY(100%);
    display: block;
    opacity: 0;
    visibility: hidden;
    transition: var(--transition);
}
.header-head .language-w.active .language-list{
    bottom: -.8rem;
    opacity: 1;
    visibility: visible;
}
.header-head .language-w .language-list>li{
    display: block;
}
.header-head .language-w .language-list>li>a{
    padding: .4rem .8rem;
    font-size: var(--txt-font-size-sm);
    color: var(--grey-base);
    font-weight: 400;
    display: block;
    text-align: center;
    width: 100%;
    transition: var(--transition);
}
.header-head-right{
    display: flex;
    align-items: center;
    margin-left: auto;
    gap: 0 1.6rem;
}
.header-head-right .scale-w{
    display: flex;
    align-items: center;
    gap: 0 .8rem;
    height: 3.2rem;
    padding: 0 .8rem;
    border-radius: .8rem;
    background-color: var(--grey-darken4);
    color: #fff;
    font-size: 1.7rem;
    font-weight: 600;
    position: relative;
}
.zoom-txt{
    position: absolute;
    bottom: -.4rem;
    right: 0;
    transform: translateY(100%);
    height: 3.2rem;
    width: 7.6rem;
    border-radius: .8rem;
    background-color: #fff;
    box-shadow: 0 0 .8rem rgba(0, 0, 0, .25);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--primary-darken1)
}
.header-head-right .scale-w .scale-btn{
    background-color: transparent;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--icon-size-sm);
    height: var(--icon-size-sm);
    transition: var(--transition);
}
.header-head-right .scale-w .scale-btn:disabled{
    opacity: .5;
}
.header-txt-btn-w{
    padding: 0 .4rem;
    display: flex;
    gap: 0 2px;
}
.header-txt-btn-w>li{
    display: block;
    position: relative;
}
.header-txt-btn-w>li:not(:last-child)::after{
    content: "";
    position: absolute;
    display: block;
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background-color: var(--grey-base);
    top: 50%;
    right: -2px;
    transform: translateY(-50%);
}
.header-txt-btn-w .header-txt-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 .8rem;
    border-radius: .8rem;
    height: 3.2rem;
    background-color: transparent;
    color: var(--grey-base);
    font-size: 1.7rem;
    font-weight: 400;
    transition: var(--transition);
}
.header-head-right .header-mypage{
    display: flex;
    align-items: center;
    gap: 0 .4rem;
    height: 3.2rem;
    padding: 0 .8rem;
    border-radius: .8rem;
    background-color: var(--primary-base);
    color: #fff;
    font-size: 1.7rem;
    font-weight: 600;
    transition: var(--transition);
}

.header-body{
    width: 100%;
}
.header-body .header-inner{
    position: relative;
    display: flex;
    align-items: center;
    height: var(--header-body);
    gap: 0 3.8rem;
}
header.header .logo{
    flex: 0 0 auto;
    margin-right: auto;
    margin-bottom: 2rem;
}
header.header .logo>a{
    display: block;
    width: 100%;
    height: 100%;
}
.gnb{
    display: flex;
}
.gnb-li{
    flex: 0 0 auto;
}
.gnb-link{
    height: var(--header-body);
    padding-bottom: 2rem;
    width: 22rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 2.2rem;
    color: var(--grey-darken2);
    font-weight: 700;
    white-space: nowrap;
    transition: var(--transition);
}
html[lang="ru"] .gnb-link{
    padding-inline: .8rem;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
}
.gnb-bg{
    position: fixed;
    top: var(--header-height);
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 0;
    overflow: hidden;
    background-color: #fff;
    border-radius: 0 0 2rem 2rem;
    box-shadow: 0 1.6rem 1.6rem rgba(59, 34, 120, .2);
    transition: height var(--transition);
    pointer-events: none;
}
.lnb-w{
    position: absolute;
    top: 100%;
    width: 25%;
    height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: height var(--transition);
}
header.header.mega-active .gnb-bg{
    height: min(calc(var(--gnb-mega-height) + 4rem), var(--gnb-mega-max-height, calc(var(--gnb-mega-height) + 4rem)));
}
header.header.mega-active .lnb-w{
    height: min(var(--gnb-mega-height), max(0px, calc(var(--gnb-mega-max-height, calc(var(--gnb-mega-height) + 4rem)) - 4rem)));
}
.gnb-li:nth-child(1) .lnb-w{
    left: 0;
}
.gnb-li:nth-child(2) .lnb-w{
    left: 25%;
}
.gnb-li:nth-child(3) .lnb-w{
    left: 50%;
}
.gnb-li:nth-child(4) .lnb-w{
    left: 75%;
}
.gnb-li:not(:last-child) .lnb-tit,
.gnb-li:not(:last-child) .lnb{
    border-right: 1px solid var(--border-color);
}
.lnb-tit{
    margin-top: 4rem;
    display: block;
    text-align: center;
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--primary-darken1);
    padding-bottom: .8rem;
}
.lnb{
    flex: 1 1 auto;
    min-height: 0;
    margin-bottom: 4rem;
    display: flex;
    flex-direction: column;
    gap: .8rem 0;
    padding: 1.6rem 1.2rem;
    height: auto;
    overflow: hidden;
}
header.header.mega-scroll-active .lnb{
    overflow-x: hidden;
    overflow-y: auto;
}
.lnb::-webkit-scrollbar{
    width: var(--scrollbar-width);
}
.lnb::-webkit-scrollbar-track{
    background-color: var(--scrollbar-track-color);
    border-radius: 999px;
}
.lnb::-webkit-scrollbar-thumb{
    background-color: var(--scrollbar-thumb-color);
    border-radius: 999px;
}
.lnb::-webkit-scrollbar-button{
    display: none;
}
.lnb-li{
    display: block;
    width: 100%;
}
.lnb-link{
    width: 100%;
    display: block;
    text-align: left;
    font-size: 1.7rem;
    line-height: 1.3;
    font-weight: 600;
    color: var(--grey-base);
    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: .2rem;
    padding: .4rem .8rem;
    border-radius: .8rem;
    transition: var(--transition);
}
.lnb-depth3-w{
    margin-top: .4rem;
    display: flex;
    flex-direction: column;
    gap: .8rem 0;
    padding: 1.6rem 1.2rem;
    border-radius: .8rem;
    background-color: var(--grey-lighten5);
}
.lnb-depth3{
    display: block;
    text-align: left;
    font-size: 1.7rem;
    line-height: 1.3;
    color: var(--grey-base);
    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: .2rem;
    padding: .4rem .8rem;
    border-radius: .8rem;
    transition: var(--transition);
}
.header-body-right{
    flex: 0 0 auto;
}
.ham-btn{
    position: relative;
    width: clamp(34px, 4.2rem, 4.2rem);
    height: clamp(34px, 4.2rem, 4.2rem);
    margin: -.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: transparent;
    transition: var(--transition);
}
.header-body-right .toggle-switch,
.ham-btn.ham-btn-mo{
    display: none;
}
.ham-btn-line::before,
.ham-btn-line::after,
.ham-btn-line{
    display: block;
    width: clamp(17px, 2.2rem, 2.2rem);
    height: clamp(3px, .4rem, .4rem);
    border-radius: 999px;
    background-color: var(--grey-darken2);
}
.ham-btn-line{
    position: relative;
    transition: var(--transition);
}
.ham-btn-line::before,
.ham-btn-line::after{
    content: "";
    position: absolute;
    left: 0;
}
.ham-btn-line::before{
    top: calc(clamp(3px, .4rem, .4rem) * -2);
    transform: rotate(0);
    transition: .15s transform ease-out, .15s .15s top ease-out;
}
.ham-btn-line::after{
    bottom: calc(clamp(3px, .4rem, .4rem) * -2);
    transition: .15s transform ease-out, .15s .15s bottom ease-out;
}
.ham-btn.active .ham-btn-line{
    background-color: #fff;
}
.ham-btn.active .ham-btn-line::before{
    top: 0;
    transform: rotate(45deg);
    transition: .15s top ease-out, .15s .15s transform ease-out;
}
.ham-btn.active .ham-btn-line::after{
    bottom: 0;
    transform: rotate(-45deg);
    transition: .15s bottom ease-out, .15s .15s transform ease-out;
}
.ham-btn.ham-btn-pc{
    margin-bottom: 1.2rem;
}

@media screen and (min-width: 1201px){
    .header-head .language-w .language-btn:hover{
        background-color: var(--primary-lighten4);
    }
    .header-head .language-w .language-list>li>a:hover{
        background-color: var(--primary-lighten4);
    }
    .header-head-right .scale-w .scale-btn:not(:disabled):hover{
        background-color: var(--primary-lighten1);
    }
    .header-txt-btn:hover{
        background-color: var(--primary-lighten4);
    }
    .header-head-right .header-mypage:hover{
        background-color: var(--primary-darken2);
    }
    .gnb-li:hover .gnb-link,
    .gnb-li.active .gnb-link{
        color: var(--primary-base);
    }
    .lnb-li:hover .lnb-link{
        color: var(--primary-base);
        text-decoration-color: inherit;
    }
    .lnb-depth3:hover{
        color: var(--primary-base);
        font-weight: 600;
        text-decoration-color: inherit;
    }
    .ham-btn:hover{
        background-color: var(--primary-lighten4);
    }
}
@media screen and (max-width: 1439px){
    .header-body .header-inner{
        gap: 0 2.8rem;
    }
    .gnb-link{
        width: 16rem;
    }
    html[lang="ru"] .gnb-link{
        font-size: 1.7rem;
        line-height: 1.2;
    }
    .header-head-right .scale-w{
        display: none;
    }
}
@media screen and (max-width: 1200px){
    header.header{
        z-index: 100;
    }
    .header-head .header-inner{
        padding-top: 0;
    }
    header.header .logo{
        margin-bottom: 0;
    }
    .header-head .language-w{
        margin: 0 -2rem;
        position: absolute;
        right: calc(2rem + clamp(34px, 4.2rem, 4.2rem));
        top: calc(var(--header-height) / 2);
        z-index: 10;
        transform: translateY(-50%);
        width: clamp(34px, 4.2rem, 4.2rem);
        transition: var(--transition);
    }
    header.header:has(.toggle-switch) .header-head .language-w{
        right: calc(4rem + clamp(34px, 4.2rem, 4.2rem) + clamp(48px, 6.4rem, 6.4rem));
    }
    .header-head .language-w .language-btn{
        width: 100%;
        height: clamp(34px, 4.2rem, 4.2rem);
        border-radius: 50%;
        padding: 0;
        margin: 0;
        justify-content: center;
    }
    .header-head .language-w .language-btn>span,
    .header-head .language-w .language-btn::after{
        display: none;
    }
    .header-head .language-w .language-btn>.icon{
        width: var(--icon-size);
        height: var(--icon-size);
    }
    .header-head .language-w .language-list{
        width: 12rem;
        left: 50%;
        transform: translateX(-50%) translateY(100%);
    }
    .header-head-right>*:not(.language-w),
    .ham-btn.ham-btn-pc,
    .gnb-w,
    .gnb-bg{
        display: none;
    }
    .ham-btn.ham-btn-mo,
    header.header .toggle-switch{
        display: flex;
    }
    .header-inner{
        justify-content: space-between;
    }
    .header-body .header-inner{
        padding-bottom: 0;
    }
    .header-body-right{
        display: flex;
        align-items: center;
        gap: 0 2rem;
    }
    .header-dim{
        position: fixed;
        width: 100%;
        height: calc(100vh - var(--header-height));
        max-height: calc(var(--view-height) - var(--header-height));
        top: var(--header-height);
        left: 0;
        z-index: 10;
        opacity: 0;
        visibility: hidden;
        background-color: rgba(0, 0, 0, .4);
    }
    header.header.mo-menu-active{
        z-index: 106;
        box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 1.6rem;
    }
    html:has(header.header.mo-menu-active) .header-dim{
        opacity: 1;
        visibility: visible;
    }
    header.header .toggle-switch {
        position: relative;
        display: block;
        width: clamp(48px, 6.4rem, 6.4rem);
        height: clamp(20px, 2.8rem, 2.8rem);
        transition: var(--transition);
    }
    header.header .toggle-switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }
    header.header .switch-slider {
        position: absolute;
        cursor: pointer;
        background-color: var(--grey-lighten4);
        border-radius: 999px;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        transition: var(--transition);
    }
    header.header .switch-slider::before {
        content: "";
        position: absolute;
        height: 2rem;
        width: 2rem;
        right: 4px;
        top: 50%;
        transform: translateY(-50%);
        background-color: var(--grey-base);
        border-radius: 50%;
        transition: var(--transition);
    }
    header.header .toggle-switch .switch-txt{
        position: absolute;
        left: clamp(6px, .8rem, .8rem);
        top: 50%;
        transform: translateY(-50%);
        font-size: var(--txt-font-size-sm);
        font-weight: 700;
        color: var(--grey-base);
        transition: var(--transition);
    }
    header.header input:checked + .switch-slider {
        background-color: var(--primary-base);
    }
    header.header input:checked + .switch-slider::before {
        background-color: #fff;
        right: unset;
        left: 4px;
    }
    header.header input:checked + .switch-slider + .switch-txt{
        color: #fff;
        left: unset;
        right: clamp(6px, .8rem, .8rem);
    }
    header.header.mo-menu-active .toggle-switch,
    header.header.mo-menu-active .language-w{
        opacity: 0;
        visibility: hidden;
    }
}
@media screen and (max-width: 1028px){
}
@media screen and (max-width: 767px){
}
@media screen and (max-width: 576px){
}
@media screen and (max-width: 374px){
    header.header .logo{
        --logo-width: 28rem;
    }
}

/*fullmenu-area*/
@media screen and (min-width: 1201px){
    .fullmenu-area{
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        max-height: var(--view-height);
        display: flex;
        align-items: center;
        background-color: rgba(0, 0, 0, .5);
        z-index: -1;
        opacity: 0;
        visibility: hidden;
        transition: var(--transition);
    }
    .fullmenu-area.active{
        z-index: 9999;
        opacity: 1;
        visibility: visible;
    }
    .fullmenu-w{
        border-radius: 2rem;
        padding: 5.6rem;
        background-color: #fff;
        border: .4rem solid var(--primary-base);
        box-shadow: 0 0 1.6rem rgba(0, 0, 0, .2);
        position: relative;
        max-height: calc(var(--view-height) - (var(--container-gutter) * 2));
        overflow-x: hidden;
        overflow-y: auto;
        background-image: url(../../images/portal/fullmenu-bg.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .fullmenu-w>h2{
        font-size: 3.2rem;
        line-height: 1.3;
        margin-bottom: 5.6rem;
    }
    .fullmenu-close{
        width: 4.2rem;
        height: 4.2rem;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        position: absolute;
        top: 5.6rem;
        right: 5.6rem;
        background-image: url(../../images/portal/icon/menu-close.svg);
        background-position: center;
        background-size: 3.2rem auto;
        background-repeat: no-repeat;
        transition: var(--transition);
    }
    .fullmenu-close>.icon{
        width: 4.2rem;
        height: 4.2rem;
    }
    .fullmenu-close:hover{
        background-color: var(--primary-lighten4);
    }
    .fullmenu{
        display: flex;
        gap: 0 4rem;
        justify-content: space-between;
        text-align: center;
        position: relative;
        overflow-wrap: anywhere;
    }
    .fullmenu::after{
        content: "";
        display: block;
        position: absolute;
        width: 100vw;
        height: 1px;
        background-color: var(--border-color);
        top: calc(var(--fullmenu-title-height, calc(3.2rem * 1.5)) + 1.8rem);
        left: 50%;
        transform: translateX(-50%);
    }
    .fullmenu::-webkit-scrollbar{
        width: var(--scrollbar-width);
        height: var(--scrollbar-width);
    }
    .fullmenu::-webkit-scrollbar-track{
        background-color: var(--scrollbar-track-color);
        border-radius: 999px;
    }
    .fullmenu::-webkit-scrollbar-thumb{
        background-color: var(--scrollbar-thumb-color);
        border-radius: 999px;
    }
    .fullmenu::-webkit-scrollbar-button{
        display: none;
    }
    .fullmenu>li{
        display: block;
        flex: 1 1 0;
        min-width: 0;
    }
    .fullmenu-depth1{
        flex: 0 0 auto;
        display: block;
        width: 100%;
        min-height: var(--fullmenu-title-height, 0px);
        border-radius: 0;
        background-color: transparent;
        font-size: 3.2rem;
        font-weight: 700;
        margin-bottom: 3.8rem;
        transition: var(--transition);
    }
    .fullmenu-depth1>span{
        display: block;
    }
    .fullmenu-depth2-w{
        display: flex;
        flex-direction: column;
        gap: .8rem 0;
        height: auto !important;
    }
    .fullmenu-depth2-w>li{
        display: block;
    }
    .fullmenu-depth2{
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.9rem;
        text-align: center;
        padding: .6rem 0;
        min-height: 4.4rem;
        transition: var(--transition);
    }
    .fullmenu-depth3-w{
        margin: 0 .6rem;
        padding: .8rem 1.2rem;
        display: block;
        border-radius: .8rem;
        background-color: var(--primary-lighten4);
        height: auto !important;
    }
    .fullmenu-depth3-w>li{
        display: block;
        position: relative;
    }
    .fullmenu-depth3-w>li + li{
        padding-top: 1px;
    }
    .fullmenu-depth3-w>li + li::before{
        content: "";
        display: block;
        position: absolute;
        width: 100%;
        max-width: 14rem;
        height: 1px;
        background-color: var(--border-color);
        top: 0;
        left: 50%;
        transform: translateX(-50%);
    }
    .fullmenu-depth3{
        display: block;
        font-size: 1.7rem;
        padding: .8rem 0;
        transition: var(--transition);
    }
    .fullmenu-panel,
    .fullmenu-depth2-panel,
    .mo-menu{
        display: none;
    }
    .fullmenu-depth2-w>li:hover .fullmenu-depth2{
        font-weight: 700;
        color: var(--primary-base);
    }
    .fullmenu-depth3:hover{
        font-weight: 700;
        color: var(--primary-accent);
    }
}
@media screen and (max-width: 1439px){
}
@media screen and (max-width: 1200px){
    .fullmenu-area{
        position: fixed;
        width: 100%;
        max-width: 480px;
        height: calc(100vh - var(--header-height));
        max-height: calc(var(--view-height) - var(--header-height));
        overflow-x: hidden;
        overflow-y: auto;
        top: var(--header-height);
        right: 0;
        z-index: 105;
        transform: translateX(100%);
        opacity: 0;
        visibility: hidden;
        padding: 4rem 0 8rem 0;
        background-color: #fff;
        transition: var(--transition);
    }
    .fullmenu-area.mo-active {
        transform: translateX(0px);
        opacity: 1;
        visibility: visible;
    }
    .fullmenu-area .container{
        padding: 0;
    }
    .fullmenu-w>h2{
        display: none;
    }
    .mo-menu{
        padding: 0 var(--container-gutter) 4rem;
    }
    .mo-menu-top>strong{
        display: block;
        font-size: clamp(20px, 3.2rem, 3.2rem);
        font-weight: 600;
    }
    .mo-menu-btn-w{
        display: flex;
        gap: 0 1.6rem;
        margin: 2rem 0 0;
    }
    .mo-menu-btn{
        flex: 1 1 0;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        gap: 0 4px;
        height: clamp(40px, 5.6rem, 5.6rem);
        border-radius: .8rem;
        font-size: clamp(16px, 1.9rem, 1.9rem);
        font-weight: 600;
        border: 1px solid var(--border-color);
        background-color: #fff;
        color: var(--grey-base);
    }
    .mo-menu-btn.primary{
        border-color: var(--primary-base);
        background-color: var(--primary-base);
        color: #fff;
    }
    .fullmenu{
        display: block;
        border-top: 1px solid var(--border-color);
    }
    .fullmenu>li{
        display: block;
        border-bottom: 1px solid var(--border-color);
    }
    .fullmenu-depth2-w>li.has-depth3 .fullmenu-depth2,
    .fullmenu-depth1{
        display: none;
    }
    .fullmenu-panel{
        display: flex;
        align-items: center;
        text-align: left;
        padding: 0 calc((var(--container-gutter) * 2) + var(--icon-size)) 0 var(--container-gutter);
        width: 100%;
        height: clamp(50px, 8rem, 8rem);
        font-size: clamp(16px, 2.4rem, 2.4rem);
        font-weight: 700;
        background-color: #fff;
        position: relative;
        transition: var(--transition);
    }
    .fullmenu-panel::after{
        content: "";
        display: block;
        position: absolute;
        width: var(--icon-size);
        height: var(--icon-size);
        background-image: url(../../images/portal/icon/icon-chevron-down-grey.svg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        top: 50%;
        right: var(--container-gutter);
        transform: translateY(-50%);
        transition: var(--transition);
        z-index: 3;
    }
    .fullmenu>li.active .fullmenu-panel::after{
        transform: translateY(-50%) rotate(-180deg);
    }
    .fullmenu>li.active .fullmenu-panel{
        color: var(--primary-base);
        background-color: var(--primary-lighten5);
    }
    .fullmenu-depth2-w{
        width: 100%;
        height: 0;
        opacity: 0;
        visibility: hidden;
        overflow-x: hidden;
        overflow-y: hidden;
        display: block;
        transition: var(--transition);
    }
    .fullmenu>li.active .fullmenu-depth2-w{
        opacity: 1;
        visibility: visible;
        border-top: 1px solid var(--border-color);
    }
    .fullmenu-depth2-w>li{
        display: block;
    }
    .fullmenu-depth2-w>li:not(:last-child){
        border-bottom: 1px solid var(--border-color);
    }
    .fullmenu-depth2-panel,
    .fullmenu-depth2{
        width: 100%;
        display: flex;
        align-items: center;
        padding: 2rem clamp(24px, 3.2rem, 3.2rem);
        font-size: clamp(16px, 1.9rem, 1.9rem);
        font-weight: 600;
        color: var(--grey-darken2);
        background-color: #F2F4F5;
    }
    .fullmenu-depth2-panel{
        padding-right: calc((clamp(24px, 3.2rem, 3.2rem)* 2) + var(--icon-size));
        position: relative;
    }
    .fullmenu-depth2-panel::after{
        content: "";
        display: block;
        position: absolute;
        width: var(--icon-size);
        height: var(--icon-size);
        background-image: url(../../images/portal/icon/icon-chevron-down-grey.svg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        top: 50%;
        right: clamp(24px, 3.2rem, 3.2rem);
        transform: translateY(-50%);
        transition: var(--transition);
        z-index: 3;
    }
    .fullmenu-depth2-w>li.active .fullmenu-depth2-panel::after{
        transform: translateY(-50%) rotate(-180deg);
    }
    .fullmenu-depth3-w{
        background-color: #F8F6F3;
        width: 100%;
        height: 0;
        opacity: 0;
        visibility: hidden;
        overflow-x: hidden;
        overflow-y: hidden;
        display: block;
        padding: 0 clamp(32px, 4rem, 4rem);
        transition: var(--transition);
    }
    .fullmenu-depth2-w>li.active .fullmenu-depth3-w{
        opacity: 1;
        visibility: visible;
        border-top: 1px solid var(--border-color);
    }
    .fullmenu-depth3-w>li{
        display: block;
    }
    .fullmenu-depth3-w>li + li{
        border-top: 1px solid var(--border-color);
    }
    .fullmenu-depth3{
        width: 100%;
        display: flex;
        align-items: center;
        font-size: clamp(14px, 1.7rem, 1.7rem);
        font-weight: 600;
        padding: 1.6rem 0;
    }
}
@media screen and (max-width: 1028px){
}
@media screen and (max-width: 767px){
}
@media screen and (max-width: 576px){
    .fullmenu-area{
        max-width: 320px;
    }
}

/*footer*/
footer.footer{
    width: 100%;
    border-top: 1px solid var(--border-color);
}
.footer-head {
	display: none;
}
.footer-head .familysite{
    display: flex;
    align-items: center;
    gap: 0 2rem;
}
.footer-head .familysite>strong{
    flex: 0 0 auto;
    display: block;
    font-size: var(--tit-font-size);
    font-weight: 700;
    min-width: 12.2rem;
}
.footer-head .familysite-list{
    flex-basis: 0;
    flex-grow: 1;
    display: flex;
    gap: 0 1px;
}
.footer-head .familysite-list>li{
    flex: 1 1 0;
    padding: 1.2rem;
    position: relative;
}
.footer-head .familysite-list>li:not(:last-child)::after{
    content: "";
    display: block;
    position: absolute;
    width: 1px;
    height: 30px;
    background-color: var(--border-color);
    top: 50%;
    right: -1px;
    transform: translateY(-50%);
}
.footer-head .familysite-link{
    border-radius: .8rem;
    padding: .7rem 0;
    width: 100%;
    display: block;
    text-align: center;
    font-size: 1.9rem;
    font-weight: 700;
    color: var(--grey-lighten1);
    transition: var(--transition);
}


.footer-body{
    padding: 4rem 0;
    background-color: var(--grey-darken3);
    color: var(--grey-lighten4);
}
.footer-body-head{
    display: flex;
    align-items: center;
    gap: 0 2rem;
    margin-bottom: 2rem;
}
.footer-link-list{
    flex-basis: 0;
    flex-grow: 1;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0 1.4rem;
    margin: 0 -.8rem;
}
.footer-link-w>li{
    display: block;
}
.footer-link{
    padding: 0 .8rem;
    height: clamp(28px, 3.2rem, 3.2rem);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: clamp(12px, 1.7rem, 1.7rem);
    font-weight: 700;
    color: var(--grey-lighten4);
    background-color: transparent;
    border-radius: .8rem;
    transition: var(--transition);
}
html[lang="ru"] .footer-link{
    font-size: clamp(12px, 1.5rem, 1.5rem);
}
.footer-link.primary{
    color: var(--primary-lighten2);
}
.footer-info-w{
    display: flex;
    align-items: flex-start;
    gap: 0 2rem;
}
.footer-info{
    flex-basis: 0;
    flex-grow: 1;
    font-size: var(--txt-font-size);
    gap: .8rem 3rem;
    font-weight: 600;
}
.footer-info p + p{
    margin-top: 4px;
}
.footer-contact{
    display: flex;
    gap: 0 .25em;
    margin-top: 4px;
}
.footer-contact-label{
    flex: 0 0 auto;
}
.footer-contact-list{
    min-width: 0;
}
.footer-copyright{
    font-size: var(--txt-font-size);
    color: rgba(221, 221, 221, .6);
    font-weight: 600;
}
.mo-familysite{
    display: none;
}

@media screen and (min-width: 1201px){
    .footer-head .familysite-link:hover{
        color: var(--primary-base);
    }
    .footer-link:hover{
        background-color: rgba(255, 255, 255, .24);
    }
}
@media screen and (max-width: 1200px){
}
@media screen and (max-width: 1028px){
    footer.footer{
        border-top: 0;
    }
    .footer-head{
        display: none;
    }
    .footer-body-head{
        align-items: flex-start;
        flex-direction: column-reverse;
        gap: 3.2rem 0;
        margin-bottom: 3.2rem;
    }
    .footer-info-w{
        display: block;
    }
    .footer-copyright{
        margin-top: 1rem;
    }
    .footer-info p{
        line-height: 1.7;
    }
    .footer-info p + p,
    .footer-contact{
        margin-top: 0;
    }
    .mo-familysite{
        display: block;
        width: 100%;
        margin-top: 3.2rem;
        height: clamp(40px, 5.6rem, 5.6rem);
        border-radius: .4rem;
        background-color: var(--grey-base);
        padding: 0 calc(4rem + var(--icon-size)) 0 2rem;
        font-size: clamp(16px, 1.9rem, 1.9rem);
        color: #fff;
        font-weight: 600;
        background-image: url(../../images/portal/icon/icon-chevron-down-white.svg);
        background-position: right 2rem center;
        background-size: var(--icon-size) auto;
        background-repeat: no-repeat;
    }
}
@media screen and (max-width: 767px){
    .footer-body{
        padding: 0 0 3.2rem;
    }
    .footer-link-list{
        width: 100%;
        justify-content: center;
        padding: 2.6rem 0;
        border-bottom: 1px solid var(--grey-lighten2);
        margin: 0;
    }
}
@media screen and (max-width: 576px){
}
@media screen and (max-width: 674px){
    .footer-link-list{
        gap: 0 2px;
    }
}

html[lang="fa"] .menu-align-right,
html[lang="fa"] .header-head-right,
html[lang="fa"] .header-body-right .toggle-switch,
html[lang="fa"] .footer{
    direction: rtl;
    text-align: right;
}
html[lang="fa"] .menu-align-right .lnb-tit,
html[lang="fa"] .menu-align-right .lnb-link,
html[lang="fa"] .menu-align-right .lnb-depth3,
html[lang="fa"] .menu-align-right .fullmenu,
html[lang="fa"] .menu-align-right .fullmenu-depth1,
html[lang="fa"] .menu-align-right .fullmenu-depth2,
html[lang="fa"] .menu-align-right .fullmenu-depth2-panel,
html[lang="fa"] .menu-align-right .fullmenu-depth3,
html[lang="fa"] .menu-align-right .fullmenu-panel{
    text-align: right;
    justify-content: flex-start;
}
html[lang="fa"] .menu-align-right .gnb-li:nth-child(1) .lnb-w{
    left: auto;
    right: 0%;
}
html[lang="fa"] .menu-align-right .gnb-li:nth-child(2) .lnb-w{
    left: auto;
    right: 25%;
}
html[lang="fa"] .menu-align-right .gnb-li:nth-child(3) .lnb-w{
    left: auto;
    right: 50%;
}
html[lang="fa"] .menu-align-right .gnb-li:nth-child(4) .lnb-w{
    left: auto;
    right: 75%;
}
html[lang="fa"] .menu-align-right .gnb-li:not(:last-child) .lnb-tit,
html[lang="fa"] .menu-align-right .gnb-li:not(:last-child) .lnb{
    border-right: 0;
    border-left: 1px solid var(--border-color);
}
html[lang="fa"] .header-head .language-w .language-btn::after{
    right: auto;
    left: .8rem;
}
html[lang="fa"] .header-txt-btn-w>li:not(:last-child)::after{
    right: auto;
    left: -2px;
}
html[lang="fa"] .header-body-right .toggle-switch .toggle-slider::before{
    left: auto;
    right: var(--switch-gap);
}
html[lang="fa"] .header-body-right .toggle-switch input:checked + .toggle-slider::before{
    left: auto;
    right: calc(var(--switch-width) - var(--switch-height) + var(--switch-gap));
}
html[lang="fa"] .footer-link-list{
    justify-content: flex-start;
}
html[lang="fa"] .familysite-list>li:not(:last-child)::after{
    right: auto;
    left: -1px;
}
html[lang="fa"] .mo-familysite{
    padding: 0 2rem 0 calc(4rem + var(--icon-size));
    background-position: left 2rem center;
}
@media screen and (min-width: 1201px){
html[lang="fa"] .header-head .language-w .language-btn{
    padding: 0 .8rem 0 3.2rem;
}
html[lang="fa"] .menu-align-right .fullmenu-close{
    right: auto;
    left: 5.6rem;
}
}
@media screen and (max-width: 1200px){
html[lang="fa"] .menu-align-right .fullmenu-panel{
    padding: 0 var(--container-gutter) 0 calc((var(--container-gutter) * 2) + var(--icon-size));
}
html[lang="fa"] .menu-align-right .fullmenu-panel::after{
    right: auto;
    left: var(--container-gutter);
}
html[lang="fa"] .menu-align-right .fullmenu-depth2-panel{
    padding-right: clamp(24px, 3.2rem, 3.2rem);
    padding-left: calc((clamp(24px, 3.2rem, 3.2rem) * 2) + var(--icon-size));
}
html[lang="fa"] .menu-align-right .fullmenu-depth2-panel::after{
    right: auto;
    left: clamp(24px, 3.2rem, 3.2rem);
}
}
