/* top */

/* IE11 animation lineMove */
.scroll-line {
    right: 25px;
    bottom: 25px;
    width: 1px;
    height: 80px;
    background: rgba(255, 255, 255, 0.3);
}

.scroll-line::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    width: 1px;
    background: rgba(255, 255, 255, 0.6);
    -webkit-animation: lineMove 3.0s ease infinite;
    animation: lineMove 4.0s ease infinite;
}

@keyframes lineMove {
    0% {
        bottom: 100%;
        height: 0;
    }

    20% {
        bottom: 0;
        height: 100%;
    }

    40% {
        bottom: 0;
        height: 0;
    }

    100% {
        bottom: 0;
        height: 0;
    }
}

/* sp - 599px */
@media only screen and (max-width: 599px) {

    /* animation lineMove */
    .scroll-line {
        position: absolute;
        right: 25px;
        bottom: 25px;
        width: 1px;
        height: 80px;
        background: rgba(255, 255, 255, 0.3);
        transition: all 1.4s;
    }

    .scroll-line::after {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        width: 1px;
        background: rgba(255, 255, 255, 0.6);
        -webkit-animation: lineMove 3.0s ease infinite;
        animation: lineMove 4.0s ease infinite;
    }

}

/* sp end */


/* header
----------------------------------------- */
#header {}

/* main-visual-area */
.main-visual-area {
    position: relative;
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
}

.main-visual-area::after {
    display: block;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    background: rgba(17, 17, 17, 0.05);
    background-size: cover;
    z-index: -9;
}

.bx-wrapper,
.bx-viewport {}

.main-visual-slide {
    position: relative;
    margin: 0;
    padding: 0;
    z-index: -10;
}

.main-visual-slide li {
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
    margin: 0;
    padding: 0;
}

/*.main-visual-slide .m-slide01 {
    background: url(../image/mainvisual01_sp.jpg) center center no-repeat;
    background-size: cover;
}
.main-visual-slide .m-slide02 {
    background: url(../image/mainvisual02_sp.jpg) center center no-repeat;
    background-size: cover;
}
.main-visual-slide .m-slide03 {
    background: url(../image/mainvisual03_sp.jpg) center center no-repeat;
    background-size: cover;
}
.main-visual-slide .m-slide04 {
    background: url(../image/mainvisual04_sp.jpg) center center no-repeat;
    background-size: cover;
}
.main-visual-slide .m-slide05 {
    background: url(../image/mainvisual05_sp.jpg) center center no-repeat;
    background-size: cover;
}
.main-visual-slide .m-slide06 {
    background: url(../image/mainvisual06_sp.jpg) center center no-repeat;
    background-size: cover;
}*/

.main-visual-N {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 45%;
    height: auto;
    margin: -25% auto 0 -23.5%;
}

.main-visual-N .st0 {
    opacity: 0.6;
    fill: none;
    stroke: #FFFFFF;
    enable-background: new;
}

.main-visual-copy {
    position: absolute;
    bottom: 18%;
    left: 14%;
    width: 30em;
    height: auto;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.0rem;
    letter-spacing: 0.05em;
    color: #fff;
    transform: scale(1);
    opacity: 0;
    transition: opacity 1.4s;
}

.main-visual-copy.fade-in {
    opacity: .8;
}

.main-visual-copy span {
    display: block;
    transform: translateY(0);
    opacity: 1;
    transition: all 1.2s;
}

.main-visual-copy.fade-in span:nth-child(1) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .2s;
}

.main-visual-copy.fade-in span:nth-child(2) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 0.9s;
}

.main-visual-copy.fade-in span:nth-child(3) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .3s;
}

.main-visual-copy.fade-in span:nth-child(4) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .7s;
}

.main-visual-copy.fade-in span:nth-child(5) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .1s;
}

.main-visual-copy.fade-in span:nth-child(6) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .7s;
}

.main-visual-copy.fade-in span:nth-child(7) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .5s;
}

.main-visual-copy.fade-in span:nth-child(8) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 1.1s;
}

.main-visual-copy.fade-in span:nth-child(9) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 1.2s;
}

.main-visual-copy.fade-in span:nth-child(10) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 1.0s;
}

.main-visual-copy.fade-in span:nth-child(11) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 1.2s;
}

.main-visual-copy.fade-in span:nth-child(12) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .15s;
}

.main-visual-copy.fade-in span:nth-child(13) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 1.3s;
}

.main-visual-copy.fade-in span:nth-child(14) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 1.5s;
}

.main-visual-copy.fade-in span:nth-child(15) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .6s;
}

.main-visual-copy.fade-in span:nth-child(16) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: .5s;
}

.main-visual-copy.fade-in span:nth-child(17) {
    transform: translateY(0);
    padding: 0;
    opacity: 1;
    transition-delay: 1.0s;
}

.mainvisual-copyright {
    display: none;
}


/* contents
----------------------------------------- */
/* sec-ttl */
.sec-ttl .eng {
    transform: translateY(5px);
    opacity: 0;
    transition: all 0.6s;
}

.service-sec-cont.scrollin .sec-ttl .eng {
    transform: translateY(0);
    opacity: 1;
}

.projects-sec.scrollin .sec-ttl .eng {
    transform: translateY(0);
    opacity: 1;
}

.news-sec.scrollin .sec-ttl .eng {
    transform: translateY(0);
    opacity: 1;
}

.sec-ttl .jpn {
    transform: translateY(5px);
    opacity: 0;
    transition: all 0.8s;
}

.service-sec-cont.scrollin .sec-ttl .jpn {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .1s;
}

