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

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

top.css

:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/* font-size===========================================

10px -> 72%
11px -> 79%
12px -> 86%
13px -> 93%
14px -> 100%
15px -> 108%
16px -> 115%
17px -> 122%
18px -> 129%
19px -> 136%
20px -> 143%
21px -> 150%
22px -> 158%
23px -> 165%
24px -> 172%
25px -> 179%
26px -> 186%

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


/* mainVisual
---------------------------------- */
.mainVisual{
	background: url(../img/topmv.jpg) center center no-repeat;
	background-size:cover;
	min-height: 392px;
}
.catch{
	text-align: center;
}

.catch img{
margin-top: 173px;
	
}

/* introBox
---------------------------------- */
.introBox{
	background: #EAF6CF;
	border-bottom: 7px solid #A3D74F;

}

.introBox .box01{
	background:url(../img/topintrobk01.png) right bottom no-repeat;
	padding-top: 38px;
}

/*.introBox .innerL*/
.introBox .innerL{
	float: left;
	width: 540px;
}

.introBox .innerL h2{
	margin-top: 28px;
}

.introBox .innerL dt h3{
	font-size: 172%;/*24px*/
	margin: 27px 0 20px;
	color: #47A151;
	font-weight: normal;
}

.introBox .innerL dd{
	line-height: 2;
	margin-bottom: 52px;
	text-align: justify;
}

/*.introBox .innerR*/
.introBox .innerR{
	float: right;
	border: 1px solid #FFF;
	width: 280px;
	height: 220px;
	background: url(../img/topintrobk02.png) 0 0 repeat;
	margin-right: 24px;
	box-sizing: border-box;
}
.introBox .innerR dt{
	background: #48A251;
	height: 28px;
	margin: 2px 2px 15px 2px;
	text-align: center;
	padding-top: 4px;
	color: #FFF;
	box-sizing: border-box;
}

.introBox .innerR dd{
	margin-left: 28px;
}
.introBox .innerR dd p{
	font-size:136%;/*19px*/
	margin-top: 5px;
}

.introBox .innerR dd.adtxt01{
	font-size: 93%;/*13px*/
	margin-top: 8px;
}

.introBox .innerR dd a{
	font-size: 108%;/*15px*/
	text-decoration: underline;
	color: #46A051;
	background: url(../common/mailIcon01.jpg) left 0 no-repeat;
	padding-left:36px;
	padding-top: 4px;
	height: 25px;
	margin-top: 8px;
	display: block;
}

.introBox .innerR dd a:hover{
	color:#398443;
}

/* meritBox
---------------------------------- */
.meritBox{
	padding: 60px 0 45px;
}
.meritBox h2,
.meritBox h3{
	text-align: center;
}

.meritBox h3{
	color: #47A151;
	font-weight: normal;
	font-size: 172%;/*24px*/
	margin: 25px 0 30px;
}

.meritBox img{
	display:block;
	margin-left:auto;
	margin-right:auto;
}

/* pagelink
---------------------------------- */
.pagelink{
	background: url(../img/linkbk.png) 0 0 repeat;
	height: 236px;
	padding: 28px 0;
	box-sizing: border-box;
	
}

.pagelink li{
	float: left;
	position: relative;
	margin-left: 51px;
}

.pagelink li:first-child{
	margin-left: 0;
}

/*.pagelink li p span 矢印・アイコン*/
.pagelink li p span{
	padding-top: 15px;
	padding-left: 20px;
	display: block;
	position: relative;
	color: #FFF;
	font-size: 108%;/*15px*/
	text-align: left;
	background: url(../common/arw03.png) 92% 16px no-repeat;
}
.pagelink li p.outlink span::after{
	background:url(../img/outIcon01.png) right 0 no-repeat;
	background-size: 18px 14px;
	display: inline-block;
	position: relative;
	top: 2px;
	left: 15px;
	content: "";
	width: 18px;
	height: 14px;
	
}

/*.pagelink li p テキスト部分*/
.pagelink li p{
	display: block;
	position: absolute;
	box-sizing: border-box;
	right: 0;
	bottom: 0;
	background: url(../img/plbk01.png) 0 0 repeat;
	width: 100%;
	height: 50px;
	overflow: hidden;
	z-index: 2;
}

.pagelink li a p::before,
.pagelink li a p::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.pagelink li a p,
.pagelink li a p::before,
.pagelink li a p::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .4s;
	transition: all .4s;
}

.pagelink li a p::after {
	top: 0%;
	width: 100%;
	left: -100%;
	height: 100%;
}
.pagelink li a:hover p::after {
	left: 0;
	background: #00B085;
}