/* common */
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@300&display=swap');

* {
    margin: 0;
    padding: 0;
}

html {
    font-size: 62.5%;
    color: #000000;
    scroll-behavior: smooth;
    scroll-padding-top: 12rem;
    font-family: '游明朝体 Pr6N', '游明朝','sans-serif';
    font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS Ｐ明朝", "MS 明朝", serif;
    color: rgb(0, 0, 0);
    --common-width:80%;
}
body {
font-size: 1.6em;
letter-spacing: 0.05em;

}
img {
/* max-width: 100%; */
height: auto;
}
ul {
list-style: none;
}
a {
text-decoration: none;
}
h1{
    font-size: 2.8rem;
    font-weight: normal;
}
h2{
    font-weight: normal;
}




@media screen and (max-width: 520px){
    html{
        margin: 0;
        width: 100vw;
    }

    body {       
        min-width: 100%;
    }

}


/* TopPage */
/* header-logo */
.header{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 12vh;
    z-index: 999;
    box-sizing: border-box;
    overflow: hidden;
    background-color: #fff;
}
.header__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 0 2vw;
}
.header__logo {
    display: flex;
    justify-content: center;
    align-items: center;
    
}
.logo_company {
    width: 27rem;
    position: relative;
    z-index: 99;
    display: block;
}

/* header-nav */
.header_nav {
    width: 62%;
}
.header__nav--section {
    display: flex;
    width: 100%;
    padding: 0 2.8rem;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
}
.header__nav li{
    width: 50rem;
}
.header__nav--list:not(:last-child) {
    padding-right: 16px;
}
.header__nav--list-text {
    font-size: 1.6rem;
    font-weight: 500;
    color: #000000;

}




/* header-banner */

.header__banner{
    position: relative;
    background: #2d74bb;
    width: 26rem;
    height: 12vh;
    z-index: 100;
}
.header__banner--top{
    position: absolute;
    top: 1vh;
    width: 100%;
    height: 25%;
    font-size: 1.2rem;
    text-align: center;
    line-height: 3vh;
    color: #fff;
    margin: 0;
    padding: 0;
}

.header__banner--number {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    height: 50%;
    text-align: center;
    letter-spacing: 1px;
    margin: 0;
    padding: 0;

}

.header__banner--number a {
    color: #fff;
    font-size: 3rem;
    line-height: 6vh;
}

.header__banner--contact{
    position: absolute;
    bottom: 1.5vh;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    width: 100%;
    height: 25%;
    margin: 0;
    padding: 0;
}

.header__banner--bottom {
    height: 100%;
    font-size: 1.4rem;
    line-height: 3vh;
    margin: 0;
    padding-right: 2rem;

}

.header__banner--bottom a {
    color: #fff;
}




.header__mail_1--icon {
    height: 2.3vh;
    padding-right:  0.3rem;
    padding-top: 0.3rem;
}

/* ------------------ヘッダーTB--------------------------- */


@media screen and (min-width: 1366px) {
    .header__inner {
        padding: 0 0 0 2.5rem;
    }
    .header__nav--list:not(:last-child) {
        padding-right: 2rem;
    }
    .header__nav--list-text {
        font-size: 1.9rem;
    }
    .header__banner {
        width: 25rem;
    }
    .header__banner--top {
        font-size: 1.3rem;
    }
    .header__banner--number a {
        font-size: 3rem;
    }
}
@media screen and (max-width: 1090px) {
    .header__logo {
        width: 20rem;
    }
    .header__inner {
        padding: 0 0 0 2.5rem;
    }
    .header__nav--list:not(:last-child) {
        padding-right: 2rem;
    }
    .header__nav--list-text {
        padding: 0;
        font-size: 1.4rem;
    }
    .header__banner {
        width: 25rem;
    }
    .header__banner--top {
        font-size: 1.2rem;
    }
    .header__banner--number a {
        font-size: 3rem;
    }
}




/* ------------------ヘッダーSP--------------------------- */

@media screen and (max-width: 960px){

    /* header-logo */
header{
    position: relative;
    height: 7rem;
}

.header__inner {
    position: relative;
    height: 100%;
    padding: 0;
    display: block;
}

.header__logo {
    position: absolute;
    z-index: 99999;
    display: block;
    width: 60vw;
    margin: 0;
    padding: 10px;
    box-sizing: border-box;
}

.logo_company img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* header-nav */

.header_nav {
    display: none;
}

/* header-banner */

.header__banner{
    display: none;
}

/* -----ハンバーガー挿入--------- */
.header_nav {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    z-index: 10000;
    background: none;
    width: 100%;
}

.header_nav .box {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 7rem;
    height: 7rem;
    margin: 0 0 0 auto;
    background: transparent;
    z-index: 999;
}

.header_nav .box .box_hm,
.header_nav .box .box_hm::before,
.header_nav .box .box_hm::after {
    content: '';
    position: absolute;
    display: block;
    height: 0.3rem;
    width: 3rem;
    border-radius: 2px;
    background: #235a91;
    transition: .5s;
}

.header_nav .box .box_hm::before {
    bottom: 8px;
}

.header_nav .box .box_hm::after {
    top: 8px;
}

.header_nav.appear .box .box_hm {
    background: transparent;
}

.header_nav.appear .box .box_hm::before {
    bottom: 0;
    transform: rotate(45deg);
}

.header_nav.appear .box .box_hm::after {
    top: 0;
    transform: rotate(-45deg);
}

.header__nav--section {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    top: calc(-1 * (100vh - 7rem));
    left: 0;
    gap: 4rem;
    width: 100vw;
    height: 800px;
    margin: 0;
    padding: 0;
    background: none;
    transition: .5s;
    opacity: 0;
}

.header_nav.appear .header__nav--section {
    top: 7rem;
    opacity: 1;
    background: rgba(45, 116, 187, 0.9);
    transform: translateY(0);
}

.header__nav--list:not(:last-child) {
    padding-right: 0;
}

.header__nav--list:first-child {
    border-top: solid 1px #FFF;
    padding-top: 4rem;
}

.header__nav--list {
    box-sizing: border-box;
    width: 80%;
    border-bottom: solid 1px #FFF;
    text-align: center;
    padding-bottom: 4rem;
}

.header__nav--list-text {
    font-size: 1.8rem;
    font-weight: 700;
    color: #FFF;
    margin-top: 2rem;
}
}


 /* FV */
    .top{
    position: relative;
    text-align: center;
    height: 88vh;
    background-image: url(../pct/fv.jpg);
    background-size: cover;
    background-position: bottom center;
}
.top__copy{
    position: absolute;
    top: 50%;
    width: 100%;
    font-size: 3.8rem;
    font-weight: 500;
    color: #fff;
    text-align: center;
    transform: translateY(-50%);
    text-shadow: 1px 2px 3px #808080;
}

.top__copy--sp {
    display: none;
}

.top__container{
    position: absolute;
    bottom: 0;
    left: 50%;
    height: 10rem;
    width: 60rem;
    background-color: #0e62b664;
    box-shadow: 0 0 1rem 1rem #0e62b664;
    border-radius: 10rem;
    transform: translate(-50%,25%);
}

.top__container--text{
    text-align:center;
    line-height: 1rem;
    padding: 5rem;
    color: #fff;
    text-shadow: 3px 3px 3px #808080;
    font-size: 2rem;
}
.top__container--text--sp {
    display: none;
}

/* ------------------トップ　FV  SP--------------------------- */

@media screen and (min-width:1367px) {

    .top__container{
        height: 12rem;
        width: 45%;
    }
    .top__container--text {
        font-size: 2rem;
        text-shadow: 1px 2px 3px #808080;
    } 

}


@media screen and (max-width: 1366px) {
    .top__container{
        height: 11rem;
        width: 50%;
    }
    .top__container--text {
        font-size: 1.8rem;
        line-height: 1.8rem;
        text-shadow: 1px 2px 3px #808080;
    } 
}

@media screen and (max-width: 1024px) {
    .top__copy--sp {
        display: block;
    }
    .top__container--text {
        line-height: 1.5;
        padding: 2.5rem;
    }
    .top__container--text--sp {
        display: block;
    }
}

@media screen and (max-width: 720px){
    .top{
        height: 80vh;
        -o-object-fit: cover;
        object-fit: cover;
        min-width: 100%;
        background-size:cover;
    
    }
    .top__copy{
        width: 95%;
        -o-object-fit: cover;
        object-fit: cover;
        min-width: 100%;
        background-size:cover;
        font-size: 3rem;
    }
    .top__container{
        width: 85%;
    }
    .top__container--text {
        font-size: 1.7rem;
        text-shadow: 1px 2px 3px #808080;
    } 
}
    

@media screen and (max-width: 520px){
    .top{
        height: 650px;
        -o-object-fit: cover;
        object-fit: cover;
        min-width: 100%;
        background-size:cover;
    }
    .top__copy{
        width: 90%;
        font-size: 2.4rem;
        font-weight: 500;
    }
    .top__container{
        height: 6rem;
        width: 95%;
        padding-bottom: 2.7rem;
    }
    .top__container--text {
        font-size: 1.5rem;
        line-height: 1.5;
        text-shadow: 1px 2px 3px #808080;
        padding: 2.5rem;
    }
}


/* Service */


.service{
    margin: 0 auto 20rem;
    text-align: center;
    justify-content: center;
    align-items: center;  
    width: 100%;
    color: #000000;
    font-size: 1.7rem;
    background-image: url(../pct/top-service__background.jpg);
    background-size: cover;
    background-position: bottom center;
}


.service h1{
    width: 100%;
    height: 3rem;
    padding: 18rem 0 10rem 0;
}

.services {
    display: grid;
    grid-template-columns: 34rem 34rem;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10rem;
}

.services_content {
    width: 28rem;
    margin: 0;
    padding: 3rem ;
    background: #9fc2e4;
    box-shadow: 0 0 .3rem .3rem #00000030;
    border-radius: 1rem;
}

.services_content img {
    width: 95%;
    height: 150px;
}

.header__service--pct{
    width: 100%;
    height: 100%;
    object-fit: cover;
    }

.services_content h2 {
    font-size: 1.8rem;
    font-weight: 700;
    border-left: solid 4px #075aad;
    padding-left: 2rem;
    margin: 0;
    margin-top: 2rem;
    text-align: left;
}

.services_content .service__drain--text {
    width: 90%;
    background: none;
    box-shadow: none;
    font-size: 1.5rem;
    margin: auto;
    padding: 2rem 0;
    text-align: left;
}

.services_content a {
    width: 15rem;
    padding: 1rem 2rem;
    background: #fff;
    box-shadow: 3px 3px 3px #00000030, inset 3px 3px 3px transparent;
    border-radius: 3rem;
    color: #222;
    text-align: center;
    transition: box-shadow ease-in-out .3s;
}

.services_content a:hover {
    box-shadow: 3px 3px 3px transparent, inset 3px 3px 10px #00000030;
}

/* ------------------トップ　サービスSP--------------------------- */
@media screen and (min-width: 1366px) {
    .services{
        gap: 15rem;
        margin-right:5rem ;
    }

    .services_content {
    width: 35rem;
    height: 42rem;
    }

    .services_content h2 {
        font-size:2.2rem;
    }

    .services_content img {
        width: 95%;
        height: 20rem;
    }

    .services_content .service__drain--text {
        
        font-size: 1.8rem;
        margin: auto;
    }
    
    .services_content a {
        width: 18rem;
        padding: 1.3rem 4.5rem;
        background: #fff;
        color: #222;
        font-size: 2rem;
    }
            
}

@media screen and (max-width: 960px) {
    .services {
        gap: 5rem;
    }

}

@media screen and (max-width: 720px){
    /*.service{
        height: 150vh;
        
    }*/

    .service h1{
        font-size: 2rem;
        
    }

    .services {
        gap: 2rem;       
    }

    .services_content {
        width: 27rem;
        padding: 2.5rem ;
    }

}


