@charset 'utf-8';/*iax*/
/*------------------------------------------------------------
1. 全体レイアウト
2. 汎用スタイル
3. ブロック共通スタイル
4. ブロック個別スタイル
4-1. 注文確認
4-2. お支払い情報
4-3. ご注文者情報
4-4. お届け先情報
4-5. お届け方法
4-6. 商品情報
4-7. お支払い方法
4-8. 備考・オプション
4-9. お届け先変更ダイアログ
4-10. ポイント・クーポンダイアログ
4-11. 会員登録ダイアログ
4-12. カートに戻るボタン
4-13. ご依頼主情報
4-14. 代理注文メモ
4-15. 単一複数配送選択
4-16. 入力済配送先リスト表示
4-17. 共通商品オプション一括設定
4-18. 一時保存成功メッセージダイアログ
4-19. 一時保存した注文を再開するかどうかの選択モーダル
4-20. reCAPTCHA
5. システム
------------------------------------------------------------*/

/*------------------------------------------------------------
1. 全体レイアウト
------------------------------------------------------------*/
/* 各ブロック大枠 */
.opcBillingAddress
,.opcBillingAddress_edit
,.opcItemCommonOptionList
,.opcClient
,.opcClient_edit
,.opcDeliveryAddress
,.opcDeliveryAddress_edit
,.opcDeliveryMethod
,.opcDeliveryMethod_edit
,.opcDeliveryAddressAndDeliveryMethodGroup
,.opcItemList
,.opcItem_edit
,.opcSocialGiftLetterContentsGroup
,.opcSocialGiftLetterContentsGroup_edit
,.opcPaymentMethodList
,.opcPaymentMethod
,.opcRemarks
,.opcRemarks_edit
,.opcSubstituteOrderMemo
,.opcSubstituteOrderMemo_edit
,.opcPoint_edit
,.opcItemPoint_edit
,.opcCouponCode_edit
,.opcCoupon_edit
,.opcDeliveryAddressSummary
,.opcDeliveryAddressAndItemsGroup
,.opcDeliveryAddressViewPackage_summaryGroup
,.opcSelectDeliveries
,.basketCoupon_edit {
   margin-bottom: 2em;
   border: 1px solid #9b9b9b;
   padding: 2%;
   position: relative;
}

.opcOrderSummaryArea {
  margin-bottom: 2em;
}
.opcOrderSummary {
  border: 1px solid #9b9b9b;
  padding: 2%;
  position: relative;
}

/* 注文ボタン枠 */
.opcConfirm {
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 1%;
}

/*------------------------------------------------------------
2. 汎用スタイル
------------------------------------------------------------*/
/* 標準のボタングループ */
.opcCommonButtonGroup {
  text-align:right;
}

/* 標準のボタングループ(入力モード) */
.opcCommonButtonGroupEdit {
  text-align:left;
  padding: 10px;
  margin-top: 30px;
}

