@charset "UTF-8";

/*
/* common設定
/* -------------------------------------------------- */
:root {
--color-1:#1F3A5F;
--color-2:#F4F2EF;
--color-3:#7C858C;
  }
._fc_color-1 { color: var(--color-1); }
._fc_color-2 { color: var(--color-2); }
._fc_color-3 { color: var(--color-3); }
._bg_color-1 { background-color: var(--color-1); }
._bg_color-2 { background-color: var(--color-2); }
._bg_color-3 { background-color: var(--color-3); }
._border_color-1 { border-color: var(--color-1); }
._border_color-2 { border-color: var(--color-2); }
._border_color-3 { border-color: var(--color-3); }
/*
/* section_mv
/* -------------------------------------------------- */
.section_mv {
  background-image: url(/contents/other/business/campaign/mousepro_survey_2026/img/mv_bg.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.section_mv .mousepro_survey_2026_ribbon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:507px;
  aspect-ratio:507 / 54;
  padding:0 2.5em;
  box-sizing:border-box;
  background-image:url(/contents/other/business/campaign/mousepro_survey_2026/img/svg_ribbon.svg);
  background-position:center;
  background-repeat:no-repeat;
  background-size:contain;
  font-size:1.714em;
}
@media screen and (max-width:699px){
  .section_mv .mousepro_survey_2026_ribbon{
      width:min(100%,507px);
      padding:0 1.5em;
      font-size:clamp(1em,4vw,1.714em);
  }
}
.section_mv .mousepro_survey_2026_h1 {
  color: #fff;
  -webkit-text-stroke: clamp(4px, .55vw, 7px) #0061A2;
  paint-order: stroke fill;
}
.section_mv .mousepro_survey_2026_gurade {
  background: linear-gradient(90deg, #0070AC 0%, #0488D0 100%);
}
@media screen and (min-width: 700px){
  .section_mv .mousepro_survey_2026_ribbon {
    white-space: nowrap;
  }
  .section_mv .mousepro_survey_2026_gurade {
    border-radius: 20px;
  }
}
@media screen and (max-width: 699px){
  .section_mv .mousepro_survey_2026_ribbon {
    padding-right: 2.5em;
    padding-left: 2.5em;
  }
  .section_mv .mousepro_survey_2026_h1 {
    line-height: 1.35;
  }
}
/*
/* section_about
/* -------------------------------------------------- */
.section_about {
  position: relative;
  z-index: 1;
}
.section_about::after {
  content: "";
  position: absolute;
  bottom: -39px;
  left: 50%;
  width: 80px;
  height: 40px;
  background-color: var(--theme_color_mousepro_2);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  transform: translateX(-50%);
}
/*
/* section_campaign
/* -------------------------------------------------- */
.section_campaign {
  position: relative;
  background-image: url(/contents/other/business/campaign/mousepro_survey_2026/img/cp_bg.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.section_campaign img {
  box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, 0.25);
}
/*
/* section_table
/* -------------------------------------------------- */
.mousepro_survey_2026_table table {
  width: auto;
  max-width: 100%;
  margin-inline: auto;
  border-collapse: separate;
  border-spacing: 0 6px;
}
.mousepro_survey_2026_table._table tbody tr th,
.mousepro_survey_2026_table._table tbody tr td {
  box-sizing: border-box;
}
.mousepro_survey_2026_table._table tbody tr th {
  width: 27%;
  padding: 1em;
  border-right: 6px solid #fff;
  background-color: var(--theme_color_mousepro_2) !important;
  color: #fff;
  font-size: 1.25em;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  vertical-align: middle;
}
.mousepro_survey_2026_table._table tbody tr td {
  padding: .75em 1em;
  background-color: var(--theme_color_gray_light) !important;
  font-size: 1.25em;
  line-height: 1.5;
  text-align: left;
  vertical-align: middle;
}
.mousepro_survey_2026_table p {
  margin: 0;
}
@media screen and (max-width: 699px){
  .mousepro_survey_2026_table table,
  .mousepro_survey_2026_table tbody,
  .mousepro_survey_2026_table tr,
  .mousepro_survey_2026_table th,
  .mousepro_survey_2026_table td {
    display: block;
    width: 100%;
  }
  .mousepro_survey_2026_table table {
    border-spacing: 0;
  }
  .mousepro_survey_2026_table._table tbody tr {
    margin-bottom: 1em;
  }
  .mousepro_survey_2026_table._table tbody tr th {
    width: 100%;
    padding: .5em 1em;
    border-right: 0;
    font-size: 1em;
  }
  .mousepro_survey_2026_table._table tbody tr td {
    padding: .75em 1em;
    font-size: 1em;
  }
}



