@charset "utf-8";

/* フォントが読み込まれるまでテキストを非表示 */
html h1,
html h2,
html h3,
html h4,
html h5,
html h6,
html p,
html a,
html span,
html table td,
html #menu .example ul li {
	visibility: hidden;
}

html.wf-active h1,
html.wf-active h2,
html.wf-active h3,
html.wf-active h4,
html.wf-active h5,
html.wf-active h6,
html.wf-active p,
html.wf-active a,
html.wf-active span,
html.wf-active table td,
html.wf-active #menu .example ul li {
	visibility: visible;
}

html {
	font-size: 62.5%;
	overflow-y: auto;
}

body {
	font-family: dnp-shuei-mincho-pr6, serif;
	font-weight: 400;
	font-style: normal;
	background-color: #151210;
	overflow: hidden;
}

#container {
	color: #ffffff;
	background-color: #151210;
	position: relative;
	padding-top: 134px;
}

#container a {
	color: #ffffff;
	white-space: nowrap;
}

section {
	min-width: 1200px;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 0 40px;
}

.inner {
	position: relative;
	width: 1200px;
	height: 100%;
	margin: auto;
}

img {
	max-width: 100%;
}

.btn {
	margin: 0 auto;
	position: relative;
	text-align: center;
}

.btn a {
	position: relative;
	display: inline-block;
	font-size: 2rem;
	font-weight: 400;
	line-height: 1.3;
	padding: 1.3rem 10.7rem 1.5rem;
	letter-spacing: 0.4rem;
	border: 1px solid #ffffff;
	min-width: 400px;
	white-space: normal !important;
}
.btn a::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 17px;
	background-image: url(../img/arrow.png);
	background-repeat: no-repeat;
	background-size: 100%;
	width: 82px;
	height: auto;
	object-fit: cover;
	aspect-ratio: 82 / 8;
	margin-top: 2px;
}
/*---------- header ----------*/
header {
	height: 134px;
	padding: 0 40px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	background-color: #151210;
}
header nav {
	/* 多言語アイコン */
	margin-right: 40px;
}
header .inner {
	display: flex;
	justify-content: center;
	align-items: center;
	width: initial;
	gap: 50px;
}
header .info {
	display: none;
}

header .info a {
	border: 1px solid #ffffff;
	font-size: 1.8rem;
	letter-spacing: 0.18rem;
	padding: 16px 46px 18px;
	display: inline-block;
}
header .logo {
	width: 150px;
	display: inline-block;
}
.header__tool {
	position: relative;
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
}
header nav .menuBtn__wrap {
	display: none;
	transition: all 0.1s ease;
	cursor: pointer;
}
header nav .menuBtn__inner {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
}
@media (hover: hover) and (pointer: fine) {
	header nav .menuBtn__wrap:hover {
		opacity: 0.7;
	}
}
header #menu__base {
	display: flex;
	flex-wrap: wrap;
	gap: 20px 40px;
}

header #menu__base li:last-child {
	display: none;
}

header #menu__base li a {
	padding: 10px 0;
	font-size: 1.8rem;
	font-weight: 400;
	letter-spacing: 0.28rem;
}

header nav .overlay {
	display: none;
}

header.fixed {
	position: fixed;
	z-index: 1000;
	padding: 20px 40px;
	background-color: rgba(21, 18, 16, 0.8);
}

header.fixed nav ul {
	/* padding-top: 34px; */
}

/*---------- head ----------*/
#head {
	background-size: 2000px;
	background-color: #000000;
	text-align: center;
	padding-top: 165px;
	padding-bottom: 183px;
}

#head h1 {
	font-size: 4rem;
	letter-spacing: 0.3rem;
	font-weight: 600;
}

#head h1 .img {
	display: inline-block;
	width: 140px;
	vertical-align: bottom;
}

#head h1 span {
	display: inline-block;
	margin-left: -3px;
	padding-bottom: 2px;
}

