@charset "UTF-8";
/*----------------------------------------------------
	setting
----------------------------------------------------*/
/*----------------------------------------------------
	ウェブフロント
----------------------------------------------------*/
.container {
  margin: 0 auto;
}

body.page-webfront,
body.page-login {
  /* //.pane-header */
  /* //.pane-contents */
}
body.page-webfront .wrapper,
body.page-login .wrapper {
  background: #F4F5F2;
}
body.page-webfront .pane-topic-path,
body.page-login .pane-topic-path {
  background-color: transparent;
}
body.page-webfront .pane-topic-path .block-topic-path--list a,
body.page-login .pane-topic-path .block-topic-path--list a {
  text-decoration: none;
}
body.page-webfront .block-top-title,
body.page-login .block-top-title {
  text-align: left;
}
body.page-webfront .btn-link,
body.page-login .btn-link {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background: #FFF;
  border-radius: 4px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  width: 280px;
  min-height: 48px;
  text-decoration: none;
}
body.page-webfront .-arrow-right,
body.page-login .-arrow-right {
  position: relative;
  text-decoration: none;
}
body.page-webfront .-arrow-right::before,
body.page-login .-arrow-right::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background: #78BD2F;
  border-radius: 100%;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.21s ease-in-out 0s;
  opacity: 1;
}
body.page-webfront .-arrow-right::after,
body.page-login .-arrow-right::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  position: absolute;
  right: 27px;
  top: 50%;
  transform: translateY(-50%);
  transform: rotate(45deg) translateY(-50%);
  transform-origin: 60% 30%;
  transition: all 0.2s linear 0.01s;
}
body.page-webfront .-arrow-right:hover::before,
body.page-login .-arrow-right:hover::before {
  right: 18px;
  width: 20px;
  height: 20px;
  opacity: 0.8;
}
body.page-webfront .-icon-excla,
body.page-login .-icon-excla {
  position: relative;
  text-decoration: none;
  padding-right: 45px;
}
body.page-webfront .-icon-excla::before,
body.page-login .-icon-excla::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background: #DA002B;
  border-radius: 100%;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.21s ease-in-out 0s;
  opacity: 1;
}
body.page-webfront .-icon-excla::after,
body.page-login .-icon-excla::after {
  content: "!";
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 16px;
  height: 16px;
  color:#FFF;
  font-size:12px;
  font-weight:bold;
  line-height:1;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.2s linear 0.01s;
}
body.page-webfront .-icon-excla:hover::before,
body.page-login .-icon-excla:hover::before {
  right: 18px;
  width: 20px;
  height: 20px;
  opacity: 0.8;
}
body.page-webfront .txt-link,
body.page-login .txt-link {
}
body.page-webfront .txt-link.-guide,
body.page-login .txt-link.-guide {
}
body.page-webfront .txt-link.-guide::before,
body.page-login .txt-link.-guide::before {
  content:'';
  display:inline-block;
  width:16px;
  height:16px;
  background: url(../../img/customer/icon_q.svg) no-repeat 50% 50%;
  background-size:contain;
  margin-right:8px;
  transform: translateY(2px);
}

body.page-webfront .block-back,
body.page-login .block-back {
  //margin: 30px auto 0;
  text-align: center;
}
body.page-webfront .pane-header,
body.page-login .pane-header {
  background: #FFF;
}
body.page-webfront .pane-header > .container,
body.page-login .pane-header > .container {
  display: flex;
  justify-content: space-between;
  height: 80px;
  padding: 0;
}
body.page-webfront .pane-header > .container .block-header-logo,
body.page-login .pane-header > .container .block-header-logo {
  width: auto;
  margin: 0;
}
body.page-webfront .pane-header > .container .block-header-logo--link span,
body.page-login .pane-header > .container .block-header-logo--link span {
  display: inline-block;
}
body.page-webfront .pane-header > .container .block-header-logo--link span + span,
body.page-login .pane-header > .container .block-header-logo--link span + span {
  margin-left: 20px;
}
body.page-webfront .pane-header > .container .block-header-sublogo h1,
body.page-login .pane-header > .container .block-header-sublogo h1 {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  margin: 0;
}
body.page-webfront .pane-header .block-header-info-frame,
body.page-login .pane-header .block-header-info-frame {
  padding: 0;
  background: #FFF;
  border-top: 1px solid #DDD;
}
body.page-webfront .pane-header .block-header-info-frame > .container .block-header-info,
body.page-login .pane-header .block-header-info-frame > .container .block-header-info {
  text-align: center;
  min-height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
body.page-webfront .pane-header .block-header-info-frame > .container .block-header-info a,
body.page-login .pane-header .block-header-info-frame > .container .block-header-info a {
  display: inline-block;
  padding-right: 20px;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: normal;
  color: #DA002B;
  position: relative;
}
body.page-webfront .pane-header .block-header-info-frame > .container .block-header-info a::before,
body.page-login .pane-header .block-header-info-frame > .container .block-header-info a::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  border-radius: 100%;
  background: #DA002B;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}
body.page-webfront .pane-header .block-header-info-frame > .container .block-header-info a::after,
body.page-login .pane-header .block-header-info-frame > .container .block-header-info a::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  transform: rotate(45deg);
  position: absolute;
  right: 8px;
  top: calc(50% - 1px);
  transform: rotate(45deg) translateY(-50%);
}
body.page-webfront .pane-contents > .container,
body.page-login .pane-contents > .container {
  margin-top: 40px;
}
body.page-webfront .block-mypage .block-top-title,
body.page-login .block-mypage .block-top-title {
  margin: 0;
  padding: 40px 0 0;
}
body.page-webfront .block-mypage--customer-alert,
body.page-login .block-mypage--customer-alert {
  background: #EFF8DA;
  border: 2px solid #78BD2F;
  border-radius: 4px;
  margin: 40px 0 20px;
}
body.page-webfront .block-mypage--customer-alert .block-mypage--alert a,
body.page-login .block-mypage--customer-alert .block-mypage--alert a {
  display: block;
  padding: 9px 12px;
  cursor:pointer;
}
body.page-webfront .block-mypage--customer-warning,
body.page-login .block-mypage--customer-warning {
  background: #f8dbda;
  border: 2px solid #DA002B;
  border-radius: 4px;
  margin: 10px 0 0;
}
body.page-webfront .block-mypage--customer-warning .block-mypage--warning div,
body.page-login .block-mypage--customer-warning .block-mypage--warning div {
  display: block;
  padding: 9px 12px;
}
body.page-webfront .block-mypage--customer-alert + .block-mypage--customer-alert,
body.page-login .block-mypage--customer-alert + .block-mypage--customer-warning,
body.page-webfront .block-mypage--customer-alert + .block-mypage--customer-alert,
body.page-login .block-mypage--customer-alert + .block-mypage--customer-warning,
body.page-webfront .block-mypage--customer-warning + .block-mypage--customer-warning,
body.page-login .block-mypage--customer-warning + .block-mypage--customer-warning,
body.page-webfront .block-mypage--customer-warning + .block-mypage--customer-alert,
body.page-login .block-mypage--customer-warning + .block-mypage--customer-warning {
  margin-top:20px;
}

body.page-webfront .block-mypage--customer-status,
body.page-login .block-mypage--customer-status {
  background: #FFF;
  border-radius: 4px;
  color: #333;
  padding: 20px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
}
body.page-webfront .block-mypage--sign,
body.page-login .block-mypage--sign {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 365px;
  min-height: 52px;
  border-right: 1px solid #CCC;
  padding: 0 15px 0 10px;
}
body.page-webfront .block-mypage--customer-name,
body.page-login .block-mypage--customer-name {
  line-height: 1.3;
}
body.page-webfront .block-mypage--customer-name strong,
body.page-login .block-mypage--customer-name strong {
  font-weight: bold;
  font-size: 28px;
  font-size: 1.75rem;
}
body.page-webfront .block-mypage--customer-name small,
body.page-login .block-mypage--customer-name small {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 28px;
  padding-left: 8px;
}
body.page-webfront .block-mypage--data,
body.page-login .block-mypage--data {
  padding: 0 20px;
  font-size: 16px;
  font-size: 1rem;
  text-align: left;
}
body.page-webfront .block-mypage--data .block-mypage--customer-id {
  white-space:nowrap;
}
body.page-webfront .block-mypage--data .block-mypage--customer-fav {
  white-space:nowrap;
}

