@charset "UTF-8";
/*
開閉式セクション／.accordion_section
======================================================================
*/
.accordion_section {
  padding-top: 56px;
  margin-top: calc(-56px - 1px);
}
@media screen and (min-width: 1024px) {
  .accordion_section {
    padding-top: min(7.4vw, 100px);
    margin-top: calc(min(7.4vw, 100px) * -1 - 1px);
  }
}

.accordion_section--body {
  display: none;
  padding: 1.4em 0.8em 2em;
}

.accordion_section--heading .title {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #FFF2F9;
  padding: 7px 12px 6px;
  border: solid #FF008E;
  border-width: 1px 0;
  cursor: pointer;
  font-size: 0.18rem;
  font-weight: 600;
  line-height: 1.5;
}
.accordion_section--heading .title i {
  margin-left: 1em;
  font-size: 0.14rem;
}
@media screen and (min-width: 1280px) {
  .accordion_section--heading .title {
    font-size: 0.24rem;
  }
  .accordion_section--heading .title i {
    font-size: 0.18rem;
  }
}
.accordion_section--heading .fa-minus {
  display: none;
}

.accordion_section a {
  color: #0099EE;
  text-decoration: underline;
}
.accordion_section p + p {
  margin-top: 1em;
}
.accordion_section img {
  height: auto;
}

.accordion_section.is-open .accordion_section--heading .fa-minus {
  display: inline;
}
.accordion_section.is-open .accordion_section--heading .fa-plus {
  display: none;
}

.sns_login .text_box {
  margin-bottom: 20px;
}
@media screen and (min-width: 1024px) {
  .sns_login .text_box {
    font-size: 0.18rem;
  }
}
@media screen and (min-width: 1280px) {
  .sns_login .text_box {
    font-size: 0.2rem;
  }
}

