@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

main, article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

*::before, *::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

body {
  line-height: 1;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}

ol, ul {
  list-style: none;
  list-style-type: none;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

svg {
  width: 100%;
  height: auto;
  display: block;
}

:root {
  --maincolor: #c80e84;
  --subcolor: #0877bf;
  --textcolor: #000;
  --container: 1200px;
}

body {
  font-size: 16px;
  font-weight: normal;
  font-family: futura-pt,"Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: var(--textcolor);
  background: #fff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

a {
  color: var(--textcolor);
  text-decoration: none;
}

/* Flex box */
.c-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.c-flex-jcc {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.c-flex-jce {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.c-flex-aic {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.c-flex-aie {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

.c-flex-wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

/* button */
.c-btn a {
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.08em;
  line-height: 1.4;
  padding: 0.8em 1em;
  margin: 0 auto;
  background: #707070;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 245px;
  max-width: 100%;
}

@media screen and (max-width: 767px) {
  .c-btn a {
    width: 267px;
    padding: 0.9em 1em;
  }
}

.u-tal {
  text-align: left !important;
}

.u-tac {
  text-align: center !important;
}

.u-tar {
  text-align: right !important;
}

.alignleft {
  margin-left: 0;
  margin-right: auto;
}

.aligncenter {
  margin-left: auto;
  margin-right: auto;
}

.alignright {
  margin-left: auto;
  margin-right: 0;
}

.img-link.left {
  text-align: left;
}

.img-link.center {
  text-align: center;
}

.img-link.right {
  text-align: right;
}

.img-link img {
  display: inline;
}

.u-marker {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(50%, transparent), color-stop(50%, #F4DF42));
  background: linear-gradient(transparent 50%, #F4DF42 50%);
  padding-bottom: 0.3em;
}

.u-bold {
  font-weight: bold;
}

.u-maincolor {
  color: var(--maincolor);
}

.u-subcolor {
  color: var(--subcolor);
}

main {
  position: relative;
  overflow: hidden;
  z-index: 200;
  background: #fff;
}

h2.ttl {
  font-weight: bold;
  font-size: 50px;
  letter-spacing: 0.03em;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  h2.ttl {
    font-size: 25px;
  }
}

.p-top img {
  width: 100%;
}

.p-gallery {
  height: 100vh;
  padding: 5vh;
  background: #fff;
  -webkit-transform: rotate(-5deg);
          transform: rotate(-5deg);
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

.p-gallery_grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(12, 7.33vh);
  position: relative;
}

.p-gallery_grid .bgmovie video {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 1;
}

.p-gallery_item {
  padding: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: 1s;
  transition: 1s;
  border: 5px solid #fff;
  -webkit-box-shadow: 0 0 1px 2px #fff;
          box-shadow: 0 0 1px 2px #fff;
  position: relative;
  z-index: 2;
}

.p-gallery_item.txt {
  background: #fff;
}

.p-gallery_item.img {
  position: relative;
}

.p-gallery_item.img video,
.p-gallery_item.img img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-gallery_item--01 {
  grid-column: 1 / 5;
  grid-row: 1 / 4;
  -webkit-transition-delay: .5s;
          transition-delay: .5s;
}

.p-gallery_item--02 {
  grid-column: 1 / 10;
  grid-row: 4 / 7;
  -webkit-transition-delay: .7s;
          transition-delay: .7s;
}

.p-gallery_item--03 {
  grid-column: 5 / 13;
  grid-row: 1 / 4;
  -webkit-transition-delay: .9s;
          transition-delay: .9s;
}

.p-gallery_item--04 {
  grid-column: 1 / 3;
  grid-row: 7 / 13;
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}

.p-gallery_item--05 {
  grid-column: 10 / 13;
  grid-row: 4 / 13;
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}

.p-gallery_item--06 {
  grid-column: 3 / 10;
  grid-row: 7 / 13;
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}

.p-gallery_item--07 {
  grid-column: 1 / 8;
  grid-row: 1 / 4;
  -webkit-transition-delay: .5s;
          transition-delay: .5s;
}

.p-gallery_item--08 {
  grid-column: 8 / 13;
  grid-row: 1 / 10;
  -webkit-transition-delay: .7s;
          transition-delay: .7s;
}

.p-gallery_item--09 {
  grid-column: 1 / 4;
  grid-row: 4 / 13;
  -webkit-transition-delay: .9s;
          transition-delay: .9s;
}

.p-gallery_item--10 {
  grid-column: 4 / 8;
  grid-row: 4 / 10;
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}

.p-gallery_item--11 {
  grid-column: 4 / 8;
  grid-row: 10 / 13;
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}

.p-gallery_item--12 {
  grid-column: 8 / 13;
  grid-row: 10 / 13;
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}

@media screen and (max-width: 767px) {
  .p-gallery {
    padding: 0;
  }
  .p-gallery_item--01 {
    grid-column: 1 / 6;
    grid-row: 1 / 4;
  }
  .p-gallery_item--02 {
    grid-column: 1 / 13;
    grid-row: 4 / 7;
  }
  .p-gallery_item--03 {
    grid-column: 6 / 13;
    grid-row: 1 / 4;
  }
  .p-gallery_item--04 {
    grid-column: 1 / 10;
    grid-row: 7 / 10;
  }
  .p-gallery_item--05 {
    grid-column: 10 / 13;
    grid-row: 7 / 13;
  }
  .p-gallery_item--06 {
    grid-column: 1 / 10;
    grid-row: 10 / 13;
  }
}

.swiper {
  position: relative;
}

.swiper .swiper-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: unset;
      -ms-flex-pack: unset;
          justify-content: unset;
  margin-left: 1%;
}

.swiper .swiper-wrapper .swiper-slide {
  min-width: 150%;
  position: relative;
}

.swiper .swiper-wrapper .swiper-slide:not(:last-child) {
  margin-right: 4%;
}

.swiper .swiper-button {
  position: absolute;
  right: 0;
  bottom: calc(100% + 54px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 30%;
}

.swiper .swiper-button-next,
.swiper .swiper-button-prev {
  width: 110px;
  height: 110px;
  border-radius: 50%;
  cursor: pointer;
}

.swiper .swiper-button-next.swiper-button-disabled,
.swiper .swiper-button-prev.swiper-button-disabled {
  opacity: .5;
}

.swiper .swiper-button-next {
  background: url(../img/sec05_next.png) no-repeat center/contain;
}

.swiper .swiper-button-prev {
  background: url(../img/sec05_prev.png) no-repeat center/contain;
  margin-right: 30px;
}

@media screen and (max-width: 767px) {
  .swiper .swiper-wrapper .swiper-slide {
    min-width: 250%;
  }
}

.p-business {
  height: 100vh;
  background: #000 url(../img/business_ptn.jpg) repeat center left 0/auto 100%;
  color: #fff;
  -webkit-box-shadow: 0 0 20vh #000 inset;
          box-shadow: 0 0 20vh #000 inset;
  padding: 5%;
  position: relative;
}

.p-business h2.ttl {
  position: relative;
  z-index: 2;
}

.p-business .js-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-business .js-item {
  -webkit-perspective: 4000px;
          perspective: 4000px;
}

.p-business_flex {
  position: relative;
  z-index: 2;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transform: rotateX(10deg) rotateZ(10deg);
          transform: rotateX(10deg) rotateZ(10deg);
}

.p-business_item {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 500px;
  height: 500px;
  padding: 20px;
  background: #000;
  border: 1px solid #fff;
  -webkit-box-shadow: 0 0 1px 1px #fff;
          box-shadow: 0 0 1px 1px #fff;
}

.p-business_item--01 {
  -webkit-transform: translateZ(250px);
          transform: translateZ(250px);
  background: #000 url(../img/business_txt.png) no-repeat bottom left;
}

.p-business_item--02 {
  -webkit-transform: rotateY(90deg) translateZ(250px);
          transform: rotateY(90deg) translateZ(250px);
  background: #000 url(../img/business_txt.png) no-repeat bottom left -500px;
}

.p-business_item--03 {
  -webkit-transform: rotateY(180deg) translateZ(250px);
          transform: rotateY(180deg) translateZ(250px);
  background: #000 url(../img/business_txt.png) no-repeat bottom left -1000px;
}

.p-business_item--04 {
  -webkit-transform: rotateY(-90deg) translateZ(250px);
          transform: rotateY(-90deg) translateZ(250px);
  background: #000 url(../img/business_txt.png) no-repeat bottom left -1500px;
}

.p-business_item--05 {
  -webkit-transform: rotateX(-90deg) translateZ(250px);
          transform: rotateX(-90deg) translateZ(250px);
}

.p-business h3 {
  font-size: 30px;
  font-weight: bold;
  margin: 1em 0;
  padding: 1em;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  position: relative;
}

.p-business h3 .num {
  position: absolute;
  left: 0;
  bottom: 100%;
  margin: auto;
  font-size: 70%;
  white-space: nowrap;
}

.p-business p {
  font-size: 18px;
}

.p-business .debri1,
.p-business .debri2 {
  z-index: 1;
}

.p-business .satellite {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 500px;
  max-height: 35vh;
  width: 424px;
  background: url(../img/business_satellite.png) no-repeat center/contain;
  -webkit-transform: rotate(-30deg);
          transform: rotate(-30deg);
}

.p-business .cat {
  position: absolute;
  left: -30%;
  bottom: 20%;
  width: 500px;
  height: 500px;
  max-height: 30vh;
  background: url(../img/business_cat.png) no-repeat center/contain;
}

@media screen and (max-width: 767px) {
  .p-business_item {
    width: 340px;
    height: 340px;
  }
  .p-business_item--01 {
    -webkit-transform: translateZ(170px);
            transform: translateZ(170px);
  }
  .p-business_item--02 {
    -webkit-transform: rotateY(90deg) translateZ(170px);
            transform: rotateY(90deg) translateZ(170px);
    background-position: bottom left -340px;
  }
  .p-business_item--03 {
    -webkit-transform: rotateY(180deg) translateZ(170px);
            transform: rotateY(180deg) translateZ(170px);
    background-position: bottom left -680px;
  }
  .p-business_item--04 {
    -webkit-transform: rotateY(-90deg) translateZ(170px);
            transform: rotateY(-90deg) translateZ(170px);
    background-position: bottom left -1020px;
  }
  .p-business_item--05 {
    -webkit-transform: rotateX(-90deg) translateZ(170px);
            transform: rotateX(-90deg) translateZ(170px);
  }
  .p-business h3 {
    font-size: 20px;
  }
  .p-business p {
    font-size: 15px;
  }
  .p-business .cat {
    bottom: 0%;
  }
}

.p-about {
  height: 100vh;
  padding: 5% 0;
  background: #fff;
}

.p-about h2.ttl {
  margin-bottom: 0.5em;
}

.p-about table {
  width: 100%;
  border-collapse: collapse;
}

.p-about table th,
.p-about table td {
  text-align: left;
  border-bottom: 1px solid #000;
  padding: 1em 0;
}

.p-about table th {
  width: 25%;
}

.p-vision {
  color: #fff;
  position: relative;
  overflow: hidden;
}

.p-vision .c-head {
  position: absolute;
  top: 5vw;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 5;
}

.p-vision h3 {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.2em;
  padding: 0 1em;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: auto;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  -webkit-transition: .5s;
  transition: .5s;
}

.p-vision h3.js-scroll {
  opacity: 0;
  -webkit-transform: translateY(10vh) scale(1.2);
          transform: translateY(10vh) scale(1.2);
}

.p-vision h3.is-scroll {
  opacity: 1;
  -webkit-transform: none;
          transform: none;
}

.p-vision_block {
  width: 100%;
  height: 150vh;
  position: relative;
  overflow: hidden;
}

.p-vision_block .txt {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-vision_block .txt img {
  max-width: 90%;
}

.p-vision_block--01 {
  background: url(../img/vision_creative_bg.jpg) no-repeat center/auto;
  z-index: 3;
}

.p-vision_block--02 {
  background: url(../img/vision_crazy_bg.jpg) no-repeat center/auto;
  z-index: 2;
}

.p-vision_block--03 {
  background: url(../img/vision_experience_bg.jpg) no-repeat center/auto;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .p-vision_block {
    background-attachment: fixed !important;
  }
}

@media screen and (max-width: 767px) {
  .p-vision h3 {
    font-size: 3.8vw;
  }
}

.p-contact {
  height: 100vh;
  padding: 5vw;
  color: #fff;
  position: relative;
}

.p-contact h2.ttl {
  color: #fff;
}

.p-contact h3 {
  font-size: 50px;
  font-weight: bold;
  text-align: center;
  position: absolute;
  top: 40%;
  left: 0;
  right: 0;
  margin: auto;
}

@media screen and (max-width: 767px) {
  .p-contact h3 {
    font-size: 6vw;
    top: 40%;
  }
}

.p-contact .btn {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 30%;
  margin: auto;
  text-align: center;
}

.p-contact .btn a {
  color: #fff;
  display: inline-block;
}

.p-contact .bg video {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
}

.p-policy {
  padding: 5% 0;
}

.p-policy_bg {
  padding: 5%;
  margin-top: 30px;
  background: linear-gradient(135deg, #c80e84 40px, transparent 40px);
  -webkit-box-shadow: 2px 2px 20px #ccc;
          box-shadow: 2px 2px 20px #ccc;
  border-radius: 20px;
  overflow: hidden;
  position: relative;
}

.p-policy_bg:before {
  content: 'X';
  position: absolute;
  right: 0;
  bottom: -3.2vw;
  margin: auto;
  font-size: 20vw;
  font-weight: bold;
  line-height: 1;
  opacity: 0.1;
  z-index: -1;
}

.p-policy h3 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 0.5em;
}

.p-policy h3:not(:first-child) {
  margin-top: 2em;
}

.p-policy p {
  line-height: 2;
}

.p-policy a {
  color: var(--subcolor);
}

.p-policy a.url {
  word-wrap: break-word;
  word-break: break-all;
}

@-webkit-keyframes txtLoop_R {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100vw);
            transform: translateX(-100vw);
  }
}

@keyframes txtLoop_R {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(-100vw);
            transform: translateX(-100vw);
  }
}

@-webkit-keyframes txtLoop_L {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100vw);
            transform: translateX(100vw);
  }
}

@keyframes txtLoop_L {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(100vw);
            transform: translateX(100vw);
  }
}

@-webkit-keyframes load {
  0% {
    height: 0;
    background: #333;
  }
  50% {
    height: 100vh;
    background: #333;
  }
  100% {
    height: 100vh;
    background: #fff;
  }
}

@keyframes load {
  0% {
    height: 0;
    background: #333;
  }
  50% {
    height: 100vh;
    background: #333;
  }
  100% {
    height: 100vh;
    background: #fff;
  }
}

@-webkit-keyframes load2 {
  0% {
    top: 100%;
  }
  20% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  40% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  60% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  80% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  100% {
    top: 0%;
  }
}

@keyframes load2 {
  0% {
    top: 100%;
  }
  20% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  40% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  60% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  80% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  100% {
    top: 0%;
  }
}

@-webkit-keyframes load3 {
  0% {
    top: 100%;
  }
  10% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  30% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  50% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  70% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  100% {
    top: 0%;
  }
}

@keyframes load3 {
  0% {
    top: 100%;
  }
  10% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  30% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  50% {
    -webkit-transform: skewY(7deg);
            transform: skewY(7deg);
  }
  70% {
    -webkit-transform: skewY(-7deg);
            transform: skewY(-7deg);
  }
  100% {
    top: 0%;
  }
}

@-webkit-keyframes load4 {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
}

@keyframes load4 {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
}

@-webkit-keyframes load5 {
  0% {
    -webkit-transform: translateX(125%);
            transform: translateX(125%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

@keyframes load5 {
  0% {
    -webkit-transform: translateX(125%);
            transform: translateX(125%);
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}

.l-header {
  height: 100vh;
  width: 100%;
  background: #000;
  position: relative;
  overflow: hidden;
}

.l-header:before, .l-header:after {
  content: '';
  width: 180px;
  height: 100vh;
  background: #1f1f1f;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.l-header:before {
  -webkit-transform: skewX(30deg);
          transform: skewX(30deg);
  z-index: 101;
}

.l-header:after {
  -webkit-transform: skewX(-30deg);
          transform: skewX(-30deg);
  z-index: 103;
}

.l-header h1 {
  position: absolute;
  left: 0;
  bottom: 0;
  margin: auto;
  font-size: 10vw;
  font-weight: bold;
  color: #fff;
  line-height: 1;
  letter-spacing: 0;
  margin-bottom: -1.5vw;
  z-index: 105;
}

.l-header .looptxt {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  z-index: 102;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -webkit-transform: rotate(-60deg);
          transform: rotate(-60deg);
}

.l-header .looptxt_r {
  -webkit-transform: rotate(60deg);
          transform: rotate(60deg);
}

.l-header .looptxt p {
  font-size: 13.4vh;
  font-weight: bold;
  white-space: nowrap;
  position: absolute;
  top: 0;
  margin: auto;
}

.l-header .looptxt p .myword {
  background: -webkit-gradient(linear, left bottom, right top, from(#c80e84), color-stop(50%, #6942a2), to(#0877bf));
  background: linear-gradient(to top right, #c80e84 0%, #6942a2 50%, #0877bf 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.l-header .looptxt p:nth-child(odd) {
  left: 0;
  text-align: left;
  -webkit-animation: txtLoop_L 20s linear 0s infinite normal forwards running;
          animation: txtLoop_L 20s linear 0s infinite normal forwards running;
}

.l-header .looptxt p:nth-child(even) {
  right: 0;
  text-align: right;
  -webkit-animation: txtLoop_R 20s linear 0s infinite normal forwards running;
          animation: txtLoop_R 20s linear 0s infinite normal forwards running;
}

.l-header .looptxt p:nth-child(1) {
  font-size: 20.1vh;
}

.l-header .looptxt p:nth-child(2) {
  top: 15vh;
  -webkit-animation-delay: -12s;
          animation-delay: -12s;
}

.l-header .looptxt p:nth-child(3) {
  top: 30vh;
  font-size: 6.7vh;
  -webkit-animation-delay: -8s;
          animation-delay: -8s;
}

.l-header .looptxt p:nth-child(4) {
  top: 45vh;
  font-size: 10.05vh;
  -webkit-animation-delay: -4s;
          animation-delay: -4s;
}

.l-header .looptxt p:nth-child(5) {
  top: 60vh;
  font-size: 26.8vh;
  -webkit-animation-delay: -16s;
          animation-delay: -16s;
}

.l-header .global-nav {
  padding: 5%;
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;
  max-width: 100%;
  max-height: 100%;
  background: url(../img/h_menu_bg.png) no-repeat center/cover;
  z-index: 202;
  -webkit-transition: .5s;
  transition: .5s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  opacity: 0;
  pointer-events: none;
}

.l-header .global-nav ul li a {
  font-weight: bold;
  font-size: 20px;
  letter-spacing: 0.05em;
  display: block;
  color: #fff;
  padding: 1.5em 0;
  border-bottom: 1px solid #fff;
  width: 345px;
}

.menu-open .l-header .global-nav {
  opacity: 1;
  pointer-events: auto;
}

.l-header .hamburger {
  position: fixed;
  top: 33px;
  right: 40px;
  width: 65px;
  height: 38px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  z-index: 203;
  cursor: pointer;
  mix-blend-mode: difference;
}

.l-header .hamburger span {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  width: 10px;
  height: 65px;
  background: #fff;
  display: block;
  -webkit-transition: .5s;
  transition: .5s;
}

.l-header .hamburger span:nth-child(1) {
  -webkit-transform: skewX(30deg);
          transform: skewX(30deg);
  top: 0;
  bottom: 0;
}

.l-header .hamburger span:nth-child(2) {
  -webkit-transform: scaleY(0);
          transform: scaleY(0);
  opacity: 0;
  top: 0;
  bottom: 0;
}

.l-header .hamburger span:nth-child(3) {
  -webkit-transform: skewX(-30deg);
          transform: skewX(-30deg);
  top: 0;
  bottom: 0;
}

.menu-open .l-header .hamburger span {
  -webkit-filter: none;
          filter: none;
}

.menu-open .l-header .hamburger span:nth-child(1) {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.menu-open .l-header .hamburger span:nth-child(2) {
  -webkit-transform: scaleY(0);
          transform: scaleY(0);
  opacity: 0;
}

.menu-open .l-header .hamburger span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

@media screen and (max-width: 767px) {
  .l-header h1 {
    font-size: 12vw;
  }
  .l-header .myword_wrap label {
    font-size: 7vw;
  }
  .l-header:before, .l-header:after {
    width: 120px;
  }
  .l-header .global-nav {
    width: 100%;
    height: 100vh;
  }
  .l-header .global-nav ul li a {
    font-size: 15px;
  }
  .l-header .hamburger {
    top: 33px;
    right: 20px;
    width: 32.5px;
    height: 19px;
  }
  .l-header .hamburger span {
    width: 5px;
    height: 32.5px;
  }
}

#cover {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 201;
}

.myword_wrap {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 104;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.myword_wrap label {
  font-size: 30px;
  color: #fff;
  text-align: center;
  display: block;
}

.myword_wrap #myword-input {
  width: 10em;
  height: 1em;
  font-size: 30px;
  text-align: center;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  border: 1px solid #fff;
  border-radius: 0;
  padding: 0.5em;
}

/* container */
.l-container {
  width: 100%;
  max-width: var(--container);
  margin: 0 auto;
}

@media screen and (max-width: 1040px) {
  .l-container {
    padding-left: 4%;
    padding-right: 4%;
  }
}

/* PC/SP */
@media screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

/* clearfix */
.clearfix:after {
  content: '';
  display: block;
  clear: both;
}

.l-aside .cta-bnr {
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 101;
}

.l-aside .cta-bnr img {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .l-aside .cta-bnr {
    max-width: 25%;
  }
}

.p-loading {
  width: 100%;
  height: 100vh;
  background: #000;
  z-index: 99999;
  position: fixed;
  top: 0;
  left: 0;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.p-loading .left, .p-loading .right {
  width: 180px;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  overflow: hidden;
}

.p-loading .left:after, .p-loading .left:before, .p-loading .right:after, .p-loading .right:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(#c80e84), color-stop(50%, #6942a2), to(#0877bf));
  background: linear-gradient(to bottom, #c80e84 0%, #6942a2 50%, #0877bf 100%);
  -webkit-animation: load2 1.5s ease-out 0s 1 normal forwards running;
          animation: load2 1.5s ease-out 0s 1 normal forwards running;
}

.p-loading .left:before, .p-loading .right:before {
  background: #c80e84;
  -webkit-animation: load3 1.5s ease-out 0s 1 normal forwards running;
          animation: load3 1.5s ease-out 0s 1 normal forwards running;
}

.p-loading .left {
  -webkit-transform: skewX(30deg);
          transform: skewX(30deg);
  z-index: 3;
}

.p-loading .right {
  -webkit-transform: skewX(-30deg);
          transform: skewX(-30deg);
  z-index: 3;
}

.p-loading .txt {
  width: 500px;
  height: 500px;
  border: 120px solid #444;
  border-radius: 50%;
  position: absolute;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  z-index: 2;
}

.p-loading .txt:before {
  content: '';
  position: absolute;
  top: -50%;
  left: 50%;
  margin: auto;
  width: 0;
  height: 0;
  border: 250px solid transparent;
  border-right-color: #000;
  border-bottom-color: #000;
  -webkit-animation: load4 1.5s ease-in-out 0s infinite normal forwards running;
          animation: load4 1.5s ease-in-out 0s infinite normal forwards running;
  -webkit-transform-origin: bottom left;
          transform-origin: bottom left;
}

.p-loading .txt:after {
  content: '';
  position: absolute;
  top: 120px;
  left: 50%;
  bottom: 0;
  margin: auto;
  width: 320px;
  height: 120px;
  background: #444;
  -webkit-transform: translateX(125%);
          transform: translateX(125%);
}

.p-loading.is-load .txt:before {
  -webkit-animation-iteration-count: 1;
          animation-iteration-count: 1;
}

.p-loading.is-load .txt:after {
  -webkit-animation: load5 0.5s ease-in-out 0s 1 normal forwards running;
          animation: load5 0.5s ease-in-out 0s 1 normal forwards running;
}

@media screen and (max-width: 767px) {
  .p-loading .left, .p-loading .right {
    width: 120px;
  }
  .p-loading .txt {
    width: 320px;
    height: 320px;
    border-width: 80px;
  }
  .p-loading .txt:before {
    border-width: 160px;
  }
  .p-loading .txt:after {
    top: 80px;
    height: 80px;
  }
}