body.page-webfront .block-mypage--customer-favshop,
body.page-login .block-mypage--customer-favshop {
  background: #FFF;
  border-radius: 4px;
}
body.page-webfront .block-mypage--button,
body.page-login .block-mypage--button {
  display: flex;
}
body.page-webfront .block-mypage--customer-card a, body.page-webfront .block-mypage--customer-edit a,
body.page-login .block-mypage--customer-card a,
body.page-login .block-mypage--customer-edit a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52px;
  border: 1px solid #005E3C;
  border-radius: 4px;
  color: #005E3C;
}
body.page-webfront .block-mypage--customer-card a,
body.page-login .block-mypage--customer-card a {
  font-weight: bold;
  font-size: 16px;
  font-size: 1rem;
  text-decoration: none;
  width: 240px;
  padding-left: 40px;
  position: relative;
}
body.page-webfront .block-mypage--customer-card a::before,
body.page-login .block-mypage--customer-card a::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 20px;
  position: absolute;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  background: url(../../img/customer/icon_digital.svg) no-repeat 50% 50%;
  background-size: contain;
}
body.page-webfront .block-mypage--customer-edit,
body.page-login .block-mypage--customer-edit {
  margin-left: 20px;
  display:none;
}
body.page-webfront .block-mypage--customer-edit a,
body.page-login .block-mypage--customer-edit a {
  font-size: 10px;
  font-size: 0.625rem;
  text-decoration: none;
  width: 52px;
  padding-top: 25px;
  position: relative;
}
body.page-webfront .block-mypage--customer-edit a::before,
body.page-login .block-mypage--customer-edit a::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  position: absolute;
  left: 50%;
  top: 5px;
  transform: translateX(-50%);
  background: url(../../img/customer/icon_edit.svg) no-repeat 50% 50%;
  background-size: contain;
}
body.page-webfront .block-mypage--customer-stats,
body.page-login .block-mypage--customer-stats {
  display: flex;
  justify-content: space-between;
}
body.page-webfront .block-mypage--customer-stats + .block-mypage--customer-stats,
body.page-login .block-mypage--customer-stats + .block-mypage--customer-stats {
  margin-top:10px;
}
body.page-webfront .block-mypage--point, body.page-webfront .block-mypage--rank,
body.page-login .block-mypage--point,
body.page-login .block-mypage--rank {
  width: calc((100% - 20px) / 2);
  background: #FFF;
  border-radius: 4px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  display: flex;
}
body.page-webfront .block-mypage--point a, body.page-webfront .block-mypage--rank a,
body.page-login .block-mypage--point a, body.page-login .block-mypage--rank a {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 20px 50px 20px 20px;
}
body.page-webfront .block-mypage--rank a, body.page-login .block-mypage--rank a {
  padding-right:20px;
}
body.page-webfront .block-mypage--point a:hover, body.page-webfront .block-mypage--rank a:hover,
body.page-login .block-mypage--point a:hover,
body.page-login .block-mypage--rank a:hover {
  text-decoration: none;
}
body.page-webfront .block-mypage--pointlink,
body.page-webfront .block-mypage--ranklink {
  width: calc((100% - 20px) / 2);
}
body.page-webfront .block-mypage--point table,
body.page-login .block-mypage--point table {
  width: 100%;
}
body.page-webfront .block-mypage--point table th,
body.page-login .block-mypage--point table th {
  color: #666;
}
body.page-webfront .block-mypage--point table td,
body.page-login .block-mypage--point table td {
  color: #666;
  text-align: right;
}
body.page-webfront .block-mypage--point table .point-current th,
body.page-login .block-mypage--point table .point-current th {
  color: #333;
}
body.page-webfront .block-mypage--point table .point-current td,
body.page-login .block-mypage--point table .point-current td {
  color: #333;
}
body.page-webfront .block-mypage--point table .point-current td strong,
body.page-login .block-mypage--point table .point-current td strong {
  font-size: 24px;
  font-size: 1.5rem;
  font-weight: bold;
  padding-right: 3px;
}
body.page-webfront .block-mypage--point table .point-current td span,
body.page-login .block-mypage--point table .point-current td span {
  padding-right: 3px;
}
body.page-webfront .block-mypage--point table .point-limited th,
body.page-login .block-mypage--point table .point-limited th {
  padding-bottom: 10px;
}
body.page-webfront .block-mypage--point table .point-limited td,
body.page-login .block-mypage--point table .point-limited td {
  padding-bottom: 10px;
}
body.page-webfront .block-mypage--point table .point-expire th,
body.page-login .block-mypage--point table .point-expire th {
  border-top: 1px solid #DDD;
  padding-top: 10px;
}
body.page-webfront .block-mypage--point table .point-expire td,
body.page-login .block-mypage--point table .point-expire td {
  border-top: 1px solid #DDD;
  padding-top: 10px;
}
body.page-webfront .block-mypage--point table .point-expire.expire-month th,
body.page-login .block-mypage--point table .point-expire.expire-month th {
  color:#DA002B;
}
body.page-webfront .block-mypage--point table .point-expire.expire-month td,
body.page-login .block-mypage--point table .point-expire.expire-month td {
  color:#DA002B;
}
body.page-webfront .block-mypage--rank table,
body.page-login .block-mypage--rank table {
  width: 100%;
}
body.page-webfront .block-mypage--rank table th,
body.page-login .block-mypage--rank table th {
  color: #666;
}
body.page-webfront .block-mypage--rank table td,
body.page-login .block-mypage--rank table td {
  text-align: right;
  font-weight: bold;
}
body.page-webfront .block-mypage--rank table .rank-current th,
body.page-login .block-mypage--rank table .rank-current th {
  color: #333;
  padding-bottom: 10px;
}
body.page-webfront .block-mypage--rank table .rank-current td,
body.page-login .block-mypage--rank table .rank-current td {
  color: #333;
  padding-bottom: 10px;
  line-height: 28px;
}
body.page-webfront .block-mypage--rank table .rank-current td .rank-bnr,
body.page-login .block-mypage--rank table .rank-current td .rank-bnr {
  width:180px;
  height:40px;
  background-repeat:no-repeat;
  background-position:50% 50%;
  background-size:contain;
  display:inline-flex;
  align-items:center;
  padding:0 12px;
  text-align:left;
  font-size:16px;
  font-weight:bold;
  user-select: none;
}
.rank-bnr.bnr-regular {
  background-image:url(../../img/customer/bnr_rank_regular.png);
}
.rank-bnr.bnr-bronze {
  background-image:url(../../img/customer/bnr_rank_bronze.png);
}
.rank-bnr.bnr-silver {
  background-image:url(../../img/customer/bnr_rank_silver.png);
}
.rank-bnr.bnr-gold {
  background-image:url(../../img/customer/bnr_rank_gold.png);
}

body.page-webfront .block-mypage--rank table .rank-point th,
body.page-login .block-mypage--rank table .rank-point th {
  border-top: 1px solid #DDD;
  padding-top: 10px;
}
body.page-webfront .block-mypage--rank table .rank-point td,
body.page-login .block-mypage--rank table .rank-point td {
  border-top: 1px solid #DDD;
  padding-top: 10px;
}
body.page-webfront .block-mypage--rank .rank-note,
body.page-login .block-mypage--rank .rank-note {
  margin-top: 5px;
  font-size: 12px;
  font-size: 0.75rem;
  color: #666;
}
body.page-webfront .block-mypage--links,
body.page-login .block-mypage--links {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
body.page-webfront .block-mypage--links::before,
body.page-login .block-mypage--links::before {
  content: "";
  display: block;
  width: calc((100% - 40px) / 3);
  order: 1;
}
body.page-webfront .block-mypage--links::after,
body.page-login .block-mypage--links::after {
  content: "";
  display: block;
  width: calc((100% - 40px) / 3);
}
body.page-webfront .block-mypage--links-item,
body.page-login .block-mypage--links-item {
  width: calc((100% - 40px) / 3);
  margin-top: 15px;
}
body.page-webfront .block-mypage--links-item.-clm2,
body.page-login .block-mypage--links-item.-clm2 {
  width: calc((100% - 20px) / 2);
}
body.page-webfront .block-mypage--links-item--link,
body.page-login .block-mypage--links-item--link {
  display: flex;
  min-height: 72px;
  align-items: center;
  background: #FFF;
  border-radius: 4px;
  padding: 0 15px 0 72px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  position: relative;
}
body.page-webfront .block-mypage--links-item--link::before,
body.page-login .block-mypage--links-item--link::before {
  content: "";
  display: inline-block;
  width: 32px;
  height: 32px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}

body.page-webfront .block-mypage--links-item--other-link,
body.page-login .block-mypage--links-item--other-link {
  display: flex;
  min-height: 40px;
  align-items: center;
  background: #FFF;
  border-radius: 4px;
  padding: 0 15px 0 40px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  position: relative;
}

body.page-webfront .block-mypage--coupon--list,
body.page-login .block-mypage--coupon--list {
  display: flex;
  flex-wrap: wrap;
}
body.page-webfront .block-mypage--coupon--list-item,
body.page-login .block-mypage--coupon--list-item {
  width: calc((100% - 60px) / 4);
  margin-top: 15px;
}
body.page-webfront .block-mypage--coupon--list-item--link,
body.page-login .block-mypage--coupon--list-item--link {
  display: inline-block;
  border-radius: 4px;
  overflow: hidden;
  font-size: 0;
  vertical-align: bottom;
}
body.page-notusecoupon .block-mypage--coupon--list {
}
body.page-notusecoupon {
  line-height: 0;
}
body.page-notusecoupon .wrapper {
  min-width: initial;
}
body.page-notusecoupon .block-mypage--coupon--list-item {
  padding-right: 8px;
}
body.page-notusecoupon .block-mypage--coupon .bx-wrapper {
  border: 0;
  background-color: transparent;
  box-shadow: none;
  overflow-x: auto;
  margin-bottom: 0;
}
body.page-notusecoupon .block-mypage--coupon #scroll_coupon-list {
  width: auto;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  -ms-overflow-style: none; /* IE, Edge 対応 */
  scrollbar-width: none;    /* Firefox 対応 */
}
body.page-notusecoupon .block-mypage--coupon #scroll_coupon-list::-webkit-scrollbar {
  display: none; /* Chrome, Safari 対応 */
}
body.page-notusecoupon .block-mypage--coupon #scroll_coupon-list > li {
  display: inline-block;
}
body.page-notusecoupon .block-mypage--coupon #scroll_coupon-list > li--link {
  display: inline-block;
  border-radius: 4px;
  overflow: hidden;
  font-size: 0;
  vertical-align: bottom;
}
body.page-webfront .block-mypage--archive-link,
body.page-login .block-mypage--archive-link {
  margin-top: 15px;
  text-align: right;
}
body.page-webfront .icon-cart::before,
body.page-login .icon-cart::before {
  background-image: url(../../img/customer/icon_cart.svg);
}
body.page-webfront .icon-address::before,
body.page-login .icon-address::before {
  background-image: url(../../img/customer/icon_address.svg);
}
body.page-webfront .icon-ship::before,
body.page-login .icon-ship::before {
  background-image: url(../../img/customer/icon_ship.svg);
}
body.page-webfront .icon-card::before,
body.page-login .icon-card::before {
  background-image: url(../../img/customer/icon_card.svg);
}
body.page-webfront .icon-order::before,
body.page-login .icon-order::before {
  background-image: url(../../img/customer/icon_order.svg);
}
body.page-webfront .icon-fav::before,
body.page-login .icon-fav::before {
  background-image: url(../../img/customer/icon_fav.svg);
}
body.page-webfront .icon-q::before,
body.page-login .icon-q::before {
  background-image: url(../../img/customer/icon_q.svg);
}
body.page-webfront .icon-balance::before,
body.page-login .icon-balance::before {
  background-image: url(../../img/customer/icon_balance.svg);
}
body.page-webfront .icon-customer::before,
body.page-login .icon-customer::before {
  background-image: url(../../img/customer/icon_customer.svg);
}
body.page-webfront .icon-point::before,
body.page-login .icon-point::before {
  background-image: url(../../img/customer/icon_point.svg);
}
body.page-webfront .icon-password::before,
body.page-login .icon-password::before {
  background-image: url(../../img/customer/icon_pass.svg);
}
body.page-webfront .pane-footer,
body.page-login .pane-footer {
  margin-top: 60px;
}
body.page-webfront .pane-footer > .container,
body.page-login .pane-footer > .container {
  align-items: center;
}
body.page-webfront .pane-footer .block-footer--logo,
body.page-login .pane-footer .block-footer--logo {
  grid-column: 1;
  grid-row: 1;
}
body.page-webfront .pane-footer .block-copyright,
body.page-login .pane-footer .block-copyright {
  grid-column: 2;
  grid-row: 1;
  margin-top: 0;
  padding: 0;
  text-align: left;
}
body.page-webfront .pane-footer .block-footer-logout,
body.page-webfront .pane-footer .block-footer-login,
body.page-login .pane-footer .block-footer-logout {
  text-align: right;
}
body.page-webfront .pane-footer .block-footer-logout .btn,
body.page-webfront .pane-footer .block-footer-login .btn,
body.page-login .pane-footer .block-footer-logout .btn {
  font-size: 12px;
  font-size: 0.75rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #CCC;
  border-radius: 4px;
  width: 113px;
  height: 32px;
}
body.page-webfront .block-footer-logout {
  text-align: center;
  padding: 20px 0 0;
}
body.page-webfront .block-footer-logout .btn {
  font-size: 12px;
  font-size: 0.75rem;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #CCC;
  border-radius: 4px;
  width: 113px;
  height: 32px;
}
body.page-webfront .block-mypage--links-item--link,
body.page-login .block-mypage--links-item--link {
  border: 2px solid transparent;
  transition: all 0.2s linear 0s;
  text-decoration: none;
}
body.page-webfront .block-mypage--links-item--link:hover,
body.page-login .block-mypage--links-item--link:hover {
  border-color: #78bc30;
}
body.page-webfront .block-coupon .block-top-title,
body.page-login .block-coupon .block-top-title {
  margin: 40px 0 10px;
  padding: 0;
}
body.page-webfront .block-coupon .block-top-subtitle,
body.page-login .block-coupon .block-top-subtitle {
  margin: 40px 0 15px;
  padding: 0;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: bold;
  border-bottom: 0;
}
body.page-webfront .block-coupon--list,
body.page-login .block-coupon--list {
  background: #FFF;
  padding: 40px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}
