@charset "UTF-8";
/* ---------------------------------------------------------------------------
  購入までの流れ共通部品
--------------------------------------------------------------------------- */
.c_37Box li {
  display: flex;
  justify-content: space-between;
}

.c_37Box li > div:nth-child(1) {
  width: 166px;
}

.column03_fix .c_37Box li > div:nth-child(1) {
  width: 25%;
}

.column03_fix .c_37Box li > div:nth-child(2) {
  width: 70%;
}

select#pet-select {
  display: inline;
  width: 55px;
  padding: 0;
  margin-left: 6px;
}

.thumbnailArea {
  display: flex;
}

.thumbnailArea > div {
  margin-right: 10px;
  width: 75px;
}

.thumbnail .c_imgBox {
  margin-right: 10px;
}

.thumbnail .slick-active {
  position: relative;
  transition: 0.2s;
}

.thumbnail .slick-active:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  z-index: 9;
  box-sizing: border-box;
}

.thumbnail .slick-current:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  border: 0px solid #b0b0b0;
  background: none;
}

.c_37Box .tit {
  line-height: 100%;
}

.c_37Box .tit a {
  width: 13px;
  display: inline-block;
  position: relative;
  top: 2px;
}

.openBox {
  display: none;
}

.openBox img {
  width: 100%;
  margin-bottom: 10px;
}

.column03_box01 .btn01 {
  margin: 5em auto 0;
  text-align: center;
}

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

.suuryou input {
  width: 4em;
  margin-left: 5px;
}

.suuryou .f10 {
  position: relative;
  top: 4px;
  margin-left: 10px;
}

/* ---------------------------------------------------------------------------
カート確認画面 / 共通
--------------------------------------------------------------------------- */
.order_confirmation .borderBox {
  border: 1px solid #f1f1f1;
  padding: 10px;
  border-radius: 0.2em;
}

.order_confirmation .borderBox > div:not(:last-child) {
  border-bottom: 1px solid #f1f1f1;
  padding-bottom: 12px;
}

/* ================================================
    index85(配送　お支払い情報の入力)
================================================ */
#index85 .pointArea input[type=text] {
  width: 70px;
  display: inline;
}

#index85 .cuponArea input[type=text] {
  width: 170px;
  display: inline-block;
  padding: 4px 12px 4px;
}

#index85 .cuponArea input[type=submit] {
  display: initial;
  font-size: 12px;
}

@media (min-width: 901px) and (min-width: 0px) {
  /* ---------------------------------------------------------------------------
  購入までの流れ共通部品(PC)
  --------------------------------------------------------------------------- */
  .column03_box01 {
    width: 61%;
  }

  .column03_fix {
    position: sticky;
    top: 30px;
    float: right;
    width: 33.5%;
    max-width: 336px;
    background: #f1f1f1;
    padding: 2.5em;
  }

  .c_37Box li > div:nth-child(2) {
    width: calc(100% - 195px);
    display: flex;
    justify-content: space-between;
  }

  /* ---------------------------------------------------------------------------
    カート確認画面 / 共通(PC)
  --------------------------------------------------------------------------- */
  .order_confirmation .sec02 {
    background: #f1f1f1;
    padding: 2em 0;
    border-bottom: 1px solid #e3e3e3;
  }

  .order_confirmation .sec02 ul.cl50 li:nth-child(2n) {
    margin-right: 0;
  }

  .order_confirmation .sec02 .c_37Box li > div:nth-child(1) {
    width: 122px;
  }

  .order_confirmation .sec02 .c_37Box li > div:nth-child(2) {
    width: calc(100% - 147px);
  }

  .order_confirmation .sec02 ul.cl50 > li {
    padding: 1.5%;
    background: #FFF;
    width: 49%;
    margin-right: 2%;
    margin-bottom: 2% !important;
  }

  .order_confirmation .borderBox {
    padding: 20px !important;
  }

  .order_confirmation .borderBox > div {
    display: flex;
  }

  .order_confirmation .borderBox > div h3 {
    width: 92px;
  }

  .order_confirmation .borderBox > div > div {
    padding-top: 3px;
  }
}
@media (max-width: 900px) and (min-width: 0px) {
  /* ---------------------------------------------------------------------------
  購入までの流れ共通部品(SP)
  --------------------------------------------------------------------------- */
  .column03_fix {
    margin-bottom: 26px;
  }

  .c_37Box li > div:nth-child(1) {
    width: 104px;
  }

  .c_37Box li > div:nth-child(2) {
    width: calc(100% - 118px);
  }

  .c_37Box .ad01 {
    display: flex;
    font-size: 12px !important;
    margin-top: 0% !important;
  }

  .c_37Box .ad01.actions {
    justify-content: space-between;
  }

  .c_37Box .ad01 li {
    margin-right: 7px;
  }

  .c_37Box p.red.f12,
.c_37Box p.red.f10 {
    font-size: 10px !important;
    line-height: 142%;
  }

  .c_37Box .tit {
    font-size: 3.5vw !important;
  }

  .c_37Box .sp_ad01 {
    font-size: 12px !important;
  }

  .c_37Box .sp_ad01 span {
    font-size: 10px !important;
  }

  .c_37Box p.price {
    font-size: 2.8vw !important;
    line-height: 100%;
  }

  .column03_fix .c_37Box p.price {
    margin-top: 7px;
  }

  .column03_fix .c_37Box > li {
    border-bottom: 1px solid #ececec;
    padding-bottom: 5%;
  }

  .column03_fix div#js-fix {
    width: 112%;
    position: relative;
    left: -6%;
    background: #fff;
    padding: 2% 7%;
  }

  div#js-fix.fixed {
    position: fixed;
    top: 0;
    z-index: 9;
    width: 100%;
    left: 0;
    padding: 2% 6%;
  }

  .column03_box01 .btn01 {
    margin: 3em auto 0;
  }

  .order_confirmation .sec02 {
    background: #f1f1f1;
    padding: 1.5em 0;
    border-bottom: 1px solid #e3e3e3;
  }

  .order_confirmation .sec02 .c_37Box > li {
    border-bottom: none;
    padding-bottom: 0;
  }

  .order_confirmation .sec02 .c_imgBox {
    background: #e4e4e4;
  }

  .order_confirmation .sec02 p.f12.gray {
    font-size: 10px !important;
  }
}

/* FIX: カートの商品にて編集や商品削除がstyles-m.cssで指定されたmarginによって発生するレイアウト崩れの対応（ヘッダーもmargin-bottomを0にした方がよい？）  */
.column03_box01 .c_37Box ul > li {
	margin: 0;
	padding: 0;
}
.column03_box01 .c_37Box ul > li * {
	width: auto;
}

/* FIX: カートの合計金額部分にてtableのpaddingがstyles-m.cssで指定されることで発生するレイアウト崩れの対応 */
.column03_fix table > thead > tr > th,
.column03_fix table > thead > tr > td,
.column03_fix table > tbody > tr > th,
.column03_fix table > tbody > tr > td {
	padding: 0;
	margin: 0;
}

/* FIX: カートの合計金額にて送料と税金の計算が必要な場合を考慮 */
.column03_fix #shipping-zip-form select {
	width: 100%;
}

/* FIX:  */
.btn01 a.disabled {
	background-color: #ccc;
}