@charset "UTF-8";

/* 2022改修(padding) */
#topBnr {
  padding: 30px 50px 40px;
  width: 100%;
  position: relative;
}

/* 2022改修(background-color) */
#topBnr::before {
  content: "";
  width: 100%;
  height: 80px;
  /* background-color: #f5f2ed; */
  display: block;
  left: 0px;
  bottom: 0px;
  position: absolute;
}

#topBnr > .container {
  padding: 0px;
}

@media screen and (max-width: 768px) {
  /* 2022改修(padding) */
  #topBnr {
    padding: 10px 0px 43px;
  }
  #topBnr::before {
    height: 73px;
  }
  #topBnr .slick-prev,
  #topBnr .slick-next {
    width: 30px !important;
    height: 30px !important;
    top: auto !important;
    bottom: -52px !important;
    -webkit-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    transform: translate(0, 0) !important;
  }

  #topBnr .slick-prev {
    left: 10px !important;
    z-index: 11 !important;
  }

  #topBnr .slick-next {
    right: 10px !important;
    z-index: 12 !important;
  }

  #topBnr .slick-dots {
    bottom: -45px !important;
    z-index: 10 !important;
  }
}

#topMain > section {
  width: 100%;
}

#topMain .button.is-danger {
  margin: 0px auto;
  padding: 12px 46px 18px 20px;
  width: 345px;
  background: #6dbabd url("../img/common/arr_r_dg.png") no-repeat right 16px center / 16px auto;
  border-radius: 33px;
  color: #fff;
  font-size: 24px;
  line-height: 35px;
  text-align: center;
  letter-spacing: 0.075em;
  display: block;
  box-sizing: border-box;
  transition-property: opacity;
  transition: 0.5s;
}

#topMain .button.is-danger--w {
  margin: 0px auto;
  padding: 12px 46px 18px 20px;
  width: 545px;
  background: #6dbabd url("../img/common/arr_r_dg.png") no-repeat right 16px center / 16px auto;
  border-radius: 33px;
  color: #fff;
  font-size: 24px;
  line-height: 35px;
  text-align: center;
  letter-spacing: 0.075em;
  display: block;
  box-sizing: border-box;
  transition-property: opacity;
  transition: 0.5s;
}
#topMain .button.is-danger--w br {
  display: none;
}

#topMain .button.is-danger:hover {
  opacity: 0.7;
}

@media screen and (max-width: 768px) {
  #topMain .button.is-danger,
  #topMain .button.is-danger--w {
    padding: 8px 35px 12px 10px;
    width: 273px;
    background-size: 12px auto;
    border-radius: 28px;
    font-size: 21px;
    line-height: 24px;
    letter-spacing: 0px;
  }
  #topMain .button.is-danger--w br {
    display: block;
  }
}

#topSearch {
  background-color: #f8f6e5;
}

#topPick,
#topVr,
#topEvent,
#topColumn,
#topMovie,
#topSenior {
  background-color: #fff0d2;
}

/* 2022改修(削除)
#topSearch > .topSecH,
#topEvent > .topSecH,
#topColumn > .topSecH,
#topSenior > .topSecH {
  background-color: #ff8400;
}
#topPick > .topSecH,
#topMovie > .topSecH {
  background-color: #ef7c1f;
}
*/

/* 2022改修(波状背景) */
#topPick > .topSecH,
#topVr > .topSecH,
#topSenior > .topSecH,
#topEvent > .topSecH,
#topColumn > .topSecH,
#topSearch > .topSecH,
#topMovie > .topSecH {
  background: url("../img/common/h2_bcg1.png") repeat-x;
}
#profession > .topSecH {
  background: url("../img/common/h2_bcg2.png") repeat-x;
}

/* #topSearch > .topSecH {
  background-image: url("../img/common/icon_head1.png");
  background-size: 120px auto;
  background-position: calc(50% + 230px) 20px;
} */

