/* ========================*/
/*			共通			*/
/* ========================*/
:root {
    --fg-color: #505050;
    --main-bg-color: #F4F8FF;
    --orange-color: #f08200;
    --orange-shadow-color: #f0820070;
    --cyan-color: #0092b2;
    --cyan-shadow-color: #0092b270;
    --blue-color: #203e95;
    --blue-shadow-color: #203e9570;
    --light-gray-color: #d2d2d2;
}

body.coco{
color:var(--fg-color);
background-color:var(--main-bg-color);
min-height:100vh;
position:relative;
font-family: "M PLUS Rounded 1c", sans-serif;
font-weight: 400;
font-style: normal;
}

.copyright{
    border-top: 1px solid var(--light-gray-color);
    /* position: absolute; */
    /* bottom: 0; */
}
a:hover{
text-decoration: none;
}

/* ========================*/
/*			ログイン		*/
/* ========================*/
.coco.login{
}
.coco .input-school{
display:inline-block;
width:89%;
}
.coco .button-school{
display:inline-block;
width:10%;
vertical-align: super;
}


/* ログインボタン */
.coco .btn-login{
background-color:var(--cyan-color);
border:none;
color:#FFF;
padding:.5rem 2rem;
}
/* ID/パスワード忘れた時ボタン */
.coco .btn-idpwd{
background-color:#ffab55;
border:none;
color:#FFF;
padding:.5rem 2rem;
}

/* drawer */
.drawer-menu ul{
display: none;
}
.drawer-menu ul li{
list-style: none;
margin-bottom:5px;
}
.drawer-menu ul li a{
color:#222323;
}
.drawer-menu-item:after{
	content:"▼";
padding: 0px 10px;
font-size: 0.5rem;
vertical-align: middle;
display: inline-block;
transition-duration:0.1s;
transform:rotate(0deg);
}
.drawer-menu-item.open-drawer-menu-item:after{
transform:rotate(180deg);
transition-duration:0.1s;
}
@media (max-width: 576px) {
	/* 対象学校の選択 */
.coco .input-school{width:82%;}
.coco .button-school{width:16%;}

.copyright{
width:100%;
}
}
.coco .container {
    max-width: 720px;
    background-color: white;
}
.coco .container.main-container {
    position: relative;
    height: 100%;
    min-height: calc(100vh - 3rem);
}
/* ========================*/
/*		ログイン後 メニュー	 */
/* ========================*/
.coco header {
    border-top: 8px solid var(--orange-color);
    border-bottom: 1px solid var(--light-gray-color);
}
.coco.login-menu{
}
.coco.login-menu .copyright{
position:initial;
}

.coco .menu-page-title {
    font-size: 1.4em;
    text-align: center;
    text-shadow: 0 3px #d2d2d270;
}
.coco .menu-page-sub-title {
    color: var(--orange-color);
    font-size: .75em;
    text-align: center;
}
.coco .btn-orange {
    background-color:var(--orange-color);
    border:none;
    color:white;
    padding:.5rem 2rem;
}
.coco .btn-cyan {
    background-color:var(--cyan-color);
    border:none;
    color:white;
    padding:.5rem 2rem;
}

/* ログイン情報 */
.coco .student-data{
border-left:2px solid var(--cyan-color);
padding:3px 0px 3px 8px;
}
.coco .student-data span{
margin-bottom:0.1rem;
}
.coco .student-data .student-name {
display: block;
font-weight: bold;
font-size: 1.4em;
}
.coco .student-data .student-school {
    font-size: .9em;
    color: var(--cyan-color);
}
.coco .student-data .student-grade {
    font-size: .9em;
    color: var(--cyan-color);
    margin-left: 0.5em;
}

/* menu */
.coco .menu-two{
padding:0.5rem;
}
.coco .menu-two a{
color:#fff;
}
.coco .menu-two p{
margin-bottom:0.2rem;
}
.coco .menu-two p.title{
font-size:1.2rem;
text-shadow: 0 2px #00000040;
}
.coco .menu-two p.sub-title{
font-size:0.5rem;
}
.menu-two.menu-regist{
    border-radius: 6px;
    background-color:var(--orange-color);
    box-shadow: 0 3px var(--orange-shadow-color);
}
.menu-two.menu-article{
    border-radius: 6px;
    background-color:var(--cyan-color);
    box-shadow: 0 3px var(--cyan-shadow-color);
}
.coco .kenon .page-title{
color:var(--orange-color);
border-top:1px solid var(--orange-color);
border-bottom:1px solid var(--orange-color);
}
.coco .kenon .page-title {
    font-size: 1.4em;
    text-align: center;
}
.coco .menu-register-btn-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    row-gap: 2rem;
}