body.page-webfront .block-coupon--list .ul-coupon,
body.page-login .block-coupon--list .ul-coupon {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
body.page-webfront .block-coupon--list .ul-coupon::before,
body.page-login .block-coupon--list .ul-coupon::before {
  content: "";
  display: block;
  width: calc((100% - 60px) / 4);
  order: 1;
}
body.page-webfront .block-coupon--list .ul-coupon::after,
body.page-login .block-coupon--list .ul-coupon::after {
  content: "";
  display: block;
  width: calc((100% - 60px) / 4);
}
body.page-webfront .block-coupon--list .ul-coupon li,
body.page-login .block-coupon--list .ul-coupon li {
  width: calc((100% - 60px) / 4);
  position: relative;
}
body.page-webfront .block-coupon--list .ul-coupon li:nth-child(n+5),
body.page-login .block-coupon--list .ul-coupon li:nth-child(n+5) {
  margin-top: 24px;
}
body.page-webfront .block-coupon--list .ul-coupon li.-new::before,
body.page-login .block-coupon--list .ul-coupon li.-new::before {
  content: "";
  display: block;
  height: 4px;
  width: 100%;
  background: #DA002B;
  position: absolute;
  left: 0;
  top: -4px;
}
body.page-webfront .block-coupon--list .ul-coupon li.-new::after,
body.page-login .block-coupon--list .ul-coupon li.-new::after {
  content: "新着";
  display: inline-block;
  height: 18px;
  width: 48px;
  overflow: hidden;
  padding: 0 10px 0;
  font-size: 12px;
  font-size: 0.75rem;
  color: #FFF;
  text-align: center;
  background: #DA002B;
  border-radius: 4px 4px 0 0;
  position: absolute;
  left: 0;
  top: -19px;
}
body.page-webfront .block-coupon--list .ul-coupon li.-using::before,
body.page-login .block-coupon--list .ul-coupon li.-using::before {
  content: "";
  display: block;
  height: 4px;
  width: 100%;
  background: #78BD2F;
  position: absolute;
  left: 0;
  top: -4px;
}
body.page-webfront .block-coupon--list .ul-coupon li.-using::after,
body.page-login .block-coupon--list .ul-coupon li.-using::after {
  content: "本日利用済";
  display: inline-block;
  height: 18px;
  width: 90px;
  overflow: hidden;
  padding: 0 10px 0;
  font-size: 12px;
  font-size: 0.75rem;
  color: #FFF;
  text-align: center;
  background: #78BD2F;
  border-radius: 4px 4px 0 0;
  position: absolute;
  left: 0;
  top: -19px;
}
body.page-webfront .block-coupon--item,
body.page-login .block-coupon--item {
  max-width: 560px;
  background: #FFF;
  padding: 40px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
  margin: 30px auto;
}
body.page-webfront .block-coupon--item div.-using::before {
  content: "";
  display: block;
  height: 4px;
  width: 100%;
  background: #78BD2F;
  left: 0;
  top: -4px;
}
body.page-webfront .block-coupon--item div.-using::after {
  content: "本日利用済";
  display: inline-block;
  height: 18px;
  width: 90px;
  overflow: hidden;
  padding: 0 10px 0;
  font-size: 12px;
  font-size: 0.75rem;
  color: #FFF;
  text-align: center;
  background: #78BD2F;
  border-radius: 4px 4px 0 0;
  position: relative;
  left: 0;
  top: -293px;
}
body.page-webfront .coupon_body .coupon-use {
  padding-top: 20px;
  padding-left: 15px;
  padding-right: 15px;
}
body.page-webfront .block-coupon--item .coupon-use a,
body.page-login .block-coupon--item .coupon-use a{
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #78BD24;
  font-size: 20px;
  font-size: 1.25rem;
  color: #FFF;
  font-weight: bold;
  min-height: 48px;
  border-radius: 5px;
  margin: 5px 0 5px 0;
}
body.page-webfront .block-coupon--item .coupon-use a.button-loading{
  background-image: url(../../img/sys/loading.gif);
  background-position: center;
  background-repeat: no-repeat;
}
body.page-webfront .coupon_body .coupon-use input[type="submit"]{
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #FFA500;
  font-size: 20px;
  font-size: 1.25rem;
  color: #FFF;
  font-weight: bold;
  min-height: 48px;
  border-radius: 5px;
  border: none;
  width: 200px;
  margin-left: 50px;
}
body.page-webfront .coupon_body .coupon-use a.button{
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #FFA500;
  font-size: 20px;
  font-size: 1.25rem;
  color: #FFF;
  font-weight: bold;
  min-height: 48px;
  border-radius: 5px;
  border: none;
  width: 200px;
  margin-left: 50px;
}
body.page-webfront .coupon_body .coupon-use a.button-loading{
  background-image: url(../../img/sys/loading.gif);
  background-position: center;
  background-repeat: no-repeat;
}
body.page-webfront .coupon_body .modal-coupon-alert{
  font-size: 14px;
  font-size: 1.25rem;
  font-weight: bold;
  margin: 5px 0 5px 0;
  color: #B40B0B;
  text-align: center;
}
body.page-webfront .block-coupon--item .coupon-alert,
body.page-login .block-coupon--item .coupon-alert {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  margin: 15px 0 0;
  color: #B40B0B;
}
body.page-webfront .block-coupon--item .coupon-text,
body.page-login .block-coupon--item .coupon-text {
  font-size: 14px;
  font-size: 0.875rem;
  margin: 15px 0 0;
}
body.page-webfront .block-coupon--item .coupon-data,
body.page-login .block-coupon--item .coupon-data {
  border-top: 1px solid #DDD;
  margin: 25px 0 0;
  padding: 15px 0 0;
}
body.page-webfront .block-coupon--item .coupon-data dt,
body.page-login .block-coupon--item .coupon-data dt {
  font-weight: bold;
  margin: 15px 0 0;
}
body.page-webfront .block-coupon--item .coupon-data dd,
body.page-login .block-coupon--item .coupon-data dd {
  margin: 10px 0 0;
}
body.page-webfront .block-coupon--item .coupon-data dd ul li,
body.page-login .block-coupon--item .coupon-data dd ul li {
  text-indent: -1em;
  padding-left: 1em;
}
body.page-webfront .block-social .block-top-title,
body.page-login .block-social .block-top-title {
  margin: 40px 0 10px;
  padding: 0;
}
body.page-webfront .block-social .note,
body.page-login .block-social .note {
  font-size: 12px;
  font-size: 0.75rem;
}
body.page-webfront .block-social--links,
body.page-login .block-social--links {
  display: flex;
  justify-content: space-between;
}
body.page-webfront .block-social--links-item,
body.page-login .block-social--links-item {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 120px;
  width: calc((100% - 40px) / 3);
  border-top: 4px solid #78BD2F;
  border-radius: 4px;
  margin: 0 0 15px;
  padding: 25px 25px 25px 100px;
  background-color: #FFF;
  background-size: auto 64px;
  background-position: 24px 28px;
  background-repeat: no-repeat;
}
body.page-webfront .block-social--links-item.-social_line,
body.page-login .block-social--links-item.-social_line {
  background-image: url(../../img/customer/logo_line.svg);
}
body.page-webfront .block-social--links-item.-social_google,
body.page-login .block-social--links-item.-social_google {
  background-image: url(../../img/customer/logo_google.svg);
}
body.page-webfront .block-social--links-item.-social_apple,
body.page-login .block-social--links-item.-social_apple {
  background-image: url(../../img/customer/logo_apple.svg);
}
body.page-webfront .block-social--links-item p,
body.page-login .block-social--links-item p {
  margin: 0 0 5px;
}
body.page-webfront .block-social .btn_social_toggle,
body.page-login .block-social .btn_social_toggle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 190px;
  height: 36px;
  background-color: #78BD24;
  border: 1px solid #78BD24;
  border-radius: 3px;
  color: #FFF;
  position: relative;
}
body.page-webfront .block-social .btn_social_toggle::before,
body.page-login .block-social .btn_social_toggle::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  background: url(../../img/customer/icon_link_on.svg) no-repeat 0 0;
  background-size: contain;
  position: absolute;
  left: 12px;
  top: 11px;
}
body.page-webfront .block-social .btn_social_toggle.-on,
body.page-login .block-social .btn_social_toggle.-on {
  background-color: #FFF;
  border-color: #CCC;
  color: #666;
}
body.page-webfront .block-social .btn_social_toggle.-on::before,
body.page-login .block-social .btn_social_toggle.-on::before {
  background-image: url(../../img/customer/icon_link_off.svg);
}
body.page-webfront .block-login,
body.page-login .block-login {
  padding: 0 0 10px;
}
body.page-webfront .block-login h1,
body.page-login .block-login h1 {
  font-weight: bold;
}
body.page-webfront .block-login--first-time h1,
body.page-webfront .block-eclogin--member h1,
body.page-webfront .block-login--member h1,
body.page-login .block-login--member h1 {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 12px;
}
body.page-webfront .block-login .fieldset .form-control input[type=text], body.page-webfront .block-login .fieldset .form-control input[type=tel], body.page-webfront .block-login .fieldset .form-control input[type=email], body.page-webfront .block-login .fieldset .form-control input[type=search], body.page-webfront .block-login .fieldset .form-control input[type=password], body.page-webfront .block-login .fieldset .form-control input[type=url], body.page-webfront .block-login .fieldset .form-control input[type=number], body.page-webfront .block-login .fieldset .form-control textarea, body.page-webfront .block-login .fieldset-vertical .form-control input[type=text], body.page-webfront .block-login .fieldset-vertical .form-control input[type=tel], body.page-webfront .block-login .fieldset-vertical .form-control input[type=email], body.page-webfront .block-login .fieldset-vertical .form-control input[type=search], body.page-webfront .block-login .fieldset-vertical .form-control input[type=password], body.page-webfront .block-login .fieldset-vertical .form-control input[type=url], body.page-webfront .block-login .fieldset-vertical .form-control input[type=number], body.page-webfront .block-login .fieldset-vertical .form-control textarea,
body.page-login .block-login .fieldset .form-control input[type=text],
body.page-login .block-login .fieldset .form-control input[type=tel],
body.page-login .block-login .fieldset .form-control input[type=email],
body.page-login .block-login .fieldset .form-control input[type=search],
body.page-login .block-login .fieldset .form-control input[type=password],
body.page-login .block-login .fieldset .form-control input[type=url],
body.page-login .block-login .fieldset .form-control input[type=number],
body.page-login .block-login .fieldset .form-control textarea,
body.page-login .block-login .fieldset-vertical .form-control input[type=text],
body.page-login .block-login .fieldset-vertical .form-control input[type=tel],
body.page-login .block-login .fieldset-vertical .form-control input[type=email],
body.page-login .block-login .fieldset-vertical .form-control input[type=search],
body.page-login .block-login .fieldset-vertical .form-control input[type=password],
body.page-login .block-login .fieldset-vertical .form-control input[type=url],
body.page-login .block-login .fieldset-vertical .form-control input[type=number],
body.page-login .block-login .fieldset-vertical .form-control textarea {
  border-color: #CCC;
}
body.page-webfront .block-login .fieldset .form-control input[type=text]::placeholder, body.page-webfront .block-login .fieldset .form-control input[type=tel]::placeholder, body.page-webfront .block-login .fieldset .form-control input[type=email]::placeholder, body.page-webfront .block-login .fieldset .form-control input[type=search]::placeholder, body.page-webfront .block-login .fieldset .form-control input[type=password]::placeholder, body.page-webfront .block-login .fieldset .form-control input[type=url]::placeholder, body.page-webfront .block-login .fieldset .form-control input[type=number]::placeholder, body.page-webfront .block-login .fieldset .form-control textarea::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control input[type=text]::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control input[type=tel]::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control input[type=email]::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control input[type=search]::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control input[type=password]::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control input[type=url]::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control input[type=number]::placeholder, body.page-webfront .block-login .fieldset-vertical .form-control textarea::placeholder,
body.page-login .block-login .fieldset .form-control input[type=text]::placeholder,
body.page-login .block-login .fieldset .form-control input[type=tel]::placeholder,
body.page-login .block-login .fieldset .form-control input[type=email]::placeholder,
body.page-login .block-login .fieldset .form-control input[type=search]::placeholder,
body.page-login .block-login .fieldset .form-control input[type=password]::placeholder,
body.page-login .block-login .fieldset .form-control input[type=url]::placeholder,
body.page-login .block-login .fieldset .form-control input[type=number]::placeholder,
body.page-login .block-login .fieldset .form-control textarea::placeholder,
body.page-login .block-login .fieldset-vertical .form-control input[type=text]::placeholder,
body.page-login .block-login .fieldset-vertical .form-control input[type=tel]::placeholder,
body.page-login .block-login .fieldset-vertical .form-control input[type=email]::placeholder,
body.page-login .block-login .fieldset-vertical .form-control input[type=search]::placeholder,
body.page-login .block-login .fieldset-vertical .form-control input[type=password]::placeholder,
body.page-login .block-login .fieldset-vertical .form-control input[type=url]::placeholder,
body.page-login .block-login .fieldset-vertical .form-control input[type=number]::placeholder,
body.page-login .block-login .fieldset-vertical .form-control textarea::placeholder {
  color: #999;
}
body.page-webfront .block-login--input-items,
body.page-login .block-login--input-items {
  width: 100%;
}
body.page-webfront .block-login .fieldset .form-group,
body.page-login .block-login .fieldset .form-group {
  padding-top: 0;
  display: block;
  text-align: left;
  border-bottom: 0;
}
body.page-webfront .block-login .fieldset .form-control,
body.page-login .block-login .fieldset .form-control {
  display: block;
  padding: 5px 0 0;
}
body.page-webfront .block-login .fieldset + .action-buttons,
body.page-login .block-login .fieldset + .action-buttons {
  border-top: 0;
  padding-top: 0;
}
body.page-webfront .block-login .action .btn,
body.page-login .block-login .action .btn {
  width: 100%;
  font-size: 20px;
  font-size: 1.25rem;
}
body.page-webfront .block-login--autologin,
body.page-login .block-login--autologin {
  display: inline-flex;
  margin-top: 8px;
}
body.page-webfront .block-login--autologin input[type=checkbox],
body.page-login .block-login--autologin input[type=checkbox] {
  margin-top: 0;
  border-radius: 0;
}
body.page-webfront .block-login--note,
body.page-login .block-login--note {
  magin-top: 10px;
}
body.page-webfront .block-login--note p,
body.page-login .block-login--note p {
  text-align: left;
  margin-top: 5px;
}
body.page-webfront .block-login--note p a,
body.page-login .block-login--note p a {
  color: #005E3C;
  font-size: 14px;
  font-size: 0.875rem;
}
body.page-webfront .block-login--note p a::before,
body.page-login .block-login--note p a::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #005E3C;
  border-right: 2px solid #005E3C;
  transform: rotate(45deg);
  margin-right: 8px;
}
body.page-webfront .block-login--first-time,
body.page-webfront .block-eclogin--member,
body.page-webfront .block-login--member, body.page-webfront .block-login--social,
body.page-login .block-login--member,
body.page-login .block-login--social {
  width: calc(50% - 10px);
}
body.page-webfront .block-eclogin--member-body,
body.page-webfront .block-login--first-time-body{
  display: flex;
  overflow: visible;
  min-height: 300px;
/*  height: calc(100% - 50px); */
}
body.page-webfront .block-login--member-body, body.page-webfront .block-login--social-body,
body.page-login .block-login--member-body,
body.page-login .block-login--social-body {
  display: flex;
  overflow: visible;
  min-height: 530px;
  height: calc(100% - 50px);
}
body.page-webfront .block-login--first-time-frame, 
body.page-webfront .block-eclogin--member-frame,
body.page-webfront .block-login--member-frame, body.page-webfront .block-login--social-frame,
body.page-login .block-login--member-frame,
body.page-login .block-login--social-frame {
  padding: 40px;
  background: #FFF;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  border: 0;
}
body.page-webfront .block-login--member-body-webfront {
  display: flex;
  overflow: visible;
  min-height: 300px;
  height: calc(100% - 50px);
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  flex-direction: column;
  margin: 0;
  background: #fff;
  width: 100%;
}
body.page-webfront .block-login--member-frame-webfront {
  padding: 40px;
  background: #FFF;
  border: 0;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
}
body.page-webfront .block-login--first-time-header,
body.page-login .block-login--first-time-header {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 12px;
}
body.page-webfront .block-login--social,
body.page-login .block-login--social {
  width: calc(50% - 10px);
}
body.page-webfront .block-login--social-header,
body.page-login .block-login--social-header {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 12px;
}
body.page-webfront .block-login--social-list,
body.page-login .block-login--social-list {
  display: flex;
  flex-direction: column;
  border: 1px solid #CCC;
  border-radius: 3px;
  overflow: hidden;
  margin: 12px 0;
}
body.page-webfront .block-login--social-list li,
body.page-login .block-login--social-list li {
  border-top: 1px solid #CCC;
}
body.page-webfront .block-login--social-list li:first-child,
body.page-login .block-login--social-list li:first-child {
  border-top: 0;
}
body.page-webfront .block-login--social-list li a,
body.page-login .block-login--social-list li a {
  display: flex;
  align-items: center;
  min-height: 60px;
  padding: 0 10px 0 60px;
  position: relative;
}
body.page-webfront .block-login--social-list li a::before,
body.page-login .block-login--social-list li a::before {
  content: "";
  display: inline-block;
  width: 36px;
  height: 36px;
  background-size: contain;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
}
body.page-webfront .block-login--social-list li a.-social_line::before,
body.page-login .block-login--social-list li a.-social_line::before {
  background-image: url(../../img/customer/logo_line.svg);
}
body.page-webfront .block-login--social-list li a.-social_google::before,
body.page-login .block-login--social-list li a.-social_google::before {
  background-image: url(../../img/customer/logo_google.svg);
}
body.page-webfront .block-login--social-list li a.-social_apple::before,
body.page-login .block-login--social-list li a.-social_apple::before {
  background-image: url(../../img/customer/logo_apple.svg);
}
body.page-webfront .block-login--social-note,
body.page-login .block-login--social-note {
  text-indent: -1em;
  padding-left: 1em;
  line-height: 1.75;
}
body.page-webfront .block-login--social-copyright,
body.page-login .block-login--social-copyright {
  line-height: 1.75;
}
body.page-webfront .pane-order-contents,
body.page-login .pane-order-contents {
  background: #F4F5F2;
  border: 0;
}
body.page-webfront .block-totaling,
body.page-login .block-totaling {
  font-size: 16px;
  font-size: 1rem;
}
body.page-webfront h1,
body.page-login h1 {
  font-weight: bold;
}
body.page-webfront .block-totaling--data,
body.page-login .block-totaling--data {
  max-width: 640px;
  margin: 40px auto 0;
}
body.page-webfront .block-totaling--data h2,
body.page-login .block-totaling--data h2 {
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: bold;
  border: 0;
  margin: 0;
  padding: 0;
}
body.page-webfront .block-totaling--data p,
body.page-login .block-totaling--data p {
  margin-top: 5px;
  font-size: 14px;
  font-size: 0.875rem;
}
body.page-webfront .block-totaling--data-table,
body.page-login .block-totaling--data-table {
  margin: 10px 0 0;
  padding: 20px 24px;
  background: #FFF;
  border-radius: 4px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
}
body.page-webfront .block-totaling--data-table table,
body.page-login .block-totaling--data-table table {
  width: 100%;
}
body.page-webfront .block-totaling--data-table table th,
body.page-login .block-totaling--data-table table th {
  text-align: left;
}
body.page-webfront .block-totaling--data-table table td,
body.page-login .block-totaling--data-table table td {
  text-align: right;
}
body.page-webfront .block-totaling--data-table table thead tr,
body.page-login .block-totaling--data-table table thead tr {
  border-bottom: 1px solid #DDD;
}
body.page-webfront .block-totaling--data-table table thead tr th,
body.page-webfront .block-totaling--data-table table thead tr td,
body.page-login .block-totaling--data-table table thead tr th,
body.page-login .block-totaling--data-table table thead tr td {
  padding-bottom: 10px;
}
body.page-webfront .block-totaling--data-table table thead tr td,
body.page-login .block-totaling--data-table table thead tr td {
  font-weight: bold;
}
body.page-webfront .font_normal,
body.page-login .font_normal {
  font-weight: normal;
}
body.page-webfront .block-totaling--data-table table thead + tbody tr th,
body.page-webfront .block-totaling--data-table table thead + tbody tr td,
body.page-login .block-totaling--data-table table thead + tbody tr th,
body.page-login .block-totaling--data-table table thead + tbody tr td {
  padding-top: 10px;
}
body.page-webfront .block-totaling--data-table table.table-form th,
body.page-login .block-totaling--data-table table.table-form th {
  width: 150px;
}
body.page-webfront .block-totaling--data-table table.table-form td,
body.page-login .block-totaling--data-table table.table-form td {
  text-align: left;
  padding: 7px 0 7px 50px;
}
body.page-webfront .block-totaling--data-table table.table-form td input[type=text],
body.page-login .block-totaling--data-table table.table-form td input[type=text] {
  height: 40px;
  border: 1px solid #CCC;
  border-radius: 4px;
  width: 100%;
  padding: 0 10px;
}
body.page-webfront .block-totaling--data-table table.table-form td input[type=text]::placeholder,
body.page-login .block-totaling--data-table table.table-form td input[type=text]::placeholder {
  color: #999;
  font-size: 14px;
  font-size: 0.875rem;
}
body.page-webfront .block-totaling--data-table table.table-form td input[type=text].input-half,
body.page-login .block-totaling--data-table table.table-form td input[type=text].input-half {
  width: calc((100% - 12px) / 2);
}
body.page-webfront .block-totaling--data-table table.table-form td input[type=text].input-half + .input-half,
body.page-login .block-totaling--data-table table.table-form td input[type=text].input-half + .input-half {
  margin-left: 12px;
}
body.page-webfront .block-totaling--data-table table.table-form tr.-require td,
body.page-login .block-totaling--data-table table.table-form tr.-require td {
  position: relative;
}
body.page-webfront .block-totaling--data-table table.table-form tr.-require td::before,
body.page-login .block-totaling--data-table table.table-form tr.-require td::before {
  content: "必須";
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 24px;
  border: 1px solid #DD143A;
  border-radius: 4px;
  font-size: 12px;
  line-height: 1;
  color: #DD143A;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
body.page-webfront .block-totaling--submit,
body.page-login .block-totaling--submit {
  text-align: center;
  margin: 40px auto 0;
}
body.page-webfront .block-totaling--submit .btn-link,
body.page-login .block-totaling--submit .btn-link {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 15px auto 0;
  width: 320px;
  height: 48px;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: bold;
}
body.page-webfront .block-totaling--submit .btn-submit,
body.page-login .block-totaling--submit .btn-submit {
  color: #FFF;
  font-weight: bold;
  background: #78BD2F;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
  border: none;
}
.error_link {
  color: #a94442;
  font-weight: bold;
  text-decoration:underline;
}

/******* //body */
#modal_shadow,
#modal_wrap,
.modal_body {
  display: none;
}
#modal_shadow_header,
#modal_wrap_header
.modal_body_header {
  display: none;
}

#modal_shadow,
#modal_shadow_header {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 91000;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.7);
}