/* #topPick > .topSecH {
  background-image: url("../img/common/icon_head2.png");
  background-size: 120px auto;
  background-position: calc(50% + 310px) -40px;
} */

/* #topEvent > .topSecH {
  background-image: url("../img/common/icon_head3.png");
  background-size: 120px auto;
  background-position: calc(50% + 310px) 10px;
} */

/* #topColumn > .topSecH {
  background-image: url("../img/common/icon_head4.png");
  background-size: 120px auto;
  background-position: calc(50% + 310px) 10px;
} */

/* #topMovie > .topSecH {
  background-image: url("../img/common/icon_head5.png");
  background-size: 120px auto;
  background-position: calc(50% + 310px) 10px;
} */

/* #topSenior > .topSecH {
  background-image: url("../img/common/icon_head6.png");
  background-size: 120px auto;
  background-position: calc(50% + 310px) 10px;
} */

/* 2022改修(削除)
#topSearch > .topSecH::before {
  background-image: url("../img/common/nami_b_b.svg");
  background-size: 800px auto;
}

#topPick > .topSecH::before,
#topEvent > .topSecH::before,
#topColumn > .topSecH::before,
#topMovie > .topSecH::before,
#topSenior > .topSecH::before {
  background-image: url("../img/common/nami_b.svg");
  background-size: 800px auto;
}

#topSearch > .topSecH::after {
  background-image: url("../img/common/nami_t_g.svg");
  background-size: 800px auto;
}

#topPick > .topSecH::after {
  background-image: url("../img/common/nami_t_b.svg");
  background-size: 800px auto;
}

#topEvent > .topSecH::after,
#topColumn > .topSecH::after,
#topMovie > .topSecH::after,
#topSenior > .topSecH::after {
  background-image: url("../img/common/nami_t.svg");
  background-size: 800px auto;
}
*/

/* 2022改修(見出しキャラ) */
#topPick > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char1.png");
  margin-left: -100px;
  margin-top: -40px;
}
#topVr > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char2.png");
  margin-left: -100px;
  margin-top: -40px;
}
#topEvent > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char3.png");
  margin-left: -100px;
  margin-top: -40px;
}
#topColumn > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char4.png");
  margin-left: -100px;
  margin-top: -40px;
}
#topSearch > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char5.png");
  margin-left: -100px;
  margin-top: -40px;
}
#topSenior > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char6.png");
  margin-left: -100px;
  margin-top: -40px;
}
#topMovie > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char7.png");
  margin-left: -100px;
  margin-top: -40px;
}
#profession > .topSecH > h2::before {
  position: absolute;
  content: url("../img/common/h2_char8.png");
  margin-left: -100px;
  margin-top: -40px;
}

