/*!
Theme Name: lino-theme
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: lino-theme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

lino-theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */
main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/**
 * Add the correct font size in all browsers.
 */
small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
img {
	border-style: none;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
	display: list-item;
}

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
	display: none;
}

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #534741;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: #fff;
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

img {
	height: auto;
	max-width: 100%;
}

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
/*
a {
	color: #4169e1;
}

a:visited {
	color: #800080;
}
*/
a:hover,
a:focus,
a:active {
	color: #191970;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}

/* =========================
   Lino Header / Overlay Nav
   ========================= */
:root{
  --font-base: "Yu Gothic", "YuGothic", "游ゴシック体",
               "Hiragino Kaku Gothic ProN", "Hiragino Sans",
               "Noto Sans JP", "Meiryo", sans-serif;
  
  --lino-header-h: 74px;
  --lino-header-bg: #e95507; /* オレンジ */
  --lino-cream: #faeedc;
  --lino-text: #534741;
  --lino-container: 1024px;
}

/* テーマ全体の基準フォント */
html, body{
  font-family: var(--font-base);
}

/* WP管理バーがある時のズレ補正 */
body.admin-bar .lino-header{
  top: 32px;
}
@media (max-width: 782px){
  body.admin-bar .lino-header{
    top: 46px;
  }
}

body{
  padding-top: var(--lino-header-h);
}

/* 固定ヘッダー */
.lino-header{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--lino-header-h);
  background: var(--lino-header-bg);
  z-index: 1000;
}

