@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");
.anim {
  backface-visibility: hidden;
  will-change: transform;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.anim--slow {
  animation-duration: 1s !important;
}

.anim--delay {
  animation-delay: 0.6s !important;
}

.anim-fadeIn {
  opacity: 0;
}
.anim-fadeIn.onAnim {
  animation: fadeIn 1s ease 0s 1 alternate forwards;
}

@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
.anim-fadeUp {
  opacity: 0;
}
.anim-fadeUp.onAnim {
  animation: fadeUp 1s ease 0s 1 alternate forwards;
}

@keyframes fadeLeft {
  0% {
    opacity: 0;
    transform: translateX(100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
.anim-fadeLeft {
  opacity: 0;
}
.anim-fadeLeft.onAnim {
  animation: fadeLeft 1s ease 0s 1 alternate forwards;
}

@keyframes fadeRight {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
.anim-fadeRight {
  opacity: 0;
}
.anim-fadeRight.onAnim {
  animation: fadeRight 1s ease 0s 1 alternate forwards;
}

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

* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}

:-moz-placeholder-shown {
  color: #ccc;
}

:placeholder-shown {
  color: #ccc;
}

::-webkit-input-placeholder {
  color: #ccc;
}

a {
  color: #000;
}
a:hover {
  text-decoration: underline;
}

html {
  font-size: 14px;
}

body {
  font-size: 14px;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, sans-serif;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0.05em;
  color: #000;
  overscroll-behavior: none;
  background-color: #FFFDDB;
}
body.hide {
  overflow: hidden;
}
body.page-news {
  background-color: #fff;
}
body.page-action {
  background-color: #40B620;
}
body.page-action .pageLogo {
  filter: invert(1);
}
body.page-action .commonHeading {
  color: #fff;
}
body.page-action .commonHeading__main:before {
  background-color: #fff;
}
body figure {
  margin: 0;
}

.montserrat {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;
}

.o_sp {
  display: none !important;
}

.o_sp2 {
  display: none !important;
}

.hiddenBox {
  overflow: hidden;
}

.textRight {
  text-align: right;
}

@media all and (max-width: 640px) {
  .o_sp {
    display: block !important;
  }
}
@media all and (max-width: 1024px) {
  .o_pc {
    display: none !important;
  }
}

@media all and (max-width: 428px) {
  html {
    font-size: 3.2704vw;
  }
  body {
    font-size: 3.2704vw;
  }
}
@media all and (max-width: 640px) {
  .o_sp2 {
    display: block !important;
  }
  .no_sp {
    display: none !important;
  }
}
.inner {
  max-width: 1166px;
  padding: 0 50px;
  margin: 0 auto;
}
.inner--large {
  max-width: 1266px;
}
@media all and (max-width: 1024px) {
  .inner {
    padding: 0 30px;
  }
}
@media all and (max-width: 428px) {
  .inner {
    padding: 0 7.008vw;
  }
}

.wrapBar {
  position: fixed;
  z-index: 1200;
  background-color: #40B620;
}
@media all and (max-width: 640px) {
  .wrapBar.white {
    background-color: #fff;
  }
  .wrapBar.white.wrapBar__top:before {
    background: radial-gradient(at bottom left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 39%, rgb(255, 255, 255) 39.1%, rgb(255, 255, 255) 100%);
  }
  .wrapBar.white.wrapBar__top:after {
    background: radial-gradient(at bottom right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 39%, rgb(255, 255, 255) 39.1%, rgb(255, 255, 255) 100%);
  }
  .wrapBar.white.wrapBar__bottom:before {
    background: radial-gradient(at top left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 39%, rgb(255, 255, 255) 39.1%, rgb(255, 255, 255) 100%);
  }
  .wrapBar.white.wrapBar__bottom:after {
    background: radial-gradient(at top right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 39%, rgb(255, 255, 255) 39.1%, rgb(255, 255, 255) 100%);
  }
}
.wrapBar__top {
  width: 100%;
  top: 0;
  left: 0;
  height: 10px;
}
.wrapBar__top:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 22px;
  height: 22px;
  background: radial-gradient(at bottom left, rgba(64, 182, 32, 0) 0%, rgba(64, 182, 32, 0) 39%, rgb(64, 182, 32) 39.1%, rgb(64, 182, 32) 100%);
}
.wrapBar__top:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  background: radial-gradient(at bottom right, rgba(64, 182, 32, 0) 0%, rgba(64, 182, 32, 0) 39%, rgb(64, 182, 32) 39.1%, rgb(64, 182, 32) 100%);
}
@media all and (max-width: 428px) {
  .wrapBar__top {
    height: 2.336vw;
  }
  .wrapBar__top:before {
    width: 5.1392vw;
    height: 5.1392vw;
  }
  .wrapBar__top:after {
    width: 5.1392vw;
    height: 5.1392vw;
  }
}
.wrapBar__left {
  height: 100%;
  height: 100lvh;
  width: 10px;
  top: 0;
  right: 0;
}
@media all and (max-width: 428px) {
  .wrapBar__left {
    width: 2.336vw;
  }
}
.wrapBar__bottom {
  width: 100%;
  bottom: 0;
  right: 0;
  height: 10px;
}
.wrapBar__bottom:before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 22px;
  height: 22px;
  background: radial-gradient(at top left, rgba(64, 182, 32, 0) 0%, rgba(64, 182, 32, 0) 39%, rgb(64, 182, 32) 39.1%, rgb(64, 182, 32) 100%);
}
.wrapBar__bottom:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 22px;
  height: 22px;
  background: radial-gradient(at top right, rgba(64, 182, 32, 0) 0%, rgba(64, 182, 32, 0) 39%, rgb(64, 182, 32) 39.1%, rgb(64, 182, 32) 100%);
}
@media all and (max-width: 428px) {
  .wrapBar__bottom {
    height: 2.336vw;
  }
  .wrapBar__bottom:before {
    width: 5.1392vw;
    height: 5.1392vw;
  }
  .wrapBar__bottom:after {
    width: 5.1392vw;
    height: 5.1392vw;
  }
}
.wrapBar__right {
  height: 100%;
  height: 100lvh;
  width: 10px;
  bottom: 0;
  left: 0;
}
@media all and (max-width: 428px) {
  .wrapBar__right {
    width: 2.336vw;
  }
}

.commonLink {
  min-height: 4.25em;
  background-color: #fff;
  color: #40B620;
  display: flex;
  align-items: center;
  position: relative;
  padding: 0.8em 1em;
  width: 220px;
  border: 1px solid #40B620;
  border-radius: 4em;
  transition: all 0.3s ease 0s;
}
.commonLink:hover {
  text-decoration: none;
}
.commonLink:hover {
  background-color: #40B620;
  color: #fff;
  border-color: #fff;
}
.commonLink:hover path {
  stroke: #fff;
}
.commonLink:hover .commonLink__arrow {
  left: calc(100% - 20px);
  translate: -100% -50%;
}
.commonLink:hover .commonLink__text {
  right: calc(100% - 20px);
  translate: 100% -50%;
}
.commonLink__arrow {
  position: absolute;
  width: 17px;
  height: 17px;
  top: 50%;
  left: 20px;
  right: auto;
  translate: 0 -50%;
  transition: all 0.3s ease 0s;
  display: block;
}
.commonLink__arrow:hover {
  text-decoration: none;
}
.commonLink__arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}
.commonLink__arrow svg g {
  display: block;
  width: 100%;
  height: 100%;
}
.commonLink__arrow svg path {
  transition: all 0.3s ease 0s;
  display: block;
  width: 100%;
  height: 100%;
}
.commonLink__arrow svg path:hover {
  text-decoration: none;
}
.commonLink__text {
  transition: translate 0.3s ease, right 0.3s ease, left 0.3s ease;
  position: absolute;
  right: 20px;
  max-width: calc(100% - 80px);
  top: 50%;
  translate: 0 -50%;
  text-align: right;
  white-space: nowrap;
}
.commonLink--reverse .commonLink__arrow {
  left: auto !important;
  right: 20px;
  rotate: 180deg;
}
.commonLink--reverse .commonLink__text {
  text-align: left;
  right: auto !important;
  left: 20px !important;
}
.commonLink--reverse:hover .commonLink__arrow {
  right: calc(100% - 20px);
  translate: 100% -50%;
}
.commonLink--reverse:hover .commonLink__text {
  left: calc(100% - 20px) !important;
  translate: -100% -50%;
}

@media all and (max-width: 640px) {
  .navWrap.unload .navBT {
    opacity: 0;
  }
}
@media all and (min-width: 641px) {
  .navWrap {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 999;
    padding-top: 30px;
    padding-right: 30px;
    height: 80px;
    width: 80px;
    transition: width 0s 0.4s, translate 0.8s 2s;
  }
  .navWrap.unload {
    translate: 100% 0;
  }
  .navWrap:hover {
    height: auto;
    width: 200px;
    transition: width 0s 0s;
  }
}
@media all and (min-width: 641px) and (min-width: 641px) {
  .navWrap:hover .gNav {
    translate: 0 0;
  }
  .navWrap:hover .navBT {
    background-color: #40B620;
  }
  .navWrap:hover .navBT .bar:nth-child(1), .navWrap:hover .navBT .bar:nth-child(3) {
    scale: 0.7 1;
  }
  .navWrap:hover .navBT .bar:nth-child(2) {
    scale: 1 1;
  }
}

