@charset "UTF-8";
/* SP幅 ※基本的にはタブレット最大幅 OR 端末横向きで制御するがそれより狭い幅で制御したい場合 */

@media screen and (max-width: 599px) {

    /* 財務管理 - 入金消込 - 入金処理モーダル */

    .modal {
        max-height: 90%;
    }

    .narrow-sp-only {
        display: block!important;
    }

    .narrow-sp-only-disp-flex {
        display: flex!important;
    }

    /* 契約管理 - 契約書作成 */

    .agreement.contract .contract-info-area {
        width: 100%;
    }

    /* メール内容入力モーダル */
    .modal-mail-input {
        /* width: 350px; */
        width: 98%;
    }

    .construction-common-btn {
        line-height: 1em;
        padding: 5px 0;
        border-radius: 10px;
        margin: 1px;
    }

    .table>:not(caption)>*>* {
        padding: 0 3px;
    }
}


/* タブレットの最大幅を基準とする */

@media screen and (max-width: 920px) {

    /* 共通 */

    .flex-column:has(.sp-stretch),
    dl.sp-stretch,
    dl.sp-stretch dd,
    dl.sp-stretch dd input,
    dl.sp-stretch dd select {
        margin-right: 0;
        width: 100%!important;
    }

    /* サイドバー */
    .sidebar nav.menu {
        top: 0;
    }

    /* トグル系 */

    .slide-toggle-area {
        display: none;
    }

    /* 分析管理 - 契約率（総計） */

    .analysis.report-total-keiyaku .contract-rate-summary-tbl-area {
        width: 100%;
    }
}

@media screen and (min-width: 560px) and (max-width: 1366px) {
    /* TOP画面 - 処理状況 */
    .top .right-panel .flex-row.width-equal-division .area-content.card:nth-of-type(2) {
        margin-left: 32px;
    }
}

