@charset "UTF-8";


/*PC*/
@media print, screen and (min-width: 768px) {
#career{
position: relative;
padding-top: 160px;
box-sizing: border-box;
margin: 0 auto 160px;
}

#career .section_wrap{
position: relative;
width: 1280px;
margin: 0 auto;
}

#career .section_wrap .block{
position: relative;
margin: 0 0 160px;
}

#career .section_wrap .block:last-child{
margin-bottom: 0;
}

#career .section_wrap .block_flex{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin: 0 0 60px;
border-bottom: 1px solid #0061ab;
padding-bottom: 20px;
box-sizing: border-box;
}

#career .section_wrap .block_flex .ttl_box{
position: relative;
width: 35%;
}

#career .section_wrap .block_flex .txt_box{
position: relative;
width: 55%;
}


.flow_design08 {
display: flex;
justify-content: center;
align-items: center;
}

.flow08 {
position: relative;
width: 100%;
}

.flow08 > li {
list-style-type: none;
border-radius: 15px;
background: linear-gradient(270deg, rgba(155, 242, 255, 0.1) 0%, rgba(74, 184, 235, 0.1) 100%);
background-blend-mode: multiply;
position: relative;
padding: 25px;
}

.flow08 > li:not(:last-child) {
margin-bottom: 20px;
}

.flow08 > li dl {
display: flex;
align-items: center;
gap: 20px;
}

.flow08 > li dl dt {
font-size: 1.2rem;
font-weight: 700;
width: 30%;
min-width: 7em;
color: #0061ab;
}

.flow08 > li .icon08 {
font-size: 1rem;
color: #0061ab;
display: block;
}

.flow08 > li dl dd {
margin: 0;
width: calc(70% - 20px);
}

#career .ph_list{
width: 90%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 60px auto 0;
}

#career .ph_list li{
width: 30%;
}

#career .ph_list li img{
border-radius: .6rem;
}

#career .block_inner{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex-direction: row-reverse;
align-items: center;

}

#career .block_inner .img{
width: 45%;
}

#career .block_inner .step_list{
width:50%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#career .block_inner .step_list li{
width: 49%;
padding: 15px;
box-sizing: border-box;
border: 2px solid #0061ab;
margin-bottom: 2%;
counter-increment: step;
position: relative;
overflow: hidden;
border-radius: 1rem;
}

#career .block_inner .step_list li::before{
content: counter(step);
position: absolute;
right: 0;
bottom: -20px;
font-weight: 700;
font-size: 8rem;
line-height:1;
color: #0061ab;
opacity: .15;
}

#career .block_inner .step_list li h3{
background: #0061ab;
padding: 10px;
box-sizing: border-box;
border-radius: .6rem;
color:#FFF;
font-size: 1.2rem;
font-style: italic;
line-height: 1;
text-align: center;
margin-bottom: 15px;
}

#career .block_inner .step_list li h3 span{
display: block;
font-size: .9rem;
margin-bottom: 5px;
}

#career .block_inner .step_list li p{
font-size: .9rem;
font-weight: 600;
}

#career .section_wrap .block_list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#career .section_wrap .block_list li{
position: relative;
width:48%;
background: linear-gradient(270deg, rgba(155, 242, 255, 0.1) 0%, rgba(74, 184, 235, 0.1) 100%);
padding: 35px;
box-sizing: border-box;
border-radius: 2rem;
}

#career .section_wrap .block_list li h3{
font-size: 1.6rem;
font-weight: 800;
line-height: 1.4;
color: #0061ab;
text-align: center;
margin: 0 0 30px;
}

#career .section_wrap .block_list li h3 span{
display: block;
font-size: .8rem;
font-weight: 500;
margin-bottom: 10px;
}

#career .section_wrap .block_list li h3 .sub{
display: block;
font-size: 1.2rem !important;
margin-top: 10px;
}

#career .section_wrap .block_list li .img{
width: 80%;
margin: 0 auto 30px;
}

#career .section_wrap .block_list li .img img{
border-radius: 1.2rem;
}

