@charset "utf-8";

:root {

  --suit: 'SUIT';
  --archivo: "Archivo", sans-serif;
  --copper: "Copperplate Gothic Bold";
  /* --crimson: "Crimson Pro"; */
  --crimson: 'SUIT';


  --c-red:#D0151B;
  --c-red2:#A8080F;

  --headerH:100px;

  --round-16:16px; 

  --vh100: calc(var(--vh)*100);

  --font-40: 40px;
  --font-30: 30px;
  --font-25: 25px;
  --font-24: 24px;
  --font-20: 20px;
  --font-18: 18px;
  --font-16: 16px;
  --font-14: 14px;

  --sec-gap:150px;

  --row-160: 160px;
  --row-120: 120px;
  --row-100:100px;
  --row-80:80px;
  --row-60:60px;
  --row-50:50px;
  --row-40: 40px
}
@media screen and (max-width:1024px){
  :root {

    --headerH:60px;

    --font-40: 36px;
    --font-30: 26px;
    --font-25: 22px;
    --font-24: 20px;
    --font-20: 18px;
    --font-18: 16px;
    --font-16: 14px;
    --font-14: 12px;

    --sec-gap:100px;

    --row-160: 140px;
    --row-120: 100px;
    --row-100:80px;
    --row-80:60px;
    --row-60:40px;
    --row-50:40px;
    --row-40: 20px;
  }
}
@media screen and (max-width:768px){
  :root {
    --round-16:6px; 

    --font-40: 30px;
    --font-30: 24px;
    --font-25: 20px;
    --font-24: 18px;
    --font-20: 16px;

    --row-160: 120px;
    --row-120: 80px;
    --row-100:60px;
    --row-80:40px;
    --row-60:20px;
    --row-50:30px;
  }
}
@media screen and (max-width:480px){
  :root {
    --font-40: 26px;
    --font-30: 22px;
    --font-25: 18px;
    --font-18: 14px;
    --font-16: 12px;
    --font-14: 10px;

    --sec-gap:80px;

    --row-160: 100px;
    /* --row-50:20px; */
  }
}

