/* ==========================================================
   FutureShop 会員系ページ統合CSS
   File: 02_member_pages.css

   対象：
   #fs_Login
   #fs_NewsletterSubscribe
   #fs_NewsletterUnsubscribe
   #fs_MyOrders
   #fs_MyPageTop
   #fs_EditPassword
   #fs_MyAddressBook
   #fs_MyPoints
   #fs_MyAccountSettings
   #fs_MyLinkedAccounts
   #fs_DeleteAccount
   #fs_MyCreditCards
   #fs_Register

   商品詳細系・レビュー系とは完全分離
========================================================== */

/* ==========================================================
   FutureShop ログインページ
   対象：#fs_Login
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ全体
========================================================== */

#fs_Login .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_Login .fs-c-heading--page {
margin-bottom: 36px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. ログイン画面全体
========================================================== */

#fs_Login .fs-c-loginForm {
max-width: 720px;
margin: 0 auto 60px;
}


/* ==========================================================
   4. 各セクション
========================================================== */

#fs_Login .fs-c-registeredUsers,
#fs_Login .fs-c-newUsers {
box-sizing: border-box;

width: 100%;

margin: 0 0 30px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   5. セクション見出し
========================================================== */

#fs_Login .fs-c-subSection__title,
#fs_Login .fs-c-registeredUsers__title,
#fs_Login .fs-c-newUsers__title {
margin: 0 0 26px;

padding: 0 0 12px;

color: #43372f;

font-size: 19px;
font-weight: 500;
line-height: 1.6;
letter-spacing: 0.03em;

border-bottom: 2px solid #8a9b59;
}


/* ==========================================================
   6. 入力テーブル
========================================================== */

#fs_Login .fs-c-inputTable {
width: 100%;
}

#fs_Login .fs-c-inputTable__headerCell {
width: 180px;

padding: 12px 20px 12px 0;

vertical-align: middle;
}

#fs_Login .fs-c-inputTable__dataCell {
padding: 12px 0;
vertical-align: middle;
}


/* ==========================================================
   7. 入力項目ラベル
========================================================== */

#fs_Login .fs-c-inputTable__label {
color: #43372f;

font-size: 15px;
font-weight: 500;
line-height: 1.6;
}


/* 必須 */

#fs_Login .fs-c-requiredMark {
display: inline-block;

margin-left: 5px;

color: #9a3d35;

font-size: 11px;
font-weight: 400;
}


/* ==========================================================
   8. メールアドレス・パスワード入力欄
========================================================== */

#fs_Login #fs_input_mailAddress,
#fs_Login #fs_input_password {
box-sizing: border-box;

width: 100%;
height: 50px;

padding: 0 14px;

color: #333;
background: #fff;

border: 1px solid #cfcac4;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 400;

transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
}


/* フォーカス */

#fs_Login #fs_input_mailAddress:focus,
#fs_Login #fs_input_password:focus {
outline: none;

border-color: #8a9b59;

box-shadow:
0 0 0 3px rgba(138, 155, 89, 0.15);
}


/* ==========================================================
   9. パスワード表示切替
========================================================== */

#fs_Login .fs-c-inputGroup {
position: relative;
}

#fs_Login .fs-c-button--displayPassword {
opacity: 0.7;
}

#fs_Login .fs-c-button--displayPassword:hover {
opacity: 1;
}


/* ==========================================================
   10. ログインボタン
========================================================== */

#fs_Login .fs-c-buttonContainer--login {
margin-top: 28px;
text-align: center;
}

#fs_Login .fs-c-button--login {
box-sizing: border-box;

width: 100%;
max-width: 450px;
min-height: 52px;

padding: 12px 24px;

color: #fff !important;
background: #43372f !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 500;

letter-spacing: 0.05em;

cursor: pointer;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_Login .fs-c-button--login:hover {
background: #5b4b40 !important;
border-color: #5b4b40 !important;
}

#fs_Login .fs-c-button--login .fs-c-button__label {
color: #fff !important;
}


/* ==========================================================
   11. パスワードをお忘れですか？
========================================================== */

#fs_Login .fs-c-inputInformation__link {
margin-top: 18px;

text-align: center;
}

#fs_Login .fs-c-inputInformation__link .fs-c-textLink {
color: #59623f;

font-size: 14px;
font-weight: 400;

text-decoration: underline;
text-underline-offset: 3px;
}

#fs_Login .fs-c-inputInformation__link .fs-c-textLink:hover {
color: #43372f;
}


/* ==========================================================
   12. Amazonログイン
========================================================== */

#fs_Login .fs-c-otherServiceLogin {
margin-top: 34px;
padding-top: 30px;

border-top: 1px solid #e5e2de;
}

#fs_Login .fs-c-linkedServiceLogin__title {
margin-bottom: 18px;

color: #43372f;

font-size: 16px;
font-weight: 500;

text-align: center;
}

#fs_Login .fs-c-anotherLogin__message {
max-width: 520px;

margin: 0 auto 18px;

color: #666;

font-size: 13px;
font-weight: 400;
line-height: 1.8;
}


/* Amazonボタン外枠
   Amazon自身のボタンデザインは変更しない */

#fs_Login .fs-c-anotherLogin__button--amazon {
width: 100% !important;
max-width: 450px !important;

margin-left: auto !important;
margin-right: auto !important;
}


/* ==========================================================
   13. 新規会員登録
========================================================== */

#fs_Login .fs-c-newUsers {
margin-top: 30px;
}


/* 説明文 */

#fs_Login .fs-c-newUsers__message {
margin-bottom: 26px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.9;

text-align: center;
}


/* 会員登録ボタン */

#fs_Login .fs-c-buttonContainer--memberRegister {
text-align: center;
}

#fs_Login .fs-c-button--memberRegister {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 450px;
min-height: 52px;

padding: 12px 24px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 500;

letter-spacing: 0.05em;

text-decoration: none;

transition:
color 0.2s ease,
background 0.2s ease;
}

#fs_Login .fs-c-button--memberRegister:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_Login .fs-c-button--memberRegister .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   14. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* ページタイトル */

#fs_Login .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* ログインエリア */

#fs_Login .fs-c-loginForm {
width: 100%;

margin-bottom: 40px;
}


/* 各カード */

#fs_Login .fs-c-registeredUsers,
#fs_Login .fs-c-newUsers {
margin-bottom: 22px;

padding: 24px 18px;

border-radius: 3px;
}


/* 見出し */

#fs_Login .fs-c-subSection__title,
#fs_Login .fs-c-registeredUsers__title,
#fs_Login .fs-c-newUsers__title {
margin-bottom: 20px;
padding-bottom: 10px;

font-size: 17px;
}


/* FutureShopのtableをスマホで縦積み */

#fs_Login .fs-c-inputTable,
#fs_Login .fs-c-inputTable tbody,
#fs_Login .fs-c-inputTable tr,
#fs_Login .fs-c-inputTable__headerCell,
#fs_Login .fs-c-inputTable__dataCell {
display: block;
width: 100%;
}

#fs_Login .fs-c-inputTable tr {
margin-bottom: 18px;
}

#fs_Login .fs-c-inputTable__headerCell {
padding: 0 0 7px;
}

#fs_Login .fs-c-inputTable__dataCell {
padding: 0;
}


/* ラベル */

#fs_Login .fs-c-inputTable__label {
font-size: 14px;
}


/* 入力欄 */

#fs_Login #fs_input_mailAddress,
#fs_Login #fs_input_password {
height: 50px;

font-size: 16px;
}


/* ログインボタン */

#fs_Login .fs-c-buttonContainer--login {
margin-top: 22px;
}

#fs_Login .fs-c-button--login {
max-width: none;

min-height: 52px;

font-size: 15px;
}


/* パスワード忘れ */

#fs_Login .fs-c-inputInformation__link .fs-c-textLink {
font-size: 13px;
}


/* Amazon */

#fs_Login .fs-c-otherServiceLogin {
margin-top: 28px;
padding-top: 26px;
}

#fs_Login .fs-c-linkedServiceLogin__title {
font-size: 15px;
}

#fs_Login .fs-c-anotherLogin__message {
font-size: 12px;
line-height: 1.75;
}

#fs_Login .fs-c-anotherLogin__button--amazon {
max-width: 100% !important;
}


/* 新規会員 */

#fs_Login .fs-c-newUsers {
margin-top: 22px;
}

#fs_Login .fs-c-newUsers__message {
margin-bottom: 22px;

font-size: 14px;
line-height: 1.8;

text-align: left;
}

#fs_Login .fs-c-button--memberRegister {
max-width: none;

min-height: 52px;

font-size: 15px;
}
}


/* ==========================================================
   FutureShop メールマガジン登録ページ
   対象：#fs_NewsletterSubscribe
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_NewsletterSubscribe .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_NewsletterSubscribe .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. フォーム全体
========================================================== */

#fs_NewsletterSubscribe .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 720px;

margin: 0 auto 30px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   4. 冒頭説明
========================================================== */

#fs_NewsletterSubscribe .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 0 0 22px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.8;

text-align: center;

border-bottom: 1px solid #ebe8e3;
}

#fs_NewsletterSubscribe .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   5. 入力テーブル
========================================================== */

#fs_NewsletterSubscribe .fs-c-inputTable {
width: 100%;
}

#fs_NewsletterSubscribe .fs-c-inputTable__headerCell {
width: 180px;

padding: 13px 20px 13px 0;

vertical-align: middle;
}

#fs_NewsletterSubscribe .fs-c-inputTable__dataCell {
padding: 13px 0;

vertical-align: middle;
}


/* ==========================================================
   6. 項目名
========================================================== */

#fs_NewsletterSubscribe .fs-c-inputTable__label {
color: #43372f;

font-size: 15px;
font-weight: 500;
line-height: 1.6;
}


/* 必須 */

#fs_NewsletterSubscribe .fs-c-requiredMark {
display: inline-block;

margin-left: 5px;

color: #9a3d35;

font-size: 11px;
font-weight: 400;
}


/* ==========================================================
   7. 入力欄
========================================================== */

#fs_NewsletterSubscribe #fs_input_lastName,
#fs_NewsletterSubscribe #fs_input_firstName,
#fs_NewsletterSubscribe #fs_input_mailAddress {
box-sizing: border-box;

height: 50px;

padding: 0 14px;

color: #333;
background: #fff;

border: 1px solid #cfcac4;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 400;

transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
}


/* メールアドレス */

#fs_NewsletterSubscribe #fs_input_mailAddress {
width: 100%;
}


/* フォーカス */

#fs_NewsletterSubscribe #fs_input_lastName:focus,
#fs_NewsletterSubscribe #fs_input_firstName:focus,
#fs_NewsletterSubscribe #fs_input_mailAddress:focus {
outline: none;

border-color: #8a9b59;

box-shadow:
0 0 0 3px rgba(138, 155, 89, 0.15);
}


/* ==========================================================
   8. 姓・名
========================================================== */

#fs_NewsletterSubscribe .fs-c-inputTextGroup {
display: flex;

gap: 10px;

width: 100%;
}

#fs_NewsletterSubscribe .fs-c-inputTextGroup__item {
flex: 1 1 0;

min-width: 0;
}

#fs_NewsletterSubscribe .fs-c-inputTextGroup__item input {
width: 100%;
}


/* ==========================================================
   9. 個人情報保護方針への同意
========================================================== */

#fs_NewsletterSubscribe .fs-c-privacyPolicyAgreeField {
margin-top: 28px;
padding: 18px 20px;

background: #f7f5f2;

border: 1px solid #ebe8e3;
border-radius: 3px;
}

#fs_NewsletterSubscribe .fs-c-checkbox__label {
color: #444;

font-size: 14px;
font-weight: 400;
line-height: 1.7;

cursor: pointer;
}

#fs_NewsletterSubscribe .fs-c-checkbox__labelText a {
color: #59623f;

font-weight: 500;

text-decoration: underline;
text-underline-offset: 3px;
}

#fs_NewsletterSubscribe .fs-c-checkbox__labelText a:hover {
color: #43372f;
}


/* ==========================================================
   10. 登録ボタン
========================================================== */

#fs_NewsletterSubscribe .fs-c-buttonContainer--confirmRegister {
margin-top: 30px;

text-align: center;
}

#fs_NewsletterSubscribe .fs-c-button--confirmRegister {
box-sizing: border-box;

width: 100%;
max-width: 450px;
min-height: 52px;

padding: 12px 24px;

color: #fff !important;
background: #43372f !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 500;

letter-spacing: 0.05em;

cursor: pointer;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_NewsletterSubscribe .fs-c-button--confirmRegister:hover {
background: #5b4b40 !important;
border-color: #5b4b40 !important;
}

