@charset "UTF-8";

html {
    background: white;
}

#form1 {
    margin: 0;
}

.head_area {
    width: 100%;
    height: 110px;
    background-color: var(--theme_color);
    display: flex;
    flex-wrap: nowrap;
}

.title {
    padding-left:10px;
    width: 450px;
    height:70%;
    margin-top:40px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: left;
    align-items: center;
}

    .title > img {
        height: 100%;
        margin-left: 15px;
        flex-shrink: 1;
        margin-top: 15px;
    }

div#contentsblock {
    padding: 0;
    border: none;
    background-color: #dde;
}

#main .contentswidth {
    background-color: rgba(255, 255, 255, 0.9);
    padding: 15px;
}

footer#ctl00_ctlFooter {
    border-top-color: #039;
}


.loginidbox {
    margin-top: 20px;
    margin-bottom: 20px;
}

.login input {
    width: 16rem;
    margin: 0;
    padding: 5px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.loginb {
    margin: 30px 0;
    padding: 0;
}

    .loginb input {
        width: auto;
        cursor: pointer;
        border: none;
        padding: 0;
    }

        .loginb input:hover {
            opacity: 0.5;
        }

    .loginb.risyu .risyu_login {
        background-image: url("../../Images/Service/Button/ccslogin-r-risyu-b.png");
        width: 210px;
        height: 80px;
        margin-left: 5px;
        border-width: 0px;
    }

.support_forget {
    padding-top: 5px;
}

.hiduke {
    margin-top: 20px;
    clear: both;
    text-align: left;
}

.errormessage_login p {
    margin: 0px 0px 0px 0px;
    padding: 0;
    color: #f00;
    font-size: 110%;
    list-style: none;
}

A#ctlPasswordBtnLogin, A#ctlPasswordBtn {
    width: 100%;
    padding: 10px;
    border-radius: 15px;
    font-size: 16px;
    margin-bottom: 5px;
}

    A#ctlPasswordBtnLogin:focus,
    A#ctlPasswordBtn:focus {
        border-color: #007BFF;
    }

    span.errcnt_lv1 {
        color: Green;
    }

span.errcnt_lv2 {
    color: blue;
}

span.errcnt_lv3 {
    color: Black;
}

span.errcnt_lv4 {
    color: Orange;
}

.messagebox strong.bluestring {
    color: Blue;
    font-size: 100%;
    font-weight: bold;
}

div.shadowloginbox {
    padding: 10px;
}

#TestModeImage {
    position: relative;
    top: 30px;
    right: 50px;
}

.test-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

#TestModeImageAdmin {
    position: relative;
    top: 30px;
    right: 50px;
}

.c_body_right ul{
    padding:0;
}

.fsarea {
    margin-top: 15px;
}

footer{
    width:100%;
    text-align: center;
}

#ctlBtnFreshmanSyllabus:hover {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

/*モダン化*/
#mainblock {
    padding: 20px;
    background-color: white;
    display:grid;
}

/*モダン化_山口*/
#main {
    max-width: 400px;
    width:100%;
    justify-self: center;
}

.guidance.shadow.radius {
    background-color: white;
    padding:0.1px 15px 1px 15px;
}

.loginidbox,
.passwordbox {
    position: relative;
    margin-bottom: 20px;
}

#ctlLoginId,
#ctlLoginPassword,
#ctlShadowLoginId,
#ctlShadowLoginPassword {
    width: 100%;
    padding: 10px;
    border: 2px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
    background-color: transparent;
    outline: none;
}

    #ctlLoginId:focus,
    #ctlLoginPassword :focus,
    #ctlShadowLoginId:focus,
    #ctlShadowLoginPassword :focus{
        border-color: #007BFF;
    }

#ctlLoginLabel,
#ctlPassLabel,
#ctlShadowLoginLabel,
#ctlShadowPassLabel {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    background-color: transparent;
    padding: 0 5px;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.5);
    pointer-events: none;
    transition: 0.3s ease all;
}

