@charset "UTF-8";

/*==============================================*/
/* Contents Style */
/*==============================================*/
#Pankuzu {
	width:1200px;
	margin:0 auto 10px;
}
#Pankuzu a {
	color: #cf000b;
}
	

.onlySP {
	display: none !important;
}

strong {
	font-weight: bold;
}

a {
	color:#000;
	text-decoration:underline;
}

#mainarea {
	color: #333300;
	font-size: 14px;
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN",  Osaka, sans-serif;
	line-height: 1.85;
	width:100%;
}

#mainarea img {
	max-width: 100%;
	height: auto;
}
.mainFrame {
	background:#007440 url(../img/BG.jpg) repeat;
	padding-bottom:30px;
	width:100%;
}
.mainFrameInner {
	width:1000px;
	margin:0 auto;
}

.titleArea {
	margin-bottom:20px;
}
.titleArea .dateArea {
	background:#000;
}
.titleArea .dateArea p {
	color:#fff;
	font-size:36px;
	font-weight:bold;
	line-height:1.1;
	padding:0.3em 1em 0.2em;
	text-align:center;
}



.heading01 {
	color:#007440;
	font-size:36px;
	line-height:1.1;
	letter-spacing:0.05em;
	padding:0.4em 0.5em 0.3em;
	text-align:center;
	background:#f3e705;
}
.heading01.type02 {
	text-align:left;
}
.updateArea .heading01 {
	font-size:24px;
	text-align:left;
	padding-left:28px;
}
.titleArea .heading01 {
	letter-spacing:0.025em;
}

.frameArea01 {
	margin-bottom:30px;
}


.updateArea {
	float:left;
	width:640px;
}
.updateArea .scrollArea {
	overflow-y:auto;
	box-sizing: border-box;
	height:147px;
}
.updateArea .scrollArea .scrollAreaInner {
	padding:26px 28px;
}
.updateArea .scrollArea dl + dl {
	margin-top:0.7em;
}
.updateArea .scrollArea dl dt {
	float:left;
	font-size:16px;
	line-height:1.5;
}
.updateArea .scrollArea dl dd {
	font-size:16px;
	line-height:1.5;
	display:block;
	margin-left:9em;
}





.youtubeArea {
	float:right;
	width:339px;
}
.youtubeArea iframe {
}

.frameArea01 {
	background:#fff;
}
.frameArea01 .inner01 {
	padding:30px 40px;
}
.frameArea01.productsArea .inner01 {
	padding:40px;
}
.frameArea01 .inner01 .mainImg {
	float:left;
	width:410px;
}
.frameArea01 .inner01 .textArea {
	float:right;
	width:482px;
	margin-top:-4px;
}
.frameArea01 .inner01 .textArea .text01 {
	color:#900;
	font-size:24px;
	font-weight:bold;
	line-height:1.5;
	margin-bottom:0.7em;
}
.frameArea01 .inner01 .textArea .text02 {
	font-size:15px;
	line-height:1.77;
	margin-bottom:0.7em;
}





.frameArea01 .inner01 .mainImg img {
	box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .3);
}


.buyArea .colLeft {
	float:left;
	width:670px;
	margin-top:-3px;
}
.buyArea .colRight {
	float:right;
	width:235px;
}
.buyArea .text01 {
	color:#900;
	font-size:30px;
	font-weight:bold;
	line-height:1.25;
}
.buyArea .text02 {
	font-size:24px;
	line-height:1.25;
	margin:12px 0 20px;
}
.buyArea .text03 {
	font-size:24px;
	line-height:1.1;
	margin:0 0 4px;
}




.imgList01 {
	margin-top:25px;
}
.imgList01 li {
	float:left;
	width:15.2%;
	margin-left:1.6727%;
	box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .3);
}
.imgList01 li:hover {
	opacity:0.7;
}
.imgList01 li:first-child {
	margin-left:0;
}



.list02 {
	width:930px;
	margin-bottom:-20px;
}
.list02 li {
	float:left;
	width:440px;
	margin-right:40px;
	margin-bottom:20px;
}
.list02 li:nth-child(2n) {
	margin-right:0;
}
.list02 li .thumbnail {
	float:left;
	margin-right:10px;
}
.list02 li dl {
	margin-top:-2px;
}
.list02 li dl dt {
	font-size:18px;
	font-weight:bold;
	line-height:1.5;
	margin-bottom:0.2em;
}
.list02 li dl dd {
	font-size:16px;
	line-height:1.77;
}