#fs_NewsletterSubscribe .fs-c-button--confirmRegister .fs-c-button__label {
color: #fff !important;
}


/* ==========================================================
   11. メールドメイン注意書き
========================================================== */

#fs_NewsletterSubscribe .fs-l-block--center {
width: 100%;
max-width: 720px;

margin: 0 auto 55px;
}

#fs_NewsletterSubscribe .fs-p-emailDomainNotice {
box-sizing: border-box;

padding: 16px 20px;

color: #666;
background: #f7f5f2;

border-left: 3px solid #8a9b59;

font-size: 13px;
font-weight: 400;
line-height: 1.8;
}

#fs_NewsletterSubscribe .fs-p-emailDomainNotice p {
margin: 0;
}

#fs_NewsletterSubscribe .fs-p-emailDomainNotice strong {
color: #43372f;
font-weight: 500;
}


/* ==========================================================
   12. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_NewsletterSubscribe .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* フォーム */

#fs_NewsletterSubscribe .fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 22px;

padding: 24px 18px;

border-radius: 3px;
}


/* 説明 */

#fs_NewsletterSubscribe .fs-c-inputInformation__message {
margin-bottom: 22px;
padding-bottom: 18px;

font-size: 14px;
line-height: 1.8;

text-align: left;
}


/* テーブルを縦積み */

#fs_NewsletterSubscribe .fs-c-inputTable,
#fs_NewsletterSubscribe .fs-c-inputTable tbody,
#fs_NewsletterSubscribe .fs-c-inputTable tr,
#fs_NewsletterSubscribe .fs-c-inputTable__headerCell,
#fs_NewsletterSubscribe .fs-c-inputTable__dataCell {
display: block;

width: 100%;
}

#fs_NewsletterSubscribe .fs-c-inputTable tr {
margin-bottom: 20px;
}

#fs_NewsletterSubscribe .fs-c-inputTable__headerCell {
padding: 0 0 7px;
}

#fs_NewsletterSubscribe .fs-c-inputTable__dataCell {
padding: 0;
}


/* ラベル */

#fs_NewsletterSubscribe .fs-c-inputTable__label {
font-size: 14px;
}


/* 入力欄 */

#fs_NewsletterSubscribe #fs_input_lastName,
#fs_NewsletterSubscribe #fs_input_firstName,
#fs_NewsletterSubscribe #fs_input_mailAddress {
height: 50px;

font-size: 16px;
}


/* 姓・名はスマホでも横並び */

#fs_NewsletterSubscribe .fs-c-inputTextGroup {
gap: 8px;
}


/* プライバシー */

#fs_NewsletterSubscribe .fs-c-privacyPolicyAgreeField {
margin-top: 22px;

padding: 15px 14px;
}

#fs_NewsletterSubscribe .fs-c-checkbox__label {
font-size: 13px;
}


/* 登録ボタン */

#fs_NewsletterSubscribe .fs-c-buttonContainer--confirmRegister {
margin-top: 24px;
}

#fs_NewsletterSubscribe .fs-c-button--confirmRegister {
max-width: none;

min-height: 52px;

font-size: 15px;
}


/* 注意書き */

#fs_NewsletterSubscribe .fs-l-block--center {
width: calc(100% - 30px);

margin: 0 auto 40px;
}

#fs_NewsletterSubscribe .fs-p-emailDomainNotice {
padding: 14px 15px;

font-size: 12px;
line-height: 1.75;
}
}


/* ==========================================================
   FutureShop メールマガジン停止ページ
   対象：#fs_NewsletterUnsubscribe
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_NewsletterUnsubscribe .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_NewsletterUnsubscribe .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. フォーム全体
========================================================== */

#fs_NewsletterUnsubscribe .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 720px;

margin: 0 auto 55px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   4. 説明文
========================================================== */

#fs_NewsletterUnsubscribe .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 0 0 22px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.8;

text-align: center;

border-bottom: 1px solid #ebe8e3;
}

#fs_NewsletterUnsubscribe .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   5. 入力テーブル
========================================================== */

#fs_NewsletterUnsubscribe .fs-c-inputTable {
width: 100%;
}

#fs_NewsletterUnsubscribe .fs-c-inputTable__headerCell {
width: 190px;

padding: 13px 20px 13px 0;

vertical-align: middle;
}

#fs_NewsletterUnsubscribe .fs-c-inputTable__dataCell {
padding: 13px 0;

vertical-align: middle;
}


/* ==========================================================
   6. 項目名
========================================================== */

#fs_NewsletterUnsubscribe .fs-c-inputTable__label {
color: #43372f;

font-size: 15px;
font-weight: 500;
line-height: 1.6;
}


/* 必須 */

#fs_NewsletterUnsubscribe .fs-c-requiredMark {
display: inline-block;

margin-left: 5px;

color: #9a3d35;

font-size: 11px;
font-weight: 400;
}


/* ==========================================================
   7. メールアドレス入力欄
========================================================== */

#fs_NewsletterUnsubscribe #fs_input_mailAddress {
box-sizing: border-box;

width: 100%;
height: 50px;

padding: 0 14px;

color: #333;
background: #fff;

border: 1px solid #cfcac4;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 400;

transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
}


/* 入力中 */

#fs_NewsletterUnsubscribe #fs_input_mailAddress:focus {
outline: none;

border-color: #8a9b59;

box-shadow:
0 0 0 3px rgba(138, 155, 89, 0.15);
}


/* ==========================================================
   8. 停止ボタン
========================================================== */

#fs_NewsletterUnsubscribe .fs-c-buttonContainer--cancel {
margin-top: 30px;

text-align: center;
}

#fs_NewsletterUnsubscribe .fs-c-button--confirmDelete {
box-sizing: border-box;

width: 100%;
max-width: 450px;
min-height: 52px;

padding: 12px 24px;

color: #fff !important;
background: #7d403a !important;

border: 1px solid #7d403a !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 500;

letter-spacing: 0.05em;

cursor: pointer;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_NewsletterUnsubscribe .fs-c-button--confirmDelete:hover {
background: #69352f !important;
border-color: #69352f !important;
}

#fs_NewsletterUnsubscribe .fs-c-button--confirmDelete .fs-c-button__label {
color: #fff !important;
}


/* ==========================================================
   9. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_NewsletterUnsubscribe .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* フォーム */

#fs_NewsletterUnsubscribe .fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 40px;

padding: 24px 18px;

border-radius: 3px;
}


/* 説明文 */

#fs_NewsletterUnsubscribe .fs-c-inputInformation__message {
margin-bottom: 22px;
padding-bottom: 18px;

font-size: 14px;
line-height: 1.8;

text-align: left;
}


/* テーブル → 縦積み */

#fs_NewsletterUnsubscribe .fs-c-inputTable,
#fs_NewsletterUnsubscribe .fs-c-inputTable tbody,
#fs_NewsletterUnsubscribe .fs-c-inputTable tr,
#fs_NewsletterUnsubscribe .fs-c-inputTable__headerCell,
#fs_NewsletterUnsubscribe .fs-c-inputTable__dataCell {
display: block;

width: 100%;
}

#fs_NewsletterUnsubscribe .fs-c-inputTable tr {
margin-bottom: 18px;
}

#fs_NewsletterUnsubscribe .fs-c-inputTable__headerCell {
padding: 0 0 7px;
}

#fs_NewsletterUnsubscribe .fs-c-inputTable__dataCell {
padding: 0;
}


/* 項目名 */

#fs_NewsletterUnsubscribe .fs-c-inputTable__label {
font-size: 14px;
}


/* 入力欄 */

#fs_NewsletterUnsubscribe #fs_input_mailAddress {
height: 50px;

font-size: 16px;
}


/* 停止ボタン */

#fs_NewsletterUnsubscribe .fs-c-buttonContainer--cancel {
margin-top: 24px;
}

#fs_NewsletterUnsubscribe .fs-c-button--confirmDelete {
max-width: none;

min-height: 52px;

font-size: 15px;
}
}

/* ==========================================================
   FutureShop 注文履歴ページ
   対象：#fs_MyOrders
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_MyOrders .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_MyOrders .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. 返品・交換規約エリア
========================================================== */

#fs_MyOrders .fs-p-returnPolicy {
box-sizing: border-box;

max-width: 900px;
margin: 0 auto 45px;
padding: 28px 32px;

background: #f8f7f4;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* 規約各セクション */

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn {
margin: 0;
padding: 22px 0;

border-bottom: 1px solid #e3dfd9;
}

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn:first-child {
padding-top: 0;
}

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn:last-child {
padding-bottom: 0;

border-bottom: 0;
}


/* 規約見出し */

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn__heading {
margin: 0 0 14px;

color: #43372f;

font-size: 17px;
font-weight: 500;
line-height: 1.6;
}


/* 規約本文 */

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn__content {
color: #555;

font-size: 14px;
font-weight: 400;
line-height: 1.9;
}

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn__content p {
margin: 0 0 12px;
}

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn__content p:last-child {
margin-bottom: 0;
}


/* 小見出し */

#fs_MyOrders .fs-p-returnPolicy h3 {
margin: 20px 0 8px;

color: #43372f;

font-size: 15px;
font-weight: 500;
}


/* リスト */

#fs_MyOrders .fs-p-returnPolicy .fs-c-list {
margin: 10px 0 16px;
padding-left: 1.5em;

line-height: 1.8;
}


/* リンク */

#fs_MyOrders .fs-p-returnPolicy a {
color: #59623f;

text-decoration: underline;
text-underline-offset: 3px;
}


/* ==========================================================
   4. 注文履歴エリア
========================================================== */

#fs_MyOrders .fs-c-history {
max-width: 900px;

margin: 0 auto 50px;
}


/* ==========================================================
   5. 年選択・年間集計
========================================================== */

#fs_MyOrders .fs-c-history__info {
box-sizing: border-box;

margin-bottom: 26px;
padding: 24px 26px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* 年選択 */

#fs_MyOrders .fs-c-dropdown__menu {
min-width: 140px;
height: 44px;

padding: 0 38px 0 12px;

color: #333;
background-color: #fff;

border: 1px solid #cfcac4;
border-radius: 3px;

font-family: inherit;
font-size: 15px;
font-weight: 400;
}

#fs_MyOrders .fs-c-dropdown__menu:focus {
outline: none;

border-color: #8a9b59;

box-shadow:
0 0 0 3px rgba(138, 155, 89, 0.15);
}


/* 期間 */

#fs_MyOrders .fs-c-history__term {
color: #555;

font-size: 14px;
font-weight: 400;
line-height: 1.7;
}


/* 年間合計 */

#fs_MyOrders .fs-c-history__total {
color: #333;

font-size: 14px;
}

#fs_MyOrders .fs-c-history__total .fs-c-price__value {
color: #43372f;

font-size: 20px;
font-weight: 500;
}


/* ==========================================================
   6. 件数表示
========================================================== */

#fs_MyOrders .fs-c-listControl {
color: #777;

font-size: 13px;
font-weight: 400;
}


/* ==========================================================
   7. 注文1件のカード
========================================================== */

#fs_MyOrders .fs-c-orderHistoryItem {
box-sizing: border-box;

margin-bottom: 26px;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;

overflow: hidden;
}


/* ==========================================================
   8. 注文カード上部
========================================================== */

#fs_MyOrders .fs-c-orderHistoryItem__header {
padding: 20px 24px;

background: #f7f5f2;

border-bottom: 1px solid #e5e2de;
}


/* ラベル */

#fs_MyOrders .fs-c-orderHistoryItem__header .fs-c-string--label {
color: #777;

font-size: 12px;
font-weight: 400;
}


/* 日付・注文コード */

#fs_MyOrders .fs-c-orderHistoryItem__header dd {
color: #333;

font-size: 14px;
font-weight: 500;
}


/* 合計金額 */

#fs_MyOrders .fs-c-orderHistoryItem__orderSummary .fs-c-price__value {
color: #43372f;

font-size: 18px;
font-weight: 500;
}


/* ==========================================================
   9. 注文詳細を見る
========================================================== */

#fs_MyOrders .fs-c-button--viewOrderHistoryDetail {
box-sizing: border-box;

padding: 9px 18px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-size: 13px;
font-weight: 500;

text-decoration: none;
}

#fs_MyOrders .fs-c-button--viewOrderHistoryDetail:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyOrders .fs-c-button--viewOrderHistoryDetail .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   10. 商品部分
========================================================== */

#fs_MyOrders .fs-c-orderHistoryItem__body {
padding: 24px;
}


/* 商品名 */

#fs_MyOrders .fs-c-listedProductName__name {
color: #43372f;

font-size: 16px;
font-weight: 500;
line-height: 1.65;
}

