@charset "utf-8";
/* ==========================================
   Base Styles & Variables
   ========================================== */
:root {
  --color-primary: #1a2744;
  --color-primary-dark: #0f1829;
  --color-primary-light: #2a3a5c;
  --color-accent: #c41e3a;
  --color-accent-hover: #a01830;
  --color-text: #1B1D22;
  --color-text-light: #666666;
  --color-text-muted: #888888;
  --color-white: #FFFFFF;
  --color-gray-light: #f7f7f7;
  --color-gray: #eeeeee;
  --color-gray-border: #e0e0e0;
  --color-navy: #002240;
  --color-navy-light: #0D4577;
  --color-gold: #D3B17D;
  --color-red: #AA0000;
  --font-serif: 'Noto Serif JP', serif;
  --font-sans: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif;
  --transition: 0.3s ease;
  --transition-fast: 0.15s ease;
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 1rem rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
  --focus-ring: 0 0 0 3px rgba(26, 39, 68, 0.3);
  --border-radius-sm: 4px;
  --border-radius-md: 8px;
  --border-radius-lg: 30px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  width: 100%;
  min-width: 100%;
}
body {
	font-family: var(--font-sans);
	font-weight: 400;
	font-size: clamp(.87rem, 3vw, 1rem);
	line-height: 1.8;
	color: var(--color-text);
	background-color: var(--color-white);
}
a {
	text-decoration: none;
	color: inherit;
	transition: var(--transition);
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
ul {
	list-style: none;
}

/* ==========================================
共通設定
   ========================================== */
@media print, screen and (min-width: 1025px){
	.switch_sp{
		display: none !important;
	}
}
@media screen and (max-width: 1024px){
	.switch_pc{
		display: none !important;
	}
}
@media print, screen and (min-width: 769px){
	.switch_sp_2{
		display: none !important;
	}
}
@media screen and (max-width: 768px){
	.switch_pc_2{
		display: none !important;
	}
}
.disnon{
	display: none !important;
}
.ib{
	display: inline-block;
}

.inner_width_600{
	width: min(90%, 37.5rem);
	margin-left: auto;
	margin-right: auto;
}
.inner_width_800{
	width: min(90%, 50rem);
	margin-left: auto;
	margin-right: auto;
}
.inner_width_1000{
	width: min(90%, 62.5rem);
	margin-left: auto;
	margin-right: auto;
}
.inner_width_1120{
	width: min(90%, 70rem);
	margin-left: auto;
	margin-right: auto;
}
.inner_width_1200{
	width: min(90%, 75rem);
	margin-left: auto;
	margin-right: auto;
}
.inner_width_1400{
	width: min(90%, 87.5rem);
	margin-left: auto;
	margin-right: auto;
}
.inner_width_1500{
	width: min(90%, 93.75rem);
	margin-left: auto;
	margin-right: auto;
}
.width_600{
	max-width: 37.5rem;
	margin-left: auto;
	margin-right: auto;
}
.width_800{
	max-width: 50rem;
	margin-left: auto;
	margin-right: auto;
}
.width_1000{
	max-width: 62.5rem;
	margin-left: auto;
	margin-right: auto;
}
.width_1120{
	max-width: 70rem;
	margin-left: auto;
	margin-right: auto;
}
.width_1200{
	max-width: 75rem;
	margin-left: auto;
	margin-right: auto;
}
.width_1400{
	max-width: 87.5rem;
	margin-left: auto;
	margin-right: auto;
}
.width_1500{
	max-width: 93.75rem;
	margin-left: auto;
	margin-right: auto;
}

.margin_top{ 
	margin-top: min(14vw, 80px) !important;
}
.margin_bottom{
	margin-bottom: min(14vw, 80px) !important;
}
.margin_top_no,
.is-style-margin_top_no{
	margin-top: 0 !important;
}
.margin_top_05,
.is-style-margin_top_05{
	margin-top: .5em !important;
}
.margin_top_1,
.is-style-margin_top_1{
	margin-top: 1em !important;
}
.margin_top_2,
.is-style-margin_top_2{
	margin-top: 2em !important;
}
.margin_top_3,
.is-style-margin_top_3{
	margin-top: 3em !important;
}
.margin_top_4,
.is-style-margin_top_4{
	margin-top: 4em !important;
}
.margin_top_5{
	margin-top: 5em !important;
}
.margin_top_6{
	margin-top: 6em !important;
}
.margin_bottom_no{
	margin-bottom: 0 !important;
}
.margin_bottom_05,
.is-style-margin_bottom_05{
	margin-bottom: .5em !important;
}
.margin_bottom_1{
	margin-bottom: 1em !important;
}
.margin_bottom_2{
	margin-bottom: 2em !important;
}
.margin_bottom_3{
	margin-bottom: 3em !important;
}
.margin_bottom_4{
	margin-bottom: 4em !important;
}
.padding_top{
	padding-top: min(14vw, 80px) !important;
}
.padding_bottom{
	padding-bottom: min(14vw, 80px) !important;
}
.padding_top_no{
	padding-top: 0 !important;
}
.padding_top_1{
	padding-top: 1em !important;
}
.padding_top_2{
	padding-top: 2em !important;
}
.padding_top_3{
	padding-top: 3em !important;
}
.padding_bottom_no{
	padding-bottom: 0 !important;
}
.padding_bottom_1{
	padding-bottom: 1em !important;
}
.padding_bottom_2{
	padding-bottom: 2em !important;
}
.padding_bottom_3{
	padding-bottom: 3em !important;
}
.padding_left{
	padding-left: 1em !important;
}

.text_left{
	text-align: left;
}
.text_center{
	text-align: center;
}
.text_right{
	text-align: right;
}
.text_justify{
	text-align: justify;
}

.font_b{
	font-weight: 700;
}
.font_normal{
	font-weight: 400;
}
.font_small{
	font-size: .85em;
}
.red{
  color: var(--color-red);
}
.mincho{
	font-family: var(--font-serif);
}
.gothic{
	font-family: var(--font-sans);
}

a[target="_blank"]:not(:has(img))::after{
	display: inline-block;
	content: "";
	width: 1em;
	height: 1em;
	margin-left: .5em;
	margin-right: .2em;
/*	background: url(../images/common/anchor_arrow.svg) center bottom / 80% no-repeat;*/
	background-color: currentColor;
	mask: url(../images/common/anchor_arrow.svg) center bottom / 80% no-repeat;
}

.text_wrap p{
	margin-top: 1.8em;
}
.text_wrap a:not(.link_button){
	color: #2C81CC;
	text-decoration: underline;
}
.text_wrap a:hover{
	text-decoration: none;
}

.text_wrap .ul,
.text_wrap .ul_mt{
	margin: 1.5em 0 2em;
}
.ul,
.ul_mt{
	padding-left: 1em;
	line-height: 1.4;
}
.ul > li,
.ul_mt > li{
	position: relative;
}
.ul > li::before,
.ul_mt > li::before{
	position: absolute;
	top: calc(.75em - 2px);
	left: -1em;
	content: "";
	width: 4px;
	height: 4px;
	background-color: currentColor;
	border-radius: 50%;
}
.ul > li:nth-of-type(n+2){
	margin-top: .5em;
}
.ul_mt > li:nth-of-type(n+2){
	margin-top: 1em;
}
.ul strong,
.ul_mt strong{
	color: var(--color-navy);
	font-weight: 700;
}

/* フォーカス表示（アクセシビリティ） */
:focus {
  outline: none;
}
.using_keyboard :focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.using_keyboard a:focus,
.using_keyboard button:focus {
  box-shadow: var(--focus-ring);
}

/* ==========================================
   Scroll Animation
   ========================================== */
.scroll_animate {
  opacity: 0;
  transition:
    opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.scroll_animate.fade_up {
  transform: translateY(3.75rem);
}
.scroll_animate.fade_up_subtle {
  transform: translateY(1.875rem);
}
.scroll_animate.fade_scale {
  transform: scale(0.95);
}

/* 柔らかいアニメーション（移動距離短め + スケール） */
.scroll_animate.fade_up_soft {
  transform: translateY(1.875rem) scale(0.98);
}
.scroll_animate.is_visible {
  opacity: 1;
  transform: translateY(0) translateX(0) scale(1);
}

/* 遅延アニメーション - ゆったりとしたカスケード */
.scroll_animate.delay_1 { transition-delay: 0.15s; }
.scroll_animate.delay_2 { transition-delay: 0.3s; }
.scroll_animate.delay_3 { transition-delay: 0.45s; }
.scroll_animate.delay_4 { transition-delay: 0.6s; }
.scroll_animate.delay_5 { transition-delay: 0.75s; }
.scroll_animate.delay_6 { transition-delay: 0.9s; }

@keyframes serviceEntrance {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* スキップリンク（スクリーンリーダー用） */
.skip_link {
	position: absolute;
	top: -100%;
	left: 0;
	background: var(--color-primary);
	color: var(--color-white);
	padding: .5em 1em;
	z-index: 9999;
	transition: top var(--transition-fast);
}
.skip_link:focus {
	top: 0;
}

/* ==========================================
   Header
   ========================================== */
.header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: clamp(70px, 8vw, 100px);
	background: transparent;
	transition: background 0.4s ease, box-shadow 0.4s ease, transform 0.4s ease;
	z-index: 1000;
}
.header.header_hidden:not(.nav_open) {
	transform: translateY(-100%);
}
.header_inner {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	height: 100%;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
.header.scrolled:not(.header_hidden) {
	background: #fff;
	box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
}
.logo{
	line-height: 1;
}
.logo_img {
	width: min(20vw, 100px);
}
.logo_tagline {
	margin-bottom: 6px;
	font-size: 10px;
	font-weight: 500;
	font-family: var(--font-serif);
	letter-spacing: .08em;
	white-space: nowrap;
}

/* ヘッダー右側 電話・メールエリア */
.header_phone,
.header_mail_btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: clamp(6px, 0.8vw, 0.75rem) clamp(0.5rem, 1.2vw, 1.5rem);
	height: clamp(3.8em, 5vw, 76px);
	line-height: 1;
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
	transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease;
	border-radius: var(--border-radius-md);
}
.header_phone {
	background: #fff;
	border: 1px solid #9A9A9A;
}
.header_phone_label {
	font-family: var(--font-serif);
	font-size: .65em;
	font-weight: 500;
}
.header_phone_number {
	font-family: var(--font-serif);
	color: var(--color-navy);
}
.header_phone_time {
	line-height: 1.4;
	font-size: .55em;
	color: var(--color-navy);
}
.header_phone_label,
.header_phone_number,
.header_phone_time,
.header_mail_label,
.header_mail_text,
.header_mail_time {
	transition: color 0.3s ease;
}
.header_phone:hover {
  background: var(--color-navy);
  border-color: var(--color-navy);
}
.header_phone:hover .header_phone_label,
.header_phone:hover .header_phone_time {
  color: #fff;
}
.header_phone:hover .header_phone_number {
  color: var(--color-gold);
}

.header_mail_btn {
	background: var(--color-navy);
	border: 1px solid var(--color-navy);
}
.header_mail_label {
	font-family: var(--font-serif);
	font-size: .65em;
	font-weight: 500;
	color: var(--color-gold);
}
.header_mail_text {
	font-family: var(--font-serif);
	font-size: .92em;
	color: #fff;
}
.header_mail_time {
	line-height: 1.4;
	font-size: .55em;
	color: #fff;
}
.header_mail_btn:hover {
	background: #fff;
	border-color: var(--color-navy);
}
.header_mail_btn:hover .header_mail_label,
.header_mail_btn:hover .header_mail_text,
.header_mail_btn:hover .header_mail_time {
	color: var(--color-navy);
}

/* ==========================================
   Header Menu
   ========================================== */
.nav_list {
	font-family: var(--font-serif);
}
.nav_item a{
	display: block;
}
.nav_item > a,
.nav_item > p {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	font-size: min(1.5vw, .9rem);
	color: var(--color-primary);
	white-space: nowrap;
	cursor: pointer;
	transition: var(--transition);
}
.nav_item.current > a,
.nav_item:has(.current) > :is(a, p){
	color: #2C81CC;
}
.sub_nav_item.current > a{
	text-decoration: underline;
}
.nav_small {
	font-size: .82em;
	color: var(--color-text-muted);
	letter-spacing: 0;
}
.nav_item > :is(a, p):hover{
	opacity: 0.7;
}
.megamenu a:hover {
	text-decoration: underline;
}

.nav_item_service .megamenu_content > li > :is(a, p){
	font-weight: 700;
	font-size: 1.1em;
}

@media (min-width: 1025px) {
	.nav{
		flex: 1 1 auto;
		display: flex;
		align-items: center;
		margin-left: min(2.5vw, 3.5em);
	}
	.nav_list {
		display: flex;
		flex-wrap: wrap;
		gap: min(3vw, 2.5em);
		line-height: 1.4;
	}
	.nav_item > :is(a, p){
		letter-spacing: .05em;
	}
	.header_contact {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		gap: .5em;
		margin-left: auto;
	}

	/* ヘッダー右側 電話・メールエリア */
	.header_phone,
	.header_mail_btn {
		width: min(13vw, 160px);
		font-size: clamp(.8rem, 1.6vw, 1.2rem);
	}

	/* ==========================================
	   Mega Menu
	   ========================================== */
	.megamenu {
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		background-color: #D5DEE9;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-10px);
		transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
		z-index: 999;
	}
	.has_megamenu:hover .megamenu,
	.megamenu:hover {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}
	.megamenu_inner{
		width: min(95%, 1200px);
		margin-left: auto;
		margin-right: auto;
		padding-top: 2.5rem;
		padding-bottom: 2.5rem;
		display: flex;
		align-items: flex-start;
		gap: min(7vw, 6em);
	}
	.nav_item_company .megamenu_inner{
		padding-top: 5rem;
		padding-bottom: 5rem;
	}
	.megamenu_title {
		font-size: 1.5em;
		font-weight: 400;
		line-height: 1;
	}
	.megamenu_subtitle {
		display: block;
		font-size: .6em;
		line-height: 2;
		letter-spacing: .5em;
	}
	.megamenu_content {
		display: flex;
		align-items: flex-start;
		gap: 2.5em;
	}
	.megamenu_list {
	  font-size: .8em;
	}
	.megamenu_list li {
		margin-top: 1.25em;
	}
	.sub_nav_item.nav_item_print .megamenu_list{
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0 3em;
	}

	/* メガメニュー オーバーレイ */
	body::before {
		position: fixed;
		top: clamp(70px, 8vw, 100px);
		left: 0;
		content: '';
		width: 100%;
		height: calc(100% - clamp(70px, 8vw, 100px));
		background: rgba(0, 0, 0, 0.4);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.3s ease, visibility 0.3s ease;
		z-index: 900;
		pointer-events: none;
	}
	body.megamenu_active::before {
		opacity: 1;
		visibility: visible;
	}
}

/* ヘッダーナビゲーション切り替え（1024px）
   タブレット幅でハンバーガーメニューに切り替え */
@media (max-width: 1024px) {
	.header_inner {
		width: 96%;
		position: relative;
	}
	.nav_logo_wrap{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		width: 96%;
		height: clamp(70px, 8vw, 100px);
		margin-left: auto;
		margin-right: auto;
	}

	/* ハンバーガーメニュー表示 */
	.hamburger {
		position: absolute;
		right: 0;
		top: 50%;
		width: 60px;
		height: 60px;
		background: none;
		border: none;
		cursor: pointer;
		transform: translateY(-50%);
		z-index: 1001;
	}
	.hamburger_item {
		position: absolute;
		left: 50%;
		display: block;
		width: 24px;
		height: 2px;
		background: var(--color-text);
		translate: -50% 0;
		transition: transform 0.3s ease, opacity 0.3s ease;
	}
	.item1 {
		top: calc(50% - 9px);
	}
	.item2 {
		top: calc(50% - 1px);
	}
	.item3 {
		top: calc(50% + 8px);
	}
	.nav_open .hamburger_item.item1 {
		transform: rotate(45deg) translate(6px, 6px);
	}
	.nav_open .hamburger_item.item2 {
		opacity: 0;
	}
	.nav_open .hamburger_item.item3 {
		transform: rotate(-45deg) translate(6px, -6px);
	}

	.nav{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #f7f5f0;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		z-index: 100;
		transition: opacity 350ms ease/*, visibility 350ms ease*/;
	}
	.nav_open .nav {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transition-duration: 500ms;
		max-height: 100%;
		overflow-y: auto;
	}
	.nav_list {
		border-top: 1px solid #E5E5E5;
	}
	.nav_item {
		border-bottom: 1px solid #E5E5E5;
	}
	.nav_item > a,
	.nav_item > p {
		flex-direction: row;
		justify-content: flex-start;
		column-gap: 1em;
		flex-wrap: wrap;
		width: 100%;
		padding: 1em 3%;
		font-size: clamp(.85rem, 4.5vw, 1.5rem);
		transition: background 0.3s ease;
	}

	.header_contact{
		margin: 2em 3%;
	}
	.header_phone,
	.header_mail_btn{
		font-size: min(10vw, 1.3rem);
	}
	.header_mail_btn{
		margin-top: .5em;
	}

	/* メガメニュー */
	.nav_list{
		background-color: #f7f5f0;
	}
	.has_megamenu {
		position: relative;
	}
	.has_megamenu::after {
		position: absolute;
	}
	.has_megamenu > :is(a, p){
		position: relative;
		cursor: pointer;
	}
	.has_megamenu > :is(a, p)::before{
		position: absolute;
		top: 50%;
		right: 1em;
		content: "";
		width: 11px;
		height: 1px;
		background-color: var(--color-text);
	}
	.has_megamenu > :is(a, p)::after{
		position: absolute;
		top: calc(50% - 5px);
		right: calc(1em + 5px);
		content: "";
		width: 1px;
		height: 11px;
		background-color: var(--color-text);
		transition: opacity .2s;
	}
	.has_megamenu.is_open > :is(a, p)::after{
		opacity: 0;
	}
	.megamenu{
		display: grid;
		grid-template-rows: 0fr;
		background: #eeebe4;
		overflow: hidden;
		transition: grid-template-rows 0.5s ease;
	}
	.megamenu_inner{
		min-height: 0;
	}
	.has_megamenu.is_open .megamenu{
		grid-template-rows: 1fr;
	}
	.megamenu_title{
		display: none;
	}
	.sub_nav_item :is(a, p){
		padding: 1em 5%;
		color: #666;
	}
	.megamenu_content > .sub_nav_item:has(.megamenu_list) > :is(a, p){
		padding-bottom: .5em;
	}
	.megamenu_list {
	  font-size: .9em;
	}
}
@media (max-width: 600px) {
	.header_inner,
	.nav_logo_wrap{
		margin-right: 0;
	}
}

/* ==========================================
   Contact Section
   ========================================== */
.contact_section {
	margin: clamp(4em, 10vw, 8em) min(5vw, .75em) min(5vw, .75em);
	padding: clamp(1.5em, 4vw, 3.5em) 0;
	background: var(--color-navy);
	border-radius: clamp(4px, .4vw, 8px);
}
.service_title,
.data_title,
.blog_title,
.contact_title{
	font-family: var(--font-serif);
	font-size: min(12vw, 3.8em);
	font-weight: 200;
	line-height: 1.2;
	letter-spacing: .12em;
}
.contact_title{
	color: #fff;
}

/* メールフォームカード */
.contact_card {
	padding: 2em min(5vw, 2em);
	background: #fff;
	border-radius: clamp(4px, .4vw, 8px);
}
.contact_card_mail,
.contact_cards_row{
	margin-top: 1em;
}
.contact_card_mail {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: clamp(1.5em, 3vw, 2.5em);
}
.contact_card_title {
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: 1.15em;
	line-height: 1.4;
}
.contact_card_mail .contact_card_title{
	font-family: var(--font-serif);
	color: var(--color-red);
}
.contact_card_desc {
	font-size: .9em;
}
.contact_card_mail .contact_card_desc{
	margin-top: .5em;
}
.contact_card_btn {
	position: relative;
	display: block;
	padding: clamp(1em, 2vw, 1.5em) 0 clamp(.9em, 1.8vw, 1.4em);
	min-width: min(100%, 28em);
	text-decoration: none;
	text-align: center;
	color: var(--color-red);
	background: #fff;
	border: 2px solid var(--color-red);
	border-radius: clamp(6px, .6vw, 8px);
	transition: background 0.4s ease, border-color 0.4s ease;
}
.contact_card_btn_text {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6em;
	line-height: 1.4;
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: min(4vw, 1.1em);
	white-space: nowrap;
	transition: transform .5s;
}
.contact_card_btn_text::before {
	content: "\2192";
	transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.contact_card_btn_time {
	font-size: .9em;
}
.contact_card_btn::after {
  content: '';
  position: absolute;
  bottom: clamp(0.5rem, 1vw, 0.75rem);
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 50%;
  height: 1px;
  background: #FFFFFF;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);	
}
.contact_card_btn:hover {
  color: #FFFFFF;
  background: var(--color-red);
}
.contact_card_btn:hover::after {
  transform: translateX(-50%) scaleX(1);
}
.contact_card_btn:hover .contact_card_btn_text {
  transform: translateX(-.8em);
}
.contact_card_btn:hover .contact_card_btn_text::before {
    opacity: 0;
    transform: scaleX(5) scaleY(0);
}

/* 2つの電話カード */
.contact_cards_row {
	display: flex;
	gap: .75em;
}
.contact_tel_card {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: .5em;
}
.contact_tel_card .contact_card_title {
	color: var(--color-navy);
}
.contact_tel_box {
	display: block;
	margin-top: auto;
	padding: clamp(.8em, 1.8vw, 1.3em) 0 clamp(.7em, 1.6vw, 1.2em);
	text-align: center;
	text-decoration: none;
	color: var(--color-navy);
	background: #FFFAF1;
	border: 1px solid var(--color-gold);
	border-radius: clamp(6px, .6vw, 8px);
	transition: background 0.3s ease, border-color 0.3s ease;
}
.contact_tel_number,
.contact_tel_box .contact_card_btn_time{
	transition: color 0.3s ease;
}
.contact_tel_number {
	line-height: 1.4;
	letter-spacing: .1em;
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: min(5.8vw, 1.6em);
}
.contact_tel_box:hover {
	background: var(--color-navy);
	border-color: var(--color-navy);
}
.contact_tel_box:hover .contact_tel_number {
	color: var(--color-gold);
}
.contact_tel_box:hover .contact_card_btn_time {
	color: #fff;
}

.contact_note {
	margin-top: 1.5em;
	line-height: 1.6;
	font-size: .9em;
	color: #fff;
}

@media (max-width: 900px) {
	.contact_card_mail {
		flex-direction: column;
		align-items: stretch;
	}
	.contact_cards_row {
		flex-direction: column;
	}
}

/* ==========================================
   Footer
   ========================================== */
.footer{
	padding: clamp(2.5em, 4vw, 3.5em) 0;
	color: #FFF;
	background: #2D2D2D;
}
.footer a:hover:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}
.footer_nav{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1.25em;
	line-height: 1.2;
	font-family: var(--font-serif);
	font-size: min(1.4vw, .9em);
}
.footer_nav_group {
	display: flex;
	align-items: flex-start;
	gap: 1em;
}
.footer_nav_sub {
	display: flex;
	flex-direction: column;
	gap: 1em;
}
.footer_nav_group .footer_nav_sub a {
	color: #AFAFAF;
}
.footer_nav_sub a:hover {
	color: #FFF;
}

/* 会社情報 */
.footer_company{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1em clamp(2em, 4vw, 3em);
	margin: min(10vw, 2.5em) 0;
	padding: min(10vw, 2.5em) 0;
	border-top: 1px solid #CECDCC;
	border-bottom: 1px solid #CECDCC;
}
.footer_logo{
	width: clamp(100px, 10vw, 140px);
	height: auto;
	filter: brightness(0) invert(1);
	flex-shrink: 0;
}
.footer_company_info{
	font-size: .9em;
	line-height: 2;
}

/* コピーライトエリア */
.footer_bottom{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 1em;
}
.footer_copyright{
	color: #AFAFAF;
	margin-right: auto;
}
.footer_external_link_item{
	font-size: .9em;
	color: #AFAFAF;
}
@media screen and (max-width: 768px){
	.footer_nav{
		flex-direction: column;
		font-size: 1em;
	}
	.footer_nav_group{
		flex-direction: column;
	}
	.footer_nav_group .footer_nav_sub{
		padding-left: 1em;
		font-size: .9em;
	}
	.footer_bottom{
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
	}
}

/* ==========================================
   front-page.php
   ========================================== */

/* ---- Hero Section ---- */
.hero {
	position: relative;
	height: min(100svh, 70vmax);
	padding: clamp(5rem, 9vw, 7.5rem) 0 clamp(3.5rem, 6vw, 5rem);
	font-family: var(--font-serif);
	background: linear-gradient(150deg, #FFFFFF 0%, #F8F9FA 55%, #EFF2F5 100%);
	overflow: hidden;
}

/* 右側画像の横幅と比率から高さを確保。左右はこの領域内に絶対配置する。 */
.hero_inner {
  position: relative;
  width: min(90%, 87.5rem);
	height: 100%;
  margin: 0 auto;
}

.hero_content {
  --hero_text_gap: clamp(1rem, 2.5vw, 1.75rem);
  --hero_row_gap: 2rem;
  --hero_sub_gap: 1.25rem;
  --hero_dot_size: .15em;
  position: absolute;
  z-index: 2;
  opacity: 0;
  animation: heroFadeInUp 1.6s cubic-bezier(0.22, 1, 0.36, 1) 0.4s forwards;
  width: 40%;
  top: 50%;
  left: 0;
  translate: 0 -50%;
}

/* Scroll indicator */
.hero_scroll_indicator {
	position: absolute;
	bottom: 2em;
	left: 50%;
	z-index: 10;
	font-size: .8em;
	text-indent: .05em;
	letter-spacing: .05em;
	color: var(--color-navy);
	transform: translateX(-50%);
	opacity: 0;
	animation: heroAccentReveal 1.3s cubic-bezier(0.22, 1, 0.36, 1) 2.0s forwards;
	cursor: pointer;
}
.hero_scroll_indicator::before {
	position: absolute;
	bottom: calc(100% + 1em);
	left: 50%;
	content: "";
	width: 1px;
	height: 28px;
	background-color: var(--color-navy);
	animation: scroll 2s infinite;
	opacity: .5;
}
@keyframes scroll {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  50% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  51% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

/* ---- 見出し ---- */
.hero_headline {
  position: relative;
  width: max-content;
  padding-bottom: calc(var(--hero_text_gap) + 2px);
  font-weight: 500;
	font-size: clamp(1.625rem, 4.4vw, 3.75rem);
  line-height: 1;
}
.hero_headline_row {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  white-space: nowrap;
}
.hero_headline_row + .hero_headline_row {
  margin-top: var(--hero_row_gap);
}
.hero_hl_kanji,
.hero_hl_emphasis {
  letter-spacing: .1em;
}
.hero_hl_kanji{
  font-weight: 700;
  color: #133355;
}
.hero_hl_particle {
  position: relative;
  font-size: .8em;
}
.hero_hl_small {
  font-size: .8em;
}

/* 見出し下の区切り線（グレー全幅 + 青左2.75rem） */
.hero_headline::before,
.hero_headline::after {
  content: '';
  position: absolute;
  height: 2px;
  transform: scaleX(0);
  transform-origin: left;
  animation: heroLineReveal 1.3s cubic-bezier(0.22, 1, 0.36, 1) 1.1s forwards;
  left: 0;
  bottom: 0;
}
.hero_headline::after {
  width: 100%;
  background: rgba(177, 177, 177, 0.4);
}
.hero_headline::before {
  width: 2.75rem;
  background: rgba(13, 69, 119, 0.4);
  z-index: 1;
}
.hero_sub_text {
  font-size: clamp(0.8125rem, 1.4vw, 1.25rem);
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  letter-spacing: 0.18em;
  margin: 0;
  margin-top: var(--hero_sub_gap);
}
.hero_headline + .hero_sub_text {
	line-height: 2;
}

/* ドット */
.hero_hl_particle::before {
  content: '';
  width: var(--hero_dot_size);
  height: var(--hero_dot_size);
  background: #133355;
  border-radius: 50%;
  position: absolute;
  bottom: 100%;
  left: 50%;
  translate: -50% 0;
}

/* ---- 右: 画像エリア ---- */
.hero_composite {
  position: absolute;
  aspect-ratio: 778 / 623;
  top: 50%;
  right: 0;
  translate: 0 -50%;
  width: calc(60% - clamp(1.5rem, 3vw, 3rem));
	container-type: size; /* 高さ .hero_badge_web::before */
}

/* 背景の同心円 SVG */
.hero_circles_svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
  overflow: visible;
}
.hero_svg_circle {
  fill: none;
  stroke-linecap: round;
}

/* 外円（青）: 周長 ≈ 1659  2.4s で描画 */
.hero_svg_circle_1 {
  stroke: rgba(13, 69, 119, 0.35);
  stroke-width: 1;
  stroke-dasharray: 1659;
  stroke-dashoffset: 1659;

  animation: heroDrawCircle 3.1s cubic-bezier(0.4, 0, 0.2, 1) 0.3s forwards;
}

/* 中円（金）: 周長 ≈ 1370  2.0s で描画 */
.hero_svg_circle_2 {
  stroke: rgba(211, 177, 125, 0.45);
  stroke-width: 1;
  stroke-dasharray: 1370;
  stroke-dashoffset: 1370;
  animation: heroDrawCircle 2.6s cubic-bezier(0.4, 0, 0.2, 1) 0.65s forwards;
}

/* 内円（青）: 周長 ≈ 1075  1.6s で描画 */
.hero_svg_circle_3 {
  stroke: rgba(13, 69, 119, 0.3);
  stroke-width: 1;
  stroke-dasharray: 1075;
  stroke-dashoffset: 1075;
  animation: heroDrawCircle 2.1s cubic-bezier(0.4, 0, 0.2, 1) 1.0s forwards;
}

@keyframes heroDrawCircle {
  to { stroke-dashoffset: 0; }
}

/* 軌道ドット: 円より少し遅れてフェードイン */
.hero_orbit {
  position: absolute;
  border-radius: 50%;
  left: 50%;
  top: 50%;
  pointer-events: none;
  z-index: 2;
  opacity: 0;
}

.hero_orbit::after,
.hero_orbit::before {
  content: '';
  position: absolute;
  border-radius: 50%;
  left: 50%;
}

/* 上端（0°） */
.hero_orbit::after {
  top: 0;
  transform: translate(-50%, -50%);
}

/* 下端（180°対角） */
.hero_orbit::before {
  bottom: 0;
  transform: translate(-50%, 50%);
}

/* 外円（青）: 42s 時計回り */
.hero_orbit_1 {
  width: 68%;
  aspect-ratio: 1;
  animation: heroOrbit 42s linear infinite, heroFadeOnly 1.6s ease-out forwards;
  animation-delay: -14s, 2.6s;
}
.hero_orbit_1::after,
.hero_orbit_1::before {
  width: 6px;
  height: 6px;
  background: var(--color-navy-light);
  box-shadow: 0 0 0.625rem 4px rgba(13, 69, 119, 0.25);
}
.hero_orbit_1::after  { animation: heroOrbitGlow 42s ease-in-out infinite; animation-delay: -14s; }
.hero_orbit_1::before { animation: heroOrbitGlow 42s ease-in-out infinite; animation-delay: -35s; }

/* 中円（金）: 30s 反時計回り */
.hero_orbit_2 {
  width: 56%;
  aspect-ratio: 1;
  animation: heroOrbitReverse 30s linear infinite, heroFadeOnly 1.6s ease-out forwards;
  animation-delay: -9s, 2.6s;
}
.hero_orbit_2::after,
.hero_orbit_2::before {
  width: 5px;
  height: 5px;
  background: #BA8F4C;
  box-shadow: 0 0 0.625rem 4px rgba(186, 143, 76, 0.25);
}
.hero_orbit_2::after  { animation: heroOrbitGlow 30s ease-in-out infinite; animation-delay: -9s; }
.hero_orbit_2::before { animation: heroOrbitGlow 30s ease-in-out infinite; animation-delay: -24s; }

/* 内円（青）: 20s 時計回り */
.hero_orbit_3 {
  width: 44%;
  aspect-ratio: 1;
  animation: heroOrbit 20s linear infinite, heroFadeOnly 1.6s ease-out forwards;
  animation-delay: -5s, 2.6s;
}
.hero_orbit_3::after,
.hero_orbit_3::before {
  width: 4px;
  height: 4px;
  background: var(--color-navy-light);
  box-shadow: 0 0 0.5rem 3px rgba(13, 69, 119, 0.2);
}
.hero_orbit_3::after  { animation: heroOrbitGlow 20s ease-in-out infinite; animation-delay: -5s; }
.hero_orbit_3::before { animation: heroOrbitGlow 20s ease-in-out infinite; animation-delay: -15s; }

@keyframes heroOrbit {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to   { transform: translate(-50%, -50%) rotate(360deg); }
}
@keyframes heroOrbitReverse {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to   { transform: translate(-50%, -50%) rotate(-360deg); }
}

/* 光を拾うような不規則な輝き */
@keyframes heroOrbitGlow {
  0%   { opacity: 0.1; }
  18%  { opacity: 0.85; }
  42%  { opacity: 0.25; }
  68%  { opacity: 0.9; }
  100% { opacity: 0.1; }
}

@media (prefers-reduced-motion: reduce) {
  .hero_orbit { display: none; }
}

/* 画像 */
.hero_img_pc {
  position: absolute;
  top: 0%;
  left: 20.6%;
  width: 55.9%;
  z-index: 3;
  filter: drop-shadow(0 0.625rem 1.75rem rgba(0, 34, 64, 0.14));
  opacity: 0;
  animation: heroFadeInUp 1.3s cubic-bezier(0.22, 1, 0.36, 1) 1.3s forwards;
}
.hero_img_sp {
  position: absolute;
  top: 14.4%;
  right: 8.7%;
  width: 20.5%;
  z-index: 4;
  filter: drop-shadow(0 0.5rem 1.25rem rgba(0, 34, 64, 0.16));
  opacity: 0;
  animation: heroFadeInUp 1.3s cubic-bezier(0.22, 1, 0.36, 1) 1.5s forwards;
}
.hero_img_newsletter {
  position: absolute;
  bottom: 1.3%;
  left: 0%;
  width: 58.6%;
  z-index: 2;
  filter: drop-shadow(0 6px 1.25rem rgba(0, 0, 0, 0.10));
  opacity: 0;
  animation: heroFadeInUp 1.3s cubic-bezier(0.22, 1, 0.36, 1) 1.65s forwards;
}
.hero_img_cover {
  position: absolute;
  bottom: 0%;
  left: 53.3%;
  width: 34.6%;
  z-index: 3;
  filter: drop-shadow(0 6px 1rem rgba(0, 0, 0, 0.10));
  opacity: 0;
  animation: heroFadeInUp 1.3s cubic-bezier(0.22, 1, 0.36, 1) 1.8s forwards;
}

/* バッジ共通 */
.hero_badge {
  position: absolute;
  width: clamp(5.5rem, 9.6vw, 8.25rem);
  height: clamp(5.5rem, 9.6vw, 8.25rem);
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  z-index: 10;
  box-shadow: 0 4px 1rem rgba(0, 0, 0, 0.08);
  opacity: 0;
  animation: heroFadeInUp 1.8s cubic-bezier(0.22, 1, 0.36, 1) 2.3s forwards;
  container-type: inline-size;
}
.hero_badge_web {
  top: 6.6%;
  left: 17.2%;
  border: 1px solid var(--color-navy-light);
}
.hero_badge_print {
  top: 76.2%;
  left: 83%;
  border: 1px solid #BA8F4C;
}
.hero_badge_icon_wrap {
  width: clamp(1.75rem, 2.9vw, 2.5rem);
  height: clamp(1.75rem, 2.9vw, 2.5rem);
}
.hero_badge_icon_wrap svg {
  width: 100%;
  height: 100%;
}
.hero_badge_text {
  font-size: 11.6cqw;
  font-weight: 700;
  color: var(--color-navy-light);
  text-align: center;
  line-height: 1;
  letter-spacing: 0.1em;
  margin: 0;
}
.hero_badge_print .hero_badge_text {
  color: #BA8F4C;
}

/* 接続線: バッジと同タイミングで登場 */
.hero_badge_web::before{
	position: absolute;
	top: 13.4cqh;
	top: 100%;
	left: 45%;
	content: "";
	width: 1px;
	height: 19.7cqh;
	height: calc(33.1cqh - clamp(5.5rem, 9.6vw, 8.25rem)); /* 19.7cqh + 13.4cqh */
	background-color: var(--color-navy-light);
  animation: heroFadeOnly 1.8s ease-out 2.3s forwards;
}
.hero_badge_web::after{
	position: absolute;
	top: calc(100% + 33.1cqh - clamp(5.5rem, 9.6vw, 8.25rem));
	left: calc(45% - 1px);
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: var(--color-navy-light);
  animation: heroFadeOnly 1.8s ease-out 2.3s forwards;
}
.hero_badge_print::before{
	position: absolute;
	top: 45%;
	right: 100%;
	content: "";
	width: 39%;
	height: 1px;
	background-color: #BA8F4C;
  animation: heroFadeOnly 1.8s ease-out 2.3s forwards;
}
.hero_badge_print::after{
	position: absolute;
	top: calc(45% - 1px);
	right: calc(139% - 2px);
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: #BA8F4C;
  animation: heroFadeOnly 1.8s ease-out 2.3s forwards;
}

/* MV表示アニメーション */
@keyframes heroFadeInUp {
	0% {
	  opacity: 0;
	  transform: translateY(1.5rem);
	}
	100% {
	  opacity: 1;
	  transform: translateY(0);
	}
}

@keyframes heroFadeOnly {
	0% {
	  opacity: 0;
	}
	100% {
	  opacity: 1;
	}
}

@keyframes heroAccentReveal {
	0% {
	  opacity: 0;
	  transform: translateX(-50%) translateY(0.625rem);
	}
	100% {
	  opacity: 1;
	  transform: translateX(-50%) translateY(0);
	}
}

@keyframes heroLineReveal {
  0% {
    transform: scaleX(0);
    transform-origin: left;
  }
  100% {
    transform: scaleX(1);
    transform-origin: left;
  }
}

@media (max-width: 768px) {
  .hero {
	height: min(100svh, 220vmin);
	padding-top: clamp(6.875rem, 19vw, 8.25rem);
  }
  .hero_content {
    --hero_text_gap: 0.875rem;
    --hero_row_gap: 0.875rem;
    --hero_sub_gap: 0.625rem;
    position: relative;
    top: auto;
    translate: none;
    width: fit-content;
    max-width: 100%;
    margin: 0 auto;
  }
  .hero_headline_row {
    gap: 4px;
  }
  .hero_headline {
    font-size: min(8.5vw, 2.625rem);
  }
  .hero_sub_text {
    font-size: min(4vw, 1rem);
    letter-spacing: 0.12em;
  }
  .hero_composite {
    width: 100%;
    aspect-ratio: 390 / 480;
    margin-top: clamp(1.25rem, 4svh, 3rem);
    margin-bottom: 0;
    position: relative;
    top: auto;
    left: auto;
    margin-left: 0;
    translate: none;
  }
  .hero_circles_svg {
    transform: scale(1.36);
    transform-origin: center;
  }
  .hero_orbit_1 {
    width: 92%;
  }
  .hero_orbit_2 {
    width: 76%;
  }
  .hero_orbit_3 {
    width: 60%;
  }
  .hero_img_pc {
    width: 61.5%;
    left: 4.1%;
    top: 10%;
  }
  .hero_img_sp {
    width: 22.8%;
    left: 57.9%;
    right: auto;
    top: 21.9%;
  }
  .hero_img_newsletter {
    width: 63.6%;
    left: -2.3%;
    bottom: auto;
    top: 48.1%;
  }
  .hero_img_cover {
    width: 44.6%;
    left: 52.8%;
    bottom: auto;
    top: 51.9%;
  }
  .hero_badge_web::before,
  .hero_badge_web::after,
  .hero_badge_print::before,
  .hero_badge_print::after{
    content: none;
  }
  .hero_badge {
    width: 4.25rem;
    height: 4.25rem;
    gap: 3px;
  }
  .hero_badge_web {
    left: auto;
    right: 1%;
    top: 36%;
  }
  .hero_badge_print {
    left: 2.6%;
    right: auto;
    top: 76%;
  }
  .hero_badge_icon_wrap {
    width: 1.375rem;
    height: 1.375rem;
  }
  .hero_badge_text {
    font-size: 0.5rem;
  }
  .hero_scroll_indicator {
    bottom: 0.75rem;
	}
}

/* ---- Concept Section ---- */

.concept_section{
	padding-top: clamp(5em, 10vw, 12em);
	padding-bottom: 3em;
}
.concept_content{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: clamp(2.5rem, 5vw, 5rem);
}
.concept_title {
	font-family: var(--font-serif);
	font-weight: 500;
	font-size: clamp(1.5rem, 2.5vw, 2.1875rem);
	line-height: 1.7;
	letter-spacing: 0.26em;
	color: var(--color-navy);
	flex-shrink: 0;
	width: clamp(17.5rem, 30vw, 26.375rem);
}
.concept_text {
	flex: 1;
	max-width: 100%;
	padding-top: 3.25em;
	padding-bottom: 3em;
	font-size: clamp(1em, 1.3vw, 1.125rem);
	line-height: 4;
	letter-spacing: 0.2em;
	white-space: normal;
}
#history .concept_text{
	padding-top: 4em;
	padding-bottom: 4em;
	line-height: 2.5;
}

@media (max-width: 768px) {
	.concept_section,
	#front_main .service_container,
	.data_container,
	.blog_section{
		max-width: 360px;
	}
	#history{
		padding-top: 1em;
	}
	.concept_content{
		flex-direction: column;
		gap: 1em;
	}
	.concept_title {
		width: 100%;
		font-size: 1.5rem;
		font-weight: 700;
		line-height: 180%;
		letter-spacing: 0.2em;
		color: var(--color-navy);
	}
	.concept_text,
	#history .concept_text{
		padding-top: 1em;
		line-height: 2.8;
	}
}

