@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/**
 * PC: fixed side header
 */
@media (min-width: 960px) {
	:root {
		--hanakama-side-header-width: 280px;
	}

	#body_wrap {
		padding-left: var(--hanakama-side-header-width);
	}

	#header {
		background: var(--color_header_bg);
		/* border-right: 1px solid var(--color_border); */
		box-shadow: none;
		height: calc(100dvh - var(--swl-adminbarH, 0px));
		left: 0;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		position: fixed !important;
		top: var(--swl-adminbarH, 0px);
		width: var(--hanakama-side-header-width);
		z-index: 1000;
	}

	#header .l-header__inner {
		align-items: stretch;
		color: var(--color_header_text);
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		max-width: none;
		min-height: 100%;
		padding: 40px 48px 40px;
		width: 100%;
	}

	#header .l-header__logo {
		display: block;
		flex: none;
		margin: 0 0 40px;
		padding: 0;
		width: 100%;
	}

	#header .c-headLogo {
		display: block;
		height: auto;
		margin: 0;
		max-width: none;
		width: 100%;
	}

	#header .c-headLogo__link {
		display: block;
	}

	#header .c-headLogo__img {
		display: block;
		height: 250px;
		/* max-height: 200px; */
		max-width: 100%;
		width: auto;
	}

	#header .c-headLogo.-txt .c-headLogo__link {
		font-size: 20px;
		line-height: 1.6;
		white-space: normal;
	}

	#header .l-header__gnav {
		flex: none;
		margin: 0;
		width: 100%;
	}

	#header .c-gnav {
		align-items: stretch;
		display: flex;
		flex-direction: column;
		height: auto;
		text-align: left;
		width: 100%;
	}

	#header .c-gnav > .menu-item {
		height: auto;
		width: 100%;
	}

	#header .c-gnav > .menu-item > a {
		display: block;
		height: auto;
		padding: 10px 0;
		white-space: normal;
	}

	#header .c-gnav > .menu-item > a::after {
		display: none;
	}

	#header .c-gnav > .menu-item > a .ttl {
		font-size: 14px;
		line-height: 1.6;
	}

	#header .w-header {
		display: block;
		flex: none;
		margin: 32px 0 0;
		width: 100%;
	}

	#header .w-header__inner {
		display: block;
	}

	#fix_header {
		display: none !important;
	}
}

/**
 * SP: transparent header over the top-page main visual
 */
@media not all and (min-width: 960px) {
	#body_wrap.top #header {
		position: fixed !important;
	}

	[data-scrolled="false"] #body_wrap.top #header {
		background: transparent;
		box-shadow: none !important;
	}

	[data-scrolled="true"] #body_wrap.top #header {
		background: var(--color_header_bg);
	}

	/**
	 * Hamburger icon with three different line lengths
	 */
	#body_wrap.top .l-header__menuBtn .icon-menu-thin {
		height: 16px;
		width: 24px;
	}

	#body_wrap.top .l-header__menuBtn .icon-menu-thin::before {
		background-image:
			linear-gradient(currentColor, currentColor),
			linear-gradient(currentColor, currentColor),
			linear-gradient(currentColor, currentColor);
		background-position:
			left top,
			left center,
			left bottom;
		background-repeat: no-repeat;
		background-size:
			24px 2px,
			18px 2px,
			12px 2px;
		content: "";
		height: 100%;
		width: 100%;
	}

	#body_wrap:not(.top) .l-header__menuBtn .c-iconBtn__label {
		display: none;
	}

	/**
	 * Full-width mobile menu with a subtle fade-up animation
	 */
	.p-spMenu__overlay {
		display: none;
	}

	.p-spMenu__inner {
		box-shadow: none;
		left: 0;
		opacity: 0;
		right: 0;
		transition:
			opacity 0.75s ease,
			transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
		width: 100%;
	}

	[data-spmenu="closed"] .p-spMenu__inner {
		transform: translateY(16px);
	}

	[data-spmenu="opened"] .p-spMenu__inner {
		opacity: 1;
		transform: translateY(0);
	}

	.hanakama-spmenu-logo {
		height: 136px;
		left: 10vw;
		position: absolute;
		top: 10px;
		z-index: 1;
	}

	.hanakama-spmenu-logo .c-headLogo {
		height: 100%;
	}

	.hanakama-spmenu-logo .c-headLogo__link,
	.hanakama-spmenu-logo .c-headLogo__img {
		display: block;
		height: 100%;
		width: auto;
	}

	.hanakama-spmenu-logo .c-headLogo__img.-top {
		display: none;
	}

	.hanakama-spmenu-logo .c-headLogo__img.-common {
		display: block;
	}

	.p-spMenu__body {
		padding-top: 60px;
	}

	.c-widget__title.-spmenu {
		display: none;
	}

	#body_wrap.top .p-spMenu__closeBtn {
		background-color: var(--color_main);
		color: #fff;
	}
}

/**
 * Main visual label
 */
.hanakama-mv-label {
	color: #fff;
	font-family: serif;
	font-size: 10px;
	font-weight: 400;
	letter-spacing: 0.3em;
	line-height: 2;
	margin: 0;
	position: absolute;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
	white-space: nowrap;
	writing-mode: vertical-rl;
	z-index: 4;
}

@media (min-width: 960px) {
	.hanakama-mv-label {
		font-size: 13px;
		right: 1.8em;
		top: 50%;
		transform: translateY(-50%);
	}
}

@media not all and (min-width: 960px) {
	.hanakama-mv-label {
		bottom: 20px;
		left: 12px;
	}
}