@media screen and (max-width: 520px){
    .service{
        max-width: 100%;
        /*height: 240vh;*/
        margin: 0 auto 10rem;
    }

    .service h1{
        text-align:center;
        font-size: 2rem;
        padding:12rem 0 4rem 0;
        
    }

    .services {
        display:flex;
        flex-direction: column;
        gap: 5rem;       
    }

    .services_content {
        width: 28rem;
        padding: 2rem ;
    }

    .services_content img {
        width: 90%;
        padding-top: 1rem;
    }

    .services_content h2 {
        font-size: 1.5rem;
    }

    .services_content .service__drain--text {
        width: 85%;
        padding: 1.6rem 0;
        font-size: 1.3rem;
    }
}




/* --------------TopMessage------------------- */
.top-message{
margin: 0 auto 10rem;
padding-bottom: 10rem;
width: 100%;
width: fit-content;
background-image: url(../pct/top-message_background.jpg);
background-size: cover;
background-position: bottom center;
background-repeat: no-repeat;
}

.top-message h1{
height: 3rem;
width: 100%;
margin: 0;
padding: 20rem 0 5rem;
text-align: center;
}

.top-message__wrapper{
display: flex;
justify-content: center;
align-items: center;  
width: 100%;
color: #000000;
font-size: 1.7rem;
}

.top-message__content {
width: 40%;
padding: 7rem;
padding-left: 10rem;
font-size: 1.7rem;

}

.top-message__content--name{
display: inline-block;
width: 90%;
padding-top:6rem ;
padding-left: 25rem;
}

.top-message__content--name dd {
margin-left: 5rem;
font-size: 1.2em;
}

.top-message__img{
display: flex;
justify-content: center;
align-items: center;
width: 49%;
height: 70vh;
transform: translateX(20rem);
opacity: 0;
transition: 1s;
overflow: hidden;
}

.top_page_js .appear {
transform: translateX(0);
opacity: 1;
}

.top-message__img img {
width: 100%;
}



/* ------------------トップ　トップメッセージSP--------------------------- */


@media screen and (min-width: 1921px) {
    .top-message__content {
        font-size: 3rem;
        line-height: 5.5rem;
    }

    .top-message__img img {
        width: 85%;
    }
}
@media screen and (max-width: 1920px) {

    .top-message__wrapper{
        font-size: 1.7rem;
    }

    .top-message__content {
        font-size: 2.5rem;
        line-height: 5rem;
    }

    .top-message h1{
        height: 5rem;
        width: 100%;
        margin: 0;
        font-size: 2.5rem;
    }

    .top-message__content--name{
        display: inline-block;
        width: 90%;
        padding-top:6rem ;
        padding-left: 38rem;
        font-size: 2.2rem;
    }

}

@media screen and (max-width: 1366px) {


    .top-message__wrapper{
        display: flex;
        justify-content: center;
        align-items: center;  
        width: 100%;
        font-size: 1.7rem;
    }
    .top-message__content {
        width: 40%;
        font-size: 2rem;
    }
    .top-message h1{
        height: 5rem;
        width: 100%;
        margin: 0;
        padding-top: 5rem;
        font-size: 2.5rem;
        }
    .top-message__content--name{
        display: inline-block;
        width: 90%;
        padding-top:6rem ;
        padding-left: 32rem;
        font-size: 1.9rem;
        }
            
}
@media screen and (max-width: 960px){

    .top-message{
        margin: 0 auto;
        margin-bottom: 8rem;
        background-image: url(../pct/top-message_background.jpg);
        background-size: cover;
        background-position: bottom center;
        background-repeat: no-repeat;
        width: 100%;
    }

    .top-message h1{
        width: 100%;
        margin: 0;
        padding-bottom: 20rem;
        text-align: center;
        font-size: 2rem;
    }
    
    .top-message__wrapper{
        display: flex;
        flex-direction: column-reverse;
        gap: 0;       
        font-size: 1.5rem;
        margin-bottom: 0;
        height: 55rem;
    }
    
    .top-message__content {
        width: 75%;
        padding-bottom: 10rem;
    }

    .top-message__content--text {
        padding-top: 5rem;
        font-size: 1.6rem;
        line-height: 1.7;
    }

    .top-message__content--name{
        display:block;
        width: 100%;
        color: #000000;
        text-align: right;
        padding: 1rem 0 0 0; 
        font-size: 1.4rem;
    }

    .top-message__content--name dt {
        height: 24px;
        font-size: 1.3rem;
        margin-left: 0;
    }
    
    .top-message__content--name dd {
        height: 24px;
        font-size: 1.8rem;
        margin-left: 0;
    }
    
    .top-message__img{
        width: 100%;
        height: 30vh;
    }
    
    .top-message__img img {
        width: 70%;
    }
}

@media screen and (max-width: 720px){

    .top-message__content {
        width: 90%;
        padding: 2rem;
        padding-bottom: 10rem;
    }

    .top-message h1{
        width: 100%;
        margin: 0;
        padding-bottom: 15rem;
        text-align: center;
        font-size: 2rem;
    }

    .top-message__content--text {
        padding-top: 8rem;
        font-size: 1.6rem;
        color: #000000;
    }

    .top-message__content--name{
        display:block;
        width: 100%;
        color: #000000;
        text-align: right;
        padding: 1.5rem 0 0 0; 
        font-size: 1.4rem;
    }
    
    .top-message__content--name dd {
        font-size: 1.3rem;
        margin-left: 0;
    }
    
    .top-message__img{
        width: 100%;
        height: 35vh;
    }
    
    .top-message__img img {
        width: 80%;
    }
}


@media screen and (max-width: 520px){
    .top-message{
        margin: 0 auto;
        margin-bottom: 5rem;
        padding-bottom: 5rem;
        width: 100%;
    }

    .top-message h1{
        
        width: 100%;
        margin: 0;
        padding-bottom: 6rem;
        text-align: center;
        font-size: 2rem;
    }
    
    .top-message__wrapper{
        display: flex;
        flex-direction: column-reverse;
        gap: 0;       
        font-size: 1.5rem;
        background: none;
        margin-bottom: 0;
        height: 55rem;
    }
    
    .top-message__content {
        width: 90%;
        padding: 2rem;
        padding-bottom: 5rem;
    }

    .top-message__content--text {
        padding-top: 2rem;
        font-size: 1.5rem;
        color: #000000;
        line-height: 2;
    }

    .top-message__content--name{
        display:block;
        width: 100%;
        color: #000000;
        text-align: right;
        padding: 1.5rem 0 0 0; 
        font-size: 1.2rem;
    }

    .top-message__content--name dt {
        height: 2rem;
    }
    
    .top-message__content--name dd {
        height: 2rem;
        font-size: 1.2em;
        margin-left: 0;
    }
    
    .top-message__img{
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 40vh;
    }
    
    .top-message__img img {
        width: 100%;
    }
}





/* ------------------Company ------------------------*/

.company{
    width:70%;
    margin: 0 auto;
    margin-top: 15rem 0;
}

.company h1 {
    width: 100%;
    text-align: center;
    margin: 0;
    margin-bottom: 8rem;
}

#company__table{
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    border: solid 1px #000000;
    margin-bottom: 15rem;
}

#company__table tr{
    margin: 0;
    border-collapse: collapse;
    border: solid 1px #000000;
    font-size: 1.8rem;
}

#company__table th{
    margin: 0;
    padding: 2rem;
    border-collapse: collapse;
    border-right:solid 1px #000000 ;
    font-weight: normal;
}



#company__table td{
    margin: 0;
    padding: 2rem;
    border-collapse: collapse;
}



/* ------------------トップ会社概要　SP--------------------------- */

@media screen and (max-width: 960px){
    .wrapper {
        overflow: hidden;
    }
    
    .company{
        text-align: initial;
        margin: 0;
        margin-bottom: 10rem;
        width: 100%;
    }

    .company h1 {
        width: 100%;
        font-size: 2rem;
        text-align: center;
        padding-top: 2rem;
        margin: 0;
        margin-left: 0;
    }

    #company__table{
        margin: 0 auto;
        width: 90%;
    }

    #company__table th{
        font-size: 1.2rem;
        text-align: start;
        width: 25%;
        height: 4rem;
        padding-left: 1rem;
        border-top: solid 1px #000000;
    }

    #company__table th::after {
        display: none;
    }
        
    #company__table td{
        text-align: start;
        color: #000000;
        font-size: 1.5rem;
        width: 75%;
        height: 4rem;
        padding-left: 1.2rem;
        border-top: solid 1px #000000;
    }
    
#company__table tr:last-child th {
    border-bottom: solid 1px #000000;
    
}

#company__table tr:last-child td {
    border-bottom: solid 1px #000000;

}
}

@media screen and (max-width: 720px){
    .company h1 {
        width: 100%;
        font-size: 1.5rem;
        text-align: center;
        padding-top: 3rem;
        margin: 0;
        margin-left: 0;
        margin-bottom: 2rem;
    }
}


/* --------------------SDGs -----------------------*/

.sdgs{
    width: 100%;
}

.sdgs__wrapper{
    display: flex;
    
}

.sdgs__content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 40%;
    background-color: rgba(28, 80, 121, 0.186);
}

.sdgs__content h1{
    width: 100%;
    height: 3rem;
    text-align: center;
    line-height: 3rem;
    margin: 0;
    transform: translateX(-20rem);
    opacity: 0;
    transition: 1s;
}

.top_page_js.appear {
    transform: none;
    opacity: 1;
}

.sdgs__content--text {
    width: 60%;
    margin: 0;
    padding: 5rem 0;
    font-size: 2rem;
}

.sdgs__content--text br {
    display: none;
}

.sdgs__content a {
    width: 18rem;
    padding: 1rem;
    background: linear-gradient(#30c9cd , #330d69);
    box-shadow: 0px 5px 10px #00000030,
    0px 5px 20px #00000030,
    0px 5px 30px #00000030;
    border-radius: 3rem;
    color: #fff;
    text-align: center;
    transition: .5s;
}

.sdgs__content a:hover {
    letter-spacing: 3px;
}

.sdgs__img{
    height: 50rem;
    width: 60%;
    background:rgba(28, 80, 121, 0.186);
    overflow: hidden;
}

.sdgs__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translateX(20rem);
    opacity: 0.5;
    transition: 1s;
}

.top_page_js.appear {
    transform: none;
    opacity: 1;
}


/* ------------------トップ SDGs　SP--------------------------- */
@media screen and (min-width: 1366px) {
    .sdgs__content a {
        width: 24rem;
        padding: 14px;
        font-size: 2rem;
    }

}


@media screen and (max-width: 720px){

    .sdgs{
        position: relative;
        width: 100%;
        height: 60rem;
        margin-bottom: 5rem;
        overflow: hidden;
    }
    
    .sdgs__wrapper{
        display: block;
    }
    
    .sdgs__content {        
        position: absolute;
        top: 0;
        width: 100%;
        background-color: transparent;
        margin-bottom: 5rem;

    }
    
    .sdgs__content h1{
        width: 100%;
        height: 3rem;
        margin-bottom: 35rem;
        font-size: 2rem;
    }
    
    .sdgs__content--text{
    
        width: 80%;
        padding: 3rem 0;
        text-align: center;
        font-size: 1.6rem;
    }
    .sdgs{
        position: relative;
        width: 100%;
        height: 60rem;
        margin-bottom: 5rem;
        overflow: hidden;
    }
    
    .sdgs__wrapper{
        display: block;
    }
    
    .sdgs__content {        
        position: absolute;
        top: 0;
        width: 100%;
        background-color: transparent;
        margin-bottom: 5rem;

    }
    
    .sdgs__content h1{
        width: 100%;
        height: 3rem;
        margin-bottom: 35rem;
        font-size: 2rem;
    }
    
    .sdgs__content--text{
    
        width: 80%;
        padding: 3rem 0;
        text-align: center;
        font-size: 1.7rem;
    }
    
    .sdgs__img{
        position: absolute;
        top: 8rem;
        height: 30rem;
        width: 100%;
        overflow: hidden;
    }
    
    .sdgs__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }


}
@media screen and (max-width: 520px){
    .sdgs{
        position: relative;
        width: 100%;
        height: 60rem;
        margin-bottom: 5rem;
        overflow: hidden;
    }
    
    .sdgs__wrapper{
        display: block;
    }
    
    .sdgs__content {        
        position: absolute;
        top: 0;
        width: 100%;
        background-color: transparent;
        margin-bottom: 5rem;

    }
    
    .sdgs__content h1{
        width: 100%;
        height: 3rem;
        margin-bottom: 35rem;
        font-size: 2rem;
    }
    
    .sdgs__content--text{
    
        width: 80%;
        padding: 3rem 0;
        text-align: center;
        font-size: 1.4rem;
    }
    
    .sdgs__img{
        position: absolute;
        top: 8rem;
        height: 30rem;
        width: 100%;
        overflow: hidden;
    }
    
    .sdgs__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}


