@charset "utf-8";
	
/* *****************************************************
*	レイアウト(トップページ以外)															*
* *****************************************************/
body {
	display: grid;
	grid-template-areas: 
		"header"
		"title"
		"contents"
		"footer";
	grid-template-columns: 100%;
	grid-auto-rows: 0 auto auto auto;
	margin: 0;
	grid-gap: 0;
}

/******************************************************
*	ヘッダー																							*
******************************************************/
header {
	grid-area: header;
	position: relative;
	z-index: 100;
}

header h1{
	width: 44%;
	position: fixed;
	top: 1%;
	left: 5%;
	margin: 0;
	padding: 0;
	z-index: 101;
}

header h1 #logo{
	width: 52%;
	height: auto;
	display: inline-block;
}

header h1 #logo img{
	width: 100%;
	height: auto;
}

header h1 #iso {
	width: 27%;
	height: auto;
	display: inline-block;
	margin-left: 5%;
}

header h1 #iso img {
	width: 100%;
}

.Menu{
	width:50%;
	padding: 2.5% 0 0 50%;
	position: fixed;
	border-bottom: 1px solid #696969;
	background: #ffffff;
	z-index: 100;
}

ul,li{
	list-style:none;
	margin:0;
	padding:0;
}

.Menu li{
	display: inline-block;
	width:16%;
	margin: 0 4% 0 0;
	position:relative;
}

.Menu li:last-child{
	margin: 0;
}

.Menu li a{
	border-left:1px solid #696969;
	font-size:97%;
	display:block;
	color: #000000;
	padding:6% 0 6% 10%;
	text-decoration:none;
	cursor:pointer;
	transition:ease 0.2s opacity;
	font-weight: bold;
	letter-spacing: 1.5px;
}

.Menu li ul.subMenu{
	width: 0;
	height: 0;
	margin: 0;
	padding: 0;
	top:0;
	opacity:0;
	z-index:10;
	position:absolute;
	overflow:hidden;
	border: 1px solid #c0c0c0;
	box-shadow: 2px 2px 4px #e6e6fa;
	transition: opacity 400ms linear;
}

.Menu li:hover ul.subMenu{
	width: 132%;
	height: auto;
	top:100%;
	opacity: 1;
}

.Menu li ul.subMenu li{
	width:100%;
}

.Menu li ul.subMenu li a{
	background:#ffffff;
	display:block;
	border:none;
	font-size:85%;
	font-weight: normal;
	padding: 10% 0;
	text-align:center;
	letter-spacing: 0;
	background: #3A216A;
	color: #ffffff;
}

.Menu li ul.subMenu li a:hover{
	color: #ffff00;
}

.Menu li ul.subMenu li:last-child a{
	border:none;
}

.Menu li ul.subMenu li{
	margin: 0;
}

.Menu li ul.subMenupc {
	display: none;
}

/* *****************************************************
*	タイトル																							*
* *****************************************************/
#pagetitle_pc {
	grid-area: title;
	position:relative;
}

#pagetitle_pc img{
	width: 100%;
	height: auto;
	margin-top: 4%;
	z-index: 90;
}

#pagetitle_mb {
	display: none;
}

/* *****************************************************
*	メインコンテンツ																				*
* *****************************************************/
#contents {
	grid-area: contents;
}

/* *****************************************************
*	パンくずリスト																					*
* *****************************************************/
#breadcrumb ol{
	padding: 0;
	margin: 0 0 15px 0;
}

#breadcrumb ol li{
	display: inline-block;
	color: #3A216A;
	font-weight: bold;
}

#breadcrumb ol li::after{
	content: '>';
	display: inline-block;
	padding: 0 10px;
	color: #a9a9a9;
}

#breadcrumb ol li:last-child::after{
	display: none;
}

#breadcrumb ol li a{
	color: #a9a9a9;
	text-decoration: none;
}

/* *****************************************************
*	小見出し																							*
* *****************************************************/
.box {
	width: 100%;
	height: auto;
	margin: 0 auto 100px auto;
	padding: 0;
	overflow:hidden;
}

.box h2 {
	color: #3A216A;
	font-size: 200%;
	font-weight: bold;
}

.box h2:before {
	content: '▼';
}