#fs_MyOrders .fs-c-orderHistoryItem__productName a {
text-decoration: none;
}

#fs_MyOrders .fs-c-orderHistoryItem__productName a:hover .fs-c-listedProductName__name {
color: #59623f;
}


/* 商品画像
   サイズ・配列はFutureShop標準を維持 */

#fs_MyOrders .fs-c-orderHistoryItem__productImage__image {
border-radius: 2px;
}


/* ==========================================================
   11. 価格・数量
========================================================== */

#fs_MyOrders .fs-c-orderHistoryItem__unitPrice .fs-c-price__value {
color: #333;

font-size: 16px;
font-weight: 500;
}

#fs_MyOrders .fs-c-orderHistoryItem__productQuantity {
color: #555;

font-size: 14px;
}

#fs_MyOrders .fs-c-orderHistoryItem__productQuantity__label {
color: #777;

font-size: 12px;
}


/* ==========================================================
   12. 配送状況・送り状番号
========================================================== */

#fs_MyOrders .fs-c-orderHistoryItem__deliveryInfo {
margin-top: 16px;

padding: 14px 16px;

background: #f8f7f4;

border-radius: 3px;

font-size: 13px;
line-height: 1.7;
}

#fs_MyOrders .fs-c-orderHistoryItem__deliveryInfo dt {
color: #777;

font-weight: 400;
}

#fs_MyOrders .fs-c-orderHistoryItem__deliveryInfo dd {
color: #333;

font-weight: 500;
}


/* ==========================================================
   13. レビューを書く
========================================================== */

#fs_MyOrders .fs-c-button--addReview--detail,
#fs_MyOrders .frv-c-button--plain {
box-sizing: border-box;

color: #59623f !important;
background: #fff !important;

border: 1px solid #8a9b59 !important;
border-radius: 3px !important;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif !important;

font-size: 13px !important;
font-weight: 500 !important;

text-decoration: none;
}

#fs_MyOrders .fs-c-button--addReview--detail:hover,
#fs_MyOrders .frv-c-button--plain:hover {
color: #fff !important;
background: #8a9b59 !important;
}

#fs_MyOrders .fs-c-button--addReview--detail .fs-c-button__label,
#fs_MyOrders .frv-c-button--plain .frv-c-button__label {
color: inherit !important;
}


/* ==========================================================
   14. マイページトップ
========================================================== */

#fs_MyOrders .fs-c-buttonContainer--myPageTop {
margin: 40px auto 55px;

text-align: center;
}

#fs_MyOrders .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-size: 14px;
font-weight: 500;

text-decoration: none;
}

#fs_MyOrders .fs-c-button--myPageTop:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyOrders .fs-c-button--myPageTop .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   15. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_MyOrders .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 返品規約 */

#fs_MyOrders .fs-p-returnPolicy {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 32px;

padding: 22px 18px;
}

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn {
padding: 18px 0;
}

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn__heading {
margin-bottom: 10px;

font-size: 16px;
}

#fs_MyOrders .fs-p-returnPolicy .fs-c-documentColumn__content {
font-size: 13px;
line-height: 1.85;
}

#fs_MyOrders .fs-p-returnPolicy h3 {
font-size: 14px;
}


/* 注文履歴 */

#fs_MyOrders .fs-c-history {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
}


/* 年選択・年間集計 */

#fs_MyOrders .fs-c-history__info {
padding: 20px 16px;

margin-bottom: 20px;
}

#fs_MyOrders .fs-c-dropdown__menu {
width: 100%;
height: 46px;

font-size: 14px;
}

#fs_MyOrders .fs-c-history__term {
font-size: 13px;
line-height: 1.7;
}

#fs_MyOrders .fs-c-history__total .fs-c-price__value {
font-size: 18px;
}


/* 注文カード */

#fs_MyOrders .fs-c-orderHistoryItem {
margin-bottom: 20px;
}

#fs_MyOrders .fs-c-orderHistoryItem__header {
padding: 18px 16px;
}

#fs_MyOrders .fs-c-orderHistoryItem__header dd {
font-size: 13px;
}

#fs_MyOrders .fs-c-orderHistoryItem__orderSummary .fs-c-price__value {
font-size: 17px;
}


/* 詳細ボタン */

#fs_MyOrders .fs-c-buttonContainer--viewOrderHistoryDetail {
margin-top: 15px;
}

#fs_MyOrders .fs-c-button--viewOrderHistoryDetail {
width: 100%;

min-height: 44px;

display: flex;
align-items: center;
justify-content: center;

font-size: 13px;
}


/* 商品 */

#fs_MyOrders .fs-c-orderHistoryItem__body {
padding: 18px 16px;
}

#fs_MyOrders .fs-c-listedProductName__name {
font-size: 14px;
line-height: 1.6;
}

#fs_MyOrders .fs-c-orderHistoryItem__unitPrice .fs-c-price__value {
font-size: 15px;
}


/* 配送情報 */

#fs_MyOrders .fs-c-orderHistoryItem__deliveryInfo {
margin-top: 14px;

padding: 12px 13px;

font-size: 12px;
}


/* レビューボタン */

#fs_MyOrders .fs-c-button--addReview--detail,
#fs_MyOrders .frv-c-button--plain {
font-size: 12px !important;
}


/* マイページトップ */

#fs_MyOrders .fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-top: 30px;
margin-bottom: 40px;
}

#fs_MyOrders .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;
}
}


/* ==========================================================
   FutureShop マイページトップ
   対象：#fs_MyPageTop
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_MyPageTop .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_MyPageTop .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. マイページ本体
========================================================== */

#fs_MyPageTop .fs-l-account {
width: 100%;
max-width: 900px;

margin: 0 auto 60px;
}


/* ==========================================================
   4. 会員情報
========================================================== */

#fs_MyPageTop .fs-p-accountInfo {
box-sizing: border-box;

margin-bottom: 30px;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;

overflow: hidden;
}


/* ==========================================================
   5. お客様名
========================================================== */

#fs_MyPageTop .fs-p-accountInfo__header {
padding: 20px 26px;

background: #f7f5f2;

border-bottom: 1px solid #e5e2de;
}

#fs_MyPageTop .fs-p-accountInfo__accountName {
color: #43372f;

line-height: 1.5;
}

#fs_MyPageTop .fs-p-accountInfo__accountName__name {
font-size: 20px;
font-weight: 500;
letter-spacing: 0.03em;
}

#fs_MyPageTop .fs-p-accountInfo__accountName__nameLabel {
margin-left: 4px;

color: #555;

font-size: 14px;
font-weight: 400;
}


/* ==========================================================
   6. ポイント
========================================================== */

#fs_MyPageTop .fs-p-accountInfo__body {
padding: 24px 26px;
}

#fs_MyPageTop .fs-p-accountInfo__point__label {
display: block;

margin-bottom: 6px;

color: #777;

font-size: 13px;
font-weight: 400;
}

#fs_MyPageTop .fs-p-accountInfo__point__point {
display: flex;
align-items: baseline;
flex-wrap: wrap;

gap: 8px;
}


/* ポイント数 */

#fs_MyPageTop .fs-p-accountInfo__point__point__available__number {
color: #43372f;

font-size: 30px;
font-weight: 500;
line-height: 1.3;
}

#fs_MyPageTop .fs-p-accountInfo__point__point__available__numberLabel {
margin-left: 4px;

color: #43372f;

font-size: 14px;
font-weight: 500;
}


/* 付与率 */

#fs_MyPageTop .fs-p-accountInfo__point__point__rate {
color: #777;

font-size: 12px;
font-weight: 400;
}


/* 有効期限 */

#fs_MyPageTop .fs-c-purchasePointExpiration {
margin-top: 8px;

color: #777;

font-size: 12px;
line-height: 1.6;
}


/* ==========================================================
   7. マイページメニュー
========================================================== */

#fs_MyPageTop .fs-c-accountService {
display: grid !important;

grid-template-columns: repeat(3, minmax(0, 1fr));

gap: 14px;

margin: 0 !important;
padding: 0 !important;

list-style: none;
}


/* ==========================================================
   8. 各メニューカード
========================================================== */

#fs_MyPageTop .fs-c-accountService__page {
box-sizing: border-box;

width: auto !important;
margin: 0 !important;
padding: 0 !important;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;

overflow: hidden;

transition:
border-color 0.2s ease,
background 0.2s ease,
transform 0.2s ease;
}


/* カードリンク */

#fs_MyPageTop .fs-c-accountService__pageLink {
box-sizing: border-box;

display: flex !important;
align-items: center;
justify-content: center;

width: 100%;
min-height: 82px;

padding: 16px 14px;

color: #43372f !important;
background: #fff;

text-decoration: none !important;

text-align: center;
}


/* メニュー文字 */

#fs_MyPageTop .fs-c-accountService__pageLink__label,
#fs_MyPageTop .fs-c-accountService__pageLink .fs-c-string--label {
color: inherit !important;

font-size: 14px;
font-weight: 500;
line-height: 1.55;
letter-spacing: 0.02em;
}


/* hover */

#fs_MyPageTop .fs-c-accountService__page:hover {
border-color: #8a9b59;

transform: translateY(-1px);
}

#fs_MyPageTop .fs-c-accountService__page:hover .fs-c-accountService__pageLink {
color: #59623f !important;

background: #f7f8f3;
}


/* ==========================================================
   9. よく使う項目を少し強調
========================================================== */

/* 注文履歴 */

#fs_MyPageTop
.fs-c-accountService__page--orderHistoryList {
border-color: #b7c09a;
}


/* お気に入り */

#fs_MyPageTop
.fs-c-accountService__page--wishList {
border-color: #b7c09a;
}


/* クーポン */

#fs_MyPageTop
.fs-c-accountService__page--couponList {
border-color: #b7c09a;
}


/* ==========================================================
   10. 退会手続き
========================================================== */

#fs_MyPageTop .fs-c-accountService__page--accountDelete {
border-color: #d8c7c4;
}

#fs_MyPageTop
.fs-c-accountService__page--accountDelete
.fs-c-accountService__pageLink {
color: #7d403a !important;

background: #fff;
}

#fs_MyPageTop
.fs-c-accountService__page--accountDelete:hover {
border-color: #b98b84;
}

#fs_MyPageTop
.fs-c-accountService__page--accountDelete:hover
.fs-c-accountService__pageLink {
color: #69352f !important;

background: #faf6f5;
}


/* ==========================================================
   11. タブレット
========================================================== */

@media screen and (max-width: 900px) {

#fs_MyPageTop .fs-l-account {
width: calc(100% - 40px);
}

#fs_MyPageTop .fs-c-accountService {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}


/* ==========================================================
   12. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_MyPageTop .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 全体 */

#fs_MyPageTop .fs-l-account {
width: calc(100% - 30px);

margin-bottom: 40px;
}


/* 会員情報 */

#fs_MyPageTop .fs-p-accountInfo {
margin-bottom: 22px;

border-radius: 3px;
}

#fs_MyPageTop .fs-p-accountInfo__header {
padding: 17px 18px;
}

#fs_MyPageTop .fs-p-accountInfo__body {
padding: 18px;
}


/* お客様名 */

#fs_MyPageTop .fs-p-accountInfo__accountName__name {
font-size: 18px;
}

#fs_MyPageTop .fs-p-accountInfo__accountName__nameLabel {
font-size: 13px;
}


/* ポイント */

#fs_MyPageTop .fs-p-accountInfo__point__label {
font-size: 12px;
}

#fs_MyPageTop .fs-p-accountInfo__point__point__available__number {
font-size: 26px;
}

#fs_MyPageTop .fs-p-accountInfo__point__point__available__numberLabel {
font-size: 13px;
}


/* メニュー
     スマホも2列で一覧性を維持 */

#fs_MyPageTop .fs-c-accountService {
grid-template-columns: repeat(2, minmax(0, 1fr));

gap: 10px;
}

#fs_MyPageTop .fs-c-accountService__pageLink {
min-height: 70px;

padding: 12px 8px;
}

#fs_MyPageTop .fs-c-accountService__pageLink__label,
#fs_MyPageTop .fs-c-accountService__pageLink .fs-c-string--label {
font-size: 13px;
line-height: 1.5;
}
}


/* ==========================================================
   13. 小さいスマートフォン
========================================================== */

@media screen and (max-width: 360px) {

#fs_MyPageTop .fs-c-accountService__pageLink__label,
#fs_MyPageTop .fs-c-accountService__pageLink .fs-c-string--label {
font-size: 12px;
}
}


/* ==========================================================
   FutureShop パスワード変更ページ
   対象：#fs_EditPassword
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_EditPassword .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_EditPassword .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. フォーム全体
========================================================== */

