@charset "UTF-8";

/*------------------------------------------------------------
  common
------------------------------------------------------------*/
.underpage .wpContent .udCmHd{
    text-align: center;
    font-size: 2.8rem;
    font-weight: 600;
    margin-bottom: 5rem;
}
.underpage .wpContent h1.smalH1{
    font-size: 1.6rem;
    margin-top: 2rem;
    padding: 0 1rem;
}
.underpage .wpContent p.deco{
    color: #fec24d;
    display: block;
    margin: 0;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 800;
}
.underpage .wpContent p.bigDeco{
    font-size: 10.5vw;
    color: #0070c5;
    margin: 0;
    line-height: 120%;
    font-weight: 700;
    text-align: center;
}
.underpage .wpContent .udCmH2{
    text-align: center;
    position: relative;
    margin-top:14vw;
    border:none;
}
.underpage .wpContent .udCmH2 span{
    position: absolute;
    z-index: 1;
    font-size: 8vw;
    color: #0070c5;
    line-height: 130%;
    font-weight: 700;
    top: -10vw;
    left: 0;
    right: 0;
    margin: 0;
}
.wpContent .cmFtWrap{
    margin: 6vw 0 18vw 0;
    position:relative;
}
.wpContent .cmFtWrap .leftWrap{
    flex: 1;
    position: relative;
    z-index:1;
    padding: 0 6% 0 6%;
}
.wpContent .cmFtWrap .title{
    position: absolute;
    z-index: 1;
    font-size: 10.5vw;
    color: #0070c5;
    margin: 0;
    line-height: 130%;
    font-weight: 700;
    top: -4vw;
}
.wpContent .cmFtWrap h2{
    font-size: 2.5vw;
    font-weight: 700;
    line-height: 160%;
    margin: 0 0 2rem 0;
    color: #000;
    border:none;
}
.wpContent .cmFtWrap .imgWrap{
    flex: 1;
    position: relative;
    z-index:0;
}
.wpContent a.cmBox{
    background: #014599;
    text-decoration: none;
    color: #FFF;
    text-align: center;
    max-width: 40%;
    padding: 1rem;
    font-size: 1.5rem;
    font-weight: 700;
    border-radius: 4px;
    margin: 6rem auto;
    display: block;
}
.wpContent a.cmBox:hover{
    background:#0070c5!important;
}
.wpContent .error p{
    text-align:center;
    margin-top:4rem 1rem;
}
.wpContent .bottomWrap{
    padding:1rem 1rem 3rem 1rem;
}
.wpContent .bottomWrap h2{
    text-align: center;
    color: #FFF;
    font-size: 3rem;
    margin-bottom: 6rem;
}
.wpContent .bottomWrap p{
    text-align:center;
    color:#FFF;
}

/*------------------------------------------------------------
  reason
------------------------------------------------------------*/
#reason .wpContent  h2{
    border:none;
}

#reason .wpContent .ftWrap{
    margin: 6vw 0 18vw 0;
    position:relative;
}
#reason .wpContent .ftWrap .leftWrap{
    flex: 1;
    position: relative;
    z-index:1;
    padding: 0 14% 0 6%;
}
#reason .wpContent .ftWrap .title{
    position:absolute;
    z-index:1;
    font-size: 10.5rem;
    color: #0070c5;
    margin: 0;
    line-height: 130%;
    font-weight: 700;
    top: -5rem;
}
#reason .wpContent .ftWrap h2{
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 160%;
    margin: 0 0 2rem 0;
    color: #000;
}
#reason .wpContent .ftWrap .imgWrap{
    flex: 1.3;
    position: relative;
    z-index:0;
}
#reason .wpContent .ftWrap .num{
    position:relative;
    z-index:1;
    margin:3rem 0 0 0;
    font-size: 1.2rem;
    font-weight: 500;
}
#reason .wpContent .ftWrap .subTitle{
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 170%;
}
#reason .wpContent .st:before{
    content: "";
    background: linear-gradient(to right, #507fb9,#014599);
    width: 70%;
    height: 120%;
    position: absolute;
    top: -10%;
    border-radius: 0 40px 40px 0;
}
#reason .wpContent .st h2{
    margin-top: 0;
    color: #fec14c;
    font-size: 2.5rem;
    padding-left: 0;
}
#reason .wpContent .st p{
    color:#FFF;
}
#reason .wpContent .rev{
    flex-direction: row-reverse;
}
#reason .wpContent .rev::before{
    border-radius: 40px 0 0 40px;
}
#reason .wpContent .bottomWrap{
    background:url(../img/content/strong/bottomImg.jpg) no-repeat;
    background-size:cover;
}

/*------------------------------------------------------------
  company
------------------------------------------------------------*/

#company .wpContent .bottomWrap h2{
    margin-bottom: 0;
}
/* intro */
#company .wpContent .intro .title{
    font-size: 10.5rem;
    color: #0070c5;
    margin: 0;
    line-height: 130%;
    font-weight: 700;
    text-align: right;
}
#company .wpContent  .intro h2{
    font-size: 3rem;
    font-weight: 700;
    line-height: 160%;
    margin: 6rem 0 2rem 0;
    color: #000;
    text-align: center;
    border:none;
}
#company .wpContent .ftWrap{
    margin: 5vw 0;
    position:relative;
}
#company .wpContent .ftWrap .leftWrap{
    flex: 1;
    position: relative;
    z-index:1;
    padding: 0 4rem;
}
#company .wpContent .ftWrap .imgWrap{
    flex: 1;
    position: relative;
    z-index:0;
}
#company .wpContent .ftWrap .syomei{
    max-width: 270px;
    margin: 0 0 0 auto;
}
#company .bottomWrap{
    background:url(../img/content/company/cmpBg.jpg) no-repeat;
    background-size:cover;
    padding:4vw 1rem;
}
/* rinen */
#company .rinen{
    background: #FFF;
    border-radius: 30px;
    padding: 3rem;
}
#company .rinen h2{
    margin: 0;
    color: #FEC24D;
    text-align: center;
    border:none;
}
#company .rinen h3{
    margin: 0;
    text-align: center;
    color: #000;
    font-size: 2.5rem;
    background: none;
}
#company .rinen ul{
    margin: 2rem auto;
    width: 90%;
}
#company .rinen ul li{
    list-style: none;
    color: #014599;
    font-size: 1.3rem;
    font-weight: 700;
}
#company .rinen ul li img{
    display: inline;
    width: 50px;
    height: 50px;
    vertical-align: middle;
    margin-right: 20px;
}
#company .rinen p{
    width: 90%;
    margin: 0 auto;
    font-size: 0.9rem;
    color:#000;
}

