@charset "UTF-8";

#subVisual{padding: 8.5% 0 6%;position: relative;}

#subVisual.Vi-massage{background: url("../img/topmessage/h2bg.jpg")no-repeat center / cover;}
.Vi-massage .subVisualInner{background: url("../img/topmessage/h2.jpg")no-repeat center / contain;}

#subVisual.Vi-strength{background: url("../img/strength/h2bg.jpg")no-repeat center / cover;}
.Vi-strength  .subVisualInner02{background: url("../img/strength/h2.jpg")no-repeat center right/ cover;}
#subVisual.Vi-field{background: url("../img/businessfield/h2bg.jpg")no-repeat center / cover;}
.Vi-field  .subVisualInner02{background: url("../img/businessfield/h2.jpg")no-repeat center right/ cover;}
#subVisual.Vi-newenergy{background: url("../img/newenergy/h2bg.jpg")no-repeat center / cover;}
.Vi-newenergy  .subVisualInner02{background: url("../img/newenergy/h2.jpg")no-repeat center right/ cover;}

#subVisual.Vi-works{background: url("../img/works/main_h2bg.jpg")no-repeat center / cover;}
.Vi-works  .subVisualInner02{background: url("../img/works/main_h2.jpg")no-repeat center right/ cover;}

#subVisual.Vi-interview01{background: url("../img/works/h2bg_01.jpg")no-repeat center / cover;}
.Vi-interview01 .subVisualInner{background: url("../img/works/h2_01.jpg")no-repeat center / contain;}
#subVisual.Vi-interview02{background: url("../img/works/h2bg_02.jpg")no-repeat center / cover;}
.Vi-interview02 .subVisualInner{background: url("../img/works/h2_02.jpg")no-repeat center / contain;}
#subVisual.Vi-interview03{background: url("../img/works/h2bg_03.jpg")no-repeat center / cover;}
.Vi-interview03 .subVisualInner{background: url("../img/works/h2_03.jpg")no-repeat center / contain;}
#subVisual.Vi-interview04{background: url("../img/works/h2bg_04.jpg")no-repeat center / cover;}
.Vi-interview04 .subVisualInner{background: url("../img/works/h2_04.jpg")no-repeat center / contain;}
#subVisual.Vi-interview05{background: url("../img/works/h2bg_05.jpg")no-repeat center / cover;}
.Vi-interview05 .subVisualInner{background: url("../img/works/h2_05.jpg")no-repeat center / contain;}
#subVisual.Vi-interview06{background: url("../img/works/h2bg_06.jpg")no-repeat center / cover;}
.Vi-interview06 .subVisualInner{background: url("../img/works/h2_06.jpg")no-repeat center / contain;}

#subVisual.Vi-crosstalk01{background: url("../img/crosstalk/h2bg_01.jpg")no-repeat center / cover;}
.Vi-crosstalk01 .subVisualInner{
    position: relative;
    background: url("../img/crosstalk/h2_01.jpg")no-repeat center / contain;}
.Vi-crosstalk01 .subVisualInner::after,
.Vi-crosstalk02 .subVisualInner::after,
.Vi-projectstory .subVisualInner::after,
.Vi-questionnaire .subVisualInner::after{
    position: absolute;
    content: "special contentS 01";
    top: 0;
    left: -4%;
    z-index: 2;
    writing-mode: vertical-rl;
    color: var(--c-main);
    font-family: var(--ff-en);
    /*font-size: 4.0rem;*/
    font-size: calc(100vw / 40);
    text-transform: uppercase;
    }
#subVisual.Vi-crosstalk02{background: url("../img/crosstalk/h2bg_02.jpg")no-repeat center / cover;}
.Vi-crosstalk02 .subVisualInner{
    position: relative;
    background: url("../img/crosstalk/h2_02.jpg")no-repeat center / contain;}
.Vi-crosstalk02 .subVisualInner::after{content: "special contentS 02";}
#subVisual.Vi-projectstory{background: url("../img/projectstory/h2bg.jpg")no-repeat center / cover;}
.Vi-projectstory .subVisualInner{
    position: relative;
    background: url("../img/projectstory/h2.jpg")no-repeat center / contain;}
.Vi-projectstory .subVisualInner::after{content: "special contentS 03";}
#subVisual.Vi-questionnaire{background: url("../img/questionnaire/h2bg.jpg")no-repeat center / cover;}
.Vi-questionnaire .subVisualInner{
    position: relative;
    background: url("../img/questionnaire/h2.jpg")no-repeat center / contain;}
.Vi-questionnaire .subVisualInner::after{content: "special contentS 04";}


#subVisual.Vi-education{background: url("../img/education/h2bg.jpg")no-repeat center / cover;}
.Vi-education  .subVisualInner02{background: url("../img/education/h2.jpg")no-repeat center right/ cover;}
#subVisual.Vi-benefits{background: url("../img/benefits/h2bg.jpg")no-repeat center / cover;}
.Vi-benefits  .subVisualInner02{background: url("../img/benefits/h2.jpg")no-repeat center right/ cover;}
#subVisual.Vi-newgraduate{background: url("../img/newgraduate/h2bg.jpg")no-repeat center / cover;}
.Vi-newgraduate  .subVisualInner02{background: url("../img/newgraduate/h2.jpg")no-repeat center left/ cover;}



.subVisualInner{
    width: 80%;
    padding: 22%;
    /*max-width: 1430px;*/
    /*height: 800px;*/
    margin: auto;
    /*position: relative;*/
    }
.subVisualInner02{
    width: 90%;
    height: 700px;
    margin: auto 0 auto auto;
    position: relative;
    }
.subVisualInner.massageTtl .inner{
    position: absolute;
    top: 40%;
    left: 2%;
    }
.Vi-crosstalk01 .subVisualInner.massageTtl .inner,
.Vi-crosstalk02 .subVisualInner.massageTtl .inner,
.Vi-questionnaire .subVisualInner.massageTtl .inner,
.Vi-projectstory .subVisualInner.massageTtl .inner{
    top: auto;
    bottom: 20%;
    }
.subVisualInner02 .inner{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    left: -8%;
    }
#subVisual h2{
    font-size: 5.0rem;
    margin-bottom: 20px;
    }
#subVisual h2 span{
    background: var(--c-base);
    color: #fff;
    /* padding: 1px 15px; */
    padding: 4px 15px;
    }