.-mode_modal #modal_shadow,
.-mode_modal #modal_wrap,
.-mode_modal_header #modal_shadow_header,
.-mode_modal_header #modal_wrap_header {
  display: block;
}
.-mode_modal body,
.-mode_modal_header body {
  position: fixed;
  overflow-y: scroll;
}
.-mode_modal body.-modal_digital #modal_digital,
.-mode_modal_header body.-modal_backroot #modal_backroot {
  display: block;
}

#modal_wrap,
#modal_wrap_header {
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 91001;
  transform: translate(-50%, -50%);
}
#modal_wrap .modal_body,
#modal_wrap_header .modal_body_header {
  position: relative;
}
#modal_wrap .modal_body .btn_close,
#modal_wrap_header .modal_body_header .btn_close {
  position: absolute;
  z-index: 91010;
  right: -10px;
  top: -10px;
  width: 32px;
  height: 32px;
  background: #000;
  border: 2px solid #FFF;
  border-radius: 100%;
  cursor: pointer;
}
#modal_wrap .modal_body .btn_close::before, #modal_wrap .modal_body .btn_close::after,
#modal_wrap_header .modal_body_header .btn_close::before, #modal_wrap_header .modal_body_header .btn_close::after {
  content: "";
  width: 16px;
  height: 2px;
  background: #FFF;
  position: absolute;
  left: 12px;
  top: 50%;
}
#modal_wrap .modal_body .btn_close::before,
#modal_wrap_header .modal_body_header .btn_close::before {
  transform: rotate(45deg) translate(-50%);
  top: 19px;
}
#modal_wrap .modal_body .btn_close::after,
#modal_wrap_header .modal_body_header .btn_close::after {
  transform: rotate(-45deg) translate(-50%);
  top: 8px;
}
#modal_wrap_header #modal_backroot {
  width: 345px;
  background: #FFF;
  border-radius: 8px;
}
#modal_wrap_header #modal_backroot p {
  font-weight: bold;
  text-align: center;
  line-height: 1;
  padding: 20px 0;
}
#modal_wrap_header #modal_backroot ul li {
  width: 100%;
  border-top: 1px solid #DDD;
}
#modal_wrap_header #modal_backroot ul li a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 20px 0;
}
#modal_wrap_header #modal_backroot ul li a span {
  display: block;
  font-weight: bold;
  padding: 0 0 10px;
}
#modal_wrap #modal_confirm {
  width: 320px;
  background: #FFF;
  border-radius: 8px;
  padding: 0 24px 24px;
}
#modal_wrap #modal_confirm p {
  font-weight: bold;
  text-align: center;
  padding: 20px 0;
  font-size: 16px;
  font-size: 1rem;
}
#modal_wrap #modal_confirm ul li {
  width: 100%;
}
#modal_wrap #modal_confirm ul li + li {
  margin-top: 16px;
}
#modal_wrap #modal_confirm ul li a,
input[type="button"].-btn-yes,
input[type="button"].-btn-no {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 48px;
  border: 1px solid #DDD;
  font-size: 20px;
  font-size: 1.25rem;
  border-radius: 4px;
}
#modal_wrap #modal_confirm ul li a.-btn-yes,
input[type="button"].-btn-yes {
  color: #FFF;
  font-weight: bold;
  background: #78BD2F;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
  border: 0;
}
input[type="button"].-btn-no {
  margin: 15px auto 0;
  color: #081f2c;
  font-weight: bold;
  background: #FFF;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
  border: 1;
}
#modal_wrap #modal_digital .card_body {
  width: 750px;
  height: 360px;
  margin: auto;
  border-radius: 8px;
  background-color: #FFF;
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: contain;
  position: relative;
}
#modal_wrap #modal_digital .card_body .date {
  display: block;
  position: absolute;
  left: 17px;
  top: 44px;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 1;
}
#modal_wrap #modal_digital .card_body .code {
  position: absolute;
  top: 230px;
  left: 0;
  right: 0;
  width: 100%;
  
}
#modal_wrap #modal_digital .card_body .code .code_img {
  width: 240px;
  height: 120px;
  margin: 0 auto;
}
#modal_wrap #modal_digital .card_body .code .code_num {
  margin: 8px auto 0;
  text-align: center;
  font-size: 10px;
  font-size: 0.625rem;
  letter-spacing: 1em;
  line-height: 1;
}
#modal_wrap #modal_digital .coupon_body {
  width: 330px;
  height: 400px;
  margin: auto;
  border-radius: 8px;
  background-color: #FFF;
  background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: contain;
  position: relative;
}
#modal_wrap #modal_digital .coupon_body .title {
  display: flex;
  justify-content: space-between
}
#modal_wrap #modal_digital .coupon_body .date {
  margin-right: 20px;
}
#modal_wrap #modal_digital .coupon_body .code {
  position: absolute;
  top: 20px;
  left: 0;
  right: 0;
  width: 100%;
  
}
#modal_wrap #modal_digital .coupon_body .code {
  position: absolute;
  top: 30px;
  left: 0;
  right: 0;
  width: 100%;
  
}
#modal_wrap #modal_digital .coupon_body .code .code_label{
  margin-left: 20px;
}
#modal_wrap #modal_digital .coupon_body .code .code_img {
  width: 240px;
  margin: 10px auto 10px auto;
}
#modal_wrap #modal_digital .coupon_body .code .code_num {
  margin: 8px auto 0;
  text-align: center;
  font-size: 10px;
  font-size: 0.625rem;
  letter-spacing: 1em;
  line-height: 1;
}
#modal_wrap #modal_digital.-member_regular .card_body {
  background-image: url(../../img/customer/card_regular.gif);
}
#modal_wrap #modal_digital.-member_bronze .card_body {
  background-image: url(../../img/customer/card_bronze.gif);
}
#modal_wrap #modal_digital.-member_silver .card_body {
  background-image: url(../../img/customer/card_silver.gif);
}
#modal_wrap #modal_digital.-member_gold .card_body {
  background-image: url(../../img/customer/card_gold.gif);
}
#modal_wrap #modal_digital.-member_guest .card_body {
  background-image: url(../../img/customer/card_guest.gif);
}
.link-history a {
 color: #06f;
 text-decoration: underline;
}
/*# sourceMappingURL=customer.css.map */


