/**************************************************

BASE

****************************************************/


/* hero-home slider */

.hero-image{
    overflow: hidden;
    position: relative;
    margin-bottom:20px;
}

#topVisual{
    padding-bottom:30px;
}

#topVisual > div{
    overflow: hidden;
}

#topVisual img{
    display: block;
    width: 100vw;
    height: auto;
}

body .slick-dots{
    left: 50%;
    max-width: 1200px;
    transform: translateX(-50%);
    bottom:0;
    z-index:10;
}

body .slick-dots li{
    width:15px;
    height:15px;
    margin:0 10px;
}

body .slick-dots li button{
    width:15px;
    height:15px;
    line-height:5px!important;
}

body .slick-dots li button::before{
    opacity: 1;
    line-height:15px!important;
    width:15px;
    height:15px;
    font-size:15px;
    color:#E8F1FC;
}

body .slick-dots li.slick-active button::before{
    color:#0652B7;
    opacity: 1;
}

body .slick-dotted.slick-slider{
    margin-bottom:0;
}


/*************************************************

CONTENTS

****************************************************/

/* section-1 */

.section-1__title{
    background:url(../../../../../wp-content/uploads/2021/03/bg_home1-scaled.jpg) no-repeat 50% 50% / cover;
    padding:40px 15px;
    overflow: hidden;
    color:#fff;
}
/*
.section-1__title h2{
    color:rgba(255, 255, 255, 0);
    text-shadow: -1px -1px 0 #fff,
    1px 1px 0 #fff,
    1px 1px 0 #fff,
    -1px -1px 0 #fff;
    font-size:5rem;
}
*/

.section-1__title span{
    font-size:3.6rem;
    font-weight:bold;
    display: block;
    margin-bottom:15px;
}

.section-1__title h2 img{
    max-width:352px;
    width:100vw;
}

.section-1 .section-1__con{
    background:url(../../../../../wp-content/uploads/2021/03/bg_home3.jpg) no-repeat 50% 50% / cover;
    padding:0 0 60px 0;

}

.section-1 .container{
    padding:0 71px;
    background:url(../../../../../wp-content/uploads/2021/03/bg_home2.png) no-repeat 80px 100px / 1100px auto;
    height:767px;
}

.section-1 .flex{
    flex-wrap: wrap;
}

.section-1 .card{
    flex-basis: 22%;
    padding-top:60px;
}

.section-1 .card:nth-child(2){
    flex-basis: 50%;
}

.section-1 .card__img{
    overflow: hidden;
    border-radius: 50%;
    width:250px;
}

.section-1 .card__img img,
.section-3 .card__img img,
.section-2 .works-post dt img{
    transition: all 0.3s;
}

.section-1 a:hover .card__img img,
.section-3 a:hover .card__img img,
.section-2 .works-post a:hover dt img{
    transform:scale(1.1,1.1)
}

.section-1 .flex a:hover,
.section-3 .flex a:hover,
.section-2 .works-post a:hover{
    opacity: 1;
}

.section-1 .card a{
    display: inline-block;
    text-decoration: none;
    padding:20px 0 0 0;
    max-width: 250px;
    position: relative;
}

.section-1 .card a span{
    display: block;
    background: #fff;
    line-height:50px;
    border-radius: 25px;
    border:1px solid #E93578;
    box-sizing: border-box;
    font-size:1.8rem;
    color:#E93578;
    font-weight: bolder;
    position: absolute;
    top:0;
    left:0;
    right:0;
}

.section-1 .card a::before {
    display: block;
    content: '';
    width: 1px;
    height: 10px;
    border-top: 10px solid #fff;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid transparent;
    position: absolute;
    top: 50px;
    left: 50%;
    z-index: 1;
    transform: translateX(-50%);
}

.section-1 .card a::after {
    display: block;
    content: '';
    width: 1px;
    height: 10px;
    border-top: 10px solid #E93578;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid transparent;
    position: absolute;
    top: 51px;
    left: 50%;
    transform: translateX(-50%);
}

.wrap-btn{
    margin-top:40px;
}

/* section-2 */

.section-2{
    overflow: hidden;
    padding:75px 0 60px;
    position: relative;
    background: url(../../../../../wp-content/uploads/2021/03/bg_home4.png) no-repeat right bottom -2px / 657px auto;
}

.section-2.is-style1 {
    background-image: url(../../../../../wp-content/uploads/2026/05/bg_construction.png);
    background-position-y: bottom -12px;
}

.section-2 .works-post{
    padding:0 30px;
}

.section-2 .works-post a{
    text-decoration: none;
    display: block;
    min-height: 518px;
    overflow: hidden;
    border-radius: 30px;
    max-width: 580px;
    background:#E8F1FC;
}

.section-2 .works-post dt{
    overflow: hidden;
}

.section-2 .works-post dt img {
    width: auto;
    height: 360px;
    max-width: none;
}

.section-2 .works-post dd{
    padding:30px;
    box-sizing: border-box;
}

.section-2 .works-post strong{
    font-size:2rem;
}

