/* ==========================
COMMON
========================== */
:root {
    --key-color: #2C5BF6;
    --font-color: #333;
}

/* clamp(MINpx, calc(MINpx + (MAX - MIN) * ((100vw - 360px) / 840)), MAXpx);
 */

 *[class^="cont0"] { padding: 0 0 60px; }
.inner {overflow: hidden;width: 100%;max-width: 1024px;margin: 0 auto;text-align: center;}


.c-txt { font-size: 14px; color: #777; line-height: 1.5; font-weight: 400; text-align: left; padding-left: 32px;letter-spacing: -0.13px; }
.r-txt { font-size: 14px; color: #777; line-height: 1.5; font-weight: 400; text-align: right; letter-spacing: -0.13px;margin-top: 16px; }


/* ==========================
VISUAL
========================== */
.visual-wrap{position:relative;overflow:hidden;background:url("https://russeldata.megastudy.net/campus/images/russel/campus_common/2026/smart_report/v_bg.png") no-repeat top center / auto;background-position: top center;}
.visual-wrap .visual { padding-top: 80px; text-align: center; }
.visual-wrap .visual .sub-tit {margin-top: 60px;}
.visual-wrap .v-cont { margin: 20px 0 60px;}

.visual-top-txt {position:relative;display:inline-block;padding:8px 0;color:#333;font-size: 26px;font-weight: 500;line-height: 120%;letter-spacing: -0.52px;}
.visual-top-txt::before{content:"";position:absolute;left:0;top:0;width:100%;height:1px;background:#B1B1B1}
.visual-top-txt:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:#B1B1B1}
.visual-top-txt strong {font-weight: 700;}

.visual-logo{margin-top:20px}
.visual-logo img{display:block;margin:0 auto}

.visual-desc {margin-top:60px;color:#333;font-size:24px;font-weight:600;line-height: 140%;letter-spacing: -0.24px;}
.visual-desc .desc-blue {color: #16AAC2;font-weight: 600;}
.visual-desc .desc-deep-blue {color: #15418D;font-weight: 600;}
.visual-desc span{color:#19A9D8}
.visual-desc strong{font-weight:700}

.visual-step-wrap{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:24px}
.visual-step{display:flex;flex-direction:column;justify-content:center;align-items:center;width:240px;height:176px;background: rgba(255, 255, 255, 0.70);border:1px solid #E3E3E3;border-radius:10px}
.visual-step-icon{display:flex;justify-content:center;align-items:center;height:42px}
.visual-step-txt{margin-top:8px;color:#555;text-align: center;font-size: 20px;font-weight: 400;line-height: 140%;letter-spacing: -0.2px;}
.visual-step-plus{display:inline-block;color:#333;font-size:42px;font-weight:400;line-height:1}
.visual-line{width:1px;margin: 16px auto 12px;}

.visual-btm-txt{display:inline-block;position:relative;font-size:28px;font-weight:400;line-height: 150%;color:#169FDE;letter-spacing: -0.56px;background:linear-gradient(90deg,#1fc4d8 0%,#1f4ea1 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}
.visual-btm-txt:after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:6px;background:linear-gradient(90deg,#1fc4d8 0%,#1f4ea1 100%)}



/* ==========================
cont01
========================== */

.tit-wrap {text-align:center;padding:60px 0 40px;}
.tit-wrap .num {display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#15418D;color:#fff;margin-bottom:8px;text-align: center;font-size: 22px;font-weight: 600;line-height: 140%;    letter-spacing: -0.22px;}
.tit-wrap .title {color: #222;font-size: 28px;font-weight: 400;line-height: 140%;letter-spacing: -0.28px;}
.tit-wrap .title strong {font-weight: 600;}
.tit-wrap .desc {color: #555;text-align: center;margin-top: 8px;font-size: 20px;font-weight: 400;line-height: 140%;letter-spacing: -0.2px;}

.box-wrap {display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.box-wrap .box {background:#fff;border-radius:10px;padding:40px 20px;text-align:center;border: 1px solid #E5E5E5;}
.box-wrap .box .tit{color:#333;text-align: center;font-size: 24px;font-weight: 600;line-height: 140%;letter-spacing: -0.24px;margin-top: 40px;}
.box-wrap .box .txt{color: #555;text-align: center;font-size: 16px;font-weight: 400;line-height: 140%;letter-spacing: -0.16px;margin-top: 10px;}
.box-wrap .box .img-box{margin-bottom:20px}
.box-wrap .box .img-box img{max-width:100%;height:auto}

.case-img {margin-top: 24px;}
.case-swiper {margin-top: 40px;}
.case-swiper .swiper-pagination {bottom: 40px;}
.case-swiper .swiper-pagination-bullet {width:8px;height:8px;border-radius:50%;background: rgba(0, 0, 0, 0.20);opacity:1;transition:all .3s;}
.case-swiper .swiper-pagination-bullet-active {width:29px;height:8px;border-radius:999px;background:#15418D;}

.case-slide .case-card {padding: 40px 50px 88px;border:1px solid #E5E5E5;border-radius:10px;background:#fff;}
.case-slide .case-badge {display:flex;align-items:center;justify-content:center;width:91px;height:31px;margin:0 auto;border-radius:999px;background:linear-gradient(-202deg,#00F0FF 0%,#18418E 100%);color: #FFF;text-align: center;font-size: 18px;font-weight: 600;line-height: 140%;letter-spacing: -0.18px;}
.case-slide .case-title {margin-top:10px;color:#333;text-align:center;font-size:24px;font-weight: 400;line-height: 140%;letter-spacing: -0.24px;}
.case-slide .case-title strong {font-weight: 600;}
.case-slide .case-content {display:flex;align-items:center;justify-content:flex-start;gap:21px;margin-top:40px;}
.case-slide .case-graph {flex:0 0 426px;}
.case-slide .case-graph img {display:block;max-width:100%;height:auto;}
.case-slide .case-arrow {flex:0 0 auto;}
.case-slide .case-arrow img {display:block;width:66px;height:auto;}
.case-slide .case-solution {text-align:left;}
.case-slide .solution-desc {margin-top:12px;color:#333;font-size:16px;word-break:keep-all;font-weight: 400;line-height: 140%;letter-spacing: -0.16px;}
.case-slide .solution-desc strong {font-weight:700;}
.case-slide .solution-title {position: relative;display: inline-block;color: #15418D;font-size: 24px;font-weight: 600;line-height: 140%;letter-spacing: -0.24px;z-index: 1;}
.case-slide .solution-title::after {content: "";position: absolute;	left: 0;bottom: 0px;width: 100%;height: 14px;background: #Dfedff;	z-index: -1;}


.case-slide.case-static {margin-top:24px;}
.case-slide.case-static .solution-desc ul li:not(:last-of-type) {margin-bottom: 6px;}
.case-slide.case-static .case-card {padding: 40px 50px;}
.case-slide.case-static .case-title .blue {color: #15418D !important;}

.case-slide.case-static {margin-top:24px;}
.case-slide.case-static .case-title .point {color:#15418D;font-weight:600;}
.case-slide.case-static .case-solution {max-width:404px;}

.case-slide.case-static .solution-desc {margin-top:16px;line-height:1.5;display: inline-block;}
.case-slide.case-static .solution-desc strong {font-weight:700;}
.solution-table {	margin-top:20px;}
.solution-table img {	display:block;	max-width:100%;	height:auto;}




/* ==========================
cont02
========================== */
.cont02 {background: #F8F8F8;}
.cont02 .tit-wrap {padding: 60px 0 30px;}
.smart-review-list {display:flex;gap:16px;}
.smart-review-item {display:flex;flex-direction:column;justify-content:flex-start;width:calc((100% - 32px) / 3);min-height:426px;padding:40px 36px;border-radius:10px;background:#fff;box-sizing:border-box;}
.smart-review-head {display:flex;align-items:center;justify-content:center;gap:20px;}
.smart-review-profile {flex:none;width:45px;height:49px;object-fit:contain;}
.smart-review-title {flex:1;margin:0;text-align:left;word-break:keep-all;color: #15418D;font-size: 18px;font-weight: 400;line-height: 140%;letter-spacing: -0.18px;}
.smart-review-title strong {font-weight:700;}
.smart-review-line {height:1px;margin:24px 0 24px;background:#DEDEDE;}
.smart-review-desc {margin:0;font-size:16px;font-weight:400;color:#555555;text-align:left;word-break:keep-all;line-height: 140%;letter-spacing: -0.16px;min-height: 247px;}
.smart-review-desc strong {font-weight: 700;}
.smart-review-name {padding-top:24px;font-size:14px;color:#555;text-align:right;word-break:keep-all;font-weight: 400;line-height: 150%;letter-spacing: -0.14px;}


/* ==========================
bottom
========================== */
.btm-txt {color: #FFF;text-align: center;font-size: 28px;font-weight: 400;line-height: 1.3;letter-spacing: -0.32px;background: #346AC2;padding: 40px 0;}
.btm-txt strong {color: #9CF3FF;font-size: 28px;font-weight: 700;line-height: 1.3;letter-spacing: -0.32px;}


/* ====================================================
   RESPONSIVE (Media Queries)
==================================================== */

/* ÅÂºí¸´ ÀÌÇÏ (1199px ÀÌÇÏ) */
@media (max-width:1199px){
    .r-txt{margin:16px auto 0;max-width:720px;}
    .inner {max-width: 720px;}

    .visual-wrap{padding:0;background:url("https://russeldata.megastudy.net/campus/images/russel/campus_common/2026/smart_report/v_bg_ta.png") no-repeat 0 0 / contain;background-position:top center}
    .visual-wrap .visual {margin:0 3%;}

    .visual-step {width: 205.33px;}
    .visual-btm-txt:after {bottom: 0px;height: 4px;}

    .box-wrap {gap:24px;max-width:720px;grid-template-rows:1fr;margin:0 auto;}
    .box-wrap .box {height:fit-content;}

    .case-slide .case-content {flex-direction: column;gap: 10px;}
    .case-slide .case-arrow {transform: rotate(90deg);}
    .case-slide .case-solution {width: 100%;text-align: center;}

    .case-slide.case-static .solution-wrap {display: flex;justify-content: center;}
    .case-slide.case-static .solution-desc {display: inline-flex;justify-content: center;flex-direction: column;max-width: 380px;width: 100%;display: flow;}
    .case-slide.case-static .solution-desc ul {text-align: left;width: 100%;max-width: 380px;}
    .case-slide.case-static .case-solution {display: flex;justify-content: center;flex-direction: column;align-items: center;}

    /* .case-slide .case-graph {flex: 0 0 auto;width: 426px;} */
    .case-slide .case-graph {flex: unset;width: 100%;max-width: 426px;display: flex;justify-content: center;align-items: center;}

    .smart-review-list {flex-direction:column;}
    .smart-review-item {width:100%;min-height:unset;}
    .smart-review {max-width:720px;margin:0 auto;}
    .smart-review-desc {min-height:unset;}
}


/* ¸ð¹ÙÀÏ ÀÌÇÏ (767px ÀÌÇÏ) */
@media (max-width: 767px) {
     *[class^="cont0"] { padding: 0 0 clamp(40px, calc(40px + (60 - 40) * ((100vw - 360px) / 840)), 60px); }
    .inner {padding: 0 4%;}
    .r-txt{margin-top: 12px;font-size: clamp(13px, calc(13px + (14 - 13) * ((100vw - 360px) / 840)), 14px);}

    .visual-wrap {background: url("https://russeldata.megastudy.net/campus/images/russel/campus_common/2026/smart_report/v_bg_mo.png") no-repeat 0 0 / contain;background-position: top center;}
    .visual-wrap .visual {margin:0;padding-top:  clamp(50px, calc(50px + (80 - 50) * ((100vw - 360px) / 840)), 80px);}

    .visual-logo img {width: calc(320vw / 3.6);}
    .visual-top-txt {font-size: clamp(18px, calc(18px + (26 - 18) * ((100vw - 360px) / 840)), 26px);}
    .visual-desc {font-size: clamp(20px, calc(20px + (24 - 20) * ((100vw - 360px) / 840)), 24px);margin-top: clamp(40px, calc(40px + (60 - 40) * ((100vw - 360px) / 840)), 60px);    }
    .visual-btm-txt {font-size: clamp(22px, calc(22px + (28 - 22) * ((100vw - 360px) / 840)), 28px);}
    .visual-step-txt {font-size: clamp(16px, calc(16px + (20 - 16) * ((100vw - 360px) / 840)), 20px);}
    .visual-step {width: 100%;max-width: 96px;height: 134px;}
    .visual-step-wrap {gap: 4px;margin: 24px 4% 0;}
    .visual-step-plus {font-size: 24px;}

    .box-wrap {grid-template-rows: 1fr;    grid-template-columns: 1fr;    gap: 16px;;}
    .box-wrap .box .img-box {width: 100%;max-width: 160px;margin: 0 auto;}
    .box-wrap .box {padding: 28px 20px;}
    .box-wrap .box .tit {font-size:clamp(20px, calc(20px + (24 - 20) * ((100vw - 360px) / 840)), 24px);margin-top: clamp(20px, calc(20px + (40 - 20) * ((100vw - 360px) / 840)), 40px);    }
    .box-wrap .box .txt {font-size:clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);}

    .tit-wrap {padding: clamp(40px, calc(40px + (60 - 40) * ((100vw - 360px) / 840)), 60px) 0 clamp(20px, calc(20px + (40 - 20) * ((100vw - 360px) / 840)), 40px);}
    .tit-wrap .num {font-size: clamp(18px, calc(18px + (22 - 18) * ((100vw - 360px) / 840)), 22px);}
    .tit-wrap .title {font-size: clamp(20px, calc(20px + (28 - 20) * ((100vw - 360px) / 840)), 28px);}
    .tit-wrap .desc {font-size: clamp(17px, calc(17px + (20 - 17) * ((100vw - 360px) / 840)), 20px);}
    
    .case-slide .case-card {padding: 28px 0 54px;}
    .case-slide .case-badge {font-size: clamp(14px, calc(14px + (18 - 14) * ((100vw - 360px) / 840)), 18px);width: 78px;height: 26px;}
    .case-slide .case-title {font-size: clamp(20px, calc(20px + (24 - 20) * ((100vw - 360px) / 840)), 24px);}
    .case-slide .solution-title {font-size: clamp(20px, calc(20px + (24 - 20) * ((100vw - 360px) / 840)), 24px);}
    .case-slide .solution-desc {font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);}
    .case-slide .case-arrow {width: 40px;}
    .case-slide .case-arrow img {width: 100%;}
    .case-swiper .swiper-pagination {bottom: 28px;}
    .case-slide.case-static .case-card {padding: 28px 0;}
    .case-slide.case-static .solution-desc {padding-left: 10px;}

    .point-graph {width: calc(327vw / 3.6);}
    .point-graph img {width: 100%;}

    .case-img {margin-top: clamp(16px, calc(16px + (24 - 16) * ((100vw - 360px) / 840)), 24px);}
    .cont02 .tit-wrap {padding: clamp(40px, calc(40px + (60 - 40) * ((100vw - 360px) / 840)), 60px) 0 clamp(20px, calc(20px + (30 - 20) * ((100vw - 360px) / 840)), 30px);}
    .smart-review-item {padding: clamp(28px, calc(28px + (40 - 28) * ((100vw - 360px) / 840)), 40px) clamp(24px, calc(24px + (36 - 24) * ((100vw - 360px) / 840)), 36px);}
    .smart-review-head {gap: clamp(12px, calc(12px + (20 - 12) * ((100vw - 360px) / 840)), 20px);}
    .smart-review-title {font-size: clamp(16px, calc(16px + (18 - 16) * ((100vw - 360px) / 840)), 18px);}
    .smart-review-desc {font-size: clamp(14px, calc(14px + (16 - 14) * ((100vw - 360px) / 840)), 16px);}
    .smart-review-name {font-size: clamp(13px, calc(13px + (14 - 13) * ((100vw - 360px) / 840)), 14px);}
    
    .btm-txt {font-size: clamp(17px, calc(17px + (28 - 17) * ((100vw - 360px) / 840)), 28px);padding: clamp(20px, calc(20px + (40 - 20) * ((100vw - 360px) / 840)), 40px) 0;}
    .btm-txt strong {font-size: clamp(17px, calc(17px + (28 - 17) * ((100vw - 360px) / 840)), 28px);}
    


}