#subVisual .subcatch1{}
#subVisual .subcatch1 p{
    display: inline-block;
    color: var(--c-base);
    }
#subVisual .subcatch1 p span{
    background: #fff;
    font-size: 3.5rem;
    padding: 1px 15px;
    line-height: 1.5;
    }
#subVisual .subcatch1 p span.mf{font-size: 2.8rem;}
#subVisual .subcatch1 p span.sf{font-size: 2.0rem;}


.subVisualInner.massageTtl .subcatch2{
    position: absolute;
    top: 2%;
    right:1%;
    font-size: 5.3rem;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-family: "Zen Old Mincho", serif;
    }
.subVisualInner.massageTtl .subcatch2 span{
    background: var(--c-main);
    color: #fff;
    padding: 18px 17px;
    }
.subVisualInner.massageTtl .subcatch2 span strong{text-orientation: upright;}
.subVisualInner.massageTtl .cate,
.subVisualInner.massageTtl .cate2{
    font-size: 2.0rem;
    margin-bottom: 10px;
    }
.subVisualInner.massageTtl .cate span,
.subVisualInner.massageTtl .cate2 span{
    letter-spacing: 0;
    padding: 2px 10px;
    background: #ed4d58;
    color: #fff;
    }
.subVisualInner.massageTtl .cate2 span{background: #03649a;}
#subVisual .subcatch3 {
    position: absolute;
    bottom: 0;
    left: 0;
    font-family: var(--ff-en);
    display: flex;
    width: 100%;
    overflow: hidden;
    }

#subVisual .subcatch3 .loop_text {
    flex: 0 0 auto;
    white-space: nowrap;
    /*font-size: 14.0rem;*/
    font-size: calc(100vw / 11);
    line-height: 1.2;
     font-weight: 300;
    overflow: hidden;
    padding-left: 30px;
    color: #fff;
    text-transform: uppercase;
    }
.loop_text:nth-child(odd) {animation: loop 50s -25s linear infinite;}
.loop_text:nth-child(even) {animation: loop2 50s linear infinite;}
@keyframes loop {
    0% {transform: translateX(100%);}
    to {transform: translateX(-100%);}
    }
@keyframes loop2 {
    0% {transform: translateX(0);}
    to {transform: translateX(-200%);}
    }


@media screen and (max-width: 1450px) {
#subVisual h2{font-size: calc(100vw / 30);} 
#subVisual .subcatch1 p span{font-size: calc(100vw / 35);}
#subVisual .subcatch1 p span.mf{font-size: calc(100vw / 45);}
#subVisual .subcatch1 p span.sf{font-size: calc(100vw / 55);}  
/*.subVisualInner{background-size: contain !important; }*/
.subVisualInner.massageTtl .subcatch2{font-size: calc(100vw / 26);}
.subVisualInner.massageTtl .cate,
.subVisualInner.massageTtl .cate2{font-size: calc(100vw / 55);}
}

/* TAB */
@media screen and (max-width: 780px) {
#subVisual{padding: 15% 0 7%;}

.Vi-massage .subVisualInner{background: url("../img/topmessage/h2_sp.jpg")no-repeat center / contain;}
    
.Vi-strength  .subVisualInner02{background: url("../img/strength/h2_sp.jpg")no-repeat center right/ cover;}
.Vi-field  .subVisualInner02{background: url("../img/businessfield/h2_sp.jpg")no-repeat center right/ cover;}
.Vi-newenergy  .subVisualInner02{background: url("../img/newenergy/h2_sp.jpg")no-repeat center right/ cover;}
.Vi-works  .subVisualInner02{background: url("../img/works/main_h2_sp.jpg")no-repeat center right/ cover;}
    
.Vi-interview01 .subVisualInner{background: url("../img/works/h2_01_sp.jpg")no-repeat center / contain;}
.Vi-interview02 .subVisualInner{background: url("../img/works/h2_02_sp.jpg")no-repeat center / contain;}
.Vi-interview03 .subVisualInner{background: url("../img/works/h2_03_sp.jpg")no-repeat center / contain;}
.Vi-interview04 .subVisualInner{background: url("../img/works/h2_04_sp.jpg")no-repeat center / contain;}
.Vi-interview05 .subVisualInner{background: url("../img/works/h2_05_sp.jpg")no-repeat center / contain;}
.Vi-interview06 .subVisualInner{background: url("../img/works/h2_06_sp.jpg")no-repeat center / contain;}
.Vi-crosstalk01 .subVisualInner{background: url("../img/crosstalk/h2_01_sp.jpg")no-repeat center / contain;}
.Vi-crosstalk02 .subVisualInner{background: url("../img/crosstalk/h2_02_sp.jpg")no-repeat center / contain;}
.Vi-projectstory .subVisualInner{background: url("../img/projectstory/h2_sp.jpg")no-repeat center / contain;}
.Vi-questionnaire .subVisualInner{background: url("../img/questionnaire/h2_sp.jpg")no-repeat center / contain;}
    
.Vi-education  .subVisualInner02{background: url("../img/education/h2_sp.jpg")no-repeat center right/ cover;}
.Vi-benefits  .subVisualInner02{background: url("../img/benefits/h2_sp.jpg")no-repeat center right/ cover;}
.Vi-newgraduate  .subVisualInner02{background: url("../img/newgraduate/h2_sp.jpg")no-repeat center left/ cover;}   
    

.Vi-crosstalk01 .subVisualInner::after,
.Vi-crosstalk02 .subVisualInner::after,
.Vi-projectstory .subVisualInner::after,
.Vi-questionnaire .subVisualInner::after{
    /* left: -32px;
    font-size: 2.6rem; */
    top: 3%;
    left: -6%;
    font-size: 1.2rem;
    }

.subVisualInner{
    width: 90%;
    padding: 44%;
    /*height: 600px;*/
    }
.subVisualInner02{
    width: 90%;
    padding: 44%;
    height: auto;
    /*height: 600px;*/
    }
.subVisualInner02.spVInner02{
     padding: 24% 44%;   
    }
.subVisualInner.massageTtl .inner{
    top: auto;
    bottom: 10%;
    left: 2%;
    }
.Vi-crosstalk01 .subVisualInner.massageTtl .inner,
.Vi-crosstalk02 .subVisualInner.massageTtl .inner,
.Vi-questionnaire .subVisualInner.massageTtl .inner,
.Vi-projectstory .subVisualInner.massageTtl .inner{
    top: auto;
    bottom: 20%;
    }

    
.subVisualInner02 .inner{
    top: auto;
    bottom: 0;
    left: 5%;
    }
.subVisualInner02.spVInner02 .inner{
    top: auto;
    bottom: 7%;
    left: -8%;
    }
#subVisual h2{
    font-size: calc(100vw / 21);
    /*font-size: 3.3rem;*/
    margin-bottom: 10px;
    }
