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

.mv1{
overflow: hidden;position: relative;height: 800px;
}
.mv1 p img{object-fit: cover;width: 100%!important; height: 800px!important}

.mv1 .inner_box1{position: absolute;position: absolute;width: 80%;max-width: 1200px; z-index: 3;   top: 50%;   left: 50%;   -webkit-transform: translate(-50%, -50%);   transform: translate(-50%, -50%);}
.mv1 .inner_box1 h2{width: 100%}
.mv1 .inner_box1 h2 img{width: 100%}
.mv1 .copy{font-size: 3.4rem;font-weight: bold; margin-top: 50px;color: #fff;position: absolute;bottom: 2%;left: 0;right: 0;margin: auto;text-align: center;}

@media screen and (max-width: 1400px) {/*スマホのスタイル*/
.mv1 .copy{font-size: 2rem;}
}
@media screen and (max-width: 960px) {/*スマホのスタイル*/

.mv1 .copy{font-size: 2rem;}
}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.mv1{height: 400px;}
.mv1 p img{width: 100%; height: 400px!important;object-fit: cover}
.mv1 .copy{font-size: 1.4rem;}

}
div.vid_contents {
width: 100%;/*背景色を横幅いっぱいに広げる*/
text-align: center;
margin: auto;
padding: 0;/*ここで動画の周りの余白を調整*/

}
video.vid_main {
width: 100%;height: 800px;object-fit: cover
}
@media screen and (max-width: 1200px) {/*スマホのスタイル*/
.mv1{height: 600px;}
video.vid_main {height: 600px;object-fit: cover}
}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.mv1{height: 400px;}
video.vid_main {height: 400px;object-fit: cover}
}


.page_home .news{text-align: center;width: 100%}
.page_home .news h2{padding:40px 20px;}
.page_home .news .title{width: 14%;text-align: center;border-left: 1px solid #000;border-right: 1px solid #000;}
.page_home .news .con{width: 74%;font-size: 1.7rem}
.page_home .news .bt{width: 10%}
.page_home .news li{text-align: left}
.page_home .news .con span{background: #ff9700;color: #fff; color: #fff;padding: 2px 10px;border-radius: 30px;display: inline-block;margin-right: 12px;}



@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_home .news{padding: 40px 0}
.page_home .news h2{padding:0px 0px;}
.page_home .news .title{width: 100%;text-align: center;border-left: none;border-right: none;margin-bottom: 20px}
.page_home .news .title img{width: 20%}
.page_home .news .con{width: 96%;margin: auto; font-size: 1.4rem;margin-bottom: 20px}
.page_home .news .bt{width: 20%;margin: auto; text-align: center;}
}




.page_home .about{width: 100%;min-height: 800px; position: relative}
.page_home .about .mv_img{width: 100%;}
.page_home .about .mv_img img{min-height: 800px;object-fit: cover}
.page_home .about .inner_box{position: absolute;width: 80%; top: 50%;left: 50%; -webkit-transform: translate(-50%, -50%);transform: translate(-50%,-50%);}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_home .about{min-height: 500px; }
.page_home .about .mv_img img{min-height: 500px;}
}

.page_home .solution{width: 100%;margin: auto; position: relative;padding: 70px 0}
.page_home .solution .copy{color: #000;}
.page_home .solution .flex div{width: 30%;margin-top: 50px}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_home .solution{padding: 50px 0}
.page_home .solution .flex div{width: 48%;margin-top: 30px}
}

.page_home .works{width: 100%;margin:auto; position: relative;background: #e0ece1;}
.page_home .works .copy{color: #000;}
.page_home .works .swiper-container2 {
    width: 100%;
    height: 600px; /* ビューポートの高さを使用 */
	position:relative;
    overflow:hidden;
}

@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_home .works{padding: 40px 0}
.page_home .works .col3_2{width: 100%}
.page_home .works .col3{width: 100%}
.page_home .works .swiper-container2 {height:auto}
}


.page_home .recruit{margin: 80px 0}
.page_home .sponser{margin: 80px 0}
.page_home .sponser h3{font-weight: bold;font-size: 2rem;text-align: center}
.page_home .sponser ul{width: 70%;margin: 10px auto;}
.page_home .sponser ul li{margin-top: 30px}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_home .sponser h3{font-size: 1.6rem;}
.page_home .sponser ul{width: 96%;margin: 10px auto;}
}

.page_home .contact{width: 100%;margin:auto; position: relative;}
.page_home .contact .copy{color: #000;margin-bottom: 50px}
.page_home .col40{width: 40%}
.page_home .col60{width: 60%}
@media screen and (max-width: 768px) {/*スマホのスタイル*/
.page_home .col40{width: 100%}
.page_home .col60{width: 100%}
}