.navBT {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  margin-left: auto;
  margin-bottom: 10px;
  top: 30px;
  right: 30px;
  z-index: 999;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 1px solid #fff;
  background-color: #000;
  background-image: none;
  cursor: pointer;
  transition: background-color 0.3s, opacity 0.8s 2s;
}
@media all and (max-width: 640px) {
  .navBT {
    position: fixed;
    border-color: transparent;
  }
}
@media all and (max-width: 428px) {
  .navBT {
    top: 7.008vw;
    right: 7.008vw;
  }
}
.navBT .bar {
  height: 1px;
  width: 45%;
  background-color: #fff;
  transform-origin: left;
  transition: all 0.3s ease 0s;
}
.navBT .bar:hover {
  text-decoration: none;
}
.navBT .bar:nth-child(2) {
  scale: 0.7 1;
}
@media all and (max-width: 640px) {
  .navBT .bar:nth-child(1), .navBT .bar:nth-child(3) {
    transform-origin: center;
  }
}
@media all and (max-width: 640px) {
  .navBT.active .bar:nth-child(1) {
    rotate: 45deg;
    translate: 0 7px;
    scale: 1.2 1;
  }
  .navBT.active .bar:nth-child(2) {
    scale: 0 1;
  }
  .navBT.active .bar:nth-child(3) {
    rotate: -45deg;
    translate: 0 -7px;
    scale: 1.2 1;
  }
}
.gNav {
  position: relative;
  right: -10px;
  z-index: 990;
  transition: translate 0.4s;
  translate: 130% 0;
}
@media all and (max-width: 640px) {
  .gNav {
    position: fixed;
    width: 100%;
    height: 100svh;
    background-color: #40B620;
    top: 0;
    right: 0;
    opacity: 0;
    transition: translate 0s 0.4s, opacity 0.4s 0s;
  }
}
@media all and (max-width: 640px) {
  .gNav.active {
    opacity: 1;
    translate: 0 0;
    transition: translate 0s 0s, opacity 0.4s 0s;
  }
}
@media all and (max-width: 640px) {
  .gNav__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    overflow: auto;
  }
}
@media all and (max-width: 640px) {
  .gNav__list {
    margin: auto;
    padding: 60px 7.008vw;
    display: flex;
    flex-direction: column;
    gap: 1em;
  }
}
.gNav__item > a {
  display: block;
  text-align: right;
  padding: 0.5em 1em;
  transition: all 0.3s ease 0s;
  position: relative;
  line-height: 1.4;
}
.gNav__item > a:hover {
  text-decoration: none;
}
@media all and (max-width: 640px) {
  .gNav__item > a {
    font-size: 6.0736vw;
    color: #fff;
    text-align: left;
    letter-spacing: 0.1em;
  }
}
.gNav__item > a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 5px;
  height: 5px;
  right: 0;
  translate: 0 -50%;
  transition: all 0.3s ease 0s;
  background-color: #000;
  border-radius: 50%;
  scale: 0;
}
.gNav__item > a:after:hover {
  text-decoration: none;
}
@media all and (max-width: 640px) {
  .gNav__item > a:after {
    right: auto;
    left: 0;
    background-color: #fff;
    scale: 1;
    width: 2.336vw;
    height: 2.336vw;
  }
}
@media all and (min-width: 641px) {
  .gNav__item > a:hover {
    padding-right: 1.5em;
  }
  .gNav__item > a:hover:after {
    scale: 1;
  }
}
.gNav__child {
  display: none;
}
@media all and (max-width: 640px) {
  .gNav__child {
    padding-left: 6.0736vw;
    display: block;
  }
  .gNav__child__item {
    font-size: 1rem;
  }
  .gNav__child__item a {
    color: #fff;
    display: flex;
    align-items: center;
    letter-spacing: 0.05em;
  }
  .gNav__child__item a svg {
    display: block;
    width: 100%;
  }
  .gNav__child__item a .arrow {
    width: 3.88944vw;
    margin-right: 1.25em;
  }
}

.mainFooter {
  background-color: #242424;
  color: #fff;
  padding: 45px 0 50px;
  position: relative;
}
@media all and (max-width: 640px) {
  .mainFooter {
    padding: 14.016vw 0 14.016vw;
  }
}
.mainFooter a {
  color: #fff;
}
.mainFooter__toTop {
  position: absolute;
  right: 30px;
  top: 0;
  translate: 0 -50%;
  background-color: #40B620;
  width: 46px;
  height: 46px;
  display: block;
  background-image: url(../images/ic_arrow.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 36%;
  rotate: -90deg;
  border-radius: 50%;
}
@media all and (max-width: 640px) {
  .mainFooter__toTop {
    right: 50%;
    translate: 50% -50%;
    width: 10.7456vw;
    height: 10.7456vw;
  }
}
.mainFooter__inner {
  max-width: 1166px;
  padding: 0 50px;
}
.mainFooter__main {
  display: flex;
  align-items: center;
  margin-bottom: 40px;
}
.mainFooter__logo {
  width: 238px;
  margin-right: 50px;
}
.mainFooter__info {
  letter-spacing: 0.1em;
}
.mainFooter__info p {
  margin-bottom: 0.5em;
}
.mainFooter__mail {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}
.mainFooter__mail a {
  margin-left: 1.25em;
  display: flex;
  align-items: center;
}
.mainFooter__mail a svg {
  display: block;
  margin-right: 0.5em;
}
.mainFooter__credit {
  font-size: 10px;
  letter-spacing: 0.1em;
}
@media all and (max-width: 1024px) {
  .mainFooter__inner {
    padding: 0 30px;
  }
}
@media all and (max-width: 640px) {
  .mainFooter__main {
    flex-direction: column;
    margin-bottom: 20px;
  }
  .mainFooter__logo {
    margin-right: 0;
    margin-bottom: 22px;
  }
  .mainFooter__info {
    text-align: center;
    padding: 20px 0;
    border-top: 1px solid #707070;
    border-bottom: 1px solid #707070;
    font-size: min(14px,3vw);
  }
  .mainFooter__credit {
    font-size: 2.8032vw;
  }
}

.commonHeading {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  font-size: 35px;
}
@media all and (max-width: 640px) {
  .commonHeading {
    flex-direction: column;
    align-items: flex-start;
  }
}
.commonHeading__main {
  display: flex;
  align-items: center;
  font-size: 35px;
  margin-right: 0.5em;
  line-height: 1.1;
  letter-spacing: 0.1em;
}
.commonHeading__main:before {
  content: "";
  width: 0.34em;
  height: 0.34em;
  margin-right: 0.6em;
  border-radius: 50%;
  background-color: #40B620;
  display: block;
}
@media all and (max-width: 640px) {
  .commonHeading__main {
    font-size: 8.176vw;
  }
}
.commonHeading__sub {
  font-size: 14px;
  line-height: 1.1;
  translate: 0 25%;
  font-weight: bold;
  transition: translate 0.4s ease 0.4s;
  opacity: 0;
  translate: -1em 25%;
}
@media all and (max-width: 640px) {
  .commonHeading__sub {
    font-size: 3.2704vw;
    padding-left: 2.2em;
    margin-top: 0.3em;
  }
}
.commonHeading.onAnim .commonHeading__sub {
  opacity: 1;
  translate: 0 25%;
}

.color-white {
  color: #fff;
}

.color-key {
  color: #40B620;
}

.centerHeading {
  display: flex;
  font-size: 35px;
  align-items: center;
  flex-direction: column;
}
.centerHeading__main {
  display: flex;
  align-items: center;
  font-size: 35px;
  line-height: 1.1;
  letter-spacing: 0.1em;
}
@media all and (max-width: 640px) {
  .centerHeading__main {
    font-size: 8.176vw;
  }
}
.centerHeading__sub {
  font-size: 14px;
  line-height: 1.1;
  font-weight: bold;
  margin-top: 0.8em;
}
@media all and (max-width: 640px) {
  .centerHeading__sub {
    font-size: 3.2704vw;
  }
}

@keyframes rotate {
  0% {
    rotate: 0deg;
  }
  100% {
    rotate: 360deg;
  }
}
@keyframes scrollX {
  0% {
    translate: 0 0;
  }
  100% {
    translate: -50% 0;
  }
}
#loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1100;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#loading img {
  width: 248px;
  transition: opacity 1s 1s;
  opacity: 0;
}
@media all and (max-width: 640px) {
  #loading img {
    width: 57.9328vw;
  }
}
#loading.loaded img {
  opacity: 1;
}