.worksSlider{
    padding-bottom:45px;
}

.worksSlider .slick-dots li button::before{
    color:#FFEBF3;
    opacity: 1;
}

.worksSlider .slick-dots li.slick-active button::before{
    color:#E93578;
    opacity: 1;
}

.termtag {
    margin-bottom: 15px;
}

.termtag small{
    display: inline-block;
    background:#0652B7;
    color:#fff;
    font-size: 1.6rem;
    font-weight: bold;
    padding: 0 20px 3px;
    border-radius: 15px;
    margin:0 10px 0 0;
}

.section-2::before{
    content:'';
    position: absolute;
    left:0;
    top:0;
    bottom:0;
    width:50%;
    background:#0652B7;
    display: block;
    z-index: -1;
}

.section-2__title,
.section-3__title{
    margin-bottom: 40px;
}

.section-2__title img{
    max-width:198px;
}

.section-2__title small,
.section-3__title small{
    color:#fff;
    display: block;
    font-size:1.6rem;
    margin-top:20px;
}

/* section-3 */

.section-3{
    padding:75px 0 100px;
    background: url(../../../../../wp-content/uploads/2021/03/bg_home4-scaled.jpg) no-repeat 50% 50% / cover;
}

.section-3 a{
    display: block;
    border-radius: 30px;
    text-decoration: none;
    overflow: hidden;
}

.section-3__title img{
    max-width:197px;
}

.section-3 .card {
    flex-basis: 19%;
}

.section-3 .card__img{
    overflow: hidden;
}

.section-3 .card span{
    background:url(../../../../../wp-content/uploads/2021/03/ico_arrow_right_white.png) no-repeat right 20px center #0652B7;
    background-size:16px auto;
    color:#fff;
    font-weight:bold;
    font-size:1.6rem;
    display:block;
    line-height:60px;
}

/* section-4 */

.section-4{
    padding:75px 0 100px;
}

.section-4 .inner{
    padding:40px 50px 0;
    background: url(../../../../../wp-content/uploads/2021/03/bg_home4-1.png) no-repeat 50% 50% / contain;
}

.section-4__title img{
    max-width:371px;
    width:100vw;
}

.section-4__title{
    margin-bottom:30px;
}

.section-4__catch{
    font-size:2.4rem;
    color:#0652B7;
}


.section-4__img{
    flex-basis: 56%;
}

.section-4__txt{
    flex-basis: 36%;
}

.section-4 .wrap-btn{
    margin-top:25px;
}

/* aside-1 */

.aside-1{
    padding:60px 0;
    background:#E8F1FC;
}

.aside-1__title{
    flex-basis: 21%;
}

.aside-1__list{
    flex-basis: 75%;
}

.aside-1__list li{
    padding:25px 30px;
    background: #fff;
    border-radius: 30px;
    font-size:1.6rem;
}

.aside-1__list li a{
    text-decoration: none;
}

.aside-1__list li time{
    color:#006CD2;
    margin-right: 30px;
}

.aside-1__list li + li{
    margin-top:10px;
}

.aside-1__title img{
    max-width: 201px;
    width: 100vw;
}
.aside-1__title small{
    display: block;
    margin:19px 0 0 0;
    font-size: 1.6rem;
    color:#0652B7;
}

.more-link{
    font-size:1.6rem;
    text-decoration: none;
    font-weight:bold;
    float:right;
    margin-top:20px;
}

.more-link img{
    margin-right: 10px;
    width:16px;
    height:16px;
}


/* Responsive
*********************************************************/

.spOn{
    display: none!important;
}

/* Tablet side */
@media screen and (max-width:1200px) {

    .section-1 a:hover .card__img img,
    .section-2 .works-post a:hover dt img,
    .section-3 a:hover .card__img img{
        transform:scale(1,1)
    }

}

/* Tablet side Only */
@media screen and (min-width:829px) and (max-width:1200px) {

    .section-1 .card,
    .section-1 .card:nth-child(2){
        flex-basis: 30%;
        padding-top: 50px;
    }

    .section-1 .card a {
        max-width: 220px;
    }

    .section-1 .card__img{
        width: 220px;
    }

    .section-1 .container {
        max-width: 1080px;
        height:690px;
        padding: 0 15px;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home2.png) no-repeat left 63px top 90px / 1000px auto;
    }

    .section-2 {
        padding: 75px 0 120px;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home4.png) no-repeat right bottom -2px / 450px auto;
    }

    .section-3 .card span {
        font-size: 1.2rem;
        padding: 0 40px;
    }

    .section-4__title img {
        max-width: 200px;
        width: 100vw;
    }
    .section-4__title {
        margin-bottom: 20px;
    }

    .section-4__catch {
        font-size: 2rem;
    }
}