#subVisual h2 span{
    /* padding: 1px 10px; */
    padding: 6px 10px;
    }
#subVisual .subcatch1 p span{
    font-size: 2.5rem;
    padding: 1px 10px;
    }
#subVisual .subcatch1 p span.mf{font-size: 1.7rem;}
#subVisual .subcatch1 p span.sf{font-size: 1.5rem;}


.subVisualInner.massageTtl .subcatch2{
    top: 2%;
    right:4%;
    font-size: 2.2rem;
    }
.subVisualInner.massageTtl .subcatch2 span{
    padding: 10px 10px;
    }
.subVisualInner.massageTtl .cate,
.subVisualInner.massageTtl .cate2{
    font-size: 1.4rem;
    margin-bottom: 10px;
    }

#subVisual .subcatch3 .loop_text {/*font-size:6.0rem;*/}     
    
}
/* SP */
@media screen and (max-width: 480px) {
    #subVisual{padding: 70px 0 40px;}
    .subVisualInner {height: 97vw;}
    #subVisual .subcatch3 {bottom: 4%;}
}

/* subcon
---------------------------------------------------------------------------*/
#mainBox.subcon{
    font-size: 1.8rem;
    /* background: url("../img/cmn/subbg.jpg")repeat-y top center; */
    background: url("../img/cmn/subbg.webp")repeat-y top center;
    /* background-size: cover; */
    background-size: contain;
    }
#mainBox.subcon .cntInner{
    /*max-width: 1430px;*/
    width: 72%;
    margin: 0 auto;
    padding: 0;
    }
#mainBox.subcon section{padding: 11% 0;}
#mainBox.subcon p{
    font-family: var(--ff-main);
    /* font-size:1.8rem; */
    font-size:1.4rem;
    /* font-weight: 500; */
    font-weight: 400;
    line-height: 1.9;
    letter-spacing: .075em;
    text-align: justify;
    font-feature-settings: "palt";
    }
#mainBox.subcon p.lead{
    font-size: 1.6rem;
    }
#mainBox.subcon p.tips{font-size:1.2rem;letter-spacing: 0;}
#newenergy03 p.tips,
#newenergy04 p.tips{margin-top: 10px;}
#mainBox.subcon ._Title02_sub{
    /*font-size: 5.0rem;*/
    font-size: calc(100vw / 38);
    font-family: var(--ff-en);
    text-transform: uppercase;
    }

#mainBox.subcon p.point{
    /*font-size: 2.9rem;*/
    /* font-size: calc(100vw / 58);
    font-size: calc(100vw / 95); */
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.5;
    }


/* TAB */
@media screen and (max-width: 780px) {
#mainBox.subcon{
    font-size: 1.6rem;
    background-size: contain;
    }
#mainBox.subcon .cntInner{
    width: 80%;
    }    
#mainBox.subcon section{padding: 100px 0;} 
#mainBox.subcon p{
    font-size:1.6rem;
    line-height: 1.8;
    }
#mainBox.subcon ._Title02_sub{
    font-size: 2.5rem;
    }
#mainBox.subcon p.point{
    font-size: 1.8rem;
    line-height: 1.5;
    }
}
/* SP */
@media screen and (max-width: 480px) {
#mainBox.subcon{font-size: 1.4rem;}
#mainBox.subcon .cntInner{width: 92%;}   
#mainBox.subcon section{padding: 50px 0;}
#mainBox.subcon p{
    font-size:1.4rem;
    line-height: 1.7;
    letter-spacing: .05em;
    }
#mainBox.subcon p.lead{
    padding: 10px 0;
    }    
}


/* topmessage
---------------------------------------------------------------------------*/
#mainBox.subcon.topmessage{
    background-size: cover;
    }
#massage01,
#massage03{
    position: relative;
    overflow: hidden;
    }
#massage01::after,
#massage03::after{
    position: absolute;
    content: "";
    background: url("../img/topmessage/img01.jpg")no-repeat top center;
    background-size: contain;
    top: 180px;
    right: 0;
    width: 50%;
    height: 700px;
    }
#massage03::after{
    background: url("../img/topmessage/img02.jpg")no-repeat top center;
    background-size: contain;
    }
#mainBox.subcon #massage01 .cntInner,
#mainBox.subcon #massage03 .cntInner{position: relative;z-index: 2;}
#mainBox.subcon #massage01 .cntInner p,
#mainBox.subcon #massage03 .cntInner p{padding-right: 55%;}

#massage02,
#massage04{position: relative;}
#massage02::after,
#massage04::after{
    position: absolute;
    content: "";
    background: rgba(229,1,17,0.8);
    /* top: 20px; */
    top: 15%;
    left: 0;
    width: 90%;
    /* height: 100%; */
    height: 75%;
    }
#mainBox.subcon #massage02 .cntInner,
#mainBox.subcon #massage04 .cntInner{position: relative;z-index: 2;}
#mainBox.subcon #massage02 .cntInner p,
#mainBox.subcon #massage04 .cntInner p{
    color: #fff;
    /* padding-right: 20%; */
    padding-right: 10%;
    }

/* TAB */
@media screen and (max-width: 780px) {
#mainBox.subcon.topmessage{background-size: contain;}    
#massage01,
#massage03{
    position: static;
    }
#massage01::after,
#massage03::after{
    position: static;
    display: none;
    }
#massage03::after{
    position: static;
    display: none;
    }
#mainBox.subcon #massage01 .cntInner p,
#mainBox.subcon #massage03 .cntInner p{padding-right: 0}
    #massage01 .cntImg{padding: 30px 0 0 30px}
    #massage03 .cntImg{padding: 30px 0 0 30px}
    #massage03  ._Title02.massageTit{margin-top: -20px;}
#massage02::after,
#massage04::after{
    top: 0;
    width: 100%;
    height: 100%;
    }
#mainBox.subcon #massage02 .cntInner p,
#mainBox.subcon #massage04 .cntInner p{
    color: #fff;
    padding-right: 0;
    }
    
    
}
/* SP */
@media screen and (max-width: 480px) {}



