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

font{
	font-size: 1vh;
	display:inline-block;
}

.cc{ font-family : 'SimSun','sans-serif';
}

.top{
	position:relative;
	width:100%;
	height:90vh;
	background:url(../img/kaede.jpg) center no-repeat;
	background-position:50% 25%;
	background-color:#f4f6f7;
	}

.logo{
	width:200px;
	position: absolute;
	left:20px;
	top:20px;
	}

.cat{
	writing-mode: vertical-rl;
	color:#666;
	font-size:30px;
	position: absolute;
	left:20%;
	top:20%;
	line-height:130%;
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	}

.nmn{
	position:absolute;
	right:15%;
	bottom:2%;
	width:400px;
	}

.cat2{
	position:absolute;
	width:400px;
	left:15%;
	bottom:3%;
	filter: drop-shadow(1px 1px 5px #fff);
	}

@media (min-width:320px) and (max-width:360px){
	.top{
	background:url(../img/kaede3.jpg) center no-repeat;
	background-size: cover;
	background-position:42% 100%;
	height:550px;
	}	
	.logo{ width:120px;}	
.nmn{
	position:absolute;
	right:5%;
	bottom:2%;
	width:17vw;
	}

	
.cat{
	position: absolute;
	left:5%;
	top:25%;
	line-height:110% !important;
	font-size:6vw !important;
	}
	
.cat2{
	position:absolute;
	width:65%;
	left:5%;
	bottom:4%;
	}
	
	
	}


	
@media (min-width:361px) and (max-width:767px){
	font{
	font-size: 1vh;
	display:inline-block;
}
	.top{
	background:url(../img/kaede3.jpg) center no-repeat;
	background-size: cover;
	background-position:42% 100%;
	height:600px;
	}	
.logo{ width:120px;}	
.nmn{
	position:absolute;
	right:5%;
	bottom:2%;
	width:17vw;
	}

	
.cat{
	position: absolute;
	left:5%;
	top:25%;
	line-height:110% !important;
	font-size:6vw !important;
	}
	
.cat2{
	position:absolute;
	width:65%;
	left:5%;
	bottom:4%;
	}
	
	}

@media (min-width:768px) and (max-width:1024px){
	font{
	font-size: 1vh;
	display:inline-block;
}
	.top{
	position:relative;
	width:100%;
	height:90vh;
	background:url(../img/kaede.jpg) center no-repeat;
	background-position:42% 25%;
	background-color:#f4f6f7;
	background-size:cover;
	}

.logo{
	width:200px;
	position: absolute;
	left:20px;
	top:20px;
	}

.cat{
	writing-mode: vertical-rl;
	color:#666;
	font-size:250%;
	position: absolute;
	left:5%;
	top:20%;
	line-height:130%;
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	}

.nmn{
	position:absolute;
	right:10%;
	bottom:2%;
	width:13%;
	}

.cat2{
	position:absolute;
	width:50%;
	left:5%;
	bottom:3%;
	filter: drop-shadow(1px 1px 5px #fff);
	}
	}
	
	@media (min-width: 1024px){
		font{
	font-size: 1vh;
	display:inline-block;
}
		.top{
	position:relative;
	width:100%;
	height:90vh;
	background:url(../img/kaede.jpg) center no-repeat;
	background-position:42% 25%;
	background-color:#f4f6f7;
	background-size:cover;
	}
	
	.cat2{
	position:absolute;
	width:300px;
	left:17%;
	bottom:3%;
	filter: drop-shadow(1px 1px 5px #fff);
	}
	.nmn{
	position:absolute;
	right:15%;
	bottom:2%;
	width: auto;
	height:70%;
	}
		}