.mainVisual {
  width: 100%;
  background-color: #e4002c;
  background-image: url("../images/common/staves_fff.png");
  background-repeat: repeat-x;
  background-position: center center; }

.featureNav {
  display: flex;
  flex-wrap: wrap; }
  .featureNav li {
    flex-basis: 25%; }
    @media screen and (max-width: 960px) {
      .featureNav li {
        flex-basis: 50%; } }
  .featureNav figure figcaption {
    position: absolute;
    top: 50%;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 100%;
    height: 46%;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    font-size: min(2.075vw, 32px);
    line-height: 3;
    font-weight: 700;
    transform: translate(0, -50%); }
    .featureNav figure figcaption::before {
      content: "";
      position: absolute;
      bottom: -20%;
      border-width: 10px 12px 0px 12px;
      border-style: solid;
      border-color: #fff transparent transparent transparent;
      filter: drop-shadow(0 1px 3px #000); }
    .featureNav figure figcaption + span {
      display: none;
      font-size: 16px;
      color: #000; }
  @media screen and (min-width: 768.1px) {
    .featureNav figure:hover figcaption {
      color: #000;
      top: 10%;
      background: none;
      transform: translate(0, 0); }
      .featureNav figure:hover figcaption::before {
        display: none; }
      .featureNav figure:hover figcaption + span {
        position: absolute;
        bottom: 35px;
        left: 0;
        display: block;
        width: 100%;
        font-weight: 700;
        text-align: center; } }
  @media screen and (max-width: 960px) {
    .featureNav figure figcaption {
      font-size: min(4.15vw, 32px); }
      .featureNav figure figcaption + span {
        font-size: 14px; } }

main .indexh2 {
  font-size: 24px;
  color: #e4002c;
  line-height: 40px; }
  main .indexh2::before {
    content: "";
    display: inline-block;
    width: 38px;
    height: 40px;
    background: url("../images/common/staves_left.png") no-repeat center center/contain;
    margin-right: 20px;
    vertical-align: bottom; }
  main .indexh2::after {
    content: "";
    display: inline-block;
    width: 38px;
    height: 40px;
    background: url("../images/common/staves_right.png") no-repeat center center/contain;
    margin-left: 20px;
    vertical-align: bottom; }

@media screen and (max-width: 960px) {
  .megaBanner {
    margin-bottom: 15px; } }

.indexSection01 {
  background: #fff; }

.updatesFlexBox {
  display: flex;
  flex-wrap: wrap; }

.updatesFlexItem {
  flex-basis: 50%;
  padding: 25px 0; }
  @media screen and (max-width: 960px) {
    .updatesFlexItem {
      flex-basis: 100%;
      padding: 0; } }
  .updatesFlexItem .updatesFlexIteminner {
    padding: 25px;
    height: 100%; }
    @media screen and (max-width: 960px) {
      .updatesFlexItem .updatesFlexIteminner {
        padding: 20px 15px; } }
    .updatesFlexItem .updatesFlexIteminner .updatesFlexItemChild {
      margin: 25px 10px; }
      @media screen and (max-width: 960px) {
        .updatesFlexItem .updatesFlexIteminner .updatesFlexItemChild {
          margin: 1.75em 0; } }

.updatesFlexItem .updatesFlexItemChild.magazineInner {
  background: url("../images/common/indexMagazineBg.jpg") no-repeat top center/cover;
  margin: 0;
  padding: 15px; }
  @media screen and (max-width: 960px) {
    .updatesFlexItem .updatesFlexItemChild.magazineInner {
      margin-top: 2.5em; } }
  .updatesFlexItem .updatesFlexItemChild.magazineInner .indexh3 {
    background: #005bab;
    color: #fff;
    padding: 0 0 0 15px;
    font-size: 18px;
    border-bottom: 3px double #fff; }
  .updatesFlexItem .updatesFlexItemChild.magazineInner .entryBlock {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    justify-content: flex-end; }
  .updatesFlexItem .updatesFlexItemChild.magazineInner .entryTitle {
    font-size: 16px;
    margin-bottom: 1.75em; }
    @media screen and (max-width: 960px) {
      .updatesFlexItem .updatesFlexItemChild.magazineInner .entryTitle {
        font-size: 16px; } }
  .updatesFlexItem .updatesFlexItemChild.magazineInner .entryImg {
    flex: 0 1 33.33%;
    text-align: center;
    margin-bottom: 1.75em; }
    .updatesFlexItem .updatesFlexItemChild.magazineInner .entryImg img {
      border: 1px solid #ccc; }
  .updatesFlexItem .updatesFlexItemChild.magazineInner .entryBody {
    flex: 0 1 66.66%;
    padding-right: 25px; }
    @media screen and (max-width: 960px) {
      .updatesFlexItem .updatesFlexItemChild.magazineInner .entryBody {
        padding-right: 0; } }

.indexSection02 {
  background: rgba(228, 0, 44, 0.1);
  border-top: 1px solid #e4002c;
  border-bottom: 1px solid #e4002c; }

.movieBoxInner {
  padding: 25px; }
  @media screen and (max-width: 960px) {
    .movieBoxInner {
      padding: 20px 15px; } }
  .movieBoxInner .movieBoxInnerChild {
    margin: 25px; }
    @media screen and (max-width: 960px) {
      .movieBoxInner .movieBoxInnerChild {
        margin: 1.75em 0; } }

.movieContents {
  height: 100%;
  padding: 0 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center; }
  .movieContents a {
    position: relative;
    display: block;
    background: #000; }
    .movieContents a::after {
      content: url("../images/common/icon_movie.png");
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      line-height: 1;
      opacity: 0.8;
      transition: opacity 0.15s; }
    .movieContents a[href*='youtube']::after {
      content: url("../images/common/icon_youtube.png"); }
    .movieContents a:hover::after {
      opacity: 0.5; }
  .movieContents img {
    width: 100%;
    max-height: 300px;
    object-fit: contain;
    border: 3px solid #fff; }
    @media screen and (max-width: 440px) {
      .movieContents img {
        max-height: 190px; } }
  .movieContents figcaption {
    font-size: 14px;
    line-height: 28px;
    background: #fff;
    border: 1px solid #aaa;
    padding: 0 10px;
    margin: 5px 0 1px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; }
    @media screen and (max-width: 440px) {
      .movieContents figcaption {
        font-size: 12px; } }

.indexSection03 {
  background: #fff; }

.snsFlexBox {
  display: flex;
  flex-wrap: wrap; }

.snsFlexItem {
  flex-basis: 33.33%;
  overflow: hidden;
  padding: 15px 0 0; }
  @media screen and (max-width: 960px) {
    .snsFlexItem {
      flex-basis: 100%;
      padding: 0; }
      .snsFlexItem:nth-child(2n+1) {
        background: #def; } }
  .snsFlexItem .snsFlexItemInner {
    padding: 25px;
    height: 100%; }
    @media screen and (max-width: 960px) {
      .snsFlexItem .snsFlexItemInner {
        padding: 20px 15px; } }
    .snsFlexItem .snsFlexItemInner .snsFlexItemChild {
      margin: 25px 0; }
      @media screen and (max-width: 960px) {
        .snsFlexItem .snsFlexItemInner .snsFlexItemChild {
          margin: 1.75em 0 0; } }

.instagram-follow-button {
  position: relative;
  display: inline-block;
  font-size: 13px;
  font-family: "Helvetica Neue", Arial, sans-serif;
  line-height: 2;
  height: 28px;
  background: linear-gradient(165deg, #427eff 0%, #f13f79 70%) no-repeat;
  color: #fff !important;
  text-decoration: none;
  padding: 1px 12px;
  white-space: nowrap;
  border-radius: 15px;
  overflow: hidden; }
  .instagram-follow-button::before {
    content: "";
    position: absolute;
    top: 12px;
    left: -18px;
    width: 160px;
    height: 40px;
    background: radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%); }
  .instagram-follow-button span {
    position: relative;
    z-index: 2; }

.snsFlexItem.noshrinp {
  flex-basis: 100%;
  padding: 0; }
  @media screen and (max-width: 960px) {
    .snsFlexItem.noshrinp {
      padding-top: 20px; } }
  .snsFlexItem.noshrinp .snsFlexItemInner {
    padding: 0 25px; }
  .snsFlexItem.noshrinp .snsFlexItemChild {
    margin: 0; }
    .snsFlexItem.noshrinp .snsFlexItemChild .snsButton {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      gap: 15px 0; }
      .snsFlexItem.noshrinp .snsFlexItemChild .snsButton li {
        flex-basis: 23%; }
        @media screen and (max-width: 960px) {
          .snsFlexItem.noshrinp .snsFlexItemChild .snsButton li {
            flex-basis: 49%; } }
  @media screen and (max-width: 960px) and (max-width: 440px) {
    .snsFlexItem.noshrinp .snsFlexItemChild .snsButton li {
      flex-basis: 100%; } }

.snsButtonItem {
  height: 100%;
  /* margin-bottom: 30px; */ }
  .snsButtonItem a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    border: 4px solid #aaa;
    padding: 15px; }
    .snsButtonItem a img {
      display: block;
      height: 30px; }
    .snsButtonItem a span {
      display: block;
      font-size: 14px;
      line-height: 1;
      padding-top: 1em; }
    .snsButtonItem a.fastForward::before {
      position: absolute;
      top: 50%;
      left: auto;
      right: 0;
      transform: translate(0, -50%); }
    .snsButtonItem a:hover::before {
      animation: ffAnimationOut 0.5s forwards infinite linear; }
  .snsButtonItem.YT a {
    border-color: #fb031b; }
    .snsButtonItem.YT a.fastForward::before {
      border-color: transparent transparent transparent #fb031b;
      filter: drop-shadow(10px 0 0 #fb031b); }
  .snsButtonItem.TW a {
    border-color: #1d9bf0; }
    .snsButtonItem.TW a.fastForward::before {
      border-color: transparent transparent transparent #1d9bf0;
      filter: drop-shadow(10px 0 0 #1d9bf0); }
  .snsButtonItem.Xcom a {
    border-color: #000; }
    .snsButtonItem.Xcom a.fastForward::before {
      border-color: transparent transparent transparent #000;
      filter: drop-shadow(10px 0 0 #000); }
  .snsButtonItem.IG {
    position: relative; }
    .snsButtonItem.IG::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 4px;
      background: linear-gradient(165deg, #427eff 0%, #f13f79 70%) no-repeat;
      z-index: 2; }
    .snsButtonItem.IG::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 4px;
      background: linear-gradient(165deg, #ffdb2c 0%, #f13f79 70%) no-repeat;
      z-index: 2; }
  .snsButtonItem.IG a {
    border-right-color: #f13f79; }
    .snsButtonItem.IG a::after {
      content: "";
      position: absolute;
      top: 0;
      left: -4px;
      width: 4px;
      height: 100%;
      background: linear-gradient(165deg, #427eff 0%, #ff6922 50%, #ffdb2c 90%) no-repeat;
      z-index: 2; }
    .snsButtonItem.IG a.fastForward::before {
      border-color: transparent transparent transparent #f13f79;
      filter: drop-shadow(10px 0 0 #f13f79); }
  .snsButtonItem.FB a {
    border-color: #1878f3; }
    .snsButtonItem.FB a.fastForward::before {
      border-color: transparent transparent transparent #1878f3;
      filter: drop-shadow(10px 0 0 #1878f3); }

/* --------------------------------------------------------------------------------------
    Swiper custom
-------------------------------------------------------------------------------------- */
.swiperOuter {
  position: relative;
  padding: 0 50px; }
  @media screen and (max-width: 960px) {
    .swiperOuter {
      padding: 0 20px; } }

.swiper-pagination {
  position: relative;
  z-index: 2;
  display: flex;
  height: 30px;
  justify-content: center;
  align-items: flex-end;
  gap: 10px; }

.swiper-pagination-bullet {
  display: inline-block;
  width: 14px;
  height: 14px;
  background: #000;
  border-radius: 50%;
  opacity: 0.2; }

.swiper-pagination-bullet-active {
  background: #e4002c;
  opacity: 0.8; }

.swiper-button-prev {
  position: absolute;
  top: 50%;
  left: -8px;
  z-index: 2;
  transform: translateY(calc(-50% - 28px));
  font-size: 36px;
  line-height: 1.5;
  color: #e4002c;
  cursor: pointer; }
  @media screen and (max-width: 440px) {
    .swiper-button-prev {
      font-size: 30px; } }

.swiper-button-next {
  position: absolute;
  top: 50%;
  right: -8px;
  z-index: 2;
  transform: translateY(calc(-50% - 28px));
  font-size: 36px;
  line-height: 1.5;
  color: #e4002c;
  cursor: pointer; }
  @media screen and (max-width: 440px) {
    .swiper-button-next {
      font-size: 30px; } }

.swiper-slide {
  height: auto; }