@layer reset, tokens, base, libs, layouts, components, pages;

/* stylelint-disable */
@layer reset {

    /*! destyle.css v4.0.1 | MIT License | https://github.com/nicolas-cusan/destyle.css */

    /* Reset box-model and set borders */
    /* ============================================ */

    *,
    ::before,
    ::after {
        box-sizing: border-box;
        border-style: solid;
        border-width: 0;
        min-width: 0;
    }

    /* Document */
    /* ============================================ */

    /**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */

    html {
        line-height: 1.15;
        /* 1 */
        -webkit-text-size-adjust: 100%;
        /* 2 */
        -webkit-tap-highlight-color: transparent;
        /* 3*/
    }

    /* Sections */
    /* ============================================ */

    /**
 * Remove the margin in all browsers.
 */

    body {
        margin: 0;
    }

    /**
 * Render the `main` element consistently in IE.
 */

    main {
        display: block;
    }

    /* Vertical rhythm */
    /* ============================================ */

    p,
    table,
    blockquote,
    address,
    pre,
    iframe,
    form,
    figure,
    dl {
        margin: 0;
    }

    /* Headings */
    /* ============================================ */

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-size: inherit;
        font-weight: inherit;
        margin: 0;
    }

    /* Lists (enumeration) */
    /* ============================================ */

    ul,
    ol {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    /* Lists (definition) */
    /* ============================================ */

    dt {
        font-weight: bold;
    }

    dd {
        margin-left: 0;
    }

    /* Grouping content */
    /* ============================================ */

    /**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

    hr {
        box-sizing: content-box;
        /* 1 */
        height: 0;
        /* 1 */
        overflow: visible;
        /* 2 */
        border-top-width: 1px;
        margin: 0;
        clear: both;
        color: inherit;
    }

    /**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

    pre {
        font-family: monospace, monospace;
        /* 1 */
        font-size: inherit;
        /* 2 */
    }

    address {
        font-style: inherit;
    }

    /* Text-level semantics */
    /* ============================================ */

    /**
 * Remove the gray background on active links in IE 10.
 */

    a {
        background-color: transparent;
        text-decoration: none;
        color: inherit;
    }

    /**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

    abbr[title] {
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted;
        /* 2 */
    }

    /**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

    b,
    strong {
        font-weight: bolder;
    }

    /**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

    code,
    kbd,
    samp {
        font-family: monospace, monospace;
        /* 1 */
        font-size: inherit;
        /* 2 */
    }

    /**
 * Add the correct font size in all browsers.
 */

    small {
        font-size: 80%;
    }

    /**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

    sub,
    sup {
        font-size: 75%;
        line-height: 0;
        position: relative;
        vertical-align: baseline;
    }

    sub {
        bottom: -0.25em;
    }

    sup {
        top: -0.5em;
    }

    /* Replaced content */
    /* ============================================ */

    /**
 * Prevent vertical alignment issues.
 */

    svg,
    img,
    embed,
    object,
    iframe {
        vertical-align: bottom;
    }

    /* Forms */
    /* ============================================ */

    /**
 * Reset form fields to make them styleable.
 * 1. Make form elements stylable across systems iOS especially.
 * 2. Inherit text-transform from parent.
 */

    button,
    input,
    optgroup,
    select,
    textarea {
        -webkit-appearance: none;
        /* 1 */
        -moz-appearance: none;
        appearance: none;
        vertical-align: middle;
        color: inherit;
        font: inherit;
        background: transparent;
        padding: 0;
        margin: 0;
        border-radius: 0;
        text-align: inherit;
        text-transform: inherit;
        /* 2 */
    }

    /**
 * Correct cursors for clickable elements.
 */

    button,
    [type="button"],
    [type="reset"],
    [type="submit"] {
        cursor: pointer;
    }

    button:disabled,
    [type="button"]:disabled,
    [type="reset"]:disabled,
    [type="submit"]:disabled {
        cursor: default;
    }

    /**
 * Improve outlines for Firefox and unify style with input elements & buttons.
 */

    :-moz-focusring {
        outline: auto;
    }

    select:disabled {
        opacity: inherit;
    }

    /**
 * Remove padding
 */

    option {
        padding: 0;
    }

    /**
 * Reset to invisible
 */

    fieldset {
        margin: 0;
        padding: 0;
        min-width: 0;
    }

    legend {
        padding: 0;
    }

    /**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

    progress {
        vertical-align: baseline;
    }

    /**
 * Remove the default vertical scrollbar in IE 10+.
 */

    textarea {
        overflow: auto;
    }

    /**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

    [type="number"]::-webkit-inner-spin-button,
    [type="number"]::-webkit-outer-spin-button {
        height: auto;
    }

    /**
 * Correct the outline style in Safari.
 */

    [type="search"] {
        outline-offset: -2px;
        /* 1 */
    }

    /**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

    [type="search"]::-webkit-search-decoration {
        -webkit-appearance: none;
    }

    /**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Fix font inheritance.
 */

    ::-webkit-file-upload-button {
        -webkit-appearance: button;
        /* 1 */
        font: inherit;
        /* 2 */
    }

    /**
 * Fix appearance for Firefox
 */
    [type="number"] {
        -moz-appearance: textfield;
    }

    /**
 * Clickable labels
 */

    label[for] {
        cursor: pointer;
    }

    /* Interactive */
    /* ============================================ */

    /*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

    details {
        display: block;
    }

    /*
 * Add the correct display in all browsers.
 */

    summary {
        display: list-item;
    }

    /*
 * Remove outline for editable content.
 */

    [contenteditable]:focus {
        outline: auto;
    }

    /* Tables */
    /* ============================================ */

    /**
1. Correct table border color inheritance in all Chrome and Safari.
*/

    table {
        border-color: inherit;
        /* 1 */
        border-collapse: collapse;
    }

    caption {
        text-align: left;
    }

    td,
    th {
        vertical-align: top;
        padding: 0;
    }

    th {
        text-align: left;
        font-weight: bold;
    }
}

