
/*-----------------------------------

	intro

-----------------------------------*/
#intro .text{
	width: 48%;
}
#intro .img{
	width: 48%;
}
#intro h3:before,
#intro h3:after{
	position: absolute;
}
#intro h3:before{
	content: url("../images/deco_star_y.svg");
	width: 50px;
	left: -40px;
	top: -60px;
}
#intro h3:after{
	content: url("../images/deco_star_o.svg");
	width: 25px;
	left: -60px;
	top: 0;
}
@media screen and (max-width: 980px){
	#intro h3:before{
	  width: 30px;
	  left: 0;
	  top: -40px;
	}
	#intro h3:after{
	  width: 15px;
	  left: -10px;
	  top: -20px;
	}
	#intro .text,
	#intro .img{
		float: none!important;
	}
	#intro .text{
		width: 100%;
		margin-right:0;
	}
	#intro .img {
	  width: 80%;
	  max-width: 640px;
	  margin: 30px auto 30px !important;
	}
}
/*-----------------------------------

	list

-----------------------------------*/
#list .character {
  right: -5%;
  top: -50px;
  width: 260px;
}
@media screen and (max-width: 980px){
	#list .character {
	  position: static;
	  width: 60%;
	  margin: 30px auto 0;
	text-align: center;
	}
}
/*-----------------------------------

	manager

-----------------------------------*/
#manager article {
	padding: 20px 2%;
}
#manager article .text{
	width: 64%;
}
#manager article .text .title{
	margin-bottom: 20px;
	padding-left: 15px;
	border-left: solid 5px #ffd737;
}
#manager article .img{
	width: 34%;
}
#manager .character {
	right: -5%;
	top: -110px;
	width: 260px;
}
@media screen and (max-width: 980px){
	#manager .character {
	  position: static;
	  width: 60%;
	  margin: 30px auto 0;
	text-align: center;
	}
	#manager article .text,
	#manager article .img{
		float: none!important;
	}
	#manager article .text{
		width: 100%;
		margin-right:0;
	}
	#manager article .img {
	  width: 80%;
	  max-width: 640px;
	  margin: 30px auto 30px !important;
	}
}