#fs_EditPassword .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 720px;

margin: 0 auto 30px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   4. 説明文
========================================================== */

#fs_EditPassword .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 0 0 22px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.8;

text-align: center;

border-bottom: 1px solid #ebe8e3;
}

#fs_EditPassword .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   5. 入力テーブル
========================================================== */

#fs_EditPassword .fs-c-inputTable {
width: 100%;
}

#fs_EditPassword .fs-c-inputTable__headerCell {
width: 190px;

padding: 13px 20px 13px 0;

vertical-align: middle;
}

#fs_EditPassword .fs-c-inputTable__dataCell {
padding: 13px 0;

vertical-align: middle;
}


/* ==========================================================
   6. 項目ラベル
========================================================== */

#fs_EditPassword .fs-c-inputTable__label {
color: #43372f;

font-size: 15px;
font-weight: 500;
line-height: 1.6;
}


/* 必須 */

#fs_EditPassword .fs-c-requiredMark {
display: inline-block;

margin-left: 5px;

color: #9a3d35;

font-size: 11px;
font-weight: 400;
}


/* ==========================================================
   7. パスワード入力欄
========================================================== */

#fs_EditPassword #fs_input_currentPassword,
#fs_EditPassword #fs_input_newPassword {
box-sizing: border-box;

width: 100%;
height: 50px;

padding: 0 48px 0 14px;

color: #333;
background: #fff;

border: 1px solid #cfcac4;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 400;

transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
}


/* フォーカス */

#fs_EditPassword #fs_input_currentPassword:focus,
#fs_EditPassword #fs_input_newPassword:focus {
outline: none;

border-color: #8a9b59;

box-shadow:
0 0 0 3px rgba(138, 155, 89, 0.15);
}


/* ==========================================================
   8. パスワード表示切替
========================================================== */

#fs_EditPassword .fs-c-inputGroup {
position: relative;
}

#fs_EditPassword .fs-c-button--displayPassword {
opacity: 0.7;

transition: opacity 0.2s ease;
}

#fs_EditPassword .fs-c-button--displayPassword:hover {
opacity: 1;
}


/* ==========================================================
   9. 「変更」ボタン
========================================================== */

#fs_EditPassword .fs-c-buttonContainer--change {
margin-top: 30px;

text-align: center;
}

#fs_EditPassword .fs-c-button--change {
box-sizing: border-box;

width: 100%;
max-width: 450px;
min-height: 52px;

padding: 12px 24px;

color: #fff !important;
background: #43372f !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 500;

letter-spacing: 0.05em;

cursor: pointer;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_EditPassword .fs-c-button--change:hover {
background: #5b4b40 !important;
border-color: #5b4b40 !important;
}

#fs_EditPassword .fs-c-button--change .fs-c-button__label {
color: #fff !important;
}


/* ==========================================================
   10. マイページトップ
========================================================== */

#fs_EditPassword .fs-c-buttonContainer--myPageTop {
width: 100%;
max-width: 720px;

margin: 0 auto 55px;

text-align: center;
}

#fs_EditPassword .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 14px;
font-weight: 500;

letter-spacing: 0.03em;

text-decoration: none;
}

#fs_EditPassword .fs-c-button--myPageTop:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_EditPassword .fs-c-button--myPageTop .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   11. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_EditPassword .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* フォーム */

#fs_EditPassword .fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 22px;

padding: 24px 18px;

border-radius: 3px;
}


/* 説明文 */

#fs_EditPassword .fs-c-inputInformation__message {
margin-bottom: 22px;
padding-bottom: 18px;

font-size: 14px;
line-height: 1.8;

text-align: left;
}


/* テーブルを縦積みに */

#fs_EditPassword .fs-c-inputTable,
#fs_EditPassword .fs-c-inputTable tbody,
#fs_EditPassword .fs-c-inputTable tr,
#fs_EditPassword .fs-c-inputTable__headerCell,
#fs_EditPassword .fs-c-inputTable__dataCell {
display: block;

width: 100%;
}

#fs_EditPassword .fs-c-inputTable tr {
margin-bottom: 20px;
}

#fs_EditPassword .fs-c-inputTable__headerCell {
padding: 0 0 7px;
}

#fs_EditPassword .fs-c-inputTable__dataCell {
padding: 0;
}


/* ラベル */

#fs_EditPassword .fs-c-inputTable__label {
font-size: 14px;
}


/* 入力欄 */

#fs_EditPassword #fs_input_currentPassword,
#fs_EditPassword #fs_input_newPassword {
height: 50px;

font-size: 16px;
}


/* 変更ボタン */

#fs_EditPassword .fs-c-buttonContainer--change {
margin-top: 24px;
}

#fs_EditPassword .fs-c-button--change {
max-width: none;

min-height: 52px;

font-size: 15px;
}


/* マイページトップ */

#fs_EditPassword .fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-bottom: 40px;
}

#fs_EditPassword .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;

font-size: 14px;
}
}


/* ==========================================================
   FutureShop お届け先リスト
   対象：#fs_MyAddressBook
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_MyAddressBook .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_MyAddressBook .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. お届け先リスト全体
========================================================== */

#fs_MyAddressBook .fs-c-addressBookList {
width: 100%;
max-width: 900px;

margin: 0 auto 30px;
}


/* ==========================================================
   4. ご利用方法
========================================================== */

#fs_MyAddressBook .fs-p-announcement {
box-sizing: border-box;

margin-bottom: 28px;
padding: 22px 26px;

background: #f7f5f2;

border: 1px solid #e5e2de;
border-left: 3px solid #8a9b59;
border-radius: 3px;
}

#fs_MyAddressBook .fs-p-announcement__title {
margin: 0 0 12px;

color: #43372f;

font-size: 17px;
font-weight: 500;
line-height: 1.6;
}

#fs_MyAddressBook .fs-p-announcement__body {
color: #555;

font-size: 14px;
font-weight: 400;
line-height: 1.8;
}

#fs_MyAddressBook .fs-p-announcement__body .fs-c-list {
margin: 0;
padding-left: 1.5em;
}

#fs_MyAddressBook .fs-p-announcement__body li {
margin: 3px 0;
}


/* ==========================================================
   5. お届け先追加ボタン
========================================================== */

#fs_MyAddressBook .fs-c-addressBookList__addButton {
margin-bottom: 18px;

text-align: left;
}

#fs_MyAddressBook .fs-c-button--addToAddressbook {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

min-height: 48px;

padding: 10px 24px;

color: #fff !important;
background: #43372f !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-size: 14px;
font-weight: 500;
letter-spacing: 0.03em;

text-decoration: none;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_MyAddressBook .fs-c-button--addToAddressbook:hover {
background: #5b4b40 !important;
border-color: #5b4b40 !important;
}

#fs_MyAddressBook .fs-c-button--addToAddressbook .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   6. 登録件数
========================================================== */

#fs_MyAddressBook .fs-c-addressBookList__count {
margin-bottom: 14px;

color: #777;

font-size: 13px;
font-weight: 400;
}

#fs_MyAddressBook .fs-c-addressBookCount__count {
margin: 0 3px;

color: #43372f;

font-size: 18px;
font-weight: 500;
}


/* ==========================================================
   7. PC：お届け先一覧
========================================================== */

#fs_MyAddressBook .fs-c-addressBookList__list {
width: 100%;

border-collapse: separate;
border-spacing: 0;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;

overflow: hidden;
}

#fs_MyAddressBook .fs-c-addressBookList__list tr {
background: #fff;
}

#fs_MyAddressBook .fs-c-addressBookList__list tr + tr td {
border-top: 1px solid #e8e5e0;
}

#fs_MyAddressBook .fs-c-addressBookList__list td {
padding: 20px 18px;

color: #444;

font-size: 14px;
font-weight: 400;
line-height: 1.75;

vertical-align: middle;
}


/* 氏名 */

#fs_MyAddressBook .fs-c-addressBookList__list td:first-child {
width: 24%;

color: #43372f;

font-size: 15px;
font-weight: 500;
}

#fs_MyAddressBook .fs-c-addressBookList ruby {
line-height: 1.8;
}

#fs_MyAddressBook .fs-c-addressBookList rt {
color: #888;

font-size: 10px;
font-weight: 400;
}


/* ==========================================================
   8. 住所・電話番号
========================================================== */

#fs_MyAddressBook .fs-c-address {
color: #444;

font-size: 14px;
font-weight: 400;
line-height: 1.75;
}

#fs_MyAddressBook .fs-c-address__zipCode {
display: block;

margin-bottom: 2px;

color: #777;

font-size: 13px;
}

#fs_MyAddressBook .fs-c-address__address {
display: block;
}

#fs_MyAddressBook .fs-c-address__tel {
display: block;

margin-top: 5px;

color: #555;

font-size: 13px;
}


/* ==========================================================
   9. 変更・削除ボタン
========================================================== */

#fs_MyAddressBook .fs-c-buttonContainer--deleteChange {
display: flex;

justify-content: flex-end;
align-items: center;

gap: 8px;
}


/* 変更 */

#fs_MyAddressBook .fs-c-button--changeInfomation {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

min-width: 72px;
min-height: 40px;

padding: 7px 14px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-size: 13px;
font-weight: 500;

text-decoration: none;
}

#fs_MyAddressBook .fs-c-button--changeInfomation:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyAddressBook .fs-c-button--changeInfomation .fs-c-button__label {
color: inherit !important;
}


/* 削除 */

#fs_MyAddressBook .fs-c-button--delete {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

min-width: 72px;
min-height: 40px;

padding: 7px 14px;

color: #7d403a !important;
background: #fff !important;

border: 1px solid #c9aaa5 !important;
border-radius: 3px;

font-size: 13px;
font-weight: 500;

cursor: pointer;
}

#fs_MyAddressBook .fs-c-button--delete:hover {
color: #fff !important;
background: #7d403a !important;
border-color: #7d403a !important;
}

#fs_MyAddressBook .fs-c-button--delete .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   10. 登録なし
========================================================== */

#fs_MyAddressBook .fs-c-noResultMessage {
box-sizing: border-box;

padding: 28px 20px;

color: #666;
background: #f7f5f2;

border: 1px solid #e5e2de;
border-radius: 3px;

text-align: center;
}

#fs_MyAddressBook .fs-c-noResultMessage__title {
font-size: 15px;
font-weight: 400;
}


/* ==========================================================
   11. 削除確認モーダル
========================================================== */

#fs_MyAddressBook .fs-c-modal__inner {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

color: #333;

background: #fff;

border-radius: 4px;
}

#fs_MyAddressBook .fs-c-modal__header {
color: #43372f;

font-size: 18px;
font-weight: 500;
}

#fs_MyAddressBook .fs-c-modal__contents {
font-size: 14px;
line-height: 1.8;
}

#fs_MyAddressBook .fs-c-inputTable--inModal .fs-c-inputTable__dataCell {
color: #444;

font-size: 14px;
line-height: 1.7;
}


/* ==========================================================
   12. マイページトップ
========================================================== */

#fs_MyAddressBook .fs-c-buttonContainer--myPageTop {
width: 100%;
max-width: 900px;

margin: 35px auto 55px;

text-align: center;
}

#fs_MyAddressBook .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-size: 14px;
font-weight: 500;

text-decoration: none;
}

#fs_MyAddressBook .fs-c-button--myPageTop:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyAddressBook .fs-c-button--myPageTop .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   13. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_MyAddressBook .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 全体 */

#fs_MyAddressBook .fs-c-addressBookList {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
}


/* ご利用方法 */

#fs_MyAddressBook .fs-p-announcement {
margin-bottom: 22px;

padding: 18px 16px;
}

#fs_MyAddressBook .fs-p-announcement__title {
margin-bottom: 9px;

font-size: 16px;
}

#fs_MyAddressBook .fs-p-announcement__body {
font-size: 13px;
line-height: 1.8;
}


/* 追加ボタン */

#fs_MyAddressBook .fs-c-addressBookList__addButton {
margin-bottom: 15px;
}

#fs_MyAddressBook .fs-c-button--addToAddressbook {
width: 100%;
min-height: 48px;

font-size: 14px;
}


/* 登録件数 */

#fs_MyAddressBook .fs-c-addressBookList__count {
margin-bottom: 12px;

font-size: 12px;
}


/* ========================================================
     一覧テーブル → 1住所1カード
  ======================================================== */

#fs_MyAddressBook .fs-c-addressBookList__list,
#fs_MyAddressBook .fs-c-addressBookList__list tbody {
display: block;

width: 100%;

border: 0;
background: transparent;

overflow: visible;
}

#fs_MyAddressBook .fs-c-addressBookList__list tr {
display: block;