/* mission */
#company .mission{

}
#company .mission h2{
    font-size: 7rem;
    color: #FFF;
    text-align: center;
    border:none;
}
#company .mission h2 .title{
    color: #FEC24D;
    font-size: 3rem;
    margin-left: 2rem;
}
#company .mission .missionFlex{
    margin: 1rem 0;
    gap: 2rem;
}
#company .mission .missionFlex li{
    list-style: none;
    background: #FFF;
    content:#333;
    border-radius: 30px;
    padding: 2rem;
    font-weight: 500;
    flex: 1;
}
#company .mission .missionFlex li p.pt{
    color: #000;
    font-weight: 800;
    font-size: 160%;
    line-height: 140%;
}
#company .mission .missionFlex li p.comment{
    color: #000;
    text-align: left;
    width: 830px;
    margin: 0 auto; 
}

/* value */
#company .value{

}
#company .value h2{
    font-size: 7rem;
    color: #FFF;
    border:none;
}
#company .value h2 .title{
    color: #FEC24D;
    font-size: 3rem;
    margin-left: 2rem;
}
#company .value .valueWrap{

}
#company .value .valueWrap li{
    list-style: none;
    position: relative;
    color: #FFF;
    font-weight: 700;
    font-size: 1.2rem;
    padding: 1rem 0;
}
#company .value .valueWrap li:before{
    content:"●";
    color: #FEC24D;
    position:absolute;
    left:0;
    left: -30px;
}

/* gaiyo */
#company .gaiyo{
    color: #014599;
}
#company h2.cmHd{
    color: #014599;
    text-align:center;
    font-size: 3rem;
    margin-bottom: 3rem;
    border: none;
}

/* kanren */
#company .kanren{

}
#company .kanren h3{
    color: #000;
    text-align: center;
    font-size: 2.2rem;
    background: none;
}
#company .kanren ul{
    margin: 1rem auto;
    gap: 3rem;
    max-width: 60%;
}
#company .kanren ul li{
    list-style: none;
    text-align: center;
    font-size: 1.2rem;
    flex:1;
}
#company .kanren .icon{
    max-width: 180px;
    margin: 2rem auto 0 auto;
}
#company .kanren p{
    text-align: center;
    font-size: 3rem;
    font-weight: 800;
    margin: 0;
}
#company .kanren p .blue{
    color: #4168B1;
    font-size: 130%;
}

/*------------------------------------------------------------
  wellbeing
------------------------------------------------------------*/

#wellbeing .wpContent .cmFtWrap{
    margin: 6vw 0 8vw 0;
}
#wellbeing .wpContent .syomei {
    max-width: 270px;
    margin: 0 0 0 auto;
}
#wellbeing .wpContent .cmFtWrap .title{
    font-size: 8.5vw;
}
#wellbeing .wpContent h2{
    border:none;
}
#wellbeing .wpContent h3{
    background: none;
    color: #014599;
    padding: 5px 0;
    border-bottom: 1px solid;
    border-radius: 0;
}
#wellbeing .wpContent ul{
    margin:0;
}
#wellbeing .wpContent li{
    list-style:none;
}
#wellbeing .wpContent h2.cm{
    text-align: center;
    color: #014599;
    font-size: 3rem;
    margin-bottom: 3rem;
}
#wellbeing .blueBack{
    background:url(../img/content/wellbeing/wb2.png) no-repeat;
    background-size:cover;
    background-position: center;
    padding:4rem 0;
    margin: 5rem 0;
}
#wellbeing .wpContent .blueBack h2{
    color: #FFF;
    margin-top: 1rem;
}
#wellbeing .blueBack ul{
    gap: 10%;
}
#wellbeing .blueBack li{
    flex:1;
}
#wellbeing .blueBack li p{
    color:#FFF;
}
#wellbeing .wpContent table th{
    vertical-align: baseline;
}
#wellbeing .improvement{

}
#wellbeing .improvement ul{
    gap: 10%;
    margin: 6rem 0 0 0;
}
#wellbeing .improvement li{
    flex:1; 
}
#wellbeing .improvement li img{
    max-width: 240px;
    margin: 0 auto;
}
#wellbeing .improvement dl{
    background: #F0F0F0;
    padding: 2rem;
    margin: 2rem 0;
    border-radius: 10px;
}
#wellbeing .improvement dt{
    font-weight: 700;
}
#wellbeing .improvement dd{
    padding-bottom: 1rem;
}
#wellbeing .about .boxFlex{
    gap: 6%;
}
#wellbeing .about .leftWrap{
    flex: 3;
}
#wellbeing .about .rightWrap{
    flex: 1;
    padding-top: 2rem;
}
#wellbeing .about ul.member{
    gap: 5%;
    flex-wrap: wrap;
}
#wellbeing .about ul.member li{
    width: 47%;
}
#wellbeing .about ul.member li .flex{
    gap: 3%;
}
#wellbeing .about ul.member li .imgWrap{
    flex: 1;
}
#wellbeing .about ul.member li .txtWrap{
    flex: 2;
}
#wellbeing .about ul.member li .txtWrap .title{
    margin: 0;
    font-weight: 700;
    font-size: 140%;
    color: #014599;
}
#wellbeing .about ul.member li .txtWrap .comment{
    margin: 0;
    font-size: 95%;
}
#wellbeing .about ul.rule{
    margin: 1rem 0;
}
#wellbeing .about ul.rule li{
    padding: 5px 0;
}
#wellbeing .sdgs .boxFlex{
    margin: 1rem 0;
    gap: 3%;
}
#wellbeing .sdgs .leftWrap{
    flex: 1;
}
#wellbeing .sdgs dl dt{
    font-weight: 700;
}
#wellbeing .sdgs dl dd{
    padding-bottom: 1rem;
}
#wellbeing .sdgs .rightWrap{
    flex: 5;
}

