@charset "utf-8";


/*　
	────────────────────────────────────────────────────── 
    就職実績部分
	────────────────────────────────────────────────────── 
*/

.content-box.renew h3{
background-color: #1a95ca;
text-align: center;
}

.flx_box{
display: flex;
}


#intro1 .content-box p{
font-size: 100%;
line-height: 170%;
margin-bottom: 30px;
padding: 0 30px;
}

#intro1 .content-box p strong{
font-size: 220%;
line-height: 130%;
font-family: "Noto Sans Japanese","ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
font-weight: 700;
letter-spacing: 0;
display: inline-block;
margin-bottom: 10px;
}

#intro1 .imgbox {
margin-bottom: 50px;
text-align: center;
}

#intro1 .imgbox:first-child {
padding-top: 0px;
margin-bottom: 0px;
}

#intro1 .coptag{
text-align: right;
font-size: 115% !important;
line-height: 170% !important;
margin-bottom: 30px !important;
margin-top: 0px;
font-weight: bold;
}

#recruitgroup h3 + p{
text-align: right;
max-width: 700px;
}



#recruitgroup .sbl_mk {
position: relative;
padding-left: 1.2em;
margin-left: 1.2em !important;
}
#recruitgroup .sbl_mk:before {
position: absolute;
content: "";
background-image: url("../images-renewal/programs/recruit_ mark.svg");
background-repeat: no-repeat;
width: 1.2em;
height: 100%;
display: inline-block;
background-size: 100% auto;
background-position: top;
left: 0;
top: 0.2em;
}


#recruitgroup h4 {
position: relative;
padding: 20px 0 10px;
font-family: "Noto Sans Japanese","ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
color: #353535;
font-size: 26px;
text-align: left;
font-weight: 900;
}

#recruitgroup h4:nth-of-type(1){color: #25adc1;}
#recruitgroup h4:nth-of-type(2){color: #efb257;}
#recruitgroup h4:nth-of-type(3){color: #8aba28;}
#recruitgroup h4:nth-of-type(4){color: #c7649b;}
#recruitgroup h4:nth-of-type(5){color: #468bc3;}

#recruitgroup h4 span {
background-color: #fff;
display: inline-block;
z-index: 1;
position: relative;
padding-right: 10px;
line-height: 1em;
}

#recruitgroup h4:before {
position: absolute;
top: calc((100% - 6px) / 2);
width: 100%;
height: 6px;
left: 0;
background-color: #353535;
content: '';
}

#recruitgroup h4:nth-of-type(1):before{background-color: #25adc1;}
#recruitgroup h4:nth-of-type(2):before{background-color: #efb257;}
#recruitgroup h4:nth-of-type(3):before{background-color: #8aba28;}
#recruitgroup h4:nth-of-type(4):before{background-color: #c7649b;}
#recruitgroup h4:nth-of-type(5):before{background-color: #468bc3;}



.stepup{
margin-top: 20px;
margin-bottom: 50px;
padding: 0;
}

.stepup .league {
display: flex;
align-items: center;
color: #9a1f23;
font-weight: bold;
font-size: 100%;
letter-spacing: 2px;
padding: 10px 0;
line-height: 150%;
}
.stepup .league:after {
content: "";
height: 1px;
flex-grow: 1;
background-color: #231815;
}
.stepup .league:after {
margin-left: 0.5rem;
}

.stepup li:nth-child(even) {
margin-left: 0.5em;
margin-bottom: 30px;
font-size: 90%;
line-height: 150%;
letter-spacing: 0;
}

.stepup li .andetc{
display: block;
text-align: right;
}

.stepup span{display: inline-block;}

.area{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
overflow: hidden;
zoom: 1;
padding: 0;
}

.area li{
background-color: #f7f5e6;
overflow: hidden;
padding: 0px;
width: calc((100% - 30px) / 3);
margin-left: 15px;
margin-bottom: 15px;
position: relative;
}

.area li:nth-child(3n+1){
margin-left: 0;
}

.area li .step-box img{
width: calc(40% - 10px);
float: left;
margin-right: 10px;
}
.area li .step-box .step-inbox{
width: 50%;
float: left;
}
.area li .step-ttl {
background-color: #555;
margin-bottom: 5px;
text-align: left;
color: #fff;
font-weight: 700;
font-size: 90%;
padding: 5px 10px;
font-feature-settings: "palt";
background-image: url("../images-renewal/programs/recruit_ mark.svg");
background-repeat: no-repeat;
background-size: 1.4em;
background-position: 98% center;
}

.area li .step-ttl.nmk{background-image: none;}


.area li .step-box{
display: block;
overflow: hidden;
zoom:1;
}

.area li .step-box p {
margin: 0;
line-height: 1.2em;
font-size: 80%;
letter-spacing: -0.5px;
font-weight: normal;
}

.area li .step-box .step-name{
margin-top: 20%;
font-size: 130%;
padding-bottom: 5px;
margin-bottom: 10px;
border-bottom: solid 1px #000;
font-weight: bold;
}

.area li .coptag{
position: absolute;
bottom: -1.3em;
font-size: 85%;
font-weight: bold;
letter-spacing: 0;
}

#recruitgroup .area:nth-of-type(1) li .step-ttl{background-color: #25adc1;}
#recruitgroup .area:nth-of-type(2) li .step-ttl{background-color: #efb257;}
#recruitgroup .area:nth-of-type(3) li .step-ttl{background-color: #8aba28;}
#recruitgroup .area:nth-of-type(4) li .step-ttl{background-color: #c7649b;}
#recruitgroup .area:nth-of-type(5) li .step-ttl{background-color: #468bc3;}