/* *****************************************************
*	ボタン																								*
* *****************************************************/
.button a{
	width: 30%;
	margin: 0;
	padding: 2% 11%;
	position: relative;
	display: inline-block;
	text-align: center;
	background: #ffffff;
	color: #000000;
	border: 2px solid #3A216A;
	border-radius: 22px;
	box-shadow: 2px 2px 6px #c0c0c0;
	font-weight: bold;
	text-decoration: none;
}

.button a::before{
	width: 10px;
	height: 10px;
	top: 0;
	bottom: 0;
	right: 10%;
	margin: auto;
	position: absolute;
	content: "";
	border-top: 4px solid #3A216A;
	border-right: 4px solid #3A216A;
	transform: rotate(45deg);
}

.button a:hover {
	background: #3A216A;
	color: #ffffff;
}

.button a:hover::before{
	border-top: 4px solid #ffffff;
	border-right: 4px solid #ffffff;
}

/* *****************************************************
*	区切り線																							*
* *****************************************************/
.line {
	width: 100%;
	margin: 100px 0;
	border-bottom: 1px solid #000000;
}

.line2 {
	width: 100%;
	margin: 60px 0;
	border-bottom: 1px solid #000000;
	opacity: 0;
}

/* *****************************************************
*	ページトップに戻るボタン																	*
* *****************************************************/
.page_top{
	opacity: 0;
}

.page_top a{
	width: 3%;
	height: auto;
	position: fixed;
	right: 0;
	bottom: 0;
	margin:0 3.5% 10% 0;
	padding-bottom: 3%;
	z-index: 12;
	display: flex;
	transition: all 0.65s;
	text-decoration: none;
	background-image: url("../img/pagetop_button.png");
	background-repeat: no-repeat;
	background-size: contain;
}

.isActive {
	opacity: 1;
	transition: all 0.65s;
}

/* *****************************************************
*	お問い合わせボタン																			*
* *****************************************************/
#inquiry_button a{
	width: 13%;
	height: 10%;
	position: fixed;
	right: 0;
	bottom: 0;
	margin-bottom: 4%;
	z-index: 10;
	background-image: url("../img/inquiry_button_2.png");
	background-repeat: no-repeat;
	background-size: contain;
}

#inquiry_button a:hover{
	background-image: url("../img/inquiry_button_hover_2.png");
}
/* *****************************************************
*	フッター																							*
* *****************************************************/
footer {
	grid-area: footer;
	border-top: 1px solid #a3a3a3;
	font-size: 90%;
	background: #3A216A;
	padding: 2% 0;
}

footer #logo_address {
	width: 23%;
	top: 20%;
	margin: 0 0 0 5%;
	display: inline-block;
	color: #ffffff;
}

footer #logo_address img{
	width: 100%;
	height: auto;
	margin: 0 0 5% 0;
}

footer p {
	width: 50%;
	margin: 2% 0 0 5%;
	padding: 0;
	color: #dcdcdc;
	display:inline-block;
}

footer p a {
	color: #dcdcdc;
	text-decoration: none;
}

footer #sitemap {
	width: 40%;
	margin: 0 0 0 15%;
	display: inline-block;
}

footer #sitemap .sm {
	width: 25%;
	height: 200px;
	margin: 0;
	vertical-align: top;
	display: inline-block;
	border-left: 2px solid #ffffff;
	padding-left: 10px;
}

footer #sitemap .sm h3 {
	color: #ffffff;
	font-weight: bolder;
	font-size: 120%;
}

footer #sitemap .sm h3 a{
	color: #ffffff;
	text-decoration: none;
}

footer #sitemap .sm h3 a:hover{
	color: #ffff00;
}

footer #sitemap .sm ul {
	list-style:none;
	padding: 0;
}

footer #sitemap .sm ul li{
	padding: 5px 0;
}

footer #sitemap .sm ul li:before{
	content: ' - ';
	color: #ffffff;
}

footer #sitemap .sm ul li a {
	color: #ffffff;
	text-decoration: none;
}

footer #sitemap .sm ul li a:hover {
	color: #ffff00;
}

footer #sitemap .sm ul li a:visited {
	color: #ffffff;
}

footer #externallink {
	width: 30%;
	margin: 0 0 0 5%;
	padding: 0;
	color: #dcdcdc;
	display:block;
}

footer #externallink a{
	color: #dcdcdc;
	text-decoration: none;
}

footer #externallink .point a{
	color: #ffff00;
	}







