@charset "utf-8"; /*************************************************** information filename : myp_parts.css; ***************************************************/ /*======== app_myp_dez.css ========*/ /****************** マイページ要素 ******************/ /* ** myp_navi start ** */ /*** 01: マイページナビ ***/ /*** マイページナビ ***/ :root { /*** マイページナビアイコン指定 ***/ /****** アカウント情報 ******/ /* マイページトップ */ --app-mypagetop-ico: url('data:image/svg+xml;utf8,'); /* マイページトップ白アイコン */ --app-mypagetop-ico-w: url('data:image/svg+xml;utf8,'); /* 基本情報の編集 */ --app-mypageprof-ico: url('data:image/svg+xml;utf8,'); /* 基本情報の編集白アイコン */ --app-mypageprof-ico-w: url('data:image/svg+xml;utf8,'); /* パスワード変更 */ --app-mypagepassword-ico: url('data:image/svg+xml;utf8,'); /* パスワード変更白アイコン */ --app-mypagepassword-ico-w: url('data:image/svg+xml;utf8,'); /****** 契約情報 ******/ /* サービス購入履歴 */ --app-mypagesvs-ico: url('data:image/svg+xml;utf8,'); /* サービス購入履歴白アイコン */ --app-mypagesvs-ico-w: url('data:image/svg+xml;utf8,'); /* その他のサービス */ --app-mypageservice-ico: url('data:image/svg+xml;utf8,'); /* その他のサービス白アイコン */ --app-mypageservice-ico-w: url('data:image/svg+xml;utf8,'); /****** コンテンツ情報 ******/ /* 通知一覧 */ --app-mypagepush-ico: url('data:image/svg+xml;utf8,'); /* 通知一覧白アイコン */ --app-mypagepush-ico-w: url('data:image/svg+xml;utf8,'); /* コンテンツいいね・投稿履歴 */ --app-mypageconpost-ico: url('data:image/svg+xml;utf8,'); /* コンテンツいいね・投稿履歴白アイコン */ --app-mypageconpost-ico-w: url('data:image/svg+xml;utf8,'); /****** セミナー情報 ******/ /* セミナー申込履歴 */ --app-mypagesms-ico: url('data:image/svg+xml;utf8,'); /* セミナー申込履歴白アイコン */ --app-mypagesms-ico-w: url('data:image/svg+xml;utf8,'); /* その他のセミナー */ --app-mypageseminar-ico: url('data:image/svg+xml;utf8,'); /* その他のセミナー白アイコン */ --app-mypageseminar-ico-w: url('data:image/svg+xml;utf8,'); /****** 商品情報 ******/ /* 商品購入履歴 */ --app-mypageproduct-ico: url('data:image/svg+xml;utf8,'); /* 商品購入履歴白アイコン */ --app-mypageproduct-ico-w: url('data:image/svg+xml;utf8,'); /* カート */ --app-mypagecart-ico: url('data:image/svg+xml;utf8,'); /* カート白アイコン */ --app-mypagecart-ico-w: url('data:image/svg+xml;utf8,'); /* 商品いいね・投稿履歴 */ --app-mypageprdpost-ico: url('data:image/svg+xml;utf8,'); /* 商品いいね・投稿履歴白アイコン */ --app-mypageprdpost-ico-w: url('data:image/svg+xml;utf8,'); /****** 問い合わせ情報 ******/ /* お問合せ履歴 */ --app-mypagecontact-ico: url('data:image/svg+xml;utf8,'); /* お問合せ履歴白アイコン */ --app-mypagecontact-ico-w: url('data:image/svg+xml;utf8,'); /****** 回答情報 ******/ /* 採点フォーム回答履歴 */ --app-mypagework-ico: url('data:image/svg+xml;utf8,'); /* 採点フォーム回答履歴白アイコン */ --app-mypagework-ico-w: url('data:image/svg+xml;utf8,'); /****** 掲示板情報 ******/ /* 掲示板いいね・投稿履歴 */ --app-mypagebbspost-ico: url('data:image/svg+xml;utf8,'); /* 掲示板いいね・投稿履歴白アイコン */ --app-mypagebbspost-ico-w: url('data:image/svg+xml;utf8,'); /* 掲示板コメント投稿履歴 */ --app-mypagebbscomment-ico: url('data:image/svg+xml;utf8,'); /* 掲示板コメント投稿履歴白アイコン */ --app-mypagebbscomment-ico-w: url('data:image/svg+xml;utf8,'); /****** その他共通情報 ******/ /* お気に入り一覧 */ --app-mypagefavorite-ico: url('data:image/svg+xml;utf8,'); /* お気に入り一覧白アイコン */ --app-mypagefavorite-ico-w: url('data:image/svg+xml;utf8,'); /* 会員特典 */ --app-mypagebenefits-ico: url('data:image/svg+xml;utf8,'); /* 会員特典白アイコン */ --app-mypagebenefits-ico-w: url('data:image/svg+xml;utf8,'); /* 紹介制度 */ --app-mypageaffiliate-ico: url('data:image/svg+xml;utf8,'); /* 紹介制度白アイコン */ --app-mypageaffiliate-ico-w: url('data:image/svg+xml;utf8,'); /* お知らせ */ --app-mypageinfo-ico: url('data:image/svg+xml;utf8,'); /* お知らせ白アイコン */ --app-mypageinfo-ico-w: url('data:image/svg+xml;utf8,'); /* サイネージ管理 */ --app-mypagesignage-ico: url('data:image/svg+xml;utf8,'); /* サイネージ管理白アイコン */ --app-mypagesignage-ico-w: url('data:image/svg+xml;utf8,'); /* マイページ */ --app-mypageact-ico: url('data:image/svg+xml;utf8,'); /* マイページ白アイコン */ --app-mypageact-ico-w: url('data:image/svg+xml;utf8,'); /* 友達追加 */ --app-mypagefriend-ico: url('data:image/svg+xml;utf8,'); /* 友達追加白アイコン */ --app-mypagefriend-ico-w: url('data:image/svg+xml;utf8,'); /* メッセージ */ --app-mypagemessage-ico: url('data:image/svg+xml;utf8,'); /* メッセージ白アイコン */ --app-mypagemessage-ico-w: url('data:image/svg+xml;utf8,'); /* 手配管理 */ --app-mypagedispatch-ico: url('data:image/svg+xml;utf8,'); /* 手配管理白アイコン */ --app-mypagedispatch-ico-w: url('data:image/svg+xml;utf8,'); /* スケジュール管理 */ --app-mypageschedule-ico: url('data:image/svg+xml;utf8,'); /* スケジュール管理白アイコン */ --app-mypageschedule-ico-w: url('data:image/svg+xml;utf8,'); } /*** マイページナビ ***/ .mypagenav {margin: 0 auto;padding: 0;} .mypagenav ul {margin: 0 auto;padding: 0;} .mypagenav ul.children {display: block;} .mypagenav li {margin: 0 auto;padding: 0;list-style: none;} .mypagenav a { text-decoration: none; display: block; color: var(--app-mypagenav-txt); /* テキスト色 */ font-size: clamp(1.4rem, 1.4vw, 1.4rem); font-weight: bold; } /* 背景がダークなパターン */ .naviTpDark .mypagenav a { color: var(--app-mypagenav-w-txt); /* テキスト色 */ } .mypagenav a:hover {filter: alpha(opacity=65);-moz-opacity:0.75;opacity:0.75;text-decoration: none;} /* デザインパターン01 アイコン付き下線 */ .mypTp01.mypagenav a { margin: 0; padding: 1.4rem 0.5rem 1.4rem 4.5rem; border-bottom: var(--app-mypagenav-brd); /* ボーダー指定 */ background: var(--app-mypagenav-bg); /* 背景色 */ } .mypTp01.mypagenav .mypagenavSec a { margin: 0; padding: 0.8rem 0.5rem 0.8rem 4.5rem; border-bottom: var(--app-mypagenav-sec-brd); /* ボーダー指定 */ background: var(--app-mypagenav-sec-bg); /* 背景色 */ } .mypTp01.mypagenav .widget li {border-top: none;} .mypTp01.mypagenav .widget li:last-child {border-bottom: none;} .mypTp01.mypagenav .widget li.mypagenavSec {padding-left: 0;} /* 背景がダークなパターン */ .naviTpDark .mypTp01.mypagenav a { border-bottom: var(--app-mypagenav-w-brd); /* ボーダー指定 */ background: var(--app-mypagenav-w-bg); /* 背景色 */ } /* デザインパターン02 アイコン付き囲み線 */ .mypTp02.mypagenav a { margin: 0.4em 0; padding: 0.8em 0.5em 0.8em 2.8em; border: var(--app-mypagenav-brd); /* ボーダー指定 */ border-radius: var(--app-mypagenav-rod);-webkit-border-radius: var(--app-mypagenav-rod);-moz-border-radius: var(--app-mypagenav-rod);/* 角丸 */ background: var(--app-mypagenav-bg); /* 背景色 */ box-shadow: var(--app-mypagenav-sd);/* 背景影色 */ } .mypTp02.mypagenav .mypagenavSec a { margin: 0.4em 0; padding: 0.8rem 0.5rem 0.8rem 4.5rem; border: var(--app-mypagenav-sec-brd); /* ボーダー指定 */ background: var(--app-mypagenav-sec-bg); /* 背景色 */ } .mypTp02.mypagenav .widget li {border-top: none;} .mypTp02.mypagenav .widget li:last-child {border-bottom: none;} .mypTp02.mypagenav .widget li.mypagenavSec {padding-left: 0;} .mypTp02.mypagenav .widget li .btn {width: 44px;height: 43px;top: 1px;right: 1px;} /* 背景がダークなパターン */ .naviTpDark .mypTp02.mypagenav a { border: var(--app-mypagenav-w-brd); /* ボーダー指定 */ background: var(--app-mypagenav-w-bg); /* 背景色 */ box-shadow: var(--app-mypagenav-w-sd);/* 背景影色 */ } /* デザインパターン03 囲み線 */ .mypTp03.mypagenav a { margin: 0.2em 0; padding: 0.8em 0.5em 0.8em 1.0em; border: var(--app-mypagenav-brd); /* ボーダー指定 */ border-radius: var(--app-mypagenav-rod);-webkit-border-radius: var(--app-mypagenav-rod);-moz-border-radius: var(--app-mypagenav-rod);/* 角丸 */ background: var(--app-mypagenav-bg); /* 背景色 */ box-shadow: var(--app-mypagenav-sd);/* 背景影色 */ } .mypTp03.mypagenav .mypagenavSec a { margin: 0.2em 0; padding: 0.8rem 0.5rem 0.8rem 4.5rem; border: var(--app-mypagenav-sec-brd); /* ボーダー指定 */ background: var(--app-mypagenav-sec-bg); /* 背景色 */ } .mypTp03.mypagenav .widget li {border-top: none;} .mypTp03.mypagenav .widget li:last-child {border-bottom: none;} .mypTp03.mypagenav .widget li.mypagenavSec {padding-left: 0;} .mypTp03.mypagenav .widget li .btn {width: 44px;height: 43px;top: 1px;right: 1px;} /* 背景がダークなパターン */ .naviTpDark .mypTp03.mypagenav a { border: var(--app-mypagenav-w-brd); /* ボーダー指定 */ background: var(--app-mypagenav-w-bg); /* 背景色 */ box-shadow: var(--app-mypagenav-w-sd);/* 背景影色 */ } /* デザインパターン04 囲み線左罫線 */ .mypTp04.mypagenav a { margin: 0.4em 0; padding: 0.8em 0.5em 0.8em 0.5em; border: var(--app-mypagenav-brd); /* ボーダー指定 */ border-radius: var(--app-mypagenav-rod);-webkit-border-radius: var(--app-mypagenav-rod);-moz-border-radius: var(--app-mypagenav-rod);/* 角丸 */ background: var(--app-mypagenav-bg); /* 背景色 */ box-shadow: var(--app-mypagenav-sd);/* 背景影色 */ } /* 背景がダークなパターン */ .naviTpDark .mypTp04.mypagenav a { border: var(--app-mypagenav-w-brd); /* ボーダー指定 */ background: var(--app-mypagenav-w-bg); /* 背景色 */ box-shadow: var(--app-mypagenav-w-sd);/* 背景影色 */ } .mypTp04.mypagenav .mypagenavSec a { margin: 0.2em 0; padding: 0.8rem 0.5rem 0.8rem 2.0rem; border: var(--app-mypagenav-sec-brd); /* ボーダー指定 */ background: var(--app-mypagenav-sec-bg); /* 背景色 */ } .mypTp04.mypagenav a span { padding: 0 0 0 0.8em; border-left: var(--app-mypagenav-brd-l); /* 見出しボーダー指定 */ } .mypTp04.mypagenav .widget li {border-top: none;} .mypTp04.mypagenav .widget li:last-child {border-bottom: none;} .mypTp04.mypagenav .widget li.mypagenavSec {padding-left: 0;} .mypTp04.mypagenav .widget li .btn {width: 44px;height: 43px;top: 1px;right: 1px;} /*** マイページナビ(アイコン) ***/ /****** アカウント情報 ******/ /* マイページトップ */ .mypTp01.mypagenav a.mypagetop, .mypTp02.mypagenav a.mypagetop {background: var(--app-mypagetop-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagetop, .mypTp02.mypagenav li.crt a.mypagetop {background: var(--app-mypagetop-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* マイページトップ白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagetop, .naviTpDark .mypTp02.mypagenav a.mypagetop {background: var(--app-mypagetop-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagetop, .naviTpDark .mypTp02.mypagenav li.crt a.mypagetop {background: var(--app-mypagetop-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* 基本情報の編集 */ .mypTp01.mypagenav a.mypageprof, .mypTp02.mypagenav a.mypageprof {background: var(--app-mypageprof-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageprof, .mypTp02.mypagenav li.crt a.mypageprof {background: var(--app-mypageprof-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 基本情報の編集白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageprof, .naviTpDark .mypTp02.mypagenav a.mypageprof {background: var(--app-mypageprof-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageprof, .naviTpDark .mypTp02.mypagenav li.crt a.mypageprof {background: var(--app-mypageprof-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* パスワード変更 */ .mypTp01.mypagenav a.mypagepassword, .mypTp02.mypagenav a.mypagepassword {background: var(--app-mypagepassword-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagepassword, .mypTp02.mypagenav li.crt a.mypagepassword {background: var(--app-mypagepassword-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* パスワード変更白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagepassword, .naviTpDark .mypTp02.mypagenav a.mypagepassword {background: var(--app-mypagepassword-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagepassword, .naviTpDark .mypTp02.mypagenav li.crt a.mypagepassword {background: var(--app-mypagepassword-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** 契約情報 ******/ /* サービス購入履歴 */ .mypTp01.mypagenav a.mypagesvs, .mypTp02.mypagenav a.mypagesvs {background: var(--app-mypagesvs-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagesvs, .mypTp02.mypagenav li.crt a.mypagesvs {background: var(--app-mypagesvs-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* サービス購入履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagesvs, .naviTpDark .mypTp02.mypagenav a.mypagesvs {background: var(--app-mypagesvs-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagesvs, .naviTpDark .mypTp02.mypagenav li.crt a.mypagesvs {background: var(--app-mypagesvs-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* その他のサービス */ .mypTp01.mypagenav a.mypageservice, .mypTp02.mypagenav a.mypageservice {background: var(--app-mypageservice-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageservice, .mypTp02.mypagenav li.crt a.mypageservice {background: var(--app-mypageservice-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* その他のサービス白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageservice, .naviTpDark .mypTp02.mypagenav a.mypageservice {background: var(--app-mypageservice-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageservice, .naviTpDark .mypTp02.mypagenav li.crt a.mypageservice {background: var(--app-mypageservice-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** コンテンツ情報 ******/ /* 通知一覧 */ .mypTp01.mypagenav a.mypagepush, .mypTp02.mypagenav a.mypagepush {background: var(--app-mypagepush-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagepush, .mypTp02.mypagenav li.crt a.mypagepush {background: var(--app-mypagepush-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 通知一覧白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagepush, .naviTpDark .mypTp02.mypagenav a.mypagepush {background: var(--app-mypagepush-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagepush, .naviTpDark .mypTp02.mypagenav li.crt a.mypagepush {background: var(--app-mypagepush-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* コンテンツいいね・投稿履歴 */ .mypTp01.mypagenav a.mypageconpost, .mypTp02.mypagenav a.mypageconpost {background: var(--app-mypageconpost-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageconpost, .mypTp02.mypagenav li.crt a.mypageconpost {background: var(--app-mypageconpost-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* コンテンツいいね・投稿履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageconpost, .naviTpDark .mypTp02.mypagenav a.mypageconpost {background: var(--app-mypageconpost-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageconpost, .naviTpDark .mypTp02.mypagenav li.crt a.mypageconpost {background: var(--app-mypageconpost-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** セミナー情報 ******/ /* セミナー申込履歴 */ .mypTp01.mypagenav a.mypagesms, .mypTp02.mypagenav a.mypagesms {background: var(--app-mypagesms-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagesms, .mypTp02.mypagenav li.crt a.mypagesms {background: var(--app-mypagesms-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* セミナー申込履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagesms, .naviTpDark .mypTp02.mypagenav a.mypagesms {background: var(--app-mypagesms-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagesms, .naviTpDark .mypTp02.mypagenav li.crt a.mypagesms {background: var(--app-mypagesms-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* その他のセミナー */ .mypTp01.mypagenav a.mypageseminar, .mypTp02.mypagenav a.mypageseminar {background: var(--app-mypageseminar-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageseminar, .mypTp02.mypagenav li.crt a.mypageseminar {background: var(--app-mypageseminar-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* その他のセミナー白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageseminar, .naviTpDark .mypTp02.mypagenav a.mypageseminar {background: var(--app-mypageseminar-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageseminar, .naviTpDark .mypTp02.mypagenav li.crt a.mypageseminar {background: var(--app-mypageseminar-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** 商品情報 ******/ /* 商品購入履歴 */ .mypTp01.mypagenav a.mypageproduct, .mypTp02.mypagenav a.mypageproduct {background: var(--app-mypageproduct-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageproduct, .mypTp02.mypagenav li.crt a.mypageproduct {background: var(--app-mypageproduct-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 商品購入履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageproduct, .naviTpDark .mypTp02.mypagenav a.mypageproduct {background: var(--app-mypageproduct-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageproduct, .naviTpDark .mypTp02.mypagenav li.crt a.mypageproduct {background: var(--app-mypageproduct-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* カート */ .mypTp01.mypagenav a.mypagecart, .mypTp02.mypagenav a.mypagecart {background: var(--app-mypagecart-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagecart, .mypTp02.mypagenav li.crt a.mypagecart {background: var(--app-mypagecart-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* カート白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagecart, .naviTpDark .mypTp02.mypagenav a.mypagecart {background: var(--app-mypagecart-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagecart, .naviTpDark .mypTp02.mypagenav li.crt a.mypagecart {background: var(--app-mypagecart-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* 商品いいね・投稿履歴 */ .mypTp01.mypagenav a.mypageprdpost, .mypTp02.mypagenav a.mypageprdpost {background: var(--app-mypageprdpost-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageprdpost, .mypTp02.mypagenav li.crt a.mypageprdpost {background: var(--app-mypageprdpost-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 商品いいね・投稿履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageprdpost, .naviTpDark .mypTp02.mypagenav a.mypageprdpost {background: var(--app-mypageprdpost-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageprdpost, .naviTpDark .mypTp02.mypagenav li.crt a.mypageprdpost {background: var(--app-mypageprdpost-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** 問い合わせ情報 ******/ /* お問合せ履歴 */ .mypTp01.mypagenav a.mypagecontact, .mypTp02.mypagenav a.mypagecontact {background: var(--app-mypagecontact-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagecontact, .mypTp02.mypagenav li.crt a.mypagecontact {background: var(--app-mypagecontact-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* お問合せ履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagecontact, .naviTpDark .mypTp02.mypagenav a.mypagecontact {background: var(--app-mypagecontact-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagecontact, .naviTpDark .mypTp02.mypagenav li.crt a.mypagecontact {background: var(--app-mypagecontact-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** 回答情報 ******/ /* 採点フォーム回答履歴 */ .mypTp01.mypagenav a.mypagework, .mypTp02.mypagenav a.mypagework {background: var(--app-mypagework-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagework, .mypTp02.mypagenav li.crt a.mypagework {background: var(--app-mypagework-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 採点フォーム回答履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagework, .naviTpDark .mypTp02.mypagenav a.mypagework {background: var(--app-mypagework-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagework, .naviTpDark .mypTp02.mypagenav li.crt a.mypagework {background: var(--app-mypagework-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** 掲示板情報 ******/ /* 掲示板いいね・投稿履歴 */ .mypTp01.mypagenav a.mypagebbspost, .mypTp02.mypagenav a.mypagebbspost {background: var(--app-mypagebbspost-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagebbspost, .mypTp02.mypagenav li.crt a.mypagebbspost {background: var(--app-mypagebbspost-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 掲示板いいね・投稿履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagebbspost, .naviTpDark .mypTp02.mypagenav a.mypagebbspost {background: var(--app-mypagebbspost-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagebbspost, .naviTpDark .mypTp02.mypagenav li.crt a.mypagebbspost {background: var(--app-mypagebbspost-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* 掲示板コメント投稿履歴 */ .mypTp01.mypagenav a.mypagebbscomment, .mypTp02.mypagenav a.mypagebbscomment {background: var(--app-mypagebbscomment-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagebbscomment, .mypTp02.mypagenav li.crt a.mypagebbscomment {background: var(--app-mypagebbscomment-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 掲示板コメント投稿履歴白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagebbscomment, .naviTpDark .mypTp02.mypagenav a.mypagebbscomment {background: var(--app-mypagebbscomment-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagebbscomment, .naviTpDark .mypTp02.mypagenav li.crt a.mypagebbscomment {background: var(--app-mypagebbscomment-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /****** その他共通情報 ******/ /* お気に入り一覧 */ .mypTp01.mypagenav a.mypagefavorite, .mypTp02.mypagenav a.mypagefavorite {background: var(--app-mypagefavorite-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagefavorite, .mypTp02.mypagenav li.crt a.mypagefavorite {background: var(--app-mypagefavorite-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* お気に入り一覧白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagefavorite, .naviTpDark .mypTp02.mypagenav a.mypagefavorite {background: var(--app-mypagefavorite-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagefavorite, .naviTpDark .mypTp02.mypagenav li.crt a.mypagefavorite {background: var(--app-mypagefavorite-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* 会員特典 */ .mypTp01.mypagenav a.mypagebenefits, .mypTp02.mypagenav a.mypagebenefits {background: var(--app-mypagebenefits-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagebenefits, .mypTp02.mypagenav li.crt a.mypagebenefits {background: var(--app-mypagebenefits-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 会員特典白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagebenefits, .naviTpDark .mypTp02.mypagenav a.mypagebenefits {background: var(--app-mypagebenefits-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagebenefits, .naviTpDark .mypTp02.mypagenav li.crt a.mypagebenefits {background: var(--app-mypagebenefits-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* 紹介制度 */ .mypTp01.mypagenav a.mypageaffiliate, .mypTp02.mypagenav a.mypageaffiliate {background: var(--app-mypageaffiliate-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageaffiliate, .mypTp02.mypagenav li.crt a.mypageaffiliate {background: var(--app-mypageaffiliate-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 紹介制度白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageaffiliate, .naviTpDark .mypTp02.mypagenav a.mypageaffiliate {background: var(--app-mypageaffiliate-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageaffiliate, .naviTpDark .mypTp02.mypagenav li.crt a.mypageaffiliate {background: var(--app-mypageaffiliate-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* お知らせ */ .mypTp01.mypagenav a.mypageinfo, .mypTp02.mypagenav a.mypageinfo {background: var(--app-mypageinfo-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageinfo, .mypTp02.mypagenav li.crt a.mypageinfo {background: var(--app-mypageinfo-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* お知らせ白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageinfo, .naviTpDark .mypTp02.mypagenav a.mypageinfo {background: var(--app-mypageinfo-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageinfo, .naviTpDark .mypTp02.mypagenav li.crt a.mypageinfo {background: var(--app-mypageinfo-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* サイネージ管理 */ .mypTp01.mypagenav a.mypagesignage, .mypTp02.mypagenav a.mypagesignage {background: var(--app-mypagesignage-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagesignage, .mypTp02.mypagenav li.crt a.mypagesignage {background: var(--app-mypagesignage-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* サイネージ管理白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagesignage, .naviTpDark .mypTp02.mypagenav a.mypagesignage {background: var(--app-mypagesignage-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagesignage, .naviTpDark .mypTp02.mypagenav li.crt a.mypagesignage {background: var(--app-mypagesignage-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* マイページ */ .mypTp01.mypagenav a.mypageact, .mypTp02.mypagenav a.mypageact {background: var(--app-mypageact-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageact, .mypTp02.mypagenav li.crt a.mypageact {background: var(--app-mypageact-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* マイページ白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageact, .naviTpDark .mypTp02.mypagenav a.mypageact {background: var(--app-mypageact-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageact, .naviTpDark .mypTp02.mypagenav li.crt a.mypageact {background: var(--app-mypageact-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* 友達追加 */ .mypTp01.mypagenav a.mypagefriend, .mypTp02.mypagenav a.mypagefriend {background: var(--app-mypagefriend-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagefriend, .mypTp02.mypagenav li.crt a.mypagefriend {background: var(--app-mypagefriend-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 友達追加白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagefriend, .naviTpDark .mypTp02.mypagenav a.mypagefriend {background: var(--app-mypagefriend-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagefriend, .naviTpDark .mypTp02.mypagenav li.crt a.mypagefriend {background: var(--app-mypagefriend-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* メッセージ */ .mypTp01.mypagenav a.mypagemessage, .mypTp02.mypagenav a.mypagemessage {background: var(--app-mypagemessage-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagemessage, .mypTp02.mypagenav li.crt a.mypagemessage {background: var(--app-mypagemessage-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* メッセージ白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagemessage, .naviTpDark .mypTp02.mypagenav a.mypagemessage {background: var(--app-mypagemessage-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagemessage, .naviTpDark .mypTp02.mypagenav li.crt a.mypagemessage {background: var(--app-mypagemessage-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* 手配管理 */ .mypTp01.mypagenav a.mypagedispatch, .mypTp02.mypagenav a.mypagedispatch {background: var(--app-mypagedispatch-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypagedispatch, .mypTp02.mypagenav li.crt a.mypagedispatch {background: var(--app-mypagedispatch-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* 手配管理白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypagedispatch, .naviTpDark .mypTp02.mypagenav a.mypagedispatch {background: var(--app-mypagedispatch-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypagedispatch, .naviTpDark .mypTp02.mypagenav li.crt a.mypagedispatch {background: var(--app-mypagedispatch-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} /* スケジュール管理 */ .mypTp01.mypagenav a.mypageschedule, .mypTp02.mypagenav a.mypageschedule {background: var(--app-mypageschedule-ico) 0.5em center no-repeat var(--app-mypagenav-bg);} .mypTp01.mypagenav li.crt a.mypageschedule, .mypTp02.mypagenav li.crt a.mypageschedule {background: var(--app-mypageschedule-ico) 0.5em center no-repeat var(--app-mypagenav-bga);} /* スケジュール管理白アイコン */ .naviTpDark .mypTp01.mypagenav a.mypageschedule, .naviTpDark .mypTp02.mypagenav a.mypageschedule {background: var(--app-mypageschedule-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bg);} .naviTpDark .mypTp01.mypagenav li.crt a.mypageschedule, .naviTpDark .mypTp02.mypagenav li.crt a.mypageschedule {background: var(--app-mypageschedule-ico-w) 0.5em center no-repeat var(--app-mypagenav-w-bga);} .mypTp01.mypagenav a.mypnavIco, .mypTp02.mypagenav a.mypnavIco, .mypTp01.mypagenav li.crt a.mypnavIco, .mypTp02.mypagenav li.crt a.mypnavIco, .naviTpDark .mypTp01.mypagenav a.mypnavIco, .naviTpDark .mypTp02.mypagenav a.mypnavIco, .naviTpDark .mypTp01.mypagenav li.crt a.mypnavIco, .naviTpDark .mypTp02.mypagenav li.crt a.mypnavIco {background-size:24px 24px;} /* ナビタイトル */ .mypage_naviTi { margin: 1.5rem auto 0.5rem auto; /* マージン */ padding: 0.8rem 1.5rem; /* パディング */ text-align: left; line-height: 1.6; /* 行間 */ color: #fff; /* テキスト色 */ font-size: clamp(1.4rem, 1.4vw, 1.6rem); /* フォントサイズ */ font-weight: bold; border-radius: 0.2em;-webkit-border-radius: 0.2em;-moz-border-radius: 0.2em; background: #2b2b2b; } /* ** myp_navi end ** */ /* ** myp_navi_bt start ** */ /*** マイページナビボタン ***/ .mypagenavBt {margin: 0 auto;padding: 1.0rem;background: #eee;} .mypagenavBt ul { margin: 0 auto; padding: 0; display: flex; gap: 0.4rem 0.1rem; justify-content: center; flex-wrap: wrap; align-items: center; list-style: none; } .mypagenavBt li { width: calc(20% - 5px); margin: 0 auto; padding: 2.0rem; border-radius: var(--app-mypagenavBt-rod);-webkit-border-radius: var(--app-mypagenavBt-rod);-moz-border-radius: var(--app-mypagenavBt-rod);/* 角丸 */ background: var(--app-mypagenavBt-bg);/* 背景色 */ box-shadow: var(--app-mypagenavBt-sd);/* 背景影色 */ } .naviTpDark .mypagenavBt li { background: var(--app-mypagenavBt-w-bg);/* 背景色 */ box-shadow: var(--app-mypagenavBt-w-sd);/* 背景影色 */ } .mypagenavBt a { width: 100%; height: 100px; padding: 2.0rem 0; display: block; font-size: clamp(1.2rem, 1.0vw, 1.2rem); text-align: center; color: var(--app-mypagenavBt-txt); } .mypagenavBt a {padding-top: 7.5rem;} .naviTpDark .mypagenavBt a { color: var(--app-mypagenavBt-w-txt); } @media screen and (max-width: 480px) { .mypagenavBt li { width: calc(33.0% - 5px); padding: 1.0rem; } .mypagenavBt a {padding-top: 6.5rem;} } .mypBtTp01.mypagenavBt a.mypageBtprof {background: var(--app-mypageprof-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtpassword {background: var(--app-mypagepassword-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtservice {background: var(--app-mypageservice-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtseminar {background: var(--app-mypageseminar-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtproduct {background: var(--app-mypageproduct-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtcart {background: var(--app-mypagecart-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtcontact {background: var(--app-mypagecontact-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtwork {background: var(--app-mypagework-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtpush {background: var(--app-mypagepush-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtconpost {background: var(--app-mypageconpost-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtprdpost {background: var(--app-mypageprdpost-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtbbspost {background: var(--app-mypagebbspost-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtfavorite {background: var(--app-mypagefavorite-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtsignage {background: var(--app-mypagesignage-ico) top center no-repeat;} .mypBtTp01.mypagenavBt a.mypageBtdispatch {background: var(--app-mypagedispatch-ico) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtprof {background: var(--app-mypageprof-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtpassword {background: var(--app-mypagepassword-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtservice {background: var(--app-mypageservice-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtseminar {background: var(--app-mypageseminar-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtproduct {background: var(--app-mypageproduct-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtcart {background: var(--app-mypagecart-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtcontact {background: var(--app-mypagecontact-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtwork {background: var(--app-mypagework-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtpush {background: var(--app-mypagepush-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtconpost {background: var(--app-mypageconpost-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtprdpost {background: var(--app-mypageprdpost-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtbbspost {background: var(--app-mypagebbspost-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtfavorite {background: var(--app-mypagefavorite-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtsignage {background: var(--app-mypagesignage-ico-w) top center no-repeat;} .naviTpDark .mypBtTp01.mypagenavBt a.mypageBtdispatch {background: var(--app-mypagedispatch-ico-w) top center no-repeat;} .mypagenavBt a:hover {filter: alpha(opacity=65);-moz-opacity:0.75;opacity:0.75;text-decoration: none;} .mypBtTp01.mypagenavBt a.mypnavIco, .mypBtTp01.mypagenavBt li.crt a.mypnavIco, .naviTpDark .mypBtTp01.mypagenavBt a.mypnavIco, .naviTpDark .mypBtTp01.mypagenavBt li.crt a.mypnavIco {background-size:64px 64px;} /* ** myp_navi_bt end ** */ /* ** myp_navi_edit_bt start ** */ /*** 各種マイページ操作用ボタン設定 ***/ /* 画面遷移（編集・確認）ボタン */ .mypEditBtArea {display: flex;justify-content: flex-end;gap: 0 0.4rem;padding-bottom: 0.5rem;} .mypEditBtArea:last-child {padding-bottom: 0;} .mypEditBtArea ul {display: flex;justify-content: flex-end;list-style: none;gap: 0.4rem 0.4rem;flex-wrap: wrap;} .mypEditBtArea li {margin: 0;text-align: center;} .mypEditBtArea li {width: 100px;} /* 基本横幅サイズ */ .mypEditBtArea li.myedsizeAuto {width: auto;} /* 横幅フリーサイズ */ .mypEditBtArea li.myedsizeM {width: 150px;} /* 横幅Mサイズ */ .mypEditBtArea li.myedsizeW {width: 300px;} /* 横幅ワイドサイズ */ .mypEditBtArea a, .mypEditBtArea span { width: 100%; text-align: center; display: block; padding: 0.8rem 1.0rem; color: var(--app-mypEditBtArea-txt); /* テキスト色 */ background: var(--app-mypEditBtArea-cr); /* 背景色 */ border-radius: var(--app-mypEditBtArea-rod);-webkit-border-radius: var(--app-mypEditBtArea-rod);-moz-border-radius: var(--app-mypEditBtArea-rod); /* 角丸 */ border: var(--app-mypEditBtArea-brd); /* ボーダー指定 */ font-size: clamp(1.4rem, 1.4vw, 1.4rem); font-weight: bold; } .mypEditBtArea span {opacity: 0.3;} .mypEditBtArea a.crt {background: var(--app-mypEditBtArea-cr-crt);} /* カレント背景色 */ .mypEditBtArea a:hover {opacity: 0.6; filter: alpha(opacity = 60);text-decoration: none;} @media screen and (max-width: 600px) { .mypEditBtArea {display: block;padding: 0.2rem 1.0rem;} .mypEditBtArea.flexNo {display: flex;padding: 0;} .mypEditBtArea.spDisp {display: none;} .mypEditBtArea ul {padding: 0.2rem 0;} .mypEditBtArea li, .mypEditBtArea li.myedsizeM, .mypEditBtArea li.myedsizeW {width: auto;} .mypEditBtArea a {padding: 0.5rem 1.0rem;} } /* ** myp_navi_edit_bt end ** */ /* ** myp_navi_operation_bt start ** */ /* 各種操作用ボタン */ .mypageOprBtBox { width: 100%; margin: 0; padding: 1.5rem 1.0rem; background: #f3f3f3; /* 背景色 */ border-top: 1px solid #d5d9db; /* ボーダー指定 */ border-bottom: 1px solid #d5d9db; /* ボーダー指定 */ } .mypageOprBtArea {display: flex;justify-content: flex-end;gap: 0 0.4rem;padding-bottom: 0.5rem;} .mypageOprBtArea:last-child {padding-bottom: 0;} .mypageOprBtArea ul {display: flex;justify-content: flex-end;list-style: none;gap: 0.4rem 0.4rem;flex-wrap: wrap;} .mypageOprBtArea li {margin: 0;text-align: center;} .mypageOprBtArea li {width: 150px;} .mypageOprBtArea a, .mypageOprBtArea span { width: 100%; text-align: center; display: block; padding: 0.8rem 1.0rem; color: var(--app-mypageOprBtArea-txt); /* テキスト色 */ background: var(--app-mypageOprBtArea-cr); /* 背景色 */ border-radius: var(--app-mypageOprBtArea-rod);-webkit-border-radius: var(--app-mypageOprBtArea-rod);-moz-border-radius: var(--app-mypageOprBtArea-rod); /* 角丸 */ border: var(--app-mypageOprBtArea-brd); /* ボーダー指定 */ font-size: clamp(1.4rem, 1.4vw, 1.4rem); font-weight: bold; } .mypageOprBtArea span {opacity: 0.3;} .mypageOprBtArea a:hover {opacity: 0.6; filter: alpha(opacity = 60);text-decoration: none;} @media screen and (max-width: 600px) { .mypageOprBtArea li {width: auto;} .mypageOprBtArea a, .mypageOprBtArea span {padding: 0.8rem 1.0rem;} } /* ** myp_navi_operation_bt end ** */ /* ** myp_prof start ** */ /*** マイページナビ(プロフ写真エリア) ***/ .myPhoto { margin: 0 auto; padding: 1.5rem; border-radius: var(--app-myPhoto-rod);-webkit-border-radius: var(--app-myPhoto-rod);-moz-border-radius: var(--app-myPhoto-rod);/* 角丸 */ border: var(--app-myPhoto-brd); /* ボーダー指定 */ background: var(--app-myPhoto-bg); /* 背景色 */ } .myPhoto p.myName { margin: 0 auto; padding: 0.5em 0; color: var(--app-myPhoto-txt); /* テキスト色 */ text-align: center; font-size: clamp(1.4rem, 1.4vw, 1.6rem); font-weight: bold; } .myPhoto p.myLastLogin { margin: 0 auto; padding: 0.5em 0; color: var(--app-myPhoto-txt); /* テキスト色 */ text-align: center; font-size: clamp(1.2rem, 1.2vw, 1.2rem); font-weight: normal; } /* マイページ写真単体 */ .myPhoto .photoArea { display: flex; justify-content: center; align-items: center; margin: 0 auto; overflow: hidden; border-radius: var(--app-myPhoto-rod); -webkit-border-radius: var(--app-myPhoto-rod); -moz-border-radius: var(--app-myPhoto-rod);/* 角丸 */ border: var(--app-photoArea-brd); /* ボーダー指定 */ background: var(--app-photoArea-bg); /* 背景色 */ } .myPhoto .photoArea {max-width: var(--app-photoArea-size);height: var(--app-photoArea-size);} /* 写真大きさ */ .myPhoto .photoArea img {position: absolute;width: 100%;height: auto;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);} /* 写真表示(サークル) */ .photo_circleOn .myPhoto .photoArea { border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;/* 角丸 */ } /*** 申込プラン表示 ***/ .planOrd { margin: 1.0rem auto 0 auto; padding: 0.5rem 1.0rem; font-size: 1.2rem; color: #fff; background: #eee; font-size: clamp(1.4rem, 1.4vw, 1.4rem); font-weight: bold; text-align: center; border-radius: var(--app-planOrd-rod);-webkit-border-radius: var(--app-planOrd-rod);-moz-border-radius: var(--app-planOrd-rod); } /* 購入プランカラー */ .planFree {background: var(--app-planOrdF-bg);}/* フリープラン */ .planA {background: var(--app-planOrdA-bg);}/* プランA */ .planB {background: var(--app-planOrdB-bg);}/* プランB */ .planC {background: var(--app-planOrdC-bg);}/* プランC */ .planD {background: var(--app-planOrdD-bg);}/* プランD */ .planE {background: var(--app-planOrdE-bg);}/* プランD */ /*** 名前表示(プラン表示あり) ***/ .mypageNameBox {margin: 0 auto;padding: 1.0rem 0.5rem;} .welcomeName { font-size: clamp(1.4rem, 1.4vw, 1.4rem); font-weight: bold; } .mypageNameBox .welcomeName, .mypageNameBox .myLastLogin {display: flex;align-items: center;gap: 0 0.3rem;} .mypageNameBox .welcomeName dd {font-size: clamp(1.6rem, 1.6vw, 1.6rem);} .mypageNameBox .myLastLogin {font-size: clamp(1.2rem, 1.2vw, 1.2rem);} .mypageNameBox .planOrd {width: 200px;margin: 1.0rem 0 0 0;} /* 名前表示(ボックス表示) */ .Name_dezpt01 .mypageNameBox { margin: 0 auto; padding: 1.5rem; border-radius: var(--app-myPhoto-rod);-webkit-border-radius: var(--app-myPhoto-rod);-moz-border-radius: var(--app-myPhoto-rod);/* 角丸 */ border: var(--app-myPhoto-brd); /* ボーダー指定 */ background: var(--app-myPhoto-bg); /* 背景色 */ } /* 名前表示(1行表示) */ .Name_dezpt02 .mypageNameBox {padding: 1.5rem;} /* ** myp_prof end ** */ /* ** myp_prof_photo start ** */ /*** 写真拡大 ***/ .fileUpPhBox { width: 400px; margin: 1.0rem auto; padding: 1.5rem; border-radius: var(--app-myPhoto-rod);-webkit-border-radius: var(--app-myPhoto-rod);-moz-border-radius: var(--app-myPhoto-rod);/* 角丸 */ border: var(--app-myPhoto-brd); /* ボーダー指定 */ background: var(--app-myPhoto-bg); /* 背景色 */ } @media screen and (max-width: 600px) { .fileUpPhBox {width: 100%;} } .fileUpPhBox img {width: 100%;} .profPhotoUp {padding: 1.0rem;} .profPhotoUp .fileDelBT a, .profPhotoUp .fileUpBT a {margin: 0 auto;} /* ** myp_prof_photo end ** */ /* ** myp_basic start ** */ /*** マイページ表示枠 ***/ /*** 基本ボックス ***/ /*** 枠ボックス基本設定 ***/ .mypageBox, .mypageBoxInn, .mypageBoxList, .mypageBoxDet, .mypageBoxSection { margin-left: auto; margin-right: auto; border-radius: var(--app-mypageBox-rod);-webkit-border-radius: var(--app-mypageBox-rod);-moz-border-radius: var(--app-mypageBox-rod); /* 角丸 */ } /* 基本枠 */ .mypageBox { margin: 2.0rem 1.0rem; padding: 1.5rem; color: var(--app-mypageBoxDet-txt); border: var(--app-mypageBoxDet-brd); background: var(--app-mypageBoxDet-bg); box-shadow: var(--app-mypageBoxDet-sd); } /* 基本内枠 */ .mypageBoxInn, .mypageBoxInnTi { margin: 1.0rem 0; padding: 1.5rem; border: var(--app-mypageBoxDetInn-brd); background: var(--app-mypageBoxDetInn-bg); box-shadow: inhelit; } .mypageBoxInnTi {padding: 0;}/* タイトル等が入る場合 */ /* タイトル表示設定 */ .mypageTitle { padding: 1.0rem 1.5rem; border-bottom: 1px solid #3c4952; color: #fff; background: #3c4952; display: flex; align-items: center; justify-content: space-between; font-size: clamp(1.4rem, 1.6vw, 1.6rem); } /* リスト・登録画面・詳細画面枠 */ .mypageBoxList, .mypageBoxDet { margin: 1.5rem auto; padding: 0.5rem 1.5rem; border: 1px solid #dedede; background: #fff; box-shadow: inhelit; } .mypageBoxArt {margin: 1.5rem auto;} .mypageBoxInnTi .mypageBoxList, .mypageBoxInnTi .mypageBoxDet, .mypageBoxInnTi .mypageBoxArt {margin: 1.5rem;} .mypageBoxDetInn { margin: 1.0rem auto; padding: 1.0rem 2.0rem; border-radius: var(--app-mypageBoxDet-rod);-webkit-border-radius: var(--app-mypageBoxDet-rod);-moz-border-radius: var(--app-mypageBoxDet-rod); /* 角丸 */ border: var(--app-mypageBoxDetInn-brd); /* 内枠ボーダー指定 */ background: var(--app-mypageBoxDetInn-bg); /* 内枠背景色 */ box-shadow: var(--app-mypageBoxDetInn-sd);/* 内枠背景影色 */ } /* 基本設定 */ .mypageBoxFlex {width: 100%;margin: 0 auto;display: flex;gap: 1.0rem;} .mypageBoxFlex .FlexItem {width: 100%;} .mypageBoxDet li {list-style: none;} @media screen and (max-width: 600px) { .mypageBox { margin: 1.0rem auto; padding: 1.5rem 1.0rem; border: none; box-shadow: none; } .mypageBoxInn, .mypageBoxInnTi { padding: 0; border: none; box-shadow: none; } .mypageBoxList, .mypageBoxDet { padding: 0.5rem; } .mypageBoxInnTi .mypageBoxList, .mypageBoxInnTi .mypageBoxDet, .mypageBoxInnTi .mypageBoxArt { margin: 1.0rem auto; } .mypageBoxDetInn { margin: 1.0rem auto; padding: 0.5rem; border: none; box-shadow: none; } .mypageBoxFlex {width: 100%;margin: 0 auto;display: block;} .mypageTitle {padding: 1.0rem 0 1.0rem 1.5rem;} } /* データ表示設定 */ .mypageBoxDl dl { display: flex; align-items: center; margin: 0 auto; padding: 1.5rem 0; color: var(--app-mypageBoxDet-txt); /* テキスト色 */ font-size: clamp(1.4rem, 1.6vw, 1.6rem); font-weight: bold; border-bottom: var(--app-mypageBoxDet-brd-dl); /* 仕切りボーダー指定 */ } .mypageBoxDl dl:last-child {border-bottom: none;} .mypageBoxDl dt, .mypageBoxDl dd {padding: 0.5rem;} .mypageBoxDl dt {width: 25%;font-weight: normal;} .mypageBoxDl dd {width: 75%;} .mypageBoxDl dt {color: #9e9e9e;font-size: clamp(1.4rem, 1.4vw, 1.4rem);} @media screen and (max-width: 600px) { .mypageBoxDl dl {display: block;} .mypageBoxDl dt, .mypageBoxDl dd {width: 100%;} .mypageBoxDl dl.spchkDl {display: flex;} .mypageBoxDl dl.spchkDl dt {width: 40%;} .mypageBoxDl dl.spchkDl dd {width: 60%;} } /* ** myp_basic end ** */ /* ** myp_order start ** */ /*** 枠ボックス購入・申込履歴設定 ***/ /* 購入・申込履歴枠設定 */ .mypageOrdBox { margin: 1.5rem auto; padding: 1.0rem; border-radius: var(--app-mypageOrdBox-rod);-webkit-border-radius: var(--app-mypageOrdBox-rod);-moz-border-radius: var(--app-mypageOrdBox-rod); /* 角丸 */ border: var(--app-mypageOrdBox-brd); /* 外枠ボーダー指定 */ background: var(--app-mypageOrdBox-bg); /* 外枠背景色 */ box-shadow: var(--app-mypageOrdBox-sd);/* 外枠背景影色 */ } .mypageBoxInnTi .mypageOrdBox {margin: 1.5rem;} /*** 購入・申込したプラン表示設定 ***/ .mypageOrdBoxInn { margin: 0 auto 1.0rem auto; padding: 1.0rem 2.0rem; border-radius: var(--app-mypageOrdBoxInn-rod);-webkit-border-radius: var(--app-mypageOrdBoxInn-rod);-moz-border-radius: var(--app-mypageOrdBoxInn-rod); /* 角丸 */ border: var(--app-mypageOrdBoxInn-brd); /* 内枠ボーダー指定 */ background: var(--app-mypageOrdBoxInn-bg); /* 内枠背景色 */ box-shadow: var(--app-mypageOrdBoxInn-sd);/* 内枠背景影色 */ } .mypageOrdDetail {margin: 0 1.0rem 1.0rem 1.0rem;} /*** 購入・申込したプラン詳細表示設定 ***/ .mypageOrdBasic { margin: 1.0rem; padding: 1.0rem 2.0rem; border-radius: var(--app-mypageOrdBasic-rod);-webkit-border-radius: var(--app-mypageOrdBasic-rod);-moz-border-radius: var(--app-mypageOrdBasic-rod); /* 角丸 */ border: var(--app-mypageOrdBasic-brd); /* 外枠ボーダー指定 */ background: var(--app-mypageOrdBasic-bg); /* 外枠背景色 */ box-shadow: var(--app-mypageOrdBasic-sd);/* 外枠背景影色 */ } /* 購入・申込金額設定 */ .mypageOrdBasic dd.name {font-size: var(--font-AmountName);} .mypageOrdBasic span.kinagakuTxt {font-size: var(--font-Amount);padding: 0 0.5rem 0 0;} /*** キャンセルや解約等の状態設定 ***/ .mypageOrdSituation { margin: 1.0rem; padding: 1.0rem 2.0rem; border-radius: var(--app-mypageOrdSituation-rod);-webkit-border-radius: var(--app-mypageOrdSituation-rod);-moz-border-radius: var(--app-mypageOrdSituation-rod); /* 角丸 */ border: var(--app-mypageOrdSituation-brd); /* 内枠ボーダー指定 */ background: var(--app-mypageOrdSituation-bg); /* 背景色 */ box-shadow: var(--app-mypageOrdSituation-sd);/* 背景影色 */ } @media screen and (max-width: 600px) { .mypageOrdBox { margin: 2.5rem auto; padding: 1.0rem 0; border-top: var(--app-mypageOrdBox-brd); border-bottom: var(--app-mypageOrdBox-brd); border-left: none; border-right: none; } .mypageBoxInnTi .mypageOrdBox {margin: 2.5rem auto;} .mypageOrdBoxInn {padding: 1.0rem;} .mypageOrdDetail {margin: 0 0 1.0rem 0;} .mypageOrdBasic, .mypageOrdSituation { margin: 1.0rem auto; padding: 1.0rem; } } /*** コンテンツ詳細表示処理 ***/ .DetailBox {margin: 2.0rem auto;padding: 1.5rem 0;width: 95%;} /*** サービスプラン変更設定 ***/ .planChangeBox {margin: 0 auto; padding: 0;} .planChangeBoxInn { margin: 1.0rem auto; padding: 1.0rem; border-radius: var(--app-planChangeBoxInn-rod);-webkit-border-radius: var(--app-planChangeBoxInn-rod);-moz-border-radius: var(--app-planChangeBoxInn-rod); /* 角丸 */ } .planChangeBoxInn.chgBefore { color: var(--app-chgBefore-txt); /* 変更前テキスト色 */ border: var(--app-chgBefore-brd); /* 変更前ボーダー指定 */ background: var(--app-chgBefore-bg); /* 変更前背景色 */ } .planChangeBoxInn.chgAfter { color: var(--app-chgAfter-txt); /* 変更後テキスト色 */ border: var(--app-chgAfter-brd); /* 変更後ボーダー指定 */ background: var(--app-chgAfter-bg); /* 変更後背景色 */ } .planChangeBox dd.planChangeName {font-size: clamp(1.8rem, 1.8vw, 2.0rem);} .planChangeBox li {padding: 0.5rem 0;list-style: none;} /* ** myp_order end ** */ /* ** myp_post start ** */ /****** 写真付きリスト表示 ******/ /* 基本枠 */ .postList { list-style: none; margin: 1.0rem auto; padding: 2.0rem; border-radius: var(--app-postList-rod);-webkit-border-radius: var(--app-postList-rod);-moz-border-radius: var(--app-postList-rod);/* 角丸 */ border: var(--app-postList-brd); /* ボーダー指定 */ background: var(--app-postList-bg); /* 背景色 */ box-shadow: var(--app-postList-bbg);/* 背景影色 */ } .mypageBoxInnTi .postList {margin: 1.5rem;} /* 項目枠 */ .postList li { margin: 0 auto; padding: 2.0rem 1.0rem; display: flex; justify-content: space-between; border-bottom: var(--app-postList-li-brd); /* ボーダー指定 */ } /* リンク制御 */ .postList .postTtl a {color: var(--app-postList-txt);text-decoration: none;} .postList a:hover {text-decoration: underline;} /* 日付・写真エリア */ .postDate {width: 20%;} .postDate .postDateDetail {padding: 0.5rem 0;font-size: 1.2rem;font-weight: bold;} .postDate .postImg {padding-bottom: 0.5rem;} /* 写真 */ .postDate .postImg img {width: 100%;} /* 写真サイズ */ .postDate .postDateIco {padding-top: 1.0rem;} /* 承認・未承認アイコン */ .postDate .postDateIco .IcoBox{width:auto;} /* タイトル・テキストエリア */ .postText {width: 77%;} .postTtl {font-size: clamp(2.0rem, 2.4vw, 2.4rem);font-weight: bold;min-width: 100%;margin-right: 2.0rem;flex-shrink:0;line-height: 1.2;} .postBody {font-size: clamp(1.4rem, 1.4vw, 1.4rem);min-width: 100%;padding: 1.5rem 0;}/* テキスト */ /* ボタン配置 */ .postBt {padding: 1.0rem 0;display: flex;justify-content: flex-start;} .postBt p {padding: 0 0.2rem;width: 120px;} /* アイコン配置 */ .postIco {padding: 0 0 1.0rem 0;display: flex;justify-content: flex-start;gap: 0 0.2rem} .postIco p {padding: 0rem;width: 120px;} /****** セミナー利用時 ******/ .postEventDate, .postPlaceName, .postAmount {font-size: clamp(1.4rem, 1.4vw, 1.4rem);min-width: 100%;padding: 0;line-height: 1.8;} /****** 商品利用時 ******/ /* 商品価格・カートボタン */ .postPrdDet {padding: 1.0rem 0 0.5rem 0;display: flex;justify-content: flex-start;} .postPrdDet .postPrdDetInn {width: 100%;padding: 0;font-weight: bold;} .postPrdDet .postPrdCart {width: 150px;padding-top: 1.5rem;} .postPrdDet .postPrdDetInn .postPrdNo {font-size: 1.2rem;} .postPrdDet .postPrdDetInn .DetPay {font-size: 2.0rem;} .postPrdDet .postPrdDetInn .DetPay span {font-size: 2.6rem;} .DetSituation {padding: 0.5rem 0rem;} /* 投稿コメント表示タイトル */ .postBodyTi { width: 100%; position: relative; padding-top: 2.0rem; padding-bottom: 2.0rem; text-align: center; line-height: 1.0; color: var(--app-postBodyTi-txt); /* テキスト色 */ font-size: 1.4rem; font-weight: bold; } .postBodyTi:before { position: absolute; top: calc(50% - 1px); left: 0; width: 100%; height: 1px; content: ''; background: var(--app-postBodyTi-txt); /* テキスト色 */ } .postBodyTi span { position: relative; padding: 0 1em; background: var(--app-postList-bg); /* 背景色 */ } /* トピックスデータエリア */ .boardPostData {padding: 1.5rem 0 0 0} /* 削除時 */ .postList li.remove{padding:0.5rem 0;} .postList li.remove .postDate, .postList li.remove .postBody, .postList li.remove .postBodyTi, .postList li.remove .postPrdDet{visibility:hidden;width:0;height:0;margin:0;padding:0;} .postList li.remove .postText{width:100%;} .postList li.remove .postTtl{padding: 0.5rem 0;font-size:1.4rem;font-weight:inherit;} .postList li.remove .postCaut{padding: 0.5rem 0;font-size: 1.6rem;font-weight:700;} .postList li.remove .postBt{font-size: 1.4rem;padding: 1.0rem 0 0;} .postList li.remove .editBt a, .postList li.remove .editBt button, .postList li.remove .editBt span{font-size: 1em;padding:0.5rem 0 ;font-weight: inherit;} /*** ボタン処理 ***/ /* マイページ内編集完了ボタン */ .editRegBt { margin: 2.0rem auto; padding: 1.5rem 0.5rem; width: 50%; font-size: clamp(1.6rem, 1.6vw, 2.0rem); color: var(--bt-bl-txt); background: var(--bt-bl); border: var(--bt-bl-brd); box-shadow: var(--bt-bl-sd); border-radius: var(--BtM-rod);-webkit-border-radius: var(--BtM-rod);-moz-border-radius: var(--BtM-rod); /* 角丸 */ } @media screen and (max-width: 600px) { .postList {margin: 0 auto;padding: 1.0rem;border: none;} .mypageBoxInnTi .postList {margin: 1.5rem 0;} .postList li {padding: 1.5rem 0;display: block;} .postDate {width: 100%;padding-bottom: 1.5rem;} .postText {width: 100%;} .postDate .postImg {padding-bottom: 1.5rem;} /* 写真 */ .postDate .postDateDetail {padding: 0.5rem 0 1.0rem 0;} .postBt p {padding: 0 0.2rem;width: 50%;} .DetSituation {width: 100px;padding: 0.5rem 0 1.5rem 0;} .editRegBt {padding: 2.0rem 0.5rem;width: 90%;} .postDate .postDateIco .IcoBox {width: 100px;} } /* ** myp_post end ** */ /* ** myp_pay start ** */ /*** 領収書（請求書）帳票表示枠 ***/ .invoice {margin: 0 auto;padding: 2.0rem 0;} .popupArea.invoice {width: 960px;} .invoice h1 {font-size: 4.0rem;padding: 0.5rem 0 2.0rem 0;text-align: center;} .estimateBox {margin: 0 auto;} .invoiceInnPrf { padding: 1.0rem 0; display: flex; -webkit-justify-content: space-between; justify-content: space-between; } .invoiceRgt {width: 50%;} .invoiceLft {width: 40%;} /* 宛先名（個人・事業者） */ .invoiceCrpName { text-align: left; margin: 0 0 1.5rem 0; padding: 0.5rem 1.0rem; border-bottom: 1px solid var(--app-invoice-brd); display: flex; -webkit-justify-content: space-between; justify-content: space-between; align-items: end; } .invoiceCrpNameDet { font-size: clamp(1.8rem, 2.0vw, 2.0rem); } .invoiceCrpNameAdd { font-size: clamp(1.4rem, 1.6vw, 1.6rem); } /* 注意書き */ .invoiceRgtTxt { font-size: 1.6rem; text-align: left; margin: 0; padding: 1.5rem 1.0rem; } /* 合計金額表示 */ .invoiceRgtTotal {width:100%;margin: 0;padding-top: 2.0rem;} .invoiceRgtTotal table { width:100%; font-size: 1.3rem; font-weight: bold; } .invoiceRgtTotal th {width: 30%;padding: 1.0rem;color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg);border: 1px solid var(--app-invoice-tabele-brd);text-align: center;} .invoiceRgtTotal td {padding: 1.0rem;color: var(--app-invoice-td-txt);background: var(--app-invoice-td-bg);border: 1px solid var(--app-invoice-tabele-brd);text-align: left;} .invoiceRgtTotal td.ClaimTd {text-align: right;} .invoiceRgtTotalPay {font-size: 2.0rem;} .invoiceDocNo {font-size: 1.2rem;font-weight: normal;text-align: right;padding: 0 0 0.8rem 0;}/* ドキュメント番号表示 */ .invoiceDay {font-size: 1.4rem;font-weight: bold;text-align: right;padding: 0 0 1.5rem 0;}/* 請求日表示 */ .invoiceRgtTotal td.tbgb {background: var(--app-invoice-td-bg-oth);} /* 背景色(色に変化をつける場合) */ /* 請求者表示 */ .invoiceAdd { padding: 1.5rem 2.0rem; background: var(--app-invoice-bg); border: 1px solid var(--app-invoice-brd); text-align: leftt; border-radius: var(--app-invoice-rod); position: relative; } .invoiceSenderCrp {font-size: 2.0rem;font-weight: bold;}/* 会社名 */ .invoiceSenderName {font-size: 1.6rem;padding-bottom: 1.0rem;}/* 担当者名 */ .invoicePostCode, .invoiceAddress1, .invoiceAddress2 {font-size: 1.4rem;}/* 住所 */ .invoiceTel {padding: 0.5rem 0;font-size: 1.4rem;}/* 電話番号 */ .invoiceNo {font-size: 1.4rem;}/* 適格請求書番号 */ /* 電子印鑑 */ .invoiceSign {position: absolute;right: -1.0rem;bottom: 1.0rem;} .invoiceSign img {width: 120px;} .invoiceStamp {width:100%;margin: 2.0rem auto 0 auto;padding: 0;display: flex;justify-content: flex-end;gap: 0 0.2rem;} .invoiceStampBox {width: 80px;height: 80px;border: 1px solid var(--app-invoice-brd);} /* 見積・請求項目名 */ .invoiceQuotationName { font-size: 2.2rem; text-align: left; margin: 1.5rem 0; padding: 0.5rem 1.0rem; border-bottom: 1px solid var(--app-invoice-brd); display: flex; -webkit-justify-content: start; justify-content: start; align-items: center; } .invoiceQuotationSubject { font-size: 1.6rem; white-space:nowrap; } /* 請求一覧 */ .invoiceInnList {width:100%;margin: 0;padding: 4.0rem 0;} .invoiceInnList table {width:100%;font-size: 1.4rem;font-weight: normal;} .invoiceInnList th {padding: 1.0rem;color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg);border: 1px solid var(--app-invoice-tabele-brd);text-align: center;} .invoiceInnList td {padding: 1.5rem 1.0rem;color: var(--app-invoice-td-txt);background: var(--app-invoice-td-bg);border: 1px solid var(--app-invoice-tabele-brd);} .invoiceInnList .koumoku {width: 550px;} .invoiceInnList .tekiyou {width: 300px;} .invoiceInnList .tanni, .invoiceInnList .suryou, .invoiceInnList .zeiritsu {width: 80px;} .invoiceInnList .tanka, .invoiceInnList .syoukei, .invoiceInnList .syouhizei, .invoiceInnList .kingaku {width: 120px;} .invoiceInnList .sagyoubi {width: 200px;} .invoiceInnList .editBt {width: 80px;} .invoiceInnList .editBt a {padding: 0.5rem 1.0rem;font-size: 1.2rem;white-space:nowrap;} .invoiceListName {padding: 0.5rem 0;font-size: 1.5rem;}/* 項目名 */ .invoiceInnList .tanka, .invoiceInnList .syouhizei {font-size: 1.2rem;}/* 単価・消費税 */ /* 明細項目 */ .invoiceInnList td.syoukei.tdbg {background: #fff2f2;} .invoiceInnList td.syouhizei.tdbg {background: #f8f8f8;} .invoiceInnList td.kingaku.tdbg {background: #feffda;} /* 小計項目 */ .invoiceInnList td.invoice_totalTi.tdbg {background: #f3f3f3;} .invoiceInnList td.invoice_total_syoukei.tdbg {background: #f8ceda;} .invoiceInnList td.invoice_total_syouhizei.tdbg {background: #edf2f6;} .invoiceInnList td.invoice_total_kingaku.tdbg {background: #f1f4c4;} /* 各種明細 */ hr.meisaiBoxLine {border: solid 1px #fff;background-color: #fff;} .invoiceListDet {padding: 0;border-top: dotted 1px #999;} .invoiceListDet h2 {font-size: 2.5rem;padding: 0.5rem;} .invoiceListDetDataTime {font-size: 1.4rem;} .invoiceListDetDataName {font-size: 1.4rem;} .invoiceDetInn .invoiceListDet {padding: 0;border-top: none;}/* 詳細ページ内表示用 */ /* 振込先・インボイス対応エリア */ .invoiceInnBank {margin: 3.0rem auto;display: flex;-webkit-justify-content: space-between;justify-content: space-between;} .invoiceBankRgt {width: 40%;padding: 0 1.0rem;} .invoiceBankLft {width: 50%;} @media screen and (max-width: 600px) { .invoiceDetInn .invoiceInnBank {display: block;} .invoiceDetInn .invoiceBankRgt {width: 100%;} .invoiceDetInn .invoiceBankLft {width: 100%;margin-top: 2.5rem;} } /* 合計金額エリア */ .invoiceInnBankList table {width:100%;font-size: 1.4rem;font-weight: bold;} .invoiceInnBankList th {width: 130px;padding: 1.0rem;color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg);border: 1px solid var(--app-invoice-tabele-brd);text-align: center;} .invoiceInnBankList td {padding: 1.0rem;color: var(--app-invoice-td-txt);background: var(--app-invoice-td-bg);border: 1px solid var(--app-invoice-tabele-brd);} .invoicTaxOth {font-size: 1.6rem;} .invoicTaxTotal {font-size: 2.0rem;} /* 内訳情報 */ .invoiceInnbreakdown dl {display: flex;-webkit-justify-content: space-between;justify-content: space-between;padding: 0 1.5rem;font-size: 1.4rem;font-weight: normal;} .invoiceInnbreakdown dt {} .invoiceInnbreakdown dd {text-align: right;} /* 口座情報 */ .invoiceInnBankDl dl {display: flex;padding: 0.5rem 0;font-size: 1.4rem;} .invoiceInnBankDl dt {width: 30%;} .invoiceInnBankDl dd {width: 70%;} /* ** myp_pay end ** */ /* ** myp_order_meisai start ** */ /*** マイページ購入商品詳細表示枠 ***/ /* 基本枠 */ .meisaiPrdDet {width: 100%;} /* タイトル表示設定 */ .meisaiPrdDetTi { margin: 1.5rem auto; padding: 1.5rem 1.0rem; border-top: 1px solid #cdcdcd; border-bottom: 1px solid #cdcdcd; color: #171717; background: #fff; font-size: clamp(1.4rem, 1.6vw, 1.6rem); } /* 配送先テーブル枠 */ .PrdDetTableT th {width: 30%;} /* 商品型番・商品番号 */ .PrdDetTable p.prdDetNo {font-size: 1.0rem;} .PrdDetTable p.prdDetName {font-size: 1.6rem;} .PrdDetTable .TableBgTanka {font-size: 1.4rem;background: var(--td-Tanka-bg);}/* 商品単価 */ .PrdDetTable .TableBgQuantity {font-size: 1.4rem;background: var(--td-Quantity-bg);}/* 商品個数 */ .PrdDetTable .TableBgSubtotal {font-size: 1.4rem;background: var(--td-Subtotal-bg);}/* 小計 */ .PrdDetTable .TableBgProducttotal {font-size: 1.6rem;background: var(--td-Producttotal-bg);}/* 商品合計 */ .PrdDetTable span.ProducttotalPay {font-size: 1.4rem;} .PrdDetTable .TableBgPostage {font-size: 1.2rem;background: var(--td-Postage-bg);}/* 送料 */ .PrdDetTable span.PostagePay {font-size: 1.4rem;} .PrdDetTableT td.TableBGTotal, .PrdDetTable td.TableBGTotal {font-size: 1.4rem;background: var(--td-Total-bg);}/* 合計金額 */ .PrdDetTable span.TotalPay {font-size: 1.8rem;} .PrdDetTable td.TableBGAdjustment {font-size: 1.2rem;background: var(--td-Adjustment-bg);}/* 調整金額 */ .PrdDetTable span.AdjustmentPay {font-size: 1.4rem;} .PrdDetTable td.TableBGTax {font-size: 1.2rem;background: var(--td-Tax-bg);}/* 税金 */ .PrdDetTable span.TaxPay {font-size: 1.2rem;} /* ** myp_order_meisai end ** */ /* ** myp_push start ** */ /*** マイページ通知一覧表示枠 ***/ /* 基本枠 */ .pushList { list-style: none; margin: 1.0rem auto; padding: 2.0rem; border-radius: var(--app-pushList-rod);-webkit-border-radius: var(--app-pushList-rod);-moz-border-radius: var(--app-pushList-rod);/* 角丸 */ border: var(--app-pushList-brd); /* ボーダー指定 */ background: var(--app-pushList-bg); /* 背景色 */ box-shadow: var(--app-pushList-bbg);/* 背景影色 */ } /* 項目枠 */ .pushList li { position: relative; margin: 0 auto; padding: 2.0rem 1.0rem; display: flex; justify-content: space-between; border-bottom: var(--app-pushList-li-brd); /* ボーダー指定 */ } /* リンク制御 */ .pushList a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition:.3s; } .pushList a:hover { background: var(--app-pushList-a-bg); /* 背景色 */ filter: alpha(opacity=15);-moz-opacity:0.15;opacity:0.15;text-decoration: none; } /* 日付エリア */ .pushDate { width: 20%; padding-top: 0.5rem; font-size: clamp(1.2rem, 1.4vw, 1.4rem); font-weight: bold; } /* タイトル・テキストエリア */ .pushText {display: flex;justify-content: space-between;flex-wrap: wrap;width: 80%;} /* タイトル */ .pushTtl { font-size: clamp(1.8rem, 2.0vw, 2.0rem); font-weight: bold; min-width: 100%; margin-right: 2.0rem; flex-shrink:0; } /* テキスト */ .pushBody {font-size: clamp(1.4rem, 1.6vw, 1.6rem);min-width: 100%;} @media screen and (max-width: 480px) { .pushList {padding: 1.0rem;} .pushList li {display: block;} .pushDate {width: 100%;padding-top: 0;} .pushText {display: block;width: 100%;} } /* ** myp_push end ** */