@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
*/
@import url("shujikida9.css");
/************************************
** 子テーマ用のスタイルを書く
************************************/
:root {--main-color: #d6eaea;}
.date-tags{display:none;}
.opa9{opacity: 90%;}
.f-vw{font-size:clamp(1.5rem, 2vw + 1rem, 2.625rem);font-weight:800;}
.entry-title,.f-tw{font-size: clamp(18px, 1.8vw, 32px);font-family: "Libre Baskerville", serif;font-weight: 700;font-style: normal;color:#ccc;}
.entry-content {margin-top: 3em;margin-bottom: 3em;}
.m-vw{margin-top:7.2vw!important}
.shadow {box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;}
.full-width {width: 100vw;margin: 0 calc(50% - 50vw); }
.p-content__body[data-overDirection~="full"] {width: 100vw;margin: 0 calc(50% - 50vw);}
.pc_view{display: block;}
.sp_view{display: none;}
.date-tags {display:none;}
.main{background: transparent;}
.footer {margin: 0 calc(50% - 50vw); padding: 5em calc(50vw - 50%);}
#header-container{margin:0 calc(50% - 50vw); padding: 1.3em calc(50vw - 50%);}
.slant-bg {width: 100%;padding: 150px 0;clip-path: polygon(0 calc(0% + 7vw), 100% 0, 100% calc(100% - 7vw), 0 100%);background-color: #faecd0;}
.slant-bg p {width: 65%;margin: 0 auto;}
.text-main{color:#ea9886;}
#sb_instagram .sb_instagram_header h3, .sb_instagram_header h3{border:none!important;}
.ewd-ufaq-faqs a{color:#000;}
.ewd-ufaq-faqs a:hover{color:red;}
.blogcard{display:none;}
.sbi_feedtheme_header_text{display:none;}
.su-button small {padding-top: 10px;}
.mincho{font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
.page-numbers {width: 110px;font-size: 14px;}/*歴史のプラグインのページネーション*/
article .col-6 img.shadow {transition: transform 0.3s ease, box-shadow 0.3s ease;}
article .col-6 a:hover img.shadow {transform: translateY(-5px); /* 5px上に持ち上げる */box-shadow: 0 10px 20px rgba(0,0,0,0.2) !important; /* 影を強く */transform: scale(1.05); /* 1.05倍に拡大 */}
.video-container {max-width: 1280px;margin: 0px;}
.video-container .video {margin-top: 0px!important;}

 /************************************
** Hタグの装飾
************************************/
.article h1{margin:0 calc(50% - 50vw); padding: 1.3em calc(50vw - 50%); text-align: center;font-size:clamp(1.5rem, 2vw + 1rem, 2.625rem);font-weight:800;color:#fff;position: relative;}
.parallax-window {min-height: 200px;background: transparent;}
.parallax-slider {top: 0;left: 0;}
.article h2 {position: relative;padding: 30px 0 12px 50px;border-bottom: 2px dotted #a9a9a9;font-size: 2rem;border-left:none;border-right:none;border-top:none;background-color:transparent;color:#646464;}
.article h2:after {position: absolute;content: " ";display: block;border-bottom: solid 5px #808080;bottom: -3px;width: 20%;}
/*.article h3 {border-left: 4px solid #ccc;border-bottom: 1px solid #ccc;border-top:none;border-right:none; font-size: 25px;padding: 12px 20px;}*/
#coupon .article h1{margin: 0 calc(50% - 50vw);padding: 0.3rem;text-align: left;font-size: 20px!important;font-weight: 800;color: #fff;}
.article h3 { position: relative; padding: 0 .5em .5em 2.8em; border-bottom: 1px solid rgba(171,171,171,.2); border-top:none;border-right:none;border-left:none;}
.article h3::before, h3::after { position: absolute; content: ''; border-radius: 100%; }
.article h3::before { top: .2em; left: .2em; width: 18px; height: 18px; background-color: rgba(171,171,171,.5); z-index: 2; }
.article h3::after { top: .7em; left: .7em; width: 13px; height: 13px; background-color: rgba(171,171,171,.2); }

/************************************
** サイドバー関係の設定
************************************/
.sidebar{background-color:#ffffff00;margin-top:270px!important;}
.no-scrollable-sidebar .sidebar {height: 100%;margin-top: 20px;}
.sidebar h3 {background-color: #8fbc8f;padding: 12px 0 12px 40px;margin: 5px 0;border-radius: 5px;font-size: 1.2rem;}
.cat-label {color: #fff !important; border-radius: 5px;}/*カテゴリ表記の色*/
.widget_recent_entries ul li a, .widget_categories ul li a, .widget_archive ul li a, .widget_pages ul li a, .widget_meta ul li a, .widget_rss ul li a, .widget_nav_menu ul li a {padding: 5px 0;padding-right: 9px;padding-left: 20px;transition: all 1s;font-size:14px;}
.widget_recent_entries ul li a:hover{transform: translate(20px,0px);background-color: #fcfcfc;}
.widget_categories ul li a:hover{transform: translate(20px,0px);}
.widget_recent_entries ul li a::after { position: absolute; content: ""; display: block; width: 10px; height: 10px; background-color: #CCC7C2; border-radius: 50%; top: 10px; left: -20px; opacity: 0; -webkit-transition: all 0.6s ease; transition: all 0.6s ease;}
.widget_recent_entries ul li a:hover::after { opacity: 1;}
.widget_categories ul li a::after{ position: absolute; content: ""; display: block; width: 10px; height: 10px; background-color: #CCC7C2; border-radius: 50%; top: 10px; left: -20px; opacity: 0; -webkit-transition: all 0.6s ease; transition: all 0.6s ease;}
.widget_categories ul li a:hover::after{ opacity: 1;}
/************************************
** マイアカウント画面設定
************************************/
.woocommerce-account .woocommerce-MyAccount-content {float: right;width: 80%!important;}
.woocommerce-account .woocommerce-MyAccount-navigation {float: left;width: 20%;}
/************************************
** ヘッダーステータス設定
************************************/
.kida9-status-bar { position: absolute; top: 100px; right: 15px; z-index: 9998; padding: 6px 14px; border-radius: 4px; font-size: 12px; font-weight: bold; text-align: center; box-shadow: 0 2px 6px rgba(0,0,0,0.2); white-space: nowrap; }
.kida9-status-wholesale { background-color: #2f5233; color: #ffffff; }
.kida9-status-general { background-color: #444444; color: #ffffff; }
@media screen and (max-width: 600px) {
.kida9-status-bar { top: 95px; right: 10px; font-size: 10px; padding: 4px 10px; }
}
/************************************
** table関係の設定
************************************/
.tdpad td{padding:10px 0px 10px 25px!important;}
table tr:nth-of-type(2n+1) {background-color:transparent;}
table th,table td {border: none;padding: 2px;}
table td .fs {font-size:0.7rem;color:#696969;}
.tableline{background-color:transparent;border-bottom: 1px dotted #a9a9a9;}
.tableline th,.tableline td{background-color:transparent;border-bottom: 2px dotted #a9a9a9;padding:10px 0px 10px 25px!important;;border-left:none;border-right:none;}
.tbl-r02 th {background: var(--main-color);border: solid 1px #ccc;color: #000;padding: 10px;width:30%}
.tbl-r02 td {border: solid 1px #ccc;padding: 10px;}

/************************************
****　エントリーカードインデックス
************************************/
.ect-vertical-card .entry-card-wrap .entry-card-content{padding:3px;margin:0;display:flex;flex-direction:column;height:100%;background-color: #ffffff;}
.widget-entry-cards .a-wrap {display: inline-block !important;}
a.entry-card-wrap.a-wrap.border-element.cf{padding:0 0 .5em;border-radius:6px;width:33%;margin-bottom:1em}
a.entry-card-wrap.a-wrap{transition:all .1s;}
a.entry-card-wrap.a-wrap:hover{transform:translateY(-1px);transition:all .1s;background-color:#fff}
figure.entry-card-thumb.card-thumb.e-card-thumb{max-height:200px;border-radius:6px 6px 0 0/ 6px 6px 0 0;overflow:hidden;display:flex;justify-content:center;align-items:center}
.e-card-thumb .cat-label{margin-top:.3em;margin-left:.3em}
.cat-label{background-color:#004f9d!important}
h2.entry-card-title.card-title.e-card-title{font-size:18px;color:#7b7b7b;font-weight:700;text-align:center;line-height:1.5rem;margin-top:.5em;margin-bottom:1rem;padding:0 .3em}
.entry-card-snippet.card-snippet.e-card-snippet{font-size:14px;color:#7b7b7b;text-align:center;border-top:3px dotted silver;line-height:1.8em;padding-top:.6em;margin-left:2em;margin-right:2em;margin-bottom:1em;max-height:20em}
.eye-catch .cat-label,.cat-label{font-size:.7em;padding:0 .5em;opacity:.85;background-color:#f5f5f5;color:#696969}
div.admin-pv{display:none}

 /************************************
**　トップ新着・人気・関連記事ウィジェット 投稿日・更新日表示
************************************/
.new-entry-cards.a-wrap{display:flexbox}
.widget-entry-cards.card-large-image .a-wrap{border:solid 1px #ccc;border-radius:20px;width:24%;text-align:left;padding:0;margin:1px;height:400px}
.widget-entry-cards:not(.large-thumb-on) .card-title{font-size:16px;color:#7b7b7b;font-weight:700;text-align:center;line-height:1.5rem;margin-top:.5em;margin-bottom:1rem;padding:0 .3em}
.widget-entry-card-snippet{font-size:12px;color:#7b7b7b;text-align:center;border-top:3px dotted silver;line-height:1.5em;padding-top:.6em;margin-left:2em;margin-right:2em;margin-bottom:1em;max-height:20em}
.widget-entry-cards.card-large-image figure img{width:100%;display:block;border-radius:20px 20px 0 0;object-fit:cover}
.widget-entry-card-thumb{margin-top:0!important}
.eye-catch .cat-label,.cat-label{font-size:.7em;padding:0 .5em;margin-left:5px;opacity:.85;background-color:#f5f5f5;color:#696969}
div.admin-pv{display:none}
.new-entry-card-date{display:block;color:#a3a1a1;text-align:right;margin-right:15px}
.widget-entry-card-update-date{display:none}
.widget-entry-card-date{display:block;position:absolute;right:0;font-size:18px}
.widget-entry-card-date::before{font-family:"Font Awesome 5 Free";content:"\f017";font-weight:400;padding-right:0;font-size:14px}

 /************************************
**　ステップバーデザイン
************************************/
.step-wrap3 { counter-reset: count; margin: 2em 0; position: relative; }
.step-content3 { padding: 1.3em 0 .3em 1em; margin: 0 0 1em 1em; position: relative; border-top: solid 2px #ddd; }
.step-content3::before { content: ""; display: block; position: absolute; bottom: 0; left: -10px; border-style: solid; border-width: 17px 8px 0 8px; border-color: #ddd transparent transparent transparent; }
.step-content3::after { content: ""; display: block; height: calc(100% - 36px); border-left: dashed 4px #ddd; position: absolute; top: 16px; left: -4px; }
.step-label3 { padding: 3px 20px 3px 15px; color: #fff; font-weight: bold; position: absolute; top: -18px; left: -20px; background: #6ab5a5; border-radius: 20px; z-index: 1; }
.step-label3::after { counter-increment: count; content: counter(count); position: relative; left: .3em; }
.step-title3 { font-weight: bold; font-size: 120%; }
.step-body3 { margin-top: .5em; padding: 0 0 1em; }
.step-wrap3 > :last-child { box-shadow: 5px 7px 0 -5px #ddd; }
.step-wrap3 > :last-child::before, .step-wrap3 > :last-of-type::after { display: none; }
.process { max-width: 900px; margin: auto; padding: 80px 20px; }
.process-title { text-align: center; font-size: 42px; letter-spacing: 4px; margin-bottom: 10px; }
.process-subtitle { text-align: center; color: #888; margin-bottom: 70px; }
.process-list { position: relative; }
.process-list::before { content: ""; position: absolute; left: 34px; top: 0; bottom: 0; width: 2px; background: #dcdcdc; }
.step { display: flex; gap: 35px; position: relative; margin-bottom: 60px; }
.step:last-child { margin-bottom: 0; }
.step-number { width: 70px; height: 70px; border-radius: 50%; background: #111; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: bold; z-index: 2; flex-shrink: 0; box-shadow: 0 10px 30px rgba(0,0,0,.15); }
.step-content { background: #fff; padding: 25px 30px; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,.08); flex: 1; transition: .3s; }
.step-content:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(0,0,0,.12); }
.step-content h3 { margin-bottom: 15px; font-size: 24px; color: #111; }
.step-content p { line-height: 1.9; color: #666; }
@media(max-width:768px) {}

/************************************
** TOPカードデザイン
************************************/
.modern-card { border: none !important; border-radius: 12px !important; background: #ffffff; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); transition: transform 0.3s ease, box-shadow 0.3s ease; overflow: hidden; }
.modern-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12); }
.modern-badge { background: linear-gradient(135deg, #4f46e5, #3b82f6); color: #fff; font-size: 0.75rem; padding: 0.35em 0.8em; border-radius: 20px; font-weight: 500; letter-spacing: 0.05em; }
.custom-list { padding-left: 0; list-style: none; }
.custom-list li { position: relative; padding-left: 1.25rem; margin-bottom: 0.5rem; color: #4b5563; font-size: 0.95rem; }
.custom-list li::before { content: "•"; color: #3b82f6; font-weight: bold; position: absolute; left: 0; }
.btn-modern { background: linear-gradient(135deg, #2563eb, #1d4ed8); border: none; border-radius: 8px; font-weight: 600; padding: 0.6rem 1.2rem; transition: background 0.3s ease, opacity 0.2s ease; color: #ffffff !important; }
.btn-modern:hover { opacity: 0.9; color: #fff; }
.card-title-modern { font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', sans-serif; font-size: 1.25rem; font-weight: 700; color: #111827; letter-spacing: 0.04em; position: relative; padding-left: 12px; margin-bottom: 0; }
.card-title-modern::before { content: ''; position: absolute; left: 0; top: 15%; bottom: 15%; width: 4px; background: linear-gradient(180deg, #2563eb, #3b82f6); border-radius: 2px; }
.card-title-modern { font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', sans-serif; font-size: 1.25rem; font-weight: 700; color: #111827; letter-spacing: 0.04em; position: relative; padding-left: 14px !important; margin-bottom: 0; border-left: none !important; background: transparent !important; }
.card-title-modern::before { content: '' !important; position: absolute !important; left: 0 !important; top: 10% !important; bottom: 10% !important; width: 4px !important; background: linear-gradient(180deg, #2563eb, #3b82f6) !important; border-radius: 2px !important; border: none !important; }
.card-title-modern::after { content: none !important; }

/************************************
** ボタン類のデザイン
************************************/
input[type="reset"]{
	width: 100%;font-size: 15px;color: #000;display: inline-block;padding: 10px 0px;text-align: center;border-radius: 10px;text-decoration: none;cursor: pointer;transition: background-color 1s;border:none;}
input[type="reset"]:hover{background-color:#ea9886;}

/************************************
** サイドmenu告知用
************************************/
.pulse-btnmenu{animation:pulse-btn 5s infinite ease-in-out .8s alternate;background:url(https://ro-col.com/wp-content/uploads/2025/10/menu-_baner-rocol_03.png) no-repeat center center / 200px auto;display:inline-block;transition:1.5s ease-in-out;position:fixed;bottom:420px;right:5px;z-index:10000;width:200px;height:500px;cursor:pointer}
.pulse-btnmenu img{width:100%}

/************************************
/* 背景の暗幕（最初は非表示） 
************************************/
.popup-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 9999; justify-content: center; align-items: center; }
.popup-content { background-color: #fff; padding: 30px; border-radius: 8px; max-width: 700px; width: 90%; box-shadow: 0 4px 15px rgba(0,0,0,0.2); text-align: center; }
.close-btn { margin-top: 15px; padding: 10px 20px; background-color: #333; color: #fff; border: none; border-radius: 4px; cursor: pointer; }
.close-btn:hover { background-color: #555; }
.popup-options { margin-top: 15px; font-size: 14px; }

/************************************
** ヘッドナビ部分
************************************/
#navi .navi-in a{color:#696969;font-size:1rem;}
#navi .navi-in a:hover {background-color: var(--main-color);transition: all 0.3s ease-in-out;color:  #fff;font-weight:600;}
#navi .navi-in a:after{position: absolute;/*線の位置を絶対配置に*/content: "";/*文字はなし*/left: 0px;/*線の位置*/bottom: 1px;/*線の位置*/height: 2px;/*線の高さ*/width: 100%;/*幅いっぱいに線を引く*/background: #5a2200;/*線の色*/transform: scale(0,1);/*マウスオーバーの前は線を消す*/
transition: 0.3s;/*線が0→100%になるまでの秒数*/}
#navi .navi-in a:hover:after{transform: scale(1);/*マウスオーバー後、線を100%出す*/}
.navi-in > ul .sub-menu a {padding-left: 16px;padding-right: 16px;font-size:12px!important;}
/*ヘッダーの現在のページに色を付ける指定*/
.page-id-59 #navi li:nth-child(2) a {background: var(--main-color);font-weight:600;color:#fff;}
.page-id-53 #navi li:nth-child(3) a {background: var(--main-color);font-weight:600;color:#fff;}
.page-id-98 #navi li:nth-child(4) a {background: var(--main-color);font-weight:600;color:#fff;}
.page-id-130 #navi li:nth-child(5) a {background: var(--main-color);font-weight:600;color:#fff;}
.page-id-22 #navi li:nth-child(6) a {background: var(--main-color);font-weight:600;color:#fff;}
.page-id-122 #navi li:nth-child(7) a {background: var(--main-color);font-weight:600;color:#fff;}

/*---------------------------------------
 ?Woocommerce関連
----------------------*/
.woocommerce div.product p.stock {font-size: 1.2em;font-weight: 800;}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .stock {color: #dd0606;}
.woocommerce div.product form.cart {display: flex;justify-content: center;align-items: center;}
.single-product .single_add_to_cart_button {background: #111;color: #fff;padding: 14px 40px;font-size: 16px;border-radius: 50px;letter-spacing: 1px; border: none;transition: all 0.3s ease;box-shadow: 0 4px 15px rgba(0,0,0,0.15);}
.single-product .single_add_to_cart_button:hover {background: #333;transform: translateY(-2px);box-shadow: 0 6px 20px rgba(0,0,0,0.25);}
.woocommerce ul.products li.product .button {display: block;margin: 0 auto;text-align: center;}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {color: #958e09;font-size: 2em;font-weight:bold;}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .stock {color: #550101;}
/* 「お買い物カゴに追加」＆「続きを読む」ボタン（角丸＋高さ統一） */
.woocommerce ul.products li.product .button { background-color: #000000 !important; color: #ffffff !important; border: 1px solid #000000 !important; border-radius: 8px !important; padding: 10px 15px !important; margin: 0 auto !important; min-height: 44px !important; display: flex !important; align-items: center !important; justify-content: center !important; transition: all 0.3s ease; }
.woocommerce-account .woocommerce::after, .woocommerce-account .woocommerce::before { content: none!important; display: table; }
.woocommerce ul.products li.product .button:hover { background-color: #333333 !important; color: #ffffff !important; border: 1px solid #333333 !important; }
.woocommerce-account .entry-title.parallax-window { position: relative; width: 100vw; max-width: 100vw; left: 50%; margin-left: -50vw; margin-right: 0; box-sizing: border-box; text-align: center; }
.woocommerce-account .entry-title.parallax-window, .woocommerce-account .entry-title.parallax-window a { color: #fff !important; text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6); }
.woocommerce-account { overflow-x: hidden; }
.woocommerce-account .entry-title.parallax-window { display: flex; align-items: center; justify-content: center; margin-top: 0; }
.woocommerce-account .content, .woocommerce-account .content-in, .woocommerce-account .main, .woocommerce-account .article { margin-top: 0; padding-top: 0; }
.woocommerce-account .entry-title.parallax-window { font-family: "Noto Serif JP", "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "MS P明朝", serif; font-weight: 700; letter-spacing: 0.08em; }
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {color: #065907;}

/*---------------------------------------
HiroContent関連（どこかわからない）
----------------------*/
.hero { position: relative; height: 40vh; overflow: hidden; }
.hero video { position: absolute; width: 100%; height: 100%; object-fit: cover; top: 0; left: 0; }
.hero-content { position: relative; z-index: 2; color: #fff; text-align: center; }
.hero-content { background: none !important; }
.hero-content h1,.hero-content p { background: none !important; }
body div.gt_switcher_wrapper, body iframe.gt_switcher_wrapper, body select.gt_switcher_wrapper { position: absolute !important; top: 60px !important; right: 15px !important; margin: 0 !important; }
.kida9-banner-text { width: 90%; max-width: 90%; }

/*---------------------------------------
 オンラインセミナーのページ関連
----------------------*/
.kida9-learning { color: #333; line-height: 1.9; }
.kida9-learning h2, .kida9-learning h3, .kida9-learning h4 { line-height: 1.5; margin-top: 0; }
.kida9-section { padding: 60px 0; }
.kida9-label { display: inline-block; padding: 5px 18px; margin-bottom: 15px; border-radius: 30px; background: #333; color: #fff; font-size: 12px; letter-spacing: .08em; }
.kida9-sample { padding: 45px 0; background: #f7f7f7; }
.kida9-sample-title { text-align: center; margin-bottom: 30px; }
.kida9-sample-title h2 { font-size: 30px; font-weight: 700; margin-bottom: 10px; }
.kida9-sample-title p { margin: 0; color: #666; }
.kida9-sample-text { display: flex; flex-direction: column; justify-content: center; height: 100%; padding-right: 25px; }
.kida9-sample-text h3 { font-size: 24px; font-weight: 700; margin-bottom: 18px; }
.kida9-sample-text p { margin-bottom: 12px; }
.kida9-video { position: relative; width: 100%; max-width: 760px; margin: 0 auto; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; background: #000; box-shadow: 0 8px 28px rgba(0,0,0,.12); }
.kida9-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.kida9-concept { padding: 70px 0; background: #fff; }
.kida9-concept-head { max-width: 900px; margin: 0 auto; text-align: center; }
.kida9-concept-head h2 { font-size: 32px; font-weight: 700; margin-bottom: 20px; }
.kida9-concept-head > p { font-size: 17px; margin-bottom: 20px; }
.kida9-concept-message { margin: 30px auto 0; padding: 22px 28px; border-left: 5px solid #333; background: #f7f7f7; text-align: left; font-size: 17px; font-weight: 600; }
.kida9-flow { margin-top: 55px; }
.kida9-flow-title { text-align: center; font-size: 21px; font-weight: 700; margin-bottom: 25px; }
.kida9-flow-wrap { display: flex; align-items: stretch; justify-content: center; gap: 18px; }
.kida9-flow-box { flex: 1; max-width: 400px; padding: 28px 22px; border-radius: 12px; background: #f7f7f7; text-align: center; }
.kida9-flow-box h3 { font-size: 21px; font-weight: 700; margin-bottom: 20px; }
.kida9-flow-box p { margin: 15px 0 0; font-size: 14px; }
.kida9-flow-arrow { display: flex; align-items: center; justify-content: center; width: 45px; flex-shrink: 0; font-size: 38px; color: #777; }
.kida9-basic-mini { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.kida9-basic-mini span { display: flex; align-items: center; justify-content: center; min-height: 52px; padding: 7px; border: 1px solid #ddd; border-radius: 6px; background: #fff; font-size: 12px; line-height: 1.45; }
.kida9-combine-icon { position: relative; width: 125px; height: 115px; margin: 10px auto 20px; }
.kida9-combine-icon span { position: absolute; width: 58px; height: 58px; border: 3px solid #555; border-radius: 50%; background: #fff; }
.kida9-combine-icon span:nth-child(1) { top: 0; left: 34px; }
.kida9-combine-icon span:nth-child(2) { bottom: 0; left: 5px; }
.kida9-combine-icon span:nth-child(3) { bottom: 0; right: 5px; }
.kida9-combine-icon::after { content: "+"; position: absolute; top: 42px; left: 53px; font-size: 24px; font-weight: 700; }
.kida9-design-icon { position: relative; width: 145px; height: 130px; margin: 0 auto 5px; }
.kida9-design-icon .hair { position: absolute; top: 0; left: 20px; width: 105px; height: 120px; border: 5px solid #444; border-radius: 50% 50% 45% 45%; background: #fff; }
.kida9-design-icon .face { position: absolute; top: 30px; left: 45px; width: 55px; height: 65px; border: 3px solid #777; border-radius: 45%; background: #fff; }
.kida9-nine { padding: 70px 0; background: #f7f7f7; }
.kida9-nine-title { text-align: center; margin-bottom: 40px; }
.kida9-nine-title h2 { font-size: 32px; font-weight: 700; margin-bottom: 12px; }
.kida9-nine-title p { margin: 0; color: #666; }
.kida9-nine-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; max-width: 1050px; margin: 0 auto; }
.kida9-nine-item { background: #fff; border-radius: 10px; overflow: hidden; border: 1px solid #e5e5e5; }
.kida9-pattern-image { position: relative; width: 100%; aspect-ratio: 1024 / 663; background: #f1f1f1; overflow: hidden; padding: 0 !important; margin: 0 !important; line-height: 0; }
.kida9-pattern-img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover; object-position: center center; padding: 0 !important; margin: 0 !important; vertical-align: top !important; }
.kida9-pattern-image img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover; object-position: center center; padding: 0 !important; margin: 0 !important; vertical-align: top !important; }
.kida9-pattern-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #aaa; font-size: 13px; }
.kida9-nine-info { padding: 18px 20px 20px; }
.kida9-nine-number { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-right: 8px; border-radius: 50%; background: #333; color: #fff; font-size: 12px; font-weight: 700; vertical-align: middle; }
.kida9-nine-info h3 { display: inline; font-size: 18px; font-weight: 700; vertical-align: middle; }
.kida9-important { padding: 75px 0; background: #fff; }
.kida9-important-inner { max-width: 900px; margin: 0 auto; text-align: center; }
.kida9-important-inner h2 { font-size: 32px; font-weight: 700; margin-bottom: 22px; }
.kida9-important-message { font-size: 23px; font-weight: 700; margin-bottom: 25px; }
.kida9-important-inner p { max-width: 800px; margin: 0 auto 15px; font-size: 16px; }
.kida9-keyword { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.kida9-keyword span { padding: 9px 20px; border-radius: 30px; background: #f1f1f1; font-weight: 600; }
.kida9-cta { padding: 70px 20px; background: #333; color: #fff; text-align: center; }
.kida9-cta h2 { font-size: 30px; font-weight: 700; margin-bottom: 18px; }
.kida9-cta p { max-width: 800px; margin: 0 auto 30px; font-size: 16px; }
.kida9-cta-button { display: inline-block; padding: 13px 35px; border-radius: 30px; background: #fff; color: #333 !important; text-decoration: none !important; font-size: 17px; font-weight: 700; }
/*---------------------------------------
 メンバー限定ページに関連する表記
----------------------------------------*/
.k9-paywall{max-width:640px;margin:2em auto;padding:2.5em 2em;text-align:center;  background:#faf8f5;border:1px solid #e5dccf;border-radius:12px}
.k9-paywall__label{letter-spacing:.2em;font-size:.75rem;color:#a08a6a;margin:0 0 .5em}
.k9-paywall__title{font-size:1.4rem;font-weight:700;line-height:1.6;margin:0 0 .8em;padding:0;border:0;background:none;text-align:center}
.k9-paywall__text{color:#555;margin:0 0 1.5em}
.k9-paywall__btn{display:inline-block;padding:.9em 2.2em;background:#222;color:#fff!important; border-radius:999px;text-decoration:none}
.k9-paywall__actions{display:flex;flex-wrap:wrap;gap:.8em;justify-content:center}
.k9-paywall__btn--ghost{background:transparent;color:#222!important;border:1px solid #222}
.k9-paywall__sub{margin:1.2em 0 0;font-size:.9rem}
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/* スマホ表示時に文字サイズを縮小 */
@media screen and (max-width: 767px) {
 .kida9-section { padding: 50px 0; }
  .kida9-sample { padding: 40px 0; }
  .kida9-sample-title h2, .kida9-concept-head h2, .kida9-nine-title h2, .kida9-important-inner h2 { font-size: 25px; }
  .kida9-sample-title p, .kida9-concept-head > p { font-size: 14px; }
  .kida9-sample-text { padding: 0 0 25px; }
  .kida9-sample-text h3 { font-size: 21px; }
  .kida9-flow-wrap { display: block; }
  .kida9-flow-box { max-width: none; margin-bottom: 10px; }
  .kida9-flow-arrow { width: 100%; height: 45px; font-size: 32px; transform: rotate(90deg); }
  .kida9-nine-grid { grid-template-columns: 1fr; gap: 15px; }
  .kida9-nine-info { padding: 15px; }
  .kida9-nine-info h3 { font-size: 17px; }
  .kida9-important { padding: 55px 15px; }
  .kida9-important-message { font-size: 20px; }
  .kida9-important-inner p { font-size: 14px; text-align: left; }
  .kida9-cta { padding: 55px 20px; }
  .kida9-cta h2 { font-size: 25px; }
  .kida9-cta p { font-size: 14px; text-align: left; }
  .kida9-cta-button { width: 100%; max-width: 340px; }
}

/* さらに小さい画面(iPhone SEなど)向け */
@media screen and (max-width: 375px) {
.kida9-banner-text h4 { font-size: 15px !important; }
.kida9-banner-text h4 span { font-size: 11px !important; }
}

/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
.veu_3prArea_image {width: 100%;}
.process-list::before { left: 24px; }
.step { gap: 20px; }
.step-number { width: 50px; height: 50px; font-size: 16px; }
.step-content { padding: 20px; }
.step-content h3 { font-size: 20px; }
  }
/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
.pulse-btn5 {position: fixed;bottom: 9%;right: 2%;width: 100px;height: 100px;line-height:10px;align-items: center;justify-content: center;border-radius: 50%;background-color: #9bb4b9;box-shadow: 0 0 20px #9bb4b9;cursor: pointer;}
.pulse-btn5 img {width: 100%;}.pulse-btn5::before, .pulse-btn5::after {content: "";display: block;position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: auto;width: 100%;height: 100%;border: 1px solid #9bb4b9;border-radius: 50%;box-sizing: border-box;pointer-events: none;animation: pulsate 2s linear infinite;}
.article h2::before {top:18px;width: 40px;height: 40px;}
.article h2 {position: relative;padding: 30px 0 12px 0px;border-bottom: 2px dotted #5a2200;font-size: 1.5rem;border-left:none;border-right:none;border-top:none;background-color:transparent;color:#646464;}
.last td:last-child {border-bottom: solid 1px #ccc; width: 100%;}
.tbl-r02 {width: 100%;}
.tbl-r02 th {background-color: #afeeee;border-bottom: none;display: block;width: 100%;color:#000;}
.tbl-r02 th,.tbl-r02 td {border-bottom: none;display: block;width: 100%;}
.tbl-r02 td {padding-left:20px!important;}
.pulse-btn｛display:none;｝
.veu_3prArea_image {margin-bottom:10px;}
.logo-header img {margin-top: 80px;}
  /*スライドインメニューのカスタム*/
.menu-content {background: #aed2f8;border-bottom: 1px solid;max-width: 98%;} 
.mobile-menu-buttons {line-height: 2;}
.menu-drawer a {color: #fff;}
.menu-drawer li {border-bottom: 2px dotted #000;}
.widget-entry-cards.card-large-image .a-wrap{width:100%;}
.sidebar{background-color:#ffffff00;margin-top:0px!important;}
}
@media screen and (min-width: 480px){
#sb_instagram .sb_instagram_header h3, .sb_instagram_header h3{border:none!important;}
}