/* certification */

.certification{
width: 100%;

}

.certification__wrapper{
display: flex;
flex-flow: row-reverse;
}

.certification__content {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 40%;
background-color:  rgba(7, 55, 92, 0.186);
}

.certification__content h1{
width: 100%;
height: 3rem;
text-align: center;
line-height: 3rem;
margin: 0;
transform: translateX(20rem);
opacity: 0;
transition: 1s;
}

.top_page_js.appear {
transform: none;
opacity: 1;
}

.certification__content--text{
width: 55%;
margin: 0;
padding: 5rem 0;
font-size: 2rem;
}

.certification__content--text br {
display: none;
}

.certification__content a {
width: 18rem;
padding: 1rem;
background: linear-gradient(#30c9cd , #330d69);
box-shadow: 0px 5px 10px #00000030,
0px 5px 20px #00000030,
0px 5px 30px #00000030;
border-radius: 3rem;
color: #fff;
text-align: center;
transition: .5s;
}

.certification__content a:hover {
letter-spacing: 5px;
}

.certification__img{
height: 50rem;
width: 60%;
background:rgba(7, 55, 92, 0.186);
}

.certification__img img {
width: 100%;
height: 100%;
object-fit: cover;
transform: translateX(-20rem);
opacity: 0.5;
transition: 1s;
}

.top_page_js.appear {
transform: none;
opacity: 1;
}

/* ------------------トップ 有資格者情報　SP--------------------------- */
@media screen and (min-width: 1366px) {

    .certification__content a {
        width: 24rem;
        padding: 14px;
        font-size: 2rem;
        }
}

@media screen and (max-width: 720px){
    .certification{
        position: relative;
        width: 100%;
        height: 60rem;
        margin-bottom: 5rem;
    }
    
    .certification__wrapper{
        display: block;
    }
    
    .certification__content {
        position: absolute;
        top: 0;
        width: 100%;
        background-color: transparent;
        margin-bottom: 5rem;
    }
    
    .certification__content h1{
        width: 100%;
        height: 3rem;
        margin-bottom: 35rem;
        font-size: 2rem;
    }
    
    .certification__content--text{
        width: 80%;
        padding: 3rem 0;
        text-align: center;
        font-size: 1.7rem;
    }
    
    .certification__img{
        position: absolute;
        top: 8rem;
        height: 30rem;
        width: 100%;
    }
    
    .certification__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    }
    

@media screen and (max-width: 520px){
    .certification{
        position: relative;
        width: 100%;
        height: 60rem;
        margin-bottom: 5rem;
    }

    .certification__wrapper{
        display: block;
    }

    .certification__content {
        position: absolute;
        top: 0;
        width: 100%;
        background-color: transparent;
        margin-bottom: 5rem;
    }

    .certification__content h1{
        width: 100%;
        height: 3rem;
        margin-bottom: 35rem;
        font-size: 2rem;
    }

    .certification__content--text{
        width: 80%;
        padding: 3rem 0;
        text-align: center;
        font-size: 1.4rem;
    }

    .certification__img{
        position: absolute;
        top: 8rem;
        height: 30rem;
        width: 100%;
    }

    .certification__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}





/* recruit */
.recruit {
    width: 100%;
    height: 80vh;
    margin: 0 auto;
    position: relative;
    text-align: center;
    background-image: url(../pct/recruit_back.jpg);
    background-size: cover;
    background-position: bottom center;

}

.recruit__wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    /* padding-top: 10rem; */
}

.recruit__content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 50%;
}

.recruit__content__h1 {
    position: relative;
    cursor: pointer;
    text-align: center;
}

.recruit__content__h1 h1 {
    position: relative;
    text-decoration: none;
    color: #000000;
    margin: 0;
    font-size: 2em;
    letter-spacing: 0;
    transform: translateX(-20rem);
    opacity: 0;
}

#recruit__content__js.appear {
    animation: animate_top_recruit 2s linear forwards;
}
@keyframes animate_top_recruit {
    0% {
        letter-spacing: 0;
        transform: translateX(-20rem);
        opacity: 0;
    }
    50% {
        letter-spacing: 0;
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        letter-spacing: 3px;
        transform: translateX(0);
        opacity: 1;
    }
}

.recruit__content--text{
    width: 50%;
    margin: 0;
    padding: 5rem 0;
    color: #000000;
    font-size: 2rem;
}

.recruit__content a {
    width: 20rem;
    padding: 14px;
    background: linear-gradient(#30c9cd , #330d69);
    box-shadow: 0px 5px 10px #052D5230,
    0px 5px 20px #052D5230,
    0px 5px 30px #052D5230;
    border-radius: 3rem;
    font-size: 2rem;
    color: #fff;
    text-align: center;
    transition: .5s;
}

.recruit__content a:hover {
    letter-spacing: 3px;
}

.recruit__img {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 55%;
    overflow: hidden;
}

.recruit__img div {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.recruit__img div img {
    position: absolute;
    width: 80%;
    animation: recruit_animation linear infinite;
    animation-duration: calc(3s * 9);
    animation-delay: calc(3s * (var(--recruit-i) - 1));
    transform: translateX(70%) scale(.7);
    opacity: 0;
    z-index: 10;
}

@keyframes recruit_animation {
    0% {
        transform: translateX(70%) scale(.7);
        opacity: .5;
        z-index: 10;
    }
    10% {
        transform: translateX(70%) scale(.7);
        opacity: .5;
        z-index: 10;
    }
    11.1% {
        transform: none;
        opacity: 1;
        z-index: 100;
    }
    21.1% {
        transform: none;
        opacity: 1;
        z-index: 100;
    }
    22.2% {
        transform: translateX(-70%) scale(.7);
        opacity: .5;
        z-index: 10;
    }
    32.2% {
        transform: translateX(-70%) scale(.7);
        opacity: .5;
        z-index: 10;
    }
    33.3% {
        transform: translateX(-70%) scale(.7);
        opacity: 0;
        z-index: 10;
    }
    33.4% {
        transform: translateX(70%) scale(.7);
        opacity: 0;
        z-index: 10;
    }
    100% {
        transform: translateX(70%) scale(.7);
        opacity: 0;
        z-index: 10;
    }
}

/* .recruit__img div img:nth-child(1) {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 90%;
    z-index: 100;
    animation: animate__1 15s linear infinite;
}
@keyframes animate__1 {
    0% {
        top: 0;
        left: 0;
        z-index: 100000;
        opacity: 1;
    }
    12% {
        top: 0;
        left: 0;
        z-index: 100000;
        opacity: 1;
    }
    15% {
        top: 0;
        left: -100%;
        z-index: 100000;
        opacity: .5;
    }
    16% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    28% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    32% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    44% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    48% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    60% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    64% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    76% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    80% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    92% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    100% {
        top: 0;
        left: 0;
        z-index: 100000;
        opacity: 1;
    }
}
.recruit__img div img:nth-child(2){
    position: absolute;
    top: 9%;
    left: 9%;
    display: block;
    width: 90%;
    animation: animate__2 15s linear infinite;
}
@keyframes animate__2 {
    0% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    12% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    16% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    28% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    31% {
        top: 0%;
        left: -100%;
        z-index: 100000;
        opacity: .5;
    }
    32% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    44% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    48% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    60% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    64% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    76% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    80% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    92% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    100% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
}

.recruit__img div img:nth-child(3) {
    position: absolute;
    top: 6%;
    left: 6%;
    display: block;
    width: 90%;
    z-index: 1;
    animation: animate__3 15s linear infinite;
}
@keyframes animate__3 {
    0% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    12% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    16% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    28% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    32% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    44% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    47% {
        top: 0%;
        left: -100%;
        z-index: 100000;
        opacity: .5;
    }
    48% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    60% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    64% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    76% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    80% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    92% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    100% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
}

.recruit__img div img:nth-child(4) {
    position: absolute;
    top: 9%;
    left: 9%;
    display: block;
    width: 90%;
    animation: animate__4 15s linear infinite;
}
@keyframes animate__4 {
    0% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    12% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    16% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    28% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .8;
    }
    32% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    44% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    48% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    60% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    63% {
        top: 0%;
        left: -100%;
        z-index: 100000;
        opacity: .5;
    }
    64% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    76% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    80% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    92% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    100% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
}
.recruit__img div img:nth-child(5) {
    position: absolute;
    top: 9%;
    left: 9%;
    display: block;
    width: 90%;
    animation: animate__5 15s linear infinite;
}
@keyframes animate__5 {
    0% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    12% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    16% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    28% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    32% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .6;
    }
    44% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .6;
    }
    48% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    60% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .9;
    }
    64% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    76% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    79% {
        top: 0%;
        left: -100%;
        z-index: 100000;
        opacity: .9;
    }
    80% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    92% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    100% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
}
.recruit__img div img:nth-child(6) {
    position: absolute;
    top: 9%;
    left: 9%;
    display: block;
    width: 90%;
    animation: animate__6 15s linear infinite;
}
@keyframes animate__6 {
    0% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    12% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
    16% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    28% {
        top: 8%;
        left: 8%;
        z-index: 10;
        opacity: .6;
    }
    32% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    44% {
        top: 6%;
        left: 6%;
        z-index: 100;
        opacity: .7;
    }
    48% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .6;
    }
    60% {
        top: 4%;
        left: 4%;
        z-index: 1000;
        opacity: .6;
    }
    64% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .8;
    }
    76% {
        top: 2%;
        left: 2%;
        z-index: 10000;
        opacity: .8;
    }
    80% {
        top: 0%;
        left: -0%;
        z-index: 100000;
        opacity: 1;
    }
    92% {
        top: 0%;
        left: 0%;
        z-index: 100000;
        opacity: 1;
    }
    99% {
        top: 0%;
        left: -100%;
        z-index: 100000;
        opacity: .5;
    }
    100% {
        top: 10%;
        left: 10%;
        z-index: 1;
        opacity: .5;
    }
} */


.privacy {
    width: 100%;
    height: 4rem;
    font-size: 1.7rem;
    background: rgb(215, 215, 215);
    text-transform: uppercase;
    text-decoration: none;
    line-height: 4rem;
}

.privacy a {
    color: #383936;
}



/* ------------------トップ 採用情報　SP--------------------------- */
@media screen and (min-width: 1800px) {
    .recruit{
        height: 90vh;
    }
}

@media screen and (max-width: 1366px) {

    .recruit__content--text{
        font-size: 2.2rem;
    }
    
    .recruit__img{
        position: relative;
        height: 60rem;
        width: 55%;
        /* overflow: hidden; */
    }
    
    .recruit__content a {
        width: 20rem;
        padding: 14px;
        font-size: 1.6rem;
    }

}
@media screen and (max-width: 720px){
    .recruit{
        position: relative;
        width: 100%;
        height: 80rem;
        margin-top: 0;
    }
    
    .recruit__wrapper{
        display: block;
        /* gap: 3rem; */
    }
    
    .recruit__content {
        position: absolute;
        top: 0;
        width: 100%;
        padding-top: 10rem;
        background-color: transparent;
        margin-bottom: 2rem;
        /* height: 30rem; */
    }
    
    .recruit__content h1{
        width: 100%;
        height: 1rem;
        margin-bottom: 45rem;
        font-size: 3rem;
    }
    
    .recruit__content--text{
        width: 70%;
        padding: 3rem 0;
        text-align: center;
        font-size: 1.4rem;
    }
    
    .recruit__img{
        position: absolute;
        top: 8rem;
        height: 30rem;
        width: 100%;
        margin-top:15rem ;
    }
    
    .recruit__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .recruit__img img:nth-child(1),
    .recruit__img img:nth-child(2),
    .recruit__img img:nth-child(3) {
        width: 100%;
    }
}

@media screen and (max-width: 520px){
    .recruit{
        position: relative;
        width: 100%;
        height: 68rem;
        margin-top: 0;
    }
    
    .recruit__wrapper{
        display: block;
        /* gap: 3rem; */
    }
    
    .recruit__content {
        position: absolute;
        top: 0;
        width: 100%;
        padding-top: 6rem;
        background-color: transparent;
    }

    .recruit__content a {
        width: 16rem;
        padding: 10px;
    }
    
    .recruit__content h1{
        width: 100%;
        height: 1rem;
        margin-bottom: 40rem;
        font-size: 2rem;
    }
    
    .recruit__content--text{
        width: 70%;
        padding: 0 0 3rem;
        text-align: center;
        font-size: 1.4rem;
    }
    
    .recruit__img{
        position: absolute;
        top: 8rem;
        height: 30rem;
        width: 100%;
        margin-top: 4rem ;
    }
    
    .recruit__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .recruit__img img:nth-child(1),
    .recruit__img img:nth-child(2),
    .recruit__img img:nth-child(3),
    .recruit__img img:nth-child(4),
    .recruit__img img:nth-child(5),
    .recruit__img img:nth-child(6)
    .recruit__img img:nth-child(7),
    .recruit__img img:nth-child(8),
    .recruit__img img:nth-child(9)
    {
        width: 80%;
    }
}


footer{
    position: relative;
    width: 100%;
    height: 40vh;
    background-color: #2d74bb;
    color: #fff;
}

.footer__container {
    position: relative;
    width: 100%;
    height: 100%;
}
.footer__nav{
    width: 60%;
    padding-top: 2rem ;
    margin-left: 15%;
    text-align: center;
}

.footer__nav--section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 3rem 0;
}

.footer__nav--list:not(:last-child) {
    padding-right: 2rem;
}

.footer__nav--list-text{
    color: #fff;
    font-size: 1.9rem;
    text-align: center;
}

.footer__banner {
    position: absolute;
    top: 0;
    right: 3rem;
    width: 18rem;
    margin-right: 0.8rem;
    box-shadow: 0 5px 5px #383935;
    border-radius: 50%;
    transform: translateY(-50%);
    transition: .5s;
    z-index: 1001;
}

.footer__banner img {
    width: 100%;
}

.footer__banner:hover {
    box-shadow: none;
    transform: translateY(calc(-50% + 5px));
}

.footer__logo--img{
    position: absolute;
    bottom: 7rem;
    left: 2rem;
    width: 22rem;
    z-index: 99;
    display: block;
}

.footer_contact {
    display: none;
}

.footer__right{
    position: absolute;
    bottom: 2rem;
    left: 0;
    width: calc(100% - 4rem);
    text-align: center;
    border-top: solid 1px #fff;
    transform: translateX(2rem);
    font-size: 1.5rem;
}

.footer__right p {
    margin: 0;
    margin-top: 1rem;
    padding: 0;
}

/* ------------------フッター　TB--------------------------- */


@media screen and (min-width: 1366px){
    .footer__nav {
        width: 60%;
        margin-left: 15%;
    }

    .footer__nav--list:not(:last-child) {
        padding-right: 5rem;
    }

    .footer__nav--list-text {
        font-size: 1.9rem;
    }

    .footer__banner{
        width: 20rem;
    }
}

@media screen and (max-width: 960px){
    .footer__nav {
        width: 80%;
        margin-left: 10%;
    }
    .footer__nav--list:not(:last-child) {
        padding-right: 3rem;
    }
    .footer__nav--list-text {
        font-size: 1.6rem;
    }

    .footer__banner {
        display: none;
    }
}

@media screen and (max-width: 720px) {
    .footer__nav--section {
        flex-wrap: wrap;
    }

    .footer__nav{
        width: 90%;
        margin: 0 auto;
        padding: 0;
        padding-top: 5vh;
        text-align: center;
    }
    
    .footer__nav--section {
        display: flex;
        width: 100%;
        margin: 0;

    }

    .footer__nav--list {
        width: 16%;
    }

    .footer__nav--list:not(:last-child) {
        padding-right: 0;
    }
    
    .footer__nav--list-text{
        margin: 0;
        padding: 0;
        font-size: 1.4rem;
        text-align: start;
        width: 90%;
    }
}

/* ------------------フッター　SP--------------------------- */

@media screen and (max-width: 520px){
    footer{
        height: 480px;
    }
    
    .footer__container {
        position: relative;
        width: 100%;
        height: 100%;
    }
    .footer__nav{
        width: calc(100% - 18rem);
        /*height: 21vh;*/
        margin: 0 auto;
        padding: 0;
        padding-top: 12rem;
        text-align: center;
    }
    
    .footer__nav--section {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        margin: 0;

    }

    .footer__nav--list {
        width: 50%;
        height: 45px;
    }

    .footer__nav--list:not(:last-child) {
        padding-right: 0;
    }
    
    .footer__nav--list-text{
        margin: 0;
        padding: 0;
        font-size: 1.4rem;
        text-align: start;
        width: 90%;
    }
    
    .footer__banner {
        display: none;
    }
    
    .footer__logo--img{
        position: absolute;
        top: 35px;
        left: 50%;
        transform: translateX(-50%);
    }

    .footer_contact {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 30px;
        width: 220px;
        margin: 0 auto;   
        margin-top: 32px;
    }
    
    .footer_contact_Box {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 3.5rem;
        background: #fff;
    }

    .footer_contact_Box img {
        height: 22px;
    }

    .footer_contact_Box:nth-child(2) img {
        height: 25px;
    }

    .footer_contact_Box p {
        width: 130px;
        padding-left: 20px;
        color: #2d74bb;
        font-size: 1.5rem;

    }
    
    .footer__right{
        bottom: 0;
        height: 3.2rem;
    }
    
    .footer__right p {
        margin: 0;
        margin-top: 0;
        padding: 0;
        font-size: 1rem;
        line-height: 3;
    }
    
}




/*--------------- 会社概要--------------- */
.company-page__top {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-bottom: 15rem;
    
}

.company-page__top__content {
    display: flex;
    padding: 15rem 0;
}

.company-page__top__content h1 {
    height: 5rem;
    text-align: center;
    line-height: 5rem;
    border-right: solid 1px #000000;
    padding-right: 3rem;
    
}

.company-page__top__content p {
    height: 5rem;
    line-height: 3rem;
    padding-left: 3rem;
}

.company-page-top--img {
    width: 100%;
    height: 560px;
}

.company-page-top--img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 0 -120px;
}

