@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300&display=swap');

@font-face {
    font-family: 'ITC Kabel Std';
    src:
    /*url('fonts/ITCKabelStdBold.TTF'),*/
        url('../fonts/ITCKabelStdBook.TTF');
        /*url('fonts/ITCKabelStdDemi.TTF'),*/
        /*url('fonts/ITCKabelStdMedium.TTF');*/
        /*url('fonts/ITCKabelStdUltra.TTF'); */
    font-weight: normal;
    font-style: normal;
}

h1, .link_ttl{
     font-family: 'ITC Kabel Std';
}

h2, h3, .parattl{
     font-family: 'ITC Kabel Std';
    /*font-weight:200 !important;*/
}

.page_ttl, .item_ttl, .no_bg_ttl{
    color:#30b34d;
     font-family: 'ITC Kabel Std';
}
.bg_ttl{
     font-family: 'ITC Kabel Std';
}
.gothic{
    color:black;
}

.footh3{
    color:#30b34d;
    font-family: 'ITC Kabel Std';
}
a, .border_ttl, th{
    font-family: 'Noto Sans', sans-serif;
}
p, .jp_read{
    font-family: 'Noto Sans', sans-serif;
    font-weight:600 !important;
}
td{
    font-family: 'Noto Sans', sans-serif;
    font-weight:600;
}

/*! Writen  by SCSS */
.contents_wrap {
  padding-right: 154px; 
    background:#ffffd0;
}
  @media screen and (max-width: 768px) {
    .contents_wrap {
      padding-right: 0; } }

.page_ttl_wrap {
  /*padding-top: 400px;*/
  padding-top:300px;
}
  @media screen and (max-width: 768px) {
    .page_ttl_wrap {
      /*padding-top: 0;*/
      padding-top: 62px;
    } }
  .page_ttl_wrap.vh_max {
    height: 100vh;
    /*height: 100svh;*/
    padding-top: 0 !important;
    display: flex;
    align-items: center; }
    .page_ttl_wrap.vh_max .page_ttl {
      padding-top: 0 !important;
      padding-bottom: 0 !important; }
    @media screen and (max-width: 768px) {
      .page_ttl_wrap.vh_max {
        margin-top: -70px; } }
  .page_ttl_wrap .page_ttl {
    padding-left: max(40px, 7.5vw);
    padding-right: 40px;
    padding-bottom: 230px;
    display: flex;
    flex-direction: column; }
    @media screen and (max-width: 768px) {
      .page_ttl_wrap .page_ttl {
        flex-direction: column-reverse;
        padding-left: 40px;
        /*padding-top: max(180px, 48%);*/
        padding-top: max(80px, 3%);
        
      } }
    .page_ttl_wrap .page_ttl .en {
      font-size: clamp(20px, 6.875vw, 110px);
      line-height: 1.2;
      word-wrap: break-word;
      display: block;
      letter-spacing: -0.03em;
      overflow: hidden; }
      @media screen and (max-width: 768px) {
        .page_ttl_wrap .page_ttl .en {
          /*font-size: clamp(18px, 4.8vw, 24px);*/
          /*color: rgba(45, 44, 55, 0.3);*/
          /*margin-top: 20px; */
          margin-top: 0; 
        } }
      @media screen and (max-width: 480px) {
        .page_ttl_wrap .page_ttl .en {
          /*font-size: 12px; */
          font-size: 36px; 
        }
          header .logo {
            width:50%;
            top:20px;
            }
      }
      .page_ttl_wrap .page_ttl .en span {
        display: inline-block;
        transition: 1s transform cubic-bezier(0.04, 0.25, 0.44, 0.99) 0.3s;
        transform: translateY(100%); }
    .page_ttl_wrap .page_ttl .sub {
      margin-top: 20px;
      display: block;
      font-size: 18px;
      font-weight: bold;
      letter-spacing: 0.03em;
      overflow: hidden; }
      @media screen and (max-width: 768px) {
        .page_ttl_wrap .page_ttl .sub {
          /*font-size: clamp(36px, 9.6vw, 54px);*/
          /*line-height: 1.5;*/
          /*margin-top: 0; */
            margin-top: 20px; 
        } }
      @media screen and (max-width: 480px) {
        .page_ttl_wrap .page_ttl .sub {
          letter-spacing: 0; } }
      .page_ttl_wrap .page_ttl .sub span {
        display: inline-block;
        transition: 1s transform cubic-bezier(0.04, 0.25, 0.44, 0.99) 0.3s;
        transform: translateY(100%); }
      @media screen and (max-width: 768px) {
        .page_ttl_wrap .page_ttl .sub.l_adjust_sp {
          letter-spacing: -0.05em;
          white-space: nowrap; } }
    body.loaded .page_ttl_wrap .page_ttl .en span {
      transform: translateY(0); }
    body.loaded .page_ttl_wrap .page_ttl .sub span {
      transform: translateY(0); }
  .page_ttl_wrap .main_image {
    max-width: calc(1650px + 6.569%);
    margin-right: max(40px, 6.569%);
    padding-bottom: 33.819%;
    mix-blend-mode: multiply; }
    @media screen and (max-width: 768px) {
      .page_ttl_wrap .main_image {
        margin-right: 40px; } }
    @media screen and (max-width: 480px) {
      .page_ttl_wrap .main_image {
        margin-top: -100px; } }
    .page_ttl_wrap .main_image .cap {
      margin-right: max(40px, 6.569%);
      color: #fff;
      opacity: 0.3;
      letter-spacing: 0.03em; }
      @media screen and (max-width: 768px) {
        .page_ttl_wrap .main_image .cap {
          margin-right: 40px; } }

