@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');

/*
font-family: "Noto Sans JP", sans-serif;
100 to 900

font-family: "Noto Serif JP", serif;
200 to 900
*/


/*
============================================================
基本レイアウト設定
============================================================
*/

/* 文中の文字や改行させたくないもの */

.ntpc{display: none;}
.no_ntpc{display: inline;}
@media screen and ( max-width:1400px) {
	.ntpc{display: inline;}
	.no_ntpc{display: none;}
}

.tbn{display: none;}
.no_tbn{display: inline;}
@media screen and ( max-width:1200px) {
	.tbn{display: inline;}
	.no_tbn{display: none;}
}

.tbl{display: none;}
.no_tbl{display: inline;}
@media screen and ( max-width:1100px) {
	.tbl{display: inline;}
	.no_tbl{display: none;}
}

.tb{display: none;}
.no_tb{display: inline;}
@media screen and ( max-width:767px) {
	.tb{display: inline;}
	.no_tb{display: none;}
}

.phonel{display: none;}
.no_phonel{display:inline;}
@media screen and ( max-width:580px) {
	.phonel{display: inline;}
	.no_phonel{display:none;}
}

.phone{display: none;}
.no_phone{display:inline;}
@media screen and ( max-width:520px) {
	.phone{display: inline;}
	.no_phone{display:none;}
}

.mobile{display: none;}
@media screen and ( max-width:374px) {
	.mobile{display: inline;}
}

/* marginを適応させたいとき */
.tb_b{display: none;}
.no_tb_b{display: block;}
@media screen and ( max-width:767px) {
	.tb_b{display: block;}
	.no_tb_b{display: none;}
}

.phone_b{display: none;}
.no_phone_b{display:block;}
@media screen and ( max-width:520px) {
	.phone_b{display:block;}
	.no_phone_b{display:none;}
}


/* ---------------------------------------------------------
■ デフォルトリセット
--------------------------------------------------------- */

* {
 box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
table, th, td, img, form {
	margin: 0;
	padding: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 100%;
	line-height: 1.6;
	border: none;
	list-style-type: none;
}
img {
	vertical-align: top;
	width:100%;
	height:auto;
}

a{color:#333;}

a:link    {text-decoration: none; }
a:visited {text-decoration: none; }
a:hover   {text-decoration: none; }
a:active  {text-decoration: none; }


/* ---------------------------------------------------------
■ レイアウトベース
--------------------------------------------------------- */

html {font-size:16px;}

body {
 margin: 0;
 padding: 0;
 position: relative;
 text-align: center;
 font-family: "Noto Serif JP", serif;
 color:#222;
 font-feature-settings: "palt";
 display: flex;
 flex-direction: column;
 min-height: 100vh;
 overflow-x: hidden;
}


.youtube iframe{
	width:100%;
	height:auto;
	aspect-ratio:16 / 9;
}

/* ---------------------------------------------------------
■ アコーディオン
--------------------------------------------------------- */
.open_title{cursor:pointer;}
.open_box{display:none;}


/* ---------------------------------------------------------
■ 点滅
--------------------------------------------------------- */

.Blinking{opacity:0;}
.Blinking.is-show{animation: Blinking 1.5s;opacity:1;}

@keyframes Blinking {
 0% {opacity: 0;}
 9% {opacity: 0;}
 10% {opacity: 1;}
 13% {opacity: 0;}
 16% {opacity: 1;}
 18% {opacity: 0;}
 25% {opacity: 1;}
 30% {opacity: 0;}
 35% {opacity: 1;}
 38% {opacity: 0;}
 50% {opacity: 0;}
 55% {opacity: 1;}
 56% {opacity: 0;}
 88% {opacity: 0;}
 90% {opacity: 1;}
 97% {opacity: 1;}
 99% {opacity: 0;}
 100% {opacity: 1;}
}


/* ---------------------------------------------------------
■ フェードイン
--------------------------------------------------------- */
.FadeIn {opacity: 0;transition: all .5s ease;transform: translate(0,1.2rem);}
.FadeIn.is-show{opacity: 1;transform:none;}

.fadeList-item { opacity: 0; transform: translateY(-10px);}
.fadeList-item.imgList { opacity: 1; transform: translateY(0); transition: .6s;}