@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;
	overflow-y: scroll;
}
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 {
			display: block;
			font-size: 10px;
			text-align: center;
		}
		div#footerbox div.center a {display: none;}
/* 基本
-----------------------*/
div#mainContents {
	width:100%;
	margin: 0 auto;
}
	/* レフトボックス */
	div#mainContents div#leftbox { display: none;}
	div#mainContents div#rightbox {
		width:100%;
		margin: 0 auto;
	}
		div#mainContents div#rightbox div#headerbox {
			width:96%;
			max-width: 481px;
			margin: 0 auto;
			padding-top: 20px;
		}
			div#mainContents div#rightbox div#headerbox div.topimgbox {
				width:100%;
				height:70.03vw;
				max-width:481px;
				max-height:385px;
				background: url(../image/cmn/topimg.jpg) no-repeat;
				background-size: 100% 100%;
				margin: 0 auto;
			}
			div#mainContents div#rightbox div#headerbox div.newsbox {display: none;}
/*  スマホ・タブレット用フッター
-----------------------*/
div#footerspbox {
	width:96%;
	margin: 20px auto 0 auto;
}
	div#footerspbox div.newsbox {
		width:100%;
		border: 1px #ccc solid;
		box-shadow:1px 1px 1px 1px #eee;
		box-sizing: border-box;
		position: relative;
		padding-bottom: 20px;
	}
		div#footerspbox div.newsbox h2 {
			height:38px;
			background: #7769CD;
			line-height: 38px;
			font-size: 14px;
			color: #fff;
			text-align: center;
		}
		div#footerspbox div.newsbox div.newsbox2 {
			width:90%;
			margin: 20px auto 0 auto;
		}
			div#footerspbox div.newsbox div.newsbox2 a {
				display: block;
				height:50px;
				margin: 20px auto 0 auto;
				text-decoration: none;
				color: #333;
				position: relative;
				border-bottom: #333 1px dotted;
			}
				div#footerspbox div.newsbox div.newsbox2 a p.date {
					width:100%;
					height:20px;
					line-height: 20px;
					font-size: 12px;
				}
				div#footerspbox 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: 10px;
				}
				div#footerspbox div.newsbox div.newsbox2 a p.title {
					width:100%;
					height:20px;
					line-height: 20px;
					font-size: 12px;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}
		div#footerspbox div.newsbox a.newsbtn {
			display: block;
			text-decoration: none;
			color: #333;
			vertical-align: top;
			font-size: 12px;
			text-align: right;
			margin: 20px 20px 0 0;
		}
			div#footerspbox div.newsbox a.newsbtn img { margin-right: 5px;}
div#footerspbox div.fbbox {
	display: block;
	width:100%;
	margin: 20px auto 0 auto;
}
/*  メニューボックス
-----------------------*/
div#menubtnbox {
	width:96%;
	margin: 20px auto 0 auto;
}
	div#menubtnbox a {
		display: block;
		width:49%;
		height:34.8vw;
		max-width:223px;
		max-height:174px;
		margin-bottom: 5px;
	}
	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 15px, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		float: left;
	}
	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 15px, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		float: right;
	}
	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 15px, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		float: left;
	}
	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 15px, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		float: right;
	}
	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 15px, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		float: left;
	}
	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 15px, 100% 100%, 100% 100%;
		background-position: center center, center center, center center;
		float: right;
	}
/* 共通部品
-----------------------*/
h2.h2title {
	width:96%;
	height:40px;
	box-sizing: border-box;
	padding: 0 10px;
	line-height: 40px;
	background: #D3C1F4;
	border-radius: 10px;
	font-size: 14px;
	color: #fff;
	margin: 20px auto 0 auto;
}
h2.h2title2 {
	width:96%;
	height:35px;
	box-sizing: border-box;
	padding-left: 5px;
	background: #AB74F9;
	margin: 20px auto 0 auto;
}
	h2.h2title2 span {
		display: block;
		width:100%;
		height:35px;
		line-height: 30px;
		background: #fff;
		box-sizing: border-box;
		padding: 0 5px 0 10px;
		font-size: 14px;
		border-bottom: #666 2px dotted;
	}