/*------------------------------------------------------------
  staff
------------------------------------------------------------*/
#staff .wpContent h2{
    border: none;
    text-align: center;
    color: #014599;
    border-bottom: 1px solid #000;
    padding: 1rem 0;
}
#staff .wpContent h3{
    background: none;
    color: #014599;
    font-size: 240%;
    margin: 0;
    padding: 0;
}
#staff .wpContent ul{
    margin:0;
}
#staff .wpContent ul li{
    list-style:none;
}
#staff .intro{
    line-height: 230%;
}
#staff .areaFlex{
    justify-content:center;
    gap: 1%;
}
#staff .areaFlex li{
    flex: 1;
}
#staff .areaFlex li a{
    text-decoration: none;
    background: #014599;
    color: #FFF;
    padding: 1rem 0;
    text-align: center;
    border-radius: 4px;
    width: 100%;
    font-size: 140%;
}
#staff .ptFlex{
    gap: 4%;
    width: 90%;
    margin: 2rem auto;
    border-bottom: 1px dotted #ccc;
    padding-bottom: 2rem;
}
#staff .imgWrap{
    flex:1;
}
#staff .txtWrap{
    flex:4;
}
#staff .txtWrap p{
    margin: 0 0 1rem 0;
}


/*------------------------------------------------------------
  recruit
------------------------------------------------------------*/

#recruit .point{
    background:#F2F2F2;
    padding: 4rem 1rem;
}
#recruit .point h2{
    margin-top: 1rem;
    border:none;
}
#recruit .point .pointFLex{
    gap: 7%;
    margin: 2rem 0;
}
#recruit .point .pointFLex li{
    flex: 1;
    list-style: none;
    font-weight: 700;
}
#recruit .point .pointFLex li img{
    width: 30%;
    height: auto;
    margin-bottom: 1rem;
}
/* voice */
#recruit .voice{

}
#recruit .voice .listTumbFLex{
    gap:4%;
    margin:2rem 0 6rem 0;
}
#recruit .voice .listTumbFLex li{
    position: relative;
    flex: 1;
    background: #0070C6;
    padding: 0;
    list-style: none;
}
#recruit .voice .listTumbFLex li:hover{
    opacity:0.6;
}
#recruit .voice .listTumbFLex li:after{
    content: "";
    background: url(../img/common/iconArrowW.png) no-repeat;
    background-size: cover;
    width: 50px;
    height: 50px;
    position: absolute;
    bottom: 19px;
    right: 20px;
    transform: rotate(-90deg);
}
#recruit .voice .listTumbFLex li.rorate:after{
    transform: rotate(0deg);
}
#recruit .voice .listTumbFLex li .title{
    color: #FFF;
    font-size: 1.7vw;
    font-weight: 700;
    line-height: 150%;
    padding: 0 2rem;
    margin-bottom: 10px;
}
#recruit .voice .listTumbFLex li .sub{
    color: #FFF;
    font-size: 1vw;
    font-weight: 700;
    line-height: 150%;
    padding: 0 2rem;
    margin-top: 0;
}
#recruit .voice .listWrap{
    padding: 4rem 3rem;
    background: linear-gradient(to right, #507fb9, #014599);
    border-radius: 0 50px 50px 0;
    width: 97%;
    position: relative;
    z-index: 10;
}
#recruit .voice .listWrap h3{
    margin: 0;
    font-size: 3.5vw;
    background: none;
    padding: 0;
    position: relative;
}
#recruit .voice .listWrap h3 .phrase{
    display: block;
    color: #FEC24D;
    font-size: 2.8vw;
    position: absolute;
    bottom: -70%;
    z-index: 1;
}
#recruit .voice .listWrap .introWrap{
    position:relative;
}
#recruit .voice .listWrap .introFlex{
    gap: 7%;
    margin: 2rem 0;
    z-index: 1;
}
#recruit .voice .listWrap .introFlex .imgWrap{
    flex: 1;
}
#recruit .voice .listWrap .introFlex .txtWrap{
    flex: 1;
}
#recruit .voice .listWrap .introFlex .txtWrap h4{
    margin: 0;
    color: #FFF;
    font-size: 2vw;
    border-bottom: none;
}
#recruit .voice .listWrap .introFlex .txtWrap .title{
    margin: 0;
    color: #fec24e;
    font-weight: 700;
    font-size: 3vw;
}
#recruit .voice .listWrap .introFlex .txtWrap .txt{
    margin: 0;
    color: #FFF;
}
#recruit .voice .listWrap .read{
    position: absolute;
    background: #FFF;
    width: 70%;
    right: -50px;
    top: 24vw;
    z-index: 2;
    padding: 2rem;
}
#recruit .voice .listWrap .read .title{
    font-weight: 600;
    font-size: 1.5rem;
    margin: 0;
}
#recruit .voice .listWrap .read .txt{
    margin: 0.8rem 0 0 0;
    font-weight: 500;
    line-height: 190%;
}
#recruit .voice .listWrap .reason{
    padding-top: 6vw;
}
#recruit .voice .listWrap .reason h4{
    border: none;
    color: #FFF;
    font-size: 2vw;
}
#recruit .voice .listWrap .reason .txt{
    color: #FFF;
}
#recruit .voice .listWrap .messegeFt h4{
    border: none;
    color: #FFF;
    font-size: 1.5vw;
    position: relative;
    text-align: center;
    margin: 6rem 0 3rem 0;
    line-height: 300%;
}
#recruit .voice .listWrap .messegeFt h4 .phrase{
    display: block;
    color: #FEC24D;
    font-size: 5.8vw;
}
#recruit .voice .listWrap .messegeFt .txt{
    color: #FFF;
}
#recruit .voice .passive{
    display:none;
}
#recruit .voice .active{
    display:block;
}
/* scedule */
#recruit .scedule{
    position:relative;
    padding-top: 4rem;
}
#recruit .scedule h2{
    text-align: right;
    padding-top: 10vw;
    margin: 0;
}
#recruit .scedule h2 span.phrase{
    top: 0;
}
#recruit .scedule .list{
    width: 90%;
    margin: -25vw auto 0 auto;
}
#recruit .scedule img.sp{
    display:none;
}
/* comment */
#recruit .comment{
    background: #FFFCF4;
    padding: 3rem;
    margin-top: 5rem;
}
#recruit .comment .flex{
    gap: 4%; 
}
#recruit .comment .txtWrap{
    
}
#recruit .comment .txtWrap h3{
    background: none;
    color: #000;
    margin: 0;
    padding: 0;
}
#recruit .comment .txtWrap p{
    margin: 1rem 0;
}
/* messege */
#recruit .messege{
    background:#F2F2F2;
    padding:4rem 0;
    margin-top: 5rem;
}
#recruit .messege h2{
    border:none;
}
#recruit .messege .messegeFlex{
    width: 90%;
}
#recruit .messege .imgWrap{
    flex: 1;
}
#recruit .messege .txtWrap{
    flex: 1;
}
#recruit .messege .txtWrap ul{
    background: #F29F00;
    margin: 2rem 0 4rem 0;
    padding: 2rem 6vw;
}
#recruit .messege .txtWrap ul li{
    position: relative;
    list-style: none;
    color: #FFF;
    font-size: 1.8rem;
    font-weight: 600;
    padding: 1rem 1rem 1rem 4rem;
}
#recruit .messege .txtWrap ul li:before{
    content: "";
    background: url(../img/common/iconArrowW.png) no-repeat;
    background-size: cover;
    width: 50px;
    height: 50px;
    position: absolute;
    left: 0;
    transform: rotate(-90deg);
}
#recruit .messege .txtWrap p{
    width: 40vw;
    padding: 1rem 6vw 0 6vw;
    font-weight: 700;
}
/* youkou */
#recruit .youkou{
    position:relative;
    padding:8rem 5rem;
}
#recruit .youkou h2{
    position: absolute;
    z-index: 1;
    font-size: 6.5vw;
    color: #0070c5;
    margin: 0;
    line-height: 130%;
    font-weight: 700;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    right: 0;
    top: -20vw;
    transform: rotate(-180deg);
    border:none;
}
#recruit .youkou table{
    width: 80%;
    margin: 0 auto;
}