.fv {
  position: relative;
  z-index: 5;
  min-height: 100vh;
  min-height: calc(var(--vh, 1vh) * 100);
  display: flex;
  flex-direction: column-reverse;
  background-color: #fff;
  overflow: hidden;
  padding: 9px;
}
@media all and (max-width: 1024px) {
  .fv {
    min-height: 100vh;
    min-height: 100svh;
  }
}
@media all and (max-width: 428px) {
  .fv {
    padding: 2.1024vw;
  }
}
.fv.loaded .fv__person__inner > div {
  opacity: 1;
}
.fv.loaded .fv__lead__span:before {
  scale: 1 1;
}
.fv.loaded .fv__lead__span span {
  opacity: 1;
}
.fv.loaded .fv__link {
  translate: 0;
  opacity: 1;
}
.fv.loaded .fv__header {
  translate: 0;
}
.fv.loaded .fv__logo {
  opacity: 1;
}
.fv__header {
  transition: translate 0.4s 1.6s;
  translate: 0 120%;
}
.fv__header img {
  width: 100%;
}
@media all and (min-width: 641px) {
  .fv__header span {
    display: none;
  }
}
@media all and (max-width: 640px) {
  .fv__header {
    overflow: hidden;
  }
  .fv__header__inner {
    width: 600%;
    display: flex;
    animation: scrollX 12s infinite linear;
  }
  .fv__header__logo {
    width: 50%;
    padding: 0 1em;
  }
}
.fv__upper {
  flex: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  padding-top: 80px;
  margin-bottom: 20px;
}
@media all and (max-width: 640px) {
  .fv__upper {
    padding-top: 120px;
    padding-top: min(120px,30.368vw);
    height: 100%;
    margin-bottom: 7.008vw;
  }
}
.fv__upper__inner {
  width: 100%;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
@media all and (max-width: 640px) {
  .fv__upper__inner {
    flex-direction: column;
    height: 100%;
    flex: 1;
  }
}
.fv__person {
  width: 100%;
  position: relative;
}
@media all and (max-width: 640px) {
  .fv__person {
    order: 2;
    margin-top: auto;
  }
}
.fv__person__inner {
  width: 71.74%;
  margin: 0 auto;
  position: relative;
  display: flex;
  justify-content: center;
}
.fv__person__inner > div {
  position: absolute;
  transition: opacity 0.4s;
  opacity: 0;
}
@media all and (max-width: 640px) {
  .fv__person__inner {
    width: calc(100% - 1.168vw);
    align-items: center;
    margin-bottom: 2.1024vw;
    max-width: 45vh;
  }
}
.fv__person img {
  width: 100%;
}
.fv__person img {
  display: block;
}
.fv__person__bg {
  width: 119%;
  left: 50%;
  translate: -50% 0;
  top: 13%;
  transition-delay: 1.6s !important;
}
@media all and (max-width: 640px) {
  .fv__person__bg {
    width: 200%;
    top: 4%;
  }
}
.fv__person .person1 {
  width: 24.49%;
  z-index: 30;
  position: relative;
  translate: 7% 0;
  transition-delay: 0;
}
@media all and (max-width: 640px) {
  .fv__person .person1 {
    width: 58%;
    translate: 0 0;
  }
}
.fv__person .person2 {
  z-index: 25;
  width: 20.5%;
  bottom: 10%;
  left: 24%;
  transition-delay: 0.2s;
}
@media all and (max-width: 640px) {
  .fv__person .person2 {
    width: 25.5%;
    bottom: 36%;
    left: 0;
  }
}
.fv__person .person3 {
  z-index: 25;
  width: 14.285%;
  bottom: 13.5%;
  right: 24%;
  transition-delay: 0.4s;
}
@media all and (max-width: 640px) {
  .fv__person .person3 {
    width: 19.5%;
    bottom: 42%;
    right: 0;
  }
}
.fv__person .person4 {
  z-index: 15;
  width: 16%;
  top: 9%;
  left: 15%;
  transition-delay: 0.6s;
}
@media all and (max-width: 640px) {
  .fv__person .person4 {
    width: 21%;
    top: 4.5%;
    left: 10.5%;
  }
}
.fv__person .person5 {
  z-index: 15;
  width: 13.8%;
  top: 11.5%;
  right: 13.4%;
  transition-delay: 0.8s;
}
@media all and (max-width: 640px) {
  .fv__person .person5 {
    width: 18.5%;
    top: 4.5%;
    right: 12%;
  }
}
.fv__person .person6 {
  z-index: 20;
  width: 24.8%;
  bottom: 14%;
  left: 0;
  transition-delay: 1s;
}
@media all and (max-width: 640px) {
  .fv__person .person6 {
    z-index: 28;
    width: 33.5%;
    bottom: 22.5%;
    left: 3.5%;
  }
}
.fv__person .person7 {
  z-index: 20;
  width: 18.8%;
  bottom: 13.5%;
  right: 0;
  transition-delay: 1.2s;
}
@media all and (max-width: 640px) {
  .fv__person .person7 {
    z-index: 28;
    width: 24.5%;
    bottom: 19.9%;
    right: 8.8%;
  }
}
.fv__lead {
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.6;
  gap: 0.4em;
  margin-top: -6vw;
  margin-left: 36px;
}
@media all and (max-width: 1024px) {
  .fv__lead {
    margin-left: 26px;
    margin-top: -3vw;
  }
}
@media all and (max-width: 640px) {
  .fv__lead {
    order: 1;
    margin-left: 7.008vw;
    margin-right: auto;
    font-size: 4.2048vw;
    margin-bottom: 4.672vw;
  }
}
.fv__lead__span {
  padding: 0.1em 0.3em;
  position: relative;
}
.fv__lead__span:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #40B620;
  transform-origin: left center;
  transition: scale 0.4s 1.4s;
  scale: 0 1;
}
.fv__lead__span span {
  position: relative;
  z-index: 5;
  transition: opacity 0.4s 1.6s;
  opacity: 0;
}
.fv__link {
  width: 150px;
  height: 150px;
  position: relative;
  display: flex;
  padding: 15px;
  margin-top: -6vw;
  margin-right: 36px;
  transition: opacity 0.4s 1.8s, translate 0.4s 1.8s;
  translate: 0 2em;
  opacity: 0;
}
@media all and (max-width: 1024px) {
  .fv__link {
    margin-top: -3vw;
    margin-right: 26px;
  }
}
@media all and (max-width: 640px) {
  .fv__link {
    padding: 0;
    width: calc(100% - 14.016vw);
    height: auto;
    margin: 0 auto;
    order: 3;
  }
  .fv__link:before {
    display: none;
  }
}
.fv__link:before {
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/top/fv_link_bg.svg);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all 0.3s ease 0s;
  animation: rotate 20s infinite linear;
}
.fv__link:before:hover {
  text-decoration: none;
}
.fv__link__main {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: bold;
  border-radius: 50%;
  background: linear-gradient(45deg, #008165 0%, #f6ef53 96.18%, #fff352 100%);
  font-size: 12px;
  letter-spacing: 0;
  position: relative;
  z-index: 4;
}
@media all and (max-width: 640px) {
  .fv__link__main {
    border-radius: 0;
    font-size: 3.7376vw;
    flex-direction: row;
    gap: 0.3em;
    padding: 0.8em;
    background: linear-gradient(45deg, #3E9D60 0%, #86BD5B 100%);
    border-radius: 4em;
  }
}
.fv__link:hover {
  text-decoration: none;
}
.fv__link:hover:before {
  scale: 1.1;
}
.fv__logo {
  width: 128px;
  position: absolute;
  z-index: 5;
  top: 42px;
  left: 48px;
  transition: opacity 0.8s 2s;
  opacity: 0;
}
@media all and (max-width: 640px) {
  .fv__logo {
    width: 128px;
    width: min(128px,29.9008vw);
    top: 30px;
    left: 30px;
  }
}
@media all and (max-width: 428px) {
  .fv__logo {
    top: 7.008vw;
    left: 7.008vw;
  }
}

.topWrap1 {
  position: relative;
  z-index: 10;
  background: linear-gradient(to top, #fefcdc 0%, #fff 100%);
}
.topWrap1:before {
  content: "";
  background-color: #40B620;
  width: 100%;
  position: absolute;
  height: 164px;
  bottom: 0;
  left: 0;
}
@media all and (max-width: 640px) {
  .topWrap1:before {
    height: 186.88vw;
  }
}

.rankingSection {
  padding: 180px 0 120px;
  background-color: #fff;
}
@media all and (max-width: 640px) {
  .rankingSection {
    padding-top: 9.344vw;
    padding-bottom: 11.68vw;
  }
}
.rankingSection__container {
  border-radius: 10px;
  border: 1px solid #40B620;
  padding: 50px;
  background: linear-gradient(to top, #fefcdc 0%, #fff 100%);
}
@media all and (max-width: 1024px) {
  .rankingSection__container {
    padding: 30px;
  }
}
@media all and (max-width: 640px) {
  .rankingSection__container {
    padding: 4.672vw 7.008vw;
    border-radius: 2.336vw;
  }
}
.rankingSection__heading {
  margin-bottom: 60px;
}
@media all and (max-width: 640px) {
  .rankingSection__heading {
    margin-bottom: 7.008vw;
  }
}
.rankingSection__lead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 60px;
}
@media all and (max-width: 640px) {
  .rankingSection__lead {
    margin-bottom: 14.016vw;
    flex-direction: column;
    align-items: center;
    gap: 7.008vw;
  }
}
.rankingSection__lead__videoWrap {
  width: 100%;
}
@media all and (min-width: 641px) {
  .rankingSection__lead__videoWrap {
    width: 40%;
  }
}
.rankingSection__lead__video {
  position: relative;
  padding-top: 56.25%;
  overflow: hidden;
  border-radius: 10px;
}
@media all and (max-width: 640px) {
  .rankingSection__lead__video {
    border-radius: 2.336vw;
  }
}
.rankingSection__lead__video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.rankingSection__lead__content {
  font-weight: bold;
}
@media all and (min-width: 641px) {
  .rankingSection__lead__content {
    width: 57%;
  }
}
.rankingSection__lead__text {
  font-size: 17px;
  font-size: 17px;
  font-size: min(17px,1.54176vw);
  line-height: 2;
}
@media all and (max-width: 640px) {
  .rankingSection__lead__text {
    font-size: 3.9712vw;
    text-align: center;
  }
}
.rankingSection__lead__text sup {
  font-size: 70%;
  vertical-align: top;
  position: relative;
  top: -0.1em;
}
.rankingSection__lead__caption {
  margin-top: 1.5em;
}
.rankingSection__lead__caption sup {
  font-size: 70%;
  vertical-align: top;
  position: relative;
  top: 0.3em;
}
@media all and (max-width: 640px) {
  .rankingSection__lead__caption {
    text-align: center;
  }
}
.rankingSection__ranking__heading {
  display: flex;
  align-items: center;
  flex-direction: column;
  font-size: 35px;
  line-height: 1.1;
  letter-spacing: 0.1em;
}
.rankingSection__ranking__heading:before {
  content: "";
  width: 0.34em;
  height: 0.34em;
  margin-bottom: 0.4em;
  border-radius: 50%;
  background-color: #40B620;
  display: block;
}
@media all and (max-width: 640px) {
  .rankingSection__ranking__heading {
    font-size: 8.176vw;
  }
}
.rankingSection__rule {
  margin-top: 10px;
  border: 1px solid #40B620;
  background-color: #fff;
  padding: 30px 40px;
  border-radius: 0 0 10px 10px;
  font-weight: bold;
  color: #40B620;
}
@media all and (min-width: 641px) {
  .rankingSection__rule {
    display: flex;
    align-items: flex-start;
  }
}
@media all and (max-width: 640px) {
  .rankingSection__rule {
    padding: 5.6064vw 4.672vw;
    border-radius: 0 0 2.336vw 2.336vw;
  }
}
.rankingSection__rule__heading {
  font-size: 1.75rem;
  margin-right: 2em;
  flex-shrink: 0;
}
@media all and (max-width: 640px) {
  .rankingSection__rule__heading {
    margin-right: 0;
    margin-bottom: 0.4em;
  }
}
.rankingSection__rule__list {
  font-size: 1.1em;
  margin-bottom: 0.5em;
}
.rankingSection__flow {
  margin-top: 80px;
}
@media all and (max-width: 640px) {
  .rankingSection__flow {
    margin-top: 14.016vw;
  }
}
.rankingSection__flow__heading {
  font-size: 28px;
  display: flex;
  align-items: center;
  gap: 0.5em;
  font-weight: bold;
  margin-bottom: 1em;
}
.rankingSection__flow__heading:before {
  content: "";
  width: 0.4em;
  height: 0.4em;
  background-color: #40B620;
  border-radius: 50%;
}
@media all and (max-width: 640px) {
  .rankingSection__flow__heading {
    font-size: 6.5408vw;
  }
}
.rankingSection__flow__list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
@media all and (min-width: 1025px) {
  .rankingSection__flow__list {
    flex-direction: row;
    padding-left: 30px;
    justify-content: space-between;
  }
}
@media all and (max-width: 1024px) {
  .rankingSection__flow__list {
    max-width: 640px;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
  }
}
@media all and (max-width: 640px) {
  .rankingSection__flow__list {
    max-width: 100%;
    gap: 3rem;
  }
}
@media all and (min-width: 1025px) {
  .rankingSection__flow__list__item:nth-child(1) {
    width: 30%;
  }
  .rankingSection__flow__list__item:nth-child(2) {
    width: 65%;
  }
}
@media all and (max-width: 1024px) {
  .rankingSection__flow__list__item:nth-child(1) {
    max-width: 360px;
  }
}
.rankingSection__flow__list__heading {
  font-weight: bold;
  font-size: 1.325em;
}
.rankingSection__flow__list__lead {
  font-weight: bold;
  font-size: 1.125em;
}
.rankingSection__flow__list__caption {
  font-weight: bold;
  font-size: 0.875em;
}
@media all and (max-width: 640px) {
  .rankingSection__flow__list__caption {
    margin-top: 1em;
  }
}
.rankingSection__flow__list__img {
  margin: 1em 0 2em;
}
.rankingSection__flow__list__bt {
  text-align: center;
  color: #fff;
  padding: 1em;
  background-color: #40B620;
  display: flex;
  justify-content: center;
  border-radius: 4em;
  transition: opacity 0.3s ease 0s;
}
@media (hover: hover) {
  .rankingSection__flow__list__bt:hover {
    opacity: 0.8;
    text-decoration: none;
  }
}
.rankingSection__flow__quest {
  margin-top: 0.5em;
}
@media all and (max-width: 640px) {
  .rankingSection__flow__quest {
    margin-top: 1em;
  }
}
.rankingSection__flow__quest__heading {
  display: flex;
  align-items: center;
  color: #40B620;
  margin-bottom: 0.5em;
}
.rankingSection__flow__quest__heading span {
  white-space: nowrap;
  flex-shrink: 0;
  font-weight: bold;
  padding-right: 0.5em;
  font-size: 1.2em;
}
.rankingSection__flow__quest__heading:after {
  content: "";
  width: 100%;
  height: 1px;
  background-color: #40B620;
}
.rankingSection__flow__quest__list {
  display: grid;
  gap: 1em;
}
@media all and (min-width: 641px) {
  .rankingSection__flow__quest__list {
    grid-template-columns: 1fr 1fr;
    gap: 2em;
  }
}
.rankingSection__flow__quest__item {
  border-radius: 10px;
  background-color: #fff;
  border: 1px solid #40B620;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
@media all and (max-width: 640px) {
  .rankingSection__flow__quest__item {
    border-radius: 2.336vw;
  }
}
.rankingSection__flow__quest__heading2 {
  color: #fff;
  background-color: #40B620;
  text-align: center;
  padding: 0.75em;
}
.rankingSection__flow__quest__content {
  padding: 0.5em 0.5em 0.75em;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}
.rankingSection__flow__quest__lead {
  font-weight: bold;
}
.rankingSection__flow__quest__caption {
  font-size: 10px;
  letter-spacing: 0;
  text-align: center;
  line-height: 1.6;
}
.rankingSection__flow__quest .points {
  display: flex;
  justify-content: center;
  gap: 1em;
  margin-top: 0.5em;
}
@media all and (max-width: 640px) {
  .rankingSection__flow__quest .points {
    margin-top: 1em;
  }
}
.rankingSection__flow__quest .points .item {
  display: flex;
  align-items: center;
  color: #40B620;
  gap: 0.3em;
  font-weight: bold;
}
@media all and (max-width: 640px) {
  .rankingSection__flow__quest .points .item {
    gap: 0.75em;
  }
}
.rankingSection__flow__quest .points .item dt {
  padding: 0.5em 1em;
  border: 1px solid #40B620;
  border-radius: 4em;
  line-height: 1rem;
  text-align: center;
}
.rankingSection__flow__quest .points .item dd {
  font-family: "Montserrat", sans-serif;
  font-weight: bold;
}
.rankingSection__flow__quest .points .item dd.large {
  font-size: 1.3em;
}

.rankingNav {
  margin-top: 30px;
}
@media all and (max-width: 640px) {
  .rankingNav {
    margin-top: 9.344vw;
    border-radius: 9.344vw;
    height: 18.688vw;
    overflow: hidden;
    border: 1px solid #40B620;
    transition: all 0.3s ease 0s;
  }
  .rankingNav:hover {
    text-decoration: none;
  }
  .rankingNav.active {
    height: 56.064vw;
  }
}
.rankingNav .wrap {
  display: flex;
  gap: 16px;
}
@media all and (max-width: 640px) {
  .rankingNav .wrap {
    display: flex;
    flex-direction: column;
    gap: 0;
    height: 56.064vw;
  }
}
.rankingNav.active .button.current:after {
  rotate: 180deg;
}
.rankingNav .button {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  text-align: center;
  flex-direction: column;
  border: 1px solid #40B620;
  flex-shrink: 0;
  background-image: none;
  background-color: #fff;
  transition: all 0.3s ease 0s;
  box-sizing: border-box;
  color: #40B620;
  font-weight: bold;
  border: 0;
  border-top: 1px solid #40B620;
  order: 1;
  padding: 1em 0.5em 1.2em;
  margin: 0;
  gap: 0.4em;
}
.rankingNav .button:hover {
  text-decoration: none;
}
@media all and (min-width: 641px) {
  .rankingNav .button {
    border-radius: 10em;
    border: 1px solid #40B620;
    flex: 1;
  }
}
@media all and (max-width: 640px) {
  .rankingNav .button {
    height: 9.344vw;
    flex-direction: row;
    justify-content: center;
    width: 100%;
  }
}
.rankingNav .button.current {
  background-color: #40B620;
  color: #fff;
}
@media all and (max-width: 640px) {
  .rankingNav .button.current {
    border-top: 0;
    flex-direction: column;
    height: 18.688vw;
    order: 0;
    position: relative;
  }
  .rankingNav .button.current:after {
    content: "";
    width: 4.672vw;
    height: 4.672vw;
    border: 0.2336vw solid #fff;
    border-radius: 50%;
    position: absolute;
    right: 4.672vw;
    top: 50%;
    translate: 0 -50%;
    background-image: url(../images/ic_arrow2.svg);
    background-size: 1.8688vw;
    background-repeat: no-repeat;
    background-position: center center;
    transition: all 0.3s ease 0s;
  }
  .rankingNav .button.current:after:hover {
    text-decoration: none;
  }
}
.rankingNav .button strong {
  font-size: 16px;
  letter-spacing: 0.1em;
}
@media all and (max-width: 640px) {
  .rankingNav .button strong {
    font-size: 3.7376vw;
  }
}
.rankingNav .button span {
  font-size: 10px;
  letter-spacing: 0.15em;
}
@media all and (max-width: 640px) {
  .rankingNav .button span {
    font-size: 2.8032vw;
    width: 15.5em;
    text-align: center;
  }
}

#rankingWrap {
  margin-top: 30px;
}
@media all and (max-width: 640px) {
  #rankingWrap {
    margin-top: 4.672vw;
  }
}
#rankingWrap .content {
  display: none;
}
#rankingWrap .content .current {
  display: block;
  animation: fadeIn 0.5s ease 0s 1 alternate forwards;
}
#rankingWrap .comingsoon {
  text-align: center;
  font-size: 1.25em;
  font-weight: bold;
  padding: 4em 0;
  color: #999;
}
#rankingWrap .table {
  overflow: hidden;
  border-radius: 0.5125rem 0.5125rem 0 0;
  width: 100%;
}
#rankingWrap .table .rank {
  width: 28%;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .rank {
    width: 24%;
  }
}
#rankingWrap .table .club {
  width: 72%;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .club {
    width: 76%;
  }
}
#rankingWrap .table .act {
  width: 50%;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .act {
    width: 100%;
  }
}
#rankingWrap .table .point {
  width: 50%;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .point {
    width: 100%;
    border-left: 0 !important;
  }
}
#rankingWrap .table .left {
  width: 50%;
  display: flex;
}
@media all and (max-width: 1024px) {
  #rankingWrap .table .left {
    width: 68%;
  }
}
#rankingWrap .table .right {
  width: 50%;
  display: flex;
  border-left: 1px solid #fff;
}
@media all and (max-width: 1024px) {
  #rankingWrap .table .right {
    width: 32%;
  }
}
@media all and (max-width: 640px) {
  #rankingWrap .table .right {
    flex-direction: column;
  }
  #rankingWrap .table .right .item {
    flex: 1;
  }
}
#rankingWrap .table .head {
  display: flex;
  background-color: #40B620;
  color: #fff;
  font-size: 16px;
  line-height: 1.2;
}
#rankingWrap .table .head .item {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-left: 1px solid #fff;
  padding: 0.7em;
}
#rankingWrap .table .head .item:first-child {
  border-left: 0;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .head .item {
    font-size: 3.2704vw;
    padding: 0.4em;
    font-feature-settings: "palt";
  }
}
#rankingWrap .table .body {
  background-color: #fff;
  color: #40B620;
  font-size: 16px;
  line-height: 1.2;
  border: 1px solid #40B620;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body {
    overflow: hidden;
    max-height: 67.2768vw;
    transition: max-height 0.6s ease;
  }
  #rankingWrap .table .body.active {
    max-height: 252.288vw;
  }
}
#rankingWrap .table .body .row {
  display: flex;
}
#rankingWrap .table .body .row:last-child .item {
  border-bottom: 0;
}
#rankingWrap .table .body .right {
  border-left: 1px solid #40B620;
}
#rankingWrap .table .body .item {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-left: 1px solid #40B620;
  border-bottom: 1px solid #F2F2F2;
}
#rankingWrap .table .body .item:first-child {
  border-left: 0;
}
#rankingWrap .table .body .rank {
  padding: 0.4em;
  font-family: "Montserrat", sans-serif;
  font-size: 20px;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .rank {
    font-size: 4.2048vw;
  }
}
#rankingWrap .table .body .rank.rank1 {
  font-weight: bold;
  font-size: 24px;
  color: #fff;
  padding: 0.8em 0.4em;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .rank.rank1 {
    font-size: 4.2048vw;
  }
}
#rankingWrap .table .body .rank.rank1 span {
  background-color: #FFB11C;
  width: 1.75em;
  height: 1.75em;
  border-radius: 50%;
  line-height: 1.75em;
}
#rankingWrap .table .body .rank.rank2 {
  font-weight: bold;
  font-size: 24px;
  color: #fff;
  padding: 0.8em 0.4em;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .rank.rank2 {
    font-size: 4.2048vw;
  }
}
#rankingWrap .table .body .rank.rank2 span {
  background-color: #C1C1C1;
  width: 1.75em;
  height: 1.75em;
  border-radius: 50%;
  line-height: 1.75em;
}
#rankingWrap .table .body .rank.rank3 {
  font-weight: bold;
  font-size: 24px;
  color: #fff;
  padding: 0.8em 0.4em;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .rank.rank3 {
    font-size: 4.2048vw;
  }
}
#rankingWrap .table .body .rank.rank3 span {
  background-color: #DD790D;
  width: 1.75em;
  height: 1.75em;
  border-radius: 50%;
  line-height: 1.75em;
}
#rankingWrap .table .body .club {
  justify-content: flex-start;
  padding: 0.5rem 1.5rem;
  font-size: 20px;
  text-align: left;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .club {
    padding: 0.4rem 0.3rem;
    font-size: 3.0368vw;
  }
}
#rankingWrap .table .body .club__icon {
  width: 38px;
  flex-shrink: 0;
  margin-right: 1.5rem;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .club__icon {
    width: 7.008vw;
    margin-right: 0.3rem;
  }
}
#rankingWrap .table .body .act {
  font-family: "Montserrat", sans-serif;
  font-size: 20px;
  padding: 0.3rem;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .act {
    font-size: 3.2704vw;
  }
}
#rankingWrap .table .body .point {
  font-family: "Montserrat", sans-serif;
  font-size: 20px;
  padding: 0.3rem;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .point {
    font-size: 3.2704vw;
  }
}
#rankingWrap .table .body .row.rank-higher .club {
  font-weight: bold;
}
#rankingWrap .table .body .row.rank-higher .act,
#rankingWrap .table .body .row.rank-higher .point {
  font-weight: bold;
  font-size: 24px;
}
@media all and (max-width: 640px) {
  #rankingWrap .table .body .row.rank-higher .act,
  #rankingWrap .table .body .row.rank-higher .point {
    font-size: 3.2704vw;
  }
}
#rankingWrap .table .more {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: #F2F2F2;
  visibility: #40B620;
  position: relative;
  color: #40B620;
  border: 1px solid #40B620;
  border-top: 0;
  padding: 1em;
  cursor: pointer;
}
@media all and (min-width: 641px) {
  #rankingWrap .table .more {
    display: none;
  }
}
#rankingWrap .table .more .text:before {
  content: "もっと見る";
}
#rankingWrap .table .more .icon {
  position: absolute;
  width: 4.672vw;
  height: 4.672vw;
  border-radius: 50%;
  right: 1rem;
  top: 50%;
  translate: 0 -50%;
  border: 0.4672vw solid #40B620;
}
#rankingWrap .table .more .icon:before, #rankingWrap .table .more .icon:after {
  content: "";
  height: 0.4672vw;
  width: 60%;
  transition: all 0.3s ease 0s;
  background-color: #40B620;
  border-radius: 1rem;
  position: absolute;
  top: 50%;
  translate: -50% -50%;
  left: 50%;
}
#rankingWrap .table .more .icon:before:hover, #rankingWrap .table .more .icon:after:hover {
  text-decoration: none;
}
#rankingWrap .table .more .icon:after {
  rotate: 90deg;
}
#rankingWrap .table .more.active .text:before {
  content: "閉じる";
}
#rankingWrap .table .more.active .icon:after {
  rotate: 0deg;
}