html, body {background: #000;}

a {color: inherit; font-size: inherit; font-weight: inherit;}
img {max-width: 100%; vertical-align: top;}


.mt-120 {margin-top: var(--row-120);}
.mt-80 {margin-top: var(--row-80);}
.mt-60 {margin-top: var(--row-60);}

.inner {width: 90%; max-width: 1280px; margin: auto; }

/* font */
.archivo {font-family: var(--archivo);}
.suit {font-family: var(--suit);}
.copper {font-family: var(--copper);}
/* .crimson {font-family: var(--crimson); font-weight: 500;} */

/* color */
.c-eee {color: #eee;}


/* width */
.w-full {width: 100%;}


/* button */
.button {display: inline-flex; align-items: center; font-size: 20px; font-weight: 700; padding: 0 30px; height: 52px; line-height: 1; justify-content: space-between; transition: 0.3s; gap: 8px;}
.button.center {justify-content: center;}
.button.ty-m {width: 220px;}
.button.ty-s {width: 180px;}

.button.more {}
.button.more::after {content:""; width: 18px; height: 18px; background-size: cover; background-position: center; background-repeat: no-repeat; display: inline-block;}

.button.red {color: #fff; background: var(--c-red); }
.button.red.more::after {background-image: url(/img/com/icon_plus_white.svg);}
.button.red:hover {color: var(--c-red); background: #fff;}
.button.red.more:hover:after {background-image: url(/img/com/icon_plus_red.svg);}

.button.white {color: var(--c-red); background: #fff;}
.button.white.more:after {background-image: url(/img/com/icon_plus_red.svg);}
.button.white:hover {color: #fff; background: var(--c-red); }
.button.white.more:hover:after {background-image: url(/img/com/icon_plus_white.svg);}
@media screen and (max-width:1024px) {
  .button {font-size: 16px; padding: 0 20px; height: 48px;}
  .button.more::after {width: 14px; height: 14px;}

  .button.ty-m {width: 160px;}
  .button.ty-s {width: 140px;}
}
@media screen and (max-width:768px) {

}
@media screen and (max-width:480px) {
  .button {font-size: 14px; padding: 0 16px; height: 44px;}
  .button.ty-m {width: 140px;}
  .button.ty-s {width: 120px;}
}

/* animation */
.delay1 {transition-delay: 0.3s;}
.delay2 {transition-delay: 0.6s;}
.delay3 {transition-delay: 0.9s;}
.delay4 {transition-delay: 1.2s;}
.delay5 {transition-delay: 1.5s;}
.delay6 {transition-delay: 1.8s;}
.delay7 {transition-delay: 2.1s;}
/* up ani */
.ani-ty1 {transform: translateY(min(50%, 200px)); opacity: 0; transition-duration: 0.8s;}
.sc-ani .ani-ty1 {transform: translateY(0); opacity: 1;}
/* fade in */
.ani-ty2 {opacity: 0; transition-duration: 1.5s;}
.sc-ani .ani-ty2 {opacity: 1;}
/* down ani */
.ani-ty3 {transform: translateY(0); opacity: 1; transition-duration: 0.8s;}
.sc-ani .ani-ty3 {transform: translateY(50%); opacity: 0;}
/* fade out */
.ani-ty4 {opacity: 1; transition-duration: 1.5s;}
.sc-ani .ani-ty4 {opacity: 0;}
/* fade right */
.ani-ty5 {opacity: 0; transform: translateX(-50%); transition-duration: 0.8s;}
.sc-ani .ani-ty5 {opacity: 1; transform: translateX(0%);}
/* fade left */
.ani-ty6 {opacity: 0; transform: translateX(50%);  transition-duration: 0.8s;}
.sc-ani .ani-ty6 {opacity: 1;  transform: translateX(0%); }
/* fade down */
.ani-ty7 {transform: translateY(-50%); opacity: 0; transition-duration: 0.8s;}
.sc-ani .ani-ty7 {transform: translateY(0); opacity: 1;}

/* text type */
.txt-ty1 {font-size: 40px; font-weight: 700;}
.txt-ty2 {font-size: 50px; font-weight: 800;}
.txt-ty2 .light {font-weight: 400;}
.txt-ty3 {/*font-family: var(--crimson);*/ font-size: 25px; font-weight: 500; }
.txt-ty3-2 { font-size: 25px; font-weight: 400; margin-top: 0.8em}
.txt-ty4 {font-size: 70px; font-weight: 800; }
.txt-ty5 {font-size: 50px; font-weight: 700; }
.txt-ty6 {/*font-family: var(--crimson);*/ font-weight: 500; font-size: var(--font-20); letter-spacing: 0;}
@media screen and (max-width:1280px) {
  .txt-ty1 {font-size: 34px;}
  .txt-ty2 {font-size: 40px;}
  .txt-ty3, .txt-ty3-2 {font-size: 22px;}
  .txt-ty4 {font-size: 56px;}
  .txt-ty5 {font-size: 40px;}
}
@media screen and (max-width:1024px) {
  .txt-ty1 {font-size: 30px;}
  .txt-ty2 {font-size: 36px;}
  .txt-ty3, .txt-ty3-2 {font-size: 20px;}
  .txt-ty4 {font-size: 52px;}
  .txt-ty5 {font-size: 36px;}
}
@media screen and (max-width:768px) {
  .txt-ty1 {font-size: 26px;}
  .txt-ty2 {font-size: 32px;}
  .txt-ty3, .txt-ty3-2 {font-size: 18px;}
  .txt-ty4 {font-size: 48px;}
  .txt-ty5 {font-size: 32px;}
}
@media screen and (max-width:480px) {
  .txt-ty1 {font-size: 24px;}
  .txt-ty2 {font-size: 28px;}
  .txt-ty3, .txt-ty3-2 {font-size: 16px;}
  .txt-ty4 {font-size: 42px;}
  .txt-ty5 {font-size: 28px;}
}



/* s:header */
header {background: var(--c-red); width: 100%; position: fixed; left: 0; top: 0; z-index: 9999; }
header .inner {padding: 0 150px; width: 100%; max-width: 100%;}
.header .logo {width: 260px;}
.header {display: flex; justify-content: space-between; align-items: center; height: var(--headerH);}
.header .logo a {width: 120px; height: 50px;  font-size: 1px; color: rgba(0,0,0,0); background: url(/img/com/logo_w.png) center no-repeat; background-size: auto 100%; display: block;}
.header .navi {color: #fff; font-size: 20px; font-weight: 700; }
.header .navi .gnb {display: flex; align-items: center;}
.header .navi .gnb > li > a {height: var(--headerH); display: flex; align-items: center; padding: 0 30px; }

.header .navi .gnb .dep2-wrap {position: absolute; width: 100%; left: 0; top: var(--headerH); background: rgba(255,255,255,0.9); opacity: 0; transition: 0.4s; pointer-events: none; height: fit-content; }
.header .navi .gnb .dep2 {display: flex; justify-content: center; gap: 20px; padding: 0px; transition: 0.4s;  background: rgba(255,255,255,0.9);}
.header .navi .gnb .dep2 .brand-box {display: flex; gap: 20px; }
.header .navi .gnb .dep2 .brand-box > div {width: 250px; height: 150px; color: #fff; font-weight: 700; font-size: 18px; text-align: center;}
.header .navi .gnb .dep2 .brand-box a {width: 100%; height: 100%; display: flex; padding: 25px 0; flex-direction: column; gap: 18px; justify-content: end; align-items: center;}
.header .navi .gnb .dep2 .brand-box .map {display: none;}
.header .navi .gnb .dep2 .brand-box > div.k1 {background: var(--c-red);}
.header .navi .gnb .dep2 .brand-box > div.kyochon {background: #000;}
.header .navi .gnb .dep2 .brand-box .kyochon a {gap: 36px;}
.header .navi .gnb .dep2 ul {display: flex; gap: 20px; max-width: 620px; flex-wrap: wrap;}
.header .navi .gnb .dep2:has(.brand-box) ul {max-width: 300px;}
.header .navi .gnb .dep2 ul li a {background: #f4f4f4; display: flex; align-items: center; justify-content: start; padding: 0 25px; width: 300px; height: 65px; position: relative; gap: 20px; font-weight: 700; font-size: 20px; color: #000; }
.header .navi .gnb .dep2 ul li a::after {content:""; width: 100%; height: 100%; border: 2px solid var(--c-red); position: absolute; left: 0; top: 0; opacity: 0;  transition: 0.4s; box-sizing: border-box;}
.header .navi .gnb .dep2 ul li a::before {content:""; width: 12px; height: 12px; border: solid #aaa; position: absolute; right: 30px; top: 50%; transform:translateY(-50%) rotate(45deg); border-width: 2px 2px 0px 0; box-sizing: border-box;}
.header .navi .gnb .dep2 ul li a .icon {width: 25px; height: 25px; display: block; font-size: 0;}

/* .header .navi .gnb > li:hover .dep2-wrap { opacity: 1; transition: 0.4s; pointer-events: auto;} */
/* .header .navi .gnb > li:hover .dep2 {padding: 20px;} */

.header .navi .gnb .active .dep2-wrap { opacity: 1; transition: 0.4s; pointer-events: auto;}
.header .navi .gnb .active .dep2 {padding: 20px;}
.header .navi .gnb .dep2 ul li a:hover:after {opacity: 1;}

.header .sitemap {width: 260px; display: flex; align-items: center; gap: 60px;}
.header .sitemap .inquiry-btn a {font-weight: 700; font-size: var(--font-20); padding: 0 12px; color: #fff; /*background: #fff;*/ display: flex; align-items: center; justify-content: center; height: 45px;}
.header .sitemap .sitemap-btn {height: 30px; width: 30px; margin-left: auto; position: relative; cursor: pointer;}
.header .sitemap .sitemap-btn span {width: 100%; height: 3px; background: #fff; position: absolute; right: 0; }
.header .sitemap .sitemap-btn span:nth-child(1) {top: 3px;}
.header .sitemap .sitemap-btn span:nth-child(2) {top: 50%; transform: translateY(-50%); width: 24px; }
.header .sitemap .sitemap-btn span:nth-child(3) {bottom: 3px;}
 
.header .sitemap .sitemap-layer {position: absolute; right: 0; top: var(--headerH); width: 100%; background: #fff; opacity: 0; pointer-events: none; padding: 0; transition: 0.4s;}
.header .sitemap .sitemap-layer .site-navi {}
.header .sitemap .sitemap-layer .site-navi .site-gnb {display: flex; gap: 150px; justify-content: center;}
.header .sitemap .sitemap-layer .site-navi .site-gnb > li {width: 200px; text-align: center;}
.header .sitemap .sitemap-layer .site-navi .site-gnb > li > a {font-weight: 800; font-size: 25px; color: #000; }
.header .sitemap .sitemap-layer .site-navi .site-gnb .dep2-wrap {margin-top: 30px;}
.header .sitemap .sitemap-layer .site-navi .dep2 {}
.header .sitemap .sitemap-layer .site-navi .dep2 li + li {margin-top: 20px;}
.header .sitemap .sitemap-layer .site-navi .dep2 a {font-weight: 700; font-size: 20px; color: #000; transition: 0.2s; }
.header .sitemap .sitemap-layer .site-navi .dep2 a:hover {color: var(--c-red);}
.header .sitemap .sitemap-layer .site-navi .dep2 .brand-box {}
.header .sitemap .sitemap-layer .site-navi .dep2 .brand-box > div {margin-bottom: 20px;}
.header .sitemap .sitemap-layer .site-navi .dep2 .brand-box .logo {display: none; font-size: 0;}
.header .sitemap .sitemap-layer .site-navi .dep2 .brand-box span:not(.map) {display: none;}
.header .sitemap .sitemap-layer .site-navi .dep2 .icon {display: none;}

.header .sitemap .sitemap-layer .sns-list {left: 50%; top: 40px; transform: translateX(calc(-50% + 720px)); position: absolute;}
.header .sitemap .sitemap-layer .sns-list li {margin-bottom: 20px;}
.header .sitemap .sitemap-layer .sns-list a {display: block; width: 50px; height: 50px; border-radius: 50%; box-shadow: 0 0 10px 0 rgba(0,0,0,0.1); background-position: center; background-repeat: no-repeat; }
.header .sitemap .sitemap-layer .sns-list a.instar {background-image: url(/img/com/icon_instar.svg);}
.header .sitemap .sitemap-layer .sns-list a.youtube {background-image: url(/img/com/icon_youtube.svg);}
.header .sitemap .sitemap-layer .sns-list a.tictok {background-image: url(/img/com/icon_tictok.svg);}

.header .sitemap.active .sitemap-btn {}
.header .sitemap.active .sitemap-btn span {left: 50%; top: 50% !important; transform: translate(-50%,-50%) rotate(45deg);}
.header .sitemap.active .sitemap-btn span:nth-child(2) {opacity: 0;}
.header .sitemap.active .sitemap-btn span:nth-child(3) { transform:translate(-50%,-50%) rotate(-45deg); }
.header .sitemap.active .sitemap-layer {padding: 40px 0 60px; opacity: 1; pointer-events: auto;}

@media screen and (max-width:1600px){
  .header .sitemap .sitemap-layer .sns-list {left: unset; right: 3%; transform: unset;}

  .header .sitemap .sitemap-layer .site-navi .site-gnb {gap: 100px;}
}
@media screen and (max-width:1460px){
  header .inner {padding: 0 5%;}

  .header .sitemap .sitemap-layer .site-navi .site-gnb {gap: 50px;}
}
@media screen and (max-width:1280px) {
  .header .sitemap .sitemap-layer .site-navi .site-gnb > li {width: 180px;}
}
@media screen and (max-width:1024px) {
  header .inner {padding: 0 16px;}
  .header .navi {display: none;}
  .header .logo {width: unset;}
  .header .logo a {width: 70px; height: 30px;}

  .header .sitemap {gap: unset; width: 170px;}
  .header .sitemap .inquiry-btn a {font-size: 14px; height: 36px;}
  .header .sitemap .sitemap-btn span {height: 2px; width: 25px;}
  .header .sitemap .sitemap-btn span:nth-child(1) {top: 5px;}
  .header .sitemap .sitemap-btn span:nth-child(2) {width: 20px;}
  .header .sitemap .sitemap-btn span:nth-child(3) {bottom: 5px;}

  /* sitemap mobile */
  .header .sitemap .sitemap-layer {max-width: 375px; width: 100%; height: calc(100vh - var(--headerH)); padding: 20px 0 100px;}
  .header .sitemap.active .sitemap-layer {padding: 20px 0 100px;}
  .header .sitemap .sitemap-layer .site-navi {height: 100%; overflow: auto;}
  .header .sitemap .sitemap-layer .site-navi .site-gnb {flex-direction: column; gap: 0;}
  .header .sitemap .sitemap-layer .site-navi .site-gnb > li {width: 100%; text-align: left;}
  .header .sitemap .sitemap-layer .site-navi .site-gnb > li > a {padding: 0 16px; font-size: 20px; font-weight: 800; display: flex; height: 60px; align-items: center; position: relative;}
  .header .sitemap .sitemap-layer .site-navi .site-gnb > li > a::before,
  .header .sitemap .sitemap-layer .site-navi .site-gnb > li > a::after {content:""; width: 18px; height: 2px; background: var(--c-red); position: absolute; right: 16px; top: 50%; transform: translateY(-50%);}
  .header .sitemap .sitemap-layer .site-navi .site-gnb > li > a::after {transform: translateY(-50%) rotate(90deg); transition: 0.3s;}
  .header .sitemap .sitemap-layer .site-navi .site-gnb .dep2-wrap {margin-top: 0; padding: 20px 16px; background: #F8F8F8; display: none;}
  .header .sitemap .sitemap-layer .site-navi .dep2 li + li {margin-top: 10px;}
  .header .sitemap .sitemap-layer .site-navi .dep2 a {display: flex; font-size: 18px; font-weight: 700; gap: 15px; height: 50px; padding: 0 20px; align-items: center;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .icon {display: block; width: 20px; height: 20px;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box > div {margin-bottom: 10px;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box a {height: 70px; color: #fff; flex-direction: row-reverse; justify-content: space-between;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box span:not(.map) {display: block;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box a .map {display: none;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box a .logo {display: block;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box .k1 {background: var(--c-red);}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box .k1 .logo {width: 42px; margin-right: 29px;}
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box .kyochon {background: #000; }
  .header .sitemap .sitemap-layer .site-navi .dep2 .brand-box .kyochon .logo {width: 100px;}

  .header .sitemap .sitemap-layer .site-navi .site-gnb > li.active > a::after {transform: translateY(-50%) rotate(00deg);}

  .header .sitemap .sitemap-layer .sns-list {left: 16px; bottom: 30px; top: unset; right: unset;}
  .header .sitemap .sitemap-layer .sns-list ul {display: flex; gap: 10px;}
  .header .sitemap .sitemap-layer .sns-list li {margin-bottom: 0;}
  .header .sitemap .sitemap-layer .sns-list a {width: 40px; height: 40px; background-size: 24px;}
}
@media screen and (max-width:768px) {

}
@media screen and (max-width:480px) {
  .header .sitemap {width: 155px;}
  .header .sitemap .inquiry-btn a {height: 32px; padding: 0 16px;}
  .header .sitemap .sitemap-layer {max-width: 100%;}
}
/* e:header */


/* etc */
.hide {width: 0; height: 0; overflow: hidden; font-size: 1px; color: transparent; position: absolute; left: 0;top: 0; z-index: -200;}
.ta-l {text-align: left;}
.ta-c {text-align: center;}
.ta-r {text-align: right;}

.mg-a {margin: auto;}







/* s:footer */
#footer {background: #000; width: 100%;  position: relative; }
#footer .rolling {padding: 40px 0; width: 100%; overflow: hidden;}
#footer .rolling .f-roll-slide .swiper-wrapper {transition-timing-function: linear !important; position: relative;}
#footer .rolling .f-roll-slide .swiper-slide {width: auto;  padding: 0 50px;}
#footer .rolling .f-roll-slide .swiper-slide span {display: block; font-size: 0; height: 50px;}
#footer .rolling .f-roll-slide .swiper-slide span img {height: 100%;}

.footer {padding: 32px 0 48px; font-size: var(--font-16);  color: #fff; overflow: hidden;}
.footer .inner {max-width: 1440px; width: 90%; display: flex; align-items: start; justify-content: space-between;}
.footer .left .f-info {}
.footer .left .f-info .address { display: flex;}
.footer .left .f-info .address p {}
.footer .left .f-info .address p:not(:last-child):after {content:""; width: 1px; height: 10px; display: inline-block; margin: 0 10px; background: #333; vertical-align: baseline; }
.footer .left .f-info .address p .br {display: none;}
.footer .left .f-info .close {display: none; position: absolute; width: 15px; height: 15px; right: 15px; top: 15px; font-size: 1px; color: transparent;}
.footer .left .f-info .close::before,
.footer .left .f-info .close::after {content:""; width: 1px; height: 15px; background: var(--c-red); position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(45deg);}
.footer .left .f-info .close::after {transform: translate(-50%,-50%) rotate(-45deg);}
/* .footer .left .f-info .address .mo {display: none;} */

.footer .copyright {color: #666; margin-top: 8px; letter-spacing: 0px;}

.footer .right {display: flex;}
.footer .right .f-layer-btn {display: none;}
.footer .right .f-layer-btn::after {content:""; width: 1px; height: 10px; background: #333; display: inline-block; margin: 0 10px; vertical-align: middle;}


@media screen and (max-width:1280px) {
}
@media screen and (max-width:1024px) {
  #footer .rolling .f-roll-slide .swiper-slide {padding: 0 40px;}
  #footer .rolling .f-roll-slide .swiper-slide span {height: 40px;}

  .footer .inner {flex-direction: column-reverse; gap: 24px;}
  .footer .right {width: 100%; text-align: right;}
}
@media screen and (max-width:768px) {
  .footer {font-size: 14px;}
  .footer .inner {gap: 20px;}
  .footer .left .f-info {position: absolute; padding: 15px; padding-right: 40px; background: #fff; color: #000; width: 300px; z-index: 20; left: 5%; bottom: 125px; display: none;}
  .footer .left .f-info.open {display: block;}
  .footer .left .f-info .address {flex-wrap:wrap; row-gap: 10px; }
  .footer .left .f-info .address p::after {background: #ccc;}
  .footer .left .f-info .address p:nth-child(2):after {display: none;}
  .footer .left .f-info .address p:last-child {width: 100%; }
  .footer .copyright {margin-top: 0;}

  .footer .right .f-layer-btn {display: inline-block;}
  .footer .left .f-info .close {display: block;}
}
@media screen and (max-width:480px) {
  .footer {padding: 20px 0 40px;}
  .footer .left .f-info {width: 90%; max-width: 286px; bottom: 120px;}
  .footer .copyright {font-size: 12px;}

  #footer .rolling {padding: 20px 0;}
  #footer .rolling .f-roll-slide .swiper-slide {padding: 0 20px;}
  #footer .rolling .f-roll-slide .swiper-slide span {height: 30px;}

}
/* e:footer */

/* quick menu */
.quick-menu {position: fixed; right: 40px; bottom: 0px; z-index: 500; padding-bottom: 40px;}
.quick-menu ul li {width: 60px; margin-bottom: 10px;}
.quick-menu ul li a {width: 100%; padding-top: 100%; border-radius: 50%; background-position: center; background-repeat: no-repeat; display: block;}
.quick-menu ul li a.sns {background-color: #fff;}
.quick-menu ul li a.inquiry {background-color: var(--c-red);  position: relative;}
.quick-menu ul li a.inquiry > div {display: flex; flex-direction: column; justify-content: center; align-items: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.quick-menu ul li a.inquiry span {font-size: 12px; color: #fff; text-align: center; font-weight: 500;}
.quick-menu ul li a.instar {background-image: url(/img/com/icon_instar.svg);}
.quick-menu ul li a.youtube {background-image: url(/img/com/icon_youtube.svg);}
.quick-menu ul li a.tictok {background-image: url(/img/com/icon_tictok.svg);}
.quick-menu ul li a.top {background-color: var(--c-red); background-image: url(/img/com/icon_top.svg);}

.quick-menu ul li a.more-btn {display: none; background: var(--c-red); position: relative;}
.quick-menu ul li a.more-btn span {position: absolute; left: 0; width: 100%; top: 50%; transform: translateY(-50%); color: #fff; font-size: 14px; text-align: center;}
.quick-menu ul li a.more-btn::before {content:""; width: 16px; height: 2px; background: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); opacity: 0;}

.quick-menu ul li.bundle.open a.more-btn span {opacity: 0;}
.quick-menu ul li.bundle.open a.more-btn::before {opacity: 1;}


@media screen and (max-width:1280px) {
  
}
@media screen and (max-width:1024px) {
  .quick-menu {right: 3%;}
  .quick-menu ul li {width: 48px;}
  .quick-menu ul li a {background-size: 25px;}

  .quick-menu ul li a.inquiry span.txt {display: none;}
}
@media screen and (max-width:768px) {
  .quick-menu {padding-bottom: 24px;}
  .quick-menu ul li {width: 40px;}
  .quick-menu ul li a {background-size: 22px;}

  .quick-menu ul li a.inquiry span.img {width: 20px;}

  .quick-menu ul li a.more-btn {display: block; }
  .quick-menu ul li.bundle ul {display: none;}
  .quick-menu ul li.bundle.open ul {display: block;}
}
@media screen and (max-width:480px) {
  
}