#ctlLoginId:focus + #ctlLoginLabel,
#ctlLoginId:not(:placeholder-shown) + #ctlLoginLabel,
#ctlLoginPassword:focus + #ctlPassLabel,
#ctlLoginPassword:not(:placeholder-shown) + #ctlPassLabel,
#ctlShadowLoginId:focus + #ctlShadowLoginLabel,
#ctlShadowLoginId:not(:placeholder-shown) + #ctlShadowLoginLabel,
#ctlShadowLoginPassword:focus + #ctlShadowPassLabel,
#ctlShadowLoginPassword:not(:placeholder-shown) + #ctlShadowPassLabel {
    top: -10px;
    left: 10px;
    font-size: 12px;
    color: #007BFF;
}

.contentswidth .iconheader {
    height: 40px;
    margin-bottom: 15px;
}

.iconheader img {
    height: 100%;
    margin-right: 10px;
}

.operationbox {
    position:relative;
    width: 100%;
    text-align: center;
    padding-bottom:10px;
}

.editbuttongide {
    margin-top: 10px;
    text-align: left;
}

.fsbtn {
    background-color: #5f2f8e;
    border-radius: 8px;
    width: 100%;
    height: 45px;
    position: relative;
    padding: 2px 0 2px 0;
}

.menuicon {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    margin: -5px -5px -5px -5px;
    padding: 10px 10px 10px 10px;
    line-height: 1;
}

    .menuicon > *:first-child {
        -webkit-box-flex: 0;
        flex: 0 0 30px;
        margin-left:5px;
    }

    .menuicon > *:nth-child(2) {
        margin: 0 0 0 5px;
        font-weight: 700;
        font-size: 16px;
        color: #fff;
    }

.fsbtn > a:link {
    text-decoration: none;
}

#ctlLoginRisyu {
    width: 100%;
    height: 80px;
    border-radius: 15px;
    z-index: 1;
    background-color: #ab0000;
    font-size: 20px;
}

#ctlLogin {
    width: 100%;
    height: 80px;
    border-radius: 15px;
    z-index: 1;
    background-color: #006986;
    font-size: 20px;
}

#ctlLoginNormal {
    width: 100%;
    height: 50px;
    border-radius: 15px;
    z-index: 1;
    background-color: #006986;
}

#ctlShadowBtnLogin {
    border-radius: 15px;
    height: 50px;
    width: 100%;
    margin-bottom: 15px;
    align-content: center;
}

 #ctlShadowLogin {
    border-radius: 15px;
    height: 50px;
    width: 100%;
    margin-bottom: 15px;
    align-content: center;
    background-color: #006986;
}

.button-info {
    position: absolute;
    width: 100%;
    top: 63%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 2;
    color: white;
    font-size: 12px;
}

.wrapper.radius.shadow {
    background-color: white;
    padding-top: 10px;
    padding-bottom: 1px;
    padding-left:15px;
    padding-right:15px;
}

.login.clearfix {
    text-align: center;
}

.login-side-nav {
    border-top: 1px solid black;
}

    .login-side-nav > ul {
        margin: 0;
        padding: 0;
    }

    .login-side-nav > ul > li {
        border-bottom: 1px solid black;
        padding-bottom: 1em;
        padding-top: 1em;
        list-style-type:none;
        margin-left:0;
    }

.shadow.radius > ul {
    margin: 0;
    padding: 0;
}

.no-padding {
    margin: 0;
    padding: 0;
}

.summary {
    cursor: pointer;
}

.fsguide > ul {
    margin: 0;
    padding: 0;
}

.arrow_basicb-small > .button {
    margin: 0;
}

#ctl00_ctlFooter {
    background-color: white;
}
@media (max-width: 767px) {
    body {
        font-size: 1.2rem !important;
    }

    #TestModeImage {
        bottom: 390px;
    }

    .operationbox {
        text-align: -webkit-center;
    }

    #LoginNguLogoImage {
        background-image: url("../../../Common/Images/Logo/login-ccs.png")
    }

}