:root {
  --board: 1280;
  --max: 1px;
}
@media (max-width: 768px) {
  :root {
    --board: 375;
    --max: 9999px;
  }
}

.product-detail--speakingquest .content {
  background-color: #f7f5ed;
}

.product-detail--speakingquest .content .container {
  margin: 0 auto;
  width: min(clamp(0px, 10vw / var(--board) * 10 * 960, var(--max) * 960), 90vw);
}

.product-detail--speakingquest .content .bg-white {
  padding: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60) 0 clamp(0px, 10vw / var(--board) * 10 * 80, var(--max) * 80) !important;
  background-color: #fff;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .bg-white {
    padding: clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30) 0 clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30) !important;
  }
}

.product-detail--speakingquest .content .text-center {
  text-align: center;
}

.product-detail--speakingquest .content .info {
  padding: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60) 0 clamp(0px, 10vw / var(--board) * 10 * 70, var(--max) * 70);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .info {
    padding: clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30) 0 clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30);
  }
}

.product-detail--speakingquest .content .info h2 {
  position: relative;
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  padding-bottom: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  color: #0081da;
  font-weight: 700;
  font-size: clamp(0px, 10vw / var(--board) * 10 * 28, var(--max) * 28);
  line-height: 1.5;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .info h2 {
    font-size: clamp(0px, 10vw / var(--board) * 10 * 22, var(--max) * 22);
  }
}

.product-detail--speakingquest .content .info h2 + p {
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 55, var(--max) * 55);
}

.product-detail--speakingquest .content .info-detail {
  position: relative;
  padding-top: clamp(0px, 10vw / var(--board) * 10 * 50, var(--max) * 50);
  border-radius: clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16);
  background-color: #fff;
}

.product-detail--speakingquest .content .info-detail .logo {
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 50, var(--max) * 50);
  text-align: center;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .info-detail .logo {
    position: relative;
    z-index: 2;
    margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 25, var(--max) * 25);
    min-width: clamp(0px, 10vw / var(--board) * 10 * 170, var(--max) * 170);
    width: 41.6666666667vw;
    margin-inline: auto;
  }
}
.product-detail--speakingquest .content .info-detail .logo img {
  max-width: 100%;
  height: auto;
}

.product-detail--speakingquest .content .info-detail .chara {
  position: absolute;
  top: clamp(var(--max) * -30, 10vw / var(--board) * 10 * -30, 0px);
  right: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  width: clamp(0px, 10vw / var(--board) * 10 * 261, var(--max) * 261);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .info-detail .chara {
    top: -4.5572916667vw;
    right: 0;
    z-index: 1;
    min-width: clamp(0px, 10vw / var(--board) * 10 * 105, var(--max) * 105);
    min-height: clamp(0px, 10vw / var(--board) * 10 * 68, var(--max) * 68);
    width: 26.0416666667vw;
    height: clamp(0px, 10vw / var(--board) * 10 * 16.796875, var(--max) * 16.796875);
  }
}
.product-detail--speakingquest .content .info-detail .chara img {
  width: 100%;
  height: auto;
}

.product-detail--speakingquest .content .info-detail .wrap {
  display: flex;
  justify-content: space-between;
  padding: 0 clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30) clamp(0px, 10vw / var(--board) * 10 * 50, var(--max) * 50);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .info-detail .wrap {
    flex-direction: column;
  }
}

.product-detail--speakingquest .content .info-detail .movie {
  width: clamp(0px, 10vw / var(--board) * 10 * 400, var(--max) * 400);
  text-align: center;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .info-detail .movie {
    float: none;
    margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
    width: 100%;
  }
}
.product-detail--speakingquest .content .info-detail .movie img {
  width: 100%;
  height: auto;
  border-radius: clamp(0px, 10vw / var(--board) * 10 * 8, var(--max) * 8);
}

.product-detail--speakingquest .content .future-list {
  float: right;
  margin: 0;
  padding: 0;
  width: clamp(0px, 10vw / var(--board) * 10 * 440, var(--max) * 440);
  border-top: 1px solid #0081da;
  list-style: none;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .future-list {
    float: none;
    width: 100%;
  }
}
.product-detail--speakingquest .content .future-list li {
  position: relative;
  padding: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20) 0 clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20) clamp(0px, 10vw / var(--board) * 10 * 108, var(--max) * 108);
  border-bottom: 1px solid #0081da;
  font-weight: 700;
  font-size: clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16);
  line-height: 1.6;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .future-list li {
    padding: clamp(0px, 10vw / var(--board) * 10 * 10, var(--max) * 10) 0 clamp(0px, 10vw / var(--board) * 10 * 10, var(--max) * 10) clamp(0px, 10vw / var(--board) * 10 * 108, var(--max) * 108);
    font-size: clamp(0px, 10vw / var(--board) * 10 * 14, var(--max) * 14);
  }
  .product-detail--speakingquest .content .future-list li br {
    display: none;
  }
}
.product-detail--speakingquest .content .future-list li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: clamp(0px, 10vw / var(--board) * 10 * 108, var(--max) * 108);
  height: 100%;
  background-image: url(/miraiseed/products/assets-product/image/speakingquest/icon_point01_s.webp);
  background-position: left center;
  background-size: clamp(0px, 10vw / var(--board) * 10 * 85, var(--max) * 85) auto;
  background-repeat: no-repeat;
}
.product-detail--speakingquest .content .future-list .list01::before {
  background-image: url(/miraiseed/products/assets-product/image/speakingquest/icon_point01_s.webp);
}
.product-detail--speakingquest .content .future-list .list02::before {
  background-image: url(/miraiseed/products/assets-product/image/speakingquest/icon_point02_s.webp);
}
.product-detail--speakingquest .content .future-list .list03::before {
  background-image: url(/miraiseed/products/assets-product/image/speakingquest/icon_point03_s.webp);
}

