@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
*{
  font-family: "Pretendard";
}
@font-face {
  font-family: "UhBee jung";
  src: url("../fonts/UhBee jung.ttf");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "UhBee jung BOLD";
  src: url("../fonts/UhBee jung BOLD.ttf");
  font-weight: 700;
  font-style: normal;
}
.fm_uhBeeJung{
  font-family: "UhBee jung";
}
.fm_uhBeeJungBold{
  font-family: "UhBee jung BOLD";
}

.anim.fade{
  opacity: 0;
}
body{
  background-color: #A9DEFF;
}
header.hide{
  display : block !important;
}
section[class*="sec"]{
  position: relative;
  height: max-content;
}
section[class*="sec"] .cont{
  top: 0; left: 0;
  width : 100%;
}
.floating_btn{
  position: fixed;
  top: 2.0833vw;
  right : 2.3438vw;
  z-index : 50;
  transition: transform .3s ease-in-out, top 1s ease-in-out;
}
.floating_btn.down{
  top: calc(100% - 17.7083vw);
}
.floating_btn p{
  display:inline-block;
  position: relative;
  width : 8.59vw;
  height:5.31vw;
  font-size:1.8229vw;
  font-weight:700;
  line-height:110%;
  border-radius:1.0417vw;
  box-shadow: 0 0.4167vw 1.0417vw 0 rgba(77,77,80,.20),
  0 0 1.0417vw 0 rgba(74,222,249,.40) inset;
  color:#0060DF;
  transition: box-shadow .2s ease-in-out;
}
.floating_btn p::before{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index : 0;
  transform: translate(-50%,-50%);
  width : calc(100% - 6px);
  height: calc(100% - 6px);
  border-radius: inherit;
  background-color : #fff;
  box-shadow: 0 0 20px 0 rgba(74,222,249,0.4) inset;
}
.floating_btn p::after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index : -1;
  transform: translate(-50%,-50%);
  width : 100%;
  height: 100%;
  border-radius: inherit;
  background-image: conic-gradient(from var(--angle),  #8FF1FD,#D1C0FF,#88ACFF, #82FFFE, #88ACFF, #D1C0FF, #8FF1FD);
  animation: playAnimate 2s linear infinite;
  animation-play-state: running;
}
.floating_btn p em{
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
}
.floating_btn p + img{
  width : 8.3333vw;
  height: auto;
  transform: translateY(-0.7813vw);
  margin: 0 auto;
  border-radius: 50%;
  box-shadow: 0 1.4167vw 1.0417vw 0 rgba(77,77,80,.20),
  0 0 1.0417vw 0 rgba(74,222,249,.40) inset;
  transition: box-shadow .2s ease-in-out;
}
.floating_btn:hover{
  transform: translateY(5%);
}
.floating_btn:hover p{
  box-shadow: 0 0.4167vw 1.0417vw 0 rgba(77,77,80,.0),
  0 0 1.0417vw 0 rgba(74,222,249,.20) inset;
}
.floating_btn:hover p + img{
  box-shadow: 0 0.4167vw 1.0417vw 0 rgba(77,77,80,.0),
  0 0 1.0417vw 0 rgba(74,222,249,.20) inset;
}

main{
  position: relative;
  z-index : 10;
  top: 0;
}
main .bg_img{
  position : absolute;
  z-index : 5;
}
main .sec1_light_img{
  position : absolute;
  left: 50%; top: 26.9792vw;
  transform: translateX(-50%);
  z-index : 15;
  mix-blend-mode: screen;
}
main .sec2_back_img{
  position: absolute;
  left: 50%; top: 21.2%;
  z-index : 10;
  transform: translateX(-50%);
  width : 100vw;
  mix-blend-mode: screen;
}
main #content{
  position: relative;
  top: 0;
  z-index : 10;
}