/* ---- Service Section　商品紹介 ---- */

#front_main .service_section {
	padding-top: clamp(5em, 10vw, 12em);
	padding-bottom: clamp(5em, 10vw, 12em);
	z-index: 1;
}
.service_label {
	font-family: var(--font-serif);
	font-weight: 500;
	font-size: min(6vw, 1.5em);
	letter-spacing: .24em;
	color: var(--color-gold);
}
.service_title {
	color: var(--color-gold);
}
.service_description {
	margin-top: .5em;
	font-weight: 200;
}

/* サービス画像クロスフェード */
.service_images_crossfade {
	position: relative;
	width: 100%;
	height: min(60vh, 520px);
	overflow: hidden;
}
.service_images_crossfade .service_img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* 2枚目は下に待機 */
.service_images_crossfade .service_img_2 {
	transform: translateY(100%);
	z-index: 2;
}

.service_category{
	font-family: var(--font-serif);
}
.service_category_title {
	position: relative;
	font-size: min(6vw, 1.5em);
	letter-spacing: .2em;
	padding-bottom: .7em;
	color: var(--color-navy);
	border-bottom: 1px solid;
}
#print_content{
	margin-top: min(10vw, 3em);
}
.service_subcategory{
	margin-top: 1.5em;
}
.service_subcategory_title{
	font-size: min(5vw, 1.25em);
	font-weight: 400;
	letter-spacing: .1em;
}

