@charset "UTF-8";

/* ==================================================
FONT
================================================== */
html { font-size: 62.5%; }

body,
#allWrap {
	font-family: fot-udkakugo-large-pr6n,sans-serif;
	font-weight: 500;
	font-style: normal;
	font-size: 1rem;
	line-height: 1.2;
	letter-spacing: 0.08em;
	color: #fff;

	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-feature-settings: "palt"1;
	font-feature-settings: "palt"1;
	overscroll-behavior: none;

	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

/*
--- WEB FONTS ---
■URL
・FOT-UD角ゴ_ラージ Pr6N（適用箇所：本文）
https://fonts.adobe.com/fonts/fot-udkakugo-large-pr6n

・FOT-UD角ゴC80 Pro（適用箇所：エリアタイトル・強調文）
https://fonts.adobe.com/fonts/fot-udkakugoc80-pro

・Interstate（適用箇所：ロゴ・エリアタイトル）
https://fonts.adobe.com/fonts/interstate#fonts-section

■STYLE
・FOT-UD角ゴ_ラージ Pr6N L
font-family: fot-udkakugo-large-pr6n,sans-serif;
font-weight: 300;

・FOT-UD角ゴ_ラージ Pr6N M
font-family: fot-udkakugo-large-pr6n,sans-serif;
font-weight: 500;

・FOT-UD角ゴ_ラージ Pr6N DB
font-family: fot-udkakugo-large-pr6n,sans-serif;
font-weight: 600;

・FOT-UD角ゴC80 Pro B
font-family: fot-udkakugoc80-pro,sans-serif;
font-weight: 700;

・Interstate Compressed Regular
font-family: interstate-compressed,sans-serif;
font-weight: 500;

・Interstate Compressed Black
font-family: interstate-compressed,sans-serif;
font-weight: 800;
*/