.sec1 .cont{
  padding-top: 5.6250vw;
}
.sec1 .arti1 .img_box{
  position : relative;
  margin: 0 auto;
  width : calc(100% - 2.0833vw);
  max-width: 47.6563vw;
}
.sec1 .arti1 .img_box .img1{
  width : 100%;
}
.sec1 .arti1 .img_box .img2{
  position: absolute;
  right : 0;
  bottom: 1.6667vw;
  width : 100%;
  mix-blend-mode: screen;
}
.sec1 .arti2{
  /* margin-top: 82.0313vw; */
  margin-top : 76%;
  padding-bottom : 3.1250vw;
}
.sec1 .arti2 .txt_box{
  display: flex;
  flex-direction: column;
  position: relative;
  width : calc(100% - 2.0833vw);
  max-width: 62.5000vw;
  height: 25.0000vw;
  margin: 0 auto;
  padding-top: 5.4688vw;
  box-shadow: 0 0.4167vw 1.0417vw 0 rgba(77,77,80,.20),
  0 0 1.0417vw 0 rgba(74,222,249,.40) inset;
  border:0.1563vw solid transparent;
  border-radius: 1.5625vw;
  background:
          linear-gradient(#fff, #fff) padding-box,
          linear-gradient(0deg,
          #82FFFE 0%,
          #88ACFF 34%,
          #D1C0FF 67%,
          #8FF1FD 100%
          ) border-box;
  background-clip: padding-box, border-box;
  background-origin: padding-box, border-box;
}
.sec1 .arti2 .img_box{
  position : absolute;
  right: 3.5938vw;
  bottom: 2.0833vw;
  width : 12.3438vw;
  height: 19.3229vw;
}
.sec1 .arti2 .img_box img{
  position : absolute;
  transition: opacity .45s ease-in-out;
}
.sec1 .arti2 .img_box img{
  opacity: 1;
}
.sec1 .arti2 .img_box img + img{
  opacity: 0;
}
.sec1 .arti2.on .img_box img{
  opacity: 0;
}
.sec1 .arti2.on .img_box img + img{
  opacity: 1;
}
.sec1 .arti2 .txt_box{
  padding-left: 3.8542vw;
}
.sec1 .arti2 .txt_box p{
  font-size: 2.6042vw;
  font-weight: 500;
  color: #274471;
  letter-spacing: -0.1823vw;
  line-height: 145%;
}
.sec1 .arti2 .txt_box p span{
  font-weight: 700;
  color: #FF61A0;
}
.sec1 .arti2 .txt_box h2{
  margin-top : 2.0833vw;
  font-size: 2.8646vw;
  font-weight: 700;
  line-height: 145%;
  color: #274471;
  letter-spacing: -0.1563vw;
}
@property --g {
  syntax: '<number>';
  initial-value: 0;
  inherits: false;
}
.sec1 .arti2 .txt_box h2 span{
  position: relative;
  margin: 0 0.7292vw;
  padding: 0 0.2083vw;
  background:
          linear-gradient(100deg,
          rgba(45,142,233, var(--g)) 0%,
          rgba(39,184,246, var(--g)) 100%
          ),
          #A3E3FC;
  transition: --g .45s ease-in-out;
}
.sec1 .arti2.on .txt_box h2 span{
  --g: 1;
}
.sec1 .arti2 .txt_box h2 + p{
  margin-top : 0.6250vw;
  font-size: 1.4583vw;
  font-weight: 400;
  letter-spacing: -0.0521vw;
  color: rgba(39, 68, 113, 0.6);
}
.sec1 .arti2 .txt_box h2 em{
  position : relative;
  z-index : 1;
  color: #fff;
  opacity: 0;
  transition: opacity .45s ease-in-out;
}
.sec1 .arti2.on .txt_box h2 em{
  opacity: 1;
}

.sec1 .arti3 .bubbles{
  width : 4.7396vw;
  margin: 0 auto;
}
.sec1 .arti3 .bubbles img{
  width : 4.7396vw;
  height: auto;
}

.sec1 .arti3{
  width : calc(100% - 2.0833vw);
  max-width : 62.5000vw;
  margin: 0 auto;
}
.sec1 .arti3 .video_box{
  border-radius: 1.5625vw;
  border: 0.2604vw solid #7CD8ED;
  overflow: hidden;
  aspect-ratio: 1200 / 679;
  margin-top: 7.0313vw;
}
.sec1 .arti3 .video_box iframe{
  width : 100%;
  height: 100%;
  object-fit: cover;
}
.sec1 .arti3 p{
  margin-top: 2.6042vw;
  font-size: 2.3438vw;
  font-weight: 700;
  color: #283037;
  line-height: 145%;
  text-align: center;
}
.sec1 .arti3 p span{
  position: relative;
  margin-right : 0.5208vw;
  background-color: #fff;
  padding: 0 0.3125vw;
}
.sec1 .arti3 p span em{
  position : relative;
  z-index : 10;
  color: #0060DF;
}



.sec2{
  position: relative;
}
.orb{
  width : 30.271vw;
  margin: 2.92vw auto 4.43vw;
  aspect-ratio: 1/1;
}
.sec2 .p1{
  margin-top : 29.375%;
  font-size: 2.3438vw;
  font-weight: 700;
  color: #fff;
  text-align: center;
}
.sec2 .p1 span{
  position: relative;
  margin-right : 0.5208vw;
  padding: 0 0.3125vw;
  letter-spacing: -0.0781vw;
  background-color: #fff;
}
.sec2 .p1 span em{
  position : relative;
  z-index : 10;
  color: #0060DF;
}
.sec2 .p2{
  margin-top: 37.917%;
  /* margin-top: 0; */
  font-size: 2.3438vw;
  font-weight: 700;
  color: #fff;
  line-height: 120%;
  text-align: center;
  letter-spacing: -0.0781vw;
}




.sec3{
  --mt: 10.4167vw;
  padding-top: var(--mt);
}
.sec3 .arti1{
  margin-top : 10.4167vw;
  padding-bottom: 57.2917vw;
}
.sec3 .arti1 >p{
  position: relative;
  z-index : 20;
  font-size: 2.3438vw;
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -0.0781vw;
  color: #fff;
  text-align: center;
  min-height: 6.5625vw;
}
.sec3 .arti1 > p em{
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%,-50%);
  opacity: 0;
  transition: opacity .35s ease-in-out;
}
.sec3 .arti1 > p .off_txt{opacity: 1;}
.sec3 .arti1 > p .on_txt{opacity: 0;}
.sec3.on .arti1 > p .off_txt{opacity: 0;}
.sec3.on .arti1 > p .on_txt{opacity: 1;}
.sec3 .arti1 p span{
  color: #93F6FF;
}
.sec3 .arti1 > div p{
  position: absolute;
  z-index : 15;
  width : max-content;
  font-family: "UhBee jung";
  font-size: 1.8229vw;
  font-weight: 400;
  color: #004097;
  letter-spacing: -0.0781vw;
  border-radius: 1.5625vw;
  background-color: #DBF9FF;
  box-shadow: 0 0 1.3021vw 0 rgba(12, 62, 147, 0.10);
  opacity: 0;
  transform: translatey(-2.0833vw);
  transition: transform .35s ease-in-out, opacity .35s ease-in-out;
}
.sec3 .arti1 > div p::after{
  display: block;
  position: absolute;
  margin-top: -0.0521vw;
  top: 100%;
  content: "";
  width : 1.4583vw;
  height: 0.8333vw;
  background: url("../images/visuals/message_tail.svg") no-repeat center / cover;
}
.sec3 .arti1 > div p.clr2::after{
  background-image: url("../images/visuals/message_tail2.svg");
}
.sec3 .arti1 > div p.clr2{background-color: #9AC8E8;}
.sec3 .arti1 > div p.t_l::after{left: 1.8750vw; transform: scaleX(-1)}
.sec3 .arti1 > div p.t_r::after{right : 1.8750vw;}

.sec3 .on_wrap,
.sec3 .off_wrap{
  position: absolute;
  top: 0;
  width : 100%;
  transition: opacity .35s ease-in-out;
}
.sec3 .on_wrap img,
.sec3 .off_wrap img{
  position: absolute;
  left: 50%; top:calc(-28.7500vw - var(--mt));
  transform: translateX(-50%);
  width : 100%;
  z-index : 10;
}
.sec3 .off_wrap p:nth-child(1){
  top: calc(19.7917vw - var(--mt));
  left: 30.4167vw;
  padding: 1.3542vw 3.9583vw;
}
.sec3 .off_wrap p:nth-child(2){
  top: calc(22.7083vw - var(--mt));
  left: 51.0417vw;
  padding: 1.3542vw 3.0208vw;
}
.sec3 .off_wrap p:nth-child(3){
  top: calc(28.3854vw - var(--mt));
  left: 34.0625vw;
  padding: 1.1458vw 2.6042vw;
}
.sec3 .off_wrap p:nth-child(4){
  top: calc(31.4063vw - var(--mt));
  left: 48.5417vw;
  padding: 1.1458vw 3.5417vw;
}
.sec3 .off_wrap p:nth-child(5){
  top: calc(39.7396vw - var(--mt));
  left: 52.3438vw;
  padding: 1.1458vw 2.0833vw;
}
.sec3 .off_wrap p:nth-child(6){
  top: calc(43.2813vw - var(--mt));
  left: 29.6354vw;
  padding: 1.1458vw 4.6875vw;
}
.sec3 .off_wrap p:nth-child(7){
  top: calc(46.5104vw - var(--mt));
  left: 55.4167vw;
  padding: 1.3542vw 1.2500vw;
}
.sec3 .off_wrap p:nth-child(8){
  top: calc(50.9896vw - var(--mt));
  left: 37.6563vw;
  padding: 1.3542vw 5.4167vw;
}
.sec3 .off_wrap.s1 p:nth-child(1),
.sec3 .off_wrap.s1 p:nth-child(2),
.sec3 .off_wrap.s1 p:nth-child(3){
  transform: translateY(0);
  opacity: 1;
}
.sec3 .off_wrap.s2 p:nth-child(4),
.sec3 .off_wrap.s2 p:nth-child(5),
.sec3 .off_wrap.s2 p:nth-child(6){
  transform: translateY(0);
  opacity: 1;
}
.sec3 .off_wrap.s3 p:nth-child(7),
.sec3 .off_wrap.s3 p:nth-child(8){
  transform: translateY(0);
  opacity: 1;
}


.sec3 .on_wrap{
  opacity: 0;
}
.sec3.on .off_wrap{
  opacity: 0;
}
.sec3.on .on_wrap{
  opacity: 1;
}
.sec3.on .on_wrap p{
  opacity: 1;
  transform: translateY(0);
}
.sec3 .on_wrap p:nth-child(1){
  top: calc(19.7917vw - var(--mt));
  left: 30.4167vw;
  padding: 1.3542vw 3.0208vw;
}
.sec3 .on_wrap p:nth-child(2){
  top: calc(22.7083vw - var(--mt));
  left: 50.9896vw;
  padding: 1.3542vw 1.8750vw;
}
.sec3 .on_wrap p:nth-child(3){
  top: calc(27.1875vw - var(--mt));
  left: 34.6354vw;
  padding: 1.1458vw 2.3958vw;
}
.sec3 .on_wrap p:nth-child(4){
  top: calc(30.7813vw - var(--mt));
  left: 46.6667vw;
  padding: 1.1458vw 1.1458vw;
}
.sec3 .on_wrap p:nth-child(5){
  top: calc(40.1563vw - var(--mt));
  left: 47.0313vw;
  padding: 1.1458vw 0.9375vw;
}
.sec3 .on_wrap p:nth-child(6){
  top: calc(43.7500vw - var(--mt));
  left: 29.6875vw;
  padding: 1.1458vw 1.3021vw;
}
.sec3 .on_wrap p:nth-child(7){
  top: calc(46.5104vw - var(--mt));
  left: 55.4167vw;
  padding: 1.3542vw 3.4896vw;
}
.sec3 .on_wrap p:nth-child(8){
  top: calc(50.4167vw - var(--mt));
  left: 37.5000vw;
  padding: 1.3542vw 1.3542vw;
}


.sec4 {
  position : relative;
  padding-bottom: 43.0208vw;
}
.sec4 .scr_wrap > img{
  object-fit: cover;
  height: 100vh;
}
.sec4 h2{
  font-size: 2.9167vw;
  font-weight: 700;
  line-height: 130%;
  letter-spacing: -0.0781vw;
  color: #fff;
  text-align: center;
}
.sec4 h2 span{
  color: #93F6FF;
}
.sec4 .mind_wrap{
  position:  relative;
  margin: 3.1250vw auto 0;
  width : 25.8854vw;
}
.sec4 .mind_wrap .bubble1{
  position: absolute;
  top: 1.8750vw;
  left: -6.6146vw;
  width : 4.3229vw;
  animation-duration: 3s !important;
}
.sec4 .mind_wrap .bubble2{
  position: absolute;
  top: 6.9792vw;
  right : -7.3438vw;
  width : 1.5625vw;
  animation-duration: 4s !important;
}
.sec4 .mind_wrap .bubble3{
  position: absolute;
  top: 12.2396vw;
  right: -6.5104vw;
  width : 2.9688vw;
  animation-duration: 5s !important;
}
.sec4 .mind_wrap [class*=bubble]{
  opacity: 0;
  transform: translateY(100%) scale(.74);
  transition: opacity .5s cubic-bezier(.2,.85,.25,1) , transform .75s cubic-bezier(.2,.85,.25,1);
  animation: bounceAnim 4s .5s ease-in-out infinite forwards;
  animation-play-state: unset;
}
.sec4 .mind_wrap [class*=bubble].show{
  opacity: 1;
  transform: translateY(0) scale(1);
  animation-play-state: running;
}
@keyframes bounceAnim{
  0%{
    transform: translateY(0) scale(1);
  }
  50%{
    transform: translateY(50%) scale(.95);
  }
  100%{
    transform: translateY(0) scale(1);
  }
}

.sec4 #mindFrequencyShift2,
.sec4 #mindFrequencyShift{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width : 25.8854vw;
  height: 25.8854vw;
}
#mindFrequencyShift path{
  opacity: 1;
  transition: opacity .2s linear;
  will-change: opacity;
}
.sec4 p{
  position : absolute;
  top: 18.6458vw; left: 50%;
  transform: translateX(-50%);
  font-size: 2.0833vw;
  font-weight: 700;
  line-height: 130%;
  letter-spacing: -0.0875vw;
  text-align: center;
  color: #fff;
}
.sec4 p span{
  color: #93F6FF;
}
.sec4 strong{
  display : block;
  position: absolute;
  top: 20.8333vw; left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 4.2188vw;
  font-weight: 700;
  line-height: 130%;
  letter-spacing: -0.1266vw;
}
.sec4 em{
  font-size: 6.5625vw;
  line-height: 130%;
}
.sec4 strong.grad{
  background: linear-gradient(86deg, #00EDFF -1.14%, #F7FAFF 49.07%, #FE89E6 105.7%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.sec5{
  --bg:#031a51;           /* 배경 남색 */
  --tile:#0a2472;         /* 카드 배경 */
  --tile-border:#1f5fbf;  /* 카드 테두리 */
  --tile-glow:#55a1ff;    /* 카드 글로우 */
  --w: 25.1755vw;             /* 카드 너비 */
  --h: 31.9271vw;             /* 카드 높이 */
  --h: 100%;
  --gap: 1.5625vw;            /* 중앙 간격 보정 */
}

.sec5 .stage{
  position:relative;
  width:100%;
  height:30.7292vw;
  margin-top : 3.5417vw;
  perspective: 333.3333vw;
  /* transform-style: preserve-3d; */
  touch-action: pan-y;
  user-select: none;
  cursor: grab;
}
.sec5 .stage.is-grabbing{ cursor: grabbing; }

.sec5 .card{
  backface-visibility: hidden;
  position:absolute;left:50%;top:50%;
  width:var(--w);height:var(--h);
  transform:translate(-50%, -50%);
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:1.0417vw;letter-spacing:0.0130vw;
  user-select:none;
  transition:transform .6s cubic-bezier(.2,.85,.25,1), opacity .6s, filter .6s, border-color .4s;
  will-change:transform,opacity,filter;
  overflow: hidden;
  aspect-ratio: 502 / 614;
  border-radius: 1.88vw;
}

.sec5 .card .img_box{
  width : 100%;
  height: 100%;
  object-fit: cover;
}
.sec5 .card .img_box img{
  position: absolute;
  height: 100%;
  object-fit: cover;
  -webkit-user-drag: none;
  user-drag: none; /* 일부 브라우저 비표준 */
  pointer-events: none;
}
.sec5 .card .img_box img.out{
  opacity: 1;
  transition: opacity .35s ease-in-out;
}
.sec5 .card.is-center .img_box img.out{
  opacity: 0;
}

/* 중앙 카드 강조 */
.sec5 .card.is-center{
  filter: opacity(1);
}
.sec5 .card.is-center + .card,
.sec5 .card.is-dim + .card{
  filter: opacity(.8);
}
.sec5 .card.is-dim{
  filter: opacity(.4);
}


.sec5 .nav{
  position:absolute;
  left: 50%; top: 50%;
  transform: translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  width : 33.3333vw;
  height: 2.9167vw;
}
.sec5 .btn{
  pointer-events:auto;
  cursor:pointer;
  border:0;
  outline:0;
  border-radius:52.0313vw;
  width:2.9167vw;
  height:2.9167vw;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,1);
  background: #fff url("../images/ico_arrow.svg") no-repeat center / 1.6667vw;
  transition: opacity .25s ease-in-out;
}
.sec5 .btn:hover{
  opacity: .8;
}
.sec5 .btn#next{
  transform: rotate(180deg);
}
.sec5 .stage .btn_img{
  position: absolute;
  /* right: -0.5208vw; */
  /* bottom: -1.1458vw; */
  right: 2.29vw;
  bottom: 1.77vw;
  /* width : 11.4583vw; */
  /* height: 11.7708vw; */
  width : 5.94vw;
  height: 5.94vw;
  border-radius: 50%;
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s ease-in-out, transform .35s ease-in-out;
  box-shadow: 0 0 20px 2 conic-gradient(from var(--angle), #8FF1FD, #D1C0FF, #88ACFF, #82FFFE, #88ACFF, #D1C0FF, #8FF1FD);
}
.sec5 .stage .card:hover .btn_img{
  transform: scale(1.1);
}
.sec5 .stage .btn_img::before{
  display : block;
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  z-index : 1;
  content: "";
  width : calc(100% - 0.31vw);
  height: calc(100% - 0.31vw);
  border-radius:inherit;
  background: #fff url("../images/ico_audio.png") no-repeat center / cover;
  box-shadow: 0 0 20px 0 rgba(74, 222, 249, 0.4) inset
}
.sec5 .stage .btn_img::after{
  display : block;
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  z-index : 0;
  content: "";
  width : 100%;
  height: 100%;
  border-radius: inherit;
  background-image: conic-gradient(from var(--angle), #8FF1FD, #D1C0FF, #88ACFF, #82FFFE, #88ACFF, #D1C0FF, #8FF1FD);
  animation: playAnimate 2s linear infinite;
  animation-play-state: running;
}
.sec5 .stage .btn_img .glow{
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  isolation: isolate;
  width : 5.94vw;
  height: 5.94vw;
  --glow-size: 0.42vw;
  --ring: 0;
  --blur: 1.56vw;
  --speed: 2.5s;
  --c1: #82FFFE;
  --c2: #88ACFF;
  --c3: #D1C0FF;
  --c4: #8FF1FD;
}
.sec5 .stage .btn_img .glow::before {
  content: "";
  position: absolute;
  inset: calc(var(--glow-size) * -1);
  border-radius: inherit;
  z-index: -1;
  pointer-events: none;
  background: conic-gradient(
          from 0deg,
          var(--c1), var(--c2), var(--c3), var(--c4), var(--c1)
  );
  -webkit-mask: radial-gradient(
          farthest-side,
          transparent calc(100% - var(--ring)),
          #000 calc(100% - var(--ring))
  );
  mask: radial-gradient(
          farthest-side,
          transparent calc(100% - var(--ring)),
          #000 calc(100% - var(--ring))
  );
  filter: blur(var(--blur));
  animation: glow-spin var(--speed) linear infinite;
}

@keyframes glow-spin {
  to { transform: rotate(360deg); }
}

.sec5 .stage .is-center .btn_img{
  opacity: 1;
  visibility : visible;
}
.sec5 .slide_txt{
  margin-top: 3.5417vw;
  font-size: 1.4583vw;
  font-weight: 500;
  color: rgba(194, 243, 254, 0.6);
  text-align: center;
}



.sec5 .cont{
  padding-top: 26.3021vw;
}
.sec5 .cont .sec_tit{
  position: relative;
  display : flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.sec5 .cont .sec_tit::before{
  display: block;
  position: absolute;
  top: -6.0938vw;
  content: "";
  width: 44.0104vw;
  height: 7.5000vw;
  margin: 0 auto;
  background: url("../images/visuals/sec5_title_deco1.svg") no-repeat center / cover;
}
.sec5 .cont .sec_tit h2{
  font-size: 4.1667vw;
  font-weight: 700;
  color: #EEFCFF;
  line-height: 110%;
  letter-spacing: -0.0417vw;
}
.sec5 .cont .sec_tit p{
  position: relative;
  margin-top : 0.3646vw;
  font-size: 2.8646vw;
  font-weight: 600;
  color: #93F6FF;
  line-height: 110%;
  letter-spacing: 0.0573vw;
}
.sec5 .cont .sec_tit p::after{
  display : block;
  position: absolute;
  top: 60%; left: 50%;
  transform: translate(-50%,-50%);
  width: 41.7708vw;
  height : 0.2604vw;
  background: url("../images/visuals/sec5_title_deco2.svg") no-repeat center / cover;
  content: "";
}
.sec5 .cont > .txt{
  margin-top: 30.3125vw;
}
.sec5 .cont > .txt p{
  font-size: 2.0833vw;
  font-weight: 500;
  line-height: 130%;
  color: #fff;
  text-align: center;
  letter-spacing: -0.0781vw;
}
.sec5 .cont > .txt > button{
  display : flex;
  justify-content: center;
  align-items: center;
  width : 15.6250vw;
  height: 4.1667vw;
  border-radius: 26.0417vw;
  background: linear-gradient(180deg, #3380E5 0%, #0060DF 100%);
  font-size: 2.0833vw;
  font-weight: 700;
  color: #fff;
  margin: 2.6042vw auto 0;
}



.sec6 .cont{
  padding-top: 20.3125%;
}
.sec6 .arti1 h2{
  font-size: 1.8229vw;
  font-weight: 600;
  color: #fff;
  letter-spacing: -0.0781vw;
  margin-bottom : 0.2604vw;
  text-align : center;
}
.sec6 .arti1 h3{
  font-size: 2.9167vw;
  font-weight: 700;
  line-height: 130%;
  color: #fff;
  letter-spacing: -0.0781vw;
  text-align : center;
}
.sec6 .arti1 h3 span{
  color: #93F6FF;
}
.sec6 .cont .card_list{
  gap: 1.5625vw;
  margin-top: 2.1875vw;
}
.sec6 .cont .card{
  display : flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  width : 20.1563vw;
  height: 26.2500vw;
  border-radius: 1.5625vw;
  border: 0.1563vw solid transparent;
  /* background: linear-gradient(329deg, rgba(255, 255, 255, 0.00) 0%, rgba(255, 255, 255, 0.20) 100%), #0040D2; */
  /* background-blend-mode: screen, normal; */
  background-image: linear-gradient(329deg, #064199 0%,#064199  100%),linear-gradient(0deg, #82FFFE 0%, #88ACFF 34%, #D1C0FF 67%, #8FF1FD 100%);
  background-origin: border-box;
  background-clip: content-box, border-box;
  opacity: 0;
  transform: translateY(5.2083vw);
  transition-duration: .85s;
  transition-property: opacity, transform;
  transition-timing-function: cubic-bezier(0,-0.57,.06,1);
}
.sec6 .card_list.show .card{
  opacity: 1;
  transform: translateY(0)
}
.sec6 .card_list.show .card:nth-child(1){
  transition-delay: .333s;
}
.sec6 .card_list.show .card:nth-child(2){
  transition-delay: .666s;
}
.sec6 .card_list.show .card:nth-child(3){
  transition-delay: 1s;
}
.sec6 .arti1 .card span{
  position: absolute;
  top: 1.7708vw; left: 1.7708vw;
  font-size: 1.5625vw;
  font-weight: 600;
  color: #93F6FF;
}
.sec6 .arti1 .card img{
  width : 7.3438vw;
  margin: 2.8125vw auto 0;
}
.sec6 .arti1 .card strong{
  display : block;
  font-size: 2.3438vw;
  font-weight: 700;
  color: #93F6FF;
  text-align: center;
  margin-top: 2.3958vw;
  letter-spacing: -0.0781vw;
}
.sec6 .arti1 .card p{
  margin-top: 0.5729vw;
  font-size: 1.8229vw;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.0781vw;
  color: #fff;
  text-align: center;
}

.sec6 .arti2{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.9167vw;
  padding-top: 22.188%;
}
.sec6 .arti2 h2{
  font-size: 2.6042vw;
  font-weight: 700;
  line-height: 130%;
  letter-spacing: -0.0781vw;
  color: #283037;
}
.sec6 .arti2 h2 span{
  color: #0060DF;
}
.sec6 .arti2 h3{
  margin-top: 1.5625vw;
  font-size: 1.8229vw;
  color: #283037;
  line-height: 140%;
  letter-spacing: -0.0781vw;
}
.sec6 .arti2 h3 img{
  display:inline;
  max-width:max-content;
  width : 2.5vw;
  height: auto;
  transform: translateY(0.4167vw);
}
.sec6 .arti2 h3 span{
  color: #0060DF;
}
.sec6 .form_wrap{
  min-height: 36.9792vw;
}
.sec6 form{
  width: calc(100% - 2.0833vw);
  max-width: 27.6042vw;
  padding: 1.8750vw 1.7708vw 2.8125vw;
  border-radius: 1.5625vw;
  background-color: rgba(255,255,255,.5);
}
.sec6 form h4{
  margin-bottom : 0.3125vw;
  font-size: 1.3021vw;
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -0.0781vw;
  color: #0060DF;
}
.sec6 form h4:not(:first-of-type){
  margin-top : 1.25vw;
}
.sec6 form .label{
  min-width : 4.0625vw;
  font-size: 1.1458vw;
  font-weight: 500;
  line-height: 140%;
  color: #283037;
  letter-spacing: -0.0781vw;
}
.sec6 form input[type="text"]{
  width : calc(100% - 4.0625vw);
  height: 2.1875vw;
  padding: 0 0.8333vw;
  font-size: 1.1979vw;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.0781vw;
  color: #283037;
  border-radius: 0.5208vw;
  background-color: rgba(255,255,255,.6);
  outline: none;
}
.sec6 form .tel_wrap{
  width : calc(100% - 4.0625vw);
}
.sec6 form .tel_wrap span{
  display : inline-block;
  min-width : 1.4323vw;
  line-height: 2.1875vw;
  vertical-align: middle;
  font-size: 1.1979vw;
  font-weight: 500;
  text-align: center;
  color: #283037;
}
.sec6 form .tel_wrap input[type=tel],
.sec6 form .tel_wrap select{
  width : calc(100% - 2.8646vw);
  height: 2.1875vw;
  padding: 0 0.8333vw;
  font-size: 1.1979vw;
  border-radius: 0.5208vw;
  border: none;
  outline: none;
  background-color: rgba(255,255,255,.6);
}
.sec6 form .tel_wrap select{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: rgba(255,255,255,.6) url("../images/ico_select_arrow.svg") no-repeat calc(100% - 0.5729vw) center / 0.7292vw 0.7292vw;
}
.sec6 form #tel1,
.sec6 form #tel2{
  position: absolute;
  overflow: hidden;
  width : 0;
  height: 0;
}
.sec6 form #termsChk{
  position : absolute;
  overflow: hidden;
  width : 0;
  height: 0;
}
.sec6 form #termsChk + label{
  display : flex;
  align-items: center;
  gap: 0.5208vw;
  margin-top: 0.7292vw;
  font-size: 0.9896vw;
  font-weight: 400;
  color: #2e587c;
  line-height: 140%;
  letter-spacing: -0.0781vw;
}
.sec6 form #termsChk + label::before{
  display : block;
  content: "";
  width : 1.4583vw;
  height: 1.4583vw;
  border-radius: 50%;
  background: url("../images/ico_chk.svg") no-repeat center / cover;
  transition: background .2s ease-in-out;
}
.sec6 form #termsChk:checked + label::before{
  background: url("../images/ico_chked.svg") no-repeat center / cover;
}
.sec6 form button[type=submit]{
  display : flex;
  justify-content: center;
  align-items: center;
  width : 13.8542vw;
  height: 3.4375vw;
  margin: 1.3542vw auto 0;
  font-size: 1.7188vw;
  font-weight: 600;
  line-height: 130%;
  letter-spacing: -0.0781vw;
  color: #fff;
  border-radius: 26.0417vw;
  background: linear-gradient(180deg, #3380E5 0%, #0060DF 100%);
}


.sec6 form .mt{
  margin-top: 0.5208vw;
}
.sec6 form .terms_wrap{
  margin-top: 1.1979vw;
  overflow: hidden;
  border-radius: 0.5208vw;
  background-color: #C7E3F5;
}
.sec6 form .terms_wrap button{
  width : 100%;
  height: 2.3958vw;
  padding: 0 0.8333vw;
  font-size: 1.1458vw;
  font-weight: 600;
  color: #465966;
  line-height: 140%;
  letter-spacing: -0.0781vw;
}
.sec6 form .terms_wrap button::after{
  display : block;
  content: "";
  width : 1.2500vw;
  height :1.2500vw;
  background: url("../images/ico_terms_arrow.svg") no-repeat center / cover;
  transition: transform .35s ease-in-out;
}
.sec6 form .terms_wrap button.active::after{
  transform: rotate(180deg);
}
.sec6 form .terms_wrap #terms{
  max-height: 0;
  overflow: hidden;
  border-top: 0.0521vw solid rgba(148, 171, 202, 0);
  transition: max-height .35s ease-in-out, border-top-color .35s ease-in-out;
}
.sec6 form .terms_wrap #terms.active{
  border-top-color:rgba(148, 171, 202, 1);
  max-height: 78.1250vw;
}
.sec6 form .terms_wrap #terms p{
  padding: 0.5208vw 0.7292vw;
  font-size: 0.7292vw;
  font-weight: 400;
  color: #465966;
}