@media screen and (max-width: 768px) {
  #topPick > .topSecH > h2::before {
    content: url("../img/common/h2_char1_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
  #topVr > .topSecH > h2::before {
    content: url("../img/common/h2_char2_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
  #topEvent > .topSecH > h2::before {
    content: url("../img/common/h2_char3_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
  #topColumn > .topSecH > h2::before {
    content: url("../img/common/h2_char4_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
  #topSearch > .topSecH > h2::before {
    content: url("../img/common/h2_char5_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
  #topSenior > .topSecH > h2::before {
    content: url("../img/common/h2_char6_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
  #topMovie > .topSecH > h2::before {
    content: url("../img/common/h2_char7_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
  #profession > .topSecH > h2::before {
    content: url("../img/common/h2_char8_sp.png");
    margin-left: -60px;
    margin-top: -30px;
  }
}

/* 2022改修(#topVr, 全体的改修) */
@media screen and (max-width: 768px) {
  #topSearch > .topSecH {
    background-size: 25px auto;
    /* background-position: right 18px top 0px; */
  }
  #topPick > .topSecH {
    background-size: 25px auto;
    /* background-position: right -30px top -25px; */
  }
  #topVr > .topSecH {
    background-size: 25px auto;
    /* background-position: right -30px top -25px; */
  }
  #topEvent > .topSecH {
    background-size: 25px auto;
    /* ackground-position: right -30px top -10px; */
  }
  #topColumn > .topSecH {
    background-size: 25px auto;
    /* ackground-position: right 0px top 0px; */
  }
  #topMovie > .topSecH {
    background-size: 25px auto;
    /* background-position: right 0px top 0px; */
  }
  #topSenior > .topSecH {
    background-size: 25px auto;
    /* background-position: right 0px top 0px; */
  }
  #profession > .topSecH {
    background-size: 25px auto;
    /* background-position: right 0px top 0px; */
  }
  .topSecH h2 {
    font-size: 20px;
    line-height: 20px;
    letter-spacing: -1px;
  }
  .topSecH p:first-of-type {
    margin: 0px auto 8px;
    font-size: 15px;
    line-height: 20px;
    opacity: 0.6;
  }
  .topSecH p:last-of-type {
    padding: 10px 0px 0px;
    font-size: 14px;
    line-height: 20px;
  }
  .topSecH p:last-of-type::before {
    content: "";
    margin-left: -22px;
    width: 44px;
    height: 2px;
    background-color: #8a4f24;
    display: block;
    left: 50%;
    top: 0px;
    position: absolute;
  }
}

/* 2022改修(#topVr,padding,background) */
#topSearch > .container {
  padding: 30px 20px 68px;
  text-align: center;
}
#topPick > .container {
  padding: 60px 50px 120px;
  /* background: url("../img/common/icon_char1.png") no-repeat center bottom 48px / 89px auto; */
  text-align: center;
}
#topVr > .container {
  padding: 60px 50px 120px;
  /* background: url("../img/common/icon_char1.png") no-repeat center bottom 48px / 89px auto; */
  text-align: center;
}
#topColumn > .container {
  padding: 60px 50px 120px;
  /* background: url("../img/common/icon_char3.png") no-repeat center bottom 48px / 89px auto; */
  text-align: center;
}
#topMovie > .container {
  padding: 60px 20px 120px;
  /* background: url("../img/common/icon_char4.png") no-repeat center bottom 48px / 89px auto; */
  text-align: center;
}

/* 2022改修(#topVr) */
@media screen and (max-width: 768px) {
  #topSearch > .container {
    padding: 10px 5px 75px;
  }
  #topPick > .container {
    padding: 23px 0 100px;
    background-position: center bottom 28px;
    background-size: 60px auto;
  }
  #topVr > .container {
    padding: 23px 0 100px;
    background-position: center bottom 28px;
    background-size: 60px auto;
  }
  #topColumn > .container {
    padding: 23px 0px 100px;
    background-position: center bottom 28px;
    background-size: 60px auto;
  }
  #topMovie > .container {
    padding: 23px 0 100px;
    background-position: center bottom 28px;
    background-size: 60px auto;
  }
}
#topSearch > .container > p {
  margin: 0px auto 10px;
  color: #ff6e04;
  font-size: 24px;
  line-height: 28px;
}

#topSearch > .container .field {
  margin: 0px auto 48px;
}

#topSearch > .container .file-label {
  align-items: center;
  justify-content: center;
  display: flex;
}

#topSearch > .container input[type="text"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  padding: 15px 20px;
  width: 352px;
  height: 56px;
  background-color: #fff;
  border: 3px #ff8400 solid;
  border-radius: 10px;
  font-size: 15px;
  line-height: 20px;
  box-sizing: border-box;
}

#topSearch > .container button {
  margin: 0px 0px 0px 14px;
  padding: 0px;
  width: 56px;
  height: 56px;
  background: #6cbabe url("../img/common/icon_search.png") no-repeat center center / contain;
  border: none;
  border-radius: 50%;
  font-size: 0;
  line-height: 0;
  box-sizing: content-box;
  display: block;
  cursor: pointer;
  transition: opacity 0.5s;
}