/* ==================================================
LINK
================================================== */
a { outline: 0; transition: opacity 0.4s ease-out 0s, color 0.4s ease-out 0s; }
a:link { text-decoration: none; color: #fff; }
a:visited { text-decoration: none; color: #fff; }
a:hover { text-decoration: none; color: #fff; }
a:active { text-decoration: none; color: #fff; }
:focus { outline: 0; }

a.txtLink:link { text-decoration: underline; color: #fff; }
a.txtLink:visited { text-decoration: underline; color: #fff; }
a.txtLink:hover { text-decoration: none; color: #fff; opacity: 0.6; }
a.txtLink:active { text-decoration: none; color: #fff; opacity: 0.6; }

a img { transition: all 0.4s ease-out 0s; }
a:hover img {
	/*opacity: 0.6;*/
	filter: brightness(110%) contrast(110%) saturate(120%);
}

/* ==================================================
VIEW SWITCH
================================================== */

/* View Switch
------------------------------ */
@media screen and (min-width: 901px) {
.spOnly { display: none !important; }
}

@media screen and (max-width: 900px) {
.pcOnly { display: none !important; }
}


/* ==================================================
PAGE BASE
================================================== */
body {
	background-color: #000;
}

#allWrap {
	text-align: center;
	overflow: hidden;
	font-size: 1.6rem;
	position: relative;
	min-width: 320px;
}

img, svg {
	display: block;
	margin: 0 auto;
}

p {
	line-height: 1.5;
}

p:not(:last-child) {
	margin-bottom: 1.5em;
}

i, em {
	display: inline-block;
}


/* ==================================================
CONTENTS COMMON
================================================== */
#mainWrap {
	position: relative;
	padding: 80px 3% 1px;
	background: url("/holiday/20220223/asset/img/area_bg.jpg") repeat center top;
	border-top: 3px solid #000;
}

#blockWrap {
	position: relative;
	padding: 80px 0 1px;
/*	margin-top: 160px;*/
}

#mainWrap::before,
#blockWrap::before {
	content: "";
	display: block;
	width: 100%;
	height: 20px;
	background: url("/holiday/20220223/asset/img/area_bg_light.png") no-repeat center top;
	background-size: 100% 20px;
	position: absolute;
	top: 0;
	left: 0;
}

.area {
}

.areaTitle {
	font-family: interstate-compressed, sans-serif;
	font-weight: 800;
	font-size: 3.2rem;
	position: relative;
  z-index: 2;
	/*width: 60%;*/
	margin: 0 auto;
}

.subPage .areaTitle {
	margin-bottom: 40px;
}

.areaTitle img {
}

.areaTitle + .areaInner {
  position: relative;
  z-index: 1;
  margin-top: -30px;
}

.areaTitle + .areaInner .lightLine {
  max-width: 1200px;
  width: 100%;
  height: 3px;
  background: url("/holiday/20220223/asset/img/line.png") no-repeat center top;
  margin: 0 auto 80px;
	background-size: 100% 3px;
  position: relative;
}

@media screen and (max-width: 900px) {
	.areaTitle {
	}

	.areaTitle + .areaInner {
		margin-top: -24px;
	}

	.areaTitle + .areaInner .lightLine {
		margin-bottom: 12%;
	}
}

@media screen and (max-width: 420px) {
	.areaTitle {
	}

	.areaTitle + .areaInner {
		margin-top: -20px;
	}
}


a.btnStyle {
	display: block;
	margin: 0 auto;
	padding: 6px;
	max-width: 420px;
	width: 86%;
	background: url("/holiday/20220223/asset/img/btn_bg.jpg") no-repeat center top;
	background-size: 100% 100%;
	box-shadow: 0 0 20px rgba(255,255,255,0.6);
	transition: all 0.4s ease-out 0s;
}

a.btnStyle:hover {
	background-size: 160% 100%;
	box-shadow: 0 0 6px rgba(255,255,255,0.9);
}

a.btnStyle .border {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: nowrap;
	flex-direction: row;
	background-color: #000;
	border: 1px solid #fff;
	padding: 14px;
	transition: all 0.4s ease-out 0s;
}

a.btnStyle:hover .border {
	background-color: #2b2b2b;
}

a.btnStyle .border::before {
	content: "";
	width: 30px;
	height: 30px;
}

a.btnStyle .border::after {
	content: "";
	width: 30px;
	height: 30px;
	background: url("/holiday/20220223/asset/img/svg_common/icon_arrow_fff.svg") no-repeat center center;
	background-size: contain;
}

a.btnStyle .border b {
	width: calc(100% - 80px);
	font-family: interstate-compressed,sans-serif;
	font-weight: 800;
	font-size: 3.4rem;
	letter-spacing: 0.03em;
	line-height: 0.9;
	color: #fff;
}

@media screen and (max-width: 900px) {
	a.btnStyle {
		padding: 4px;
	}

	a.btnStyle .border {
		padding: 12px;
	}

	a.btnStyle .border::before {
		width: 22px;
		height: 22px;
	}
	
	a.btnStyle .border::after {
		width: 22px;
		height: 22px;
	}
	
	a.btnStyle .border b {
		width: calc(100% - 70px);
		font-size: 2.2rem;
		letter-spacing: 0.03em;
		line-height: 0.9;
	}
}

/* btn */
a.btnStyle.messageIcon {
}

a.btnStyle.messageIcon .border::before {
	background: url("/holiday/20220223/asset/img/svg_common/icon_mail_fff.svg") no-repeat center center;
	background-size: contain;
}

/* btn */
a.btnStyle.homeIcon {
}

a.btnStyle.homeIcon .border::after {
}

a.btnStyle.homeIcon .border::before {
	background: url("/holiday/20220223/asset/img/svg_common/icon_fang_fff.svg") no-repeat center center;
	background-size: contain;
}

a.btnStyle.homeIcon .border b {
	font-family: fot-udkakugoc80-pro,sans-serif;
	font-weight: 700;
	font-size: 2rem;
}


@media screen and (max-width: 900px) {
}
/**/

.fontJp {
}

.fontEn {
}

.fontTtl {
}

.fw300 { font-weight: 300; }
.fw400 { font-weight: 400; }
.fw500 { font-weight: 500; }
.fw600 { font-weight: 600; }
.fw700 { font-weight: 700; }
.fw800 { font-weight: 800; }

.colorWhite { color: #fff; }
/*.bgcolorWhite { background-color: #fff; }*/

.colorBlack { color: #000; }
/*.bgcolorBlack { background-color: #000; }*/

.colorBlue { color: #79b6da; }
.colorPurple { color: #9d77c1; }
/*.colorGreen { color: ; }*/


.normalBox {
  position: relative;
  z-index: 1;
  max-width: 900px;
  margin: -30px auto 0;
}

.normalBox::after {
	content: "";
	display: block;
	max-width: 300px;
	width: 50%;
	height: 54px;
	background: url("/holiday/20220223/asset/img/box_light.png") no-repeat center top;
	background-size: 100% 54px;
	position: absolute;
	bottom: -40px;
	left: 0;
	right: 0;
	margin: 0 auto;
  z-index: -1;
}

.normalBoxBg {
  background-color: #000;
  position: relative;
  z-index: 1;
}


.borderBox {
  max-width: 900px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.borderBox::before {
	content: "";
	display: block;
	max-width: 300px;
	width: 50%;
	height: 54px;
	background: url("/holiday/20220223/asset/img/box_light.png") no-repeat center top;
  background-size: 100% 54px;
	transform: rotate(180deg);
	position: absolute;
	top: -40px;
	left: 0;
	right: 0;
	margin: 0 auto;
  z-index: -2;
}

.borderBox::after {
	content: "";
	display: block;
	max-width: 300px;
	width: 50%;
	height: 54px;
	background: url("/holiday/20220223/asset/img/box_light.png") no-repeat center top;
	background-size: 100% 54px;
	position: absolute;
	bottom: -40px;
	left: 0;
	right: 0;
	margin: 0 auto;
  z-index: -1;
}

.borderBox .borderBoxBg {
  background-color: #000;
  padding: 10px;
  position: relative;
  z-index: 1;
}

.borderBox .borderBoxInner {
  border: 2px solid #4d4d4d;
  padding: 30px 15px;
}


/* ==================================================
NAVIGATION
================================================== */
/*#naviWrap {
}*/


/* ==================================================
HEADER
================================================== */
#hdrWrap {
	position: relative;
	padding: 120px 3% 40px;
	background: url("/holiday/20220223/asset/img/hdr_bg.jpg") no-repeat center center;
	background-size: cover;
}

.subPage #hdrWrap {
	padding: 80px 3% 100px;
}

#hdrWrap::before {
	content: "";
	display: block;
	width: 100%;
	height: 290px;
	background: url("/holiday/20220223/asset/img/hdr_bg1.png") no-repeat center top;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	transition: all 0.4s ease-out 0s;
}

#hdrWrap::after {
	content: "";
	display: block;
	width: 100%;
	height: 220px;
	background: url("/holiday/20220223/asset/img/hdr_bg2.png") no-repeat center bottom;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
	transition: all 0.4s ease-out 0s;
}

@media screen and (max-width: 1000px) {
	#hdrWrap {
		padding: 16% 3% 18%;
		background: url("/holiday/20220223/asset/img/hdr_bg.jpg") no-repeat center center;
		background-size: 200% auto;
	}
	
	.subPage #hdrWrap {
		padding: 16% 3% 20%;
	}
	
	#hdrWrap::before {
		background-size: 120% auto;
	}
	
	#hdrWrap::after {
		background-size: 140% auto;
	}
}

#hdrWrap .inner {
	position: relative;
	z-index: 3;
}

