@charset "UTF-8";

/* 全ページ共通 Css start */
*,
*::before, *::after {box-sizing: border-box;margin: 0;padding: 0;}
html {height: 100%; font-size: 62.5%;overflow-x: hidden;}
body {position: relative; font-family: 'Noto Sans JP', sans-serif; font-size: 1.6rem;line-height: 1.0em;letter-spacing: 0em;background: #ffffff;overflow-x: hidden;overflow-y: scroll;word-wrap: break-word; height: auto;}
h1,h2,h3,h4,h5,h6,p,a,ul,li,ol,dl,dt,dd,table,tr,th,td,span,strong {line-height: 1.6em;letter-spacing: 0em;font-weight: 400;font-feature-settings : "palt";margin: 0;padding: 0; color:#0A3632;}
main {display: block;overflow: hidden;}
hr {box-sizing: content-box;height: 0;overflow: visible;}
ul {list-style: none;}
a, a:visited {color:#333;text-decoration: none;background-color: transparent;}
a:hover, a:active { color:#666; }
abbr[title] {border-bottom: none;text-decoration: underline;text-decoration: underline dotted;}
b, strong {font-weight: bolder;}
code, kbd, samp {font-family: monospace, monospace;font-size: 1em;}
small {font-size: 80%;}
sub, sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}
sub {bottom: -0.25em;}
sup {top: -0.5em;}
img {border-style: none;width: auto;height: auto;max-width: 100%;max-height: 100%;}
button, input, optgroup, select,textarea {font-size: 100%;line-height: 1.15;margin: 0;}
button, input {overflow: visible;}
button, select {text-transform: none;}
button, [type="button"], [type="reset"], [type="submit"] {-webkit-appearance: button;}
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {border-style: none;padding: 0;}
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset { padding: 0.35em 0.75em 0.625em;}
legend {box-sizing: border-box;color: inherit;display: table;max-width: 100%;padding: 0;white-space: normal;}
progress {vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"], [type="radio"] {box-sizing: border-box; padding: 0;}
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"] {-webkit-appearance: textfield; outline-offset: -2px;}
[type="search"]::-webkit-search-decoration { -webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button; font: inherit;}
details { display: block;}
summary {display: list-item;}
template {display: none;}
[hidden] {display: none;}


/* Component ----------------------- */
/* Button */
.btn-base, .btn-base:visited {width: fit-content;display: inline-block;padding: 15px 60px;color: #fff;font-size: 1rem;font-weight: 600;text-decoration: none;background-color: #E1251B;transition: .3s;border-radius: 30px;}
.btn-base:active, .btn-base:hover {color: #fff;background-color: #f13228;}
.pctb-none {display: block;}
.sp-none {display: none;}
@media screen and (min-width: 768px) {
  .pctb-none {display: none;}
  .sp-none {display: block;}
}
@media screen and (min-width: 1024px) {
  .pctb-none {display: none;}
}
@media screen and (min-width: 1200px) {
}

/* Form */
input {padding: .3rem .5rem;}
button, input, optgroup, select, textarea {font-size: 1rem;}




@media screen and (min-width: 768px) {
}
@media screen and (min-width: 1024px) {
}
@media screen and (min-width: 1200px) {
}





/* Header ----------------------- */
.header {width: 100%; position: absolute; top: 0; z-index: 100;}
.header-inner {width: 100%;height: 60px;padding-left: 10px;padding-right: 10px;display: flex; align-items: center;}
.header-inner .header-title {line-height: 0.8em;}
.header-inner .header-title img {width: 100px;}
.header-nav {margin-left: auto;}
.fixed-header {position: fixed;top: -80px;left: 0;z-index: 100;transition: all 0.3s ease-in-out;visibility: hidden;background: linear-gradient(to bottom right, #1A756E, #70B095);}
.fixed-header.is-show {top: 0;visibility: visible;}
@media screen and (min-width: 768px) {
  .header-inner {height: 80px;}
  .header-inner .header-title img {width: 150px;}
  /*.header-nav {display: flex;}*/
}
@media screen and (min-width: 1024px) {
}
@media screen and (min-width: 1200px) {
  .header-inner {width: 96%; max-width: 1600px;margin-left: auto;margin-right: auto;padding-left: 20px;padding-right: 20px;position: relative;}
}

.language-switcher {position: relative;display: inline-block;cursor: pointer;}
.language-switcher > .current-language {padding: 10px 20px;color: #ffffff;border: none;font-size: 16px;display: flex;align-items: center;gap: 10px;}
.language-switcher > .language-options {display: block;visibility: hidden;opacity: 0;position: absolute;top: 100%;left: 0;background-color: white;border: 1px solid #ddd;border-radius: 5px;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);z-index: 100;transform: translateY(-10px);transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;}
.language-switcher > .language-options a {display: flex;align-items: center;gap: 10px;padding: 10px 20px;color: #333;text-decoration: none;font-size: 14px;
transition: background-color 0.3s ease;}
.language-switcher > .language-options a:hover {background-color: #f1f1f1;}
@media (hover: hover) {
  .language-switcher:hover > .language-options {visibility: visible;opacity: 1;transform: translateY(0);}
}
.language-switcher.show-options > .language-options {visibility: visible;opacity: 1;transform: translateY(0);}
.flag {width: 20px;height: 20px;object-fit: cover;}



/* Preloader ----------------------- */
#preloader {position: fixed;top: 0;left: 0;width: 100%;height: 100vh;background: #202020;z-index: 9999;display: flex;justify-content: center;align-items: center;opacity: 1;transition: opacity .8s ease-in-out;}
.pre-logo {width: 40%; display: block; margin-bottom: 100px; opacity: 0;transition: opacity 0.5s ease-in-out;}
@media screen and (min-width: 768px) {
  .pre-logo {width: 30%; margin-bottom: 100px; margin-left: 0;}
}
@media screen and (min-width: 1024px) {
  .pre-logo {width: 500px;}
}
@media screen and (min-width: 1024px) {
  .pre-logo {width: 15%;}
}



/* Footer ----------------------- */
.ft-block {background: #202020; display: block;}
.ft-block .inbox { padding: 30px 10px 10px; border-bottom: 1px solid #4D4D4D; }
.ft-block .inbox p { font-size: 1.2rem; color: #A1A1A1; line-height: 1.2em; text-indent: -0.6em; padding-left: 0.6em;}
.copy-wrap { width: 100%; padding: 20px 0; margin: 0; display: block; z-index: 1; background: #202020;}
.copy-wrap p {text-align: left; color: #A1A1A1; font-size: 1.2rem; font-weight: bold; padding-left: 10px;}
@media screen and (min-width: 768px) {
  .ft-block .inbox p { font-size: 1.2rem; line-height: 1.4em;}
}
@media screen and (min-width: 1200px) {
  .copy-wrap p {width: 1000px; margin: 0 auto;}

}


/* Animation ----------------------- */
.mv-left-in-pt1, .mv-left-in-pt2 {opacity: 0;transform: translateX(-100px);}
.mv-right-in-pt1, .mv-right-in-pt2 {opacity: 0;transform: translateX(100px);}
.mv-bottom-pt1, .mv-bottom-pt2 {opacity: 0;transform: translateY(100px);}
.mv-scale-in {opacity: 0;transform: scale(0.8);}



#contents {width: 100%;padding: 0;margin: 0; z-index: 0;}
section {width: 100%; padding: 0; margin: 0 auto; display: block;}
.wh-bk {background: #ffffff;}
.inbox {width: 100%; padding: 60px 20px; margin: 0; display: block; }
.inbox h2 {font-size: 2rem; font-weight: bold; color: #E1251B; text-align: center; margin-bottom: 60px;}
.pc-img {display: none;}
.sp-img {display: block;}
@media screen and (min-width: 768px) {
  .inbox h2 {font-size: 2.6rem; margin-bottom: 30px;}
  .pc-img {display: block;}
  .sp-img {display: none;}
}
@media screen and (min-width: 1024px) {
  .inbox {padding: 90px 20px;}
  .inbox h2 {font-size: 2.6rem;}
  
}
@media screen and (min-width: 1200px) {
  .inbox {width: 90%; max-width: 1000px; padding: 100px 0; margin: 0 auto; }
  .inbox h2 {font-size: 3.2rem;}
}



/* Main ----------------------- */
.main {width: 100%;height: auto; background: linear-gradient(150deg, transparent 80%, #ffffff 20%), url('../images/main-back.png') 100% / cover no-repeat; position: relative;}
.main .inbox { padding-top: 80px; padding-bottom: 90px; position: relative; z-index: 2;}
.tl-upper {font-size: 2rem; font-weight: bold; color: #E1251B; width: fit-content; padding: 10px; margin: 0 0 30px; border: 1px solid #E1251B;}
.main .inbox h2 {font-size: 14vw; line-height: 1.4em; font-weight: bold; letter-spacing: 0.1em; color: #ffffff; text-align: left; width: fit-content; margin: 0; }
.main .inbox .sp-box {display: block; overflow: hidden;}
.main .inbox .sp-box img {width: 100%; display: block; margin: 0 0 30px 0;}

.limit-count {display: inline-block;width: 100%;padding: 40px 40px 20px;border-radius: 2px;border: 0.6px solid #ffffff;box-shadow:
  -3px -3px rgb(255, 0, 0), 3px -3px rgb(255, 0, 0),
  3px 3px rgb(255, 0, 0), -3px 3px rgb(255, 0, 0),
  0 0 0.8em rgb(255, 0, 0), 0 0 0.8em rgb(255, 0, 0) inset,
  0 0 0.8em rgb(255, 0, 0), 0 0 0.8em rgb(255, 0, 0) inset,
  0 0 1em rgb(255, 0, 0), 0 0 1em rgb(255, 0, 0);
  position: relative; margin-bottom: 50px;
}
.limit-count p {font-size: 2rem; font-weight: bold; color: #ffffff; margin-bottom: 10px; text-align: center; }
.limit-count p span.tx-vertical {color: #ffffff; font-weight: bold; display: inline-block; writing-mode: vertical-rl; text-orientation: upright; margin-right: 5px; }
.limit-count p span.count-number {color: #e1251b; font-weight: bold; font-size: 5.6rem; padding-right: 10px;}
.limit-count p.tl {width: fit-content; padding: 5px 15px; color: #E1251B; font-weight: bold; font-size: 1.8rem; position: absolute; top: -20px; left: 0; right: 0; margin: auto; background: #ffffff; }
.limit-count p.tl span {font-size: 1.4rem; font-weight: bold; color: #e1251b; display: inline-block; padding: 0 3px;}
.main .inbox .pc-box {display: none;}
.main .inbox .cta-wrap {display: block; width: 100%; }
.main .inbox .cta-wrap a:link, .main .inbox .cta-wrap a:visited { display: block; width: fit-content; padding: 20px 60px; margin: 30px auto 50px;  color: #ffffff;  background: linear-gradient(#E1251B, #7B140F); border-radius: 30px; font-size: 1.8rem; font-weight: bold; }

@media screen and (min-width: 768px) {
  .main .inbox { padding-top: 140px;}
  .main .inbox h2 {font-size: 4.6rem; margin: 0 auto; }
  .tl-upper { margin: 0 auto 30px;}
  .main .inbox h2 br {display: none;}
  .main .inbox .sp-box img {width: 100%;}
  .limit-count {display: block;width: 500px; padding: 40px 20px; margin: 0 auto 80px; border-radius: 2px;border: 1px solid #ffffff;box-shadow:
    -1px -1px rgb(255, 0, 0), 1px -1px rgb(255, 0, 0),
    1px 1px rgb(255, 0, 0), -1px 1px rgb(255, 0, 0),
    0 0 0.6em rgb(255, 0, 0), 0 0 0.6em rgb(255, 0, 0) inset,
    0 0 0.6em rgb(255, 0, 0), 0 0 0.6em rgb(255, 0, 0) inset,
    0 0 1em rgb(255, 0, 0), 0 0 1em rgb(255, 0, 0);
  }

}
@media screen and (min-width: 1024px) {
  .main {background: linear-gradient(110deg, #ffffff 45%, transparent 45%), url('../images/main-back.png') 50% / cover no-repeat;}
  .main .inbox { padding: 140px 0 80px;}
  .main .inbox h2 {font-size: 5.6rem; margin: 0 0 50px; }
  .main .inbox h2 br {display: block;}
  .main .inbox .sp-box {display: none;}
  .main .inbox .pc-box {display: flex; justify-content: space-between; align-items: center; width: 100%; position: relative;}
  .tl-upper {font-size: 2.4rem; margin: 0 0 30px; }
  .main .inbox .pc-box img {width: 50%;}
  .limit-count {width: 350px; padding: 40px 20px 20px; margin: 0 auto 80px;}
}
@media screen and (min-width: 1200px) {
  .main {height: 100vh; background: linear-gradient(120deg, #ffffff 45%, transparent 45%), url('../images/main-back.png') 100% / cover no-repeat;}
  .main .inbox {max-width: 1200px; padding-top: 100px;}
  .main .inbox h2 {font-size: 8rem; line-height: 1.2em; }
  .limit-count {width: 450px; padding: 40px 20px 20px; margin: 0 auto 80px;}
  .main .inbox .cta-wrap {margin-top: -30px; z-index: 3;}
}


/* apy-wrap */
.apy-wrap {background: url('../images/apy-back.png') 0 50%/cover no-repeat;}
.apy-wrap .inbox h2 {font-size: 2.6rem; color: #ffffff; text-align: center; font-weight: bold; margin-bottom: 80px; }
.apy-wrap .inbox img:nth-child(2) {margin-bottom: 80px;}
.apy-wrap .inbox .sp-box {display: block;}
.apy-wrap .inbox .sp-box {width: 100%;}
.apy-wrap .inbox .pc-box {display: none;}
.apy-wrap .inbox p.top {margin-top: 30px;}
.apy-wrap .inbox p {color: #ffffff; line-height: 2em; text-indent: -1.2em; padding-left: 1.2em;}
.apy-wrap .inbox p span {font-size: 1.8rem; color: #ffffff; font-weight: bold;}
@media screen and (min-width: 768px) {
  .apy-wrap .inbox .sp-box {width: 60%; display: block; margin: 0 auto;}
  .apy-wrap .inbox img:nth-child(2) {margin-bottom: 80px;}
}
@media screen and (min-width: 1024px) {
  .apy-wrap .inbox h2 {font-size: 3.6rem; }
  .apy-wrap .inbox .sp-box {display: none;}
  .apy-wrap .inbox .pc-box {display: block;}
  .m-auto {margin: 0 auto 80px;}
}

/* application-flow */
.application-flow {background: #ffffff; position: relative;}
.application-flow .inbox h2 {font-size: 3rem; color: #040000; font-weight: bold; margin-bottom: 50px; }
.application-flow .inbox h2 + img {display: block; width: 100%; margin-bottom: 50px;}
.application-flow .inbox h3 {font-size: 2.6rem; color: #E1251B; text-align: center; font-weight: bold; margin-bottom: 50px; }
.application-flow .inbox .sp-box {display: block; width: 90%; margin: 0 auto 50px;}
.application-flow .inbox .pc-box {display: none;}
.application-flow .inbox .cta-wrap {display: block; width: 100%; }
.application-flow .inbox .cta-wrap a:link, .step-wrap .inbox .cta-wrap a:visited { display: block; width: fit-content; padding: 20px 80px; margin: 30px auto 50px;  color: #ffffff;  background: linear-gradient(#E1251B, #7B140F); border-radius: 30px; font-size: 1.8rem; font-weight: bold; }
@media screen and (min-width: 768px) {
  .application-flow .inbox h2 + img {display: block; width: 600px; margin: 0 auto 80px;}
  .application-flow .inbox .sp-box {width: 50%; margin: 0 auto 80px;}
}
@media screen and (min-width: 1024px) {
  .application-flow .inbox h2 {font-size: 4rem;}
  .application-flow .inbox h3 {font-size: 3.6rem; }
  .application-flow .inbox .sp-box {display: none;}
  .application-flow .inbox .pc-box {display: block; width: 100%; margin: 0 auto 100px;}
}



/* Step */
.step-wrap {background: #F6F6F6; position: relative;}
.step-wrap::before {
  content: "";
  position: absolute;
  top: 0; /* セクションの上に配置 */
  left: 0;
  right: 0;
  margin: auto;
  width: 180px;
  height: 70px; /* 三角形の高さ */
  background: #ffffff; /* 三角形の色 */
  clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
}
.step-wrap .inbox {padding: 120px 20px 80px;}
.step-wrap .inbox h2 {font-size: 2.6rem; color: #E1251B; margin-bottom: 50px;}
.step-wrap .inbox .sp-box {display: block; margin-bottom: 50px; }
.step-wrap .inbox .sp-box img {width: 100% ; display: block; margin: 0 auto;}
.step-wrap .inbox .pc-box {display: none;}
.step-wrap .inbox .cta-wrap {display: block; width: 100%; }
.step-wrap .inbox .cta-wrap a:link, .step-wrap .inbox .cta-wrap a:visited { display: block; width: fit-content; padding: 20px 80px; margin: 30px auto 50px;  color: #ffffff;  background: linear-gradient(#E1251B, #7B140F); border-radius: 30px; font-size: 1.8rem; font-weight: bold; }
@media screen and (min-width: 768px) {
  .step-wrap .inbox h2 { font-size: 3.6rem;}
  .step-wrap .inbox .sp-box {display: none; }
  .step-wrap .inbox .pc-box {display: block; margin-bottom: 50px;}
  .step-wrap .inbox .pc-box img {width: 100% ; display: block; margin: 0 auto;}
}
@media screen and (min-width: 1200px) {
  .step-wrap .inbox {padding: 150px 0 80px;}
  .step-wrap .inbox h2 { font-size: 3.6rem; margin-bottom: 80px;}
  .step-wrap .inbox .pc-box {margin-bottom: 100px;}
}











.floating {
  position: fixed;
  bottom: 20px;
  right: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
}

.floating.visible {
  opacity: 1;
  visibility: visible;
}


/* 追従ボタンのスタイル */
.fixed-apply-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
  display: block;
}

.floating-apply-button {
  display: block;
  padding: 15px;
  background: linear-gradient(#e1251b, #7B140F);
  border-radius: 50px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3);
  transition: all 0.3s ease;
  animation: float-pulse 2s infinite;
}

.floating-apply-button:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(0,0,0,0.4);
}

.floating-apply-button .button-image {
  width: 160px;
  height: auto;
  display: block;
}

@keyframes float-pulse {
  0% {
      box-shadow: 0 4px 20px rgba(225, 37, 27,0.4);
  }
  50% {
      box-shadow: 0 4px 30px rgba(225, 37, 27,0.7);
  }
  100% {
      box-shadow: 0 4px 20px rgba(225, 37, 27,0.4);
  }
}

@media screen and (max-width: 767px) {
  .fixed-apply-button {
      bottom: 15px;
      right: 15px;
  }
  
  .floating-apply-button {
      padding: 12px;
  }
  
  .floating-apply-button .button-image {
      width: 130px;
  }
}

@media screen and (min-width: 1024px) {
  .fixed-apply-button {
      bottom: 30px;
      right: 30px;
  }
  
  .floating-apply-button {
      padding: 18px;
  }
  
  .floating-apply-button .button-image {
      width: 180px;
  }
}


/* 20250409 add  */
.staking-plan {background: #ffffff;}
.staking-plan .inbox h2 {font-size: 2.6rem; color: #040000; margin-bottom: 50px;}
.staking-plan .inbox h2 + p {line-height: 1.8em; text-align: center; margin-bottom: 30px;}
.staking-plan .inbox h2 + p br.sp-none {display: block;}
.staking-plan .inbox .pc-box {display: none;}
.staking-plan .inbox .sp-box {display: block; width: 100%; margin: 0 auto 30px;}
.staking-plan .inbox .cta-wrap {display: block; width: 100%; }
.staking-plan .inbox .cta-wrap a:link, .step-wrap .inbox .cta-wrap a:visited { display: block; width: fit-content; padding: 20px 80px; margin: 30px auto 50px;  color: #ffffff;  background: linear-gradient(#E1251B, #7B140F); border-radius: 30px; font-size: 1.8rem; font-weight: bold; }
@media screen and (min-width: 768px) {
  .staking-plan .inbox h2 { font-size: 3.6rem; margin-bottom: 30px;}
  .staking-plan .inbox h2 + p { margin-bottom: 50px;}
  .staking-plan .inbox h2 + p br.sp-none {display: none;}
  .staking-plan .inbox .pc-box {display: block; width: 100%; margin: 0 auto 30px;}
  .staking-plan .inbox .sp-box {display: none;}
}
@media screen and (min-width: 1024px) {
  .staking-plan .inbox .cta-wrap {margin-top: 50px; }
}
@media screen and (min-width: 1200px) {
  .staking-plan .inbox h2 { font-size: 3.6rem; margin-bottom: 50px;}
}