/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }
body {
  color: #333333;
  background-color: #ecf5fb;
  font-family: "Noto Sans JP", sans-serif;
  -webkit-text-size-adjust: 100%;
          text-size-adjust: 100%; }

.common-container {
  position: relative;
  overflow: hidden; }

* {
  box-sizing: border-box; }

a {
  color: inherit;
  text-decoration: none; }

.hover-opacity {
  transition: opacity 0.3s; }

.common-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 1; }
  .common-header.is-scrolled .common-header__bar {
    background-color: white; }
  .common-header__bar {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 104px; }
  .common-header__logo {
    position: absolute;
    top: 30px;
    left: 30px;
    width: 176px; }
  .common-header__link-container {
    position: absolute;
    top: 0;
    right: 28px;
    display: flex; }
  .common-header__link {
    position: relative;
    margin: 0 15px;
    padding: 44px 0;
    color: #1052ba;
    font-size: 15px;
    cursor: pointer; }
    .common-header__link:after {
      position: absolute;
      top: calc(50% + 12px);
      right: 0;
      left: 0;
      height: 1px;
      background-color: #1052ba;
      opacity: 0;
      transition: opacity 0.3s;
      content: ""; }
    .common-header__link.is-current:after {
      opacity: 1; }

.common-footer {
  position: relative;
  margin-top: 100px;
  color: white;
  background-color: #2e4266; }
  .common-footer__box {
    position: relative;
    display: flex;
    max-width: 1140px;
    padding: 48px 32px;
    margin: 0 auto;
    box-sizing: content-box; }
  .common-footer__logo {
    width: 220px; }
  .common-footer__copyright {
    margin-top: 24px;
    font-size: 12px; }
  .common-footer__link-container {
    position: absolute;
    top: 88px;
    right: 32px;
    display: flex; }
  .common-footer__link {
    font-size: 14px; }
    .common-footer__link:not(:last-child) {
      margin-right: 28px; }

@-webkit-keyframes arrow-move {
  0% {
    -webkit-transform: translateX(-150%);
            transform: translateX(-150%); }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%); } }

@keyframes arrow-move {
  0% {
    -webkit-transform: translateX(-150%);
            transform: translateX(-150%); }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%); } }

.common-button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 344px;
  height: 72px;
  color: white;
  font-size: 20px;
  border-radius: 64px;
  background-image: linear-gradient(to right, #10b8ba, #2364db);
  transition: -webkit-filter 0.3s;
  transition: filter 0.3s;
  transition: filter 0.3s, -webkit-filter 0.3s;
  box-shadow: 5px 5px 10px 2px rgba(0, 0, 0, 0.1); }
  .common-button__arrow {
    position: absolute;
    top: 0;
    right: 20px;
    bottom: 0;
    width: 24px;
    height: 24px;
    margin: auto;
    overflow: hidden; }
    .common-button__arrow:after {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      background-image: url(/winpass/img/index/icon_arrow_4.png);
      content: ""; }
  .common-button.is-white {
    color: #10a8ba;
    background-color: white;
    background-image: none;
    box-shadow: none; }
    .common-button.is-white .common-button__arrow:after {
      background-image: url(/winpass/img/index/icon_arrow_3.png); }

.resizer {
  position: relative;
  opacity: 0;
  overflow: hidden; }
  .resizer.is-show {
    opacity: 1; }
  .resizer__content {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform-origin: center top;
            transform-origin: center top; }
  .resizer.is-inactive {
    overflow: initial; }
    .resizer.is-inactive .resizer__content {
      position: relative;
      top: auto;
      left: auto; }

@-webkit-keyframes show-delayed-show {
  0% {
    opacity: 0;
    -webkit-transform: translateY(15px);
            transform: translateY(15px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px); } }

@keyframes show-delayed-show {
  0% {
    opacity: 0;
    -webkit-transform: translateY(15px);
            transform: translateY(15px); }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px); } }

.delayed-show {
  opacity: 0; }
  .delayed-show.is-show {
    -webkit-animation: show-delayed-show 1.2s ease-out 0s forwards;
            animation: show-delayed-show 1.2s ease-out 0s forwards; }

.comp {
  display: none;
  position: relative;
  z-index: 99; }
  .comp__img {
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    opacity: 1;
    pointer-events: none; }
  .comp__input-container {
    position: fixed;
    top: 32px;
    right: 32px; }

.wrapper--index .firstview-background__content {
  position: absolute; }
  .wrapper--index .firstview-background__content--1 {
    top: 0;
    left: 0;
    width: 100%; }
  .wrapper--index .firstview-background__content--2 {
    top: 300px;
    left: 50%;
    width: 1768px;
    -webkit-transform: translateX(-50%) translateX(80px);
            transform: translateX(-50%) translateX(80px); }

.wrapper--index .firstview {
  position: relative;
  padding: 116px 88px 172px; }
  .wrapper--index .firstview__title {
    position: relative;
    color: #1052ba;
    font-size: 81px;
    font-weight: bold; }
    .wrapper--index .firstview__title small {
      font-size: 52px; }
      .wrapper--index .firstview__title small.is-size-2 {
        font-size: 58px; }
    .wrapper--index .firstview__title span {
      display: block;
      margin-top: 8px; }
  .wrapper--index .firstview__description {
    position: relative;
    line-height: 2em;
    max-width: 470px;
    margin-top: 32px;
    color: #2f3b50;
    letter-spacing: 0.01em; }
  .wrapper--index .firstview .common-button {
    position: relative;
    margin-top: 28px; }
  .wrapper--index .firstview__picture-container {
    position: absolute;
    top: 96px;
    left: calc(50% - 24px);
    width: 550px; }
  .wrapper--index .firstview__picture-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 616px;
    opacity: 0; }
  .wrapper--index .firstview__picture {
    position: relative;
    width: 570px; }
    .wrapper--index .firstview__picture canvas {
      position: absolute;
      top: -38px;
      left: 0;
      width: 100%;
      -webkit-transform-origin: center 53.2%;
              transform-origin: center 53.2%; }

@keyframes arrow-move {
  0% {
    -webkit-transform: translateX(-150%);
            transform: translateX(-150%); }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%); } }