/*------------------------------------------------------------
  service
------------------------------------------------------------*/
.serviceCm  h2{
    border:none;
}
.serviceCm  h2.svCm{
    text-align: center;
    color: #044599;
    margin: 1rem;
    padding: 0;
    font-size: 3rem;
}
.serviceCm .introFlex{
    gap:3%;
}
.serviceCm .introFlex li{
    list-style: none;
}
.serviceCm .decoImg{
    display: block;
    width: 200px;
    margin: 6rem auto 1rem auto;
}
.serviceCm .subIntroWrap{
    background: #044599;
    position: relative;
    padding: 2rem 0;
    margin-bottom: 13rem;
}
.serviceCm .subIntroWrap::before{
    content: "";
    background: url(../img/content/service/blueArrow.jpg) no-repeat;
    background-size: cover;
    width: 100%;
    height: 8.1vw;
    position: absolute;
    bottom: -8vw;
    left: 0;
    z-index: 0;
}
.serviceCm .subIntroFlex{
    gap: 2%;
}
.serviceCm .subIntroFlex li{
    list-style: none;
    background: #FFF;
    padding: 10px;
    border-radius: 4px;
    flex: 1;
    text-align: center;
    font-weight: 700;
    font-size: 1.4rem;
}
.serviceCm .svBox{
    border: 1px solid #014599;
    border-radius: 10px;
    margin: 2rem 0 5rem 0;
    padding: 3rem;
}
.serviceCm .svBox .upperFlex{
    gap: 1%;
}
.serviceCm .svBox .upperFlex i{
    font-size: 6rem;
    font-style: normal;
    font-weight: 700;
    color: #014599;
    display: block;
    line-height: 100%;
}
.serviceCm .svBox .upperFlex p{
    margin: 0;
    font-size: 140%;
}
.serviceCm .svBox .upperFlex h3{
    margin: 0;
    background: none;
    color: #014599;
    padding: 0;
    font-size: 2.3rem;
    margin-left: -20px;
}
.serviceCm .svBox .exTips{
    background: #000;
    color: #FFF;
    font-weight: 700;
    text-align: center;
    font-size: 140%;
    border-radius: 80px;
    width: 200px;
    padding: 5px 0 8px 0;
    line-height: 130%;
    margin: 2rem auto 0 auto;
}
.serviceCm .svBox .listFlex{
    gap: 4%;
    margin-top: 0.5rem;
}
.serviceCm .svBox .listFlex li{
    list-style: none;
    flex: 1;
    margin: 0 0 30px 0;
}
.serviceCm .svBox .listFlex h4{
    margin: 0;
    border: none;
    text-align: center;
    line-height: 120%;
    padding: 30px 0;
}
.serviceCm .svBox .listFlex p{
    margin:1rem 0 0 0 ;
}
.serviceCm .svBox .listFlex li.adjust h4{
    padding: 10px 0 22px 0;
}