/* strength
---------------------------------------------------------------------------*/
#strength01 .cntImg{
    /* margin-top: 100px;
    padding: 0 20px 0; */
    margin: 100px auto 0;
    padding: 0 3% 0;
    max-width: 1920px;
    }
#strength02 .cntBox{
    margin-top: 60px;
    background: #fff;
    padding: 45px;
    box-sizing: border-box;
    display: flex;
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    flex-wrap:         wrap;
    justify-content:space-between;
    }
#strength02 .cntBox p{
    display: block;
    width: 58%;
    }
#strength02 .cntBox .cntImg{width: 35%;}
#strength03 .cntBox{
    margin-top: 100px;
    background: #fff;
    padding: 60px;
    box-sizing: border-box;
    }
#strength03 .cntBox .cntImg{margin:0 auto 30px;text-align: center;}
#strength03 .cntBox p{max-width: 950px;margin: auto;}

/* TAB */
@media screen and (max-width: 780px) {
#strength01 .cntImg{margin-top: 40px;}
#strength02 .cntBox{
    margin-top: 40px;
    padding: 25px;
    }
#strength02 .cntBox p{width: 100%;}
#strength02 .cntBox .cntImg{width:100%;max-width: 250px;text-align: center;margin:20px auto 0}
#strength03 .cntBox{
    margin-top: 40px;
    padding: 25px;
    }
}
/* SP */
@media screen and (max-width: 480px) {}



/* businessfield
---------------------------------------------------------------------------*/
#mainBox.subcon.businessfield{
    background-size: cover;
    }
#mainBox.subcon.businessfield .cntInner{
    width: 55%;
    text-align: center;
    }
#mainBox.subcon #field01{
    padding: 5% 0;
    color: #fff;
    /*font-size: 3.8rem;*/
    /* font-size: calc(100vw / 46); */
    /* font-size: calc(100vw / 96); */
    font-size: 1.8rem;
    font-weight: 400;
    text-align: justify;
    font-feature-settings: "palt";
    }
#field02 .cntImg{margin-bottom: 150px;}
#field02 .cntDiv{
    margin-top: 60px;
    background: #fff;
    }
#field02 .cntDiv .ttl{
    display: table;
    width: 100%;
    vertical-align: middle;
    }
#field02 .cntDiv .ttl span{
    display: table-cell;
    /* width: 12%; */
    width: 8%;    
    text-align: center;
    /* padding: 2% 2%; */
    padding: 0.5%;
    box-sizing: border-box;
    vertical-align: middle;
    }
#field02 .cntDiv .ttl span img{width: 100%;}
#field02 .cntDiv .ttl h3{
    display: table-cell;
    width: 82%;
    background: #f8cb56;
    color: #fff;
    /* padding: 2% 4%; */
    padding: 1% 3%;
    box-sizing: border-box;
    vertical-align: middle;
    /*font-size: 3.8rem;*/
    /* font-size: calc(100vw / 26); */
    font-size: calc(90vw / 42);
    font-weight: 400;
    }
#field02 .cntDiv .ttl.ttl-field02 h3{background: #93b159;}
#field02 .cntDiv .ttl.ttl-field03 h3{background: #2596a4;}
#field02 .cntDiv .ttl.ttl-field04 h3{background: #325f89;}
#field02 .cntDiv .ttl.ttl-field05 h3{background: #b7639f;}

#field02 .cntDiv p{
    display: block;
    padding: 40px;
    box-sizing: border-box;
    }

/* TAB */
@media screen and (max-width: 780px) {
#mainBox.subcon.businessfield{
    background-size: contain;
    }
#mainBox.subcon.businessfield .cntInner{
    width: 80%;
    }
#mainBox.subcon #field01{
    padding: 50px 0;
    font-size: 1.8rem;
    }
#field02 .cntImg{margin-bottom: 60px;}
#field02 .cntDiv{
    margin-top: 20px;
    }
#field02 .cntDiv .ttl span{
    width: 14%;
    padding: 14px 10px;
    }
#field02 .cntDiv .ttl h3{
    width: 86%;
    padding: 8px 20px;
    font-size: 2.5rem;
    }

#field02 .cntDiv p{padding: 25px;} 
    
}
/* SP */
@media screen and (max-width: 480px) {
    #field02 .cntDiv .ttl.ttl-field02 h3,
    #field02 .cntDiv .ttl.ttl-field03 h3,
    #field02 .cntDiv .ttl.ttl-field04 h3,
    #field02 .cntDiv .ttl.ttl-field05 h3{
        font-size: 5.5vw;
    }
    #field02 .cntDiv .ttl span{
    padding: 2%;
    }
}


/* newenergy
---------------------------------------------------------------------------*/
#mainBox.subcon .faq_ttl{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap:         wrap;
    justify-content:flex-start;
    align-content: center;
    align-items: center;
    margin-bottom: 1%;
    }
#mainBox.subcon .faq_ttl ._Title02_sub{
    font-size: 9.7rem;
    margin-right: 20px;
    }
#mainBox.subcon .faq_ttl ._Title02{margin: 0;}
#mainBox.subcon #newenergy01 .faq_ttl{margin-bottom: 4%}

#newenergy01 .cntList,
#newenergy03 .cntList{
    background: #fff;
    padding: 3%;
    box-sizing: border-box;
    margin-top: 40px;
    }
#newenergy01 .cntList .cntBox,
#newenergy03 .cntList .cntBox{width: 55%;}
#newenergy01 .cntList .cntImg,
#newenergy03 .cntList .cntImg{width: 40%;}

#newenergy03 .cntList ._Title03 .ttl{padding: 0 0 20px 20px;}


#newenergy02 .cntBox,
#newenergy04 .cntBox{
    background: #fff;
    padding: 3%;
    box-sizing: border-box;
    margin-top: 40px;
    }

#newenergy01 ._Title03 .nm,
#newenergy03 ._Title03 .nm{width: 15%;}
#newenergy01 ._Title03 .nm strong,
#newenergy03 ._Title03 .nm strong{
    padding: 18% 15%;
    font-size: calc(100vw / 40);
    }
#newenergy01 ._Title03 .ttl,
#newenergy03 ._Title03 .ttl{
    width: calc(100% - 15%);
    font-size: calc(100vw / 38);
    padding:0 0 0 4%;
    }


