.page .page_title {
  top: 0;
  width: 9.3rem;
  height: 100svh;
  z-index: 1;
}
.page .page_title h2 {
  display: grid;
  padding: 0 4rem;
  width: 1.3rem;
}
.page .page_title h2 span {
  width: 1.3rem;
  font-size: 1.3rem;
  line-height: 1;
}
.page .page_title h2 .ja {
  position: relative;
  display: block;
  margin-top: 6rem;
}
.page .page_title h2 .ja:before {
  content: "";
  position: absolute;
  top: -4rem;
  left: 0.1rem;
  right: 0;
  display: block;
  margin: auto;
  width: 1px;
  height: 2rem;
  background-color: #BFBFBF;
}
.page .page_title h2 .ja span {
  display: block;
  min-height: 0.4rem;
  text-align: center;
  letter-spacing: 0.1rem;
}
.page .page_title h2 .ja .hash_tag {
  margin-top: 1.6svh;
  padding-left: 0.1rem;
  padding-bottom: 0.2rem;
}
@media only screen and (max-width: 860px) {
  .page .page_title {
    display: none;
  }
}
.page .page_contents {
  width: calc(100% - 9.3rem);
}
@media only screen and (max-width: 860px) {
  .page .page_contents {
    width: 100%;
  }
}
.page .page_mv {
  margin: auto;
  padding-bottom: 20rem;
  width: calc(100% - 8rem);
}
.page .page_mv .kv {
  top: 30svh;
  margin-left: 3.5%;
  width: fit-content;
}
.page .page_mv .kv .visual {
  margin-right: 3rem;
  width: 20rem;
}
.page .page_mv .kv .visual .ratio {
  padding-top: 160%;
}
.page .page_mv .kv .text {
  position: relative;
  width: fit-content;
  height: 32rem;
}
.page .page_mv .kv .text .copy {
  position: absolute;
  top: 1rem;
  left: 0;
  display: block;
  font-size: 1.3rem;
  line-height: 1.8;
  white-space: nowrap;
}
.page .page_mv .kv .text h1 {
  padding-bottom: 1rem;
  font-size: 3.5rem;
  line-height: 1.2;
}
.page .page_mv .mv {
  width: 52%;
}
.page .page_mv .mv .ratio {
  padding-top: 120rem;
}
.page .page_mv .mv .text {
  margin-top: 30rem;
  width: 70%;
}
.page .page_mv .mv .text h3 {
  font-size: 1.8rem;
  line-height: 1.6;
}
.page .page_mv .mv .text .introduction {
  margin-top: 6rem;
  font-size: 1.3rem;
}
@media only screen and (max-width: 860px) {
  .page .page_mv {
    padding: 24rem 0 12rem;
    width: 100%;
  }
  .page .page_mv .kv {
    position: relative;
    top: initial;
    display: block;
    margin: 0 auto;
    width: 20rem;
  }
  .page .page_mv .kv .visual {
    margin-right: 0;
    width: 100%;
  }
  .page .page_mv .kv .text {
    margin-top: 4.8rem;
    width: 100%;
    height: auto;
  }
  .page .page_mv .kv .text .copy {
    position: relative;
    top: initial;
    left: initial;
    font-size: 1.3rem;
  }
  .page .page_mv .kv .text h1 {
    margin-top: 3.5rem;
    padding-bottom: 0;
    font-size: 3rem;
  }
  .page .page_mv .mv {
    margin-top: 12rem;
    width: 100%;
  }
  .page .page_mv .mv .ratio {
    padding-top: 160%;
  }
  .page .page_mv .mv .text {
    margin-top: 6rem;
    padding: 0 2rem;
    width: auto;
  }
  .page .page_mv .mv .text h3 {
    padding-left: 1rem;
    font-size: 1.6rem;
  }
  .page .page_mv .mv .text .introduction {
    margin-top: 6rem;
    padding-left: 4.8rem;
    font-size: 1.3rem;
  }
}
.page .page_gallery {
  margin-left: -9.3rem;
  width: calc(100% + 9.3rem);
}
.page .page_gallery .endless .endless_item .image {
  margin-right: 4.8rem;
  width: 55vw;
}
.page .page_gallery .endless .endless_item .image .ratio {
  padding-top: 70%;
}
.page .page_gallery .endless .endless_item .image {
  width: fit-content;
  height: 60rem;
}
.page .page_gallery .endless .endless_item .image .ratio {
  padding-top: 0;
  height: 100%;
}
.page .page_gallery .endless .endless_item .image .ratio img {
  position: relative;
  width: auto;
  height: 100%;
  object-fit: contain;
}
@media only screen and (max-width: 860px) {
  .page .page_gallery {
    margin-left: 0;
    width: 100%;
  }
  .page .page_gallery .endless .endless_item .image {
    margin-right: 2.4rem;
    height: 20rem;
  }
}
.page .service {
  position: relative;
  padding-top: 30rem;
  padding-right: 9.3rem;
}
.page .service:before {
  content: "";
  position: absolute;
  top: -20rem;
  left: -9.3rem;
  right: 0;
  bottom: 0;
  display: block;
  width: calc(100% + 1.3rem + 8rem);
  height: calc(100% + 20rem);
  background-color: #F8F8F8;
  z-index: -1;
}
@media only screen and (max-width: 860px) {
  .page .service {
    padding-top: 12rem;
    padding-right: 0;
  }
  .page .service:before {
    top: -8rem;
    left: 0;
    width: 100%;
    height: calc(100% + 24rem);
  }
}
.page .link {
  position: relative;
  padding-right: 9.3rem;
  padding-bottom: 12rem;
}
.page .link:after {
  content: "";
  position: absolute;
  top: -24rem;
  left: -9.3rem;
  right: 0;
  bottom: 0;
  display: block;
  width: calc(100% + 1.3rem + 8rem);
  height: calc(100% + 24rem);
  background-color: #F8F8F8;
  z-index: -1;
}
.page .link ul {
  margin-left: auto;
  width: 70%;
  border-top: 1px solid #cccccc;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .page .link ul {
    border-width: 0.5px;
  }
}
.page .link ul li {
  margin-top: 8rem;
  text-align: right;
}
.page .link ul li a, .page .link ul li button {
  padding-right: 3.5rem;
  font-size: 3.5rem;
}
.page .link ul li a i, .page .link ul li button i {
  width: 1rem;
}
.page .link ul li a i:before, .page .link ul li a i:after, .page .link ul li button i:before, .page .link ul li button i:after {
  width: 1rem;
  height: 1rem;
  background-image: url("../images/icon/arrow_l_b.svg");
}
@media only screen and (max-width: 860px) {
  .page .link {
    padding: 0 2rem 12rem;
  }
  .page .link:after {
    content: "";
    position: absolute;
    top: -12rem;
    left: 0;
    display: block;
    width: 100%;
    height: calc(100% + 12rem);
  }
  .page .link ul {
    margin-left: auto;
    width: 100%;
  }
  .page .link ul li {
    margin-top: 3.5rem;
  }
  .page .link ul li a, .page .link ul li button {
    padding-right: 2.4rem;
    font-size: 2.4rem;
    font-size: 2rem;
    white-space: nowrap;
  }
  .page .link ul li a i, .page .link ul li button i {
    width: 0.8rem;
  }
  .page .link ul li a i:before, .page .link ul li a i:after, .page .link ul li button i:before, .page .link ul li button i:after {
    width: 0.8rem;
    height: 0.8rem;
  }
}

.black {
  background-color: #222222;
}
.black .page .service {
  background-color: #1b1b1b;
}
.black .page .service:before {
  background-color: #1b1b1b;
}
.black .page .service h1, .black .page .service h2, .black .page .service h3, .black .page .service h4, .black .page .service h5, .black .page .service h6, .black .page .service a, .black .page .service span, .black .page .service p, .black .page .service button, .black .page .service label {
  color: #f8f8f8;
}
.black .page .service .gray {
  color: #5d5d5d;
}
.black .page .service .gray * {
  color: #5d5d5d;
}
.black .page .link:after {
  background-color: #1b1b1b;
}
.black .page .link h1, .black .page .link h2, .black .page .link h3, .black .page .link h4, .black .page .link h5, .black .page .link h6, .black .page .link a, .black .page .link span, .black .page .link p, .black .page .link button, .black .page .link label {
  color: #f8f8f8;
}
.black .page .link .gray {
  color: #5d5d5d;
}
.black .page .link .gray * {
  color: #5d5d5d;
}
.black .page .link ul li a i:before, .black .page .link ul li a i:after, .black .page .link ul li button i:before, .black .page .link ul li button i:after {
  background-image: url("../images/icon/arrow_l.svg");
}