/*---------- movie ----------*/
#movie .videoWrap {
	position: relative;
	width: 100%;
	height: 0;
	padding-top: 56.2%;
}

#movie .videoWrap iframe {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

/*---------- footer ----------*/
footer {
	text-align: center;
	padding-top: 119px;
}

footer .logo {
	width: 196px;
	margin: 0 auto;
	padding-right: 11px;
}

footer .tel {
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
	width: 800px;
	margin: 67px auto 62px;
	padding: 27px 0 24px;
	line-height: 1.22;
	font-size: 1.8rem;
	letter-spacing: 0.3rem;
}

footer .tel span {
	font-size: 2.3rem;
}

footer .tel a {
	font-size: 4.2rem;
	letter-spacing: 0.04rem;
}

footer .info {
	text-align: initial;
	font-size: 1.8rem;
	letter-spacing: 0.25rem;
	margin: 0 auto 73px;
	width: 695px;
}
footer .info table {
	width: 100%;
}
footer .info td {
	padding-bottom: 21px;
	line-height: 1.7;
}
footer .info td {
	width: 30px;
}

footer .footer__nav {
	background-image: url(../img/footer_bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	padding: 13px 40px 19px;
}

footer .footer__nav > ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	max-width: 1200px;
	width: 100%;
	gap: 3.3%;
	margin: auto;
}

footer .footer__nav li a {
	display: block;
	font-size: 1.8rem;
	letter-spacing: 0.2rem;
	font-weight: 400;
	padding: 10px 20px;
}

footer .copyRight {
	padding: 68px 0 105px;
	font-size: 1.8rem;
	letter-spacing: 0.01rem;
}

/*---------- アニメーション ----------*/
.fadeUp {
	opacity: 0;
	transform: translate3d(0, 50px, 0);
}