/* ポイント履歴 */
.block-list-base {
  background: #FFF;
  border-radius: 4px;
  color: #333;
  padding: 20px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
}
.table-list-base {
  background: #FFF;
  border-radius: 4px;
  color: #333;
  padding: 0 20px 5px;
  box-shadow: 0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  margin:20px 0 0;
}
.table-list-base .block-none {
  padding:40px;
  text-align:center;
}
.table-list-base table {
  width:100%;
}
.table-list-base table thead {
  border-bottom:1px solid #DDDDDD;
}
.table-list-base table thead tr {
}
.table-list-base table thead tr th {
  font-weight:bold;
  text-align:center;
  padding:10px 20px;
  line-height:1;
  position:relative;
}
.table-list-base table thead tr th::before {
  content:'';
  display:inline-block;
  width:20px; height:1px;
  background:#DDD;
  position:absolute;
  bottom:-1px;
  left:-20px;
}
.table-list-base table thead tr th::after {
  content:'';
  display:inline-block;
  width:20px; height:1px;
  background:#DDD;
  position:absolute;
  bottom:-1px;
  right:-20px;
}
.table-list-base table tbody {
}
.table-list-base table tbody tr {
  border-top:1px solid #DDD;
}
.table-list-base table tbody tr:first-child {
  border-top:0;
}
.table-list-base table tbody tr td {
  padding:20px;
}
.table-list-base table tbody tr td:first-child {
  padding-left:0;
}
.table-list-base table tbody tr td:last-child {
  padding-right:0;
}
.table-list-base .cell_date {
  width: 133px;
}
.table-list-base .cell_point {
}
.table-list-base .cell_point span {
  display:block;
  line-height:16px;
}
.table-list-base .cell_point span + span {
  margin-top:5px;
}
.table-list-base .cell_num {
  text-align:right;
}
.table-list-base .cell_num span {
  display:block;
  line-height:16px;
}
.table-list-base .cell_num span + span {
  margin-top:5px;
}
.table-list-base .cell_num strong {
  font-weight:bold;
  font-size:16px;
}
.table-list-base .num_green {
  color:#005E3C;
}
.table-list-base .num_red {
  color:#DA002B;
}
.table-list-base .num_black {
  color:#333;
}

