@charset "UTF-8";
@media screen and (min-width: 749px) {
  #subColTitle {
    background: url(../images/img_snavititle.png) center no-repeat;
    text-indent: -9999px;
    vertical-align: middle;
    width: 214px;
    height: 103px;
    padding: 10px 0;
  }
}
@media screen and (max-width: 768px) {
  #subColTitle {
    background: url(../images/img_snavititle_l.jpg) center no-repeat;
    background-size: cover;
    text-indent: -9999px;
    vertical-align: middle;
    width: 100%;
    padding: 5% 0;
    border-top: 1px solid #c7c7c7;
  }
}
/*--------------------*/
/* テレビアニメ
------------------------------------------------------*/
@media screen and (min-width: 769px) {
  #indexCol {
    margin: 0 auto;
    background: url(../images/bg_main2.png) repeat-y;
    width: 1100px;
    min-height: 675px;
  }
  #indexCol #subColTitle {
    background: url(../images/img_snavititle_l.jpg) center no-repeat;
    width: 1090px;
    height: 107px;
    margin: 0 auto;
  }
  #indexCol .subCol {
    display: block;
    width: 1090px;
    margin: 0 auto;
  }
  #indexCol .subCol h4 {
    text-align: center;
    background: url(../images/img_01.jpg) 0 0 repeat;
  }
  #indexCol .subCol h4 img {
    margin: -26px 0;
  }
  #indexCol .subCol .movCatchCol {
    display: block;
    width: 100%;
    height: 180px;
    background: url(../images/img_02.jpg) 0 0 no-repeat;
    text-align: center;
    box-sizing: border-box;
    padding-top: 2%;
  }
  #indexCol .subCol .movTitCol {
    color: #ff25a4;
    font-weight: bold;
    font-size: 23px;
    text-align: center;
    background: url(../images/img_02.jpg) 0 0 no-repeat;
  }
  #indexCol .subCol .movie_screen {
    display: block;
    width: 100%;
    height: 558px;
    background: url(../images/img_03.jpg) 0 0 no-repeat;
    position: relative;
  }
  #indexCol .subCol .movie_screen .animeMovBnr {
    display: block;
  }
  #indexCol .subCol .movie_screen .animeMovBnr, #indexCol .subCol .movie_screen iframe {
    width: 710px;
    height: 478px;
    position: absolute;
    top: 26px;
    left: -50%;
    right: -50%;
    margin: auto;
  }
  #indexCol .subCol .animeBtnCol {
    text-align: center;
    margin: 0 auto;
  }
  #indexCol .subCol .animeBtnCol ul {
    letter-spacing: -.40em;
    margin-bottom: 40px;
  }
  #indexCol .subCol .animeBtnCol ul li {
    display: inline-block;
    letter-spacing: normal;
    margin: 0 10px 20px 0;
  }
  #indexCol .subCol .animeBtnCol ul li:nth-last-of-type(1) {
    margin: 0 0 20px 0;
  }
  #indexCol .subCol .animeBtnCol ul#sn-anime02 {
    letter-spacing: -.40em;
    margin-bottom: 40px;
  }
  #indexCol .subCol .animeBtnCol ul#sn-anime02 li {
    display: inline-block;
    letter-spacing: normal;
    margin: 0 40px 20px 40px;
  }
  #indexCol .subCol .animeOfficialCol {
    display: block;
    width: 100%;
    position: relative;
  }
  #indexCol .subCol .animeOfficialCol .hvr {
    display: block;
    width: 667px;
    position: absolute;
    bottom: 10%;
    left: -50%;
    right: -50%;
    margin: auto;
  }

  span.newIcon {
    display: block;
    margin: -7px -5px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, #83d2ff), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, #83d2ff), color-stop(0.75, #83d2ff), color-stop(0.75, transparent), to(transparent));
    -webkit-background-size: 6px;
    background-color: #47bcff;
    color: #fff;
    padding: 1px 5px 0;
    border: solid 1px #15aaff;
    position: absolute;
    font-weight: bold;
    zoom: 1;
    z-index: 10;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-iteration-count: infinite;
    -webkit-transform-origin: bottom center;
    -webkit-animation-name: outer01;
  }

  div#holidayCol span.newIcon {
    margin: -3px 240px;
  }

  @-webkit-keyframes outer01 {
    0% {
      -webkit-transform: scale(1, 1);
    }
    48% {
      -webkit-transform: scale(1, 1);
    }
    50% {
      -webkit-transform: scale(1.1, 0.9);
    }
    53% {
      -webkit-transform: scale(0.9, 1.1) translate(0, -5px);
    }
    57.5% {
      -webkit-transform: scale(1, 1) translate(0, -3px);
    }
    59% {
      -webkit-transform: scale(1, 1) translate(0, 0px);
    }
    100% {
      -webkit-transform: scale(1, 1);
    }
  }
}
@media screen and (max-width: 768px) {
  #indexCol .subCol {
    display: block;
    width: 100%;
    margin: 0 auto;
    background: #fff;
    overflow: hidden;
  }
  #indexCol .subCol h4 {
    text-align: center;
  }
  #indexCol .subCol h4 img {
    margin: 0;
  }
  #indexCol .subCol .movCatchCol {
    display: block;
    width: 100%;
  }
  #indexCol .subCol .movCatchCol p {
    width: 80%;
    margin: 0 auto;
  }
  #indexCol .subCol .movTitCol {
    color: #ff25a4;
    font-weight: bold;
    font-size: 3.0vw;
    text-align: center;
    line-height: 2.5;
  }
  #indexCol .subCol .movie_screen {
    display: block;
    width: 90%;
    padding-top: 60.5%;
    position: relative;
    margin: 0 auto;
  }
  #indexCol .subCol .movie_screen .animeMovBnr {
    display: block;
  }
  #indexCol .subCol .movie_screen .animeMovBnr, #indexCol .subCol .movie_screen iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
  }
  #indexCol .subCol .animeBtnCol {
    text-align: center;
    margin: 0 auto;
  }
  #indexCol .subCol .animeBtnCol ul {
    letter-spacing: -.40em;
    margin-bottom: 2%;
  }
  #indexCol .subCol .animeBtnCol ul li {
    width: 26%;
    display: inline-block;
    letter-spacing: normal;
    margin: 0 2% 2% 0;
  }
  #indexCol .subCol .animeBtnCol ul li:nth-last-of-type(1) {
    margin: 0 0 2% 0;
  }
  #indexCol .subCol .animeBtnCol ul#sn-anime02 {
    letter-spacing: -.40em;
    margin-bottom: 2%;
  }
  #indexCol .subCol .animeBtnCol ul#sn-anime02 li {
    width: 26%;
    display: inline-block;
    letter-spacing: normal;
    margin: 0 4% 2% 4%;
  }
  #indexCol .subCol .animeOfficialCol {
    display: block;
    width: 100%;
    position: relative;
  }
  #indexCol .subCol .animeOfficialCol .hvr {
    display: block;
    width: 80%;
    position: absolute;
    bottom: 5%;
    left: -50%;
    right: -50%;
    margin: auto;
  }
  #indexCol .subCol .animeImg {
    max-width: inherit;
    width: 120%;
    margin: 0 -10%;
  }

  span.newIcon {
    display: block;
    margin: -4px -3px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    background-color: #15aaff;
    color: #fff;
    padding: 0.2% 1.0%;
    position: absolute;
    font-weight: bold;
    font-size: 40%;
    zoom: 1;
    z-index: 10;
  }

  div#holidayCol span.newIcon {
    margin: -2px 20%;
  }
}
.animeCheckMoreBtnCol {
  position: relative;
  background: url(../images/img_06.jpg) 0 0 no-repeat;
  background-size: contain;
  width: 100%;
  height: 0;
  padding-top: 20.2%;
}
.animeCheckMoreBtnCol span {
  display: block;
  position: absolute;
  border-radius: 7px;
  background: #FFFFFF;
  top: 45%;
  left: 19.0%;
  width: 61.2%;
}
.animeCheckMoreBtnCol span img {
  width: 100%;
}