.programs .in-content{
margin-bottom: 80px;
display: block;
overflow: hidden;
}
.interviews{
display: block;
overflow: hidden;
margin-bottom: 60px;
}
.interviews h4{
font-size: 165%;
margin-bottom: 20px;
line-height: 1.5em;
background-color: #c2e9f7;
text-align: center;
font-weight: bold;
}
.in-cont-left{
float: left;
margin-right: 15px;
    width: 35%;
}
.in-cont-left ul{
padding: 0;
margin: 0;
margin-top: 10px;
}
.in-cont-left li{
margin: 0;
line-height: 1.4em;
text-align: center;
}
.in-cont-left li:nth-child(2){
font-weight: bold;
font-size: 150%;
}
.in-cont-right{
    width: 65%;
/*
float: left;
max-width: calc(900px - 300px - 15px);
*/
}
.in-cont-right p{
margin: 0 0 15px 0;
}
.in-cont-btm {
/* padding-top: 15px; */
display: table;
overflow: hidden;
clear: both;
margin: 0 auto;
}
.in-cont-btm img{
float: left;
margin-bottom: 10px;
}

.stepupttl{
    font-size: 110% !important;
    font-weight: bold;
    margin-top: 50px;
    background-color: #ffd7d9;
    padding: 10px 20px;
    letter-spacing: 0;
    line-height: 1.3em;
}

.stepupttl span{
font-size: 80%;
    font-weight: normal;
    display: inline-block;
}



.results-ftbtn {
    display: flex;
    margin-top: 5em;
    justify-content: center;
}
.results-ftbtn a{margin: 0 5px;}
.results-ftbtn a img {
    max-width: 440px !important;
width: 100%;
}









/*　　max-width: 790px
	────────────────────────────────────────────────────── */
@media screen and (max-width: 790px){

.in-cont-btm {text-align: center;}
.in-cont-btm img {float: none;}
.in-cont-btm img:nth-of-type(2){margin-right: 10px;}
}



/*　　max-width: 767px
	────────────────────────────────────────────────────── */
@media screen and (max-width: 767px){

.results-ftbtn {
display: block;
margin-top: 5em;
padding: 0 30px;
}
.results-ftbtn a{
display: table;
margin: 0 auto 15px;
}
.results-ftbtn a img {
max-width: 540px !important;
width: 100%;
}

}






/*　　max-width: 640px
	────────────────────────────────────────────────────── */
@media screen and (max-width: 640px){


.flx_box{display: block;}
.in-cont-right,.in-cont-left{ width: 100%; }
	.in-cont-left img {max-width: 300px !important;}
	.in-cont-left ul{font-size: 2.6rem;}



.programs {
margin-top: 0 !important;
}
#intro1 .imgbox:first-child {
padding-top: 0px;
}

#intro1 .content-box p strong{font-size: 8vw;}
#intro1 .content-box p strong br{display: none;}
#intro1 .coptag{
text-align: right;
font-size: 3vw !important;
line-height: 140% !important;
margin-bottom: 30px !important;
letter-spacing: 0;
}
#intro1 .content-box p {
    font-size: 140%;
    line-height: 160%;
    letter-spacing: 0;
    padding: 0;
}



.stepup li:nth-child(even) {font-size: 4vw;}

.step-box img {
margin-left: auto !important;
margin-right: auto !important;
max-width: 160px !important;
display: table;
}

.area li .step-ttl {
    font-size: 3vw;
    line-height: 1.6em;
    margin-right: 0;
    text-align: left;
    padding: 3px 5px;
    letter-spacing: -0.5px;
}
.area li .step-box p {font-size: 4vw;}
.area li .step-box .step-name {font-size: 8vw;}
.area li .step-box .step-name + p {
font-size: 3vw;
display: table;
margin: 0 auto;
}

.area li {
padding: 0 0 5px 0;
width: calc((100% - 10px) /2);
margin-left: 0px;
margin-right: 0;
}

.area li:nth-of-type(even) {margin-left: 10px;}

.area li .step-box img {
float: none;
width: 100%;
margin-right: 0;
max-width: 140px !important;
}
.area li .step-box .step-inbox{
float: none;
width: auto;
}

.area li .coptag {
bottom: auto;
top: 69vw;
font-size: 2.3vw;
}

.area li .step-box .step-name {
    margin-top: 2%;
    font-size: 4.3vw;
    text-align: center;
}

.in-cont-left {
float: none;
margin-right: 0;
text-align: center;
}

.in-cont-left img{
margin: 0 40px;
width: calc(100% - 80px);
max-width: 300px;
}

.interviews h4{
font-size: 7vw;
letter-spacing: -1px;
text-align: left;
padding: 0 5px;
margin-top: 0;
}
.in-cont-right{
float: none;
margin-right: 0;
max-width: 100%;
margin-top: 20px;
}
.in-cont-btm {
text-align: center;
}

.in-cont-btm img {float: none;}



.programs .in-content {margin-bottom: 0px;}

.stepupttl{font-size: 5vw !important;}

.stepup .league { font-size: 190%;}

}




/*　　max-width: 480px
	────────────────────────────────────────────────────── */
@media screen and (max-width: 580px){
.area li .step-ttl {
    font-size: 17px;
    line-height: 1.4em;
    margin-right: 0;
    text-align: left;
    padding: 3px 30px 3px 5px;
    background-position: 98% 90%;
    height: 3.2em;
}

}





/*　　max-width: 420px
	────────────────────────────────────────────────────── */
@media screen and (max-width: 420px){
.stepup li:nth-child(even) {font-size: 16px;}
}




/*　
	────────────────────────────────────────────────────── 
    5段階プラグラム ALL　END
	────────────────────────────────────────────────────── 
*/