@charset "UTF-8";
/*custom color size*/
:root {
	--color-main1: #006bd3; /*blue1*/
	--color-main2: #3b9fff; /*blue2*/
	--color-main3: #9efafd; /*cyan*/
	--color-sub1: #f6c217; /*yellow*/
	--color-sub2: #f63508; /*red*/
	--color-blk1:#000; /*black*/
	--color-blk2:#1e1e1e; /*black*/
	--color-wht:#eee; /*white*/

	--margin-big: 120px;
	--margin-big2: 80px;
	--margin-middle: 60px;
	--margin-small: 30px;
	--raidus-main: 5px;
}
/* タブレット適用CSS */
@media screen and (max-width: 1080px) {
	:root {
		--margin-big: 100px;
		--margin-big2: 50px;
		--margin-middle: 30px;
	}
}
/* スマホ適用CSS */
@media screen and (max-width: 560px) {
	:root {
		--margin-big: 80px;
		--margin-big2: 40px;
		--margin-middle: 20px;
	}
}

/* スマホ適用CSS */
@media screen and (max-width: 320px){
}
/*====================================================================
　Commons
====================================================================*/
*,
*::before,
*::after {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
html {
	width: 100%;
	word-wrap: break-word;
	word-break: break-all;
}
body {
	font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
/*	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;*/
	font-size : 20px;
	line-height : 1.6;
	color: var(--color-wht);
	width: 100%;
	letter-spacing: .5px;
	background: var(--color-blk1);
}
img {
	border: 0;
	height: auto;
	max-width: 100%;
	vertical-align: middle;
	margin: 0 auto;
	display: block;
}
img{
	/* pc */
	pointer-events: none;
	/* smartphone*/
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-moz-touch-callout:none;
	-moz-user-select:none;
	touch-callout:none;
	user-select:none;
}
svg {
  fill: currentColor;
  max-width: 100%;
}
p {
	margin: 0 auto 40px;
	padding: 0;
}
/*
link
---------------------------------------------------------*/
a.link:link{
	color: #00e;
	text-decoration: underline;
}

#main {
	overflow: hidden;
	margin : 0 auto;
	/*background: url(../images/34.jpg) no-repeat center var(--color-blk1);
	background-size: fixed;*/
}

/*
header
---------------------------------------------------------*/
#header01,
#header02,
#header03{
	position: relative;
	text-align: center;
	padding: 80px 0;
	font-family: "Noto Serif JP", serif;
	overflow: hidden;
	font-size: 1.4em;
	/*text-shadow:
	 1px 1px 8px rgba(0, 0, 0, .7),
	 -1px 1px 8px rgba(0, 0, 0, .7),
	 -1px -1px 8px rgba(0, 0, 0, .7),
	 1px -1px 8px rgba(0, 0, 0, .7);*/
	text-shadow:
	 0px 0px 10px rgba(0, 0, 0, .3),
	 0px 0px 10px rgba(0, 0, 0, .3),
	 0px 0px 10px rgba(0, 0, 0, .3),
	 0px 0px 10px rgba(0, 0, 0, .3),
	 1px 1px 20px rgba(0, 0, 0, .3),
	 -1px 1px 20px rgba(0, 0, 0, .3),
	 -1px -1px 20px rgba(0, 0, 0, .3),
	 1px -1px 20px rgba(0, 0, 0, .3);
	z-index: 1;
	background: var(--color-blk1);
}
#header01::before,
#header02::before,
#header03::before{
	content: ""; /* 擬似要素を作成 */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('../images/wa_bg.png') no-repeat center var(--color-blk1); /* 背景画像 */
