@charset "utf-8";

/****************************************
　color
*****************************************/
:root {
    --main-blue: #1b456f;
    --main-orange: #f09503;
    --form-bg-color: #f0f3f5;
    --sub-info-color: #728da7;
    --main-text-color: #333333;
    --gray-1: #c2c2c2;
    --gray-2: #dddddd;
    --gray-3: #d8dde3;
    --gray-4: #cacfd8;
    --gray-5: #93999e;
    --gray-6: #6e7780;
    --red: #d30707;
    --yellow-1: #f2c11c;
    --yellow-2: #e8aa00;
    --lightgreen: #5bbc43;
    --green: #008d59;
    --lightblue: #49a2d3;
    --blue: #08508f;
    --purple: #9136b9;
    --pink: #f66c9c;
    --sunday-color: #db1c1c;
    --saturday-color: #216ab2;
    --default-event-color: #7c92c2;
    --pale-red-1: #fff5f4;
    --pale-red-2: #fff2f2;
    --pale-red-3: #ffd3d3;
    --pale-orange: #fff9e8;
    --pale-blue-1: #dce9f5;
    --pale-blue-2: #f0f9fe;
    --pale-yellow-1: #fefce1;
    --pale-yellow-2: #ffecc1;
    --pale-green: #f1faef;
    --dark-red: #702b26;
    --dark-green: #255d47;
    --dark-blue: #203655;
    --museum-pink: #eb7ea4;
    --museum-blue: #5fb0db;
    --museum-green: #84bb77;
}



/****************************************
　common
*****************************************/
* {
    box-sizing: border-box;
}
html {
    font-size: 62.5%;
    height: 100%;
}
body {
    height: 100%;
    color: var(--main-text-color);
    background-color: #f6f6f6;
    font-family: Arial,'Hiragino Sans','Meiryo','Hiragino Kaku Gothic ProN',sans-serif;
    margin: 0;
}

/* input, select */
input,
select {
    color: var(--main-text-color);
    font-family: Arial,'Hiragino Sans','Meiryo','Hiragino Kaku Gothic ProN',sans-serif;
}
input[type="text"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="number"],
textarea {
    width: 100%;
    border-radius: 4px;
    padding: 6px 8px;
    border: 1px solid var(--gray-1);
    background-color: #ffffff;
    text-align: left;
}
input[type="text"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="number"] {
    height: 3.2rem;
}
input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--main-blue);
    width: 1.4rem;
    height: 1.4rem;
}
th input[type="checkbox"],
td input[type="checkbox"] {
    width: 1.6rem;
    height: 1.6rem;
}
input[type="radio"]:disabled + span,
input[type="checkbox"]:disabled + span {
    color: var(--gray-5);
}
input[type="date"],
input[type="month"],
input[type="time"] {
    border: 1px solid var(--gray-1);
    position: relative;
    padding-left: 30px !important;
    background-repeat: no-repeat;
    background-position: 8px center;
    background-size: 1.4rem;
}
input[type="date"] {
    width: 15rem;
    background-image: url(../img/ic_calendar.svg);
}
input[type="date"]::-webkit-date-and-time-value {
    text-align: left;
}
input[type="month"] {
    width: 14rem;
    background-image: url(../img/ic_calendar.svg);
}
input[type="time"] {
    background-image: url(../img/ic_time.svg);
}
input[type="number"] {
    padding: 6px;
}
input[type="date" i]::-webkit-calendar-picker-indicator,
input[type="month" i]::-webkit-calendar-picker-indicator,
input[type="time" i]::-webkit-calendar-picker-indicator {
    position: absolute;
    left: 8px;
    padding: 0;
    margin: 0;
    opacity: 0;
}
input[type="date"]:disabled,
input[type="month"]:disabled,
input[type="time"]:disabled {
    background-color: #f1f1f1;
    color: #888888;
}
textarea {
    display: block;
    resize: none;
    font-weight: 300;
    font-size: 1.4rem;
    font-family: Arial,'Hiragino Sans','Meiryo','Hiragino Kaku Gothic ProN',sans-serif;
    padding: 4px 6px;
    line-height: 1.4;
}
::placeholder {
    color: var(--gray-1);
}

select {
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0;
    appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    background-color: transparent;
    line-height: calc(3.2rem - 10px);
    padding: 4px 24px 4px 6px;
}
.select-box {
    height: 3.2rem;
    border: 1px solid var(--gray-1);
    border-radius: 4px;
    background-position: center right 6px;
    background-image: url(../img/select_arrow.svg);
    background-repeat: no-repeat;
    background-position: right 6px center;
    background-size: 12px;
    background-color: #ffffff;
}

/* button */
button:disabled {
    filter: brightness(.9);
    opacity: .4;
}
.ic-btn .caption {
    display: none;
}
.caption {
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

/* switch */
.switch {
    display: flex;
    align-items: center;
    width: 100%;
}
.switch input[type="radio"] {
    display: none;
}
.switch label {
    position: relative;
    display: block;
    width: 50%;
    height: 3.6rem;
    line-height: 3.6rem;
    border: 1px solid var(--gray-1);
    color: var(--gray-5);
    text-align: center;
}
.switch label p {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    height: 3.5rem;
    z-index: 1;
}
.switch label:first-of-type {
    border-radius: 4px 0 0 4px;
    border-right: 0;
}
.switch label:not(:first-of-type, :last-of-type) {
    border-right: 0;
    border-left: 0;
}
.switch label:last-of-type {
    border-radius: 0 4px 4px 0;
    border-left: 0;
}
.switch label:not(:first-of-type):after {
    content: "";
    display: block;
    width: 1px;
    height: calc(100% - 8px);
    background-color: var(--gray-1);
    position: absolute;
    top: 4px;
    left: -.25rem;
}
.switch input[type="radio"]:first-of-type:checked ~ label:nth-of-type(2):after,
.switch input[type="radio"]:nth-of-type(2):checked ~ label:nth-of-type(2):after,
.switch input[type="radio"]:nth-of-type(2):checked ~ label:nth-of-type(3):after,
.switch input[type="radio"]:nth-of-type(3):checked ~ label:nth-of-type(3):after,
.switch input[type="radio"]:nth-of-type(3):checked ~ label:nth-of-type(4):after,
.switch input[type="radio"]:nth-of-type(4):checked ~ label:nth-of-type(4):after,
.switch input[type="radio"]:nth-of-type(4):checked ~ label:nth-of-type(5):after,
.switch input[type="radio"]:nth-of-type(5):checked ~ label:nth-of-type(5):after {
    content: none;
}
.switch input[type="radio"]:first-of-type:checked ~ label:first-of-type p,
.switch input[type="radio"]:nth-of-type(2):checked + input[type="radio"] + label+ label p,
.switch input[type="radio"]:last-of-type:checked ~ label:last-of-type p  {
    color: #ffffff;
}
.switch label:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    border-radius: 3px;
    z-index: 0;
}

/* check button */
.check-btn-area {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.check-btn-area input[type="checkbox"] {
    display: none;
}
.check-btn-area label {
    display: flex;
    text-align: center;
    color: var(--gray-5);
    height: 3.2rem;
    line-height: 3.2rem;
    border-radius: 4px;
}
.check-btn-area label span {
    border-radius: 4px;
}
.check-btn-area input[type="checkbox"]:checked + label {
    background-color: var(--main-blue);
    border-color: var(--main-blue);
    color: #ffffff;
}

/* check list */
.check-area {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.check-area label,
[for="non-hs-chk"] {
    display: flex;
    align-items: center;
}
[for="non-hs-chk"] {
    color: var(--gray-6);
}
.check-list {
    background-color: #ffffff;
    border-radius: 4px;
    padding: 0 8px;
}
.check-list li {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
}
.check-list li:not(:last-child) {
    border-bottom: 1px solid var(--gray-3);
}
.check-list li input[type="checkbox"] {
    display: block;
    width: 1.6rem;
    height: 1.6rem;
}

/* radio, checkbox */
.check-area,
.radio-btn-area {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px;
}
.radio-btn-area input[type="radio"] {
    margin: 0;
}
.check-area label,
.radio-btn-area label {
    display: flex;
    align-items: center;
    gap: 3px;
}
.check-area label input[type="checkbox"] {
    margin: 0;
}
.radio-btn-area label:not(:last-of-type) {
    margin-right: 12px;
}
.check-area label span,
.radio-btn-area label span {
    display: block;
    white-space: nowrap;
}

/* focus */
.nav-btn:focus,
.nav-btn:focus-visible,
input:focus,
input:focus-visible,
select:focus,
select:focus-visible,
button:focus,
button:focus-visible {
    outline: none;
}
input[type="text"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
textarea:focus,
textarea:focus-visible {
    outline: 1px solid var(--main-blue);
    outline-offset: -1px;
}

#err-message,
#m-err-message,
.err-msg,
.warning,
#message-address {
    color: var(--red) !important;
    line-height: 1.4;
}
main.master.holiday #err-message {
    margin-bottom: 10px;
}
.modal.member-edit #err-message {
    position: absolute;
    left: 16px;
    bottom: 14px;
}
.form-date #err-message {
    width: 100%;
}
.master.week .err-msg {
    margin-bottom: 4px;
}
.caution {
    color: var(--gray-6);
}


/* button
--------------------------------------- */
.btn {
    border: 1px solid;
    border-radius: 3px;
    font-weight: normal;
    padding: 4px 12px;
    white-space: nowrap;
    font-size: 1.4rem;
    line-height: calc(3rem - 10px);
    font-family: Arial,'Hiragino Sans','Meiryo','Hiragino Kaku Gothic ProN',sans-serif;
}
.btn-area {
    position: relative;
}
.ic-btn {
    position: relative;
    display: block;
    border: 0;
    border-radius: 3px;
    padding: 0;
}
.ic-btn .ic {
    display: block;
    width: 100%;
    height: 100%;
    background-color: transparent;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: 1.8rem;
    -webkit-mask-size: 1.8rem;
}
main:not(.answer-list, .rsv-list) td .ic-btn {
    margin: 0 auto;
}
.btn.gray,
.ic-btn.gray-border {
    color: var(--gray-6);
    background-color: #ffffff;
    border: 1px solid var(--gray-5) !important;
}
.btn.orange,
.ic-btn.orange:not(.memo-edit) {
    background-color: var(--main-orange) !important;
    color: #ffffff;
    border-color: var(--main-orange) !important;
}
.btn.blue,
.ic-btn.blue {
    background-color: var(--main-blue);
    color: #ffffff;
    border-color: var(--main-blue);
}
.btn.orange-border,
.ic-btn.orange-border {
    background-color: #ffffff;
    color: var(--main-orange);
    border: 1px solid var(--main-orange);
}
.btn.blue-border,
.ic-btn.blue-border {
    background-color: #ffffff;
    color: var(--main-blue);
    border: 1px solid var(--main-blue);
}
.btn.red-border,
.ic-btn.red-border {
    background-color: #ffffff;
    color: var(--red);
    border: 1px solid var(--red);
}
.ic-btn.edit {
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 1.4rem;
}
.ic-btn.edit .ic {
    mask-image: url(../img/ic_edit.svg);
    -webkit-mask-image: url(../img/ic_edit.svg);
    mask-size: 1.6rem;
    -webkit-mask-size: 1.6rem;
    background-color: var(--main-blue);
}
.ic-btn.edit.blue {
    position: relative;
    border-radius: 4px;
}
.ic-btn.edit.blue.mark:before {
    content: "";
    position: absolute;
    right: .25rem;
    bottom: .25rem;
    display: block;
    width: .45rem;
    height: .45rem;
    border-radius: .25rem;
    background-color: var(--main-orange);
}
.ic-btn.edit.blue .ic {
    mask-image: url(../img/ic_edit.svg);
    -webkit-mask-image: url(../img/ic_edit.svg);
    mask-size: 1.4rem;
    -webkit-mask-size: 1.4rem;
    background-color: #ffffff;
}
.ic-btn.add.orange .ic {
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-size: 1.6rem;
    -webkit-mask-size: 1.6rem;
    background-color: #ffffff;
}
.ic-btn.add.gray,
.ic-btn.delete.gray {
    border: 1px solid var(--gray-4);
    background-color: var(--form-bg-color);
}
.ic-btn.add.gray .ic {
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-size: 1.6rem;
    -webkit-mask-size: 1.6rem;
    background-color: var(--gray-6);
}
.ic-btn.delete.gray .ic {
    mask-image: url(../img/ic_delete_g.svg);
    -webkit-mask-image: url(../img/ic_delete_g.svg);
    mask-size: 1.4rem;
    -webkit-mask-size: 1.4rem;
    background-color: var(--gray-6);
}
.ic-btn.save.orange-border .ic,
.ic-btn.save.orange .ic {
    mask-image: url(../img/ic_check.svg);
    -webkit-mask-image: url(../img/ic_check.svg);
    mask-size: 1.6rem;
    -webkit-mask-size: 1.6rem;
    background-color: var(--main-orange);
}
.ic-btn.close .ic,
.ic-btn.cancel .ic {
    mask-image: url(../img/ic_close.svg);
    -webkit-mask-image: url(../img/ic_close.svg);
    mask-size: 1.4rem;
    -webkit-mask-size: 1.4rem;
    background-color: var(--gray-5);
}
.ic-btn.delete.red-border .ic {
    mask-image: url(../img/ic_delete.svg);
    -webkit-mask-image: url(../img/ic_delete.svg);
    mask-size: 1.4rem;
    -webkit-mask-size: 1.4rem;
    background-color: var(--red);
}
.ic-btn.card .ic {
    mask-image: url(../img/ic_card.svg);
    -webkit-mask-image: url(../img/ic_card.svg);
    mask-size: 1.4rem;
    -webkit-mask-size: 1.4rem;
    background-color: var(--main-blue);
}
.ic-btn.detail {
    background-color: transparent;
}
.ic-btn.detail .ic {
    mask-image: url(../img/ic_detail.svg);
    -webkit-mask-image: url(../img/ic_detail.svg);
    mask-size: 1.4rem;
    -webkit-mask-size: 1.4rem;
    background-color: var(--main-blue);
}
.ic-btn.qa {
    background-color: var(--pale-green);
}
.ic-btn.qa .ic {
    mask-image: url(../img/ic_qa.svg);
    -webkit-mask-image: url(../img/ic_qa.svg);
    background-color: var(--dark-green);
}
.btn-area {
    display: flex;
    gap: 10px;
}
.ic-btn.btn-search,
.ic-btn.btn-clear {
    width: 3.6rem;
    height: 3.6rem;
    border: 1px solid var(--gray-1);
    border-radius: 1.8rem;
    padding: 0;
}
.ic-btn.btn-search {
    background-color: #ffffff;
}
.ic-btn.btn-search .caption {
    display: none;
}
.ic-btn.btn-search .ic {
    mask-image: url(../img/ic_search.svg);
    -webkit-mask-image: url(../img/ic_search.svg);
    mask-size: 2rem;
    -webkit-mask-size: 2rem;
    background-color: var(--gray-5);
}

/* 保存ボタン */
body:not(.mobile) button.btn.orange {
    min-width: 6.6rem;
}
body:not(.mobile) .btn-area button:not([style="display: none;"]) + button.btn.orange,
body:not(.mobile) .top-btn-area p + button.btn.orange {
    position: relative;
    margin-left: 3rem;
}
body:not(.mobile) .btn-area button:not([style="display: none;"]) + button.btn.orange::before,
body:not(.mobile) .top-btn-area p + button.btn.orange::before {
    content: "";
    position: absolute;
    width: 0;
    height: 100%;
    left: -2.1rem;
    top: 0;
    border-right: 1px solid var(--gray-1);
    pointer-events: none;
}

/* ページ下のボタン */
.btn-area-bottom {
    margin-top: 6px;
}
.btn-area-bottom,
.btn-area-bottom > div {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/* slide button */
.btn-slide {
    width: 2.6rem;
    height: 3rem;
    border: 0;
    background-color: transparent;
    position: relative;
}
.btn-slide:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-left: .8rem solid var(--gray-1);
    border-top: .7rem solid transparent;
    border-bottom: .7rem solid transparent;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
.btn-slide:not(.closed) {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
}

/* text button */
.text-btn {
    display: flex;
    align-items: center;
    gap: 0 4px;
    height: 2rem;
    color: var(--gray-6);
    font-size: 1.2rem;
    border: 0;
    border-radius: 4px;
    background-color: transparent;
    margin-bottom: 6px;
}
.text-btn:before {
    content: "";
    display: block;
    width: .6rem;
    height: .6rem;
    border-top: 1px solid var(--gray-6);
    border-left: 1px solid var(--gray-6);
    transform: rotate(-45deg);
}
.text-btn.blue {
    color: var(--main-blue);
}
.text-btn.blue:before {
    border-color: var(--main-blue)!important;
}


/* header
--------------------------------------- */
header {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    width: 100%;
    height: 4.8rem;
    border-bottom: 1px solid var(--gray-1);
    background-color: #ffffff;
    padding-left: 4.8rem;
    z-index: 220;
}
.header-inner {
    width: 100%;
}
.header-inner .sp-nav {
    display: grid;
    grid-template-columns: 15rem 1fr 1fr 4rem;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    padding: 0 12px;
}

/* system name */
header .sys-name {
    width: auto;
    grid-column: 1/2;
    grid-row: 1/1;
    background-repeat: no-repeat;
    background-position: center;
}
body:not(.mobile) header .sys-name {
    height: 100%;
    background-image: url(../img/systemlogo1.svg);
    background-size: contain;
    margin-right: 24px;
}


/* user name */
header .user-name {
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: 3.8rem;
    margin-left: auto;
    margin-right: 12px;
    grid-column: 3/4;
    grid-row: 1/1;
}
header .user-name:before {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background-image: url(../img/ic_user_b.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

/* button */
header .btn-area {
    display: none;
}
.btn-manual,
.btn-logout {
    display: block;
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 1.7rem;
    border: 1px solid var(--gray-1);
    filter: brightness(1);
    color: transparent;
    padding: 0;
    background-color: #ffffff;
    position: relative;
}
.btn-manual {
    margin-right: 24px;
}
.btn-logout .ic,
.btn-manual .ic {
    display: block;
    width: 100%;
    height: 100%;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 64%;
    -webkit-mask-size: 64%;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: var(--main-blue);
}
.btn-logout .ic {
    mask-image: url(../img/ic_logout.svg);
    -webkit-mask-image: url(../img/ic_logout.svg);
    grid-column: 4/5;
    grid-row: 1/1;
}
.btn-manual .ic {
    mask-image: url(../img/ic_manual.svg);
    -webkit-mask-image: url(../img/ic_manual.svg);
    grid-column: 2/3;
    grid-row: 1/1;
}


/* nav
--------------------------------------- */
.nav-area {
    display: block;
    height: 100%;
    position: fixed;
    top: 4.8rem;
    left: 0;
    z-index: 200;
}

/* menu button */
.nav-btn {
    position: absolute;
    top: -4.8rem;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: .7rem;
    background-color: var(--main-blue);
    border-bottom: 1px solid var(--gray-1);
    width: 4.8rem;
    height: 4.8rem;
    border: 0;
    transition: all .2s;
    -webkit-transition: all .2s;
    -ms-transition: all .2s;
}
.nav-btn:before,
.nav-btn:after {
    content: "";
}
.nav-btn span,
.nav-btn:before,
.nav-btn:after {
    display: block;
    width: 2.6rem;
    height: .2rem;
    background-color: #ffffff;
    transition: all .2s;
    -webkit-transition: all .2s;
    -ms-transition: all .2s;
}

/* nav */
nav {
    width: 4.8rem;
    height: calc(100% - 4.8rem);
    background-color: var(--main-blue);
    overflow: visible;
    position: relative;
}
.nav-ttl,
nav > ul:not(:first-of-type) {
    margin-top: 2rem;
    position: relative;
}
.nav-ttl:after,
nav > ul:not(:first-of-type):before {
    content: "";
    display: block;
    width: 90%;
    height: 1px;
    background-color: rgba(255, 255, 255, .6);
    position: absolute;
    top: -1rem;
    left: 5%;
}
.nav-area.closed .nav-ttl:after,
.nav-area.closed nav > ul:not(:first-of-type):before {
    width: 70%;
    left: 15%;
}
nav li {
    position: relative;
}
.closed nav ul:first-child li:last-child:before {
    width: 100%;
    left: 0;
    border-bottom-style: solid;
}
nav li a,
.nav-ttl {
    display: flex;
    align-items: center;
    padding: 7px 12px;
}
nav li a:before,
.nav-ttl:before {
    content: "";
    display: block;
    width: 3rem;
    height: 3rem;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: 2rem;
    -webkit-mask-size: 2rem;
    background-color: #ffffff;
}
nav li.schedule a:before {
    mask-image: url(../img/ic_calendar.svg);
    -webkit-mask-image: url(../img/ic_calendar.svg);
}
nav li.nippou a:before {
    mask-image: url(../img/ic_nippou.svg);
    -webkit-mask-image: url(../img/ic_nippou.svg);
    mask-size: 2.2rem;
    -webkit-mask-size: 2.2rem;
}
nav li.mymember a:before {
    mask-image: url(../img/ic_star_w.svg);
    -webkit-mask-image: url(../img/ic_star_w.svg);
}
nav li.m-calendar a:before {
    mask-image: url(../img/ic_m_calendar.svg);
    -webkit-mask-image: url(../img/ic_m_calendar.svg);
}
nav li.m-rsv a:before {
    mask-image: url(../img/ic_yoyakulist.svg);
    -webkit-mask-image: url(../img/ic_m_rsv.svg);
}
nav li.m-answer a:before {
    mask-image: url(../img/ic_m_answer.svg);
    -webkit-mask-image: url(../img/ic_m_answer.svg);
}
.nav-master li a:before {
    mask-image: url(../img/ic_navMaster.svg);
    -webkit-mask-image: url(../img/ic_navMaster.svg);
    mask-size: .8rem;
    -webkit-mask-size: .8rem;
}
nav a,
nav p {
    color: #ffffff;
    font-size: 1.5rem;
    white-space: nowrap;
}
nav a {
    text-decoration: none;
}
nav ul li a p,
.nav-master,
.nav-ttl span {
    display: none;
}
nav li.current,
.closed .nav-ttl.current {
    background-color: #f6f6f6;
}
.nav-area.open nav li.current a,
.nav-area.open nav li.current a p {
    color: var(--main-blue);
}
li.current a:not(.nav-master.open .current a):before,
.closed .nav-ttl.current:before {
    background-color: var(--main-blue);
}
.nav-area.open .nav-master li.current a:before {
    filter: contrast(0) sepia(1) hue-rotate(154deg) saturate(1);
}
.closed .nav-master li.current {
    background-color: initial;
}
.closed .nav-master li.current a:before {
    filter: none;
}
.closed .nav-master li.current {
    position: relative;
}
.closed .nav-master li.current a:after {
    content: "";
    display: block;
    width: 4px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--main-orange);
}

/* museum, master */
.closed .nav-master.open {
    display: block;
    max-height: calc(100dvh - ((22.5rem + 84px) + 4.8rem));
    overflow-y: auto;
    position: absolute;
    top: calc(22rem + 84px);
    left: calc(4.8rem + 1px);
}
.closed .nav-master {
    background-color: var(--main-blue);
}
.closed .nav-master a {
    padding-right: 16px;
}

/* navi title */
.nav-ttl {
    padding: 6px 12px;
}
.closed .nav-ttl.museum {
    display: none;
}
.closed .nav-ttl.museum:before {
    mask-image: url(../img/ic_museum.svg);
    -webkit-mask-image: url(../img/ic_museum.svg);
}
.nav-ttl.master:before {
    mask-image: url(../img/ic_master.svg);
    -webkit-mask-image: url(../img/ic_master.svg);
}

/* nav open */
.nav-area.open nav {
    width: 220px;
    overflow-y: auto;
    transition: all 0s !important;
    -webkit-transition: all 0s !important;
    -ms-transition: all 0s !important;
}
div[class*="nav-area"].open .nav-btn {
    gap: 0;
}
div[class*="nav-area"].open .nav-btn span {
    opacity: 0;
}
div[class*="nav-area"].open .nav-btn:before {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    margin-bottom: -.2rem;
}
div[class*="nav-area"].open .nav-btn:after {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    margin-top: -.2rem;
}
.nav-area.open li a p,
.nav-area.open .nav-master,
.nav-area.open .nav-ttl span {
    display: block;
}
.nav-area.open .nav-master {
    padding-bottom: 20px;
}
.nav-area.open .nav-ttl:before {
    /* display: none; */
}


/* page header
--------------------------------------- */
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 3.2rem;
    margin-bottom: 8px;
}
main.group-member .page-header,
main.holiday .page-header,
main.room .page-header,
main.week .page-header {
    justify-content: flex-start;
}
main.group-member .page-header {
    margin-bottom: 12px;
}
main .page-header-content {
    display: flex;
    align-items: center;
    gap: 10px;
}
main .page-header-content > p {
    margin-right: 10px;
}
.page-header p {
    width: auto;
    background-color: transparent;
    color: var(--main-text-color);
    text-align: left;
    font-weight: 600;
    font-size: 1.8rem;
    line-height: initial;
    margin-right: 16px;
}
.top-btn-area {
    width: 100%;
    display: flex;
    gap: 10px;
    align-items: center;
    flex-direction: row;
}
.top-btn-area p {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}
.page-header .btn-area-2 {
    display: flex;
    gap: 10px;
    border-left: 1px solid var(--gray-1);
    padding-left: 10px;
}


/* main
--------------------------------------- */
main {
    position: relative;
    width: 100%;
    padding-top: 8.8rem;
}
main:not(.schedule) {
    padding-top: calc(4.8rem + 12px);
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: calc(4.8rem + 20px);
    background-color: #f6f6f6;
}
.main-content {
    position: relative;
    width: 100%;
    background-color: #ffffff;
}
main:not(.nav-open) .main-content {
    margin-left: 0;
}
main:not(.schedule) .main-content {
    padding: 12px;
}


/* schedule
--------------------------------------- */
main.schedule {
    position: relative;
    height: 100%;
    padding-top: 4.8rem;
    overflow: hidden;
}
main.schedule .main-content {
    height: 100%;
}
main.schedule .main-content-inner {
    height: 100%;
}
main.schedule h2 {
    margin-top: 16px;
    margin-left: 16px;
}


/* calendar contents
--------------------------------------- */
.calendar-area {
    height: 100%;
    position: relative;
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

/* calendar - toolbar ************/
.fc .fc-toolbar.fc-header-toolbar {
    position: fixed;
    margin-bottom: 0;
}
.fc .fc-toolbar-title {
    font-weight: 600;
    padding-right: 3rem;
}
.fc .fc-toolbar .fc-toolbar-chunk:first-child {
    display: flex;
    align-items: center;
}
.fc .fc-toolbar .fc-toolbar-chunk:nth-child(2) {
    display: none;
}
.fc-today-button {
    width: 4.4rem;
    height: 3rem;
    white-space: nowrap;
    font-size: 1.3rem !important;
    padding: 0 8px !important;
}
.fc .fc-button-primary:disabled {
    opacity: .3;
}
.fc-prev-button,
.fc-next-button {
    background-color: transparent !important;
    border-radius: 15px !important;
    width: 3rem;
    height: 3rem;
    border: none !important;
    display: flex !important;
    justify-content: center;
    align-items: center;
}
.fc-prev-button {
    margin-right: 8px !important;
}
.fc-prev-button:active,
.fc-next-button:active {
    background-color: var(--form-bg-color) !important;
}
.fc .fc-button-primary {
    box-shadow: none !important;
}
.fc .fc-button .fc-icon {
    font-size: 2.4rem;
    border-radius: 50%;
}

/* 日付選択 */
.calendar-area .select-date {
    position: fixed;
    height: 3.6rem;
    background-image: url(../img/select_arrow.svg);
    background-repeat: no-repeat;
    background-size: 1.3rem;
    z-index: 240;
}
.calendar-area.select-open .select-date {
    z-index: 0;
}
.calendar-area .select-date input[type="date"] {
    width: 100%;
    min-width: 0;
    height: 100%;
    color: transparent;
    border: 0;
    background: none;
    padding: 0 !important;
}
.calendar-area .select-date input[type="date"]:focus,
.calendar-area .select-date input[type="date"]:focus-within {
    outline: 0;
}
.calendar-area .select-date input[type="date" i]::-webkit-calendar-picker-indicator {
    width: 100%;
    height: 100%;
    left: 0;
}
.calendar-area .select-date input[type="date"]::-webkit-datetime-edit,
.calendar-area .select-date input[type="date"]::-webkit-datetime-edit-fields-wrapper {
    display: none !important;
}

/* calendar func ****************/
.calendar-func {
    display: flex;
    position: fixed;
    z-index: 240;
}

/* カレンダー切替 */
.select-kind {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    padding: 8px;
}
.select-kind input[type="radio"] {
    display: none;
}
.select-kind label {
    width: calc(100%/3);
    height: 3.8rem;
    text-align: center;
    line-height: 3.8rem;
    color: var(--main-blue);
    border-top: 1px solid var(--gray-1);
    border-left: 1px solid var(--gray-1);
    border-bottom: 1px solid var(--gray-1);
}
.select-kind label:first-of-type {
    border-radius: 4px 0 0 4px;
}
.select-kind input[type="radio"].day-for-sp + label,
.select-kind input[type="radio"].day-for-pc + label {
    border-radius: 0 4px 4px 0;
    border-right: 1px solid var(--gray-1);
}
.select-kind input[type="radio"]:checked + label {
    background-color: var(--main-blue) !important;
    color: #ffffff;
    border-color: var(--main-blue);
}

/* グループ選択 */
.select-group-area {
    position: relative;
}
.select-group-area .select-box p {
    line-height: 3.2rem;
    white-space: nowrap;
    overflow: hidden;
    margin: 0 28px 0 8px;
}
.select-group-menu,
.search-member-inner {
    background-color: #ffffff;
    outline: 1px solid var(--gray-1);
    outline-offset: -1px;
    box-shadow: 0 .2rem .4rem rgba(120, 120, 120, .3);
}
.select-group-menu {
    position: absolute;
    max-height: 80dvh;
    overflow-y: auto;
    top: 2.8rem;
    left: 0;
    z-index: 241;
}
.group-menu-content {
    padding: 6px 10px;
}
.group-menu-content:first-child {
    border-bottom: 1px solid var(--gray-2);
    margin-bottom: 4px;
}
.group-menu-content:nth-child(3) {
    border-bottom: 0;
    margin-bottom: 0;
}
.group-menu-content > p {
    font-size: 1.2rem;
    color: var(--gray-6);
    margin-bottom: .4rem;
}
.group-menu-content:nth-child(3) > p {
    position: relative;
}
.group-menu-content:nth-child(3) > p:before {
    content: "";
    width: 100%;
    height: 1px;
    background-color: var(--gray-2);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: 0;
    z-index: -1;
}
.group-menu-content:nth-child(3) > p span {
    display: inline-block;
    background-color: #ffffff;
    padding: 0 6px;
}
.group-menu-content li,
.search-member-area p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border: 1px solid transparent;
    border-radius: 4px;
    padding: 0 6px;
}
.group-menu-content li {
    width: 18rem;
    height: 3rem;
    line-height: 3rem;
    background-repeat: no-repeat;
    background-position: left 6px center;
    background-size: 1.6rem;
}
.search-member-area p {
    width: 100%;
    height: calc(3rem - 2px);
    line-height: calc(3rem - 2px);
}
.group-menu-content .li-select-me,
.group-menu-content .li-search-member {
    padding-left: calc(1.6rem + 12px);
}
.group-menu-content .li-select-me {
    background-image: url(../img/ic_me.svg);
}
.group-menu-content .li-search-member {
    background-image: url(../img/ic_search.svg);
}
.group-menu-content li.active,
.search-member-area li.active p {
    border: 1px solid var(--main-text-color);
    background-color: var(--pale-blue-2);
}

/* 社員検索 */
.search-member-area {
    position: absolute;
    top: 19rem;
    left: 30rem;
    z-index: 242;
}
.search-member-area .modal-header {
    display: none;
}
.search-member-inner {
    width: 19rem;
}
.search-member-area .input-area {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px;
}
.search-member-area input[type="text"] {
    width: calc(100% - (2.8rem + 6px));
    height: 3rem;
}
.search-member-area .ic-btn.btn-search {
    width: 2.8rem !important;
    height: 2.8rem;
}
.search-member-area .ic-btn.btn-search .ic {
    mask-size: 1.7rem;
    -webkit-mask-size: 1.7rem;
}
.search-member-area ul {
    max-height: 24.6rem;
    overflow-y: auto;
}
.search-member-area li {
    position: relative;
    border-bottom: 1px solid var(--gray-2);
    padding: 2px 0;
    margin: 0 6px;
}
body:not(.mobile) .calendar-area.week .search-member-area  {
    left: unset;
    right: 15.6rem;
}

/* 社員選択 */
.select-member-area {
    display: flex;
    background-color: #ffffff;
    z-index: 240;
}
.select-member {
    width: 100%;
    border-bottom: 0;
    padding-right: 14px;
    padding-left: 14px;
}
.select-member select {
    font-size: 1.4rem;
    border-bottom: 0;
}

/* 予定追加ボタン */
.fc-addEvent-button {
    position: relative;
    border: 0 !important;
    border-radius: 50%;
    background-color: transparent !important;
    padding: 0;
}
.fc-addEvent-button:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: var(--main-orange);
}
.fc-addEvent-button:before {
    display: none;
}