@layer root {
    :root {
        --font-family-base: "Noto Sans JP", "YuGothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
        --font-family-zen-maru: "Zen Maru Gothic", sans-serif;
        --font-family-barlow: "Barlow", sans-serif;
        /* color */
        --color-text-base: #2e393c;
        --color-white: #fff;
        --color-black: #000;
        --color-black-02: #222;
        --color-light-gray: #f0f5f7;
        --color-point-blue: #0082bc;
        --color-light-blue: #0da5e6;
        --color-light-blue-02: #ade8ef;
        --color-navy-blue: #3e4c6d;
        --color-mint-blue: #c6ecef;
        /* z-index */
        --z-index-btn-home: 10;
    }
}

@layer base {

    *,
    *::before,
    *::after {
        box-sizing: border-box;
    }

    html {
        font-size: 100%;
    }

    body {
        color: var(--color-text-base);
        font-family: var(--font-family-base);
        font-size: 1rem;
        -webkit-font-smoothing: antialiased;
        -webkit-text-size-adjust: 100%;
        -moz-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    .js-scroll-fade {
        will-change: opacity;
    }

    .js-scroll-blur {
        will-change: filter;
    }
}

@layer layouts {
    .l-footer {
        display: block;
    }
}

@layer layouts {
    .l-header {
        display: block;
    }
}

@layer components {
    .box-schedule {
        position: relative;
        display: inline-block;
        padding: 50px;
        border: 2px solid #e4f7f8;
        border-radius: 0px 10px 10px 10px;
        margin-top: 67px;
        background: rgba(255, 255, 255, 0.7);
    }

    @media (max-width: 767px) {
        .box-schedule {
            display: block;
            padding: 22px;
        }
    }

    @media (max-width: 767px) {
        .box-schedule {
            margin-top: 360px;
        }
    }

    .box-schedule__heading {
        position: absolute;
        bottom: 100%;
        left: -2px;
        padding: 9px 25px;
        border-radius: 5px 5px 0 0;
        background-color: #e4f7f8;
        color: var(--color-navy-blue);
        font-family: var(--font-family-barlow);
        font-size: 0.875rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 1;
    }

    @media (max-width: 767px) {
        .box-schedule__heading {
            padding: 8px 23px;
            font-size: 0.788125rem;
        }
    }

    .box-schedule__list {
        display: flex;
        flex-direction: column;
        gap: 17px;
    }

    @media (max-width: 767px) {
        .box-schedule__list {
            gap: 12px;
        }
    }

    .box-schedule__list>div {
        display: flex;
        gap: 10px;
    }

    @media (max-width: 767px) {
        .box-schedule__list>div {
            gap: 7px;
        }
    }

    .box-schedule__list dt {
        display: flex;
        flex-shrink: 0;
        align-items: center;
    }

    .box-schedule__list dt>span {
        position: relative;
        display: block;
        padding-right: 14px;
        color: var(--color-light-blue);
        font-family: var(--font-family-barlow);
        font-size: 1.375rem;
        font-weight: normal;
        letter-spacing: 0.03em;
        line-height: 1;
    }

    @media (max-width: 767px) {
        .box-schedule__list dt>span {
            padding-right: 9px;
            font-size: 0.9375rem;
        }
    }

    .box-schedule__list dt>span::after {
        position: absolute;
        top: 50%;
        right: 0;
        width: 6px;
        height: 8px;
        background: url(/tsushin/special/assets/images/ico-arrow-right-blue-02.svg) no-repeat;
        background-size: contain;
        content: "";
        transform: translateY(-50%);
    }

    @media (max-width: 767px) {
        .box-schedule__list dt>span::after {
            width: 4px;
            height: 6px;
        }
    }

    .box-schedule__list dt>span.is-jp {
        font-family: var(--font-family-base);
        font-size: 0.875rem;
    }

    @media (max-width: 767px) {
        .box-schedule__list dt>span.is-jp {
            font-size: 0.625rem;
        }
    }

    .box-schedule__list dd {
        flex: 1;
    }

    .box-schedule__date {
        display: flex;
        flex-wrap: wrap;
        font-family: var(--font-family-barlow);
        font-size: 2.104375rem;
        gap: 20px;
        line-height: 1;
    }

    @media (max-width: 767px) {
        .box-schedule__date {
            font-size: 1.375rem;
            gap: 10px;
        }
    }

    .box-schedule__time {
        font-family: var(--font-family-barlow);
        font-feature-settings: "pwid" on, "palt" on;
        font-size: 3.125rem;
        letter-spacing: 0.03em;
        line-height: 1;
    }

    @media (max-width: 767px) {
        .box-schedule__time {
            font-size: 2.125rem;
        }
    }

    .box-schedule__tag {
        display: inline-block;
        padding: 8px 20px;
        border: 1px solid var(--color-light-blue);
        border-radius: 5px;
        margin: 26px 0 32px;
        color: var(--color-light-blue);
        font-size: 0.875rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 1;
    }

    @media (max-width: 767px) {
        .box-schedule__tag {
            padding: 6px 14px;
            margin: 14px 0 17px 50px;
            font-size: 0.596875rem;
        }
    }
}

@layer components {
    .btn-home {
        position: fixed;
        z-index: var(--z-index-btn-home);
        top: 50px;
        left: 50px;
        display: flex;
        width: 70px;
        height: 70px;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--color-point-blue);
        border-radius: 50%;
        color: var(--color-point-blue);
        font-family: var(--font-family-barlow);
        font-size: 0.9375rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        transition: transform 0.2s ease-out;
    }

    @media (max-width: 767px) {
        .btn-home {
            top: 22px;
            left: 22px;
            width: 63px;
            height: 63px;
            font-size: 0.84375rem;
        }
    }

    @media (any-hover: hover) {
        .btn-home:hover {
            transform: scale(1.1);
        }
    }
}