.aboutSection {
  padding: 180px 0 120px;
}
@media all and (max-width: 640px) {
  .aboutSection {
    padding-top: 23.36vw;
    padding-bottom: 14.016vw;
  }
}
.aboutSection .commonHeading {
  margin-bottom: 80px;
}
@media all and (max-width: 640px) {
  .aboutSection .commonHeading {
    margin-bottom: 12.848vw;
  }
}
.aboutSection__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media all and (max-width: 640px) {
  .aboutSection__main {
    flex-direction: column;
  }
}
.aboutSection__main__img {
  width: 39%;
}
@media all and (max-width: 1024px) {
  .aboutSection__main__img {
    width: 30%;
  }
}
@media all and (max-width: 640px) {
  .aboutSection__main__img {
    width: 67.2768vw;
    margin-bottom: 18.688vw;
  }
}
.aboutSection__main__text {
  width: 58%;
  max-width: 600px;
  letter-spacing: -0.02em;
  font-size: 18px;
  font-size: 18px;
  font-size: min(18px,1.54176vw);
  font-weight: bold;
  line-height: 2.4;
}
@media all and (max-width: 1024px) {
  .aboutSection__main__text {
    width: 66%;
    font-size: 18px;
    font-size: min(18px,1.74032vw);
  }
}
@media all and (max-width: 640px) {
  .aboutSection__main__text {
    font-size: 4.15808vw;
    width: 100%;
    max-width: 100%;
    text-align: center;
  }
}
.aboutSection__main__text p {
  margin-bottom: 2em;
}
.aboutSection__main__text p:last-child {
  margin-bottom: 0;
}

