/* ========================================
   Header
======================================== */

.l-header{
	background:#fff;
	border-top:4px solid var(--color-main,#2b6f8a);
	border-bottom:1px solid var(--color-border,#dfe5e8);
}

.l-header__inner{
	width:min(1240px,calc(100% - 40px));
	margin-inline:auto;
	display:grid;
	grid-template-columns:auto 1fr auto;
	align-items:center;
	gap:32px;
	padding:24px 0 20px;
}

.c-site-brand{
	display:flex;
	align-items:center;
	gap:16px;
	color:var(--color-main);
	text-decoration:none;
}

.c-site-brand__logo{
	width:70px;
	height:70px;
	object-fit:contain;
	flex-shrink:0;
}

.c-site-brand__city{
	display:block;
	font-size:15px;
	font-weight:800;
	line-height:1.2;
}

.c-site-brand__name{
	display:block;
	margin-top:3px;
	font-size:28px;
	font-weight:900;
	line-height:1.2;
}

.c-site-brand__department{
	display:block;
	margin-top:7px;
	font-size:13px;
	font-weight:700;
	color:#555;
}

@media (max-width:900px){

	.c-site-brand{
		flex:1;
		min-width:0;
		gap:10px;
	}

	.c-site-brand__logo{
		width:50px;
		height:50px;
	}

	.c-site-brand__city{
		font-size:13px;
	}

	.c-site-brand__name{
		font-size:21px;
	}

	.c-site-brand__department{
		margin-top:4px;
		font-size:11px;
	}
	.l-header .c-site-brand{
		padding:14px 12px;
	}
}

@media (max-width:560px){

	.c-site-brand__logo{
		width:44px;
		height:44px;
	}

	.c-site-brand__city{
		font-size:12px;
	}

	.c-site-brand__name{
		font-size:18px;
	}

	.c-site-brand__department{
		font-size:10px;
	}
}

.l-footer .c-site-brand{
	padding:0;
}

.l-header__lead{
	margin:0;
	color:#333;
	font-size:15px;
	font-weight:600;
	line-height:1.8;
}

.l-header__tools{
	display:flex;
	align-items:center;
	gap:22px;
}

.l-header__tel{
	display:flex;
	align-items:center;
	gap:12px;
	color:var(--color-main,#2b6f8a);
	text-decoration:none;
	white-space:nowrap;
}

.l-header__tel-icon{
	display:grid;
	place-items:center;
	width:38px;
	height:38px;
	flex-shrink:0;
	color:var(--color-main,#2b6f8a);
}

.l-header__tel-svg{
	width:34px;
	height:34px;
	display:block;
	fill:currentColor;
	stroke:currentColor;
}

.l-header__tel-label{
	display:block;
	margin-bottom:2px;
	color:#555;
	font-size:13px;
	font-weight:800;
}

.l-header__tel strong{
	display:block;
	font-size:30px;
	font-weight:900;
	line-height:1.1;
	letter-spacing:.03em;
}

.l-header__action-group{
	display:grid;
	gap:8px;
	width:190px;
}

.l-header__web,
.l-header__access{
	position:relative;
	display:flex;
	align-items:center;
	gap:10px;
	min-height:44px;
	padding:0 34px 0 16px;
	border:1px solid var(--color-main,#2b6f8a);
	border-radius:4px;
	text-decoration:none;
	font-size:15px;
	font-weight:800;
	white-space:nowrap;
}

.l-header__web{
	background:var(--color-main,#2b6f8a);
	color:#fff;
}

.l-header__access{
	background:#fff;
	color:var(--color-main,#2b6f8a);
}

.l-header__action-icon{
	display:grid;
	place-items:center;
	width:20px;
	height:20px;
	flex-shrink:0;
}

.l-header__action-svg{
	width:20px;
	height:20px;
	display:block;
	fill:none;
	stroke:currentColor;
}

.l-header__web em,
.l-header__access em{
	position:absolute;
	right:14px;
	top:50%;
	transform:translateY(-50%);
	font-style:normal;
	font-size:20px;
	line-height:1;
}

.l-header__web:hover,
.l-header__access:hover,
.l-header__tel:hover{
	opacity:.86;
}

/* ========================================
   Global Nav
======================================== */

.l-global-nav{
	border-top:1px solid var(--color-border,#dfe5e8);
	background:#fff;
}

.l-global-nav__list{
	width:min(1240px,100%);
	margin:0 auto;
	padding:0;
	list-style:none;
	display:grid;
	grid-template-columns:repeat(6,1fr);
}

.l-global-nav__list li{
	border-left:1px dotted #b8cbd8;
}

.l-global-nav__list li:last-child{
	border-right:1px dotted #b8cbd8;
}

.l-global-nav__list a{
	min-height:78px;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:12px;
	color:var(--color-text,#333);
	text-decoration:none;
	font-size:17px;
	font-weight:800;
	letter-spacing:.02em;
	line-height:1.4;
}

.l-global-nav__list a:hover{
	background:#f3f8fb;
	color:var(--color-main,#2b6f8a);
}

.l-global-nav__icon{
	display:grid;
	place-items:center;
	width:30px;
	height:30px;
	color:var(--color-main,#2b6f8a);
	flex-shrink:0;
}

.l-global-nav__icon-svg{
	width:28px;
	height:28px;
	display:block;
	fill:none;
	stroke:currentColor;
}

/* ========================================
   SP Header
======================================== */

.l-header__sp-actions{
	display:none;
}

@media (max-width:1100px){
	.l-header__inner{
		grid-template-columns:auto auto;
		justify-content:space-between;
	}

	.l-header__lead{
		display:none;
	}
}

@media (max-width:900px){
	.l-header{
		position:sticky;
		top:0;
		z-index:9000;
		border-top-width:3px;
	}

	.l-header__inner{
		width:100%;
		display:flex;
		align-items:stretch;
		gap:0;
		padding:0;
		border-bottom:1px solid var(--color-border,#dfe5e8);
	}

	.l-header__tools{
		display:none;
	}

	.l-header__sp-actions{
		display:grid;
		grid-template-columns:64px 78px 84px;
	}

	.l-header__sp-actions a,
	.l-header__sp-actions button{
		border:0;
		border-left:1px solid var(--color-border,#dfe5e8);
		background:#fff;
		color:var(--color-text,#333);
		text-decoration:none;
		font-size:11px;
		font-weight:800;
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		gap:5px;
		cursor:pointer;
	}

	.l-header__sp-actions a > span{
		display:grid;
		place-items:center;
		width:24px;
		height:24px;
		color:var(--color-main,#2b6f8a);
	}

	.l-header__sp-icon-svg{
		width:22px;
		height:22px;
		display:block;
		fill:none;
		stroke:currentColor;
	}

	.l-header__menu-button{
		background:var(--color-main,#2b6f8a) !important;
		color:#fff !important;
	}

	.l-header__hamburger{
		width:26px;
		height:2px;
		background:#fff;
		position:relative;
		display:block;
		margin-bottom:8px;
		border-radius:999px;
	}

	.l-header__hamburger::before,
	.l-header__hamburger::after{
		content:"";
		position:absolute;
		left:0;
		width:26px;
		height:2px;
		background:#fff;
		border-radius:999px;
	}

	.l-header__hamburger::before{
		top:-8px;
	}

	.l-header__hamburger::after{
		top:8px;
	}

	.l-global-nav{
		display:none;
	}
}

@media (max-width:560px){
	.l-header__brand{
		padding:12px 10px;
	}

	.l-header__logo{
		width:44px;
		height:44px;
	}

	.l-header__city{
		font-size:12px;
	}

	.l-header__name{
		font-size:18px;
	}

	.l-header__department{
		font-size:10px;
	}

	.l-header__sp-actions{
		grid-template-columns:58px 68px 74px;
	}

	.l-header__sp-actions a,
	.l-header__sp-actions button{
		font-size:10px;
	}
}

/* ========================================
   Drawer
======================================== */

body.is-drawer-open{
	overflow:hidden;
}

.l-drawer{
	position:fixed;
	inset:0;
	z-index:9999;
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:opacity .25s ease,visibility .25s ease;
}

.l-drawer.is-open{
	opacity:1;
	visibility:visible;
	pointer-events:auto;
}

.l-drawer__overlay{
	position:absolute;
	inset:0;
	background:rgba(24,52,77,.32);
	backdrop-filter:blur(1px);
}

.l-drawer__panel{
	position:absolute;
	top:0;
	right:0;
	width:min(84vw,380px);
	height:100%;
	background:#fff;
	transform:translateX(100%);
	transition:transform .28s ease;
	overflow:auto;
	box-shadow:-10px 0 28px rgba(0,0,0,.14);
}

.l-drawer.is-open .l-drawer__panel{
	transform:translateX(0);
}

.l-drawer__head{
	display:flex;
	align-items:stretch;
	justify-content:space-between;
	border-bottom:1px solid var(--color-border,#dfe5e8);
}

.l-drawer__brand{
	display:flex;
	align-items:center;
	gap:10px;
	min-width:0;
	padding:14px 12px;
	color:#222;
	text-decoration:none;
}

.l-drawer__logo{
	width:42px;
	height:42px;
	object-fit:contain;
	flex-shrink:0;
}

.l-drawer__brand-name{
	display:block;
	font-size:1rem;
	font-weight:900;
	line-height:1.35;
}

.l-drawer__brand-department{
	display:block;
	margin-top:2px;
	font-size:.78rem;
	font-weight:700;
	line-height:1.4;
	color:#555;
}

.l-drawer__close{
	width:72px;
	border:0;
	background:var(--color-main,#2b6f8a);
	color:#fff;
	font-size:.8rem;
	font-weight:800;
	cursor:pointer;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:4px;
	flex-shrink:0;
}

.l-drawer__close-mark{
	position:relative;
	width:24px;
	height:24px;
	display:block;
}

.l-drawer__close-mark::before,
.l-drawer__close-mark::after{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	width:28px;
	height:2px;
	background:#fff;
	border-radius:999px;
}

.l-drawer__close-mark::before{
	transform:translate(-50%,-50%) rotate(45deg);
}

.l-drawer__close-mark::after{
	transform:translate(-50%,-50%) rotate(-45deg);
}

.l-drawer__nav{
	padding:22px 18px 20px;
}

.l-drawer__nav ul{
	margin:0;
	padding:0;
	list-style:none;
}

.l-drawer__nav li{
	border-bottom:1px solid #e3edf2;
}

.l-drawer__nav a{
	display:flex;
	align-items:center;
	gap:12px;
	min-height:56px;
	color:#333;
	text-decoration:none;
	font-size:16px;
	font-weight:700;
	line-height:1.45;
}

.l-drawer__nav a::before{
	content:"→";
	display:grid;
	place-items:center;
	width:28px;
	height:28px;
	border-radius:50%;
	background:var(--color-main,#2b6f8a);
	color:#fff;
	font-size:.8rem;
	font-weight:900;
	flex-shrink:0;
}

.l-drawer__nav a:hover{
	background:#f5f9fb;
	color:var(--color-main,#2b6f8a);
}

.l-drawer__actions{
	padding:0 18px 24px;
	display:grid;
	gap:10px;
}

.l-drawer__action{
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:48px;
	border-radius:10px;
	text-decoration:none;
	font-size:15px;
	font-weight:800;
}

.l-drawer__action--tel{
	border:1px solid var(--color-main,#2b6f8a);
	color:var(--color-main,#2b6f8a);
	background:#fff;
}

.l-drawer__action--access{
	background:#d9783d;
	color:#fff;
}

.l-drawer__action--web{
	background:var(--color-main,#2b6f8a);
	color:#fff;
}

@media (min-width:901px){
	.l-drawer{
		display:none;
	}
}

@media (max-width:480px){
	.l-drawer__panel{
		width:88vw;
	}

	.l-drawer__brand-name{
		font-size:.95rem;
	}

	.l-drawer__brand-department{
		font-size:.72rem;
	}

	.l-drawer__nav a{
		min-height:52px;
		font-size:15px;
	}

	.l-drawer__action{
		min-height:46px;
		font-size:14px;
	}
}
