@charset "utf-8";
/* ===================================================================

 file name  :index.css
 style info :トップページ

=================================================================== */

/* =============================

	overwrite

=============================== */
#main{
	padding: 0;
}


/* =================================== */
#mv img{
	width: 100%;
	height: auto;
}

#mv .mvbanner{
	width: 30%;
	position:absolute;
	right: 15%;
	bottom: 25px;
}

#mv .mvbanner img{
	width: 100%;
	height: auto;
} 

#about{
	padding: 100px 0 0;
	background: url(../images/index/bg_texture.jpg) no-repeat 50% 0;
	background-size: 100% auto;
}
#about p{
	text-align: center;
	font-size: 1.6rem;
	line-height: 2.625;
}
#about .about-list{
	margin: 90px 0 0;
	padding: 80px 0;
	background: #f5f5f5;
	text-align: center;
}
#about .about-list ul{
	width: 980px;
	margin: 0 auto;
}
#about .about-list ul li{
	width: 300px;
	float: left;
	padding: 36px 0 38px;
	border: solid 2px #fff;
}
#about .about-list ul li + li{
	margin: 0 0 0 40px;
}
#about .about-list ul li h3 .num{
	display: inline-block;
	margin: 18px 0 15px;
	font-size: 2.8rem;
	color :#16adaf;
	border-bottom: solid 1px #16adaf;
}
#about .about-list ul li h3 .ja{
	display: block;
	margin: 0 0 35px;
	font-size: 2rem;
}
#about .about-list ul li .btn-eft{
	width: 140px;
	margin: 0 auto;
}

#info{
	width: 1200px;
	margin: 0 auto;
	padding: 80px 0 0;
	position: relative;
	overflow:hidden;
}
#info .feed{
	margin: 0 0 60px;
}
#info .feed dl{
	font-size: 1.4rem;
}
#info .feed dl dt{
	float: left;
	padding: 15px 0 15px 28px;
}
#info .feed dl dd{
	padding: 15px 10px 15px 130px;
}
/* post */
#info .feed dl dd p {
	margin:0.2em 0 1em;
}
#info .feed dl dd p:last-child{
	margin-bottom: 0;
}
#info .feed dl dd a{
	color:#2578c0;
	text-decoration:none;
	outline:none;
	border-bottom:1px solid #2578c0;
}
#info .feed dl dd a:hover{
	border-bottom:none;
}

#info .feed dl dd:nth-of-type(odd){
	background: #e7f7f7;
}

#info .btn-eft{
	width: 140px;
	margin: 0 auto;
}

#infoLoader,
#infoLoader:after {
  border-radius: 50%;
  width: 30px;
  height: 30px;
}
#infoLoader {
  margin: 30px auto;
  font-size: 10px;
	position: absolute;
	top:0;
	left:50%;
	margin-left: -15px;
  text-indent: -9999em;
  border-top: 4px solid rgba(120,170,200, 0.5);
  border-right: 4px solid rgba(120,170,200, 0.5);
  border-bottom: 4px solid rgba(120,170,200, 0.5);
  border-left: 4px solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
@media screen and (max-width: 640px){
	#infoLoader {
	  margin: 30px auto;
		top:0;
		left:15px;
		margin-left: 0;
	}
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/* ==========================================================================
   smartPhone
   ========================================================================== */
@media screen and (max-width: 640px){
/* =============================

	overwrite

=============================== */






/* =================================== */
	#mv figure{
		margin: 0 -25% 0 -22%;
	}
	
	#mv .mvbanner{
	width: 55%;
	position:absolute;
	right: 1%;
	bottom: 10px;
}
	
	#about{
		padding: 40px 15px 0;
		background-size: 300% auto;
	}
	#about p{
		font-size: 1rem;
		line-height: 2.2;
	}
	#about .about-list{
		margin: 45px -15px 0;
		padding: 40px 0;
	}
	#about .about-list ul{
		width: 59.375%;
	}
	#about .about-list ul li{
		width: 100%;
		float: none;
		padding: 24px 0;
		border: solid 1px #fff;
	}
	#about .about-list ul li + li{
		margin: 15px 0 0;
	}
	#about .about-list ul li figure{
		width: 40%;
		margin: 0 auto;
	}
	#about .about-list ul li h3 .num{
		margin: 10px 0 12px;
		font-size: 1.7rem;
	}
	#about .about-list ul li h3 .ja{
		display: block;
		margin: 0 0 24px;
		font-size: 1.25rem;
	}
	#about .about-list ul li .btn-eft{
		width: 48%;
	}

	#info{
		width: 100%;
		margin: 0 auto;
		padding: 40px 15px 0;
	}
	#info .feed{
		margin: 0 0 30px;
	}
	#info .feed dl{
		font-size: 0.9rem;
	}
	#info .feed dl dt{
		padding: 10px 0 10px 13px;
	}
	#info .feed dl dd{
		padding: 10px 10px 10px 73px;
	}
	#info .feed dl dd:nth-of-type(odd){
		background: #e7f7f7;
	}

	#info .btn-eft{
		width: 33%;
	}

}
