﻿@charset "UTF-8";

/* ----------------------------------
 共通
---------------------------------- */
div.order_ .order_cart_reload_ { background: var(--bg-color-dark);}
div.order_ h2.common_headline2_ {
  width: auto;
  max-width: unset;
  min-height: 46px;
  padding: 10px 20px;
	margin: 0 auto 20px;
  border-radius: var(--border-radius-items);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.0;
}
div.order_ h2.common_headline2_::before { display: none;}

div.order_ div.spandual_ > table.formlist_ { margin: 0 0 20px;}

/* ----------------------------------
 購入フロー
---------------------------------- */
div.order_header_ { margin: 0; padding: 0; display: flex; flex-wrap: wrap; flex-direction: column-reverse;}
div.order_header_ div.order_flow_ { width: 100%; padding: 0; margin: 0 0 30px;}
div.order_header_ div.order_flow_ > ul { display: flex; justify-content: center; gap: 40px; overflow: inherit;}
div.order_header_ div.order_flow_ > ul > li {
  position: relative;
  width: 100%;
  padding: 15px 5px 13px;
	border-radius: var(--border-radius-items);
  font-size: 16px;
  font-weight: 700;
  color: var(--color-base);
  letter-spacing: 0;
  line-height: 1.5;
  text-align: center;
  white-space: nowrap;
  background-color: var(--bg-color-base);
	box-shadow: var(--box-shadow-blue-half);
}
div.order_header_ div.order_flow_ .txt-step { display: block; font-size: 12px;}
div.order_header_ div.order_flow_ .txt-name { display: block;}
div.order_header_ div.order_flow_ > ul > li.now_ { background-color: var(--color-link); color: #FFF;}
div.order_header_ div.order_flow_ > ul.for_estimate_ > li.now_ { background-color: var(--color-link); color: #FFF;}
div.order_header_ div.order_flow_ > ul > li::after {
  content: '';
  width: 10px;
  height: 10px;
  border-top: var(--color-gray) 2px solid;
  border-right: var(--color-gray) 2px solid;
  position: absolute;
  top: 50%;
  right: -22px;
  transform: translate3d(0, -50%, 0) rotate(45deg);
}
div.order_header_ div.order_flow_ > ul > li:last-child { margin-right: 0;}
div.order_header_ div.order_flow_ > ul > li:last-child::after { display: none;}

/* ----------------------------------
 カート
---------------------------------- */
div.order_ div.method_host_,
div.order_ div.order_cart_detail_,
div.order_ div.order_cart_sublist_ { padding: 0 15px 24px; border-radius: var(--border-radius-items); background: #FFF; box-shadow: var(--box-shadow-blue);}
div.order_ div.method_host_ > h2.common_headline2_,
div.order_ div.order_cart_detail_ > h2.common_headline2_,
div.order_ div.order_cart_sublist_ > h2.common_headline2_ { border-radius: var(--border-radius-items) var(--border-radius-items) 0 0; margin: 0 -15px 15px;}

div.order_ .order_cart_sublist_single_ { margin-bottom: 20px;}

/* 案件情報 */
div.order_ .host_info_ .host_btn_ { margin-bottom: 10px;}

/* 現在の配送先 */
div.order_ .method_host_ div.host_info_ .host_btn_ { width: 150px;}
div.order_ .method_host_ .host_address_ { padding: 20px; margin: 4px; border: var(--border-solid-base); border-radius: 3px;}
div.order_ .method_host_ .host_address_ .host_nickname_ { margin: 0 0 10px; font-size: 16px; font-weight: 700;}
div.order_ .method_host_ .host_address_ .address_ { margin: 0; font-size: 14px; font-weight: 500;}

/* 配送先一覧 */
div.order_ .order_cart_sublist_ .item_add_ { width: 150px;}
div.order_ .order_cart_sublist_ .item_add_ input { background: var(--bg-color-dark);}
div.order_ .order_cart_sublist_ ul.order_cart_sublist_destlist_ .item_ a .info_ {
	background-image: url("../../img/usr/common/ico_cart_blue.png");
	background-position: center left;
	-webkit-background-size: 16px auto;
	background-size: 16px auto;
	background-repeat: no-repeat;
}
div.order_ .order_cart_sublist_ ul.order_cart_sublist_destlist_ .item_.now_ a {
	border: var(--border-solid-blue);
  background-color: #dfe6f4;
}
div.method_address_ div.address_item_ { padding: 20px; border: none; border-radius: var(--border-radius-items); background: #FFF; box-shadow: var(--box-shadow-blue);}
div.method_address_ div.address_item_ + div.address_item_ { margin-top: 10px;}
div.method_address_ div.address_item_ address { width: 800px;}
div.method_address_ div.address_item_ .address_select_ { float: right;}
div.method_address_ div.address_item_ .address_select_ input {
	width: 60px;
  height: 34px;
  padding: 8px 12px;
  margin: 4px 8px 4px 0;
	border: var(--border-solid-blue);
  border-radius: 3px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.0;
	color: #FFF;
	background: var(--color-link);
  box-shadow: none;
	transition: var(--transition);
}
div.method_address_ div.address_item_ .address_select_ input:hover { border: var(--border-solid-sky); background: var(--color-hover); opacity: 1.0;}
div.method_address_ div.address_item_ .address_change_ { width: 120px; margin-top: 0;}
div.method_address_ div.address_item_ .address_change_ input {
	width: 110px;
  height: 34px;
  padding: 8px 12px;
  margin: 4px 0;
	border: var(--border-solid-blue);
  border-radius: 3px;
  font-size: 12px;
  font-weight: 500;
	text-decoration: none;
  line-height: 1.0;
	color: var(--color-link);
	background: #FFF;
  box-shadow: none;
	transition: var(--transition);
}
div.method_address_ div.address_item_ .address_change_ input:hover {
	border: var(--border-solid-sky);
	text-decoration: none !important;
	color: var(--color-hover) !important;
	opacity: 1.0 !important;
}

/* カート */
div.order_ div.order_cart_detail_ .order_cart_navi_ { text-align: right;}
div.order_ div.order_cart_detail_ .order_cart_navi_ a { font-size: 14px; font-weight: 500; text-decoration: underline;}
div.order_ div.order_cart_detail_ div.estimate_block_ { padding: 15px; border-radius: var(--border-radius-items); background: var(--bg-color-base);}
div.order_ div.order_cart_detail_ table.order_cart_list_ tr.goods_line_ { border: none;}
div.order_ div.order_cart_detail_ table.order_cart_list_ tr td { border-top: var(--border-solid-base); border-bottom: var(--border-solid-base);}
div.order_ div.order_cart_detail_ table.order_cart_list_ tr.cart_detail_zero_ td { background: #FFF;}
div.order_ div.order_cart_detail_ table.order_cart_list_ input.order_cart_qty_ { padding: 4px; text-align: center;}

/* 送り主 */
div.order_ div.method_sender_ .headline_ .headline_contents_ input[type="checkbox"] + label::before {
	content: '';
  width: 18px !important;
	min-width: 18px !important;
  height: 18px !important;
  margin: 0 5px 0 0;
  border: #C7E1F7 2px solid !important;
  border-radius: 3px !important;
  background-color: #FFF !important;
	background-image: var(--image-check-off) !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
  -webkit-background-size: 8px auto !important;
  background-size: 8px auto !important;
  position: absolute;
	left: 0;
  top: calc(50% - 9px);
	box-sizing: border-box;
}
div.order_ div.method_sender_ .headline_ .headline_contents_ input[type="checkbox"]:checked + label::before {
  border-color: #4481C9 !important;
	background-color: #4481C9 !important;
	background-image: var(--image-check-on) !important;
}
div.order_ div.method_sender_ #sender_form table.formdetail_.method_sender_ { width: 100%; margin: 15px 0;}

/* ----------------------------------
 ご注文内容・依頼内容の入力
---------------------------------- */
body.page-method div.order_ .common_headline2_,
body.page-e_method div.order_ .common_headline2_ { margin-bottom: 0; border-radius: var(--border-radius-items) var(--border-radius-items) 0 0;}
body.page-method div.order_ div.method_box_ > .common_headline2_,
body.page-e_method div.order_ div.method_box_ > .common_headline2_ { width: auto; max-width: unset; margin: 0 -15px 20px;}

.page-historydetail div.order_ table.method_ th,
.page-estimatedetail div.order_ table.method_ th,
.page-bizhistorydetail div.order_ table.method_ th,
.page-bizestimatedetail div.order_ table.method_ th,
.page-approvaldetail div.order_ table.method_ th,
.page-bizapprovaldetail div.order_ table.method_ th,
.page-doapprovaldetail div.order_ table.method_ th {
  background: var(--bg-color-base);
  color: var(--color-base);
}

div.order_ div.method_box_ {
	padding: 20px 15px;
	margin: 0 0 40px;
	border-radius: 0 0 var(--border-radius-items)  var(--border-radius-items);
	background: #FFF;
	box-shadow: var(--box-shadow-blue);
}
div.order_ div.method_box_:has(.common_headline2_) { padding: 0 15px 20px; border-radius: var(--border-radius-items);}
div.order_ table.method_destlist_ th { padding: 10px; border: var(--border-solid-gray); background: var(--bg-color-base);}
div.order_ table.method_destlist_ td { padding: 10px; border: var(--border-solid-gray);}
div.order_ table.method_destlist_ td.goodsname_,
div.order_ table.method_destlist_ td.qty_,
div.order_ table.method_destlist_ td.amt_ { padding: 0;}
div.order_ table.method_destlist_ td.goodsname_ div,
div.order_ table.method_destlist_ td.qty_ div,
div.order_ table.method_destlist_ td.amt_ div { padding: 10px; border-top: none; background: #fff;}
div.order_ div.method_destlist_frame_ table.method_destlist_ + table.method_destlist_ { border-top: var(--border-solid-gray);}

/* 添付ファイル */
div.order_ div#file_attachment_frame_ .attach-file-list .attach-file-name {
	height: 36px;
	padding: 0 15px;
	margin: 0 0 15px;
	border: var(--btn-del-border);
	border-radius: 3px;
	display: flex;
	align-items: center;
}
div.order_ div#file_attachment_frame_ .attach-file-list .attach-file-delete-btn { margin: 0 0 15px 10px;}
div.order_ div#file_attachment_frame_ .attach-file-list .attach-file-delete-btn .delete_ {
	width: 70px;
	height: 36px;
	border: var(--btn-del-border);
	border-radius: 3px;
	font-size: 13px;
	font-weight: 500;
	text-align: center;
	color: var(--btn-del-color);
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: var(--btn-del-bg);
	transition: 0.3s;
}
div.order_ div#file_attachment_frame_ .attach-file-list .attach-file-delete-btn .delete_:hover { opacity: var(--opacity);}

/* ----------------------------------
 ご注文内容・依頼内容の確認
---------------------------------- */
.page-edi_confirm .formlist_ th,
.page-e_edi_confirm .formlist_ th,
.page-historydetail .formlist_ th,
.page-estimatedetail .formlist_ th,
.page-bizhistorydetail .formlist_ th,
.page-bizestimatedetail .formlist_ th,
.page-approvaldetail .formlist_ th,
.page-bizapprovaldetail .formlist_ th,
.page-doapprovaldetail .formlist_ th,
.page-precartdetail .formlist_ th {
  color: #FFF;
  background: var(--bg-color-dark);
}
div.order_ table.estimate_method_ th {
  width: 160px;
  padding: 10px;
  border: var(--border-solid-gray);
  font-size: 14px;
  text-align: left;
  color: var(--color-base);
  background: var(--bg-color-base);
  box-sizing: border-box;
}
div.order_ table.estimate_method_ td {
  width: calc(100% - 160px);
  padding: 10px;
  font-size: 14px;
  text-align: right;
  border: var(--border-solid-gray);
  box-sizing: border-box;
}
div.order_ table.estimate_method_ td.total_ { font-weight: 500; color: var(--color-sale);}

div.order_ div.dest_block_ { margin: 60px 0;}
div.order_ div.dest_block_ div.dest-nickname {
  padding: 0;
  margin: 40px 0 10px;
  font-size: 22px;
  font-weight: 700;
  word-break: break-all;
  display: flex;
  align-items: center;
  position: relative;
}
div.order_ div.dest_block_ div.dest-nickname::before { display: none;}
div.order_ div.estimate_block_ { border-radius: var(--border-radius-items); background: var(--bg-color-light2);}
div.order_ div.subtotal_block_ { border-radius: var(--border-radius-items); background: var(--bg-color-light2);}

table.estimate_top_ td.estimate_top_left_ { width: calc(100% - 550px);}
table.estimate_top_ td.estimate_top_left_ table { width: 100%;}
table.estimate_top_ td.estimate_top_right_ { width: 550px; padding-left: 20px;}
table.estimate_top_ td table.order_,
table.estimate_top_ td table.order_ th,
table.estimate_top_ td table.order_ td,
table.estimate_top_ td table.method_,
table.estimate_top_ td table.method_ th,
table.estimate_top_ td table.method_ td { border: var(--border-solid-gray);}
table.estimate_top_ td table + table { margin-top: 20px;}

div.order_ .estimate_subtotal_breakdown_ div.subtotal_breakdown_ { border: var(--border-solid-gray); background: #FFF;}