/*  background-size: cover;*/
  opacity: 0; /* 初期状態は透明 */
  animation: HeaderAnime 2s ease-out forwards; /* アニメーション */
  animation-delay: 1.8s; /* 1秒後にアニメーション開始 */
  z-index: 0; /* 背景として配置（テキストの後ろに） */
}
#header03::before{
	background-position: center top;
	animation-delay: 2.6s; /* 1秒後にアニメーション開始 */
}
.header01_1,
.header02_1,
.header03_1{
	letter-spacing: .1em;
}
.header01_1{
	padding-top: 150px;
}
.header01_1 p,
.header02_1 p,
.header03_1 p,
.header03_3 p{
	margin-bottom: 0;
}
.header01_1 p:nth-of-type(1),
.header02_1 p:nth-of-type(1),
.header03_1 p:nth-of-type(1){
	border: 1px solid;
	display: inline-block;
	padding: 5px 10px;
	line-height: 1.2;
	max-width: 90%;
	background: #000;
    opacity: 0.6 !important;
}
.header01_1 p:nth-of-type(2),
.header02_1 p:nth-of-type(2),
.header03_3 p:nth-of-type(2){
	font-size: 2em;
	font-weight: 600;
	letter-spacing: .2em;

}
.header01_2,
.header02_2,
.header03_2{
	padding-top: 170px;
	display: flex;
	justify-content: center;
  gap: 0px;
}
.header01_2{
	margin-bottom: 34px;
	transform: scale(1.08);
	transform-origin: center top;
}
.header01_2 p,
.header02_2 p,
.header03_2 p{
	margin: 0;
	font-size: 20vw;
	font-weight: 900;
	line-height: 1;
}
.header01_3{
	padding-top: 40px;
	letter-spacing: .3em;
}
.header01_3 p{
	font-size: 1.18em;
	font-weight: 700;
}
.header01_3 .under_wht{
	padding: .12em .75em .22em;
	background: rgba(126, 0, 0, .48);
	border: 1px solid rgba(255, 255, 255, .76);
	box-shadow:
		0 0 18px rgba(246, 53, 8, .55),
		inset 0 0 18px rgba(255, 255, 255, .12);
}
.header02_2,
.header03_2{
	padding-top: 0;
}
.header02_3{
	padding-top: 250px;
	letter-spacing: .3em;
}
.header02_3 p{
	margin-bottom: 0;
	font-size: 1.2em;
}
.header02_4 p{
	margin-top: 20px;
	font-size: 1.2em;
}
.header03_2{
	gap: 0;
}
.header03_3{
	padding-top: 60px;
	line-height: 1.2;
}
.header03_4{
	padding-top: 200px;
	letter-spacing: .3em;
}
.header03_4 p{
	margin-bottom: 0;
	font-size: 3.5em;
	font-weight: 600;
	letter-spacing: .2em;
	line-height: 1;
}
/*
conttainer
---------------------------------------------------------*/
.container {
	text-align: left;
	text-shadow:
	 1px 1px 8px rgba(0, 0, 0, .7),
	 -1px 1px 8px rgba(0, 0, 0, .7),
	 -1px -1px 8px rgba(0, 0, 0, .7),
	 1px -1px 8px rgba(0, 0, 0, .7);
}
.bg_blk{
	background: var(--color-blk1);
	color: var(--color-wht);
}
.bg_wht{
	background: var(--color-wht);
	color: var(--color-blk1);
}
.bg_fog{
	background:
		radial-gradient(circle at 12% 0%, rgba(255, 222, 128, .38) 0, rgba(255, 222, 128, 0) 34%),
		radial-gradient(circle at 88% 28%, rgba(112, 193, 255, .3) 0, rgba(112, 193, 255, 0) 36%),
		linear-gradient(180deg, #f8fcff 0%, #eaf6ff 47%, #fff6dc 100%);
	color: #162131;
	text-shadow: none;
}
.bg_fog .yellow{
	color: #a37100;
}
.bg_fog .red{
	color: #d92015;
}
.bg_fog .bgred{
	background-image: linear-gradient(#ef2f22, #ef2f22);
}
.bg_fog .arrow_w::after{
	filter: brightness(0) saturate(100%) invert(20%) sepia(31%) saturate(1125%) hue-rotate(174deg) brightness(88%) contrast(90%);
}
.bg_flame{
	background: url(../images/bg_flame.png) repeat top var(--color-blk1);
	color: var(--color-wht);
}
.bg_flame2{
	background: url(../images/bg_flame2.png) repeat top var(--color-blk1);
	color: var(--color-wht);
}
.bg_flame3{
	background: url(../images/bg_flame3.png) no-repeat center var(--color-blk1);
	color: var(--color-wht);
}
.form_bg{
	background: url(../images/form_bg.png) no-repeat center var(--color-blk1);
}
.clip_path_01{
	-webkit-clip-path: polygon(0 0,100% 0,100% calc(100% - 12vw),50% 100%,0 calc(100% - 12vw));
	clip-path: polygon(0 0,100% 0,100% calc(100% - 12vw),50% 100%,0 calc(100% - 12vw));
	background-attachment: fixed;
}
.clip_path_01 .cnt>p:last-child{
	margin-bottom: 120px;
}
.bg_kirakira{
	background: url(../images/bg_pat.jpg) no-repeat center #000;
	background-size: cover;
	background-attachment: fixed;
	height: 100vh;
	left: 0;
	position: fixed;
	top: 0;
	width: 100vw;
	z-index: -1;
}
.cnt{
	margin : 0 auto;
	max-width: 1000px;
	width: 100%;
	padding: var(--margin-big2) 20px;
}
.pat_area{
	padding-top: 0;
}
.txt_bg{
	background: url(../images/txt_bg.png) no-repeat center;
	background-size: contain;
	padding: 100px 0;
}


/*title*/

.ttl{
	margin: 0px auto 0;
	font-family: "Zen Antique", serif;
	font-weight: 700;
	font-size: 3.5em;
	line-height: 1.4;
	/*background: url(../images/ttl_bg.png) no-repeat center;*/
	background-size: contain;
	padding: 100px 0px 0;
	text-shadow:
	 0px 0px 10px rgba(0, 0, 0, .8),
	 0px 0px 10px rgba(0, 0, 0, .8),
	 0px 0px 10px rgba(0, 0, 0, .8),
	 0px 0px 10px rgba(0, 0, 0, .8),
	 1px 1px 20px rgba(64, 207, 252, .3),
	 -1px 1px 20px rgba(64, 207, 252, .3),
	 -1px -1px 20px rgba(64, 207, 252, .3),
	 1px -1px 20px rgba(64, 207, 252, .3),
	 3px 3px 30px rgba(45, 77, 225, .3),
	 -3px 3px 30px rgba(45, 77, 225, .3),
	 -3px -3px 30px rgba(45, 77, 225, .3),
	 3px -3px 30px rgba(45, 77, 225, .3);
	 text-align: center;
	 max-width: 1000px;
     width: 100%;
}
.ttl p{
	margin-bottom: 0;
}
.ttl .fs_small{
	font-size: .6em;
}


.ttl02 {
	margin: 75px auto 0;
	font-family: "Noto Serif JP", serif;
	font-weight: 700;
	font-size: 3.5em;
	line-height: 1.4;
	/*background: url(../images/ttl_bg.png) no-repeat center;*/
	background-size: contain;
	padding: 0px 110px 100px;
	text-shadow: 0px 0px 10px rgba(0, 0, 0, .8), 0px 0px 10px rgba(0, 0, 0, .8), 0px 0px 10px rgba(0, 0, 0, .8), 0px 0px 10px rgba(0, 0, 0, .8), 1px 1px 20px rgb(28 44 50 / 30%), -1px 1px 20px rgb(22 38 44 / 30%), -1px -1px 20px #000, 1px -1px 20px rgb(46 61 66 / 30%), 3px 3px 30px rgb(50 52 60 / 30%), -3px 3px 30px rgb(43 45 54 / 30%), -3px -3px 30px rgb(111 112 118 / 30%), 3px -3px 30px rgb(34 36 48 / 30%);
	text-align: center;
}
.ttl02 p{
	margin-bottom: 0;
}
.ttl02 .fs_small{
	font-size: .6em;
	display: inline-block;
}
/*.grad>span{
	background: linear-gradient(180deg, #006bd3 0%, #006bd3 50%, #3b9fff 50%, #006bd3 100%);
	color: transparent;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
	position: relative;
}
.grad>span::after{
	content: "";
	width: 150%;
	height: 1px;
	bottom: 17px;
	right: 0;
	background: linear-gradient(180deg, #006bd3 0%, #006bd3 50%, #3b9fff 50%, #006bd3 100%);
	position: absolute;
}
.grad>span:nth-of-type(2)::after{
	left: 0;
}*/

.bg_form{
	background: url(../images/form_bg.png) repeat center #191919;
}

/*
thanks
---------------------------------------------------------*/
.ttl_thk{
	background: url(../images/bg_thk.png) center repeat;
	color: var(--color-main2);
	text-align: center;
	padding: 80px 20px;
	text-shadow:
	 1px 1px 10px rgba(0, 0, 0, .7),
	 -1px 1px 10px rgba(0, 0, 0, .7),
	 -1px -1px 10px rgba(0, 0, 0, .7),
	 1px -1px 10px rgba(0, 0, 0, .7);
}


/*
footer
---------------------------------------------------------*/
footer {
	padding: 15px 0px;
	background: #fff;
	font-size : 16px;
	line-height : 1.5;
	color: #000;
	width: 100%;
	text-align: center;
	letter-spacing: 1px;
}
footer p {
	margin: 0 auto;
	padding: 0;
}
footer a {
	color: #000;
}
footer a:hover {
	color: #000;
}

/*
tablet sp
---------------------------------------------------------*/
@media screen and (max-width: 640px){
	body {
		font-size : 18px;
		line-height : 1.4;
	}
	#header01,
	#header02,
	#header03{
		padding: 20px 20px 80px;
		font-size: 1em;
	}
	#header03{
		padding-top: 60px;
	}
	#header01::before,
	#header02::before,
	#header03::before{
		background: url(../images/header_01_sp.png) no-repeat top center #000;
		background-size: cover;
	}
	.header01_1 p:nth-of-type(2),
	.header02_1 p:nth-of-type(2){
		font-size: 1.4em;
	}
	.header01_1{
		padding-top: 112px;
	}
	.header01_2{
		padding-top: 150px;
		display: grid;
		grid-template-columns: max-content max-content;
		column-gap: 8px;
		row-gap: 0;
		margin-bottom: 24px;
		transform: scale(1.06);
	}
	.header01_2 img{
		width: auto;
		max-width: none;
		height: clamp(145px, 42vw, 220px);
	}
	.header01_2 p,
	.header02_2 p,
	.header03_2 p{
		font-size: 25vw;
	}
	.header01_3{
		padding-top: 20px;
		letter-spacing: .1em;
	}
	.header01_3 p{
		font-size: 1.08em;
	}
	.header01_3 .under_wht{
		padding: .18em .55em .26em;
	}
	.header01_3 p{
		margin-bottom: 0;
	}
	.header02_1 p:nth-of-type(1){
		font-size: 1em;
	}
	.header02_3{
		padding-top: 150px;
	}
	.header02_2{
		gap: 3px;
	}
	.header03_3{
		padding-top: 20px;
	}
	.header03_3 p:nth-of-type(2){
		font-size: 1.8em;
		letter-spacing: 0.1em;
	}
	.header03_4 p{
		font-size: 2.2em;
		letter-spacing: .1em;
	}

	.bg_fog{
		background:
			radial-gradient(circle at 10% 0%, rgba(255, 222, 128, .36) 0, rgba(255, 222, 128, 0) 38%),
			radial-gradient(circle at 90% 26%, rgba(112, 193, 255, .28) 0, rgba(112, 193, 255, 0) 42%),
			linear-gradient(180deg, #f8fcff 0%, #eaf6ff 50%, #fff6dc 100%);
	}
	.bg_flame{
		background: url(../images/bg_flame_sp.png) repeat top var(--color-blk1);
		background-size: contain;
	}
	.bg_flame2{
		background: url(../images/bg_flame2_sp.png) repeat top var(--color-blk1);
		background-size: contain;
	}
	.bg_flame3{
		background: url(../images/bg_flame3_sp.png) repeat center top var(--color-blk1);
		background-size: contain;
	}
	.cnt{
		padding: 60px 20px;
	}
	.clip_path_01 .cnt>p:last-child{
		margin-bottom: 40px;
	}

	.bg_kirakira{
		background: url(../images/bg_pat_sp.jpg) no-repeat top center #000;
		background-size: contain;
		background-attachment: initial;
	}
	.ttl{
		padding: 60px 20px 0;
		font-size: 2.6em;
	}
	.ttl>div>div{
		display: inline;
	}
	.ttl>div>br{
		display: none;
	}
	.ttl_thk{
		padding: 30px 20px;
	}
	.ttl02 {
		padding: 0px 30px 0px;
	}
}
@media screen and (max-width: 414px){

}
@media screen and (max-width: 390px){

}
@media screen and (max-width: 375px){

}
@media screen and (max-width: 320px){
	#header01{
		padding: 50px 20px;
	}
	.header01_1 p:nth-of-type(2){
		font-size: 1.2em;
	}
	.header01_3{
		font-size: .8em;
	}
}