.button01 {
	display:inline-block;
	background:#007440;
	padding:3px;
	margin:5px 0;
}
.button01 a {
	display: inline-block;
	padding: 18px 42px 16px 38px;
	border: #fff solid 2px;
	color: #fff;
	font-size: 22px;
	letter-spacing:0.05em;
	text-decoration: none;
	line-height: 1.0;
	-webkit-transition: all .3s;
	transition: all .3s;
	background:#007440 url(../img/ic01.png) no-repeat 92% 50%;
}

.button01 a:hover {
	background-color: #009c56;
}



.buttonList01 {
}
.buttonList01 > li {
	float:left;
	margin: 5px 4px 0 0;
	width: 160px;
	padding:3px;
	background:#007440;
}
.buttonList01 > li:nth-child(4n) {
	margin-right: 0;
}
.buttonList01 > li a {
	display: block;
	padding: 11px 15px 11px 0;
	border: #fff solid 1px;
	background-color: #fff;
	color: #fff;
	text-align:center;
	font-size: 14px;
	text-decoration: none;
	line-height: 1.0;
	-webkit-transition: all .3s;
	transition: all .3s;
	
	background:#007440 url(../img/ic02.png) no-repeat 90% 50%;
}

.buttonList01 > li a:hover {
	background-color: #009c56;
}

.columnLayout .colRight img {
	box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, .3);
}



.bannerArea {
}
.bannerArea ul {
	text-align:center;
	letter-spacing: -.40em;
}
.bannerArea ul li {
	display:inline-block;
	letter-spacing: normal;
	margin-left:14px;
}
.bannerArea ul li:first-child {
	margin-left:0;
}





