@charset "utf-8";

/* !Clearfix
---------------------------------------------------------- */
.clearfix,
header {
	display: block;
	min-height: 1%;
}
.clearfix:after,
header:after {
	clear: both;
	content:".";
	display: block;
	height: 0;
	visibility: hidden;
}
* html .clearfix,
* html header {
	height: 1%;
	/*\*//*/
	height: auto;
	overflow: hidden;
	/**/
}
/* ==========================================================
!Common
========================================================== */
.link_arw01:after {
	content: "";
	background: url(../images/ico_arw01.png) no-repeat 0 85%;
	background-size: 100%;
	margin: 0 0 0 3px;
	padding: 0 12px 0 0;
}

.inner01 p {
	margin-bottom: 10px;
	line-height: 1.8;
}

/* チューリップ */
#sec01 sup,
#sec02 sup {
	display: inline-block;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 0.8em;
	background: url(../../common/images/ico_annotation02.png) no-repeat 0 50%;
	background-size: 100% auto;
}
.note01:before {
content: "";
	display: inline-block;
	width: 12px;
	height: 15px;
	margin: 0 12px 0 0;
	background: url(../../images/ico_note01.png) no-repeat left 3px;
	background-size: 12px;
}

/* ==========================================================
!Header
========================================================== */
.btn_home01 {
	float: left;
	width: 26.667%;
}
	.btn_home01 img {
		max-width: 100px;
	}
.logo01.lower {
	float: right;
}
/* ==========================================================
!Mainimg
========================================================== */
#mainimg {
		padding: 0 4.6% 0 4.6%;
	background: url(../../common/images/bg_mainimg01.png) repeat;
	background-size: 12px;
}
	#mainimg .outer01 {
		padding: 9% 37% 9% 0;
		background: url(../images/bg_mainimg_support01.png) no-repeat right 70%;
		background-size: 114px;
	}
	#mainimg .outer01 h1 {
		width: 100%;
		max-width: 221px;
	}
/* ==========================================================
!support
========================================================== */
#content .inner01 {
	margin: 8% 0 0 0;
}
.inner01 .img_nutrition01 {
	margin: 20px 0 40px 0;
	font-size: 0;
	text-align: center;
}
	.inner01 .img_nutrition01 li {
		display: inline-block;
		position: relative;
		font-size: 100%;
		vertical-align: middle;
	}
	.inner01 .img_nutrition01 li:first-of-type {
		z-index: 2;
		width:27%;
		margin: 0 -0.5% 0 0;
	}
	.inner01 .img_nutrition01 li:nth-child(2) {
		z-index: 1;
		width:40%;
		margin: 0 -4% 0 0;
	}
	.inner01 .img_nutrition01 li:last-of-type {
		z-index: 0;
		width:34%;
		margin: 0 -2% 0 0;
	}
#sec01,
#sec02,
#sec03 {
	padding: 0 0 10px 0;
}
	#sec01 h2,
	#sec02 h2,
	#sec03 h2 {
		margin: 40px 0 20px 0;
	}
	#sec01 h3 {
		margin: 35px 0 20px 0;
	}
	#sec02 .img_support06 {
		margin: 20px 0 0 0;
	}

	#sec03 ul {
		margin: 40px 0 0 0;
	}
		#sec03 ul li {
			margin: 0 0 0 25px;
			font-size: 50%;
			text-indent: -25px;
		}

.summary01 {
	position: relative;
	margin: 0;
	text-align: center;
}
	.summary01:before {
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: 1;
		width: 12.537%;
		max-width: 42px;
		height: 100%;
		max-height: 35px;
		background: url(../images/img_support_fe01.png) no-repeat 0 0;
		background-size: contain;
		content: "";
		animation: jump1 3s linear 0s infinite;
	}
	.summary01:after {
		position: absolute;
		visibility: visible;
		bottom: 0;
		right: 0;
		width: 13.284%;
		max-width: 45px;
		height: 100%;
		max-height: 37px;
		background: url(../images/img_support_ca01.png) no-repeat 0 0;
		background-size: contain;
		content: "";
		animation: jump2 3s linear 0s infinite;
	}
@keyframes jump1 {
	0%   { transform: translate(0%, 0%); }
	50%  { transform: translate(0%, -30%); }
	100% { transform: translate(0%, 0%); }
}
-webkit-@keyframes jump1 {
	0%   { transform: translate(0%, 0%); }
	50%  { transform: translate(0%, -30%); }
	100% { transform: translate(0%, 0%); }
}
@keyframes jump2 {
	0%   { transform: translate(0%, -30%); }
	50%  { transform: translate(0%, 0%); }
	100% { transform: translate(0%, -30%); }
}
-webkit-@keyframes jump2 {
	0%   { transform: translate(0%, -30%); }
	50%  { transform: translate(0%, 0%); }
	100% { transform: translate(0%, -30%); }
}

.summary02 {
	margin: 6% 0 0 0;
	text-align: center;
}

/* ==========================================================
!cvarea
========================================================== */
.cv_area01 {
	margin: 10.667% 0 8% 0;
}
	.cv_area01 p{
		margin: 0 0 10px 0;
	}
/* ==========================================================
!Useful
========================================================== */
.useful01 {
	margin: 0 0 10% 0;
}
	.useful01 h2 {
		margin: 0 0 4% 0;
	}