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


body{
	margin:0;
}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

p{
	color:#282828;
	line-height:200%;

}


#header{
	width:100%;
	height:710px;
	text-align:center;
	position:relative;
	
	background:url(../img/head_mainimage_bg.jpg) center -180px no-repeat;
}

#headerHead{
	width:100%;
	height:710px;
	background:url(../img/head_mainimage_head.png) right -180px no-repeat;
}

#header h1{
	width:611px;
	height:190px;
	text-align:center;
	position:absolute;
	left:20px;
	bottom:0;
}

/* ▼h1要素にアニメーションを適用 */
#header{
  animation-duration: 30s;  /* アニメーション時間 */
  animation-name: slidein;  /* アニメーション名 */
  animation-iteration-count:infinite;
  animation-direction:alternate;
 
}


/* ▼アニメーション名「slidein」の動作内容 */
@keyframes slidein {
  from {
	background:url(../img/head_mainimage_bg2.jpg) right 100px no-repeat;
	
  }
  to {
	background:url(../img/head_mainimage_bg.jpg) left -300px no-repeat;
  }

  }




div#first{
	border-top:#282828 12px solid;
	border-bottom:#282828 12px solid;
	background:#ffe600;
	
}

div#first div#firstWrapper{
	width:1000px;
	margin:0 auto;
	padding:40px 0 60px 0;
	
}

div#first h2{
	font-size:170%;
	font-weight:bold;
	color:#282828;
}

div#first h3{
	width:50%;
	margin:2em 0 2em 0;
	font-size:130%;
	font-weight:bold;
	color:#282828;
}

div#first div.box01{
	padding:40px 0;
	height:750px;
	position:relative;
}

div#first div.box01 p{
	width:50%;
	
}


div#first div.box01 div.rightImg{
	width:320px;
	left:620px;
	top:40px;
	position:absolute;
}

div#first div.box01 div.rightImg img{
	margin:0 0 10px 0;
}

div#first div.box02{
	width:100%;
	margin:auto;
	text-align:center;
	font-weight:bold;
}

/*===============================================
NEWS
===============================================*/
div#news{
	padding-bottom:60px;
	background:#4eb2d2;
	border-bottom:#282828 12px solid;
}

div#news h2{
	width:100%;
	text-align:center;
}

div#news p.copy{
	margin:1em auto;
	width:auto;
	font-size:125%;
	font-weight:bold;
	text-height:120&;
	text-align:center;
}
div#news span.copyColor{
	background:#FFF;
	color:#282828;
}


div#news div#newsWrapper{
	width:100%;
	text-align:center;
}

div#news div.reportBox{
	width:800px;
	margin:30px auto;
	padding:60px 0 30px 0;
	background:#FFFFFF;
	text-align:center;
	
	box-shadow: 4px 4px 0px 2px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 4px 4px 0px 2px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 4px 4px 0px 2px rgba(0, 0, 0, 0.2);
	
	
}

div#news div.reportBox p.tweet{
	width:90%;
	margin:0 auto;
	
}

div#news div.reportBox blockquote.twitter-tweet{
	width:90%;
	}


div#news div.reportBox p.date1{
	margin:0;
	font-size:100%;
	line-height:100%;
	font-weight:bold;
	font-family:Helvetica, sans-serif;
}

div#news div.reportBox p.date2{
	padding-bottom:30px;
	font-size:400%;
	line-height:100%;
	font-weight:bold;
	font-family:Helvetica, sans-serif;
}

div#news div.reportBox h3{
	width:470px;
	margin:1em auto;
	font-size:150%;
	font-weight:bold;	
}

div#news div.reportBox p.text{
	margin:0 auto 1em auto;
	width:470px;
	text-align:left;
}

div#news div.reportBox p.photo1{
	width:100%;
	text-align:center;
}

div#news div.reportBox p.photo2{
	width:90%;
	margin:60px auto;
	text-align:center;
	font-size:80%;
}

div#news div.reportBox p.photo2 img{
	margin-bottom:0;
	width:60%;
}

/*===============================================
コンセプト
===============================================*/

div#concept{
	background:#ebebeb;
}

div#conceptWrapper{
	width:920px;
	margin:0 auto;

}

div#concept h2{
	width:100%;
	text-align:center;
}

div#concept div#conceptText {
	margin:0;
	padding:0 0 60px 0;
}

div#concept div#conceptText h3{
	font-size:140%;
	font-weight:bold;
	margin:2em 0 0 0;
	
	/*border-bottom:#282828 3px solid; */
	
}

span.h3Line{
border-bottom:#282828 3px solid;	
}

div#concept div#conceptText p{
	margin:1em 0 1em 0;;
	font-size:100%;
	
}


/*===============================================
フッター
===============================================*/

div#footer{
	padding-bottom:60px;
	background:#282828;
	border-top:#282828 12px solid;
}

div#footer h2{
	width:100%;
	margin-bottom:30px;
	text-align:center;
}

div#footer p{
	width:100%;
	padding:30px 0;
	text-align:center;
	
}


/*===============================================
●style.css 画面の横幅が769px以上
===============================================*/
@media screen and (min-width: 769px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}





}


