@charset "UTF-8";

/* Table Of Contents
----------------------------------------------------------------------------
General Elements
header
gNav
visual
topicPath
footer
---------------------------------------------------------------------------- */
/* Webフォント
---------------------------------------------------------------------------- */


@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 400;
	src: url("../../fonts/NotoSansJP-Regular.woff2") format("woff2"), url("../../fonts/NotoSansJP-Regular.woff") format("woff"), url("../../fonts/NotoSansJP-Regular.otf") format("opentype");
}

@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 500;
	src: url("../../fonts/NotoSansJP-Medium.woff2") format("woff2"), url("../../fonts/NotoSansJP-Medium.woff") format("woff"), url("../../fonts/NotoSansJP-Medium.otf") format("opentype");
}

@font-face {
	font-family: 'Noto Sans Japanese';
	font-style: normal;
	font-weight: 700;
	src: url("../../fonts/NotoSansJP-Bold.woff2") format("woff2"), url("../../fonts/NotoSansJP-Bold.woff") format("woff"), url("../../fonts/NotoSansJP-Bold.otf") format("opentype");
}

/*Web icon
---------------------------------------------------------------------------- */

@font-face {
	font-family: 'metro-dev';
	src: url('../../fonts/metro-dev.eot?cwgkid');
	src: url('../../fonts/metro-dev.eot?cwgkid#iefix') format('embedded-opentype'),
		url('../../fonts/metro-dev.ttf?cwgkid') format('truetype'),
		url('../../fonts/metro-dev.woff?cwgkid') format('woff'),
		url('../../fonts/metro-dev.svg?cwgkid#metro-dev') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icn-"],
[class*=" icn-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'metro-dev' !important;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icn-home3:before {
	content: "\e90a";
	color: #3a3a3a;
}

.icn-terms:before {
	content: "\e905";
	color: #3a3a3a;
}

.icn-money2:before {
	content: "\e906";
	color: #3a3a3a;
}

.icn-security:before {
	content: "\e907";
	color: #3a3a3a;
}

.icn-fan:before {
	content: "\e908";
	color: #3a3a3a;
}

.icn-money:before {
	content: "\e909";
	color: #3a3a3a;
}

.icn-map:before {
	content: "\e90b";
	color: #3a3a3a;
}

.icn-balloon:before {
	content: "\e900";
	color: #3a3a3a;
}

.icn-home:before {
	content: "\e901";
	color: #3a3a3a;
}

.icn-memo:before {
	content: "\e902";
	color: #3a3a3a;
}

.icn-home2:before {
	content: "\e903";
	color: #3a3a3a;
}

.icn-marker:before {
	content: "\e904";
	color: #3a3a3a;
}

.icn-right-arrow:before {
	content: "\e90c";
	color: #3a3a3a;
}

.icn-right-arrow2:before {
	content: "\ea1c";
	color: #3a3a3a;
}

.icn-bag:before {
	content: "\e90d";
	color: #3a3a3a;
}

.icn-certificate:before {
	content: "\e90e";
	color: #3a3a3a;
}

.icn-stamp:before {
	content: "\e90f";
	color: #3a3a3a;
}

.icn-terms2:before {
	content: "\e910";
	color: #3a3a3a;
}

.icn-pdf:before {
	content: "\e911";
	color: #3a3a3a;
}

.icn-check:before {
	content: "\e912";
	color: #3a3a3a;
}

.icn-minus:before {
	content: "\e913";
	color: #3a3a3a;
}

.icn-plus:before {
	content: "\e914";
	color: #3a3a3a;
}

.icn-a:before {
	content: "\e915";
	color: #3a3a3a;
}

.icn-q:before {
	content: "\e916";
	color: #3a3a3a;
}

.icn-memo2:before {
	content: "\e917";
	color: #3a3a3a;
}

/*General Elements
---------------------------------------------------------------------------- */
html {
	font-size: 62.5%;
}

body {
	font-family: 'Noto Sans Japanese', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.5;
	-webkit-text-size-adjust: 100%;
	color: #333;
}

a {
	text-decoration: underline;
	color: #2c6cd6;
	outline: none;
}

a:hover {
	text-decoration: none;
}

img {
	max-width: 100%;
}

* {
	box-sizing: border-box;
}

/*l-header
---------------------------------------------------------------------------- */
.l-header {
	position: fixed;
	width: 100%;
	background: #fff;
	z-index: 100;
}

.l-header-inner {
	padding: 20px 20px 0 30px;
	max-width: 1538px;
	margin: 0 auto;
}

.l-header-logo {
	float: left;
	width: auto;
	margin-bottom: 15px;
}

.l-header-logo img {
	width: 250px;
	height: auto;
}

@media screen and (max-width: 767px) {
	.l-header {
		position: fixed;
		width: 100%;
		background: #fff;
	}

	.l-header-inner {
		padding: 4vw 0 0 3.33vw;
		max-width: 100%;
		margin: 0 auto;
		width: 100%;
		background: #fff;
		z-index: 1;
		position: absolute;
	}

	.l-header-logo {
		float: none;
		margin-bottom: 3.9vw;
	}

	.l-header-logo img {
		width: 48.13vw;
		height: auto;
	}

	.l-header-menu img {
		width: 17.6vw;
		height: 17.6vw;
		position: absolute;
		top: 0;
		right: 0;
	}

	.l-header.open {
		height: 100%;
	}

	.l-header.open .l-header-scroll {
		height: 100%;
		overflow-y: scroll !important;
		-webkit-overflow-scrolling: touch;
	}

	.l-header.open .l-header-inner {
		border-bottom: solid 1px #00467e;
	}

}

/* l-gnav
---------------------------------------------------------------------------- */
.l-gnav {
	background: #00467e;
	display: block;
}

.l-gnav-list {
	position: fixed;
	top: 45px;
	right: 45px;
}

.l-gnav-list a {
	color: #3a3a3a;
	text-decoration: none;
	font-size: 16px;
	font-size: 1.6rem;
}

.l-gnav-list a:hover {
	text-decoration: underline;
}

.l-gnav-list .icn-home:before,
.l-gnav-list .icn-right-arrow2:before {
	color: #3a3a3a;
	padding-right: 5px;
	font-size: 16px;
	font-size: 1.6rem;
	display: inline-block;
}

.l-gnav-list li {
	display: inline-block;
}

.l-gnav-list li+li {
	padding-left: 15px;
}

.l-gnav-inner a {
	font-size: 16px;
	font-size: 1.6rem;
	color: #fff;
	text-decoration: none;
	padding: 15px 30px;
	display: block;
}

.l-gnav-inner a:hover {
	color: #fffe80;
}

.l-gnav-inner {
	width: 1100px;
	margin: 0 auto;
}

.l-gnav-inner li {
	float: left;
	width: auto;
}

.l-gnav-inner .icn-home2:before,
.l-gnav-inner .icn-marker:before,
.l-gnav-inner .icn-memo:before,
.l-gnav-inner .icn-balloon:before {
	color: #fff;
	padding-right: 5px;
	font-size: 16px;
	font-size: 1.6rem;
	display: inline-block;
}

.l-gnav-inner a:hover .icn-home2:before,
.l-gnav-inner a:hover .icn-marker:before,
.l-gnav-inner a:hover .icn-memo:before,
.l-gnav-inner a:hover .icn-balloon:before {
	color: #fffe80;
}

@media screen and (max-width: 1070px) {
	.l-gnav-list a {
		font-size: 12px;
		font-size: 1.2rem;
	}

	.l-gnav-list .icn-home:before,
	.l-gnav-list .icn-right-arrow2:before {
		font-size: 12px;
		font-size: 1.2rem;
	}

	.l-gnav-inner {
		width: 100%;
		margin: 0 auto;
	}

	.l-gnav-inner li {
		float: left;
	}

	.l-gnav-inner li:nth-child(1) {
		width: 26%;
		padding-left: 20px;
	}

	.l-gnav-inner li:nth-child(2) {
		width: 25%;
	}

	.l-gnav-inner li:nth-child(3) {
		width: 25%;
	}

	.l-gnav-inner li:nth-child(4) {
		width: 12%;
	}

	.l-gnav-inner li:nth-child(5) {
		width: 12%;
	}

	.l-gnav-inner a {
		font-size: 12px;
		font-size: 1.2rem;
		padding: 15px 0;
	}

	.l-gnav-inner .icn-home2:before,
	.l-gnav-inner .icn-marker:before,
	.l-gnav-inner .icn-memo:before,
	.l-gnav-inner .icn-balloon:before {
		font-size: 12px;
		font-size: 1.2rem;
	}
}

@media screen and (max-width: 767px) {
	.l-gnav {
		background: #fff;
		border-top: solid 1px #00467e;
		padding-top: 17.5vw;
		display: none;
	}

	.l-gnav-list {
		position: static;
		top: 0;
		right: 0;
		border: solid 1px #cccccc;
	}

	.l-gnav-list a {
		color: #3a3a3a;
		font-size: 4.53vw;
		display: block;
		padding: 4vw 5.33vw;
	}

	.l-gnav-list a:hover {
		text-decoration: none;
	}

	.l-gnav-list .icn-home:before,
	.l-gnav-list .icn-right-arrow2:before {
		color: #3a3a3a;
		padding-right: 2vw;
		font-size: 4.53vw;
	}

	.l-gnav-list li {
		width: 50%;
		display: block;
		float: left;
	}

	.l-gnav-list li+li {
		padding-left: 0;
		float: right;
		border-left: solid 1px #cccccc;
	}

	.l-gnav-inner li {
		float: none;
		width: 100%;
	}

	.l-gnav-inner a {
		font-size: 4.53vw;
		color: #00467e;
		text-decoration: none;
		padding: 6vw 4vw;
		display: block;
		border-bottom: solid 1px #00467e;
		margin: 0 4vw;
		position: relative;
	}

	.l-gnav-inner a:before {
		font-family: 'metro-dev' !important;
		speak: none;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		line-height: 1;
		/* Better Font Rendering =========== */
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		position: absolute;
		top: 7vw;
		right: 0;
		margin: auto;
		content: "\e90c";
		vertical-align: middle;
		color: #00467e;
	}

	.l-gnav-inner a:hover {
		color: #00467e;

	}

	.l-gnav-inner {
		width: 100%;
		margin: 0 auto;
	}

	.l-gnav-inner li:nth-child(1) {
		width: 100%;
		padding-left: 0;
	}

	.l-gnav-inner li:nth-child(2),
	.l-gnav-inner li:nth-child(3),
	.l-gnav-inner li:nth-child(4),
	.l-gnav-inner li:nth-child(5) {
		width: 100%;
	}

	.l-gnav-inner .icn-home2:before,
	.l-gnav-inner .icn-marker:before,
	.l-gnav-inner .icn-memo:before,
	.l-gnav-inner .icn-balloon:before {
		color: #00467e;
		padding-right: 2vw;
		font-size: 4.53vw;
		display: inline-block;
	}

	.l-gnav-inner a:hover .icn-home2:before,
	.l-gnav-inner a:hover .icn-marker:before,
	.l-gnav-inner a:hover .icn-memo:before,
	.l-gnav-inner a:hover .icn-balloon:before {
		color: #00467e;
	}

	/*開閉ボタン*/
	#l-gnav-toggle {
		display: block;
		width: 17.6vw;
		height: 17.6vw;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 100;
		background: #00467e;
		padding: 1vw 5.33vw 0;
	}

	#l-gnav-toggle div {
		position: relative;
	}

	#l-gnav-toggle span {
		display: block;
		height: 3px;
		background: #fff;
		position: absolute;
		width: 100%;
		left: 0;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;
	}

	#l-gnav-toggle span:nth-child(1) {
		top: 2vw;
	}

	#l-gnav-toggle span:nth-child(2) {
		top: 5vw;
	}

	#l-gnav-toggle span:nth-child(3) {
		top: 8vw;
	}

	#l-gnav-toggle p {
		position: absolute;
		top: 11vw;
		color: #fff;
		left: 4.5vw;
		font-size: 2.93vw;
	}

	/*開閉ボタンopen時*/
	.open #l-gnav-toggle span:nth-child(1) {
		top: 8vw;
		left: -2vw;
		-webkit-transform: rotate(135deg);
		-moz-transform: rotate(135deg);
		transform: rotate(135deg);
		width: 12vw;
	}

	.open #l-gnav-toggle span:nth-child(2) {
		width: 0;
		left: 50%;
	}

	.open #l-gnav-toggle span:nth-child(3) {
		top: 8vw;
		left: -2vw;
		width: 12vw;
		-webkit-transform: rotate(-135deg);
		-moz-transform: rotate(-135deg);
		transform: rotate(-135deg);
	}

	.open #l-gnav-toggle p {
		display: none;
	}
}

