/*========= 背景動画設定のCSS ===============*/

#video-area{
    z-index: -1;/*最背面に設定*/
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
    position: fixed;
}
#video-area_cr{
	width: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
    position: relative;
}
#video-area_cr02{
	width: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    overflow: hidden;
    position: relative;
}
.video {
    /*天地中央配置*/
    position: absolute;
    z-index: -2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}
#video_cr {
    /*天地中央配置*/
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}
#video_cr02 {
    /*天地中央配置*/
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 177.77777778%; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 56.25%; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}
.video_sp {
    /*天地中央配置*/
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*縦横幅指定*/
    width: 56.25vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
    height: 177.77777778vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
    min-height: 100%;
    min-width: 100%;
}
.top_img {
    object-fit: cover;
    min-height: 100vh;
}