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

/* ロゴ・サイドメニュー 
-----------------------*/
div#spheadermenu {
	height:70px;
	background: url(../image/cmn/hedderbg.png) repeat-x;
	background-size: auto 100%;
	box-sizing: border-box;
	padding: 12px 0 0 10px;
}
	div#spheadermenu a.logobtn {
		display: block;
		width:135px;
		height:45px;
	}
		div#spheadermenu a.logobtn img { width:100%;}
	input#checked { display: none;}
	/* サイドメニューボタン */
	label.menu-btn {
		display: block;
		width:50px;
		height:50px;
		position: fixed;
		top:10px;
		right:10px;
		background: #AB74FA;
		z-index: 50;
	}
	label.menu-btn:hover span.bar {
		opacity: 0.7;
	}
		span.bar {
			position: absolute;
			top:10px;
			left: 10px;
			display: block;
			width: 30px;
			height: 2px;
			background: #fff;
			-webkit-transition: all .5s;
			transition: all .5s;
			-webkit-transform-origin: left top;
			-ms-transform-origin: left top;
			transform-origin: left top;
		}
		span.bar.middle {
			top: 18px;
			opacity: 1;
		}
		span.bar.bottom {
			top: 26px;
			-webkit-transform-origin: left bottom;
			-ms-transform-origin: left bottom;
			transform-origin: left bottom;
		}
		label.menu-btn p.menu {
			width:100%;
			height:15px;
			line-height: 15px;
			position: absolute;
			top:33px;
			left:0;
			color:#fff;
			text-align: center;
			font-size: 8px;
			letter-spacing: 2px;
			-webkit-transition: all .5s;
			transition: all .5s;
			-webkit-transform-origin: left top;
			-ms-transform-origin: left top;
			transform-origin: left top;
		}
		label.menu-btn p.close {
			opacity: 0;
			width:100%;
			height:15px;
			line-height: 15px;
			position: absolute;
			top:33px;
			left:0;
			color:#fff;
			text-align: center;
			font-size: 8px;
			letter-spacing: 1px;
			-webkit-transition: all .5s;
			transition: all .5s;
			-webkit-transform-origin: left top;
			-ms-transform-origin: left top;
			transform-origin: left top;
		}
div#sidemenubox {
	width:100%;
	position: fixed;
	top:0;
	left:100%;
	background: #AB74FA;
	box-sizing: border-box;
	padding: 80px 0 0 0;
	-webkit-transition: all .5s;
	transition: all .5s;
	z-index: 10;
}
div#sidemenubox div.menubox {
	width:280px;
	margin: 0 auto;
}
div#sidemenubox div.menubox a {
	display: block;
	width:100%;
	height:50px;
	line-height: 50px;
	text-align: center;
	font-size: 14px;
	text-decoration: none;
	color: #fff;
	border-bottom: #fff 1px dotted;
}

/* -- チェックをつけた場合 */
input.check:checked ~ label.menu-btn span.bar.top {
	top:7px;
	left:13px;
	width: 35px;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
input.check:checked ~ label.menu-btn span.bar.middle {
	opacity: 0;
}
input.check:checked ~ label.menu-btn span.bar.bottom {	
	width: 35px;
	top: 32px;
	left:13px;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
input.check:checked ~ label.menu-btn p.menu { opacity: 0;}
input.check:checked ~ label.menu-btn p.close { opacity: 1;}
input.check:checked ~ div#sidemenubox { left:0%;}

/* フッター
-----------------------*/
div#footerbox {
	width:100%;
	background: #E8E8E8;
	padding: 15px 0 35px 0;
	margin-top: 40px;
}
	div#footerbox div.center {
		width:96%;
		margin: 0 auto;
	}
		div#footerbox div.center small {
			font-size: 12px;
			margin-left: 10px;
		}
		div#footerbox div.center a {
			text-decoration: none;
			font-size: 12px;
			color: #333;
			margin-left: 10px;
		}