/* firstFlex */
.serviceCm .firstFlex {
    gap: 6%;
}
.serviceCm .firstFlex .upperFlex .firstInner{
    flex: 2;
}
.serviceCm .firstFlex .imgBox{
    flex: 1;
}
.serviceCm .firstInner h4{
    margin: 2rem 0;
    border: none;
}
.serviceCm .bluebox{
    background: linear-gradient(to right, #507fb9, #014599);
    padding: 2rem;
    border-radius: 20px;
    margin: 2rem 0 0 0;
    gap: 4%;
}
.serviceCm .blueFlex{
    gap: 4%;
}
.serviceCm .blueFlex.rev{
    flex-direction: row-reverse;
    margin-top: 5vw;
}
.serviceCm .blueFlex .imgBox{
    flex: 1;
}
.serviceCm .blueFlex .innerTxt{
    flex: 2;
}
.serviceCm .blueFlex .innerTxt h4{
    color: #FEC24D;
    border: none;
    font-size: 170%;
    margin: 0;
}
.serviceCm .blueFlex .innerTxt p{
    color: #FFF;
}
.serviceCm .fiveFlex{
    gap:4%;
    margin: 2rem 0 0 0;
} 
.serviceCm .fiveFlex .txtWrap{
    flex:1;
}
.serviceCm .fiveFlex .txtWrap h4{
    border: none;
    margin: 0;
}
.serviceCm .fiveFlex .imgWrap{
    flex:1;
}
.serviceCm .bottomWrap{
    background:url(../img/content/service/houjin3.png) no-repeat;
    background-size:cover;
}

/** service **/


/** service_kojin **/
#service_kojin .kjWrap{

}
#service_kojin .kjWrap .boxFlex{
    margin: 0 0 4rem 0;
}
#service_kojin .kjWrap .txtwrap{
    flex: 3;
    padding-left: 4rem;
}
#service_kojin .kjWrap .upperFlex{
    gap: 1%;
    border-bottom: 1px solid;
    padding-bottom: 1rem;
}
#service_kojin .kjWrap .upperFlex i{
    width: 80px;
}
#service_kojin .kjWrap .upperFlex .innerTxt{

}
#service_kojin .kjWrap .upperFlex .innerTxt h3{
    margin: 0;
    background: none;
    color: #014599;
    padding: 0;
    font-size: 2.3rem;
    line-height: 120%;
}
#service_kojin .kjWrap .upperFlex .innerTxt p{
    margin: 0;
    font-size: 1.2rem;
}
#service_kojin .kjWrap .typeFlex{
    gap: 1%;
    margin: 2rem 0;
}
#service_kojin .kjWrap .txtwrap p.cm{
    padding: 0 2rem 0 0;
}
#service_kojin .kjWrap .typeFlex li{
    list-style: none;
    background: #014599;
    color: #fec24f;
    font-weight: 700;
    padding: 0.5rem 2rem;
    border-radius: 4px;
    font-size: 1.5rem;
}
#service_kojin .kjWrap .imgwrap{
    flex: 1;
}
#service_kojin .kjWrap .boxFlex.rev{
    flex-direction: row-reverse;
}
#service_kojin .ctIndWrap{
    background: linear-gradient(to right, #507fb9, #014599);
    padding: 4rem 1rem;
    margin-bottom: 5rem;
}
#service_kojin .ctIndWrap h2{
    margin: 0;
    color: #FFF;
    text-align: center;
    font-size: 2.5rem;
}
#service_kojin .ctIndWrap .boxFlex{
    gap: 2%;
}
#service_kojin .ctIndWrap .boxFlex li{
    flex: 1;
    list-style: none;
}
#service_kojin .ctIndWrap .boxFlex li h3{
    position: relative;
    color: #fec24f;
    text-align: center;
    background: none;
    margin: 0;
    padding: 1rem 0;
    font-size: 2rem;
}
#service_kojin .ctIndWrap .boxFlex li h3:after{
    content: "";
    width: 130px;
    height: 2px;
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    margin: auto;
    background: #fec24f;
}
#service_kojin .ctIndWrap .boxFlex li .childFlex{
    flex-wrap: wrap;
    justify-content: center;
    width: 70%;
    gap: 4%;
    margin: 0 auto;
}
#service_kojin .ctIndWrap .boxFlex li .childFlex li{
    list-style: none;
    text-align: center;
    color: #FFF;
    font-size: 150%;
    flex: auto;
    font-weight: 600;
}


/*------------------------------------------------------------
  voice
------------------------------------------------------------*/
#voice h1{
    margin-top: 6rem;
}

/*------------------------------------------------------------
  inquiry
------------------------------------------------------------*/

#inquiryWrapper{
    margin: 4rem auto;
    width: 1000px;
}
#inquiry textarea,#inquiry .your-subject{
    width: 100%;
}
#inquiryWrapper dl{
    flex-wrap: wrap;
    margin-bottom: 4rem;
}
#inquiryWrapper dt span{
    background: #989898;
    color: #FFF;
    padding: 0 10px;
    margin-right: 10px;
    display: inline-block;
    font-weight: bold;
}
#inquiryWrapper dt span.must{
    background: #b91717; 
}
#inquiryWrapper dt,#inquiryWrapper dd{
    padding: 20px 0;
}
#inquiryWrapper dt{
    width: 25%;
}
#inquiryWrapper dd{
    width: 75%;
}
#inquiryWrapper .mwform-tel-field input[type="text"]{
    width: 20%;
}
#inquiryWrapper dd.noFlex{
  display: block;
}
#inquiryWrapper dd p{
    color: #b62121;
    font-weight: bold;
}
#inquiryWrapper select{
    padding: 10px;
}
#inquiryWrapper input[type="text"],#inquiryWrapperinput[type="email"],#inquiryWrapper input[type="tel"],#inquiry textarea{
    padding: 10px;
    border:1px solid #767676;
    border-radius: 3px;
}
#inquiryWrapper input[type="text"],#inquiryWrapper input[type="email"]{
    width: 100%;
    padding: 10px;
}
#inquiryWrapper [type="submit"],#inquiryWrapper .backButton {
    background: #014599;
    appearance: none;
    -webkit-appearance: none;
    width: 300px;
    padding: 20px 0;
    font-size: 16px;
    color: #FFF;
    border-radius: 3px;
    margin: 5px auto;
    letter-spacing: 0.5rem;
    font-weight: bold;
    border: none;
    display: block;
}
#inquiryWrapper .backButton {
    display: block;
    text-align: center;
    margin: 1rem auto;
}
#inquiryWrapper [type="submit"].back{
    background: #a0a0a0;
}
#inquiryWrapper .caution{
  font-size: 80%;
}
#inquiryWrapper .wpContent a.linkButton{
    width: 70%;
    margin: 2rem auto;
    text-align: center;
    display: block;
}
#inquiry-complete a.back{
    background: #014599;
    color: #FFF;
    text-align: center;
    width: 210px;
    padding: 0.8rem 1rem;
    font-size: 1.2rem;
    font-weight: 700;
    border-radius: 4px;
    margin: 6rem auto;
    display: block;
    text-decoration: none;
}