#career .section_wrap .block_list li p img{
width: 12px;
display: inline-block;
margin-left: 5px;
border-radius: 0;
}


}
/*sp*/
@media only screen and (max-width: 767px) {
#career{
position: relative;
padding-top: 30px;
box-sizing: border-box;
margin: 0 auto 60px;
}

#career .section_wrap{
position: relative;
width: 90%;
margin: 0 auto;
}

#career .section_wrap .block{
position: relative;
margin: 0 0 60px;
}

#career .section_wrap .block:last-child{
margin-bottom: 0;
}

#career .section_wrap .block_flex{
margin: 0 0 30px;
border-bottom: 1px solid #0061ab;
padding-bottom: 20px;
box-sizing: border-box;
}

#career .section_wrap .block_flex .ttl_box{
position: relative;
width: 100%;
}

#career .section_wrap .block_flex .txt_box{
position: relative;
width: 100%;
}

.flow_design08 {
display: flex;
justify-content: center;
align-items: center;
}

.flow08 {
position: relative;
width: 100%;
}

.flow08 > li {
list-style-type: none;
border-radius: 15px;
background: linear-gradient(270deg, rgba(155, 242, 255, 0.1) 0%, rgba(74, 184, 235, 0.1) 100%);
background-blend-mode: multiply;
position: relative;
padding: 15px;
}

.flow08 > li:not(:last-child) {
margin-bottom: 20px;
}

.flow08 > li dl {
}

.flow08 > li dl dt {
font-size: 1rem;
font-weight: 700;
width: 100%;
color: #0061ab;
}

.flow08 > li .icon08 {
font-size: 1rem;
color: #0061ab;
display: block;
}

.flow08 > li dl dd {
margin: 0;
width: 100%;
}

#career .ph_list{
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 30px auto 0;
}

#career .ph_list li{
width: 32%;
}

#career .ph_list li img{
border-radius: .6rem;
}

#career .block_inner{
}

#career .block_inner .img{
width: 100%;
margin: 0 auto 20px;
}

#career .block_inner .step_list{
width:100%;
}

#career .block_inner .step_list li{
width: 100%;
padding: 15px;
box-sizing: border-box;
border: 2px solid #0061ab;
margin-bottom:20px;
counter-increment: step;
position: relative;
overflow: hidden;
border-radius: 1rem;
}

#career .block_inner .step_list li::before{
content: counter(step);
position: absolute;
right: 0;
bottom: -20px;
font-weight: 700;
font-size: 8rem;
line-height:1;
color: #0061ab;
opacity: .15;
}

#career .block_inner .step_list li h3{
background: #0061ab;
padding: 10px;
box-sizing: border-box;
border-radius: .6rem;
color:#FFF;
font-size: 1rem;
font-style: italic;
line-height: 1;
text-align: center;
margin-bottom: 15px;
}

#career .block_inner .step_list li h3 span{
display: block;
font-size: .8rem;
margin-bottom: 5px;
}

#career .block_inner .step_list li p{
font-size: .9rem;
font-weight: 600;
}

#career .section_wrap .block_list{

}

#career .section_wrap .block_list li{
position: relative;
width:100%;
background: linear-gradient(270deg, rgba(155, 242, 255, 0.1) 0%, rgba(74, 184, 235, 0.1) 100%);
padding: 15px;
box-sizing: border-box;
border-radius: 2rem;
margin-bottom: 20px;
}

#career .section_wrap .block_list li:last-child{
margin-bottom: 0;
}

#career .section_wrap .block_list li h3{
font-size: 1.2rem;
font-weight: 800;
line-height: 1.4;
color: #0061ab;
text-align: center;
margin: 0 0 30px;
}

#career .section_wrap .block_list li h3 span{
display: block;
font-size: .8rem;
font-weight: 500;
margin-bottom: 10px;
}

#career .section_wrap .block_list li h3 .sub{
display: block;
font-size: 1rem !important;
margin-top: 10px;
}

#career .section_wrap .block_list li .img{
width: 80%;
margin: 0 auto 30px;
}

#career .section_wrap .block_list li .img img{
border-radius: 1rem;
}

#career .section_wrap .block_list li p img{
width: 12px;
display: inline-block;
margin-left: 5px;
border-radius: 0;
}

}