.sp {
    display: none !important;
}

.pc {
    display: inherit;
}

.tablet {
    display: none !important;
}

/* タブレット（横画面）でだけ表示 */
.tablet-reverse {
    display: inherit;
}

/* ----------------------------
レスポンシブデザイン
※max-widthでしていなので、値が小さいのが一番下になるように設定する
  ---------------------------- */
/* 大型デスクトップ */
html {
    @media screen and (max-width: 1440px) {
    }

    /* デスクトップ */
    @media screen and (max-width: 1200px) {
    }

    /* 小型ノートパソコン */
    @media screen and (max-width: 1024px) {
        .tablet {
            display: inherit !important;
        }

        .tablet-reverse {
            display: none !important;
        }
    }

    /* タブレット */
    @media screen and (max-width: 768px) {
    }

    /* 大きめのスマートフォン */
    @media screen and (max-width: 480px) {
        /* sp,pc表示切り替え */
        .sp {
            display: inherit !important;
        }

        .pc {
            display: none !important;
        }
    }

    /* 小さなスマートフォン */
    @media screen and (max-width: 320px) {
    }
}

/* ----- */

/*****************************************/
/* ↓↓↓↓初期設定 */
/*****************************************/
body,
pre,
dd,
div,
dl,
dt,
h1,
h2,
h3,
html,
li,
ol,
p,
table,
td,
tr,
ul {
    margin: 0;
    padding: 0;
}

ol {
    list-style: none;
    padding-inline-start: 0;
}

html {
    font: var(--fontSize) var(--Robot);
    font-weight: normal;
    color: var(--smoke);
    line-height: normal;
    overflow: hidden;
}