.btn-green-01,
.btn-green-02 {
  appearance: none;
  font-weight:bold;
  min-width:100px;
  min-height:36px;
  border-radius:4px;
  cursor:pointer;
}
.btn-green-01 {
  background:#FFF;
  border:2px solid #78BD2F;
  color:#78BD2F;
  box-shadow:0px 2px 2px 0 rgba(0, 0, 0, 0.1);
}
.btn-green-02 {
  background:#78BD2F;
  border:2px solid #78BD2F;
  color:#FFF;
  box-shadow:0px 2px 2px 0 rgba(0, 0, 0, 0.1);
}
.select-01 {
  position:relative;
}
.select-01 select {
  appearance: none;
  //appearance:base-select;
  min-width:100px;
  min-height:36px;
  border-radius:4px; 
  background:#FFF;
  border:0;
  padding: 0 30px 0 15px;
  outline:0 !important;
  box-shadow:0px 2px 2px 0 rgba(0, 0, 0, 0.1);
}
.select-01 select:hover {
  border:0;
}
.select-01::after {
  content:'';
  display:inline-block;
  width:10px;
  height:10px;
  border-right:2px solid #78BD2F;
  border-bottom:2px solid #78BD2F;
  transform:rotate(45deg) translateY(-50%);
  position:absolute;
  right:14px;
  top:calc(50% - 3px);
}
.select-02 {
  position:relative;
}
.select-02 select {
  appearance: none;
  //appearance:base-select;
  min-width:130px;
  min-height:36px;
  border-radius:4px; 
  background:#FFF;
  border:2px solid #78BD2F;
  padding: 0 30px 0 15px;
  outline:0 !important;
  box-shadow:0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  font-size:0.875rem;
}
.select-02 select:hover {
}
.select-02::after {
  content:'';
  display:inline-block;
  width:10px;
  height:10px;
  border-right:2px solid #78BD2F;
  border-bottom:2px solid #78BD2F;
  transform:rotate(45deg) translateY(-50%);
  position:absolute;
  right:14px;
  top:calc(50% - 3px);
}
.select-green-01 {
  appearance: none;
  min-width:100px;
  min-height:36px;
  border-radius:4px; 
  background:#FFF;
  border:2px solid #78BD2F;
  padding: 0 30px 0 15px;
  outline:0 !important;
}
.select-green-01:hover,
.select-green-01:focus {
  border:0;
}
.search-01 {
  white-space: nowrap;
}
.search-01 input {
  appearance: none;
  border-radius:4px;
  background:#FFF;
  padding:0 10px;
  width:280px;
  height:36px;
  border:0;
}
.search-01 input::placeholder {
  color:#999;
}
.search-01 input:hover {
  border:0;
}

/* ポイント履歴 */
.block-point-history-list--customer-name {
  margin:20px 0 10px;
}

.block-point-history-list--status {
  display:flex;
}

.block-point-history-list--status-current {
  display:flex;
  width:50%;
  border-right:#DDD 1px solid;
}
.block-point-history-list--status-current table {
  width:100%;
}
.block-point-history-list--status-current table td {
  text-align:right;
  padding:5px 30px 5px 5px;
}
.block-point-history-list--status-current table td strong {
  font-weight:bold;
  font-size:24px;
  padding-right:4px;
}