/*--------------- 会社概要\FV--------------- */
@media screen and (max-width: 520px) {
    .company-page__top {
        display: block;
        width: 100%;
        margin: 0;
        margin-bottom: 10rem;
    }
    
    .company-page__top__content {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 10rem 0;
    }
    
    .company-page__top__content h1 {
        height: 5rem;
        text-align: center;
        font-size: 2rem;
        line-height: 5rem;
        border-right: solid 1px #000000;
        padding-right: 2rem;
    }
    
    .company-page__top__content p {
        height: 5rem;
        font-size: 1.2rem;
        font-weight: bold;
        line-height: 2.5rem;
        padding-left: 2rem;
    }
    
    .company-page-top--img {
        width: 100%;
    }

    .company-page-top--img img {
        width: 550px;
        height: 280px;
        object-fit: cover;
    }
}

/* ---代表者メッセージ--- */
.top-greeting {
    margin-bottom: 5rem;
    transform: translateY(20rem);
    opacity: 0;
    transition: .5s;
    height: 100rem;
}

.top-greeting.appear {
    margin-bottom: 5rem;
    transform: translateY(0);
    opacity: 1;
}

.top-greeting h1 {
    width: 100%;
    text-align: center;
    margin-bottom: 15rem;
}

.top-greeting img {
    width: 100%;
}

.top-greeting__content {
    display: block;
    justify-content: center;
    gap: 3rem;
    width: 60%;
    background: #fff;
    margin: 0 auto;
    padding: 8rem 2rem 13rem 9rem;
    transform: translateY(-50%);
}

.top-greeting__content > p {
    width: 90%;
    text-align: center;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 3.5rem;
    box-sizing: border-box;
}

.top-greeting__content--text {
    width: 90%;
    padding-top: 4rem;
    font-weight: 500;
    line-height: 3rem;
}

.top-greeting__content--text p:nth-of-type(2) {
    padding-top: 3rem;
}



.top-greeting__content--text .top-message__content--name {
    display: flex;
    width: 35%;
    font-weight: 700;
    float: right;
    padding-bottom: 2rem;
}

.top-greeting__content--text .top-message__content--name dt {
    font-size: 1.3rem;
}

.top-greeting__content--text .top-message__content--name dd {
    font-size: 1.9rem;
}


/* ---------------会社概要/代表あいさつ TB--------------- */

@media screen and (max-width: 1700px) {
    .top-greeting {
        height: 145rem;
    }
}

@media screen and (max-width: 1500px) {
    .top-greeting {
        height: 134rem;
    }
}

@media screen and (max-width: 1170px) {
    .top-greeting__content > p {
        font-size: 1.8rem;
        padding: 3rem 5rem 0 0;
    }
    .top-greeting__content--text p {
        font-size: 1.4rem;
    }
    .top-greeting__content--text > .top-message__content--name dd {
        font-size: 1.6rem;
    }
}

@media screen and (max-width: 960px) {
    .top-greeting {
        height: 1250px;
    }
    .top-greeting__content {
        flex-direction: column;
        justify-content: center;
        padding: 5rem;
        padding-bottom: 10rem;
        transform: translateY(-30%);
    }
    .top-greeting__content > p {
        width: 100%;
        padding: 3rem 0;
    }
    .top-greeting__content--text {
        width: 100%;
        padding: 4rem 5rem;
        box-sizing: border-box;
    }
    .top-greeting__content--text > .top-message__content--name {
        justify-content: flex-end;
        width: 60%;
    }
}

@media screen and (max-width: 720px) {
    .top-greeting__content {
        transform: translateY(-20%);
    }
}

/*--------------- 会社概要\代表あいさつ SP--------------- */
@media screen and (max-width: 520px) {
    .top-greeting {
        width: 100%;
        height: 900px;
        margin-bottom: 10rem;
    }
    
    .top-greeting h1 {
        width: 100%;
        text-align: center;
        margin-bottom: 5rem;
        font-size: 1.5rem;
    }
    
    .top-greeting img {
        width: 100%;
    }

    .top-greeting__content {
        display: flex;
        justify-content: center;
        gap: 0;
        width: 80%;
        background: #fff;
        margin: 0 auto;
        padding: 1rem 1rem 5rem 1rem;
        transform: translateY(-20%);
        word-break: normal;
    }

    .top-greeting__content br {
        display: none;
    }
    
    .top-greeting__content > p {
        width: 100%;
        font-size: 1.6rem;
        font-weight: 500;
        line-height: 2.5rem;
        padding: 4rem 2rem;
    }
    
    .top-greeting__content--text {
        width: 100%;
        font-weight: 300;
        line-height: 2rem;
        font-size: .3em;
        padding: 0 2rem;
    }
    
    .top-greeting__content--text .top-message__content--name {
        display: flex;
        width: 100%;
        font-weight: 700;
        margin-top: 4rem;
        justify-content: flex-end;
        padding-top: 0;
        color: #666;
        text-shadow: none;
    }
    
    .top-greeting__content--text .top-message__content--name dt {
        line-height: 2rem;
        font-size: 1.2rem;
        padding-right: 2rem;
    }
    
    .top-greeting__content--text .top-message__content--name dd {
        font-size: 1.6rem;
        line-height: 2rem;
    }
    @media screen and (max-width: 400px) {
        .top-greeting__content {
            transform: translateY(-15%);
        }
    }
}