/* l-topicPath
---------------------------------------------------------------------------- */
.l-topicPath {}


/* l-content
---------------------------------------------------------------------------- */
.l-content {
	min-width: 1100px;
}

.l-content:nth-of-type(2n-1) {
	background-color: #f7f8f8;
}

.l-content:nth-of-type(2) {
	background-color: #fff;
}

.l-content-inner {
	width: 840px;
	margin: 0 auto;
	padding: 75px 0 60px;
}

@media screen and (max-width: 767px) {
	.l-content {
		min-width: 100%;
	}

	.l-content-inner {
		width: 92%;
		padding: 8vw 0 10vw;
	}
}


/* l-footer
---------------------------------------------------------------------------- */
.l-footer {
	background: #00467e;
	padding: 25px 0 30px;
	min-width: 1100px;
}

.l-footer-inner {
	width: 1100px;
	margin: 0 auto;
}

.l-footer-list {
	float: left;
	width: 700px;
}

.l-footer-list li {
	float: left;
	width: auto;
	border-right: solid 1px #fff;
	padding-right: 15px;
	margin-right: 15px;
}

.l-footer-list a {
	color: #fff;
	text-decoration: none;
	font-size: 14px;
	font-size: 1.4rem;
}

.l-footer-list a:hover {
	text-decoration: underline;
}

.l-footer-box {
	float: right;
	width: 330px;
	color: #fff;
	font-size: 14px;
	font-size: 1.4rem;
}

@media screen and (max-width: 767px) {
	.l-footer {
		background: #00467e;
		padding: 0;
		min-width: 100%;
	}

	.l-footer-inner {
		width: 100%;
		margin: 0 auto;
	}

	.l-footer-list {
		float: left;
		width: 100%;
	}

	.l-footer-list li {
		float: none;
		width: 100%;
		border-right: none;
		border-bottom: solid 1px #fff;
		padding-right: 0;
		margin-right: 0;
		text-align: center;
	}

	.l-footer-list li:nth-child(even) {
		border-right: none;
	}

	.l-footer-list li:last-child {
		width: 100%;
		border-right: none;

	}

	.l-footer-list a {
		color: #fff;
		text-decoration: none;
		font-size: 4vw;
		display: block;
		padding: 4vw 6vw;
	}

	.l-footer-list a:hover {
		text-decoration: none;
	}

	.l-footer-box {
		width: 100%;
		font-size: 3.73vw;
		padding: 6vw 4vw;
	}

}