@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: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, 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: #000; outline: none; text-decoration: none; transition: all .3s; }
a:hover { /*text-decoration: underline;*/ opacity: 0.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
---------------------------------------------*/
@keyframes access-car {
	0%   { right: 0; }
	100% { right: 75px; }
}
@keyframes access-plane {
	0%   { top: -10px; right: 0; }
	100% { top: -17px; right: 57px; }
}
@keyframes fade {
	0%   { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes header-menu {
	0%   { margin-left: 150px; opacity: 0; }
	100% { margin-left: 0; opacity: 1; }
}
/*---------------------------------------------
01. layout
---------------------------------------------*/
*								{ box-sizing: border-box; }
html						{ -webkit-text-size-adjust: 100%; }
html.night			{ background-color: #031128; color: #fff; }
body						{ font-size: 1.4rem; }
#wrap						{ min-width: 1210px; overflow-x: hidden; }
.inner					{ width: 1170px; margin: 0 auto; }
.pc							{ display: block; }
.sp							{ display: none; }
img.pc					{ display: inline-block; }
img.sp					{ display: none; }
.noon .noon,
.night .night		{ display: block; }
.noon img.noon,
.night img.night{ display: inline-block; }
.noon .night,
.night .noon		{ display: none; }

.mv							{ position: relative; }
.mv figure img	{ width: 100%; height: auto; }

h1				{ position: absolute; top: 50%; left: 0; width: 100%; color: #fff; font-family: 'Roboto', sans-serif; font-size: 4rem; font-weight: 500; text-align: center; transform: translateY(-50%); }
h1 span		{ display: block; font-family: 'Noto Sans JP', sans-serif; font-size: 1.8rem; font-weight: 400; }
h2				{ position: relative; padding: 80px 0 0 65px; font-family: 'Roboto', sans-serif; font-size: 4rem; font-weight: 400; line-height: 1; }
h2:before	{ content: ""; position: absolute; top: -10px; left: 30px; width: 2px; height: 105px; background: #2893de; transform: rotate(35deg); }
h2 span		{ display: block; margin-top: 10px; font-family: 'Noto Sans JP', sans-serif; font-size: 1.8rem; font-weight: 400; }

table										{ width: 100%; }
table caption						{ padding-bottom: 5px; font-family: 'Noto Sans JP', sans-serif; font-size: 1.8rem; font-weight: 700; }
table th								{ width: 13rem; padding: 10px 20px; border-bottom: 1px solid #ccc; background: #eee; text-align: center; vertical-align: middle; word-break: break-all; }
table td								{ padding: 10px 20px; border-bottom: 1px solid #ccc; vertical-align: middle; word-break: break-all; }
table tr:first-child th,
table tr:first-child td	{ border-top: 1px solid #ccc; }

.btn						{ display: inline-block; position: relative; height: 35px; margin-top: 2px; padding: 0 25px 0 10px; line-height: 30px; border: 2px solid #2893de; border-radius: 30px; background: #fffd5f; color: #2893de; font-family: 'Noto Sans JP', sans-serif; font-weight: 400; text-decoration: none !important; }
.btn:after			{ content: ""; position: absolute; top: 50%; right: 10px; width: 6px; height: 6px; margin-top: -4px; border-top: 2px solid #2893de; border-right: 2px solid #2893de; transform: rotate(45deg); }
.btn.back				{ padding: 0 10px 0 25px; }
.btn.back:after	{ left: 10px; transform: rotate(-135deg); }

#access-border			{ display: block; width: 100%; height: 170px; border: none; background: #2893de url("/assets/images/pattern_border.png") no-repeat 234px bottom; }
#access							{ position: relative; z-index: 1; padding-bottom: 90px; }
#access:before			{ content: ""; position: absolute; top: 0; right: 0; z-index: -1; width: 0; height: 0; border-style: solid; border-width: 0 377px 510px 0; border-color: transparent rgba(54, 144, 206, 0.6) transparent transparent; }
#access h2					{ margin-bottom: 75px; }
#access .googlemap	{ margin-top: 40px; text-align: center; }
#access .googlemap a{ display: inline-block; width: 293px; height: 45px; line-height: 40px; border: 2px solid #2893de; border-radius: 30px; background: #fffd5f; color: #2893de; font-family: 'Noto Sans JP', sans-serif; font-size: 1.8rem; font-weight: 400; }
#access .googlemap i{ margin-left: 5px; }
#access ul					{ margin-top: 60px; letter-spacing: -.4em; text-align: center; }
#access li					{ display: inline-block; position: relative; width: 178px; height: 178px; margin: 0 25px; border-radius: 50%; color: #fff; font-family: 'Noto Sans JP', sans-serif; font-size: 1.6rem; font-weight: 700; line-height: 1.25; letter-spacing: normal; cursor: pointer; transition: all .3s; }
#access li:after		{ content: ""; position: absolute; bottom: 20px; left: 50%; width: 10px; height: 10px; margin-left: -8px; border-top: 1px solid #fff; border-right: 1px solid #fff; transform: rotate(45deg); }
#access li:hover		{ opacity: 0.6; }
#access li#access_public{ padding-top: 34px; background: #3690ce; }
#access li#access_car		{ padding-top: 37px; background: #28b4a8; }
#access li#access_plane	{ padding-top: 26px; background: #34b0d4; }
#access li figure				{ margin-bottom: 7px; }

#access .ptn				{ position: absolute; top: 94px; left: 50%; margin-left: 161px; }
#access .char				{ position: absolute; bottom: 0; left: 50%; margin-left: -808px; }
.night #access .char{ margin-left: -848px; }

.accessModal									{ height: 480px !important; padding: 50px 70px; border-radius: 0 !important; color: #000; }
.tablet .accessModal					{ padding: 30px 50px; }
.accessModal h3								{ position: relative; height: 40px; margin: 40px 0 20px; padding-left: 20px; color: #fff; font-family: 'Noto Sans JP', sans-serif; font-size: 2rem; font-weight: 700; line-height: 37px; }
.accessModal h3:first-child		{ margin-top: 0; }
.accessModal h3:before				{ content: ""; position: absolute; top: 0; left: 0; z-index: -1; width: 260px; height: 37px; }
.accessModal h3:after					{ content: ""; position: absolute; top: 0; left: 260px; z-index: -1; width: 0; height: 0; border-style: solid; border-width: 37px 0 0 17px; }
.tablet .accessModal h3				{ height: 39px; }
.tablet .accessModal h3:after	{ left: 259px; }
.accessModal h3 i							{ position: absolute; right: 0; }
.accessModal h4								{ margin-top: 20px; height: 35px; margin-bottom: 15px; padding: 0 20px; font-family: 'Noto Sans JP', sans-serif; font-size: 1.6rem; font-weight: 700; line-height: 35px; }

.accessModal .access-howto li						{ position: relative; margin-bottom: 20px; padding-left: 73px; font-size: 1.6rem; }
.accessModal .access-howto li:last-child{ margin-bottom: 0; }
.accessModal .access-howto li:after			{ content: ""; position: absolute; top: 4px; left: 44px; z-index: 1000; width: 16px; height: 16px; transform: rotate(45deg); }
.accessModal .access-howto li:before		{ position: absolute; top: 0; left: 0; z-index: 1000; width: 52px; height: 23px; border-right: 0 !important; line-height: 23px; font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; font-size: 1.2rem; text-align: center; }
.accessModal .access-howto li:nth-of-type(1):before{ content: "ルート1"; }
.accessModal .access-howto li:nth-of-type(2):before{ content: "ルート2"; }
.accessModal .access-howto li em						{ font-weight: bold; }
.accessModal .access-howto li .arrow				{ display: inline-block; position: relative; width: 22px; height: 15px; margin: 0 5px; }
.accessModal .access-howto li .arrow:after	{ content: ""; position: absolute; top: 50%; left: 0; width: 15px; height: 2px; background: #000; }
.accessModal .access-howto li .arrow:before	{ content: ""; position: absolute; top: 50%; right: 3px; width: 10px; height: 10px; margin-top: -5px; border-top: 2px solid #000; border-right: 2px solid #000; transform: rotate(45deg); }
.accessModal .attention	{ margin-left: 1em; text-indent: -1em; color: #c00; font-size: 1.4rem; font-weight: bold; }
/*
.accessModal .access-list			{ margin-top: 15px; letter-spacing: -.4em; }
.accessModal .access-list li		{ display: inline-block; position: relative; width: 33%; margin-bottom: 5px; padding-left: 13px; letter-spacing: normal; }
.accessModal .access-list li:before	{ content: ""; position: absolute; top: 50%; left: 0; margin-top: -3px; width: 5px; height: 5px; border-radius: 50%; background: #ccc; }
.accessModal .access-list li a		{ display: block; position: relative; }
.accessModal .access-list li a[target="_blank"]:after{ content: "\f14c"; margin-left: 5px; color: #333; font-family: "Font Awesome 5 Pro"; }
*/
.accessModal .close					{ position: absolute; top: -20px; right: -40px; width: 20px; height: 20px; cursor: pointer; }
.accessModal .close:before	{ content: ""; position: absolute; top: 7px; right: 0; width: 19px; height: 2px; background: #000; transform: rotate(45deg); }
.accessModal .close:after		{ content: ""; position: absolute; top: 7px; right: 0; width: 19px; height: 2px; background: #000; transform: rotate(-45deg); }

#access-group01 h3				{ border-bottom: 3px solid #3690ce; }
#access-group02 h3				{ border-bottom: 3px solid #28b4a8; }
#access-group03 h3				{ border-bottom: 3px solid #34b0d4; }
#access-group01 h3 i			{ bottom: 0; animation: access-car 1s ease-out .5s forwards; }
#access-group02 h3 i			{ top: 0; animation: access-car 1s ease-out .5s forwards; }
#access-group03 h3 i			{ top: -10px; animation: access-plane 1s ease-out .5s forwards; }
#access-group01 h3:before	{ width: 320px; background: #3690ce; }
#access-group02 h3:before	{ background: #28b4a8; }
#access-group03 h3:before	{ background: #34b0d4; }
#access-group01 h3:after	{ left: 320px; border-color: transparent transparent transparent #3690ce; }
#access-group02 h3:after	{ border-color: transparent transparent transparent #28b4a8; }
#access-group03 h3:after	{ border-color: transparent transparent transparent #34b0d4; }
#access-group01 h4				{ background: #e1f3f9; color: #3690ce; }
#access-group02 h4				{ background: #dff4f2; color: #28b4a8; }
#access-group03 h4				{ background: #e1f3f9; color: #34b0d4; }
#access-group01 li:after	{ border-top: 1px solid #3690ce; border-right: 1px solid #3690ce; }
#access-group02 li:after	{ border-top: 1px solid #28b4a8; border-right: 1px solid #28b4a8; }
#access-group03 li:after	{ border-top: 1px solid #34b0d4; border-right: 1px solid #34b0d4; }
#access-group01 li:before	{ border: 1px solid #3690ce; color: #3690ce; }
#access-group02 li:before	{ border: 1px solid #28b4a8; color: #28b4a8; }
#access-group03 li:before	{ border: 1px solid #34b0d4; color: #34b0d4; }
#access-group01 .attention{ margin: 10px 0 0 88px; }

@media (max-width: 767px) {
.main		{ margin-top: 60px; }
#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; }

h1				{ margin-top: 30px; line-height: 1.25; }
h1 span		{ margin-top: 5px; }
h2				{ padding: 40px 0 0 40px; font-size: 3rem; }
h2:before	{ top: -6px; left: 20px; height: 63px; }
h2 span		{ margin-top: 10px; font-size: 1.6rem; }

table th	{ width: 9rem; padding: 10px; }
table td	{ padding: 10px; }

#access-border							{ height: 90px; background-position: 20px bottom; background-size: 180px auto; }
#access											{ padding-bottom: 115px; }
#access:before							{ border-width: 0 146px 172px 0; }
#access:after								{ content: ""; position: absolute; bottom: 0; right: 0; z-index: -1; width: 0; height: 0; border-style: solid; border-width: 0 0 335px 161px; border-color: transparent transparent rgba(54, 144, 206, 0.3) transparent; }
#access h2									{ margin-bottom: 30px; }
#access .googlemap					{ margin-top: 25px; }
#access .googlemap a				{ width: 219px; height: 50px; line-height: 42px; border-radius: 30px; font-size: 1.4rem; }
#access iframe							{ width: 100%; height: 335px; }
#access ul									{ margin-top: 35px; }
#access li									{ width: 105px; height: 105px; margin: 0 4px; font-size: 1rem; line-height: 1.35; }
#access li:after						{ bottom: 12px; width: 7px; height: 7px; margin-left: -6px; }
#access li:first-child			{ margin-left: 0; }
#access lilast-child				{ margin-right: 0; }
#access li#access_public		{ padding-top: 17px; }
#access li#access_car				{ padding-top: 18px; }
#access li#access_plane			{ padding-top: 13px; }
#access li figure						{ margin-bottom: 5px; }
#access li#access_public img{ width: 49px; height: auto; }
#access li#access_car img		{ width: 28px; height: auto; }
#access li#access_plane img	{ width: 58px; height: auto; }
#access .ptn								{ display: none; }
#access .char								{ left: 40px; margin-left: 0; }
#access .char img						{ width: 50%; }
.night #access .char				{ left: 25px; margin-left: 0; }

.accessModal									{ height: 90% !important; padding: 0; box-shadow: none !important; }
.accessModal-inner						{ padding: 30px 25px 20px; overflow-y: auto; }
.accessModal:after						{ content: none; }
.accessModal .iziModal-content{ padding: 0 !important; } /* top.cssにも記述すること */
.accessModal h3								{ height: auto; padding: 5px 15px; border-bottom: 0 !important; font-size: 1.6rem; line-height: 1.5; }
.accessModal h3:before,
.accessModal h3:after					{ content: none; }
.accessModal h3 i							{ display: none; }
.accessModal h4								{ margin-top: 20px; height: auto; padding: 5px 15px; font-size: 1.4rem; line-height: 1.5; }
.accessModal dl:after					{ content: none !important; }
.accessModal dt								{ margin: 20px 0 5px !important; padding: 30px 0 0; }
.accessModal dd								{ padding-left: 0; font-size: 1.4rem; }
.accessModal .access-list			{ margin-top: 10px; }
.accessModal .access-list li	{ display: block; width: auto; margin-bottom: 5px; }
.accessModal .close						{ top: 7px !important; right: 5px !important; }

#access-group01 h3	{ background: #3690ce; }
#access-group02 h3	{ background: #28b4a8; }
#access-group03 h3	{ background: #34b0d4; }

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

/*---------------------------------------------
02. header
---------------------------------------------*/
header									{ height: 100px; background: rgba(255, 255, 255, 0.85); font-size: 1.1rem; }
header #google_translate{ position: fixed; top: 0; right: 0; z-index: 10; }
.header-inner						{ width: 1130px; margin: 0 auto; }
header .logo						{ float: left; width: 300px; margin-top: 26px; }
header .logo img				{ width: 100%; height: auto; }
header nav							{ float: right; width: 780px; font-weight: bold; }
header nav label,
header #menu-cb					{ display: none; }
header #ham-menu > ul:after							{ content: ""; clear: both; display: block; height: 0; }
header #ham-menu > ul > li							{ position: relative; float: left; width: 16.66%; text-align: center; }
header #ham-menu > ul > li:before				{ content: ""; position: absolute; top: 20px; left: 0; width: 1px; height: 60px; background: #5799c3; transform: skewX(-35deg); }
header #ham-menu > ul > li.active + li:before,
header #ham-menu > ul > li.active:before{ content: none; }
header #ham-menu > ul > li a						{ display: block; height: 100px; padding-top: 18px; color: #00649e; line-height: 1.25; transform: skewX(-35deg); transition: all 0s; overflow: hidden; }
header #ham-menu > ul > li.active a			{ background: #00649e; color: #fff; }
header #ham-menu > ul > li.active a img	{ visibility: hidden; }
header #ham-menu > ul > li a span				{ display: block; margin-left: -24px; transform: skewX(35deg); }
header #ham-menu > ul > li a figure			{ position: relative; margin-bottom: 10px; transform: scale(0.81); }
header #ham-menu > ul > li.no-link a		{ pointer-events: none; }
header #ham-menu > ul > li.no-link span	{ opacity: 0.2; }
header #ham-menu > ul > li:nth-child(2) a figure{ left: 7px; background: url("/assets/images/i_event_cr.png") no-repeat center 0; }
header #ham-menu > ul > li:nth-child(3) a figure,
header #ham-menu > ul > li:nth-child(4) a figure{ left: 7px; margin-bottom: 8px; background: url("/assets/images/i_floor_cr.png") no-repeat center 0; }
header #ham-menu > ul > li:nth-child(5) a figure{ top: -2px; left: 7px; margin-bottom: 0; background: url("/assets/images/i_history_cr.png") no-repeat center 0; }
header #ham-menu > ul > li:nth-child(6) a figure{ top: 2px; left: 3px; margin-bottom: 7px; background: url("/assets/images/i_fee_cr.png") no-repeat center 0; }
header #ham-menu > ul > li:nth-child(7) a figure,
header #ham-menu > ul > li:nth-child(8) a figure{ top: 3px; margin-bottom: 13px; background: url("/assets/images/i_news_cr.png") no-repeat center 0; }
header #ham-menu > ul > li:nth-child(9) a figure{ top: 6px; }
header .only-toppage	{ display: none; }
header .only-2ndpage	{ display: block; }
header .sns-area			{ display: none; }

@media (max-width: 767px) {
header									{ position: fixed; width: 100%; height: 60px; z-index: 10; padding: 8px; background: #fff; }
header #google_translate{ position: absolute; top: 16px; right: 73px; }
.header-inner						{ width: auto; }
header .logo						{ float: none; width: auto; margin-top: 8px; }
header .logo img				{ width: 160px; }
header nav							{ float: none; width: auto; }
header #ham-menu				{ position: fixed; top: 0; right: -100%; z-index: 1000; background-color: #00649e; width: 100%; height: 100%; padding: 10px 40px; transition: transform 0.3s ease-out 0s; }
header #menu-icon				{ display: block; position: fixed; top: 0; right: 0; z-index: 10000; width: 60px; height: 60px; line-height: 60px; background-color: #00649e; cursor: pointer; }
header #menu-cb:checked ~ #ham-menu				{ transform: translate(-100%); }
header #menu-cb:checked ~ #menu-background{ opacity: 0.5; z-index: 999; }

header #menu-icon span								{ display: inline-block; position: absolute; left: 18px; width: 25px; height: 2px; background-color: #fff; transition: all .4s; }
header #menu-icon span:nth-of-type(1)	{ top: 18px; }
header #menu-icon span:nth-of-type(2)	{ top: 29px; }
header #menu-icon span:nth-of-type(3)	{ top: 40px; }

header #menu-cb:checked ~ #menu-icon span:nth-of-type(1) { transform: translateY(11px) 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(-11px) rotate(315deg); }

header #ham-menu > ul									{ position: absolute; top: 50%; left: 0; width: 100%; transform: translateY(-50%); }
header #ham-menu > ul > li						{ float: none; width: auto; margin-bottom: 35px; font-size: 1.9rem; opacity: 0; }
header #ham-menu > ul > li:last-child	{ margin-bottom: 0; }
header #ham-menu > ul > li:before			{ content: none; }
header #ham-menu > ul > li a					{ height: auto; padding-top: 0; border-left: 0; color: #fff; transform: skewX(0); }
header #ham-menu > ul > li.active a		{ background: none; }
header #ham-menu > ul > li a span			{ margin-left: 0 !important; transform: skewX(0); }
header #ham-menu > ul > li a figure		{ display: none; }

header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(1){ animation: header-menu 0.3s ease-out 0.3s forwards; }
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(2){ animation: header-menu 0.3s ease-out 0.35s forwards; }
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(3),
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(4){ animation: header-menu 0.3s ease-out 0.4s forwards; }
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(5){ animation: header-menu 0.3s ease-out 0.45s forwards; }
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(6){ animation: header-menu 0.3s ease-out 0.5s forwards; }
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(7),
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(8){ animation: header-menu 0.3s ease-out 0.55s forwards; }
header #menu-cb:checked ~ #ham-menu > ul > li:nth-of-type(9){ animation: header-menu 0.3s ease-out 0.6s forwards; }

header .sns-area															{ display: block; position: absolute; top: 50%; right: 12px; margin-top: -80px; text-align: center; opacity: 0; transform: translateY(-50%); }
header .sns-area > ul > li:not(:last-child)		{ margin-bottom: 30px; }
header .sns-area > ul > li img								{ width: 35px; }
header #menu-cb:checked ~ #ham-menu .sns-area	{ animation: fade 0.75s ease-out 0.75s forwards; }

.night header{ background: #d9dcdf; }
}

/*---------------------------------------------
03. footer
---------------------------------------------*/
footer												{ position: relative; z-index: 3; padding: 50px 0 40px; background: rgba(54, 144, 206, 0.8); color: #fff; }
footer:after									{ position: absolute; bottom: 0; right: 0; width: 569px; height: 1200px !important; background: url("/assets/images/bg_footer.png") no-repeat right bottom; background-size: 100%; pointer-events: none; /*border-style: solid; border-width: 0 0 1260px 605px; border-color: transparent transparent rgba(54, 144, 206, 0.3) transparent;*/ }
_:lang(x)::-ms-backdrop, footer:after	{ background-size: 100.5%; } /* IE11 */
footer > .inner								{ position: relative; z-index: 2; }
footer > .inner > dl					{ float: left; padding-right: 20px; }
footer > .inner > dl dt				{ position: relative; top: -7px; width: 320px; margin-bottom: 20px; font-family: 'Noto Sans JP', sans-serif; font-size: 1.6rem; font-weight: 400; vertical-align: top; }
footer > .inner > dl dt em    { margin-right: .5em; font-size: 2.2rem; }
footer > .inner > dl dt strong{ /*display: block;*/ font-family: 'Roboto', sans-serif; font-size: 2.4rem; font-weight: 500; letter-spacing: 5px; }
footer > .inner > dl dd				{ line-height: 1.75; vertical-align: top; }
footer > .inner > ul					{ float: left; padding: 0 20px; border-left: 1px solid rgba(255, 255, 255, 0.5); }
footer > .inner > ul > li			{ margin-bottom: 20px; font-size: 1.6rem; }
footer > .inner > ul > li dd	{ margin: 5px 0 0 20px; font-size: 1.4rem; }
footer a											{ color: #fff; }
footer a[href$=".pdf"]:after	{ content: "\f1c1"; margin-left: 5px; font-family: "Font Awesome 5 Pro"; }

/*
footer .residence			{ float: left; margin-right: 60px; }
footer .communication	{ position: relative; float: left; padding-left: 36px; letter-spacing: .05em; }
footer .communication:before{ content: ""; position: absolute; top: 0; left: 0; width: 1px; height: 100%; background: rgba(255, 255, 255, 0.5); }
*/
footer small					{ position: absolute; right: 20px; bottom: 5px; z-index: 10; color: #333; font-size: 1.2rem; }
footer #pagetop				{ position: fixed; bottom: 30px; right: 30px; z-index: 10; width: 120px; height: 120px; cursor: pointer; transition: all .3s; }
footer #pagetop:hover	{ opacity: 0.85; }
footer #pagetop img		{ width: 100%; height: auto; }

footer .sns-area				{ position: fixed; top: 50%; right: 0; z-index: 3; padding: 20px 15px; background: rgba(0, 0, 0, 0.5); text-align: center; transform: translateY(-50%); }
footer .sns-area li:not(:last-child){ margin-bottom: 20px; }
footer .sns-area li a		{ display: block; }
footer .sns-area li img	{ width: 33px; height: auto; }

footer .sns-area2								{ margin-top: 15px; }
footer .sns-area2 ul:after			{ content: ""; clear: both; display: block; height: 0; }
footer .sns-area2 li						{ float: left; margin-right: 20px; }
footer .sns-area2 li:last-child	{ margin-right: 0; }
footer .sns-area2 li a					{ display: block; }
footer .sns-area2 li img				{ width: 36px; height: auto; }

@media (max-width: 767px) {
footer											{ padding: 50px 20px 0; font-size: 1.2rem; text-align: center; }
footer:after								{ content: none !important; }
footer > .inner							{ padding: 0; }
footer > .inner > dl				{ display: block; float: none; margin-bottom: 30px; padding: 0 0 30px; border-bottom: 1px solid rgba(255, 255, 255, 0.5); }
footer > .inner > dl dt			{ display: block; position: static; width: auto; font-size: 1.6rem; line-height: 1.4; }
footer > .inner > dl dd			{ display: block; padding-left: 0; border-left: 0; }

footer > .inner > ul									{ width: 50%; padding: 0; text-align: left; }
footer > .inner > ul:first-of-type		{ padding-right: 20px; border: 0; }
footer > .inner > ul:last-of-type			{ padding-left: 20px; }
footer > .inner > ul > li							{ margin-bottom: 15px; font-size: 1.2rem; }
footer > .inner > ul > li:last-of-type{ margin-bottom: 0; }
footer > .inner > ul > li dd					{ margin: 5px 0 0 14px; font-size: 1.1rem; }

footer address							{ padding-left: 0; border-left: 0; }
/*
footer .residence						{ float: none; margin: 25px 0 0; padding: 25px 0; border-top: 1px solid rgba(255, 255, 255, 0.5); }
footer .communication				{ float: none; margin-top: 10px; padding: 25px 0; border-top: 1px solid rgba(255, 255, 255, 0.5); line-height: 2.5; }
footer .communication:before{ content: none; }
*/
footer small					{ display: block; position: static; height: 45px; margin: 0 -20px; padding: 14px 0; background: #fff; text-align: center; }
footer #pagetop				{ bottom: 10px; right: 10px; width: 66px; height: 66px; }
footer #pagetop:hover	{ opacity: 1; }

footer .sns-area			{ position: static; margin-top: 25px; padding: 0; background: none; letter-spacing: -.4em; transform: translateY(0); }
footer .sns-area li:not(:last-child){ margin-bottom: 0; }
footer .sns-area li		{ display: inline-block; padding: 0 12px; letter-spacing: normal; }

footer > figure			{ margin: 50px -20px 0; }
footer > figure img	{ width: 100%; }
}

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