@charset "UTF-8";

/* 
	2023.4.22		.dis-pcなどを修正
	2023.10.26	タブレット
							.navbar-nav .open .dropdown-menu {
								position: static;
	2026.7.8			ネスト
*/

#nav-skiplink {
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	overflow: hidden;
}

.skip {
	position: relative;
	text-align: center;
	width: 100%;
	margin: 0;

	a {
		height: 0;
		width: 0;
		font-size: 0.1%;
		line-height: 0.1;
		position: absolute;
		top: -500px;
		left: 0;
		z-index: 9999;
		padding: 4px 0;
		overflow: hidden;

		:is(&:active, &a:focus) {
			display: block;
			height: auto;
			width: 100%;
			margin: 0 auto;
			font-size: 100%;
			left: 0;
			right: 0;
			top: 0;
			line-height: 1.5;
		}

		.skip_none {
			display: none;
			height: 0;
			width: 0;
		}

	}

}

.ruby_flag .logo,
.lg-ruby {
	display: none;
}

.logo,
.ruby_flag .lg-ruby {
	display: block;
}

/* タブレットからnavbar-toggle  */
@media (max-width: 1200px) {
	.navbar-header {
		float: none;
	}

	.navbar-toggle {
		display: block;
	}

	.navbar-collapse {
		border-top: 1px solid transparent;
		box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
	}

	.navbar-collapse.collapse {
		display: none !important;
	}

	.navbar-nav {
		float: none !important;
		margin: 7.5px -15px;

		.dropdown-menu {
			width: 100%;
		}

		li {
			float: none;

			a {
				padding: 10px 0;
			}
		}
	}

	.navbar-text {
		float: none;
		margin: 15px 0;
	}

	.navbar-collapse.collapse.in {
		display: block !important;
		margin-bottom: 100vh;
	}

	.collapsing {
		overflow: hidden !important;
	}

}

/* PC	*/
@media screen and (min-width:1200px) {
	header ul {
		display: flex;
		justify-content: flex-end;
	}

	.navbar-nav li {
		flex-direction: row;
		margin-right: auto;
	}

	.navbar-inverse {

		.navbar-nav {
			margin-top: 105px;
		}

		.navbar-brand {
			padding: 5px 10px 0 0;
			font-size: 3em;
			line-height: 2;

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

		#menu-button {
			position: absolute;
			top: 5px;
			left: 45%;
			font-size: 1.2em;
			line-height: 1;
			text-align: right;
		}

		.tel {
			position: absolute;
			top: 5px;
			left: 80%;
			font-size: 1em;
			line-height: 1;
			text-align: right;
		}
	}

	a:focus {
		outline: dotted 1px #555 !important;
	}

	header a:focus {
		outline: dotted 0 #555 !important;
	}
}

/*	TB	*/
@media screen and (min-width:768px) and (max-width:1200px) {

	.container>.navbar-header {
		position: relative;
		height: 121px;
	}

	.navbar-inverse {
		.navbar-brand img {
			max-width: 180px;
			height: auto;
			margin: 0;
		}

		#menu-button {
			position: absolute;
			top: 25px;
			left: 45%;
			font-size: 1.2em;
			line-height: 1;
			text-align: right;
		}

		.tel {
			position: absolute;
			top: 5px;
			left: 70%;
			font-size: 1em;
			line-height: 1;
			text-align: right;
		}

	}

	.navbar-toggle {
		position: absolute;
		top: 85px;
		left: 0;
		margin: 0;
		font-size: 1em;
		line-height: 1;
		text-align: right;
	}

	.navbar-nav>li.dis-tbsp {
		display: block !important;
	}

	.navbar-nav .open .dropdown-menu {
		position: static;
		float: none;
		width: auto;
		margin-top: 0;
	}

	.navbar-collapse {
		overflow-y: auto;
		max-height: 100vh;
	}

}

/*  SP	*/
@media screen and (max-width:767px) {
	.container>.navbar-header {
		position: relative;
		height: 121px;
	}

	.navbar-inverse {

		.navbar-brand {
			float: left;
			padding: 15px 0;
			font-size: 1.8em;
			line-height: 20px;

			img {
				max-width: 180px;
				height: auto;
				margin: 0 0 0 10px;
			}
		}

		#menu-button {
			position: absolute;
			top: 85px;
			left: 35%;
			font-size: 1.2em;
			line-height: 1;
			text-align: right;
		}

		.tel {
			position: absolute;
			top: 5px;
			left: 60%;
			font-size: 1em;
			line-height: 1;
			text-align: right;
		}

	}

	.navbar-toggle {
		position: absolute;
		top: 85px;
		left: 2%;
		margin: 0;
		font-size: 1em;
		line-height: 1;
		text-align: right;
	}

	.navbar-nav>li.dis-tbsp,
	.navbar-nav>li.dis-sp {
		display: block !important;
	}


	.navbar-collapse {
		overflow-y: auto;
		max-height: 100vh;
	}
}