.clubSection {
  margin-top: 200px;
}
@media all and (max-width: 640px) {
  .clubSection {
    margin-top: 23.36vw;
  }
}
.clubSection__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 17px;
  font-weight: bold;
  margin-bottom: 50px;
}
@media all and (max-width: 640px) {
  .clubSection__heading {
    font-size: 4.2048vw;
    margin-bottom: 15.4176vw;
  }
}
.clubSection__heading span {
  padding-bottom: 0.8em;
  position: relative;
}
.clubSection__heading span:after {
  content: "";
  height: 5px;
  background-color: #40B620;
  width: 110%;
  position: absolute;
  bottom: 0;
  left: 50%;
  translate: -50% 0;
  transition: scale 0.4s 0.4s;
  scale: 0 1;
}
@media all and (max-width: 640px) {
  .clubSection__heading span:after {
    height: 1.168vw;
    width: 100%;
  }
}
.clubSection__heading.onAnim span:after {
  scale: 1 1;
}
.clubSection__list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  max-width: 820px;
  margin: 0 auto;
}
@media all and (max-width: 1024px) {
  .clubSection__list {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media all and (max-width: 640px) {
  .clubSection__list {
    margin: 0 auto;
    max-width: 67.2768vw;
    grid-template-columns: repeat(3, 1fr);
    gap: 4.672vw;
  }
}
.clubSection__club a {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.clubSection__club a:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #fff;
  border-radius: 50%;
  scale: 0.8;
  transition: scale 0.4s, background-color 0.4s;
}
@media all and (max-width: 640px) {
  .clubSection__club a:before {
    scale: 1;
  }
}
@media all and (min-width: 641px) {
  .clubSection__club a:hover:before {
    background-color: #40B620;
    scale: 1;
  }
  .clubSection__club a:hover .clubSection__club__img {
    opacity: 0.13;
  }
  .clubSection__club a:hover .clubSection__club__overlay {
    opacity: 1;
  }
}
.clubSection__club__img {
  position: relative;
  z-index: 5;
  padding: 20%;
  transition: opacity 0.4s;
}
@media all and (max-width: 640px) {
  .clubSection__club__img {
    padding: 10%;
  }
}
.clubSection__club__overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 15;
  font-weight: bold;
  transition: opacity 0.4s;
  color: #fff;
  padding: 1em 0.3em;
  border-radius: 50%;
  opacity: 0;
}
.clubSection__club__name {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}
.clubSection__club__text {
  position: absolute;
  bottom: 1.8em;
  display: flex;
  align-items: center;
  font-size: 10px;
}
.clubSection__club__text:after {
  content: "";
  width: 8px;
  height: 8px;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../images/ic_blank.svg);
  margin-left: 0.3em;
}

.topNewsSection {
  padding-top: 120px;
  padding-bottom: 50px;
  overflow: hidden;
}
@media all and (max-width: 640px) {
  .topNewsSection {
    padding-top: 16.352vw;
    padding-bottom: 14.016vw;
  }
}
.topNewsSection__inner {
  position: relative;
}
.topNewsSection__inner:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background-color: #fff;
  border-radius: 10px 0 0 10px;
  transition: scale 1s;
  transform-origin: right;
  scale: 0 1;
}
@media all and (max-width: 640px) {
  .topNewsSection__inner:before {
    border-radius: 2.336vw;
    left: 7.008vw;
  }
}
.topNewsSection__inner.onAnim:before {
  scale: 1;
}
.topNewsSection__main {
  padding: 40px 0 70px;
  position: relative;
  z-index: 5;
}
@media all and (max-width: 640px) {
  .topNewsSection__main {
    padding: 8.4096vw 4.672vw 150px 4.672vw;
  }
}
.topNewsSection__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 32px;
}
@media all and (max-width: 640px) {
  .topNewsSection__header {
    will-change: auto;
    display: block;
    position: static;
  }
}
.topNewsSection__header .commonLink {
  opacity: 0;
  translate: 2em 0;
}
.topNewsSection__header .commonLink__text {
  padding-right: 1.5em;
}
@media all and (max-width: 640px) {
  .topNewsSection__header .commonLink {
    position: absolute;
    bottom: 50px;
    left: 50%;
    translate: -50% 0 !important;
  }
}
.topNewsSection__header.onAnim .commonLink {
  opacity: 1;
  translate: 0;
}

.stepSection {
  padding-top: 100px;
  position: relative;
  z-index: 10;
}
@media all and (max-width: 640px) {
  .stepSection {
    padding-top: 14.016vw;
  }
}
.stepSection .commonHeading {
  margin-bottom: 60px;
}
@media all and (max-width: 640px) {
  .stepSection .commonHeading {
    margin-bottom: 18.688vw;
  }
}
.stepSection__main {
  padding: 50px;
  border-radius: 10px;
  border: 1px solid #40B620;
  background-color: #fff;
  position: relative;
  z-index: 10;
}
@media all and (max-width: 1024px) {
  .stepSection__main {
    padding: 30px;
  }
}
@media all and (max-width: 640px) {
  .stepSection__main {
    padding: 11.68vw 4.672vw 18.688vw;
  }
}
.stepSection__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px;
}
@media all and (max-width: 1024px) {
  .stepSection__list {
    gap: 30px;
  }
}
@media all and (max-width: 640px) {
  .stepSection__list {
    width: 73.3504vw;
    grid-template-columns: repeat(1, 1fr);
    gap: 18.688vw;
  }
}
.stepSection__item {
  text-align: center;
  font-weight: bold;
}
.stepSection__item__heading {
  display: flex;
  align-items: center;
  flex-direction: column;
  font-size: 1.1428571429em;
  margin-bottom: 20px;
  line-height: 1.6;
}
.stepSection__item__heading strong {
  font-size: 1.4285714286em;
  margin-bottom: 0.2em;
}
.stepSection__item__img {
  width: 98%;
  margin: 0 auto 1em;
}
@media all and (max-width: 640px) {
  .stepSection__item__img {
    width: 100%;
    margin-bottom: 0.5em;
  }
}
@media all and (max-width: 1024px) {
  .stepSection__item__text {
    font-size: 12px;
  }
}
@media all and (max-width: 640px) {
  .stepSection__item__text {
    font-size: 1rem;
  }
}

.topActionSection {
  background-color: #40B620;
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
  margin-top: -30px;
  z-index: 5;
}
@media all and (max-width: 640px) {
  .topActionSection {
    padding-bottom: 140px;
  }
}
@media all and (max-width: 428px) {
  .topActionSection {
    padding-top: 28.032vw;
  }
}
.topActionSection__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 64px;
}
@media all and (max-width: 640px) {
  .topActionSection__header {
    will-change: auto;
    display: block;
    position: static;
  }
}
@media all and (max-width: 428px) {
  .topActionSection__header {
    margin-bottom: 7.008vw;
  }
}
.topActionSection__header .commonHeading {
  color: #fff;
}
.topActionSection__header .commonHeading__main:before {
  background-color: #fff;
}
.topActionSection__header .commonLink {
  opacity: 0;
  translate: 2em 0;
  font-weight: 500;
}
.topActionSection__header .commonLink__text {
  padding-right: 1.5em;
}
@media all and (max-width: 640px) {
  .topActionSection__header .commonLink {
    position: absolute;
    bottom: 45px;
    left: 50%;
    translate: -50% 0 !important;
  }
}
.topActionSection__header.onAnim .commonLink {
  opacity: 1;
  translate: 0;
}
.topActionSection .topActionListWrap {
  overflow: hidden;
}
.topActionSection__listWrap1 {
  margin-bottom: 25px;
}
@media all and (max-width: 640px) {
  .topActionSection__listWrap1 {
    margin-bottom: 20px;
  }
}
.topActionSection__list {
  display: flex;
  transition-timing-function: linear !important;
}
.topActionSection__list .actionList__item {
  height: auto !important;
}

