@charset "UTF-8";

/* 狭い画面（スマホ・小さいタブレット）向け：横100%に収め、本文を読みやすくする */
@media screen and (max-width: 1024px) {
    html {
        overflow-x: hidden;
        -webkit-text-size-adjust: 100%;
    }

    body {
        overflow-x: hidden;
        max-width: 100vw;
        font-size: 15px;
        line-height: 1.5;
        box-sizing: border-box;
    }

    *,
    *::before,
    *::after {
        box-sizing: inherit;
    }

    .main_window,
    body .temp main,
    main {
        min-width: 0;
        max-width: 100%;
    }

    .contents_main_for_admin {
        min-width: 0;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-left: 6px;
        padding-right: 6px;
    }

    /* 旧レイアウト互換：固定最小幅を解除 */
    #MainContainer,
    .MainContainer {
        min-width: 0 !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    #HeadContainer {
        min-width: 0 !important;
    }

    #HeadContainer #HeadNavi {
        min-width: 0 !important;
    }

    .inner_main_contents {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
    }

    .RegistForm textarea {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .research_purchasing_forecast {
        min-width: 0 !important;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* 横に長いボタン（common-sp の固定幅）を画面内に収める */
    a.bt-disable.b4,
    a.bt.b4,
    a.bt.b4:hover,
    a.bt.b4:visited,
    a.bt-disable.b5,
    a.bt.b5,
    a.bt.b5:hover,
    a.bt.b5:visited {
        max-width: 100%;
        width: min(340px, calc(100vw - 24px)) !important;
        box-sizing: border-box;
    }

    img,
    video,
    iframe,
    svg {
        max-width: 100%;
        height: auto;
    }

    .text_field {
        max-width: 100%;
        width: 100% !important;
    }

    /* フォーム入力：ラベルと同程度のサイズ（16px 未満だと iOS がフォーカス時に拡大しやすい） */
    .RegistForm input[type="text"],
    .RegistForm input[type="number"],
    .RegistForm input[type="email"],
    .RegistForm input[type="tel"],
    .RegistForm input[type="url"],
    .RegistForm input[type="password"],
    .RegistForm input[type="search"],
    .RegistForm input[type="date"],
    .RegistForm input[type="time"],
    .RegistForm input[type="datetime-local"],
    .RegistForm select,
    .RegistForm textarea {
        font-size: 16px !important;
        line-height: 1.45;
    }

    .RegistForm input[type="text"],
    .RegistForm input[type="number"],
    .RegistForm textarea {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    /* アイコンメニュー：layout-sp と同趣旨（帯を細く・詰める） */
    .customers_submenu,
    #customers_submenu {
        max-width: min(100%, 400px);
        margin-left: auto;
        margin-right: auto;
        box-sizing: border-box;
        overflow-x: hidden;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    .customers_submenu ul,
    #customers_submenu ul {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 4px 3px;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .customers_submenu li,
    #customers_submenu li {
        float: none !important;
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 72px;
        margin: 0 !important;
        padding: 4px 2px 5px !important;
        box-sizing: border-box;
    }

    .customers_submenu li p,
    #customers_submenu li p {
        font-size: 10px;
        line-height: 1.22;
        word-break: keep-all;
        overflow-wrap: anywhere;
        max-width: 100%;
    }

    h3.service_provider_form,
    h3.service_provider_form p {
        max-width: 100%;
        overflow-wrap: anywhere;
        word-break: keep-all;
        box-sizing: border-box;
    }
}
