@charset "UTF-8";
/* CSS Document */

.eachTextAnime span{opacity: 0; display: none;}
.eachTextAnime.appeartext span{ display: inline-block; animation:text_anime_on 1s ease-out forwards; }
@keyframes text_anime_on {
	0% {opacity:0;}
	100% {opacity:1;}
}

/*section_service*/
.contact_key_visial{
    height: 80vh;
    background-image: url(../images/contact/contact_key_visial.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.contact_key_visial_filter{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    background-color: rgba(0,0,0, 0.1);  
    height: 100%;
    width: 100%;
}
.contact_key_visial_title{
    color: #fff;
    font-weight: 600;
    width: 100%;
    text-align: left;
    padding-left: 5%;
}
.section_contact{
    padding-top: 130px;
}
.section_contact h1{
    font-family: 'EB Garamond', serif;
    font-size: 4.8rem;
    font-weight:200;
    margin-bottom: 40px;

}
.section_contact p{
    font-size: 2.0rem;
    font-weight: 200;
    line-height: 2.4;
}

/*description*/
.description{
    padding: 200px 0 160px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}
.description_content{
    padding: 60px 0 60px 80px;
    text-align: left;
    background-color: #000;
    color: #fff;
    height: 240px;
}
.contact_number a{
    color: #fff;
}
.description_office{
    font-family: 'EB Garamond', serif;
    font-size: 2.0rem;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
}
.description_office::before{
    content: "";
    border-top: 1px solid #fff;
    content: "";
    width: 45px; 
    margin-right: 20px;
}
.contact_number{
    font-size: 2.8rem;
    margin-bottom: 20px;
}
.description_content span{
    font-size: 1.4rem;
}
.contact_infomation{
    padding-bottom: 200px;
}
.contact_infomation_content{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    text-align: left;
}
.contact_infomation h2{
    font-size: 2.8rem;
    font-family: 'EB Garamond', serif;
    font-weight: 200;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
}
.contact_infomation h2::before{
    content: "";
    border-top: 1px solid #000;
    content: "";
    width: 45px; 
    margin-right: 20px;
}
.contact_infomation p{
margin:0 6%;
line-height: 2.6;
}
.notion{
    font-size: 1.4rem;
}

/*tablet*/
@media(max-width:768px){
    .section_contact{
        padding-top:80px
    }
    .contact_key_visial{
        height: 50vh;
        position: relative;
    }
    .contact_key_visial_title{
        position: absolute;
        bottom: 5%;
    }
    .description{
        padding: 100px 0;
    }
    .contact_infomation{
        padding-bottom: 100px;
    }
}/*tablet*/

/*sp*/
@media(max-width:480px){
    .section_contact{
        padding-top:60px
    }
    .contact_key_visial{
        height: 60vh;
        position: relative;
        background-image: url(../images/contact/contact_key_visial_sp.jpg);
    }
    .section_contact h1{
        font-size: 3.2rem;
        margin-bottom: 20px;
    }
    .section_contact p{
        font-size: 1.4rem;
    }
    .description{
        padding: 80px 0 ;
    }
    .description_content{
        padding: 40px 0 40px 40px;
        width: 100%;
        height: 220px;
    }
    .description_office{
        font-size:1.6rem;
        margin-bottom:20px;
    }
    .description_office::before{
        width: 35px;
        margin-right: 10px;
    }
    .contact_number{
        font-size: 2.0rem;
    }
    .contact_number a{
        color: #fff;
    }
    .contact_infomation{
        padding-bottom: 80px;
    }
    .contact_infomation_content{
        width: 100%;
        padding: 0 18px;
    }
    .contact_infomation h2{
        font-size: 2.0rem;
    }
    .contact_infomation h2::before{
        width: 35px;
        margin-right: 10px;
    }
    .contact_infomation p{
        margin-left: 0;
        font-size: 1.4rem;
    }
}