@charset "utf-8";

/*
* File       : layout.css
* Author     : B-WORKER
* Dependency : css/reset.css
*      
 * SUMMARY:
 * 1) MAIN animation
 * 2) MAIN CONTENTS
*/

/* **************************************** *
 * 사이트 시작시 커버
 * **************************************** */
.main-cover{position:fixed; opacity:1; visibility:visible; top:0; left:0; z-index:999; width:100%; height:100%; background:#121212; transition:all 1.2s ease 0s;}
.motion-on .main-cover{opacity:0; visibility:hidden;}

/* **************************************** *
 * Main animation set
 * **************************************** */
[data-txt-motion]{}
[data-txt-motion="hidden"]{overflow:hidden;}
[data-txt-motion="hidden"] > span{display:block; opacity:0;}

.swiper-slide-active [data-txt-motion="hidden"] > span{animation:text_hidden_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="left"]{animation:text_left_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="right"]{animation:text_right_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="up"]{animation:text_up_motion 1.6s ease 0.1s forwards;}
.swiper-slide-active [data-txt-motion="down"]{animation:text_down_motion 1.6s ease 0.1s forwards;}

.main-visual__text [data-txt-motion="hidden"]{opacity: 1;}
.main-visual__bg i{transform: scale(1.2); transition:transform 15s ease;}
.swiper-slide-active .main-visual__bg i{transform: scale(1);}

@keyframes text_hidden_motion {
 from{opacity:0; transform:translateY(70rem);}
 to{opacity:1; transform:translateY(0);}
}
@keyframes text_left_motion {
 from{opacity:0; transform:translateX(70rem);}
 to{opacity:1; transform:translateX(0);}
}
@keyframes text_right_motion {
 from{opacity:0; transform:translateX(-70rem);}
 to{opacity:1; transform:translateX(0);}
}
@keyframes text_up_motion {
 from{opacity:0; transform:translateY(70rem);}
 to{opacity:1; transform:translateX(0);}    
}
@keyframes text_down_motion {
 from{opacity:0; transform:translateY(-70rem);}
 to{opacity:1; transform:translateX(0);}
}

/* **************************************** *
 * Site custom
 * **************************************** */
 #container {z-index: 1; position: relative; background: var(--w); border-radius:0 0 60rem 60rem;}
 section[class^="main-"] {position: relative;}

 /* title */
.main-desc {display: block; margin-bottom: 30rem; color: var(--c-primary); font-weight: 700;} 
.main-title {margin-bottom: var(--space60);}
.main-title > p {margin-top: 23rem;}

 /* star */
 .section-deco {position: absolute; left:0; top:0; width: 100%; height: 100%;}
 .section-deco i {z-index: 1; position: absolute; width: 28rem; aspect-ratio: 1/1;}
 .section-deco i.small {width: 16rem;}
 .section-deco i::after {position: absolute; left:0; top:0; content:''; width: 100%; height: 100%; background-repeat: no-repeat; background-size: contain; background-position: center center; background-image: url(../img/layout/ic-star.svg); animation:star_rotate 3s linear infinite;}

 .section-deco.white i::after {background-image: url(../img/layout/ic-star_w.svg);}

 @keyframes star_rotate {
	from{transform:rotate(0);}
	to{transform:rotate(360deg);}
 }

 @media (max-width:1200px){
  .section-deco i {width: 22rem;}
}

@media all and (max-width:1023px){
  .section-deco i {width: 20rem;}
  .section-deco i.small {width: 12rem;}
}

@media (max-width:540px){
  .section-deco i {width: 16rem;}
  .main-desc {margin-bottom: 17rem;font-size:13rem;}
  .main-title h3 br {display: none;}
  .main-title > p {margin-top: 15rem;}
}


/* main visual */
.main-visual .section-deco i:nth-child(1) {left: 74%; top: 15%;}
.main-visual .section-deco i:nth-child(2) {left: 25%; top: 37%;}
.main-visual .section-deco i:nth-child(3) {left: 6.2%; top: 74%;}
.main-visual .section-deco i:nth-child(4) {right: 13%; top: 64%;}
.main-visual {background: linear-gradient(0deg, #FFF 0%, #E7F1FB 100%);}
.main-visual-container {padding-top: var(--space200);}
.main-visual-container .swiper-slide {justify-content: center; background: transparent;}
.main-visual__text span {color: var(--b-title);}
.main-visual__text h2 {margin-bottom: 30rem;}
.main-visual__text h2 span {font-weight: 700;}
.main-visual__controls {margin-top: 40rem;}
.main-visual__count {position: relative; display: inline-flex; gap: 24rem; font-size: var(--font-15); font-weight: 600; letter-spacing: -.3px; color: var(--b-title);}
.main-visual__count > * {min-width: 10rem; text-align: center;}
.main-visual__count i {font-weight: 700; color: var(--c-primary);}
.main-visual__count::before {position: absolute; left: 50%; top: 50%; content:''; width: 1px; height: 10rem; background: var(--op-b20); transform: translateY(-50%);}

.main-visual-img {z-index: 1; position: relative; width: 100%; margin-top: 30rem;}
.main-visual__svg {position: relative;}
.main-visual-img figure {position: absolute; aspect-ratio: 1/1;}
.main-visual-img figure img {opacity: 0; transform: scale(0); animation-name: visualScale;animation-duration: 1s;animation-timing-function: linear;animation-fill-mode: forwards;}
.main-visual-img figure:nth-child(1) {left: 65.5%; top: 2%; width: 11.4%;} 
.main-visual-img figure:nth-child(2) {right: 4%; top: 35%; width: 7%;}
.main-visual-img figure:nth-child(4) {left: -3%; top: 41%; width: 8%;}
.main-visual-img figure:nth-child(5) {left: 11%; top: 92%; width: 4.6%;}
.main-visual-img figure:nth-child(6) {left: 18.5%; top: 29%; width: 15%;}
.main-visual-img figure:nth-child(7) {left: 50%; top: 15%; width: 25%; transform: translateX(-50%);}
.main-visual-img figure:nth-child(8) {left: 74%; top: 67%; width: 11.4%;}

 #animated-path {
	stroke-dasharray: 4000;
	stroke-dashoffset: 4000;
	animation: draw 6s ease forwards;
 }

 @keyframes visualScale {
  0% {opacity: 0; transform: scale(0);}
  100% {opacity: 1; transform: scale(1);}
}

@keyframes draw {
  to {stroke-dashoffset: 0;}
}

@media (max-width:1700px){
  .main-visual .section-deco i:nth-child(2) {left: 20%;}
}

@media (max-width:1460px){
  .main-visual .section-deco i:nth-child(2) {left: 17%;}
}

@media (max-width:1200px){
  .main-visual__text h2 {margin-bottom: 22rem;}
}

@media all and (max-width:1023px){
  .main-visual {height: 100vh;}
	.main-visual .section-deco i:nth-child(1) {left: 84%; top: 23%;}
  .main-visual .section-deco i:nth-child(2) {left: 10%; top: 43%;}
  .main-visual .section-deco i:nth-child(3) {left: 7.2%; top: 81%;}
  .main-visual .section-deco i:nth-child(4) {right: 13%; top: 75%;}
}

@media (max-width:860px){
  .main-visual {height: auto; padding-bottom: var(--space140);}
	.main-visual .section-deco i:nth-child(1) {left: 92%;}
  .main-visual .section-deco i:nth-child(3),
  .main-visual .section-deco i:nth-child(4) {display: none;}
  .main-visual__text {padding: 0 20rem;}
}

@media (max-width:540px){
  .main-visual {overflow: hidden;}
  .main-visual-container {padding-top: 120rem;}
  .main-visual .section-deco i:nth-child(1) {left: 90%; top: 15%;}
  .main-visual .section-deco i:nth-child(2) {left: 5%; top: 64%;}
  .main-visual__text span br {display: none;}
  .main-visual__controls {margin-top: 22rem;}
  .main-visual__text h2 {margin-bottom: 15rem;}

  .main-visual-img figure:nth-child(1) {left: 78%; top: -10%; width: 18%;}
  .main-visual-img figure:nth-child(2) {display: none;}
  .main-visual-img figure:nth-child(4),
  .main-visual-img figure:nth-child(5) {display: none;}
  .main-visual-img figure:nth-child(6) {left: -4%; top: 35%; width: 25%;}
  .main-visual-img figure:nth-child(7) {width: 45%;}
  .main-visual-img figure:nth-child(8) {left: 86%; top: 88%; width: 15%;}
  .main-visual-img figure:nth-child(8) img {border-radius: 10rem;}

  .main-visual__svg svg {transform: translate(4%, 11rem) scale(1.5);}

}

/* about */
.main-about .section-deco i:nth-child(1) {right: 17%; top: 13%;}
.main-about .section-deco i:nth-child(2) {right: 5%; top: 60%;}
.main-about .section-deco i:nth-child(3) {left: 1.5%; top: 45%;}
.main-about-top {position: absolute; left:0; top:0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: var(--height-full); background:var(--w);}
.main-about__box {position: absolute; width: 0; aspect-ratio: 1/1; border-radius: 100%; background: var(--bg-dark);}
.main-about__title{position:relative; overflow:visible; z-index:1; will-change:transform;}
.main-about__title *{white-space:nowrap;}
.main-about__title [data-font-en]{margin:0 12rem; font-size:120rem;}
.main-about__title h3{display:inline-block; white-space:nowrap;}
.main-about__title h3:is(:not([data-font-en])){position:absolute; overflow:hidden; top:50%; left:50%; width:auto; line-height:1.1; color:var(--w); transform:translate(-50%, -50%); max-width:0;}

.main-about-top h4 {overflow: hidden; margin-top: 10rem;}
.main-about-top h4 span {display: inline-block;color: var(--b-title);display: none;}
.main-about-bottom {padding: var(--space180) 0 var(--space200); background: var(--c-gradient);}
.main-about-bottom .wide-wrap {opacity: 0;}
.main-about__circle {position: absolute; left: 0; top:0; width: 100%; height: 100%;}
.main-about__circle p {opacity: 0; position: absolute; left: 50%; top: 50%; aspect-ratio: 1/1; border-radius: 100%; border: 1px solid var(--w); transform: translate(-50%, -50%);animation: circle 4s linear infinite;}
.main-about__circle p:nth-child(1) {animation-delay: 0s;}
.main-about__circle p:nth-child(2) {animation-delay: .5s;}
.main-about__circle p:nth-child(3) {animation-delay: 1s;}

.main-about__con {position: relative; gap: 562rem; justify-content: center;} 
.main-about__mockup {position: absolute; left: 50%; top: 10%; display:inline-block; width: 430rem; transform: translate(-50%, 0);}
.main-about__mockup img {max-width: 100%;}
.main-about__label em {display: inline-block; margin-bottom: 20rem; padding: 7rem 12rem; border-radius: 100rem; background: var(--op-w10);}
.main-about__label img {display: inline-block; height: 25rem; margin-top: 10rem;}
.main-about__item {min-width: 310rem; margin-top: 36rem; padding: 32rem 30rem; background: var(--w); box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.15);}
.main-about__item figure {flex-shrink: 0; margin-right: 23rem; border-radius: 100%; border: 1px solid rgba(0, 0, 0, .07); background: #fafafa;}
.main-about__item dt {display: block; margin-bottom: 7rem; font-weight: 700; color: var(--b-title);}
.main-about__item dd {font-size:32rem; font-weight: 700; color: var(--b-title);}
.main-about__item dd p {margin-right: 5rem;}
.main-about__item p:has(.count-num),
.main-about__item .count-num{font-size: 42rem; font-weight: 1000; color: var(--b-title);}
.main-about__list ul li:nth-child(2) div {transform: translateX(-140rem);}
.main-about__list:last-child ul li:nth-child(2) div {transform: translateX(140rem);}

.main-about__title { will-change: transform; }
.main-about__title h3 { display: inline-block; }

@keyframes circle {
	0% {opacity: 0; width: 0;}
	50% {opacity: .2; width: 50vw;}
  100% {opacity: 0; width: 100vw;}
 }

  @media all and (max-width:1480px){
    .main-about__title [data-font-en] {font-size: 8vw;}
    .main-about__item {min-width: 280rem; padding: 25rem 20rem;}
    .main-about__item dt {margin-bottom: 0;}
    .main-about__item figure {width: 70rem;}
    .main-about__con {gap: 520rem;}
 }

 @media all and (max-width:1200px){
  .main-about .section-deco i:nth-child(1) {right: 18%; top:15%;}
  .main-about .section-deco i:nth-child(2) {display: none;}
  .main-about .section-deco i:nth-child(3) {left: 3%;}
  .main-about__mockup {width: 380rem;}
  .main-about__con {gap: 450rem;}
  .main-about__list ul li:nth-child(2) div {transform: translateX(-60rem);}
  .main-about__list:last-child ul li:nth-child(2) div {transform: translateX(60rem);}
}

@media all and (max-width:1023px){
  .main-about .section-deco i:nth-child(1) {right: 12%; top: 6%;}
  .main-about .section-deco i:nth-child(2) {display: block; right: 24%; top: 40%;}
  .main-about .section-deco i:nth-child(3) {left: 15%; top: 15%;}
	.main-about__title [data-font-en] {margin: 0 8rem;}
  .main-about__con {flex-direction: column; align-items: center; gap: 0;}
  .main-about__mockup {position: relative; left: auto; top: auto; width: 320rem; margin-bottom: 25rem; transform: none;}
  .main-about__circle {top: -28%;}
  .main-about-bottom {position: relative;}
  .main-about__list {width: 100%; padding: 0 40rem;}
  .main-about__list ul {display: grid; gap: 20rem; grid-template-columns: repeat(3, 1fr);}
  .main-about__list ul li:nth-child(2) div {transform: none;}
  .main-about__item {min-width: auto;}
  .main-about__list:last-child {margin-top: var(--space80);}
  .main-about__list:last-child ul li:nth-child(2) div {transform: none;}
}

@media (max-width:860px){
  .main-about .section-deco i:nth-child(2) {right: 8%; top: 47%;}
  .main-about .section-deco i:nth-child(3) {left: 14%; top: 32.5%;}
  .main-about-top {position: relative; height: auto; padding: var(--space140) 0 60rem;}
  .main-about-bottom .wide-wrap {opacity: 1;}
  .main-about__item {flex-direction: column; padding:22rem 20rem 20rem;}
  .main-about__item p:has(.count-num),
  .main-about__item .count-num {font-size: 30rem;}
  .main-about__item figure {width: 52rem; margin-right: 0; margin-bottom: 15rem;}
  .main-about__item dl {width: 100%;}
  .main-about__item dd {justify-content: center; font-size: 25rem;}
}

@media (max-width:540px){
    .main-about .section-deco i:nth-child(3) {left: 10%; top: 26.5%;}

  .main-about__title {flex-direction: column; justify-content: center; align-items: center;}
  .main-about__title [data-font-en] {font-size: 10vw;line-height: 1.18;letter-spacing: -0.5px;font-weight: 800;}
  .main-about-top {padding-top: 100rem;}
  .main-about-top h4 {margin-top: 13rem; font-size: 18rem;}

  .main-about__con {overflow: hidden;}
  .main-about .main-title {padding: 0 20rem;}
  .main-about .main-title br {display: none;}
  .main-about__mockup {width: 70%; margin-bottom: 15rem;}
  .main-about__circle {top: -32%;}
  .main-about__label img {height: 22rem; margin-top: 11rem;}
  .main-about__list {padding: 0 20rem;}
  .main-about__list ul {grid-template-columns: 1fr; gap:10rem; margin-top: 30rem;}
  .main-about__item {flex-direction: row; margin-top: 0; text-align: left;}
  .main-about__item figure {margin-right: 20rem;}
  .main-about__item dd {justify-content: flex-start;}
}


 /* service */
 .main-service {margin-top: var(--space140);}
 .main-service .section-deco i:nth-child(1) {left: 27%;}
 .main-service .section-deco i:nth-child(2) {left: 1.5%; top: 46%;}
 .main-service .section-deco i:nth-child(3) {left: 76%; top: 17%;}
 .main-service .section-deco i:nth-child(4) {right: 5%; top: 102%;}
 .main-service__list {gap: 20rem;}
 .flex-hover__bg{position:absolute; top:0; left:0; width:100%; height:100%; background-position:50% 50%; background-repeat: no-repeat; background-size: cover; background-image:url('../img/main/service01.jpg');}
 .flex-hover__item:nth-child(2) .flex-hover__bg {background-image: url(../img/main/service02.jpg);}
 .flex-hover__item:nth-child(3) .flex-hover__bg {background-image: url(../img/main/service03.jpg);}
 .flex-hover__item:nth-child(4) .flex-hover__bg {background-image: url(../img/main/service04.jpg);}

.flex-hover__item{display:flex; align-items:flex-end; position:relative; width:100%; transition:var(--trans-01);}
.flex-hover{height:540rem;}
.flex-hover__text {position:relative; width: 100%; padding: 40rem 35rem;}
.flex-hover__text p {height: 0;}
.flex-hover__text span {opacity: 0; display: inline-block; transform: translateY(100%);}
.flex-hover__text .btn-wrap {opacity: 0; position: absolute; right: 35rem; bottom: 40rem; transition: var(--trans-01);}

@media (hover: hover) and (pointer: fine){
    .flex-hover__item:hover {width:200%;}
    .flex-hover__item:hover .flex-hover__text p {height: 48rem; margin-top: 17rem; transition: var(--trans-01);}
    .flex-hover__item:hover .flex-hover__text p span {opacity: 1; transform: translateY(0); transition: var(--trans-01); transition-delay: .3s;}
    .flex-hover__item:hover .btn-wrap {opacity: 1;}
}

@media all and (max-width:1480px){
  .main-service .section-deco i:nth-child(1) {left: 22%;}
  .main-service .section-deco i:nth-child(4) {right: 1%; top: 105%;}
  .flex-hover__item .flex-hover__text p {padding-right: 100rem; word-break: keep-all;}
  .flex-hover__item .flex-hover__text p br {display: none;}

  @media (hover: hover) and (pointer: fine){
    .flex-hover__item:nth-child(-n+2):hover .flex-hover__text p {height: 80rem; margin-top: 17rem; transition: var(--trans-01);}
  }
}

 @media all and (max-width:1200px){
    .flex-hover__text {padding: 40rem 25rem;}
    .flex-hover__item .flex-hover__text p {padding-right: 80rem;}
    .flex-hover__text .btn-wrap {right: 25rem;}

    @media (hover: hover) and (pointer: fine){
      .flex-hover__item:hover .flex-hover__text p  {height: 80rem;}
    }
 }

 @media all and (max-width:1023px){
  .main-service .section-deco i:nth-child(1) {left: 20%; top:5%;}
  .main-service .section-deco i:nth-child(2) {display: none;}
  .main-service .section-deco i:nth-child(3) {left: 80%;}
  .main-service .section-deco i:nth-child(4) {display: none;}

  .flex-hover__bg::after {opacity: .8; position: absolute; left:0; bottom:0; content:''; width: 100%; height: 70%; background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);}
  .flex-hover__item .flex-hover__text p {padding-right: 0;}
  .flex-hover__text .btn-wrap {overflow: hidden; position: relative; right: auto; bottom: auto; height: 0; }
  
  
  @media (hover: hover) and (pointer: fine){
    .flex-hover__item:hover .flex-hover__text p {height: 120rem !important; margin-top: 12rem;}
    .flex-hover__item:hover .flex-hover__text .btn-wrap {height: 52rem; transition-delay: .3s; transition: var(--trans-01);}
  }
 }

 @media (max-width:860px){
  .main-service .section-deco i:nth-child(1) {left: 16%;}
  .main-service .section-deco i:nth-child(3) {left: 85%;}
}

@media (max-width:540px){
	.main-service {margin-top: 0;}
	.main-service .section-deco i:nth-child(1),
	.main-service .section-deco i:nth-child(3) {display: none;}

	.flex-hover {height: auto;}
	.flex-hover__item {height: 400rem;}
	.flex-hover__text {padding: 30rem 20rem;}
	.flex-hover__item .flex-hover__text p {height: auto;}
	.flex-hover__bg::after {opacity: .5; height: 100%; background: #000;}
	.flex-hover__text span {opacity: 1; transform: translateY(0%);}
	.flex-hover__text .btn-wrap {opacity: 1; height: auto; margin-top: 30rem;}
	.flex-hover__text .btn-wrap *.btn-basic::before {margin-right: 16rem; content:"자세히 보기"; color: var(--b-title);}
	.main-service__list {display: grid; grid-template-columns: 1fr;}
	.main-service *.btn-basic {width: 100%;}
}


/* tech */
.main-tech {height: 600vh; padding: var(--space200) 0 var(--space230);}
.main-tech__inr {position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.main-tech__con {overflow: hidden; position: relative; width: 100%; gap: 60rem;}
.main-tech__con .rolling-img {position: absolute; left:0; top: 50%; width: 100%; font-size: 200rem;letter-spacing: -1.7px; color: #E8EEF4; text-transform: uppercase; transform: translateY(-50%);}
.main-tech__con .rolling-img li {margin: 0 50rem; font-weight: 1000;}
.main-tech__con > *:not(.rolling-img) {position: relative;}
.main-tech__tag {overflow: hidden; flex-basis: 20%; height: 60rem; text-align: right;}
.main-tech__tag li {display: flex; justify-content: flex-end; align-items: center; height: 100%; color: var(--b-title);}
.main-tech__tag i {display: block; margin-right: 14rem; width: 40rem; height: 40rem;}
.main-tech__tag i img {width: 100%; height: 100%; object-fit: contain; object-position: center;}
.main-tech__thumb {position: relative; flex-basis: 478rem; height: 478rem;}
.main-tech__thumb li {position: absolute; inset: 0%; width: 100%; aspect-ratio: 1/1;}
.main-tech__title {overflow: hidden; flex-basis: 20%; height: 60rem;}
.main-tech__title li {display: flex; align-items: center; height: 100%;}

@media all and (max-width:1480px){
  .main-tech__tag {flex-basis: 22%;}
}

@media all and (max-width:1200px){
    .main-tech__thumb {flex-basis: 420rem; height: 420rem;}
    .main-tech__tag,
    .main-tech__title {flex-basis: 30%;}
    .main-tech__con .rolling-img {font-size: 12vw;}
 }

@media all and (max-width:1023px){
  .main-tech__con {gap: 40rem; padding: 0 40rem;}
  .main-tech__thumb {flex-shrink: 0; flex-basis: 320rem; height: 320rem;}
  .main-tech__tag li {text-align: left;}
  .main-tech__title li {justify-content: flex-end;}
}

@media (max-width:860px){
  .main-tech {padding: 0;}
  .main-tech__thumb {flex-basis: 240rem; height: 240rem;}
  .main-tech__con {gap: 20rem; padding: 0 20rem;}
}

@media (max-width:540px){
 .main-tech__con {flex-direction: column; gap: 0;}
 .main-tech__con .rolling-img {top: 32%;}
  .main-tech__tag {order: 2; margin-top: 20rem;}
  .main-tech__title {order: 3;}
 .main-tech__tag, .main-tech__title {width: 100%; flex-basis: auto;}
 .main-tech__thumb {order: 1; width: 240rem; height: 240rem;}
 .main-tech__tag { height: 80rem;}
 .main-tech__tag i {width: 30rem; height: 30rem; margin-right: 0; margin-bottom: 12rem;}
 .main-tech__tag li {flex-direction: column; justify-content: center; align-items: center; font-size: 13rem; color: var(--c-primary);}
 .main-tech__title {height:40rem;}
 .main-tech__title li {justify-content: center;}
 .main-tech__title li {margin-top: -4rem;}
}


/* news */
.main-news {position: relative; padding: var(--space180) 0 var(--space230); background: var(--c-gradient-reserve);}
.main-news .section-deco i {left: 80%; top: 20%;}
.main-news__slider {z-index: 1; overflow: hidden; position: relative; width: 100%; }
.main-news__track { display: flex; gap: 20px; width: max-content; }
.main-news__track:not(:has(.main-news__item:nth-child(3))) {max-width: 1520rem; margin:0 auto;}
.main-news__item {position: relative; flex: 0 0 auto; width: 365rem; aspect-ratio: 1/1; border-radius: 30px; overflow: hidden; user-select: none; }
.main-news__item a,
.main-news__item .gallery-list__img {position: relative; display: block; width: 100%; height: 100%;}
.main-news__item a::after {opacity: .2; position: absolute; left:0; bottom:0; content:''; width: 100%; height: 50%; background: linear-gradient(180deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);;}
.main-news__item img { width: 100%; height: 100%; object-fit: cover;}
.main-news__item .gallery-list__title {z-index: 1; position: absolute; left:0; bottom:0; width: 100%; padding: 35rem; text-align: left;}
.main-news__item .gallery-list__title strong {font-size: var(--font-22); font-weight: 700; color: var(--w);}

 @media all and (max-width:1480px){
	.main-news__track:not(:has(.main-news__item:nth-child(3))) {max-width:none; margin:0 60rem;}
 }

@media all and (max-width:1200px){
    .main-news__item {width: 320rem;}
    .main-news__item p {padding: 25rem 30rem;}
}

@media all and (max-width:1023px){
  .main-news__track:not(:has(.main-news__item:nth-child(3))) {margin:0 40rem;}
  .main-news .section-deco i {left: 89%;}
  .main-news__item {width: 260rem;}
}

@media (max-width:860px){
   .main-news__track:not(:has(.main-news__item:nth-child(3))) {margin:0 20rem;}
  .main-news .section-deco i {left: 93%;}
  .main-news__item {width: 220rem;}
  .main-news__item .gallery-list__title {padding: 20rem;}
}

@media (max-width:540px){
	.main-news .section-deco i {display: none;}
	.main-news__item {width: 200rem;}
	.main-news__item .gallery-list__title strong {font-size: var(--default);}
}

/* inquiry */
.main-inquiry {padding-bottom: var(--space200); border-radius:0 0 60rem 60rem;}
.main-inquiry .section-deco i {left: 82%; top: 27%;}
.main-inquiry-title {width: 50%;}
.main-inquiry__sticky {position: sticky; top: var(--space150);}
.main-inquiry__sticky ul {margin-top: var(--space60);}
.main-inquiry__sticky ul li {margin-bottom: 30rem;}
.main-inquiry__sticky ul li i {display: block; margin-bottom: 7rem; font-size: var(--font-16); font-weight: 700; color: var(--op-w20);}
.main-inquiry__sticky ul li p > i{display:inline; margin-right:6rem; font-weight:400; font-size:var(--default); color:var(--op-w70);}
.main-inquiry__sticky ul li:nth-child(2) {display: none;}
.main-inquiry-form {width: 50%; padding-left: var(--space150);}
.main-inquiry-form .cs-form {margin-top: 40rem; padding-top: 0; border-top: 0;}
.main-inquiry-form .form-area {flex-direction: column; align-items: flex-start; margin-bottom: 33rem;}
.main-inquiry-form .form-area em {display: block; margin-bottom: 5rem; font-size: var(--font-22); font-weight: 700; color: var(--w);}
.main-inquiry-form .form-area input:is([type="text"], [type="password"]),
.main-inquiry-form .form-select select,
.main-inquiry-form .form-area textarea {padding: 9rem 0 !important;font-size: var(--default);resize: none;background: transparent;border: 0;border-bottom:1px solid var(--op-w20) !important;border-radius: 0;}
.main-inquiry-form textarea {height: 200rem;}
.main-inquiry-form .form-select {position: relative;}
.main-inquiry-form .form-select::after {position: absolute; content:''; right: 0; top: 5rem; width: 50rem; height: 50rem; background-repeat: no-repeat; background-position: center center; background-size: 11rem; background-image: url(../img/layout/arrow-select_w.svg);}
.main-inquiry-form .form-select select {max-width: none !important; width: 100%; font-weight: 300 !important; color: var(--w) !important;}
.main-inquiry-form .form-select select option {color: var(--b-title) !important;}
.main-inquiry-form *::placeholder {color: var(--op-w20) !important;}
.main-inquiry-form [data-form="agree"] em {font-size: var(--default); font-weight: 600;}
.main-inquiry-form [data-form="agree"] .check-box [type="checkbox"]:not(:checked) + .checkmark:after,
.main-inquiry-form [data-form="agree"] .check-box [type="checkbox"]:checked + .checkmark:after {border-color: var(--c-primary);}
.main-inquiry-form [data-form="agree"] .check-box [type="checkbox"]:checked + .checkmark {background: var(--w);}
.main-inquiry-form [data-form="agree"] .check-box label {display: flex; padding-left: 38rem;}
.main-inquiry-form .form-area[data-form="agree"] em {margin-bottom: 0;}
.main-inquiry-form .form-area[data-form="agree"] .show-btn {white-space: nowrap;}
.main-inquiry-form .btn-wrap {margin-top: 50rem; text-align: right;}

@media (max-width:1480px){
  .main-inquiry .section-deco i {left: 92%;}
}

@media (max-width:1460px){
  .main-inquiry-form {padding-left: 80rem;}
}

@media all and (max-width:1200px){
    .main-inquiry .section-deco i {left: 89%;}
 }

 @media all and (max-width:1023px){
  .main-inquiry .wrap {flex-direction: column;}
  .main-inquiry-title {width: 100%;}
  .main-inquiry .section-deco i {left: 50%; top: 38%;}
  .main-inquiry__sticky ul {display: grid; gap: 0; grid-template-columns: repeat(3, 1fr);}
  .main-inquiry__sticky ul li {padding-right: 20rem;}
  .main-inquiry__sticky ul li:not(:first-child) {padding-left: 20rem; border-left: 1px solid var(--op-w10);}
  .main-inquiry-form {width: 100%; margin-top: var(--space60); padding-left: 0; border-top: 2px solid var(--w);}
  .main-inquiry .form-area textarea {height: 180rem;}

  .main-inquiry-form .btn-wrap {text-align: center;margin-top: 60rem;}
}

@media (max-width:860px){
  .main-inquiry .section-deco i {left: 55%; top: 35%;}
}

@media (max-width:540px){
  .main-inquiry {border-radius: 0 0 30rem 30rem;}
  .main-inquiry .section-deco i {left: 74%; top: 19%; }
  .main-inquiry__sticky ul {grid-template-columns: 1fr;}
  .main-inquiry__sticky ul li {margin-bottom: 14rem;padding: 0 !important;border-left: 0 !important;}
  .main-inquiry__sticky ul li i {margin-bottom: 5rem;}

  .main-inquiry-form {margin-top: 20rem;}
  .main-inquiry-form .cs-form {margin-top: 30rem;}
  .main-inquiry-form .form-area em {font-size: 16rem;}
  .main-inquiry-form [data-form="agree"] .check-box label {flex-wrap: wrap;}
  .main-inquiry-form .form-area[data-form="agree"] .show-btn {margin-left: 0; margin-top: 10rem;}
  .main-inquiry-form .btn-wrap {margin-top: 20rem;}
   .main-inquiry__sticky ul li p {font-size: 15rem;}
}