/* 基本
-----------------------*/
div#mainContents {
	width:100%;
	margin: 0 auto;
}
	/* レフトボックス */
	div#mainContents div#leftbox { display: none;}
	div#mainContents div#rightbox {
		width:100%;
	}
		div#mainContents div#rightbox div#headerbox {
			width:720px;
			height:385px;
			margin: 0 auto;
			padding-top: 20px;
		}
			div#mainContents div#rightbox div#headerbox div.topimgbox {
				width:481px;
				height:385px;
				float: left;
				background: url(../image/cmn/topimg.jpg) no-repeat;
				background-size: 100% 100%;
			}
			div#mainContents div#rightbox div#headerbox div.newsbox {
				width:224px;
				height:384px;
				border: 1px #ccc solid;
				box-shadow:1px 1px 1px 1px #eee;
				float: right;
				position: relative;
			}
				div#mainContents div#rightbox div#headerbox div.newsbox h2 {
					height:38px;
					background: #7769CD;
					line-height: 38px;
					font-size: 16px;
					color: #fff;
					text-align: center;
				}
				div#mainContents div#rightbox div#headerbox div.newsbox div.newsbox2 {
					width:180px;
					margin: 20px auto 0 auto;
				}
					div#mainContents div#rightbox div#headerbox div.newsbox div.newsbox2 a {
						display: block;
						height:65px;
						margin: 20px auto 0 auto;
						text-decoration: none;
						color: #333;
						position: relative;
						border-bottom: #333 2px dotted;
					}
						div#mainContents div#rightbox div#headerbox div.newsbox div.newsbox2 a p.date {
							width:100%;
							height:28px;
							line-height: 25px;
							font-size: 14px;
						}
						div#mainContents div#rightbox div#headerbox div.newsbox div.newsbox2 a p.cate {
							width:75px;
							height:20px;
							line-height: 20px;
							text-align: center;
							position: absolute;
							top:0px;
							right:0px;
							background: #CDCDCD;
							font-size: 12px;
						}
						div#mainContents div#rightbox div#headerbox div.newsbox div.newsbox2 a p.title {
							width:100%;
							height:28px;
							line-height: 25px;
							font-size: 14px;
							overflow: hidden;
							white-space: nowrap;
							text-overflow: ellipsis;
						}
				div#mainContents div#rightbox div#headerbox div.newsbox a.newsbtn {
					position: absolute;
					bottom:20px;
					right:20px;
					text-decoration: none;
					color: #333;
					vertical-align: top;
					font-size: 14px;
				}
					div#mainContents div#rightbox div#headerbox div.newsbox a.newsbtn img { margin-right: 5px;}
/*  スマホ・タブレット用フッター
-----------------------*/
div#footerspbox {
	width:720px;
	margin: 20px auto 0 auto;
}
div#footerspbox div.newsbox { display: none;}
div#footerspbox div.fbbox{  max-width: 481px;}
/*  メニューボックス
-----------------------*/
div#menubtnbox {
	width:720px;
	height:372px;
	margin: 20px auto 0 auto;
	position: relative;
}
	div#menubtnbox a {
		display: block;
		width:223px;
		height:174px;
		position: absolute;
	}
	div#menubtnbox a.menu01 {
		background: url(../image/menubox/menu_message.png) no-repeat,
			url(../image/menubox/btncover.png),
			url(../image/menubox/menu01.jpg);
		background-size: auto auto, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		top:0;
		left:0;
	}
	div#menubtnbox a.menu02 {
		background: url(../image/menubox/menu_nyusyo.png) no-repeat,
			url(../image/menubox/btncover.png),
			url(../image/menubox/menu02.jpg);
		background-size: auto auto, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		top:0;
		left:248px;
	}
	div#menubtnbox a.menu03 {
		background: url(../image/menubox/menu_care.png) no-repeat,
			url(../image/menubox/btncover.png),
			url(../image/menubox/menu03.jpg);
		background-size: auto auto, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		top:0;
		right:0;
	}
	div#menubtnbox a.menu04 {
		background: url(../image/menubox/men_ysogukaizenkasan.png) no-repeat,
			url(../image/menubox/btncover.png),
			url(../image/menubox/menu04.jpg);
		background-size: auto auto, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		bottom:0;
		left:0;
	}
	div#menubtnbox a.menu05 {
		background: url(../image/menubox/menu_saiyou.png) no-repeat,
			url(../image/menubox/btncover.png),
			url(../image/menubox/menu05.jpg);
		background-size: auto auto, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		bottom:0;
		left:248px;
	}
	div#menubtnbox a.menu06 {
		background: url(../image/menubox/menu_contact.png) no-repeat,
			url(../image/menubox/btncover.png),
			url(../image/menubox/menu06.jpg);
		background-size: auto auto, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		bottom:0;
		right:0;
	}
/* 共通部品
-----------------------*/
h2.h2title {
	width:720px;
	height:40px;
	box-sizing: border-box;
	padding: 0 30px;
	line-height: 40px;
	background: #D3C1F4;
	border-radius: 10px;
	font-size: 16px;
	color: #fff;
	margin: 35px auto 0 auto;
}
h2.h2title2 {
	width:720px;
	height:35px;
	box-sizing: border-box;
	padding-left: 5px;
	background: #AB74F9;
	margin: 35px auto 0 auto;
}
	h2.h2title2 span {
		display: block;
		width:100%;
		height:35px;
		line-height: 30px;
		background: #fff;
		box-sizing: border-box;
		padding: 0 25px 0 30px;
		font-size: 16px;
		border-bottom: #666 2px dotted;
	}