@charset "utf-8";
/***************************************************
information
filename : app_myp_dez.css;
***************************************************/
/****************** マイページ指定 ******************/
/* ** myp01 start ** */
/*** 01: マイページナビ ***/
:root {
--app-mypagenav-rod: 0.2em; /* 角丸 */
--app-mypagenav-txt: #171717; /* テキスト色 */
--app-mypagenav-brd: 1px solid #cdcdcd; /* ボーダー指定 */
--app-mypagenav-brd-l: 4px solid #171717; /* 見出しボーダー指定 */
--app-mypagenav-bg: #fff; /* 背景色 */
--app-mypagenav-bbg: 0 0 0.2rem #cdcdcd; /* 背景影色 */
--font-mypagenav: 1.4rem; /* フォントサイズ */
/* マイページナビ第2階層指定 */
--app-mypagenav-sec-bg: #f5f5f5; /* 背景色 */
--app-mypagenav-sec-brd: 1px solid #cdcdcd; /* ボーダー指定 */
/* マイページナビアイコン指定 */
--app-mypagetop-ico: url('data:image/svg+xml;utf8,'); /* マイページトップ */
--app-mypageprof-ico: url('data:image/svg+xml;utf8,'); /* 基本情報の編集 */
--app-mypagepassword-ico: url('data:image/svg+xml;utf8,'); /* パスワード変更 */
--app-mypageinfo-ico: url('data:image/svg+xml;utf8,'); /* お知らせ */
--app-mypageservice-ico: url('data:image/svg+xml;utf8,'); /* サービス購入履歴 */
--app-mypageseminar-ico: url('data:image/svg+xml;utf8,'); /* セミナー申込履歴 */
--app-mypageproduct-ico: url('data:image/svg+xml;utf8,'); /* 商品購入履歴 */
--app-mypagecart-ico: url('data:image/svg+xml;utf8,'); /* カート */
--app-mypagecontact-ico: url('data:image/svg+xml;utf8,'); /* お問合せ履歴 */
--app-mypagework-ico: url('data:image/svg+xml;utf8,'); /* 採点フォーム回答履歴 */
--app-mypagepush-ico: url('data:image/svg+xml;utf8,'); /* 通知一覧 */
--app-mypageconpost-ico: url('data:image/svg+xml;utf8,'); /* コンテンツいいね・投稿履歴 */
--app-mypageprdpost-ico: url('data:image/svg+xml;utf8,'); /* 商品いいね・投稿履歴 */
--app-mypagebbspost-ico: url('data:image/svg+xml;utf8,'); /* 掲示板いいね・投稿履歴 */
--app-mypagefavorite-ico: url('data:image/svg+xml;utf8,'); /* お気に入り一覧 */
--app-mypagebenefits-ico: url('data:image/svg+xml;utf8,'); /* 会員特典 */
--app-mypageaffiliate-ico: url('data:image/svg+xml;utf8,'); /* 紹介制度 */
}
/* ===================================================================================
for SP max-width: 600px
=================================================================================== */
@media screen and (max-width: 600px) {
:root {
}
}
/* ** myp01 end ** */
/* ** myp02 start ** */
/*** 02: マイページナビ(プロフ写真エリア) ***/
:root {
/*** マイページ(プロフ写真エリア) ***/
--app-myPhoto-rod: 0.2em; /* 角丸 */
--app-myPhoto-pd: 1.0em; /* パディング */
--app-myPhoto-txt: #171717; /* テキスト色 */
--app-myPhoto-bg: #f7f7f7; /* 背景色 */
--app-myPhoto-brd: 1px dotted #8e8e8e; /* ボーダー指定 */
--font-myPhotoName: 1.6rem; /* フォントサイズ */
/* マイページ写真単体 */
--app-photoArea-bg: #f7f7f7; /* 背景色 */
--app-photoArea-brd: 1px solid #666; /* ボーダー指定 */
--app-photoArea-size: 180px; /* 写真大きさ */
}
/* ===================================================================================
for SP max-width: 600px
=================================================================================== */
@media screen and (max-width: 600px) {
:root {
}
}
/* ** myp02 end ** */
/* ** myp03 start ** */
/*** 03: マイページトップ表示枠 ***/
:root {
/* 基本設定(DLタグ要素の共通設定) */
--app-mypageBoxDet-dl-mg: 0 auto; /* DLマージン */
--app-mypageBoxDet-dl-pd: 1.0rem 0; /* DLパディング */
--app-mypageBoxDet-dt-size: 150px; /* DTサイズ */
--app-mypageBoxDet-dt-pd: 0.5rem; /* DTパディング */
--app-mypageBoxDet-dd-pd: 0.5rem; /* DDパディング */
/* マイページトップ等で使用 */
--app-mypageBoxDet-rod: 0.2em; /* 角丸 */
--app-mypageBoxDet-mg: 0.5rem auto; /* マージン */
--app-mypageBoxDet-pd: 1.0rem; /* パディング */
--app-mypageBoxDet-txt: #171717; /* テキスト色 */
--app-mypageBoxDet-brd: 1px solid #cdcdcd; /* ボーダー指定 */
--app-mypageBoxDet-brd-dl: 1px dotted #cdcdcd; /* 仕切りボーダー指定 */
--app-mypageBoxDet-bg: #fff; /* 背景色 */
--app-mypageBoxDet-bbg: 0 0 0.2rem #cdcdcd; /* 背景影色 */
--font-mypageBoxDet: 1.4rem; /* フォントサイズ */
}
/* ===================================================================================
for SP max-width: 600px
=================================================================================== */
@media screen and (max-width: 600px) {
:root {
--app-mypageBoxDet-brd: inhelit; /* ボーダー指定 */
--app-mypageBoxDet-bbg: inhelit; /* 背景影色 */
}
}
/* ** myp03 end ** */
/* ** myp05 start ** */
/*** 05:マイページ購入・申込・受付一覧表示枠 ***/
:root {
/* 外枠 */
--app-mypageOrdBox-rod: 0.2em; /* 角丸 */
--app-mypageOrdBox-mg: 0.5rem auto; /* マージン */
--app-mypageOrdBox-pd: 1.0rem; /* パディング */
--app-mypageOrdBox-txt: #171717; /* テキスト色 */
--app-mypageOrdBox-brd: 1px solid #cdcdcd; /* ボーダー指定 */
--app-mypageOrdBox-brd-dl: 1px dotted #8e8e8e; /* 仕切りボーダー指定 */
--app-mypageOrdBox-bg: #f7f7f7; /* 背景色 */
--font-mypageOrdBox: 1.4rem; /* フォントサイズ */
/* 内枠 */
--app-mypageOrdBoxInn-rod: 0.2em; /* 角丸 */
--app-mypageOrdBoxInn-mg: 0.5rem auto; /* マージン */
--app-mypageOrdBoxInn-pd: 1.0rem 1.5rem; /* パディング */
--app-mypageOrdBoxInn-bg: #fff; /* 背景色 */
--app-mypageOrdBoxInn-brd: 1px dotted #999; /* ボーダー指定 */
}
/* ===================================================================================
for SP max-width: 600px
=================================================================================== */
@media screen and (max-width: 600px) {
:root {
}
}
/* ** myp05 end ** */
/* ** myp06 start ** */
/*** 06:マイページ購入詳細表示枠 ***/
:root {
--app-ordDetBox-rod: 0.3em; /* 角丸 */
--app-ordDetBox-pd: 1.5em; /* パディング */
--app-ordDetBox-brd: 1px solid #cdcdcd; /* ボーダー指定 */
--app-ordDetBox-bg: #fff; /* 背景色 */
--app-ordDetBox-bbg: 0 0 0.5rem #cdcdcd; /* 背景影色 */
/*** マイページ購入商品注文履歴表示 ***/
/* 商品単価 */
--td-Tanka-bg: #f8f8f8; /* 背景色 */
/* 商品個数 */
--td-Quantity-bg: #fff; /* 背景色 */
/* 小計 */
--td-Subtotal-bg: #f8f7ed; /* 背景色 */
/* 商品合計 */
--td-Producttotal-bg: #e8f3e8; /* 背景色 */
/* 送料 */
--td-Postage-bg: #fff; /* 背景色 */
/* 合計金額 */
--td-Total-bg: #edf2f5; /* 背景色 */
/* 調整金額 */
--td-Adjustment-bg: #fff; /* 背景色 */
/* 税金 */
--td-Tax-bg: #fff; /* 背景色 */
}
/* ===================================================================================
for SP max-width: 600px
=================================================================================== */
@media screen and (max-width: 600px) {
:root {
}
}
/* ** myp06 end ** */
/* ** myp07 start ** */
/*** 07:マイページ通知一覧表示枠 ***/
:root {
/* 基本枠 */
--app-pushList-rod: 0.2em; /* 角丸 */
--app-pushList-mg: 1.0rem auto; /* マージン */
--app-pushList-pd: 2.0rem; /* パディング */
--app-pushList-brd: 1px solid #cdcdcd; /* ボーダー指定 */
--app-pushList-txt: #171717; /* テキスト色 */
--app-pushList-bg: #fff; /* 背景色 */
--app-pushList-bbg: 0 0 0.5rem #cdcdcd; /* 背景影色 */
/* 項目枠 */
--app-pushList-li-mg: 0 auto; /* マージン */
--app-pushList-li-pd: 2.0rem 1.0rem; /* パディング */
--app-pushList-li-brd: 1px dotted #8e8e8e; /* ボーダー指定 */
/* リンク制御 */
--app-pushList-a-bg: #f2f4d0; /* 背景色 */
/* 日付エリア */
--font-pushDateDetail: 1.2rem; /* フォントサイズ */
/* タイトル */
--font-pushTtl: 2.0rem; /* フォントサイズ */
/* テキスト */
--font-pushBody: 1.4rem; /* フォントサイズ */
}
/* ===================================================================================
for SP max-width: 600px
=================================================================================== */
@media screen and (max-width: 600px) {
:root {
--app-pushList-pd: 1.0rem; /* パディング */
--font-pushTtl: 1.8rem; /* フォントサイズ */
}
}
/* ** myp07 end ** */
/* ** myp08 start ** */
/*** 08:いいね・投稿履歴表示 ***/
:root {
/* 基本枠 */
--app-postList-rod: 0.2em; /* 角丸 */
--app-postList-mg: 1.0rem auto; /* マージン */
--app-postList-pd: 2.0rem; /* パディング */
--app-postList-brd: 1px solid #cdcdcd; /* ボーダー指定 */
--app-postList-txt: #171717; /* テキスト色 */
--app-postList-bg: #fff; /* 背景色 */
--app-postList-bbg: 0 0 0.5rem #cdcdcd; /* 背景影色 */
/* 項目枠 */
--app-postList-li-mg: 0 auto; /* マージン */
--app-postList-li-pd: 2.0rem 1.0rem; /* パディング */
--app-postList-li-brd: 1px dotted #8e8e8e; /* ボーダー指定 */
/* 日付・写真エリア */
--font-postDateDetail: 1.2rem; /* フォントサイズ */
/* タイトル */
--font-postTtl: 2.0rem; /* フォントサイズ */
/* テキスト */
--font-postBody: 1.4rem; /* フォントサイズ */
/* 商品価格・カートボタン */
--font-postPrdNo: 1.0rem; /* フォントサイズ(商品型番) */
--font-postPrdPay: 2.6rem; /* フォントサイズ(商品型番) */
/* 投稿コメント表示タイトル */
--app-postBodyTi-txt: #666; /* テキスト色 */
/* トピックスカテゴリ */
--font-postDateCate: 1.4rem; /* フォントサイズ */
}
/* ===================================================================================
for SP max-width: 600px
=================================================================================== */
@media screen and (max-width: 600px) {
:root {
}
}
/* ** myp08 end ** */