﻿/* company */


/* contents
----------------------------------------- */
#company.index #contents {
    margin-bottom: 0;
}

/* company-sec */
.company-sec {
    position: relative;
    padding: 0 0 100px 13%;
}

.company-sec::before {
    display: block;
    content: '';
    position: absolute;
    top: 26vw;
    right: 0;
    width: 100%;
    height: calc(100% - 26vw);
    z-index: -1;
}

/** company-sec-inner **/
.company-sec-inner {
    padding: 0 0 50px 12%;
    background-color: #fff;
}

.company-sec-link-wrapper {}

.greeting-area {
    display: block;
    margin-bottom: 50px;
}

.overview-area {
    display: block;
    margin-bottom: 50px;
}

.csr-area {
    display: block;
}

.company-sec-img {
    margin-bottom: 23px;
}

.greeting-area-inner,
.overview-area-inner,
.csr-area-inner {
    padding-right: 10%;
}

.company-sec-inner-ttl {
    margin-bottom: 20px;
}

.company-sec-inner-ttl-inner {
    position: relative;
    margin-bottom: 10px;
}

.company-sec-inner-ttl .num {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    font-family: din-2014, sans-serif;
    font-weight: 700;
    font-size: 2.0rem;
    line-height: 1.6;
    letter-spacing: 0.01em;
    color: #999;
    vertical-align: middle;
}

.company-sec-inner-ttl .eng {
    display: block;
    padding: 10px 0 0 34px;
    font-family: termina, sans-serif;
    font-weight: 700;
    font-size: 1.0rem;
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #999;
    vertical-align: middle;
}

.company-sec-inner-ttl .jpn {
    display: block;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1.4;
}

.company-sec-lead {
    margin-bottom: 26px;
}

.company-sec-lead p {
    line-height: 2.1;
    font-size: 1.3rem;
    min-height: 161px;
}

.company-sec-lead p:last-child {
    margin-bottom: 0;
}

.company-sec-sub-link {
    text-align: right;
}

.company-sec-inner-ttl .jpn span {
    background-color: #4391CA;
    color: #fff;
}






















































/* tablet 560px - 959px */
@media only screen and (min-width: 560px) {


    /* contents
----------------------------------------- */
    #company.index #contents {
        margin-bottom: 0;
    }

    /* company-sec */
    .company-sec {
        position: relative;
        padding: 0 0 120px 10%;
        overflow: hidden;
    }

    .company-sec::before {
        display: block;
        content: '';
        position: absolute;
        top: 14vw;
        right: 0;
        width: 100%;
        height: calc(100% - 14vw);
        z-index: -1;
    }

    /** company-sec-inner **/
    .company-sec-inner {
        margin-top: 0;
        padding: 0 11% 100px 11%;
        background-color: #fff;
    }

    .company-sec-link-wrapper {
        display: flex;
    }

    .greeting-area {
        display: flex;
        margin-bottom: 50px;
    }

    .overview-area {
        display: block;
        width: 45%;
        margin: 0 10% 0 0;
    }

    .csr-area {
        width: 45%;
        display: block;
    }

    .company-sec-img {
        margin-bottom: 23px;
    }

    .greeting-area .company-sec-img {
        width: 35%;
        margin-right: 8%;
    }

    .greeting-area-inner,
    .overview-area-inner,
    .csr-area-inner {
        padding-right: 0;
    }

    .greeting-area-inner {
        width: 57%;
    }

    .company-sec-inner-ttl {
        margin-bottom: 20px;
    }

    .company-sec-inner-ttl-inner {
        position: relative;
        margin-bottom: 10px;
    }

    .company-sec-inner-ttl .num {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        font-family: din-2014, sans-serif;
        font-weight: 700;
        font-size: 2.0rem;
        line-height: 1.6;
        letter-spacing: 0.01em;
        color: #999;
        vertical-align: middle;
    }

    .company-sec-inner-ttl .eng {
        display: block;
        padding: 10px 0 0 34px;
        font-family: termina, sans-serif;
        font-weight: 700;
        font-size: 1.0rem;
        line-height: 1.4;
        letter-spacing: 0.02em;
        color: #999;
        vertical-align: middle;
    }

    .company-sec-inner-ttl .jpn {
        display: block;
        font-size: 2.2rem;
        font-weight: 700;
        line-height: 1.4;
    }

    .company-sec-lead {
        margin-bottom: 26px;
    }

    .company-sec-lead p {
        line-height: 2.1;
        font-size: 1.3rem;
    }

    .company-sec-lead p:last-child {
        margin-bottom: 0;
    }

    .company-sec-sub-link {
        text-align: right;
    }


}

