@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,'); /* 写真管理 */ --app-mypagecamera-ico: url('data:image/svg+xml;utf8,'); /* 写真管理白アイコン */ --app-mypagecamera-ico-w: url('data:image/svg+xml;utf8,'); /* 動画管理 */ --app-mypagemovie-ico: url('data:image/svg+xml;utf8,'); /* 動画管理白アイコン */ --app-mypagemovie-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; } /* 主にマイページ内サイドナビで使用 */ .mypCtmMain .mypage_naviTi {margin: 3.5rem auto 0.5rem auto;padding: 0.4rem 0.5rem;color: var(--app-mypagenav-txt);font-size: clamp(1.4rem, 1.4vw, 1.4rem);font-weight: bold;background: none;}/* ナビタイトル */ .mypCtmMain.mypagenav ul {padding: 1.0rem 0;border-top: var(--app-mypagenav-brd);border-bottom: var(--app-mypagenav-brd);}/* メインナビ */ .mypCtmMain.mypagenav a {margin: 0.2em 0;padding: 0.8em 0.5em 0.8em 2.8em;border: none;box-shadow: none;font-size: clamp(1.4rem, 1.6vw, 1.6rem);} .mypCtmSub.mypagenav ul {padding: 1.0rem 0;}/* サブナビ */ .mypCtmSub.mypagenav a {margin: 0.2em 0;padding: 0.4em 0.5em 0.4em 2.8em;border: none;box-shadow: none;font-size: clamp(1.3rem, 1.0vw, 1.3rem);} .drawer .mypCtmMain, .drawer .mypCtmSub {padding: 1.5rem;} .drawer .mypCtmMain .mypage_naviTi {margin: 0.5rem auto;} .drawer .mypCtmSub {margin: 1.0rem auto;} /* ** 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_prof start ** */ /*** マイページナビ(プロフ写真エリア) ***/ /* 会員写真枠 */ .myPhotoBox { padding: 0; 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 {position: relative;margin: 0 auto;padding: 1.5rem;} /* 名前等基本設定 */ .myPhoto p.myName, .myPhoto p.myCorp, .myPhoto p.myData, .myPhoto p.myTxt, .myPhoto p.myLastLogin { margin: 0 auto; padding: 0; color: var(--app-myPhoto-txt); /* テキスト色 */ text-align: center; font-weight: normal; } .myPhoto p.myName.lft, .myPhoto p.myCorp.lft, .myPhoto p.myData.lft, .myPhoto p.myTxt.lft, .myPhoto p.myLastLogin.lft {text-align: left;} /* 名前 */ .myPhoto p.myName { padding: 0.5em 0; font-size: clamp(2.0rem, 2.0vw, 2.0rem); font-weight: bold; } .myPhoto p.myName.NameB {padding-bottom: 0.2rem;font-size: clamp(2.4rem, 2.4vw, 2.4rem);}/* 文字サイズ大 */ .myPhoto p.myCorp {font-size: clamp(1.2rem, 1.2vw, 1.2rem);}/* 会社名等 */ .myPhoto p.myData {padding: 0.5em 0;font-size: clamp(1.4rem, 1.4vw, 1.4rem);} .myPhoto p.myData span {font-size: clamp(1.8rem, 1.8vw, 1.8rem);}/* 各種データ等 */ .myPhoto p.myTxt {padding: 1.0em 0;font-size: clamp(1.2rem, 1.2vw, 1.2rem);}/* 概要等 */ /* 星等のアイコン画像 */ .myStar {text-align: center;} .myStar img {width: 60px;margin: 0 auto;padding: 0.2em 0;} .myPhoto .icoPosLB {position: absolute;top: 0.5rem;left: 0.5rem;} .myPhoto .icoPosLB2 {position: absolute;top: 3.0rem;left: 0.5rem;} .myPhoto .icoPosRB {position: absolute;top: 0.5rem;right: 0.5rem;} .myPhoto .icoPosRB2 {position: absolute;top: 3.0rem;right: 0.5rem;} .myPhoto .friendBox {position: absolute;top: 0.2rem;left: 7.0rem;} /* 最終ログイン */ .myPhoto p.myLastLogin {padding: 0.5em 0;font-size: clamp(1.2rem, 1.2vw, 1.2rem);} /* プロフ内ボタン */ .StsBtArea {margin-top: 1.5rem;display: flex;justify-content: center;gap: 0 0.5rem;} .StsBtArea .editBt {width: 100%;} .StsBtArea .editBt a, .StsBtArea .editBt span {width: 100%;padding: 1.0rem;font-size: 1.4rem;} /* マイページ写真単体 */ .myPhoto .photoAreaPos {position: relative;margin: 0 auto;width: var(--app-photoArea-size);height: var(--app-photoAreah-size);} .myPhoto .photoArea { 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); /* 背景色 */ } .photoArea a:hover {opacity: 0.7;} .myPhoto .photoArea {max-width: var(--app-photoArea-size);height: var(--app-photoAreah-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%);} .onptIcoDbl {top:-0.5rem;right: -0.5rem;} /* 写真表示(サークル) */ .photo_circleOn .myPhoto .photoArea { border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;/* 角丸 */ } .photo_circleOn .onptIcoDbl {top: 1.5rem;right: 0.5rem;} /* 写真表示(長方形) */ .photo_RectangleOn .myPhoto .photoAreaPos {width: 100%;height: 16.0rem;} .photo_RectangleOn .myPhoto .photoArea {max-width: 100%;width: 100%;height: 16.0rem;} /* 写真大きさ */ @media screen and (max-width: 600px) { .photo_RectangleOn .myPhoto .photoAreaPos {height: 21.0rem;} .photo_RectangleOn .myPhoto .photoArea {height: 21.0rem;} } /*** 名前表示(プラン表示あり) ***/ .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;} /*** 横並びでプロフィールを表示するパターン ***/ .sidelayout .myPhoto {display: flex;gap: 0 2.5rem;} .sidelayout .myPhoto .photoArea {max-width: var(--app-photoArea-sizeS);height: var(--app-photoAreah-sizeS);} /* 写真大きさ */ .sidelayout .myPhoto .photoAreaPos {width: var(--app-photoArea-sizeS);height: var(--app-photoAreah-sizeS);} .sidelayout .myPhoto .photoAreaImg {} .sidelayout .myPhoto .photoAreaDetail {width: 100%;} .sidelayout .myPhoto p.myName {margin: 0;padding: 0;font-size: clamp(1.6rem, 1.6vw, 1.6rem);} .sidelayout .myPhoto p.myLastLogin {margin: 0;padding: 0.5em 0;text-align: left;font-size: clamp(1.2rem, 1.2vw, 1.2rem);} .sidelayout .planOrd {margin: 1.0rem 0 0 0;} .sidelayout .myPhoto p.myName, .sidelayout .myPhoto p.myCorp, .sidelayout .myPhoto p.myData, .sidelayout .myPhoto p.myTxt, .sidelayout .myPhoto p.myLastLogin, .sidelayout .myStar {text-align: left;} /*** プロフ要素内でテーブル要素を入れる場合の処理 ***/ .TableBox.myPhotoTbBox table { font-size: clamp(1.2rem, 1.2vw, 1.2rem);/* フォントサイズ */ font-weight: normal; } .TableBox.myPhotoTbBox th {padding: 0.3rem;font-weight: normal;} .TableBox.myPhotoTbBox td {padding: 0.3rem;} @media screen and (max-width: 600px) { .spMyplayout .myPhoto {display: flex;gap: 0 2.5rem;padding: 0.5rem 1.5rem;} .spMyplayout .myPhoto .photoArea {max-width: var(--app-photoArea-sizeS);height: var(--app-photoAreah-sizeS);} /* 写真大きさ */ .spMyplayout .myPhoto .photoAreaPos {width: var(--app-photoArea-sizeS);height: var(--app-photoAreah-sizeS);} .spMyplayout .myPhoto .photoAreaImg {} .spMyplayout .myPhoto .photoAreaDetail {width: 100%;} .spMyplayout .myPhoto p.myName {margin: 0;padding: 0;font-size: clamp(1.6rem, 1.6vw, 1.6rem);} .spMyplayout .myPhoto p.myLastLogin {margin: 0;padding: 0.5em 0;text-align: left;font-size: clamp(1.2rem, 1.2vw, 1.2rem);} .spMyplayout .planOrd {margin: 1.0rem 0 0 0;} .spMyplayout .myPhoto p.myName, .spMyplayout .myPhoto p.myCorp, .spMyplayout .myPhoto p.myData, .spMyplayout .myPhoto p.myTxt, .spMyplayout .myPhoto p.myLastLogin, .spMyplayout .myStar {text-align: left;} .spMyplayout .myLastLogin, .spMyplayout .staffListDet, .spMyplayout .StsBtArea, .spMyplayout .icoPosLB, .spMyplayout .icoPosLB2, .spMyplayout .icoPosRB, .spMyplayout .icoPosRB2, .spMyplayout .onptIcoCom, .spMyplayout .friendBox, .spMyplayout .myCorp, .spMyplayout .myData, .spMyplayout .TableBox.myPhotoTbBox, .spMyplayout .constructionsiteListDet {display: none;} } /* ** myp_prof end ** */ /* ** myp_prof_photo start ** */ /*** 写真拡大 ***/ .fileUpPhBox { position: relative; width: 70%; 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%;} /*** 写真アップロード・トリミング処理 ***/ .fileUpCropPhBox, .fileUpCropPhChBox { width: 100%; height: 400px; margin: 0 auto; background-image: url('../../../core_sys/common/images/sys/bg.png'); } .fileUpCropPhBox img {width: 100%;max-height: 400px;} .fileUpCropPhChBox {text-align: center;} .fileUpCropPhChBox img {width: auto;max-height: 400px;} /* プロフィール箇所からの写真操作ボタンレイアウト */ .FileUpAct {padding: 1.0rem 0;} .FileUpAct .FileUpName {text-align: center;} .FileUpAct .fileUpBT a, .FileUpAct .fileDelBT a {margin: 0 auto;} /* ** myp_prof_photo end ** */ /* ** myp_basic start ** */ /*** マイページ表示枠 ***/ /*** 充実度ボックス設定 ***/ .FulfillmentBox, .FulfillmentBoxBt { 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); /* 角丸 */ padding: 2.0rem; color: var(--app-FulfillmentBox-txt); border: var(--app-FulfillmentBox-brd); background: var(--app-FulfillmentBox-bg); box-shadow: var(--app-FulfillmentBox-sd); line-height: 1.4; } .FulfillmentBoxInn {} .FulfillmentBoxCnt {} .FulfillmentTi {font-size: clamp(2.0rem, 2.2vw, 2.2rem);} .FulfillmentTxt {padding: 1.0rem 0;font-size: clamp(1.4rem, 1.4vw, 1.4rem);color: #1c1c1c;} .FulfillmentCnt {font-size: clamp(2.0rem, 7.0vw, 7.0rem);text-align: right;font-weight: bold;} .FulfillmentTotal {font-size: clamp(1.4rem, 2.0vw, 2.0rem);text-align: right;font-weight: bold;} @media screen and (max-width: 600px) { .FulfillmentBox, .FulfillmentBoxBt {padding: 3.0rem;} .FulfillmentBoxInn {width: 100%;} .FulfillmentBoxCnt {width: 60%;} } /* ボタン設定 */ .FulfillmentBox.btdezpt01 .inductionBtInn {width: 100%;} /* ** myp_basic end ** */ /* ** myp_order start ** */ /*** 枠ボックス購入・申込履歴設定 ***/ /* 基本枠 */ .mypageOrdBox, .mypageOrdBoxInn, .mypageOrdBasic, .mypageDetailBox, .mypageOrdSituation, .PlanOrderBox, .PlanOrderBoxDet { margin-left: auto; margin-right: auto; border-radius: var(--app-mypageOrdBox-rod);-webkit-border-radius: var(--app-mypageOrdBox-rod);-moz-border-radius: var(--app-mypageOrdBox-rod); /* 角丸 */ } /* 購入・申込履歴枠設定 */ .mypageOrdBox { margin: 1.0rem 0.5rem; padding: 1.0rem; border: var(--app-mypageOrdBox-brd); /* 外枠ボーダー指定 */ background: var(--app-mypageOrdBox-bg); /* 外枠背景色 */ box-shadow: var(--app-mypageOrdBox-sd);/* 外枠背景影色 */ } .mypageOrdBox:first-child {margin-top: 0;} @media screen and (max-width: 600px) { .mypageOrdBox { margin: 1.0rem 0; border-top: var(--app-mypageOrdBox-brd); border-bottom: var(--app-mypageOrdBox-brd); border-left: none; border-right: none; } } /*** 購入・申込したプラン表示設定 ***/ .mypageOrdBoxInn { margin-top: 1.5rem; margin-bottom: 1.5rem; padding: 0.5rem 2.0rem; border: var(--app-mypageOrdBoxInn-brd); /* 内枠ボーダー指定 */ background: var(--app-mypageOrdBoxInn-bg); /* 内枠背景色 */ box-shadow: var(--app-mypageOrdBoxInn-sd);/* 内枠背景影色 */ } .mypageOrdBoxInn:first-child {margin-top: 0;} .mypageOrdBoxInn:last-child {margin-bottom: 0;} /*** 購入・申込したプラン詳細表示設定 ***/ .mypageOrdBasic { padding: 1.0rem; 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;} /* 領収書サマリテーブル設定 */ .payment_history {width: 100%;} .paymenthistoryTable {width:100%;margin: 0 auto;padding: 1.0rem 0;} .paymenthistoryTable table {width:100%;font-size: 1.3rem;} .paymenthistoryTable th {padding: 0.5rem 1.0rem;white-space:nowrap;font-weight: normal;} .paymenthistoryTable td {padding: 0.5rem 1.0rem;font-weight: normal;} /*** キャンセルや解約等の状態設定 ***/ .mypageOrdSituation { margin-top: 1.5rem; margin-bottom: 1.5rem; padding: 0.5rem 0.5rem; border: var(--app-mypageOrdSituation-brd); /* 内枠ボーダー指定 */ background: var(--app-mypageOrdSituation-bg); /* 背景色 */ box-shadow: var(--app-mypageOrdSituation-sd);/* 背景影色 */ } /*** 購入商品詳細表示処理 ***/ .mypageDetailBox { margin: 1.5rem 0.5rem; padding: 1.5rem; border: var(--app-mypageDetail-brd); /* 外枠ボーダー指定 */ background: var(--app-mypageDetail-bg); /* 外枠背景色 */ font-size: clamp(1.4rem, 1.4vw, 1.4rem); } /*** その他のサービス表示処理 ***/ .PlanOrderBox {width: 100%;padding: 1.5rem;} .PlanOrderBoxDet { width: 100%; margin-top: 0.5rem; margin-bottom: 0.5rem; padding: 0; border-style: solid; border-width: 0.2rem; } .PlanOrderBoxDetInn {display: flex;justify-content: center;align-items: center;gap: 0 0.1rem;} .PlanOrderBoxDetInn > div {width: 100%;} .PlanOrderTi {text-align: center;font-weight: bold;padding: 2.0rem 0;} .PlanOrderGuide {padding: 2.0rem;font-size: 1.4rem;font-weight: normal;text-align: left;} /* 購入済み表示枠指定 */ .PlanOrderPurch {text-align: center;font-weight: bold;padding: 0 0 2.0rem 0;} .planPurchTi { margin-bottom: 0.5rem; padding: 0.8rem 1.5rem; color: var(--app-planPurchTi-txt); background: var(--app-planPurchTi-bg); border: var(--app-planPurchTi-brd); font-size: clamp(1.4rem, 1.4vw, 1.4rem); } /* 料金表示指定 */ .planName {font-size: 1.4rem;padding: 0.2rem 0;} .planPay {font-size: 1.6rem;padding: 0.3rem 0;} .planPay span {font-size: 3.2rem;line-height: 1.0em;padding: 0 0.3rem;} .planPaySup {font-size: 1.4rem;} .planPayTxt {font-size: 1.2rem;} @media screen and (max-width: 600px) { .PlanOrderGuide {padding: 0.5rem 1.0rem;} } .tab_dezpt03 .mypageOrdBox .tab-munu {background: var(--tab-munu-mypOrd-brd);border: 1px solid var(--tab-munu-mypOrd-brd);} .tab_dezpt03 .mypageOrdBox .tab-munu > label.tab-munu-bt { border-color: var(--tab-munu-tp03-brd) var(--tab-munu-mypOrd-brd) var(--tab-munu-mypOrd-brd); background-color: var(--tab-munu-mypOrd-bg); color: var(--tab-munu-mypOrd-txt); } .tab_dezpt03 .mypageOrdBox .tab-munu label.tab-munu-bt.is-active { border-color: var(--tab-munu-mypOrd-brd) var(--tab-munu-mypOrd-brd) var(--tab-munu-mypOrd-bg); background-color: var(--tab-munu-mypOrd-bg); } .tab_dezpt03 .mypageOrdBox .tab-munu > div {padding: 0;background-color: var(--tab-munu-mypOrd-bg);} /* ** 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 ** */ /*** 領収書（請求書）帳票表示枠 ***/ /* 帳票印刷画面共通処理 */ body.ReportPrint {background: #eee;} body.ReportPrint .popupArea {padding-top: 7.0rem;} .estimateBox {margin: 0 auto;} /* 帳票印刷ヘッダー処理 */ .ReportPrintHead { width: 100%; margin: 0 auto; padding: 1.0rem 1.0rem; background: #191919; position: fixed; z-index: 3; } .ReportPrintHeadBt {display: flex;justify-content: flex-end;gap: 0 0.5rem;} .ReportPrintHeadBt button { padding: 0.5rem 3.0rem; width: 100%; font-size: clamp(1.4rem, 1.4vw, 1.4rem); box-shadow: none; } /* 帳票印刷画面枠処理（A4縦・横基本） */ .invoice {margin: 0 auto;} .ReportPrintBox { margin-left: auto; margin-right: auto; margin-bottom: 2.0rem; padding: 0; color: var(--app-BgBox-txt); /* テキスト色 */ border-radius: var(--BgBox-rod);-webkit-border-radius: var(--BgBox-rod);-moz-border-radius: var(--BgBox-rod); /* 角丸 */ border: var(--app-BgBox-brd); /* 外枠ボーダー指定 */ background: var(--app-BgBox-bg); /* 外枠背景色 */ box-shadow: var(--app-BgBox-sd);-webkit-box-shadow: var(--app-BgBox-sd); /* 外枠背景影色 */ } .ReportPrintBoxInn {margin: 0 auto;padding: 3.0rem;} .invoiceInnPrf, .invoiceInnHdb, .invoiceInnHdbY, .invoiceInnFtb, .invoiceInnLtb { padding: 1.0rem 0; display: flex; -webkit-justify-content: space-between; justify-content: space-between; } .invoiceRgt {width: 52%;} .invoiceLft {width: 43%;} .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-brd);margin-bottom: 1.5rem;padding: 0;} .invoiceInnFtb {border-top: 1px solid var(--app-invoice-brd);} /* 帳票印刷画面枠処理（A4横個別） */ .invoiceInnHdbY {margin-bottom: 2.0rem;padding: 0;} .invoiceInnHdbY .invoiceYRgt {width: 25%;} .invoiceInnHdbY .invoiceYCnt {width: 50%;} .invoiceInnHdbY .invoiceYLft {width: 25%;} .invoiceInnLtb .invoiceYLRgt {width: 75%;} .invoiceInnLtb .invoiceYLLft {width: 23%;} /* 帳票印刷画面タイトル処理 */ .invoice h1 { font-size: clamp(2.6rem, 3.0vw, 3.0rem); padding:1.0rem 0; text-align: center; } /* 宛先名（個人・事業者） */ .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.4rem; text-align: left; margin: 0; padding: 1.5rem 1.0rem; } /* 基本情報・合計金額表示（テーブル要素） */ .invoiceRgtBasic, .invoiceRgtTotal {width:100%;margin: 0;padding-top: 1.0rem;} .invoiceRgtBasic.RgtmgtB {margin-top: 3.7rem;} .invoiceRgtBasic table, .invoiceRgtTotal table { width:100%; font-size: 1.3rem; font-weight: bold; } .invoiceRgtBasic th, .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-table-brd);text-align: center;} .invoiceRgtBasic td, .invoiceRgtTotal td {padding: 1.0rem;color: var(--app-invoice-td-txt);background: var(--app-invoice-td-bg);border: 1px solid var(--app-invoice-table-brd);text-align: left;} .invoiceRgtBasic td.ClaimTd, .invoiceRgtTotal td.ClaimTd {text-align: right;} .invoiceRgtTotalPay {font-size: 2.0rem;} .invoiceDocNo {font-size: 1.1rem;font-weight: normal;text-align: right;padding: 0 0 0.4rem 0;}/* ドキュメント番号表示 */ .invoiceDay {font-size: 1.4rem;font-weight: bold;text-align: right;padding: 0 0 1.5rem 0;}/* 請求日表示 */ .invoiceRgtBasic td.tbgb, .invoiceRgtTotal td.tbgb {background: var(--app-invoice-td-bg-oth);} /* 背景色(色に変化をつける場合) */ /* 基本情報・合計金額表示（DL要素） */ .invoiceRgtBasicDL {width:100%;margin: 0;padding: 1.0rem 0.5rem;} .invoiceRgtBasicDL dl {display: flex;font-size: 1.3rem;} .invoiceRgtBasicDL dt {width:30%;} .invoiceRgtBasicDL dd {width:70%;} /* 請求者ロゴ */ .invoiceLogo {padding: 0 0 1.0rem 0;text-align: right;} .invoiceLogo img {max-height: 50px;} /* 請求者表示 */ .invoiceAdd { padding: 1.5rem; background: var(--app-invoice-bg); border: 1px solid var(--app-invoice-brd); text-align: leftt; border-radius: var(--app-invoice-rod); position: relative; line-height: 1.2em; } .invoiceSenderCrp {font-size: 1.8rem;font-weight: bold;}/* 会社名 */ .invoiceSenderName {font-size: 1.4rem;padding: 0.2rem 0 1.0rem 0;}/* 担当者名 */ .invoicePostCode, .invoiceAddress1, .invoiceAddress2 {font-size: 1.3rem;}/* 住所 */ .invoiceTel {font-size: 1.3rem;}/* 電話番号 */ .invoiceNo {font-size: 1.3rem;}/* 適格請求書番号 */ /* 電子印鑑 */ .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: 70px;height: 70px;border: 1px solid var(--app-invoice-brd);padding-top: 0.7rem;} /* 電子印鑑(個人) */ .stamp { font-size: 1.2rem; border: 2px solid #f00; border-radius: 50%; color:#f00; width: 54px; height: 54px; position: relative; margin: auto; } .stamp span { display: inline-block; width:100%; text-align:center; } .stamp span:first-child { position:absolute; top: 15px; left: 0; right: 0; margin :auto; width: 80%; line-height: 1; } /* 印紙枠 */ .invoiceStampBoard {width: 70px;height: 80px;border: 1px solid var(--app-invoice-brd);text-align: center;padding-top: 3.0rem;} .invoiceStampBoard p {font-size: 1.0rem;color: 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 0.5rem 0;} .invoiceInnList table {width:100%;font-size: 1.3rem;font-weight: normal;} .invoiceInnList th {padding: 0.5rem 1.0rem;color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg);border: 1px solid var(--app-invoice-table-brd);text-align: center;white-space:nowrap;} .invoiceInnList td {padding: 0.5rem 1.0rem;color: var(--app-invoice-td-txt);background: var(--app-invoice-td-bg);border: 1px solid var(--app-invoice-table-brd);} .invoiceInnList .koumoku {width: 45.0rem;} .invoiceInnList .tanni, .invoiceInnList .suryou, .invoiceInnList .zeiritsu {width: 80px;} .invoiceInnList .tanka, .invoiceInnList .syoukei, .invoiceInnList .syouhizei, .invoiceInnList .kingaku {width: 12.0rem;white-space:nowrap;} .invoiceInnList .invoice_total_syoukei, .invoiceInnList .invoice_total_syouhizei, .invoiceInnList .invoice_total_kingaku {white-space:nowrap;} .invoiceInnList .tekiyou, .invoiceInnList .sagyoubi {width: 30.0rem;} .invoiceInnList .editBt, .invoiceInnList .clearBt {width: 8.0rem;} .invoiceInnList .DataDispSubBt .editBt, .invoiceInnList .DataDispSubBt .clearBt {width: 100%;} .invoiceInnList .editBt a, .invoiceInnList .editBt span, .invoiceInnList .clearBt a, .invoiceInnList .clearBt span {padding: 0.5rem 1.0rem;font-size: 1.2rem;white-space:nowrap;} .invoiceListName {padding: 0.5rem 0;font-size: 1.3rem;}/* 項目名 */ .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.0rem;padding: 0.5rem;} .invoiceListDetDataTime {font-size: 1.3rem;} .invoiceListDetDataName {font-size: 1.3rem;text-align: left;} /* 振込先・インボイス対応エリア */ .invoiceInnBank {margin: 2.0rem auto;display: flex;-webkit-justify-content: space-between;justify-content: space-between;} .invoiceBankRgt {width: 48%;padding: 0 1.0rem;} .invoiceBankLft {width: 50%;} /* 合計金額エリア */ .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-table-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-table-brd);} .invoiceInnBankList td.invoiceInnbreakdown {padding: 1.0rem 0;} .invoicTaxOth {font-size: 1.6rem;} .invoicTaxTotal {font-size: 2.0rem;} /* 内訳情報 */ .invoiceInnbreakdown dl {display: flex;-webkit-justify-content: space-between;justify-content: space-between;align-items: center;padding: 0 1.5rem;font-weight: normal;} .invoiceInnbreakdown dt {font-size: 1.2rem;} .invoiceInnbreakdown dd {text-align: right;font-size: 1.2rem;} .invoiceInnbreakdown dd span {font-size: 1.4rem;} /* 口座情報 */ .invoiceInnBankDl dl {display: flex;padding: 0.5rem 0;font-size: 1.3rem;} .invoiceInnBankDl dl.almct {align-items: center;} .invoiceInnBankDl dt {width: 30%;} .invoiceInnBankDl dd {width: 70%;} /* 削除処理時のボタン隠し処理 */ .invoiceDel .DeleteNone {display: none;} /*** 領収書（請求書）帳票のデザインパターン ***/ /* フォント指定 */ .ClaimDezFTG.invoice {} .ClaimDezFTM.invoice {font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳＰ明朝", "ＭＳ明朝", serif;} /** カラーバリエーション指定 **/ /* カラーパターン_kd */ .ClaimDezCK01 .invoiceRgtBasic th, .ClaimDezCK01 .invoiceRgtTotal th, .ClaimDezCK01 .invoiceInnList th, .ClaimDezCK01 .invoiceInnBankList th {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-01);border: 1px solid var(--app-invoice-table-brd-01);} .ClaimDezCK01 .invoiceRgtBasic td, .ClaimDezCK01 .invoiceRgtTotal td, .ClaimDezCK01 .invoiceInnList td, .ClaimDezCK01 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-01);} .ClaimDezCK01.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-01);} .ClaimDezCK01 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-01);} .ClaimDezCK01.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK01.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK01.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-01);border: 1px solid var(--app-invoice-table-brd-01);} .ClaimDezCK01.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK01.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK01.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-01);border-top: none;} /* カラーパターン_kb */ .ClaimDezCK02 .invoiceRgtBasic th, .ClaimDezCK02 .invoiceRgtTotal th, .ClaimDezCK02 .invoiceInnList th, .ClaimDezCK02 .invoiceInnBankList th {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-02);border: 1px solid var(--app-invoice-table-brd-02);} .ClaimDezCK02 .invoiceRgtBasic td, .ClaimDezCK02 .invoiceRgtTotal td, .ClaimDezCK02 .invoiceInnList td, .ClaimDezCK02 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-02);} .ClaimDezCK02.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-02);} .ClaimDezCK02 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-02);} .ClaimDezCK02.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK02.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK02.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-02);border: 1px solid var(--app-invoice-table-brd-02);} .ClaimDezCK02.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK02.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK02.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-02);border-top: none;} /* カラーパターン_kr */ .ClaimDezCK03 .invoiceRgtBasic th, .ClaimDezCK03 .invoiceRgtTotal th, .ClaimDezCK03 .invoiceInnList th, .ClaimDezCK03 .invoiceInnBankList th {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-03);border: 1px solid var(--app-invoice-table-brd-03);} .ClaimDezCK03 .invoiceRgtBasic td, .ClaimDezCK03 .invoiceRgtTotal td, .ClaimDezCK03 .invoiceInnList td, .ClaimDezCK03 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-03);} .ClaimDezCK03.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-03);} .ClaimDezCK03 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-03);} .ClaimDezCK03.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK03.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK03.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-03);border: 1px solid var(--app-invoice-table-brd-03);} .ClaimDezCK03.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK03.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK03.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-03);border-top: none;} /* カラーパターン_kg */ .ClaimDezCK04 .invoiceRgtBasic th, .ClaimDezCK04 .invoiceRgtTotal th, .ClaimDezCK04 .invoiceInnList th, .ClaimDezCK04 .invoiceInnBankList th {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-04);border: 1px solid var(--app-invoice-table-brd-04);} .ClaimDezCK04 .invoiceRgtBasic td, .ClaimDezCK04 .invoiceRgtTotal td, .ClaimDezCK04 .invoiceInnList td, .ClaimDezCK04 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-04);} .ClaimDezCK04.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-04);} .ClaimDezCK04 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-04);} .ClaimDezCK04.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK04.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK04.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-04);border: 1px solid var(--app-invoice-table-brd-04);} .ClaimDezCK04.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK04.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK04.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-04);border-top: none;} /* カラーパターン_ky */ .ClaimDezCK05 .invoiceRgtBasic th, .ClaimDezCK05 .invoiceRgtTotal th, .ClaimDezCK05 .invoiceInnList th, .ClaimDezCK05 .invoiceInnBankList th {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-05);border: 1px solid var(--app-invoice-table-brd-05);} .ClaimDezCK05 .invoiceRgtBasic td, .ClaimDezCK05 .invoiceRgtTotal td, .ClaimDezCK05 .invoiceInnList td, .ClaimDezCK05 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-05);} .ClaimDezCK05.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-05);} .ClaimDezCK05 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-05);} .ClaimDezCK05.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK05.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK05.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt-w);background: var(--app-invoice-th-bg-05);border: 1px solid var(--app-invoice-table-brd-05);} .ClaimDezCK05.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK05.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK05.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-05);border-top: none;} /* カラーパターン_ud */ .ClaimDezCK06 .invoiceRgtBasic th, .ClaimDezCK06 .invoiceRgtTotal th, .ClaimDezCK06 .invoiceInnList th, .ClaimDezCK06 .invoiceInnBankList th {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-06);border: 1px solid var(--app-invoice-table-brd-06);} .ClaimDezCK06 .invoiceRgtBasic td, .ClaimDezCK06 .invoiceRgtTotal td, .ClaimDezCK06 .invoiceInnList td, .ClaimDezCK06 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-06);} .ClaimDezCK06.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-06);} .ClaimDezCK06 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-06);} .ClaimDezCK06.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK06.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK06.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-06);border: 1px solid var(--app-invoice-table-brd-06);} .ClaimDezCK06.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK06.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK06.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-06);border-top: none;} /* カラーパターン_ub */ .ClaimDezCK07 .invoiceRgtBasic th, .ClaimDezCK07 .invoiceRgtTotal th, .ClaimDezCK07 .invoiceInnList th, .ClaimDezCK07 .invoiceInnBankList th {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-07);border: 1px solid var(--app-invoice-table-brd-07);} .ClaimDezCK07 .invoiceRgtBasic td, .ClaimDezCK07 .invoiceRgtTotal td, .ClaimDezCK07 .invoiceInnList td, .ClaimDezCK07 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-07);} .ClaimDezCK07.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-07);} .ClaimDezCK07 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-07);} .ClaimDezCK07.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK07.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK07.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-07);border: 1px solid var(--app-invoice-table-brd-07);} .ClaimDezCK07.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK07.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK07.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-07);border-top: none;} /* カラーパターン_ur */ .ClaimDezCK08 .invoiceRgtBasic th, .ClaimDezCK08 .invoiceRgtTotal th, .ClaimDezCK08 .invoiceInnList th, .ClaimDezCK08 .invoiceInnBankList th {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-08);border: 1px solid var(--app-invoice-table-brd-08);} .ClaimDezCK08 .invoiceRgtBasic td, .ClaimDezCK08 .invoiceRgtTotal td, .ClaimDezCK08 .invoiceInnList td, .ClaimDezCK08 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-08);} .ClaimDezCK08.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-08);} .ClaimDezCK08 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-08);} .ClaimDezCK08.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK08.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK08.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-08);border: 1px solid var(--app-invoice-table-brd-08);} .ClaimDezCK08.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK08.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK08.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-08);border-top: none;} /* カラーパターン_ug */ .ClaimDezCK09 .invoiceRgtBasic th, .ClaimDezCK09 .invoiceRgtTotal th, .ClaimDezCK09 .invoiceInnList th, .ClaimDezCK09 .invoiceInnBankList th {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-09);border: 1px solid var(--app-invoice-table-brd-09);} .ClaimDezCK09 .invoiceRgtBasic td, .ClaimDezCK09 .invoiceRgtTotal td, .ClaimDezCK09 .invoiceInnList td, .ClaimDezCK09 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-09);} .ClaimDezCK09.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-09);} .ClaimDezCK09 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-09);} .ClaimDezCK09.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK09.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK09.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-09);border: 1px solid var(--app-invoice-table-brd-09);} .ClaimDezCK09.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK09.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK09.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-09);border-top: none;} /* カラーパターン_uy */ .ClaimDezCK10 .invoiceRgtBasic th, .ClaimDezCK10 .invoiceRgtTotal th, .ClaimDezCK10 .invoiceInnList th, .ClaimDezCK10 .invoiceInnBankList th {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-10);border: 1px solid var(--app-invoice-table-brd-10);} .ClaimDezCK10 .invoiceRgtBasic td, .ClaimDezCK10 .invoiceRgtTotal td, .ClaimDezCK10 .invoiceInnList td, .ClaimDezCK10 .invoiceInnBankList td {border: 1px solid var(--app-invoice-table-brd-10);} .ClaimDezCK10.ClaimDezPT02.invoice h1 {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-10);} .ClaimDezCK10 .invoiceInnHdb {border-bottom: 4px solid var(--app-invoice-th-bg-10);} .ClaimDezCK10.ClaimDezPT03 .invoiceInnBankDl dt, .ClaimDezCK10.ClaimDezPT04 .invoiceInnBankDl dt, .ClaimDezCK10.ClaimDezPT05 .invoiceInnBankDl dt {color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg-10);border: 1px solid var(--app-invoice-table-brd-10);} .ClaimDezCK10.ClaimDezPT03 .invoiceInnBankDl dd, .ClaimDezCK10.ClaimDezPT04 .invoiceInnBankDl dd, .ClaimDezCK10.ClaimDezPT05 .invoiceInnBankDl dd {border: 1px solid var(--app-invoice-table-brd-10);border-top: none;} /** レイアウトバリエーション指定 **/ /* デザインパターン01 (A4縦) */ .ClaimDezPT01.invoice {width: var(--app-invoice-sizeT);} /* デザインパターン02 (A4縦) */ .ClaimDezPT02.invoice {width: var(--app-invoice-sizeT);} .ClaimDezPT02.invoice h1 { font-size: clamp(2.0rem, 2.0vw, 2.4rem); margin: 0 auto 2.0rem auto; padding: 1.0rem 0; border-radius: var(--app-invoice-rod); } .ClaimDezPT02 .invoiceAdd {background: none;border: none;padding: 0;} .ClaimDezPT02 .invoiceLft {width: 35%;} /* デザインパターン03 (A4縦) */ .ClaimDezPT03.invoice {width: var(--app-invoice-sizeT);} .ClaimDezPT03.invoice h1 { font-size: clamp(2.0rem, 2.0vw, 2.4rem); margin: 0; padding: 0.5rem; text-align: right; } .ClaimDezPT03 .invoiceLogo {padding: 0;text-align: left;} .ClaimDezPT03 .invoiceAdd {background: none;border: none;padding: 0;} .ClaimDezPT03 .invoiceLft {width: 35%;} .ClaimDezPT03 .invoiceInnBankDl dl {display: block;margin-bottom: 1.0rem;padding: 0;} .ClaimDezPT03 .invoiceInnBankDl dt {width: 100%;padding: 0.5rem 1.0rem;} .ClaimDezPT03 .invoiceInnBankDl dd {width: 100%;padding: 1.0rem;} .ClaimDezPT03 .invoiceBankRgt {padding: 0;} /* デザインパターン04 (A4縦) */ .ClaimDezPT04.invoice {width: var(--app-invoice-sizeT);} .ClaimDezPT04.invoice h1 { font-size: clamp(2.0rem, 2.0vw, 2.4rem); margin: 0; padding: 0.5rem; text-align: left; } .ClaimDezPT04 .invoiceAdd {background: none;border: none;padding: 0;} .ClaimDezPT04 .invoiceLft {width: 35%;} .ClaimDezPT04 .invoiceDay {padding: 0 0 1.0rem 0;}/* 請求日表示 */ .ClaimDezPT04 .invoiceInnBankDl dl {display: block;margin-bottom: 1.0rem;padding: 0;} .ClaimDezPT04 .invoiceInnBankDl dt {width: 100%;padding: 0.5rem 1.0rem;} .ClaimDezPT04 .invoiceInnBankDl dd {width: 100%;padding: 1.0rem;} .ClaimDezPT04 .invoiceBankRgt {padding: 0;} /* デザインパターン05 (A4横) */ .ClaimDezPT05.invoice {width: var(--app-invoice-sizeY);} .ClaimDezPT05.invoice h1 {margin: 0;padding: 0;} .ClaimDezPT05 .invoiceDay {padding: 0;} .ClaimDezPT05 .invoiceInnPrf {padding: 0;} .ClaimDezPT05 .invoiceAdd {background: none;border: none;padding: 0;} .ClaimDezPT05 .invoiceRgt {width: 45%;} .ClaimDezPT05 .invoiceLft {width: 30%;} .ClaimDezPT05 .invoiceRgtTxt {padding: 0.5rem 1.0rem;} .ClaimDezPT05 .invoiceInnList {padding: 1.0rem 0 0.5rem 0;} .ClaimDezPT05 .invoiceStamp {margin: 0 auto;} .ClaimDezPT05 .invoiceInnBank {margin: 0.5rem auto;} .ClaimDezPT05 .invoiceInnBankDl {padding-top: 1.5rem;} .ClaimDezPT05 .invoiceInnBankDl dl {display: block;margin-bottom: 1.0rem;padding: 0;} .ClaimDezPT05 .invoiceInnBankDl dt {width: 100%;padding: 0.5rem 1.0rem;} .ClaimDezPT05 .invoiceInnBankDl dd {width: 100%;padding: 1.0rem;} /* PDF出力時対応 */ #invoice.pdf-mode { padding-top: 0 !important; background-color: #fff !important; width: 794px; } #invoice.pdf-mode.ClaimDezPT05.invoice {width: var(--app-invoice-sizeY);} .pdf-mode .ReportPrintBox {border: none;box-shadow: none;} .pdf-mode hr.meisaiBoxLine {border: none;} .pdf-mode .invoiceListDet {border-top: none;} .pdf-mode .page-break {page-break-after: always;break-after: page;} .print-break {page-break-after: always;break-after: page;} /* コピー対象一覧 */ .invoiceInnCPList {width:100%;margin: 0;padding: 0;} .invoiceInnCPList table {width:100%;font-size: 1.3rem;font-weight: normal;} .invoiceInnCPList th {padding: 0.5rem 1.0rem;color: var(--app-invoice-th-txt);background: var(--app-invoice-th-bg);border: 1px solid var(--app-invoice-table-brd);text-align: center;white-space:nowrap;} .invoiceInnCPList td {padding: 0.5rem 1.0rem;color: var(--app-invoice-td-txt);background: var(--app-invoice-td-bg);border: 1px solid var(--app-invoice-table-brd);} .invoiceInnCPList .syubetsu {width: 10.0rem;} .invoiceInnCPList .koumoku {width: 20.0rem;} .invoiceInnCPList .data {width: 60.0rem;} .invoiceInnCPList .copydet, .invoiceInnCPList .editbt {width: 10.0rem;} .invoiceInnCPList .editbt p.editBt {margin: 0.5rem auto;} .invoiceInnCPList td.tdbgn {background: #f8f8f8;} .invoiceInnCPList td.tdbg {background: #feffda;} /* ** 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 ** */ /* ** myp_contact start ** */ /*** お問い合わせ履歴表示設定 ***/ .mypageContactDet { margin-top: 1.0rem; margin-bottom: 1.0rem; padding: 0.5rem 2.0rem; border-radius: var(--app-mypageContactDet-rod);-webkit-border-radius: var(--app-mypageContactDet-rod);-moz-border-radius: var(--app-mypageContactDet-rod);/* 角丸 */ border: var(--app-mypageOrdBoxInn-brd); /* ボーダー指定 */ background: var(--app-mypageOrdBoxInn-bg); /* 背景色 */ box-shadow: var(--app-mypageOrdBoxInn-sd);/* 背景影色 */ } /* ** myp_contact end ** */