@charset "utf-8";
/* CSS Document */

/* 数字のフォント */
.cal-sans-regular{
  font-family: "Cal Sans", sans-serif;
  font-weight: 100;
  font-style: normal;
	letter-spacing: 0.1em;
}


/* sm list_trainingsystem */
#list_trainingsystem .bg_lightgrey{
margin-top: -50px;/*マイナスマージンで調整*/
padding: 50px 0;
border-radius: 0 0 0 50px;
}

#list_trainingsystem li{
position: relative;
padding: 20px 0;
border-radius: 20px 20px 0 0;
}

#list_trainingsystem li:before{
content: "";
display: inline-block;
position: absolute;
bottom: 0;
right: 10px;
width: 100px;
height: 29px;
background: url("../img/line_lightgrey.svg")center center/cover no-repeat;
}

#list_trainingsystem li:not(:last-child){
position: relative;
margin-bottom: 90px;
}

#list_trainingsystem li:not(:last-child):after{
content: "";
display: inline-block;
position: absolute;
bottom: -65px;
left: 50%;
transform: translateX(-50%);
width: 59px;
height: 50px;
background: url("../img/icon_note.svg")center center/cover no-repeat;
}

#list_trainingsystem .inner{
width: 90%;
margin: 0 auto;
}

#list_trainingsystem h3{
margin-bottom: 15px;
font-size: 2.0rem;
}

#list_trainingsystem h3 span{
background:linear-gradient(transparent 80%, rgba(255,240,30,1.0) 80%);
padding-bottom: 10px;
}

#list_trainingsystem .trainingsystem_photo{
margin-bottom: 15px;
text-align: center;
}

#list_trainingsystem .trainingsystem_photo img{
border-radius: 20px 20px 0 0;
}

#list_trainingsystem h4{
margin-bottom: 10px;
font-size: 1.8rem;
line-height: 1.4;
}

#list_trainingsystem li p{
overflow-wrap: break-word; 
}


/* md list_trainingsystem */
@media screen and (min-width:768px) {
#list_trainingsystem .trainingsystem_photo img{
width: 60%;
}
}


/* lg list_trainingsystem */
@media screen and (min-width:1024px) {
#list_trainingsystem .bg_lightgrey{
margin-top: -100px;/*マイナスマージンで調整*/
padding: 100px 0;
border-radius: 0 0 0 200px;
}

#list_trainingsystem li{
padding: 40px 0;
}

#list_trainingsystem li:before{
right: 20px;
width: 150px;
height: 43px;
}

#list_trainingsystem li:not(:last-child){
margin-bottom: 120px;
}

#list_trainingsystem li:not(:last-child):after{
bottom: -80px;
}

#list_trainingsystem h3{
margin-bottom: 30px;
font-size: 3.0rem;
text-align: center;
}

#list_trainingsystem .trainingsystem_photo{
margin-bottom: 0;/*smmdでのデザインを解除*/
text-align: center;
}

#list_trainingsystem h4{
font-size: 2.0rem;
}

#list_trainingsystem .photo-left{
display: flex;
justify-content: space-between;
align-items: flex-start;
}

#list_trainingsystem .trainingsystem_photo{
width: 40%;
}

#list_trainingsystem .trainingsystem_photo img{
width: 100%;/*smmdでのデザインを解除*/
}

#list_trainingsystem .trainingsystem_text{
width: 57%;
text-align: left;
}

#list_trainingsystem .trainingsystem_textonly{
width: 100%;
text-align: left;
}
}


/* sm list_trainingflow */
#list_trainingflow{
padding: 50px 0;
text-align: center;
}

#list_trainingflow ul{
margin-top: 30px;
text-align: left;
}

#list_trainingflow .inner{
width: 90%;
margin: 0 auto;
}

#list_trainingflow ul li:not(:last-child){
margin-bottom: 40px;
}

#list_trainingflow h4{
margin: 5px auto 15px;
font-size: 1.8rem;
text-align: left;
line-height: 1.4;
}

#list_trainingflow h5{
display: inline-block;
position: relative;
font-size: 1.8rem;
padding: 10px 10px 6px 10px;
border-radius: 0 10px 0 0;
background-color: rgba(0,63,146,1.0);
line-height: 1.4;
box-sizing: border-box;
}

#list_trainingflow h5:before{
content: "";
display: inline-block;
position: absolute;
top: -25px;
left: 5px;
width: 19px;
height: 25px;
background: url("../img/icon_flag.svg")center center/cover no-repeat;
}

#list_trainingflow .bg_white{
padding: 20px 0;
border-radius: 0 0 20px 0;
}

#list_trainingflow .trainingflow_photo{
margin-bottom: 10px;
text-align: center;
}

#list_trainingflow .trainingflow_photo img{
border-radius: 20px 0 0 0;
}

#list_trainingflow h6{
margin-bottom: 5px;
font-size: 1.8rem;
line-height: 1.4;
}

#list_trainingflow .trainingflow_text{
overflow-wrap: break-word; 
}


/* md list_trainingflow */
@media screen and (min-width:768px) {
#list_trainingflow .trainingflow_photo img{
width: 60%;
}
}


/* lg detail_interview */
@media screen and (min-width:1024px) {
#list_trainingflow{
padding: 100px 0;
}

#list_trainingflow h4{
margin: 20px auto 50px;
text-align: center;
font-size: 2.4rem;
}

#list_trainingflow ul li:not(:last-child){
margin-bottom: 85px;
}

#list_trainingflow h5{
font-size: 2.4rem;
padding: 13px 15px 11px 15px;
border-radius: 0 20px 0 0;
}

#list_trainingflow h5:before{
top: -50px;
width: 38px;
height: 50px;
}

#list_trainingflow .bg_white{
padding: 40px 0;
border-radius: 0 0 40px 0;
}

#list_trainingflow .inner{
display: flex;
justify-content: space-between;
align-items: flex-start;
}

#list_trainingflow .trainingflow_photo{
width: 35%;
margin-bottom: 0;/*smmdでのデザインを解除*/
}

#list_trainingflow .trainingflow_photo img{
width: 100%;/*smmdでのデザインを解除*/
}

#list_trainingflow .trainingflow_title-text{
width: 62%;
}

#list_trainingflow h6{
margin-bottom: 10px;
font-size: 2.0rem;
}

#list_trainingflow .trainingflow_title-title-textonly{
width: 100%;
}
}