/*
Theme Name: Twenty Twenty-Five
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
* Link styles
* https://github.com/WordPress/gutenberg/issues/42319
*/
/*フォントの指定*/
html, body {
font-family: "Hiragino Kaku Gothic Pro", "Hiragino Sans", "Meiryo", "Yu Gothic", sans-serif !important;
}
/*PCとSPの切り替え*/
/* PCビュー（901px以上） */
@media screen and (min-width: 901px) {
.sp-only {
display: none !important;
}
}

/* スマホビュー（900px以下） */
@media screen and (max-width: 900px) {
.pc-only {
display: none !important;
}
/* グローバルな初期化を追加 */
html, body {
margin: 0;
padding: 0;
box-sizing: border-box;
overflow-x: hidden;
}

/* すべての要素に box-sizing: border-box を適用 */
*, *::before, *::after {
box-sizing: inherit;
}

/* .mobile-nav のはみ出し防止 */
.mobile-nav {
display: none;
position: fixed;
top: 60px; /* ヘッダー高さに応じて調整 */
left: 0;
right: 0; /* 追加 */
width: 100vw; /* 明示的にビューポート幅指定 */
background-color: rgba(0, 47, 108, 0.95);
z-index: 999;
}
}
#ast-scroll-top{
display: none !important;
}
a {
text-decoration-thickness: 1px !important;
text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
outline-width: 2px;
outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
outline-offset: 0;
}

/*
* Progressive enhancement to reduce widows and orphans
* https://github.com/WordPress/gutenberg/issues/55190
*/
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
text-wrap: pretty;
}

/*
* Change the position of the more block on the front, by making it a block level element.
* https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
display: block;
}

/* ベース構造 */
.site-header {
background-color: #00306c; /* 深い青 */
padding: 10px 0;
}

.header-inner {
max-width: 1080px;
margin: 0 auto;
padding: 0 20px;
display: flex;
align-items: center;
justify-content: space-between;
}

/* 左ロゴ */
.header-left .logo img {
height: 50px;
display: block;
}

/* 右側全体 */
.header-right-contact {
display: flex;
gap: 20px;
}

/* 各ボタン */
.header-right-contact-line a,
.header-right-contact-mail a {
display: flex;
align-items: center;
text-decoration: none;
background: none;
color: #fff;
font-weight: bold;
font-size: 18px;
transition: color 0.3s ease;
}

.header-right-contact-line a:hover,
.header-right-contact-mail a:hover {
color: #0195df; /* 鮮やかな水色に変更 */
}

/* アイコン画像 */
.header-right-contact-line img,
.header-right-contact-mail img {
height: 24px;
width: auto;
margin-right: 8px;
}
/* ========== ファーストビュー ========== */
.fv-wrapper {
position: relative;
width: 100%;
margin: 0 auto;
overflow: hidden;
}

.fv-wrapper img {
width: 100%;
height: auto;
display: block;
}
@media screen and (min-width: 901px) {
@keyframes shiny {
0% {
    transform: scale(0) rotate(25deg);
    opacity: 0;
}

50% {
    transform: scale(1) rotate(25deg);
    opacity: 1;
}

100% {
    transform: scale(50) rotate(25deg);
    opacity: 0;
}
}
}
.free-consulting-btn {
position: absolute;
bottom: 4vw;
left: 10vw;
width: 40vw;
height: 4vw;
background-color: #00c300 !important;
border: none;
border-radius: 100px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: #fff;
font-size: 1.6vw;
font-weight: bold;
transition: opacity 0.3s ease; /* ← ここを追加 */
}

.free-consulting-btn::after {
content: '';
position: absolute;
top: -100%;
left: -100%;
width: 50px;
height: 50px;
background-image: linear-gradient(
    100deg,
    rgba(255, 255, 255, 0) 10%,
    rgba(255, 255, 255, 1) 100%,
    rgba(255, 255, 255, 0) 0%
);
animation: shiny 3s ease-in-out infinite;
pointer-events: none;
z-index: 1;
}
.free-consulting-btn:hover {
opacity: 0.85; /* ← ホバー時にわずかに透明に */
}
.free-consulting-btn .arrow {
position: absolute;
right: 1.6vw; /* ボタン右端に余白を残す */
top: 50%;
transform: translateY(-50%);
font-size: 1.6vw;
}
.free-consulting-btn a,
.free-consulting-btn a:visited,
.free-consulting-btn a:hover,
.free-consulting-btn a:active,
.free-consulting-btn a:focus {
color: #fff !important;
text-decoration: none;
}
/*導入実績*/
.result-section {
width: 100%;
background-color: #e0f2fd; /* 任意、背景に青系 */
padding: 80px 0;
}

