@charset "UTF-8";

.course_benefit_about h3+p{text-align:center;font-size:2rem;font-weight:normal;margin-bottom:16px;}
.course_benefit_about h3+p span{background:linear-gradient(transparent 75%, #f7b280 75%);}
.course_benefit_about h4 {font-weight:bold;margin-bottom:0;}
#onlinelive_cont .ttlarea h4{color:#ea6300;}
#onlinelive_cont .comparison .difference dd a{display:inline-block;border:2px solid #c4c4c4;background:#fff;font-size:1.6rem;border-radius:9999px;font-weight:bold;padding:11px 22px;margin:10px 0;cursor:pointer;
    &:hover{opacity:.6;}
}
.performance_examination dt{font-size: 2.8rem;font-weight: 500;line-height: 1.45;margin-bottom: 17px;text-align: center;}
.performance_examination dt span{display: inline-block;background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 75%, rgba(255, 138, 52, 1) 75%, rgba(255, 138, 52, 1) 100%);background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 75%, rgba(255, 138, 52, 1) 75%, rgba(255, 138, 52, 1) 100%);background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 75%, rgba(255, 138, 52, 1) 75%, rgba(255, 138, 52, 1) 100%);}
.performance_examination dd{text-align: left;font-size: 1.6rem;letter-spacing: .05em;line-height: 1.7;}