@media (max-width: 1630px) {
    #recruit .voice .listWrap .read{
        top: 25vw;
    }
}

@media (max-width: 1440px) {
    #recruit .voice .listWrap .read{
        top: 28vw;
    }
    #recruit .voice .listWrap .reason{
        padding-top: 12vw;
    }
}

@media (max-width: 1190px) {

    /** common **/
    .dccs.wpContent{
        padding:0 1rem;
    }
    .underpage .wpContent .udCmH2{
        margin-top:13vw;
    }
    .underpage .wpContent .udCmH2 span{
        font-size: 10vw;
        top: -13vw;
    }
    .wpContent .cmFtWrap .title{

    }
    .wpContent .cmFtWrap .leftWrap{
        padding: 0 3%;
    }
    .wpContent .cmFtWrap h2{
        font-size: 2rem;
        margin: 4rem 0 2rem 0;
    }

    /** company **/
    #company .wpContent .intro .title{
        font-size: 6.5rem;
    }
    /** reason **/
    #reason .wpContent .ftWrap .title{
        font-size: 7.5rem;
    }
    #reason .wpContent .ftWrap .leftWrap{
        padding: 0 3%;
    }
    #reason .wpContent .ftWrap h2{
        font-size: 2rem;
        margin: 4rem 0 2rem 0;
    }
    /** contact **/
    #inquiryWrapper{
        width: 100%;
        padding: 0 2rem;
    }

}

@media (max-width: 1092px) {
    #recruit .voice .listWrap .read{
        width: 110%;
        top: 38vw;
        padding: 1rem;
    }
    #recruit .voice .listWrap .reason{
        padding-top: 17vw;
    }
}

@media (max-width: 970px) {

    /** common **/
    .wpContent .cmFtWrap .title{
        top: -3rem;
    }
    .wpContent .cmFtWrap{
        display:block;
    }
    .wpContent .cmFtWrap h2{
        margin-top:4rem;
    }
    .wpContent .cmFtWrap .imgWrap{
        padding: 0 0 2rem 2rem;
        width: 90%;
        margin: 0 0 0 auto;
    }
    .wpContent .cmFtWrap .leftWrap{
        padding: 2rem;
    }
    .wpContent .cmFtWrap .leftWrap .txtbox{
        width:80%;
    }

    /** company **/
    #company .wpContent .intro .title{
        font-size: 4.5rem;
    }
    #company .wpContent .intro h2{
        font-size: 2.5rem;
    }
    #company .wpContent .ftWrap{
        display:block;
    }
    #company .wpContent .ftWrap .imgWrap{
        padding: 2rem 0 2rem 2rem;
    }
    #company .rinen ul{
        width:100%;
    }
    #company .kanren ul{
        max-width: 90%;
    }
    .underpage .wpContent .udCmHd{
        font-size: calc(55 / 970* 100vw);
        line-height: 120%;
    }
    .underpage .wpContent p.deco{
        font-size: calc(24 / 970* 100vw);
    }
    #company .mission .missionFlex li p.comment{
        width:100%;
    }
    /** service **/
    .wpContent .serviceCm ul{
        margin:0;
    }
    .serviceCm .firstFlex{
        display:block;
    }
    #service_kojin .ctIndWrap .boxFlex{
        display:block;
    }
    #service_kojin .kjWrap .boxFlex{
        display:block;
    }
    .serviceCm .fiveFlex{
        display:block;
    }
    /** reason **/
    #reason .wpContent .ftWrap .title{
        top: -3rem;
    }
    #reason .wpContent .ftWrap{
        display:block;
    }
    #reason .wpContent .ftWrap h2{
        margin: 0rem 0 2rem 0;
    }
    #reason .wpContent .ftWrap.intro h2{
        margin-top:4rem;
    }
    #reason .wpContent .ftWrap .imgWrap{
        padding: 0 0 2rem 2rem;
        width: 90%;
        margin: 0 0 0 auto;
    }
    #reason .wpContent .ftWrap.intro .leftWrap{
        padding: 2rem;
    }
    #reason .wpContent .st:before{
        width: 90%;
        height: 110%;
        top: -5%;
    }
    #reason .wpContent .ftWrap .leftWrap .txtbox{
        width:80%;
    }
    #reason .wpContent .rev::before{
        right: 0;
    }
    #reason .wpContent .rev .leftWrap{
        padding-left: 20vw;
    }
    #reason .wpContent .rev .imgWrap{
        padding: 0 2rem 2rem 0;
        margin: 0 auto 0 0;
    }
    /** staff **/
    #staff .areaFlex li a{
        font-size: calc(24 / 970* 100vw);
    }
    /** welbe **/
    #wellbeing .wpContent h2.cm{
        font-size: calc(60 / 970* 100vw);
    }
    /* recruit */
    #recruit .voice .listWrap .read .txt{
        font-size: calc(16 / 970* 100vw);
        margin-top: 0;
    }
    #recruit .voice .listWrap .introFlex .txtWrap h4{
        font-size: calc(23 / 970* 100vw);
    }
    #recruit .voice .listWrap .reason h4{
        font-size: calc(27 / 970* 100vw);
    }
    /** contact **/
    #inquiryWrapper dl{
        display:block;
    }
    #inquiryWrapper dt,#inquiryWrapper dd{
        width: 100%;
        padding: 20px 0 0 0;
    }

}

@media (max-width: 860px) {

    #recruit .voice .listTumbFLex li:after{
        width: 30px;
        height: 30px;
    }
    #recruit .voice .listTumbFLex li .sub{
        font-size: 1.5vw;
    }
}

