/*
	CosplayNeJp トップページ
	スタイルシート 2024/02/27
*/

/* 横幅750px以上（ＰＣ）で見たとき */
@media only screen and (min-width: 750px) {
	body {
		-webkit-text-size-adjust: 100%;
		background-color: #000000;
		width: 100vw;
		height: 100vh;
		/*max-width: 1280px;*/
		min-width: 1070px;
		min-height: 680px;
		margin: auto;
		padding: 0px;
		border-width: 0px;
	}

	.main {
		position: relative;
		width: 100%;	/*width: 1280px;*/
		height: 100%;	/*height: 700px;*/
		top: 0px; /*-24px;*/
		left: 0px;

		margin: 0px;
		padding: 0px;
		border-width: 0px;
		box-sizing: border-box;

		background-image: linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5));
		background-color: White;
	}

	.char {
		position: absolute;
		width: 100%;	/*width: 1280px;*/
		height: 100%;	/*height: 700px;*/
		top: 0px; /*-24px;*/
		left: 0px;

		margin: 0px;
		padding: 0px;
		border-width: 0px;
		box-sizing: border-box;

		background-image: linear-gradient(rgba(0, 0, 255, 0.2), rgba(0, 255, 255, 0.2)),
			url("./gfx/top_bg/kosune.png");
/*		background-image: url("./gfx/top_bg/kosune.png");*/
/*		background-image: linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5)),
			url("./gfx/top_bg/kosune2.png");*/
/*		background-image: linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5)),
			url("./gfx/top_bg/kosune3.png");*/
/*		background-image: linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5)),
			url("./gfx/top_bg/kosune4.png");*/
		background-repeat: no-repeat;
		background-size: 1888px 1870px;
/*		background-size: 1852px 2516px;*/
/*		background-size: 1888px 2500px;*/
/*		background-size: 1888px 2176px;*/
/*		background-position: left 0px top -200px; *//* kosune1-3.png */
		background-position: left -140px top -240px;

/*		background-position: left -400px top -200px;*/ /* kosune4.png */
		/*background-color: White*/;
		background-color: rgba(0,0,0,0);
		background-color: rgba(0,0,255,0.0);
	}

	.logo {
		position: absolute;
		width: 400px;
		height: 76px;
		left: 20px; /*2%;*/
		top: 450px;
		background-image: url("./gfx/CNJlogo2.png");
		background-repeat: no-repeat;
		background-size: 100% 100%;
		transform: rotate( -30deg );
	}

	.info {
		position: absolute;
		width: 480px;
		height: 120px;
		left: 500px; /*50%*/
		top: 500px;
		padding: 10px;
		background-color: rgba(0,0,0,.5);
		border-radius: 20px;
		font-size: 20px;
		color: white;
	}
	.info ul {
		margin: 0px;
		padding: 0px 10px;
	}
	.info li {
		list-style-type: none;
	}

	.footer {
		position: fixed;
		width: 100%;
		bottom: 0;
		left: 0px;
		font-size: 15px;
		color: white;
		background-color: rgba(0,0,0,.1);
	}

	.aniv {
		position: absolute;
		top: 30px;
		left: 20px;
		font-weight: 300;
		font-size: 24px;
		text-shadow: 5px 5px #558abb;
		color: white;
		line-height: 15px;
	}
	.aniv h1 {
		font-size: 40px;
		display:inline;
	}
	.aniv h3 {
		font-size: 15px;
		display:inline;
	}
}
/* 横幅750px以下(スマホ)で見たとき */
@media only screen and (max-width: 750px) {
	body {
		-webkit-text-size-adjust: 100%;
		background-color: #000000;
		width: 100vw;
		height: 100vh;
		max-width: 750px; /*375px;*/
		min-height: 667px;
		margin: auto;
		padding: 0px;
		border-width: 0px;
	}

	.main {
		position: relative;
		width: 100%; /*750px; 375px;*/
		height: 100%; /* Xperia(875px)対応　標準的なiPhoneは667px; */
		top: 0px; /*-24px;*/
		left: 0px;
		margin: 0px;
		padding: 0px;
		border-width: 0px;
		box-sizing: border-box;
		background-image: linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5));
		background-color: white;
	}

	.char {
		position: absolute;
		width: 100%; /*750px; 375px;*/
		height: 100%; /* Xperia(875px)対応　標準的なiPhoneは667px; */
		top: 0px; /*-24px;*/
		left: 0px;
		margin: 0px;
		padding: 0px;
		border-width: 0px;
		box-sizing: border-box;
		background-image: linear-gradient(rgba(0, 0, 255, 0.2), rgba(0, 255, 255, 0.2)),
			url("./gfx/top_bg/kosune.png");
		background-repeat: no-repeat;
		background-size: 1888px 1870px;
		background-position: right -1000px top -240px;
		background-color: rgba(0,0,0,0);
	}

	.logo {
		position: absolute;
		width: 240px;
		height: 45px;
		left: 5px; /*2%*/;
		top: 430px;
		background-image: url("./gfx/CNJlogo2.png");
		background-repeat: no-repeat;
		background-size: 100% 100%;
		transform: rotate( -30deg );
	}

	.info {
		position: absolute;
		width: 280px;
		height: 80px;
		left: 70px; /*18%;*/
		top: 500px;
		padding: 10px;
		background-color: rgba(0,0,0,.5);
		border-radius: 20px;
		font-size: 16px;
		color: white;
	}
	.info ul {
		margin: 0px;
		padding: 0px 10px;
	}
	.info li {
		list-style-type: none;
	}

	.footer {
		position: fixed;
		width: 100%;
		bottom: 0;
		left: 0px;
		color: white;
		background-color: rgba(0,0,0,.1);
		font-size: 15px;
	}

	.aniv {
		position: absolute;
		top: 30px;
		left: 20px;
		font-weight: 300;
		font-size: 24px;
		text-shadow: 5px 5px #558abb;
		color: white;
		line-height: 15px;
	}
	.aniv h1 {
		font-size: 40px;
		display:inline;
	}
	.aniv h3 {
		font-size: 15px;
		display:inline;
	}
}