.lino-header__inner{
  max-width: none;
  height: 100%;
  margin: 0;
  padding: 0 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

/* ロゴ */
.lino-header__brand .custom-logo-link,
.lino-logo{
  display: inline-flex;
  align-items: center;
  line-height: 1;
}
.lino-header__brand img,
.lino-logo img{
  height: 46px;
  width: auto;
  display: block;
}

.lino-header__actions{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.lino-header__iconbtn,
.lino-header__menubtn,
.lino-overlay__close{
  appearance: none;
  border: 0;
  background: transparent;
  padding: 6px;
  cursor: pointer;
  line-height: 1;
}

/* Header Icons */
.lino-header__menubtn{
  position: relative;
  width: 44px;
  height: 44px;
  padding: 0;
}
.lino-header__menubtn .lino-header__icon{
  width: 38px;
  height: 38px;
  display: block;
  position: absolute;
  inset: 0;
  margin: auto;
}
.lino-header__menubtn .is-close{ display: none; }
body.lino-nav-open .lino-header__menubtn .is-open{ display: none; }
body.lino-nav-open .lino-header__menubtn .is-close{ display: block; }

/* =========================
   Overlay Navigation (修正完了版)
   ========================= */

.lino-overlay{
  position: fixed;
  inset: 0;
  z-index: 1200; /* ヘッダーより上に表示 */
  display: none;
}
body.lino-nav-open .lino-overlay{
  display: block;
}

/* 背景（最背面） */
.lino-overlay__backdrop{
  position: absolute;
  inset: 0;
  border: 0;
  background: #ffffff;
  cursor: pointer;
  z-index: 1; /* パネルより下に配置 */
}

/* パネル（前面に出す） */
.lino-overlay__panel{
  position: relative;
  width: 100%;
  height: 100%;
  background: #ffffff;
  display: flex;
  flex-direction: column;
  z-index: 10; /* 背景より数値を目立たせて確実に前面へ */
}

/* 閉じるボタンの土台 */
.lino-overlay__close {
  align-self: flex-end;
  margin: 20px 30px 0 0; /* 位置調整 */
  width: 44px;
  height: 44px;
  position: relative;
  z-index: 2000;
  cursor: pointer;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* spanタグで作る「×」の共通設定 */
.lino-burger.is-close {
  position: relative;
  width: 30px; /* 線の長さ */
  height: 30px;
  display: block;
}

.lino-burger.is-close span {
  position: absolute;
  top: 50%;
  left: 0;
  display: block;
  width: 100%;
  height: 2px; /* 線の太さ */
  background-color: #e95507; /* オレンジ色 */
}

/* 1本目を45度傾ける */
.lino-burger.is-close span:nth-child(1) {
  transform: translateY(-50%) rotate(45deg);
}

/* 2本目を-45度傾けて「×」にする */
.lino-burger.is-close span:nth-child(2) {
  transform: translateY(-50%) rotate(-45deg);
}

/* 3本目は不要なので消す（HTMLに3つあるため） */
.lino-burger.is-close span:nth-child(3) {
  display: none;
}
.lino-overlay__menu{
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px 40px;
}

.lino-overlay__menu ul{
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 18px;
  text-align: center;
}

/* 文字色をオレンジに固定 */
.lino-overlay__menu a{
  color: #e95507 !important; /* 変数を使わず直接指定＆強制適用 */
  text-decoration: none;
  font-size: 24px; /* 少し大きくしました */
  font-weight: 700;
  letter-spacing: 0.04em;
  display: block;
}

.lino-overlay__menu a:hover{
  opacity: 0.7;
}

/* スクロールロック */
body.lino-nav-open{
  overflow: hidden;
}

@media (max-width: 1024px){
  .lino-header__inner{
    padding: 0 16px;
  }
}

/* フォーカス時の点線（アウトライン）を消す */
.lino-overlay__menu a {
  outline: none; /* これで点線が消えます */
}

/* リンクの状態をすべてオレンジで統一（訪問済みで色が変わるのを防ぐ） */
.lino-overlay__menu a:link,
.lino-overlay__menu a:visited,
.lino-overlay__menu a:active {
  color: #e95507 !important;
}

/* 最初のリスト項目の余計な装飾をリセット（念のため） */
.lino-overlay__menu ul li:first-child {
  border: none;
  outline: none;
}

/* FV（完全版：PCのscale廃止→余白10pxに） */

:root{
  --lino-cream: #faeedc;

  /* ハートを真ん中に合わせるためのX補正（画像全体を左へ動かす量） */
  --fv-heart-offset-x-pc: 220px;
  --fv-heart-offset-x-sp: 60px;

  /* 余白（ご希望） */
  --fv-pad-top-pc: 30px;
  --fv-pad-btm-pc: 10px;
  --fv-pad-top-sp: 30px;
  --fv-pad-btm-sp: 10px;
}

.fv{
  background: var(--lino-cream);
  width: 100%;
}

/* FV表示枠：高さ固定なし、paddingで自然に */
.fv__inner{
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-top: var(--fv-pad-top-pc);
  padding-bottom: var(--fv-pad-btm-pc);
}

/* =========================
   PC：メイン（PNG）
   - scaleをやめる（余白が増える原因を排除）
   - サイズは width/max-width で合わせる
   ========================= */
.fv__main{
  position: relative;
  left: 51%;
  display: block;
  height: auto;

  /* 以前：width 92vw + scale 0.92 ≒ 84.6vw 相当 */
  width: 85vw;
  /* 以前：max 1100px + scale 0.92 ≒ 1012px 相当 */
  max-width: 1012px;

  transform: translate3d(
    calc(-50% - var(--fv-heart-offset-x-pc)),
    0,
    0
  );
}

/* 雲（SVG）は絶対配置 */
.fv__cloud{
  position: absolute;
  display: block;
  height: auto;
}

/* 雲：位置・サイズ（PC） */
.fv__cloud--1{
  left: 28%;
  top: 40%;
  width: 95px;
}

.fv__cloud--2{
  right: 29%;
  top: 10%;
  width: 138px;
}

/* 雲：ゆらゆら（共通） */
.fv__cloud{
  will-change: transform;
}

/* 雲1：やや速く */
.fv__cloud--1{
  animation: fvCloudFloat1 5.5s ease-in-out infinite;
}

/* 雲2：さらに少し速く */
.fv__cloud--2{
  animation: fvCloudFloat2 4.5s ease-in-out infinite;
}

@keyframes fvCloudFloat1{
  0%   { transform: translate3d(0, 0, 0); }
  50%  { transform: translate3d(10px, -6px, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

@keyframes fvCloudFloat2{
  0%   { transform: translate3d(0, 0, 0); }
  50%  { transform: translate3d(-8px, 8px, 0); }
  100% { transform: translate3d(0, 0, 0); }
}


/* =========================
   SP FV（完全版）
   目的：
   - 画像を今より130%大きく（= 150vw）
   - 右から20px空ける
   - ハートを画面中央へ（左へ寄せる微調整）
   - 上下に100px余白
   ========================= */
  @media (max-width: 1024px){

  :root{
    --fv-sp-shift-x: 240px;
  }

  .fv__inner{
    padding-top: 100px;
    padding-bottom: 100px;
    width: 100%;
    position: relative;
    overflow: hidden;
  }

  .fv__main{
    position: relative !important;
    display: block !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    margin: 0 !important;
    max-width: none !important;
    width: 115vw !important;
    height: auto !important;
    /* 右基準＋右20px空け */
    margin-left: auto !important;
    margin-right: 20px !important;

    /* ハート位置の微調整（左に寄せる量） */
    transform: translateX(calc(-1 * var(--fv-sp-shift-x))) !important;
    transform-origin: center top !important;
  }

  /* 雲（SP位置・指定幅） */
  .fv__cloud--1{
    left: 0%;
    top: 47%;
    width: 62px;
  }

  .fv__cloud--2{
    right: 2%;
    top: 21%;
    width: 90px;
  }
}
@media (max-width: 1024px){
  .fv__main{
    width: 114vw !important;
  }
}

@media (max-width: 820px){
  .fv__main{
    width: 112vw !important;
  }
}

@media (max-width: 768px){
  .fv__main{
    width: 115vw !important;
  }
}

@media (max-width: 430px){

  .fv__main{
    width: 155vw !important;
}
}

@media (max-width: 375px){

  .fv__main{
    width: 162vw !important;
}
}

/* FV Scroll */
html{ scroll-behavior: smooth; }

.fv__scroll{
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  text-decoration: none;

  /* タップしやすい最小領域 */
  width: 56px;
  height: 56px;
}

.fv__scroll img{
  display: block;
  width: 44px;   /* ←fv-scroll.svgの見た目に合わせて必要なら調整 */
  height: auto;
}

/* 任意：ホバー/フォーカス（控えめ） */
.fv__scroll:focus-visible{
  outline: 2px solid rgba(255,255,255,.8);
  outline-offset: 4px;
  border-radius: 999px;
}

/* =========================
   ABOUT（画像スライド：右→左にゆっくり / 画面幅でスパッとクリップ）
   HTML想定クラス：
   .about / .about__inner / .about__marquee / .about__marqueeTrack / .about__marqueeSet / .about__photo
   ========================= */

:root{
  --about-max-w: 1400px;      /* デザイン基準 */
  --about-pad-x-pc: 30px;
  --about-pad-x-sp: 20px;

  --about-bg: #fffdce;   
  --about-title-gap: 24px;
  --about-marquee-gap-pc: 48px;
  --about-marquee-gap-sp: 22px;

  --about-photo-size-pc: 260px;
  --about-photo-size-sp: 140px;

  --about-marquee-speed: 60s; /* 右→左：遅め（短いほど速い） */
}

/* セクション背景など（必要なら） */
.about{
  background: var(--about-bg);
  width: 100%;
}

/* 1400px基準の中身（タイトル/テキスト/ボタン） */
.about__inner{
  max-width: var(--about-max-w);
  margin: 0 auto;
  padding: 80px var(--about-pad-x-pc);
}

/* タイトル（SVG想定） */
.about__title{
  margin: 0 0 var(--about-title-gap);
}
.about__title img{
  display: block;
  height: auto;
  max-width: 100%;
}

/* =========================
   ABOUT（画像スライド：右→左にゆっくり / 画面幅でスパッとクリップ）
   ※画像は“円形にトリミング済み”前提：CSSで丸くしない
   ========================= */

:root{
  --about-max-w: 1400px;
  --about-pad-x-pc: 30px;
  --about-pad-x-sp: 20px;
  --about-bg: #fffdce;
  --about-title-gap: 24px;
  --about-marquee-gap-pc: 48px;
  --about-marquee-gap-sp: 22px;
  --about-photo-size-pc: 260px;
  --about-photo-size-sp: 140px;
  --about-marquee-speed: 60s;
  --about-text-size: 16px;
  --about-btn-bg: #e95507;
  --about-btn-font-size: 14px;
  --about-btn-radius: 6px;
  --about-btn-pad-y: 10px;
  --about-btn-pad-x: 18px;
}

.about{
  background: var(--about-bg);
  width: 100%;
  overflow-x: clip;
}
@supports not (overflow: clip){
  .about{ overflow-x: hidden; }
}

.about__inner{
  max-width: var(--about-max-w);
  margin: 0 auto;
  padding: 80px var(--about-pad-x-pc);
}

/* タイトル：左右センター */
.about__title{
  margin: 0 0 var(--about-title-gap);
  display: flex;
  justify-content: center;
}
.about__title img{
  display: block;
  height: auto;
  max-width: 100%;
  margin-left: 50px;
}

/* 画面幅100vwの“窓”で必ず切る（＝端でスパッと消える） */
.about__marquee{
  width: 100vw;
  margin-left: calc(50% - 50vw); /* 100vwを中央に */
  overflow: hidden;
  clip-path: inset(0);
  margin-bottom: 28px;
}

/* トラック：右→左に流す（2セット前提で -50% で1周） */
.about__marqueeTrack{
  display: flex;
  width: max-content;
  will-change: transform;
  animation: aboutMarquee var(--about-marquee-speed) linear infinite;
}

/* 1セット（4枚） */
.about__marqueeSet{
  display: flex;
  gap: var(--about-marquee-gap-pc);
  padding-right: var(--about-marquee-gap-pc);
}

/* figureのデフォルト余白を消す（必須） */
.about__photo{
  margin: 0;
  width: var(--about-photo-size-pc);
  flex: 0 0 auto;
}

/* imgはブロック化して余計な隙間を消す */
.about__photo img{
  display: block;
  width: 100%;
  height: auto;
}

/* 2セット分で1周 */
@keyframes aboutMarquee{
  0%   { transform: translate3d(0,0,0); }
  100% { transform: translate3d(-50%,0,0); }
}

/* 動きが苦手なユーザー配慮 */
@media (prefers-reduced-motion: reduce){
  .about__marqueeTrack{
    animation: none;
    transform: translate3d(0,0,0);
  }
}

/* 本文ブロック：左右センター */
.about__text{
  text-align: center;
}

/* p の余白調整（ボタンが下に落ちるので） */
.about__text p{
  margin: 0 0 18px;
  font-size: 16px;     /* 指定：16px */
  font-weight: 700;    /* 指定：游ゴシック Bold想定（サイト全体で設定済み前提） */
  line-height: 2.0;
}

/* a.about__btn が本体。テーマのa装飾を潰すため詳細度を上げる */
.about__text a.about__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: #e95507;
  color: #fff;
  font-size: 14px;     /* 指定：14px */
  font-weight: 700;
  text-decoration: none;

  padding: 12px 22px;
  border-radius: 6px;
  line-height: 1;
  border: 0;

  /* a のデフォ underline/visited対策 */
  box-shadow: none;
}

/* 状態 */
.about__text a.about__btn:visited{
  color: #fff;
}

.about__text a.about__btn:hover{
  opacity: 0.7;
}

.about__text a.about__btn:active{
  transform: translateY(0);
}

.about__text a.about__btn:focus-visible{
  outline: 2px solid rgba(216, 95, 41, .35);
  outline-offset: 3px;
}

/* SP */
@media (max-width: 1024px){
  .about__inner{
    padding: 20px var(--about-pad-x-sp) 56px;
  }

  .about__marquee{
    margin-bottom: 20px;
  }

  .about__marqueeSet{
    gap: var(--about-marquee-gap-sp);
    padding-right: var(--about-marquee-gap-sp);
  }

  .about__photo{
    width: var(--about-photo-size-sp);
  }

  .about__text{
    font-size: 16px; /* 指定通り固定 */
    line-height: 2.0;
    margin-bottom: 18px;
  }
}

/* =========================
   SERVICE（差し替え用・完全版）
   - 背景：#e3f1fb
   - コンテンツ幅：PC 1000px / SP 100%（左右padding 20px）
   - PC：雲8枚＝4列×2行（デザイン通り）
   - SP：雲8枚＝1列
   - 雲PNG/カードPNGは「影込み・トリミング済み」前提
   ========================= */

:root{
  --service-bg: #e3f1fb;
  --service-max-w: 1024px;

  --service-pad-x-pc: 30px;
  --service-pad-x-sp: 20px;

  --service-title-gap: 22px;
  --service-lead-gap: 34px;

  /* 雲グリッド（PC 4列×2行） */
  --service-cloud-gap-x: 0px;
  --service-cloud-gap-y: 0px;

  /* カード（下の3つ） */
  --service-card-gap: 34px;
  --service-card-art-max-w: 320px;

  /* CTA */
  --service-btn-blue: #6984be;

  /* 小さい背景雲（SVG） */
  --service-bgcloud-w-pc: 62px;
  --service-bgcloud-w-sp: 62px;
}

/* セクション枠 */
.service{
  background: var(--service-bg);
  width: 100%;
}

/* 中央カラム（1000px） */
.service__inner{
  max-width: var(--service-max-w);
  margin: 0 auto;
  padding: 80px var(--service-pad-x-pc) 72px;
  position: relative; /* 背景雲のabsolute基準 */
}

/* タイトル（SVG一体）中央 */
.service__title{
  margin: 0 0 var(--service-title-gap);
  display: flex;
  justify-content: center;
}
.service__title img{
  display: block;
  width: 191px;
  max-width: 100%;
  height: auto;
  margin-left: 50px;
  
}

/* リード文（センター 16px） */
.service__lead{
  text-align: center;
  margin: 0 0 var(--service-lead-gap);
  position: relative;
  z-index: 1;
}
.service__leadMain{
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 700;
  line-height: 2.1;
  color: #333;
}
.service__leadNote{
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.8;
  color: #333;
}

/* 背景の小雲（SVG） */
.service__bgClouds{
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.service__bgCloud{
  position: absolute;
  display: block;
  width: var(--service-bgcloud-w-pc);
  height: auto;
  will-change: transform;
}

/* PC：配置（※ここが最終の“数値詰めポイント”） */
.service__bgCloud--1{ left: 20%;  top: 22%; animation: svcCloud1 5.0s ease-in-out infinite; }
.service__bgCloud--2{ right: 15%; top: 22%; animation: svcCloud2 4.6s ease-in-out infinite; }
.service__bgCloud--3{ left: -1%;  top: 40%; animation: svcCloud2 5.2s ease-in-out infinite; }
.service__bgCloud--4{ right: -1%; top: 45%; animation: svcCloud1 4.8s ease-in-out infinite; }

@keyframes svcCloud1{
  0%   { transform: translate3d(0,0,0); }
  50%  { transform: translate3d(10px,-6px,0); }
  100% { transform: translate3d(0,0,0); }
}
@keyframes svcCloud2{
  0%   { transform: translate3d(0,0,0); }
  50%  { transform: translate3d(-8px,8px,0); }
  100% { transform: translate3d(0,0,0); }
}
@media (prefers-reduced-motion: reduce){
  .service__bgCloud{ animation: none !important; }
}

/* =========================
   雲グリッド（8枚）
   PC：4列×2行（固定）
   ※「大小が出る」ように個別widthで制御
   ※ただしセル幅を超える場合は自動で縮めてはみ出し防止
   ========================= */
.service__cloudGrid{
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: var(--service-cloud-gap-x);
  row-gap: var(--service-cloud-gap-y);
  justify-items: center;
  align-items: start;
  margin: 0 auto 0px;

  /* 念のため：横方向のはみ出しを抑止（影は切りたくないのでhiddenは使わない） */
  max-width: 100%;
}

/* figureの余白リセット */
.service__cloud{
  margin: 0;
  justify-self: center;

  /* 重要：セル幅より大きいwidth指定でも、セル幅を上限にする */
  max-width: 100%;
}

/* 画像は伸ばさない（大小はfigure幅で作る） */
.service__cloud img{
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%; /* 念のため保険 */
}

/* ---- 雲の大小（PC）ここを詰める ----
   width: min(目標px, 100%) にすることで
   「普段はpx通り」「セル幅を超えるときだけ縮む」挙動になります。 */
.service__cloud--a{ width: 220px; transform: translate(20px, 6px); }
.service__cloud--b{ width: 270px; transform: translate(-10px, 20px); }
.service__cloud--c{ width: 220px; transform: translate(-20px, 10px); }
.service__cloud--d{ width: 220px; transform: translate(-40px, 2px); }

.service__cloud--e{ width: 220px; transform: translate(0px, -20px); }
.service__cloud--f{ width: 220px; transform: translate(-40px, -20px); }
.service__cloud--g{ width: 230px; transform: translate(-50px, 4px); }
.service__cloud--h{ width: 270px; transform: translate(-60px, 0px); }

/* =========================
   下段カード（3つ）
   ※「画像の上に文字を重ねる」版（改善：gap縮小＋文字位置修正）
   ========================= */
.service__cards{
  position: relative;
  z-index: 1;

  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0px;
  align-items: end;
  margin: 0 auto 34px;
}

/* 2個目（中央カード）だけ少し上げる */
.service__cards > .service__card:nth-child(2){
  transform: translateY(-30px);
}

/* リンク全体：重ねるための土台 */
.service__card{
  text-decoration: none;
  color: inherit;

  display: grid;
  /* 同じセルに重ねる */
  grid-template-areas: "stack";
  justify-items: center;

  /* ★セル内で下揃え（全体の下端ラインを揃える） */
  align-self: end;
}

/* 影込みPNG（オレンジの土台＋イラスト） */
.service__cardArt{
  grid-area: stack;

  /* ★画像は上側基準で置く（文字が中央に来ないようにする） */
  align-self: start;
}
.service__cardArt img{
  display: block;
  width: 100%;

  /* ★画像が大きすぎると余白が広く見えるので必要なら少し絞る */
  max-width: 300px; /* 320→300 目安。デザインに合わせて 280〜320 */
  height: auto;
}

/* ラベル文字（画像の“下側＝オレンジ土台”へ落とす） */
.service__cardText{
  grid-area: stack;
  z-index: 2;

  /* ★文字は下側に寄せる（オレンジ土台の上に乗る） */
  align-self: end;

  display: block;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: #333;
  line-height: 1.4;

  /* ★土台の中央付近に来るように下から持ち上げる（ここが調整点） */
  padding: 0 12px 44px; /* 44px を 36〜52 で微調整 */
}


/* =========================
   CTA（青ボタン）
   ========================= */
.service__cta{
  position: relative;
  z-index: 1;

  display: flex;
  justify-content: center;
  margin-top: 8px;
}

.service__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: var(--service-btn-blue);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;

  padding: 12px 22px;
  border-radius: 6px;
  line-height: 1;
  border: 0;
  cursor: pointer;

  transition: filter .2s ease, transform .2s ease;
}
a.service__btn:visited{
  color: #ffffff!important;
}


.service__btn:hover{
  filter: brightness(0.96);
  transform: translateY(-1px);
}
.service__btn:active{
  transform: translateY(0);
}
.service__btn:focus-visible{
  outline: 2px solid rgba(105, 132, 190, .35);
  outline-offset: 3px;
}

/* =========================
   SP（1列）
   ========================= */
@media (max-width: 1024px){
  .service__inner{
    padding: 56px var(--service-pad-x-sp) 56px;
  }

  .service__lead{
    margin-bottom: 26px;
  }
  .service__leadMain{
    line-height: 2.0;
  }

  /* 背景雲：サイズと配置を縦長に寄せる */
  .service__bgCloud{
    width: var(--service-bgcloud-w-sp);
  }
  .service__bgCloud--1{ left: 6%;  top: 2%; }
  .service__bgCloud--2{ right: 6%; top: 10%; }
  .service__bgCloud--3{ left: 6%;  top: 33%; }
  .service__bgCloud--4{ right: 6%; top: 52%; }

  /* 雲8枚：1列にする（デザイン通り） */
  .service__cloudGrid{
    grid-template-columns: 1fr;
    row-gap: 0px;
    column-gap: 0;
    margin-bottom: 30px;
    justify-items: center;
  }

  /* SPは縦並びなので、雲幅は揃える（デザインの“整列感”優先） */
  .service__cloud{
    width: min(320px, 100%);
    transform: none !important; /* 段差解除 */
  }

  .service__cloud img{
    width: 100%;
    height: auto;
  }

  /* カード：SPは縦積み */
  .service__cards{
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 26px;
  }
  .service__cardArt img{
    max-width: 360px;
  }

  /* 2個目（中央カード）だけ少し上げる */
	.service__cards > .service__card:nth-child(2){
	transform: translateY(0px);
	}

}

/* =========================
   INSTAGRAM
   - PC：w1000px
   - SP：100%（左右paddingは20px想定）
   - 背景：#e7f7df
   - タイトル：SVG
   - 投稿：プラグイン（ショートコード）出力を崩さず中央カラムに収める
   ========================= */

:root{
  --ig-bg: #e7f7df;
  --ig-max-w: 1024px;

  --ig-pad-x-pc: 30px;
  --ig-pad-x-sp: 20px;

  --ig-pad-y-pc: 86px;
  --ig-pad-y-sp: 56px;

  --ig-title-gap: 34px;
}

/* セクション背景 */
.instagram{
  background: var(--ig-bg);
  width: 100%;
}

/* 中央カラム（PC 1000px） */
.instagram__inner{
  max-width: var(--ig-max-w);
  margin: 0 auto;
  padding: var(--ig-pad-y-pc) var(--ig-pad-x-pc);
}

/* タイトル（SVG）中央 */
.instagram__title{
  margin: 0 0 var(--ig-title-gap);
  display: flex;
  justify-content: center;
}
.instagram__title img{
  display: block;
  height: auto;
  width: 192px;
  margin-left: 50px;
}

/* プラグイン出力の受け皿 */
.instagram__feed{
  width: 100%;
}

/* プラグインが中で固定幅/はみ出しを作っても崩れにくくする保険 */
.instagram__feed *{
  max-width: 100%;
}

/* 画像が入るタイプのプラグイン対策（任意だが安全） */
.instagram__feed img,
.instagram__feed video,
.instagram__feed iframe{
  max-width: 100%;
  height: auto;
}

/* SP */
@media (max-width: 1024px){
  .instagram__inner{
    max-width: 100%;
    padding: var(--ig-pad-y-sp) var(--ig-pad-x-sp);
  }

  .instagram__title{
    margin-bottom: 26px;
  }
}

/* =========================
   VISIT AREA（訪問エリア）
   - PC：max-width 1000px
   - SP：100% + 左右padding 20px
   - タイトル：SVG
   - 地図：SVG 1枚
   - 営業時間：SVG 1枚
   - テキスト：タイトル下 / 営業時間下
   ========================= */

:root{
  --visit-area-bg: #f7eddc;     /* 添付デザインに近いベージュ */
  --visit-area-max-w: 1024px;

  --visit-area-pad-x-pc: 30px;
  --visit-area-pad-x-sp: 20px;

  --visit-area-pad-top-pc: 86px;
  --visit-area-pad-bottom-pc: 86px;
  --visit-area-pad-top-sp: 56px;
  --visit-area-pad-bottom-sp: 56px;

  --visit-area-text: #333;

  --visit-area-title-w-pc: 260px; /* SVG実サイズに合わせて調整OK */
  --visit-area-title-w-sp: 220px;

  --visit-area-map-max: 520px;    /* 地図の見た目サイズ */
  --visit-area-hours-max: 520px;  /* 営業時間の見た目サイズ */

  --visit-area-gap-title: 18px;
  --visit-area-gap-lead: 26px;
  --visit-area-gap-map: 18px;
  --visit-area-gap-hours: 18px;
}

/* セクション */
.visit-area{
  background: var(--visit-area-bg);
  width: 100%;
}

/* インナー */
.visit-area__inner{
  max-width: var(--visit-area-max-w);
  margin: 0 auto;
  padding: var(--visit-area-pad-top-pc) var(--visit-area-pad-x-pc) var(--visit-area-pad-bottom-pc);
}

/* タイトル（SVG） */
.visit-area__title{
  margin: 0 0 var(--visit-area-gap-title);
  display: flex;
  justify-content: center;
}
.visit-area__title img{
  display: block;
  width: var(--visit-area-title-w-pc);
  height: auto;
  width: 192px;
  margin-left: 50px;
}

/* タイトル下テキスト */
.visit-area__lead{
  margin: 0 0 var(--visit-area-gap-lead);
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--visit-area-text);
  line-height: 1.8;
}

/* 地図（SVG 1枚） */
.visit-area__map{
  margin: 0 auto var(--visit-area-gap-map);
  display: flex;
  justify-content: center;
}
.visit-area__map img{
  display: block;
	width: 340px;
  max-width: var(--visit-area-map-max);
  height: auto;
}

/* 営業時間（SVG 1枚） */
.visit-area__hours{
  margin: 0 auto var(--visit-area-gap-hours);
  display: flex;
  justify-content: center;
}
.visit-area__hours img{
  display: block;
	width: 340px;
  max-width: var(--visit-area-hours-max);
  height: auto;
}

/* 営業時間下テキスト */
.visit-area__note{
  margin: 0;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--visit-area-text);
  line-height: 1.6;
}

/* SP */
@media (max-width: 1024px){
  .visit-area__inner{
    padding: var(--visit-area-pad-top-sp) var(--visit-area-pad-x-sp) var(--visit-area-pad-bottom-sp);
  }

  /* スマホは少し詰める（必要なら微調整） */
  .visit-area__lead{
    margin-bottom: 22px;
  }

  .visit-area__map img{
    width: 100%;
  }
  .visit-area__hours img{
    width: 100%;
  }
}

/* =========================
   CONTACT（お問い合わせ）完全版
   - PC：max-width 1000px
   - SP：添付デザイン（縦積み／TEL→注記→MAIL）
   - 背景：#e95507
   - タイトル＆LINEアイコン：SVG
   ========================= */

:root{
  --contact-bg: #e95507;
  --contact-max-w: 1024px;

  --contact-pad-x-pc: 30px;
  --contact-pad-x-sp: 20px;

  --contact-pad-top-pc: 84px;
  --contact-pad-bottom-pc: 86px;

  --contact-pad-top-sp: 48px;
  --contact-pad-bottom-sp: 52px;

  --contact-white: #fff;
  --contact-line-green: #49b35d;

  /* タイトルSVG */
  --contact-title-w-pc: 260px;
  --contact-title-w-sp: 240px;

  /* LINEアイコンSVG */
  --contact-lineicon-w: 54px;

  /* LINEボタン */
  --contact-btn-w-pc: 360px;
  --contact-btn-w-sp: 300px;
  --contact-btn-h: 44px;
  --contact-btn-radius: 8px;

  /* TEL / MAIL バッジ */
  --contact-badge-w: 56px;
  --contact-badge-h: 28px;
  --contact-badge-radius: 7px;

  /* 破線 */
  --contact-rule-w-pc: 520px;
  --contact-rule-w-sp: 320px;

  /* 文字 */
  --contact-lead-fz: 14px;
  --contact-org-fz: 14px;
  --contact-addr-fz: 14px;

  --contact-tel-fz-pc: 32px;
  --contact-mail-fz-pc: 24px;

  --contact-tel-fz-sp: 32px;   /* デザイン寄せ */
  --contact-mail-fz-sp: 24px;  /* デザイン寄せ */

  --contact-note-fz: 15px;
}

/* セクション */
.contact{
  background: var(--contact-bg);
  width: 100%;
  color: var(--contact-white);
}

/* インナー */
.contact__inner{
  max-width: var(--contact-max-w);
  margin: 0 auto;
  padding: var(--contact-pad-top-pc) var(--contact-pad-x-pc) var(--contact-pad-bottom-pc);
  text-align: center;
}

/* タイトル（SVG） */
.contact__title{
  margin: 0 0 18px;
  display: flex;
  justify-content: center;
}
.contact__title img{
  display: block;
  width: var(--contact-title-w-pc);
  height: auto;
  width: 192px;
  margin-left: 50px;
}

/* LINEアイコン（SVG） */
.contact__lineIcon{
  width: var(--contact-lineicon-w);
  margin: 0 auto 12px;
}
.contact__lineIcon img{
  display: block;
  width: 100%;
  height: auto;
}

/* リード */
.contact__lead{
  margin: 0 0 12px;
  font-size: var(--contact-lead-fz);
  font-weight: 800;
  line-height: 1.8;
  letter-spacing: .02em;
}

/* LINEボタン */
.contact__lineCta{
  margin: 0 0 44px;
}
.contact__lineBtn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: min(var(--contact-btn-w-pc), 100%);
  height: var(--contact-btn-h);

  background: var(--contact-line-green);
  color: #fff;
  text-decoration: none;

  font-size: 14px;
  font-weight: 900;
  letter-spacing: .02em;

  border-radius: var(--contact-btn-radius);
  border: 0;

  transition: filter .2s ease, transform .2s ease;
}
.contact__lineBtn:hover{
  filter: brightness(.97);
  transform: translateY(-1px);
}
.contact__lineBtn:active{
  transform: translateY(0);
}
.contact__lineBtn:focus-visible{
  outline: 2px solid rgba(255,255,255,.45);
  outline-offset: 3px;
}

/* 事業者情報（中央寄せ） */
.contact__org{
  /* ここが肝：中身（テキスト）の幅で箱を作る */
  display: inline-grid;
  row-gap: 14px;

  /* 点線を箱幅いっぱいに伸ばしたいので stretch */
  justify-items: stretch;

  /* セクション内の中央寄せ */
  text-align: center;
  margin: 0 auto;
}

/* 法人名 */
.contact__orgName{
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

/* 点線：箱幅（＝テキスト幅）に100%で追従 */
.contact__orgRule{
  display: block;
  width: 100%;
  height: 2px;

  /* 点線を背景で描く（安定） */
  background-image: repeating-linear-gradient(
    to right,
    rgba(255,255,255,.85) 0 8px,
    rgba(255,255,255,0)   8px 14px
  );
}

/* 住所 */
.contact__orgAddr{
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.8;
  color: #fff;
}

.contact__orgAddr a {
    color: inherit;          /* 親要素（pタグ）の文字色を継承 */
    text-decoration: none;   /* アンダーラインを消す */
    pointer-events: auto;    /* クリックは有効にする */
}

/* 訪問済みでも色が変わらないようにする */
.contact__orgAddr a:visited {
    color: inherit;
}


@media (max-width: 1024px){
  .contact__orgName{ font-size: 16px; }
  .contact__orgAddr{ font-size: 14px; }
}

@media (max-width: 375px){
  .contact__orgName{ font-size: 15px; }
  .contact__orgAddr{ font-size: 14px; }
}


/* TEL / MAIL（PCは横並び、SPで縦） */
.contact__info{
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 0px;
  flex-wrap: wrap;
  margin: 50px 0 14px;
}

/* TEL / MAIL ユニット */
.contact__tel,
.contact__mail{
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

/* バッジ */
.contact__badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: var(--contact-badge-w);
  height: var(--contact-badge-h);

  background: rgba(255,255,255,.95);
  color: var(--contact-bg);

  border-radius: var(--contact-badge-radius);

  font-size: 13px;
  font-weight: 900;
  letter-spacing: .06em;
}

/* TEL番号 */
.contact__telNum{
  color: var(--contact-white);
  text-decoration: none;
  font-size: var(--contact-tel-fz-pc);
  font-weight: normal;
  letter-spacing: .02em;
  line-height: 1;
  white-space: nowrap;
}

/* MAIL */
.contact__mailAddr{
  color: var(--contact-white);
  text-decoration: none;
  font-size: var(--contact-mail-fz-pc);
  font-weight: normal;
  letter-spacing: .02em;
  line-height: 1;
  white-space: nowrap;
}

.contact__telNum:hover,
.contact__mailAddr:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 注記（TEL下） */
.contact__note{
  margin: 0;
  font-size: var(--contact-note-fz);
  font-weight: 900;
  line-height: 1.9;
  letter-spacing: .02em;
  width: min(520px, 100%);
  padding-left: 100px;
  margin-right: auto;
  text-align: left;
  margin-top: 10px;
}

/* =========================
   SP（添付デザイン寄せ）
   - すべて中央配置
   - TEL → 注記 → MAIL の順で縦積み
   - TEL/Mail は「バッジ + 文字」を同一行に
   ========================= */
@media (max-width: 1024px){
  .contact__inner{
    padding: var(--contact-pad-top-sp) var(--contact-pad-x-sp) var(--contact-pad-bottom-sp);
  }

  .contact__title{
    margin-bottom: 14px;
  }

  .contact__lineCta{
    margin-bottom: 38px;
  }
  .contact__lineBtn{
    width: min(var(--contact-btn-w-sp), 100%);
    height: 44px;
    border-radius: 8px;
  }

  /* 破線をSP幅に */
  .contact__orgRule{
    width: min(var(--contact-rule-w-sp), 100%);
    margin-bottom: 7px;
  }

  .contact__org{
    margin-bottom: 0px;
    row-gap: 0px;
  }

  .contact__orgName{
    margin-bottom: 12px;
  }

  /* 住所：自動リンク（青文字）と下線を無効化 */
  .contact__orgAddr a {
    color: inherit;
    text-decoration: none;
    pointer-events: auto;
  }

  /* 縦積みに変え、中央に配置 */
  .contact__info{
    display: flex;
    flex-direction: column;
    align-items: center; 
    gap: 20px; /* TELグループとMAILの間の隙間 */
    margin-bottom: 10px;
  }

  /* TELと注釈をまとめる箱 */
  .contact__telGroup {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: fit-content;
    min-width: 280px;
  }

  /* TEL単体およびMAIL単体 */
  .contact__tel,
  .contact__mail{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    width: fit-content;
  }

  /* 注記：TELの直下、番号の開始位置に合わせる */
  .contact__note{
    text-align: left;
    margin-top: 10px;
    padding-left: 70px; 
    font-size: 14px;
    line-height: 1.6;
    color: #fff;
  }

  .contact__badge{
    width: 56px;
    height: 28px;
    border-radius: 7px;
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  .contact__telNum{
    font-size: var(--contact-tel-fz-sp);
    letter-spacing: .02em;
    color: #fff;
    text-decoration: none;
    font-weight: bold;
  }

  .contact__mailAddr{
    font-size: var(--contact-mail-fz-sp);
    letter-spacing: .02em;
    color: #fff;
    text-decoration: none;
  }
}

/* さらに小さい端末（iPhone SE等） */
@media (max-width: 390px){
  .contact__telNum{
    font-size: 28px;
  }
  .contact__mailAddr{
    font-size: 18px;
  }
  .contact__note {
    padding-left: 0; /* 狭い画面ではインデントを解除 */
    text-align: center;
    width: 100%;
    min-width: 100%;
  }
}



/* =========================
   FOOTER
   - PC：横並び（区切り線あり）
   - SP：縦並び（区切り線なし）
   ========================= */

:root{
  --footer-max-w: 1024px;
  --footer-pad-x-pc: 30px;
  --footer-pad-x-sp: 20px;

  --footer-text: #e95507;          /* デザインのオレンジ */
  --footer-sep: rgba(216,95,41,.55);

  --footer-nav-fz: 14px;
  --footer-nav-weight: 800;
}

.siteFooter{
  background: #fff;
  width: 100%;
  padding: 64px 0 72px;
}

.siteFooter__inner{
  max-width: var(--footer-max-w);
  margin: 0 auto;
  padding: 0 var(--footer-pad-x-pc);
  text-align: center;
}

.siteFooter__logo{
  display: inline-block;
  text-decoration: none;
}
.siteFooter__logo img{
  display: block;
  width: 120px;
  height: auto;
  margin: 0 auto 26px;
}

.siteFooter__navList{
  list-style: none;
  margin: 0;
  padding: 0;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  flex-wrap: wrap;
}

.siteFooter__navItem{
  margin: 0;
  padding: 0;
}

.siteFooter__navLink{
  color: var(--footer-text);
  text-decoration: none;
  font-size: var(--footer-nav-fz);
  font-weight: var(--footer-nav-weight);
  letter-spacing: .02em;
  line-height: 1.6;
  white-space: nowrap;
}
.siteFooter__navLink:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* 区切り線（| の代わり。デザインに寄せて細い縦線） */
.siteFooter__navSep{
  width: 1px;
  height: 18px;
  background: var(--footer-sep);
}

/* =========================
   SP
   ========================= */
@media (max-width: 1024px){
  .siteFooter{
    padding: 48px 0 56px;
  }

  .siteFooter__inner{
    padding: 0 var(--footer-pad-x-sp);
  }

  .siteFooter__logo img{
    width: 150px;
    margin-bottom: 22px;
  }

  /* 縦積み */
  .siteFooter__navList{
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
  }

  /* 区切り線は消す */
  .siteFooter__navSep{
    display: none;
  }

  .siteFooter__navLink{
    white-space: normal;
  }
}

/* --- フッターナビの訪問済み（visited）対策 --- */

/* 訪問済みリンクの色を未訪問時と同じにする */
.siteFooter__navLink,
.siteFooter__navLink:visited {
    color: var(--footer-text);
    text-decoration: none;
    opacity: 1;
}

/* ホバー時の挙動も念のため明示 */
.siteFooter__navLink:hover {
    opacity: 0.7; 
    color: var(--footer-text);
    text-decoration: none;
}

br.br-sp{
	display: none;
}

@media (max-width: 1024px){
	br.br-sp{
		display: block;
	}
}

/* =========================
   Global Components
   ========================= */

/* 共通の本文スタイル（全ページ適用） */
main p {
    margin: 0 0 30px;
    font-size: 16px;
    font-weight: 700;
    line-height: 2.45;
    text-align: center;
    letter-spacing: 1px;
}

/* 共通のカラフル点線パーツ */
.lino-dots {
    text-align: center;
    margin: 0px 0 30px;
}

.lino-dots img {
    width: 150px; /* 必要に応じて調整 */
    height: auto;
    display: inline-block;
}

/* セクションタイトル（オレンジ・中央揃え） */
.lino-section-title {
    color: #e95507;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 5px;
    line-height: 0.3;
}

/* セクションタイトル（ブルー・中央揃え） */
.lino-section-title-b {
    color: #6984be!important;
}

/* セクションタイトル（グリーン・中央揃え） */
.lino-section-title-g {
    color: #37a09a!important;
}

/* 下層ページ */
/* =========================
   Lower Pages / Common Styles
   ========================= */

/* 背景色のバリエーション */
.bg-cream { background-color: var(--lino-cream); }
.bg-blue  { background-color: #e1eff9; } /* スクショの訪問看護セクション色 */
.bg-white { background-color: #ffffff; }
.bg-green { background-color: #e9f7e9; } /* スクショの保育園セクション色 */

/* 下層ページ専用の共通余白設定 */
.lino-section {
  padding: 0px 0;
}


/* 画像の円形切り抜き用 */
.img-circle {
  border-radius: 50%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}


.about-page__rainbow {
  text-align: center;
  margin: 40px 0;
}

.about-page__rainbow img {
  width: 450px;
  height: auto;
}

main .lino-section p{
  font-size: 14px;
  margin: 15px 0 0px;
}

@media (max-width: 1024px) {
  .lino-section {
    padding: 30px 0;
  }

  .about-page__rainbow img {
    width: 100%;
    max-width: 450px;
    height: auto;
  }

main .lino-section p{
    margin: 0 0 0px;
  }

}

/* =========================
   Media Block (Design Fidelity)
   ========================= */

.lino-media {
  display: flex;
  align-items: center; /* 左の画像と右の塊を中央で整列 */
  justify-content: center;
  gap: 20px;
  max-width: 940px;
  margin: 0px auto 0;
}

/* 左カラム：画像 */
.lino-media__left {
  flex-shrink: 0;
}

.lino-media__left .img-photo {
  width: 440px;
  height: auto;
  display: block;
}

/* 右カラム：コンテンツ全体 */
.lino-media__right {
  flex: 1;
  position: relative;
  /* ★重要：星のイラストが居座るための「空き地」を確保します */
  /* ここを調整することで、タイトルと本文がまとめて下に移動します */
  padding-top: 20px; 
}

/* イラスト（流れ星）：padding-topで空いたスペースの左上に固定 */
.lino-media__deco-star {
  position: relative;
  top: 0;       /* padding-topの0地点に配置 */
  left: 30px;  /* タイトルの左端より少し左へ */
  width: 110px; /* デザインに合わせたサイズ */
  z-index: 1;
  line-height: 0;
}

.lino-media__deco-star img {
  width: 100px;
  height: auto;
}

/* 右カラム内の要素を強制左揃え */
.lino-media__right .lino-section-title,
.lino-media__right .lino-dots,
.lino-media__right p {
  text-align: left !important;
  justify-content: flex-start !important;
  margin-left: 0 !important;
}

/* タイトル：星とわずかに被っても視認性を保つ */
.lino-media__right .lino-section-title {
  font-size: 18px;
  margin-top: 30px;
  margin-bottom: 10px;
  padding-left: 15px;
  position: relative;
  z-index: 2;
  color: #6984be;
}

/* 点線 */
.lino-media__right .lino-dots {
  margin: 0 0 24px 0;
}

/* 本文テキスト：pタグ1つの構造を維持 */
.lino-media__right p {
  margin-bottom: 0;
}

/* =========================
   SP対応
   ========================= */
@media (max-width: 850px) {
  .lino-media {
    flex-direction: column;
    gap: 40px;
    padding: 0 0px;
  }

  .lino-media__right {
    padding-top: 70px;
    width: 100%;
  }

  .lino-media__deco-star {
    left: 50%;
    transform: translateX(-50%);
    top: 0;
  }

  .lino-media__right .lino-section-title,
  .lino-media__right .lino-dots,
  .lino-media__right p {
    text-align: center !important;
    justify-content: center !important;
  }

  .lino-media__right .lino-section-title {
    font-size: 18px;
    margin-top: 30px;
    margin-bottom: 10px;
    padding-left: 0px;
  }


}

/* Table Section */
.about-table__wrapper {
    background: #fff;
    max-width: 620px; /* ご指定の幅 */
    margin: 40px auto 0;
    padding: 20px 40px;
}

.about-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 0;
}

.about-table th,
.about-table td {
    padding: 15px 0;
    border-bottom: 1px solid #e95507; /* オレンジの線 */
    text-align: left;
    font-size: 14px;
    font-weight: 700;
}

/* テーブル内の住所リンク */
.about-table td a {
    color: inherit;         /* 周りの文字と同じ色にする */
    text-decoration: none;  /* 下線を消す */
    pointer-events: auto;   /* タップは有効にする */
}

/* 念のため訪問済みリンクの色も固定 */
.about-table td a:visited {
    color: inherit;
}




.about-table th {
    width: 18%;
    color: var(--lino-text);
    vertical-align: top;
}

.about-table tr:last-child th,
.about-table tr:last-child td {
    border-bottom: none;
}

@media (max-width: 640px) {
    .about-table__wrapper { padding: 20px; margin: 20px 0px; }
    .about-table th { width: 25%; font-size: 14px; }
    .about-table td { font-size: 14px; }
}

/* =========================
   Nursery Section (bg-green)
   ========================= */


/* セクションヘッダー */
.lino-section-header {
    text-align: center;
    margin-bottom: 50px;
}

.header-deco img {
    width: 80px;
    height: auto;
}

.nursery-name {
    margin-top: 15px;
    font-size: 16px;
    font-weight: 700;
    color: var(--lino-text);
}

.nursery-logo {
    margin-top: 25px;
}

.nursery-logo img {
    width: 95px;
}

/* メインコンテンツ：PC版は【左：テキスト、右：写真】 */
.lino-media.is-reverse {
    display: flex;
    flex-direction: row; /* ★rowに変更。HTMLの「テキスト→写真」の順をそのまま活かします */
    align-items: center; 
    justify-content: center;
    gap: 60px;
    max-width: 1024px;
    margin: 0 auto;
}

/* 左カラム：テキストエリア（センター揃え） */
.lino-media.is-reverse .lino-media__content {
    flex: 1;
    text-align: center !important; /* ★カラム内で要素を中央に配置 */
}

/* 右カラム：写真 */
.lino-media.is-reverse .lino-media__img {
    flex: 0 0 500px;
}

.lino-media.is-reverse .lino-media__img img {
    width: 100%;
    height: auto;
    display: block;
}

/* カラム内の各パーツ */
.nursery-catch {
    color: #4fb0a5;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 25px;
    text-align: center;
}

.nursery-sub-title {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 15px;
    color: var(--lino-text);
    text-align: center;
}

.lino-media__content p {
    font-size: 14px;
    line-height: 2;
    margin-bottom: 0;
    text-align: justify;
}

/* ボタン：Linoグリーン */
.lino-btn-area {
    margin-top: 20px;
    text-align: center;
}

.lino-btn {
    display: inline-block;
    background-color: #37a09a;
    color: #fff;
    padding: 7px 10px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    transition: opacity 0.3s;
}
.lino-btn:hover {
    opacity: 0.7;
    color: #fff;
}

.pc-show{
  display: block;
}

.sp-show{
  display: none;
}

/* SP対応（モバイルでは写真が上にくるように調整） */
@media (max-width: 765px) {
    .lino-media.is-reverse {
        display: flex; /* 追加：順序制御のため */
        flex-direction: column; /* ★column-reverseではなく、HTML順のcolumnにする */
        gap: 30px;
        padding: 0 0px;
    }
    
    .lino-media.is-reverse .lino-media__img {
        order: -1; /* ★これだけで画像がテキストブロックより上に移動します */
        width: 100%;
        flex: none;
    }

    .lino-media.is-reverse .lino-media__content {
        text-align: center;
    }

    .pc-show {
        display: none;
    }

    .sp-show {
        display: block;
    }

    /* キャッチコピーとテキストをセンター揃えに */
    .nursery-catch,
    .nursery-sub-title,
    .lino-media__content p {
        text-align: center;
    }
    .nursery-catch{
      line-height: 2;
      margin-bottom: 20px!important;
    }
    .nursery-description p{
      text-align: justify!important;
    }

}

/*--------------------------------------------------------------
# サービス内容：雲のレイアウト（メイン9個 + 装飾小雲4個）
--------------------------------------------------------------*/

/* 1000px幅の基準コンテナ */
.service-cloud-wrapper {
    position: relative;
    max-width: 1100px;
    margin: 60px auto 150px;
    padding: 0;
}

/* 雲エリア：PC版の高さ */
.service-cloud-items {
    position: relative;
    width: 100%;
    min-height: 700px; 
}

/* --- 装飾用の小さな雲 (4つ) --- */
.service-cloud-wrapper .fv__cloud {
    position: absolute;
    z-index: 1; /* メインの雲(z-index:2)より後ろへ */
    pointer-events: none; /* クリックの邪魔をしない */
    width: auto;
    height: auto;
}

/* 小さな雲のPC版位置指定 */
.service-cloud-wrapper .fv__cloud--1 { top: -6%;   left: 20%;  width: 90px; }
.service-cloud-wrapper .fv__cloud--2 { top: -3%;  right: 28%; width: 60px; }
.service-cloud-wrapper .fv__cloud--3 { bottom: -22%; left: 22%; width: 60px; }
.service-cloud-wrapper .fv__cloud--4 { bottom: -18%; right: 20%; width: 90px; }

/* --- メインの雲アイテム (9個) --- */
.cloud-item {
    position: absolute;
    z-index: 2;
    width: 380px;
    transition: transform 0.3s ease;
}

.cloud-item__inner {
    position: relative;
    width: 100%;
}

.cloud-item__bg {
    width: 100%;
    display: block;
}

.cloud-item__content {
    position: absolute;
    top: 43%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    text-align: center;
    z-index: 3;
}

.cloud-item__title {
    font-size: 18px;
    font-weight: 700;
    color: #6984be;
    margin-bottom: 0px;
    line-height: 1.4;
}

.cloud-item__text {
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 0;
    color: var(--lino-text);
    text-align: justify;
    letter-spacing: 0px;
    font-feature-settings: "palt";
}

.cloud-item__text span{
  color: #6984be;
}
/* 5番：日常のサポート（中央・特大） */
.item--5.item--daily {
    width: 400px;
    z-index: 5;
    top: 57%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.item--5 .cloud-item__title {
    font-size: 1.3rem;
}

.item--5 .cloud-item__content {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    text-align: center;
    z-index: 3;
}


/* --- PC版：3カラム配置の座標 --- */
.item--1 { top: 6%;   left: -3%; }
.item--2 { top: -3%;   left: 50%; transform: translateX(-50%); }
.item--3 { top: 6%;   right: -3%; }

.item--4 { top: 40%;  left: -3%; }
/* .item--5 は上記 item--daily で中央固定済み */
.item--6 { top: 40%;  right: -3%; }

.item--7 { top: 78%;  left: -3%; }
.item--8 { top: 90%;  left: 50%; transform: translateX(-50%); }
.item--9 { top: 77%;  right: -3%; }

/*--------------------------------------------------------------
# レスポンシブ (SP)
--------------------------------------------------------------*/
@media (max-width: 1024px) {
  .service-cloud-wrapper {
      margin: 0px auto 0px;
  }

    .service-cloud-items {
        min-height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        padding-bottom: 0px;
    }

    .cloud-item {
        position: relative;
        inset: auto !important;
        transform: none !important;
        width: 100%;
        max-width: 340px;
        margin: 0 auto;
    }

    .item--5.item--daily {
        width: 100%;
        max-width: 340px;
    }

    .cloud-item__title { font-size: 1rem; }
    .cloud-item__text { font-size: 0.875rem; }

    /* 小さな雲のPC版位置指定 */
  .service-cloud-wrapper .fv__cloud--1 { top: -6%;   left: 5%;  width: 90px; }
  .service-cloud-wrapper .fv__cloud--2 { top: -3%;  right: 5%; width: 60px; }
  .service-cloud-wrapper .fv__cloud--3 { bottom: -22%; left: 22%; width: 60px; }
  .service-cloud-wrapper .fv__cloud--4 { bottom: -18%; right: 20%; width: 90px; }

  .service-cloud-wrapper .fv__cloud--1,
  .service-cloud-wrapper .fv__cloud--2,
  .service-cloud-wrapper .fv__cloud--3,
  .service-cloud-wrapper .fv__cloud--4 { 
    display: none; 
  }

}

.service-detail-layout {
    display: flex;
    justify-content: center; /* 中央寄せ */
    gap: 50px;               /* 画像同士の間の隙間 */
    margin-top: 40px;
}

.service-detail-item {
    flex: 1;                 /* 左右均等な幅にする */
    max-width: 500px;        /* 広がりすぎないよう最大幅を制限（任意） */
}

.service-detail-item img {
    width: 100%;             /* 親要素の幅いっぱいに広げる */
    height: auto;            /* 比率を維持 */
    display: block;
}

/* スマホでは縦並びにする */
@media (max-width: 1024px) {
    .service-detail-layout {
        flex-direction: column;
        align-items: center;
    }
    .service-detail-item {
        width: 100%;
        max-width: 100%;    /* スマホでは横幅いっぱい */
    }
}

/* --- サービス詳細セクション全体のレイアウト --- */

.service-detail-container {
    position: relative;
    padding-top: 60px;
}

/* 左右（小児・成人）を横に並べるコンテナ */
.service-detail-layout {
    display: flex;
    justify-content: center;
    gap: 50px; 
    margin-top: 40px;
}

/* 各ブロック（小児/成人）の幅 */
.service-detail-item {
    flex: 1;
    max-width: 500px;
}

/* 01(タイトル)と02(カード)を縦に並べる設定 */
.img-group {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.service-detail-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* --- キャラクターの設定（座標は維持） --- */

.service-char {
    position: absolute;
    z-index: 5;
    height: auto;
    pointer-events: none;
}

/* 小児部門：オレンジ */
.char-child-orange {
    top: 176px;
    left: 18%;
    width: 50px;
}

/* 小児部門：ブルー */
.char-child-blue {
    top: 188px;
    left: 40%;
    width: 60px;
}

/* 成人部門：紺色 */
.char-adult-navy {
    top: 193px;
    right: 18%;
    width: 80px;
}

/* --- アニメーション --- */

@keyframes sway {
    0% { transform: translateX(0); }
    50% { transform: translateX(12px); }
    100% { transform: translateX(0); }
}

.anim-sway-1 {
    animation: sway 3.5s ease-in-out infinite;
}

.anim-sway-2 {
    animation: sway 4.2s ease-in-out infinite -1s; 
}

/* --- iPad対応（1024px以下） --- */

@media (max-width: 1024px) {
    /* 左右並びを縦並びに変更 */
    .service-detail-layout {
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }
    
    .service-detail-item {
        width: 100%;
    }

    /* スマホ版のキャラクター座標（維持） */
    .char-child-orange { top: 11%; left: 26%; width: 50px; }
    .char-child-blue { top: 11.5%; left: 68%; width: 60px; }
    
    .char-adult-navy {
        top: 58%; 
        right: 29%;
        width: 80px;
    }
    
    .service-detail-container {
        position: relative;
        padding-top: 60px;
    }
}

/* --- スマホ対応（768px以下） --- */
@media (max-width: 768px) {

    /* スマホ版のキャラクター座標（維持） */
    .char-child-orange { top: 11%; left: 20%; width: 50px; }
    .char-child-blue { top: 11.5%; left: 75%; width: 60px; }
      .char-adult-navy {
        top: 59%; 
        right: 14%;
        width: 80px;
    }

}

/* --- スマホ対応（768px以下） --- */
@media (max-width: 430px) {

    /* スマホ版のキャラクター座標（維持） */
    .char-child-orange { top: 11%; left: 4%; width: 50px; }
    .char-child-blue { top: 11.5%; left: 77%; width: 60px; }
    .char-adult-navy {
        top: 59%; 
        right: 7%;
        width: 80px;
    }
}

/* --- レイアウト基盤 --- */
.user-grid {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 0px;
    position: relative;
    margin: 50px auto 0;
    max-width: 1100px;
    width: 100%;
}

main p.user-intro{
  line-height: 1.5;
}

.user-card-group {
    flex: 1;
    max-width: 485px;
    min-width: 0;
}

.user-card {
    position: relative;
    width: 100%;
    z-index: 1;
    /* 背景を要素の底に合わせ、リピートさせない */
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: top center;
    /* ★追加：要素自体が画像を切り落とさないように可視化 */
    overflow: visible; 
}

.card--medical { 
    background-image: url('./img/bg-card-left.svg'); 
}

.card--care {
    background-image: url('./img/bg-card-right.svg');
    margin-top: -10px;
}

/* 医療保険カード（左） */
.card--medical .user-card-content {
    position: relative;
    z-index: 5;
    /* ★修正：下部パディングを増やしてシャドウの通り道を確保 */
    padding: 90px 30px 80px; 
}

/* 介護保険カード（右） */
.card--care .user-card-content {
    position: relative;
    z-index: 5;
    /* ★修正：10pxだとシャドウが消えるので、左と同じか多めに確保 */
    padding: 100px 30px 20px; 
}


/* --- キャラクター配置 --- */
.char-family-center {
    position: absolute;
    top: -20px;
    left: 85%;
    transform: translateX(-50%);
    width: 93px;
    z-index: 10;
}
.char-senior-right {
    position: absolute;
    bottom: 25px;
    right: 40px;
    width: 52px;
    z-index: 15; /* 重なり順を一番上に */
}

/* --- リスト・テキスト装飾 --- */
.user-list { 
    list-style: none; 
    padding: 0; 
    margin-bottom: 15px;
    margin-left: 0;
}
.user-list li {
    position: relative;
    padding-left: 1em;
    font-size: 14px;
    line-height: 1.65;
    margin-top: 0px;
    font-weight: bold;
    color: #534741;
}
.list--orange li::before { content: "●"; position: absolute; left: 0; color: #f39800; }
.list--green li::before { content: "●"; position: absolute; left: 0; color: #76b900; }

.badge-item {
    color: #fff;
    text-align: center;
    border-radius: 50px;
    padding: 6px;
    font-weight: bold;
    font-size: 16px;
    margin: 20px 0 10px;
}
.badge-item.orange { background-color: #f39800; }
.badge-item.green { 
  background-color: #6fb25d; 
  margin-bottom: 0;
}
.badge-item.green:first-child { 
  margin-top: 0; 
}

main p.badge-desc { 
    font-size: 14px; 
    font-weight: bold; 
    margin:0 0 10px; 
    color: #534741; 
    text-align: justify;
    letter-spacing: 0px;
    line-height: 1.6;
}

main .card--care p.badge-desc { 
    font-size: 14px; 
    font-weight: bold; 
    margin:10px 0 10px; 
    color: #534741; 
    text-align: center;
    letter-spacing: 0px;
}

/* --- 介護保険フロー --- */
.care-flow { margin-top: 0px; }
.flow-title { 
  font-size: 16px;
  text-align: center; 
  margin-bottom: 15px; 
}
.marker--green {
    position: relative;
    font-weight: bold;
    display: inline-block; /* 位置固定のため */
    padding: 0 4px;
    z-index: 1;
}

.marker--green::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 2px; 
    width: 100%;
    height: 13px; /* 指定の太さ */
    background-color: #e3f1c2;
    z-index: -1; /* 文字の下に配置 */
}

/* 注釈テキスト */
main p.user-footer-note {
    font-size: 14px;
    line-height: 1.3;
    margin-top: 10px;
    font-weight: bold;
    color: #534741;
    text-align: justify;
    padding: 0 15px;
}

/* --- SP対応 --- */
@media (max-width: 1024px) {
    .user-grid { 
        flex-direction: column; 
        align-items: center; 
        gap: 20px; 
        margin-top: 80px; 
    }
    .user-card-group { 
        width: 100%; 
        max-width: 100%; 
    }
    .card--care { 
        margin-top: 0; 
    }
    .card--medical { 
        background-image: url('./img/bg-card-left-sp.png'); 
    }
    .card--care { 
        background-image: url('./img/bg-card-right-sp.png'); 
    }
    
    main p.user-intro {
        line-height: 1.5;
        font-size: 16px;
        text-align: justify;
    }

    /* 医療保険カード（左/上） */
    .card--medical .user-card-content {
        padding: 250px 50px 50px; 
    }

    /* 介護保険カード（右/下） */
    .card--care .user-card-content {
        padding: 250px 50px 2vh; 
    }

    main .card--care p.badge-desc { 
        font-size: 14px; 
        font-weight: bold; 
        margin: 10px 0 10px; 
        color: #534741; 
        text-align: center;
        letter-spacing: 0px;
    }
}

/* --- iPadmini対応 --- */
@media (max-width: 768px) {
    /* 医療保険カード（左/上） */
    .card--medical .user-card-content {
        padding: 200px 50px 50px; 
    }
    /* 介護保険カード（右/下） */
    .card--care .user-card-content {
        padding: 200px 50px 2vh; 
    }
    .char-family-center {
      top: 50px;
      left: 85%;
  }

}

@media (max-width: 430px) {
    /* 医療保険カード（左/上） */
    .card--medical .user-card-content {
        padding: 90px 50px 50px; 
    }
    /* 介護保険カード（右/下） */
    .card--care .user-card-content {
        padding: 90px 50px 2vh; 
    }
    .char-family-center {
      top: -60px;
      left: 85%;
  }

}
@media (max-width: 375px) {

    .user-list li,
    main p.badge-desc,
    main .card--care p.badge-desc{
      font-size: 0.8rem;
    }
    /* 医療保険カード（左/上） */
    .card--medical .user-card-content {
        padding: 100px 20px 5vh; 
    }
    /* 介護保険カード（右/下） */
    .card--care .user-card-content {
        padding: 100px 20px 3vh; 
    }
}



/* --- ご利用の流れセクション基盤 --- */
.flow-container {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 0px;
    margin-top: 60px;
    position: relative;
    padding-bottom: 50px;
}

.flow-item {
    flex: 1;
    position: relative;
    max-width: 240px;
    text-align: center;
}

/* 気球の上下配置（1・3番を上げ、2・4番を下げる） */
.item--02, .item--04 {
    margin-top: 100px;
}

/* --- アニメーション設定 --- */
.balloon-wrap {
    position: relative;
    width: 100%;
    z-index: 1;
    /* 中の画像とテキストをセットで動かす */
    animation: floatBalloon 3s ease-in-out infinite alternate;
}

.item--02 .balloon-wrap, .item--04 .balloon-wrap {
    animation-delay: 0.5s;
}

@keyframes floatBalloon {
    0% { transform: translateY(0); }
    100% { transform: translateY(-15px); }
}

/* --- テキスト配置（balloon-wrap内での絶対位置） --- */
.flow-text {
    position: absolute;
    top: 40%; /* 吹き出しの中心にくるよう調整 */
    left: 50%;
    transform: translate(-50%, -50%);
    width: 85%;
    z-index: 5;
    pointer-events: none;
}

main p.flow-item-title {
    color: #37a09a;
    font-weight: bold;
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 5px;
    margin-top: 5px;
}

main p.flow-item-desc {
    font-size: 14px;
    line-height: 1.5;
    font-weight: bold;
    color: #444;
    font-feature-settings: palt;
    letter-spacing: -1px;
    text-align: center;
    margin-top: 5px;
}

/* --- SP対応 --- */
@media (max-width: 1024px) {
    .flow-container {
        flex-direction: column;
        align-items: center;
        gap: 0px;
        padding-bottom: 0;
    }

    .flow-item {
        width: 100%;
        max-width: 300px;
        margin-top: 0 !important;
    }

    .item--01 { margin-left: -80px; }
    .item--02 { margin-left: 80px; }
    .item--03 { margin-left: -80px; }
    .item--04 { margin-left: 80px; }

    .flow-item-title {
        font-size: 15px;
    }
    .flow-item-desc {
        font-size: 12px;
    }
    .flow-text {
      width: 65%;
  }

}

/* レイアウト */
.area-price-grid {
    display: flex;
    justify-content: center;
    gap: 60px;
    margin-top: 60px;
}

.area-column, .price-column {
    flex: 1;
    max-width: 450px;
    text-align: center;
}

/* タイトルと本文のサイズ指定 */
.lino-section-title {
    font-size: 18px; /* ご指定のサイズ */
    margin-bottom: 10px;
}

.area-text, .price-list li, .price-note {
    font-size: 14px; /* ご指定のサイズ */
    font-weight: bold;
    color: #e87a4b; /* オレンジ系の文字色 */
}

/* 左カラム：キャラクター */
.area-char {
    margin-top: 20px;
}
.area-char img {
    width: 56px;
    height: auto;
}

/* 右カラム：背景SVGカードの幅固定 */
.price-card {
    background-image: url('./img/bg-price-orange.svg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 350px; /* 350pxに固定 */
    margin: -30px auto 0;
    padding: 50px 25px 50px; 
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

/* 中身のテキスト調整 */
.price-content {
    padding: 10px 0 0 ; 
}


.price-list {
    list-style: none;
    padding: 0;
    text-align: left;
    margin-bottom: 0px;
    margin-left: 0;
}

.price-list li {
    color: #fff;
    position: relative;
    padding-left: 1.2em;
    margin-bottom: 8px;
}

.price-list li::before {
    content: "●";
    position: absolute;
    left: 0;
}

.price-note {
    color: #fff;
    text-align: left;
}

/* SP対応 */
@media (max-width: 1024px) {
    .area-price-grid {
        flex-direction: column;
        align-items: center;
        gap: 50px;
    }
}

/* --- スタッフ紹介セクション 完全版 --- */

/* コンテンツ最大幅 */
.staff-max-width {
    max-width: 1024px;
    margin: 0 auto;
}

.lino-section-title {
    font-size: 18px;
    font-weight: bold;
    color: #e87a4b;
    text-align: center;
}

.staff-container {
    margin-top: 60px;
    display: flex;
    flex-direction: column;
    gap: 100px;
}

/* PCレイアウト：写真4割 / テキスト6割 */
.staff-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5%;
}

/* 福永さん（2人目）のみ反転 */
.staff-item:nth-child(2) {
    flex-direction: row-reverse;
}

.staff-visual {
    position: relative;
    flex: 0 0 45%;
}

.staff-content {
    flex: 0 0 50%;
    display: flex;
    flex-direction: column;
}

.staff-photo img {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
    z-index: 2;
}

/* 藤井さん写真背後のイラスト */
.staff-illust {
    position: absolute;
    top: -10%;
    left: -10%;
    width: 120%;
    z-index: 1;
    pointer-events: none;
}

/* --- 名前エリア：SVGの上にテキスト --- */

/* 1人目と3人目は左揃え、2人目は右揃え */
.staff-item:nth-child(1) .staff-name-area,
.staff-item:nth-child(3) .staff-name-area { align-self: flex-start; }
.staff-item:nth-child(2) .staff-name-area { align-self: flex-end; }

.staff-name-area {
    position: relative;
    padding: 12px 35px 20px;
    display: inline-block;
}

.staff-name-bg {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 1;
}

.staff-name-bg img {
    width: 100%; height: 100%; object-fit: stretch;
}

.staff-name-text {
    position: relative;
    z-index: 2;
    font-size: 16px;
    font-weight: bold;
    color: #534741;
    margin: 0;
    white-space: nowrap;
    /* 不要なドット線(border-bottom)はデザインにないため削除 */
}

/* 名前下のドット画像：揃えを名前に合わせる */
.staff-item:nth-child(1) .staff-name-dots,
.staff-item:nth-child(3) .staff-name-dots { text-align: left; }
.staff-item:nth-child(2) .staff-name-dots { text-align: right; }

.staff-name-dots {
    margin: 8px 0 25px 0;
}
.staff-name-dots img {
    width: 60px;
    height: auto;
}

/* 本文テキスト */
.staff-desc p {
    font-size: 14px;
    line-height: 1.9;
    color: #534741;
    margin-bottom: 15px;
    text-align: left;
}

/* --- レスポンシブ (SP) --- */
@media (max-width: 1024px) {
    .staff-container {
        gap: 60px;
    }

    .staff-item,
    .staff-item:nth-child(2) {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 20px;
    }

    .staff-visual, .staff-content {
        flex: 0 0 100%;
        width: 100%;
    }

    .staff-visual {
        max-width: 100%;
    }

    .staff-content {
        align-items: center;
    }

    .staff-name-area {
        align-self: center !important;
        margin-bottom: 20px;
    }

    .staff-name-dots {
        text-align: center !important;
    }

  .staff-photo img {
      max-width: 400px;
      width: 100%; /* スマホでは450px以下なら幅いっぱいに広がるように設定 */
      height: auto;
      display: block;
      margin-left: auto;  /* 左右中央配置 */
      margin-right: auto; /* 左右中央配置 */
      position: relative;
      z-index: 2;
  }

}

/* iPad・タブレットサイズ以上の時 */
@media (min-width: 430px) {
    .staff-photo img {
      width: 100%;
    }
}

/* --- リクルートページ：FV・導入エリア（共通コンテナ） --- */
.recruit-wrapper{
  padding-bottom: 100px;
}
.recruit-container {
    max-width: 1024px;
    margin: 0 auto;
    padding-top: 50px;
    position: relative;
}

.recruit__bgClouds {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

/* 1. アニメーションを解除するメインの雲 */
.recruit-fv-cloud {
    text-align: center;
    margin-bottom: 30px;
    position: relative;
    z-index: 0;
}

.recruit-fv-cloud img {
    width: 400px;
    height: auto;
}

/* 2. ゆらゆら動く小雲の配置設定 */
.recruit__bgCloud {
    position: absolute;
    display: block;
    width: 105px;
    height: auto;
    will-change: transform;
}

/* PC：小雲の配置調整（数値維持） */
.recruit__bgCloud--1 {
    left: 30%;
    top: 11%;
    animation: svcCloud1 5.0s ease-in-out infinite;
}

.recruit__bgCloud--2 {
    right: 30%;
    top: 45%;
    animation: svcCloud2 4.6s ease-in-out infinite;
}

/* --- アニメーション定義 --- */
@keyframes svcCloud1 {
    0% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(10px, -6px, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

@keyframes svcCloud2 {
    0% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(-8px, 8px, 0); }
    100% { transform: translate3d(0, 0, 0); }
}

/* --- Linoの誓い：ユニークコンテナ（デザイン忠実再現・角丸なし） --- */

.vow-container {
    max-width: 1024px;
    margin: 40px auto 0px;
    background: #fff;       /* スクリーンショット通りの白背景 */
    padding: 80px 120px;      /* 左右余白を少し広めに確保 */
    border-radius: 0;        /* 角丸なし：完全な直線 */
}

/* メインタイトル部分（フレーム重ね） */
.vow-main-title {
    text-align: center;
    margin-bottom: 80px;
}

.vow-main-title__sub {
    font-size: 16px;
    color: #d95f29;
    margin-bottom: 12px;
    font-weight: bold;
}

.vow-main-title__inner {
    position: relative;
    display: inline-block;
    padding: 10px 40px;
}

.vow-main-title__text {
    font-size: 16px;
    color: #d95f29;         /* 画像通りのオレンジ系 */
    position: relative;
    z-index: 2;
    margin: 0;
    font-weight: bold;
    line-height: 1.4;
    padding: 0 20px 5px;
}

.vow-main-title__frame {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto;
    z-index: 1;
}

/* 誓いコンテンツのグリッドレイアウト（2カラム） */
.vow-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 100px 120px;
}

.vow-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.vow-item__illust {
    width: 100%;
    max-width: 120px;
    margin-bottom: 0px;
}

.vow-item__illust img {
    width: 100%;
    height: auto;
}

.vow-item__title {
    font-size: 16px;
    font-weight: bold;
    color: #e87a4b;
    line-height: 2;
    margin-bottom: 0px;
}

main p.vow-item__text {
    font-size: 14px;
    line-height: 2;
    text-align: justify;
}

/* --- レスポンシブ設定 --- */

@media (max-width: 1024px) {
  .recruit-wrapper{
    padding-bottom: 0px;
  }

  .recruit-container {
        padding: 20px 20px 0;
    }

    .recruit__bgCloud--1 { left: 2%; top: 5%; width: 90px; }
    .recruit__bgCloud--2 { right: 4%; top: 35%; width: 90px; }

    .vow-container {
        margin: 30px 20px 60px;
        padding: 50px 20px;
    }

    .vow-main-title {
        margin-bottom: 50px;
    }

    .vow-main-title__text {
        font-size: 20px;
    }

    .vow-grid {
        grid-template-columns: 1fr;
        gap: 70px;
    }

    .vow-item__text {
        font-size: 14px;
        line-height: 2;
    }
}

/* --- 採用までの流れ（リクルート専用クラス） --- */

.recruit-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 0 100px;
}

.rc-flow-item {
    position: relative;
    width: 573px; /* ユーザー指定の横幅 */
    margin-bottom: 0px;
}

.rc-flow-item__bg {
    width: 100%;
}

.rc-flow-item__bg img {
    width: 100%;
    height: auto;
    display: block;
}

/* テキストをPNG画像の中央に配置 */
.rc-flow-item__content {
    position: absolute;
    top: 43%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    padding: 0 30px;
    text-align: center;
    z-index: 2;
}

.rc-flow-title {
    font-size: 18px;
    color: #6984be; 
    margin-bottom: 15px;
    font-weight: bold;
}

main p.rc-flow-text {
    font-size: 14px;
    line-height: 1.45;
    text-align: justify;
    display: inline-block;
    margin-top: 0;
    letter-spacing: 0;
}

/* 小雲のアニメーション設定 */
.flow-cloud-small {
    position: absolute;
    width: 105px;
    pointer-events: none;
    z-index: 1;
}

.flow-cloud-small--1 { top: 15%; right: 10%; animation: svcCloud1 5s ease-in-out infinite; }
.flow-cloud-small--2 { top: 45%; left: 8%; animation: svcCloud2 4.6s ease-in-out infinite; }

/* --- レスポンシブ（SP） --- */

@media (max-width: 1024px) {
    .recruit-container-rs {
        padding: 20px 0px 0;
    }

    .u-pc-only { display: none !important; }

    .recruit-flow {
        padding: 40px 0px 30px;
    }

    .rc-flow-item {
        width: 100%;
        margin-bottom: -10px;
    }

    .rc-flow-item__content {
        padding: 0 40px;
    }
  main p.rc-flow-text {
      font-size: 14px;
      line-height: 1.45;
      margin-top: 0;
      letter-spacing: -1px;
  }


    .rc-flow-title { font-size: 17px; }
    .rc-flow-text { font-size: 13px; }
}

/* --- 職員募集セクション 確定版 --- */

.bg-cream-pb {
    padding: 0px 0 100px;
}

.recruit-jobs{
  margin-top: 80px;
}

/* 白いカード：w600pxに固定 */
.job-card {
    background: #fff;
    padding: 10px 40px; 
    width: 600px;       /* PC版固定幅 */
    margin: 0 auto 40px; /* カード間の余白 */
}

.job-card:last-child {
    margin-bottom: 0;
}

.job-info {
    display: flex;
    flex-wrap: wrap;
    font-size: 14px; 
    line-height: 1.6;
    margin: 0;
}

/* 基本の罫線設定 */
.job-info dt,
.job-info dd {
    border-bottom: 1px solid #c7b299; /* 指定の罫線色 */
    padding: 10px 0;
    display: flex;
    align-items: start;
}

.job-info dt {
    width: 90px; /* 項目名の幅を固定 */
    font-weight: bold;
    padding-left: 10px;
}

.job-info dd {
    width: calc(100% - 90px);
    padding-left: 0px;
    margin: 0;
    font-weight: bold;
  }

/* 【修正ポイント】
   募集項目が複数あるカードの「最後の線」だけを消す設定 
*/
.job-card .job-info dt:last-of-type,
.job-card .job-info dd:last-of-type {
    border-bottom: none;
}

/* 【修正ポイント】
   募集停止中のカード（job-emptyがある場合）は、
   上の「募集職種」に必ず線を残すように上書き 
*/
.job-card:has(.job-empty) .job-info dt,
.job-card:has(.job-empty) .job-info dd {
    border-bottom: 1px solid #c7b299 !important;
}

/* 募集なし時のテキストスタイル */
main p.job-empty {
    width: 100%;
    padding: 0px 0 10px 10px;
    font-size: 14px;
    font-weight: bold;
    text-align: justify;
    margin: 0;
}

/* --- レスポンシブ（SP） --- */

@media (max-width: 1024px) {
    .recruit-jobs {
      margin-top: 40px;
  }
    .job-card {
        width: 100%; /* スマホでは画面幅に合わせる */
        padding: 20px 10px;
    }
    
    .job-info dt { width: 80px; }
    .job-info dd { width: calc(100% - 80px); padding-left: 0px;  }
}


.contact {
    position: relative;
    overflow: hidden;
}

/* 共通のエッジスタイル */
.contact__edge {
    position: absolute;
    left: 0;
    width: 100%;
    height: 8px;
    background-repeat: repeat-x; /* 横方向にリピート */
    background-size: auto 100%;
    z-index: 5;
    pointer-events: none; /* クリックを邪魔しないように設定 */
}

/* 上：前のセクションの色（クリーム色）のPNG */
.contact__edge--top {
    top: 0;
    background-image: url('./img/brush-line-top.png'); 
}

/* 下：次のセクションの色（白など）のPNG */
.contact__edge--bottom {
    bottom: -1px; 
    background-image: url('./img/brush-line-bottom.png');
}

@media (max-width: 1024px) {
    .contact__edge {
        height: 8px;
    }
}


.br-pc{
  display: block;
}

.br-sp{
  display: none;
}

@media (max-width: 1024px) {
  .br-pc{
  display: none;
  }

  .br-sp{
  display: block;
  }



}