/* ---アクセス--- */
.company-page-sitemap {
    margin-bottom: 20rem;
}

.company-page-sitemap h1 {
    width: 100%;
    text-align: center;
    margin-bottom: 3rem;
}

.company-page-sitemap__address {
    line-height: 2.5rem;
    font-family: 'Yu Gothic';
    text-align: center;
    margin-bottom: 4rem;
    font-size: 2rem;
}

.company-page-sitemap__content {
    width: 80%;
    height:500px;
    margin: 0 auto;
}

.company-page-sitemap__content iframe {
    width: 100%;
    height: 100%;
}




/*--------------- アクセス --------------- */ 
@media screen and (max-width: 520px) {
    .company-page-sitemap {
        margin-bottom: 10rem;
    }
    
    .company-page-sitemap h1 {
        width: 100%;
        text-align: center;
        font-size: 1.5rem;
    }
    
    .company-page-sitemap__content {
        display: block;
        width: 80%;
        margin: 0 auto;
        height: auto;
    }

    .company-page-sitemap__address {
        font-size: 1.2rem;
    }
    
    .company-page-sitemap__content iframe {
        width: 100%;
        height: 30rem;
    }
    
}



/* ---------------採用情報------------------ */

/* ---FV--- */
.recruit-page__top {
    position: relative;
    width: 100%;
    background-size: cover;
    background-position: top center;

}