box-sizing: border-box;

width: 100%;

margin-bottom: 14px;
padding: 18px 16px;

background: #fff;

border: 1px solid #ddd9d3 !important;
border-radius: 4px;
}

#fs_MyAddressBook .fs-c-addressBookList__list tr + tr td {
border-top: 0;
}

#fs_MyAddressBook .fs-c-addressBookList__list td {
display: block;

box-sizing: border-box;

width: 100% !important;

padding: 0;

border: 0;

text-align: left;
}


/* 氏名 */

#fs_MyAddressBook .fs-c-addressBookList__list td:first-child {
width: 100%;

margin-bottom: 10px;
padding-bottom: 10px;

color: #43372f;

font-size: 16px;
font-weight: 500;

border-bottom: 1px solid #ebe8e3;
}


/* 住所 */

#fs_MyAddressBook .fs-c-addressBookList__list td:nth-child(2) {
margin-bottom: 15px;
}

#fs_MyAddressBook .fs-c-address {
font-size: 14px;
line-height: 1.75;
}


/* 変更・削除 */

#fs_MyAddressBook .fs-c-addressBookList__list td:last-child {
padding-top: 13px;

border-top: 1px solid #ebe8e3;
}

#fs_MyAddressBook .fs-c-buttonContainer--deleteChange {
display: grid;

grid-template-columns: 1fr 1fr;

gap: 8px;

width: 100%;
}

#fs_MyAddressBook .fs-c-button--changeInfomation,
#fs_MyAddressBook .fs-c-button--delete {
width: 100%;
min-width: 0;
min-height: 42px;

font-size: 13px;
}


/* マイページトップ */

#fs_MyAddressBook .fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-top: 28px;
margin-bottom: 40px;
}

#fs_MyAddressBook .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;
}
}


/* ==========================================================
   FutureShop ポイント履歴
   対象：#fs_MyPoints
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_MyPoints .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_MyPoints .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. ポイント履歴全体
========================================================== */

#fs_MyPoints .fs-c-history {
width: 100%;
max-width: 900px;

margin: 0 auto 40px;
}


/* ==========================================================
   4. ポイントサマリー
========================================================== */

#fs_MyPoints .fs-c-history__info {
box-sizing: border-box;

margin-bottom: 28px;
padding: 28px;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;
}


/* 4項目をカード状に */

#fs_MyPoints .fs-c-pointSummary {
display: grid;

grid-template-columns: repeat(4, minmax(0, 1fr));

gap: 0;

margin: 0;
}


/* ラベル */

#fs_MyPoints .fs-c-pointSummary > dt {
grid-row: 1;

margin: 0;
padding: 0 14px 8px;

color: #777;

font-size: 12px;
font-weight: 400;
line-height: 1.5;

text-align: center;
}


/* 数値 */

#fs_MyPoints .fs-c-pointSummary > dd {
grid-row: 2;

margin: 0;
padding: 0 14px;

color: #43372f;

text-align: center;

border-right: 1px solid #e5e2de;
}

#fs_MyPoints .fs-c-pointSummary > dd:last-of-type {
border-right: 0;
}


/* ポイント数字 */

#fs_MyPoints .fs-c-pointSummary__number {
color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.35;
}


/* ==========================================================
   5. 年選択
========================================================== */

#fs_MyPoints .fs-c-history__termCtrl {
margin-bottom: 18px;
}

#fs_MyPoints .fs-c-dropdown__menu {
box-sizing: border-box;

min-width: 150px;
height: 44px;

padding: 0 38px 0 12px;

color: #333;
background-color: #fff;

border: 1px solid #cfcac4;
border-radius: 3px;

font-family: inherit;

font-size: 15px;
font-weight: 400;
}

#fs_MyPoints .fs-c-dropdown__menu:focus {
outline: none;

border-color: #8a9b59;

box-shadow:
0 0 0 3px rgba(138, 155, 89, 0.15);
}


/* ==========================================================
   6. 件数
========================================================== */

#fs_MyPoints .fs-c-listControl {
margin: 10px 0;

color: #777;

font-size: 13px;
font-weight: 400;
}


/* ==========================================================
   7. ポイント履歴テーブル
========================================================== */

#fs_MyPoints .fs-c-pointListTable {
width: 100%;

border-collapse: separate;
border-spacing: 0;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;

overflow: hidden;
}


/* 見出し */

#fs_MyPoints .fs-c-pointListTable thead th {
padding: 14px 12px;

color: #43372f;
background: #f7f5f2;

border-bottom: 1px solid #ddd9d3;

font-size: 13px;
font-weight: 500;
line-height: 1.5;

text-align: left;
}


/* データ */

#fs_MyPoints .fs-c-pointListTable tbody td {
padding: 17px 12px;

color: #444;

border-bottom: 1px solid #ebe8e3;

font-size: 14px;
font-weight: 400;
line-height: 1.7;

vertical-align: middle;
}

#fs_MyPoints .fs-c-pointListTable tbody tr:last-child td {
border-bottom: 0;
}


/* ==========================================================
   8. 注文コード
========================================================== */

#fs_MyPoints .fs-c-pointListTable__dataDetail {
margin-top: 5px;

color: #777;

font-size: 11px;
line-height: 1.6;
}

#fs_MyPoints .fs-c-pointListTable__dataDetail a {
color: #59623f;

font-weight: 500;

text-decoration: underline;
text-underline-offset: 2px;
}

#fs_MyPoints .fs-c-pointListTable__dataDetail a:hover {
color: #43372f;
}


/* ==========================================================
   9. ポイント増減
========================================================== */

#fs_MyPoints .fs-c-symbol--plus {
color: #59623f;

font-weight: 500;
}


/* ==========================================================
   10. マイページトップ
========================================================== */

#fs_MyPoints .fs-c-buttonContainer--myPageTop {
width: 100%;
max-width: 900px;

margin: 35px auto 55px;

text-align: center;
}

#fs_MyPoints .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family: inherit;

font-size: 14px;
font-weight: 500;

text-decoration: none;
}

#fs_MyPoints .fs-c-button--myPageTop:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyPoints .fs-c-button--myPageTop .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   11. タブレット
========================================================== */

@media screen and (max-width: 900px) {

#fs_MyPoints .fs-c-history {
width: calc(100% - 40px);
}

#fs_MyPoints .fs-c-buttonContainer--myPageTop {
width: calc(100% - 40px);
}
}


/* ==========================================================
   12. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_MyPoints .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 全体 */

#fs_MyPoints .fs-c-history {
width: calc(100% - 30px);

margin-bottom: 30px;
}


/* ========================================================
     ポイントサマリー
     スマホは2列×2段
  ======================================================== */

#fs_MyPoints .fs-c-history__info {
margin-bottom: 22px;

padding: 0;

overflow: hidden;
}

#fs_MyPoints .fs-c-pointSummary {
display: grid;

grid-template-columns: repeat(2, minmax(0, 1fr));

gap: 0;
}

#fs_MyPoints .fs-c-pointSummary > dt,
#fs_MyPoints .fs-c-pointSummary > dd {
grid-row: auto;

box-sizing: border-box;

text-align: center;
}

/*
     FutureShopのDLは
     dt → dd → dt → dd...
     の順番なので、スマホではcontents化して
     各項目を自然に配置
  */

#fs_MyPoints .fs-c-pointSummary {
grid-auto-flow: row;
}

#fs_MyPoints .fs-c-pointSummary > dt {
padding: 16px 8px 4px;

color: #777;

font-size: 11px;

border-right: 1px solid #e5e2de;
}

#fs_MyPoints .fs-c-pointSummary > dd {
padding: 0 8px 16px;

border-right: 1px solid #e5e2de;
border-bottom: 1px solid #e5e2de;
}

#fs_MyPoints .fs-c-pointSummary__number {
font-size: 24px;
}


/* 年選択 */

#fs_MyPoints .fs-c-history__termCtrl {
margin-bottom: 15px;
}

#fs_MyPoints .fs-c-dropdown__menu {
width: 100%;
height: 46px;

font-size: 14px;
}


/* 件数 */

#fs_MyPoints .fs-c-listControl {
font-size: 12px;
}


/* ========================================================
     履歴表 → 1履歴1カード
  ======================================================== */

#fs_MyPoints .fs-c-pointListTable,
#fs_MyPoints .fs-c-pointListTable tbody {
display: block;

width: 100%;

border: 0;
background: transparent;

overflow: visible;
}

#fs_MyPoints .fs-c-pointListTable thead {
display: none;
}

#fs_MyPoints .fs-c-pointListTable tbody tr {
display: block;

box-sizing: border-box;

width: 100%;

margin-bottom: 14px;
padding: 16px;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;
}

#fs_MyPoints .fs-c-pointListTable tbody td {
display: grid;

grid-template-columns: 115px minmax(0, 1fr);

gap: 10px;

width: 100%;

padding: 8px 0;

border: 0;
border-bottom: 1px solid #ebe8e3;

font-size: 13px;
line-height: 1.6;
}

#fs_MyPoints .fs-c-pointListTable tbody td:last-child {
border-bottom: 0;
}


/* aria-labelをスマホの項目名として表示 */

#fs_MyPoints .fs-c-pointListTable tbody td::before {
content: attr(aria-label);

color: #777;

font-size: 11px;
font-weight: 500;
line-height: 1.6;
}


/* ポイント値 */

#fs_MyPoints .fs-c-pointListTable tbody td[aria-label="獲得・利用ポイント"] {
color: #43372f;

font-size: 15px;
font-weight: 500;
}


/* マイページトップ */

#fs_MyPoints .fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-top: 28px;
margin-bottom: 40px;
}

#fs_MyPoints .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;
}
}

/* ==========================================================
   FutureShop 会員情報詳細
   対象：#fs_MyAccountSettings
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_MyAccountSettings .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_MyAccountSettings .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. 会員情報全体
========================================================== */

#fs_MyAccountSettings .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 800px;

margin: 0 auto 30px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   4. 冒頭説明
========================================================== */

#fs_MyAccountSettings .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 0 0 22px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.8;

text-align: center;

border-bottom: 1px solid #ebe8e3;
}

#fs_MyAccountSettings .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   5. 会員情報テーブル
========================================================== */

#fs_MyAccountSettings .fs-c-inputTable {
width: 100%;

border-collapse: separate;
border-spacing: 0;

border: 1px solid #e5e2de;
border-radius: 4px;

overflow: hidden;
}


/* 各行 */

#fs_MyAccountSettings .fs-c-inputTable tr + tr th,
#fs_MyAccountSettings .fs-c-inputTable tr + tr td {
border-top: 1px solid #ebe8e3;
}


/* ==========================================================
   6. 項目名
========================================================== */

#fs_MyAccountSettings .fs-c-inputTable__headerCell {
box-sizing: border-box;

width: 220px;

padding: 15px 18px;

color: #5e554e;
background: #f7f5f2;

font-size: 13px;
font-weight: 500;
line-height: 1.6;

text-align: left;
vertical-align: middle;

border-right: 1px solid #ebe8e3;
}


/* ==========================================================
   7. 登録内容
========================================================== */

#fs_MyAccountSettings .fs-c-inputTable__dataCell {
box-sizing: border-box;

padding: 15px 20px;

color: #333;
background: #fff;

font-size: 15px;
font-weight: 400;
line-height: 1.7;

vertical-align: middle;
}

#fs_MyAccountSettings .fs-c-confirmation__data {
color: #333;

font-size: 15px;
font-weight: 400;
line-height: 1.7;

overflow-wrap: anywhere;
}


/* 空欄でも行高を安定させる */

#fs_MyAccountSettings .fs-c-confirmation__data:empty::after {
content: "—";

color: #aaa;
}


/* ==========================================================
   8. 「変更」ボタン
========================================================== */

#fs_MyAccountSettings .fs-c-buttonContainer--change {
margin-top: 30px;

text-align: center;
}

#fs_MyAccountSettings .fs-c-button--change {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 450px;
min-height: 52px;

padding: 12px 24px;

color: #fff !important;
background: #43372f !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 500;

letter-spacing: 0.05em;

text-decoration: none;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_MyAccountSettings .fs-c-button--change:hover {
background: #5b4b40 !important;
border-color: #5b4b40 !important;
}

#fs_MyAccountSettings .fs-c-button--change .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   9. マイページトップ
========================================================== */

#fs_MyAccountSettings .fs-c-buttonContainer--myPageTop {
width: 100%;
max-width: 800px;

margin: 0 auto 55px;

text-align: center;
}

#fs_MyAccountSettings .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 14px;
font-weight: 500;

text-decoration: none;
}