/* 商品紹介ボタン */
.service_items{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2em 1em;
	margin-top: 1em;
}
#print_content .service_items{
	grid-template-columns: repeat(3, 1fr);
}
.service_item{
	display: grid;
	place-content: center;
	align-items: center;
	gap: .5em;
	min-height: clamp(9em, 12vw, 11em);
	padding-left: 1em;
	padding-right: 1em;
	color: #fff;
	background: var(--color-navy-light);
	border-radius: var(--border-radius-md);
}
.service_item:hover{
	background: #1a5a9e;
	box-shadow: 0 8px 24px rgba(13, 69, 119, 0.4);
	transform: translateY(-4px);
}
.service_item_icon{
	width: 84px;
	height: 84px;
	object-fit: contain;
	filter: brightness(0) invert(1);
}
.service_item_name{
	line-height: 1.5;
	font-size: .9em;
	font-weight: 500;
	letter-spacing: .15em;
}
.service_item_row{
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 1em;
	min-height: calc(68px + 2em);
}

.service_img_print_sp{
	display: block;
	width: 100%;
	height: 10rem;
	margin-bottom: 1em;
	aspect-ratio: 4 / 3;
	border-radius: 0.5rem;
	overflow: hidden;
}
.service_img_print_sp img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

@media print, screen and (min-width: 1201px){
	.service_container {
		display: grid;
		grid-template-columns: 1fr 2fr;
		gap: clamp(2rem, 5vw, 100px);
		align-items: start;
		max-width: 100%;
	}
	.service_explanation {
		position: -webkit-sticky;
		position: sticky;
		top: 7.5rem;
	}
	.service_images_crossfade {
		margin-top: 2em;
	}
	.service_item:not(.service_item_row){
		place-items: center;
		text-align: center;
	}
}
@media (max-width: 1200px) {
	.service_explanation {
		display: flex;
		align-items: center;
		gap: 2em;
	}
	.service_category_title::after {
		content: '';
		position: absolute;
		top: 100%;
		left: 0;
		width: 20%;
		height: 1px;
		background: var(--color-gold);
		z-index: 1;
	}
	.service_images_crossfade {
		height: auto;
		aspect-ratio: 4/3;
	}

	.service_content{
		margin-top: 2em;
	}
	.service_items,
	#print_content .service_items{
		grid-template-columns: repeat(2, 1fr);
	}
	.service_item{
		grid-template-columns: min(15vw, 60px) minmax(0, 1fr);
		gap: 1em;
		min-height: calc(60px + 2em);
	}
}
@media (max-width: 768px) {
	.service_explanation {
		flex-direction: column;
	}
	.service_description{
		margin-top: 1.5em;
	}
	.service_img {
		border-radius: var(--border-radius-md);
	}
	.service_img_2{
		display: none;
	}
	.service_images_crossfade{
		height: 160px;
	}
	.service_items,
	#print_content .service_items{
		grid-template-columns: 1fr;
		gap: 1em;
	}
	.service_item_name{
		font-size: 1em;
	}
}

