* {
	margin:  0;
	padding: 0;
	line-height: 1;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

html, body {
	font-size: 9px;
}

body {
	margin: 0;
	padding: 0;
	background-color: #f3f4ef;
	font-family: -apple-system, blinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', 'Shin Go Regular', 'Hiragino Kaku Gothic ProN', Meiryo, arial, sans-serif;
	color: #333;
	-webkit-text-size-adjust: 100%; /* for iPhone */
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: unset;
}

@media (max-width: 767px) {
	html, body {
		font-size: 8px;
	}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),(min-resolution: 2dppx) {
	body {
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
}

ul, ol { list-style: none; }
fieldset, img { border: none; }
table { border-collapse: collapse; }
a, a:focus, *:focus { outline: none; }

a:link {
	text-decoration: none;
	color: rgba(95, 177, 202, 1);
}
a:visited {
	text-decoration: none;
	color: rgba(95, 177, 202, 0.7);
}
a:hover, 
a:active {
	text-decoration: underline;
}

.clearfix:before {
	display: table;
	content: '';
}
.clearfix:after {
	display: table;
	content: '';
	clear: both;
}

/****************************
  fix footer
*****************************/

body, 
#wrapper {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

#area {
	margin-top: auto;
}

/****************************
  header
*****************************/

.header {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 200;
	width: 100%;
	height: 140px;
	margin:  0;
	padding: 0;
	background-color: rgba(255, 255, 255, 0.9);
	transition: all 0.5s;
}
.header.smaller {
	height: 100px;
}

.header > div.wrapper_header {
	display: table;
	width: 1600px;
	height: 100%;
	margin: 0 auto;
	padding: 0;
}
.header > div.wrapper_header > .column_header {
	display: table-cell;
	height: 100%;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}
.header > div.wrapper_header > .column_header.right {
	text-align: right;
}

#logo {
	height: 50px;
	margin: 0;
	padding: 0;
}
#logo > a {
	display: table;
	height: 100%;
	margin: 0;
	padding: 0;
	background-image: url(../images/logo_mark.svg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 50px 50px;
	vertical-align: middle;
}
#logo > a > div {
	display: table-cell;
	margin: 0;
	vertical-align: middle;
}
#logo > a, 
#logo > a:hover {
	text-decoration: none;
}

#logo_type {
	padding: 0 0 0 58px;
}
#logo_type > img {
	width: 200px;
	height: 29px;
	vertical-align: bottom;
}
#logo_type > span {
	display: block;
	padding: 0 0 0.3rem 0.2rem;
	font-style: normal;
	font-size: 1.3rem;
	line-height: 1;
	color: #000;
}

#logo_sub {
	padding: 0 0 0 20px;
	font-size: 1.8rem;
	color: #009fe9;
}
#logo_sub > span {
	display: block;
	padding: 0.3rem 0 0;
}
#logo_sub strong {
	font-size: 2.6rem;
}

/**/

#global_nav > ul {
	display: table;
	height: 100%;
}
#global_nav > ul > li {
	display: table-cell;
	height: 100%;
	margin:  0;
	padding: 1rem 1rem 0;
	vertical-align: middle;
	text-align: center;
}
#global_nav > ul > li > a {
	margin:  0;
	padding: 0;
	font-weight: normal;
	font-size: 1.7rem;
	color: #444;
	text-decoration: none;
	transition: all 0.3s;
}
#global_nav > ul > li > a span {
	display: block;
	padding: 0.6rem 0 0;
	font-weight: normal;
	font-size: 1.4rem;
	color: #aaa;
	transition: all 0.3s;
}
#global_nav > ul > li > a:hover, 
#global_nav > ul > li > a:hover span, 
#global_nav > ul > li > a.active, 
#global_nav > ul > li > a.active span {
	text-decoration: none;
	color: #000;
}

#global_nav > ul > li.sp {
	display: none;
}

/****************************
  ↓↓↓ Dropdown menu
*****************************/

