@charset "utf-8";
/*
------------------------------
(C)株式会社フェニックス・コンサルティング Style CSS ver.1.0
------------------------------
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300..700;1,300..700&family=Noto+Serif:ital,wght@0,100..900;1,100..900&family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700;800&display=swap');

:root {
    /* プライマリーカラーの設定 */
    --color-primary-900: #000F23;
    --color-primary-800: #01193B;
    --color-primary-700: #01204C;
    --color-primary-600: #00275C;
    --color-primary-500: #002E6E;
    --color-primary-400: #2F5D9D;
    --color-primary-300: #305E9E;
    --color-primary-200: #A3BDE1;
    --color-primary-100: #E6ECF6;
    --color-primary-50: #F5F8FF;

    /* セカンダリーカラーの設定 */
    --color-secondary-900: #360020;
    --color-secondary-800: #4F002F;
    --color-secondary-700: #69003F;
    --color-secondary-600: #83014F;
    --color-secondary-500: #9c005e;
    --color-secondary-400: #AF0C6E;
    --color-secondary-300: #C2187E;
    --color-secondary-200: #DF7FB8;
    --color-secondary-100: #FFEFF9;
    --color-secondary-50: #FFF8FC;

    /* ターシャリーカラーの設定 */
    --color-tertiary-900: #1B0822;
    --color-tertiary-800: #280D35;
    --color-tertiary-700: #361045;
    --color-tertiary-600: #421455;
    --color-tertiary-500: #4E1766;
    --color-tertiary-400: #6F3586;
    --color-tertiary-300: #9051A4;
    --color-tertiary-200: #C19ECD;
    --color-tertiary-100: #F2EDF7;
    --color-tertiary-50: #FAF8FD;


    /* 背景色の設定 */
    --color-bg: linear-gradient(to bottom,
            var(--color-primary-50),
            var(--color-secondary-50));
    --color-glass: #ffffffe7;

    /* テキストリンク色の設定 */
    --color-text-link: var(--color-primary-500);


    /* プライマリーボタン色の設定 */
    /* --color-btn-primary: linear-gradient(90deg,
            var(--color-primary-500) 0%, #674795 12%,
            var(--color-secondary-500) 25%,
            var(--color-primary-500) 50%,
            var(--color-primary-500) 75%,
            #674795 87%,
            var(--color-secondary-500) 100%); */
    --color-btn-primary: var(--color-primary-500);
    --color-btn-primary-text: var(--color-white);
    --color-btn-primary-frame: var(--color-white);

    /* セカンダリーボタン色の設定 */
    --color-btn-secondary: var(--color-grad-90);
    --color-btn-secondary-text: var(--color-white);
    --color-btn-secondary-frame: var(--color-white);

    /* サブボタン色の設定 */
    --color-btn-sub: var(--color-white);
    --color-btn-sub-text: var(--color-primary-500);
    --color-btn-sub-frame: var(--color-primary-500);


    /* 見出しサイズの設定 */
    --font-size-h1: clamp(2.8rem, 4vw, 3.6rem);
    --font-size-h2: clamp(2rem, 2vw, 2.8rem);
    --font-size-h3: clamp(1.8rem, 2vw, 2.4rem);
    --font-size-h4: clamp(1.8rem, 1vw, 2rem);
    --font-size-m: clamp(14px, 1vw, 16px);
    --font-size-l: clamp(16px, 1vw, 18px);
    --font-size-xl: clamp(16px, 1vw, 20px);


    /* フォントウェイトの設定 */
    --font-weight-exbold: 600;

    /* フォントの設定 */
    --font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "Segoe UI", "verdana", sans-serif;
    --font-family-serif: "Shippori Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "Times New Roman", serif;
    --font-family-mont: "Spectral", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "Segoe UI", "verdana", sans-serif;

    /* グラデーションの設定 */
    --color-grad-90: linear-gradient(90deg,
            var(--color-secondary-300) 0%,
            var(--color-primary-300) 100%);

    --color-grad-135: linear-gradient(135deg,
            var(--color-secondary-300) 0%,
            var(--color-primary-300) 100%);

    /* シャドウの設定 */
    --box-shadow: 0px 0px 20px 4px #ccbdc55b;

    /* コンテンツ幅の設定 */
    --size-contents-l: clamp(375px, 90%, 1600px);

}

