@charset "utf-8";

@import url('style.css');
html {
    font-size: 62.5%;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.5;
    color: #282828;
    background-color: #F4F6F5;
    box-sizing: border-box;
    overflow-x: hidden;
}

a {
    text-decoration: none;
    color: #FFF;
    cursor: pointer;
}

a:hover {
    opacity: 0.8;
}

li {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
}

/* common
------------------------------------------------------------*/
.flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

::placeholder {
    color: #D4D6D6;
}

/* 旧Edge対応 */
::-ms-input-placeholder {
    color: #D4D6D6;
}

/* IE対応 */
:-ms-input-placeholder {
    color: #D4D6D6;
}

form button:hover {
    opacity: .8;
}

.columns2 {
    width: 117vw;
    min-height: 100vh;
    display: flex;
}

select option {
    color: #282828;
}

.hidden {
    display: none;
}

/* サイドバー */
.side-bar {
    width: 20rem;
    background-color: #01CED1;
    font-size: 1.3rem;
    color: #FFF;
}

.side-bar p,
.accordion-title,
.side-bar li {
    width: 100%;
    height: 4.5rem;
    border-bottom: 1px solid #FFF;
}

.side-bar p {
    padding: 1.3rem 2.8rem;
}

.side-bar p:first-of-type {
    padding: 1rem;
    text-align: center;
    color: rgba(255, 255, 255, .5);
}

.accordion-title {
    padding: 1.3rem 2.8rem;
    width: 100%;
    cursor: pointer;
    position: relative;
}

.accordion-title::after {
    content: "＋";
    position: absolute;
    top: 50%;
    right: 1.6rem;
    transform: translateY(-50%);
}

.side-bar ul {
    display: none;
}

.side-bar .accordion-open {
    display: block;
}

.side-bar li {
    background-color: #3EE0D0;
    position: relative;
}

.side-bar a {
    display: block;
    padding: 1.2rem 0 1rem 4.6rem;
}

.side-bar p a {
    padding: 0;
}

.point-arrow::before {
    content: "";
    display: inline-block;
    border-style: solid;
    border-color: transparent;
    border-width: 0.375em 0.64952em;
    border-left-color: currentColor;
    position: absolute;
    left: 3.5rem;
    top: 50%;
    transform: translateY(-50%);
}

main {
    padding: .9rem 3rem 3.5rem 2rem;
    width: calc(100% - 20rem);
}

