@charset "utf-8";

/*---------------------------------------------
Reset Style
---------------------------------------------*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, dl, dt, dd, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

*			{ box-sizing: border-box; margin: 0; padding: 0; font-size: 100%; }
html	{ color: #000; background-color: #fff; font-size: 62.5%; overflow: auto; }
body	{ width: 100%; height: 100%; font-family: Meiryo, メイリオ, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Osaka, 'MS PGothic', arial, helvetica, sans-serif; font-size: 1rem; line-height: 1.5; text-align: left; }

hr, legend	{ display: none; }
img			{ border: none; vertical-align: bottom; }
article, aside, details, figure, figcaption, header, footer, hgroup, menu, nav, section, main		{ display: block; }
div, dl, dt, dd, form, input, ul, ol, li, p, select, textarea, span, th, td, figure, figcaption	{ margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6, address, th, caption, em, strong, dfn { font-style: normal; font-weight: normal; }
input, select						{ vertical-align: middle; }
input, select, textarea	{ font-size: 100%; font-family: inherit; font-weight: inherit; }
sup			{ vertical-align: top; font-size: 72%; }
sub			{ vertical-align: bottom; font-size: 72%; }
del			{ text-decoration: line-through; }
ol, ul	{ list-style: none; }
table		{ border-collapse: collapse; border-spacing: 0; font-size: 100%; font-size: inherit; }
caption	{ text-align: left; }
fieldset{ border: 0; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content: none; }

a       { color: #333; outline: none; text-decoration: none; transition: all .3s; }
a:hover { /*text-decoration: underline;*/ opacity: .6; }

/*---------------------------------------------
Common Style
---------------------------------------------*/
.m0			{ margin: 0 !important; }
.mat0		{ margin-top: 0 !important; }
.mat1		{ margin-top: 1em !important; }
.mat5		{ margin-top: 5px !important; }
.mat10	{ margin-top: 10px !important; }
.mat15	{ margin-top: 15px !important; }
.mat20	{ margin-top: 20px !important; }
.mat25	{ margin-top: 25px !important; }
.mat30	{ margin-top: 30px !important; }
.mat40	{ margin-top: 40px !important; }
.mat50	{ margin-top: 50px !important; }
.mab0		{ margin-bottom: 0 !important; }
.mab1		{ margin-bottom: 1em !important; }
.mab5		{ margin-bottom: 5px !important; }
.mab10	{ margin-bottom: 10px !important; }
.mab15	{ margin-bottom: 15px !important; }
.mab20	{ margin-bottom: 20px !important; }
.mab25	{ margin-bottom: 25px !important; }
.mab30	{ margin-bottom: 30px !important; }
.mab40	{ margin-bottom: 40px !important; }
.mab50	{ margin-bottom: 50px !important; }
.mar0		{ margin-right: 0 !important; }
.mar1		{ margin-right: 1em !important; }
.mar10	{ margin-right: 10px !important; }
.mar15	{ margin-right: 15px !important; }
.mar20	{ margin-right: 20px !important; }
.mar30	{ margin-right: 30px !important; }
.mal0		{ margin-left: 0 !important; }
.mal1		{ margin-left: 1em !important; }
.mal10	{ margin-left: 10px !important; }
.mal15	{ margin-left: 15px !important; }
.mal20	{ margin-left: 20px !important; }
.mal30	{ margin-left: 30px !important; }

.p0			{ padding: 0 !important; }
.pat0		{ padding-top: 0 !important; }
.pat1		{ padding-top: 1em !important; }
.pat5		{ padding-top: 5px !important; }
.pat10	{ padding-top: 10px !important; }
.pat15	{ padding-top: 15px !important; }
.pat20	{ padding-top: 20px !important; }
.pat25	{ padding-top: 25px !important; }
.pat30	{ padding-top: 30px !important; }
.pat40	{ padding-top: 40px !important; }
.pat50	{ padding-top: 50px !important; }
.pab0		{ padding-bottom: 0 !important; }
.pab1		{ padding-bottom: 1em !important; }
.pab5		{ padding-bottom: 5px !important; }
.pab10	{ padding-bottom: 10px !important; }
.pab15	{ padding-bottom: 15px !important; }
.pab20	{ padding-bottom: 20px !important; }
.pab25	{ padding-bottom: 25px !important; }
.pab30	{ padding-bottom: 30px !important; }
.pab40	{ padding-bottom: 40px !important; }
.pab50	{ padding-bottom: 50px !important; }
.par0		{ padding-right: 0 !important; }
.par1		{ padding-right: 1em !important; }
.par10	{ padding-right: 10px !important; }
.par15	{ padding-right: 15px !important; }
.par20	{ padding-right: 20px !important; }
.par30	{ padding-right: 30px !important; }
.pal0		{ padding-left: 0 !important; }
.pal1		{ padding-left: 1em !important; }
.pal10	{ padding-left: 10px !important; }
.pal15	{ padding-left: 15px !important; }
.pal20	{ padding-left: 20px !important; }
.pal30	{ padding-left: 30px !important; }