#global_nav > ul > li {
	position: relative;
}
#global_nav > ul > li ul {
	display: none;
	opacity: 0;
	position: absolute;
	top: 100%;
	left: 13px;
	margin:  0;
	padding: 1rem 0 0;
	z-index: 9;
}
#global_nav > ul > li ul li {
	margin:  0;
	padding: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.7);
}
#global_nav > ul > li ul li a {
	display: block;
	margin:  0;
	padding: 1.6rem 1.4rem;
	text-align: left;
	font-weight: normal;
	font-size: 1.4rem;
	line-height: 1;
	white-space: nowrap;
}
#global_nav > ul > li ul li a:link, 
#global_nav > ul > li ul li a:visited {
	background-color: rgba(90, 90, 90, 0.95);
	color: #fff;
	text-decoration: none;
}
#global_nav > ul > li ul li a:hover, 
#global_nav > ul > li ul li a:active {
	background-color: rgba(50, 50, 50, 1);
	color: #fff;
	text-decoration: none;
}

@media (max-width: 768px) {
	#global_nav > ul > li ul li {
		display: none;
	}
}

/****************************
  ↑↑↑ Dropdown menu
*****************************/

.contact_nav {
	display: table;
}
.contact_nav > ul {
	display: table-cell;
	vertical-align: middle;
	text-align: left;
}
.contact_nav > ul > li {
	margin:  0;
	padding: 0.4rem 0;
	font-family: 'Hiragino Maru Gothic ProN', 'Hiragino Kaku Gothic ProN', 'HGMaruGothicMPRO', Meiryo, arial, sans-serif;
}
.contact_nav > ul > li > a {
	color: #666;
	transition: all 0.3s;
}

.contact_nav > ul > li > a.email {
	font-size: 1.9rem;
}
.contact_nav > ul > li > a.phone {
	font-size: 1.9rem;
}

.contact_nav > ul > li > a.email:before {
	padding-right: 0.7rem;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f0e0';
	font-size: 2.1rem;
}
.contact_nav > ul > li > a.phone:before {
	padding-right: 0.8rem;
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	content: '\f87b';
	font-size: 2.3rem;
}
.contact_nav > ul > li > a:hover {
	color: #000;
	text-decoration: none;
}

#contact_nav2 {
	display: none;
}

@media (max-width: 1599px) {
	.header > div.wrapper_header {
		width: 1200px;
	}

	#logo_sub {
		padding: 0 0 0 15px;
	}

	#global_nav > ul > li {
		padding-right: 0.7rem;
		padding-left:  0.7rem;
	}
	#global_nav > ul > li > a {
		font-size: 1.6rem;
	}

	#contact_nav1 {
		display: none;
	}
	#contact_nav2, 
	#contact_nav2 > ul {
		display: block;
		width: 100%;
		text-align: center;
	}
	#contact_nav2 > ul > li {
		display: inline-block;
		padding: 2rem 2rem 0;
	}
}

#logo_sp, 
#nav-toggle,
#global_nav > ul > li#global_nav_contact, 
#global_nav > ul > li#global_nav_phone {
	display: none;
}

/****************************
  effect
*****************************/

.effect_slide_left {
	transform: translate(30px, 0);
}
.effect_slide_right {
	transform: translate(-30px, 0);
}
.effect_slide_top {
	transform: translate(0, 30px);
}
.effect_slide_bottom {
	transform: translate(0, -30px);
}
.effect_view {
	transform: translate(0, 0);
}

.effect .effect_each, 
.effect_scroll .effect_scroll_each {
	opacity: 0;
	transition: all 0.6s ease-out 0s;
}
.effect .effect_each.delay1, 
.effect_scroll .effect_scroll_each.delay1 {
/* 	transition-delay: 0.8s; */
	transition-delay: 0.4s;
}
.effect .effect_each.delay2, 
.effect_scroll .effect_scroll_each.delay2 {
/* 	transition-delay: 1.0s; */
	transition-delay: 0.6s;
}
.effect .effect_each.delay3, 
.effect_scroll .effect_scroll_each.delay3 {
/* 	transition-delay: 1.2s; */
	transition-delay: 0.8s;
}
.effect .effect_each.delay4, 
.effect_scroll .effect_scroll_each.delay4 {
/* 	transition-delay: 1.4s; */
	transition-delay: 1.0s;
}
.effect .effect_each.delay5, 
.effect_scroll .effect_scroll_each.delay5 {
/* 	transition-delay: 1.6s; */
	transition-delay: 1.2s;
}
.effect .effect_each.delay6, 
.effect_scroll .effect_scroll_each.delay6 {
/* 	transition-delay: 1.8s; */
	transition-delay: 1.4s;
}

