body{
	background-color:#000033;
	background-image:linear-gradient(to bottom,#000033,#990099);
	color:#c0c0c0;
	font-family:"MSP明朝","平成明朝",serif;
	margin:0;
	padding:0;
	
	}
	
h1{
	font-size:300%;
	
	}
	
h2{
	font-size:150%;
	
	}
	
p{
	font-size:100%;
	
	}
	
article{
	position:relative;
	width:1200px;
	margin-left:auto;
	margin-right:auto;
	
	}
	
header{
	color:#ccc;
	
	}
	
header img{
	width:600px;
	height:120px;
	
	}
	
.header-in{
	width:1200px;
	margin-left:auto;
	margin-right:auto;
	
	}
	
nav ul{
	font-weight:bold;
	text-align:center;
	padding:10px;
	margin:10px;
	
	}
	
nav li{
	display:inline;
	padding:20px;
	margin:10px;
	font-size:150%;
	
	}
	
.slide{
	width:1200px;
	height:700px;
	overflow:hidden;
	position:relative;
	
	}
	
.message{
	position:absolute;
	top:50px;
	left:100px;
	font-weight:bold;
	text-shadow:0 5px 10px #0000cc;
	z-index:9;
	
	}
	
.message p{
	font-size:120%;
	}
	
.item{
	opacity:0;
	width:100%;
	height:100%;
	object-fit:cover;
	position:absolute;
	left:0;
	top:0;
	-webkit-:anime 40s 0s infinite;
	animation:anime 20s 0s infinite;
	
	}
	
.item:nth-of-type(1){
	-webkit-animation-dely:10s;
	animation-delay:5s;
	
	}
	
.item:nth-of-type(2){
	-webkit-animation-dely:20s;
	animation-delay:10s;
	
	}
	
.item:nth-of-type(3){
	-webkit-animation-dely:30s;
	animation-delay:15s;
	
	}
	
.item:nth-of-type(4){
	-webkit-animation-dely:40s;
	animation-delay:20s;
	
	}
	
.boxB{
	float:left;
	width:80%;
	
	}
	
.boxA{
	float:left;
	width:80%;
	
	}
	
.boxA .box1{
	float:left;
	width:30%;
	margin-left:10px;
	margin-right:10px;
	padding-left:10px;
	padding-right:10px;
	
	}
	
.boxA .box2{
	float:left;
	width:30%;
	margin-left:10px;
	margin-right:10px;
	padding-left:10px;
	padding-right:10px;
	
	}
	
boxA .box3{
	float:left;
	width:30%;
	margin-left:10px;
	margin-right:10px;
	padding-left:10px;
	padding-right:10px;
	
	}
	
.boxA after{
	clear:both;
	
	}
	
.boxC{
	float:left;
	width:80%;
	
	}
	
aside{
	float:right;
	width:20%;
	
	}
	
footer{
	clear:both;
	text-align:center;
	border-top:5px solid #9900ff;
	
	}
	
	
	
/*ふわっとアニメーション*/
@keyframes anime{
	0%{
		opacity:0;
		
		}
		
	30%{
		opacity:1;
		
		}
		
	35%{
		opacity:1;
		
		}
		
	50%{
		opacity:0;
		z-index:9;
		
		}
		
	100%{
		opacity:0;
		
		}
		
	}
	
@-webkit-keyframesanime{
		0%{
		opacity:0;
		
		}
		
	30%{
		opacity:1;
		
		}
		
	35%{
		opacity:1;
		
		}
		
	50%{
		opacity:0;
		z-index:9;
		
		}
		
	100%{
		opacity:0;
		
		}
	
	}