@charset "utf-8";


/* コモン */
html, body {
	width : 100%;
	height : 100%;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
}


body {
	color: #2f2f2f;
	font-size: 14px;
}


/* ヘッダ */
header {
	width: 100%;
	height: 84px;
	background-color: #fff;
	border-bottom: 6px solid #0256A7;
	position: fixed;
	z-index: 1000;
}
header>div {
	max-width: 1044px;
	height: 42px;
	margin: 22px auto 14px;
	position: relative;
}

#logo {
	width: 137px;
	position: absolute;
	left: 22px;
}
#logo img {
	width: 100%;
}

#sp_nav_btn {
	display: none;
}

nav {
	width: 70%;
	position: absolute;
	right: 22px;
	top: 3px;
}

nav ul {
	width: 100%;
	display: flex;
	justify-content: space-between;
}

nav li {
	font-size: 11px;
	text-align: center;
}

nav li em {
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 1px;
	line-height: 1.9;
}

nav li a {
	color: #007DC5;
}

nav li a:hover {
	opacity: .8;
}

nav li.in a {
	color: #292929;
}




/* コンテンツ */
#contents {
	padding-top: 84px;
}





/* フッタ */
footer {
	background-color: #F0F0F0;
}

#footer_data {
	padding: 50px 0 33px;
	text-align: center;
}

#footer_data_name {
	font-size: 18px;
	margin-bottom: 14px;
}

#footer_data_address {
	font-size: 14px;
	line-height: 1.9;
}

#footer_contact {
	max-width: 700px;
	margin: 0 auto 60px;
	color: #fff;
	display: flex;
}
#footer_contact>div>span, #footer_contact>div>a {
	display: block;
	padding: 40px;
}
#footer_contact>div {
	width: 50%;
	text-align: center;
}
#footer_contact_tel {
	background-color: #05ACE7;
}
#footer_contact_tel>span {
	font-size: 20px;
	letter-spacing: 1px;
}


#footer_contact_tel>span a {
	color: #fff;
}


#footer_contact_mail {
	background-color: #007DC5;
}
#footer_contact_mail br{
	display: none;
}
#footer_contact_mail a {
	display: block;
	color: #fff;
}

#footer_contact_mail a:hover {
	opacity: .8;
}

#footer_copy {
	background-color: #292929;
	color: #fff;
	padding: 37px 0 19px;
	text-align: center;
}
#footer_copy_link {
	margin-bottom: 30px;
}
#footer_copy_link a {
	font-size: 14px;
	color: #fff;
	margin: 0 20px;
}
#footer_copy_link a:hover {
	opacity: .8;
}
#footer_copy_copy {
	font-size: 10px;
}

#totop {
	display: block;
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 50px;
}
#totop img {
	width: 100%;
}



@media(min-width: 766px){
  a[href^="tel:"]{
    pointer-events: none;
  }
}



/* 2ndページ */
#title {
	background-color: #000;
	width: 100%;
	height: 300px;
	background-position: center;
	background-size: cover;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	margin-bottom: 18px;
}
#title>h1 {
	text-align: center;
	font-size: 18px;
	color: #fff;
	font-weight: bold;
	line-height: 1.3;
	letter-spacing: 1px;
}
#title>h1>em {
	font-size: 40px;
}

#breadcrumb {
	font-size: 12px;
	max-width: 1044px;
	margin: 0 auto 58px;
	padding: 0 22px;
}

#breadcrumb a {
	color: #007DC5;
}
#breadcrumb a:hover {
	opacity: .8;
}

#contents>div {
	max-width: 1044px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 22px;
	padding-right: 0 22px;
}

.w100 {
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}