#hdrWrap .siteTitle {
	max-width: 680px;
	width: 90%;
	margin: 0 auto;
}

.subPage #hdrWrap .siteTitle {
	max-width: 480px;
}

#hdrWrap .siteTitle img {
}

#hdrWrap .date {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: row;
	margin: 0 auto 50px;
	max-width: 1260px;
}

@media screen and (max-width: 1000px) {
	#hdrWrap .siteTitle {
		max-width: 480px;
	}

	#hdrWrap .date {
		margin-bottom: 8%;
	}
}

#hdrWrap .date::before {
	content: "";
	display: block;
	/*width: 208px;*/
	width: 18%;
	height: 7px;
	background: url("/holiday/20220223/asset/img/hdr_date_line.png") no-repeat center center;
	background-size: contain;
}

#hdrWrap .date::after {
	content: "";
	display: block;
	/*width: 208px;*/
	width: 18%;
	height: 7px;
	background: url("/holiday/20220223/asset/img/hdr_date_line.png") no-repeat center center;
	background-size: contain;
	transform: rotate(180deg);
}

#hdrWrap .date img {
	/*width: calc(100% - 476px);*/
	width: 60%;
}

#hdrWrap .bnrBlock {
}

#hdrWrap .bnrBlock a {
	display: block;
	max-width: 340px;
	width: 60%;
	margin: 0 auto;
	border: 1px solid #fff;
	padding: 6px;
	position: relative;
}

