@charset "utf-8";

.secCmnIndexTop{
    background: url(../img/environment/bgCmnIndexTop.jpg) center top / cover;
}
@media only screen and (max-width:767px){
    .secCmnIndexTop{
        z-index: -1;
        background: url(../img/environment/bgCmnIndexTop_sp.jpg) center top / cover;
    }
    .secCmnIndexTop .wrapper {
        padding-top: 90px;
    }
    .secCmnIndexTop .titEng {
        width: 217px;
        left: -5px;
        position: relative;
    }
    .secCmnIndexTop .titJpn {
        margin-top: 15px;
    }
}

/* secBoxImg */
.secBoxImg{
    position: relative;
}
.secBoxImg .boxImg {
    position: absolute;
    right: calc(50% - 800px);
    bottom: -200px;
    z-index: 10;
}
.secBoxImg .boxImg img{
    border-radius: 15px;
}
@media only screen and (max-width:1650px){
    .secBoxImg .boxImg {
        width: 800px;
        right: calc(50% - 650px);
    }
}
@media only screen and (max-width:767px){
    .secBoxImg .boxImg {
        position: static;
        width: 100%;
        margin-top: -25px;
    }
    .secBoxImg .boxImg img{
        border-radius: 7px;
    }
}

/* secTop */
.secTop{
    position: relative;
    margin-top: 238px;
    background:#158bba ;
}
.secTop .box{
    position: relative;
    background: #fff;
    padding-bottom: 110px;
    border-radius: 0px 0px 0px 100px;
}
.secTop .txt{
    font-size: 16px;
   line-height: 2.5;
   letter-spacing: 1.5px;
   position: relative;
   z-index: 1;
   text-align: center;
}

@media only screen and (max-width:767px){
    .secTop{
        margin-top: 16px;
    }
    .secTop .box{
        padding-bottom: 45px;
        border-radius: 0px 0px 0px 50px;
    }
    .secTop .txt {
        font-size: 12px;
        line-height: 2;
        letter-spacing: 0px;
        text-align: left;
    }
}


/* secList */
.secList{
    position: relative;
    background: #fff;

}
.secList .listCover{
    background: #158bba;
    padding: 120px 0 150px;
    border-radius: 0px 100px 100px 100px;
}
.secList .list{
    position: relative;
}
.secList .item{
    display: flex;
    justify-content: flex-end;
    min-height: 650px;
    position: relative;
}
.secList .item:nth-child(n+2){
    margin-top: 120px;
}
.secList .item:nth-child(2n){
    flex-direction: row-reverse;
}
.secList .leftImg{
    position: absolute;
    left: calc(50% - 960px);
    z-index: 1;
}
.secList .item:nth-child(2n) .leftImg{
    left: unset;
    right: calc(50% - 960px);
}
.secList .leftImg img{
    border-radius: 0px 100px 15px 0px;
}
.secList .item:nth-child(2n) .leftImg img{
    border-radius: 100px 0px 0px 15px;
}
.secList .txtBox{
    background: #f0f3f5;
    width: 950px;
    height: 650px;
    margin-top: 100px;
    border-radius: 15px 15px 100px 15px;
    position: relative;
    padding: 120px 0px 0 8.85vw;
    margin-left: 500px;
}
.secList .item:nth-child(2n) .txtBox{
    border-radius: 15px 15px 15px 100px;
    padding: 120px 140px 0 80px;
    margin-left: 0px;
    margin-right: 500px;
}
.secList .boxTit{
    position: relative;
    font-size: 32px;
    font-weight: bold;
    padding-left: 35px;
    letter-spacing: 0.5px;
}
.secList .boxTit::before{
    position: absolute;
    content: "";
    background:#d31277 ;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    left: 0;
    top: 8px;
}
.secList .boxTxt{
    font-size: 16px;
    line-height: 2.25;
    margin-top: 20px;
    margin-top: 40px;
    letter-spacing: 2px;
}
.secList .txtEng{
    position: absolute;
    right: 55px;
    bottom: 55px;
}
.secList .bnr{
    text-align: center;
    margin-top: 120px;
}
.secList .bnrInner{
    display: inline-block;
}
.secList .imgBnr img{
    border-radius: 15px;
    box-shadow: 0px 0px 5.88px 0.12px rgba(0, 0, 0, 0.15);
}
@media only screen and (max-width:1670px){
    .secList .txtBox{
        padding-left: 13vw;
    }
}
@media only screen and (max-width:1540px){
    .secList .boxTxt {
        font-size: 14px;
        letter-spacing: 1px;
    }
    .secList .boxTit {
        font-size: 30px;
    }
}
@media only screen and (max-width:1480px){
    .secList .txtBox{
        padding-left: 120px;
    }
}
@media only screen and (max-width:767px){
    .secList{
        position: relative;
    }
    .secList .listCover{
        padding: 45px 0 50px;
        border-radius: 0px 50px 50px 50px;
    }
    .secList .list{
        position: relative;
    }
    .secList .item{
        display: block;
        min-height: auto;
    }
    .secList .item:nth-child(n+2){
        margin-top: 40px;
    }

    .secList .leftImg{
        position: relative;
        left: unset;
        width: calc(100% - 40px);
    }
    .secList .item:nth-child(2n) .leftImg{
        right: unset;
        margin: 0 0 0 auto;
    }
    .secList .leftImg img{
        border-radius: 0px 37px 6px 0px;
    }
    .secList .item:nth-child(2n) .leftImg img{
        border-radius: 37px 0px 0px 6px;
    }
    .secList .txtBox{
        width:89.335%;
        height: auto;
        margin: 0 auto;
        border-radius: 10px 10px 10px 50px;
        padding: 70px 20px 35px;
        margin-left: 0px;
        margin: -50px auto 0;
    }
    .secList .item:nth-child(2n) .txtBox{
        border-radius: 10px 10px 50px 10px;
        padding: 70px 20px 40px;
        margin-right: 0px;
        margin: -50px auto 0;
    }
    .secList .boxTit{
        font-size: 16px;
        line-height: 1.5;
        padding-left: 17px;
        letter-spacing: 0px;
    }
    .secList .boxTit::before{
        width: 7px;
        height: 7px;
        top: 8px;
    }
    .secList .boxTxt{
        font-size: 12px;
        line-height: 1.83;
        margin-top: 10px;
        letter-spacing: 0px;
        position: relative;
        z-index: 1;
    }
    .secList .txtEng{
        right: 20px;
        bottom: 20px;
    }
    .secList .txtEng img{
        width: auto;
        height: 66px;
    }
    .secList .bnr{
        width: calc(100% - 45px);
        margin: 32px auto 0;
    }

    .secList .imgBnr img{
        border-radius: 10px;
    }
}



/* secCmnBnr */
.secCmnBnr{
    background: #fff;
    position: relative;
    padding: 120px 0 87px;
    margin: 0 auto;
    z-index: 20;
}
@media only screen and (max-width:767px){
    .secCmnBnr{
        padding: 40px 0 100px;
        margin: 0 auto;
    }
}

/* ▼260826 */
.secTop{
    margin-top: 50px;
}
@media only screen and (max-width:767px){
    .secTop{
        margin-top: 30px;
    }
}