.fadeUp.active {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

/*---------- hover ----------*/
@media (hover: hover) and (pointer: fine) {
	a {
		transition: all 0.1s ease;
	}

	a:hover {
		opacity: 0.7;
	}

	.btn a:hover {
		background-color: rgba(255, 255, 255, 0.2);
	}

	.tel a:hover {
		opacity: 1;
	}
}
@media screen and (min-width: 1280px) {
	header nav #menu__baseWrap {
		display: block !important;
	}
}
/*---------- 1280pxより小さい画面 ----------*/
@media screen and (max-width: 1279px) {
	img {
		width: 100%;
	}
	section {
		min-width: initial;
	}
	.inner {
		width: 100%;
	}
	header .inner {
		justify-content: space-between;
	}
	header .info {
		display: block;
	}
	header .logo {
		width: 140px;
	}
	.header__tool {
		flex-direction: row;
	}
	header nav {
		margin-right: initial;
		margin-left: 40px;
	}
	header nav .menuBtn__wrap {
		display: block;
		position: relative;
		width: 100px;
		height: 50px;
		z-index: 999;
	}
	header nav .menuBtn {
		position: relative;
		width: 100%;
		height: 100%;
	}
	header nav.active .menuBtn {
		width: 70px;
	}
	header nav .menuBtn span {
		display: inline-block;
		transition: all 0.4s;
		position: absolute;
		left: 0;
		height: 1px;
		background-color: #ffffff;
	}

	header nav .menuBtn span:nth-of-type(1) {
		top: 10px;
		width: 100%;
	}

	header nav .menuBtn span:nth-of-type(2) {
		top: 40px;
		width: 70%;
	}
	header nav.active .menuBtn span {
		top: 50% !important;
		left: 50% !important;
		width: 100%;
	}
	header nav.active .menuBtn span:nth-of-type(1) {
		transform: translate(-50%) rotate(-45deg);
	}

	header nav.active .menuBtn span:nth-of-type(2) {
		transform: translate(-50%) rotate(45deg);
	}
	header #menu__baseWrap {
		display: none;
		padding: initial;
		margin: initial;
		position: fixed;
		width: 47.7%;
		height: 100%;
		top: 0;
		right: 0;
		background: rgba(0, 0, 0, 0.92);
		z-index: 99;
	}
	header #menu__base {
		flex-direction: column;
		padding-top: 180px;
		gap: initial;
	}

	header #menu__base li {
		margin: 0 40px;
		position: relative;
	}

	header #menu__base li:last-child {
		display: block;
		font-size: 2.3rem;
		letter-spacing: 0.15rem;
		padding-top: 60px;
	}

	header #menu__base li:last-child a {
		margin-top: 25px;
		border: 1px solid #ffffff;
		font-size: 3rem !important;
		padding: 16px 0 28px !important;
	}

	header #menu__base li:after {
		content: '';
		width: 100%;
		height: 1px;
		position: absolute;
		bottom: 0;
		left: 0;
		background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.7) 15%, rgba(255, 255, 255, 0.7) 85%, rgba(0, 0, 0, 0) 100%);
	}

	header #menu__base li:last-child:after {
		display: none;
	}

	header #menu__base li > a {
		padding: 23px 0 34px;
		display: block;
		font-size: 2.3rem;
		text-align: center;
	}

	header nav .overlay {
		width: 100%;
		height: 100%;
		background: transparent;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 10;
	}
	header nav.active .overlay {
		display: block;
	}

	header.fixed {
		padding-bottom: 28px;
	}

	header.fixed nav ul {
		padding-top: 209px;
	}

	footer .tel {
		width: 100%;
		max-width: 800px;
	}
}
/* ====================================================
	下層共通
==================================================== */
#headText {
	padding-top: 122px;
	padding-bottom: 126px;
}
#headText p {
	text-align: center;
	font-size: 2rem;
	line-height: 2.5;
	letter-spacing: 0.2rem;
	margin-top: 5rem;
}
#headText p:first-of-type {
	margin-top: initial;
}
.page-sub .btn a {
	min-width: 350px;
}
/*---------- 767pxより小さい画面(スマホ)----------*/
@media screen and (max-width: 767px) {
	#container {
		padding-top: 0;
	}

	#commit #container,
	#menu #container,
	#access #container,
	#recruit #container {
		padding-top: 20vw;
	}

	section {
		padding: 0 5.5vw;
	}

	.btn a {
		font-size: 3.1vw;
		letter-spacing: 0.7vw;
		padding: 3.4vw 0 4.3vw;
		min-width: initial;
		width: 100%;
	}
	.btn a::before {
		width: 19.3vw;
		right: 1.8vw;
		background-image: url(../img/sp/arrow.png);
		aspect-ratio: 144 / 14;
		margin-top: 0.2vw;
	}
	.btn a > span {
		max-width: 38%;
		display: inline-block;
		overflow-wrap: break-word;
		white-space: normal;
	}
	/*---------- header ----------*/
	header {
		height: initial;
		padding: 6.1vw 5.5vw 5.3vw;
		z-index: 1000;
		background-color: transparent;
	}

	header.fixed {
		padding: 4vw 3.6vw 4.5vw;
	}

	header .logo {
		width: 15vw;
		z-index: 100;
	}

	header .info a {
		font-size: 3.1vw;
		letter-spacing: 0.4vw;
		padding: 2vw 2.4vw;
	}
	header nav {
		margin-left: 5vw;
	}
	header nav .menuBtn__wrap {
		width: 12.4vw;
		height: 6vw;
	}
	header nav.active .menuBtn {
		width: 6vw;
	}
	header nav .menuBtn span:nth-of-type(1) {
		top: 1vw;
	}
	header nav .menuBtn span:nth-of-type(2) {
		top: 4vw;
	}
	header nav.active .menuBtn span {
		width: 100%;
	}
	header #menu__baseWrap {
		width: 100%;
	}
	header #menu__base {
		padding-top: 18.7vw;
	}

	header #menu__base li {
		margin: 0 5.2vw;
	}

	header #menu__base li:first-child {
		padding-top: 8.8vw;
		border-top: 1px solid rgba(255, 255, 255, 0.5);
	}

	header #menu__base li > a {
		padding: 4.3vw 0 5.6vw;
		font-size: 3.7vw;
		letter-spacing: 0.8vw;
	}

	header #menu__base li:last-child {
		margin-top: 9.7vw;
		font-size: 3.7vw;
		letter-spacing: 0.4vw;
		padding-top: 0;
	}

	header #menu__base li:last-child:after {
		display: none;
	}

	header #menu__base li:last-child > a {
		padding: 2.6vw 0 4vw !important;
		margin-top: 4.5vw;
		font-size: 5.3vw !important;
		letter-spacing: 0.2vw;
	}

	header #menu__base li:last-child > a span {
		font-size: 4.3vw;
	}

	header.fixed nav .menuBtn + ul {
		padding-top: 16vw;
	}

	header.fixed nav .menuBtn + ul li:first-child {
		padding-top: 14.1vw;
	}

	header nav .overlay {
		display: none !important;
	}

	/*---------- #head ----------*/
	#head {
		background-size: 100%;
		padding-top: 14.1vw;
		padding-bottom: 16.2vw;
		margin-top: 0.2vw;
	}

	#head h1 {
		font-size: 5.5vw;
		letter-spacing: 0.3vw;
		padding-right: 1vw;
	}

	#head h1 .img {
		width: 19.1vw;
	}

	#head h1 span {
		padding-bottom: 0.4vw;
		margin-left: -1vw;
	}

	/*---------- footer ----------*/
	footer {
		padding-top: 11.8vw;
	}

	footer .inner {
		padding: 0 2.7vw;
	}

	footer .logo {
		width: 41.1vw;
		padding-right: 1.5vw;
	}

	footer .tel {
		width: 100%;
		margin: 13.4vw auto 10.1vw;
		padding: 2.4vw 0 2.9vw;
		line-height: 1.15;
		font-size: 3.3vw;
		letter-spacing: 0.5vw;
	}

	footer .tel span {
		font-size: 3.5vw;
	}

	footer .tel a {
		font-size: 6.1vw;
		letter-spacing: 0.2vw;
	}

	footer .info {
		line-height: 2.92;
		font-size: 3.2vw;
		letter-spacing: 0.5vw;
		margin: 0 auto 15.7vw;
		width: 89.5vw;
	}

	footer .info td:first-child {
		padding-right: 0;
		width: 30.5%;
	}

	footer .info td {
		line-height: 1.5;
	}

	footer .footer__nav {
		background-image: url(../img/sp/footer_bg.jpg);
		padding: 0 2vw;
	}

	footer .footer__nav > ul {
		flex-direction: column;
	}

	footer .footer__nav li {
		position: relative;
	}

	footer .footer__nav li:after {
		content: '';
		width: 100%;
		height: 1px;
		position: absolute;
		bottom: 0;
		left: 0;
		background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.7) 15%, rgba(255, 255, 255, 0.7) 85%, rgba(0, 0, 0, 0) 100%);
	}

	footer .footer__nav li:last-child:after {
		display: none;
	}

	footer .footer__nav li a {
		font-size: 3.3vw;
		letter-spacing: 0.2vw;
		padding: 4.6vw 0 5.5vw;
	}

	footer .copyRight {
		padding: 11.7vw 0 10.7vw;
		font-size: 3vw;
		letter-spacing: 0.05vw;
	}
	/* ====================================================
    下層共通
  ==================================================== */
	#headText {
		padding-top: 16vw;
		padding-bottom: 20vw;
		padding-left: 2.5vw;
		padding-right: 2.5vw;
	}
	#headText p {
		font-size: 3.2vw;
		line-height: 2.1;
		letter-spacing: 0.2vw;
	}
	.page-sub .btn a {
		min-width: initial;
	}
}

