@charset "utf-8";

@media only screen and (max-width: 1024px) {
    /* 基本 */
    body,
    button,
    input,
    textarea {
        font-size: 1.6rem;
        line-height: 2.65rem;
    }
    body.get-header main {
        margin-top: 2rem;
    }
    body.fix-menu header {
        justify-content: flex-end;
        height: auto;
    }
    body.fix-menu header h1 {
        color: var(--white);
        text-shadow: 0 0 7px var(--theme-color2-dark), 0 0 10px var(--theme-color2-dark);
        font-size: 3.6rem;
    }
    body.fix-menu header h1 a {
        color: var(--white);
    }
    header,
    main,
    footer {
        margin: 2rem;
    }
    main article,
    footer {
        padding: 2rem;
    }
    header {
        justify-content: center;
        width: calc(100% - 4rem);
        min-width: calc(100% - 4rem);
        height: calc(100vh - 4rem);
        /* padding: 1rem; */
    }
    header h1 {
        font-size: 4.2rem;
    }
    main article {
        width: 100%;
        min-width: 100%;
    }
    main {
        margin-top: 8rem;
    }
    main article {
        margin-top: 5rem;
        margin-bottom: 10rem;
    }

    /* メニュー */
    .menu {
        position: fixed;
        top: 0;
        left: 0;
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        padding: 2rem;
        background: var(--white);
        z-index: 70 !important;
        visibility: hidden;
        opacity: 0;
        transition: opacity var(--animation) linear;
    }
    .menu ul {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        height: 100%;
        padding: 2rem;
        background: var(--theme-color2-default);
    }
    .menu ul li a {
        padding: 1rem 0;
    }
    .menu.open {
        visibility: visible;
        opacity: 1;
        pointer-events: all;
    }
    .manu-toggler {
        position: fixed;
        top: 0;
        left: calc(50% - 50px);
        display: block;
        width: 100px;
        height: 50px;
        background: var(--theme-color2-default);
        border: 0;
        border-radius: 0 0 50px 50px;
        color: var(--white);
        font-size: 1.4rem;
        font-family: "Baloo Tammudu 2", "Kosugi Maru", sans-serif;
        font-weight: 400;
        z-index: 72;
        transition: background var(--animation);
    }
    .manu-toggler::after {
        content: "menu";
    }
    .manu-toggler.open {
        background: var(--theme-color2-dark);
    }
    .manu-toggler.open::after {
        content: "close";
    }

    /* 下に移動させた */

    /* 見出し */
    h1 {
        font-size: 3.6rem;
        text-align: center;
    }
    h2 {
        font-size: 2rem;
    }
    h3 {
        font-size: 1.6rem;
    }
    h4,
    h5 {
        font-size: 1.4rem;
    }

    /* リスト */
    ul.no-style,
    ol.no-style {
        padding: 0;
        list-style: none;
    }
    ul.column,
    ol.column {
        display: flex;
        flex-direction: column;
    }
    ul.column.column-2 > *,
    ul.column.column-3 > *,
    ol.column.column-2 > *,
    ol.column.column-3 > * {
        inline-size: 100% !important;
    }
    ul .description,
    ol .description {
        display: block;
        margin-inline-start: 10px;
    }
    ul .description::before,
    ol .description::before {
        content: "└";
        margin-inline-end: 10px;
    }
    dl.border,
    dl.inline {
        display: block;
    }
    dl.border dt,
    dl.border dd,
    dl.inline dt,
    dl.inline dd {
        inline-size: 100%;
    }
    dl.border dt,
    dl.inline dt {
        padding-block-end: 0;
        border-block-end: 0;
    }
    dl.border dd,
    dl.inline dd {
        padding-inline-start: 5rem;
        margin-block-end: 1.25rem;
    }
    dl.border dd:last-of-type,
    dl.inline dd:last-of-type {
        margin-block-end: 0;
    }

    /* フォーム */
    .form-inline input {
        inline-size: 40%;
    }
    .form-block dl {
        flex-direction: column;
    }
    .form-block dl.inline dt,
    .form-block dl.inline dd {
        inline-size: 100%;
    }

    /* リンク */
    main a:not(.ic-sns):not(.img):not(.new),
    footer a:not(.ic-sns):not(.img):not(.new) {
        position: initial;
        display: initial;
        color: var(--theme-color1-default);
        /* text-decoration: underline; */
    }
    main a:not(.ic-sns):not(.img):not(.new)::before,
    footer a:not(.ic-sns):not(.img):not(.new)::before {
        content: none;
    }

    /* 装飾 */
    .column.column-sp-1 {
        grid-template-columns: 1fr;
    }
    .column.column-sp-2 {
        grid-template-columns: repeat(2, 1fr);
    }
    .column.column-sp-3 {
        grid-template-columns: repeat(3, 1fr);
    }
}


/* ボタンメニューの色とかについて？ */
    .fixed-menu {
        bottom: 1rem;
        right: 1rem;
    }
    .fixed-menu a,
    .fixed-menu button,
    .fixed-menu span {
        background: rgba(255, 255, 255, 0.75) !important;
    }