/* 標準ボタン */
.opcCommonButton {
  display: inline-block;
  padding: 10px;
  width: auto;
  height: auto;
  color: #000;
  background: #fff;
  border-radius: 5px;
  border: 1px solid #999;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  background: #f7f8fa;
  background: -webkit-linear-gradient(top,#f7f8fa,#e7e9ec);
  background: #e7e9ec;
}

/* 標準ボタン(入力モード) */
.opcCommonButtonEdit {
  display: block;
  padding: 10px;
  width: 100%;
  height: auto;
  color: #000;
  background: #fff;
  border-radius: 5px;
  border: 1px solid #999;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  background: #f7f8fa;
  background: -webkit-linear-gradient(top,#f7f8fa,#e7e9ec);
  background: #e7e9ec;
}

/* 標準ボタン（モバイル用追加設定） */
@media screen and (max-width: 480px) {
  .opcCommonButton {
      height: 44px;
      border-radius: 5px;
      -webkit-appearance: none;
  }
}

/* 入力モードブロック */
.opcCommonEditModeBlock {
  background: oldlace;
}

/* 参照モード項目ラベル */
.opcCommonReferenceLabel:after {
  content: "：";
}

/* 入力モード項目ラベル */
.opcCommonEditLabel {
  display: block;
  border-left: 4px solid #3d3d3d;
  padding-left: 5px;
  line-height: 25px;
  font-size: 15px;
  margin-bottom: 5px;
}

/* 必須項目ラベル */
.opcCommonRequireLabel {
  color: red;
}

/* テキスト入力要素 */
.opcCommonInputText {
  -webkit-appearance: none;
  padding: 5px 5px;
  width: 90%;
  line-height: 2;
  background: #fff;
  border: 1px solid #dddddd;
  border-radius: 0;
  margin: 5px 0px;
}

/* セレクトボックス要素 */
.opcCommonInputSelect {
  height: 35px;
  border-radius: 3px;
}

/* テキストエリア要素 */
.opcCommonInputTextArea {
  padding: 5px 5px;
  line-height: 1;
  background: #fff;
  border: 1px solid #dddddd;
  border-radius: 0;
}

/* 項目ごとのエラーメッセージ */
.opcCommonElementErrorMessage {
  color: red;
  margin-left: 1em;
}

/* ヘッダーエラーメッセージ */
.opcCommonHeaderErrorMessage {
  color: red;
  font-weight: bold;
  margin-left: 1em;
}

/* エラーメッセージの装飾 */
.opcCommonElementErrorMessage:before
,.opcCommonHeaderErrorMessage:before {
  content: "＊";
}

/* 戻るボタン調整 */
input.opcBillingAddress_backButton_edit.opcCommonButtonEdit
,input.opcItemCommonOption_backButton_edit.opcCommonButtonEdit
,input.opcDeliveryAddress_backButton_edit.opcCommonButtonEdit
,input.opcDeliveryAddressItem_backButton_edit.opcCommonButtonEdit
,input.opcDeliveryMethod_backButton_edit.opcCommonButtonEdit
,input.opcPaymentMethod_backButton_edit.opcCommonButtonEdit
,input.opcSelectDeliveries_backButton_edit.opcCommonButtonEdit
,input.opcCompletedDeliveryAddressList_backButton_edit.opcCommonButtonEdit
,input.opcDeliveryMethodList_backButton_edit.opcCommonButtonEdit{
  width: 30%;
  margin-top: 5px;
}

/*------------------------------------------------------------
3. ブロック共通スタイル
------------------------------------------------------------*/
/* タイトルブロック共通スタイル */
.opcOrderSummaryTitle
,.opcBillingAddressTitle
,.opcItemCommonOptionsTitle
,.opcClientTitle
,.opcDeliveryAddressTitle
,.opcDeliveryMethodTitle
,.opcItemTitle
,.opcPaymentMethodTitle
,.opcRemarksTitle
,.opcSubstituteOrderMemoTitle
,.opcPointTitle
,.opcCouponCodeTitle
,.opcCouponTitle
,.opcMemberTitle
,.opcRepeatTitle
,.opcDeliveryAddressAndItemsTitle
,.opcSocialGiftItemsTitle
,.opcSocialGiftLetterTitle
,.opcDeliveryAddressHeader
,.opcDeliveryMethodHeader
,.opcDeliveryAddressItemHeader
,.opcSubstituteShippingMemoHeader
,.basketCouponTitle {
 font-weight: bold;
 font-size: 16px;
}

.opcDeliveryAddressHeaderGroup
,.opcDeliveryMethodHeaderGroup
,.opcDeliveryAddressItemHeaderGroup {
  display: table;
  width: 100%;
  /*margin-top: 1em;*/
}
.opcDeliveryAddressHeader
,.opcDeliveryMethodHeader
,.opcDeliveryAddressItemHeader {
  display: table-cell;
  text-align: left;
}
.opcDeliveryAddressHeader_buttonGroup
,.opcDeliveryMethodHeader_buttonGroup
,.opcDeliveryAddressItemHeader_buttonGroup {
  display: table-cell;
  text-align: right;
}

/* 入力要素の一律インデント */
.opcCommonInputText
,.opcCommonInputSelect
,.opcCommonInputRadio
,.opcCommonInputCheckbox {
  margin-left: 1em;
}

/*------------------------------------------------------------
4. ブロック個別スタイル
------------------------------------------------------------*/
/*------------------------------------------------------------
4-1. 注文確認
------------------------------------------------------------*/
/* 注文ボタン枠の装飾 */
.opcConfirm {
  background-color: #fff;
  color: black;
  text-align: center;
}

/* 注文確定ボタン、 入力状況ボタン*/
.opcConfirm_order
,.opcConfirm_order_disable {
  width:90%;
  color: #fff;
}

/* 注文確定ボタン（有効）、 入力状況ボタン（有効） */
.opcConfirm_order {
  background-color: #da4636;
}

/* エラーメッセージ */
.opcConfirm_initialErrorMessage {
  width: 90%;
  display: inline-block;
  text-align: left;
}


/*------------------------------------------------------------
4-2. お支払い情報
------------------------------------------------------------*/
/* 合計金額＋ラベルグループ */
.opcOrderSummary_totalPricesAndLabelGroup {
  font-size: 16px;
  font-weight: bold;
  padding: 2px 5px;
  margin: 1px 0px;
  border-bottom: 1px dotted;
  overflow:hidden;
}

/* 合計金額グループ */
.opcOrderSummary_totalPricesGroup
,.opcOrderSummary_totalAmount
,.opcOrderSummary_totalPoint {
  float:right;
  font-size: 16px;
  text-align: right;
}

.opcOrderSummary_totalAmountGroup {
  clear: both;
}

/* 内訳金額グループ */
.opcOrderSummary_priceBreakDownGroup {
  padding-left:1em;
}

/* 内訳金額の右寄せ */
.opcOrderSummary_totalItemPricesGroup
,.opcOrderSummary_deliveryCost
,.opcOrderSummary_totalCartOptionPrice
,.opcOrderSummary_fee
,.opcOrderSummary_itemDiscount
,.opcOrderSummary_useCouponPrice
,.opcOrderSummary_usePointPrice
,.opcOrderSummary_getPoint
,.opcOrderSummary_getPointIfLoginLabel
,.opcOrderSummary_prospectPoint
,.opcOrderSummary_isolatedIslandCostMessage
,.opcOrderSummary_remainFreeShippingCost {
  float:right;
  text-align: right;
}

/* 内訳金額の右寄せをclearfix */
.opcOrderSummary_priceBreakDownGroup::after
,.opcOrderSummary_totalItemPricesAndLabelGroup
,.opcOrderSummary_deliveryCostAndLabelGroup
,.opcOrderSummary_isolatedIslandCostMessageAndLabelGroup
,.opcOrderSummary_totalCartOptionPriceAndLabelGroup
,.opcOrderSummary_feeAndLabelGroup
,.opcOrderSummary_itemDiscountAndLabelGroup
,.opcOrderSummary_useCouponPriceAndLabelGroup
,.opcOrderSummary_usePointPriceAndLabelGroup
,.opcOrderSummary_getPointAndLabelGroup
,.opcOrderSummary_getPointIfLoginLabelGroup
,.opcOrderSummary_prospectPointAndLabelGroup
,.opcOrderSummary_remainFreeShippingCostAndLabelGroup {
  content: "";
  display: block;
  clear: both;
}

/* 内訳金額内の罫線 */
.opcOrderSummary_feeAndLabelGroup
,.opcOrderSummary_usePointPriceAndLabelGroup {
  border-bottom: 1px dotted;
}


/*------------------------------------------------------------
4-3. ご注文者情報
------------------------------------------------------------*/
/* お名前 */
span.opcBillingAddress_nameKana:before {
  content:"\0028\0020";
}
span.opcBillingAddress_nameKana:after {
  content:"\0029\0020";
}

/* 郵便番号 */
.opcBillingAddress_zipCode_edit {
  width: 10em;
}

/* 性別ラジオボタンを横並びにする */
.opcBillingAddress_genderMaleAndLabelGroup_edit
,.opcBillingAddress_genderFemaleAndLabelGroup_edit {
  display: inline-block;
  width: 30%;
}

/* 住所ラベル（参照モードレイアウト） */
.opcBillingAddress_fullAddressLabel {
  display:inline-block;
  width:3em;
}

/* 住所本文（参照モードレイアウト） */
.opcBillingAddress_addressGroup {
  display:inline-block;
  vertical-align:top;
  width:80%;
}

/* メールアドレス（参照モードレイアウト） */
.opcBillingAddress_mailaddressLabel_reference {
  margin: 2em 0 2em 0;
}

/*------------------------------------------------------------
4-4. お届け先情報
------------------------------------------------------------*/
/* お名前 */
span.opcDeliveryAddress_nameKana:before {
  content:"\0028\0020";
}
span.opcDeliveryAddress_nameKana:after {
  content:"\0029\0020";
}

/* 郵便番号 */
.opcDeliveryAddress_zipCode_edit
,.opcAdditionalDeliveryAddress_zipCode_edit
{
  width: 10em;
}

/* お届け先情報の下マージン（参照モードレイアウト）*/
.opcDeliveryAddressGroup {
  margin-bottom: 2em;
}

/* 住所ラベル（参照モードレイアウト） */
.opcDeliveryAddress_fullAddressLabel {
  display: inline-block;
  width: 3em;
}

/* 住所本文（参照モードレイアウト） */
.opcDeliveryAddress_addressGroup {
  display: inline-block;
  vertical-align: top;
  width: 80%;
}

/** AmazonPayメッセージ */
.opcDeliveryAddress_amazonPayInformation1
,.opcDeliveryAddress_amazonPayInformation2 {
  display: block;
}
/** AmaonPay注釈 */
.opcDeliveryAddress_amazonPayInformationGroup {
  margin-bottom: 1em;
}

/*------------------------------------------------------------
4-5. お届け方法
------------------------------------------------------------*/
/* 宅配便詳細＋ラベルグループ（インデント、下線） */
.opcDeliveryMethod_normalShippingDetailAndLabelGroup_edit {
  margin-left:1em;
  padding-left:1em;
  border-bottom:1px solid #9b9b9b;
}

/* メール便詳細＋ラベルグループ（インデント、下線） */
.opcDeliveryMethod_mailShippingDetailAndLabelGroup_edit {
  margin-left:1em;
  padding-left:1em;
  border-bottom:1px solid #9b9b9b;
}

/* 店舗受取詳細＋ラベルグループ（インデント、下線） */
.opcDeliveryMethod_receiveAtStoreDetailAndLabelGroup_edit {
  margin-left:1em;
  padding-left:1em;
  border-bottom:1px solid #9b9b9b;
}

.opcDeliveryMethod_normalShoppingComment_edit
,.opcDeliveryMethod_mailShoppingComment_edit
,.opcDeliveryMethod_receiveAtStoreComment_edit {
  display: block;
  margin-left:1em;
  padding-left:1em;
}

/* お届け方法の下マージン（参照モードレイアウト）*/
.opcDeliveryMethodGroup {
  margin-bottom: 2em;
}

/*------------------------------------------------------------
4-6. 商品情報
------------------------------------------------------------*/
/* 商品エリアの調整 */
.opcItem {
  padding: 1%;
  border-bottom: 1px solid #9b9b9b;
  margin-bottom: 10px;
}

/* 商品基本情報欄 */
.opcItem_itemAndLabelGroup
,.opcItem_itemAndLabelGroup_edit {
    margin-bottom: 10px;
    display: flex;
}

/* 商品画像枠 */
.opcItem_itemImageGroup
,.opcItem_itemImageGroup_edit {
  width: 30%;
}

/* 商品金額情報枠 */
.opcItem_itemSummary
,.opcItem_itemSummary_edit {
  width: 68%;
  padding: 0 3%;
}

/* 商品小計の下部に点線 */
.opcItem_itemSubTotalPricesAndLabelGroup {
  border-bottom : 1px dotted;
}

/* 商品金額内訳のインデント */
.opcItem_itemRetailPricesAndLabelGroup
,.opcItem_subTotalNumAndLabelGroup {
  margin-left: 1em;
}

/* 商品金額情報枠内の数値系を右寄せ */
.opcItem_itemSubTotalPricesGroup
,.opcItem_itemRetailPricesGroup
,.opcItem_itemRetailPrice
,.opcItem_subTotalNum {
  float: right;
  text-align: right;
}

/* 数量計の位置調整 */
.opcItem_subTotalNum {
  padding-right: 1em;
}

/* レンタル情報を右寄せ */
.opcItem_rentalStartDate
,.opcItem_rentalSendDate
,.opcItem_rentalReachDate
,.opcItem_rentalUsageStartDate
,.opcItem_rentalUsageEndDate
,.opcItem_rentalReturnDate
,.opcItem_rentalExtendDate
,.opcItem_rentalAdjustFee
,.opcItem_rentalDiscountFee {
  float: right;
}

/* 右寄せ項目のclearfix */
.opcItem_itemSubTotalPricesAndLabelGroup::after
,.opcItem_itemRetailPriceAndLabelGroup
,.opcItem_subTotalNumAndLabelGroup
,.opcItem_rentalStartDateAndLabelGroup
,.opcItem_rentalSendDateAndLabelGroup
,.opcItem_rentalReachDateAndLabelGroup
,.opcItem_rentalUsageStartDateAndLabelGroup
,.opcItem_rentalUsageEndDateAndLabelGroup
,.opcItem_rentalReturnDateAndLabelGroup
,.opcItem_rentalExtendDateAndLabelGroup
,.opcItem_rentalAdjustFeeAndLabelGroup
,.opcItem_rentalDiscountFeeAndLabelGroup
,.opcItem_rentalSchedulesGroup::after {
  content: " ";
  display: block;
  clear: both;
}

/* 定期商品欄に上マージン、下パディング */
.opcItem_repeatItemGroup
,.opcItem_repeatItemGroup_edit {
  margin-top: 1em;
  padding-bottom: 1em;
}

/* 定期商品欄の本体インデント */
.opcItem_repeatCycleConditionsGroup_edit
,.opcItem_repeatCourseAndLabelGroup_edit {
  padding-left: 1em;
}

/* 定期商品入力欄のサイクル詳細設定のインデント */
.opcItem_repeatCycleMonthAndLabelGroup_edit
,.opcItem_repeatCycleWeekAndLabelGroup_edit
,.opcItem_repeatCycleFreeAndLabelGroup_edit {
  padding-left: 1em;
}

/* 商品オプション（参照モード）のインデント */
.opcItem_itemOptionAndPrice {
  display: block;
  padding-left: 1em;
}

/* 共通商品オプション（参照モード）のインデント */
.opcItem_itemCommonOptionSelectAndLabelGroup {
  display: block;
  padding-left: 1em;
}

/* 共通商品オプション(ラジオ表示) ●と選択肢 横並び */
.opcItem_itemCommonOptionOptionBlock_edit {
  display: inline-block;
  vertical-align: middle;
}

/* 商品オプション説明のインデント */
.opcItem_itemOptionDescription_edit {
  margin-left: 1em;
}

/* 配送先商品欄の上部に罫線 */
.opcItem_deliveryAddressItemGroup
,.opcItem_deliveryAddressItemGroup_edit {
  border-top : 1px dotted;
}

/* 配送先商品欄にパディング */
.opcItem_deliveryAddressItemGroup
,.opcItem_deliveryAddressItemGroup_edit {
  padding: 1em;
}

/** 配送先パッケージのサマリの右寄せ */
.opcDeliveryAddressViewPackage_summaryGroup {
  text-align: right;
  margin-left: auto;
  width: fit-content;
}

/* ギフトレタープレビュー */
.opcSocialGiftLetter_letterImagePreviewAndMessageGroup_edit {
  border: solid 1px #9b9b9b;;
  margin: 0 auto;
  padding: 1em;
}

/*------------------------------------------------------------
4-7. お支払い方法
------------------------------------------------------------*/
/* 決済方法毎の詳細情報にインデント */
.opcPaymentMethod_paymentMethodDetailGroup_edit {
  margin-left: 1em;
}

/* 決済方法毎に下部に余白 */
.opcPaymentMethod_edit {
  margin-bottom: 5px;
}

/** AmazonPayメッセージ */
.opcPaymentMethod_amazonPayInformation1
,.opcPaymentMethod_amazonPayInformation2 {
  display: block;
}

/** AmazonPayボタン */
.opcPaymentMethod_amazonPayButton_edit {
  width: 200px !important;
  height: 45px !important;
}
/** AmazonPay注釈*/
.opcPaymentMethod_amazonPayInformationGroup {
  margin-bottom: 1em;
}

/*------------------------------------------------------------
4-8. 備考・オプション
------------------------------------------------------------*/
/* 備考欄サイズ */
.opcRemarks_remark_edit {
  width: 90%;
  height: 5em;
}

/* 参照モードの備考ラベル、購入オプションラベル */
.opcRemarks_remarkLabel
,.opcRemarks_cartOptionLabel {
  display: block;
}


/* 編集モードの備考説明 */
.opcRemarks_remarkDescription_edit {
  display: block;
  margin-left: 1em;
}
/* 参照モードの備考、購入オプション */
.opcRemarks_remark
,.opcRemarks_cartOption {
  display: block;
  margin-left: 1em;
  margin-bottom: 5px;
}

/*------------------------------------------------------------
4-9. お届け先変更ダイアログ
------------------------------------------------------------*/
/* ボタン */
.opcDeliveryAddressEditDialog_modifyCurrentDeliveryAddressButton
,.opcDeliveryAddressEditDialog_inputNewDeliveryAddressButton
,.opcDeliveryAddressEditDialog_applyBillingAddressButton
,.opcDeliveryAddressEditDialog_customerDeliveryAddressButton {
  display:block;
  margin-bottom:3px;
  width: 90%;
  text-align: center;
  margin-left: 1em;
}

/* 各エリア間に余白 */
.opcDeliveryAddressEditDialog_directChangeButtonAndLabelGroup
,.opcDeliveryAddressEditDialog_amazonPayButtonAndLabelGroup
,.opcDeliveryAddressEditDialog_customerDeliveryAddressButtonAndLabelGroup {
  margin-bottom: 1em;
}

/*------------------------------------------------------------
4-10. ポイント・クーポンダイアログ
------------------------------------------------------------*/
/* 使用可能ポイント（円）の接頭辞 */
.opcPoint_usablePointWithYen_edit:before {
  content: "（";
}

/* 使用可能ポイント（円）の接尾辞 */
.opcPoint_usablePointWithYen_edit:after {
  content: "）";
}

/* 使用可能ポイントのインデント */
.opcPoint_usablePoint_edit {
  margin-left: 1em;
}

/* 使用ポイント入力欄 */
.opcPoint_usePoint_edit {
  width: 50%;
  text-align: right;
}

/* 商品ポイント使用覧（大枠）に下部以外の罫線と左に少しマージン*/
.opcItemPoint_itemListGroup_edit {
  border: solid #9b9b9b;
  border-width: 1px 1px 0px 1px;
  margin-left: 1em;
}

/* 各商品ポイント欄の下部に罫線 */
.opcItemPoint_itemGroup_edit {
  border-bottom: 1px solid #9b9b9b;
  padding: 1px;
}

/* 商品名の欄の幅、右部に罫線、float */
.opcItemPoint_itemNameGroup_edit {
  width: 80%;
  border-right: 1px solid #9b9b9b;
  float: left;
}

/* 商品ポイント数量欄の幅、float */
.opcItemPoint_itemQuantityGroup_edit {
  width: 20%;
  float: left;
}

/* 各商品ポイント欄のclearfix */
.opcItemPoint_clearfix_edit {
  content: "";
  display: block;
  clear: both;
}

/* 商品総単価の前後に（） */
.opcItemPoint_totalUnitPrice_edit::before {
    content: "（";
}

.opcItemPoint_totalUnitPrice_edit::after {
    content: "）";
}

/* 商品オプション（参照モード）、お届け先のインデント */
.opcItemPoint_itemOptionAndPrice
,.opcItemPoint_deliveryAddress {
  display: block;
  padding-left: 1em;
}

/* クーポンコード各行を縦並び */
.opcCouponCode_useCouponCodeAndLabelGroup_edit
,.opcCoupon_useCouponAndLabelGroup_edit
{
  display: block;
}

/*------------------------------------------------------------
4-11. 会員登録ダイアログ
------------------------------------------------------------*/
/* 会員規約本文 */
.opcMember_memberAgreementDescription_edit {
  border: 1px solid #888888;
  height: 250px;
  min-height: 220px;
  overflow-x: hidden;
  overflow-y: auto;
}

/* 会員規約の後に余白 */
.opcMember_memberAgreementDescriptionAndLabelGroup_edit {
  margin-bottom: 2em;
}

/* パスワードの後に余白 */
.opcMember_passwordGroup_edit {
  margin-bottom: 1em;
}

/*------------------------------------------------------------
4-12. カートに戻るボタン
------------------------------------------------------------*/

/* 戻るボタンエリア下部に余白 */
.opcOrderBackToBasket {
  margin-bottom: 2em;
}

/*------------------------------------------------------------
4-13. ご依頼主情報
------------------------------------------------------------*/
/* お名前 */
span.opcClient_nameKana:before {
  content:"\0028\0020";
}
span.opcClient_nameKana:after {
  content:"\0029\0020";
}

/* 郵便番号 */
.opcClient_zipCode_edit {
  width: 10em;
}

/* 住所ラベル（参照モードレイアウト） */
.opcClient_fullAddressLabel {
  display:inline-block;
  width:3em;
}

/* 住所本文（参照モードレイアウト） */
.opcClient_addressGroup {
  display:inline-block;
  vertical-align:top;
  width:80%;
}

/*------------------------------------------------------------
4-14. 代理注文メモ
------------------------------------------------------------*/
/* 参照モードのインデント */
.opcSubstituteOrderMemo_remarksMemo
,.opcSubstituteOrderMemo_orderMemo
,.opcSubstituteOrderMemo_shippingMemo {
  display: block;
  margin-left: 1em;
  margin-bottom: 5px;
}

/*------------------------------------------------------------
4-15. 単一複数配送選択
------------------------------------------------------------*/
.opcSelectDeliveries_deliveryToSingle_edit
,.opcSelectDeliveries_deliveryToMultiple_edit
,.opcSelectDeliveries_backButton_edit {
  margin: 5px 0;
}

/*------------------------------------------------------------
4-16. 入力済配送先リスト表示
------------------------------------------------------------*/
/* 入力済配送先リストエリア */
.opcCompletedDeliveryAddressListArea {
  width: 70%;
  margin: 0 auto;
}

/* 画面上部の遷移用ボタンエリア */
.opcCompletedDeliveryAddressList_buttonGroup_edit {
  margin: 30px auto;
}

/* 次のお届け先を追加するボタン */
.opcCompletedDeliveryAddressList_addDeliveryAddress_edit {
  margin: 5px 0;
}

/* 入力済配送先リスト */
.opcCompletedDeliveryAddressList_container {
  background-color: #eee;
  padding: 10px;
  border-radius: 5px;
  margin: auto 0;
}

/* 入力済配送先リスト上部 */
.opcCompletedDeliveryAddressList_upsideOfListContainer {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

/* 入力済配送先リスト上部ラベル文 */
.opcCompletedDeliveryAddressList_displayCompletedDeliveryAddressListLabel {
  padding: 8px 0px 8px 5px;
}

/* 注文を一時保存するボタン */
.opcCompletedDeliveryAddressList_saveSessionCart_edit {
  width: fit-content;
}

/* 各入力済配送先情報 */
.opcDeliveryAddressContents{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 5px 10px;
  transition: all 0.4s ease-out;
  border: #eee 3px solid;
  border-radius: 5px;
  background-color: #fff;
  align-items: center;
}

/* 何件目のお届け先か */
.opcCompletedDeliveryAddressListCount {
  flex-basis: 20%;
}

/* お届け先氏名 */
.opcCompletedDeliveryAddressListName {
  flex-basis: 40%;
}

/* 商品を変更するボタン */
.opcCompletedDeliveryAddressListChangeButton {
  flex-basis: 30%;
  display: inline-block;
  text-align: right;
}

.opcCompletedDeliveryAddressList_changeItems_edit{
  display: inline-block;
  width: fit-content;
}

@media screen and (max-width: 480px) {
  /* 入力済配送先リストエリア */
  .opcCompletedDeliveryAddressListArea {
    width: 90%;
  }

  /* 入力済配送先リスト上部ラベル文 */
  .opcCompletedDeliveryAddressList_displayCompletedDeliveryAddressListLabel {
    padding: 0px 0px 0px 5px;
  }

  /* 注文を一時保存するボタン */
  .opcCompletedDeliveryAddressList_sessionCartSaveButton {
    flex-basis: 100%;
  }

  .opcCompletedDeliveryAddressList_saveSessionCart_edit {
    width: 100%;
  }

  /* 商品を変更するボタン */
  .opcCompletedDeliveryAddressListChangeButton {
    flex-basis: 100%;
  }

  .opcCompletedDeliveryAddressList_changeItems_edit{
    width: 100%;
  }

  /* 何件目のお届け先か,お届け先氏名 */
  .opcCompletedDeliveryAddressListCount, .opcCompletedDeliveryAddressListName {
    flex-basis: unset;
  }
}

/*------------------------------------------------------------
4-17. 共通商品オプション一括設定
------------------------------------------------------------*/

/* 注文を一時保存するボタン */
.opcItemCommonOption_sessionCartSaveButton_edit {
  margin: 5px 0;
}

/* 一時保存再開時に表示する注釈 */
.opcItemCommonOptions_cartPurposeSettingUpdatedNotification
,.opcItemCommonOptions_itemCommonOptionSettingUpdatedNotification
,.opcItem_itemCommonOptionUpdatedNotification
,.opcItem_itemOptionUpdatedNotification
,.opcItem_purposeUpdatedNotification
,.opcCompletedDeliveryAddressList_optionsUpdatedNotification {
  color: red;
  margin: 5px;
}

.opcCompletedDeliveryAddressList_optionsUpdatedNotification {
  text-align: center;
}

/** 各お届け先に表示するオプション確認メッセージ */
.opcCompletedDeliveryAddressList_requiedConfirmMessage {
  color: red;
  flex-basis: 100%;
}

/** お届け先情報入力完了時のメッセージ */
.opcCompletedDeliveryAddressList_completedDeliveryAddressMessage {
  margin: 5px;
}

/*------------------------------------------------------------
4-18. 一時保存成功メッセージダイアログ
------------------------------------------------------------*/

/* 一時保存成功メッセージ */
.opcSaveMemberSessionCart_successMessage,
.opcSaveMemberSessionCart_explanationMessage {
  text-align: center;
}

/* 一時保存成功時補足メッセージ */
.opcSaveMemberSessionCart_explanationMessageGroup {
  margin-top: 10px;
}

/*------------------------------------------------------------
4-19. 一時保存した注文を再開するかどうかの選択モーダル
------------------------------------------------------------*/
.opcResumeOrContinueModal_explanationGroup {
  text-align: center;
}

.opcResumeOrContinueModal_resumeMemberSessionCart
,.opcResumeOrContinueModal_continueSessionCart {
  width: fit-content;
  margin: 10px auto;
}

/*------------------------------------------------------------
4-20. reCAPTCHA
------------------------------------------------------------*/

.grecaptcha-badge {
  z-index: 2000000000;
}

/*------------------------------------------------------------
5. システム
------------------------------------------------------------*/
#sysOpcLoading {
  display: table;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: #fff;
  opacity: 0.8;
  z-index: 210;
}

#sysOpcLoadingMessage {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  padding-top: 140px;
  background: url("images/gif-load.gif") center center no-repeat;
}

/* Modaalの標準パディングを解除 */
.modaal-content-container {
  padding: 2%;
}

/* ダイアログの画面外への突き抜け防止 */
.modaal-outer-wrapper {
  table-layout: fixed;
}

/* ダイアログのz-index調整 */
.modaal-wrapper {
    z-index: 203;
}

.modaal-overlay {
  z-index: 202;
}

/* basketの処理メッセージ表示 */
#basketSuccessMassage {
  position: fixed;
  top: 40px;
  right: 100px;
  display: none;
  background-color: #fff;
  padding: 10px 20px;
  box-shadow: 3px 3px 3px gray;
  border-radius: 3px;
}
