@charset "UTF-8";

.ygchd {
  background: #000
}

.ygchd__ttl {
  font-size: 28px;
  line-height: 64px;
  color: #fff
}

.ygchd__nav__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: start;
  border-top: 1px solid rgba(255, 255, 255, 0.1)
}

.ygchd__nav__page {
  display: inline-block;
  margin-top: -1px;
  padding: 15px 15px 14px;
  font-size: 14px;
  line-height: 1
}

.ygchd__nav__page:first-child {
  padding: 15px 15px 14px 0
}

.ygchd__nav__page.active {
  border-top: 1px solid #fff
}

.ygchd__nav__page .navbtn {
  color: #fff
}

.contents {
  max-width: 1110px;
  margin: 0 auto;
  padding: 0 0 90px;
  text-align: center
}

.contents__ttl {
  padding: 140px 0 126px;
  font-size: 37px;
  line-height: 1.513
}

.contents__ttl .icon {
  display: inline-block;
  padding: 0 0 0 30px;
  background: url(/global/about/ygc/assets/images/check.svg) no-repeat left center;
  background-size: 20px auto;
  font-size: 14px;
  line-height: 20px
}

.contents__ttl small {
  display: inline-block;
  margin-top: 1em;
  font-size: 16px;
  font-weight: normal;
  line-height: 1.8
}

.contents__subttl {
  padding: 90px 0 35px;
  font-size: 28px;
  line-height: 1;
  text-align: left;
  overflow: hidden
}

.contents__subttl .morebtn {
  display: inline-block;
  position: relative;
  padding-right: 1.5em;
  font-size: 13.71px;
  font-weight: normal;
  float: right
}

.contents__subttl .morebtn:after {
  content: "";
  position: absolute;
  display: block;
  right: 0.5em;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(45deg);
  transform: translateY(-50%) rotate(45deg);
  width: 8px;
  height: 8px;
  border-top: 1px solid #DC1E37;
  border-right: 1px solid #DC1E37
}

.contents__txt {
  padding: 0 0 130px;
  font-size: 16px;
  line-height: 1.8
}

.inner {
  max-width: 1110px;
  margin: 0 auto
}

.pc {
  display: inline-block
}

.sp {
  display: none
}

.clear {
  clear: both
}

.palt {
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt"
}

.fit {
  width: 100%;
  height: auto
}

@media screen and (max-width:767px) {
  .ygchd {
    position: relative;
    overflow: hidden
  }

  .ygchd:before {
    content: "";
    position: absolute;
    display: block;
    right: 3.3333333333vw;
    bottom: 0;
    width: 20vw;
    height: calc(100% - 14.358974359vw);
    background: -webkit-gradient(linear, left top, right top, from(transparent), to(#000));
    background: linear-gradient(to right, transparent, #000)
  }

  .ygchd__ttl {
    width: 130%;
    font-size: 5.7435897436vw;
    line-height: 13.8461538462vw
  }

  .ygchd__nav {
    overflow-x: scroll
  }

  .ygchd__nav__list {
    width: 150%;
    border-top-width: 0.2564102564vw
  }

  .ygchd__nav__page {
    display: inline-block;
    margin-top: -0.2564102564vw;
    padding: 0.9em 0.7em 0.75em;
    font-size: 3.0769230769vw
  }

  .ygchd__nav__page:first-child {
    padding: 0.9em 0.7em 0.75em 0
  }

  .ygchd__nav__page.active {
    border-top-width: 0.2564102564vw
  }

  .contents {
    width: auto;
    padding: 0 3.8461538462vw 20vw
  }

  .contents__ttl {
    padding: 30.7692307692vw 8.4615384615vw 12.3076923077vw;
    font-size: 6.1538461538vw;
    line-height: 1.5;
    text-align: left
  }

  .contents__ttl .icon {
    display: inline-block;
    padding: 0 0 0 7.6923076923vw;
    background-size: 5.1282051282vw auto;
    font-size: 2.7358974359vw;
    line-height: 5.1282051282vw
  }

  .contents__ttl small {
    font-size: 2.7358974359vw
  }

  .contents__subttl {
    padding: 19.4871794872vw 0 1.1em;
    font-size: 6.1538461538vw
  }

  .contents__subttl .morebtn {
    font-size: 3.5153846154vw
  }

  .contents__subttl .morebtn:after {
    width: 2.0512820513vw;
    height: 2.0512820513vw;
    border-top-width: 0.2564102564vw;
    border-right-width: 0.2564102564vw
  }

  .contents__txt {
    padding: 0 8.4615384615vw 38.4615384615vw;
    font-size: 2.7358974359vw
  }

  .inner {
    width: auto;
    padding: 0 3.8461538462vw
  }

  .pc {
    display: none
  }

  .sp {
    display: inline-block
  }
}
