@charset "UTF-8";

/* 基本色 */
:root {
	--main-color: midnightblue;
	--sub-color:#1F4294;
	--dark-color:#000;
	--accent-color:#6B9426;
}

/* 基本設定：ページ全体 */
body {
	background-image:url(../images/bg01.jpg);
	background-repeat:repeat-x;
	background-attachment: fixed;
/*	background-color:#ecf9ff;	margin: 0;*/
	font-family: 'Lato', 'Noto Sans JP', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
/*	font-family: "Adobe Garamond Pro", "FolkPro-Regular", "A-OTF フォーク Pro R", "ヒラギノ角ゴ Pr6N W3", "HiraginoSansPr6N-W3", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS-PGothic", sans-serif;
*/
	a{
		cursor:pointer;
	}
}
/* micro clearfx 　これがないとconBが表示できない*/
.cf:before, .cf:after {
	content:"";
	display:table
}
.cf:after { clear:both }
.cf { zoom:1 } /* For IE 6/7 */

/* コンテンツA: タイトルイメージ */
.conA {
	position: relative;
	height: 60vh;
	max-width: 1000px;
	max-height: 270px;
	min-height: 200px;
	background-image: url(../images/00_top.jpg);
	background-position: center bottom -20px;
	background-size: cover;
}
.conA .container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.conA .container2 {
	height: 100%;
}
.conA h1 {
	margin:0;
	padding:0;
}
.conA .logo-main {
	display: block;
	width: 470px;
	margin-left: 60px;
	margin-top: 50px;
	-webkit-filter: drop-shadow(.2rem .2rem .1rem rgba(0,0,0,0.4));
	filter: drop-shadow(.2rem .2rem .1rem rgba(0,0,0,0.4));
}
.conA .logo-serve {
	display: block;
	width: 360px;
	margin-top: 52px;
	margin-left: 10px;
	-webkit-filter: drop-shadow(.2rem .2rem .1rem rgba(0,0,0,0.4));
	filter: drop-shadow(.2rem .2rem .1rem rgba(0,0,0,0.4));
}
.conA .logo-60 {
	display: block;
	position:absolute;
	z-index: 99;
	width: 110px;
	right: 80px;
	bottom: 30px;
	-webkit-filter: drop-shadow(.2rem .2rem .1rem rgba(0,0,0,0.4));
	filter: drop-shadow(.2rem .2rem .1rem rgba(0,0,0,0.4));
}

