/*
Theme Name: AZUN
Theme URI: https://azun.co.jp/
Author: 株式会社AZUN
Description: 株式会社AZUN コーポレートサイト用ブロックテーマ
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 0.3.21
Text Domain: azun
*/

/* ---------- 共通 ---------- */
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }
.azun-num { font-family: "Barlow", sans-serif; font-weight: 700; }
.azun-placeholder { background: #D9D9D9; display: flex; align-items: center; justify-content: center; color: #555; font-size: 12px; }

/* ---------- ヘッダー ---------- */
.azun-header { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 50; }
.azun-header .wp-block-navigation, .azun-header .azun-header__cta { flex-shrink: 0; }
.azun-header .wp-block-navigation__submenu-container { border: 1px solid #E5E5E5 !important; }
@media (max-width: 1180px) { .azun-header .azun-header__name { display: none; } .azun-header .wp-block-navigation { --nav-gap: 18px; } }
.azun-header .wp-block-navigation a { font-weight: 700; }
.azun-header .azun-header__cta .wp-block-button__link { border-radius: 0; }
.azun-header .azun-header__name { white-space: nowrap; }

/* ---------- 追従「ご相談はこちら」（PCのみ） ---------- */
.azun-side-cta {
	position: fixed; right: 0; top: 40%; z-index: 60;
	writing-mode: vertical-rl; padding: 20px 13px;
	background: #111; color: #fff !important; text-decoration: none !important;
	font-weight: 700; font-size: 14px; letter-spacing: .2em;
	box-shadow: 0 0 0 1px #fff;
}
.azun-side-cta:hover { background: #333; }

/* ---------- スマホ下部の固定バー ---------- */
.azun-bottom-bar { display: none; }
@media (max-width: 781px) {
	.azun-side-cta { display: none; }
	.azun-bottom-bar {
		display: grid; grid-template-columns: repeat(3, 1fr);
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; height: 60px;
		font-size: 12px; font-weight: 700; background: #fff; border-top: 1px solid #E5E5E5;
	}
	.azun-bottom-bar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: #111; text-decoration: none; }
	.azun-bottom-bar a + a { border-left: 1px solid #E5E5E5; }
	.azun-bottom-bar a.is-primary { background: #111; color: #fff; }
	body { padding-bottom: 60px; }
}

/* ---------- ファーストビュー ---------- */
.azun-fv, .wp-block-cover.alignfull.is-position-bottom-left { padding-left: clamp(20px, 3vw, 40px) !important; padding-right: clamp(20px, 3vw, 40px) !important; }
.azun-fv .wp-block-cover__inner-container, .wp-block-cover.alignfull.is-position-bottom-left .wp-block-cover__inner-container { width: 100% !important; max-width: 1200px; margin-left: auto !important; margin-right: auto !important; }
.azun-fv .wp-block-cover__inner-container > .wp-block-group > *, .wp-block-cover.alignfull.is-position-bottom-left .wp-block-cover__inner-container > .wp-block-group > * { margin-left: 0 !important; }
h2:has(+ .azun-tiles) { padding-left: max(clamp(20px, 3vw, 40px), calc((100% - 1200px) / 2)) !important; }

/* ---------- 事業内容タイル ---------- */
.azun-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 !important; }
.azun-tile { position: relative; aspect-ratio: 16 / 10; min-height: 0 !important; padding: 24px !important; margin: 0 !important; overflow: hidden; justify-content: center !important; align-items: center !important; }
.azun-tile .wp-block-cover__inner-container { width: 100% !important; max-width: none !important; margin: 0 !important; }
.azun-tile .wp-block-cover__inner-container { text-align: center; }
.azun-tile a { color: #fff; text-decoration: none; }
.azun-tile a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.azun-tile .wp-block-cover__image-background { transition: transform .4s ease; }
.azun-tile:hover .wp-block-cover__image-background { transform: scale(1.04); }
.azun-tile .azun-tile__arrow { display: inline-flex; width: 30px; height: 30px; border: 1px solid #fff; border-radius: 50%; align-items: center; justify-content: center; font-size: 13px; }
@media (max-width: 781px) { .azun-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .azun-tile { aspect-ratio: 1 / 1; } }

/* ---------- カード（施工事例など） ---------- */
.azun-cards .wp-block-post-featured-image img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.azun-cards .wp-block-post-title a { text-decoration: none; color: inherit; }
.azun-cards .wp-block-post-title a:hover { text-decoration: underline; }
.azun-noimage { aspect-ratio: 4 / 3; background: #D9D9D9; }

/* ---------- 一覧（お知らせ・コラム） ---------- */
.azun-list .wp-block-post { border-bottom: 1px solid #E5E5E5; padding: 14px 0; }
.azun-list .wp-block-post:last-child { border-bottom: 0; }
.azun-list .wp-block-post-title a { text-decoration: none; color: inherit; }
.azun-list .taxonomy-category a, .azun-tag a { display: inline-block; padding: 0 8px; background: #111; color: #fff; text-decoration: none; font-size: 12px; }

/* ---------- FAQ ---------- */
.azun-faq .wp-block-details { border-bottom: 1px solid #CCC; padding: 18px 0; margin: 0; }
.azun-faq .wp-block-details summary { font-weight: 700; cursor: pointer; }
.azun-faq .wp-block-details p { color: #555; margin-top: 10px; }

/* ---------- 表 ---------- */
.azun-spec table { border-collapse: collapse; width: 100%; }
.azun-spec th { width: 180px; text-align: left; background: #F4F4F4; font-weight: 700; }
.azun-spec th, .azun-spec td { padding: 14px 16px; border-top: 1px solid #E5E5E5; }
.azun-spec tr:first-child th, .azun-spec tr:first-child td { border-top: 1px solid #111; }

/* ---------- ボタン ---------- */
.wp-block-button.is-style-outline > .wp-block-button__link { border-width: 1px; }

/* ---------- フッター ---------- */
.azun-footer a { color: #CCC; text-decoration: none; }
.azun-footer a:hover { color: #fff; }
.azun-footer .azun-footer__btn a { display: flex; align-items: center; justify-content: center; min-height: 46px; border: 1px solid #fff; color: #fff; font-weight: 700; }
.azun-footer .azun-footer__btn.is-primary a { background: #fff; color: #111; }

@media (max-width: 781px) {
	.azun-hide-sp { display: none !important; }
}
@media (min-width: 782px) {
	.azun-hide-pc { display: none !important; }
}

/* ---------- 調整（v0.1.2） ---------- */
.azun-header .wp-block-navigation { margin-right: 28px; }
.azun-footer .azun-bottom-bar a { color: #111; }
.azun-footer .azun-bottom-bar a.is-primary { color: #fff; }
@media (max-width: 781px) {
	/* スマホ・タブレット縦はハンバーガーメニュー */
	.azun-header .wp-block-navigation { margin-right: 4px; }
	.azun-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
	.azun-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
	.azun-header .wp-block-navigation__responsive-container.is-menu-open { padding: 24px; }
	.azun-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 18px; font-size: 16px; }
	.azun-header .wp-block-navigation__responsive-container-close { display: flex !important; }
}

/* ヘッダー追従：テンプレートパーツの外枠ごと固定 */
.wp-site-blocks > .wp-block-template-part:has(> .azun-header) { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 50; }
.wp-site-blocks > .wp-block-template-part:has(> .azun-header) + * { margin-block-start: 0; }
@media (max-width: 600px) { .admin-bar .wp-site-blocks > .wp-block-template-part:has(> .azun-header) { top: 0; } }

/* スマホメニューの見た目 */
@media (max-width: 781px) {
	.azun-header .wp-block-navigation { margin-right: 16px; }
	.azun-header .is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start !important; padding-top: 24px; }
	.azun-header .is-menu-open .wp-block-navigation__container { align-items: flex-start !important; width: 100%; gap: 0 !important; }
	.azun-header .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid #E5E5E5; padding: 14px 0; align-items: flex-start !important; }
	.azun-header .is-menu-open .wp-block-navigation__submenu-container { border: 0 !important; padding: 8px 0 0 16px !important; }
	.azun-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item { border-bottom: 0; padding: 6px 0; font-weight: 500; }
	body:has(.is-menu-open) .azun-bottom-bar, body:has(.is-menu-open) .azun-side-cta { display: none; }
}

/* 記事本文内の見出し */
.wp-block-post-content h2 { font-size: clamp(20px, 2.2vw, 24px); margin-top: 56px; padding-bottom: 10px; border-bottom: 1px solid #111; }
.wp-block-post-content h3 { font-size: 18px; margin-top: 40px; }

/* ---------- パンくず ---------- */
.azun-breadcrumb ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; padding: 0; font-size: 12px; color: #555; }
.azun-breadcrumb li + li::before { content: "›"; margin: 0 10px; color: #999; }
.azun-breadcrumb a { color: #555; text-decoration: none; }
.azun-breadcrumb a:hover { text-decoration: underline; }

/* ---------- 事業ページ ---------- */
.azun-svc .wp-block-post-content h2 { border-bottom: 0; padding-bottom: 0; font-size: clamp(22px, 2.6vw, 30px); margin-top: 0; }
.azun-svc .azun-svc-item { border-top: 1px solid #111; padding-top: 28px; margin-top: 64px; }
.azun-svc .azun-svc-item h3 { font-size: 20px; margin: 0 0 20px; }
.azun-svc .azun-svc-item h3::before { content: "■"; margin-right: 8px; font-size: .8em; vertical-align: .1em; }
.azun-svc .azun-svc-photos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.azun-svc .azun-svc-photos > * { margin: 0 !important; }
.azun-svc .azun-svc-photos img, .azun-svc .azun-svc-photos .azun-placeholder { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; }
@media (max-width: 781px) { .azun-svc .azun-svc-photos { grid-template-columns: 1fr 1fr; } .azun-svc .azun-svc-photos > :first-child { grid-column: 1 / -1; } }
.azun-svc-columns__head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px; border-bottom: 1px solid #111; padding-bottom: 14px; }
.azun-svc-columns__head h2 { margin: 0; font-size: clamp(20px, 2.4vw, 26px); }
.azun-svc-columns__head a { font-size: 13px; font-weight: 700; }
.azun-svc-columns ul { list-style: none; margin: 0; padding: 0; }
.azun-svc-columns li { display: flex; gap: 24px; padding: 18px 0; border-bottom: 1px solid #DDD; }
.azun-svc-columns li a { text-decoration: none; }
.azun-svc-columns li a:hover { text-decoration: underline; }
.azun-svc-columns time { color: #555; font-size: 14px; flex-shrink: 0; }
.azun-svc-columns__empty { color: #555; padding-top: 18px; }
@media (max-width: 600px) { .azun-svc-columns li { flex-direction: column; gap: 2px; } }

.azun-svc .wp-block-post-content > .wp-block-image img { aspect-ratio: 16 / 9; object-fit: cover; width: 100%; }

/* 事業ページのお問い合わせ */
.azun-svc-contact { text-align: center; }
.azun-svc-contact h2 { font-size: clamp(22px, 2.6vw, 30px); margin: 0 0 16px; }
.azun-svc-contact__lead { color: #555; }
.azun-svc-contact__btn a { display: inline-block; margin-top: 12px; padding: 14px 32px; border: 1px solid #111; font-weight: 700; font-size: 15px; text-decoration: none; }
.azun-svc-contact__btn a:hover { background: #111; color: #fff; }
.azun-svc-contact__tel { color: #555; font-size: 13px; margin-top: 20px; }
.azun-svc .wp-block-post-content > .azun-placeholder { aspect-ratio: 16 / 9; }

/* よくある質問一覧 */
.azun-faq-list { border-top: 1px solid #111; }
.azun-faq-list .wp-block-details { border-bottom: 1px solid #CCC; padding: 18px 0; margin: 0; }
.azun-faq-list summary { font-weight: 700; cursor: pointer; }
.azun-faq-answer { color: #555; margin-top: 10px; }
.azun-faq-answer p { margin: 0; }
.azun-faq-answer::before { content: "A. "; font-weight: 700; color: #111; float: left; margin-right: 4px; }
/* 会社概要の表 */
.azun-company table { border-collapse: collapse; width: 100%; }
.azun-company th, .azun-company td { padding: 18px 16px; border-bottom: 1px solid #E5E5E5; text-align: left; vertical-align: top; }
.azun-company tr:first-child th, .azun-company tr:first-child td { border-top: 1px solid #111; }
.azun-company th { width: 200px; font-weight: 700; background: #F4F4F4; }
@media (max-width: 600px) { .azun-company th, .azun-company td { display: block; width: auto; } .azun-company td { border-bottom: 0; padding-top: 8px; } }
.azun-map iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; }
/* お問い合わせフォーム */
.wpcf7 .azun-form p { margin: 0 0 24px; }
.wpcf7 .azun-form label { font-weight: 700; display: block; }
.wpcf7 .azun-form .req { display: inline-block; margin-left: 8px; padding: 0 6px; background: #111; color: #fff; font-size: 11px; vertical-align: .1em; }
.wpcf7 input[type=text], .wpcf7 input[type=email], .wpcf7 input[type=tel], .wpcf7 textarea { width: 100%; padding: 12px 14px; border: 1px solid #BBB; border-radius: 0; font: inherit; margin-top: 8px; box-sizing: border-box; }
.wpcf7 .wpcf7-checkbox .wpcf7-list-item { display: inline-block; margin: 8px 20px 0 0; font-weight: 400; }
.wpcf7 .wpcf7-acceptance { font-weight: 400; }
.wpcf7 input[type=submit] { background: #111; color: #fff; border: 0; padding: 16px 56px; font-weight: 700; font: inherit; font-weight: 700; cursor: pointer; }
.wpcf7 input[type=submit]:disabled { background: #999; }

/* インスタグラム欄（写真の並び） */
.azun-insta { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.azun-insta img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; transition: opacity .2s; }
.azun-insta a:hover img { opacity: .8; }
@media (max-width: 781px) { .azun-insta { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* インスタグラム（Smash Balloon）の見た目をサイトに合わせる */
#sb_instagram { padding-bottom: 0 !important; }
#sb_instagram .sbi_photo_wrap, #sb_instagram .sbi_photo { border-radius: 0 !important; }
#sb_instagram #sbi_load, #sb_instagram .sb_instagram_header { display: none !important; }
#sb_instagram #sbi_images { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 8px !important; padding: 0 !important; }
#sb_instagram .sbi_item { width: auto !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
#sb_instagram .sbi_item:nth-child(n+7) { display: none !important; }
@media (max-width: 781px) { #sb_instagram #sbi_images { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }

/* Googleクチコミ（Trustindex）をモノクロ基調に */
.azun-voice .ti-widget .ti-review-item > .ti-inner { border-radius: 0 !important; background: #F4F4F4 !important; border: 0 !important; }
.azun-voice .ti-widget .ti-read-more span, .azun-voice .ti-widget .ti-read-more a { color: #111 !important; }

/* ---------- UI調整（v0.3.1） ---------- */
/* 表：WordPress標準の縦線・外枠を消して、横線だけに統一 */
.azun-company table, .azun-spec table { border: 0 !important; }
.azun-company th, .azun-company td, .azun-spec th, .azun-spec td { border: 0 !important; border-bottom: 1px solid #E5E5E5 !important; }
.azun-company tr:first-child th, .azun-company tr:first-child td, .azun-spec tr:first-child th, .azun-spec tr:first-child td { border-top: 2px solid #111 !important; }
.azun-company, .azun-spec { margin: 0; }
/* ヘッダー下の線：お問い合わせボタンや写真の上で白く見えないよう、影で表現 */
.azun-header { border-bottom-width: 0 !important; box-shadow: 0 1px 0 rgba(0, 0, 0, .08); }
/* 右側の「ご相談はこちら」タブの白い縁取りを削除 */
.azun-side-cta { box-shadow: none; }
/* スマホ：トップのメイン画像を小さく、文字も読みやすく */
@media (max-width: 781px) {
	.azun-fv, .wp-block-cover.alignfull.is-position-bottom-left { min-height: 420px !important; padding-top: 40px !important; padding-bottom: 36px !important; }
	.azun-fv h1, .wp-block-cover.alignfull.is-position-bottom-left h1 { font-size: 26px !important; line-height: 1.5 !important; letter-spacing: .04em !important; }
	.azun-fv p, .wp-block-cover.alignfull.is-position-bottom-left p { font-size: 13px; line-height: 1.8; }
	.azun-svc-hero { padding-top: 56px !important; padding-bottom: 56px !important; }
}
@media (max-width: 781px) {
	.azun-fv h1, .wp-block-cover.alignfull.is-position-bottom-left h1 { font-size: 21px !important; letter-spacing: .02em !important; }
	.azun-svc .wp-block-post-content h2 { font-size: 20px !important; }
}
@media (max-width: 600px) {
	.azun-company tr:first-child td, .azun-spec tr:first-child td { border-top: 0 !important; }
	.azun-company th { border-bottom: 0 !important; }
}

@media (max-width: 781px) {
	.single main .wp-block-post-title { font-size: 24px !important; }
}

/* スマホ：ヘッダー下の線（影）を出さない */
@media (max-width: 781px) {
	.azun-header { box-shadow: none !important; border: 0 !important; }
	.wp-site-blocks > .wp-block-template-part:has(> .azun-header) { background: #fff; border: 0; box-shadow: none; }
	.azun-header .wp-block-navigation__responsive-container-open { border: 0 !important; background: transparent !important; box-shadow: none !important; }
}

.azun-area-map { margin: 0; }
.azun-area-map img { width: 100%; height: auto; display: block; }

/* ヘッダーの会社名（TOPへのリンク）。スマホでも表示 */
.azun-header .azun-header__name a { color: inherit; text-decoration: none; }
.azun-header .azun-header__name a:hover { opacity: .7; }
@media (max-width: 781px) {
	.azun-header .azun-header__name { display: block !important; font-size: 14px !important; }
}

/* header logo smaller (0.3.8) */
.azun-header .azun-header__logo img{height:38px !important;width:auto !important}
@media (max-width:781px){.azun-header .azun-header__logo img{height:30px !important}}

/* 事業内容タイル：写真全体をリンクにする (0.3.16) */
.azun-tile { position: relative; isolation: isolate; cursor: pointer; }
.azun-tile .wp-block-cover__image-background { z-index: -2 !important; transition: transform .5s ease; }
.azun-tile .wp-block-cover__background { z-index: -1 !important; }
.azun-tile .wp-block-cover__inner-container, .azun-tile h3, .azun-tile h3 a { position: static !important; }
.azun-tile h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.azun-tile:hover .wp-block-cover__image-background { transform: scale(1.04); }

/* 見出しサイズのバランス調整 (0.3.17)  ※見出しの階層（h1/h2/h3）は変更なし */
body {
	--wp--preset--font-size--xx-large: clamp(26px, 1.8vw + 10px, 36px);
	--wp--preset--font-size--x-large: clamp(20px, 1vw + 14px, 28px);
	--wp--preset--font-size--large: clamp(17px, .3vw + 14px, 19px);
}
@media (min-width: 782px) {
	.azun-fv h1 { font-size: clamp(30px, 2.2vw + 8px, 40px) !important; }
}
.azun-tile h3 { font-size: clamp(17px, .4vw + 13px, 19px) !important; }
.azun-svc .wp-block-post-content h2, .azun-svc-contact h2 { font-size: clamp(20px, .8vw + 12px, 24px) !important; }
.azun-svc-columns__head h2 { font-size: clamp(18px, .6vw + 12px, 21px); }
.azun-svc .azun-svc-item h3 { font-size: 18px; }
.single main .wp-block-post-title { font-size: clamp(22px, 1vw + 14px, 28px); }
.has-dark-background-color h1 { font-size: clamp(26px, 1.8vw + 10px, 36px) !important; }

/* 下層ページ上部（黒い帯・パンくず・本文の始まり）の余白を全ページで統一 (0.3.20) */
.wp-site-blocks > :first-child + .has-dark-background-color.alignfull { padding-top: 64px !important; padding-bottom: 64px !important; }
.wp-site-blocks > :has(> .azun-breadcrumb), .wp-site-blocks > :has(> * > .azun-breadcrumb) { margin-top: 0 !important; padding-top: 20px !important; }
.azun-breadcrumb { margin-top: 0 !important; }
.wp-site-blocks > :has(.azun-breadcrumb) + main { margin-top: 0 !important; padding-top: 48px !important; }
body:not(.home) .wp-site-blocks > :first-child + main { padding-top: 80px !important; }
.azun-breadcrumb ~ p { display: none !important; }
@media (max-width: 781px) {
	.wp-site-blocks > :first-child + .has-dark-background-color.alignfull { padding-top: 36px !important; padding-bottom: 36px !important; }
	.wp-site-blocks > :has(> .azun-breadcrumb), .wp-site-blocks > :has(> * > .azun-breadcrumb) { padding-top: 14px !important; }
	.wp-site-blocks > :has(.azun-breadcrumb) + main { padding-top: 28px !important; }
	body:not(.home) .wp-site-blocks > :first-child + main { padding-top: 56px !important; }
}