#fs_MyAccountSettings .fs-c-button--myPageTop:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyAccountSettings .fs-c-button--myPageTop .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   10. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_MyAccountSettings .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 会員情報全体 */

#fs_MyAccountSettings .fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 22px;

padding: 24px 18px;

border-radius: 3px;
}


/* 説明 */

#fs_MyAccountSettings .fs-c-inputInformation__message {
margin-bottom: 22px;
padding-bottom: 18px;

font-size: 14px;
line-height: 1.8;

text-align: left;
}


/* ========================================================
     PCの2列表 → スマホでは
     項目名
     登録内容
     の縦積み
  ======================================================== */

#fs_MyAccountSettings .fs-c-inputTable,
#fs_MyAccountSettings .fs-c-inputTable tbody,
#fs_MyAccountSettings .fs-c-inputTable tr,
#fs_MyAccountSettings .fs-c-inputTable__headerCell,
#fs_MyAccountSettings .fs-c-inputTable__dataCell {
display: block;

box-sizing: border-box;

width: 100%;
}

#fs_MyAccountSettings .fs-c-inputTable {
border: 0;
border-radius: 0;

overflow: visible;
}


/* 1項目＝1ブロック */

#fs_MyAccountSettings .fs-c-inputTable tr {
margin-bottom: 10px;

border: 1px solid #e5e2de;
border-radius: 3px;

overflow: hidden;
}

#fs_MyAccountSettings .fs-c-inputTable tr + tr th,
#fs_MyAccountSettings .fs-c-inputTable tr + tr td {
border-top: 0;
}


/* 項目名 */

#fs_MyAccountSettings .fs-c-inputTable__headerCell {
padding: 9px 13px;

color: #6d655e;
background: #f7f5f2;

border: 0;
border-bottom: 1px solid #ebe8e3;

font-size: 11px;
font-weight: 500;
line-height: 1.5;
}


/* 登録内容 */

#fs_MyAccountSettings .fs-c-inputTable__dataCell {
padding: 11px 13px;

background: #fff;

font-size: 14px;
line-height: 1.65;
}

#fs_MyAccountSettings .fs-c-confirmation__data {
font-size: 14px;
line-height: 1.65;
}


/* 変更 */

#fs_MyAccountSettings .fs-c-buttonContainer--change {
margin-top: 24px;
}

#fs_MyAccountSettings .fs-c-button--change {
max-width: none;

min-height: 52px;

font-size: 15px;
}


/* マイページトップ */

#fs_MyAccountSettings .fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-bottom: 40px;
}

#fs_MyAccountSettings .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;

font-size: 14px;
}
}

/* ==========================================================
   FutureShop ログイン連携
   対象：#fs_MyLinkedAccounts
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_MyLinkedAccounts .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_MyLinkedAccounts .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. ログイン連携エリア全体
========================================================== */

#fs_MyLinkedAccounts .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 720px;

margin: 0 auto 30px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   4. 説明文
========================================================== */

#fs_MyLinkedAccounts .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 0 0 22px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.85;

text-align: left;

border-bottom: 1px solid #ebe8e3;
}

#fs_MyLinkedAccounts .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   5. 連携サービス一覧
========================================================== */

#fs_MyLinkedAccounts .fs-c-linkServicesList {
width: 100%;
}


/* ==========================================================
   6. サービス1件
========================================================== */

#fs_MyLinkedAccounts .fs-c-linkService {
box-sizing: border-box;

display: grid;

grid-template-columns:
minmax(140px, 1fr)
auto
auto;

align-items: center;

gap: 20px;

width: 100%;

padding: 20px 22px;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;
}


/* ==========================================================
   7. サービス名
========================================================== */

#fs_MyLinkedAccounts .fs-c-linkService__service {
min-width: 0;
}

#fs_MyLinkedAccounts .fs-c-linkService__service__label {
color: #43372f;

font-size: 17px;
font-weight: 500;
line-height: 1.5;
}


/* ==========================================================
   8. 連携状態
========================================================== */

#fs_MyLinkedAccounts .fs-c-linkService__status {
white-space: nowrap;
}


/* 「連携中」 */

#fs_MyLinkedAccounts .fs-c-linkService.is-linked
.fs-c-linkService__status__label {
display: inline-flex;
align-items: center;

padding: 5px 11px;

color: #59623f;
background: #f2f5ea;

border: 1px solid #cbd4b3;
border-radius: 20px;

font-size: 12px;
font-weight: 500;
line-height: 1.4;
}


/* 連携中の印 */

#fs_MyLinkedAccounts .fs-c-linkService.is-linked
.fs-c-linkService__status__label::before {
content: "●";

margin-right: 6px;

color: #8a9b59;

font-size: 8px;
}


/* ==========================================================
   9. 「停止する」ボタン
========================================================== */

#fs_MyLinkedAccounts .fs-c-button--revokeLinkedService {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

min-width: 100px;
min-height: 42px;

padding: 8px 16px;

color: #7d403a !important;
background: #fff !important;

border: 1px solid #c9aaa5 !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 13px;
font-weight: 500;

cursor: pointer;

transition:
color 0.2s ease,
background 0.2s ease,
border-color 0.2s ease;
}

#fs_MyLinkedAccounts .fs-c-button--revokeLinkedService:hover {
color: #fff !important;
background: #7d403a !important;
border-color: #7d403a !important;
}

#fs_MyLinkedAccounts
.fs-c-button--revokeLinkedService
.fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   10. 連携解除確認モーダル
========================================================== */

#fs_MyLinkedAccounts .fs-c-modal--linkedAccounts-revoke
.fs-c-modal__inner {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

color: #333;

background: #fff;

border-radius: 4px;
}


/* モーダルタイトル */

#fs_MyLinkedAccounts .fs-c-modal--linkedAccounts-revoke
.fs-c-modal__header {
color: #43372f;

font-size: 18px;
font-weight: 500;
line-height: 1.6;
}


/* モーダル本文 */

#fs_MyLinkedAccounts .fs-c-modal--linkedAccounts-revoke
.fs-c-modal__contents {
color: #444;

font-size: 14px;
line-height: 1.8;
}


/* サービス名 */

#fs_MyLinkedAccounts .fs-c-revokeLinkedAccount__service {
color: #43372f;

font-weight: 500;
}


/* 注意事項 */

#fs_MyLinkedAccounts .fs-c-revokeLinkedAccount__note {
margin-top: 16px;
padding: 14px 16px;

color: #666;
background: #f7f5f2;

border-left: 3px solid #8a9b59;

font-size: 13px;
line-height: 1.8;
}


/* ==========================================================
   11. モーダル内ボタン
========================================================== */

#fs_MyLinkedAccounts .fs-c-modal--linkedAccounts-revoke
.fs-c-buttonContainer--pair {
gap: 10px;

margin-top: 24px;
}


/* ==========================================================
   12. マイページトップ
========================================================== */

#fs_MyLinkedAccounts .fs-c-buttonContainer--myPageTop {
width: 100%;
max-width: 720px;

margin: 0 auto 55px;

text-align: center;
}

#fs_MyLinkedAccounts .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 14px;
font-weight: 500;

text-decoration: none;
}

#fs_MyLinkedAccounts .fs-c-button--myPageTop:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyLinkedAccounts
.fs-c-button--myPageTop
.fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   13. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_MyLinkedAccounts .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 全体 */

#fs_MyLinkedAccounts
.fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 22px;

padding: 24px 18px;

border-radius: 3px;
}


/* 説明 */

#fs_MyLinkedAccounts .fs-c-inputInformation__message {
margin-bottom: 22px;
padding-bottom: 18px;

font-size: 14px;
line-height: 1.8;
}


/* ========================================================
     サービスカード
  ======================================================== */

#fs_MyLinkedAccounts .fs-c-linkService {
display: grid;

grid-template-columns: 1fr auto;

gap: 10px 12px;

padding: 18px 16px;
}


/* Amazon */

#fs_MyLinkedAccounts .fs-c-linkService__service {
grid-column: 1;
grid-row: 1;
}

#fs_MyLinkedAccounts .fs-c-linkService__service__label {
font-size: 16px;
}


/* 連携中 */

#fs_MyLinkedAccounts .fs-c-linkService__status {
grid-column: 2;
grid-row: 1;

align-self: center;
}


/* 停止ボタン */

#fs_MyLinkedAccounts .fs-c-linkService__button {
grid-column: 1 / -1;
grid-row: 2;

margin-top: 7px;
padding-top: 12px;

border-top: 1px solid #ebe8e3;
}

#fs_MyLinkedAccounts
.fs-c-linkService__button
.fs-c-buttonContainer {
width: 100%;
}

#fs_MyLinkedAccounts .fs-c-button--revokeLinkedService {
width: 100%;

min-height: 44px;

font-size: 13px;
}


/* マイページトップ */

#fs_MyLinkedAccounts .fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-bottom: 40px;
}

#fs_MyLinkedAccounts .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;

font-size: 14px;
}
}

/* ==========================================================
   FutureShop 退会手続き
   対象：#fs_DeleteAccount
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_DeleteAccount .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_DeleteAccount .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. 退会手続き全体
========================================================== */

#fs_DeleteAccount .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 800px;

margin: 0 auto 30px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   4. 説明文
========================================================== */

#fs_DeleteAccount .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 18px 20px;

color: #654b47;
background: #faf6f5;

border: 1px solid #eadbd8;
border-left: 3px solid #9a5b53;
border-radius: 3px;

font-size: 15px;
font-weight: 400;
line-height: 1.8;

text-align: left;
}

#fs_DeleteAccount .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   5. 登録情報テーブル
========================================================== */

#fs_DeleteAccount .fs-c-inputTable {
width: 100%;

border-collapse: separate;
border-spacing: 0;

border: 1px solid #e5e2de;
border-radius: 4px;

overflow: hidden;
}


/* 行 */

#fs_DeleteAccount .fs-c-inputTable tr + tr th,
#fs_DeleteAccount .fs-c-inputTable tr + tr td {
border-top: 1px solid #ebe8e3;
}


/* ==========================================================
   6. 項目名
========================================================== */

#fs_DeleteAccount .fs-c-inputTable__headerCell {
box-sizing: border-box;

width: 220px;

padding: 15px 18px;

color: #5e554e;
background: #f7f5f2;

border-right: 1px solid #ebe8e3;

font-size: 13px;
font-weight: 500;
line-height: 1.6;

text-align: left;
vertical-align: middle;
}


/* ==========================================================
   7. 登録内容
========================================================== */

#fs_DeleteAccount .fs-c-inputTable__dataCell {
box-sizing: border-box;

padding: 15px 20px;

color: #333;
background: #fff;

font-size: 15px;
font-weight: 400;
line-height: 1.7;

vertical-align: middle;
}

#fs_DeleteAccount .fs-c-confirmation__data {
color: #333;

font-size: 15px;
font-weight: 400;
line-height: 1.7;

overflow-wrap: anywhere;
}


/* 空欄 */

#fs_DeleteAccount .fs-c-confirmation__data:empty::after {
content: "—";

color: #aaa;
}


/* ==========================================================
   8. 退会・キャンセルエリア
========================================================== */

#fs_DeleteAccount .fs-c-buttonContainer--leaveCancel {
display: flex;

justify-content: center;
align-items: center;

gap: 12px;

margin-top: 32px;
}


/* ==========================================================
   9. 退会する
========================================================== */

#fs_DeleteAccount .fs-c-button--confirmLeave {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 220px;
min-height: 50px;

padding: 10px 20px;

color: #fff !important;
background: #7d403a !important;

border: 1px solid #7d403a !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 15px;
font-weight: 500;

letter-spacing: 0.04em;

cursor: pointer;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_DeleteAccount .fs-c-button--confirmLeave:hover {
background: #69352f !important;
border-color: #69352f !important;
}

#fs_DeleteAccount .fs-c-button--confirmLeave .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   10. キャンセル
========================================================== */

#fs_DeleteAccount .fs-c-button--cancel {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 220px;
min-height: 50px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 15px;
font-weight: 500;

letter-spacing: 0.04em;

text-decoration: none;

transition:
color 0.2s ease,
background 0.2s ease;
}

#fs_DeleteAccount .fs-c-button--cancel:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_DeleteAccount .fs-c-button--cancel .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   11. マイページトップ
========================================================== */

#fs_DeleteAccount .fs-c-buttonContainer--myPageTop {
width: 100%;
max-width: 800px;

margin: 0 auto 55px;

text-align: center;
}

#fs_DeleteAccount .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #c9c3bd !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 14px;
font-weight: 500;

text-decoration: none;
}

#fs_DeleteAccount .fs-c-button--myPageTop:hover {
border-color: #43372f !important;
background: #f7f5f2 !important;
}

