@charset "UTF-8";
/*  BODY
------------------------------------------------*/
#container {
  width: 100%;
  padding: 0;
  background: #fff;
  color: #686161; }

.pagewrap {
  clear: both;
  text-align: left;
  overflow: hidden; }

.cpTitle {
  position: relative; }
  .cpTitle .cpTitle__ttl {
    background-image: url("../img/main_bg.jpg");
    background-repeat: repeat-x;
    background-size: contain;
    line-height: 0;
    text-align: center; }
    .cpTitle .cpTitle__ttl img {
      max-width: 100%;
      vertical-align: bottom; }
  .cpTitle .cpTitle__day {
    position: absolute;
    bottom: -29px;
    left: 0;
    display: block;
    width: 100%;
    text-align: center; }
    .cpTitle .cpTitle__day .cpTitle__day__img {
      max-width: 100%;
      vertical-align: bottom; }

.cpHeading {
  padding: 50px 0;
  background: #fff;
  text-align: center; }
  .cpHeading.cpHeading--first {
    padding: 70px 0 50px; }
  .cpHeading.bg-border {
    margin: 0 0 20px;
    padding: 0;
    background: #6da43f;
    text-align: left; }
  .cpHeading .cpHeading__ttl {
    text-align: center;
    padding: 0 30px; }
    .cpHeading .cpHeading__ttl .cpHeading__ttl__img {
      max-width: 100%;
      vertical-align: bottom; }
  .cpHeading .cpHeading__lead {
    max-width: 1000px;
    margin: auto;
    padding: 20px;
    font-size: 24px;
    line-height: 1.6;
    color: #804732;
    text-align: left; }
  .cpHeading .cpHeading__lead--note {
    padding: 20px 0;
    font-size: 16px;
    color: #5e5d5d; }
  .cpHeading .cpHeading__innerwrap {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: left;
    box-sizing: border-box; }

.cplead {
  padding: 0;
  text-align: center;
  font-size: 20px;
  line-height: 1.8;
  color: #804732; }
  .cplead .text-bule {
    color: #466abd; }

.cpRank-wrap {
  margin: 50px 0 0; }

.cpRank {
  text-align: center;
  line-height: 0; }
  .cpRank .cpRank__img {
    max-width: 100%;
    vertical-align: bottom; }

.btn-list {
  margin: 0 auto;
  padding: 20px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  .btn-list .btn-list__item {
    width: 32%; }

.btn-text-link {
  margin: 0 auto 40px;
  font-size: 16px;
  line-height: 1.4;
  text-align: right; }
  .btn-text-link a {
    position: relative;
    color: #f20520;
    padding-right: 15px; }
    .btn-text-link a::before {
      position: absolute;
      top: 0;
      bottom: 0;
      right: 5px;
      width: 8px;
      height: 8px;
      border-top: 2px solid #f20520;
      border-right: 2px solid #f20520;
      transform: rotate(45deg);
      margin: auto;
      content: ""; }
    .btn-text-link a:hover {
      text-decoration: underline; }

.content-txtArea {
  margin-top: 30px;
  padding: 20px 15px;
  background: #fff;
  border: 2px solid #f0f0f0;
  text-align: left; }
  .content-txtArea li {
    margin-left: 20px;
    font-size: 15px;
    line-height: 1.9;
    list-style: outside disc; }
  .content-txtArea a {
    color: #e90000;
    font-weight: bold; }
    .content-txtArea a:hover {
      text-decoration: underline; }

.f-rb {
  color: #e90000;
  font-weight: bold; }

.f-bld {
  font-weight: bold; }

.as-wrap {
  padding: 30px 20px;
  background: #fff;
  border-radius: 8px; }
  .as-wrap:not(:first-of-type) {
    margin-top: 20px; }
  .as-wrap .as-wrap__ttl {
    padding-bottom: 5px;
    font-size: 24px;
    font-weight: bold;
    color: #333333; }

.btn-m {
  background: #fff;
  border-radius: 5px;
  border: 1px solid #058cc4;
  width: 100%;
  vertical-align: middle;
  position: relative;
  box-sizing: border-box; }
  .btn-m a {
    display: block;
    padding: 12px 10px;
    color: #058cc4;
    text-align: center;
    font-size: 18px; }
  .btn-m::before {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 15px;
    width: 7px;
    height: 7px;
    border-top: 3px solid #058cc4;
    border-right: 3px solid #058cc4;
    transform: rotate(45deg);
    margin: auto;
    content: ""; }
  .btn-m:hover {
    background: #e6fdff; }
  .btn-m--new01 {
    border: 1px solid #5da024; }
    .btn-m--new01 a {
      color: #5da024; }
    .btn-m--new01:hover {
      background: #f2ffe7; }
    .btn-m--new01::before {
      border-top: 3px solid #5da024;
      border-right: 3px solid #5da024; }
  .btn-m--new02 {
    border: 1px solid #f47303; }
    .btn-m--new02 a {
      color: #f47303; }
    .btn-m--new02:hover {
      background: #fff8f1; }
    .btn-m--new02::before {
      border-top: 3px solid #f47303;
      border-right: 3px solid #f47303; }

.btn-l {
  background: #466abd;
  box-shadow: 0 2px 0 #eeeeee;
  border-radius: 6px;
  margin: 0 auto;
  max-width: 400px;
  vertical-align: middle;
  position: relative; }
  .btn-l a {
    padding: 12px 10px;
    color: #fff;
    text-align: center;
    font-weight: bold;
    display: block;
    font-size: 24px; }
    .btn-l a span {
      display: block;
      font-size: 16px; }
  .btn-l::before {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 15px;
    width: 10px;
    height: 10px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg);
    margin: auto;
    content: ""; }
  .btn-l.btn-l--sub {
    background: #fa8700; }
  .btn-l.btn-l--details {
    margin-top: 20px;
    background: #fff;
    border: 2px solid #29a572;
    box-sizing: border-box; }
    .btn-l.btn-l--details a {
      color: #29a572; }
    .btn-l.btn-l--details::before {
      border-top: 3px solid #29a572;
      border-right: 3px solid #29a572; }
  .btn-l--sp {
    background: #f73154;
    box-shadow: 1px 2px 0 #61111f;
    max-width: 600px; }
  .btn-l:hover {
    opacity: 0.6;
    text-decoration: none; }

.btn-n {
  cursor: pointer;
  outline: none;
  appearance: none;
  max-width: 400px;
  width: 100%;
  padding: 13px 20px 13px 15px;
  font-size: 20px;
  border: 1px solid #1d3850;
  color: #1d3850;
  line-height: 1.4;
  box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.4) inset;
  border-radius: 4px;
  font-weight: 700;
  text-align: center;
  background-color: #fff;
  position: relative; }
  .btn-n:hover {
    opacity: 0.6;
    text-decoration: none; }

.btn-wrap {
  padding: 0;
  margin: 40px auto 0; }

.coupon .coupon__area {
  max-width: 664px;
  margin: 0 auto; }
  .coupon .coupon__area .coupon__area__img {
    position: relative;
    height: 0;
    padding-top: 35.54%;
    background: url(../img/coupon-bg.png) 0 0 no-repeat;
    background-size: contain; }
    .coupon .coupon__area .coupon__area__img .coupon__area__img__txt {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translateY(-50%) translateX(-50%);
      margin: auto;
      font-size: 8rem;
      font-weight: bold;
      letter-spacing: 0.1rem;
      z-index: 100;
      display: inline; }
  .coupon .coupon__area .coupon__area__copyBtn {
    margin: 0 auto;
    text-align: center; }
.coupon .coupon__desc {
  margin: 20px 0 0;
  padding: 15px;
  background: #f9f9f9;
  border: 1px solid #dedede; }
  .coupon .coupon__desc ol li {
    margin-left: 1.5em;
    margin-bottom: 0.5em;
    list-style: decimal;
    font-size: 16px; }
    .coupon .coupon__desc ol li span {
      color: #ef1955; }
  .coupon .coupon__desc ul li {
    font-size: 14px;
    color: #515151; }
    .coupon .coupon__desc ul li::before {
      content: "※"; }
    .coupon .coupon__desc ul li a {
      color: #1e87ff;
      text-decoration: underline; }
      .coupon .coupon__desc ul li a:hover {
        opacity: 0.6;
        text-decoration: none; }
  .coupon .coupon__desc.coupon__desc--n {
    background: #fff;
    border: none; }

.cpCoupon__ttl {
  margin-bottom: 25px;
  word-break: break-all; }
  .cpCoupon__ttl__txt {
    padding: 5px 15px;
    font-size: 30px;
    font-weight: bold;
    line-height: 1.4;
    color: #6e472c;
    border-left: 12px solid #80bb4e;
    display: inline-block; }
.cpCoupon__newMember {
  max-width: 700px;
  margin: 0 auto;
  padding: 30px 20px;
  border: 8px solid #f6f6f6;
  box-sizing: border-box;
  font-size: 18px;
  font-weight: bold; }
  .cpCoupon__newMember__up {
    padding-bottom: 25px;
    border-bottom: 1px dashed #cccccc; }
    .cpCoupon__newMember__up .cpCoupon__newMember__up__note {
      padding: 0 0 10px 0;
      text-align: center;
      color: #ef1955;
      font-size: 14px; }
  .cpCoupon__newMember__under {
    padding-top: 20px;
    text-align: center; }
    .cpCoupon__newMember__under span {
      display: block;
      padding-bottom: 15px; }
    .cpCoupon__newMember__under__img {
      max-width: 100%;
      vertical-align: bottom; }
      .cpCoupon__newMember__under__img:hover {
        opacity: 0.6;
        text-decoration: none; }
.cpCoupon__stepImg {
  max-width: 700px;
  margin: 0 auto; }
  .cpCoupon__stepImg img {
    width: 100%;
    vertical-align: bottom; }
.cpCoupon--step-f {
  padding: 0 0 40px; }
.cpCoupon--step {
  padding: 40px 0 40px;
  border-top: 1px dashed #ccc; }
  .cpCoupon--step:last-of-type {
    padding-bottom: 0; }
.cpCoupon__pay {
  margin: 40px 0;
  font-size: 18px;
  font-weight: bold;
  text-align: center; }
  .cpCoupon__pay__ttl {
    font-size: 24px;
    padding-bottom: 5px;
    display: block; }
  .cpCoupon__pay__box {
    max-width: 700px;
    margin: 0 auto;
    padding: 30px 20px;
    border: 8px solid #f6f6f6;
    box-sizing: border-box; }
    .cpCoupon__pay__box__list:not(:first-child) {
      margin-top: 15px;
      padding-top: 25px;
      border-top: 1px dashed #ccc; }
    .cpCoupon__pay__box__list span {
      display: block;
      text-align: left; }
    .cpCoupon__pay__box__list img {
      width: 100%;
      max-width: 400px;
      vertical-align: bottom; }

/* FOOTER
------------------------------------------------*/
.hr-border {
  border-top: 4px double #c9bbb6; }

.cpFooter {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 20px 0;
  box-sizing: border-box;
  /* 注意事項　リンク色変更 */
  /* 注意事項　通常版 */
  /* FOOTER nav
  ------------------------------------------------*/ }
  @media only screen and (max-width: 480px) {
    .cpFooter {
      padding: 0 15px 0; } }
  .cpFooter .cpFooter__ttl {
    margin: 0 0 25px 0;
    padding: 0 0 8px 0;
    border-bottom: solid 1px #fff;
    font-size: 24px;
    font-weight: bold;
    line-height: 1; }
  .cpFooter .cpFooter__attn--norm a {
    color: #fcff16;
    text-decoration: underline; }
  .cpFooter .cpFooter__attn--norm {
    margin: 0 auto;
    padding: 50px 0 0;
    color: #fff; }
    .cpFooter .cpFooter__attn--norm:last-of-type {
      padding: 50px 0 30px; }
    .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__hd-ac {
      font-size: 20px;
      font-weight: bold;
      margin: 0 0 15px 0;
      line-height: 1; }
    .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list {
      margin: 0 0 30px; }
    .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list li {
      line-height: 1.4;
      list-style: outside disc;
      margin: 0 0 10px 1.25em;
      font-size: 16px; }
      .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list li:last-of-type {
        margin: 0 0 0 1.25em; }
      .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list li .cpFooter__attn--norm__list__img {
        text-align: center;
        padding: 20px; }
        .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list li .cpFooter__attn--norm__list__img img {
          max-width: 100%;
          vertical-align: bottom; }
  .cpFooter .cpNav {
    margin-bottom: 15px;
    border: 1px solid #666; }
    .cpFooter .cpNav__wrap--obox, .cpFooter .cpNav__wrap--cbox {
      display: flex;
      flex-wrap: wrap; }
    .cpFooter .cpNav__wrap--obox li {
      width: 33.33333%; }
    .cpFooter .cpNav__wrap--cbox li {
      width: 25%; }
    .cpFooter .cpNav__wrap--obox li, .cpFooter .cpNav__wrap--cbox li {
      border-top: 1px solid #666;
      border-left: 1px solid #666;
      margin-top: -1px;
      margin-left: -1px;
      font-size: 14px;
      display: block; }
      .cpFooter .cpNav__wrap--obox li a, .cpFooter .cpNav__wrap--cbox li a {
        position: relative;
        display: block;
        padding: 10px 20px 10px 15px;
        color: #2f2f2f;
        min-height: 44px;
        box-sizing: border-box; }
        .cpFooter .cpNav__wrap--obox li a:hover, .cpFooter .cpNav__wrap--cbox li a:hover {
          opacity: 0.6;
          text-decoration: none;
          background: rgba(241, 241, 241, 0.6); }
        .cpFooter .cpNav__wrap--obox li a::after, .cpFooter .cpNav__wrap--cbox li a::after {
          content: '';
          position: absolute;
          top: 50%;
          right: 15px;
          width: 6px;
          height: 6px;
          border-right: 2px solid #666;
          border-bottom: 2px solid #666;
          transform: rotate(-45deg);
          margin-top: -6px; }
  .cpFooter .bt {
    font-weight: bold; }

@media screen and (max-width: 1000px) {
  .pagewrap {
    width: 100%; }

  .cpTitle .cpTitle__day {
    padding: 0 20px;
    bottom: -30px;
    box-sizing: border-box; }

  .cpHeading {
    padding: 40px 0; }
    .cpHeading .cpHeading__ttl {
      font-size: 20px; }
    .cpHeading .cpHeading__lead--note {
      font-size: 14px; }

  .btn-m a {
    font-size: 16px; }

  /* FOOTER
  ------------------------------------------------*/
  .cpFooter {
    width: auto;
    /* 注意事項　リンク色変更 */
    /* 注意事項　通常版 */ }
    .cpFooter .cpFooter__ttl {
      font-size: 22px; }
    .cpFooter .cpFooter__attn--norm a {
      color: #fcff16;
      text-decoration: underline; }
    .cpFooter .cpFooter__attn--norm {
      margin: 0 auto;
      padding: 40px 0 0; }
      .cpFooter .cpFooter__attn--norm:last-of-type {
        padding: 40px 0; }
      .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__hd-ac {
        font-size: 18px;
        margin: 0 0 15px 0; }
      .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list li {
        line-height: 1.4;
        list-style: outside disc;
        margin: 0 0 10px 1.25em;
        font-size: 14px; } }
@media screen and (max-width: 800px) {
  /*  article内 header
  ------------------------------------------------*/
  .cpHeading.cpHeading--first {
    padding: 50px 0 40px; }
  .cpHeading.bg-border {
    padding: 50px 0;
    background-size: 30px, 30px, auto; }
  .cpHeading .cpHeading__ttl {
    padding: 0 15px; }
  .cpHeading .cpHeading__lead {
    padding: 15px;
    font-size: 18px;
    line-height: 1.4; }
  .cpHeading .cpHeading__lead--note {
    padding: 15px 0;
    font-size: 14px; }
  .cpHeading .cpHeading__innerwrap {
    padding: 0 30px; }

  .cplead {
    padding: 0 20px;
    font-size: 18px; }

  .cpRank-wrap {
    margin: 15px 0 0; }

  .btn-text-link {
    font-size: 16px; }

  .content-txtArea {
    margin-top: 20px; }

  .as-wrap {
    padding: 20px 15px; }
    .as-wrap:not(:first-of-type) {
      margin-top: 15px; }
    .as-wrap .as-wrap__ttl {
      font-size: 20px; }

  .btn-l a {
    font-size: 20px; }
    .btn-l a span {
      font-size: 14px; }
  .btn-l.btn-l--details {
    margin-top: 10px; }

  .btn-n {
    font-size: 18px; }

  .btn-text-link {
    margin: 0 auto 20px;
    font-size: 15px; }

  .content-txtArea li {
    font-size: 13px;
    line-height: 1.7; }

  .btn-wrap {
    margin: 20px auto 0; }

  .cpCoupon {
    padding: 30px 20px; }
    .cpCoupon__ttl {
      margin-bottom: 20px; }
      .cpCoupon__ttl__txt {
        padding: 5px 15px;
        font-size: 24px;
        border-left: 8px solid #80bb4e; }
    .cpCoupon__stepImg {
      max-width: 500px; }
    .cpCoupon__newMember {
      padding: 30px 20px;
      font-size: 16px; }
      .cpCoupon__newMember__up {
        padding-bottom: 25px; }
      .cpCoupon__newMember__under {
        padding-top: 20px; }
        .cpCoupon__newMember__under span {
          padding-bottom: 15px; }

  .coupon .coupon__area .coupon__area__img .coupon__area__img__txt {
    font-size: 6rem; }

  /* FOOTER
  ------------------------------------------------*/
  .cpFooter {
    /* FOOTER nav */
    /* 注意事項　通常版 */ }
    .cpFooter .cpFooter__attn--norm {
      padding: 0; }
      .cpFooter .cpFooter__attn--norm:last-of-type {
        padding: 0; }
    .cpFooter .cpFooter__ttl {
      margin: 0 0 20px 0;
      font-size: 20px; }
    .cpFooter .cpNav {
      margin-bottom: 10px; }
      .cpFooter .cpNav__wrap--obox li {
        width: 100%; }
      .cpFooter .cpNav__wrap--cbox li {
        width: 100%; }
      .cpFooter .cpNav__wrap--obox li, .cpFooter .cpNav__wrap--cbox li {
        font-size: 12px; }
        .cpFooter .cpNav__wrap--obox li a, .cpFooter .cpNav__wrap--cbox li a {
          padding: 12px 5px 0 10px; } }
@media screen and (max-width: 480px) {
  .cpTitle .cpTitle__day {
    padding: 0 10px;
    bottom: -15px; }

  .cpHeading {
    padding: 20px 0; }
    .cpHeading.cpHeading--first {
      padding: 30px 0 20px; }
    .cpHeading.bg-border {
      padding: 25px 0 10px;
      background-size: 16px, 16px, auto; }
    .cpHeading .cpHeading__lead {
      padding: 10px 15px;
      font-size: 14px; }
    .cpHeading .cpHeading__lead--note {
      padding: 10px 15px;
      font-size: 12px; }
    .cpHeading .cpHeading__innerwrap {
      padding: 0 15px; }

  .cplead {
    padding: 0;
    font-size: 14px;
    line-height: 1.4; }

  .cpRank-wrap {
    margin: 20px 0 0; }
    .cpRank-wrap .btn-list {
      margin: 0 auto;
      padding: 15px 0;
      display: block;
      flex-wrap: nowrap;
      justify-content: flex-start; }
      .cpRank-wrap .btn-list .btn-list__item {
        width: 100%; }
        .cpRank-wrap .btn-list .btn-list__item:not(:first-of-type) {
          margin-top: 10px; }

  .content-txtArea {
    margin-top: 15px;
    padding: 10px; }

  .as-wrap {
    padding: 15px 10px;
    border-radius: 6px; }
    .as-wrap:not(:first-of-type) {
      margin-top: 10px; }
    .as-wrap .as-wrap__ttl {
      font-size: 16px; }

  .btn-m {
    width: 100%; }
    .btn-m a {
      padding: 8px 10px;
      font-size: 14px; }

  .btn-l a {
    padding: 10px 20px;
    font-size: 16px; }
    .btn-l a span {
      font-size: 12px; }
  .btn-l::before {
    width: 6px;
    height: 6px; }

  .btn-n {
    padding: 15px 20px;
    font-size: 15px; }
    .btn-n::before {
      width: 6px;
      height: 6px; }

  .spnone {
    display: none; }

  .cpCoupon__ttl {
    margin-bottom: 15px; }
    .cpCoupon__ttl__txt {
      padding: 5px 10px;
      font-size: 18px;
      line-height: 1.2; }
  .cpCoupon__newMember {
    padding: 15px 10px;
    border: 6px solid #f6f6f6;
    font-size: 14px; }
    .cpCoupon__newMember__up {
      padding-bottom: 15px; }
    .cpCoupon__newMember__under {
      padding-top: 10px; }
      .cpCoupon__newMember__under span {
        padding-bottom: 10px; }
  .cpCoupon--step-f {
    padding: 0 0 15px; }
  .cpCoupon--step {
    padding: 15px 0 15px;
    border-top: 1px dashed #ccc; }
  .cpCoupon__pay {
    margin: 20px 0 15px;
    font-size: 14px; }
    .cpCoupon__pay__ttl {
      font-size: 16px; }
    .cpCoupon__pay__box {
      max-width: 700px;
      padding: 15px 10px;
      border: 6px solid #f6f6f6; }
      .cpCoupon__pay__box__list:not(:first-child) {
        margin-top: 10px;
        padding-top: 15px; }

  .coupon .coupon__area .coupon__area__img .coupon__area__img__txt {
    font-size: 4rem; }
  .coupon .coupon__desc {
    margin-top: 10px;
    padding: 10px; }
    .coupon .coupon__desc ol li {
      margin-left: 1.4em;
      margin-bottom: 0.3em;
      font-size: 14px; }
    .coupon .coupon__desc ul li {
      font-size: 12px; }

  /* FOOTER
  ------------------------------------------------*/
  .cpFooter {
    /* 注意事項　通常版 */ }
    .cpFooter .cpFooter__ttl {
      margin: 0 0 15px 0;
      font-size: 18px; }
    .cpFooter .cpFooter__attn--norm {
      padding: 0; }
      .cpFooter .cpFooter__attn--norm:last-of-type {
        padding: 0; }
      .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__hd-ac {
        font-size: 16px;
        padding: 0 0 5px 0;
        margin: 0 0 10px 0; }
      .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list li {
        line-height: 1.2;
        margin: 0 0 10px 1.25em;
        font-size: 14px; }
        .cpFooter .cpFooter__attn--norm .cpFooter__attn--norm__list li .cpFooter__attn--norm__list__img {
          padding: 10px; }

  .loginbox {
    margin: 15px 15px 0; }
    .loginbox .loginbox__txt {
      padding: 0 0 8px;
      font-size: 14px; }

  .pl.fixed {
    display: flex;
    justify-content: space-between;
    position: fixed;
    top: 0;
    padding: 0;
    width: 100%;
    z-index: 1000; } }