@media (max-width: 640px) {


    /** common **/
    .underpage .wpContent .udCmHd{
        font-size: calc(43 / 640* 100vw);
        line-height: 120%;
    }
    .underpage .wpContent h1.smalH1{
        font-size: calc(24 / 640 * 100vw);
        margin-top: 1rem;
        line-height: 160%;
    }
    .underpage .wpContent h1.smalH1 .break{
        display:block;
    }
    .underpage .wpContent p.deco{
        font-size: calc(24 / 640* 100vw);
    }
    .underpage .wpContent .udCmH2{
        margin-top:19vw;
    }
    .underpage .wpContent .udCmH2 span{
        font-size: calc(85 / 640* 100vw);
        top: -16vw;
    }
    .wpContent .cmFtWrap{
        margin: 12vw 0 24vw 0;
    }
    .wpContent .cmFtWrap .title{
        font-size: calc(103 / 640* 100vw);
        top: -1rem;
    }
    .wpContent .cmFtWrap h2{
        font-size: calc(33 / 640* 100vw);
        padding-left: 0;
    }
    .wpContent .cmFtWrap .txtbox{
        width:95%;
    }
    .wpContent .cmFtWrap .imgWrap{
        width:100%;
    }
    .wpContent .bottomWrap h2{
        font-size: calc(46 / 640* 100vw);
        margin-bottom: 2rem;
    }
    .wpContent a.cmBox{
        max-width: 80%;
    }
    /** company **/
    #company .wpContent .ftWrap .leftWrap{
        padding: 0 2rem;
    }
    #company .wpContent .intro .title{
        font-size: calc(84 / 640* 100vw);
    }
    #company .wpContent .intro h2 {
        font-size: calc(40 / 640* 100vw);
    }
    #company .rinen h3{
        font-size: calc(54 / 640* 100vw);
    }
    #company .kanren ul{
        display:block;
    }
    #company .kanren ul li{
        max-width: 250px;
        margin: 0 auto;
    }
    #company .mission h2,#company .value h2{
        font-size: calc(84 / 640* 100vw);
    }
    #company .mission h2 .title {
        font-size: calc(27 / 640 * 100vw);
        display: block;
        margin-top: -40px;
    }
    #company .value h2{
        line-height: 0;
    }
    #company .value h2 .title{
        font-size: calc(27 / 640* 100vw);
    }
    #company h2.cmHd{
        font-size: calc(47 / 640* 100vw);
    }
    #company .kanren h3{
        font-size: calc(37 / 640* 100vw);  
    }
    /** reason **/
    #reason .wpContent .ftWrap{
        margin: 12vw 0 24vw 0;
    }
    #reason .wpContent .ftWrap .title{
        font-size: calc(103 / 640* 100vw);
        top: -1rem;
    }
    #reason .wpContent .ftWrap.intro h2{
        font-size: calc(33 / 640* 100vw);
    }
    #reason .wpContent .ftWrap .subTitle{
        font-size: calc(27 / 640* 100vw);
    }
    #reason .wpContent .ftWrap .leftWrap .txtbox{
        width:95%;
    }
    #reason .wpContent .ftWrap .imgWrap{
        width:100%;
    }
    #reason .wpContent .st:before{
        width: 98%;
    }
    #recruit .voice .listWrap h3 .phrase{
        font-size: 6.8vw;
        bottom:-35px;
    }
    /* service */
    .serviceCm h2.svCm{
        font-size: calc(38 / 640* 100vw);
    }
    .serviceCm .svBox{
        padding: 3rem 2rem;
    }
    .serviceCm .svBox .upperFlex h3{
        font-size: calc(35 / 640* 100vw);
    }
    .serviceCm .svBox .listFlex{
        display:block;
        margin: 0;
    }
    .serviceCm .blueFlex{
        display: block;
    }
    .serviceCm .svBox .upperFlex{
        display: block;
    }
    .serviceCm .svBox .upperFlex i{
        text-align:center;
    }
    .serviceCm .introFlex{
        margin: 0;
        flex-wrap: wrap;
        justify-content: center;
    }
    .serviceCm .introFlex li{
        width: 44%;
        padding: 0;
    }
    .serviceCm .subIntroFlex{
        flex-wrap: wrap;
        justify-content: center;
    }
    .serviceCm .subIntroFlex li{
        margin: 10px;
        width: 45%;
        flex:auto;
    }
    #service_kojin .kjWrap .txtwrap{
        padding: 10px;
    }
    /** welbe */
    #wellbeing .about ul.member li .flex{
        display:block;
    }
    #wellbeing .wpContent h2.cm{
        font-size: calc(40 / 640* 100vw);
    }
    #wellbeing .blueBack ul{
        display:block;
    }
    #wellbeing .blueBack li{
        padding: 0;
        margin: 1rem auto;
        width: 60%;
    }
    #wellbeing .improvement ul{
        display:block;
    }
    #wellbeing .about .boxFlex{
        display:block;
    }
    #wellbeing .sdgs .boxFlex{
        display:block;
    }
    #wellbeing .sdgs .leftWrap{
        width: 40%;
        margin: 2rem auto 1rem auto;
    }
    /* recruit */
    #recruit .point .pointFLex{
        flex-wrap: wrap;
    }
    #recruit .point .pointFLex{
        flex-wrap:wrap;
    }
    #recruit .point .pointFLex li{
        flex: auto;
        width: 45%;
    }
    #recruit .voice .listWrap .introWrap,
    #recruit .voice .listWrap .introFlex{
        display:block;
    }
    #recruit .voice .listWrap .read{
        position: relative;
        width: 110%;
        top: 0;
        right: 0;
        position: relative;
    }
    #recruit .voice .listWrap .introFlex{
        display:block;
    }
    #recruit .voice .listWrap .introFlex .txtWrap .txt{
        font-size: calc(20 / 640* 100vw);
        line-height: 130%;
    }
    #recruit .voice .listWrap .read .txt{
        font-size: calc(16 / 640* 100vw);
    }
    #recruit .voice .listWrap .introFlex .txtWrap h4{
        font-size: calc(23 / 640* 100vw);
    }
    #recruit .voice .listTumbFLex li .title{
        font-size: calc(26 / 640* 100vw);
        padding: 0 1rem;
    }
    #recruit .voice .listTumbFLex li .sub{
        padding: 0 1rem;
    }
    #recruit .voice .listTumbFLex li .sub,
    #recruit .voice .listWrap .messegeFt h4{
        font-size: calc(20 / 640* 100vw);

    }
    #recruit .voice .listWrap .messegeFt h4 .phrase,
    #recruit .voice .listWrap .introFlex .txtWrap .title{
        font-size: calc(60 / 640* 100vw);  
    }
    #recruit .voice .listTumbFLex li{
        padding-bottom: 5px;
        margin-bottom: 10px;
    }
    #recruit .voice .listTumbFLex{
        display:block;
        margin-top: 0;
    }
    #recruit .voice .listTumbFLex p a{
        display:none;
    }
    #recruit .voice .listWrap .reason{
        padding-top: 0;
    }
    #recruit .scedule h2{
        font-size: calc(26 / 640* 100vw);
    }
    #recruit .scedule h2 span.phrase{
        top: -30px;
    }
    #recruit .scedule img.sp{
        display:block;
        width: 100%;
        margin: 0 auto;
    }
    #recruit .scedule img.pc{
        display:none;
    }
    #recruit .comment .flex{
        display:block;
    }
    #recruit .comment .txtWrap{
        padding-top: 2rem;
    }
    #recruit .messege .messegeFlex{
        display: block;
        width: 100%;
    }
    #recruit .messege .txtWrap p{
        width:100%;
    }
    #recruit .youkou{
        padding: 6rem 1rem;
    }
    #recruit .youkou table{
        width:100%;
    }
    /** staff **/
    #staff .ptFlex{
        display: block;
    }
    #staff .imgWrap{
        width: 60%;
        margin: 0 auto;
    }

}