/* 予定検索 */
.skd-search-btn {
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 1.6rem;
    background-image: url(../img/ic_search.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60%;
}
.skd-search-btn input[type="radio"] {
    display: none;
}
body:not(.mobile) .skd-search-btn {
    margin-left: .4rem;
}
.skd-search-area {
    display: flex;
    align-items: center;
    gap: .4rem;
}
body:not(.mobile) .calendar-func.skd-search-area {
    margin-top: -.4rem;
}
.skd-search-area > div {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem .8rem;
    background-color: var(--form-bg-color);
    border-radius: 4px;
}
.skd-search-area .member-name {
    max-width: 20rem;
    margin-right: .8rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.skd-search-area input[type="text"] {
    width: 18rem;
}
.skd-search-area .btn-search,
.skd-search-close-btn {
    width: 3.2rem;
    height: 3.2rem;
    padding: 0 !important;
}
.skd-search-area .btn-search .ic {
    mask-size: 1.8rem;
    -webkit-mask-size: 1.8rem;
}
.skd-search-close-btn {
    background-image: url(../img/ic_close.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.6rem;
    background-color: transparent;
    border-radius: 1.6rem;
}


/* calendar - table *************/
.calendar-area .fc-daygrid-day-frame .fc-daygrid-day-bg {
    display: grid;
    align-items: flex-end;
    margin-top: auto;
    margin-bottom: 0;
}
.fc .fc-col-header-cell-cushion {
    height: 2rem;
    line-height: 2rem;
    font-size: 1.2rem;
    padding: 0;
}
.fc-timeGridWeek-view .fc-daygrid-body,
.fc-timeGridWeek-view .fc-daygrid-day,
.fc-timeGridDay-view .fc-daygrid-body {
    position: relative;
}
.fc-timeGridDay-view .fc-timegrid-axis-frame {
    align-items: flex-start;
    padding-top: .5rem;
}
.fc-timeGridWeek-view .fc-daygrid-day {
    border: 0;
}
.fc-theme-standard .fc-scrollgrid {
    border-left: 0;
}
.fc-theme-standard th {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    background-color: #ffffff;
}
.fc-timeGridWeek-view th,
.fc-timeGridDay-view th {
    border: 0;
}
.fc-timeGridDay-view .fc-scrollgrid > thead {
    display: none;
}
.fc-day-sat .fc-daygrid-day-number,
.fc-day-sat .fc-col-header-cell-cushion {
    color: var(--saturday-color);
}
.fc-day-sun .fc-daygrid-day-number,
.fc-day-sun .fc-col-header-cell-cushion,
.holiday-frame .fc-daygrid-day-number,
.holiday .fc-event-title {
    color: var(--sunday-color);
}
.calendar-area .fc-daygrid-day-frame::after,
.calendar-area .fc-daygrid-day-frame::before {
    content: none;
}
.calendar-area.week .fc-daygrid-body-unbalanced .fc-daygrid-day-events,
.calendar-area.day .fc-daygrid-body-unbalanced .fc-daygrid-day-events {
    min-height: 0;
}

/* calendar - events *************/
.calendar-area.week .fc-daygrid-body-natural .fc-daygrid-day-events {
    margin-bottom: .2rem;
}

/* calendar - holiday *************/
.holiday .fc-event-title {
    width: calc(100% - (2.6rem + 8px));
    font-size: 1rem !important;
    line-height: 1.3;
    margin: .3em !important;
}
body:not(.mobile) .holiday .fc-event-title {
    position: absolute;
    left: 0;
    bottom: 0;
}
.fc .fc-timegrid-slot-label {
    border: 0;
    position: relative;
}
.fc-direction-ltr .fc-timegrid-slot-label-frame {
    position: absolute;
    top: -37%;
    right: 0;
}
td[data-time="00:00:00"] > .fc-timegrid-slot-label-frame {
    display: none;
}
.fc-theme-standard td {
    background-color: transparent;
}
.fc-theme-standard td[role="presentation"] {
    border-right: 0;
}
.fc-timegrid-slots colgroup col {
    width: 40px !important;
}
.fc-timegrid-col-misc {
    display: none;
}
.fc-theme-standard .fc-timeGridWeek-view td,
.fc-theme-standard .fc-timeGridDay-view td {
    border-left-color: #ffffff;
}
.fc-theme-standard .fc-timeGridWeek-view .fc-timegrid-axis,
.fc-theme-standard .fc-timeGridDay-view .fc-timegrid-axis {
    border-right-color: #ffffff;
}
.fc .fc-timegrid-axis-cushion,
.fc .fc-timegrid-slot-label-cushion {
    color: var(--gray-5);
    font-size: 1.2rem;
}
.fc .fc-timegrid-slot {
    border-color: #e5eaed;
}
.fc .fc-timegrid-slot-minor {
    border: 0;
}
.fc-timeGridWeek-view .fc-daygrid-bg-harness .fc-non-business,
.fc-timeGridDay-view .fc-daygrid-bg-harness .fc-non-business {
    display: none;
}
.fc-timeGridWeek-view .fc-daygrid-bg-harness {
    top: 2.4rem;
}
.fc-dayGridWeek-view .fc-daygrid-body-unbalanced .fc-daygrid-day-events {
    min-height: 80px;
}
.calendar-area .holiday-frame .fc-daygrid-bg-harness,
.calendar-area .holiday {
    width: 100%;
    position: unset;
}
.calendar-area .holiday .fc-event-title {
    width: calc(100% - 2.6rem);
}

/* calendar - indicator ************/
.fc .fc-timegrid-now-indicator-arrow {
    border-left-color: var(--main-orange)
}
.fc .fc-timegrid-now-indicator-line {
    border-color: var(--main-orange);
}

/* calendar - date ************/
.fc .fc-daygrid-body,
.fc .fc-scrollgrid table {
    width: 100% !important;
}
.fc .fc-daygrid-day-top {
    flex-direction: row;
    justify-content: center;
}
.fc-dayGridMonth-view .fc-daygrid-day-top {
    padding-top: 1px;
}
.fc .fc-daygrid-day-number {
    text-decoration: none !important;
    border-radius: 50%;
    text-align: center;
}
.fc-dayGridMonth-view .fc-daygrid-day-number {
    height: 1.9rem;
    line-height: calc(1.9rem - 8px);
}
.fc-view:not(.fc-dayGridMonth-view) .fc-daygrid-day-number {
    width: 2.3rem;
    height: 2.3rem;
    line-height: calc(2.3rem - 8px);
    font-size: 1.4rem;
}
.fc .fc-daygrid-day-number:focus-visible {
    outline: none;
}

/* calendar - events ************/
.fc .fc-timeGridDay-view .fc-daygrid-day.fc-day-today,
.fc .fc-timeGridWeek-view .fc-daygrid-day.fc-day-today,
.fc .fc-timeGridDay-view .fc-timegrid-col.fc-day-today {
    background-color: transparent !important;
}
.fc .fc-timegrid-col-bg .fc-bg-event.fc-event-today {
    background-color: transparent!important;
}
.fc .fc-daygrid-day-events,
.fc .fc-daygrid-event {
    margin-top: 0;
}
.fc-daygrid-event-harness {
    padding-top: 3px;
}
.fc-event-selected:after,
.fc-event:focus:after {
    background-color: transparent;
}
.fc-timeGridDay-view .fc-event-selected,
.fc-timeGridWeek-view .fc-event-selected,
.fc-timeGridDay-view .fc-event:focus,
.fc-timeGridWeek-view .fc-event:focus {
    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 5px;
}
.fc-timeGridWeek-view .fc-daygrid-bg-harness {
    top: 2.4rem;
}

/* 終日 */
.fc-h-event {
    background-color: var(--default-event-color);
    border: 0;
}
.fc-h-event.no-kind {
    background-color: #ffffff;
    outline: 1px solid var(--main-text-color);
    outline-offset: -1px;
}
.fc-h-event .fc-event-title-container {
    height: 2rem;
    padding: 0 .2rem;
}
.fc-daygrid-block-event .fc-event-title {
    line-height: 2rem;
    font-weight: 500;
    padding: 0 0 0 .1rem;
}
.fc-daygrid-block-event.no-kind .fc-event-title {
    color: var(--main-text-color);
}

/* 時間指定 */
.fc-v-event {
    border: 0;
    border-left: 3px solid var(--default-event-color);
    background-color: rgba(217, 222, 232, .8);
    padding-left: .2rem;
}
.fc-v-event.no-kind {
    outline: 1px solid var(--main-text-color);
    outline-offset: -1px;
    border-left: 3px solid var(--main-text-color);
    background-color: rgba(255, 255, 255, .8);
}
.fc-v-event .fc-event-time,
.fc-v-event .fc-event-title {
    color: var(--main-text-color);
}
.fc-daygrid-dot-event .fc-event-title {
    font-weight: 600;
}
.fc-daygrid-dot-event {
    position: relative;
    display: block;
    padding: 0 0 0 .65rem;
}
.fc-daygrid-event-dot {
    position: absolute;
    top: 0;
    left: .05rem;
    border: 0;
    border-radius: 0;
    width: .35rem;
    height: 100%;
    background-color: var(--default-event-color);
    margin: 0;
}
.no-kind .fc-daygrid-event-dot {
    background-color: var(--main-text-color);
}
.fc-direction-ltr .fc-daygrid-event .fc-event-time {
    margin-right: 0;
}
.fc-daygrid-dot-event .fc-event-time {
    white-space: break-spaces;
    font-size: 1.15rem;
    margin-bottom: .2rem;
}
.fc-timegrid-event-short .fc-event-time::after {
    content: none;
}
.fc-timegrid-event-short .fc-event-time {
    width: 6.4rem;
}
.fc-daygrid-dot-event .fc-event-title,
.fc-timegrid-event-short .fc-event-time,
.fc-timegrid-event-short .fc-event-title {
    line-height: 1.3em;
}
.fc-timegrid-event-short .fc-event-title-container {
    width: calc(100% - 6.4rem);
}
.fc-timegrid-event-short .fc-event-title {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.fc-timegrid-event .fc-event-main-frame {
    padding: 1px 0;
}
.fc-daygrid-block-event .fc-event-time {
    font-weight: normal;
    line-height: 1.3;
}
.someone .fc-event-title {
    padding-left: 1.3rem !important;
    position: relative;
}
.someone.fc-daygrid-dot-event .fc-event-title,
.someone.fc-v-event .fc-event-title {
    line-height: 1.3;
}
.someone .fc-event-title:before {
    content: "";
    display: block;
    position: absolute;
    top: 40%;
    transform: translateY(-40%);
    -webkit-transform: translateY(-40%);
    -ms-transform: translateY(-40%);
    left: 0;
    width: 1.2rem;
    height: 1.2rem;
    mask-image: url(../img/ic_star.svg);
    -webkit-mask-image: url(../img/ic_star.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 88%;
    -webkit-mask-size: 88%;
    mask-position: center;
    -webkit-mask-position: center;
}
.someone.no-kind .fc-event-title:before,
.someone:not(.fc-h-event) .fc-event-title:before {
    background-color: var(--main-text-color);
}
.someone:not(.no-kind).fc-h-event .fc-event-title:before,
.someone.private.fc-h-event .fc-event-title:before {
    background-color: #ffffff;
}
.someone.private:not(.fc-h-event) .fc-event-title:before {
    background-color: var(--gray-6);
}
.someone.fc-timegrid-event .fc-event-title:before {
    top: .1rem;
    transform: none;
    -webkit-transform: none;
    -ms-transform: none;
}

/* calendar - list */
.fc-list-event-graphic,
.fc-list-event-title {
    vertical-align: middle !important;
}
.fc .fc-list-event-dot {
    display: block;
    border: 0;
    border-radius: 0;
    width: .35rem;
    height: 1.8rem;
}

/* colors - schedule title */
.form.schedule-ttl.red {
    border-color: var(--red) !important;
}
.form.schedule-ttl.orange {
    border-color: var(--main-orange) !important;
}
.form.schedule-ttl.yellow {
    border-color: var(--yellow-1) !important;
}
.form.schedule-ttl.lightgreen {
    border-color: var(--lightgreen) !important;
}
.form.schedule-ttl.green {
    border-color: var(--green) !important;
}
.form.schedule-ttl.lightblue {
    border-color: var(--lightblue) !important;
}
.form.schedule-ttl.blue {
    border-color: var(--blue) !important;
}
.form.schedule-ttl.purple {
    border-color: var(--purple) !important;
}
.form.schedule-ttl.pink {
    border-color: var(--pink) !important;
}

/* colors - event */
.no-kind .fc-list-event-dot {
    background-color: var(--main-text-color);
}
.red .fc-daygrid-event-dot,
.red.fc-h-event,
.red .fc-list-event-dot {
    background-color: var(--red);
    border-color: var(--red);
}
.red.fc-v-event {
    background-color: rgba(251, 222, 221, .8);
    border-color: var(--red);
}
.orange .fc-daygrid-event-dot,
.orange.fc-h-event,
.orange .fc-list-event-dot {
    background-color: var(--main-orange);
}
.orange.fc-v-event {
    background-color: rgba(254, 225, 191, .8);
    border-color: var(--main-orange);
}
.yellow .fc-daygrid-event-dot,
.yellow.fc-h-event,
.yellow .fc-list-event-dot {
    background-color: var(--yellow-1);
}
.yellow.fc-v-event {
    background-color: rgba(253, 243, 215, .8);
    border-color: var(--yellow-1);
}
.lightgreen .fc-daygrid-event-dot,
.lightgreen.fc-h-event,
.lightgreen .fc-list-event-dot {
    background-color: var(--lightgreen);
}
.lightgreen.fc-v-event {
    background-color: rgba(218, 241, 229, .8);
    border-color: var(--lightgreen);
}
.green .fc-daygrid-event-dot,
.green.fc-h-event,
.green .fc-list-event-dot {
    background-color: var(--green);
}
.green.fc-v-event {
    background-color: rgba(191, 221, 205, .8);
    border-color: var(--green);
}
.lightblue .fc-daygrid-event-dot,
.lightblue.fc-h-event,
.lightblue .fc-list-event-dot {
    background-color: var(--lightblue);
}
.lightblue.fc-v-event {
    background-color: rgba(220, 237, 246, .8);
    border-color: var(--lightblue);
}
.blue .fc-daygrid-event-dot,
.blue.fc-h-event,
.blue .fc-list-event-dot {
    background-color: var(--blue);
}
.blue.fc-v-event {
    background-color: rgba(220, 237, 246, .8);
    border-color: var(--blue);
}
.purple .fc-daygrid-event-dot,
.purple.fc-h-event,
.purple .fc-list-event-dot {
    background-color: var(--purple);
}
.purple.fc-v-event {
    background-color: rgba(239, 226, 245, .8);
    border-color: var(--purple);
}
.pink .fc-daygrid-event-dot,
.pink.fc-h-event,
.pink .fc-list-event-dot {
    background-color: var(--pink);
}
.pink.fc-v-event {
    background-color: rgba(255, 232, 240, .8);
    border-color: var(--pink);
}
.gray .fc-daygrid-event-dot,
.gray.fc-h-event,
.gray .fc-list-event-dot {
    background-color: var(--gray-5);
}
.gray.fc-v-event {
    background-color: rgba(234, 235, 235, .8);
    border-color: var(--gray-5);
}
.private .fc-daygrid-event-dot,
.private.fc-h-event:before,
.private.fc-v-event:before {
    content: "";
    display: block;
    width: 1.3rem;
    height: 1.3rem;
    mask-image: url(../img/ic_private.svg);
    -webkit-mask-image: url(../img/ic_private.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: .85rem;
    -webkit-mask-size: .85rem;
    mask-position: left center;
    -webkit-mask-position: left center;
}
.private .fc-list-event-dot {
    width: 1.4rem;
    height: 1.4rem;
    background-color: transparent;
    background-image: url(../img/ic_private.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    vertical-align: middle;
}
.private.fc-daygrid-dot-event,
.private.fc-h-event,
.private.fc-v-event {
    padding-left: 1.2rem;
}
.private.fc-h-event,
.private.fc-v-event {
    outline: 0;
}
.private.fc-daygrid-dot-event {
    border: 0;
    position: relative;
    color: var(--gray-6);
}
.private.fc-h-event {
    background-color: var(--gray-5);
}
.private.fc-h-event:before,
.private.fc-v-event:before {
    position: absolute;
}
.private.fc-h-event:before {
    top: 48%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: .3rem;
    background-color: #ffffff;
}
.private.fc-h-event .fc-event-title {
    color: #ffffff;
}
.private.fc-v-event:before {
    left: .1rem;
}
.private .fc-daygrid-event-dot,
.private.fc-v-event:before {
    background-color: var(--gray-5);
}
.private.fc-v-event {
    background-color: rgba(232, 233, 234, .8);
    border-color: var(--gray-5);
}
.private.fc-v-event .fc-event-main-frame div {
    color: var(--gray-6);
}
.pointer-non:focus {
    box-shadow: none !important;
}
.fc-h-event.pointer-non:hover {
    filter: brightness(1);
}
.fc-daygrid-dot-event.pointer-non:hover {
    background-color: transparent !important;
}

/* achv */
.fc-event[class*="achv"] {
    position: relative;
}
.fc-event[class*="achv"]:not(.fc-list-event):after,
.fc-event[class*="achv"] .fc-list-event-title a:after {
    content: "" !important;
    display: block;
    width: 1.8rem;
    height: 1.8rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    z-index: 5;
}
.fc-event.achv:after,
.fc-event.achv .fc-list-event-title a:after {
    background-image: url(../img/ic_achv.svg);
}
.fc-event.past-achv:after,
.fc-event.past-achv .fc-list-event-title a:after {
    background-size: 1.6rem;
    background-image: url(../img/ic_past_achv.svg);
}
.fc-h-event[class*="achv"]:after,
.fc-timegrid-event-short[class*="achv"]:after,
.fc-event[class*="achv"] .fc-list-event-title a:after{
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.mobile .fc-event:not(.fc-v-event):not(.fc-list-event)[class*="achv"]:after {
    left: calc(100% - 1.8rem);
}
body:not(.mobile) .fc-event[class*="achv"]:not(.fc-list-event):after {
    left: calc(100% - 1.9rem);
}
.fc-list-event[class*="achv"]:after {
    left: calc(100% - 28px);
}
.fc-daygrid-dot-event[class*="achv"]:after,
.fc-v-event:not(.fc-timegrid-event-short)[class*="achv"]:after {
    top: calc(100% - 1.8rem);
    left: calc(100% - 2rem);
}
.fc-timegrid-event-short[class*="achv"]:after {
    top: calc(100% - 2rem);
    left: calc(100% - 2rem);
}
.fc-event[class*="achv"] .fc-list-event-title a:after {
    left: calc(100% - 1.6rem);
}
.fc-event[class*="achv"] .fc-list-event-title a {
    display: block;
    width: 100%;
    position: relative;
    padding-right: 2.6rem;
}

/* TODO */
.fc-event.done {
    opacity: .4;
    filter: contrast(.9);
}
.fc-v-event.done {
    opacity: .6;
    filter: contrast(.9);
}
.fc-event.done .fc-event-title {
    text-decoration: line-through;
}

/* calendar - week/day ************/
.calendar-area.week {
    overflow-y: auto;
}
.calendar-area.week .fc-toolbar.fc-header-toolbar {
    padding-bottom: 10px;
}
.week-cal {
    display: flex;
    align-items: stretch;
}
.select-member-area + .week-cal {
    padding-top: 4.7rem;
}
.calendar-area.week .cal-ttl {
    border-top: 1px solid var(--gray-2);
    border-right: 2px solid var(--gray-2);
    padding: 5px;
}
.calendar-area.week .week-cal:last-child .cal-ttl {
    border-bottom: 1px solid var(--gray-2);
}
.calendar-area.week .week-cal:not(:last-child) .fc-theme-standard td[role="presentation"] {
    border-bottom: 0;
}
.calendar-area.week .cal-ttl > p:first-child {
    color: var(--main-blue);
}

/* date header */
.date-header {
    position: fixed;
    top: calc(11.6rem + 20px);
    left: 0;
    border-top: 1px solid var(--gray-2);
    border-bottom: 1px solid var(--gray-2);
    background-color: #ffffff;
    z-index: 200;
}
.date-header-top,
.date-header-bottom {
    display: flex;
    width: 100%;
}
.date-header p {
    text-align: center;
}
.calendar-area .date-header p {
    width: calc((100% - (100%/12)/7));
}
.date-header p:nth-last-child(2) {
    color: var(--saturday-color);
}
.date-header p:last-child {
    color: var(--sunday-color);
}
.date-header-top p,
.fc-timeGridDay-view .fc-col-header-cell-cushion {
    height: 2rem;
    line-height: 2.2rem;
    font-size: 1.2rem;
}
.date-header-bottom p {
    height: 2.6rem;
}
.date-header-bottom p span {
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    font-size: 1.5rem;
    line-height: 2.4rem;
    margin: 0 auto;
}
.date-header-bottom p.current span {
    color: #ffffff;
    background-color: var(--main-blue);
}
.date-header-bottom p.today span,
.fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
    color: var(--main-orange);
}
.date-header-bottom p.today.current span {
    color: #ffffff;
    background-color: var(--main-orange);
}

/* toolbar */
.calendar-area.week .fc-dayGridWeek-view.fc-view.fc-daygrid,
.calendar-area.week table.fc-scrollgrid,
.calendar-area.week .fc .fc-scroller-harness,
.calendar-area.week .fc .fc-scroller,
.calendar-area.week .fc .fc-daygrid-body,
.calendar-area.week .fc .fc-scrollgrid-section-body table {
    height: 100%;
}

/* calendar body */
.calendar-area.week .fc-daygrid-day-top,
.mobile .calendar-area.day .fc-daygrid-day-top {
    display: none;
}

/* new event */
.fc-timegrid-event.new {
    border: 1px solid var(--default-event-color);
    border-radius: 0;
    box-shadow: none;
    background-color: #f6f6f6;
    padding: 0;
    margin-left: -2px;
}
body:not(.mobile) .fc-timegrid-event.new {
    width: calc(102.5% + 3px);
}
.mobile .fc-timegrid-event.new {
    width: calc(102.5% + 2px);
}
.fc-timegrid-event.new .fc-event-main {
    display: flex;
    align-items: center;
    justify-content: center;
}
.fc-timegrid-event.new .fc-event-main-frame {
    align-items: center;
    width: 90%;
    height: 90%;
    border-radius: 4px;
}
.fc-timegrid-event.new .fc-event-title-container {
    display: flex;
}
.fc-timegrid-event.new .fc-event-title {
    position: unset;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0 5px;
}
.fc-timegrid-event.new .fc-event-title,
.fc-timegrid-event.new .fc-event-time {
    color: var(--default-event-color);
    font-weight: 600;
    white-space: initial;
}
.fc-timegrid-event.new .fc-event-title:after {
    content: "";
    width: 2rem;
    height: 2rem;
    display: block;
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: contain;
    -webkit-mask-size: contain;
    background-color: var(--default-event-color);
    flex-grow: 1;
}

/* add schedule button */
td .btn-add-event-day {
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    border: 0;
    border-radius: 3px;
    background-color: transparent;
    background-image: url(../img/ic_add_event.svg);
    background-repeat: no-repeat;
    background-size: 1.5rem;
    background-position: center;
    padding: 0;
    margin: 0 0 0 auto;
    z-index: 5;
}

/* time grid */
td.fc-timegrid-slot.fc-timegrid-slot-label,
td.fc-timegrid-slot.fc-timegrid-slot-lane.fc-timegrid-slot-minor,
td.fc-timegrid-slot.fc-timegrid-slot-lane {
    font-size: 0.31em;
}


/* side menu
--------------------------------------- */
.side-menu-area {
    position: fixed;
    right: 30px;
    bottom: 26px;
    z-index: 100;
}
.side-menu-area ul {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    padding: .8rem 0;
}
.side-menu-area li {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.side-menu-area li span:first-child {
    display: block;
    width: 4.2rem;
    height: 4.2rem;
    border-radius: 2.1rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    box-shadow: 0 2px 4px rgba(130, 130, 130, .6);
}
.side-menu-area .li-todo span:first-child {
    background-image: url(../img/side_btn_todo.svg);
}
.side-menu-area .li-notif span:first-child {
    background-image: url(../img/ic_notif.svg);
}
.side-menu-area li .caption {
    display: none;
}
.side-menu-area .li-notif .notif-num {
    position: absolute;
    top: -.6rem;
    right: -.6rem;
    display: block;
    background-color: var(--red);
    text-align: center;
    color: #ffffff;
    outline: 1px solid #ffffff;
    outline-offset: 0;
    padding: 0 .2rem;
}

/* content */
.side-content {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    font-size: 1.4rem;
    z-index: 251;
}
.side-content .side-ttl {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    align-items: center;
    height: 4.2rem;
    padding: 6px 8px 6px 6px;
}
.side-content .side-ttl p {
    font-size: 1.6rem;
    font-weight: 600;
}
.side-content button {
    border: 0;
    background-color: transparent;
    background-repeat: no-repeat;
}
.side-ttl button,
.side-card-header button {
    width: 3rem;
    height: 3rem;
    border-radius: 1.5rem;
    background-size: 1.6rem;
}
.side-main-content {
    padding: 0 16px;
}


/* side
--------------------------------------- */
.side-main-content {
    position: relative;
}

/* no-todo, no-card */
#no-todo,
#no-card,
#no-notif {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    color: var(--gray-5);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 12rem;
    padding-top: 14rem;
}
#no-todo {
    background-image: url(../img/no_todo.png);
}
#no-card {
    background-image: url(../img/no_card.png);
}
#no-notif {
    background-image: url(../img/no_notif.png);
}

/* side - todo ********************/
.side-todo .side-main-content {
    padding-bottom: 4.2rem;
    overflow-y: auto;
    height: calc(100% - 4.2rem);
}
.side-ttl .main-ttl {
    display: flex;
    align-items: center;
    gap: 4px;
}
.side-todo .side-ttl .main-ttl {
    width: calc(100% - 3rem);
}
.side-todo .side-ttl p {
    color: var(--main-orange);
}
.side-content button.btn-back {
    background-image: url(../img/ic_back.svg);
    background-size: 1rem;
    background-position: center;
    background-size: 1.1rem;
}
.side-content .sort-area {
    margin-left: 12px;
}
.side-content .btn-sort {
    background-image: url(../img/ic_sort.svg);
    background-size: 1.6rem;
    background-position: center;
}
.side-content .sort-select {
    border-radius: 4px;
    z-index: 10;
}
.side-content .sort-select ul {
    display: flex;
    align-items: center;
}
.side-content .sort-select li {
    white-space: nowrap;
    font-size: 1.3rem;
    text-align: center;
    color: var(--gray-5);
    border: 1px solid var(--gray-2);
    background-color: #ffffff;
}
.side-content .sort-select li:first-child {
    border-radius: 4px 0 0 4px;
}
.side-content .sort-select li:last-child {
    border-left: 0;
    border-radius: 0 4px 4px 0;
}
.side-content .sort-select li.selected {
    color: var(--main-orange);
    background-color: var(--pale-orange) !important;
}
.side-content .btn-sort:active {
    background-color: var(--form-bg-color);
}
.side-content button.btn-add-todo {
    background-image: url(../img/ic_add_todo.svg);
    background-size: 2.4rem;
    background-position: center .8rem;
}

/* todo content */
.todo-list li {
    display: flex;
    align-items: flex-start;
    border-bottom: 1px solid #eaeaea;
    padding: 8px 0;
    position: relative;
}
.todo-list li.ttl-gray {
    opacity: .6;
}
.todo-list li .li-content {
    display: grid;
    grid-template-columns: 1fr;
    gap: .3rem 0;
    margin-left: .6rem;
}
.todo-list li input[type="checkbox"] {
    display: none;
}
.todo-list li label {
    display: block;
    width: 18px;
    height: 18px;
    border: 1px solid var(--gray-1);
    border-radius: 3px;
    margin: 1.5px 0;
    position: relative;
}
.todo-list li input[type="checkbox"]:checked + label:before {
    content: "";
    display: block;
    width: 8px;
    height: 4px;
    border-left: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    position: absolute;
    top: 4px;
    left: 20%;
}
.todo-list li input[type="checkbox"]:checked + label {
    border-color: var(--main-orange);
    background-color: var(--main-orange);
}
.todo-list li label.red {
    border-color: var(--red);
    background-color: var(--pale-red-1);
}
.todo-list li label.yellow {
    border-color: var(--yellow-1);
    background-color: var(--pale-yellow-1);
}
.todo-list li label.green {
    border-color: var(--lightgreen);
    background-color: var(--pale-green);
}
.todo-list .li-content {
    width: calc(100% - 22px);
}
.todo-list li p {
    line-height: 1.4;
}
.todo-list li p:not(.time) {
    width: calc(100% - 2.8rem);
}
.todo-list .memo,
.todo-list .sub-info {
    font-size: 1.25rem;
    color: var(--gray-5);
    grid-column: 1/3;
}
.todo-list .time,
.todo-list .place {
    display: flex;
    align-items: flex-start;
    width: calc(100% - 2rem);
}
.todo-list .time:before,
.todo-list .place:before,
.todo-list li.private .li-content:before,
.todo-list li.someone .li-ttl:before {
    content: "";
    display: block;
    width: 2rem;
    height: 1.4rem;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
}
.todo-list .time:before,
.todo-list .place:before {
    height: 1.8rem;
    background-color: var(--main-orange);
}
.todo-list .time:before {
    mask-image: url(../img/ic_time.svg);
    -webkit-mask-image: url(../img/ic_time.svg);
    mask-size: 1.1rem;
    -webkit-mask-size: 1.1rem;
}
.todo-list .time.over:before {
    background-color: var(--red);
}
.todo-list .time.alarm:before {
    mask-image: url(../img/ic_alarm.svg);
    -webkit-mask-image: url(../img/ic_alarm.svg);
    mask-size: 1.2rem;
    -webkit-mask-size: 1.2rem;
}
.todo-list .place:before {
    mask-image: url(../img/ic_place.svg);
    -webkit-mask-image: url(../img/ic_place.svg);
    mask-size: .65rem;
    -webkit-mask-size: .65rem;
}
.todo-list .time.over {
    color: var(--red);
}
.todo-list .btn-list-detail {
    display: none;
    width: 2.2rem !important;
    height: 2.2rem !important;
    background-image: url(../img/ic_list_detail.svg);
    background-size: 18px;
    background-position: center;
    position: absolute;
    top: 8px;
    right: 0;
}
.todo-list .btn-list-detail.visible {
    display: block;
}
.todo-list li.private .li-content {
    grid-template-columns: 2rem 1fr;
}
.todo-list li.private .li-content:before {
    mask-size: 1.1rem;
    -webkit-mask-size: 1.1rem;
    background-color: var(--gray-5);
    mask-image: url(../img/ic_private.svg);
    -webkit-mask-image: url(../img/ic_private.svg);
    grid-column: 1/2;
    margin-top: .2rem;
}
.todo-list li.member .li-ttl:after {
    content: "";
    display: inline-block;
    width: 1.8rem;
    height: 1.4rem;
    background-color: var(--gray-5);
    mask-image: url(../img/ic_member2.svg);
    mask-size: 1.2rem;
    mask-position: center;
    mask-repeat: no-repeat;
    vertical-align: middle;
    margin-top: -.3rem;
}
.todo-list li.someone .li-ttl:before {
    display: inline-block;
    width: 1.6rem;
    vertical-align: top;
    background-color: var(--main-text-color);
    mask-image: url(../img/ic_star.svg);
    -webkit-mask-image: url(../img/ic_star.svg);
    mask-size: 1.2rem;
    margin-top: .2rem;
}

/* 実行済表示ボタン */
.show-completed-btn-area {
    position: fixed;
    right: 0;
    bottom: 0;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    width: 100%;
    height: 42px;
    padding: 0 16px;
}
.btn-show-completed {
    width: auto !important;
    height: auto !important;
    color: var(--gray-6);
    font-size: 1.4rem;
    padding: 4px 4px 4px 22px;
    background-image: url(../img/ic_eyeOpen.svg);
    background-repeat: no-repeat;
    background-size: 18px;
    background-position: left center;
}
.btn-show-completed.show {
    background-image: url(../img/ic_eyeClosed.svg);
}

/* side - todo modal ********************/
.modal.todo {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 500;
}
.modal.todo .modal-content {
    width: 96%;
    max-width: 50rem;
    height: auto;
}

/* modal header */
.modal.todo .modal-header {
    position: relative;
}
.modal.todo .modal-header button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
.modal.todo .modal-header .btn-modal-close {
    left: 8px;
}
.modal.todo .modal-header .btn.orange {
    right: 8px;
}

/* modal inner */
.modal.todo .modal-inner {
    height: auto;
    padding: 12px;
}
.modal.todo textarea.memo {
    min-height: 3.6rem;
}
.modal.todo .modal-inner > ul > li {
    margin-bottom: .8rem;
}
.modal.todo .modal-inner ul .li-memo,
.modal.todo .modal-inner ul .li-date-time,
.modal.todo .modal-inner ul .li-importance {
    border-bottom: 1px dashed var(--gray-2);
    padding-bottom: 1.6rem;
    margin-bottom: 1.6rem;
}
.modal.todo .modal-inner ul li p {
    color: var(--gray-6);
}
.modal.todo .li-date-time label {
    font-size: 1.4rem;
}
.form .li-importance {
    display: flex;
    align-items: center;
    font-size: 1.4rem;
}
.form .li-importance .check-btn-area {
    justify-content: space-between;
}
.form .li-importance .check-btn-area label {
    width: calc((100% - 16px)/3);
    color: var(--main-blue);
    margin: 0;
}
.form .li-importance .check-btn-area label span {
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid var(--gray-4);
}
.form .li-importance .check-btn-area input[type="checkbox"]:checked + span {
    color: #ffffff;
}
.form .li-importance .check-btn-area input[type="checkbox"].level1:checked + span {
    background-color: var(--red);
    border-color: var(--red);
}
.form .li-importance .check-btn-area input[type="checkbox"].level2:checked + span {
    background-color: var(--yellow-1);
    border-color: var(--yellow-1);
}
.form .li-importance .check-btn-area input[type="checkbox"].level3:checked + span {
    background-color: var(--lightgreen);
    border-color: var(--lightgreen);
}

/* 詳細編集ボタン */
.btn-detail-edit {
    display: flex;
    justify-content: center;
    margin: 1.2rem auto .6rem;
}
.btn-detail-edit a {
    color: var(--main-blue);
    font-size: 1.4rem;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.btn-detail-edit a:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: .6rem solid transparent;
    border-left: .8rem solid var(--main-blue);
    border-bottom: .6rem solid transparent;
}

/* side - 新規取得物件 ********************/
.side-card .side-main-content {
    height: calc(100% - 4.2rem);
    padding: 0;
}
.side-card .side-ttl {
    color: var(--main-blue);
    border-bottom: 1px solid var(--gray-2);
}
.side-card .main-ttl {
    width: 100%;
    justify-content: space-between;
}
.side-card .ic-btn.edit {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);    
}
.side-card .ic-btn.add-card {
    width: 3rem;
    height: 3rem;
    border-radius: 1.5rem;
}
.side-card .ic-btn.add-card .ic {
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    background-color: var(--main-blue);
}
.side-card-header {
    height: 3.6rem;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--gray-2);
}
.side-card-header .func {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-right: 1px solid var(--gray-2);
    width: calc(100% - 80px);
    height: 100%;
    padding: 0 10px 0 4px;
}
.side-card-header .func .month {
    display: flex;
    align-items: center;
    gap: 8px;
}
.side-card-header .func .month p {
    font-weight: 600;
    white-space: nowrap;
}
.side-card-header .number {
    width: 80px;
    text-align: center;
    padding: 8px 4px;
    color: var(--gray-6);
    font-size: 1.4rem;
}

.side-card-header button.btn-prev,
.side-card-header button.btn-next {
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 1.5rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1rem;
}
.side-card-header .btn-prev {
    background-image: url(../img/ic_back.svg);
}
.side-card-header .btn-next {
    background-image: url(../img/ic_next.svg);
}
.side-card-header .btn-this-month {
    width: auto !important;
    height: 2.6rem !important;
    min-height: 18px;
    font-size: 1.4rem;
    white-space: nowrap;
    border: 1px solid var(--main-blue) !important;
    border-radius: 3px !important;
    color: var(--main-blue);
}

.side-card-inner {
    height: calc(100% - 3.6rem);
    overflow-y: auto;
    background-color: var(--form-bg-color);
}
.side-card-inner ul:not(.card-content-list),
.side-notif-inner ul {
    padding: 10px;
}
.side-card-inner ul:not(.card-content-list) > li,
.side-notif-inner ul > li {
    border: 1px solid var(--gray-4);
    border-radius: 4px;
    background-color: #ffffff;
    margin-bottom: 10px;
}
.side-card-inner .card-header {
    position: relative;
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid var(--gray-4);
}
.side-card-inner .card-header p:first-child {
    width: 50px;
    text-align: center;
    font-weight: 600;
    color: var(--gray-6);
    border-right: 1px solid var(--gray-4);
    padding: 6px;
}
.side-card-inner .card-header p:last-of-type {
    width: calc(100% - 50px);
    font-weight: 600;
    font-size: 1.4rem;
    padding: 6px 3rem 6px 8px;
}
.side-card-inner .card-content {
    padding: 10px;
}
.card-content-list li {
    display: flex;
    align-items: flex-start;
    margin-top: 8px;
}
.card-content-list li:first-child {
    margin-top: 0;
}
.card-content-list .li-ttl {
    width: 5.6rem;
    font-size: 1.3rem;
    white-space: nowrap;
}
.card-content-list .li-ttl,
.card-content-list .li-content > p:first-child {
    line-height: 2rem;
}
.card-content-list .li-content > p:first-child {
    font-size: 1.4rem;
}
.card-content-list .li-content {
    width: calc(100% - 5.6rem);
}
.card-content-list .label-area {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 3px 2px;
    margin-top: 4px;
}
.card-content-list .label-area p {
    min-width: 3.6rem;
    height: 2.2rem;
    color: var(--main-blue);
    border: 1px solid var(--main-blue);
    padding: 0 4px;
    font-size: 1.2rem;
    text-align: center;
    line-height: 2.1rem;
    white-space: nowrap;
}

/* カード取得なし */
.side-card-inner .no-card .card-header {
    border-bottom: 0;
}
.side-card-inner .no-card .card-header > p:last-of-type {
    font-weight: normal;
}

/* 除外 */
.side-card-inner .exclude {
    background-color: rgba(220, 220, 220, .3) !important;
}
.side-card-inner .exclude .admin-p {
    filter: brightness(.95);
}

/* 管理者変更 */
.side-card-inner .admin-p {
    font-size: 1.25rem;
    text-align: center;
    color: var(--gray-6);
    background-color: var(--form-bg-color);
    border-radius: 2px;
    padding: 2px 4px;
    margin: 4px;
    position: relative;
}
.side-card-inner .no-card .admin-p:before {
    content: "";
    width: calc(100% + 8px);
    height: 1px;
    background-color: var(--gray-4);
    position: absolute;
    top: -5px;
    left: -4px;
}

/* button area */
.side-card .btn-area {
    justify-content: flex-end;
    padding: 10px;
}

/* card modal */
.modal.card .modal-content {
    width: 50rem;
    max-height: 42.4rem;
}
.modal.card .modal-inner {
    height: calc(100% - 8.8rem);
    padding: 10px 16px;
}
.modal.card .modal-inner ul li,
.modal.card .modal-inner ul .li-content {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 8px;
    margin-top: 8px;
    border-top: 1px solid var(--gray-3);
}
.modal.card .modal-inner ul li:first-child,
.modal.card .modal-inner ul .li-content:first-child {
    border-top: 0;
    padding-top: 0;
    margin-top: 0;
}
.modal.card .modal-inner ul li.date-and-card label:first-of-type {
    margin-right: 8px;
}
.modal.card .modal-inner ul li.hakkutsugen .check-area {
    gap: 6px 12px;
    margin-left: 9rem;
}
.modal.card .modal-inner ul li.hakkutsugen + .hakkutsugen {
    border-top: 0;
    padding-top: 0;
}
.modal.card .modal-inner ul .li-content > div {
    display: flex;
    gap: 4px;
    align-items: center;
}
.modal.card .modal-inner ul .li-content > div > input[type="text"] {
    width: 4rem;
}
.modal.card .modal-inner ul li > p,
.modal.card .modal-inner ul .li-content > p {
    width: 9rem;
}
.modal.card .modal-inner ul .li-content label {
    display: flex;
    align-items: center;
    height: 3.2rem;
    line-height: 3.2rem;
}
.modal.card .modal-inner ul .li-content label input[type="radio"] {
    margin-top: 0;
}
.modal.card .modal-inner ul li > p + * {
    width: calc(100% - 9rem);
}
.modal.card .modal-inner ul li.tochi .select-area {
    display: flex;
    gap: 8px;
    align-items: center;
}
.modal.card .modal-inner ul li.tochi .select-area .select-box:first-child {
    width: 10rem;
}
.modal.card .modal-inner ul li.tochi .select-area .select-box:last-child {
    width: calc((100% - 10rem) - 8px);
}
.modal.card .modal-inner .check-btn-area {
    width: calc(100% - 8rem);
    margin-left: 8rem;
}
.modal.card .modal-inner .check-btn-area label {
    gap: 2px;
    align-items: center;
    color: var(--main-text-color);
}
.modal.card .modal-inner .check-btn-area input[type="checkbox"] {
    display: block;
}

/* side - 通知 *************************/
.side-notif .side-ttl {
    border-bottom: 1px solid var(--gray-2);
}
.side-notif .side-ttl p:first-child {
    color: #555555;
}
.side-notif .side-ttl .number {
    font-size: 1.4rem;
    color: var(--gray-6);
    font-weight: normal;
}
.side-notif-inner {
    height: calc(100% - 4.2rem);
    background-color: var(--form-bg-color);
    overflow-y: auto;
}
.side-notif-inner > ul > li {
    padding: 8px 10px;
}
.notif-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
.notif-header p:first-child {
    font-weight: 600;
    font-size: 1.4rem;
}
.notif-header .date {
    font-size: 1.3rem;
    color: var(--gray-6);
}
.notif-content .btn.blue {
    width: 100%;
    font-size: 1.3rem;
    margin-top: 10px;
}
.mobile .notif-content .btn.blue {
    display: none;
}


/* form
--------------------------------------- */
.form {
    font-size: 1.3rem;
}
.form > li {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 14px;
}
.form .content-ttl {
    font-size: 1.4rem;
    color: var(--gray-6);
    width: 6rem;
    line-height: calc(3rem + 2px);
    white-space: nowrap;
}
.form .form-content {
    width: calc(100% - 6rem);
    font-size: 1.4rem;
}
.form input[type="text"],
.form input[type="date"],
.form input[type="month"],
.form input[type="time"],
.form .select-box {
    height: 3.6rem;
}
.form .select-box select {
    line-height: calc(3.6rem - 10px);
}

/* schedule - 予定名 */
.form.schedule-ttl {
    display: flex;
    border-bottom: 1px solid var(--gray-1);
}
@media screen and (max-width: 999px) {
    .form.schedule-ttl {
        margin-bottom: 20px;
    }
}
@media screen and (min-width: 1000px) {
    .form.schedule-ttl {
        margin-bottom: 10px;
    }
}
.form.schedule-ttl input[type="text"] {
    height: 100%!important;
    border: 0;
    font-size: 1.8rem;
    background-color: transparent !important;
    padding: 0;
}
.form.schedule-ttl input[type="text"]:focus {
    outline: 0;
}

/* li-top */
.form .li-top {
    border: 1px solid var(--gray-4);
    height: 4.2rem;
    text-align: center;
    margin-bottom: 16px;
}

/* facility - 施設名 */
.facility-name .form-content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 0;
}
.detail .form .facility-name {
    border-bottom: 2px solid var(--main-blue);
    padding-bottom: 4px;
}
.detail .form .facility-name .content-ttl {
    line-height: 3rem;
}
.form .facility-name .form-content p {
    line-height: 3rem;
}
.form .facility-name .form-content p:first-child {
    font-size: 1.4rem;
    white-space: nowrap;
}
.detail .form .facility-name .form-content p:last-child {
    font-size: 1.8rem;
}


/* form(add/edit)
--------------------------------------- */
/* add/edit - schedule - 日時 */
.add-edit .form > li:first-child {
    flex-wrap: wrap;
    justify-content: flex-start;
}
.form-date .select-area {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.form-date input[type="time"],
.form-date select,
.form-repeat input[type="date"] {
    width: auto;
}
.form-date .ampm-btn-area {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0 8px;
    line-height: 3rem;
}
.form-date .ampm-btn-area .btn {
    height: 2.4rem;
    outline-width: 2.4rem;
    font-size: 1.3rem;
    border: 0;
    background-color: var(--form-bg-color);
    color: var(--blue);
    border: 1px solid var(--gray-4);
    padding: 0 8px;
}
body:not(.mobile) .form-date > ul li,
body:not(.mobile) .form-repeat > li {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.form-date > ul li > div {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.form-date .select-time .select-box {
    background-size: 10px;
}
.form-date .select-time {
    display: flex;
    align-items: center;
}
.form-date .select-time span {
    margin: 0 4px;
}
.form-repeat .select-box {
    width: 100%;
}
.add-edit li.end-date {
    width: 100%;
    flex-wrap: wrap;
}
.add-edit li.end-date > div {
    position: relative;
}
.add-edit li.end-date > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 3.6rem;
}
.add-edit li.end-date > div > p {
    width: 4.2rem;
}
.add-edit li.end-date > div:last-child {
    margin-left: auto;
}

/* add/edit - schedule - 分類 */
.add-edit .form-bunrui {
    background-color: var(--form-bg-color);
    border-radius: 6px;
    padding: 8px;
    margin-top: 8px;
}
.add-edit .form-bunrui .content-ttl {
    line-height: initial;
    font-size: 1.4rem;
    color: #000000;
    margin-bottom: 4px;
}
.add-edit .form-bunrui .appoint .content-ttl {
    margin-bottom: 0;
}
.add-edit .form-bunrui .input-area > * {
    padding: 12px 4px;
}
.add-edit .form-bunrui .input-area > *:last-child {
    padding-bottom: 0;
}
.add-edit .form-bunrui .input-area .appoint {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.add-edit .form-bunrui .input-area .appoint .radio-btn-area {
    flex-wrap: nowrap;
}
.add-edit .form-bunrui .input-area  > *:not(:last-child) {
    border-bottom: 1px solid var(--gray-4);
}

/* li-top */
.form .li-top .select-box {
    width: 100%;
    height: 100%;
    border: 0;
}
.form .li-top .select-box:before {
    right: 10px;
}
.form .li-top select {
    text-align: center;
    color: var(--main-blue);
    font-weight: 600;
    padding-left: 32px;
}

/* add/edit - schedule - 通知 */
.form-notification {
    display: flex;
    flex-wrap: wrap;
}
.form-notification li,
.form-content.check-area {
    min-height: calc(3rem + 2px);
    display: flex;
    align-items: center;
}
.form-notification .notification-time {
    width: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

/* add/edit - schedule - 参加者 */
.form.participant {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 0;
}
.form-content.participant {
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
    width: calc(100% - 6rem);
    line-height: 3rem;
    margin-left: auto;
}
.form-content.participant .left,
.form-content.participant .right {
    display: flex;
    align-items: center;
}
.form-content.participant .left {
    gap: 8px;
}
.form-content.participant .number {
    margin-right: 10px;
    font-size: 1.4rem;
    white-space: nowrap;
}
.add-edit .participant > .member-list label {
    width: 3.6rem;
    height: 3.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.participant .member-list .m-busho {
    width: 100%;
}
.form-content.participant .btn.red-border {
    padding: 2px 6px;
}
.form.participant .ic-cap {
    display: flex;
    align-items: center;
    color: var(--gray-6);
    font-size: 1.2rem;
}
.form.participant .ic-nippou-img {
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-color: var(--main-blue);
    mask-image: url(../img/ic_nippou.svg);
    -webkit-mask-image: url(../img/ic_nippou.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 68%;
    -webkit-mask-size: 68%;
    mask-position: center;
    -webkit-mask-position: center;
}
.select-li .ic-btn.total-list {
    background-color: transparent;
}
.select-li .ic-btn.total-list .ic {
    mask-image: url(../img/ic_nippou.svg);
    -webkit-mask-image: url(../img/ic_nippou.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 68%;
    -webkit-mask-size: 68%;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: var(--gray-4);
}
.select-li .ic-btn.total-list.selected .ic {
    background-color: var(--main-blue);
}

/* add/edit - facility - 施設名 */
.add-edit .form .facility-name {
    padding-bottom: 0;
}
.add-edit .form .facility-name .form-content {
    gap: 4px 8px;
    margin-bottom: 4px;
}
.form .facility-name select,
.form .facility-name .select-box {
    width: 100%;
}

/* 追加ボタン */
.btn.add-participant {
    height: 3rem;
    color: var(--main-blue);
    font-weight: normal;
    font-weight: 600;
    background-image: url(../img/ic_plus.svg);
    background-repeat: no-repeat;
    background-position: left 8px center;
    background-size: 1.4rem;
    background-color: transparent;
    padding-left: 3rem !important;
}

/* add/edit - 必須項目 */
p.required:after,
li.required > p:after {
    content: "*";
    color: var(--red);
    font-size: 1.6rem;
    margin-left: 2px;
}


/* member list
--------------------------------------- */
.member-list {
    width: 100%;
    height: 100%;
    border-radius: 4px;
    border: 1px solid var(--gray-1);
    background-color: #ffffff;
    overflow-y: auto;
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    position: relative;
}
.form-content:not(.participant) .member-list {
    border: 1px solid var(--gray-2);
}
.member-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    border-bottom: 1px solid var(--gray-2);
    padding: 4px 8px;
}
.member-list li:last-child {
    border-bottom: 1px solid var(--gray-2);
}
.member-list li .m-info {
    width: calc(100% - 3.6rem);
}
.member-list li .m-name {
    font-weight: 600;
    font-size: 1.4rem;
}
.add-edit .member-list li .m-name,
.edit-member .member-list li .m-name {
    color: var(--main-blue);
}
.member-list li .m-busho {
    padding-right: 4px;
    padding-left: 4px;
}
.member-list li p:not(.m-busho) {
    display: inline;
    vertical-align: baseline;
    padding: 2px 4px;
}
.member-list li p:not(.m-name) {
    color: var(--gray-5);
}
.member-list li p span {
    display: block;
}


/* switch (予定登録, 共通休日管理)
--------------------------------------- */
.switch.todo label {
    width: 8rem;
}
.switch.todo input[type="radio"]:first-of-type:checked ~ label:first-of-type:before {
    background-color: var(--main-blue);
}
.switch.todo input[type="radio"]:nth-of-type(2):checked ~ label:nth-of-type(2):before {
    background-color: var(--main-orange);
}
.switch.todo input[type="radio"]:first-of-type:checked ~ label {
    border-color: var(--main-blue);
}
.switch.todo input[type="radio"]:last-of-type:checked ~ label {
    border-color: var(--main-orange);
}
.form-bunrui .switch input[type="radio"]:first-of-type:checked ~ label:first-of-type:before {
    background-color: var(--gray-5);
}
.form-bunrui .switch input[type="radio"]:last-of-type:checked ~ label:last-of-type:before {
    background-color: var(--lightgreen);
}
.form-bunrui .switch input[type="radio"]:last-of-type:checked ~ label:first-of-type p {
    color: var(--gray-5);
}
.form-bunrui .switch input[type="radio"]:first-of-type:checked ~ label {
    border-color: var(--gray-5);
}
.form-bunrui .switch input[type="radio"]:last-of-type:checked ~ label {
    border-color: var(--lightgreen);
}

.todo-label {
    display: block;
    width: 5.6rem;
    height: 2.8rem;
    text-align: center;
    color: var(--main-orange);
    line-height: 2.8rem;
    font-size: 1.4rem;
    border: 1px solid var(--main-orange);
    padding: 0 8px;
}


/* modal
--------------------------------------- */
.modal {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    z-index: 1000;
}
.modal-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 90%;
    height: 80dvh;
    max-height: 100rem;
    background-color: #ffffff;
    border-radius: 4px;
}
.modal-header {
    position: relative;
    width: 100%;
    border-bottom: 1px solid var(--gray-1);
    height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4.8rem;
}
.modal-header p,
.modal-header span {
    font-size: 1.5rem;
    font-weight: 600;
    text-align: center;
}
.modal form {
    height: 100%;
}
.modal-inner {
    height: calc(100% - 8.8rem);
    margin-bottom: 4.8rem;
    border-bottom: 1px solid var(--gray-2);
    overflow-y: auto;
    padding: 16px;
}

/* modal - button */
.modal-btn-area {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 4.8rem;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
}
.modal-btn-area button {
    position: unset;
}
.modal-btn-area .btn-modal-orange {
    margin-left: auto;
    margin-right: 0;
}
button[class^="btn-modal"] {
    position: absolute;
}
.btn-modal-close {
    width: 3.2rem;
    height: 3.2rem;
    top: 4px;
    right: 8px;
    left: unset;
    border: 0 !important;
    border-radius: 3.2rem;
    background-color: #ffffff;
    background-image: url(../img/ic_close.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.4rem;
}
.btn-modal-orange,
.btn-modal-red-border,
.btn-modal-gray-border,
.btn-modal-blue-border {
    top: unset !important;
    width: auto;
    height: 3rem;
    border-radius: 3px;
    bottom: calc((4.8rem - 30px)/2);
    font-size: 1.5rem;
    font-weight: normal;
    padding: 0 12px;
}
.btn-modal-orange {
    right: 12px;
    border: 0;
    background-color: var(--main-orange) !important;
    line-height: 3rem;
    color: #ffffff;
}
.btn-modal-red-border {
    left: 12px;
    font-weight: normal;
    line-height: calc(3rem - 10px);
    padding-top: 0;
    padding-bottom: 0;
    background-color: #ffffff !important;
    border: 1px solid var(--red);
    color: var(--red);
    margin: 0;
}
.btn-modal-gray-border {
    left: 8px;
    color: var(--gray-6);
    line-height: calc(3rem - 10px);
    border: 1px solid var(--gray-5);
    background-color: #ffffff;
}
.btn-modal-blue-border {
    border: 1px solid var(--main-blue);
    background-color: #ffffff;
    color: var(--main-blue);
}

/* csv import */
.modal.csv-import form {
    height: auto;
}
.modal.csv-import .modal-content {
    width: 80rem;
    height: auto;
    max-height: 70dvh;
}
.modal.csv-import .modal-inner {
    max-height: calc(70dvh - 4rem);
    border-bottom: 0;
    margin-bottom: 0;
}
.modal.csv-import .import-area {
    height: 3.6rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 10px;
}
input[type="file" i]::-webkit-file-upload-button {
    border: 2px solid var(--gray-4);
    border-radius: 4px;
    color: var(--main-blue);
    font-weight: 600;
    background-color: #ffffff;
    padding: 4px 12px;
    margin-right: 8px;
}
.ic-btn.btn-clear-file {
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 1.4rem;
    background-image: url(../img/ic_close.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.3rem;
}
.modal.csv-import .btn.orange {
    margin-left: 20px;
}
.modal.csv-import .error-area {
    max-height: calc((70dvh - 7.6rem) - 36px);
    overflow-y: auto;
    background-color: #f6f6f6;
    border-radius: 4px;
    border: 1px solid var(--gray-1);
    padding: 8px 10px;
}
.modal.csv-import .error-area.initial-view > p {
    color: var(--gray-5);
}
.modal.csv-import .error-area ul li {
    display: flex;;
    align-items: flex-start;
}
.modal.csv-import .error-area ul li:not(:last-child) {
    margin-bottom: 4px;
}
.modal.csv-import .error-area ul li .line-num {
    width: 6rem;
    text-align: right;
}
.modal.csv-import .error-area ul li p:not(.line-num) {
    width: calc(100% - 7.4rem);
    margin-left: 8px;
}

/* modal - 繰り返す予定の編集/削除 */
.modal.err .modal-content {
    max-width: 360px;
    height: auto;
}
.modal.err .modal-inner {
    height: calc(100% - 4rem);
    border-bottom: 0;
    margin-bottom: 0;
}
.modal.err .modal-header {
    color: #ffffff;
    background-color: var(--main-blue);
    border-radius: 4px 4px 0 0;
}
.err-modal-btn-area {
    display: flex;
    gap: 0 10px;
    justify-content: flex-end;
    padding: 8px 16px 16px;
}
.modal.err .btn.orange {
    color: #ffffff;
    border: 0;
    background-color: var(--main-orange);
}
.modal.err .btn.gray {
    border: 0 !important;
}
.modal.err .radio-list {
    margin-top: 12px;
}
.modal.err ul.radio-list li {
    border: 1px solid var(--gray-2);
    border-radius: 4px;
}
.modal.err ul.radio-list li:not(:last-child) {
    margin-bottom: 4px;
}
.modal.err ul.radio-list input[type="radio"]:checked + label:before {
    background-color: var(--form-bg-color);
}
.modal.err label {
    position: relative;
    width: 100%;
    height: 3.2rem;
    border-radius: 3px;
    padding: 6px;
}
.modal.err label span {
    white-space: nowrap;
    line-height: 3.2rem;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 3px;
    padding-left: calc(1.4rem + 12px);
    z-index: -1;
}
.modal.err input[type="radio"]:checked + span {
    background-color: var(--pale-yellow-1);
}
#repeat-modal p {
    font-size: 1.3rem;
}
#repeat-modal #message-all-change {
    border-top: 1px dashed var(--gray-1);
    padding-top: 16px;
    margin-top: 16px;
}

/* modal - 参加者選択 */
.modal.participant {
    display: none;
}
.modal.participant .modal-inner {
    height: calc(100% - 4rem);
    overflow: unset;
}
.modal .search-area {
    background-color: var(--form-bg-color);
    border-radius: 4px;
    padding: 8px;
    margin-bottom: 8px;
}
.modal .search-area ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.modal .search-area ul li:last-child {
    display: flex;
    gap: 0 8px;
    align-items: center;
    justify-content: space-between;
}
.modal .search-area input[type="text"] {
    background-color: #ffffff !important;
    width: calc((100% - 8px) - 3.6rem);
}
.modal .search-area .btn-search {
    width: 3.2rem;
    height: 3.2rem;
}
.modal .btn-select-all,
.modal .btn-clear-all {
    width: 100%;
    height: 3.2rem;
    border-radius: 4px;
    font-size: 1.4rem;
}
.modal .btn-select-all {
    border: 1px solid var(--main-blue);
    background-color: var(--form-bg-color);
    color: var(--main-blue);
}
.modal .btn-clear-all {
    border: 1px solid var(--gray-5);
    background-color: #ffffff;
    color: var(--gray-6);
}
.modal .search-result-area {
    height: calc((100% - 32px) - 7.2rem)
}
.modal.participant .member-list {
    height: calc((100% - 3.2rem) - 8px);
    outline: 1px solid var(--gray-2);
    outline-offset: -1px;
}
.modal.participant .member-list li {
    border-right: 0;
    border-left: 0;
}
.modal.participant .member-list li:nth-child(2) {
    border-radius: 4px 4px 0 0;
    border-top: 0;
}
.modal.participant .member-list li:last-child {
    border-radius: 0;
}
.modal.participant .btn-select-all {
    font-weight: 600;
    margin-bottom: 8px;
}


/* form(detail)
--------------------------------------- */
.detail .form > li {
    margin-bottom: 16px;
}
.detail .form .content-ttl,
.detail .form .form-content > p:first-child:not(.number) {
    line-height: 2.2rem
}

/* detail - schedule - 予定名 */
.detail .form.schedule-ttl {
    padding-bottom: 4px;
    border-bottom: 2px solid var(--default-event-color);
}
.detail .form.schedule-ttl.no-kind {
    border-bottom: 2px solid var(--gray-1);
}
.detail .form.schedule-ttl .form-content p {
    font-size: 1.8rem;
}

/* detail - schedule - 日時 */
.detail .repeat-info {
    color: var(--gray-5);
}

/* detail - schedule - 分類 */
.detail .form .bunrui-list {
    border: 1px solid var(--gray-4);
    border-radius: 4px;
    padding: 8px 8px 0 8px;
    margin-top: 8px;
}
.detail .form .bunrui-list > p {
    width: 100%;
    padding: 4px;
    text-align: center;
    margin-bottom: 4px;
}
.detail .form .bunrui-list > p.skd {
    background-color: var(--gray-5);
    color: #ffffff;
}
.detail .form .bunrui-list > p.achv {
    background-color: var(--lightgreen);
    color: #ffffff;
}
.detail .form .bunrui-list > div {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--gray-4);
}
.detail .form .bunrui-list > div:last-child {
    border-bottom: 0;
}
.detail .form .bunrui-list ul {
    width: 100%;
}
.detail .form .bunrui-list ul li {
    border-bottom: 1px dashed var(--gray-4);
    padding: 6px 0;
    position: relative;
    list-style: disc;
    list-style-position: inside;
    padding-left: 4px;
}
@media screen and (max-width: 459px) {
    .detail .form .bunrui-list > div:not(:first-of-type) {
        display: block;
        padding-top: 2px;
        padding-bottom: 6px;
    }
    .detail .form .bunrui-list .content-ttl {
        line-height: 2.8rem !important;
    }
    .detail .form .bunrui-list ul li {
        width: 100%;
    }
    .detail .form .bunrui-list ul li:last-child {
        border-bottom: 0;
    }
}
@media screen and (min-width: 460px) and (max-width: 999px) {
    .detail .form .bunrui-list ul {
        display: flex;
        flex-wrap: wrap;
        gap: 0 8px;
    }
    .detail .form .bunrui-list ul li {
        width: calc(50% - 4px);
    }
    .detail .form .bunrui-list ul li:last-child:nth-child(2n),
    .detail .form .bunrui-list ul li:nth-last-child(2):nth-child(2n + 1),
    .detail .form .bunrui-list ul li:last-child:nth-child(2n + 1) {
        border-bottom: 0;
    }
}
@media screen and (min-width: 1000px) and (max-width: 1039px) {
    .detail .form .bunrui-list ul li {
        width: 100%;
    }
    .detail .form .bunrui-list ul li:last-child {
        border-bottom: 0;
    }
}
@media screen and (min-width: 1040px) {
    .detail .form .bunrui-list ul li {
        width: calc(50% - 4px);
    }
    .detail .form .bunrui-list ul li:last-child:nth-child(2n),
    .detail .form .bunrui-list ul li:nth-last-child(2):nth-child(2n + 1),
    .detail .form .bunrui-list ul li:last-child:nth-child(2n + 1) {
        border-bottom: 0;
    }
}
.detail .form .bunrui-list ul li::marker {
    color: var(--gray-4);
    font-size: 1.6rem;
}
.detail .form .bunrui-list .content-ttl {
    width: 10rem;
    line-height: 3.2rem;
}

/* detail - todo - 重要度 */
.detail .li-importance .level1 {
    color: var(--red);
}
.detail .li-importance .level2 {
    color: var(--yellow-1);
}
.detail .li-importance .level3 {
    color: var(--lightgreen);
}

/* detail - todo - 状況 */
.detail .li-done {
    align-items: center;
}
.detail .li-done .form-content {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}
.detail .li-done .form-content p.done {
    display: flex;
    align-items: center;
    gap: .8rem;
}
.detail .li-done .form-content p.done:before {
    content: "";
    display: block;
    width: .6rem;
    height: 1rem;
    border-right: 3px solid var(--main-orange);
    border-bottom: 3px solid var(--main-orange);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    margin-top: -.4rem;
}

/* detail - schedule - 参加者 */
.detail .form.participant .content-ttl {
    margin-bottom: 6px;
}
.detail .form.participant .number {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 4px;
    margin-right: 0;
    margin-bottom: 6px;
}
.detail .form.participant .m-info > span {
    display: block;
    width: 2.4rem;
    height: 2.4rem;
}
.detail .form.participant .m-info .ic-total-list {
    mask-image: url(../img/ic_nippou.svg);
    -webkit-mask-image: url(../img/ic_nippou.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-size: 1.6rem;
    -webkit-mask-size: 1.6rem;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: var(--main-blue);
    margin-right: .2rem;
}

/* li-top */
.detail .form .li-top {
    display: flex;
    align-items: center;
    justify-content: center;
}
.detail .form .li-top p {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--main-blue);
}

/* warning */
.detail .page-header + .warning {
    font-weight: normal;
    font-size: 1.3rem;
}
.mobile .detail .page-header + .warning {
    margin: 8px 8px 0;
}
body:not(.mobile) .detail .page-header + .warning {
    text-align: right;
    margin-bottom: 4px;
}


/* login
--------------------------------------- */
.login {
    min-width: 280px;
    background-color: #f6f6f6;
    padding: 30px;
}
.login-container {
    margin: 24dvh auto 0 ;
}
.login .system-logo {
    min-width: 18rem;
    height: 6rem;
    background-image: url(../img/systemlogo1.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0 auto;
}
@media screen and (min-width: 821px) {
    .login .system-logo {
        height: 8rem;
    }
}
.login ul li a {
    display: block;
    width: 14rem;
    height: 4.6rem;
    text-decoration: none;
    color: #ffffff;
    font-size: 1.6rem;
    text-align: center;
    line-height: 4.6rem;
    background-color: var(--main-blue);
    border-radius: 4px;
    margin: 6rem auto 0;
}
@media screen and (min-width: 821px) {
    .login ul li a {
        margin-top: 8rem;
    }
}
.login .error-msg {
    color: var(--red);
    line-height: 1.3;
    text-align: center;
    margin: 8px auto 0;
}

/* error
--------------------------------------- */
.error-body {
    display: flex;
    justify-content: center;
    padding-top: 5dvh;
    background-color: #f6f6f6;
}
.error-wrap {
    width: 100%;
    text-align: center;
    padding: 16px;
}
.error-wrap .system-logo {
    height: 3rem;
    background-image: url(../img/systemlogo1.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-bottom: 3rem;
}
.error-main {
    display: inline-block;
    width: 95%;
    max-width: 70rem;
    border-radius: 10px;
    background-color: #ffffff;
    padding: 2rem;
    margin: 0 auto;
}
@media screen and (min-width: 821px) {
    .error-main {
        width: auto;
        min-width: 30rem;
    }
}
.error-ttl {
    font-size: 2.8rem;
    font-weight: 600;
    color: var(--main-blue);
    margin-bottom: 16px;
    opacity: .45;
    padding-top: 9rem;
    background-image: url(../img/ic_error.svg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 8rem;
}
@media screen and (min-width: 821px) {
    .error-ttl {
        font-size: 3.4rem;
    }
}
.error-message-area {
    font-size: 1.4rem;
    margin-bottom: 30px;
}
.error-func button {
    width: auto;
    max-width: 60rem;
    height: 3.6rem;
    color: #ffffff;
    font-size: 1.3rem;
    white-space: nowrap;
    background-color: var(--main-blue);
    border: 0;
    border-radius: 4px;
    padding: 0 14px;

}


/* loading
--------------------------------------- */
    .loding-overlay {
    background-color: rgba(255, 255, 255, 0.2);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9995;
}
.loading-msg {
    color: #cdcdcd;
    font-size: 2rem;
    font-weight: bold;
    left: 50%;
    position: absolute;
    top: 45%;
    transform: translateY(-45%) translateX(-50%);
    -webkit-transform: translateY(-45%) translateX(-50%);
    -ms-transform: translateY(-45%) translateX(-50%);
}


/* modal(alert)
--------------------------------------- */
.dg-overlay {
    display: none;
}
.dg-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    z-index: 9999;
    top: 0;
    left: 0;
}
.dg-overlay .dg-body {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    background-color: #ffffff;
    width: 400px;
    border-radius: 4px;
}
.dg-container .dg-head {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 4rem;
    background-color: var(--main-blue);
    padding: 0 4.8rem;
    border-radius: 4px 4px 0 0;
}
.dg-container .dg-title p#dg-title-txt,
.dg-container .dg-title p#dg-title-txt2,
.dg-container .dg-title p#item-master-dg-title-txt,
.dg-container .dg-title p#cust-master-dg-title-txt {
    font-weight: bold;
    color: #ffffff;
}
.dg-container .dg-contents {
    padding: 18px 16px;
}
.dg-container .dg-sub-msg {
    margin-top: 8px;
}
.dg-container .dg-sub-msg p#dg-sub-msg-txt {
    font-size: 1.3rem;
    color: #888888;
}
.dg-func-ctl {
    padding: 18px 16px;
    display: flex;
    justify-content: flex-end;
}
.dg-func-ctl .btn.i-btn {
    height: 3rem;
    border: 0;
    border-radius: 3px;
    font-size: 1.4rem;
    line-height: 3rem;
    padding: 0 12px;
    margin-left: 8px;
}
.dg-func-ctl .btn.i-btn.blue {
    color: #ffffff;
    background-color: var(--main-blue);
}
.dg-func-ctl .btn.i-btn.gray {
    background-color: transparent;
    color: var(--gray-6);
    border: 0 !important;
}
#dg-main-msg-txt {
    white-space: pre-line;
}
.dg-err-msg {
    white-space: pre-line;
    color: var(--red);
}



/******************************************************
マスタ管理, 営業日報, マイメンバー
*******************************************************/
/* order func
--------------------------------------- */
.order-func {
    display: flex;
    align-items: center;
    justify-content: center;
}
.order-func button {
    display: block;
    width: 2.6rem;
    height: 2.4rem;
    border: 1px solid var(--gray-5);
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.4rem;
}
.order-func button:first-child {
    border-radius: 3px 0 0 3px;
    background-image: url(../img/arrow_up1.svg);
}
.order-func button:last-child {
    border-radius: 0 3px 3px 0;
    border-left: 0;
    background-image: url(../img/arrow_down1.svg);
}


/* マイメンバー・共通グループ管理
--------------------------------------- */
main.group-member {
    min-width: 960px !important;
}

main.group-member {
    height: 100%;
}
main.group-member .main-content {
    display: flex;
    gap: 20px;
    height: calc((100% - 3.2rem) - 12px);
    border: 0 !important;
    background-color: transparent;
    padding: 0 !important;
}
main.group-member .main-content > div {
    width: calc(50% - 10px);
    height: 100%;
}
main.group-member .main-content .content-ttl {
    width: 100%;
    height: 3.2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}
main.group-member .main-content .content-ttl p {
    font-weight: 600;
    font-size: 1.6rem;
}
main.group-member .main-content .content-ttl .btn-area {
    align-items: center;
}
main.group-member .main-content .content-inner {
    width: 100%;
    height: calc((100% - 3.2rem) - 4px);
    border: 1px solid var(--gray-1);
    border-radius: 4px;
    background-color: #ffffff;
    overflow-y: auto;
}

/* left */
main.group-member .left {
    position: relative;
}
main.group-member .left .content-inner {
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}
main.group-member .left .li-header {
    position: sticky;
    top: 0;
    background-color: #ffffff;
    border-bottom-width: 2px;
    z-index: 1;
}
main.group-member .left .li-header p {
    color: var(--gray-6);
    padding: 6px 10px;
}
main.group-member .left .li-header p:not(.g-name) {
    text-align: center;
}
main.group-member .left li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    border-top: 1px solid transparent;
    border-right: 1px solid transparent;
    border-left: 1px solid transparent;
    border-bottom: 1px solid var(--gray-2);
    padding: 0 2rem 0 8px;
}
main.group-member .left .edit-mode li {
    padding-right: 8px;
}
main.group-member .left li p {
    font-size: 1.4rem;
    padding: 8px 10px;
}
main.group-member.favorite .left .g-name {
    width: calc(100% - 18rem);
}
main.group-member:not(.favorite) .left .g-name {
    width: calc(100% - 6rem);
}
main.group-member.favorite .left .edit-mode .g-name {
    width: calc(100% - 24rem);
}
main.group-member:not(.favorite) .left .edit-mode .g-name {
    width: calc(100% - 12rem);
}
main.group-member .left .number {
    text-align: center;
}
main.group-member .left .number,
main.group-member .left .disp,
main.group-member .left .delete,
main.group-member .left .order {
    width: 6rem;
}
main.group-member .left .edit-mode .order {
    width: 8rem;
}
main.group-member .left .content-inner:not(.edit-mode) .disp-off {
    background-color: var(--pale-blue-2);
    outline: 1px solid var(--main-blue);
    outline-offset: -1px;
}
main.group-member .left .edit-mode .disp-off {
    background-color: var(--pale-yellow-1) !important;
}
main.group-member .left .content-inner:not(.edit-mode) li.disp-off:after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    right: 4px;
    width: 0;
    height: 0;
    border-top: 1.2rem solid transparent;
    border-bottom: 1.2rem solid transparent;
    border-left: 1rem solid var(--main-blue);
}
main.group-member .left li.selected {
    background-color: var(--pale-blue-1);
    border-color: var(--main-blue);
}
main.group-member .left li.del-li {
    position: relative;
}
main.group-member .left li.del-li:before {
    content: "";
    display: block;
    height: 1px;
    background-color: var(--gray-5);
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
main.group-member.favorite .left li.del-li:before {
    width: calc(100% - (20rem + 16px));
}
main.group-member:not(.favorite) .left li.del-li:before {
    width: calc(100% - (14rem + 16px));
}

/* left - 星アイコン */
main.group-member .left .mymember {
    display: flex;
    align-items: center;
    position: relative;
    padding-left: 2.6rem;
}
main.group-member .left .mymember:before {
    content: "";
    display: block;
    width: 2.4rem;
    height: 2.4rem;
    background-image: url(../img/ic_star.svg);
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 2px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

/* left - 表示 */
.ic-check {
    display: block;
    width: 1.8rem;
    height: 1.8rem;
    background-image: url(../img/ic_check.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin: 0 auto;
}
main.group-member label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin: 0 auto;
}
main.group-member input[type="checkbox"] {
    width: 16px;
    height: 16px;
}

/* left - グループ削除ボタン */
main.group-member .delete input[type="checkbox"] {
    accent-color: var(--red);
}
main.group-member .delete button {
    width: 2.6rem!important;
    height: 2.6rem;
    margin: 0 auto;
}

/* right */
main.group-member:not(.edit-member) .member-list {
    border: 0;
}
main.group-member:not(.edit-member) .right .content-inner {
    overflow-y: auto;
}
main.group-member .right .disp-off {
    background-color: var(--pale-yellow-1) !important;
}

/* 登録なし画像 */
main.group-member li.li-no-content {
    display: block;
    border: 0;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 28rem;
    background-repeat: no-repeat;
    background-position: top center;
    padding: 11rem 0 0;
}
main.group-member .left li.li-no-content {
    background-image: url(../img/no_group.png);
    background-size: 12rem;
    background-position: top 1rem center;
}
main.group-member .right li.li-no-content {
    background-image: url(../img/no_member.png);
    background-size: 10rem;
}
main.group-member li.li-no-content p {
    font-size: 1.4rem;
    color: var(--gray-5);
}


/* マイメンバー・共通グループ管理（メンバー編集）
--------------------------------------- */
/* left */
main.edit-member:not(.favorite) .left .g-name {
    width: calc(100% - 12rem);
}
main.edit-member .left li {
    padding: 0 8px;
}
main.edit-member .left li:not(.selected):not(.li-header) {
    background-color: #f1f1f1;
}
main.edit-member .left li {
    justify-content: flex-start;
}

/* right */
main.edit-member .right > .content-inner {
    border: 0;
    background-color: transparent;
    overflow-y: unset;
}
main.edit-member .right .content-inner > form,
main.edit-member .right .content-inner > .content-inner {
    height: calc(50% - 2.3rem);
}
main.edit-member .right .content-inner > .content-inner {
    overflow-y: visible;
}
main.edit-member .right .ic-btn.btn-search {
    width: 3rem;
    height: 3rem;
    background-size: 1.8rem;
}
main.edit-member .right .ic-btn.btn-search .ic {
    mask-size: 1.8rem;
    -webkit-mask-size: 1.8rem;
}


/* common
--------------------------------------- */
main.master .main-content {
    border: 0;
    background-color: transparent;
    padding: 0;
}

/* 検索 */
.main-content > .search-area {
    display: inline-block;
    position: relative;
    border: 1px solid var(--gray-1);
    background-color: #ffffff;
    padding: 12px 80px 12px 16px;
    margin-bottom: 16px;
}
.main-content > .search-area ul {
    display: flex;
    gap: 10px 16px;
    flex-wrap: wrap;
}
.main-content > .search-area .li-term {
    display: flex;
    align-items: center;
    gap: 0 4px;
}
.main-content > .search-area ul li > div {
    display: flex;
    align-items: center;
    gap: 0 8px;
}
.main-content > .search-area ul li p {
    line-height: 2.2rem;
    font-size: 1.3rem;
    white-space: nowrap;
}
.main-content > .search-area .btn-search {
    position: absolute;
    right: 16px;
    bottom: 10px;
}
main.master .date-select-area {
    display: flex;
    gap: 0 4px!important;
    align-items: center;
}
.main-content > .search-area li.checkbox {
    padding-top: 2.2rem;
    margin-left: 1.2rem;
}
.main-content > .search-area li.checkbox label {
    display: flex;
    align-items: center;
    line-height: 3rem;
    white-space: nowrap;
}
main.master.week .main-content > .search-area,
main.master.room .main-content > .search-area {
    padding: 12px 16px;
}
main.master.week .main-content > .search-area li,
main.master.room .main-content > .search-area li {
    display: flex;
    gap: 0 8px;
    align-items: center;
}

/* table */
main.master.member table {
    white-space: nowrap;
}
main.master table .th-checkbox {
    width: 3.8rem;
}
.table-func {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 6px;
}
.table-func .func-content {
    display: flex;
    align-items: center;
    gap: 16px;
}
.table-func p {
    color: var(--gray-5);
    font-size: 1.4rem;
}
.table-func .pagination {
    display: flex;
    gap: 6px;
    align-items: center;
}
.table-func .pagination button {
    min-width: 2.2rem;
    height: 2.4rem;
    border: 1px solid var(--main-blue);
    border-radius: 3px;
    background-color: #ffffff;
    padding: 3px 6px;
    font-size: 1.4rem;
    color: var(--main-blue);
    line-height: calc(2.4rem - 8px);
}
.table-func .pagination button:first-child,
.table-func .pagination button:last-child {
    background-image: url(../img/pagination_arrow.svg);
    background-repeat: no-repeat;
    background-position: right .5rem center;
}
.table-func .pagination button:first-child {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    background-position: left .7rem center;
}
.table-func .pagination button:disabled {
    filter: grayscale(10) brightness(3);
    background-color: #4f4f4f;
}
.table-func .pagination button.current {
    background-color: var(--main-blue);
    color: #ffffff;
}

.table-area {
    width: 100%;
    overflow-x: auto;
}
main:not(.schedule) table {
    min-width: 100%;
    border-collapse: collapse;
}
main:not(.schedule) table,
main:not(.schedule) table tr,
main:not(.schedule) table tr > *,
main:not(.schedule) table tr > * > div {
    height: 100%;
}
main:not(.schedule) table tr > * {
    border: 1px solid var(--gray-1);
    padding: 4px 8px;
    text-align: left;
}
main:not(.schedule):not(.report) table th {
    background-color: var(--form-bg-color);
}
main:not(.schedule):not(.m-cal) table td {
    background-color: #ffffff;
}
.sort {
    position: relative;
    color: var(--main-blue);
}
.sort:not(p.align-center) {
    padding-right: 2.8rem !important;
}
p.sort.align-center {
    padding: 0 2.4rem;
}
.sort span {
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
th.sort span {
    right: .8rem;
}
p.sort span {
    right: 0;
}
p.sort:first-child span {
    top: 42%;
}
p.sort:last-child span {
    top: 58%;
}
p.col-2 span.sort:first-child span {
    right: .2rem;
}
p.col-2 span.sort:last-child span {
    right: .6rem;
}
.sort span.desc {
    border-bottom: .8rem solid var(--main-blue);
    border-right: .6rem solid transparent;
    border-left: .6rem solid transparent;
}
.sort span.asc {
    border-top: .8rem solid var(--main-blue);
    border-right: .6rem solid transparent;
    border-left: .6rem solid transparent;
}
.tbl-2-lines tr > * > p {
    min-height: 2.5rem;
    line-height: 1.4;
}
.tbl-2-lines tr > td > div {
    position: relative;
}
main.member .tbl-2-lines tr > td > div {
    display: flex;
    flex-direction: column;
}
.tbl-2-lines tr > td > div:before {
    content: "";
    position: absolute;
    width: calc(100% + 16px);
    height: 1px;
    border-top: 1px dashed var(--gray-1);
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: -8px;
}
.tbl-2-lines tr > * > p ,
.tbl-2-lines tr > td > div > p {
    position: relative;
    min-height: 2.5rem;
    line-height: 1.5;
}
.tbl-2-lines tr > td > div > p {
    min-height: 50%;
    flex-grow: 1;
    align-content: center;
}
.tbl-2-lines tr > * > p:first-child,
.tbl-2-lines tr > td > div > p:first-child {
    padding-bottom: 4px;
}
.tbl-2-lines tr > * > p:first-child:before {
    content: "";
    width: calc(100% + 16px);
    height: 0;
    border-top: 1px dashed var(--gray-1);
    position: absolute;
    bottom: 0;
    left: -8px;
}
.tbl-2-lines tr > * > p:last-child,
.tbl-2-lines tr > td > div > p:last-child {
    padding-top: 4px;
}
.align-center {
    text-align: center !important;
}
.align-right {
    text-align: right !important;
}
.th-btn {
    width: 6rem;
}
.th-ym {
    width: 10rem;
}
.th-btn-2 {
    width: calc(5.6rem + 26px);
}
.th-no {
    width: 4rem;
}

/* button in table */
main.master table .th-btn {
    width: 3.8rem;
}
main.master table td .ic-btn {
    display: block;
    width: 2.8rem;
    height: 2.8rem;
    background-repeat: no-repeat;
    background-position: center;
}
th .ic-btn.edit {
    display: inline-block;
    vertical-align: middle;
    width: 2.6rem;
    height: 2.6rem;
    background-size: 1.6rem;
}
td .btn {
    padding: 2px 6px;
}


/* modal */
main.master .modal-inner > ul > li:not(:last-child) {
    border-bottom: 1px solid var(--gray-3);
    padding-bottom: 8px;
}


/* 営業日報
--------------------------------------- */
main.master.report,
.master.answer-list,
.master.rsv-list {
    display: flex;
    max-height: 100%;
    min-height: initial;
}
main.master.report:not(.nav-open),
.master.answer-list:not(.nav-open),
.master.rsv-list:not(.nav-open) {
    padding: 4.8rem 0 0 4.8rem;
}
main.master.report.nav-open,
.master.answer-list.nav-open,
.master.rsv-list.nav-open {
    padding: 4.8rem 0 0 220px;
}
main.master.report .main-content ,
.master.answer-list .main-content,
.master.rsv-list .main-content {
    max-height: 100%;
    position: relative;
    overflow: auto;
}
main.master.report .page-header,
main.master.report .search-area,
.master.answer-list .page-header,
.master.answer-list .search-area,
.master.answer-list .table-func,
.master.rsv-list .page-header,
.master.rsv-list .search-area,
.master.rsv-list .table-func {
    position: sticky;
    left: 20px;
    width: calc(100% - 40px);
    margin-right: 20px;
    z-index: 20;
}
main.master.report .page-header,
.master.answer-list .page-header,
.master.rsv-list .page-header {
    margin-top: calc(60px - 4.8rem);
}
main.master.report.side-open {
    width: calc(100% - 33rem);
}


/* table */
main.report table,
.master.rsv-list table {
    min-width: auto;
}
main.report .tbl-ttl {
    max-width: 100%;
    height: 3.8rem;
    text-align: center;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 3.8rem;
    background-color: var(--form-bg-color);
    border-top: 1px solid var(--gray-1);
    border-right: 1px solid var(--gray-1);
    border-left: 1px solid var(--gray-1);
}
main.report .tbl-ttl:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--gray-1);
    position: absolute;
    left: 0;
    bottom: 0;
}
main.report .table-area,
.master.answer-list .table-area,
.master.rsv-list .table-area {
    overflow-x: visible;
}
main.report table tr .vertical {
    white-space: nowrap;
}
main.report .t-head table tr:first-child th:first-child {
    vertical-align: middle;
}
main.report table tr:first-child th:first-child span {
    text-align: center;
}
main.report table th {
    font-size: 1.3rem;
    letter-spacing: .5px;
    background-color: var(--form-bg-color);
}
main.report table th:not(.vertical) {
    text-align: center;
}
main.report table th span {
    vertical-align: middle;
}
main.report table td {
    text-align: center;
}
th.dark-red,
th.dark-green,
th.dark-blue {
    color: #ffffff;
    font-weight: 600;
}
th.dark-red {
    background-color: var(--dark-red) !important;
}
th.dark-green {
    background-color: var(--dark-green) !important;
}
th.dark-blue {
    background-color: var(--dark-blue) !important;
}
th.red {
    background-color: var(--pale-red-1) !important;
}
th.green {
    background-color: var(--pale-green) !important;
}
th.blue {
    background-color: var(--pale-blue-2) !important;
}
td.gray {
    background-color: var(--form-bg-color) !important;
}
tr.yellow > * {
    background-color: var(--pale-yellow-1) !important;
}
tr.yellow2 > * {
    background-color: var(--pale-yellow-2) !important;
}
.vertical,
.vertical > span {
    text-align: right;
    vertical-align: bottom;
}
.vertical > span {
    writing-mode: vertical-rl;
}
.vertical > span,
.vertical2 > span {
    display: block;
    min-width: 1.2rem;
    margin: 0 auto;
    line-height: 1.4rem;
}
.vertical2 > span {
    font-weight: 600;
}
main.report .ic-btn.edit.blue {
    width: 2.2rem;
    height: 2.2rem;
    background-size: 1.2rem;
}
main.report .ic-btn.edit.blue .ic {
    mask-size: 1.2rem;
    -webkit-mask-size: 1.2rem;
}
main.report .ic-btn.blue-border.card {
    width: 2.3rem;
    height: 2.3rem;
    background-size: 1.4rem;
    margin-top: 8px;
    margin-right: auto;
    margin-left: auto;
}

/* table - t-head */
main.report .t-head tr th:not(.vertical) {
    height: 3rem;
    min-height: 3rem;
    max-height: 3rem;
}
main.report .t-head tr:first-child th:first-child {
    position: relative;
    width: 16rem;
    min-width: 16rem;
    max-width: 16rem;
}
main.report .t-head tr:first-child th:first-child:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border: 1px solid var(--gray-1);
    position: absolute;
    top: -1px;
    left: -1px;
}
main.report .t-head tr:first-child th {
    border-top: 0;
}
main.report .t-head tr th.vertical,
main.report .t-body td {
    width: 3.5rem;
    min-width: 3.5rem;
    max-width: 3.5rem;
    padding: 4px 2px;
}
main.report .t-head tr > * {
    padding: 2px 0;
}

/* table - t-body */
main.report .table-area.t-body {
    padding-bottom: 3.6rem;
}
main.report .t-body th:first-child {
    width: 4rem;
    min-width: 4rem;
    max-width: 4rem;
}

/* table - t-body - week */
main.report .t-body tr th.week-num,
main.report .t-body tr.yellow th:first-child {
    border-left: 0;
}
main.report .t-body tr th.week-num > div {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: space-between;
}
main.report .t-body tr th.week-num > div p {
    display: flex;
    align-items: center;
    gap: 2px;
    min-height: auto;
    line-height: initial;
    padding-bottom: 0;
}
main.report .t-body tr th.week-num > div p:before {
    content: none;
}
main.report .t-body tr th.week-num {
    width: 12rem;
    min-width: 12rem;
    max-width: 12rem;
}
main.report .t-body tr th .week-days {
    font-size: 1.2rem;
    color: var(--gray-5);
}
main.report .t-body tr th:first-child:before,
main.report .t-body tr th.week-num:before,
main.report .t-body tr th.week-num:after,
main.report .t-body tr.yellow th:first-child:after,
main.report .t-body tr.yellow2 > th:first-child:after {
    content: "";
    display: block;
    background-color: var(--gray-1);
    position: absolute;
    top: 0;
    z-index: -1;
}
main.report .t-body tr th:first-child:before,
main.report .t-body tr th.week-num:before {
    width: 1px;
    height: 100%;
    left: -1px;
}
main.report .t-body tr th.week-num:after,
main.report .t-body tr.yellow th:first-child:after,
main.report .t-body tr.yellow2 > th:first-child:after {
    width: 1px;
    height: 100%;
    right: -1px;
}

/* table セル固定 */
main.report .tbl-ttl,
main.report .t-head,
main.report .t-head tr:first-child th:first-child,
main.report .t-body th.vertical2,
main.report .t-body tr th.week-num,
main.report .t-body tr.yellow > th:first-child,
main.report .t-body tr.yellow2 > th:first-child,
.master.answer-list tr:first-child,
.master.answer-list th,
.master.rsv-list tr:first-child,
.master.rsv-list th {
    position: sticky;
}
main.report .tbl-ttl,
main.report .t-head,
main.report .t-head tr:first-child th:first-child {
    z-index: 10;
}
main.report .tbl-ttl {
    top: -1px;
}
main.report .t-head {
    top: calc(3.8rem - 1px)
}
main.report .tbl-ttl,
main.report .t-head tr:first-child th:first-child,
main.report .t-body th.vertical2,
main.report .t-body tr.yellow2 > th:first-child {
    left: 0;
}
main.report .t-body th.vertical2 {
    z-index: 1;
}
main.report .t-body tr th.week-num,
main.report .t-body tr.yellow > th:first-child {
    left: 4rem;
}
main.report .no-data {
    max-width: 100%;
    line-height: 3rem;
    background-color: #ffffff;
    border: 1px solid var(--gray-1);
    border-top: 0;
    position: sticky;
    left: 0;
    text-align: center;
    margin-top: -3.6rem;
}

/* modal - 実績項目編集 */
.modal.item-edit .modal-content {
    width: 70%;
    min-width: 80rem;
    max-width: 100rem;
    height: 90dvh;
    max-height: 80rem;
}
.modal.item-edit .modal-inner {
    padding-right: 12px;
    padding-left: 12px;
}
.modal.item-edit .content {
    width: 100%;
    padding-bottom: 10px;
}
.modal.item-edit .inner-ttl {
    display: flex;
    justify-content: center;
    width: 100%;
    background-color: var(--main-blue);
    margin-bottom: 20px;
    padding: 4px 0;
}
.modal.item-edit .inner-ttl p,
.modal.item-edit .inner-ttl span {
    color: #ffffff;
    font-weight: 500;
    font-size: 1.6rem;
}
.modal.item-edit .inner-ttl p:nth-child(3) {
    margin-right: 1.2rem;
}
.modal.item-edit .item-ttl1 {
    width: 100%;
    color: var(--main-blue);
    font-weight: 600;
    font-size: 1.5rem;
    border-bottom: 2px solid var(--main-blue);
    padding: 4px 0;
    margin-bottom: 14px;
}
.modal.item-edit .item-ttl1:last-of-type {
    margin-top: 20px;
}
.modal.item-edit .item-ttl2 {
    font-size: 1.4rem;
    color: var(--main-blue);
    font-weight: 500;
    margin-bottom: 4px;
}
.modal.item-edit table {
    width: auto;
    min-width: auto;
}
.modal.item-edit table th {
    width: 12rem;
}
.modal.item-edit table td {
    padding: 2px !important;
}
.modal.item-edit input[type="text"] {
    text-align: right;
}
.modal.item-edit .total {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 3.8rem;
    padding-right: 9px;
}
.modal.item-edit .total p:last-child {
    color: var(--main-text-color);
}
.modal.item-edit .modal-inner .content:last-of-type {
    width: 100%;
}
.modal.item-edit .modal-inner .content:last-of-type ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0 16px;
    justify-content: space-between;
}
.modal.item-edit .modal-inner .content:last-of-type ul li {
    width: calc(50% - 18px);
}

/* multiple select */
.SumoSelect {
    width: 16rem;
}
.SumoSelect > .CaptionCont {
    border: 0;
    background-color: transparent;
}
.SumoSelect > .CaptionCont > span {
    font-size: 1.5rem;
}
.SumoSelect > .CaptionCont > label > i {
    display: none;
}
.SumoSelect:focus > .CaptionCont,
.SumoSelect:hover > .CaptionCont,
.SumoSelect.open > .CaptionCont {
    box-shadow: none;
    border-color: initial;
}
.SumoSelect > .optWrapper > .options {
    display: block;
    gap: 0;
}
.SumoSelect > .optWrapper.multiple > .options li.opt {
    width: 100%;
}
.SumoSelect > .optWrapper.multiple > .options li.opt.selected span i,
.SumoSelect .select-all.selected > span i,
.SumoSelect .select-all.partial > span i {
    background-color: var(--main-blue);
}
.SumoSelect .select-all {
    height: auto;
    padding-top: 6px;
    padding-bottom: 6px;
}
.SumoSelect label {
    font-size: 1.4rem;
}

/* side */
main.report .side-content {
    border-left: 1px solid var(--gray-1);
}
main.report .side-main-content {
    height: calc(100% - 7.4rem);
}
main.master.report .side-card .side-ttl {
    position: relative;
    display: block;
    height: auto;
    padding: 0;
}
main.master.report .side-card .side-ttl .main-ttl {
    height: 4.4rem;
    border-bottom: 1px solid var(--gray-2);
    padding: 4px 10px;
}
main.master.report .side-card .side-ttl #side-card-name {
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    color: var(--main-text-color);
    font-size: 1.5rem;
    padding: 0 10px;
}
main.master.report .side-card .ic-btn.side-close {
    width: 3rem;
    height: 100%;
    background-color: #ffffff;
    border-left: 1px solid var(--gray-1);
    border-radius: 0;
    background-image: url(../img/ic_next.svg);
    background-repeat: no-repeat;
    background-size: 1rem;
    background-position: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: calc(-3rem - 1px);
    z-index: 240;
}