.product-detail--speakingquest .content .functions.point02 {
  padding-top: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60);
  padding-bottom: clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30);
}

.product-detail--speakingquest .content .pdf-link {
  overflow: hidden;
  border-radius: 0 0 clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16) clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16);
}
.product-detail--speakingquest .content .pdf-link a {
  display: block;
  height: clamp(0px, 10vw / var(--board) * 10 * 70, var(--max) * 70);
  background-color: #2a3054;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 700;
  line-height: clamp(0px, 10vw / var(--board) * 10 * 70, var(--max) * 70);
}
.product-detail--speakingquest .content .pdf-link img {
  margin-right: clamp(0px, 10vw / var(--board) * 10 * 10, var(--max) * 10);
}

.product-detail--speakingquest .content .functions {
  padding: 0;
}

.product-detail--speakingquest .content .functions h2.underline {
  position: relative;
  margin: 0 auto clamp(0px, 10vw / var(--board) * 10 * 40, var(--max) * 40);
  padding-top: clamp(0px, 10vw / var(--board) * 10 * 80, var(--max) * 80);
  padding-bottom: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  width: clamp(0px, 10vw / var(--board) * 10 * 700, var(--max) * 700);
  border-bottom: 1px solid #0081da;
  color: #0081da;
  font-weight: 700;
  font-size: clamp(0px, 10vw / var(--board) * 10 * 28, var(--max) * 28);
  line-height: 1.5;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .functions h2.underline {
    padding-top: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60);
    width: 100%;
    font-size: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  }
}
.product-detail--speakingquest .content .functions h2.underline::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  margin-left: clamp(var(--max) * -76, 10vw / var(--board) * 10 * -76, 0px);
  width: clamp(0px, 10vw / var(--board) * 10 * 152, var(--max) * 152);
  height: clamp(0px, 10vw / var(--board) * 10 * 72, var(--max) * 72);
  background: url(/miraiseed/products/assets-product/image/speakingquest/icon_point01_l.webp) center top no-repeat;
  background-size: contain;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .functions h2.underline::before {
    margin-left: clamp(var(--max) * -60, 10vw / var(--board) * 10 * -60, 0px);
    width: clamp(0px, 10vw / var(--board) * 10 * 120, var(--max) * 120);
    height: clamp(0px, 10vw / var(--board) * 10 * 57, var(--max) * 57);
  }
}
.product-detail--speakingquest .content .functions h2.underline::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: clamp(0px, 10vw / var(--board) * 10 * 5, var(--max) * 5);
  left: 0;
  display: block;
  height: clamp(0px, 10vw / var(--board) * 10 * 1, var(--max) * 1);
  background: #0081da;
}

.product-detail--speakingquest .content .point02 h2.underline::before {
  background-image: url(/miraiseed/products/assets-product/image/speakingquest/icon_point02_l.webp);
}

.product-detail--speakingquest .content .point03 h2.underline::before {
  background-image: url(/miraiseed/products/assets-product/image/speakingquest/icon_point03_l.webp);
}

.product-detail--speakingquest .content .two-cols {
  display: flex;
  align-items: flex-start;
  gap: clamp(0px, 10vw / var(--board) * 10 * 40, var(--max) * 40);
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .two-cols {
    flex-direction: column-reverse !important;
    gap: 0;
    margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30);
  }
}
.product-detail--speakingquest .content .two-cols:nth-of-type(odd) {
  flex-direction: row-reverse;
}

@media (max-width: 768px) {
  .product-detail--speakingquest .content .point02 .two-cols,
  .product-detail--speakingquest .content .point03 .two-cols {
    flex-direction: column !important;
  }
}

.product-detail--speakingquest .content .two-cols__left,
.product-detail--speakingquest .content .two-cols__right {
  flex: 1;
}
.product-detail--speakingquest .content .two-cols__left img,
.product-detail--speakingquest .content .two-cols__right img {
  display: block;
  width: 100%;
  height: auto;
}

.product-detail--speakingquest .content .functions h3 {
  margin-top: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60);
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 25, var(--max) * 25);
  color: #0081da;
  font-weight: 700;
  font-size: clamp(0px, 10vw / var(--board) * 10 * 22, var(--max) * 22);
  line-height: 1.4;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .functions h3 {
    margin-top: clamp(0px, 10vw / var(--board) * 10 * 0, var(--max) * 0);
    margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
    font-size: clamp(0px, 10vw / var(--board) * 10 * 18, var(--max) * 18);
  }
}
.product-detail--speakingquest .content .functions h3.short {
  margin-top: clamp(0px, 10vw / var(--board) * 10 * 10, var(--max) * 10);
}