.sec7 .arti1{
  padding-top: 18.594%;
  padding-bottom : 17.8542vw;
}
.sec7 .arti1 h2{
  font-size: 3.4375vw;
  font-weight: 600;
  color: #fff;
  line-height: 130%;
  letter-spacing: -0.0781vw;
  text-align: center;
}
.sec7 .arti1 .txt_box{
  display: flex;
  align-items: center;
  gap: 0.5208vw;
  width: calc(100% - 2.0833vw);
  max-width: 62.5000vw;
  height: 33.1250vw;
  margin: 3.1250vw auto 0;
  padding-left: 2.0833vw;
  border-radius: 1.5625vw;
  background-color: #DBF6FF;
}
.sec7 .arti1 .txt_box > img{
  width : 25.5208vw;
}
.sec7 .arti1 strong{
  display: flex;
  align-items: center;
  gap: 0.2083vw;
  width: max-content;
  margin-bottom: 0.4167vw;
  font-size: 1.8229vw;
  font-weight: 500;
  line-height: 140%;
}
.sec7 .arti1 strong img{
  width : 9.5313vw;
  width: 15.5208vw;
  transform: translateY(-0.3125vw);
}
.sec7 .arti1 h3{
  margin-bottom : 1.5625vw;
  font-size: 2.9167vw;
  font-weight: 700;
  color: #283037;
  line-height: 130%;
}
.sec7 .arti1 h3 span{
  color: #0060Df;
}
.sec7 .arti1 p{
  font-size: 1.5625vw;
  font-weight: 400;
  line-height:140%;
  letter-spacing: -0.0781vw;
  color: #2E587C;
}
.sec7 .arti1 em{
  font-weight: 700;
  background-color: #BBECFB;
}