/* 社員管理
--------------------------------------- */
/* table */
main.member table tr > *:first-child,
main.holiday table tr > *:first-child {
    text-align: center;
}
main.member .tbl-2-lines tr > td > div:before {
    content: none;
}
main.member .tbl-2-lines tr > td > div > p:first-child:before {
    content: "";
    position: absolute;
    width: calc(100% + 16px);
    height: 1px;
    border-top: 1px dashed var(--gray-1);
    bottom: -.1rem;
    left: -8px;
}

/* modal */
.modal.member-edit form {
    position: relative;
    height: calc(100% - 4rem);
}
.modal.member-edit .modal-content {
    min-width: 60rem;
    max-width: 80rem;
    height: 70dvh;
}
.modal.member-edit .modal-inner {
    display: flex;
    height: calc(100% - 4.8rem);
}
.modal.member-edit .selected-members {
    width: 40%;
    height: 100%;
    background-color: var(--form-bg-color);
}
.modal.member-edit .selected-members > p {
    font-size: 1.3rem;
    text-align: center;
    color: var(--gray-6);
    height: 2.6rem;
    line-height: 2.6rem;
    border-bottom: 1px solid var(--gray-4);
}
.modal.member-edit .selected-members ul {
    height: calc(100% - 2.6rem);
    overflow-y: auto;
    padding: 10px;
}
.modal.member-edit .selected-members ul li {
    font-size: 1.4rem;
    border-bottom: 1px solid var(--gray-2);
    padding-bottom: 6px;
    margin-bottom: 6px;
}
.modal.member-edit .selected-members ul li:last-child {
    margin-bottom: 0;
}
.modal.member-edit .selected-members ul li span {
    margin-left: 12px;
}
.modal.member-edit .modal-inner > ul {
    width: 60%;
    padding: 8px 16px;
}
.modal.member-edit .modal-inner > ul li {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--gray-2);
    padding-bottom: 8px;
    margin-bottom: 8px;
}
.modal.member-edit li .li-ttl {
    width: 8rem;
}