/* SERVICE 色反転 */
#concept, #history, #service{
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transition: background-color 1.5s ease;
}
body.service_bg_active :is(#concept, #history, #service) {
	background: var(--color-navy);
}
body.service_bg_active :is(.concept_title, .concept_text, .service_container, .service_category_title),
body.service_bg_active :is(#concept, #history, #service) .link_button{
	color: #FFF;
}
body.service_bg_active :is(#concept, #history, #service) .link_button::after {
	background-color: #FFF;
}

/* ---- Data Section　商品紹介 ---- */

.data_section {
	color: #FFF;
	background: #2B2B2B;
	border-top: 1px solid #fff;
}
.data_container{
	padding-top: 5em;
    padding-bottom: 5em;
}
.data_description{
	margin-top: 2em;
}
.data_section .link_button{
	color: #fff;
}
.data_section .link_button::after{
	background: #fff;
}

/* 実績カウント */
.data_section .data_stats{
	margin-top: 2.5em;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}
.data_stats{
	font-family: var(--font-serif);
}
.data_stat{
	padding-top: 3em;
	padding-bottom: 3em;
}
.data_stat_title{
	font-size: 1.5em;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	letter-spacing: 0.2em;
}
.data_stat_value{
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap: .5em;
	margin-top: 1em;
	letter-spacing: .05em;
}
.data_stat_number{
	font-size: 4.5em;
	line-height: 1;
	color: var(--color-gold);
}
@media print, screen and (min-width: 769px){
	.data_stats{
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		padding-top: 1.5em;
		padding-bottom: 1.5em;
	}
	.data_stat {
		padding-top: 2em;
		padding-bottom: 2em;
	}
	.data_stats .data_stat:nth-of-type(n+2){
		border-left: 1px solid #CECDCC;
	}
	.data_stat_title{
		font-size: min(2vw, 1.5rem);
	}
	.data_stat_number {
		font-size: min(5.1vw, 4.6rem);
	}
}
@media (max-width: 768px) {
	.data_stats .data_stat:nth-of-type(n+2){
		border-top: 1px solid #CECDCC;
	}
}


/* ---- Blog Section ---- */

.blog_section{
	padding-top: clamp(5em, 10vw, 12em);
}
.blog_contents {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(1.5em, 3vw, 2.5em);
}
.blog_title {
	color: var(--color-navy);
}
@media (max-width: 768px) {
	.blog_contents {
		grid-template-columns: 1fr;
	}
}


/* ==========================================
   page.php
   ========================================== */
#page_main{
	margin-top: min(14vw, 80px);
}

/* ==========================================
   下層ページ タイトルエリア
   ========================================== */
.page_title_area{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	min-height: calc(clamp(70px, 8vw, 100px) + min(30vw, 200px)); /* header clamp(70px, 8vw, 100px) */
	padding-top: calc(clamp(70px, 8vw, 100px) + .5rem);
	padding-left: min(5vw, 120px);
	padding-right: min(5vw, 120px);
	font-family: var(--font-serif);
}
.page_title{
	line-height: 1;
	font-weight: 200;
	font-size: min(8.7vw, 3.7em);
}
.page_subtitle{
	font-size: min(4.2vw, 1.5em);
	font-weight: 500;
	line-height: 2;
	letter-spacing: .24em;
}

/* ==========================================
   パンくずリスト
   ========================================== */
.breadcrumb_list {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-wrap: wrap;
	padding: min(5vw, 3em) min(5vw, 120px) 1em;
	line-height: 1.6;
	font-size: .8em;
	color: #6B6B6B;
	border-bottom: 1px solid #CECDCC;
}
.breadcrumb_item:nth-of-type(n+2)::before{
	content: "-";
	margin-left: 1em;
	margin-right: 1em;
}
.breadcrumb_list a{
/*	text-decoration: underline;*/
}
.breadcrumb_list a:hover {
	text-decoration: underline;
/*	text-decoration: none;*/
}

/* ==========================================
   共通タイトル
   ========================================== */
.section_title{
	position: relative;
	margin-bottom: 1.5em;
	padding-bottom: .5em;
	line-height: 1.4;
	letter-spacing: .2em;
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: 1.5em;
	color: var(--color-navy);
	border-bottom: 1px solid #CECDCC;
}
.section_title::after{
	position: absolute;
	content: '';
	top: 100%;
	left: 0;
	width: min(25%, 100px);
	height: 1px;
	background: var(--color-navy-light);
}

.section_sub_title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-navy);
	margin: 2em 0 1em;
}

/* ==========================================
   共通ボタン
   ========================================== */
.link_button{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6em;
	width: 18em;
	height: max(3.75em, 3.75rem);
	color: var(--color-navy);
	font-family: var(--font-serif);
	font-weight: 500;
	letter-spacing: .08em;
	text-decoration: none;
	border: 1px solid #B1B1B1;
	cursor: pointer;
	overflow: hidden;
	transition: 
		letter-spacing 0.5s cubic-bezier(0.16, 1, 0.3, 1),
		text-indent 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.link_button::before{
	content: "\2192";
	transition:
		opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1),
		transform 0.25s cubic-bezier(0.4, 0, 0.2, 1),
		margin 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.link_button::after{
	position: absolute;
	bottom: 1em;
	left: 2em;
	content: "";
	width: calc(100% - 4em);
	height: 1px;
	background: var(--color-navy);
	transform: scaleX(0);
	transform-origin: right center;
	pointer-events: none;
	transition: transform 0.3s cubic-bezier(0.4, 0, 1, 1);
}
.link_button:hover{
	letter-spacing: 0.12em;
	text-indent: -.8em;
}
.link_button:hover::after{
	transform: scaleX(1);
	transform-origin: left center;
}
.link_button:hover::before{
	opacity: 0;
	transform: scaleX(5) scaleY(0);
}
@media (max-width: 1024px) {
	.link_button {
		width: min(24em, 100%);
	}
	.link_button::before{
		margin-left: -.5em;
	}
	.link_button:hover::before{
		margin-left: 0;
	}
}

/* ==========================================
   FOR VISITOR　はじめての方へ
   ========================================== */
.visitor_intro_title {
	margin-bottom: 1.8em;
	font-family: var(--font-serif);
	font-size: min(5.2vw, 1.75em);
	line-height: 1.6;
	letter-spacing: .2em;
	color: var(--color-navy);
}
.visitor_intro_text {
	line-height: 2.4;
}

/* こんな思いを、抱えていませんか？ */
.visitor_concerns {
	margin-top: min(10vw, 100px);
	padding-top: min(10vw, 100px);
	border-top: 1px solid #CECDCC;
}
.visitor_section_title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1em .5em;
	line-height: 1.4;
	font-family: var(--font-serif);
	font-size: min(5.2vw, 1.75em);
	text-align: center;
	color: var(--color-navy);
}
.visitor_section_title::before,
.visitor_section_title::after{
	content: "";
	width: 2.2em;
	height: 2px;
	background-color: var(--color-navy);
}
/* 吹き出し */
.visitor_concerns_voice{
	margin-top: min(7vw, 3em);
}
.visitor_concerns_voice_item {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: calc(14px + .5em);
	padding: .5em 1em;
	min-height: 5em;
	line-height: 1.4;
	background: #F0F0F0;
	border-radius: 1em;
}
.visitor_concerns_voice_item::after {
	position: absolute;
	right: 2em;
	top: 100%;
	content: '';
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 14px solid #F0F0F0;
}

