@media screen and (min-width:731px) {
  ul.videoList li div.comingSoon{background: #449cfe;width: 100%;height: 100%;border: 20px solid #9adaf5;box-sizing: border-box;position: relative;}
  ul.videoList li div.comingSoon p{color: #fff;font-weight: bold;font-size:3rem;line-height: 1.2;letter-spacing:2px;text-align:center;position:absolute;left:calc(50% + 2px);top:50%;transform:translate(-50%,-50%);}
  .movie-content{cursor: pointer;margin-bottom: 10px;transition: all 0.2s ease;}
  .movie-content:hover{opacity: 0.8;}
  .modal-outer {position: fixed;top:0;left:0;width: 100vw;height:100vh;background: rgba(0,0,0,0.95);z-index: 1;}
  .modal-inner {position: relative;width:640px;height: 360px;}
  #movie-area {max-width: 100%;max-height: 100%;}
  .movie-close {position: absolute;top:0;right:-45px;width: 45px;height:45px;transition: all 0.2s ease;border-radius: 50%;}
  .movie-close:hover {background-color: rgba(150,150,150,0.7);}
  .movie-close::before{display: block;content:'';width: 3px;height:35px;background-color: #fff;transform:translate(21px, 5px) rotate(45deg);-webkit-transform:translate(21px, 5px) rotate(45deg);}
  .movie-close::after{display: block;content:'';width: 3px;height:35px;background-color: #fff;transform:translate(21px, -30px) rotate(-45deg);-webkit-transform:translate(21px, -30px) rotate(-45deg);}
  .movie-close:hover {cursor: pointer;}
}

@media screen and (max-width:730px) and (min-width:641px) { 
  ul.videoList li div.comingSoon{background: #449cfe;width: 100%;height: 100%;border: 17px solid #9adaf5;box-sizing: border-box;position: relative;}
  ul.videoList li div.comingSoon p{color: #fff;font-weight: bold;font-size:2.5rem;line-height: 1.2;letter-spacing:1px;text-align:center;position:absolute;left:calc(50% + 1px);top:50%;transform:translate(-50%,-50%);}
  .movie-content{display: block;cursor: pointer;margin-bottom: 10px;transition: all 0.2s ease;}
  .movie-content:hover{opacity: 0.8;}
  .modal-outer {position: fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.95);z-index: 1;}
  .modal-inner {position: relative;width:calc(100vw - 45px);height:calc(100vh - 45px);}
  #movie-area {max-width: 100%;max-height: 100%;}
  .movie-close {position: absolute;top:-45px;right:-5px;width: 45px;height:45px;transition: all 0.2s ease;border-radius: 50%;}
  .movie-close::before{display: block;content:'';width: 3px;height:35px;background-color: #fff;transform:translate(21px, 5px) rotate(45deg);-webkit-transform:translate(21px, 5px) rotate(45deg);}
  .movie-close::after{display: block;content:'';width: 3px;height:35px;background-color: #fff;transform:translate(21px, -30px) rotate(-45deg);-webkit-transform:translate(21px, -30px) rotate(-45deg);}
  .movie-close:hover {cursor: pointer;}
}

@media screen and (max-width:640px) { 
  ul.videoList li div.comingSoon{background: #449cfe;width: 100%;height: auto;padding-top:calc(100% - 50px);border: 25px solid #9adaf5;box-sizing: border-box;position: relative;}
  ul.videoList li div.comingSoon p{color: #fff;font-weight: bold;font-size:3.3rem;line-height: 1.2;letter-spacing:1px;text-align:center;position:absolute;left:calc(50% + 1px);top:50%;transform:translate(-50%,-50%);}
  .movie-content{display: block;margin-bottom: 10px;}
  .modal-outer {position: fixed;top:0;left:0;width: 100vw;height:100vh;background: rgba(0,0,0,0.95);z-index: 4;}
  .modal-inner {position: relative;width: 320px;height: 180px;}
  #movie-area {max-width: 100%;max-height: 100%;}
  .movie-close {position: absolute;top:-45px;right:-5px;width: 45px;height:45px;}
  .movie-close::before{display: block;content:'';width: 3px;height:35px;background-color: #fff;transform:translate(21px, 5px) rotate(45deg);-webkit-transform:translate(21px, 5px) rotate(45deg);}
  .movie-close::after{display: block;content:'';width: 3px;height:35px;background-color: #fff;transform:translate(21px, -30px) rotate(-45deg);-webkit-transform:translate(21px, -30px) rotate(-45deg);}
}
/* 200325 */
.movie-close::after{visibility:visible;}

/* 200828 */
.modal-outer {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 75px;
  box-sizing: border-box;
}

@media screen and (min-width:1024px) {
  .movie-close {top:-45px;}
}