@charset "utf-8";
/* ========================================================
	template.css => テンプレート用CSS
======================================================== */

html {
	font-size: 62.5%;
}
body {
	background-color: #fff;
	font-size: 10px;
	font-size: 1rem;
	line-height: 1.8;
	color: #1a1a1a;

	/* ヒラギノベース */
	/*font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", Verdana, Arial, Helvetica, sans-serif;*/
	/* 游ゴシックベース */
	font-family: "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", Verdana, Arial, Helvetica, sans-serif;
	/* メイリオベース */
	/*font-family: "メイリオ", "Meiryo", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Verdana, Arial, Helvetica, sans-serif;*/
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	line-height: 1.8;
}
a[href] {
	color: #0068b7;
	text-decoration: underline;
	outline: none;
}
a[href]:hover {
	text-decoration: none;
}
a[href].a_reverse,
.a_reverse a[href] {
	text-decoration: none;
}
a[href].a_reverse:hover,
.a_reverse a[href]:hover {
	text-decoration: underline;
}
a[href^="http"],
a[href^="mailto:"] {
	word-wrap : break-word;
	overflow-wrap : break-word;
}

sup, sub {
	font-size: xx-small;
}

label {
	cursor: pointer;
}
input, select, textarea, button {
	max-width: 100%;
	margin: 0;
	vertical-align: middle;
	font-family: inherit;
	outline: none;
	font-size: 100%;
}

button {
	cursor: pointer;
}
iframe {
	max-width: 100%;
	vertical-align: middle;
}

.hidden {
	display: none;
}
.slick-slider * {
	outline: none;
}


/* color
============================================================================================================ */
.c_theme,
a.c_theme {
	color: #0068b7;
}
.c_white,
a.c_white {
	color: #fff;
}
.c_black,
a.c_black {
	color: #1a1a1a;
}

/* bg
============================================================================================================ */
.bg_blue {
	background-color: #f3f7f9;
}

/* transition
============================================================================================================ */
a[href],
a[href]:before,
a[href]:after,
button,
.basic_trs,
.basic_trs:before,
.basic_trs:after,
.basic_trs *,
.basic_trs *:before,
.basic_trs *:after {
	-webkit-transition: color 0.2s, background 0.2s, border 0.2s, opacity 0.2s;
	-o-transition: color 0.2s, background 0.2s, border 0.2s, opacity 0.2s;
	transition: color 0.2s, background 0.2s, border 0.2s, opacity 0.2s;
}

/* font
============================================================================================================ */
.fwb {
	font-weight: bold;
}



/* display
============================================================================================================ */
.db {
	display: block;
}
.dib {
	display: inline-block;
}

/* w
============================================================================================================ */
.w {
	position: relative;
	width: 1170px;
	margin: 0 auto;
}
.w:after {
	content: ""; display: table; clear: both;
}
.mw {
	min-width: 1200px;
}
.tw {
	min-width: 1170px;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 20px;
}
.tw:after {
	content: ""; display: table; clear: both;
}


/* hv_wh
============================================================================================================ */
a.hv_wh,
button.hv_wh,
a .hv_wh,
.hv_wh a {
	position: relative;
	display: block;
	overflow: hidden;
	vertical-align: middle;
}
a.hv_wh:after,
button.hv_wh:after,
a .hv_wh:after,
.hv_wh a:after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-color: rgba(255,255,255,0);
	-webkit-transition: background 0.2s;
	-o-transition: background 0.2s;
	transition: background 0.2s;
	z-index: 3;
}
a[href].hv_wh:hover:after,
button.hv_wh:hover:after,
a[href]:hover .hv_wh:after,
.hv_wh a[href]:hover:after {
	background-color: rgba(255,255,255,0.3);
}
a[href].hv_wh.a20:hover:after,
button.hv_wh.a20:hover:after,
a[href]:hover .hv_wh.a20:after,
.hv_wh.a20 a[href]:hover:after {
	background-color: rgba(255,255,255,0.1);
}
a[href].hv_wh.a10:hover:after,
button.hv_wh.a10:hover:after,
a[href]:hover .hv_wh.a10:after,
.hv_wh.a10 a[href]:hover:after {
	background-color: rgba(255,255,255,0.02);
}

.hv_op a:hover,
a.hv_op:hover,
a:hover .hv_op {
	opacity: .7;
}