/* 休日管理
--------------------------------------- */
main.master.holiday th,
main.master.holiday td:not(.name-td) {
    white-space: nowrap;
}
main.master.holiday .search-area .switch {
    width: 24.3rem;
}
main.master.holiday .name-td {
    min-width: 30rem;
}

/* modal */
main.master.holiday .modal .switch {
    width: 100%;
    margin: 0 auto 20px;
}
main.master.holiday .modal-content {
    width: 64rem;
    height: auto;
}
main.master.holiday .modal-inner {
    height: calc(100% - 8.8rem);
}
main.master.holiday .modal-inner ul li {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
main.master.holiday .modal-inner ul li:last-child {
    margin-bottom: 0;
}
main.master.holiday .modal ul .li-job {
    align-items: flex-start !important;
}
main.master.holiday .modal-inner ul li:not(.li-type) > *:last-child:not(input[type="date"]) {
    width: calc(100% - 12rem);
}
main.master.holiday .modal-inner ul li p {
    width: 12rem;
    color: var(--gray-6);
    line-height: 3.2rem;
}
main.master.holiday .modal .li-job .radio-btn-area {
    height: 3.2rem;
    padding: 0 8px 4px 0;
}
main.master.holiday .modal .check-area {
    gap: 6px 16px;
    background-color: var(--form-bg-color);
    padding: 8px 12px;
}
main.master.holiday .modal .check-area label {
    display: flex;
    align-items: center;
    line-height: 2.4rem;
}
main.master.holiday .modal .check-area label input[type="checkbox"] {
    display: block;
    margin-left: 0;
}
main.master.holiday .modal-inner .li-has-2 p:last-of-type {
    margin-left: 4rem;
}
/* 施設グループ選択 */
main.master.holiday .modal ul .select-room-group {
    display: flex;
    align-items: center;
    align-items: center;
    gap: 0 8px;
    margin-bottom: 8px;
}
main.master.holiday .modal ul .select-room-group .btn-select-all,
main.master.holiday .modal ul .select-room-group .btn-clear-all {
    width: auto;
    height: 2.8rem;
    white-space: nowrap;
    font-size: 1.3rem;
    font-weight: normal;
    padding: 0 10px;
    margin: 0;
}



/* switch（検索）
--------------------------------------- */
main.master.holiday .search-area form,
main.master.report .search-area form {
    display: flex;
    align-items: center;
    gap: 1.2rem 2rem;
    flex-wrap: wrap;
}
main.master.holiday .search-area {
    position: relative;
}
.main-content > .search-area .switch {
    width: 12rem;
}
.main-content > .search-area .switch label {
    width: 6rem;
    color: var(--main-blue);
}
main.master.holiday .search-area .switch label:last-of-type {
    width: 12rem
}
.main-content > .search-area .switch label,
main.holiday .switch label {
    border-color: var(--main-blue);
}
.main-content > .search-area .switch label p {
    width: 100%;
    text-align: center;
    line-height: 3.5rem;
    font-size: 1.4rem;
}
main.master .switch input[type="radio"]:first-of-type:checked ~ label:first-of-type:before,
main.master .switch input[type="radio"]:nth-of-type(2):checked ~ label:nth-of-type(2):before,
main.master .switch input[type="radio"]:nth-of-type(3):checked ~ label:nth-of-type(3):before,
main.master .switch input[type="radio"]:nth-of-type(4):checked ~ label:nth-of-type(4):before,
main.master .switch input[type="radio"]:nth-of-type(5):checked ~ label:nth-of-type(5):before {
    background-color: var(--main-blue);
}
input[type="radio"].pink:checked ~ label.pink:before {
    background-color: var(--museum-pink) !important;
}
input[type="radio"].blue:checked ~ label.blue:before {
    background-color: var(--museum-blue) !important;
}
input[type="radio"].yellow:checked ~ label.yellow:before {
    background-color: var(--yellow-1) !important;
}
input[type="radio"].green:checked ~ label.green:before {
    background-color: var(--museum-green) !important;
}
input[type="radio"].green:checked + label {
    background-color: transparent !important;
}
main.master .switch label p {
    color: var(--gray-6)!important;
}
main.master .switch input[type="radio"]:first-of-type:checked ~ label:first-of-type p,
main.master .switch input[type="radio"]:nth-of-type(2):checked ~ label:nth-of-type(2) p,
main.master .switch input[type="radio"]:nth-of-type(3):checked ~ label:nth-of-type(3) p,
main.master .switch input[type="radio"]:nth-of-type(4):checked ~ label:nth-of-type(4) p,
main.master .switch input[type="radio"]:nth-of-type(5):checked ~ label:nth-of-type(5) p {
    color: #ffffff!important;
}
main.master .switch input[type="radio"]:last-of-type:checked ~ label {
    border-color: var(--main-blue);
}


/* 職種管理, 施設管理
--------------------------------------- */
.td-order {
    width: 8rem;
}
.td-order button {
    width: 3.2rem;
    height: 3rem;
    border-radius: 3px;
}

main.master.job table,
main.master.room table {
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

main.master.job tr > *:last-child,
main.master.room tr > *:last-child {
    border: 0;
    background-color: transparent !important;
}

/* click時 */
main.master .select-tr td {
    background-color: var(--pale-yellow-1);
}


/* 週数管理
--------------------------------------- */
main.master.week table {
    white-space: nowrap;
}
main.master.week td input[type="date"] {
    width: initial;
}
main.master.week td:nth-child(2n):not(:nth-child(2)),
main.master.week tr:nth-child(2) th:nth-child(2n) {
    border-left-style: dashed;
    text-align: right;
}
main.master.week td:nth-child(2n):not(:nth-child(2)) {
    color: var(--gray-5);
}
main.master.week td:nth-child(2n + 1):not(:first-child),
main.master.week tr:nth-child(2) th:nth-child(2n + 1) {
    border-right-style: dashed;
    text-align: right;
}

/* note */
p.note,
span.note {
    color: var(--gray-6);
}
.note-small {
    display: inline-block;
    font-size: 1.15rem !important;
    font-weight: normal !important;
    color: var(--gray-6) !important;
    background-color: rgba(240, 208, 0, 0.14);
    padding: .2rem .4rem;
    margin-bottom: .2rem;
}
.note-small .red {
    color: var(--red);
}
.note-small .bold {
    font-weight: 600;
    color: var(--main-text-color);
}
.note-small li {
    list-style: disc;
    padding-bottom: 0 !important;
    margin-left: 1.6rem;
}
.master.week .note {
    text-align: right;
    font-size: 1.3rem;
    margin: 4px 0 0 auto;
}
.week-error-msg {
    color: var(--red);
    font-size: 1.3rem;
    margin-top: 16px;
}

/* modal */
main.master.week .modal-content {
    width: 60rem;
    height: auto;
}
main.master.week .modal-inner {
    padding: 8px 16px 10px;
}
main.master.week #modal-nengetu {
    display: block;
    width: 100%;
    text-align: center;
    font-weight: 600;
    color: #ffffff;
    background-color: var(--main-blue);
    border: 1px solid var(--main-blue);
    padding: 4px;
    margin-bottom: 10px;
}
main.master.week .modal-content li,
main.master.week .modal-content .li-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
main.master.week .modal-content li {
    width: 100%;
}
main.master.week .modal-content li:first-child {
    border-bottom: 1px solid var(--gray-2);
    padding-bottom: .2rem;
    margin-bottom: .8rem;
    color: var(--gray-5);
    text-align: center;
    font-size: 1.3rem;
}
main.master.week .modal-content li:not(:first-child):not(:last-child) {
    margin-bottom: 1.2rem;
}
main.master.week .modal-content .li-content {
    width: 76%;
}
main.master.week .modal-content .li-content p {
    color: var(--gray-5);
}
main.master.week .modal-content li:first-child p:first-child,
main.master.week .modal-content li p:first-child {
    width: 24%;
    text-align: center;
}
main.master.week .modal-content li:first-child p:nth-child(2),
main.master.week .modal-content li:first-child p:last-child {
    width: 38%;
}
main.master.week .modal-content li:first-child p:nth-child(2) {
    padding-right: 1.5rem;
}
main.master.week .modal-content li:first-child p:last-child {
    padding-left: 1.5rem;
}
main.master.week .modal-content li p {
    display: flex;
    align-items: center;
    justify-content: center;
}
main.master.week .modal-content .li-content > p {
    width: calc(50% + 1.5rem);
}
main.master.week .modal-content .li-content input[type="date"] {
    margin: 0 auto;
}
main.master.week .modal-content li p:last-child span {
    display: block;
    text-align: center;
}
main.master.week .modal-content li p:last-child span:first-child {
    width: 3rem;
}
main.master.week .modal-content li p:last-child span:last-child {
    width: calc(100% - 3rem);
}


/* 案内希望箇所管理
--------------------------------------- */
/* table */
main.master th.edit,
main.master th.detail {
    width: 5rem;
}
main.master th.request {
    width: 8rem;
}
main.master th.hidden-item {
    width: 6.4rem;
}
main.master th.order {
    width: 7rem;
}
main.master th.time {
    width: 18.2rem;
}
main.master th.use {
    width: 8rem;
}
.guide-tbl .th-corner {
    min-width: 42rem;
}
.guide-tbl .item-name {
    white-space: nowrap;
}
.guide-tbl tr:not(.child) .item-name {
    font-weight: 600;
}
.guide-tbl tr.child th,
.guide-tbl tr.child td {
    border-top: 1px dashed var(--gray-1);
}
.guide-tbl tr.child:not(:last-child) th,
.guide-tbl tr.child:not(:last-child) td {
    border-bottom: 0;
}
.guide-tbl tr.child + tr:not(.child) th,
.guide-tbl tr.child + tr:not(.child) td {
    border-top: 1px solid var(--gray-1);
}
.guide-tbl tr.no-select td {
    border: 0;
    background-color: #ffffff!important;
}
.guide-tbl tr.no-select th,
.guide-tbl tr.no-select td {
    border-bottom: 1px solid var(--gray-1);
}
.guide-tbl tr.no-select td:last-child {
    border-right: 1px solid var(--gray-1);
}
.guide-tbl .time {
    text-align: center;
    white-space: nowrap;
}
.guide-tbl .ic-circle {
    border: 0;
    background-color: var(--main-blue);
}
.guide-tbl input[type="checkbox"] {
    display: block;
    margin: 0 auto;
}

/* 子項目 */
.guide-tbl .child .item-name {
    position: relative;
    padding-left: 3rem;
}
.guide-tbl .child .item-name:before {
    content: "";
    position: absolute;
    top: 47%;
    left: 1.2rem;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    display: block;
    width: .9rem;
    height: .8rem;
    border-left: 1.5px solid var(--gray-5);
    border-bottom: 1.5px solid var(--gray-5);
    margin-right: 8px;
    opacity: .7;
}

/* 親項目 */
main.guide-list .guide-tbl tr:not(.child) .item-name {
    line-height: 2.8rem;
    padding-right: calc(2.8rem + 16px);
}
main.guide-list .guide-tbl .ic-btn {
    display: inline-block!important;
    margin: 0 4px 0 0;
    vertical-align: middle;
}
main.guide-list .guide-tbl td .ic-btn.orange-border {
    float: right;
    font-size: 1.2rem;
    border: 0;
    margin-right: calc(-2.8rem - 8px);
}
main.guide-list .guide-tbl td .ic-btn.orange-border .ic {
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-size: 1.6rem;
    -webkit-mask-size: 1.6rem;
    background-color: var(--main-orange);
}

/* 非表示 */
.tr-hidden td {
    background-color: #e7e7e7!important;
}

/* modal */
main.guide-list .modal-content {
    width: 50%;
    min-width: 50rem;
    max-width: 70rem;
    height: auto;
}
main.guide-list .modal .btn.select-parent {
    width: auto;
    border: 1px solid var(--main-blue);
    border-radius: 4px;
    background-color: var(--form-bg-color);
    color: var(--main-blue);
}
main.guide-list .modal-inner ul li:not(.select-parent) {
    display: flex;
    align-items: flex-start;
}
main.guide-list .modal-inner ul li.select-parent ul {
    margin-top: 10px;
}
main.guide-list .modal-inner ul li.select-parent li:not(:last-child) {
    margin-bottom: 8px;
}
main.guide-list .modal-inner > ul > li {
    border-bottom: 0!important;
    border-top: 1px solid var(--gray-2);
    padding-bottom: 0!important;
    padding-top: 8px;
    margin-top: 8px;
}
main.guide-list .modal-inner > ul > li:first-child {
    align-items: flex-end;
    border-top: 0;
    padding-top: 0;
    margin-top: 0;
}
main.guide-list .modal-inner ul li .li-ttl {
    width: 12rem;
    line-height: 3.2rem;
}
main.guide-list .modal-inner .li-content {
    width: calc(100% - 12rem);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
main.guide-list .modal-inner ul li.select-parent .select-box {
    width: auto;
}
main.guide-list .modal-inner .li-content label {
    display: flex;
    align-items: center;
    gap: .2rem;
}
main.guide-list .modal-inner ul li input[type="checkbox"] {
    margin-top: .9rem;
    margin-right: 4px;
    margin-bottom: .9rem;
}
main.guide-list .modal-inner ul li input[type="time"] {
    width: auto;
}
main.guide-list .modal-inner ul li.order input[type="text"] {
    width: 6rem;
}
main.guide-list .modal-inner ul li .note {
    font-size: 1.3rem;
}
main.guide-list .modal-inner li .parent {
    display: flex;
    gap: 0 .4rem;
    align-items: flex-start;
    font-size: 1.3rem;
    line-height: 1.8rem;
    color: var(--gray-6);
    margin-bottom: .6rem;
}
main.guide-list .modal-inner li .parent:before {
    content: "";
    width: 1.8rem;
    height: 1.8rem;
    background-image: url(../img/ic_parent.svg);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 1.7rem;
}


/* アンケート管理
--------------------------------------- */
/* page header */
main.qa-list .li-ttl {
    font-size: 1.4rem;
    white-space: nowrap;
}
/* table */
main.qa-list table td {
    vertical-align: top;
}
main.qa-list table td:last-child {
    text-align: center;
    line-height: 2.8rem;
}
main.qa-list table tr > * p {
    display: flex;
    align-items: center;
    min-height: 3rem!important;
    padding: 0!important;
}
main.qa-list table tr > * p:first-child:before {
    content: none;
}
main.qa-list table .options {
    font-size: 1.4rem;
    margin-left: calc(2.6rem + 4px);
}
main.qa-list table .options li {
    position: relative;
    color: var(--gray-6);
    padding-left: 2rem;
}
main.qa-list table .options li:not(:last-child) {
    margin-bottom: 2px;
}
main.qa-list table .options li:before {
    content: "";
    display: block;
    width: 10px;
    height: 1px;
    border-radius: 2px;
    background-color: var(--gray-5);
    position: absolute;
    top: 1rem;
    left: .2rem;
}
main.qa-list table .options li > span {
    font-size: 1.2rem;
}
main.qa-list .ic-check,
main.qa-list .order-func {
    height: 3rem;
}
main.qa-list .order-func button {
    margin: auto 0;
}
main.qa-list .li-hidden {
    display: flex;
    align-items: center;
    gap: 6px;
    opacity: .55;
}
main.qa-list table .options .li-hidden:before {
    content: "";
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(../img/ic_eyeClosed.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: transparent;
    top: .4rem;
    left: 0;
}


/* 編集モーダル ***********************/
main.qa-list .modal-content {
    width: 60%;
    min-width: 60rem;
    max-width: 80rem;
}
main.qa-list .modal .li-ttl {
    width: 8rem;
    line-height: 3.2rem;
}
main.qa-list .modal .li-content {
    display: flex;
    align-items: center;
    width: calc(100% - 8rem);
}
main.qa-list .modal .ic-btn {
    width: 2.8rem;
    height: 2.8rem;
}
main.qa-list .modal ul li {
    display: flex;
    align-items: flex-start;
}
main.qa-list .modal ul li:not(.li-options li):not(:last-child) {
    padding-bottom: 12px;
    margin-bottom: 8px;
}
main.qa-list .modal ul .li-content label:not(.limit label) {
    width: 3.2rem;
    height: 3.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
main.qa-list .modal ul li input[type="checkbox"] {
    width: 1.6rem;
    height: 1.6rem;
}
main.qa-list .modal .note {
    font-size: 1.3rem;
}
main.qa-list .modal .li-content > .note:first-child {
    margin-bottom: .4rem;
}
main.qa-list .modal label > .note {
    margin-left: 10px;
}

/* 回答形式 */
main.qa-list .modal .limit {
    display: flex;
    align-items: center;
    margin-left: 1rem;
}

/* 選択肢 */
main.qa-list .li-options {
    font-size: 1.4rem;
}
main.qa-list .li-options .li-content {
    flex-direction: column;
    align-items: flex-start;
}
main.qa-list .li-options .btn-area.table-func {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 6px;
}
main.qa-list .li-options .ic-btn.add {
    margin: 0 0 0 auto;
}
main.qa-list .modal th.num {
    width: 3.6rem;
    padding: 0;
}
main.qa-list .modal th.disp {
    width: 7rem;
}
main.qa-list .modal tr > *:first-child {
    text-align: center;
    vertical-align: middle;
    padding: 4px;
}
main.qa-list .modal td:nth-child(2) {
    vertical-align: middle;
}
main.qa-list .modal td:nth-last-child(2) {
    vertical-align: middle;
}
main.qa-list .modal td .order-func {
    height: 3.2rem;
}
main.qa-list .modal tr.del-tr td,
main.qa-list .modal tr.del-tr td input[type="text"] {
    background-color: #eeeeee;
}
main.qa-list .modal tr.del-tr td:not(:first-child) * {
    opacity: .7;
}
main.qa-list .modal tr.del-tr td:nth-child(2) {
    color: rgba(51, 51, 51, .5);
}


/* ミュージアム定員管理
--------------------------------------- */
/* page header */
main.capacity-list .page-header {
    justify-content: flex-start;
}

/* table */
main.capacity-list table td {
    text-align: right;
}
main.capacity-list table td:last-child {
    color: var(--gray-5);
}

/* modal */
main.capacity-list .modal-content {
    width:  34rem;
    height: auto;
}
main.capacity-list .modal-content ul li {
    display: flex;
    align-items: center;
}
main.capacity-list .modal-content ul li:not(:last-child) {
    margin-bottom: 8px;
}
main.capacity-list .modal-content .content-ttl {
    width: 7rem;
    color: var(--gray-6);
}
main.capacity-list .modal-content .li-content {
    width: calc(100% - 7rem);
}
main.capacity-list .modal-content ul li:first-child .li-content {
    display: flex;
    align-items: center;
    gap:  0 4px;
}
main.capacity-list .modal-content ul li:last-child .li-content {
    color: var(--gray-5);
}
main.capacity-list .modal-content .li-content input[type="text"] {
    width: 4rem;
}

/* table */
main.capacity-list .table-area td[colspan="4"] {
    text-align: center;
}



/******************************************************
ミュージアム
*******************************************************/
/* スケジュール
--------------------------------------- */
.m-cal-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    width: 100%;
    height: 3.6rem;
    background-color: #ffffff;
    border: 0;
    color: var(--main-blue);
    font-weight: 600;
    font-size: 1.2rem;
}
body:not(.mobile) .m-cal-btn {
    border-top: 1px solid var(--gray-2);
}
.m-cal-btn:after {
    content: "";
    display: block;
    width: 1.4rem;
    height: 1.4rem;
    background-image: url(../img/arrow_scroll.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.m-cal-btn.open:after {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
}
.m-cal-area .week-cal .cal-ttl p {
    writing-mode: initial!important;
    color: var(--main-text-color)!important;
    font-weight: 600;
}
button.btn-modal-red-border {
    width: 5.6rem;
    left: 12px;
    font-weight: normal;
    line-height: calc(3rem - 10px);
    padding-top: 0;
    padding-bottom: 0;
}
.m-cal-area .fc-daygrid-day-events {
    margin-bottom: 0!important;
}
.m-cal-area .cal-ttl {
    display: flex;
    justify-content: center;
    align-items: center;
}
.m-cal-area .fc-event-title {
    font-size: 1.2rem;
}
.m-cal-area .fc-event:hover {
    background-color: transparent;
}
.m-cal-area .fc-event:focus {
    box-shadow: none;
}
.m-cal-area .rejected,
.m-cal-area .cancel {
    color: var(--gray-5);
}
.m-cal-area .rejected .fc-daygrid-event-dot,
.m-cal-area .cancel .fc-daygrid-event-dot {
    background-color: var(--gray-5);
}



/* 予約カレンダー
--------------------------------------- */
main.m-cal,
main.m-cal .main-content,
main.m-cal .content-inner {
    min-height: initial !important;
}
main.m-cal {
    background-color: transparent;
    padding-top: 4.8rem;
    padding-right: 0;
    padding-bottom: 0;
}
main.m-cal .main-content {
    height: calc(100% - 4.8rem);
}
main.m-cal:not(.nav-open) {
    padding-right: 0;
    padding-left: 4.8rem;
}
main.m-cal.nav-open {
    padding-left: 220px !important;
}

.m-calendar-area {
    max-width: 100%;
    max-height: calc(100dvh - 9.6rem);
    overflow: auto;
    margin-top: 4.8rem;
}

/* calendar header *********************/
.calendar-header {
    position: fixed;
    top: 4.8rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 4.8rem;
    background-color: #ffffff;
    padding: 0 14px;
    z-index: 210;
}
main.m-cal .calendar-header {
    background-color: #f6f6f6;
    border-bottom: 2px solid var(--gray-1);
}
main:not(.nav-open) .calendar-header {
    width: calc(100% - 4.8rem);
    left: 4.8rem;
}
main.nav-open .calendar-header {
    width: calc(100% - 220px);
    left: 220px;
}
.calendar-header .calendar-func {
    display: flex;
    gap: 12px;
    align-items: center;
    position: unset;
    z-index: 0;
}
.calendar-header .calendar-func .btn.this-month,
.m-cal .btn-today-area button {
    line-height: calc(3rem - 2px);
    padding: 0 8px!important;
}
.calendar-header .cal-func-btn {
    display: flex;
    gap: 0 4px;
    align-items: center;
}
.calendar-header .cal-func-btn button {
    position: relative;
    width: 3.2rem;
    height: 3.2rem;
    border: 0;
    border-radius: 1.6rem;
    background-color: transparent;
    background-image: url(../img/ic_arrow.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: .8rem;
}
.calendar-header .cal-func-btn button:last-child {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
}
.calendar-header .cal-func-btn button span {
    display: none;
}
.calendar-header .select-date {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* 今日ボタン */
.m-cal .btn-today-area {
    border-left: 1px solid var(--gray-1);
    padding-left: 10px;
    margin-left: 2px;
}


/* table *******************************/
main.m-cal table,
main.m-cal td,
main.m-cal td > div,
main.m-cal td .slot-content {
    height: 100%;
}
main.m-cal table {
    min-width: auto;
}
main.m-cal table tr {
    position: relative;
}
main.m-cal table thead {
    position: sticky;
    top: 0;
    z-index: 2;
}
main.m-cal table th {
    position: relative;
    text-align: center;
    font-weight: 600;
    border-top: 0;
    border-width: 2px;
}
main.m-cal table th:first-child {
    border-right: 0;
}
main.m-cal table th:after {
    content: "";
    display: block;
    background-color: var(--gray-1);
    position: absolute;
    width: 100%;
    height: 2px;
    bottom: -2px;
    left: 0;
}
main.m-cal table th:not(.th-time) {
    white-space: nowrap;
    font-size: 1.3rem;
    border-width: 1px;
}
main.m-cal table td {
    font-size: 1.4rem;
    border-bottom-width: 2px;
    padding: 0;
}
main.m-cal table td.number {
    vertical-align: middle;
    text-align: center;
    background-color: #ffffff;
}
main.m-cal table td.td-cancel {
    background-color: #eeeeee;
}
main.m-cal table td:first-child,
main.m-cal table td:nth-child(2),
main.m-cal table td:nth-child(3) {
    background-color: var(--form-bg-color);
}
main.m-cal table td.slot {
    position: relative;
    border-width: 2px;
}
main.m-cal table tr > *:first-child,
main.m-cal table td.memo,
main.m-cal table td.content-name {
    position: sticky;
    z-index: 1;
}
main.m-cal table tr > *:first-child {
    left: 0;
    border-left: 0;
}
main.m-cal table td.memo {
    left: 4.4rem;
}
main.m-cal table td.content-name {
    left: 23.4rem;
}
main.m-cal table td.content-name p {
    font-size: 1.2rem;
}
main.m-cal table th:first-child:before,
main.m-cal table td.date:before,
main.m-cal table td.date:after,
main.m-cal table td.memo:after,
main.m-cal table td.content-name:after {
    content: "";
    display: block;
    width: 1px;
    height: 100%;
    background-color: var(--gray-1);
    position: absolute;
    top: 0;
}
main.m-cal table th:first-child:before,
main.m-cal table td.content-name:after {
    width: 1px;
}
main.m-cal table th:first-child:before,
main.m-cal table td.content-name:after {
    right: -1px;
}
main.m-cal table td.date:after,
main.m-cal table td.memo:after {
    right: -1px;
}
main.m-cal table td.date:before {
    left: -1px;
}
main.m-cal table tr > * p {
    min-height: 2.6rem!important;
    padding: 0!important;
}
main.m-cal table tr > * p:before {
    content: none!important;
}

/* date */
main.m-cal table td.date {
    width: 4.4rem;
    min-width: 4.4rem;
    text-align: center;
}
main.m-cal table td.date p:first-child {
    min-height: initial !important;
    display: block;
    color: var(--gray-6);
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 4px;
}
main.m-cal table td.date p:last-child {
    font-size: 1.6rem;
    font-weight: 600;
}
main.m-cal table td.date p:last-child span {
    font-size: 1.3rem;
    font-weight: 600;
    margin-right: 2px;
}
main.m-cal table td.date.sat p,
main.m-cal table td.date.sat span {
    color: var(--saturday-color);
}
main.m-cal table td.date.sun p,
main.m-cal table td.date.sun span,
main.m-cal table td.date.holiday p,
main.m-cal table td.date.holiday span {
    color: var(--sunday-color);
}

/* pdf button */
main.m-cal td.date button {
    width: 3.6rem;
    font-size: 1.2rem;
    padding: 1px 4px;
    margin-top: 4px;
}

/* memo */
main.m-cal td.memo {
    width: 19rem;
    min-width: 19rem;
    height: 100%;
    vertical-align: top;
    padding: 2px 4px;
}
main.m-cal td.memo p {
    height: 11rem;
    font-size: 1.2rem;
    white-space: break-spaces;
    overflow-y: auto;
}
main.m-cal td.memo textarea {
    height: calc((100% - 2.8rem) - 4px);
}
main.m-cal td.memo button {
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 1.3rem;
    background-color: var(--form-bg-color);
    margin-top: 4px;
    margin-right: 0;
}
main.m-cal tr.today td.memo button {
    background-color: var(--pale-yellow-1);
}
main.m-cal td.memo button .ic {
    mask-size: 1.4rem;
    -webkit-mask-size: 1.4rem;
}
main.m-cal .btn-area {
    justify-content: flex-end;
}
main.m-cal .btn-area button {
    margin: 0;
}

/* content title, slot */
main.m-cal td.content-name:before,
main.m-cal .slot > div:before,
main.m-cal .slot > div:after {
    content: "";
    display: block;
    height: calc(100% - 2.4rem);
    position: absolute;
    z-index: 0;
}
main.m-cal td.content-name:before,
main.m-cal .slot > div:before {
    width: 100%;
    top: 1.2rem;
    left: 0;
    background-image: url(../img/border_dot1.svg);
    background-repeat: repeat space;
    background-size:  .4rem 2.4rem;
}
main.m-cal .slot > div:after {
    width: calc(100% - 2.6rem);
    top: 0;
    left: 2.6rem;
    background-image: url(../img/border_dot2.svg);
    background-size: 5.2rem .2rem;
}
main.m-cal td.content-name p:last-child,
main.m-cal table td.slot .slot-bottom p {
    border-bottom: 0;
}
main.m-cal td.content-name {
    width: 4.8rem;
    min-width: 4.8rem;
    white-space: nowrap;
}
main.m-cal .slot > div {
    min-width: 15.6rem;
    height: 100%;
}
main.m-cal .slot-top {
    height: calc((100%/6)*5);
    position: relative;
    display: flex;
    align-items: flex-start;
}
main.m-cal .slot-content {
    position: relative;
}

main.m-cal td.content-name p,
main.m-cal td.slot p {
    align-content: center;
    line-height: 2.4rem;
    min-height: 2.4rem!important;
    text-align: center;
    font-size: 1.3rem;
}
main.m-cal td.slot p {
    width: 5.2rem;
    min-width: 5.2rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
main.m-cal .slot-bottom {
    width: 100%;
    height: calc(100%/6);
    display: flex;
    align-items: center;
    justify-content: space-between;
}
main.m-cal .slot-bottom p {
    border-bottom: 0;
}
.ic-circle {
    display: block;
    width: 1.4rem;
    height: 1.4rem;
    border: 1px solid #333333;
    border-radius: .7rem;
}
td .ic-circle {
    margin: 0 auto;
}

/* today */
main.m-cal .today td:not(.slot),
main.m-cal .today .slot:not(.pink):not(.blue):not(.green):not(.gray):before {
    background-color: var(--pale-yellow-1) !important;
}

/* 貸切 */
:has(.slot-content).slot.gray {
    background-color: unset!important;
}
:has(.slot-content).slot.gray:before {
    z-index: -1;
}

/* color */
.slot:before,
.slot-content:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.slot.gray:before {
    z-index: 0;
}
.slot:not(.pink):not(.blue):not(.green):not(.gray):before {
    background-color: #ffffff !important;
}
.slot.pink:before,
.slot-content.pink:before {
    background-color: #fce5ed !important;
}
.slot.blue:before,
.slot-content.blue:before,
main.m-cal table th.th-fs {
    background-color: #deeff8 !important;
}
.slot.green:before,
.slot-content.green:before {
    background-color: #c1e9b6 !important;
}
.slot.gray:before {
    background-color: #d3d3d3!important;
}
.slot-content.yellow:before {
    background-color: #fff5a7 !important;
}
.slot-content > p.yellow {
    background-color: #fff5a7;
}
.slot-bottom p.yellow {
    background-color: var(--yellow-1) !important;
}
.slot-content.kari p:nth-child(5) {
    color: var(--red) !important;
}
.slot-content:not(.kari) p:nth-child(5) {
    background-image: url(../img/ic_check_g.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.6rem;
}
main.m-cal table th.orange,
.slot-content > p.orange {
    background-color: #ffc281;
}
main.m-cal table th.purple,
.slot-content > p.purple {
    background-color: #d4a6e6;
}
main.m-cal table th.red,
.slot-content > p.red {
    background-color: #fbb1b1 !important;
}
main.m-cal table th.th-cancel {
    background-color: var(--gray-3);
}

/* modal */
main.m-cal .modal-content {
    width: 60rem;
    height: auto;
}

/* その他 */
.mus-hol {
    pointer-events:none;
}


/* ミュージアム仮予約
--------------------------------------- */
/* 詳細 *********************************/
.m-plan .main-content .slot-ttl {
    display: flex;
    align-items: center;
    gap: 4px;
    border-bottom: 1px solid var(--gray-1);
    padding-bottom: 6px;
    margin-bottom: 1rem;
}
.mobile .m-plan .main-content .slot-ttl {
    align-items: flex-end;
    justify-content: space-between;
}
.m-plan .main-content .slot-ttl .date-time {
    font-size: 1.6rem;
    font-weight: 600;
    white-space: nowrap;
    color: var(--main-blue);
}
.m-plan .main-content .slot-label {
    display: inline-block;
    font-size: 1.2rem;
    color: #ffffff;
    padding: 2px 6px;
}
.m-plan .main-content .slot-label.pink {
    background-color: var(--museum-pink);
}
.m-plan .main-content .slot-label.blue {
    background-color: var(--museum-blue);
}
.m-plan .main-content .slot-label.green {
    background-color: var(--museum-green);
}
.m-plan .main-content .slot-label.gray {
    background-color: var(--gray-5);
}
.m-plan .main-content .capacity {
    text-align: right;
    font-size: 1.3rem;
    color: var(--gray-6);
}
.m-plan.add-edit .li-guest-name .form-content {
    display: flex;
    gap: .6rem;
}

/* 人数 */
.m-plan .li-num-of-ppl .form-content > p {
    text-align: right;
    font-size: 1.3rem;
    margin-bottom: 6px;
}
.m-plan .li-num-of-ppl .form-content p {
    white-space: nowrap;
}
.m-plan .li-num-of-ppl .form-content > ul > li,
.m-plan .li-num-of-ppl .form-content > ul > li > .li-content,
.m-plan .li-num-of-ppl .form-content > ul > li > .li-content p {
    display: flex;
    align-items: center;
}
.m-plan .li-num-of-ppl .form-content > ul > li {
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 6px;
}
.m-plan .li-num-of-ppl .form-content > ul > li > .li-content {
    justify-content: flex-end;
    margin-left: auto;
}
.m-plan .li-num-of-ppl .form-content > ul > li > .li-ttl {
    font-size: 1.4rem;
}
.m-plan .li-num-of-ppl .form-content > ul > li > .li-content p:first-child {
    gap: .4rem;
}
.m-plan .li-num-of-ppl .form-content > ul > li > .li-content p:last-child {
    gap: .2rem;
    width: 8.6rem;
}
.m-plan .li-num-of-ppl .form-content > ul > li:nth-last-child(2) {
    margin-bottom: .8rem;
}
.m-plan .li-num-of-ppl .form-content > ul > li.total {
    border-top: 1px dashed var(--gray-1);
    padding-top: .6rem;
}
.m-plan .li-num-of-ppl .form-content > ul > li.total p:last-child {
    margin-right: 8.6rem;
    margin-left: auto;
}
.m-plan .li-num-of-ppl .form-content > ul > li.total p:last-child span {
    font-size: 1.5rem;
    font-weight: 600;
    margin-right: 1rem;
}
.m-plan .li-num-of-ppl .form-content input[type="text"] {
    width: 4rem;
    text-align: right;
}

/* 営業 */
.m-plan .li-sales-name .form-content {
    min-height: 3.6rem;
    display: flex;
    align-items: center;
}

/* 予約リスト */
.m-plan.detail .rsv-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(24rem, 1fr));
    gap: 10px;
    align-items: stretch;
}
.m-plan.detail .rsv-list > li {
    max-width: 100%;
    border: 1px solid var(--gray-1);
    border-radius: 8px;
    padding: 6px 10px;
}
.m-plan.detail .rsv-list > li.pink {
    border-left: 5px solid var(--museum-pink);
}
.m-plan.detail .rsv-list > li.blue {
    border-left: 5px solid var(--museum-blue);
}
.m-plan.detail .rsv-list > li.green {
    border-left: 5px solid var(--museum-green);
}
.m-plan.detail .rsv-list > li.yellow {
    border-left: 5px solid var(--yellow-1);
}
.m-plan.detail .rsv-list .top-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 2.8rem;
    margin-top: -.2rem;
    margin-bottom: 4px;
}
.m-plan.detail .rsv-list .rsv-label {
    font-size: 1.3rem;
    font-weight: 600;
}
.m-plan.detail .rsv-list .rsv-label.unapproved {
    color: var(--red);
    font-weight: 600;
}
.m-plan.detail .rsv-list .rsv-label.approved {
    color: var(--lightgreen);
    border-color: var(--lightgreen);
}
.m-plan.detail .rsv-list .rsv-label.rejected,
.m-plan.detail .rsv-list .rsv-label.cancel {
    color: var(--gray-5);
    border-color: var(--gray-5);
}
.m-plan.detail .rsv-list .rsv-label.cancel {
    color: var(--gray-5);
}
.m-plan.detail .rsv-list > li .guest-name {
    font-weight: 600;
    font-size: 1.6rem;
    margin-bottom: 8px;
}
.m-plan.detail .rsv-list > li > p span {
    font-size: 1.3rem;
    color: var(--gray-6);
    margin-left: 4px;
}
.m-plan.detail .rsv-list > li li {
    display: flex;
    margin-bottom: 2px;
}
.m-plan.detail .rsv-list > li .li-ttl {
    width: 4.6rem;
    font-size: 1.35rem;
    color: var(--gray-6);
    line-height: 1.8;
}
.m-plan.detail .rsv-list > li .li-content {
    width: calc(100% - 4.6rem);
    line-height: 1.5;
}
.m-plan.detail .rsv-list .ic-btn.edit {
    background-color: transparent;
}
.m-plan.detail .li-add {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--gray-1);
}
.m-plan.detail .li-add .ic {
    display: block;
    width: 2rem;
    height: 2rem;
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: contain;
    -webkit-mask-size: contain;
    background-color: var(--main-orange);
}

/* error message */
.m-plan.detail .err-msg {
    font-size: 1.3rem;
    margin-bottom: 1rem;
}

/* 登録/編集 *****************************/
.m-plan.add-edit .form-content .date-time {
    font-weight: 600;
    color: var(--main-blue);
    line-height: 3.6rem;
    white-space: nowrap;
}


/* ミュージアム共通
--------------------------------------- */
main.museum .select-box,
main.museum input[type="text"],
main.museum input[type="date"],
main.museum input[type="month"],
main.museum input[type="time"] {
    height: 3rem;
}
main.museum input[type="text"] {
    max-width: 100%;
}
main.museum input[type="time"] {
    width: auto;
}
main.museum select {
    line-height: calc(3rem - 9px);
}
main.museum .main-content,
main.museum .main-content > form {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}
main.museum .content-ttl {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}
main.museum .content-ttl.u-line {
    padding-bottom: 4px;
    border-bottom: 1px solid var(--gray-1);
}
main.museum .content-ttl p {
    font-size: 1.6rem;
    font-weight: 600;
}
main.museum .content-form {
    border: 1px solid var(--gray-1);
    background-color: #ffffff;
    padding: 8px 14px 4px;
}
main.museum .content-form ul:not(.note-small) {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    width: 100%;
}
main.museum .content-form ul:not(.note-small) li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .8rem;
    width: calc(50% - 8px);
    border-bottom: 1px solid var(--gray-2);
}
main.museum[class*="detail"] .content-form ul li {
    padding-bottom: 2px;
}
main.museum[class*="edit"] .content-form ul li {
    padding-bottom: 4px;
}
main.museum .content-form ul li p {
    line-height: 1.4;
}
main.museum .content-form ul .li-content {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
main.museum .page-header .btn-area > div,
main.museum .btn-area-bottom > div {
    display: flex;
    border-left: 1px solid var(--gray-1);
    padding-left: 10px;
}
main.museum .page-header .btn-area > div button:not(:first-child),
main.museum .btn-area-bottom > div button:not(:first-child) {
    margin-left: 8px;
}

/* no data */
main.museum .no-data {
    color: var(--gray-6);
}
main.museum .content-form .no-data {
    margin-top: -4px;
}
main.museum .content.note .no-data {
    margin-bottom: -4px;
}


/* 予約枠詳細
--------------------------------------- */
/* 予約枠概要 *****************************/
main.museum .content-ttl.date-time p {
    color: var(--main-blue);
}
main.museum .content.slot-overview ul li {
    width: calc((100% - 32px)/3);
}
main.museum .content.slot-overview ul li:last-child {
    width: 100%;
}
main.museum .content.slot-overview .li-ttl {
    width: 8.6rem;
}
main.museum .content.slot-overview .li-content {
    width: calc(100% - (8.6rem + 16px));
}
main.museum .content.slot-overview ul li.type input[type="text"] {
    width: 4.4rem;
    text-align: right;
}
main.museum .content.slot-overview ul li.type div:last-child {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* color */
.slot-overview .content-form {
    position: relative;
}
.slot-overview .content-form:before {
    content: "";
    display: block;
    width: 5px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -1px;
}
.slot-overview .content-form.pink:before {
    background-color: var(--museum-pink);
}
.slot-overview .content-form.blue:before {
    background-color: var(--museum-blue);
}
.slot-overview .content-form.green:before {
    background-color: var(--museum-green);
}
.slot-overview .content-form.gray:before {
    background-color: var(--gray-5);
}

/* 予約者情報 *****************************/
.museum .guest-info-area {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.museum .guest-info-box {
    background-color: #ffffff;
    border: 1px solid var(--gray-1);
    border-radius: 8px;
    padding: 8px 10px;
}
.museum .guest-info-box:not(.guest-add-area .guest-info-box),
.museum .guest-add-area {
    width: calc((100% - 30px)/4);
    max-width: 33rem;
    min-width: 22rem;
    min-height: 26rem;
}
.museum .guest-info-box > form {
    height: 100%;
}

@media screen and (max-width: 1024px) {
    .museum .guest-info-box {
        width: calc((100% - 20px)/3);
    }
}
@media screen and (max-width: 820px) {
    .museum .guest-info-box {
        width: calc((100% - 10px)/2);
    }
}

/* top */
.museum .guest-info-top {
    height: 3.8rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--gray-2);
    margin-bottom: 8px;
}
.museum .guest-info-top .guest-name {
    width: calc(100% - (5rem + 8px));
}
.museum .guest-info-top .guest-name p {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.museum .guest-info-top .guest-name p:first-child {
    font-size: 1rem;
}
.museum .guest-info-top .guest-name p:last-child {
    font-weight: 600;
}
.museum .guest-info-top .guest-name p:last-child span {
    font-size: 1.3rem;
    margin-left: 4px;
}
.museum .guest-info-top .text-btn {
    width: 5.6rem;
    height: 2.8rem;
    flex-direction: row-reverse;
    font-weight: 600;
    white-space: nowrap;
}
.museum .guest-info-top .text-btn:before {
    border-width: .15rem;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
}

/* bottom */
.museum .guest-info-bottom {
    height: calc(100% - (3.8rem + 8px));
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.museum .guest-info-bottom ul li {
    display: flex;
    align-items: center;
    gap: 0 8px;
    margin-bottom: 3px;
}
.museum .guest-info-bottom ul li:not(:first-child),
.museum .guest-info-box.green li:first-child {
    border-bottom: 1px dotted var(--gray-2);
    padding-bottom: 2px;
}
.museum .guest-info-bottom ul li:last-child {
    border-bottom-style: solid;
    margin-bottom: 6px;
}
.museum .guest-info-bottom ul .li-ttl {
    width: 8rem;
    font-size: 1.2rem;
}
.museum .guest-info-bottom ul .li-content {
    width: calc((100% - 8px) - 8rem);
    font-size: 1.4rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.museum .guest-info-bottom ul .li-content.bikou {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
    white-space: unset;
}
.museum .guest-info-bottom .btn-area {
    display: flex;
    align-items: center;
}
.museum .guest-info-bottom .btn-area button {
    flex-grow: 1;
    border: 1px solid;
    font-weight: 600;
}
.museum .guest-info-bottom .btn-area button:disabled {
    border-color: var(--gray-5) !important;
    color: initial !important;
    background-color: #dddddd !important;
}
.museum .guest-info-bottom .btn-area .btn.approve {
    border-color: var(--lightgreen);
    color: var(--lightgreen);
    background-color: #f1faef;
}
.museum .guest-info-bottom .btn-area .btn.reject {
    border-color: var(--red);
    color: var(--red);
    background-color: #fff5f4;
}
.museum .guest-info-box p.approved,
.museum .guest-info-box p.rejected,
.museum .guest-info-box p.cancel,
.museum .guest-info-box p.unapproved {
    width: 100%;
    text-align: center;
    font-weight: 600;
    padding: 4px 0;
}
.museum .guest-info-box p.approved {
    color: var(--lightgreen);
}
.museum .guest-info-box p.rejected {
    color: var(--red);
}
.museum .guest-info-box p.cancel {
    color: var(--gray-5);
}
.museum .guest-info-box p.unapproved {
    color: var(--gray-6);
}
.museum .guest-info-bottom li.no-hs {
    width: 100%;
    color: var(--red);
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 600;
    background-color: #faeaea;
    padding: 2px;
    margin-bottom: 8px;
}

/* 新規作成 */
.museum .guest-add-area {
    min-height: 20rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.museum .guest-info-box.add {
    display: flex;
    align-items: center;
    justify-content: center;
    height: calc(68% - .6rem);
    width: 100%;
    min-height: auto;
}
.museum .guest-info-box.add:before {
    content: "";
    display: block;
    width: 3rem;
    height: 3rem;
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: contain;
    -webkit-mask-size: contain;
    background-color: var(--main-orange);
}
.museum .guest-info-box.green-guest-add {
    gap: 6px;
    height: calc(32% - .6rem);
    border-left: 5px solid var(--museum-green);
}
.museum .guest-info-box.green-guest-add:before {
    background-color: var(--museum-green);
    mask-size: 2rem;
    -webkit-mask-size: 2rem;
}

/* color */
.museum .guest-info-area.pink .guest-info-box:not(.green-guest-add) {
    border-left: 5px solid var(--museum-pink);
}
.museum .guest-info-box.pink {
    border-left: 5px solid var(--museum-pink)!important;
}
.museum .guest-info-area.blue .guest-info-box {
    border-left: 5px solid var(--museum-blue);
}
.museum .guest-info-box.blue {
    border-left: 5px solid var(--museum-blue)!important;
}
.museum .guest-info-box.yellow {
    border-left: 5px solid var(--yellow-1)!important;
}
.museum .guest-info-box.green {
    border-left: 5px solid var(--museum-green)!important;
}

/* 案内希望箇所・説明箇所一覧 ****************/
.museum.calendar-detail .guide-tbl {
    min-width: auto;
}
.museum.calendar-detail .guide-list table td.select-row {
    background-color: var(--form-bg-color);
}
.museum.calendar-detail .guide-list table td {
    vertical-align: middle;
}
.museum.calendar-detail .guide-list table td * {
    display: block;
    margin: 0 auto;
}


/* 予約者情報詳細/編集
--------------------------------------- */
.museum[class*="guest-info"]:before {
    content: "";
    display: block;
    width: 0;
    border-left: 2px solid;
    position: absolute;
    left: calc(4.8rem + 19px);
}
.museum[class*="guest-info"].nav-open:before {
    left: 240px;
}
.museum.guest-info-detail:before {
    top: calc(4.8rem + 42px);
    height: calc(100% - (4.8rem + 22px) - 40px);
}
.museum.guest-info-edit:before {
    top: calc(4.8rem + 22px);
    height: calc(100% - (4.8rem + 22px) - 20px);
}
.museum[class*="guest-info"].pink:before {
    border-color: var(--museum-pink);
}
.museum[class*="guest-info"].blue:before {
    border-color: var(--museum-blue);
}
.museum[class*="guest-info"].yellow:before {
    border-color: var(--yellow-1);
}
.museum[class*="guest-info"].green:before {
    border-color: var(--museum-green);
}
.museum[class*="guest-info"] .main-content,
.museum[class*="guest-info"] .page-header {
    margin-left: 10px;
}
.museum[class*="guest-info"] .sub-info,
.museum[class*="guest-info"] .content-form:not(:last-child) {
    margin-bottom: 10px;
}
.museum[class*="guest-info"] .sub-info + .tour-info {
    margin-top: -3.8rem;
}
.museum[class*="guest-info"] .tour-info ul li,
.museum[class*="guest-info"] .status .li-status,
.museum[class*="guest-info"] .guest-info .li-address,
.museum[class*="guest-info"] .guest-info .li-family,
.museum[class*="guest-info"] .guest-info .li-tel,
.museum.guest-info-edit .li-rival,
.museum[class*="guest-info"] .li-prop-content,
.museum[class*="guest-info"] .proposal .li-facility,
.museum[class*="guest-info"] .li-const-type,
.museum[class*="guest-info"] .li-fs-type {
    width: 100%;
}
.museum[class*="guest-"] .content-form:not(.sub-info) .li-ttl {
    width: 15rem;
}
.museum[class*="guest-"] .content-form:not(.sub-info) > ul > li:not(.li-coming-time, .li-tour-time) > .li-content {
    width: calc(100% - 17rem);
}

@media screen and (max-width: 820px) {
    .museum[class*="guest-"] .content .content-form:not(.sub-info) .li-ttl {
        width: 11rem;
    }
    .museum[class*="guest-"] .content .content-form:not(.sub-info) > ul > li > .li-content {
        width: calc(100% - 11rem);
    }
    .museum[class*="guest-"] .status .content-form .li-ttl {
        width: 8rem;
    }
    .museum[class*="guest-"] .status .content-form:not(.sub-info) > ul > li > .li-content {
        width: calc(100% - 8rem);
    }
}
@media screen and (max-width: 768px) {
    .museum[class*="guest-"] .status .content-form .li-ttl {
        width: 8rem !important;
    }
    .museum[class*="guest-"] .status .content-form:not(.sub-info) > ul > li > .li-content {
        width: calc(100% - 8rem) !important;
    }
}

.museum[class*="guest-info"] .page-header {
    gap: .8rem 0;
    flex-wrap: wrap;
    height: auto;
    min-height: 3.8rem;
    border-bottom: 1px solid var(--gray-1);
    padding-bottom: 6px;
    margin-top: 10px;
    position: relative;
}
.museum.guest-info-detail .page-header {
    justify-content: flex-start;
}
.museum.guest-info-edit .page-header {
    align-items: center;
    gap: 1rem;
    width: 100%;
    background-color: #f6f6f6;
    margin-top: 0;
    margin-right: 1rem;
    position: sticky;
    top: calc(4.8rem + 22px);
    z-index: 210;
    container-type: inline-size;
}
.museum.guest-info-edit .page-header:before {
    content: "";
    display: block;
    width: 100%;
    height: 22px;
    background-color: #f6f6f6;
    position: absolute;
    top: -22px;
    left: 0;
}
.museum.guest-info-detail .page-header > p {
    display: flex;
    align-items: center;
}
.museum[class*="guest-info"] .page-header-content {
    flex-wrap: wrap 
}
.museum.guest-info-detail .page-header-content {
    gap: 6px;
}
.museum.guest-info-detail .page-header-content.text-in + .status-area {
    width: 100%;
    order: 2;
}
.museum.guest-info-detail .page-header-content.moji .page-haeder {
    margin-right: 4rem;
}
.museum[class*="guest-info"] .page-header .btn-area {
    margin-left: auto;
}

/* edit content */
.museum.guest-info-edit .edit-content {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: .4rem 1rem;
    align-items: center;
    justify-content: space-between;
}

/* status */
.museum[class*="guest-info"] .status-area {
    display: flex;
}
.museum.guest-info-edit .status-area,
.museum.guest-info-edit .contract-month {
    align-items: center;
    gap: .4rem 1rem;
    border: 1px solid var(--gray-1);
    background-color: #ffffff;
    padding: .3rem .4rem .3rem .8rem;
}
.museum.guest-info-detail .status-area {
    align-items: flex-start;
    gap: .4rem 1rem;
}
.museum.guest-info-edit .status-area .radio-btn-area {
    flex-wrap: nowrap;
}
.museum.guest-info-edit .status-area input[type="text"] {
    width: 36rem;
}
@media screen and (max-width: 768px) {
    .museum.guest-info-edit .status-area {
        width: 100%;
    }
    .museum.guest-info-edit .status-area input[type="text"] {
        width: auto;
        flex: 1;
    }
}

.museum.guest-info-edit .status-area label span {
    font-weight: 600;
}
.museum[class*="guest-info"] .status-label.approved,
.museum.guest-info-edit .status-area .approved + span {
    color: var(--lightgreen);
}
.museum[class*="guest-info"] .status-label.approved {
    border-color: var(--lightgreen);
}
.museum[class*="guest-info"] .status-label.rejected,
.museum.guest-info-edit .status-area .rejected + span {
    color: var(--red);
}
.museum[class*="guest-info"] .status-label.rejected {
    border-color: var(--red);
}
.museum[class*="guest-info"] .status-label.unapproved,
.museum[class*="guest-info"] .status-label.cancel,
.museum.guest-info-edit .status-area .unapproved + span {
    color: var(--gray-6);
}
.museum[class*="guest-info"] .status-label.unapproved,
.museum[class*="guest-info"] .status-label.cancel {
    border-color: var(--gray-5);
}
.museum.guest-info-edit .status-area label:has(input[type="radio"]:disabled) {
    filter: brightness(.85);
}
.museum.guest-info-edit .status-area label:has(input[type="radio"]:disabled) span {
    color: var(--gray-4);
}
.museum[class*="guest-info"] .status-label {
    display: flex;
    align-items: center;
    height: 2.4rem;
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid;
    padding: .2rem .8rem;
}
.museum[class*="guest-info"] .status-label {
    margin-left: 0;
    margin-right: 0;
}
.museum.guest-info-detail .bikou {
    font-size: 1.3rem;
    font-weight: normal;
    margin-top: .3rem;
    margin-right: 0;
}

/* contract month */
.museum.guest-info-detail .contract-month,
.museum.guest-info-edit .page-header-content + .contract-month {
    color: var(--red);
    font-size: 1.4rem;
    font-weight: 600;
    background-color: transparent;
    padding: 0;
    margin-right: 2rem;
    margin-left: 0;
}
.museum.guest-info-edit .contract-month {
    display: flex;
    border: 0;
    background-color: #dee4e7;
    margin-left: auto;
}
.museum.guest-info-edit .contract-month .li-ttl {
    color: var(--main-text-color);
    margin-right: 0;
}
.museum.guest-info-edit .contract-month > p {
    font-weight: normal;
}


/* ツアー情報 ****************************/
.museum.guest-info-edit .tour-info .input-number {
    width: 4.6rem;
}
.museum[class*="guest-info"] .tour-info ul .li-tour-date p {
    white-space: nowrap;
}

/* sub info */
.museum[class*="guest-info"] .sub-info {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
}
.museum[class*="guest-info"] .sub-info .note-small-area {
    width: calc(50% - 8px);
    min-width: calc(36rem + 16px);
    margin-left: auto
}
.museum[class*="guest-info"] .sub-info ul:first-of-type,
.museum[class*="guest-info"] .sub-info ul:not(:first-of-type) li {
    width: calc((100% - 48px)/4) !important;
    min-width: 18rem;
}
.museum[class*="guest-info"] .sub-info ul:nth-of-type(2) {
    width: calc(100% - ((100% - 48px)/4) - 16px);
}
.museum[class*="guest-info"] .sub-info ul:first-of-type,
.museum[class*="guest-info"] .sub-info ul:nth-of-type(2),
.museum[class*="guest-info"] .sub-info ul:nth-of-type(2) li {
    flex-grow: 1;
}
.museum[class*="guest-info"] .sub-info ul:first-of-type li {
    width: 100%;
}
.museum[class*="guest-info"] .sub-info ul:last-of-type input[type="text"] {
    min-width: 10rem;
    max-width: 13rem;
}
.museum[class*="guest-info"] .sub-info .li-ttl {
    width: 6rem;
}
.museum[class*="guest-info"] .sub-info .li-content {
    width: calc((100% - 6rem) - 1.6rem);
    gap: 0;
}
.museum[class*="guest-info"] .sub-info ul:last-of-type {
    justify-content: flex-end;
    margin-top: 1rem;
}
@media screen and (max-width: 1024px) {
    .museum[class*="guest-info"] .sub-info ul:first-child li:first-child {
        width: 100% !important;
    }
    .museum[class*="guest-info"] .sub-info ul:first-child li:not(:first-child) {
        width: calc((100% - 32px)/3) !important;
    }
}

/* tour info */
.museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul {
    display: grid !important;
    grid-template-columns:  1fr 1fr;
    align-items: flex-end;
}
.museum[class*="guest-info-2"] .tour-info ul {
    display: flex;;
    flex-wrap: wrap;
}
.museum[class*="guest-info"] .tour-info ul > li {
    width: 100% !important;
}
.museum[class*="guest-info-2"] .tour-info ul > li:not(:first-child, .li-guest-name) {
    width: calc(50% - 8px) !important;
}
.museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-guest-name {
    grid-column: 1/3;
    grid-row: 1/2;
}
.museum[class*="guest-info"] .tour-info ul .li-renmei {
    grid-column: 1/3;
    grid-row: 2/3;
}
.museum[class*="guest-info"] .tour-info ul .li-tour-date {
    grid-column: 1/2;
    grid-row: 3/4;
}
.museum[class*="guest-info"] .tour-info ul .li-tour-time {
    grid-column: 1/2;
    grid-row: 4/5;
}
.museum[class*="guest-info"] .tour-info ul .li-coming-time {
    grid-column: 1/2;
    grid-row: 5/6;
}
.museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-accompany {
    grid-column: 1/2;
    grid-row: 6/7;
}
.museum[class*="guest-info"] .tour-info ul .li-meeting {
    grid-column: 1/3;
    grid-row: 7/8;
}
.museum[class*="guest-info"] .tour-info ul .li-number-of-ppl {
    grid-column: 2/3;
    grid-row: 3/6;
}
.museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-participant {
    grid-column: 2/3;
    grid-row: 6/7;
}
.museum[class*="guest-info"] .li-bikou {
    grid-column: 1/3;
    grid-row: 8/9;
}
@media screen and (max-width: 1164px) {
    .museum[class*="guest-info"] .tour-info ul .li-tour-date {
        grid-column: 1/3;
        grid-row: 3/4;
    }
    .museum[class*="guest-info"] .tour-info ul .li-tour-time {
        grid-column: 1/2;
        grid-row: 4/5;
    }
    .museum[class*="guest-info"] .tour-info ul .li-coming-time {
        grid-column: 2/3;
        grid-row: 4/5;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-accompany {
        grid-column: 1/3;
        grid-row: 5/6;
    }
    .museum[class*="guest-info"] .tour-info ul .li-meeting {
        grid-column: 1/3;
        grid-row: 6/7;
    }
    .museum[class*="guest-info"] .tour-info ul .li-number-of-ppl {
        grid-column: 1/3;
        grid-row: 7/8;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-participant {
        grid-column: 1/3;
        grid-row: 8/9;
    }
    .museum[class*="guest-info"] .tour-info ul .li-bikou {
        grid-column: 1/3;
        grid-row: 9/10;
    }
}

/* tour info - お客様名 */
.museum.guest-info-detail .tour-info ul .li-guest-name .li-content p {
    font-weight: 600;
    font-size: 1.6rem;
}
.museum.guest-info-detail .tour-info ul .li-guest-name .li-content span {
    font-weight: 600;
    font-size: 1.4rem;
}
.museum.guest-info-edit .tour-info ul .li-guest-name p {
    display: flex;
    align-items: center;
    gap: 8px;
}
.museum.guest-info-edit .tour-info ul .li-renmei input[type="text"] {
    max-width: calc(32rem + 8px)
}
.museum[class*="guest-info-2"] .tour-info .li-guest-name input[type="text"] {
    flex-grow: 1;
    width: auto;
    min-width: 22rem;
}

/* tour info -  来場予定人数 */
.museum[class*="guest-info"] .tour-info table th,
.museum[class*="guest-info"] .tour-info table td {
    border: 0;
    background-color: transparent;
    white-space: nowrap;
}
.museum[class*="guest-info"] .tour-info table tr:not(:last-child) th,
.museum[class*="guest-info"] .tour-info table tr:not(:last-child) td {
    border-bottom: 1px dashed var(--gray-2);
}
.museum[class*="guest-info"] .li-number-of-ppl td {
    padding-right: 0;
    padding-left: 0;
}
.museum[class*="guest-info"] .tour-info table th:last-child {
    font-size: 1.3rem;
}
.museum[class*="guest-info"] .tour-info ul .li-number-of-ppl th span,
.museum[class*="guest-info"] .tour-info ul .li-participant span {
    font-size: 1.3rem;
}
.museum.guest-info-detail .tour-info ul .li-number-of-ppl span.number {
    font-size: 1.6rem;
    margin: 0 4px;
}
.museum.guest-info-edit .tour-info ul .li-number-of-ppl .input-number {
    margin: 0 8px;
}

/* tour info -  ツアー参加人数 */
.museum.guest-info-edit .li-participant .li-content p {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.museum[class*="guest-info-2"] .tour-info .li-participant input[type="text"] {
    width: 4.6rem;
}

/* tour info - note */
.sub-info .note-small {
    margin-bottom: .4rem;
}


/* 施設利用について **********************/
.museum .room .input-number {
    width: 6rem;
}

/* お客様情報 ************************/
.guest-info-edit .guest-info .content-ttl {
    align-items: flex-end;
}
.guest-info-edit .guest-info .content-ttl p:first-child {
    width: 100%;
}
.guest-info-edit .guest-info .content-ttl .note-small {
    max-width: calc(100% - (10rem + 24px));
}
.museum[class*="guest-info"] .btn.get-guest-info {
    width: calc(8.6rem + 24px);
}
.museum[class*="guest-info"] .btn.get-guest-info,
.museum[class*="guest-info"] .btn.get-address {
    background-color: var(--form-bg-color);
}
.museum[class*="guest-info"]:not([class*="guest-info-2"]) .guest-info .li-guest-name input[type="text"] {
    width: 15rem;
}
.museum .guest-info .li-code input[type="text"] {
    width: 12rem;
}
.museum[class*="guest-info"] .guest-info .zipcode {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}
#message-address {
    font-size: 1.2rem;
    width: 100%;
}
.museum[class*="guest-info"] .zipcode input[type="text"] {
    width: 14rem;
}

/* 家族構成 */
.museum[class*="guest-info"] .guest-info .li-family .li-content {
    gap: 4px;
    overflow-x: auto;
}
.museum[class*="guest-info"] .guest-info .li-family table {
    white-space: nowrap;
}
.museum[class*="guest-info"] .guest-info .li-family table th {
    text-align: center;
}
.museum.guest-info-edit .guest-info .li-family table th:nth-child(2) {
    min-width: 40rem;
}
.museum.guest-info-edit .guest-info .li-family td {
    padding: 6px 8px 8px;
}
.museum.guest-info-edit .guest-info .li-family td li:not(.li-guest-name),
.museum.guest-info-edit .guest-info .li-family td .li-ttl,
.museum.guest-info-edit .guest-info .li-family td .li-content {
    width: auto;
}
.museum.guest-info-edit .guest-info .li-family td li {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    border-bottom: 0;
    padding-bottom: 0;
}
.museum.guest-info-edit .guest-info .li-family td p {
    padding-bottom: 0;
}
.museum.guest-info-edit .guest-info .li-family td p:before {
    content: none;
}
.museum.guest-info-edit .guest-info .li-family  table td input[type="checkbox"] {
    display: block;
    margin: 0 auto;
}
.museum.guest-info-edit .guest-info .li-family td .li-ttl {
    min-height: initial;
    font-size: 1.2rem;
    padding-bottom: 0;
    margin-right: 8px;
    margin-bottom: 2px;
}
.museum.guest-info-edit .guest-info .li-family ul:first-child {
    width: 100%;
    border-bottom: 1px dotted var(--gray-1);
    padding-bottom: 6px;
    margin-bottom: 6px;
}
.museum.guest-info-edit .guest-info .li-family .li-guest-name {
    width: auto;
}
.museum.guest-info-edit .guest-info .li-family .li-guest-name .li-content {
    flex-direction: row;
    gap: 4px;
}
.museum.guest-info-edit .guest-info .li-family .li-guest-name .li-content > div {
    display: flex;
    align-items: center;
    gap: 4px;
}
.museum.guest-info-edit .guest-info .li-family input,
.museum.guest-info-edit .guest-info .li-family .select-box {
    height: 2.8rem;
    font-size: 1.4rem;
}
.museum.guest-info-edit .guest-info .li-family .li-age .input-number {
    width: 6rem;
}
.museum.guest-info-edit .guest-info .li-family .li-company input[type="text"],
.museum.guest-info-edit .guest-info .li-family .li-hobby input[type="text"] {
    width: 33rem;
}
.museum.guest-info-edit .guest-info .li-family  .ic-btn.add {
    width: 2.8rem;
    height: 2.8rem;
    margin-right: auto;
}
.li-family .ic-btn .caption {
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: 3rem;
}

/* お客様発掘 */
.syoukai-other p {
    display: flex;
    align-items: center;
    gap: .4rem;
}
.syoukai-other input[type="text"] {
    width: 15rem;
}

/* deleted */
.museum.guest-info-edit .guest-info .li-family tr.deleted td {
    background-color: rgba(0, 0, 0, .14);
}
.museum.guest-info-edit .guest-info .li-family tr.deleted td:not(:last-child) > * {
    opacity: .5;
    filter: brightness(.86);
}
.museum.guest-info-edit .guest-info .li-family tr.deleted .ic-btn.delete .ic {
    mask-image: none;
    background-image: url(../img/ic_delete_back.svg);
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.7rem;
}
@media screen and (max-width: 1024px) {
    .museum.guest-info-edit .guest-info .li-family {
        flex-direction: column;
        align-items: flex-start;
    }
    .museum.guest-info-edit .guest-info .li-family > .li-ttl {
        margin-bottom: 2px;
    }
    .museum.guest-info-edit .guest-info .li-family > .li-content {
        width: 100% !important;
    }
}


/* 顧客情報取得（modal） ***********************/
.modal.get-guest-info .modal-content {
    height: 94dvh;
}
.modal.get-guest-info .modal-inner {
    display: flex;
    gap: 2.4rem;
}
.modal.get-guest-info .search-area,
.modal.get-guest-info .result-area {
    width: calc(50% - 1.2rem);
}
.modal.get-guest-info .area-ttl {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}
.modal.get-guest-info .area-ttl > p {
    font-weight: 600;
    color: #555555;
}

/* 検索 */
.modal.get-guest-info .search-area {
    background-color: #ffffff;
    padding: 0;
    margin: 0;
}
.modal.get-guest-info .search-content {
    border: 1px solid var(--gray-1);
    padding: 1.2rem 1.6rem;
}
.modal.get-guest-info .search-content ul { 
    width: calc(100% - (3.2rem - .8rem));
}
.modal.get-guest-info .search-content li {
    display: flex;
    gap: 0 !important;
    justify-content: flex-start;
}
.modal.get-guest-info .search-content li {
    border-bottom: 1px solid var(--gray-2);
    padding-bottom: 6px;
}
.modal.get-guest-info .search-content .li-ttl {
    width: 7rem;
    line-height: 3rem;
    white-space: nowrap;
}
.modal.get-guest-info .search-content .li-content {
    width: calc(100% - 7rem);
    display: flex;
    flex-wrap: wrap;
    gap: 4px 6px;
}
.modal.get-guest-info .search-content .li-guest-name .li-content > div {
    display: flex;
    gap: 4px;
}
.modal.get-guest-info .search-content .li-content 
.modal.get-guest-info .search-area input[type="text"] {
    height: 3rem;
}
.modal.get-guest-info .search-content .li-address input[type="text"] {
    width: 100%;
    max-width: initial;
}
.modal.get-guest-info .btn-area {
    justify-content: center;
    margin: 1.6rem 0 .2rem;
}
.btn-search:not(.ic-btn) {
    font-size: 1.5rem;
    border-radius: 3px;
    padding: 0 8px;
    height: 3rem !important;
}
.btn-search:not(.ic-btn) {
    width: 7rem !important;
    border: 1px solid var(--main-blue);
    color: #ffffff;
    background-color: var(--main-blue);
    background-image: url(../img/ic_search_w.svg);
    background-repeat: no-repeat;
    background-position: 8px center;
    background-size: 1.6rem;
    padding-left: 2.8rem;
}
.modal.get-guest-info .search-content .btn-clear {
    font-size: 1.5rem;
    color: var(--gray-6);
    border: 0;
    border-radius: .2rem;
    background-color: #ffffff;
}

/* ツアー履歴選択 */
.modal.get-guest-info .result-area .switch {
    width: auto;
}
.modal.get-guest-info .result-area .switch label {
    width: 5rem;
    height: 3rem;
    line-height: calc(2.6rem - 2px);
    font-size: 1.3rem;
    color: var(--main-blue);
    border-color: var(--main-blue);
}
.modal.get-guest-info .result-area .switch label p {
    height: 2.5rem;
}
.modal.get-guest-info .result-content {
    height: calc(100% - (2.6rem + 4px));
    background-color: var(--form-bg-color);
    padding: 1rem;
    overflow-y: auto;
}
.modal.get-guest-info .result-content > ul > li {
    background-color: #ffffff;
    border-radius: 6px;
    border: 1px solid var(--gray-3);
    padding: .8rem 0 0;
}
.modal.get-guest-info .result-content > ul > li:not(:last-child) {
    margin-bottom: .8rem;
}
.modal.get-guest-info .result-content > ul > li.selected {
    background-color: var(--pale-yellow-1)!important;
}
.modal.get-guest-info .result-content li .guest-name {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--gray-3);
    padding: 0 1rem .4rem;
}
.modal.get-guest-info .result-content li .guest-name span {
    font-size: 1.3rem;
    font-weight: normal;
}
.modal.get-guest-info .result-content li .guest-name p:first-child {
    font-weight: 600;
}
.modal.get-guest-info .result-content li .guest-name p:not(:first-child) {
    font-size: 1.2rem;
    color: var(--gray-6);
}
.last-tour-date {
    margin-left: auto;
    margin-right: 0;
}
.cp-status {
    border: .1rem solid var(--gray-4);
    padding: 0 .4rem;
    margin-left: .4rem;
}
.modal.get-guest-info .result-content li .guest-info {
    padding: .8rem 1rem;
}
.modal.get-guest-info .result-content li .guest-info ul {
    display: flex;
    gap: .4rem 4rem;
    flex-wrap: wrap;
}
.modal.get-guest-info .result-content li .guest-info li {
    display: flex;
    gap: .8rem;
    align-items: center;
    font-size: 1.35rem;
}
.modal.get-guest-info .result-content li .guest-info li:not(.li-short) {
    width: 100%;
}
.modal.get-guest-info .result-content li .guest-info .li-ttl {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.25rem;
}
.modal.get-guest-info .result-content li .guest-info li:not(.age) .li-ttl {
    width: 6rem;
}
.modal.get-guest-info .result-content li .guest-info li.age .li-ttl {
    width: 3.4rem;
}
.modal.get-guest-info .result-content li .guest-info .li-ttl:after {
    content: ":";
}
.modal.get-guest-info .result-content li .guest-info li:not(.age) .li-content {
    width: calc(100% - 6.8rem);
}

@media screen and (max-width: 820px) {
    .modal.get-guest-info .modal-inner {
        flex-direction: column;
    }
    .modal.get-guest-info .search-area,
    .modal.get-guest-info .result-area {
        width: 100%;
    }
}


/* 提案状況 **************************/
/* 競合 */
.museum .content .check-area {
    gap: 6px 16px;
}
.museum .content .check-area .check-other {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px
}
.museum.guest-info-edit .li-rival .check-area {
    background-color: var(--form-bg-color);
    padding: 8px 12px;
}
.museum.guest-info-edit .li-rival .check-area .check-other p {
    display: flex;
    align-items: center;
    gap: 4px;
}
.museum.guest-info-edit .li-rival .check-area .check-other input[type="text"] {
    width: 24rem;
}

/* 進捗状況 */
.museum[class*="guest-info"] .li-progress,
.museum[class*="guest-info"] .li-prop-content {
    width: 100% !important;
}
.museum[class*="guest-info"] .li-progress .li-ttl:after {
    content: none;
}
.museum[class*="guest-info"] .li-progress .li-ttl.required span:first-child:after {
    content: "*";
    color: var(--red);
    font-size: 1.6rem;
    margin-left: 2px;
}
.museum[class*="guest-info"] .li-progress .li-ttl span:last-child {
    font-size: 1.15rem;
    margin-left: 8px;
}
.museum[class*="guest-info"] .li-progress .progress-fig {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
}
.museum[class*="guest-info"] .li-progress .progress-fig > * {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.museum[class*="guest-info"] .li-progress .progress-fig .radio-btn-area {
    position: relative;
}
.museum.guest-info-detail .li-progress .progress-fig .radio-btn-area {
    margin-bottom: 6px;
}
.museum[class*="guest-info"] .li-progress .progress-fig .radio-btn-area:before {
    content: "";
    display: block;
    width: calc(100% - 3rem);
    height: 0;
    border: 1px solid var(--gray-4);
    position: absolute;
    bottom: .8rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: -1;
}
.museum.guest-info-edit .li-progress .progress-fig label,
.museum.guest-info-detail .li-progress .progress-fig p {
    width: 4.6rem;
    font-size: 1.3rem;
    line-height: 1.5;
    text-align: center;
    white-space: nowrap;
}
.museum.guest-info-edit .li-progress .progress-fig input[type="radio"],
.museum.guest-info-detail .li-progress .progress-fig .radio-btn-area span {
    width: 1.8rem;
    height: 1.8rem;
    background-color: #ffffff;
    margin: 0 1.4rem;
    border-radius: 50%;
    border: 1px solid var(--main-blue);
    outline: 1.5px solid #ffffff;
    outline-offset: -2.5px;
}
.museum.guest-info-edit .li-progress .progress-fig input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
}
.museum.guest-info-edit .li-progress .progress-fig input[type="radio"]:checked {
    background-color: var(--main-blue);
}
.museum.guest-info-detail .li-progress .progress-fig .radio-btn-area span {
    display: block;
    border: 1px solid var(--gray-5);
}
.museum.guest-info-detail .li-progress .progress-fig .radio-btn-area span.selected {
    background-color: var(--gray-5);
}

/* FS現在の仕様 */
.li-spec ul {
    align-items: stretch !important;
}
.li-spec ul .li-ttl {
    width: 7.4rem !important;
}
.li-spec ul .li-content {
    width: calc(100% - 6.6rem);
}

/* 提案内容 **************************/
.museum[class*="guest-info"] .li-spec ul li,
.museum[class*="guest-info"] .proposal .li-facility ul li {
    border-bottom-style: dashed !important;
}
.museum[class*="guest-info"] .proposal .li-facility li {
    width: 100%;
}
.museum[class*="guest-info"] .proposal .li-facility .li-content {
    width: calc(100% - 8rem);
}
.museum[class*="guest-info"] .proposal .li-facility .li-content .li-ttl {
    width: 8rem !important;
}
.museum[class*="guest-info"] .proposal .li-facility label {
    white-space: nowrap;
}

@media screen and (max-width: 1023px) {
    .museum[class*="guest-info"] .content:not(.status) .content-form:not(.sub-info, .tour-info) > ul {
        flex-direction: column;
    }
    .museum[class*="guest-info"] .content:not(.status) .content-form:not(.sub-info, .tour-info) > ul > li {
        width: 100% !important;
    }
}

/* 備考 *****************************/
main.museum .content.note .content-form {
    padding-bottom: 8px;
}

/* 案内希望箇所 *****************************/
@media screen and (min-width: 821px) {
    .museum[class*="guest-info"] .guide-tbl th {
        white-space: nowrap;
    }
}
.guest-info-edit .content.guide .content-ttl {
    flex-direction: column;
    align-items: flex-start;
    gap: .2rem;
}
.content.guide .note-small {
    margin-bottom: .6rem;
}
.content.guide .tbl-area {
    overflow-x: auto;
}
.guide-tbl th {
    position: relative;
    white-space: nowrap;
}
.guest-info-edit .guide-tbl {
    margin-top: 1.8rem;
}
.guest-info-edit .guide-tbl .note {
    color: var(--red);
    font-size: 1.2rem;
    white-space: nowrap;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}


/* 予約一覧
--------------------------------------- */
.table-func .note.type,
.table-func .note.type ul,
.table-func .note.type ul li {
    display: flex;
    align-items: center;
}
.table-func .note.type ul {
    gap: .8rem;
}
.table-func .note.type p,
.table-func .note.type ul li {
    font-size: 1.2rem;
    color: var(--gray-6);
}
.table-func .note.type ul li span {
    display: block;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    margin-right: .4rem;
}
.table-func .note.type ul li.pink span {
    background-color: var(--museum-pink);
}
.table-func .note.type ul li.blue span {
    background-color: var(--museum-blue);
}
.table-func .note.type ul li.yellow span {
    background-color: var(--yellow-1);
}
.table-func .note.type ul li.green span {
    background-color: var(--museum-green);
}
.rsv-list table {
    min-width: 100% !important;
    white-space: nowrap;
}
.rsv-list table th {
    top: 0;
}
.rsv-list table th:before,
.rsv-list table th:after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--gray-1);
    position: absolute;
    left: 0;
}
.rsv-list table th:before {
    bottom: -1px;
}
.rsv-list table th:after {
    top: -1px;
}
.rsv-list table td.red,
.rsv-list table td.blue {
    font-weight: 600;
}
.rsv-list table td.red {
    color: var(--red);
}
.rsv-list table td.blue {
    color: var(--saturday-color);
}
.rsv-list table td .btn-area,
.answer-list td .btn-area {
    align-items: center;
    gap: .6rem;
}
.rsv-list table tr > * p.col-2 {
    display: flex;
    align-items: center;
}
.rsv-list table tr > * p.col-2 > span {
    display: block;
    position: relative;
    min-height: 2rem;
}
.rsv-list table tr > * p.col-2 > span:first-child {
    width: calc(50% - 8px);
    min-width: calc(50% - 8px);;
    padding-left: 0;
}
.rsv-list table tr > * p.col-2 > span:last-child {
    width: calc(50% + 8px);
    min-width: calc(50% + 8px);
    padding-left: 8px;
    margin-left: 8px;
}
.rsv-list table tr > * p.col-2 > span:last-child:before {
    content: "";
    display: block;
    width: 0;
    height: calc(100% + 8px);
    border-right: 1px dashed var(--gray-1);
    position: absolute;
    top: -4px;
    left: 0;
}
.rsv-list .tbl-2-lines tr > td > div:before {
    content: none;
}
.rsv-list table .guest-name {
    font-weight: 600;
}
.rsv-list table .guest-name span {
    width: auto !important;
    font-size: 1.2rem;
}
.rsv-list table .family-name {
    display: flex !important;
    max-width: 32rem;
    text-align: left;
    font-size: 1.2rem;
    line-height: 1.6 !important;
    position: relative;
}
.rsv-list table .family-name span {
    display: block;
    width: auto !important;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.2rem;
    line-height: 1.6;
}
.rsv-list table .family-name b {
    font-weight: normal;
}
.rsv-list table .family-name b:before {
    content: "";
    display: inline-block;
    vertical-align: baseline;
    width: 1rem;
    height: 1rem;
    outline: 1px solid var(--main-text-color);
    outline-offset: -1px;
    border-radius: .5rem;
    margin-bottom: -.1rem;
    margin-right: .1rem;
}
.rsv-list table .family-name span:hover,
.answer-list .hover-text span:hover {
    width: auto !important;
    max-width: unset;
    height: auto;
    position: absolute;
    top: -.4rem;
    left: 0;
    text-overflow: unset;
    overflow: visible;
    background-color: var(--form-bg-color);
    border: 1px solid var(--gray-4);
    border-radius: 3px;
    box-shadow: 0 .2rem .4rem rgba(120, 120, 120, .3);
    padding: 4px 6px !important;
    z-index: 1;
}
.answer-list .hover-text span:hover {
    max-width: 98%;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    font-size: 1.2rem;
    white-space: unset;
    text-align: left;
}
.answer-list .hover-text:not(.guide-row) span:hover {
    top: 0;
    transform: unset;
    -webkit-transform: unset;
    -ms-transform: unset;
}

/* detail button */
.master.rsv-list .ic-btn.detail,
.master.answer-list .ic-btn.detail {
    background-color: var(--form-bg-color);
}
.master.rsv-list .ic-btn.detail span,
.master.answer-list .ic-btn.detail span {
    transform: unset;
    -webkit-transform: unset;
    -ms-transform: unset;
    left: -.4rem;
}

/* icon */
.ic-type {
    display: block;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 50%;
    margin: 0 auto;
}
.ic-type.pink {
    background-color: var(--museum-pink);
}
.ic-type.blue {
    background-color: var(--museum-blue);
}
.ic-type.yellow {
    background-color: var(--yellow-1);
}
.ic-type.green {
    background-color: var(--museum-green);
}


/* お客様アンケート詳細/編集
--------------------------------------- */
.museum[class*="guest-qa"] .page-header {
    height: auto;
    margin-bottom: 6px;
}
.museum[class*="guest-qa"] .page-header p {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
}
.museum[class*="guest-qa"] .page-header .guest-name {
    font-size: 1.5rem;
    font-weight: 600;
    margin-left: .4rem;
    margin-right: 2rem;
}
.museum[class*="guest-qa"] .li-guest-name {
    width: 100%;
}

/* qa label */
.museum[class*="guest-qa"] .qa-label {
    font-size: 1.3rem;
    font-weight: 600;
    border: 1px solid;
    padding: .2rem .8rem;
}
.museum[class*="guest-qa"] .qa-label.red {
    color: var(--red);
    border-color: var(--red);
}
.museum[class*="guest-qa"] .qa-label.yellow {
    color: var(--yellow-2);
    border-color: var(--yellow-2);
}
.museum[class*="guest-qa"] .qa-label.green {
    color: var(--lightgreen);
    border-color: var(--lightgreen);
}
.museum[class*="guest-qa"] .qa-label.blue {
    color: var(--blue);
    border-color: var(--blue);
}

/* qa list */
.museum[class*="guest-qa"] .qa-list ul,
.museum[class*="guest-qa"] .qa-list ul .li-content:not(.time) {
    flex-direction: column;
    align-items: flex-start;
}
.museum[class*="guest-qa"] .qa-list ul {
    gap: 8px;
}
.museum[class*="guest-qa"] .qa-list ul li {
    width: 100% !important;
    padding-bottom: 8px;
}
.museum[class*="guest-qa"] .qa-list ul .li-ttl {
    width: 30%!important;
    min-width: 26rem;
    max-width: 40rem;
}
.museum[class*="guest-qa"] .qa-list ul .li-content {
    gap: 4px;
    width: calc(70% - 1.6rem) !important;
}
.museum[class*="guest-qa"] .qa-list .note,
.museum[class*="guest-qa"] .qa-list ul li.li-ma .li-ttl {
    color: var(--main-blue);
}
.museum[class*="guest-qa"] .qa-list ul li.li-ma .li-ttl {
    font-weight: 600;
}
.museum[class*="guest-qa"] .qa-list ul li .check-area label {
    align-items: flex-start;
}
.museum[class*="guest-qa"] .qa-list ul li .check-area input[type="checkbox"] {
    margin-top: .4rem;
}
.museum[class*="guest-qa"] .qa-list ul li .check-area label span {
    white-space: unset;
}
.museum[class*="guest-qa"] .qa-list .note {
    font-size: 1.2rem;
    margin-bottom: .4rem;
}
.museum[class*="guest-qa"] .qa-list .li-content img {
    max-width: 100%;
    max-height: 42rem;
    border: .8rem solid var(--gray-3);
}

/* 詳細 *********************************/
.museum.guest-qa-detail .qa-list .li-other .li-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
}
.museum.guest-qa-detail .qa-list .li-other img {
    width: 40%;
    min-width: 24rem;
    max-width: 32rem;
    border-width: .6rem;
}


/* 来館実績一覧
--------------------------------------- */
.master.answer-list th,
.master.answer-list td:not(.enq-row.text),
.enq-row.text span {
    white-space: nowrap;
}

/* 検索 */
.master.answer-list .search-area {
    padding-right: 16px;
}
.master.answer-list .search-area form {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 10px 20px;
}
.master.answer-list .search-content {
    width: calc(100% - 10rem);
    padding: 0 16px 0 0;
}
.kind-switch {
    width: 100% !important;
    margin-bottom: 1.6rem;
}
.kind-switch label {
    white-space: nowrap;
}
.master.answer-list .select-kind,
.master.rsv-list .select-kind {
    display: block;
    padding: 0;
}
.master.answer-list .search-area .btn-area {
    align-items: center;
    gap: 8px;
    margin-left: auto;
    margin-right: 0;
}
.master.answer-list .search-area .btn-search {
    position: relative;
    right: unset;
    bottom: unset;
}
.btn-clear {
    background-color: #f3f3f3;
}
.btn-clear .ic {
    mask-image: url(../img/ic_clear.svg);
    -webkit-mask-image: url(../img/ic_clear.svg);
    mask-size: 1.7rem;
    -webkit-mask-size: 1.7rem;
    background-color: var(--gray-5);
}

/* 項目表示切替 */
.master.answer-list .item-select {
    width: 100%;
    padding-top: 10px;
    border-top: 1px dashed var(--gray-1);
}
.master.answer-list .item-select .toggle-btn {
    color: var(--main-blue);
    font-size: 1.4rem;
    background-color: transparent;
    border: 0;
    padding: 4px 0;
    display: flex;
    align-items: center;
    gap: .4rem;
}
.master.answer-list .item-select .toggle-btn:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 0.8rem solid var(--main-blue);
    border-left: 0.6rem solid transparent;
    border-right: 0.6rem solid transparent;
}
.master.answer-list .item-select.open .toggle-btn:after {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
}
.master.answer-list .item-select .select-area {
    display: none;
    flex-wrap: wrap;
    gap: 8px 32px;
    margin-top: 2px;
}
.master.answer-list .item-select.open .select-area {
    display: flex;
}
.select-area-content {
    width: 100%;
    padding: 8px;
}
.select-area-content.hs {
    background-color: #e5f5ee;
}
.select-area-content.qa {
    background-color: #fef3f6;
}
.select-area-content.guide {
    background-color: #fdf4e4;
}
.master.answer-list .item-select .select-area-content .check-area {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin-left: 1.2rem;
}
.master.answer-list .item-select .select-area-content label {
    display: flex;
    align-items: center;
    gap: 1px;
}
.master.answer-list .item-select .select-area-content > label {
    margin-bottom: 8px;
}
.item-select .select-area-content label.parent-guide {
    font-weight: 600;
}

/* table */
.master.answer-list .table-area,
.master.rsv-list .table-area {
    overflow-x: unset;
}
.master.answer-list tr:first-child,
.master.rsv-list tr:first-child {
    z-index: 12;
}
.master.answer-list th {
    height: 3rem;
    text-align: center;
    white-space: unset;
    border-color: transparent;
    top: 0;
    z-index: 5;
}
.master.answer-list th span,
.master.rsv-list th span {
    white-space: nowrap;
}
.master.answer-list th.enq-row span,
.master.answer-list th.guide-row span {
    display: block;
    align-content: center;
    position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: 0;
    padding: 4px 8px;
    z-index: 6;
}
.master.answer-list th.guide-row:not(.parent-guide) span {
    top: 62.5%;
}
.master.answer-list tr:nth-child(2) th {
    top: 3rem;
}
.master.answer-list th:not(.guide-row):before,
.master.answer-list th.parent-guide:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    outline: 1px solid var(--gray-1);
    position: absolute;
    top: 0;
    left: 0;
}
.master.answer-list tr:last-child td {
    border-bottom: 0;
}
.t-detail,
.t-class,
.t-date,
.t-name,
.t-total {
    position: sticky;
    border-right: 0 !important;
    border-left: 0 !important;
    z-index: 10 !important;
}
.t-detail {
    width: 8rem;
    min-width: 8rem;
    left: 0;
}
.t-date {
    width: 9rem;
    min-width: 9rem;
    left: 8rem;
}
.t-class {
    width: 6rem;
    min-width: 6rem;
    left: 17rem;
}
.t-name {
    min-width: 16rem;
    left: 23rem;
}
.t-total {
    left: 17rem;
}
td.t-detail,
td.t-class,
td.t-date,
td.t-name,
.t-detail + td,
.t-date + td {
    border-left-color: transparent !important;
}
td.t-detail:before,
td.t-class:before,
td.t-date:before,
td.t-name:before,
.t-total:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    outline: 1px solid var(--gray-1);
    position: absolute;
    top: 0;
    right: 0;
}
.master.answer-list tr:last-child td:not(.t-detail, .t-total, .t-name, .t-name) {
    position: relative;
}
.master.answer-list tr:last-child td:after {
    content: "";
    display: block;
    width: 100%;
    height: 0;
    z-index: 0;
    position: absolute;
    left: 0;
    bottom: 0;
    border-bottom: 1px solid var(--gray-1);
}
.hs-row-first,
.enq-row-first,
.guide-row-first {
    border-left: 3px double var(--gray-1) !important;
}
.master.answer-list tr:last-child,
.master.answer-list tr:last-child td {
    background-color: var(--pale-yellow-1) !important;
}
.master.answer-list tr:last-child td {
    text-align: center;
}
th.hs-row {
    background-color: #e5f5ee !important;
}
th.enq-row {
    background-color: #fef3f6 !important;
}
tr:nth-child(2) .enq-row {
    background-color: #ffe9ee !important;
}
th.guide-row {
    background-color: #fdf4e4 !important;
}
th.parent-guide {
    position: relative;
    height: 6rem !important;
}
th.guide-row:not(.parent-guide) {
    background-color: #ffedcf !important;
    top: 0;
}
th.guide-row:not(.parent-guide):before {
    content: "";
    display: block;
    width: calc(100% + 2px);
    height: 25%;
    background-color: #fdf4e4;
    border-top: 1px solid var(--gray-1);
    position: absolute;
    top: -1px;
    left: -2px;
    z-index: 0;
}
th.guide-row:not(.parent-guide):after {
    content: "";
    display: block;
    width: 100%;
    height: calc(75% - 1px);
    border-top: 1px solid var(--gray-1);
    border-right: 1px solid var(--gray-1);
    border-bottom: 1px solid var(--gray-1);
    position: absolute;
    top: 25%;
    left: 0;
}

/* 境界線 */
.first-row {
    border-left: .3rem double var(--gray-1) !important
}

/* 文字数制限 */
.enq-row,
.guide-row {
    max-width: 10.2rem;
    min-width: 10.2rem;
}
.hs-row.kyougo,
.hs-row.propose {
    position: relative;
    min-width: 16rem;
    max-width: 16rem;
}
.enq-row.text {
    position: relative;
}
.enq-row span:not(.ic-circle),
.guide-row span:not(.ic-circle),
.hs-row.kyougo span,
.hs-row.propose span {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}



/****************************************
SP
*****************************************/
body.mobile,
.mobile input,
.mobile select {
    font-size: 1.5rem;
}
.mobile .nav-btn.pc,
.mobile .nav-area,
.mobile .side-menu-area .li-card,
.mobile .modal.card,
.mobile .btn-area.member {
    display: none;
}
.mobile input[type="text"],
.mobile input[type="date"],
.mobile input[type="month"],
.mobile input[type="time"],
.mobile textarea {
    padding: 4px 8px;
}
.mobile .form input[type="text"],
.mobile .form input[type="date"],
.mobile .form input[type="month"],
.mobile .form input[type="time"],
.mobile .form textarea {
    border: 0;
    background-color: var(--form-bg-color);
    font-size: 1.45rem !important;
}
.mobile .modal.participant input[type="text"] {
    background-color: #ffffff;
}
.mobile input[type="date"] {
    width: auto;
    min-width: 11rem;
}
.mobile input[type="time"] {
    width: 8.4rem;
}
.mobile .form .select-box,
.mobile .modal.participant .select-box {
    border-top: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background-color: transparent;
}

/* button */
.mobile .btn:not(.add-participant):not(.i-btn):not(.modal .btn):not(.ampm-btn-area .btn):not(.sp-nav .btn):not(.li-done .btn) {
    background-color: transparent !important;
    font-weight: 600;
    font-size: 1.55rem;
    padding: 3px 4px;
}
.mobile .btn:not(.add-participant):not(.participant .red-border):not(.i-btn):not(.ampm-btn-area .btn):not(.top-btn-area .btn-area button) {
    border: 0 !important;
}
.mobile .btn.gray {
    color: var(--gray-6);
}
.mobile .btn.orange {
    color: var(--main-orange);
}
.mobile .btn.blue {
    color: var(--main-blue);
}
.mobile .btn.red {
    color: var(--red);
}
.mobile .btn.orange-border {
    border-color: var(--main-orange);
    background-color: #ffffff;
}
.mobile .btn.red-border {
    color: var(--red);
    border-color: var(--red);
    background-color: #ffffff;
}
.mobile .btn.no-border {
    border: 0;
}    
.mobile .btn:active {
    background-color: var(--form-bg-color);
}
.mobile .btn.red-border:active {
    background-color: var(--pale-red-1);
}

/* toggle button */
.mobile .toggle-btn {
    display: flex;
    align-items: center;
    position: relative;
    width: 36px;
    height: 12px;
    border-radius: 50px;
    background-color: #dddddd;
    cursor: pointer;
    transition: background-color;
}
.mobile input[type="checkbox"].toggle:checked + .toggle-btn {
    background-color: var(--main-blue);
}
.mobile input[type="checkbox"].toggle:checked + .toggle-btn::after {
    border-color: var(--main-blue);
}
.mobile .toggle-btn::after {
    position: absolute;
    left: 0;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1px solid var(--gray-4);
    background: #fff;
    content: '';
    transition: left;
}
.mobile input[type=checkbox].toggle:checked + .toggle-btn::after {
    left: 16px;
}
.mobile .form-date input[type="checkbox"],
.mobile .form-repeat input[type="checkbox"] {
    display: none;
}


/* header
--------------------------------------- */
.mobile header {
    border-bottom: 0;
    padding: 0;
    z-index: 250;
}
.mobile header.search-member-open,
.mobile header.search-member-open + main .fc-toolbar.fc-header-toolbar,
.mobile header.search-member-open + main .select-date {
    z-index: 230;
}
.mobile .header-inner {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: var(--main-blue);
    padding: 0 10px;
}
.mobile .sp-nav-area.open .sp-nav {
    display: block;
}
.mobile .sp-nav {
    display: none;
    position: fixed;
    top: 4.8rem;
    left: 0;
    width: 20rem;
    height: calc(100% - 4.8rem);
    background-color: var(--main-blue);
    border-top: 1px solid rgba(255, 255, 255, .4);
    padding: 0;
    z-index: 250;
}
.mobile header .nav-btn.sp {
    top: 0;
}
.mobile header .sys-name {
    height: 4rem;
    background-image: url(../img/systemlogo2.svg);
    background-size: 85%;
    margin: 16px 16px 24px;
}

/* user name */
.mobile header .user-name {
    gap: 6px;
    font-size: 1.4rem;
    color: #ffffff;
    line-height: initial;
    border-bottom: 1px solid rgba(255, 255, 255, .4);
    padding: 0 16px 16px;
    margin: 0 0 8px;
}
.mobile header .user-name:before {
    width: 1.8rem;
    height: 1.8rem;
    background-image: url(../img/ic_user.svg);
}

/* カレンダー選択 */
.mobile .sp-select-kind {
    border-bottom: 1px solid rgba(255, 255, 255, .4);
    padding-bottom: 8px;
    margin-bottom: 8px;
}
.mobile .sp-select-kind a {
    display: flex;
    gap: 4px;
    align-items: center;
    height: 4.2rem;
    color: #ffffff;
    text-decoration: none;
    padding: 0 16px;
}
.mobile .sp-select-kind a:before {
    content: "";
    display: block;
    width: 3rem;
    height: 3rem;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    mask-size: 64%;
    -webkit-mask-size: 64%;
    background-color: #ffffff;
}
.mobile .sp-select-kind .kind-month a:before {
    mask-image: url(../img/ic_kind_month.svg);
    -webkit-mask-image: url(../img/ic_kind_month.svg);
}
.mobile .sp-select-kind .kind-week a:before {
    mask-image: url(../img/ic_kind_week.svg);
    -webkit-mask-image: url(../img/ic_kind_week.svg);
}
.mobile .sp-select-kind .kind-day a:before {
    mask-image: url(../img/ic_kind_day.svg);
    -webkit-mask-image: url(../img/ic_kind_day.svg);
}
.mobile .sp-select-kind a.selected {
    background-color: rgba(255, 255, 255, .2);
}

/* button */
.mobile .btn-manual,
.mobile .btn-logout {
    display: flex;
    gap: 4px;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row-reverse;
    width: 100%;
    height: 4.2rem;
    border-radius: 3px;
    background-color: transparent;
    padding: 0 16px;
}
.mobile .btn-manual .caption,
.mobile .btn-logout .caption {
    display: block;
    color: #ffffff;
    background-color: transparent;;
    font-size: 1.4rem;
    text-align: left;
    line-height: 4.2rem;
    font-weight: 400;
    border: 0;
    border-radius: 0;
    padding: 0;
    position: unset;
    transform: unset;
    -webkit-transform: unset;
    -ms-transform: unset;
}
.mobile .btn-manual .ic,
.mobile .btn-logout .ic {
    width: 3rem;
    height: 3rem;
    background-color: #ffffff;
}
.mobile header .btn-area {
    display: flex !important;
}
.mobile header .btn-area button {
    display: block;
    background-color: transparent;
    border: 0;
    width: 3.8rem;
    height: 3.8rem;
    border-radius: 2rem;
    position: relative;
    padding: 0;
}
.mobile header .btn-area button .ic {
    display: block;
    width: 100%;
    height: 100%;
    mask-position: center;
    mask-repeat: no-repeat;
}
.mobile header .btn-select-calendar .ic {
    mask-image: url(../img/ic_calendar.svg);
    -webkit-mask-image: url(../img/ic_calendar.svg);
    mask-size: 2.2rem;
    -webkit-mask-size: 2.2rem;
    background-color: #ffffff;
}
.mobile header .btn-select-group .ic {
    mask-image: url(../img/ic_member.svg);
    -webkit-mask-image: url(../img/ic_member.svg);
    mask-size: 2.6rem;
    -webkit-mask-size: 2.6rem;
    background-color: #ffffff;
}
.mobile .btn-add-event .ic {
    mask-image: url(../img/ic_plus.svg);
    -webkit-mask-image: url(../img/ic_plus.svg);
    mask-size: 1.8rem;
    -webkit-mask-size: 1.8rem;
    background-color: var(--main-orange)
}
.mobile .btn-add-event .caption {
    display: none;
}
.mobile header .btn-select-calendar.selected:before,
.mobile header .btn-select-group.selected:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    background-color: rgba(255, 255, 255, .2);
}


/* page header
--------------------------------------- */
.mobile .page-header {
    width: 100%;
    height: 5rem;
    display: flex;
    align-items: center;
    flex-direction: column;
    font-size: 1.5rem;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 250;
}
.mobile .page-header p {
    line-height: 5rem;
    font-size: 1.6rem;
    white-space: nowrap;
    width: 100%;
    text-align: center;
}

/* top button area */
.mobile .top-btn-area {
    width: 100%;
    height: 100%;
    border-bottom: 1px solid var(--gray-4);
    background-color: #ffffff;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 10px;
    z-index: 120;
    position: relative;
}
.mobile .top-btn-area .btn-area {
    gap: 0;
}
.mobile .top-btn-area .btn-area,
.mobile .top-btn-area p + button {
    margin-left: auto;
    margin-right: 0;
}
.mobile .top-btn-area .btn-area button {
    display: block;
    border: 0;
    border-radius: 0;
}
.mobile .top-btn-area .btn-area button:first-child {
    padding: 4px 14px 4px 4px !important;
}
.mobile .top-btn-area .btn-area button:last-child {
    padding: 4px 4px 4px 14px !important;
}
.mobile .top-btn-area .btn-area button:not(:last-child) {
    border-right: 1px solid var(--gray-1);
}
.mobile .top-btn-area .btn-area button:not(:last-child):not(:first-child) {
    padding: 4px 14px !important;
}
.mobile .text-btn.back,
.mobile .top-btn-area .btn.gray {
    position: relative;
    width: 3rem;
    height: 3rem;
}
.mobile .top-btn-area .btn.gray:before,
.mobile .m-plan.detail .text-btn:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-image: url(../img/ic_back.svg);
    background-repeat: no-repeat;
    background-position: left 6px center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: 0;
}
.mobile .top-btn-area .btn.gray span {
    display: none;
}
.mobile .top-btn-area p {
    width: auto;
}
.mobile .top-btn-area > * {
    order: unset !important;
}


/* main
--------------------------------------- */
.mobile main:not(.schedule) {
    padding-top: 4.8rem;
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 0;
}
.mobile main:not(.schedule) .main-content {
    border: 8px solid #f6f6f6;
}
.mobile main.detail:not(.m-plan.detail) .main-content,
.mobile main.m-plan.add-edit .main-content {
    border-bottom-width: calc(4.6rem + 10px);
}
.mobile .col2,
.mobile .m-plan.detail {
    height: 100%;
}
.mobile .col2 .main-content,
.mobile .m-plan.detail .main-content {
    min-height: 100%;
}


/* calendar
--------------------------------------- */
.mobile .calendar-area {
    padding-top: 4.4rem;
}
.mobile .calendar-area.day {
    overflow-y: auto;
}
.mobile .fc-toolbar.fc-header-toolbar {
    width: calc(100% - (4.8rem - 2px));
    top: 0;
    right: 0;
    padding: .9rem;
    z-index: 250;
}
.mobile .calendar-func {
    width: calc(100% - 5rem);
    height: 4.4rem;
    top: 4.8rem;
    left: 0;
    background-color: var(--form-bg-color);
}
.mobile .fc-view:not(.fc-dayGridMonth-view) .fc-daygrid-day.fc-day-today .fc-daygrid-day-number {
    background-color: var(--main-blue);
    color: #ffffff;
}
.mobile .date-header {
    width: 100%;
    top: 9.2rem;
}
.mobile .calendar-area.day .fc-daygrid-day-frame {
    display: grid;
}
.mobile .calendar-area:not(.day) .fc-daygrid-day-frame {
    display: flex;
    flex-direction: column;
}
.mobile .calendar-area.day .fc-daygrid-day-frame {
    grid-template-columns: 1fr 3.6rem;
}
.mobile .calendar-area.day .fc-daygrid-day-bg {
    grid-column: 1/2;
    grid-row: 2/3;
}
.mobile .calendar-area.day .btn-add-event-day {
    grid-column: 2/3;
    grid-row: 1/3;
}

/* calendar - toolbar */
.mobile .fc-toolbar-title {
    color: #ffffff;
    font-size: 1.8rem;
    font-weight: 600;
}
.mobile .fc-direction-ltr .fc-toolbar > * > :not(:first-child) {
    margin-left: 0;
}
.mobile .fc-toolbar .fc-toolbar-chunk:first-child {
    width: 100%;
    flex-direction: row-reverse;
    justify-content: space-between;
}
.mobile .fc-today-button {
    background-color: transparent!important;
    border-color: #ffffff!important;
}
.mobile .calendar-area .select-date {
    top: .7rem;
    left: 4.8rem;
    background-position: right 1.4rem;
    z-index: 251;
}

/* calendar - 社員選択 */
.mobile .select-member-area {
    width: calc(100% - 10rem);
    border-left: 1px solid var(--gray-2);
    background-color: transparent;
}
.mobile .select-member {
    height: 4.4rem;
    border: 0;
    border-radius: 0;
    background-position: right 12px center;
    background-color: transparent;
    padding-right: 3.2rem;
}
.mobile .select-member select {
    padding-right: 0;
    padding-left: 0;
}

/* calendar - グループ選択 */
.mobile .select-group-menu {
    min-width: 20rem;
    left: 10px;
    top: 4rem;
}
.mobile .select-group-menu li {
    font-size: 1.4rem
}
.mobile .calendar-area:not(.week) .select-group-area .select-box {
    width: 5rem;
    height: 100%;
    background-image: none;
    mask-image: url(../img/ic_member.svg);
    -webkit-mask-image: url(../img/ic_member.svg);
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-position: center;
    background-color: var(--main-blue);
}
.mobile .calendar-area.week .select-group-area,
.mobile .calendar-area.week .select-group-area > .select-box {
    width: 100%;
    height: 100%;
}
.mobile .calendar-area.week .select-group-area .select-box {
    background-color: transparent;
    border: 0;
    border-radius: 0;
}
.mobile .calendar-area:not(.week) .select-group-area .select-box p {
    display: none;
}
.mobile .calendar-area.week .select-group-area .select-box p {
    height: 4.4rem;
    line-height: 4.4rem;
}
.mobile .group-menu-content li {
    max-width: 24rem;
    width: auto;
    height: 3.6rem;
    line-height: 3.6rem;
}

/* calendar - 社員検索 */
.mobile .search-member-area {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 100dvh;
    background-color: rgba(0, 0, 0, .5);
    top: -4.8rem;
    left: 0;
}
.mobile .search-member-inner {
    width: 72%;
    min-width: 18rem;
    max-width: 30rem;
    height: 64dvh;
    outline: 0;
    border-radius: 8px;
}
.mobile .search-member-area .modal-header {
    display: block;
    height: 3.6rem;
}
.mobile .search-member-area .btn-modal-close {
    top: .3rem !important;
}
.mobile .search-member-area input[type="text"] {
    height: 3.4rem;
}
.mobile .search-member-area ul {
    max-height: calc(100% - (6.6rem + 12px));
}
.mobile .search-member-area p {
    width: 100%;
    height: calc(3.6rem - 2px);
    line-height: calc(3.6rem - 2px);
}

/* calendar - スケジュール検索 */
.mobile .fc-list {
    font-size: 1.4rem;
}
.mobile .skd-search-btn {
    width: 5rem;
    height: 100%;
    background-size: 2.2rem auto;
    background-color: #ffffff;
    border-radius: 0;
    border-left: 1px solid var(--gray-2);
}
.mobile .skd-search-area > div {
    width: calc(100% - 4.6rem);
}
.mobile .skd-search-area .member-name {
    display: none;
}
.mobile .skd-search-area input[type="text"] {
    width: calc(100% - 3.6rem);
}
.mobile .skd-search-area {
    background-color: #ffffff;
    padding: .4rem;
}
.mobile .skd-search-area .btn-search {
    width: 3.2rem;
    height: 3.2rem;
}
.mobile .skd-search-close-btn {
    width: 4.6rem;
    height: 3.2rem;
}

/* calendar - 予定追加 */
.mobile .fc-toolbar-chunk:last-child {
    position: fixed;
    top: 4.85rem;
    right: 0;
    width: 5rem;
    height: 4.4rem;
    border-left: 1px solid var(--gray-2);
}
.mobile .fc-addEvent-button {
    width: 100%;
    height: 100%;
}

/* calendar - 「今日」ボタン */
.mobile .fc-toolbar .fc-toolbar-chunk .fc-today-button {
    position: absolute;
    top: 10px;
    right: calc((6rem + 22px) + .75em);
}

/* calendar - カレンダー切替 */
.mobile .select-kind input[type="radio"].day-for-pc + label {
    display: none;
}
.mobile .calendar-area .select-kind {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background-color: #ffffff;
    background-position: right 16px center;
    border: 0;
    border-radius: 0;
    display: none;
    box-shadow: 0 2px 4px rgba(120, 120, 120, .5);
    padding: 8px;
    z-index: 250;
}
.mobile .calendar-area .select-kind.open {
    display: flex;
}

/* calendar - week */
.mobile .week-cal .fc-theme-standard {
    width: calc(100% - (100%/10));
}
.mobile .calendar-area.week {
    padding-top: 9.2rem;
    padding-bottom: 80px;
}
.mobile .calendar-area.week .cal-ttl {
    width: calc(100%/10);
}
.mobile .calendar-area.week .date-header {
    padding-left: calc(100%/10);
}
.mobile .week-cal .cal-ttl {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}
.mobile .week-cal .cal-ttl p {
    writing-mode: vertical-rl;
    text-align: center;
    font-weight: 600;
    text-orientation: upright;
}
.mobile .week-cal .sub-info {
    display: none;
}

/* calendar - 予定追加ボタン（各日） */
.mobile td .btn-add-event-day {
    width: 2.4rem;
    height: 2.4rem;
    padding: 0;
}
.mobile .holiday .fc-event-title {
    width: calc(100% - .6em);
}
.mobile .calendar-area.day .btn-add-event-day {
    width: 2.8rem;
    height: 2.8rem;
    background-size: 1.8rem;
    margin: auto 0 0 auto;
}

/* calendar - someone */
.mobile .someone .fc-event-title {
    padding-left: 1.3rem !important;
}
.mobile .someone .fc-event-title:before {
    mask-size: 82%;
    -webkit-mask-size: 82%;
    transform: none;
    -webkit-transform: none;
    -ms-transform: none;
}
.mobile .someone.fc-h-event .fc-event-title:before {
    top: .3rem;
}
.mobile .someone.fc-daygrid-dot-event .fc-event-title:before {
    top: .2rem;
}
.mobile .someone.fc-v-event .fc-event-title {
    line-height: 1.4;
}
.mobile .someone.fc-v-event .fc-event-title:before {
    top: .2rem;
}

/* calendar - holiday */
.mobile .fc-daygrid-day-bg .holiday .fc-event-title {
    padding-bottom: 0;
    margin-bottom: 0!important;
}

/* calendar - 日表示 */
.mobile .calendar-area.day .fc-daygrid-day-events {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: .4rem;
}
.mobile .calendar-area.day .fc-daygrid-day-events > .fc-daygrid-event-harness {
    width: 50%;
}
.mobile .fc-direction-ltr .fc-daygrid-more-link {
    line-height: 2rem;
}
.mobile .fc-daygrid-block-event {
    margin-right: 2px;
    margin-left: 2px;
}


/* todo
--------------------------------------- */
.mobile .side-open {
    padding-top: 0;
}
/* todo */
.mobile .side-content .side-ttl {
    height: 5rem;
}
.mobile .side-open .side-menu-area {
    display: none;
}
.mobile .modal.todo .modal-inner {
    border-bottom: 0;
    margin-bottom: 0;
}
.mobile .modal.todo input[type="text"],
.mobile .modal.todo input[type="date"],
.mobile .modal.todo input[type="time"],
.mobile .modal.todo textarea.memo {
    border: 0;
    background-color: var(--form-bg-color);
}
.mobile .modal.todo input[type="text"],
.mobile .modal.todo input[type="date"],
.mobile .modal.todo input[type="time"] {
    height: 3.6rem;
}
.mobile .modal.todo .modal-inner ul li p {
    font-size: 1.3rem;
}
.mobile .modal.todo .modal-inner ul li:not(.li-importance) p {
    margin-bottom: 4px;
}
.mobile .modal.todo .li-date-time ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.mobile .modal.todo .li-importance {
    flex-wrap: wrap;
}
.mobile .modal.todo .modal-inner ul .li-importance p {
    width: 100%;
    margin-bottom: 8px;
}
.mobile .modal.todo .modal-inner ul .li-importance .check-btn-area {
    width: 100%;
}
.mobile .modal.todo input[type="time"] {
    width: 100%;
}
.mobile .side-content .sort-select li {
    width: 6.8rem;
    height: 2.8rem;
    line-height: calc(2.7rem - 1px);
}

/* notification */
.mobile .side-menu-area .li-notif .notif-num {
    top: -.5rem;
    right: -.5rem;
    min-width: 2rem;
    height: 2rem;
    border-radius: 1rem;
    line-height: 2rem;
    font-size: 1.2rem;
}


/* form(add/edit)
--------------------------------------- */
.mobile .form select {
    padding-left: 4px;
}

/* add/edit - switch */
.mobile .switch.todo {
    justify-content: center;
    margin-bottom: 1.6rem;
}

/* add/edit - schedule - 日時 */
.mobile .form-date .ampm-btn-area {
    justify-content: flex-end;
    line-height: 3.4rem;
    margin-bottom: 8px;
}
.mobile .form-date .ampm-btn-area .btn {
    width: calc((100% - 16px)/3);
    height: 3.4rem;
}
.mobile .form-date > ul li:not(:first-child),
.mobile .form-repeat > li:not(:first-child),
.mobile .form-notification li:not(:first-child) {
    margin-top: 8px;
}
.mobile .form-date > ul li > div {
    align-items: center;
    justify-content: space-between;
}
.mobile .form-date > ul > li > p {
    width: 5rem;
    margin-bottom: 4px;
    font-size: 1.3rem;
}
.mobile .form-date .select-area {
    height: 3.6rem;
    margin-bottom: .8rem;
}
.mobile .form-date .select-time .select-box {
    background-color: var(--form-bg-color);
    padding: 4px 6px;
    border-radius: 4px !important;
    border: 0;
}
.mobile .form-date .select-time .select-box select {
    border-bottom: 1px solid var(--gray-1);
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 18px;
}
.mobile .add-edit li.end-date > div:last-child {
    margin-top: 8px;
}

/* add/edit - schedule - 通知 */
.mobile .form-notification {
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
}
.mobile .form-notification li:first-child,
.mobile .form-content.check-area {
    justify-content: space-between;
}
.mobile .form-notification li:first-child {
    width: 100%;
}
.mobile .form-notification .notification-time {
    flex-wrap: wrap;
}
.mobile .form-notification input[type="checkbox"],
.mobile .form-content.check-area input[type="checkbox"] {
    display: none;
}
.mobile .form-notification .notification-time .select-box {
    background-color: var(--form-bg-color);
    border-bottom: 0;
    border-radius: 4px;
    padding: 4px 6px;
}
.mobile .form-notification .notification-time .select-box select {
    border-bottom: 1px solid var(--gray-1);
    line-height: calc(3.6rem - 16px);
}

/* add/edit - schedule - 参加者 */
.mobile .add-edit .form.participant {
    margin-top: 20px;
}
.mobile .form.participant > .member-list {
    border: 0;
    outline: 1px solid var(--gray-1);
    outline-offset: -1px;
}
.mobile .form.participant > .member-list li {
    border-bottom: 1px solid var(--gray-2);
}
.mobile .form.participant > .member-list li .m-info {
    width: 100%;
    position: relative;
}
.mobile .form.participant > .member-list li .m-info {
    display: grid;
    grid-template-columns: min-content;
}
.mobile .form.participant > .member-list li p:not(.m-name) {
    font-size: 1.2rem;
}
.mobile .form.participant > .member-list li .m-name-position {
    grid-column: 2/3;
    grid-row: 1/2;
}
.mobile .form.participant > .member-list li .m-busho {
    grid-column: 2/3;
    grid-row: 2/3;
}
.mobile .form.participant {
    align-items: flex-start;
}
.mobile .form-content.participant {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
}
.mobile .form-content.participant .left {
    grid-column: 1/2;
    grid-row: 1/2;
}
.mobile .form-content.participant .right {
    grid-column: 2/3;
    grid-row: 1/2;
}
.mobile .form-content.participant .right > .btn {
    margin-left: auto;
}
.mobile .form-content.participant #m-err-message {
    grid-column: 1/3;
    grid-row: 2/3;
    margin-top: .4rem;
}
.mobile .form-content.participant
.mobile .form-content.participant .btn.red-border {
    height: 3rem;
    font-size: 1.4rem;
    padding: 0 6px;
}
.mobile .select-li .ic-btn.total-list {
    width: 3.4rem;
    height: 2.6rem;
    grid-column: 1/2;
    grid-row: 1/3;
}
.mobile .select-li .ic-btn.total-list .ic {
    mask-size: 56%;
}


/* 予定・実績詳細
--------------------------------------- */
.mobile .col2.detail .caution {
    font-size: 1.4rem;
    margin-bottom: 16px;
}

/* detail - todo - 状況 */
.mobile .li-done .btn {
    height: 2.8rem;
    font-size: 1.4rem;
    line-height: 2.8rem;
    color: #ffffff;
    padding: 0 1rem;
}

/* detail - todo - 状況 */
.mobile .li-done .btn {
    height: 2.8rem;
    font-size: 1.4rem;
    line-height: 2.8rem;
    color: #ffffff;
    padding: 0 1rem;
}

/* 削除ボタン */
.mobile .detail .bottom-btn-area,
.mobile .m-plan.add-edit .bottom-btn-area {
    position: fixed;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
    width: 100%;
    height: 4.6rem;
    border-top: 1px solid var(--gray-1);
    padding: 0 10px;
    background-color: #ffffff;
}
.mobile .detail .bottom-btn-area .btn.red-border {
    border-color: var(--gray-2);
}


/* modal
--------------------------------------- */
.mobile .dg-overlay .dg-body {
    width: 82% !important;
}
.mobile button[class^="btn-modal"] {
    position: absolute;
    top: .5rem !important;
    height: 3rem;
    font-size: 1.5rem;
    background-color: transparent !important;
}
.mobile button[class^="btn-modal"]:not(.btn-modal-close) {
    padding: 0 4px;
}
.mobile button[class^="btn-modal"]:active {
    background-color: var(--form-bg-color);
}
.mobile .btn-modal-close {
    left: 8px;
    width: 3rem;
    border-radius: 1.5rem;
}
.mobile .btn-modal-orange {
    right: 10px;
    color: var(--main-orange);
    white-space: nowrap;
    font-weight: 600;
    border: 0;
    border-radius: 4px;
}
.mobile button.btn-modal-red-border {
    position: unset;
    display: block;
    border: 0;
    border-radius: 4px;
    font-weight: 600;
    color: var(--red);
    margin-right: 0;
    margin-left: auto;
}
.mobile .modal.todo .btn-delete-area {
    border-top: 1px solid var(--gray-1);
    padding: .5rem 0;
}


/* ミュージアム仮予約
--------------------------------------- */
/* 詳細 *********************************/
.mobile .m-plan .main-content .slot-label {
    margin-bottom: 8px;
}
.mobile .m-plan .li-num-of-ppl .form-content > p {
    margin-top: .6rem;
}

/* 登録 *********************************/
.mobile .m-plan.add-edit .li-guest-name .form-content {
    flex-direction: column;
}


/* ミュージアム予約詳細
--------------------------------------- */
.mobile .m-plan.detail .text-btn {
    position: fixed;
    top: 1rem;
    left: 10px;
    width: 3rem;
    height: 3rem;
    z-index: 251;
}
.mobile .m-plan.detail .text-btn:before {
    border: 0;
}
.mobile .m-plan.detail .text-btn:after {
    content: none;
}
.mobile .m-plan.detail .top-btn-area {
    justify-content: center;
}
.mobile .m-plan.detail .rsv-list {
    flex-direction: column;
}
.mobile .m-plan.detail .rsv-list .li-add {
    height: 5rem;
}




/****************************************
PC, TAB
*****************************************/
/* common
--------------------------------------- */
body:not(.mobile) {
    min-height: 600px;
}
body:not(.mobile),
body:not(.mobile) input,
body:not(.mobile) select {
    font-size: 1.4rem;
}
body:not(.mobile) .btn-logout .caption,
body:not(.mobile) .btn-manual .caption,
body:not(.mobile) .sp-select-kind {
    display: none;
}
body:not(.mobile) .form input[type="text"],
body:not(.mobile) .form input[type="date"],
body:not(.mobile) .form input[type="month"],
body:not(.mobile) .form input[type="time"],
body:not(.mobile) .form .select-box {
    height: 3.2rem;
}
body:not(.mobile) .form .select-box select {
    line-height: calc(3.2rem - 10px);
}

/* error message */
body:not(.mobile) .form-content.participant {
    position: relative;
}
body:not(.mobile) .form.participant #m-err-message {
    line-height: 1.4;
}

/* check list */
body:not(.mobile) .check-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0 20px;
    padding-top: 4px;
    padding-bottom: 4px;
}
body:not(.mobile) .check-list li {
    width: calc(50% - 10px);
    justify-content: flex-start;
    flex-direction: row;
    border-bottom: 1px solid var(--gray-3);
    padding: 0;
}
body:not(.mobile) .check-list li label {
    width: calc(100% - 1.4rem);
    padding: 6px 8px 6px calc(1.6rem + 8px);
    margin-left: calc(-1.6rem - 4px);
}
body:not(.mobile) .check-list li input[type="checkbox"] {
    width: 1.4rem;
    height: 1.4rem;
}