.coco .menu-register-btn {
    width: 47%;
    min-width: 120px;
    min-height: 120px;
    color:var(--orange-color);
    border: 4px solid var(--orange-color);
    border-radius: 22px;
    background-color: white;
    box-shadow: 0 3px var(--orange-shadow-color);
    padding: .5em .25em;
    transition: all 0.1s ease;
}
@media (max-width: 768px) {
    .coco .menu-register-btn-list.menu-wide .menu-register-btn {
        width: 100%;
    }
}

.coco .menu-btn-icon {
    width: 60px;
}
.coco .menu-btn-text, .coco .menu-btn-sub-text{
    text-align: center;
}
.coco .menu-btn-sub-text{
    font-size: 0.9em;
}
@media (max-width: 576px) {
    .coco .menu-register-btn {
        width: 45%;
    }
    .coco .menu-register-btn-inner {
        font-size: 0.9em;
    }
    .coco .menu-btn-icon {
        width: 50px;
    }
}
@media (max-width: 374px) {
    .coco .menu-register-btn-list {
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 0.9em;
    }
    .coco .menu-btn-sub-text{
        font-size: 0.8em;
    }
}
@media (hover: hover) {
    .coco .menu-register-btn:hover {
        box-shadow: none;
        transform: scale(.98) translateY(3px);
    }
}
.coco .menu-register-btn:active {
    box-shadow: none;
    transform: scale(.98) translateY(3px);
}
.coco .menu-register-btn-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    min-height: 96px;
}
.coco .validation-error{
    margin-bottom: 0;
}
.coco .validation-error ul{
    margin-bottom: 0;
    padding: 0;
}
.coco .validation-error li{
    list-style: none;
    font-size: large;
}
.menu-article-list p{
color : var(--cyan-color);
border-bottom:1px dashed var(--cyan-color);
}
.menu-article-title{
    border-bottom:1px solid var(--cyan-color)!important;
}
.coco .to-hinankou{
padding:0.5rem;
}
.coco .to-hinankou{
padding:0.5rem;
}
.coco .to-hinankou img{
display: inline-block;
margin-right:5px;
}
.coco .to-hinankou .txt-hinankou{
display: inline-block;
vertical-align: middle;
color:#3167a2;
}
.coco .to-hinankou p{
margin-bottom:0;
line-height: 1.2rem;
}
#forgetId,#forgetPwd{
cursor: pointer;
}
/* ========================*/
/*				検温				*/
/* ========================*/
/* タブ */
.body-temp {
    display: flex;
    flex-wrap: wrap;
}
.bt-label {
    color: #FFF;
    background: #CCC;
    margin: 0 5px 0 0;
    padding: 3px 0;
    order: -1;
    cursor: pointer;
    width: 15.2%;
    text-align: center;
    border-radius: 6px 6px 0 0;
    font-weight: bold;
    transition: all 0.2s ease;
    transform-origin: bottom;
}
@media (hover: hover) {
    .bt-label:hover {
        transform: scaleY(1.10);
    }
}
.bt-label:active {
    transform: scale(1.05,.9);
}
.bt-box {
    width: 100%;
    display: none;
    padding: 7% 0 0 0;
    border-top:3px solid var(--cyan-color);
}
/* アクティブなタブ */
.bt-switch:checked+.bt-label {
    background: var(--cyan-color);
}
.bt-switch:checked+.bt-label+.bt-box {
     display: block;
}
/* ラジオボタン非表示 */
.bt-switch {
    display: none;
}

/* 体温選択 */
.bt-btn {
  display: none;
}
.bt-select label {
	cursor:pointer;
    background-color: #FFF;
    padding: 1% 0;
    margin: 0 3% 7% 0;
    border: 3px solid var(--cyan-color);
    border-radius: 6px;
    width:16.5%;
    text-align: center;
    color: var(--cyan-color);
    font-weight: bold;
    transition: all 0.2s ease;
    transform-origin: bottom;
}
@media (hover: hover) {
    .bt-select label:hover {
        transform: scale(1.05);
    }
}
.bt-select label:active {
    transform: scale(.98);
}

.bt-select label:nth-child(5n) {
    margin: 0 0 7% 0;
}
.bt-btn:checked + label {
background-color: var(--cyan-color);
color:#FFF;
}
.form-label{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}