/********** index.php **********/
.main_four {width: 100%; height: calc(100vh - 130px); margin-bottom: 100px;}
#main_four_mo {display: none; height: calc(100vh - 130px);}
#main_four.main_four a {width: 33.3333%; height: 100%; float: left; display: inline-block; background-size: cover !important; transition: all 0.5s; display: flex; justify-content: center; align-items: center; position: relative;}
#main_four_mo.main_four a {height: 33.3333%; width: 100%; display: inline-block; background-size: cover !important; transition: all 0.5s; display: flex; justify-content: center; align-items: center; position: relative;}
.main_four a:nth-child(1) {background: url(../images/main1.jpg) no-repeat center center;}
/* .main_four a:nth-child(2) {background: url(../images/main2.jpg) no-repeat center center;} */
.main_four a:nth-child(2) {background: url(../images/main3.jpg) no-repeat center center;}
.main_four a:nth-child(3) {background: url(../images/main4.jpg) no-repeat center center;}
.main_four a:hover {transform: translateY(-10px); box-shadow: 10px 10px 10px rgba(0,0,0,0.5); z-index: 2;}
.main_four a .main-name {color: #fff; font-size: 18px; font-weight: bold; height: 50px; line-height: 50px; z-index: 1;}
.main_four a:hover .main-name {border-bottom: 2px solid #fff;}
.main_four a .main_hover {width: 100%; height: 100%; background-color: rgba(0,0,0,0.65); color: #fff; font-size: 18px; font-weight: bold; display: block; transition: all 0.5s; position: absolute; top: 0; left: 0;}
.main_four a:last-child .main_hover {background-color: rgba(0,0,0,0.35);}
.main_four a:hover .main_hover {display: none; transition: all 0.5s;}

#main_video {width: 100%; height: 100%; margin-bottom: 100px; text-align: center;}
#main_video video {width: 100%; height: 100%; max-width: 854px; max-height: 480px;}
#main_video video:focus {border: 0; outline: 0;}

#main_video .vid_wrap{
  aspect-ratio: 427/240;
  max-width: 854px;
  width: 100%;
  margin: 0 auto;
}

#main_desc {width: 100%; height: 100%; line-height: 180%; margin-bottom: 70px; display: flex; align-items: center;}
#main_desc .desc_lt {float: left; width: 50%; padding-left: 50px; padding-right: 0; z-index: 1000; transform: rotate(-0.03deg);}
#main_desc .desc_rt {float: right; width: 50%; z-index: 1000;}
#main_desc .desc_rt video,
#main_desc .desc_rt img {
  width: 70%;
  box-shadow: -10px 15px 15px rgba(0, 0, 0, 0.2);
  float: right;
}
#main_desc .desc_lt h1 {font-size: 30px; padding-bottom: 30px; padding-top: 60px;}
#main_desc .desc_lt p {font-size: 18px; color: #888;}
#main_desc .desc_lt p.noto {padding-bottom: 50px;}
#main_desc .desc_lt div {font-size: 14px; padding-bottom: 35px; word-break: keep-all;}
#main_desc .chairman {font-size: 14px; text-align: right; font-weight: bold; padding-top: 45px;}


@media screen and (max-width: 1028px) {
  #main_four_mo {margin-bottom: 60px;}
  #main_desc {display: block;}
  #main_desc .desc_lt {float: none; width: 100%; padding: 0 20px;}
  #main_desc .desc_rt {float: none; width: 100%; padding: 0 20px;}
  #main_video {margin-bottom: 0;}
  #main_desc .desc_rt {text-align: center;}
  /* #main_desc .desc_rt img {float: none;} */
}

@media screen and (max-width: 768px) {
  #main_four {display: none;}
  #main_four_mo {display: block;}
  #main_desc .desc_lt h1 {font-size: 24px;}
}

@media screen and (max-width: 540px) {
  #main_desc .desc_lt br {display: none;}
}