@charset "UTF-8";
/* ────────────────────────────────
    reset
──────────────────────────────── */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
*::after, *::before {
    box-sizing: border-box;
}

html {
    font-family: var(--font-base);
    font-size: var(--font-size);
    color: var(--color-text);
    background-color: var(--color-background);
}

body {
    font-size: var(--font-base-size);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    background-color: var(--color-background);
    overflow-x: hidden;
}

ol,
ul {
    list-style: none;
}
ol::after,
ul::after {
    content: "";
    display: block;
    clear: both;
}

button {
    all: unset;
    cursor: pointer;
    box-sizing: border-box;
}

img,
svg,
picture,
video,
canvas,
iframe,
textarea {
    display: block;
    max-width: 100%;
}

img {
    vertical-align: top;
}

input,
button,
textarea,
select {
    font: inherit;
}

input {
    appearance: none;
    border-radius: none;
    outline: none;
    border-radius: 0;
    border: none;
}
input::-ms-clear {
    display: none;
}

input {
    color: var(--color-text);
    background-color: var(--color-background);
}
input::-webkit-search-decoration, input::-webkit-search-cancel-button, input::-webkit-search-results-button, input::-webkit-search-results-decoration {
    display: none;
}

input[type=text],
input[type=password],
input[type=submit],
input[type=search],
input[type=tel],
input[type=email],
html input[type=button],
input[type=reset] {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    outline: 0;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

input[type=number] {
    -moz-appearance: textfield;
}

select {
    appearance: none;
    outline: none;
    border-radius: 0;
    color: var(--color-text);
    background-color: var(--color-background);
}
select::-ms-expand {
    display: none;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word;
}

a {
    color: inherit;
    text-decoration: none;
    display: inline-block;
}

[onclick] {
    cursor: pointer;
}

span {
    display: inline-block;
}

/* ────────────────────────────────
    variable
──────────────────────────────── */
/* ────────────────────────────────
    function
──────────────────────────────── */
/* ────────────────────────────────
    mixins
──────────────────────────────── */
/* ────────────────────────────────
    root
──────────────────────────────── */
:root {
    --font-size: 62.5%;
    --font-base: "Pretendard";
    --font-base-size: 1.6rem;
    --color-primary: #ff7b00;
    --color-primary-contrast: #fff;
    --color-text: #111111;
    --color-text-white: #ffffff;
    --color-disabled: #999999;
    --color-sub-1: #505050;
    --color-sub-2: #767676;
    --color-border: #e0e0e0;
    --color-border-2: #ededed;
    --color-background: #ffffff;
    --color-gray-50: #fafafa;
    --color-gray-100: #f5f5f5;
    --color-gray-200: #eeeeee;
    --color-gray-300: #e0e0e0;
    --color-gray-400: #bdbdbd;
    --color-gray-500: #9e9e9e;
    --color-gray-600: #757575;
    --color-gray-700: #616161;
    --color-gray-800: #424242;
    --color-gray-900: #212121;
    --z-index-loading: 100;
    --z-index-popover: 99;
    --z-index-modal: 99;
    --z-index-header: 98;
    --transition-duration: 0.2s;
    --size-header-height: 8rem;
    --size-layout-container: 192rem;
    --size-layout-content: 112rem;
}
@media screen and (max-width: 767px) {
    :root {
        --font-size: 50%;
    }
}

/* ────────────────────────────────
    fonts
──────────────────────────────── */
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-Thin.woff2") format("woff2");
    font-weight: 100;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-ExtraLight.woff2") format("woff2");
    font-weight: 200;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-Light.woff2") format("woff2");
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-Regular.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-Medium.woff2") format("woff2");
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-Bold.woff2") format("woff2");
    font-weight: 700;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-ExtraBold.woff2") format("woff2");
    font-weight: 800;
    font-display: swap;
}
@font-face {
    font-family: "Pretendard";
    src: url("../fonts/Pretendard/Pretendard-Black.woff2") format("woff2");
    font-weight: 900;
    font-display: swap;
}
@font-face {
    font-family: "Paperlogy";
    src: url("../fonts/Paperlogy/Paperlogy-8ExtraBold.woff2") format("woff2"), url("../fonts/Paperlogy/Paperlogy-8ExtraBold.woff") format("woff");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Paperlogy";
    src: url("../fonts/Paperlogy/Paperlogy-6SemiBold.woff2") format("woff2"), url("../fonts/Paperlogy/Paperlogy-6SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
/* ────────────────────────────────
    color
──────────────────────────────── */
.color-primary {
    color: var(--color-primary);
}

/* ────────────────────────────────
    icon
──────────────────────────────── */
/* ────────────────────────────────
    common
──────────────────────────────── */
body.modal-open {
    overflow-y: hidden;
}

.logo a {
    width: 13.1rem;
    height: 2.2rem;
    position: relative;
}

.line-clamp {
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    text-align: left;
}
.line-clamp.show {
    max-width: none !important;
}
.line-clamp.line-2 {
    -webkit-line-clamp: 2;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.section-test {
    width: 100%;
    height: 100vh;
    overflow: hidden;
}
.section-test .section-container {
    width: 1920px;
    height: 1080px;
    transform-origin: top left;
}

/* ────────────────────────────────
    animation
──────────────────────────────── */
@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
/* ────────────────────────────────
    grid
──────────────────────────────── */
.grid-container {
    display: grid;
    gap: var(--gap-layout);
    grid-template-columns: repeat(12, minmax(0, 1fr));
}
.grid-container .grid-item.grid-item-row-1 {
    grid-row: span 1;
}
.grid-container .grid-item.grid-item-row-2 {
    grid-row: span 2;
}
.grid-container .grid-item.grid-item-row-3 {
    grid-row: span 3;
}
.grid-container .grid-item.grid-item-row-4 {
    grid-row: span 4;
}
.grid-container .grid-item.grid-item-row-5 {
    grid-row: span 5;
}
.grid-container .grid-item.grid-item-row-6 {
    grid-row: span 6;
}
.grid-container .grid-item.grid-item-row-7 {
    grid-row: span 7;
}
.grid-container .grid-item.grid-item-row-8 {
    grid-row: span 8;
}
.grid-container .grid-item.grid-item-row-9 {
    grid-row: span 9;
}
.grid-container .grid-item.grid-item-row-10 {
    grid-row: span 10;
}
.grid-container .grid-item.grid-item-row-11 {
    grid-row: span 11;
}
.grid-container .grid-item.grid-item-row-12 {
    grid-row: span 12;
}
.grid-container .grid-item.grid-item-column-1 {
    grid-column: span 1;
}
.grid-container .grid-item.grid-item-column-2 {
    grid-column: span 2;
}
.grid-container .grid-item.grid-item-column-3 {
    grid-column: span 3;
}
.grid-container .grid-item.grid-item-column-4 {
    grid-column: span 4;
}
.grid-container .grid-item.grid-item-column-5 {
    grid-column: span 5;
}
.grid-container .grid-item.grid-item-column-6 {
    grid-column: span 6;
}
.grid-container .grid-item.grid-item-column-7 {
    grid-column: span 7;
}
.grid-container .grid-item.grid-item-column-8 {
    grid-column: span 8;
}
.grid-container .grid-item.grid-item-column-9 {
    grid-column: span 9;
}
.grid-container .grid-item.grid-item-column-10 {
    grid-column: span 10;
}
.grid-container .grid-item.grid-item-column-11 {
    grid-column: span 11;
}
.grid-container .grid-item.grid-item-column-12 {
    grid-column: span 12;
}
.grid-container .grid-item .card {
    height: 100%;
}
@media screen and (max-width: 767px) {
    .grid-container .grid-item.grid-item-column-1, .grid-container .grid-item.grid-item-column-2, .grid-container .grid-item.grid-item-column-3, .grid-container .grid-item.grid-item-column-4, .grid-container .grid-item.grid-item-column-5 {
        grid-column: span 6;
    }
    .grid-container .grid-item.grid-item-column-6, .grid-container .grid-item.grid-item-column-7, .grid-container .grid-item.grid-item-column-8, .grid-container .grid-item.grid-item-column-9, .grid-container .grid-item.grid-item-column-10, .grid-container .grid-item.grid-item-column-11, .grid-container .grid-item.grid-item-column-12 {
        grid-column: span 12;
    }
    .grid-container .grid-item.grid-item-column-mobile-1 {
        grid-column: span 1;
    }
    .grid-container .grid-item.grid-item-column-mobile-2 {
        grid-column: span 2;
    }
    .grid-container .grid-item.grid-item-column-mobile-3 {
        grid-column: span 3;
    }
    .grid-container .grid-item.grid-item-column-mobile-4 {
        grid-column: span 4;
    }
    .grid-container .grid-item.grid-item-column-mobile-5 {
        grid-column: span 5;
    }
    .grid-container .grid-item.grid-item-column-mobile-6 {
        grid-column: span 6;
    }
    .grid-container .grid-item.grid-item-column-mobile-7 {
        grid-column: span 7;
    }
    .grid-container .grid-item.grid-item-column-mobile-8 {
        grid-column: span 8;
    }
    .grid-container .grid-item.grid-item-column-mobile-9 {
        grid-column: span 9;
    }
    .grid-container .grid-item.grid-item-column-mobile-10 {
        grid-column: span 10;
    }
    .grid-container .grid-item.grid-item-column-mobile-11 {
        grid-column: span 11;
    }
    .grid-container .grid-item.grid-item-column-mobile-12 {
        grid-column: span 12;
    }
}

/* ────────────────────────────────
    header
──────────────────────────────── */
@keyframes mainHeader {
    0% {
        top: calc(-1 * var(--size-header-height));
        opacity: 0;
        pointer-events: none;
    }
    100% {
        top: 0;
        opacity: 1;
        pointer-events: auto;
    }
}
.header {
    width: 100%;
    height: var(--size-header-height);
    position: fixed;
    left: 0;
    top: calc(-1 * var(--size-header-height));
    background-color: #ffffff01;
    border-bottom: 1px solid #e0e0e020;
    backdrop-filter: blur(4px);
    z-index: var(--z-index-header);
    transition: var(--transition-duration);
}
.header[data-theme=hidden] {
    opacity: 0;
    pointer-events: none;
}
.header[data-theme=main] {
    opacity: 0;
    pointer-events: none;
    animation: mainHeader 1s ease forwards;
    animation-delay: 6s;
}
.header[data-theme=dark] {
    top: 0;
}
.header[data-theme=light] {
    top: 0;
    background-color: #ffffff10;
    border-color: var(--color-gray-300);
    backdrop-filter: blur(12px);
}
.header[data-theme=light] .header-container .logo .logo-img[data-theme=default] {
    opacity: 0;
}
.header[data-theme=light] .header-container .logo .logo-img[data-theme=light] {
    opacity: 1;
}
.header[data-theme=light] .header-container .gnb ul li a {
    color: var(--color-text);
}
.header .header-container {
    width: 100%;
    max-width: var(--size-layout-container);
    height: 100%;
    position: relative;
    margin: 0 auto;
    padding: 0 10rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.header .header-container .logo {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    position: absolute;
    left: 10rem;
}
.header .header-container .logo .logo-img {
    position: absolute;
    opacity: 0;
    transition: var(--transition-duration);
}
.header .header-container .logo .logo-img[data-theme=default] {
    opacity: 1;
}
.header .header-container .gnb ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6.6rem;
}
.header .header-container .gnb ul::after {
    display: none;
}
.header .header-container .gnb ul li a {
    height: 8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text-white);
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    transition: var(--transition-duration);
}
.header .header-container .gnb ul li a:hover, .header .header-container .gnb ul li a.active {
    font-weight: 600;
    color: var(--color-primary);
    border-color: var(--color-primary);
}
.header .header-container .gnb-button,
.header .header-container .gnb-active-layer {
    display: none;
}
@media screen and (max-width: 1439px) {
    .header .header-container {
        padding: 0 2rem;
    }
    .header .header-container .logo {
        left: 2rem;
    }
}
@media screen and (max-width: 1023px) {
    .header[data-theme=light] .header-container .gnb-button img[data-theme=default] {
        opacity: 0;
    }
    .header[data-theme=light] .header-container .gnb-button img[data-theme=light] {
        opacity: 1;
    }
    .header .header-container {
        justify-content: flex-end;
    }
    .header .header-container .gnb {
        width: 30rem;
        height: 100vh;
        height: 100dvh;
        position: fixed;
        right: -30rem;
        top: 0;
        background-color: #111;
        padding-top: var(--size-header-height);
        transition: var(--transition-duration);
    }
    .header .header-container .gnb.active {
        right: 0;
    }
    .header .header-container .gnb.active ~ .gnb-button img {
        opacity: 0 !important;
    }
    .header .header-container .gnb.active ~ .gnb-button img:last-child {
        opacity: 1 !important;
    }
    .header .header-container .gnb.active ~ .gnb-active-layer {
        opacity: 1;
        pointer-events: auto;
    }
    .header .header-container .gnb ul {
        width: 100%;
        height: 100%;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 0;
        padding: 0 2rem;
    }
    .header .header-container .gnb ul li {
        width: 100%;
    }
    .header .header-container .gnb ul li a {
        height: auto;
        color: var(--color-text-white) !important;
        padding: 2rem 0;
        justify-content: flex-start;
        border-bottom: 1px solid #ffffff10 !important;
    }
    .header .header-container .gnb ul li a.active {
        color: var(--color-primary) !important;
    }
    .header .header-container .gnb-button {
        width: 2.4rem;
        height: 2.4rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .header .header-container .gnb-button img {
        position: absolute;
        opacity: 0;
        transition: var(--transition-duration);
    }
    .header .header-container .gnb-button img[data-theme=default] {
        opacity: 1;
    }
    .header .header-container .gnb-active-layer {
        width: 100%;
        height: 100vh;
        height: 100dvh;
        background-color: #11111190;
        position: fixed;
        left: 0;
        top: 0;
        display: block;
        z-index: -1;
        opacity: 0;
        pointer-events: none;
        transition: var(--transition-duration);
    }
}

/* ────────────────────────────────
    main
──────────────────────────────── */
.main section:nth-of-type(1) {
    padding-top: 8rem;
}

/* ────────────────────────────────
    footer
──────────────────────────────── */
.footer {
    width: 100%;
    margin: 0 auto;
    padding: 4rem 10rem;
    background-color: #1e1e1e;
    color: var(--color-text-white);
}
.footer .footer-container {
    width: 100%;
    max-width: var(--size-layout-container);
}
.footer .footer-container .footer-content {
    display: flex;
    justify-content: space-between;
}
.footer .footer-container .footer-content .info {
    display: flex;
    gap: 4.8rem;
}
.footer .footer-container .footer-content .info .by {
    font-size: 2rem;
    font-weight: 400;
    color: var(--color-gray-600);
}
.footer .footer-container .footer-content .info .name {
    font-size: 2rem;
    font-weight: 600;
    color: var(--color-primary);
}
.footer .footer-container .footer-content .info .text {
    font-weight: 500;
    margin-top: 2rem;
}
.footer .footer-container .footer-content .nav ul {
    display: flex;
    gap: 3.8rem;
}
.footer .footer-container .footer-content .nav ul::after {
    display: none;
}
.footer .footer-container .footer-content .nav ul li {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 3.8rem;
}
.footer .footer-container .footer-content .nav ul li::after {
    content: "";
    display: block;
    width: 1px;
    height: 9px;
    background-color: var(--color-gray-600);
}
.footer .footer-container .footer-content .nav ul li:last-child::after {
    display: none;
}
.footer .footer-container .footer-content .nav ul li a {
    font-weight: 500;
}
.footer .footer-container .copyright {
    margin-top: 6rem;
    padding-top: 3rem;
    border-top: 1px solid #ffffff10;
    display: flex;
    justify-content: space-between;
}
.footer .footer-container .copyright .text {
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--color-gray-600);
}
.footer .footer-container .copyright img {
    width: 14rem;
}
@media screen and (max-width: 1439px) {
    .footer {
        padding: 4rem 2rem;
    }
    .footer .footer-container {
        max-width: 100%;
    }
}
@media screen and (max-width: 1023px) {
    .footer {
        padding: 0;
    }
    .footer .footer-container .footer-content {
        flex-direction: column;
    }
    .footer .footer-container .footer-content .nav {
        order: -1;
        border-bottom: 1px solid #ffffff10;
    }
    .footer .footer-container .footer-content .nav ul {
        gap: 0;
    }
    .footer .footer-container .footer-content .nav ul li {
        flex: 1;
        gap: 0;
    }
    .footer .footer-container .footer-content .nav ul li a {
        width: 100%;
        padding: 2rem 1rem;
        text-align: center;
    }
    .footer .footer-container .footer-content .info {
        padding: 4rem 2rem;
        flex-direction: column;
        gap: 0.6rem;
    }
    .footer .footer-container .copyright {
        padding: 4rem 2rem;
        margin-top: 0;
        flex-direction: column;
        gap: 1.2rem;
    }
    .footer .footer-container .copyright img {
        order: -1;
    }
}

/* ────────────────────────────────
    popup
──────────────────────────────── */
.popup-container {
    width: 100%;
    height: auto;
    position: relative;
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--gap-layout);
}
@media screen and (max-width: 767px) {
    .popup-container {
        align-items: flex-start;
    }
}

.popup-content {
    width: 100%;
    height: auto;
    position: relative;
    max-width: var(--size-container-width);
    background-color: var(--color-background);
    box-shadow: 0 0 10px rgba(var(--color-background-contrast), 0.1);
    border-radius: var(--radius-form);
    padding: var(--gap-section);
}
@media screen and (max-width: 767px) {
    .popup-content {
        box-shadow: none;
        padding: 0;
    }
}

/* ────────────────────────────────
    result
──────────────────────────────── */
.result-container {
    width: 100%;
    height: auto;
    position: relative;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--gap-section);
    padding: var(--gap-layout);
    text-align: center;
}
.result-container .result-code {
    width: 20rem;
    height: 20rem;
    border-radius: 50%;
    background-color: var(--color-background-light);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 6rem;
    font-weight: 900;
    color: var(--color-text-light);
}
.result-container .result-code::after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: var(--font-base-size);
    color: var(--color-icon);
    display: inline-block;
    font-size: 7rem !important;
    color: var(--color-white);
}
.result-container .result-code.success {
    background-color: var(--color-success-background);
}
.result-container .result-code.success::after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: var(--font-base-size);
    color: var(--color-icon);
    display: inline-block;
    color: var(--color-white);
}
.result-container .result-title {
    font-size: 2.4rem;
    font-weight: 700;
}
.result-container .result-text {
    font-size: 1.8rem;
}

