@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Lato:300,400,600,700,900');

.ly_wrapper.menu-category {
    height: 558px;
}

.ly_wrapper.menu-category .ly_navi {
    padding: 16px 0 24px;
}

.ly_wrapper.menu-category .ly_navi--main>ul>li.selected>a:after {
    display: none;
}

.ly_wrapper.menu-category .ly_navi.ly_navi--main > ul {
    width: 219px;
    margin-top: 0;
}

.ly_wrapper.menu-category .ly_navi.ly_navi--main > ul .ly_navi--sub {
    width: calc(100% - 249px);
    left: 249px;
    top: 16px;
    min-height: 510px;
    border: none;
    padding-left: 32px;
}

.ly_wrapper.menu-category .ly_navi.ly_navi--main > ul .ly_navi--sub:before {
    content: "";
    position: absolute;
    width: 1px;
    background-color: #E0E0E0;
    height: 100%;
    left: 0;
    top: 8px;
}

.ly_wrapper.menu-category .ly_navi.ly_navi--main > ul .ly_navi--sub:after {
    content: "";
    position: absolute;
    width: 1px;
    background-color: #E0E0E0;
    height: 100%;
    left: 247px;
    top: 8px;
}

.ly_wrapper.menu-category .ly_navi--main > ul > li > a {
    padding: 0;
    margin: 0 32px 0 34px;
    background: url("../img/icon_menu_arrow.svg") no-repeat center right;
    font-weight: 500;
    font-size: 16px;
    line-height: 32px;
    text-transform: capitalize;
    width: 183px;
}

.ly_wrapper.menu-category .ly_navi--main > ul > li > a:hover {
    color: #159E9E;
    background: url("../img/icon_menu_arrow_active.svg") no-repeat center right;
}

.ly_wrapper.menu-category .ly_navi--main > ul > li.selected > a {
    color: #159E9E;
    background: url("../img/icon_menu_arrow_active.svg") no-repeat center right;
}

.ly_wrapper.menu-category .ly_navi--sub .article {
    width: 100%;
}

.ly_wrapper.menu-category .ly_navi--sub .article>ul {
    position: absolute;
    left: 247px;
    top: 0;
    padding: 0 32px;
    min-height: 510px !important;
    z-index: 10;
    width: 160px;
}

.ly_wrapper.menu-category .ly_navi--sub .article>ul>li {
    font-weight: normal;
    font-size: 14px;
    line-height: 30px;
    color: #333333;
    height: auto;
    margin: 0;
}

.ly_wrapper.menu-category .ly_navi--sub .article>ul>li:hover {
    text-decoration: none;
}

.ly_wrapper.menu-category .ly_navi--sub .article>ul>li>a {
    display: inline;
    font-size: 14px;
    line-height: 30px;
    color: #333333;
}

.ly_wrapper.menu-category .ly_navi--sub .article>ul>li>a:hover {
    text-decoration: underline !important;
    border: none;
}

.ly_wrapper.menu-category .article a.nclick {
    width: 183px;
    display: block;
    position: relative;
}

.ly_wrapper.menu-category .article a.active {
    font-weight: 500;
    text-decoration-line: underline;
}

.ly_wrapper.menu-category .article a.nclick:after {
    display: block;
    width: 7px;
    height: 11px;
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    background: url("../img/icon_menu_arrow.svg") no-repeat center right;
    transform: translateY(-50%);
}

.ly_wrapper.menu-category .article a.nclick:hover:after {
    background: url("../img/icon_menu_arrow_active.svg") no-repeat center right;
}

.ly_wrapper.menu-category .article a.nclick.active:after {
    background: url("../img/icon_menu_arrow_active.svg") no-repeat center right;
}

.ly_wrapper.menu-category .article a.nclick.no-child:after {
    display: none;
}

.ly_wrapper.menu-category .article a.nclick.no-child:hover:after {
    background:none;
}

.ly_wrapper.menu-category .article h1 {
    font-size: 14px;
    line-height: 30px;
    color: #333333;
    font-weight: normal;
    margin: 0;
    text-transform: none;
}