.section-inner {
max-width: 1040px;
margin: 0 auto;
}

.result-section .section-heading {
width: 60%;
margin: 0 auto 32px auto;
}

.result-section .section-heading img {
width: 100%;
display: block;
}

.result-subheading {
background-color: #0195df;
color: #fff;
font-size: 32px;
font-weight: bold;
text-align: center;
padding: 10px 0;
margin-bottom: 0;
}

.result-images {
display: flex;
justify-content: space-between;
gap: 0;
margin-top: 0;
}

.result-image-half {
width: 50%;
}

.result-image-half img {
width: 100%;
display: block;
margin: 0;
padding: 0;
vertical-align: bottom; /* 隙間防止 */
}

/*キーワードのセクション*/
.keywords-section {
background-image: url("assets/images/pc/bg_keywords.jpg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 80px 0; /* 上下余白（調整可能） */
text-align: center;
}

.keywords-inner img{
max-width: 50%;
height: auto;
display: inline-block;
}

/*お悩みのセクション*/
.trouble-wrapper {
width: 100vw;
background-color: #f4f4f;
}

.trouble-section {
width: 100%;
margin: 0 auto;
padding: 5vw 0;
box-sizing: border-box;
text-align: center;
}
.trouble-heading{
padding-bottom: 3vw;
}
.trouble-heading .text {
display: inline-block;
font-size: 2vw;
font-weight: bold;
color: #003366;
border-bottom: 2px solid #003366;
padding-bottom: 0.3vw;
line-height: 1.2;
}
.trouble-heading .icon {
display: inline-block;
vertical-align: middle;
margin-right: 0.5vw;
}

.trouble-heading .icon img {
width: 3vw;
height: auto;
vertical-align: middle;
}

.trouble-circles {
display: flex;
justify-content: space-evenly;
gap: 3vw;
flex-wrap: wrap;
}

.circle {
width: 20vw;
height: 20vw;
background-color: gray;
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 2vw;
font-weight: bold;
line-height: 1.4;
padding: 1vw;
box-sizing: border-box;
}
.answer img{
width: 100%;
}
/*歯医者の集患マルコとは？*/
.whatsmaruko {
background-color: #e4f5ff; /* 背景水色 */
padding: 60px 20px;
}

.whatsmaruko-inner {
width: fit-content;
margin: 0 auto;
color: #222;
font-size: 1.1rem;
font-weight: 500;
line-height: 1.8;
}

.whatsmaruko-heading {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;
margin-bottom: 40px;
}

.whatsmaruko-heading img {
height: 50px;
width: auto;
}

.whatsmaruko-heading h2 {
font-size: 1.8rem;
font-weight: bold;
}

.whatsmaruko-point {
font-size: 24px;
font-weight: bold;
width: fit-content;
margin: 0 auto;
}

.point-row {
display: flex;
align-items: center; /* ★縦中央揃え */
gap: 16px;
margin-bottom: 24px;
}

.point-row img {
width: auto;
height: 40px; /* 画像サイズ調整（必要に応じて） */
}

.point-row p {
margin: 0;
line-height: 1.5;
}

/*メリット*/
.merit {
background-image: url("assets/images/pc/bg_merit_pc.jpg");
background-size: cover;
background-position: center;
padding: 80px 0;
text-align: center;
color: #fff;
}

.merit h2 {
font-size: 3vw;
font-weight: bold;
margin-bottom: 4vw;
color: #fff;
}

.merit-items {
display: flex;
justify-content: center;
gap: 5vw;
flex-wrap: wrap;
}

.merit-item {
display: flex;
flex-direction: column;
align-items: center;
width: 20vw;
}

.merit-item img {
width: 15vw;
height: auto;
margin-bottom: 1.5vw;
}

.merit-item p {
font-size: 1.5vw;
line-height: 1.6;
font-weight: bold;
}
/*施策の詳細*/
.tab-wrapper {
max-width: 980px;
margin: 0 auto;
font-family: sans-serif;
margin-top: 100px;
}

.tab-menu {
display: flex;
overflow: hidden;
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.tab-item {
flex: 1;
padding: 1vw;
text-align: center;
font-weight: bold;
cursor: pointer;
transition: background-color 0.3s, color 0.3s;
}

.tab-item[data-tab="1"] {
background-color: #0195df;
color: white;
font-size: 24px;
}

.tab-item[data-tab="2"] {
background-color: white;
color: #0195df;
font-size: 24px;
}

.tab-item.active[data-tab="1"] {
background-color: #0195df;
color: white;
font-size: 24px;
}

.tab-item.active[data-tab="2"] {
background-color: white;
color: #0195df;
font-size: 24px;
}

.tab-contents {
box-shadow: 0 4px 8px rgba(0,0,0,0.1);
border-radius: 0 0 10px 10px;
}

.tab-content {
display: none;
padding: 2vw;
}

.tab-content.active {
display: block;
}

.bg-white {
background-color: white;
color: #333;
}

.bg-blue {
background-color: #0195df;
color: white;
}

.tab-item.active {
box-shadow: 
-4px -4px 8px rgba(0, 0, 0, 0.1), /* 左 */
 0px -4px 8px rgba(0, 0, 0, 0.1), /* 上 */
 4px -4px 8px rgba(0, 0, 0, 0.1); /* 右 */
position: relative;
z-index: 2;
}
.tab-content .description {
width: 75%;
margin: 2vw auto;
font-size: 18px;
font-weight: bold;
line-height: 1.8;
color: white;
}

.tab-content .action {
width: 22vw;
background-color: white;
border-radius: 1vw;
padding: 1vw;
text-align: center;
box-shadow: 0 0.5vw 1vw rgba(0, 0, 0, 0.1);
}

.tab-content .action img {
width: 60%;
height: auto;
margin-bottom: 1vw;
}

.tab-content .action h4 {
font-size: 16px;
color: #0195df;
margin-bottom: 1vw;
font-weight: bold;
}

.tab-content .action ul {
list-style: none;
padding: 0;
font-size: 1vw;
text-align: left;
color: #333;
margin-left: 0 !important;
font-weight: bold;
}

.tab-content .action ul li {
margin-bottom: 0.5vw;
}

.action1, .action2, .action3 {
display: inline-block;
vertical-align: top;
margin: 1vw;
}

/* 特徴とメリット */
.tab-content .features {
width: 100%;
margin: 3vw auto 0;
color: white;
}

.tab-content .features h3 {
font-size: 24px;
margin-bottom: 1vw;
color: #fff;
text-align: center;
}

.tab-content .features-detail {
vertical-align: top;
font-size: 1.1vw;
line-height: 2;
margin-right: 1vw;
margin-bottom: 2vw;
color: white;
font-weight: bold;
width: fit-content;
margin: 0 auto;
}

.tab-content .features-detail img {
width: 2vw;
vertical-align: middle;
margin-right: 0;
}
span.detail-heading{
font-size: 18px;
border-bottom: 1px dotted #fff;
padding-bottom: 4px;
margin-left: 5px;
}
span.detail-sentence{
margin-left: 6px;
}

.tab-content .actions-box {
display: flex;
justify-content: space-between;
width: 100%;
}

.action1, .action2, .action3 {
width: 25vw;
text-align: center;
}

.action1 img,
.action2 img,
.action3 img {
width: 6vw;
margin-bottom: 1vw;
}
.tab-content .instagram-manager {
width: 100%;
margin: 0 auto;
font-family: sans-serif;
}

.tab-content .instagram-header {
display: flex;
align-items: center;
margin-bottom: 3vw;
}

.tab-content .instagram-icon {
width: 100px;
height: auto;
margin-right: 0;
}

.instagram-manager .description {
font-size: 18px;
line-height: 1.8;
color: #333;
margin:0  0 auto 30px;
width: 100%;
}

.tab-content .instagram-video video {
width: 100%;
}
/*よくある質問*/
.faq{
max-width: 1040px;
margin: 0 auto;
margin-top: 100px;
margin-bottom: 100px;
}
.faq-inner h2{
text-align: center;
}
.faq-inner h2 img{
width: 75%;
padding-bottom: 50px;
}

.faq-item {
margin-bottom: 2vw;
overflow: hidden;
border-radius: 24px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
transition: border-radius 0.3s;
text-align: center;
}

/* 質問部分（ボタン） */
.faq-question {
width: 100%;
background-color: #003b84;
color: #fff;
font-size: 1.4vw;
font-weight: bold;
padding: 1.5vw 2vw;
text-align: left;
border: none;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 24px;
transition: border-radius 0.3s;
display: flex;
align-items: center;
justify-content: center; /* 中央揃え */
position: relative;
width: 100%;
padding: 1.2vw 4vw; /* 左右に余白確保 */
font-size: 1.2vw;
font-weight: bold;
color: #fff;
background-color: #003b80;
border: none;
border-radius: 20px;
cursor: pointer;
text-align: center;
}

/* ▼を右端に固定 */
.faq-question .faq-icon {
position: absolute;
right: 2vw;
top: 50%;
transform: translateY(-50%);
font-size: 1.2vw;
}

/* ホバーや展開時のAstraによる黄色背景を打ち消す */
.faq-question:hover,
.faq-item.open .faq-question {
background-color: #003b80 !important;
color: #fff !important;
box-shadow: none !important;
}

/* 展開時、ボタンの下は直角にする */
.faq-item.open .faq-question {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}

/* 回答部分 */
.faq-answer {
background-color: #fff;
color: #000;
padding: 2vw;
font-size: 16px;
font-weight: bold;
line-height: 1.8;
display: none;
border-bottom-left-radius: 24px;
border-bottom-right-radius: 24px;
}

/* 回答表示時 */
.faq-item.open .faq-answer {
display: block;
}
/* Astraデフォルトのボタンスタイル無効化 */
.faq-question,
.faq-question:hover,
.faq-question:focus {
background-color: #003b84 !important;
color: #fff !important;
box-shadow: none !important;
outline: none !important;
border: none !important;
font-size: 24px;
padding: 30px;
}
/*料金プラン*/
h2.price-title img{
width: 50%;
margin-bottom: 30px;
}
.price {
background: #dff1fc;
text-align: center;
padding: 60px 0;
color: #fff;
}

.price-title {
font-size: 2rem;
margin-bottom: 40px;
color:#fff;
}
.plans-wrapper {
display: flex;
justify-content: center;
gap: 4vw;
margin-top: 40px;
flex-wrap: wrap;
}

.plan {
background: #fff;
border-radius: 20px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
text-align: center;
overflow: hidden;
position: relative;
}

.plan-header {
color: white;
padding: 20px 10px 10px;
}

.plan-header.light { background: #6bd1e8; }       /* ライトプラン */
.plan-header.standard { background: #0195df; }    /* スタンダードプラン */
.plan-header.premium { background: #092b5c; }     /* プレミアムプラン */

.plan-label {
font-size: 0.9rem;
margin-bottom: 5px;
font-weight: bold;
}

.plan-name {
font-size: 1.6rem;
font-weight: bold;
margin: 0;
color: #fff;
margin-bottom: -12px;
}

.plan-price {
font-size: 1.6rem;
font-weight: bold;
margin-top: 8px;
margin-bottom: 0;
}

.per-month {
font-size: 1rem;
font-weight: normal;
}

.plan-body {
background: white;
padding: 25px 15px 30px;
font-weight: bold;
}

.plan-icon {
width: 50px;
height: auto;
margin-bottom: 10px;
}

.plan-text {
font-size: 0.95rem;
color: #333;
margin-bottom: 15px;
line-height: 1.5;
}

.plan-text strong {
font-weight: bold;
}

.plan-plus {
font-size: 1.5rem;
font-weight: bold;
color: #333;
margin: 10px 0;
}

/* スタンダードプランだけサイズ拡大 */
.standardplan {
transform: scale(1.08);
z-index: 1;
border: 3px solid #fee861;
}

/* おすすめアイコン画像 */
.standardplan-wrapper{
position: relative;
}
.badge {
position: absolute;
top: -50px;
right:-50px;
height: auto;
z-index: 10;
pointer-events: none;
}
.badge img{
width: 80px;
}
.plans-detail{
color: #333;
padding-top: 60px;
}
.plans-detail img{
width: 35px;
margin-right: 10px;
}
.plans-detail ul{
list-style: none;
text-align: left;
width: fit-content;
margin: 0 auto;
font-size: 16px;
font-weight: bold;
}
/*ミッション*/
.mission-section {
background-color: #ffffff;
padding-top: 60px;
position: relative;
}

.mission-container {
max-width: 900px;
margin: 0 auto;
position: relative;
}

.mission-container h2{
text-align: center;
}
.mission-container h2 img{
width: 70%;
}

.mission-main-title {
position: relative;
font-size: 2.4vw;
font-weight: bold;
text-align: left;
margin-bottom: 4vw;
z-index: 1;
}

.mission-text {
line-height: 2;
color: #333;
position: relative;
z-index: 1;
padding-top: 50px;
font-weight: bold;
font-size: 16px;
}

.mission-text p {
margin-bottom: 2vw;
}
.signature {
position: relative;
bottom: 120px;
right: -240px;
width: 70%;
}
/*footer*/
.site-footer {
background-color: #0095dd; /* 医療系ブルーに近い */
padding: 1.2vw 4vw;
font-size: 0.9vw;
color: #fff;
}

.footer-inner {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}

.copyright {
margin: 0;
}
.footer-links a {
color: #fff;
text-decoration: none;
margin-left: 2vw;
transition: color 0.3s ease;
}

.footer-links a:hover {
color: #00306c;  /* 濃い青 */
text-decoration: none; /* アンダーラインなし */
}
/*問い合わせフォーム*/
.contact-section {
background-color: #f9f9f9;
padding: 80px 0;
}

.contact-heading {
text-align: center;
font-size: 24px;
font-weight: bold;
margin-bottom: 40px;
}

.contact-tab-area {
display: flex;
width: 90%;
max-width: 800px;
margin: 0 auto;
background-color: #eeeeee;
border: none;
}

.contact-tab-left{
background-color: #eeeeee;
}
.contact-tab-right {
background-color: #fff;
display: grid;
}
.contact-tab-left{
line-height: 4;
width: 50%;
text-align: center;
}
.contact-tab-right {
width: 50%;
padding: 20px;
text-align: center;
padding: 20px 20px 10px 20px;
}

.contact-tab-left {
font-weight: bold;
color: #0195df;
border-bottom: none;
font-size: 24px;
}
.contact-tab-right a{
color: #999 !important;
font-weight: bold;
font-size: 14px;
}
.contact-tab-right img {
max-width: 140px;
height: auto;
vertical-align: middle;
}

.contact-form-wrapper {
background-color: #eeeeee;
width: 90%;
max-width: 800px;
margin: 0 auto;
padding: 40px 30px;
box-sizing: border-box;
font-weight: bold;
}
.wpcf7-form span{
font-size:14px;
}
/* Contact Form 7 のフォームパーツ装飾 */
.contact-form-wrapper input[type="text"],
.contact-form-wrapper input[type="email"],
.contact-form-wrapper textarea,
.contact-form-wrapper select {
width: 100%;
padding: 10px;
font-size: 14px;
border: 1px solid #ccc;
margin-top: 6px;
margin-bottom: 20px;
box-sizing: border-box;
border-radius: 0;
}

.contact-form-wrapper textarea {
height: 140px;
}

.contact-form-wrapper .wpcf7-submit {
display: block;
margin: 0 auto;
padding: 14px 60px;
background-color: #00306c;
color: #ffffff;
font-size: 16px;
font-weight: bold;
border: none;
border-radius: 0;
cursor: pointer;
transition: background-color 0.3s ease-in-out; /* ← 追加 */
}

.contact-form-wrapper .wpcf7-submit:hover {
background-color: #0195df; /* ← 変更後の色 */
}
.wpcf7  p{
margin-bottom: 0 !important;
}
.wpcf7 input,.wpcf7 select{
margin-bottom: 30px !important;
}

/* 完了メッセージ */
.wpcf7-mail-sent-ok {
text-align: center;
color: #00306c;
font-weight: bold;
font-size: 16px;
margin-top: 40px;
white-space: pre-line !important;
}
.wpcf7 form.sent .wpcf7-response-output {
background-color: #0195df !important;
color: #fff !important;
border: none !important;
line-height: 2 !important;
padding: 20px !important;
width: 75%;
text-align: center;
margin: 0 auto;
white-space: pre-line !important;
}
/* 追尾式問い合わせボタン */
.floating-contact {
position: fixed;
right: 0;
top: 40%;
transform: translateY(-50%);
z-index: 9999;
}

/* トグルボタン */
.contact-toggle {
background-color: #00c300;
color: #fff;
width: 4vw;
height: 18vw;
border-radius: 30px 0 0 30px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1vw;
cursor: pointer;
transition: background 0.3s;
}

.contact-toggle img {
width: 2vw;
height: auto;
}

.contact-toggle span {
writing-mode: vertical-rl;
text-orientation: upright;
font-weight: bold;
font-size: 1.5vw;
}
/* 展開ボタンリスト */
.contact-buttons {
display: flex;
flex-direction: column;
justify-content: space-between;
height: 18vw;
width: 18vw;
position: absolute;
right: -20vw;
top: 50%;
transform: translateY(-50%);
opacity: 0;
pointer-events: none;
transition: all 0.4s ease;
}

/* 共通ボタン */
.contact-btn {
display: flex;
align-items: center;
padding-left: 1.5vw;
height: 6vw; /* 縦幅をやや縮めた */
border-radius: 20px;
width: 200%;
font-weight: bold;
font-size: 1.4vw;
text-decoration: none;
color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.15);
gap: 0.8vw; /* アイコンと文字の距離を近づけた */
white-space: nowrap;
margin: 30px;
margin-bottom: 30px;
}
.contact-buttons a:link,
.contact-buttons a:visited,
.contact-buttons a:hover,
.contact-buttons a:active,
.contact-buttons a:focus {
color: #fff;
}
/* 各ボタン色（グラデーション廃止） */
.contact-btn.email {
background-color: #238e17; /* 濃い緑 */
}

.contact-btn.line {
background-color: #00e600; /* 明るい緑 */
}

/* アイコン画像 */
.contact-btn img {
width: 3.2vw;
height: auto;
}

/* ホバー時の動き */
.floating-contact:hover .contact-buttons {
right: 5vw;
opacity: 1;
pointer-events: auto;
}

.floating-contact:hover .contact-toggle {
opacity: 0;
pointer-events: none;
}

/*スマホ対応*/
@media screen and (max-width: 900px) {

.mobile-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
background-color: #002f6c;
z-index: 1000;
transition: opacity 0.3s ease;
}

.mobile-header.scrolled {
opacity: 0.9;
}

.header-inner {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 16px;
height: 60px;
}

.logo {
width: 45%;
}

.nav-free-consulting-btn {
background-color: #00c300;
color: white;
font-weight: bold;
font-size: 3vw;
padding: 6px 20px;
border: none;
border-radius: 999px;
cursor: pointer;
position: relative;
overflow: hidden;
white-space: nowrap;
text-decoration: none;
line-height: 1;
width: 30%;
top: 0;
left: 5%;
text-align: center;
}

.nav-free-consulting-btn::after {
content: "";
position: absolute;
top: 0;
left: -75%;
width: 50%;
height: 100%;
background: rgba(255, 255, 255, 0.5);
transform: skewX(-25deg);
animation: shiny 2.5s infinite;
}

@keyframes shiny {
0% {
left: -75%;
opacity: 0;
}
50% {
left: 125%;
opacity: 1;
}
100% {
left: 125%;
opacity: 0;
}
}

.hamburger {
width: 5%;
cursor: pointer;
}

/* メニュー展開部 */
.mobile-nav {
display: none;
position: fixed;
top: 60px;
left: 20%;
width: 80%;
background-color: rgba(0, 47, 108, 1);
z-index: 999;
}

.mobile-nav ul {
list-style: none;
padding: 0 20px;
margin: 0;
text-align: center;
font-weight: bold;
}

.mobile-nav ul li {
height: 60px;
line-height: 3.5;
border-bottom: 1px dotted #fff;
}
.mobile-nav ul li:last-child{
border-bottom: none;
}
.mobile-nav ul li a {
color: white;
text-decoration: none;
font-size: 18px;
display: block;
}
.fv-wrapper {
padding-top: 60px;
position: relative;
}

.fv-wrapper img {
width: 100%;
display: block;
}

.free-consulting-btn {
width: 90%;
display: block;
background-color: #00c300;
border: none;
text-align: center;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
position: absolute;
left: 5% !important;
padding-top: 30px;
padding-bottom: 30px;
overflow: hidden;
}

.free-consulting-btn a {
color: white;
font-size: 4vw;
font-weight: bold;
text-decoration: none;
display: inline-block;
width: 100%;
line-height: 0;
}

.free-consulting-btn .arrow {
margin-left: 8px;
font-size: 5vw;
padding-right: 5%;
}
/* 実績 */
.result-section {
background-color: #d8f0ff; /* 背景水色 */
padding: 40px 0;
}

.section-inner {
max-width: 900px;
margin: 0 auto;
padding: 0 20px;
text-align: center;
}
.result-section .section-heading {
width: 100% !important;
}
.section-heading img {
width: 100%;
height: auto;
}

.result-subheading {
background-color: #0195df;
color: #fff;
font-size: 1.4rem;
font-weight: bold;
padding: 10px 0;
margin-top: 20px;
}

.result-images {
display: flex;
flex-wrap: wrap;
gap: 0;
}

.result-image-half {
width: 100% !important;
}

.result-image-half img {
width: 100%;
height: auto;
display: block;
}
.keywords-inner img {
max-width: 90% !important;
}
.trouble-heading .icon img {
width: 7vw;
}
.trouble-heading .text {
font-size: 5vw;
}
.circle {
width: 30vw;
height: 30vw;
font-size: 3vw;
}
.trouble-circles {
gap: 0vw !important;
}
.whatsmaruko-heading img{
width: 70% !important;
height: auto !important;
}
.whatsmaruko-heading h2 {
font-size: 5vw;
}
.point-row img{
height: 15vw !important;		
}
.point-row{
text-align: center;
font-size: 5vw;
}
.merit h2{
font-size: 6vw;
}
.merit-items{
gap: 0;
}
.merit-item {
width: 30vw;
}
.merit-item img {
width: 25vw;
}
.merit-item p {
font-size: 2vw;
}
/*試作の概要*/
.tab-wrapper{
width: 90%;
margin: 0 auto;
margin-top: 30px;
}
.tab-content.active {
margin-top: -2px;	
}
.service-section {
padding: 2vw 2vw 0;
background-color: #0195df;
}
.service-box h4{
text-align: center;
color: #0195df;
padding-bottom: 10px;
}
.service-box {
align-items: flex-start;
background-color: #fff;
border-radius: 20px;
padding: 5vw;
margin-bottom: 5vw;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
min-height: 32vw;
}

.service-box img {
width: 20%;
height: auto;
margin-right: 4vw;
flex-shrink: 0;
position: absolute;
}

.service-content h4 {
color: #0195df;
font-size: 4.5vw;
margin-bottom: 2vw;
}

.service-content ul {
padding-left: 0;
list-style: none;
color: #333;
line-height: 1.6;
    font-size: 14px;
    position: relative;
    right: -15vw;
    top: 2vw;
    width: 70%;
    font-weight: bold;
}
.tab-content .description {
width: 90%;
font-size: 14px;
}
.tab-content .features {
width: 90%;
}
.tab-content .features-detail {
font-size: 14px !important;
}
.tab-content .features-detail img {
width: 8%;
}
span.detail-heading{
font-size: 16px;
border-bottom: 1px dotted #fff;
padding-bottom: 4px;
margin-left: 5px;
}

.tab-content .features h3 {
margin-bottom: 12px;
}
.tab-content .instagram-header {
align-items: baseline;
}
.tab-content .instagram-icon {
width: 15%;
margin-top: 2%;
margin-left: 2%;
}
.instagram-manager .description {
font-size: 14px;
line-height: 1.8;
color: #333;
margin: 0px 0 auto 5%;	
}
.faq {
width: 90%;
margin: 0 auto;
}
.faq-item{
margin-bottom: 30px;
}
.faq-inner h2 img {
width: 100% !important;
padding-bottom: 10px;
}
.faq-question{
font-size: 16px !important;
line-height: 1.5;
}
.faq-question .faq-icon {
position: absolute;
right: 2vw;
font-size: 3vw;
}
.faq-answer{
font-size: 14px !important;	
}
h2.price-title img {
width: 100%;
margin-bottom: 0px;
}
.plans-wrapper {
width: 80%;
margin: 0 auto;
display: block;
}
.plan {
margin-bottom: 12vw;
}
.plans-detail {
padding-top: 0 !important;
width: 80%;
margin: 0 auto;
}
.plans-detail ul {
font-size: 14px;
}
.plans-detail img {
width: 25px;
margin-right: 5px;
}
.badge {
position: absolute;
top: -10vw;
right: -8vw;
}
.mission-text {
line-height: 1.8;
width: 80%;
margin: 0 auto;
}
.mission-text p {
margin-bottom: 10vw;
}
.signature {
position: relative;
bottom: 50px;
right: -25%;
width: 70%;
}
.contact-tab-left {
font-weight: bold;
color: #0195df;
border-bottom: none;
font-size: 16px;
line-height: 1.5;
padding: 20px 20px 10px;
}
.contact-tab-right img {
max-width: 100px;
}
.contact-tab-right a {
font-size: 3vw;
}
.contact-form-wrapper {
width: 90%;
max-width: 800px;
padding: 15px 30px 40px;
}
.contact-form-wrapper .wpcf7-submit {
width: 80%;
}
.site-footer {
background-color: #00a4e4; /* ご希望の青に調整 */
padding: 4vw 6vw;
text-align: center;
}

.site-footer .footer-inner {
display: flex;
flex-direction: column;
align-items: center;
gap: 3vw;
}

.footer-links {
display: flex;
flex-direction: row;
gap: 6vw;
}

.footer-links a {
color: #fff;
font-size: 14px;
text-decoration: none;
font-weight: bold;
}
.copyright{
    font-size: 12px;
}
.contact-fixed-bar {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
display: flex;
z-index: 9999;
}

.contact-button {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
gap: 2vw;
padding: 3vw 0;
text-decoration: none;
color: white;
font-size: 3.5vw;
font-weight: bold;
}

.contact-button img {
width: 6vw;
height: auto;
}

.email-button {
background-color: #0f680f; /* 濃い緑 */
}
.email-button img{
  width: 5vw !important;
}
.line-button {
background-color: #00c300; /* LINE風グリーン */
}
.contact-fixed-bar a,
.contact-fixed-bar a:hover,
.contact-fixed-bar a:focus,
.contact-fixed-bar a:active,
.contact-fixed-bar a:visited {
color: #fff !important;
text-decoration: none; /* 任意：下線を消したい場合 */
}
a.nav-free-consulting-btn,
a.nav-free-consulting-btn:hover,
a.nav-free-consulting-btn:focus,
a.nav-free-consulting-btn:active,
a.nav-free-consulting-btn:visited {
color: #fff !important;
text-decoration: none; /* 下線を消す場合のみ */
}
body.home{
padding-bottom: 12vw !important; /* フッターボタンの高さ分の余白確保 */
}
/*モバイル用各種余白の調整はこちらから*/
.keywords-section {
padding: 40px 0 !important;
}
.trouble-section {
padding: 40px 0 !important;
}
.whatsmaruko {
padding: 40px 20px !important;
}
.merit {
padding: 40px 0;
}
#actions{
padding: 40px 0;
}
.faq {
padding: 40px 0;
}
.price {
padding: 40px 0;
}
.mission-section
padding: 40px 0;
}
.contact-section{
padding: 40px 0;
}


}/*スマホ用閉じタグ*/

/*COMPANY*/
.company-page {
background-color: #fff;
padding: 5vw 10vw;
font-family: sans-serif;
}

.company-heading {
text-align: center;
margin-bottom: 5vw;
}

.company-heading img {
width: 100%;
max-width: 400px;
height: auto;
}
.company-profile {
width: 80%;
max-width: 700px;
margin: 0 auto;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
line-height: 1.8;
}

.profile-row {
display: flex;
align-items: center;  /* ← これが重要。ラベルと内容を上下中央揃え */
border-bottom: 1px solid #00AEEF;
padding: 20px 0;
}

.profile-label {
width: 30%;
font-weight: bold;
text-align: left;
}

.profile-content {
width: 65%;
font-weight: bold;
}

/* モバイル対応 */
@media (max-width: 900px) {
.info-row {
flex-direction: column;
}

.info-label,
.info-value {
width: 100%;
}

.company-page {
padding: 8vw 5vw;
}
.profile-row {
padding: 50px 0;
}
}