@charset "utf-8";

/* 내용관리 */
#container {
    padding-top: 0px;
}

#ctt {
    background: #fff
}

.ctt_admin {
    text-align: right
}

#ctt header h1 {
    position: absolute;
    font-size: 0;
    line-height: 0;
    overflow: hidden
}

#ctt_con {
    margin: 80px auto;
    padding: 0px 10px;
    max-width: 1440px;
    width: 100%;
}

#ctt_con img {
    max-width: 100%;
    height: auto
}

.ctt_img {
    text-align: center
}
.sc-wrap {max-width: 1440px;margin: 0 auto;}
 
/* 타이틀 */
.sc-header { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.sc-header-icon {width: 30px;height: 30px;background: #1346d4;border-radius: 5px;display: flex;align-items: center;justify-content: center;flex-shrink: 0;}
.sc-header-icon svg { width: 20px; height: 20px; fill: #ffffff; }
.sc-header b {font-size: 20px;font-weight: 700;color: #1a2f5e;letter-spacing: -0.02em;}
 
/* 안내박스 */
.sc-notice {background: #ffffff;border: 2px dashed #d8dff0;/* border-left: 4px solid #1346d4; */padding: 16px 20px;margin-bottom: 40px;}
.sc-notice ul { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.sc-notice ul li { padding-left: 8px; position: relative; font-size: 13px; color: #444444; line-height: 1.6; }
.sc-notice ul li::before { content: ""; display:block; width:3px; height:3px; position: absolute; left: 0; background: #ddd; font-weight: 700; top:8px; border-radius:5px;}
 
/* 출결 섹션 */
.sc-absence { margin-bottom: 40px; }
.sc-absence-note { font-size: 14px; color: #e05050; font-weight: 600; margin-bottom: 10px; }
.sc-absence-row { display: flex; align-items: stretch; border: 1px solid #d0d7e8; overflow: hidden; background: #ffffff; }
.sc-absence-label { background: #eaeaea; color: #1a2f5e; font-weight: 600; font-size: 13px; display: flex; align-items: center; justify-content: center; padding: 12px 20px; min-width: 130px; border-right: 1px solid #d0d7e8; white-space: nowrap; }
.sc-absence-input { flex: 1; border: none; outline: none; padding: 12px 16px; font-size: 14px; font-family: inherit; color: #222222; background: #ffffff; }
.sc-absence-input::placeholder { color: #bbbbbb; }
.sc-absence-input:focus {border:none;}
 
/* 모두 A 버튼 */
.sc-btn-wrap { margin-bottom: 16px; }
.sc-btn-a { background: #ffffff; border: 1.5px solid #3a5bbf; color: #3a5bbf; font-size: 13px; font-weight: 600; padding: 8px 20px; border-radius: 6px; cursor: pointer; font-family: inherit; transition: all 0.15s; }
.sc-btn-a:hover { background: #3a5bbf; color: #ffffff; }
 
/* ===== PC 테이블 ===== */
.sc-table-wrap { overflow-x: auto; margin-bottom: 40px; }
.sc-table { width: 100%; border-collapse: collapse; background: #ffffff; border: 1px solid #d0d7e8; overflow: hidden; }
.sc-table thead tr th { background: #3a5bbf; color: #fff; font-size: 15px; font-weight: 700; padding: 11px 8px; text-align: center;border-right: 1px solid #eaeaea; white-space: nowrap; }
.sc-table thead tr th:last-child { border-right: none; }
.sc-table tbody td { padding: 10px 8px; text-align: center; border-right: 1px solid #eaeaea; vertical-align: middle; border-bottom:solid 1px #eaeaea;}
.sc-table tbody td:first-child { border-left:solid 1px #eaeaea; }
.sc-table tbody td.sc-semester { color: #3a5bbf; font-weight: 700; font-size: 13px; line-height: 1.4; }
.sc-table tbody td.sc-semester label { display: flex; flex-direction: column; align-items: center; gap: 4px; cursor: pointer; font-size:16px;}
.sc-table tbody td.sc-semester input[type="checkbox"] {width: 14px;height: 14px;accent-color: #3a5bbf;cursor: pointer;outline: inherit;-webkit-appearance: auto;}
.sc-table tbody td.sc-semester small { font-size: 11px; color: #888888; font-weight: 400; }
.sc-table select {border: 1px solid #d0d7e8;border-radius: 4px;padding: 5px 6px;font-size: 13px;font-family: inherit;color: #333333;background: #ffffff;cursor: pointer;width: 72px;outline: none;appearance: inherit;-webkit-appearance: auto;-moz-appearance: unset;text-align: left;}
.sc-table select:focus { border-color: #3a5bbf; }
.sc-table select:disabled { background: #f0f0f0; color: #aaaaaa; cursor: not-allowed; }
 
/* ===== 모바일 카드 (숨김) ===== */
.sc-mobile { display: none; }
 
/* ===== 결과조회 버튼 ===== */
.sc-submit-wrap { text-align: center; margin-bottom: 32px; }
.sc-submit { background: #3a5bbf; color: #ffffff; font-size: 15px; font-weight: 700; padding: 14px 80px; border: none; border-radius: 8px; cursor: pointer; font-family: inherit; transition: background 0.15s; letter-spacing: 0.02em; }
.sc-submit:hover { background: #2a4aaa; }
 
/* ===== 결과 박스 ===== */
.sc-result { display: none; background: #ffffff; border: 2px solid #3a5bbf; border-radius: 10px; padding: 28px 32px; margin-bottom: 20px; }
.sc-result.show { display: block; }
.sc-result-title { font-size: 15px; font-weight: 700; color: #1a2f5e; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid #e8eaf2; }
.sc-result-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.sc-result-item { background: #f4f6fb; border-radius: 8px; padding: 14px; text-align: center; }
.sc-result-item .ri-label { font-size: 12px; color: #888888; margin-bottom: 4px; }
.sc-result-item .ri-val { font-size: 20px; font-weight: 700; color: #1a2f5e; }
.sc-result-item .ri-max { font-size: 11px; color: #aaaaaa; }
.sc-result-total { background: #1a2f5e; border-radius: 8px; padding: 18px 24px; display: flex; align-items: center; justify-content: space-between; }
.sc-result-total .rt-label { color: #a8c0e8; font-size: 14px; font-weight: 600; }
.sc-result-total .rt-score { color: #ffffff; font-size: 28px; font-weight: 700; }
.sc-result-total .rt-max { color: #a8c0e8; font-size: 14px; }
.sc-result-detail { margin-top: 16px; font-size: 12px; color: #888888; line-height: 1.8; }
 
/* ===== 반응형: 768px 이하 모바일 카드 ===== */
@media (max-width: 768px) {
  .sc-table-wrap { display: none; }
  .sc-mobile { display: block; margin-bottom: 28px; }
 
  .sc-mob-semester { background: #ffffff; border: 1px solid #d0d7e8; overflow: hidden; margin-bottom: 14px; }
  .sc-mob-head { background: #eef1fa; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #d0d7e8; }
  .sc-mob-head-title { font-size: 14px; font-weight: 700; color: #3a5bbf; }
  .sc-mob-head-check { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #333; }
  .sc-mob-head-check input { accent-color: #3a5bbf;outline: inherit;-webkit-appearance: auto; width:16px; height:16px; }
  .sc-mob-body { padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
  .sc-mob-row { display: flex; align-items: center; justify-content: space-between; }
  .sc-mob-label { font-size: 13px; color: #444444; font-weight: 500; }
  .sc-mob-select { border: 1px solid #d0d7e8; padding: 6px 10px; font-size: 13px; font-family: inherit; color: #333333; background: #ffffff; cursor: pointer; min-width: 90px; outline: none; appearance: inherit;-webkit-appearance: auto;-moz-appearance: unset;text-align: left;}
  .sc-mob-select:focus { border-color: #3a5bbf; }
  .sc-mob-select:disabled { background: #f0f0f0; color: #aaaaaa; }
 
  .sc-result-grid { grid-template-columns: 1fr 1fr; }
  .sc-submit { padding: 14px 48px; width: 100%; max-width: 320px; }
  .sc-absence-label { min-width: 100px; font-size: 12px; padding: 10px 12px; }
    .sc-absence-row {
        display:flex;
        flex-direction:column;
        justify-items:center;
        width:100%;
        text-align:center;
        height:100%;
    }
    .sc-result {
        padding:25px 20px;
    }
}
 
@media (max-width: 480px) {
  .sc-header b { font-size: 16px; }
  .sc-header i { font-size: 16px; }
  .sc-result-grid { grid-template-columns: 1fr 1fr; }
  .sc-result-total { flex-direction: column; gap: 4px; text-align: center; }
}