.c-bcrumb {
    padding: var(--size-01) 0;
    margin: 0;
    font-size: 1.2rem;
    background-color: var(--color-gray-50);
}

header {
    height: var(--height-header);
}

.c-header {
    padding: 0;
    font-family: var(--font-family-serif);
    box-shadow: var(--box-shadow);
}

.c-header .c-contents {
    width: var(--size-contents-l);
}

.c-header .c-header-submenu {
    padding: var(--size-06) var(--size-03);
}

.c-header .c-header-logo {
    display: flex;
    align-items: center;
}

.c-header .c-header-logo img {
    max-height: calc(var(--height-header) - var(--size-02));
}

.c-header .c-header-nav .c-btn {
    padding-right: var(--size-01);
    padding-left: var(--size-02);
    justify-content: flex-start;
}

.c-header .p-header-sub-list {
    display: flex;
    gap: var(--size-column);
}

.c-header .p-header-sub-list>li {
    flex: 1;
    font-size: var(--font-size-l);
}

.c-header .p-header-sub-list>li a {
    display: block;
}

.c-header .p-header-menu-en {
    display: block;
    font-size: 1.2rem;
    color: var(--color-gray-700);
    letter-spacing: .05em;
    font-weight: var(--font-weight-regular);
}

@media (any-hover: hover) {
    .c-header .c-header-submenu li a:hover .p-header-menu-en {
        color: var(--color-primary-300);
    }
}

.c-header .c-header-item .c-header-submenu ul ul {
    border-top: solid 1px var(--color-primary-100);
    padding-top: var(--size-02);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(3, max-content);
    grid-auto-flow: column;
    font-size: var(--font-size-s);
    row-gap: var(--size-04);
}

.c-footer {
    color: var(--color-gray-700);
}

.c-footer .c-contents {
    width: var(--size-contents-l);
}

.c-footer .c-footer-logo {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.c-footer .p-footer-outline {
    display: flex;
    flex-direction: column;
    margin-top: var(--size-02);
    gap: var(--size-005);
}

.c-footer .p-footer-company {
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
}

.c-footer .p-footer-address {
    line-height: 1.4;
    font-size: 1.2rem;
}

.c-footer .p-footer-policy {
    display: flex;
    font-size: var(--font-size-s);
    gap: var(--size-03);
    margin-top: var(--size-02);
    color: var(--color-gray-500);
}

.c-footer .p-footer-policy a {
    position: relative;
}

.c-footer .p-footer-policy a:not(:last-of-type)::before {
    content: "";
    width: 1px;
    height: 100%;
    background-color: var(--color-primary-100);
    top: 0;
    right: var(--size--015);
    position: absolute;
}


.c-footer .p-footer-tel a {
    font-weight: var(--font-weight-bold);
    font-family: var(--font-family-mont);
    font-size: var(--font-size-xl);
    position: relative;

    padding-left: var(--size-03);
    color: var(--color-gray-700);
}

.c-footer .p-footer-tel a::before {
    content: url(/common/assets/img/icon-tel.svg);
    width: var(--size-03);
    height: var(--size-03);
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    position: absolute;
}

.c-footer .p-footer-tel span {
    font-size: 1.2rem;
}

.c-footer .c-footer-wrap {
    display: flex;
    gap: var(--size-column);
    justify-content: space-between;
    padding-top: clamp(var(--size-05), 5vw, var(--size-06));
    padding-bottom: clamp(var(--size-05), 5vw, var(--size-08));
    align-items: center;
}

.c-footer .c-footer-cnt {
    flex: 3;
    display: flex;
    gap: var(--size-03);
}



.c-footer .c-footer-box {
    flex: 1;
}

.c-footer .p-footer-service {
    flex: 2;
}


.c-footer .c-footer-cnt .c-footer-list {
    font-size: var(--font-size-s);
    display: flex;
    flex-direction: column;
    color: var(--color-gray-500);
    gap: var(--size-01);
}

.c-footer .c-footer-cnt .c-footer-list ul {
    margin-top: var(--size-01);
}

.c-footer .c-footer-cnt .c-footer-list ul li::before {
    content: "-";
    padding-right: var(--size-01);
}



@media (any-hover: hover) {
    .c-footer a:hover {
        text-decoration: underline;
    }
}

.c-footer .c-footer-head {
    font-size: var(--font-size-m);
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--size-02);
    padding-bottom: var(--size-01);
    border-bottom: solid 1px var(--color-primary-100);
}

