/*
���j���[���S�̍���70px
��115px
���j���[�̉����ς���ꍇ��header_inner��grid-template-columns: 110px 1fr;��110px�̂Ƃ��̐����グ��

*/

/*
body{background-color:#afc9b4;padding:0;margin:0;}
*/


/*
#header_inner{
	display:grid;
	grid-template-columns: 110px 1fr auto;
	place-items:center left;
	box-sizing: border-box;

	padding:10px;box-sizing: border-box;
	transition: all .4s;
	border-bottom:1px solid #FFF;
}
*/

nav{
	width:100%;
}

#nav_inner{
	display:flex;
	width:100%;
	gap:20px;

	align-items: center;
	justify-content: center; /* �lj� */

	box-sizing: border-box;

	margin:0 auto;


}

/*----------------
�V���j���[�������火
------------------*/
header{
	box-sizing: border-box;
	top: 0;
	left: 0;

	/*
	position: fixed;
	*/
	position: sticky;
	top: 0;
	z-index:9;
	width:100%;
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);

}

.header {
	display: flex;
	justify-content: space-between;
	position: sticky;
	/*position:absolute;*/
	/*background: linear-gradient(0deg,rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 1) 100%);*/

	top: 0;
	left: 0;
	z-index: 10;

	box-sizing: border-box;
	width:100%;

	padding: 14px 24px;

	background: #FFF;
}

.nav a, .x_icon a {
	margin: 0 8px;
	text-decoration: none;
	color: #fff;
	font-size: 14px;
}

.nav a:hover {color: #db0081;}

.x_icon a img{width:100%;max-width:32px;border-radius:5px;}


/*--------------------
�n���o�[�K�[���j���[
---------------------*/
.nav_open{
	display:none;
	position: relative;
	cursor: pointer;
	width: 32px;
	height:32px;
	color:#FFF;
	text-align:right;
	font-size:12px;

	background-color:#000;border-radius:3px;
}

.nav_open span{
	display: inline-block;
	transition: all .4s;
	position: absolute;
	left: 6px;
	height: 3px;
	border-radius: 2px;
	background: #FFF;
	width: 64%;
}

.nav_open span:nth-of-type(1) {
	top:6px; 
}

.nav_open span:nth-of-type(2) {
	top:11px;
}

.nav_open span:nth-of-type(3) {
	top:16px;
}

.nav_open span:nth-of-type(4) {
	background: none;
	font-size:8px;
	top:18px;
	left: 4px;
}

/*active�N���X�t�^�@������]���ā~��*/
.nav_open.active span:nth-of-type(1) {
	top: 4px;
	left: 5px;
	transform: translateY(6px) rotate(-45deg);
	width: 70%;
}

.nav_open.active span:nth-of-type(2) {
	opacity: 0;
}

.nav_open.active span:nth-of-type(3){
	top: 16px;
	left: 5px;
	transform: translateY(-6px) rotate(45deg);
	width: 70%;
}

/*--------------------
�X�N���[�����̋���
---------------------*/
/*
#header_scroll {font-size:0.9em;}
#header_scroll #header_logo img{max-height:30px;}
#header_scroll #nav_teny img{width:60px;}
#header_scroll #header_inner{
	grid-template-columns: 70px 1fr auto;
	padding:5px 10px;
}
*/
/*--------------------
���j���[�̃����N�̋���
---------------------*/
#nav_inner a{
	text-decoration: none;
	color:#222;
	display: inline-block;
}



/*@media (max-width: 768px) {*/
@media (max-width: 800px) {


	.nav {
		display: none;
	}

	.logo{margin-right: auto;}




	.header {
		padding: 10px 5px;
	}

}

/*�㉺�Q�i�v6�‚̗�@�g��Ȃ�����*/
/*
@media (min-width: 0px) and (max-width: 1200px) {

	header{
		display:grid;
		grid-template-columns: 80px 1fr 1fr 1fr 80px;
		gap:20px;
	}

	header div:first-child{
		grid-row: 1 / 3;
	}

	header div:last-child{
		grid-column: 5 / 6;
		grid-row: 1 / 3;
	}
}
*/


/*--------------------
640��
---------------------*/
/*@media (min-width: 0px) and (max-width: 768px) { */
@media (min-width: 0px) and (max-width: 800px) { 

	/*--------------------
	header
	---------------------*/
  	#header_inner{ 
		display:block;
 		grid-template-columns: 1fr;
		padding:0;
 	}

  	.nav_open{display:block;}