#topSearch > .container button:hover {
  opacity: .7;
}

#topSearch > .container .buttons {
  align-items: stretch;
  justify-content: center;
  display: flex;
}

#topSearch > .container .buttons .button {
  margin: 0px 15px;
  padding: 20px 70px 20px 10px;
  background: #6cbabe url("../img/common/arr_r_bt.png") no-repeat right 26px center / 34px auto;
  border-radius: 10px;
  color: #fff;
  font-size: 25px;
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.1em;
  display: block;
  box-sizing: border-box;
  flex: 1;
  transition-property: opacity;
  transition: 0.5s;
}

#topSearch > .container .buttons .button.web {
  margin: 20px 15px  0px 15px;
  padding: 20px 0px 20px 0px;
  background-color: #7ca7c9;
  background-image: url("../img/common/icon_web.png"), url("../img/common/arr_r_btb.png");
  background-repeat: no-repeat, no-repeat;
  background-position: left 26px center, right 26px center;
  background-size: 56px auto, 34px auto;
  border-radius: 10px;
  color: #fff;
  font-size: 25px;
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.1em;
  display: block;
  box-sizing: border-box;
  flex: 1;
  transition-property: opacity;
  transition: 0.5s;
  max-width: 100%;
}

/* 2022改修(.button.vr) */
#topSearch > .container .buttons .button.vr {
  margin: 20px 15px  0px 15px;
  padding: 20px 0px 20px 0px;
  background-color: #d84243;
  background-image: url("../img/common/icon_vr.png"), url("../img/common/arr_r_btr.png");
  background-repeat: no-repeat, no-repeat;
  background-position: left 26px center, right 26px center;
  background-size: 56px auto, 34px auto;
  border-radius: 10px;
  color: #fff;
  font-size: 25px;
  line-height: 30px;
  text-align: center;
  letter-spacing: 0.1em;
  display: block;
  box-sizing: border-box;
  flex: 1;
  transition-property: opacity;
  transition: 0.5s;
  max-width: 100%;
}

#topSearch > .container .buttons .button:hover {
  opacity: 0.7;
}


#topSearch > .container .buttons .button span {
  font-size: 28px;
}

#topSearch > .container .buttons .button br {
  display: none;
}

@media screen and (max-width: 768px) {
  #topSearch > .container > p {
    margin: 0px auto 6px;
    font-size: 18px;
    line-height: 20px;
  }
  #topSearch > .container .field {
    margin: 0px auto 25px;
  }
  #topSearch > .container input[type="text"] {
    padding: 13px 16px;
    max-width: 280px;
    width: auto;
    height: 45px;
    border: 2px #ff8400 solid;
    border-radius: 5px;
    font-size: 12px;
    line-height: 15px;
    flex: 1;
  }
  #topSearch > .container button {
    margin: 0px 0px 0px 11px;
    width: 45px;
    height: 45px;
  }
  #topSearch > .container .buttons {
    align-items: stretch;
    justify-content: center;
    display: flex;
  }
  #topSearch > .container .buttons .button {
    margin: 0px 5px;
    padding: 12px 0px 35px;
    background-position: center bottom 9px;
    background-size: 20px auto;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.05em;
  }
  #topSearch > .container .buttons .button.web,
  #topSearch > .container .buttons .button.vr {
    margin: 10px 5px 0px 5px;
    padding: 24px 40px 24px 80px;
    background-position: left 12px center, right 12px center;
    background-size: 52px auto, 20px auto;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.05em;
    text-align: left;
  }
  #topSearch > .container .buttons .button span {
    font-size: 18px;
  }
  #topSearch > .container .buttons .button br {
    display: block;
  }
}

@media screen and (min-width:769px) and (max-width:1023px) {
  #topSearch > .container .buttons .button.web {
    /* margin: 10px 5px 0px 5px; */
    padding: 24px 54px 24px 80px;
    background-position: left 12px center, right 12px center;
    background-size: 56px auto, 34px auto;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0.05em;
  }
}