.visitor_concerns_box {
	margin-top: min(7vw, 3em);
	padding: 1.5em min(5vw, 2.5em);
	font-family: var(--font-serif);
	background: #FFFDF4;
	border-radius: 4px;
}
.visitor_concerns_box_title {
	position: relative;
	margin-bottom: 1em;
	padding-bottom: .5em;
	line-height: 1.4;
	font-size: min(4.8vw, 1.5em);
	border-bottom: 1px solid rgba(0,0,0,.2);
}
@media print, screen and (min-width: 769px){
	.visitor_section_title,
	.visitor_concerns_box_title{
		letter-spacing: .2em;
	}
	.visitor_concerns_voice {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		gap: min(2vw, 2em);
	}
	.visitor_concerns_offset {
		padding-top: 1.5em;
	}
}
@media screen and (max-width: 768px){
	.visitor_section_title{
		flex-direction: column;
	}
	.visitor_section_title::before{
		content: none;
	}
	.visitor_concerns_voice_item{
		max-width: calc(100% - 1em);
	}
	.visitor_concerns_voice_item:nth-of-type(odd){
		margin-left: 1em;
	}
	.visitor_concerns_voice_item:nth-of-type(even)::after{
		left: 2em;
		right: auto;
	}
}

/* 5つの理由 */
.visitor_reasons{
	position: relative;
	z-index: 1;
	margin-top: min(10vw, 100px);
	padding-top: min(15vw, 100px);
	padding-bottom: min(15vw, 120px);
	font-family: var(--font-serif);
	color: #fff;
	background-color: var(--color-navy);
}
.visitor_reasons .visitor_section_title{
	color: #fff;
}
.visitor_reasons .visitor_section_title::before,
.visitor_reasons .visitor_section_title::after{
	background-color: #fff;
}

.visitor_reasons_content{
	position: relative;
	display: grid;
	gap: min(10vw, 4em);
	margin-top: 2em;
	container-type: inline-size;
}
.visitor_reason_item{
	position: relative;
}
.visitor_reason_title{
	line-height: 1.4;
	letter-spacing: .2em;
	font-size: min(5.2vw, 1.4em);
	color: var(--color-gold);
}
.visitor_reason_number{
	margin-right: .2em;
	font-weight: 400;
	letter-spacing: 0;
	font-size: 2.2em;
}
.visitor_reason_text{
	margin-top: 1em;
}
@media print, screen and (min-width: 769px){
	.visitor_reasons_content{
		grid-template-columns: repeat(6, 1fr);
	}
	/* 上段3つ */
	.visitor_reasons_content > :nth-child(1),
	.visitor_reasons_content > :nth-child(2),
	.visitor_reasons_content > :nth-child(3) {
		grid-column: span 2;
	}
	/* 下段2つ */
	.visitor_reasons_content > :nth-child(4),
	.visitor_reasons_content > :nth-child(5) {
		grid-column: span 3;
	}
	.visitor_reasons_content > :nth-child(2)::before,
	.visitor_reasons_content > :nth-child(2)::after{
		position: absolute;
		top: 0;
		content: "";
		width: 1px;
		height: 100%;
		background-color: #fff;
	}
	.visitor_reasons_content > :nth-child(2)::before{
		left: max(-5vw, -2em);
	}
	.visitor_reasons_content > :nth-child(2)::after{
		right: max(-5vw, -2em);
	}
	.visitor_reasons_content > :nth-child(4)::before,
	.visitor_reasons_content > :nth-child(4)::after{
		position: absolute;
		content: "";
		background-color: #fff;
	}
	.visitor_reasons_content > :nth-child(4)::before{
		top: max(-5vw, -2em);
		left: 0;
		width: 100cqw;
		height: 1px;
	}
	.visitor_reasons_content > :nth-child(4)::after{
		top: 0;
		right: max(-5vw, -2em);
		width: 1px;
		height: 100%;
	}
	.visitor_reason_title {
		text-align: center;
		font-size: min(2cqw, 1.5em);
	}
}
@media screen and (max-width: 768px){
	.visitor_reasons_content > :nth-child(n+2){
		padding-top: 1em;
		border-top: 1px solid #fff;
	}
}

/* 実績 */
.visitor_results{
	margin-top: min(15vw, 100px);
}
.visitor_results_desc{
	margin-top: 3em;
	font-size: 1.1em;
	color: #666;
	text-align: center;
}

/* 広報フロー */
.visitor_flow {
	margin-top: min(15vw, 100px);
}
.visitor_flow_steps{
	margin-top: 2em;
	color: #fff;
}
.visitor_flow_steps > :nth-of-type(n+2) {
	margin-top: 10px;
}
.visitor_flow_step.step_1 :is(.visitor_flow_step_number, .visitor_flow_step_content){
	background: #185484;
}
.visitor_flow_step.step_2 :is(.visitor_flow_step_number, .visitor_flow_step_content){
	background: #236E9D;
}
.visitor_flow_step.step_3 :is(.visitor_flow_step_number, .visitor_flow_step_content){
	background: #307DA3;
}
.visitor_flow_step.step_4 :is(.visitor_flow_step_number, .visitor_flow_step_content){
	background: #3C98BD;
}
.visitor_flow_step {
	display: flex;
	align-items: stretch;
	gap: min(1vw, .5em);
}
.visitor_flow_step_number {
	padding: 2em min(3vw, 1em);
	writing-mode: vertical-rl;
	text-orientation: upright;
	line-height: 1;
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: min(5vw, 1.5em);
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1.4em), 50% 100%, 0 calc(100% - 1.4em));
}
/* 最後のステップは矢印なし */
.visitor_flow_step:last-child .visitor_flow_step_number {
	clip-path: none;
}
.visitor_flow_step:is(.step_1, .step_2, .step_4) .visitor_flow_step_number{
	letter-spacing: .75em;
}
.visitor_flow_step .visitor_flow_step_number::first-letter{
	letter-spacing: 0 !important;
}
.visitor_flow_step_content {
	flex: 1;
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	padding: 1.8em clamp(1em, 4vw, 2.5em);
	gap: clamp(1.5em, 4vw, 2.5em);
}
.visitor_flow_step_image {
	width: 200px;
	height: 200px;
	overflow: hidden;
	flex-shrink: 0;
}
.visitor_flow_step_image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.visitor_flow_step_text {
	flex: 1;
}
.visitor_flow_step_title{
	font-family: var(--font-serif);
	font-size: min(5vw, 1.5em);
	letter-spacing: .2em;
}
@media (max-width: 768px) {
	.visitor_flow_steps > :nth-of-type(n+2) {
		margin-top: 1em;
	}
	.visitor_flow_step_content{
		flex-direction: column;
	}
	.visitor_flow_step_content .visitor_flow_step_image {
		order: 2;
	}
	.visitor_flow_step_content .visitor_flow_step_text {
		order: 1;
	}
	.visitor_flow_step_image {
		width: 100%;
		height: 150px;
	}
	.visitor_flow_step_image img {
		object-position: center center;
	}
	.visitor_flow_step.step_3 .visitor_flow_step_image img{
		object-position: center 10%;
	}
	.visitor_flow_step_title{
		letter-spacing: 0;
	}
	.visitor_flow_step_text p br {
		display: none;
	}
}

/* 弁護士の皆様からいただいたお声 */
.visitor_testimonials {
    margin-top: min(15vw, 100px);
	padding-top: min(15vw, 100px);
	padding-bottom: min(15vw, 100px);
	background: #FFFDF4;
	overflow: hidden;
}
.visitor_testimonials_desc{
	color: #666;
}
.visitor_testimonials_slider {
	padding-top: 2px;
	padding-bottom: 2px;
	width: 100%;
	font-size: .9em;
	overflow: hidden;
}
.visitor_testimonials_track {
	display: flex;
	gap: 1em;
	width: max-content;
}
.visitor_testimonials_track_1 {
	animation: scroll-left 60s linear infinite;
}
.visitor_testimonials_track_2 {
	margin-top: min(10vw, 2em);
	animation: scroll-right 60s linear infinite;
}
.visitor_testimonials_track_3 {
	margin-top: min(10vw, 2em);
	animation: scroll-left 60s linear infinite;
}
.visitor_testimonials_track:hover {
	animation-play-state: paused;
}
.visitor_testimonial_card {
	position: relative;
	flex-shrink: 0;
	width: 20em;
	margin-bottom: 1em;
	padding: 1.25em 1.5em;
	min-height: 100px;
	background: #FFF;
	border: 1px solid var(--color-gold);
	border-radius: 1em;
	transition: transform 0.3s ease;
	z-index: 1;
}
.visitor_testimonial_card::before,
.visitor_testimonial_card::after{
	position: absolute;
	content: '';
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
.visitor_testimonial_card::before{
	top: 100%;
	right: 2.5em;
	border-top: 14px solid var(--color-gold);
	z-index: -1;
}
.visitor_testimonial_card::after {
	top: calc(100% - 2px);
	right: 2.5em;
	border-top: 14px solid #fff;
	z-index: 2;
}
.visitor_testimonial_card:hover {
	transform: scale(1.02);
}

@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes scroll-right {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0);
  }
}

@media print, screen and (min-width: 769px){
	.visitor_testimonials_track_1 {
		animation: scroll-left 35s linear infinite;
	}
	.visitor_testimonials_track_2 {
		margin-top: min(10vw, 2em);
		animation: scroll-right 35s linear infinite;
	}
	.visitor_testimonials_track_3 {
		display: none; /* PC: 2列のみ表示 */
	}
}

/* ==========================================
   商品紹介 SERVICE Page Styles
   ========================================== */
.service_intro{
	border-bottom: 1px solid #CECDCC;
}
.service_section_image {
	width: 100%;
	height: clamp(160px, 30vw, 280px);
	overflow: hidden;
}
.service_section_image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

body#service .service_subcategory_title{
	font-weight: 500;
}

.service_cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: min(5vw, 2em);
	margin-top: .5em;
}
.service_card {
	padding: min(4.5vw, 1.8em) min(5vw, 2.25em) min(5.5vw, 2em);
	text-decoration: none;
	transition: background 0.2s ease, transform 0.3s ease, box-shadow 0.3s ease;
	min-height: 14em;
	color: #fff;
	background: var(--color-navy-light);
	border-radius: 8px;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1), -5px -5px 10px rgba(0, 0, 0, 0.1);
}
.service_card:hover {
	background: #1a5a9e;
	transform: translateY(-4px);
	box-shadow: 5px 0.5rem 1rem rgba(0, 0, 0, 0.15), -5px -5px 10px rgba(0, 0, 0, 0.1);
}
.service_card_title{
	display: grid;
	align-items: center;
	grid-template-columns: min(15vw, 84px) minmax(0, 1fr);
	gap: .5em 1em;
	min-height: min(15vw, 84px);
	margin-bottom: 1em;
	padding-bottom: 1em;
	line-height: 1.4;
	letter-spacing: .15em;
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: 1rem;
	border-bottom: 1px solid #fff;
}
.service_card_icon{
	flex-shrink: 0;
	object-fit: contain;
	filter: brightness(0) invert(1);
}
/*.service_card_icon[src$="icon-greeting.svg"] {
	filter: none;
}*/
.service_card_desc{
	font-size: .9em;
}

.service_category {
  margin-bottom: 2.5rem;
}
.service_category:last-child {
  margin-bottom: 0;
}

.service_section_header {
  margin-bottom: 10px;
}

@media (max-width: 480px) {
	.service_card_title{
		grid-template-columns: 1fr;
		place-content: center;
		place-items: center;
	}
	.service_card_icon{
		max-width: 68px;
	}
}
@media (max-width: 768px) {
	.service_cards{
		grid-template-columns: 1fr;
	}
}

/* ==========================================
   商品紹介 SERVICE 子ページ
   ========================================== */
body.single-service .page_title{
	font-weight: 400;
	font-size: min(5.8vw, 2.5em);
}
body.single-service .page_subtitle{
	margin-top: .5em;
	font-size: min(4.2vw, 1.2em);
}

/* 設計事例 */
.service_examples_wrap{
	display: flex;
	justify-content: space-between;
	gap: 1.5em;
}
.service_examples_image{
	display: block;
	border: 1px solid #EEE;
}
.service_examples_caption{
	margin-top: .5em;
}
.service_examples_caption a:hover{
	text-decoration: underline;
}
.service_examples_note{
	margin-top: 1.5em;
	font-family: var(--font-serif);
	font-size: .85em;
	color: #666;
}
@media (max-width: 768px) {
	.service_examples_wrap {
	  flex-direction: column;
	}
}

