@charset "UTF-8";

/******************************************************************************/
/*レイアウト
/******************************************************************************/
.container {
    width: 1430px;
}

body {
    font-size: 1.4rem;
    background-color: #ffffff;
}

/******************************************************************************/
/*共通デザイン
/******************************************************************************/
/*** 上下左右の配置 ***/
/* .上下左右中央 */
.v-h-center {
    display: -webkit-box;
    display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    -webkit-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
}

/* .上下中央右寄せ */
.v-center-h-right {
    display: -webkit-box;
    display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    -webkit-justify-content: flex-end;
    -ms-justify-content: flex-end;
    justify-content: flex-end;
}

/* .上下中央左寄せ */
.v-center {
    display: -webkit-box;
    display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
    -webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

/*** 紫色の画像背景 ***/
.purple-bg-image {
    background-image: url(../images/purple_bg_image.png);
}

/*** 大きめのフォントサイズ ***/
.font-large {
    font-size: 1.8rem;
}

/******************************************************************************/
/*ヘッダー
/******************************************************************************/
header {
    background-color: #ffffff;
}

header h1 {
    padding: 1rem 0rem 0rem 2rem;
}

header .purple-bg-image {
    min-height: 7.7rem;
}

header nav {
    width: 1400px;
    margin: 0rem auto;
}

header nav ul {
    width: auto;
}

header nav .dropdown-menu {
    background-color: #966699;
    padding: 0rem;
}

header nav .dropdown:hover .dropdown-menu {
    display: block;
}

header nav .global-nav {
    position: relative;
    width: 18rem;
    padding: 2.7rem 0rem;
    text-align: center;
    color: #ffffff;
    font-weight: bold;
}

header nav .global-nav::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0rem;
    display: block;
    width: 0.1rem;
    height: 2rem;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.6);
}

header nav .dropdown-menu {
    margin: 0rem;
}

header nav .dropdown-menu .global-nav::before {
    content: normal;
}

header nav .global-nav:hover {
    background-color: #864486;
    color: #ffffff;
}

/******************************************************************************/
/*メイン
/******************************************************************************/
/*** 共通デザイン ***/
main {
    padding-top: 18rem;
    padding-bottom: 7rem;
}

.section-title {
    position: relative;
    margin: 5rem 0rem;
    text-align: center;
}

.section-title:before {
    content: '';
    position: absolute;
    top: 50%;
    bottom: 0rem;
    z-index: 1;
    display: block;
    width: 100%;
    height: 0.1rem;
    background: linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
}

h2 {
    display: inline-block;
    z-index: 2;
    background-color: #ffffff;
    margin-bottom: 0rem;
    padding: 0rem 3rem;
    font-size: 3rem;
}

h2:before {
    content: normal;
}

h3 {
    margin-bottom: 0rem;
    padding-left: 0rem;
    border-left: none;
}

h3::before {
    content: '●';
    color: #864486;
}

h4 {
    border-left-color: #966699;
}

form input:focus,
.editable input:focus,
form select:focus,
.editable select:focus {
    background-color: #fffacd;
}

/* 縦書き */
.vertical-writing {
    writing-mode: vertical-rl;
}

/* 横方向の表 */
.horizontal-table {
    margin-bottom: 2rem;
}

.horizontal-table .table-row {
    margin: 0rem;
    border-width: 0.1rem;
    border-style: solid none;
    border-color: #E3E3E3;
}

.horizontal-table .table-row > div {
    padding: 3rem;
}

.horizontal-table .table-row > div:first-child {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #F0FAFF;
    padding-right: 0rem;
    padding-left: 0rem;
    font-weight: bold;
}

.horizontal-table .table-row > div:not(:first-child) {
    border-left: solid 0.1rem #E3E3E3;
}

/* 切替タブ */
.vega-tab-parent .vega-tab-active {
    background-color: #F0FAFF;
}

/* 薄灰色の背景 */
.bg-light-gray {
    background-color: #E7E6E6;
    color: #000000;
}

/*** モーダル ***/
.modal-frame .modal-body,
.modal-tenplate .modal-body {
    display: block;
}