@media screen and (max-width: 767px) {
	.onlyPC {
		display: none !important;
	}
	.onlySP {
		display: block !important;
	}
	
	#Pankuzu {
		display: none;
	}
	
	
	
	#mainarea {
		color: #333300;
		font-size: 13px;
		font-family: "HraKakuProN-W6", "HelveticaNeue";
		line-height: 1.85;
		width:100%;
	}
	
	#mainarea img {
		width: 100%;
		height: auto;
	}
	.mainFrame {
		background:#007440 ;
		padding-bottom:3.28%;
	}
	.mainFrameInner {
		width:93.75%;
		margin:0 auto;
		padding:3.28% 0 0 0;
	}
	
	.titleArea {
		margin-bottom:4.6875%;
	}
	.titleArea .dateArea {
		background:#000;
	}
	.titleArea .dateArea p {
		color:#fff;
		font-size:17px;
		font-weight:bold;
		line-height:1.5;
		padding:0.7em 1em 0.6em;
		text-align:center;
	}
	
	
	
	.heading01 {
		color:#007440;
		font-size:17px;
		line-height:1.1;
		padding:0.4em 0.5em 0.3em;
		text-align:center;
		background:#f3e705;
	}
	.heading01.type02 {
		text-align:left;
	}
	.updateArea .heading01 {
		font-size:14px;
		text-align:left;
		padding:0.4em 5% 0.3em;
	}
	
	.frameArea01 {
		margin-bottom:4.6875%;
	}
	
	
	.updateArea {
		float:left;
		float:none;
		width:640px;
		width:inherit;
		margin-bottom:3.125%;
	}
	.updateArea .scrollArea {
		overflow-y:auto;
		overflow-y:visible;
		height:147px;
		height:inherit;
		box-sizing: border-box;
	}
	.updateArea .scrollArea .scrollAreaInner {
		padding:3.5% 5%;
	}
	.updateArea .scrollArea dl + dl {
		margin-top:0.5em;
	}
	.updateArea .scrollArea dl dt {
		float:none;
		font-size:12px;
		line-height:1.3;
	}
	.updateArea .scrollArea dl dd {
		font-size:14px;
		margin-left:0;
	}




	
	
	.youtubeArea {
		float: none;
		width:inherit;
		position: relative;
		margin-top: 0;
		padding: 0 0 56.25%;
		height: 0;
		overflow: hidden;
		margin-bottom:5%;
	}
	.youtubeArea iframe {
		position: absolute;
		top:0;
		left:0;
		width:100% !important;
		height:100% !important;
		background: none;
		border: none;
	}
	
	
	
	
	
	.frameArea01 {
		background:#fff;
	}
	.frameArea01 .inner01 {
		padding:5.33% 5%;
	}
	.frameArea01.productsArea .inner01 {
		padding:5.33% 5%;
	}
	.frameArea01 .inner01 .mainImg {
		float:left;
		float:none;
		width:410px;
		width:inherit;
	}
	.frameArea01 .inner01 .textArea {
		float:right;
		float:none;
		width:482px;
		width:inherit;
		margin-top:4%;
	}
	.frameArea01 .inner01 .textArea .text01 {
		font-size:24px;
		font-size:17px;
		font-weight:bold;
		line-height:1.5;
		margin-bottom:0.2em;
	}
	.frameArea01 .inner01 .textArea .text02 {
		font-size:18px;
		font-size:14px;
		line-height:1.77;
	}
	
	
	
	
	
	.frameArea01 .inner01 .mainImg img {
		box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, .3);
	}
	
	
	.buyArea .colLeft {
		float:none;
		width:inherit;
		margin-top:10px;
		margin-bottom:4%;
	}
	.buyArea .colRight {
		float:none;
		width:inherit;
		padding:0 22%;
	}
	.buyArea .text01 {
		font-size:17px;
		font-weight:bold;
		line-height:1.25;
	}
	.buyArea .text02 {
		font-size:14px;
		font-weight:bold;
		line-height:1.25;
		margin:5% 0 6%;
	}
	.buyArea .text03 {
		font-size:14px;
		font-weight:bold;
		line-height:1.1;
		margin:0 0 0;
	}
	
	
	
	
	.imgList01 {
		margin-top:4.6%;
	}
	.imgList01 li {
		float:left;
		width:28.7%;
		margin-left:0;
		margin-right:6.95%;
		margin-bottom:5%;
		box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, .3);
	}
	.imgList01 li:hover {
		opacity:1;
	}
	.imgList01 li:nth-child(3n) {
		margin-right:0;
	}
	
	
	
	.list02 {
		width:inherit;
		margin-bottom:0;
	}
	.list02 li {
		float:none;
		width:inherit;
		margin-right:0;
		margin-bottom:0;
	}
	.list02 li + li {
		margin-top:6.6%;
	}
	.list02 li .thumbnail {
		float:left;
		width:34.4% !important;
		margin-right:2.6%;
	}
	.list02 li dl {
		margin-top:-0.5%;
	}
	.list02 li dl dt {
		font-size:14px;
		font-weight:bold;
		line-height:1.5;
		margin-bottom:0.2em;
	}
	.list02 li dl dd {
		font-size:14px;
		line-height:1.77;
	}
	
	
	
	
	
	.button01 {
		display:inline-block;
		background:#007440;
		padding:2px;
		margin:5px 0 0;
		width:100%;
	}
	.button01 a {
		width:100%;
		text-align:center;
		display: inline-block;
		padding: 12px 4px 12px 0;
		border: #fff solid 1px;
		color: #fff;
		font-size: 15px;
		letter-spacing:0.05em;
		text-decoration: none;
		line-height: 1.0;
		-webkit-transition: all .3s;
		transition: all .3s;
		background:#007440 url(../img/ic03.png) no-repeat 92% 50%;
		background-size:12px auto;
	}
	.button01 a:hover {
		background-color: #009c56;
	}
	
	
	
	.buttonList01 {
	}
	.buttonList01 > li {
		float:left;
		margin: 5px 1.6% 0 0;
		width:49.2%;
		padding:2px;
		background:#007440;
		box-sizing: border-box;
	}
	.buttonList01 > li:nth-child(2n) {
		margin-right: 0;
	}
	.buttonList01 > li a {
		display: block;
		padding: 11px 15px 11px 0;
		border: #fff solid 1px;
		background-color: #fff;
		color: #fff;
		text-align:center;
		font-size: 12px;
		text-decoration: none;
		line-height: 1.0;
		-webkit-transition: all .3s;
		transition: all .3s;
		
		background:#007440 url(../img/ic03.png) no-repeat 90% 50%;
		background-size:8px auto;
	}
	
	.buttonList01 > li a:hover {
		background-color: #009c56;
	}
	
	
	
	.bannerArea {
	}
	.bannerArea ul {
		text-align:center;
		letter-spacing:0;
	}
	.bannerArea ul li {
		width:87%;
		display:inline-block;
		letter-spacing: normal;
		margin-left:0;
		margin-bottom:4%;
	}
	.bannerArea ul li:first-child {
		margin-left:0;
	}
	
	
	.list02 li:after {
		content: " ";
		display: block;
		clear: both;
	}



}

.buttonList01:after,
.list02:after,
.imgList01:after,
.columnLayout:after,
.bannerArea ul:after,
.cf:after {
	content: " ";
	display: block;
	clear: both;
}