/* お悩み  */
.concerns_list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(0.75rem, 2vw, 1.6875rem);
	max-width: 1126px;
	margin: 0 auto;
}
.concern_item{
	display: flex;
	flex-direction: column;
	padding: 1.25em 1em;
	background-color: #fff;
	box-shadow: 0 0 16px rgba(0,0,0,.1);
}
.concern_label{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .75em;
	height: 2em;
	font-family: var(--font-serif);
	font-size: 1.25em;
	font-weight: 500;
	letter-spacing: .05em;
	color: var(--color-navy);
}
.concern_label::before,
.concern_label::after{
	content: "";
	width: 1.5em;
	height: 1px;
	background-color: var(--color-navy);
}
.concern_title {
	display: flex;
	align-items: center;
	gap: .75em;
	margin-top: .5em;
	padding: .75em;
	font-family: var(--font-serif);
	background: #E2EEF8;
}
.concern_item .concern_icon{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 42px;
	height: 42px;
	font-size: 32px;
	background: var(--color-navy);
	flex: none;
	color: #FFF;
	font-variation-settings:
	'FILL' 0,
	'wght' 300,
	'GRAD' 0,
	'opsz' 40;
	overflow: hidden;
}
.concern_text {
	line-height: 1.4;
	font-weight: 700;
	color: var(--color-navy);
}
.concern_solution {
	flex: 1;
	position: relative;
	margin-top: calc(18px + 2em);
	padding: 1em;
	font-size: .9em;
	background: #EDF2F4;
}
.concern_solution::before{
	position: absolute;
	right: calc(50% - 10px);
	bottom: calc(100% + 1em);
	content: '';
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 18px solid var(--color-navy);
}
@media (max-width: 768px) {
  .concerns_list {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

/* 制作の流れ */
.flow_steps{
	margin-top: 3em;
}
.flow_step_row{
	position: relative;
	display: grid;
	align-items: baseline;
	grid-template-columns: clamp(calc(52px + 12em), 22vw, 18em) minmax(0, 1fr);
	gap: min(1em, 3vw, 2.5em);
	z-index: 2;
}
.flow_steps .flow_step_row:nth-of-type(n+2){
	padding-top: clamp(1.25em, 3vw, 2.5em);
}
.flow_steps .flow_step_row:nth-last-of-type(n+2)::before{
	position: absolute;
	top: 50px;
	left: 26px;
	content: "";
	width: 1px;
	height: calc(100% + 10px);
	background: #B0893D;
	z-index: -1;
}

.flow_step_title{
	display: flex;
	align-items: center;
	gap: clamp(.5em, 1vw, 1em);
	font-family: var(--font-serif);
}
.flow_step_badge{
	flex: 0 0 52px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 52px;
	height: 52px;
	line-height: 1;
	text-align: center;
	color: #FFF;
	background: #B0893D;
	border-radius: 50%;
}
.flow_badge_step{
	font-size: 10px;
	font-weight: 500;
	letter-spacing: .02em;
}
.flow_badge_num{
	font-size: 24px;
}
.flow_step_name{
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	color: var(--color-navy);
}
.flow_step_details{
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}
.flow_step_details li{
	margin-top: .5em;
	font-size: .9em;
	display: flex;
	align-items: flex-start;
	gap: 0 1em;
}
.flow_detail_label{
  font-weight: 700;
  color: var(--color-navy);
  min-width: 3.5rem;
  flex-shrink: 0;
}
.flow_steps .link_button{
	height: 3em;
}
.link_button::after{
	bottom: .5em;
}
.flow_step_row:not(:last-child) .flow_step_element {
	padding-bottom: clamp(1.25em, 3vw, 2.5em);
	border-bottom: 1px solid #CECDCC;
}
@media (max-width: 768px) {
	.flow_step_badge{
		width: 40px;
		height: 40px;
	}
	.flow_badge_step{
		font-size: 8px;
	}
	.flow_badge_num{
		font-size: 16px;
	}
	.flow_steps .flow_step_row:nth-last-of-type(n+2)::before{
		top: 38px;
		left: 20px;
	}

	.flow_step_row {
		grid-template-columns: 40px 1fr;
	}
	.flow_step_title {
		display: contents;
	}
	.flow_step_name {
		grid-column: 2;
		grid-row: 1;
		align-self: center;
	}
	.flow_step_element {
		grid-column: 2;
		grid-row: 2;
	}
	.flow_step_details li {
		flex-direction: column;
	}
}

/* 制作の流れ 補足画像 */
.flow_step_image {
	margin-bottom: 1.5em;
	max-width: min(100%, 600px);
}

/* 静止画グリッド（スライダーなし） */
.examples_static_grid {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  max-width: 1126px;
  margin: 0 auto;
}
.examples_static_item {
  flex: 1;
  max-width: 22.3125rem;
  overflow: hidden;
}
.examples_static_image {
  width: 100%;
  height: 17.1875rem;
  object-fit: cover;
  display: block;
  background: #EAEBF0;
  box-shadow: 0 2px 0.75rem rgba(0, 0, 0, 0.06);
}
@media (max-width: 768px) {
  .examples_static_grid {
    flex-direction: row;
    gap: 1rem;
    padding: 0 1.25rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .examples_static_grid::-webkit-scrollbar {
    display: none;
  }
  .examples_static_item {
    min-width: 80vw;
    flex-shrink: 0;
    scroll-snap-align: start;
  }
  .examples_static_image {
    height: auto;
    aspect-ratio: 357 / 275;
  }
}

/* スペック */
.spec_item{
	display: flex;
	align-items: center;
	gap: 2.5em;
}
.spec_item_image{
	width: min(30%, 320px);
}
.spec_item_text {
	font-family: var(--font-serif);
}
.spec_item_title{
	font-size: 1rem;
	font-weight: 700;
}
.spec_item_desc{
	margin-top: 1em;
}
.spec_feature{
	background: #EDF2F4;
	padding: min(5vw, 1em);
}
.spec_feature .spec_item_title{
	font-size: 1.2rem;
	color: var(--color-navy);
}

@media (max-width: 768px) {
  .spec_item{
    flex-direction: column;
  }
  .spec_item_image{
    width: 100%;
  }
  .spec_color_note {
    padding: 0;
    font-size: 0.875rem;
  }
}

/* Spec Price Table */
.spec_price_table {
	width: 100%;
	border-collapse: collapse;
	font-family: var(--font-serif);
	line-height: 1.4;
}
.spec_price_table th,
.spec_price_table td {
	padding: .75em min(3vw, 1em);
	font-weight: 400;
	text-align: center;
	border: 1px solid #B1B1B1;
}
.spec_price_table th {
	font-size: calc(.9rem, 2vw, 1.1rem);
	color: #FFFF;
	background: #686868;
}
.spec_price_table td:first-child {
	text-align: left;
	padding-left: min(3vw, 1.5em);
}
.spec_price_table tbody tr {
  background: #FFF;
}
.spec_price_table tbody tr:nth-child(even) {
  background: #EEE;
}

/* 価格例 */
body.single-service{
	container-type: inline-size;
}
.service_pricing{
	position: relative;
	z-index: 1;
}
.service_pricing::before{
	position: absolute;
	top: 0;
	left: 0;
	content: "";
	width: 100cqw;
	height: 100%;
	background-color: #EDF2F4;
	margin-left: calc(50% - 50cqw);
	margin-right: calc(50% - 50cqw);
	z-index: -1;
}
.pricing_cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5em 3em;
}
.pricing_card,
.pricing_options{
	padding: min(6vw, 2.25em) min(5vw,2em) min(7vw, 2.5em);
	background: #FFF;
	border: 1px solid #C3C3C3;
	border-radius: 4px;
}
.pricing_case,
.pricing_card_title,
.pricing_card_desc,
.pricing_price,
.pricing_table_label,
.pricing_options_title,
.pricing_payment_title,
.pricing_table_value{
	font-family: var(--font-serif);
}
.pricing_case{
	padding: .5em 1.25em;
	font-size: .75em;
	font-weight: 500;
	color: #FFF;
	background: var(--color-navy);
	border-radius: 4px;
}
.pricing_card_title {
	line-height: 1.2;
	font-size: 1.15em;
	font-weight: 500;
}
.pricing_card_desc {
	line-height: 1.4;
	font-weight: 500;
	color: #666;
}
.pricing_card_desc_more{
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	font-size: .85em;
	color: #666;
}
.pricing_price {
	font-size: 1.5em;
	font-weight: 500;
}
.pricing_tax {
	font-size: .65em;
	font-weight: 400;
}
.pricing_from {
	font-size: .85em;
	font-weight: 400;
}

.pricing_table {
	border-collapse: collapse;
	width: 100%;
}
.pricing_table :is(.pricing_table_label, .pricing_table_value){
	padding-top: 1.25rem;
	padding-bottom: 1.25rem;
	border: none;
	border-top: 1px solid #CECDCC;
}
.pricing_table tr:last-of-type :is(.pricing_table_label, .pricing_table_value){
	padding-bottom: 0;
}
.pricing_table_label {
	width: 7em;
	vertical-align: text-top;
	text-align: left;
	font-weight: 700;
}
.pricing_table_value {
	padding-left: 1em;
	font-size: .9em;
}

.pricing_card_note {
  font-size: .85em;
  font-weight: 400;
  color: #666;
}

.pricing_options_title{
	padding-bottom: .25em;
	font-weight: 700;
	font-size: 1.15em;
	border-bottom: 1px solid #CECDCC;
}
.pricing_options_title_note{
	margin-left: 1em;
	font-size: .85em;
	font-weight: 400;
	color: #666;
}
.pricing_options_text,
.pricing_options_note{
	margin-top: 1.5em;
	font-size: .9em;
	line-height: 1.4;
}
.pricing_options_note{
	color: #666;
}
@media (max-width: 768px) {
	.pricing_cards {
		grid-template-columns: 1fr;
	}
}

/* ご契約・お支払いについて 黄色ボックス */
.pricing_payment_box{
	padding: min(5vw, 2em) min(5vw, 2em);
	background: #FFFBE6;
}
.pricing_payment_title {
	font-size: 1.15em;
	font-weight: 700;
	color: var(--color-red);
}

/* Pricing Note Box (用紙案内など黄色ボックス) */
.pricing_note_box {
	padding: min(5vw, 1em);
	background: #FFFEF6;
}
.pricing_section_title {
	font-family: var(--font-serif);
	font-size: 1.25em;
	font-weight: 700;
	color: var(--color-navy);
}


/* ご挨拶状 Paper Samples Section */
.paper_category{
	padding-top: 2.5em;
	padding-bottom: 2.5em;
	border-bottom: 1px solid #CECDCC;
}
.paper_category_title{
	font-family: var(--font-serif);
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--color-navy);
}
.paper_category_text{
	margin-top: .5em;
	font-family: var(--font-serif);
}
.paper_grid{
	margin-top: 2em;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	font-size: min(3vw, .9em);
	line-height: 1.2;
	gap: 1rem min(2vw, 1em);
}
.paper_swatch{
	display: grid;
	grid-template-columns: min(7vw, 80px) minmax(0, 1fr);
	align-items: center;
	gap: min(2vw, 1em);
}
.paper_swatch img {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 2px;
}
.paper_swatch:hover img {
  transform: scale(1.1);
  box-shadow: 0 4px 1rem rgba(0, 0, 0, 0.15);
}
.paper_swatch:hover span {
  color: #0D4577;
}
.paper_swatch span {
  transition: color 0.3s ease;
}
@media (max-width: 768px) {
	.paper_grid{
		grid-template-columns: repeat(auto-fit, minmax(8em, 1fr));
	}
	.paper_swatch{
		grid-template-columns: min(12.5vw, 80px) minmax(4em, 1fr);
	}
}



/* Paper Lightbox */
.paper_lightbox {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  align-items: center;
  justify-content: center;
}
.paper_lightbox.is_active {
  display: flex;
}
.paper_lightbox_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75);
}
.paper_lightbox_content {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  z-index: 1;
  max-width: 90vw;
}
.paper_lightbox_body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}
.paper_lightbox_image {
  max-width: 480px;
  max-height: 70vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.3);
}
.paper_lightbox_name {
  font-size: 1.125rem;
  font-weight: 500;
  color: #FFFFFF;
  letter-spacing: 0.1em;
  text-align: center;
}
.paper_lightbox_close {
  position: absolute;
  top: -3rem;
  right: 0;
  background: none;
  border: none;
  color: #FFFFFF;
  font-size: 2.25rem;
  cursor: pointer;
  line-height: 1;
  padding: 4px 0.5rem;
  transition: opacity 0.3s ease;
}
.paper_lightbox_close:hover {
  opacity: 0.7;
}
.paper_lightbox_prev,
.paper_lightbox_next {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  color: #FFFFFF;
  font-size: 2rem;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background 0.3s ease;
  line-height: 1;
  padding: 0 0 2px 0;
}
.paper_lightbox_prev:hover,
.paper_lightbox_next:hover {
  background: rgba(255, 255, 255, 0.3);
}

@media (max-width: 768px) {
  .paper_lightbox_content {
    gap: 0.75rem;
    max-width: 95vw;
  }
  .paper_lightbox_image {
    max-width: 70vw;
    max-height: 60vh;
  }
  .paper_lightbox_prev,
  .paper_lightbox_next {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 1.5rem;
  }
  .paper_lightbox_name {
    font-size: 0.9375rem;
  }
  .paper_lightbox_close {
    top: -2.5rem;
    font-size: 1.875rem;
  }
}