/*---------- 改行の設定 ----------*/
*:has(> wbr) {
	/* <wbr> */
	overflow-wrap: break-word;
	word-break: keep-all;
}
/* 翻訳 */
/* font {
  display: block;
} */
font + br,
font + wbr {
	display: none !important;
}
br.large {
	display: none;
}

br.small {
	display: none;
}

br.small_sp {
	display: none;
}

/* PC */
@media screen and (min-width: 1281px) {
	br.large {
		display: block;
	}
}

/* PC小～タブレット */
@media screen and (min-width: 768px) and (max-width: 1280px) {
	br.small {
		display: block;
	}
}

/* スマートフォン */
@media screen and (max-width: 767px) {
	br.small_sp {
		display: block;
	}
}

.reservation__link {
	text-decoration: underline;
	text-decoration-skip-ink: none;
}

.reservation__link:hover {
	text-decoration: underline;
	opacity: 0.8 !important;
}

footer .tel {
	padding: 26px 0 38px;
}

footer .tel a {
	font-size: 2.5rem;
}

@media screen and (max-width: 767px) {
	footer .tel a {
		font-size: 4.3vw;
	}

	footer .tel {
		padding: 4vw 0 4.9vw;
	}
}

/*HEADER*/

/* .lang-en header #menu__base li a {
    padding: 10px 10px;
  }

  .lang-en .globe-icon {
    right: 0;
  } */

