.color_txt {color:#FF5635}
.color_box { background: #FF5635;color:#fff}
.line-br {display:block}
* {font-family: 'Pretendard Variable' !important}
.nt-container-wide {max-width:100%;}
.new_web_page {width:100%}
.new_web_page > section {width:100%}
/**** 첫번째 섹션 ****/
.web_service_sec{position:relative;height:100vh;min-height:720px;overflow:hidden;background:#fffbf7 url(../../../img/web_sec1_bg.png) no-repeat center 100px/contain;}
.floating_canvas{position:relative;width:100%;height:100%;overflow:hidden;}
.center_txt{position:absolute;left:50%;top:20%;transform:translateX(-50%);text-align:center;z-index:100;pointer-events:none;width:max-content;}
.center_txt p{color:#ff4b22;font-size:70px;font-weight:700;}
.center_txt h2{color:#222;font-size:70px;font-weight:500;}
.float_item{position:absolute;left:0;top:0;display:inline-flex;align-items:center;justify-content:center;cursor:grab;user-select:none;z-index:10;will-change:transform;}
.float_item:active{cursor:grabbing;}
.float_item img{display:block;width:auto;height:auto;max-width:min(22vw,320px);max-height:min(18vh,220px);object-fit:contain;pointer-events:none;}
.float_item .txt_img{max-width:min(28vw,430px);max-height:min(16vh,160px);transform:none;}
@media (max-width:1399px){
    .float_item img{max-width:min(20vw,280px);max-height:min(17vh,190px);}
    .float_item .txt_img{max-width:min(26vw,360px);max-height:min(15vh,140px);}
}

@media (max-width:1199px){
    .web_service_sec{min-height:680px;}
    .center_txt p{font-size:2.5em;}
    .center_txt h2{font-size:2.5em;}
    .float_item img{max-width:min(22vw,230px);max-height:min(16vh,160px);}
    .float_item .txt_img{max-width:min(30vw,300px);max-height:min(14vh,120px);}
}

@media (max-width:768px){
    .float_item{pointer-events:none;}
    .web_service_sec{min-height:640px;background-position:center 90px;background-size:140% auto;}
    .center_txt{top:16%;width:calc(100% - 40px);}
    .center_txt p{font-size:1.55em;}
    .center_txt h2{font-size:1.55em;line-height:1.35;}
    .float_item img{max-width:min(30vw,150px);max-height:min(13vh,110px);}
    .float_item .txt_img{max-width:min(42vw,220px);max-height:min(11vh,86px);}
}

@media (max-width:500px){
    .web_service_sec{min-height:600px;}
    .center_txt{top:15%;}
    .center_txt p{font-size:1.25em;}
    .center_txt h2{font-size:1.25em;}
    .float_item img{max-width:min(34vw,120px);max-height:min(12vh,90px);}
    .float_item .txt_img{max-width:min(48vw,180px);max-height:min(10vh,70px);}
}


/**** 두번째 섹션 ****/
.main_sec2 {background:url('../../../img/newport_sec2_bg.png') center center / cover no-repeat; padding:190px 0}
.sec2_title {display: flex;flex-direction: column;gap:20px; align-items: center;}
.sec2_title h2{text-align: center;font-size: 80px;font-weight: 800;}
.sec2_title > span{font-size: 30px;margin-bottom:120px;font-weight: 600;}

.sec2_content_wrap {width:92%; max-width:1400px; margin:0 auto; display: flex;gap:90px;justify-content: space-between;}
.sec2_content_wrap .row{width:calc(100% / 3 - 60px); display: flex;flex-direction: column;align-items: center;}
.sec2_content_wrap .row > span{font-size: 24px; font-weight: 600;margin-bottom:20px;;}
.sec2_content_wrap .row .row_top_box{width:100%}
.sec2_content_wrap .row .row_top_box h3{text-align: center;font-size: 33px; padding:30px 0;border-radius: 10px;}
.sec2_content_wrap .row .row_top_box .top_txt_wrap {margin:20px 0 70px; background: #fff; border-radius: 10px;display: flex;flex-direction: column;align-items: center;text-align: center;padding:25px 10px}
.sec2_content_wrap .row .row_top_box .top_txt_wrap > span{font-size: 26px;font-weight: 700;margin-bottom:20px}
.sec2_content_wrap .row .row_top_box .top_txt_wrap p {color:#363636;font-size: 20px;line-height:1.5;}
.sec2_content_wrap .row .row_top_box .top_txt_wrap p > span{}
.sec2_content_wrap .row .row_bottom_box{background: #fff; border-top:2px solid #FF5635;border-bottom:2px solid #FF5635; font-size: 26px;text-align: center;padding:20px 25px;width:100%; color:#363636; font-weight: 600;}
.sec2_content_wrap .row .row_bottom_box span{}

@media (max-width:1399px) {
    .sec2_title h2 {font-size: 60px;}
    .sec2_content_wrap {gap:30px}
    .sec2_content_wrap .row{width:calc(100% / 3 - 20px)}
    .sec2_content_wrap .row .row_top_box h3 {font-size: 30px;padding:20px 0;}
    .sec2_content_wrap .row .row_top_box .top_txt_wrap > span {font-size: 23px;}
    .sec2_content_wrap .row .row_bottom_box {font-size: 23px;}
    .sec2_content_wrap .row .row_top_box .top_txt_wrap {margin-bottom :50px}
}
@media (max-width:1199px) {
    .sec2_title h2 {font-size: 50px;}
    .sec2_content_wrap {gap:15px}
    .sec2_content_wrap .row{width:calc(100% / 3 - 10px)}
    .sec2_content_wrap .row .row_top_box h3 {font-size: 28px;}
    .sec2_content_wrap .row .row_top_box .top_txt_wrap > span {font-size: 20px;}
    .sec2_content_wrap .row .row_top_box .top_txt_wrap p{font-size: 18px;}
    .sec2_content_wrap .row .row_bottom_box {font-size: 20px;}
    .sec2_title > span {margin-bottom:60px;}
}

@media (max-width:1024px) {
    .sec2_content_wrap {gap:50px; flex-direction: column;align-items: center;    justify-content: flex-start;}
    .sec2_content_wrap .row  {width: 100%}
    .sec2_content_wrap .row .row_top_box .top_txt_wrap {margin-bottom:30px}

}
@media (max-width:768px) {
    .main_sec2 {padding:120px 0 80px}
    .sec2_title h2 {font-size: 1.8em;;}
    .sec2_title > span {font-size: .8em;;}
    .sec2_content_wrap .row > span {font-size: .8em;}
    .sec2_content_wrap .row .row_top_box h3 {font-size: 1.3em;padding:15px 0;}
    .sec2_content_wrap .row .row_top_box .top_txt_wrap > span {font-size: 1.1em;;}
    .sec2_content_wrap .row .row_top_box .top_txt_wrap p ,
    .sec2_content_wrap .row .row_bottom_box {font-size: 1em;}
}



/* ===========================
세번째 섹션
=========================== */


.stats_bg {position: absolute;inset: -5%;background: url('../../../img/newport_sec3_bg.jpg') center center / cover no-repeat;animation: bgFloat 14s ease-in-out infinite alternate;height:100%}
.stats_bg::before {content: '';position: absolute;inset: -20%;background:radial-gradient(circle at 20% 30%, rgba(255,255,255,.10), transparent 22%),radial-gradient(circle at 80% 60%, rgba(255,255,255,.06), transparent 28%),radial-gradient(circle at 55% 20%, rgba(255,255,255,.08), transparent 25%);filter: blur(120px);mix-blend-mode: screen;animation: lightMove 10s ease-in-out infinite alternate;}
.stats_bg::after {content: '';position: absolute;inset: -40%;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.03) 44%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.03) 56%,transparent 65%);filter: blur(80px);mix-blend-mode: screen;animation: shineMove 8s linear infinite;}
.stats_inner {position: relative;z-index: 10;width: 92%;max-width: 1400px;text-align: center;}
.stats_list {display: flex;justify-content: center;gap: 90px;list-style: none;margin: 0 0 120px;padding: 0;}
.stats_list li {width:30%}
.stats_list strong {display: block;margin-bottom: 10px;font-size: 36px;line-height: 1;font-weight: 500;color: #fff;word-break: keep-all;}
.stats_list strong  span {font-size:60px;}
.stats_list p {margin: 0 0 6px;color: #fff;font-size: 36px;word-break: keep-all;}
.stats_list em {display: block;font-style: normal;color: #fff;font-size: 20px;;}
.main_sec3 {position:relative;height:100vh;background:#000;overflow:visible;}
.stats_wave_sec {position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#000;}
.stats_text p {font-size:20px;line-height:1.8;color:#fff}
@keyframes bgFloat{

    0%{
        transform:scale(1.2) translate(0,0);
    }

    50%{
        transform:scale(1.24) translate(-12px,-8px);
    }

    100%{
        transform:scale(1.22) translate(15px,10px);
    }

}

@keyframes lightMove {
    0% {
    transform: translate(-60px,-20px) scale(1);
    }
    50% {
    transform: translate(20px,30px) scale(1.12);
    }
    100% {
    transform: translate(60px,-10px) scale(1);
    }
}

@keyframes shineMove {
    from {
    transform: translateX(-35%);
    }
    to {
    transform: translateX(35%);
    }
}






/*** 네번째 섹션 ***/
.main_sec4{position:relative;padding:90px 0;background:#fffbf7;color:#222;overflow:hidden;}

.sec4_title_wrap{position:relative;z-index:2;width:calc(100% - 90px);margin:0 auto}
.sec4_title_wrap h2{font-size:80px;font-weight: 700;}
.sec4_title_wrap h2 .line-br{display:block;}

.sec4_title_wrap h2 .line-br:nth-child(3) {margin-top:30px;}


.fill_title{display:flex;flex-direction:column;}
.fill_txt{position:relative;display:inline-block;width:fit-content;color:#212121;overflow:hidden;--fill:100%;}
.fill_txt::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;color:#ff5138;white-space:nowrap;clip-path:inset(0 var(--fill) 0 0);will-change:clip-path;pointer-events:none;}

.sec4_content_wrap{position:relative;z-index:2;width:calc(100% - 90px);margin:0 auto;margin-top:115px}
.sec4_content_wrap .top,
.sec4_content_wrap .bottom{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-bottom:20px;}
.sec4_content_wrap .bottom{margin-bottom:0;}

.sec4_content_wrap .box{position:relative;min-height:155px;border-radius:10px;}
.sec4_content_wrap .border_box{display: flex;flex-direction: column;justify-content: space-between;padding: 40px;border: 2px solid #212121;background: #fff;gap: 90px;}
.sec4_content_wrap .border_box > span{font-size: 26px;color: #B8B8B8;}
.sec4_content_wrap .border_box h3{margin-bottom: 12px;font-size: 30px;line-height: 1.3;font-weight: 800;}
.sec4_content_wrap .border_box p{font-size: 23px;line-height: 1.5;font-weight: 500;}
.sec4_content_wrap .txt_box{display:flex;align-items:center;border:0;display: flex;align-items: center;}
.sec4_content_wrap .txt_box p{position: relative;font-size: 20px;line-height: 1.5;font-weight: 600;color: #ff5138;min-width: 220px;padding-left:30px}
.sec4_content_wrap .txt_box .line_bar {width: calc(100% - 220px);position: relative;left: 20px;height: 1px;background: #212121;}
.sec4_content_wrap .bottom .txt_box{align-items:flex-end;    padding: 0 0 25px ;}

.sec4_content_wrap .border_box:nth-child(3)::before{content:"";position:absolute;right:24px;top:22px;width:45%;aspect-ratio: 263 / 137;;background:url("/img/web_sec4_img01.png") center/contain no-repeat;}
.sec4_content_wrap .bottom .border_box:nth-child(1)::before{content:"";position:absolute;right:32px;top:20px;width:45%;aspect-ratio: 263 / 137;;background:url("/img/web_sec4_img02.png") center/contain no-repeat;}

@media (max-width:1399px){
    .main_sec4{padding:80px 0;}
    .sec4_title_wrap{width:calc(100% - 70px);}
    .sec4_title_wrap h2{font-size:68px;}
    .sec4_content_wrap{width:calc(100% - 70px);margin-top:90px;}
    .sec4_content_wrap .border_box{padding:34px;gap:70px;}
    .sec4_content_wrap .border_box > span{font-size:22px;}
    .sec4_content_wrap .border_box h3{font-size:26px;}
    .sec4_content_wrap .border_box p{font-size:20px;}
}

@media (max-width:1199px){
    .sec4_title_wrap h2{font-size:58px;}
    .sec4_content_wrap{margin-top:75px;}
    .sec4_content_wrap .top,
    .sec4_content_wrap .bottom{gap:16px;margin-bottom:16px;}
    .sec4_content_wrap .border_box{padding:28px;gap:55px;}
    .sec4_content_wrap .border_box h3{font-size:23px;}
    .sec4_content_wrap .border_box p{font-size:18px;}
    .sec4_content_wrap .txt_box p{font-size:18px;min-width:200px;padding-left:20px;}
    .sec4_content_wrap .txt_box .line_bar{width:calc(100% - 200px);}
}

@media (max-width:1024px){
    .main_sec4{padding:70px 0;}
    .sec4_title_wrap,
    .sec4_content_wrap{width:calc(100% - 50px);}
    .sec4_title_wrap h2{font-size:50px;}
    .sec4_title_wrap h2 .line-br:nth-child(3){margin-top:22px;}
    .sec4_content_wrap{margin-top:60px;}
    .sec4_content_wrap .top,
    .sec4_content_wrap .bottom{grid-template-columns:1fr 1fr;}
    .sec4_content_wrap .top .txt_box{grid-column:1/3;min-height:auto;overflow: hidden;}
    .sec4_content_wrap .bottom .txt_box{grid-column:1/3;min-height:auto;padding:20px 0 0;}
    .sec4_content_wrap .border_box{min-height:230px;}
}

@media (max-width:768px){
    .main_sec4{padding:60px 0;}
    .sec4_title_wrap,
    .sec4_content_wrap{width:calc(100% - 36px);}
    .sec4_title_wrap h2{font-size:40px;}
    .sec4_content_wrap{margin-top:45px;}
    .sec4_content_wrap .top,
    .sec4_content_wrap .bottom{display:flex;flex-direction:column;gap:14px;margin-bottom:14px;}
    .sec4_content_wrap .box{min-height:auto;}
    .sec4_content_wrap .border_box{min-height:210px;padding:24px;gap:42px;}
    .sec4_content_wrap .border_box > span{font-size:18px;}
    .sec4_content_wrap .border_box h3{font-size:21px;}
    .sec4_content_wrap .border_box p{font-size:16px;}
    .sec4_content_wrap .txt_box p{font-size:16px;min-width:auto;padding-left:0;}
    .sec4_content_wrap .txt_box .line_bar{display:none;}
}

@media (max-width:640px){
    .sec4_title_wrap h2{font-size:34px;}
    .sec4_title_wrap h2 .line-br:nth-child(3){margin-top:16px;}
    .sec4_content_wrap .border_box{min-height:190px;padding:22px;gap:34px;}
    .sec4_content_wrap .border_box h3{font-size:20px;}
    .sec4_content_wrap .border_box p{font-size:15px;}
}

@media (max-width:500px){
    .main_sec4{padding:50px 0;}
    .sec4_title_wrap,
    .sec4_content_wrap{width:calc(100% - 28px);}
    .sec4_title_wrap h2{font-size:30px;}
    .sec4_content_wrap{margin-top:36px;}
    .sec4_content_wrap .border_box{min-height:170px;padding:20px;gap:28px;border-width:1px;}
    .sec4_content_wrap .border_box h3{font-size:18px;}
    .sec4_content_wrap .border_box p{font-size:14px;}
}



/*** 다섯번째 섹션 ***/
.main_sec5{position:relative;background:#fffbf7;color:#212121;overflow:hidden;}
.main_sec5 .sec5_title{padding:120px 0;text-align:center;}
.main_sec5 .sec5_title h2{font-size:80px;line-height:1.3;font-weight:700;}
.main_sec5 .sec5_title p{margin-top:50px;font-size:30px;font-weight:600;}

.sec5_content_wrap{width:100%;border-top:1px solid rgba(0,0,0,.35);}
.content_list{position:relative;display:flex;align-items:center;min-height:105px;border-bottom:1px solid rgba(0,0,0,.35);background:#f8f4ef;transition:background .35s ease,color .35s ease;overflow: hidden;}
.content_list .tit{position:relative;z-index:2;width:min(92%,1400px);margin:0 auto;padding:30px 0}
.content_list .tit span{display:block;margin-bottom:10px;font-size:26px;}
.content_list .tit h3{font-size:50px;line-height:1;font-weight:600;}
.content_list .img_wrap{position: absolute;right: 13.5vw;top: 50%;z-index: 3;width: auto;aspect-ratio: 434 / 168;height: 100%;display: flex;align-items: center;justify-content: center;opacity: 0;transform: translateY(-50%) translateX(30px);transition: opacity .35s ease, transform .35s ease;height:100%;}
.content_list .img_wrap img {height:100%}
.content_list:hover,
.content_list.active{background:#ff5138;color:#fff;}

.content_list:hover .img_wrap,
.content_list.active .img_wrap{opacity:1;transform:translateY(-50%) translateX(0);}

@media (max-width:1399px){
    .main_sec5 .sec5_title{padding:100px 0;}
    .main_sec5 .sec5_title h2{font-size:68px;}
    .main_sec5 .sec5_title p{margin-top:40px;font-size:26px;}
    .content_list .tit span{font-size:23px;}
    .content_list .tit h3{font-size:44px;}
    .content_list .img_wrap{right:7vw;}
}

@media (max-width:1199px){
    .main_sec5 .sec5_title{padding:90px 0;}
    .main_sec5 .sec5_title h2{font-size:58px;}
    .main_sec5 .sec5_title p{margin-top:34px;font-size:23px;}
    .content_list .tit{width:calc(100% - 70px);}
    .content_list .tit span{font-size:20px;}
    .content_list .tit h3{font-size:38px;}
    .content_list .img_wrap{right:35px;}
}

@media (max-width:1024px){
    .main_sec5 .sec5_title{padding:80px 25px;}
    .main_sec5 .sec5_title h2{font-size:50px;}
    .main_sec5 .sec5_title p{margin-top:28px;font-size:20px;}


    .content_list{display:block;min-height:auto;overflow:hidden;cursor:pointer;}
    .content_list .tit{width:calc(100% - 50px);padding:26px 0;}
    .content_list .img_wrap{position:relative !important;top:auto !important;right:auto !important;left:auto !important;z-index:1;width:100% !important;max-width:none !important;height:0;aspect-ratio:auto !important;opacity:1 !important;overflow:hidden;display:block !important;transform:none !important;transition:height .65s cubic-bezier(.22,1,.36,1);}
    .content_list .img_inner{display:flex;align-items:center;justify-content:center;padding:0 25px 34px;opacity:0;transform:translateY(28px) scale(.96);transition:opacity .45s ease,transform .65s cubic-bezier(.22,1,.36,1);}
    .content_list .img_wrap img{display:block;width:100%;height:auto !important;padding:0;object-fit:contain;}
    .content_list:hover{background:#f8f4ef;color:#212121;}
    .content_list:hover .img_wrap{opacity:1 !important;transform:none !important;}
    .content_list.active{background:#ff5138;color:#fff;}
    .content_list.active .img_inner{opacity:1;transform:translateY(0) scale(1);}
}

@media (max-width:768px){
    .main_sec5 .sec5_title{padding:70px 18px;}
    .main_sec5 .sec5_title h2{font-size:40px;line-height:1.2;}
    .main_sec5 .sec5_title p{margin-top:22px;font-size:17px;}
    .content_list .tit h3 {font-size: 35px;;}
    .content_list .tit span {font-size: 18px;}

}

@media (max-width:640px){
    .main_sec5 .sec5_title{padding:60px 16px;}
    .main_sec5 .sec5_title h2{font-size:34px;}
    .main_sec5 .sec5_title p{font-size:15px;}
    .content_list .tit h3 {font-size: 30px;;}
    .content_list .img_inner {padding  : 0 34px}

}

@media (max-width:500px){
    .main_sec5 .sec5_title{padding:50px 14px;}
    .main_sec5 .sec5_title h2{font-size:30px;}
    .main_sec5 .sec5_title p{margin-top:16px;font-size:14px;}
    .content_list .tit h3 {font-size: 28px;;}
    .content_list .tit span {font-size: 16px;}

}







/*** 여섯번째 섹션 ***/
.main_sec6 {position:relative;background:#fffbf7;}
.designer_match_sec {position:relative;height:360vh;background:#fffbf7;}
.designer_match_pin {position:sticky;top:0;height:100vh;overflow:hidden;background:#fffbf7;color:#222;}

.dm_bg_wrap {position:absolute;inset:0;}

.dm_bracket {position:absolute;left:50%;top:50%;z-index:20;transform:translate(-50%,-50%);pointer-events:none;}
.dm_bracket img {display:block;width:auto;height:270px;}

.dm_center_prigin_wrap {position:absolute;left:50%;top:50%;z-index:5;width:520px;aspect-ratio: 1/1;transform:translate(-50%,-50%);pointer-events:none;}
.dm_center_prigin_wrap img {position:absolute;left:50%;top:50%;width:100%;height:100%;object-fit:contain;opacity:0;transform:translate(-50%,-50%) scale(.92);}

.dm_center_wrap {position:absolute;inset:0;z-index:10;pointer-events:none;}
.dm_center {position:absolute;left:50%;top:50%;width:600px;max-width:90vw;text-align:center;opacity:0;}

.dm_num {font-size:30px;margin-bottom:30px;color:#222;font-weight:600;}
.dm_shuffle {font-size:96px;font-weight:600;line-height:1.2;margin:0;color:#222;letter-spacing:-0.05em;}
.dm_line {display:block;overflow:hidden;}
.text_wrap {margin-top:50px;}
.text_wrap em {display:inline-flex;align-items:center;justify-content:center;padding:0 15px;border-radius:999px;background:#ff694f;color:#fff;font-size:20px;font-style:normal;margin-bottom:30px;font-weight:400;}
.text_wrap p {font-size:23px;line-height:1.65;margin:0;color:#222;font-weight:500;}

.dm_side {position:absolute;top:50%;z-index:50;pointer-events:none;overflow:hidden;opacity:1;visibility:visible;}
.dm_side span {display:block;font-size:clamp(46px,4vw,72px);font-weight:700;line-height:1;color:#222;opacity:0;transform:translateY(100px);}
.dm_left {left:8vw;transform:translateY(-50%);}
.dm_right {right:8vw;transform:translateY(-50%);}







/*** 일곱번째 섹션 ***/
.main_sec7 {position: relative;min-height: 100vh;padding: 175px 0;background: linear-gradient( #46474C 0%, #1d1e20 42%, #090807 100%);color: #fff;overflow: hidden; }
.direction_caption { margin:0 0 16px; font-size:22px;color:#fff;text-align: center;}
.main_sec7 h2 {font-size: 60px; line-height: 1.5; font-weight: 500;text-align: center;margin-bottom: 90px;}
.main_sec7 h2 strong { color:#ff4b2f; font-weight:700; }
.circle_box h3{font-size: 30px;font-weight: 700;margin-bottom: 20px;}
.circle_box p{font-size: 23px;}

.sec7_content_wrap  {position:relative}
.circle_box_wrap{display: flex;justify-content: center;align-items: center;max-width: max-content;margin: 0 auto;position: relative;width: 92%;}
.circle_box_wrap:before {content:''; position:absolute;left:-50%; width:50%; height:1px ; background:#fff; }
.circle_box_wrap:after {content:''; position:absolute;right:-50%; width:50%; height:1px ; background:#fff; }
.circle_box{position:relative;flex:0 0 390px;width:390px;aspect-ratio:1/1;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background: url('../../../img/web_sec7_img01.png')no-repeat center center /cover;}

.circle_box + .circle_box{margin-left:-20px;}

.circle_box:nth-child(1){z-index:1;}
.circle_box:nth-child(2){z-index:2;}
.circle_box:nth-child(3){z-index:1;}

.circle_box.color_circle{background: url('../../../img/web_sec7_img02.png')no-repeat center center /cover;;}


@media (max-width:1399px){
    .main_sec7{padding:145px 0;}
    .main_sec7 h2{font-size:52px;margin-bottom:75px;}
    .direction_caption{font-size:20px;}
    .circle_box{flex:0 0 340px;width:340px;}
    .circle_box h3{font-size:26px;}
    .circle_box p{font-size:20px;}
}

@media (max-width:1199px){
    .main_sec7{padding:120px 0;}
    .main_sec7 h2{font-size:46px;margin-bottom:65px;}
    .circle_box{flex:0 0 300px;width:300px;}
    .circle_box + .circle_box{margin-left:-18px;}
    .circle_box h3{font-size:23px;margin-bottom:16px;}
    .circle_box p{font-size:18px;}
}

@media (max-width:1024px){
    .main_sec7{min-height:auto;padding:100px 0;}
    .main_sec7 h2{font-size:40px;margin-bottom:55px;}
    .circle_box_wrap{width:calc(100% - 50px);}
    .circle_box{flex:0 0 270px;width:270px;}
    .circle_box + .circle_box{margin-left:-16px;}
    .circle_box h3{font-size:21px;}
    .circle_box p{font-size:16px;line-height:1.6;}
}

@media (max-width:768px){
    .main_sec7{padding:80px 0;}
    .direction_caption{font-size:17px;}
    .main_sec7 h2{font-size:32px;line-height:1.45;margin-bottom:45px;}
    .circle_box_wrap{flex-direction:column;width:calc(100% - 36px);}
    .circle_box_wrap:before,
    .circle_box_wrap:after{display:none;}
    .circle_box{flex:0 0 auto;width:330px;max-width:100%;}
    .circle_box + .circle_box{margin-left:0;margin-top:-28px;}
    .circle_box:nth-child(1){z-index:1;}
    .circle_box:nth-child(2){z-index:3;}
    .circle_box:nth-child(3){z-index:1;}
}

@media (max-width:640px){
    .main_sec7{padding:70px 0;}
    .main_sec7 h2{font-size:28px;margin-bottom:38px;}
    .circle_box{width:300px;}
    .circle_box h3{font-size:20px;margin-bottom:14px;}
    .circle_box p{font-size:15px;}
}

@media (max-width:500px){
    .main_sec7{padding:60px 0;}
    .direction_caption{font-size:15px;margin-bottom:12px;}
    .main_sec7 h2{font-size:24px;margin-bottom:34px;}
    .circle_box{width:270px;}
    .circle_box + .circle_box{margin-top:-24px;}
    .circle_box h3{font-size:18px;}
    .circle_box p{font-size:14px;}
}






/*** 여덟번째 섹션 ***/
.main_sec8 { position:relative; background:#fffbf7; overflow:hidden; }
.w_intro_sec { position:relative; height:100vh; background:#fffbf7; overflow:hidden; }
.w_pin { position:relative; width:100%; height:100vh; overflow:hidden; background:#fffbf7; }
.w_full_bg { position:absolute; inset:0; background-position:center center; background-size:cover; background-repeat:no-repeat; opacity:1; z-index:1;}
.w_hole_svg { position:absolute; inset:0; width:100%; height:100%; z-index:3; pointer-events:none; }
.w_hole_group { transform-box:view-box; transform-origin:50% 50%; will-change:transform; }
.w_center_txt { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:5; color:#fff; text-align:center; opacity:0; pointer-events:none;width:max-content }
.w_center_txt p { margin:0; font-size:60px; font-weight:500; }




@media (max-width:1800px) {
    .dm_left{left:3vw}
    .dm_right {right:3vw}

}


@media (max-width:1500px) {
    .dm_center_prigin_wrap {width:420px}
    .dm_shuffle {font-size:80px}
    .dm_center {width:500px;}

}

@media(max-width:1480px) {
}

@media (max-width:1399px) {
    .dm_side span {font-size: 50px;}
}

@media (max-width:1199px) {
    .stats_list {gap:30px}
   .stats_list p {font-size: 32px;}
    .dm_side span {font-size: 40px;}
    .webwise_title {padding:150px 0 0 }

}

@media (max-width:1024px) {
    .center_txt p ,
    .center_txt h2 {font-size: 2.5em;}
   
    
    .dm_side{position:absolute;left:50%;width:100%;transform:translateX(-50%);display:flex;justify-content:center;pointer-events:none;}
    .dm_side.left{top:80px;}
    .dm_side.right{bottom:80px;}
    .dm_side.left span,
    .dm_side.right span{position:static !important;transform:none !important;}
    .dm_side{position:absolute;left:50%;right:auto;width:auto;z-index:50;overflow:hidden;transform:translateX(-50%);pointer-events:none;}
    .dm_left{top:100px;}
    .dm_right{top:auto;bottom:70px;}
    .dm_side span{display:block;text-align:center;font-size:clamp(36px,7vw,64px);line-height:1;white-space:nowrap;}
    
    .w_center_txt p {font-size: 40px;}
    .ww_slide_info{top: 80%;width: calc(100% - 48px);max-width: none;padding-bottom: 14px;display: flex;align-items: flex-start;gap: 30px;flex-direction: column;justify-content: flex-start;;}
    .ww_info_more {width:60px}
    .ww_info_more img {width:100%}
    .circle_box{flex:0 0 300px;width:300px;}

.main_sec3 {height:auto;}
.stats_wave_sec {padding:100px 0; height:100%;}
    .stats_list{flex-direction: column;gap:80px;align-items: center; margin-bottom:50px}
.stats_list li {width:100%}
}

@media (max-width:768px) {
.center_txt p ,
.center_txt h2 {font-size: 1.8em;}


.main_sec3 {height:auto}
.stats_wave_sec {height: auto; padding:160px 0;}
.stats_list {gap:50px}
.stats_list strong {font-size:30px; ;}
.stats_list strong span {font-size: 60px;}
.stats_list p {font-size: 25px;}
.stats_list em {font-size: 20px;}
.stats_text p{font-size: 20px;        word-break: keep-all;}
.stats_text {width:80%;margin:0 auto}


.w_center_txt p {font-size: 30px;} 
.dm_num {font-size:22px;}
.dm_shuffle {font-size: 60px;;}
.text_wrap {margin-top:30px;}
.text_wrap em {font-size: 18px;margin-bottom:20px;}
.text_wrap p {font-size: 20px;}
    .sec7_content_wrap{flex-direction:column;gap:30px;}
    .circle_box{width:280px;flex-basis:280px;}
    .circle_box + .circle_box{margin-left:0;}
}

@media (max-width:640px) {
}

@media (max-width:500px) {
    .center_txt p ,
    .center_txt h2 {font-size: 1.5em;}
    .stats_text p{font-size: 16px;}
    .dm_bracket,
    .dm_side {display:none}
    .ww_info_left p {font-size: 16px;}

}