@charset "utf-8";
.main_visual_wrap { height: 100%; }
.main_visual { height: 100%; }
.main_visual .item { position: relative; height: 100%; background: url("../img/main_visual_01.jpg")no-repeat center; background-size: cover; }
.main_visual .cont { width: 95%; position: absolute; left: 50%; top: 50%; transform:translate(-50%,-50%); }
.main_visual .cont .cont_tit { text-align: center; font-family:'Montserrat'; font-weight: 900; color: #fff; font-size: 5em; }
.main_visual .item .scroll { position: absolute; left: 50%; transform:translateX(-50%); bottom: 2.5em; }
.main_visual .item .scroll > p { position: relative; font-size: 0.87em; color: #fff; font-family:'Montserrat'; }
.main_visual .item .scroll > p:before { content:''; width: 1px; height: 2em; background-color: #fff; position: absolute; left: 50%; transform:translateX(-50%); bottom: -3em; }
.main_section_01 { margin-top:5.5em; }
.main_section_01 > div:nth-child(2n) .cont { padding: 2.1em 7% 5em 0 ; }
.main_section_01 .sec { height: 380px; overflow: hidden; margin-bottom: 2.5em; }
.main_section_01 .sec:last-child { margin-bottom: 0; }
.main_section_01 .img { opacity: 0; background-repeat: no-repeat; background-size: cover; background-position: center; }
.main_section_01 .cont { width: 50%; float:left; padding: 2.1em 0 5em 7%; }
.main_section_01 .tit_wrap { font-weight: bold; margin-bottom: 3.12em; }
.main_section_01 .tit_wrap .tit{ float: left; font-size: 2em; color: #000; }
.main_section_01 .tit_wrap .sub_tit { float: left; font-size: 1em; color: #95569e; font-family: 'Montserrat'; margin:1em 0 0 1em; }
.main_section_01 .txt_wrap { font-size: 1em; }
.main_section_01 .txt_wrap .txt { color: #000; margin-bottom: 1.8em; line-height: 1.6em; }
.main_section_01 .txt_wrap .sub_txt { color: #666; line-height: 1.5em; font-family:'Montserrat'; }
.section_01 .img { width: 50%; float:left; height: 380px; background-image: url("../img/main_section_01.jpg"); }
.section_02 .img { width: 50%; float:right; height: 380px; background-image: url("../img/main_section_02.jpg"); }
.section_03 .img { width: 50%; float:left; height: 380px; background-image: url("../img/main_section_03.jpg"); }
.section_04 .img { width: 50%; float:right; height: 380px; background-image: url("../img/main_section_04.jpg"); }

.animate .img { animation-timing-function:ease-in-out; animation-duration: 1s; animation-fill-mode: forwards; }
.animate.section_01 .img { animation-name: slide_left; }
.animate.section_02 .img { animation-name: slide_right; }
.animate.section_03 .img { animation-name: slide_left; }
.animate.section_04 .img { animation-name: slide_right; }
.fp-viewing-3 .main_section_01 .img { opacity: 1; }
@keyframes slide_left {
    0% { transform: translateX(-200px); opacity: 0; }
    100% { transform:none; opacity: 1; }
 }
@keyframes slide_right {
    0% { transform: translateX(200px); opacity: 0; }
    100% { transform: none; opacity: 1; }
 }

@media screen and (max-width:1080px){
    .main_visual .item { height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; }
    .main_visual .item img { display: none; }
    .main_visual .item01 { background-image: url("../img/m_main_visual_01.jpg"); }
 }
@media screen and (max-width:950px){
    .main_section_01 .sec { height: auto; }
    .main_section_01 .img { width: 100%; }
    .main_section_01 .cont { width: 100%; text-align: center; padding-left: 0; padding-bottom: 3em; }
    .main_section_01 .tit_wrap .tit { float:none; }
    .main_section_01 .tit_wrap .sub_tit { float:none; }
    .main_section_01 > div:nth-child(2n) .cont { padding-right: 0; }
    .main_section_01 .sec:last-child { margin-bottom: 3em; }
    .main_section_02 { padding: 0; margin-top: 0; }
}
@media screen and (max-width:767px){
    .main_visual .cont .cont_tit { font-size: 4.5em; }
    .main_section_01 .img { height: 300px; }
}
@media screen and (max-width:600px){
    .main_visual .cont .cont_tit { font-size: 4em;}
}
@media screen and (max-width:500px){
    .main_visual .cont .cont_tit { font-size: 3.3em;}
}
@media screen and (max-width:480px){
    .main_section_01 .img { height: 250px; }
    .main_visual .item { height: 100%; }
    .main_section_01 .tit_wrap { text-align: left; }
    .main_section_01 .tit_wrap .tit, .main_section_01 .tit_wrap .sub_tit { display: inline-block; }
    .main_section_01 .txt_wrap { text-align: left; }
}
@media screen and (max-width:450px){
    .main_visual .cont .cont_tit { font-size: 2.6em;}
}
@media screen and (max-width:400px){
    .main_section_01 .txt_wrap .sub_txt br { display: none; }
}
