@charset "utf-8";

:root {
  --hero-bg-pc: url(/pages/stability/images/sub_visual_pc.png);
  --hero-bg-mo: url(/pages/stability/images/sub_visual_mo.png);
  --hero-gap: 2em;
}
.section_inner{display: grid; gap: 4rem;}

.cert{background: #F3F9FF;}
.cert .cert_wrap{display:flex;justify-content: center;align-items: center;font-size:clamp(12px, 2vw, 2.4rem);gap: 2em;font-weight: 700;}
.cert .cert_logo_list{display:flex; flex-direction: column; justify-content: center; align-items: center;gap: 4rem;}
.cert .cert_timeline_item{border-radius: .8em;border: .3rem solid rgba(22, 87, 233, 0.30);background: #FFF;padding: .8em 1em;display:  flex;justify-content: flex-start;flex-direction: column;gap: .5em;position: relative;}
.cert .cert_timeline{display: grid;gap: 1em;padding-left: 5em;position: relative;}
.cert .cert_timeline::before{content:'';width: .2em;height: 100%;background:linear-gradient(180deg, rgba(22, 87, 233, 0.00) 0%, #1657E9 20%, #1657E9 80%, rgba(22, 87, 233, 0.00) 100%);display: block;position:absolute;left: calc(.4em/2);transform: translateX(-50%);}
.cert .cert_date{color:#fff;background: var(--gradient-03);font-size: 1.1em;border-radius: 100px;padding: .2em .5em;width: max-content;font-weight: 700;}
/* 라인 */
.cert .cert_timeline_item::before {content: "";position: absolute;right: calc(100%);top: 50%;transform: translateY(-50%);width: 5em;height: .2em;background: #1657E9;}
/* 원 ripple */
.cert .cert_timeline_item::after {content: "";position: absolute;right: calc(100% + 5em);top: 50%;transform: translate(50%, -50%);width: .4em;height: .4em;border-radius: 50%;background: #fff;box-shadow: 0 0 0 .5rem rgba(22, 87, 233, .8);}
.cert .cert_logo_item{width: 8.3em; aspect-ratio: 1/1; }

.stability .text_01{margin-bottom: 1rem;}
.stability_video{width: calc(1040/1280 * 100%);margin: 0 auto;border-radius: 1.2em;overflow: hidden;display: flex;flex-direction: column;font-size: clamp(14px, 2.8vw, 2.8rem);}
.stability_video video{aspect-ratio: 16/9;}
.stability_caption{background: var(--gradient-03);color: #fff;text-align: center;padding-block:.9em;font-weight: 600;letter-spacing: -0.04em;line-height: 1.4;}

.reason{--gradient-type: var(--gradient-02);color: #fff;background-image: url(../images/bg_reason_pc.png); background-repeat: no-repeat; background-size: cover; background-position: center top;}
.reason .text_03{font-weight:500;}
.reason .text_03 strong{font-weight: 800;}
.reason .reason_list{display: flex;justify-content: space-between;align-items: center;padding-bottom: 1rem;/* max-width: 1280px; */gap: 1.4em;font-size: clamp(28px, 4.2vw, 4.4rem);}
.reason_item{flex: 1;}
.reason .reason_badge{display: grid;gap: .5em;justify-content: center;align-items: center;text-align: center;letter-spacing: -0.04em;position: relative;}
.reason .reason_badge::before, .reason .reason_badge::after{content:'';width: 2.3em;height: 100%;display: block;background: url(../images/img_laurel.svg) no-repeat center / contain;position: absolute;top: 50%;}
.reason .reason_badge::before{left: 0;transform: translate(0, -50%);}
.reason .reason_badge::after{right:0;transform: scaleX(-1) translate(0, -50%);}
.reason .icon_star{display: block;width: 4.4em;background: url(../images/icon_star.svg) no-repeat center / contain;margin:0 auto;aspect-ratio: 196/60;}
.reason .reason_badge_title{font-weight: 800;}
/* PC (해상도 1058px ~ 1440px) */
@media screen and (max-width: 1440px) {
}

/* 태블릿 (768px ~ 1024px) */
@media screen and (max-width: 1024px) {
  /* ~9px */
    .stability_video{width: 100%;}
    
    .reason .reason_badge::before, .reason .reason_badge::after{width: 2em;}
    .reason .reason_badge::before{left: 0;transform: translate(-20%, -50%);}
    .reason .reason_badge::after{right:0;transform: scaleX(-1) translate(-20%, -50%);}
}
/* 모바일 (767px 이하) */
@media screen and (max-width: 767px) {
  /* 8px */
    
    .reason{background-image: url(../images/bg_reason_mo.png);}
    .reason .reason_list{flex-direction: column;}
    .reason_item{width:100%;}
    .reason .reason_badge::before{left: 0;transform: translate(0, -50%);}
    .reason .reason_badge::after{right:0;transform: scaleX(-1) translate(0, -50%);}
}