.c-footer .c-footer-head:not(:first-of-type) {
    margin-top: var(--size-04);
}

.c-footer .c-footer-logo img {
    width: 200px;
}

.c-footer .c-footer-copr {
    background-color: var(--color-primary-900);
    color: var(--color-gray-200);
    font-size: 1.2rem;
    padding: var(--size-005) var(--size-02);
    text-align: center;
}

.c-footer .p-footer-wrap {
    display: flex;
    flex-direction: row;
    gap: var(--size-column);
}




.c-head {
    font-family: var(--font-family-serif);
    color: var(--color-primary-500);
}

.c-head-sec {
    flex-direction: column-reverse;
    position: relative;
    margin-bottom: var(--size-03);
}

.c-head-sec.p-head-col {
    flex-direction: column;
}

.c-head-sub .p-head-serif {
    font-weight: var(--font-weight-bold);
    color: var(--color-primary-500);
    font-family: var(--font-family-serif);
}

.c-head-sub .p-head-mont span {
    font-weight: var(--font-weight-heavy);
    font-family: var(--font-family-mont);
    letter-spacing: .05em;
    display: inline-block;
    background: var(--color-grad-90);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    opacity: .8;
}

.c-head-sub .p-head-line {
    margin-bottom: var(--size-02);
    display: block;
    border-bottom: 2px solid;
    border-image: linear-gradient(90deg,
            var(--color-secondary-300) 0%,
            var(--color-primary-300) 13em,
            var(--color-primary-300) 100%) 1;
}

.p-head-under {
    position: relative;
    padding-bottom: var(--size-02);
}

.p-head-under::before {
    content: "";
    position: absolute;
    width: var(--size-05);
    background: var(--color-grad-135);
    height: var(--size-005);
    border-radius: 100px;
    bottom: 0;
    left: 0;
    transform: none;
}


.p-head-under.u-ta-center::before,
.p-head-under.u-ta-center-pc::before {
    left: 50%;
    transform: translateX(-50%);
}

.p-head-en {
    font-family: var(--font-family-mont);
    letter-spacing: .05em;
}

.p-head-mark {
    padding-left: 1em;
    position: relative;
}

.p-head-mark::before {
    content: "";
    position: absolute;
    top: 0.1em;
    left: 0;
    width: 0.5em;
    height: 1.5em;
    background: url(/common/assets/img/head-mark.png) no-repeat center / contain;
}


.p-bg-grad .c-head,
.p-head-rev .c-head {
    color: var(--color-white);
}

.p-bg-grad .c-head-sub span,
.p-head-rev .c-head-sub span {
    background: none;
    -webkit-text-fill-color: currentColor;
    color: var(--color-white);
    opacity: 1;
}

.p-bg-grad .p-head-under::before,
.p-head-rev .p-head-under::before {
    background: var(--color-white);
}



.c-head-sec .c-head {
    line-height: 1.6;
}

.c-link {
    display: flex;
    gap: var(--size-01);
    align-items: center;
}


.p-mark {
    width: var(--size-03);
    height: var(--size-03);
    border-radius: 50%;
    position: relative;
    overflow: hidden;
    display: block;
    border: 1px solid;
    flex-shrink: 0;
}

.p-mark.p-mark-primary {
    border-color: var(--color-primary-500);
}

.p-mark.p-mark-sub {
    border-color: var(--color-white);
}

.p-mark.p-mark-secondary {
    background: var(--color-grad-135);
    border-color: var(--color-white);
}

.p-mark.p-mark-secondary-sub {
    border-color: transparent;
    background: linear-gradient(var(--color-white), var(--color-white)) padding-box, var(--color-grad-135) border-box;
}

.p-mark-pdf {
    position: relative;
    width: var(--size-06);
    height: var(--size-06);
    margin-left: var(--size--02);
    transition: transform 0.3s ease;
}

