@charset "UTF-8";
@font-face {
  font-family: 'M PLUS Rounded 1c';
  src: url("../font/unhinted-mplus-1c-regular.woff2") format("woff2");
  font-weight: 400; }
@font-face {
  font-family: 'M PLUS Rounded 1c';
  src: url("../font/unhinted-mplus-1c-bold.woff2") format("woff2");
  font-weight: 700; }

/* コンテンツ中央寄せ*/
.maincolor {
  color: #19205D; }

.subcolor {
  color: #E7160D; }
.paydon-read-text {
    font-size: 15px;
    text-align: center;
}

    /* スマホ改行解除用*/
    @media screen and (max-width: 930px) {
        .u-sp-none {
            display: none;
        }
    }
    /* PC改行解除用*/
    @media screen and (min-width: 767px) {
        .u-sp {
            display: none;
        }
    }

    #paydon {
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-feature-settings: "palt";
  letter-spacing: 0.03em;
  font-weight: 400;
  color: #666666;
  line-height: 1.8;
  text-align: center;
  font-size: 1.125rem;
  color: #272727; }
  #paydon a, #paydon li {
    transition-duration: 0.2s; }
  #paydon :hover {
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out; }

.paydon-cotentstitle {
  display: inline-block;
  font-size: 2.5rem;
  font-weight: 700;
  color: #19205D;
  margin-bottom: 1.25rem;
  padding-left: 0.625rem;
  padding-right: 0.625rem;
  position: relative; }
  .paydon-cotentstitle::before, .paydon-cotentstitle::after {
    content: "";
    background: url("../img/h1dot.png");
    height: 7px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto; }
  .paydon-cotentstitle::before {
    left: 100%; }
  .paydon-cotentstitle::after {
    right: 100%; }
  .paydon-cotentstitle-join::before, .paydon-cotentstitle-join::after {
    width: 14.0625rem; }
  .paydon-cotentstitle-plan::before, .paydon-cotentstitle-plan::after {
    width: 17.8125rem; }
  .paydon-cotentstitle-faq::before, .paydon-cotentstitle-faq::after {
    width: 20.9375rem; }

.paydon-cotentstitle-e {
  font-size: 1rem;
  font-weight: 700; }
.paydon-read-text {
    font-size: 18px;
    text-align:center;
}
@media screen and (max-width: 767px) {
  .paydon-cotentstitle {
    font-size: 1.6875rem;
    margin-bottom: 0.625rem;
    margin-bottom: 0.625rem; }
    .paydon-cotentstitle-join::before, .paydon-cotentstitle-join::after {
      content: none; }

  .paydon-cotentstitle-e {
    font-size: 0.875rem; } }
/*  メインビジュアル
--------------------------- */
h2 span.font-s {
    font-size: 1rem;
}
.paydon-mainvis {
  background: url("../img/mv.png") center center no-repeat;
  height: 550px;
  position: relative; }
  .paydon-mainvis h1 {
    background: url("../img/title2024.png")no-repeat;
    width: 841px;
    height: 189px;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    z-index: 1;
    margin-top: 0.9375rem; }