/* ────────────────────────────────
    loading
──────────────────────────────── */
.loading-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(var(--color-background-contrast), 0.2);
    z-index: var(--z-index-loading);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--gap-layout);
    opacity: 0;
    pointer-events: none;
    transition: var(--transition-duration);
}
.loading-container.active {
    opacity: 1;
    pointer-events: auto;
}
.loading-container.hidden-title .loading-title {
    display: none;
}
.loading-container.hidden-sub-title .loading-sub-title {
    display: none;
}

.loading-spinner {
    width: 4rem;
    height: 4rem;
    border: 0.4rem solid var(--color-background-light);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: spin 0.8s ease-in-out infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}
.loading-title-container {
    text-align: center;
    color: var(--color-primary-contrast);
}

.loading-title {
    font-size: 1.8rem;
    font-weight: 500;
}

.loading-sub-title {
    white-space: pre-line;
}

/* ────────────────────────────────
    button
──────────────────────────────── */
.button-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}
.button-group.gap-half {
    gap: calc(var(--gap-component) / 2);
}
.button-group.left {
    justify-content: flex-start;
}
.button-group.center {
    justify-content: center;
}
.button-group.right {
    justify-content: flex-end;
}
.button-group.between {
    justify-content: space-between;
}
.button-group.nowrap {
    flex-wrap: nowrap;
}
.button-group.full .button {
    flex: 1;
}

.button {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-align: center;
    white-space: nowrap;
    padding: 10px 20px;
    border-radius: 4px;
    border: 1px solid var(--color-border);
    transition: var(--transition-duration);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
}
.button:disabled {
    cursor: no-drop;
    opacity: 0.5;
}
.button.hidden {
    display: none;
}
.button.button-primary {
    color: var(--color-primary-contrast);
    background-color: var(--color-primary);
    border-color: transparent;
}

/* ────────────────────────────────
    input
──────────────────────────────── */
.input[type=text], .input[type=password] {
    font-size: 16px;
    font-weight: 500;
    color: var(--color-text);
    height: 46px;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    padding: 0 16px;
    transition: var(--transition-duration);
}
.input[type=text]::placeholder, .input[type=password]::placeholder {
    color: var(--color-sub-2);
}
.input[type=text]:focus, .input[type=password]:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary);
}
/* ────────────────────────────────
    select
──────────────────────────────── */
.select {
    font-size: var(--font-base-size);
    color: var(--color-text);
    height: var(--size-form);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-form);
    background-color: var(--color-background-form);
    padding: 0 calc(var(--padding-form) + (var(--padding-form) / 2) + var(--size-icon)) 0 var(--padding-form);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23909090' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
    background-position: center right var(--padding-form);
    background-repeat: no-repeat;
    background-size: var(--size-icon-small);
    transition: var(--transition-duration);
}
.select:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23909090' d='m12 10.8-3.9 3.9a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275.948.948 0 0 1-.275-.7c0-.283.092-.517.275-.7l4.6-4.6c.2-.2.433-.3.7-.3.267 0 .5.1.7.3l4.6 4.6a.948.948 0 0 1 .275.7.948.948 0 0 1-.275.7.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275L12 10.8Z'/%3E%3C/svg%3E");
}

/* ────────────────────────────────
    checkbox
──────────────────────────────── */
.checkbox {
    width: fit-content;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
}
.checkbox input[type=checkbox] {
    display: none;
}
.checkbox input[type=checkbox]:checked ~ label {
    color: var(--color-text);
}
.checkbox input[type=checkbox]:checked ~ label::before {
    border-color: transparent;
    background-color: var(--color-primary);
}
.checkbox input[type=checkbox]:checked ~ label::after {
    opacity: 1;
    transform: scale(1);
}
.checkbox label {
    position: relative;
    font-size: var(--font-base-size);
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: var(--transition-duration);
    cursor: pointer;
    color: var(--color-sub-2);
}
.checkbox label::before, .checkbox label::after {
    content: "";
    display: flex;
    width: 18px;
    height: 18px;
    text-align: center;
    align-items: center;
    justify-content: center;
    transition: var(--transition-duration);
}
.checkbox label::before {
    border: 1px solid var(--color-border);
    border-color: var(--color-gray-400);
    border-radius: 2px;
}
.checkbox label::after {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    color: var(--color-primary-contrast);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23FFFFFF' d='m9.55 15.15 8.475-8.475c.2-.2.433-.3.7-.3.267 0 .5.1.7.3.2.2.3.438.3.713a.97.97 0 0 1-.3.712l-9.175 9.2c-.2.2-.433.3-.7.3a.96.96 0 0 1-.7-.3L4.55 13a.932.932 0 0 1-.288-.712c.008-.275.112-.512.313-.713.2-.2.438-.3.713-.3.275 0 .512.1.712.3l3.55 3.575Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 18px;
    background-position: center calc(50% + 4px);
}
.checkbox label:hover::before, .checkbox label:focus::before {
    background-color: var(--color-primary-light);
}
.checkbox label:active::before {
    background-color: var(--color-primary-light-active);
}
.checkbox label .required {
    color: var(--color-primary);
    margin-right: -0.6rem;
}

.checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap-component);
    overflow-x: hidden;
}
.checkbox-group.column {
    flex-direction: column;
}
.checkbox-group.border .checkbox {
    width: 100%;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-form);
    transition: background color var(--transition-duration);
}
.checkbox-group.border .checkbox:hover {
    background-color: var(--color-background-light);
}
.checkbox-group.border .checkbox label {
    padding: var(--gap-component);
}
.checkbox-group.border .checkbox label::after {
    top: var(--gap-component);
    left: var(--gap-component);
}

/* ────────────────────────────────
    switch
──────────────────────────────── */
.switch {
    width: fit-content;
    position: relative;
}
.switch input[type=checkbox] {
    display: none;
}
.switch input[type=checkbox]:checked ~ label {
    background-color: var(--color-primary);
}
.switch input[type=checkbox]:checked ~ label::before {
    left: 3.8rem;
}
.switch label {
    width: 6.4rem;
    height: 3.2rem;
    display: flex;
    align-items: center;
    border-radius: 2.4rem;
    background-color: var(--color-border-light);
    cursor: pointer;
    transition: var(--transition-duration);
}
.switch label::before {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background-color: var(--color-primary-contrast);
    border-radius: 50%;
    position: absolute;
    left: 0.6rem;
    box-shadow: 0 0 10px rgba(var(--color-background-contrast), 0.1);
    transition: var(--transition-duration);
}
.switch.switch-small input[type=checkbox]:checked ~ label::before {
    left: 2.7rem;
}
.switch.switch-small label {
    width: 4.8rem;
    height: 2.4rem;
}
.switch.switch-small label::before {
    width: 1.5rem;
    height: 1.5rem;
}

/* ────────────────────────────────
    radio
──────────────────────────────── */
.radio {
    width: fit-content;
}
.radio * {
    cursor: pointer;
}
.radio input[type=radio] {
    display: none;
}
.radio input[type=radio]:checked ~ label {
    color: var(--color-text);
}
.radio input[type=radio]:checked ~ label::before {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary);
}
.radio input[type=radio]:checked ~ label::after {
    opacity: 1;
}
.radio label {
    font-size: var(--font-base-size);
    display: flex;
    align-items: center;
    gap: calc(var(--gap-component) / 2);
    position: relative;
    transition: var(--transition-duration);
    color: var(--color-label);
}
.radio label::before {
    content: "";
    display: flex;
    width: var(--size-icon-small);
    height: var(--size-icon-small);
    text-align: center;
    align-items: center;
    justify-content: center;
    transition: var(--transition-duration);
    border: 1px solid var(--color-border);
    border-radius: 50%;
}
.radio label:hover::before, .radio label:focus::before {
    background-color: var(--color-primary-light);
}
.radio label:active::before {
    background-color: var(--color-primary-light-active);
}

.radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap-component);
}
.radio-group.ui-tab {
    width: fit-content;
    max-width: 100%;
    flex-wrap: nowrap;
    gap: 0;
    border-radius: var(--radius-form);
    overflow: hidden;
}
.radio-group.ui-tab input[type=radio]:checked ~ label {
    font-weight: 600;
    color: var(--color-primary-contrast);
    background-color: var(--color-primary);
    border-color: transparent;
}
.radio-group.ui-tab .radio label {
    min-height: var(--size-form);
    padding: 0 var(--gap-layout);
    border: 1px solid var(--color-border);
    margin-left: -1px;
}
.radio-group.ui-tab .radio label::before {
    display: none;
}
.radio-group.ui-tab .radio:first-child label {
    margin-left: 0;
    border-radius: var(--radius-form) 0 0 var(--radius-form);
}
.radio-group.ui-tab .radio:last-child label {
    border-radius: 0 var(--radius-form) var(--radius-form) 0;
}
.radio-group.ui-tab-shadow {
    width: fit-content;
    max-width: 100%;
    flex-wrap: nowrap;
    gap: 0;
    border-radius: var(--radius-form);
    background-color: var(--color-primary-light);
}
.radio-group.ui-tab-shadow input[type=radio]:checked ~ label {
    font-weight: 600;
    color: var(--color-primary);
    background-color: var(--color-primary-contrast);
    border-color: transparent;
    box-shadow: 0 0 10px rgba(var(--color-background-contrast), 0.1);
    border-radius: var(--radius-form);
}
.radio-group.ui-tab-shadow .radio label {
    min-height: var(--size-form);
    padding: 0 var(--gap-layout);
}
.radio-group.ui-tab-shadow .radio label::before {
    display: none;
}
.radio-group.ui-tab-shadow .radio:first-child label {
    margin-left: 0;
}

/* ────────────────────────────────
    textarea
──────────────────────────────── */
.textarea {
    width: 100%;
    border: 1px solid var(--color-border);
    border-radius: 4px;
    padding: 1.2rem 1.6rem;
    font-size: var(--font-base-size);
    resize: none;
    outline: none;
    overflow: auto;
    color: var(--color-text);
}
.textarea::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.textarea::-webkit-scrollbar-track {
    border-radius: var(--radius);
    background-color: #78788030;
}
.textarea::-webkit-scrollbar-thumb {
    border-radius: var(--radius);
    background: #78788030;
}
.textarea::-webkit-scrollbar-thumb:hover {
    background: #78788050;
}
.textarea::-webkit-scrollbar-thumb:active {
    background: #78788070;
}
.textarea::-webkit-scrollbar-button {
    display: none;
}
.textarea::placeholder {
    color: var(--color-sub-2);
}
.textarea:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 1px var(--color-primary);
}
/* ────────────────────────────────
    modal
──────────────────────────────── */
.modal {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    z-index: var(--z-index-modal);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--gap-layout);
    opacity: 0;
    pointer-events: none;
    transition: var(--transition-duration);
}
.modal .form-title {
    font-size: 1.8rem;
}
.modal.active {
    opacity: 1;
    pointer-events: auto;
}
.modal.full {
    padding: 0;
}
.modal.full .modal-inner {
    border-radius: 0;
    max-width: none;
}
.modal.modal-small .modal-container {
    max-width: 40rem;
}
.modal.modal-medium .modal-container {
    max-width: 56rem;
}
.modal.modal-large .modal-container {
    max-width: 72rem;
}
.modal.modal-xlarge .modal-container {
    max-width: 88rem;
}
.modal.modal-xxlarge .modal-container {
    max-width: 104rem;
}
.modal.modal-xxxlarge .modal-container {
    max-width: 120rem;
}
.modal.modal-xxxxlarge .modal-container {
    max-width: 136rem;
}
.modal.modal-full .modal-container {
    max-width: 100%;
}
.modal.modal-confirm .modal-container .modal-content {
    margin-top: var(--gap-component);
}

.modal-layer {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    display: block;
    background-color: rgba(var(--color-background-contrast), 0.2);
}