.p-mark::before,
.p-mark::after {
    content: "";
    position: absolute;
    inset: 0;
    mask-image: url(../img/arrow.svg);
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: 12px 12px;
    -webkit-mask-image: url(../img/arrow.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: 12px 12px;
    transition:
        transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.p-mark.p-mark-primary::before,
.p-mark.p-mark-primary::after {
    background-color: var(--color-primary-500);
}

.p-mark.p-mark-sub::before,
.p-mark.p-mark-sub::after {
    background-color: var(--color-white);
}

.p-mark.p-mark-secondary::before,
.p-mark.p-mark-secondary::after {
    background-color: var(--color-white);
}

.p-mark.p-mark-secondary-sub::before,
.p-mark.p-mark-secondary-sub::after {
    border-color: transparent;
    background: var(--color-grad-135);
}

.p-mark-pdf::before {
    content: "";
    position: absolute;
    inset: 0;
    mask-image: url(../img/pdf.svg);
    mask-repeat: no-repeat;
    mask-position: center;
}


.p-mark-arrow::after {
    transform: translateX(0);
    opacity: 1;
}

.p-mark-arrow::before {
    transform: translateX(-120%);
    opacity: 0;
}

.p-mark-anchor::after {
    transform: translate(0, 0);
    opacity: 1;
    transform: rotate(90deg);
}

.p-mark-anchor::before {
    transform: translateY(-120%);
    opacity: 0;
}

.p-mark-blank::after {
    transform: translate(0, 0);
    opacity: 1;
    transform: rotate(-45deg);
}

.p-mark-blank::before {
    transform: translate(-120%, 120%);
    opacity: 0;
}

.p-mark-back::after {
    transform: translateX(0);
    opacity: 1;
    transform: rotate(-180deg);
}

.p-mark-back::before {
    transform: translateX(120%) rotate(-180deg);
    opacity: 0;
}


.c-btn {
    flex-direction: row;
    justify-content: center;
    gap: var(--size-03);
    font-family: var(--font-family-serif);
    box-shadow: var(--box-shadow);
    font-weight: var(--font-weight-exbold);
    position: relative;
    padding-left: var(--size-06);
    padding-right: var(--size-06);
}


.c-btn.u-btn-secondary {
    background: var(--color-btn-secondary);
}

.c-btn.p-btn-secondary-sub {
    background-color: var(--color-white);
    border-color: transparent;
    background: linear-gradient(var(--color-white), var(--color-white)) padding-box, var(--color-grad-135) border-box;
}

.c-btn.p-btn-secondary-sub span:first-of-type {
    background: var(--color-grad-135);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.c-btn .p-mark {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: var(--size-02);
}

.c-btn .p-mark.p-mark-back {
    right: auto;
    left: var(--size-02);
}

.c-btn.u-btn-primary .p-mark,
.c-btn.u-btn-secondary .p-mark {
    border: 1px solid var(--color-white);
}

.c-btn.u-btn-sub .p-mark {
    border: 1px solid var(--color-primary-500);
}

.c-btn.p-btn-secondary-sub .p-mark {
    border-color: transparent;
    background: linear-gradient(var(--color-white), var(--color-white)) padding-box, var(--color-grad-135) border-box;
}

.c-btn .p-mark.p-mark-pdf {
    border: none;
}

.c-btn .p-mark.p-mark-pdf::before {
    mask-size: 18px 18px;
    -webkit-mask-size: 18px 18px;
}

.c-btn .p-mark.p-mark-pdf::after {
    content: none;
}

.c-btn.u-btn-primary .p-mark::before,
.c-btn.u-btn-primary .p-mark::after,
.c-btn.u-btn-secondary .p-mark::before,
.c-btn.u-btn-secondary .p-mark::after {
    background-color: var(--color-white);
}

.c-btn.u-btn-sub .p-mark::before,
.c-btn.u-btn-sub .p-mark::after {
    background-color: var(--color-primary-500);

}

.c-btn.p-btn-secondary-sub .p-mark::before,
.c-btn.p-btn-secondary-sub .p-mark::after {
    border-color: transparent;
    background: var(--color-grad-135);
}


@media (any-hover: hover) {
    a:hover .p-mark-arrow::after {
        transform: translateX(120%);
        opacity: 0;
    }

    a:hover .p-mark-arrow::before {
        transform: translateX(0);
        opacity: 1;
    }

    a:hover .p-mark-anchor::after {
        transform: translateY(120%);
        opacity: 0;
    }

    a:hover .p-mark-anchor::before {
        transform: translateY(0) rotate(90deg);
        opacity: 1;
    }


    a:hover .p-mark-blank::after {
        transform: translate(120%, -120%) rotate(-45deg);
        opacity: 0;
    }

    a:hover .p-mark-blank::before {
        transform: translate(0, 0) rotate(-45deg);
        opacity: 1;
    }

    a:hover .p-mark-back::after {
        transform: translateX(-120%) rotate(-180deg);
        opacity: 0;
    }

    a:hover .p-mark-back::before {
        transform: translateX(0) rotate(-180deg);
        opacity: 1;
    }

    a:hover .p-mark-pdf {
        transform: translateY(calc(-50% - 4px)) translateX(4px);
    }
}






.u-mark-anchor::before {
    background-color: var(--color-btn-primary);
    z-index: 1;
    width: var(--size-03);
    height: var(--size-03);
    left: 0;
    top: 0;
}

.u-mark-anchor::after {
    content: "";
    background-color: var(--color-btn-primary-text);
    width: var(--size-03);
    border: solid 1px var(--color-primary-500);
    height: var(--size-03);
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
}


.c-card.u-card-bg .c-card-box {
    background-color: var(--color-white);
    box-shadow: var(--box-shadow);
    border-radius: var(--size-04) var(--size-005) var(--size-04) var(--size-005);
}

.c-card.u-card-bg .c-card-thum {
    border-radius: var(--size-03) var(--size-005) var(--size-03) var(--size-005);
}

.c-card .c-card-box {
    border-radius: var(--size-005);
}

.c-card.u-card-bg.u-card-text .c-card-cnt {
    padding: var(--size-06);
}


.c-card a.c-card-box:hover {
    opacity: 0.9;
}

.c-card.u-card-num .c-card-num {
    font-family: var(--font-family-mont);
}

.p-text-grad {
    background: linear-gradient(90deg,
            var(--color-primary-500) 0%,
            #674795 50%,
            var(--color-secondary-500) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    display: inline-block;
}




.p-mv-main {
    background-image: url(/common/assets/img/mv-main.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.p-mv-sub {
    background-image: url(/common/assets/img/mv-sub.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


.p-mv {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 300px;
}

.p-mv .c-head-sec {
    flex-direction: column;
}

.p-mv-main .p-mv .c-head-sec .c-head,
.p-mv-main .p-mv .c-head-sec .c-head-sub {
    color: var(--color-primary-500);
}

.p-mv-sub .p-mv .c-head-sec .c-head,
.p-mv-sub .p-mv .c-head-sec .c-head-sub {
    color: var(--color-white);
}

.p-mv .c-head-sec .c-head {
    font-size: var(--font-size-h1);
    margin-bottom: var(--size-02);
}

.p-mv .c-head-sec .c-head-sub {
    position: relative;
    font-family: var(--font-family-serif);
    padding-left: var(--size-05);
}

.p-mv .c-head-sec .c-head-sub::before {
    content: "";
    position: absolute;
    top: 1.2rem;
    left: 0;
    width: var(--size-04);
    height: 1px;
    background-color: var(--color-primary-500);
}



.p-mv-sub .p-mv .c-head-sec .c-head-sub::before {
    background-color: var(--color-white);
}

.p-mv .c-head-sec .p-head-en {
    padding-left: 0;
}

.p-mv .c-head-sec .p-head-en::before {
    content: none;
}

.p-box {
    padding: var(--size-06) !important;
    box-shadow: var(--box-shadow);
    border-radius: var(--size-04) var(--size-005) var(--size-04) var(--size-005);
}

.p-serif {
    font-family: var(--font-family-serif);
}



.p-intro {
    align-items: center;
}

.p-menu {
    display: flex;
    justify-content: right;
    font-family: var(--font-family-serif);
}

.p-menu ul {
    margin-top: var(--size--03);
    font-size: var(--font-size-s);
    display: flex;
    gap: var(--size-04);
    padding: var(--size-02) var(--size-06);
    background-color: var(--color-white);
    font-weight: var(--font-weight-bold);
    border-radius: 500px;
    justify-content: space-around;
    box-shadow: var(--box-shadow);
}

.p-menu a {
    transition: -webkit-text-fill-color .3s ease;
    background: var(--color-grad-90);
    -webkit-background-clip: text;
    -webkit-text-fill-color: currentColor;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    color: var(--color-primary-500);
}

.p-menu a:hover {
    -webkit-text-fill-color: transparent;
}

.p-label {
    padding: 0 var(--size-015);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
    border-radius: var(--size-005);
    text-align: center;
    display: inline-block;
}

.p-label-primary {
    background-color: var(--color-primary-500);
    color: var(--color-white);
}

.p-label-grad-sub {
    border: 1px solid transparent;
    background:
        linear-gradient(var(--color-white), var(--color-white)) padding-box,
        var(--color-grad-90) border-box;
    color: transparent;
    background-clip: padding-box, border-box;
    -webkit-background-clip: padding-box, border-box;
}

.p-label-grad-sub span {
    background: var(--color-grad-90);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.p-label-open {
    position: absolute;
    right: 0;
    top: 0;
    background: var(--color-grad-135);
    color: var(--color-white);
    padding: 1px calc(var(--size-015) + 1px);
}


.p-label-end {
    position: absolute;
    right: 0;
    top: 0;
    background-color: var(--color-gray-600);
    color: #fff;
    padding: 1px calc(var(--size-015) + 1px);

}

.p-label-soon {
    position: absolute;
    right: 0;
    top: 0;
    background: linear-gradient(135deg,
            #ff5b5b 0%,
            var(--color-secondary-400) 100%);
    color: #fff;
    padding: 1px calc(var(--size-015) + 1px);
}


.p-label.p-label-press {
    color: var(--color-primary-500);
    background-color: var(--color-primary-100);
}

.p-label.p-label-news {
    color: var(--color-secondary-500);
    background-color: var(--color-secondary-100);
}

.p-label.p-label-event {
    color: var(--color-tertiary-500);
    background-color: var(--color-tertiary-100);
}


.p-swiper .swiper-wrapper {
    align-items: stretch;
}

.p-swiper .swiper-slide {
    height: auto;
    display: flex;
}

.p-swiper .p-swiper-box {
    height: 100%;
    width: 100%;
    background-color: var(--color-white);
}

.p-swiper .p-swiper-thum {
    height: 100%;
    border-radius: var(--size-03) var(--size-005) var(--size-03) var(--size-005);
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


.p-swiper-nav {
    display: flex;
    gap: var(--size-04);
    justify-content: space-between;
    align-items: center;
    margin-top: var(--size-03);
}

.p-swiper-navbtn {
    display: flex;
    gap: 12px;
}


.p-swiper-pause {
    margin-top: var(--size-015);
    display: flex;
    width: 100%;
    justify-content: flex-end;
}


.p-swiper-prev,
.p-swiper-next {
    border: none;
    background: none;
    background-color: var(--color-white);
    border-radius: 50%;
    padding: 0;
    cursor: pointer;
}

.p-swiper-prev img,
.p-swiper-next img {
    display: block;
    width: var(--size-06);
    border-radius: 50%;
    height: auto;
    transition: opacity .3s ease, filter .3s ease;
    box-shadow: var(--box-shadow);
}

.p-swiper-prev img {
    transform: rotate(180deg) scaleY(-1);
    ;
}

.p-swiper-prev.swiper-button-disabled img,
.p-swiper-next.swiper-button-disabled img {
    opacity: 0.4;
    filter: grayscale(100%);
    cursor: default;
}

.p-swiper-bullets {
    justify-content: center;
    display: flex;
}

.p-swiper-bar,
.p-swiper-bar .swiper-pagination-progressbar-fill {
    border-radius: 500px;
}


.p-swiper-bar {
    position: relative;
    background-color: var(--color-gray-100);
}

.p-swiper-bar .swiper-pagination-progressbar-fill {
    background: var(--color-grad-90);
    transform-origin: left;
    transform: scaleX(0);
}

.p-swiper-bullets .swiper-pagination-bullet {
    width: var(--size-01);
    height: var(--size-01);
    background: var(--color-gray-100);
    opacity: 1;
    border-radius: 50%;
    transition: all 0.3s;
}

.p-swiper-bullets .swiper-pagination-bullet-active {
    background: var(--color-primary-500);
}

.p-swiper-count {
    /* position: absolute;
    right: var(--size-06);
    bottom: var(--size-03); */
    font-family: var(--font-family-mont);
}

.p-swiper-total {
    color: var(--color-gray-600);
    font-weight: var(--font-weight-bold);
}

.p-swiper-current {
    font-weight: var(--font-weight-heavy);
    background: var(--color-grad-90);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    font-size: var(--font-size-h2);
}

.p-bg {
    background-image: url("/common/assets/img/bg-grad.webp");
    background-size: cover;
    background-position: bottom center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.p-bg .p-box {
    background-color: rgba(255, 255, 255, 0.4);
    /* 少し透明に */
    backdrop-filter: blur(10px);
    /* これが本体 */
    -webkit-backdrop-filter: blur(10px);
    /* Safari対応 */
    border: solid 2px var(--color-white);
}

.p-bg-grad {
    background: var(--color-grad-135);
    color: var(--color-white);
}

.p-bg-grad .c-head {
    color: var(--color-white);
}

.p-flow {
    position: relative;
    margin-left: var(--size-03);
    padding-left: var(--size-04);
}

.p-flow::before {
    content: "";
    position: absolute;
    left: var(--size-005);
    width: 1px;
    height: calc(100% - var(--size-015));
    background-color: var(--color-gray-100);
    top: var(--size-015);
}

.p-flow-head {
    font-size: var(--font-size-m);
    font-weight: var(--font-weight-bold);
    position: relative;
}

.p-flow-head:not(:first-of-type) {
    margin-top: var(--size-04);
}

.p-flow-head::before {
    content: "";
    position: absolute;
    left: var(--size--04);
    top: 50%;
    transform: translateY(-50%);
    width: var(--size-01);
    height: var(--size-01);
    background-color: var(--color-primary-500);
    border-radius: 50%;
}

.p-sticky {
    position: sticky;
    top: 12rem;
    left: 0;
    height: 100%;
}


.p-card-list .c-card-ttl {
    border-top-left-radius: var(--size-04);
    border-top-right-radius: var(--size-005);
    font-weight: var(--font-weight-bold);
    color: var(--color-white);
    font-family: var(--font-family-serif);
}

.p-card-list .p-card-primary .c-card-ttl {
    background-color: var(--color-primary-500);
}

.p-card-list .p-card-secondary .c-card-ttl {
    background-color: var(--color-secondary-500);
}

.p-card-list .p-card-grad .c-card-ttl {
    background: var(--color-grad-90)
}

.p-card-list .c-list li {
    position: relative;
    padding: var(--size-02) 0;
    border-bottom: solid 1px var(--color-gray-100);
    font-weight: var(--font-weight-bold);
    padding-left: var(--size-04);
}

.p-card-list .c-list dt {
    position: relative;
    padding-left: var(--size-04);
}

.p-card-list .c-list dl {
    border-bottom: solid 1px var(--color-gray-100);
    padding: var(--size-02) 0;
}

.p-card-list.c-card.u-card-bg.u-col-02 .c-card-cnt {
    padding: 0;
    padding-bottom: var(--size-06);
}

.p-card-list.u-col-02 .c-card-ttl {
    padding: var(--size-03) var(--size-06);
}

.p-card-list.u-col-02 .c-card-dtl {
    padding-left: var(--size-06);
    padding-right: var(--size-06);
    font-size: var(--font-size-s);
}


.p-card-list.c-card.u-card-bg.u-col-03 .c-card-cnt {
    padding: 0;
    padding-bottom: var(--size-03);
}

.p-card-list.u-col-03 .c-card-ttl {
    padding: var(--size-03);
}

.p-card-list.u-col-03 .c-card-dtl {
    padding-left: var(--size-03);
    padding-right: var(--size-03);
}

.p-card-list .p-card-primary .p-mark-check::before {
    content: url(/common/assets/img/icon-check-primary.svg);
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
}

.p-card-list .p-card-grad .p-mark-check::before,
.p-card-list .p-card-secondary .p-mark-check::before {
    content: url(/common/assets/img/icon-check-secondary.svg);
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
}

.p-module-tag {
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
}

.p-module-tag:not(:last-of-type) {
    margin-right: var(--size-01);
}


.p-module-tag span {
    position: relative;
    display: inline-block;
    background: var(--color-grad-90);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.p-module-tag span::before {
    content: "#";
}

.p-short-card .c-card-cnt {
    gap: var(--size-005);
}

.p-short-card .p-short-ttl {
    font-size: var(--font-size-m) !important;
    position: relative;
}


.p-short-card .p-short-ttl span {
    font-size: var(--font-size-s);
    display: block;
    color: var(--color-gray-600);
    font-weight: var(--font-weight-regular);
}


.p-short-card .p-short-date {
    font-weight: var(--font-weight-bold);
    color: var(--color-primary-500);
    border-left: solid 3px var(--color-primary-500);
    font-size: var(--font-size-s);
    padding-left: var(--size-01);
}


.p-short-card .c-card-thum {
    box-shadow: var(--box-shadow);
    border-radius: var(--size-005);
    overflow: hidden;
    position: relative;
}

.p-short-card .c-card-dtl {
    font-size: var(--font-size-s);
    color: var(--color-gray-600);
    padding-top: var(--size-01);
}


.p-short-card.c-card.u-card-bg.u-card-img .c-card-cnt {
    padding: var(--size-01) 0 0 0;
}



.p-date {
    font-family: var(--font-family-mont);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary-500);
}

.p-news {
    margin-top: var(--size-06);
    display: flex;
    flex-direction: column;
}

.p-news-box {
    padding: var(--size-03) 0;
    border-top: solid 1px var(--color-primary-100);
    display: flex;
    gap: var(--size-02);
    align-items: center;
    justify-content: space-between;
}

.p-news>.p-news-box:last-child {
    border-bottom: solid 1px var(--color-primary-100);
}

.p-news-cnt {
    display: flex;
    gap: var(--size-02);
}

.p-news-dtl {
    display: flex;
    gap: var(--size-02);
    align-items: center;
}

.p-news .p-label {
    min-width: calc(7em + var(--size-03));
}

.p-news-text {
    font-weight: var(--font-weight-bold);
}


#sec-contact .p-contact-box {
    position: relative;
    margin-top: var(--size-06);
}

#sec-contact .p-contact-box::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 1px;
    background-color: var(--color-white);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#sec-contact .c-btn.u-btn-primary {
    background-color: transparent;
}

#sec-contact .c-btn.u-btn-primary::before {
    background-color: var(--color-secondary-500);
}

#sec-contact .c-btn.u-btn-sub {
    border: 2px solid transparent;
    background:
        linear-gradient(var(--color-btn-sub), var(--color-btn-sub)) padding-box,
        linear-gradient(135deg,
            var(--color-secondary-300) 0%,
            var(--color-primary-300) 100%) border-box;
}

#sec-contact .c-btn.u-btn-sub::after {
    background: var(--color-grad-135);
}

#sec-contact .c-btn.u-btn-sub span {
    background: var(--color-grad-135);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}



@media only screen and (max-width:1024px) {
    .c-footer .c-footer-wrap {
        flex-direction: column-reverse;
    }

    .c-footer .c-footer-logo {
        align-items: center;
    }
}

@media only screen and (max-width:768px) {

    /* .c-header .c-header-nav-sp,
    .c-header .c-header-nav-sp .c-acd .c-acd-ttl button {
        font-size: var(--font-size-l);
    } */

    .c-header .c-header-nav-sp .c-acd ul li {
        font-weight: var(--font-weight-exbold);
    }

    .c-header .c-header-nav-sp .c-acd ul ul {
        padding-left: var(--size-02);
    }

    .c-header .c-header-nav-sp .c-acd ul ul li {
        font-size: var(--font-size-s);
        font-weight: var(--font-weight-bold);
    }

    .c-header .c-acd .c-acd-dtl>ul {
        gap: var(--size-04);
    }

    .c-header .c-acd.u-acd-plus .c-acd-ttl button::after,
    .c-header .c-acd.u-acd-plus .c-acd-ttl button::before {
        width: 12px;
        height: 1px;
    }

    .p-card-list.u-col-02 .c-card-ttl {
        padding: var(--size-03);
    }

    .p-card-list.u-col-02 .c-card-dtl {
        padding-left: var(--size-03);
        padding-right: var(--size-03);
    }

    .p-box {
        padding: var(--size-03) !important;
    }

    .p-intro {
        flex-direction: column-reverse;
    }

    .p-menu {
        display: none;
    }

    .p-swiper .p-swiper-thum {
        height: 200px;
        min-height: auto;
    }

    .p-swiper-pause-icon {
        width: auto;
    }

    .p-news-cnt {
        flex-direction: column;
    }

    #sec-contact .p-contact-box::before {
        content: none;
    }

    .c-footer .p-footer-wrap {
        flex-direction: column;
    }

    .c-footer .c-footer-wrap {
        align-items: baseline;
    }


}

@media (max-width: 520px) {

    .c-footer .c-footer-cnt {
        flex-direction: column;
    }

    .c-footer .c-footer-wrap {
        align-items: center;
    }
}