@charset "UTF-8";

:root {
    --font-family: "LINE Seed JP", sans-serif;
    --font-shippori: "Shippori Mincho", serif;
    --font-noto: "Noto Sans JP", sans-serif;

    --pink: #f662cd;
    --gold: #d6a510;
    --white: #ffffff;
    --tamashi: #0eb5c2;
    --session: #1ca18f;
}

* {
    box-sizing: border-box;
}

html {
    /* * PCのフォントサイズ計算
     * 計算式: 100vw / (基準幅 / 10)
     * 例: 1440pxのとき 1rem = 10px
     */
    font-size: calc(100vw / (var(--width-pc) / 10));
    scroll-behavior: smooth;
    overflow-y: scroll; /* スクロールバーによるガタつき防止 */
}

body {
    font-family: var(--font-family);
    margin: 0;
    padding: 0;
    /* * 基準文字サイズ
     * 1rem = 10px計算なので、1.6rem = 16px相当
     */
    font-size: 1.6rem;

}

img {
    width: 100%;
    height: auto;
}



/* -------------- MV ----------------- */
.topMv__figure {
    width: 100vw;
    height: 100vh;
    padding: 3.2rem;
}

.topMv__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 1.5rem;
}

/* -------------- MESSAGE ----------------- */

.topMessage {
    padding-top: 10rem;
}
.topMessage__text {
    text-align: center;
    font-size: 1.5rem;
    line-height: 2.5;
    letter-spacing: 0.2em;
    color: var(--pink);
    padding-bottom: 4rem;
}


/* -------------- IMAGES ----------------- */
.topImgs__figure {
    width: 100%;
    max-width: 40rem;
    margin: 0 auto;
}

.topImgs__img {
    border-radius: 2rem;
    aspect-ratio: 640/849;
    object-fit: cover;
    object-position: top;
}


/* -------------- PLANS ----------------- */
.topPlans {
    padding-top: 10rem;
    padding-top: 6rem;
}

.topPlans__title {
    text-align: center;
    font-size: 2rem;
    letter-spacing: 0.3em;
    font-weight: 900;
    color: var(--pink);
}

.topPlans__item {
    padding-top: 8rem;
    padding-bottom: 3rem;
    text-align: center;
}

.topPlans__itemTitle {
    font-size: 2.2rem;
    letter-spacing: 0.2em;
    padding-bottom: 1rem;
    font-weight: 700;
    font-family: var(--font-noto);
}

.topPlans__item {
    display: flex;
    justify-content: center;
}

.topPlans__itemDesc {
    font-size: 1.7rem;
    padding-bottom: 3rem;
    line-height: 1.4;
    font-family: var(--font-shippori);
}

.topPlans__itemNotice {
    text-align: left;
    font-size: 1rem;
    padding-top: 2rem;
    line-height: 1.5;
}

.topPlans__itemNoticeListItem {
    padding-left: 1.2em;
    position: relative;
}

.topPlans__itemNoticeListItem::before {
    content: "※";
    position: absolute;
    display: block;
    left: 0;
}

.topPlans__itemPrice {
    display: grid;
    grid-template-columns: auto auto;
    column-gap: 2rem;
    text-align: left;
    line-height: 2;
}

.topPlans__itemButton {
    padding-top: 3rem;
    display: flex;
    justify-content: center;
}

.topPlans__itemButtonLink {
    display: inline-block;
    padding: 1rem 3rem;
    color: var(--white);
    text-decoration: none;
    border-radius: 2rem;
}

.item-labo.topPlans__item {
    color: var(--gold);
}
.item-labo .topPlans__itemButtonLink {
    background-color: var(--gold);
}

.item-tamashi.topPlans__item {
    color: var(--tamashi);
}
.item-tamashi .topPlans__itemButtonLink {
    background-color: var(--tamashi);
}

.item-keizoku.topPlans__item {
    color: var(--session);
}
.item-keizoku .topPlans__itemButtonLink {
    background-color: var(--session);
}


/* -------------- FOOTER ----------------- */
.footerCopyright {
    text-align: center;
    padding: 4rem 0;
    font-size: 1.2rem;
    color: #888;
}