@charset "utf-8";
/* CSS Document */

/* -------------------------
/* Created date: --
/* Created user: --
/* Last up date: 2024.11.7
/* Last up date user: yamaguchi
/* for sp and pc
--------------------------*/
.shindan {
  position: relative;
  background-color: var(--sdCol01);
  background-image:
    radial-gradient(rgba(255, 255, 255, 0.25) 1px, rgba(255, 255, 255, 0) 2px),
    radial-gradient(rgba(255, 255, 255, 0.25) 1px, rgba(255, 255, 255, 0) 2px);
  background-size: 14px 14px;
  background-position: 0 0, 7px 7px;
  max-width: 100vw;
  overflow: hidden;
  text-align: center;

  --sdCol01: #81C0C6;
  --sdCol02: #24929C;
  --sdCol03: #EE4993;
  --sdCol04: #ffe878;
  --sdCol05: #eb1e79;
}

.cmnMenus .cmnMenu,
.mainteText {
  display: none;
}

.shindan > .inner{
  margin: 0 auto;
}

.shindan .bgWhite,
.shindan .bgYellow{
  position: relative;
  padding-top: 2rem;
  padding-bottom: 1rem;
}

.shindan .bgWhite{
  margin: 0 auto;
  background: linear-gradient(to top, rgba(255,255,255,0) 25vw, rgba(255,255,255,1) 25vw);
}

.shindan .bgWhite::before,
.shindan .bgYellow::before{
  content: '';
  z-index: 1;
  left: -10vw;
  width: 120vw;
  height: 25vw;
}

.shindan .bgWhite::before{
  bottom: 2px;
  background: #fff;
  border-radius: 0 0 50% 50% /0 0 100% 100%;
}

.shindan .bgYellow{
  background: linear-gradient(to bottom, rgba(255,232,120,0) 25vw, rgba(255,232,120,1) 25vw);
}

.shindan .bgYellow::before{
  top: 0;
  background: var(--sdCol04);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}

.shindan .bgWhite *,
.shindan .bgYellow *{
  position: relative;
  z-index: 2;
}

.shindan .shindanLogo {
  position: relative;
  z-index: 3;
  margin: 0 auto;
  padding-top: 1rem;
  background: #fff;
}

.shindan .shindanLogo img {
  width: min(50%, 324px);
}

.shindan .nextBtn a{
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0.75em 1em;
  width: min(80vw, 330px);
  background: var(--sdCol03);
  filter: drop-shadow(0 0 5px rgba(0, 0, 0, .25));
  border: 5px solid #fff;
  border-radius: 0.5rem;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  letter-spacing: 4px;
}

.shindan .nextBtn a::after {
  content: '';
  top: 50%;
  right: 0.5em;
  width: 0.6em;
  height: 1.2em;
  background: #fff;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
  transform: translateY(-50%);
}

.shindan .outLineBtn {
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0.75em 1em;
  width: min(100%, 330px);
  background:#fff;
  filter: drop-shadow(0 0 5px rgba(0, 0, 0, .25));
  border: min(0.6vw, 3px) solid var(--sdCol03);
  border-radius: 0.5rem;
  color: var(--sdCol05);
  font-size: 2.2rem;
  font-weight: bold;
  letter-spacing: 4px;
}

.shindan .outLineBtn::after {
  content: '';
  top: 50%;
  right: 0.5em;
  width: 0.4em;
  height: 0.9em;
  background: var(--sdCol03);
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
  transform: translateY(-50%);
}

.shindan .leadText{
  margin: 0 auto 2rem;
  width: fit-content;
  font-size: 1.6rem;
  line-height: 1.8;
  font-weight: bold;
  text-align: left;
}

.shindan .otsukare{
  margin: 0 auto 2rem;
  padding: 0 1rem;
  width: min(80%, 324px);
}

.complete.shindan .wakaba{
  margin-top: 3rem;
}

@media screen and (min-width: 768px) {
  .shindan .shindanLogo {
    padding: 3rem 0 1rem;
  }

  .shindan .otsukare{
    margin: 0 auto 4rem;
  }

  .shindan .leadText {
    font-size: 1.5rem;
  }
}