@charset "utf-8";

:root {
    --white:#FFFFFF;
    --black:#111111;
    --primary: #0049FF;
    --header-height: 100px;
    --sec-padding: 160px;

    --slide-dur: 1.2s;  /* 좌/우 텍스트가 중앙으로 들어오는 시간 */
    --hold-dur:  .1s;  /* 만나는 순간 잠깐 멈춤 */
    --swap-dur:  .45s;  /* 텍스트→로고 전환 시간 */
}

/* 공통 */
.container {overflow-x:hidden;}
.wrapper {width:100%;max-width:1470px;padding:0 20px;margin:0 auto}
.no_scroll {height:100%;overflow:hidden}
.only_mb {display:none}
.under340 {display:none}
.btn_wrap {display:flex;align-items:center;justify-content:center;gap:0 10px}
.btn {display:flex;align-items:center;justify-content:center;gap:0 10px;height:60px;font-size:24px;font-weight:700;border-radius:100px;padding:0 40px;transition:all .2s}
.btn_primary {background:var(--primary);color:var(--white)}
.btn_primary:hover {background:var(--white);border:solid 1px var(--primary);color:var(--primary)}
.sec {overflow:hidden}
.primary {color:var(--primary)}

.iframe_wrap {width:100%;height:0;padding-bottom:56.25%;position:relative}
.iframe_wrap::after {content:'';background:transparent;width:100%;height:100%;position:absolute;top:0;left:0}
.iframe_wrap iframe {display:block;width:100%;height:100%;object-fit:cover;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}