.inner {
  width: 100%;
  max-width: calc(1545px + 5vw + 5.6vw);
  padding-left: max(40px, 5vw);
  padding-right: max(40px, 5.6vw);
  	/*max-width: calc(1545px + 5.946% + 6.569%);
      padding-left: max(40px, 5.946%);
      padding-right: max(40px, 6.569%);
  	width: calc(100% + ((100vw - 100%) - 154px));	*/
  /*max-width: calc(1545px + (7.022% * 2) + 40px);
  padding-left: max(40px, 7.022%);
  padding-right: clamp(40px, 7.022%, 116px);*/ }
  @media screen and (max-width: 768px) {
    .inner {
      padding-left: 40px;
      padding-right: 40px;
      width: 100%; } }

.inner2 {
  max-width: calc(1466px + (7.5vw + 8.125vw));
  padding-left: max(40px, 7.5vw);
  padding-right: max(40px, 8.125vw);
  /*	max-width: calc(1466px + (10.42% * 2) + 40px);
  	padding-left: max(40px, 10.42%);
  	padding-right: clamp(40px, 10.42%, 116px);*/
  width: 100%; }
  @media screen and (max-width: 768px) {
    .inner2 {
      padding-left: 40px;
      padding-right: 40px; } }

.inner3 {
  max-width: calc(1496px + (7.5vw + 5.6vw));
  padding-left: max(40px, 7.5vw);
  padding-right: max(40px, 5.6vw);
  /*max-width: calc(1496px + (8.721% * 2) + 40px);
  padding-left: max(40px, 8.721%);
  padding-right: clamp(40px, 8.721%, 116px);*/
  width: 100%; }
  @media screen and (max-width: 768px) {
    .inner3 {
      padding-left: 40px;
      padding-right: 40px; } }

.inner4 {
  max-width: calc(1050px + (7.899% * 2) + 40px);
  padding-left: max(40px, 7.899%);
  padding-right: clamp(40px, 7.899%, 116px);
  width: 100%; }
  @media screen and (max-width: 768px) {
    .inner4 {
      padding-left: 40px;
      padding-right: 40px; } }

.inner5 {
  max-width: calc(1612px + 7.13vw);
  padding-left: max(40px, 7.13vw);
  /*max-width: calc(1612px + 8.721%);
  padding-left: max(40px, 8.721%);*/
  width: 100%; }
  @media screen and (max-width: 768px) {
    .inner5 {
      padding-left: 40px;
      padding-right: 40px; } }