/* button
--------------------------------------- */
body:not(.mobile) .text-btn {
    padding: 2px 6px;
    margin-bottom: 6px;
}
body:not(.mobile) .text-btn:before {
    content: "";
    display: block;
    width: .6rem;
    height: .6rem;
    border-top: 1px solid var(--gray-6);
    border-left: 1px solid var(--gray-6);
    transform: rotate(-45deg);
}
body:not(.mobile) .text-btn.back:after {
    content: "戻る";
}


/* header
--------------------------------------- */
body:not(.mobile) header {
    min-width: 690px;
}


/* page header
--------------------------------------- */
body:not(.mobile) .col2.detail .page-header {
    position: relative;
    margin-top: calc(2rem + 6px);
}
body:not(.mobile) .col2.detail .page-header .text-btn {
    position: absolute;
    top: calc(-2rem - 6px);
    left: 0;
}
body:not(.mobile) .col2.add-edit .page-header .btn.gray {
    order: 1;
}
body:not(.mobile) .col2.add-edit .page-header > p {
    order: 2;
}
body:not(.mobile) .col2.add-edit .page-header .btn.orange {
    order: 1;
}
body:not(.mobile) .bottom-btn-area {
    border-right: 1px solid var(--gray-1);
    padding-right: 20px;
    margin-right: 10px;
}


