@charset "utf-8";

/* common */
body.body-fix{ overflow: hidden; }
.subContents .main{ min-height: calc(100dvh - 737px); }
.inner { width: calc(100% - 100px); max-width: 1600px; margin: 0 auto; }

/* button */
.button__wrap { display: flex; justify-content: center; align-items: center; }
.button__wrap { column-gap: 15px; }
.btn { display: flex; justify-content: center; align-items: center; }
.btn-link { display: flex; justify-content: center; align-items: center; width: 190px; height: 60px; border: 1px solid #fff; border-radius: 20px 0 20px 0; font-family: var(--font-Montserrat); font-size: 17px; font-weight: 600; color: #fff; transition: 0.2s ease-out; }
.btn-link::after { content: ""; display: block; width: 26px; height: 26px; margin-left: 6px; background: url("/img/main/icon_link_arrow_w.svg") no-repeat center center/auto; transition: 0.2s ease-out; }
.btn-box-color { width: 210px; height: 70px; font-size: 18px; font-weight: 600; color: #fff; border: 1px solid var(--main-color); border-radius: 20px 0 20px 0; background-color: var(--main-color); }
.btn-box-line { width: 210px; height: 70px; font-size: 18px; font-weight: 600; color: #666666; border: 1px solid #666666;  border-radius: 20px 0 20px 0; background-color: #fff;}

/* header */
.header { position: fixed; left: 0; top: 0; width: 100%; height: var(--header-H); background-color: rgba(0, 0, 0, 0.4); -moz-backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.05); z-index: 900; transition: 0.3s ease-in;}
.header::after { content: ""; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 1px; background-color: #eee; visibility: hidden; opacity: 1; transition: 0.3s ease-in; }
.header__inner{ position: relative; display: flex; justify-content: center; align-items: center; width: calc(100% - 60px); max-width: 1760px; height: 100%; margin: 0 auto; z-index: 5; }
.header .logo { position: absolute; left: 0; top: 50%; width: 176px; transform: translateY(-50%); }
.logo a { display: block; height: 100%; }
.logo a img { width: 100%; }
.gnb { height: 100%; }
.gnb .gnb__list { display: flex; height: 100%; }
.gnb .gnb__item { position: relative; }
.gnb .gnb__item::after { content: ""; position: absolute; right: 0; top: 50%; display: block; width: 1px; height: 10px; background-color: rgba(255, 255, 255, 0.15); transform: translateY(-50%); }
.gnb .gnb__item:last-child::after { display: none; }
.gnb .gnb__item > a{ position: relative; display: flex; width: 178px; height: 100%; justify-content: center; align-items: center; font-size: 20px; font-weight: 500; color: #fff; }
.gnb .gnb__item > a::after { content: ""; position: absolute; left: 0; bottom: 0px; display: block; width: 100%; height: 2px; background-color: var(--main-color); opacity: 0; z-index: 5;}
.gnb .lnb { display: none; position: absolute; left: 50%; top:100%; width: 100vw; height: 100px;  z-index: 0; margin-left: -50vw; border-bottom: 1px solid #EEEEEE; }
.gnb .lnb.on{ z-index: 1; }
.gnb .lnb.depth{ border-bottom: none; }
.gnb .lnb-bg { position: fixed; left: 0; top:var(--header-H); display: none; width: 100%; height: 100px; background-color: #F5F5F5; z-index: 0;}
.gnb .lnb-bg.on{ z-index: 1; }
.gnb .lnb__inner { height: 100%; }
.gnb .lnb__list { display: flex; column-gap: 70px; justify-content: center; height: 100%; }
.gnb .lnb__item { display: flex; min-width: fit-content;}
.gnb .lnb__item > a { display: flex; height: 100%; justify-content: center; align-items: center; font-size: 18px; color: #666; }
.gnb .gnb-procuct .lnb-bg { height: 133px; }
.gnb .gnb-procuct .lnb { position: fixed; left: 0; top:var(--header-H); height: 133px; margin-left: 0; } 
.gnb .gnb-procuct .lnb__list { column-gap: 10px; padding-top: 10px;  }
.gnb .gnb-procuct .lnb__item { flex: 1; max-width: 260px;  height: 113px; } 
.gnb .gnb-procuct .lnb__item > a { flex-direction: column; justify-content: flex-start; padding-top: 20px; width: 100%; height: 100%; border-radius: 10px; background-color: #ECECEC; transition: 0.3s ease-out; }
.gnb .gnb-procuct .lnb__item > a .icon { width: 60px; height: 40px; }
.gnb .gnb-procuct .lnb__item > a .icon-01 { background: url("/img/common/icon_category_01.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item > a .icon-02 { background: url("/img/common/icon_category_02.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item > a .icon-03 { background: url("/img/common/icon_category_03.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item > a .icon-04 { background: url("/img/common/icon_category_04.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item > a span { margin-top: 10px; font-size: 18px; color: #333; }
.gnb .depth03-bg { position: fixed; left: 0; top: calc(var(--header-H) + 133px); display: none; width: 100%; height: 210px; border-bottom: 1px solid #E1E1E1; background-color: #fff; z-index: 0; }
.gnb .depth03-bg.on {  position: fixed; left: 0; top: calc(var(--header-H) + 133px); transform: translateX(0); }
.gnb .depth03 { overflow: hidden; position: absolute; left: 50%; top:100%; display: none; width: 100%; height: 210px; padding: 10px 0; transform: translateX(-50%); }
.gnb .depth03__list { display: flex; column-gap: 20px; width: 100%; justify-content: center; }
.gnb .depth03__list > li { position: relative; flex: 1; max-width: 304px; }
.gnb .depth03__list > li a { display: block; height: 100%; border: 1px solid #EEEEEE;border-radius: 10px; padding: 10px; text-align: center; transition: 0.3s ease-out;}
.gnb .depth03__list > li a span { font-size: 18px; color: #666; }
.gnb .depth03__list > li .img-box { overflow: hidden; width: 100%; height: 130px; margin-bottom: 10px; }
.gnb .depth03__list > li .img-box img { width: 100%; height: 100%; object-position: center center; object-fit: contain; }
.gnb .depth03__list > li a:hover { border-color: var(--main-color); }
.gnb .depth__inner { display: flex; justify-content: center; align-items: center;width: calc(100% - 60px); max-width: 1600px; height: 100%; margin: 0 auto; }
.gnb .lnb__item.lnb-etc { position: relative; }
.gnb .lnb__item.lnb-etc .depth03 { width: 100vw; top: calc(100% + 10px); }
.gnb .lnb__item.lnb-g10 .depth03__list { column-gap: 10px; }

.header-btn__area { position: absolute; right: 0; top: 50%; display: flex; align-items: center; column-gap: 10px; transform: translateY(-50%); z-index: 15; }
.header-lang { position: relative; width: 80px; }
.header-lang button { display: flex; align-items: center; height: 32px; font-family: var(--font-Montserrat); font-size: 16px; font-weight: 600; color: #fff; }
.header-lang button::before { content: ""; display: block; width: 18px; height: 18px; margin-right: 9px; background: url("/img/common/icon_lang.svg") no-repeat center center/contain; }
.header-lang button::after { content: ""; display: block; width: 16px; height: 16px; margin-left: 6px; background: url("/img/common/icon_lang_arrow.svg") no-repeat center center/contain; }
.header-lang .lang__list { overflow: hidden; position: absolute; right: 0; top: calc(100% + 5px); display: none; border-radius: 10px; background-color: #fff; z-index: 15; }
.header-lang .lang__list > li > a { display: block; width: 60px; padding: 5.5px 0 4.5px; border: 1px solid #DDDDDD; font-family: var(--font-Montserrat); font-size: 16px; font-weight: 500; color: #333; text-align: center; border-bottom: none; }
.header-lang .lang__list > li > a:last-child { border-bottom: 1px solid #DDDDDD; }
.header-lang .lang__list > li > a:hover,.header-lang .lang__list > li > a.on { color: #fff; background-color: var(--main-color); border-color: var(--main-color); }
.header-lang button.on::after{ transform: rotateX(180deg); }
.btn-mo-menu {position: relative; display: none; width: 30px; height: 30px; }
.btn-mo-menu>span { position: absolute; left: 6px; width: 20px; height: 2px; background-color: #555; pointer-events: none; }
.btn-mo-menu>span:nth-child(1) { top: calc(50% - 8px);  transition: 0.3s;}
.btn-mo-menu>span:nth-child(2) {  left: auto; right: 6px; top: calc(50% - 1px);  transition: 0.3s;}
.btn-mo-menu>span:nth-child(3) { top: calc(50% + 6px);  transition: 0.3s;}
.btn-mo-menu>span:nth-child(4) { opacity: 0; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(45deg); }
.btn-mo-menu>span:nth-child(5) { opacity: 0; left: 50%; bottom: calc(50% - 2px); transform: translate(-50%,-50%) rotate(-45deg); }
.btn-mo-menu.on>span:nth-child(1),.btn-mo-menu.on>span:nth-child(2),.btn-mo-menu.on>span:nth-child(3) { width: 0; }
.btn-mo-menu.on>span:nth-child(4),.btn-mo-menu.on>span:nth-child(5) { animation: menuOpacity 0.3s 0.3s linear both; }

.dim-layer { position: fixed; left: 0; top: 0; display: none; width: 100%; height: 100dvh; background-color: rgba(0, 0, 0, 0.5); z-index: 900; }

@keyframes menuOpacity {
    100% { opacity: 1; }
}


/* hover */
.header.color-w { background-color: #fff; box-shadow:  0 0 10px 0 rgba(0, 0, 0, 0.05);}
.header.color-w::after { visibility: visible; opacity: 1; }
.header.color-w .gnb__item::after { background-color: rgba(34, 34, 34, 0.15); }
.header.color-w .gnb__item > a { color: #333; }
.header.color-w .header-lang button { color: #555; }
.header.color-w .header-lang button::before { background-image: url("/img/common/icon_lang_g.svg"); }
.header.color-w .header-lang button::after { background-image: url("/img/common/icon_lang_arrow_g.svg"); }

.header:hover { background-color: #fff; box-shadow:  0 0 10px 0 rgba(0, 0, 0, 0.05);}
.header:hover::after { visibility: visible; opacity: 1; }
.header:hover .gnb .gnb__item::after { background-color: rgba(34, 34, 34, 0.15); }
.header:hover .gnb .gnb__item > a { color: #333; }
.header:hover .header-lang button { color: #555; }
.header:hover .header-lang button::before { background-image: url("/img/common/icon_lang_g.svg"); }
.header:hover .header-lang button::after { background-image: url("/img/common/icon_lang_arrow_g.svg"); }
.header:hover .gnb .gnb__item > a:hover { color: var(--main-color); }
.gnb .gnb__item > a:hover::after { opacity: 1; }
.gnb .lnb__item > a:hover { color: var(--main-color); }
.gnb .gnb-procuct .lnb__item > a:hover { height: 123px; border-radius: 10px 10px 0 0; border-bottom: none; background-color: #fff; }
.gnb .gnb-procuct .lnb__item > a:hover span {  color: var(--main-color); }
.gnb .gnb-procuct .lnb__item > a:hover .icon-01 { background: url("/img/common/icon_category_01_on.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item > a:hover .icon-02 { background: url("/img/common/icon_category_02_on.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item > a:hover .icon-03 { background: url("/img/common/icon_category_03_on.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item > a:hover .icon-04 { background: url("/img/common/icon_category_04_on.svg") no-repeat center center/auto; }

/* on */
.header:hover .gnb .gnb__item.on > a { color: var(--main-color); }
.gnb .gnb__item.on > a::after { opacity: 1; }
.gnb .lnb__item.on > a { color: var(--main-color); }
.gnb .gnb-procuct .lnb__item.on > a { height: 123px; border-radius: 10px 10px 0 0; border-bottom: none; background-color: #fff; }
.gnb .gnb-procuct .lnb__item.on > a span {  color: var(--main-color); }
.gnb .gnb-procuct .lnb__item.on > a .icon-01 { background: url("/img/common/icon_category_01_on.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item.on > a .icon-02 { background: url("/img/common/icon_category_02_on.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item.on > a .icon-03 { background: url("/img/common/icon_category_03_on.svg") no-repeat center center/auto; }
.gnb .gnb-procuct .lnb__item.on > a .icon-04 { background: url("/img/common/icon_category_04_on.svg") no-repeat center center/auto; }

#moMenu { display:none; position:fixed; left: -100%; top:60px; height: calc(100dvh - 60px); z-index: 900; transition: left 0.4s;}
#moMenu .mo-menu__area { position: relative; height: 100%; }
#moMenu .gnb__list { overflow-y: auto; position: relative; width: 200px; height: 100%; padding: 20px 0; background-color: #fff; z-index: 10; }
#moMenu .gnb__list::-webkit-scrollbar { width: 8px;}
#moMenu .gnb__list::-webkit-scrollbar-thumb { border-radius: 8px; background-color: #777777; }
#moMenu .gnb__list::-webkit-scrollbar-track { background-color: #c5c5c5; }
#moMenu .gnb__item + .gnb__item { margin-top: 10px; }
#moMenu .gnb__item > a { display: block; padding: 5px 30px; font-size: 20px; font-weight: 700; }
#moMenu .gnb__item > a:active, #moMenu .gnb__item.on > a { color: var(--main-color); }
#moMenu .lnb { display: none; }
#moMenu .lnb__list { padding-left: 30px; }
#moMenu .lnb__item { margin: 10px 0; border-radius: 10px 0 0 10px; }
#moMenu .lnb__item .icon { display: none; }
#moMenu .lnb__item > a { display: block; padding: 10px; font-size: 18px; font-weight: 500; color: #333; }
#moMenu .lnb__item > a span { font-size: 18px; }
#moMenu .gnb-procuct .lnb__item.on { background: #333; }
#moMenu .gnb-procuct .lnb__item.on > a { color: #fff; } 
#moMenu .depth03 { overflow: hidden; position: fixed; left: 200px; top: 60px; width: 0; max-width: 320px; height: calc(100dvh - 60px); transition: width 0.4s; background-color: #333; z-index: 5; }
#moMenu .depth03.on { width: calc(100vw - 200px); }
#moMenu .depth03__list .img-box { display: none; }
#moMenu .depth03__list { padding: 20px;}
#moMenu .depth03__list > li + li { margin-top: 10px; }
#moMenu .depth03__list > li a { display: inline-block; padding: 10px; font-size: 18px; font-weight: 500; color: #fff; white-space: nowrap; }

@media (hover:hover) and (pointer:fine) {
    #moMenu .gnb__item > a:hover { color: var(--main-color); }
}

/* footer */
.btn-top { display: none; position: fixed; right: 40px; bottom:40px; z-index: 30; }
.btn-top > button { display: flex; justify-content: center; align-items: center; width: 60px; height: 60px; border-radius: 50%; font-family: var(--font-Montserrat); font-size: 16px; font-weight: 500; color: #fff; background-color: var(--main-color); }
.btn-top:hover { animation: upDown 0.6s linear both; }
.footer { padding: 80px 0 30px; background-color: #252525; }
.footer__top { display: flex; justify-content: space-between; column-gap: 40px; padding-bottom: 70px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
.footer__top .left { display: flex; align-items: center; column-gap: 70px; }
.footer__top .logo { width: 254px; }
.footer__address { color: rgba(255, 255, 255, 0.7); }
.footer__address > .row { display: flex; flex-wrap: wrap; row-gap: 6px; column-gap: 20px;  }
.footer__address > .row + .row { margin-top: 6px; }
.footer__address > .row dl { display: flex;}
.footer__address > .row dt { white-space: nowrap; }
.footer__address > .row dd { word-break: keep-all; }
.footer__address > .row dt, .footer__address > .row dd, .footer__address > .row span { font-size: 18px; font-weight: 200; color: rgba(255, 255, 255, 0.7); }
.footer__address > .row.flex { display: flex; }
.footer__address > .row .copyright { font-family: var(--font-Montserrat); }
.footer__top .right > em { font-size: 24px; font-weight: 600; line-height: 1.5; color: #fff; }
.footer__top .right > p { margin-top: 10px; font-size: 18px; font-weight: 200; color: rgba(255, 255, 255, 0.6) }
.footer__top .right .contact__list { margin-top: 10px; }
.footer__top .right .contact__list > li + li { margin-top: 10px; }
.footer__top .right .contact__list > li { display: flex; column-gap: 20px; font-size: 18px; font-weight: 100; color: #fff; }
.footer__top .right .contact__list > li.tel::before { content:""; display: block; width: 22px; height: 22px; background: url("/img/common/icon_tel.svg") no-repeat center center/contain; }
.footer__top .right .contact__list > li.email::before { content:""; display: block; width: 22px; height: 22px; background: url("/img/common/icon_email.svg") no-repeat center center/contain; }
.footer__bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 30px; }
.footer__bottom .left { display: flex; column-gap: 17px; }
.footer__bottom .left .btn-link {width: 204px; border-color: #7D7D7D; font-family: var(--font-Pretendard); font-size: 16px; font-weight: 200; color: #fff; }
.footer__bottom .left .btn-link::after { display: none; }
.f-mark__list { display: flex; align-items: flex-end; gap: 10px; }

.content__bottom { display: none; height: 360px;}
.content__bottom.on { display: flex; }
.content__bottom .link__box { overflow: hidden; position: relative; display: flex; flex-direction: column; justify-content: center; width: 50%; height: 100%; align-items: center; text-align: center; }
.content__bottom .link__box .bg { position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%) scale(1.001); z-index: 0; transition: 0.6s; } 
.content__bottom .link__box:first-child .bg { background: url("/img/common/bottom_cs_img.jpg") no-repeat center center/cover; }
.content__bottom .link__box:last-child .bg { background: url("/img/common/bottom_about_img.jpg") no-repeat center center/cover; }
.content__bottom .link__box .bg::after{ content: ""; position: absolute; left: 50%; top: 50%; display: block; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2);  transform: translate(-50%, -50%); z-index: 1; visibility: hidden; opacity: 0; transition: 0.6s; }
.content__bottom .link__box .text { position: relative; z-index: 3; }
.content__bottom .link__box .text > span { font-size: 18px; font-weight: 500; color: #fff; }
.content__bottom .link__box .text > p { margin-top: 6px; font-size: 36px; font-weight: 600; color: #fff; }
.content__bottom .link__box .arrow { position: relative; display: block; width: 70px; height: 70px; margin-top: 34px; border: 1px solid #fff; border-radius: 50%; background: url("/img/common/arrow_w.svg") no-repeat center center/auto; transition: 0.6s; z-index: 3; }
.content__bottom .link__box:hover .bg { transform: translate(-50%, -50%) scale(1.08); }
.content__bottom .link__box:hover .bg::after { visibility: visible; opacity: 1; }
.content__bottom .link__box:hover .arrow { border-color: var(--main-color); background-color: var(--main-color); }

/* modal */
.modal { position: fixed; left: 0; top: 0; bottom: 0; display: none; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); z-index: 999; }
.modal-layer { position: absolute; left: 50%; top: 50%; width:calc(100% - 60px); height: calc(100% - 60px); max-width: 830px; max-height: 800px; border-radius: 20px; background-color: #fff; transform: translate(-50%, -50%); }
.modal__header { position: relative; display: flex; justify-content: center; align-items: center; height: 100px; padding: 0 40px; }
.modal__header > p { font-size: 24px; font-weight: 500; text-align: center; }
.modal__header .btn-modal-close { position: absolute; right: 30px; top: 30px; width: 40px; height: 40px; background: url("/img/common/icon_close.svg") no-repeat center center/contain; }
.modal__header::after { content: ""; position: absolute; left: 50%; bottom: 0; width: calc(100% - 80px); height: 1px; background-color: #CCCCCC; transform: translateX(-50%); } 
.modal__content { overflow-y: auto; padding: 30px 40px; height: calc(100% - 100px); }
.modal__content::-webkit-scrollbar { width: 8px;}
.modal__content::-webkit-scrollbar-thumb { background-color: #777777; }
.modal__content::-webkit-scrollbar-track { background-color: #c5c5c5; }
.modal__content .img-box { width: 100%; max-width: 450px; margin: 0 auto;}
.modal__content .img-box img { border: 1px solid #CCCCCC; }

/* privacy */
.privacy { margin-top: 90px; color:#666; width: 100%; overflow: hidden; box-sizing:border-box; padding:50px 20px; font-size:18px;	line-height: 1.5; word-break:break-all; border-top: 2px solid #333; }
.privacy * { font-family: var(--font-Pretendard); word-break: keep-all; }
.privacy > h3 { font-size:22px; font-weight:bold; color:#000; text-align: left; margin:50px 0 30px; }
.privacy h2:first-child { margin-top: 0; }
.privacy > p { margin:15px 0; }
.privacy > p+dl { margin-top: 30px; }
.privacy > dl { padding-bottom:20px;}
.privacy > dl > dt{ font-size:18px;color:var(--main-color);font-weight:700;padding-bottom:5px;}
.privacy > dl > dd{ padding-bottom:10px; font-size:18px; line-height: 1.5;}
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ margin-top: 10px; }
.privacy > dl > dd ul li:first-child { margin-top: 0; }
.privacy > dl > dd ul li p { margin:0 10px 5px; line-height: 1.5; }
.sTxt h3 { font-size:18px; color: #333; font-weight: 700; margin: 20px 0 10px; }
.sTxt p { margin-top: 10px; }
.sTxt dt { margin-top: 10px; }
.sTxt dd { margin:0 8px; }

@keyframes upDown {
    0% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0); }
}

@supports not (height: 100dvh) {
    .subContents .main{ min-height: calc(100vh - 737px); }
    #moMenu{height: calc(100% - 60px);}
    #moMenu .depth03 { height: calc(100% - 60px); }
    .dim-layer { height: 100%; }
}

@media screen and (max-width:1400px) {
    .gnb .gnb__item > a { width: 140px; font-size: 18px; }
    .gnb .gnb-procuct .lnb__item { max-width: 200px; }
    .gnb .lnb__item > a, .gnb .gnb-procuct .lnb__item > a span { font-size: 16px; }
    .gnb .depth03__list > li { max-width: 200px; }
    .gnb .depth03__list > li a span { font-size: 14px; }

    .footer__top .logo { width: 200px; }
    .footer__top .left { column-gap: 40px; }
    .footer__address > .row { column-gap: 10px; }
    .footer__address > .row dt, .footer__address > .row dd, .footer__address > .row span { font-size: 14px; }
    .footer__top .right > em { font-size: 20px; }
    .footer__top .right > p, .footer__top .right .contact__list > li { font-size: 14px; }
}
@media screen and (max-width:1200px) {
    :root {    
        --header-H:60px;
    }
    #wrap { padding-top: var(--header-H); }
    #wrap.pd-visual { padding-top: 0; }
    .inner { width: calc(100% - 60px); }
    .header{ background-color: #fff; box-shadow:  0 0 10px 0 rgba(0, 0, 0, 0.05);}
    .header::after { visibility: visible; opacity: 1; }
    .header .header-lang button { color: #555; }
    .header .header-lang button::before { background-image: url("/img/common/icon_lang_g.svg"); }
    .header .header-lang button::after { background-image: url("/img/common/icon_lang_arrow_g.svg"); }
    .header .logo { width: 120px; }
    .gnb { display: none; }
    .btn-mo-menu { display: block; }
    #moMenu { display: block; }
    #moMenu.on { left: 0;}
    .dim-layer.menu { display: block; }
}

@media screen and (max-width:1024px) {
    #wrap.pd-visual { padding-top: var(--header-H); }
    .footer { padding-top: 40px; }
    .footer__top { align-items: flex-end; padding-bottom: 30px; }
    .footer__top .logo { width: 160px; }
    .footer__top .left {  flex-direction: column; align-items: flex-start; row-gap: 40px; }
    .footer__bottom .left { max-width: 50%; }
    .content__bottom { height: 260px;}
    .content__bottom .link__box .text > span { font-size: 16px; }
    .content__bottom .link__box .text > p { font-size: 30px; }
    .content__bottom .link__box .arrow { width: 50px; height: 50px; margin-top: 24px; background-size: 16px; }

    .btn-box-color,.btn-box-line { width: 160px; height: 53px; }

    .modal-layer { height: calc(100% - 100px); }
    .modal__header { height: 80px; }
    .modal__header > p { font-size: 20px; }
    .modal__header .btn-modal-close { top: 20px; }
    .modal__content { height: calc(100% - 80px); }

    .privacy,.privacy > dl > dt,.privacy > dl > dd,.sTxt h3 { font-size: 16px; }
    .privacy > h3 { margin: 20px 0; font-size: 20px; }
    .privacy { padding: 40px 0; }
}
@media screen and (max-width:768px) {
    #moMenu .gnb__list { width: 180px; }
    #moMenu .depth03 { left: 180px; }
    #moMenu .depth03.on { width: calc(100vw - 180px); }
    #moMenu .depth03__list > li a  { font-size: 16px; }

    .btn-top { right: 20px; bottom: 20px;  }
    .btn-top > button { width: 45px; height: 45px; font-size: 14px; }
    .footer__top { flex-direction: column; align-items: center; row-gap: 40px; text-align: center; }
    .footer__top .logo { margin: 0 auto; }
    .footer__address { max-width: 400px; }
    .footer__address > .row {  justify-content: center;}
    .footer__address > .row dt, .footer__address > .row dd {text-align: left; }
    .footer__top .right > p, .footer__top .right .contact__list > li { font-size: 14px; }
    .footer__top .right .contact__list > li { justify-content: center; column-gap: 10px; }
    .footer__top .right .contact__list > li.tel::before { width: 18px; height: 18px; }
    .footer__bottom { flex-direction: column; gap: 30px; }
    .footer__bottom .left { max-width: initial; }
    .footer__bottom .left .btn-link { flex: 1; max-width: 150px; height: 44px; font-size: 14px; }

    #imgModal .modal-layer { max-height: clamp(525px,132.4vw,800px); }
    .modal__header { height: 60px; padding: 0 20px; }
    .modal__header > p { padding: 0 30px; font-size: 18px; }
    .modal__header .btn-modal-close { width: 30px; height: 30px; top: 15px; right: 15px; }
    .modal__header::after { width: calc(100% - 40px); }
    .modal__content { padding: 20px; height: calc(100% - 60px); }

    .content__bottom { height: 200px;}
    .content__bottom .link__box .text > span { font-size: 14px; }
    .content__bottom .link__box .text > p { font-size: 24px; }
    .content__bottom .link__box .arrow { width: 40px; height: 40px; margin-top: 20px; background-size: 16px; }

    .privacy,.privacy > dl > dt,.privacy > dl > dd,.sTxt h3 { font-size: 14px; }
    .privacy > h3 { font-size: 16px; }
}
@media screen and (max-width: 500px) {
    .content__bottom { flex-direction: column; }
    .content__bottom .link__box { width: 100%; justify-content: space-between; flex-direction: row; padding: 0 30px; }
    .content__bottom .link__box .text { text-align: left; }
    .content__bottom .link__box .text > p { margin-top: 4px; }
    .content__bottom .link__box .arrow { margin-top: 0; }
}