@charset "UTF-8";

body {
    min-width: 1260px;

    @media screen and (max-width:768px) {
        min-width: auto;
    }
}

@media screen and (max-width:768px) {
    header {
        padding: 0 0 0 2vw;
    }

    header .inner h1 img {
        width: 40vw;
    }
}

header .main-navigation.toggled .menu-gnavi-container {
    background: rgba(240, 248, 255, 0.9);
}

header #site-navigation #primary-menu li {
    border-color: #fff;
}

.headerTitle {
    padding: 130px 0 0 0;

    @media screen and (max-width:768px) {
        padding: 29vw 0 0 0;
    }
}

.headerTitleTtl {
    font-family: Meiryo;
    font-style: normal;
    font-weight: normal;
    font-size: 60px;
    text-align: center;
    margin: 0 0 50px;

    @media screen and (max-width:768px) {
        font-size: 8.5vw;
        line-height: 1.5;
        margin: 0 0 8vw;
    }
}

.headerTitleCopy {
    font-family: YuMincho;
    font-style: normal;
    font-weight: normal;
    font-size: 28px;
    text-align: center;
    margin: 0 0 50px;

    @media screen and (max-width:768px) {
        font-size: 4vw;
        margin: 0 0 8vw;
    }
}


@media screen and (min-width:768px) {
    .pc-none {
        display: none;
    }
}

@media screen and (max-width:768px) {
    .sp-none {
        display: none;
    }
}

#business {
    background-color: #fff;
}

.smv {
    width: 100%;
    margin: 0 auto;
}

.smv img {
    width: 100%;
}

.threeCard {
    display: flex;
    justify-content: space-between;
    max-width: 1000px;
    margin: 0 auto;
    padding: 30px 0 0 0;

    @media screen and (max-width:768px) {
        flex-wrap: wrap;
        justify-content: center;
    }
}

.threeCard .card {
    max-width: 280px;

    @media screen and (max-width:768px) {
        width: 46%;
        margin: 0 1vw 3.8vw;
    }
}

.threeCard .card h3 {
    background-image: url(../img/blgr.png);
    background-size: cover;
    text-align: center;
    font-family: YuMincho;
    font-style: normal;
    font-weight: bold;
    font-size: 26px;
    color: rgba(255, 255, 255, 1);
    margin: 0 0 10px;
    padding: 7px 0;

    @media screen and (max-width:768px) {
        font-size: 4vw;
    }
}

.threeCard .card p {
    font-size: 18px;

    @media screen and (max-width:768px) {
        font-size: 3vw;
    }
}

.lead {
    text-align: center;
    padding: 45px 0 0 0;
    margin: 0 0 50px;

    @media screen and (max-width:768px) {
        font-size: 3.8vw;
        line-height: 1.4;
    }
}

.ourService {
    margin: 0 0 60px;

    @media screen and (max-width:768px) {
        margin: 0 0 10vw;
    }
}

.ourService h2 {
    text-align: center;
    font-family: Meiryo;
    font-style: normal;
    font-weight: normal;
    font-size: 40px;

    @media screen and (max-width:768px) {
        font-size: 8.5vw;
    }
}

.ourService .subTitle {
    text-align: center;
    font-family: YuMincho;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    margin: 0 0 35px;

    @media screen and (max-width:768px) {
        font-size: 4.5vw;
        margin: 0 0 8vw;
    }
}

.ourService p {
    text-align: center;
    font-family: Meiryo;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;

    @media screen and (max-width:768px) {
        font-size: 3.8vw;
        line-height: 2;
    }
}

.datacenter {
    margin: 0 0 50px;

    @media screen and (max-width:768px) {
        margin: 0 0 5vw;
    }
}

.datacenterInner {
    width: 100%;
    margin: 0 auto;
}

.datacenterInner h2 {
    background-image: url(../img/blgr.png);
    background-size: cover;
}

.datacenterInner h2 .h2_inner {
    max-width: 1000px;
    text-align: left;
    font-family: Meiryo;
    font-style: normal;
    font-weight: bold;
    font-size: 30px;
    color: rgba(255, 255, 255, 1);
    line-height: 1.25;
    height: 80px;
    padding: 0 100px;
    margin: 13px auto 0;

    @media screen and (max-width:768px) {
        height: auto;
        font-size: 4.5vw;
        padding: 2vw 2vw 3vw 4vw;
        line-height: 1.4;
        margin: 0 0 4vw;
    }
}

.datacenterInner h2 span {
    font-style: normal;
    font-weight: normal;
    font-size: 16px;

    @media screen and (max-width:768px) {
        font-size: 3vw;
    }
}

.datacenterInnerMain {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;

    @media screen and (max-width:768px) {
        display: block;
        width: 90%;
        margin: 0 auto;
    }

    & .image {
        & .up {
            @media screen and (max-width:768px) {
                display: flex;
                justify-content: space-between;
                margin: 0 auto 1vw;
            }

            & img {
                @media screen and (max-width:768px) {
                    width: 49%;
                }
            }
        }

        & .bottom {
            @media screen and (max-width:768px) {
                margin: 0 auto;
            }

            & img {
                @media screen and (max-width:768px) {
                    width: 100%;
                }
            }
        }
    }
}