.feature_item h4.melit{font-size:2rem;margin:40px 0 10px;display: flex;flex-flow: row wrap;align-items: baseline;gap: 20px;
    &::after{content:none;}
}
.feature_item h4.melit span {border-bottom: 3px solid #ea6300;}
p.feature_item_txt{width:auto;}
.feature_curriculum_input div.head,.feature_curriculum_output div.head{font-size: 2.8rem;text-align: center;font-weight: 900;z-index: 11;padding: 33px 0 0;color: #017592;}
.feature_curriculum_output div.head{color: #940049;}
.feature_curriculum_input div.head span,.feature_curriculum_output div.head span,.feature_strengthen div.head span {width: 96px;height: 96px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;border-radius: 50%;position: absolute;left: 30px;top: -42px;font-size: 1.6rem;color: #fff;background: #017592;letter-spacing: -.05em;}
.feature_curriculum_output div.head span {background: #940049;left: auto;right: 30px;}
.feature_curriculum_input div.text,.feature_curriculum_output div.text{font-size: 1.8rem;text-align: center;font-weight: 900;margin: 16px 0 24px;padding-bottom: 11px;
    &::after {content: "";display: block;position: absolute;bottom: 0;left: 31px;right: 33px;height: 7px;background: #017592;}
}
.feature_curriculum_output div.text::after {background: #940049;}
.feature_strengthen div.head{display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;font-size: 3.3rem;color: #ea6300;margin-bottom: 18px;padding-top: 33px;text-align: center;line-height: 1.3;font-weight: bold;}
.feature_strengthen div.head span {background: #ea6300;left: 100px;top: 25px;}
.feature_strengthen div.text {font-size: 2.5rem;font-weight: 900;text-align: center;margin-bottom: 10px;}

#careercenter h4 {font-size: 4.2rem;}
#careercenter h4 span.txt_sml {font-size: 2rem;color: #333333;display: block;}
#careercenter h4 a:hover {border-bottom: 2px solid #333333;}
#careercenter p.bold{font-weight:bold;}

.top__service__list__hdg{font-size: 1.7rem;font-weight:bold;margin-bottom: 1em !important;}   

.performance_txt .performance_ttl2{font-size: 2.4rem;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;-webkit-box-align: end;-ms-flex-align: end;align-items: flex-end;margin: 41px 0 3px;line-height: 1.2;font-weight: bold;}
.performance_txt .performance_ttl2 span {display: block;white-space: nowrap;}
.performance_txt .performance_ttl2::after {content: "";display: block;width: 100%;height: 2px;margin-bottom: 4px;background: #1a1a1a;margin-left: 10px;}
.course_other_payment .ttl{text-align: center;font-size: 2.4rem;font-weight:bold;margin-bottom: 18px;}
.voice_item_txt h3::after {content:none;}
.voice_item_subtitle::after {content: "";display: block;width: 28px;height: 1px;background: #ea6300;margin: 14px 0 0 2px;}

.school-area_theme{display:block;width:100%;border:0;padding:0;font-wieght:bold;margin-bottom:15px !important;}
.school-area_theme span{font-size:20px;}
.school-area_details{display:block;width:100%;}
.school-list_item{width:50% !important;}
.school-map{position:relative;padding:15px 45px;}
.school-map-link{position:absolute;top:0;left:0;width:100%;height:100%;font-size:20px;}
.school-map-link .pref1{right:0%;top:30%;}
.school-map-link .pref2{right:0%;top:50%;}
.school-map-link .pref3{left:50%;top:85%;display:flex;}
.school-map-link .pref4{right:45%;top:20%;}
.school-map-link .pref5{left:25%;top:20%;}
.school-map-link .pref6{left:7%;top:20%;}
.school-map-link>*{position:absolute;}
.school-map-link a{display:block;padding:10px 30px;background-color:#333;border-radius:9999px;margin:20px 0 20px 20px;color:#FFF;text-align:center;font-weight:bold;}
.school-map-link .pref1 a{background-color:#76CEC5;}
.school-map-link .pref2 a{background-color:#50C366;}
.school-map-link .pref3 a{background-color:#E28968;}
.school-map-link .pref4 a{background-color:#5CA1CC;}
.school-map-link .pref5 a{background-color:#80C6ED;}
.school-map-link .pref6 a{background-color:#E6989E;}
.maps{
    &._hokkaido-touhoku {fill:#76CEC5;}
    &._kantou {fill:#50C366;}
    &._hokuriku-koushinetsu {fill:#A7B3DD;}
    &._tokai {fill:#E28968;}
    &._kansai {fill:#5CA1CC;}
    &._chuugoku-shikoku {fill:#80C6ED;}
    &._kyuushuu-okinawa {fill:#E6989E;}
    &.is-gray {fill:#CED5D9;}
}


@media screen and (max-width: 768px) {
    .course_benefit_about h3+p{font-size:1.65rem;}
    .performance_examination dt{font-size: 1.8rem;}
    .performance_examination dt span{display:inline;}
    .performance_examination dd{font-size:1.4rem;}
    .feature_item h4.melit{gap:10px;font-size:1.8rem;}

    .feature_curriculum_input div.head,
    .feature_curriculum_output div.head {font-size: 2rem;padding: 25px 0 0;}
    .feature_curriculum_input div.head span,
    .feature_curriculum_output div.head span,
    .feature_strengthen div.head span {width: 70px;height: 70px;left: -10px;top: -35px;font-size: 1rem;}
    .feature_strengthen div.head span {left: calc(50% - 140px);}
    .feature_curriculum_output div.head span {left: auto;right: -10px;}
    .feature_curriculum_input div.text,.feature_curriculum_output div.text {font-size: 1.4rem;
        &::after{left: 20px;right: 20px;height: 4px;}
    }
    .feature_strengthen div.head{font-size: 2rem;margin-bottom: 20px;}
    .feature_strengthen div.text{font-size: 1.8rem;}

    #careercenter h4 {font-size: 2.6rem;margin-bottom: 0.5em !important;}
    #careercenter h4 span.txt_sml {font-size: 1.5rem;color: #333333;}
    
    .performance_txt .performance_ttl2 {font-size: 1.5rem;margin: 43px 0 1px;}
    .performance_txt .performance_ttl2::after {margin-left: 6px;}

    .course_other_payment .ttl{font-size:2rem;}

    .school-area_theme{padding: 0 5%;font-size:14px;}
    .school-list_item{width:100% !important;}
    .school-map-link{font-size:14px;}
    .school-map-link .pref1{right:5%;top:25%;}
    .school-map-link .pref2{right:5%;top:50%;}
    .school-map-link .pref3{left:48%;top:85%;display:flex;}
    .school-map-link .pref4{right:42%;top:15%;}
    .school-map-link .pref5{left:29%;top:15%;}
    .school-map-link .pref6{left:10%;top:15%;}
    .school-map-link a{padding:5px 10px;margin:10px 0 10px 10px;}
}

@media screen and (max-width: 500px) {
    .school-area_theme span{display:block;}
    .school-map-link{font-size:12px;}
    .school-map-link .pref1{right:0%;top:-10%;display:flex;}
    .school-map-link .pref2{right:0%;top:30%;}
    .school-map-link .pref3{left:38%;top:82%;display:flex;}
    .school-map-link .pref4{right:40%;top:10%;}
    .school-map-link .pref5{left:20%;top:10%;}
    .school-map-link .pref6{left:-13px;top:10%;}
    .school-map-link a{padding:2px 10px;margin:5px 0 5px 5px;}
}