@charset "UTF-8"; /*! Theme Name: Cocoon Child Description: Cocoon専用の子テーマ Theme URI: https://wp-cocoon.com/ Author: わいひら Author URI: https://nelog.jp/ Template: cocoon-master Version: 1.1.3 */ /************************************ ** 子テーマ用のスタイルを書く ************************************/ /*必要ならばここにコードを書く*/ /************************************ ** レスポンシブデザイン用のメディアクエリ ************************************/ /*1023px以下*/ @media screen and (max-width: 1023px){ /*必要ならばここにコードを書く*/ } /*834px以下*/ @media screen and (max-width: 834px){ /*必要ならばここにコードを書く*/ } /*480px以下*/ @media screen and (max-width: 480px){ /*必要ならばここにコードを書く*/ } /* login後にlogout表示ボタン */ /* 親コンテナをフレックスレイアウトに */ .site-header { display: flex; align-items: center; justify-content: space-between; /* 左にタイトル、右にメニュー */ } /* メニューを右寄せに */ .main-navigation { margin: 0; } /* メニューアイテムの余白調整 */ .main-navigation .menu-item-csc-login-logout { margin-left: 1em; } /* 固定ページのタイトル下に出るメタ情報を非表示 */ .page .entry-meta, .page .post-meta { display: none !important; } /* 固定ページ本文下に出るメタ情報も非表示（テーマによってクラス名が違う場合があります） */ .page .entry-footer, .page .post-footer { display: none !important; } /* 固定ページ（page）全体のをターゲットにメタ情報を非表示 */ body.page .post-date, body.page .post-update, body.page .post-author, body.page .author-link, body.page .fa-pencil, body.page .fa-clock-o, body.page .fa-history { display: none !important; } /* さらに特定の固定ページだけ消したい場合は page-id-XX を使う例（ID が 123 の場合） */ body.page-id-123 .post-date, body.page-id-123 .post-update, body.page-id-123 .post-author, body.page-id-123 .author-link, body.page-id-123 .fa-pencil, body.page-id-123 .fa-clock-o, body.page-id-123 .fa-history { display: none !important; } /* ────────────────────────────────────── 固定ページのヘッダー／フッター内メタを丸ごと非表示 ────────────────────────────────────── */ /* ヘッダー内の日付／更新日／投稿者 */ .entry-header .entry-meta, .entry-header .entry-meta * { display: none !important; } /* フッター内（もし何か出ていれば）のメタ */ .entry-footer, .entry-footer * { display: none !important; } /* さらに、念のためページ本文直下に出る更新日時 */ .entry-content + .post-update, .entry-content + .post-date { display: none !important; } /* タイトルの二重表記を強制的に消す　*/ .entry-content > h1:first-of-type { display: none; } /* ──────────────────────────────────────── 全ページ（固定ページも含む）の日付表示を丸ごと非表示 ──────────────────────────────────────── */ /* 投稿日（アイコン＋日付テキスト） */ .post-date, .post-date * { display: none !important; } /* 更新日（アイコン＋日付テキスト） */ .post-update, .post-update * { display: none !important; } /* プラン - 解約 */ .confirm-cancel-title{ font-size: 24px; } .cancel-modal { position: fixed; top: 0; left: 0; width:100%; height:100%; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 9999; } .cancel-modal-content { background: #fff; padding: 2rem; border-radius: .5rem; max-width: 400px; text-align: center; } .button--danger { background: #e53e3e; color: #fff; } /* 本登録クレジット入力フォーム　Stripe Element container */ #card-element { box-sizing: border-box; width: 100%; /* take full width of its parent */ max-width: 400px; /* or whatever fits your form */ height: 40px; /* fixed height matching your input style */ margin-bottom: 1em; /* space below */ border: 1px solid #ccc; padding: 10px; border-radius: 3px; } /* 本登録クレジット入力フォーム　the actual Stripe Element inside */ #card-element .__PrivateStripeElement, #card-element iframe { height: 100% !important; /* force to fill the 40px container */ width: 100% !important; } /* 本登録 Free／Enterprise 選択時はProfプランカテゴリ選択を無効化（クリックできず、見た目もグレーアウト） .plan-btn.disabled { opacity: 0.5; cursor: not-allowed; }*/ /* 本登録プランカテゴリ選択 .plan-btn.csc-selected { background-color: #0073aa !important; color: #fff !important; border-color: #0073aa !important; }*/ .plan-btn { border: 1px solid #ccc; background: #f5f5f5; color: #333; padding: 8px 12px; margin: 4px; cursor: pointer; border-radius: 4px; transition: background 0.2s ease; } /* 本登録プランカテゴリ選択 */ .plan-btn.selected { background-color: #0073aa !important; color: #fff !important; border-color: #0073aa !important; } .plan-btn.disabled { opacity: 0.4; pointer-events: none; } /* */ /* Stripe Elements カードフィールドの調整 */ #card-element { box-sizing: border-box; width: 100%; max-width: 420px; height: 48px; background: #fff; } #postal-annotation { margin-bottom: 4px; font-size: 0.9em; color: #777; } @media (max-width: 480px) { #card-element { height: auto; padding: 8px; } } /* パスワード入力フォーム Showボタンは常に隠す */ .om-pw-toggle { display: none !important; } /* 目アイコンの色味をよりビジネス寄りに */ .om-pass-eye { color: #4b5563; } /* 通常: グレー600 */ .om-pass-eye[aria-pressed="true"] { color: #374151; } /* 表示中: グレー700 */ .om-pass-eye:hover { color: #111827; } /* ホバー: ほぼ黒 */ .menu-item-profile { width: 250px !important; height:50px !important; } .menu-item { display: flex!important; align-items: center !important; justify-content: center !important; width: 100px !important; height:50px !important; text-align: center !important; border-radius: 5px !important; margin: 0px 5px !important; } .black-button{ background-color: #333333!important; } .black-button:hover{ background-color: #707070!important; cursor: pointer; } .white-button{ background-color: #ffffff!important; } .menu-item a { width: auto !important; height: auto !important; font-weight: bold !important; font-size: 16px !important; } .menu-item.black-button a { color: #ffffff!important; } .menu-item.black-button a:hover{ background-color: transparent!important; } .menu-item.white-button a { color: #333333!important; } .menu-item.white-button a:hover{ background-color: transparent!important; } .navi-in > ul{ justify-content: right !important; margin-top:-60px !important; padding-bottom:20px !important; }