.modal-container {
    width: 100%;
    height: auto;
    position: relative;
    overflow: auto;
    overflow-x: hidden;
    overscroll-behavior: none;
    max-height: 100%;
    max-width: 56rem;
    background-color: var(--color-background);
    border-radius: var(--radius-form);
    box-shadow: 0 0 10px rgba(var(--color-background-contrast), 0.1);
}
.modal-container::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
.modal-container::-webkit-scrollbar-track {
    border-radius: var(--radius);
    background-color: #78788030;
}
.modal-container::-webkit-scrollbar-thumb {
    border-radius: var(--radius);
    background: #78788030;
}
.modal-container::-webkit-scrollbar-thumb:hover {
    background: #78788050;
}
.modal-container::-webkit-scrollbar-thumb:active {
    background: #78788070;
}
.modal-container::-webkit-scrollbar-button {
    display: none;
}

.modal-head {
    width: 100%;
    position: sticky;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gap-layout);
    padding: var(--gap-layout);
    border-bottom: 1px solid var(--color-border-light);
    background-color: var(--color-background);
    z-index: 1;
    border-radius: var(--radius-form) var(--radius-form) 0 0;
}
.modal-head.no-border {
    border: none;
}

.modal-title {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 1.8rem;
    font-weight: 700;
}

.modal-close-button {
    width: var(--size-icon);
    height: var(--size-icon);
    background-repeat: no-repeat;
    background-size: var(--size-icon);
    background-position: center;
    transition: var(--transition-duration);
    position: relative;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23606060' fill-rule='evenodd' d='m12.01 13.142 4.61 4.61a.815.815 0 0 0 1.151-1.153l-4.609-4.609 4.61-4.61a.815.815 0 0 0-1.153-1.151l-4.609 4.609-4.61-4.61a.815.815 0 0 0-1.15 1.153l4.608 4.609-4.61 4.61a.814.814 0 1 0 1.153 1.151l4.609-4.609Z' clip-rule='evenodd'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}
.modal-close-button::after {
    content: "";
    display: block;
    width: calc(100% + var(--padding-form));
    height: calc(100% + var(--padding-form));
    background-color: var(--color-primary-light);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: var(--radius-form);
    z-index: -1;
    opacity: 0;
    transition: var(--transition-duration);
}
.modal-close-button:hover, .modal-close-button:focus {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23ff7b00' fill-rule='evenodd' d='m12.01 13.142 4.61 4.61a.815.815 0 0 0 1.151-1.153l-4.609-4.609 4.61-4.61a.815.815 0 0 0-1.153-1.151l-4.609 4.609-4.61-4.61a.815.815 0 0 0-1.15 1.153l4.608 4.609-4.61 4.61a.814.814 0 1 0 1.153 1.151l4.609-4.609Z' clip-rule='evenodd'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
}
.modal-close-button:hover::after, .modal-close-button:focus::after {
    opacity: 1;
}
.modal-close-button:active::after {
    background-color: var(--color-primary-light-active);
}

.modal-content {
    width: 100%;
    height: auto;
    position: relative;
    padding: 2rem;
}

.modal-bottom {
    width: 100%;
    position: sticky;
    left: 0;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    background-color: var(--color-background);
    z-index: 1;
    padding: 2rem;
    gap: 1rem;
}
.modal-bottom.between {
    justify-content: space-between;
}

/* ────────────────────────────────
    table
──────────────────────────────── */
.table {
    width: 100%;
    height: auto;
    position: relative;
    border-top: 3px solid var(--color-text);
    border-collapse: collapse;
}
.table tbody tr {
    border-bottom: 1px solid var(--color-gray-200);
}
.table td {
    padding: 2.9rem 0.8rem;
}
.table .nodata {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-sub-2);
    text-align: center;
}
.table .align-center {
    text-align: center;
}
.table .col-text {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text);
}
.table .col-category {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text);
}
.table .col-title {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text);
}
.table .col-title a:hover {
    text-decoration: underline;
}
.table .col-author {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-sub-2);
}
.table .col-date {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-sub-2);
}
@media screen and (max-width: 767px) {
    .table.mo-card {
        display: block;
    }
    .table.mo-card tbody {
        display: block;
    }
    .table.mo-card tbody tr {
        display: flex;
        flex-wrap: wrap;
        gap: 1.2rem 0;
        padding: 2.4rem 1.2rem;
        border-bottom: 1px solid var(--color-gray-200);
    }
    .table.mo-card tbody td {
        padding: 0;
        display: block;
    }
    .table.mo-card .col-category {
        font-size: 1.5rem;
        font-weight: 600;
        color: var(--color-primary);
        order: 1;
        margin-right: 0.8rem;
    }
    .table.mo-card .col-category::after {
        content: "";
        display: inline-block;
        vertical-align: middle;
        width: 1px;
        height: 1.2rem;
        background-color: var(--color-gray-300);
        margin-left: 0.8rem;
    }
    .table.mo-card .col-title {
        width: 100%;
        font-size: 1.7rem;
        order: 3;
    }
    .table.mo-card .col-inline {
        display: inline-block;
        font-size: 1.5rem;
        order: 2;
    }
    .table.mo-card .col-inline ~ .col-inline {
        margin-left: 0.8rem;
    }
    .table.mo-card .col-inline ~ .col-inline::before {
        content: "";
        display: inline-block;
        vertical-align: middle;
        width: 0.4rem;
        height: 0.4rem;
        background-color: var(--color-gray-300);
        border-radius: 50%;
        margin-right: 0.8rem;
    }
}

.list {
    border-top: 3px solid var(--color-primary);
}
.list li {
    padding: 3.6rem 0;
    border-bottom: 1px solid var(--color-gray-300);
    display: flex;
    align-items: flex-start;
}
.list li .thumb {
    margin-right: 3.6rem;
}
.list li .thumb a {
    width: 100%;
    max-width: 20.5rem;
    display: block;
    aspect-ratio: 205/143;
    overflow: hidden;
}
.list li .thumb a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.list li .content {
    flex: 1;
}
.list li .content .meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 2rem;
}
.list li .content .meta span {
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--color-sub-1);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.list li .content .meta span::after {
    content: "|";
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--color-gray-300);
}
.list li .content .meta span:first-child {
    color: var(--color-primary);
    font-weight: 600;
}
.list li .content .meta span:last-child::after {
    display: none;
}
.list li .content .title {
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--color-text);
}
.list li .content .title a:hover {
    text-decoration: underline;
}
.list li .content .text {
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--color-sub-2);
    display: -webkit-box !important;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    margin-top: 1rem;
}
.list li .view-button {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-sub-2);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.8rem;
    white-space: nowrap;
}
.list li .view-button::after {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background-image: url(../images/icon/arrow_view.svg);
    background-size: cover;
}
@media screen and (max-width: 519px) {
    .list li {
        flex-direction: column;
        gap: 2rem;
    }
    .list li .thumb {
        width: 100%;
        margin-right: 0;
    }
    .list li .thumb a {
        max-width: none;
    }
}

/* ────────────────────────────────
    pagination
──────────────────────────────── */
.pagination {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 1.2rem 2.6rem;
    flex-wrap: wrap;
    margin-top: 5rem;
}
.pagination .button-group {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
    gap: 0.4rem;
}
.pagination button {
    min-width: 4.8rem;
    min-height: 4.8rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    text-align: center;
    transition: var(--transition-duration);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--color-sub-2);
}
.pagination button.active {
    text-decoration: underline;
    color: var(--color-primary);
    font-weight: 700;
}
.pagination button:hover, .pagination button:focus {
    color: var(--color-primary);
}
.pagination .first,
.pagination .last,
.pagination .prev,
.pagination .next {
    background-size: 4.8rem;
    background-repeat: no-repeat;
    background-position: center;
}
.pagination .first {
    background-image: url(../images/icon/pagination_first.svg);
}
.pagination .last {
    background-image: url(../images/icon/pagination_last.svg);
}
.pagination .prev {
    background-image: url(../images/icon/pagination_prev.svg);
}
.pagination .next {
    background-image: url(../images/icon/pagination_next.svg);
}

/* ────────────────────────────────
    form
──────────────────────────────── */
.form-container {
    position: relative;
}
.form-container.border {
    border: 1px solid var(--color-border);
    padding: var(--gap-section);
}
.form-container.border-top {
    border-top: 1px solid var(--color-border);
    padding-top: var(--gap-section);
}
.form-container.border-radius {
    border: 1px solid var(--color-border);
    padding: var(--gap-section);
    border-radius: var(--radius-form);
}
.form-container ~ .form-container {
    margin-top: var(--gap-section);
}
.form-container.sticky {
    position: sticky;
    bottom: 0;
    background-color: var(--color-background);
    padding-bottom: var(--gap-layout);
    margin-bottom: calc(var(--gap-layout) * -1);
}
.form-container.sticky::before {
    content: "";
    display: block;
    width: 100%;
    height: var(--gap-section);
    background-color: var(--blur-background);
    box-shadow: 0 0 40px rgba(var(--blur-shadow)) inset;
    position: absolute;
    left: 0;
    top: calc(var(--gap-section) * -1);
}

.form-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--gap-component);
}
.form-head .button {
    min-height: auto;
    font-size: 14px;
    padding: 6px 12px;
}
.form-head ~ .form-content {
    margin-top: var(--gap-layout);
}
.form-head .drag-handle {
    width: 100%;
    height: var(--gap-section);
    position: absolute;
    top: 0;
    left: 0;
    cursor: move;
    display: flex;
    align-items: center;
    justify-content: center;
}
.form-head .drag-handle::after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: var(--font-base-size);
    color: var(--color-icon);
    display: inline-block;
    color: var(--color-icon-light);
}

.form-title {
    font-size: 2rem;
    font-weight: 700;
}
.form-title ~ .form-sub-title {
    margin-top: 1rem;
}

.form-sub-title {
    font-size: 1.6rem;
    color: var(--color-sub-2);
}

.form-content {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.form-row.form-button-row {
    margin-top: 2rem;
}
.form-row .form-col {
    flex: 1;
    min-width: 20rem;
}

.form-col {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.form-group {
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: var(--color-background);
}
.form-group.between {
    justify-content: space-between;
}
.form-group .input,
.form-group .select {
    flex: 1;
    width: 100%;
}
.form-group .drag-handle {
    cursor: move;
}
.form-group .drag-handle::after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: var(--font-base-size);
    color: var(--color-icon);
    display: inline-block;
    color: var(--color-icon-light);
}

.form-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--color-sub-2);
}
.form-label.required::after {
    content: "*";
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.4rem;
}

.form-msg {
    font-size: 14px;
    color: var(--color-sub-2);
    position: relative;
    /*
    &::before {
        @include fontAwesome5("\f129");
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: var(--size-icon-xsmall);
        height: var(--size-icon-xsmall);
        position: absolute;
        left: 0;
        top: 0.15rem;
        font-size: 0.8rem !important;
        @include border();
        border-radius: 50%;
        color: var(--color-text-light);
    }

    &.info {
        color: var(--color-info);

        &::before {
            @include fontAwesome5("\f129");
            border-color: transparent;
            background-color: var(--color-info);
            color: var(--color-white);
        }
    }

    &.success {
        color: var(--color-success);

        &::before {
            @include fontAwesome5("\f00c");
            border-color: transparent;
            background-color: var(--color-success);
            color: var(--color-white);
        }
    }

    &.warning {
        color: var(--color-warning);

        &::before {
            @include fontAwesome5("\f12a");
            border-color: transparent;
            background-color: var(--color-warning);
            color: var(--color-white);
        }
    }

    &.error {
        color: var(--color-error);

        &::before {
            @include fontAwesome5("\f00d");
            border-color: transparent;
            background-color: var(--color-error);
            color: var(--color-white);
        }
    }
    */
}

/* ────────────────────────────────
    card
──────────────────────────────── */
.card {
    padding: var(--gap-layout);
    border-radius: var(--radius-card);
    border: 1px solid var(--color-border);
    display: flex;
    flex-direction: column;
    gap: var(--gap-layout);
    position: relative;
    transition: var(--transition-duration);
}
.card > * {
    transition: var(--transition-duration);
}
.card.loading {
    align-items: center;
    justify-content: center;
}
.card.loading > * {
    opacity: 0;
    pointer-events: none;
}
.card.loading::after {
    content: "";
    display: block;
    position: absolute;
    width: 1.6rem;
    height: 1.6rem;
    border: 2px solid var(--color-border);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

.card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--gap-component);
}

.card-title {
    font-size: 1.8rem;
    font-weight: 600;
}
.card-title ~ .card-sub-title {
    margin-top: var(--gap-component);
}

.card-sub-title {
    color: var(--color-text-dark);
}

.card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--gap-component);
}

/* ────────────────────────────────
    toast
──────────────────────────────── */
.toast-container {
    position: fixed;
    top: 0;
    right: 0;
    z-index: var(--z-index-loading);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: var(--gap-component);
}
.toast-container .toast {
    width: 32rem;
    min-height: calc(var(--size-icon) + var(--gap-layout) + var(--gap-layout));
    background-color: var(--color-background);
    transition: var(--transition-duration);
    box-shadow: 0 0 10px rgba(var(--color-background-contrast), 0.1);
    padding: var(--gap-layout);
    border-radius: var(--radius);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: var(--transition-duration);
    transform: translateX(32rem);
    margin-right: var(--gap-layout);
}
.toast-container .toast:first-child {
    margin-top: var(--gap-layout);
}
.toast-container .toast .toast-icon {
    width: calc(var(--size-icon));
    height: calc(var(--size-icon));
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: absolute;
    left: var(--gap-layout);
    background-color: var(--color-background-light);
}
.toast-container .toast .toast-icon::after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: var(--font-base-size);
    color: var(--color-icon);
    display: inline-block;
    font-size: 1rem;
}
.toast-container .toast .toast-title {
    font-size: 1.5rem;
    font-weight: 700;
    padding-left: calc(var(--size-icon) + var(--gap-layout));
}
.toast-container .toast .toast-sub-title {
    font-size: 1.4rem;
    padding-left: calc(var(--size-icon) + var(--gap-layout));
}
.toast-container .toast.info .toast-icon {
    background-color: var(--color-info);
}
.toast-container .toast.info .toast-icon::after {
    content: "";
    color: var(--color-white);
}
.toast-container .toast.success .toast-icon {
    background-color: var(--color-success);
}
.toast-container .toast.success .toast-icon::after {
    content: "";
    color: var(--color-white);
}
.toast-container .toast.warning .toast-icon {
    background-color: var(--color-warning);
}
.toast-container .toast.warning .toast-icon::after {
    content: "";
    color: var(--color-white);
}
.toast-container .toast.error .toast-icon {
    background-color: var(--color-error);
}
.toast-container .toast.error .toast-icon::after {
    content: "";
    color: var(--color-white);
}
.toast-container .toast.active {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}
.toast-container .toast.hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateX(32rem);
}

/* ────────────────────────────────
    ckeditor
──────────────────────────────── */
.cke_notifications_area {
    display: none !important;
}

.cke_contents {
    padding: 1rem !important;
}

.cke_top,
.cke_bottom {
    background-color: #fff !important;
}