#topSearch > .container .buttons .button.web.feature {
  background-image: none, url("../img/common/arr_r_btb.png");
  background-repeat: no-repeat, no-repeat;
  text-align: center;
}

/* 2022改修(#topVr) */
#topPick > .container .slick-slide,
#topVr > .container .slick-slide {
  color: #000;
  font-size: 18px;
  line-height: 24px;
  text-align: left;
}
#topPick > .container .slick-slide > div,
#topVr > .container .slick-slide > div {
  padding: 0px 14px;
}
#topPick > .container .slick-slide > div > p:first-of-type,
#topVr > .container .slick-slide > div > p:first-of-type {
  margin: 0px 0px 24px;
  font-size: 0;
  line-height: 0;
}
#topPick > .container .slick-slide > div > p:first-of-type img,
#topVr > .container .slick-slide > div > p:first-of-type img {
  border-radius: 20px;
}
#topPick > .container .slick-slide > div > strong,
#topVr > .container .slick-slide > div > strong {
  margin: 0px 0px 6px;
  font-weight: bold;
  display: block;
}
#topPick > .container .slick-prev,
#topPick > .container .slick-next,
#topVr > .container .slick-prev,
#topVr > .container .slick-next {
  width: 46px !important;
  height: 46px !important;
}

/* 2022改修 */
#topVr > .container .slick-slide > div,
#topVr > .container .slick-slide > div > p {
  position: relative;
}
#topVr > .container .slick-slide > div > p:first-child::after {
  display: block;
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: url('/assets/2022/img/common/icon_play.png') no-repeat center center / contain;
  font-size: 0px;
  line-height: 0px;
  left: 0px;
  top: 0px;
}

@media screen and (max-width: 768px) {
  #topPick > .container .slick-slide,
  #topVr > .container .slick-slide,
  #topMovie > .container .slick-slide {
    font-size: 14px;
    line-height: 20px;
  }
  #topPick > .container .slick-slide > div,
  #topVr > .container .slick-slide > div,
  #topMovie > .container .movie-thumb {
    padding: 0px 7px;
  }
  #topPick > .container .slick-slide > div > p:first-of-type img,
  #topVr > .container .slick-slide > div > p:first-of-type img,
  #topMovie > .container .slick-slide > div > p:first-of-type img {
    border-radius: 15px;
  }
  #topPick > .container .slick-prev,
  #topPick > .container .slick-next,
  #topVr > .container .slick-prev,
  #topVr > .container .slick-next,
  #topMovie > .container .slick-prev,
  #topMovie > .container .slick-next {
    width: 30px !important;
    height: 30px !important;
  }
  #topPick > .container .slick-prev,
  #topVr > .container .slick-prev {
    left: 15px;
    z-index: 1;
  }
  #topPick > .container .slick-next,
  #topVr > .container .slick-next {
    right: 15px;
  }
}

#topColumn > .container .slick-column {
  padding: 0px 0px 60px;
}

#topColumn > .container .slick-slide {
  font-size: 19px;
  line-height: 29px;
  text-align: left;
}

#topColumn > .container .slick-slide > a {
  margin: 0px 20px;
  background-color: #fff;
  border-radius: 10px;
  color: #000;
  display: block;
  overflow: hidden;
}

#topColumn > .container .slick-slide > a figure {
  position: relative;
  width: 100%;
  padding-top: 66.6%;
  overflow: hidden;
}

#topColumn > .container .slick-slide > a figure img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: auto;
}
#topColumn > .container .slick-slide > a p {
  padding: 30px 15px;
  min-height: 147px;
  display: block;
  box-sizing: border-box;
}

