@charset "utf-8";
@media screen and (max-width: 1269px) {
    #pc_wide {
        display: none !important;
    }
}
@media screen and (min-width: 960px) {
    .mobile {
        display: none !important;
    }
    #top section {
        display: inline;
    }
    #top .top_banner_l ul {
        left: 0px;
        text-align: center;
    }
    #top .top_banner_l ul li:first-child {
        padding-right: 34px;
    }
    #top .top_banner_r ul {
        left: 0px;
        text-align: center;
    }
}
@media screen and (max-width: 960px) {
    /*2023.01.19 add (S)*/
    #top .top-contents {
        display: block;
    }
    #top .top-contents main .btn-box-wrap .btn-box {
        margin: 10px 0;
    }
    #top .top-contents main .btn-box-wrap .btn-box ul {
        padding: 10px;
    }
    #top .top-contents main .btn-box-wrap .btn-box ul li {
        align-items: center;
        background-color: #3865a8;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        text-align: left;
        width: 100%;
    }
    #top .top-contents main .btn-box-wrap .btn-box ul li p {
        width: 20%;
    }
    #top .top-contents main .btn-box-wrap .btn-box ul li dl {
        width: 78%;
    }
    #top .top-contents main .btn-box-wrap .btn-box ul li dl dd {}
    /*管理者専用 スタイル*/
    #top .top-contents main .btn-box-wrap .btn-box#admin {
        width: 100%;
    }
    #top .top-contents main .btn-box-wrap .btn-box#admin ul li {
        width: 100%;
    }
    /*受講者専用 スタイル*/
    #top .top-contents main .btn-box-wrap .btn-box#students {
        width: 100%;
    }
    /*2023.01.19 add (E)*/
}
@media screen and (max-width: 959px) {
    body {
        width: 100%;
    }
    .pc {
        display: none !important;
    }
    /* 追加 2018/08/01 */
    .jspVerticalBar {
        right: 0 !important;
    }
    .drawer-hamburger {
        background: url(../images/sp_menu_btn.png) no-repeat center center;
        background-size: contain;
        top: 15px !important;
        margin-right: 10px;
    }
    .drawer-hamburger-icon {
        display: none !important;
    }
    .drawer-overlay {
        background-color: rgba(0, 0, 0, .5) !important;
    }
    .drawer-nav {
        font-size: 14px;
    }
    .drawer-nav li a {
        background: #fff;
    }
    #login .wrapper {
        height: auto;
        background-size: contain;
    }
    #login .container {
        width: 90%;
        margin: 0 auto;
    }
    #login header h1 {
        padding-top: 20px;
        float: none;
        width: 90%;
        margin: 0 auto;
    }
    #login header h1 img {
        display: block;
        width: 100%;
    }
    #login header h2 img {
        display: block;
        width: 90%;
    }
    #login header #login-box {
        float: none;
        background: rgba(211, 226, 236, 0.7);
        margin-top: 26px;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        padding: 0px;
        box-sizing: inherit;
        width: 100%;
    }
    #login header #login-box table {
        width: 85%;
        margin: 0 auto;
        padding: 5% 0;
    }
    #login header #login-box table tr {
        /*width: 100%;*/
    }
    #login header #login-box table tr td {
        width: 100%;
    }
    #login header #login-box input.email, #login header #login-box input.password {
        width: 100%;
        text-indent: 1em;
    }
    .sb td input {
        width: 100% !important;
    }
    #submit_btn {
        /*background-image: url("../images/submit_btn_sp.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 45px;
    display: block;*/
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0.96, #33609e), color-stop(0.00, #5b85be));
        background: -webkit-linear-gradient(top, #5b85be 0%, #33609e 96%);
        background: -moz-linear-gradient(top, #5b85be 0%, #33609e 96%);
        background: -o-linear-gradient(top, #5b85be 0%, #33609e 96%);
        background: -ms-linear-gradient(top, #5b85be 0%, #33609e 96%);
        background: linear-gradient(to bottom, #5b85be 0%, #33609e 96%);
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        -o-border-radius: 3px;
        -ms-border-radius: 3px;
        overflow: visible;
        text-indent: 0;
        white-space: normal;
        font-weight: bold;
        color: #fff;
        font-size: 1.14em;
    }
    .login .info {
        margin-top: 30px;
    }
    .info h2 img {
        width: 100%;
    }
    .info .info_box dl {
        width: 100%;
        border-bottom: 1px dotted #c9c9c9;
        margin: 0 auto;
        font-size: 14px;
        padding: 20px 0;
    }
    .info .info_box dl dt {
        width: 100%;
        float: none;
    }
    .info .info_box dl dd {
        float: none;
        width: 100%;
    }
    .info .info_box {
        height: 100%;
        margin-bottom: 10px;
    }
    /* 2018-09-12追加 */
    .login footer p {
        color: #fff;
        font-family: "メイリオ";
        font-size: 12px;
        text-align: left;
        padding-left: 10px;
        right: 10px;
    }
    /* 2018-09-12削除   
.login footer p {
    color: #fff;
    font-family: "メイリオ";
    font-size: 12px;
    text-align: left; 
    padding: 2% 5%;
}
*/
    /*===================================================
     Total
===================================================*/
    .total main, .lecture main {
        width: 90% !important;
        min-width: inherit;
        margin: 0 auto;
    }
    .total .logout {
        display: none;
    }
    .test_sp_menu ul li {
        background: #3865a8;
        font-size: 18px;
        border-bottom: 1px solid #fff;
        padding: 2% 5%;
    }
    .test_sp_menu ul li a {
        color: #fff;
        text-decoration: none;
    }
    .test_sp_menu ul li a:before {
        content: ">";
        font-family: "ＭＳ ゴシック";
        color: #fff;
        padding-right: 2%;
        font-size: 14px;
    }
    .total main h2 {
        width: 45%;
        padding-top: 22px;
    }
    .total main h2 img {
        width: 100%;
    }
    .total h3 {
        padding: 7px 20px !important;
        margin: 22px 0 !important;
    }
    .total main ul {
        text-align: center;
        margin-bottom: 0;
    }
    .total main ul li {
        float: none !important;
        padding: 0;
        display: inline-block;
    }
    .total main ul li img {
        width: 90%;
    }
    .total h4 {
        display: none;
    }
    .total main #list {
        font-size: 16px;
        text-align: center;
        padding-bottom: 20px;
    }
    .total main #list li {
        padding-bottom: 5px;
    }
    .total main table thead th {
        text-align: center;
        height: inherit;
        padding: 10px 0;
    }
    .total table thead td ul li {
        margin: 0;
        padding: 0 10px;
    }
    .total table tbody td {
        text-indent: inherit;
        padding: 2%;
    }
    .total table tbody td a {
        padding-left: 4%;
    }
    .total footer .setting {
        display: none;
    }
    .total footer p {
        color: #fff;
        font-family: "メイリオ";
        font-size: 12px;
        text-align: left;
        padding: 2% 5%;
    }
    .total nav {
        background: #3865a8;
    }
    .total nav ul {
        font-size: inherit !important;
    }
    .total nav ul li {
        display: table !important;
        width: 100%;
    }
    .total nav ul li a {
        background: #3865a8 !important;
        display: table;
        color: #fff;
        font-size: 16px;
        text-align: left;
        width: 100%;
        padding: 20px 0 20px 5px;
        border-bottom: 1px solid #fff;
    }
    /*===================================================
     Start
===================================================*/
    .start main, .lecture main {
        width: 90% !important;
        min-width: inherit;
        margin: 0 auto;
        /* 2018-09-12 add */
        padding: 0 8px;
    }
    .start .logout {
        display: none;
    }
    .test_sp_menu ul li {
        background: #3865a8;
        font-size: 18px;
        border-bottom: 1px solid #fff;
        padding: 2% 5%;
    }
    .test_sp_menu ul li a {
        color: #fff;
        text-decoration: none;
    }
    .test_sp_menu ul li a:before {
        content: ">";
        font-family: "ＭＳ ゴシック";
        color: #fff;
        padding-right: 2%;
        font-size: 14px;
    }
    .start main h2 {
        width: 45%;
        padding-top: 22px;
    }
    .start main h2 img {
        width: 100%;
    }
    .start h3 {
        padding: 7px 5px 7px 10px !important;
        margin: 22px 0 !important;
    }
    .start h3 span {
        padding: 7px 0 !important;
        margin: 22px 0 !important;
        font-weight: bold;
        line-height: 1.2em;
    }
    .start main ul {
        text-align: center;
        margin-bottom: 22px;
    }
    .start main ul li {
        float: none !important;
        padding: 0;
        display: inline-block;
    }
    .start main ul li img {
        width: 90%;
    }
    .start h4 {
        display: none;
    }
    .start main table thead th {
        text-align: center;
        height: inherit;
        padding: 10px 0;
    }
    .start table thead td ul li {
        margin: 0;
        padding: 0 10px;
    }
    .start table tbody td {
        text-indent: inherit;
        padding: 2%;
    }
    .start table tbody td a {
        padding-left: 4%;
    }
    .start footer .setting {
        display: none;
    }
    .start footer p {
        color: #fff;
        font-family: "メイリオ";
        font-size: 12px;
        text-align: left;
        padding: 2% 5%;
    }
    .start nav {
        background: #3865a8;
    }
    .start nav ul {
        font-size: inherit !important;
    }
    .start nav ul li {
        display: table !important;
        width: 100%;
    }
    .start nav ul li a {
        background: #3865a8 !important;
        display: table;
        color: #fff;
        font-size: 16px;
        text-align: left;
        width: 100%;
        padding: 20px 0 20px 5px;
        border-bottom: 1px solid #fff;
    }
    /*===================================================
     Management2
===================================================*/
    .management2 main {
        width: 96% !important;
        min-width: inherit;
        margin: 0 auto;
        /* 2018-09-12 add */
        padding: 0 8px;
    }
    .management2 .logout {
        display: none;
    }
    .management2 .wrapper {
        background: url(../images/check_bg.png) no-repeat;
        background-size: contain;
        width: 100%;
    }
    .management2 header {
        background: none;
    }
    .management2 h2 {
        width: 100%;
        text-indent: 2%;
    }
    .management2 h2 img {
        width: 40%;
    }
    .management2 nav {
        background: none !important;
    }
    .management2 nav ul {
        width: 100%;
    }
    .management2 nav ul li {
        width: 33.3%;
    }
    .management2 nav ul li a {
        background: none !important;
        display: inline;
        width: 33.3%;
        height: auto;
        padding-top: 0;
        overflow: visible;
    }
    .management2 nav ul li a img {
        width: 100%;
    }
    .management2 .search_area {
        display: none
    }
    .management2 .desc_sp {
        width: 95%;
        margin: 0 auto;
        padding-top: 15px;
    }
    .management2 .desc_sp ul {
        text-align: center;
        background: #eeeeee;
        padding: 2% 0;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }
    .management2 .desc_sp ul li {
        font-size: 14px;
        padding: 0;
        float: none;
        display: inline-block;
    }
    .management2 .desc_sp ul li:first-child {
        font-size: 14px;
        background: url("../images/before_btn.png") no-repeat;
        background-position: left center;
        background-size: 15px 15px;
        text-indent: 20px;
    }
    .management2 .desc_sp ul li:nth-child(2) {
        font-size: 14px;
        background: url("../images/now_btn1.png") no-repeat;
        background-position: left center;
        background-size: 15px 15px;
        text-indent: 20px;
    }
    .management2 .desc_sp ul li:nth-child(3) {
        font-size: 14px;
        background: url("../images/finish_btn.png") no-repeat;
        background-position: left center;
        background-size: 15px 15px;
        text-indent: 20px;
    }
    .management2 .desc_sp2 {
        width: 95%;
        margin: 0 auto;
    }
    .management2 .desc_sp2 ul {
        text-align: center;
        background: #eeeeee;
        padding: 2% 0;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }
    .management2 .desc_sp2 ul li {
        font-size: 14px;
        padding: 0;
        float: none;
        display: inline-block;
    }
    .management2 .desc_sp2 ul li:first-child {
        font-size: 14px;
        background: url("../images/to_le_btn.png") no-repeat;
        background-position: left center;
        background-size: 15px 15px;
        text-indent: 20px;
    }
    .management2 .desc_sp2 ul li:nth-child(2) {
        font-size: 14px;
        background: url("../images/to_result_btn.png") no-repeat;
        background-position: left center;
        background-size: 15px 15px;
        text-indent: 20px;
    }
    .management2 .desc_sp p {
        margin: 3% 0;
    }
    /* 検索結果数 結果ソートパーツを非表示にした際の表上アイコン群 */
    .management2 .note-desc {
        flex-wrap: wrap;
        justify-content: center;
    }
    .management2 .note-desc .result-number {
        flex: unset;
        order: 3;
        padding: 20px 0 0 0;
        width: 100%;
    }
    .management2 .note-desc .icon-area.results {
        display: none;
    }
    .jyuko_sp {
        width: 100%;
    }
    .jyuko_sp ul li a {
        color: #fff;
        text-decoration: none;
    }
    .jyuko_sp ul.top {
        font-size: 0;
        background: url(../images/sp_btn_bg01.png) repeat-x;
    }
    .jyuko_sp ul.top li {
        display: inline-block;
        float: none;
        width: 50%;
        font-size: 18px;
        text-align: center;
        padding: 24px 0;
        color: #fff;
    }
    .jyuko_sp ul.under {
        font-size: 0;
        background: #95b0d6;
    }
    .jyuko_sp ul.under li {
        display: inline-block;
        float: none;
        width: 50%;
        font-size: 18px;
        text-align: center;
        padding: 14px 0;
        color: #fff;
    }
    .jyuko_sp ul li.current {
        /*	filter: alpha(opacity=60);
	-moz-opacity:0.6;
	opacity:0.6;*/
    }
    .jyuko_sp ul.top li.current {
        background: url(../images/sp_btn_bg1.png) repeat-x;
    }
    .jyuko_sp ul.under li.current {
        background: #3865a8;
    }
    .management2 .input_form table th {
        width: 10%;
    }
    .management2 .input_form table td:nth-child(2) {
        width: 15%;
    }
    .management2 .input_form table td:nth-child(6) {
        width: 5%;
    }
    .management2 .input_form table td:nth-child(4), .management2 .input_form table td:nth-child(5) {
        display: none;
    }
    .management2 .input_form {
        border: 3px solid #3865a8;
        padding: 1.5%;
    }
    .management2 .input_form2 table th {
        width: 10%;
    }
    .management2 .input_form2 table td:nth-child(2) {
        width: 15%;
    }
    .management2 .input_form2 table td:nth-child(3) {
        width: 15%;
    }
    .management2 .input_form2 table td:nth-child(4), .management2 .input_form2 table td:nth-child(5), .management2 .input_form2 table td:nth-child(6) {
        display: none;
    }
    .management2 .input_form2 table td:nth-child(7) {
        width: 5%;
    }
    .management2 .input_form2 {
        border: 3px solid #3865a8;
        padding: 1.5%;
    }
    .management2 ul.pager {
        width: 90%;
        margin: 5% auto;
    }
    .management2 footer .setting {
        display: none;
    }
    .management2 footer p {
        color: #fff;
        font-family: "メイリオ";
        font-size: 12px;
        text-align: left;
        padding: 2% 5%;
    }
    .management2 .drawer-nav, .management3 .drawer-nav {
        background: #3865a8 !important;
    }
    .management2 .drawer-nav ul, .management3 .drawer-nav ul {
        font-size: inherit !important;
    }
    .management2 .drawer-nav ul li, .management3 .drawer-nav ul li {
        display: table !important;
        width: 100%;
    }
    .management2 .drawer-nav ul li a, .management3 .drawer-nav ul li a {
        background: #3865a8 !important;
        display: table;
        color: #fff;
        font-size: 16px;
        text-align: left;
        width: 100%;
        padding: 20px 0 20px 5px;
        border-bottom: 1px solid #fff;
    }
    /*===================================================
     Check
===================================================*/
    .check .wrapper {
        background: url(../images/check_bg.png) no-repeat;
        background-size: contain;
        width: 100%;
    }
    .check header {
        background: none;
    }
    .check main h2.check_ttl {
        width: 100%;
    }
    .check main h2.check_ttl img {
        width: 40%;
    }
    .check main .input_form .sub {
        margin: 26px auto;
    }
    .check main .input_form2 .sub {
        margin: 26px auto;
    }
    .check #confirm {
        padding: 0 0 3px 0;
        margin-top: 0;
    }
    /*===================================================
     Top
===================================================*/
    #top .top_banner_l, #top .top_banner_c {
        background: #3865A8;
        border-radius: 5px;
        width: 100%;
        height: auto;
        display: block;
        float: none;
        margin-left: 0;
        position: relative;
        padding: 0% 3% 3% 3%;
        box-sizing: border-box;
        margin-bottom: 10%;
    }
    #top .top_banner_l_inner, #top .top_banner_c_inner, #top .top_banner_r_inner {
        background: #fff;
        border-radius: 5px;
        box-sizing: border-box;
        padding: 5%;
    }
    #top main {
        width: 1139px;
        margin: 0 auto;
        display: block;
        height: auto;
        padding-bottom: 0px;
        position: static;
    }
    #top .top_banner_r {
        background: #26A2D5;
        border-radius: 5px;
        width: 100%;
        height: auto;
        display: block;
        float: none;
        margin-left: 0px;
        position: relative;
        padding: 0% 3% 3% 3%;
        box-sizing: border-box;
        margin-bottom: 10%;
    }
    #top .top_banner_l ul, #top .top_banner_c ul {
        position: static;
        margin: 0;
    }
    #top .top_banner_l ul li, #top .top_banner_l ul li img, #top .top_banner_c ul li, #top .top_banner_c ul li img, #top .top_banner_r ul li, #top .top_banner_r ul li img {
        width: 100%;
    }
    #top .top_banner_l ul li:first-child, #top .top_banner_c ul li:first-child {
        padding-bottom: 5%;
    }
    #top .top_banner_r ul {
        position: static;
        margin: 0;
    }
    h2.mobile {
        text-align: center;
        width: 100% !important;
        color: #fff;
        font-size: 2em;
        padding: 3% 0 !important;
        font-weight: bold;
    }
    #top footer .setting {
        display: inherit;
        text-align: center;
        float: none;
    }
    /*===================================================
     test
===================================================*/
    .test main {
        width: 90% !important;
        min-width: inherit;
        margin: 0 auto;
    }
    .test .logout {
        display: none;
    }
    .test .wrapper {
        background: url(../images/check_bg.png) no-repeat;
        background-size: contain;
        width: 100%;
    }
    .test header {
        background: none;
    }
    .test main .input_form .sub {
        margin: 26px auto;
    }
    .test main .input_form2 .sub {
        margin: 26px auto;
    }
    .test .basic th {
        width: 35%;
        padding-left: 8px;
        text-indent: 0em;
    }
    .test .basic td {
        width: 65%;
    }
    .test .input_form table td {
        background: #fff;
    }
    /*参考画像 reference */
    .lecture main table tbody tr td ul.reference {
        width: 90% !important;
        min-width: inherit;
    }
/*===================================================
     .search_area_new 検索ボックス
===================================================*/
    .search_area_new{
    	padding: 2%;
    }
    .search_area_new dl dt ,
    .search_area_new dl dd {
        float: none;
        width: 100%;
    }
    .search_area_new dl dd {
        box-sizing: border-box;
        padding: .25rem;
        text-align: right;
        margin: 5px 0;
    }
    .search_area_new dl dt .tableArea {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }
    .search_area_new dl dt .tableArea .tableAreaBox_4 {
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        margin-right: 0;
        padding: .25rem;
        width: 50%;
    }
    .iconCell.txt {
        width: 100%;
        display: block;
        min-width: auto;
        text-align: left;
    }
    .iconCell > span {
        text-align: left;
    }
    .iconCell > span.t9px{
        font-size: 1em;
    }
    .inputCell.txt {
        display: block;
    }
}
@media screen and (max-width: 767px) {
    #pc_min {
        display: none !important;
    }
}
@media screen and (max-width: 600px) {
    #sp_max {
        display: none !important;
    }
}
@media screen and (max-width: 513px) {
    .login footer p {
        margin-top: -1em;
    }
}