/* target
============================================================================================================ */
.target {
	display: block;
	position: relative;
	width: 1px;
	top: -100px;
}
.target.pt {
	top: -120px;
}


/* container
============================================================================================================ */
#container {
	position: relative;
	padding-top: 100px;
	font-size: 1.5rem;
	line-height: 1.8;
}



/* ヘッダー
============================================================================================================ */
#header {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	height: 100px;
	background-color: #fff;
	border-bottom: 1px solid #0068b7;
	z-index: 1000;
}
#header .logo {
	padding: 20px 50px;
}
#header .logo a {
}
@media print {
	#header {
		position: absolute;
	}
}


/* nav
------------------------------------------------------------- */
#header nav a {
	position: relative;
	display: table;
	width: 100%;
	text-align: center;
	text-decoration: none;
}
#header nav a > * {
	display: table-cell;
	vertical-align: middle;
}
#header nav {
	position: absolute;
	right: 30px;
	top: 0;
	font-weight: bold;
}
#header .gnav li {
	float: left;
}
#header .gnav a {
	height: 100px;
	padding: 0 18px;
	font-size: 1.6rem;
	line-height: 1.5;
}
#header .gnav a:after {
	content: "";
	position: absolute;
	bottom: 26px;
	right: 15px;
	left: 15px;
	border-top: 1px solid #0068b7;
	opacity: 0;
	-webkit-transform: translateY(-3px);
	-ms-transform: translateY(-3px);
	-o-transform: translateY(-3px);
	transform: translateY(-3px);
	-webkit-transition: all .2s;
	-o-transition: all .2s;
	transition: all .2s;
}
#header .gnav li a.current:after,
#header .gnav li a:hover:after {
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	-o-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}



/* フッター
============================================================================================================ */
#footer {
	position: relative;
	margin-top: 100px;
	padding: 40px 0;
	background-color: #0068b7;
	text-align: center;
}
#footer small {
	display: block;
	margin-top: 10px;
	font-size: 1.3rem;
	letter-spacing: 1px;
	color: #fff;
}


/* topicpath
============================================================================================================ */
.topicpath {
	margin-bottom: 70px;
	font-size: 1.4rem;
}
@media screen and (max-width: 768px) {
	.topicpath {
		display: none;
	}
}



/* タイトル
============================================================================================================ */
.page_title {
	position: relative;
	overflow: hidden;
	padding: 50px 0 70px;
	background: #4498cf url(../images/parts/page_title_bg.jpg) no-repeat 50%;
	-webkit-background-size: cover;
	background-size: cover;
	text-align: center;
	font-size: 2rem;
	line-height: 1.4;
	font-weight: bold;
	color: #fff;
}
.page_title:before,
.page_title:after {
	content: "";
	position: absolute;
	bottom: 0;
	width: 50%;
	height: 20px;
	background-color: #fff;
}
.page_title:before {
	right: 50%;
	-webkit-transform-origin: 100% 100%;
	-moz-transform-origin: 100% 100%;
	-ms-transform-origin: 100% 100%;
	-o-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
	-webkit-transform: skewX(50deg);
	-ms-transform: skewX(50deg);
	-o-transform: skewX(50deg);
	transform: skewX(50deg);
}
.page_title:after {
	left: 50%;
	-webkit-transform-origin: 0 100%;
	-moz-transform-origin: 0 100%;
	-ms-transform-origin: 0 100%;
	-o-transform-origin: 0 100%;
	transform-origin: 0 100%;
	-webkit-transform: skewX(-50deg);
	-ms-transform: skewX(-50deg);
	-o-transform: skewX(-50deg);
	transform: skewX(-50deg);
}
.page_title span {
	display: block;
	margin-bottom: 10px;
	font-size: 3rem;
}




.line_title {
	margin-bottom: 35px;
	padding-bottom: 10px;
	border-bottom: 3px solid #0068b7;
	font-size: 2.4rem;
	line-height: 1.5;
	color: #0071bc;
}
.line_title.m {
	font-size: 2.2rem;
}
.line_title.white {
	color: #fff;
	border-bottom-color: #fff;
}




.color_title {
	margin-bottom: 15px;
	font-size: 2rem;
	line-height: 1.5;
	color: #0071bc;
}