@media screen and (max-width: 768px) {
  #topColumn > .container .slick-column {
    padding: 0px 0px 70px;
  }
  #topColumn > .container .slick-slide {
    font-size: 11px;
    line-height: 16px;
  }
  #topColumn > .container .slick-slide > a {
    margin: 0px 5px;
    border-radius: 5px;
  }
  #topColumn > .container .slick-slide > a p {
    padding: 16px 9px;
    min-height: 80px;
  }
  #topColumn .slick-prev,
  #topColumn .slick-next {
    width: 30px !important;
    height: 30px !important;
    top: auto !important;
    bottom: 20px !important;
    -webkit-transform: translate(0, 0) !important;
    -ms-transform: translate(0, 0) !important;
    transform: translate(0, 0) !important;
  }
  #topColumn .slick-prev {
    left: 10px !important;
  }
  #topColumn .slick-next {
    right: 10px !important;
  }
}

/* 2022改修(.tab-conline) */
/* #topEvent > .container > .tab-online > .tab-online_contents {
  background-color: #ffffff;
  border-radius: 12px;
  margin-bottom: 50px;
  height: 500px;
  overflow: hidden;
}
#topEvent > .container > .tab-online > .tab-online_contents li {
  margin: 0 auto;
  padding: 10px;
  width: 95%;
  height: 100px;
  text-align: left;
  font-size: 18px;
  border-bottom: 1px #999999 dotted;
  background: url("/assets/2022/img/common/bcg_link-symbol.png") no-repeat center right;
}
#topEvent > .container > .tab-online > .tab-online_contents a {
  color: #000;
}
#topEvent > .container > .tab-online > .tab-online_contents a:nth-child(5) li {
  border-bottom: none;
}
#topEvent > .container > .tab-online > .tab-online_contents li figure {
  display: inline-block;
  position: relative;
  overflow: hidden;
  width: 80px;
  height: 80px;
  vertical-align: middle;
}
#topEvent > .container > .tab-online > .tab-online_contents li figure img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#topEvent > .container > .tab-online > .tab-online_contents li p {
  display: inline-block;
  vertical-align: middle;
  width: 80%;
  padding: 10px;
  overflow-y: auto;
}

@media screen and (max-width: 768px) {
  #topEvent > .container > .tab-online > .tab-online_contents li {
    background-size: 20px;
  }
  #topEvent > .container > .tab-online > .tab-online_contents li p {
    display: inline-block;
    vertical-align: middle;
    width: 80%;
    max-height: 80px;
    padding: 10px;
    font-size: 14px;
    line-height: 1.2;
  }
}
@media screen and (max-width:480px) {
  #topEvent > .container > .tab-online > .tab-online_contents li p {
    width: 70%;
  }
} */

/* 2023改修(.tab-conline) */
#topEvent > .container > .tab-online > .tab-online_contents {
  background-color: #ffffff;
  border-radius: 12px;
  margin-bottom: 50px;
  overflow: hidden;
  display: grid;
  grid-template-columns: repeat(2, 50%);
  padding: 18px;
}
#topEvent > .container > .tab-online > .tab-online_contents li {
  margin: 0 auto;
  padding: 10px 0 10px 10px;
  font-size: 18px;
  border-top: 1px #999999 dotted;
  border-right: 1px #999999 dotted;
  display: flex;
}

#topEvent > .container > .tab-online > .tab-online_contents li:nth-child(n+7) {
  display: none;
}

#topEvent > .container > .tab-online > .tab-online_contents li:nth-child(1),
#topEvent > .container > .tab-online > .tab-online_contents li:nth-child(2) {
    border-top: none;
}

#topEvent > .container > .tab-online > .tab-online_contents li:nth-child(even) {
  border-right: none;
}

#topEvent > .container > .tab-online > .tab-online_contents a {
  color: #000;
  display: flex;
}

#topEvent > .container > .tab-online > .tab-online_contents li a::after {
  content: "";
  display: block;
  width: 15%;
  background: url("/assets/2022/img/common/bcg_link-symbol.png") no-repeat center;
}

#topEvent > .container > .tab-online > .tab-online_contents div {
  width: 85%;
}