@layer components {
    .btn-primary {
        display: inline-block;
        padding: 20px 30px;
        border: 1px solid var(--color-point-blue);
        border-radius: 30px;
        background-color: var(--color-white);
        color: var(--color-navy-blue);
        transition-duration: 0.2s;
        transition-property: background-color, color;
        transition-timing-function: ease-out;
    }

    @media (max-width: 767px) {
        .btn-primary {
            padding: 17px 26px;
        }
    }

    @media (any-hover: hover) {
        .btn-primary:hover {
            background-color: var(--color-point-blue);
            color: var(--color-white);
        }

        .btn-primary:hover>span::after {
            background-image: url(/tsushin/special/assets/images/ico-arrow-right-white.svg);
        }
    }

    .btn-primary>span {
        position: relative;
        display: block;
        padding-right: 35px;
        font-size: 0.875rem;
        font-weight: 500;
        line-height: 1;
    }

    @media (max-width: 767px) {
        .btn-primary>span {
            padding-right: 32px;
            font-size: 0.8125rem;
        }
    }

    .btn-primary>span::after {
        position: absolute;
        top: 50%;
        right: 0;
        width: 28px;
        height: 5px;
        background: url(/tsushin/special/assets/images/ico-arrow-right-blue.svg) no-repeat;
        background-size: contain;
        content: "";
        transform: translateY(-50%);
    }

    @media (max-width: 767px) {
        .btn-primary>span::after {
            width: 26px;
        }
    }
}

@layer components {
    .card-campus-info {
        display: flex;
        align-items: center;
        padding: 21px 22px 21px 35px;
        border-radius: 10px;
        background-color: var(--color-white);
        gap: 10px;
        text-align: left;
    }

    @media (max-width: 879px) {
        .card-campus-info {
            flex-direction: column;
            align-items: flex-start;
            padding: 18px;
            gap: 6px;
        }
    }

    .card-campus-info__name {
        min-width: 202px;
        flex-shrink: 0;
        font-family: var(--font-family-zen-maru);
        font-size: 1.5rem;
        font-weight: 500;
        letter-spacing: 0.05em;
        line-height: 1.5;
    }

    @media (max-width: 879px) {
        .card-campus-info__name {
            font-size: 1.125rem;
        }
    }

    .card-campus-info__address {
        flex: 1;
        font-feature-settings: "pwid" on, "palt" on;
        font-size: 0.8125rem;
        font-weight: normal;
        letter-spacing: 0.03em;
        line-height: 1.5;
    }

    @media (max-width: 879px) {
        .card-campus-info__address {
            font-size: 0.61875rem;
        }
    }

    .card-campus-info__address>span {
        display: block;
    }

    .card-campus-info__tel {
        min-width: 263px;
        flex-shrink: 0;
        color: var(--color-light-blue);
        font-family: var(--font-family-barlow);
        font-size: 2.5rem;
        font-weight: normal;
        letter-spacing: 0.03em;
        line-height: 1;
        pointer-events: none;
    }

    @media (max-width: 879px) {
        .card-campus-info__tel {
            min-width: 0;
            font-size: 1.80125rem;
            pointer-events: auto;
        }
    }
}

@layer components {
    .footer {
        display: flex;
        height: 63px;
        align-items: center;
        justify-content: center;
        padding: 0 20px;
        background-color: var(--color-navy-blue);
        text-align: center;
    }

    @media (max-width: 767px) {
        .footer {
            height: 48px;
        }
    }

    .footer>.copyright {
        color: var(--color-white);
        font-size: 0.75rem;
        font-weight: 500;
        letter-spacing: 0.05em;
        line-height: 1.1666666667;
    }

    @media (max-width: 767px) {
        .footer>.copyright {
            font-size: 0.5625rem;
        }
    }
}

@layer components {
    .c-heading {
        font-size: 1.5rem;
        font-weight: bold;
    }
}