/****************************
  common
*****************************/

a.readmore:link, 
a.readmore:visited, 
a.readmore:hover, 
a.readmore:active {
	display: inline-block;
	margin:  0 auto;
	padding: 1.2rem 3rem;
	text-align: center;
	font-style: normal;
	font-weight: normal;
	font-size: 1.8rem;
	line-height: 1;
	text-decoration: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	transition: all 0.3s;
	white-space: nowrap;
}
a.readmore:active {
	padding: 1.3rem 3rem 1.1rem;
}

@media (max-width: 500px) {
	a.readmore:link, 
	a.readmore:visited, 
	a.readmore:hover, 
	a.readmore:active {
		display: block;
		padding: 1.2rem 0;
	}
}

a.readmore:link, 
a.readmore:visited {
	border: 1px solid #000;
	background-color: transparent;
	color: #000;
}
a.readmore:hover, 
a.readmore:active {
	border: 1px solid #000;
	background-color: #000;
	color: #fff;
}

a.readmore.gray:link, 
a.readmore.gray:visited {
	border: 1px solid #333;
	background-color: transparent;
	color: #333;
}
a.readmore.gray:hover, 
a.readmore.gray:active {
	border: 1px solid #333;
	background-color: #333;
	color: #fff;
}

/****************************
  SP
*****************************/