.sns_login--form--wrapper {
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 30px;
  max-width: 820px;
}
@media screen and (max-width: 960px) {
  .sns_login--form--wrapper {
    max-width: 530px;
  }
}
@media screen and (max-width: 768px) {
  .sns_login--form--wrapper {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}

.sns_login {
  /* Googleログインボタン用スタイル */
}
.sns_login .form--container {
  padding-left: 18px;
  padding-right: 18px;
}
@media screen and (min-width: 375px) {
  .sns_login.sns_login-login .form--container {
    padding-left: 58px;
    padding-right: 45px;
  }
}
.sns_login.sns_login-relate_social {
  margin-top: 30px;
}
.sns_login.sns_login-relate_social .sns_login--form--wrapper {
  max-width: 520px;
}
.sns_login .text_box {
  margin-bottom: 20px;
}
@media screen and (min-width: 1024px) {
  .sns_login .text_box {
    font-size: 0.18rem;
  }
}
@media screen and (min-width: 1280px) {
  .sns_login .text_box {
    font-size: 0.2rem;
  }
}
@media screen and (min-width: 1024px) {
  .sns_login .text_box strong {
    font-weight: normal;
  }
}
.sns_login .text_box > div {
  font-size: 0.14rem;
}
@media screen and (min-width: 1280px) {
  .sns_login .text_box > div {
    font-size: 0.17rem;
  }
}
.sns_login .qJTHM {
  -webkit-user-select: none;
  color: #202124;
  direction: ltr;
  -webkit-touch-callout: none;
  font-family: "Roboto-Regular", arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  font-weight: 400;
  margin: 0;
  overflow: hidden;
  -webkit-text-size-adjust: 100%;
}
.sns_login .ynRLnc {
  left: -9999px;
  position: absolute;
  top: -9999px;
}
.sns_login .L6cTce {
  display: none;
}
.sns_login .bltWBb {
  word-break: break-all;
}
.sns_login .hSRGPd {
  color: #1a73e8;
  cursor: pointer;
  font-weight: 500;
  text-decoration: none;
}
.sns_login .Bz112c-W3lGp {
  height: 16px;
  width: 16px;
}
.sns_login .Bz112c-E3DyYd {
  height: 20px;
  width: 20px;
}
.sns_login .Bz112c-r9oPif {
  height: 24px;
  width: 24px;
}
.sns_login .Bz112c-uaxL4e {
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
.sns_login .LgbsSe-Bz112c {
  display: block;
}
.sns_login .S9gUrf-YoZ4jf,
.sns_login .S9gUrf-YoZ4jf * {
  border: none;
  margin: 0;
  padding: 0;
}
.sns_login .fFW7wc-ibnC6b > .aZ2wEe > div {
  border-color: #4285f4;
}
.sns_login .P1ekSe-ZMv3u > div:nth-child(1) {
  background-color: #1a73e8 !important;
}
.sns_login .P1ekSe-ZMv3u > div:nth-child(2),
.sns_login .P1ekSe-ZMv3u > div:nth-child(3) {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), linear-gradient(to right, #1a73e8, #1a73e8) !important;
}
.sns_login .haAclf {
  display: inline-block;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe {
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: background-color 0.218s, border-color 0.218s;
  transition: background-color 0.218s, border-color 0.218s;
  -webkit-user-select: none;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: none;
  border: 1px solid #dadce0;
  color: #3c4043;
  cursor: pointer;
  font-family: "Google Sans", arial, sans-serif;
  font-size: 14px;
  height: 40px;
  letter-spacing: 0.25px;
  outline: none;
  overflow: hidden;
  padding: 0 12px;
  position: relative;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  width: auto;
}
@media screen and (-ms-high-contrast: active) {
  .sns_login .nsm7Bb-HzV7m-LgbsSe {
    border: 2px solid windowText;
    color: windowText;
  }
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.pSzOP-SxQuSe {
  font-size: 14px;
  height: 32px;
  letter-spacing: 0.25px;
  padding: 0 10px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.purZT-SxQuSe {
  font-size: 11px;
  height: 20px;
  letter-spacing: 0.3px;
  padding: 0 8px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe {
  padding: 0;
  width: 40px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe.pSzOP-SxQuSe {
  width: 32px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe.purZT-SxQuSe {
  width: 20px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.JGcpL-RbRzK {
  -webkit-border-radius: 20px;
  border-radius: 20px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.JGcpL-RbRzK.pSzOP-SxQuSe {
  -webkit-border-radius: 16px;
  border-radius: 16px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.JGcpL-RbRzK.purZT-SxQuSe {
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.MFS4be-Ia7Qfc {
  border: none;
  color: #fff;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.MFS4be-v3pZbf-Ia7Qfc {
  background-color: #1a73e8;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.MFS4be-JaPV2b-Ia7Qfc {
  background-color: #202124;
  color: #e8eaed;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  height: 18px;
  margin-right: 8px;
  min-width: 18px;
  width: 18px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.pSzOP-SxQuSe .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  height: 14px;
  min-width: 14px;
  width: 14px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.purZT-SxQuSe .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  height: 10px;
  min-width: 10px;
  width: 10px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  margin-left: 8px;
  margin-right: -4px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  margin: 0;
  padding: 10px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe.pSzOP-SxQuSe .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  padding: 8px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe.purZT-SxQuSe .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  padding: 4px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  -webkit-border-top-left-radius: 3px;
  border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  border-bottom-left-radius: 3px;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  background-color: #fff;
  height: 36px;
  margin-left: -10px;
  margin-right: 12px;
  min-width: 36px;
  width: 36px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf .nsm7Bb-HzV7m-LgbsSe-Bz112c,
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf .nsm7Bb-HzV7m-LgbsSe-Bz112c {
  margin: 0;
  padding: 0;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.pSzOP-SxQuSe .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  height: 28px;
  margin-left: -8px;
  margin-right: 10px;
  min-width: 28px;
  width: 28px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.purZT-SxQuSe .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  height: 16px;
  margin-left: -6px;
  margin-right: 8px;
  min-width: 16px;
  width: 16px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.Bz112c-LgbsSe .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  -webkit-border-radius: 3px;
  border-radius: 3px;
  margin-left: 2px;
  margin-right: 0;
  padding: 0;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.JGcpL-RbRzK .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  -webkit-border-radius: 18px;
  border-radius: 18px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.pSzOP-SxQuSe.JGcpL-RbRzK .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  -webkit-border-radius: 14px;
  border-radius: 14px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.purZT-SxQuSe.JGcpL-RbRzK .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  -webkit-border-radius: 8px;
  border-radius: 8px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .nsm7Bb-HzV7m-LgbsSe-bN97Pc-sM5MNb {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-flex-direction: row;
  flex-direction: row;
  justify-content: space-between;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 100%;
  position: relative;
  width: 100%;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .oXtfBe-l4eHX {
  justify-content: center;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .nsm7Bb-HzV7m-LgbsSe-BPrWId {
  -webkit-flex-grow: 1;
  flex-grow: 1;
  font-family: "Google Sans", arial, sans-serif;
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.purZT-SxQuSe .nsm7Bb-HzV7m-LgbsSe-BPrWId {
  font-weight: 300;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .oXtfBe-l4eHX .nsm7Bb-HzV7m-LgbsSe-BPrWId {
  -webkit-flex-grow: 0;
  flex-grow: 0;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .nsm7Bb-HzV7m-LgbsSe-MJoBVe {
  -webkit-transition: background-color 0.218s;
  transition: background-color 0.218s;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe:hover,
.sns_login .nsm7Bb-HzV7m-LgbsSe:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: rgb(210, 227, 252);
  outline: none;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe:hover .nsm7Bb-HzV7m-LgbsSe-MJoBVe,
.sns_login .nsm7Bb-HzV7m-LgbsSe:focus .nsm7Bb-HzV7m-LgbsSe-MJoBVe {
  background: rgba(66, 133, 244, 0.04);
}
.sns_login .nsm7Bb-HzV7m-LgbsSe:active .nsm7Bb-HzV7m-LgbsSe-MJoBVe {
  background: rgba(66, 133, 244, 0.1);
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.MFS4be-Ia7Qfc:hover .nsm7Bb-HzV7m-LgbsSe-MJoBVe,
.sns_login .nsm7Bb-HzV7m-LgbsSe.MFS4be-Ia7Qfc:focus .nsm7Bb-HzV7m-LgbsSe-MJoBVe {
  background: rgba(255, 255, 255, 0.24);
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.MFS4be-Ia7Qfc:active .nsm7Bb-HzV7m-LgbsSe-MJoBVe {
  background: rgba(255, 255, 255, 0.32);
}
.sns_login .nsm7Bb-HzV7m-LgbsSe .n1UuX-DkfjY {
  -webkit-border-radius: 50%;
  border-radius: 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  height: 20px;
  margin-left: -4px;
  margin-right: 8px;
  min-width: 20px;
  width: 20px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe .nsm7Bb-HzV7m-LgbsSe-BPrWId {
  font-family: "Roboto";
  font-size: 12px;
  text-align: left;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe .nsm7Bb-HzV7m-LgbsSe-BPrWId .ssJRIf,
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe .nsm7Bb-HzV7m-LgbsSe-BPrWId .K4efff .fmcmS {
  overflow: hidden;
  text-overflow: ellipsis;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe .nsm7Bb-HzV7m-LgbsSe-BPrWId .K4efff {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  color: #5f6368;
  fill: #5f6368;
  font-size: 11px;
  font-weight: 400;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe.MFS4be-Ia7Qfc .nsm7Bb-HzV7m-LgbsSe-BPrWId .K4efff {
  color: #e8eaed;
  fill: #e8eaed;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe .nsm7Bb-HzV7m-LgbsSe-BPrWId .K4efff .Bz112c {
  height: 18px;
  margin: -3px -3px -3px 2px;
  min-width: 18px;
  width: 18px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  -webkit-border-top-left-radius: 0;
  border-top-left-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -webkit-border-top-right-radius: 3px;
  border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
  border-bottom-right-radius: 3px;
  margin-left: 12px;
  margin-right: -10px;
}
.sns_login .nsm7Bb-HzV7m-LgbsSe.jVeSEe.JGcpL-RbRzK .nsm7Bb-HzV7m-LgbsSe-Bz112c-haAclf {
  -webkit-border-radius: 18px;
  border-radius: 18px;
}
.sns_login .L5Fo6c-sM5MNb {
  border: 0;
  display: block;
  left: 0;
  position: relative;
  top: 0;
}
.sns_login .L5Fo6c-bF1uUb {
  -webkit-border-radius: 4px;
  border-radius: 4px;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}
.sns_login .L5Fo6c-bF1uUb:focus {
  border: none;
  outline: none;
}
/*
データの属性によるclass付与ルール
====================================================================================================
※tableのclassと、セルへの意味付けclassは、[_table.css](table.html)に記述
*/
/*金額の場合の共通スタイル*/
.price {
  font-size: 14px;
  text-align: right;
}

/*割引の場合の共通テキスト色*/
.discount {
  color: #663300;
}

/*
tableのスタイリング
====================================================================================================
* サイト全般を通じて使用可能な汎用的なtableのスタイリング
* 個別にスタイリングするときは、個別CSSやclassの付与によって詳細度を上げて上書きする
*/
/*tableとセルの共通スタイリング
----------------------------------------------------------------------
*/
/*table*/
.order-index table {
  border-collapse: collapse;
  width: 100%;
  border: solid 1px #aaa;
  border-bottom: none;
}

/*
カートの商品種別／.cart_item_list table
====================================================================================================
* 通常アイテム `<table class="ordinary">`
* 付属品その他 `<table class="special">`※キャンペーンコード使用時の特殊アイテムなど

*/
/*商品一つに対するtable*/
.cart_item_list table {
  margin-bottom: 20px;
}

/*thに対するスタイリング*/
.cart_item_list table th {
  background: #f4f4f4;
  vertical-align: middle;
  box-shadow: inset 1px 1px 0px rgba(255, 255, 255, 0.9);
  font-weight: normal;
}

/*th、td（全体に対するスタイリング）*/
.cart_item_list table th,
.cart_item_list table td {
  border-bottom: solid 1px #aaa;
  padding: 15px 5%;
  vertical-align: middle;
}

/*通常商品のtable*/
/*特典商品のtable*/
.cart_item_list table.special {
  background-color: #f7f7f7;
}

/*擬似要素でテキストを表示*/
.cart_item_list table.special .item_name .icon:before {
  color: #ff3300;
  content: "【特典】";
  font-style: normal;
}

/*
商品リスト／.cart_item_list
====================================================================================================
*/
.cart_item_list {
  clear: both;
}

/*
tableとセルの設定
----------------------------------------------------------------------
*/
.cart_item_list th,
.cart_item_list td {
  float: none;
}

.cart_item_list th {
  width: 25%;
}

/*一番上のtableのthにだけ、border-topを再設定*/
.cart_item_list table:first-child .line_thead th {
  border-top: solid 1px #999;
}

/*
各セルの部品／（td）
====================================================================================================
*/
/*商品情報／.item_info
----------------------------------------------------------------------
*/
/*###画像のボックス／.item_image*/
.cart_item_list .item_image {
  text-align: center;
}
@media (max-width: 599px) {
  .cart_item_list .item_image img {
    width: 300px;
  }
}

.cart_item_list .item_info img {
  width: auto;
  height: 96px;
}

/*###商品データのボックス／.item_data*/
.cart_item_list .item_data {
  width: 100%;
}

/*商品名リンク*/
.cart_item_list .item_name a {
  display: block;
  font-size: 108%;
  line-height: 1.4em;
}

.cart_item_list .item_dioptre {
  padding-top: 1.4em;
  line-height: 1.4;
}

.cart_item_list .item_dioptre:before {
  content: "【度数】";
}

.cart_item_list .item_dioptre span {
  color: #ef454a;
  font-size: 16px;
  font-weight: bold;
}

.cart_item_list .item_text {
  padding-top: 1.4em;
  line-height: 1.4;
}

.cart_item_list .item_text:before {
  color: #ef454a;
  content: "【付属品】";
}

.cart_item_list .item_discount {
  margin-top: 0.8em;
  line-height: 1.4;
}

/*バリエーション情報*/
.cart_item_list .item_variation {
  display: block;
  margin-top: 8px;
  line-height: 1.3em;
}

/*商品情報（商品項目）
------------------------------------------------------------
*/
.item_data {
  display: block;
}

/*価格／.item_price
----------------------------------------------------------------------
*/
.cart_item_list .item_price {
  font-size: 0;
}

.cart_item_list .item_price .label {
  font-size: 16px;
}

.cart_item_list .item_price .currency {
  color: #f93b91;
  font-size: 16px;
}

.cart_item_list .item_price .figures {
  color: #f93b91;
  font-size: 16px;
}

.cart_item_list .item_price .single_price {
  margin-top: 7px;
}

.cart_item_list .item_price .sub_total_price {
  margin-top: 20px;
}

.cart_item_list .item_price-discount {
  margin-top: 10px;
}

/*
カートアイテムリスト（キャンペーン商品）
==================================================
*/
.cart_item_list-special {
  margin-top: 25px;
  border: 4px solid #ffc8a4 !important;
  background-color: #fffefb;
  border-radius: 10px;
}

.cart_item_list-special--header {
  padding: 20px 15px 22px;
  border-bottom: 1px solid #ffc8a4;
}

.cart_item_list--heading {
  margin: 0;
  padding: 0;
  color: #ff6600;
}
.cart_item_list--heading .title {
  line-height: 1.3;
}

.cart_item_list-special .item_name {
  margin-bottom: 15px;
  padding-bottom: 5px;
  border-bottom: 1px solid #999;
}

.cart_item_list-special .item_name + p {
  margin-top: 10px;
}

.cart_item_list-special .select + .select {
  margin-top: 10px;
}

.cart_item_list-special .select > p {
  margin-bottom: 5px;
}

.cart_item_list-special .form_select {
  width: 300px;
  max-width: 100%;
  font-size: 16px;
}

.cart_item_list-special .cart_item {
  padding: 20px 15px;
}

.cart_item_list-special .cart_item:first-child {
  border-top: none;
}

.cart_item_list-special .cart_item.is-empty {
  background: #f4f4f4;
}

.cart_item_list-special .cart_item.is-empty .item_image {
  opacity: 0.3;
}

.cart_item_list-special .variation_select {
  margin-top: 20px;
  line-height: 1.2;
}

.cart_item_list-special .variation_select:first-child {
  margin-top: 0;
}

.cart_item_list-special .cart_item:first-child {
  border-top: none;
}

.cart_item_list-special .cart_item .item_quantity-col-2 {
  width: 12em;
}

.cart_item_list-special + .btn_area {
  padding: 30px 0;
}

.cart_item_list-special--btn_area {
  padding: 15px 0;
  text-align: center;
}

.cart_item_list-special--btn_area .btn {
  width: 100%;
  max-width: 350px;
  box-sizing: border-box;
}
@media (max-width: 412px) {
  .cart_item_list-special--btn_area .btn {
    padding: 1em;
    font-size: 0.14rem;
  }
}
.cart_item_list-special--btn_area .btn + .present_items--alert {
  margin-top: 1em;
}

.present_items--alert {
  margin-bottom: 15px;
  color: #f00;
  font-size: 14px;
  font-weight: bold;
}

.cart_item--empty_message {
  margin-top: 0;
}

.cart_item--empty_message + .present_items--alert {
  margin-top: 10px;
}

.cart_item_list-special input[type=hidden] + .item_quantity {
  margin-top: 0;
}

/*
保有ポイントのボックス／.cart_saving_point
====================================================================================================
*/
.cart_saving_point {
  margin-top: 20px;
}

.cart_saving_point--heading .title {
  background-color: transparent;
  color: inherit;
  padding: 0 0 5px;
  font-weight: bold;
}

.cart_saving_point--inner {
  padding: 24px 28px 15px 28px;
  background-color: #f7f7f7;
  border: solid 1px #999;
  border-radius: 10px;
}
.cart_saving_point--inner .figure {
  font-size: 0.22rem;
  margin-right: 0.05rem;
  font-weight: bold;
}

.cart_saving_point--expire {
  color: #999;
  font-size: 15px;
}

.cart_saving_point--alert {
  padding: 0.6em;
  margin: 1.4em 0 0.6em;
  border: 1px solid #e80e0e;
  border-radius: 3px;
  color: #e80e0e;
}

/*
合計金額 のボックス／.amount_info
====================================================================================================
*/
.amount_info {
  margin-top: 20px;
}

.amount_info img {
  max-width: 100%;
}

.amount_info--inner {
  padding: 7px 28px 15px 28px;
  background-color: #f7f7f7;
  border: solid 1px #999;
  border-radius: 10px;
}

.amount_info table {
  border: none;
}

.amount_info th,
.amount_info td {
  width: auto;
  float: none;
  background-color: transparent;
  border: none;
  border-bottom: solid 1px #999;
  box-shadow: none;
  padding: 20px 5px 5px 5px;
}

.amount_info th {
  vertical-align: top;
}

.amount_info .amount_detail {
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.3;
}

.amount_info .btn_area {
  margin-top: 1.5em;
}

/*決済動線へのボタン*/
.amount_info .btn-next {
  width: 100%;
}

@media screen and (max-width: 374px) {
  .order-cart .amount_info .c_h1 {
    border-bottom: none;
  }
  .order-cart .amount_info .c_h2 {
    padding-top: 0;
  }
}

/*
ログイン状態の情報エリア／.login_info
====================================================================================================
*/
.login_info {
  padding-top: 40px;
  padding-bottom: 20px;
}

.login_info h2 {
  padding-bottom: 6px;
  font-weight: bold;
  border-bottom: dotted 1px #666;
}

.login_info .text_box {
  padding-top: 10px;
  line-height: 1.5em;
}

.login_info .title_box .icon {
  display: none;
}

/*
お支払い・送料について・FAQ／.payment_guide
====================================================================================================
*/
.payment_guide_section + .payment_guide_section {
  margin-top: 2em;
}
.payment_guide_section .accordion_section--heading .title {
  background: #fafafa;
  border: 1px solid #d9d9d9;
}

.payment_guide_section--body {
  padding-top: 1em;
}

/*----------------------------------------------------
	.page_content 
----------------------------------------------------*/
.payment_guide dl.page_content {
  margin-bottom: 0;
}

.payment_guide dl.page_content dt {
  color: #dc5059;
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 12px;
}

.payment_guide dl.page_content dd {
  margin-bottom: 17px;
  padding-bottom: 15px;
  border-bottom: dotted 1px #b4b4b4;
}

.payment_guide dl.page_content dd a {
  color: #1b98ce;
  text-decoration: underline;
}

.payment_guide dl.page_content dd a:hover {
  color: #fe168e;
  text-decoration: none;
}

/*
ログインボックス／.login_box
====================================================================================================
* ベーシック認証 `.login_box.basic`
* ソーシャル認証 `.login_box.social`
*/
/*ログインボックス共通
----------------------------------------------------------------------
*/
.login_box {
  padding-top: 20px;
  padding-bottom: 20px;
}

/*###タイトルのボックス／.login_box .title_box*/
.login_box .title_box h3 {
  padding: 10px;
  background-color: #e7e7e7;
}

/*###テキストのボックス／.login_box .text_box*/
.login_box .text_box {
  padding-top: 10px;
}

/*###ログイン操作のボックス／.login_box .input_box*/
.login_box .input_box {
  padding-top: 15px;
}

.login_box .input_box .info {
  padding-top: 15px;
  clear: both;
}

/*通常ログイン／.login_box.basic
----------------------------------------------------------------------
*/
/*入力ボックス*/
.login_box.basic .input_box {
  margin-top: 10px;
}

.login_box.basic .input_box dt,
.login_box.basic .input_box dd {
  float: left;
  height: 44px;
}

/*タイトル*/
.login_box.basic .input_box dt {
  clear: left;
  width: 120px;
}

/*データ*/
.login_box.basic .input_box dd {
  width: 55%;
}

/*タイトル 項目名*/
.login_box.basic .input_box dt .title {
  font-weight: bold;
  font-size: 108%;
}

/*タイトル 説明*/
.login_box.basic .input_box dt .description {
  color: #999;
  display: block;
  margin-top: 5px;
  font-size: 93%;
}

.login_box.basic .input_box dd .form_text {
  width: 100%;
}

/*ボタンのエリア*/
.login_box.basic .input_box .btn_area {
  float: left;
  margin-left: 120px;
  padding: 0;
}

/*ボタンのスタイル上書き*/
.login_box.basic .input_box .btn_area .btn {
  height: 34px;
  line-height: 34px;
  margin-right: 15px;
}

/*ボタンのアイコン*/
.login_box.basic .input_box .btn_area .btn .icon {
  display: none;
}

/*パスワードを忘れた時のリンク*/
.login_box.basic .input_box .forget {
  clear: both;
  padding-top: 20px;
  margin-left: 110px;
}

/*
クーポン／コード
====================================================================================================
* クーポンコードを入力・送信するためのボックス
* 開閉は、`/js/mb/common.js`にて設定
*/
/*開閉スイッチ／coupon_code_switch
----------------------------------------------------------------------
id="do_couponCodeBoxToggle" にて、入力ボックスのid="couponCodeBox"が  
トグル開閉するように設定 
*/
.coupon_code_switch {
  margin-top: 20px;
}

/*ボタンスタイルの上書き*/
.coupon_code_switch .btn {
  position: relative;
  width: 100%;
  padding: 0.6em 1em;
  box-sizing: border-box;
  box-shadow: none;
  text-align: center;
}

.coupon_code_switch .btn.is-open {
  border-radius: 6px 6px 0 0;
}

/*コード入力ボックス／.coupon_code_box
----------------------------------------------------------------------
id="couponCodeBox"付与
*/
.coupon_code_box {
  display: none;
}

/*innerボックス*/
.coupon_code {
  border: solid #ccc;
  border-width: 0 1px 1px;
  padding: 20px 25px;
  border-radius: 0 0 6px 6px;
}

/*ボックスのタイトル*/
.coupon_code .title {
  font-size: 108%;
  border-bottom: dotted 1px #ccc;
  padding-bottom: 5px;
  margin-bottom: 10px;
}

/*文言分割をCSSで表示調整*/
.coupon_code .title .text.line_1 {
  /*キャンペーン*/
  display: inline;
}

.coupon_code .title .text.line_2 {
  /*クーポン*/
  display: none;
}

/*ボックスの使用方法説明*/
.coupon_code .description {
  line-height: 1.5em;
}

.coupon_code .description .attention {
  margin-top: 25px;
  font-size: 93%;
}

.coupon_code .description .attention .text {
  margin-top: 10px;
}

/*フォームのボックス*/
.coupon_code .form_box {
  padding-top: 25px;
}
.coupon_code .form_box .row {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.coupon_code .form_box .col-1 {
  flex: 1;
}
.coupon_code .form_box .col-2 {
  width: 30%;
  max-width: 100px;
}

/*入力フォーム*/
.coupon_code .form_text {
  width: 100%;
  box-sizing: border-box;
}

/*送信ボタン*/
.coupon_code .form_box .form_text {
  border-radius: 4px 0 0 4px;
  border: 1px solid #999;
  border-right: none;
}
.coupon_code .form_box .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 39px;
  box-sizing: border-box;
  box-shadow: none;
  border: 1px solid #999;
  border-left: none;
  border-radius: 0 4px 4px 0;
  font-size: 0.14rem;
  font-weight: normal;
}

/*メッセージボックス／.code_message
----------------------------------------------------------------------
*/
.code_message {
  clear: both;
  padding: 10px;
}

.code_message .text {
  padding: 10px;
  border: solid 1px #ccc;
  background-color: #f7f7f7;
  border-radius: 3px;
  clear: both;
  line-height: 1.4em;
}

/*商品名*/
.code_message .text .item_name {
  color: #448833;
  margin-left: 5px;
  margin-right: 5px;
}

/*
お買い物を続ける リンク
====================================================================================================
*/
.continuance_wrap {
  margin-top: 20px;
}

.continuance .row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.continuance .col-1,
.continuance .col-2 {
  flex: 1;
}

.continuance a {
  position: relative;
  display: block;
  width: 100%;
  padding: 5px;
  border: 1px solid #bbb;
  border-radius: 4px;
  color: #333;
  font-size: 12px;
  line-height: 30px;
  text-align: center;
  text-decoration: none;
}

@media (min-width: 414px) {
  .continuance a {
    font-size: 14px;
  }
}
.continuance a .icon_back {
  left: 5%;
  margin-top: -2px;
}

/* 2018年3月更改にて追記 */
/*
 管理画面から出力したカート画面の説明文章
 --------------------------------------------------
 */
.order-cart .page_info {
  margin-top: 35px;
  margin-bottom: 15px;
}

.order-cart .page_info p {
  font-size: 16px;
}

/*
 上部商品総合計表示
 --------------------------------------------------
 */
.amount_info-upper img {
  max-width: 100%;
}

.amount_info-upper p {
  font-size: 24px;
  font-weight: bold;
}

.amount_info-upper .price {
  color: #f93b91;
  font-size: 24px;
}

.amount_info-upper .btn_do_next {
  width: 100%;
  height: 52px;
  box-sizing: border-box;
  font-size: 21px;
  font-weight: bold;
}

@media (max-width: 320px) {
  .amount_info-upper p {
    font-size: 17px;
  }
  .amount_info-upper .price {
    font-size: 17px;
  }
  .amount_info-upper .btn_area {
    padding: 10px 0 15px;
  }
  .amount_info-upper .btn_do_next {
    height: 45px;
    font-size: 17px;
  }
}
/*
 カート投入商品
 --------------------------------------------------
 */
.cart_item_list {
  border-bottom: 1px solid #ccc;
}

.cart_item {
  padding: 20px 0;
  border-top: 1px solid #ccc;
}
@media (min-width: 600px) {
  .cart_item .col-1 {
    float: left;
    width: 25%;
  }
  .cart_item .col-2 {
    float: left;
    width: 75%;
    padding-left: 8px;
    box-sizing: border-box;
  }
}
@media (max-width: 599px) {
  .cart_item .col-2 {
    margin-top: 0.6em;
  }
}

.cart_item .item_name {
  margin-top: 0;
  color: #000;
  font-size: 17px;
  font-weight: bold;
  text-decoration: none;
}

.cart_item .item_name a {
  color: #000;
  font-size: 19px;
  font-weight: bold;
  text-decoration: none;
}

@media (max-width: 320px) {
  .cart_item .item_name a {
    font-size: 16px;
  }
}
.cart_item .item_quantity {
  margin-top: 20px;
}
.cart_item .item_quantity input[type=number] {
  width: 100%;
}
@media (max-width: 599px) {
  .cart_item .item_quantity input[type=number] {
    max-width: 70px;
  }
}
.cart_item .item_quantity .btn-next {
  padding: 0.3em 1em;
}

.cart_item .item_quantity-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.cart_item .item_quantity-col-1 {
  width: 50px;
  line-height: 30px;
}

.cart_item .item_quantity-col-2 {
  padding-right: 5px;
  box-sizing: border-box;
  line-height: 30px;
}

.cart_item .item_quantity-col-3 {
  line-height: 30px;
}

.cart_item .item_quantity-col-4 {
  width: 80px;
  line-height: 30px;
}

.cart_item .item_quantity .form_text {
  text-align: right;
}

.cart_item .item_quantity .btn_delete {
  width: 100%;
  height: 30px;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
  box-sizing: border-box;
  color: #333;
  font-size: 12px;
  line-height: 30px;
  text-align: center;
}

/*
【inc】 短縮決済動線のCSS
====================================================================================================
inc-order_procedure.css
----------------------------------------------------------------------
短縮決済における、決済動線の表示（※買い物カゴのページは含まない）
*/
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

/*金額の場合の共通スタイル*/
.price {
  text-align: right;
}

/*割引の場合の共通テキスト色*/
.discount {
  color: #663300;
}

/*
テキストリンクの上書き
*/
a {
  color: #0099EE;
  text-decoration: underline;
}

/*
短縮決済ページのカラム設定／.area_order
====================================================================================================
個別指定は`<body class="">`のclassの値から指定する。
通常決済全域は`.area_cart`　ステップごとに異なるclassが追加される
classの命名、内容はシステム制御
*/
/*
決済動線のヘッダー／.secondary_header
====================================================================================================
決済動線に移った時のヘッダー
*/
.site_header {
  max-height: 9999px;
}

/*ヘッダー枠／.secondary_header*/
.site_header .secondary_header {
  background: #FFF;
  border-top: solid 1px #fff;
  padding-bottom: 15px;
}

.site_header .secondary_header:after {
  content: "";
  display: block;
  clear: both;
}

/*ロゴマーク／.secondary_header .branding*/
.site_header .secondary_header .branding {
  padding: 12px 0 0 5px;
}

/*h1*/
.site_header .secondary_header h1 {
  float: left;
  color: #666;
  padding-top: 20px;
  margin: 0 20px 0 15px;
  font-weight: normal;
  text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.6);
}

/*ログインユーザー名*/
.site_header .secondary_header .user_name {
  clear: both;
  margin-top: 25px;
  padding: 5px 20px 0 15px;
}

/* 決済導線内ではサイトヘッダー固定を解除 */
body.order-customer, body.order-delivery, body.order-payment, body.order-confirm, body.order-end, body.order-error {
  padding-top: 0 !important;
}
body.order-customer .site_header, body.order-delivery .site_header, body.order-payment .site_header, body.order-confirm .site_header, body.order-end .site_header, body.order-error .site_header {
  position: static;
  height: auto;
}

/*
決済ステップナビゲーション／.step_nav
====================================================================================================
*/
/*ステップナビゲーション領域*/
.step_nav {
  padding-top: 5px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #ccc;
  box-shadow: 0px 1px 0px 0px rgba(100, 100, 100, 0.1);
}

/*タイトル*/
.step_nav .title {
  display: none;
}

.step_nav ol {
  list-style-type: none;
  padding: 10px 5%;
}

/*リスト*/
.step_nav li {
  clear: both;
  line-height: normal;
  background-repeat: no-repeat;
  background-position: left center;
  margin-bottom: 5px;
}

.step_nav li .step {
  border: 1px solid #ccc;
  padding: 0 5px;
  margin-right: 8px;
  background: #f7f7f7;
  font-size: 116%;
  font-family: Arial, Helvetica, sans-serif;
  text-shadow: 0px 1px 0px #eee;
  color: #777;
}

.step_nav li.active .step {
  background: #e6f0a3; /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U2ZjBhMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2Q5ZTU2ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iI2M5ZGI0NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkYmYwNDMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top, #e6f0a3 0%, #d9e56e 50%, #c9db46 51%, #dbf043 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e6f0a3), color-stop(50%, #d9e56e), color-stop(51%, #c9db46), color-stop(100%, #dbf043)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #e6f0a3 0%, #d9e56e 50%, #c9db46 51%, #dbf043 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #e6f0a3 0%, #d9e56e 50%, #c9db46 51%, #dbf043 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #e6f0a3 0%, #d9e56e 50%, #c9db46 51%, #dbf043 100%); /* IE10+ */
  background: linear-gradient(to bottom, #e6f0a3 0%, #d9e56e 50%, #c9db46 51%, #dbf043 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e6f0a3", endColorstr="#dbf043",GradientType=0 ); /* IE6-8 */
  color: #111;
  border: 1px solid #AABE1F;
  box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, 0.3), 0px 0px 8px rgba(55, 55, 55, 0.3); /*外シャドウ*/
}

.step_nav li .text {
  font-size: 116%;
}

.step_nav li.active .text {
  color: #FF6600;
}

/*
上書き分の共通設定
====================================================================================================
*/
/*タイトル*/
.section_title {
  margin: 1em 0 0.6em;
}
.section_title h2 {
  font-weight: bold;
}

.confirm .section_title {
  padding-top: 30px;
  margin-bottom: 15px;
  clear: both;
}

.confirm h2 {
  background-color: #555;
  color: #fff;
  padding: 10px;
}

.confirm h3 {
  margin-bottom: 10px;
}

/*テーブル*/
table {
  margin-top: 5px;
  margin-bottom: 15px;
}

/*チェック項目*/
.check_cell {
  float: left;
  margin-right: 10px;
}

/*送信ボタンエリア*/
.order-customer, .order-delivery, .order-payment, .order-confirm, .order-end, .order-error {
  /*送信ボタン*/
}
.order-customer .btn_area, .order-delivery .btn_area, .order-payment .btn_area, .order-confirm .btn_area, .order-end .btn_area, .order-error .btn_area {
  padding-bottom: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 2em;
}
@media (max-width: 600px) {
  .order-customer .btn_area, .order-delivery .btn_area, .order-payment .btn_area, .order-confirm .btn_area, .order-end .btn_area, .order-error .btn_area {
    flex-direction: column-reverse;
  }
}
.order-customer .btn_area .btn, .order-delivery .btn_area .btn, .order-payment .btn_area .btn, .order-confirm .btn_area .btn, .order-end .btn_area .btn, .order-error .btn_area .btn {
  width: 100%;
  padding: 0.4em 1em;
  box-shadow: none;
  text-align: center;
  flex: 1;
}

.order-customer .btn_area .btn .icon, .order-delivery .btn_area .btn .icon {
  margin-left: 0.4em;
}

/*商品情報（商品項目）
------------------------------------------------------------
*/
.item_data {
  display: block;
}

/*tableとセルの共通スタイリング
----------------------------------------------------------------------
*/
/*table*/
.order-customer, .order-delivery, .order-payment, .order-confirm {
  /*th、td（全体に対するスタイリング）*/
  /*thに対するスタイリング*/
}
.order-customer table, .order-delivery table, .order-payment table, .order-confirm table {
  border-collapse: collapse;
  width: 100%;
  border: solid 1px #aaa;
  border-bottom: none;
}
.order-customer table th,
.order-customer table td, .order-delivery table th,
.order-delivery table td, .order-payment table th,
.order-payment table td, .order-confirm table th,
.order-confirm table td {
  float: left;
  width: 100%;
  clear: both;
  border-bottom: solid 1px #aaa;
  padding: 15px 5%;
  vertical-align: middle;
}
.order-customer table th .text,
.order-customer table td .text, .order-delivery table th .text,
.order-delivery table td .text, .order-payment table th .text,
.order-payment table td .text, .order-confirm table th .text,
.order-confirm table td .text {
  display: inline-block;
  min-height: 1em;
}
.order-customer table th .text_description,
.order-customer table td .text_description, .order-delivery table th .text_description,
.order-delivery table td .text_description, .order-payment table th .text_description,
.order-payment table td .text_description, .order-confirm table th .text_description,
.order-confirm table td .text_description {
  clear: both;
}
.order-customer table th, .order-delivery table th, .order-payment table th, .order-confirm table th {
  background: #f4f4f4;
  vertical-align: middle;
  box-shadow: inset 1px 1px 0px rgba(255, 255, 255, 0.9);
  font-weight: normal;
}
.order-customer table .line_thead th, .order-delivery table .line_thead th, .order-payment table .line_thead th, .order-confirm table .line_thead th {
  background-color: #e9e9e9;
}
.order-customer table .line_tbody th, .order-delivery table .line_tbody th, .order-payment table .line_tbody th, .order-confirm table .line_tbody th {
  text-align: left;
}
.order-customer table .inner:after, .order-delivery table .inner:after, .order-payment table .inner:after, .order-confirm table .inner:after {
  content: "";
  display: inline-block;
  min-height: 1em;
}

/*
ポイントのご利用・お支払い方法の変更画面のポイント表示
*/
/*
保有ポイントのボックス／.cart_saving_point
====================================================================================================
*/
.payment_saving_point--inner .figure {
  font-size: 0.22rem;
  margin-right: 0.05rem;
  font-weight: bold;
}
.payment_saving_point--inner:after {
  display: none;
}

.payment_saving_point--expire {
  color: #999;
  font-size: 15px;
}

.payment_saving_point--alert {
  padding: 0.6em;
  margin: 1.4em 0 0.6em;
  border: 1px solid #e80e0e;
  border-radius: 3px;
  color: #e80e0e;
}

/*
確認ページ／.confirm
====================================================================================================
*/
.confirm.amount_info th,
.confirm.amount_info td {
  border-bottom: solid 1px #aaa;
  float: none;
}

.confirm.amount_info th {
  text-align: left;
}
@media screen and (min-width: 375px) {
  .confirm.amount_info th {
    width: 30%;
  }
}

.confirm.amount_info .price,
.confirm.amount_info .use_point {
  text-align: right;
}

/*注文商品の確認／.confirm.item_list
----------------------------------------------------------------------
*/
/*テーブルのスタイリング*/
.confirm.item_list th,
.confirm.item_list td {
  float: none;
  padding: 8px;
  border-bottom: solid 1px #aaa;
}

.confirm.item_list table {
  margin-bottom: 15px;
}

.confirm.item_list th,
.confirm.item_list td {
  border-bottom: solid 1px #aaa;
  padding: 15px 2%;
  vertical-align: middle;
}

.confirm.item_list th {
  text-align: left;
  background: #f4f4f4;
  vertical-align: middle;
  box-shadow: inset 1px 1px 0px rgba(255, 255, 255, 0.9);
  font-weight: normal;
}
@media screen and (min-width: 375px) {
  .confirm.item_list th {
    width: 30%;
  }
}

.confirm.item_list .price {
  text-align: right;
}

.confirm.item_list .item_count {
  text-align: right;
}

/*画像*/
.confirm.item_list .c_h2 .item_image {
  width: 180px;
  height: auto;
  padding-bottom: 0;
}

/*商品名*/
.confirm.item_list .c_h2 .item_name {
  width: 100%;
  line-height: 1.6em;
}

/*バリエーションの種類表示*/
.confirm.item_list .c_h2 .item_variation {
  display: block;
  line-height: 1.6em;
  margin-top: 10px;
}

/*合計金額の確認／.confirm.amount_info
----------------------------------------------------------------------
*/
.confirm.amount_info .price,
.confirm.amount_info .use_point {
  text-align: right;
}

.confirm.amount_info .amount_detail {
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.3;
}

/*取得ポイントのご確認／.confirm.get_point
----------------------------------------------------------------------
*/
/*お支払方法の確認／.confirm.payment
----------------------------------------------------------------------
*/
.confirm.payment .cart_saving_point {
  margin-bottom: 20px;
}
.confirm.payment .cart_saving_point--inner {
  padding: 24px 5% 15px;
  border-radius: 0;
}

.confirm.payment .btn {
  display: block;
  margin: 20px auto 0;
  text-align: center;
}

/*お客様情報のご確認／.confirm.user_info
----------------------------------------------------------------------
*/
.confirm.user_info .btn {
  display: block;
  margin: 20px auto 0;
  text-align: center;
}

/*配送先のご確認／.confirm.delivery
----------------------------------------------------------------------
*/
.confirm.delivery .btn {
  display: block;
  margin: 20px auto 0;
  text-align: center;
}

/*備考入力欄／.data_input.user_comment
----------------------------------------------------------------------
*/
.order-confirm .sys_msg {
  margin-top: 20px;
  margin-bottom: 10px;
}

/*
## 配送方法エラーメッセージ
*/
.mailpack_status_detail li {
  color: #FF0004;
  font-size: 120%;
  line-height: 1.5;
  margin-bottom: 15px;
}

/*
## 商品の配送方法 (150421改修のため追記)
*/
.mailpack_select_radio .text_description {
  margin-top: 10px;
  font-size: 110%;
}

.mailpack_select_button {
  margin: 15px 0;
  text-align: center;
}

.mailpack_select_button .alert-reflect {
  font-size: 115%;
  color: #DC5059;
  line-height: 1.5;
  margin-bottom: 15px;
}

.c_mailpack_limit .c_h2,
.c_mailpack_description .c_h2 {
  padding-bottom: 0;
}

.c_mailpack_limit h4,
.c_mailpack_description h4 {
  margin-bottom: 12px;
  font-size: 110%;
  color: #DC5059;
}

.c_mailpack_limit div.mailpack {
  margin: 0 12px 17px 12px;
}

.c_mailpack_limit ul.mailpack {
  margin: 0 12px 17px 12px;
}

.c_mailpack_limit ul.mailpack li {
  margin-bottom: 10px;
  margin-left: 15px;
  list-style-type: disc;
}

.c_mailpack_description .c_h2 div {
  margin: 0 12px 17px 12px;
}

.c_mailpack_description .c_h2 ul {
  margin: 0 12px 17px 12px;
  list-style-type: disc;
}

.c_mailpack_description .c_h2 li {
  margin-bottom: 10px;
  margin-left: 15px;
  list-style-type: disc;
}

label.status_enabled {
  line-height: 1.5;
}

label.status_enabled.active {
  color: #FF178F;
}

/*
お客様情報の入力／.data_input.user_info
====================================================================================================
*/
.data_input label.error {
  color: #FF3333;
}

/*タイトル*/
.title_box {
  background-color: #555;
  margin-top: 30px;
  padding: 0 15px;
  height: 40px;
  margin-bottom: 10px;
}

.title_box h2 {
  color: #fff;
  height: 40px;
  line-height: 40px;
}

/*通常ログイン／.login_box.basic .input_box
----------------------------------------------------------------------
*/
.login_box.basic .input_box {
  background-color: #F5F5F5;
  border: 1px solid #CDCDCD;
  border-radius: 8px;
  padding: 25px;
}

/*入力ボックス*/
.login_box.basic .input_box {
  margin-top: 10px;
  margin-bottom: 20px;
}

/*タイトル*/
.input_box dt {
  clear: both;
  margin-bottom: 5px;
}

/*データ*/
.input_box dd {
  clear: both;
  margin-bottom: 20px;
}

/*タイトル 項目名*/
.input_box dt .title {
  font-weight: bold;
  font-size: 108%;
}

/*タイトル 説明*/
.input_box dt .description {
  color: #999;
  margin-top: 5px;
  margin-left: 10px;
  font-size: 93%;
}

.input_box dd .form_text {
  width: 100%;
}

/*ボタンのエリア*/
.input_box .btn_area {
  float: left;
  padding: 0;
}

/*ボタンのスタイル上書き*/
.input_box .btn_area .btn {
  height: 34px;
  line-height: 34px;
}

.input_box .forget {
  clear: both;
  padding-top: 20px;
}

/*SNS連携ログイン／.login_box.social
----------------------------------------------------------------------
*/
.login_box.social .input_box {
  margin-top: 20px;
}

/*変更ボタンのアイコン*/
.confirm .btn .icon {
  display: none;
}

/*
変更ボタン
====================================================================================================
*/
.col_main .btn_change {
  border: 1px solid #7C9876;
  text-shadow: none;
  background: #eaefc2; /* Old browsers */
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: #F93B91;
  color: #FFF;
  padding: 0 2em;
}

.col_main .btn_back {
  height: 42px;
  line-height: 42px;
  text-shadow: none;
  padding: 0px 0.5em;
  box-shadow: none;
  border: 1px solid #888;
  text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.4);
  background: none repeat scroll 0% 0% #000;
  color: #FFF;
}

.icon_back {
  display: none;
}

.col_main .btn_do_next {
  border: 1px solid #7C9876;
  background: #eaefc2; /* Old browsers */
  text-shadow: none;
  /* IE9 SVG, needs conditional override of 'filter' to 'none' */
  background: #F93B91;
  color: #FFF;
  padding: 0 2em;
}

/*
配送先指定／.data_input.delivery
====================================================================================================
*/
/*
ポイント使用と変更／.data_input.point_info
====================================================================================================
*/
.data_input.use_point .form_text {
  width: 35%;
  padding-right: 5px;
  text-align: right;
}

.data_input.use_point tr:last-child .c_h2 .inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.data_input.use_point tr:last-child .c_h2 .inner .btn {
  font-size: 0.15rem;
  margin-left: 0.4em;
  padding: 0.4em 0.8em;
}

/*
支払い方法の選択／.data_input.payment
====================================================================================================
*/
/*入れ子テーブルのセル*/
.data_input.payment table table .line_tbody .c_h1 {
  padding: 10px;
  vertical-align: middle;
}

.data_input.payment table table .line_tbody .c_h2 {
  padding: 10px;
}

/*支払い方法*/
.data_input.payment .select_box table {
  box-shadow: 0 1px 3px rgba(10, 10, 10, 0.1);
}

.data_input.payment .select_box th {
  vertical-align: top;
}

.data_input.payment .select_box th label {
  display: block;
  padding: 10px 0 10px 10px;
}

.data_input.payment .select_box .payment_comment {
  color: #FF6600;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: dotted 1px #999;
}

.data_input.payment .select_box .payment_description {
  padding-top: 5px;
  padding-bottom: 8px;
  padding-left: 10px;
  line-height: 1.7em;
}

.order-delivery .form select,
.order-payment .form select {
  display: inline-block;
  width: auto;
}
.order-delivery .form input[type=text], .order-delivery .form input[type=email], .order-delivery .form input[type=tel], .order-delivery .form input[type=number], .order-delivery .form input[type=password], .order-delivery .form textarea,
.order-payment .form input[type=text],
.order-payment .form input[type=email],
.order-payment .form input[type=tel],
.order-payment .form input[type=number],
.order-payment .form input[type=password],
.order-payment .form textarea {
  max-width: 400px;
}

.order-customer .form .user_info select {
  display: inline-block;
  width: auto;
}
.order-customer .form .user_info input[type=text], .order-customer .form .user_info input[type=email], .order-customer .form .user_info input[type=tel], .order-customer .form .user_info input[type=number], .order-customer .form .user_info input[type=password], .order-customer .form .user_info textarea {
  max-width: 400px;
}

.order-payment-input .referrer_error_guide {
  margin-top: 20px;
}

.order-payment-input .referrer_error_guide--body {
  display: none;
  padding: 10px 14px;
  border: 1px solid #ccc;
}

.order-payment-input .referrer_error_guide--btn {
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0.5em 0.7em;
  border: 2px solid #f00;
  border-radius: 4px;
  color: #f00;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
}

@media (min-width: 540px) {
  .order-payment-input .referrer_error_guide--btn {
    font-size: 16px;
  }
}
@media (max-width: 413px) {
  .order-payment-input .referrer_error_guide--btn {
    font-size: 16px;
  }
}
@media (max-width: 374px) {
  .order-payment-input .referrer_error_guide--btn {
    font-size: 12px;
  }
}
.order-payment-input .referrer_error_guide--btn .icon {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
}

.order-payment-input .referrer_error_guide .text_box {
  line-height: 1.6;
}

.order-payment-input .referrer_error_guide .text_box p + p {
  margin-top: 0.4em;
}

.order-payment-input .referrer_error_guide h3 {
  margin: 0.6em 0 0.4em;
  font-size: 20px;
}

.order-payment-edit .referrer_error_guide {
  margin-top: 20px;
}

.order-payment-edit .referrer_error_guide--body {
  display: none;
  padding: 10px 14px;
  border: 1px solid #ccc;
}

.order-payment-edit .referrer_error_guide--btn {
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0.5em 0.7em;
  border: 2px solid #f00;
  border-radius: 4px;
  color: #f00;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
}

@media (min-width: 540px) {
  .order-payment-edit .referrer_error_guide--btn {
    font-size: 16px;
  }
}
@media (max-width: 413px) {
  .order-payment-edit .referrer_error_guide--btn {
    font-size: 16px;
  }
}
@media (max-width: 374px) {
  .order-payment-edit .referrer_error_guide--btn {
    font-size: 12px;
  }
}
.order-payment-edit .referrer_error_guide--btn .icon {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
}

.order-payment-edit .referrer_error_guide .text_box {
  line-height: 1.6;
}

.order-payment-edit .referrer_error_guide .text_box p + p {
  margin-top: 0.4em;
}

.order-payment-edit .referrer_error_guide h3 {
  margin: 0.6em 0 0.4em;
  font-size: 20px;
}

/*
## 支払い方法の最終確認
*/
.current_payment--inner {
  border: solid 5px #D2D2D2;
  padding: 10px;
  margin: 30px auto;
  text-align: center;
}

.current_payment span {
  font-size: 120%;
  font-weight: bold;
}

.current_payment span.separate {
  display: none;
}

.current_payment span.value {
  color: #FF0000;
  font-size: 150%;
  display: block;
  margin-top: 8px;
}

/*
最終画面
====================================================================================================
*/
.order-end .col_main {
  padding-bottom: 30px;
}

.order-end .share-twitter {
  margin: 0 10px;
}
.order-end .share-twitter iframe {
  vertical-align: bottom;
}

/*
完了画面
====================================================================================================
*/
/*商品情報／.item_list
----------------------------------------------------------------------
*/
.order-end div.item_name {
  padding-bottom: 10px;
}

/*
追加
====================================================================================================
*/
/*選択した支払い方法のボックスを目立たせる*/
/*.active-payment_box　はjsにより動的に付与される*/
table.active-payment_box {
  border: 1px solid #ED0C99;
  box-shadow: 0 0px 0px 1px #fff, 0 1px 14px rgba(10, 10, 10, 0.7);
}

.payment_var .c_h1 .select_box label {
  display: block;
  border-radius: 4px;
  cursor: pointer;
}

.payment_var .c_h1 .select_box label:hover {
  background: #ddd;
  color: #111;
}

/*.active-payment_label　はjsにより動的に付与される*/
.payment_var .active-payment_label {
  background: #f93b91;
  font-weight: bold;
  color: #fff;
}

.payment_var .c_h1 .select_box label.active-payment_label:hover {
  background: #f93b91;
  font-weight: bold;
  color: #fff;
}

/* キャンペーン商品用見出し */
.cart_item_list--headline {
  margin-bottom: 10px;
  padding-left: 5px;
  border-left: 5px solid #999;
  font-size: 20px;
}

/*
キャンペーンメッセージ
==================================================
キャンペーン商品が選択されていない場合に確認画面上部に表示されるメッセージ
*/
.campaign_message {
  margin-top: 25px;
  border: 4px solid #FFC8A4 !important;
  background-color: #FFFEFB;
  border-radius: 10px;
}

.campaign_message--header {
  padding: 20px 15px 22px;
  border-bottom: 1px solid #FFC8A4;
}

.campaign_message--body {
  padding: 20px 15px 22px;
}

.campaign_message--footer {
  padding: 0 15px 22px;
  text-align: center;
}

.campaign_message--footer .btn {
  width: 100%;
  margin: auto;
  box-sizing: border-box;
}

.campaign_message--heading {
  margin: 0;
  padding: 0;
  color: #FF6600;
  text-align: center;
}

.campaign_message--heading .title {
  font-size: 15px;
}

/*----------------------------------------------------
	LINE ID 連携特設ページ
----------------------------------------------------*/
.line_id_linked {
  width: 100%;
  font-size: 16px;
  margin-top: 40px;
}

.line_id_linked .main-image {
  margin-bottom: 50px;
  text-align: center;
}

/* ページ内共通見出し */
.line_id_linked--heading {
  width: 100%;
  margin-bottom: 40px;
  text-align: center;
}

.line_id_linked--heading h2 {
  font-size: 26px;
  font-weight: bold;
}
@media (min-width: 600px) {
  .line_id_linked--heading h2 br {
    display: none;
  }
}

.line_id_linked--heading .supplement_text {
  font-size: 16px;
  margin-top: 5px;
}

/*

.link_id_linked-information　※お得で便利なLINE連携のご案内　のカラム） 

*/
.link_id_linked-information {
  margin-bottom: 60px;
}

/* .lead（LINE ID 連携でお買い物がお得　ログインが簡単） */
.link_id_linked-information .lead {
  margin: 0 auto 50px;
  text-align: center;
}

.link_id_linked-information .linked_text .subtitle {
  font-size: 30px;
  font-weight: bold;
  color: #00B300;
  margin-bottom: 20px;
}

.link_id_linked-information .linked_text .subtext {
  font-size: 24px;
}

/* .linked-benefits（特典） */
.link_id_linked-information .linked-benefits-inner {
  width: 96%;
  min-height: 240px;
  margin: 0 auto 16px;
  padding: 2%;
  border: solid 2px #00C300;
}

.link_id_linked-information .linked-benefits-inner .title {
  width: 100%;
  margin-bottom: 16px;
  padding: 8px 0 4px;
  background-color: #00C300;
  text-align: center;
}

.link_id_linked-information .linked-benefits-inner .title h3 {
  color: #FFFFFF;
  font-weight: bold;
  line-height: 1;
  font-size: 24px;
}

.link_id_linked-information .linked-benefits-inner .detail h4 {
  font-size: 24px;
  text-align: center;
  margin-bottom: 16px;
}

.link_id_linked-information .linked-benefits-inner .detail h4 span.new_line {
  display: block;
  line-height: 1.6;
}

.link_id_linked-information .linked-benefits-inner .detail p {
  line-height: 1.5;
}

.link_id_linked-information .linked-benefits-inner .detail .point-red {
  font-weight: bold;
  color: #FF0000;
}

.link_id_linked-information .linked-benefits-inner .detail .notice {
  font-size: 12px;
  line-height: 0.8;
}

/* 

.link_id_linked-steps ※LINE ID 連携は以下の2ステップで完了!のカラム※

*/
.link_id_linked-steps {
  margin-bottom: 60px;
}

/* .link_id_linked-steps--title（タイトル） */
.link_id_linked-steps--title {
  border-bottom: solid 1px #8B8A8A;
  padding-bottom: 28px;
  margin-bottom: 28px;
  text-align: center;
}

.link_id_linked-steps--title h3 {
  font-size: 24px;
}

/* .link_id_linked-steps--detail（詳細） */
.link_id_linked-steps--detail {
  margin-bottom: 80px;
}

.link_id_linked-steps--detail p {
  margin-bottom: 40px;
  font-size: 20px;
  line-height: 1.6;
}

/* .line_friend-btn_qr  STEP1 友だち追加のLINE追加ボタンとQRコード */
.line_friend-btn_qr {
  text-align: center;
  margin: 0 auto 30px;
}

.line_friend-btn_qr .line_friend-btn {
  margin-bottom: 40px;
}

.line_friend-text {
  text-align: center;
}

/* 

.mail_magazine ※お得で楽しいメルマガのご案内のカラム※

*/
.mail_magazine--main_image-mb {
  margin-bottom: 50px;
  text-align: center;
}

.mail_magazine--main_image-mb img {
  width: 60%;
}

.mail_magazine--main_image-pc {
  display: none;
}

.mail_magazine--detail p {
  font-size: 20px;
  margin-bottom: 25px;
}

.order_login_email--form .text-small {
  padding-left: 1em;
  font-size: 0.14rem;
}

.order_login_email--form--wrapper {
  max-width: 504px;
  margin: 0 auto;
}
@media screen and (min-width: 1024px) {
  .order_login_email--form--wrapper {
    max-width: 572px;
  }
}
.order_login_email--form--wrapper .forget {
  text-align: center;
  margin-top: 30px;
}
.order_login_email--form--wrapper .forget a {
  text-decoration: underline;
}
.order_login_email--form--wrapper .forget a:hover {
  text-decoration: none;
}

.order_login_email .form--container {
  padding-left: 18px;
  padding-right: 18px;
}
@media screen and (min-width: 1024px) {
  .order_login_email .form--group {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: 2%;
  }
}
@media screen and (min-width: 1024px) {
  .order_login_email .form--group .form_text--wrapper {
    width: 100%;
    max-width: 330px;
  }
}
.order_login_email .text_box {
  margin-bottom: 20px;
}
@media screen and (min-width: 1024px) {
  .order_login_email .text_box {
    font-size: 0.18rem;
  }
}
@media screen and (min-width: 1280px) {
  .order_login_email .text_box {
    font-size: 0.2rem;
  }
}

.purchased_item_list {
  margin-top: 30px;
}

.purchased_item_list--item {
  border-bottom: 1px solid #DEDEDE;
  margin-bottom: 20px;
  padding-bottom: 20px;
}
.purchased_item_list--item:first-child {
  border-top: 1px solid #DEDEDE;
  padding-top: 20px;
}

.purchased_item_list--item--inner {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 10px;
}
.purchased_item_list--item--inner .image {
  width: 130px;
}
@media (min-width: 600px) {
  .purchased_item_list--item--inner .image {
    width: 200px;
  }
}
.purchased_item_list--item--inner .name {
  flex: 1;
}

.purchased_item_list--sns {
  margin-top: 5px;
}

/*# sourceMappingURL=order.css.map */