@charset "utf-8";
body {
  min-width: 320px;
}
#mainContents div {
  box-sizing: border-box;
}
#mainContents .btnRight {
  flex-direction: row-reverse;
}
#mainContents .mainContentsIn {
  min-width: 320px;
  font-family: 'Noto Sans JP', sans-serif;
  font-feature-settings: "palt";
  margin: 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guidePcShow {
    display: none;
  }
}
@media screen and (min-width:769px) {
  #mainContents .ott-guideSpShow {
    display: none;
  }
}
#mainContents .ott-guideTransform {
  transform: rotate(20deg);
  display: inline-block;
  margin: 0 4px 0 2px;
}
#mainContents .ott-guideTransform02 {
  transform: rotate(20deg);
  transform-origin: -0.5em 3em;
  display: inline-block;
  margin: 0 5px 0 5px;
}
#mainContents .ott-guideTransform03 {
  transform: rotate(20deg);
  display: inline-block;
  margin: 0 4px 0 2px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTransform03 {
    transform: rotate(20deg);
    transform-origin: -0.5em 3em;
    display: inline-block;
    margin: 0 5px 0 5px;
  }
}
#mainContents .ott-guideInline {
  display: inline-block;
}
#mainContents .ott-guideTxtCenter {
  text-align: center;
}
#mainContents .ott-guideMainVisual a, #mainContents .ott-guideAbout a, #mainContents .ott-guideInfo a, #mainContents .ott-guideMoreInfo a {
  transition: .5s;
}
#mainContents .ott-guideMainVisual a:hover, #mainContents .ott-guideAbout a:hover, #mainContents .ott-guideInfo a:hover, #mainContents .ott-guideMoreInfo a:hover {
  text-decoration: none;
  opacity: .5;
}
#mainContents .mainContentsIn img {
  width: 100%;
  height: auto;
  image-rendering: -webkit-optimize-contrast;
}
@media screen and (max-width:379px) {
  #mainContents .ott-guideMoreInfoIn .ott-guideButtonCenter {
    font-size: calc(100% / 1.1);
  }
}
#mainContents .ott-guideTxtLink {
  color: #0044FF;
  border-bottom: #0044FF solid 1px;
}
#mainContents .ott-guideAbout .ott-guideTxtCenter:nth-of-type(2) img {
  filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.15));
}
#mainContents .ott-guideMainVisualIn {
  max-width: 1032px;
  text-align: center;
  margin: 0 auto;
  padding: 0 16px;
}
#mainContents .ott-guideMainVisualIn h1 {
  font-size: 26px;
  font-weight: bold;
  color: #0095FF;
  vertical-align: bottom;
  display: inline;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMainVisualIn h1 {
    font-size: calc(36 / 750 * 100vw);
    margin: 28px auto 24px auto;
  }
}
#mainContents .ott-guideMainVisualIn h1 img {
  width: calc(640 / 1100 * 100vw);
  max-width: 640px;
  margin-right: 10px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMainVisualIn h1 img {
    width: calc(480 / 750 * 100vw);
    margin-right: 5px;
  }
}
#mainContents .ott-guideMainVisualIn h1 .ott-guideHeadlinebottom {
  vertical-align: bottom;
}
#mainContents .ott-guideMainVisualIn h2 {
  color: #0099FF;
  font-weight: bold;
  font-size: 26px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMainVisualIn h2 {
    font-size: 24px;
  }
}
#mainContents .ott-guideMainVisualTxt {
  font-size: 21px;
  margin: 32px 0 40px 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMainVisualTxt {
    font-size: 18px;
    text-align: left;
    line-height: 1.5;
    margin: 18px 0;
  }
}
#mainContents .ott-guideMainVisualIn ul:first-of-type {
  width: calc(1020 / 1100 * 100vw);
  max-width: 1020px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
  padding: 20px 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMainVisualIn ul:first-of-type {
    flex-wrap: wrap;
    justify-content: center;
  }
}
#mainContents .ott-guideMainVisualIn ul:first-of-type li:first-of-type {
  width: calc(352 / 1100 * 100vw);
  max-width: 352px;
}
#mainContents .ott-guideMainVisualIn ul:first-of-type li:nth-of-type(2n) {
  width: calc(345 / 1100 * 100vw);
  max-width: 345px;
}
#mainContents .ott-guideMainVisualIn ul:first-of-type li:last-of-type {
  width: calc(323 / 1100 * 100vw);
  max-width: 323px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMainVisualIn ul:first-of-type li:first-of-type {
    width: 45%;
  }
  #mainContents .ott-guideMainVisualIn ul:first-of-type li:nth-of-type(2n) {
    width: 45%;
  }
  #mainContents .ott-guideMainVisualIn ul:first-of-type li:last-of-type {
    width: 45%;
  }
  #mainContents .ott-guideMainVisualIn ul:first-of-type li:nth-of-type(2) {
    margin-left: 20px;
  }
}
#mainContents .ott-guideBtnWrap {
  display: flex;
}
@media screen and (max-width:880px) {
  #mainContents .ott-guideBtnWrap {
    flex-direction: column;
  }
}
#mainContents .ott-guideBtnWrap .YouTube-btn {
  display: flex;
  margin-left: auto;
  margin-right: auto;
}
#mainContents .ott-guideBtnWrap .YouTube-btn {
  font-weight: 500;
  border-radius: 100px;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  position: relative;
  background: #00BEC8;
  color: #fff;
  border: none;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
  min-width: 400px;
  max-width: 500px;
  font-size: 17px;
  line-height: 1.4em;
  text-align: center;
  padding: 10px 40px 10px 78px;
  min-height: 70px;
  transition: .5s;
}
#mainContents .ott-guideBtnWrap .YouTube-btn:hover {
  opacity: .5;
}
@media screen and (max-width:880px) {
  .fw .c-btn--l a {
    min-width: 270px;
    min-height: 45px;
    padding: 5px 35px 5px 25px;
    font-size: 12px;
    line-height: 1.4em;
  }
  #mainContents .ott-guideBtnWrap .YouTube-btn {
    min-width: 270px;
    min-height: 45px;
    font-size: 12px;
    line-height: 1.4em;
    margin-top: 3rem;
    padding: 5px 35px 5px 25px;
  }
}
#mainContents .ott-guideBtnWrap .YouTube-btn::after {
  position: absolute;
  display: block;
  top: 28%;
  transform: translate(0, -50%);
  content: "";
  background: #fff url("/service/ott-guide/img/20250812/ott-guide_thumbnail.jpg") no-repeat center center;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
  background-size: auto;
  background-size: 100% auto;
  right: 17.5%;
  width: 142px;
  height: 82px;
}
@media screen and (max-width:880px) {
  #mainContents .ott-guideBtnWrap .YouTube-btn::after {
    background: #fff url("/service/ott-guide/img/20250812/ott-guide_thumbnail_sp.jpg") no-repeat center center;
    width: 96px;
    height: 56px;
  }
}
.modal-container {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.8);
}
.modal-body {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 5% auto;
  width: 80%;
  max-width: 900px;
}
#close-btn {
  position: absolute;
  top: -25px;
  right: 0;
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  padding: 2px 6px;
  background-color: rgba(0, 0, 0, 0.5);
  border: none;
  cursor: pointer;
}
.modal-content {
  position: relative;
  padding-bottom: 56.25%;
}
.youtube-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#mainContents .ott-guideMainVisualIn ul:nth-of-type(2) {
  margin-top: 35px;
}
#mainContents .ott-guideMainVisualIn ul:nth-of-type(2), #mainContents .ott-guideMainVisualIn .ott-guideMainVisual_note {
  font-size: 15px;
  text-align: left;
  line-height: 1.6;
}
#mainContents .ott-guideMainVisualIn ul:nth-of-type(2) li, #mainContents .ott-guideMainVisualIn .ott-guideMainVisual_note {
  padding-left: 1em;
  text-indent: -1em;
}
#mainContents .ott-guideMainVisual #ott-guideMenuBox {
  background: #FFFFFF;
  width: 100%;
}
#mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed {
  position: fixed;
  z-index: 1;
  top: 0;
  margin-top: 75px;
  padding: 5px 0;
}
#mainContents .ott-guideMainVisual .ott-guideButtonGroup {
  width: 100%;
  max-width: 1032px;
  text-align: center;
  display: flex;
  justify-content: space-between;
  padding: 36px 0 20px 0;
  margin: 0 auto;
}
#mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed .ott-guideButtonGroup {
  padding: 0;
}
@media screen and (min-width:1281px) and (max-width:1420px) {
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed .ott-guideButtonGroup {
    margin-left: 3%;
  }
}
@media screen and (max-width: 1280px) {
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed {
    margin-top: 100px;
  }
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed {
    margin-top: 101px;
  }
  #mainContents .ott-guideMainVisual .ott-guideButtonGroup {
    flex-wrap: wrap;
    justify-content: center;
    padding: 20px 16px;
  }
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed .ott-guideButtonGroup {
    flex-wrap: nowrap;
    justify-content: space-between;
    left: 0;
  }
}
#mainContents .ott-guideButtonGroup li {
  width: 18%;
  font-weight: bold;
  line-height: 48px;
  border: 1px solid #0095FF;
  background: #FFFFFF;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideButtonGroup li {
    width: 30%;
  }
  #mainContents .ott-guideButtonGroup li:nth-of-type(n+4) {
    margin-top: 8px;
  }
  #mainContents .ott-guideButtonGroup li:not(:first-of-type) {
    margin-left: 10px;
  }
  #mainContents .ott-guideButtonGroup li:nth-of-type(4n) {
    margin-left: 0;
  }
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed li {
    width: 18%;
    font-size: calc(20 / 768 * 100vw);
    line-height: 1.25;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    justify-content: center;
    padding: calc(7 / 300 * 100vw);
  }
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed li span {
    display: inline-block;
  }
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed li:nth-of-type(n+4) {
    margin-top: 0;
  }
  #mainContents .ott-guideMainVisual #ott-guideMenuBox.fixed li:not(:first-of-type) {
    margin-left: auto;
  }
}
@media screen and (max-width:480px) {
  #mainContents .ott-guideButtonGroup li {
    font-size: calc(20 / 768 * 100vw);
  }
}
#mainContents .ott-guideButtonGroup li a {
  display: block;
}
#mainContents .ott-guideContents {
  background-size: auto auto;
  background-color: rgba(39, 186, 255, 1);
  background-image: repeating-linear-gradient(-45deg, transparent, transparent 28px, rgba(0, 174, 255, 1) 28px, rgba(0, 174, 255, 1) 56px);
  padding: calc(45 / 1100 * 100vw) calc(45 / 1100 * 100vw) calc(34 / 1100 * 100vw) calc(45 / 1100 * 100vw);
}
#mainContents .ott-guideContents h2 {
  width: calc(898 / 1100 * 100vw);
  max-width: 898px;
  margin: 0 auto;
  padding: 0 0 25px 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContents h2 {
    width: calc(520 / 768 * 100vw);
    max-width: 520px;
    margin: 0 auto;
    padding: 0 0 24px 0;
  }
}
#mainContents .ott-guideContentsIn {
  width: 100%;
  max-width: 1008px;
  margin: 0 auto;
}
#mainContents .ott-guideContentsWrap {
  display: flex;
  justify-content: space-between;
}
#mainContents .ott-guideContentsBox {
  width: 100%;
  max-width: 48%;
  background: #FFFFFF;
  border-radius: calc(20 / 1100 * 100vw);
  padding: 2.5% 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContentsBox {
    padding: calc(16 / 768 * 100vw) calc(30 / 768 * 100vw) calc(20 / 768 * 100vw) calc(30 / 768 * 100vw);
  }
}
#mainContents .ott-guideContents h3 {
  width: calc(400 / 1100 * 100vw);
  max-width: 400px;
  margin: 0 auto 16px auto;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContents h3 {
    width: calc(280 / 768 * 100vw);
    max-width: 280px;
    margin: 0 auto 8px auto;
  }
}
#mainContents .ott-guideContents p {
  width: calc(400 / 1100 * 100vw);
  max-width: 400px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContents p {
    width: calc(280 / 768 * 100vw);
    max-width: 280px;
    margin: 0 auto;
  }
}
#mainContents .ott-guideContents p a:hover img {
  opacity: .5;
  transition: .5s;
}
#mainContents .ott-guideContents .ott-guideContentsNote {
  width: 100%;
  max-width: 100%;
  font-size: 15px;
  color: #FFFFFF;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContents .ott-guideContentsNote {
    font-size: calc(18 / 768 * 100vw);
  }
}
#mainContents .ott-guideContentsGroup {
  width: 100%;
  max-width: 735px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #FFFFFF;
  border-radius: calc(20 / 1100 * 100vw);
  margin: 15px auto;
  padding: calc(6 / 1100 * 100vw) calc(22 / 1100 * 100vw) calc(6 / 1100 * 100vw) calc(28 / 1100 * 100vw);
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContentsGroup {
    max-width: 514px;
    padding: calc(16 / 1100 * 100vw);
  }
}
#mainContents .ott-guideContentsGroup h3 {
  width: calc(130 / 1100 * 100vw);
  max-width: 130px;
  margin: 16px calc(28 / 1100 * 100vw) 16px 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContentsGroup h3 {
    width: calc(91 / 768 * 100vw);
    max-width: 91px;
    margin: 0 auto;
  }
}
#mainContents .ott-guideContentsGroup p {
  width: calc(508 / 1100 * 100vw);
  max-width: 508px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideContentsGroup p {
    width: calc(355 / 768 * 100vw);
    max-width: 355px;
    margin: 0 auto;
  }
}
#mainContents .ott-guideAbout {
  background: #FFF6CA;
  padding: 17px 16px 50px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideAbout {
    background: #FFF6CA;
    padding: 17px 16px 20px;
  }
}
#mainContents .ott-guideAboutIn {
  width: 100%;
  max-width: 886px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  margin: 0 auto;
}
@media screen and (max-width:819px) {
  #mainContents .ott-guideAboutIn {
    flex-direction: column;
    align-items: center;
  }
}
#mainContents .ott-guideAbout h2 {
  width: calc(984 / 1100 * 100vw);
  max-width: 984px;
  margin: 0 auto;
  padding: 0 50px 24px 50px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideAbout h2 {
    max-width: 464px;
    margin: 0 auto;
    padding: 0 0 16px 0;
  }
}
.ott-guideAboutGroup {
  width: 48%;
}
@media screen and (max-width:819px) {
  .ott-guideAboutGroup {
    width: 100%;
    max-width: 400px;
  }
  .ott-guideAboutGroup:not(:first-of-type) {
    margin-top: 16px;
  }
}
#mainContents .ott-guideAboutBox {
  width: 100%;
  max-width: 886px;
  border: 1px solid #0095FF;
  border-radius: 10px;
  margin: 40px auto 0;
  padding: 20px 28px 32px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideAboutBox {
    margin: 20px auto;
    padding: 10px 16px 24px;
  }
}
#mainContents .ott-guideAboutBox h3 {
  color: #0099FF;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideAboutBox h3 {
    font-size: 21px;
  }
}
#mainContents .ott-guideAbouTxt {
  font-size: 20px;
}
@media screen and (max-width:959px) {
  #mainContents .ott-guideAbouTxt {
    font-size: 18px;
    line-height: 1.5;
  }
}
@media screen and (max-width:768px) {
  .registerNoteSpshow {
    width: 178px;
  }
  .registerBtn {
    width: 190px;
    max-height: 45px;
  }
  .ott-guideAboutGroup:nth-of-type(3) {
    max-width: 372px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    margin: 0 auto;
  }
}
@media screen and (max-width:480px) {
  .registerNoteSpshow {
    min-width: calc(110 / 320 * 100vw);
  }
  .registerBtn {
    width: calc(150 / 320 * 100vw);
    min-width: calc(150 / 320 * 100vw) !important;
    max-height: 45px;
  }
}
#mainContents .ott-guideInfoIn, #mainContents .ott-guideMoreInfoIn {
  max-width: 1032px;
  margin: 0 auto;
  padding: 0 16px;
}
#mainContents .ott-guideInfoIn h2, #mainContents .ott-guideInfoIn h3 {
  margin: 0 auto;
}
#mainContents .ott-guideInfo {
  background-color: #CCEBFF;
  padding: 50px 0 0 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfo {
    padding: 40px 0 0 0;
  }
}
#mainContents .ott-guideInfoIn h2 {
  width: 100%;
  max-width: 632px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfoIn h2 {
    max-width: 386px;
    width: 90%;
  }
}
#mainContents .ott-guideInfoButtonGroup {
  width: 100%;
  max-width: 750px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  padding: 30px 0 28px 0;
  margin: 0 auto;
}
#mainContents .ott-guideInfoButtonGroup li {
  position: relative;
  width: 32%;
  font-size: 17px;
  font-weight: bold;
  text-align: center;
  line-height: 48px;
  border: 1px solid #0095FF;
  background-color: #FFF;
}
@media screen and (max-width:479px) {
  #mainContents .ott-guideInfoButtonGroup li {
    font-size: 13px;
  }
}
#mainContents .ott-guideInfoButtonGroup li a {
  display: block;
}
#mainContents .ott-guideInfoButtonGroup li a::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 16px;
}
#mainContents .ott-guideInfoButtonGroup li:first-of-type a::before {
  width: 34px;
  height: 26px;
  margin-top: -13px;
  background: url("/service/ott-guide/img/20220720/ott-guide_pc_icon.svg") no-repeat center center;
}
#mainContents .ott-guideInfoButtonGroup li:nth-of-type(2n) a::before {
  width: 16px;
  height: 30px;
  margin-top: -15px;
  background: url("/service/ott-guide/img/20220720/ott-guide_sp_icon.svg") no-repeat center center;
}
#mainContents .ott-guideInfoButtonGroup li:nth-of-type(3n) a::before {
  width: 33px;
  height: 26px;
  margin-top: -13px;
  background: url("/service/ott-guide/img/20220720/ott-guide_tv_icon.svg") no-repeat center center;
}
@media screen and (max-width:579px) {
  #mainContents .ott-guideInfoButtonGroup li a {
    margin-left: 16px;
  }
  #mainContents .ott-guideInfoButtonGroup li a::before {
    left: calc(16 / 579 * 100vw);
  }
  #mainContents .ott-guideInfoButtonGroup li:first-of-type a::before {
    width: calc(34 / 579 * 100vw);
    height: calc(26 / 579 * 100vw);
    margin-top: calc(-13 / 579 * 100vw);
  }
  #mainContents .ott-guideInfoButtonGroup li:nth-of-type(2n) a::before {
    width: calc(16 / 579 * 100vw);
    height: calc(30 / 579 * 100vw);
    margin-top: calc(-15 / 579 * 100vw);
  }
  #mainContents .ott-guideInfoButtonGroup li:nth-of-type(3n) a::before {
    width: calc(33 / 579 * 100vw);
    height: calc(26 / 579 * 100vw);
    margin-top: calc(-13 / 579 * 100vw);
  }
}
#mainContents .ott-guideInfoWeb {
  background: #0095FF;
  border-radius: 10px;
  padding: 40px 67px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfoWeb {
    margin-bottom: 20px;
    padding: 30px 20px 20px 20px;
  }
}
#mainContents .ott-guideInfoWeb h3 {
  max-width: 584px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfoIn h3 {
    max-width: 345px;
    width: 100%;
  }
}
#mainContents .btnGroup {
  width: 450px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  margin: 28px auto;
}
@media screen and (max-width:540px) {
  #mainContents .btnGroup {
    width: 100%;
    flex-direction: column;
    margin: calc(28 / 750 * 100vw) auto;
  }
  #mainContents .btnGroup .c-btn:nth-of-type(2) {
    margin-top: 10px;
  }
  #mainContents .btnGroup .c-btn a {
    margin: 0 auto;
  }
}
#mainContents .ott-guideInfoWeb ol {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 40px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfoWeb ol {
    flex-direction: column;
    list-style: none;
    margin-bottom: 20px;
  }
}
#mainContents .ott-guideInfoWeb ol li {
  width: 48%;
  font-size: 18px;
  color: #000000;
  margin-left: 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfoWeb ol li {
    width: 100%;
    font-size: 16px;
  }
}
#mainContents .ott-guideInfoWeb ol li dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: flex-start;
}
#mainContents .ott-guideInfoWeb ol li img {
  margin-bottom: 15px;
}
#mainContents .ott-guideInfoWeb ol li dt {
  display: inline-block;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  background: #000000;
  color: #FFFFFF;
  min-width: 25px;
  line-height: 25px;
  margin-right: 10px;
}
#mainContents .ott-guideInfoWeb ol li dd {
  font-size: 18px;
  color: #FFFFFF;
}
@media screen and (max-width:1020px) {
  #mainContents .ott-guideInfoWeb ol li dd {
    font-size: calc(16 / 1020 * 100vw);
  }
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfoWeb ol li dd {
    font-size: calc(24 / 768 * 100vw);
  }
}
#mainContents .ott-guideInfoWeb ol li:nth-of-type(n+3) {
  margin-top: 30px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideInfoWeb ol li + li {
    margin-top: 20px;
  }
}
#mainContents .ott-guideApp {
  background: #0095FF;
  border-radius: 10px;
  margin: 40px auto;
  padding: 40px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideApp {
    padding: 30px 20px 20px 20px;
  }
}
#mainContents .ott-guideApp h2 {
  max-width: 440px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideApp h2 {
    max-width: 345px;
    width: 90%;
  }
}
#mainContents .ott-guideApp .ott-guideAppGroupWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  margin-top: 26px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideApp .ott-guideAppGroupWrap {
    flex-direction: column;
    margin-top: 20px;
  }
}
#mainContents .ott-guideApp .ott-guideAppGroup {
  width: 48%;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideApp .ott-guideAppGroup {
    width: 100%;
  }
  #mainContents .ott-guideApp .ott-guideAppGroup:nth-of-type(2) {
    margin-top: 30px;
  }
}
#mainContents .ott-guideApp .ott-guideAppGroup ul {
  margin-left: 0;
}
#mainContents .ott-guideTv {
  background: #0095FF;
  border-radius: 10px;
  padding: 40px 0;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTv {
    padding: 30px 20px 20px 20px;
  }
}
#mainContents .ott-guideTvWrap {
  max-width: 826px;
  margin: 0 auto;
  padding: 0 16px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvWrap {
    padding: 0;
  }
}
#mainContents .ott-guideTv h2 {
  max-width: 500px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTv h2 {
    max-width: 400px;
    width: 100%;
  }
}
#mainContents .ott-guideTvIn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  font-size: 18px;
  margin-top: 20px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvIn {
    flex-direction: column;
  }
}
#mainContents .ott-guideTvIn-Note {
  margin-top: 5px;
}
#mainContents .ott-guideTvTableWrap {
  font-size: 18px;
  margin-top: 20px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvTableWrap {
    font-size: 16px;
  }
}
#mainContents .ott-guideTvBox {
  color: #FFF;
  width: 78%;
  max-width: 552px;
}
#mainContents .ott-guideTvBoxFull {
  width: 100%;
  max-width: none;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvBox {
    width: 100%;
    max-width: 100%;
  }
}
#mainContents .ott-guideTvBox h3 {
  font-size: 18px;
  font-weight: bold;
  background-color: #000;
  margin-bottom: 20px;
  padding: 12px 20px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvBox h3 {
    line-height: 1.4;
    max-width: 100%;
    margin-bottom: 10px;
  }
}
#mainContents .ott-guideTvText {
  font-size: 22px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvText {
    font-size: calc(22 / 768 * 100vw);
  }
  #mainContents .ott-guideTvNote {
    font-size: 14px;
    padding-left: 1em;
    text-indent: -1em;
  }
}
@media screen and (max-width:480px) {
  #mainContents .ott-guideTvText {
    font-size: 15px;
  }
}
#mainContents .ott-guideTvPcImage {
  width: 25%;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvPcImage {
    display: none;
  }
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvBoxIn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
  }
}
#mainContents .ott-guideTvSpImage {
  width: 18%;
}
@media screen and (max-width:480px) {
  #mainContents .ott-guideTvSpImage {
    width: 80%;
    margin-left: 8px;
  }
}
@media screen and (min-width:769px) {
  #mainContents .ott-guideTvSpImage {
    display: none;
  }
}
@media screen and (max-width:480px) {
  #mainContents .ott-guideTvSpbr {
    display: none;
  }
}
#mainContents .ott-guideTvBox a {
  color: #FFF;
  border-bottom: #FFF solid 1px;
}
#mainContents .ott-guideTvTableWrap ol {
  counter-reset: number 0;
  list-style: none;
}
#mainContents .ott-guideTvTableWrap ol li {
  position: relative;
  font-weight: bold;
  background: #FFFFFF;
  margin-left: 0;
  margin-bottom: 0;
  padding: 8px 14px 10px 46px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideTvTableWrap ol li {
    padding: 10px 10px 12px 45px;
  }
}
#mainContents .ott-guideTvTableWrap ol li:before {
  position: absolute;
  left: 16px;
  top: 50%;
  content: counter(number) " ";
  font-size: 26px;
  margin: -20px 10px 0 0;
}
#mainContents .ott-guideTvTableWrap ol li:nth-of-type(2n) {
  background: #CCEBFF;
}
#mainContents .ott-guideMoreInfo {
  background-color: #CCEBFF;
  padding: 40px 0;
}
#mainContents .ott-guideHelpcenterNote {
  width: calc(240 / 1100 * 100vw);
  max-width: 240px;
  margin: 0 auto 26px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideHelpcenterNote {
    width: 180px;
    margin: 0 auto 12px;
  }
}
#mainContents .ott-guideYouTube {
  width: 600px;
  margin: 80px auto;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideYouTube {
    width: 100%;
    margin: 40px auto;
    padding: 0 16px;
  }
}
#mainContents .ott-guideYouTubeWrap {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%;
  padding-top: 66%;
  padding-top: 56%;
}
#mainContents .ott-guideYouTubeIn iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#mainContents .ott-guideYouTubeTitle {
  width: calc(212 / 1100 * 100vw);
  max-width: 212px;
  margin: 0 auto 26px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideYouTubeTitle {
    width: 160px;
    margin: 0 auto 12px;
  }
}
#mainContents .ott-guideMoreInfoIn {
  margin-top: 60px;
  font-size: 105%;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMoreInfoIn {
    margin-top: 40px;
  }
}
#mainContents .ott-guideMoreInfoIn h3 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 20px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMoreInfoIn h3 {
    font-size: 16px;
    margin-bottom: 5px;
  }
}
#mainContents .ott-guideMoreInfoIn h4 {
  margin-bottom: 10px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMoreInfoIn h4 {
    margin-bottom: 5px;
  }
}
#mainContents .ott-guideMoreInfoIn ul {
  margin-bottom: 20px;
}
@media screen and (max-width:768px) {
  #mainContents .ott-guideMoreInfoIn ul {
    margin-bottom: 10px;
  }
}
#mainContents .ott-guideMoreInfoIn ul li, #mainContents .ott-guideMoreInfoIn p {
  padding-left: 2em;
  text-indent: -1em;
}