.ly_wrapper.menu-category .article a:hover {
    font-weight: 500;
    text-decoration: underline;
}

.ly_wrapper.menu-category .article a:hover h1 {
    font-weight: 500;
    text-decoration: underline;
}

.ly_wrapper.menu-category .article .nclick.active h1 {
    font-weight: 500;
    text-decoration-line: underline;
}

.ly_wrapper.menu-category .shop-by {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    justify-content: space-between;
}

.ly_wrapper.menu-category .shop-by .shop-by-list {
    width: 210px;
    height: 510px;
    padding: 0 0 0 32px;
    position: relative;
    box-sizing: border-box;
}

.ly_wrapper.menu-category .shop-by .shop-by-list:after {
    content: "";
    position: absolute;
    width: 1px;
    background-color: #E0E0E0;
    height: 100%;
    left: 0;
    top: 8px;
}

.ly_wrapper.menu-category .shop-by .shop-by-list .shop-by-ttl {
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
    text-transform: uppercase;
    color: #333333;
}

.ly_wrapper.menu-category .shop-by .shop-by-list ul {
    margin: 4px 0 24px;
}

.ly_wrapper.menu-category .shop-by .shop-by-list ul li {
    font-size: 14px;
    line-height: 30px;
    color: #333333;
}

.ly_wrapper.menu-category .shop-by .shop-by-list ul li a {
    color: #333333;
}

.ly_wrapper.menu-category .shop-by .shop-by-list ul li a:hover {
    font-weight: 500;
}

.ly_wrapper.menu-category .shop-by .shop-by-list ul li .new {
    margin-left: 5px;
    padding: 4px;
    background-color: #EDFCFC;
    vertical-align: middle;
    color: #159E9E;
    font-family: Roboto, sans-serif;
    font-size: 9px;
    line-height: 10.8px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.ly_wrapper.menu-category .shop-by .shop-bnr {
    display: flex;
    flex-direction: column;
    width: 247px;
    overflow: hidden;
}

.ly_wrapper.menu-category .shop-by .shop-bnr .shop-bnr-item {
    width: 247px;
    height: 247px;
}

.ly_wrapper.menu-category .shop-by .shop-bnr .shop-bnr-item:first-child {
    margin-bottom: 15px;
}

.ly_wrapper.menu-category .shop-by .shop-bnr .shop-bnr-item img {
    width: 100%;
    height: 100%;
}
.ly_wrapper.menu-category .shop-by .shop-bnr .shop-bnr-item img:hover {
    transition: all .3s ease-in-out;
    transform: scale(1.04)
}

.menu-wrapper {
    margin-top: 12px;
    white-space: nowrap;
}

.menu-wrapper .menu-gnb {
    display: flex;
}

.menu-wrapper .menu-gnb>li {
    position: relative;
}

.menu-wrapper .menu-gnb>li:first-child>a {
    padding-left: 0;
}

.menu-wrapper .menu-gnb>li>a {
    display: block;
    color: #333;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-decoration: none;
    padding: 0px 16px 12px;
    position: relative;
    z-index: 10;
}

.menu-wrapper .menu-gnb:hover>li>a {
    color: #666;
}

.menu-wrapper .menu-gnb>li>a:hover {
    color: #333;
}

.menu-wrapper .menu-gnb>li>a:after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #333;
    position: absolute;
    left: 16px;
    bottom: 0;
    transition: .2s;
}

.menu-wrapper .menu-gnb>li:first-child:after {
    left: 0;
}

.menu-wrapper .menu-gnb>li>a:hover:after {
    width: calc(100% - 32px);
}

.menu-wrapper .menu-gnb>li:first-child>a:after {
    left: 0;
}

.menu-wrapper .menu-gnb>li:first-child>a:hover:after {
    width: calc(100% - 16px);
}