@layer components {
    .hero {
        position: relative;
        z-index: 1;
        display: flex;
        justify-content: flex-end;
    }

    .hero__info {
        position: absolute;
        top: 12.3958333333vw;
        left: 17.5vw;
        white-space: nowrap;
        writing-mode: vertical-lr;
    }

    @media (max-width: 1440px) {
        .hero__info {
            top: 13.4027777778vw;
            left: 17.3611111111vw;
        }
    }

    @media (max-width: 767px) {
        .hero__info {
            top: 22px;
            right: 18px;
            left: auto;
        }
    }

    .hero__heading {
        font-size: 1.6276041667vw;
        font-weight: 500;
        letter-spacing: 0.08em;
        line-height: 1.4;
    }

    @media (max-width: 1440px) {
        .hero__heading {
            font-size: 1.7361111111vw;
            letter-spacing: 0.11em;
        }
    }

    @media (max-width: 767px) {
        .hero__heading {
            font-size: 1.40625rem;
        }
    }

    .hero__heading>span {
        display: block;
    }

    .hero__text {
        margin-left: 15px;
        font-size: 0.859375vw;
        font-weight: 500;
        letter-spacing: 0.21em;
        line-height: 1.4;
    }

    @media (max-width: 1440px) {
        .hero__text {
            margin-left: 8px;
            font-size: 0.9166666667vw;
        }
    }

    @media (max-width: 767px) {
        .hero__text {
            font-size: 0.743125rem;
        }
    }

    .hero__image {
        display: block;
        width: 65.1041666667vw;
    }

    @media (max-width: 1440px) {
        .hero__image {
            width: 65.625vw;
        }
    }

    @media (max-width: 767px) {
        .hero__image {
            width: 82.2857142857vw;
            margin-top: 60px;
        }
    }

    .hero__image>img {
        display: block;
        width: 100%;
        height: auto;
        border-bottom-left-radius: 10px;
    }

    @media (max-width: 767px) {
        .hero__image>img {
            border-bottom-left-radius: 5px;
            border-top-left-radius: 5px;
        }
    }
}

@layer components {
    .sec-brochure {
        padding: 0 21px;
        margin-top: 187px;
    }

    @media (max-width: 767px) {
        .sec-brochure {
            margin-top: 158px;
        }
    }

    .sec-brochure__inner {
        position: relative;
        display: flex;
        max-width: 914px;
        padding: 59px min(60px, 6.2761506276vw) 47px min(75px, 7.8451882845vw);
        border-radius: 20px;
        margin: 0 auto;
        background-color: var(--color-mint-blue);
        gap: min(36px, 3.7656903766vw);
    }

    @media (max-width: 767px) {
        .sec-brochure__inner {
            display: block;
            max-width: none;
            padding: 146px 35px 64px;
            border-radius: 15px;
            text-align: center;
        }
    }

    .sec-brochure__image {
        position: relative;
        z-index: 1;
        width: 216px;
        flex-shrink: 0;
    }

    @media (max-width: 767px) {
        .sec-brochure__image {
            position: absolute;
            top: -82px;
            left: 50%;
            width: 147px;
            transform: translateX(-50%);
        }
    }

    .sec-brochure__image>img {
        position: absolute;
        top: -125px;
        left: 0;
        display: block;
        width: 100%;
        height: auto;
    }

    @media (max-width: 767px) {
        .sec-brochure__image>img {
            position: static;
        }
    }

    .sec-brochure__detail {
        flex: 1;
    }

    .sec-brochure__heading img {
        display: block;
        width: 100%;
        max-width: 515px;
        height: auto;
    }

    @media (max-width: 767px) {
        .sec-brochure__heading img {
            width: 203px;
            margin: 0 auto;
        }
    }

    .sec-brochure__text {
        margin-top: 16px;
        font-size: 1rem;
        font-weight: normal;
        letter-spacing: 0.1em;
        line-height: 1.4;
        text-align: left;
    }

    @media (max-width: 767px) {
        .sec-brochure__text {
            max-width: 226px;
            margin: 19px auto 0;
            font-size: 0.788125rem;
            line-height: 2.5;
        }
    }

    .sec-brochure__button {
        margin-top: 34px;
    }

    @media (max-width: 767px) {
        .sec-brochure__button {
            margin-top: 28px;
        }
    }
}