.datacenterInnerMain .left {
    position: relative;
    padding: 40px 35px 0 0;

    @media screen and (max-width:768px) {
        padding: 0;
    }
}

.datacenterInnerMain .left p {
    margin: 0 0 40px;

    @media screen and (max-width:768px) {
        font-size: 3.8vw;
        margin: 0 auto 4vw;
        line-height: 1.4;
    }
}

.datacenterInnerMain .left h3 span {
    display: inline-block;
    border: 2px solid;
    font-style: normal;
    font-weight: normal;
    width: 122px;
    padding: 10px 0;
    text-align: center;
    line-height: 1;
    margin: 0 0 18px;

    @media screen and (max-width:768px) {
        width: 25vw;
        font-size: 3.8vw;
        margin: 2vw 0 3vw;
    }
}

.datacenterInnerMain .right {
    position: relative;
    margin: -50px 0 0 0;

    @media screen and (max-width:768px) {
        margin: 0;
    }
}

.datacenterInnerSub {
    display: flex;
    justify-content: space-between;
    width: 1000px;
    margin: 0 auto 40px;

    @media screen and (max-width:768px) {
        width: 90%;
        flex-wrap: wrap;
    }
}

.datacenterInnerSub .left {
    width: 480px;
}

.datacenterInnerSub .left img {
    width: 100%;

    @media screen and (max-width:768px) {
        width: 100%;
    }
}

.datacenterInnerSub .left h3 span {
    display: inline-block;
    border: 2px solid;
    font-style: normal;
    font-weight: normal;
    width: 122px;
    padding: 10px 0;
    text-align: center;
    line-height: 1;
    margin: 0 0 18px;

    @media screen and (max-width:768px) {
        width: 25vw;
        font-size: 3.8vw;
        margin: 2vw 0 3vw;
    }
}

.datacenterInnerSub .right {
    width: 480px;
}

.datacenterInnerSub .right img {
    width: 100%;

    @media screen and (max-width:768px) {
        width: 100%;
    }
}

.datacenterInnerSub .right p {
    padding: 57px 0 0 0;
}

.datacenterInnerSub .right p.p2 {
    padding: 0;
}

.datacenterInnerLead {
    width: 1000px;
    margin: 0 auto 40px;

    @media screen and (max-width:768px) {
        width: 90%;
        font-size: 3.8vw;
        margin: 0 auto 3vw;
        line-height: 1.5;
    }
}

.battery {
    margin: 0 0 50px;

    @media screen and (max-width:768px) {
        margin: 0 0 5vw;
    }
}

.batteryInner {
    width: 100%;
    margin: 0 auto;
}

.battery h2 {
    background-image: url(../img/blgr.png);
    background-size: cover;
}

.battery h2 .h2_inner {
    max-width: 1000px;
    margin: 0 auto;
}

.h2_inner_box {
    max-width: 485px;
    text-align: left;
    font-family: Meiryo;
    font-style: normal;
    font-weight: bold;
    font-size: 30px;
    color: rgba(255, 255, 255, 1);
    line-height: 1.25;
    margin: 0 0 0 auto;
    height: 80px;

    @media screen and (max-width:768px) {
        height: auto;
        font-size: 4.5vw;
        padding: 2vw 2vw 3vw 4vw;
        line-height: 1.4;
        margin: 0 0 4vw;
    }
}

.batteryInner h2 span {
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
}

.batteryInnerMain {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;

    @media screen and (max-width:768px) {
        width: 90%;
        flex-wrap: wrap;
        margin: 0 auto 3vw;
    }
}

.batteryInnerMain .left {
    position: relative;
    padding: 40px 0 0 35px;
    order: 2;

    @media screen and (max-width:768px) {
        padding: 0;
    }
}

.batteryInnerMain .left p {
    margin: 0 0 40px;

    @media screen and (max-width:768px) {
        width: 100%;
        font-size: 3.8vw;
        margin: 0 auto 3vw;
        line-height: 1.5;
    }
}

.dbatteryInnerMain .left h3 span {
    display: inline-block;
    border: 2px solid;
    font-style: normal;
    font-weight: normal;
    width: 122px;
    padding: 10px 0;
    text-align: center;
    line-height: 1;
    margin: 0 0 18px;
}

.batteryInnerMain .right {
    position: relative;
    margin: -50px 0 0 0;
    order: 1;

    @media screen and (max-width:768px) {
        display: flex;
        justify-content: space-between;
        margin: 0 auto 1vw;
    }

    & img {
        @media screen and (max-width:768px) {
            width: 49%;
        }
    }
}

.biomass {
    margin: 0 0 50px;

    @media screen and (max-width:768px) {
        margin: 0 0 5vw;
    }
}

.biomassInner {
    width: 100%;
    margin: 0 auto;
}

.biomassInner h2 {
    background-image: url(../img/blgr.png);
    background-size: cover;
}