.inner6 {
  max-width: calc(1185px + (11vw + 18vw));
  padding-left: max(40px, 11vw);
  padding-right: max(40px, 18vw);
  /*max-width: calc(1185px + (12.571% + 13.817%));
  padding-left: max(40px, 12.571%);
  padding-right: max(40px, 13.817%);*/
  width: 100%; }
  @media screen and (max-width: 768px) {
    .inner6 {
      padding-left: 40px;
      padding-right: 40px; } }

.inner7 {
  max-width: calc(1428px + (11vw + 5.6vw));
  padding-left: max(40px, 11vw);
  padding-right: max(40px, 5.6vw);
  width: 100%; }
  @media screen and (max-width: 768px) {
    .inner7 {
      padding-left: 40px;
      padding-right: 40px; } }

.inner8 {
  max-width: calc(1526px + (6vw + 5vw));
  padding-left: max(40px, 6vw);
  padding-right: max(40px, 5vw);
  width: 100%; }
  @media screen and (max-width: 768px) {
    .inner8 {
      padding-left: 40px;
      padding-right: 40px; } }

.intro_wrap {
  padding-top: 180px;
  margin-bottom: 200px; }
  @media screen and (max-width: 768px) {
    .intro_wrap {
      padding-top: max(100px, 26.667%);
      margin-bottom: max(100px, 26.667%); } }
  .intro_wrap .inner {
    justify-content: flex-start;
    padding-left: max(40px, 6.459vw);
    padding-right: max(40px, 6.0417vw); }
    @media screen and (max-width: 768px) {
      .intro_wrap .inner {
        flex-direction: column;
        padding-left: 40px;
        padding-right: 40px; } }
  .intro_wrap .en_ttl {
    font-size: 22px;
    color: #C4C0C1;
    line-height: 1;
    margin-right: min(9.585%, 155px); }
    @media screen and (max-width: 768px) {
      .intro_wrap .en_ttl {
        margin-right: 0; } }
    @media screen and (max-width: 480px) {
      .intro_wrap .en_ttl {
        font-size: 12px; } }
  .intro_wrap h4 {
    font-size: clamp(20px, 2.084vw, 40px);
    font-weight: bold;
    margin-top: calc((1 - 1.8) * 0.5em); }
    @media screen and (max-width: 768px) {
      .intro_wrap h4 {
        margin-top: 30px; } }
  .intro_wrap .jp_read {
    font-size: clamp(15px, 1.042vw, 20px);
    letter-spacing: 0.03em;
    font-weight: 500;
    margin-top: 95px;
    line-height: 2.65; }
    @media screen and (max-width: 768px) {
      .intro_wrap .jp_read {
        margin-top: 38px;
        line-height: 1.9; } }

h4.no_bg_ttl {
  font-size: 30px;
  font-weight: bold;
  color: #191212;
  letter-spacing: 0.03em;
  margin-bottom: 30px; }
  @media screen and (max-width: 768px) {
    h4.no_bg_ttl {
      font-size: 24px;
      margin-bottom: 20px; } }
  @media screen and (max-width: 480px) {
    h4.no_bg_ttl {
      font-size: 20px;
      line-height: 1.75; } }
h4.no_bg_ttl_s {
  font-size: 24px;
  font-weight: bold;
  color: #2D2C37;
  letter-spacing: 0.03em;
  margin-bottom: 20px; }
  @media screen and (max-width: 768px) {
    h4.no_bg_ttl_s {
      font-size: 24px;
      margin-bottom: 20px; } }