@media screen and (max-width: 1450px) {
#mainBox.subcon .faq_ttl ._Title02_sub{
    font-size: calc(100vw / 15);
    } 
}
/* TAB */
@media screen and (max-width: 780px) {
#mainBox.subcon .faq_ttl{
    margin-bottom: 40px;
    }
#mainBox.subcon .faq_ttl ._Title02_sub{
    font-size: 2.8rem;
    margin-right: 10px;
    }
#mainBox.subcon .faq_ttl ._Title02{font-size: 2.5rem;}

#newenergy01 .cntList,
#newenergy03 .cntList{
    padding: 25px;
    margin-top:20px;
    }
#newenergy01 .cntList .cntBox,
#newenergy03 .cntList .cntBox{width: 100%;}
#newenergy01 .cntList .cntImg,
#newenergy03 .cntList .cntImg{width: 100%;margin-top: 20px;}

    
#newenergy03 .cntList ._Title03 .ttl,
#newenergy04 .cntBox ._Title03 .ttl{padding: 0 0 10px 20px;}

#newenergy02 .cntBox,
#newenergy04 .cntBox{
    padding: 25px;
    margin-top: 20px;
    }
    
#newenergy01 ._Title03 .nm,
#newenergy03 ._Title03 .nm{width: 60px;}
#newenergy01 ._Title03 .nm strong,
#newenergy03 ._Title03 .nm strong{
    padding: 10px 2px;
    font-size: 3.0rem;
    }
#newenergy01 ._Title03 .ttl,
#newenergy03 ._Title03 .ttl{
    width: calc(100% - 60px);
    font-size: 5.9vw;
    padding-left: 10px;
    }
    
}
/* SP */
@media screen and (max-width: 480px) {
    #newenergy03 .cntList ._Title03 .ttl,
    #newenergy04 .cntBox ._Title03 .ttl,
    #mainBox.subcon .faq_ttl ._Title02{
        font-size: 5.1vw;
    }
}

/* 小さいスマホ用 */
@media screen and (max-width: 380px) {
    #newenergy03 .cntList .cntBox p{
        text-align: start;
    }
}


/* works
---------------------------------------------------------------------------*/
#works02 .cntList{margin-top: 1%;}
#works02 .cntList li{
    background: #fff;
    padding: 3%;
    width: 49%;
    margin: 1% 0;
    }
#works02 .cntList li h4{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap:         wrap;
    justify-content:flex-start;
    align-content: center;
    align-items: center;
    width: 100%;
    margin-bottom: 10px;
    }
#works02 .cntList li h4 img{width: 8%;}
#works02 .cntList li h4 span{
    display: block;
    width: 92%;
    /*font-size: 2.6rem;*/
    font-size: calc(100vw / 60);
    letter-spacing: 0;
    padding-left: 10px;
    box-sizing: border-box;
    line-height: 1.2;
    }

/* TAB */
@media screen and (max-width: 780px) {
#works02 .cntList{margin-top: 20px;}
#works02 .cntList li{
    padding: 25px;
    width: 100%;
    margin: 1% 0;
    }

#works02 .cntList li h4 img{width: 10%;}
#works02 .cntList li h4 span{
    width: 90%;
    font-size: 2.2rem;
    padding-left: 15px;
    }
    
}
/* SP */
@media screen and (max-width: 480px) {
    #works02 .cntList li h4 span{
    font-size: 5.5vw;
    }
}


/* works interview
---------------------------------------------------------------------------*/

#massage01.interview01::after{
    background: url("../img/works/interview01_01.jpg")no-repeat top center;
    background-size: contain;
    }
#massage03.interview01::after{
    background: url("../img/works/interview01_02.jpg")no-repeat top center;
    background-size: contain;
    }
#massage01.interview02::after{
    background: url("../img/works/interview02_01.jpg")no-repeat top center;
    background-size: contain;
    }
#massage03.interview02::after{
    background: url("../img/works/interview02_02.jpg")no-repeat top center;
    background-size: contain;
    }
#massage01.interview03::after{
    background: url("../img/works/interview03_01.jpg")no-repeat top center;
    background-size: contain;
    }
#massage03.interview03::after{
    background: url("../img/works/interview03_02.jpg")no-repeat top center;
    background-size: contain;
    }
#massage01.interview04::after{
    background: url("../img/works/interview04_01.jpg")no-repeat top center;
    background-size: contain;
    }
#massage03.interview04::after{
    background: url("../img/works/interview04_02.jpg")no-repeat top center;
    background-size: contain;
    }
#massage01.interview05::after{
    background: url("../img/works/interview05_01.jpg")no-repeat top center;
    background-size: contain;
    }
#massage03.interview05::after{
    background: url("../img/works/interview05_02.jpg")no-repeat top center;
    background-size: contain;
    }
#massage01.interview06::after{
    background: url("../img/works/interview06_01.jpg")no-repeat top center;
    background-size: contain;
    }
#massage03.interview06::after{
    background: url("../img/works/interview06_02.jpg")no-repeat top center;
    background-size: contain;
    }
#mainBox.subcon section#massage05{padding: 14% 0 0;}
#massage06 h3{
    color:var(--c-base);
    font-family: var(--ff-en);
    text-transform: uppercase;
    margin-bottom: 3%;
    /*font-size: 3.5rem;*/
    font-size: calc(100vw / 45);
    }
#massage06 ul{
    width: 73%;
    margin: 0 auto;
    }
#massage06 li{width: 18%;}
#massage06 li .inf{margin-top: 1%;}
#massage06 li .inf .nm{
    font-family: var(--ff-en);
    /*font-size: 4.2rem;*/
    font-size: calc(100vw / 33);
    letter-spacing: 0;
    line-height: 1.0;
    }
#massage06 li .inf .cate,
#massage06 li .inf .cate2{
    /*font-size: 1.6rem;*/
    font-size: calc(100vw / 95);
    letter-spacing: 0;
    padding: 2px 10px;
    margin-left: 10px;
    background: #ed4d58;
    color: #fff;
    }
#massage06 li .inf .cate2{background: #03649a;}
#mainBox.subcon #massage06 li p{
    line-height: 1.3;
    /*font-size: 2.0rem;*/
    font-size: calc(100vw / 65);
    letter-spacing: 0;
    }
#mainBox.subcon #massage06 li p span{
    /*font-size: 1.4rem;*/
    font-size: calc(100vw / 105);
    letter-spacing: 0;
    }