@media (min-width: 769px){
	.conA {
		max-height: 360px;
		background-position: center;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
}
@media (min-width: 601px) and (max-width: 768px){
	.conA {
		background-position: center;
		background-size: 120%;
	}
	.conA .container {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	.conA .logo-main {
		width: 60%;
		margin-top: 50px;
		margin-left: 30px;
		margin-bottom: 4px;
	}
	.conA .logo-serve {
		width: 50%;
		margin-left: 35px;
		margin-top: 2px;
	}
	.conA .container2 {
		height: 100%;
		margin: auto 0 0 0;
	}
	.conA .logo-60 {
		width: 100px;
		right: 40px;
		top: 60px;
	}
}
@media (max-width: 600px){
	.conA {
		background-position: center;
		background-size: 160%;
	}
	.conA .container {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	.conA .logo-main {
		width: 90%;
		margin-top: 50px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 4px;
	}
	.conA .logo-serve {
		width: 80%;
		margin-top: 2px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: auto;
	}
	.conA .logo-60 {
		width: 80px;
		right: 20px;
		bottom: 20px;
	}
}
/* ヘッダー */
header {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	max-width: 1000px;
	background-color: rgba(255,255,255,0.8);
}

/* ヘッダーB：ナビゲーションメニュー */
.headA ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.headA a {
	display: block;
	padding: 6px 0;
	font-size: 13px;
	text-decoration: none;
	color: darkslategray;/*darkolivegreen;*/
}
.headA a:hover {
	background-color: midnightblue;
	color: white;
}
  /* メニュー追加設定 */
.headA .mega_menu{
	display: none;
}
.headA .mega_menu .child{
	position: absolute;
	left: 498px;
	top: 26px;
	color: white;
	background: lightsteelblue;
	width: 239px;
}


@media (min-width: 769px){
  /* 大きい画面用の設定 */
	header .container {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		justify-content: start;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
	.headA ul {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin-left: 60px;
	}
}

/* ヘッダーB：　トグルボタン */
@media (max-width: 768px){
	/* 小さい画面用の設定 */
	header .container-small {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: end;
		-ms-flex-pack: end;
		justify-content: flex-end;
	}
	.headB {
		margin-right: 30px;
		padding: 5px;
		border: none;
		outline: none;
		background: none;
		font-size: 21px;
		opacity: 0.5;
		cursor: pointer;
	}
	.headB:hover {
		opacity: 0.3;
	}
	.headA {
		display: none;
	}
	.headA a {
		font-size:18px;
	}
}
@media (min-width: 769px){
  /* 大きい画面用の設定 */
	.headB {
		display: none;
	}
	.headA {
		display: block !important;
	}
}

/* heada-c のセクション*/
.name1 ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align:center;
	-ms-flex-align:center;
	align-items:center;
	font-size:0;
	background-color: midnightblue;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}
.name1 ul li:last-of-type{
	margin-left:auto;
}
.name1 li {
	display:block;
	color:white;
	font-size:16px;
}
.logo {
	padding-left:65px;
}
.logo-a {
	width:30px;
	padding-top:4px;
	padding-bottom: 4px;
}
.logo-b {
	width:200px;
	padding-top:4px;
	padding-bottom: 4px;
	margin-right:20px;
}
.mess1 {
	padding-bottom:2px;
	padding-right:20px;
	width:400px;
}
@media (min-width: 769px){
	.name1 {
		background-position: center;
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}
}
@media (min-width: 720px) and (max-width: 768px){
	.logo {
		padding-left:47px;
	}
	.name1 ul {
		-webkit-box-pack:start;
		-ms-flex-pack:start;
		justify-content:start;
		margin:0;
	}
	.logo-a {
		margin-left:-13px;
		padding-left:0;
	}
	.name1 li {
		margin-left:0;
		font-size:14px;
	}
	.mess1{
		margin-top:2px;
		padding-bottom:6px;
	}
}
@media (max-width: 719px){
	.name1 ul {
	-webkit-box-pack:start;
	-ms-flex-pack:start;
	justify-content:start;
	margin:0;
	}
	.name1 ul li:last-of-type{
		margin-left:-10px;
		margin-right:auto;
	}
	.logo {
		padding-left:45px;
	}
	.logo-a {
		margin-left:-14px;
		padding-left:0;
	}
	.name1 li {
		margin-left:0;
		font-size:14px;
	}
	.mess1{
		margin-top: -2px;
		margin-bottom: 5px;
	}
}
/* フッター */
footer {
	color: white;
	background-color: midnightblue;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}
footer .container {
	padding: 20px 0;
}
@media (min-width:640px){
	footer .container {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		margin-left: 75px;
		margin-right: 75px;
	}
	.footA {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 70%;
		flex: 0 0 70%;
	}
	.footB {
		-webkit-box-flex: 0;
		-ms-flex: 0 0 30%;
		flex: 0 0 30%;
	}
}

/* フッターA：サイト情報 */
.footA {
	width: 370px;
	margin-bottom:30px;
}
.footA .ft01 {
	margin-top: 0;
	margin-bottom: 5px;
	margin-left:-6px;
	font-size: 24px;
}
.footA .logo-b2 {
	width: 270px;
}
.footA .ft02 {
	margin-top: 0;
	margin-bottom: 14px;
	margin-left:-2px;
	font-size: 14px;
}
.ft03 {
	margin-left:-2px;
}
.footA p {
	margin-top: 0;
	margin-bottom: 4px;
	font-size: 14px;
}
.footA a {
	text-decoration: none;
	color: white;
}
.footA a:hover {
	color:gold;
}
/* フッターB：サイトメニュー */
.footB {
	width: 270px;
	margin-bottom: 20px;
}
.footB h4 {
	margin-top: 0;
	margin-bottom: 6px;
	padding-left: 5px;/*メニュー各項目との左右ズレを修正*/
	padding-bottom:3px;
	border-bottom: solid 1px currentColor;
	font-size: 18px;
	letter-spacing: 4px;
}
.footB ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.footB a {
	display: block;
	padding: 5px;
	color: inherit;
	font-size: 14px;
	text-decoration: none;
	letter-spacing: 4px;
}
.footB a:hover {
	background-color: rgba(255,255,255,0.3);
}
/* フッターC：コピーライト */
.footC {
	height: 26px;
	background-color: #1F4294;
	padding-top: 8px;
	font-size: 12px;
	text-align: center;
	font-family: 'MyriadPro-Regular', 'Lato', sans-serif;
	letter-spacing: 2px;
	text-indent: 2px;
}
@media (max-width: 768px){
	footer .container {
		margin-left: 30px;
	}	
}
@media (max-width:375px){
	footer .container {
		margin-left: 30px;
		margin-right: 30px;
	}
	.footA p {
		padding-right: 50px;
	}
}
/*iPhoneで電話番号の自動リンク部分の表示を修正*/
.p-address a {
	color: #ffffff;
	}