#topEvent > .container > .tab-online > .tab-online_contents li p {
  text-align: left;
}

@media screen and (max-width: 768px) {
  #topEvent > .container > .tab-online > .tab-online_contents {
    grid-template-columns: 100%;
  }
  #topEvent > .container > .tab-online > .tab-online_contents li {
    background-size: 20px;
  }
  #topEvent > .container > .tab-online > .tab-online_contents li p {
    font-size: 14px;
    line-height: 1.2;
    margin-top: 8px;
  }

  #topEvent > .container > .tab-online > .tab-online_contents li {
    border-right: none;
  }

  #topEvent > .container > .tab-online > .tab-online_contents li:nth-child(2) {
    border-top: 1px #999999 dotted;
  }
}

/* 2022改修(.tab-column) */
#topColumn > .container > .tab-column > .tab-column_category {
  margin: 0;
  width: 100%;
  height: 57px;
  background-color: #ffd965;
  border-radius: 12px 12px 0 0;
  overflow: hidden;
}
#topColumn > .container > .tab-column > .tab-column_category li {
  position: relative;
  display: inline-block;
  width: 25%;
  height: 57px;
  background: url("/assets/2022/img/common/bcg_tab-column_category.png") no-repeat center right;
  border-radius: 12px 12px 0 0;
  cursor: pointer;
  font-size: 20px;
  color: #ff8401;
  text-align: center;
  letter-spacing: -1px;
}
#topColumn > .container > .tab-column > .tab-column_category li:last-child,
#topColumn > .container > .tab-column > .tab-column_category li.no-border {
  background: none;
}
#topColumn > .container > .tab-column > .tab-column_category li.active {
  background: none;
  background-color: #ffffff;
}
#topColumn > .container > .tab-column > .tab-column_category li p {
  position: absolute;
  vertical-align: middle;
  width: 90%;
  height: auto;
  max-height: 57px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  line-height: 1;
  overflow: hidden;
}
#topColumn > .container > .tab-column > .tab-column_contents {
  display: none;
  background-color: #ffffff;
  border-radius: 0 0 12px 12px;
  margin-bottom: 50px;
  height: 600px;
  overflow: hidden;
}
#topColumn > .container > .tab-column > .tab-column_contents.active {
  display: block;
}
#topColumn > .container > .tab-column > .tab-column_contents li {
  margin: 0 auto;
  padding: 10px;
  width: 95%;
  height: 100px;
  border-bottom: 1px #999999 dotted;
  background: url("/assets/2022/img/common/bcg_link-symbol.png") no-repeat center right;
  font-size: 18px;
  text-align: left;
}
#topColumn > .container > .tab-column > .tab-column_contents a {
  color: #000;
}
#topColumn > .container > .tab-column > .tab-column_contents a:nth-child(6) li {
  border-bottom: none;
}
#topColumn > .container > .tab-column > .tab-column_contents li figure {
  display: inline-block;
  position: relative;
  overflow: hidden;
  width: 80px;
  height: 80px;
  vertical-align: middle;
}
#topColumn > .container > .tab-column > .tab-column_contents li figure img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
#topColumn > .container > .tab-column > .tab-column_contents li p {
  display: inline-block;
  vertical-align: middle;
  width: 85%;
  max-height: 80px;
  padding: 10px;
  line-height: 1.2;
  overflow-y: auto;
}

@media screen and (max-width: 768px) {
  #topColumn > .container > .tab-column > .tab-column_category li {
    font-size: 13px;
  }
  #topColumn > .container > .tab-column > .tab-column_contents li {
    background-size: 20px;
  }
  #topColumn > .container > .tab-column > .tab-column_contents li p {
    display: inline-block;
    vertical-align: middle;
    width: 80%;
    max-height: 80px;
    padding: 10px;
    font-size: 14px;
    line-height: 1.2;
  }
}
@media screen and (max-width:480px) {
  #topColumn > .container > .tab-column > .tab-column_contents li p {
    width: 70%;
  }
}

