/* ==========================
   COMMON
========================== */
:root {
   --key-color: #2C5BF6;
   --font-color2: #222;
   --font-color3: #333;
   --font-p: font-family: 'Pretendard';
   --font-pv: font-family: "Pretendard Variable";
   --border-color: #E5E5E5;
}

* {font-family: var(--font-pv); color: var(--font-color3); margin: 0; padding: 0; box-sizing: border-box; word-break: keep-all; overflow-wrap: break-word; white-space: normal;}
.content-wrap {width: 100%; max-width: 1200px; margin: 0 auto;}
.mblue {color: #2C5BF6;}
.red {color: #FF3935}
.bg-bluue {background-color: #F1F6FF;}

/* =====================
   Å×À̺í SECTION
===================== */
.table-box .tonly-pc-ta {display:table-cell}
.table-wrap .tonly-mo {display: none ;}
.table-box colgroup .col-1 { width: 12.5%;} .table-box colgroup .col-2 { width: 60.83%;} .table-box colgroup .col-3 { width: 13.33%;} .table-box colgroup .col-4 { width: 13.33%;}
.table-wrap h3 {color:#101010; font-size: 24px; font-style: normal; font-weight: 700; line-height: 130%; letter-spacing: -0.24px;}
.table-wrap p {color:#777; font-size: 13px; font-style: normal; font-weight: 400; line-height: 150%; letter-spacing: -0.13px;}
.table-wrap h3 + p {text-align: right;}

.table-box {border-collapse: collapse; border-left: none; border-right: none;}
.table-box th {border: 1px solid var(--border-color);}
.table-box td {text-align: center; border: 1px solid var(--border-color);}
.table-box tr {height: 56px;}
.table-box thead {background-color: #F5F5F5; justify-content: center; align-items: center;}
.table-box thead tr th {color: var(--font-color3); text-align: center; font-size: 14px; font-style: normal; font-weight: 700; line-height: 140%; letter-spacing: -0.14px;}
.table-box tr > *:first-child {border-left: none;}
.table-box tr > *:last-child {border-right: none;}
.table-box tbody tr th { leading-trim: both; text-edge: cap; font-size: 14px; font-style: normal; font-weight: 600; line-height: 140%; letter-spacing: -0.14px; text-transform: uppercase;}
.table-box tbody tr td { text-align: center; font-size: 14px; font-style: normal; font-weight: 400; line-height: 140%; letter-spacing: -0.14px; padding: 8px 20px;}
.table-box tbody tr td span.mblue {font-weight: 500;}
.table-box tbody tr td span.t-sm-font {color: #555; font-size: 13px; font-style: normal; font-weight: 400; line-height: 140%; letter-spacing: -0.13px;}

.mock-wrap {margin-top: clamp(40px, calc(40px + (80 - 40) * ((100vw - 360px) / 840)), 80px);}
.mock-wrap > h3 {display: flex; align-items: center; gap: 12px;}
.mock-wrap > h3 img{width: 30.378px;height: 30px;aspect-ratio: 30.38/30.00;}
.mock-wrap > h3 span {color:  #101010; font-size: 24px; font-style: normal; font-weight: 700; line-height: 130%; letter-spacing: -0.24px;}

.mock-wrap .mock-card-box {display: flex; gap: 10px; margin-top: 24px;}
.mock-wrap .mock-card-box li {display: flex; flex-direction: column; width: calc(100% / 6); text-align: center; align-items: center; border: 1px solid #E5E5E5; border-radius: 6px;}
.mock-wrap .mock-card-box li h3 {display: flex; width: 100%; min-height: 50px; align-items: center; justify-content: center; color: #333; font-size: 14px; font-style: normal; font-weight: 700; line-height: 140%; letter-spacing: -0.14px; border-bottom: 1px solid #e5e5e5; background-color: #F5F5F5;}
.mock-wrap .mock-card-box li p {display: flex; height: 64px; align-items: center; color: #555; leading-trim: both; text-edge: cap; font-size: 14px; font-style: normal; font-weight: 600; line-height: 140%; letter-spacing: -0.14px; text-transform: uppercase;}
.mock-wrap .mock-card-box + p {color:#777; font-size: 13px; font-style: normal; font-weight: 400; line-height: 150%; letter-spacing: -0.13px; margin-top: clamp(16px, calc(16px + (20 - 16) * ((100vw - 360px) / 840)), 20px);; margin-bottom: 90px;}

.title-mt {margin-top: clamp(40px, calc(40px + (80 - 40) * ((100vw - 360px) / 840)), 80px);}
.must td {border-right:none;}
/* ÃÖ»óÀ§±Ç */
.russel_hs .table-box tbody tr td {text-align: left;}
.russel_hs .mock-wrap .mock-card-box li {width: calc(100% / 5);}
/* ====================================================
   RESPONSIVE (Media Queries)
==================================================== */

/* ÅÂºí¸´ ÀÌÇÏ (1199px ÀÌÇÏ) */
@media (max-width: 1199px) {
   * {word-break: break-all;}
   .content-wrap {padding: 0 24px;}
   .table-wrap .tonly-mo {display: none ;}
   .table-box colgroup .col-1 { width: 16.66%;}.table-box colgroup .col-2 { width: 52.77%;}.table-box colgroup .col-3 { width: 13.88%;}.table-box colgroup .col-4 { width: 16.66%;}
   .table-box tbody > tr .tonly-pc-ta {padding: 8px;}

   .mock-wrap .mock-card-box {flex-wrap: wrap;}
   .mock-wrap .mock-card-box li {width: calc(100% / 3 - 6.7px);}
   .mock-wrap .mock-card-box + p {margin-bottom: 50px;}

   /* ÃÖ»óÀ§±Ç */
   .russel_hs .mock-wrap .mock-card-box li {width: calc(100% / 3 - 6.7px);}
}

/* ¸ð¹ÙÀÏ ÀÌÇÏ (767px ÀÌÇÏ) */
@media (max-width: 767px) {
   .content-wrap {padding: 0 16px;}
   .table-wrap h3 {margin-top: 30px; font-size: clamp(18px, calc(18px + (24 - 18) * ((100vw - 360px) / 840)), 24px);}
   .table-wrap h3 + p {margin-top: 20px;}
   .table-wrap p {font-size: 12px; letter-spacing: -0.12px;}
   .table-wrap .tonly-mo {display: table-row ;}
   .table-wrap .br-none-mo {border-right: none !important;}

   .table-box .tonly-pc-ta {display: none;}
   .table-box .tonly-mo .m_span {text-align: left;}
   .table-box colgroup .col-1 { width: 21.34%;}.table-box colgroup .col-2 { width: 54.26%;}.table-box colgroup .col-3 { width: 24.39%;}
   .table-box tbody tr td {padding: 8px;}

   .mock-wrap .mock-card-box + p {font-size: 12px; letter-spacing: -0.12px; margin-bottom: 30px;}
   .mock-wrap > h3 img { width: clamp(24px, calc(24px + (30 - 24) * ((100vw - 360px) / 840)), 30px); height: clamp(24px, calc(24px + (30 - 24) * ((100vw - 360px) / 840)), 30px);}
   .mock-wrap h3 span {font-size: clamp(18px, calc(18px + (24 - 18) * ((100vw - 360px) / 840)), 24px);}

   .russel_hs .mock-wrap .mock-card-box li h3 {padding: 16px; height: 80px;}
}