/**************************************************

BASE

****************************************************/


/* hero-home slider */

.hero-image{
    overflow: hidden;
    position: relative;
    background:#EDF6FD;
}

#topVisual{
    padding-bottom:30px;
}

#topVisual > div{
    overflow: hidden;
}

#topVisual img{
  display: block;
  width: 100%;
  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:#BBBBBB;
}

body .slick-dots li.slick-active button::before{
    color:#E63A33;
}

body .slick-dotted.slick-slider{
    margin-bottom:0;
}

/* title */

.title{
    margin-bottom:20px;
}

.title small{
    display: block;
    font-size:1.6rem;
    color:#133886;
    margin-bottom:10;
}

.title span{
    font-size:3.4rem;
}


/*************************************************

CONTENTS

****************************************************/

/* section-1 */

.section-1{
    padding:60px 0 100px;
    background:url(../../../../../wp-content/uploads/2021/05/bg_home1-scaled.jpg) no-repeat 50% 50% / cover;
}

.section-1__img{
    flex-basis: 43%;
}

.section-1__txt{
    flex-basis: 50%;
}

.section-1 .catch,
.section-3 .catch{
    margin-bottom: 15px;
    font-size:2.5rem;
    color:#E63A33;
    display: block;
}

.wrap-btn{
    margin-top: 30px;
}


/* section-2 */

.section-2{
    padding:70px 0 90px;
    background:url(../../../../../wp-content/uploads/2021/05/bg_home2-scaled.jpg) no-repeat 50% 50% / cover;
}

.section-2 .card{
    flex-basis: 50%;
    padding:0 70px;
    box-sizing: border-box;
}

.section-2 .card img{
    max-width: 450px;
    width:100%;
}

.section-2 .title small,
.section-2 .title span,
.section-5 .title small,
.section-5 .title span,
.section-5 p{
    color:#fff;
}

.section-2 .catch{
    color:#fff;
    font-size:1.8rem;
    margin-bottom: 35px;
    display: block;
}

/* section-3 */

.section-3{
    padding:115px 0;
}

.section-3__img{
    flex-basis: 57%;
}

.section-3__txt{
    flex-basis: 38%;
}

/* aside-1 */

.aside-1{
    padding:100px 0;
    background:#133886;
}

.aside-1 .card{
    flex-basis: 50%;
    box-sizing: border-box;
    padding:0 40px;
}

.aside-1 .card a{
    display: block;
    text-decoration: none;
    position: relative;
}

.aside-1 .card a div{
    position: absolute;
    top:20px;
    left:0;
    right:0;
    font-weight: bold;
    text-align: center;
}

.aside-1 .card a div small{
    font-size:1.6rem;
    color:#133886;
    display: block;
}

.aside-1 .card a div span{
    font-size:3.4rem;
}

/* section-4 */

.section-4{
    padding:90px 0 100px;
}

.section-4 .card{
    flex-basis: 30%;
}

.section-4 .card a{
    display: block;
    text-decoration: none;
    position: relative;
    padding:0 0 30px;
}

.section-4 .card a span{
    position: absolute;
    left:50%;
    transform: translateX(-50%);
    bottom:0;
    display: block;
    width:260px;
    line-height:60px;
    font-size:1.6rem;
    font-weight:bold;
    color:#fff;
    text-align: center;
    background:url(../../../../../wp-content/uploads/2021/05/ico_arrow_white.png) no-repeat 16px center #E63A33;
    background-size: 11px auto;
}

.section-4 .card a:hover{
    opacity: 1;
}

.section-4 .card a figure{
    overflow: hidden;
}

.section-4 .card:nth-child(2) a figure{
    border:1px solid #ddd;
}

.section-4 .card a figure img{
    transition: all 0.3s;
}

.section-4 .card a:hover figure img{
    transform:scale(1.1,1.1)
}

.section-4 .btn-anniversary{
    margin-top:60px;
}

.section-4 .btn-anniversary img{
    max-width:760px;
    width:100%;
}

/* section-5 */