/* Smartphone side + Tablet Vertical */
@media screen and (max-width:828px) {
    .section-1__title span{
        font-size:3rem;
    }

    .section-1 .card{
        flex-basis: 50%;
        padding:0 0 110px 0;
    }

    .section-1 .card:nth-child(5),
    .section-1 .card:nth-child(6){
        padding:0;
    }

    .section-1__title {
        background: url(../../../../../wp-content/uploads/2021/03/bg_home1_sp.png) no-repeat 50% 50% / cover;
    }

    .section-1 .container {
        padding: 0;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home2_sp.png) no-repeat 50% 120px / auto 900px;
        max-width: 760px;
        height: 1200px;
    }

    .section-1 .card,
    .section-1 .card:nth-child(2){
        flex-basis: 250px;
    }

    .section-1 .flex {
        flex-wrap: wrap;
        max-width: 590px;
        margin: 60px auto 0;
    }

    .section-2{
        padding:40px 0 140px;
    }

    .section-2.is-style1 {
        background-size: 500px;
    }

    .section-2::before {
        right: 0;
        bottom: auto;
        width: 100%;
        height: 60%;
    }

    .section-3 a {
        border-radius: 15px;
    }

    .section-2__title, .section-3__title {
        text-align: center;
    }

    .section-3 {
        padding: 40px 0 10px;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home4_sp.jpg) no-repeat 50% 50% / cover;
    }

    .section-3 .flex{
        flex-wrap: wrap;
        justify-content: center;
    }

    .section-3 .card {
        flex-basis: 33%;
        margin-bottom: 30px;
        padding: 0 20px;
    }

    .section-4,
    .aside-1 {
        padding: 40px 0;
    }

    .section-4 .flex,
    .aside-1 .flex{
        flex-direction: column;
    }

    .section-4 .inner {
        padding: 80px 50px 0;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home4-1_sp.png) no-repeat top center / 100% auto;
        max-width: 500px;
        margin: 0 auto;
    }

    .section-4__title{
        text-align: center;
    }

    .section-4 .wrap-btn {
        margin-top: 25px;
        text-align: center;
    }

    .section-4 .wrap-btn .button {
        min-width: auto;
        display: block;
    }

    .aside-1__title {
        text-align: center;
        margin-bottom: 30px;
    }

    .aside-1__list li time{
        display: block;
    }

    .section-3 .card span {
        font-size: 1.4rem;
    }
}

/* Smartphone Vertical */
@media screen and (max-width:415px) {

    .spOn{
        display: block!important;
    }

    .spOff{
        display: none!important;
    }

    .termtag small {
        font-size: 1.5rem;
        padding-inline: 16px;
        margin-right: 0;
    }

    .section-1__title span {
        font-size: 2.3rem;
    }

    .section-1__title h2 img {
        max-width: 250px;
        width: 100vw;
    }

    .section-1 .card a{
        max-width: none;
    }

    .section-1 .card{
        padding: 0 0 65px 0;
    }

    .section-1 .card__img {
        width: auto;
    }

    .section-1 .card, .section-1 .card:nth-child(2) {
        flex-basis: 47%;
    }

    .section-1 .flex {
        max-width: 340px;
        margin: 40px auto 0;
    }

    .section-1 .container {
        padding: 0;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home2_sp.png) no-repeat 50% 90px / 350px auto;
        max-width:330px;
        height: 805px;
    }

    .section-1 .card a span {
        line-height: 40px;
        font-size: 1.2rem;
    }

    .section-1 .card a::before{
        top:40px;
    }

    .section-1 .card a::after{
        top:41px;
    }

    .section-2 .works-post a {
        text-decoration: none;
        display: block;
        min-height: auto;
        overflow: hidden;
        border-radius: 15px;
        max-width: 320px;
        min-height: 420px;
    }

    .section-2 .works-post dt img {
        width: 100%;
        height: 250px;
        max-width: none;
        object-fit: cover;
    }

    .section-2 .works-post dd{
        padding: 20px;
    }

    .section-2 {
        padding: 40px 0 80px;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home4.png) no-repeat right bottom -2px / 280px auto;
    }

    .section-2.is-style1 {
        background-size: contain;
    }

    .section-2::before {
        height: 50%;
    }

    .section-3 .card {
        flex-basis: 50%;
        padding: 0 10px;
    }

    .section-3 .flex {
        justify-content: space-between;
    }

    .section-4__title img {
        max-width: 250px;
        width: 100vw;
    }

    .section-4 .inner {
        padding: 80px 10px 0;
        background: url(../../../../../wp-content/uploads/2021/03/bg_home4-1_sp.png) no-repeat top center / 100% auto;
        max-width: 345px;
        margin: 0 auto;
        height: 455px;
    }

    .section-4__catch {
        font-size: 1.8rem;
    }

    .aside-1__title img {
        max-width: 150px;
        width: 100vw;
    }

    .section-1 .section-1__con {
        background: url(../../../../../wp-content/uploads/2021/03/bg_home3_sp.jpg) no-repeat 50% 50% / cover;
        padding: 0 0 40px 0;
    }

    .section-3 .card span {
        font-size: 1.4rem;
        line-height: 1.7;
        padding: 10px 40px 10px 10px;
    }

}