.sec_faq{
  background-color: #CDE9FF;
}
.sec_faq .inner{
  width : calc(100% - 2.0833vw);
  max-width: 62.5000vw;
  padding: 5.2083vw 0;
  margin: 0 auto;
}
.sec_faq h2{
  font-size: 3.4375vw;
  font-weight: 700;
  color: #283037;
  text-align: center;
  margin-bottom: 1.7188vw;
}
.sec_faq ul li:not(:last-child){
  margin-bottom: 1.7188vw;
}
.sec_faq li .wv_accordion_btn{
  display: flex;
  gap: 1.5625vw;
  position: relative;
  width : 100%;
  height: max-content;
  padding: 1.5625vw 2.7604vw;
  font-size: 1.8229vw;
  font-weight: 700;
  line-height: 130%;
  color: #283037;
  background-color : #fff;
  text-align: left;
  letter-spacing: -0.0781vw;
}
.sec_faq li .wv_accordion_btn strong{
  color: #2BAEFF;
  font-weight: 600
}
.sec_faq li .wv_accordion_btn::after{
  display: block;
  position: absolute;
  top: 50%; right : 2.6042vw;
  transform: translateY(-50%);
  content: "";
  width : 2.2917vw;
  height: 2.2917vw;
  background: url("../images/ico_accordion_arrow.svg") no-repeat center / cover;
  transform-origin: center;
  transition: transform .3s ease-in-out;
}
.sec_faq li.active .wv_accordion_btn::after{
  transform: translateY(-50%) rotate(180deg);
}
.sec_faq li .wv_accordion_panel{
  display: flex;
  gap: 1.6667vw;
  border-top: 0.0521vw solid rgba(183, 223, 255, 0);
  padding: 0 2.8125vw 0;
  background-color: #fff;
  max-height: 0;
  overflow: hidden;
}
.sec_faq li.active .wv_accordion_panel{
  max-height: 104.1667vw;
  padding: 0.9375vw 2.8125vw 2.2917vw;
  border-top-color: rgba(183,223,255,1);
}
.sec_faq li .wv_accordion_panel strong{
  font-size: 2.3438vw;
  line-height: 130%;
  color: #2BAEFF;
  font-weight: 600
}
.sec_faq li .wv_accordion_panel p{
  font-size: 1.3021vw;
  font-weight: 400;
  line-height: 153%;
  color: #283037;
  letter-spacing: -0.0781vw;
}


