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

/*デスクトップ*/

body{
	font-family: "游ゴシック", "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS PGothic";
}

#header {
	background-color: #A0C238;
	padding-bottom: 1em;
}
#header .container {
	max-width: 1100px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
#header .container h1 {
	color: #FFF;
	margin-bottom: 1em;
}
#header .container .logo {
	float: left;
	width: 200px;
	height: 55px;
	background-color: #A0C238;
}
#header .container .logo a img {
	width: 200px;
	height: 55px;
}
#header .container .inquery {
	padding-right:0.5em;
	text-align:right;
	float: right;
	color: #FFF;
}
#header .container .inquery span {
	display: block;
}
#header .container .inquery span a {
	color: #FFF;
}
#header .container .inquery span a:hover {
	color: #7B9AD0;
}

/*グロナビ*/
#header .container nav{
	margin-top:12px;
	width:100%;	
	overflow:auto;
}

#header .container nav label{
	display:none;
}

#header .container nav input[type="checkbox"]{
	display:none;
}

#header .container nav ul li a{
	font-size: 13px;
	line-height: 32px;
	display: block;
	width: 25%;
	float: left;
	color: #FFF;
	text-decoration: none;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-align: center;
	background-image: url(/pr/img/png/tateBar.png);
	background-position: right center;
	background-repeat: no-repeat;
}



#header .container nav ul li a:hover{
	color: #7B9AD0;
	background-color: #A8C945;
}

#main_visual {
	width: 100%;
	height: 500px;
	background-image: url(/pr/img/jpg/main_visual.webp);
	background-repeat: no-repeat;
	background-position: center bottom;
}

#contents {
	background-image: url(/pr/img/png/body_bg01.webp);
	background-repeat: repeat;
	overflow:auto;
}

/*横幅1100px*/
#contents .container {
	width: 1080px;
	margin-top:20px;
	margin-left: auto;
	margin-right: auto;
}

/*横幅68%*/
#contents .container .main {
	float: left;
	width: 67%;
	margin-right:1%;
}

#contents .container .main a{
	display: block;
	text-decoration: none;
	margin-right: 1%;
	width: 99%;
}

#contents .container .main a .box{
	width: 98%;
	padding:1%;
	overflow: auto;
	border: 1px dotted #CCC;
	border-radius:3px;
	background-color: #FFF;
	background-image: none;
}

#contents .container .main a .box:hover{
	background-color: #F3F3F3;
	-webkit-transition: background-color 0.3s ease 0s;
	-moz-transition: background-color 0.3s ease 0s;
	-ms-transition: background-color 0.3s ease 0s;
	-o-transition: background-color 0.3s ease 0s;
	transition: background-color 0.3s ease 0s;
}

/*横幅33%*/
#contents .container .main a .box .image{
	float: left;
	width: 31%;
	margin: 1%;
	height: 165px;

}

#contents .container .main a .box .image img{
	width: 100%;
	height: auto;
	aspect-ratio: attr(width) / attr(height);
}

/*横幅67%*/
#contents .container .main a .box .text{
	float: right;
	width:65%;
	margin: 1%;
}

#contents .container .main a .box .text .date_junle{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 13px;
	margin-bottom: 0.5em;
}

#contents .container .main a .box .text .date_junle span.date{
	color: #ACACAC;
	font-weight:bold;

}

#contents .container .main a .box .text .date_junle span.junle{
	color: #FFF;
	font-size: 12px;
	font-weight: normal;
	background-color: #A0C238;
	margin-left: 1em;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
}

#contents .container .main a .box .text h2.title{
	color: #444444;
	font-size: 20px;
	line-height:28px;
	font-weight:bold;
	margin-bottom:0.5em;
}

#contents .container .main a .box .text p.honbun{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #888888;
	font-size: 13px;
}

/*ページリンク*/

#contents .container .main .pageLink{
	width: 90%;
	overflow: auto;
	border: 1px dotted #CCC;
	border-radius: 3px;
	background-color: #FFF;
	text-align: center;
	margin-right: 1%;
	padding-top: 5%;
	padding-right: 4.5%;
	padding-bottom: 5%;
	padding-left: 4.5%;
}

#contents .container .main .pageLink ul{
	display:inline-block;
}

#contents .container .main .pageLink ul li{
	font-size:16px;
	line-height:44px;
	width: 37px;
	height: 44px;
	float: left;
	margin-right:6px;
	margin-left:6px;
	margin-bottom:6px;
	background-color:#FFF;
}

#contents .container .main .pageLink ul li.current{
	font-weight: bold;	
}

#contents .container .main .pageLink ul li a{
	border: 1px solid #EAEDF2;
	display:block;
	color:#4B99C6;
}

#contents .container .main .pageLink ul li a:hover{
	color: #FFF;
	background-color: #4B99C6;
	-webkit-transition: background-color 0.5s ease 0s;
	-moz-transition: background-color 0.5s ease 0s;
	-ms-transition: background-color 0.5s ease 0s;
	-o-transition: background-color 0.5s ease 0s;
	transition: background-color 0.5s ease 0s;
}


/*横幅31%*/
#contents .container .sideBar {
	float: right;
	width: 29%;
	margin-left:2%;
}

#contents .container .sideBar .group{
	overflow:auto;
	margin-bottom:40px;
}