/* 関連サービス */
.service_related_list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(15em, 1fr));
	gap: min(3vw, 1.5em) min(5vw, 2em);
	align-items: end;
	font-family: var(--font-serif);
}
.service_related .service_item{
	grid-template-columns: min(10vw, 60px) minmax(0, 1fr);
	box-shadow: none;
}


/* ==========================================
   Company About Page (私たちについてページ)
   ========================================== */
.about_section_label {
	font-size: 1.1em;
	font-weight: 200;
	letter-spacing: .3em;
	color: var(--color-navy);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-decoration-color: rgba(0, 34, 64, 0.5);
	text-underline-offset: 0;
}
.about_section_title {
	margin-top: .5em;
	font-feature-settings: "palt";
	font-family: var(--font-serif);
	font-size: min(3.6vw, 2.75em);
	font-weight: 400;
	letter-spacing: .2em;
	line-height: 1.5;
}
.about_section__vision .about_section_label,
.about_section__vision .about_section_title{
	text-align: right;
}

.about_section_main{
	margin-top: 4em;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 2.5em;
}
.about_section_image{
	flex-shrink: 0;
	position: relative;
	width: min(36vw, 454px);
    aspect-ratio: 454 / 256;
}
.about_section_image img{
	position: absolute;
	object-fit: cover;
}

.about_section_vertical_wrap{
	position: absolute;
	top: -3em;
	right: 5em;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: .5em;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	font-feature-settings: 'vert' on;
	line-height: 1;
	font-family: var(--font-serif);
	font-size: min(2vw, 1.4em);
	z-index: 1;
}
.about_section__vision .about_section_vertical_wrap{
	left: 5em;
	right: auto;
}
.about_section_vertical_text {
	display: inline-block;
	padding-left: .15em;
	padding-right: .15em;
	letter-spacing: .2em;
	color: var(--color-navy);
	background-image: linear-gradient(#fff calc(100% - .5em), transparent 0);
}
.about_section__value .about_section_vertical_wrap .about_section_vertical_text:nth-of-type(2) {
	margin-top: .5em;
}

@media screen and (max-width: 768px){
	.about_section_title{
		font-size: min(8vw, 2.75em);
	}
	.about_section_vertical_wrap{
		font-size: min(5vw, 1.4em);
	}
	.about_section__philosophy .about_section_main,
	.about_section__value .about_section_main{
		flex-direction: column-reverse;
	}
	.about_section__vision .about_section_main{
		flex-direction: column;
	}
	body#company{
		container-type: inline-size;
	}
	.about_section_image{
		width: 100cqw;
		transform: translateX(-5cqw);
		aspect-ratio: 716 / 440;
	}
	.about_section_image img{
		width: 100%;
	}
	.about_section_vertical_wrap{
		top: -1.75em;
		right: 2em;
	}
	.about_section__vision .about_section_vertical_wrap{
		left: 2em;
	}
}
.about_section__vision,
.about_section__value{
	margin-top: min(14vw, 80px);
	padding-top: min(14vw, 80px);
	border-top: 1px solid #B1B1B1;
}

/* ----------------------------------------
   他COMPANYページへ ナビゲーション
   ---------------------------------------- */
.company_pages_nav{
	margin-top: clamp(4em, 10vw, 8em);
}
.company_pages_buttons{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: .75em min(2vw, 2em);
}
.company_pages_buttons .link_button{
	width: auto;
}
@media screen and (max-width: 600px){
	.company_pages_buttons{
		grid-template-columns: 1fr;
	}
}

/* ==========================================
   Message Page (社長の思い)
   ========================================== */
.message_profile {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 2em min(10vw, 10%);
	font-family: var(--font-serif);
}
.message_profile_photo {
	max-width: 50vw;
}
.message_profile_text {
	min-width: 16em;
	font-weight: 500;
}
.message_profile_position {
	letter-spacing: .1em;
}
.message_profile_name {
	font-size: 2.26em;
	letter-spacing: .25em;
}

.message_sections{
	margin-top: min(14vw, 80px);
	padding-top: min(14vw, 80px);
	border-top: 1px solid #B1B1B1;
}
.message_block_title {
	margin-bottom: 1em;
	font-family: var(--font-serif);
	font-weight: 400;
	font-size: min(6.4vw, 2.4em);
	letter-spacing: .2em;
}
.message_block_text{
	font-size: 1.1em;
	line-height: 2;
}
.message_block_text p{
	margin-top: 2em;
}
@media (max-width: 768px) {
/*	.message_profile_photo{
		max-width: 80%;
	}*/
	.message_block_title{
		letter-spacing: .1em;
	}
	.message_block_text p{
		margin-top: 1em;
	}
}

/* ==========================================
   History Page (沿革ページ)
   ========================================== */
.history_timeline{
	position: relative;
	margin-left: calc(1rem + 4px);
}
.history_timeline_item{
	position: relative;
}
.history_timeline_item:nth-last-of-type(n+2)::before{
	position: absolute;
	top: .9em;
	left: -1rem;
	content: "";
	width: 1px;
	height:100%;
	background: var(--color-gold);
}
.history_timeline_year{
	flex-grow: 1;
	position: relative;
	font-family: var(--font-serif);
	font-size: 1.1em;
	font-weight: 700;
	letter-spacing: .24em;
	color: var(--color-navy);
	white-space: nowrap;
}
.history_timeline_year::after{
	position: absolute;
	top: calc(.9em - 4px);
	left: calc(-1rem - 4px);
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--color-gold);
}
.history_timeline_title {
	font-family: var(--font-serif);
	font-weight: 500;
	font-size: 1.1em;
	color: var(--color-navy);
}
.history_timeline_desc {
	margin-top: 1em;
}
.history_timeline_img_wrap{
	display: flex;
	gap: 1em;
	margin-top: 1em;
	max-width: 100%;
}
.history_timeline_img_wrap.item1 .history_timeline_img{
	width: auto;
	max-height: 40vmin;
}
.history_timeline_img_wrap.item2{
	margin-top: 1.5em;
}
.history_timeline_img_wrap.item2 .history_timeline_img{
	max-width: min(300px, calc(50% - .5em));
}
/*.history_timeline_img.item1{
	aspect-ratio: 200 / 300;
}
.history_timeline_img.item2{
	aspect-ratio: 374 / 300;
}
.history_timeline_img.item3{
	aspect-ratio: 440 / 300;
}
.history_timeline_img.item4{
	aspect-ratio: 440 / 300;
}*/
@media print, screen and (min-width: 769px){
	.history_timeline_item{
		display: flex;
		gap: 3em;
	}
	.history_timeline_content{
		flex: 1 1 100%;
	}
	.history_timeline_year,
	.history_timeline_content{
		margin-bottom: 2rem;
		padding-bottom: 2rem;
	}
	.history_timeline_content{
		border-bottom: 1px solid #CECDCC;
	}
}
@media screen and (max-width: 768px){
	.history_timeline_item{
		margin-bottom: 1.5rem;
		padding-bottom: 1.5rem;
		border-bottom: 1px solid #CECDCC;
	}
	.history_timeline_item:nth-last-of-type(n+2)::before{
		height: calc(100% + 1.5rem);
	}
	.history_timeline_content{
		margin-top: 1em;
	}
}

/* ==========================================
   Company Overview Page (会社概要ページ)
   ========================================== */
.overview_table{
	border-collapse: collapse;
}
.overview_table :is(th, td){
	border: none;
	padding-top: min(6vw, 2rem);
	padding-bottom: min(6vw, 2rem);
	vertical-align: text-top;
	border-bottom: 1px solid #CECDCC;
}
.overview_label{
	width: min(40vw, 12em);
	font-family: var(--font-serif);
	font-weight: 700;
	text-align: left;
}
.overview_value{
	padding-left: 1em;
}

/* Reduced Motion対応 */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ==========================================
   FAQ Page Styles
   ========================================== */
.faq_layout{
	display: grid;
	grid-template-columns: minmax(12em, 30%) minmax(0, 100%);
	gap: 2em 2em;
	align-items: start;
	justify-content: center;
	font-family: var(--font-serif);
}
@media print, screen and (min-width: 769px){
	.faq_sidebar{
		position: sticky;
		top: calc(1em + clamp(70px, 8vw, 100px));
		padding-top: .75em;
		
	}
	.faq_nav_list li:nth-of-type(n+2){
		margin-top: 1.5em;
	}
}
.faq_sidebar{
	font-size: clamp(.85rem, 1.6vw, 1em);
}

.faq_nav_link{
	display: flex;
	align-items: center;
	gap: 1em;
	transition: var(--transition);
	letter-spacing: .05em;
	white-space: nowrap;
	text-decoration: none;
}
.faq_nav_link::before{
	content: '';
	display: block;
	width: 1.5em;
	height: 1px;
	background: var(--color-text);
	flex-shrink: 0;
	transition: var(--transition);
}
.faq_nav_link:hover,
.faq_nav_link.active{
	color: var(--color-gold);
}
.faq_nav_link:hover::before,
.faq_nav_link.active::before{
	background: var(--color-gold);
}

.faq_section{
	padding-top: 1em;
}
.faq_section:nth-of-type(n+2) {
	margin-top: 5em;
}
.faq_section_title{
	padding-bottom: 1em;
	letter-spacing: .5em;
	font-size: min(4.6vw, 1.5em);
	font-weight: 500;
	color: var(--color-text);
	border-bottom: 1px solid var(--color-text);
}

/* Accordion */
.accordion_item{
	border-bottom: 1px solid #E5E5E5;
}
.accordion_trigger:nth-of-type(n+2){
	border-top: 1px solid #E5E5E5;
}
.accordion_trigger{
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 1em;
	padding: 2em calc(2em + 16px) 2em min(2vw, 1.5em);
	text-align: left;
	cursor: pointer;
	background: transparent;
	transition: background var(--transition);
}
.accordion_trigger:hover,
.accordion_trigger:has(+ .is_open),
.accordion_panel{
	background: #FDFDFD;
}
.accordion_q,
.accordion_a{
	flex-shrink: 0;
	font-size: 1.5em;
	letter-spacing: 0;
	line-height: 1;
}
.accordion_q{
	color: var(--color-gold);
}
.accordion_a{
	color: var(--color-navy);
}

.accordion_trigger::before,
.accordion_trigger::after{
	position: absolute;
	content: '';
	background: #bbb;
	transition: var(--transition);
}
.accordion_trigger::before{
	top: calc(50% - 1px);
	right: 1em;
	width: 16px;
	height: 2px;
}
.accordion_trigger::after{
	top: calc(50% - 8px);
	right: calc(1em + 7px);
	width: 2px;
	height: 16px;
}
.accordion_trigger:has(+ .is_open)::after{
  opacity: 0;
}

.accordion_panel{
	display: grid;
	grid-template-rows: 0fr;
	padding: 0 min(2vw, 1.5em);
	overflow: hidden;
	transition: grid-template-rows 0.5s ease, padding 0.5s ease;
}
.accordion_panel_inner{
	min-height: 0;
	display: flex;
	align-items: flex-start;
	gap: 1em;
}
.accordion_panel.is_open{
	grid-template-rows: 1fr;
	padding-bottom: 2em;
}

@media (max-width: 768px) {
	.faq_layout {
		grid-template-columns: 1fr;
	}
	.faq_nav_list {
		display: flex;
		flex-wrap: wrap;
		gap: 1em 1.5em;
	}
}
@media (max-width: 480px) {
	.faq_nav_list li {
		min-width: 100%;
	}
}

/* ==========================================
   設計事例 ライトボックス
   ========================================== */
.examples_lightbox_trigger {
  cursor: pointer;
  object-fit: contain;
  height: auto;
  background: #f0f2f5;
  transition: transform 0.25s ease;
}
.examples_lightbox_trigger:hover {
  transform: scale(1.04);
}
.examples_lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000;
  align-items: center;
  justify-content: center;
}
.examples_lightbox.is_open {
  display: flex;
}
.examples_lightbox_overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.78);
}
.examples_lightbox_content {
  position: relative;
  z-index: 1;
  max-width: 80vw;
  max-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.examples_lightbox_img {
  max-width: 100%;
  max-height: 85vh;
  object-fit: contain;
  box-shadow: 0 0.5rem 2.5rem rgba(0, 0, 0, 0.4);
}
.examples_lightbox_close {
  position: absolute;
  top: -2.5rem;
  right: 0;
  background: none;
  border: none;
  color: #ffffff;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
  padding: 4px 0.5rem;
  transition: opacity 0.2s ease;
}
.examples_lightbox_close:hover {
  opacity: 0.7;
}


/* ==========================================
   投稿　TOPICS　BLOG
   ========================================== */
.post_filter_buttons {
	display: flex;
	align-items: center;
	gap: .5em;
	flex-wrap: wrap;
}
.post_filter_btn {
	display: inline-block;
	padding: .5em 1em;
	min-width: min(100%, 10em);
	text-align: center;
	font-size: .8em;
	line-height: 1.2;
	border: 1px solid var(--color-text);
	transition: var(--transition);
	background: #fff;
}
.post_filter_btn.active,
.post_filter_btn:hover {
	background: var(--color-text);
	color: #fff;
}
.post_list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2.5em 3.5em;
	margin-top: 2em;
}
.post_card{
	display: block;
}
.post_card:hover {
	color: #888;
}
.post_card_image_wrap {
	width: 100%;
	height: 200px;
	overflow: hidden;
	background: var(--color-gray);
	align-self: stretch;
}
.post_card_image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: var(--transition);
}
.post_card:hover .post_card_image {
	transform: scale(1.05);
}
.post_card_meta{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 1em;
}
.post_card_category{
	padding: .25em 1em;
	line-height: 1.2;
	font-size: .75em;
	background: #FFF;
	border: 1px solid;
}
.post_card_tag{
	line-height: 1.2;
	font-size: .8em;
}
.post_card_tag::before{
	content: "#";
	margin-left: .25em;
	margin-right: .25em;
	color: var(--color-navy-light);
}
.post_card_date{
	margin-left: auto;
}
.post_card_title {
	margin-top: .5em;
	line-height: 1.6;
	font-size: 1rem;
	font-weight: 400;
}