.howtoenjoySection {
  padding: 100px 0 70px;
  position: relative;
  z-index: 0;
}
.howtoenjoySection__caption {
  font-size: 0.8571428571rem;
  width: 100%;
  padding-left: 2.8em;
  margin-top: 0.6em;
}
@media all and (max-width: 640px) {
  .howtoenjoySection__caption {
    margin-top: 1.2em;
    padding-left: 7.008vw;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection {
    padding: 16.352vw 0 0.7008-vw;
  }
}
.howtoenjoySection .commonHeading {
  position: sticky;
  z-index: 10;
  top: 40px;
}
@media all and (max-width: 640px) {
  .howtoenjoySection .commonHeading {
    position: relative;
    top: 0;
    margin-bottom: 11.68vw;
  }
  .howtoenjoySection .commonHeading__main {
    letter-spacing: 0;
  }
}
.howtoenjoySection__app__box {
  padding: 60px 50px 50px;
  background-color: #fff;
  border-radius: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__box {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__box {
    padding: 5.84vw 4.672vw 4.672vw;
    flex-direction: column;
    align-items: center;
  }
}
.howtoenjoySection__app__heading {
  display: flex;
  justify-content: center;
  text-align: center;
  font-weight: bold;
  font-size: 1.2857142857em;
  line-height: 1.6;
  margin-bottom: 50px;
  width: 100%;
}
.howtoenjoySection__app__heading span {
  padding: 0 0.2em 0.2em;
  background: linear-gradient(0deg, #83E863 0%, #83E863 35%, transparent 35.01%, transparent 100%);
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__heading {
    margin-bottom: 7.008vw;
  }
}
.howtoenjoySection__app__caption {
  font-size: 0.7142857143em;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0;
}
.howtoenjoySection__app__img {
  width: 33%;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__img {
    width: 30%;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__img {
    width: 64.0064vw;
    margin-bottom: 8.4096vw;
  }
}
.howtoenjoySection__app__center {
  width: 25%;
  max-width: 188px;
  color: #40B620;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: center;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__center {
    width: 20%;
    justify-content: flex-start;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__center {
    width: 43.9168vw;
    margin-bottom: 8.4096vw;
  }
}
.howtoenjoySection__app__free {
  margin-top: 1em;
  margin-bottom: 0.6em;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 3px solid #40B620;
  font-weight: bold;
  font-size: 1.2142857143em;
  border-radius: 0.7em;
  padding: 0.55em 0.1em;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__free {
    font-size: 1em;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__free {
    font-size: 1.2142857143em;
  }
}
.howtoenjoySection__app__dl {
  width: 33%;
  padding: 30px 28px 20px;
  border-radius: 10px;
  background-color: #f2f2f2;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__dl {
    width: 45%;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__dl {
    width: 100%;
  }
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__dl {
    padding: 20px;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__dl {
    padding: 7.008vw 5.84vw 4.672vw;
  }
}
.howtoenjoySection__app__dl__heading {
  text-align: center;
  font-size: 2em;
  line-height: 1.2;
  margin-bottom: 0.8em;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__dl__heading {
    font-size: 1.5714285714em;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__dl__heading {
    font-size: 2.1428571429em;
  }
}
.howtoenjoySection__app__dl__main {
  display: flex;
  gap: 20px;
  margin-bottom: 25px;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__dl__main {
    gap: 10px;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__dl__main {
    gap: 4.672vw;
  }
}
.howtoenjoySection__app__dl__left {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
@media all and (max-width: 1024px) {
  .howtoenjoySection__app__dl__left {
    gap: 10px;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoySection__app__dl__left {
    gap: 3.504vw;
  }
}

@media all and (min-width: 641px) {
  .howtoenjoy__content {
    opacity: 0;
    transition: all 0.5s;
    translate: 2rem 0;
    min-height: 120vh;
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    pointer-events: none;
  }
  .howtoenjoy__content.scrolled {
    translate: -8rem 0;
  }
  .howtoenjoy__content.is-in {
    opacity: 1;
    translate: 0 0;
    pointer-events: all;
  }
}
.howtoenjoy__content__inner {
  display: flex;
  min-height: 100vh;
  align-items: center;
  justify-content: center;
  padding: 100px 0;
  position: sticky;
  top: 0;
  left: 0;
}
@media all and (max-width: 640px) {
  .howtoenjoy__content__inner {
    min-height: 1px;
    padding: 0;
  }
}
.howtoenjoy__content.howtoenjoy__content2 .howtoenjoy__content__number {
  text-align: right;
  left: auto;
  right: 0;
}
@media all and (min-width: 641px) {
  .howtoenjoy__content.howtoenjoy__content2 .howtoenjoy__content__box {
    flex-direction: row-reverse;
  }
}
@media all and (min-width: 641px) {
  .howtoenjoy__content.howtoenjoy__content3 {
    min-height: 250vh;
  }
}
.howtoenjoy__content__box {
  width: 100%;
}
@media all and (min-width: 641px) {
  .howtoenjoy__content__box {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
@media all and (max-width: 1024px) {
  .howtoenjoy__content__box {
    position: relative;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoy__content__box {
    padding: 23.36vw 0;
    transition: opacity 0.6s;
    opacity: 0;
  }
  .howtoenjoy__content__box.onAnim {
    opacity: 1;
  }
}
.howtoenjoy__content__number {
  color: #83e863;
  font-size: 154px;
  width: 28%;
  line-height: 1;
}
@media all and (max-width: 1024px) {
  .howtoenjoy__content__number {
    width: auto;
    position: absolute;
    top: -80px;
    left: 0;
    font-size: 110px;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoy__content__number {
    font-size: 35.04vw;
    left: -10.512vw;
    top: 0;
  }
}
.howtoenjoy__content__img {
  width: 35%;
  padding: 0 50px;
  position: relative;
  z-index: 5;
}
@media all and (max-width: 640px) {
  .howtoenjoy__content__img {
    width: 79.424vw;
    margin: 0 auto 21.024vw;
    padding: 0 11.68vw;
  }
}
.howtoenjoy__content__content {
  width: 28%;
  position: relative;
  z-index: 5;
}
@media all and (max-width: 1024px) {
  .howtoenjoy__content__content {
    width: 55%;
  }
}
@media all and (max-width: 640px) {
  .howtoenjoy__content__content {
    width: 78.9568vw;
    margin: 0 auto;
  }
}
.howtoenjoy__content__heading {
  font-weight: bold;
  font-size: 34px;
}
.howtoenjoy__content__heading.small {
  font-size: 26px;
}
.howtoenjoy__content__heading span {
  background: linear-gradient(0deg, #83E863 0%, #83E863 35%, transparent 35.01%, transparent 100%);
  padding-bottom: 0.2em;
}
@media all and (max-width: 640px) {
  .howtoenjoy__content__heading {
    font-size: 7.9424vw;
  }
  .howtoenjoy__content__heading small {
    font-size: 6.0736vw;
  }
}
.howtoenjoy__content__text {
  font-weight: bold;
  font-size: 1.1428571429em;
  line-height: 2;
  margin-top: 1em;
}
.howtoenjoy__content .howto-prev {
  position: absolute;
  width: 26px;
  height: 26px;
  background-color: #40B620;
  left: 0;
  top: 50%;
  cursor: pointer;
  border-radius: 50%;
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/ic_arrow.svg);
  scale: -1 1;
}
@media all and (max-width: 640px) {
  .howtoenjoy__content .howto-prev {
    width: 6.0736vw;
    height: 6.0736vw;
  }
}
.howtoenjoy__content .howto-prev:before {
  content: "";
  width: 98%;
  height: 98%;
  border: 1px solid #40B620;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  border-radius: 50%;
  transition: scale 0.3s;
}
.howtoenjoy__content .howto-prev:hover:before {
  scale: 1.2;
}
.howtoenjoy__content .howto-next {
  position: absolute;
  width: 26px;
  height: 26px;
  background-color: #40B620;
  right: 0;
  top: 50%;
  cursor: pointer;
  border-radius: 50%;
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../images/ic_arrow.svg);
}
@media all and (max-width: 640px) {
  .howtoenjoy__content .howto-next {
    width: 6.0736vw;
    height: 6.0736vw;
  }
}
.howtoenjoy__content .howto-next:before {
  content: "";
  width: 98%;
  height: 98%;
  border: 1px solid #40B620;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  border-radius: 50%;
  transition: scale 0.3s;
}
.howtoenjoy__content .howto-next:hover:before {
  scale: 1.2;
}
.howtoenjoy__content .howto-pagination {
  position: absolute;
  width: 100%;
  bottom: -40px !important;
  left: 0;
  display: flex;
  justify-content: center;
}
@media all and (max-width: 640px) {
  .howtoenjoy__content .howto-pagination {
    bottom: -9.344vw !important;
  }
}
.howtoenjoy__content .howto-pagination .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  margin: 0 10px !important;
  border: 1px solid #40B620;
  background-color: #fff;
  opacity: 1;
}
@media all and (max-width: 640px) {
  .howtoenjoy__content .howto-pagination .swiper-pagination-bullet {
    width: 2.336vw;
    height: 2.336vw;
    margin: 0 2.336vw !important;
  }
}
.howtoenjoy__content .howto-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #40B620;
}

.faqSection {
  padding: 100px 0 130px;
  position: relative;
  z-index: 0;
}
@media all and (max-width: 640px) {
  .faqSection {
    padding: 16.352vw 0 21.024vw;
  }
}

.faqList__item {
  margin-top: 30px;
  background-color: #fff;
  border-radius: 40px;
}
@media all and (max-width: 640px) {
  .faqList__item {
    margin-bottom: 7.008vw;
    border-radius: 9.344vw;
  }
}
.faqList__dt {
  padding: 20px 30px;
  line-height: 1.8;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: bold;
  color: #40B620;
  font-size: 1.4285714286em;
  cursor: pointer;
}
@media all and (max-width: 640px) {
  .faqList__dt {
    padding: 5.6064vw 4.672vw 5.6064vw 2.8032vw;
    font-size: 1.1428571429em;
  }
}
.faqList__dt__q {
  margin-right: 50px;
  width: 44px;
  flex-shrink: 0;
}
@media all and (max-width: 640px) {
  .faqList__dt__q {
    margin-right: 3.504vw;
    width: 9.344vw;
  }
}
.faqList__dt__q img {
  width: 100%;
}
.faqList__dt__text {
  padding-right: 50px;
}
@media all and (max-width: 640px) {
  .faqList__dt__text {
    padding-right: 4.672vw;
  }
}
.faqList__dt__ic {
  margin-left: auto;
  width: 22px;
  height: 22px;
  border: 2px solid #40B620;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
}
@media all and (max-width: 640px) {
  .faqList__dt__ic {
    width: 4.672vw;
    height: 4.672vw;
  }
}
.faqList__dt__ic:before, .faqList__dt__ic:after {
  content: "";
  height: 2px;
  border-radius: 1px;
  width: 55%;
  background-color: #40B620;
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  transition: rotate 0.4s;
}
.faqList__dt__ic:after {
  rotate: 90deg;
}
.faqList__dt.active .faqList__dt__ic:after {
  rotate: 0deg;
}
.faqList__dd {
  padding: 0 30px;
  line-height: 1.8;
  display: none;
}
@media all and (max-width: 640px) {
  .faqList__dd {
    padding: 0 4.672vw 0 2.8032vw;
  }
}
.faqList__dd__inner {
  display: flex;
  padding: 30px 0;
  border-top: 1px solid #F2F2F2;
}
@media all and (max-width: 640px) {
  .faqList__dd__inner {
    padding: 5.6064vw 0 5.6064vw 0;
  }
}
.faqList__dd__a {
  margin-right: 50px;
  width: 44px;
  flex-shrink: 0;
}
@media all and (max-width: 640px) {
  .faqList__dd__a {
    margin-right: 3.504vw;
    width: 9.344vw;
  }
}
.faqList__dd__a img {
  width: 100%;
}
.faqList__dd__content {
  font-weight: bold;
  font-size: 1.1428571429em;
  width: calc(100% - 94px);
  width: calc(100% - 12.848vw);
  word-break: break-all;
}
.faqList__dd__content a {
  text-decoration: underline;
  color: #40B620;
}
.faqList__dd__content a:hover {
  text-decoration: none;
}

.pageWrap {
  padding: 140px 0;
}
@media all and (max-width: 640px) {
  .pageWrap {
    padding: 28.032vw 0;
  }
}

.pageLogo {
  position: fixed;
  z-index: 99;
  width: 206px;
  top: 30px;
  left: 30px;
}
@media all and (max-width: 640px) {
  .pageLogo {
    width: 48.1216vw;
    top: 7.008vw;
    left: 4.672vw;
  }
}

.commonHeading--archive {
  margin-bottom: 50px;
}
@media all and (max-width: 640px) {
  .commonHeading--archive {
    margin-bottom: 11.68vw;
  }
}

.pagerWrap {
  display: flex;
  align-items: center;
  justify-content: center;
}

.pager {
  display: flex;
  margin-top: 100px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 26px;
  padding: 0 40px;
  position: relative;
}
@media all and (min-width: 641px) {
  .pager {
    min-width: 346px;
  }
}
@media all and (max-width: 640px) {
  .pager {
    min-width: 80.8256vw;
  }
}
@media all and (max-width: 640px) {
  .pager {
    padding: 0 9.344vw;
    gap: 2.336vw 4.672vw;
  }
}
.pager li.prevWrap {
  position: absolute;
  left: 0;
  top: 50%;
  translate: 0 -50%;
}
.pager li.nextWrap {
  position: absolute;
  right: 0;
  top: 50%;
  translate: 0 -50%;
}
.pager a:hover {
  scale: 1.2;
}
.pager__link {
  height: 20px;
  line-height: 18px;
  min-width: 20px;
  text-align: center;
  padding: 0 0.2em;
  background-color: #fff;
  transition: all 0.3s ease 0s;
  border: 1px solid #40B620;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 500;
  color: #40B620;
  display: flex;
  justify-content: center;
}
.pager__link:hover {
  text-decoration: none;
}
.pager__link.is-current {
  background-color: #40B620;
  color: #fff;
  border-color: #fff;
}
@media all and (max-width: 640px) {
  .pager__link {
    height: 4.672vw;
    line-height: 4.2048vw;
    min-width: 4.672vw;
    font-size: 2.8032vw;
  }
}
.pager__link.prev, .pager__link.next {
  width: 26px;
  height: 26px;
  background-color: #40B620;
  background-image: url(../images/ic_arrow.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 45%;
}
.pager__link.prev:before, .pager__link.next:before {
  content: "";
  transition: all 0.3s ease 0s;
  width: 100%;
  height: 100%;
  border: 1px solid #40B620;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  position: absolute;
  box-sizing: border-box;
}
.pager__link.prev:before:hover, .pager__link.next:before:hover {
  text-decoration: none;
}
.pager__link.prev:hover, .pager__link.next:hover {
  scale: 1;
}
.pager__link.prev:hover:before, .pager__link.next:hover:before {
  scale: 1.4;
}
@media all and (max-width: 640px) {
  .pager__link.prev, .pager__link.next {
    width: 6.0736vw;
    height: 6.0736vw;
  }
}
.pager__link.prev {
  rotate: 180deg;
}
.pager.action .pager__link.prev:before, .pager.action .pager__link.next:before {
  border-color: #fff;
}

.prevBTWrap {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}
@media all and (max-width: 640px) {
  .prevBTWrap {
    margin-top: 14.016vw;
  }
}

#newsListWrap {
  transition: opacity 0.5s 0.3s;
  opacity: 0;
  min-height: 400px;
}
#newsListWrap.loaded {
  opacity: 1;
}

.newsList__item {
  padding: 1em 0;
  border-top: 1px solid #F2F2F2;
  width: 100%;
}
.newsList__item:last-child {
  border-bottom: 1px solid #F2F2F2;
}
.newsList__item a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 500;
  width: 100%;
  padding: 1em 0;
}
@media all and (max-width: 640px) {
  .newsList__item a {
    flex-wrap: wrap;
  }
}
.newsList__item a:hover {
  text-decoration: none;
}
@media all and (min-width: 641px) {
  .newsList__item a:hover .newsList__arrow {
    background-color: #40B620;
    color: #fff;
  }
  .newsList__item a:hover .newsList__arrow path {
    stroke: #fff;
  }
  .newsList__item a:hover .newsList__arrow .arrow {
    right: calc(100% - 8px);
    translate: 100% -50%;
  }
  .newsList__item a:hover .newsList__arrow .text {
    left: calc(100% - 8px);
    translate: -100% -50%;
  }
}
@media all and (max-width: 640px) {
  .newsList__item a {
    padding-left: 4.672vw;
    padding-right: 4.672vw;
  }
}
.newsList__date {
  white-space: nowrap;
  flex-shrink: 0;
  width: 90px;
}
@media all and (max-width: 640px) {
  .newsList__date {
    width: auto;
    order: 1;
  }
}
.newsList__title {
  width: calc(100% - 240px);
}
.newsList__title p {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media all and (max-width: 640px) {
  .newsList__title {
    margin-top: 0.8em;
    width: 100%;
    order: 3;
  }
  .newsList__title p {
    white-space: wrap;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}
.newsList__arrow {
  flex-shrink: 0;
  min-height: 30px;
  background-color: #fff;
  color: #40B620;
  display: flex;
  align-items: center;
  position: relative;
  padding: 0.3em 0.4em;
  width: 88px;
  border: 1px solid #40B620;
  border-radius: 4em;
  font-size: 12px;
  transition: all 0.3s ease 0s;
}
.newsList__arrow:hover {
  text-decoration: none;
}
@media all and (max-width: 640px) {
  .newsList__arrow {
    order: 2;
  }
}
@media all and (max-width: 428px) {
  .newsList__arrow {
    min-height: 7.008vw;
    width: 20.5568vw;
    font-size: 2.8032vw;
  }
}
.newsList__arrow .arrow {
  position: absolute;
  width: 1.2em;
  height: 1.2em;
  top: 50%;
  right: 8px;
  translate: 0 -50%;
  transition: all 0.3s ease 0s;
}
.newsList__arrow .arrow:hover {
  text-decoration: none;
}
.newsList__arrow .arrow svg {
  display: block;
  width: 100%;
}
.newsList__arrow .arrow svg path {
  transition: all 0.3s ease 0s;
}
.newsList__arrow .arrow svg path:hover {
  text-decoration: none;
}
.newsList__arrow .text {
  transition: translate 0.3s ease, left 0.3s ease;
  position: absolute;
  left: 8px;
  top: 50%;
  translate: 0 -50%;
  white-space: nowrap;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
}

#actionListWrap {
  min-height: 400px;
}
#actionListWrap:before {
  content: "";
  margin: 0 auto;
  width: 40px;
  height: 40px;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../images/loader.svg);
  display: block;
  transition: all 0.3s ease 0s;
  position: absolute;
  left: 50%;
  translate: -50% 0;
  pointer-events: none;
}
#actionListWrap:before:hover {
  text-decoration: none;
}
#actionListWrap .actionListWrap__in {
  transition: opacity 0.5s 0.3s;
  opacity: 0;
}
#actionListWrap.loaded:before {
  opacity: 0;
  visibility: hidden;
}
#actionListWrap.loaded .actionListWrap__in {
  opacity: 1;
}

.actionList {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
}
@media all and (max-width: 640px) {
  .actionList {
    grid-template-columns: 1fr;
  }
}
.actionList__link {
  display: flex;
  justify-content: space-between;
  padding: 25px;
  background-color: #fff;
  border-radius: 10px;
  height: 100%;
}
@media all and (max-width: 428px) {
  .actionList__link {
    padding: 4.672vw;
  }
}
.actionList__link:hover {
  text-decoration: none;
}
.actionList__link:hover .actionList__img img {
  scale: 1.1;
}
@media all and (min-width: 641px) {
  .actionList__link:hover .actionList__arrow {
    background-color: #40B620;
    color: #fff;
  }
  .actionList__link:hover .actionList__arrow path {
    stroke: #fff;
  }
  .actionList__link:hover .actionList__arrow .arrow {
    right: calc(100% - 8px);
    translate: 100% -50%;
  }
  .actionList__link:hover .actionList__arrow .text {
    left: calc(100% - 8px);
    translate: -100% -50%;
  }
}
.actionList__img {
  width: 45%;
  overflow: hidden;
  border-radius: 10px;
}
.actionList__img > span {
  display: block;
  padding-top: 65.217%;
  position: relative;
}
@media all and (max-width: 428px) {
  .actionList__img > span {
    padding-top: 75.555%;
  }
}
.actionList__img img {
  transition: all 0.3s ease 0s;
}
.actionList__img img:hover {
  text-decoration: none;
}
.actionList__content {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.actionList__date {
  color: #40B620;
  display: block;
  margin-bottom: 0.3em;
}
.actionList__title {
  font-size: 1.1428571429em;
  font-weight: bold;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 1.6;
}
.actionList__arrow {
  flex-shrink: 0;
  min-height: 30px;
  background-color: #fff;
  color: #40B620;
  display: flex;
  align-items: center;
  position: relative;
  padding: 0.3em 0.4em;
  width: 100%;
  margin-top: 1em;
  border: 1px solid #40B620;
  border-radius: 4em;
  font-size: 12px;
  transition: all 0.3s ease 0s;
}
.actionList__arrow:hover {
  text-decoration: none;
}
@media all and (max-width: 428px) {
  .actionList__arrow {
    min-height: 6.0736vw;
    font-size: 2.8032vw;
  }
}
.actionList__arrow .arrow {
  position: absolute;
  width: 1.2em;
  height: 1.2em;
  top: 50%;
  right: 8px;
  translate: 0 -50%;
  transition: all 0.3s ease 0s;
}
.actionList__arrow .arrow:hover {
  text-decoration: none;
}
.actionList__arrow .arrow svg {
  display: block;
  width: 100%;
}
.actionList__arrow .arrow svg path {
  transition: all 0.3s ease 0s;
}
.actionList__arrow .arrow svg path:hover {
  text-decoration: none;
}
.actionList__arrow .text {
  transition: translate 0.3s ease, left 0.3s ease;
  position: absolute;
  left: 8px;
  top: 50%;
  translate: 0 -50%;
  white-space: nowrap;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
}

.articleWrap {
  padding: 100px 0;
}

.singleDate {
  font-weight: normal;
  display: block;
  margin-bottom: 1em;
  line-height: 1.4;
}

.singleTitle {
  font-weight: bold;
  color: #40B620;
  line-height: 1.6;
  font-size: 1.2857142857em;
  margin-bottom: 2em;
}

.singleContent {
  font-weight: bold;
}
.singleContent p {
  margin-bottom: 2em;
}
.singleContent figure {
  margin: 2em 0;
}
.singleContent h2 {
  font-size: 1.25em;
  font-weight: bold;
  margin-bottom: 0.5em;
}
.singleContent img {
  height: auto;
}

#modal {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
}
#modal #modalIn {
  display: flex;
  position: absolute;
  align-items: center;
  justify-content: center;
  padding: 50px 80px;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media all and (max-width: 640px) {
  #modal #modalIn {
    padding: 14.016vw 7.008vw;
  }
}
#modal #modalContent {
  background-color: #fff;
  padding: 100px 40px;
  width: 100%;
  max-height: 100%;
  max-width: 940px;
  border: 2px solid #40B620;
  position: relative;
  border-radius: 30px;
  display: flex;
}
@media all and (max-width: 640px) {
  #modal #modalContent {
    padding: 14.016vw 4.672vw;
  }
}
#modal #modalContentIn {
  overflow: auto;
  width: 100%;
}
#modal .modalInner {
  max-width: 760px;
  margin: 0 auto;
}
#modal .modalPrev {
  position: absolute;
  top: 50%;
  left: 20px;
  background-color: #40B620;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background-image: url(../images/ic_arrow.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 36%;
  rotate: 180deg;
  translate: 0 -50%;
  display: none;
  cursor: pointer;
}
#modal .modalPrev:before {
  content: "";
  transition: all 0.3s ease 0s;
  width: 100%;
  height: 100%;
  border: 1px solid #40B620;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  position: absolute;
  box-sizing: border-box;
}
#modal .modalPrev:before:hover {
  text-decoration: none;
}
#modal .modalPrev:hover:before {
  scale: 1.2;
}
@media all and (max-width: 640px) {
  #modal .modalPrev {
    width: 6.0736vw;
    height: 6.0736vw;
    left: 3.2704vw;
  }
}
#modal .modalNext {
  position: absolute;
  top: 50%;
  right: 20px;
  background-color: #40B620;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background-image: url(../images/ic_arrow.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 36%;
  translate: 0 -50%;
  display: none;
  cursor: pointer;
}
#modal .modalNext:before {
  content: "";
  transition: all 0.3s ease 0s;
  width: 100%;
  height: 100%;
  border: 1px solid #40B620;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  position: absolute;
  box-sizing: border-box;
}
#modal .modalNext:before:hover {
  text-decoration: none;
}
#modal .modalNext:hover:before {
  scale: 1.2;
}
@media all and (max-width: 640px) {
  #modal .modalNext {
    width: 6.0736vw;
    height: 6.0736vw;
    right: 3.2704vw;
  }
}
#modal.action .modalPrev,
#modal.action .modalNext {
  display: block;
}
#modal #modalClose {
  position: absolute;
  bottom: 0;
  left: 50%;
  background-color: #40B620;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  translate: -50% 50%;
  cursor: pointer;
}
#modal #modalClose:before, #modal #modalClose:after {
  content: "";
  transition: all 0.3s ease 0s;
  width: 50%;
  height: 1px;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  position: absolute;
  background-color: #fff;
  box-sizing: border-box;
}
#modal #modalClose:before:hover, #modal #modalClose:after:hover {
  text-decoration: none;
}
#modal #modalClose:before {
  rotate: 45deg;
}
#modal #modalClose:after {
  rotate: -45deg;
}
@media all and (max-width: 640px) {
  #modal #modalClose {
    width: 11.68vw;
    height: 11.68vw;
  }
}