@media screen and (max-width: 1113px) {
    #massage06 li .inf .nm{display: block;margin-bottom: -5px;}
    #massage06 li .inf .cate,
    #massage06 li .inf .cate2{margin-left: 0;}
}
/* TAB */
@media screen and (max-width: 780px) {
#mainBox.subcon section#massage05{padding: 50px 0 0;}
#mainBox.subcon section#massage06{padding: 30px 0 50px} 
 
#massage06 h3{font-size: 2.2rem;}
#massage06 ul{width: 100%; }
#massage06 li{padding:0 4%;max-width: 210px!important;}
#massage06 li .inf .nm{
    font-size: 4.0rem;
    display: inline;
    margin-bottom: 0;
    }
#massage06 li .inf .cate,
#massage06 li .inf .cate2{font-size: 1.6rem;margin-left: 10px;}
#mainBox.subcon #massage06 li p{font-size: 2.0rem;}
#mainBox.subcon #massage06 li p span{font-size: 1.4rem;}  
}


/* SP */
@media screen and (max-width: 480px) {}





/* special crosstalk
---------------------------------------------------------------------------*/

#mainBox.subcon section#crosstalk01{
    margin-top: 10%;
    padding: 8% 0;
    position: relative;
    color: #fff;
    }
#crosstalk01::after {
    position: absolute;
    content: "";
    background: rgba(229,1,17,0.8);
    top: 0;
    left: 0;
    width: 96%;
    height: 100%;
    }
#crosstalk01 .cntInner{
    position: relative;
    z-index: 2;
    display: flex;
    justify-content:flex-start;
    }
#crosstalk01 .cntInner h3{
    width: 5%;
    line-height: 1.1;
    writing-mode: vertical-rl;
    font-family: var(--ff-en);
    /*font-size: 5.0rem;*/
    font-size: calc(100vw / 32);
    }
#crosstalk01 .cntInner .cntImg{
    width: 82%;
    box-sizing: border-box;
    padding-left: 10%;
    }

#crosstalk02 .cntBox,#story01 .cntBox{
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap:         wrap;
    justify-content:space-between;
    width: 100%;
    margin-bottom: 40px;
    }
#crosstalk02 .cntBox .cntImg,#story01 .cntBox .cntImg{
    width:62px;
    text-align: center;
    color: var(--c-main);
    }
#crosstalk02 .cntBox .cntImg p,#story01 .cntBox .cntImg p{
    text-align: center;
    }    
#crosstalk02 .cntBox .cntText,#story01 .cntBox .cntText{
    width: calc(100% - 75px);
    }


#mainBox.subcon .crosstalkInner .cntInner{
    padding-right: 41%;
    overflow: hidden;
    margin-bottom: 2%;
    }
#mainBox.subcon .crosstalkInner.talk01_02 .cntInner,
#mainBox.subcon .crosstalkInner.talk02_02 .cntInner,
#mainBox.subcon .crosstalkInner.project02 .cntInner,
#mainBox.subcon .crosstalkInner.project04 .cntInner{padding-right: 0;padding-left: 41%;}
#mainBox.subcon .crosstalkInner .cntBox{max-width: 620px;}
#mainBox.subcon .crosstalkInner.talk01_02 .cntBox,
#mainBox.subcon .crosstalkInner.talk02_02 .cntBox,
#mainBox.subcon .crosstalkInner.project02 .cntBox,
#mainBox.subcon .crosstalkInner.project04 .cntBox{float: right;}

#mainBox.subcon .crosstalkInner.talk01_01{
    background: url("../img/crosstalk/img01_01.jpg")no-repeat top right /50%;
    }
#mainBox.subcon .crosstalkInner.talk01_02{
    background: url("../img/crosstalk/img01_02.jpg")no-repeat top left /50%;
    }
#mainBox.subcon .crosstalkInner.talk01_03{
    background: url("../img/crosstalk/img01_03.jpg")no-repeat top right /50%;
    }
#mainBox.subcon .crosstalkInner.talk02_01{
    background: url("../img/crosstalk/img02_01.jpg")no-repeat top right /50%;
    }
#mainBox.subcon .crosstalkInner.talk02_02{
    background: url("../img/crosstalk/img02_02.jpg")no-repeat top left /50%;
    }
#mainBox.subcon .crosstalkInner.talk02_03{
    background: url("../img/crosstalk/img02_03.jpg")no-repeat top right /50%;
    }
#mainBox.subcon .crosstalkInner.project01{
    background: url("../img/projectstory/img01.jpg")no-repeat top right /50%;
    }
#mainBox.subcon .crosstalkInner.project02{
    background: url("../img/projectstory/img02.jpg")no-repeat top left /50%;
    }
#mainBox.subcon .crosstalkInner.project03{
    background: url("../img/projectstory/img03.jpg")no-repeat top right /50%;
    }
#mainBox.subcon .crosstalkInner.project04{
    background: url("../img/projectstory/img04.jpg")no-repeat top left /50%;
    }
.question02,.question03,.question04{margin-top: 100px;}

/* TAB */
@media screen and (max-width: 780px) {
#mainBox.subcon section#crosstalk01{
    }
#crosstalk01::after {
    width: 100%;
    }
#crosstalk01 .cntInner h3{
    width: 22px;
    font-size: 2.0rem;
    line-height: 1.1;
    }
#crosstalk01 .cntInner .cntImg{
    width: calc(100% - 22px);
    padding: 0 0 20px 10%;
    box-sizing: border-box;
    }


#mainBox.subcon .crosstalkInner .cntInner{padding-right: 0;}
#mainBox.subcon .crosstalkInner.talk01_02 .cntInner,
#mainBox.subcon .crosstalkInner.talk02_02 .cntInner,
#mainBox.subcon .crosstalkInner.project02 .cntInner,
#mainBox.subcon .crosstalkInner.project04 .cntInner{padding-left: 0;}
#mainBox.subcon .crosstalkInner .cntBox{max-width: 100%;}
#mainBox.subcon .crosstalkInner.talk01_02 .cntBox,
#mainBox.subcon .crosstalkInner.talk02_02 .cntBox,
#mainBox.subcon .crosstalkInner.project02 .cntBox,
#mainBox.subcon .crosstalkInner.project04 .cntBox{float: none;}

#mainBox.subcon .crosstalkInner.talk01_01{
    background: none;
    }
#mainBox.subcon .crosstalkInner.talk01_02{
    background: none;
    }
#mainBox.subcon .crosstalkInner.talk01_03{
    background: none;
    }