.translateWrap {
	position: relative;
	width: 40px;
	height: auto;
	aspect-ratio: 1 / 1;
}
.translate__root {
	position: absolute;
	background: #151210;
	top: -170px;
	right: -40px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	border: 1px solid white;
	border-top: 0;
	padding: 36px 40px 16px 60px;
	transition: top 0.5s ease;
	gap: 13px;
	z-index: 1;
}

.translate__root.active {
	top: -54px;
}
.globe-icon {
	width: 100%;
	height: auto;
	aspect-ratio: 1/1;
	fill: white;
	cursor: pointer;
	opacity: 1;
}

.globe-icon:hover {
	opacity: 0.6;
}

.translate__close {
	width: 40px;
	height: auto;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}
.translate__close svg {
	fill: white;
	width: 70%;
	height: auto;
	aspect-ratio: 1 / 1;
}

.goog-te-gadget .goog-te-combo {
	background: #151210;
	border: 1px solid white;
	color: white;
	padding: 12px;
}

#google_translate_element img {
	width: initial;
}

@media screen and (max-width: 1279px) {
	.globe-icon {
		right: 124px;
	}
}
@media screen and (max-width: 767px) {
	/* .lang-en #info .sub__txtWrap .box:first-child {
      margin-bottom: 125.7vw;
    }

    .lang-en header .info span.spTel a {
      padding: 1.8vw 1vw 2vw !important;
    } */
	body {
		top: 0 !important;
	}

	.skiptranslate {
		display: none;
	}
	.translateWrap {
		width: 5vw;
	}
	.translate__root {
		position: fixed;
		width: 100vw;
		height: 18.7vw;
		top: -19vw;
		gap: 2vw;
		right: 0;
		left: 0;
		padding: initial;
		margin: auto;
		z-index: 1000;
		border-left: 0;
		border-right: 0;
	}
	.translate__root.active {
		top: 0;
	}
	.globe-icon {
		margin-top: initial;
	}
	.translate__close {
		fill: white;
		width: 9vw;
		height: 6vw;
		cursor: pointer;
	}
	#google_translate_element .goog-te-gadget {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		gap: 5vw;
	}

	.goog-te-gadget .goog-te-combo {
		background: #151210;
		border: 1px solid white;
		color: white;
		padding: 3vw 2vw;
	}
}
