@charset "UTF-8";



:root {--font-main: "BIZ UDPGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "メイリオ", Meiryo, sans-serif;}
:root {
	--c-text: #303336;
	--c-link: #176cff;
	--c-hover: #125AD7;
	--c-focus: #176cff;
	--c-visit: #6846CE;
	--c-active: #ff5500;
	--c-disabled: #afb3b6;

	--c-main: #176cff;
	--c-main-a: #e1ecff;
	--c-main-b: #176cff;
	--c-main-c: #125ad7;
	--c-red: #be0006;
	--c-red-b: #ED0008;
	--c-gry: #61676b;

	--bg-hover-a: #125ad7;
	--bg-hover-b: #e1ecff;

	--bg-main-a: #e1ecff;
	--bg-main-b: #176cff;
	--bg-main-c: #125ad7;
	--bg-sub-a: #f7faff;
	--bg-sub-b: #e1ecff;
	--bg-gry-a: #e6eaed;
	--bg-gry-b: #c9cccf;
	--bg-gry-c: #798086;
	--bg-blk-a: #303336;
	--bg-blk-b: #61676b;
	--bg-blk-c: #798086;
	--bg-red-a: #fff2f3;
	--bg-red-b: #ED0008;
	--bg-red-c: #be0006;
	--bg-cv-a: #fad433;
	--bg-cv-b: #f9c900;

	--list-disc: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOCA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxjaXJjbGUgY3g9IjQiIGN5PSI0LjU5MTgiIHI9IjQiIGZpbGw9IiMwMDc4RDQiLz48L3N2Zz4=");
	--box-shadow-a:  0 2px 24px 8px rgba(54, 130, 217, 0.08);
	--box-shadow-b: 0 1px 8px 0 rgba(54, 130, 217, 0.1);
	--box-shadow-c: 0px 4px 5px -2px rgba(0, 0, 0, 0.3);
	--box-shadow-a-hover: 0 2px 48px 16px rgba(54, 130, 217, 0.08);
	--box-shadow-b-hover: 0 2px 24px 0 rgba(54, 130, 217, 0.12);
	--filter-a: brightness(0) invert(1);
	--filter-b: brightness(0) invert(1);

.c_text {color: #303336 !important;}
.c_wht {color: #fff !important;}
.c_gry {color: var(--c-gry) !important;}
.c_main {color: #176cff !important;}
.c_main_a {color:var(--c-main-a) !important;}
.c_main_b {color:var(--c-main-b) !important;}
.c_main_c {color:var(--c-main-c) !important;}
.bg_blk {background-color: #303336 !important;}
.bg_wht {background-color: #fff !important;}
.bg_gry_a {background-color: var(--bg-gry-a) !important;}
.bg_gry_b {background-color: var(--bg-gry-b) !important;}
.bg_gry_c {background-color: #798086 !important;}
.bg_gry_d {background-color: #61676b !important;}
.bg_main_a {background-color: var(--bg-main-a) !important;}
.bg_main_b {background-color: var(--bg-main-b) !important;}
.bg_main_c {background-color: var(--bg-main-c) !important;}
.bg_main_g {background: var(--bg-main-g) !important;}
.bg_sub_a {background-color: var(--bg-sub-a) !important;}
.bg_sub_b {background-color: var(--bg-sub-b) !important;}

.c_red_a {color: var(--bg-red-a) !important;}
.c_red_b {color: var(--bg-red-b) !important;}
.c_red_c {color: var(--bg-red-c) !important;}
.bg_red_a {background-color: var(--bg-red-a) !important;}
.bg_red_b {background-color: var(--bg-red-b) !important;}
.bg_red_c {background-color: var(--bg-red-c) !important;}

.bg_yel_a {background-color: #fffaf6 !important;}
.bg_yel_b {background-color: var(--bg-cv-a) !important;}
.bg_yel_c {background-color: var(--bg-cv-b) !important;}
.bg_yel_d {background-color: #645000 !important;}

.c_grn_a {color: #e3f3ed !important;}
.c_grn_b {color: #008756 !important;}
.c_grn_c {color: #006c45 !important;}
.bg_grn_a {background-color: #e3f3ed !important;}
.bg_grn_b {background-color: #008756 !important;}
.bg_grn_c {background-color: #006c45 !important;}

.c_org_a {color: #fff8f5 !important;}
.c_org_b {color: #ff5500 !important;}
.bg_org_a {background-color: #fff8f5 !important;}
.bg_org_b {background-color: #ff5500 !important;}

}

/* ==================================
 stracture
================================== */

[data-script-enabled="true"] #global_nav .toggle_content {display: none;}

html {scroll-behavior: smooth; scroll-padding-top: 80px;}

body {position: relative;}
body, 
main,
header, footer {color: #303336;}

header,
footer {font-family: var(--font-main); line-height: 1.6;}


header p,
footer p {margin: 0;} 


/* ==================================
 header
================================== */

/* header */
header {background-color: #fff; z-index: 100;}
header {position: sticky; left: 0; top: -56px; border-bottom: solid 1px; border-bottom-color: var(--bg-gry-a); transition: all .5s;}
header.is_down {top: 0 !important;}
header:has(nav.nav_local.toggle_open)::before {z-index: 101;}


html li.sug_element {font-size: 1.4rem !important;}
header {
	#header_main {display: flex; align-items: center; justify-content: space-between; height: 56px; padding: 0 4px 0 16px; position: relative; max-width: 1200px; margin: 0 auto; z-index: 100;}
	#header_main a {color: inherit; text-decoration: none; display: flex; align-items: center; line-height: 1; gap: 4px;}
	#header_main a > * {flex-shrink: 0;}
	#header_main .logo a {gap: 10px;}
	#header_main .logo span {width: 105px;}
}


/* tablet & sp */
@media (max-width: 1023px) {
#header_main {background-color: #fff;}
#header_main .logo i {font-size: 12px;}
}

/* laptop */
@media (min-width: 1024px) {

header {top: -128px;}
header {
	#header_main .logo a {gap: 16px;}
	#header_main .logo span {width: 170px;}
	#header_main .logo img {width: 100%;}
}

}

footer {
	> .inner {max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 32px;}

#footer {padding: 32px; font-size: 1.2rem;}
#footer {
	.inner > div {margin-top: 24px; text-align: center;}
	.copyright {color: var(--c-disabled); margin-top: 16px;}
	.footer_companyname {font-size: 1.8rem; display: flex; justify-content: center;}
}

@media (max-width: 599px) {
	#footer {padding: 32px 16px;}
}

#footer{background-color: var(--bg-gry-a);}
}












:root {font-size: 10px;}

html {-webkit-text-size-adjust: 100%;}
body {margin: 0; color: #303336; font-family: var(--font-main); font-size: 1.6rem; background-color: #fff;}

main {line-height: 1.75; letter-spacing: 0.03em; overflow: clip;}

[class^="main_wrap_"] > .inner {
	max-width: 1200px; padding: 48px 16px; margin-left: auto; margin-right: auto;
  container-type: inline-size;
  container-name: main-container;
}
@media (min-width: 1024px) {
  [class^="main_wrap_"] > .inner {padding: 64px 16px;}
}

/* stracture */
._narrow_a,
.inner._narrow_a {max-width: 960px; margin-left: auto; margin-right: auto;}
._narrow_b,
.inner._narrow_b {max-width: 768px; margin-left: auto; margin-right: auto;}

/*
.main_wrap_b {background-color: var(--bg-sub-a);}
*/

[class^="main_wrap_"] > *:first-child,
[class^="main_wrap_"] > div.inner > :first-child {margin-top: 0;}
[class^="main_wrap_"] > *:last-child,
[class^="main_wrap_"] > div.inner > :last-child  {margin-bottom: 0;}

a {color: var(--c-link); transition: color .3s, background-color .3s, border .3s, box-shadow .3s;}
a:hover {color: var(--c-hover);}
a:active {color: var(--c-active);}
a:visited {color: var(--c-visit);}
a:hover {color: var(--c-hover);}

*:focus {outline: none;}
*:focus-visible {outline: 3px solid var(--c-main); outline-offset: -1px;}

em, i {font-style: normal;}
em {font-weight: bold;}
img {max-width: 100%; height: auto; vertical-align: middle ;}
a.hov_a:hover {opacity: 0.85; transition: opacity .3s; }

.em_a {color: var(--c-main)}
.em_b {color: var(--c-red)}
.em_c {color: #ff5500}
.em_d {display: inline-block; color: var(--c-main); line-height: 1; border-radius: 1em; white-space: nowrap; background-color: var(--bg-main-a); padding: .3em 1em; margin: 0; line-height: 1;}
.em_e {display: inline-block; color: var(--c-main); line-height: 1; border-radius: 4px; white-space: nowrap; background-color: var(--bg-main-a); padding: .5em; margin: 0; line-height: 1;}
br + .em_d,
br + .em_e {margin-left: 0;}

.img_wrap {margin: 2em 0;}
.img_wrap._r {border-radius: 16px;}
.img_wrap:first-child {margin-top: 0;}
.img_wrap:last-child {margin-bottom: 0;}
.img_wrap .image {overflow: hidden; border-radius: 8px; max-height: 720px; background-color: #fff;}
.img_wrap img {transition: .3s; object-fit: cover;}
@media (min-width: 1024px) {
  .img_wrap .image {border-radius: 16px;}
}
.img_wrap:has(.caption) {display: flex; flex-direction: column; gap: 16px;}
.img_wrap:has(.txt_wrap) {display: flex; flex-direction: column; gap: 24px;}

div._aspect_a {aspect-ratio: 16 / 9;}
div._aspect_b {aspect-ratio: 1 / 1;}
div._aspect_a img,
div._aspect_b img {object-position: center center; width: 100%; height: 100%;}

hr {height: 0; margin: 32px 0; padding: 0; border: 0; border-top: solid 1px var(--bg-gry-a);}
@media (min-width: 960px) {
hr {height: 0; margin: 48px 0;}
}

div[class*="box_"] hr {margin: 1em 0;}

[href^="tel:"] {color: #5192c8; text-decoration: und erline;}

sup {display: inline-block; font-size: 10px; margin: 0 .2em;}

.sticky_wrap {position: relative;}
.sticky_item {position: sticky; z-index: 2; top: 0;}
.sticky_item > :first-child {margin-top: 0;}
.sticky_item > :last-child {margin-bottom: 0;}

p:first-child {margin-top: 0;}
p:last-child {margin-bottom: 0;}


[class*="bg_"]._fixed_bg > * {position: relative;}
[class*="bg_"]._fixed_bg {background: none; position: relative;}
.inner [class*="bg_"]._fixed_bg {padding: 16px 0;}
[class*="bg_"]._fixed_bg > *:first-child {margin-top: 0;}
[class*="bg_"]._fixed_bg > *:last-child {margin-bottom: 0;}

/* default */
[class*="bg_"]._fixed_bg::before {content: ""; position: absolute; z-index: 0; left: calc((100vw - 100%) / -2); top: 0; width: 100vw; height: 100%; background-color: var(--bg-sub-b)}
.bg_main_g._fixed_bg::before {background: var(--bg-main-g)}

.main_wrap_a > [class*="bg_"]._fixed_bg {padding-left: 16px; padding-right: 16px; margin: 0 auto;}
.main_wrap_a > .inner > [class*="bg_"]._fixed_bg,
[class*="bg_"]._fixed_bg:has(> form.form_a) {margin: 32px 0; padding: 32px 0;}

.main_wrap_a > .inner > [class*="bg_"]._fixed_bg:first-child {margin-top: 0;}
.main_wrap_a > .inner > [class*="bg_"]._fixed_bg:last-child {margin-bottom: 0;}
main > .main_wrap_a:last-child > .inner:has([class*="bg_"]._fixed_bg:last-child) {padding-bottom: 0;}

.main_wrap_a._notes > .inner {padding: 16px;}
@media (min-width: 1024px) {
	.main_wrap_a._notes > .inner {padding: 32px 16px;}
}



.main_wrap_a > .inner.js_tab {padding-top: 0;}

@media (min-width: 960px) {
	[class*="bg_"]:has(> *.box_a:first-child) {padding-top: 32px; padding-bottom: 32px;}
  .main_wrap_a > .inner > [class*="bg_"]._fixed_bg {margin: 64px 0; padding: 48px 0;}
	[class*="bg_"]._fixed_bg:has(> form.form_a) {margin: 64px 0; padding: 48px 0;}
}


/* ==================================
 heading
================================== */

body {

h1, h2, h3, h4, h5, h6, .title, .hd_a {line-height: 1.5; font-feature-settings: "palt"; letter-spacing: .02em;}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {margin-top: 0;}

h1 {line-height: 1.4;}
h4, h5, h6 {font-size: inherit;}
.title {margin-top: 2em; font-weight: normal;}

.bg_main_g > .inner,
.bg_main_g {
> h1, > h2, > h3, > h4, > h5, > h6 {color: #fff;}
}


[class^="hd_"]._xxxl {font-size: 3.2rem; margin: 1em 0 .5em; letter-spacing: .01em;}
[class^="hd_"]._xxl {font-size: 2.8rem; margin: 2em 0 1.25em; letter-spacing: .01em;}
[class^="hd_"]._xl {font-size: 2.4rem; margin: 2em 0 1em;}
[class^="hd_"]._l {font-size: 2rem; margin: 2em 0 1em;}
[class^="hd_"]._m {font-size: 1.8rem; margin: 2em 0 1em;}
[class^="hd_"]._i {font-size: inherit; margin: 2em 0 1em;}

@media (min-width: 1024px) {
[class^="hd_"]._xxxl {margin: 1.5em 0 .5em;}
[class^="hd_"]._xxl {margin: 3em 0 1.3em;}
[class^="hd_"]._xl {margin: 3em 0 1.3em;}
[class^="hd_"]._l {margin: 3em 0 1em;}
[class^="hd_"]._m {margin: 2.5em 0 1em;}
[class^="hd_"]._i { margin: 2em 0 1em;}

.hd_a._xxxl,
.hd_b._xxxl {font-size: 4rem;}
.hd_a._xxl,
.hd_b._xxl {font-size: 3.2rem;}
.hd_a._xl,
.hd_b._xl {font-size: 2.4rem;}
}

.hd_a,
.hd_b,
.hd_c,
.hd_d {font-weight: bold;}

.txt_wrap > :first-child,
[class^="hd_"]:first-child {margin-top: 0;}
.txt_wrap > :last-child,
[class^="hd_"]:last-child {margin-bottom: 0;}


.hd_b {font-size: 2.4rem; position: relative; padding-left: 1.6rem; margin: 2em 0 1em;}
.hd_b::before {content: ""; width: 4px; height: calc(100% - .2em); position: absolute; top: .1em; left: 0; background: linear-gradient(to bottom, #FAD433 0%, #FAD433 50%, #176CFF 50%, #176CFF 100%);}

.hd_b.ta_c {padding-bottom: .5em; padding-left: 0; margin-bottom: 1.8em; margin-top: 3em;}
.hd_b.ta_c::before {width: 32px; height: 4px; top: initial; bottom: 0; left: 50%; margin-left: -16px; background: linear-gradient(to right, #FAD433 0%, #FAD433 50%, #176CFF 50%, #176CFF 100%);}


@media (min-width: 600px) {
.hd_b.ta_c {margin-top: 3.5em;}
.hd_b.ta_c_tb {padding-bottom: .5em;}
.hd_b.ta_c_tb::before {width: 32px; height: 4px; top: initial; bottom: 0; left: 50%; margin-left: -16px; background: linear-gradient(to right, #FAD433 0%, #FAD433 50%, #176CFF 50%, #176CFF 100%);}
}
@media (min-width: 1024px) {
.hd_b.ta_c_pc {padding-bottom: .5em;}
.hd_b.ta_c_pc::before {width: 32px; height: 4px; top: initial; bottom: 0; left: 50%; margin-left: -16px; background: linear-gradient(to right, #FAD433 0%, #FAD433 50%, #176CFF 50%, #176CFF 100%);}
}

.hd_c {position: relative; padding-left: 1.6rem; font-size: 2.4rem; margin: 2em 0 1em;}
.hd_c::before {content: ""; position: absolute; left: 0; top: .1em; width: 4px; height: calc(100% - .2em); border-radius: 10px; background: var(--bg-main-g);}

.hd_c.ta_c {padding-bottom: .5em; padding-left: 0; margin-bottom: 1.8em;}
.hd_c.ta_c::before {width: 32px; height: 4px; top: initial; bottom: 0; left: 50%; margin-left: -16px;  background: var(--bg-main-g);}

/* icon title */
[class*="hd_"]:has(i) > span {display: flex; align-items: flex-start; gap: 6px; border: 0;}
[class*="hd_"]:has(i) > span > i {flex-shrink: 0; display: flex; width: 1.5em; height: 1.5em;}
[class*="hd_"]:has(i) > span > i img {width: 100%; height: 100%; object-fit: contain; vertical-align: middle;}
[class*="hd_"].ta_c:has(i) > span {justify-content: center;}
[class*="hd_"]._bul,
[class*="hd_"]._squ {display: flex; align-items: flex-start; gap: .4em;}
[class*="hd_"]._bul::before,
[class*="hd_"]._squ::before {content: ""; width: .5em; height: .5em; background-color: var(--bg-gry-c); flex-shrink: 0; margin-top: .5em;}
[class*="hd_"]._bul::before {border-radius: 1em; width: .6em; height: .6em; margin-top: .45em;}
[class*="hd_"]._bul._c_main::before,
[class*="hd_"]._squ._c_main::before {background-color: var(--bg-main-b);}

/* wrapping title */
.hd_wrap_main_a,
.hd_wrap_a {border-bottom: solid 1px var(--bg-gry-a);
  .inner {display: flex; flex-direction: column-reverse; align-items: stretch; max-width: 1200px; margin: 0 auto;}
  .txt_wrap {padding: 32px 16px;}
  .txt_wrap {padding: 32px 16px;}
  .hd_a {margin: 0;}
  .catch {color: var(--c-main); font-size: 1.6rem; font-weight: bold; line-height: 1.6;}
  .read {margin-top: 1em;}
  .catch + .hd_a {margin-top: 4px;}
  .img_wrap {margin: 0;}
  .img_wrap .image {border-radius: 0; aspect-ratio: 16 / 9; text-align: center; display: flex; align-items: center; justify-content: center;}
  .img_wrap img {object-position: center center; width: 100%; height: 100%;}
  .txt_wrap .hd_a:first-child {margin: 0;}
  .txt_wrap .hd_a:first-child + p {margin-top: 1em;}
}

@media (min-width: 1024px) {
.hd_wrap_main_a,
.hd_wrap_a {
  .inner {flex-direction: row; align-items: center; justify-content: space-between; padding: 24px 16px; gap: 32px; min-height: 212px;}
  .head_wrap {padding: 1rem 0;}
  .head_wrap .hd_a {font-size: 2.8rem;}
  .txt_wrap {padding: 0; width: 100%;}
  .catch {font-size: 1.8rem;}
  .img_wrap {flex-shrink: 0; width: 100%; max-width: 340px; border-radius: 16px; align-self: flex-start; background-color: var(--bg-gry-a);}
  .img_wrap .image {border-radius: 8px;}
	.txt_wrap:has(.tag_list_a) {align-self: flex-start;}
}
}

.hd_wrap_modal {border-bottom: solid 1px var(--bg-gry-a);}
.hd_wrap_modal > .inner {max-width: 960px; margin: 0 auto; padding: 16px; display: flex; align-items: center; justify-content: space-between;}
.hd_wrap_modal h1.hd_a {margin: 0;}
.hd_wrap_modal + .inner {padding: 32px 16px; max-width: 960px;}
@media (min-width: 600px) {
.hd_wrap_modal + .inner {padding: 32px; max-width: 960px;}
}

.hd_wrap_b {margin: 4em 0 2em;}
.hd_wrap_b:has(._xxl) {margin-bottom: 3em;}
[class*="hd_wrap_"]:last-child {margin-bottom: 0;}
[class*="hd_wrap_"] p {margin: 0;}

@media (min-width: 1024px) {
.hd_wrap_b {margin: 80px 0 2em;}
}

.hd_wrap_b {
  .sub {color: var(--c-main); font-size: 1.4rem; font-weight: bold;}
  .sub i {border: solid 1px var(--c-main); color: var(--c-main); background-color: var(--bg-sub-a); display: inline-block; line-height: 1; padding: 6px 12px; border-radius: 4px; font-weight: bold;}
  .sub:has(i) {margin-bottom: 1.2rem;}
  .sub + [class*="hd_"] {margin-top: .2rem;}
}

}

/* ==================================
 link
================================== */

body {

.icon_link::after,
.icon_dl::after,
.icon_tips::after {content: ""; width: 18px; height: 18px; margin: 0 3px; vertical-align: middle; display: inline-block; mask: var(--ui-link-arrow) center / 20px no-repeat; background-color: var(--c-link);}

.icon_link:after {background-color: var(--c-link); transition: transform .3s;}
.icon_link:hover::after {transform: translateX(2px);}

.icon_link[target*="_blank"]::after,
.icon_link[class*="modal"]::after {mask-image: var(--ui-link-blank);}
.icon_link[href^="#"]::after {mask-image: var(--ui-link-anchor);}
.icon_link[href*=".pdf"]::after {mask-image: var(--ui-link-pdf);}
.icon_tips::after {mask-image: url(/assets/img/ui_icon_tips.svg);}
.icon_dl::after,
a[href*=".exe"]::after,
a[href*=".zip"]::after,
a[href*=".lzh"]::after,
a[href*=".hqx"]::after,
a[href*=".pkg"]::after,
a[href*=".dlm"]::after,
a[href*=".inf"]::after,
a[href*=".sit"]::after,
a[href*=".bin"]::after,
a[href*=".dlf"]::after,
a[href*=".dlm"]::after,
a[href*=".enc"]::after,
a[href*=".rmt"]::after,
a[href*=".dlf"]::after {mask-image: var(--ui-link-dl); transform: none !important;}

ul[class*="link_list_"] {list-style: none; margin: 24px 0; padding: 0;}

div.txt_wrap .link_list_a,
table ul[class*="link_list_"] {margin: 16px 0;}

ul[class*="link_list_"]:first-child {margin-top: 0;}
ul[class*="link_list_"]:last-child {margin-bottom: 0;}

ul[class*="link_list_"] > li > a {text-decoration: none;}
ul[class*="link_list_"] > li > button {border: none; background: transparent; padding: 0; color: var(--c-link); line-height: inherit;}
ul[class*="link_list_"] > li > a::after,
ul[class*="link_list_"] > li > u::after,
ul[class*="link_list_"] > li > button::after {content: ""; width: 20px; height: 20px; display: inline-block; margin: 0 0 0 2px; vertical-align: -.25em; mask: var(--ui-link-arrow) center / 20px no-repeat; background-color: var(--c-link); transition: transform .3s;}
ul[class*="link_list_"] > li > u::after {opacity: .3;}


ul[class*="link_list_"] > li > a[href^="#"]::after,
ul[class*="btn_list_"] > li > a[href^="#"]::after {mask-image: var(--ui-link-anchor);}

ul[class*="link_list_"] > li > a[target="_blank"]::after,
ul[class*="link_list_"] > li > a[class*="modal"]::after,
ul[class*="btn_list_"] > li > a[target="_blank"]::after,
ul[class*="btn_list_"] > li > a[class*="modal"]::after {mask-image: var(--ui-link-blank);}

ul[class*="link_list_"] > li > a[href*=".pdf"]::after,
ul[class*="btn_list_"] > li > a[href*=".pdf"]::after {mask-image: var(--ui-link-pdf);}

ul[class*="link_list_"] > li > a.icon_dl::after,
ul[class*="btn_list_"] > li > a.icon_dl::after {mask-image: var(--ui-link-dl);}

ul[class*="link_list_"] > li > a:hover,
ul[class*="btn_list_"] > li > a:hover,
ul[class*="btn_list_"] > li > button:hover {text-decoration: underline;}
ul[class*="btn_list_"] > li > button:hover {color: var(--c-hover);}
ul[class*="link_list_"] > li > a:hover::after,
ul[class*="btn_list_"] > li > a:hover::after,
ul[class*="btn_list_"] > li > button:hover::after {transform: translateX(2px);}

[target*="_blank"]::after,
a[class*="modal"]::after {transform: none !important;}
[href^="#"]::after {transform: none !important;}
[href*=".pdf"]::after {transform: none !important;}
.icon_tips::after {transform: none !important;}
.icon_dl::after,
a[href*=".exe"]::after,
a[href*=".zip"]::after,
a[href*=".lzh"]::after,
a[href*=".hqx"]::after,
a[href*=".pkg"]::after,
a[href*=".dlm"]::after,
a[href*=".inf"]::after,
a[href*=".sit"]::after,
a[href*=".bin"]::after,
a[href*=".dlf"]::after,
a[href*=".dlm"]::after,
a[href*=".enc"]::after,
a[href*=".rmt"]::after,
a[href*=".dlf"]::after {transform: none !important;}

ul.link_list_a,
ul.link_list_b {display: flex; flex-direction: column; gap: .75em;}

ul.link_list_a._sub a::before {content: "┗"; margin: 0 .2em; color: var(--c-link); display: inline-block; height: 1.2em; overflow: hidden;}
ul.link_list_a ul.link_list_a._sub {margin: 1em 0 0;}
ul.link_list_a._center {flex-direction: row; justify-content: center; flex-wrap: wrap; gap: 1em 2em;}
ul.link_list_a._row {flex-direction: row; flex-wrap: wrap; gap: 1em 2em;}
ul.link_list_a._row_right {flex-direction: row; flex-wrap: wrap; gap: 1em 2em; justify-content: flex-end;}
ul.link_list_a._right {align-items: flex-end;}
ul[class*="link_list_"].c_text > li > a,
ul.link_list_a.c_wht > li > a {color: inherit;}
ul.link_list_a.c_wht > li > a::after,
ul.link_list_a.c_wht > li > u::after {background-color: #fff;}
ul[class*="link_list_"].c_text > li > a:hover {color: var(--c-hover);}


ul.link_list_b {padding-left: 1.25em;}
ul.link_list_b > li {position: relative;}
ul.link_list_b > li::before {content: ""; width: 1.5em; height: 1em; position: absolute; left: -1.5em; top: .35em; mask: var(--list-disc) center / .4em no-repeat; background-color: var(--c-main);}

ul.link_list_c,
ul.link_list_qa {margin: 3em 0; border-radius: 16px; border: 1px solid var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b); overflow: hidden;}
ul.link_list_c,
ul.link_list_qa {
  .title {margin: 0; font-size: 1.7rem; font-weight: bold; line-height: 1.6; border-bottom: 1px solid var(--bg-gry-a);}
  .title:last-child {border: none;}
  .title > a {display: flex; width: 100%; text-align: left; gap: 16px; font-weight: bold; justify-content: space-between; align-items: center; min-height: 4em; padding: 16px; background: #fff; border: none; border-radius: 0; color: inherit; text-decoration: none;}
  .title > a::after {content: ""; width: 32px; height: 20px; margin: 0; vertical-align: 0; flex-shrink: 0; border: solid 1px var(--bg-gry-a); border-radius: 6px; mask: var(--ui-link-arrow) center / 20px no-repeat; background-color: var(--bg-main-b);}
  .title > a .text {display: flex; gap: 16px; flex: 1;}
  .title > a:hover {text-decoration: underline; background-color: var(--bg-hover-b); transition: background-color .2s}
  .title > a:hover .img_wrap img {transform: scale(1.1);}

  .title:first-child > a {border-radius: 16px 16px 0 0;}
  .title:last-child > a {border-radius: 0 0 16px 16px;}
	*:focus {outline-offset: -3px;}
}
ul.link_list_c {
.img_wrap {width: 64px; margin: 0; border-radius: 8px; overflow: hidden; aspect-ratio: 64 / 48; display: flex; align-items: center; justify-content: center;}
.img_wrap img {object-fit: cover; width: 100%; height: 100%; object-position: 50% 50%;}
.img_wrap img.of_sd {height: auto;}
}

ul.link_list_qa {
	.title > a .text::before {content: "Q"; margin-top: 2px; width: 24px; height: 24px; overflow: hidden; padding-left: 24px; flex-shrink: 0; color: transparent; background: url("/assets/img/ui_acco_qa_q.svg") no-repeat center / 24px 24px;}
}


/* tab list  */

/* A */

.tab_a {margin: 3em 0;}

ul.tab_list_a {display: flex; gap: 8px; padding: 0; margin: 3em auto 0; max-width: 1200px; padding: 0 16px; position: relative;}
div.tab_a ul.tab_list_a {margin-top: 0; padding-top: 16px; padding-bottom: 0;}
div.tab_a ul.tab_list_a a:hover {text-decoration: underline;}

div.tab_a.js_tab.sticky_wrap {margin-top: 0; padding-top: 3em;}
div.tab_a.js_tab.sticky_wrap .sticky_item {top: 0;}

@media (min-width: 600px) {
ul.tab_list_a {display: flex; gap: 16px;}
}

ul.tab_list_a.bg_main_g._fixed_bg {padding-top: 16px !important; padding-bottom: 0 !important;}
@media (min-width: 960px) {
ul.tab_list_a.bg_main_g._fixed_bg {padding-top: 32px !important;}
}

ul.tab_list_a {
  li {display: flex; flex: 1; line-height: 1.5; position: relative; z-index: 1;}
  li a {display: flex; align-items: center; flex-direction: column; gap: 4px; justify-content: center; text-align: center; font-weight: bold; width: 100%; padding: 8px 16px; min-height: 4em; text-decoration: none; border: 1px solid #ccc; border-bottom: none; border-radius: 16px 16px 0 0; transition: background-color .3s, color .3s; text-decoration: none !important;}
  li a i {width: 24px; height: 24px; flex-shrink: 0;}
  li a i img {object-fit: contain; width: 100%; height: 100%; transition: filter .3s;}
  li:not(.is_active) a i img {filter: var(--filter-a);}
  li.is_active a {background: #fff; pointer-events: none; color: var(--c-link);}
  li.is_active a i img {transition: filter .3s;}
	@media (min-width: 600px) {
	  li a {flex-direction: row; gap: 8px;}
	  li a i {width: 32px; height: 32px;}
	}
}
.main_wrap_a.bg_sub_a ul.tab_list_a li.is_active a {background-color: var(--bg-sub-a);}

}

ul.tab_list_a.bg_main_g {
  li:not(.is_active) a {border-color: #fff; color: #fff;}
}

ul.tab_list_a._border::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-bottom: solid 1px var(--bg-gry-b);}
ul.tab_list_a._border {
  li:not(.is_active) a {border-bottom: solid 1px var(--bg-gry-b); color: var(--c-link); box-shadow: inset 0px -2px 2px -2px rgba(0, 0, 0, 0.3); background-color: #fff;}
  li.is_active a {color: inherit;}
	li.is_active a {border-bottom-color: #fff;}
}

/* B */

ul.tab_list_b {position: relative; list-style: none; display: flex; gap: 8px; padding: 8px; margin: 0 auto; max-width: 1200px;}
ul.tab_list_b::before {content: ""; position: absolute; top: 0; left: -16px; height: 100%; width: 100vw; box-shadow: var(--box-shadow-a), var(--box-shadow-b); border-top: solid 1px var(--bg-gry-a); background-color: #fff;}

ul.tab_list_b {
  li {line-height: 1.3; font-size: 1.4rem; position: relative; font-weight: bold; flex: 1; text-align: center;}
  li a {display: flex; height: 100%; color: var(--bg-main-b); flex-direction: column; align-items: center; justify-content: center; border-radius: 8px; padding: 5px 8px; min-height: 4.5em; gap: 4px; text-decoration: none; background: #fff; border: 1px solid var(--bg-main-b);}
  li a i {flex-shrink: 0; width: 24px; height: 24px;}
  li a i img {object-fit: contain; width: 100%; height: 100%;}
  li a:hover {color: #fff; background-color: var(--bg-main-b);}
  li.is_active a {color: #fff; background-color: var(--bg-main-b); pointer-events: none;}
  li.is_active a i img {transition: filter .3s;}
  li.is_active a i img,
	li a:hover i img {filter: brightness(0) invert(1);}
}

@media (min-width: 600px) {
  ul.tab_list_b {padding: 16px; gap: 16px;}
  ul.tab_list_b {
		li {font-size: 1.6rem; text-align: left;}
	  li a {flex-direction: row; gap: 8px; border-radius: 16px; justify-content: center; min-height: 64px;}
	  li a i {width: 32px; height: 32px; flex-shrink: 0;}
	}
	ul.tab_list_b::before {left: calc((100vw - 100%) / -2);}
}


/* C */

ul.tab_list_c {padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin: 3em auto 0; position: relative; list-style: none; box-shadow: var(--box-shadow-a), var(--box-shadow-b); border-radius: 16px; overflow: hidden; line-height: 1.5; background-color: var(--bg-gry-a); text-align: center;}
ul.tab_list_c {
  li {display: grid;}
  li a {display: flex; padding: 16px; align-items: center; justify-content: stretch; flex-direction: column; gap: 4px; text-decoration: none; color: inherit; background-color: #fff; transition: color .3s, background-color .3s, background-img .3s}
  li a:hover {background: var(--bg-main-a);}
  li a img {transition: filter .3s;}
  li.is_active a {color: #fff; background: var(--bg-main-g); pointer-events: none;}
  li.is_active a img {filter: brightness(0) invert(1); }
  li a > span {display: flex; align-items: center; gap: 16px;}
  li a i {flex-shrink: 0; width: 24px; height: 24px;}
  li a i img {object-fit: contain; width: 100%; height: 100%;}
	@media (min-width: 600px) {
	  li a i {width: 32px; height: 32px; flex-shrink: 0; gap: 8px;}
	}
}

@media (min-width: 1024px) {
  ul.tab_list_c {grid-template-columns: repeat(3, 1fr);}
  ul.tab_list_c {gap: 32px; background: none; box-shadow: none; overflow: initial;}
  ul.tab_list_c {
	  li a {padding: 34px 28px; border-radius: 16px; box-shadow: var(--box-shadow-a),var(--box-shadow-b); border: solid 1px var(--bg-gry-a);}
	  li a i {flex-shrink: 0; width: 32px; height: 32px;}
  }
}


.tag_list_a {font-size: 1.2rem; display: flex; list-style: none; padding: 0; margin: 1em 0; gap: 8px; flex-wrap: wrap; position: relative;}
.tag_list_a li {flex-shrink: 0;}
.tag_list_a._tag li > a::before,
.tag_list_a._tag li > span::before {content: "#";}

.tag_list_a {
li {position: relative; z-index: 1; line-height: 1; display: flex; align-items: center;}
li a,
li > span {text-decoration: none; display: flex; justify-content: center; align-items: center; background-color: var(--bg-main-a); line-height: 1; min-height: 2em; min-width: 4em; padding: 0 .6em; border-radius: 4px;}
li > span {color: var(--c-link);}
li a {color: var(--c-link);}
li a:hover {text-decoration: underline; background-color: var(--bg-hover-b);}
li a.icon_tips {font-size: 1.3rem; display: flex; gap: 2px; padding: 0; background: none; color: inherit;}
li a.icon_tips::after {width: 1em; height: 1em; flex-grow: 0; mask-size: 110%;}
li.new > * {color: var(--c-red-b); background-color: var(--bg-red-a);}
li.rec > * {color: #645000; background-color: #fefae6;}
}

.tab_panels._narrow_a {max-width: 928px; margin: 0 auto;}
.tab_panel._narrow_a {max-width: 928px; margin: 0 auto;}
.tab_panels .tab_panel {padding: 32px 0;}
.tab_panels .tab_panel > *:first-child {margin-top: 0;}
.tab_panels .tab_panel > *:last-child {margin-bottom: 0;}
.tab_panels._var_a .tab_panel {padding: 32px 16px;}
@media (min-width: 1024px) {
  .tab_panels .tab_panel {padding: 56px 0 0;}
	.tab_panels._var_a .tab_panel {padding: 56px;}
}



/* ==================================
 btn
================================== */

body {

[class*="btn_list_"] {list-style: none; margin: 32px 0; padding: 0;}
[class*="btn_list_"]:first-child {margin-top: 0;}
[class*="btn_list_"]:last-child {margin-bottom: 0;}

table [class*="btn_list_"] {margin: 16px 0;}

ul.btn_list_a {display: flex; gap: 16px; flex-wrap: wrap; flex-direction: column; line-height: 1.5;}
ul.btn_list_a._row {flex-direction: row;}
ul.btn_list_a > li {
	> a,
	> button {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; min-width: 8em; text-decoration: none; min-height: 3em; border-radius: 8px; padding: .8em 1.5em; background-color: #fff; border: solid 1px; color: var(--c-link); border-color: var(--bg-main-g); transition: background-color .3s; gap: 4px;}
	> a::after,
	> button::after {content: ""; width: 20px; height: 20px; flex-shrink: 0; background-color: var(--c-link); mask: var(--ui-link-arrow) center / 20px no-repeat; transition: transform .3s;}
	> a:hover,
	> button:hover {color: var(--c-hover); background-color: var(--bg-hover-b); text-decoration: underline;}
	> a:hover::after,
	> button:hover::after {background-color: var(--c-hover); transform: translateX(2px);}
  > a._prev {flex-direction: row-reverse;}
  > a._prev::after {transform: rotate(180deg);}
}

/* variation */
ul.btn_list_a > li {
	> a._cv,
	> button._cv {color: var(--c-text); background-color: var(--bg-cv-a); border-color: var(--bg-cv-a); font-weight: bold;}
	> a._cv:hover,
	> button._cv:hover {background-color: var(--bg-cv-b); border-color: var(--bg-cv-b);}
	> a._cv::after,
	> button._cv::after {background-color: var(--c-text);}
	> a._em {color: #fff; background: var(--bg-main-b); border-color: var(--bg-main-b); font-weight: bold;}
	> a._em:hover {background-color: var(--bg-hover-a); border-color: var(--bg-hover-a);}
	> a._em::after {background-color: #fff;}
	> a > i,
	> button > i {flex-shrink: 0; display: flex; width: 22px; height: 22px;}
	> a._cv > i,
	> button._cv > i {opacity: .8; filter: brightness(0);}
	> a._em > i {filter: brightness(0) invert(1);}
}

ul.btn_list_a._ol > li {
	> a {color: #fff; background-color: transparent; border-color: #fff;}
	> a:hover {background-color: rgba(0, 0, 0, .2); border-color: #fff;}
	> a::after {background-color: #fff;}
}

/* close */
ul.btn_list_a._close {display: flex; flex-direction: row; justify-content: center; margin-top: 56px;}
ul.btn_list_a._close button {flex-direction: row-reverse; gap: 4px;}
ul.btn_list_a._close button::after {mask-image: var(--ui-link-close); transform: none !important;}

/* center */
ul.btn_list_a._center {display: flex; justify-content: center; align-items: center; gap: 16px; flex-wrap: wrap;}

/* size */
ul.btn_list_a._xs li {font-size: 1.2rem;}
ul.btn_list_a._s li {font-size: 1.4rem;}
ul.btn_list_a._l a {min-height: 4em; padding: .5em 2em;}
ul.btn_list_a._btn_s a {padding: .4em 1em; min-height: 2.8em;}

/* nav_anchor_a */
nav.nav_anchor_a {border-bottom: solid 1px var(--bg-gry-a); background-color: #fff !important;}
nav.nav_anchor_a {
	ul.btn_list_a {max-width: 1200px; margin: 0 auto; overflow-x: auto; padding: 12px 16px 10px; gap: 12px; font-size: 1.4rem; flex-direction: row; flex-wrap: nowrap; counter-reset: inherit; background-color: #fff;}
	ul.btn_list_a {scrollbar-width: thin; scrollbar-color: var(--bg-main-a) #fff;}
  ul.btn_list_a {
  ::-webkit-scrollbar {width: 5px;}
  ::-webkit-scrollbar-track {background: #fff;}
  ::-webkit-scrollbar-thumb {background: var(--bg-main-a);}
  ::-webkit-scrollbar-thumb:hover {background: var(--bg-gry-b);}
  }

	ul.btn_list_a li {flex-shrink: 0; line-height: 1.1;}
	ul.btn_list_a a {padding: 2px 10px; border: none; min-height: 2.5em; max-width: 20em; min-width: initial;}
	ul.btn_list_a a.is_current {background: var(--bg-main-g); color: #fff;}
	ul.btn_list_a a.is_current::after {background-color: #fff;}
}

/* disabled */
ul.btn_list_a a.disabled {pointer-events: none; background-color: var(--bg-gry-a) !important; border-color: var(--bg-gry-a) !important; color: var(--c-disabled) !important;}
ul.btn_list_a a.disabled::after {background-color: var(--c-disabled) !important;}
ul.btn_list_a a._em.disabled,
ul.btn_list_a a._cv.disabled {background-color: var(--bg-gry-a);}
ul.btn_list_a._ol a.disabled {background-color: rgba(0, 0, 0, .25); color: var(--c-disabled); border-color: var(--c-disabled);}
ul.btn_list_a a._cv.disabled > i {opacity: .3;}

ul.btn_list_a._col2_sp {display: grid; grid-template-columns: repeat(2, 1fr);}

ul.btn_list_a._col2 li,
ul.btn_list_a._col3 li,
ul.btn_list_a._col4 li {height: 100%;}

@media (min-width: 600px) {
ul.btn_list_a._col2,
ul.btn_list_a._col3,
ul.btn_list_a._col4 {display: grid; grid-template-columns: repeat(2, 1fr);}
ul.btn_list_a._center_tb {display: flex; justify-content: center; align-items: center; gap: 16px}
}
@media (min-width: 1024px) {
ul.btn_list_a._col3 {grid-template-columns: repeat(3, 1fr);}
ul.btn_list_a._col4 {grid-template-columns: repeat(4, 1fr);}
}


/* Type B */
ul.btn_list_b {display: flex; gap: 16px; flex-wrap: wrap; flex-direction: column; line-height: 1.5;}
ul.btn_list_b {
  li a {display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 16px; min-height: 3em; text-decoration: none; color: inherit; background-color: #fff; border: solid 1px var(--bg-gry-a); border-radius: 8px;}
  li a > span i {flex-shrink: 0; width: 24px; height: 24px;}
  li a > span i img {object-fit: contain; width: 100%; height: 100%;}
  li a > span {display: flex; align-items: center; gap: 8px;}
  li a::after {content: ""; width: 24px; height: 24px; flex-shrink: 0; mask: var(--ui-link-anchor) center / 24px no-repeat; background-color: var(--c-main);}
  li a:hover {color: var(--c-hover); text-decoration: underline; background-color: var(--bg-hover-b);}
  li a:visited {color: inherit;}
}
@media (min-width: 600px) {
  ul.btn_list_b {display: grid; gap: 32px;}
  ul.btn_list_b {
    li {border: none; flex: 1;}
    li a {display: flex; flex-direction: column; gap: 8px; border-radius: 16px; padding: 16px 16px 8px; height: 100%; box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
    li a > span {flex-direction: column; text-align: center;}
    li a > span i {width: 40px; height: 40px;}
		li a::after {transform: none !important;}
  }
}

/* variation */
@media (max-width: 599px) {
	ul.btn_list_b._var_a {gap: 0; border: solid 1px var(--bg-gry-a); border-radius: 16px; overflow: hidden;}
	ul.btn_list_b._var_a {
	  li a {border-width: 0 0 1px; border-radius: 0; min-height: 3.5em;}
	  li:first-child a {border-radius: 0;}
	  li:last-child a  {border-radius: 0; border: none;}
	}
}

@media (min-width: 600px) {
  ul.btn_list_b._var_a {gap: 24px;
    li {border: none; flex: 1;}
    li a {display: flex; flex-direction: column; gap: 8px; border-radius: 16px; padding: 16px 16px 8px; height: 100%; box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
    li a > span {flex-direction: column; text-align: center;}
    li a > span i {width: 40px; height: 40px;}
  }
}
@media (min-width: 1024px) {
  ul.btn_list_b._var_a {gap: 32px;}
}

@media (min-width: 600px) {
	ul.btn_list_b._col2,
	ul.btn_list_b._col3,
	ul.btn_list_b._col4 {grid-template-columns: repeat(2, 1fr);}
}
@media (min-width: 1024px) {
	ul.btn_list_b._col3 {grid-template-columns: repeat(3, 1fr);}
	/* ul.btn_list_b._col3 li.gc_4_pc {grid-column:1/4;} */
	ul.btn_list_b._col4 {grid-template-columns: repeat(4, 1fr);}
}

/* Type C */
ul.btn_list_c {display: grid; gap: 40px; line-height: 1.5; grid-template-columns: repeat(1, 1fr);}
ul.btn_list_c {
	li {position: relative; text-align: center;}
  li a {display: flex; flex-direction: column; gap: 8px; align-items: center; justify-content: space-between; height: 100%; text-decoration: none; color: inherit; background-color: #fff; border-radius: 16px; overflow: hidden; border: solid 1px var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
  li a i {flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: var(--c-main); background-color: var(--bg-sub-a); width: 100%; min-height: 2.25em; line-height: 1; padding: 4px 16px; font-weight: bold;}
  li a .txt_wrap {display: flex; flex-direction: column; width: 100%; gap: 4px; padding: 4px 16px 0;}
  li a .txt_wrap > span:first-child {font-size: 1.4rem; color: var(--c-gry); font-weight: bold;}
  li a::after {content: ""; flex-shrink: 0; margin-bottom: 8px; width: 24px; height: 24px; flex-shrink: 0; mask: var(--ui-link-anchor) center / 24px no-repeat; background-color: var(--c-main); transform: none !important;}
  li a:hover {text-decoration: none; background-color: var(--bg-hover-b);}
  li a:hover em {text-decoration: underline}
  li a:visited {color: inherit;}
	li::after {content: ""; position: absolute; width: 24px; height: 24px; transform: rotate(90deg); left: calc(50% - 12px); top: calc(100% + 8px); mask: url(/assets/img/ui_nav_next.svg) center / 18px no-repeat; background-color: var(--bg-main-b);}
	li._no_arrow:after,
	li:last-child:after {display: none;}
}

/* no arrow */
ul.btn_list_c._no_arrow {gap: 24px;}
@media (min-width: 600px) {
ul.btn_list_c._no_arrow {gap: 32px;}
}
ul.btn_list_c._no_arrow {
	li::after {display: none;}
}


/* Type d */
ul.btn_list_d {display: grid; gap: 40px; line-height: 1.5; grid-template-columns: repeat(1, 1fr);}
ul.btn_list_d {
	li {position: relative; text-align: center;}
  li > * {display: flex; flex-direction: column; gap: 8px; align-items: center; justify-content: space-between; height: 100%; text-decoration: none; color: inherit; background-color: #fff; border-radius: 16px; overflow: hidden; padding: 16px 16px 8px; border: solid 1px var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
  li > * i {flex-shrink: 0; width: 40px; height: 40px;}
  li > * i img {object-fit: contain; width: 100%; height: 100%;}
  li .txt_wrap {display: flex; flex-direction: column; width: 100%; gap: 4px; padding: 4px 16px 0;}
  li .txt_wrap > span:first-child {font-size: 1.4rem; color: var(--c-gry); font-weight: bold;}
  li > *::after {content: ""; flex-shrink: 0; margin-bottom: 8px; width: 24px; height: 24px; flex-shrink: 0; mask: var(--ui-link-anchor) center / 24px no-repeat; background-color: var(--c-main); transform: none !important;}
  li > :not(a)::after {opacity: 0;}
  li a:hover {text-decoration: none; background-color: var(--bg-hover-b);}
  li a:hover em {text-decoration: underline}
  li a:visited {color: inherit;}
	li::after {content: ""; position: absolute; width: 24px; height: 24px; transform: rotate(90deg); left: calc(50% - 12px); top: calc(100% + 8px); mask: url(/assets/img/ui_nav_next.svg) center / 18px no-repeat; background-color: var(--bg-main-b);}
	li._no_arrow:after,
	li:last-child:after {display: none;}
}

ul.btn_list_d._pulse li::after  {
content: ""; position: absolute; width: 32px; height: 32px; left: calc(50% - 16px); top: calc(100% + 4px); mask: url(/assets/img/icon_pulse.svg) center / 100% no-repeat; background-color: var(--bg-main-b);
}

.bg_main_g > .inner,
.bg_main_g {
> ul.btn_list_c li::after {background-color: #fff;}
> ul.btn_list_d li::after {background-color: #fff;}
}

@media (min-width: 960px) {
	ul.btn_list_c._col2,
	ul.btn_list_d._col2 {grid-template-columns: repeat(2, 1fr);}
	ul.btn_list_c._col3,
	ul.btn_list_d._col3 {grid-template-columns: repeat(3, 1fr);}
	ul.btn_list_c._col4,
	ul.btn_list_d._col4 {grid-template-columns: repeat(4, 1fr);}
	ul.btn_list_c li::after,
	ul.btn_list_d li::after {top: calc(50% - 12px); left: calc(100% + 8px); transform: none;}
	ul.btn_list_c._pulse li::after,
	ul.btn_list_d._pulse li::after {top: calc(50% - 16px); left: calc(100% + 4px); transform: none;}
	
	}


ul.anchor_list_b {list-style: none; padding: 0; display: flex; flex-direction: column; line-height: 1.5;}
ul.anchor_list_b {
  > li:first-child {border-top: solid 1px var(--bg-gry-a);}
  > li {z-index: 1; border-bottom: solid 1px var(--bg-gry-a);}
  > li a {display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: .5em 0; text-decoration: none; color: inherit; min-height: 3em;}
  > li a::after {content: ""; width: 24px; height: 24px; flex-shrink: 0; mask: var(--ui-link-anchor) center / 24px no-repeat; background-color: var(--c-main);}
  > li a:hover {color: var(--c-hover); text-decoration: underline;}
  > li ul.anchor_list_b {padding-left: 1.5em;}
  > li ul.anchor_list_b > li:last-child {border: none;}
}

.box_a.bg_main_g {
  ul.anchor_list_b {
    > li a {color: #fff;}
    > li a::after {background-color: #fff;}
  }
}

.box_a.bg_main_g:has(ul.anchor_list_b) {
  ul.anchor_list_b > li {border-color: rgba(255, 255, 255, .2);}
}

.box_a:has(ul.anchor_list_b),
.box_a:has(ul.summary_list_a) {
  padding-top: 16px; padding-bottom: 16px;
}

@media (min-width: 600px) {
  .box_a:has(ul.anchor_list_b),
  .box_a:has(dl.summary_list_a) {padding: 24px;}
  ul.anchor_list_b > li > ul.anchor_list_b {padding-left: 3em;}
}

}
/* ==================================
 card A
================================== */

body {

.card_list_a,
.card_list_b {margin: 3em 0; display: grid; gap: 16px;}

[class*="card_list_"]:last-child {margin-bottom: 0;}

[class*="card_list_"] .card_item {
  .txt_wrap h2,
  .txt_wrap h3,
  .txt_wrap h4,
  .txt_wrap h5,
  .txt_wrap h6,
  .txt_wrap p,
  .txt_wrap ul,
  .txt_wrap ul[class*="link_"] {margin: 0;}
  .txt_wrap p + p:not(.title),
  .txt_wrap p + p:not(.catch) {margin-top: 1em;}
  .txt_wrap p.title + p {margin-top: 8px;}
  .txt_wrap p.catch + p.title {margin-top: 8px;}
  .txt_wrap ul.btn_list_a {align-items: flex-start;}
  .txt_wrap p:not(.title):not(.catch) {color: var(--c-gry);}
}

.card_list_a {
  .card_item {display: flex; margin: 0; flex-direction: column; position: relative; background-color: #fff; border-radius: 16px; overflow: hidden; border: solid 1px var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
  .card_item {
    > .inner {height: 100%; display: flex; flex-direction: column; position: relative; gap: 0;}
    > .inner > * {margin: 0;}
    > .inner > :first-child {margin-top: 0;}
    > .inner > :last-child {margin-bottom: 0;}

    .img_wrap {padding: 24px 24px 0; flex-shrink: 0; text-align: center;}
    .img_wrap > div {aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; max-height: 400px; width: 100%; text-align: center;}
    .img_wrap > div:has(img.of_sd) {background-color: var(--bg-sub-a);}
    .img_wrap img {object-fit: cover; object-position: center center; width: 100%; height: 100%;}
    .txt_wrap {padding: 16px 24px 24px; display: flex; flex-direction: column; gap: 16px;}
    .title {font-size: 2.2rem; font-weight: bold; margin: 0; line-height: 1.5; /* max-height: 4.5em; overflow: hidden; */}
    a._expand::before,
    button._expand::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1;}

    .lower_inner {border-top: solid 1px var(--bg-gry-a); flex-shrink: 0;}
    .lower_inner button {min-height: 3em; line-height: 1; width: 100%; border: none; background-color: #fff; color: var(--c-link);}
    .lower_inner button.add_list {display: flex; justify-content: center; align-items: center; gap: 2px;}
    .lower_inner button.add_list::after {content: ""; width: 20px; height: 20px; mask: url(/assets/img/icon_list_add.svg) center / 20px no-repeat; background-color: var(--c-link);}
    .lower_inner button:hover {background-color: var(--bg-hover-b);}
    .lower_inner button.icon_blank:hover {text-decoration: underline;}
  }

  .card_item.label_a::before {content: "オススメ"; padding: 5px 5px 9px; line-height: 1; font-size: 1.2rem; height: 2.5em; position: absolute; top: -1px; left: 32px; color: #fff; background-color: var(--c-main); z-index: 1; mask: url(/assets/img/label_a.svg) bottom center / cover no-repeat;}
  .card_item.label_a {border-color: var(--bg-main-b); box-shadow: var(--box-shadow-a), var(--box-shadow-b), 0px 0px 0px 1px var(--bg-main-b);}
}

@media (min-width: 960px) {
  .card_list_a,
  .card_list_b {gap: 32px;}
}
.card_item:has(a._expand:hover),
.card_item:has(button._expand:hover) {background-color: var(--bg-hover-b); transition: .3s;}
.card_item:has(a._expand:hover) .img_wrap img {transform: scale(1.1);}

/* a */

@media (min-width: 960px) {
  .card_list_a._col1 .card_item {min-height: 365px;}
  .card_list_a._col1 .card_item {
    > .inner {display: flex; flex-direction: row; gap: 0; align-items: center;}
    .inner > * {width: 50%; flex-shrink: 1;}
    .txt_wrap {padding: 24px;}
    .img_wrap {align-self: stretch; padding-bottom: 24px; padding-right: 0;}
    .img_wrap > div {height: 100%;}
  }
}

.card_list_a._fit {
  .card_item .img_wrap {padding: 0;}
  .card_item .txt_wrap {padding: 16px;}
  .card_item .txt_wrap .title {font-size: 1.8rem;}
  .card_item .img_wrap > div {border-radius: 0;}
}

.card_list_a._dl .card_item {
.img_wrap > div {padding: 7%;}
.img_wrap > div img {object-fit: contain; width: auto;}
}

/* columns */
.card_list_a._fit._col4 {grid-template-columns: repeat(2, 1fr);}

@media (max-width: 959px) {
.card_list_a._fit[class*="_col"] {grid-template-columns: repeat(2, 1fr);}
.card_list_a._fit[class*="_col"] .card_item {border-radius: 8px;}
.card_list_a._fit[class*="_col"] .card_item .title {font-size: 1.6rem;}
.card_list_a._fit._col1 {grid-template-columns: repeat(2, 1fr);}
}

@media (max-width: 599px) {
/* .card_list_a._fit[class*="_col"] .card_item .text {display: none;} */
.card_list_a._fit[class*="_col"] .card_item .txt_wrap {padding: 8px; gap: 8px;}
}

@media (min-width: 600px) {
.card_list_a._col2:not(._var_c ),
.card_list_a._col3:not(._var_c ),
.card_list_a._col4:not(._var_c ) {grid-template-columns: repeat(2, 1fr);}
.card_list_a._fit._col1 .card_item .txt_wrap {padding: 24px;}
.card_list_a._fit._col1 .card_item .title {font-size: 2.4rem;}
}

@media (min-width: 960px) {
.card_list_a._col3:not(._var_c ) {grid-template-columns: repeat(3, 1fr);}
.card_list_a._fit._col4:not(._var_c ) {grid-template-columns: repeat(4, 1fr);}
}

/* variation a */
.card_list_a._var_a .card_item .txt_wrap {padding: 16px 32px; gap: 8px;}
.card_list_a._var_a .card_item .txt_wrap .title {font-size: 1.8rem;}

.card_list_a._info .card_item > .inner > .txt_wrap {padding: 24px; gap: 8px;}
.card_list_a._info .card_item .txt_wrap .item {display: flex; flex-direction: column; gap: 8px;}
.card_list_a._info .card_item .txt_wrap ul.link_list_a {margin-top: 8px;}

@media (max-width: 599px) {
.card_list_a._var_a .card_item .txt_wrap {padding: 16px;}
.card_list_a._var_a .card_item .lower_inner button {min-height: 2.5em;}
}

@media (min-width: 600px) {
.card_list_a._var_a._col2:not(._var_c ) {grid-template-columns: repeat(2, 1fr);}
.card_list_a._var_a._info .card_item .txt_wrap .item {flex-direction: row; align-items: center; gap: 24px;}
.card_list_a._var_a._info .card_item .txt_wrap  p.date {flex-shrink: 0;}
}

@media (min-width: 960px) {
.card_list_a._col3:not(._var_c ) {grid-template-columns: repeat(3, 1fr);}
.card_list_a._col4:not(._var_c ) {grid-template-columns: repeat(4, 1fr);}
}





/* variation b */
.card_list_a._var_b .card_item {
  .catch {color: var(--c-main);}
  .btn_list_a a {min-width: 10em;}
}

@media (min-width: 600px) {
.card_list_a._var_b .card_item {
    > .inner {display: flex; flex-direction: row; gap: 0; align-items: flex-start;}
    .img_wrap {padding-right: 0; padding-bottom: 24px; align-self: flex-start; flex-shrink: 0; border-radius: 8px;}
    .img_wrap > div,
    .img_wrap > i {max-height: initial; width: 175px; aspect-ratio: 170 / 96;}
    .img_wrap > i {display: grid; align-items: center; justify-content: center;}
    .txt_wrap {padding: 24px; display: flex; justify-content: space-between; width: 100%; align-self: stretch;}
    .title {font-size: 2rem;}
    .catch {color: var(--c-main); margin-bottom: .5em;}
    .btn_list_a {flex-shrink: 0;}
    .btn_list_a {flex-direction: column; }
  }
}

@media (min-width: 1024px) {
	.card_list_a._var_b .card_item .txt_wrap {flex-direction: row; align-items: center;}
}

/* type c */
.card_list_a._var_c .card_item {
  > .inner {display: flex; flex-direction: row; gap: 0; align-items: flex-start;}
  .img_wrap {padding-right: 0; padding-bottom: 24px; align-self: flex-start; flex-shrink: 0;}
  .img_wrap > div,
  .img_wrap > i {max-height: initial; width: 120px; aspect-ratio: 100 / 56; border-radius: 8px;}
  .img_wrap > i {display: grid; align-items: center; justify-content: center;}
  .img_wrap > i > img {object-fit: initial; width: 56px; height: 56px;}
  .txt_wrap {padding: 24px; flex: 1;}
  .title {font-size: 2rem;}

  .img_wrap > div._img_a {height: auto; aspect-ratio: auto; border-radius: 0; overflow: visible;}
  .img_wrap > div._img_a img {transform: none;}
  .img_wrap > div._img_b:has(img[src*="icon_"]) {display: grid; align-items: center; justify-content: center;}
  .img_wrap > div._img_b img[src*="icon_"] {object-fit: initial; width: 48px; height: auto;}

}

@media (min-width: 960px) {
.card_list_a._var_c._col2,
.card_list_a._var_c._col3 {grid-template-columns: repeat(2, 1fr);}
}

@media (min-width: 1024px) {
.card_list_a._var_c._col3 {grid-template-columns: repeat(3, 1fr);}
}

/* type d */
.card_list_a._var_d {gap: 0;}
.card_list_a._var_d .card_item {border-radius: 0; border-width: 0 0 1px; background-color: transparent !important; gap: 0; box-shadow: none; border-color: var(--bg-gry-a);}
.card_list_a._var_d .card_item:first-child {border-top-width: 1px;}
.card_list_a._var_d .card_item {
  > .inner {display: flex; flex-direction: row; gap: 0; align-items: flex-start; padding: 24px 0; gap: 24px;}
  .img_wrap {padding-right: 0; padding: 0; align-self: flex-start; flex-shrink: 0; border-radius: 16px;}
  .img_wrap > div {max-height: initial; width: 160px; aspect-ratio: 160 / 120;}
  .txt_wrap {padding: 0;}
  .title {font-size: 1.8rem;}
}
.card_list_a._var_d.c_wht .txt_wrap p {color: #fff !important;}

@media (min-width: 1024px) {
  .card_list_a._var_d {display: flex; gap: 32px; flex-wrap: wrap;}
  .card_list_a._var_d .card_item {width: calc((100% - 32px) / 2); border-top-width: 1px;}
  .card_list_a._var_d .card_item > .inner {gap: 24px;}
}
@media (min-width: 1024px) {
  .card_list_a._var_d {flex-wrap: nowrap;}
}

.card_list_a._var_d.c_wht .card_item {border-color: rgba(255, 255, 255, .2);}
.card_list_a._var_d.c_wht .card_item .link_list_a a {color: inherit;}
.card_list_a._var_d.c_wht .card_item .link_list_a a::after {background-color: #fff;}


/* type e */
@media (min-width: 960px) {
  .card_list_a._var_e .card_item {min-height: initial;}
  .card_list_a._var_e .card_item > .inner {flex-direction: row-reverse; align-items: flex-start;}
  .card_list_a._var_e .card_item > .inner > * {width: auto;}
  .card_list_a._var_e .card_item > .inner .txt_wrap {padding: 32px;}
  .card_list_a._var_e .card_item > .inner .img_wrap {padding: 32px 32px 32px 0; width: 363px; flex-shrink: 0;}
  .card_list_a._var_e .card_item > .inner .img_wrap > div {border-radius: 0; height: initial;}
}





}



/* ==================================
 card B
================================== */

body {

.card_list_b {
  .card_item {background-color: #fff; border-radius: 16px; overflow: hidden; border: solid 1px var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
  .card_item {
    > .inner {display: flex; flex-direction: column; position: relative; gap: 16px; padding: 24px; height: 100%;}
    > .inner > * {margin: 0;}
    > .inner:has( > ul.link_list_a:only-child) {justify-content: center;}
    .tit_wrap {display: flex; width: 100%; justify-content: space-between; gap: 16px;}
    .img_wrap > div {width: 100%;}
    .img_wrap > div.image {aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px;}
    .img_wrap img {object-fit: cover; object-position: center center; width: 100%; height: 100%;}

    .title {line-height: 1.5; font-weight: bold; margin: 0;}
    .title i {font-size: 1.2rem; color: var(--c-main); line-height: 1; display: inline-block; border-radius: 1em; background-color: var(--bg-main-a); padding: .5em; min-width: 6.5em; text-align: center; margin-bottom: 1rem;}
    .title em {font-size: 2.4rem;}
    .icon_wrap {flex-shrink: 0; width: 40px; height: 40px;}
    .txt_wrap {display: flex; flex-direction: column; gap: 16px;}
    .txt_wrap hr {margin: 0;}
    .txt_wrap .link_list_a {margin: 8px 0;}
    .icon_wrap img {object-fit: contain; object-position: center center; width: 40px; height: 40px;}
    .icon_wrap + ul.link_list_a a {color: inherit;}
    ul.link_list_a a:hover {color: var(--c-hover);}
    ul.link_list_a a._expand::before,
    ul.link_list_a button._expand::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}

  }
}

@media (min-width: 600px) {
	.card_list_b._col1 .card_item:has(.inner > .img_wrap) {
	  > .inner {display: grid; gap: 16px 32px;}
	 .tit_wrap {grid-column-start: 1; grid-column-end: 3;}
	}
}

.card_list_b._sm {
  .card_item > .inner {padding: 16px;}
  .card_item .link_list_a {margin: 0;}
}

}


/* columns */

.card_list_b._sm._col3,
.card_list_b._sm._col4 {grid-template-columns: repeat(2, 1fr);}

@media (min-width: 600px) {
.card_list_b._col2 {grid-template-columns: repeat(2, 1fr);}
.card_list_b._col3 {grid-template-columns: repeat(2, 1fr);}

.card_list_b._col4 {grid-template-columns: repeat(2, 1fr);}

.card_list_b._col4:not(._sm) {gap: 16px;}
.card_list_b._col4 .tit_wrap:has(.icon_wrap) {flex-direction: column; gap: 8px;}
.card_list_b._col4 .tit_wrap .title em {font-size: 2rem;}
}

@media (min-width: 960px) {
.card_list_b._col3,
.card_list_b._sm._col3 {grid-template-columns: repeat(3, 1fr);}
.card_list_b._col4,
.card_list_b._sm._col4 {grid-template-columns: repeat(4, 1fr);}
}

/* card_list_c */
ul.card_list_c {display: grid; gap: 16px; list-style: none; padding: 0;}
ul.card_list_c {
	a {display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 100%; text-decoration: none; border-radius: 16px; padding: 24px 16px 24px 32px;}
	a {color: var(--c-link); background-color: #fff; border: solid 1px var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
	a > :first-child {margin-top: 0;}
	a > :last-child  {margin-bottom: 0;}
	a::after {content: ""; width: 24px; height: 24px; flex-shrink: 0; background-color: var(--c-link); mask: var(--ui-link-arrow) center / 20px no-repeat; transition: transform .3s;}
	a:hover {color: var(--c-hover); background-color: var(--bg-hover-b); box-shadow: var(--box-shadow-a-hover), var(--box-shadow-b-hover);}
	a:hover::after {background-color: var(--c-hover); transform: translateX(2px);}
	a[target="_blank"]::after {mask-image: var(--ui-link-blank);}
	.title {display: inline-block; font-size: 1.8rem; font-weight: bold;}
	.catch {display: inline-block; font-size: 1.2rem; color: var(--c-text);}
}

@media (min-width: 600px) {
  ul.card_list_c._col2,
  ul.card_list_c._col3 {grid-template-columns: repeat(2, 1fr);}
}

@media (min-width: 960px) {
  ul.card_list_c._col3 {grid-template-columns: repeat(3, 1fr);}
}

ul.card_list_c .inner {display: flex; gap: 16px;}
ul.card_list_c .inner > i {flex-shrink: 0; width: 32px; height: 32px;}
ul.card_list_c .inner > i img {object-fit: contain; width: 100%; height: 100%;}

/* cv */
.card_list_cv {display: flex; flex-direction: column; gap: 16px; margin: 3em 0;}
.card_list_cv + .card_list_cv {margin-top: calc(-3em + 16px);}
.card_list_cv {
  .card_item {background-color: #fff; border-radius: 16px; overflow: hidden; border: solid 1px var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
  .card_item {
    > .inner {display: flex; flex-direction: column; align-items: center; justify-content: space-between; position: relative; gap: 16px; padding: 24px; height: 100%;}
    > .inner > * {margin: 0;}
    .icon_wrap {flex-shrink: 0; width: 48px; height: 48px;}
    .icon_wrap img {object-fit: contain; object-position: center center; width: 48px; height: 48px;}
    .txt_wrap {text-align: center;}
    .txt_wrap > * {margin: 0;}
    .btn_list_a {width: 100%; margin-top: .5em;}
    a._expand::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
  }
}
@media (min-width: 600px) {
.card_list_cv {flex-direction: row; justify-content: center;}
.card_list_cv > * {flex: 1; width: 100%; max-width: 640px;}
.card_list_cv._col3 {flex-wrap: wrap;}
.card_list_cv._col3 > * {flex: initial; width: calc((100% - 16px) / 2);}
.card_list_cv + .card_list_cv {margin-top: calc(-3em + 16px);}
}

@media (min-width: 960px) {
.card_list_cv {gap: 32px;}
.card_list_cv + .card_list_cv {margin-top: calc(-3em + 32px);}
.card_list_cv._col3 > * {flex: initial; width: calc((100% - 32px) / 2);}
}

@media (min-width: 1024px) {
.card_list_cv._col3 {flex-wrap: nowrap;}
}

/* tag pointer off */
@media (max-width: 959px) {
  .card_item .tag_list_a {z-index: 0;}
  .card_item .tag_list_a a {pointer-events: none;}
}
@media (min-width: 960px) {
  .card_item .tag_list_a {z-index: 2;}
}


[class*="card_list_"] .card_item .card_item {box-shadow: none; border-radius: 8px;}


/* ==================================
 list
================================== */

body {

ul.ul_a,
ul.ul_att {margin: 2em 0; display: flex; flex-direction: column; gap: .5em; padding-left: 1.5em;}

table ul.ul_a,
table ul.ul_att {margin: 1rem 0;}

ul.ul_a {list-style: disc;}
ul.ul_a > li,
ul.ul_att > li {margin: 0; position: relative;}

ul.ul_a {list-style: none;}
ul.ul_a > li:before {content: ""; width: 1.5em; height: 1em; position: absolute; left: -1.5em; top: .35em; background-color: var(--bg-blk-b); mask: var(--list-disc) center / .4em no-repeat;}
table ul.ul_a > li:before {top: .2em;}

ul.ul_a._mk_a > li:before {background-color: var(--c-main);}
ul.ul_a._mk_b > li:before {height: 1.2em; top: .25em;
mask: url(/assets/img/icon/icon_check_circle.svg) left center / contain no-repeat; background-color: var(--c-main);}

ul.ul_a._var_a {padding-left: 0;
li {display: flex;}
li::before {display: none;}
li > i {flex-shrink: 0; min-width: 2em; font-weight: bold;}
}

ul.ul_att {list-style: none; color: var(--c-gry); font-size: 1.2rem;}
ul.ul_att > li:before {content: "※"; position: absolute; left: -1.5em;}

ul.ul_att._var_a {padding-left: 0;
li {display: flex; gap: .5em;}
li::before {display: none;}
li > i {flex-shrink: 0; min-width: 1em; font-weight: bold; text-align: center;}
}

ul[class*="ul_"]:first-child{margin-top: 0;}
ul[class*="ul_"]:last-child{margin-bottom: 0;}

ol.ol_a,
ol.ol_att {margin: 2em 0; display: flex; flex-direction: column; gap: 1em; padding-left: 2.5rem;}
ol.ol_a > li,
ol.ol_a > li {margin: 0;}

ol.ol_a,
ol.ol_att {counter-reset: num_li; list-style: none;}
ol.ol_a > li,
ol.ol_att > li {position: relative;}
ol.ol_a > li:before,
ol.ol_att > li:before {counter-increment: num_li; position: absolute;}

ol.ol_a {padding-left: 2em;}
ol.ol_att {padding-left: 3em; color: var(--c-gry); font-size: 1.2rem;}
ol.ol_a > li:before {content: counter(num_li)"."; left: -2em; width: 1.5em; text-align: right; font-weight: bold; white-space: nowrap;}
ol.ol_att > li:before {content: "※"counter(num_li); left: -3em;}
ol.ol_a._par {padding-left: 3em;}
ol.ol_a._par > li:before {content: "("counter(num_li)")"; left: -3em; width: auto; text-align: left; font-weight: bold; white-space: nowrap;}

ol[class*="ol_"]:first-child{margin-top: 0;}
ol[class*="ol_"]:last-child{margin-bottom: 0;}

.ul_att .em_a,
.ol_att .em_a,
.ul_att > li.em_a em,
.ol_att > li.em_a em {color: var(--c-red)}

ol[start="2"] {counter-reset: num_li 1;}
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;}

.li_a::before {content: "＊" !important;}
.li_b::before {content: "◎" !important;}
.li_c::before {content: "★" !important;}

li > ul[class*="ul_"],
li > ul[class*="ol_"] {margin: 1em 0;}

dl.dl_a {margin: 1.5em 0;}
dl.dl_a > dt,
dl.dl_a > div > dt {margin: 1.5em 0 .5em; font-weight: bold;}
dl.dl_a > dd,
dl.dl_a > div > dd {margin: 0; margin-top: .5em;}
dl.dl_a > dt:first-child {margin-top: 0;}

ul.ul_att + ul.ul_att,
ul.ul_att + ol.ol_att,
ol.ol_att + ul.ul_att {margin-top: -1em;}

ul.col_a {display: grid; grid-template-columns: repeat(auto-fill, minmax(6em, 1fr));  gap: .5em 2em;}
ul.col_b {display: grid; grid-template-columns: repeat(auto-fill, minmax(10em, 1fr)); gap: .5em 2em;}
ul.col_c {display: grid; grid-template-columns: repeat(auto-fill, minmax(15em, 1fr)); gap: .5em 2em;}
ul.col_d {display: grid; grid-template-columns: repeat(auto-fill, minmax(20em, 1fr)); gap: .5em 2em;}
ul[class*="col_"] > li {padding-right: 1em;}
}


/* ==================================
 index
================================== */

.idx_b {margin: 3em 0; background-color: white; border-radius: 16px; display: grid; overflow: hidden;}
.idx_b > .inner {padding: 24px; border: solid 1px var(--bg-gry-a); border-width: 0 0 1px 0; display: flex; flex-direction: column; gap: 16px; flex: 1;}
/* .idx_b > .inner:last-child {border-bottom-width: 0;} */
.idx_b > .inner > * {margin: 0;}

@media (min-width: 960px) {
	.idx_b._col2,
	.idx_b._col4 {grid-template-columns: repeat(2, 1fr);}
	.idx_b._col2 > .inner:nth-child(odd),
	.idx_b._col4 > .inner:nth-child(odd) {border-right-width: 1px;}
}

@media (min-width: 1024px) {
.idx_b._col4 {grid-template-columns: repeat(4, 1fr);}
.idx_b._col4 > .inner {border-right-width: 1px;}
}

/* ==================================
 box
================================== */

body {

.box_a {margin: 3em 0; padding: 32px 16px; background-color: var(--bg-gry-a);}
.box_a.bs_s {padding: 32px 15px;}
.box_a[class*="box_s_"] {background-color: #fff;}

.box_a > :first-child {margin-top: 0;}
.box_a > :last-child {margin-bottom: 0;}

[class*="box_"] {border-radius: 16px;}

.box_a.bg_main_g._fixed_bg_sp {margin: 32px -16px; border-radius: 0;}
.box_a.bg_main_g._fixed_bg_sp:first-child {margin-top: 0;}
.box_a.bg_main_g._fixed_bg_sp:last-child {margin-bottom: 0;}

.box_a._pdf {padding: 16px; display: flex; gap: 16px; flex-direction: column;}
.box_a._pdf p {margin: 0; font-size: 1.4rem;}
.box_a._pdf > div {flex-shrink: 0;}
@media (min-width: 960px) {
.box_a._pdf {gap: 32px; padding: 24px; flex-direction: row;}
}


.box_a {
  .box_inner {background-color: #fff; padding: 24px 16px; border-radius: 8px;}
}

@media (min-width: 600px) {
  .box_a {padding: 32px;}
  .box_a.bs_s {padding: 32px 31px;}
  .box_a.bg_main_g._fixed_bg_sp {margin: 3em 0; border-radius: 16px;}
  .box_a .box_inner {padding: 24px;}
}

.box_b {background-color: #fff; overflow: hidden;}
.box_b {
	> .title {text-align: center; padding: 8px; min-height: 48px; font-size: 16px; display: flex; align-items: center; justify-content: center; font-weight: bold; margin: 0;}
	> .inner {padding: 24px 16px; display: flex; flex-direction: column;}
}

[class*="lay_col2"] > .box_b {display: flex; flex-direction: column;}
[class*="lay_col2"] > .box_b {
	> .inner {flex: 1; flex-direction: column; justify-content: space-between;}
}


@media (min-width: 600px) {
.box_b > .inner {padding: 32px 40px;}
}

[class^="box_a"]:first-child,
[class^="box_b"]:first-child {margin-top: 0;}
[class^="box_a"]:last-child,
[class^="box_b"]:last-child {margin-bottom: 0;}

[class*="box_"] > [class*="box_"] {border-radius: 8px;}

}




/* ==================================
 table
================================== */

body {

table {margin: 2em 0; width: 100%; border-collapse: collapse; line-height: 1.5;}
table th > :first-child,
table td > :first-child {margin-top: 0;}
table th > :last-child,
table td > :last-child {margin-bottom: 0;}
th._txt_v {text-align: center !important;}
th._txt_v > span,
td._txt_v > span {display: inline-block; word-break: break-all; line-height: 1.2; max-width: 1em; text-align: center;}

table.tbl_a {border-radius: 16px; overflow: clip; box-shadow: var(--box-shadow-a), var(--box-shadow-b);}

table.tbl_a {
  th,
  td {padding: 16px; background-color: #fff; border: solid 1px var(--bg-gry-a);}
  > thead > tr > th {font-weight: bold; background: var(--bg-main-b); color: #fff;}
  > tbody > tr > th {font-weight: bold; background: var(--bg-sub-a); text-align: left;}
}

table.tbl_a._odd  tbody > tr:nth-child(odd) > * {background-color: var(--bg-sub-a);}
table.tbl_a._even tbody > tr:nth-child(even) > * {background-color: var(--bg-sub-a);}
table.tbl_a table.tbl_a {box-shadow: var(--box-shadow-b); border-radius: 8px;}
[class*="accordion_list_"] table.tbl_a {box-shadow: var(--box-shadow-b);}

@media (min-width: 600px) {
  table.tbl_a:not(._sm) th,
  table.tbl_a:not(._sm) td {padding: 16px 24px;}
}

table.tbl_a._sm {font-size: 1.4rem;}
table.tbl_a._sm th,
table.tbl_a._sm td {padding: 10px;}

table.td_ta_c > tbody > tr > td {text-align: center;}

@media (max-width: 599px) {
  table.tbl_a._sp > tr > th,
  table.tbl_a._sp > tbody > tr > th,
  table.tbl_a._sp > tr > td,
  table.tbl_a._sp > tbody > tr > td {display: block; border-width: 0; width: 100% !important;}
  table.tbl_a._sp > thead > tr > th {display: block;}
	table.tbl_a._sp > colgroup {display: none !important;}
  table.tbl_a._sp > tr > th,
  table.tbl_a._sp > tbody > tr > th {border-top-width: 1px;}
  table.tbl_a._sp > tbody > tr > td {border-top-width: 1px;}
  table.tbl_a._sp > tbody > tr > th + td {border-top-width: 0;}

  table.tbl_a._sp > tbody > tr:only-child > th + td {border-top-width: 1px;}
}


}

table[class*="tbl_"].ta_c > tbody > tr > th,
table[class*="tbl_"].ta_c > tbody > tr > td,
table[class*="tbl_"] tr.ta_c > tr > th,
table[class*="tbl_"] tr.ta_c > tr > td {text-align: center;}

table[class*="tbl_"].va_t > tbody > tr > th,
table[class*="tbl_"].va_t > tbody > tr > td,
table[class*="tbl_"] tr.va_t > tr > th,
table[class*="tbl_"] tr.va_t > tr > td {vertical-align: top;}

table.tl_f {table-layout: fixed;}
@media (min-width: 600) {
  table.tl_f_tb {table-layout: fixed;}
}
@media (min-width: 1024px) {
  table.tl_f_pc {table-layout: fixed;}
}

th.va_t,
td.va_t {vertical-align: top;}

.scroll_wrap {margin: 2em 0; position: relative; overflow: auto; border-radius: 16px 16px 0 0; box-shadow: var(--box-shadow-a), var(--box-shadow-b);
	  ::-webkit-scrollbar {width: 5px;}
	  ::-webkit-scrollbar-track {background: #fff; box-shadow: 0 0 2px #ccc inset}
	  ::-webkit-scrollbar-thumb {background: var(--bg-main-a);}
	  ::-webkit-scrollbar-thumb:hover {background: var(--bg-gry-b);}
  scrollbar-width: thin; scrollbar-color: var(--bg-main-a) #fff;}
.scroll_wrap::before {content: "スクロールします"; display: flex; position: absolute; right: 8px; top: 8px; border-radius: 8px; color: #fff; font-size: 1.2rem; line-height: 1; padding: 6px;  transition: opacity .3s; font-feature-settings: "palt"; background: url("/assets/img/ui_nav_arrow_wht.svg") no-repeat rgba(0, 0, 0, .6) center right 5px / 9px 9px; padding-right: 18px;}
.scroll_wrap.scroll::before {opacity: 0;}

table + table,
.scroll_wrap + table,
.scroll_wrap + .scroll_wrap,
table + .img_wrap,
.scroll_wrap + .img_wrap {margin-top: 3em;}

@media (min-width: 960px) {
	.scroll_wrap::before {opacity: 0;}
}
@media (min-width: 600px) {
	.scroll_wrap._sp::before {opacity: 0;}
}

.scroll_wrap > :first-child,
.scroll_wrap:first-child {margin-top: 0;}

.scroll_wrap > :last-child,
.scroll_wrap:last-child {margin-bottom: 0;}

.scroll_wrap + .scroll_wrap  {margin-top: 3em;}

div.scroll_wrap._sp > table {min-width: 620px;}
div.scroll_wrap > table {min-width: 940px;}

@media (min-width: 600px) {
  div.scroll_wrap._sp {overflow: initial; box-shadow: none;}
  div.scroll_wrap._sp > table {min-width: auto;}
}

@media (min-width: 960px) {
  div.scroll_wrap {overflow: initial; box-shadow: none;}
  div.scroll_wrap > table {min-width: auto;}
}





/* ==================================
 local navi
================================== */

body {
nav.nav_local::before {content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: var(--bg-main-g);}
ul.local_menu_cv {flex-direction: row;}
nav.nav_local ul.local_menu > li > a.is_current {pointer-events: none;}
nav.nav_local ul.local_menu > li > a.is_current::after {background-color: var(--bg-gry-b);}
nav.nav_local {
	input {position: absolute; left: 0; top: 0; opacity: 0;}
	ul.btn_list_a {line-height: 1.1; margin: 0; flex-wrap: nowrap;}
	div.sub_menu ul.btn_list_a li a.is_current {pointer-events: none; color: var(--c-hover); background-color: var(--bg-hover-b);}
}

@media (min-width: 1024px) {
main:has(nav.nav_local) .sticky_item {top: 56px;}
button#local_menu_toggle {display: none;}
nav.nav_local {max-width: 1200px; padding: 10px 16px; margin: 0 auto; display: flex; gap: 1em; justify-content: space-between;}
nav.nav_local {position: sticky; top: 0; z-index: 99;}
nav.nav_local::before {content: ""; position: absolute; z-index: 0; left: calc((100vw - 100%) / -2); top: 0; width: 100vw; height: 100%; box-shadow: var(--box-shadow-c);}
nav.nav_local {
	button {display: none;}
	ul.local_menu {flex-direction: row; gap: 6px;}
	ul.local_menu_cv {display: flex; gap: 8px; position: relative;}
	ul.local_menu button {display: flex; align-items: center; justify-content: center; height: 100%; color: #fff; border: solid 1px #fff; border-radius: 8px;}
	ul.local_menu > li {position: relative;}
	ul.local_menu > li.bl_d {border-left: dotted 1px #fff; margin-left: 4px; padding-left: 12px;}
	ul.local_menu > li > a,
	ul.local_menu > li > button {min-width: 6em; background-color: transparent; border-color: transparent; color: #fff; display: flex; align-items: center; gap: 4px; transition: border-color .3s;}
	ul.local_menu > li > button span::after {content: "開く"; font-size: 10px; color: transparent; position: absolute;}
	ul.local_menu > li > button:hover {text-decoration: underline;}
	ul.local_menu > li > button::after {content: ""; width: 20px; height: 20px; mask: var(--ui-link-arrow) center / 100% no-repeat; transform: rotate(90deg); background-color: #fff; transition: transform .3s;}
	ul.local_menu > li > a,
	ul.local_menu > li > button,
	ul.local_menu_cv > li > a {padding: 0 12px; min-height: 40px;}
	ul.local_menu_cv > li {flex-shrink: 0;}
	ul.local_menu > li > a.is_current,
	ul.local_menu > li > button.is_current {border-color: #fff; background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(24, 108, 255, .7)) !important;}
	ul.local_menu > li > a::after {display: none;}

	ul.local_menu div.sub_menu {position: absolute; top: calc(100% + 24px); left: -6px; width: 20em; transition: opacity .3s;}
	ul.local_menu div.sub_menu ul.btn_list_a {border-radius: 10px; gap: 0; border: solid 1px var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b);}

	ul.local_menu button:not(.is_active) + div.sub_menu {height: 0; opacity: 0; overflow: hidden;}
	ul.local_menu button:not(.is_active) + div.sub_menu ul.btn_list_a {display: none;}
	ul.local_menu button.is_active::after {transform: rotate(270deg);}
	ul.local_menu button.is_active span::after {content: "閉じる";}

	div.sub_menu ul.btn_list_a li a {border-radius: 0; border-width: 0 0 1px 0; padding: 5px 16px; justify-content: space-between; border-color: var(--bg-gry-a);}
	div.sub_menu ul.btn_list_a li:first-child a {border-radius: 8px 8px 0 0;}
	div.sub_menu ul.btn_list_a li:last-child a {border-radius: 0 0 8px 8px;}
	div.sub_menu ul.btn_list_a li:only-child a {border-radius: 8px;}
}
}

@media (max-width: 1023px) {
nav.nav_local {z-index: 100;}
nav.nav_local {height: 64px; position: fixed; left: 0; bottom: 0; width: 100%; display: flex; flex-direction: row-reverse; padding: 8px; gap: 8px;}
nav.nav_local::before {z-index: 2;}
/* overlay */
nav.nav_local::after {content: ""; position: fixed; left: 0; top: 0; height: 0; width: 100dvw; background-color: rgba(0, 0, 0, 0.7); transition: background-color .3s;}

nav.nav_local {
	ul.local_menu {box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
	ul.local_menu_cv {margin: 0; gap: 8px;}
	> button {background: #fff; width: 48px; height: 48px; flex-shrink: 0; border: solid 1px var(--bg-gry-a); border-radius: 8px; line-height: 1; font-size: 10px; color: transparent; position: relative; z-index: 2;}
	> button {display: flex; align-items: center; justify-content: center;}
	> button::after {content: "開く"; font-size: 10px; position: absolute;}
	> button::after {content: "閉じる";}
	> button i {position: relative; margin: 0 auto;}
	> button i,
	> button i::before,
	> button i::after {height: 2px; width: 24px; border-radius: 2px; background: var(--c-text); transition: all .2s;}
	> button i::before,
	> button i::after {content: ""; position: absolute; left: 0; bottom: 8px; z-index: 10;}
	> button i::after {top: 8px;}
	> button:hover i,
	> button:hover i::before,
	> button:hover i::after {background-color: var(--c-link);}

	ul.local_menu {position: fixed; left: 0; top: calc(100% - 64px); width: 100%; background-color: #fff; margin: 0; gap: 0; max-height: calc(100dvh - 64px); transition: .5s; overflow-y: auto; z-index: 1; box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
	ul.local_menu > li > a {font-weight: bold;}
	ul.local_menu {
		li {border-bottom: solid 1px var(--bg-gry-a);}
		li a {justify-content: space-between; border-radius: 0; border: none; color: inherit; padding: 4px 16px;}
		li a:hover {color: var(--c-link); text-decoration: none;}
		li button {font-weight: bold; min-height: 3em; color: inherit; border-radius: 0; border: none; display: flex; justify-content: flex-start; padding: 4px 16px; border-bottom: solid 1px var(--bg-gry-a); }
		li button::after {display: none;}
		div.sub_menu ul.btn_list_a {gap: 0;}
		div.sub_menu ul.btn_list_a li:last-child {border: none;}
		div.sub_menu ul.btn_list_a li a {padding-left: 1.5em;}
		div.sub_menu ul.btn_list_a li a > span {display: flex; align-items: center; gap: 6px;}
		div.sub_menu ul.btn_list_a li a > span::before {content: "┗"; color: #176CFF; flex-shrink: 0;}
		button {pointer-events: none;}
	}
	ul.local_menu button {pointer-events: none;}
	input#local_menu_toggle:checked ~ ul.local_menu {transform: translateY(-100%);}
	ul.local_menu_cv {width: 100%; position: relative; z-index: 2;}
	ul.local_menu_cv a {height: 48px; padding: 0 5px;}
	ul.local_menu_cv > * {flex: 1;}
}
nav.nav_local.toggle_open::after {height: 100dvh;}
nav.nav_local.toggle_open ul.local_menu {transform: translateY(-100%);}
nav.nav_local.toggle_open > button i {background-color: transparent;}
nav.nav_local.toggle_open > button i::before {transform: rotate(-45deg); bottom: 0; transform-origin: center;}
nav.nav_local.toggle_open > button i::after {transform: rotate(45deg); top: 0; transform-origin: center;}
}

}




/* ==================================
 modaal
================================== */

body {

/* 要確認 */
.modaal-container {max-width: 960px; border-radius: 16px; overflow: hidden;}
.js_modal_content {display: none;}
.modal_wrap > :first-child {margin-top: 0;}
.modal_wrap > :last-child {margin-bottom: 0;}
/* ここまで */

.modaal-inner-wrapper {padding-left: 16px; padding-right: 16px;}
.modaal-container:has(iframe) {height: 100%; max-height: 80vh;}
.modaal-close:before, .modaal-close:after {
    top: 8px;
    left: 18px;
    width: 2px;
    height: 20px;
    border-radius: 0;
    background: #fff;
    -webkit-transition: background-color 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out;
}
.modaal-close:focus,
.modaal-close:hover {background: transparent;}
.modaal-close:focus:before,
.modaal-close:focus:after,
.modaal-close:hover:before,
.modaal-close:hover:after {background: #fff;}

.modaal-inner-wrapper {padding-top: 32px; padding-bottom: 100px;}
.modaal-wrapper .modaal-close {border: solid 1px #fff; border-radius: 8px; top: auto; right: 20px; bottom: 8%; width: 40px; height: 40px;}
.modaal-overlay {opacity: .6 !important;}

@media (min-width: 1024px) {
.modaal-wrapper .modaal-close {right: calc((100% - 990px) / 2);}
}

}

/* ==================================
 form
================================== */

body {

button,
select,
textarea,
select,
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="list"] {font-family: inherit; font-size: inherit; letter-spacing: inherit; line-height: inherit; color: var(--c-text);}

label,
button,
input[type="button"],
input[type="submit"],
input[type="file"] {cursor: pointer;}

form > :first-child {margin-top: 0;}
form > :last-child {margin-bottom: 0;}

input[type="radio"],
input[type="checkbox"] {flex-shrink: 0;}
select {min-height: 2.5em; padding-left: .5em;}

/* placeholder */
::placeholder{color: #C9CCCF;}

/* iOS */
button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  box-sizing: border-box;
  appearance: button;
}

.form_a {

button,
select,
textarea,
select,
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="list"] {width: 100%; padding: 5px 16px; min-height: 3em; background-color: #fff; border: 1px solid var(--bg-gry-b); border-radius: 8px; transition: background-color .3s;}

/* disabled */
input[type="text"]:disabled,
input[type="tel"]:disabled,
input[type="email"]:disabled,
select:disabled,
textarea:disabled {background-color: var(--bg-gry-b);}

button,
input[type="submit"],
input[type="button"],
input[type="reset"] {width: auto; padding: 0 2em; min-width: 11em;}

button:disabled,
input[type="submit"]:disabled,
input[type="button"]:disabled,
input[type="reset"]:disabled {background-color: var(--bg-gry-a); border-color: var(--bg-gry-a); color: var(--c-disabled); cursor: default;}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%; padding-left: .5em; padding-right: 2em; position: relative;
  background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22a%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2216px%22%20height%3D%2216px%22%20viewBox%3D%220%200%2016%2016%22%20style%3D%22enable-background%3Anew%200%200%2016%2016%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%230071C5%3B%7D%3C%2Fstyle%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%228%2C11.9%201.9%2C5.8%203.7%2C4.1%208%2C8.4%2012.3%2C4.1%2014.1%2C5.8%20%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  background-position: right .6em top 50%;
  background-size: 0.9em auto, 100%;
}

button.icon_link,
input[type="submit"].icon_link,
input[type="button"].icon_link,
input[type="reset"].icon_link {color: inherit;}

@media (min-width: 600px) {
  input[type="radio"],
  input[type="checkbox"] {-webkit-transform: scale(1.3); transform: scale(1.3); margin: 0 .3em;}
}

@-moz-document url-prefix() {
  select {padding-top: 0.4em;}
}

/* エリア検索 */
div.area_search {margin: 1.5em 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1em;}
div.area_search:first-child {margin-top: 0;}
div.area_search:last-child {margin-bottom: 0;}
div.area_search {
  p.yubin button {flex-shrink: 0; padding: 0 .5em;}
  p.yubin {display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 1em; width: 100%; margin: 0;}
  p.yubin > .inner {display: flex; align-items: center; justify-content: center; gap: .5em; width: 100%; max-width: 400px;}

  button.search_link {border: none; display: flex; align-items: center; padding: 0; background-color: transparent; min-height: initial; min-width: initial; color: var(--c-link);}
  button.search_link:hover {color: var(--c-hover); text-decoration: underline;} 
  button.search_link::after {content: ""; width: 18px; height: 18px; background-color: var(--c-link); mask: var(--ui-link-blank) center / 16px no-repeat;}
  button.search_link.c_wht::after {background-color: #fff;}
}

@media (min-width: 1024px) {
  div.area_search {flex-direction: row; flex-wrap: nowrap;}
  div.area_search {
    p.yubin {flex-wrap: nowrap; width: auto;}
    p.yubin > .inner {width: 400px;}
    p.yubin + div {align-self: stretch; display: flex; align-items: center; padding-left: 1em; border-left: solid 1px var(--bg-gry-b);}
  }
}

div.list_form_a {display: flex; justify-content: center; margin: 24px 0;}
div.list_form_a ul {list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px;}
@media (min-width: 600px) {
	div.list_form_a ul {padding: 0; display: flex; flex-direction: row; gap: 40px;}
}

}


}


/* ==================================
 script-enabled
================================== */
html[data-script-enabled="true"] .local_nav a.js_dropdown_hook::before,
.local_nav ul.item_a a.js_dropdown_hook::before,
.local_nav ul.dropdown_content a::before,
.local_nav ul[class*="item"] > li.anc > a::before {position: absolute; top: 50%; left: .7em; width: 1em; height: 1em; margin-top: -.5em; font-weight: normal; font-style: normal; font-family: "icomoon"; vertical-align: middle; line-height: 1; transition: .2s;}

html[data-script-enabled="true"] .tab_panel {display: none;}
html[data-script-enabled="true"] .tab_panel.is_active {display: block;}
html[data-script-enabled="true"] .accordion_list_a > .acco_item.is_close > .acco_item_content {display: none;}


/* ==================================
 accordion
================================== */

body {

.accordion_list_a {margin: 32px 0; border-radius: 16px; border: 1px solid var(--bg-gry-a); box-shadow: var(--box-shadow-a), var(--box-shadow-b); overflow: hidden; background-color: #fff;}
.accordion_list_a {
  .acco_item {border-bottom: 1px solid var(--bg-gry-a);}
  .acco_item:last-child {border: none;}
  .acco_item > .title {margin: 0; font-size: 1.7rem; font-weight: bold; line-height: inherit;}
  .acco_item > .title > button,
  .acco_item > .title > a {display: flex; width: 100%; text-align: left; gap: 16px; font-weight: bold; justify-content: space-between; align-items: center; min-height: 4em; padding: 16px; background: #fff; border: none; border-radius: 0;}
  .acco_item > .title > a {color: inherit; text-decoration: none;}
  .acco_item:first-child > .title > button,
  .acco_item:first-child > .title > a {border-radius: 16px 16px 0 0;}
  .acco_item > .title > button::after,
	.acco_item > .title > a::after {content: ""; width: 32px; height: 32px; flex-shrink: 0; border: solid 1px var(--bg-gry-a); border-radius: 6px; background: url("/assets/img/ui_acco_plus.svg") no-repeat #fff center / 24px 24px}
	.acco_item > .title > a::after {background: var(--ui-link-arrow) no-repeat transparent center / 24px 24px; border: none;}
	.acco_item > .title > a[target*="_blank"]::after {background: var(--ui-link-blank) no-repeat center / 20px 20px}
  .acco_item.is_open > .title > button::after {background-image: url("/assets/img/ui_acco_minus.svg")}
  .acco_item > .title > button:hover,
  .acco_item > .title > a:hover {background-color: var(--bg-hover-b); transition: background-color .2s}
  .acco_item > .title > button:hover .text,
  .acco_item > .title > a:hover .text {text-decoration: underline;}
  .acco_item > .acco_item_content {position: relative; overflow: hidden;}
  .acco_item > .acco_item_content > div {padding: 16px;}
  .acco_item > .acco_item_content > div > * {flex: 1;}
  .acco_item > .acco_item_content > div > *:first-child {margin-top: 0;}
  .acco_item > .acco_item_content > div > *:last-child {margin-bottom: 0;}
  .acco_item > .acco_item_content::before {content: ""; position: absolute; left: 16px; top: 0; flex-shrink: 0; border-top: solid 1px var(--bg-gry-a); width: 100%;}
  .toggle_status {position: absolute; top: 0; right: 0; line-height: 1; opacity: 0;}

  .acco_item > .acco_item_content > div.p_0 {
  	table,
		.scroll_wrap {box-shadow: none; border-radius: 0;}
	}

  .acco_item > .acco_item_content > ul.link_list_a {gap: 0; position: relative;}
  .acco_item > .acco_item_content > ul.link_list_a > li {position: relative;}
  .acco_item > .acco_item_content > ul.link_list_a::before,
  .acco_item > .acco_item_content > ul.link_list_a > li::before {content: ""; position: absolute; left: 16px; top: 0; border-top: solid 1px var(--bg-gry-a); width: 100%;}
  .acco_item > .acco_item_content > ul.link_list_a > li > a {color: inherit; display: flex; gap: 16px; align-items: center; justify-content: space-between; min-height: 4em; padding: 16px 24px 16px 32px;}
  .acco_item > .acco_item_content > ul.link_list_a > li > a:hover {background-color: var(--bg-hover-b);}
  .acco_item > .acco_item_content > ul.link_list_a > li > div {display: flex; align-items: center; min-height: 4em; padding: 16px 24px 16px 32px;}

	*:focus {outline-offset: -3px;}
}

.accordion_list_a._qa,
.accordion_list_a._info {
  .acco_item button .text,
	.acco_item a .text {display: flex; gap: 16px;}
  .acco_item button .text::before,
  .acco_item a .text::before,
  .acco_item .acco_item_content > div::before {content: ""; width: 24px; height: 24px; overflow: hidden; padding-left: 24px; flex-shrink: 0; color: transparent; background: no-repeat center / 24px 24px;}
  .acco_item .acco_item_content::before {left: 56px;}
}

.accordion_list_a._qa {
  .acco_item button .text::before,
	.acco_item a .text::before {content: "Q"; margin-top: 2px; background-image: url("/assets/img/ui_acco_qa_q.svg")}
  .acco_item .acco_item_content > div {display: flex; gap: 16px;}
  .acco_item .acco_item_content > div::before {content: "A"; background-image: url("/assets/img/ui_acco_qa_a.svg")}
}

.accordion_list_a._info {
  .acco_item button .text::before {content: ""; margin-top: 2px; background-image: url("/assets/img/ui_acco_info.svg")}
  .acco_item .acco_item_content > div::before {display: none;}
  .acco_item .acco_item_content > div {padding-left: 56px;}
}

.accordion_list_a._img {
  .acco_item button > div {display: flex; align-items: center; gap: 16px;}
  .acco_item button > div > .img_wrap {width: 64px; margin: 0; border-radius: 8px; overflow: hidden; aspect-ratio: 64 / 48; display: grid; align-items: center;}
  .acco_item > .acco_item_content > ul.link_list_a a {padding-left: 48px;}
  .acco_item > .acco_item_content > ul.link_list_a > li::before {left: 48px;}
}
@media (min-width: 960px) {
  .accordion_list_a._img {
    .acco_item > .acco_item_content > ul.link_list_a a {padding-left: 96px;}
    .acco_item > .acco_item_content > ul.link_list_a > li::before {left: 96px;}
  }
}

.accordion_list_a .accordion_list_a {box-shadow: none;}

.accordion_list_a + .accordion_list_a {margin-top: -16px;}

}


/* ==================================
 modal custtmaize
================================== */

.modaal-container {max-width: 960px; border-radius: 16px;}
.js_modal_content {display: none;}
.modal_wrap > :first-child {margin-top: 0;}
.modal_wrap > :last-child {margin-bottom: 0;}


/* ==================================
 column
================================== */

.tag_wrap_a {border-bottom: solid 1px var(--bg-gry-a);}
.tag_wrap_a > .inner {max-width: 1200px; margin: 0 auto; padding: 16px; display: flex; gap: 16px; flex-direction: column; justify-content: space-between;}
.tag_wrap_a {
  ul.tag_list_a {margin: 0;}
  dl.release_date {margin: 0; padding: 0; font-size: 1.2rem; display: flex; flex-direction: column; gap: 8px; line-height: 1; flex-shrink: 0;}
  dl.release_date {
    > div {display: flex; gap: 8px; align-items: center;}
    dt {display: flex; gap: 4px; align-items: center; color: var(--c-main);}
    dd {margin: 0;}
    .release::before,
    .update::before {content: ""; width: 16px; height: 16px; mask: url(/assets/img/ui_icon_calendar.svg) center / cover no-repeat; background-color: var(--bg-main-b);}
    .update::before {mask-image: url(/assets/img/ui_icon_refresh.svg);}
  }
}

@media (min-width: 960px) {
  .tag_wrap_a > .inner {flex-direction: row; align-items: center;}
  .tag_wrap_a > .inner:has(dl.release_date:only-child) {justify-content: flex-end;}
}

.hd_article_a {background-color: var(--bg-sub-a);}
.hd_article_a {
  .inner {max-width: 1200px; padding: 32px 16px; margin: 0 auto;}
}

.summary_list_a {display: flex; flex-direction: column; gap: .5em;}
.summary_list_a {
  > dt {font-weight: bold; position: relative; padding-left: .8em; margin-top: 1em;}
  > dt:first-child {margin-top: 0;}
  > dt::before {content: ""; position: absolute; left: 0; top: .25em; width: 4px; height: calc(100% - .5em); border-radius: 10px; background: var(--bg-main-g);}
  > dd {margin: 0; color: #000; position: relative; padding-left: 1em;}
  > dd::before {content: ""; width: 1.5em; height: 1em; position: absolute; left: -.5em; top: .35em; background-color: var(--c-main); mask: var(--list-disc) center / .4em no-repeat;}
}


.box_a.bg_main_g {
  ul.btn_list_c {
    > li a {color: #fff;}
    > li a::after {background-color: #fff;}
  }
}

.box_a.bg_main_g:has(ul.btn_list_c) {
  ul.btn_list_c > li {border-color: rgba(255, 255, 255, .2);}
}

.box_a:has(ul.btn_list_c),
.box_a:has(ul.summary_list_a) {
  padding-top: 16px; padding-bottom: 16px;
}

@media (min-width: 960px) {
  .box_a:has(ul.btn_list_c),
  .box_a:has(ul.summary_list_a) {
    padding-top: 24px; padding-bottom: 24px;
  }
  ul.btn_list_c > li > ul.btn_list_c {padding-left: 3em;}
}



/* ==================================
 modules
================================== */

body {

/* icon */
.icon_plus,
.icon_arrow {display: flex; justify-content: center;}
.icon_plus img,
.icon_arrow img {width: 100%; width: 100%; opacity: 0;}
.icon_plus i {position: relative; width: 32px; height: 32px; border-radius: 100px; background: #fff; border: solid 1px var(--bg-main-b); z-index: 1;}
.icon_plus i::after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--bg-main-b); mask: url(/assets/img/ui_acco_plus.svg) center / 90% no-repeat;}
.icon_arrow i {position: relative; width: 90px; height: 32px;}
.icon_arrow i::after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--bg-main-b); mask: url(/assets/img/ui_arrow_down.svg) center -48px / 140% no-repeat;}

table + .icon_plus,
.scroll_wrap + .icon_plus {margin-top: -1em;}

.icon_plus + table,
.icon_plus +　.scroll_wraps {margin-top: 1em;}

.icon_plus._gry i::after,
.icon_arrow._gry i::after {background: #798086;}
.icon_plus._wht i::after,
.icon_arrow._wht i::after {background: #fff;}

.icon_plus._gry i {border-color: #798086;}
.icon_plus._wht i {background: var(--bg-main-b);}

.icon_plus._sm i {width: 24px; height: 24px;}
.icon_arrow._sm i {width: 90px; height: 24px;}
.icon_arrow._sm i::after {mask: url(/assets/img/ui_arrow_down.svg) center -32px / 100% no-repeat;}

/* center */
.center {display: flex; justify-content: center;}

/* box_em */
.box_em_a {border: solid 1px var(--bg-main-b); margin: 1em 0; background-color: var(--bg-sub-a); border-radius: 8px; padding: 16px;}
.box_em_a:first-child,
.box_em_a > *:first-child {margin-top: 0;}
.box_em_a:last-child,
.box_em_a > *:last-child {margin-bottom: 0;}
.box_em_a .title {margin-bottom: 0;}
.box_em_a .title + * {margin-top: 1em;}

/* column layout */
.lay_g_a {display: flex; flex-direction: column; gap: 16px; grid-template-rows: auto 1fr;}
.lay_g_a > *,
.lay_g_a > [class*="hd_"] {margin: 0;}
@media (min-width: 600px) {
	.lay_g_a {display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px 32px}
	.lay_g_a [class*="hd_"] {order: 2;}
	.lay_g_a .img_wrap {order: 1; grid-row: span 2 / span 1;}
	.lay_g_a .txt_wrap {order: 3;}
}

.lay_col2,
.lay_col2_tb {display: flex; flex-direction: column; align-items: stretch; margin: 2em 0; gap: 32px;}
.lay_col2 > *,
.lay_col2_tb > * {flex: 1; margin: 0;}
.lay_col2 > :first-child,
.lay_col2_tb > :first-child {margin-top: 0;}
.lay_col2 > :last-child,
.lay_col2_tb > :last-child {margin-bottom: 0;}

@media (min-width: 600px) {
  .lay_col2 {flex-direction: row; gap: 32px;}
  .lay_col2 > * {margin: 0;}
  .lay_col2._reverse {flex-direction: row-reverse;}
  .lay_col2._ver_a > [class*="img_wrap"] {max-width: 33%; flex-shrink: 0;}
  [class*="lay_col2"] .image {border-radius: 8px;}
  [class*="lay_col3"] .image {border-radius: 8px;}
}

@media (min-width: 600px) {
  .lay_col2_tb {flex-direction: row; gap: 32px;}
  .lay_col2_tb > * {margin: 0;}
  .lay_col2_tb._reverse {flex-direction: row-reverse;}
}


@media (max-width: 599px) {
.lay_col2._reverse_sp {flex-direction: column-reverse;}
}

.lay_col3 {display: grid; margin: 2em 0; gap: 32px;}

@media (min-width: 600px) {
  .lay_col3 {grid-template-columns: repeat(2, 1fr);}
}

@media (min-width: 1024px) {
  .lay_col3 {grid-template-columns: repeat(3, 1fr);}
}

/* fee */
.lay_fee_a table td {height: 100%;}

@media (min-width: 600px) {
.lay_fee_a._col_tb {display: flex; margin: 2em 0; align-items: stretch; gap: 8px;}
.lay_fee_a._col_tb table {margin: 0;}
.lay_fee_a._col_tb > p[class*="icon_"] {flex: 1; align-self: center; margin: 0;}
}

@media (min-width: 960px) {
.lay_fee_a._col_pc {display: flex; margin: 2em 0; align-items: stretch; gap: 8px;}
.lay_fee_a._col_pc table {margin: 0;}
.lay_fee_a._col_pc > p[class*="icon_"] {flex: 1; align-self: center; margin: 0;}
}


/* news */
dl.news_list_a {margin: 2em 0; display: flex; flex-direction: column; gap: 24px;}
dl.news_list_a {
  > div {display: flex; flex-direction: column; gap: 8px; position: relative;}
  dt {flex-shrink: 0; color: var(--c-main);}
  dd {display: flex; flex-direction: column; gap: 8px; margin: 0;}
  dd > span:last-child {flex-shrink: 0;}
  > div:has(a):hover div {text-decoration: underline; color: var(--bg-hover-a); transition: color .3s;}
	dd a::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
}

@media (min-width: 960px) {
dl.news_list_a {
  > div {display: flex; flex-direction: row; gap: 40px;}
  dt {flex-shrink: 0;}
  dd {flex-direction: row; gap: 64px; justify-content: space-between; width: 100%;}
}

dl.news_list_a._var_a {gap: 16px;}
dl.news_list_a._var_a {
	> div {border: solid var(--bg-gry-a); border-width: 1px 0; padding: 16px 0; padding-left: 25px; padding-right: 25px;}
}
}

/* tel */
.tel_icon_a,
.tel_icon_free {display: flex; align-items: center; line-height: 1; gap: 5px; font-size: 3.2rem; margin: 2rem auto;}
.tel_icon_a::before {content: ""; width: 32px; height: 32px; flex-shrink: 0; mask: url(/assets/img/icon_call.svg) center / 32px no-repeat; background-color: var(--bg-cv-a);}
.tel_icon_free > span:first-child {flex-shrink: 0;}

/* auto tel  */
.c_wht a[href^="tel"] {color: #fff;}

@media (min-width: 1024px) {
.box_tel_a {display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 16px;}
.box_tel_a > * {margin: 0;}
}

ul.color_chrart {display: flex; gap: 16px; flex-direction: column; margin: 64px 0; padding: 0;}
ul.color_chrart {
  div {display: grid; list-style: none; gap: 1px; grid-template-columns: repeat(auto-fit, 100px);}
  li {aspect-ratio: 2 / 1; background-color: var(--bg-gry-a); font-size: x-small; display: grid; align-items: center; justify-content: center;}
}

}


/* ==================================
 swiper
================================== */
.swiper._var_a {overflow: visible; padding-top: 20px; padding-bottom: 20px;}
.swiper._var_a {
.swiper-slide {width: calc(100% - 64px); max-width: 1168px; border-radius: 8px; overflow: hidden;}
.swiper-slide > a {display: block; width: 100%;}
.swiper-slide > a > span {display: dis}
.swiper-slide picture img {width: 100%; height: auto;}

.swiper-pagination-wrap {display: flex; justify-content: center;}
.swiper-pagination-wrap > div {display: flex; align-items: center; justify-content: center; gap: 10px; padding: 6px; border-radius: 99px; box-shadow: var(--box-shadow-a), var(--box-shadow-b); width: 100%;}
.swiper-pagination {display: flex; position: initial; padding-right: 6px; gap: 8px; gap: clamp(4px, 1vw, 8px);}

.swiper-pagination-bullet{width: clamp(20px, 3.5vw, 30px);; height: 4px; border-radius: 10px;  background-color: var(--bg-gry-b); opacity: 1; position: relative; margin: 0 !important;}
.swiper-pagination-bullet::before{content:""; position: absolute; display:inline-block; width: 0; height: 4px; border-radius: 10px; background-color: var(--c-link); top: 0; left: 0;}

.paused .swiper-pagination-bullet-active::before{animation-play-state:paused !important;}

button.js_swiper_pause {appearance: none; cursor: default; border-width: 0; width: auto; height: auto; display: flex; gap: 8px; background-color: transparent; flex-shrink: 0; padding: 0; margin: 0;}
button.js_swiper_pause > * {left: inherit; position: relative;}
button.js_swiper_pause.paused {background-position: top center;}
button.js_swiper_pause ._on,
button.js_swiper_pause ._off {display: block; width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--bg-gry-a); background-size: 35% 35%; background-position: center center; background-repeat: no-repeat; overflow: hidden; text-indent: 100%; white-space: nowrap; cursor: pointer;}
button.js_swiper_pause ._on:hover,
button.js_swiper_pause ._off:hover{background-color: var(--bg-sub-b);} 
button.js_swiper_pause ._on, button.js_swiper_pause.paused ._off{display: block; }
button.js_swiper_pause ._on {background-image: url(/assets/img/ui_nav_play.svg);}
button.js_swiper_pause ._off {background-image: url(/assets/img/ui_nav_pause.svg);}
button.js_swiper_pause ._on, button.js_swiper_pause.paused ._off {filter: grayscale(100%); background-color: var(--bg-gry-a); cursor: default;}
button.js_swiper_pause.paused ._on{background-color: #fff; filter: grayscale(0%); cursor: pointer;}
button.js_swiper_pause.paused ._on:hover{background-color: var(--bg-sub-b);} 

nav {display: flex; justify-content: center; align-items: center; margin-top: 24px; gap: clamp(8px, 2vw, 32px);}
nav .swiper-button-next,
nav .swiper-button-prev {position: relative; margin: 0; background-color: #fff; top: auto; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--bg-gry-a); display: flex; align-items: center; justify-content: center; box-shadow: var(--box-shadow-a), var(--box-shadow-b); left: auto; right: auto; flex-shrink: 0; transition: background-color .3s;}
nav .swiper-button-next::after,
nav .swiper-button-prev::after {content:''; background-position: center center; background-size: 16px 16px; background-repeat: no-repeat; width: 24px; height: 24px;}
nav .swiper-button-next::after{background-image: url(/assets/img/ui_nav_next.svg);}
nav .swiper-button-prev::after{background-image: url(/assets/img/ui_nav_prev.svg);}
nav .swiper-button-next:hover,
nav .swiper-button-prev:hover{background-color: var(--bg-sub-b);}

@media (min-width: 960px) {
	.swiper-slide {width: calc(100% - 128px); border-radius: 15px;}
	nav .swiper-button-next,
	nav .swiper-button-prev {width: 56px; height: 56px; position: absolute; top: calc(calc(100% - 64px - 56px) / 2);}
	nav .swiper-button-next {right: 16px; transition: left .3s, right .3s;}
	nav .swiper-button-prev {left: 16px; transition: left .3s, right .3s;}
}

@media (min-width: 1400px) {
	nav .swiper-button-next {right: calc((100% - 1380px) / 2);}
	nav .swiper-button-prev {left: calc((100% - 1380px) / 2);}
}

}

@keyframes timebar {
  0% {width: 2%;} 100% {width: 100%;}
}


/* ==================================
adjust class
================================== */

body {

.bg_a {background: var(--bg-main-g) !important}
.mk_a {background: linear-gradient(transparent 0%, transparent 70%, #fbe380 70%, #fbe380 100%) !important}
.mk_b {background: #ffe57f !important}

.tl_c,
._center {display: flex !important; justify-content: center !important}
.tl_r,
._right {display: flex !important; justify-content: flex-end !important}

.wm_vr {-ms-writing-mode: tb-rl; letter-spacing: .2em; writing-mode: vertical-rl;}
th.wm_vr,
td.wm_vr {text-align: center; width: 2.5em; vertical-align: middle;}
.wm_vr > span {display: block; width: 1em; min-width: 1em; max-width: 1em; text-align: center; line-height: 1.1; word-break: break-all;
}

br.pc,
br.tb {display: none;}
@media (min-width: 600px) {
	br.sp {display: none !important;}
	br.tb {display: inline;}
}
@media (min-width: 1024px) {
	br.tb {display: none !important;}
	br.pc {display: inline;}
}

a.c_wht {color: #fff;}
a.c_wht::after {filter: brightness(0) invert(1);}

.lh_n {line-height: normal !important;}
.lh_1 {line-height: 1 !important;}
.f_b100 {filter: brightness(0) invert(1);}
.box_s_a {box-shadow: var(--box-shadow-a), var(--box-shadow-b);}
.box_s_n {box-shadow: none !important;}
.br_8,
._r8 {border-radius: 8px;}
._r4 {border-radius: 1px;}
.br_0 {border-radius: 0 !important;}
.bg_t {background-color: transparent !important;}
span.va_t,
i.va_t {vertical-align: top;}

.p_r {position: relative !important;}
.p_a {position: absolute !important;}
.p_f {position: fixed !important;}
.p_s {position: static !important;}

.fs_xxs {font-size: xx-small !important}
.fs_xs {font-size: x-small !important}
.fs_s {font-size: small !important}
.fs_m {font-size: medium !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}

.fs_i {font-size: inherit !important}

.fs_12 {font-size: 1.2rem !important}
.fs_13 {font-size: 1.3rem !important}
.fs_14 {font-size: 1.4rem !important}
.fs_15 {font-size: 1.5rem !important}
.fs_16 {font-size: 1.6rem !important}
.fs_18 {font-size: 1.8rem !important}
.fs_20 {font-size: 2.0rem !important}
.fs_22 {font-size: 2.2rem !important}
.fs_24 {font-size: 2.4rem !important}
.fs_26 {font-size: 2.6rem !important}
.fs_28 {font-size: 2.8rem !important}
.fs_30 {font-size: 3.0rem !important}
.fs_32 {font-size: 3.2rem !important}
.fs_34 {font-size: 3.4rem !important}
.fs_36 {font-size: 3.6rem !important}
.fs_38 {font-size: 3.8rem !important}
.fs_40 {font-size: 4.0rem !important}

.fw_b {font-weight: bold !important}

.ta_l {text-align: left !important}
.ta_c {text-align: center !important}
.ta_r {text-align: right !important}
.ws_nw {white-space: nowrap !important}
ul.ls_n {list-style: none !important; padding-left: 0;}
ul.ul_a.ls_n {padding-left: 0;}
ul.ul_a.ls_n > li::before {display: none !important;}

.d_n {display: none !important}
.d_b {display: block !important}
.d_ib {display: inline-block !important}
.d_i {display: inline !important}
.d_f {display: flex !important}
.d_f > input {flex-shrink: 0}
.d_g {display: grid !important}
.ai_c {align-items: center !important}
.ai_fs {align-items: flex-start !important}
.ai_fe {align-items: flex-end !important}
.as_fs {align-self: flex-start !important}
.jc_c {justify-content: center !important}
.jc_sb {justify-content: space-between !important}
.jc_sa {justify-content: space-around !important}
.fd_c {flex-direction: column}
.fw_w {flex-wrap: wrap !important}
.fd_r {flex-direction: row !important}
.fs_0 {flex-shrink: 0 !important}
.fg_1 {flex-grow: 1 !important}

.of_sd img,
img.of_sd {object-fit: scale-down !important}
img.of_cov {object-fit: cover !important; width: 100%; height: 100%; max-width: initial}
img.of_con {object-fit: contain !important; width: 100%; height: 100%; max-width: initial}
.of_cov img {object-fit: cover !important; width: 100%; height: 100%; max-width: initial}
.of_con img {object-fit: contain !important; width: 100%; height: 100%; max-width: initial}
.bs_s {border: solid 1px var(--bg-gry-a) !important}
.bs_n {border: none !important}
.bg_sub_a.bs_s {border-color: var(--bg-sub-b) !important}
.bt_s {border-top: solid 1px var(--bg-gry-a) !important}
.br_s {border-right: solid 1px var(--bg-gry-a) !important}
.bb_s {border-bottom: solid 1px var(--bg-gry-a) !important}
.bl_s {border-left: solid 1px var(--bg-gry-a) !important}
.bt_n {border-top: none !important}
.br_n {border-right: none !important}
.bb_n {border-bottom: none !important}
.bl_n {border-left: none !important}
.ls_n {list-style: none !important}
.ar_i {aspect-ratio: initial !important;}

.g_2 {gap: 2px !important}
.g_3 {gap: 3px !important}
.g_4 {gap: 4px !important}
.g_5 {gap: 5px !important}
.g_10 {gap: 10px !important}
.g_15 {gap: 15px !important}
.g_20 {gap: 20px !important}
/* guideline */
.g_8 {gap: 8px !important}
.g_16 {gap: 16px !important}
.g_24 {gap: 24px !important}
.g_32 {gap: 32px !important}

.g_1em {gap: 1em !important}
.g_2em {gap: 2em !important}
.g_1_2em {gap: 1em 2em !important}

.pe_n {pointer-events: none !important}

.m_0   {margin: 0 !important}

.mt_0  {margin-top: 0 !important}
.mt_8 {margin-top: 8px !important}
.mt_16 {margin-top: 16px !important}
.mt_24 {margin-top: 24px !important}
.mt_32 {margin-top: 32px !important}
.mt_40 {margin-top: 40px !important}
.mt_48 {margin-top: 48px !important}

.mt_5 {margin-top: 5px !important}
.mt_10 {margin-top: 10px !important}
.mt_15 {margin-top: 15px !important}
.mt_20 {margin-top: 20px !important}
.mt_30 {margin-top: 30px !important}
.mt_40 {margin-top: 40px !important}
.mt_50 {margin-top: 50px !important}
.mt_60 {margin-top: 60px !important}
.mt_70 {margin-top: 70px !important}
.mt_80 {margin-top: 80px !important}
.mt_90 {margin-top: 90px !important}
.mt_100 {margin-top: 100px !important}

.mb_0  {margin-bottom: 0 !important}
.mb_5  {margin-bottom: 5px !important}
.mb_8 {margin-bottom: 8px !important}
.mb_16 {margin-bottom: 16px !important}
.mb_24 {margin-bottom: 24px !important}
.mb_32 {margin-bottom: 32px !important}
.mb_40 {margin-bottom: 40px !important}
.mb_48 {margin-bottom: 48px !important}

.mb_5 {margin-bottom: 5px !important}
.mb_10 {margin-bottom: 10px !important}
.mb_20 {margin-bottom: 20px !important}
.mb_30 {margin-bottom: 30px !important}
.mb_40 {margin-bottom: 40px !important}
.mb_50 {margin-bottom: 50px !important}

.mr_a  {margin-right: auto !important}
.mr_0  {margin-right: 0 !important}
.mr_8 {margin-right: 8px !important}
.mr_16 {margin-right: 16px !important}
.mr_24 {margin-right: 24px !important}
.mr_32 {margin-right: 32px !important}
.mr_40 {margin-right: 40px !important}
.mr_48 {margin-right: 48px !important}

.mr_5 {margin-right: 5px !important}
.mr_10 {margin-right: 10px !important}
.mr_15 {margin-right: 15px !important}
.mr_20 {margin-right: 20px !important}
.mr_25 {margin-right: 25px !important}
.mr_30 {margin-right: 30px !important}
.mr_35 {margin-right: 35px !important}
.mr_40 {margin-right: 40px !important}
.mr_50 {margin-right: 50px !important}

.ml_a {margin-left: auto !important}
.ml_0  {margin-left: 0 !important}
.ml_8 {margin-left: 8px !important}
.ml_16 {margin-left: 16px !important}
.ml_24 {margin-left: 24px !important}
.ml_32 {margin-left: 32px !important}
.ml_40 {margin-left: 40px !important}
.ml_48 {margin-left: 48px !important}

.ml_5 {margin-left: 5px !important}
.ml_10 {margin-left: 10px !important}
.ml_15 {margin-left: 15px !important}
.ml_20 {margin-left: 20px !important}
.ml_25 {margin-left: 25px !important}
.ml_30 {margin-left: 30px !important}
.ml_35 {margin-left: 35px !important}
.ml_40 {margin-left: 40px !important}
.ml_50 {margin-left: 50px !important}

.mt_1em {margin-top: 1em !important}
.mt_2em {margin-top: 2em !important}
.mt_3em {margin-top: 3em !important}
.mt_4em {margin-top: 4em !important}

.mb_1em {margin-bottom: 1em !important}
.mb_2em {margin-bottom: 2em !important}
.mb_3em {margin-bottom: 3em !important}
.mb_4em {margin-bottom: 4em !important}

.p_0 {padding: 0 !important}
.p_2 {padding: 2px !important}
.p_3 {padding: 3px !important}
.p_4 {padding: 4px !important}
.p_5 {padding: 5px !important}
.p_8 {padding: 8px !important}
.p_10 {padding: 10px !important}
.p_12 {padding: 12px !important}
.p_15 {padding: 16px !important}
.p_16 {padding: 16px !important}
.p_18 {padding: 18px !important}
.p_20 {padding: 20px !important}
.p_22 {padding: 22px !important}
.p_24 {padding: 24px !important}
.p_25 {padding: 25px !important}
.p_26 {padding: 26px !important}
.p_28 {padding: 28px !important}
.p_25 {padding: 25px !important}
.p_30 {padding: 30px !important}
.p_32 {padding: 32px !important}
.p_35 {padding: 35px !important}
.p_40 {padding: 40px !important}
.p_1em {padding: 1em !important}

.pt_0  {padding-top: 0 !important}
.pt_8 {padding-top: 8px !important}
.pt_16 {padding-top: 16px !important}
.pt_24 {padding-top: 24px !important}
.pt_32 {padding-top: 32px !important}
.pt_40 {padding-top: 40px !important}
.pt_48 {padding-top: 48px !important}

.pt_5 {padding-top: 5px !important}
.pt_10 {padding-top: 10px !important}
.pt_15 {padding-top: 15px !important}
.pt_20 {padding-top: 20px !important}
.pt_25 {padding-top: 25px !important}
.pt_30 {padding-top: 30px !important}
.pt_35 {padding-top: 35px !important}
.pt_40 {padding-top: 40px !important}
.pt_50 {padding-top: 50px !important}

.pb_8  {padding-bottom: 8px !important}
.pb_16 {padding-bottom: 16px !important}
.pb_24 {padding-bottom: 24px !important}
.pb_32 {padding-bottom: 32px !important}
.pb_40 {padding-bottom: 40px !important}
.pb_48 {padding-bottom: 48px !important}

.pb_0  {padding-bottom: 0 !important}
.pb_5  {padding-bottom: 5px !important}
.pb_10 {padding-bottom: 10px !important}
.pb_15 {padding-bottom: 15px !important}
.pb_20 {padding-bottom: 20px !important}
.pb_25 {padding-bottom: 25px !important}
.pb_30 {padding-bottom: 30px !important}
.pb_35 {padding-bottom: 35px !important}
.pb_40 {padding-bottom: 40px !important}
.pb_50 {padding-bottom: 50px !important}

.pl_0  {padding-left: 0 !important}
.pl_2  {padding-left: 2px !important}
.pl_4  {padding-left: 4px !important}
.pl_8  {padding-left: 8px !important}
.pl_16 {padding-left: 16px !important}
.pl_24 {padding-left: 24px !important}
.pl_32 {padding-left: 32px !important}

.pl_5  {padding-left: 5px !important}
.pl_10 {padding-left: 10px !important}
.pl_15 {padding-left: 15px !important}
.pl_20 {padding-left: 20px !important}
.pl_30 {padding-left: 30px !important}
.pl_40 {padding-left: 40px !important}
.pl_50 {padding-left: 50px !important}

.pr_0  {padding-right: 0 !important}
.pr_2  {padding-right: 2px !important}
.pr_4  {padding-right: 4px !important}
.pr_8  {padding-right: 8px !important}
.pr_16 {padding-right: 16px !important}
.pr_24 {padding-right: 24px !important}
.pr_32 {padding-right: 32px !important}

.pr_5  {padding-right: 5px !important}
.pr_10 {padding-right: 10px !important}
.pr_15 {padding-right: 15px !important}
.pr_20 {padding-right: 20px !important}
.pr_30 {padding-right: 30px !important}
.pr_40 {padding-right: 40px !important}
.pr_50 {padding-right: 50px !important}

.pt_1em {padding-top: 1em !important}
.pt_2em {padding-top: 2em !important}
.pt_3em {padding-top: 3em !important}
.pt_4em {padding-top: 4em !important}

.pb_1em {padding-bottom: 1em !important}
.pb_2em {padding-bottom: 2em !important}
.pb_3em {padding-bottom: 3em !important}
.pb_4em {padding-bottom: 4em !important}

.pl_1em {padding-left: 1em !important}
.pl_2em {padding-left: 2em !important}

.pr_1em {padding-right: 1em !important}
.pr_2em {padding-right: 2em !important}

.w_2em {width: 2em !important}
.w_3em {width: 3em !important}
.w_4em {width: 3em !important}
.w_5em {width: 3em !important}
.w_6em {width: 3em !important}

.w_5p  {width:  5% !important} 
.w_10p {width: 10% !important} 
.w_15p {width: 15% !important} 
.w_20p {width: 20% !important} 
.w_25p {width: 25% !important} 
.w_30p {width: 30% !important} 
.w_35p {width: 35% !important} 
.w_40p {width: 40% !important} 
.w_45p {width: 45% !important} 
.w_50p {width: 50% !important} 
.w_55p {width: 55% !important} 
.w_60p {width: 60% !important} 
.w_65p {width: 65% !important} 
.w_70p {width: 70% !important} 
.w_75p {width: 75% !important} 
.w_80p {width: 80% !important} 
.w_85p {width: 85% !important} 
.w_90p {width: 90% !important} 
.w_95p {width: 95% !important} 
.w_100p {width: 100% !important} 
.h_100p {height: 100% !important}
.min_h_a {min-height: auto !important}
.min_w_a {min-width: auto !important}

.max_w_10em {max-width: 10em !important}
.max_w_11em {max-width: 11em !important}
.max_w_12em {max-width: 12em !important}
.max_w_13em {max-width: 13em !important}
.max_w_14em {max-width: 14em !important}
.max_w_15em {max-width: 15em !important}
.max_w_16em {max-width: 16em !important}
.max_w_17em {max-width: 17em !important}
.max_w_18em {max-width: 18em !important}
.max_w_19em {max-width: 19em !important}
.max_w_20em {max-width: 20em !important}
.max_w_21em {max-width: 21em !important}
.max_w_22em {max-width: 22em !important}
.max_w_23em {max-width: 23em !important}
.max_w_24em {max-width: 24em !important}
.max_w_25em {max-width: 25em !important}
.max_w_26em {max-width: 26em !important}
.max_w_27em {max-width: 27em !important}
.max_w_28em {max-width: 28em !important}
.max_w_29em {max-width: 29em !important}
.max_w_30em {max-width: 30em !important}
.max_w_31em {max-width: 31em !important}
.max_w_32em {max-width: 32em !important}
.max_w_33em {max-width: 33em !important}
.max_w_34em {max-width: 34em !important}
.max_w_35em {max-width: 35em !important}
.max_w_36em {max-width: 36em !important}
.max_w_37em {max-width: 37em !important}
.max_w_38em {max-width: 38em !important}

.min_w_10em {min-width: 10em !important}
.min_w_11em {min-width: 11em !important}
.min_w_12em {min-width: 12em !important}
.min_w_13em {min-width: 13em !important}
.min_w_14em {min-width: 14em !important}
.min_w_15em {min-width: 15em !important}
.min_w_16em {min-width: 16em !important}
.min_w_17em {min-width: 17em !important}
.min_w_18em {min-width: 18em !important}
.min_w_19em {min-width: 19em !important}
.min_w_20em {min-width: 20em !important}
.min_w_21em {min-width: 21em !important}
.min_w_22em {min-width: 22em !important}
.min_w_23em {min-width: 23em !important}
.min_w_24em {min-width: 24em !important}
.min_w_25em {min-width: 25em !important}
.min_w_26em {min-width: 26em !important}
.min_w_27em {min-width: 27em !important}
.min_w_28em {min-width: 28em !important}
.min_w_29em {min-width: 29em !important}
.min_w_30em {min-width: 30em !important}

.max_w_a {max-width: 320px}
.max_w_b {max-width: 520px}
.max_w_c {max-width: 768px}
.max_w_d {max-width: 960px}
.max_w_e {max-width: 1200px}

.img_wrap.max_w_a,
.img_wrap.max_w_b,
.img_wrap.max_w_c,
.img_wrap.max_w_d,
.img_wrap.max_w_e,
.btn_list_a.max_w_a,
.btn_list_a.max_w_b,
.btn_list_a.max_w_c,
.btn_list_a.max_w_d,
.btn_list_a.max_w_e {margin-left: auto !important;; margin-right: auto !important;}

/* sp */
@media (max-width: 599px) {
.ta_c_sp {text-align: center !important}

.d_n_sp {display: none !important}
.d_b_sp {display: block !important}
.b_n_sp {border: none !important}
.ta_l_sp {text-align: left !important}
.fd_c_sp {flex-direction: column !important}

.m_0_sp   {margin: 0 !important}
.mt_0_sp  {margin-top: 0 !important}
.mt_5_sp {margin-top: 5px !important}
.mt_10_sp {margin-top: 10px !important}
.mt_15_sp {margin-top: 15px !important}
.mt_20_sp {margin-top: 20px !important}
.mt_30_sp {margin-top: 30px !important}
.mt_40_sp {margin-top: 40px !important}
.mt_50_sp {margin-top: 50px !important}

.mb_0_sp {margin-bottom: 0 !important}
.mb_10_sp {margin-bottom: 10px !important}
.mb_20_sp {margin-bottom: 20px !important}
.mb_30_sp {margin-bottom: 30px !important}
.mb_40_sp {margin-bottom: 40px !important}
.mb_50_sp {margin-bottom: 50px !important}

.ml_0_sp {margin-left: 0 !important}
.ml_10_sp {margin-left: 10px !important}
.ml_20_sp {margin-left: 20px !important}
.ml_30_sp {margin-left: 30px !important}
.ml_40_sp {margin-left: 40px !important}
.ml_50_sp {margin-left: 50px !important}

.mt_1em_sp {margin-top: 1em !important}
.mt_2em_sp {margin-top: 2em !important}
.mt_3em_sp {margin-top: 3em !important}
.mt_4em_sp {margin-top: 4em !important}

.mb_1em_sp {margin-bottom: 1em !important}
.mb_2em_sp {margin-bottom: 2em !important}
.mb_3em_sp {margin-bottom: 3em !important}
.mb_4em_sp {margin-bottom: 4em !important}

.p_0_sp {padding: 0 !important}
.p_16_sp {padding: 16px !important}
.p_24_sp {padding: 24px !important}
.p_32_sp {padding: 32px !important}
.p_1em_sp {padding: 1em !important}

.pt_0_sp {padding-top: 0 !important}
.pt_8_sp {padding-top: 8px !important}
.pt_10_sp {padding-top: 10px !important}
.pt_15_sp {padding-top: 16px !important}
.pt_16_sp {padding-top: 15px !important}
.pt_20_sp {padding-top: 20px !important}
.pt_24_sp {padding-top: 24px !important}
.pt_30_sp {padding-top: 30px !important}
.pt_32_sp {padding-top: 32px !important}
.pt_40_sp {padding-top: 40px !important}
.pt_48_sp {padding-top: 48px !important}
.pt_50_sp {padding-top: 50px !important}

.pb_0_sp  {padding-bottom: 0 !important}
.pb_8_sp  {padding-bottom: 8px !important}
.pb_10_sp {padding-bottom: 10px !important}
.pb_16_sp {padding-bottom: 16px !important}
.pb_20_sp {padding-bottom: 20px !important}
.pb_24_sp {padding-bottom: 24px !important}
.pb_30_sp {padding-bottom: 30px !important}
.pb_32_sp {padding-bottom: 32px !important}
.pb_40_sp {padding-bottom: 40px !important}
.pb_48_sp {padding-bottom: 48px !important}
.pb_50_sp {padding-bottom: 50px !important}

.pt_1em_sp {padding-top: 1em !important}
.pt_2em_sp {padding-top: 2em !important}
.pt_3em_sp {padding-top: 3em !important}
.pt_4em_sp {padding-top: 4em !important}

.pb_1em_sp {padding-bottom: 1em !important}
.pb_2em_sp {padding-bottom: 2em !important}
.pb_3em_sp {padding-bottom: 3em !important}
.pb_4em_sp {padding-bottom: 4em !important}

.pl_1em_sp {padding-left: 1em !important}
.pl_2em_sp {padding-left: 2em !important}

.pl_10_sp {padding-left: 10px !important}
.pl_20_sp {padding-left: 20px !important}
.pl_30_sp {padding-left: 30px !important}
.pl_40_sp {padding-left: 40px !important}
.pl_50_sp {padding-left: 50px !important}

.pr_1em_sp {padding-right: 1em !important}
.pr_2em_sp {padding-right: 2em !important}

.fs_10_sp {font-size: 1.0rem !important}
.fs_12_sp {font-size: 1.2rem !important}
.fs_13_sp {font-size: 1.3rem !important}
.fs_14_sp {font-size: 1.4rem !important}
.fs_15_sp {font-size: 1.5rem !important}
.fs_16_sp {font-size: 1.6rem !important}
.fs_18_sp {font-size: 1.8rem !important}
.fs_20_sp {font-size: 2.0rem !important}
.fs_22_sp {font-size: 2.2rem !important}
.fs_24_sp {font-size: 2.4rem !important}
.fs_26_sp {font-size: 2.6rem !important}
.fs_28_sp {font-size: 2.8rem !important}
.fs_30_sp {font-size: 3.0rem !important}

.fs_xxs_sp {font-size: xx-small !important}
.fs_xs_sp {font-size: x-small !important}
.fs_s_sp {font-size: small !important}
.fs_l_sp {font-size: large !important}
.fs_xl_sp {font-size: x-large !important}
.fs_xxl_sp {font-size: xx-large !important}
.w_100p_sp {width: 100% !important} 

.p_0_sp {padding: 0 !important}
}

/* tb */
@media (min-width: 600px) {
.ta_c_tb {text-align: center !important}
.ta_l_tb {text-align: left !important}
.ai_c_tb {align-items: center !important}
.d_f_tb {display: flex !important}
.ai_fs_tb {align-items: flex-start !important}
.jc_c_tb {justify-content: center !important}
.jc_sb_tb {justify-content: space-between !important}
.fd_r_tb {flex-direction: row !important}
.bs_s_tb {border: solid 1px var(--bg-gry-a) !important}

.fs_12_tb {font-size: 1.2rem !important}
.fs_13_tb {font-size: 1.3rem !important}
.fs_14_tb {font-size: 1.4rem !important}
.fs_15_tb {font-size: 1.5rem !important}
.fs_16_tb {font-size: 1.6rem !important}
.fs_18_tb {font-size: 1.8rem !important}
.fs_20_tb {font-size: 2.0rem !important}
.fs_22_tb {font-size: 2.2rem !important}
.fs_24_tb {font-size: 2.4rem !important}
.fs_26_tb {font-size: 2.6rem !important}
.fs_28_tb {font-size: 2.8rem !important}
.fs_30_tb {font-size: 3.0rem !important}
.fs_32_tb {font-size: 3.2rem !important}
.fs_34_tb {font-size: 3.4rem !important}

.g_16_tb {gap: 16px !important}
.g_24_tb {gap: 24px !important}
.g_32_tb {gap: 32px !important}

.m_0_tb   {margin: 0 !important}
.mt_0_tb  {margin-top: 0 !important}
.mt_5_tb {margin-top: 5px !important}
.mt_10_tb {margin-top: 10px !important}
.mt_15_tb {margin-top: 15px !important}
.mt_20_tb {margin-top: 20px !important}
.mt_30_tb {margin-top: 30px !important}
.mt_40_tb {margin-top: 40px !important}
.mt_50_tb {margin-top: 50px !important}
.mt_60_tb {margin-top: 60px !important}
.mt_70_tb {margin-top: 70px !important}
.mt_80_tb {margin-top: 80px !important}
.mt_90_tb {margin-top: 90px !important}
.mt_100_tb {margin-top: 100px !important}

.mb_0_tb {margin-bottom: 0 !important}
.mb_10_tb {margin-bottom: 10px !important}
.mb_20_tb {margin-bottom: 20px !important}
.mb_30_tb {margin-bottom: 30px !important}
.mb_40_tb {margin-bottom: 40px !important}
.mb_50_tb {margin-bottom: 50px !important}

.ml_0_tb {margin-left: 0 !important}
.ml_10_tb {margin-left: 10px !important}
.ml_20_tb {margin-left: 20px !important}
.ml_30_tb {margin-left: 30px !important}
.ml_40_tb {margin-left: 40px !important}
.ml_50_tb {margin-left: 50px !important}

.mt_1em_tb {margin-top: 1em !important}
.mt_2em_tb {margin-top: 2em !important}
.mt_3em_tb {margin-top: 3em !important}
.mt_4em_tb {margin-top: 4em !important}

.mb_1em_tb {margin-bottom: 1em !important}
.mb_2em_tb {margin-bottom: 2em !important}
.mb_3em_tb {margin-bottom: 3em !important}
.mb_4em_tb {margin-bottom: 4em !important}

.p_0_tb {padding: 0 !important}
.p_16_tb {padding: 16px !important}
.p_24_tb {padding: 24px !important}
.p_32_tb {padding: 32px !important}
.p_1em_tb {padding: 1em !important}

.pt_0_tb {padding-top: 0 !important}
.pt_8_tb {padding-top: 8px !important}
.pt_10_tb {padding-top: 10px !important}
.pt_15_tb {padding-top: 16px !important}
.pt_16_tb {padding-top: 15px !important}
.pt_20_tb {padding-top: 20px !important}
.pt_24_tb {padding-top: 24px !important}
.pt_30_tb {padding-top: 30px !important}
.pt_32_tb {padding-top: 32px !important}
.pt_40_tb {padding-top: 40px !important}
.pt_48_tb {padding-top: 48px !important}
.pt_50_tb {padding-top: 50px !important}

.pb_0_tb  {padding-bottom: 0 !important}
.pb_8_tb  {padding-bottom: 8px !important}
.pb_10_tb {padding-bottom: 10px !important}
.pb_16_tb {padding-bottom: 16px !important}
.pb_20_tb {padding-bottom: 20px !important}
.pb_24_tb {padding-bottom: 24px !important}
.pb_30_tb {padding-bottom: 30px !important}
.pb_32_tb {padding-bottom: 32px !important}
.pb_40_tb {padding-bottom: 40px !important}
.pb_48_tb {padding-bottom: 48px !important}
.pb_50_tb {padding-bottom: 50px !important}

.pt_1em_tb {padding-top: 1em !important}
.pt_2em_tb {padding-top: 2em !important}
.pt_3em_tb {padding-top: 3em !important}
.pt_4em_tb {padding-top: 4em !important}

.pb_1em_tb {padding-bottom: 1em !important}
.pb_2em_tb {padding-bottom: 2em !important}
.pb_3em_tb {padding-bottom: 3em !important}
.pb_4em_tb {padding-bottom: 4em !important}

.pl_1em_tb {padding-left: 1em !important}
.pl_2em_tb {padding-left: 2em !important}

.pl_10_tb {padding-left: 10px !important}
.pl_20_tb {padding-left: 20px !important}
.pl_30_tb {padding-left: 30px !important}
.pl_40_tb {padding-left: 40px !important}
.pl_50_tb {padding-left: 50px !important}

.pr_1em_tb {padding-right: 1em !important}
.pr_2em_tb {padding-right: 2em !important}

.min_w_10em_tb {min-width: 10em !important}
.min_w_11em_tb {min-width: 11em !important}
.min_w_12em_tb {min-width: 12em !important}
.min_w_13em_tb {min-width: 13em !important}
.min_w_14em_tb {min-width: 14em !important}
.min_w_15em_tb {min-width: 15em !important}
.min_w_16em_tb {min-width: 16em !important}
.min_w_17em_tb {min-width: 17em !important}
.min_w_18em_tb {min-width: 18em !important}
.min_w_19em_tb {min-width: 19em !important}
.min_w_20em_tb {min-width: 20em !important}
.min_w_21em_tb {min-width: 21em !important}
.min_w_22em_tb {min-width: 22em !important}
.min_w_23em_tb {min-width: 23em !important}
.min_w_24em_tb {min-width: 24em !important}
.min_w_25em_tb {min-width: 25em !important}
.min_w_26em_tb {min-width: 26em !important}
.min_w_27em_tb {min-width: 27em !important}
.min_w_28em_tb {min-width: 28em !important}
.min_w_29em_tb {min-width: 29em !important}
.min_w_30em_tb {min-width: 30em !important}
.min_w_31em_tb {min-width: 31em !important}
.min_w_32em_tb {min-width: 32em !important}
.min_w_33em_tb {min-width: 33em !important}
.min_w_34em_tb {min-width: 34em !important}
}

/* pc */
@media (min-width: 1024px) {
.ta_c_pc {text-align: center !important}
.d_f_pc {display: flex !important}
.fd_r_pc {flex-direction: row !important}
.fd_c_pc {flex-direction: column !important}
.jc_sb_pc {justify-content: space-between !important}
.bs_s_pc {border: solid 1px var(--bg-gry-a) !important}

.fs_18_pc {font-size: 1.8rem !important}
.fs_20_pc {font-size: 2.0rem !important}
.fs_22_pc {font-size: 2.2rem !important}
.fs_24_pc {font-size: 2.4rem !important}
.fs_26_pc {font-size: 2.6rem !important}
.fs_28_pc {font-size: 2.8rem !important}
.fs_30_pc {font-size: 3.0rem !important}
.fs_32_pc {font-size: 3.2rem !important}
.fs_34_pc {font-size: 3.4rem !important}
.fs_36_pc {font-size: 3.6rem !important}
.fs_38_pc {font-size: 3.8rem !important}
.fs_40_pc {font-size: 4.0rem !important}

.m_0_pc   {margin: 0 !important}
.mt_0_pc  {margin-top: 0 !important}
.mt_5_pc {margin-top: 5px !important}
.mt_10_pc {margin-top: 10px !important}
.mt_15_pc {margin-top: 15px !important}
.mt_20_pc {margin-top: 20px !important}
.mt_30_pc {margin-top: 30px !important}
.mt_40_pc {margin-top: 40px !important}
.mt_50_pc {margin-top: 50px !important}
.mt_60_pc {margin-top: 60px !important}
.mt_70_pc {margin-top: 70px !important}
.mt_80_pc {margin-top: 80px !important}
.mt_90_pc {margin-top: 90px !important}
.mt_100_pc {margin-top: 100px !important}

.mb_0_pc {margin-bottom: 0 !important}
.mb_10_pc {margin-bottom: 10px !important}
.mb_20_pc {margin-bottom: 20px !important}
.mb_30_pc {margin-bottom: 30px !important}
.mb_40_pc {margin-bottom: 40px !important}
.mb_50_pc {margin-bottom: 50px !important}

.ml_0_pc {margin-left: 0 !important}
.ml_10_pc {margin-left: 10px !important}
.ml_20_pc {margin-left: 20px !important}
.ml_30_pc {margin-left: 30px !important}
.ml_40_pc {margin-left: 40px !important}
.ml_50_pc {margin-left: 50px !important}

.mr_m1em_pc {margin-right: -1em !important}

.mt_1em_pc {margin-top: 1em !important}
.mt_2em_pc {margin-top: 2em !important}
.mt_3em_pc {margin-top: 3em !important}
.mt_4em_pc {margin-top: 4em !important}

.mb_1em_pc {margin-bottom: 1em !important}
.mb_2em_pc {margin-bottom: 2em !important}
.mb_3em_pc {margin-bottom: 3em !important}
.mb_4em_pc {margin-bottom: 4em !important}

.p_0_pc   {padding: 0 !important}
.p_16_pc {padding: 16px !important}
.p_24_pc {padding: 24px !important}
.p_32_pc {padding: 32px !important}
.p_1em_pc {padding: 1em !important}

.pt_0_pc {padding-top: 0 !important}
.pt_8_pc {padding-top: 8px !important}
.pt_10_pc {padding-top: 10px !important}
.pt_15_pc {padding-top: 16px !important}
.pt_16_pc {padding-top: 15px !important}
.pt_20_pc {padding-top: 20px !important}
.pt_24_pc {padding-top: 24px !important}
.pt_30_pc {padding-top: 30px !important}
.pt_32_pc {padding-top: 32px !important}
.pt_40_pc {padding-top: 40px !important}
.pt_48_pc {padding-top: 48px !important}
.pt_50_pc {padding-top: 50px !important}

.pb_0_pc  {padding-bottom: 0 !important}
.pb_8_pc  {padding-bottom: 8px !important}
.pb_10_pc {padding-bottom: 10px !important}
.pb_16_pc {padding-bottom: 16px !important}
.pb_20_pc {padding-bottom: 20px !important}
.pb_24_pc {padding-bottom: 24px !important}
.pb_30_pc {padding-bottom: 30px !important}
.pb_32_pc {padding-bottom: 32px !important}
.pb_40_pc {padding-bottom: 40px !important}
.pb_48_pc {padding-bottom: 48px !important}
.pb_50_pc {padding-bottom: 50px !important}

.pt_1em_pc {padding-top: 1em !important}
.pt_2em_pc {padding-top: 2em !important}
.pt_3em_pc {padding-top: 3em !important}
.pt_4em_pc {padding-top: 4em !important}

.pb_1em_pc {padding-bottom: 1em !important}
.pb_2em_pc {padding-bottom: 2em !important}
.pb_3em_pc {padding-bottom: 3em !important}
.pb_4em_pc {padding-bottom: 4em !important}

.pl_1em_pc {padding-left: 1em !important}
.pl_2em_pc {padding-left: 2em !important}

.pl_10_pc {padding-left: 10px !important}
.pl_20_pc {padding-left: 20px !important}
.pl_30_pc {padding-left: 30px !important}
.pl_40_pc {padding-left: 40px !important}
.pl_50_pc {padding-left: 50px !important}

.pr_1em_pc {padding-right: 1em !important}
.pr_2em_pc {padding-right: 2em !important}

.jc_fe_pc {justify-content: flex-end !important}

.g_16_pc {gap: 16px !important}
.g_24_pc {gap: 24px !important}
.g_32_pc {gap: 32px !important}
}

}