.whAuto	{ width: auto !important; height: auto !important; }
.disN		{ display: none !important; }
.posA		{ position: absolute !important; }
.posR		{ position: relative !important; }
.fl			{ float: left !important; }
.fr			{ float: right !important; }
.b0			{ border: 0 !important; }
.tal		{ text-align: left !important; }
.tac		{ text-align: center !important; }
.tar		{ text-align: right !important; }
.fw			{ font-weight: bold !important; }
.fwn		{ font-weight: normal !important; }
.red		{ color: #d84e2d !important; }
.crim		{ color: #f00 !important; }
.hand		{ cursor: pointer !important; }

.ti			{ margin-left: 1em !important; text-indent: -1em !important; }
.ti1-1	{ margin-left: 1.1em !important; text-indent: -1.1em !important; }
.ti1-2	{ margin-left: 1.2em !important; text-indent: -1.2em !important; }
.ti1-3	{ margin-left: 1.3em !important; text-indent: -1.3em !important; }
.ti1-4	{ margin-left: 1.4em !important; text-indent: -1.4em !important; }
.ti1-5	{ margin-left: 1.5em !important; text-indent: -1.5em !important; }
.ti1-6	{ margin-left: 1.6em !important; text-indent: -1.6em !important; }
.ti1-7	{ margin-left: 1.7em !important; text-indent: -1.7em !important; }
.ti1-8	{ margin-left: 1.8em !important; text-indent: -1.8em !important; }
.ti1-9	{ margin-left: 1.9em !important; text-indent: -1.9em !important; }
.ti2		{ margin-left: 2em !important; text-indent: -2em !important; }

/*---------------------------------------------
Original Style master
-----------------------------------------------
Suggested propaty order: { box-sizing, content, display, position, top, right, bottom, left, z-index, float, clear, min-width, min-height, max-width, max-height, width, height, margin, padding, border, background, color, font-family, font-size, font-weight, text-align, text-decoration, text-indent, line-height, letter-spacing, vertical-align, visibility, white-space, cursor, opacity, transform, transition, overflow, and other propaty }
-----------------------------------------------
01. layout
02. header
03. footer
04. clearfix
---------------------------------------------*/

/*---------------------------------------------
01. layout
---------------------------------------------*/
*     { box-sizing: border-box; }
html  { -webkit-text-size-adjust: 100%; }
body  { font-size: 1.4rem; }
strong{ font-weight: bold; }
#wrap { min-width: 1320px; overflow-x: hidden; }
.inner{ width: 1280px; margin: 0 auto; }
.pc   { display: block; }
.sp   { display: none; }
img.pc{ display: inline-block; }
img.sp{ display: none; }

.main             { position: relative; margin-bottom: 90px; }
.main h1          { display: table; position: absolute; left: 0; bottom: -75px; width: 50%; height: 150px; padding-left: calc((100vw - 1294px) / 2); color: #fff; font-size: 4rem; font-weight: bold; line-height: 1.25; background: rgba(18, 70, 116, .9); }
@media (max-width: 1335px) {
.main h1          { padding: 0 21px; }
}
.main h1 span     { display: table-cell; vertical-align: middle; }
.main h1 span dfn { font-size: 2rem; font-weight: bold; }
.main figure img  { width: 100%; height: auto; }

.bread-list                { margin: 20px 0; letter-spacing: -.4em; }
.bread-list li             { display: inline-block; margin-right: 5px; letter-spacing: normal; }
.bread-list li:last-of-type{ margin-right: 0; }
.bread-list li a:after     { content: "/"; margin-left: 5px; }

.content { padding-bottom: 120px; }

.title-border         { position: relative; margin-bottom: 30px; padding-bottom: 20px; color: #215981; font-size: 3.4rem; font-weight: bold; text-align: center; line-height: 1.25; }
.title-border:after   { content: ""; position: absolute; bottom: 0; left: 50%; width: 30px; height: 1px; margin-left: -15px; background: #215981; }
.title-normal         { margin-bottom: 10px; color: #215981; font-size: 3rem; }
.title-bold           { margin-bottom: 10px; color: #215981; font-size: 4rem; font-weight: bold; }
.title-underline      { position: relative; padding: 15px; color: #215981; font-size: 2.2rem; font-weight: bold; }
.title-underline:after{ content: ""; position: absolute; bottom: 0; left: 50%; width: 40px; height: 1px; margin-left: -20px; background: #215981; }
.lead                 { padding-left: 30px; border-left: 1px solid #ededed; font-size: 1.8rem; line-height: 2; }

.col-2:after,
.col-3:after,
.col-4:after { content: ""; display: block; clear: both; height: 0; }
.col-2 > li  { float: left; width: calc((100% - 28px) / 2); margin: 28px 28px 0 0; }
.col-3 > li  { float: left; width: calc((100% - 56px) / 3); margin: 28px 28px 0 0; }
.col-4 > li  { float: left; width: calc((100% - 84px) / 4); margin: 28px 28px 0 0; }

.col-2 > li:nth-child(1),
.col-2 > li:nth-child(2),
.col-3 > li:nth-child(1),
.col-3 > li:nth-child(2),
.col-3 > li:nth-child(3),
.col-4 > li:nth-child(1),
.col-4 > li:nth-child(2),
.col-4 > li:nth-child(3),
.col-4 > li:nth-child(4) { margin-top: 0; }

.col-2 > li:nth-child(2n),
.col-3 > li:nth-child(3n),
.col-4 > li:nth-child(4n){ margin-right: 0; }

.blank::after { content: "\f08e"; position: relative; top: 0; margin-left: 10px; display: inline-block; font-family: "Font Awesome 5 Pro"; width: 14px; height: 18px; color: #215981; }

@media (max-width: 767px) {
body    { font-size: 1rem; }
#wrap   { min-width: initial; min-width: auto; }
.inner  { width: auto; padding: 0 20px; }
.pc     { display: none; }
.sp     { display: block; }
img.pc  { display: none; }
img.sp  { display: inline-block; }
main    { margin-top: 40px; }

.main      { margin-bottom: 20px; }
.main h1   { position: static; width: 100%; height: auto; min-height: 60px; padding: 10px 20px; font-size: 2rem; text-align: center; }

.bread-list{ margin: 20px 0; }
.content   { padding-bottom: 70px; }

.title-border         { margin-bottom: 15px; padding-bottom: 12px; font-size: 1.7rem; }
.title-border:after   { width: 15px; height: 1px; margin-left: -7px; }
.title-normal,
.title-bold           { margin-bottom: 15px; font-size: 2rem; }
.title-underline      { padding-bottom: 5px; font-size: 2rem; }
.title-underline:after{ width: 20px; margin-left: -10px; }
.lead                 { padding-left: 0; border-left: 0; font-size: 1.4rem; }

.col-2 > li,
.col-3 > li,
.col-4 > li             { float: none; width: auto; margin: 28px 0 0; }
.col-2 > li:first-child,
.col-3 > li:first-child,
.col-4 > li:first-child { margin-top: 0; }

.col-2 > li:nth-child(2),
.col-3 > li:nth-child(2),
.col-3 > li:nth-child(3),
.col-4 > li:nth-child(2),
.col-4 > li:nth-child(3),
.col-4 > li:nth-child(4){ margin-top: 28px; }

/*スマホ時メニューを開いたときに背景コンテンツ固定*/
.scroll-prevent { position: fixed; z-index: -1; width: 100%; height: 100%; }
}

/*---------------------------------------------
02. header
---------------------------------------------*/
header           { position: relative; padding-top: 30px; border: 0; background: #fff; font-size: 1.8rem; text-align: center;  border-bottom: 5px solid #E67504; }
.header-inner    { width: 1280px; margin: 0 auto; }
header .logo     { width: auto; height: auto; font-size: 3.4rem; font-weight: bold; letter-spacing: 4px; line-height: 1; text-align: left; }
header .logo img { width: 244px; height: auto; }
header .logo a   { color: #124674; }
header .logo a:hover { opacity: 1;}
header nav       { margin-top: 50px; font-weight: bold; }
header nav label,
header #menu-cb  { display: none; }
header #ham-menu                         { background: #001654; }
header #ham-menu > ul > li							 { display: inline-block; margin: 0 25px; }
header #ham-menu > ul > li a						 { display: block; color: #fff; padding: 25px 0 20px; }
header #ham-menu > ul > li.active a,
header #ham-menu > ul > li a:hover      { color: #E67504; opacity: 1; }

@media (max-width: 767px) {
header									{ position: fixed; width: 100%; height: 50px; z-index: 10; padding: 15px; font-size: 1.5rem; }
.header-inner						{ width: auto; }
header .logo						{ font-size: 1.8rem; letter-spacing: 2px; line-height: 1.4; text-align: left; }
header .logo img      { width: 157px; vertical-align: top; }
header #ham-menu				{ position: fixed; top: 0; right: -195px; z-index: 1000; background-color: #fff; width: 195px; height: 100%; padding: 70px 15px 0; transition: transform 0.3s ease-out 0s; }
header #menu-background { display: block; position: fixed; top: 0; right: 0; z-index: -1; width: 100%; height: 100%; background-color: #333; opacity: 0; transition: all 0.3s linear 0s; pointer-events: none; }
header #menu-icon				{ display: block; position: fixed; top: 4px; right: 0; z-index: 10000; width: 40px; height: 40px; line-height: 40px; cursor: pointer; }
header #menu-cb:checked ~ #ham-menu				{ transform: translate(-195px); }
header #menu-cb:checked ~ #menu-background{ opacity: 0.5; z-index: 999; pointer-events: auto; }

header #menu-icon span								{ display: inline-block; position: absolute; left: 5px; width: 20px; height: 1px; background-color: #124674; transition: all .4s; }
header #menu-icon span:nth-of-type(1)	{ top: 10px; }
header #menu-icon span:nth-of-type(2)	{ top: 19px; }
header #menu-icon span:nth-of-type(3)	{ top: 28px; }

header #menu-cb:checked ~ #menu-icon span:nth-of-type(1) { transform: translateY(9px) rotate(-315deg); }
header #menu-cb:checked ~ #menu-icon span:nth-of-type(2) { opacity: 0; }
header #menu-cb:checked ~ #menu-icon span:nth-of-type(3) { transform: translateY(-9px) rotate(315deg); }

header #ham-menu > ul > li							 { display: block; margin: 0 0 30px; }
header #ham-menu > ul > li:last-of-type  { position: static; }
header #ham-menu > ul > li a { color: #333; padding: 0; }
header #ham-menu > ul > li:last-of-type a { width: 165px; height: 35px; padding-top: 7px; color: #fff; background: #e5004f; }
}

/*---------------------------------------------
03. footer
---------------------------------------------*/
footer                   { padding: 40px 0 30px; background: #001654; color: #fff; text-align: center; }
footer .inner            { position: relative; }
footer dt                { font-size: 3rem; font-weight: bold; letter-spacing: 4px; line-height: 1; }
footer dt a              { color: #fff; }
/*footer dt img          { width: 300px; height: auto; }*/
footer dd			           { margin-top: 15px; line-height: 2; }
footer .sitelink         { display: inline-block; margin: 35px auto 0; }
footer .sitelink:after   { content: ""; display: block; clear: both; height: 0; }
footer ul                { float: left; border-right: 1px solid rgba(255, 255, 255, .3); }
footer ul:last-of-type   { border-right: 0; }
footer ul li             { display: inline-block; padding: 0 30px; border-right: 1px solid rgba(255, 255, 255, .3); font-weight: bold; }

/*iPadの縦横両方*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
footer ul li             { padding: 0 20px; }
}

footer ul li:last-of-type{ border-right: 0; }
footer ul li a           { color: #fff; }
footer small             { display: block; margin-top: 30px; padding-top: 30px; border-top: 1px solid rgba(255, 255, 255, .3); }
footer #pagetop          { position: absolute; top: -108px; right: 0; width: 70px; height: 70px; background: #001654; line-height: 70px; cursor: pointer; transition: all .3s; }
footer #pagetop:hover    { opacity: .6; }
footer #pagetop img      { vertical-align: middle; }
@media (max-width: 767px) {
footer             { padding-bottom: 15px; }
footer .inner      { padding: 0; }
footer dt          { font-size: 1.8rem; letter-spacing: 2px; }
/*footer dt img    { width: 150px; }*/
footer .sitelink   { margin-top: 0; }
footer ul          { float: none; margin-top: 20px; border-right: 0; }
footer ul li       { padding: 0 15px; }
footer address     { margin-top: 10px; }
footer small       { margin-top: 20px; padding-top: 15px; }
footer #pagetop    { top: -75px; right: 10px; width: 35px; height: 35px; line-height: 35px; }
footer #pagetop img{ width: 11px; }
}

/*---------------------------------------------
04. clearfix
---------------------------------------------*/
.clearfix:after,
header:after,
footer:after { content: ""; display: block; clear: both; height: 0; }