h4.bg_ttl {
  /*background-color: #2D2B36;*/
  background-color: #172a15;
  padding: 18px 20px 16px 28px;
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  letter-spacing: 0.03em;
  line-height: 1;
  display: flex;
  align-items: center; }
  @media screen and (max-width: 768px) {
    h4.bg_ttl {
      font-size: 20px;
      padding: 14px 20px 12px 24px; } }
  @media screen and (max-width: 480px) {
    h4.bg_ttl {
      font-size: 18px;
      padding: 10px 20px 8px 20px;
      line-height: 1.75; } }
  h4.bg_ttl .jp {
    font-size: 15px;
    margin-left: 20px; }
    @media screen and (max-width: 768px) {
      h4.bg_ttl .jp {
        margin-left: 0;
        font-size: 18px; } }
  @media screen and (max-width: 768px) {
    h4.bg_ttl.sp_adjsut {
      margin-left: calc(-50vw + 50%);
      margin-right: calc(-50vw + 50%); }
      h4.bg_ttl.sp_adjsut .en {
        display: none; } }

h5.border_ttl {
  background-color: #fff;
  padding: 20px 20px 18px 25px;
  font-size: 19px;
  font-weight: bold;
  color: #2D2B36;
  letter-spacing: 0.03em;
  line-height: 1;
  position: relative; }
  @media screen and (max-width: 768px) {
    h5.border_ttl {
      font-size: 20px;
      padding: 14px 14px 12px 20px; } }
  @media screen and (max-width: 480px) {
    h5.border_ttl {
      font-size: 18px;
      padding: 10px 10px 8px 20px;
      line-height: 1.75; } }
  h5.border_ttl::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 61.291%;
    width: 2px;
    background-color: #2D2B36; }
    @media screen and (max-width: 768px) {
      h5.border_ttl::before {
        height: 100%;
        top: 0;
        transform: translateY(0); } }
  h5.border_ttl.tt_indent {
    padding-left: calc(1em + 25px);
    text-indent: -1em; }
    @media screen and (max-width: 768px) {
      h5.border_ttl.tt_indent {
        padding-left: calc(1em + 20px); } }

.read_m {
  font-size: 16px;
  line-height: 2;
  font-weight: normal;
  color: #2C2A35; }
  .read_m.bold {
    font-weight: bold; }

.read {
  font-size: 15px;
  line-height: 2.134;
  font-weight: normal; }
  .read.bold {
    font-weight: bold; }

.read_s {
  font-size: 14px;
  line-height: 1.9;
  font-weight: normal; }
  .read_s.bold {
    font-weight: bold; }

.tt_uc {
  text-transform: uppercase; }

.funlife_bnr_wrap {
  margin: 160px auto -110px;
  padding-top: 60px;
  border-top: 1px solid rgba(152, 138, 138, 0.51); }
  @media screen and (max-width: 768px) {
    .funlife_bnr_wrap {
      margin: 100px auto -40px; } }
  .funlife_bnr_wrap .funlife_bnr {
    position: relative;
    max-width: 1120px;
    width: calc(100% - 40px);
    margin: 0 auto; }
    .funlife_bnr_wrap .funlife_bnr .funlife_link_img {
      position: absolute;
      left: 51.072%;
      transition: .4s; }
      .funlife_bnr_wrap .funlife_bnr .funlife_link_img:hover {
        opacity: 0.5; }
      @media screen and (max-width: 480px) {
        .funlife_bnr_wrap .funlife_bnr .funlife_link_img {
          left: 7.62%; } }
    .funlife_bnr_wrap .funlife_bnr .google_play {
      top: 26.224%;
      max-width: 201px;
      width: 17.95%; }
      @media screen and (max-width: 480px) {
        .funlife_bnr_wrap .funlife_bnr .google_play {
          top: initial;
          bottom: 28%;
          max-width: 100%;
          width: 118px; } }
    .funlife_bnr_wrap .funlife_bnr .apple_store {
      top: 50.7%;
      max-width: 174px;
      width: 15.54%; }
      @media screen and (max-width: 480px) {
        .funlife_bnr_wrap .funlife_bnr .apple_store {
          top: initial;
          bottom: 12%;
          max-width: 100%;
          width: 118px; } }
  .funlife_bnr_wrap .funlife_logo {
    max-width: 1120px;
    width: calc(100% - 40px);
    margin: 60px auto 0; }
    @media screen and (max-width: 768px) {
      .funlife_bnr_wrap .funlife_logo {
        margin-top: 30px; } }

/*# sourceMappingURL=inner.css.map */