.projects-sec.scrollin .sec-ttl .jpn {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .1s;
}

.news-sec.scrollin .sec-ttl .jpn {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .1s;
}

/* mission-sec */
.mission-sec {
    display: flex;
    height: 240px;
}

.mission-sec-left {
    width: 50%;
    background: url(../image/mission-img_sp.jpg) center center no-repeat;
    background-size: cover;
    transform: translateY(20px);
    opacity: 0;
    transition: all 1.2s;
}

.scrollin .mission-sec-left {
    transform: translateY(0);
    opacity: 1;
}

.mission-sec-right {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
}

.mission-sec-right-inner {}

.mission-sec-ttl {
    position: relative;
    margin-bottom: 25px;
    padding-left: 14px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.0rem;
    letter-spacing: 0.03em;
    transform: scale(0.9);
    transform-origin: left top;
    transform: translateY(10px);
    opacity: 0;
    transition: all 1.2s;
    text-align: center;
}

.scrollin .mission-sec-ttl {
    transform: translateY(0);
    opacity: 1;
}

.mission-sec-ttl::before {
    content: "";
    position: absolute;
    left: -25vw;
    top: 9px;
    width: 22vw;
    height: 1px;
    margin: auto;
    background-image: linear-gradient(to right, #999, #999 1px, #999 1px, #999 3px);
    background-size: 3px 1px;
    background-repeat: repeat-x;
    opacity: 0;
    transition: opacity 1.2s;
}

.scrollin .mission-sec-ttl::before {
    opacity: 1;
}

.mission-sec-copy {
    width: auto;
    font-family: 'Noto Sans JP', sans-serif;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    vertical-align: top;
    letter-spacing: 0.3em;
    line-height: 2.5;
    font-size: 1.0rem;
    transform: scale(0.95);
    transform-origin: left top;
    transform: translateY(10px);
    opacity: 0;
    transition: all 1.2s;
    transition-delay: .2s;
    margin: 0 auto 15% auto;
}

.scrollin .mission-sec-copy {
    transform: scale(0.95);
    transform: translateY(0);
    opacity: 1;
}

/* service-sec */
.service-sec {
    display: flex;
    position: relative;
}

.service-sec-img-area {
    margin-bottom: 0;
    width: 50%;
    height: 100%;
    position: absolute;
    right: 0;
}

.service-sec-img01 {
    width: 100%;
    height: 100%;
    margin-left: 0;
    background: url(../image/service-img01_sp.jpg) center center no-repeat;
    background-size: cover;
    transform: translateY(20px);
    opacity: 0;
    transition: all 1.0s;
}

.scrollin .service-sec-img01 {
    transform: translateY(0);
    opacity: 1;
}

.service-sec-img02 {
    width: 37%;
    margin-left: 13%;
    transform: translateY(20px);
    opacity: 0;
    transition: all 1.0s;
    transition-delay: .2s;
}

.scrollin .service-sec-img02 {
    transform: translateY(0);
    opacity: 1;
}

.service-sec-cont {
    width: 50%;
    padding: 12% 0;
}

.service-sec-cont .sec-ttl {
    margin-bottom: 25px;
    text-align: center;
}

.service-sec-figure {
    width: 280px;
    margin: 0 auto 20px;
    transform: translateY(10px);
    opacity: 0;
    transition: all 1.0s;
}

.service-sec-figure img {
    image-rendering: auto;
}

.service-sec-cont.scrollin .service-sec-figure {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .2s;
}

.service-sec-text {
    margin-bottom: 35px;
    font-size: 1.1rem;
    line-height: 2.3;
    text-align: center;
    transform: translateY(12px);
    opacity: 0;
    transition: all 0.8s;
}

.service-sec-cont.scrollin .service-sec-text {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .3s;
}

.service-sec-link {
    text-align: center;
    transform: translateY(14px);
    opacity: 0;
    transition: all 0.8s;
}

.service-sec-cont.scrollin .service-sec-link {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .6s;
}




/* projects-sec */
.projects-sec {
    position: relative;
    margin-bottom: 105px;
}

.projects-sec .sec-ttl {
    padding-left: 40px;
}

.projects-slide-btn {
    margin: 0 30px 28px 0;
    text-align: right;
}

.projects-slide-btn .left-btn,
.projects-slide-btn .right-btn {
    display: inline-block;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid #ccc;
    opacity: 0;
    transition: all 0.8s;
}

.scrollin .projects-slide-btn .left-btn {
    opacity: 1;
}

.scrollin .projects-slide-btn .right-btn {
    opacity: 1;
    transition-delay: .15s;
}


.projects-slide-btn .left-btn {
    position: relative;
    margin-right: 4px;
}

.projects-slide-btn .left-btn::after {
    display: inline-block;
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 5px;
    margin: -2px 0 0 -2px;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    transform: rotate(45deg);
}

.projects-slide-btn .right-btn {
    position: relative;
}

.projects-slide-btn .right-btn::after {
    display: inline-block;
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 5px;
    margin: -2px 0 0 -4px;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    transform: rotate(45deg);
}

.projects-slide-btn .swiper-button-disabled {
    pointer-events: none;
    opacity: 0.5;
}

.swiper-left-btn {
    outline: none;
}

.swiper-right-btn {
    outline: none;
}

.projects-sec-list-wrap {
    position: relative;
    padding: 0 0 80px 40px;
}

.projects-sec-list-wrap::before {
    display: block;
    content: '';
    position: absolute;
    top: 90px;
    left: 0;
    width: calc(100% - 50px);
    height: calc(100% - 100px);
    background-color: #F0F1F3;
    z-index: -1;
}

.swiper-container {
    margin-bottom: 50px;

}

.scrollin .swiper-container {}

.projects-sec-list {}

.projects-sec-list li {
    position: relative;
    width: 230px;
    margin-right: 30px;
    vertical-align: top;

    opacity: 0;
    transition: all 1.2s;
}

.scrollin .projects-sec-list li:nth-child(7) {
    opacity: 1;
    transition-delay: .1s;
}

.scrollin .projects-sec-list li:nth-child(8) {
    opacity: 1;
    transition-delay: .2s;
}

.scrollin .projects-sec-list li:nth-child(9) {
    opacity: 1;
    transition-delay: .3s;
}

.scrollin .projects-sec-list li:nth-child(10) {
    opacity: 1;
    transition-delay: .4s;
}

.scrollin .projects-sec-list li:nth-child(11) {
    opacity: 1;
    transition-delay: .5s;
}

.scrollin .projects-sec-list li:nth-child(12) {
    opacity: 1;
    transition-delay: .6s;
}

.scrollin .projects-sec-list li {
    opacity: 1;
    transition-delay: .7s;
}

.swiper-slide {
    height: auto;
}

.projects-sec-list li a {
    display: block;
    height: 100%;
    background-color: #fff;
}

.projects-sec-list-img {
    position: relative;
}

.projects-sec-list-img-innner {}

.projects-sec-list-category {
    position: absolute;
    bottom: 8px;
    right: 8px;
    padding: 1px 9px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.0rem;
    letter-spacing: 0.03em;
    transform: scale(0.9);
    transform-origin: right bottom;
    background-color: #111;
    color: #fff;
}

.projects-sec-list-body {
    padding: 25px 25px;
}

.projects-sec-list-date {
    margin-bottom: 7px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.0rem;
    letter-spacing: 0.03em;
}

.projects-sec-list-ttl {
    display: inline-block;
    margin-bottom: 10px;
    font-size: 1.4rem;
}

.projects-sec-list-lead {
    font-size: 1.0rem;
    line-height: 2.0;
}

.projects-sec-link {
    transform: translateY(14px);
    opacity: 0;
    transition: all 0.8s;
}

.projects-sec-list-wrap.scrollin .projects-sec-link {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .6s;
}


/* news-sec */
.news-sec {
    margin-bottom: 80px;
    padding: 0 10px;
    margin-top: 12%;
}

.news-sec .sec-ttl {
    margin-bottom: 48px;
    text-align: center;
}

.news-sec-list {
    margin-bottom: 50px;
}

.news-sec-list li {
    padding: 38px 30px;
    border-bottom: 0.5px solid #D3D6DD;
    opacity: 0;
    transition: all 0.8s;
}

.scrollin .news-sec-list li:nth-child(1) {
    opacity: 1;
    transition-delay: .2s;
}

.scrollin .news-sec-list li:nth-child(2) {
    opacity: 1;
    transition-delay: .4s;
}

.scrollin .news-sec-list li:nth-child(3) {
    opacity: 1;
    transition-delay: .6s;
}

.news-sec-list li:first-child {
    border-top: 0.5px solid #D3D6DD;
}

.news-sec-list-info {
    margin-bottom: 10px;
}

.news-list-date {
    display: inline-block;
    min-width: 7em;
    transform: translateY(2px);
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.2rem;
    letter-spacing: 0.03em;
}

.news-list-category {
    display: inline-block;

}

.news-list-category a {
    display: inline-block;
    padding: 1px 9px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.0rem;
    letter-spacing: 0.03em;
    transform: scale(0.9);
    transform-origin: right bottom;
    background-color: #997E68;
    color: #fff;
}

.news-list-ttl {
    line-height: 2.0;
}

.news-sec-link {
    padding-right: 10px;
    text-align: right;
    transform: translateY(14px);
    opacity: 0;
    transition: all 0.8s;
}

.scrollin .news-sec-link {
    transform: translateY(0);
    opacity: 1;
    transition-delay: .6s;
}

/* slide-img-area */
.slide-img-area {
    position: relative;
}

.slide-img01 {
    width: 100%;
}

.slide-img01 li {
    width: 330px !important;
    height: auto;
}

.slide-img01 img {
    width: 330px !important;
    height: auto;
}

.slide-img-area-copy {
    position: absolute;
    top: calc(50% - 8px);
    left: 40px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.0rem;
    letter-spacing: 0.03em;
    color: #fff;
    transform: scale(0.9);
}








































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


    /* header
----------------------------------------- */
    #header {}

    /* main-visual-area */
    .main-visual-area {
        position: relative;
        width: 100%;
        height: 100vh;
        height: calc(var(--vh, 1vh) * 100);
    }

    .main-visual-area::after {
        display: block;
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        height: calc(var(--vh, 1vh) * 100);
        background: rgba(17, 17, 17, 0.05);
        background-size: cover;
        z-index: -9;
    }

    .bx-wrapper,
    .bx-viewport {}

    .main-visual-slide {
        position: relative;
        z-index: -10;
    }

    .main-visual-slide li {
        width: 100%;
        height: 100vh;
        height: calc(var(--vh, 1vh) * 100);
    }

    .main-visual-slide .m-slide01 {
        background: url(../image/mainvisual01_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide02 {
        background: url(../image/mainvisual02_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide03 {
        background: url(../image/mainvisual03_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide04 {
        background: url(../image/mainvisual04_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide05 {
        background: url(../image/mainvisual05_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide06 {
        background: url(../image/mainvisual06_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-N {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 38%;
        height: auto;
        margin: -21% auto 0 -21%;
    }

    .main-visual-N .st0 {
        opacity: 0.6;
        fill: none;
        stroke: #FFFFFF;
        enable-background: new;
    }

    .main-visual-copy {
        position: absolute;
        bottom: 18%;
        left: 14%;
        width: 12em;
        height: auto;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.2rem;
        letter-spacing: 0.05em;
        color: #fff;
        transform: scale(0.9);
        opacity: 0;
        transition: opacity 1.4s;
    }

    .main-visual-copy.fade-in {
        opacity: .8;
    }

    /* animation lineMove */
    .scroll-line {
        position: absolute;
        right: 30px;
        bottom: 30px;
        width: 1px;
        height: 100px;
        background: rgba(255, 255, 255, 0.3);
        transition: all 1.4s;
    }

    .scroll-line::after {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        width: 1px;
        background: rgba(255, 255, 255, 0.6);
        -webkit-animation: lineMove 3.0s ease infinite;
        animation: lineMove 4.0s ease infinite;
    }

    .mainvisual-copyright {
        display: none;
    }


    /* contents
----------------------------------------- */
    /* sec-ttl */
    .sec-ttl .eng {
        transform: translateY(5px);
        opacity: 0;
        transition: all 0.6s;
    }

    .sec-ttl .jpn {
        transform: translateY(5px);
        opacity: 0;
        transition: all 0.8s;
    }

    /* mission-sec */
    .mission-sec {
        display: flex;
        height: 400px;
    }

    .mission-sec-left {
        width: 60%;
        background: url(../image/mission-img_pc.jpg) center center no-repeat;
        background-size: cover;
        transform: translateY(25px);
        opacity: 0;
        transition: all 1.2s;
    }

    .scrollin .mission-sec-left {
        transform: translateY(0);
        opacity: 1;
    }

    .mission-sec-right {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40%;
    }

    .mission-sec-right-inner {}

    .mission-sec-ttl {
        position: relative;
        margin-bottom: 25px;
        padding-left: 6px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        letter-spacing: 0.03em;
        transform: scale(1);
        transform-origin: left top;
        transform: translateY(15px);
        opacity: 0;
        transition: all 1.2s;
    }

    .scrollin .mission-sec-ttl {
        transform: translateY(0);
        opacity: 1;
    }

    .mission-sec-ttl::before {
        content: "";
        position: absolute;
        left: -25vw;
        top: 9px;
        width: 22vw;
        height: 1px;
        margin: auto;
        background-image: linear-gradient(to right, #999, #999 1px, #999 1px, #999 3px);
        background-size: 3px 1px;
        background-repeat: repeat-x;
        opacity: 0;
        transition: opacity 1.2s;
    }

    .scrollin .mission-sec-ttl::before {
        opacity: 1;
    }

    .mission-sec-copy {
        width: auto;
        font-family: 'Noto Sans JP', sans-serif;
        -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        vertical-align: top;
        letter-spacing: 0.3em;
        line-height: 2.5;
        font-size: 1.1rem;
        transform: scale(1);
        transform-origin: left top;
        transform: translateY(15px);
        opacity: 0;
        transition: all 1.2s;
        transition-delay: .2s;
    }

    .scrollin .mission-sec-copy {
        transform: scale(1);
        transform: translateY(0);
        opacity: 1;
    }

    /* service-sec */
    .service-sec {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row-reverse;
    }

    .service-sec-img-area {
        width: 40%;
        margin-bottom: 0;
        position: static;
    }

    .service-sec-img01 {
        width: 100%;
        height: 550px;
        margin-left: 0;
        background: url(../image/service-img01_pc.jpg) center center no-repeat;
        background-size: cover;
        transform: translateY(25px);
        opacity: 0;
        transition: all 1.0s;
    }

    .scrollin .service-sec-img01 {
        transform: translateY(0);
        opacity: 1;
    }

    .service-sec-img02 {
        position: absolute;
        left: 25%;
        bottom: -200px;
        width: 35%;
        height: 200px;
        margin-left: 0;
        transform: translateY(25px);
        opacity: 0;
        transition: all 1.0s;
        transition-delay: 0s;
    }

    .scrollin .service-sec-img02 {
        transform: translateY(25px);
        opacity: 0;
    }

    .service-sec-img02.scrollin {
        transform: translateY(0);
        opacity: 1;
    }

    .service-sec-cont {
        width: 60%;
        padding-right: 3%;
    }

    .service-sec-cont .sec-ttl {
        margin-bottom: 25px;
        text-align: center;
    }

    .service-sec-figure {
        width: 260px;
        margin: 0 auto 20px;
        transform: translateY(15px);
        opacity: 0;
        transition: all 1.0s;
    }

    .service-sec-cont.scrollin .service-sec-figure {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .2s;
    }

    .service-sec-text {
        margin-bottom: 35px;
        font-size: 1.1rem;
        line-height: 2.3;
        text-align: center;
        transform: translateY(12px);
        opacity: 0;
        transition: all 1.0s;
    }

    .service-sec-cont.scrollin .service-sec-text {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .2s;
    }

    .service-sec-link {
        text-align: center;
        transform: translateY(12px);
        opacity: 0;
        transition: all 1.0s;
    }

    .service-sec-cont.scrollin .service-sec-link {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .5s;
    }

    /* projects-sec */
    .projects-sec {
        position: relative;
        margin-bottom: 105px;
    }

    .projects-sec .sec-ttl {
        margin-bottom: 70px;
        padding-left: 10%;
    }

    .projects-slide-btn {
        position: absolute;
        top: 0;
        right: 60px;
        margin: 0;
        text-align: right;
    }

    .projects-slide-btn .left-btn,
    .projects-slide-btn .right-btn {
        display: inline-block;
        width: 46px;
        height: 46px;
        border-radius: 50%;
        border: 1px solid #ccc;
        opacity: 0;
        transition: all 0.8s;
    }

    .scrollin .projects-slide-btn .left-btn {
        opacity: 1;
    }

    .scrollin .projects-slide-btn .right-btn {
        opacity: 1;
        transition-delay: .15s;
    }

    .projects-slide-btn .left-btn {
        position: relative;
        margin-right: 4px;
    }

    .projects-slide-btn .left-btn::after {
        display: inline-block;
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        margin: -2px 0 0 -2px;
        border-left: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        transform: rotate(45deg);
    }

    .projects-slide-btn .right-btn {
        position: relative;
    }

    .projects-slide-btn .right-btn::after {
        display: inline-block;
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        margin: -2px 0 0 -4px;
        border-top: 1px solid #ccc;
        border-right: 1px solid #ccc;
        transform: rotate(45deg);
    }

    .projects-slide-btn .swiper-button-disabled {
        pointer-events: none;
        opacity: 0.5;
    }

    .swiper-left-btn {
        outline: none;
    }

    .swiper-right-btn {
        outline: none;
    }

    .projects-sec-list-wrap {
        position: relative;
        padding: 0 0 100px 10%;
    }

    .projects-sec-list-wrap::before {
        display: block;
        content: '';
        position: absolute;
        top: 140px;
        left: 0;
        width: 84%;
        height: calc(100% - 140px);
        background-color: #F0F1F3;
        z-index: -1;
    }

    .swiper-container {
        margin-bottom: 60px;
    }

    .projects-sec-list {}

    .projects-sec-list li {
        width: 280px;
        margin-right: 40px;
        vertical-align: top;
        opacity: 0;
        transition: all 1.2s;
    }

    .scrollin .projects-sec-list li:nth-child(7) {
        opacity: 1;
        transition-delay: .1s;
    }

    .scrollin .projects-sec-list li:nth-child(8) {
        opacity: 1;
        transition-delay: .2s;
    }

    .scrollin .projects-sec-list li:nth-child(9) {
        opacity: 1;
        transition-delay: .3s;
    }

    .scrollin .projects-sec-list li:nth-child(10) {
        opacity: 1;
        transition-delay: .4s;
    }

    .scrollin .projects-sec-list li:nth-child(11) {
        opacity: 1;
        transition-delay: .5s;
    }

    .scrollin .projects-sec-list li:nth-child(12) {
        opacity: 1;
        transition-delay: .6s;
    }

    .scrollin .projects-sec-list li {
        opacity: 1;
        transition-delay: .7s;
    }

    .swiper-slide {
        height: auto;
    }

    .projects-sec-list li a {
        display: block;
        height: 100%;
        background-color: #fff;
    }

    .projects-sec-list-img {
        position: relative;
    }

    .projects-sec-list-img-innner {}

    .projects-sec-list-category {
        position: absolute;
        bottom: 10px;
        right: 10px;
        padding: 1px 9px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        letter-spacing: 0.03em;
        transform: scale(0.9);
        transform-origin: right bottom;
        background-color: #111;
        color: #fff;
    }

    .projects-sec-list-body {
        padding: 35px 30px;
    }

    .projects-sec-list-date {
        margin-bottom: 7px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        letter-spacing: 0.03em;
    }

    .projects-sec-list-ttl {
        display: inline-block;
        margin-bottom: 10px;
        font-size: 1.4rem;
    }

    .projects-sec-list-lead {
        font-size: 1.0rem;
        line-height: 2.0;
    }

    .projects-sec-link {
        transform: translateY(14px);
        opacity: 0;
        transition: all 0.8s;
    }

    .projects-sec-list-wrap.scrollin .projects-sec-link {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .6s;
    }


    /* news-sec */
    .news-sec {
        width: 80%;
        margin: 12% auto 140px;
        padding: 0 10px;
    }

    .news-sec .sec-ttl {
        margin-bottom: 60px;
        text-align: center;
    }

    .news-sec-list {
        margin-bottom: 70px;
    }

    .news-sec-list li {
        display: flex;
        padding: 38px 30px;
        border-bottom: 0.5px solid #D3D6DD;
        opacity: 0;
        transition: all 0.8s;
    }

    .scrollin .news-sec-list li:nth-child(1) {
        opacity: 1;
        transition-delay: .2s;
    }

    .scrollin .news-sec-list li:nth-child(2) {
        opacity: 1;
        transition-delay: .4s;
    }

    .scrollin .news-sec-list li:nth-child(3) {
        opacity: 1;
        transition-delay: .6s;
    }

    .news-sec-list li:first-child {
        border-top: 0.5px solid #D3D6DD;
    }

    .news-sec-list-info {
        width: 220px;
        margin-bottom: 0;
    }

    .news-list-date {
        display: inline-block;
        min-width: 8em;
        transform: translateY(2px);
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.2rem;
        letter-spacing: 0.03em;
    }

    .news-list-category {
        display: inline-block;

    }

    .news-list-category a {
        display: inline-block;
        padding: 1px 9px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        letter-spacing: 0.03em;
        transform: scale(0.9);
        transform-origin: right bottom;
        background-color: #997E68;
        color: #fff;
    }

    .news-list-ttl {
        display: inline-block;
        width: calc(100% - 220px);
        transform: translateY(2px);
        line-height: 2.0;
    }

    .news-sec-link {
        padding-right: 10px;
        text-align: right;
        transform: translateY(14px);
        opacity: 0;
        transition: all 0.8s;
    }

    .scrollin .news-sec-link {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .6s;
    }

    /* slide-img-area */
    .slide-img-area {
        position: relative;
    }

    .slide-img01 {
        width: 100%;
    }

    .slide-img01 li {
        width: 380px !important;
        height: auto;
    }

    .slide-img01 img {
        width: 380px !important;
        height: auto;
    }

    .slide-img-area-copy {
        position: absolute;
        top: calc(50% - 8px);
        left: 13%;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        letter-spacing: 0.03em;
        color: #fff;
        transform: scale(1);
    }

}

/* tablet end */



















































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


    /* header
----------------------------------------- */
    #header {
        background: url(../image/shadow.png) 0 0 no-repeat;
        background-size: 100% 240px;
    }

    /* main-visual-area */
    .main-visual-area {
        position: relative;
        width: 100%;
    }

    .main-visual-area::after {
        display: none;

    }

    .bx-wrapper,
    .bx-viewport {}

    .main-visual-slide {
        position: relative;
        z-index: -10;
    }

    .main-visual-slide li {
        width: 100%;
        height: 100vh;
        height: calc(var(--vh, 1vh) * 100);
    }

    .main-visual-slide .m-slide01 {
        background: url(../image/mainvisual01_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide02 {
        background: url(../image/mainvisual02_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide03 {
        background: url(../image/mainvisual03_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide04 {
        background: url(../image/mainvisual04_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide05 {
        background: url(../image/mainvisual05_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-slide .m-slide06 {
        background: url(../image/mainvisual06_pc.jpg) center center no-repeat;
        background-size: cover;
    }

    .main-visual-N {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 380px;
        height: auto;
        margin: -205px auto 0 -210px;
    }

    .main-visual-N .st0 {
        opacity: 0.5;
        fill: none;
        stroke: #FFFFFF;
        enable-background: new;
    }

    .main-visual-copy {
        position: absolute;
        bottom: 40%;
        left: 10%;
        width: 22em;
        height: auto;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.3rem;
        letter-spacing: 0.05em;
        color: #fff;
        transform: scale(1);
        opacity: 1.0;
        opacity: 0;
        transition: opacity 1.4s;
    }

    .main-visual-copy.fade-in {
        opacity: .8;
    }

    /* animation lineMove */
    .scroll-line {
        position: absolute;
        right: auto;
        left: 50px;
        bottom: 40px;
        width: 1px;
        height: 100px;
        background: rgba(255, 255, 255, 0.3);
        transition: all 1.4s;
    }

    .scroll-line::after {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        width: 1px;
        background: rgba(255, 255, 255, 0.6);
        -webkit-animation: lineMove 3.0s ease infinite;
        animation: lineMove 4.0s ease infinite;
    }

    .mainvisual-copyright {
        display: inline-block;
        position: absolute;
        bottom: 35px;
        right: 45px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        transform: scale(0.9);
        color: #fff;
        letter-spacing: 0.04em;
        opacity: .5;
        z-index: 100;

    }


    /* contents
----------------------------------------- */
    /* sec-ttl */
    .sec-ttl .eng {
        transform: translateY(0);
        opacity: 0;
        transition: all 1.2s;
    }

    .sec-ttl .jpn {
        transform: translateY(0);
        opacity: 0;
        transition: all 1.2s;
    }

    /* mission-sec */
    .mission-sec {
        display: flex;
        height: 660px;
    }

    .mission-sec-left {
        width: 64%;
        background: url(../image/mission-img_pc.jpg) center center no-repeat;
        background-size: cover;
        transform: translateY(0);
        opacity: 0;
        transition: all 2.0s;
    }

    .scrollin .mission-sec-left {
        transform: translateY(0);
        opacity: 1;
    }

    .mission-sec-right {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36%;
    }

    /* ie11 */
    _:-ms-lang(x)::-ms-backdrop,
    .mission-sec-right {
        margin-top: 220px;
        align-items: stretch;
        justify-content: stretch;
    }

    .mission-sec-right-inner {
        margin-top: -38px;
    }

    .mission-sec-ttl {
        position: relative;
        margin-bottom: 55px;
        padding-left: 0;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.2rem;
        letter-spacing: 0.03em;
        transform: scale(1);
        transform-origin: left top;
        transform: translateY(0);
        opacity: 0;
        transition: all 1.5s;
        transition-delay: .3s;
    }

    .scrollin .mission-sec-ttl {
        transform: translateY(0);
        opacity: 1;
    }

    .mission-sec-ttl::before {
        content: "";
        position: absolute;
        left: -17vw;
        top: 9px;
        width: 12vw;
        height: 1px;
        margin: auto;
        background-image: linear-gradient(to right, #999, #999 1px, #999 1px, #999 3px);
        background-size: 3px 1px;
        background-repeat: repeat-x;
        opacity: 0;
        transition: opacity 1.5s;
        transition-delay: 0;
    }

    .scrollin .mission-sec-ttl::before {
        opacity: 1;
    }

    .mission-sec-copy {
        width: auto;
        font-family: 'Noto Sans JP', sans-serif;
        -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        vertical-align: top;
        letter-spacing: 0.3em;
        line-height: 2.8;
        font-size: 1.4rem;
        transform: scale(1);
        transform-origin: left top;
        transform: translateY(0);
        opacity: 1;
        transition: all 1.5s;
        transition-delay: .6s;
    }

    .mission-sec-copy span {
        display: inline-block;
        transform: translateY(0);
        transform: translateY(0);
        opacity: 0;
        transition: all 1.5s;
    }

    .scrollin .mission-sec-copy .copy1 {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .1s;
    }

    .scrollin .mission-sec-copy .copy2 {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .25s;
    }

    .scrollin .mission-sec-copy .copy3 {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .4s;
    }

    .scrollin .mission-sec-copy .copy4 {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .55s;
    }

    .scrollin .mission-sec-copy {
        transform: scale(1);
        opacity: 1;
    }

    /* service-sec */
    .service-sec {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row-reverse;
    }

    .service-sec-img-area {
        width: 36%;
        margin-bottom: 0;
        position: static;
    }

    .service-sec-img01 {
        width: 100%;
        height: 800px;
        margin-left: 0;
        background: url(../image/service-img01_pc.jpg) center center no-repeat;
        background-size: cover;
        transform: translateY(0);
        opacity: 0;
        transition: all 2.0s;
    }

    .scrollin .service-sec-img01 {
        transform: translateY(0);
        opacity: 1;
    }

    .service-sec-img02 {
        position: absolute;
        left: calc(64% - 460px);
        bottom: -360px;
        width: 460px;
        height: 360px;
        margin-left: 0;
        transform: translateY(0);
        opacity: 0;
        transition: all 2.0s;
        transition-delay: 0.5s;
    }

    .scrollin .service-sec-img02 {
        transform: translateY(0);
        opacity: 1;
    }

    .service-sec-img02.scrollin {
        transform: translateY(0);
        opacity: 1;
    }

    .service-sec-cont {
        width: 64%;
        margin: 35px 0 0 0;
        padding-right: 3%;
    }

    .service-sec-cont-inner {
        width: 480px;
        margin: 0 auto;
        transform: translateX(20px)
    }

    .service-sec-cont .sec-ttl {
        margin-bottom: 60px;
        text-align: center;
    }

    .service-sec-figure {
        width: 436px;
        margin: 0 auto 40px;
        transform: translateY(15px);
        opacity: 0;
        transition: all 1.2s;
    }

    .service-sec-cont.scrollin .service-sec-figure {
        transform: translateY(0);
        opacity: 0;
        transition-delay: .2s;
    }

    .scrollin .service-sec-cont .service-sec-figure {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .2s;
    }

    .service-sec-text {
        margin-bottom: 65px;
        padding: 0 30px;
        font-size: 1.2rem;
        line-height: 2.3;
        text-align: left;
        transform: translateY(15px);
        opacity: 0;
        transition: all 1.5s;
    }

    .service-sec-cont.scrollin .service-sec-text {
        transform: translateY(0);
        opacity: 0;
        transition-delay: .4s;
    }

    .scrollin .service-sec-cont .service-sec-text {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .4s;
    }

    .service-sec-text br {
        display: none;
    }

    .service-sec-link {
        padding-right: 0;
        text-align: center;
        transform: translateY(15px);
        opacity: 0;
        transition: all 1.5s;
    }

    .service-sec-cont.scrollin .service-sec-link {
        transform: translateY(0);
        opacity: 0;
        transition-delay: .5s;
    }

    .scrollin .service-sec-cont .service-sec-link {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .5s;
    }

    /* projects-sec */
    .projects-sec {
        position: relative;
        margin-bottom: 180px;
    }

    .projects-sec .sec-ttl {
        margin-bottom: 80px;
        padding-left: 12.8%;
    }

    .projects-slide-btn {
        position: absolute;
        top: 0;
        right: 120px;
        margin: 0;
        text-align: right;
    }

    .projects-slide-btn .left-btn,
    .projects-slide-btn .right-btn {
        display: inline-block;
        width: 46px;
        height: 46px;
        border-radius: 50%;
        border: 1px solid #ccc;
        opacity: 0;
        transition: all 1.2s;
    }

    .scrollin .projects-slide-btn .left-btn {
        opacity: 1;
    }

    .scrollin .projects-slide-btn .right-btn {
        opacity: 1;
        transition-delay: .2s;
    }

    .projects-slide-btn .left-btn:hover,
    .projects-slide-btn .right-btn:hover {
        border: 1px solid #999;
    }

    .projects-slide-btn .left-btn {
        position: relative;
        margin-right: 6px;
    }

    .projects-slide-btn .left-btn::after {
        display: inline-block;
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        margin: -2px 0 0 -2px;
        border-left: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        transform: rotate(45deg);
        transition: all .3s;
    }

    .projects-slide-btn .left-btn:hover::after {
        border-left: 1px solid #999;
        border-bottom: 1px solid #999;
    }

    .projects-slide-btn .right-btn {
        position: relative;
    }

    .projects-slide-btn .right-btn::after {
        display: inline-block;
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 5px;
        height: 5px;
        margin: -2px 0 0 -4px;
        border-top: 1px solid #ccc;
        border-right: 1px solid #ccc;
        transform: rotate(45deg);
        transition: all .3s;
    }

    .projects-slide-btn .right-btn:hover::after {
        border-top: 1px solid #999;
        border-right: 1px solid #999;
    }

    .projects-slide-btn .swiper-button-disabled {
        pointer-events: none;
        opacity: 0.5;
    }

    .swiper-left-btn {
        outline: none;
    }

    .swiper-right-btn {
        outline: none;
    }

    .projects-sec-list-wrap {
        position: relative;
        padding: 0 0 120px 12.8%;
    }

    .projects-sec-list-wrap::before {
        display: block;
        content: '';
        position: absolute;
        top: 140px;
        left: 0;
        width: 84%;
        height: calc(100% - 140px);
        background-color: #F0F1F3;
        z-index: -1;
    }

    .swiper-container {
        margin-bottom: 80px;
    }

    .projects-sec-list {}

    .projects-sec-list li {
        width: 430px;
        margin-right: 35px;
        vertical-align: top;
        transform: translateY(15px);
        opacity: 0;
        transition: all 1.2s;
    }

    .scrollin .projects-sec-list li:nth-child(7) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .1s;
    }

    .scrollin .projects-sec-list li:nth-child(8) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .2s;
    }

    .scrollin .projects-sec-list li:nth-child(9) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .3s;
    }

    .scrollin .projects-sec-list li:nth-child(10) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .4s;
    }

    .scrollin .projects-sec-list li:nth-child(11) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .5s;
    }

    .scrollin .projects-sec-list li:nth-child(12) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .6s;
    }

    .scrollin .projects-sec-list li {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .7s;
    }

    .swiper-slide {
        height: auto;
    }

    .projects-sec-list li a {
        display: block;
        height: 100%;
        background: #fff;
    }

    .projects-sec-list-img {
        position: relative;
    }

    .projects-sec-list-img-inner {
        overflow: hidden;
    }

    .projects-sec-list-img-inner img {
        transform: scale3d(1, 1, 1);
        transition: all .8s;
    }

    .projects-sec-list li a:hover .projects-sec-list-img-inner img {
        transform: scale3d(1.08, 1.08, 1.068);
    }

    .projects-sec-list-category {
        position: absolute;
        bottom: 10px;
        right: 10px;
        padding: 1px 10px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        letter-spacing: 0.03em;
        transform: scale(1);
        transform-origin: right bottom;
        background-color: #111;
        color: #fff;
    }

    .projects-sec-list-body {
        padding: 38px 40px;
    }

    .projects-sec-list-date {
        margin-bottom: 9px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.2rem;
        letter-spacing: 0.03em;
    }

    .projects-sec-list-ttl {
        display: inline-block;
        margin-bottom: 12px;
        font-size: 1.8rem;
    }

    .projects-sec-list-lead {
        font-size: 1.3rem;
        line-height: 2.1;
    }

    .projects-sec-link {
        transform: translateY(0);
        opacity: 0;
        transition: all 0.8s;
    }

    .projects-sec-list-wrap.scrollin .projects-sec-link {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .6s;
    }

    /* news-sec */
    .news-sec {
        width: 72%;
        max-width: 1040px;
        margin: 12% auto 200px;
        padding: 0 10px;
    }

    .news-sec .sec-ttl {
        margin-bottom: 100px;
        text-align: center;
    }

    .news-sec-list {
        margin-bottom: 85px;
    }

    .news-sec-list li {
        display: flex;
        padding: 53px 50px;
        border-bottom: 0.5px solid #D3D6DD;
        transform: translateY(0);
        opacity: 0;
        transition: all 1.0s;
    }

    .scrollin .news-sec-list li:nth-child(1) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .1s;
    }

    .scrollin .news-sec-list li:nth-child(2) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .2s;
    }

    .scrollin .news-sec-list li:nth-child(3) {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .3s;
    }

    .news-sec-list li:first-child {
        border-top: 0.5px solid #D3D6DD;
    }

    .news-sec-list-info {
        width: 280px;
        margin-bottom: 0;
    }

    .news-list-date {
        display: inline-block;
        min-width: 10em;
        transform: translateY(2px);
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.4rem;
        letter-spacing: 0.03em;
    }

    .news-list-category {
        display: inline-block;

    }

    .news-list-category a {
        display: inline-block;
        padding: 1px 9px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.0rem;
        letter-spacing: 0.03em;
        transform: scale(1);
        transform-origin: right bottom;
        background-color: #997E68;
        color: #fff;
        transition: all .3s;
    }

    .news-list-category a:hover {
        background-color: #666;
        color: #fff;
    }

    .news-list-ttl {
        display: inline-block;
        width: calc(100% - 280px);
        transform: translateY(0);
        line-height: 2.0;
        font-size: 1.3rem;
        transition: color .3s;
    }

    .news-list-ttl:hover {
        color: #999;
    }

    .news-sec-link {
        padding-right: 0;
        text-align: right;
        transform: translateY(0);
        opacity: 0;
        transition: all 0.8s;
    }

    .scrollin .news-sec-link {
        transform: translateY(0);
        opacity: 1;
        transition-delay: .6s;
    }

    /* slide-img-area */
    .slide-img-area {
        position: relative;
    }

    .slide-img01 {
        width: 100%;
    }

    .slide-img01 li {
        width: 700px !important;
        height: auto;
    }

    .slide-img01 img {
        width: 700px !important;
        height: auto;
    }

    .slide-img-area-copy {
        position: absolute;
        top: calc(50% - 20px);
        left: 12%;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        font-size: 1.4rem;
        letter-spacing: 0.03em;
        color: #fff;
        transform: scale(1);
    }

}

/* PC end */




/* IE11 */
@media all and (-ms-high-contrast:none) {

    *::-ms-backdrop,
    .main-visual-N {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 380px;
        height: 407px;
        margin: -205px auto 0 -210px;
    }

}

#contents {
    background-color: #e6e3df;
}

.page-bottom-link {
    background: #e6e3df;
}