@charset "UTF-8";
#content_wrap.top #content {
  background: url("../images/main_bg.png") center top repeat-y;
  background-size: contain; }

.ac_btn {
  display: block;
  padding: 20px 0 15px;
  border: solid 3px #efbf00;
  background: url("../images/icon_arrow08.png") 96% center no-repeat #ffe100;
  color: #333 !important;
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  border-radius: 5px;
  text-decoration: none;
  background-size: 15px 10px; }

.clickBtn_on2 {
  background: url("../images/icon_arrow09.png") 96% center no-repeat #ffe100;
  background-size: 15px 10px; }

.ac_detail {
  padding: 20px 15px;
  border: solid 3px #efbf00;
  background: #ffe242;
  border-top: none;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px; }
  .ac_detail .forgot {
    width: 100%;
    padding: 20px 15px 0;
    text-align: center;
    margin-left: -15px;
    border-top: dashed 1px #998a19; }
    .ac_detail .forgot a {
      text-decoration: none; }

.login_about_txt {
  text-align: center;
  margin-bottom: 30px; }

.login_about {
  margin-bottom: 30px; }
  .login_about .left01 {
    float: left;
    width: 53%; }
  .login_about .right01 {
    float: left;
    width: 47%; }
  .login_about .left02 {
    float: left;
    width: 38%; }
  .login_about .right02 {
    float: left;
    width: 62%; }
  .login_about .txt01 {
    padding-left: 14%; }
  .login_about .txt02 {
    padding-left: 8%; }
  .login_about img.right01_position {
    width: 50%;
    position: relative;
    bottom: -65px;
    right: -15px; }

#login_btm_link {
  padding: 20px 0 0;
  margin-bottom: 30px; }
  #login_btm_link li {
    text-align: center;
    margin-bottom: 10px; }
    #login_btm_link li a {
      font-size: 1.4rem; }
  #login_btm_link img {
    width: 15px;
    vertical-align: 0;
    margin-left: 8px; }

footer {
  width: 90%;
  margin: 0 auto; }
  footer img {
    width: 15px;
    margin: 0 3px;
    vertical-align: 0; }

.backBtn {
  padding: 17px 0 12px;
  margin-bottom: 0; }

.campaign_check {
  padding: 0 15px 15px;
  background: #f4f4f4;
  border-top: 1px solid #e9e9e9; }
  .campaign_check input {
    display: none; }
  .campaign_check label {
    display: flex;
    display: -webkit-flex;
    background: url("../images/campaign_check_off.png") left center no-repeat;
    padding-left: 50px;
    background-size: 36px 36px; }
    .campaign_check label.active {
      background: url("../images/campaign_check_on.png") left center no-repeat;
      background-size: 36px 36px; }
    .campaign_check label.applied {
      background: url("../images/campaign_check_applied.png") left center no-repeat;
      background-size: 36px 36px; }
  .campaign_check li {
    padding: 15px 0 10px;
    line-height: 1.6;
    border-bottom: solid 1px #ddd; }
  .campaign_check.receipt {
    padding: 0 15px;
    background: #fff;
    border-top: 1px solid #e9e9e9; }
    .campaign_check.receipt li {
      padding: 12px 0 10px; }
      .campaign_check.receipt li:last-child {
        border-bottom: none; }
      .campaign_check.receipt li span {
        display: table-cell;
        vertical-align: middle; }
      .campaign_check.receipt li .store_name {
        width: 45%;
        -webkit-transform: translateY(25%);
        -ms-transform: translateY(25%);
        transform: translateY(25%); }
      .campaign_check.receipt li .price {
        text-align: right;
        height: 40px;
        width: 60%; }

.campaign_condition {
  padding: 0 15px;
  border-top: 1px solid #e9e9e9; }
  .campaign_condition li {
    background: url("../images/receipt_check_off.png") right center no-repeat;
    background-size: 20px auto;
    padding: 12px 0 8px;
    line-height: 1.5;
    border-bottom: solid 1px #ddd; }
    .campaign_condition li.achieved {
      background: url("../images/receipt_check_on.png") right center no-repeat;
      background-size: 20px auto; }

.campaign_application_button {
  padding: 15px;
  border-bottom: 1px solid #e9e9e9; }

.campaign_data.receipt {
  display: flex; }
  .campaign_data.receipt p {
    vertical-align: middle; }
  .campaign_data.receipt span {
    font-weight: normal; }
  .campaign_data.receipt .select {
    width: 60%; }
  .campaign_data.receipt .count {
    width: 40%;
    text-align: right; }

.newsbox .date {
  color: #333; }

.newsbox .detail_head {
  display: table;
  table-layout: fixed;
  width: 100%; }
  .newsbox .detail_head .img, .newsbox .detail_head .txt {
    display: table-cell;
    vertical-align: middle; }
  .newsbox .detail_head .img {
    width: 8%; }
    .newsbox .detail_head .img img {
      vertical-align: middle; }
  .newsbox .detail_head .txt {
    overflow-wrap: break-word;
    padding-left: 15px;
    width: 92%;
    word-wrap: break-word; }
    .newsbox .detail_head .txt .company_line {
      font-weight: bold; }

.logwindow {
  display: none;
  left: 10%;
  position: absolute;
  width: 80%;
  z-index: 10; }
  .logwindow .alert_title {
    background: #fff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 15px 10px 0 10px;
    text-align: center; }
  .logwindow .alert_middle {
    background: #fff;
    padding: 10px;
    text-align: center; }
  .logwindow .alert_txt {
    background: #fff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 30px 10px;
    text-align: center; }
  .logwindow .confirm_positive a {
    background: #fff;
    border-top: solid 1px #333;
    display: block;
    font-size: 1.6rem;
    padding: 15px 0;
    text-align: center;
    text-decoration: none;
    width: 100%; }
  .logwindow .confirm_close a {
    background: #fff;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-top: solid 1px #333;
    display: block;
    font-size: 1.6rem;
    padding: 15px 0;
    text-align: center;
    text-decoration: none;
    width: 100%; }

#new_alert {
  background: #7f5a01;
  text-align: center; }
  #new_alert a {
    display: block;
    padding: 10px 0;
    color: #fff;
    font-size: 1.4rem;
    font-weight: bold;
    text-decoration: none; }
    #new_alert a img {
      width: 18px;
      vertical-align: middle;
      margin-right: 8px; }

#important_alert {
  background: url("../images/icon_arrow07.png") 95% center no-repeat #ffb400;
  background-size: 12px 18px;
  text-align: center; }
  #important_alert a {
    display: block;
    padding: 10px 0;
    color: #000;
    font-size: 1.4rem;
    font-weight: bold;
    text-decoration: none; }
    #important_alert a span {
      text-align: left;
      width: 85%;
      display: inline-block; }

#bcTarget {
  background: #fff; }

#receipt_head {
  padding: 0 15px 10px;
  border-bottom: solid 1px #a49100;
  margin-bottom: 12px;
  display: table;
  width: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box; }
  #receipt_head .month {
    display: table-cell;
    font-size: 2.4rem;
    font-weight: bold;
    line-height: 1.0;
    text-align: center;
    padding-right: 4px; }
    #receipt_head .month span {
      font-size: 1.2rem;
      vertical-align: middle;
      padding-left: 5px;
      margin-right: 10px; }
      #receipt_head .month span:last-child {
        margin-right: 0; }
  #receipt_head .arrow_left {
    display: table-cell;
    width: 14px; }
  #receipt_head .arrow_right {
    display: table-cell;
    width: 14px;
    float: right; }