.menu-wrapper .menu-gnb>li.arrow {
    background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI0IiB2aWV3Qm94PSIwIDAgOCA0IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8ZyBjbGlwLXBhdGg9InVybCgjY2xpcDBfNzBfMzA0OSkiPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTcuOTY3OTMgMC44MjIwMjNMNC4wNjQwMSAzLjk3NDExQzQuMDQwNDkgMy45OTA3OSA0LjAxMDI1IDQgMy45Nzg5NCA0QzMuOTQ3NjMgNCAzLjkxNzM5IDMuOTkwNzkgMy44OTM4OCAzLjk3NDExTDAuMDMyMDcyNSAwLjgyMjAyM0MwLjAxMTQxNzggMC44MDMwNCAtMy40MDM0OWUtMDggMC43Nzg2MjkgLTMuMjkzMDJlLTA4IDAuNzUzMzU0Qy0zLjE4MjU0ZS0wOCAwLjcyODA4IDAuMDExNDE3OCAwLjcwMzY2OSAwLjAzMjA3MjUgMC42ODQ2ODZMMC44ODAyNDcgLTkuNjkyMWUtMDhMMy45MzU5OSAyLjQ2NjczQzMuOTU5NjcgMi40ODM5NyAzLjk5MDQxIDIuNDkzNTEgNC4wMjIzIDIuNDkzNTFDNC4wNTQxOCAyLjQ5MzUxIDQuMDg0OTMgMi40ODM5NyA0LjEwODYgMi40NjY3M0w3LjExOTc1IC0zLjg0NzY4ZS0wOEw3Ljk2NzkzIDAuNjg1MzU1QzcuOTg4NiAwLjcwNDMzNyA4IDAuNzI4NzQzIDggMC43NTQwMjNDOCAwLjc3OTI5NyA3Ljk4ODYgMC44MDMwNCA3Ljk2NzkzIDAuODIyMDIzWiIgZmlsbD0iIzMzMzMzMyIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzcwXzMwNDkiPgo8cmVjdCB3aWR0aD0iNCIgaGVpZ2h0PSI4IiBmaWxsPSJ3aGl0ZSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoOCkgcm90YXRlKDkwKSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=') no-repeat top 8px right;
    margin-right: 16px;
}

.menu-wrapper .menu-gnb>li.color-red>a {
    color: #FF5859;
}

.menu-wrapper .menu-gnb>li.color-red>a:after {
    background: #FF5859;
}

.menu-wrapper .sub-menu-shadow,
.menu-wrapper .menu-shadow {
    width: fit-content;
    height: calc(100% - 95px);
    position: fixed;
    top: 95px;
    left: 0px;
    z-index: 9;
}

.menu-wrapper .menu-shadow {
    width: 100%;
    background: rgba(0, 0, 0, 0.25);
}

.notice_popup.is-active~#global .menu-wrapper .sub-menu-shadow,
.notice_popup.is-active~#global .menu-wrapper .menu-shadow {
    top: 135px;
    height: calc(100% - 135px);
}

.menu-wrapper .active .sub-menu-shadow {
    display: block;
}

.menu-wrapper .sub-menu-wrap {
    width: fit-content;
    height: 100%;
    position: relative;
    top: 0;
    left: 0;
    z-index: 99;
    background: #fff;
    box-sizing: border-box;
    display: flex;
    border-top: 1px solid #ececec;
}

.menu-wrapper .sub-menu {
    width: clamp(225px, 23vw, 290px);
}

.menu-wrapper .sub-menu-inner {
    height: calc(100dvh - 135px);
    margin: 4px;
    overflow-y: auto;
}

.menu-wrapper .sub-menu.second {
    left: -40px;
    background: #fff;
}

.menu-wrapper .sub-menu.third {
    height: 100%;
    position: absolute;
    top: -1px;
    left: clamp(225px, 23vw, 290px);
    background: #F7F7F7;
    border-top: 1px solid #ececec;
    margin-left: -4px;
}

.menu-wrapper .sub-menu.third .sub-menu-gnb a {
    line-height: 40px;
}

.menu-wrapper .sub-menu.third .sub-menu-gnb a:after {
    display: none;
}

.menu-wrapper .sub-menu .sub-menu-gnb {
    padding: 8px 0px;
}

