@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap");
body {
  font-family: "Noto Sans JP", sans-serif;
  line-height: 2;
  font-weight: 400;
  font-size: 16px;
  color: #333;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
  letter-spacing: 0.05em;
}

.wrapper {
  overflow: hidden;
  position: relative;
}

.pc {
  display: block;
}

.sp {
  display: none;
}

@media screen and (max-width: 750px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
}
/* Loading背景画面設定　*/
#splash {
  /*fixedで全面に固定*/
  position: fixed;
  z-index: 9999;
  width: 100%;
  height: 100%;
  background: -webkit-gradient(linear, left top, right bottom, from(#005b75), to(#000f1d));
  background: linear-gradient(to right bottom, #005b75, #000f1d);
  text-align: center;
  color: #fff;
}

/* Loadingバー中央配置　*/
#splash_inner {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 999;
  width: 100%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.hero {
  background: -webkit-gradient(linear, left top, right bottom, from(#005b75), to(#000f1d));
  background: linear-gradient(to right bottom, #005b75, #000f1d);
  position: relative;
}
.hero .hero-head {
  width: 100%;
}
.hero #particles-js {
  position: absolute;
  width: 100%;
  height: 100%;
}
.hero .navbar {
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  background: transparent;
}
.hero .navbar.change-color {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
}
.hero .navbar.change-color .navbar-item {
  color: #fff;
}
.hero .navbar-menu .navbar-item {
  display: block;
  text-align: center;
  font-weight: bold;
  line-height: 1.3;
  color: #fff;
  letter-spacing: 0.15em;
}
.hero .navbar-menu .navbar-item:hover {
  background-color: transparent;
  color: #3ca1d0;
}
.hero .navbar-menu .navbar-item:focus {
  background-color: transparent;
  color: #fff;
}
.hero .navbar-menu .navbar-item span {
  display: block;
  font-size: 10px;
  font-weight: bold;
}
.hero .navbar-brand {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.hero .navbar-brand .navbar-item img {
  max-height: 3rem;
}
.hero .navbar-brand .navbar-burger {
  width: 4rem;
  height: 4rem;
  background-color: #3ca1d0;
  color: #fff;
}

@media screen and (max-width: 750px) {
  .hero .navbar-menu {
    background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
    background: linear-gradient(to right, #005b75, #000f1d);
    border-top: 1px solid #fff;
  }
  .hero .navbar-menu .navbar-item {
    color: #fff;
  }
  .navbar-brand .navbar-item {
    max-width: 160px;
  }
  .hero-body img {
    width: 60%;
  }
}
.title {
  line-height: 1.65;
}

.en {
  font-family: "nudista-web", sans-serif;
  font-style: italic;
}

#contents {
  background-color: #fff;
}
#contents a {
  background-color: #3ca1d0;
  color: #fff;
}
#contents a:hover {
  opacity: 0.8;
}
#contents .img-item {
  height: 250px;
  -o-object-fit: cover;
     object-fit: cover;
}

#premiumchat {
  background: url(../images/top/chat_bg.jpg) no-repeat center center;
  background-size: cover;
}
#premiumchat .title {
  color: #52b1dd;
}
#premiumchat .subtitle {
  color: #52b1dd;
}
#premiumchat .button {
  color: #fff;
  border: 1px solid #fff;
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
}
#premiumchat .youtube iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  display: block;
}

#cgedit {
  background: url(../images/top/edit_bg.jpg) no-repeat center center;
  background-size: cover;
}
#cgedit .title {
  color: #52b1dd;
}
#cgedit .subtitle {
  color: #52b1dd;
}
#cgedit .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}

#metaverse {
  background: url(../images/top/metaverse_bg.jpg) no-repeat center bottom;
  background-size: cover;
}
#metaverse .title {
  color: #52b1dd;
}
#metaverse .subtitle {
  color: #52b1dd;
}
#metaverse .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}

#photo {
  background: url(../images/top/photo_bg.jpg) no-repeat center center;
  background-size: cover;
}
#photo .title {
  color: #52b1dd;
}
#photo .subtitle {
  color: #52b1dd;
}
#photo .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}

#about {
  background: url(../images/top/about_bg.jpg) no-repeat center center;
  background-size: cover;
}
#about .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}
#about .youtube iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  display: block;
}

#company {
  background: url(../images/top/company_bg.jpg) no-repeat center bottom;
  background-size: cover;
}
#company .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}

#sec03 img {
  display: block;
}

#sec04 {
  background-color: #eef5f9;
}
#sec04 .title {
  color: #3ca1d0;
}

#contact {
  background: url(../images/common/contact_bg.jpg) no-repeat center center;
  background-size: cover;
}
#contact .box {
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid #fff;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}
#contact .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}