.section-5{
    padding:70px 0 90px;
    background:url(../../../../../wp-content/uploads/2021/05/bg_home3-scaled.jpg) no-repeat 50% 50% / cover;
}

.section-5__img{
    flex-basis: 45%;
}

.section-5__txt{
    flex-basis: 50%;
}

.section-5__txt .wrap-btn li{
    display: inline-block;
}

.section-5__txt .wrap-btn li + li{
    margin-left: 10px;
}

.section-5__txt .wrap-btn li .button{
    min-width: 170px;
}

/* aside-2 */

.aside-2{
    padding:80px 0;
}

.aside-2 .news-list{
    flex-basis: 80%;
}

.aside-2 .title{
    margin:0;
}

.aside-2 .news-list li{
    margin-bottom:15px;
    font-size:1.8rem;
}

.aside-2 .news-list li time{
    font-weight:bold;
    color:#133886;
    margin-right:25px;
}

.more-link{
    font-size:1.8rem;
    font-weight:bold;
    color:#133886;
    float:right;
}


/* Responsive
*********************************************************/

/* Tablet side Only */
@media screen and (min-width:829px) and (max-width:1200px) {
    .section-3__img {
        flex-basis: 48%;
    }

    .section-3__txt {
        flex-basis: 46%;
    }

    .aside-1 .card a div span {
        font-size: 2.3rem;
    }

    .section-5__txt .wrap-btn li .button {
        min-width: 120px;
        padding: 0 15px 0 40px;
    }
}

/* Smartphone side + Tablet Vertical */
@media screen and (max-width:828px) {
    .title {
        text-align: center;
    }

    .title span {
        font-size: 2.3rem;
    }

    .title small{
        font-size:1.4rem;
    }

    .section-1 .catch, .section-3 .catch {
        font-size: 2rem;
        text-align: center;
    }

    .section-1,
    .section-2,
    .section-3,
    .aside-1,
    .section-4,
    .section-5,
    .aside-2{
        padding:40px 0;
    }

    .section-2 .card {
        padding: 0 50px;
    }

    .section-3 .flex,
    .section-5 .flex,
    .section-1 .flex{
        flex-direction: column;
    }

    .section-3__img{
        margin-bottom: 20px;
    }

    .wrap-btn{
        text-align: center;
    }

    .aside-1 .card {
        padding: 0 20px;
    }

    .aside-1 .card a div {
        position: absolute;
        top: 12px;
        left: 0;
        right: 0;
        font-weight: bold;
        text-align: center;
    }

    .aside-1 .card a div small {
        font-size: 1.3rem;
        color: #133886;
        display: block;
    }

    .aside-1 .card a div span {
        font-size: 2rem;
    }

    .section-4 .card a span{
        width:100%;
    }

    .section-4 .btn-anniversary {
        margin-top: 40px;
    }

    .section-3__img img,
    .section-5__img img{
        max-width: 600px;
        width: 100%;
        margin:0 auto;
    }

    .section-1__img img{
        max-width: 400px;
        width: 100%;
        margin:0 auto;
    }

    .section-5__img,
    .section-1__img{
        margin-bottom: 20px;
    }

    .aside-2 .news-list li time{
        display: block;
    }

}

.spOn{
    display: none!important;
}

/* Smartphone Vertical */
@media screen and (max-width:415px) {
    .spOn{
        display: block!important;
    }
    .spOff{
        display: none!important;
    }

    .section-2 .card {
        padding: 0 10px;
    }

    .aside-1 .flex,
    .section-4 .flex{
        flex-direction: column;
    }

    .aside-1 .card + .card{
        margin-top:30px;
    }

    .aside-1 .card {
        padding: 0;
    }

    .section-4 .card + .card {
        margin-top:20px;
    }

    .section-5__txt .wrap-btn li {
        display: block;
    }

    .section-5__txt .wrap-btn li + li {
        margin: 10px 0 0 0;
    }

    .section-5__txt .wrap-btn li .button {
        min-width: 270px;
    }

    .aside-2 .flex{
        flex-direction: column;
    }

    .aside-2 .title{
        margin-bottom:20px;
    }
}