.menu-wrapper .sub-menu .sub-menu-gnb li a {
    position: relative;
    box-sizing: border-box;
    display: block;
    height: 40px;
    padding-left: 36px;
    font-size: 14px;
    color: #333;
    line-height: 20px;
    text-transform: capitalize;
    text-decoration: none;
    transition: .2s;
}

.menu-wrapper .sub-menu .sub-menu-gnb li a:after {
    content: '';
    display: block;
    width: 4px;
    height: 8px;
    background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNCIgaGVpZ2h0PSI4IiB2aWV3Qm94PSIwIDAgNCA4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8ZyBpZD0iaWNvbl9tZW51X2Fycm93IDIiIGNsaXAtcGF0aD0idXJsKCNjbGlwMF8zNV8xMDcpIj4KPHBhdGggaWQ9IlZlY3RvciIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0wLjgyMjAyMyAwLjAzMjA3NDdMMy45NzQxMSAzLjkzNTk5QzMuOTkwNzkgMy45NTk1MSA0IDMuOTg5NzUgNCA0LjAyMTA2QzQgNC4wNTIzNyAzLjk5MDc5IDQuMDgyNjEgMy45NzQxMSA0LjEwNjEyTDAuODIyMDIzIDcuOTY3OTNDMC44MDMwNCA3Ljk4ODU4IDAuNzc4NjI5IDggMC43NTMzNTUgOEMwLjcyODA4IDggMC43MDM2NjkgNy45ODg1OCAwLjY4NDY4NiA3Ljk2NzkzTDIuMTQyOTNlLTA3IDcuMTE5NzVMMi40NjY3MyA0LjA2NDAxQzIuNDgzOTcgNC4wNDAzMyAyLjQ5MzUxIDQuMDA5NTkgMi40OTM1MSAzLjk3NzdDMi40OTM1MSAzLjk0NTgyIDIuNDgzOTcgMy45MTUwNyAyLjQ2NjczIDMuODkxNEwwIDAuODgwMjQ3TDAuNjg1MzU1IDAuMDMyMDc0N0MwLjcwNDMzNyAwLjAxMTQwMTggMC43Mjg3NDMgMS40MDYxMWUtMDkgMC43NTQwMjMgMEMwLjc3OTI5NyAtMS40MDYxOGUtMDkgMC44MDMwNCAwLjAxMTQwMTggMC44MjIwMjMgMC4wMzIwNzQ3WiIgZmlsbD0iIzMzMzMzMyIvPgo8L2c+CjxkZWZzPgo8Y2xpcFBhdGggaWQ9ImNsaXAwXzM1XzEwNyI+CjxyZWN0IHdpZHRoPSI0IiBoZWlnaHQ9IjgiIGZpbGw9IndoaXRlIi8+CjwvY2xpcFBhdGg+CjwvZGVmcz4KPC9zdmc+Cg==') no-repeat center;
    background-size: cover;
    position: absolute;
    top: 50%;
    right: 24px;
    transform: translateY(-50%);
    opacity: 0;
    transition: .2s;
}

.menu-wrapper .sub-menu .sub-menu-gnb:hover>li>a {
    color: #666;
}

.menu-wrapper .sub-menu .sub-menu-gnb li a:hover {
    color: #333;
}

.menu-wrapper .sub-menu .sub-menu-gnb li a:hover:after {
    opacity: 1;
}

.menu-wrapper .sub-menu .sub-menu-gnb li a span {
    position: relative;
    display: inline-block;
    height: 100%;
    padding: 10px 0;
    box-sizing: border-box;
}

.menu-wrapper .sub-menu .sub-menu-gnb li a span:after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #333;
    position: absolute;
    left: 0;
    bottom: 0;
    transition: .3s;
}

.menu-wrapper .sub-menu .sub-menu-gnb li a:hover span:after {
    width: 100%;
}

@media screen and (max-width: 1042px) {
    .header-wrapper .ly_img_sch .supplementary-text {
        bottom: 8px;
        line-height: 16px;
    }
}