.total_price {
  padding: 10px;
  font-size: 1.4rem;
  line-height: 1.2;
  text-align: center;
  border-bottom: solid 1px #ccc; }
  .total_price span {
    font-size: 1.8rem;
    font-weight: bold; }

.receiptlist {
  background: #fff; }
  .receiptlist .receipt {
    display: table;
    position: relative;
    padding: 10px 12% 10px 15px;
    background-size: 12px 19px;
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box; }
    .receiptlist .receipt p {
      display: table-cell;
      vertical-align: middle; }
    .receiptlist .receipt .day {
      width: 20%;
      font-size: 1.8rem;
      font-weight: bold;
      line-height: 1;
      text-align: center;
      padding-right: 20px; }
      .receiptlist .receipt .day span {
        display: block;
        color: #555;
        font-size: 1.6rem;
        text-align: center; }
    .receiptlist .receipt .logo {
      width: 20%; }
    .receiptlist .receipt .price {
      width: 80%;
      font-size: 2.4rem;
      line-height: 1.2;
      text-align: right; }
      .receiptlist .receipt .price span.receipt_scan {
        background-color: #ffba0e;
        color: #fff;
        border-radius: 20px;
        font-size: 1.0rem; }
      .receiptlist .receipt .price span {
        color: #555;
        font-size: 1.2rem; }
    .receiptlist .receipt .other {
      width: 80%;
      font-size: 2.0rem;
      line-height: 1.2;
      text-align: right; }
      .receiptlist .receipt .other span {
        color: #555;
        font-size: 1.2rem; }
    .receiptlist .receipt .ocr {
      width: 80%;
      font-size: 2.4rem;
      line-height: 1.0;
      text-align: right; }
      .receiptlist .receipt .ocr span.receipt_scan {
        background-color: #ffba0e;
        color: #fff;
        border-radius: 20px;
        font-size: 0.8rem;
        display: inline-block;
        width: 92px;
        text-align: center; }
      .receiptlist .receipt .ocr span {
        color: #555;
        font-size: 1.2rem; }
    .receiptlist .receipt .warranty {
      font-size: 1.8rem;
      font-weight: bold;
      line-height: 1.4;
      padding: 0.6rem 0;
      text-align: left; }
      .receiptlist .receipt .warranty span {
        color: #555;
        font-size: 1.2rem;
        font-weight: normal; }
  .receiptlist .receipt_apply {
    background: url("../images/receipt_label01.png") right top no-repeat;
    background-size: auto 70%; }
  .receiptlist .receipt_applied {
    background: url("../images/receipt_label02.png") right top no-repeat;
    background-size: auto 70%; }
  .receiptlist .training {
    background: url("../images/receipt_list_training.png") left top no-repeat;
    background-size: auto 63%; }
  .receiptlist .training_receipt_apply {
    background: url("../images/receipt_list_training.png") left top no-repeat, url("../images/receipt_label01.png") right top no-repeat;
    background-size: auto 63%; }
  .receiptlist .training_receipt_applied {
    background: url("../images/receipt_list_training.png") left top no-repeat, url("../images/receipt_label02.png") right top no-repeat;
    background-size: auto 63%; }
  .receiptlist .campaign {
    background: url("../images/receipt_label01.png") right top no-repeat;
    background-size: 60px auto; }
  .receiptlist .campaign_done {
    background: url("../images/receipt_label02.png") right top no-repeat;
    background-size: 60px auto; }
  .receiptlist .campaign_coupon {
    background: url("../images/receipt_label03.png") right top no-repeat;
    background-size: 60px auto; }
  .receiptlist .campaign_coupon_done {
    background: url("../images/receipt_label04.png") right top no-repeat;
    background-size: 60px auto; }
  .receiptlist a {
    display: block;
    background: url("../images/icon_arrow.png") 92% center no-repeat;
    text-decoration: none;
    border-bottom: solid 1px #ccc;
    background-size: 12px 19px; }

.receipt_detail {
  margin: 15px;
  background: #fff; }
  .receipt_detail .monthly_section {
    margin: 0; }
    .receipt_detail .monthly_section .receipt_fix {
      padding: 0 15px;
      border-bottom: 1px solid #e9e9e9; }
      .receipt_detail .monthly_section .receipt_fix .monthly_spending {
        border-bottom: 0; }
        .receipt_detail .monthly_section .receipt_fix .monthly_spending span {
          font-size: 1.4rem;
          vertical-align: middle; }
        .receipt_detail .monthly_section .receipt_fix .monthly_spending.gray {
          color: #a3a3a3; }
      .receipt_detail .monthly_section .receipt_fix .toggle {
        display: block;
        padding: 10px;
        background: url("../images/icon_arrow10.png") right center no-repeat;
        color: #555;
        font-size: 1.4rem;
        text-align: center;
        text-decoration: none;
        border-top: 1px dashed #e5e5e5;
        background-size: 14px 10px; }
        .receipt_detail .monthly_section .receipt_fix .toggle.clickBtn_on0 {
          background: url("../images/icon_arrow11.png") right center no-repeat;
          background-size: 14px 10px; }
  .receipt_detail .detail_inner {
    padding: 20px 15px; }
    .receipt_detail .detail_inner.detail_inner_receipt {
      padding-top: 0; }
    .receipt_detail .detail_inner .campaign_btn {
      display: block;
      padding: 15px 20px 15px 5px;
      background: url("../images/icon_arrow07.png") 97% center no-repeat #ffe100;
      font-size: 1.2rem;
      font-weight: bold;
      line-height: 1.8rem;
      text-align: center;
      text-decoration: none;
      border-radius: 5px;
      background-size: 12px auto; }
      .receipt_detail .detail_inner .campaign_btn img {
        width: 18px;
        margin: auto 4px; }
      .receipt_detail .detail_inner .campaign_btn span {
        color: #e83434;
        font-size: 1.8rem;
        line-height: 1.8rem;
        margin: auto 1px;
        vertical-align: sub; }
    .receipt_detail .detail_inner .receipt_img img {
      border: 1px solid #ccc;
      box-sizing: border-box;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box; }

.receipt_cam_wrap a {
  text-decoration: none; }

.receipt_cam_box {
  background: #fff;
  border-radius: 5px;
  margin-bottom: 20px; }
  .receipt_cam_box .campaign_txt {
    position: absolute;
    width: 60%;
    margin: auto;
    padding: 8px 0 5px;
    border: dashed 1px #d9d9d9;
    background: #fff;
    color: #ff6000;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    top: -15%;
    left: 0;
    right: 0;
    border-radius: 20px; }
  .receipt_cam_box .detail_head {
    padding: 10px 10px 20px; }
    .receipt_cam_box .detail_head .img {
      float: left;
      width: 24%; }
    .receipt_cam_box .detail_head .txt {
      float: left;
      width: 76%; }
      .receipt_cam_box .detail_head .txt p {
        padding-left: 10px; }
  .receipt_cam_box .detail_bottom {
    position: relative;
    padding: 25px 10px 10px;
    background: #f3f3f3;
    border-top: dashed 1px #d9d9d9;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px; }
  .receipt_cam_box .campaign_txt_open {
    position: absolute;
    width: 60%;
    margin: auto;
    padding: 8px 0 5px;
    border: dashed 1px #d9d9d9;
    background: #fff;
    color: #45b035;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    top: -15%;
    left: 0;
    right: 0;
    border-radius: 20px; }
  .receipt_cam_box .campaign_txt_goods {
    position: absolute;
    width: 60%;
    margin: auto;
    padding: 8px 0 5px;
    border: dashed 1px #d9d9d9;
    background: #fff;
    color: #38abe1;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    top: -15%;
    left: 0;
    right: 0;
    border-radius: 20px; }
  .receipt_cam_box .campaign_txt_money {
    position: absolute;
    width: 60%;
    margin: auto;
    padding: 8px 0 5px;
    border: dashed 1px #d9d9d9;
    background: #fff;
    color: #ff6000;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    top: -15%;
    left: 0;
    right: 0;
    border-radius: 20px; }
  .receipt_cam_box .campaign_txt_goods_money {
    position: absolute;
    width: 60%;
    margin: auto;
    padding: 8px 0 5px;
    border: dashed 1px #d9d9d9;
    background: #fff;
    color: #ff0078;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    top: -15%;
    left: 0;
    right: 0;
    border-radius: 20px; }

.promotion_tab {
  margin-bottom: 15px; }
  .promotion_tab a {
    display: block;
    padding: 15px 0;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none; }
  .promotion_tab ul {
    display: table;
    width: 100%; }
    .promotion_tab ul li {
      display: table-cell;
      vertical-align: middle; }
  .promotion_tab .campaign li {
    width: 50%;
    background: #fff; }
    .promotion_tab .campaign li.active {
      background: #ffd800; }
  .promotion_tab .coupons li {
    width: 33%;
    background: #ffef79;
    border-right: 1px solid #fff; }
    .promotion_tab .coupons li:last-child {
      border-right: none; }
    .promotion_tab .coupons li.active {
      background: #fff; }
  .promotion_tab .stamp li {
    background: #ffef79;
    border-right: solid 1px #fff;
    width: 25%; }
    .promotion_tab .stamp li.active {
      background: #fff; }
    .promotion_tab .stamp li:first-child {
      border-radius: 5px 0 0 5px; }
    .promotion_tab .stamp li:last-child {
      border-radius: 0 5px 5px 0;
      border-right: 0; }
    .promotion_tab .stamp li a {
      font-size: 1.2rem; }

@media screen and (max-width: 748px) {
  .promotion_tab ul .otoku_badge_box {
    position: absolute;
    width: 22%;
    text-align: right;
    margin-top: 120px;
    top: 14px; }
  .promotion_tab ul .otoku_badge {
    width: 15px;
    padding-right: 8%; } }

@media screen and (min-width: 749px) {
  .promotion_tab ul .otoku_badge_box {
    position: absolute;
    width: 190px;
    text-align: right;
    margin-top: 62px;
    top: 14px; }
  .promotion_tab ul .otoku_badge {
    width: 20px;
    padding-right: 30px; } }

.issue_step {
  padding: 10px 15px;
  background: #ffd800;
  text-align: center;
  margin-bottom: 15px; }
  .issue_step p {
    font-size: 1.4rem;
    font-weight: bold;
    padding-top: 10px;
    border-top: 1px dashed #c9ac13; }
  .issue_step ul {
    display: table;
    height: 60px;
    margin: 0 auto; }
    .issue_step ul li {
      display: table-cell;
      position: relative;
      vertical-align: top;
      box-sizing: border-box;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box; }
      .issue_step ul li .step_inner {
        display: block;
        position: relative;
        text-decoration: none; }
        .issue_step ul li .step_inner::before {
          display: block;
          position: absolute;
          width: 100%;
          height: 4px;
          background: #fff;
          top: 50%;
          content: '';
          z-index: 1; }
      .issue_step ul li:last-child .step_inner .step_images {
        padding-right: 0; }
      .issue_step ul li:last-child .step_text {
        margin-left: -25px; }
    .issue_step ul .solid-bg .step_images {
      position: relative;
      width: 40px;
      padding-right: 30px;
      z-index: 3; }
    .issue_step ul .pass a {
      display: block;
      height: 60px; }
      .issue_step ul .pass a .step_inner::after {
        display: block;
        position: absolute;
        width: 100%;
        height: 2px;
        background: #ffd800;
        top: 50%;
        margin-top: 1px;
        content: '';
        z-index: 2; }
    .issue_step ul .step_text {
      position: absolute;
      width: 50px;
      top: 46px;
      left: 50%;
      margin-left: -39px; }

.coupons_list a.link_container {
  display: block;
  padding: 10px 10px 10px 15px;
  background: #fff;
  text-decoration: none;
  border-bottom: solid 1px #ccc; }

.coupons_list .link_inner {
  display: table;
  background: url("../images/icon_arrow.png") right center no-repeat;
  background-size: 12px 18px;
  padding-right: 15px;
  table-layout: fixed;
  width: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box; }

.coupons_list .map_icon, .coupons_list .shop_img, .coupons_list .shop_name, .coupons_list .coupons_number {
  display: table-cell;
  vertical-align: middle; }

.coupons_list .shop_name, .coupons_list .coupons_number {
  padding-left: 15px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box; }

.coupons_list .map_icon, .coupons_list .shop_img {
  width: 14%; }

.coupons_list .map_icon {
  text-align: center; }
  .coupons_list .map_icon img {
    width: 60%; }

.coupons_list .shop_name {
  width: 45%;
  font-size: 1.4rem;
  font-weight: bold;
  word-wrap: break-word;
  overflow-wrap: break-word; }
  .coupons_list .shop_name span {
    display: block;
    color: #e83434;
    font-size: 1rem;
    font-weight: normal; }

.coupons_list .coupons_number {
  width: auto;
  color: #555;
  text-align: right;
  padding-right: 10px;
  padding-left: 10px; }

.coupons_list .coupons_inner.one_line {
  padding: 0 5px 10px 15px; }
  .coupons_list .coupons_inner.one_line .coupons_issue_smallbtn {
    width: 15%;
    border-left: 1px dashed #e6e6e6;
    padding-left: 10px; }

.shop_container {
  margin: auto; }
  .shop_container .shop_name_inner {
    display: table;
    padding: 10px 10px 10px 15px;
    background: #f9f9f9;
    border-bottom: solid 2px #ccc;
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box; }
    .shop_container .shop_name_inner .shop_name {
      width: auto;
      font-size: 1.4rem;
      font-weight: bold;
      padding-left: 15px;
      box-sizing: border-box;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box; }
    .shop_container .shop_name_inner .shop_img {
      width: 14%; }
    .shop_container .shop_name_inner .shop_img, .shop_container .shop_name_inner .shop_name {
      display: table-cell;
      vertical-align: middle; }

.coupons_inner {
  display: table;
  padding: 0 10px 10px 15px;
  background: url("../images/border_wave.png") left bottom repeat-x #fff;
  background-size: 100%;
  width: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box; }
  .coupons_inner:last-child {
    background-image: none;
    padding-bottom: 0; }
  .coupons_inner .coupons_img, .coupons_inner label, .coupons_inner .coupons_issue_smallbtn {
    display: table-cell;
    vertical-align: middle; }
  .coupons_inner .coupons_img {
    width: 33%;
    padding: 10px 0; }
  .coupons_inner .coupons_detail {
    display: table-cell;
    padding: 10px 15px;
    vertical-align: top;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box; }
    .coupons_inner .coupons_detail .receipt_coupon {
      border-bottom: dashed 1px #a3a3a3;
      font-size: 1.4rem;
      font-weight: bold;
      line-height: 2.3;
      margin: 20px 0 5px; }
  .coupons_inner .checkbox {
    width: 14%;
    background: url("../images/form_checkbox02_off.png") center center no-repeat;
    line-height: 26px;
    text-align: center;
    background-size: 26px 26px;
    min-height: 26px;
    border-left: 1px dashed #e6e6e6; }
    .coupons_inner .checkbox.active {
      background: url("../images/form_checkbox02_on.png") center center no-repeat;
      background-size: 26px 26px; }
  .coupons_inner [type='checkbox'] {
    position: absolute;
    filter: alpha(opacity=0);
    opacity: 0; }
  .coupons_inner .detail_link {
    text-align: right; }
    .coupons_inner .detail_link a {
      color: #ffad00; }

.coupons_inner .scope, .coupons_detail_head .scope {
  color: #e83434; }

.coupons_inner .discount, .coupons_detail_head .discount {
  color: #e83434;
  font-size: 1.8rem;
  font-weight: bold; }
  .coupons_inner .discount.red_border, .coupons_detail_head .discount.red_border {
    border-top: dashed 1px #e83434;
    border-bottom: dashed 1px #e83434;
    margin: 5px 0; }

.coupons_inner .time_up, .coupons_detail_head .time_up {
  color: #555;
  font-size: 1rem;
  margin-bottom: 10px; }

.individual_promotion_receipt_coupon_inner {
  padding: 10px 15px 10px 0; }

.individual_promotion_receipt_coupon_title {
  text-align: center;
  border-bottom: 1px dashed;
  padding: 10px; }

.individual_promotion_receipt_coupon_detail {
  display: flex;
  align-items: center; }

.individual_promotion_receipt_coupon_img {
  width: 20%;
  margin-right: 10px; }

.coupons_detail_head .time_up {
  padding: 5px 0 3px;
  font-size: 1.2rem;
  border-top: dashed 1px #ccc;
  border-bottom: dashed 1px #ccc; }

.coupons_issue_btn {
  position: fixed;
  width: 140px;
  height: 140px;
  background: url("../images/coupon_use_button_l.png") center center no-repeat;
  bottom: 0;
  left: 50%;
  margin-left: -70px;
  z-index: 99;
  background-size: 140px; }
  .coupons_issue_btn.limitless {
    background: url("../images/coupon_limitless_use_button_l.png") center center no-repeat;
    background-size: 140px; }
  .coupons_issue_btn a {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none; }
    .coupons_issue_btn a p {
      font-size: 11px;
      font-weight: bold;
      text-align: center;
      margin-top: 104px; }

.code_header {
  position: relative;
  padding: 2px 15px;
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
  border-radius: 8px 8px 0 0; }
  .code_header::before {
    position: absolute;
    width: 0;
    height: 0;
    content: '';
    bottom: -8px;
    left: 50%;
    margin-left: -9px;
    border-style: solid;
    border-width: 9px 9px 0 9px;
    z-index: 0; }
  .code_header.yellow {
    background: #ffb400; }
    .code_header.yellow::before {
      border-color: #ffb400 transparent transparent transparent; }
  .code_header.red {
    background: #e83434; }
    .code_header.red::before {
      border-color: #e83434 transparent transparent transparent; }

.code_header_dialog {
  position: relative;
  padding: 2px 15px;
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
  border-radius: 8px 8px 0 0; }
  .code_header_dialog.red {
    background: #e83434; }

.coupon_modal_wrap {
  position: relative;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 100; }

.coupon_modal {
  position: fixed;
  padding: 20px 15px;
  z-index: 100;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  overflow-y: scroll;
  background-color: rgba(0, 0, 0, 0.8);
  width: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box; }
  .coupon_modal .modal_coupon_detail {
    max-width: 748px;
    margin: 50px auto 0; }
  .coupon_modal .modal_toggle {
    position: absolute;
    right: 15px;
    top: 15px; }
    .coupon_modal .modal_toggle a {
      display: block;
      color: #fff;
      font-size: 3.4rem;
      line-height: 3.4rem;
      text-decoration: none; }
  .coupon_modal .last_step {
    color: #fff;
    font-size: 1.4rem;
    margin-left: 1.4rem;
    text-indent: -1.8rem;
    padding-left: 0.4rem;
    padding-right: 3.4rem; }
  .coupon_modal .myid, .coupon_modal .get_coupon {
    background: #fff;
    margin-top: 15px;
    border-radius: 8px; }
  .coupon_modal .myid .code_inner {
    padding: 15px 0;
    overflow: hidden; }
  .coupon_modal .bc_position {
    margin: 0 auto;
    text-align: center; }
  .coupon_modal .get_coupon .code_inner {
    display: table;
    position: relative;
    padding: 15px;
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box; }
    .coupon_modal .get_coupon .code_inner:nth-child(n+3) {
      border-top: 1px solid #e6e6e6; }
    .coupon_modal .get_coupon .code_inner .mask {
      position: absolute;
      padding: 35px 15px;
      text-align: center;
      background-color: rgba(255, 255, 255, 0.9);
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      border-radius: 8px;
      box-sizing: border-box;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box; }
  .coupon_modal .get_coupon .coupons_img, .coupon_modal .get_coupon .code_text {
    display: table-cell;
    vertical-align: top; }
  .coupon_modal .get_coupon .coupons_img {
    width: 33%; }
  .coupon_modal .get_coupon .code_text {
    padding-left: 15px; }
    .coupon_modal .get_coupon .code_text .code_text_header {
      overflow: hidden; }
    .coupon_modal .get_coupon .code_text .goods_name {
      float: left;
      width: 75%;
      font-weight: bold;
      padding-right: 15px;
      box-sizing: border-box;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box; }
    .coupon_modal .get_coupon .code_text .scope {
      float: right;
      width: 25%;
      color: #e83434;
      font-weight: bold;
      text-align: right; }
    .coupon_modal .get_coupon .code_text .coupon_text_header .coupon_name {
      font-size: 2.0em;
      font-weight: bold;
      line-height: 1.2; }
    .coupon_modal .get_coupon .code_text .coupon_text_header .discount {
      color: #e83434;
      font-size: 1.8rem;
      font-weight: bold; }
    .coupon_modal .get_coupon .code_text .coupon_text_header .time_up {
      color: #555;
      font-size: 1rem;
      margin-bottom: 10px; }
  .coupon_modal .get_coupon .coupon_head.disabled {
    opacity: 0.3; }
  .coupon_modal .get_coupon .coupon_shop {
    background: #f4f4f4;
    color: #e83434;
    font-weight: bold;
    padding: 3px 15px; }
  .coupon_modal .start_coupon {
    background: #fee318;
    margin-top: 50px;
    padding: 15px; }
    .coupon_modal .start_coupon .img_recio {
      display: block;
      margin: 60px auto 30px;
      width: 100px; }
    .coupon_modal .start_coupon .txt_exp {
      font-size: 1.4em;
      margin: 30px auto 60px;
      text-align: center; }

.coupon_use_modal_header {
  margin-bottom: 9px;
  background: #000000;
  position: fixed;
  z-index: 1;
  width: 100%;
  height: 64px;
  display: flex;
  align-items: center; }

.coupon_use_modal_wrap {
  background-color: #333333; }

.coupon_use_modal {
  padding: 0; }

.scroll_use_area {
  padding: 18px 17px;
  margin-top: 44px; }

.countdown_timer_values {
  font-size: 1.8rem;
  color: black;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 15px; }

.barcodetime_expired {
  text-align: center;
  font-size: 1.4rem;
  background-color: #cbcbcb;
  margin: 15px 0;
  padding: 18px 0 17px; }

.couponDisplayExplanation {
  font-size: 1.3rem;
  margin: 10px 10px 0; }

.detail_coupon_contents .detail_coupon {
  padding: 0 15px; }

.detail_coupon_contents .toggle_box {
  border-bottom: dashed 1px #ccc;
  padding: 0; }
  .detail_coupon_contents .toggle_box .toggle {
    border-top: dashed 1px #ccc;
    font-size: 1.4em;
    padding: 10px 0 10px 20px;
    text-align: left; }
    .detail_coupon_contents .toggle_box .toggle.app_active {
      background: url("../images/icon_arrow06.png") left center no-repeat;
      background-size: 1.4rem; }

.detail_coupon_contents .toggle_inner li {
  background: #fff;
  font-size: 1.2em; }
  .detail_coupon_contents .toggle_inner li::before {
    content: '■'; }

.filter_margin #section04 {
  padding-top: 0; }

.receipts_filter {
  color: #fff; }
  .receipts_filter a.toggle {
    display: block;
    padding: 8px 30px 8px 5px;
    background: url("../images/icon_arrow04.png") 97% center no-repeat #333;
    background-size: 14px 10px;
    box-sizing: border-box;
    text-decoration: none; }
    .receipts_filter a.toggle.clickBtn_on5 {
      background: url("../images/icon_arrow05.png") 97% center no-repeat #333;
      background-size: 14px 10px; }
    .receipts_filter a.toggle dl {
      display: table; }
      .receipts_filter a.toggle dl dt, .receipts_filter a.toggle dl dd {
        display: table-cell;
        color: #fff;
        font-size: 1.3rem; }
      .receipts_filter a.toggle dl dt {
        padding: 0 8px 0 10px; }
      .receipts_filter a.toggle dl dd {
        padding: 5px 15px;
        background: #555;
        font-weight: bold;
        border-radius: 5px; }
    .receipts_filter a.toggle p {
      color: #fff;
      font-size: 1.3rem;
      padding-left: 10px;
      line-height: 3rem; }
  .receipts_filter .receipt_detail_inner {
    height: 100%;
    padding: 0 15px;
    background: #333;
    border-top: 1px solid #fff;
    background-size: 100% 100%; }
    .receipts_filter .receipt_detail_inner .select_box {
      margin: 20px 0; }
      .receipts_filter .receipt_detail_inner .select_box:first-child {
        border-bottom: 1px dotted #c8c8c8; }
    .receipts_filter .receipt_detail_inner label, .receipts_filter .receipt_detail_inner select {
      display: block; }
    .receipts_filter .receipt_detail_inner label {
      color: #fff;
      font-size: 1.3rem; }
    .receipts_filter .receipt_detail_inner select {
      width: 100%;
      height: 30px;
      padding: 0 6% 0 4px;
      border: none;
      background: url("../images/icon_arrow12.png") 97% center no-repeat #555;
      color: #fff;
      -webkit-appearance: button;
      appearance: button;
      border-radius: 5px;
      margin-bottom: 20px;
      margin-top: 8px;
      background-size: 6px auto; }
    .receipts_filter .receipt_detail_inner .filter_btn {
      padding: 20px 25px;
      border-top: 1px solid #c8c8c8; }
    .receipts_filter .receipt_detail_inner .text_link {
      text-align: center;
      margin-bottom: 15px; }
      .receipts_filter .receipt_detail_inner .text_link a {
        color: #fff; }
    .receipts_filter .receipt_detail_inner [class^='submitBtn02_'] {
      padding: 15px 0 10px; }
  .receipts_filter .submitBtnYellow_active {
    background: #ebd005; }

.month_receipt_line {
  padding: 12px 15px;
  background: #ffe100;
  text-align: right; }
  .month_receipt_line .total_result {
    position: relative; }
  .month_receipt_line .total_price {
    padding: 0 50px 0 10px;
    border-bottom: 0; }
  .month_receipt_line .monthly_totals_link {
    display: block;
    position: absolute;
    background: url("../images/monthly_summary_icon.png") left 0 no-repeat;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.5;
    right: 0;
    top: 0;
    text-decoration: none;
    background-size: 18px auto;
    padding-left: 20px; }

.monthly_section {
  margin: 0 15px;
  background: #fff;
  box-sizing: border-box; }
  .monthly_section .monthly_spending {
    padding: 20px 20px 16px;
    font-size: 2.4rem;
    text-align: center;
    border-bottom: 1px dashed #e5e5e5; }
  .monthly_section .monthly_notice {
    padding: 20px 0;
    text-align: center; }
    .monthly_section .monthly_notice img {
      width: 62px;
      vertical-align: middle; }
    .monthly_section .monthly_notice p {
      display: inline-block;
      width: 176px;
      height: 81px;
      padding: 12px 20px 12px 30px;
      background: url("../images/monthly_summery_balloon.png") left top no-repeat;
      font-weight: bold;
      text-align: left;
      vertical-align: middle;
      background-size: 176px 81px;
      box-sizing: border-box; }
  .monthly_section .category_line dl {
    width: 100%;
    overflow: hidden; }
    .monthly_section .category_line dl:nth-child(odd) {
      background: #f6f6f6; }
    .monthly_section .category_line dl dt {
      float: left;
      width: 65%;
      padding: 12px 12px 12px 70px;
      color: #525252;
      box-sizing: border-box; }
      .monthly_section .category_line dl dt.category_for_selfmedication {
        padding: 10px 15px 10px 70px;
        background: none;
        width: 100%;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -o-box-sizing: border-box; }
        .monthly_section .category_line dl dt.category_for_selfmedication a {
          background: url("../images/icon_arrow.png") right no-repeat;
          background-size: 10px 14px;
          padding-right: 12px;
          display: block; }
    .monthly_section .category_line dl dd {
      box-sizing: border-box;
      color: #555;
      float: right;
      font-weight: bold;
      padding: 12px 15px 12px 12px;
      text-align: right;
      width: 35%; }
  .monthly_section .category_eclipse dt {
    background: url("../images/receipt_detail_01.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_daily dt {
    background: url("../images/receipt_detail_02.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_house dt {
    background: url("../images/receipt_detail_03.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_ent dt {
    background: url("../images/receipt_detail_04.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_culture dt {
    background: url("../images/receipt_detail_05.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_health dt {
    background: url("../images/receipt_detail_06.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_fashion dt {
    background: url("../images/receipt_detail_07.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_car dt {
    background: url("../images/receipt_detail_08.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_plant dt {
    background: url("../images/receipt_detail_09.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_ocr dt {
    background: url("../images/receipt_detail_92.png") 25px center no-repeat;
    background-size: auto 24px; }
  .monthly_section .category_for_selfmedication a {
    color: #525252;
    text-decoration: none; }
  .monthly_section .category_off dt {
    background: url("../images/receipt_detail_90.png") 25px center no-repeat;
    background-size: auto 24px; }
    .monthly_section .category_off dt .question_enclosed {
      width: 16px;
      height: 16px;
      margin-left: 5px;
      cursor: pointer; }

.store_none_illust img {
  width: 27%; }

.warranty {
  margin: 15px 10px; }

.modal {
  height: 100%; }
  .modal .bc_position {
    margin: 0 auto;
    text-align: center; }
  .modal .myid .code_inner {
    padding: 15px 0;
    overflow: hidden; }
  .modal .get_coupon .code_inner {
    display: table;
    position: relative;
    width: 100%;
    padding: 15px;
    box-sizing: border-box; }
    .modal .get_coupon .code_inner.and_barcode {
      padding-bottom: 0px; }
    .modal .get_coupon .code_inner:nth-child(n+3) {
      border-top: 1px solid #e6e6e6; }
    .modal .get_coupon .code_inner .mask {
      position: absolute;
      width: 100%;
      height: 100%;
      padding: 35px 15px;
      text-align: center;
      background-color: rgba(255, 255, 255, 0.9);
      top: 0;
      left: 0;
      box-sizing: border-box;
      border-radius: 8px; }
  .modal .get_coupon .coupons_img, .modal .get_coupon .code_text {
    display: table-cell;
    vertical-align: top; }
  .modal .get_coupon .coupons_img {
    width: 33%; }
  .modal .get_coupon .code_text {
    padding-left: 15px;
    width: 1000px; }
    .modal .get_coupon .code_text .code_text_header {
      overflow: hidden; }
    .modal .get_coupon .code_text .goods_name {
      float: left;
      width: 75%;
      font-weight: bold;
      padding-right: 15px;
      box-sizing: border-box; }
    .modal .get_coupon .code_text .scope {
      float: right;
      width: 25%;
      color: #e83434;
      font-weight: bold;
      text-align: right; }
    .modal .get_coupon .code_text .coupon_text_header .coupon_name {
      font-size: 2.0em;
      font-weight: bold;
      line-height: 1.2; }
    .modal .get_coupon .code_text .coupon_text_header .discount {
      color: #e83434;
      font-size: 1.8rem;
      font-weight: bold; }
    .modal .get_coupon .code_text .coupon_text_header .time_up {
      color: #555;
      font-size: 1rem;
      margin-bottom: 10px; }
    .modal .get_coupon .code_text .coupon_text_header .receipt_coupon {
      border-bottom: dashed 1px #a3a3a3;
      font-size: 1.4rem;
      font-weight: bold;
      line-height: 2.3;
      margin: 0 0 5px; }
  .modal .get_coupon .coupon_head.disabled {
    opacity: 0.3; }
  .modal .get_coupon .coupon_shop {
    background: #f4f4f4;
    color: #e83434;
    font-weight: bold;
    padding: 3px 15px; }
  .modal .get_coupon .receipt_coupon_show {
    background: url("../images/icon_arrow.png") right center no-repeat;
    background-size: 12px;
    border-top: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
    font-weight: bold;
    font-size: 1.4rem;
    padding: 10px;
    text-align: center; }
    .modal .get_coupon .receipt_coupon_show.disabled {
      opacity: 0.3; }
  .modal .get_coupon .receipt_coupon_barcode {
    padding-bottom: 15px; }
    .modal .get_coupon .receipt_coupon_barcode.disabled {
      opacity: 0.3; }
  .modal .get_coupon .recipt_coupon_recipt_thumbnail_box.disabled {
    opacity: 0.3; }
  .modal .get_coupon .recipt_coupon_recipt_thumbnail_box .icon_glasses {
    height: 40px;
    margin: 5px;
    position: absolute;
    width: auto;
    z-index: 100; }
  .modal.modal_monthly_totals {
    padding: 0 0 20px;
    overflow-y: scroll; }
    .modal.modal_monthly_totals .header_monthly .modal_name {
      padding: 15px 0;
      background: #ffd800;
      font-size: 1.5rem;
      font-weight: bold;
      text-align: center; }
    .modal.modal_monthly_totals .header_monthly .modal_toggle {
      top: 10px; }
      .modal.modal_monthly_totals .header_monthly .modal_toggle a {
        color: #000 !important; }
    .modal.modal_monthly_totals .reference_monthly ul {
      position: relative;
      padding: 8px 15px;
      text-align: center; }
      .modal.modal_monthly_totals .reference_monthly ul li {
        display: inline-block;
        font-size: 1.4rem;
        vertical-align: middle; }
        .modal.modal_monthly_totals .reference_monthly ul li:last-child a,
        .modal.modal_monthly_totals .reference_monthly ul li:first-child a {
          display: block;
          width: 10px;
          padding: 5px 10px;
          line-height: 1.2; }
      .modal.modal_monthly_totals .reference_monthly ul::before {
        position: absolute;
        width: 0;
        height: 0;
        content: '';
        bottom: 0;
        left: 50%;
        margin-left: -8px;
        border-style: solid;
        border-width: 0 8px 8px 8px;
        z-index: 0;
        border-color: transparent transparent #fff transparent; }

header {
  background: #ffd800; }
  header nav li a {
    display: block;
    height: 70px; }
  header nav li#gnav_barcode {
    background: url("../images/head_nav01.png") center center no-repeat;
    background-size: contain; }
    header nav li#gnav_barcode.active {
      background: #ffe100 url("../images/head_nav01.png") center center no-repeat;
      background-size: contain; }
    header nav li#gnav_barcode:hover {
      background: #ffe100 url("../images/head_nav01.png") center center no-repeat;
      background-size: contain; }
  header nav li#gnav_receipt {
    background: url("../images/head_nav02.png") center center no-repeat;
    background-size: contain; }
    header nav li#gnav_receipt.active {
      background: #ffe100 url("../images/head_nav02.png") center center no-repeat;
      background-size: contain; }
    header nav li#gnav_receipt:hover {
      background: #ffe100 url("../images/head_nav02.png") center center no-repeat;
      background-size: contain; }
  header nav li#gnav_promotion {
    background: url("../images/head_nav03.png") center center no-repeat;
    background-size: contain; }
    header nav li#gnav_promotion.active {
      background: #ffe100 url("../images/head_nav03.png") center center no-repeat;
      background-size: contain; }
    header nav li#gnav_promotion:hover {
      background: #ffe100 url("../images/head_nav03.png") center center no-repeat;
      background-size: contain; }
    header nav li#gnav_promotion.new {
      background: url("../images/head_nav03.png") center center no-repeat, url("../images/new_receipt_badge.png") 90% 10% no-repeat;
      background-size: contain, 25%; }
  header nav li#gnav_other {
    background: url("../images/head_nav04.png") center center no-repeat;
    background-size: contain; }
    header nav li#gnav_other.active {
      background: #ffe100 url("../images/head_nav04.png") center center no-repeat;
      background-size: contain; }
    header nav li#gnav_other:hover {
      background: #ffe100 url("../images/head_nav04.png") center center no-repeat;
      background-size: contain; }
  header nav li#gnav_store {
    background: url("../images/head_nav05.png") center center no-repeat;
    background-size: contain; }
    header nav li#gnav_store.active {
      background: #ffe100 url("../images/head_nav05.png") center center no-repeat;
      background-size: contain; }
    header nav li#gnav_store:hover {
      background: #ffe100 url("../images/head_nav05.png") center center no-repeat;
      background-size: contain; }

@media screen and (max-width: 320px) {
  /*　画面サイズが320pxまではここを読み込む　*/
  .modal_self_medication .med_header .modal_name {
    font-size: 1.4rem; }
  .modal_self_medication .med_header .modal_toggle a {
    font-size: 2.4rem;
    line-height: 3.8rem; } }

/**
 stype_sp.scssから移行
 */
@media screen and (max-width: 748px) {
  /*　画面サイズが748pxまではここを読み込む　*/
  header #head_inner {
    margin: 0 auto;
    width: 100%; }
  header #logo_area {
    margin: 0 auto;
    padding: 0 0 10px;
    width: 240px; }
    header #logo_area #logo {
      margin: 0 auto;
      padding-top: 10px;
      width: 145px; }
  header #logo_only {
    margin: 0 auto;
    padding: 10px;
    width: 145px; }
  header nav {
    background: #ffef79;
    border-left: solid 1px #fff;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%; }
    header nav.fixed {
      position: fixed;
      z-index: 4; }
    header nav li {
      border-right: solid 1px #fff;
      -moz-box-sizing: border-box;
      -ms-box-sizing: border-box;
      -o-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      float: left;
      height: 70px;
      text-indent: -9999px;
      width: 25% !important; }
  #pankuz #pankuz_inner {
    border-bottom: solid 1px #c1aa00;
    padding: 10px; }
  #pagetop {
    bottom: 10px;
    position: fixed;
    right: 10px;
    z-index: 1000; }
  #content_wrap.error_top {
    margin-top: 70px; }
  #content_wrap.fixed {
    margin-top: 70px; }
  #content {
    margin: 0 auto;
    max-width: 100%; }
  .img_illust01 {
    margin: 0 auto 40px;
    text-align: center; }
  .img_illust02 {
    margin: 0 auto 60px;
    text-align: center; }
  .submitBtnBlack_active, .submitBtnBlack_disabled, .submitBtnYellow_active, .submitBtnYellow_disabled {
    padding: 18px 0 17px; }
  .backBtn {
    padding: 15px 0 14px; } }

/**
 stype_pc.scssから移行
 */
@media screen and (min-width: 749px) {
  /*　画面サイズが749pxからはここを読み込む　*/
  #other_section {
    padding: 15px 0; }
  header {
    position: fixed;
    top: 0 !important;
    width: 100%;
    z-index: 4; }
    header #head_inner {
      margin: 0 auto;
      max-width: 1200px;
      min-width: 800px; }
    header #logo_area {
      float: left; }
      header #logo_area #logo {
        float: left;
        margin-top: 10px;
        padding-left: 10px;
        width: 210px; }
    header #logo_only {
      margin: 0 auto;
      padding: 10px;
      width: 210px; }
    header nav {
      background: #ffef79;
      border-left: solid 1px #fff;
      float: right; }
      header nav li {
        background: #ffef79;
        border-right: solid 1px #fff;
        float: left;
        height: 70px;
        text-indent: -9999px;
        width: 110px; }
        header nav li.active {
          background-color: #ffe100; }
    header.nofixed {
      position: relative; }
  #pankuz {
    background: #ffe100;
    border-bottom: solid 1px #c1aa00; }
    #pankuz #pankuz_inner {
      margin: 0 auto;
      max-width: 1190px;
      padding: 10px 0 10px 10px; }
  #content_wrap {
    margin-top: 70px; }
    #content_wrap.gnav_none, #content_wrap.top {
      margin-top: 0; }
  #content {
    margin: 0 auto;
    width: 748px; }
  #section08 {
    padding: 0 0 20px; }
  .img_illust01,
  .img_illust02 {
    margin: 0 auto 100px;
    text-align: center; }
  .receiptlist .receipt_apply {
    background: url("../images/receipt_label01.png") right top no-repeat;
    background-size: 80px auto; }
  .receiptlist .receipt_applied {
    background: url("../images/receipt_label02.png") right top no-repeat;
    background-size: 80px auto; }
  .receiptlist .training {
    background: url("../images/receipt_list_training.png") left top no-repeat;
    background-size: 80px auto; }
  .receiptlist .training_receipt_apply {
    background: url("../images/receipt_list_training.png") left top no-repeat, url("../images/receipt_label01.png") right top no-repeat;
    background-size: 80px auto; }
  .receiptlist .training_receipt_applied {
    background: url("../images/receipt_list_training.png") left top no-repeat, url("../images/receipt_label02.png") right top no-repeat;
    background-size: 80px auto; }
  .card_arrow .card_used_outer .card_used.big .msg {
    font-size: 2rem;
    line-height: 2.5rem;
    margin-top: 200%; }
  .card_arrow .card_used_outer .card_used.big .date {
    font-size: 1.6rem; }
  .card_arrow .card_used_outer .card_used.small .msg {
    font-size: 1.4rem; }
  .card_arrow .card_used_outer .card_used.small .date {
    font-size: 1.4rem; }
  .card_arrow .card_used_outer .card_used.medium .msg {
    font-size: 1.3rem; }
  .card_arrow .card_used_outer .card_used.medium .date {
    display: block;
    font-size: 1rem;
    line-height: 1.3rem; }
  .for_detail div {
    margin: 0 15px; } }

/* @see github issue #461 */
.recipt_coupon_screen {
  background-color: #fff;
  margin-bottom: 15px;
  max-width: 718px;
  padding: 15px 0 5px 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box; }
  .recipt_coupon_screen .recipt_coupon_screen_inner {
    overflow-y: scroll; }
  .recipt_coupon_screen.recipt_coupon_screen_modal {
    background: none;
    margin-top: 150px;
    padding: 0; }

@media screen and (min-width: 748px) {
  .recipt_coupon_screen {
    margin-left: 15px; } }

@media screen and (max-width: 747px) {
  .recipt_coupon_screen_inner::-webkit-scrollbar {
    display: none; } }

.store_detail_wrap {
  background-color: #ffe100;
  width: 100%;
  height: 100%;
  z-index: 100; }

.modal_store_detail .store_header {
  width: 100%;
  top: 0; }
  .modal_store_detail .store_header .modal_name {
    padding: 15px 0;
    background: #ffd800;
    font-size: 1.5rem;
    font-weight: bold;
    text-align: center; }
  .modal_store_detail .store_header .modal_toggle {
    position: absolute;
    right: 15px;
    top: 5px; }
    .modal_store_detail .store_header .modal_toggle a {
      display: block;
      font-size: 3.4rem;
      line-height: 3.4rem;
      text-decoration: none; }
  .modal_store_detail .store_header .toggle_delete {
    color: #000; }

.register_member_cooperation_container {
  background-color: #ffd800; }

.register_member_inner_top {
  background-color: #ffe100; }

.content_register_or_login .logo_area {
  width: 145px;
  margin: 0 auto;
  padding: 25px 0 30px; }

.content_register_or_login .main_img_area {
  position: relative;
  width: 100px;
  margin: 0 auto;
  padding-bottom: 30px; }
  .content_register_or_login .main_img_area img {
    height: 180px;
    width: 100px; }
  .content_register_or_login .main_img_area .recio_img {
    position: absolute;
    height: 90px !important;
    width: 60px !important;
    top: 48%;
    left: 60%; }

.content_register_or_login .inner_bottom {
  background: #fff;
  border-radius: 5px;
  margin: 15px; }
  .content_register_or_login .inner_bottom .description {
    padding: 15px; }
    .content_register_or_login .inner_bottom .description .caution {
      color: #a3a3a3; }

.smart_receipt_logo {
  margin: 0 auto 10px;
  padding: 10px;
  width: 145px; }

.form_dl.smart_receipt_id {
  background: #ccc;
  border-radius: 5px 5px 0 0; }

.terms_modal_wrap {
  background-color: #ffe100; }

.terms_modal {
  padding: 0; }

.terms_modal_header {
  background-color: #ffe100;
  position: fixed;
  z-index: 1;
  width: 100%;
  height: 50px;
  display: flex; }

.terms_modal_title {
  width: 100%;
  padding: 15px 0;
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center; }

.terms_modal_close {
  position: absolute;
  right: 15px;
  top: 0px; }
  .terms_modal_close a {
    font-weight: bold;
    font-size: 3.4rem;
    line-heitht: 3.4rem;
    text-decoration: none; }

.cooperation_terms_box {
  margin: 50px 17px 18px; }

.input_textbox_background_color {
  background-color: #ccc; }

#start_howto_close {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  border: solid #000 2px;
  background-color: #000;
  color: #fff; }

.modal .start_howto {
  background: #ffe100;
  padding: 10px;
  text-align: center;
  max-width: 714px;
  margin: 0 auto; }
  .modal .start_howto .welcome_title {
    margin: 25px auto 10px auto;
    width: 90%; }
    .modal .start_howto .welcome_title p {
      font-size: 1.8rem;
      font-weight: bold; }
  .modal .start_howto .welcome_title_with_card {
    margin: 45px auto 10px auto;
    width: 90%; }
    .modal .start_howto .welcome_title_with_card p {
      font-size: 1.8rem;
      font-weight: bold; }
  .modal .start_howto .img_howto {
    margin: 20px 22%; }
    .modal .start_howto .img_howto img {
      max-width: 280px; }
  .modal .start_howto .img_howto_with_card {
    margin: 20px 10px; }
    .modal .start_howto .img_howto_with_card img {
      max-width: 500px; }
  .modal .start_howto .howToDescription {
    font-size: 10pt;
    width: 95%;
    margin: 0 auto 10px;
    max-width: 500px;
    text-align: left; }
  .modal .start_howto .howToCaution {
    font-size: 9pt;
    width: 95%;
    margin: 0 auto;
    max-width: 500px;
    text-align: left; }
  .modal .start_howto .howToText {
    font-size: 10pt;
    width: 95%;
    margin: 0 auto;
    max-width: 580px;
    text-align: left; }

#start_howto_close_wrap {
  margin: 35px 10px 10px; }

.login {
  padding: 15px 15px 0; }

.forgot {
  width: 100%;
  padding: 20px 15px;
  text-align: center;
  margin-left: -15px;
  border-top: dashed 1px #998a19; }
  .forgot a {
    text-decoration: none; }

.main_content {
  margin: 0 auto;
  max-width: 748px; }

.lp_main_img {
  margin: 0 5% 40px; }

.lp_detail {
  padding: 20px 25px;
  border: solid 3px #efbf00;
  background: #ffe242;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px; }

.floating_background {
  background: #ffe100;
  border-top: solid 1px #efbf00; }

.floating_button {
  padding: 15px 15px 0; }

.solid_border {
  border-top: solid 1px #efbf00; }

.head_border {
  display: flex;
  align-items: center; }
  .head_border:before, .head_border:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #f4ce03; }
  .head_border:before {
    margin-right: 1rem; }
  .head_border:after {
    margin-left: 1rem; }

.form_dl.cooperation {
  display: table; }
  .form_dl.cooperation dt, .form_dl.cooperation dd {
    display: table-cell;
    word-break: break-all;
    vertical-align: middle; }

.ocr_non_display_receipt {
  padding: 30px 15px 30px; }

.ocr_receipt_txt {
  background: #ffe100;
  font-size: 1.4rem;
  line-height: 2;
  padding: 10px 15px;
  margin: 0;
  text-align: center;
  word-break: break-all; }

.login_title {
  margin-top: 15px;
  margin-bottom: 25px;
  color: #2C333D;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  /* 166.667% */ }

.login_text {
  margin-top: 15px;
  margin-bottom: 5px;
  color: #2C333D;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  /* 166.667% */ }

.login_content {
  margin-left: 5px;
  margin-right: 5px; }

.login_button_text {
  margin-top: 40px;
  color: #FFF;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25) !important;
  border-radius: 6px !important;
  line-height: 41px;
  /* 205% */ }

.login_forget {
  text-align: center;
  color: #2C333D;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  text-decoration: none; }

.opt_mail_title {
  text-align: left;
  color: #2C333D;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  /* 166.667% */
  margin: 10p 5px 0px 5px; }

.opt_mail_check_box_title {
  font-weight: normal;
  background-color: #EEE;
  padding: 10px 15px;
  font-size: 18px; }

.out_mail_checkbox_content {
  border: 2px solid #e7e7e7;
  margin-top: 30px;
  margin-bottom: 16px; }

.opt_mail_checkbox_text_content {
  margin: 15px 15px 15px 55px; }

.opt_mail_checkbox_text_bold {
  font-weight: bold;
  font-size: 14px; }

.opt_mail_checkbox_text {
  font-size: 14px; }

.opt_mail_red_square {
  border: 1px solid #a22222;
  background-color: #FFE1E1;
  padding: 8px 16px;
  margin-bottom: 19px; }

.opt_mail_annotation_text {
  margin: 15px 15px 10px 15px; }

.opt_mail_black_button_text {
  color: #FFF;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25) !important;
  border-radius: 6px !important;
  line-height: 41px;
  /* 205% */ }

.opt_mail_checkbox_hidden {
  display: none; }

.opt_mail_custom_checkbox {
  margin: 30px 18px;
  width: 25px;
  height: 25px;
  background: url("../images/form_checkbox03_off.png") no-repeat;
  cursor: pointer; }

.opt_mail_custom_checkbox:checked {
  margin: 30px 18px;
  width: 25px;
  height: 25px;
  background: url("../images/form_checkbox03_on.png") no-repeat;
  cursor: pointer; }

.register_account_authentication {
  margin: auto auto 15px;
  background: #fff;
  border: solid 0;
  border-radius: 5px;
  font-size: 16px;
  padding: 20px 15px;
  text-align: left;
  width: 100%;
  position: relative;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box; }

input.register_account_authentication::placeholder {
  font-size: 14px; }

input.register_account_authentication::-moz-placeholder {
  font-size: 14px; }

input.register_account_authentication::-ms-input-placeholder {
  font-size: 14px; }

.display_input_mobilePhone .read_txt {
  margin-top: 60px;
  margin-bottom: 38px; }

.display_input_mailAddress .read_txt {
  margin-top: 60px;
  margin-bottom: 38px; }

.register_member_sex label.radios {
  padding: 15px 0 10px 45px; }

.register_member_sex dt {
  vertical-align: top; }

.register_member_sex_docomo {
  display: flex; }
  .register_member_sex_docomo input {
    display: none; }
  .register_member_sex_docomo label {
    background: #fff;
    border: solid 1px #FFFFFF;
    color: #555;
    display: inline-block;
    padding: 8px 0px 8px 0px;
    text-align: center;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    margin-right: 8px;
    border-radius: 5px;
    flex: 1; }
    .register_member_sex_docomo label.active {
      background: #000;
      border: solid 1px #000;
      color: #fff; }

select.select_birth_year_docomo {
  -moz-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
  -ms-appearance: none;
  appearance: none;
  width: 47%;
  padding: 15px 0;
  border-radius: 5px;
  margin-right: 8px;
  font-size: 13px;
  padding-left: 10px;
  background-color: white; }

select.select_birth_error_docomo {
  -moz-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
  -ms-appearance: none;
  appearance: none;
  width: 47%;
  padding: 15px 0;
  border-radius: 5px;
  margin-right: 8px;
  font-size: 13px;
  padding-left: 10px;
  background-color: #FDF1F1;
  border: 1px solid #B41F1F; }

select.select_birth_month_docomo {
  -moz-appearance: none;
  -webkit-appearance: none;
  -o-appearance: none;
  -ms-appearance: none;
  appearance: none;
  width: 47%;
  padding: 15px 0;
  border-radius: 5px;
  font-size: 13px;
  padding-left: 10px;
  background-color: white; }

.input_zip_code_docomo {
  width: 45%;
  padding: 15px 0;
  border-radius: 5px;
  padding-left: 10px; }

.input_full_register_member_docomo {
  padding: 15px 15px;
  width: 90%;
  border-radius: 5px; }

.input_full_register_member_docomo::placeholder {
  font-size: 13px;
  text-align: left;
  padding: 15px 0; }

.membere_checkboxes,
.membere_checkboxes_docomo {
  background: url("../images/disagree.png") left center no-repeat;
  background-size: 16px 16px;
  display: block;
  padding: 2px 0px 1px 26px; }
  .membere_checkboxes input,
  .membere_checkboxes_docomo input {
    display: none; }
  .membere_checkboxes.active,
  .membere_checkboxes_docomo.active {
    background: url("../images/form_checkbox04_on.png") left center no-repeat;
    background-size: 16px 16px; }

.login_member_top_docomo {
  height: 90px;
  background: url("../images/login_img05.png") right center no-repeat;
  background-size: contain; }
  .login_member_top_docomo .detail {
    color: #555; }

.register_member_top_docomo p {
  font-size: 1.7rem; }

.register_member_btm_docomo a {
  font-size: 1.7rem; }

.optional_txt_docomo {
  color: #333;
  display: flex;
  align-items: center; }
  .optional_txt_docomo::before, .optional_txt_docomo::after {
    content: "";
    flex-grow: 1;
    border-top: 1px dashed;
    display: block; }

.member_tutorial .image {
  display: block;
  width: 100%;
  height: 320px;
  margin: auto;
  object-fit: contain;
  background-color: #ffe100;
  padding: 30px 0; }

.member_tutorial .slide_box .title {
  font-size: 1.7rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 65px; }

.member_tutorial .slide_box .txt {
  font-size: 14px;
  text-align: center; }

.tutorial_padding {
  padding: 0 15px; }

.first_slide_img {
  padding: 60px 0 0 0 !important; }

.member_tutorial_first_page {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 100;
  background-color: #ffe100;
  place-content: center;
  top: 50%;
  left: 50%;
  padding-top: 70px;
  transform: translate(-50%, -50%); }
  .member_tutorial_first_page .first_text {
    font-size: 17px;
    font-weight: bold;
    margin: 0 auto;
    margin-top: 20px; }
  .member_tutorial_first_page .first_page_img {
    width: 70px;
    margin: 0 auto;
    height: 120px; }

.barcode_modal {
  position: fixed;
  z-index: 100;
  background: #fff;
  padding: 5px;
  transform-origin: top left; }
  .barcode_modal .modal_toggle {
    display: inline-block; }
    .barcode_modal .modal_toggle a {
      color: #333;
      font-size: 3.4rem;
      line-height: 3.4rem;
      text-decoration: none; }
  .barcode_modal .barcode_screen_inner {
    padding: 5px 15px; }
  .barcode_modal .barcode_value {
    text-align: center;
    font-size: 2.0rem;
    padding-top: 10px; }