@layer components {
    .sec-campus {
        position: relative;
        z-index: 2;
        padding: 119px 21px 106px;
        background-color: var(--color-white);
    }

    @media (max-width: 767px) {
        .sec-campus {
            padding-top: 48px;
            padding-bottom: 0;
            margin-top: 55.7142857143vw;
        }
    }

    .sec-campus:before {
        position: absolute;
        z-index: 0;
        top: 0;
        right: 0;
        left: calc(50% - 339px);
        height: 100%;
        background: url(/tsushin/special/assets/images/bg-campus-pc.webp) center no-repeat;
        background-size: cover;
        border-bottom-left-radius: 20px;
        content: "";
    }

    @media (max-width: 767px) {
        .sec-campus:before {
            bottom: 361px;
            left: 29.4285714286vw;
            height: auto;
            border-radius: 15px 0 0 15px;
            background-image: url(/tsushin/special/assets/images/bg-campus-sp.webp);
            background-position: left center;
        }
    }

    .sec-campus::after {
        position: absolute;
        bottom: -27px;
        left: calc(50% + 158px);
        width: 642px;
        height: 1006px;
        background: url(/tsushin/special/assets/images/img-campus-student.webp) left center no-repeat;
        background-size: cover;
        content: "";
    }

    @media (max-width: 1650px) {
        .sec-campus::after {
            right: 0;
            bottom: -32px;
            left: auto;
            width: 530px;
        }
    }

    @media (max-width: 1200px) {
        .sec-campus::after {
            width: 44.1666666667vw;
            height: 83.8333333333vw;
        }
    }

    @media (max-width: 767px) {
        .sec-campus::after {
            bottom: 246px;
            width: 196px;
            height: 419px;
        }
    }

    .sec-campus__img-title {
        position: absolute;
        z-index: 1;
        top: 0;
        left: 50%;
        display: block;
        width: 99.1666666667%;
        transform: translate(-50%, -50%);
    }

    @media (min-width: 1920px) {
        .sec-campus__img-title {
            width: 100%;
            max-width: 1900px;
        }
    }

    @media (max-width: 767px) {
        .sec-campus__img-title {
            top: auto;
            bottom: calc(100% - 22px);
            left: 1.7142857143vw;
            width: 91.4285714286vw;
            transform: none;
        }
    }

    .sec-campus__inner {
        position: relative;
        z-index: 1;
        max-width: 924px;
        margin: 0 auto;
    }

    @media (max-width: 767px) {
        .sec-campus__inner {
            max-width: none;
        }
    }

    @media (max-width: 767px) {
        .sec-campus__content {
            padding-left: 40px;
        }
    }

    .sec-campus__heading-01 {
        display: block;
        width: 100%;
        max-width: 354px;
        height: auto;
    }

    .sec-campus__heading-01>img {
        display: block;
        width: 100%;
        height: auto;
    }

    @media (max-width: 767px) {
        .sec-campus__heading-01 {
            max-width: 194px;
        }
    }

    .sec-campus__heading-02 {
        display: block;
        width: 100%;
        max-width: 434px;
        height: auto;
        margin-top: 90px;
        margin-left: -6px;
    }

    @media (max-width: 767px) {
        .sec-campus__heading-02 {
            width: 263px;
            margin-top: 33px;
            margin-left: -5px;
        }
    }

    .sec-campus__heading-02>img {
        display: block;
        width: 100%;
        height: auto;
    }

    .sec-campus__text {
        max-width: 651px;
        margin-top: 30px;
        font-feature-settings: "pwid" on, "palt" on;
        font-size: 1rem;
        letter-spacing: 0.03em;
        line-height: 2.5;
    }

    @media (max-width: 767px) {
        .sec-campus__text {
            max-width: 58.8571428571vw;
            margin-top: 18px;
            font-size: 0.788125rem;
            letter-spacing: 0.15em;
        }
    }

    .sec-campus__text>p+p {
        margin-top: 40px;
    }

    @media (max-width: 767px) {
        .sec-campus__text>p+p {
            margin-top: 0;
        }
    }

    .sec-campus__text>p>span {
        display: block;
    }

    @media (max-width: 767px) {
        .sec-campus__text>p>span {
            display: inline;
        }
    }
}

@layer components {
    .sec-contact {
        padding: 0 21px;
        margin-top: 205px;
    }

    @media (max-width: 767px) {
        .sec-contact {
            margin-top: 178px;
        }
    }

    .sec-contact__inner {
        max-width: 915px;
        margin: 0 auto;
        text-align: center;
    }

    @media (max-width: 879px) {
        .sec-contact__inner {
            max-width: none;
        }
    }

    .sec-contact__heading {
        color: var(--color-light-blue);
        font-family: var(--font-family-barlow);
        font-size: 1rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 1.4;
        text-align: center;
    }

    @media (max-width: 767px) {
        .sec-contact__heading {
            font-size: 0.619375rem;
        }
    }

    .sec-contact__intro {
        position: relative;
        display: inline-block;
        padding: 0 60px;
        margin-top: 25px;
        color: var(--color-navy-blue);
        font-family: var(--font-family-zen-maru);
        font-size: 1.75rem;
        font-weight: 500;
        line-height: 1.5;
    }

    @media (max-width: 767px) {
        .sec-contact__intro {
            padding: 0 27px;
            margin-top: 10px;
            font-size: 0.788125rem;
        }
    }

    .sec-contact__intro::before,
    .sec-contact__intro::after {
        position: absolute;
        top: 0;
        left: 0;
        width: 5px;
        height: 100%;
        background-color: var(--color-light-blue-02);
        content: "";
    }

    @media (max-width: 767px) {

        .sec-contact__intro::before,
        .sec-contact__intro::after {
            width: 2px;
        }
    }

    .sec-contact__intro::after {
        right: 0;
        left: auto;
    }

    .sec-contact__intro>span {
        display: block;
    }

    .sec-contact__list {
        display: flex;
        flex-direction: column;
        padding: 35px;
        border-radius: 20px;
        margin-top: 100px;
        background-color: var(--color-light-gray);
        gap: 18px;
    }

    @media (max-width: 767px) {
        .sec-contact__list {
            padding: 22px;
            margin-top: 28px;
        }
    }
}

