@charset "UTF-8";

@font-face {font-family: icomoon; src:
	url('../font/icomoon.woff2') format('woff2'),
	url('../font/icomoon.woff') format('woff');
}

:root {font-size: 14px;}
@media (min-width: 640px) {
	:root {font-size: 16px;}
}
html {-webkit-text-size-adjust: 100%;}
*, *::before, *::after {box-sizing: border-box;}

body {margin: 0; padding: 0; background: #fff; font-size: 1rem; line-height: 1.7; color: #333;}
body,
table,
pre {font-family: -apple-system, Meiryo, "Hiragino Kaku Gothic ProN", "Yu Gothic Medium", "游ゴシック Medium", sans-serif;
word-wrap: break-word; overflow-wrap: break-word;}
table {font-size: inherit;}
pre {white-space: pre-line;}

html,
body {scroll-padding-top: 60px;}
@media (min-width: 820px) {
	html,
	body {scroll-padding-top: 15px;}
}

/* link */
a {color: #0645ad; transition: color 0.2s; text-decoration: none;}
a:visited {color: #421b8c;}
a:hover {color: #5192c8; transition: color 0.2s; text-decoration: underline;}

hr {border: 0; height: 1px; margin: 2em 0; background-color: #adb4b9;}

/* img */
img {max-width: 100%; height: auto; vertical-align: middle; border: none;}
.img_a {margin: 1.5em 0; text-align: center; border: solid 1px #bfc5c9; padding: 3%}
.img_a p {text-align: left;}
.img_a pre {text-align: left;}
hr + .img_a {margin-top: 4em;}
br + .img_a {margin-top: 1em;}
.img_a + p.img_cap {margin-top: -1em; margin-bottom: 2em;}
@media (min-width: 640px) {
	.img_a {padding: 1.5em}
}

h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child,
p:first-child,
ul:first-child, li:first-child, ol:first-child, dl:first-child,
.img_a:first-child {margin-top: 0;}

br + p, br + ul, br + ol, br + dl,
br + p[class*="ti_"],
br + ul[class*="ul_"],
br + ol[class*="ol_"],
br + dl[class*="dl_"] {margin-top: 0.5em;}
br + .img_a {margin-top: 1em;}

p:last-child,
ul:last-child, li:last-child, ol:last-child, dl:last-child, .img_a:last-child {margin-bottom: 0;}

/* h */
h1 {font-size: 125%; line-height: normal; margin-bottom: 1em;}
h2 {font-size: 110%; margin-top: 2em; margin-bottom: 1.5em; line-height: normal;}
h3 {font-size: 105%; margin-top: 2em; margin-bottom: 1.5em; line-height: normal;}
h4 {font-size: inherit; margin-top: 2em; margin-bottom: 1em; line-height: normal;}
h5, h6 {font-size: inherit; line-height: normal; margin-bottom: 0.5em;}
@media (min-width: 640px) {
	h1 {font-size: 160%;}
	h2 {font-size: 130%;}
	h3 {font-size: 115%;}
	h4 {font-size: 105%;}
}

h1 > i {font-size: 1rem; font-style: normal;}
.h2_a {border-bottom: solid 2px #adb4b9; padding-bottom: 0.3em; position: relative;}
.h2_a::before {content: ""; width: 33%; height: 2px; left: 0; bottom: -2px; position: absolute; background-color: #0071c5;}
.h2_a.d_f {justify-content: space-between; align-items: center;}
.h2_a.d_f i {font-size: 0.9rem; background-color: #333; color: #fff; line-height: 1; padding: 0.4em 0.5em 0.3em 0.5em; font-style: normal; font-weight: normal; flex-shrink: 0;}

.hd_a {position: relative; padding-left: 0.7em; margin-bottom: 1.3em; font-size: 105%;}
.hd_a::before {content: ""; border-left: solid 3px #0071c5; display: inline-block; height: 100%; position: absolute; left: 0; top: 0;}
.hd_b {border-bottom: solid 1px #adb4b9; padding-bottom: 0.4em;}

h1::first-letter,
h2::first-letter,
h3::first-letter,
h4::first-letter,
h5::first-letter,
ul:not(.ti_a) > li::first-letter,
ol > li::first-letter,
dt::first-letter,
dd::first-letter,
ul[class*="icon_link"] li::first-letter {font-feature-settings: "palt";}


[class*="box_"] + h2,
[class*="box_"] + h3,
[class*="box_"] + h4,
[class*="box_"] + h5,
[class*="box_"] + h6,
[class*="img_"] + h2,
[class*="img_"] + h3,
[class*="img_"] + h4,
[class*="img_"] + h5,
[class*="img_"] + h6 {margin-top: 3em;}



/* layout */
.inner,
.container {max-width: 1200px; margin: 0 auto;}
.inner {padding: 10px 3%;}
header .inner {height: 70px; display: flex; justify-content: space-between; align-items: center; line-height: 1.4;}
main > .inner {padding-top: 30px; padding-bottom: 30px;}
main > .inner:only-child {padding-bottom: 80px;}
main > .inner.att_guide {border-top: solid 1px #bfc5c9; padding-top: 20px; padding-bottom: 20px; margin-top: 100px;}
body[class*="ctg_"] .main {max-width: 840px;}

@media (min-width: 640px) {
	header .inner {padding: 10px 20px; height: 80px;}
	footer .inner {padding: 20px 20px;}
	main > .inner {padding-left: 20px; padding-right: 20px;}
}
@media (min-width: 820px) {
	.container {display: flex; padding: 40px 20px 30px; justify-content: space-between; /* sticky */ align-items: flex-start; min-height: calc(100svh - 19em);}
	main {width: 100%; align-self: stretch;}
	.container main {display: flex; flex-direction: column; align-items: stretch; justify-content: space-between;}
	main .inner {padding: 0; width: 100%;}
	.nav_menu {width: 40%; max-width: 280px; min-width: 180px; font-size: 90%; margin-bottom: 50px; /* sticky*/ position: sticky; top: 0;}
	body[class*="ctg_"] .nav_menu {margin-left: 40px;}
	main .inner.att_guide {padding-bottom: 0; width: 100%;}
}
@media (-ms-high-contrast: none) and (min-width: 820px) {
	.nav_menu {width: 280px; min-width: 280px;}
}

/* header footer */
header a,
footer a {color: #333; text-decoration: none;}
header a:visited,
footer a:visited {color: #333;}

header p {margin: 0;}
header p.guide a {display: flex; align-items: center; position: relative; line-height: 1.3; gap: 5px;}
header p.guide a::before,
header p.guide a::after {content: ""; margin-top: 5px; width: 32px; min-width: 32px; height: 47px; background: url(../image/icon_home.svg) left center / cover no-repeat;}
header p.guide a::after {position: absolute; top: 0; left: 0; background-position: right; opacity: 0;}
header p.guide a:hover::after {opacity: 1; transition: all 0.2s;}
header p.guide a:hover {text-decoration: none; color: #167ac6;}
header p.guide span.item {margin-top: 3px;}
header p.guide span > span {display: inline-block}
header p.logo {margin-left: 10px; max-width: 120px; min-width: 120px;}
i.ver {display: inline-block; font-size: 60%; vertical-align: 0.25em; color: #fff; background-color: #444; line-height: 1; padding: 0.3em 0.3em 0.2em; font-style: normal; font-weight: normal;}

footer {font-size: 85%; border-top: solid 1px #bbb;}
footer ul {list-style: none; margin: 1em 0; padding: 0; display: flex; flex-wrap: wrap; line-height: 1;}
footer ul li {border-right: 1px solid #999; padding: 0 0.75em 0 0; margin: 0.5em 0.75em 0.5em 0;}
footer ul li:first-child {margin-top: 0.5em;}
footer ul li:last-child {border: none; padding-left: 0 1em;}
footer p.copy {margin-bottom: 1em;}
@media (min-width: 640px) {
	body.index footer {border-top: none;}
}


#anc_top > p {position: fixed; right: 2%; bottom: 15px; z-index: 10; margin: 0;}
#anc_top a {display: flex;  width: 3rem; height: 3rem; background-color: rgba(55,64,70,0.6); border-radius: 50%; overflow: hidden; padding-left: 100%; position: relative; transition: all 0.2s;}
#anc_top a:hover {background-color: #0071c5; transition: all 0.2s;}
#anc_top a::before {content: ""; display: block; width: 0.9rem; height: 0.9rem; border: solid #fff; border-width: 3px 0 0 3px; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: calc(50% - 5px); left: calc(50% - 7px);}
html[data-script-enabled="true"] #anc_top {opacity: 0; transition: all 1s; bottom: -50px;}
html[data-script-enabled="true"] #anc_top.true {opacity: 1; transition: all 1s; bottom: 15px;}

/* glibal-navi */
#nav_gl {background-color: #0071c5; border-top: solid 1px #0071c5;}
#nav_gl > ul {font-size: 2vw; max-width: 1200px; margin: 0 auto; padding: 0; font-feature-settings: "palt"; letter-spacing: 0.05em; display: flex; line-height: 1.2; list-style: none;}
#nav_gl > ul > li {flex: 1; min-height: 3.5em; margin: 0; position: relative;}
#nav_gl > ul > li::after {content: ""; position: absolute; top: 0; right: 0; width: 0; height: 100%; border-right: solid 1px #fff;}
#nav_gl > ul > li:first-child::before {content: ""; position: absolute; top: 0; left: 0; width: 0; height: 100%; border-left: solid 1px #fff; z-index: 2;}
#nav_gl > ul > li:first-child::before,
#nav_gl > ul > li:last-child::after {display: none;}
#nav_gl a {display: block; position: relative; height: 100%; color: #fff; padding: 2.8rem 0.4em 0.4em; text-decoration: none; text-align: center; background-color: #0071c5;}
#nav_gl a > span {display: flex; flex-wrap: wrap; min-height: 2em; align-items: center; justify-content: center;}
@media (-ms-high-contrast: none) {
	#nav_gl a > span {height: 2.5em;}
}
#nav_gl a > span > span > span {display: inline-block;}
#nav_gl a::before,
#nav_gl a::after {content: ""; width: 26px; height: 26px; margin-left: -13px; position: absolute; left: 50%; top: 7px; background: center bottom / cover no-repeat;}
#nav_gl a::before {background-position: center top;}
#nav_gl li:nth-child(1) a::before,
#nav_gl li:nth-child(1) a::after {background-image: url(../image/icon_01.svg);}
#nav_gl li:nth-child(2) a::before,
#nav_gl li:nth-child(2) a::after {background-image: url(../image/icon_02.svg);}
#nav_gl li:nth-child(3) a::before,
#nav_gl li:nth-child(3) a::after {background-image: url(../image/icon_03.svg);}
#nav_gl li:nth-child(4) a::before,
#nav_gl li:nth-child(4) a::after {background-image: url(../image/icon_04.svg);}
#nav_gl li:nth-child(5) a::before,
#nav_gl li:nth-child(5) a::after {background-image: url(../image/icon_05.svg);}
#nav_gl a:hover {background-color: #5192c8; transition: all 0.2s;}

@media (min-width: 640px) {
	#nav_gl > ul {font-size: 90%;}
	#nav_gl a {padding-top: 3.2em}
	#nav_gl a::before,
	#nav_gl a::after {width: 38px; height: 38px; margin-left: -19px;}
}
@media (min-width: 1200px) {
	#nav_gl > ul {font-size: inherit;}
	#nav_gl > ul > li:first-child::before,
	#nav_gl > ul > li:last-child::after {display: block;}
	#nav_gl a::before,
	#nav_gl a::after {top: 0.6em;}
}

body.ctg_01 #nav_gl .ctg_01 a,
body.ctg_02 #nav_gl .ctg_02 a,
body.ctg_03 #nav_gl .ctg_03 a,
body.ctg_04 #nav_gl .ctg_04 a,
body.ctg_05 #nav_gl .ctg_05 a {background-color: #fff; color: #0071c5;}
body.ctg_01 #nav_gl .ctg_01 a::after,
body.ctg_02 #nav_gl .ctg_02 a::after,
body.ctg_03 #nav_gl .ctg_03 a::after,
body.ctg_04 #nav_gl .ctg_04 a::after,
body.ctg_05 #nav_gl .ctg_05 a::after {display: none;}

@media (max-width: 819px) {
	#nav_gl > ul > li {min-height: 40px;}
	#nav_gl.stic a {padding: 0;}
	#nav_gl.stic a::before,
	#nav_gl.stic a::after {width: 24px; height: 24px; top: 7px; margin-left: -12px;}
	#nav_gl.stic a > span {display: none;}
	#nav_gl.stic { position: fixed; width: 100%; opacity: 0; z-index: 99; top: 0;}
	#nav_gl.stic.ani { animation: 0.5s ease-in 0s slidein; opacity: 1;}
	#nav_gl.ani2 { animation: 0.5s ease-in 0s slideout; opacity: 1;}

	@keyframes slidein {
		from { top: -100px; }
		to   { top: 0; }
	}
}

/* nav-menu */
.nav_menu dl {line-height: 1.4; font-feature-settings: "palt"; margin: 0; padding: 0;}
.nav_menu dd,
.nav_menu dt {margin: 0;}
.nav_menu [class*="ctg_"] > dd {display: none;}
.nav_menu a,
.nav_menu dt > span {display: flex; min-height: 3em; padding: 0.35em 3% 0.3em 3%;  padding-right: calc(3% + 1.5em); align-items: center; position: relative; text-decoration: none; color: inherit; cursor: pointer; overflow: hidden;}
.nav_menu dd dt {border-top: solid 1px #acb4b9;}
.nav_menu dd dd {border-top: solid 1px #cfd3d7;}
.nav_menu dt:not(.js_toggle) > span {min-height: 2.25em; cursor: default;}
.nav_menu [class*="ctg_"] > dt a::after,
.nav_menu dt.js_toggle > span::after,
.nav_menu dd a::after {content: "\e900"; font-family: "icomoon"; color: #0071c5; position: absolute; right: 3%; font-weight: normal;}
.nav_menu dd._sub a::before {content: "-"; margin-right: 0.4em;}
.nav_menu dt.js_toggle > span::after {content:"＋";}
.nav_menu dt.js_toggle._open > span::after {content:"－";}
.nav_menu dd div dd a {padding-left: calc(3% + 0.7em);}
.nav_menu dd dd a._current {background-color: #eceeef; pointer-events:none; color: #000;}
.nav_menu dd dd a._current::after {color: #ccc;}
html[data-script-enabled="true"] .nav_menu dt.js_toggle + div {display: none;}
/* ie */
@media (-ms-high-contrast: none) {
	.nav_menu a,
	.nav_menu dt.js_toggle span {height: 3.2em;}
}

@media (max-width: 819px) {
	.nav_menu [class*="ctg_"] > dt {border-top: solid 1px #fff;}
	.nav_menu [class*="ctg_"] > dt a {color: #fff; background-color: #0071c5; display: flex; align-items: center;}
	.nav_menu [class*="ctg_"] > dt a::after {color: #fff;}
	.nav_menu [class*="ctg_"] > dt a::before {content: ""; width: 1.8em; height: 1.8em; margin-right: 0.5em; background: center bottom / cover no-repeat;}
	.nav_menu .ctg_01 > dt a::before {background-image: url(../image/icon_01.svg);}
	.nav_menu .ctg_02 > dt a::before {background-image: url(../image/icon_02.svg);}
	.nav_menu .ctg_03 > dt a::before {background-image: url(../image/icon_03.svg);}
	.nav_menu .ctg_04 > dt a::before {background-image: url(../image/icon_04.svg);}
	.nav_menu .ctg_05 > dt a::before {background-image: url(../image/icon_05.svg);}
	.nav_menu dd dt.js_toggle {/* background-color: #e1ecf4; */ color: #000;}
}

@media (min-width: 820px) {
	.nav_menu [class*="ctg_"] > dt a {justify-content: center; padding-right: 3%; color: #004170;}
	.nav_menu [class*="ctg_"] > dt a::after {display: none;}
	.nav_menu [class*="ctg_"] > dt {border-bottom: solid 1px #0071c5; font-size: 1rem; font-weight: bold;}
	.nav_menu [class*="ctg_"] > dd {max-height: calc(100svh - 9em); overflow-y: auto;}
	.nav_menu [class*="ctg_"] > dd::-webkit-scrollbar {width: 9px;}
	.nav_menu [class*="ctg_"] > dd::-webkit-scrollbar-track {background: #e6e6e6; box-shadow: 0 0 2px #999 inset }
	.nav_menu [class*="ctg_"] > dd::-webkit-scrollbar-thumb {background: #ccc;}
	.nav_menu [class*="ctg_"] > dd::-webkit-scrollbar-thumb:hover {background: #aaa;}
	.nav_menu [class*="ctg_"] > dd {scrollbar-width: thin; scrollbar-color: #e6e6e6 #ccc;}
	.nav_menu [class*="ctg_"] > dt a,
	.nav_menu dt {font-weight: bold;}
	.nav_menu dd dt {border-color: #0071c5;}
	.nav_menu dl dl {border-bottom: solid 1px #0071c5;}
	.nav_menu dd div dd a {padding-left: 1em;}
}

@media (min-width: 1360px) {
	.nav_menu [class*="ctg_"] > dd {max-height: calc(100svh - 6em);}
}

@media (-ms-high-contrast: none) and (min-width: 820px) {
	.nav_menu [class*="ctg_"] > dd {height: auto;}
}

body.ctg_01 .nav_menu .ctg_01 dd,
body.ctg_02 .nav_menu .ctg_02 dd,
body.ctg_03 .nav_menu .ctg_03 dd,
body.ctg_04 .nav_menu .ctg_04 dd,
body.ctg_05 .nav_menu .ctg_05 dd,
body.ctg_00 .nav_menu .ctg_00 dd {display: block;}

@media (min-width: 820px) {
	.nav_menu [class*="ctg_"] {display: none;}
	body.ctg_01 .nav_menu .ctg_01,
	body.ctg_02 .nav_menu .ctg_02,
	body.ctg_03 .nav_menu .ctg_03,
	body.ctg_04 .nav_menu .ctg_04,
	body.ctg_05 .nav_menu .ctg_05,
	body.ctg_00 .nav_menu .ctg_00 {display: block;}
}

/* ie */
@media (-ms-high-contrast: none) and (max-width: 639px) {
header,
footer,
#nav_gl,
.container {min-width: 640px;}
}


/* list */
ul,
ul.ul_b {padding-left: 1.5em; list-style: disc;}
ul > li::marker,
ul.ul_b > li::marker {color: #999;}
dt {margin-top: 1em; margin-bottom: 0.5em; font-weight: bold;}
dd {margin-left: 0;}
li {margin-top: 0.5em; margin-bottom: 0.5em}

ul ul {list-style: circle;}
ul.ul_a ul {list-style: disc;}
dl[class*="dl_"] > dt {font-weight: bold;}

/* burette */
ul.icon_link {list-style: none; padding-left: 1.5em;}
ul.icon_link a {text-decoration: none;}
ul.icon_link a:hover {text-decoration: underline;}
ul.icon_link > li {position: relative;}
ul.icon_link > li > a::before {position: absolute; top: 0.3em; left: -1.25em;}

a.icon_link::before,
ul.icon_link > li > a::before,
table.tbl_a th > a::before,
.icon_blank::after,
.icon_dl::after,
[class*="js_modal"]::after {content: "\e900"; font-family: "icomoon"; text-decoration: none; display: inline-block; overflow: hidden; width: 1em; height: 1em; line-height: 1; font-weight: normal; vertical-align: -0.2em;}

a.icon_link::before,
.icon_blank::after,
.icon_dl::after,
[class*="js_modal"]::after {margin: 0 0.1em;}

a.icon_link[href^="#"]::before,
ul.icon_link > li > a[href^="#"]::before {content: "\e901";}
.icon_blank::after {content: "\e902";}
.icon_dl::after {content: "\e904";}
[class*="js_modal"]::after {content: "\e903";}

ul.icon_link h3,
ul.icon_link h4 {margin-bottom: 0.5em;}

/* indent */
.ti_a {text-indent: -1.4em; padding-left: 1.4em; text-align: left;}
.ti_a .icon_link,
.ti_a .icon_blank,
.ti_a [class*="js_modal"]::after {text-indent: initial; padding-left: initial;}
p.ti_a + p.ti_a {margin-top: -0.5em;}
.ti_b {text-indent: -2.3em; padding-left: 2.3em; text-align: left;}
span[class*="ti_"] {display: block; margin-top: 0.75em; margin-bottom: 0.75em;}
ul[class*="ti_"],
div[class*="ti_"] {margin-top: 1em; margin-bottom: 1em;}
ul[class*="ti_"] {list-style: none;}

ul.ti_a > li,
div[class*="ti_"] > p,
ul > li > [class*="ti_"] {margin-top: 0.5em; margin-bottom: 0.5em;}
@media (min-width: 640px) {
	.ti_c {text-indent: -5em; padding-left: 5em; text-align: left;}
}

.ul_a,
.ol_a,
.dl_a,
.dl_b {list-style: none; margin: 1.5em 0;}
.dl_a > dt {margin-left: 1.3em;}

.ul_a > li,
.ol_a > li,
.dl_a > dt {position: relative;}
ul.ul_a > li::before,
.dl_a > dt::before {content: ""; position: absolute; border-radius: 100%; width: 6px; height: 6px; background-color: #0071c5; top: 0.65em; left: -1em;}

.ul_a > li:last-child > [class*="img_"]:last-child,
.ol_a > li:last-child > [class*="img_"]:last-child,
.dl_a > dd:last-child > [class*="img_"]:last-child {margin-bottom: 3em;}


@media (min-width: 640px) {
	dl.dl_a > dt,
	dl[class*="dl_"] > dd {margin-left: 1.5em;}
}

@media (max-width: 639px) {
	.dl_b > dd .dl_a {margin-left: 1em;}
}

ol.ol_a {list-style: none; margin: 1.5em 0; padding-left: 0; counter-reset: num_li;}
ol.ol_a > li {position: relative; margin-bottom: 1em;}
ol.ol_a > li:before {display: inline-block; width: 2em; font-weight: bold; white-space: nowrap;
	counter-increment: num_li;
	content: counter(num_li)".";
}

ol.ol_a._v_a > li:before {width: 2.3em; left: -2.3em; font-weight: normal; letter-spacing: -0.05em;
	content: "("counter(num_li)")"; font-weight: bold;
}

@media (min-width: 640px) {
	ol.ol_a {padding-left: 2em;}
	ol.ol_a > li:before {position: absolute; left: -2em;}
	ol.ol_a._v_a {padding-left: 2.3em;}
}

@media (max-width: 639px) {
	ol.ol_a ol.ol_a._v_a {padding-left: 0.75em;}
}

ol.ol_a[type="a"] { counter-reset: abc_li;}
ol.ol_a[type="a"] > li:before {
	counter-increment: abc_li;
	content: counter(abc_li, lower-alpha)".";
}

ol[start="3"] {counter-reset: num_li 2;}
ol[start="4"] {counter-reset: num_li 3;}
ol[start="5"] {counter-reset: num_li 4;}
ol[start="6"] {counter-reset: num_li 5;}
ol[start="7"] {counter-reset: num_li 6;}
ol[start="8"] {counter-reset: num_li 7;}
ol[start="9"] {counter-reset: num_li 8;}
ol[start="10"] {counter-reset: num_li 9;}
ol[start="11"] {counter-reset: num_li 10;}
ol[start="12"] {counter-reset: num_li 11;}
ol[start="13"] {counter-reset: num_li 12;}
ol[start="14"] {counter-reset: num_li 13;}
ol[start="15"] {counter-reset: num_li 14;}
ol[start="16"] {counter-reset: num_li 15;}
ol[start="17"] {counter-reset: num_li 16;}
ol[start="18"] {counter-reset: num_li 17;}
ol[start="19"] {counter-reset: num_li 18;}
ol[start="20"] {counter-reset: num_li 19;}
ol[start="21"] {counter-reset: num_li 20;}

/* table */
table[class*="tbl_"] {line-height: 1.6; position: relative; width: 100%; margin: 1.5em 0; border-spacing: 0; border-collapse: collapse; border: solid #adb4b9; border-width: 0 0 1px 1px;}
table[class*="tbl_"] th,
table[class*="tbl_"] td {vertical-align: top; padding: 0.5em; border: solid #adb4b9; border-width: 1px 1px 0 0;}
table[class*="tbl_"] tbody th {text-align: left;}
table[class*="tbl_"] th {background-color: #eceeef; font-weight: normal; color: #000;}
table[class*="tbl_"] th > a {display: flex; text-decoration: none; }
table[class*="tbl_"] th > a:hover {text-decoration: underline;}
table[class*="tbl_"] th > a::before {min-width: 1.2em; margin: 0.3em 0 0 -0.2em; }
table[class*="tbl_"] thead th {background-color: #cce4f5; text-align: center; vertical-align: middle;}

h4 + table {margin-top: 0.75em;}
br + table {margin-top: 0.75em;}
.box_a table:last-child {margin-bottom: 0;}

@media (min-width: 640px) {
	table.tbl_a th {width: 27%;}
	table.tbl_a thead th {width: auto;}
	table.ta_c td,
	table.ta_c th,
	table.ta_c tbody th,
	table.ta_c tbody td {text-align: center;}
}
@media (max-width: 639px) {
	table.tbl_a th,
	table.tbl_a td {display: block; width: 100%;}
	table.tbl_a thead tr > th {text-align: left;}
	table.tbl_a thead tr > th::before {content: "上段：";}
	table.tbl_a thead tr > th:last-child::before {content: "下段：";}
	table.tbl_a thead tr > th:last-child {background-color: transparent;}
}

table.tbl_b td ._td_a {display: flex;}
table.tbl_b td ._td_a > span:first-child {flex-shrink: 0;}

table > caption {text-align: left; margin-bottom: 0.3em; font-weight: bold; color: #666;}
@media (max-width: 640px) {
	[class*="sp_scl_"] table > caption {position: absolute; left: 0; top: -2em;}
}

@media (max-width: 640px) {
	[class*="sp_scl_"] {overflow-x: auto; position: relative; margin-bottom: 1.5em; padding-right: 1px;}
	[class*="sp_scl_"] > table {margin-top: 0; margin-bottom: 0;}
	.sp_scl_a > table {min-width: 640px;}
	.sp_scl_b > table {min-width: 440px;}
	[class*="sp_scl_"]::before {content: "スクロール →"; display: block; text-align: right; position: sticky; margin-bottom: 0.3em; width: 100%; left: 0; font-size: 87.5%; color: #666; font-feature-settings: "palt";}
}
@media (-ms-high-contrast: none) and (max-width: 640px) {
	[class*="sp_scl_"]::before {display: none;}
}

table.log {line-height: 1.2; text-align: center; border: solid 1px #bfc5c9; width: 100%; display: block; padding: 3%; overflow-y: auto;}
table.log tbody {display: table; margin: 0 auto;}
table.log td {padding: 0.3em; white-space: nowrap;}
table.log tr:last-child {font-size: smaller;}
table.log + table.log {margin-top: 1em;}
@media (min-width: 640px) {
	table.log {padding: 1.5em;}
}

table.log::-webkit-scrollbar {height: auto;}
table.log::-webkit-scrollbar-track {background-color: #e6e6e6;}
table.log::-webkit-scrollbar-thumb {background-color: #ccc;}
table.log::-webkit-scrollbar-thumb:hover {background-color: #aaa;}
table.log {scrollbar-width: auto; scrollbar-color: #e6e6e6 #ccc;}

/* box */
.box_a {padding: 4%; margin: 2em 0;}
.box_a,
.box_a::after {border: solid 1px #bfc5c9; background-color: #fff; position: relative;}
.box_a::after {content: ""; position: absolute; left: 0; top: 0; width: calc(100% + 2px); height: calc(100% + 2px); border-color: #98a2a8; z-index: -1;}
.box_a:first-child {margin-top: 0;}
.box_a .hd_b {font-size: inherit;}
.box_a > ul {padding-left: 1.3em;}
.box_a > ul ol {padding-left: 1em;}
@media (min-width: 640px) {
	.box_a {padding: 1.5em;}
	.box_a > ul ol {padding-left: 1.75em;}
}

/* layout */
@media (min-width: 640px) {
	[class*="pc_col_"] {display: flex; justify-content: space-between; flex-wrap: wrap;}
	.pc_col_2 > li,
	.pc_col_2 > .item {width: 47%;}
	[class*="pc_col_"] > li {margin-top: 0;}
}

/* arrow */
.arrow_a {position: relative; text-align: center; margin: 1em 0;}
.arrow_a::after {content: ""; position: absolute; border: solid transparent; border-width: 1.5em 2em 0; border-top-color: #0645ad; top: 0; left: 50%; margin-left: -2em; }

/* color */
/* .em_a {color: #004170;} */
.em_a {color: #009999; font-style: normal;}
.att_a {color: #aa0000;}

.c_red {color: #cc0000;}
.c_grn {color: #339900;}
.c_orn {color: #ff7700;}
.c_yel {color: #ffea00;}

/* index */
body.index main .inner {padding-top: 25px; padding-bottom: 25px;}

.index_mv {margin: 0 auto;}
.index_mv .mv_img {display: none;}
.index_mv h1 {font-size: 120%; margin: 0 auto 1em; display: flex; justify-content: center; align-items: center;}
.index_mv::before,
.index_mv h1::before {content: ""; height: 150px; width: 25%; max-width: 150px; min-width: 60px; background: url(../image/router.png) left center / contain no-repeat}
.index_mv p {margin: 0;}

.wrap_index {background-color: #b5d8f0;}
.index_a a {color: inherit; text-decoration: none; display: block; padding: 3%;}
.index_a h2 {margin: 0 0 10px; color: #167ac6; display: flex; align-items: center; font-size: 125%; line-height: 1.2;}
.index_a h2::before {content: ""; margin-right: 10px; height: 40px; width: 40px; min-width: 40px; background: left top /  cover no-repeat;}
.index_a h2.icon_01::before {background-image: url(../image/icon_01.svg)}
.index_a h2.icon_02::before {background-image: url(../image/icon_02.svg)}
.index_a h2.icon_03::before {background-image: url(../image/icon_03.svg)}
.index_a h2.icon_04::before {background-image: url(../image/icon_04.svg)}
.index_a h2.icon_05::before {background-image: url(../image/icon_05.svg)}
.index_a a:hover ul {color: #167ac6; transition: all 0.3s;}
.index_a > .item {background-color: #fff; margin: 0 0 15px; border-radius: 6px;}
.index_a > .item:first-child {margin-top: 0;}
.index_a > .item ul {margin: 0; padding: 0; list-style: none; line-height: 1.5;}
.index_a > .item ul li {margin: 0; display: inline;}
.index_a > .item ul li::after {content: " /"; opacity: 0.4; vertical-align: 0.1em;}
.index_a > .item ul li:last-child::after {content: "";}
.index_mv::before {display: none;}

@media (max-width: 639px) {
.index_a > .item:last-child {margin-bottom: 0;}
}

@media (min-width: 640px) {
	.index_a a {padding: 1.25em;}
	.index_mv h1 {font-size: 140%;}
	.index_a {display: flex; flex-wrap: wrap; justify-content: space-between;}
	.index_a .item {width: calc((100% - 20px) / 2); margin-bottom: 20px;}
}

@media (min-width: 820px) {
	body.index main .inner {padding-left: 20px; padding-right: 20px;}
	body.index main .wrap_index .inner {padding-bottom: 5px;}
	.index_mv h1 {display: block; margin-bottom: 0.5em;}
	.index_mv h1 br,
	.index_mv h1::before {display: none;}
	.index_mv {display: flex; justify-content: center; align-items: center;}
	.index_mv::before {display: block; height: 200px; width: 180px; min-width: 160px; max-width: none;}
}

@media (min-width: 1200px) {
	.index_a::after {content: ""; width: calc((100% - 40px) / 3); height: 0;}
	.index_a .item {width: calc((100% - 40px) / 3);}
	.index_a h2 {flex-direction: column; margin-bottom: 15px;}
	.index_a h2::before {margin: 0 0 10px;}
}

/* data */
[data-extra-enabled] [data-extra] { display: none; }
[data-extra-enabled="true"] [data-extra="true"],
[data-extra-enabled="false"] [data-extra="false"] { display: block; }

[data-window="modal"] #header,
[data-window="modal"] #nav_gl,
[data-window="modal"] #anc_top,
[data-window="modal"] footer,
[data-window="modal"] nav,
[data-window="modal"] .att_guide {
	display: none;
}

[data-window="modal"] body {
	margin-top: 0 !important;
}

[data-window="modal"] body[class*="ctg_"] .main {
	max-width: none;
}

/* modaal */
.modaal-inner {overflow: visible !important;}
.modaal-close {position: absolute !important; right: -5px !important; top: -60px !important;}

/* style module */
.fs_xxs {font-size: xx-small !important;}
.fs_xs {font-size: x-small !important;}
.fs_s {font-size: small !important;}
.fs_i {font-size: inherit !important;}
.fs_l {font-size: large !important;}
.fs_xl {font-size: x-large !important;}
.fs_xxl {font-size: xx-large !important;}

.fs_sm {font-size: smaller !important;}
.fs_lg {font-size: larger !important;}
.fw_b {font-weight: bold;}

.d_ib {display: inline-block !important;}
.d_f {display: flex !important;}
.d_n {display: none !important;}
.ta_c {text-align: center !important;}
.tl_f {table-layout: fixed !important;}
.va_m {vertical-align: middle !important;}
br.sp {display: none !important;}
.ffs_p {font-feature-settings: "palt";}
.ff_e {font-family: 'Courier New', Courier, Arial, monospace;}
.wb_ba {word-break: break-all;}
.bs_s {border: solid 1px #666;}
.lst_d {list-style-type: disc;}

.w_100 {width: 100% !important;}
.w_a {width: auto !important;}

.m_0 {margin: 0 !important;}
.mt_0 {margin-top: 0 !important;}
.mt_1em {margin-top: 1em !important;}
.mb_0 {margin-bottom: 0 !important;}
.mb_0 + * {margin-top: 0 !important;}
@media (min-width: 640px) {
	.pc_mt_0 {margin-top: 0 !important;}
	.pc_pl_5em {padding-left: 5em;}
}
@media (max-width: 639px) {
	br.sp {display: inline;}
	.sp_fs_xxs {font-size: 62.5% !important;}
	.sp_fs_xs {font-size: 75% !important;}
	.sp_fs_s {font-size: 87.5% !important;}
	.sp_fs_i {font-size: inherit !important;}
	.sp_fs_l {font-size: 112.5% !important;}
	.sp_fs_xl {font-size: 137.5% !important;}
	.sp_fs_xxl {font-size: 162.5% !important;}
}