#topMovie > .container > div {
  padding: 0px 34px 8px;
  flex-wrap: wrap;
  display: flex;
}

#topMovie > .container > div > .column.is-4 {
  width: 25%;
}

#topMovie > .container > div > .column.is-4 > div {
  padding: 0px 14px 52px;
}

#topMovie > .container > div > .column.is-4 > div p:first-of-type {
  font-size: 0px;
  line-height: 0px;
  position: relative;
  transition-property: opacity;
  transition: 0.5s;
  cursor: pointer;
}

#topMovie > .container > div > .column.is-4 > div p:first-of-type:hover {
  opacity: 0.7;
}

#topMovie > .container > div > .column.is-4 > div p:first-of-type img {
  width: 100%;
  height: auto;
}

#topMovie > .container > div > .column.is-4 > div p:first-of-type::after {
  content: "";
  width: 100%;
  height: 100%;
  background: url("../img/common/icon_play.png") no-repeat center center / contain;
  font-size: 0px;
  line-height: 0px;
  display: block;
  left: 0px;
  top: 0px;
  position: absolute;
}

#topMovie > .container > div > .column.is-4 > div strong,
#topMovie > .container > div > .column.is-4 > div p:not(:first-of-type) {
  display: none;
}

@media screen and (max-width: 768px) {

  #topMovie > .container > div {
    padding: 0px 0px 5px;
  }

  #topMovie > .container > div > .column.is-4 {
    width: 50%;
  }

  #topMovie > .container > div > .column.is-4 > div {
    padding: 0px 8px 33px;
  }

  #topMovie > .container > div > .column.is-4 > div p:first-of-type {
    font-size: 0px;
    line-height: 0px;
    position: relative;
  }
}

/* 2022改修(.movie-thumb) */
#topMovie > .container > .slick-recommend {
  padding-bottom: 50px;
}
#topMovie .movie-thumb > p {
  position: relative;
  margin-bottom: 15px;
}
#topMovie .movie-thumb > p:first-child::after {
  display: block;
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: url('/assets/2022/img/common/icon_play.png') no-repeat center center / contain;
  font-size: 0px;
  line-height: 0px;
  left: 0px;
  top: 0px;
}
#topMovie .movie-thumb > p > img {
  width: 450px;
  height: auto;
}
#topMovie > .container > .slick-recommend .slick-prev {
	left: -25px !important;
}
#topMovie > .container > .slick-recommend .slick-next {
	right: -25px !important;
}

@media screen and (max-width: 768px) {
  #topMovie .movie-thumb > p {
    margin-bottom: 10px;
    text-align: left;
  }
  #topMovie > .container > .slick-recommend .slick-prev {
    left: 15px !important;
    z-index: 1;
  }
  #topMovie > .container > .slick-recommend .slick-next {
    right: 15px !important;
  }
}

/* 2023追加 */
.container.egglink {
  padding: 1.6rem 4.4rem 0;
}

.egglink a {
  margin-left: auto;
  padding: .4rem;
  width: fit-content;
  font-size: 1.4rem;
  display: block;
  transition: 0.5s;
  color: #232323;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: .5rem;
  background-color: #fff;
  border-radius: 9999px;
  border: 1px solid var(--primary-color);
  align-items: center;
}

.egglink a:hover {
  background-color: #f99999;
  border-color: #f99999;
  color: #fff;
}

.egglink a::before,
.egglink a::after {
  content: "";
  display: block;
}

.egglink a::after {
  width: 1.9rem;
  height: 1.9rem;
  background-image: url(../img/common/arr_r_w.png);
  background-size: 100%;
  display: block;
}

#topBnr {
  padding-top: 1.6rem;
}

@media screen and (max-width: 928px) {
  .container.egglink {
    padding: 1.6rem 1rem 0;
  }
}
/* 2023追加 END */
