@charset "UTF-8";
@import url("./animation.css");
@import url("./header.css");
@import url("./footer.css");
@import url("./site.css");

/* ==================== all objects are border-box ==================== */
*, *:before, *:after{	box-sizing: border-box;	}


/* ==================== base ==================== */
.gothic{  font-family: 'Noto Sans JP', sans-serif;	}
.mincho{	font-family: 'Noto Serif JP', serif;	}
.Montserrat{	font-family: 'Montserrat', sans-serif;	}
@media screen and (min-width: 768px){	.sp{	display: none!important;	}	}
@media screen and (max-width: 767px){	.pc{	display: none!important;	}	}

sup
{
	font-size: 70%;
	line-height: normal;
	vertical-align: top;
}


/* ========== body ========== */
body.scrollLock
{
	position: fixed;
	width: 100%;
	height: 100%;
}


/* ========== ME Afade ========== */
/*
.MH.Afade{	animation: fadeOut60 0.15s ease-in-out 0s 1 both;	}
.MO.Afade{	animation: fadeIn60 0.1s ease-in-out 0s 1 both;	}
@media screen and (max-width: 767px)
{
	.MH.Afade{	animation: none;	}
	.MO.Afade{	animation: none;	}
}
 */

/* ========== ME AfadeZoom ========== */
/*
.MH.AfadeZoom{	animation: fadeZoomIn 0.3s ease-in-out 0s 1 both;	}
.MO.AfadeZoom{	animation: fadeZoomOut 0.3s ease-in-out 0s 1 both;	}
@media screen and (max-width: 767px)
{
	.MH.AfadeZoom{	animation: none;	}
	.MO.AfadeZoom{	animation: none;	}
}
 */


/* ========== flex ========== */
.fBox{	display: flex;	flex-wrap: wrap;	justify-content: space-between;	}


/* ========== img wrapper ========== */
.IWW img, .IW img{	width: 100%;	height: auto;	}
.IWH img{	width: 100%;	height: auto;	}
.IHH img, .IH img{	width: auto;	height: 100%;	}
.IHW img{	width: auto;	height: 100%;	}
@media screen and (max-width: 767px)
{
	.IWH img{	width: auto;	height: 100%;	}
	.IHW img{	width: 100%;	height: auto;	}
}


/* ===== vertical center, center/center, center/right, center/left, bottom/left..... ===== */
.CC{	display: flex;	align-items: center;	justify-content: center;	}
.CL{	display: flex;	align-items: center;	justify-content: flex-start;	}
.CR{	display: flex;	align-items: center;	justify-content: flex-end;	}
.BC{	display: flex;	align-items: flex-end;	justify-content: center;	}
.BL{	display: flex;	align-items: flex-end;	justify-content: flex-start;	}
.BR{	display: flex;	align-items: flex-end;	justify-content: flex-end;	}
.TC{	display: flex;	align-items: flex-start;	justify-content: center;	}
.TL{	display: flex;	align-items: flex-start;	justify-content: flex-start;	}
.TR{	display: flex;	align-items: flex-start;	justify-content: flex-end;	}


/* ==================== parts ==================== */

/* ========== tri ========== */
.triT, .triB, .triR, .triL
{
	width: 1rem;
	height: 1rem;
	border-top: 1px solid rgba(255, 255, 255, 1.0);
	border-right: 1px solid rgba(255, 255, 255, 1.0);
}
.triT{	transform: rotate(-45deg);	}
.triB{	transform: rotate(135deg);	}
.triR{	transform: rotate(45deg);	}
.triL{	transform: rotate(-135deg);	}



/* ========== textEdge ========== */
.textEdgeWhite1px
{
	text-shadow:
		white 1px 1px 0, white -1px -1px 0,
		white -1px 1px 0, white 1px -1px 0,
		white 0px 1px 0, white 0 -1px 0,
		white -1px 0 0, white 1px 0 0;
}

.textEdgeWhite2px
{
	text-shadow:
		white 2px 0px,  white -2px 0px,
		white 0px -2px, white 0px 2px,
		white 2px 2px , white -2px 2px,
		white 2px -2px, white -2px -2px,
		white 1px 2px,  white -1px 2px,
		white 1px -2px, white -1px -2px,
		white 2px 1px,  white -2px 1px,
		white 2px -1px, white -2px -1px;
}


/* ==================== coverAll ==================== */
body::before
{
	content: "";
	display: block;

	z-index: 9999;
	position: fixed;
	top: 0;	left: 0;

	width: 100%;	height: 100vh;
	background-color: rgba(255, 255, 255, 1.0);
}
body.loaded::before{	animation: fadeOutRemove 0.5s linear 0.5s 1 both;	}


/* ==================== lightbox ==================== */
.lightboxOverlay
{
	background-color: rgba(51, 51, 51, 0.9);
	opacity: 1.0;
}











/* ==================== lity ==================== */
.lity{	background-color: rgba(255, 255, 255, 0.8);	}

/* .lity-container{	min-width: 860px;	} */

.lity-content
{
	/* width: 90vw; */
	max-height: 80vh;
	overflow-y: scroll;
	background-color: rgba(255, 255, 255, 0.0);
}

.lity-content:after{	box-shadow: none;	}

.lity-close
{
	position: absolute;
	top: 0rem;	right: 0rem;
	width: 3rem;	height: 3rem;

	opacity: 0;
}
/* .lity-close:active{	top: 2rem;	} */

/* ======================================== SP ======================================== */
@media screen and (max-width: 767px)
{

.lity-container{	min-width: 90vw;	}

.lity-close
{
	top: 0rem;	right: 0rem;
	width: 5rem;	height: 5rem;
}
/* .lity-close:active{	top: 3rem;	} */


}

/*==================== end ====================*/