@media (max-width: 768px) {
	.header {
		position: fixed;
		top: 0;
		left: 0;
		height: 64px;
		background-color: #fff;
	}
	.header.hide {
		transform: translateY(-100%);
	}
	.header > div.wrapper_header {
		width: 100%;
		margin: 0;
		position: relative;
	}

	#logo {
		display: none;
	}

	#logo_sp {
		position: absolute;
		z-index: 300;
		top: 0;
		left: 0;
		display: block;
		width: calc(100% - 64px);
		height: 64px;
		background-color: #fff;
		background-image: url(../images/logo_mark.svg);
		background-repeat: no-repeat;
		background-position: 10px center;
		background-size: 45px 45px;
	}
	#logo_sp > a {
		display: inline-block;
		height: 100%;
		margin:  0;
		padding: 1rem 0 0 60px;
	}
	#logo_sp > a > img {
		width: auto;
		height: 23px;
	}
	#logo_sp > a > span {
		display: block;
		padding: 0.2rem 0 0 0.1rem;
		font-weight: normal;
		font-size: 1.3rem;
	}
	#logo_sp > a > span > strong {
		padding: 0 0 0 0.4rem;
		font-size: 1.9rem;
	}

	#nav-toggle {
		display: block;
		position: absolute;
		z-index: 400;
		top: 0;
		right: 0;
		width:  64px;
		height: 64px;
		background-color: #fff;
		cursor: pointer;
		text-decoration: none;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}
	#nav-toggle div {
		width:  34px;
		height: 36px;
		margin:  19px 0 0 10px;
		padding: 0;
		position: relative;
	}
	#nav-toggle span {
		display: block;
		position: absolute;
		width: 100%;
		height: 3px;
		background-color: #000;
		left: 0;
		transition: 0.2s;
	}
	#nav-toggle span:nth-child(1) {
		top: 0;
	}
	#nav-toggle span:nth-child(2) {
		top: 11px;
	}
	#nav-toggle span:nth-child(3) {
		top: 22px;
	}

	.open #nav-toggle span:nth-child(1) {
		top: 11px;
		transform: rotate(225deg);
	}
	.open #nav-toggle span:nth-child(2) {
		width: 0;
		left: 50%;
	}
	.open #nav-toggle span:nth-child(3) {
		top: 11px;
		transform: rotate(-225deg);
	}

	#global_nav {
		position: fixed;
		z-index: 100;
		transform: translateY(-100%);
		top: 0;
		right: 0;
		left: 0;
		width: 100%;
		height: initial;
		background-color: #014886;
		background: -moz-linear-gradient(65deg,#014886,#2172b9 33%,#014886);
		background: -webkit-linear-gradient(65deg,#014886,#2172b9 33%,#014886);
		background: linear-gradient(25deg,#014886,#2172b9 33%,#014886);
		text-align: left;
		transition: 0.4s ease-in-out;
	}
	#global_nav > ul {
		display: block;
		text-align: left;
	}
	#global_nav > ul > li, 
	#global_nav > ul > li.sp {
		clear: both;
		display: block;
		width: 100%;
		height: initial;
		margin:  0;
		padding: 0;
		text-align: left;
	}

	#global_nav > ul > li.pc {
		display: none;
	}

	#global_nav > ul > li#global_nav_contact, 
	#global_nav > ul > li#global_nav_phone {
		display: block;
	}

	#global_nav > ul > li > a {
		display: block;
		width: 100%;
		padding: 1.5rem 2.5rem;
		font-size: 1.8rem;
		line-height: 1;
	}
	#global_nav > ul > li:first-child > a {
		padding-top: 2.5rem;
	}
	#global_nav > ul > li > a span {
		display: block;
		float: right;
		padding: 0 0 0 0;
		text-align: right;
		font-weight: normal;
		font-size: 1.6rem;
	}

	#global_nav > ul > li > a:before {
		display: inline-block;
		margin:  0;
		padding: 0 0.5rem 0 0;
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		font-size: 1.8rem;
	}

	#global_nav_phone > a:before {
		content: '\f879';
	}

	#global_nav > ul > li > a, 
	#global_nav > ul > li > a:before, 
	#global_nav > ul > li > a span, 
	#global_nav > ul > li > a:hover:before, 
	#global_nav > ul > li > a:hover span, 
	#global_nav > ul > li > a.active span {
		color: #fff;
		text-decoration: none;
	}
	#global_nav > ul > li > a:hover, 
	#global_nav > ul > li > a.active {
		background-color: #014886;
		color: #fff;
		text-decoration: none;
	}

	.open #global_nav {
		top: 64px;
		bottom: 0;
		overflow-y: auto;
		transform: translateY(0px);
	}

	#contact_nav2 {
		display: none;
	}
}
@media (max-width: 600px) {
	.effect_slide_left {
		transform: translate(0px, 0);
	}
	.effect_slide_right {
		transform: translate(0px, 0);
	}
	.effect .effect_each.delay1, 
	.effect_scroll .effect_scroll_each.delay1 {
		transition-delay: 0.2s;
	}
	.effect .effect_each.delay2, 
	.effect_scroll .effect_scroll_each.delay2 {
		transition-delay: 0.4s;
	}
	.effect .effect_each.delay3, 
	.effect_scroll .effect_scroll_each.delay3 {
		transition-delay: 0.6s;
	}
	.effect .effect_each.delay4, 
	.effect_scroll .effect_scroll_each.delay4 {
		transition-delay: 0.8s;
	}
	.effect .effect_each.delay5, 
	.effect_scroll .effect_scroll_each.delay5 {
		transition-delay: 1.0s;
	}
	.effect .effect_each.delay6, 
	.effect_scroll .effect_scroll_each.delay6 {
		transition-delay: 1.2s;
	}
}
@media (max-width: 320px) {
	#global_nav > ul > li > a {
		padding: 1.5rem 2rem;
	}
}

/****************************
  footer
*****************************/

#footer {
	width: 100%;
	padding: 2rem 0;
	background-color: #014886;
	background: -moz-linear-gradient(65deg,#014886,#2172b9 33%,#014886);
	background: -webkit-linear-gradient(65deg,#014886,#2172b9 33%,#014886);
	background: linear-gradient(25deg,#014886,#2172b9 33%,#014886);
	color: #fff;
}

#footer > .container {
	width: 1200px;
	margin:  0 auto;
	padding: 0;
}

@media (max-width: 999px) {
	#footer > .container {
		width: 100%;
		padding-right: 1.5rem;
		padding-left:  1.5rem;
	}
}

#footer > .container > div {
	display: table;
	width: 100%;
}
#footer > .container > div > div {
	display: table-cell;
	vertical-align: top;
}
#footer > .container > div > div > span {
	display: inline-block;
	margin:  0;
	padding: 0 8rem 0 0;
	vertical-align: top;
}
#footer > .container > div > div.right {
	width:  45rem;
	height: 26rem;
	text-align: right;
}
#footer > .container > div > div.right > iframe {
	width:  100%;
	height: 100%;
	margin:  0;
	padding: 0;
}