.paydon-mainvis-catch {
  max-width: 930px;
  margin: 0 auto;
  padding-top: 1.25rem;
  position: relative;
  display: -webkit-flex;
  display: flex;
  justify-content: space-between; }
  .paydon-mainvis-catch > div {
    width: 47%;
    font-size: 1.375rem;
    color: #ffffff; }
  .paydon-mainvis-catch::after {
    content: "";
    background: url("../img/x.png");
    width: 30px;
    height: 30px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto; }

.paydon-mainvis-catch-onpara {
  border: 3px solid #19205D;
  background: #19205D; }

.paydon-mainvis-catch-paydon {
  border: 3px solid #E7160D;
  background: #E7160D; }

.paydon-mainvis-logo-onpara, .paydon-mainvis-logo-paydon {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden; }

.paydon-mainvis-logo-onpara {
  background: #ffffff url("../img/onpara-logo.png") center no-repeat;
  padding-top: 0.125rem;
  padding-bottom: 0.125rem; }

.paydon-mainvis-logo-paydon {
  background: #ffffff url("../img/paydon-logo.png") center no-repeat;
  padding-top: 0.25rem; }

@media screen and (max-width: 767px) {
    .paydon-mainvis {
        background: linear-gradient(to bottom, transparent 100%, transparent 70%, #fff 0%),url(../img/mv.png) bottom center no-repeat;
        background-size: 200% auto,cover;
        height: 77vh;
    }
    .paydon-mainvis h1 {
      background: url("../img/title-sp2024.png");
      background-size: 100% auto,cover;
      background-repeat: no-repeat;
      width: 95%;
      padding-top: calc(382/742*100%);
      margin-top: 0.9375rem; }

  .paydon-mainvis-catch {
    /*background: #ffffff;*/
    width: 95%;
    padding-top: 0.625rem; }
    .paydon-mainvis-catch > div {
      font-size: 0.875rem;
      line-height: 1.3; }
    .paydon-mainvis-catch::after {
      background-size: 100% auto,cover;
      width: 15px;
      height: 15px; }

    #contents_wrap .paydon-mainvis-logo-onpara, #contents_wrap .paydon-mainvis-logo-paydon {
        padding-left: 10px;
    }

    .paydon-mainvis-logo-onpara {
        background-size: 95% auto,cover;
        background-repeat: no-repeat;
        width: 100%;
        padding-top: 0.4rem;
        padding-bottom: 0.65rem;
    }

    .paydon-mainvis-logo-paydon {
        background-size: 81% auto,cover;
        background-repeat: no-repeat;
        width: 100%;
        padding: 7px 0 10px;
    }
}
/*  カウンター
--------------------------- */
.paydon-couter-area {
  background: #19205D;
  color: #ffffff;
  font-size: 1.25rem;
  font-weight: 700; }

.paydon-couter {
  max-width: 930px;
  margin: 0 auto;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative; }
  .paydon-couter::before, .paydon-couter::after {
    content: '';
    background: url("../img/counter-arrow.png");
    width: 84px;
    height: 17px;
    position: absolute; }
  .paydon-couter::before {
    left: 0; }
  .paydon-couter::after {
    transform: rotateY(180deg);
    right: 0; }

.paydon-couter-text {
  margin-right: 0.625rem; }
  .paydon-couter-text > span {
    color: #FFBB7D; }

.paydon-couter-number-wrapper {
  margin-top: -1.875rem; }

.paydon-couter-number {
  background: #ffffff;
  border-top: 3px solid #DDE4E9;
  font-size: 3.875rem;
  margin-right: 0.375rem;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
  color: #E7160D;
  position: relative; }
  .paydon-couter-number::after {
    content: '';
    transform: skewX(45deg);
    width: 100%;
    height: 12px;
    margin: 0 auto;
    background-color: #090C23;
    position: absolute;
    bottom: -12px;
    left: 6px; }

@media screen and (max-width: 767px) {
  .paydon-couter {
    width: 95%;
    margin: 0 auto;
    padding-top: 0.625rem;
    padding-bottom: 1.25rem;
    flex-direction: column; }
    .paydon-couter::before, .paydon-couter::after {
      width: 41px; }

  .paydon-couter-text {
    margin-bottom: -0.5rem; }

  .paydon-couter-number:last-child {
    margin-right: 0rem; }
  .paydon-couter-number-wrapper {
    margin-top: 0rem; } }
/*  リード文
--------------------------- */
.paydon-read {
  background: url("../img/bg.png") top center no-repeat;
  padding-top: 3.125rem;
  padding-bottom: 3.75rem; }

.paydon-read > h1 {
  font-size: 1.6rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 0.625rem; }
  .paydon-read > h1 span {
    border-bottom: 3px solid #19205D;
    position: relative;
    border-bottom: 3px solid #E7160D; }
  .paydon-read > h1 span::after {
    content: "";
    display: block;
    line-height: 0;
    overflow: hidden;
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 50%;
    border-bottom: 3px solid #19205D; }

.paydon-read-strong {
  font-size: 1.2rem;
  font-weight: 700; }

@media screen and (max-width: 767px) {
  .paydon-read {
    padding-top: 1.25rem;
    padding-bottom: 0.625rem;
    padding-left: 0.9375rem;
    padding-right: 0.9375rem;
    text-align: left;
    line-height: 1.5; }

  .paydon-read > h1 {
    color: #19205D; }
    .paydon-read > h1 span::after {
      content: none; }
    .paydon-read-text {
        font-size: 15px;
        text-align: center;
    }



}

/*  キャンペーン期間エリア
--------------------------- */
.paydon-period-area {
    background: #fff2d4;
}
.paydon-period {
    padding: 31px 0;
}
.paydon-period h2 {
        margin-bottom: 5px;
        line-height: 42px;
        font-size: 25px;
        font-weight: bold;
        color: #e7160d;
}
.paydon-period-area li {
    display: inline-block;
}
.paydon-period ul {
    text-align: center;
}
.paydon-period ul li {
    margin-right: 10px;
    background: #FFF;
    border: 2px solid #e7160d;
    border-radius: 10px;
    display: inline-block;
}
.paydon-period ul li:last-child {
    margin:unset;
}
.paydon-period ul li h3 {
    background: #e7160d;
    color: #FFF;
    border-radius: 7px 7px 0px 0px;
    font-size: 24px;
}

.paydon-period ul li dl {
            padding: 17px 20px;
            line-height: normal;
}

.paydon-period ul li dl dt {
                font-weight: bold;
                font-size: 16px;
                color: #e7160d;
}

.paydon-period ul li dl dd {
                font-size: 21px;
                margin-bottom: 9px;
                margin-left:0;
                font-weight: bold;
}

.period-memo {
    text-align: left;
    font-size: 12px;
    width: 644px;
    margin: 0 auto;
    line-height: 1.4;
    margin: 10px auto;
}

@media screen and (max-width: 767px) {
    .paydon-couter {
        width: 95%;
        margin: 0 auto;
        padding-top: 0.625rem;
        padding-bottom: 1.25rem;
        flex-direction: column;
    }

        .paydon-couter::before, .paydon-couter::after {
            width: 41px;
        }

    .paydon-couter-text {
        margin-bottom: -0.5rem;
    }

    .paydon-couter-number:last-child {
        margin-right: 0rem;
    }

    .paydon-couter-number-wrapper {
        margin-top: 0rem;
    }
    .paydon-period h2 {
        font-size: 20px;
        text-align: center;
    }
    .paydon-period ul li h3 {
        font-size: 18px;
    }
    .paydon-period ul li dl dd {
        font-size: 17px;
    }
    .paydon-period ul li {
        margin: 0 0 20px;
    }

    .paydon-period ul li:last-child {
        margin: unset;
    }
    .paydon-period {
        padding: 12px;
    }
    .period-memo {
        width: unset;
        line-height: 1.6;
        letter-spacing: -0.1px;
    }
}



/*  Payどんとは？ */
.paydon-about {
  max-width: 930px;
  margin: 0 auto;
  background: #ffffff url("../img/paydon-images.jpg") top right no-repeat;
  border-radius: 10px;
  border: 2px solid #E7160D;
  margin-top: 2.5rem;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  padding-right: 20rem;
  padding-left: 2.5rem;
  display: -webkit-flex;
  display: flex;
  position: relative; }
  .paydon-about::before {
    content: '';
    /*background: url("../img/shirodon.png");*/
    width: 168px;
    height: 115px;
    position: absolute;
    top: -117px;
    right: 45px; }
  .paydon-about h1 {
    width: 30%;
    font-size: 1.75rem;
    font-weight: 700;
    color: #E7160D;
    line-height: 1.3;
    border-right: 1px solid #D4D4D4;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    padding-right: 1.25rem; }
  .paydon-about-txt {
    width: 70%;
    font-size: 0.9375rem;
    text-align: left;
    padding-left: 2.5rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem; }

.btn-paydon {
  background: #E7160D;
  color: #ffffff;
  display: block; }
  .btn-paydon:link, .btn-paydon:active, .btn-paydon:visited {
    display: inline-block;
    background: #E7160D;
    color: #ffffff;
    font-size: 1.0625rem;
    font-weight: 700;
    color: #ffffff;
    border-radius: 25px;
    padding-left: 1.875rem;
    padding-right: 1.875rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    margin-top: 0.9375rem;
    text-decoration: none;
    border: 3px solid #E7160D; }
  .btn-paydon:hover {
    color: #E7160D;
    background: #ffffff;
    border: 3px solid #E7160D; }

.btn-paydon-plan {
  display: none; }

@media screen and (max-width: 767px) {
  .paydon-about {
    background-position: bottom -50px center;
    padding-top: 0.9375rem;
    padding-right: 0.9375rem;
    padding-left: 0.9375rem;
    padding-bottom: 6.25rem;
    margin-top: 6.25rem;
    flex-direction: column; }
    .paydon-about::before {
      right: 0;
      left: 0;
      margin: auto; }
    .paydon-about h1 {
      width: 100%;
      border-right: none;
      border-bottom: 1px solid #D4D4D4;
      padding-bottom: 0.3125rem;
      padding-right: 0rem; }
    .paydon-about-txt {
      width: 100%;
      font-size: 0.9375rem;
      line-height: 1.8;
      padding-left: inherit;
      padding-right: inherit;
      padding-top: inherit;
      padding-bottom: inherit; }
    .paydon-about a:link, .paydon-about a:hover, .paydon-about a:active, .paydon-about a:visited {
      display: block;
      text-align: center; }

  .btn-paydon {
    width: 100%;
    text-align: center; }
    .btn-paydon:link, .btn-paydon:active, .btn-paydon:visited {
      padding-left: 0.9375rem;
      padding-right: 0.9375rem;
      margin-bottom: 0.9375rem; }

  .btn-paydon-plan:link, .btn-paydon-plan:active, .btn-paydon-plan:visited {
    display: block;
    width: 95%;
    margin: 0 auto;
    text-align: center;
    position: relative;
    background: #19205D;
    color: #ffffff;
    font-size: 1.0625rem;
    font-weight: 700;
    color: #ffffff !important;
    border-radius: 25px;
    text-decoration: none;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    margin-top: 1.25rem; }
  .btn-paydon-plan:hover {
    opacity: 0.8; }
  .btn-paydon-plan::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 7.5px 0 7.5px;
    border-color: #ffffff transparent transparent transparent;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 5%; } }
/*  参加方法
--------------------------- */
.paydon-join-area {
  background: url("../img/bg2.png") 30px 30px;
  padding-top: 6.25rem;
  padding-bottom: 6.25rem;
  overflow: hidden; }

.paydon-join {
  max-width: 930px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.2);
  padding-top: 3.75rem;
  padding-bottom: 5rem; }

.paydon-movie {
  padding-left: 1.875rem;
  padding-right: 1.875rem; }
  .paydon-movie-youtube {
    position: relative;
    width: 100%;
    padding-top: 56.25%; }
  .paydon-movie-youtube iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important; }

.paydon-step {
  padding-top: 3.125rem;
  line-height: 1.5; }

.paydon-step > ul > li {
  border-top: 4px solid #19205D;
  padding-top: 3.125rem;
  padding-left: 1.875rem;
  padding-right: 1.875rem;
  display: -webkit-flex;
  display: flex;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  text-align: left; }
.paydon-step > ul > li a {
  text-decoration: underline; }

.paydon-step-number {
  background: #19205D;
  color: #ffffff;
  font-weight: 700;
  position: absolute;
  top: 0;
  width: 8.125rem;
  height: 8.125rem;
  border-radius: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 1.25rem;
  padding-top: 3.9375rem;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: baseline;
  align-items: baseline;
  -webkit-justify-content: center;
  justify-content: center; }
  .paydon-step-number span {
    font-size: 2.25rem; }

.paydon-step-title {
  font-size: 1.625rem;
  font-weight: 700;
  padding-top: 1.875rem; }

.paydon-annotation {
  font-size: 0.75rem;
  color: #666666;
  margin-top: 1.25rem;
  padding-bottom: 1.25rem; }

.paydon-step-img {
  text-align: center; }

.paydon-step-trip {
  background: #FFF2D4;
  position: relative; }
  .paydon-step-trip::before, .paydon-step-trip::after {
    content: '';
    position: absolute;
    top: 1.875rem; }
  .paydon-step-trip::before {
    background: url("../img/trip1.png");
    width: 19.5625rem;
    height: 13.6875rem;
    left: 0.9375rem; }
  .paydon-step-trip::after {
    background: url("../img/trip2.png");
    width: 18.75rem;
    height: 14.6875rem;
    right: 0.9375rem; }
  .paydon-step-trip-txt {
    width: 100%;
    margin-top: 1.875rem;
    margin-bottom: 6.25rem;
    font-size: 1.375rem;
    text-align: center;
    position: relative; }
  .paydon-step-trip-txt::before, .paydon-step-trip-txt::after {
    content: '';
    background: url("../img/step-arrow.png");
    position: absolute;
    width: 1.3125rem;
    height: 1.8125rem;
    left: 0;
    right: 0;
    margin: auto; }
  .paydon-step-trip-txt::before {
    top: -2.5rem; }
  .paydon-step-trip-txt::after {
    bottom: -2.5rem; }

.paydon-step-last {
  width: 95%;
  text-align: center;
  font-size: 2.5rem;
  font-weight: 700;
  padding-top: 1.5625rem;
  margin: 0 auto;
  display: block !important;
  border-top: 1px solid #cccccc;
  position: relative; }
  .paydon-step-last-cashless {
    font-size: 1.6875rem; }
  .paydon-step-last::before, .paydon-step-last::after {
    content: '';
    position: absolute;
    top: 3.75rem; }
  .paydon-step-last::before {
    background: url("../img/step-left.png");
    width: 13.5rem;
    height: 10.9375rem;
    left: 1.25rem; }
  .paydon-step-last::after {
    background: url("../img/step-right.png");
    width: 12.4375rem;
    height: 10.75rem;
    right: 1.25rem; }

.paydon-price {
  position: relative; }
  .paydon-price::before {
    content: '例えば…';
    color: #ffffff;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    width: 300px;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    margin: auto;
    z-index: 1; }
  .paydon-price::after {
    content: '';
    border-top: 70px solid #19205D;
    border-right: 150px solid transparent;
    border-bottom: 70px solid transparent;
    border-left: 150px solid transparent;
    text-align: center;
    width: 50px;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    margin: auto; }
  .paydon-price > .paydon-step-img {
    margin-top: 3rem; }

@media screen and (max-width: 767px) {
  .paydon-join-area {
    background: url("../img/bg2-sp.png") 8px 8px;
    padding-top: 3.125rem;
    padding-bottom: 1.875rem; }

  .paydon-join {
    width: 95%;
    margin: 0 auto;
    padding-top: 1.5625rem;
    padding-bottom: 0.9375rem; }

  .paydon-movie {
    padding-left: 0.9375rem;
    padding-right: 0.9375rem; }

  .paydon-step {
    padding-top: 1.25rem; }

  .paydon-step > ul > li {
    flex-direction: column;
    padding-left: 0.625rem;
    padding-right: 0.625rem; }

    .paydon-step-title {
        font-size: 1.1rem;
        padding-top: 1.25rem;
        margin-bottom: 12px;
    }

  .paydon-annotation {
    font-size: 0.9375rem; }

  .paydon-step-trip::before, .paydon-step-trip::after {
    top: inherit;
    bottom: -3.75rem;
    background-size: 100% auto,cover;
    background-repeat: no-repeat;
    width: 49%;
    padding-top: calc(219/313*49%); }
  .paydon-step-trip::before {
    left: 0.625rem; }
  .paydon-step-trip::after {
    right: 0.625rem; }
  .paydon-step-trip-txt {
    font-size: 1.25rem;
    margin-bottom: 11.25rem; }
  .paydon-step-trip-txt::before {
    top: -2.5rem; }
  .paydon-step-trip-txt::after {
    bottom: -2.5rem; }

  .paydon-price::before {
    font-size: 1.125rem; }
    .paydon-price::after {
        border-top: 50px solid #19205D;
        border-right: 88px solid transparent;
        border-bottom: 19px solid transparent;
        border-left: 80px solid transparent;
        width: 50px;
    }

  .paydon-step-last {
    font-size: 1.6875rem;
    top: inherit;
    padding-bottom: 9.0625rem; }
    .paydon-step-last-cashless {
      font-size: 1.25rem; }
    .paydon-step-last::before, .paydon-step-last::after {
      background-size: 100% auto,cover;
      background-repeat: no-repeat;
      width: 43%;
      height: inherit;
      padding-top: calc(172/199*43%);
      top: inherit; }
    .paydon-step-last::before {
      bottom: 1.375rem; }
    .paydon-step-last::after {
      bottom: 1.875rem; }
    .paydon-step-title {
        font-size: 1.1rem;
        padding-top: 1.25rem;
    }









}
/* 表組 */
.paydon-price-table {
  width: 63%; }
  .paydon-price-table > h2 {
    font-size: 1.25rem;
    font-weight: 700;
    text-indent: 0.4em;
    text-align: left;
    border-left: 3px solid #19205D;
    margin-bottom: 0.3125rem;
    position: relative; }
  .paydon-price-table > h2:before, .paydon-price-table > h2:after {
    content: "";
    line-height: 0;
    display: block;
    overflow: hidden;
    position: absolute;
    background: #ffffff;
    left: -3px;
    width: 3px;
    height: 10%;
    z-index: 2; }
  .paydon-price-table > h2:before {
    top: 0; }
  .paydon-price-table > h2:after {
    bottom: 0; }
  .paydon-price-table ul {
    font-size: 1rem; }

.paydon-price-table li {
  border-top: 1px solid #D9D9D9;
  display: -webkit-flex;
  display: flex;
  justify-content: space-between;
  position: relative; }
  .paydon-price-table li::before {
    content: '';
    background: url("../img/price-arrow.png");
    width: 14px;
    height: 7px;
    position: absolute;
    top: 0;
    right: 10rem; }
  .paydon-price-table li:first-child::before {
    content: none; }

.paydon-price-number-wrp {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center; }

.paydon-price-number {
  font-size: 0.625rem;
  text-align: center;
  line-height: 1.3;
  width: 2.5rem;
  padding-top: 0.25rem;
  padding-bottom: 0.1875rem; }
  .paydon-price-number span {
    font-size: 0.9375rem;
    font-weight: 700; }

.paydon-price-service-wrp {
  display: -webkit-flex;
  display: flex; }

.paydon-price-service {
  width: 17.5rem;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  margin-left: 0.625rem; }
  .paydon-price-service span {
    font-size: 0.75rem; }

.paydon-price-numeral {
  width: 6.875rem;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  justify-content: flex-end;
  margin-right: 6.875rem; }
  .paydon-price-numeral span {
    font-size: 1.25rem; }

.paydon-price-nomal {
  border-right: 1px solid #D9D9D9;
  border-left: 1px solid #D9D9D9; }
  .paydon-price-nomal .paydon-price-service {
    width: 60%; }
  .paydon-price-nomal .paydon-price-numeral {
    font-size: 1rem;
    font-weight: 700; }
  .paydon-price-nomal .paydon-price-numeral span {
    font-size: 1.5rem; }

.paydon-price-onpara {
  border-right: 1px solid #D9D9D9; }
  .paydon-price-onpara .paydon-price-service {
    background: url("../img/onpara-logomark.png") left center no-repeat;
    padding-left: 2.0625rem; }
  .paydon-price-onpara .paydon-price-number-wrp {
    background: #19205D;
    color: #ffffff; }

.paydon-price-paydon {
  border-right: 1px solid #D9D9D9; }
    .paydon-price-paydon .paydon-price-service {
        background: url("../img/paydon-logomark.png") left bottom no-repeat;
        padding-left: 9.8125rem;
        height: 36px;
    }
  .paydon-price-paydon .paydon-price-number-wrp {
    background: #E7160D;
    color: #ffffff; }

.paydon-price-cashless {
  border-right: 1px solid #D9D9D9; }
  .paydon-price-cashless .paydon-price-service {
    background: url("../img/cachless-logomark.png") left center no-repeat;
    padding-left: 1.875rem; }
  .paydon-price-cashless .paydon-price-number-wrp {
    background: #272727;
    color: #ffffff; }
  .paydon-price-cashless .paydon-price-numeral {
    font-size: 1rem;
    font-weight: 700; }
  .paydon-price-cashless .paydon-price-numeral span {
    font-size: 1.5rem; }

.paydon-price-result {
  display: -webkit-flex;
  display: flex;
  justify-content: flex-end;
  border-top: 1px solid #D9D9D9;
  padding-top: 1.875rem; }
  .paydon-price-result .paydon-price-service {
    width: inherit;
    padding-top: 0.3125rem;
    font-size: 0.75rem;
    display: inherit;
    text-align: right; }
  .paydon-price-result .paydon-price-numeral {
    margin-right: 0.625rem;
    padding-left: inherit;
    font-size: 1rem;
    font-weight: 700; }
  .paydon-price-result .paydon-price-numeral span {
    font-size: 1.5rem; }

.paydon-off-onpara, .paydon-off-paydon, .paydon-off-cashless {
  font-weight: 700;
  position: absolute;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0.625rem;
  padding-top: 0.0625rem;
  padding-bottom: 0.0625rem;
  padding-right: 0.3125rem;
  padding-left: 0.3125rem; }

.paydon-off-onpara {
  background: #19205D;
  color: #ffffff; }
.paydon-off-paydon {
  background: #E7160D;
  color: #ffffff; }
.paydon-off-cashless {
  background: #272727;
  color: #ffffff; }
.paydon-off-result {
  width: 8.125rem;
  background: #E7160D;
  font-size: 1.125rem;
  color: #ffffff;
  font-weight: 700;
  position: relative;
  padding-top: 0.0625rem;
  padding-bottom: 0.0625rem;
  padding-right: 0.625rem;
  padding-left: 0.625rem;
  border: 2px solid #19205D; }
.paydon-off-result span {
  font-size: 1.375rem; }
.paydon-off-result::before, .paydon-off-result::after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid; }
.paydon-off-result::before {
  border-width: 10px 10px 0 0;
  border-color: #19205D transparent transparent transparent;
  top: 0;
  left: 0; }
.paydon-off-result::after {
  border-width: 0 0 10px 10px;
  border-color: transparent transparent #19205D transparent;
  bottom: 0;
  right: 0; }

.paydon-off-total {
  text-align: center;
  position: absolute;
  top: -1.4375rem;
  font-size: 0.75rem;
  color: #E7160D;
  left: 0;
  right: 0;
  margin: auto; }

/* 表組sp */
@media screen and (max-width: 767px) {
  .paydon-price-table {
    width: 100%; }
    .paydon-price-table li {
      justify-content: flex-start; }

  .paydon-price-nomal {
    flex-direction: column;
    padding-top: 0.625rem;
    padding-left: 2.1875rem;
    padding-right: 0.625rem; }
    .paydon-price-nomal .paydon-price-service {
      display: inline;
      width: 100%; }

  .paydon-price-service-wrp {
    flex-direction: column;
    padding-top: 0.9375rem; }

  .paydon-price-service {
    width: inherit; }

  .paydon-price-numeral {
    justify-content: flex-start;
    padding-left: 0.625rem; }

  .paydon-off-onpara, .paydon-off-paydon, .paydon-off-cashless {
    right: 0.3125rem; }

  .paydon-price-numeral {
    width: 6.875rem;
    margin-right: 0.3125rem; }

  .paydon-price-result {
    justify-content: space-between; }
    .paydon-price-result .paydon-price-service-wrp {
      padding-top: 0rem; }
    .paydon-price-result .paydon-price-service {
      width: inherit;
      padding-left: 0rem;
      padding-right: 0.625rem;
      padding-top: 0rem;
      margin-left: 0rem;
      font-size: 0.875rem; }

  .paydon-off-result {
    width: 7.5rem;
    font-size: 1rem;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center; }
  .paydon-off-result span {
    font-size: 1.125rem; } }
.paydon-step-img-txt {
  font-size: 1.25rem;
  font-weight: 700;
  position: relative; }
    .paydon-step-img-txt::after {
        content: '';
        background: url("../img/off16.png");
        width: 110px;
        height: 110px;
        position: absolute;
        top: -4.375rem;
        right: 0;
    }

.paydon-step-img-exmple {
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  font-weight: 700;
  -webkit-align-items: center;
  align-items: center;
  margin-top: -0.625rem; }
  .paydon-step-img-exmple-one {
    font-size: 0.6875rem;
    text-align: right;
    line-height: 1.3; }
  .paydon-step-img-exmple-profit {
    margin-top: 0.625rem; }

.paydon-step-img-exmple-price {
  color: #E7160D;
  font-size: 2.375rem;
  padding-bottom: -0.625rem;
  margin-left: 0.625rem;
  position: relative; }
  .paydon-step-img-exmple-price span {
    font-size: 1.5625rem; }
  .paydon-step-img-exmple-price::after {
    content: '';
    background: #19205D;
    height: 2px;
    width: 100%;
    position: absolute;
    bottom: 0.3125rem;
    left: 0; }

@media screen and (max-width: 767px) {
  .paydon-price .paydon-step-img {
    margin: 0 auto;
    margin-top: 3.4375rem;
    line-height: 1.5; }

  .paydon-step-img-exmple-one {
    font-size: 0.8125rem; }
  .paydon-step-img-exmple-price {
    font-size: 1.75rem;
    padding-bottom: 0.1875rem; }

  .paydon-step-img-txt {
    margin-bottom: 0.625rem; }
    .paydon-step-img-txt::after {
      top: -5rem; } }
/*  プラン
--------------------------- */
h2 span.font-s {
    font-size: 1rem;
}
#paydon-plan {
  background-color: #EEF7FF;
  background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, #f6faff), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, #f6faff), color-stop(0.75, #f6faff), color-stop(0.75, transparent), to(transparent));
  -webkit-background-size: 100px 100px;
  padding-top: 6.25rem;
  padding-bottom: 5rem; }

.paydon-plan-allbtn {
  width: 40%;
  margin: 0 auto;
  display: block;
  font-size: 1.5rem;
  color: #E68C3A;
  font-weight: 700;
  background: #ffffff;
  border-radius: 10px;
  border: 3px solid #E68C3A;
  padding: 0.625rem;
  margin-bottom: 3.75rem;
  box-shadow: 0px 3px 1px -1px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 3px 1px -1px rgba(0, 0, 0, 0.2);
  position: relative; }
  .paydon-plan-allbtn::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8.5px 0 8.5px 15px;
    border-color: transparent transparent transparent #E68C3A;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 15%; }
.areatag {
    display: inline-block;
    position: absolute;
    left: 0;
    top: 12px;
    box-sizing: border-box;
    padding-left: 8px;
    width: 100%;
    margin: 0;
    height: 28px;
    line-height: 30px;
    font-size: 14px;
    letter-spacing: 0.1em;
    color: white;
    background: #404a9e;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.12);
    text-align:left;
}
.areatag:before {
    position: absolute;
    content: '';
    top: 0;
    left: -7px;
    border: none;
    height: 38px;
    width: 7px;
    background: #404a9e;
    border-radius: 5px 0 0 5px;
}
.areatag:after {
    position: absolute;
    content: '';
    bottom: -7px;
    left: -5px;
    border: none;
    height: 7px;
    width: 5px;
    background: #949bda;
    border-radius: 5px 0 0 5px;
}

.paydon-plan-allbtn:link, .paydon-plan-allbtn:active, .paydon-plan-allbtn:visited {
    color: #E68C3A;
}
  .paydon-plan-allbtn:hover {
    color: #FFFFFF;
    background: #E68C3A; }
  .paydon-plan-allbtn:hover::after {
    border-left-color: #ffffff; }

.paydon-plan-areanavi {
  background: #19205D;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 2; }

.paydon-plan-areanavi ul {
  max-width: 930px;
  margin: 10px auto;
  padding-top: 0.1875rem;
  padding-bottom: 0.1875rem;
  display: -webkit-flex;
  display: flex;
  justify-content: space-around; }
  .paydon-plan-areanavi ul li {
    width: 30%;
    text-align: center;
    font-size: 1.5rem;
    color: #ffffff;
    position: relative;
    overflow: hidden; }
  .paydon-plan-areanavi ul li::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 7.5px 0 7.5px;
    border-color: #ffffff transparent transparent transparent;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 25%; }
  .paydon-plan-areanavi ul li a::before {
    content: "";
    position: absolute;
    /*width: 100vw;*/
    height: 100vh;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    left: 50%;
    top: 50%; }
  .paydon-plan-areanavi ul li:hover::after {
    border-top-color: #ACD8FF; }

.paydon-plan-areanavi-p:link, .paydon-plan-areanavi-p:active, .paydon-plan-areanavi-p:visited {
  color: #ffffff; }
.paydon-plan-areanavi-p:hover {
  color: #ACD8FF; }

@media screen and (max-width: 767px) {
  #paydon-plan {
    padding-top: 1.875rem;
    padding-bottom: 0.625rem; }
    .areatag {
        top: 6px;
        font-size:12px;
        height:unset;
        line-height:unset;
    }
    .areatag:before {
        height: 30px;
    }

        .paydon-place ul li {
        padding-top: 2.0rem;
    }
    .paydon-plan-allbtn {
        width: 85%;
        margin-bottom: 1.25rem;
        font-size: 1.125rem;
    }
    .paydon-plan-allbtn::after {
      right: 4%; }

  .paydon-plan-areanavi ul {
    width: 100%; }
    .paydon-plan-areanavi ul li {
      font-size: 1.0625rem; }
    .paydon-plan-areanavi ul li::after {
      right: 2%; }

    h2 span.font-s {
        font-size: 0.75rem;
    }




}
.paydon-place {
  max-width: 930px;
  margin: 0 auto;
  padding-top: 2rem; }
.paydon-place h1 {
    font-size: 1.875rem;
    color: #272727;
    font-weight: 700;
    position: relative;
    margin-bottom: 20px;
}
.planlist-periodbox {
    margin: 8px auto 40px;
    padding: 20px 0;
    background: rgba(205, 209, 243, 0.3);
}
.paydon-place .planlist-dt, .paydon-place .planlist-dd {
    display: inline-block;
    margin:0;
    font-weight:bold;
}
.paydon-place .planlist-dl {
    margin: 0 auto;
    width: 42%;
    text-align: left;
}
    .paydon-place h1::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    display: inline-block;
    width: 60px;
    height: 2px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #E68C3A;
}
  .paydon-place h2 {
    font-weight: 700;
    margin-left: 0.625rem;
    margin-right: 0.625rem;
    margin-bottom: 0.3125rem;
    font-size: 1.375rem;
    line-height: 1.3;
    text-align: left; }

.paydon-place ul {
  display: -webkit-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
.paydon-place ul li {
    width: 31%;
    background: #ffffff;
    border-radius: 10px;
    border: 2px solid #E7160D;
    padding-top: 3.1rem;
    padding-bottom: 0.9375rem;
    padding-right: 0.4375rem;
    padding-left: 0.4375rem;
    margin-bottom: 1.875rem;
    font-weight: 700;
    box-shadow: 0px 3px 1px -1px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0px 3px 1px -1px rgba(0, 0, 0, 0.2);
    position: relative;
    /*overflow: hidden;*/
    display: -webkit-flex;
    display: flex;
    flex-flow: column;
}
.taisho {
    margin: 0;
}

.paydon-place ul li::after {
    content: "";
    background: url("../img/arrow.png");
    width: 50px;
    height: 50px;
    position: absolute;
    bottom: 0;
    right: 0;
}
.paydon-place ul li a {
    display: block;
    text-align: center;
    margin-top: 1.25rem;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
  .paydon-place ul li a:link, .paydon-place ul li a:visited {
    color: #E7160D; }
  .paydon-place ul li a::before {
    content: "";
    position: absolute;
    /*width: 100vw;*/
    height: 100vh;
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    left: 50%;
    top: 50%;
    color: #E7160D;
    text-align: right; }
  .paydon-place ul li:hover {
    transform: scale(1.05);
    box-shadow: 0px 5px 2px -2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0px 5px 2px -2px rgba(0, 0, 0, 0.2); }
#contents_wrap *, #contents_wrap *::before, #contents_wrap *::after {
    box-sizing: border-box;
}
.paydon-place ul::after {
    content: "";
    display: block;
    width: 31%;
}
.plan-cs {
    position: absolute;
    background: rgba(0,0,0,0.7);
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 1;
}
.plan-cs p{
    height:100%;
    width:100%;
    position:relative;
}
.plan-cs p span {
    font-size: 25px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    height: 100px;
    color: #FFF;
}
.paydon-place-wrapper {
    margin-top: auto;
}
.paydon-place-wrapper img{
    max-width:100%;

}
@media screen and (max-width: 767px) {
    .paydon-place {
        width: 95%;
        margin: 0 auto 20px;
        padding-top: 0;
    }
    .planlist-periodbox {
        margin: 8px auto 20px;
    }
    .paydon-place h1 {
        font-size: 1.5rem;
        margin-bottom: 1.25rem;
    }
    .paydon-place h2 {
      font-size: 1rem;
      margin-bottom: 0.3125rem;
      margin-left: 0rem; }
    .paydon-place .planlist-dl {
        margin: 0 auto;
        width: 98%;
        text-align: center;
    }
  .paydon-place ul li {
    width: 49%;
    font-size: 0.875rem;
    padding-top: 2.0rem;
    padding-bottom: 0.3125rem;
    margin-bottom: 0.625rem; }
    .paydon-place ul li a {
      text-align: left;
      margin-top: 0.3125rem; }
    .paydon-place ul li::after {
      content: "";
      background: url("../img/arrow.png");
      background-size: 100% auto,cover;
      background-repeat: no-repeat;
      width: 25px;
      height: 25px;
      position: absolute;
      bottom: 0;
      right: 0; } }
/*  よくある質問
--------------------------- */
.paydon-faq {
    max-width: 930px;
    margin: 0 auto;
    padding-top: 6.25rem;
    padding-bottom: 3.125rem;
    padding-right: 0rem;
    padding-left: 0rem;
    overflow: hidden;
}
.paydon-faq dd {
    margin:0 0 50px;
}
.paydon-faq-btn {
    width: 60%;
    display: block;
    font-size: 1.5rem;
    color: #E7160D;
    font-weight: 700;
    background: #ffffff;
    border-radius: 10px;
    border: 3px solid #E7160D;
    padding: 0.625rem;
    margin-bottom: 3.75rem;
    box-shadow: 0px 3px 1px -1px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0px 3px 1px -1px rgba(0, 0, 0, 0.2);
    position: relative;
}
  .paydon-faq-btn::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8.5px 0 8.5px 15px;
    border-color: transparent transparent transparent #E7160D;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 15%; }
  .paydon-faq-btn:link, .paydon-faq-btn:active, .paydon-faq-btn:visited {
    color: #E7160D; }
  .paydon-faq-btn:hover {
    color: #FFFFFF;
    background: #E7160D; }
  .paydon-faq-btn:hover::after {
    border-left-color: #ffffff; }

.paydon-faq-list {
  text-align: left; }
  .paydon-faq-list dt {
    font-size: 1.5rem;
    color: #19205D;
    font-weight: 700;
    line-height: 1.5;
    border-bottom: 2px solid #D0E9FA;
    margin: 0 0 10px 60px;
    padding-bottom: 3px;
    position: relative; }
    .paydon-faq-list dt::before {
      content: "";
      position: absolute;
      background: url("../img/icon-q.png");
      width: 2.8125rem;
      height: 2.8125rem;
      top: -0.3125rem;
      left: -3.75rem; }
  .paydon-faq-list dd {
    padding-left: 60px;
    margin-bottom: 50px; }

@media screen and (max-width: 767px) {
  .paydon-faq {
    width: 95%;
    padding-top: 1.875rem;
    padding-bottom: 1.875rem; }
    .paydon-faq h1 {
      margin-bottom: 20px; }

  .paydon-faq-btn {
    width: 95%;
    margin: 0 auto;
    margin-bottom: 1.25rem;
    font-size: 1rem; }
    .paydon-faq-btn::after {
      border-style: solid;
      border-width: 5.5px 0 5.5px 10px;
      border-color: transparent transparent transparent #E7160D;
      right: 5%; }

  .paydon-faq-list dt {
    font-size: 1.125rem;
    margin: 0 0 10px 45px; }
  .paydon-faq-list dt::before {
    background-size: 100%;
    width: 2.5rem;
    height: 2.5rem;
    top: 0rem;
    left: -2.8125rem; }
  .paydon-faq-list dd {
    padding-left: 2.8125rem;
    font-size: 0.9375rem;
    margin-bottom: 1.875rem; } }