/* main
--------------------------------------- */
body:not(.mobile) main {
    min-width: 690px;
}
body:not(.mobile) main.schedule {
    width: calc(100% - 4.8rem);
    position: relative;
    display: flex;
    padding-left: 4.8rem;
    background-color: #ffffff;
}

body:not(.mobile) main.nav-open {
    padding-left: 240px;
}
body:not(.mobile) main.nav-open.schedule {
    padding-left: 220px;
}


/* main content
--------------------------------------- */
body:not(.mobile) .add-edit .main-content,
body:not(.mobile) .detail .main-content {
    border: 1px solid var(--gray-1);
}
/* schedule */
body:not(.mobile) .schedule .main-content {
    height: 100%;
}
body:not(.mobile) .schedule .main-content-inner {
    width: 100%;
    height: 100%;
    overflow-x: auto;
}

/* col2 */
body:not(.mobile) .col2 .main-content {
    display: flex;
    gap: 10px 40px;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
}
body:not(.mobile) .col2 .main-content > * {
    width: calc(50% - 20px);
}


/* calendar contents
--------------------------------------- */
body:not(.mobile) .main-content-inner {
    padding-top: calc(3rem + 18px);
}
/* calendar - toolbar ************/
body:not(.mobile) .fc-toolbar.fc-header-toolbar {
    top: 4.8rem;
    left: 0;
    background-color: #ffffff;
    padding: 0 14px 0 14px!important;
    z-index: 230;
}
body:not(.mobile) main:not(.nav-open):not(.side-open) .fc .fc-toolbar.fc-header-toolbar {
    width: calc(100% - 9.6rem);
}
body:not(.mobile) main.nav-open:not(.side-open) .fc .fc-toolbar.fc-header-toolbar {
    width: calc((100% - 220px) - 4.8rem);
}
body:not(.mobile) main.side-open:not(.nav-open) .fc .fc-toolbar.fc-header-toolbar {
    width: calc(100% - 39.6rem);
}
body:not(.mobile) main.nav-open.side-open .fc .fc-toolbar.fc-header-toolbar {
    width: calc((100% - 220px) - 34.8rem);
}
body:not(.mobile) main:not(.nav-open):not(.side-open) .fc .fc-toolbar.fc-header-toolbar,
body:not(.mobile) main.side-open:not(.nav-open) .fc .fc-toolbar.fc-header-toolbar {
    left: 4.8rem;
}
body:not(.mobile) main.nav-open:not(.side-open) .fc .fc-toolbar.fc-header-toolbar,
body:not(.mobile) main.nav-open.side-open .fc .fc-toolbar.fc-header-toolbar {
    left: 220px;
}
body:not(.mobile) .fc-toolbar-title {
    min-width: 16.4rem;
    font-size: 2.4rem;
    color: var(--main-blue);
    padding-right: 4.2rem;
}
body:not(.mobile) .fc-toolbar .fc-toolbar-chunk:first-child {
    width: calc(100% - 5rem);
    gap: 0 12px;
}
body:not(.mobile) .fc-direction-ltr .fc-toolbar > * > :not(:first-child) {
    margin-left: 0;
}
body:not(.mobile) .fc-button.fc-timeGridDay-button {
    display: none;
}
body:not(.mobile) .fc-button.fc-timeGridWeek-button {
    border-top-right-radius: .25em !important;
    border-bottom-right-radius: .25em !important;
}
body:not(.mobile) .fc-toolbar .fc-button-group:last-of-type .fc-button-primary {
    border-color: var(--main-blue);
    color: var(--main-blue);
    width: 3.2rem;
    height: 3.2rem;
    padding: 0;
    line-height: 3rem;
}
body:not(.mobile) .fc-toolbar .fc-button-group:last-of-type .fc-button-active {
    background-color: var(--main-blue);
    color: #ffffff;
}
body:not(.mobile) .fc-button-group {
    padding-top: 8px;
    padding-bottom: 8px;
}
body:not(.mobile) .fc-prev-button {
    margin-right: 4px !important;
}
body:not(.mobile) .fc-button .fc-icon {
    color: var(--main-blue);
}