#top-sustainable_cup2025-modal {
  position: fixed;
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.4);
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalIn {
  display: flex;
  position: absolute;
  align-items: center;
  justify-content: center;
  padding: 0px 50px;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media all and (max-width: 1024px) {
  #top-sustainable_cup2025-modal #top-sustainable_cup2025-modalIn {
    padding: 0px 30px;
  }
}
@media all and (max-width: 640px) {
  #top-sustainable_cup2025-modal #top-sustainable_cup2025-modalIn {
    padding: 0vw 7.008vw;
  }
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalContent {
  background-color: #fff;
  padding: 0px 0px;
  width: 100%;
  max-height: 100%;
  max-width: 850px;
  border: 2px solid #40B620;
  position: relative;
  border-radius: 30px;
  display: flex;
  box-shadow: 0px 0px 30px rgba(63, 183, 32, 0.2);
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalContentIn {
  overflow: auto;
  width: 100%;
  padding: 60px 0;
}
@media all and (max-width: 640px) {
  #top-sustainable_cup2025-modal #top-sustainable_cup2025-modalContentIn {
    padding: 14.016vw 0 5.84vw;
  }
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose {
  position: absolute;
  top: 30px;
  right: 30px;
  background-color: #40B620;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  z-index: 5;
  cursor: pointer;
}
@media all and (max-width: 640px) {
  #top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose {
    top: 3.504vw;
    right: 3.504vw;
  }
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose:before, #top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose:after {
  content: "";
  transition: all 0.3s ease 0s;
  width: 50%;
  height: 1px;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  position: absolute;
  background-color: #fff;
  box-sizing: border-box;
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose:before:hover, #top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose:after:hover {
  text-decoration: none;
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose:before {
  rotate: 45deg;
}
#top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose:after {
  rotate: -45deg;
}
@media all and (max-width: 640px) {
  #top-sustainable_cup2025-modal #top-sustainable_cup2025-modalClose {
    width: 11.68vw;
    height: 11.68vw;
  }
}