#hdrWrap .bnrBlock a::before {
	content: "";
	display: block;
	width: 100%;
	height: 24px;
	background: url("/holiday/20220223/asset/img/bnr_fang.png") no-repeat center top;
	position: absolute;
	top: -4px;
	left: 0;
	z-index: 2;
	transition: all 0.4s ease-out 0s;
}

#hdrWrap .bnrBlock a:hover::before {
	top: -2px;
}

#hdrWrap .bnrBlock a::after {
	content: "";
	display: block;
	width: 100%;
	height: 24px;
	background: url("/holiday/20220223/asset/img/bnr_fang.png") no-repeat center top;
	transform: rotate(180deg);
	position: absolute;
	bottom: -4px;
	left: 0;
	z-index: 1;
	transition: all 0.4s ease-out 0s;
}

#hdrWrap .bnrBlock a:hover::after {
	bottom: -2px;
}

#hdrWrap .bnrBlock a img {
}


/* ==================================================
FOOTER
================================================== */
#ftrAbove {
	padding: 80px 3%;
	background-color: #0f0f0f;
	position: relative;
}

#ftrAbove::before {
	content: "";
	display: block;
	width: 100%;
	height: 40px;
	background: url("/holiday/20220223/asset/img/ftr_shadow.png") no-repeat center top;
	background-size: 100% 40px;
	position: absolute;
	top: 3px;
	left: 0;
}

#ftrAbove::after {
	content: "";
	display: block;
	width: 100%;
	height: 40px;
	background: url("/holiday/20220223/asset/img/ftr_shadow.png") no-repeat center top	;
	background-size: 100% 40px;
	transform: rotate(180deg);
	position: absolute;
	bottom: 3px;
	left: 0;
}


/* PAGE TOP BUTTON
------------------------------ */
#pagetopBtn {
	padding: 0 0 40px;
}

.subPage #pagetopBtn {
	padding: 0 0 0;
}

#pageHome #pagetopBtn {
	padding: 0 0 60px;
}

#pagetopBtn a {
	display: block;
	width: 40px;
	height: 40px;
	position: relative;
	margin: 0 auto;
}

#pagetopBtn a::before {
	content: "";
	display: block;
	width: 17px;
	height: 17px;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	transform: rotate(45deg);
	position: absolute;
	top: calc(50% - 4px);
	left: 0;
	right: 0;
	margin: 0 auto;
}

#ftrWrap {
	background-color: #000;
	padding: 40px 3%;
}

#ftrWrap .ftrInner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: row;
}