.recruit-page__top h1 {
    position: absolute;
    top: 8rem;
    left: 10rem;
    margin: 0;
    font-size: 3.5rem;
    filter: drop-shadow(0 0 10px #000);
    color: #fff;
}

@media screen and (max-width: 520px) {
    .recruit-page__top {
        height: 40vh;
    }

    .recruit-page__top h1 {
        display: none;
    }
}

/* ---社員の声--- */
.employee-opinion {
    width: 100%;
    margin: 0 auto;
    margin-top: 10rem;
    overflow: hidden;
}

.employee-opinion h1 {
    width: 70%;
    margin: 0 auto;
    margin-bottom: 9rem;
    text-align: center;
}

.employee-opinion__content {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 60vh;
    margin-bottom: 10rem;
    background: #71b8fc50;
    background-size: 70%;
    background-position: right;
    box-shadow: 5px 5px 15px #ccc, -5px -5px 15px #71b8fc50;
    border-top-left-radius: 32.5vh;
    border-bottom-left-radius: 32.5vh;
    transition: .5s;
    transform: translateX(80%);
    opacity: 0;
}

.employee-opinion__content:nth-child(odd) {
    flex-flow: row-reverse;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 32.5vh;
    border-bottom-right-radius: 32.5vh;

    transform: translateX(-80%);
}

.employee-opinion__content.appear {
    transform: translateX(0%);
    opacity: 1;
}

.employee-opinion__content div {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 56%;
    padding: 8rem 0;
}

.employee-opinion__content div p {
    font-size: 2rem;
    line-height: 5rem;
    margin: 0;
    padding-bottom: 3rem;
    padding-left: 20rem;
    width: 100%;
    text-shadow: 1px 1px 0 #aaa,
    3px 3px 10px #aaa,
    5px 5px 20px #aaa;
}

.employee-opinion__content div a {
    background: linear-gradient(#30c9cd , #330d69);
    box-shadow: 0 .5rem 0 0 #33333330,
    0 .5rem 1rem 0 #33333340,
    0 .5rem 2rem 0 #33333330;
    border-radius: 4rem;
    color: #fff;
    font-size: 1.7rem;
    text-decoration: none;
    margin: 0;
    margin-top: 2rem;
    padding: 2rem 4rem;
    transition: .5s;
}

.employee-opinion__content div a span {
    width: 0rem;
    padding-left: 0rem;
    opacity: 0;
    transition: .5s;
}

.employee-opinion__content div a:hover span {
    width: 2rem;
    padding-left: 1rem;
    opacity: 1;
}

.employee-opinion__content img {
    height: 60vh;
    filter: drop-shadow(20px 20px 10px #aaa);
}

@media screen and (min-width: 1921px) {


    .employee-opinion__content div p {

        font-size: 3.5rem;
        width: 70%;
        line-height: 6rem;
        margin: 0 auto;
        padding: 4rem 0 4rem 6rem;
        letter-spacing:0.5rem;
        
    }

    .employee-opinion__content div a {
        
        border-radius: 5rem;
        font-size: 4rem;
        padding: 2rem 3.5rem;
        margin-right: 8rem;

    }

}


@media screen and (max-width: 1920px) {
    .employee-opinion__content div p {
        font-size: 2.7rem;
        width: 60%;
        line-height: 4rem;
        margin: 0 auto;
        padding: 4rem 0 4rem 6rem;
        letter-spacing:0.3rem;
    }
}


@media screen and (max-width: 1360px) {
    .employee-opinion__content {
        height: 100%;
        margin-bottom: 3rem;
    }

    .employee-opinion__content div {
        width: 52%;
        margin: 0;
        padding: 0;
        padding-left: 1rem;
    }

    .employee-opinion__content div p {

        font-size: 2rem;
        width: 70%;
        line-height: 3.5rem;
        margin: 0 auto;
        /* padding: 4rem 0 4rem 2rem; */
        letter-spacing:0.3rem;
    }

    .employee-opinion div .number_0{
        padding: 0;
    }

    .employee-opinion__content div a {
        border-radius: 4rem;
        font-size: 1.6rem;
        padding: 1.8rem 3rem;
        margin-right: 8rem;
    }

    .employee-opinion__content img {
        height: 65vh;
    }
    

}


@media screen and (max-width: 960px) {


    .employee-opinion__content div {
        
        width: 60%;
        margin: 0;
        padding: 0;
    }

    .employee-opinion__content div p {
        

        width: 85%;
        line-height: 3.5rem;
        margin: 0 auto;
        padding: 4rem 0 4rem 8rem;
        font-size: 1.7rem;
        letter-spacing:0.2rem;

    }

    .employee-opinion__content div a {
        
        border-radius: 2rem;
        color: #fff;
        font-size: 1.5rem;
        padding: 1rem 2rem;
        transition: .5s;
        margin-top: 0.3rem;
    }

    .employee-opinion__content img {
        width: 50%;
        height: 100%;
        filter: none;
    }

}

@media screen and (max-width: 720px) {
    .employee-opinion {
        width: 100%;
        margin: 0 auto;
        margin-top: 4rem;
    }

    .employee-opinion h1 {
        width: 100%;
        font-size: 1.5rem;
        margin: 0;
        margin-bottom: 4rem;
        text-align: center;
    }

    .employee-opinion__content {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        margin-bottom: 3rem;
    }

    .employee-opinion__content:nth-child(odd) {
        flex-flow: row-reverse;
    }
    
    .employee-opinion__content div {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 40%;
        height: 80%;
        margin: 0;
        padding: 0;
        padding-left: 2rem;
    }
    
    .employee-opinion__content div p {
        width: 95%;
        font-size: 0.8rem;
        line-height: 1.5;
        margin: 0 auto;
        margin-top: 1rem;
        margin-bottom: 2rem;
        padding: 0;
        text-shadow: 1px 1px 5px #aaa;
    }

    .employee-opinion__content:nth-child(3) div p {
        margin-bottom: 0.7rem;
    }

    .employee-opinion__content:nth-child(odd) div {
        padding-left: 0;
        padding-right: 2rem;
    }

    .employee-opinion__content div p br {
        display: none;
    }
    
    .employee-opinion__content div a {
        box-shadow: 0 .5rem 0 0 #66666620,
        0 .5rem .5rem 0 #66666610,
        0 .5rem .6rem 0 #66666610;
        border-radius: 2rem;
        color: #fff;
        font-size: 1rem;
        text-decoration: none;
        letter-spacing: 1px;
        margin: 0;
        padding: .8rem;
        transition: .5s;
    }
    
    .employee-opinion__content div a span {
        display: none;
        padding-left: 3rem;
    }
    
    .employee-opinion__content div a:hover span {
        display: inline-block;
    }

    .employee-opinion__content img {
        width: 40%;
        height: 40%;
        filter: none;
    }

    .privacy{
        font-size: 1.2rem;
    }


}



/* -----------------採用情報------------------ */
.recruit-page__recrute {
    width:75%;
    margin: 0 auto;
    margin-top: 15rem;
}

.recruit-page__recrute h1{
    width: 100%;
    
    text-align: center;
    margin: 0;
    margin-bottom: 8rem;
}

.recruit-page__recrute table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    border: solid 1px #000000;
}

.recruit-page__recrute table tr {
    margin: 0;
    border-collapse: collapse;
    border: solid 1px #000000;
    font-size: 1.8rem;
}

.recruit-page__recrute table tr td {
    margin: 0;
    padding: 2rem;
    border-collapse: collapse;
    border: solid 1px #000000;
}

@media screen and (min-width: 1921px) {
    .recruit-page__recrute table tr {

        font-size: 2.5rem;
    }
    

}
@media screen and (max-width: 960px) {
    .recruit-page__recrute {
        width: 90%;
        margin-top: 10rem;
    }

}


@media screen and (max-width: 520px) {
    .recruit-page__recrute {
        width: 80%;
        margin-top: 10rem;
    }

    .recruit-page__recrute h1 {
        width: 100%;
        font-size: 2rem;
        text-align: center;
        margin: 0;
        margin-left: 0;
        margin-bottom: 5rem;
    }

    .recruit-page__recrute table {
        width: 100%;
        margin: 0;
        border-collapse: collapse;
        border: solid 1px #000000;
    }
    
    .recruit-page__recrute table tr {
        margin: 0;
        border-collapse: collapse;
        border: solid 1px #000000;
    }
    
    .recruit-page__recrute table tr td {
        font-size: 1rem;
        margin: 0;
        padding: 1rem;
        border-collapse: collapse;
        border: solid 1px #000000;
        letter-spacing: 1px;
    }

    .recruit-page__recrute table tr td:nth-child(1) {
        width: 25%;
    }

    .inquiry__time p{
        font-size: 2rem;
    }
    .inquiry .inquiry__phone{
        font-size: 2rem;
    }
}





/* ---------------環境保全活動--------------- */

/* ---FV--- */
.sdgs-page__top {
    width: 100%;
    height: 78vh;
    background-image: url(../pct/sdgs-fv.jpg);
    background-size: cover;
    background-position: bottom center;
}

/* ---------------環境保全活動\FVSP--------------- */
@media screen and (max-width: 960px) {
    .sdgs-page__top {
        height: 370px;
    }
}

/* ---SDGs--- */
.sdgs-page {
    width: 90%;
    margin: 0 auto;
    margin-top: 15rem;
}


.sdgs-page__title h1 {
    border-left: solid 1rem #2d74bb;
    font-size: 3rem;
    margin: 0;
    margin-bottom: 5rem;
    padding: 0;
    padding-left: 3rem;
    margin-left: 12rem;
    box-sizing: border-box;
}

.sdgs-page__title p {
    width: var(--common-width);
    font-size: 2rem;
    margin: 0 auto;
}


@media screen and (max-width: 960px) {


    .sdgs-page__title p {
        width: 100%;
        font-size: 1.5rem;
        /* padding-left: 4rem; */
    }
}

@media screen and (max-width: 720px) {
    .sdgs-page__title {
        width: 90%;
        margin: 0 auto;
        margin-bottom: 5rem;
    }

    .sdgs-page__title h1 {
        border-left: solid .8rem #2d74bb;
        font-size: 2rem;
        margin-bottom: 2rem;
        padding-left: 1rem;
        margin-left: 0;
        box-sizing: border-box;
    }
    
    .sdgs-page__title p {
        width: 100%;
        font-size: 1.3rem;
        line-height: 1.8rem;
    }
}
/* ---------------環境保全活動\titleSP--------------- */
@media screen and (max-width: 520px) {
    .sdgs-page {
        width: 100%;
        margin-top: 10rem;
    }

    .sdgs-page__title {
        width: 80%;
        margin: 0 auto;
        margin-bottom: 2rem;
    }
    
    .sdgs-page__title h1 {
        border-left: solid .8rem #2d74bb;
        font-size: 2rem;
        margin: 0;
        margin-bottom: 2rem;
        padding: 0;
        padding-left: 1rem;
        margin-left: 0;
        box-sizing: border-box;
    }
    
    .sdgs-page__title p {
        width: 100%;
        font-size: 1rem;
        line-height: 1.8rem;
    }

}

.sdgs-kinds{
    width: 90%;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    margin-bottom: 10rem;
    
}

.sdgs-kinds__img{
    display: flex;
    flex-wrap: wrap;
    padding: 4rem;
}

.sdgs-kinds .sdgs-kinds__img img{
    width: 50%;
    object-fit: cover;
}



.sdgs-page__container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.sdgs-page__container--content {
    display: flex;
    justify-content: center;
    gap: 2rem;
    width: 80%;
    margin-bottom: 10rem;
    transform: translateY(20rem);
    opacity: 0;
    transition: .5S;
}

.sdgs-page__container--content.appear {
    transform: translateY(0);
    opacity: 1;
}

.sdgs-page__container--content--left {
    width: 30%;
}

.sdgs-page__container--content--left img {
    width: 100%;
}

.sdgs-page__container--content--right {
    width: 70%;
}

.sdgs-page__container--content--right h2 {
    width: 100%;
    height: 20%;
    margin: 0;
    padding: 0;
}

.name_06{
    border-bottom: solid 1px #2d74bb;
    color: #2d74bb;
}

.name_11{
    border-bottom: solid 1px #ea7c2e;
    color: #ea7c2e;
}

.name_12{
    border-bottom: solid 1px #c07c2f;
    color: #c07c2f;
}

.sdgs-page__container--content--right p {
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(80% - 4rem);
    width: calc(100% - 4rem - 5px);
    line-height: 3rem;
    margin: 0;
    margin-top: 3rem;
    padding: 0 2rem;
    color: #fff;
}

.sdgs-page__container--content-text_1{
    border-left: solid 5px #2d74bb;
    background-color:  rgba(45, 124, 208, 0.634);
}

.sdgs-page__container--content-text_2{
    border-left: solid 5px #ff7e22;
    background-color:  rgba(237, 150, 58, 0.846);
}

.sdgs-page__container--content-text_3{
    border-left: solid 5px #c07c2f;
    background-color:  rgba(201, 125, 39, 0.76);
}

.sdgs-page__text {
    width: 80%;
    margin-bottom: 15rem;
}

.sdgs-page__text.top_page_js {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5rem;
    width: 80%;
    margin-bottom: 15rem;
    transform: translateY(20rem);
    opacity: 0;
    transition: .5s;
}

.sdgs-page__text.top_page_js.appear {
    transform: translateY(0);
    opacity: 1;
}

.sdgs-page__text img {
    width: 50%;
}

.sdgs-page__text p {
    width: 50%;
    line-height: 3rem;
}

@media screen and (max-width: 1920px) {
    .sdgs-page__container--content div p {
        font-size: 1.8rem;
        line-height: 4rem;
    }
}

@media screen and (max-width: 960px) {
    .sdgs-page {
        width: 80%;
        margin: 10rem auto 5rem;
    }
    .sdgs-kinds{
        width: 100%;
        text-align: center;
        display: flex;
        margin-bottom: 8rem;
    }

    .sdgs-kinds__img{
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0;
        margin: 0;
    }

    .sdgs-kinds .sdgs-kinds__img img{
        width: 80%;
    }


    .sdgs-page__container {
        /* width: 80%; */
        margin: 0 auto;
    }

    .sdgs-page__container--content {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
    }

    
    .sdgs-page__container--content div h2 {
        font-size: 1.4rem;

    }
    
    .name_06{
        border-bottom: solid 1px #2d74bb;
        color: #2d74bb;
    }
    
    .name_11{
        border-bottom: solid 1px #ea7c2e;
        color: #ea7c2e;
    }
    
    .name_12{
        border-bottom: solid 1px #c07c2f;
        color: #c07c2f;
    }

    .sdgs-page__container--content div p {
        width: 90%;
        margin: 0;
        margin-top: 1rem;
        padding: 1rem;
        color: #fff;
        line-height: 1.7;
        font-size: 1.4rem;
    }
    
    .sdgs-page__title{
        width: 100%;
    }

    .sdgs-page__title h1 {
        margin-left: 0;
    }
    
    .sdgs-page__text {
        width: 80%;
        margin: 10rem auto 15rem;
    }
    
    .sdgs-page__text img {
        width: 50%;
    }
    
    .sdgs-page__text p {
        width: 100%;
        line-height: 1.2rem;
        font-size: 1rem;
    }

    .sdgs-page__container .sdgs-page__title {
        width: 90%;
    }
}



/* ---------------環境保全活動\titleSP--------------- */


@media screen and (max-width: 520px) {

    .sdgs-kinds{
        width: 100%;
        text-align: center;
        display: flex;
        margin-bottom: 5rem;
    }

    .sdgs-kinds__img{
        display: block;
    }

    .sdgs-kinds .sdgs-kinds__img img{
        width: 100%;
        object-fit: cover;
    }

    .sdgs-page__container--content {
        position: relative;
        display: flex;
        justify-content: center;
        flex-direction: column;
        gap: 2rem;
        width: 100%;
        margin: 0;
        margin-left :0;
        margin-bottom: 5rem;
    }
    
    .sdgs-page__container--content:nth-child(3) {
        margin-bottom: 5rem;
    }
    
    .sdgs-page__container--content img {
        width: 100%;
    }

    .sdgs-page__container--content div {
        width: 100%;
    }
    
    .sdgs-page__container--content div h2 {
        width: 100%;
        height: 20%;
        font-size: 1.2rem;
        margin: 0;
        padding: 0;
    }
    
    .name_06{
        border-bottom: solid 1px #2d74bb;
        color: #2d74bb;
    }
    
    .name_11{
        border-bottom: solid 1px #ea7c2e;
        color: #ea7c2e;
    }
    
    .name_12{
        border-bottom: solid 1px #c07c2f;
        color: #c07c2f;
    }
    
    .sdgs-page__container--content div p {
        display: flex;
        justify-content: center;
        align-items: center;
        height: calc(80% - 3rem);
        width: 100%;
        font-size: 1.1rem;
        line-height: 1.8rem;
        margin: 0;
        margin-top: 1rem;
        padding-left: 0.5rem;
        color: #383936;
    }
    
    .sdgs-page__container--content-text_1{
        border-left: solid 5px #2d74bb;
        background-color:  transparent;
    }
    
    .sdgs-page__container--content-text_2{
        border-left: solid 5px #ff7e22;
        background-color:  transparent;
    }
    
    .sdgs-page__container--content-text_3{
        border-left: solid 5px #c07c2f;
        background-color:  transparent;
    }
    
    .sdgs-page__text {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 2rem;
        width: 100%;
        margin-top: 10rem;
        margin-bottom: 15rem;
        margin-left: 0;
    }
    
    .sdgs-page__text img {
        width: 50%;
    }
    
    .sdgs-page__text p {
        width: 50%;
        line-height: 1.8rem;
        font-size: 1rem;
    }

    .sdgs-page__container .sdgs-page__title {
        width: 100%;
    }
}

.certification-page {
    width: 70%;
    margin: 0 auto;
    margin-bottom: 30rem;
}

.certification-page h1 {
    border-left: solid 1rem #2d74bb;
    font-size: 2.8rem;
    margin: 0;
    margin: 8rem 0;
    padding: 0;
    padding-left: 2rem;
    box-sizing: border-box;
}

.certification-page table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    border: solid 1px #333;
}

.certification-page table tr {
    width: 50%;
    margin: 0;
    border-collapse: collapse;
    border: solid 1px #333;
}

.certification-page table tr td {
    width: 50%;
    margin: 0;
    padding: 2rem;
    border-collapse: collapse;
    border: solid 1px #333;
}

.certification-page--text {
    width: 100%;
    font-size: 2.8rem;
    text-align: center;
    margin-top: 10rem;
}



/* ---------------有資格者情報\titleSP--------------- */

@media screen and (max-width: 960px) {
    .certification-page {
        width: 80%;
        margin: 0 auto;
        margin-bottom: 10rem;
    }

    .certification-page--text {
        width: 100%;
        height: 1rem;
        font-size: 1.7rem;
        text-align: center;
        margin-top: 5rem;
    }
}



@media screen and (max-width: 520px) {
    .certification-page {
        width: 80%;
        margin: 0 auto;
        margin-bottom: 10rem;
    }
    
    .certification-page h1 {
        border-left: solid .8rem #2d74bb;
        font-size: 1.5rem;
        margin: 0 0 5rem 0;
        padding: 0 0 0 2rem;
        box-sizing: border-box;
    }

    .certification-page table {
        width: 100%;
        border-collapse: collapse;
        border: solid 1px #333;
    }
    
    .certification-page table tr {

        border: solid 1px #333;
        border-collapse: collapse;
    }
    
    .certification-page table tr td {
        width: 70%;
        border: solid 1px #333;
        border-collapse: collapse;
        font-size: 1rem;
    }

    .certification-page--container {
        margin-bottom: 5rem;
    }
    
    .certification-page--container p {
        width: 95%;
        height: 3rem;
        font-size: 1rem;
        text-align: start;
        line-height: 3rem;
        margin: 0;
        padding: 0;
        padding-left: 5%;
        border-collapse: collapse;
        border: solid 1px #38393620;
    }
    
    .certification-page--container p:nth-child(1) {
        width: 100%;
        font-size: 1.2rem;
        text-align: center;
        background: #2d74bb;
        color: #fff;
        padding: 0;
    }

    .certification-page--container p:last-child {
        display: none;
    }

    .certification-page--text {
        width: 100%;
        font-size: 1.2rem;
        text-align: center;
        margin: 3rem 0 0 0;
        padding: 0;
    }
}





/* ---------------インタビューページ--------------- */

/* ---FV--- */
.interview-page__top,
.interview-page__top_reverse {
    width: 100%;
    height: 88vh;
    position: relative;
    text-align: center;
}

.interview-page__top img,
.interview-page__top_reverse img {
    position: absolute;
    top: 0;
    left: 50%;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: top center;
    transform: translateX(-50%);
    z-index: -1;
}

.interview-page__top img:nth-child(2),
.interview-page__top_reverse img:nth-child(2) {
    display: none;
}

.interview-page__top h1 {
    position: absolute;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 42%;
    height: 100%;
    margin: 0;
    line-height: 5rem;
    color: #333;
    font-weight: 600;
    padding: 4rem;
    animation: interview-page__top_h1_animation .8s ease-out forwards;
}
@keyframes interview-page__top_h1_animation {
    0% {
        font-size: 0;
        opacity: 0;
    }
    100% {
        font-size: 3rem;
        opacity: 1;
    }
}

.interview-page__top_reverse h1 {
    position: absolute;
    top: 0;
    right: 5%;
    display: flex;
    align-items: center;
    height: 100%;
    margin: 0;
    line-height: 5rem;
    color: #333;
    font-weight: 600;
    animation: interview-page__top_h1_animation .8s ease-out forwards;
}

/* ------------------インタビュー--------------------------- */
.interview-page {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    box-sizing: border-box;
    width: 100%;
    margin: 0 auto;
    padding: 10rem 0 ;
}

.interview-page__opinion{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 70%;
    padding-bottom: 5rem;
    transform: translateY(20rem);
    opacity: 0;
    transition: .5s;
}

.interview-page__opinion.appear {
    transform: translateY(0);
    opacity: 1;
}

.interview-page__opinion--text_1{
    width: 100%;
    height: 10rem;
    padding-top: 2rem;
    font-size: 2rem;
}

.interview-page__opinion--text_1 p{
    font-weight: bold;
    font-size: 2.5rem;
}

.interview-page__opinion--text_1 td{
    padding: 3rem 0;
    font-weight: 700;
    color: #2d74bb;
}

.interview-page__opinion--thought{
    background-color: rgb(199, 219, 255);
    box-shadow: 0 0 1rem 1rem rgb(199, 219, 255);
    border-radius: 1rem;
    padding: 2.8rem;
    font-size: 1.8rem;
}
    
.interview-page__image{
    width: 100%;
    margin: 0;
    padding: 5rem 0;
    transform: translateY(20rem);
    opacity: 0;
    transition: .5s;
}

.interview-page__image img {
    width: 100%;
}

.interview-page__image.appear {
    transform: translateY(0);
    opacity: 1;
}

.interview-page__opinion--schedule {
    padding-bottom: 2rem;
}

/* ----------------------スケジュール------------------------- */
.timeline {
    list-style: none;
}

.timeline li {
    display: flex;
    height: 110px;
}
    
.timeline-content {
    width: 80%;
    padding-top: 5px;
    padding-left: 10%;
    font-size: 1.8rem;
    font-weight: 500;
}

.timeline li p {
    position: relative;
    width: 20%;
    font-size: 2rem;
    color: #2d74bb;  
    line-height: 30px;  
    margin: 0;
    padding: 0;
}

.timeline li p::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 30px;
    height: 30px;
    background: #2d74bb;
    border-radius: 50%;
}