/* 新規登録モーダルの幅 */
.modal-create {
    width: 140rem;
}

/*** 基本情報一覧 ***/
/* 編集できる表のデザイン */
.border-grid {
    line-height: 1.2;
}

.border-grid .rowspan {
    border-style: solid;
}

.border-grid > .sticky-header {
    position: sticky;
    z-index: 1;
    top: 178px;
}

.border-grid-1 > div {
    display: flex;
    align-items: center;
    justify-content: center;
}

.editable .form-h {
    margin-bottom: 0rem;
}

.editable .form-h .form-show {
    min-height: 2.2rem;
    padding: 0.3rem 0.6rem;
}

.editable input,
.editable select {
    height: auto;
    border: none;
    border-radius: 0;
    outline: none;
    line-height: 1.2;
    font-size: inherit;
}

.editable input:not([type="checkbox"]),
.editable select {
    width: 100%;
    padding: 0.3rem 0.6rem;
}

.editable select option {
    background-color: #ffffff;
}

.editable .border-grid-2 .form-checkbox {
    width: auto;
}

.editable .border-grid-2 .label-none .form-checkbox label {
    display: none;
}

/* エラーチェック */
.area-errors {
    background-color: #FFC7CE;
    margin-bottom: 2rem;
    padding: 1.5rem 0rem;
    border: solid 0.2rem #cccccc;
    color: #ff0000;
    font-size: 2rem;
}

/* 医師の検索 */
.P-doctors .area-search {
    margin-bottom: 2rem;
    padding: 2rem 1.5rem;
}

.P-doctors .area-search .gap-search {
    gap: 2rem 1.5rem;
}

/* 簡易医師情報一覧の細いチェックボックス列 */
.P-doctors .col-checkbox {
    width: 3rem;
}

.P-doctors .col-tel {
    width: 13rem;
}

/* 簡易医師情報一覧の詳細表示 */
.P-doctors .detail-box {
    border-color: #cccccc;
    border-style: none solid solid;
    padding: 1rem;
}

.P-doctors .detail-box .form-show {
    padding: 0.3rem 0.6rem;
}

.P-doctors .detail-box .is-edit {
    display: none;
}

.P-doctors .detail-box .form-edit {
    padding: 0.2rem;
}

.P-doctors .detail-box input:not([type="checkbox"]) {
    width: 100%;
    padding: 0rem 0.4rem;
}

.horizontal-table .table-row .area-import {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 2rem 0rem;
}

/* 出務希望 */
.bg-school {
    background-color: #D9E1F2;
}

.bg-exam {
    background-color: #FFE699;
}

.request-row {
    min-height: 4rem;
}

.P-doctors .border-grid-2 .selection-request {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.5rem;
}

.selection-choice {
    display: inline-block;
    background-color: #e4e4e4;
    padding: 0.5rem;
    border: 0.1px solid #aaaaaa;
    border-radius: 0.5rem;
    cursor: default;
}

.selection-choice .remove-choice {
    display: none;
}

.selection-choice:hover .remove-choice {
    display: inline-block;
    cursor: pointer;
    font-weight: bold;
    color: #999999;
}

.selection-item-cell {
    display: none;
}

.editable .selection-item-cell .datepicker {
    width: 0rem;
    padding: 0rem;
}

.area-checkboxes {
    gap: 1.5rem;
}

/* 学校からの距離 */
.download-location {
    position: absolute;
    top: 50%;
    right: 0rem;
    transform: translateY(-50%);
    z-index: 1;
    background-color: #ffffff;
    padding-left: 1rem;
}

/* 学校単位の黒枠 */
.border-grid .school-data {
    border-style: none solid solid;
    border-color: #555555;
}

/* 学校区分の列幅 */
.col-school-kbn {
    width: 10rem;
}

/*** 歯科健診出務選出 ***/
/* 選出ボタン */
.btn-selection {
    margin-bottom: 2rem;
    text-align: center;
}

.btn-selection .btn {
    padding: 2rem;
    font-size: 2rem;
}

/* 選出条件の優先順位入替 */
.table-conditionals {
    margin-bottom: 3rem;
    border: solid 0.1rem #000000;
}