#contents .container .sideBar .group h3.title{
	font-size: 16px;
	line-height: 55px;
	color: #FFF;
	background-color: #A0C238;
	font-weight: bold;
	padding-left: 14px;
	outline : 1px solid #FFFFFF; /* 線の太さ・線状・色 */
	outline-offset : -3px /* どれだけ内側に線を表示したいかを負の値で指定 */
}

#contents .container .sideBar .group .menu li a{
	width: 93%;
	padding-left: 1%;
	padding-right:6%;
	display: block;
	font-size: 14px;
	line-height: 37px;
	color: #4E932D;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	text-decoration: none;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #DDD;
	background-image: url(/pr/img/png/arrow.png);
	background-repeat: no-repeat;
	background-position: 96% center;
}

#contents .container .sideBar .group .menu li a:hover{
	background-position: 98% center;
	color: #64BD39;
}

#footer{
	background-color:#A0C238;
	overflow:auto;
}

#footer .container {
	width: 1080px;
	margin-top:30px;
	margin-bottom:20px;
	margin-left: auto;
	margin-right: auto;
}

#footer .container .group{
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	float:left;
	width:33.33333%;
}

#footer .container .group h3.title{
	font-size: 16px;
	color: #FFF;
	line-height: 50px;
	text-decoration: none;
	font-weight: bold;
	
}

#footer .container .group ul li a{
	font-size: 14px;
	color: #FFF;
	line-height: 32px;
	text-decoration: none;
}

#footer .container .group ul li a:hover{
	text-decoration: underline;
}

#copyrights{
	padding-top: 30px;
	padding-bottom:20px;
	width: 100%;
	overflow::auto;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFF;
	background-color: #A0C238;
}

#copyrights .container{
	width: 1080px;
	margin-left: auto;
	margin-right: auto;
	overflow: auto;
	font-size: 14px;
	color: #FFF;
}

#copyrights .container .left, #copyrights .container .right{
	float:left;
	width:50%;
}

#copyrights .container .left a{
	color:#FFF;
}


/*横幅769から1100pxまでのメディア*/
@media screen and (max-width:1100px) {

#main_visual {
	width: 100%;
	height: 300px;
	background-image: url(/pr/img/jpg/main_visual02.webp);
}

#header .container {
	max-width: 749px;
}

#contents .container {
	max-width: 749px;
}

#contents .container .main a .box .image{
	height: 125px;

}

#footer .container {
	max-width: 749px;
}


/*２カラム*/
#footer .container .group{
	width: 45％;
	padding: 2.5%;

}


#copyrights .container {
	max-width: 749px;
}


}

/*横幅768pxまでのメディア*/
@media screen and (max-width:768px) {
#main_visual {
	width: 100%;
	height: 200px;
	background-image: url(/pr/img/jpg/main_visual03.webp);
}

#header .container {
	max-width: 100%;
}

#header .container h1 {
	text-align:center;
	margin-bottom: 0px;
	height:50px;
}

#header .container nav ul li a{
	width: 100%;
	line-height: 50px;
	font-size: 16px;
	background-color: #000;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #666
}

#header .container nav ul li a:hover{
	background-color: #333;
	-webkit-transition: background-color 0.5s;
	-moz-transition: background-color 0.5s;
	-ms-transition: background-color 0.5s;
	-o-transition: background-color 0.5s;
	transition: background-color 0.5s;
	color: #FFD;
}

#header .container nav label{
	cursor:pointer;
	width: 50px;
	height: 50px;
	display: block;
	position: fixed;
	right: 0;
	top: 0;
	background-image: url(/pr/img/png/menu01.png);
	background-repeat: no-repeat;
	background-position: center center;
	z-index:11;
}

#header .container nav label:hover{
	opacity:0.7;
}

#header .container nav ul{
	display:none;
}


#header .container nav input[type="checkbox"]:checked ~ ul{
	display: block;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 10;
}

#header .container nav input[type="checkbox"]:checked ~ label{
	background-image: url(/pr/img/png/menu02.png);
}


#contents .container {
	max-width: 100%;
}

#footer .container {
	max-width: 100%;
}

#contents .container .main {
	width: 99%;
	margin-right:1%;
}

#contents .container .main a{
	margin-right: 1%;
	width: 99%;
}

/*.main a の4割*/
#contents .container .main a .box .image{
	float: left;
	width: 38%;
	margin: 1%;

}

#contents .container .main a .box .image{
	height: 120px;

}

/*.main aの6割*/
#contents .container .main a .box .text{
	float: right;
	width: 58%;
	margin: 1%;
}

#contents .container .main a .box .text h2.title{
	font-size: 16px;
	line-height:24px;
}

#contents .container .main a .box .text p.honbun{
	font-size: 14px;
}


/*横幅100%*/
#contents .container .sideBar {
	width: 99%;
	margin-left:1%;
}

#contents .container .sideBar .group .menu li a{

	background-position: 98% center;
	font-size:16px;
}

#contents .container .sideBar .group .menu li a:hover{
	background-position: 99% center;
}


#footer{
	background-color:#A0C238;
	overflow:auto;
}

#footer .container .group{
	float: none;
	width: 98%;
	padding: 1%;
}

#footer .container .group h3.title{
	font-size: 15px;

}

#footer .container .group ul li a{
	font-size: 14px;
}


#copyrights .container {
	max-width: 100%;
}

#copyrights .container .left{
	float:none;
	width:98%;
	padding:1%;
}

#copyrights .container .right{
	float:none;
	width:98%;
	padding:1%;
}

}