@media (max-width: 480px){

    /** common **/
    .underpage .wpContent .udCmHd{
        font-size: calc(34 / 480* 100vw);
        line-height: 120%;
        margin-bottom: 0;
    }
    .underpage .wpContent h1.smalH1{
        margin-bottom:2rem;
    }
    .underpage .wpContent .udCmH2{
        margin-top:25vw;
    }
    .underpage .wpContent .udCmH2 span{
        font-size: calc(106 / 640* 100vw);
        top: -20vw;
    }
    .underpage .wpContent p.deco{
        font-size: calc(16 / 480* 100vw);
    }
    .wpContent .cmFtWrap h2{
        margin-top: 0;
    }
    .wpContent .cmFtWrap .leftWrap .txtbox{
        width:100%;
    }
    /** company **/
    #company .wpContent .intro h2{
        margin: 1rem 0 2rem 0;
    }
    #company .rinen ul li{
        font-size: calc(22 / 480* 100vw);
    }
    #company .rinen ul li img{
        display: block;
        margin: 1rem auto;
    }
    #company .mission .missionFlex{
        display: block;
    }
    #company .mission .missionFlex li{
        margin: 1rem 0;
    }
    #company .wpContent table th,#company .wpContent table td{
        border:none;
        padding: 10px;
        display: block;
    }
    #company .wpContent table td{
        padding-bottom: 30px;
    }
    /** service **/
    #service_kojin .kjWrap .typeFlex{
        display:block;
    }
    #service_kojin .kjWrap .typeFlex li{
        margin: 5px;
        text-align: center;
    }
    /* voice **/
    #voice h1{
        margin:2rem 0;
    }
    /** staff **/
    #staff .areaFlex{
        display: block;
    }
    #staff .areaFlex li a{
        font-size: calc(18 / 480* 100vw);
    }

    #inquiryWrapper dl{
        display: block;
    }
    #inquiryWrapper dt,#inquiryWrapper dd{
        width: 100%;
    }
    #inquiryWrapper input[type="text"]{
        width: 100%;
    }
    #inquiry input[type="text"],#inquiry input[type="email"],#inquiry input[type="tel"],#inquiry textarea{
        width: 100%;
    }

}

@media (max-width: 420px) {

    .wpContent a.cmBox{
        font-size: 110%;
    }
    .underpage .wpContent .udCmHd{
        font-size: calc(29 / 380* 100vw);
        line-height: 120%;
    }
    .underpage .wpContent p.deco{
        font-size: calc(16 / 380* 100vw);
    }
    /** recruit **/
    #recruit .point{
        padding: 1rem 0;
    }
    #recruit .voice .listTumbFLex li .title{
        font-size: calc(20 / 380* 100vw);
    }
    #recruit .voice .listTumbFLex li .sub{
        font-size: calc(18 / 380* 100vw);  
    }
    #recruit .voice .listTumbFLex li .sub, #recruit .voice .listWrap .messegeFt h4{
        font-size: calc(20 / 380* 100vw);
    }
    #recruit .voice .listWrap h3{
        font-size: calc(23 / 380* 100vw);
    }
    #recruit .voice .listWrap .introFlex .txtWrap h4{
        font-size: calc(19 / 380* 100vw);
        padding: 2rem 0 0 0;
    }
    #recruit .voice .listWrap .introFlex .txtWrap .txt{
        font-size: calc(16 / 380* 100vw);
    }
    #recruit .voice .listWrap .read .txt{
        font-size: calc(14 / 380* 100vw);
    }
    #recruit .voice .listWrap .reason h4{
        font-size: calc(24 / 380* 100vw);
    }
    #recruit .comment{
        padding: 3rem 0;
    }
    #recruit .messege{
        margin-top: 2rem;
        padding: 0;
    }
    #recruit .messege h2{
        margin-top: calc(45 / 380* 100vw);
    }
    #recruit .messege .txtWrap ul li{
        font-size: 150%;
    }
    #recruit .youkou{
        padding: 6rem 0;
    }
    #recruit .voice .listWrap{
        padding: 3rem 1rem;
    }
    /** service **/
    .serviceCm .svBox{
        padding: 1rem 1rem;
    }
    .serviceCm .bluebox{
        padding: 2rem 1rem;
    }
    .serviceCm .svBox .listFlex li{
        margin: 0;
    }
    #service_kojin .ctIndWrap h2{
        font-size: 180%;
    }
    #service_kojin .ctIndWrap .boxFlex li .childFlex{
        width:100%;
    }

}