#fs_DeleteAccount .fs-c-button--myPageTop .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   12. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_DeleteAccount .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 全体 */

#fs_DeleteAccount .fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 22px;

padding: 24px 18px;

border-radius: 3px;
}


/* 注意文 */

#fs_DeleteAccount .fs-c-inputInformation__message {
margin-bottom: 22px;

padding: 15px 14px;

font-size: 14px;
line-height: 1.8;
}


/* ========================================================
     登録情報を縦積み
  ======================================================== */

#fs_DeleteAccount .fs-c-inputTable,
#fs_DeleteAccount .fs-c-inputTable tbody,
#fs_DeleteAccount .fs-c-inputTable tr,
#fs_DeleteAccount .fs-c-inputTable__headerCell,
#fs_DeleteAccount .fs-c-inputTable__dataCell {
display: block;

box-sizing: border-box;

width: 100%;
}

#fs_DeleteAccount .fs-c-inputTable {
border: 0;
border-radius: 0;

overflow: visible;
}

#fs_DeleteAccount .fs-c-inputTable tr {
margin-bottom: 10px;

border: 1px solid #e5e2de;
border-radius: 3px;

overflow: hidden;
}

#fs_DeleteAccount .fs-c-inputTable tr + tr th,
#fs_DeleteAccount .fs-c-inputTable tr + tr td {
border-top: 0;
}


/* 項目名 */

#fs_DeleteAccount .fs-c-inputTable__headerCell {
padding: 9px 13px;

color: #6d655e;
background: #f7f5f2;

border: 0;
border-bottom: 1px solid #ebe8e3;

font-size: 11px;
font-weight: 500;
}


/* 登録内容 */

#fs_DeleteAccount .fs-c-inputTable__dataCell {
padding: 11px 13px;

font-size: 14px;
line-height: 1.65;
}

#fs_DeleteAccount .fs-c-confirmation__data {
font-size: 14px;
line-height: 1.65;
}


/* ========================================================
     操作ボタン
  ======================================================== */

#fs_DeleteAccount .fs-c-buttonContainer--leaveCancel {
display: flex;

flex-direction: column;

gap: 10px;

width: 100%;

margin-top: 26px;
}


/* キャンセルを先に表示
     誤操作防止 */

#fs_DeleteAccount .fs-c-button--cancel {
order: 1;

width: 100%;
min-height: 50px;

font-size: 14px;
}


/* 退会は下 */

#fs_DeleteAccount .fs-c-button--confirmLeave {
order: 2;

width: 100%;
min-height: 50px;

font-size: 14px;
}


/* マイページトップ */

#fs_DeleteAccount .fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-bottom: 40px;
}

#fs_DeleteAccount .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;

font-size: 14px;
}
}

/* ==========================================================
   FutureShop クレジットカード一覧
   対象：#fs_MyCreditCards
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_MyCreditCards .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_MyCreditCards .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. クレジットカードエリア
========================================================== */

#fs_MyCreditCards .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 800px;

margin: 0 auto 30px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   4. 説明文
========================================================== */

#fs_MyCreditCards .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 0 0 22px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.8;

text-align: center;

border-bottom: 1px solid #ebe8e3;
}

#fs_MyCreditCards .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   5. カード一覧
========================================================== */

#fs_MyCreditCards .fs-c-creditCardList {
display: grid;

grid-template-columns: repeat(2, minmax(0, 1fr));

gap: 16px;

width: 100%;
}


/* ==========================================================
   6. 登録カード
========================================================== */

#fs_MyCreditCards .fs-c-creditCardListItem {
box-sizing: border-box;

position: relative;

display: flex;
flex-direction: column;

min-width: 0;
min-height: 210px;

padding: 22px;

background: #fff;

border: 1px solid #ddd9d3;
border-radius: 4px;
}


/* 通常使用カード */

#fs_MyCreditCards .fs-c-creditCardListItem.is-active {
border-color: #b7c09a;

background: #fdfefb;
}


/* ==========================================================
   7. 「通常使用するカード」
========================================================== */

#fs_MyCreditCards .fs-c-creditCardListItem__status {
margin-bottom: 18px;
}

#fs_MyCreditCards .fs-c-creditCardListItem__status__label {
display: inline-flex;
align-items: center;

padding: 5px 11px;

color: #59623f;
background: #f2f5ea;

border: 1px solid #cbd4b3;
border-radius: 20px;

font-size: 11px;
font-weight: 500;
line-height: 1.4;
}

#fs_MyCreditCards .fs-c-creditCardListItem__status__label::before {
content: "●";

margin-right: 6px;

color: #8a9b59;

font-size: 8px;
}


/* ==========================================================
   8. カード情報
========================================================== */

#fs_MyCreditCards .fs-c-creditCardListItem__cardInfo {
display: grid;

grid-template-columns: 110px minmax(0, 1fr);

gap: 12px 14px;

margin: 0 0 20px;
}


/* 項目名 */

#fs_MyCreditCards .fs-c-creditCardListItem__cardInfo dt {
margin: 0;

color: #777;

font-size: 12px;
font-weight: 400;
line-height: 1.6;
}


/* 登録内容 */

#fs_MyCreditCards .fs-c-creditCardListItem__cardInfo dd {
margin: 0;

color: #333;

font-size: 14px;
font-weight: 500;
line-height: 1.6;

overflow-wrap: anywhere;
}


/* ==========================================================
   9. ブランド・カード番号
========================================================== */

#fs_MyCreditCards .fs-c-creditCard {
display: flex;
flex-wrap: wrap;
align-items: center;

gap: 7px;
}


/* AMEX / VISA等 */

#fs_MyCreditCards .fs-c-creditCard__company {
display: inline-block;

padding: 2px 7px;

color: #43372f;
background: #f7f5f2;

border: 1px solid #ddd9d3;
border-radius: 2px;

font-size: 11px;
font-weight: 500;
}


/* マスク済みカード番号 */

#fs_MyCreditCards .fs-c-creditCard__number {
color: #333;

font-size: 14px;
font-weight: 500;

letter-spacing: 0.04em;
}


/* ==========================================================
   10. 有効期限
========================================================== */

#fs_MyCreditCards .fs-c-creditCardExpiration__date {
color: #43372f;

font-size: 14px;
font-weight: 500;
}


/* ==========================================================
   11. カード操作
========================================================== */

#fs_MyCreditCards .fs-c-creditCardListItem__button {
display: flex;

flex-wrap: wrap;

gap: 8px;

margin-top: auto;
padding-top: 17px;

border-top: 1px solid #ebe8e3;
}


/* ==========================================================
   12. 削除ボタン
========================================================== */

#fs_MyCreditCards .fs-c-creditCardListItem
.fs-c-button--delete {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

min-width: 90px;
min-height: 40px;

padding: 7px 15px;

color: #7d403a !important;
background: #fff !important;

border: 1px solid #c9aaa5 !important;
border-radius: 3px;

font-family: inherit;

font-size: 13px;
font-weight: 500;

cursor: pointer;
}

#fs_MyCreditCards .fs-c-creditCardListItem
.fs-c-button--delete:hover {
color: #fff !important;
background: #7d403a !important;

border-color: #7d403a !important;
}

#fs_MyCreditCards .fs-c-creditCardListItem
.fs-c-button--delete .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   13. その他カード操作
   「通常使用するカードにする」等
========================================================== */

#fs_MyCreditCards .fs-c-creditCardListItem__button
button:not(.fs-c-button--delete) {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

min-height: 40px;

padding: 7px 15px;

color: #59623f !important;
background: #fff !important;

border: 1px solid #8a9b59 !important;
border-radius: 3px;

font-family: inherit;

font-size: 13px;
font-weight: 500;

cursor: pointer;
}

#fs_MyCreditCards .fs-c-creditCardListItem__button
button:not(.fs-c-button--delete):hover {
color: #fff !important;
background: #8a9b59 !important;
}

#fs_MyCreditCards .fs-c-creditCardListItem__button
button:not(.fs-c-button--delete) .fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   14. 削除確認モーダル
========================================================== */

#fs_MyCreditCards .fs-c-modal__inner {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

color: #333;

background: #fff;

border-radius: 4px;
}

#fs_MyCreditCards .fs-c-modal__header {
color: #43372f;

font-size: 18px;
font-weight: 500;
line-height: 1.6;
}

#fs_MyCreditCards .fs-c-modal__contents {
color: #444;

font-size: 14px;
line-height: 1.8;
}


/* モーダル内カード情報 */

#fs_MyCreditCards .fs-c-simpleTable {
width: 100%;

margin-top: 18px;

border-collapse: separate;
border-spacing: 0;

border: 1px solid #e5e2de;
border-radius: 3px;

overflow: hidden;
}

#fs_MyCreditCards .fs-c-simpleTable__headerCell {
width: 140px;

padding: 12px 14px;

color: #666;
background: #f7f5f2;

border-right: 1px solid #ebe8e3;

font-size: 12px;
font-weight: 500;

text-align: left;
}

#fs_MyCreditCards .fs-c-simpleTable__dataCell {
padding: 12px 14px;

color: #333;

font-size: 14px;
font-weight: 500;
}


/* ==========================================================
   15. マイページトップ
========================================================== */

#fs_MyCreditCards .fs-c-buttonContainer--myPageTop {
width: 100%;
max-width: 800px;

margin: 0 auto 55px;

text-align: center;
}

#fs_MyCreditCards .fs-c-button--myPageTop {
box-sizing: border-box;

display: inline-flex;
align-items: center;
justify-content: center;

width: 100%;
max-width: 320px;
min-height: 48px;

padding: 10px 20px;

color: #43372f !important;
background: #fff !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family: inherit;

font-size: 14px;
font-weight: 500;

text-decoration: none;
}

#fs_MyCreditCards .fs-c-button--myPageTop:hover {
color: #fff !important;
background: #43372f !important;
}

#fs_MyCreditCards .fs-c-button--myPageTop
.fs-c-button__label {
color: inherit !important;
}


/* ==========================================================
   16. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_MyCreditCards .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 全体 */

#fs_MyCreditCards
.fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-left: auto;
margin-right: auto;
margin-bottom: 22px;

padding: 24px 18px;

border-radius: 3px;
}


/* 説明 */

#fs_MyCreditCards .fs-c-inputInformation__message {
margin-bottom: 22px;
padding-bottom: 18px;

font-size: 14px;
line-height: 1.8;

text-align: left;
}


/* カードは1列 */

#fs_MyCreditCards .fs-c-creditCardList {
grid-template-columns: 1fr;

gap: 12px;
}


/* 登録カード */

#fs_MyCreditCards .fs-c-creditCardListItem {
min-height: 0;

padding: 18px 16px;
}


/* 通常使用 */

#fs_MyCreditCards
.fs-c-creditCardListItem__status {
margin-bottom: 15px;
}


/* カード情報 */

#fs_MyCreditCards
.fs-c-creditCardListItem__cardInfo {
grid-template-columns: 105px minmax(0, 1fr);

gap: 10px;
}

#fs_MyCreditCards
.fs-c-creditCardListItem__cardInfo dt {
font-size: 11px;
}

#fs_MyCreditCards
.fs-c-creditCardListItem__cardInfo dd {
font-size: 13px;
}


/* カード番号 */

#fs_MyCreditCards .fs-c-creditCard__number {
font-size: 13px;
}


/* 操作 */

#fs_MyCreditCards
.fs-c-creditCardListItem__button {
display: grid;

grid-template-columns: 1fr;

gap: 8px;

width: 100%;
}

#fs_MyCreditCards
.fs-c-creditCardListItem__button button {
width: 100%;

min-height: 44px;
}


/* モーダル表 */

#fs_MyCreditCards .fs-c-simpleTable__headerCell {
width: 115px;

padding: 10px;

font-size: 11px;
}

#fs_MyCreditCards .fs-c-simpleTable__dataCell {
padding: 10px;

font-size: 13px;
}


/* マイページトップ */

#fs_MyCreditCards
.fs-c-buttonContainer--myPageTop {
width: calc(100% - 30px);

margin-bottom: 40px;
}

#fs_MyCreditCards .fs-c-button--myPageTop {
max-width: none;

min-height: 48px;
}
}


/* ==========================================================
   FutureShop 会員登録
   対象：#fs_Register
   ぐり茶の杉山 デザイントーン統一
========================================================== */


/* ==========================================================
   1. ページ基本
========================================================== */

#fs_Register .fs-l-pageMain {
font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;

color: #333;
}


/* ==========================================================
   2. ページタイトル
========================================================== */

#fs_Register .fs-c-heading--page {
margin-bottom: 30px;

color: #43372f;