#footer a:link, 
#footer a:visited {
	text-decoration: none;
	color: #fff;
}
#footer a:hover, 
#footer a:active {
	text-decoration: underline;
}

#footer i.fas {
	padding-right: 4px;
}
#footer i.fa-map-marker {
	padding-right: 8px;
	padding-left:  1px;
	font-size: 1.6rem;
}
#footer i.fa-phone-alt {
	padding-right: 6px;
	font-size: 1.6rem;
}

#footer ul.ul_footer {
	margin:  0;
	padding: 0;
}
#footer ul.ul_footer li {
	margin:  0;
	padding: .8em 0 0;
	font-size: 1.4rem;
	line-height: 1.3;
}

#footer ul.ul_footer_address {
	margin:  0;
	padding: 0;
}
#footer ul.ul_footer_address li {
	margin:  0;
	padding: .8em 0 0;
	font-size: 1.4rem;
	line-height: 1.5;
}
#footer ul.ul_footer_address li span {
	display: inline-block;
	margin:  0 5px 3px 0;
	padding: 4px 4px 4px;
	vertical-align: 2px;
	background-color: #fff;
	color: #014886;
	font-size: 1.4rem;
	line-height: 1;
}
#footer ul.ul_footer_address li span a:link, 
#footer ul.ul_footer_address li span a:visited, 
#footer ul.ul_footer_address li span a:hover, 
#footer ul.ul_footer_address li span a:active {
	display: block;
	text-decoration: none;
	color: #014886;
	font-weight: normal;
}

#copy {
	width: 100%;
	margin:  0;
	padding: 2rem 0 0;
	text-align: center;
	font-size: 1.4rem;
	line-height: 1;
	color: #fff;
}
#copy a {
	color: #fff;
}

@media (max-width: 768px) {
	#footer > .container > div {
		display: block;
	}
	#footer > .container > div > div {
		display: block;
	}
	#footer > .container > div > div.right {
		width: 100%;
		height: 40rem;
		text-align: center;
	}

	#footer > .container > div > div > span {
		width: 50%;
		padding: 0 2rem;
	}

	#footer ul.ul_footer {
		padding: 0 0 4rem;
	}
	#footer ul.ul_footer li {
		padding: 0 0 2rem;
	}

	#footer ul.ul_footer_address li {
		padding: 0 0 4rem;
		line-height: 2;
	}
}
@media (max-width: 500px) {
	#footer > .container > div > div > span {
		display: block;
		width: initial;
		padding: 0 0 4rem;
	}
}

/****************************
  area
*****************************/

.wrapper_area_section {
	width: 100%;
	padding: 5rem 0;
	background-color: #f3f4ef;
}
.wrapper_area_section.white {
	background-color: #fff;
}

h2.h2_area {
	margin:  0;
	padding: 0;
	text-align: left;
	font-weight: normal;
	font-size: 2.6rem;
	line-height: 1.2;
}

p.p_area {
	margin:  0;
	padding: 2rem 0 0;
	text-align: justify;
	font-size: 1.8rem;
	line-height: 1.5;
}

/****************************
  nav_footer
*****************************/

.nav_footer {
	margin:  0 0;
	padding: 5rem 0;
	background-color: #f3f4ef;
}
.nav_footer.white {
	background-color: #fff;
}

@media (max-width: 768px) {
	.nav_footer {
		padding-right: 1.5rem;
		padding-left:  1.5rem;
	}
}

h2.h2_nav_footer {
	margin:  0;
	padding: 0;
	text-align: center;
	font-weight: normal;
	font-size: 2rem;
	line-height: 1.3;
}

.wrapper_nav_footer_button {
	display: flex;
	justify-content: center;
	width: 100%;
	margin:  0;
	padding: 0;
}
.wrapper_nav_footer_button > span {
	margin:  0;
	padding: 0 3rem;
	text-align: center;
}

.wrapper_nav_button {
	margin:  0 auto;
	padding: 40px 0 0;
	text-align: center;
}
.wrapper_nav_button.left {
	margin:  0;
	text-align: left;
}

@media (max-width: 768px) {
	.wrapper_nav_footer_button {
		display: block;
		text-align: center;
	}
	.wrapper_nav_footer_button > span {
		padding: 0;
	}
	
	h2.h2_nav_footer {
		text-align: justify;
	}
}