@layer components {
    .sec-footer-contact {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding-bottom: 145px;
        margin-top: 86px;
        text-align: center;
    }

    @media (max-width: 767px) {
        .sec-footer-contact {
            padding-bottom: 80px;
            margin-top: 78px;
        }
    }

    .sec-footer-contact::after {
        position: absolute;
        z-index: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 172px;
        background: url(/tsushin/special/assets/images/bg-contact-pc.webp) center no-repeat;
        background-size: cover;
        content: "";
    }

    @media (max-width: 767px) {
        .sec-footer-contact::after {
            height: 105px;
            background-image: url(/tsushin/special/assets/images/bg-contact-sp.webp);
        }
    }

    .sec-footer-contact__heading img {
        display: block;
        width: 536px;
        height: auto;
        margin: 0 auto;
    }

    @media (max-width: 767px) {
        .sec-footer-contact__heading img {
            width: 253px;
        }
    }

    .sec-footer-contact__tel {
        display: inline-flex;
        align-items: center;
        margin-top: 18px;
        cursor: default;
        gap: 20px;
        pointer-events: none;
    }

    @media (max-width: 767px) {
        .sec-footer-contact__tel {
            flex-direction: column;
            margin-top: 43px;
            gap: 0;
            pointer-events: auto;
        }
    }

    .sec-footer-contact__text {
        display: block;
        padding: 6px 17px;
        border: 1px solid var(--color-light-blue);
        color: var(--color-light-blue);
        font-size: 1rem;
        font-weight: 500;
        letter-spacing: 0.05em;
        line-height: 1.1875;
    }

    @media (max-width: 767px) {
        .sec-footer-contact__text {
            padding: 4px 20px;
            font-size: 0.8125rem;
        }
    }

    .sec-footer-contact__number {
        display: block;
        color: var(--color-light-blue);
        font-family: var(--font-family-barlow);
        font-size: 3.125rem;
        letter-spacing: 0.03em;
        line-height: 1.5;
    }

    @media (max-width: 767px) {
        .sec-footer-contact__number {
            font-size: 2.8125rem;
        }
    }

    .sec-footer-contact__time {
        margin-top: 2px;
        color: var(--color-black-02);
        font-size: 1rem;
        font-weight: 500;
        letter-spacing: 0.05em;
        line-height: 1.4;
        text-align: center;
    }

    @media (max-width: 767px) {
        .sec-footer-contact__time {
            display: none;
        }
    }

    .sec-footer-contact__link {
        position: relative;
        z-index: 1;
        margin-top: 45px;
    }

    @media (max-width: 767px) {
        .sec-footer-contact__link {
            margin-top: 14px;
        }
    }
}

@layer components {
    .sec-footer-sns {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 30px 20px 38px;
        background-color: var(--color-white);
    }

    @media (max-width: 767px) {
        .sec-footer-sns {
            padding: 42px 20px 44px;
        }
    }

    .sec-footer-sns__link {
        display: flex;
        align-items: center;
        color: var(--color-navy-blue);
        font-size: 0.875rem;
        gap: 17px;
        transition: opacity 0.2s ease-out;
        /* stylelint-disable-next-line nesting-selector-no-missing-scoping-root */
    }

    @media (any-hover: hover) {
        .sec-footer-sns__link:hover {
            opacity: 0.7;
        }
    }

    @media (max-width: 767px) {
        .sec-footer-sns__link {
            gap: 12px;
        }
    }

    .sec-footer-sns__link>img {
        display: block;
        width: 49px;
        height: auto;
    }

    @media (max-width: 767px) {
        .sec-footer-sns__link>img {
            width: 35px;
        }
    }

    .sec-footer-sns__text {
        display: block;
        font-family: var(--font-family-zen-maru);
        font-size: 1rem;
        font-weight: bold;
        letter-spacing: 0.05em;
        line-height: 1.6;
    }

    @media (max-width: 767px) {
        .sec-footer-sns__text {
            font-size: 0.75rem;
        }
    }

    .sec-footer-sns__text>span {
        display: block;
        font-weight: 500;
    }
}

@layer components {
    .sec-intro {
        position: relative;
        z-index: 1;
    }

    .sec-intro__inner {
        display: flex;
        max-width: 1440px;
        margin: 0 auto;
        gap: 140px;
    }

    @media (max-width: 1440px) {
        .sec-intro__inner {
            gap: 9.7222222222vw;
        }
    }

    @media (max-width: 1024px) {
        .sec-intro__inner {
            flex-direction: column-reverse;
            margin-top: 68px;
            gap: 98px;
        }
    }

    .sec-intro__image {
        width: 355px;
        flex-shrink: 0;
    }

    @media (max-width: 1024px) {
        .sec-intro__image {
            width: 48vw;
        }
    }

    .sec-intro__image>img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    @media (max-width: 1440px) {
        .sec-intro__image>img {
            border-radius: 0 10px 10px 0;
        }
    }

    @media (max-width: 767px) {
        .sec-intro__image>img {
            border-radius: 0 5px 5px 0;
        }
    }

    .sec-intro__detail {
        max-width: 526px;
        flex: 1;
        font-feature-settings: "pwid" on, "palt" on;
        font-size: 1.25rem;
        letter-spacing: 0.1em;
        line-height: 3;
    }

    @media (max-width: 1024px) {
        .sec-intro__detail {
            max-width: none;
            padding: 0 40px;
            text-align: center;
        }
    }

    @media (max-width: 767px) {
        .sec-intro__detail {
            font-size: 0.788125rem;
        }
    }

    .sec-intro__detail p>span {
        display: block;
    }

    .sec-intro__detail p>span .inline-pc {
        display: none;
    }

    @media (max-width: 767px) {
        .sec-intro__detail p>span .inline-pc {
            display: block;
        }
    }
}