.timeline li p::after {
    content: '';
    position: absolute;
    top: 0;
    right: 14px;
    width: 2px;
    height: 110px;
    background: #2d74bb;
}

/* ---------------------就活生へ一言-------------------- */
.interview-page__opinion__recruit {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 70%;
    height: 40vh;
    margin: 0 auto;
    transform: translateY(20rem);
    opacity: 0;
    transition: .5s;
}

.interview-page__opinion__recruit.appear {
    transform: translateY(0);
    opacity: 1;
}

.interview-page__opinion__recruit__mask {
    position: absolute;
    top: 10vh;
    left: 50%;
    width: 90%;
    height: 30vh;
    background: #b3deff50;
    border-radius: 10rem;
    filter: blur(5rem);
    transform: translateX(-50%);
}

.interview-page__opinion--text_1 {
    display: flex;
    gap: 20px;
    width: 100%;
    height: 10vh;
    margin-bottom: 5rem;
}

.interview-page__opinion--text_1 p {
    color: #2d74bb;
    font-size: 20px;
    line-height: 10vh;
    margin: 0;
}

.interview-page__opinion--text_1 p:nth-child(1) {
    font-size: 25px;
}

.interview-page__opinion--text_2 {
    height: 30vh;   
    width: 70%;
    font-size: 1.9rem;
    font-weight: 500;
    margin: 0;
}

/* --------------------------------お問い合わせ ------------------------*/
.interview-page--inquiry{
    text-align: center;
    margin: 0 auto;
    width: 40rem;
    height: 4rem;
    padding: 1rem 0;
    background: linear-gradient(#30c9cd,#330d69);
    border-radius: 3rem;
    text-align: center;
    line-height: 4rem;
    margin-bottom: 20rem;
}

.interview-page--inquiry a{
    text-decoration: none;
    font-size: 2rem;
    color: #fff;
    transition: .5s;
}

.interview-page--inquiry a:hover {
    letter-spacing: 3px;
}

/* -------------------インタビューページ　レスポンシブ--------------------- */
@media screen and (max-width: 960px) {
    .interview-page__top img {
        object-position: 60% 0%;
    }

    .interview-page__top_reverse img {
        object-position: 35% 0%;
    }

    .interview-page__top h1 {
        width: 50vw;
    }

    .interview-page__top_reverse h1{
        width: 45vw;
        right: 2%;
    }

    .interview-page__top h1,
    .interview-page__top_reverse h1 {
        text-shadow: 0 0 4px #fff;
        animation: interview-page__top_h1_animation_tb .8s ease-out forwards;
    }

    @keyframes interview-page__top_h1_animation_tb {
        0% {
            opacity: 0;
            font-size: 0;
        }
        100% {
            opacity: 1;
            font-size: 2.2rem;
        }
    }

    .interview-page__top_reverse .tb {
        display: none;
    }
}


@media screen and (max-width: 520px){
    /* ---FV--- */
    .interview-page__top,
    .interview-page__top_reverse {
        width: 100%;
        height: 500px;
        text-align: start;
        margin-bottom: 4rem;
    }

    .interview-page__top img:nth-child(1),
    .interview-page__top_reverse img:nth-child(1) {
        display: none;
    }

    .interview-page__top img:nth-child(2),
    .interview-page__top_reverse img:nth-child(2) {
        display: block;
    }
    
    .interview-page__top img,
    .interview-page__top_reverse img {
        position: relative;
        width: 100%;
        height: 500px;
        object-fit: cover;
        object-position: right;
        z-index: -1;
    }

    .interview-page__top h1,
    .interview-page__top_reverse h1 {
        left: 0;
        display: block;
        width: 50%;
        height: auto;
        margin: 0;
        padding-top: 30vh;
        padding-left: 5rem;
        line-height: 1.7;
        font-size: 1.8rem;
        color: #fff;
        font-size: 1.8rem;
        text-shadow: 0 0 8px rgb(0 0 0 / 90%);
        transform: none;
        animation: interview-page__top_h1_animation_sp .8s ease-out forwards;
    }

    @keyframes interview-page__top_h1_animation_sp {
        0% {
            opacity: 0;
            font-size: 0;
        }
        100% {
            opacity: 1;
            font-size:1.5rem;
        }
    }

    .interview-page__top h1 br,
    .interview-page__top_reverse h1 br {
        display: none;
    }

        /* ---------------------------インタビュー-------------------------- */
    .interview-page {
        width: 100%;
        margin: 0;
        padding: 0;
    }
    
    .interview-page__opinion{
        width: 90%;
        margin: 0 auto;
        padding-bottom: 2rem;
        font-size: 1rem;
    }

    .interview-page__opinion--text_1{
        width: 90%;
        height: 5rem;
        margin: 0;
        padding: 2rem 0 1rem 0;
        align-items: center;
    }

    .interview-page__opinion--text_1 p {
        font-size: 1.2rem;
        line-height: 1.7;
    }

    .interview-page__opinion--text_1 p:nth-child(1) {
        font-size: 2rem;
    }

    .interview-page__opinion--thought{

        background-color: rgb(199, 219, 255);
        box-shadow: 0 0 1rem 1rem rgb(199, 219, 255);
        border-radius: 1rem;
        padding: 2.8rem;
        font-size: 1.2rem;
    }
    
    .interview-page__opinion--thought br{
        display: none;
    }
    
    .interview-page__image{
        width: 100%;
        margin: 0;
        padding: 5rem 0 2rem;
        transform: none;
    }
    
    .interview-page__opinion--schedule {
        padding-bottom: 2rem;
    }
    
    /* ----------------------スケジュール ----------------------------*/
    
    .timeline {
        width: 80%;
        margin: 0 auto;
        padding: 0;
    }

    .timeline li {
        display: flex;
        height: 90px;
    }
        
    .timeline-content {
        width: 80%;
        padding-top: 5px;
        padding-left: 2rem;
        font-size: 1rem;
        font-weight: 500;
    }
    
    .timeline li p {
        font-size: 1rem;
        color: #2d74bb;  
    }
    
    .timeline li p::before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 20px;
        height: 20px;
        background: #2d74bb;
        border-radius: 50%;
    }
    
    .timeline li p::after {
        content: '';
        position: absolute;
        top: 0;
        right: 9.5px;
        width: 1px;
        height: 90px;
        background: #2d74bb;
    }
    
    /* ------------------------就活生へ一言 --------------------------*/
    .interview-page__opinion__recruit {
        position: relative;
        width: 90%;
        height: 200px;
        margin: 0 auto 4rem;
    }
    
    .interview-page__opinion__recruit__mask {
        position: absolute;
        top: 2rem;
        left: 50%;
        width: 90%;
        height: 5rem;
        margin: 0;
        background: #b3deff50;
        border-radius: 10rem;
        filter: blur(5rem);
        transform: translateX(-50%);
    }

    .interview-page__opinion--text_2 {
        font-size: 1rem;
        height: auto;
        padding: 0;
    }

    .interview-page__opinion--thought{
        font-weight: 500;
        background-color: rgb(199, 219, 255);
        box-shadow: 0 0 1rem 1rem rgb(199, 219, 255);
        border-radius: 1rem;
        padding: 1.5rem;
    }
    
    
    /* ------------------お問い合わせ------------------------- */
    .interview-page--inquiry{
        width: 28rem;
        height: 3rem;
        padding: 1rem 0;
        line-height: 3rem;
        margin-bottom: 10rem;
    }
    
    .interview-page--inquiry a{
        text-decoration: none;
        font-size: 1.3rem;
        color: #fff;
    }
    }


/* -----------------------問い合わせ--------------------------- */
.inquiry {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    background: #b4d6f840;
    margin: 0;
    margin-top: 15rem;
    padding: 7rem 0;

}

.inquiry h2 {
    font-size: 2.4rem;
    margin: 0;
    margin-bottom: 5rem;
}