/* tablet end */



















































/* PC 960px - */
@media only screen and (min-width: 960px) {


    /* contents
----------------------------------------- */
    #company.index #contents {
        margin-bottom: 0;
    }

    /* company-sec */
    .company-sec {
        position: relative;
        padding: 0 0 270px 18.5%;
        overflow: hidden;
    }

    .company-sec::before {
        display: block;
        content: '';
        position: absolute;
        top: 13vw;
        right: 0;
        width: 100%;
        height: calc(100% - 13vw);
        z-index: -1;
    }

    /** company-sec-inner **/
    .company-sec-inner {
        margin-top: 0;
        padding: 0 10% 160px 12%;
        background-color: #fff;
    }

    .company-sec-link-wrapper {
        display: flex;
    }

    .greeting-area {
        display: flex;
        align-items: center;
        margin-bottom: 50px;
    }

    .overview-area {
        display: block;
        width: 45%;
        margin: 0 10% 0 0;
    }

    .csr-area {
        width: 45%;
        display: block;
    }

    .greeting-area:hover .sec-sub-link::before,
    .overview-area:hover .sec-sub-link::before,
    .csr-area:hover .sec-sub-link::before {
        background-color: #666;
    }

    .greeting-area:hover .sec-sub-link::after,
    .overview-area:hover .sec-sub-link::after,
    .csr-area:hover .sec-sub-link::after {
        right: 6px;
    }

    .greeting-area:hover .sec-sub-link span::after,
    .overview-area:hover .sec-sub-link span::after,
    .csr-area:hover .sec-sub-link span::after {
        transform-origin: right top;
        transform: scale(0, 1);
    }

    .company-sec-img {
        position: relative;
        margin-bottom: 23px;
    }

    .company-sec-img picture {
        display: block;
        overflow: hidden;
    }

    .company-sec-img picture img {
        transform: scale3d(1, 1, 1);
        transition: all .4s;
    }

    .company-sec-inner a:hover .company-sec-img picture img {
        transform: scale3d(1.08, 1.08, 1.08);
    }

    .greeting-area .company-sec-img {
        width: 34%;
        margin-right: 9%;
    }

    .greeting-area-inner,
    .overview-area-inner,
    .csr-area-inner {
        padding-right: 0;
    }

    .greeting-area-inner {
        width: 57%;
    }

    .company-sec-inner-ttl {
        margin-bottom: 26px;
        transition: color .2s;
    }

    .company-sec-inner a:hover .company-sec-inner-ttl {
        color: #4391CA;
    }

    .overview-area .company-sec-inner-ttl,
    .csr-area .company-sec-inner-ttl {
        padding: 0 10px;
    }

    .company-sec-inner-ttl-inner {
        position: relative;
        margin-bottom: 8px;
    }

    .company-sec-inner-ttl .num {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        font-family: din-2014, sans-serif;
        font-weight: 700;
        font-size: 2.2rem;
        line-height: 1.6;
        letter-spacing: 0.01em;
        color: #999;
        vertical-align: middle;
    }

    .company-sec-inner-ttl .eng {
        display: block;
        padding: 10px 0 0 34px;
        font-family: termina, sans-serif;
        font-weight: 700;
        font-size: 1.2rem;
        line-height: 1.4;
        letter-spacing: 0.02em;
        color: #999;
        vertical-align: middle;
    }

    .company-sec-inner-ttl .jpn {
        display: block;
        font-size: 3.0rem;
        font-weight: 700;
        line-height: 1.4;
    }

    .company-sec-lead {
        margin-bottom: 26px;
    }

    .overview-area .company-sec-lead,
    .csr-area .company-sec-lead {
        padding: 0 10px;
    }

    .company-sec-lead p {
        line-height: 2.3;
        font-size: 1.4rem;
    }

    .company-sec-lead p:last-child {
        margin-bottom: 0;
    }

    .overview-area .company-sec-sub-link,
    .csr-area .company-sec-sub-link {
        padding-right: 10px;
    }

    .company-sec-sub-link {
        text-align: right;
    }





}

/* PC end */





















































/* PC:1201px - */
@media only screen and (min-width: 1201px) {}

/* PC end */






/* PC:1601px - */
@media only screen and (min-width: 1601px) {}

/* PC end */