/* login
------------------------------------------------------------*/
.login {
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-box {
    padding: 3rem 2.6rem;
    width: 25rem;
    height: 33rem;
    background-color: #3EE0D0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    color: #FFF;
}

.login h1 img {
    width: 12rem;
}

.login form {
    padding-bottom: 2rem;
}

.login input {
    margin-bottom: 1rem;
    padding-left: 1rem;
    width: 100%;
    height: 3rem;
    background-color: #FCFCFC;
    border-radius: 3px;
}

.login form button {
    display: block;
    width: 100%;
    padding: .6rem;
    background-color: #05C7F2;
}

.login-box a {
    color: #3EE0D0;
    background-color: #FFF;
    width: 100%;
    height: 3.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
}



input[type="number"] {
    text-align: right;
}

/* header */
.select-form {
    justify-content: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
}

.form-wrap {
    position: relative;
}

.form-wrap::after {
    border-left: 4.5px solid transparent;
    border-right: 4.5px solid transparent;
    border-top: 5.5px solid #000;
    content: "";
    position: absolute;
    right: 6px;
    bottom: 11px;
    width: 0;
}

.select-form input,
.select-form select {
    padding-left: .8rem;
    width: 13rem;
    height: 3rem;
    border: solid 1px #ccc;
    border-radius: 3px;
    background-color: #fff;
    color: #D4D6D6;
}

.select-form .recruitMethod {
    width: 30rem;
}

    .select-form textarea {
        padding-left: .8rem;
        border: solid 1px #ccc;
        border-radius: 3px;
        background-color: #fff;
        color: #D4D6D6;
        width: 30rem;
        height: 6.8rem;
        padding-top: .5rem;
    }

/* yamamin 追加 */
.loading {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0 auto;
    z-index: 2;
}

.select-form .select-form-errmsg {
    color: red;
    padding-left: 17rem;
}
.login-box .select-form-errmsg {
    color: red;
    text-align: left;
    padding-bottom: 1rem;
}

.selectbox-long select {
    width: 27rem;
}

.select-form input {
    width: 22.5rem;
}

.select-form input,
.select-form textarea {
    color: #282828;
}

.select-form input {
    width: 30rem;
}

/* header-menu */
.header-menu {
    flex-direction: column;
    align-items: flex-end;
    gap: 1.1rem;
    font-weight: 700;
}

.form-header .header-menu {
    margin-bottom: 1.1rem;
}

.user-name {
    display: flex;
    gap: 1rem;
}

.user-name li {
    display: flex;
    align-items: center;
}

.user-name img {
    width: 1.5rem;
}

.user-name a {
    color: #282828;
}

.user-name p {
    display: inline-block;
    margin-left: 1rem;
}

.menu-button {
    color: #FFF;
    display: flex;
    gap: .7rem;
}

.menu-button button,
.menu-button a {
    width: 13rem;
    height: 3rem;
    border-radius: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.select-form2 {
    display: none;
    margin-top: 1rem;
}

.select-form2.open {
    display: flex;
}

/* table */
table {
    margin-top: 1.9rem;
    width: 100%;
    border-collapse: collapse;
    font-weight: 700;
}

th,
td {
    padding: .9rem 0;
    text-align: center;
}

td {
    padding: .95rem 0;
    height: 3.8rem;
}

    th:nth-of-type(1),
    th:nth-of-type(2),
    th:nth-of-type(3),
    th:nth-of-type(4),
    th:nth-of-type(5),
    th:nth-of-type(6),
    th:nth-of-type(7),
    th:nth-of-type(8),
    th:nth-of-type(9),
    td:nth-of-type(1),
    td:nth-of-type(2),
    td:nth-of-type(3),
    td:nth-of-type(4),
    td:nth-of-type(5),
    td:nth-of-type(6),
    td:nth-of-type(7),
    td:nth-of-type(8),
    td:nth-of-type(9) {
        text-align: left;
    }

th {
    color: #003333;
    border-top: 2px solid #003333;
    border-bottom: 2px solid #003333;
}

td {
    border-bottom: 1px solid #282828;
}


td a {
    color: #277FFF;
}

input[type="checkbox"] {
    cursor: pointer;
    width: initial;
    vertical-align: middle;
}

/* footer-nav */
.nav-arrow {
    margin-top: 1.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.3rem;
}

.arrow-bottom {
    display: flex;
    gap: .1rem;
}

/* yamamin */
/* .arrow-bottom a { */
.arrow-bottom button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.7rem;
    height: 3.7rem;
    color: #00BFFE;
    border: 1px solid #00BFFE;
    border-radius: 3px;
    background-color: #FFF;
}

.nav-arrow p {
    padding-right: 1.5rem;
    font-size: 1.4rem;
}

.ad-2-2 .nav-arrow,
.ad-10-2 .nav-arrow,
.ad-14-2 .nav-arrow,
.ad-18-2 .nav-arrow {
    margin-top: 2.6rem;
}

/* Button
------------------------------------------------------------*/
.search-button {
    background-color: #00CBCC;
}

.detail-button {
    background-color: #5DEAD9;
}

.register-button {
    background-color: #10439F;
}

.delete-button {
    background-color: #003333;
}

.saveButton {
    background-color: #00CBCC;
}

.deleteButton {
    background-color: #003333;
}

.dl-saveButton {
    background-color: #0598ee;
}

.select-button {
    /* yamamin #select-button { */
    background-color: #00CBCC;
}

.execute-button {
    background-color: #00BFFE;
}

.user-list-button {
    background-color: #00CBCC;
}

.disable-button {
    background-color: #E9E8E8;
    cursor: default;
}

    .disable-button:hover {
        opacity: 1;
    }

.suspend-button {
    background-color: #003333;
}

.cancel-button {
    background-color: rgba(94, 234, 217, .5);
}

/* main-form
------------------------------------------------------------*/
.form-header p {
    font-weight: 700;
    color: #003333;
}

.main-form {
    margin-top: .9rem;
    width: 100%;
    border-top: 1px solid #282828;
}

.main-form ul {
    margin-top: 1.8rem;
}

.main-form li {
    width: 100%;
    margin-top: .8rem;
}

.main-form li:nth-of-type(2) {
    margin-top: 1.4rem;
}

.main-form label,
.main-form dt {
    padding-right: 1.5rem;
    display: inline-block;
    width: 15.2rem;
    text-align: right;
    font-size: 1.2rem;
    font-weight: 700;
    white-space: nowrap;
    color: #003333;
}

.main-form dd {
    padding-left: 1rem;
    display: inline-block;
}

.main-form li dl label {
    width: initial;
    padding-right: .2rem;
}

.main-form input[name="name"] {
    width: 42.7rem;
}

.main-form li:nth-of-type(4) dd,
.main-form li:nth-of-type(3) dd {
    padding-left: .2rem;
}

.main-form input[name="post-code"] {
    width: 10.1rem;
    margin-right: .3rem;
}

.main-form select[name="school-board"],
.main-form input[name="address"],
.main-form input[name="email"],
.main-form input[name="confirmation"],
.main-form input[name="memo"] {
    width: 30.2rem;
}

.main-form select,
.main-form input[name="tel"],
.main-form input[name="manager-name"] {
    width: 13.3rem;
}

.main-form li:nth-of-type(10) dd,
.main-form li:nth-of-type(6) dd {
    padding-left: 0;
}

.main-form li:nth-of-type(10) label,
.ad-5 .main-form li:nth-of-type(6) label {
    padding-left: .7rem;
}

.main-form input[name="manager-kana"] {
    width: 13rem;
}

input[name="year"] {
    margin-right: .5rem;
    width: 7rem;
}

input[name="person-number"] {
    margin-right: .5rem;
    width: 7rem;
}

select[name="hour"],
select[name="minute"],
select[name="month"],
select[name="day"] {
    width: 5.1rem;
    margin-right: .3rem;
}

select[name="minute"],
select[name="month"],
select[name="day"] {
    margin-left: .6rem;
}

.notice-url {
    width: 13rem;
    height: 3rem;
    border-radius: 2px;
    display: inline-block;
    background-color: #00BFFE;
    color: #FFF;
}

.capture-info {
    margin: 0 auto;
    margin-top: 17.4rem;
    width: 50rem;
    text-align: center;
}

.capture-info>div {
    margin-left: 3rem;
    padding: 3.4rem 0 3.8rem;
    border: 1px solid #003333;
}

.info-wrap {
    display: inline-block;
    text-align: left;
}

.info-wrap p:nth-of-type(2) {
    margin-top: .8rem;
}

.select-wrap {
    display: inline-block;
    position: relative;
}

.select-wrap::after {
    border-left: 4.5px solid transparent;
    border-right: 4.5px solid transparent;
    border-top: 5.5px solid #000;
    content: "";
    position: absolute;
    right: 9px;
    bottom: 11px;
    width: 0;
}

.es-edit ul {
    margin: 0;
}

.es-edit li:nth-of-type(6),
.es-edit li:nth-of-type(7),
.es-edit li:nth-of-type(9),
.es-edit li:last-of-type {
    margin-top: 1.4rem;
}

.es-edit li:nth-of-type(10),
.es-edit li:nth-of-type(11) {
    margin-top: 2rem;
}

.es-edit label,
.es-edit dt {
    padding-right: 1.6rem;
    width: 14.6rem;
}

.es-edit dd {
    padding: 0;
}

.es-edit .menu-button {
    align-items: center;
}

.es-edit .menu-button p {
    margin-left: .5rem;
    color: #003333;
    font-weight: 700;
}

#automatic-email {
    color: #282828;
}

