@charset "shift-jis";
/* ==========================================================================
/school/index.html
========================================================================== */

article.orange h3.type { background: #E16F4E;}
article.orange .content { border: 1px solid #E16F4E;}
article .content > li{
    padding-bottom: 30px;
    border-bottom: 1px dashed #898989;
    margin-bottom: 30px;
}
article .content > li:last-child{
    border-bottom: 0;
    margin-bottom: 0;
}
article .content li h4,
article .content > li > p{
    width: 58%;
    text-align: left;
}
article .content li.noimg h4,
article .content li.noimg p{
    width: 100%;
    text-align: center;
}

article .content li h4{
    padding: 5px 5px 5px 63px;
    font-size: 30px;
    line-height: 1.5;
    letter-spacing: 0;
    margin-bottom: 15px;
    box-sizing: border-box;
    float: left;
}
article .content .kabu h4{
    background: url(/guidance/images/main_school/icn_kabu.svg) left center/56px no-repeat;
}
article .content .fudo h4{
    background: url(/guidance/images/main_school/icn_fudo.svg) left center/56px no-repeat;
}
article .content .fx h4{
    background: url(/guidance/images/main_school/icn_fx.svg) left center/56px no-repeat;
}
article .content .kyoyo h4{
    background: url(/guidance/images/main_school/icn_kyoyo.svg) left center/56px no-repeat;
}
article .content .for50s h4{
    background: url(/guidance/images/main_school/icn_50s.svg) left center/56px no-repeat;
}
article .content .mutualfund h4{
    background: url(/guidance/images/main_school/icn_mutualfund.svg) left center/56px no-repeat;
}
article .content li h4 span.sub{
    font-size: 14px;
    display: block;
}

article .content li p.photo{
    float: right;
    width: 340px;
    height: 220px;
    overflow: hidden;
    position: relative;
    margin-bottom: 2em;
}
article .content li p.photo img{
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 100%;
}

article .content li.plus p.lead{ font-weight: bold; text-align: left;}
article .content li.plus h4{
    padding-left: inherit;
    position: relative;
    text-align: center;
    margin: 40px auto;
}
article .content li.plus h4 span.circle{
    font-size: 90%;
    border: 1px solid #E16F4E;
    border-radius: 50%;
    padding: 22px 10px;
    margin-right: 10px;
    position: absolute;
    top: -20px;
    left: 8.5em;
}
article .content li.plus h4 span.hour{
    display: block;
    color: #333;
    font-size: 13px;
    padding: 12px 22px 11px;
    margin-left: 10px;
    position: absolute;
    top: -17px;
    right: 17em;
    left: auto;
}
article .content li.plus h4 .hour img{
    display: block;
    margin: 0 auto 5px;
}
article .content li.plus h4 .comment{
    display: block;
    color: #333;
    position: absolute;
    right: 8em;
    top: -5px;
    font-size: .5em;
}
article .content li.plus h4 .comment::before{
    content: "";
    display: block;
    border-top: 1px dashed #E16F4E;
    transform: rotate(-10deg);
    margin-bottom: 10px;
}
article .content li.plus h4 .comment::after{
    content: "";
    display: block;
    border-bottom: 1px dashed #E16F4E;
    transform: rotate(10deg);
    margin-top: 10px;
}


article .content li h4.new{
    padding-left: 0;
    font-size: 14px;
}
article .content li.kabu h4.new{
    background: none;
}
article .content li.kabu h4.new svg{
    width: 180px;
    display: block;
    margin-bottom: 15px;
}

article .content li .btn{
    clear: both;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    width: 70%;
    margin: 0 auto;
}
article .content li .btn a{
    display: block;
    text-align: center;
    width: 283px;
    padding: 10px 18px;
    font-size: 20px;
    color: #fff;
    text-decoration: none;
    position: relative;
    box-sizing: border-box;
}
article .content li .btn a:after{
    content: "";
    background: url(../../guidance/images/common/arrow.svg) right center/25px no-repeat;
    padding: 13px;
    display: inline-block;
    position: absolute;
    right: 20px;
    top: 0;
    bottom: 0;
    margin: auto;
}

/*article .content .kabu{ background: url(../../guidance/images/main_school/img_kabu.jpg) right top/38% no-repeat;}*/
article .content .kabu h4{ color: #5E76A7;}
/*article .content .kabu p{ margin-bottom: 13em;}*/
article .content .kabu .btn1 a{ background: #5E76A7; border-color: #5E76A7;}
article .content .kabu .btn_dl a{ color: #5E76A7;}
p.lead .line_kabu{ border-bottom: 2px solid #5E76A7; padding-bottom: 2px;}
article .content .kabu ul.point p{ color: #5E76A7;}
article .content .kabu ul.point .icn .fill{ fill: #5E76A7;}
article .content .kabu li.btn_dl .icn .fill{ fill: #5E76A7;}

/*article .content .fudo{ background: url(../../guidance/images/main_school/img_fudo.jpg) right top/38% no-repeat;}*/
article .content .fudo h4{ color: #44A1C5;}
/*article .content .fudo p{ margin-bottom: 13em;}*/
article .content .fudo .btn1 a{ background: #44A1C5; border-color: #44A1C5;}
article .content .fudo .btn_dl a{ color: #44A1C5;}
p.lead .line_fudo{ border-bottom: 2px solid #44A1C5; padding-bottom: 2px;}
article .content .fudo ul.point p{ color: #44A1C5;}
article .content .fudo ul.point .icn .fill{ fill: #44A1C5;}
article .content .fudo li.btn_dl .icn .fill{ fill: #44A1C5;}

/*article .content .fx{ background: url(../../guidance/images/main_school/img_fx.jpg) right top/38% no-repeat;}*/
article .content .fx h4{ color: #C36380; letter-spacing: -.6px;}
/*article .content .fx p{ margin-bottom: 13em;}*/
article .content .fx .btn1 a{ background: #C36380; border-color: #C36380;}
article .content .fx .btn_dl a{ color: #C36380;}
p.lead .line_fx{ border-bottom: 2px solid #C36380; padding-bottom: 2px;}
article .content .fx ul.point p{ color: #C36380;}
article .content .fx ul.point .icn .fill{ fill: #C36380;}
article .content .fx li.btn_dl .icn .fill{ fill: #C36380;}

/*article .content .kyoyo{ background: url(../../guidance/images/main_school/img_kyoyo.jpg) right top/38% no-repeat;}*/
article .content .kyoyo h4{ color: #7E678D;}
/*article .content .kyoyo p{ margin-bottom: 13em;}*/
article .content .kyoyo .btn1 a{ background: #7E678D; border-color: #7E678D;}
article .content .kyoyo .btn_dl a{ color: #7E678D;}
p.lead .line_kyoyo{ border-bottom: 2px solid #7E678D; padding-bottom: 2px;}
article .content .kyoyo ul.point p{ color: #7E678D;}
article .content .kyoyo ul.point .icn .fill{ fill: #7E678D;}
article .content .kyoyo li.btn_dl .icn .fill{ fill: #7E678D;}

article .content .mutualfund h4{ color: #8A9F55; letter-spacing: -.6px;}
article .content .mutualfund .btn1 a{ background: #8A9F55; border-color: #8A9F55;}
article .content .mutualfund .btn_dl a{ color: #8A9F55;}
p.lead .line_mutualfund{ border-bottom: 2px solid #8A9F55; padding-bottom: 2px;}
article .content .mutualfund ul.point p{ color: #8A9F55;}
article .content .mutualfund ul.point .icn .fill{ fill: #8A9F55;}
article .content .mutualfund li.btn_dl .icn .fill{ fill: #8A9F55;}

article .content .orange h4{ color: #E16F4E;}
article .content .orange .btn1 a{ background: #E16F4E; border-color: #E16F4E;}
article .content .orange .btn_dl a{ color: #E16F4E;}
article .content .orange ul.point p{ color: #E16F4E;}
article .content .orange ul.point .icn .fill{ fill: #E16F4E;}
article .content .orange li.btn_dl .icn .fill{ fill: #E16F4E;}
/*article .content .for50s{ background: url(../../guidance/images/main_school/img_50s.jpg) right top/38% no-repeat;}*/
/*article .content .for50s p{ margin-bottom: 10em;}*/


article .content li .btn a.check{
    background: #727171;
    text-align: left;
}

article .content ul.point{
    text-align: left;
    display: flex;
    margin: 60px 0;
}
article .content ul.point > li{
    width: 96px;
    margin: 0 5px;
    text-align: center;
}
article .content ul.point .icn{
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
}
article .content ul.point p{
    font-size: 12px;
    margin-top: .5em;
    margin-bottom: 0;
}

section.course div h3{
    position: relative;
    margin-top: 60px;
    margin-bottom: 60px;
    border-top: 1px solid #1c236d;
}
section.course div h3 span.inner{
    display: block;
    font-size: 22px;
    width: 445px;
    padding-top: 3px;
    padding-bottom: 3px;
    background: #fff;
    text-align: center;
    letter-spacing: .2em;
    position: absolute;
    top: -25px;
    left: 0;
    right: 0;
    margin: auto;
    border-top: 2px solid #1c236d;
    border-bottom: 2px solid #1c236d;
    color: #1c236d;
}
section.course.bg-beige div h3 span.inner{
    background: #f3f3f2;
}
section.course div .course > li a.btn{
    border: 1px solid #1c236d;
    color: #1c236d;
}

section.course .kabu h3{ border-top: 1px solid #5E76A7;}
section.course .kabu h3 span.inner{
    border-color: #5E76A7;
    color: #5E76A7;
}
section.course .kabu .course > li a.btn{
    border: 1px solid #5E76A7;
    color: #5E76A7;
}

section.course .fudo h3{ border-top: 1px solid #44A1C5;}
section.course .fudo h3 span.inner{
    border-color: #44A1C5;
    color: #44A1C5;
}
section.course .fudo .course > li a.btn{
    border: 1px solid #44A1C5;
    color: #44A1C5;
}

section.course .fx h3{ border-top: 1px solid #C36380;}
section.course .fx h3 span.inner{
    border-color: #C36380;
    color: #C36380;
}
section.course .fx .course > li a.btn{
    border: 1px solid #C36380;
    color: #C36380;
}

section.course .mutualfund h3{ border-top: 1px solid #8A9F55;}
section.course .mutualfund h3 span.inner{
    border-color: #8A9F55;
    color: #8A9F55;
}
section.course .mutualfund .course > li a.btn{
    border: 1px solid #8A9F55;
    color: #8A9F55;
}

section.course div .course{
    display: flex;
    margin: 0 -16px;
    justify-content: flex-start;
    flex-wrap: wrap;
}
section.course div .course > li{
    width: 33.3%;
    margin-bottom: 50px;
    padding: 0 16px;
    border-left: 1px dashed #898989;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    position: relative;
}
section.course div .course > li.double {
    flex-direction: initial;
    width: 66.6%;
}
section.course div .course > li.double > .inner{
    display: inline-block;
    width: 48%;
    vertical-align: top;
}
section.course div .course > li.double > .inner:first-child{
    padding: 0;
}
section.course div .course > li .column{
    margin-left: 3%;
    background: #f3f3f2;
    padding: 15px 15px 0;
    box-sizing: border-box;
    text-align: left;
}
section.course div .course > li .column h5{
    margin-bottom: 10px;
    font-size: 15px;
}
section.course div .course > li .column p img{ width: 100%;}
section.course div .course > li.bottom::after{
    content: "";
    display: block;
    width: 100%;
    padding: 10px;
    border-top: 1px dashed #898989;
    position: absolute;
    bottom: -45px;
    left: 0;
}

section.course h2~.level{
    color: #727171;
    border: 1px solid #727171;
    border-radius: 5px;
    width: 35%;
    margin: 0 auto 20px;
}
section.course div .course > li h4{
    font-weight: bold;
    font-size: 1.8rem;
    line-height: 1.3;
    text-align: left;
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

section.course div .course .tags{
    color: #1c236d;
    font-size: 14px;
    text-align: left;
    margin-bottom: 1em;
}
section.course div .course .tags li{
    display: inline-block;
    border: 1px solid;
    border-radius: 2em;
    padding: 3px 5px;
    margin-right: 5px;
    margin-bottom: 5px;
}

section.course div .course .date_live{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
section.course div .course .date_live .ttl{
    background: #e16f4e;
    border-radius: 3px;
    color: #fff;
    font-size: .8em;
    line-height: 1.3;
    padding: 3px;
    margin-right: 8px;
}
section.course div .course .date_live .date{
    color: #e16f4e;
    margin-bottom: 0;
}
section.course div .course .date_live .date .marker{
    background: linear-gradient(transparent 40%, rgba(234,85,32,0.1) 40%);
    padding: 0 2px 5px;
}

section.course div .course > li .level{
    color: #727171;
    border: 1px solid #727171;
    border-radius: 5px;
}
section.course div .course > li .text{
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    align-content: space-between;
}
.campaign_txt{
    text-align: center;
    color: #e16f4e;
    margin-top: 10px;
    flex: 1 1 auto;
}

section.course div .course > li a.btn{
    display: block;
    text-decoration: none;
    font-size: 16px;
    padding: 6px;
    margin-top: auto;
}

section.course div .course > li h4 > span{ width: calc(100% - 4em);}
section.course div .course .pickup .icn{
    font-family: 'Josefin Slab', serif;
    background: #44A1C5;
    width: 3em;
    height: 3em;
    padding: .3em;
    border-radius: 100%;
    margin-right: 1em;
    text-align: center;
    color: #fff;
    line-height: 1.2;
    font-size: 13px;
    letter-spacing: 0.05em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    vertical-align: middle;
}
section.course div .course .pickup .text{ height: auto;}

section.course .detail{
    margin-bottom: 40px;
    background: #f3f3f2;
    padding: 30px;
    box-sizing: border-box;
}
section.course .detail h3{
    margin-top: 0;
    margin-bottom: 25px;
    font-size: 18px;
    letter-spacing: 0;
    border-top: 0;
}
section.course .detail dl{ font-size: 16px;}
section.course .detail dt{
    margin-bottom: 50px;
    position: relative;
    padding-left: 5.5%;
}
section.course .detail dt span{
    font-size: 4em;
    margin: 0 15px;
    color: #1c236d;
    vertical-align: -.15em;
}
section.course .detail dt::after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 6px 0 6px;
    border-color: #1c236d transparent transparent transparent;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -30px;
}
section.course .detail dd{
    color: #1c236d;
    border-bottom: 5px double #1c236d;
    display: inline;
    padding: 3px;
}



/* 1025px以上のモニター */
@media screen and (min-width: 1025px) {
    #learning .list li:nth-child(3n) {
        margin-right: 0; }
}

/* タブレット */
@media screen and (min-width: 600px) and (max-width: 1024px) {
    article .content li h4,
    article .content > li > p{
        width: 100%;
        float: none;
    }
    article .content li p.photo{
        float: none;
        margin: 0 auto 20px;
    }
/*    article .content li p{ padding-top: 400px;}*/

/*    article .content .kabu{ background: url(../../guidance/images/main_school/img_kabu.jpg) center 70px/85% no-repeat;}
    article .content .fudo{ background: url(../../guidance/images/main_school/img_fudo.jpg) center 70px/85% no-repeat;}
    article .content .fx{ background: url(../../guidance/images/main_school/img_fx.jpg) center 70px/85% no-repeat;}
    article .content .kyoyo{ background: url(../../guidance/images/main_school/img_kyoyo.jpg) center 70px/85% no-repeat;}
    article .content .for50s{ background: url(../../guidance/images/main_school/img_50s.jpg) center 100px/85% no-repeat;}*/

    article .content li .btn a{
        width: 48%;
        font-size: 18px;
    }
    article .content li .btn a:after {
        background: url(../../guidance/images/common/arrow.svg) right center/20px no-repeat;
        right: 10px;
    }

    article .content li.plus p.lead{ padding-top: inherit;}
    article .content li.plus h4{ margin-left: inherit;}
    article .content li.plus h4 span.circle { left: 6%;}
    article .content li.plus h4 span.hour{ left: auto; right: 6%;}
    article .content li.plus h4 .comment{
        left: 30%;
        top: -20px;
        box-sizing: border-box;
        line-height: 2;
    }
    article .content li.plus h4 .comment::before{
        transform: rotate(-110deg);
        margin-top: 0;
        margin-bottom: -12px;
        margin-left: 40px;
        width: 30px;

    }
    article .content li.plus h4 .comment::after{
        transform: rotate(110deg);
        margin-top: -16px;
        margin-left: 150px;
        width: 30px;
    }

    section.course div .course > li h4{ height: 4em;}

}

/* 1024px以下のモニター */
@media screen and (max-width: 1024px) {
    article .content li.kabu p,
    article .content li.fudo p,
    article .content li.fx p,
    article .content li.mutualfund p,
    article .content li.kyoyo p,
    article .content li.for50s p{
        font-size: 14px;
        line-height: 1.8;
    }
    article .content li .btn{ width: 100%;}

    #media ul li {
        width: 13%;
        max-height: 124px; }
    #media ul li:not(:nth-child(6n+6)) {
        margin-right: 4.4%; }
    #media .btn a {
        max-width: 100%; }

    .web_course dl {
        border-top: 1px solid #000;
        margin-bottom: 35px; }
    .web_course dl dt {
        width: 20%;
        padding: 14px 0; }
    .web_course dl dd {
        width: 80%;
        padding: 14px 0; }

    article .content li h4,
    article .content > li > p{
        width: 100%;
        float: none;
    }
    article .content li p.photo{
        float: none;
        margin: 0 auto 20px;
        width: 85%;
    }

    section ul.detail li h2 { font-size: 20px;}
}

/* スマホ未満 */
@media screen and (min-width: 599px) {
    section.course div .course > li.left_none{ border-left: 0;}
}

/* 599px以下（スマホ） */
@media screen and (max-width: 599px) {
    article h3.type {
        font-size: 20px;
    }
    article .content > li {
        padding: 30px 0;
        margin-bottom: 0;
    }
    article .content li h4,
    article .content li p{ width: 100%;}
    article .content li h4{
        font-size: 24px;
        margin-bottom: 10px;
        padding: 0 0 0 55px;
    }
    article .content .kabu h4{ background: url(/guidance/images/main_school/icn_kabu.svg) left center/45px no-repeat;}
    article .content .fudo h4{ background: url(/guidance/images/main_school/icn_fudo.svg) left center/45px no-repeat;}
    article .content .fx h4{ background: url(/guidance/images/main_school/icn_fx.svg) left center/45px no-repeat;}
    article .content .kyoyo h4{ background: url(/guidance/images/main_school/icn_kyoyo.svg) left center/45px no-repeat;}
    article .content .for50s h4{ background: url(/guidance/images/main_school/icn_50s.svg) left center/45px no-repeat;}
    article .content .mutualfund h4{ background: url(/guidance/images/main_school/icn_mutualfund.svg) left center/45px no-repeat;}
    article .content li h4 span.sub{ font-size: 12px;}
/*    article .content li p{ padding-top: 150px;}*/

/*    article .content .kabu{ background: url(../../guidance/images/main_school/img_kabu.jpg) center 65px/50% no-repeat;}
    article .content .fudo{ background: url(../../guidance/images/main_school/img_fudo.jpg) center 65px/50% no-repeat;}
    article .content .fx{ background: url(../../guidance/images/main_school/img_fx.jpg) center 65px/50% no-repeat;}
    article .content .kyoyo{ background: url(../../guidance/images/main_school/img_kyoyo.jpg) center 65px/50% no-repeat;}
    article .content .for50s{ background: url(../../guidance/images/main_school/img_50s.jpg) center 90px/50% no-repeat;}*/
    article .content .kabu,
    article .content .fudo,
    article .content .fx,
    article .content .mutualfund,
    article .content .kyoyo,
    article .content .for50s{ background: none;}

    article .content .kabu p.photo,
    article .content .fudo p.photo,
    article .content .fx p.photo,
    article .content .mutualfund p.photo,
    article .content .kyoyo p.photo,
    article .content .for50s p.photo{
        height: 100px;
        width: 100%;
    }
    article .content li.kyoyo p.photo img{
        top: 80px;
    }
    article .content li.for50s p.photo img{
        top: 60px;
    }

    article .content li.plus p.lead{ padding-top: inherit;}
    article .content li.plus h4{
        margin-left: inherit;
        font-size: 22px;
        margin-bottom: 20px;
    }
    article .content li.plus h4 span.circle{
        font-size: 80%;
        padding: 12px 5px;
        margin-right: 5px;
        left: 5%;
        top: -10px;
    }
    article .content li.plus h4 span.hour{
        padding: 6px 11px 2px;
        font-size: 11px;
        top: -10px;
        right: 4%;
        left: auto;
    }
    article .content li.plus h4 .hour img{
        width: 12px;
        margin-bottom: 2px;
    }
    article .content li.plus h4 .comment{
        left: 0;
        right: 0;
        top: -20px;
        box-sizing: border-box;
        line-height: 2;
        font-size: .7em;
    }
    article .content li.plus h4 .comment::before{
        transform: rotate(-110deg);
        margin-top: 0;
        margin-bottom: -12px;
        margin-left: 30%;
        width: 30px;

    }
    article .content li.plus h4 .comment::after{
        transform: rotate(110deg);
        margin-top: -18px;
        margin-left: 60%;
        width: 30px;
    }
    article .content li .btn a{
        width: 100%;
        margin-bottom: 25px;
        font-size: 16px;
    }
    article .content li .btn a.check{ text-align: center;}
    article .content li .btn a:after {
        background: url(/guidance/images/common/arrow.svg) right center/20px no-repeat;
        right: 5px;
    }
    
    article .content ul.point{
        margin: 20px 0;
        justify-content: center;
    }
    article .content ul.point > li{
        width: calc(100% / 5);
        margin: 0;
    }
    article .content ul.point .icn{ height: 30px;}
    article .content ul.point .icn svg{ max-height: 100%;}
    article .content ul.point .online .icn svg{ width: 26px;}
    article .content ul.point p{ font-size: 10px;}


    section.course h2~.level{
        width: 100%;
        padding: 0.5em;
        font-size: 14px;
        box-sizing: border-box;
    }
    section.course div h3 {
        margin-top: 30px;
    }
    section.course div h3 span.inner{
        top: 50%;
        transform: translateY(-50%);
        width: 60%;
        padding: 0.5em 0;
        border-width: 1px;
        font-size: 14px;
    }
    section.course div h3.line1 span.inner{ top: -1.3em;}
    section.course div .course > li { width: 50%;}
    section.course div .course .tags,
    section.course div .course > li .text {
        font-size: 12px;
    }
    .campaign_txt {
        font-size: 11px;
        font-weight: bold;
    }  
    section.course div .course > li.double{ width: 100%;}
    section.course div .course > li.double > .inner{ width: 47%;}
/*    section.course div .course > li:nth-child(3n-2){ border-left: 1px dashed #898989;}*/
/*    section.course div .course > li:nth-child(odd),
    section.course div .course > li.sp_left_none{ border-left: none;}*/
    section.course div .course:not(.spesialist) > li:nth-child(2n-1),
    section.course div .course.spesialist > li:first-child,
    section.course div .course.spesialist > li:nth-child(2n){
        border-left: 0;
    }
    section.course div .course > li::after{
        content: "";
        display: block;
        width: 100%;
        padding: 10px;
        border-top: 1px dashed #898989;
        position: absolute;
        bottom: -45px;
        left: 0;
    }

    section.course .detail dt{ padding-left: 0;}
    section.course .detail dt span{ display: block;}

    #no_02 .btn a{ width: 95%;}

}

/* 横幅狭いスマホ（iPhone5等） */
@media screen and (max-width: 320px) {
    #learning .list li.kyoyo{
        padding: 25px 10px 10px;
    }
/*    article .content li p{ padding-top: 120px;}*/
    article .content .for50s p.photo img{ bottom: -15px;}
    article .content li.plus h4{ font-size: 18px;}

    article .content li h4{ letter-spacing: -.6px;}
    article .content .fx h4{ font-size: 22px;}
    article .content li.plus h4 span.circle{ left: 0;}
    article .content li.plus h4 span.hour{ right: 0; left: auto;}

    article .content li.plus h4 .comment::after{ margin-top: -12px;}

    section ul.detail li h2{ font-size: 14px;}
}



.table_school_list{
    width: 100%;
    font-size: 16px;
    border-collapse: separate;
    border-spacing: 1px;
}
.table_school_list th,
.table_school_list td{
    padding: 10px 1px;
    text-align: center;
    vertical-align: middle;
}
.table_school_list th:first-child {
    width: 20%;
}
.table_school_list thead td:nth-child(odd),
.table_school_list tbody td:nth-child(even){
    background: #F3F3F2;
}

.table_school_list thead th{
    background: #1c236d;
    color: #fff;
}
.table_school_list thead .division th{
    background: #5f6599;
    vertical-align: middle;
}

.table_school_list tbody td{
    width: calc(75% / 4);
}
.table_school_list .kabu > *{
    border-bottom: 1px solid #5E76A7;
    color: #5E76A7;
}
.table_school_list .fudo > *{
    border-bottom: 1px solid #44A1C5;
    color: #44A1C5;
}
.table_school_list .fx > *{
    border-bottom: 1px solid #C36380;
    color: #C36380;
}
.table_school_list .mf > *{
    border-bottom: 1px solid #8A9F55;
    color: #8A9F55;
}
.table_school_list .kyouyou > *{
    border-bottom: 1px solid #7E678D;
    color: #7E678D;
}
.table_school_list .retire > *{
    border-bottom: 1px solid #E16F4E;
    color: #E16F4E;
}

.table_school_list .text_s{ font-size: 10px;}
.table_school_list .btn_map{
    color: #1c236d;
    border: 1px solid;
    padding: 0 .5em;
    border-radius: .5em;
    background: #fff;
}

.table_school_list .schedule-link {
    border-style: solid;
    border-width: 1px;
    border-radius: 1em;
    display: inline-block;
    padding: 5px 10px;
    margin-top: 10px;
}
.table_school_list .kabu .schedule-link{
    border-color: #5E76A7;
    color: #5E76A7;
}
.table_school_list .fudo .schedule-link{
    border-color: #44A1C5;
    color: #44A1C5;
}
.table_school_list .fx .schedule-link{
    border-color: #C36380;
    color: #C36380;
}
.table_school_list .mf .schedule-link{
    border-color: #8A9F55;
    color: #8A9F55;
}
.table_school_list .kyouyou .schedule-link{
    border-color: #7E678D;
    color: #7E678D;
}
.table_school_list .retire .schedule-link{
    border-color: #E16F4E;
    color: #E16F4E;
}
@media screen and (max-width: 599px) {
    .table_school_list .schedule-link {
        padding: 5px 3px;
        border-radius: .5em;
    }
}

.modal{
    width: 100%;
    max-width: 1000px;
    border-radius: 4px;
    font-size: 16px;
    line-height: 1.7;
    box-shadow: 0 0 0;
}
.blocker{ z-index: 101;}

.modal.school_list .ttl {
    font-size: 25px;
    line-height: 1.4;
    color: #1c236d;
    text-align: left;
    border-bottom: 1px solid #1c236d;
}
.modal.school_list .item {
    margin-top: 30px;
}
.modal.school_list .item .main .sub_ttl {
    color: #1c236d;
    font-size: 20px;
    line-height: 1.4;
}

@media screen and (min-width: 600px) {
    .modal.school_list .item {
        display: flex;
    }
    .modal.school_list .item .photo {
        width: 27.5%;
    }
    .modal.school_list .item .main {
        width: 72.5%;
        padding-left: 20px;
    }
}

@media screen and (max-width: 599px) {
    .table_school_list {
        font-size: 12px;
    }
    .table_school_list tbody td{ vertical-align: middle;}
}


/*スケジュールボタン*/
.btn_waku{
  display: flex;
  justify-content: space-between; /* 左右均等分布 */
    max-width: 70%;
    margin: auto;
}
@media screen and (max-width: 1020px) {
    .btn_waku{
        max-width: 100%;
    }
}
.btn_waku ul{
    width: 100%;
  display: flex;
  align-items: center; /* 上下中央揃え */
}
.btn_waku li{
    margin: auto;
}
.btn_waku li > a{
    box-sizing: border-box;
    width: 284px;
}
.btn1 a {
    border-radius: 5px;
    background: #5E76A7;
    display: block;
    text-align: center;
    width: 284px;
    padding: 1em 2.5em;
    font-size: 16px;
    border: 2px solid;
    color: #fff;
    text-decoration: none;
    position: relative;
    box-sizing: border-box;
}
article .content li .btn1 a::before{
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
    border: 1px solid #fff;
    border-radius: 50%;
    box-sizing: border-box;
    content: '';
}
article .content li .btn1 a::after{
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(45deg);
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    content: '';
}

.btn_dl a {
    display: block;
    border-radius: 5px;
    text-align: center;
    width: 284px;
    font-size: 16px;
    color: #5E76A7;
    background-color: #fff;
    padding: 1em 2.5em;
    border: 2px solid;
    box-sizing: border-box;
    position: relative;
    text-decoration: none;
}
.btn_dl a .icn {
    display: block;
    width: 25px;
    height: 25px;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: contain;
}
.btn_dl a::before{
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 25px;
    height: 25px;
    border: 1px solid;
    border-radius: 50%;
    box-sizing: border-box;
    content: '';
}
.btn_dl a::after{
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%) rotate(45deg);
    width: 8px;
    height: 8px;
    border-top: 1px solid;
    border-right: 1px solid;
    content: '';
}
@media screen and (max-width: 856px) {
    .btn1 a {
        border-radius: 5px;
        display: block;
        text-align: center;
        width: 234px;
        padding: 1em 2.5em;
        border: 2px solid;
        font-size: 16px;
        color: #fff;
        text-decoration: none;
        position: relative;
        box-sizing: border-box;
    }
    .btn_dl a {
        display: block;
        border-radius: 5px;
        text-align: center;
        width: 234px;
        font-size: 16px;
        color: #5E76A7;
        background-color: #fff;
        padding: 1em 2.5em;
        border: 2px solid;
        box-sizing: border-box;
        position: relative;
        text-decoration: none;
    }
}

@media screen and (max-width: 725px) {
    .btn_waku ul{
      display: block;
    }
    .btn_waku li{
        margin-bottom: 15px;
    }
    .btn1 a {
        width: 100%;
    }
    .btn_dl a {
        width: 100%;
        box-sizing: border-box;
    }
}

/* .btn_fill */
.btn_fill {
  display: block;
  position: relative;
  margin: 0 auto;
  padding: 1em 28px 1em 0.5em;
  border-radius: 10px;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
}
.btn_fill::after {
  position: absolute;
  top: 50%;
  right: 17px;
  transform: translateY(-50%) rotate(45deg);
  width: 11px;
  height: 11px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  content: '';
}
.btn_fill.blue {
  background: #2085ea;
}
.btn_fill.orange {
  background: #ea5520;
}
.btn_fill:hover {
  opacity: 0.7;
  text-decoration: none;
}
@media screen and (max-width: 599px) {
    .btn_fill { font-size: 14px;}
}