@charset "UTF-8";
/* ============================================================
   共通設定
   PC: 1440px基準 / SP: 393px基準
   1rem = デザイン上の10px（画面幅に比例して拡大縮小）
   ============================================================ */

:root {
    --jp-light: 'RakutenSansJP2_W-Light', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
    --jp-regular: 'RakutenSansJP2_W-Regular', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
    --jp-medium: 'RakutenSansJP2_W-Medium', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
    --jp-demibold: 'RakutenSansJP2_W-DemiBold', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
    --jp-bold: 'RakutenSansJP2_W-Bold', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
    --jp-heavy: 'RakutenSansJP2_W-Heavy', 'Hiragino Sans', 'Noto Sans JP', sans-serif;
    --latin: 'RakutenSans_W', 'RakutenSansJP2_W-Medium', sans-serif;
    --pink: #ff008c;
    --black: #1a1a1a;
}

html {
    /* PC: 1440px基準（1920pxで拡大上限） */
    font-size: min(calc(100vw / 144), 13.334px);
}

@media (max-width: 767px) {
    html {
        /* SP: 393px基準 */
        font-size: calc(100vw / 39.3);
    }
}

body {
    background: #fff;
    color: var(--black);
    font-family: var(--jp-medium);
    -webkit-font-smoothing: antialiased;
    font-synthesis: none;
    overflow-x: hidden;
}

/* 太さは書体ごとに指定するため、ブラウザによる太字・斜体の自動付与を止める */
h1, h2, h3, h4, h5, h6, strong, b, th, em, i, small, caption {
    font-weight: normal;
    font-style: normal;
}

img {
    display: block;
    max-width: none;
}

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

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

/* PC / SP 出し分け */
.sp-only {
    display: none;
}

@media (max-width: 767px) {
    .pc-only {
        display: none;
    }

    .sp-only {
        display: block;
    }
}

/* 各セクションのキャンバス（デザインの座標をそのまま rem で配置） */
.canvas {
    position: relative;
    margin: 0 auto;
    overflow: hidden;
}

.canvas--pc {
    width: 144rem;
}

.canvas--sp {
    width: 39.3rem;
}

.canvas > * {
    position: absolute;
}