/* mask
------------------------------------------------------------*/
.mask {
    background: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 1;
}

.message-window-info,
.message-window,
.message-window-2,
.message-window-3,
.message-window-4 {
    width: 32rem;
    padding: .5rem 1.5rem 3rem;
    font-weight: 700;
    border-radius: 5px;
    background-color: #F4F6F5;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0 auto;
    z-index: 2;
}

.message-window-info .flex {
    align-items: center;
}

.message-window .flex {
    align-items: center;
}

.message-window-2 .flex {
    align-items: center;
}

.message-window-3 .flex {
    align-items: center;
}

.message-window-4 .flex {
    align-items: center;
}


.confirmation {
    font-size: 1.4rem;
}

.bi-x {
    font-size: 2rem;
    cursor: pointer;
}

.warning {
    margin-top: 1.5rem;
    padding: 0 1rem;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
}

.bi-exclamation-circle {
    font-size: 5rem;
    color: #078C8C;
}

.question {
    margin-top: 3rem;
    text-align: center;
}

.warning-check {
    margin-top: 1.8rem;
    text-align: center;
}

.warning-check ul {
    display: inline-block;
    text-align: left;
}

.warning-check li {
    margin-top: .5rem;
}

.warning-check input {
    margin-right: .5rem;
    vertical-align: middle;
}