.title_box {text-align:center;margin-bottom:60px}
.title_box.left {text-align:left}
.title_box.left .btn_wrap {justify-content:flex-start}
.title_box .sub {display:block;font-size:20px;line-height:1.4;margin-bottom:20px}
.title_box .sub.mark {display:inline-block;color:var(--primary);padding:7px 20px;background:#F1F7FF;border:solid 1px var(--primary);border-radius:100px}
.title_box .sub .star1::after {width:16px;height:18px;top:-30%;left:96%}
.title_box .tit {font-size:48px;font-weight:700;line-height:1.35;position:relative}
.title_box .tit > img {height:.94em;width:auto}
.title_box p {font-size:22px;color:#5D5D5D;margin-top:24px}
.title_box p.quote {display:inline-block;position:relative}
.title_box p.quote::before {content:'';display:block;width:20px;height:14px;background:url('../img/web/quote_left.svg') no-repeat center/100%;position:absolute;right:calc(100% + 12px);top:0}
.title_box p.quote::after {content:'';display:block;width:20px;height:14px;background:url('../img/web/quote_right.svg') no-repeat center/100%;position:absolute;left:calc(100% + 12px);bottom:0}
.title_box .btn_wrap {margin-top:34px}
.title_box .dot {text-emphasis-style:dot;text-emphasis-color:#E21F25}
.title_box .bubble {position:absolute;bottom:108%;font-size:12px;font-weight:700;color:#343434;background:#FFEDED;border-radius:100px;padding:7px 12px 6px}
.title_box .bubble::before {content:'';display:block;width:10px;height:9px;background:url('../img/web/bubble_pink.svg') no-repeat center top/100%;position:absolute;top:94%;left:14px}
.title_box .bubble.white {background:var(--white)}
.title_box .bubble.white::before {background-image:url('../img/web/bubble_white.svg')}
.title_box .bubble.yellow {background:#FFF598}
.title_box .bubble.yellow::before {background-image:url('../img/web/bubble_yellow.svg')}

.highlight {position:relative}
.highlight::before {content:'';display:block;background:#FFF6A5;width:102%;height:104%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}
.highlight.green::before {background:#E7FBCD}
.highlight.pink::before {background:#FFE9F5}
.highlight.yellow::before {background:#FFF6A5}
.highlight .txt {position:relative;z-index:1}

.underline {position:relative}
.underline::before {content:'';display:block;width:104%;height:114%;background:url('../img/web/underline.svg') no-repeat center bottom/100%;position:absolute;top:0;left:-2%;z-index:2}
.underline.line1::before {background-image:url('../img/web/underline1.svg')}
.underline.line2::before {background-image:url('../img/web/underline2.svg')}
.underline.line3::before {background-image:url('../img/web/underline3.svg')}
.underline.line4::before {background-image:url('../img/web/underline4.svg')}
.underline.double::before {background-image:url('../img/web/underline_double.svg')}
.circle {position:relative}
.circle::before {content:'';display:block;width:118%;height:124%;background:url('../img/web/circle.svg') no-repeat center bottom/100%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}

.star1 {position:relative}
.star1::after {content:'';display:block;width:29px;height:28px;background:url('../img/web/star_1.svg') no-repeat center/100%;position:absolute;top:-2%;left:98%}
.star2 {position:relative}
.star2::after {content:'';display:block;width:40px;height:48px;background:url('../img/web/star_2.svg') no-repeat center/100%;position:absolute;bottom:0;left:102%}

.txt_slide {display:flex;opacity:.05;color:var(--white)}
.txt_slide p {display:flex;align-items:center;font-size:120px;font-weight:700;animation:txtSlide 8s linear infinite;white-space:nowrap;}
.txt_slide p::before {content:'';display:block;width:10px;height:10px;background:#fff;border-radius:10px;margin:0 40px}
@keyframes txtSlide {
    from {transform:translateX(0)}
    to {transform:translateX(-100%)}
}

/* 헤더 */
.header {width:100%;position:fixed;top:0;left:0;z-index:99;transition:all .2s;font-size:20px}
.header.white {background:var(--white);border-bottom:solid 1px #f8f8f8}
.header.white .gnb li a {color:var(--black)}
.header.white .logo .color {display:block}
.header.white .logo .white {display:none}
.header.white .menu_open path {fill:var(--black)}

.header .wrapper {display:flex;align-items:center;max-width:1780px;height:var(--header-height)}
.header .logo {width:138px}
.header .logo .color {display:none}
.header .mark {display:block;padding:10px;border-radius:10px;background:var(--primary);color:var(--white);font-weight:700;margin:0 40px 0 auto}
.header .menu_wrap {display:flex;align-items:center}
.header .menu_wrap .menu_head {display:none}
.header .gnb ul {display:flex;align-items:center;gap:0 40px}
.header .gnb li a {display:flex;align-items:center;height:var(--header-height);color:var(--white);font-weight:500;transition:all .2s}
.header .gnb li a:hover {color:var(--primary)}
.header .menu_open {display:none}
.header .mb_menu {display:none}

/* 푸터 */
.footer {padding:60px 0;font-size:15px}
.footer .top {display:flex;align-items:center;justify-content:space-between}
.footer .term_link {display:flex;align-items:center;flex-wrap:wrap;gap:30px;}
.footer .term_link a {font-size:15px;font-weight:700}
.footer .term_link a:hover {text-decoration:underline}
.footer .info {display:flex;flex-direction:column;gap:16px 0;margin-top:40px}
.footer .info > div {display:flex;flex-wrap:wrap;align-items:center;gap:16px 0}
.footer .info > div span {display:flex;align-items:center;}
.footer .info > div span+ span::before {content:'';display:block;width:1px;height:14px;background:rgba(0,0,0,.2);margin:0 16px}
.footer .copyright {margin-top:30px;color:rgba(0,0,0,.3)}

@media all and (max-width: 1199px) {
    :root {
        --header-height: 72px;
        --sec-padding: 120px;
    }

    .btn {font-size:20px;height:54px}

    .star1::after {width:22px;top:-14%}
    .star2::after {width:34px;height:42px;bottom:30%}

    .title_box {margin-bottom:50px}
    .title_box .tit {font-size:36px}
    .title_box .sub {font-size:16px;margin-bottom:16px}
    .title_box p {font-size:18px}
    
    .txt_slide p {font-size:90px}

    /* 헤더 */
    .header .wrapper {padding:0 0 0 20px}
    .header .logo {width:103px}
    .header .menu_wrap {display:none;flex-direction:column;align-items:flex-start;width:100%;height:100%;background:var(--white);position:fixed;top:0;left:0;overflow-y:auto;padding:0 20px 40px}
    .header .menu_wrap .menu_head {display:flex;align-items:center;width:100%;height:var(--header-height);padding-left:16px;position:fixed;top:0;left:0}
    .header .mark {font-size:13px;border-radius:5px;margin:0 0 0 auto}
    .header .gnb {width:100%;margin:96px 0 40px}
    .header .gnb ul {width:100%;flex-direction:column;align-items:flex-start;gap:20px 0;overflow-y:auto}
    .header .gnb li a {height:auto;font-size:20px;font-weight:600;color:var(--black);padding:8px 10px}
    .header .gnb li.mb_menu {width:100%;display:block}
    .header .gnb li.mb_menu a {width:100%;height:54px;border-radius:5px;color:var(--white);}
    .header .menu_open,
    .header .menu_close {display:flex;align-items:center;justify-content:center;width:var(--header-height);height:var(--header-height)}
    .header .menu_close {margin-left:auto}
}

@media all and (max-width: 1023px) {
    .underline::before {height:120%}
    .footer .top {flex-direction:column;align-items:flex-start;gap:20px}
    .footer .term_link {gap:8px 14px}
    .footer .term_link a {font-size:13px}
    .footer .info {margin-top:30px}
}

@media all and (max-width: 767px) {
    :root {
        --sec-padding: 80px;
    }

    .btn {font-size:17px;height:48px;padding:0 30px}

    .only_mb {display:block}
    .only_pc {display:none}
    
    .star1::after {width:15px;height:16px}
    .star2::after {width:28px;left:98%}

    .txt_slide p {font-size:60px}
    .txt_slide p::before {margin:0 20px}

    .title_box {margin-bottom:40px}
    .title_box .sub.mark {font-size:14px}
    .title_box .sub .underline::before {height:124%}
    .title_box .sub .star1::after {width:14px;top:-37%;left:100%}
    .title_box .tit {font-size:24px}
    .title_box p {font-size:14px;margin-top:20px}
    .title_box .btn_wrap {margin-top:24px}
    .title_box p.quote::before,
    .title_box p.quote::after {width:14px;height:12px}

    /* 푸터 */
    .footer {font-size:12px}
    .footer .top > img {width:88px}
    .footer .info {gap:10px;margin-top:20px}
    .footer .info > div span+ span::before {height:10px;margin:0 8px}
    .footer .copyright {margin-top:20px}
}

@media all and (max-width: 499px) {
    .footer .info > div {gap:10px 16px}
    .footer .info > div span+ span::before {display:none}
}
@media all and (max-width: 339px) {
    .under340 {display:block}
}

/* 인덱스 */
.index .sec_02 {background:linear-gradient(#E8F2FE, #DDE3FB);padding-top:calc(var(--header-height) + var(--sec-padding))}
.index .sec_02 .wrapper {max-width:1740px}
.index .sec_02 .title_box {margin:0;position:relative;z-index:3}
.index .sec_02 .cont {margin-top:-60px;position:relative}
.index .sec_02 .bg_img {max-width:895px;margin:0 auto}
.index .sec_02 .asset {width:420px;position:absolute;top:5%;left:2%}
.index .sec_02 .asset_02 {top:auto;bottom:12%;left:10%}
.index .sec_02 .asset_03 {left:auto;right:7%;top:20%}
.index .sec_02 .asset .box {width:100px;border-radius:32px;box-shadow:4px 4px 20px rgba(125,126,166,.3);overflow:hidden;position:absolute;top:0;right:0;transform:translate(30%, -28%)}
.index .sec_02 .asset .box.left {right:auto;left:0;transform:translate(-35%, -62%)}

.index .sec_03 {padding-top:var(--sec-padding)}
.index .sec_03 .wrapper {max-width:1800px}
.index .sec_03 .cont {position:relative}
.index .sec_03 .bg_img {max-width:688px;margin:0 auto}
.index .sec_03 .content {display:flex;align-items:center;justify-content:space-between;position:absolute;bottom:0;left:0;width:100%;padding-bottom:70px}
.index .sec_03 .content > div {display:flex;flex-direction:column;align-items:flex-end;gap:36px 0;width:38%}
.index .sec_03 .content > .bg_img {display:none}
.index .sec_03 .bubble {padding:20px 40px;font-size:26px;font-weight:700;text-align:center;background:var(--primary);border-radius:50px;color:var(--white);position:relative}
.index .sec_03 .bubble::before {content:'';display:block;width:25px;height:18px;background:url('../img/web/index_03_02.svg') no-repeat center/100%;position:absolute;top:93%;right:48px}
.index .sec_03 .bubble.yellow {background:#FFF598;color:#111111}
.index .sec_03 .bubble.yellow::before {background-image:url('../img/web/index_03_03.svg')}
.index .sec_03 .content > .left > .bubble:nth-child(1) {margin-right:15%}
.index .sec_03 .content > .left > .bubble:nth-child(2) {margin-right:37%}
.index .sec_03 .content > .left > .bubble:nth-child(3) {margin-right:10%}
.index .sec_03 .content > .left > .bubble:nth-child(4) {margin-right:32%}
.index .sec_03 .content > .right {align-items:flex-start;}
.index .sec_03 .content > .right .bubble::before {right:auto;left:48px;transform:rotateY(180deg);}
.index .sec_03 .content > .right > .bubble:nth-child(2) {margin-left:30%}
.index .sec_03 .content > .right > .bubble:nth-child(4) {margin-left:30%}
.index .sec_03 .content > .right > .bubble:nth-child(5) {margin-left:-8%}

.index .sec_04 {background:#D9E4FF;padding-top:var(--sec-padding)}
.index .sec_04 .title_box .tit .underline::before {height:122%}
.index .sec_04 .swiper-wrapper {-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important}
.index .sec_04 .swiper-slide {padding:0 8px;width:auto}
.index .sec_04 .swiper-slide span {display:block;font-size:24px;font-weight:700;padding:18px 40px;background:pink;border-radius:100px}
.index .sec_04 .swiper-slide span.blue {background:#EAF5FF;color:#3384FE}
.index .sec_04 .swiper-slide span.purple {background:#F7F3FB;color:#4900F3}
.index .sec_04 .swiper-slide span.yellow {background:#FEFFEA;color:#FEA933}
.index .sec_04 .swiper-slide span.green {background:#F4FBF3;color:#5DC419}
.index .sec_04 .swiper-slide span.orange {background:#FFF7EA;color:#F8882D}
.index .sec_04 .swiper-slide span.pink {background:#FBF3F5;color:#E12BF6}
.index .sec_04 .swiper-slide span.marine {background:#E7FCF7;color:#2DC1B4}
.index .sec_04 .swiper-slide span.brown {background:#FBF3F3;color:#D74A34}
.index .sec_04 .swiper-slide span.darkgreen {background:#EAFFEE;color:#33CD64}
.index .sec_04 .swiper-slide span.skyblue {background:#EAFDFF;color:#00ADE2}
.index .sec_04 .wrapper {max-width:1460px}
.index .sec_04 .cont {display:flex;align-items:flex-start;justify-content:space-between;margin-top:100px}
.index .sec_04 .title_box {padding-top:30px}
.index .sec_04 .title_box .tit .gray {color:#7C7C7C;font-size:.8em}
.index .sec_04 .img_wrap {width:50%;max-width:700px}

.index .sec_05 {padding:var(--sec-padding) 0 calc(var(--sec-padding) * .5)}
.index .sec_05 .stage {height: 300px;min-height: 260px;display: grid;place-items: center;overflow: hidden;position: relative;}
.index .sec_05 .merge-logo {opacity:0}
.index .sec_05 .merge-line {position: relative;display: flex;align-items: center;will-change: transform, opacity;}
.index .sec_05 .merge-text {font-weight: 800;font-size: clamp(28px, 6vw, 44px);letter-spacing: .02em;white-space: nowrap;opacity: 0;}
.index .sec_05 .stage.active .merge-text.left{
    transform: translateX(-120%);
    animation:
        slideInLeft var(--slide-dur) cubic-bezier(.2,.65,.2,1) forwards,
        hold       var(--hold-dur)  linear var(--slide-dur) forwards,
        fadeOut    var(--swap-dur)  ease   calc(var(--slide-dur) + var(--hold-dur)) forwards;
}
.index .sec_05 .merge-text.left .txt {display:block;transform:translate(20%)}
.index .sec_05 .stage.active .merge-text.right{
    transform: translateX(120%);
    animation:
        slideInRight var(--slide-dur) cubic-bezier(.2,.65,.2,1) forwards,
        hold        var(--hold-dur)  linear var(--slide-dur) forwards,
        fadeOut     var(--swap-dur)  ease   calc(var(--slide-dur) + var(--hold-dur)) forwards;
}
.index .sec_05 .merge-text.right .txt {display:block;transform:translate(-20%)}
.index .sec_05 .stage.active .merge-logo {position: absolute;inset: 0;margin: auto;width:240px;opacity: 0;transform: scale(.92);animation: logoIn var(--swap-dur) ease calc(var(--slide-dur) + var(--hold-dur) - .1s) forwards;}

/* 키프레임 */
@keyframes slideInLeft{
    0%   { opacity:0; transform: translateX(-120%); }
    15%  { opacity:1; }
    100% { opacity:1; transform: translateX(0%); }
}
@keyframes slideInRight{
    0%   { opacity:0; transform: translateX(120%); }
    15%  { opacity:1; }
    100% { opacity:1; transform: translateX(0%); }
}
@keyframes hold{ from{opacity:1} to{opacity:1} }
@keyframes fadeOut{ to{ opacity:0; } }
@keyframes logoIn{
    0%   { opacity:0; transform: scale(.92); }
    100% { opacity:1; transform: scale(1); }
}

/* 모션 최소화 선호 대응 */
@media (prefers-reduced-motion: reduce){
    .merge-text, .merge-logo{ animation: none !important; opacity: 1; transform: none; }
}

.index .sec_06 {padding:var(--sec-padding) 0}
.index .sec_06 .wrapper {display:flex;align-items:flex-start;justify-content:space-between;max-width:1520px}
.index .sec_06 .title_box .sub .highlight::before {width:100%}
.index .sec_06 .list {display:flex;flex-wrap:wrap;gap:30px;max-width:840px;}
.index .sec_06 .list .item {width:calc((100% - 60px)/3);background:var(--white);border-radius:14px;box-shadow:0 10px 20px rgba(0,73,255,.2);padding:20px}
.index .sec_06 .list .item .inner {background:#FFFCE2;border-radius:10px;text-align:center;padding:20px}
.index .sec_06 .list .item .inner.blue {background:#F6F9FF}
.index .sec_06 .list .item .inner img {height:100px;animation: jiggle 0.25s ease-in-out infinite;}
.index .sec_06 .list .item .inner span {display:block;font-size:28px;font-weight:700;margin-top:20px}
.index .sec_06 .list .item:nth-child(2),
.index .sec_06 .list .item:nth-child(5) {transform:translateY(30px)}
@keyframes jiggle {
    0% { transform: rotate(-2deg) scale(1.02); }
    25% { transform: rotate(2deg) scale(0.98); }
    50% { transform: rotate(-1.5deg) scale(1.01); }
    75% { transform: rotate(1.5deg) scale(0.99); }
    100% { transform: rotate(-2deg) scale(1.02); }
}

.index .sec_07 {background:#0B2651;padding-top:var(--sec-padding)}
.index .sec_07 .title_box .tit {color:var(--white)}
.index .sec_07 .swiper-wrapper {-webkit-transition-timing-function:linear!important;transition-timing-function:linear!important}
.index .sec_07 .swiper {overflow:visible}
.index .sec_07 .swiper-slide {padding:0 10px;width:430px}
.index .sec_07 .swiper-slide img {width:100%;border-radius:10px}
.index .sec_07 .txt_slide {transform:translateY(26%)}

.patent {align-self:flex-end;width:142px;background:var(--white);border-radius:10px;padding:16px 10px;box-shadow:4px 4px 20px rgba(0,0,0,.1);text-align:center}
.patent img {width:63px}
.patent span {display:block;font-size:18px;font-weight:700;color:#0049FF;margin-top:4px}
.index .sec_08 {padding-top:var(--sec-padding)}
.index .sec_08 .title_box .sub .underline::before {height:122%}
.index .sec_08 .title_box .emphasis {display:flex;align-items:center;justify-content:center;gap:10px 20px;margin-top:40px}
.index .sec_08 .title_box .emphasis > div {width:auto;height:64px}
.index .sec_08 .title_box .emphasis > div img {height:100%}
.index .sec_08 .cont {background:#EDF3FF;padding:70px 0 var(--sec-padding)}
.index .sec_08 .cont .wrapper {display:flex;align-items:flex-start;gap:0 40px;max-width:1520px}
.index .sec_08 .swiper {width:calc(60% - 40px)}
.index .sec_08 .swiper-slide {background:var(--white);padding:20px;box-shadow:0 4px 20px rgba(0,0,0,.2);opacity:0 !important}
.index .sec_08 .swiper-slide-active {opacity:1 !important}
.index .sec_08 .swiper-slide img {width:100%}
.index .sec_08 .swiper-pagination {width:34%;display:flex;flex-direction:column;align-items:flex-start;gap:12px;position:relative;bottom:0;top:0}
.index .sec_08 .swiper-pagination-bullet {display:flex;align-items:center;gap:0 14px;width:100% !important;height:auto !important;border-radius:10px;opacity:1;background:var(--white);padding:15px 40px;font-size:24px;font-weight:600;text-align:left;margin:0 !important}
.index .sec_08 .swiper-pagination-bullet img {width:50px}
.index .sec_08 .swiper-pagination-bullet-active {color:var(--white);background:var(--primary);box-shadow:0 4px 20px rgba(0,0,0,.1)}
.index .sec_08 .patent {margin:0 0 22px -16px}

.index .sec_09 {background:#009DFF;padding:120px 0}
.index .sec_09 .list {display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 12px}
.index .sec_09 .list .item {font-size:35px;font-weight:700;padding:11px 34px;color:#3384FE;background:#EAF5FF;border-radius:50px}
.index .sec_09 .list .item.purple {background:#F7F3FB;color:#4900F3}
.index .sec_09 .list .item.yellow {background:#FEFFEA;color:#FEA933}
.index .sec_09 .list .item.green {background:#F4FBF3;color:#398F00}
.index .sec_09 .list .item.marine {background:#E7FCF7;color:#2DC1B4}
.index .sec_09 p {text-align:center;font-size:34px;font-weight:600;margin-top:30px;color:var(--white)}
.index .sec_09 p .underline {color:#FEF433}

.index .sec_10 .wrapper {max-width:1540px}
.index .sec_10 .title_box .sub .underline::before {height:122%}
.index .sec_10 .item {display:flex;align-items:center;justify-content:space-between;gap:0 100px;padding-top:150px}
.index .sec_10 .item .title_box {margin:0}
.index .sec_10 .item .img_wrap {max-width:820px;width:56%}
.index .sec_10 .item:nth-child(2) {flex-direction:row-reverse;justify-content:flex-end;}
.index .sec_10 .item:nth-child(2) .img_wrap {max-width:620px}

.index .sec_11 {padding:var(--sec-padding) 0}
.index .sec_11 .title_box .tit > img {transform:translate(-9%, -8%)}
.index .sec_11 .swiper {overflow:visible;max-width:1100px;margin:34px auto 0;position:relative}
.index .sec_11 .swiper-slide {width:100%;padding:0 12px;opacity:.5}
.index .sec_11 .swiper-slide-active {opacity:1}
.index .sec_11 .swiper-slide .img {border-radius:20px}
.index .sec_11 .swiper-pagination {display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 15px;position:initial}
.index .sec_11 .swiper-pagination-bullet {width:auto;height:50px;padding:0 20px;background:var(--white);border:solid 1px #DDDDDD;border-radius:100px;display:flex;align-items:center;gap:0 10px;text-align:center;font-size:20px;font-weight:500;color:#C8C8C8;opacity:1;margin:0 !important}
.index .sec_11 .swiper-pagination-bullet img {width:24px}
.index .sec_11 .swiper-pagination-bullet-active {background:var(--primary);border:0;color:var(--white)}
.swiper .btn_prev,
.swiper .btn_next {position:absolute;top:50%;left:-74px;transform:translateY(-50%);width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:var(--white);border-radius:100px;border:solid 1px #D9D9D9;box-shadow:0 4px 20px rgba(0,0,0,.1);z-index:3;cursor:pointer}
.swiper .btn_next {left:auto;right:-74px}

.index .sec_12 {background:#00BC90;padding:var(--sec-padding) 0}
.index .sec_12 .title_box {color:var(--white)}
.index .sec_12 .title_box .yellow {color:#FFF178}
.index .sec_12 .swiper {overflow:visible}
.index .sec_12 .swiper-slide {width:436px;padding:0 12px}
.index .sec_12 .swiper-slide .inner {background:var(--white);border-radius:20px;padding:34px 40px;font-size:18px}
.index .sec_12 .swiper-slide .top {display:flex;align-items:center;gap:0 16px}
.index .sec_12 .swiper-slide .top .img {width:80px}
.index .sec_12 .swiper-slide .name {display:block;font-weight:600}
.index .sec_12 .swiper-slide .top .company {display:block;font-weight:500;color:#808080;margin-top:6px}
.index .sec_12 .swiper-slide .cont {margin-top:24px}
.index .sec_12 .swiper-slide .cont .tit {display:block;font-size:1.2em;font-weight:700;line-height:1.35;margin-bottom:14px}

.index .sec_13 {background:#F7F9FD;padding:var(--sec-padding) 0}
.index .sec_13 .wrapper {display:flex;align-items:center;justify-content:space-between}
.index .sec_13 .title_box {margin:0}
.index .sec_13 .img_wrap {max-width:700px;width:50%}

.index .sec_14 {padding:var(--sec-padding) 0}
.index .sec_14 .title_box .tit .star1::after {top:-25%;left:92%}
.index .sec_14 .cont {display:flex;justify-content:center;gap:0 40px}
.index .sec_14 .cont .box {display:flex;flex-direction:column;width:100%;max-width:540px;border-radius:10px;background:#F3F3F3;padding:24px 20px}
.index .sec_14 .cont .box .tit {display:block;font-size:30px;font-weight:600;color:#838383;text-align:center;margin-bottom:24px}
.index .sec_14 .cont .box .list {flex:1;display:flex;flex-direction:column;gap:20px}
.index .sec_14 .cont .box .item {flex:1;display:flex;align-items:center;justify-content:center;background:#FAFAFA;border:solid 2px transparent;border-radius:14px;padding:30px 20px;text-align:center;font-size:22px;font-weight:500;color:#A0A0A0;transition:all .2s}
.index .sec_14 .cont .box .item.active {background:var(--white);border:solid 2px #A4A4A4;color:var(--black)}
.index .sec_14 .cont .box.our {background:#DFE7FF;}
.index .sec_14 .cont .box.our .tit {color:var(--primary)}
.index .sec_14 .cont .box.our .item {background:var(--white);font-weight:700;color:var(--black)}
.index .sec_14 .cont .box.our .item > div {display:inline-flex;align-items:flex-start;gap:14px;}
.index .sec_14 .cont .box.our .item > div::before {content:'';display:block;width:24px;min-width:24px;height:24px;background:url('../img/web/chk_blue.svg') no-repeat center/100%;position:relative;top:4px}
.index .sec_14 .cont .box.our .item.active {background:var(--primary);color:var(--white);border-color:var(--primary)}
.index .sec_14 .cont .box.our .item.active > div::before {background-image:url('../img/web/chk_yellow.svg')}
.index .sec_14 .cont .arrow {width:142px;min-width:142px;display:flex;align-items:center;justify-content:center}

.index .sec_15 {background:var(--primary);padding:var(--sec-padding) 0;color:var(--white)}
.index .sec_15 .wrapper {max-width:1380px}
.faq_list {border-bottom:solid 1px #5686FF}
.faq_list > ul > li {border-top:solid 1px #5686FF}
.faq_list button {width:100%;font-size:22px;font-weight:700;color:var(--white);padding:30px 50px 30px 96px;position:relative;text-align:left;transition:all .2s}
.faq_list button::before,
.faq_list .cont::before {content:'Q.';display:block;position:absolute;top:24px;left:40px;font-size:30px;font-weight:700;color:var(--white)}
.faq_list button::after {content:'';display:block;width:24px;height:24px;background:url('../img/web/arrow_down.svg') no-repeat center/100%;position:absolute;top:50%;right:40px;transform:translateY(-50%);transition:all .2s}
.faq_list button.on {background:#E6EDFF;color:var(--black)}
.faq_list button.on::before {color:var(--primary)}
.faq_list button.on::after {transform:rotate(180deg) translateY(14px);background-image:url('../img/web/arrow_down_blue.svg')}
.faq_list .cont {display:none;font-size:20px;padding:34px 50px 34px 96px;position:relative}
.faq_list .cont::before {content:'A.';top:34px;color:var(--white)}
.faq_list .cont p {line-height:1.6}
.faq_list .cont ul {margin-top:20px}
.faq_list .cont li {position:relative;padding-left:14px}
.faq_list .cont li::before {content:'·';display:block;position:absolute;top:0;left:0}

@media all and (max-width: 1499px) {
    .index .sec_03 .bubble {font-size:22px;padding:16px 26px}
    .index .sec_08 .cont .wrapper {flex-wrap:wrap}
    .index .sec_08 .patent {margin:20px auto 0}
    .patent {display:flex;align-items:center;gap:8px;width:auto;margin:20px auto 0;padding:12px 20px}
    .patent img.only_mb {width:120px;display:block}
    .patent img.only_pc {display:none}
    .patent span {margin:0}
}

@media all and (max-width: 1399px) {
    .index .sec_02 .asset {width:370px}
    .index .sec_02 .asset .box {width:80px;border-radius:20px}

    .index .sec_06 .list {max-width:650px;gap:20px}
    .index .sec_06 .list .item {width:calc((100% - 40px)/3)}
    .index .sec_06 .list .item .inner img {height:70px}
    .index .sec_06 .list .item .inner span {font-size:20px;margin-top:10px}

    .swiper .btn_prev {left:-16px}
    .swiper .btn_next {right:-16px}
}

@media all and (max-width: 1199px) {
    .index .sec_02 .bg_img {max-width:820px}
    .index .sec_02 .asset {width:320px}
    .index .sec_02 .asset_01 {left:0;top:20%}
    .index .sec_02 .asset_02 {left:3%}
    .index .sec_02 .asset_03 {right:0;top:33%}
    .index .sec_02 .asset .box {width:76px}

    .index .sec_03 .bubble {font-size:20px;padding:12px 24px}
    .index .sec_03 .bubble::before {width:18px;height:13px}
    .index .sec_03 .content > .left > .bubble:nth-child(2) {margin-right:28%}
    .index .sec_03 .content > .left > .bubble:nth-child(4) {margin-right:25%}
    .index .sec_03 .content > .right > .bubble:nth-child(4) {margin-left:22%}

    .index .sec_04 .swiper-slide span {font-size:18px;padding:10px 30px}

    .index .sec_06 .wrapper {align-items:center;}
    .index .sec_06 .title_box {margin:0}
    .index .sec_06 .list {max-width:580px}

    .index .sec_07 .swiper-slide {width:280px}

    .index .sec_08 .title_box .emphasis > div {height:54px}

    .index .sec_08 .cont .wrapper {flex-direction:column-reverse;gap:20px}
    .index .sec_08 .swiper {flex:none;width:100%}
    .index .sec_08 .swiper-pagination {flex-direction:row;flex-wrap:wrap;width:100%;gap:10px;position:initial;align-self:flex-start;}
    .index .sec_08 .swiper-pagination-bullet {width:calc((100% - 10px)/2) !important;margin:0 !important;font-size:20px}
    .index .sec_08 .swiper-pagination-bullet img {width:35px}
    .index .sec_08 .patent {order:-3;margin-top:0}

    .index .sec_09 {padding:90px 0}
    .index .sec_09 .list .item {font-size:24px}

    .index .sec_10 .item {gap:0 60px}

    .index .sec_11 .swiper-pagination {gap:8px 10px}
    .index .sec_11 .swiper-pagination-bullet {font-size:16px;height:44px}

    .index .sec_14 .cont {gap:0 20px}
    .index .sec_14 .cont .box .item {font-size:18px;padding:20px 10px}
    .index .sec_14 .cont .box.our .item > div {gap:8px}
    .index .sec_14 .cont .box.our .item > div::before {width:20px;min-width:20px;height:20px;}
    .index .sec_14 .cont .box .tit {font-size:25px}

    /* faq */
    .faq_list button {font-size:24px;padding:30px 50px 30px 70px}
    .faq_list button::before,
    .faq_list .cont::before {font-size:24px;top:30px;left:30px}
    .faq_list .cont {font-size:17px;padding:28px 50px 34px 70px}
}

@media all and (max-width: 1023px) {
    .index .sec_02 .cont {margin-top:0}
    .index .sec_02 .asset {width:76px}
    .index .sec_02 .asset > img {display:none}
    .index .sec_02 .asset_01 {left:5%;top:14%}
    .index .sec_02 .asset_02 {left:11%;bottom:37%}
    .index .sec_02 .asset_03 {right:5%}

    .index .sec_03 .content {flex-direction:column;justify-content:center;position:initial;padding-bottom:80px}
    .index .sec_03 .content > div {flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:13px 8px;width:100%}
    .index .sec_03 .cont > .bg_img {display:none}
    .index .sec_03 .content > .bg_img {display:block;max-width:450px;margin-top:30px}
    .index .sec_03 .bubble {margin: 0 !important}
    .index .sec_03 .bubble::before {display:none}

    .index .sec_04 .title_box {text-align:center}
    .index .sec_04 .title_box .btn_wrap {justify-content:center;}
    .index .sec_04 .cont {flex-direction:column;align-items:center;}
    .index .sec_04 .img_wrap {width:100vw;max-width:500px}

    .index .sec_06 {padding-top:0}
    .index .sec_06 .wrapper {flex-direction:column;gap:24px 0}
    .index .sec_06 .title_box {text-align:center}

    .index .sec_10 .item {flex-direction:column !important;gap:34px;padding-top:80px}
    .index .sec_10 .item .title_box {text-align:center}
    .index .sec_10 .item .img_wrap {width:100%;max-width:600px}
    .index .sec_10 .item:nth-child(2) .img_wrap {max-width:580px}

    .index .sec_11 .title_box .sub .star1::after {top:-45%;left:93%}

    .index .sec_13 .wrapper {flex-direction:column;justify-content:flex-start;gap:30px;padding:0}
    .index .sec_13 .title_box {text-align:center;padding:0 20px}
    .index .sec_13 .title_box .btn_wrap {justify-content:center;}
    .index .sec_13 .img_wrap {width:100%;max-width:600px}

    .index .sec_14 .cont {flex-direction:column;align-items:center;}
    .index .sec_14 .arrow .only_pc {display:none}
    .index .sec_14 .arrow .only_mb {display:block;margin-bottom:14px}
}

@media all and (max-width: 767px) {
    .iframe_wrap {padding-bottom:640px}

    .index .sec_02 .bg_img {width:130%;position:relative;left:50%;transform:translateX(-50%)}
    .index .sec_02 .asset_01 {left:-5%;top:10%}
    .index .sec_02 .asset_02 {left:1%;bottom:43%}
    .index .sec_02 .asset_03 {right:-7%;top:28%}

    .index .sec_03 .title_box {margin-bottom:25px}
    .index .sec_03 .bubble {font-size:14px;padding:7px 10px}

    .index .sec_04 .cont {margin-top:50px}
    .index .sec_04 .swiper-slide {padding:0 5px}
    .index .sec_04 .swiper-slide span {font-size:14px;padding:11px 20px}

    .index .sec_05 .stage {height:200px;min-height:200px}
    .index .sec_05 .stage.active .merge-logo {width:180px}

    .index .sec_06 .list {gap:12px;max-width:420px}
    .index .sec_06 .list .item {padding:8px;border-radius:6px;width:calc((100% - 24px)/3)}
    .index .sec_06 .list .item .inner {border-radius:4px;padding:10px}
    .index .sec_06 .list .item .inner img {height:40px}
    .index .sec_06 .list .item .inner span {font-size:13px}
    .index .sec_06 .list .item:nth-child(2),
    .index .sec_06 .list .item:nth-child(5) {transform:translateY(14px)}

    .index .sec_07 .swiper-slide {width:174px;padding:0 5px}
    
    .patent {padding:8px 14px}
    .patent img.only_mb {width:90px}
    .patent span {font-size:14px}
    .index .sec_08 .title_box {margin-bottom:24px}
    .index .sec_08 .title_box .emphasis {gap:10px;margin-top:24px}
    .index .sec_08 .title_box .emphasis > div {height:34px}

    .index .sec_08 .swiper {width:100vw;margin-left:-20px}
    .index .sec_08 .swiper-pagination-bullet {font-size:14px;padding:10px 20px;gap:6px;justify-content:center;}
    .index .sec_08 .swiper-pagination-bullet img {width:20px}

    .index .sec_09 {padding:60px 0}
    .index .sec_09 .list {gap:10px}
    .index .sec_09 .list .item {font-size:17px;padding:10px 14px}
    .index .sec_09 p {font-size:24px;margin-top:26px}

    .index .sec_11 .wrapper {padding:0}
    .index .sec_11 .title_box {padding:0 20px}
    .index .sec_11 .swiper {overflow:hidden;width:500px;max-width:100%}
    .index .sec_11 .swiper-slide {padding:0}
    .index .sec_11 .swiper-pagination-bullet {font-size:14px;height:40px;gap:4px;padding:0 10px}
    .index .sec_11 .swiper-pagination-bullet img {width:16px}

    .swiper .btn_wrap {margin-top:20px}
    .swiper .btn_prev,
    .swiper .btn_next {position:initial;transform:none;width:40px;height:40px;box-shadow:none}

    .index .sec_12 .swiper-slide {width:300px;padding:0 6px}
    .index .sec_12 .swiper-slide .inner {padding:20px;font-size:13px}
    .index .sec_12 .swiper-slide .top {gap:0 12px}
    .index .sec_12 .swiper-slide .top .img {width:44px}
    .index .sec_12 .swiper-slide .cont {margin-top:16px}

    .index .sec_14 .cont .box .item {font-size:16px;padding:12px 10px;border-radius:10px}
    .index .sec_14 .cont .box .tit {font-size:20px;margin-bottom:16px}
    .index .sec_14 .cont .box.our .item > div::before {width:17px;min-width:17px;height:17px}
    .index .sec_14 .cont .box.our .item {justify-content:flex-start;text-align:left}
    .index .sec_14 .cont .box.our .item > div::before {top:3px}

    /* faq */
    .faq_list button {font-size:18px;padding:24px 40px 24px 46px}
    .faq_list button::before,
    .faq_list .cont::before {font-size:18px;left:14px;top:23px}
    .faq_list button::after {right:14px}
    .faq_list .cont {font-size:14px;padding:24px 16px 24px 46px}
}

@media all and (max-width: 365px) {
    .index .sec_08 .swiper-pagination-bullet {padding:10px}
}

/* 서비스 소개 */
.service .sec_01 {padding:190px 0 var(--sec-padding);position:relative}
.service .sec_01 .bg {width:100%;height:850px;background:url('../img/web/service_01_bg.jpg') no-repeat center/cover;position:absolute;top:0;left:0;z-index:-1}
.service .sec_01 .cont {position:relative;width:fit-content}
.service .sec_01 .patent {background:#EDF3FF;border:solid 1px rgba(0,73,255,.18);position:absolute;bottom:0;left:calc(100% + 28px);margin:0}
.service .sec_01 .title_box {color:var(--white)}
.service .sec_01 .title_box .yellow {color:#FFEB40}
.service .sec_01 .img_wrap {margin:100px auto 0}
.service .sec_01 .img_wrap,
.service .sec_03 .img_wrap,
.service .sec_07 .img_wrap,
.service .sec_10 .img_wrap {max-width:1270px}

.service .sec_02 {display:flex;position:relative}
.service .sec_02 .title_box .tit {font-size:44px}
.service .sec_02 .arrow {width:96px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:1;padding:0}
.service .sec_02 > div {width:50%;padding-top:120px}
.service .sec_02 > div .img_wrap {margin:auto auto 0}
.service .sec_02 .item_01 {display:flex;flex-direction:column;background:#FAFAFA}
.service .sec_02 .item_01 .img_wrap {max-width:864px;position:relative;z-index:3}
.service .sec_02 .item_02 {background:linear-gradient(#E3F1FF, #C0E1FF)}
.service .sec_02 .item_02 .logo {width:180px;margin:0 auto 38px}
.service .sec_02 .item_02 .logo img {width:100%}
.service .sec_02 .item_02 .img_wrap {max-width:873px}
.service .sec_02 .item_02 .arrow {display:none}

.service .sec_03 {padding:var(--sec-padding) 0;position:relative}
.service .sec_03 .title_box .bubble {left:58%}
.service .sec_03 .img_wrap {margin:0 auto}
.service .sec_03 .bg {width:100%;height:690px;background:url('../img/web/service_03_bg.jpg') no-repeat center/cover;position:absolute;bottom:0;left:0;z-index:-1}

.service .sec_04 {padding:var(--sec-padding) 0}
.service .sec_04 .wrapper {max-width:1500px}
.service .sec_04 .img_wrap {max-width:1500px;margin:0 auto}

.service .sec_05 {background:#EDF0FD;padding:var(--sec-padding) 0}
.service .sec_05 .wrapper {display:flex;align-items:center;justify-content:space-between;max-width:1420px}
.service .sec_05 .title_box {margin:0}
.service .sec_05 .swiper {margin:0}
.service .sec_05 .cont {position:relative;max-width:730px;width:60%}
.service .sec_05 .cont .bubble {display:inline-flex;align-items:center;gap:0 6px;background:#FFF6A5;border-radius:50px;padding:17px 20px;font-size:18px;font-weight:700;position:absolute;bottom:95%;right:-10%;z-index:2;box-shadow:0 4px 20px rgba(0,0,0,.1)}
.service .sec_05 .cont .bubble::before {content:'';display:block;width:25px;height:18px;background:url('../img/web/bubble_yellow.svg') no-repeat center top/100%;position:absolute;top:90%;left:30px}
.service .sec_05 .cont .bubble img {width:24px}

.service .sec_06 {padding:var(--sec-padding) 0}
.service .sec_06 .wrapper {display:flex;align-items:center;justify-content:space-between;max-width:1420px}
.service .sec_06 .img_wrap {max-width:800px;width:60%}

.service .sec_07 {padding:var(--sec-padding) 0;position:relative}
.service .sec_07 .bg {width:100%;height:750px;background:url('../img/web/service_07_bg.jpg') no-repeat center/cover;position:absolute;top:0;left:0;z-index:-1}
.service .sec_07 .title_box {color:var(--white)}
.service .sec_07 .img_wrap {margin:0 auto}

.service .sec_08 {padding-bottom:var(--sec-padding)}
.service .sec_08 .wrapper {max-width:1380px}
.service .sec_08 .item {display:flex;align-items:center;justify-content:space-between}
.service .sec_08 .item .img_wrap {max-width:690px;width:50%;}
.service .sec_08 .title_box p {position:relative;width:fit-content}
.service .sec_08 .title_box p .bubble {bottom:89%;left:102%;color:var(--primary)}
.service .sec_08 .list {display:grid;grid-template-columns:repeat(2, 1fr);gap:24px;margin-top:var(--sec-padding)}
.service .sec_08 .list > div {padding:40px 10px;border-radius:20px;background:#FBF3F3;color:#D74A34}
.service .sec_08 .list > div:nth-child(2) {background:#F5F1FF;color:#4900F3}
.service .sec_08 .list > div:nth-child(3) {background:#EAF5FF;color:#3384FE}
.service .sec_08 .list > div:nth-child(4) {background:#F4FBF3;color:#5DC319}
.service .sec_08 .list > div:nth-child(5) {background:#FEFFEA;color:#FEA933}
.service .sec_08 .list > div:nth-child(6) {background:#FFF7EA;color:#F8882D}
.service .sec_08 .list .txt_wrap span {display:block;text-align:center;font-size:24px;font-weight:700;margin-top:24px}

.service .sec_09 {background:#D9E4FF;padding:var(--sec-padding) 0}
.service .sec_09 .wrapper {display:flex;align-items:center;justify-content:space-between;max-width:1420px}
.service .sec_09 .title_box {margin:0;padding-right:50px}
.service .sec_09 .title_box .tit {width:fit-content}
.service .sec_09 .title_box .tit .bubble.white {left:26%}
.service .sec_09 .title_box .tit .bubble.pink {left:70%}
.service .sec_09 .img_wrap {max-width:690px;width:45%;}

.service .sec_10 {padding:var(--sec-padding) 0;position:relative}
.service .sec_10 .bg {width:100%;height:750px;background:url('../img/web/service_10_bg.jpg') no-repeat center/cover;position:absolute;top:0;left:0;z-index:-1}
.service .sec_10 .title_box {color:var(--white)}
.service .sec_10 .img_wrap {margin:0 auto}
.service .sec_10 .title_box .tit .pink {color:#FFA1AE}
.service .sec_10 .title_box .tit .green {color:#A3FF1A}
.service .sec_10 .title_box .tit .yellow {color:#FFE81A}

.service .sec_11 {padding-bottom:var(--sec-padding)}
.service .sec_11 .wrapper {max-width:1380px}
.service .sec_11 .title_box {margin:0}
.service .sec_11 .title_box .green {color:#02BD66}
.service .sec_11 .title_box .bubble {position:relative;margin:20px 0 -10px;display:inline-block}
.service .sec_11 .item {display:flex;align-items:center;justify-content:space-between;}
.service .sec_11 .item .img_wrap {width:60%;max-width:760px}
.service .sec_11 .item_01 .title_box .circle::before {width:106%;height:202%;background-image:url('../img/web/circle1.svg');background-position:center}
.service .sec_11 .item_02 {margin-top:var(--sec-padding)}

.service .sec_12 {background:url('../img/web/service_12_bg.jpg') no-repeat center/cover;padding:var(--sec-padding) 0}
.service .sec_12 .title_box {margin:0;color:var(--white)}

@media all and (max-width: 1599px) {
    .service .sec_05 .cont .bubble {right:10px}
}
@media all and (max-width: 1499px) {
    .service .sec_01 .cont {margin:0 auto}
    .service .sec_01 .patent {position:initial;width:fit-content;margin:20px auto 0}
}
@media all and (max-width: 1199px) {
    .service .sec_01 {padding-top:145px}
    .service .sec_01 .bg {height:640px}
    .service .sec_01 .img_wrap {margin-top:0}
    
    .service .sec_02 .title_box .tit {font-size:34px}
    .service .sec_02 > div {padding-top:80px}

    .service .sec_03 .bg {height:440px}

    .service .sec_10 .bg {height:440px}

    .service .sec_11 .item_02 {justify-content:flex-start;gap:80px;}
}

@media all and (max-width: 1023px) {
    .service .sec_02 {flex-direction:column;align-items:center;}
    .service .sec_02 > div {width:100%}
    .service .sec_02 > .arrow {display:none}
    .service .sec_02 .item_01 .img_wrap {max-width:600px}
    .service .sec_02 .item_02 {padding:0}
    .service .sec_02 .item_02 .arrow {display:block;position:relative;top:0;transform:translateX(-50%);margin-bottom:20px;width:53px}
    .service .sec_02 .item_02 .arrow img {transform:rotate(90deg)}
    .service .sec_02 .item_02 .logo {width:120px}

    .service .sec_05 .wrapper {flex-direction:column;gap:20px;max-width:600px;padding:0}
    .service .sec_05 .wrapper > div {width:100%}
    .service .sec_05 .title_box {padding:0 20px}
    .service .sec_05 .cont {text-align:center}
    .service .sec_05 .cont .bubble {position:initial;margin-top:20px;background:var(--white)}
    .service .sec_05 .cont .bubble::before {display:none}

    .service .sec_06 .wrapper {flex-direction:column-reverse;max-width:600px}
    .service .sec_06 .wrapper > div {width:100%}

    .service .sec_07 .bg {height:540px}

    .service .sec_08 .wrapper {max-width:600px}
    .service .sec_08 .item {flex-direction:column}
    .service .sec_08 .item > div {width:100%}
    .service .sec_08 .item .img_wrap {width:100%}
    .service .sec_08 .title_box p .bubble {bottom:66%;left:105%}
    .service .sec_08 .list {display:flex;flex-direction:column;gap:14px;margin-top:40px}
    .service .sec_08 .list .txt_wrap span {font-size:20px}

    .service .sec_09 .wrapper {max-width:600px;flex-direction:column-reverse;}
    .service .sec_09 .wrapper > div {width:100%}
    .service .sec_09 .title_box {margin-bottom:24px;text-align:center;padding:0}
    .service .sec_09 .title_box .tit {margin:0 auto}

    .service .sec_11 .wrapper {max-width:600px}
    .service .sec_11 .item {flex-direction:column;align-items:flex-start;gap:24px}
    .service .sec_11 .item > div {width:100%}
    .service .sec_11 .item .img_wrap {width:100%;order:2}
}

@media all and (max-width: 767px) {
    .service .sec_01 {padding-top:100px}
    .service .sec_01 .bg {height:430px}

    .service .sec_02 .title_box .tit {font-size:24px}
    .service .sec_02 > div {padding-top:40px}
    .service .sec_02 .item_01 .img_wrap {max-width:400px}

    .service .sec_03 .bg {height:190px}

    .service .sec_04 .wrapper {padding:0 10px}
    .service .sec_04 .img_wrap {max-width:500px;}
    .service .sec_05 .cont .bubble {font-size:13px;padding:8px 16px}

    .service .sec_07 .bg {height:320px}

    .service .sec_08 .list > div {border-radius:10px;padding:20px 10px}
    .service .sec_08 .list .txt_wrap span {font-size:16px;margin-top:16px}
    
    .service .sec_09 {padding-bottom:70px}

    .service .sec_10 .bg {height:320px}
}