/* Blog Pagination */
.post_pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: min(3vw, 1em);
	margin-top: 3em;
}
.pagination_item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5em;
	height: 2.5em;
	font-size: .9em;
	font-weight: 400;
	background: var(--color-white);
	border: 1px solid #CECDCC;
	transition: var(--transition);
}
.pagination_item:hover {
	border-color: var(--color-navy);
	color: var(--color-navy);
}
.pagination_item.active {
	background: var(--color-navy);
	border-color: var(--color-navy);
	color: var(--color-white);
}
@media (max-width: 1024px) {
	.post_list {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 768px) {
	.post_list {
		grid-template-columns: 1fr;
	}
	.post_card_image_wrap {
		height: auto;
		aspect-ratio: 300 / 140;
	}
}

/* ==========================================
   Blog Article Page Styles
   ========================================== */
.post_page_title{
	margin-top: .25em;
	line-height: 1.4;
	text-align: justify;
	font-weight: 200;
	font-size: min(6.2vw, 2em);
}

.single_date_wrap{
	margin-bottom: -1em;
	padding: 1em min(5vw, 120px) 0;
	line-height: 1.2;
	text-align: right;
	font-size: .9em;
	color: #6B6B6B;
}

.post_bottom_wrap{
	margin-top: min(14vw, 80px);
	padding-top: min(14vw, 80px);
	border-top: 1px solid #eee;
}

.link_button.link_button_back::before{
	content: "\2190";
}
.link_button.link_button_back::after {
	transform-origin: left center;
}
.link_button.link_button_back:hover::after {
	transform-origin: right center;
}

.article_lead {
	margin-bottom: 2.5em;
	padding: 1.5em min(5vw, 2em);
	background: #EDF2F4;
}

/* Article Highlight Box */
.article_highlight {
	margin: 2em 0;
	padding: 1.5em min(5vw, 2em);
	background: linear-gradient(135deg, rgba(186, 153, 92, 0.1) 0%, rgba(186, 153, 92, 0.05) 100%);
	border: 1px solid rgba(186, 153, 92, 0.3);
	border-radius: 4px;
}
.article_highlight p {
	margin-top: 0;
}

/* ブログで使う装飾 */
.blog_matome li{
	margin: 2rem 0 4rem;
}
.title_blue{
	color:#009;
	font-size:1.1rem;
	font-weight:500;
	padding:0 1em;
	border-radius:5px;
	background-color:#def5ff;
	text-align:left;
}
.kakomi_blue{
	margin:1em .5em;
	padding:.5em 1em;
	border:1px dotted #84a2d4;
	background-color:#F1FAFF;
	border-radius:8px;
}
.kakomi_green{
	margin:1em .5em;
	padding:.5em 1em;
	border:1px dotted #94CF58;
	background-color:#F9F9EE;
	border-radius:8px;
}
@media screen and (max-width: 768px) {
	.kakomi_blue,
	.kakomi_green{
		margin:1em 0;
	}
}
.title_green{
	font-size:1.4rem;
	line-height:1.4;
	padding:2em 0 .4em;
	font-weight:200;
	border-bottom:2px solid #8cc455;
}
.title_green2{
	line-height:1.4;
	padding:1.2em 0 .4em;
	font-weight:200;
	border-bottom:1px solid #8cc455;
}
.fa_check::before{
	display: inline-block;
	padding-right:.2em;
	content: 'check';
	font-family: 'Material Symbols Outlined';
	font-size: 20px;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	transform: translateY(5px);
	font-variation-settings:
		'FILL' 0,
		'wght' 700,
		'GRAD' 0,
		'opsz' 20;
}
.fa_check2::before{
	display: inline-block;
	padding-right:.2em;
	content: 'check_box';
	font-family: 'Material Symbols Outlined';
	font-size: 20px;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	transform: translateY(5px);
	font-variation-settings:
		'FILL' 0,
		'wght' 400,
		'GRAD' 0,
		'opsz' 20;
}
.fa_check3::before{
	display: inline-block;
	margin-right:.2em;
	content: 'check_small';
	font-family: 'Material Symbols Outlined';
	font-size: 20px;
	width: 20px;
	height: 20px;
	border-radius: 3px;
	color: #fff;
	background-color: var(--color-text);
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	transform: translateY(5px);
	font-variation-settings:
		'FILL' 0,
		'wght' 400,
		'GRAD' 0,
		'opsz' 20;
}
.fa_paperclip::before{
	display: inline-block;
	padding-right:.2em;
	content: 'attach_file';
	font-family: 'Material Symbols Outlined';
	font-size: 20px;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	transform: translateY(5px) rotate(45deg);
	font-variation-settings:
		'FILL' 0,
		'wght' 400,
		'GRAD' 0,
		'opsz' 20;
}
.fa_paperclip.title_green::before,
.fa_check.title_green::before{
	color:#8cc455;
	font-size: 1em;
}
.font_green{
	color: #8cc455;
}
.font_deepblue{
	color: #004190;
}
.font_blue{
	color: #66a7cc;
}
.marker_blue{
	background: linear-gradient(transparent 60%, #A4E7FF 0%);
}
.marker_pink{
	background: linear-gradient(transparent 60%, #FFCFF0 0%);
}
.marker_green{
	background: linear-gradient(transparent 60%, #CCFF68 0%);
}
.marker_yellow{
	background: linear-gradient(transparent 60%, #FFFD1C 0%);
}

/* 前後リンク */
.post_link_wrap{
	line-height: 1.4;
	font-size: .9rem;
}
.post_link_wrap a{
	position: relative;
	display: block;
	margin-top: .5em;
	padding: .5em 1em;
	text-decoration: none !important;
	border: 1px solid #e5e5e5;
	transition: border .1s;
}
.post_link_wrap a:hover{
	border-color: var(--color-text);
}
.post_link_wrap a::before{
	margin-right: .5em;
	color: var(--color-text);
}
.post_link_wrap a[rel="prev"]::before{
	content: "\226A\a0\524D\306E\8A18\4E8B";
}
.post_link_wrap a[rel="next"]::before{
	content: "\226B\a0\6B21\306E\8A18\4E8B";
}

/* ==========================================
   Contact Page Styles
   ========================================== */
.contact_info_box{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: min(2vw, 2em);
	padding: 1.5em 1em;
	text-align: center;
	line-height: 1.4;
	background: #EDF2F4;
}
.contact_info_title {
	font-family: var(--font-serif);
	font-weight: 500;
}
.contact_info_tel {
	font-family: var(--font-serif);
	font-size: 1.5em;
	color: var(--color-navy);
}
a.contact_info_tel:hover{
	text-decoration: underline;
}
.contact_info_time {
	margin-top: .25em;
	font-size: .85em;
	color: #888;
}
@media print, screen and (min-width: 769px){
	.contact_info_box{
		font-size: min(1.65vw, 1em);
	}
	.contact_info_item:nth-of-type(2){
		padding-left: min(2vw, 2em);
		padding-right: min(2vw, 2em);
		border-left: 1px solid #CECDCC;
		border-right: 1px solid #CECDCC;
	}
}
@media screen and (max-width: 768px){
	.contact_info_box {
		gap: min(5vw, 2em);
		flex-direction: column;
	}
	.contact_info_item{
		width: 100%;
	}
	.contact_info_item:nth-of-type(2){
		padding-top: min(5vw, 2em);
		padding-bottom: min(5vw, 2em);
		border-top: 1px solid #CECDCC;
		border-bottom: 1px solid #CECDCC;
	}
}

/* Form */
@media print, screen and (min-width: 769px){
	.contact_form_item{
		grid-template-columns: 14em 1fr;
	}
	.contact_form_text{
		justify-content: space-between;
	}
}
.main_contact_form{
	font-family: var(--font-serif);
}
.contact_form_list{
	border-top: 1px solid #CECDCC;
}
.contact_form_item{
	display: grid;
	align-items: start;
	gap: .5em min(5vw, 5em);
	padding-top: 2em;
	padding-bottom: 2em;
	border-bottom: 1px solid #CECDCC;
}
.contact_form_text{
	display: flex;
	align-items: center;
	gap: .5em 1em;
	font-size: 1rem;
}
.form_required,
.form_optional{
	display: inline-block;
	font-size: .7em;
	padding: 0 1.25em;
	line-height: 2;
	letter-spacing: .05em;
	color: #fff;
	border-radius: 2em;
}
.form_required{
	background: #1B1D22;
}
.form_optional{
	background: #B1B1B1;
}
.main_contact_form .wpcf7-list-item{
	margin: 0;
}
.contact_form_area .wpcf7-list-item:nth-of-type(n+2){
	margin-top: .5em;
}
.main_contact_form .wpcf7-list-item,
.main_contact_form label:has(input[type="checkbox"]){
	display: block;
}
.main_contact_form label:has(input[type="checkbox"]){
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 1em;
}
.main_contact_form label:has(input[type="checkbox"]):hover{
	font-weight: 700;
	color: var(--color-navy-light);
}
.main_contact_form input[type="checkbox"]{
	width: 1.5em;
	height: 1.5em;
}
.main_contact_form input[type="text"],
.main_contact_form input[type="email"],
.main_contact_form textarea{
	width: 100%;
	padding: min(5vw, 1.5em) min(3vw, 1.5em);
	font-size: 1rem;
	color: #1B1D22;
	background: #FFFFFF;
	border: 1px solid #C3C3C3;
	border-radius: 8px;
}
.main_contact_form textarea{
	resize: vertical;
}
.contact_form_example{
	line-height: 1.4;
	margin-bottom: .5em;
	opacity: .6;
}
.main_contact_form .wpcf7-not-valid-tip{
	display: inline-block;
	margin-top: .5em;
	padding: .35em .5em .5em 1em;
	line-height: 1.4;
	font-size: .8em;
	color: #fff;
	background-color: #dc3232;
	border-radius: 4px;
}
.contact_form_submit_wrap{
	margin-top: 2em;
	text-align: center;
}
.main_contact_form input[type="submit"]{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 3.75em;
    width: min(80%, 18em);
	font-size: 1em;
	font-family: var(--font-serif);
	color: var(--color-navy);
	background-color: #fff;
	border: 1px solid var(--color-navy);
	cursor: pointer;
	transition: color .2s, background .2s, letter-spacing .2s;
}
.main_contact_form input[type="submit"]:hover{
	letter-spacing: .12em;
	color: #fff;
	background-color: var(--color-navy);
}

/* ==========================================
   Policy / Legal
   ========================================== */

/* ==========================================
   Sitemap
   ========================================== */

/* ==========================================
   検索結果
   ========================================== */
.topics_list_item{
	border-bottom: 1px solid #E5E5E5;
}
.topics_list_anchor{
	display: block;
	padding: 1em;
}
.topics_list_anchor:hover{
	color: #2C81CC;
	background-color: #FDFDFD;
}

/* 検索フォーム */
.search_form{
	padding: 3em min(5vw, 1em);
	background-color: #EFF2F5;
}
.search_form form{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1em;
}
.search_form form > label{
	flex: 0 1 auto;
	width: min(100%, 28em);
}
.search_form input[type="search"]{
    width: 100%;
	display: inline-flex;
	justify-content: flex-start;
	align-items: center;
    padding: 0 min(5vw, 1em);
	height: 2.5rem;
    font-size: 1rem;
    color: #1B1D22;
    background: #FFF;
    border: 1px solid #C3C3C3;
}
.search_form input[type="submit"]{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 2.5rem;
    padding: 0 min(5vw, 1em);
	font-size: 1em;
	color: var(--color-navy);
	background-color: #fff;
    border-radius: 4px;
	border: 1px solid var(--color-navy);
	cursor: pointer;
	transition: color .2s, background .2s;
}
.search_form input[type="submit"]:hover{
	color: #fff;
	background-color: var(--color-navy);
}

body.search .contact_section,
body.error404 .contact_section{
	margin-top: 1em;
}


/* ========================================
   404 Not Found
   ======================================== */
.not_found_buttons {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 1em 1.5em;
}
.link_button_to_top,
.link_button_to_sitemap{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 15em;
	height: 3.75em;
	font-family: var(--font-serif);
	font-weight: 500;
	text-decoration: none;
	transition: all 0.3s ease;
}
.link_button_to_top{
	gap: .6em;
	color: var(--color-navy);
	border: 1px solid #B1B1B1;
}
.link_button_to_top::before{
	content: "\2190";
	margin-left: -.5em;
	transition: all 0.3s ease;
}
.link_button_to_top:hover{
	color: #FFF;
	background: var(--color-navy);
	border-color: var(--color-navy);
}
.link_button_to_top:hover::before{
	transform: translateX(-4px);
}

.link_button_to_sitemap{
	border: 1px solid var(--color-text);
}
.link_button_to_sitemap:hover{
	color: #FFF;
	background: var(--color-text);
}