.yesno-button {
    margin-top: 2rem;
    justify-content: center;
    gap: 1rem;
}

.yesno-button button {
    padding: .5rem 0;
    width: 10rem;
    color: #FFF;
    border-radius: 3px;
}

.close-button-info,
.close-button-4,
.yes-button {
    background-color: #008CFF;
}

.no-button,
.no-button-2,
.no-button-3 {
    background-color: #919191;
}

/* Menu
------------------------------------------------------------*/
.select-menu {
    margin: 0 auto;
    margin-top: 11rem;
    text-align: center;
}

    .select-menu ul {
        margin-top: 4rem;
    }

    .select-menu li {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1.5rem;
    }

    .select-menu a {
        display: inline-block;
        padding: 1.5rem;
        width: 20rem;
        border: 1px solid #01CED1;
        border-radius: 5px;
        background-color: #01CED1;
    }

    .select-menu .disable-button {
        display: inline-block;
        padding: 1.5rem;
        width: 20rem;
        border-radius: 5px;
        background-color: #E9E8E8;
        color: #FFF;
    }

.load-button {
    background-color: #00CBCC;
}

.output-button {
    background-color: #009899;
}

.display-button {
    margin: .7rem 0 0 8.7rem;
    background-color: #00CBCC;
}

.disabled-label {
    opacity: 0.3;
}

input[type="radio"] {
    accent-color: #003333;
}

fieldset dl {
    margin-top: .8rem;
}

fieldset input[type="radio"] {
    width: initial;
    vertical-align: middle;
}

.save-settings-button {
    margin: 1.5rem 0 0 8.7rem;
    background-color: #00CBCC;
}

#comparison-method {
    color: #282828;
}

.main-form dd span {
    margin-left: 1.2rem;
}

#free-answer {
    color: #282828;
}

/* accountList
------------------------------------------------------------*/
.accountList th,
.accountList td {
    text-align: left;
}

/* NewspaperList
------------------------------------------------------------*/
.newspaperList table {
    margin-top: 2.4rem;
}

.newspaperList th:nth-of-type(1),
.newspaperList td:nth-of-type(1),
.newspaperList th:nth-of-type(7),
.newspaperList td:nth-of-type(7) {
    text-align: center;
}

.newspaperList th:nth-of-type(1) {
    width: 10%;
}

.newspaperList th:nth-of-type(2) {
    width: 13%;
}

.newspaperList th:nth-of-type(3) {
    width: 10%;
}

.newspaperList th:nth-of-type(4) {
    width: 10%;
}

.newspaperList th:nth-of-type(5) {
    width: 12%;
}

.newspaperList th:nth-of-type(6) {
    width: 18%;
}

.newspaperList th:nth-of-type(7) {
    width: 12%;
}

.newspaperList th:nth-of-type(8) {
    width: 10%;
}

/* seminarList
------------------------------------------------------------*/
.seminarList table {
    margin-top: 2.4rem;
}

.seminarList th:nth-of-type(1),
.seminarList td:nth-of-type(1),
.seminarList td:nth-of-type(6),
.seminarList th:nth-of-type(6),
.seminarList th:nth-of-type(7),
.seminarList td:nth-of-type(7) {
    text-align: center;
}

.seminarList th:nth-of-type(1) {
    width: 5%;
}