.biomassInner h2 .h2_inner {
    max-width: 1000px;
    text-align: left;
    font-family: Meiryo;
    font-style: normal;
    font-weight: bold;
    font-size: 30px;
    color: rgba(255, 255, 255, 1);
    line-height: 1;
    height: 80px;
    padding: 0 100px;
    margin: 13px auto 0;
    line-height: 1.25;

    @media screen and (max-width:768px) {
        height: auto;
        font-size: 4.5vw;
        padding: 2vw 2vw 3vw 4vw;
        line-height: 1.4;
        margin: 0 0 4vw;
    }
}

.biomassInner h2 span {
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
}

.biomassInnerMain {
    display: flex;
    max-width: 1000px;
    margin: 0 auto;

    @media screen and (max-width:768px) {
        flex-wrap: wrap;
        margin: 0 auto 8vw;
    }
}

.biomassInnerMain .left {
    position: relative;
    padding: 40px 35px 0 0;

    @media screen and (max-width:768px) {
        order: 2;
        padding: 0;
    }
}

.biomassInnerMain .left p {
    margin: 0 0 40px;

    @media screen and (max-width:768px) {
        width: 90%;
        margin: 0 auto 3vw;
    }
}

.biomassInnerMain .left h3 span {
    display: inline-block;
    border: 2px solid;
    font-style: normal;
    font-weight: normal;
    width: 122px;
    padding: 10px 0;
    text-align: center;
    line-height: 1;
    margin: 0 0 18px;
}

.biomassInnerMain .right {
    position: relative;
    margin: -50px 0 0 0;

    @media screen and (max-width:768px) {
        order: 1;
        display: flex;
        justify-content: space-between;
        margin: 0 auto 3vw;
        width: 90%;
    }

    & img {
        @media screen and (max-width:768px) {
            width: 49%;
        }
    }
}

.president {
    width: 100%;
    margin: 0 auto;
    background: linear-gradient(to right, #1175CB, #075086);
    padding: 50px 0px;

    @media screen and (max-width:768px) {
        padding: 6vw 0px;
    }
}

.president_inner {
    max-width: 1200px;
    margin: 0 auto;
}

.president h2 {
    color: #fff;
    text-align: center;
    font-size: 40px;
    font-family: Meiryo;
    font-style: normal;
    font-weight: normal;
    margin: 0 0 20px;

    @media screen and (max-width:768px) {
        font-size: 6vw;
    }
}

.president .subTitle {
    color: #fff;
    text-align: center;
    margin: 0 0 25px;

    @media screen and (max-width:768px) {
        font-size: 3.8vw;
        margin: 0 0 4vw;
    }
}

.president p {
    color: #fff;
    font-size: 20px;
    margin: 0 0 30px;
    padding: 0 90px;

    @media screen and (max-width:768px) {
        padding: 0;
        width: 90%;
        font-size: 3.8vw;
        margin: 0 auto 3vw;
        line-height: 1.7;
    }
}

.president .name {
    text-align: right;
}

#profile {
    max-width: 1200px;
    margin: 0 auto;
    border-bottom: 1px solid #eee;
}

.profileDlWrap dt,
.profileDlWrap dd {
    background-color: rgb(242, 242, 242);
}


#profile .profileWrapper {
    background-color: #fff;
}

#companyprofile span {
    font-family: Meiryo;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;

    @media screen and (max-width:768px) {
        font-size: 3.0vw;
    }
}

#profile .profileInner h3 {
    line-height: 1.3;

    @media screen and (max-width:768px) {
        font-size: 4.5vw;
    }
}

#profile .profileInner {
    width: 1000px;

    @media screen and (max-width:768px) {
        width: 90%;
        margin: 0 auto;
    }
}

#profile .profileInner h3 {
    border: 0;
}

#profile .profileDlWrap dt {
    font-weight: bold;
}

#profile .profileDlWrap dt,
#profile .profileDlWrap dd {
    box-sizing: border-box;
    font-size: 18px;
    line-height: 1.8em;

    @media screen and (max-width:768px) {
        font-size: 3.0vw;
    }
}

#profile .profileDlWrap dd ol li {
    font-size: 18px;

    @media screen and (max-width:768px) {
        font-size: 3.0vw;
    }
}

#contact {
    padding-bottom: 70px;
}

.ttlInner .mainTtl {
    text-align: center;
    font-family: Meiryo;
    font-style: normal;
    font-weight: normal;
    font-size: 40px;
    color: #000;

    @media screen and (max-width: 768px) {
        font-size: 8.5vw;
    }
}

.ttlInner .mainTtl .enTtl {
    color: #000;
}

#contact .contactWrapper .contactInner .submitBtnWrap input[type=submit] {
    background: linear-gradient(to right, #1175CB, #075086);
    border: 0;
}

footer {
    background-image: url(../img/aac.png);
    background-size: cover;
}

footer .addTxt {
    color: #fff;
}

.footNavLiWrap a {
    color: #fff;
}

footer .footLogo {
    text-align: center;
}

footer .footLogo img {
    max-width: 201px;

    @media screen and (max-width: 768px) {
        width: 43vw;
    }
}

.copyRight {
    color: #fff;
}