#mainBox.subcon .crosstalkInner.talk02_01{
    background: none;
    }
#mainBox.subcon .crosstalkInner.talk02_02{
    background: none;
    }
#mainBox.subcon .crosstalkInner.talk02_03{
    background: none;
    }
#mainBox.subcon .crosstalkInner.project01{
    background: none;
    }
#mainBox.subcon .crosstalkInner.project02{
    background: none;
    }
#mainBox.subcon .crosstalkInner.project03{
    background: none;
    }
#mainBox.subcon .crosstalkInner.project04{
    background: none;
    }
.question02,.question03,.question04{margin-top: 50px;}    
    
.talk_img01{padding: 0 0 0 40px}
.talk_img02{padding: 0 40px 0 0}   
.talk_img03{padding: 40px 40px 0 0}    
}
/* SP */
@media screen and (max-width: 480px) {}


/* special projectstory
---------------------------------------------------------------------------*/
#story02 .cntImg{
    background: #fff;
    text-align: center;
    padding: 55px 20%;
    margin: 60px 0;
    }
#story02 .cntDiv{background: #d1d1d1;text-align: center;}

/* TAB */
@media screen and (max-width: 780px) {
#story02 .cntImg{
    padding: 25px;
    margin: 40px 0;
    }
}
/* SP */
@media screen and (max-width: 480px) {}




/* special questionnaire
---------------------------------------------------------------------------*/
#questionnaire ul{overflow: hidden;}
#questionnaire li{
    width: 49%;
    float: left;
    margin-top: 2%;
    text-align: center;
    }
#questionnaire li:nth-child(2n){float: right;}
#questionnaire li:nth-child(2){margin-top: 30%}

#questionnaire .cntImg{margin-top: 80px;}

/* TAB */
@media screen and (max-width: 780px) {
#questionnaire ul{overflow: hidden;}
#questionnaire li{
    width: 100%;
    float: none;
    margin-top: 4%;
    }
#questionnaire li:nth-child(2n){float: none;}
#questionnaire li:nth-child(2){margin-top:4%}

#questionnaire .cntImg{margin-top: 40px;}
}
/* SP */
@media screen and (max-width: 480px) {}




/* education
---------------------------------------------------------------------------*/
#mainBox.subcon.education p.point {
        font-size: 2rem;
    }
#education .cntBox{
    margin-top: 60px;
    background: #fff;
    padding: 40px;
    box-sizing: border-box;
    }
#education .cntBox h4{
    color: var(--c-main);
    /*font-size: 3.5rem;*/
    /* font-size: calc(100vw / 37); */
    font-size: calc(100vw / 46);
    font-weight: 500;    
    margin-bottom: 10px;
    }
#education .cntBox .cntImg{margin-top: 60px;}
/* TAB */
@media screen and (max-width: 780px) {
#education .cntBox{
    margin-top: 30px;
    padding: 25px;
    }
#education .cntBox h4{font-size: 2.3rem;}
#education .cntBox .cntImg{margin-top: 20px;}
    
/*.subcon .scroll{overflow: auto;white-space: nowrap;}
.subcon .scroll .cntImg{width: 780px;}
.subcon .scroll::-webkit-scrollbar{height: 5px;}
.subcon .scroll::-webkit-scrollbar-track{background: #F1F1F1;}
.subcon .scroll::-webkit-scrollbar-thumb {background: #BCBCBC;}*/

.scroll-img {
    max-width: 100%;
    white-space: nowrap;
    }
.scroll-img table {
    border-collapse: collapse;
    width: 700px;
    }  
    
}
/* SP */
@media screen and (max-width: 480px) {}



/* benefits
---------------------------------------------------------------------------*/
#mainBox.subcon.benefits{
    background-size: cover;
    }
#mainBox.subcon.benefits p.point {
        font-size: 2rem;
    }
#benefits .cntBox{margin-top: 80px;}
#benefits .cntBox ._Title02_sub{
    margin-bottom: 50px;
    padding-left: 60px;
    }
#benefits .cntBox .cntDiv{
    background: #fff;
    padding: 5% 60px 60px;
    position: relative;
    }
#benefits .cntBox .cntDiv h4{
    position: absolute;
    top: -40px;
    left: 60px;
    }
#benefits .cntBox:nth-child(4) .cntDiv{
    padding-top: 14%;
    }
#benefits .cntBox .cntDiv p{
    display: block;
    padding-top: 20px;
    }
/* #benefits .cntBox .cntDiv ul{margin-top: 20px;} */
#benefits .cntBox .cntDiv ul li{
    width: 50%;
    font-size: 1.4rem;
    /* font-weight: 500; */
    font-weight: 400;
    padding-top: 5px;
}

/* TAB */
@media screen and (max-width: 780px) {
#mainBox.subcon.benefits{background-size: contain;}    
#benefits .cntBox{margin-top: 40px;}
#benefits .cntBox ._Title02_sub{
    margin-bottom: 50px;
    padding-left: 25px;
    }
#benefits .cntBox .cntDiv{
    padding: 25px 25px 25px;
    }
#benefits .cntBox .cntDiv h4{
    position: absolute;
    top: -40px;
    left: 25px;
    }
#benefits .cntBox:nth-child(4) .cntDiv{
    padding-top: 70px;
    }
#benefits .cntBox .cntDiv p{
    padding-top: 10px;
    }
#benefits .cntBox .cntDiv ul{margin-top: 5px;}
#benefits .cntBox .cntDiv ul li{width:100%;}  
}
/* SP */
@media screen and (max-width: 480px) {
    #benefits .cntBox .cntDiv h4{left: 10px;}
}





/* newgraduate
---------------------------------------------------------------------------*/
#newgraduate .cntLink{margin-bottom: 100px;}
#newgraduate .cntLink li{
    width: 32%;
    }
#newgraduate .cntLink li a{
    display: block;
    width: 100%;
    border-radius: 100px;
    background: #ed4d59;
    color: #fff;
    text-align: center;
    padding:5% 0;
    }
#newgraduate .cntLink li a span{
    display: block;
    background: url("../img/newgraduate/arw01.png")no-repeat center bottom;
    background-size: 8%;
    padding-bottom: 9%;
    font-size: calc(100vw / 85);
    }
#newgraduate .cntBox{
    background: #fff;
    padding: 55px;
    box-sizing: border-box;
    margin-bottom: 80px;
    }