.seminarList th:nth-of-type(2) {
    width: 10%;
}

.seminarList th:nth-of-type(3) {
    width: 20%;
}

.seminarList th:nth-of-type(4) {
    width: 15%;
}

.seminarList th:nth-of-type(5) {
    width: 15%;
}

.seminarList th:nth-of-type(6) {
    width: 5%;
}

.seminarList th:nth-of-type(7) {
    width: 10%;
}

.seminarList th:nth-of-type(8) {
    width: 10%;
}

.seminarList th:nth-of-type(9) {
    width: 10%;
}

/* seminarForGeneralList
------------------------------------------------------------*/
.seminarForGeneralList table {
    margin-top: 2.4rem;
}

.seminarForGeneralList th:nth-of-type(1),
.seminarForGeneralList td:nth-of-type(1),
.seminarForGeneralList td:nth-of-type(7),
.seminarForGeneralList th:nth-of-type(7),
.seminarForGeneralList th:nth-of-type(8),
.seminarForGeneralList td:nth-of-type(8) {
    text-align: center;
}

.seminarForGeneralList th:nth-of-type(1) {
    width: 5%;
}

.seminarForGeneralList th:nth-of-type(2) {
    width: 8%;
}

.seminarForGeneralList th:nth-of-type(3) {
    width: 10%;
}

.seminarForGeneralList th:nth-of-type(4) {
    width: 12%
}

.seminarForGeneralList th:nth-of-type(5) {
    width: 20%;
}

.seminarForGeneralList th:nth-of-type(6) {
    width: 17%;
}

.seminarForGeneralList th:nth-of-type(7) {
    width: 6%;
}

.seminarForGeneralList th:nth-of-type(8) {
    width: 6%;
}

.seminarForGeneralList th:nth-of-type(9) {
    width: 8%;
}

.seminarForGeneralList th:nth-of-type(10) {
    width: 8%;
}


/* AccountList
------------------------------------------------------------*/
.accountList .side-bar p:last-of-type,
.accountEdit .side-bar p:last-of-type {
    background-color: #3EE0D0;
}

.accountList th:nth-of-type(4),
.accountList td:nth-of-type(4) {
    text-align: center;
}

.accountList .header p {
    margin-bottom: .7rem;
}

.accountList table {
    margin-top: 1.5rem;
}

.accountList td span {
    display: inline-block;
    margin-left: 2.5rem;
}

.accountList th:nth-of-type(1),
.accountList td:nth-of-type(1) {
    width: 20%;
    padding-left: 2rem;
}

.accountList th:nth-of-type(2) {
    width: 15%;
}

.accountList th:nth-of-type(3) {
    width: 30%;
}

.accountList th:nth-of-type(4) {
    width: 10%;
}

.accountList th:nth-of-type(5) {
    width: 10%;
}

.accountList th:nth-of-type(6) {
    width: 15%;
}

/* Seminar Edit
------------------------------------------------------------*/
.seminarEdit caption {
    padding: 0.9em;
    color: #FFF;
    font-weight: bold;
    background: rgba(0, 51, 51, 0.5);
}

.seminarEdit table {
    width: 60%;
    margin: auto;
    font-weight: 500;
    margin-top: 1rem;
}

.seminarEdit td {
    border-bottom: 1px solid #CCCCCC;
}

.seminarEdit .select-form-errmsg {
    color: red;
    width: 60%;
    margin: auto;
}

.seminarEdit td:nth-of-type(1) {
    text-align: right;
    font-weight: 700;
}

.seminarEdit td:nth-of-type(1) {
    width: 20%;
}

.seminarEdit td:nth-of-type(2) {
    padding-left: 2rem;
}

.seminarEdit td:nth-of-type(3) {
    width: 20%;
    font-weight: 700;
}

.seminarEdit .input-point {
    color: #DC5512;
}


/* Edit
------------------------------------------------------------*/
.es-edit label,
.es-edit dt {
    width: 16.6rem;
}

.main-form li:first-of-type {
    margin-top: 1.4rem;
}

.main-form li:nth-of-type(2),
.main-form li:last-of-type {
    margin-top: .8rem;
}

 #status {
    color: #282828;
}