/* 「今日」ボタン */
body:not(.mobile) .fc-today-button {
    width: 4.4rem;
    background-color: #ffffff !important;
    color: var(--main-blue) !important;
    border-color: var(--main-blue) !important;
}

/* calendar func ************/
body:not(.mobile) .calendar-func {
    gap: 8px;
}
/* 日付選択 */
body:not(.mobile) .calendar-area .select-date {
    min-width: 16.4rem;
    height: 3.6rem;
    top: calc(4.8rem + 6px);
    left: calc((15.6rem + 22px) + .75em);
    background-position: right 8px center;
    background-size: 1.5rem;
}
body:not(.mobile).nav-open .calendar-area .select-date {
    left: calc(258px + 10.8rem);
}
body:not(.mobile) .nav-open .calendar-area .select-date {
    left: calc((10.8rem + 242px) + .75em);
}

/* カレンダー切替 */
body:not(.mobile) .select-kind input[type="radio"].day-for-sp + label {
    display: none;
}
body:not(.mobile) .calendar-area .select-kind label {
    width: 4rem;
    height: 3.2rem;
    line-height: 3.2rem;
}

/* カレンダー切替・グループ選択・社員選択 */
body:not(.mobile) .calendar-area .select-kind,
body:not(.mobile) .calendar-area .select-group,
body:not(.mobile) .calendar-area .select-member-area {
    padding: 0;
    border-color: var(--gray-1);
    background-color: #ffffff;
}
body:not(.mobile) .calendar-area .select-kind,
body:not(.mobile) .calendar-area .select-member-area {
    z-index: 240;
}
body:not(.mobile) .calendar-area .select-group-area {
    z-index: 241;
}
body:not(.mobile) .calendar-area .select-group-area .select-box {
    width: 16rem;
    min-width: 16rem;
}
body:not(.mobile) .calendar-area .select-member-area {
    width: auto;
    align-items: center;
    gap: 8px;
    border: 0;
}
body:not(.mobile) .calendar-area .select-member {
    width: 14.6rem;
    height: 3.2rem;
    border-bottom: 1px solid var(--gray-1);
    border-right-color: var(--gray-1);
    padding: initial;
}
body:not(.mobile) .selected-group {
    display: none;
}

/* calendar - table ************/
body:not(.mobile) .fc-timeGridWeek-view .fc-daygrid-body:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background: var(--fc-border-color);
    position: absolute;
    top: 2.4rem;
    left: 0;
}
body:not(.mobile) .fc-dayGridMonth-view .fc-col-header-cell-cushion {
    height: 2.4rem;
    line-height: 2.4rem;
    font-size: 1.2rem;
}
body:not(.mobile) .fc-timeGridWeek-view .fc-daygrid-day:not(.fc-day-mon):before {
    content: "";
    display: block;
    width: 1px;
    height: calc(100% - 2.4rem);
    background-color: var(--fc-border-color);
    position: absolute;
    top: 2.4rem;
    left: -.5px;
}
body:not(.mobile) .fc-timegrid-axis-cushion,
body:not(.mobile) .fc-timegrid-slot-label-cushion {
    font-size: 1.2rem;
}
body:not(.mobile) .calendar-area .fc-daygrid-day-frame {
    display: grid;
}
body:not(.mobile) .calendar-area .fc-daygrid-day-frame {
    grid-template-columns: 1fr 3rem;
}
body:not(.mobile) .calendar-area:not(.week) .fc-daygrid-day-top {
    grid-column: 1/3;
    grid-row: 1/2;
}
body:not(.mobile) .calendar-area .fc-daygrid-day-events {
    grid-column: 1/3;
    grid-row: 2/3;
}
body:not(.mobile) .calendar-area .fc-daygrid-day-frame > .fc-daygrid-day-bg {
    grid-column: 1/2;
}
body:not(.mobile) td .btn-add-event-day {
    grid-column: 2/3;
}

/* month */
body:not(.mobile) .calendar-area:not(.week):not(.day) .fc-daygrid-day-frame {
    grid-template-rows: 2.4rem 1fr;
}
body:not(.mobile) .calendar-area:not(.week):not(.day) .fc-daygrid-day-frame > .fc-daygrid-day-bg,
body:not(.mobile) .calendar-area:not(.week):not(.day) td .btn-add-event-day {
    grid-row: 3/4;
}

/* week */
body:not(.mobile) .calendar-area.week .fc-daygrid-day-frame {
    grid-template-rows: 1fr;
}
body:not(.mobile) .calendar-area.week .fc-daygrid-day-events {
    grid-row: 1/2;
    grid-column: 1/3;
}
body:not(.mobile) .calendar-area.week td .btn-add-event-day {
    grid-row: 2/3;
    grid-column: 2/3;
}

/* day */
.fc-bg-event.mus-hol {
    opacity: 1 !important;
}
body:not(.mobile) .fc-timegrid-body {
    width: auto !important;
}
body:not(.mobile) .fc-daygrid-day.fc-day-today:not(.mus-hol) {
    background-color: var(--pale-yellow-1);
}
body:not(.mobile) .calendar-area.day .fc-timegrid-axis-frame {
    align-items: flex-start;
}
body:not(.mobile) .calendar-area.day .fc-timegrid-axis-frame .fc-timegrid-axis-cushion {
    margin-top: 2.6rem;
}
body:not(.mobile) .calendar-area.day .fc-daygrid-day-frame {
    grid-template-rows: 2.2rem 1fr;
}
body:not(.mobile) .calendar-area.day .fc-daygrid-day-frame > .fc-daygrid-day-events,
body:not(.mobile) .calendar-area.week .fc-daygrid-day-frame > .fc-daygrid-day-events {
    margin-bottom: .2rem;
}
body:not(.mobile) .calendar-area.day .fc-daygrid-day-frame::after,
body:not(.mobile) .calendar-area.day .fc-daygrid-day-frame::before {
    content: none;
}
body:not(.mobile) .calendar-area.day td .btn-add-event-day {
    grid-row: 2/4;
    grid-column: 2/3;
    margin: auto 0 0 auto;
}
body:not(.mobile) .calendar-area.day .fc-daygrid-day-frame > .fc-daygrid-day-bg {
    min-height: 1.9rem;
    grid-column: 1/2;
    grid-row: 3/4;
}

/* 予定追加ボタン */
body:not(.mobile) .fc-addEvent-button {
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 50%;
    padding: 0;
}
body:not(.mobile) .fc-button-primary.fc-addEvent-button:active {
    background-color: rgb(148, 161, 169, 10%) !important;
}
body:not(.mobile) .fc-button-primary.fc-addEvent-button:hover {
    background-color: var(--form-bg-color);
}

/* calendar - date ***************/
body:not(.mobile) .fc-view .fc-daygrid-day-number {
    width: 2.4rem !important;
    height: 2.4rem !important;
    line-height: calc(2.4rem - 8px)  !important;
    font-size: 1.4rem;
    margin-bottom: 2px;
}

/* calendar - events *************/
body:not(.mobile) .fc-daygrid-event-harness,
body:not(.mobile) .fc-daygrid-day-bottom {
    padding-top: 4px;
}
/* 終日 */
body:not(.mobile) .fc-h-event .fc-event-title-container {
    padding: 0 .2rem;
}
body:not(.mobile) .fc-daygrid-block-event .fc-event-title {
    padding: 0 0 0 .1rem;
}
/* 時間指定 */
body:not(.mobile) .fc-daygrid-dot-event .fc-event-time {
    font-size: 1.2rem;
}
body:not(.mobile) .fc-daygrid-dot-event .fc-event-title {
    font-weight: normal;
}
body:not(.mobile) .fc-daygrid-block-event .fc-event-time {
    line-height: 1.4;
}

/* calendar - week/day *************/
body:not(.mobile) .calendar-area.week {
    position: relative;
}

/* date header */
body:not(.mobile) .date-header {
    position: sticky;
    width: 100%;
    top: 0;
    left: 0;
    border-top: 1px solid var(--gray-2);
    border-bottom: 0;
}
body:not(.mobile) .calendar-area.week .date-header {
    padding-left: calc(100%/8)
}
body:not(.mobile) .week-cal .fc-theme-standard {
    width: calc(100% - (100%/8));
}
body:not(.mobile) .calendar-area.week .cal-ttl {
    width: calc(100%/8);
    padding: 8px 12px;
}
body:not(.mobile) .calendar-area.week .sub-info {
    font-size: 1.1rem;
    color: var(--gray-5);
    line-height: 1.4;
    margin-top: 4px;
}

/* calendar - week - today */
body:not(.mobile) .fc-timeGridWeek-view .fc-daygrid-day.fc-day-today {
    position: relative;
}
body:not(.mobile) .fc-timeGridWeek-view .fc-daygrid-day.fc-day-today:after {
    content: "";
    display: block;
    width: 100%;
    height: calc((100% - 2.4rem) - 1px);
    background-color: var(--pale-yellow-1);
    position: absolute;
    top: calc(2.4rem + 1px);
    left: 0;
}


/* form
--------------------------------------- */
body:not(.mobile) main.detail .main-content {
    position: relative;
}
body:not(.mobile) .form,
body:not(.mobile) .form .form-content {
    font-size: 1.5rem;
}
body:not(.mobile) .add-edit .select-box {
    display: inline-block;
}
body:not(.mobile) .add-edit .form-repeat .select-box {
    width: auto;
}
body:not(.mobile) .form .content-ttl {
    font-size: 1.35rem;
}

/* add/edit - schedule */
body:not(.mobile) .col2 .add-edit .form:not(.schedule-ttl):not(.participant) {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 40px;
}
body:not(.mobile) .add-edit .form > li:not(.li-place):not(.li-status),
body:not(.mobile) .add-edit .form:not(.schedule-ttl):not(.participant) > div {
    width: 100%;
}
body:not(.mobile) .btn.add-participant {
    display: none;
}

/* add/edit - switch */
body:not(.mobile) .switch.todo {
    width: auto !important;
    position: absolute;
    top: calc(-3.2rem - 8px);
    left: 12rem;
    background-color: #ffffff;
}
body:not(.mobile) .switch.todo label {
    width: 6rem;
    height: 3.2rem;
}

/* add/edit - schedule - 日時 */
body:not(.mobile) .form.schedule-ttl {
    margin-right: calc(50% + 20px);
}
body:not(.mobile) .form-date {
    position: relative;
    margin-bottom: 0;
}
body:not(.mobile) .form-date > div:first-child {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
body:not(.mobile) .form-date .select-area {
    height: 3.2rem;
    flex-direction: row-reverse;
    justify-content: flex-end;
}
body:not(.mobile) .form-date input[type="checkbox"] {
    order: 3;
    margin-right: 6px;
}
body:not(.mobile) .form-date label:first-child {
    width: 11rem;
    order: 2;
}
body:not(.mobile) .form-date .ampm-btn-area {
    order: 1;
    width: auto;
}
body:not(.mobile) .form-date > ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 30px;
    margin-top: 8px;
}
body:not(.mobile) .form-date > ul li {
    align-items: center;
    gap: 10px;
}
body:not(.mobile) .form-date > ul li:not(:first-child) {
    margin-top: 0 !important;
}
body:not(.mobile) .form-date > ul li > p {
    width: 4.4rem;
    font-size: 1.4rem;
}

/* add/edit - schedule - 繰り返し */
body:not(.mobile) .form-repeat {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px 20px;
}
body:not(.mobile) .form-repeat > li {
    gap: 10px;
}
body:not(.mobile) .add-edit li.end-date {
    width: auto;
    display: flex;
    margin-bottom: 0;
}
body:not(.mobile) .add-edit li.end-date > div:first-child {
    flex-direction: row-reverse;
    justify-content: flex-end;
    width: auto;
}
body:not(.mobile) .add-edit li.end-date > div:first-child input[type="checkbox"] {
    margin-right: 6px;
}
body:not(.mobile) .add-edit li.end-date > div:last-child {
    padding: 0;
    margin-left: 10px;
}

/* add/edit - schedule - 分類 */
body:not(.mobile) .add-edit .form-bunrui .input-area > div > p {
    width: 8rem;
}

/* add/edit - schedule - 通知 */
body:not(.mobile) .form-notification li:first-child,
body:not(.mobile) .form-content.check-area {
    flex-direction: row-reverse;
    margin-right: 20px;
}
body:not(.mobile) .form-notification li label:first-of-type,
body:not(.mobile) .form-content.check-area label:first-of-type {
    order: 1;
}
body:not(.mobile) .form-notification li input[type="checkbox"],
body:not(.mobile) .form-content.check-area input[type="checkbox"] {
    order: 2;
}

/* add/edit - todo - 状況 */
body:not(.mobile) .form-content.check-area {
    justify-content: flex-end;
    line-height: 3rem;
}

/* add/edit - schedule - 参加者 */
body:not(.mobile) .form-content.participant .number {
    font-size: 1.5rem;
}
body:not(.mobile) .add-edit .participant > .member-list {
    height: 28rem;
    border: 1px solid var(--gray-1);
}
body:not(.mobile) .add-edit .participant .member-list li {
    position: relative;
    flex-direction: row;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
}
body:not(.mobile) .add-edit .participant .member-list li:first-child {
    border-top: 0;
}
body:not(.mobile) .add-edit .participant .member-list .li-content {
    padding-left: 4.2rem;
}
body:not(.mobile) .add-edit .participant .member-list label {
    display: none;
}
body:not(.mobile) .form.participant .btn.red-border {
    font-size: 1.4rem;
    padding: 2px 6px;
}
body:not(.mobile) .modal.participant {
    position: unset;
    display: block;
    background-color: transparent;
}
body:not(.mobile) .modal.participant .modal-content {
    width: 100%;
    height: auto;
    position: unset;
    transform: unset;
    -webkit-transform: unset;
    -ms-transform: unset;
}
body:not(.mobile) .modal.participant .modal-inner {
    height: 34rem;
    border: 1px solid var(--gray-1);
    border-radius: 4px;
    padding: 0;
}
body:not(.mobile) .modal.participant .modal-inner .search-area {
    height: 4.4rem;
    background-color: transparent;
    padding: 6px;
    margin-bottom: 0;
}
body:not(.mobile) .modal.participant .modal-inner .search-area ul {
    flex-direction: row;
    gap: 12px;
    align-items: flex-end;
}
body:not(.mobile) .modal.participant .search-area .select-box,
body:not(.mobile) .modal .search-area input[type="text"] {
    max-width: 16rem;
}
body:not(.mobile) .modal .search-area input[type="text"] {
    border: 1px solid var(--gray-1) !important;
}
body:not(.mobile) .modal.participant .modal-inner .search-result-area .btn-select-all,
body:not(.mobile) .modal.participant .member-list label {
    display: none;
}
body:not(.mobile) .modal.participant .member-list {
    height: 100%;
    outline: 0;
    border: 1px solid var(--gray-1);
}
body:not(.mobile) .modal.participant .modal-inner .member-list li {
    border-color: var(--gray-2);
}
body:not(.mobile) main.add-edit .form.participant .member-list .li-content {
    display: flex;
    align-items: center;
    text-align: left;
}
body:not(.mobile) .form-content.participant .right,
body:not(.mobile) .modal.participant .modal-header,
body:not(.mobile) .modal.participant button[class^="btn-modal"] {
    display: none;
}
body:not(.mobile) .select-li .ic-btn.total-list {
    width: 2.4rem;
    height: 2.4rem;
    margin-right: .8rem;
}