#newgraduate ._Title02 span{background: #ed4d59;}
#newgraduate ._Title02#job02{margin-top: 100px;}
#newgraduate .defTable01{
    width: 100%;
    border: none;
    border-collapse: collapse;
    }
#newgraduate .defTable01 th {
    /* width: 180px; */
    width: 150px;
    padding:50px 0;
    margin: 0;
    text-align: left;
    vertical-align: top;
    font-size:1.4rem;
    font-weight: 600;
    line-height: 1.7;
    border-bottom: 1px solid #919191;
    background: #fff;
    }
#newgraduate .defTable01 th span{
    background: #ed4d59;
    color: #fff;
    /* padding: 2px 10px; */
    padding: 2px 5px;
    font-weight: 400;
    display: block;
    text-align: center;
    }
#newgraduate .defTable01 td {
    padding:50px 25px;
    margin: 0;
    text-align: left;
    vertical-align: top;
    font-size:1.4rem;
    font-weight: 400;
    line-height: 1.7;
    border-bottom: 1px solid #919191;
    background:#fff;
    }
#newgraduate .defTable01 td a{
    color: #e6535d;
    border-bottom: 1px solid #000000;
    }
#newgraduate .defTable01 tr:last-child th,
#newgraduate .defTable01 tr:last-child td{border: none;}
#newgraduate .defTable01 dl{display: table;}
#newgraduate .defTable01 dt{display: table-cell;}
#newgraduate .defTable01 dd{display: table-cell;}

#faq{background: #f17279;}
#faq ._Title02 span{background: #fff;color: #ee4f53;}
#faq .cntBox{
    background: #fff;
    padding: 55px;
    box-sizing: border-box;
    margin-top: 40px;
    }

#faq .cntBox dt,#faq .cntBox dd{
    position: relative;
    padding:20px 0 20px 90px;
    margin-bottom: 50px;
    font-size: 1.8rem;
    font-weight: 500;
    }
#faq .cntBox dd{margin-bottom: 0;}
#faq .cntBox dd a{
    color: #e6535d;
    border-bottom: 1px solid #000000;
    }
#faq .cntBox dt::before,
#faq .cntBox dd::before{
    position: absolute;
    content: "Q";
    background: #4a4a4a;
    color: #fff;
    width: 65px;
    height: 65px;
    text-align: center;
    top: 0;
    left: 0;
    font-size: 3.8rem;
    font-family: var(--ff-en);
    }
#faq .cntBox dd::before{
    content: "A";
    background: #ed4d59; 
    }

/* TAB */
@media screen and (max-width: 780px) {
#newgraduate .cntLink{display: none;}

#newgraduate .cntBox{
    padding: 15px;
    margin-bottom: 40px;
    }
#newgraduate ._Title02#job02{margin-top: 100px;}
#newgraduate .defTable01{
    width: 100%;
    border: none;
    border-collapse: collapse;
    }
#newgraduate .defTable01 th {
    display: block;
    width: 100%;
    padding:15px 0 10px;
    font-size:1.6rem;
    border-bottom:none;
    }
#newgraduate .defTable01 td {
    display: block;
    width: 100%;
    padding:0 0 15px;
    font-size:1.6rem;
    border-bottom: 1px solid #919191;
    }
#newgraduate .defTable01 tr:last-child th,
#newgraduate .defTable01 tr:last-child td{border: none;}



#faq .cntBox{
    padding: 15px;
    margin-top: 20px;
    }

#faq .cntBox dt,#faq .cntBox dd{
    padding:8px 0 10px 55px;
    margin-bottom: 20px;
    font-size: 1.6rem;
    }
#faq .cntBox dd{margin-bottom: 0;}
#faq .cntBox dt::before,
#faq .cntBox dd::before{
    width: 40px;
    height: 40px;
    font-size: 2.5rem;
    }

    
    
}
/* SP */
@media screen and (max-width: 480px) {
    #newgraduate ._Title02 span{font-size: 5.5vw;}
}









/* pagenavi
--------------------------------------------------*/
.subcon .wp-pagenavi {
    margin:100px auto 0;
    font-size: 1.6rem;
    text-align: center;
    font-family: var(--ff-main);
    font-weight: 600;
    }
.subcon .wp-pagenavi a {color:var(--c-main);}
.subcon .pages {margin-right: 20px;}
.subcon .wp-pagenavi .current,
.subcon .wp-pagenavi a.page {
    margin: 0 6px 6px 0;
    display: inline-block;
    border: solid 2px var(--c-main);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    line-height: 40px;
    text-align: center;
    transition: 0.7s;
    }
.subcon .wp-pagenavi .current {
    border: none;
    background: var(--c-main);
    color: #fff;
    }
.subcon .wp-pagenavi a.page:hover {
    background: var(--c-main);
    color: #fff;
    }
.subcon .wp-pagenavi .first,
.subcon .wp-pagenavi .extend {margin-right: 10px;}
.subcon .wp-pagenavi span.pages,
.subcon .wp-pagenavi .previouspostslink,
.subcon .wp-pagenavi .nextpostslink {display: none;}
.subcon .pagenation{}
.subcon .pagenation .pagenation_content {
    margin:100px auto 0;
    width: 100%;
    text-align: center;
    position: relative;
    font-family:var(--ff-main);
    font-size: 1.5rem;
    font-weight: 600;
    }
.subcon .pagenation .pagenation_content span {
    width: 15%;
    min-width: 60px;
    color: #fff;
    transition: all 0.35s ease;
    background: var(--c-main);
    padding: 10px 10px;
    }
.subcon .pagenation .pagenation_content a {
    width: 15%;
    text-align: center;
    min-width: 60px;
    border: solid 2px var(--c-main);
    background: var(--c-main);
    color:#fff;
    transition: all 0.35s ease;
    padding: 10px 10px;
    }
.subcon .pagenation .pagenation_content a:hover {background:#fff; color:var(--c-main);}
.subcon .pagenation .pagenation_content .prev:after {left: 0px;}
.subcon .pagenation .pagenation_content .all {
    left: 0;
    right: 0;
    width: 26%;
    margin: auto;
    }
.subcon .pagenation .pagenation_content .next {right: 0px;}


/* TAB */
@media screen and (max-width: 780px) {}

/* SP */
@media screen and (max-width: 480px) {
.subcon .wp-pagenavi {
    margin:50px auto 0;
    font-size: 1.4rem;
    }
.subcon .pagenation .pagenation_content {
    margin:50px auto 0;
    font-size: 1.4rem;
    }
}