@-webkit-keyframes apply-small-decoration-rotate {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes apply-small-decoration-rotate {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.wrapper--index .firstview-apply-small {
  position: fixed;
  right: 22px;
  bottom: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 150px;
  height: 150px;
  color: white;
  font-size: 20px;
  border-radius: 50%;
  background-image: linear-gradient(to right, #10b8ba, #2364db);
  transition: -webkit-filter 0.3s;
  transition: filter 0.3s;
  transition: filter 0.3s, -webkit-filter 0.3s;
  z-index: 2;
  will-change: transform; }
  .wrapper--index .firstview-apply-small__decoration {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 124px;
    height: auto;
    margin: auto;
    -webkit-animation: apply-small-decoration-rotate 12s linear 0s infinite;
            animation: apply-small-decoration-rotate 12s linear 0s infinite; }
  .wrapper--index .firstview-apply-small__title {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    font-size: 18px;
    text-align: center;
    -webkit-transform: translateY(-16px);
            transform: translateY(-16px); }
  .wrapper--index .firstview-apply-small__arrow {
    position: absolute;
    right: 0;
    bottom: -32px;
    left: 0;
    width: 24px;
    height: 24px;
    margin: auto;
    overflow: hidden; }
    .wrapper--index .firstview-apply-small__arrow:after {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      background-image: url(/winpass/img/index/icon_arrow_4.png);
      content: ""; }

.wrapper--index .section__title {
  position: relative;
  margin-bottom: 76px;
  color: #1052ba;
  font-size: 40px;
  font-weight: bold;
  text-align: center; }
  .wrapper--index .section__title:after {
    position: absolute;
    right: 0;
    bottom: -44px;
    left: 0;
    width: 64px;
    height: 20px;
    margin: 0 auto;
    background-image: url(/winpass/img/index/section_title_decoration.png);
    background-size: contain;
    background-repeat: no-repeat;
    content: ""; }

.wrapper--index .section__description-large {
  position: relative;
  line-height: 1.8em;
  margin-bottom: 20px;
  font-size: 32px;
  text-align: center; }

.wrapper--index .section__description-middle {
  position: relative;
  line-height: 1.6em;
  font-size: 18px;
  text-align: center; }

.wrapper--index .section__description {
  position: relative;
  line-height: 2em;
  text-align: center; }

.wrapper--index .introduction {
  position: relative;
  padding: 1px 56px 96px; }
  .wrapper--index .introduction__content-container {
    position: relative;
    display: flex;
    justify-content: center;
    max-width: 1172px;
    margin: 72px auto 0; }

.wrapper--index .introduction-content {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc((100% - 28px * 3) / 4);
  height: 230px; }
  .wrapper--index .introduction-content:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 8px;
    background-image: linear-gradient(to bottom right, #8ad0e7, #1052ba);
    content: ""; }
  .wrapper--index .introduction-content:not(:first-child) {
    margin-left: 28px; }
  .wrapper--index .introduction-content__background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 8px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.5;
    mix-blend-mode: soft-light; }
  .wrapper--index .introduction-content__point {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: -20px;
    right: 0;
    left: 0;
    width: 120px;
    height: 40px;
    margin: 0 auto;
    color: white;
    border-radius: 24px;
    background-color: #10a8ba; }
  .wrapper--index .introduction-content__title {
    position: relative;
    color: white;
    font-size: 28px;
    font-weight: bold;
    text-align: center; }
    .wrapper--index .introduction-content__title span,
    .wrapper--index .introduction-content__title small {
      display: block;
      margin: 12px 0; }
    .wrapper--index .introduction-content__title small {
      font-size: 18px;
      font-weight: normal; }

.wrapper--index .box {
  position: relative;
  margin: 0 auto;
  padding: 40px 32px 32px;
  border-radius: 8px;
  background-color: white; }
  .wrapper--index .box__title {
    position: relative;
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    color: #1052ba; }
    .wrapper--index .box__title:after {
      position: absolute;
      right: 0;
      bottom: -22px;
      left: 0;
      margin: 0 auto;
      width: 40px;
      height: 1px;
      background-color: #1052ba;
      content: ""; }
  .wrapper--index .box__description {
    line-height: 2em;
    margin-top: 32px;
    text-align: center; }

.wrapper--index .movie {
  position: relative;
  max-width: 654px; }
  .wrapper--index .movie__content {
    position: relative;
    margin-top: 32px; }
    .wrapper--index .movie__content iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100% !important; }

.wrapper--index .theme {
  position: relative;
  max-width: 1060px;
  margin: 92px auto 80px;
  padding: 56px 60px; }

.wrapper--index .theme-sample {
  position: relative;
  padding: 40px 40px 60px;
  margin-top: 40px;
  background-color: #ecfafb;
  border-radius: 8px; }
  .wrapper--index .theme-sample__title {
    text-align: center;
    font-size: 20px;
    color: #10a8ba; }
  .wrapper--index .theme-sample__content-container {
    display: flex;
    flex-wrap: wrap;
    margin-top: 20px; }
  .wrapper--index .theme-sample__movie-list {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 340px;
    height: 72px;
    margin: 40px auto 0;
    color: #10a8ba;
    background-color: white;
    border: 2px solid #10a8ba;
    border-radius: 64px;
    font-size: 18px;
    transition-property: color, background-color;
    transition-duration: 0.3s; }
    .wrapper--index .theme-sample__movie-list:before {
      display: inline-block;
      left: 32px;
      width: 19px;
      height: 14px;
      margin-right: 12px;
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      background-image: url(/winpass/img/index/icon_list.png);
      vertical-align: middle;
      -webkit-transform: translateY(1px);
              transform: translateY(1px);
      content: ""; }
  .wrapper--index .theme-sample__caution {
    margin-top: 40px;
    font-size: 14px;
    text-align: center; }
    .wrapper--index .theme-sample__caution a {
      position: relative;
      color: #10a8ba; }
      .wrapper--index .theme-sample__caution a:before {
        position: absolute;
        right: 0;
        bottom: -4px;
        left: 0;
        height: 1px;
        background-color: #10a8ba;
        content: ""; }

.wrapper--index .theme-sample-content {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  width: calc((100% - 26px * 2) / 3);
  height: 80px;
  line-height: 1.6em;
  padding-left: 32px;
  background-color: white;
  border-radius: 4px; }
  .wrapper--index .theme-sample-content:before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 10px;
    background-color: #10a8ba;
    content: ""; }
  .wrapper--index .theme-sample-content:not(:nth-child(3n + 1)) {
    margin-left: 26px; }
  .wrapper--index .theme-sample-content:nth-child(n + 4) {
    margin-top: 16px; }
  .wrapper--index .theme-sample-content small {
    display: block;
    font-size: 14px; }

.wrapper--index .banner {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(100% - 48px * 2);
  max-width: 1172px;
  margin: 0 auto;
  padding: 64px 0;
  border-radius: 8px;
  background-image: linear-gradient(to left, #10b8ba, #2364db); }
  .wrapper--index .banner__title {
    line-height: 1.7em;
    color: white;
    font-size: 36px; }
  .wrapper--index .banner .common-button {
    margin-left: 40px; }

.wrapper--index .reason {
  position: relative;
  margin: 260px 0 0;
  padding: 1px 0;
  background-color: #e1eefa; }
  .wrapper--index .reason__decoration {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }
  .wrapper--index .reason__content-container {
    position: relative;
    margin-top: 32px;
    padding: 0 120px; }

.wrapper--index .reason-content {
  position: relative;
  max-width: 1040px;
  margin: 0 auto;
  padding: 54px 0; }
  .wrapper--index .reason-content__circle-decoration {
    position: absolute; }
    .wrapper--index .reason-content__circle-decoration--1 {
      top: 100px;
      left: calc(50% - 640px); }
    .wrapper--index .reason-content__circle-decoration--2 {
      top: 340px;
      left: calc(50% + 300px); }
  .wrapper--index .reason-content__question {
    position: absolute;
    top: 22px;
    left: 0;
    width: 400px;
    line-height: 1.9em;
    padding: 48px;
    border-radius: 8px;
    color: white;
    background-color: #1052ba;
    font-size: 18px;
    z-index: 1; }
    .wrapper--index .reason-content__question:before {
      position: absolute;
      top: 32px;
      left: 32px;
      width: 70px;
      height: 56px;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      background-image: url(/winpass/img/index/icon_quote.png);
      content: ""; }
  .wrapper--index .reason-content__answer {
    position: relative;
    max-width: calc(100% - 350px);
    margin-left: auto;
    line-height: 2em;
    padding: 64px 80px;
    font-size: 14px;
    background-color: white;
    border-radius: 8px;
    overflow: hidden; }
    .wrapper--index .reason-content__answer strong {
      display: block;
      line-height: 1.9em;
      margin: 20px 0;
      font-size: 18px;
      font-weight: bold;
      color: #1052ba; }
  .wrapper--index .reason-content__answer-content {
    position: relative; }
  .wrapper--index .reason-content__index {
    position: absolute;
    right: -6px;
    bottom: -12px;
    line-height: 1em;
    font-size: 180px;
    font-weight: bold;
    color: #ecf5fb; }
  .wrapper--index .reason-content:nth-child(even) .reason-content__question {
    right: 0;
    left: auto; }
    .wrapper--index .reason-content:nth-child(even) .reason-content__question:before {
      left: 32px; }
  .wrapper--index .reason-content:nth-child(even) .reason-content__answer {
    margin-right: auto;
    margin-left: 0; }
  .wrapper--index .reason-content:nth-child(even) .reason-content__index {
    right: auto;
    left: -6px; }

.wrapper--index .reason-feature {
  position: relative;
  width: calc(100% - 120px * 2);
  max-width: 1040px;
  margin: 96px auto 84px;
  padding: 64px 80px;
  border-radius: 8px;
  background-color: white; }
  .wrapper--index .reason-feature:after {
    position: absolute;
    top: -88px;
    right: 0;
    left: 0;
    width: 250px;
    height: 130px;
    margin: 0 auto;
    background-image: url(/winpass/img/index/icon_arrow.png);
    background-size: contain;
    background-repeat: no-repeat;
    content: ""; }
  .wrapper--index .reason-feature__content {
    width: calc(50% + 28px); }
  .wrapper--index .reason-feature__description {
    line-height: 2em;
    margin-bottom: 28px;
    font-size: 14px; }
    .wrapper--index .reason-feature__description strong {
      display: block;
      line-height: 1.8em;
      margin: 24px 0;
      font-size: 18px;
      font-weight: bold;
      color: #1052ba; }
  .wrapper--index .reason-feature__picture {
    position: absolute;
    top: 100px;
    left: calc(50% + 90px);
    border-radius: 8px; }

.wrapper--index .reason-feature-point {
  position: relative;
  padding: 56px 36px 32px;
  background-color: #ecfafb;
  border-radius: 8px; }
  .wrapper--index .reason-feature-point:before {
    position: absolute;
    top: -16px;
    right: 0;
    left: 0;
    width: 41px;
    height: 62px;
    margin: 0 auto;
    background-image: url(/winpass/img/index/icon_light.png);
    background-size: contain;
    background-repeat: no-repeat;
    content: ""; }
  .wrapper--index .reason-feature-point__title {
    line-height: 1.9em;
    font-size: 18px;
    font-weight: bold;
    color: #1052ba; }
  .wrapper--index .reason-feature-point__description {
    line-height: 2em;
    margin-top: 16px;
    font-size: 14px; }

.wrapper--index .banner-container {
  position: relative;
  padding-bottom: 100px;
  background-color: #e1eefa; }
  .wrapper--index .banner-container__decoration {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    -webkit-transform: translateY(100%) scaleY(-1);
            transform: translateY(100%) scaleY(-1); }

.wrapper--index .scene {
  position: relative;
  padding: 220px 0 0; }
  .wrapper--index .scene__decoration {
    position: absolute; }
    .wrapper--index .scene__decoration--1 {
      top: 790px;
      left: calc(50% - 740px);
      width: 664px;
      height: auto; }
    .wrapper--index .scene__decoration--2 {
      top: 1200px;
      left: calc(50% - 200px);
      width: 1076px;
      height: auto; }
  .wrapper--index .scene__content-container {
    display: flex;
    max-width: 1288px;
    margin: 108px auto 0;
    padding: 0 48px; }

.wrapper--index .scene-content {
  position: relative;
  width: calc((100% - 40px * 2) / 3); }
  .wrapper--index .scene-content:not(:first-child) {
    margin-left: 40px; }
  .wrapper--index .scene-content__title-container {
    position: relative;
    min-height: 240px; }
    .wrapper--index .scene-content__title-container:before {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      border-top-right-radius: 8px;
      border-top-left-radius: 8px;
      background-image: linear-gradient(to bottom right, #8ad0e7, #1052ba);
      content: ""; }
  .wrapper--index .scene-content__background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.5;
    mix-blend-mode: soft-light; }
  .wrapper--index .scene-content__index {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: -20px;
    right: 0;
    left: 0;
    width: 120px;
    height: 40px;
    margin: 0 auto;
    color: white;
    border-radius: 24px;
    background-color: #10a8ba; }
  .wrapper--index .scene-content__title {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.9em;
    font-size: 20px;
    color: white;
    text-align: center; }
  .wrapper--index .scene-content__description {
    position: relative;
    line-height: 2em;
    padding: 32px 40px 40px 80px;
    font-size: 15px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    background-color: white; }
    .wrapper--index .scene-content__description:before {
      position: absolute;
      top: 38px;
      left: 40px;
      width: 22px;
      height: 22px;
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      background-image: url(/winpass/img/index/icon_check.png);
      content: ""; }

.wrapper--index .step {
  position: relative;
  padding: 120px 0 0; }
  .wrapper--index .step__content-container {
    max-width: 740px;
    margin: 0 auto;
    padding: 0 48px;
    box-sizing: content-box;
    -webkit-transform: translateX(20px);
            transform: translateX(20px); }
  .wrapper--index .step__caution {
    line-height: 2em;
    margin-top: 24px;
    font-size: 14px; }

.wrapper--index .step-content {
  position: relative;
  display: flex;
  align-items: center;
  padding: 48px 56px;
  background-color: white;
  border-radius: 8px; }
  .wrapper--index .step-content:not(:first-child) {
    margin-top: 72px; }
    .wrapper--index .step-content:not(:first-child):before {
      position: absolute;
      top: -48px;
      right: 0;
      left: 0;
      width: 29px;
      height: 31px;
      margin: 0 auto;
      background-image: url(/winpass/img/index/icon_arrow_2.png);
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      -webkit-transform: translateX(-20px);
              transform: translateX(-20px);
      content: ""; }
  .wrapper--index .step-content__information {
    flex-grow: 1;
    padding-right: 48px; }
  .wrapper--index .step-content__title {
    color: #1052ba;
    font-weight: bold;
    font-size: 26px; }
  .wrapper--index .step-content__description {
    line-height: 2em;
    margin-top: 16px;
    font-size: 15px; }
  .wrapper--index .step-content__picture {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center; }
  .wrapper--index .step-content:nth-child(1) .step-content__picture {
    width: 100px;
    height: 100px;
    margin-right: 10px; }

.wrapper--index .step-content-index {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  position: absolute;
  top: -24px;
  left: -80px;
  width: 100px;
  height: 100px;
  text-align: center;
  color: #1052ba;
  background-image: url(/winpass/img/index/icon_circle.png);
  background-position: center;
  background-size: contain; }
  .wrapper--index .step-content-index__number {
    font-size: 36px; }

.wrapper--index .price {
  position: relative;
  padding: 120px 0 0; }

.wrapper--index .price-banner {
  position: relative;
  display: flex;
  max-width: 920px;
  margin: 0 auto;
  padding: 54px 28px;
  background-color: white;
  border-radius: 8px; }
  .wrapper--index .price-banner__badge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 120px;
    color: white;
    font-size: 24px;
    font-weight: bold;
    background-image: url(/winpass/img/index/icon_badge.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center; }
  .wrapper--index .price-banner__title-container {
    position: relative;
    margin-left: 24px; }
  .wrapper--index .price-banner__title {
    font-size: 60px;
    font-weight: bold;
    color: #1052ba; }
    .wrapper--index .price-banner__title .is-small-1 {
      font-size: 36px; }
    .wrapper--index .price-banner__title .is-small-2 {
      font-size: 26px; }
    .wrapper--index .price-banner__title .is-small-3 {
      font-size: 20px; }
  .wrapper--index .price-banner__description {
    line-height: 2em;
    margin-top: 20px;
    font-size: 13px; }
  .wrapper--index .price-banner__picture {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 446px; }

.wrapper--index .question {
  position: relative;
  padding: 120px 0; }
  .wrapper--index .question__content-container {
    max-width: 920px;
    margin: 0 auto;
    box-sizing: content-box; }
  .wrapper--index .question__caution {
    margin-top: 40px;
    font-size: 14px; }
    .wrapper--index .question__caution a {
      position: relative;
      color: #10a8ba; }
      .wrapper--index .question__caution a:before {
        position: absolute;
        right: 0;
        bottom: -4px;
        left: 0;
        height: 1px;
        background-color: #10a8ba;
        content: ""; }

.wrapper--index .question-content {
  position: relative;
  margin: 20px 0;
  border-radius: 8px;
  background-color: white;
  overflow: hidden;
  cursor: pointer; }
  .wrapper--index .question-content__question {
    position: relative;
    line-height: 2em;
    padding: 24px 100px;
    font-weight: bold; }
    .wrapper--index .question-content__question:before {
      position: absolute;
      top: 16px;
      left: 34px;
      width: 50px;
      height: 50px;
      background-image: url(/winpass/img/index/icon_q.png);
      background-size: contain;
      background-repeat: no-repeat;
      content: ""; }
  .wrapper--index .question-content__answer-container {
    position: relative;
    height: 0;
    overflow: hidden;
    transition: height 0.3s; }
  .wrapper--index .question-content__answer {
    position: relative;
    line-height: 2em;
    padding: 20px 32px 20px 100px;
    background-color: #f6f6f6;
    border-top: 1px solid #dddddd; }
    .wrapper--index .question-content__answer:before {
      position: absolute;
      top: 16px;
      left: 34px;
      width: 50px;
      height: 50px;
      background-image: url(/winpass/img/index/icon_a.png);
      background-size: contain;
      background-repeat: no-repeat;
      content: ""; }
    .wrapper--index .question-content__answer a {
      text-decoration: underline; }
  .wrapper--index .question-content__icon {
    position: absolute;
    top: 24px;
    right: 40px;
    width: 32px;
    height: 32px;
    transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s; }
    .wrapper--index .question-content__icon:before, .wrapper--index .question-content__icon:after {
      position: absolute;
      top: calc(50% - 1px);
      right: 0;
      left: 0;
      height: 2px;
      background-color: #10a8ba;
      content: ""; }
    .wrapper--index .question-content__icon:after {
      -webkit-transform: scaleY(1) rotate(90deg);
              transform: scaleY(1) rotate(90deg);
      transition: -webkit-transform 0.3s;
      transition: transform 0.3s;
      transition: transform 0.3s, -webkit-transform 0.3s; }
  .wrapper--index .question-content.is-open .question-content__icon:after {
    -webkit-transform: scaleY(0) rotate(90deg);
            transform: scaleY(0) rotate(90deg); }

.wrapper--terms .container {
  padding: 150px 20px 100px;
  max-width: 860px;
  min-height: 100vh;
  margin: 0 auto;
  box-sizing: content-box; }

.wrapper--terms .page-title {
  position: relative;
  color: #1052ba;
  text-align: center;
  font-size: 40px;
  font-weight: bold;
  letter-spacing: 0.02em; }
  .wrapper--terms .page-title:after {
    position: absolute;
    right: 0;
    bottom: -44px;
    left: 0;
    width: 64px;
    height: 20px;
    margin: 0 auto;
    background-image: url(/winpass/img/index/section_title_decoration.png);
    background-size: contain;
    background-repeat: no-repeat;
    content: ""; }

.wrapper--terms .page-description {
  line-height: 1.9em;
  padding-top: 90px;
  letter-spacing: 0.01em; }

.wrapper--terms .content-container {
  padding: 4px 0 0; }
  .wrapper--terms .content-container h3 {
    padding-top: 72px;
    font-size: 24px;
    font-weight: bold;
    color: #1052ba; }
  .wrapper--terms .content-container p {
    line-height: 2em;
    margin-top: 24px; }
  .wrapper--terms .content-container ol {
    margin-top: 8px; }
  .wrapper--terms .content-container li {
    position: relative;
    line-height: 2em;
    padding: 12px 0 12px 40px; }
    .wrapper--terms .content-container li span.is-number {
      position: absolute;
      top: 12px;
      left: 0; }
    .wrapper--terms .content-container li a {
      position: relative;
      color: #10a8ba; }
      .wrapper--terms .content-container li a:after {
        position: absolute;
        right: 0;
        bottom: -2px;
        left: 0;
        height: 1px;
        background-color: #10a8ba;
        content: ""; }

.wrapper--terms .page-suffix {
  margin-top: 20px;
  text-align: right; }

.wrapper--terms .button-to-top {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 70px;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none; }
  .wrapper--terms .button-to-top.is-show {
    opacity: 1;
    pointer-events: auto; }
  @media (min-width: 800px) {
    .hover-opacity:hover {
      opacity: 0.6; }
  .only-sp {
    display: none; }
      .common-header__link:hover:after {
        opacity: 1; }
      .common-footer__link:hover {
        text-decoration: underline; }
    .common-button:hover {
      -webkit-filter: brightness(1.2);
              filter: brightness(1.2); }
      .common-button:hover .common-button__arrow:after {
        -webkit-animation: arrow-move 0.5s cubic-bezier(0.22, 1, 0.36, 1);
                animation: arrow-move 0.5s cubic-bezier(0.22, 1, 0.36, 1); }
    .wrapper--index .firstview-apply-small:hover {
      -webkit-filter: brightness(1.2);
              filter: brightness(1.2); }
      .wrapper--index .firstview-apply-small:hover .firstview-apply-small__arrow:after {
        -webkit-animation: arrow-move 0.5s cubic-bezier(0.22, 1, 0.36, 1);
                animation: arrow-move 0.5s cubic-bezier(0.22, 1, 0.36, 1); }
      .wrapper--index .theme-sample__movie-list:hover {
        color: white;
        background-color: #10a8ba; }
        .wrapper--index .theme-sample__movie-list:hover:before {
          background-image: url(/winpass/img/index/icon_list.white.png); }
        .wrapper--index .theme-sample__caution a:hover:before {
          display: none; }
        .wrapper--index .question__caution a:hover:before {
          display: none; }
        .wrapper--index .question-content__answer a:hover {
          text-decoration: none; }
    .wrapper--index .question-content:hover .question-content__icon {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg); }
        .wrapper--terms .content-container li a:hover:after {
          display: none; } }
  @media (max-width: 799px) {
  .only-pc {
    display: none; }
  .common-header {
    z-index: 3; }
    .common-header__bar {
      height: 66px; }
    .common-header__logo {
      top: 15px;
      left: 15px;
      width: 156px; }
    .common-header.is-open .common-menu {
      opacity: 1;
      pointer-events: auto; }
    .common-header.is-open .common-menu-button__line:nth-child(1) {
      -webkit-transform: translateY(8px) rotate(45deg);
              transform: translateY(8px) rotate(45deg); }
    .common-header.is-open .common-menu-button__line:nth-child(2) {
      -webkit-transform: scaleX(0);
              transform: scaleX(0); }
    .common-header.is-open .common-menu-button__line:nth-child(3) {
      -webkit-transform: translateY(-8px) rotate(-45deg);
              transform: translateY(-8px) rotate(-45deg); }
  .common-menu-button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 15px 15px; }
    .common-menu-button__line {
      width: 30px;
      height: 2px;
      margin-top: 6px;
      background-color: #1052ba;
      transition: -webkit-transform 0.3s;
      transition: transform 0.3s;
      transition: transform 0.3s, -webkit-transform 0.3s; }
  .common-menu {
    display: flex;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/winpass/img/index/menu_background.jpg);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s; }
    .common-menu__box {
      margin: auto; }
    .common-menu__link {
      display: block;
      padding: 16px 0;
      text-align: center;
      color: #1052ba; }
    .common-menu__apply {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 280px;
      height: 60px;
      margin: 28px auto 0;
      color: white;
      font-weight: bold;
      border-radius: 32px;
      background-image: linear-gradient(to right, #10b8ba, #2364db); }
      .common-menu__apply:after {
        position: absolute;
        top: 0;
        right: 20px;
        bottom: 0;
        width: 24px;
        height: 24px;
        margin: auto;
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        background-image: url(/winpass/img/index/icon_arrow_4.png);
        content: ""; }
  .common-footer {
    margin-top: 60px; }
    .common-footer__box {
      flex-direction: column-reverse;
      padding: 36px 20px 16px; }
    .common-footer__main {
      margin-top: 32px; }
    .common-footer__logo {
      width: 164px; }
    .common-footer__copyright {
      margin-top: 16px;
      font-size: 10px; }
    .common-footer__link-container {
      position: relative;
      flex-wrap: wrap;
      top: auto;
      right: auto; }
    .common-footer__link {
      display: block;
      width: 50%;
      padding: 8px 0;
      font-size: 12px; }
      .common-footer__link:not(:last-child) {
        margin-right: 0; }
  .common-button {
    width: calc(100% - 28px * 2);
    max-width: 100%;
    height: 60px;
    font-size: 17px; }
    .common-button__arrow {
      right: 16px; }
  .comp__input-container {
    top: 0;
    right: 16px; }
  .wrapper--index {
    font-size: 12px; }
  .wrapper--index .firstview-background__content--2 {
    top: 650px;
    width: 800px;
    -webkit-transform: translateX(-50%) translateX(100px);
            transform: translateX(-50%) translateX(100px); }
  .wrapper--index .firstview {
    padding: 370px 20px 86px; }
    .wrapper--index .firstview__title {
      font-size: 47px;
      text-align: center;
      white-space: nowrap; }
      .wrapper--index .firstview__title small {
        font-size: 30px; }
        .wrapper--index .firstview__title small.is-size-2 {
          font-size: 34px; }
      .wrapper--index .firstview__title span {
        margin-top: 10px;
        margin-left: 24px; }
    .wrapper--index .firstview__description {
      max-width: initial;
      margin-top: 20px; }
    .wrapper--index .firstview .common-button {
      margin: 20px auto 0; }
    .wrapper--index .firstview__picture-container {
      top: 64px;
      right: 0;
      left: 0;
      width: calc(100% - 44px * 2);
      max-width: 287px;
      margin: 0 auto; }
    .wrapper--index .firstview__picture-background {
      width: 332px;
      max-width: calc(100vw - 43px);
      left: -8px; }
    .wrapper--index .firstview__picture {
      width: 310px;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%); }
      .wrapper--index .firstview__picture canvas {
        top: -20px; }
  .wrapper--index .firstview-apply-small {
    right: 8px;
    bottom: 8px;
    width: 90px;
    height: 90px;
    font-size: 11px; }
    .wrapper--index .firstview-apply-small__decoration {
      width: 74px; }
    .wrapper--index .firstview-apply-small__title {
      font-size: 11px;
      -webkit-transform: translateY(-12px);
              transform: translateY(-12px); }
      .wrapper--index .firstview-apply-small__title:after {
        bottom: -20px;
        width: 16px;
        height: 16px; }
  .wrapper--index .section__title {
    margin-bottom: 48px;
    font-size: 29px; }
    .wrapper--index .section__title:after {
      bottom: -36px;
      width: calc(64px * 0.8);
      height: calc(20px * 0.8); }
  .wrapper--index .section__description-large {
    margin-bottom: 12px;
    font-size: 18px; }
  .wrapper--index .section__description-middle {
    font-size: 14px; }
  .wrapper--index .section__description {
    text-align: left; }
    .wrapper--index .section__description br {
      display: none; }
  .wrapper--index .introduction {
    padding: 1px 20px 36px; }
    .wrapper--index .introduction__content-container {
      flex-wrap: wrap;
      margin-top: 36px; }
  .wrapper--index .introduction-content {
    display: block;
    width: calc((100% - 16px) / 2);
    height: auto; }
    .wrapper--index .introduction-content:not(:first-child) {
      margin-left: 0; }
    .wrapper--index .introduction-content:nth-child(even) {
      margin-left: 16px; }
    .wrapper--index .introduction-content:nth-child(n + 3) {
      margin-top: 32px; }
    .wrapper--index .introduction-content__background {
      position: relative;
      padding-top: 75%;
      border-radius: 4px; }
    .wrapper--index .introduction-content__point {
      top: -12px;
      width: 76px;
      height: 26px;
      font-size: 11px; }
    .wrapper--index .introduction-content__title {
      position: absolute;
      top: 50%;
      right: 0;
      left: 0;
      font-size: 20px;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%); }
      .wrapper--index .introduction-content__title span,
      .wrapper--index .introduction-content__title small {
        margin: 6px 0; }
      .wrapper--index .introduction-content__title span {
        line-height: 1.3em; }
      .wrapper--index .introduction-content__title small {
        font-size: 13px; }
  .wrapper--index .box {
    margin: 0 auto;
    padding: 32px 20px 16px;
    border-radius: 4px; }
    .wrapper--index .box__title {
      font-size: 24px; }
      .wrapper--index .box__title:after {
        bottom: -16px; }
    .wrapper--index .box__description {
      margin-top: 28px;
      text-align: left; }
      .wrapper--index .box__description br {
        display: none; }
  .wrapper--index .movie {
    max-width: calc(100% - 20px * 2); }
    .wrapper--index .movie__content {
      margin-top: 16px; }
  .wrapper--index .theme {
    max-width: calc(100% - 20px * 2);
    margin: 42px auto 48px;
    padding: 32px 20px 16px; }
  .wrapper--index .theme-sample {
    padding: 20px 8px 30px;
    margin-top: 28px;
    border-radius: 4px; }
    .wrapper--index .theme-sample__title {
      font-size: 17px; }
    .wrapper--index .theme-sample__content-container {
      margin-top: 20px; }
    .wrapper--index .theme-sample__movie-list {
      width: 248px;
      max-width: 100%;
      height: 54px;
      margin: 24px auto 0;
      font-size: 17px;
      border-width: 1.5px; }
      .wrapper--index .theme-sample__movie-list:before {
        margin-right: 8px; }
    .wrapper--index .theme-sample__caution {
      line-height: 1.8em;
      margin-top: 16px;
      font-size: 12px; }
  .wrapper--index .theme-sample-content {
    width: calc((100% - 10px) / 2);
    height: 40px;
    padding-left: 14px;
    border-radius: 4px;
    font-size: 10px; }
    .wrapper--index .theme-sample-content:before {
      width: 5px; }
    .wrapper--index .theme-sample-content:not(:nth-child(3n + 1)) {
      margin-left: 0; }
    .wrapper--index .theme-sample-content:nth-child(even) {
      margin-left: 10px; }
    .wrapper--index .theme-sample-content:nth-child(n + 4) {
      margin-top: 0; }
    .wrapper--index .theme-sample-content:nth-child(n + 3) {
      margin-top: 10px; }
    .wrapper--index .theme-sample-content small {
      margin-top: -2px;
      font-size: 10px;
      -webkit-transform-origin: left center;
              transform-origin: left center;
      -webkit-transform: scale(0.8);
              transform: scale(0.8);
      white-space: nowrap; }
  .wrapper--index .banner {
    display: block;
    width: calc(100% - 20px * 2);
    padding: 24px 28px 28px;
    border-radius: 4px; }
    .wrapper--index .banner__title {
      font-size: 22px; }
    .wrapper--index .banner .common-button {
      width: 100%;
      margin-top: 16px;
      margin-left: 0;
      font-weight: bold; }
  .wrapper--index .reason {
    margin: 156px 0 0; }
    .wrapper--index .reason__background {
      top: 90px;
      width: 100%; }
    .wrapper--index .reason__content-container {
      margin-top: 12px;
      padding: 0; }
  .wrapper--index .reason-content {
    margin: 36px 0;
    padding: 0; }
    .wrapper--index .reason-content__circle-decoration--1 {
      top: auto;
      bottom: -50px;
      left: calc(50% - 240px);
      width: 140px; }
    .wrapper--index .reason-content__circle-decoration--2 {
      top: auto;
      bottom: -60px;
      left: calc(50% + 90px);
      width: 110px; }
    .wrapper--index .reason-content__question {
      position: relative;
      top: auto;
      margin-left: 20px;
      width: 292px;
      line-height: 1.6em;
      padding: 24px;
      border-radius: 4px;
      font-size: 14px; }
      .wrapper--index .reason-content__question:before {
        top: 16px;
        left: 14px;
        width: calc(70px * 0.5);
        height: calc(56px * 0.5); }
    .wrapper--index .reason-content__answer {
      max-width: calc(100% - 40px);
      margin-top: -28px;
      padding: 48px 32px 24px 24px;
      font-size: 12px;
      border-radius: 4px; }
      .wrapper--index .reason-content__answer strong {
        margin: 12px 0;
        font-size: 14px; }
    .wrapper--index .reason-content__index {
      font-size: 120px; }
    .wrapper--index .reason-content:nth-child(even) .reason-content__question {
      margin-right: 20px;
      margin-left: auto; }
      .wrapper--index .reason-content:nth-child(even) .reason-content__question:before {
        left: 14px; }
  .wrapper--index .reason-feature {
    width: calc(100% - 20px * 2);
    margin: 200px auto 48px;
    padding: calc(104px + (100vw - 375px) * 0.56) 26px 16px;
    border-radius: 4px; }
    .wrapper--index .reason-feature:after {
      top: -166px;
      width: calc(250px * 0.78);
      height: calc(130px * 0.78); }
    .wrapper--index .reason-feature__content {
      width: 100%; }
    .wrapper--index .reason-feature__description {
      margin-bottom: 40px;
      font-size: 12px; }
      .wrapper--index .reason-feature__description strong {
        margin: 12px 0;
        font-size: 14px; }
    .wrapper--index .reason-feature__picture {
      top: -84px;
      right: -20px;
      left: auto;
      width: calc(100vw - 80px);
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
      border-bottom-left-radius: 4px;
      border-top-left-radius: 4px; }
  .wrapper--index .reason-feature-point {
    width: calc(100% + 16px);
    padding: 40px 16px 20px;
    margin-left: -8px;
    border-radius: 4px; }
    .wrapper--index .reason-feature-point:before {
      top: -20px;
      width: calc(41px * 0.8);
      height: calc(62px * 0.8); }
    .wrapper--index .reason-feature-point__title {
      font-size: 14px; }
    .wrapper--index .reason-feature-point__description {
      margin-top: 16px;
      font-size: 12px; }
  .wrapper--index .banner-container {
    padding-bottom: 30px; }
  .wrapper--index .scene {
    padding: 90px 0 0; }
    .wrapper--index .scene__decoration--1 {
      top: 600px;
      left: calc(50% - 280px);
      width: 332px; }
    .wrapper--index .scene__decoration--2 {
      top: 980px;
      left: calc(50% - 150px);
      width: 538px; }
    .wrapper--index .scene__content-container {
      display: block;
      margin-top: 64px;
      padding: 0 20px; }
  .wrapper--index .scene-content {
    display: flex;
    width: 100%;
    margin: 36px 0; }
    .wrapper--index .scene-content:not(:first-child) {
      margin-left: 0; }
    .wrapper--index .scene-content__title-container {
      flex-shrink: 0;
      width: 50%;
      min-height: 0; }
      .wrapper--index .scene-content__title-container:before {
        border-top-right-radius: 0;
        border-bottom-left-radius: 4px;
        border-top-left-radius: 4px; }
    .wrapper--index .scene-content__background {
      border-top-right-radius: 4px;
      border-top-left-radius: 4px; }
    .wrapper--index .scene-content__index {
      top: -12px;
      right: -38px;
      left: auto;
      width: 76px;
      height: 24px;
      z-index: 1; }
    .wrapper--index .scene-content__title {
      padding-right: 20px;
      padding-left: 20px;
      font-size: 12px;
      text-align: left; }
      .wrapper--index .scene-content__title br {
        display: none; }
    .wrapper--index .scene-content__description {
      line-height: 1.8em;
      padding: 48px 20px 24px;
      font-size: 12px;
      border-bottom-right-radius: 4px;
      border-bottom-left-radius: 4px; }
      .wrapper--index .scene-content__description:before {
        top: 24px;
        right: 0;
        left: 0;
        width: 18px;
        height: 18px;
        margin: 0 auto; }
  .wrapper--index .step {
    padding: 52px 0 0; }
    .wrapper--index .step__content-container {
      padding: 0 20px;
      margin-top: 56px;
      -webkit-transform: none;
              transform: none; }
    .wrapper--index .step__caution {
      margin-top: 16px;
      font-size: 12px; }
  .wrapper--index .step-content {
    padding: 28px 24px;
    border-radius: 4px; }
    .wrapper--index .step-content:not(:first-child) {
      margin-top: 56px; }
      .wrapper--index .step-content:not(:first-child):before {
        top: -36px;
        width: calc(29px * 0.5);
        height: calc(31px * 0.5);
        -webkit-transform: translateX(0px);
                transform: translateX(0px); }
    .wrapper--index .step-content__information {
      padding-right: 16px; }
    .wrapper--index .step-content__title {
      font-size: 17px; }
    .wrapper--index .step-content__description {
      margin-top: 8px;
      font-size: 12px; }
    .wrapper--index .step-content__picture {
      width: 72px;
      height: 72px; }
    .wrapper--index .step-content:nth-child(1) .step-content__picture {
      width: 68px;
      height: 68px;
      margin-right: 2px; }
  .wrapper--index .step-content-index {
    top: -36px;
    left: -12px;
    width: 56px;
    height: 56px; }
    .wrapper--index .step-content-index__title {
      font-size: 10px; }
    .wrapper--index .step-content-index__number {
      font-size: 22px; }
  .wrapper--index .price {
    position: relative;
    padding: 80px 20px 0;
    overflow: hidden; }
  .wrapper--index .price-banner {
    position: relative;
    padding: 24px 12px 24px 24px;
    margin-top: 56px;
    border-radius: 4px; }
    .wrapper--index .price-banner__badge {
      position: absolute;
      top: -48px;
      left: -12px;
      width: 72px;
      height: 72px;
      font-size: 13px; }
    .wrapper--index .price-banner__title-container {
      margin-left: 0; }
    .wrapper--index .price-banner__title {
      line-height: 1em;
      font-size: 45px; }
      .wrapper--index .price-banner__title .is-large {
        margin-left: -4px; }
      .wrapper--index .price-banner__title .is-small-1 {
        font-size: 27px; }
      .wrapper--index .price-banner__title .is-small-2 {
        font-size: 19px; }
      .wrapper--index .price-banner__title .is-small-3 {
        display: block;
        line-height: 1em;
        font-size: 15px; }
    .wrapper--index .price-banner__description {
      margin-top: 16px;
      font-size: 10px; }
    .wrapper--index .price-banner__picture {
      top: -32px;
      right: -64px;
      bottom: auto;
      width: 200px; }
  .wrapper--index .question {
    padding: 88px 20px 48px; }
    .wrapper--index .question__content-container {
      margin-top: 56px; }
    .wrapper--index .question__caution {
      line-height: 2em;
      margin-top: 20px;
      font-size: 12px; }
      .wrapper--index .question__caution a:before {
        bottom: -2px; }
  .wrapper--index .question-content {
    margin: 16px 0;
    border-radius: 4px; }
    .wrapper--index .question-content__question {
      padding: 16px 48px 16px 54px; }
      .wrapper--index .question-content__question:before {
        top: 12px;
        left: 10px;
        width: 35px;
        height: 35px;
        background-image: url(/winpass/img/index/icon_q.sp.png); }
    .wrapper--index .question-content__answer {
      padding: 16px 16px 16px 54px; }
      .wrapper--index .question-content__answer:before {
        top: 12px;
        left: 10px;
        width: 35px;
        height: 35px;
        background-image: url(/winpass/img/index/icon_a.sp.png); }
    .wrapper--index .question-content__icon {
      top: 17px;
      right: 14px;
      width: 20px;
      height: 20px; }
  .wrapper--terms .container {
    padding: 92px 20px 20px; }
  .wrapper--terms .page-title {
    line-height: 1.4em;
    font-size: 29px; }
    .wrapper--terms .page-title:after {
      bottom: -36px;
      width: calc(64px * 0.8);
      height: calc(20px * 0.8); }
  .wrapper--terms .page-description {
    line-height: 2em;
    padding-top: 48px;
    font-size: 14px; }
  .wrapper--terms .content-container {
    padding: 0; }
    .wrapper--terms .content-container h3 {
      padding-top: 24px;
      line-height: 1.6em;
      font-size: 19px; }
    .wrapper--terms .content-container p {
      margin-top: 6px;
      font-size: 14px; }
    .wrapper--terms .content-container ol {
      margin-top: 8px; }
    .wrapper--terms .content-container li {
      padding: 6px 0 6px 26px;
      font-size: 14px; }
      .wrapper--terms .content-container li span.is-number {
        top: 6px; }
  .wrapper--terms .page-suffix {
    font-size: 14px; }
  .wrapper--terms .button-to-top {
    right: 15px;
    bottom: 15px;
    width: 45px; } }
  @media (min-width: 800px) and (max-width: 1140px) {
  .common-header__logo {
    top: 38px;
    left: 20px;
    width: 140px; }
  .common-header__link-container {
    right: 20px; }
  .common-header__link {
    margin: 0 10px;
    font-size: 13px; }
  .wrapper--index .introduction {
    padding-right: 20px;
    padding-left: 20px; }
  .wrapper--index .introduction-content {
    padding: 0 16px;
    width: calc((100% - 20px * 3) / 4); }
    .wrapper--index .introduction-content:not(:first-child) {
      margin-left: 20px; }
    .wrapper--index .introduction-content__title {
      line-height: 1.2em; }
      .wrapper--index .introduction-content__title small {
        line-height: 1.2em; }
  .wrapper--index .theme {
    padding-right: 20px;
    padding-left: 20px; }
  .wrapper--index .theme-sample {
    padding-right: 20px;
    padding-left: 20px; }
  .wrapper--index .theme-sample-content {
    padding-left: 20px; }
    .wrapper--index .theme-sample-content small {
      font-size: 13px; }
  .wrapper--index .banner {
    width: calc(100% - 20px * 2);
    padding-right: 20px;
    padding-left: 20px; }
    .wrapper--index .banner__title {
      font-size: 28px; }
    .wrapper--index .banner .common-button {
      margin-left: 20px; }
  .wrapper--index .reason__content-container {
    padding-right: 20px;
    padding-left: 20px; }
  .wrapper--index .reason-feature {
    width: calc(100% - 20px * 2);
    padding-right: 32px;
    padding-left: 32px; }
    .wrapper--index .reason-feature__picture {
      left: calc(50% + 64px); }
  .wrapper--index .scene__content-container {
    padding-right: 20px;
    padding-left: 20px; }
  .wrapper--index .scene-content {
    width: calc((100% - 20px * 2) / 3); }
    .wrapper--index .scene-content:not(:first-child) {
      margin-left: 20px; }
    .wrapper--index .scene-content__title {
      padding-right: 16px;
      padding-left: 16px;
      font-size: 18px; }
    .wrapper--index .scene-content__description {
      padding-left: 48px; }
      .wrapper--index .scene-content__description:before {
        left: 18px; }
  .wrapper--index .price-banner__title {
    font-size: 36px; }
  .wrapper--index .price-banner__picture {
    width: 280px; }
  .wrapper--index .question__content-container {
    padding-right: 20px;
    padding-left: 20px; } }
  @media (min-width: 1920px) {
      .wrapper--index .firstview-background__content--2 {
        display: none; }
    .wrapper--index .reason {
      background-color: transparent; }
      .wrapper--index .reason__decoration {
        display: none; }
    .wrapper--index .banner-container {
      background-color: transparent; }
      .wrapper--index .banner-container__decoration {
        display: none; }
      .wrapper--index .scene__decoration {
        display: none; } }
  @media (max-width: 360px) {
  .wrapper--index .section__title {
    font-size: 24px; }
  .wrapper--index .theme {
    max-width: calc(100% - 12px * 2);
    padding-right: 12px;
    padding-left: 12px; }
  .wrapper--index .banner {
    width: calc(100% - 12px * 2);
    padding-right: 12px;
    padding-left: 12px; } }

/*--------------------------
2022/05/10追記 資料請求エリア
--------------------------*/
.wrapper--index .request {
  position: relative;
  max-width: 654px;
  margin-bottom: 96px;
}
@media (max-width: 799px) {
  .wrapper--index .request {
    max-width: calc(100% - 20px * 2);
    margin-bottom: 36px;
  }
}

.wrapper--index .request .box__title {
  margin-bottom: 40px;
}
@media (max-width: 799px) {
  .wrapper--index .request .box__title {
    margin-bottom: 40px;
  }
}

.wrapper--index .request .box__title:after {}

.wrapper--index .request .common-button {
  margin-left: auto;
  margin-right: auto;
}

/*--------------------------
2022/07/29追記 導入事例エリア
--------------------------*/
.wrapper--index .case {
  position: relative;
  margin: 120px 0 0;
  padding: 1px 0;}
@media (max-width: 799px) {
  .wrapper--index .case {
     margin: 80px 0 0;
  }
}
.wrapper--index .case__content-container {
    position: relative;
    margin-top: 32px;
    padding: 0 120px; }
    @media (min-width: 800px) and (max-width: 1140px) {
    .wrapper--index .case__content-container {
        padding-right: 20px;
        padding-left: 20px;
    }
  }
@media (max-width: 799px) {
  .wrapper--index .case__content-container {
    margin: 0 auto;
    padding: 0;
    border-radius: 4px;
  }
}
.wrapper--index .case-content {
  position: relative;
  max-width: 1040px;
  margin: 0 auto;
  padding: 54px 0 0; }
  @media (max-width: 799px) {
    .wrapper--index .case-content {
      padding: 0;
    }
  }
.wrapper--index .case-content__question {
    position: absolute;
    top: 22px;
    left: 0;
    max-width: 400px;
    width: 100%;
    border-radius: 8px;
    z-index: 1; }
  @media (max-width: 799px) {
    .wrapper--index .case-content__question {
      /* left: -24px; */
      position: relative;
      margin-left: 20px;
    }
  }
    .wrapper--index .case-content__question figure img {
      width: 100%; }
    @media (max-width: 799px) {
      .wrapper--index .case-content__question figure img {
        width: 292px; }
    }
    .wrapper--index .case-content__question figure {
      position: relative; }
    .wrapper--index .case-content__question .case-content__title {
      position: absolute;
      left: 30px;
      bottom: 28px;
      font-size: 22px;
      color: #ffffff; }
    @media (max-width: 799px) {
      .wrapper--index .case-content__question .case-content__title {
        bottom: 18px;
        font-size: 14px;
      }
    }
.wrapper--index .case-content__answer {
    position: relative;
    max-width: calc(100% - 350px);
    margin-left: auto;
    line-height: 2em;
    padding: 50px 130px 44px;
    font-size: 14px;
    background-color: white;
    border-radius: 8px;
    overflow: hidden; }
    @media (min-width: 800px) and (max-width: 1140px) {
      .wrapper--index .case-content__answer {
        padding: 48px 70px;
      }
    }

  @media (max-width: 799px) {
    .wrapper--index .case-content__answer {
      padding: 40px 20px 24px;
      max-width: calc(100% - 40px);
    }
  }
    .wrapper--index .case-content__answer strong {
      display: block;
      line-height: 1.9em;
      margin: 20px 0;
      font-size: 18px;
      font-weight: bold;
      color: #1052ba; }
  .wrapper--index .case-content__answer-content {
    position: relative;
    display: inline-block;
    margin-bottom: 32px; }
    @media (max-width: 799px) {
      .wrapper--index .case-content__answer-content {
        font-size: 12px;
        margin-bottom: 24px;
      }
    }
  .wrapper--index .case-content__index {
    position: absolute;
    right: -6px;
    bottom: -12px;
    line-height: 1em;
    font-size: 180px;
    font-weight: bold;
    color: #ecf5fb; }
    @media (max-width: 799px) {
      .wrapper--index .case-content__index {
        font-size: 120px;
      }
    }
  .wrapper--index .case-content:nth-child(even) .case-content__question {
    right: 0;
    left: auto; }
    .wrapper--index .case-content:nth-child(even) .case-content__question:before {
      left: 32px; }
  .wrapper--index .case-content:nth-child(even) .case-content__answer {
    margin-right: auto;
    margin-left: 0; }
  .wrapper--index .case-content:nth-child(even) .case-content__index {
    right: auto;
    left: -6px; }
.case-content__answer a {
  position: relative;
  display: flex;
  left: 0;
  justify-content: end;
  padding-right: 50px;
  color: #10B8BA;
  font-weight: bold;
}
.case-content__answer a::before {
  position: absolute;
  display: block;
  content: "";
  background-image: url(/winpass/img/index/icon_arrow_green.svg);
  width: 18px;
  height: 18px;
  background-size: 18px;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}


/* 2022/08/01追記 導入事例詳細 */

.wrapper--case .container {
  padding: 100px 20px 0;
  max-width: 1040px;
  min-height: 100vh;
  margin: 0 auto;
  box-sizing: content-box; }
@media (max-width: 799px) {
  .wrapper--case .container {
    padding: 80px 20px 0;}
}
.wrapper--case .page-title {
  position: relative;
  color: #1052ba;
  text-align: center;
  font-size: 28px;
  font-weight: bold;
  padding: 0 20px;
  letter-spacing: 0.02em; }
  @media (max-width: 799px) {
    .wrapper--case .page-title {
      font-size: 18px;
    }
  }
  .wrapper--case .page-title:after {
    position: absolute;
    right: 0;
    bottom: -44px;
    left: 0;
    width: 64px;
    height: 20px;
    margin: 0 auto;
    background-image: url(/winpass/img/index/section_title_decoration.png);
    background-size: contain;
    background-repeat: no-repeat;
    content: ""; }

.wrapper--case .page-description {
  line-height: 1.9em;
  padding-top: 90px;
  letter-spacing: 0.01em; }
@media (max-width: 799px) {
  .wrapper--case .page-description {
    padding-top: 70px; }
}
.wrapper--case .content-container {
  padding: 4px 0 0; }
  .wrapper--case .content-container h3 {
    padding-top: 72px;
    font-size: 24px;
    font-weight: bold;
    color: #1052ba; }
  .wrapper--case .content-container p {
    line-height: 2em;
    margin-top: 24px; }
  @media (max-width: 799px) {
    .wrapper--case .content-container p {
      font-size: 13px;}
  }
  .wrapper--case .content-container ol {
    margin-top: 8px; }
  .wrapper--case .content-container li {
    position: relative;
    line-height: 2em;
    padding: 12px 0 12px 40px; }
    .wrapper--case .content-container li span.is-number {
      position: absolute;
      top: 12px;
      left: 0; }
    .wrapper--case .content-container li a {
      position: relative;
      color: #10a8ba; }
      .wrapper--case .content-container li a:after {
        position: absolute;
        right: 0;
        bottom: -2px;
        left: 0;
        height: 1px;
        background-color: #10a8ba;
        content: ""; }

.wrapper--case .page-suffix {
  margin-top: 20px;
  text-align: right; }

.wrapper--case .button-to-top {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 70px;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.3s;
  pointer-events: none; }
  .wrapper--case .button-to-top.is-show {
    opacity: 1;
    pointer-events: auto; }

.breadcrumb {
  padding: 24px 0;
  font-size: 14px;
}
@media (max-width: 799px) {
  .breadcrumb {
    padding: 12px 0;
    font-size: 12px;
  }
}
.breadcrumb a {
  color: #1052ba;
}
.case__container {
  background-color: #fff;
  line-height: 1.5;
  padding-bottom: 80px;
  margin-bottom: 80px;
}
@media (max-width: 799px) {
  .case__container {
    padding-bottom: 60px;
    margin-bottom: 60px;
  }
}
.case__container figure {
  position: relative;
}
.case__container img {
  width: 100%;
}
.case__container__title .fixed {
  max-width: 245px;
  position: absolute;
  left: 100px;
  bottom: 0px;
}
@media (max-width: 799px) {
  .case__container__title .fixed {
    max-width: 128px;
    left: 12px;
    bottom: -2px;
  }
}
.case__container__title p {
  max-width: 688px;
  width: 100%;
  margin: auto;
  margin-bottom: 33px;
  text-align: right;
  line-height: 1.4;
  position: relative;
  top: -40px;
}
@media (max-width: 799px) {
  .case__container__title p {
    top: -10px;
    padding-right: 20px;
  }
}
.case__container__title p .case__meta-01 {
  font-size: 14px;
}
@media (max-width: 799px) {
  .case__container__title p .case__meta-01 {
    font-size: 12px;
  }
}
.case__container__title p .case__meta-02 {
  color: #6E6E6E;
}
.case__container__company {
  padding-bottom: 60px;
  display: flex;
  font-size: 16px;
  max-width: 688px;
  width: 100%;
  margin: auto;
}
@media (max-width: 799px) {
  .case__container__company {
    flex-direction: column;
    padding-bottom: 12px;
  }
}
.case__container__company img {
  width: 274px;
}
@media (max-width: 799px) {
  .case__container__company img {
    display: block;
    margin: 0 auto 24px;
  }
}
.case__container__company dl {
  margin-left: 60px;
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
}
@media (max-width: 799px) {
  .case__container__company dl {
    margin: 0 60px;
    flex-direction: column;
  }
}
.case__container__company dt {
  color: #1052ba;
  font-weight: bold;
  width: 20%;
}
@media (max-width: 799px) {
  .case__container__company dt {
    margin-bottom: 4px;
    width: 100%;
  }
}
.case__container__company dd {
  width: 80%;
}
@media (max-width: 799px) {
  .case__container__company dd {
    margin-bottom: 8px;
    width: 100%;
  }
}
.case__container__company dl span {
  font-size: 12px;
  color: #6E6E6E;
}
.case__container__introduction {
  border-top: 1px solid #EDEDED;
  padding: 60px 76px 20px;
  margin-bottom: 80px;
  position: relative;
  max-width: 840px;
  margin: auto;
  line-height: 1.8;
}
@media (max-width: 799px) {
  .case__container__introduction {
    padding: 32px 12px 0;
    margin: 0 20px;
  }
}
.case__container__introduction::after {
position: absolute;
top: 32px;
left: 32px;
width: 70px;
height: 56px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
background-image: url("/winpass/img/index/icon_quote.png");
content: "";
}
@media (max-width: 799px) {
  .case__container__introduction::after {
    top: 22px;
    left: 0px;
    width: 40px;
  }
}
.case__container__body {
  padding: 0 100px;
  margin: auto;
}
@media (max-width: 799px) {
  .case__container__body {
    padding: 0 20px;
  }
}
.case__container__body .case__page-title {
  color: #1052ba;
  font-weight: bold;
  font-size: 26px;
  margin-bottom: 30px;
  margin-top: 60px;
}
@media (max-width: 799px) {
  .case__container__body .case__page-title {
    margin-top: 40px;
    font-size: 18px;
    margin-bottom: 24px;
  }
}
.case__container__body dl {
  margin-bottom: 30px;
}
@media (max-width: 799px) {
  .case__container__body dl {
    margin-bottom: 16px;
  }
}
.case__container__body dt {
  color: #10B8BA;
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 24px;
}
@media (max-width: 799px) {
  .case__container__body dt {
    font-size: 16px;
    margin-bottom: 16px;
  }
}
.case__container__body dd {
  line-height: 1.8;
  margin-bottom: 60px;
}
@media (max-width: 799px) {
  .case__container__body dd {
    margin-bottom: 32px;
  }
}
.case__container__body dd:last-child {
  margin-bottom: 0;
}
.case__container__body dd p {
  margin-bottom: 16px;
}
.case__container__body dd p:last-child {
  margin-bottom: 0;
}
.page--case .wrapper--index .banner {
      max-width: 1040px;
}
.page--case .wrapper--index .banner-container {
  background-color: transparent;
  padding-bottom: 0;
}

/*======================================
2022.08.29 追加CSS
======================================*/
.form__container {
  text-align: center;
  padding: 100px 0;
}

.under__page-title {
  position: relative;
color: #1052ba;
text-align: center;
font-size: 40px;
font-weight: bold;
letter-spacing: 0.02em;
margin-bottom: 90px;
}
@media (max-width: 799px) {
  .under__page-title {
    line-height: 1.4em;
    font-size: 29px;
    margin-bottom: 48px;
    padding: 0 20px;
  }
}

.under__page-title::after {
  position: absolute;
    right: 0;
    bottom: -44px;
    left: 0;
    width: 64px;
    height: 20px;
    margin: 0 auto;
    background-image: url("/winpass/img/index/section_title_decoration.png");
    background-size: contain;
    background-repeat: no-repeat;
    content: "";
}
@media (max-width: 799px) {
  .under__page-title::after {
    bottom: -36px;
    width: calc(64px * 0.8);
    height: calc(20px * 0.8);
  }
}

.under__page-title__p {
  line-height: 1.5;
  margin-bottom: 40px;
}
@media (max-width: 799px) {
  .under__page-title__p {
    margin-bottom: 20px;
    padding: 0 20px;
    text-align: left;
  }
}