.product-detail--speakingquest .content .functions p {
  margin: 0 0 clamp(0px, 10vw / var(--board) * 10 * 25, var(--max) * 25);
  font-size: clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16);
  line-height: 2;
}

.product-detail--speakingquest .content .functions .note {
  margin-top: clamp(0px, 10vw / var(--board) * 10 * 15, var(--max) * 15);
  color: #666;
  font-size: clamp(0px, 10vw / var(--board) * 10 * 12, var(--max) * 12);
  line-height: 1.4;
}

.product-detail--speakingquest .content .functions .pageLink {
  margin-top: clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .functions .pageLink {
    position: relative;
  }
}
.product-detail--speakingquest .content .functions .pageLink a {
  position: relative;
  color: #0081da;
  text-decoration: none;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .functions .pageLink a {
    position: static;
  }
}
.product-detail--speakingquest .content .functions .pageLink a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -1em;
  width: 0.5em;
  height: 0.5em;
  border: 3px solid #2a3054;
  border-top: 0;
  border-left: 0;
  transform: translateY(-50%) rotate(-45deg);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .functions .pageLink a::after {
    right: 0;
  }
}

.product-detail--speakingquest .content .voice {
  padding: clamp(0px, 10vw / var(--board) * 10 * 80, var(--max) * 80) 0;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .voice {
    padding: clamp(0px, 10vw / var(--board) * 10 * 40, var(--max) * 40) 0;
  }
}

.product-detail--speakingquest .content .voicebox {
  overflow: hidden;
  background-color: #fff;
}

.product-detail--speakingquest .content .voicebox > h2 {
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 40, var(--max) * 40);
  height: clamp(0px, 10vw / var(--board) * 10 * 70, var(--max) * 70);
  background-color: #0081da;
  text-align: center;
  line-height: clamp(0px, 10vw / var(--board) * 10 * 70, var(--max) * 70);
}
.product-detail--speakingquest .content .voicebox > h2 img {
  width: auto;
  height: clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30);
  vertical-align: middle;
}

.product-detail--speakingquest .content .voicebox-body {
  padding: 0 clamp(0px, 10vw / var(--board) * 10 * 40, var(--max) * 40) clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .voicebox-body {
    padding: 0 clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20) clamp(0px, 10vw / var(--board) * 10 * 30, var(--max) * 30);
  }
}
.product-detail--speakingquest .content .voicebox-body h3 {
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  text-align: center;
}
.product-detail--speakingquest .content .voicebox-body h3 img {
  width: auto;
  height: clamp(0px, 10vw / var(--board) * 10 * 24, var(--max) * 24);
}

.product-detail--speakingquest .content .box-wrap {
  display: flex;
  justify-content: space-between;
  gap: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 40, var(--max) * 40);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .box-wrap {
    flex-direction: column;
  }
}
.product-detail--speakingquest .content .box-wrap:last-child {
  margin-bottom: 0;
}

.product-detail--speakingquest .content .voicebox-body .box {
  flex: 1;
  padding: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  border: 1px solid #0081da;
  border-radius: clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16);
}
.product-detail--speakingquest .content .voicebox-body .box .title {
  margin-bottom: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20);
  color: #0081da;
  font-weight: 700;
  font-size: clamp(0px, 10vw / var(--board) * 10 * 14, var(--max) * 14);
}
.product-detail--speakingquest .content .voicebox-body .box .title::before {
  content: "";
  display: inline-block;
  margin-right: clamp(0px, 10vw / var(--board) * 10 * 10, var(--max) * 10);
  width: clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16);
  height: clamp(0px, 10vw / var(--board) * 10 * 16, var(--max) * 16);
  border-radius: 50%;
  background-color: #0081da;
  vertical-align: middle;
}
.product-detail--speakingquest .content .voicebox-body .box img {
  width: 100%;
  height: auto;
}

.product-detail--speakingquest .content .button-area {
  padding: clamp(0px, 10vw / var(--board) * 10 * 40, var(--max) * 40) 0;
  text-align: center;
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .button-area {
    padding: clamp(0px, 10vw / var(--board) * 10 * 20, var(--max) * 20) 0;
  }
}
.product-detail--speakingquest .content .button-area a {
  display: inline-block;
  width: clamp(0px, 10vw / var(--board) * 10 * 400, var(--max) * 400);
  height: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60);
  border-radius: clamp(0px, 10vw / var(--board) * 10 * 4, var(--max) * 4);
  background-color: #2a3054;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 700;
  line-height: clamp(0px, 10vw / var(--board) * 10 * 60, var(--max) * 60);
}
@media (max-width: 768px) {
  .product-detail--speakingquest .content .button-area a {
    width: 90%;
  }
}
.product-detail--speakingquest .content .button-area img {
  margin-right: clamp(0px, 10vw / var(--board) * 10 * 10, var(--max) * 10);
}