.top-sustainable_cup2025-modal__main__content {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.top-sustainable_cup2025-modal__main__content .heading {
  width: 272px;
  margin-bottom: 16px;
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__content .heading {
    width: 46.72vw;
    margin-bottom: 7.008vw;
  }
}
.top-sustainable_cup2025-modal__main__content .date {
  max-width: 268px;
  margin: 0 auto 30px;
  background-color: #40B620;
  font-weight: bold;
  color: #fff;
  font-size: 13px;
  border-radius: 4em;
  text-align: center;
  width: 100%;
  padding: 0.2em;
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__content .date {
    max-width: 51.392vw;
    margin-bottom: 4.672vw;
    font-size: 3.0368vw;
  }
}
.top-sustainable_cup2025-modal__main__content .date strong {
  font-size: 17px;
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__content .date strong {
    font-size: 3.9712vw;
  }
}
.top-sustainable_cup2025-modal__main__content .heading2 {
  line-height: 1.4;
  font-size: 32px;
  font-weight: bold;
  letter-spacing: 0.05em;
  color: #40B620;
  margin-bottom: 0.3em;
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__content .heading2 {
    font-size: 4.672vw;
  }
}
.top-sustainable_cup2025-modal__main__content .heading2 em {
  font-family: "Montserrat", sans-serif;
}
.top-sustainable_cup2025-modal__main__content .img1 {
  position: absolute;
  width: 188px;
  left: 10px;
  bottom: 0;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025-modal__main__content .img1 {
    width: 17%;
  }
}
@media (max-width: 720px) {
  .top-sustainable_cup2025-modal__main__content .img1 {
    bottom: auto;
    top: -20%;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__content .img1 {
    left: -3%;
    width: 22%;
  }
}
.top-sustainable_cup2025-modal__main__content .img2 {
  position: absolute;
  width: 126px;
  right: 60px;
  bottom: 10px;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025-modal__main__content .img2 {
    width: 13%;
    right: 5%;
  }
}
.top-sustainable_cup2025-modal__main__content .img3 {
  position: absolute;
  width: 68px;
  top: 50px;
  right: 60px;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025-modal__main__content .img3 {
    width: 8%;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__content .img3 {
    top: 12%;
    right: 6%;
  }
}
.top-sustainable_cup2025-modal__main__nav {
  width: 100%;
  max-width: calc(100% - 100px);
  margin: 30px auto 0;
  padding-top: 30px;
  display: flex;
  justify-content: center;
  width: 746px;
  border-top: 1px solid rgba(65, 182, 32, 0.1);
  gap: 30px;
}
.top-sustainable_cup2025-modal__main__nav .commonLink__text {
  padding-right: 2em;
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__nav {
    margin-top: 4.672vw;
    padding-top: 4.672vw;
    max-width: calc(100% - 9.344vw);
    flex-direction: column;
    align-items: center;
    gap: 2.336vw;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025-modal__main__text {
    font-size: 3.2704vw;
  }
}

.top-sustainable_cup2025 {
  padding-top: 100px;
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025 {
    padding-top: 23.36vw;
  }
}
.top-sustainable_cup2025 .inner {
  max-width: 1266px;
}
.top-sustainable_cup2025__main {
  position: relative;
  border-radius: 10px;
  background-color: #fff;
  border: 1px solid #40B620;
  box-shadow: 0px 0px 1rem rgba(63, 183, 32, 0.2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 50px 0 0;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025__main {
    padding-right: 20px;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025__main {
    border-radius: 2.336vw;
    padding: 0 0 14.016vw;
    flex-direction: column;
    align-items: center;
  }
}
.top-sustainable_cup2025__content {
  padding: 40px 30px 60px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025__content {
    padding: 16.352vw 4.672vw 4.672vw;
    width: 100%;
  }
}
.top-sustainable_cup2025__content .logo {
  width: 234px;
  margin-bottom: 26px;
}
.top-sustainable_cup2025__content .heading {
  text-align: center;
  font-weight: bold;
  font-size: 42px;
  line-height: 1.4;
  margin-bottom: 0.3em;
  color: #40B620;
}
.top-sustainable_cup2025__content .heading br {
  display: none;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025__content .heading {
    font-size: 32px;
  }
  .top-sustainable_cup2025__content .heading br {
    display: inline;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025__content .heading {
    font-size: 5.6064vw;
  }
}
.top-sustainable_cup2025__content .lead {
  text-align: center;
  font-weight: bold;
  font-size: 21px;
}
.top-sustainable_cup2025__content .lead br {
  display: none;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025__content .lead br {
    display: inline;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025__content .lead {
    font-size: 4.2048vw;
  }
}
.top-sustainable_cup2025 .img1 {
  width: 200px;
  scale: 1.2;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025 .img1 {
    width: 20%;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025 .img1 {
    position: absolute;
    scale: 1;
    top: 0;
    left: 0;
    translate: -20% -50%;
    width: 30%;
  }
}
.top-sustainable_cup2025 .img2 {
  width: 152px;
  margin-top: 20px;
}
@media all and (max-width: 1024px) {
  .top-sustainable_cup2025 .img2 {
    width: 20%;
  }
}
@media all and (max-width: 640px) {
  .top-sustainable_cup2025 .img2 {
    width: 30%;
  }
}
.top-sustainable_cup2025__date {
  position: absolute;
  display: block;
  background-color: #40B620;
  color: #fff;
  font-weight: bold;
  border-radius: 0 10px 0 10px;
  padding: 0.2em 1.5em;
  position: absolute;
  top: 0;
  right: 0;
}
.top-sustainable_cup2025__date strong {
  font-size: 1.25em;
}
.top-sustainable_cup2025__btWrap {
  position: absolute;
  z-index: 5;
  bottom: 0;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  translate: 0 50%;
}
.top-sustainable_cup2025__btWrap .commonLink__text {
  padding-right: 2rem;
  width: 100%;
  text-align: center;
}

.clubWrap__tabs {
  max-width: 760px;
  margin: 0 auto 40px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 20px;
}
@media all and (max-width: 640px) {
  .clubWrap__tabs {
    gap: 2.336vw;
    margin-bottom: 9.344vw;
  }
}
.clubWrap__btn {
  all: unset;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1em 0.5em;
  transition: all 0.3s ease 0s;
  border: 1px solid #40B620;
  cursor: pointer;
  border-radius: 5em;
  font-weight: bold;
  text-align: center;
  box-sizing: border-box;
  flex: 1;
  max-width: 222px;
  background-color: #fff;
  color: #40B620;
  position: relative;
}
.clubWrap__btn:hover {
  text-decoration: none;
}
@media all and (max-width: 640px) {
  .clubWrap__btn {
    font-size: 2.8032vw;
  }
}
.clubWrap__btn strong {
  font-size: 20px;
}
@media all and (max-width: 640px) {
  .clubWrap__btn strong {
    font-size: 3.2704vw;
  }
}
.clubWrap__btn:after {
  content: "";
  width: 1em;
  height: 0.575em;
  position: absolute;
  background-image: url(../images/sustainable_2025/form_arrow.svg);
  background-size: contain;
  background-repeat: no-repeat;
  bottom: 0;
  left: 50%;
  translate: -50% 170%;
  transition: all 0.3s ease 0s;
  opacity: 0;
}
.clubWrap__btn:after:hover {
  text-decoration: none;
}
.clubWrap__btn.current {
  color: #fff;
  background-color: #40B620;
}
.clubWrap__btn.current:after {
  opacity: 1;
}
.clubWrap__container {
  position: relative;
}
.clubWrap__content {
  display: none;
}
.clubWrap__content.current {
  display: block;
  animation: fadeIn 0.5s ease 0s 1 alternate forwards;
}