@charset "utf-8";

/* ==========================================================================
   신선소비 약관 및 내용관리 기본 스킨 스타일 (Content & Policy Style)
   ========================================================================== */

#ctt {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 16px 16px 40px;
    background-color: transparent;
    box-sizing: border-box;
    font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #334155;
}

.ctt_admin {
    text-align: right;
    margin-bottom: 12px;
}

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

/* 상단 탭 네비게이션 */
.ctt_policy_tabs {
    display: flex;
    background-color: #F1F5F9;
    border-radius: 12px;
    padding: 4px;
    margin-bottom: 20px;
    gap: 4px;
}

.ctt_policy_tab_btn {
    flex: 1;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 13.5px;
    font-weight: 600;
    color: #64748B;
    text-decoration: none;
    border-radius: 9px;
    transition: all 0.2s ease;
}

.ctt_policy_tab_btn:hover {
    color: #0F172A;
}

.ctt_policy_tab_btn.is_active {
    background-color: #FFFFFF;
    color: #FF5A00;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* 본문 카드 영역 */
#ctt_con {
    background-color: #FFFFFF;
    border: 1px solid #ECEEF2;
    border-radius: 16px;
    padding: 24px 18px;
    box-sizing: border-box;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
    line-height: 1.85;
    font-size: 13.5px;
}

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

.ctt_img {
    text-align: center;
}

/* h2 제목과 위아래 공간 */
#ctt_con h2 {
    font-size: 15.5px;
    font-weight: 800;
    color: #0F172A;
    margin: 36px 0 14px 0;
    padding-bottom: 10px;
    border-bottom: 1.5px solid #F1F5F9;
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: -0.02em;
    line-height: 1.4;
}

#ctt_con h2:first-of-type,
#ctt_con > h2:first-child {
    margin-top: 4px;
}

#ctt_con h2::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 16px;
    background-color: #FF5A00;
    border-radius: 2px;
    flex-shrink: 0;
}

/* 본문 문단 */
#ctt_con p {
    font-size: 13.5px;
    line-height: 1.9;
    color: #475569;
    margin: 0 0 14px 0;
    word-break: keep-all;
    letter-spacing: -0.015em;
}

#ctt_con p strong,
#ctt_con strong {
    color: #0F172A;
    font-weight: 700;
}

/* ol 리스트 (숫자가 왼쪽에 붙지 않고 시원하고 정확한 들여쓰기와 상하 간격) */
#ctt_con ol {
    list-style: none !important;
    counter-reset: policy-ol-count;
    padding-left: 0 !important;
    margin: 12px 0 18px 0 !important;
}

#ctt_con ol > li {
    position: relative !important;
    padding-left: 28px !important;
    font-size: 13.5px;
    line-height: 1.9;
    color: #475569;
    margin-bottom: 12px;
    word-break: keep-all;
    letter-spacing: -0.015em;
}

#ctt_con ol > li:last-child {
    margin-bottom: 0;
}

#ctt_con ol > li::before {
    counter-increment: policy-ol-count;
    content: counter(policy-ol-count) ".";
    position: absolute;
    left: 4px;
    top: 0;
    font-weight: 800;
    color: #0F172A;
    font-size: 13.5px;
    width: 20px;
    text-align: left;
}

/* ul 불릿 리스트 */
#ctt_con ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 12px 0 18px 0 !important;
}

#ctt_con ul > li {
    position: relative !important;
    padding-left: 18px !important;
    font-size: 13.5px;
    line-height: 1.85;
    color: #475569;
    margin-bottom: 8px;
    word-break: keep-all;
    letter-spacing: -0.015em;
}

#ctt_con ul > li:last-child {
    margin-bottom: 0;
}

#ctt_con ul > li::before {
    content: '•';
    position: absolute;
    left: 2px;
    top: -1px;
    color: #FF5A00;
    font-size: 15px;
    font-weight: bold;
}

/* 표 (Table) 디자인 */
#ctt_con table,
#ctt_con .table_policy {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 16px 0 20px 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 1px solid #E2E8F0 !important;
    font-size: 12.5px;
    text-align: left;
    background-color: #FFFFFF;
}

#ctt_con table th,
#ctt_con table td,
#ctt_con .table_policy th,
#ctt_con .table_policy td {
    padding: 12px 14px !important;
    border-bottom: 1px solid #E2E8F0 !important;
    border-right: 1px solid #E2E8F0 !important;
    line-height: 1.65;
    word-break: keep-all;
}

#ctt_con table th:last-child,
#ctt_con table td:last-child,
#ctt_con .table_policy th:last-child,
#ctt_con .table_policy td:last-child {
    border-right: none !important;
}

#ctt_con table tr:last-child td,
#ctt_con .table_policy tr:last-child td {
    border-bottom: none !important;
}

#ctt_con table th,
#ctt_con .table_policy th {
    background-color: #F8FAFC !important;
    font-weight: 700 !important;
    color: #0F172A !important;
    white-space: nowrap;
}

#ctt_con table td,
#ctt_con .table_policy td {
    color: #475569 !important;
}

/* 강조 콜아웃 박스 */
#ctt_con .policy_box_highlight,
#ctt_con .policy_callout {
    background-color: #FFF9F5 !important;
    border: 1px solid #FFEFE5 !important;
    border-left: 4px solid #FF5A00 !important;
    border-radius: 0 12px 12px 0 !important;
    padding: 16px 18px !important;
    margin: 20px 0 !important;
    font-size: 13px !important;
    color: #9A3412 !important;
    line-height: 1.8 !important;
    word-break: keep-all !important;
}

#ctt_con .policy_box_highlight strong,
#ctt_con .policy_callout strong {
    color: #7C2D12 !important;
    font-weight: 700 !important;
}

@media (max-width: 480px) {
    #ctt {
        padding: 14px 12px 40px;
    }
    #ctt_con {
        padding: 20px 14px;
    }
    #ctt_con h2 {
        font-size: 14.5px;
        margin-top: 28px;
    }
    #ctt_con p,
    #ctt_con ol > li,
    #ctt_con ul > li {
        font-size: 13px;
    }
    #ctt_con ol > li {
        padding-left: 24px !important;
    }
}