font-size: 28px;
font-weight: 500;
line-height: 1.5;
letter-spacing: 0.04em;

text-align: center;
}


/* ==========================================================
   3. 会員登録メリット
========================================================== */

#fs_Register .fs-p-announcement {
box-sizing: border-box;

width: 100%;
max-width: 820px;

margin: 0 auto 28px;
padding: 24px 28px;

background: #f7f8f3;

border: 1px solid #dfe3d4;
border-left: 3px solid #8a9b59;
border-radius: 4px;
}

#fs_Register .fs-p-announcement__title {
margin: 0 0 14px;

color: #43372f;

font-size: 18px;
font-weight: 500;
line-height: 1.6;
}

#fs_Register .fs-p-announcement__body {
color: #555;

font-size: 14px;
font-weight: 400;
line-height: 1.85;
}

#fs_Register .fs-p-announcement__body p {
margin: 0 0 10px;
}

#fs_Register .fs-p-announcement__body p:last-child {
margin-bottom: 0;
}

#fs_Register .fs-c-orderedList {
margin: 12px 0 0;
padding-left: 1.6em;
}

#fs_Register .fs-c-orderedList li {
margin: 5px 0;
}


/* ==========================================================
   4. 登録フォーム全体
========================================================== */

#fs_Register .fs-l-pageMain > .fs-c-inputInformation {
box-sizing: border-box;

width: 100%;
max-width: 820px;

margin: 0 auto 60px;
padding: 32px 36px;

background: #fff;

border: 1px solid #e5e2de;
border-radius: 4px;
}


/* ==========================================================
   5. フォーム冒頭説明
========================================================== */

#fs_Register .fs-c-inputInformation__message {
margin: 0 0 28px;
padding: 0 0 22px;

color: #555;

font-size: 15px;
font-weight: 400;
line-height: 1.8;

text-align: center;

border-bottom: 1px solid #ebe8e3;
}

#fs_Register .fs-c-inputInformation__message p {
margin: 0;
}


/* ==========================================================
   6. 入力テーブル
========================================================== */

#fs_Register .fs-c-inputTable {
width: 100%;
}

#fs_Register .fs-c-inputTable__headerCell {
box-sizing: border-box;

width: 220px;

padding: 14px 22px 14px 0;

vertical-align: middle;
}

#fs_Register .fs-c-inputTable__dataCell {
box-sizing: border-box;

padding: 14px 0;

vertical-align: middle;
}


/* ==========================================================
   7. 項目名
========================================================== */

#fs_Register .fs-c-inputTable__label {
color: #43372f;

font-size: 14px;
font-weight: 500;
line-height: 1.6;
}


/* 必須 */

#fs_Register .fs-c-requiredMark {
display: inline-block;

margin-left: 5px;

color: #9a3d35;

font-size: 10px;
font-weight: 500;

white-space: nowrap;
}


/* ==========================================================
   8. 基本入力欄
========================================================== */

#fs_Register .fs-c-inputTable input[type="text"],
#fs_Register .fs-c-inputTable input[type="tel"],
#fs_Register .fs-c-inputTable input[type="email"],
#fs_Register .fs-c-inputTable input[type="password"],
#fs_Register .fs-c-inputTable select {
box-sizing: border-box;

min-height: 50px;

padding: 0 14px;

color: #333;
background-color: #fff;

border: 1px solid #cfcac4;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 400;

transition:
border-color 0.2s ease,
box-shadow 0.2s ease;
}


/* 通常の1列入力 */

#fs_Register #fs_input_email,
#fs_Register #fs_input_addressLine1,
#fs_Register #fs_input_addressLine2,
#fs_Register #fs_input_addressLine3,
#fs_Register #fs_input_phoneNumber,
#fs_Register #fs_input_password {
width: 100%;
}


/* フォーカス */

#fs_Register .fs-c-inputTable input:focus,
#fs_Register .fs-c-inputTable select:focus {
outline: none;

border-color: #8a9b59;

box-shadow:
0 0 0 3px rgba(138, 155, 89, 0.15);
}


/* ==========================================================
   9. 氏名・フリガナ
========================================================== */

#fs_Register .fs-c-inputTextGroup {
display: flex;

gap: 10px;

width: 100%;
}

#fs_Register .fs-c-inputTextGroup__item {
flex: 1 1 0;

min-width: 0;
}

#fs_Register .fs-c-inputTextGroup__item input {
width: 100%;
}


/* ==========================================================
   10. 郵便番号
========================================================== */

#fs_Register #fs_input_zipCode {
width: 180px;
}


/* 郵便番号から出る住所候補 */

#fs_Register .fs-c-suggestedAddress {
margin-top: 6px;

background: #fff;

border: 1px solid #d8d4ce;
border-radius: 3px;

box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);

overflow: hidden;
}

#fs_Register .fs-c-suggestedAddress__list {
margin: 0;
padding: 0;

list-style: none;
}

#fs_Register .fs-c-suggestedAddress__listItem {
padding: 10px 12px;

color: #444;

font-size: 13px;
line-height: 1.6;

cursor: pointer;
}

#fs_Register .fs-c-suggestedAddress__listItem:hover {
background: #f7f8f3;
}


/* ==========================================================
   11. 都道府県・店舗等のセレクト
========================================================== */

#fs_Register #fs_input_prefecture,
#fs_Register #fs_input_preferredStore {
min-width: 240px;
}


/* ==========================================================
   12. 性別・メルマガ等ラジオ
========================================================== */

#fs_Register .fs-c-radioGroup {
display: flex;

flex-wrap: wrap;

gap: 10px 20px;
}

#fs_Register .fs-c-radio__label {
display: inline-flex;
align-items: center;

color: #444;

font-size: 14px;
font-weight: 400;
line-height: 1.6;

cursor: pointer;
}


/* ==========================================================
   13. 生年月日
========================================================== */

#fs_Register .fs-c-inputDate {
display: flex;

align-items: center;

gap: 8px;
}

#fs_Register .fs-c-inputDate .fs-c-dropdown__menu {
min-width: 0;
}

#fs_Register .fs-c-inputDate__year .fs-c-dropdown__menu {
width: 130px;
}

#fs_Register .fs-c-inputDate__month .fs-c-dropdown__menu,
#fs_Register .fs-c-inputDate__date .fs-c-dropdown__menu {
width: 90px;
}


/* ==========================================================
   14. 補足説明
========================================================== */

#fs_Register .fs-c-inputField__explanation {
margin-top: 8px;

color: #777;

font-size: 12px;
font-weight: 400;
line-height: 1.7;
}


/* ==========================================================
   15. パスワード
========================================================== */

#fs_Register .fs-c-inputGroup {
position: relative;
}

#fs_Register #fs_input_password {
padding-right: 48px;
}

#fs_Register .fs-c-button--displayPassword {
opacity: 0.7;

transition: opacity 0.2s ease;
}

#fs_Register .fs-c-button--displayPassword:hover {
opacity: 1;
}


/* ==========================================================
   16. 会員規約・個人情報保護方針
========================================================== */

#fs_Register .fs-c-memberPolicyAgreeField,
#fs_Register .fs-c-privacyPolicyAgreeField {
box-sizing: border-box;

margin-top: 16px;
padding: 16px 18px;

background: #f7f5f2;

border: 1px solid #ebe8e3;
border-radius: 3px;
}

#fs_Register .fs-c-checkbox__label {
color: #444;

font-size: 14px;
font-weight: 400;
line-height: 1.7;

cursor: pointer;
}

#fs_Register .fs-c-checkbox__labelText a {
color: #59623f;

font-weight: 500;

text-decoration: underline;
text-underline-offset: 3px;
}

#fs_Register .fs-c-checkbox__labelText a:hover {
color: #43372f;
}


/* ==========================================================
   17. 登録ボタン
========================================================== */

#fs_Register .fs-c-buttonContainer--confirmRegister {
margin-top: 32px;

text-align: center;
}

#fs_Register .fs-c-button--confirmRegister {
box-sizing: border-box;

width: 100%;
max-width: 450px;
min-height: 54px;

padding: 12px 24px;

color: #fff !important;
background: #43372f !important;

border: 1px solid #43372f !important;
border-radius: 3px;

font-family:
"Zen Kaku Gothic New",
"Yu Gothic",
YuGothic,
sans-serif;

font-size: 16px;
font-weight: 500;

letter-spacing: 0.05em;

cursor: pointer;

transition:
background 0.2s ease,
border-color 0.2s ease;
}

#fs_Register .fs-c-button--confirmRegister:hover {
background: #5b4b40 !important;
border-color: #5b4b40 !important;
}

#fs_Register .fs-c-button--confirmRegister .fs-c-button__label {
color: #fff !important;
}


/* ==========================================================
   18. タブレット
========================================================== */

@media screen and (max-width: 900px) {

#fs_Register .fs-p-announcement,
#fs_Register .fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 40px);
}
}


/* ==========================================================
   19. スマートフォン
========================================================== */

@media screen and (max-width: 640px) {

/* タイトル */

#fs_Register .fs-c-heading--page {
margin-bottom: 24px;

font-size: 23px;
}


/* 会員特典 */

#fs_Register .fs-p-announcement {
width: calc(100% - 30px);

margin-bottom: 22px;
padding: 19px 16px;
}

#fs_Register .fs-p-announcement__title {
margin-bottom: 10px;

font-size: 16px;
line-height: 1.6;
}

#fs_Register .fs-p-announcement__body {
font-size: 13px;
line-height: 1.8;
}


/* フォーム */

#fs_Register .fs-l-pageMain > .fs-c-inputInformation {
width: calc(100% - 30px);

margin-bottom: 40px;

padding: 24px 18px;

border-radius: 3px;
}


/* 説明 */

#fs_Register .fs-c-inputInformation__message {
margin-bottom: 22px;
padding-bottom: 18px;

font-size: 14px;
line-height: 1.8;

text-align: left;
}


/* ========================================================
     テーブルを縦積み
  ======================================================== */

#fs_Register .fs-c-inputTable,
#fs_Register .fs-c-inputTable tbody,
#fs_Register .fs-c-inputTable tr,
#fs_Register .fs-c-inputTable__headerCell,
#fs_Register .fs-c-inputTable__dataCell {
display: block;

box-sizing: border-box;

width: 100%;
}

#fs_Register .fs-c-inputTable tr {
margin-bottom: 21px;
}

#fs_Register .fs-c-inputTable__headerCell {
padding: 0 0 7px;
}

#fs_Register .fs-c-inputTable__dataCell {
padding: 0;
}


/* ラベル */

#fs_Register .fs-c-inputTable__label {
font-size: 14px;
}


/* 入力 */

#fs_Register .fs-c-inputTable input[type="text"],
#fs_Register .fs-c-inputTable input[type="tel"],
#fs_Register .fs-c-inputTable input[type="email"],
#fs_Register .fs-c-inputTable input[type="password"],
#fs_Register .fs-c-inputTable select {
min-height: 50px;

font-size: 16px;
}


/* 氏名・フリガナ
     姓名は横並びを維持 */

#fs_Register .fs-c-inputTextGroup {
gap: 8px;
}


/* 郵便番号 */

#fs_Register #fs_input_zipCode {
width: 100%;
}


/* 都道府県・店舗 */

#fs_Register #fs_input_prefecture,
#fs_Register #fs_input_preferredStore {
width: 100%;
min-width: 0;
}


/* 性別・メルマガ */

#fs_Register .fs-c-radioGroup {
gap: 10px 18px;
}

#fs_Register .fs-c-radio__label {
font-size: 14px;
}


/* 生年月日 */

#fs_Register .fs-c-inputDate {
display: grid;

grid-template-columns:
minmax(0, 1.4fr)
minmax(0, 1fr)
minmax(0, 1fr);

gap: 7px;

width: 100%;
}

#fs_Register .fs-c-inputDate__year .fs-c-dropdown__menu,
#fs_Register .fs-c-inputDate__month .fs-c-dropdown__menu,
#fs_Register .fs-c-inputDate__date .fs-c-dropdown__menu {
width: 100%;
}


/* 補足 */

#fs_Register .fs-c-inputField__explanation {
font-size: 11px;
line-height: 1.7;
}


/* 規約 */

#fs_Register .fs-c-memberPolicyAgreeField,
#fs_Register .fs-c-privacyPolicyAgreeField {
margin-top: 12px;

padding: 14px;
}

#fs_Register .fs-c-checkbox__label {
font-size: 13px;
}


/* 登録 */

#fs_Register .fs-c-buttonContainer--confirmRegister {
margin-top: 26px;
}

#fs_Register .fs-c-button--confirmRegister {
max-width: none;

min-height: 54px;

font-size: 15px;
}
}