footer{
  display : flex;
  flex-direction : column;
  justify-content: center;
  align-items: center;
  gap: 1.1979vw;
  padding: 1.9792vw 0 2.9688vw;
  background-color: #1B1B1B;
}
footer img{
  width : 24.1667vw;
}
footer p{
  text-align: center;
  font-size: 0.9375vw;
  font-weight: 400;
  color: #eee;
  text-align: center;
}
footer span{
  margin: 0 1.4583vw;
}



.dim{
  position: fixed;
  top: 0; left: 0;
  z-index : 900;
  width : 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.4);
  opacity: 0;
  visibility : hidden;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
}
.dim.show{
  opacity: 1;
  visibility : visible;
}
#storyModal{
  position: fixed;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  z-index : 1000;
  border-radius: 0.5208vw;
  width : 33.3333vw;
  background: #D2F2FE;
  overflow: hidden;
  box-shadow: 0 0.1563vw 1.5625vw 0 rgba(53, 53, 53, 0.30);
  opacity: 0;
  visibility : hidden;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
}
#storyModal.show{
  opacity: 1;
  visibility : visible;
}
#storyModal .hd{
  position: relative;
  padding-top: 3.9583vw;
  padding-bottom : 0.9375vw;
  background-color: #D2F2FE;
}
#storyModal .hd::before{
  display:block;
  position: absolute;
  top: 0; left:1.7188vw;
  content: "";
  width: 2.3958vw;
  height: 3.8021vw;
  background: url("../images/mark.svg") no-repeat center / cover;
}
#storyModal .close_btn{
  position: absolute;
  top: 2.0833vw;
  right: 1.7708vw;
  width : 1.4063vw;
  height: 1.4063vw;
  background: url("../images/ico_modal_close.svg") no-repeat center / cover;
}
#storyModal strong{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.4167vw;
  font-size: 1.5625vw;
  font-weight: 700;
  line-height: 145%;
  letter-spacing: -0.0026vw;
  color: #0060DF;
}
#storyModal strong::before,
#storyModal strong::after{
  display:block;
  content: "";
  width : 6.7708vw;
  height: 0.1563vw;
  background: linear-gradient(270deg, #82FFFE 0%, #88ACFF 33%, #D1C0FF 66%, #8FF1FD 95%, rgba(143, 241, 253, 0.00) 100%);
}
#storyModal h2{
  margin-top: 0.2604vw;
  font-size: 2.3438vw;
  font-weight: 700;
  color: #293037;
  text-align: center;
  line-height: 145%;
  letter-spacing: -0.0781vw;
}
#storyModal .bd{
  padding:  1.5625vw 3.1250vw;
  background-color: #EBF9FF;
}
#storyModal .bd .scrollbar_custom{
  height: 12.2917vw;
  overflow-y: scroll;
}
#storyModal .bd .scrollbar_custom.scrollbar_custom::-webkit-scrollbar-thumb{
  border-width : 0;
  background-color: #2482F8;
}
#storyModal .bd .scrollbar_custom.scrollbar_custom::-webkit-scrollbar{
}
#storyModal .bd p{
  font-size: 1.6667vw;
  text-align: center;
  font-weight: 500;
  line-height: 148%;
  letter-spacing: -0.0781vw;
  color: #6A98C0;
}
#storyModal .bd .audio_spectrum{
  height: 1.6667vw;
  margin-top: 1.2500vw;
}
#storyModal .bd #spectrum{
  width : 100%;
  height: 1.6667vw;
}
#storyModal .ft{
  background-color: #D2F2FE;
  padding: 1.0417vw 1.5625vw 1.3542vw;
}
#storyModal .ft .controller{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.6250vw;
  margin-bottom : 1.3542vw;
}
#storyModal .ft .controller .prev,
#storyModal .ft .controller .next{
  width : 3.1250vw;
  height: 3.1250vw;
  background: url("../images/ico_controll.svg") no-repeat center / cover;
  transition: opacity .35s ease-in-out, transform .1s ease-in-out;
}
#storyModal .ft .controller .prev:hover,
#storyModal .ft .controller .next:hover{
  opacity: .6;
}
#storyModal .ft .controller .prev:active,
#storyModal .ft .controller .next:active{
  transform: scale(.9);
}
#storyModal .ft .controller .next:active{
  transform:  rotate(180deg) scale(.9);
}
#storyModal .ft .controller .next{
  transform: rotate(180deg);
}
#storyModal .ft .controller .toggle_btn{
  position: relative;
  width : 4.0625vw;
  height: 4.0625vw;
  border-radius: 50%;
  filter: drop-shadow(0 0.4167vw 1.0417vw rgba(77, 77, 80, 0));
  transition: transform .2s ease-in-out, opacity .2s ease-in-out;
}
@property --angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0deg;
}
#storyModal .ft .controller .toggle_btn::before{
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  z-index : 1;
  width : calc(100% - 0.3125vw);
  height: calc(100% - 0.3125vw);
  background-color: #fff;
  background-size: 2.3958vw;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: inherit;
  box-shadow: 0 0 1.0417vw 0 rgba(74, 222, 249, 0.40) inset;
  filter: drop-shadow(0 0.4167vw 1.0417vw rgba(77, 77, 80, 0.20));
  transition: filter .2s ease-in-out;
}
#storyModal .ft .controller .toggle_btn:active{
  transform: translateY(2%);
  opacity: .8;
}
#storyModal .ft .controller .toggle_btn:active::before{
  filter: drop-shadow(0 0.4167vw 1.0417vw rgba(77, 77, 80, 0.10));
}
#storyModal .ft .controller .toggle_btn::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index : -1;
  width : 100%;
  height: 100%;
  border-radius: inherit;
  background-image: conic-gradient(from var(--angle),
  #82FFFE, #88ACFF, #D1C0FF, #8FF1FD);
  animation: playAnimate 2s linear infinite;
  animation-play-state: paused;
}
#storyModal .ft .controller .toggle_btn.play::after{
  animation-play-state: running;
}
@keyframes playAnimate {
  to{
    --angle: 360deg;
  }
}
#storyModal .ft .controller .toggle_btn.paused::before{
  background-image: url("../images/ico_pause.svg");
}
#storyModal .ft .controller .toggle_btn.play::before{
  background-image: url("../images/ico_play.svg");
}
#storyModal .ft > div{
  gap: 0.8333vw;
}
#storyModal .ft .share,
#storyModal .ft .like{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8333vw;
  flex: 1;
  height: 4.1667vw;
  border-radius: 0.7813vw;
  font-size: 1.8229vw;
  font-weight: 600;
  line-height: 150%;
  letter-spacing: -0.0781vw;
}
#storyModal .ft .share{
  background-color: #fff;
  color :#0060DF;
}
#storyModal .ft .share::before{
  content: "";
  width: 1.6667vw;
  height :1.6667vw;
  background: url("../images/ico_share.svg") no-repeat center / cover;
}
#storyModal .ft .like{
  background-color: #0060DF;
  color: #fff;
}
#storyModal .ft .like span{
  display: flex;
  align-items: center;
  gap: 0.31vw;
}
#storyModal .ft .like[disabled]{
  cursor: not-allowed;
  opacity: .9;
}
#storyModal .ft .like span::before{
  content: "";
  width : 1.9792vw;
  height: 1.9792vw;
  background: url("../images/ico_heart.svg") no-repeat center / cover;
}
#storyModal .ft .like[disabled] span::before{
  background: url("../images/ico_heart_fill.svg") no-repeat center / cover;
}