.footer {
  background-color: #000a17;
}
.footer .navbar-menu .navbar-item {
  font-size: 14px;
  color: #fff;
  letter-spacing: 0.15em;
}
.footer .navbar-menu .navbar-item:hover {
  background-color: transparent;
  color: #3ca1d0;
}
.footer .navbar-menu .navbar-link {
  font-size: 14px;
  color: #fff;
  letter-spacing: 0.15em;
}
.footer .navbar-menu .navbar-link:hover {
  background-color: transparent;
  color: #3ca1d0;
}
.footer .navbar-menu .navbar-link::after {
  display: none;
}
.footer .navbar-menu .navbar-item.has-dropdown:hover .navbar-link {
  background-color: transparent;
}
.footer .navbar-menu .navbar-dropdown {
  background-color: #005b75;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top: 2px solid #fff;
  -webkit-box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
          box-shadow: 0 8px 8px rgba(10, 10, 10, 0.1);
  display: none;
  font-size: 0.875rem;
  left: 0;
  min-width: 100%;
  position: absolute;
  top: 100%;
  z-index: 20;
}

.fadeIn {
  opacity: 0;
}

@media screen and (max-width: 750px) {
  #contents .img-item {
    height: 180px;
  }
  #metaverse .embed {
    height: 200px;
  }
  #cgedit .embed {
    height: 200px;
  }
}
#lower-page .hero {
  background: -webkit-gradient(linear, left top, right bottom, from(#005b75), to(#000f1d));
  background: linear-gradient(to right bottom, #005b75, #000f1d);
}
#lower-page .lower-header {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
}
#lower-page .lower-header .navbar-item {
  color: #fff;
}
#lower-page .lower-header .navbar-item:hover {
  color: #3ca1d0;
}

@media screen and (max-width: 750px) {
  #lower-page .hero-body .title {
    font-size: 28px;
  }
  #lower-page .hero-body .subtitle {
    font-size: 18px;
  }
}
#l-about {
  background: url(../images/aboutus/mission_bg.jpg) no-repeat center center;
  background-size: cover;
}
#l-about .title span {
  display: block;
  color: #3ca1d0;
  font-size: 1.3em;
}
#l-about .c-blue {
  color: #3ca1d0;
  border-top: 1px solid;
  border-bottom: 1px solid;
}
#l-about .tb-border {
  border-top: 2px solid #3ca1d0;
  border-bottom: 2px solid #3ca1d0;
}

#l-company th {
  width: 25%;
}

@media screen and (max-width: 750px) {
  #aboutus .title {
    font-size: 18px;
  }
  #company th {
    display: block;
    width: 100%;
    border: none;
    padding-bottom: 0;
  }
  #company td {
    display: block;
    width: 100%;
  }
}
#service th {
  width: 30%;
}

#privacypolicy .subtitle {
  border-bottom: 1px solid #ddd;
}
#privacypolicy p {
  font-size: 13px;
}
#privacypolicy table td {
  vertical-align: middle;
  font-size: 13px;
  padding: 2em;
}
#privacypolicy th {
  width: 50%;
}

.bg-blue {
  background: -webkit-gradient(linear, left top, right bottom, from(#fff), to(#ebf0f3));
  background: linear-gradient(to right bottom, #fff, #ebf0f3);
}

.bg-blue-r {
  background: -webkit-gradient(linear, left top, right bottom, from(#ebf0f3), to(#fff));
  background: linear-gradient(to right bottom, #ebf0f3, #fff);
}

.bb-blue {
  border-bottom: 1px solid #3ca1d0;
}

#redx .title {
  color: #3ca1d0;
}
#redx .subtitle {
  color: #3ca1d0;
  font-size: 28px;
  font-weight: bold;
}
#redx .num {
  font-size: 100px;
  color: #3ca1d0;
  line-height: 1;
  text-decoration: underline;
  text-decoration-thickness: 2px;
}
#redx .usage {
  border-top: 1px solid;
  border-bottom: 1px solid;
}
#redx .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}

#editing .title {
  color: #3ca1d0;
}
#editing .subtitle {
  color: #3ca1d0;
}
#editing .usage {
  border-top: 1px solid;
  border-bottom: 1px solid;
}
#editing .button {
  background: -webkit-gradient(linear, left top, right top, from(#005b75), to(#000f1d));
  background: linear-gradient(to right, #005b75, #000f1d);
  color: #fff;
}
#editing .box {
  border: 2px solid #3ca1d0;
}

#l-metaverse .c-blue {
  color: #3ca1d0;
}

@media screen and (max-width: 750px) {
  #redx .title {
    font-size: 24px;
  }
  #redx .subtitle {
    font-size: 18px;
  }
  #redx .num {
    font-size: 50px;
    text-decoration-thickness: 1px;
  }
  #editing .title {
    font-size: 24px;
  }
  #editing .subtitle {
    font-size: 20px;
  }
  #editing .num {
    font-size: 50px;
    text-decoration-thickness: 1px;
  }
}
.border-s {
  border: 1px solid #fff;
}
.border-s img {
  display: block;
}

.embed {
  width: 100%;
  height: 550px;
}
.embed iframe {
  width: 100%;
  height: 100%;
  border-radius: 10px;
}
.embed video {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 750px) {
  .embed {
    width: 100%;
    height: 250px;
  }
}
label.label {
  color: #3ca1d0;
}/*# sourceMappingURL=style.css.map */