@charset "euc-kr";

/* ¼­ºêÇì´õ css*/
/* »ó´ÜÇì´õ */
.sub-body {margin-top: 90px;}
.header {position: fixed; top: 0; left: 0; width: 100%; height: 90px; overflow: hidden; transition: all 0.5s; z-index: 9999;}
/* .header::after {content: ""; position: absolute; top: 90px; left: 0; width: 100%; height: 1px; background: #ddd;} */
.header.on {
    position: fixed;
    top: 0;
    /* background: rgba(255,255,255,0.9); */
    background: #333;
}
.sub-header #logo-white {display: none;}
.sub-header #logo-black {display: block;}
.sub-header .header-gnb .gnb-depth-1 > .depth-1 {margin-left: 30px;}
.sub-header .header-gnb .gnb-depth-1 > .depth-1 > a:after {
    position: absolute; left: 50%; right: 50%; height: 2px; bottom: 20px; content: ''; background-color: #000; transition: 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55); transform: translate3d(0, 0, 0); opacity: 0;
}
.sub-header .header-gnb .gnb-depth-1 .depth-1-1 {margin-left: 0px;}
.sub-header .header-gnb .gnb-depth-1 > .depth-1 > a.on:after {background-color: #fff;}

.sub-header .header-gnb .gnb-depth-1 > .depth-1 > a:hover::after {left: 12px; right: 12px; opacity: 1;}
.sub-header .header-gnb .gnb-depth-1 > .depth-1 > a span {font-weight: normal; font-size: 1.7rem; color: #000;}
.sub-header .header-gnb .gnb-depth-1 > .depth-1 > a span.on {color: #fff;}

.sub-header .header-inner .contact-btn button {padding: 12px 50px; border-radius: 30px; transition: all 0.3s; border: 1px solid #000; color: #000 ; font-size: 1.8rem; font-weight: 500;}
.sub-header .header-inner .contact-btn button.on {border: 1px solid #f4f4f4; color: #fff}
.sub-header .header-inner .contact-btn button:hover {background-color: #191919; border: 1px solid #191919; color: #fff !important;}
.sub-header .header-inner .contact-btn button.on:hover {background-color: #fff; border: 1px solid #fff; color: #191919 !important;}


/* ¸ð¹ÙÀÏ ¸Þ´º */
.sub-header .mobile-gnb {display: none;}
.sub-header .mobile-gnb .sidebar-btn {position: relative; width: 65px; height: 65px; z-index: 1; cursor: pointer; background-color: transparent;}

.sub-header .mobile-gnb .sidebar-btn span {display: block; position: absolute; left: 20px; width: 24px; height: 2px; background-color: #000;}

.sub-header .mobile-gnb .sidebar-btn span.on {background-color: #fff;}
.sub-header .mobile-gnb .sidebar-btn span:nth-child(1) {top: 22px;}
.sub-header .mobile-gnb .sidebar-btn span:nth-child(2) {top: 32px; transition: opacity 0s 0.15s;}
.sub-header .mobile-gnb .sidebar-btn span:nth-child(3) {top: 42px;}
.sub-header .mobile-gnb .sidebar-btn span:nth-child(1),
.sub-header .mobile-gnb .sidebar-btn span:nth-child(3) {transition: top 0.15s 0.15s, transform 0.15s, width 0.15s, left 0.15s;}
.sub-header .mobile-gnb.open .sidebar-btn span:nth-child(2) {opacity: 0; transition: opacity 0.15s;}
.sub-header .mobile-gnb.open .sidebar-btn span:nth-child(1), 
.sub-header .mobile-gnb.open .sidebar-btn span:nth-child(3) {top: 32px; width: 30px; transition: top 0.15s, transform 0.15s 0.15s, width 0.15s 0.15s, left 0.15s 0.15s;}
.sub-header .mobile-gnb.open .sidebar-btn span:nth-child(1) {left: 18px; transform: rotate(45deg);}
.sub-header .mobile-gnb.open .sidebar-btn span:nth-child(3) {left: 18px; transform: rotate(-45deg);}

.sub-header .mobile-gnb .sidebar-wrap {
  position: fixed; width: 100%; height: 100%; top: 65px; left: 0; background-color: rgba(0,0,0,0.6); transition: all 0.5s; visibility: hidden; opacity: 0;
}
.sub-header .mobile-gnb.open .sidebar-wrap {visibility: visible; opacity: 1;}
.sub-header .mobile-gnb .sidebar-wrap .sidebar {position: absolute; 
  top: 0; right: 0; width: 100%; max-width: 375px; height: calc(100vh - 65px); background-color: #fff; transform: translateX(100%); transition: all 0.5s;
}
.sub-header .mobile-gnb.open .sidebar-wrap .sidebar {transform: translateX(0);}
.sub-header .mobile-gnb .gnb-depth-1 {height: 100%; overflow-y: auto;}


.sub-header .mobile-gnb .gnb-depth-1 .depth-1 {position: relative; transition: all .2s ease-in-out;}
.sub-header .mobile-gnb .gnb-depth-1 .depth-1:hover {background-color: #C8214F;}
.sub-header .mobile-gnb .gnb-depth-1 .depth-1:hover span {color: #fff;}

.sub-header .mobile-gnb .gnb-depth-1 .depth-1 span {color: #3D5469;}
.sub-header .mobile-gnb .gnb-depth-1 .depth-1:first-child > a {border-top: 1px solid #e9e9e9;}
.sub-header .mobile-gnb .gnb-depth-1 .depth-1 > a {display: flex; align-items: center; position: relative; padding: 0 60px 0 25px; height: 60px; font-size: 17px; font-weight: 500; border-bottom: 1px solid #e9e9e9;}
.sub-header .mobile-gnb .gnb-depth-1 .depth-1 > a > span {position: relative; display: block; line-height: normal; transition: all .3s; color: #3D5469;}
.sub-header .mobile-gnb .gnb-depth-1 .depth-1 > a > span::before {
    content: ""; display: block; position: absolute; left: -2px; bottom: 0; width: 0; height: 9; transition: all 0.5s; transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1); z-index: -1; background-color: #D0C09E;
}
.sub-header .mobile-gnb .gnb-depth-1 .depth-1.current > a > span::before {
    content: ""; display: block; width: calc(100% + 4px);
}

/* ¸ð¹ÙÀÏ ¸Þ´º ³¡ */
@media (max-width: 900px) {
  .sub-header .mobile-gnb {display: block;}
}
@media (max-width: 1024px) {
  .sub-header .header-gnb {display: none;}
}
@media (max-width: 1280px) {
  .header {position: fixed; width: 100%; height: 90px;}
  .header .header-logo {top: 12px; padding-left: 20px;}
  .header .header-logo img {width: 200px;}

  .header::after {content: none;}
  .sub-header .sub-mobile-gnb .sidebar-wrap {top: 65px;}
}
@media (max-width:500px) {
    html.not-scroll .header .header-logo {opacity: 1;}
    .sub-header .mobile-gnb .sidebar-wrap .sidebar {max-width: 100%;}
}
@media (max-width: 1240px) {
    .header .header-logo {padding: 0}
}
@media (min-width: 901px) {
  .sub-header .header-gnb {display: block;}
  .sub-header .header-inner {padding: 0 20px;}
  .sub-header .header-logo {padding-left: 0px;}
}
@media (min-width: 1080px) {
  .contact-btn {display: block;}
}
@media (min-width: 1240px) {
  .sub-header .header-gnb .gnb-depth-1 > .depth-1 {margin-left: 50px;}
}


/* sub common css */
/* .sub-wrap .sub-inner {padding: 100px 0;} */
.sub-wrap .sub-inner .con {padding: 100px 0;}
.sub-wrap .sub-inner .con .sub-title p {font-size: clamp(1.8rem,2.5vw,2.4rem); color: #C8214F; text-align: center; font-weight: 600; margin-bottom: 20px;}
.sub-wrap .sub-inner .con .sub-title h2 {font-size: clamp(2.8rem,2.5vw,3.2rem); text-align: center; font-weight: 700;}
.sub-wrap .sub-inner .con .sub-title h3 {font-size: clamp(1.4rem,2.5vw,1.6rem); font-weight: 600; text-align: center;margin-bottom: 10px; display: block; color: #616161; margin-top: 20px; line-height: 1.4;}


/* homepage css */
.sub-wrap .sub-inner .con1 {padding-bottom: 0; margin-top: 50px;}
.sub-wrap .sub-inner .con1 .img {text-align: center; margin: 60px auto 0 auto;}
.sub-wrap .sub-inner .con1 .content-wrap {background-color: #F3F4F8; padding: 140px 0 100px 0; margin-top: -100px;}
.sub-wrap .sub-inner .con1 .content-wrap .content-list {display: flex; flex-wrap: wrap; gap: 60px;}
.sub-wrap .sub-inner .con1 .content-wrap .content-list li {width: 100%; text-align: center;}
.sub-wrap .sub-inner .con1 .content-wrap .content-list li img {margin-bottom: 30px;}
.sub-wrap .sub-inner .con1 .content-wrap .content-list li h3 {font-size: 2.4rem; font-weight: 800; margin-bottom: 10px;}
.sub-wrap .sub-inner .con1 .content-wrap .content-list li span {font-size: 1.6rem; font-family: 'Montserrat', 'san-serif'; font-weight: 600; margin-bottom: 40px; display: block;}
.sub-wrap .sub-inner .con1 .content-wrap .content-list li .text-list {text-align: center; display: flex; flex-direction: column; gap: 16px;}
.sub-wrap .sub-inner .con1 .content-wrap .content-list li .text-list>li {font-size: 1.6rem; font-weight: 500;}

.sub-wrap .sub-inner .con2 {padding: 0;}

.sub-wrap .sub-inner .process .process-list {display: flex; gap: 40px; flex-wrap: wrap; justify-content: center; margin-top: 80px;}
.sub-wrap .sub-inner .process .process-list li {width: 180px; height: 180px; border-radius: 50%; border: 1px solid #000; display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative;}

.sub-wrap .sub-inner .process .process-list li span {font-size: 1.5rem; font-weight: 600; margin-bottom: 6px;}
.sub-wrap .sub-inner .process .process-list li p {font-size: 1.8rem; font-weight: 800;}

.sub-wrap .sub-inner .con3 {background-color: #F3F4F8;}
.sub-wrap .sub-inner .con3 .price-list {display: flex; gap: 40px; justify-content: center; flex-wrap: wrap; margin-top: 80px;}
.sub-wrap .sub-inner .con3 .price-list>li {width: 100%; background-color: #fff; padding: 30px 34px; border-radius: 20px;}
.sub-wrap .sub-inner .con3 .price-list>li span {background-color: #FFF3F5; color: #C8214F; display: inline-block; padding: 5px 15px; font-size: 1.6rem; font-weight: 700;}
.sub-wrap .sub-inner .con3 .price-list>li em {display: block; color: #C8214F; font-size: 3.2rem; font-weight: 800; margin: 40px 0;}
.sub-wrap .sub-inner .con3 .price-list>li em small {font-size: 2.4rem; font-weight: 400;}
.sub-wrap .sub-inner .con3 .price-list>li .range-list {padding-top: 30px; border-top: 1px dashed #BABABA;}
.sub-wrap .sub-inner .con3 .price-list>li .range-list p {font-size: 1.5rem; color: #898B90; font-weight: 400; margin-bottom: 10px;}
.sub-wrap .sub-inner .con3 .price-list>li .range-list li {background: url('../images3/homepage/check.png') no-repeat left center; padding-left: 30px; font-size: 1.5rem; color: #333333; font-weight: 500; line-height: 2.2;}
.sub-wrap .sub-inner .con4 .service-list {display: flex; gap: 40px; justify-content: center; flex-wrap: wrap; margin-top: 100px;}
.sub-wrap .sub-inner .con4 .service-list>li {width: calc((100% - 40px)/2); display: flex; flex-direction: column; justify-content: center; text-align: center;}
.sub-wrap .sub-inner .con4 .service-list>li img {max-width: 20%; margin: 0 auto;}
.sub-wrap .sub-inner .con4 .service-list>li p {font-size: clamp(2.4rem,2.5vw,2.8rem); font-weight: 600; margin-top: 32px;}
.sub-wrap .sub-inner .con4 .service-list>li span {font-size: clamp(1.4rem,2.5vw,1.6rem); font-weight: 400; margin: 8px 0 40px 0; display: block;}

@media all and (min-width: 768px) {
  /* .sub-wrap .sub-inner .con {padding: 100px 0;} */
  /* .sub-wrap .sub-inner .con1 .content-wrap {padding: 180px 0 100px 0} */
  .sub-wrap .sub-inner .con1 .content-wrap {padding: 380px 0 100px 0; margin-top: -300px;}
  .sub-wrap .sub-inner .con1 .content-wrap .content-list {gap: 40px;}
  .sub-wrap .sub-inner .con1 .content-wrap .content-list>li {width: calc((100% - 80px)/3);}
  .sub-wrap .sub-inner .process .process-list li::after {content: ''; width: 24px; height: 24px; display: block; background: url('../images3/homepage/arrow-right.png') no-repeat; position: absolute; right: -33px; top: 50%; transform: translateY(-50%);}
  .sub-wrap .sub-inner .process .process-list li:last-child::after {content: none;}
  .sub-wrap .sub-inner .con4 .service-list>li {width: calc((100% - 120px)/4);}
  /* .sub-wrap .sub-inner .con4 .service-list>li {width: calc((100% - 40px)/2);} */

  .sub-wrap .sub-inner .con .sub-title h3 span {display: block;}
}
@media all and (min-width: 1280px) {
  .sub-wrap .sub-inner .con3 .price-list>li {width: calc((100% - 80px)/3);}

  .sub-wrap .sub-inner .con4 .service-list>li {width: calc((100% - 120px)/4);}
}

/* homepage css end */

/* shoppingmall css */
.shoppingmall-inner .con1 .contents {display: flex; gap: 40px; flex-wrap: wrap; align-items: center; margin: 80px auto 100px auto; justify-content: center;}
.shoppingmall-inner .con1 .contents .img {text-align: left; margin: 0;}
.shoppingmall-inner .con1 .contents .text ul {display: flex; flex-direction: column; gap: 20px;}
.shoppingmall-inner .con1 .contents .text ul li {font-size: clamp(1.6rem,2.5vw,2rem); font-weight: 500; background: url('../images3/shoppingmall/check.png') no-repeat left center; padding-left: 48px; line-height: 2;}

.shoppingmall-inner .con2 .content-wrap {background-color: #191919;}
.shoppingmall-list {display: flex; flex-wrap: wrap; gap: 40px; justify-content: center; padding: 80px 0;}
.shoppingmall-list li {color: #fff; text-align: center; width: 100%;}
.shoppingmall-list li p {font-size: clamp(2rem,2.5vw,2.4rem); font-weight: 600; margin: 40px 0 30px 0;}
.shoppingmall-list li span {font-size: 1.6rem; font-weight: 400; color: #bbb; line-height: 1.5;}

.sub-wrap .sub-inner .function {background-color: #F3F4F8;}
.function-list {display: flex; flex-wrap: wrap; gap: 40px; margin-top: 80px; justify-content: center;}
.function-list .list-item {background-color: #fff; border-top: 3px solid #C8214F; padding: 40px 30px; position: relative; height: 300px; width: 100%;}
.function-list .list-item::before {content: ''; display: block; width: 40px; height: 40px; position: absolute; bottom: 10%; right: 10%;}
.function-list .list-item:nth-child(1):before {background: url('../images3/shoppingmall/function01.png');}
.function-list .list-item:nth-child(2):before {background: url('../images3/shoppingmall/function02.png');}
.function-list .list-item:nth-child(3):before {background: url('../images3/shoppingmall/function03.png');}
.function-list .list-item:nth-child(4):before {background: url('../images3/shoppingmall/function04.png');}
.function-list .list-item:nth-child(5):before {background: url('../images3/shoppingmall/function05.png');}
.function-list .list-item:nth-child(6):before {background: url('../images3/shoppingmall/function06.png');}
.function-list .list-item:nth-child(7):before {background: url('../images3/shoppingmall/function07.png');}
.function-list .list-item:nth-child(8):before {background: url('../images3/shoppingmall/function08.png');}
.function-list .list-item p {font-size: 2.4rem; font-weight: 700; margin-bottom: 40px; text-align: center;}
.function-list .list-item .list-content {display: flex; flex-direction: column; gap: 10px;}
.function-list .list-item .list-content>li {font-size: 1.6rem; font-weight: 500; background: url('../images3/shoppingmall/check.png') no-repeat left top; padding-left: 28px;}
.function-list .list-item .list-content>li>ul {margin-top: 10px; display: flex; flex-direction: column; gap: 8px;}


@media all and (min-width: 768px) {
  .shoppingmall-list li {width: calc((100% - 120px)/4);}
  
  .function-list .list-item {width: calc((100% - 40px)/2); padding: 60px 30px; height: 400px;}
}

@media all and (min-width: 1280px) {
  .function-list .list-item {width: calc((100% - 120px)/4);}
}
/* shoppingmall css end */

/* program css */
  .program-con {background-color: #F3F4F8;}
  .program-list {display: flex; flex-wrap: wrap; gap: 40px;}
  .program-list>li {background-color: #fff; border-top: 3px solid #000; display: flex; padding: 40px 30px; width: 100%; gap: 20px; flex-wrap: wrap; align-items: center;}
  .program-list>li .left {width: 100%;}
  .program-list>li .left p {font-size: 2.4rem; font-weight: 700; margin: 15px 0 10px 0;}
  .program-list>li .left span {display: block; font-size: 2rem; font-weight: 600; color: #DBDBDB; margin-bottom: 30px;}
  .program-list>li .left button {padding: 10px 24px; border-radius: 20px; transition: all 0.3s; background-color: #C8214F; color: #fff; font-size: 1.6rem;}
  .program-list>li .left button:hover {background-color: #191919; color: #fff;}
  .program-list>li .right {width: 100%;}
  .program-list>li .right ul {display: flex; flex-direction: column; gap: 16px;}
  .program-list>li .right ul li {font-size: 1.6rem; font-weight: 500;}
  .certificate {background-color: #F3F4F8;}
  .certificate-list {display: flex; flex-wrap: wrap; gap: 40px; justify-content: center; margin-top: 80px; width: 100%;}
  .certificate-list>li {width: calc((100% - 40px)/2);}
  .certificate-list>li p {font-family: 'Monterrat', 'san-serif'; font-size: 1.8rem; font-weight: 300; color: #fff; background-color: #000; text-align: center; padding: 16px 0;}

  @media all and (min-width: 451px) {
    .program-list>li {padding: 40px 50px 60px 50px; gap: 5%;}
    .program-list>li .left {width: 45%;}
    .program-list>li .right {width: 50%;}
  }

  @media all and (min-width: 501px) {
  .certificate-list>li {width: 208px;}
  }
  @media all and (min-width: 768px) {
  .program-list>li .left span {margin-bottom: 40px;}
  .program-list>li .right ul li {font-size: 1.7rem;}
  }
  @media all and (min-width: 1024px) {
    .program-list>li {width: calc((100% - 40px)/2);}
  }
/* program css end */

/* about us css */
  .sub-wrap .about-inner .con1 .sub-title h2 {font-family: 'Montserrat', sans-serif !important; font-size: 3.2rem; font-weight: 900;}
  .sub-wrap .about-inner .con1 .contents {margin-top: 60px;}
  .sub-wrap .about-inner .con1 .contents .text {text-align: center;}
  .sub-wrap .about-inner .con1 .contents .text span {font-size: clamp(1.8rem,2.5vw,2rem); font-weight: 600; text-align: center; line-height: 1.5;}
  .sub-wrap .about-inner .con1 .contents .text .ceo {margin-top: 60px;}
  .sub-wrap .about-inner .con1 .contents .text .ceo p {font-size: 1.8rem; font-weight: 500; }
  .sub-wrap .about-inner .con1 .contents .text .ceo p em {font-size: 2rem; font-weight: 700;}
  .sub-wrap .about-inner .con1 .contents .img {border-radius: 25px; overflow: hidden; font-size: 0;}


  .whatwedo .sub-title h2{text-align: left !important; font-weight: 900 !important; margin-bottom: 40px;}
  .whatwedo .content-wrap .whatwedo-list {display: flex; gap: 40px; flex-wrap: wrap;}
  .whatwedo .content-wrap .whatwedo-list li {border-bottom: 3px solid #000; padding-bottom: 50px; width: 100%; padding-left: 20px;}
  .whatwedo .content-wrap .whatwedo-list li p {font-size: 2rem; font-weight: 700; margin-bottom: 16px;}
  .whatwedo .content-wrap .whatwedo-list li span {font-family: 'Montserrat', 'san-serif'; font-size: 1.6rem; font-weight: 600; padding-left: 48px;}
  .whatwedo .content-wrap .whatwedo-list li:nth-child(1) p {background: url('../images3/about/webmoblie.png') no-repeat left center; padding-left: 48px;}
  .whatwedo .content-wrap .whatwedo-list li:nth-child(2) p {background: url('../images3/about/shoppingmall.png') no-repeat left center; padding-left: 48px;}
  .whatwedo .content-wrap .whatwedo-list li:nth-child(3) p {background: url('../images3/about/webprogram.png') no-repeat left center; padding-left: 48px;}
  .whatwedo .content-wrap .whatwedo-list li:nth-child(4) p {background: url('../images3/about/maintenance.png') no-repeat left center; padding-left: 48px;}

  @media all and (min-width: 768px) {
    .sub-wrap .about-inner .con1 .contents {margin-top: 80px;}
    .sub-wrap .about-inner .con1 .contents .text span {display: block;}
    .whatwedo .sub-title h2{margin-bottom: 80px;}
    .whatwedo .content-wrap .whatwedo-list li {width: calc((100% - 40px)/2);}
    .whatwedo .content-wrap .whatwedo-list li p {font-size: 2.4rem;}
    .whatwedo .content-wrap .whatwedo-list li span {font-size: 1.8rem;}
  }
  @media all and (min-width: 1280px) {
    .whatwedo .content-wrap .whatwedo-list li {width: calc((100% - 120px)/4); padding-left: 0;}
  }

  .wrap_controllers {display: none;}
  .contactUs .sub-title h2{text-align: left !important; font-weight: 900 !important; margin-bottom: 40px;}
  .contactUs .content-wrap {display: flex; gap: 40px; align-items: center; justify-content: space-between; flex-wrap: wrap;}
  .contactUs .content-wrap>.map {width: 100%;}
  .contactUs .content-wrap .info {width: 100%;}
  .contactUs .content-wrap .info ul {display: flex; flex-direction: column; gap: 25px;}

  .contactUs .content-wrap .info ul li p {font-size: 1.8rem; font-weight: 500; line-height: 1.6;}
  .contactUs .content-wrap .info ul li:nth-child(1) p {background: url('../images3/about/location.png') no-repeat left center; padding-left: 48px;}
  .contactUs .content-wrap .info ul li:nth-child(2) p {background: url('../images3/about/mail.png') no-repeat left center; padding-left: 48px;}
  .contactUs .content-wrap .info ul li:nth-child(3) p {background: url('../images3/about/call.png') no-repeat left center; padding-left: 48px;}
  .contactUs .content-wrap .info ul li:nth-child(4) p {background: url('../images3/about/fax.png') no-repeat left center; padding-left: 48px;}
  .contactUs .content-wrap .info ul li:nth-child(5) p {background: url('../images3/about/bank.png') no-repeat left center; padding-left: 48px; line-height: 1.6;}

  @media all and (min-width: 768px) {
    .contactUs .sub-title h2{margin-bottom: 80px;}
    .contactUs .content-wrap {gap: 80px;}
    .contactUs .content-wrap>.map {width: calc(100% - (40% + 80px));}
    .contactUs .content-wrap .info {width: calc(100% - (60% + 80px));}
  }

/* about us css end */

/* °í°´Áö¿ø css */
.customer {margin-top: 50px;}
.customer .content-wrap {margin-top: 100px;}
.customer .content-wrap .customer-list {display: flex; gap: 80px; flex-wrap: wrap;}
.customer .content-wrap .customer-list a {width: 100%; border-radius: 30px; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; padding: 80px 0 40px 0; position: relative;}
.customer .content-wrap .customer-list li p {font-size: 2rem; font-weight: 600; text-align: center; color: #979797; transition: all .2s ease-in-out;}
.customer .content-wrap .customer-list a:hover {transform: translateY(-10px);}
.customer .content-wrap .customer-list a:hover p {color: #000;}
.customer .content-wrap .customer-list a:nth-child(1)::before {content: ''; width: 142px; height: 185px; display: block; position: absolute; background: url('../images3/customer/online-contact.png'); left: 50%; transform: translateX(-50%); top: -85px; z-index: -1;}
.customer .content-wrap .customer-list a:nth-child(2)::before {content: ''; width: 146px; height: 132px; display: block; position: absolute; background: url('../images3/customer/only.png'); left: 50%; transform: translateX(-50%); top: -55px; z-index: -1;}
.customer .content-wrap .customer-list a:nth-child(3)::before {content: ''; width: 125px; height: 154px; display: block; position: absolute; background: url('../images3/customer/only.png'); left: 50%; transform: translateX(-50%); top: -65px; z-index: -1;}

.customer .content-wrap .customer-list .hidden-btn {width: 100%; display: flex; justify-content: end; text-align: center; opacity: 0;}
.customer .content-wrap .customer-list .hidden-btn a {padding: 0; font-size: 1.6rem;}
.customer .content-wrap .customer-list .hidden-btn a:hover {transform: translateY(0);}
.customer .content-wrap .customer-list .hidden-btn a:before {content: none;}

@media all and (min-width: 768px) {
  .customer .content-wrap {margin-top: 140px;}
.customer .content-wrap .customer-list a {width: calc((100% - 80px)/2);}
.customer .content-wrap .customer-list {display: flex; gap: 40px; justify-content: center;}
}

/* °í°´Áö¿ø css end */


/* etc */
.etc-inner .con .sub-title {margin-bottom: 40px;}
.agree_site-wrap {border-radius: 20px; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; padding: 40px; margin: 0 15px;}

.privacy-policy {font-size: 1.6rem;}

.etc1-content,
.etc2-content {text-align: left; border-radius: 20px; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; padding: 35px; margin: 0 15px; margin-bottom: 100px;}
.etc2-content .util-txt1 {border: 4px solid #EAD3D4; padding: 20px; border-radius: 10px;} 
.etc2-content .util-txt1 p {font-size: 1.5rem; text-indent: -10px; padding-left: 10px;}

.etc2-content .util-txt2 {padding-top: 40px; padding-left: 20px;}
.etc2-content .util-txt2>p {font-size: 1.8rem; position: relative; font-weight: 600;}
.etc2-content .util-txt2>p::before {content: ''; position: absolute; width: 6px; height: 18px; background-color: #C8214F; left: -20px; top: 3px}
.etc2-content .util-txt2 ul {padding: 10px;}
.etc2-content .util-txt2 ul p {font-size: 1.5rem; font-weight: 500;}
.etc2-content .util-txt2 ul li {font-size: 1.4rem; font-weight: 400; color: #6d6d6d; padding: 8px 0 0 20px; text-indent: -20px; margin-left: 15px;}
.etc2-content .util-txt2 ul li span {display: block; padding-top: 8px;}

.terms {font-size: 1.7rem; text-align: left;}

@media all and (min-width: 768px) {
  .etc-inner .con .sub-title {margin-bottom: 60px;}
  .etc1-content,
  .etc2-content {padding: 60px;}
  .etc2-content .util-txt1 p {font-size: 1.6rem;}
  .etc2-content .util-txt2>p {font-size: 2rem;}
  .etc2-content .util-txt2 ul p {font-size: 1.6rem;}
  .etc2-content .util-txt2 ul li {font-size: 1.5rem;}
}

@media all and (min-width: 1280px) {
  .etc1-content,
  .etc2-content {margin: 0 auto 100px auto;}
}
/* etc end */