/*

	#header_logo{display:grid;grid-template-columns: 110px 1fr auto;width:100%;padding:10px;box-sizing: border-box;}
	#nav_teny{margin-left: 0;}

	nav{display:none;position: fixed;}
	#nav_inner{
		background-color:rgba(255,255,255,0.9);
		height:100vh;
		width:100%;
		flex-flow: column;
		justify-content: center;
		text-align:center;

	}
*/

	nav{
		display:none;
		position: fixed;

		top: 0;
		left: 0;

		/*width: 100vw;*/

		z-index: 999;
	}

	#nav_inner{
/*		background-color: #DB0081;*/
	background: rgba(212, 236, 243, 1);
/*
	background: linear-gradient(90deg,#FBDBDA 0%, #FBDBDA 31%, rgba(212, 236, 243, 1) 31%, rgba(212, 236, 243, 1) 100%);
*/

		height: 100vh;

		flex-flow: column;

		padding-top:70px;
/*		padding-left:24px;
		padding-right:24px;
		justify-content: start;
		align-items: start;
		text-align:left;
*/

		font-family: "Noto Serif JP", serif;

		text-align:center;

	}


	#nav_inner div{
		width:100%;
		/*border-bottom:1px solid #e5e5e5;*/
	}


	#nav_inner a{
		font-size:1.1em;
		padding-bottom: 5px;

		font-family: "Noto Serif JP", serif;
		/*
		display:flex;
		justify-content: space-between;
		align-items: center;

		width:100%;
		color:#fff;
		text-decoration:none;

		width:95%;margin:0 auto;
		border-bottom:1px solid #e5e5e5;
		*/
	}

/*
#nav_inner a::after{
	content: ">";
	color:#999;
	font-size:0.9em;
}
*/

	.nav a, .x_icon a {
		font-size: medium;
	}

	.nav_open,.logo,.x_icon{
		z-index: 1000;
	}

/*
	#header_scroll #nav_teny img{width:80px;}
*/


	/*--------------------
	header �X�N���[����
	---------------------*/
/*  	#header_scroll #header_inner{ 
		padding:0;
 	}

	#header_scroll */
	#nav_inner{
		height:100vh;
	}


	/*------------------------------------
	�n���o�[�K�[���j���[�@�X�N���[����
	-------------------------------------*/
	#header_scroll .nav_open span{
		height: 3px;
	}

	#header_scroll .nav_open span:nth-of-type(1) {
		top:6px; 
	}

	#header_scroll .nav_open span:nth-of-type(2) {
		top:11px;
	}

	#header_scroll .nav_open span:nth-of-type(3) {
		top:16px;
	}

	#header_scroll .nav_open span:nth-of-type(4) {
		top:18px;
	}


	/*active�N���X�t�^�@������]���ā~��*/
	#header_scroll .nav_open.active span:nth-of-type(1) {
		top: 4px;
		left: 5px;
		width: 70%;
	}

	#header_scroll .nav_open.active span:nth-of-type(3){
		top: 16px;
		left: 5px;
		width: 70%;
	}
}



/*---------------------------------
�@�z�o�[�A�j���[�V�����”\�ȃf�o�C�X�݂̂ɓK�p
-----------------------------------*/
@media (any-hover: hover) {
	/*--------------------
	���j���[�̃����N�̋���
	---------------------*/
	#nav_inner a {
		padding-bottom: 5px;
		position: relative;

	}
	#nav_inner a:before {
		background: #db0081;
		content: '';
		width: 100%;
		height: 1px;
		position: absolute;
		left: 0;bottom: 0;
		transform-origin: right top;
		transform: scale(0, 1);
		transition: transform .3s;
	}

	#nav_inner a:hover::before {
		transform-origin: center top;
		transform: scale(1, 1);


	}


	/*--------------------
	X�̃A�C�R���̋���
	---------------------*/
	.x_icon a:hover img {
		transition: transform 1s;
		transform: rotateY(360deg);
	}

}




/*--------------------
�X�|�b�g���C�g
---------------------*/
.spotlight {
	display:none;
	position: fixed;
	top: 0;
	left: 50%;
	transform: translateX(-50%);

	width: min(80vw, 1000px);
	height: 100vh;
	z-index:9999;
	background:linear-gradient(
		to bottom,
		rgba(255,255,255,0.8) 0%,
		rgba(255,255,255,0.3) 50%,
		rgba(255,255,255,0) 100%
	);
	clip-path: polygon(45% 0,55% 0,100% 100%,0% 100%);
	pointer-events: none;
}