@layer components {
    .sec-renewal {
        position: relative;
        padding-bottom: 206px;
        margin-top: 226px;
    }

    @media (max-width: 767px) {
        .sec-renewal {
            padding-bottom: 0;
            margin-top: 73.1428571429vw;
        }
    }

    .sec-renewal::before {
        position: absolute;
        top: 0;
        right: calc(50% - 333px);
        bottom: 0;
        left: 0;
        background: linear-gradient(360deg, #fdf8d4 -8.68%, #e4f7f8 100%);
        content: "";
    }

    @media (max-width: 767px) {
        .sec-renewal::before {
            right: calc(50% - 73px);
            bottom: 97px;
            border-radius: 0 15px 15px 0;
        }
    }

    .sec-renewal__inner {
        position: relative;
        z-index: 1;
        max-width: 1440px;
        margin: 0 auto;
    }

    .sec-renewal__image-main {
        position: absolute;
        z-index: 1;
        top: -57px;
        right: 0;
        width: 589px;
    }

    @media (max-width: 1440px) {
        .sec-renewal__image-main {
            width: 40.9027777778vw;
        }
    }

    @media (max-width: 767px) {
        .sec-renewal__image-main {
            top: -40.8571428571vw;
            width: 82.5714285714vw;
        }
    }

    .sec-renewal__image-main>img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    @media (max-width: 1440px) {
        .sec-renewal__image-main>img {
            border-radius: 10px 0 0 10px;
        }
    }

    .sec-renewal__coming-soon {
        padding-top: 124px;
        padding-left: 257px;
        color: var(--color-light-blue);
        font-family: var(--font-family-barlow);
        font-size: 3.125rem;
        font-weight: 300;
        letter-spacing: 0.3em;
        line-height: 2;
    }

    @media (max-width: 1440px) {
        .sec-renewal__coming-soon {
            padding-top: 88px;
            padding-left: 17.8472222222vw;
        }
    }

    @media (max-width: 767px) {
        .sec-renewal__coming-soon {
            padding-left: 17.7142857143vw;
            margin-top: 88px;
            font-size: 1.53875rem;
        }
    }

    .sec-renewal__coming-soon>h2>span {
        display: block;
    }

    .sec-renewal__card {
        display: flex;
        margin-top: 123px;
        gap: 135px;
    }

    @media (max-width: 1440px) {
        .sec-renewal__card {
            gap: 9.375vw;
        }
    }

    @media (max-width: 767px) {
        .sec-renewal__card {
            flex-direction: column-reverse;
            margin-top: 28px;
            gap: 46px;
        }
    }

    .sec-renewal__card-image {
        width: 479px;
        flex-shrink: 0;
    }

    @media (max-width: 1440px) {
        .sec-renewal__card-image {
            width: 33.2638888889vw;
        }
    }

    @media (max-width: 767px) {
        .sec-renewal__card-image {
            width: 71.4285714286vw;
            align-self: flex-end;
        }
    }

    .sec-renewal__card-image>img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
    }

    @media (max-width: 1440px) {
        .sec-renewal__card-image>img {
            border-radius: 0 10px 10px 0;
        }
    }

    @media (max-width: 767px) {
        .sec-renewal__card-image>img {
            border-radius: 10px 0 0 10px;
        }
    }

    .sec-renewal__card-detail {
        max-width: 571px;
        flex: 1;
        padding-right: 21px;
    }

    @media (max-width: 767px) {
        .sec-renewal__card-detail {
            max-width: 71.7142857143vw;
            padding-right: 0;
            margin-left: 17.7142857143vw;
        }
    }

    .sec-renewal__card-heading {
        width: 100%;
        max-width: 463px;
        margin-bottom: 36px;
    }

    .sec-renewal__card-heading>img {
        display: block;
        width: 100%;
        height: auto;
    }

    @media (max-width: 767px) {
        .sec-renewal__card-heading {
            display: none;
        }
    }

    .sec-renewal__card-text {
        font-feature-settings: "pwid" on, "palt" on;
        font-size: 1rem;
        letter-spacing: 0.15em;
        line-height: 2.5;
    }

    @media (max-width: 767px) {
        .sec-renewal__card-text {
            font-size: 0.788125rem;
        }
    }

    .sec-renewal__card-text>span,
    .sec-renewal__card-text>span>span {
        display: block;
    }

    @media (max-width: 767px) {

        .sec-renewal__card-text>span.inline-sp,
        .sec-renewal__card-text>span>span.inline-sp {
            display: inline;
        }
    }
}

