@charset "utf-8";

/* m_txt */
.m_txt{}
.m_txt h3{font-size: 42px; color: #000; letter-spacing: -0.05em; word-break: keep-all;}
.m_txt h4{font-size: 24px; color: #03236b; font-weight: 600; margin-top: 20px; word-break: keep-all;}
.m_txt p{font-size: 20px; font-weight: 500; color: #444444; margin-top: 20px; word-break: keep-all; line-height: 1.5em;}
.m_txt p b{color: #000;}

@media all and (max-width:1400px){
	.m_txt h3{font-size: 38px;}
	.m_txt h4{font-size: 22px; margin-top: 17px;}
	.m_txt p{font-size: 19px; margin-top: 17px;}
}
@media all and (max-width:1024px){
	.m_txt h3{font-size: 35px;}
	.m_txt h4{font-size: 21px; margin-top: 15px;}
	.m_txt p{font-size: 18px; margin-top: 15px;}
}
@media all and (max-width:768px){
	.m_txt h3{font-size: 32px;}
	.m_txt h4{font-size: 20px; margin-top: 13px;}
	.m_txt p{font-size: 17px; margin-top: 13px;}
}
@media all and (max-width:500px){
	.m_txt h3{font-size: 29px;}
	.m_txt h4{font-size: 19px;}
	.m_txt p{font-size: 16px;}
}

/* mVisual */
#mVisual{width: 100%; margin-top: 100px;}
#mVisual .w-inner{height: 100%;}
#mVisual .visual{width: 100%;}
#mVisual .visual .mv{position: relative; height: 720px;}
#mVisual .visual .mv .img{position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%;}
#mVisual .visual .mv .img img{width: 100%; height: 100%; object-fit: cover;}
#mVisual .visual .mv .img img.pc{display: block;}
#mVisual .visual .mv .img img.mo{display: none;}
#mVisual .visual .mv .img video{width: 100%; height: 100%; object-fit: cover;}
#mVisual .visual .mv .inner{height: 100%;}
#mVisual .visual .mv .inner .txt{color: #fff; display: flex; flex-direction: column; justify-content: center; height: 100%; margin-top: -20px;}
#mVisual .visual .mv .inner .txt h4{font-size: 24px; font-weight: 500; margin-bottom: 30px; letter-spacing: -0.05em; word-break: keep-all;}
#mVisual .visual .mv .inner .txt h3{font-size: 64px; letter-spacing: -0.05em; word-break: keep-all; line-height: 1.25em;}
#mVisual .progress{position: absolute; width: 100%; display: flex; justify-content: center; align-items: center; bottom: 60px; z-index: 2; gap:45px;}
#mVisual .progress .number{font-size: 22px; color: #fff; display: flex; align-items: center; gap:10px;}
#mVisual .progress .number .now{font-weight: 700;}
#mVisual .progress .number .devide{opacity: 0.5; margin-top: -2px; border-bottom: 0 !important; margin: 0 !important;}
#mVisual .progress .number .all{opacity: 0.5;}
#mVisual .progress .dots{display: flex; align-items: center; gap:45px;}

@property --angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

#mVisual .progress .dots .dot{width: 10px; height: 10px; border-radius: 100%; background-color: #fff; position: relative; transition: .4s; cursor: pointer;}
#mVisual .progress .dots .dot.on{width: 6px; height: 6px;}
#mVisual .progress .dots .dot.on::before {
  content: "";
  position: absolute;
  inset: -14px;
  border-radius: 50%;
  background: conic-gradient(#fff 0deg, #fff var(--angle), transparent var(--angle));
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 1.25px), #000 0);
  mask: radial-gradient(farthest-side, transparent calc(100% - 1.25px), #000 0);
  animation: progressAnim var(--progressTime, 3000ms) linear forwards;
}
#mVisual .progress .dots .dot:nth-child(2).on::before {
	animation: progressAnim var(--progressTime, 12000ms) linear forwards;
}

@keyframes progressAnim {
  from { --angle: 0deg; }
  to   { --angle: 360deg; }
}

#mVisual .progress .play_btn{}
#mVisual .progress .play_btn > div{display: none; cursor: pointer;}
#mVisual .progress .play_btn > div.on{display: block;}
#mVisual .progress .play_btn > div img{max-width: 12px;}


@media all and (max-width:1400px){
	#mVisual .visual .mv{height: 640px;}
	#mVisual .visual .mv .inner .txt h4{font-size: 22px; margin-bottom: 26px;}
	#mVisual .visual .mv .inner .txt h3{font-size: 56px;}
	#mVisual .progress{bottom: 50px; gap:40px;}
	#mVisual .progress .number{font-size: 20px; gap:9px;}
	#mVisual .progress .dots{gap:35px;}
	#mVisual .progress .dots .dot{width: 9px; height: 9px;}
	#mVisual .progress .dots .dot.on{width: 5px; height: 5px;}
	#mVisual .progress .play_btn > div img{max-width: 11px;}
	#mVisual .progress .dots .dot.on::before{inset:-12px;}
}
@media all and (max-width:1024px){
	#mVisual .visual .mv .inner .txt h4{font-size: 21px; margin-bottom: 23px;}
	#mVisual .visual .mv .inner .txt h3{font-size: 48px;}
	#mVisual .progress{bottom: 45px; gap:35px;}
	#mVisual .progress .dots{gap:32px;}
	#mVisual .progress .dots .dot{width: 8px; height: 8px;}
	#mVisual .progress .dots .dot.on{width: 4.5px; height: 4.5px;}
	#mVisual .progress .number{font-size: 19px; gap:9px;}
}
@media all and (max-width:768px){
	#mVisual{margin-top: 70px;}
	#mVisual .visual .mv{height: auto; aspect-ratio: 1 / 1;}
	#mVisual .visual .mv .img img.pc{display: none;}
	#mVisual .visual .mv .img img.mo{display: block;}
	#mVisual .visual .mv .inner{width: 90%;}
	#mVisual .visual .mv .inner .txt{justify-content: flex-start; padding-top: 10%; margin-top: 0px;}
	#mVisual .visual .mv .inner .txt h4{font-size: 20px; margin-bottom: 20px;}
	#mVisual .visual .mv .inner .txt h3{font-size: 42px;}
	#mVisual .progress{bottom: 7%;}
	#mVisual .progress .number{font-size: 18px; gap:8px;}
	#mVisual .progress .dots{gap:28px;}
	#mVisual .progress .dots .dot{width: 7px; height: 7px;}
	#mVisual .progress .dots .dot.on{width: 4px; height: 4px;}
	#mVisual .progress .play_btn > div img{max-width: 10px;}
	#mVisual .progress .dots .dot.on::before{inset:-10px;}
}
@media all and (max-width:500px){
	#mVisual{margin-top: 55px;}
	#mVisual .visual .mv .inner .txt h4{font-size: 19px; margin-bottom: 15px;}
	#mVisual .visual .mv .inner .txt h3{font-size: 36px;}
	#mVisual .progress{bottom: 7%; gap:32px;}
	#mVisual .progress .number{font-size: 16px; gap:7px;}
}


/* inquiry_box */
.inquiry_box{padding: 100px 0;}
.inquiry_box .inner{display: flex; align-items: center; justify-content: space-between; gap:60px;}
.inquiry_box .inner .title{font-size: 42px; font-weight: 600; color: #000000;}
.inquiry_box .inner .title span{color: var(--color1);}
.inquiry_box .inner .form{}
.inquiry_box .inner .form form{display: flex; align-items: center;}
.inquiry_box .inner .form form .input_box{display: flex; align-items: center;}
.inquiry_box .inner .form form .input_box .input{}
.inquiry_box .inner .form form .input_box .input + .input{margin-left: 30px;}
.inquiry_box .inner .form form .input_box .input label{font-size: 20px; font-weight: 500; color:#000000; margin-right: 20px;}
.inquiry_box .inner .form form .input_box .input input{line-height: 54px; border: 1px solid #cfcfcf; border-radius: 10px; padding: 0 3%;}
.inquiry_box .inner .form form .input_box .input input.name{width: 206px;}
.inquiry_box .inner .form form .input_box .input input.tel{width: 245px;}
.inquiry_box .inner .form form .agree{margin-left: 30px;}
.inquiry_box .inner .form form .agree input{margin-right: 5px;}
.inquiry_box .inner .form form .agree label{font-size: 16px; font-weight: 500; color: #222222;}
.inquiry_box .inner .form form .agree label a{font-weight: 700; color: #222; text-underline-position: under; text-decoration: underline;}
.inquiry_box .inner .form form .btn{margin-left: 50px;}
.inquiry_box .inner .form form .btn button{line-height: 64px; background-color: var(--color1); color: #fff; border-radius: 10px; font-size: 20px; text-align: center; padding: 0 50px; font-family: 'Pretendard', sans-serif; font-weight: 700;}

@media all and (max-width:1600px){
	.inquiry_box{padding: 90px 0;}
	.inquiry_box .inner{gap:0px;}
	.inquiry_box .inner .title{font-size: 36px;}
	.inquiry_box .inner .form form .input_box .input label{font-size: 19px; margin-right: 18px;}
	.inquiry_box .inner .form form .input_box .input input{line-height: 52px;}
	.inquiry_box .inner .form form .input_box .input input.name{width: 180px;}
	.inquiry_box .inner .form form .input_box .input input.tel{width: 220px;}
	.inquiry_box .inner .form form .input_box .input + .input{margin-left: 25px;}
	.inquiry_box .inner .form form .btn{margin-left: 45px;}
	.inquiry_box .inner .form form .btn button{line-height: 60px; font-size: 19px; padding: 0 45px;}
}
@media all and (max-width:1400px){
	.inquiry_box{padding: 85px 0;}
	.inquiry_box .inner .form form .input_box .input{flex-direction: column; display: flex;}
	.inquiry_box .inner .form form .input_box .input label{margin-bottom: 8px; font-size: 18px;}
	.inquiry_box .inner .form form .input_box .input input{line-height: 50px;}
	.inquiry_box .inner .form form .input_box .input + .input{margin-left: 35px;}
}
@media all and (max-width:1280px){
	.inquiry_box .inner .title{display: none;}
	.inquiry_box .inner .form{width: 100%;}
	.inquiry_box .inner .form form{justify-content: center;}
	.inquiry_box .inner .form form .input_box .input{flex-direction: row; align-items: center;}
	.inquiry_box .inner .form form .input_box .input + .input{margin-left: 30px;}
	.inquiry_box .inner .form form .input_box .input label{margin-bottom: 0; font-size: 17px; margin-right: 16px;}
	.inquiry_box .inner .form form .input_box .input input{line-height: 47px;}
	.inquiry_box .inner .form form .agree{margin-left: 25px;}
	.inquiry_box .inner .form form .agree label{font-size: 15px;}
	.inquiry_box .inner .form form .btn{margin-left: 40px;}
	.inquiry_box .inner .form form .btn button{line-height: 56px; font-size: 18px; padding: 0 40px;}
}
@media all and (max-width:1024px){
	.inquiry_box{padding: 75px 0;}
	.inquiry_box .inner .form form{flex-wrap: wrap; gap:30px;}
	.inquiry_box .inner .form form .input_box{justify-content: center; flex:100%;}
	.inquiry_box .inner .form form .agree{flex:100%; justify-content: center; margin-left: 0; display: flex;}
	.inquiry_box .inner .form form .btn{margin-left: 0px;}
}
@media all and (max-width:768px){
	.inquiry_box{padding: 70px 0;}
	.inquiry_box .inner .form form .input_box .input label{font-size: 16px; margin-right: 14px;}
	.inquiry_box .inner .form form .input_box .input input{line-height: 44px;}
	.inquiry_box .inner .form form .input_box .input input.name{width: 24vw;}
	.inquiry_box .inner .form form .input_box .input input.tel{width: 34vw;}
	.inquiry_box .inner .form form .input_box .input + .input{margin-left: 4vw;}
	.inquiry_box .inner .form form .btn button{line-height: 53px; font-size: 17px;}
}
@media all and (max-width:500px){
	.inquiry_box{padding: 50px 0;}
	.inquiry_box .inner .form form{gap:25px;}
}


/* sec1 */
#sec1{height: 250dvh; position: relative; display: flex; justify-content: center; align-items: flex-start; padding-top: 400px;}
#sec1 .sticky{position: sticky; top: 50%; left: 0; transform: translateY(-50%); min-width: 46%;}
#sec1 .inner{max-width: max-content; position: static; width: 100%; margin-left: 0; margin-right: 0;}
#sec1 .inner .text{display: flex; align-items: center; gap:25px; }
#sec1 .inner .text + .text{margin-top: 30px;}
#sec1 .inner .text h3{font-size: 72px; color: #000; letter-spacing: -0.025em;}
#sec1 .inner .text h3 span{color: #018ed6;}
#sec1 .inner .text h3 + h3{padding-left: 300px;}
#sec1 .inner .text .img{position: relative; width: max-content;}
#sec1 .inner .text .img img{min-width: 284px; height: 90px; border-radius: 90px; object-fit: cover;}
#sec1 .inner .img_box{position: absolute; left: 262px; top: calc(100% - 90px); max-height: 100dvh; overflow: hidden;}
#sec1 .inner .img_box .img{width: 284px; height: 90px; border-radius: 90px; overflow: hidden;}
#sec1 .inner .img_box .img img {width: 100%; height: 100%; object-fit: cover;}
#sec1 .inner .img_box .txt{position: absolute; opacity: 0; bottom: 110px; color: #fff; width: 50%; right: 0; padding-left: 230px;}
#sec1 .inner .img_box .txt h3{font-size: 48px; margin-bottom: 30px;}
#sec1 .inner .img_box .txt p{opacity: 0.85; font-size: 20px; font-weight: 600; line-height: 1.8em;}
#sec1 .inner .img_box .txt p + p{margin-top: 37px;}

@media all and (max-width:1400px){
	#sec1 .inner .text h3{font-size: 64px;}
	#sec1 .inner .text + .text{margin-top: 25px;}
	#sec1 .inner .text .img img{aspect-ratio:284 / 90; height: 86px; min-width: 0;}
	#sec1 .inner .img_box{left: 238px; top:calc(100% - 86px);}
	#sec1 .inner .img_box .img{aspect-ratio:284 / 90; height: 86px; min-width: 0; width: auto;}
	#sec1 .inner .img_box .txt{padding-left: 110px; bottom: 15%;}
	#sec1 .inner .img_box .txt h3{font-size: 44px; margin-bottom: 25px;}
	#sec1 .inner .img_box .txt p{font-size: 19px;}
	#sec1 .inner .img_box .txt p + p{margin-top: 30px;}
}
@media all and (max-width:1280px){
	#sec1 .inner .text{gap:1.75vw;}
	#sec1 .inner .text h3{font-size: 6vw;}
	#sec1 .inner .text h3 + h3{padding-left: 25vw;}
	#sec1 .inner .text + .text{margin-top: 2vw;}
	#sec1 .inner .text .img img{height: 7vw;}
	#sec1 .inner .img_box{left: 22vw; top:calc(100% - 7vw);}
	#sec1 .inner .img_box .img{height: 7vw;}
	#sec1 .inner .img_box .txt{padding-left: 70px;}
	#sec1 .inner .img_box .txt h3{font-size: 42px;}
	#sec1 .inner .img_box .txt p{font-size: 19px;}
	#sec1 .inner .img_box .txt p + p{margin-top: 25px;}
}
@media all and (max-width:1024px){
	#sec1 .inner .img_box .txt{width: 55%; padding-left: 40px; bottom: 12%;}
}
@media all and (max-width:768px){
	#sec1 .inner .text{gap:2.25vw;}
	#sec1 .inner .text h3{font-size: 8vw;}
	#sec1 .inner .text + .text{margin-top: 2.75vw;}
	#sec1 .inner .text .img img{height: 9vw;}
	#sec1 .inner .img_box{left: 29.5vw;  top:calc(100% - 9vw);}
	#sec1 .inner .img_box .img{height: 9vw;}
	#sec1 .inner .text h3 + h3{padding-left: 31vw;}
	#sec1 .inner .img_box .txt{padding-left: 3%; padding-right: 3%; width: 100%; padding-bottom: 15%; bottom: 0; background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.4), rgba(0,0,0,0.5), rgba(0,0,0,0.6)); text-align: center;}
	#sec1 .inner .img_box .txt h3{font-size: 37px; margin-bottom: 20px;}
	#sec1 .inner .img_box .txt p{font-size: 18px; word-break: keep-all;}
	#sec1 .inner .img_box .txt p br{display: none;}
	#sec1 .inner .img_box .txt p + p{margin-top: 20px;}
}
@media all and (max-width:500px){
	#sec1 .inner .img_box .txt h3{font-size: 34px;}
	#sec1 .inner .img_box .txt p{font-size: 16px;}
}


/* sec1_re */
#sec1_re{background: linear-gradient(to bottom, transparent, #e6edf7); margin-top: 60px;}
#sec1_re .f-inner{display: flex; align-items: flex-start; width: 100%; flex-direction: row-reverse;}
#sec1_re .f-inner .l_cont{width: 55%;}
#sec1_re .f-inner .l_cont .box{height: 100vh; position: relative;}
#sec1_re .f-inner .l_cont .box .txt{/* height: 100%; */display: flex;flex-direction: column;justify-content: center;position: sticky;top: 160px;padding: 100px 8% 160px 120px;}
#sec1_re .f-inner .l_cont .box .txt h3{font-size: 48px; color: #030951; line-height: 1.3em; margin-bottom: 25px; word-break: keep-all;}
#sec1_re .f-inner .l_cont .box .txt p{font-size: 24px; color: #030951; line-height: 1.6em; word-break: keep-all;}
#sec1_re .f-inner .l_cont .box .eng{position: absolute; bottom: 6%; right: 5%; padding-right: 5%; font-size: 6vw; color: #000; opacity: 0.05; font-weight: 800; letter-spacing: -0.05em; text-align: right;}
#sec1_re .f-inner .r_cont{width: 45%; position: sticky; top:100px; height: calc(100vh - 100px); max-width: 864px;}
#sec1_re .f-inner .r_cont .img{}
#sec1_re .f-inner .r_cont .img img{width: 100%; height: calc(100vh - 100px); object-fit: cover;}

@media all and (max-width:1400px){
	#sec1_re .f-inner .l_cont .box .txt{padding: 90px 7% 140px 100px;}
	#sec1_re .f-inner .l_cont .box .txt h3{font-size: 42px; line-height: 1.2em;}
	#sec1_re .f-inner .l_cont .box .txt p{font-size: 22px;}
}
@media all and (max-width:1280px){
	#sec1_re .f-inner .l_cont .box .txt{padding: 85px 7% 130px 80px;}
}
@media all and (max-width:1024px){
	#sec1_re .f-inner .l_cont{width: 52%;}
	#sec1_re .f-inner .l_cont .box .txt{padding: 80px 6% 115px 60px;}
	#sec1_re .f-inner .l_cont .box .txt h3{font-size: 39px;}
	#sec1_re .f-inner .l_cont .box .txt p{font-size: 21px;}
	#sec1_re .f-inner .r_cont{width: 48%;}
}
@media all and (max-width:768px){
	#sec1_re .f-inner{flex-direction: column-reverse;}
	#sec1_re .f-inner .l_cont{width: 100%;}
	#sec1_re .f-inner .l_cont .box{height: auto; min-height: 50vh;}
	#sec1_re .f-inner .r_cont{position: sticky; top: 70px; width: 100%; height: calc(42vh); z-index: 3; background-color: #fff;}
	#sec1_re .f-inner .l_cont .box .txt{padding: 70px 3% 120px;}
	#sec1_re .f-inner .l_cont .box .txt h3{font-size: 32px; margin-bottom: 22px;}
	#sec1_re .f-inner .l_cont .box .txt h3 br{display: none;}
	#sec1_re .f-inner .l_cont .box .txt p{font-size: 19px;}
	#sec1_re .f-inner .r_cont .img{height: 100%; width: 100%;}
	#sec1_re .f-inner .r_cont .img img{height: 100%;}
	#sec1_re .f-inner .l_cont .box .eng{padding-right: 0; right: 3%; font-size: 8vw; bottom: 15%;}
}
@media all and (max-width:500px){
	#sec1_re .f-inner .r_cont{top: 55px;}
	#sec1_re .f-inner .l_cont .box .txt{padding: 65px 3% 110px;}
	#sec1_re .f-inner .l_cont .box .txt h3{font-size: 28px; margin-bottom: 20px;}
	#sec1_re .f-inner .l_cont .box .txt p{font-size: 18px;}
}
@media all and (max-width:440px){
	#sec1_re .f-inner .l_cont .box .txt{padding: 55px 3% 100px;}
	#sec1_re .f-inner .l_cont .box .txt h3{font-size: 26px; margin-bottom: 17px;}
	#sec1_re .f-inner .l_cont .box .txt p{font-size: 17px;}
	#sec1_re .f-inner .r_cont{height: 40vh;}
}


/* sec2 */
#sec2{background:url(/images/main/sec2_bg.webp) no-repeat center center / cover; position: relative; z-index: 2; height: 150vh;}
#sec2 .inner{height: 100vh; position: sticky; top: 0;}
#sec2 .inner .circle_box{position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%);}
#sec2 .inner .circle_box .circle{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 1px; aspect-ratio:1 / 1; border-radius: 100%; animation: circles 2s infinite linear; border: 1px solid #fff; background-color: transparent;}
#sec2 .inner .circle_box .circle1{}
#sec2 .inner .circle_box .circle2{animation-delay: 1s;}
#sec2 .inner .circle_box .circle3{animation-delay: 2s;}
#sec2 .inner .circle_box .circle4{animation: rotates 36s infinite linear;}
#sec2 .inner .txt{display: flex; justify-content: center; align-items: center; height: 100%;}
#sec2 .inner .txt h3{color: #fff; text-align: center; font-size: 56px; line-height: 1.3em;}

@keyframes circles {
	0%{opacity: 0;}
	40%{opacity: 1;}
	100%{opacity: 0; width: 40vw;}
}
@keyframes rotates {
	0%{transform: rotate(0)}
	100%{transform: rotate(360deg)}
}

@media all and (max-width:1024px){
	#sec2 .inner .txt h3{font-size: 52px;}
	#sec2 .inner .circle_box .circle4 img{max-width: 60vw;}
	@keyframes circles {
		0%{opacity: 0;}
		40%{opacity: 1;}
		100%{opacity: 0; width: 80vw;}
	}
}
@media all and (max-width:768px){
	#sec2 .inner .txt h3{font-size: 46px;}
	#sec2 .inner .circle_box .circle4 img{max-width: 65vw;}
}
@media all and (max-width:500px){
	#sec2 .inner .txt h3{font-size: 40px;}
	#sec2 .inner .circle_box .circle4 img{max-width: 70vw;}
}


/* sec3 */
#sec3{height: 400vh; position: relative;}
#sec3 .sticky{position: sticky; top: 0; left: 0; height: 100vh; background: url(/images/main/sec3_bg.webp) no-repeat center center / cover;}
#sec3 .sticky .cont{height: 100%;}
#sec3 .sticky .cont .inner{display: flex; height: 100%; align-items: center; overflow-x: hidden;}
#sec3 .sticky .cont .images{width: 50%; padding-left: 90px;}
#sec3 .sticky .cont .images .img{ border-radius: 240px;}
#sec3 .sticky .cont .images .img .swiper-slide-shadow{display: none;}
#sec3 .sticky .cont .images .img img{}
#sec3 .sticky .cont .text_box{width: 50%;}
#sec3 .sticky .cont .text_box .text{padding-left: 105px;}
#sec3 .sticky .cont .text_box .text h4{font-size: 18px; color: #018fd7; margin-bottom: 20px;}
#sec3 .sticky .cont .text_box .text h3{font-size: 56px; color: #000; margin-bottom: 40px;}
#sec3 .sticky .cont .text_box .text > p{font-size: 20px; font-weight: 500; color: #444444; line-height: 1.6em; word-break: keep-all;}
#sec3 .sticky .cont .text_box .text a.btn{margin-top: 55px; display: inline-flex; justify-content: center; align-items: center; width: 100px; aspect-ratio:1 / 1; border-radius: 100%;  background-color: transparent; z-index: 1; position: relative;}
#sec3 .sticky .cont .text_box .text a.btn::before {
    content: "";
    position: absolute;
    inset: 0; /* 버튼 크기 전체 */
    border-radius: 50%;
    padding: 3px; /* 테두리 두께 */
    background: linear-gradient(to right, #074fa4, #237dd0, #dde9f5, #dde9f5);
    -webkit-mask: 
        linear-gradient(#fff 0 0) content-box, 
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: destination-out;
            mask-composite: exclude;
    pointer-events: none;
	animation: rotates 2s infinite linear;
}
#sec3 .sticky .cont .text_box .text a.btn .circle{}
#sec3 .sticky .cont .text_box .text a.btn .circle p{font-size: 24px; font-weight: 600; color: #0d89d0;}
#sec3 .sticky .tab{position: absolute; bottom: 40px; width: max-content; left: 50%; transform: translateX(-50%); display: flex; align-items: center; background-color: #f7f9fa; padding: 28px 36px; border-radius: 90px; gap:55px;}
#sec3 .sticky .tab li{font-size: 20px; font-weight: 600; color: #666666; cursor: pointer;}
#sec3 .sticky .tab li.on{color: var(--color2);}

@media all and (max-width:1400px){
	#sec3 .sticky .cont .images{padding-left: 70px;}
	#sec3 .sticky .cont .images .img{border-radius: 190px; max-width: 420px;}
	#sec3 .sticky .cont .images .img img{max-width: 420px;}
	#sec3 .sticky .cont .text_box .text{padding-left: 80px;}
	#sec3 .sticky .cont .text_box .text h4{font-size: 17px; margin-bottom: 17px;}
	#sec3 .sticky .cont .text_box .text h3{font-size: 48px; margin-bottom: 35px;}
	#sec3 .sticky .cont .text_box .text > p{font-size: 19px;}
	#sec3 .sticky .cont .text_box .text a.btn{margin-top: 48px; width: 94px;}
	#sec3 .sticky .cont .text_box .text a.btn .circle p{font-size: 23px;}
	#sec3 .sticky .tab{bottom: 35px; gap:45px; padding: 25px 32px;}
	#sec3 .sticky .tab li{font-size: 19px;}
}
@media all and (max-width:1024px){
	#sec3 .sticky .cont .images{padding-left: 3%;}
	#sec3 .sticky .cont .images .img{border-radius: 5vw; max-width: 38vw;}
	#sec3 .sticky .cont .images .img img{max-width: 38vw;}
	#sec3 .sticky .cont .text_box .text{padding-left: 4vw;}
	#sec3 .sticky .cont .text_box .text h4{font-size: 17px; margin-bottom: 15px;}
	#sec3 .sticky .cont .text_box .text h3{font-size: 42px; margin-bottom: 30px;}
	#sec3 .sticky .cont .text_box .text > p{font-size: 18px;}
	#sec3 .sticky .cont .text_box .text > p br{display: none;}
	#sec3 .sticky .cont .text_box .text a.btn{margin-top: 42px; width: 88px;}
	#sec3 .sticky .cont .text_box .text a.btn .circle p{font-size: 22px;}
	#sec3 .sticky .tab{bottom: 32px; gap:40px; padding: 21px 28px;}
	#sec3 .sticky .tab li{font-size: 18px;}
}
@media all and (max-width:768px){
	#sec3 .sticky .cont{padding-top: 50px;}
	#sec3 .sticky .cont .inner{flex-direction: column; justify-content: center; gap:30px;}
	#sec3 .sticky .cont .images{width: 100%; padding-left: 0;}
	#sec3 .sticky .cont .images .img{border-radius: 15px;max-width:100%; max-height: 58vw; aspect-ratio: 1 / 1;}
	#sec3 .sticky .cont .images .img img{max-width:100%; max-height: 58vw; object-fit: contain; width: 100%; height: 100%;}
	#sec3 .sticky .cont .text_box{width: 100%;}
	#sec3 .sticky .cont .text_box .text{padding-left: 0; text-align: center;}
	#sec3 .sticky .cont .text_box .text h4{font-size: 16px; margin-bottom: 13px;}
	#sec3 .sticky .cont .text_box .text h3{font-size: 37px; margin-bottom: 25px;}
	#sec3 .sticky .cont .text_box .text > p{font-size: 17px; width: 85%; margin-left: auto; margin-right: auto;}
	#sec3 .sticky .cont .text_box .text a.btn{display: none;}
	#sec3 .sticky .tab{display: none;}
}
@media all and (max-width:500px){
	#sec3 .sticky .cont .images .img{max-height: 78vw;}
	#sec3 .sticky .cont .images .img img{max-height: 78vw;}
	#sec3 .sticky .cont .text_box .text h4{font-size: 15px; margin-bottom: 10px;}
	#sec3 .sticky .cont .text_box .text h3{font-size: 32px; margin-bottom: 20px;}
	#sec3 .sticky .cont .text_box .text > p{font-size: 16px; width: 90%;}
}


/* sec4 */
#sec4{ padding: 190px 0 50px; position: relative; overflow-x: hidden;}
#sec4 .inner{display: grid; grid-template-columns: repeat(3, 1fr); align-items: flex-start; gap:50px; z-index: 2;}
#sec4 .inner .l_cont{padding-top: 200px;}
#sec4 .inner .l_cont h3{font-size: 56px; font-weight: 700; text-align: right;  background: linear-gradient(to bottom, #018ad3, #03256d);  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; color: transparent;}
#sec4 .inner .l_cont h3 br.mo{display: none;}
#sec4 .inner .c_cont{}
#sec4 .inner .c_cont img{}
#sec4 .inner .r_cont{padding-top: 200px;}
#sec4 .inner .r_cont h4{font-size: 20px; font-weight: 600; color: var(--color2); margin-bottom: 16px;}
#sec4 .inner .r_cont h3{font-size: 48px; color: #000; margin-bottom: 25px;}
#sec4 .inner .r_cont h3 span{font-size: 24px; margin-left: 0px;}
#sec4 .inner .r_cont p{font-size: 20px; font-weight: 600; color: #666666; line-height: 1.6em; word-break: keep-all;}
#sec4 .rolling{display: flex; align-items: center; gap:50px; flex-wrap: nowrap; bottom: 140px; position: absolute; z-index: -2;}
#sec4 .rolling p{font-size: 140px; font-weight: 700; color: var(--color2); opacity: 0.1; white-space: nowrap; animation: rolling 20s infinite linear;}

@keyframes rolling{
	0%{transform: translateX(0);}
	100%{transform: translateX(-100%);}
}

@media all and (max-width:1600px){
	#sec4 .inner{gap:40px;}
}
@media all and (max-width:1400px){
	#sec4{padding: 160px 0 50px;}
	#sec4 .inner .l_cont h3{font-size: 3.85vw;}
	#sec4 .inner .c_cont img{max-width: 31vw;}
	#sec4 .inner .r_cont{padding-top: 200px;}
	#sec4 .inner .r_cont h4{font-size: 19px; margin-bottom: 14px;}
	#sec4 .inner .r_cont h3{font-size: 44px; margin-bottom: 22px;}
	#sec4 .inner .r_cont h3 span{font-size: 22px;}
	#sec4 .inner .r_cont p{font-size: 19px;}
	#sec4 .rolling{bottom: 5%;}
	#sec4 .rolling p{font-size: 128px;}
}
@media all and (max-width:1280px){
	#sec4 .inner .r_cont{padding-top: 170px;}
}
@media all and (max-width:1024px){
	#sec4{padding: 130px 0 50px;}
	#sec4 .inner{gap:32px;}
	#sec4 .inner .l_cont{padding-top: 170px;}
	#sec4 .inner .r_cont{padding-top: 140px;}
	#sec4 .inner .r_cont h4{font-size: 18px; margin-bottom: 12px;}
	#sec4 .inner .r_cont h3{font-size: 38px; margin-bottom: 20px;}
	#sec4 .inner .r_cont h3 span{font-size: 21px;}
	#sec4 .inner .r_cont p{font-size: 18px;}
	#sec4 .inner .r_cont p br{display: none;}
	#sec4 .rolling p{font-size: 112px;}
}
@media all and (max-width:768px){
	#sec4{padding: 40px 0 90px;}
	#sec4 .inner{display: flex; flex-wrap: wrap; gap:50px 30px;}
	#sec4 .inner .l_cont{ padding-bottom: 0; padding-top: 0; margin-bottom: 0px; width: 100%; order: 0;}
	#sec4 .inner .l_cont h3{text-align: center; font-size: 42px; word-break: keep-all;}
/*
	#sec4 .inner .l_cont h3 br{display: none;}
	#sec4 .inner .l_cont h3 br.mo{display: block;}
*/
	#sec4 .inner .c_cont{width: 100%; order: 2; text-align: center;}
	#sec4 .inner .c_cont img{max-width: 65%; width: 100%;}
	#sec4 .inner .r_cont{width: calc(50% - 30px / 2); padding-top: 0; order: 1;display: none;}
	#sec4 .inner .r_cont h4{font-size: 17px; margin-bottom: 10px;}
	#sec4 .inner .r_cont h3{font-size: 35px; margin-bottom: 17px;}
	#sec4 .inner .r_cont h3 span{font-size: 20px;}
	#sec4 .inner .r_cont p{font-size: 17px;}
	#sec4 .rolling p{font-size: 18vw;}
}
@media all and (max-width:500px){
	#sec4{padding: 30px 0 70px;}
	#sec4 .inner .l_cont{margin-bottom: 0px;}
	#sec4 .inner .l_cont h3{font-size: 36px;}
	#sec4 .inner .c_cont{width: 100%;}
	#sec4 .inner .r_cont{width: 100%;}
	#sec4 .inner .r_cont h4{font-size: 16px; margin-bottom: 10px;}
	#sec4 .inner .r_cont h3{font-size: 32px; margin-bottom: 15px;}
	#sec4 .inner .r_cont h3 span{font-size: 19px;}
	#sec4 .inner .r_cont p{font-size: 16px;}
}


/* sec5 */
#sec5{height: 100vh; background: url(/images/main/sec5_bg.webp) no-repeat center center / cover;}
#sec5 .inner{height: 100%; display: flex; align-items: center;}
#sec5 .inner .txt{width: 50%;}
#sec5 .inner .txt h3{font-size: 48px; color: #fff; letter-spacing: -0.05em;}
#sec5 .inner .txt h3 span{color: var(--color2);}
#sec5 .inner .txt .img{margin: 30px 0; border-radius: 100%; box-shadow: 2px 8px 12px rgba(0,0,0,0.1); display: inline-block;}
#sec5 .inner .txt .img img{max-width: 100%;}
#sec5 .inner .txt p{font-size: 20px; font-weight: 500; opacity: 0.85; line-height: 1.8em; color: #fff; word-break: keep-all;}
#sec5 .inner .youtube{width: 50%;}
#sec5 .inner .youtube iframe{width: 100%; aspect-ratio:16 / 9;}

@media all and (max-width:1280px){
	#sec5{height: auto; padding: 140px 0;}
	#sec5 .inner{gap:40px;}
	#sec5 .inner .txt h3{font-size: 44px;}	
	#sec5 .inner .txt .img img{max-width: 138px;}
	#sec5 .inner .txt p{font-size: 19px;}
	#sec5 .inner .txt p br{display: none;}
}
@media all and (max-width:1024px){
	#sec5{padding: 120px 0;}
	#sec5 .inner{gap:35px;}
	#sec5 .inner .txt h3{font-size: 40px;}	
	#sec5 .inner .txt .img img{max-width: 128px;}
	#sec5 .inner .txt p{font-size: 18px;}
}
@media all and (max-width:768px){
	#sec5{padding: 100px 0;}
	#sec5 .inner{flex-direction: column; gap:60px;}
	#sec5 .inner .txt{width: 100%; text-align: center;}
	#sec5 .inner .txt h3{font-size: 36px;}
	#sec5 .inner .txt p{margin-left: auto; margin-right: auto; width: 85%;}
	#sec5 .inner .youtube{width: 100%;}
}
@media all and (max-width:500px){
	#sec5{padding: 85px 0;}
	#sec5 .inner{gap:50px;}
	#sec5 .inner .txt p{font-size: 17px; width: 94%;}
}


/* sec6 */
#sec6{padding: 140px 0;}
#sec6 .m-inner{}
#sec6 .m-inner .m_txt{margin-bottom: 40px;}
#sec6 .m-inner .list{}
#sec6 .m-inner .list li{max-width: 388px; margin-right: 28px;}
#sec6 .m-inner .list li a{display: block; width: 100%;}
#sec6 .m-inner .list li a .img{width: 100%; border-radius: 10px; overflow: hidden;}
#sec6 .m-inner .list li a .img img{width: 100%; aspect-ratio: 1 / 1;}
#sec6 .m-inner .list li a .txt{}
#sec6 .m-inner .list li a .txt h4{font-size: 20px; font-weight: 600; color: #000000; margin-top: 20px;}
#sec6 .m-inner .list li a .txt p{font-size: 17px; font-weight: 500; color: #666666; margin-top: 12px;}
#sec6 .m-inner .gague{margin-top: 70px; background-color: #e5e5e5; position: relative; height: 2px; width: 100%;}
#sec6 .m-inner .gague .bar{position: absolute; left: 0; top: 0; height: 2px; background-color: #03236b; transition: .1s;}

@media all and (max-width:1280px){
	#sec6{padding: 120px 0;}
	#sec6 .m-inner .m_txt{margin-bottom: 35px;}
	#sec6 .m-inner .list li{max-width: 360px; margin-right: 25px;}
	#sec6 .m-inner .list li a .txt h4{font-size: 19px; margin-top: 18px;}
	#sec6 .m-inner .list li a .txt p{font-size: 16px; margin-top: 10px;}
	#sec6 .m-inner .gague{margin-top: 60px;}
}
@media all and (max-width:1024px){
	#sec6{padding: 100px 0;}
	#sec6 .m-inner .list li{max-width: 340px; margin-right: 22px;}
	#sec6 .m-inner .gague{margin-top: 55px;}
}
@media all and (max-width:768px){
	#sec6{padding: 80px 0;}
	#sec6 .m-inner .m_txt{margin-bottom: 30px; text-align: center;}
	#sec6 .m-inner .list li{max-width: 316px; margin-right: 20px;}
	#sec6 .m-inner .list li a .txt h4{font-size: 18px; margin-top: 16px;}
	#sec6 .m-inner .list li a .txt p{font-size: 15px; margin-top: 8px;}
	#sec6 .m-inner .gague{margin-top: 50px;}
}
@media all and (max-width:500px){
	#sec6{padding: 70px 0;}
	#sec6 .m-inner .list li{max-width: 280px; margin-right: 15px;}
}


/* sec7 */
#sec7{display: flex; height: 100vh; min-height: 860px;}
#sec7 .l_cont{padding-left: 140px; width: 50%; height: 100%; display:flex; flex-direction: column; justify-content: center; background: url(/images/main/sec7_bg.webp) no-repeat right 100px bottom 0 / 9vw, linear-gradient(to bottom, #fff, #f6f6f6);}
#sec7 .l_cont .m_txt{}
#sec7 .l_cont .button_box{margin-top: 30px; display: flex;}
#sec7 .l_cont .button_box .btn{line-height: 56px; font-size: 20px; font-weight: 600; width: 180px; text-align: right}
#sec7 .l_cont .button_box .btn.map{color: #fff; background: #e60763; text-align: center;}
#sec7 .l_cont .button_box .btn.naver{color: #fff; background: #00bf18 url(/images/main/navermap.webp) no-repeat left 28px center / 26px; padding-right: 28px;}
#sec7 .l_cont .button_box .btn.kakao{color: #000; background: #ffe500 url(/images/main/kakaomap.webp) no-repeat left 28px center / 26px; padding-right: 45px;}
#sec7 .l_cont .location_box{margin-top: 110px;}
#sec7 .l_cont .location_box h4{font-size: 24px; font-weight: 600; color: #000000;}
#sec7 .l_cont .location_box > p{font-size: 20px; font-weight: 500; color: #444444; margin-top: 25px;}
#sec7 .l_cont .location_box > p b{color: #000;}
#sec7 .l_cont .location_box .subway_box{ margin-top: 60px;}
#sec7 .l_cont .location_box .subway_box > div{display: flex; align-items: center; gap:12px;}
#sec7 .l_cont .location_box .subway_box > div img{}
#sec7 .l_cont .location_box .subway_box > div p{background-color: #e6e6e6; line-height: 40px; color: #222222; font-weight: 500; font-size: 20px; padding: 0 20px; border-radius: 4px;}
#sec7 .l_cont .location_box .subway_box > div:nth-child(2){margin-top: 30px;}
#sec7 .r_cont{width: 50%; height: 100%;}
#sec7 .r_cont .map{height: 100%; width: 100%;}
#sec7 .r_cont .map img{width: 100%; height: 100%; object-fit: cover;}

#mapLayer{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:9999;overflow-y:auto; display: flex; justify-content: center; align-items: center;}
#mapLayer .layer_content{position:relative;width:90%;max-width:800px;margin:0 auto;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 5px 20px rgba(0,0,0,0.3);}
#mapLayer .close_layer{position:absolute;top:10px;right:10px;font-size:24px;background:none;border:none;cursor:pointer;}
#mapLayer .tabs{display:flex;border-bottom:1px solid #ccc; padding-top: 30px; margin-left: 30px; margin-right: 30px;}
#mapLayer .tabs .tab{flex:1;text-align:center;padding:12px 0;cursor:pointer;font-weight:bold;transition:background 0.3s,color 0.3s; font-size: 16px;}
#mapLayer .tabs .tab.active{background:#0b3887;color:#fff;}
#mapLayer .tab_contents{padding:15px;}
#mapLayer .tab_content{display:none;}
#mapLayer .tab_content img{width:100%;height:auto;border-radius:5px;}
#mapLayer .video_wrapper{position:relative;width:100%;padding-bottom:56.25%;height:0;}
#mapLayer .video_wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;}
#mapLayer .tab_content#tab1{display:block;}

@media all and (max-width:1820px){
	#sec7 .l_cont{padding-left: 3%; background-position: right 10% bottom;}
}
@media all and (max-width:1400px){
	#sec7{min-height: 0; height: auto;}
	#sec7 .l_cont{padding: 120px 0; padding-left: 3%;}
	#sec7 .l_cont .button_box .btn{line-height: 52px; font-size: 19px; width: 174px;}
	#sec7 .l_cont .button_box .btn.naver{background-position: left 26px center; background-size: 25px;}
	#sec7 .l_cont .button_box .btn.kakao{background-position: left 26px center; background-size: 25px;}
	#sec7 .l_cont .location_box{margin-top: 80px;}
	#sec7 .l_cont .location_box h4{font-size: 22px;}
	#sec7 .l_cont .location_box > p{font-size: 19px; margin-top: 22px;}
	#sec7 .l_cont .location_box .subway_box{margin-top: 50px;}
	#sec7 .l_cont .location_box .subway_box > div img{max-width: 300px;}
	#sec7 .l_cont .location_box .subway_box > div p{line-height: 38px; font-size: 19px; padding: 0 18px;}
	#sec7 .r_cont{height: inherit;}
}
@media all and (max-width:1024px){
	#sec7 .l_cont{background: linear-gradient(to bottom, #fff, #f6f6f6); padding: 100px 3%;}
	#sec7 .l_cont .button_box{margin-top: 25px;}
	#sec7 .l_cont .button_box .btn{line-height: 48px; font-size: 18px; width: 168px;}
	#sec7 .l_cont .button_box .btn.naver{background-position: left 25px center; background-size: 24px;}
	#sec7 .l_cont .button_box .btn.kakao{background-position: left 25px center; background-size: 24px;}
	#sec7 .l_cont .location_box{margin-top: 70px;}
	#sec7 .l_cont .location_box h4{font-size: 21px;}
	#sec7 .l_cont .location_box > p{font-size: 18px; margin-top: 20px;}
	#sec7 .l_cont .location_box .subway_box{margin-top: 40px;}
	#sec7 .l_cont .location_box .subway_box > div img{max-width: 25vw;}
	#sec7 .l_cont .location_box .subway_box > div p{line-height: 36px; font-size: 18px; padding: 0 16px;}
}
@media all and (max-width:768px){
	#sec7{flex-direction: column-reverse;}
	#sec7 .l_cont{width: 100%; padding: 70px 3%;}
	#sec7 .l_cont .button_box .btn{line-height: 45px; font-size: 17px; width: 154px;}
	#sec7 .l_cont .button_box .btn.naver{background-position: left 20px center; background-size: 22px; padding-right: 25px;}
	#sec7 .l_cont .button_box .btn.kakao{background-position: left 20px center; background-size: 22px; padding-right: 40px;}
	#sec7 .l_cont .location_box{margin-top: 55px;}
	#sec7 .l_cont .location_box h4{font-size: 20px;}
	#sec7 .l_cont .location_box .subway_box{margin-top: 30px;}
	#sec7 .l_cont .location_box .subway_box > div:nth-child(2){margin-top: 20px;}
	#sec7 .l_cont .location_box .subway_box > div img{max-width: 50vw;}
	#sec7 .l_cont .location_box .subway_box > div p{line-height: 34px; font-size: 17px; padding: 0 14px;}
	#sec7 .r_cont{width: 100%; /* height: 80vw; */}
	#mapLayer .layer_content{width:95%;margin:20px auto;}
	#mapLayer .tabs .tab{padding:10px 0;font-size:14px;}
}
@media all and (max-width:500px){
	#sec7 .l_cont{padding: 60px 3%;}
	#sec7 .l_cont .button_box .btn{line-height: 43px; font-size: 16px; width: 118px;}
	#sec7 .l_cont .button_box .btn.naver{background-position: left 11px center; background-size: 16px; padding-right: 13px;}
	#sec7 .l_cont .button_box .btn.kakao{background-position: left 10px center; background-size: 18px; padding-right: 24px;}
	#sec7 .l_cont .location_box h4{font-size: 19px;}
	#sec7 .l_cont .location_box > p{font-size: 17px; margin-top: 17px;}
	#sec7 .r_cont{/* height: 70vw; */}
}


/* sec8 */
#sec8{height: 100vh; min-height: 860px; background: url(/images/main/sec8_bg.webp)no-repeat center center / cover; padding: 140px 0; position: relative; overflow-x: hidden; overflow-y: hidden;}
#sec8 .m-inner{}
#sec8 .m-inner .m_txt{text-align: center;}
#sec8 .m-inner .m_txt h3{color: #fff;}
#sec8 .m-inner .m_txt p{color: #fff;}
#sec8 .m-inner .m_txt .youtube_btn{margin-top: 30px;}
#sec8 .m-inner .m_txt .youtube_btn a{display: inline-block; background: #000000 url(/images/main/youtube.webp) no-repeat left 20px center / 30px; line-height: 54px; border-radius: 10px; color: #fff; font-size: 16px; font-weight: 600; text-align: right; padding-right: 20px; padding-left: 60px;}
#sec8 .m-inner .list{ width: 120%;}
#sec8 .m-inner .list > div{}
#sec8 .m-inner .list > div > div{padding: 65px 0;}
#sec8 .m-inner .list li{max-width: 400px; border-radius: 20px; overflow: hidden; background-color: #fff; margin-right: 30px; box-shadow: 18px 10px 43px rgba(0,0,0,0.16);}
#sec8 .m-inner .list li a{}
#sec8 .m-inner .list li a .img{width: 100%; aspect-ratio:16 / 9; border-radius: 20px; overflow: hidden;}
#sec8 .m-inner .list li a .img img{width: 100%; height: 100%; object-fit: cover;}
#sec8 .m-inner .list li a .txt{padding: 30px;}
#sec8 .m-inner .list li a .txt h4{line-height: 1.3; height: 2.6em; word-break: keep-all; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow: hidden; text-overflow: ellipsis; color: #000; font-weight: 600; font-size: 20px;}
#sec8 .m-inner .list li a .txt p{margin-top: 20px; font-size: 16px; font-weight: 500; color: #444444;}
#sec8 .rolling{display: flex; align-items: center; gap:50px; flex-wrap: nowrap; bottom: 20px; position: absolute; z-index: 2;}
#sec8 .rolling p{font-size: 140px; font-weight: 700; color: #fff; opacity: 0.1; white-space: nowrap; animation: rolling 20s infinite linear;}

@media all and (max-width:1400px){
	#sec8{height: auto; padding: 140px 0; min-height: 0;}
	#sec8 .m-inner .list > div > div{padding: 55px 0 0;}
	#sec8 .m-inner .m_txt .youtube_btn{margin-top: 25px;}
	#sec8 .m-inner .m_txt .youtube_btn a{line-height: 51px; padding-right: 18px; padding-left: 55px; background-position: left 18px center; background-size: 28px;}
	#sec8 .m-inner .list li{max-width: 372px; margin-right: 25px;}
	#sec8 .m-inner .list li a .txt{padding: 25px;}
	#sec8 .m-inner .list li a .txt h4{font-size: 19px;}
	#sec8 .m-inner .list li a .txt p{margin-top: 18px;}
	#sec8 .rolling{bottom: 5%;}
	#sec8 .rolling p{font-size: 128px;}
}
@media all and (max-width:1024px){
	#sec8{padding: 120px 0;}
	#sec8 .m-inner .list > div > div{padding-top: 50px;}
	#sec8 .m-inner .list li{max-width: 332px;}
	#sec8 .rolling p{font-size: 112px;}
}
@media all and (max-width:768px){
	#sec8{padding: 100px 0;}
	#sec8 .m-inner .m_txt .youtube_btn{margin-top: 20px;}
	#sec8 .m-inner .m_txt .youtube_btn a{line-height: 47px; padding-right: 16px; padding-left: 50px; background-position: left 16px center; background-size: 25px;}
	#sec8 .m-inner .list > div > div{padding-top: 45px;}
	#sec8 .m-inner .list li{max-width: 290px; margin-right: 20px;}
	#sec8 .m-inner .list li a .txt{padding: 22px;}
	#sec8 .m-inner .list li a .txt h4{font-size: 18px;}
	#sec8 .m-inner .list li a .txt p{margin-top: 15px; font-size: 15px;}
	#sec8 .rolling p{font-size: 18vw;}
}
@media all and (max-width:500px){
	#sec8{padding: 80px 0;}
	#sec8 .m-inner .m_txt .youtube_btn a{line-height: 44px; padding-right: 14px; padding-left: 45px; background-position: left 14px center; background-size: 23px; font-size: 15px;}
	#sec8 .m-inner .list li{max-width: 270px;}
	#sec8 .m-inner .list li a .txt{padding: 20px;}
}


/* sec9 */
#sec9{padding: 140px 0; background: url(/images/main/sec9_bg.webp) no-repeat bottom center / cover;}
#sec9 .inner{display: flex; align-items: center;}
#sec9 .inner .l_cont{width: 50%; }
#sec9 .inner .l_cont .m_txt{margin-bottom: 50px;}
#sec9 .inner .l_cont form{max-width: 540px;}
#sec9 .inner .l_cont form .input_box{}
#sec9 .inner .l_cont form .input_box .input{display: flex; align-items: center;}
#sec9 .inner .l_cont form .input_box .input + .input{margin-top: 25px;}
#sec9 .inner .l_cont form .input_box .input label{font-size: 20px; font-weight: 500; color:#000000; margin-right: 20px; width: 70px; display: block;}
#sec9 .inner .l_cont form .input_box .input input{line-height: 54px; border: 1px solid #cfcfcf; border-radius: 10px; padding: 0 3%; width: calc(100% - 70px); max-width: 100%;}
#sec9 .inner .l_cont form .btn{}
#sec9 .inner .l_cont form .btn button{line-height: 64px; background-color: var(--color1); color: #fff; border-radius: 10px; font-size: 20px; text-align: center; padding: 0 50px; font-family: 'Pretendard', sans-serif; font-weight: 700; margin-top: 50px; width: 100%;}
#sec9 .inner .l_cont form .agree{display: flex; margin-top: 35px; align-items: center; justify-content: center;}
#sec9 .inner .l_cont form .agree input{margin-right: 5px;}
#sec9 .inner .l_cont form .agree label{font-size: 16px; font-weight: 500; color: #222222;}
#sec9 .inner .l_cont form .agree label a{font-weight: 700; color: #222; text-underline-position: under; text-decoration: underline;}
#sec9 .inner .r_cont{width: 34vw; margin: 0 auto;}
#sec9 .inner .r_cont .btn_list{display: flex; flex-wrap: wrap; gap:20px;}
#sec9 .inner .r_cont .btn_list li{display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: 20px; overflow: hidden; width: calc(100% / 2 - 20px * 1 / 2); height: 264px; flex:auto; cursor: pointer;}
#sec9 .inner .r_cont .btn_list li:last-child{}
#sec9 .inner .r_cont .btn_list li .icon{margin-bottom: 17px;}
#sec9 .inner .r_cont .btn_list li .icon img{max-width: 100%;}
#sec9 .inner .r_cont .btn_list li p{font-size: 22px; font-weight: 600; color: #fff;}
#sec9 .inner .r_cont .btn_list li h4{font-size: 16px; font-weight: 500; margin-bottom: 0px; margin-top: -17px;}

@media all and (max-width:1400px){
	#sec9{padding: 120px 0;}
	#sec9 .inner .l_cont form .input_box .input label{font-size: 18px;}
	#sec9 .inner .l_cont form .input_box .input input{line-height: 50px;}
	#sec9 .inner .r_cont{width: 50%;}
	#sec9 .inner .r_cont .btn_list li{height: 248px;}
	#sec9 .inner .r_cont .btn_list li .icon{margin-bottom: 14px;}
	#sec9 .inner .r_cont .btn_list li .icon img{max-width: 106px;}
	#sec9 .inner .r_cont .btn_list li p{font-size: 20px;}
	#sec9 .inner .r_cont .btn_list li h4{margin-top: -14px;}
}
@media all and (max-width:1280px){
	#sec9{padding: 110px 0;}
	#sec9 .inner{gap:60px;}
	#sec9 .inner .l_cont .m_txt{margin-bottom: 40px;}
	#sec9 .inner .l_cont form .input_box .input + .input{margin-top: 22px;}
	#sec9 .inner .l_cont form .input_box .input label{font-size: 17px;}
	#sec9 .inner .l_cont form .input_box .input input{line-height: 47px;}
	#sec9 .inner .l_cont form .btn button{line-height: 56px; font-size: 18px; padding: 0 40px; margin-top: 40px;}
	#sec9 .inner .l_cont form .agree{margin-top: 32px;}
	#sec9 .inner .l_cont form .agree input{margin-right: 5px;}
	#sec9 .inner .l_cont form .agree label{font-size: 15px;}
	#sec9 .inner .r_cont .btn_list li{height: 224px;}
	#sec9 .inner .r_cont .btn_list li .icon img{max-width: 98px;}
}
@media all and (max-width:1024px){
	#sec9{padding: 100px 0;}
	#sec9 .inner{gap:50px;}
	#sec9 .inner .l_cont form .input_box .input + .input{margin-top: 20px;}
	#sec9 .inner .l_cont form .agree{margin-top: 30px;}
	#sec9 .inner .r_cont .btn_list li .icon img{max-width: 92px;}
	#sec9 .inner .r_cont .btn_list{gap:15px;}
	#sec9 .inner .r_cont .btn_list li{width:calc(100% / 2 - 15px * 1 / 2);}
	#sec9 .inner .r_cont .btn_list li p{font-size: 19px;}
}
@media all and (max-width:768px){
	#sec9{padding: 90px 0;}
	#sec9 .inner{flex-direction: column;}
	#sec9 .inner .l_cont{width: 100%;}
	#sec9 .inner .l_cont .m_txt{margin-bottom: 35px;}
	#sec9 .inner .l_cont form{max-width: 100%;}
	#sec9 .inner .l_cont form .input_box .input + .input{margin-top: 18px;}
	#sec9 .inner .l_cont form .input_box .input label{font-size: 16px;}
	#sec9 .inner .l_cont form .input_box .input input{line-height: 44px;}
	#sec9 .inner .l_cont form .btn button{line-height: 53px; font-size: 17px; margin-top: 35px;}
	#sec9 .inner .r_cont{width: 100%;}
	#sec9 .inner .r_cont .btn_list li{height: auto; padding: 40px 0;}
	#sec9 .inner .r_cont .btn_list li .icon img{width: 82px;}
	#sec9 .inner .r_cont .btn_list li p{font-size: 18px;}
	#sec9 .inner .r_cont .btn_list li h4{margin-top: -12px;}
}
@media all and (max-width:500px){
	#sec9{padding: 80px 0;}
	#sec9 .inner .r_cont .btn_list li .icon img{max-width: 68px;}
	#sec9 .inner .r_cont .btn_list li p{font-size: 17px;}
}