#ftrWrap .logo {
	width: 160px;
	height: 20px;
}

#ftrWrap .logo a {
	display: block;
}

#ftrWrap .copyright {
	font-size: 1.2rem;
	color: #fff;
}

#ftrWrap .copyright b {
	display: inline-block;
	margin-right: 6px;
	font-size: 110%;
	transform: translateY(1px);
}

@media screen and (max-width: 900px) {	
	#ftrWrap .ftrInner {
		display: block;
	}

	#ftrWrap .logo {
		width: 140px;
		margin: 0 auto 20px;
	}
	
	#ftrWrap .copyright {
	}
}


/* ==================================================
ANIMATION
================================================== */
/*#allWrap {
	will-change: animation;
	animation: accessFadein 1.2s linear 0.2s both;
}

@keyframes accessFadein {
	0% { opacity: 0; }
	30% { opacity: 0; }
	100% { opacity: 1; }
}*/
/**/


/* ////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ////////////////////////////////////////////////////////////////////////////////////////////////// */


/* ==================================================
OTHERS
================================================== */

.scrollto {/**/}

/* clrfix */
.clrfix::before, .clrfix::after { display: table; content: ''; }
.clrfix::after { clear: both; }

/* iOS フルサイズディスプレイ対応 */
.vfit-cover {
	padding-left: env(safe-area-inset-left);
	padding-right: env(safe-area-inset-right);
}

.none	{ display: none; }

/*

<!-- #################################################################################################### -->
<!-- #################################################################################################### -->
<!-- #################################################################################################### -->
<!-- #################################################################################################### -->
<!-- #################################################################################################### -->
<!-- ##########　HTML コメントアウト記述ルール　######################################################### -->
<!-- #################################################################################################### -->
<!-- #################################################################################################### -->


<!-- ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ -->
<!-- //////////////////////////////////////////////////////////////////// -->
<!-- ///// メインコンテンツエリア（編集エリア） ///////////////////////// -->
<!-- //////////////////////////////////////////////////////////////////// -->

<!-- //////////////////////////////////////////////////////////////////// -->
<!-- //////////////////////////////////////////////////////////////////// -->
<!-- ▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲ -->

<!-- ==================== 大ブロックエリア ==================== -->
<!-- ==================== //大ブロックエリア ==================== -->

<!-- ***** 中ブロックエリア *************** -->
<!-- ***** //中ブロックエリア *************** -->

<!-- #ID名 -->
<!-- //#ID名 -->

<!-- .class名 -->
<!-- //.class名 -->

<!-- [memo] -->
<!-- //[memo] -->


<!-- ※※※※※ INCLUDE - HEADER ※※※※※ -->
<!--#include virtual="/common/inc_header.html"-->
<!-- ※※※※※ //INCLUDE - HEADER ※※※※※ -->

<!-- ※※※※※ INCLUDE - FOOTER ※※※※※ -->
<!--#include virtual="/common/inc_footer.html"-->
<!-- ※※※※※ //INCLUDE - FOOTER ※※※※※ -->

<!--
[ id/class Name List ]
wrap > area > (group) > set > box

[ memmo ]
TOPページ → <body class="topPage">
Newsページ(第2階層) → <body class="subPage newsPage">
-->
*/


/* #################################################################################################### */
/* #################################################################################################### */
/* #################################################################################################### */
/* #################################################################################################### */
/* #################################################################################################### */
/* ##########　コメントアウト記述ルール　############################################################## */
/* #################################################################################################### */
/* #################################################################################################### */


/* //////////////////////////////////////////////////////////////////// */
/* ///// ブロック区切り /////////////////////////////////////////////// */
/* //////////////////////////////////////////////////////////////////// */

/* ==================================================
大見出し
================================================== */

/* 中見出し（他、説明など）
------------------------------ */

/* ### 小見出し 1 ### */
/* ### ----- ### */

/* 小見出し 2 */
/* ----- */