/* 削除ボタン */
body:not(.mobile) .form + .btn.red-border {
    width: auto;
    position: absolute;
    top: calc(-3.2rem - 8px);
    margin: 0;
    right: calc(10.8rem + 30px);
}

/* add/edit - todo - 重要度 */
body:not(.mobile) .add-edit .li-importance .check-btn-area {
    justify-content: flex-start;
}
body:not(.mobile) .add-edit .li-importance label {
    width: 8rem !important;
}

/* add/edit - facility - 施設名 */
body:not(.mobile) .add-edit .facility-name .select-box {
    width: auto;
    border: 1px solid var(--gray-1);
}
body:not(.mobile) .add-edit .facility-name .select-box:first-child {
    width: 12.8rem;
}
body:not(.mobile) .add-edit .facility-name .select-box:last-child {
    width: calc(100% - (12.8rem + 8px));
}


/* detail - schedule - 分類 */
body:not(.mobile) .detail .form .bunrui-list ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0 8px;
}

/* detai - schedule - 参加者 */
body:not(.mobile) .detail .form.participant .member-list li:last-child {
    border-bottom: 0;
}


/* member list
--------------------------------------- */
body:not(.mobile) .member-list li {
    justify-content: flex-start;
}
body:not(.mobile) .member-list li p {
    display: block;
}
body:not(.mobile) .member-list li .m-info {
    display: flex;
    align-items: center;
    width: 100%;
}
body:not(.mobile) .member-list li .m-name-position {
    display: flex;
    align-items: center;
    width: 34%;
}
body:not(.mobile) .member-list li .m-name {
    width: 61%;
}
body:not(.mobile) .member-list li .m-position {
    width: 39%;
}
body:not(.mobile) .member-list li .m-busho {
    width: calc(64% - 3.2rem) !important;
}
body:not(.mobile) .member-list li p:not(.m-name) {
    font-size: 1.2rem;
}


/* edit member form
--------------------------------------- */
body:not(.mobile) .edit-member-form li.selected {
    background-color: var(--pale-yellow-1);
}
body:not(.mobile) .edit-member-form .search-area {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 4.4rem;
    padding: 6px;
}
body:not(.mobile) .edit-member-form .search-area .search {
    width: 20rem;
}
body:not(.mobile) .edit-member-form .search-result-area {
    height: calc((100% - 4.4rem) - 6px);
    border-radius: 4px;
    margin: 0 6px 6px;
    overflow-y: auto;
}

/* edit member form - button area */
body:not(.mobile) .edit-member-form .btn-area {
    width: 100%;
    height: 4.6rem;
    justify-content: center;
    align-items: center;
    gap: 1.6rem;
}
body:not(.mobile) .edit-member-form .btn-area .add-member,
body:not(.mobile) .edit-member-form .btn-area .remove-member {
    padding-left: 3rem;
    background-repeat: no-repeat;
    background-position: .8rem center;
    background-size: 1.4rem;
}
body:not(.mobile) .edit-member-form .btn-area .add-member {
    background-color: var(--main-blue);
    border-color: var(--main-blue);
    color: #ffffff;
    background-image: url(../img/ic_add_member.svg);
}
body:not(.mobile) .edit-member-form .btn-area .remove-member {
    background-color: #ffffff;
    border-color: var(--main-blue);
    color: var(--main-blue);
    background-image: url(../img/ic_remove_member.svg);
}


/* modal
--------------------------------------- */
body:not(.mobile) .modal-header p {
    font-size: 1.5rem;
}
body:not(.mobile) .li-ttl {
    color: var(--gray-6);
    font-size: 1.3rem;
}


/* side
--------------------------------------- */
/* menu */
body:not(.mobile) .side-menu-area {
    top: 4.8rem;
    right: 0;
    display: flex;
    height: 100%;
    border-left: 1px solid var(--gray-1);
    background-color: #ffffff;
    z-index: 240;
}
body:not(.mobile) .side-open .side-menu-area {
    right: 30rem;
}
body:not(.mobile) .side-menu-area ul {
    flex-direction: column;
}
body:not(.mobile) .side-menu-area li {
    width: auto;
}
body:not(.mobile) .side-menu-area .menu-bar {
    width: 4.8rem;
    height: calc(100% - 4.8rem);
}
body:not(.mobile) .side-menu-area li span:first-child {
    width: 3.2rem;
    height: 3.2rem;
    box-shadow: none;
}
body:not(.mobile) .side-menu-area .li-card span:first-child {
    background-image: url(../img/side_btn_card.svg);
}
body:not(.mobile) .side-menu-area .li-notif .notif-num {
    min-width: 1.8rem;
    height: 1.8rem;
    border-radius: .9rem;
    line-height: 1.8rem;
    font-size: 1.15rem;
}

/* content */
body:not(.mobile) .side-content {
    position: fixed;
    top: 4.8rem;
    right: 0;
    width: 30rem;
    min-width: 240px;
    height: calc(100% - 4.8rem);
    border-left: 1px solid var(--gray-2);
    font-size: 1.5rem;
    z-index: 240;
}
body:not(.mobile) .side-content .side-ttl {
    padding: 4px 10px;
}
body:not(.mobile) .side-main-content {
    position: relative;
}

/* side open */
body:not(.mobile) main.side-open {
    width: calc((100% - 4.8rem) - 30rem);
}


/* side
--------------------------------------- */
/* detail - schedule - 分類 */
body:not(.mobile) .detail .form .bunrui-list ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0 8px;
}

/* detail - todo - 状況 */
body:not(.mobile) .detail .li-done .form-content .btn {
    height: 2.8rem;
    line-height: calc(2.8rem - 1px);
    padding: 0 .8rem;
}

/* detail - schedule - 参加者 */
body:not(.mobile) .detail .form.participant .member-list li:last-child {
    border-bottom: 0;
}


/* side(todo)
--------------------------------------- */
body:not(.mobile) .side-content .btn-back {
    display: none;
}
body:not(.mobile) .side-todo .side-main-content {
    padding: 0 10px 40px;
    height: calc(100% - 40px);
}
body:not(.mobile) .show-completed-btn-area {
    width: calc(30rem - 1px);
    height: 40px;
    padding: 0 10px;
}
body:not(.mobile) p.li-ttl.todo-title {
    font-size: 1.43rem;
    color: var(--main-text-color);
}
body:not(.mobile) .side-content .sort-select li {
    width: 6.4rem;
    height: 2.6rem;
    line-height: calc(2.6rem - 1px);
    font-size: 1.3rem;
}

/* 通知 */
body:not(.mobile) .notif-content p {
    font-size: 1.3rem;
    line-height: 1.4;
}


/* todo modal
--------------------------------------- */
body:not(.mobile) .modal.todo .modal-inner > ul > li {
    display: flex;
    align-items: flex-start;
}
body:not(.mobile) .modal.todo .modal-inner ul li p {
    line-height: 3.2rem;
    font-size: 1.35rem;
}
body:not(.mobile) .modal.todo .modal-inner > ul > li > p {
    width: 8rem;
}
body:not(.mobile) .modal.todo .modal-inner > ul > li > *:not(p) {
    width: calc(100% - 8rem);
}
body:not(.mobile) .modal.todo .modal-inner ul li ::placeholder {
    opacity: 0;
}
body:not(.mobile) .modal.todo .modal-inner ul li input[type="time"] {
    width: auto;
}


/* ミュージアム仮予約
--------------------------------------- */
/* 登録 *********************************/
body:not(.mobile) .m-plan.col2 .main-content {
    flex-direction: column;
}
body:not(.mobile) .m-plan.add-edit .li-guest-name input[type="text"] {
    max-width: 18rem;
}

/* 詳細 *********************************/
body:not(.mobile) .m-plan .main-content .slot-ttl > div {
    display: flex;
    gap: 6px;
}
body:not(.mobile) .m-plan.detail .rsv-list .rsv-label {
    font-size: 1.3rem;
}
body:not(.mobile) .m-plan.detail .rsv-list .guest-name {
    font-size: 1.5rem;
}
body:not(.mobile) .m-plan.detail .rsv-list .li-add {
    min-height: 14.3rem;
}
body:not(.mobile) .m-plan.add-edit .bottom-btn-area {
    border-right: 1px solid var(--gray-1);
    padding-right: 20px;
    margin-right: 10px;
}

/* 人数 */
body:not(.mobile) .m-plan.add-edit .li-num-of-ppl {
    justify-content: flex-start;
}
body:not(.mobile) .m-plan.add-edit .li-num-of-ppl .form-content {
    max-width: 32rem;
}


/* responsive
--------------------------------------- */
/* add/edit - schedule - 繰り返し */
@media screen and (min-width: 768px) and (max-width: 1020px) {
    body:not(.mobile) .add-edit .form-repeat li {
        justify-content: flex-start;
    }
    body:not(.mobile) .add-edit li.end-date {
        justify-content: flex-start;
    }
}

/* add/edit - calendar - 分類 */
@media screen and (min-width: 1024px) {
    body:not(.mobile) .add-edit .form-bunrui .input-area > ul {
        flex-direction: row !important;
        flex-wrap: wrap;
        gap: 0 8px;
        align-items: stretch;
    }
    body:not(.mobile) .add-edit .form-bunrui .input-area > ul li {
        width: calc(50% - 4px);
    }
}

/* toolbar, calendar func */
@media screen and (min-width: 1001px) and (max-width: 1200px) {
    body:not(.mobile) main.nav-open:not(.side-open) .calendar-func {
        left: calc(30.8rem + 368px);
    }
}
@media screen and (min-width: 1001px) and (max-width: 1330px) {
    body:not(.mobile) main.side-open:not(.nav-open) .calendar-func {
        left: calc(35.6rem + 148px);
    }
}
@media screen and (min-width: 1331px) {
    body:not(.mobile) main.side-open:not(.nav-open) .calendar-func {
        right: calc(38rem + 34px);
    }
}
@media screen and (min-width: 1000px) and (max-width: 1496px) {
    body:not(.mobile) main.nav-open.side-open .calendar-func {
        left: calc(30.8rem + 368px);
    }
}
@media screen and (min-width: 1497px) {
    body:not(.mobile) main.nav-open.side-open .calendar-func {
        right: calc(38rem + 34px);
    }
}
@media screen and (min-width: 1096px) {
    body:not(.mobile) .calendar-area,
    body:not(.mobile) .fc-toolbar.fc-header-toolbar,
    body:not(.mobile) .date-header {
        min-width: 963px;
    }
    body:not(.mobile) .calendar-func {
        top: calc(4.8rem + 8px);
    }
    body:not(.mobile) main:not(.nav-open):not(.side-open) .calendar-func {
        right: calc(8rem + 24px);
    }
}
@media screen and (min-width: 1201px) {
    body:not(.mobile) main.nav-open:not(.side-open) .calendar-func {
        right: calc(8rem + 34px);
    }
}



/******************************************************
TAB
*******************************************************/
@media screen and (max-width: 1095px) {
    body .detail .main-content ul.form:last-of-type:not(:first-child) {
        margin-top: 36px;
    }

    /* calendar
    --------------------------------------- */
    body:not(.mobile) .calendar-area,
    body:not(.mobile) .fc-toolbar,
    body:not(.mobile) .date-header {
        min-width: 54.6rem;
    }
    body:not(.mobile) .main-content-inner {
        padding-top: calc(6.2rem + 30px);
    }
    body:not(.mobile) .fc-toolbar {
        height: calc(6.2rem + 30px);
        align-items: flex-start;
        padding-bottom: 10px;
    }
    body:not(.mobile) .fc-toolbar .fc-toolbar-chunk:first-child {
        flex-wrap: wrap;
    }
    body:not(.mobile) .fc-toolbar .fc-toolbar-chunk:last-child {
        position: absolute;
        right: 8px;
        bottom: 10px;
    }
    body:not(.mobile) .fc-addEvent-button:before {
        top: 50%;
        transform: translateY(-50%);
        -webkti-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        left: -6.4rem;
    }
    body:not(.mobile) .fc-button-group:first-of-type {
        border-right: 0;
    }

    /* calendar func */
    body:not(.mobile) .calendar-func {
        top: calc(7.8rem + 20px);
    }
    body:not(.mobile) main:not(.nav-open):not(.side-open) .calendar-func,
    body:not(.mobile) main.side-open:not(.nav-open) .calendar-func {
        left: calc(4.8rem + 14px);
    }
    body:not(.mobile) main.nav-open:not(.side-open) .calendar-func,
    body:not(.mobile) main.nav-open.side-open .calendar-func {
        left: 234px;
    }


    /* 予定・実績登録
    --------------------------------------- */
    body:not(.mobile) .col2 .main-content {
        display: block;
    }
    body:not(.mobile) .col2 .main-content > * {
        width: 100%;
    }

}



/******************************************************
hover
*******************************************************/
a:hover,
input:not(:disabled):hover,
select:not(:disabled):hover,
input[type="file" i]::-webkit-file-upload-button:hover,
button:not(:disabled):hover,
.calendar-area .select-date:hover,
.side-menu-area li,
label:not(:has(input:disabled)):hover,
th.sort:hover,
p.sort:hover,
.closed nav .nav-ttl:hover,
.side-content .sort-select li:hover,
.fc .fc-dayGridMonth-view .fc-daygrid-day-frame:hover,
.calendar-area.week .cal-ttl:not(.m-cal-area .cal-ttl):hover,
.detail .form.participant .number:hover,
main.group-member:not(.edit-member) .left li:not(.li-header):not(.li-no-content):hover,
main.edit-member .right li:not(.li-header):hover,
.main.group-member.member-edit .member-list li:not(.selected):hover,
main.master.job tr:hover td,
main.master.room tr:hover td,
.edit-member-form li:not(.search-area li):hover,
.fc-view:not(.fc-timeGridWeek-view):not(.fc-timeGridDay-view) .fc-daygrid-day-frame:hover,
.select-group-area .select-box:hover,
.select-group-area li:hover,
main.m-cal table td.detail-td:hover,
.museum .guest-info-box.add:hover,
.modal.get-guest-info .result-area .result-content > ul > li,
body:not(.mobile) .m-plan.detail .rsv-list .li-add:hover {
    cursor: pointer;
}
input:disabled,
button:disabled,
.select-kind input[type="radio"]:checked + label:hover,
.fc .fc-button-primary:disabled:hover,
.fc .fc-timeGridWeek-view .fc-daygrid-day-number:hover,
.fc-scrollgrid-section-header a:hover {
    cursor: default;
}

@media (hover) {
    .btn:not(:disabled):hover,
    .ic-btn.add.gray:hover,
    .ic-btn.delete.gray:hover {
        filter: brightness(.92);
    }
    .ic-btn:not(.master table td .ic-btn):hover,
    .museum .guest-info-box.add:hover {
        background-color: var(--form-bg-color) !important;
    }
    .master.rsv-list .ic-btn.detail:hover,
    .master.rsv-list .ic-btn.qa:hover,
    .master table td .ic-btn:hover {
        filter: brightness(.95) !important;
    }
    .text-btn:hover {
        background-color: rgba(164, 180, 191, .16);
    }
    .toggle-btn:hover {
        opacity: .7;
    }
    .btn.blue:hover,
    .ic-btn.blue:hover {
        filter: brightness(.85);
        background-color: var(--main-blue);
    }
    .btn.orange-border:hover,
    .ic-btn.orange-border:hover {
        background-color: var(--pale-orange) !important;
        filter: brightness(1);
    }
    .btn.red-border:hover,
    .ic-btn.red-border:hover {
        background-color: var(--pale-red-1);
        filter: brightness(1);
    }
    .btn.no-bg:hover,
    .ic-btn.no-bg:hover {
        background-color: var(--form-bg-color);
    }
    .ic-btn.orange:hover,
    .ic-btn.blue:hover {
        filter: brightness(.9);
    }
    .ic-btn.orange:not(.save):hover {
        background-color: var(--main-orange) !important;
    }
    .ic-btn.blue:hover {
        background-color: var(--main-blue) !important;
    }
    th .ic-btn:hover {
        background-color: #dbe3e8;
    }
    .dg-func-ctl .btn.i-btn:hover {
        filter: brightness(.85);
    }
    .dg-func-ctl .btn.i-btn.gray:hover,
    .modal.err .btn.gray:hover {
        background-color: var(--form-bg-color);
        filter: brightness(1);
    }
    .btn-search:not(.ic-btn):hover,
    .btn-clear:hover {
        filter: brightness(.9);
    }
    .modal.err label:hover span {
        background-color: var(--form-bg-color);
    }
    .main-content > .search-area .btn-search:hover {
        background-color: var(--form-bg-color);
    }
    input[type="file"]:hover {
        opacity: .7;
    }
    .fc-list-event:hover {
        background-color: var(--form-bg-color);
    }

    /* button caption ***********************/
    .ic-btn .caption,
    .btn-logout .caption,
    .btn-manual .caption,
    .side-menu-area li .caption,
    .calendar-header .cal-func-btn button .caption {
        position: absolute;
        top: -2.8rem;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        font-size: 1.1rem;
        color: #ffffff;
        white-space: nowrap;
        background-color: rgba(40, 40, 40, .85);
        padding: 4px 8px;
        border-radius: 3rem;
    }
    .btn-logout .caption,
    .btn-manual .caption {
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
    }
    .btn-logout .caption {
        left: unset;
        right: 3.6rem;
    }
    .btn-manual .caption {
        left: 3.6rem;
    }
    .ic-btn:not(:disabled):hover .caption,
    .btn-logout:hover .caption,
    .btn-manual:hover .caption,
    .calendar-header .cal-func-btn button:hover .caption {
        display: block !important;
    }
    .ic-btn:hover .caption:hover,
    .btn-logout:hover .caption:hover,
    .side-menu-area li:hover .caption:last-child:hover,
    .calendar-header .cal-func-btn button:hover .caption:hover {
        display: none;
    }

    /* button caption - table */
    main.m-cal td.memo .edit .caption {
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        left: unset;
        right: 3rem;
    }
    main.m-cal td.memo .save .caption {
        margin-left: -.3rem;
    }

    /* button caption - 新規取得物件 */
    .side-content .side-ttl .ic-btn .caption,
    .side-content .card-header .ic-btn .caption {
        right: 3.4rem;
        left: unset;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
    }
    main.report .side-content .side-card-header .ic-btn:first-of-type .caption {
        left: 0;
        transform: unset;
        -webkit-transform: unset;
        -ms-transform: unset;
    }
    
    /* button caption - 営業日報 */
    main.report table .ic-btn .caption {
        top: 50%;
        left: 2.8rem;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        z-index: 10;
    }
    main.master.report .side-card .ic-btn.side-close .caption {
        top: calc(50% - 4rem);
    }

    /* button caption - calendar */
    .calendar-area .select-member-area .btn-select-me .caption {
        top: unset;
        bottom: -3rem;
        left: 48%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
    }
    .fc .fc-addEvent-button:before {
        content: "新規追加";
        position: absolute;
        top: -2.8rem;
        left: 48%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        font-size: 1.1rem;
        color: #ffffff;
        white-space: nowrap;
        background-color: rgba(40, 40, 40, .85);
        padding: 4px 8px;
        border-radius: 3rem;
    }
    .fc .fc-addEvent-button:hover:before {
        display: block;
    }
    .fc .fc-toolbar .fc-button-group:last-of-type .fc-button-primary:before {
        position: absolute;
        top: -2.8rem;
        left: 48%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        font-size: 1.1rem;
        color: #ffffff;
        white-space: nowrap;
        background-color: rgba(40, 40, 40, .85);
        padding: 4px 8px;
        border-radius: 3rem;
        line-height: 1.4;
        display: none;
    }
    .calendar-area:not(.week):not(.day) .fc .fc-toolbar .fc-button-group:last-of-type .fc-prev-button:before {
        content: "前の月へ";
    }
    .calendar-area:not(.week):not(.day) .fc .fc-toolbar .fc-button-group:last-of-type .fc-next-button:before {
        content: "次の月へ";
    }
    .week .fc .fc-toolbar .fc-button-group:last-of-type .fc-prev-button:before,
    .day .fc .fc-toolbar .fc-button-group:last-of-type .fc-prev-button:before {
        content: "前の週へ";
    }
    .week .fc .fc-toolbar .fc-button-group:last-of-type .fc-next-button:before,
    .day .fc .fc-toolbar .fc-button-group:last-of-type .fc-next-button:before {
        content: "次の週へ";
    }
    .fc .fc-toolbar .fc-button-group:last-of-type .fc-button-primary:hover:before {
        display: block;
    }

    /* button caption - nav */
    .closed nav > ul > li:not(.current) a:hover p,
    .closed nav .nav-ttl:hover .caption {
        display: block;
        position: absolute;
        left: calc(4.8rem + 6px);
        font-size: 1.2rem;
        background-color: rgba(40, 40, 40, .85);
        padding: 4px 8px;
        border-radius: 3rem;
        z-index: 1;
    }
    .closed nav .nav-ttl:hover span:hover {
        display: none;
    }

    /* button caption - side */
    .side-menu-area li:hover .caption {
        display: block;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        left: unset;
        right: 3.6rem;
    }

    /* button caption - 職種/施設管理 */
    main.master.job tr:not(:nth-child(2)) button:not(.save):not(.cancel) .caption,
    main.master.room tr:not(:nth-child(2)) button:not(.save):not(.cancel) .caption {
        display: none !important;
    }

    /* button caption - 予約カレンダー */
    .calendar-header .cal-func-btn button:last-child span {
        transform: translateX(-50%) rotate(180deg);
        -webkit-transform: translateX(-50%) rotate(180deg);
        -ms-transform: translateX(-50%) rotate(180deg);
        top: unset;
        bottom: -2.8rem;
    }    

    /* check list ***************************/
    .check-list li:hover {
        background-color: var(--pale-blue-2);
    }

    /* switch *******************************/
    .switch label:hover:before {
        background-color: rgba(164, 180, 191, .16);
        filter: brightness(.95);
    }
    .switch.triple label:hover:after,
    .switch.triple label:hover + label:after {
        content: none;
    }

    /* table ********************************/
    .table-func .pagination button:first-child:not(:disabled):hover,
    .table-func .pagination button:last-child:not(:disabled):hover {
        filter: invert(96%) sepia(100%) saturate(449%) hue-rotate(174deg) brightness(415%) contrast(84%);
        border-color: #ffffff;
    }
    .table-func .pagination button:not(:disabled):not(:last-child):hover {
        background-color: var(--main-blue);
        color: #ffffff;
    }
    th.sort:hover,
    p.sort:hover {
        opacity: .65;
    }

    /* nav *********************************/
    nav li a:hover,
    .closed nav .nav-ttl:not(.current):hover {
        background-color: rgba(255, 255, 255, .1);
    }
    .nav-btn:hover {
        background-color: #34587e;
    }

    /* side ********************************/
    .side-menu-area li:hover:before {
        position: absolute;
        right: 4.4rem;
        font-size: 1.1rem;
        color: #ffffff;
        white-space: nowrap;
        background-color: rgba(40, 40, 40, .85);
        padding: 4px 8px;
        border-radius: 3rem;
    }
    main.master.report .side-card .ic-btn.side-close:hover {
        background-color: var(--form-bg-color);
    }
    .side-content .sort-select li:hover {
        background-color: var(--form-bg-color);
    }

    /* todo ********************************/
    .todo-list .btn-list-detail.visible {
        display: none;
    }    
    .todo-list li:hover .btn-list-detail {
        display: block;
    }
    .btn-show-completed:hover,
    .btn-detail-edit a:hover {
        opacity: .6;
    }
    .modal.todo .check-btn-area label:hover {
        background-color: var(--form-bg-color);
    }

    /* calendar *****************************/
    .fc-today-button:not(:disabled):hover,
    .fc-prev-button:hover,
    .fc-next-button:hover,
    .fc-daygrid-dot-event.fc-event-mirror,
    .fc-daygrid-dot-event:not(.m-cal-area .fc-daygrid-dot-event):hover,
    .fc .fc-button-primary:not(.fc-button-active):not(:disabled):hover,
    .calendar-area .select-member-area .btn-select-me:hover,
    .calendar-area .select-kind label:hover,
    .m-cal .cal-func-btn .btn-update-date:hover {
        background-color: rgb(148, 161, 169, .1) !important;
    }
    .m-cal-area .fc-daygrid-dot-event:hover {
        background-color: transparent;
    }
    .pointer-non:hover {
        cursor: default;
    }
    body:not(.mobile) .calendar-area:not(.day) .fc-view .fc-daygrid-day-number:hover,
    td .btn-add-event-day:hover {
        background-color: rgba(164, 180, 191, .16);
    }
    .fc-view:not(.fc-dayGridMonth-view) .fc-daygrid-day.fc-day-today .fc-daygrid-day-number:hover {
        filter: brightness(.85);
    }
    .fc-h-event:hover {
        filter: brightness(.9);
    }
    .calendar-area .select-date input[type="date"]:hover,
    .calendar-header .select-date input[type="date"]:hover {
        background-color: rgba(164, 180, 191, .16);
    }
    .calendar-area.week .fc .fc-daygrid-day-frame:hover {
        background-color: var(--form-bg-color);
    }

    /* museum calendar **********************/
    body:not(.mobile) .m-cal-btn:hover {
        background-color: var(--form-bg-color);
    }
    main.m-cal table td.detail-td:hover {
        filter: brightness(.95)
    }

    /* calendar - グループ選択・社員検索 */
    .calendar-area .group-menu-content li:not(.active):hover,
    .calendar-area .search-member-area li:not(.active) p:hover {
        background-color: var(--form-bg-color);
    }

    /* others *******************************/
    .add-edit .form-bunrui .input-area label {
        width: 100%;
    }

    .detail .form.participant .number:hover {
        filter: brightness(.97);
    }

    .order-func button:not(:disabled):hover {
        background-color: var(--form-bg-color) !important;
    }
    .modal.participant label:hover + .li-content {
        background-color: var(--pale-blue-2);
    }
    
    .btn-select-all:hover {
        filter: brightness(.96);
    }
    
    .btn-modal-close:hover {
        background-color: var(--form-bg-color);
    }
    .btn-modal-orange:hover,
    .btn-modal-gray-border:hover {
        filter: brightness(.92);
    }
    .btn-modal-red-border:hover {
        background-color: var(--pale-red-1) !important;
    }
    .btn-modal-blue-border:hover {
        background-color: var(--form-bg-color);
    }

    .side-card button:hover,
    .side-card button:hover {
        background-color: var(--form-bg-color);
        filter: brightness(1);
    }

    main.group-member:not(.edit-member) .left li:not(.li-header):not(.li-no-content):hover {
        background-color: var(--pale-blue-2);
    }
    .main.group-member.member-edit .member-list li:not(.selected):hover {
        background-color: rgb(255, 253, 237);
    }

    /* member list */
    .edit-member-form li:not(.selected):not(.search-area li):hover {
        background-color: var(--pale-blue-2);
    }
    .select-li .ic-btn.total-list:hover {
        background-color: rgba(164, 180, 191, .16);
    }
    .select-li .ic-btn.total-list:hover .ic {
        filter: brightness(.8);
    }

    /* 職種管理 */
    main.master.job tr:hover td,
    main.master.room tr:hover td {
        background-color: var(--pale-blue-2);
    }
    main.master.job tr.select-tr:hover td,
    main.master.room tr.select-tr:hover td {
        background-color: var(--pale-yellow-1);
    }

    /* multiple select */
    .SumoSelect > .optWrapper > .options li.opt:hover {
        background-color: var(--form-bg-color)
    }

    /* 案内希望箇所管理 */
    main.guide-list td .ic-btn.orange-border:hover {
        background-color: var(--form-bg-color);
    }

    /* ログイン */
    .login ul li a:hover {
        filter: brightness(.8);
    }

    /* 顧客情報取得 */
    .modal.get-guest-info .result-content > ul > li:hover {
        background-color: var(--pale-blue-2);
    }

    /* ミュージアム予約詳細 */
    body:not(.mobile) .m-plan.detail .rsv-list .li-add:hover {
        background-color: var(--form-bg-color);
    }

}



/******************************************************
print
*******************************************************/
@media print {

    body,
    main {
        background-color: transparent!important;
    }
    body {
        font-size: 10px!important;
        print-color-adjust:exact;
        -webkit-print-color-adjust:exact;
    }
    header {
        display: none;
    }
    main {
        padding: 0!important;
    }

    .page-header {
        height: auto;
        padding-bottom: 4px!important;
        margin-bottom: 4px;
    }
    .museum[class*="guest-info"] .page-header {
        gap: 2px 0;
        align-items: center;
        min-height: unset;
    }
    .page-header-content p {
        font-size: 1.4rem;
        line-height: 2.4rem;
    }
    .museum.guest-info-detail .status-area {
        gap: 0 6px;
    }
    .contract-month {
        height: 100%;
        font-size: 1.2rem !important;
        line-height: 2.4rem !important;
    }
    main.museum[class*="detail"] .content-form ul li {
        padding-bottom: 1px;
    }
    body:not(.mobile) .li-ttl,
    .museum[class*="guest-info"] .li-progress .li-ttl span {
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 9px;
        color: #545454;
        padding: 0.2rem 0.4rem;
        background-color: #dfe5eb;
    }
    main.museum .main-content {
        gap: 10px 8px;
    }
    main.museum .content-ttl {
        margin-bottom: 2px;
    }
    main.museum .content-ttl p {
        font-size: 12px;
    }
    main.museum .content-form ul {
        gap: 8px 10px;
    }
    main.museum .content-form ul li {
        border-width: .5px;
        padding-bottom: 2px;
    }

    /* 改ページ ******************************/
    main.museum .content,
    main.museum .content-form {
        page-break-inside: avoid;
        break-inside: avoid;
        -webkit-break-inside: avoid;
    }
    main.museum .content.guide {
        page-break-before: always;
        break-before: always;
        -webkit-break-before: always;
    }

    /* table ********************************/
    main:not(.schedule) table tr > * {
        padding: 2px 4px;
    }
    main:not(.schedule):not(.report) table th {
        background-color: #e3e7ea;
    }
    td .ic-circle {
        width: 8px;
        height: 8px;
    }
    .museum[class*="guest-info"] .guest-info .li-family table th:nth-child(2),
    .museum[class*="guest-info"] .guest-info .li-family table td:nth-child(2) {
        white-space: nowrap;
    }

    /* 予約者情報詳細（共通） *******************/
    main.museum .content:not(.note) .content-form {
        border-color: var(--gray-1);
        line-height: 1.4;
    }
    main.museum .content:not(.note) .content-form:not(:has(.no-data)) {
        padding-top: 4px !important;
    }
    .museum[class*="guest-info"] {
        padding-left: 10px!important;
    }
    .museum[class*="guest-info"]:before {
        top: 0;
        left: 0 !important;
        height: 100%;
    }
    main.guest-info-detail .page-header {
        margin-top: 0!important;
        margin-left: 0!important;
    }
    .museum[class*="guest-info"] .main-content {
        margin-left: 0;
    }
    .museum[class*="guest-info"] .sub-info + .tour-info {
        margin-top: 0;
    }
    .museum[class*="guest-info"] .tour-info table tr:not(:last-child) th {
        font-size: .8rem;
    }
    .museum[class*="guest-info"] .sub-info .li-content {
        width: calc((100% - 4rem) - 1rem);
    }
    .museum[class*="guest-info"] .sub-info,
    main.museum .content-form {
        padding: 3px 4px;
        margin-bottom: 4px;
    }
    .museum[class*="guest-info"] .sub-info ul li {
        min-width: unset;
    }
    .museum[class*="guest-info"] .content-form:not(.sub-info) .li-ttl {
        width: 10rem;
    }
    .museum[class*="guest-"] .content-form:not(.sub-info) .li-content {
        width: calc(100% - 10rem);
    }
    main.museum .content-form ul li {
        border-color: var(--gray-1);
    }
    main.museum .content-form ul:not(.note-small) {
        row-gap: 5px;
    }
    main.museum .content-form ul li p {
        line-height: unset;
    }
    .museum.guest-info-detail .tour-info ul .li-guest-name .li-content p,
    .museum.guest-info-detail .tour-info ul .li-guest-name .li-content span,
    .museum[class*="guest-info"] .tour-info table th:last-child,
    .museum.guest-info-detail .tour-info ul .li-number-of-ppl span.number,
    .museum[class*="guest-info"] .tour-info ul .li-number-of-ppl th span,
    .museum[class*="guest-info"] .tour-info ul .li-participant span {
        font-size: 10px;
    }
    main.guest-info-detail > .text-btn,
    main.guest-info-detail .page-header .btn-area,
    .museum.guest-info-detail .tour-list form {
        display: none;
    }
    main.master table td .ic-btn {
        width: 1.4rem;
        height: 1.4rem;
    }
    .ic-btn.detail .ic {
        mask-size: .8rem;
        -webkit-mask-size: .8rem;
    }
    .ic-type {
        width: .8rem;
        height: .8rem;
    }
    main.guest-info-detail .content.guide .content-form {
        border: 0;
        padding: 0;
    }
    main.museum .content-form .no-data {
        margin-top: 0;
    }
    main.museum .content.note .no-data {
        margin-bottom: 0;
    }
    main.museum .content.note .content-form {
        padding-bottom: 3px;
    }

    /* 予約者情報詳細（学生・法人以外） ***********/
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .main-content {
        display: grid;
        grid-template-columns: 65% calc(35% - 8px);
        align-items: stretch;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .content-form.tour-info {
        grid-column: 1 / 2;
        grid-row: 1 / 3;
        margin-bottom: 0;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul {
        height: 100%;
        align-items: stretch;
        grid-template-rows: repeat(8, max-content) 1fr;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-tour-time {
        grid-column: 2 / 3;
        grid-row: 3 / 4;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-coming-time {
        grid-column: 1 / 3;
        grid-row: 4 / 5;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-accompany {
        grid-column: 1 / 3;
        grid-row: 7 / 8;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-meeting {
        grid-column: 1 / 3;
        grid-row: 8 / 9;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-number-of-ppl {
        grid-column: 1 / 3;
        grid-row: 5 / 6;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-participant {
        grid-column: 1 / 3;
        grid-row: 6 / 7;
    }
    .museum[class*="guest-info"]:not([class*="guest-info-2"]) .tour-info ul .li-bikou {
        grid-column: 1 / 3;
        grid-row: 9 / 10;
    }
    .museum[class*="guest-"] .content-form:not(.sub-info) > ul > li:not(.li-coming-time, .li-tour-time) > .li-content {
        width: calc(100% - 10.8rem);
    }
    .museum[class*="guest-info"] .sub-info {
        grid-column: 2 / 3;
        grid-row: 1 / 2;
        align-items: flex-start;
        border: 0;
        margin-bottom: 0 !important;
    }
    .museum[class*="guest-info"] .sub-info ul:last-of-type {
        justify-content: flex-start;
        margin-top: 0;
    }
    .museum[class*="guest-info"] .sub-info ul:last-of-type li {
        width: 100% !important;
    }

    /* 備考 */
    .museum.guest-info-detail .bikou {
        display: flex;
        align-items: center;
        min-height: 2.4rem;
        font-size: .9rem !important;
        margin-top: 0;
    }

    /* 申請・承認状況 */
    .museum[class*="guest-"] .content.status {
        grid-column: 2 / 3;
        grid-row: 2 / 3;
    }
    .museum[class*="guest-"] .content.status .content-form {
        margin-bottom: 0;
    }
    .museum[class*="guest-"] .content.status ul {
        flex-direction: column;
    }
    .museum[class*="guest-"] .content.status li {
        width: 100%;
    }
    .museum[class*="guest-"] .content.status .li-ttl {
        width: 6rem;
    }

    /* 施設利用について */
    .museum[class*="guest-"] .content.room {
        grid-column: 1 / 3;
        grid-row: 3 / 4;
    }
    .museum[class*="guest-"] .content.room ul {
        flex-wrap: nowrap;
    }

    /* お客様情報 */
    .museum[class*="guest-"] .content.guest-info {
        grid-column: 1 / 3;
        grid-row: 4 / 5;
    }
    .museum[class*="guest-info"] .li-progress .li-ttl span:last-child{
        font-size: .8rem;
    }
    .museum[class*="guest-info"] .li-progress .progress-fig {
        padding-right: .8rem;
    }
    .museum.guest-info-detail .li-progress .progress-fig p {
        width: 3rem;
        font-size: 9px;
    }
    .museum.guest-info-detail .li-progress .progress-fig .radio-btn-area span {
        width: 1.2rem;
        height: 1.2rem;
        margin: 0 .9rem;
    }
    .museum[class*="guest-info"] .li-progress .progress-fig .radio-btn-area:before {
        width: calc(100% - 4rem);
        bottom: .5rem;
    }

    /* ツアー履歴 */
    .museum[class*="guest-"] .content.tour-list {
        grid-column: 1 / 3;
        grid-row: 8 / 9;
    }

    /* FS現在の仕様 */
    .museum.guest-info-detail .li-spec li {
        width: auto!important;
        gap: 0 !important;
    }
    .museum.guest-info-detail .li-spec ul .li-ttl {
        width: auto !important;
        justify-content: flex-start;
        background-color: transparent !important;
        padding: 0 !important;
    }
    .museum.guest-info-detail .li-spec ul .li-content {
        width: auto !important;
    }

    /* 提案内容 */
    .museum[class*="guest-"] .content.proposal {
        grid-column: 1 / 3;
        grid-row: 5 / 6;
    }
    .museum[class*="guest-"] .content.proposal .li-facility li {
        width: calc(50% - .8rem);
    }

    /* 備考欄 */
    .museum[class*="guest-"] .content.note {
        grid-column: 1 / 3;
        grid-row: 6 / 7;
    }

    /* 案内希望箇所 */
    .museum[class*="guest-"] .content.guide {
        grid-column: 1 / 3;
        grid-row: 7 / 8;
    }
}


td.fc-timegrid-slot.fc-timegrid-slot-label {
    font-size: 0.31em;
}
td.fc-timegrid-slot.fc-timegrid-slot-lane.fc-timegrid-slot-minor {
    font-size: 0.31em;
}
td.fc-timegrid-slot.fc-timegrid-slot-lane {
    font-size: 0.31em;
}