@layer components {
    .sec-slogan {
        position: relative;
        z-index: 0;
        padding: 0 21px;
    }

    .sec-slogan__inner {
        position: relative;
        max-width: min(1484px, 77.2916666667vw);
        height: 426px;
        margin: 0 auto;
    }

    @media (max-width: 1440px) {
        .sec-slogan__inner {
            max-width: 1146px;
            height: 409px;
        }
    }

    @media (max-width: 767px) {
        .sec-slogan__inner {
            height: 70.5714285714vw;
        }
    }

    .sec-slogan__inner::after {
        position: absolute;
        z-index: 0;
        top: -86px;
        left: 207px;
        width: 345px;
        height: 551px;
        background: linear-gradient(180deg, #f7ffff 0%, #f7ffff 26.6%, #e4f7f8 64.33%, #fdf8d4 128.67%);
        content: "";
    }

    @media (max-width: 1440px) {
        .sec-slogan__inner::after {
            top: -82px;
            left: 117px;
            width: 327px;
            height: 532px;
        }
    }

    @media (max-width: 767px) {
        .sec-slogan__inner::after {
            top: -42px;
            left: -21px;
            width: 51.1428571429vw;
            height: 82.2857142857vw;
        }
    }

    .sec-slogan__inner>img {
        position: absolute;
        z-index: 1;
        top: 35px;
        left: 0;
        display: block;
        width: 427px;
        height: auto;
    }

    @media (max-width: 1440px) {
        .sec-slogan__inner>img {
            width: 324px;
        }
    }

    @media (max-width: 767px) {
        .sec-slogan__inner>img {
            top: 10vw;
            width: 67.1428571429vw;
        }
    }
}

@layer components {
    .sec-tour {
        position: relative;
        padding: 122px 21px 105px;
        margin-top: 221px;
    }

    @media (max-width: 1024px) {
        .sec-tour {
            padding: 0 0 106px;
            margin-top: 52px;
        }
    }

    .sec-tour::before {
        position: absolute;
        z-index: 0;
        top: 0;
        right: calc(50% - 459px);
        bottom: 0;
        left: 0;
        border-radius: 0 20px 20px 0;
        background-color: var(--color-light-gray);
        content: "";
    }

    @media (max-width: 1024px) {
        .sec-tour::before {
            top: 46px;
            right: 22px;
            border-radius: 0 15px 15px 0;
        }
    }

    .sec-tour__inner {
        position: relative;
        z-index: 1;
        display: flex;
        max-width: 1248px;
        justify-content: space-between;
        margin: 0 auto;
        gap: 50px;
    }

    @media (max-width: 1024px) {
        .sec-tour__inner {
            display: block;
            max-width: none;
        }
    }

    .sec-tour__image {
        position: relative;
        z-index: 1;
        width: min(444px, 34.4186046512vw);
        flex-shrink: 0;
        margin: 49px 0 0 49px;
    }

    @media (max-width: 1024px) {
        .sec-tour__image {
            width: 82.2857142857vw;
            border-radius: 0 5px 5px 0;
            margin: 0;
        }
    }

    .sec-tour__image>img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 5px;
    }

    .sec-tour__detail {
        max-width: 612px;
        flex: 1;
    }

    @media (max-width: 1024px) {
        .sec-tour__detail {
            max-width: calc(100% - 22px);
            padding: 0 17.4285714286vw;
            margin-top: 50px;
        }
    }

    .sec-tour__heading {
        color: var(--color-light-blue);
        font-family: var(--font-family-barlow);
        font-size: 1rem;
        font-weight: 500;
        letter-spacing: 0.1em;
        line-height: 1;
    }

    @media (max-width: 767px) {
        .sec-tour__heading {
            font-size: 0.619375rem;
        }
    }

    .sec-tour__img-text-01 {
        display: block;
        width: 100%;
        max-width: 373px;
        height: auto;
        margin-top: 32px;
    }

    @media (max-width: 767px) {
        .sec-tour__img-text-01 {
            max-width: 202px;
            margin-top: 13px;
        }
    }

    .sec-tour__img-text-02 {
        display: block;
        width: 100%;
        max-width: 149px;
        height: auto;
        margin-top: 42px;
        margin-left: -5px;
    }

    @media (max-width: 767px) {
        .sec-tour__img-text-02 {
            max-width: 87px;
            margin-top: 32px;
        }
    }

    .sec-tour__text {
        margin-top: 28px;
        font-feature-settings: "pwid" on, "palt" on;
        font-size: 1rem;
        letter-spacing: 0.03em;
        line-height: 2.5;
    }

    @media (max-width: 767px) {
        .sec-tour__text {
            margin-top: 20px;
            font-size: 0.7875rem;
            letter-spacing: 0.1em;
        }
    }

    .sec-tour__text p>span {
        display: block;
    }

    @media (max-width: 767px) {
        .sec-tour__text p>span {
            display: inline;
        }
    }

    .sec-tour__text>small {
        display: block;
        margin-top: 10px;
        font-size: 0.75rem;
        line-height: 2;
    }

    @media (max-width: 767px) {
        .sec-tour__text>small {
            margin-top: 30px;
            font-size: 0.675625rem;
        }
    }

    .sec-tour__image-sm {
        position: absolute;
        z-index: 0;
        top: 385px;
        left: calc(50% - min(223px, 18.5833333333vw));
        width: min(165px, 12.7906976744vw);
    }

    @media (max-width: 1024px) {
        .sec-tour__image-sm {
            top: calc(100% - 70px);
            right: 0;
            left: auto;
            width: 126px;
        }
    }

    .sec-tour__image-sm>img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 5px;
    }

    @media (max-width: 1024px) {
        .sec-tour__image-sm>img {
            border-radius: 5px 0 0 5px;
        }
    }
}

@layer pages {
    .p-section-top {
        display: block;
    }
}