/* ────────────────────────────────
    pages/common
──────────────────────────────── */
section.active .fade-in {
    opacity: 1;
}
section.active .fade-up,
section.active .fade-down {
    transform: translateY(0);
}
section.active .fade-left,
section.active .fade-right {
    transform: translateX(0);
}
section .fade-in {
    opacity: 0;
    transition: opacity 0.6s ease, transform 0.6s ease;
}
section .fade-up {
    transform: translateY(60px);
}
section .fade-down {
    transform: translateY(-60px);
}
section .fade-left {
    transform: translateX(60px);
}
section .fade-right {
    transform: translateX(-60px);
}
section .delay-1 {
    transition-delay: 0.1s;
}
section .delay-2 {
    transition-delay: 0.2s;
}
section .delay-3 {
    transition-delay: 0.3s;
}
section .delay-4 {
    transition-delay: 0.4s;
}
section .delay-5 {
    transition-delay: 0.5s;
}
section .delay-6 {
    transition-delay: 0.6s;
}
section .delay-7 {
    transition-delay: 0.7s;
}
section .delay-8 {
    transition-delay: 0.8s;
}
section .delay-9 {
    transition-delay: 0.9s;
}
@media screen and (max-width: 1239px) {
    section {
        padding: 0 2rem;
    }
}
@media screen and (max-width: 767px) {
    section.active .fade-left,
section.active .fade-right {
        transform: translateY(0);
    }
    section .fade-left {
        transform: translateY(60px);
    }
    section .fade-right {
        transform: translateY(60px);
    }
}

.section-container {
    width: 100%;
    max-width: var(--size-layout-content);
    position: relative;
    margin: 0 auto;
}
@media screen and (max-width: 1239px) {
    .section-container {
        width: 100%;
        max-width: 100%;
    }
}

.section-board .section-container {
    padding: 10rem 0 15rem;
}
.section-board .section-head .keyword {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-primary);
    margin-bottom: 0.8rem;
}
.section-board .section-head .section-head-row {
    display: flex;
    align-items: flex-start;
    gap: 8rem;
}
.section-board .section-head .section-head-row.between {
    justify-content: space-between;
}
.section-board .section-head .section-title {
    display: flex;
    gap: 8rem;
}
.section-board .section-head .section-title .title {
    font-size: 2.8rem;
    font-weight: 700;
    color: var(--color-text);
    white-space: nowrap;
}
.section-board .section-head .section-title .text {
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--color-sub-1);
    word-break: keep-all;
}
.section-board .section-head .section-category ul {
    display: flex;
    flex-wrap: wrap;
    gap: 1.6rem 2.4rem;
}
.section-board .section-head .section-category ul::after {
    display: none;
}
.section-board .section-head .section-category ul li button {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-sub-2);
    transition: var(--transition-duration);
}
.section-board .section-head .section-category ul li button:hover {
    color: var(--color-primary);
}
.section-board .section-head .section-category ul li button.active {
    font-weight: 600;
    color: var(--color-primary);
    text-decoration: underline;
}
.section-board .section-content {
    margin-top: 7rem;
}
@media screen and (max-width: 1023px) {
    .section-board .section-container {
        padding: 6rem 0;
    }
    .section-board .section-head .section-title {
        flex-direction: column;
        gap: 3rem;
    }
    .section-board .section-head .section-head-row {
        flex-direction: column;
        gap: 3rem;
    }
    .section-board .section-content {
        margin-top: 6rem;
    }
}

.section-post-visual {
    background-size: cover;
    background-position: center;
}
.section-post-visual[data-category=spine-joint] {
    background-image: url(../images/post/visual_spine_joint.png);
}
.section-post-visual[data-category=traffic-accident] {
    background-image: url(../images/post/visual_traffic_accident.png);
}
.section-post-visual[data-category=digestive] {
    background-image: url(../images/post/visual_digestive.png);
}
.section-post-visual[data-category=neuro-facial] {
    background-image: url(../images/post/visual_neuro_facial.png);
}
.section-post-visual[data-category=mental-sleep-focus] {
    background-image: url(../images/post/visual_mental_sleep_focus.png);
}
.section-post-visual[data-category=women-recovery] {
    background-image: url(../images/post/visual_women_recovery.png);
}
.section-post-visual[data-category=diet-beauty] {
    background-image: url(../images/post/visual_diet_beauty.png);
}
.section-post-visual[data-category=press] {
    background-image: url(../images/post/visual_press.png);
}
.section-post-visual .section-container {
    padding: 10.7rem 0 11.4rem;
}
.section-post-visual .section-container .section-title {
    text-align: center;
}
.section-post-visual .section-container .section-title .title {
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--color-primary);
}
.section-post-visual .section-container .section-title .sub-title {
    font-size: 2.8rem;
    font-weight: 600;
    color: var(--color-text-white);
    margin-top: 0.8rem;
}

.section-post {
    padding: 6.8rem 2rem 15rem;
}
.section-post .post-container .post-head {
    border-top: 3px solid var(--color-text);
}
.section-post .post-container .post-head .post-title {
    padding: 2.5rem 0;
    border-bottom: 1px solid var(--color-gray-300);
}
.section-post .post-container .post-head .post-title .title {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-text);
}
.section-post .post-container .post-head .post-meta {
    padding: 2rem 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    border-bottom: 1px solid var(--color-gray-300);
}
.section-post .post-container .post-head .post-meta span {
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--color-sub-1);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.section-post .post-container .post-head .post-meta span::after {
    content: "|";
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--color-gray-300);
}
.section-post .post-container .post-head .post-meta span:last-child::after {
    display: none;
}
.section-post .post-container .post-body .post-content {
    margin: 4.4rem 0;
}
.section-post .post-container .post-body .post-button-group {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.8rem;
}
.section-post .post-container .post-body .post-button-group .button {
    width: fit-content;
    min-width: 14.6rem;
    min-height: 4.8rem;
    border-color: var(--color-gray-300);
    border-radius: 0;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-sub-1);
    display: flex;
}
.section-post .post-container .post-body .post-button-group .button.button-view {
    color: var(--color-text-white);
    background-color: var(--color-text);
}
.section-post .post-container .post-body .post-nav {
    margin-top: 4.8rem;
}
.section-post .post-container .post-body .post-nav .post-nav-item {
    display: flex;
    gap: 7.6rem;
    padding: 2rem 0;
    border-top: 1px solid var(--color-gray-300);
}
.section-post .post-container .post-body .post-nav .post-nav-item:last-child {
    border-bottom: 1px solid var(--color-gray-300);
}
.section-post .post-container .post-body .post-nav .post-nav-item a,
.section-post .post-container .post-body .post-nav .post-nav-item span {
    font-weight: 500;
}
.section-post .post-container .post-body .post-nav .post-nav-item span {
    color: var(--color-sub-2);
}
.section-post .post-container .post-body .post-nav .post-nav-item .label {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    gap: 0.8rem;
}
.section-post .post-container .post-body .post-nav .post-nav-item .label::after {
    content: "";
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23111111' d='m12 10.8-3.9 3.9a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275.948.948 0 0 1-.275-.7c0-.283.092-.517.275-.7l4.6-4.6c.2-.2.433-.3.7-.3.267 0 .5.1.7.3l4.6 4.6a.948.948 0 0 1 .275.7.948.948 0 0 1-.275.7.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275L12 10.8Z'/%3E%3C/svg%3E");
    background-size: 2.4rem;
}
.section-post .post-container .post-body .post-nav .post-nav-item.prev a.label::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23111111' d='m12 10.8-3.9 3.9a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275.948.948 0 0 1-.275-.7c0-.283.092-.517.275-.7l4.6-4.6c.2-.2.433-.3.7-.3.267 0 .5.1.7.3l4.6 4.6a.948.948 0 0 1 .275.7.948.948 0 0 1-.275.7.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275L12 10.8Z'/%3E%3C/svg%3E");
}
.section-post .post-container .post-body .post-nav .post-nav-item.prev span.label::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23767676' d='m12 10.8-3.9 3.9a.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275.948.948 0 0 1-.275-.7c0-.283.092-.517.275-.7l4.6-4.6c.2-.2.433-.3.7-.3.267 0 .5.1.7.3l4.6 4.6a.948.948 0 0 1 .275.7.948.948 0 0 1-.275.7.948.948 0 0 1-.7.275.948.948 0 0 1-.7-.275L12 10.8Z'/%3E%3C/svg%3E");
}
.section-post .post-container .post-body .post-nav .post-nav-item.next a.label::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23111111' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}
.section-post .post-container .post-body .post-nav .post-nav-item.next span.label::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath stroke='%23767676' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}
@media screen and (max-width: 767px) {
    .section-post .post-container .post-body .post-button-group {
        flex-wrap: wrap;
    }
    .section-post .post-container .post-body .post-button-group .button {
        flex: 1;
    }
}

.section-about {
    background-size: cover;
    background-position: center;
    background-image: url(../images/about/about_bg.png);
    padding: 18rem 2rem 19.6rem;
}
.section-about .section-container .section-title .text {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 0.8rem;
}
.section-about .section-container .section-title .title {
    font-size: 3.2rem;
    font-weight: 700;
    color: var(--color-text);
}
.section-about .section-container .section-content {
    margin-top: 8rem;
}
.section-about .section-container .section-content ul {
    display: flex;
    gap: 1.2rem;
}
.section-about .section-container .section-content ul::after {
    display: none;
}
.section-about .section-container .section-content ul li {
    flex: 1;
    min-width: 0;
    transition: flex 0.6s ease;
}
.section-about .section-container .section-content ul li:hover {
    flex: 2.5;
}
.section-about .section-container .section-content ul li:nth-of-type(1) a {
    background-image: url(../images/about/doctor_bg.png);
}
.section-about .section-container .section-content ul li:nth-of-type(2) a {
    background-image: url(../images/about/column_bg.png);
    background-position: right;
}
.section-about .section-container .section-content ul li a {
    width: 100%;
    height: 32rem;
    padding: 4rem 3.6rem;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 1.6rem;
}
.section-about .section-container .section-content ul li a span {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}
.section-about .section-container .section-content ul li a span:nth-of-type(1) {
    font-size: 2.6rem;
    font-weight: 600;
    color: var(--color-text-white);
}
.section-about .section-container .section-content ul li a span:nth-of-type(2) {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text-white);
}
.section-about .section-container .section-content ul li a span:nth-of-type(2)::after {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background-image: url(../images/icon/arrow_about.svg);
    background-size: cover;
}
@media screen and (max-width: 1023px) {
    .section-about {
        padding: 6rem 2rem;
    }
}
@media screen and (max-width: 767px) {
    .section-about .section-container .section-title .title {
        font-size: 20px;
    }
    .section-about .section-container .section-content {
        margin-top: 4rem;
    }
    .section-about .section-container .section-content ul {
        flex-direction: column;
    }
    .section-about .section-container .section-content ul li a {
        padding: 3rem 2rem;
    }
}

