@charset "utf-8";
/* CSS Document */
.video_05_body{}
.video_05_page{padding: 30px 0px;}
.video_05_page .area_title_page{margin-bottom: 30px;}
.video_05_page .container{width: 80%;margin-right: auto;margin-left: auto;}
.video_05_box{padding: 0px;}
.video_05_one_box{margin-bottom: 30px;display: flex;flex-direction: column;width: 100%;}
.video_05_one_box .description-box{padding: 1rem 0px;}
.video_05_one_box .description-box .btn {margin-top: 1rem;zoom: 0.9;background-color: #333;color: #fff;font-weight: normal;border-color: rgba(0,0,0,0.1);}
.video_05_one_box .description-box .btn:hover{background-color: #004986;border-color: rgba(0,0,0,0.1);}

.video_05_one_box  .main_title_box{ font-size: 18px;margin: 0 0 .5rem;}
.video_05_one_box  .sub_title_box{font-size: 16px;margin: 0 0 .5rem;}
.video_05_one_box  .txt_box{font-size: 16px;margin: 0 0 .5rem;}

.video_05_page .all_more_page { position: relative; padding: 30px 0px 30px 0px;}
.video_05_page .all_more_page .btn { background: #004986; color: #FFF; border-top-color: #00325B; border-right-color: #00325B; border-bottom-color: #00325B; border-left-color: #00325B; }
.video_05_page .all_more_page .btn:hover { background: #2f2a29; color: #FFF; border-color: #2f2a29; }

.video_05_page .area_title_page{display: flex; }
.video_05_page .area_title_box{margin-top: 15px;margin-bottom: 15px;float: none;}
.video_05_page .area_main_title{ margin: 0 0 5px;line-height: normal!important;}
.video_05_page .area_sub_title{margin: 0 0 5px;}
.video_05_page .area_sub_title span{font-weight: bold;}
.video_05_page .area_description{margin: 0 0 5px;}

.video_05_one_box .html5-video-box {position: relative;min-height: 350px;width: 100%;height: 100%;background-color: #757575;}
.video_05_one_box .html5-video-box .html5-video{width: 100%;display: flex;}
.video_05_one_box .html5-video-box img{width: 100%;cursor: pointer;}
.video_05_one_box .html5-video-box span{cursor: pointer;position: absolute;width: 100%;height: 100%;}
.video_05_one_box .html5-video-box span:before{position: absolute;left: 50%; top: 50%;transform: translate(-50%, -50%);}
.video_05_one_box .html5-video-box span:before{content: "";background-size: 100%;width: 68px;height: 48px;background-repeat: no-repeat; background-position: left center;} 
.video_05_one_box .html5-video-box span:before{opacity: .8; background-image : url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 -38 256 256' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMidYMid'%3E%3Cpath class='ytp-large-play-button-bg' d='M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134z' fill='%23212121'/%3E%3Cpath fill='%23FFF' d='M102.42 128.06l66.329-38.418-66.328-38.418z'/%3E%3C/svg%3E");}
.video_05_one_box .html5-video-box:hover span:before{ background-image : url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 -38 256 256' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='xMidYMid'%3E%3Cpath class='ytp-large-play-button-bg' d='M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134z' fill='red'/%3E%3Cpath fill='%23FFF' d='M102.42 128.06l66.329-38.418-66.328-38.418z'/%3E%3C/svg%3E");}

@media (max-width: 1680px) {
.video_05_page .container{width: 90%;}
}
@media (max-width: 1440px) {.video_05_one_box .html5-video-box{min-height: 620px;}}
@media (max-width: 1200px){.video_05_one_box .html5-video-box{min-height: 600px;}}
@media (max-width: 992px){.video_05_one_box .html5-video-box{min-height: 450px;}}
@media (max-width: 768px) {
.video_05_page{padding: 15px 0px;}
.video_05_box{padding: 15px 0px;}
.video_05_page .container{width: 100%; padding-right: 15px; padding-left: 15px;}
.video_05_one_box{margin-bottom: 15px;}
.video_05_one_box  .description-box{padding: .75rem 0px;}
.video_05_one_box  .main_title_box{ font-size: 18px;}
.video_05_one_box  .sub_title_box{font-size: 15px;}
.video_05_one_box  .txt_box{font-size: 15px;}
.video_05_one_box .html5-video-box{min-height: 300px;}
}
@media (max-width: 576px){.video_05_one_box .html5-video-box{min-height: 150px;}}
@media (max-width: 375px){.video_05_one_box .html5-video-box{min-height: 120px;}}