@charset "UTF-8";
/* ==========================================================
  フォント
========================================================== */
/* ==========================================================
  EXTEND
========================================================== */
/* ===================================================================
CSS information
 file name  :guideline.css
 style info :ミラー配信に関するガイドラインのスタイル
=================================================================== */
#visual {
  background: #fff;
}
@media screen and (min-width: 768px) {
  #visual {
    padding: 1.25rem 0 1.875rem;
  }
}
@media screen and (max-width: 767px) {
  #visual {
    padding: 4vw 0;
  }
}
#visual h1 {
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  #visual h1 {
    width: 12.5rem;
  }
}
@media screen and (max-width: 767px) {
  #visual h1 {
    width: 24%;
  }
}

#content {
  padding: 3.75rem 0 5.375rem;
}
@media screen and (max-width: 767px) {
  #content {
    padding: 10vw 0;
  }
}
#content:before {
  content: "";
  display: block;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  z-index: -1;
  background-color: #17294b;
  background-repeat: no-repeat;
  background-position: center top;
}
@media screen and (min-width: 768px) {
  #content:before {
    background-image: url(../img/shared/bg_v_pc.jpg);
  }
}
@media screen and (min-width: 1921px) {
  #content:before {
    background-size: 140rem;
  }
}
@media screen and (max-width: 767px) {
  #content:before {
    background-image: url(../img/shared/bg_v_sp.jpg);
    background-size: cover;
  }
}
#content h2.sub {
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  #content h2.sub {
    margin-bottom: 12vw;
  }
}
#content h2 span {
  display: block;
}
#content h2 span.sub {
  color: #fff;
  font-size: 1.25rem;
}
@media screen and (max-width: 767px) {
  #content h2 span.sub {
    font-size: 3.3vw;
  }
}
#content h2 span.yTxt {
  background: -webkit-gradient(linear, left bottom, left top, from(#ffcc00), to(#fff6b6));
  background: linear-gradient(to top, #ffcc00, #fff6b6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 1.875rem;
}
@media screen and (max-width: 767px) {
  #content h2 span.yTxt {
    font-size: 1.5rem;
  }
}
#content .innerBox {
  text-align: left;
  margin: 0 auto 7.5rem;
}
@media screen and (min-width: 768px) {
  #content .innerBox {
    width: min(96%, 51.25rem);
  }
}
@media screen and (max-width: 767px) {
  #content .innerBox {
    width: 90%;
    margin: 0 auto 12vw;
  }
}
#content .innerBox .readBox {
  margin-bottom: 3.75rem;
}
#content .innerBox .readBox p {
  line-height: 1.8;
}
@media screen and (min-width: 768px) {
  #content .innerBox .readBox p {
    margin-bottom: 1rem;
  }
}
@media screen and (max-width: 767px) {
  #content .innerBox .readBox p {
    margin-bottom: 1.5rem;
  }
}
#content .innerBox .readBox p em {
  font-weight: bold;
  color: #ffe000;
}
#content .innerBox .readBox .movieList {
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  #content .innerBox .readBox .movieList {
    margin-bottom: 1.5rem;
  }
}
#content .innerBox .readBox .movieList li {
  line-height: 1.7;
}
#content .innerBox .readBox .movieList li a {
  color: #bcc1e6;
}
#content .innerBox .readBox .anoTxt {
  -webkit-padding-start: 1em;
          padding-inline-start: 1em;
  text-indent: -1em;
}
#content .innerBox .termsBox {
  margin-bottom: 3.75rem;
}
#content .innerBox .termsBox h4 {
  font-size: 1.875rem;
  font-weight: bold;
  text-align: center;
  color: #091f30;
  background: #dbeeff;
  border: solid 0.0625rem #fff;
  -webkit-box-shadow: 0 0 0.3125rem #00d2ff;
          box-shadow: 0 0 0.3125rem #00d2ff;
  margin-bottom: 1.5rem;
}
@media screen and (min-width: 768px) {
  #content .innerBox .termsBox h4 {
    padding-bottom: 0.25rem;
  }
}
@media screen and (max-width: 767px) {
  #content .innerBox .termsBox h4 {
    font-size: 5vw;
  }
}
#content .innerBox .termsBox > ol {
  line-height: 1.8;
}
#content .innerBox .termsBox > ol > li {
  padding-left: 1em;
  margin-bottom: 0.625rem;
}
:lang(ja) #content .innerBox .termsBox > ol > li {
  text-indent: -1em;
}
:lang(en) #content .innerBox .termsBox > ol > li {
  text-indent: -0.8em;
}
#content .innerBox .termsBox > ol > li em {
  font-weight: bold;
  color: #ffe000;
}
#content .innerBox .termsBox > ol > li figure {
  text-indent: 0;
  margin: 1.25rem 0;
}
#content .innerBox .termsBox > ol > li ul {
  padding-left: 1.375rem;
  margin: 1.25rem 0;
}
#content .innerBox .termsBox > ol > li ul li {
  list-style-type: disc;
  text-indent: -0.4em;
}
@media screen and (max-width: 767px) {
  #content .innerBox .termsBox > ol > li ul li {
    padding-left: 0;
    text-indent: 0;
  }
}
#content .innerBox .termsBox > ol > li ol {
  padding-left: 0.75rem;
  margin: 1.25rem 0;
}
#content .innerBox .termsBox > ol > li ol li {
  counter-increment: cnt;
  padding-left: 1em;
  margin-bottom: 0;
}
@media screen and (min-width: 768px) {
  :lang(ja) #content .innerBox .termsBox > ol > li ol li {
    text-indent: -1.7em;
  }
}
@media screen and (max-width: 767px) {
  :lang(ja) #content .innerBox .termsBox > ol > li ol li {
    text-indent: -1.5em;
  }
}
@media screen and (min-width: 768px) {
  :lang(en) #content .innerBox .termsBox > ol > li ol li {
    text-indent: -1.5em;
  }
}
@media screen and (max-width: 767px) {
  :lang(en) #content .innerBox .termsBox > ol > li ol li {
    text-indent: -1.5em;
  }
}
#content .innerBox .termsBox > ol > li ol li:before {
  content: "(" counter(cnt) ") ";
}
#content .innerBox .termsBox > ol .txtYbox p {
  color: #000;
  background: #fff3c9;
  padding: 1.5em;
  margin: 1.5em 0 2em 1em;
}
#content .innerBox .termsBox p {
  line-height: 1.8;
}
#content .innerBox .termsBox p a {
  color: #00a8ff;
  text-decoration: underline;
}
#content .btnTop a {
  display: inline-block;
  color: #bcc1e6;
  border: solid 0.125rem #bcc1e6;
  background-image: url(../img/shared/bg_arrow_gray.png);
  background-repeat: no-repeat;
  vertical-align: bottom;
  border-radius: 100px;
  background-size: 0.6rem;
  background-position: center left 3.75rem;
  margin-bottom: 3.125rem;
}
@media screen and (min-width: 768px) {
  #content .btnTop a {
    font-size: 1.125rem;
    padding: 1rem 5rem;
  }
}
@media screen and (max-width: 767px) {
  #content .btnTop a {
    background-position: center left 6vw;
    padding: 3vw 10vw 3vw;
  }
}

@media screen and (min-width: 768px) {
  .isIPad #content:before {
    background: #192a4d url(../img/top/bg_about_pc.jpg) no-repeat center top/cover;
  }
}