@media screen and (max-width: 765px) {
	header {
		height: 60px;
		border-bottom: none;
	}
	header>div {
		height: 31px;
		margin: 0;
		position: relative;
	}

	nav {
		display: none;
	}
	#logo {
		width: 101px;
		position: absolute;
		top: 15px;
		left: 20px;
	}


	#sp_nav_btn {
		display: block;
		position: absolute;
		right: 0;
		top: 0;
		z-index: 1001;
	}

	#sp_nav_btn a.menu {
		background: #0256A7;
		width: 60px;
		height: 60px;
		position: absolute;
		top:0;
		right: 0;
	}

	#sp_nav_btn a.menu:before,
	#sp_nav_btn a.menu span,
	#sp_nav_btn a.menu:after {
		background-color: #fff;
		content: " ";
		height: 2px;
		right: 17px;
		position: absolute;
		transition: all 0.4s ease-out 0s;
		width: 26px;
	}

	#sp_nav_btn a.menu:before {
		top: 20px;
	}
	#sp_nav_btn a.menu span {
		top: 29px;
	}
	#sp_nav_btn a.menu:after {
		top: 38px;
	}
	#sp_nav_btn.open a.menu:before {
		background-color: #fff;
		top: 30px;
		transform: rotate(225deg);
	}
	#sp_nav_btn.open a.menu:after {
		background-color: #fff;
		top: 30px;
		transform: rotate(-225deg);
	}
	#sp_nav_btn.open a.menu span {
		opacity:0;
		-moz-opacity: 0;
		filter:alpha(opacity=0);
		-ms-filter: "alpha( opacity=0 )";
	}



	nav {
		width: 100%;
		height: 100vh;
		position: absolute;
		right: 0;
		top: 60px;
		background-color: rgba(0,0,0,.5);
	}

	nav ul {
		display: block;
		border-top: 1px solid #D6D6D6;
	}

	nav li {
		background-color: #fff;
		padding: 18px 20px;
		text-align: left;
		border-bottom: 1px solid #D6D6D6;
		background-image: url(/common/images/tri.png);
		background-repeat: no-repeat;
		background-position: right 20px center;
	}

	nav li br {
		display: none;
	}


	nav li a {
		display: block;
	}

	nav li em {
		display: inline-block;
		width: 110px;
	}

	nav li a {
		color: #007DC5;
	}

	nav li a:hover {
		opacity: .8;
	}

	nav li.in a {
		color: #292929;
	}


	#contents {
		padding-top: 60px;
	}



	#footer_data {
		padding: 24px 0 16px;
	}

	#footer_data_name {
		font-size: 16px;
		margin-bottom: 11px;
	}

	#footer_data_address {
		font-size: 12px;
	}

	#footer_contact {
		margin: 0 auto;
		font-size: 14px;
	}
	#footer_contact>div>span, #footer_contact>div>a {
		padding: 20px 5px;
	}
	#footer_contact_tel>span {
		font-size: 14px;
		letter-spacing: 0;
		line-height: 40px;
	}
	#footer_contact_mail a {
		line-height: 20px;
	}
	#footer_contact_mail br{
		display: block;
	}

	#footer_copy {
		background-color: #292929;
		color: #fff;
		padding: 0 0 10px;
		text-align: center;
	}
	#footer_copy_link {
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		background-color: #1F1F1F;
		margin-bottom: 10px;
	}
	#footer_copy_link a {
		display: block;
		width: 50%;
		margin: 0;
		padding: 16px 5px;
	}
	#footer_copy_link a:first-child {
		border-right: 1px solid #2F2F2F;
	}
	#footer_copy_copy {
		font-size: 10px;
	}





	#totop {
		display: block;
		position: fixed;
		bottom: 20px;
		right: 20px;
		width: 50px;
	}
	#totop img {
		width: 100%;
	}







	#title {
		height: 200px;
	}
	#title>h1 {
		font-size: 14px;
	}
	#title>h1>em {
		font-size: 30px;
	}

	#breadcrumb {
		max-width: none;
		margin: 0 auto 18px;
		padding: 0 16px !important;
	}

	#contents>div {
		max-width: none;
		margin-left: 0;
		margin-right: 0;
		padding-left: 20px;
		padding-right: 20px;
	}
}