@media screen and (min-width: 768px), print {
  .mv {
    background-image: url(/tea/teatro/images/mv_bg_pc.png);
  }
  .mv .mv-title-icon {
    margin: 0 0 0 24px;
  }
  .mv .mv-title {
    text-shadow: 0 0 16px rgba(0, 0, 0, .8);
  }
  #function .panel-box-img {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
            justify-content: center;
    height: 343px;
  }
}

@media screen and (min-width: 768px) and (max-width: 980px) {
  .mv .mv-title-wrap.-icon-r .mv-title-icon {
    width: 50%;
  }
  .mv .mv-title-wrap.-icon-r .mv-title {
    width: 50%;
  }
}

@media screen and (max-width: 767px) {
  .mv {
    background-image: url(/tea/teatro/images/mv_bg_sp.png);
    padding-top: 29.86667vw;
  }
  .mv .mv-title-wrap {
    position: static;
    top: auto;
    left: auto;
    -webkit-transform: none;
            transform: none;
  }
  .mv .mv-title {
    text-shadow: 0 0 4.26667vw rgba(0, 0, 0, .8);
  }
  .mv .mv-title img {
    width: 74.66667vw;
  }
  .mv .mv-title-icon {
    margin: 8.16vw 8vw 0 auto;
  }
  .mv .mv-title-icon img {
    width: 50.4vw;
  }
  .mv .mv-img {
    margin-top: 0;
  }
  .mv .mv-img img {
    width: auto;
    height: 80vw;
    margin-left: 32vw;
  }
  .mv-b-wrap {
    padding-top: 0;
  }
  #function .panel-box-img {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
            justify-content: center;
    height: 53.86667vw;
  }
  #function .panel-box-img img {
    width: 100%;
    height: auto;
  }
}