.block-point-history-list--status-other {
  width:50%;
  color:#666;
}
.block-point-history-list--status-other table {
  width:100%;
}
.block-point-history-list--status-other table th {
  padding:5px 0 5px 30px;
}
.block-point-history-list--status-other table td {
  text-align:right;
  padding:5px 0 5px;
}

.block-point-history-list--status-other .point-expire.expire-month th {
  color:#DA002B;
}

.block-point-history-list--log {
}
.block-point-history-list--period {
  display:flex;
  width:100%;
  margin:20px 0 0;
}
.block-point-history-list--period .period-current {
  width:50%;
  display:flex;
  align-items:center;
}
.block-point-history-list--period .period-current strong {
  font-weight:bold;
}
.block-point-history-list--period .period-select {
  width:50%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.block-point-history-list--period .period-select input,
.block-point-history-list--period .period-select button,
.block-point-history-list--period .period-select select {
  margin-left:12px;
}
.table-list-base .block-none {
  display:flex;
  justify-content: center;
  align-items: center;
  width:100%;
  min-height:100px;
  font-size:16px;
}


/* お買い上げ履歴 */

.block-history-list--customer-name {
  margin:20px 0 10px;
}

.block-history--button {
  display:flex;
  gap:40px;
}
.block-history--button a {
  display:block;
  position:relative;
}
.block-history--button a.-current {
  font-weight:bold;
}
.block-history--button a.-current::before {
  content:'';
  display:inline-block;
  width:100%;
  height:4px;
  background:#78BD2F;
  position:absolute;
  bottom:-21px;
}

.block-history-list--log {
}
.block-history-list--period {
  display:flex;
  width:100%;
  margin:20px 0 0;
}
.block-history-list--period .period-current {
  width:50%;
  display:flex;
  align-items:center;
}
.block-history-list--period .period-current strong {
  font-weight:bold;
}
.block-history-list--period .period-select {
  width:50%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.block-history-list--period .period-select input,
.block-history-list--period .period-select button,
.block-history-list--period .period-select select {
  margin-left:12px;
}

.block-history-list--item {
  margin:20px 0 0;
  padding:20px 0 0;
}
.block-history-list--item .list-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  padding:0 20px 20px;
}
.block-history-list--item .list-head .table-head {
  width:calc(100% - 140px);
}
.block-history-list--item .list-head .table-head th {
  color:#666;
  font-size:12px;
  line-height:2;
}
.block-history-list--item .list-head .table-head td {
  color:#333;
}
.block-history-list--item .list-head .table-head th.cell_date {
  width:10em;
}
.block-history-list--item .list-head .table-head th.cell_shop {
  width:20em;
}
.block-history-list--item .list-head .table-head th.cell_num,
.block-history-list--item .list-head .table-head td.cell_num {
  text-align:right;
}
.block-history-list--item .list-head .table-head td .num {
  font-weight:bold;
  font-size:16px;
  padding-right:2px;
}
.block-history-list--item .list-head .btn-toggle {
  width:110px;
}
.block-history-list--item .list-head .btn-toggle button {
  display:inline-flex;
  justify-content:flex-end;
  width:100%;
  appearance: none;
  outline:0;
  border:0;
  background:none;
  color:#005E3C;
  white-space:nowrap;
  padding:10px 25px 10px 0;
  position:relative;
  cursor:pointer;
}
.block-history-list--item .list-head .btn-toggle button::after {
  content:'';
  display:inline-block;
  width:20px;
  height:2px;
  background:#005E3C;
  position:absolute;
  right:0;
  transform:translateY(10px);
}
.block-history-list--item .list-head .btn-toggle button.btn_open::before {
  content:'';
  display:inline-block;
  width:2px;
  height:20px;
  background:#005E3C;
  position:absolute;
  right:0;
  transform:translateX(-9px) translateY(1px);
}

.block-history-list--item .list-body {
}
.block-history-list--item .list-body .list-detail {
}
.block-history-list--item .list-body .list-detail li {
  display: grid;
  grid-template-columns: 80px 1fr 160px;
  grid-template-rows: repeat(3, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  padding:20px;
  border-top:1px solid #DDD;
  color:#666;
}
.block-history-list--item .list-body .list-detail li .box_img { grid-area: 1 / 1 / 4 / 2; }
.block-history-list--item .list-body .list-detail li .box_name { grid-area: 1 / 2 / 2 / 3; }
.block-history-list--item .list-body .list-detail li .box_code { grid-area: 2 / 2 / 3 / 3; }
.block-history-list--item .list-body .list-detail li .box_data1 { grid-area: 3 / 2 / 4 / 3; }
.block-history-list--item .list-body .list-detail li .box_data2 { grid-area: 1 / 3 / 4 / 4; }

.block-history-list--item .list-body .list-detail li .box_img {
  width:80px;
  height:80px;
  border:1px solid #DDD;
  display: flex;
  justify-content: center;
  align-items: center;
}
.block-history-list--item .list-body .list-detail li .box_img img {
  object-fit:contain;
  max-height: 75px;
}
.block-history-list--item .list-body .list-detail li .box_name {
  padding:0 0 0 20px;
}
.block-history-list--item .list-body .list-detail li .box_name a {
  color:#005E3C;
  font-weight:bold;
  text-decoration:underline;
}
.block-history-list--item .list-body .list-detail li .box_code {
  padding:0 0 0 20px;
}
.block-history-list--item .list-body .list-detail li .box_data1 {
  padding:0 0 0 20px;
}
.block-history-list--item .list-body .list-detail li .box_data1 span strong {
  font-weight:bold;
  font-size:16px;
  color:#333;
}
.block-history-list--item .list-body .list-detail li .box_data1 span + span {
  padding-left:24px;
}
.block-history-list--item .list-body .list-detail li .box_data2 {
  padding:15px 0 0 20px;
  justify-self:end;
  align-self: center;
}
.block-history-list--item .list-body .list-detail li .box_data2 span {
  display:block;
  text-align:right;
}
.block-history-list--item .list-body .list-detail li .box_data2 span strong {
  font-weight:bold;
  font-size:16px;
  color:#333;
}
.block-history-list .box-alert {
  background:#FFF4F4;
  display:flex;
  justify-content: center;
  align-items:center;
  align-content: center;
  padding:8px;
  border-top:1px solid #DDD;
}
.block-history-list .box-alert p {
  text-align:center;
  color:#B40B0B;
}
.block-history-list .box-alert p::before {
  content:'';
  display:inline-block;
  width:18px;
  height:16px;
  background:url(../../img/customer/icon_alert.svg) no-repeat 50% 50%;
  background-size:contain;
  margin-right:5px;
  transform:translateY(2px);
}

.block-history-list--item .list-roymall {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 20px 20px;
}
.block-history-list--item .list-roymall ul {
  display:flex;
  width:calc(100% - 120px);
  gap:20px;
}
.block-history-list--item .list-roymall ul li {
  white-space:nowrap;
}
.block-history-list--item .list-roymall ul li.li-order {
  width:8em;
}
.block-history-list--item .list-roymall ul li.li-detail {
  width:490px;
}
.block-history-list--item .list-roymall ul li.li-detail p {
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.block-history-list--item .list-roymall ul li.li-detail .box-other {
  text-align:right;
  margin-top:10px;
}
.block-history-list--item .list-roymall ul li.li-detail .box-other strong {

}
.block-history-list--item .list-roymall ul li.li-total {
  width:90px;
  text-align:right;
}
.block-history-list--item .list-roymall ul li.li-status {
  width:90px;
}
.block-history-list--item .list-roymall ul li .list-th {
  font-size:12px;
  color:#666;
}
.block-history-list--item .list-roymall ul li .list-td {
}
.block-history-list--item .list-roymall ul li .list-td .num {
  font-weight:bold;
  font-size:16px;
  color:#333;
  padding:0 2px;
}
.block-history-list--item .list-roymall .btn-detal {
  width:120px;
  text-align:right;
}
.block-history-list--item .list-roymall .btn-detal a {
  color:#005E3C;
  padding:0 20px 0 0;
  position:relative;
}
.block-history-list--item .list-roymall .btn-detal a::before,
.block-history-list--item .list-roymall .btn-detal a::after {
  content:'';
  display:inline-block;
  position:absolute;
}
.block-history-list--item .list-roymall .btn-detal a::before {
  width:16px;
  height:16px;
  background:#005E3C;
  border-radius:100%;
  top:50%;
  right:0;
  transform:translateY(-50%);
}
.block-history-list--item .list-roymall .btn-detal a::after {
  width:7px;
  height:7px;
  border-top:2px solid #FFF;
  border-right:2px solid #FFF;
  transform:rotate(45deg) translateY(-50%);
  top:calc(50% - 1px);
  right:8px;
}

.status-bar {
  display:flex;
  gap:2px;
  margin:5px 0 0;
}
.status-bar span {
  display:inline-block;
  width:22px;
  height:6px;
  background:#DDD;
}
.status-bar span:first-child {
  border-radius:3px 0 0 3px;
}
.status-bar span:last-child {
  border-radius:0 3px 3px 0;
}
.status-bar.-state0 span {
}
.status-bar.-state1 span:first-child,
.status-bar.-state2 span:first-child,
.status-bar.-state2 span:nth-child(2),
.status-bar.-state3 span:first-child,
.status-bar.-state3 span:nth-child(2),
.status-bar.-state3 span:nth-child(3),
.status-bar.-state4 span {
  background:#78BD2F;
}

/* お買い上げ履歴詳細 */

.block-history-list .block-subtitle {
  border:0;
  margin:30px 0 0;
}

.block-history-detail-status {
}
.block-history-detail-status ul {
  display:flex;
  gap:20px;
}
.block-history-detail-status ul li {
}
.block-history-detail-status ul li .list-th {
  font-size:12px;
  color:#666;
}
.block-history-detail-status ul li .list-td {
}
.block-history-detail-status ul li.li-order {
  width:120px;
}
.block-history-detail-status ul li.li-date {
  width:120px;
}
.block-history-detail-status ul li.li-shipdate {
  width:calc(100% - 400px);
}
.block-history-detail-status ul li.li-status {
  width:120px;
}

.block-history-detail-receipt {
}
.block-history-detail-receipt ul {
  display:flex;
  width:100%;
  justify-content: space-between;
  gap:40px;
}
.block-history-detail-receipt ul li {
}
.block-history-detail-receipt ul li .list-th {
  font-size:12px;
  color:#666;
  margin:0 0 8px;
}
.block-history-detail-receipt ul li .list-td {
}
.block-history-detail-receipt ul li.li-name {
  width:360px;
}
.block-history-detail-receipt ul li.li-name input {
  width:360px;
  height:40px;
  border:1px solid #CCC;
  border-radius:4px;
  padding:0 10px;
}
.block-history-detail-receipt ul li.li-proviso {
  width:320px;
}
.block-history-detail-receipt ul li.li-proviso input {
  width:320px;
  height:40px;
  border:1px solid #CCC;
  background:#F4F5F2;
  border-radius:4px;
  padding:0 10px;
}
.block-history-detail-receipt ul li.li-btn {
  border-left:1px solid #CCC;
  padding-left:40px;
}
.block-history-detail-receipt ul li.li-btn .btn_issue {
  width:160px;
  height:65px;
  appearance: none;
  border:1px solid #005E3C;
  background:#FFF;
  border-radius:4px;
  font-size:16px;
  font-weight:bold;
  color:#005E3C;
  cursor:pointer;
}
.block-history-detail-receipt ul li.li-btn .btn_issue:hover {
  border:1px solid #005E3C;
}

.block-history-detail-info {
  display:flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.block-history-detail-info .block-history-detail-list {
  width:700px;
  padding:0;
}
.block-history-detail-info .block-history-detail-total {
  width:280px;
}
.block-history-detail-info .box-note {
  display:block;
  width:100%;
  margin-top: 5px;
  font-size:0.625rem;
}

.block-history-detail-list .list-head {
}
.block-history-detail-list .list-head ul {
  display:flex;
  justify-content: space-between;
  padding:12px 20px;
}
.block-history-detail-list .list-head ul li {
}
.block-history-detail-list .list-head ul li.li_item {
  width:calc(100% - 136px);
}
.block-history-detail-list .list-head ul li.li_amout {
  width:40px;
  text-align:right;
}
.block-history-detail-list .list-head ul li.li_total {
  width:85px;
  text-align:right;
}

.block-history-detail-list .list-body {
}
.block-history-detail-list .list-body li {
  border-top:1px solid #CCC;
  padding:20px;
  display:grid;
  grid-template-columns: 420px 92px 30px 1fr;
  grid-template-rows: repeat(3, auto);
  grid-column-gap: 12px;
  grid-row-gap: 0px;
}
.block-history-detail-list .list-body li .box_item { grid-area: 1 / 1 / 2 / 2; }
.block-history-detail-list .list-body li .box_code { grid-area: 2 / 1 / 3 / 2; }
.block-history-detail-list .list-body li .box_more { grid-area: 3 / 1 / 4 / 3; }
.block-history-detail-list .list-body li .box_review { grid-area: 1 / 2 / 3 / 3; }
.block-history-detail-list .list-body li .box_amount { grid-area: 1 / 3 / 4 / 4; }
.block-history-detail-list .list-body li .box_total { grid-area: 1 / 4 / 4 / 5; }

.block-history-detail-list .list-body li .box_item {
}
.block-history-detail-list .list-body li .box_item a {
  color:#005E3C;
  text-decoration: underline;
}
.block-history-detail-list .list-body li .box_code {
  font-size:12px;
  color:#666;
  padding:4px 0 0;
}
.block-history-detail-list .list-body li .box_more {
  padding:8px 0 0;
}
.block-history-detail-list .list-body li .box_more dl {
  background:#F4F5F2;
  border:1px solid #CCC;
  border-radius:4px;
  padding:16px 20px;
}
.block-history-detail-list .list-body li .box_more dl dt {
  font-weight:bold;
  font-size:12px;
}
.block-history-detail-list .list-body li .box_more dl dd {
  font-size:12px;
}
.block-history-detail-list .list-body li .box_review {
  text-align:right;
}
.block-history-detail-list .list-body li .box_review .btn_review {
  appearance: none;
  width:80px;
  height:28px;
  border:1px solid #005E3C;
  border-radius:4px;
  background:url(../../img/customer/icon_review.svg) no-repeat right 8px top 50% #FFF;
  background-size:12px 12px;
  padding:0 12px 0 0;
  font-size:12px;
  color:#005E3C;
  cursor:pointer;
}
.block-history-detail-list .list-body li .box_amount {
  text-align:right;
}
.block-history-detail-list .list-body li .box_amount strong {
  font-weight:bold;
  font-size:16px;
}
.block-history-detail-list .list-body li .box_total {
  text-align:right;
}
.block-history-detail-list .list-body li .box_total strong {
  font-weight:bold;
  font-size:16px;
}

.block-history-detail-total {
  padding:0;
}
.block-history-detail-total table {
  width:100%;
}
.block-history-detail-total table tbody tr {
  border:0;
}
.block-history-detail-total table tbody tr td {
  text-align:right;
  padding:2px 0 2px;
}
.block-history-detail-total .table-total {
  padding:20px;
}
.block-history-detail-total .table-total::before {
  content:'';
  display:block;
  width:100%;
  height:1px;
  background:#CCC;
  position:relative;
  top:-20px;
}
.block-history-detail-total .table-total:first-child::before {
  display:none;
}
.block-history-detail-total .table-total table {
}
.block-history-detail-total .table-pay {
  padding:20px;
  border-top:1px solid #CCC;
}
.block-history-detail-total .table-ship {
  padding:20px;
  border-top:1px solid #CCC;
}
.block-history-detail-total strong {
  font-size:16px;
  font-weight:bold;
}
.block-history-detail-total .box-note {
  font-size:10px;
  color:#666;
  text-align:right;
}
.block-history-detail-total .box-notice {
  font-size:10px;
  color:#666;
  margin-top: 5px;
  padding-left:1em;
  text-indent:-1em;
}

.block-history-detail-orderer {
}
.block-history-detail-orderer dl {
  display:flex;
  align-items:center;
}
.block-history-detail-orderer dl dt {
  width:280px;
  font-size:16px;
  font-weight:bold;
}
.block-history-detail-orderer dl dd {
  padding-left:20px;
}

.block-history-detail-ship p + p {
  margin-top:10px;
}
.block-history-detail-ship-list {
  padding:0;
}
.block-history-detail-ship-list .list-head ul {
  display:flex;
  justify-content: space-between;
  padding:12px 20px;
}
.block-history-detail-ship-list .list-head ul li {
}
.block-history-detail-ship-list .list-head ul li.li_item {
}
.block-history-detail-ship-list .list-head ul li.li_amout {
  text-align:right;
}
.block-history-detail-ship-list .list-body {
}
.block-history-detail-ship-list .list-body li {
  border-top:1px solid #CCC;
  padding:20px;
  display:grid;
  grid-template-columns: auto 50px;
  grid-template-rows: repeat(2, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
}
.block-history-detail-ship-list .list-body li .box_item { grid-area: 1 / 1 / 2 / 2; }
.block-history-detail-ship-list .list-body li .box_code { grid-area: 2 / 1 / 3 / 2; }
.block-history-detail-ship-list .list-body li .box_amount { grid-area: 1 / 2 / 3 / 3; }

.block-history-detail-ship-list .list-body li .box_amount {
  text-align:right;
}
.block-history-detail-ship-list .list-body li .box_code {
  font-size:12px;
  color:#666;
  padding:4px 0 0;
}

.block-links {
}
.block-links ul {
  display:flex;
  justify-content: center;
  gap:20px;
  margin:40px auto 0;
}
.block-links ul li {
}
.block-links ul li a {
  display:flex;
  justify-content:center;
  align-items:center;
  width:320px;
  height:48px;
  position:relative;
  font-size:16px;
  background:#FFF;
  border-radius:4px;
  box-shadow:0px 2px 2px 0 rgba(0, 0, 0, 0.1);
  border:2px solid transparent;
  transition:all 0.2s linear 0s;
  padding-left: 30px;
}
.block-links ul li a:hover {
  border-color: #78bc30;
  text-decoration: none;
}
.block-links ul li a::before {
  content:'';
  display:inline-block;
  width:24px;
  height:24px;
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  background-repeat: no-repeat;
  background-size:contain;
}
.block-links ul li a.icon-cart::before {
  background-image: url(../../img/customer/icon_cart.svg);
}
.block-links ul li a.icon-q::before {
  background-image: url(../../img/customer/icon_q.svg);
}

/* accordion */
.js-accordion-body {
  display:grid !important;
  grid-template-rows:0fr;
  transition:grid-template-rows 0.4s ease-in-out 0s;
}
.js-accordion-parent.-open .js-accordion-body {
  grid-template-rows:1fr;
}
.js-accordion-body .js-accordion-body-wrap {
  overflow:hidden !important;
}
.js-accordion-parent .btn_close,
.js-accordion-parent.-open .btn_open {
  display:none !important;
  opacity:0;
}
.js-accordion-parent.-open .btn_close {
  display:inline-block !important;
  opacity:1;
}
