/* Visual */
.visual { position: relative; }
.visual-text {z-index: 10; position: absolute; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); display: flex; align-items: center; justify-content: center;}
.visual-text img { margin: 0 auto; }
.visual-slide { display: hidden; height: 980px; }
.visual-slide.slick-initialized { display: block; }
.visual-slide .slick-prev { z-index: 15; left: 95px; width: 40px; height: 70px; background: url('/child/img/main/visual-prev.png') no-repeat center; }
.visual-slide .slick-next { z-index: 15; right: 95px; width: 40px; height: 70px; background: url('/child/img/main/visual-next.png') no-repeat center; }
.visual-slide .slick-dots { bottom: 120px; z-index: 15}
.visual-slide .slick-dots li { margin: 0 2px; width: 40px; height: 6px; border: 1px solid #fff; background: rgba(255,255,255,0); opacity: .4; }
.visual-slide .slick-dots li.slick-active { background: rgba(255,255,255,1); opacity: .8; }
.visual-slide__image { position: relative; }
.visual-slide__background{
    max-height: 1070px; min-height: 700px; height: calc(100vh - 50px);
    background-repeat: no-repeat; background-position: center; background-size: cover;
}
.visual-slide div { height: 100%; }
.visual-slide a { display: block; width: 100%; height: 100%; }
.visual-background--1 { background-image: url('/child/img/main/v1.jpg'); }
.visual-background--2 { background-image: url('/child/img/main/v2.png'); }
.visual-slide__contents{
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    position: absolute; top: 0; left: 0; right: 0;
    margin: auto; max-width: 1100px; width: 100%; height: 100%;
    text-align: center;
}
.visual-contents--1 .img { margin: 25px 0 35px; }
.visual-contents--1 .pr { overflow: hidden; line-height: 28px; }
.visual-contents--1 .pr span:first-child { display: block; margin-bottom: 20px; }

.visual-slide__contents-top{
    animation: slideFade-out .3s ease-out both;
}
.slick-active .visual-slide__contents-top{
    animation: slideFade-in .6s ease-out .3s both;
}
 .visual-slide__contents-bottom{
    animation: slideFade-upOut .3s ease-out both;
}
.slick-active .visual-slide__contents-bottom{
    animation: slideFade-downIn .5s ease-out .8s both;
}
.visual-slide__contents-image{
    animation: slideFade-out .2s ease-out both;
}
.slick-active .visual-slide__contents-image{
    animation: slideFade-in .6s ease-out both;
}
@keyframes slideFade-in {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes slideFade-out {
    0% { opacity: 1; }
    100% { opacity: 0; }
}
@keyframes slideFade-leftOut {
    0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); }
    100% { opacity: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
}
@keyframes slideFade-rightIn {
    0% { opacity: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
    100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); }
}
@keyframes slideFade-downIn {
    0% { opacity: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
    100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}
@keyframes slideFade-upOut {
    0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
    100% { opacity: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
}
@keyframes slideFade-downOut {
    0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
    100% { opacity: 0; -webkit-transform: translateY(50%); transform: translateY(50%); }
}
@keyframes slideFade-upIn {
    0% { opacity: 0; -webkit-transform: translateY(50%); transform: translateY(50%); }
    100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}
@keyframes slideFade-zoomInY {
    0% { opacity: 0; -webkit-transform: scaleY(0); transform: scaleY(0); }
    100% { opacity: 1; -webkit-transform: scaleY(1); transform: scaleY(1); }
}
@keyframes slideFade-zoomOutY {
    0% { opacity: 1; -webkit-transform: scaleY(1); transform: scaleY(1); }
    100% { opacity: 0; -webkit-transform: scaleY(0); transform: scaleY(0); }
}
@media (min-width:1025px){

}
@media (max-width:1024px){
    .visual-slide__contents{
        justify-content: flex-start;
        padding-top: 100px;
    }
    .visual-slide__contents img { width: auto; height: 120px; }
}
@media (max-width:768px){
    .visual-slide .slick-dots { bottom: 50px; }
    .visual-slide__background { min-height: auto; height: 400px; }
    .visual-slide__contents { padding-top: 30px; }
    .visual-slide__contents img { height: 80px; }
    .visual-contents--1 .pr span:first-child { margin-bottom: 15px; }
}


@media (max-width:1024px) {
    .visual-slide { height: 800px; }
    .visual-slide { font-size: 0; }
    .v-slide__bg { height: 800px; }
    .v-slide__contents img { width: 70px; height: auto; }
    .v-slide__button { height: 60px; line-height: 60px; }
}
@media (max-width:768px) {
    .visual-slide { height: 800px; }
    .v-slide__bg { height: 800px; }
    .visual-text img { width: 60%; }
    .v-slide__contents { padding-top: 60px; }
    .v-slide__button { margin-top: 35px; height: 50px; line-height: 50px; }
    .v-slide__button span { font-size: 13px; }
}
@media (max-width:550px) {
    .visual-slide { height: 520px; }
    .v-slide__contents { padding-top: 45px; }
    .v-slide__bg { height: 520px; }
}





/* Section 1 */
.section1 { padding: 130px 0 40px; border-bottom: 1px solid #eeeeee; }
.section1 h3 { margin-bottom: 50px; }
@media (max-width:1024px){

}
@media (max-width:768px){
    .section1 { padding: 80px 0 40px; }
}





/* Section 2 */
.section2 { display: none; padding: 100px 0 120px; }
.gallery-board-area{
    display: flex; flex-wrap: wrap;
}
.gallery-board__head { flex-basis: 220px; }
.gallery-board__head h3 { margin: -5px; line-height: 40px; }
.gallery-board__line{
    display: block; margin: 30px 0;
    width: 1px; height: 100px; background: #fd5716;
}
.gallery-board__link span{
    position: relative; padding-right: 35px;
    background: url('/child/img/main/link-more.png') no-repeat right center;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
}
.gallery-board__link:hover span{
    background-image: url('/child/img/main/link-more-light.png');
}
.gallery-board__image { margin: 30px 0 0 -80px; }
.gallery-board__body { flex: 1 1; }
.main-gallery-ul { margin: -20px 0 0 -10px; width: calc(100% + 20px); }
.main-gallery-ul > li { padding: 20px 10px; }
.main-gallery__thumb{
    overflow: hidden; display: block; position: relative;
    margin-bottom: 10px; padding-top: calc(180 / 280 * 100%); width: 100%; height: 0;
}
.main-gallery__thumb span{
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background-repeat: no-repeat; background-position: center; background-size: cover;
}
.main-gallery__title { line-height: 36px; font-size: 20px; font-weight: bold; }
@media (max-width:1024px){
    .section2 { padding: 80px 0; }
    .gallery-board-area{
        flex-direction: column;
    }
    .gallery-board__head { flex-basis: auto; text-align: center; }
    .gallery-board__head h3 { margin-bottom: 15px; }
    .gallery-board__line { display: none; }
    .gallery-board__image { display: none; }
    .main-gallery-ul { margin: 15px 0 0 -10px; }
    .main-gallery__title { font-size: 18px; }
}
@media (max-width:768px){
    .main-gallery-ul { margin-left: -5px; width: calc(100% + 10px); }
    .main-gallery-ul > li { padding: 15px 5px; width: 50%; }
    .main-gallery__title { font-size: 14px; }
}





/* Section 3 */
.section3{
    padding: 70px 0 0;
    background: url('/child/img/main/section3.jpg') no-repeat center / cover;
}
.donation-area{
    display: flex;
}
.donation-left { padding-right: 90px; width: 50%; }
.donation-right { width: 50%; }
.donation__title{
    display: flex; justify-content: space-between;
    margin-bottom: 40px; padding-bottom: 20px;
    border-bottom: 2px solid #fd5716;
}
.donation__title .button { padding: 0 20px; }
.donation__title-pr { margin-bottom: 30px; }
.donation__title-pr span:first-child { display: block; margin-bottom: 10px; }
.donation__link > li { margin-top: 10px; }
.donation__link .button{
    overflow: hidden; display: block; position: relative;
    padding: 0 20px; width: 100%; text-align: left;
    border: 1px solid rgba(255,255,255,.8);
}
.donation__link .button::before{
    content: ''; z-index: 1; position: absolute; top: 0; left: 0;
    width: 100%; height: 100%; background: #fff;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
    opacity: .15;
}
.donation__link .button span{
    display: block;
    z-index: 2; position: relative; padding: 0 15px 0 0;
    background: url('/child/img/main/link-more-light.png') no-repeat right center;
}
.coach-box{
    position: relative;
    padding: 40px 50px; width: calc(100% + 30px);
    background: #ebece8;
}
.coach-box__link{
    display: block; position: absolute; top: 55%; right: -35px;
    padding-top: 28px; width: 105px; height: 50px;
    font-size: 18px; color: #fd5716; font-weight: 300;
    background: url('/child/img/main/coach-box-link-arrow.png') no-repeat top center;
}
.coach-ul { margin-top: 30px; }
.coach-ul > li{
    display: flex; align-items: flex-end;
}
.coach-ul > li:first-child { margin-bottom: 55px; }
.coach-thumb{
    flex-basis: 200px;
    display: block; position: relative;
    border: 4px solid #fd5716;
}
.coach-thumb__plus{
    position: absolute; right: 0; bottom: 0;
    width: 30px; height: 30px;
    background: #fd5716;
}
.coach-thumb__plus::before,
.coach-thumb__plus::after{
    content: ''; position: absolute; top: 0; right: -4px; bottom: -4px; left: 0;
    margin: auto; width: 13px; height: 1px; background: #fff;
    -webkit-transition: all ease-out .3s; transition: all ease-out .3s;
}
.coach-thumb__plus::after{
    -webkit-transform: rotate(90deg); transform: rotate(90deg);
}
.coach-info{
    flex: 1 1;
}
.coach-info h4 { margin-bottom: 10px; letter-spacing: -0.06em; }
.coach-info p { line-height: 28px; letter-spacing: -0.06em; }
.coach--right .coach-thumb { order: 2; }
.coach--left .coach-info { padding-left: 30px; }
@media (min-width:1025px){
	.donation__link .button:hover::before{
        opacity: .3;
    }
}
@media (max-width:1024px){
    .donation-area{
        flex-direction: column;
    }
    .donation-left { padding: 0 0 50px; width: 100%; }
    .donation-right { width: 100%; }

    .donation__link{
        display: flex; flex-wrap: wrap;
    }
    .donation__link > li { margin: 0; padding: 5px; width: 50%; }
    .donation__link .button { padding: 20px; height: 100%; line-height: 24px; }

    .coach-box__link { position: static; margin: 35px auto 0; }
    .coach-box { width: 100%; }
    .coach-thumb { flex-basis: 130px; }
}
@media (max-width:768px){
    .donation__link .button { padding: 15px 10px; }
    .coach-ul > li{
        flex-direction: column; align-items: flex-start;
    }
    .coach-box { padding: 40px 50px 30px; }
    .coach-box>h3{text-align: center;}
    .coach-info { order: 2; padding-top: 15px;  }
    .coach-thumb { flex-basis: auto; width: 110px; border-width: 2px; }
    .coach--left .coach-info { padding-left: 0; }
    .coach--right .coach-thumb { order: 1; }
    .coach-info h4{text-align: center;}
    .coach-info p { line-height: 26px; text-align: center;}
    .coach-box__link { padding-top: 20px; width: 70px; font-size: 16px; background-size: auto 16px; }
    .coach-ul li{display: flex; flex-direction: column; align-items: center;}
}





/* Section 4 */
.section4 { padding: 120px 0 140px; }
.location-area{
    display: flex; flex-wrap: wrap;
}
.location__head { flex-basis: 340px; }
.location__head h3 { margin-top: -10px; line-height: 50px; }
.location__head p{
    margin: 30px 0 140px; padding: 75px 30px 0; line-height: 30px;
    border-left: 1px solid #fd5716;
}
.location__body { flex: 1 1; height: 500px; background: #f8f8f8; border: 1px solid #e5e5e5; }
.location__frame { width: 100%; height: 100%; }
.location-background{
    margin-top: -100px; height: 160px; width: 90%;
    background: #fd5716 url('/child/img/main/location-background.jpg') no-repeat left center;
}
@media (max-width:1024px){
    .location-area { flex-direction: column; }
    .location__head { flex-basis: auto; }
    .location__head h3 { line-height: 40px; }
    .location__head p { margin: 25px 0 35px; padding: 0; border-left: none; }
    .location__body { height: 400px; }
    .location-background { display: none; }
}
@media (max-width:768px){
    .section4 { padding: 80px 0 100px; }
    .location__head h3 { line-height: 30px; }
    .location__body { height: 260px; }
}