#helpModal{
  position: fixed;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  z-index : 1000;
  border-radius: 0.5208vw;
  width : 38.0208vw;
  padding: 2.3958vw 2.1875vw 1.8750vw;
  background: #ffffff;
  overflow: hidden;
  opacity: 0;
  visibility : hidden;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
}
#helpModal.show{
  opacity: 1;
  visibility : visible;
}
#helpModal h2{
  font-size: 2.0833vw;
  font-weight: 700;
  letter-spacing: -0.0781vw;
  line-height: 130%;
  color: #2278F2;
  text-align: center;
  margin-bottom : 1.3542vw;
}
#helpModal .dp_f{
  gap: 0.7292vw;
}
#helpModal .help_box{
  padding: 0.9375vw 1.1458vw 1.1458vw;
  border-radius: 0.5208vw;
  background-color: #F6F8F9;
}
#helpModal h3{
  display: flex;
  align-items: center;
  gap: 0.6250vw;
  font-size: 1.8229vw;
  font-weight: 600;
  line-height: 130%;
  letter-spacing: -0.0781vw;
  color: #002285;
}
#helpModal p{
  display:inline-block;
  font-size: 1.5625vw;
  line-height: 130%;
  letter-spacing: -0.0781vw;
  color : #283037;
  padding-left: 2.5000vw;
}
#helpModal p span{
  font-weight: 600;
}
#helpModal .img1{
  width : 2.0313vw;
}
#helpModal .img2{
  width: 2.0833vw;
}
#helpModal .img3{
  width: 1.7188vw;
}

.alertModal{
  position: fixed;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  z-index : 1000;
  border-radius: 0.5208vw;
  width : 38.0208vw;
  padding: 2.3958vw 2.1875vw 1.8750vw;
  background: #ffffff;
  overflow: hidden;
  opacity: 0;
  visibility : hidden;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
}
.alertModal.show{
  opacity: 1;
  visibility : visible;
}
.alertModal p{
  font-size: 1.8229vw;
  font-weight: 600;
  color: #2E587C;
  line-height: 150%;
  letter-spacing: -0.0781vw;
  text-align : center;
}