/* ────────────────────────────────
    pages/index
──────────────────────────────── */
@keyframes moveX {
    0% {
        transform: translateX(var(--move-x));
    }
    50% {
        opacity: 1;
        transform: translateX(0);
    }
    100% {
        transform: translateX(var(--move-x));
    }
}
@keyframes titleLine {
    0% {
        transform: translate(-50%, -50%) scaleX(0);
    }
    100% {
        transform: translate(-50%, -50%) scaleX(1);
    }
}
@keyframes showTitle {
    0% {
        opacity: 0;
        transform: translateY(calc(60 / 1080 * 100vh));
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
.section-main-visual {
    background-color: #111;
    position: relative;
    padding: 0;
}
.section-main-visual::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-image: url(../images/main/visual_bg.png);
    background-size: cover;
    background-position: center;
    z-index: 1;
    transition: 1s;
    transition-delay: 3s;
    pointer-events: none;
}
.section-main-visual.animation-1::before {
    opacity: 0;
}
.section-main-visual.animation-1 .section-container {
    max-width: 100%;
}
.section-main-visual.animation-1 .section-container .section-title {
    /*
    .title,
    .text {
        animation: showTitle 1s ease;
        animation-delay: 6s;
        animation-fill-mode: forwards;
    }
    */
}
.section-main-visual.animation-1 .section-container .section-title::before {
    animation: titleLine 2s ease;
    animation-delay: 3s;
}
.section-main-visual.animation-1 .section-container .section-title .text-container .text-split .text-box .title,
.section-main-visual.animation-1 .section-container .section-title .text-container .text-split .text-box .text {
    animation: showTitle 1s ease;
    animation-delay: 6s;
    animation-fill-mode: forwards;
}
.section-main-visual.animation-1 .section-container .section-title .img-split {
    clip-path: inset(-1px -1px -1px -1px);
}
.section-main-visual.animation-1 .section-container .section-content .visual-logo img:nth-of-type(1) {
    --move-x: calc(-50 / 1920 * 100vw);
    animation: moveX 3s ease;
}
.section-main-visual.animation-1 .section-container .section-content .visual-logo img:nth-of-type(2) {
    --move-x: calc(-40 / 1920 * 100vw);
    animation: moveX 3s ease;
}
.section-main-visual.animation-1 .section-container .section-content .visual-logo img:nth-of-type(3) {
    --move-x: calc(-32 / 1920 * 100vw);
    animation: moveX 3s ease;
}
.section-main-visual.animation-1 .section-container .section-content .visual-logo img:nth-of-type(4) {
    --move-x: calc(26 / 1920 * 100vw);
    animation: moveX 3s ease;
}
.section-main-visual.animation-1 .section-container .section-content .visual-logo img:nth-of-type(5) {
    --move-x: calc(33 / 1920 * 100vw);
    animation: moveX 3s ease;
}
.section-main-visual.animation-1 .section-container .section-content .visual-logo img:nth-of-type(6) {
    --move-x: calc(41 / 1920 * 100vw);
    animation: moveX 3s ease;
}
.section-main-visual.animation-1 .section-container .section-content .visual-logo img:nth-of-type(7) {
    --move-x: calc(50 / 1920 * 100vw);
    animation: moveX 3s ease;
}
.section-main-visual .section-container {
    width: 100%;
    min-height: calc(100vh - var(--size-header-height));
}
.section-main-visual .section-container .section-title,
.section-main-visual .section-container .section-content {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.section-main-visual .section-container .section-title {
    word-break: keep-all;
}
.section-main-visual .section-container .section-title::before {
    content: "";
    display: block;
    width: 100%;
    height: calc(2 / 1080 * 100vh);
    background-color: #303030;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scaleX(0);
    transition: 1s;
    transition-delay: 3s;
}
.section-main-visual .section-container .section-title .text-container {
    width: 100%;
    height: 558px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    pointer-events: none;
}
.section-main-visual .section-container .section-title .text-container .text-split {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.section-main-visual .section-container .section-title .text-container .text-box {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.section-main-visual .section-container .section-title .text-container .text-box .title {
    font-size: 62px;
    font-weight: 600;
    background: linear-gradient(94.76deg, #ff7b00 -12.74%, #b64600 105.04%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1.3;
    position: absolute;
    top: -80px;
    left: 0;
    padding-left: 100px;
    letter-spacing: -2%;
    pointer-events: auto;
    transform: translateY(60px);
    opacity: 0;
}
.section-main-visual .section-container .section-title .text-container .text-box .text {
    font-size: 28px;
    font-weight: 500;
    color: var(--color-text-white);
    position: absolute;
    padding-right: 100px;
    bottom: -64px;
    right: 0;
    letter-spacing: -2%;
    pointer-events: auto;
    transform: translateY(60px);
    opacity: 0;
}
.section-main-visual .section-container .section-title .img-split {
    width: 100%;
    min-width: 1920px;
    height: 558px;
    left: 50%;
    position: relative;
    top: 50%;
    transform: translate(-50%, -50%);
    overflow: hidden;
    clip-path: inset(50% 0 50% 0);
    transition: clip-path 0.7s cubic-bezier(0.77, 0, 0.18, 1);
    transition-delay: 5s;
}
.section-main-visual .section-container .section-title .img-split:hover .gray.left img {
    clip-path: inset(0 100% 0 0);
}
.section-main-visual .section-container .section-title .img-split:hover .gray.right img {
    clip-path: inset(0 0 0 100%);
}
.section-main-visual .section-container .section-title .img-split img {
    width: 100%;
    display: block;
}
.section-main-visual .section-container .section-title .img-split img.mo {
    display: none;
}
.section-main-visual .section-container .section-title .img-split .gray {
    position: absolute;
    top: 0;
    width: 50%;
    height: 100%;
}
.section-main-visual .section-container .section-title .img-split .gray img {
    clip-path: inset(-1px -1px -1px -1px);
}
.section-main-visual .section-container .section-title .img-split .gray.left {
    left: 0;
}
.section-main-visual .section-container .section-title .img-split .gray.right {
    right: 0;
}
.section-main-visual .section-container .section-title .img-split .gray img {
    width: 200%;
    height: 100%;
    object-fit: cover;
    transition: clip-path 0.7s cubic-bezier(0.77, 0, 0.18, 1);
}
.section-main-visual .section-container .section-content {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    pointer-events: none;
    z-index: 1;
}
.section-main-visual .section-container .section-content .visual-logo {
    display: flex;
}
.section-main-visual .section-container .section-content .visual-logo img {
    opacity: 0;
}
.section-main-visual .section-container .section-content .visual-logo img:nth-of-type(1) {
    width: 1.8rem;
    height: 3.6rem;
}
.section-main-visual .section-container .section-content .visual-logo img:nth-of-type(2) {
    width: 1.8rem;
    height: 3.6rem;
    margin-right: 0.2rem;
}
.section-main-visual .section-container .section-content .visual-logo img:nth-of-type(3) {
    width: 3.6rem;
    height: 3.6rem;
    margin-right: 1.5rem;
}
.section-main-visual .section-container .section-content .visual-logo img:nth-of-type(4) {
    width: 4.2rem;
    height: 3.6rem;
    margin-right: 0.3rem;
}
.section-main-visual .section-container .section-content .visual-logo img:nth-of-type(5) {
    width: 1.6rem;
    height: 3.6rem;
    margin-right: 0.2rem;
}
.section-main-visual .section-container .section-content .visual-logo img:nth-of-type(6) {
    width: 3.5rem;
    height: 3.6rem;
    margin-right: 0.1rem;
}
.section-main-visual .section-container .section-content .visual-logo img:nth-of-type(7) {
    width: 3.6rem;
    height: 3.6rem;
}
@media screen and (max-width: 1439px) {
    .section-main-visual .section-container .section-title .text-container .text-box .title {
        font-size: 48px;
        padding: 0 2rem;
        top: -64px;
    }
    .section-main-visual .section-container .section-title .text-container .text-box .text {
        font-size: 24px;
        padding: 0 2rem;
        bottom: -54px;
    }
}
@media screen and (max-width: 767px) {
    .section-main-visual .section-container .section-title .text-container {
        height: calc(625px / 767px * 100vw);
        min-height: 293px;
    }
    .section-main-visual .section-container .section-title .text-container .text-box .title {
        font-size: 28px;
        top: -36px;
    }
    .section-main-visual .section-container .section-title .text-container .text-box .text {
        font-size: 14px;
        bottom: -32px;
    }
    .section-main-visual .section-container .section-title .img-split {
        min-width: 360px;
        height: auto;
    }
    .section-main-visual .section-container .section-title .img-split img.pc {
        display: none;
    }
    .section-main-visual .section-container .section-title .img-split img.mo {
        display: block;
    }
}

.section-main-doctor {
    height: 300vh;
    background-color: #111;
    position: relative;
    z-index: 1;
}
.section-main-doctor.animation-3 .section-container .section-title {
    transition-delay: 3s;
    left: calc(-85 / 1920 * 100vw);
    opacity: 1;
}
.section-main-doctor.animation-3 .section-container .section-content .img-container .inner {
    margin-top: 0;
}
.section-main-doctor.animation-3 .section-container .section-content .img-container .inner .item {
    transition-delay: 2s;
}
.section-main-doctor.animation-3 .section-container .section-content .img-container .inner .item:nth-of-type(4) {
    max-width: calc(974 / 1920 * 100vw);
}
.section-main-doctor .section-container {
    width: calc(974 / 1920 * 100vw);
    height: 100vh;
    position: sticky;
    left: 0;
    top: 0;
}
.section-main-doctor .section-container .section-title {
    position: absolute;
    top: 50%;
    left: calc(-145 / 1920 * 100vw);
    transform: translateY(-50%);
    z-index: 2;
    opacity: 0;
    transition: 1s;
}
.section-main-doctor .section-container .section-title .title {
    font-size: clamp(28px, calc(42 / 1920 * 100vw), calc(42 / 1920 * 100vw));
    font-weight: 700;
    color: var(--color-primary);
}
.section-main-doctor .section-container .section-title a {
    width: fit-content;
    height: calc(46 / 1080 * 100vh);
    font-size: clamp(14px, calc(16 / 1920 * 100vw), calc(16 / 1920 * 100vw));
    font-weight: 600;
    color: var(--color-text-white);
    margin-top: calc(67 / 1080 * 100vh);
    position: relative;
    display: flex;
    align-items: center;
    gap: calc(19 / 1920 * 100vw);
    border-bottom: 1px solid #fff;
}
.section-main-doctor .section-container .section-title a::after {
    content: "";
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
    background-size: cover;
}
.section-main-doctor .section-container .section-content {
    /*
    .img-container {
        width: calc(974 / 1920 * 100vw);
        margin: 0 auto;
        position: relative;

        .inner {
            display: flex;
            flex-direction: column;
            gap: calc(52 / 1080 * 100vh);
            // transform: translateY(calc(754 / 1080 * 100vh));
            transform: translateY(calc(-1716 / 1080 * 100vh));
            transition: 2s;

            .item {
                width: 100%;
                max-width: calc(856 / 1920 * 100vw);
                margin: 0 auto;
                transition: 1s;
                transform-origin: center;
                position: relative;

                &:hover {
                    img {
                        &.img-color {
                            opacity: 1;
                        }
                    }
                }

                img {
                    width: 100%;

                    &.img-color {
                        width: fit-content;
                        position: absolute;
                        left: 50%;
                        top: 50%;
                        transform: translate(-50%, -50%);
                        opacity: 0;
                        transition: 1s;
                    }
                }

                &:nth-of-type(4) {
                    // max-width: calc(974 / 1920 * 100vw);
                }
            }
        }
    }
    */
}
.section-main-doctor .section-container .section-content .img-container {
    width: 100%;
    height: 100vh;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}
.section-main-doctor .section-container .section-content .img-container .inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: calc(52 / 1080 * 100vh);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 50%;
    transform: translate(-50%, -50%);
    margin-top: 250%;
    transition: 2s;
}
.section-main-doctor .section-container .section-content .img-container .inner .item {
    width: 100%;
    max-width: calc(856 / 1920 * 100vw);
    margin: 0 auto;
    transition: 1s;
    transform-origin: center;
    position: relative;
}
.section-main-doctor .section-container .section-content .img-container .inner .item:hover img.img-color {
    opacity: 1;
}
.section-main-doctor .section-container .section-content .img-container .inner .item img {
    width: 100%;
}
.section-main-doctor .section-container .section-content .img-container .inner .item img.img-color {
    width: fit-content;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: 1s;
}
@media screen and (max-width: 767px) {
    .section-main-doctor .section-container {
        width: 100%;
    }
    .section-main-doctor .section-container .section-title {
        left: 0;
    }
    .section-main-doctor .section-container .section-content .img-container .inner {
        gap: 2rem;
    }
    .section-main-doctor .section-container .section-content .img-container .inner .item {
        max-width: 90%;
    }
    .section-main-doctor.animation-3 .section-container .section-title {
        left: 4rem;
    }
    .section-main-doctor.animation-3 .section-container .section-content .img-container .inner .item:nth-of-type(4) {
        max-width: 100%;
    }
}

.section-main-column {
    background-size: cover;
    background-position: center;
    background-image: url(../images/main/column/bg.png);
    padding: 38.2rem 2rem;
}
.section-main-column .section-container {
    display: flex;
    justify-content: space-between;
    position: static;
}
.section-main-column .section-container .section-title .title {
    font-size: 4.2rem;
    font-weight: 700;
    color: var(--color-primary);
    word-break: keep-all;
}
.section-main-column .section-container .section-title a {
    width: fit-content;
    height: 4.6rem;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-text);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    gap: 1rem;
    border-bottom: 2px solid var(--color-text);
    margin-top: 2.8rem;
    white-space: nowrap;
}
.section-main-column .section-container .section-title a::after {
    content: "";
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23111111' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
    background-size: cover;
}
.section-main-column .section-container .section-content {
    min-width: 0;
    display: flex;
    align-items: center;
}
.section-main-column .section-container .section-content .swiper {
    width: calc(1099 / 1920 * 100vw);
    position: absolute;
    right: 0;
}
.section-main-column .section-container .section-content .swiper .swiper-slide .text-box {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 4.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.section-main-column .section-container .section-content .swiper .swiper-slide .text-box .keyword {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-text-white);
    opacity: 0.8;
}
.section-main-column .section-container .section-content .swiper .swiper-slide .text-box .text {
    font-size: 2.4rem;
    font-weight: 600;
    color: var(--color-text-white);
}
.section-main-column .section-container .section-content .swiper .swiper-slide img {
    width: 100%;
}
.section-main-column .section-container .section-content .swiper .swiper-slide img:nth-of-type(2) {
    display: none;
}
@media screen and (max-width: 1023px) {
    .section-main-column {
        padding: 12rem 2rem;
    }
    .section-main-column .section-container {
        flex-direction: column;
    }
    .section-main-column .section-container .section-title {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: flex-end;
        gap: 2rem 4rem;
    }
    .section-main-column .section-container .section-title a {
        margin-top: 0;
    }
    .section-main-column .section-container .section-content {
        margin-top: 6rem;
    }
    .section-main-column .section-container .section-content .swiper {
        width: 100%;
        position: relative;
        right: auto;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper {
        height: auto;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 4px;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide:nth-child(3), .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide:nth-child(7) {
        grid-column: span 2;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide:nth-child(4) {
        grid-row: span 2;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide:nth-child(6) {
        grid-column: 2;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide .text-box {
        padding: 2rem 1.6rem;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide .text-box .keyword {
        font-size: 14px;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide .text-box .title {
        font-size: 16px;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide img:nth-of-type(1) {
        display: none;
    }
    .section-main-column .section-container .section-content .swiper .swiper-wrapper .swiper-slide img:nth-of-type(2) {
        display: block;
    }
}
@media screen and (max-width: 767px) {
    .section-main-column .section-container .section-title .title {
        font-size: 28px;
    }
}

/* ────────────────────────────────
    pages/doctor
──────────────────────────────── */
.section-doctor-banner {
    background-size: cover;
    background-position: center;
    background-image: url(../images/doctor/banner_bg.png);
    padding: 19.7rem 2rem 42.6rem;
}
.section-doctor-banner .section-container .section-title .text {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 0.8rem;
}
.section-doctor-banner .section-container .section-title .title {
    font-size: 3.2rem;
    font-weight: 700;
    color: var(--color-text);
    word-break: keep-all;
}
.section-doctor-banner .section-container .section-title a {
    width: fit-content;
    height: 4.6rem;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-text);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    gap: 1rem;
    border-bottom: 2px solid var(--color-text);
    margin-top: 4.2rem;
}
.section-doctor-banner .section-container .section-title a::after {
    content: "";
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23111111' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
    background-size: cover;
}
.section-doctor-banner .section-container .section-content {
    position: absolute;
    top: -6.5rem;
    pointer-events: none;
}
@media screen and (max-width: 1023px) {
    .section-doctor-banner {
        padding: 6rem 2rem;
        margin-bottom: -20rem;
    }
    .section-doctor-banner .section-container .section-content {
        position: relative;
        top: -20rem;
    }
}
@media screen and (max-width: 767px) {
    .section-doctor-banner {
        margin-bottom: 0;
    }
    .section-doctor-banner .section-container .section-content {
        top: auto;
    }
}

.section-doctor-visual {
    background-image: url(../images/doctor/visual.png);
    background-size: cover;
    background-position: center;
}
.section-doctor-visual .section-container {
    padding: 19.6rem 0 18.8rem;
}
.section-doctor-visual .section-container .section-title {
    word-break: keep-all;
}
.section-doctor-visual .section-container .section-title .title {
    font-size: 5rem;
    font-weight: 700;
    color: var(--color-primary);
    padding-left: 2rem;
    position: relative;
    z-index: 2;
}
.section-doctor-visual .section-container .section-title .title::before {
    content: "";
    display: block;
    width: 5px;
    height: calc(100% - 3.2rem);
    background-color: var(--color-primary);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.section-doctor-visual .section-container .section-title .text {
    font-size: 2.3rem;
    font-weight: 500;
    color: var(--color-text-white);
    margin-top: 4rem;
}
.section-doctor-visual .section-container .section-title img {
    width: 53.8rem;
    position: absolute;
    right: -5.5rem;
    bottom: 0;
    pointer-events: none;
}
@media screen and (max-width: 767px) {
    .section-doctor-visual .section-container {
        padding: 6rem 0;
    }
    .section-doctor-visual .section-container .section-title .title {
        font-size: 28px;
    }
    .section-doctor-visual .section-container .section-title .text {
        font-size: 16px;
    }
    .section-doctor-visual .section-container .section-title img {
        display: none;
    }
}

.section-doctor-career {
    background-image: url(../images/doctor/career_bg.png);
    background-size: cover;
    background-position: center;
}
.section-doctor-career .section-container {
    padding: 28.5rem 0 31.4rem;
    display: flex;
    position: static;
}
.section-doctor-career .section-container .section-title .title {
    font-size: 3.8rem;
    font-weight: 700;
    color: var(--color-text);
}
.section-doctor-career .section-container .section-title .title span {
    color: var(--color-primary);
}
.section-doctor-career .section-container .section-title .text {
    margin-top: 13.6rem;
}
.section-doctor-career .section-container .section-title .text ul ~ ul {
    margin-top: 3rem;
}
.section-doctor-career .section-container .section-title .text ul li {
    font-size: 2rem;
    font-weight: 500;
    color: var(--color-sub-1);
    line-height: 1.7;
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}
.section-doctor-career .section-container .section-title .text ul li::before {
    content: "·";
    display: block;
}
.section-doctor-career .section-container .section-content {
    min-width: 0;
    display: flex;
    align-items: center;
}
.section-doctor-career .section-container .section-content .swiper-nav {
    display: flex;
    align-items: center;
    gap: 1rem;
    position: absolute;
    right: calc(920 / 1920 * 100vw);
    z-index: 2;
}
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-prev,
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-next {
    width: 4.8rem;
    height: 4.8rem;
    background-size: 4.8rem;
    background-color: #ffffff50;
    box-shadow: 0px 4px 10px 0px #0000000d;
    transition: var(--transition-duration);
    position: relative;
    margin: 0;
    left: auto;
    right: auto;
}
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-prev::after,
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-next::after {
    display: none;
}
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-prev:hover,
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-next:hover {
    background-color: var(--color-primary);
}
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-prev:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-doctor-career .section-container .section-content .swiper-nav .swiper-button-next:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-doctor-career .section-container .section-content .swiper {
    width: calc(956 / 1920 * 100vw);
    position: absolute;
    right: 0;
}
.section-doctor-career .section-container .section-content .swiper .swiper-slide img {
    width: 100%;
}
@media screen and (max-width: 1023px) {
    .section-doctor-career .section-container {
        flex-direction: column;
        padding: 12rem 0;
    }
    .section-doctor-career .section-container .section-title .text {
        margin-top: 6rem;
    }
    .section-doctor-career .section-container .section-content {
        width: calc(100% + 2rem);
        margin-top: 6rem;
    }
    .section-doctor-career .section-container .section-content .swiper {
        width: 100%;
        position: relative;
        right: auto;
    }
    .section-doctor-career .section-container .section-content .swiper-nav {
        display: none;
    }
}
@media screen and (max-width: 767px) {
    .section-doctor-career .section-container .section-title .title {
        font-size: 28px;
    }
}

@media screen and (min-width: 768px) {
    .section-doctor-philosophy {
        height: 400vh;
        position: relative;
        padding: 0;
    }
    .section-doctor-philosophy.animation-2 .section-container-1::before {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0;
    }
    .section-doctor-philosophy.animation-3 .section-container-1::before {
        opacity: 0;
    }
    .section-doctor-philosophy.animation-3 .section-container-1 .section-title {
        opacity: 1;
    }
    .section-doctor-philosophy.animation-3 .section-container-1 .section-title::before {
        height: 100%;
    }
    .section-doctor-philosophy.animation-3 .section-container-1 .section-title .text-animation-container .text-animation {
        transform: translateY(0);
        opacity: 1;
    }
    .section-doctor-philosophy.animation-3 .section-container-1 .section-content {
        opacity: 1;
    }
    .section-doctor-philosophy.animation-3 .section-container-1 .section-content::before {
        width: 100%;
    }
    .section-doctor-philosophy.animation-3 .section-container-1 .section-content ul li:nth-of-type(2) {
        transition: 1s;
        opacity: 1;
        left: calc(178 / 1920 * 100vw);
    }
    .section-doctor-philosophy.animation-3 .section-container-1 .section-content ul li:nth-of-type(3) {
        transition: 2s;
        opacity: 1;
        animation: move1 2s forwards;
    }
    @keyframes move1 {
        0% {
            left: 0;
        }
        50% {
            left: calc(178 / 1920 * 100vw);
        }
        100% {
            left: calc(356 / 1920 * 100vw);
        }
    }
    .section-doctor-philosophy.animation-4 .section-container-1 {
        transition-delay: 1s;
        background-image: url(../images/doctor/philosophy_bg_2.png);
        pointer-events: none;
    }
    .section-doctor-philosophy.animation-4 .section-container-1::before {
        opacity: 0;
    }
    .section-doctor-philosophy.animation-4 .section-container-1 .section-title {
        transition-delay: 0.5s;
        opacity: 0;
    }
    .section-doctor-philosophy.animation-4 .section-container-1 .section-title::before {
        height: 0;
    }
    .section-doctor-philosophy.animation-4 .section-container-1 .section-title .text-animation-container:last-child .text-animation {
        transform: translateY(-120%);
        opacity: 0;
    }
    .section-doctor-philosophy.animation-4 .section-container-1 .section-content {
        transition-delay: 0.5s;
        opacity: 0;
    }
    .section-doctor-philosophy.animation-4 .section-container-1 .section-content::before {
        width: 0;
    }
    .section-doctor-philosophy.animation-4 .section-container-1 .section-content ul li:nth-of-type(2) {
        transition: 1s;
        left: 0;
    }
    .section-doctor-philosophy.animation-4 .section-container-1 .section-content ul li:nth-of-type(3) {
        animation: move2 1s forwards;
    }
    @keyframes move2 {
        0% {
            left: calc(356 / 1920 * 100vw);
        }
        100% {
            left: 0;
        }
    }
    .section-doctor-philosophy.animation-4 .section-container-2 {
        opacity: 1;
        pointer-events: auto;
    }
    .section-doctor-philosophy.animation-4 .section-container-2 .section-title::before {
        height: 100%;
    }
    .section-doctor-philosophy.animation-4 .section-container-2 .section-content .text-container .text-animation-container .text-animation {
        transform: translateY(0);
        opacity: 1;
    }
    .section-doctor-philosophy.animation-4 .section-container-2 .section-content ul::before {
        width: 100%;
    }
    .section-doctor-philosophy.animation-4 .section-container-2 .section-content ul li {
        opacity: 1;
    }
    .section-doctor-philosophy.animation-4 .section-container-2 .section-content ul li:nth-of-type(2) {
        left: calc((144 / 1920 * 100vw) + (222 / 1920 * 100vw) + (18 / 1920 * 100vw));
    }
    .section-doctor-philosophy.animation-4 .section-container-2 .section-content ul li:nth-of-type(3) {
        left: calc( (144 / 1920 * 100vw) + ((222 * 2) / 1920 * 100vw) + ((18 * 2) / 1920 * 100vw) );
    }
    .section-doctor-philosophy.animation-4 .section-container-2 .section-content ul li:nth-of-type(4) {
        left: calc( (144 / 1920 * 100vw) + ((222 * 3) / 1920 * 100vw) + ((18 * 3) / 1920 * 100vw) );
    }
    .section-doctor-philosophy .section-container {
        width: 100%;
        max-width: 100%;
        height: 100vh;
        position: sticky;
        left: 0;
        top: 0;
        overflow: hidden;
    }
    .section-doctor-philosophy .section-container .section-title .keyword {
        font-size: 1.25vw;
        font-weight: 500;
        color: var(--color-primary);
        font-size: clamp(16px, 1.25vw, 1.25vw);
    }
    .section-doctor-philosophy .section-container .section-title .title {
        font-size: 1.98vw;
        font-weight: 700;
        color: var(--color-text-white);
        font-size: clamp(24px, 1.98vw, 1.98vw);
        margin-top: 0.625vw;
    }
    .section-doctor-philosophy .section-container .section-title .text {
        font-size: 1.04vw;
        font-weight: 400;
        color: var(--color-primary);
        font-size: clamp(14px, 1.04vw, 1.04vw);
    }
    .section-doctor-philosophy .section-container-1 {
        background-image: url(../images/doctor/philosophy_bg_active.png);
        background-size: cover;
        background-position: center;
        transition: background-image 2s;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .section-doctor-philosophy .section-container-1::before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%) scale(1.2);
        background-image: url(../images/doctor/philosophy_bg.png);
        background-size: cover;
        background-position: center;
        transition: 3s;
        transform-origin: top;
    }
    .section-doctor-philosophy .section-container-1 .section-title {
        flex: 1;
        position: relative;
        width: calc(924 / 1920 * 100vw);
        padding: calc(40 / 1080 * 100vh) calc(352 / 1920 * 100vw) calc(240 / 1080 * 100vh) calc(100 / 1920 * 100vw);
        opacity: 0;
        transition: opacity 1s;
    }
    .section-doctor-philosophy .section-container-1 .section-title::before {
        content: "";
        display: block;
        width: 1px;
        height: 0;
        background-color: #fff;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0.15;
        transition: height 2s;
    }
    .section-doctor-philosophy .section-container-1 .section-title .text-animation-container:last-child {
        margin-top: 4.22vw;
    }
    .section-doctor-philosophy .section-container-1 .section-title .text-animation-container {
        position: relative;
        overflow: hidden;
    }
    .section-doctor-philosophy .section-container-1 .section-title .text-animation-container .text-animation {
        transform: translateY(120%);
        opacity: 0;
        transition: transform 2s, opacity 2s;
    }
    .section-doctor-philosophy .section-container-1 .section-content {
        position: relative;
        padding: calc(87 / 1080 * 100vh) calc(230 / 1920 * 100vw) calc(88 / 1080 * 100vh) calc(100 / 1920 * 100vw);
        opacity: 0;
        transition: opacity 1s;
    }
    .section-doctor-philosophy .section-container-1 .section-content::before {
        content: "";
        display: block;
        width: 0;
        height: 1px;
        background-color: #fff;
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0.15;
        transition: width 2s;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul {
        display: flex;
        align-items: center;
        position: relative;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:nth-of-type(1) .content::after {
        content: "+";
        display: block;
        position: absolute;
        right: 1.35vw;
        font-size: 1.4vw;
        font-weight: 500;
        color: var(--color-text-white);
        opacity: 0.8;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:nth-of-type(2) {
        position: absolute;
        left: 0;
        opacity: 0;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:nth-of-type(3) {
        position: absolute;
        left: 0;
        opacity: 0;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:nth-of-type(3) .content {
        background-color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:nth-of-type(3) .content p {
        opacity: 1;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li .content {
        width: 12.5vw;
        aspect-ratio: 1/1;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 0;
        text-align: center;
        background-color: #3b3b3b50;
        border-radius: 50%;
        position: relative;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li .content p {
        font-size: 1.25vw;
        font-weight: 500;
        color: var(--color-text-white);
        font-size: clamp(16px, 1.25vw, 1.25vw);
        opacity: 0.8;
    }
    .section-doctor-philosophy .section-container-2 {
        display: flex;
        opacity: 0;
        transition: opacity 2s;
        pointer-events: none;
    }
    .section-doctor-philosophy .section-container-2 .section-title {
        position: relative;
        width: calc(677 / 1920 * 100vw);
        padding: calc(40 / 1080 * 100vh) 0 calc(240 / 1080 * 100vh) calc(100 / 1920 * 100vw);
    }
    .section-doctor-philosophy .section-container-2 .section-title::before {
        content: "";
        display: block;
        width: 1px;
        height: 0;
        background-color: #fff;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0.15;
        transition: height 2s;
    }
    .section-doctor-philosophy .section-container-2 .section-content {
        flex: 1;
        position: relative;
        padding-top: calc(88 / 1080 * 100vh);
        display: flex;
        flex-direction: column;
    }
    .section-doctor-philosophy .section-container-2 .section-content .text-container {
        flex: 1;
        padding-left: calc(144 / 1920 * 100vw);
    }
    .section-doctor-philosophy .section-container-2 .section-content .text-container .text-animation-container {
        position: relative;
        overflow: hidden;
    }
    .section-doctor-philosophy .section-container-2 .section-content .text-container .text-animation-container .text-animation {
        transform: translateY(120%);
        opacity: 0;
        transition: transform 2s, opacity 2s;
    }
    .section-doctor-philosophy .section-container-2 .section-content .text-container .text-animation-container .text-animation p {
        font-size: calc(20 / 1920 * 100vw);
        font-size: clamp(14px, calc(20 / 1920 * 100vw), calc(20 / 1920 * 100vw));
        color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content .text-container .text-animation-container ~ .text-animation-container {
        margin-top: calc(34 / 1080 * 100vh);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul {
        display: flex;
        align-items: center;
        gap: calc(18 / 1920 * 100vw);
        margin-top: calc(188 / 1080 * 100vh);
        padding-top: calc(98 / 1080 * 100vh);
        padding-left: calc(144 / 1920 * 100vw);
        padding-bottom: calc(88 / 1080 * 100vh);
        position: relative;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul::before {
        content: "";
        display: block;
        width: 0;
        height: 1px;
        background-color: #fff;
        position: absolute;
        right: 0;
        top: 0;
        opacity: 0.15;
        transition: width 2s;
        transform-origin: right;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li {
        opacity: 0;
        transition: 1s;
        width: calc(222 / 1920 * 100vw);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(2n) .icon {
        background-color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(2n) .step {
        color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(2n) .text {
        color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(2), .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(3), .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(4) {
        position: absolute;
        left: 0;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .icon {
        width: calc(222 / 1920 * 100vw);
        aspect-ratio: 1/1;
        background-color: #3b3b3b90;
        border-radius: 50%;
        margin: 0 auto;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 0;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .icon img {
        width: calc(96 / 1080 * 100vh);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .step {
        font-size: calc(18 / 1080 * 100vh);
        font-weight: 500;
        color: #aaa;
        margin-top: calc(29 / 1080 * 100vh);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .step ~ img {
        font-size: calc(222 / 1080 * 100vh);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .text {
        font-size: calc(24 / 1080 * 100vh);
        font-weight: 700;
        color: #aaa;
        margin-top: calc(16 / 1080 * 100vh);
    }
}
@media screen and (max-width: 767px) {
    .section-doctor-philosophy {
        height: auto;
        padding: 0;
    }
    .section-doctor-philosophy .section-container {
        height: auto;
        padding: 90px 2rem;
        background-size: cover;
        background-position: center;
    }
    .section-doctor-philosophy .section-container .section-title {
        word-break: keep-all;
    }
    .section-doctor-philosophy .section-container .section-title .keyword {
        font-size: 20px;
        font-weight: 500;
        color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container .section-title .title {
        font-size: 28px;
        font-weight: 700;
        color: var(--color-text-white);
        margin-top: 4px;
    }
    .section-doctor-philosophy .section-container .section-title .text {
        font-size: 14px;
        font-weight: 400;
        color: var(--color-primary);
        margin-top: 56px;
    }
    .section-doctor-philosophy .section-container-1 {
        background-image: url(../images/doctor/philosophy_bg_active.png);
    }
    .section-doctor-philosophy .section-container-1 .section-content {
        margin-top: 72px;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li {
        width: 200px;
        height: 200px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #3b3b3b50;
        position: relative;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:first-child::after {
        content: "+";
        font-size: 27px;
        font-weight: 500;
        color: var(--color-text-white);
        position: absolute;
        bottom: 0;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:last-child {
        background-color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li:last-child .content p {
        opacity: 1;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li ~ li {
        margin-top: -40px;
    }
    .section-doctor-philosophy .section-container-1 .section-content ul li .content p {
        font-size: 20px;
        font-weight: 500;
        color: var(--color-text-white);
        text-align: center;
        opacity: 0.8;
    }
    .section-doctor-philosophy .section-container-2 {
        background-image: url(../images/doctor/philosophy_bg_2.png);
    }
    .section-doctor-philosophy .section-container-2 .section-title {
        display: none;
    }
    .section-doctor-philosophy .section-container-2 .section-content .text-container {
        display: flex;
        flex-direction: column;
        gap: 16px;
        word-break: keep-all;
    }
    .section-doctor-philosophy .section-container-2 .section-content .text-container .text p {
        font-size: 14px;
        font-weight: 400;
        color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul {
        margin-top: 72px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 24px;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li {
        width: 200px;
        text-align: center;
        position: relative;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li::before {
        content: "";
        display: block;
        width: 9.5px;
        height: 9.5px;
        border-right: 2px solid #aaaaaa;
        position: absolute;
        bottom: 1px;
        left: 50%;
        transform: translateX(-50%) rotate(45deg);
        opacity: 0.32;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li::after {
        content: "";
        display: block;
        width: 2px;
        height: 59px;
        background-color: #aaaaaa;
        margin: 16px auto 0;
        opacity: 0.32;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(2n)::before {
        border-right-color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(2n)::after {
        background-color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:nth-of-type(2n) .icon {
        background-color: var(--color-primary);
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li:last-child::before, .section-doctor-philosophy .section-container-2 .section-content ul li:last-child::after {
        display: none;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .icon {
        width: 200px;
        height: 200px;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        flex-wrap: nowrap;
        gap: 0;
        background-color: #3b3b3b;
        border-radius: 50%;
        margin-bottom: 16px;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .icon img {
        width: 74px;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .step {
        font-size: 20px;
        font-weight: 500;
        color: #aaa;
        display: inline-block;
        margin-right: 10px;
        opacity: 0.5;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li > img {
        display: none;
    }
    .section-doctor-philosophy .section-container-2 .section-content ul li .text {
        font-size: 20px;
        font-weight: 700;
        color: #aaa;
        display: inline-block;
    }
}

.section-doctor-suggest {
    background-image: url(../images/doctor/suggest_bg.png);
    background-size: cover;
    background-position: center;
}
.section-doctor-suggest .section-container {
    padding: 33.9rem 0 34.9rem;
    display: flex;
    position: static;
}
.section-doctor-suggest .section-container .section-title .keyword {
    font-size: 2.4rem;
    font-weight: 500;
    color: var(--color-primary);
}
.section-doctor-suggest .section-container .section-title .title {
    font-size: 4.2rem;
    font-weight: 700;
    color: var(--color-text);
    margin: 1.2rem 0 4.8rem;
}
.section-doctor-suggest .section-container .section-title .text {
    font-size: 2.4rem;
    font-weight: 500;
    color: var(--color-sub-1);
}
.section-doctor-suggest .section-container .section-title .swiper-nav {
    width: fit-content;
    display: flex;
    align-items: center;
    gap: 4rem;
    margin-top: 4.8rem;
}
.section-doctor-suggest .section-container .section-title .swiper-nav .progress-wrapper {
    display: flex;
    align-items: center;
    gap: 1.1rem;
    flex: 1;
}
.section-doctor-suggest .section-container .section-title .swiper-nav .progress-bar-bg {
    width: 9rem;
    height: 2px;
    background-color: var(--color-gray-300);
    position: relative;
}
.section-doctor-suggest .section-container .section-title .swiper-nav .progress-bar {
    height: 100%;
    width: 0%;
    background-color: var(--color-sub-1);
    transition: width 0.3s;
}
.section-doctor-suggest .section-container .section-title .swiper-nav .progress-current,
.section-doctor-suggest .section-container .section-title .swiper-nav .progress-total {
    width: 3rem;
    font-size: 2.4rem;
    color: var(--color-sub-1);
}
.section-doctor-suggest .section-container .section-title .swiper-nav .progress-total {
    color: var(--color-disabled);
}
.section-doctor-suggest .section-container .section-title .swiper-nav .button-group {
    flex-wrap: nowrap;
}
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-prev,
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-next {
    width: 4.8rem;
    height: 4.8rem;
    background-size: 4.8rem;
    background-color: #ffffff50;
    box-shadow: 0px 4px 10px 0px #0000000d;
    transition: var(--transition-duration);
    position: relative;
    margin: 0;
    left: auto;
    right: auto;
}
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-prev::after,
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-next::after {
    display: none;
}
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-prev:hover,
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-next:hover {
    background-color: var(--color-primary);
}
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-prev:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-doctor-suggest .section-container .section-title .swiper-nav .swiper-button-next:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-doctor-suggest .section-container .section-content {
    min-width: 0;
    display: flex;
    align-items: center;
}
.section-doctor-suggest .section-container .section-content .swiper {
    width: calc(956 / 1920 * 100vw);
    position: absolute;
    right: 0;
}
.section-doctor-suggest .section-container .section-content .swiper .swiper-slide {
    transform: scale(0.8);
    transform-origin: left bottom;
    opacity: 0.5;
    transition: 0.6s;
}
.section-doctor-suggest .section-container .section-content .swiper .swiper-slide:has(+ .swiper-slide.swiper-slide-active:last-child) {
    transform-origin: right bottom;
}
.section-doctor-suggest .section-container .section-content .swiper .swiper-slide.swiper-slide-active {
    transform: scale(1);
    opacity: 1;
}
.section-doctor-suggest .section-container .section-content .swiper .swiper-slide img {
    width: 100%;
}
@media screen and (max-width: 1023px) {
    .section-doctor-suggest .section-container {
        flex-direction: column;
        padding: 12rem 0;
    }
    .section-doctor-suggest .section-container .section-title .swiper-nav {
        display: none;
    }
    .section-doctor-suggest .section-container .section-content {
        width: calc(100% + 2rem);
        margin-top: 6rem;
    }
    .section-doctor-suggest .section-container .section-content .swiper {
        width: 100%;
        position: relative;
        right: auto;
    }
}
@media screen and (max-width: 767px) {
    .section-doctor-suggest .section-container .section-title .keyword,
.section-doctor-suggest .section-container .section-title .text {
        font-size: 16px;
    }
    .section-doctor-suggest .section-container .section-title .title {
        font-size: 28px;
    }
}

.section-doctor-standard .section-container {
    padding: 27.9rem 0 25.9rem;
}
.section-doctor-standard .section-container .section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 4rem;
}
.section-doctor-standard .section-container .section-head .section-title {
    position: sticky;
    left: 0;
    top: calc(2rem + var(--size-header-height));
}
.section-doctor-standard .section-container .section-head .section-title .title {
    word-break: keep-all;
}
.section-doctor-standard .section-container .section-head .section-title .title.active span {
    background-position: left;
}
.section-doctor-standard .section-container .section-head .section-title .title.active span:nth-of-type(2) {
    transition-delay: 1s;
}
.section-doctor-standard .section-container .section-head .section-title .title span {
    font-size: 4.8rem;
    font-weight: 700;
    color: var(--color-disabled);
    background: linear-gradient(to right, var(--color-primary) 50%, var(--color-disabled) 50%);
    background-size: 200% 100%;
    background-position: right;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: 1s;
}
.section-doctor-standard .section-container .section-head .section-item-container {
    display: flex;
    flex-shrink: 0;
    gap: 0.8rem;
    position: relative;
}
.section-doctor-standard .section-container .section-head .section-item-container img {
    flex: 1;
    width: 50%;
    max-width: calc(280 / 1920 * 100vw);
}
.section-doctor-standard .section-container .section-content {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.6s ease, transform 0.6s ease;
    padding-top: 10rem;
}
.section-doctor-standard .section-container .section-content.active {
    opacity: 1;
    transform: translateY(0);
}
.section-doctor-standard .section-container .section-content ul {
    position: relative;
}
.section-doctor-standard .section-container .section-content ul li {
    display: flex;
    justify-content: flex-end;
    position: relative;
}
.section-doctor-standard .section-container .section-content ul li.active:has(~ li.active) .tab-img {
    opacity: 0;
}
.section-doctor-standard .section-container .section-content ul li.active:has(~ li.active) .tab-content .tab-icon {
    width: 0;
}
.section-doctor-standard .section-container .section-content ul li.active:has(~ li.active) .tab-content p {
    color: var(--color-disabled);
}
.section-doctor-standard .section-container .section-content ul li.active .tab-img {
    opacity: 1;
}
.section-doctor-standard .section-container .section-content ul li.active .tab-content .tab-icon {
    width: 4.8rem;
    margin-bottom: 2.4rem;
}
.section-doctor-standard .section-container .section-content ul li.active .tab-content p {
    font-weight: 600;
    color: var(--color-text);
}
.section-doctor-standard .section-container .section-content ul li .tab-img {
    width: 42.3rem;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: var(--transition-duration);
}
.section-doctor-standard .section-container .section-content ul li .tab-content {
    width: 56.8rem;
    padding: 3.7rem 1rem;
    border-bottom: 1px solid var(--color-gray-300);
}
.section-doctor-standard .section-container .section-content ul li .tab-content .tab-icon {
    width: 0;
    transition: var(--transition-duration);
}
.section-doctor-standard .section-container .section-content ul li .tab-content p {
    font-size: 2.4rem;
    font-weight: 500;
    color: var(--color-disabled);
    transition: var(--transition-duration);
}
@media screen and (max-width: 1239px) {
    .section-doctor-standard .section-container .section-content ul li .tab-content {
        width: calc(568 / 1239 * 100vw);
    }
    .section-doctor-standard .section-container .section-content ul li .tab-img {
        width: calc(423 / 1239 * 100vw);
    }
}
@media screen and (max-width: 1023px) {
    .section-doctor-standard .section-container {
        padding: 12rem 0;
    }
}
@media screen and (max-width: 767px) {
    .section-doctor-standard .section-container .section-head {
        flex-direction: column;
    }
    .section-doctor-standard .section-container .section-head .section-title {
        position: relative;
        top: auto;
    }
    .section-doctor-standard .section-container .section-head .section-title .title span {
        font-size: 28px;
    }
    .section-doctor-standard .section-container .section-head .section-item-container {
        width: 100%;
    }
    .section-doctor-standard .section-container .section-head .section-item-container img {
        max-width: 50%;
    }
    .section-doctor-standard .section-container .section-content ul li {
        width: 100%;
        flex-direction: column;
    }
    .section-doctor-standard .section-container .section-content ul li .tab-content {
        width: 100%;
    }
    .section-doctor-standard .section-container .section-content ul li .tab-img {
        width: 100%;
        position: relative;
        left: auto;
        top: auto;
        display: none;
    }
    .section-doctor-standard .section-container .section-content ul li.active .tab-img {
        display: block;
    }
}

.section-doctor-slogan {
    height: 500vh;
    position: relative;
    padding: 0;
}
.section-doctor-slogan.animation-2 .section-container .section-title span, .section-doctor-slogan.animation-3 .section-container .section-title span, .section-doctor-slogan.animation-4 .section-container .section-title span, .section-doctor-slogan.animation-5 .section-container .section-title span {
    background-position: left;
}
.section-doctor-slogan.animation-2 .section-container .section-title span:nth-of-type(1), .section-doctor-slogan.animation-3 .section-container .section-title span:nth-of-type(1), .section-doctor-slogan.animation-4 .section-container .section-title span:nth-of-type(1), .section-doctor-slogan.animation-5 .section-container .section-title span:nth-of-type(1) {
    transition-delay: 0s;
}
.section-doctor-slogan.animation-2 .section-container .section-title span:nth-of-type(2), .section-doctor-slogan.animation-3 .section-container .section-title span:nth-of-type(2), .section-doctor-slogan.animation-4 .section-container .section-title span:nth-of-type(2), .section-doctor-slogan.animation-5 .section-container .section-title span:nth-of-type(2) {
    transition-delay: 1s;
}
.section-doctor-slogan.animation-2 .section-container .section-title span:nth-of-type(3), .section-doctor-slogan.animation-3 .section-container .section-title span:nth-of-type(3), .section-doctor-slogan.animation-4 .section-container .section-title span:nth-of-type(3), .section-doctor-slogan.animation-5 .section-container .section-title span:nth-of-type(3) {
    transition-delay: 2s;
}
.section-doctor-slogan.animation-2 .section-container .section-title span:nth-of-type(4), .section-doctor-slogan.animation-3 .section-container .section-title span:nth-of-type(4), .section-doctor-slogan.animation-4 .section-container .section-title span:nth-of-type(4), .section-doctor-slogan.animation-5 .section-container .section-title span:nth-of-type(4) {
    transition-delay: 3s;
}
.section-doctor-slogan.animation-4 .section-container .section-content .section-item-container .item-1 {
    background-color: #202020;
    transform-origin: center;
    top: 0;
    transform: scale(1);
}
.section-doctor-slogan.animation-4 .section-container .section-content .section-item-container .item-4 .text-box {
    transition: opacity 0.5s ease 2s, transform 1s;
    opacity: 1;
}
.section-doctor-slogan.animation-4 .section-container .section-content .section-item-container .item-4 .text-box .text .text-animation-container .text-animation {
    transform: translateY(0);
    opacity: 1;
}
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-1 {
    background-color: #202020;
    transform-origin: center;
    top: 0;
    transform: scale(1);
}
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-2,
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-3 {
    opacity: 1;
}
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-4 {
    transition-delay: 1s;
    opacity: 0;
}
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-4 .text-box {
    transition: opacity 0.5s ease 2s, transform 1s;
    opacity: 1;
}
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-4 .text-box:nth-of-type(1) {
    transform: translateY(-100%);
}
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-4 .text-box:nth-of-type(2) {
    transform: translateY(100%);
}
.section-doctor-slogan.animation-5 .section-container .section-content .section-item-container .item-4 .text-box .text .text-animation-container .text-animation {
    transform: translateY(0);
    opacity: 1;
}
.section-doctor-slogan .section-container {
    width: 100%;
    max-width: 100%;
    height: 100vh;
    overflow: hidden;
    padding-top: calc(382 / 1080 * 100vh);
    position: sticky;
    left: 0;
    top: 0;
    overflow: hidden;
}
.section-doctor-slogan .section-container .section-title {
    text-align: center;
}
.section-doctor-slogan .section-container .section-title span {
    font-size: calc(32 / 1920 * 100vw);
    font-weight: 600;
    color: var(--color-disabled);
    font-size: clamp(2rem, calc(32 / 1920 * 100vw), calc(32 / 1920 * 100vw));
    background: linear-gradient(to right, var(--color-text) 50%, var(--color-disabled) 50%);
    background-size: 200% 100%;
    background-position: right;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: 2s;
    text-align: center;
    display: block;
    word-break: keep-all;
}
.section-doctor-slogan .section-container .section-title span ~ span {
    margin-top: calc(8 / 1080 * 100vh);
}
.section-doctor-slogan .section-container .section-title span.active {
    background-position: left;
}
.section-doctor-slogan .section-container .section-content {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
}
.section-doctor-slogan .section-container .section-content .section-item-container {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-1 {
    min-width: calc(1142 / 1920 * 100vw);
    top: calc(487 / 1080 * 100vh);
    transform: scale(0.595);
    transition: top 1s ease 0s, transform 0.5s ease 1s, background-color 0.5s ease 1s;
    display: flex;
    align-items: center;
    overflow: hidden;
    pointer-events: auto;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-1 img {
    max-width: none;
    height: 100%;
    mix-blend-mode: multiply;
    transition: 1s;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 1920px;
    height: 1080px;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-2,
.section-doctor-slogan .section-container .section-content .section-item-container .item-3 {
    width: 50%;
    opacity: 0;
    transition: opacity 1s;
    display: flex;
    align-items: center;
    pointer-events: none;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-2 img,
.section-doctor-slogan .section-container .section-content .section-item-container .item-3 img {
    max-width: none;
    height: 100%;
    width: 960px;
    height: 1080px;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-2 img:nth-of-type(2),
.section-doctor-slogan .section-container .section-content .section-item-container .item-3 img:nth-of-type(2) {
    display: none;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-2 {
    justify-content: flex-end;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-3 {
    left: auto;
    right: 0;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 img {
    max-width: none;
    height: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 1920px;
    height: 540px;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box {
    width: 100%;
    height: 50%;
    opacity: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box:nth-of-type(2) .text .text-animation-container .text-animation {
    transition: transform 0.5s ease 2.2s, opacity 0.5s ease 2.2s;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box .text {
    color: var(--color-primary);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    font-size: calc(42 / 1920 * 100vw);
    font-weight: 700;
    color: var(--color-primary);
    font-size: clamp(2.4rem, calc(42 / 1920 * 100vw), calc(42 / 1920 * 100vw));
    padding: calc(10 / 1080 * 100vh) 0;
    white-space: nowrap;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box .text .text-animation-container {
    position: relative;
    overflow: hidden;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box .text .text-animation-container .text-animation {
    transform: translateY(120%);
    opacity: 0;
    transition: transform 0.5s ease 2s, opacity 0.5s ease 2s;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box-1 {
    align-items: flex-end;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box-1 .text {
    bottom: 0;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box-1 img {
    bottom: 0;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box-2 {
    align-items: flex-start;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box-2 .text {
    top: 0;
}
.section-doctor-slogan .section-container .section-content .section-item-container .item-4 .text-box-2 img {
    top: 0;
}
@media screen and (max-width: 767px) {
    .section-doctor-slogan .section-container .section-content .section-item-container .item-1 {
        transform: scale(1);
        top: 60%;
    }
    .section-doctor-slogan .section-container .section-content .section-item-container .item-2 img:nth-of-type(1),
.section-doctor-slogan .section-container .section-content .section-item-container .item-3 img:nth-of-type(1) {
        display: none;
    }
    .section-doctor-slogan .section-container .section-content .section-item-container .item-2 img:nth-of-type(2),
.section-doctor-slogan .section-container .section-content .section-item-container .item-3 img:nth-of-type(2) {
        display: block;
    }
}

/* ────────────────────────────────
    pages/column
──────────────────────────────── */
.section-column-visual {
    background-color: var(--color-gray-100);
    background-image: url(../images/post/visual.png);
    background-size: cover;
    background-position: center;
}
.section-column-visual .section-container {
    padding: 3.6rem 0 1.9rem;
}
.section-column-visual .section-container .section-title {
    position: absolute;
    left: 0;
    top: 2.5rem;
    z-index: 2;
}
.section-column-visual .section-container .section-title .title {
    font-size: 3.6rem;
    font-weight: 600;
    color: var(--color-primary);
}
.section-column-visual .section-container .section-title .text {
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--color-sub-2);
    margin-top: 1.2rem;
}
.section-column-visual .section-container .section-content .swiper-slide {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    z-index: 1;
}
.section-column-visual .section-container .section-content .swiper-slide img {
    width: 51.5rem;
    transform: scale(0);
    opacity: 0;
    transition: all 0.6s ease;
}
.section-column-visual .section-container .section-content .swiper-slide.swiper-slide-active img {
    transform: scale(1);
    opacity: 1;
}
.section-column-visual .section-container .section-content .swiper-nav {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-slide-content {
    width: 51.5rem;
    position: relative;
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-prev,
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-next {
    width: 4.8rem;
    height: 4.8rem;
    background-size: 4.8rem;
    background-color: #ffffff50;
    box-shadow: 0px 4px 10px 0px #0000000d;
    transition: var(--transition-duration);
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-prev::after,
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-next::after {
    display: none;
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-prev:hover,
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-next:hover {
    background-color: var(--color-primary);
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-prev {
    left: -4.8rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-prev:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-next {
    right: -4.8rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-column-visual .section-container .section-content .swiper-nav .swiper-button-next:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-column-visual .section-container .section-tab {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
    border: 1px solid var(--color-border-2);
    box-shadow: 0px 10px 16px 0px #00000008;
    backdrop-filter: blur(4px);
    border-radius: 12px;
    padding: 0.8rem;
}
.section-column-visual .section-container .section-tab ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 1rem;
    flex-wrap: wrap;
}
.section-column-visual .section-container .section-tab ul::after {
    display: none;
}
.section-column-visual .section-container .section-tab ul li {
    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
}
.section-column-visual .section-container .section-tab ul li button {
    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    height: 4.8rem;
    border-radius: 6px;
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-sub-2);
    transition: var(--transition-duration);
    padding: 0 1rem;
    white-space: nowrap;
}
.section-column-visual .section-container .section-tab ul li button:hover {
    color: var(--color-text);
}
.section-column-visual .section-container .section-tab ul li button.active {
    background-color: #373737;
    box-shadow: 0px 4px 9px 0px #0000001a;
    color: var(--color-text-white);
}
@media screen and (max-width: 1023px) {
    .section-column-visual .section-container {
        padding: 6rem 0 1.2rem;
    }
    .section-column-visual .section-container .section-title {
        top: 6rem;
    }
    .section-column-visual .section-container .section-content .swiper-nav {
        display: none;
    }
}
@media screen and (max-width: 767px) {
    .section-column-visual {
        background-position: top 15.2rem center;
    }
    .section-column-visual .section-container {
        padding: 6rem 0 1.2rem;
    }
    .section-column-visual .section-container .section-title {
        position: relative;
        left: auto;
        top: auto;
    }
    .section-column-visual .section-container .section-title .title {
        font-size: 28px;
    }
    .section-column-visual .section-container .section-title .text {
        font-size: 16px;
    }
    .section-column-visual .section-container .section-tab ul {
        gap: 4px;
    }
    .section-column-visual .section-container .section-tab ul li button {
        font-size: 11px;
        padding: 0 4px;
    }
    .section-column-visual .section-container .section-content {
        margin: 1.2rem 0;
    }
    .section-column-visual .section-container .section-content .swiper-nav {
        display: none;
    }
}

.section-column-more {
    background-size: cover;
    background-position: center;
    background-image: url(../images/column/more_bg.png);
    padding: 11.9rem 2rem 13.4rem;
}
.section-column-more .section-container {
    display: flex;
    justify-content: space-between;
    gap: 6rem 4rem;
}
.section-column-more .section-container .section-title .text {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 0.8rem;
}
.section-column-more .section-container .section-title .title {
    font-size: 3.2rem;
    font-weight: 700;
    color: var(--color-text);
}
.section-column-more .section-container .section-title a {
    width: fit-content;
    height: 4.6rem;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-text);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    gap: 1rem;
    border-bottom: 2px solid var(--color-text);
    margin-top: 4.2rem;
}
.section-column-more .section-container .section-title a::after {
    content: "";
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23111111' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
    background-size: cover;
}
.section-column-more .section-container .section-title .swiper-nav {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    display: flex;
    gap: 0.4rem;
}
.section-column-more .section-container .section-title .swiper-nav .swiper-button-prev,
.section-column-more .section-container .section-title .swiper-nav .swiper-button-next {
    width: 4.8rem;
    height: 4.8rem;
    background-size: 4.8rem;
    background-color: #ffffff50;
    box-shadow: 0px 4px 10px 0px #0000000d;
    transition: var(--transition-duration);
    position: relative;
    margin: 0;
    left: auto;
    right: auto;
}
.section-column-more .section-container .section-title .swiper-nav .swiper-button-prev::after,
.section-column-more .section-container .section-title .swiper-nav .swiper-button-next::after {
    display: none;
}
.section-column-more .section-container .section-title .swiper-nav .swiper-button-prev:hover,
.section-column-more .section-container .section-title .swiper-nav .swiper-button-next:hover {
    background-color: var(--color-primary);
}
.section-column-more .section-container .section-title .swiper-nav .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-column-more .section-container .section-title .swiper-nav .swiper-button-prev:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m21 17-7 7 7 7M14 24h21'/%3E%3C/svg%3E");
}
.section-column-more .section-container .section-title .swiper-nav .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23767676' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-column-more .section-container .section-title .swiper-nav .swiper-button-next:hover {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' fill='none' viewBox='0 0 48 48'%3E%3Cpath stroke='%23ffffff' stroke-width='2' d='m27 31 7-7-7-7M34 24H13'/%3E%3C/svg%3E");
}
.section-column-more .section-container .section-content {
    flex: 1;
    min-width: 0;
}
.section-column-more .section-container .section-content .swiper {
    width: 73.2rem;
    margin-right: 0;
}
.section-column-more .section-container .section-content .post-card {
    padding: 3rem 2.8rem;
    background-color: #ffffff50;
    backdrop-filter: blur(4px);
    position: relative;
    transition: 0.4s;
}
.section-column-more .section-container .section-content .post-card::after {
    content: "";
    display: block;
    width: 0;
    height: 2px;
    background-color: var(--color-primary);
    position: absolute;
    left: 0;
    top: 0;
    transition: 0.4s;
}
.section-column-more .section-container .section-content .post-card:hover {
    background-color: #ffffff;
}
.section-column-more .section-container .section-content .post-card:hover::after {
    width: 100%;
}
.section-column-more .section-container .section-content .post-card .category {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.section-column-more .section-container .section-content .post-card .category span {
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--color-sub-2);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.section-column-more .section-container .section-content .post-card .category span::before {
    content: "·";
    display: block;
}
.section-column-more .section-container .section-content .post-card .category span:first-child {
    color: var(--color-primary);
}
.section-column-more .section-container .section-content .post-card .category span:first-child::before {
    display: none;
}
.section-column-more .section-container .section-content .post-card .post-title {
    line-height: 1.5;
    height: calc(1.5em * 2);
    margin: 1.4rem 0;
}
.section-column-more .section-container .section-content .post-card .post-title a {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--color-text);
}
.section-column-more .section-container .section-content .post-card .post-date {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-sub-2);
}
@media screen and (max-width: 1023px) {
    .section-column-more {
        padding: 6rem 2rem;
    }
    .section-column-more .section-container {
        flex-direction: column;
    }
    .section-column-more .section-container .section-title .swiper-nav {
        display: none;
    }
    .section-column-more .section-container .section-content .swiper {
        width: 100%;
    }
}

/* ────────────────────────────────
    pages/press
──────────────────────────────── */
.section-press-visual {
    background-image: url(../images/press/visual_list.png);
    background-size: cover;
    background-position: center;
}
.section-press-visual .section-container {
    padding: 25.1rem 0 6.8rem;
}
.section-press-visual .section-container .section-title {
    width: fit-content;
}
.section-press-visual .section-container .section-title .title {
    font-size: 3.6rem;
    font-weight: 600;
    color: var(--color-primary);
    line-height: 1.3;
    padding-left: 2rem;
    position: relative;
    z-index: 2;
    word-break: keep-all;
}
.section-press-visual .section-container .section-title .title::before {
    content: "";
    display: block;
    width: 5px;
    height: calc(100% - 1.1rem);
    background-color: var(--color-primary);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.section-press-visual .section-container .section-title .text {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text-white);
    margin-top: 5.6rem;
    position: relative;
    z-index: 2;
    word-break: keep-all;
}
.section-press-visual .section-container .section-title img {
    width: 60.2rem;
    position: absolute;
    right: -8rem;
    bottom: 0;
    pointer-events: none;
    z-index: 1;
}
@media screen and (max-width: 767px) {
    .section-press-visual .section-container {
        padding: 6rem 0;
    }
    .section-press-visual .section-container .section-title .title {
        font-size: 28px;
    }
    .section-press-visual .section-container .section-title img {
        display: none;
    }
}

.section-press-banner {
    background-image: url(../images/press/banner_bg.png);
    background-size: cover;
    background-position: center;
}
.section-press-banner .section-container {
    padding: 17.1rem 0 18.3rem;
}
.section-press-banner .section-container .section-title .text {
    width: fit-content;
    position: relative;
    font-size: 1.8rem;
    font-weight: 500;
    color: var(--color-text-white);
    text-align: center;
    margin: 0 auto;
    word-break: keep-all;
}
.section-press-banner .section-container .section-title .text::before, .section-press-banner .section-container .section-title .text::after {
    content: "";
    display: block;
    width: 2.2rem;
    height: 2.1rem;
    background-size: cover;
    position: absolute;
}
.section-press-banner .section-container .section-title .text::before {
    background-image: url(../images/press/banner_item_1.png);
    left: 0;
    top: -3.8rem;
}
.section-press-banner .section-container .section-title .text::after {
    background-image: url(../images/press/banner_item_2.png);
    right: 0;
    bottom: -3.8rem;
}
@media screen and (max-width: 767px) {
    .section-press-banner .section-container .section-title .text {
        font-size: 13px;
    }
}

/* ────────────────────────────────
    pages/consultation
──────────────────────────────── */
.section-consultation {
    background-image: url(../images/consultation/bg.png);
    background-position: center;
}
.section-consultation .section-container {
    padding: 12.3rem 0 15.4rem;
    display: flex;
    gap: 15rem;
}
.section-consultation .section-container .section-title .title {
    font-size: 4.2rem;
    font-weight: 700;
    background: linear-gradient(191.12deg, #ff7b00 27.7%, #ff6200 87.05%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 130%;
}
.section-consultation .section-container .section-title .text {
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--color-text-white);
    line-height: 170%;
    opacity: 0.8;
    margin-top: 4rem;
}
.section-consultation .section-container .section-content {
    flex: 1;
}
.section-consultation .section-container .section-content .form-container .form-label {
    color: var(--color-text-white);
}
.section-consultation .section-container .section-content .form-container .input,
.section-consultation .section-container .section-content .form-container .textarea {
    font-size: 14px;
    color: var(--color-text-white);
    background-color: #4a4a4a20;
    border-color: transparent;
}
.section-consultation .section-container .section-content .form-container .input::placeholder,
.section-consultation .section-container .section-content .form-container .textarea::placeholder {
    color: var(--color-gray-500);
}
.section-consultation .section-container .section-content .form-container .checkbox label {
    font-size: 14px;
    color: var(--color-text-white);
}
.section-consultation .section-container .section-content .form-container .checkbox label::after {
    background-position: center calc(50% + 0.2rem);
}
.section-consultation .section-container .section-content .form-container .checkbox button {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-text-white);
    text-decoration: underline;
    margin-left: 1rem;
}
.section-consultation .section-container .section-content .form-container .form-msg {
    color: var(--color-text-white);
}
@media screen and (max-width: 1023px) {
    .section-consultation .section-container {
        padding: 6rem 0;
        flex-direction: column;
        gap: 5rem;
    }
}
@media screen and (max-width: 767px) {
    .section-consultation .section-container .section-title .title {
        font-size: 28px;
    }
    .section-consultation .section-container .section-title .text {
        font-size: 14px;
    }
}


.post-content .table-scroll-wrap {
    width: 100%;
    max-width: 100%;
    margin: 24px 0;
}

.post-content .table-scroll-guide {
    margin: 0 0 8px;
    font-size: 14px;
    color: #666;
}

.post-content .table-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.post-content .table-scroll table {
    min-width: 900px;
}

.post-content .table-scroll table tr:first-child > th,
.post-content .table-scroll table tr:first-child > td {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #fff;
}

.post-content .table-scroll table tr > th:first-child,
.post-content .table-scroll table tr > td:first-child {
    position: sticky;
    left: 0;
    z-index: 4;
    background: #fff;
}

.post-content .table-scroll table tr:first-child > th:first-child,
.post-content .table-scroll table tr:first-child > td:first-child {
    z-index: 5;
}

.post-content {
    width: 100%;
    line-height: 1.9;
    word-break: keep-all;
}

.post-content p.editor-body-normal {
    line-height: 1.6;
    margin-bottom: 1em;
}

.post-content p.editor-body-tight {
    line-height: 1.3;
    margin-bottom: 0.5em;
}

.post-content p.editor-body-loose {
    line-height: 2;
    margin-bottom: 1.8em;
}