.table-conditionals .table-header,
.table-conditionals .table-row > div:first-child {
    background-color: #E7E6E6;
}

.table-conditionals .table-header > div,
.table-conditionals .table-row > div {
    padding: 0.3rem 0.6rem;
    border: solid 0.1rem #888888;
}

.table-conditionals .table-row {
    min-height: 3.9rem;
}

.table-conditionals .conditionals-faraway {
    width: 6rem;
    height: auto;
}

/* 見出しの画像 */
.icon-examination {
    width: 15rem;
    margin-right: -6rem;
    margin-left: -4rem;
}

/* 休日の表 */
.area-holiday {
    margin-bottom: 2rem;
}

.table-holiday {
    width: 40rem;
    margin: 0rem auto 2rem;
}

/* 表内の画像 */
.table-row .icon-examination {
    width: 10rem;
    max-width: none;
    margin: 0rem -3rem;
}

/* 学校歯科健診の各割当て���数入力欄 */
.school-allocation {
    display: flex;
    gap: 3rem;
}

.school-allocation .form-label {
    width: 12rem;
    text-align: right;
}

/* 学校歯科健診の選出結果 */
.col-ymd {
    flex: 0 0 10rem;
    max-width: 10rem;
}

.col-ymdw {
    flex: 0 0 12.3rem;
    max-width: 12.3rem;
}

.col-school-name {
    flex: 0 0 16rem;
    max-width: 16rem;
}

.col-cnt {
    flex: 0 0 5rem;
    max-width: 5rem;
}

.table-result_schools .col-assigned-doctor {
    flex: 0 0 calc( 61.5rem / 8 );
    max-width: calc( 61.5rem / 8 );
}

/* その他の健診の選出結果 */
.P-assigns .table-confirm-exam .border-grid-2 > div {
    border-top-style: solid;
    border-bottom-style: none;
}

.P-assigns .table-confirm-exam .border-grid-2:last-child {
    border-bottom-style: solid;
}

/*** 選出結果出力 ***/
/* ヘッダーのある表 */
.P-assigns-result .horizontal-table .table-header {
    border-color: #555555;
    text-align: center;
}

.P-assigns-result .horizontal-table .table-header > div {
    background-color: #F0FAFF;
    font-weight: bold;
}

.P-assigns-result .col-download-excel {
    width: 20rem;
}

/* Excelのアイコン */
.border-grid .download-excel {
    padding: 0.5rem 1rem;
}

.download-excel img:hover {
    opacity: 1;
}

.assigned-doctor-table .doctor-name {
    font-size: 1.5rem;
    font-weight: bold;
}

.assigned-doctor-table .doctor-info {
    font-size: 1.2rem;
}
/******************************************************************************/
/*フッター
/******************************************************************************/
footer {
    width: 100%;
    padding: 1rem 0rem;
    border-top: solid 0.1rem #9C74AB;
    box-shadow: rgba(0, 15, 44, 0.3) 0px 0px 7px 0px;
    -webkit-box-shadow: rgba(0, 15, 44, 0.3) 0px 0px 7px 0px;
    -moz-box-shadow: rgba(0, 15, 44, 0.3) 0px 0px 7px 0px;
    font-size: 1rem;
    color: #fff;
}

/******************************************************************************/
/* datetimepicker のスタイル
/******************************************************************************/
/*** カレンダーの日曜日列 ***/
.xdsoft_calendar thead tr th:nth-of-type(1),
.xdsoft_calendar tbody tr .xdsoft_day_of_week0 {
    background-color: #FCE4D6;
}

/*** カレンダーの土曜日列 ***/
.xdsoft_calendar thead tr th:nth-of-type(7),
.xdsoft_calendar tbody tr .xdsoft_day_of_week6 {
    background-color: #D9E1F2;
}

/******************************************************************************/
/* スマホ対応
/******************************************************************************/
@media print, screen and (max-width: 767px) {
    /*** 共通デザイン ***/
}

/******************************************************************************/
/* 印刷対応
/******************************************************************************/
@media print {
    /*** 印刷時はヘッダー・フッター非表示 ***/
    header,
    footer {
        display: none;
    }
}