.modal_close_btn{
  display: flex;
  justify-content: center;
  align-items: center;
  width : 10.4167vw;
  height: 3.1250vw;
  margin: 1.3542vw auto 0;
  border-radius: 5.2083vw;
  font-size: 1.8229vw;
  font-weight: 600;
  color: #fff;
  line-height: 130%;
  letter-spacing: -0.0781vw;
  background: linear-gradient(180deg, #509BF9 0%, #2582F8 100%);
}






@media all and (max-width: 768px){

  main .sec2_back_img{
    top: 412.2222vw;
    width : 163.3333vw;
    max-width : max-content;
  }
  .orb{
    width : 54.44vw;
    max-width : max-content;
    margin: 8.89vw auto 11.67vw;
  }

  .sec1 .arti1 .img_box{
    width : 100%;
    max-width : 100%;
  }
  .sec1 .cont{
    padding-top: 189.5%;
    padding-top: 195.5556vw;
  }
  .sec1 .arti2{
    margin-top: 0;
    padding-bottom: 2.7778vw;
  }
  .sec1 .arti2 .txt_box{
    padding-left: 0;
    width: 100%;
    max-width: 100%;
    height: max-content;
    padding-top: 0;
    box-shadow: none;
    border: none;
    border-radius: 0;
    background: none;
  }
  .sec1 .arti2 .txt_box p{
    order: 1;
    font-size: 5.0000vw;
    line-height: 7.8889vw;
    text-align: center;
  }
  .sec1 .arti2 .txt_box p span{
    font-size: 6.6667vw;
    line-height: 8.8889vw;
  }
  .sec1 .arti2 .txt_box p + .img_box{
    order: 2;
    width : 38vw;
    margin: 5.2778vw auto 5.8333vw;
    position: relative;
    right : auto;
    bottom: auto;
    height: auto;
    aspect-ratio: 237 / 371;
  }
  .sec1 .arti2 .txt_box h2{
    order: 3;
    margin-top: 0;
    font-size: 6.9444vw;
    line-height: 130%;
    text-align: center;
  }
  .sec1 .arti2 .txt_box h2 span{
    padding: 0 1.11vw;
  }
  .sec1 .arti2 .txt_box h2 + p{
    order: 4;
    margin-top: 1.7778vw;
    font-size: 3.3333vw;
    letter-spacing: -0.4167vw;
    text-align: center;
    line-height: 1;
  }

  .sec1 .arti3{
    width : calc(100% - 8.3333vw);
    max-width : 100%;
  }
  .sec1 .arti3 .bubbles{
    width : 8.8889vw;
  }
  .sec1 .arti3 .bubbles img{
    width : 100%;
  }
  .sec1 .arti3 .video_box{
    margin-top: 17.2222vw;
    width : 100%;
    border-width : 0.2778vw;
    border-radius: 1.6667vw;
  }
  .sec1 .arti3 p{
    margin-top: 5.8333vw;
    font-size: 5.5556vw;
    line-height: 135%;
  }
  .sec1 .arti3 p span{
    margin-right : 1.11vw;
    padding: 0 1.11vw;
  }

  .sec2 .p1{
    margin-top: 40%;
    font-size: 5.5556vw;
    line-height: 130%;
  }
  .sec2 .p1 span{
    margin-right : 1.11vw;
    padding: 0 1.11vw;
  }
  .sec2 .p2{
    margin-top : 73%;
    /* margin-top : 0; */
    font-size: 5.5556vw;
    line-height: 130%;
    letter-spacing: -0.4167vw;
  }

  .sec3{
    --mt: 0;
  }
  .sec3 .arti1{
    margin-top: 33.0556vw;
    padding-top: 20.5556vw;
    padding-bottom: 125.8889vw;
    padding-bottom: 137.8889vw;
  }
  .sec3 .arti1 >p{
    width : 100%;
    min-height: 15.5556vw;
    font-size: 5.5556vw;
    line-height: 140%;
  }
  .sec3 .arti1 > p em{
    width : 100%;
  }
  .sec3 .on_wrap img, .sec3 .off_wrap img{
    top: 0;
  }
  .sec3 .arti1 > div p{
    border-radius: 2.7778vw;
    font-size: 3.6111vw;
    letter-spacing: -0.1389vw;
  }
  .sec3 .arti1 > div p::after{
    width : 2.7778vw;
    height: 1.6667vw;
    margin-top: -0.2778vw;
  }
  .sec3 .off_wrap p:nth-child(1){
    top: 44.1667vw;
    left: 11.9444vw;
    padding: 2.5000vw 6.9444vw;
  }
  .sec3 .off_wrap p:nth-child(2){
    top: 49.4444vw;
    left: 50.8333vw;
    padding: 2.5000vw 5.5556vw;
  }
  .sec3 .off_wrap p:nth-child(3){
    top: 59.7222vw;
    left: 19.7222vw;
    padding: 1.9444vw 5.5556vw;
  }
  .sec3 .off_wrap p:nth-child(4){
    top: 72.2222vw;
    left: 37.5000vw;
    padding: 1.9444vw 7.5000vw;
  }
  .sec3 .off_wrap p:nth-child(5){
    top: 85.2778vw;
    left: 47.7778vw;
    padding: 1.9444vw 4.7222vw;
  }
  .sec3 .off_wrap p:nth-child(6){
    top: 98.3333vw;
    left: 28.3333vw;
    padding: 1.9444vw 5.8333vw;
  }
  .sec3 .off_wrap p:nth-child(7){
    top: 111.6667vw;
    left: 44.1667vw;
    padding: 2.5000vw 6.1111vw;
  }
  .sec3 .off_wrap p:nth-child(8){
    top: 125.5556vw;
    left: 28.8889vw;
    padding: 2.5000vw 5.5556vw;
  }
  .sec3 .on_wrap p:nth-child(1){
    top: 44.4444vw;
    left: 12.2222vw;
    padding: 2.2222vw 5.8333vw;
  }
  .sec3 .on_wrap p:nth-child(2){
    top: 48.3333vw;
    left: 49.4444vw;
    padding: 2.2222vw 3.6111vw;
  }
  .sec3 .on_wrap p:nth-child(3){
    top: 58.6111vw;
    left: 20.8333vw;
    padding: 1.6667vw 4.7222vw;
  }
  .sec3 .on_wrap p:nth-child(4){
    top: 70.5556vw;
    left: 34.4444vw;
    padding: 1.6667vw 4.1667vw;
  }
  .sec3 .on_wrap p:nth-child(5){
    top: 82.2222vw;
    left: 31.1111vw;
    padding: 1.6667vw 2.2222vw;
  }
  .sec3 .on_wrap p:nth-child(6){
    top: 100.2778vw;
    left: 27.7778vw;
    padding: 1.6667vw 2.7778vw;
  }
  .sec3 .on_wrap p:nth-child(7){
    top: 112.2222vw;
    left: 49.7222vw;
    padding: 2.2222vw 6.9444vw;
  }
  .sec3 .on_wrap p:nth-child(8){
    top: 125.5556vw;
    left: 28.0556vw;
    padding: 2.2222vw 3.3333vw;
  }

  .sec4{
    padding-bottom: 96.3889vw;
  }
  .sec4 h2{
    font-size: 5.5556vw;
    line-height: 130%;
    letter-spacing: -0.4167vw;
  }
  .sec4 .mind_wrap{
    width : 56.1111vw;
    margin: 8.3333vw auto 0;
  }
  .sec4 .mind_wrap .bubble1{
    top: -1.9444vw;
    left: -13.3333vw;
    width : 8.8889vw;
  }
  .sec4 .mind_wrap .bubble2{
    top: 12.5000vw;
    right: -13.8889vw;
    width : 3.3333vw;
  }
  .sec4 .mind_wrap .bubble3{
    top: 23.6111vw;
    right: -10.2778vw;
    width : 5.8333vw;
  }
  .sec4 #mindFrequencyShift2, .sec4 #mindFrequencyShift{
    width : 100%;
    height: 56.1111vw;
  }
  .sec4 p{
    top: 40.0000vw;
    font-size: 4.4444vw;
    letter-spacing: -0.4167vw;
  }
  .sec4 strong{
    top: 45.0000vw;
    font-size: 8.8889vw;
    letter-spacing: -0.4167vw;
  }
  .sec4 strong em{
    font-size: 13.8889vw;
  }

  .sec5{
    --w: 27.2222vw;
    --h: 33.0556vw;
    --gap: 2.7778vw;
    padding-bottom : 0;
  }
  .sec5 .cont{
    /* padding-top: 95.2778vw; */
    padding-top: 70.22vw;
  }
  .sec5 .cont .sec_tit::before{
    width : 63.3333vw;
    height: 5.5556vw;
  }
  .sec5 .cont .sec_tit h2{
    font-size: 6.6667vw;
    line-height: 110%;
    letter-spacing: -0.2778vw;
  }
  .sec5 .cont .sec_tit p{
    font-size: 4.4444vw;
    letter-spacing: 0.2778vw;
  }
  .sec5 .cont .sec_tit p::after{
    width: 68.8889vw;
    height: auto;
    aspect-ratio: 802 / 5;
  }
  .sec5 .stage{
    height: 47.2222vw;
    margin-top: 5.5556vw;
    perspective: 333.3333vw;
  }
  .sec5 .stage .btn_img::before{
    box-shadow: none;
  }
  .sec5 .nav{
    width : calc(100% - 5.5556vw);
    height: 6.6667vw;
  }
  .sec5 .btn{
    width : 6.6667vw;
    height: 6.6667vw;
    background-size : 3.8889vw;
  }
  .sec5 .slide_txt{
    margin-top: 66%;
    font-size: 3.3333vw;
    font-weight : 400;
  }
  .sec5 .cont > .txt{
    margin-top: 45.8333vw;
    margin-top: 40%;
    padding-bottom : 0;
  }
  .sec5 .cont > .txt p{
    font-size: 5.0000vw;
    letter-spacing: -0.3333vw;
  }
  .sec5 .cont > .txt > button{
    width : 38.8889vw;
    height: 12.2222vw;
    margin : 5.0000vw auto 0;
    font-size: 5.5556vw;
    border-radius: 16.6667vw;
  }

  .sec6 .cont{
    padding-top: 34.2222vw;
    padding-top : 32%;
  }
  .sec6 .arti1 h2{
    font-size: 4.4444vw;
    letter-spacing: -0.2778vw;
    margin-bottom : 0.5556vw;
  }
  .sec6 .arti1 h3{
    font-size: 6.1111vw;
    letter-spacing: -0.2778vw;
  }
  .sec6 .cont .card_list{
    flex-direction: column;
    gap: 4.1667vw;
    margin-top : 7.2222vw;
    padding: 0 4.1667vw;
  }
  .sec6 .cont .card{
    flex-direction: row;
    width : 100%;
    height: 30.5556vw;
    padding-top : 0;
    border-width : 0.2778vw;
    border-radius: 1.6667vw;
  }
  .sec6 .cont .card > div{
    min-width : 59.4444vw;
    width : 59.4444vw;
  }
  .sec6 .arti1 .card span{
    top: 2.7778vw;
    left: 3.3333vw;
    font-size: 3.3333vw;
  }
  .sec6 .arti1 .card img{
    width : 17.2222vw;
    margin: 0 auto;
  }
  .sec6 .arti1 .card strong{
    margin-top : 0;
    font-size: 4.4444vw;
    letter-spacing: -0.2778vw;
    text-align : left;
  }
  .sec6 .arti1 .card p{
    width : 100%;
    margin-top: 1.3889vw;
    padding-right : 7.2222vw;
    font-size: 3.8889vw;
    line-height: 135%;
    letter-spacing: -0.2778vw;
    text-align : left;
  }

  .sec6 .arti2{
    flex-direction: column;
    /* padding-top: 33.3333vw; */
    padding-top: 20%;
  }
  .sec6 .arti2 > .txt{
    padding-top: 20%;
  }
  .sec6 .arti2 h2{
    font-size: 6.1111vw;
    letter-spacing: -0.2778vw;
    line-height: 106%;
    text-align: center;
  }
  .sec6 .arti2 h3{
    font-size: 4.1667vw;
    letter-spacing: -0.2778vw;
    margin-top : 2.7778vw;
    font-weight: 500;
    text-align: center;
  }
  .sec6 .arti2 h3 span{
    font-weight: 600;
  }
  .sec6 .arti2 h3 img{
    width : 5.5556vw;
    transform: translateY(0.8333vw);
  }
  .sec6 .form_wrap{
    min-height: 141.1111vw;
    min-height: max-content;
  }
  .sec6 form .terms_wrap{
    margin-top: 5.5556vw;
    border-radius: 0.5556vw;
  }
  .sec6 form{
    width : calc(100% - 8.3333vw);
    max-width : max-content;
    padding: 5.0000vw 6.1111vw ;
    margin: 6.6667vw auto 0;
  }
  .sec6 form h4{
    font-size: 4.4444vw;
    letter-spacing: -0.2778vw;
    margin-bottom : 3.8889vw;
  }
  .sec6 form h4:not(:first-child){
    margin-bottom: 1.6667vw;
  }
  .sec6 form .label{
    font-size: 4.1667vw;
    min-width : 15.5556vw;
    letter-spacing: -0.2778vw;
  }
  .sec6 form input[type="text"]{
    width : calc(100% - 15.5556vw);
    height: 6.1111vw;
    padding: 0 1.9444vw;
    font-size: 3.8889vw;
    letter-spacing: -0.2778vw;
    border-radius: 0.5556vw;
  }
  .sec6 form .mt{
    margin-top: 2.7778vw;
  }
  .sec6 form .tel_wrap select{
    background: rgba(255,255,255,.6) url("../images/ico_select_arrow.svg") no-repeat calc(100% - 1.9444vw) center / 1.9444vw 1.9444vw;
  }
  .sec6 form .tel_wrap input[type=tel], .sec6 form .tel_wrap select{
    width : calc(100% - 9.4444vw);
    height: 6.1111vw;
    padding: 0 1.9444vw;
    font-size: 3.8889vw;
  }
  .sec6 form .tel_wrap span{
    min-width : 4.7222vw;
    font-size: 3.8889vw;
    line-height: 6.1111vw;
  }
  .sec6 form .terms_wrap button{
    height: 8.3333vw;
    padding: 0 4.4444vw;
    font-size: 3.8889vw;
    letter-spacing: -0.2778vw;
  }
  .sec6 form .terms_wrap button::after{
    width : 2.7778vw;
    height: 2.7778vw;
  }
  .sec6 form .terms_wrap #terms p{
    padding: 1.6667vw 4.4444vw 2.5000vw;
    font-size: 3.3333vw;
  }
  .sec6 form h4:not(:first-of-type){
    margin-top: 2.7778vw;
  }
  .sec6 form #termsChk + label{
    gap: 1.6667vw;
    margin-top : 4.1667vw;
    font-size: 3.6111vw;
    letter-spacing: -0.2778vw;
  }
  .sec6 form #termsChk + label::before{
    width : 6.1111vw;
    height: 6.1111vw;
  }
  .sec6 form button[type=submit]{
    width : 38.8889vw;
    height: 11.2222vw;
    margin-top : 3.3333vw;
    font-size: 5.0000vw;
    letter-spacing: -0.2778vw;
  }

  .sec7 .arti1{
    padding-top: 33.6111vw;
    padding-bottom: 33.8889vw;
    padding-top: 34%;
    padding-bottom: 24%;
    background-color: #CDE9FF;
  }
  .sec7 .arti1 strong{
    font-size: 4.1667vw;
    margin: 0 auto 2.2222vw;
    padding: 0 0.8333vw;
    gap: 0.5556vw;
  }
  .sec7 .arti1 .txt_box strong img{
    width: 34.7222vw;
    margin-left :auto;
    transform: translateY(-0.6667vw);
  }
  .sec7 .arti1 h2{
    font-size: 5.0000vw;
    letter-spacing: -0.2778vw;
  }
  .sec7 .arti1 .txt_box{
    flex-direction: column;
    gap: 0;
    width : calc(100% - 8.3333vw);
    max-width : 100%;
    height: max-content;
    margin: 4.7222vw auto 0;
    padding: 7.2222vw 0 6.1111vw;
    border-radius: 1.6667vw;
  }
  .sec7 .arti1 .txt_box img{
    width : 51.3889vw;
    margin-left: 23.6111vw;
  }
  .sec7 .arti1 h3{
    margin-bottom: 0;
    font-size: 6.1111vw;
    text-align: center;
  }
  .sec7 .arti1 .txt_box > div{
    width : 100%;
  }
  .sec7 .arti1 p{
    font-size: 4.1667vw;
    letter-spacing: -0.2778vw;
    text-align : center;
  }

  .sec_faq .inner{
    width : calc(100% - 8.3333vw);
    max-width : 100%;
    padding: 10.0000vw 0 6.6667vw;
  }
  .sec_faq h2{
    font-size: 5.0000vw;
    margin-bottom: 2.7778vw;
  }
  .sec_faq ul li:not(:last-child){
    margin-bottom: 2.7778vw;
  }
  .sec_faq li .wv_accordion_btn{
    gap: 2.7778vw;
    padding: 2.7778vw 6.8889vw 2.7778vw 3.8889vw;
    font-size: 3.8889vw;
    letter-spacing: -0.2778vw;
  }
  .sec_faq li .wv_accordion_btn::after{
    right: 3.8889vw;
    width : 3.3333vw;
    height: 3.3333vw;
  }
  .sec_faq li .wv_accordion_panel{
    gap: 2.7778vw;
    padding: 0.0000vw 3.6111vw 0.0000vw;
  }
  .sec_faq li.active .wv_accordion_panel{
    max-height: 277.7778vw;
    padding: 2.2222vw 3.6111vw 5.0000vw;
  }
  .sec_faq li .wv_accordion_panel strong{
    font-size: 3.8889vw;
  }
  .sec_faq li .wv_accordion_panel p{
    font-size: 3.3333vw;
  }









  footer{
    gap: 2.2222vw;
    padding: 4.1667vw 10.0000vw 11.3889vw;
  }
  footer img{
    width : 41.9444vw;
  }
  footer p{
    font-size: 2.7778vw;
  }
  footer p > em{
    display : block;
    margin-top: 1.6667vw;
    color: #777;
  }
  .floating_btn{
    top: auto;
    bottom: 2.7778vw;
    right : 2.7778vw;
  }
  .floating_btn.down{
    top: auto;
    bottom: 2.7778vw;
  }
  .floating_btn p{
    width : 15.28vw;
    height: 9.72vw;
    font-size: 3.3333vw;
    padding: 0.5556vw 1.6667vw;
    border-radius: 1.1111vw;
    box-shadow: 0 0.4167vw 1.0417vw 0 rgba(77,77,80,.20);
  }
  .floating_btn p::before{
    width : calc(100% - 0.83vw);
    height: calc(100% - 0.83vw);
  }
  .floating_btn p + img{
    width : 15.0000vw;
  }

  #helpModal{
    width : 77.7778vw;
    padding: 5.0000vw 4.1667vw;
    border-radius: 2.7778vw;
  }
  #helpModal h2{
    margin-bottom: 3.6111vw;
    font-size: 5.0000vw;
    letter-spacing: -0.2778vw;
  }
  #helpModal .dp_f{
    gap: 1.6667vw;
  }
  #helpModal .help_box{
    padding: 2.5000vw 3.3333vw;
    border-radius: 2.7778vw;
  }
  #helpModal h3{
    gap: 2.2222vw;
    font-size: 4.1667vw;
    letter-spacing: -0.2778vw;
  }
  #helpModal p{
    padding-left: 8.0556vw;
    font-size: 4.1667vw;
    letter-spacing: -0.2778vw;
  }
  #helpModal .img1{
    width : 5.5556vw;
  }
  #helpModal .img2{
    width : 5.5556vw;
  }
  #helpModal .img3{
    width : 4.7222vw;
  }
  .modal_close_btn{
    width : 100%;
    height: 12.2222vw;
    margin-top : 4.1667vw;
    font-size:5.0000vw;
    letter-spacing: -0.2778vw;
    border-radius: 16.6667vw;
  }

  .alertModal{
    width : 77.7778vw;
    padding: 4.7222vw 4.1667vw 3.8889vw;
  }
  .alertModal p{
    font-size:5.0000vw;
    letter-spacing: -0.2778vw;
    margin-bottom : 3.6111vw;
  }

  #storyModal{
    width : 79.1667vw;
    border-radius: 2.7778vw;
  }
  #storyModal .close_btn{
    top: 3.8889vw;
    right : 4.7222vw;
    width : 3.3333vw;
    height: 3.3333vw;
  }
  #storyModal .hd{
    padding: 10.2778vw 0 2.2222vw;
  }
  #storyModal .hd::before{
    width : 5.8333vw;
    height: 10.5556vw;
  }
  #storyModal strong{
    gap: 1.1111vw;
    font-size: 4.1667vw;
  }
  #storyModal strong::before, #storyModal strong::after{
    width : 25.8333vw;
    height: 0.5556vw;
  }
  #storyModal h2{
    font-size: 5.5556vw;
    margin-top: 0;
    letter-spacing: -0.2778vw;
  }
  #storyModal .bd{
    padding: 3.8889vw 8.3333vw;
  }
  #storyModal .bd .scrollbar_custom{
    height: 29.1667vw;
  }
  #storyModal .bd .scrollbar_custom.scrollbar_custom::-webkit-scrollbar-thumb{
    border-width : 2px;
    border-color: #2482F8;
  }
  #storyModal .bd .scrollbar_custom.scrollbar_custom::-webkit-scrollbar{
    width : 4px;
  }
  #storyModal .bd p{
    font-size: 4.1667vw;
    letter-spacing: -0.2778vw;
  }
  #storyModal .bd .audio_spectrum{
    height: 4.1667vw;
    margin-top: 3.8889vw;
  }
  #storyModal .bd #spectrum{
    height: 4.1667vw;
  }
  #storyModal .ft{
    padding: 2.7778vw 4.1667vw 3.3333vw;
  }
  #storyModal .ft > div{
    gap: 1.3889vw;
  }
  #storyModal .ft .controller{
    gap: 3.8889vw;
    margin-bottom : 2.7778vw;
  }
  #storyModal .ft .controller .prev, #storyModal .ft .controller .next{
    width : 8.8889vw;
    height: 8.8889vw;
  }
  #storyModal .ft .controller .toggle_btn{
    width : 12.2222vw;
    height: 12.2222vw;
  }
  #storyModal .ft .controller .toggle_btn::before{
    width: calc(100% - 1.1111vw);
    height: calc(100% - 1.1111vw);
    background-size: 7.7778vw;
  }
  #storyModal .ft .share, #storyModal .ft .like{
    gap: 1.9444vw;
    height: 12.5000vw;
    border-radius: 1.6667vw;
    font-size: 4.7222vw;
    letter-spacing: -0.2778vw;
  }
  #storyModal .ft .share::before{
    width : 4.4444vw;
    height: 4.4444vw;
  }
  #storyModal .ft .like span::before{
    content: "";
    width : 5.56vw;
    height: 5.56vw;
    background: url("../images/ico_heart.svg") no-repeat center / cover;
  }
}