/* + 端末横向き */
@media screen and (max-width: 920px), ((orientation: landscape) and (max-width: 1366px)) {
/* @media screen and (max-width: 920px), screen and (orientation: landscape) { */

    .sp-only {
        display: block!important;
    }

    .sp-only-disp-flex {
        display: flex!important;
    }

    .pc-only {
        display: none!important;
    }

    /* 共通 */

    /* .txt-contract-no,
    .txt-customer-no,
    .txt-kouji-no,
    .txt-code,
    .txt-seikyu-no,
    .txt-hacchu-no,
    .txt-mitsumori-no,
    .txt-name,
    .txt-tel,
    .txt-mail-address,
    .txt-address,
    .txt-staff,
    .txt-kouji-name,
    .txt-kouji-place,
    .txt-year-month,
    .txt-term,
    .txt-month,
    .txt-day,
    .txt-num,
    .txt-company-name,
    .txt-kouji-kind,
    .txt-seikyu-item,
    .txt-authority,
    .txt-kind {
        width: inherit!important;
    } */

    /* flex系 */

    .flex-row > div {
        margin-right: 0;
    }

    .dt-dd-flex dl:has(dd + dd) {
        flex-wrap: wrap;
    }

    .sp-flex-column {
        display: flex;
        flex-direction: column!important;
        justify-items: center;
    }

    .sp-flex-column > div {
        margin-right: 0;
    }

    .width-equal-division,
    .width-equal-division > .flex-column {
        width: 100%;
        flex-basis: inherit!important;
    }

    /* フォーム系 */

    .rw-form dl dd.no-text {
        width: 100%!important;
    }

    /* テーブル系 */

    *:has(> table.scroll-table) {
        overflow: auto;
        border-right: #5F6368 1px dashed;
    }

    table.scroll-table th {
        position: sticky;
        top:0;
        left:0;
    }

    table.scroll-table thead tr th,
    table.scroll-table tbody tr td {
        white-space: nowrap;
    }

    table.scroll-table tr:first-of-type th:first-of-type {
        z-index: 1;
    }

    /* モーダル系 */

    .modal .button-area {
        /* flex-flow: wrap column-reverse; */
        flex-wrap: nowrap;
    }

    .modal-content .button-area {
        margin-top: 1rem;
    }

    /* PDF */

    .content:has(.full-screen-pdf-area) {
        margin-bottom: 16px;
    }

    .full-screen-pdf-area {
        position: fixed;
        width: 100%;
        left: 0;
        bottom: 0;
        z-index: 10;
        /* transition: all 10s ease; */
    }

    .full-screen-pdf-area div {
        height: 100%;
    }

    .full-screen-pdf-area.open {
        z-index: 20;
        height: 100%;
    }

    .full-screen-pdf-area.close div {
        display: none;
    }

    .full-screen-pdf-area button {
        width: 100%;
        /* border: none; */
        border-bottom: 1px solid #f0f0f0;
        /* background-color: #323639; */
        background-color: #1c6997;
        box-shadow: 0 2px 2px 4px rgb(0 0 0 / 30%)!important;
        color: #fff!important;
        /* opacity: 0.7; */
        padding: 0.75rem;
        border-radius: 1rem 1rem 0 0;
        position: absolute;
        bottom: 0;
    }

    /* ヘッダー - アラート */

    .header-profile {
        margin-right: 0;
    }

    /* サイドバー */

    .sidebar {
        display: none;
    }

    .sidebar.tabsize_mode {
        position: fixed;
        overflow-y: scroll;
        height: calc(100% - 51px);
        z-index: 12;
    }

    .sidebar nav.menu {
        /* height: 100%; */
        /* top: 0; */
    }

    .sidebar-menu {
        /* height: 100%; */
    }

    .logout-menu {
        /* padding-top: 0;
        position: absolute!important;
        bottom: 0; */
        padding-top: 47px;
    }

    /* コンテンツ */

    .content {
        width: 100%;
        padding: 10px 10px;
        /* padding: 0; */
    }

    /* アンケート画面　*/
    .question-sp-content {
        width: 100%;
        padding: 10px 20px;
    }

    /* 画面タイトル */

    /* .screen-title-area {
        margin-bottom: 0;
    }

    .screen-title-area {
        margin-bottom: 1rem;
    } */

    /* 検索系共通 */

    .search-condition-area {
        margin-bottom: 2rem;
    }

    /* エリア共通 */

    /* div[class*="-area"] {
        width: 100%!important;
    } */

    /* TOP画面 - アンケート媒体集計 */

    .top .left-panel {
        margin-right: 0;
    }

    .top .questionnaire-media-tally-area {
        width:100%;
        /* width: auto; */
    }

    .top .questionnaire-media-tally-area .area-content div#piechart {
        /* width: 750px; */
        width: 100%;
        /* height: 450px;  */
        height: auto;
        margin: auto;
        padding: 10px;

    }

    .top .notification-area .area-content {
        max-height: 300px
    }

    /* 契約管理 - 契約詳細 - 契約書エリア */

    .agreement .contract-area .contract-no .select-key-no,
    .agreement .contract-area .contract-no .txt-key-no {
        width: calc(100% - 90px);
    }

    .rw-form dl dd:has(+ .no-text) {
        margin-right: 0;
    }

    .agreement .contract-area .flex-row > div {
        width: 100%;
        margin-bottom: 1rem;
    }

    .agreement .contract-area .flex-row > div:last-of-type {
        margin-bottom: 0;
    }

    /* 契約管理 - 請負金額内訳エリア */

    /* .agreement .contract-amount-breakdown-area table {
        min-width: 600px;
    } */

    .agreement .contract-amount-breakdown-area table th:first-of-type {
        min-width: 80px;
    }

    /* 契約管理 - 請求情報エリア */

    .agreement .bill-info-area table th:first-of-type {
        min-width: 80px;
    }

    /* 工事管理 */

    /* 工事管理 - 工事台帳検索 - 詳細/編集 - 基本情報エリア - 1行目 */

    .kouji .flex-row.width-equal-division.row-1 .flex-row > .flex-column {
        width: 100%;
        flex-basis: 100%!important;
    }

    .kouji .base-info-area .rw-form dl:has(dd + dd) dd {
        width: calc((100% - 100px - .5rem) / 2);
    }

    /* 工事管理 - 工事完了承認 - 基本情報エリア */

    .kouji.payment-approval .base-info-area {
        min-width: inherit;
        width: inherit;
    }

    /* 財務管理 - 仮契約登録 */

    .agreement.select-agreement-type .regist-info-area,
    .agreement.select-agreement-type .regist-info-area + .button-area,
    .agreement.confirm .regist-info-area,
    .agreement.confirm .regist-info-area + .button-area {
        width: 100%;
    }

    /* 工事書類管理/施工業者 - 見積書(作成)/発注書(作成) - 見積/発注内容エリア */

    /* .contractor.quotation .quotation-input-area table.sp tbody tr td .plus_button,
    .kouji.purchase-order .hacchu-input-area table.sp tbody tr td .plus_button,
    .contractor.moshitate .seikyu-input-area table.sp tbody tr td .plus_button {
        top: 35%;
    }

    .contractor.quotation .quotation-input-area table.sp tbody tr td .minus_button,
    .kouji.purchase-order .hacchu-input-area table.sp tbody tr td .minus_button,
    .contractor.moshitate .seikyu-input-area table.sp tbody tr td .minus_button {
        top: 65%;
    } */

    /* 工事書類管理/施工業者 - 見積書(作成) - 合計金額エリア */

    /* .contractor.quotation .file-attachment-area {
        width: 100%;
    }

    .contractor.quotation .total-order-amount-area {
        width: 100%;
    }

    .contractor.quotation .total-order-amount-area.attached-original-format.edit {
        width: 100%;
    }

    .contractor.quotation .total-order-amount-area.edit {
        width: 92%;
    }

    .contractor.quotation .total-order-amount-area.edit th {
        width: 20%;
    }

    .contractor.quotation .total-order-amount-area th {
        width: 20.5%;
    } */

    /* 工事書類管理/施工業者 - 発注書(作成) - 合計金額エリア */





    /* マスタ管理 - 担当者詳細 */

    .master.staff .staff-info-area {
        width: 100%;
    }

    /* WebAuthn登録 */
    .webauthn {
        height: auto!important;
    }
    .webauthn .btn {
        margin: 0 3px 0 0;
    }

}