.inquiry a {
    background: linear-gradient(#45caff,#517fff);
    box-shadow: 0 1rem #33333350;
    border-radius: 6rem;
    text-decoration: none;
    margin-bottom: 5rem;
    padding: 2rem 4rem;
    font-size: 2rem;
    color: #fff;
    transition: .5s;
}

.inquiry a:hover {
    letter-spacing: 3px;
}

.inquiry div {
    display: flex;
}

.inquiry div p {
    width: 15rem;
    height: 4rem;
    text-align: center;
    line-height: 5rem;
    font-size: 1.9rem;
    margin: 0;
    padding: 0;
}

.inquiry div p:nth-child(2) {
    text-align: end;
}

/* -----------------問い合わせ sp--------------- */
@media  screen and (max-width: 520px) {
    .inquiry {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100%;
        background: #b4d6f840;
        margin: 0;
        margin-top: 5rem;
        padding: 2rem 0;
    }
    
    .inquiry h2 {
        font-size: 1.5rem;
        margin: 0;
        margin-bottom: 2rem;
    }
    
    .inquiry a {
        background: linear-gradient(#45caff,#517fff);
        box-shadow: 0 1rem #33333350;
        border-radius: 6rem;
        text-decoration: none;
        margin-bottom: 2rem;
        padding: 1rem 2rem;
        font-size: 1.2rem;
        color: #fff;
    }
    
    .inquiry div {
        display: flex;
    }
    
    .inquiry div p {
        width: 10rem;
        height: 2rem;
        text-align: center;
        line-height: 2rem;
        font-size: 1.2rem;
        margin: 0;
        padding: 0;
    }
    
    .inquiry div p:nth-child(2) {
        text-align: end;
    }
}




/*-----------------事業内容----------------- */

 /* FV */
.service-fv{
    height: 88vh;
    width: 100%;
    position: relative;
    text-align: center;
    background-image: url(../pct/certification.jpg);
    background-size: cover;
    background-position: bottom center;
    object-fit: cover;
    
}


.service-page{
    width: var(--common-width);
    margin: 0 auto;
    margin-bottom: 20rem;
}

.service-page__drain,
.service-page__watertank,
.service-page__check,
.service-page__other {
    background: #75a3d150;
    padding: 5rem;
    box-shadow: 0 0 10px 10px #75a3d150;
}


.service-page__title{
    height: 20vh;
    width: 100%;
    padding-top: 10rem;
    font-size: 2rem;
    text-align: center;
    line-height: 20vh;
    border-bottom: solid 1px #383935;
    margin-bottom: 20rem;
}

.service-page__content--title {
    font-size: 2rem;
    padding-bottom: 5rem;
}

.service-page__content--title p {
    color: #215f9d;
    font-size: 25px;
    font-weight: 500;
}

.service-page__content--title p span {
    padding-left: 20px;
}


.service-page__content--text {
    font-size: 1.8rem;
    font-weight: 500;
    padding-bottom: 5rem;
}

.service-page__content--pct > p {
    color: #000000;
    font-size: 2rem;
    font-weight: 500;
    margin-left: 6.5rem;
    margin-bottom: 1rem;
    width: 19rem;
    text-align: center;
}

.service-page__content--pct > div {
    display: flex;
    justify-content: space-around;
    align-items :center;
    gap: 2rem;
}

.service-page__content--pct .pictures {
    position: relative;
    width: 30rem;
    height: 20rem;
    margin: 0;
    padding: 0;
    margin-bottom: 5rem;
    outline: solid 4px #fff;
}

.service-page__content--pct .pictures img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.service-page__content--pct .pictures p {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40px;
    transform: translateY(100%);
    text-align: center;
    line-height: 1.7;
    font-weight: 500;
    margin: 0;
    padding-top: 8px;
}

/* ---------------------------フロー---------------------- */
.service-page__flow-list {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}


.service-page__flow-list li {
    position: relative;
    width: 30rem;
    height: 5rem;
    background: #fff;
    border-top: 0.5px solid #215f9d;
    border-left: 0.5px solid #215f9d;
    border-bottom: 0.5px solid #215f9d;
    color: #215f9d;
    font-size: 1.8rem;
    font-weight: 500;
    text-align: center;
    line-height: 50px;
    margin: 0 4rem;
    margin-top: 5rem;
}

.service-page__flow-list li::before {

    content: '';
    position: absolute;
    top: 0;
    right: -25px;
    width: 50px;
    height: 50px;
    background: #fff;
    border-top: 0.5px solid #215f9d;
    border-right: 0.5px solid #215f9d;
    transform: rotate(45deg) scale(.71);
}


/* 水道管 */

.service-page__drain{
    margin-bottom: 20rem;
}


.pictures{
    width: 60rem;
    height: 40rem;
    padding-top: 3rem;
    padding-bottom: 0;
    margin: 0;
}


/* 貯水槽 */

.service-page__watertank{
    margin-bottom: 20rem;
}



/* 点検 */

.service-page__check{
    margin-bottom: 20rem;
}


/* 各種工事 */
.service-page__other{
    margin-bottom: 20rem;
}

@media screen and (min-width: 1366px) {
    .service-page__content--pct .pictures {
        width: 40rem;
        height: 30rem;

    }
}



@media screen and (max-width: 520px) {
/* ---------------FV -----------------*/
    .service-fv{
        height: 600px;
        width: 100%;
        position: relative;
        text-align: center;
        background-image: url(../pct/certification.jpg);
        background-size: cover;
        background-position: bottom center;
        object-fit: cover;
    }

    .service-page{
        width: 100%;
        margin: 0 auto;
        margin-bottom: 5rem;
    }

    .service-page__drain,
    .service-page__watertank,
    .service-page__check,
    .service-page__other {
        background: #75a3d150;
        margin-bottom: 10rem;
        padding: 3rem;
        box-shadow: 0 0 10px 10px #75a3d150;
    }


    .service-page__title{
        height: 8vh;
        width: 90%;
        margin: 0 auto;
        padding-top: 5rem;
        text-align: center;
        line-height: 8vh;
        border-bottom: solid 1px #383935;
        margin-bottom: 5rem;
    }

    .service-page__title h1 {
        font-size: 2rem;
    }

    .service-page__content--title{
        font-size: 2rem;
        padding-bottom: 1rem;
    }

    .service-page__content--title p {
        color: #215f9d;
        font-size: 2.2rem;
        font-weight: 500;
    }

    .service-page__content--title p span {
        font-size: 1.8rem;
        padding-left: 10px;
    }


    .service-page__content--text {
        font-size: 1.2rem;
        font-weight: 500;
        padding-bottom: 2rem;
    }

    .service-page__content--pct > p {
        color: #215f9d;
        font-size: 1.3rem;
        font-weight: 500;
        margin-left: 0;
        margin-bottom: 0;
        padding-bottom: 1.3rem;
        text-align: left;
    }

    .service-page__content--pct > div {
        display: block;
        justify-content: space-around;
        align-items :center;
        gap: 2rem;
    }

    .service-page__content--pct .pictures {
        position: relative;
        width: 30rem;
        height: 20rem;
        margin: 0 auto;
        padding: 0;
        margin-bottom: 5rem;
        outline: solid 4px #fff;
    }

    .service-page__content--pct .pictures img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center center;
    }

    .service-page__content--pct .pictures p {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 3rem;
        transform: translateY(100%);
        text-align: center;
        line-height: 3rem;
        font-size: 1.2rem;
        font-weight: 500;
        margin: 0;
    }



    .service-page__flow-list li {
        position: relative;
        width: 9rem;
        height: 2rem;
        background: #fff;
        border-top: 0.1px solid #215f9d50;
        border-left: 0.1px solid #215f9d50;
        border-bottom: 0.1px solid #215f9d50;
        color: #215f9d;
        font-size: 1rem;
        font-weight: 500;
        text-align: center;
        line-height: 2.2rem;
        margin: 0 .8rem;
        z-index: 10;
    }

    .service-page__flow-list li::before {
        content: '';
        position: absolute;
        top: 0;
        right: -1rem;
        width: 2rem;
        height: 2rem;
        background: #fff;
        border-top: 0.1px solid #215f9d50;
        border-right: 0.1px solid #215f9d50;
        transform: rotate(45deg) scale(.72);
        z-index: -1;
    }


    .pictures{
        width: 60rem;
        height: 40rem;
        padding-top: 3rem;
        padding-bottom: 0;
        margin: 0;
    }
}






/* ----------------プライバシーポリシー---------------- */

.privacy-policy-page{
    width: 70%;
    margin: 0 auto;
    margin-bottom: 20rem;
    margin-top: 15rem;
}

.privacy-policy-page__container{
    margin: 10rem 0;
    width: 90%;
    padding:0rem 4rem;
}


.privacy-policy-page__title h1{
    margin-bottom: 0.2rem;
    padding: 1rem;
    font-weight: bold;
    font-size: 2.5rem;
    
}


.privacy-policy-page__title h1:before {
    margin-right: 0.5rem;
    border-left: 0.8rem solid #2d74bb;
    content: '';
}

.privacy-policy-page__contents h2{
    font-size: 2rem;
    border-bottom:0.2rem solid #2d74bb  ;
    
}

.privacy-policy-page__contents{
    padding-top: 0.5rem;
}

.privacy-policy-page__contents--text{
    padding: 3rem 0;
}


ol{
	counter-reset: listnum; 
	list-style: none;
}
ol li::before{
	counter-increment: listnum; 
	content: counter(listnum)". "; 
}






.privacy-policy-page__contents--text ul{
    display: table;
    padding-left: 0;
    padding-top:3rem ;
}

.privacy-policy-page__contents--text li{
    display: table-row;
}




@media screen and (max-width: 520px){

    .privacy-policy-page{
        width: 90%;
        margin-top: 8rem;
        margin-bottom: 8rem;
    }
    
    .privacy-policy-page__title h1{
        font-size: 2rem;
        
    }

    .privacy-policy-page__text{
        font-size: 1.5rem;
    }

    .privacy-policy-page__container {
        width: 90%;
        margin: 0 auto;
        margin-top: 5rem;
        padding: 0;
    }
    
    .privacy-policy-page__contents h2{
        font-size: 1.6rem;
        
    }
    
    .privacy-policy-page__contents{
        padding-top: 0.5rem;
    }
    
    .privacy-policy-page__contents--text{
        padding: 3rem 0;
        font-size: 1.3rem;
    }

}



/* --------------お問い合わせページ---------------- */

/* --------------お問い合わせページ  (PHPバージョン）---------------- */

.contact-page__fv{
    height: 82vh;
    width: 100%;
    position: relative;
    text-align: center;
    background-image: url(../pct/contact_2_fv.jpg);
    background-size: cover;
    background-position: top center;
    object-fit: cover;
}


.contact-page-2_fv{
    height: 82vh;
    width: 100%;
    position: relative;
    text-align: center;
    background-image: url(../pct/recruit-contact.jpg);
    background-size: cover;
    background-position: top center;
    object-fit: cover;
}

#formWrap {
    width:100%;
    margin:0 auto;
    color:#555;
    line-height:120%;
}

.contact-page__contact{
    width: 70%;
    text-align: center;
    margin: 0 auto;
}

.contact-page__contact h1{
    margin-top: 20rem;
    padding-bottom: 4rem;
}

.contact-page__contact p{
    text-align: end;
    font-size: 1.6rem;
    margin-top: 5rem;
}


table.formTable{
    width: 70%;
    margin: 0 auto;
    border-collapse: collapse;
}

table.formTable td,table.formTable th{
    border:1px solid #fff;
    padding:10px;
}

table.formTable th{
    width:25%;
    height: 10rem;
    font-size: 1.8rem;
    font-weight:normal;
    background:#fff;
    text-align:left;
    padding: 0;
}

.formTable tr td {
    padding: 0;
}

.formTable tr td input,
.formTable tr td textarea {
    width: 100%;
    height: 5rem;
    padding: 0;
} 

.formTable tr td textarea {
    height: 10rem;
}

.formTable tr:nth-child(3) td,
.formTable tr:nth-child(4) td {
    width: 90%;
}

.formTable tr:nth-child(3) td input{
    width: 3%;
    height: 5rem;
    margin: 2.5rem 2.5rem 2.5rem 7rem;
}

.formTable tr:nth-child(4) td input{
    width: 30%;
    height: 5rem;
    margin: 2.5rem;
}

.formTable tr:nth-child(3) td input:first-of-type,
.formTable tr:nth-child(4) td input:first-of-type {
    margin-left: 0;
}

.gender td,
.birth td {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.contact-page__send {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 5rem;
    width: 80%;
    margin: 0 auto;
    margin-top: 15rem;
    margin-bottom: 15rem;
}

.contact-page__send p {
    font-size: 1.8rem;
}

.contact-page__send p a {
    color: #000;
    text-decoration: underline;
}

.contact-page__send p a:hover {
    opacity: 0.5;
}

.contact-page__send p:nth-child(2) input {
    width: 2.5rem;
    height: 2.5rem;
}

.contact-page__send p:nth-child(2) span {
    padding-left: 5rem;
}



@media screen and (max-width:520px) {
    .contact-page__contact{
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }
    
    .contact-page__fv{
        height: 370px;
    }

    .contact-page__contact h1{
        font-size: 1.8rem;
        margin-top: 10rem;
        padding-bottom: 2rem;
    }
    
    .contact-page__contact p{
        text-align: center;
        font-size: 1.1rem;
    }
    
    
    table.formTable{
        margin: 0 auto;
        width: 85%;
        border-collapse: collapse;
    }
    
    table.formTable td,table.formTable th{
        border: 1px solid #fff;
        padding: 5px;
    }
    
    table.formTable th{
        width:27%;
        height: 4rem;
        font-size: 1.2rem;
        font-weight:normal;
        background:#fff;
        text-align:left;
        padding: 0;
    }
    
    .formTable tr td {
        padding: 0;
        font-size: 1.1rem;
    }
    
    .formTable tr td input,
    .formTable tr td textarea {
        width: 100%;
        height: 3rem;
        padding: 0;
    } 
    
    .formTable tr td textarea {
        height: 10rem;
        margin-top: 0.5rem;
    }
    
    .formTable tr:nth-child(3) td input{
        width: 1.6rem;
        height: 1.6rem;
        padding: 0;
    } 
    
    .formTable tr:nth-child(4) td input{
        width: 15%;
        height: 3rem;
        margin: 1rem;
        padding: 0;
    } 
    
    .gender td,
    .birth td {
        font-size: 1rem;
        height: 5rem;
    }
    
    .contact-page__send {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: 2rem;
        width: 80%;
        margin: 0 auto;
        margin-top: 5rem;
        margin-bottom: 5rem;
    }
    
    .contact-page__send p {
        font-size: 1.1rem;
    }
    
    .contact-page__send p:nth-child(2) input {
        width: 1.5rem;
        height: 1.5rem;
    }
    
    .contact-page__send p:nth-child(2) span {
        padding-left: 2rem;
    }
}