@charset "utf-8";
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video {
margin: 0;padding: 0;border: 0;font-style:normal;font-weight: normal;font-size: 100%;vertical-align: baseline;}
button {background-color: transparent;border: none;cursor: pointer;outline: none;padding: 0;appearance: none}
:root {
	--color-primary: #009FDE;
	--color-secondary: #d3dffb;
	--color-tertiary: #163b8d;
	--color-gray: #6b7280;
	--color-accent: #EFEADC;
	--color-gray-400: #888b93;
	--color-gray-200: #e7e8e9;
	--color-gray-100: #fafafa;
	--color-text-black: #1a1a1a;
	--color-background-white: #fff;
	--color-background-yellow: #EFEADC;
}
body {
	font-family: "MFW-PA1GothicStd-Regular",'A P-OTF A1ゴシック Std R', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
	color: var(--color-text-black);letter-spacing: 0;font-feature-settings: "pkna" 1;font-kerning: auto;-webkit-font-smoothing: antialiased;background: var(--color-background-white);
}
html {font-size: 62.5%;}
ul ,ol {list-style: none;}
a:link ,a:visited {color: var(--color-text-black);text-decoration: none;}
img {width: auto;max-width: 100%;height: auto;vertical-align: bottom;}
main {display: block;}
*.sp {display: none;}
#tmp {
	position: fixed;bottom: 20px;left: 20px;z-index: 1000;
	background: rgba(255, 255, 255, .7);display: inline-block;
	padding: 3px 10px;border-radius: 8px;
	font-size: 1.2em;line-height: 1.4;font-weight: 600;letter-spacing: 0;
}
.sr-only {
	position: absolute;
	width: 1px;height: 1px;
	margin: -1px;overflow: hidden;
	clip: rect(0, 0, 0, 0);white-space: nowrap;border: 0;
}

/* ドラッグ背景 */
::selection {background: var(--color-secondary);color: var(--color-background-white)}
::-moz-selection {background: var(--color-secondary);color: var(--color-background-white)}

main {margin: 90px 0 0;}
.wrap {
	width: 1300px;margin: 0 auto;padding: 0 50px;
	box-sizing: border-box;
}
.flex {display: flex;flex-wrap: wrap;}
main section {padding: 100px 0;min-width: 1300px;}
main.top {margin: 0}

.bold ,
.bold * {font-weight: 600;font-family: "MFW-PA1GothicStd-Bold",'A P-OTF A1ゴシック Std B'}
.middle ,
.middle * {font-family: "MFW-PA1GothicStd-Medium",'A P-OTF A1ゴシック Std M'}
* p {font-size: 1.6em;line-height: 2}
* .fs-l {font-size: 1.8em}
* .fs-s {font-size: 1.2em}
* .tt-cen {text-align: center;}
* mark {background: #FFDC50}
* .strong {color: var(--color-primary);}
.back-bl {background-color: var(--color-primary);}
.back-grey {background-color: var(--color-gray-100);}
.back-bk {background-color: #333;color: var(--color-background-white);}
.back-bk2 {background-color: var(--color-text-black);color: var(--color-background-white);}
.back-yl {background-color: var(--color-background-yellow);}
main h1 {font-size: 4.8em;line-height: 1.4;font-family: "MFW-PA1GothicStd-Bold",'A P-OTF A1ゴシック Std B';margin: 0 0 45px;}
main h2 {font-size: 4em;line-height: 1.4;font-family: "MFW-PA1GothicStd-Bold",'A P-OTF A1ゴシック Std B';margin: 0 0 45px;}
main h3 {font-size: 2.4em;line-height: 1.4;font-family: "MFW-PA1GothicStd-Bold",'A P-OTF A1ゴシック Std B';margin: 0 0 45px;}
main h4 {font-size: 2em;line-height: 1.4;font-family: "MFW-PA1GothicStd-Bold",'A P-OTF A1ゴシック Std B'}
* mark.border {
	background: none;text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;
}
* mark.marker {
	background: linear-gradient(transparent -30%, #FFDC50 0%);
	padding: 6px 0 5px;
}

*[data-animate="typ"] span {
	position: relative;display: inline-block;overflow: hidden;
	color: rgba(255, 255, 255, 0);
}
*[data-animate="typ"] span.bk {
	color: rgba(17, 17, 17, 0);
}
*.typ span {
	animation: typ-opa 1.5s .3s forwards;
}
*.typ span.bk {
	animation: typ-opa4 1.5s forwards;
}
*.typ span::before {
	content: "";width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 10;
	background: linear-gradient(transparent 5%, var(--color-background-white) 5%, var(--color-background-white) 90%, transparent 90%);
	animation: typ-mov 1.5s forwards;transform: translate3d(-101%,0,0);
}
*.typ span.dly {animation: typ-opa 1.5s .3s forwards}
*.typ span.bk.dly {
	animation: typ-opa4 1.5s .3s forwards;
}
*.typ span.dly:before {animation: typ-mov 1.5s .25s forwards}
*.typ span.dly2:before {animation: typ-mov 1.5s .5s forwards}
*.typ.bl span {
	color: rgba(0, 159, 221, 0);
	animation: typ-opa2 1.5s .3s forwards;
}
*.bl[data-animate="typ"] span svg {opacity: 0;}
*.typ.bl span svg {
	animation: typ-opa3 1.5s forwards;
}
*.typ span.bk svg {
	fill: #111!important;
}
*.typ.bl span::before {
	background: linear-gradient(transparent 13%, #009FDD 13%, #009FDD 87%, transparent 87%);
}
@keyframes typ-mov {
	0% {transform: translate3d(-101%,0,0)}
	40% {transform: translate3d(0,0,0)}
	60% {transform: translate3d(0,0,0)}
	100% {transform: translate3d(101%,0,0)}
}
@keyframes typ-opa {
	0% {color: rgba(255, 255, 255, 0);}
	40% {color: rgba(255, 255, 255, 0);}
	60% {color: rgba(255, 255, 255, 1);}
	100% {color: rgba(255, 255, 255, 1);}
}
@keyframes typ-opa4 {
	0% {color: rgba(17, 17, 17, 0);}
	40% {color: rgba(17, 17, 17, 0);}
	60% {color: rgba(17, 17, 17, 1);}
	100% {color: rgba(17, 17, 17, 1);}
}
@keyframes typ-opa2 {
	0% {color: rgba(0, 159, 221, 0);}
	40% {color: rgba(0, 159, 221, 0);}
	60% {color: rgba(0, 159, 221, 1);}
	100% {color: rgba(0, 159, 221, 1);}
}
@keyframes typ-opa3 {
	0% {opacity: 0}
	40% {opacity: 0}
	60% {opacity: 1}
	100% {opacity: 1}
}

.btn a {
	display: block;padding: 60px;position: relative;overflow: hidden;
	background: var(--color-background-white);color: var(--color-primary);
	font-size: 2rem;line-height: 1;
	border-radius: 30px;transition: background .3s,color .3s;
}
.btn a span {
	display: inline-block;padding: 0 50px 0 0;position: relative;
}
.btn a span::after {
	content: "";width: 30px;height: 30px;position: absolute;top: -100%;bottom: -100%;right: 0;
	background: url(../img/icon/arrow03.svg) no-repeat 60% 54% / 40%;margin: auto 0;pointer-events: none;
	border: solid 3px var(--color-primary);border-radius: 50%;box-sizing: border-box;
}
.btn a::after {
	display: block;content: "";width: 100%;height: 30%;
	pointer-events: none;position: absolute;bottom: -50%;left: 0;
	background: url(../img/icon/wave.svg) no-repeat bottom / 100% auto;
	transition: bottom .3s;
}
.btn a:hover::after {bottom: 0}

.more {text-align: center;margin: 50px 0 0;}
.more.left {text-align: left;}
.more a {
	display: inline-block;padding: 22px 55px;
	border-radius: 38px;background: #FFF;
	box-shadow: 0 0 15px 0 rgba(0, 0, 0, .1);
}
.more a span {
	display: block;position: relative;
	font-size: 1.6rem;line-height: 1;
	padding: 0 60px 0 0;
}
.more a span::after {
	content: "";width: 16px;height: 17px;position: absolute;top: 0;right: 0;
	background: url(../img/icon/arrow04.svg) no-repeat center / 100%;
	filter: invert(1);transform: rotate(-90deg);
}
.more2 {text-align: center;margin: 50px 0 0;}
.more2.left {text-align: left;}
.more2 a {
	display: inline-block;padding: 42px 90px;
	background: var(--color-text-black);
	box-shadow: 0 0 15px 0 rgba(0, 0, 0, .1);
}
.more2 a span {
	display: block;position: relative;
	font-size: 1.6rem;line-height: 1;color: var(--color-background-white);
	padding: 0 45px 0 0;
}
.more2 a span::after {
	content: "";width: 16px;height: 16px;position: absolute;top: 0;right: -16px;
	background: url(../img/icon/arrow04.svg) no-repeat center / 100%;
	transform: rotate(-90deg);
}

.columnbox .flex {gap: 150px}
.columnbox .box {width: 500px;position: relative;}
.columnbox .box:nth-of-type(2) {width: 550px}

.columnbox .box p {line-height: 2;margin: 0 0 2em}
.columnbox .box h2 {font-size: 4rem;}
.columnbox .box .yt {
	width: 255px;height: 164px;background: var(--color-gray-100);
	position: absolute;top: 620px;right: 50px;
	border-radius: 10px;border: 5px solid #FFF;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
}


header.main {
	width: 100%;padding: 10px 10px 10px 30px;box-sizing: border-box;
	position: fixed;top: 0;left: 0;display: flex;flex-wrap: wrap;gap: 90px;
	z-index: 10001;
}
header.main.top {position: absolute;}
@keyframes slide-down {
	0% {transform: translate3d(0,-80%,0)}
	100% {transform: translate3d(0,0,0)}
}
header.main .logo span {font-size: 1.6rem;line-height: 1;}
header.main .logo {width: 210px;margin: 10px 0;}
header.main .logo svg {width: 152px;height: 25px;}
body.tax-works-cat header.main.is-fixed .logo ,
body.post-type-archive-works header.main.is-fixed .logo ,
body.single-works header.main.is-fixed .logo {fill: #111}
body.home header.main .logo {filter: invert(1);transition: filter .3s;}
body.home header.main.is-fixed .logo {filter: invert(0);}
header.main nav {
	width: calc(100% - 300px);
	display: flex;flex-wrap: wrap;justify-content: space-between;
}
header.main nav ul {
	display: flex;flex-wrap: wrap;gap: 30px;border-radius: 100px;
	position: relative;z-index: 10;
}
header.main nav ul li {
	margin: 25px 0 0;
}
header.main nav ul:last-child li:last-child {margin: 0}
header.main nav ul:last-child li:last-child span {
	color: var(--color-background-white);
	border-radius: 35px;
	background: var(--color-text-black);padding: 27px 40px;
}
header.main nav a {display: block}
header.main nav span {
	font-size: 1.6rem;line-height: 1;
	position: relative;overflow: hidden;display: block;
	transition: color .3s;color: #111;
}
body.home header.main nav ul span ,
body.home header.main.is-fixed nav ul:last-child li:last-of-type  span{color: var(--color-background-white)}
body.home header.main.is-fixed nav ul span ,
body.post-type-archive-works header.main nav ul ul span ,
body.single-works header.main nav ul ul span ,
body.post-type-archive-works header.main.is-fixed nav span,
body.tax-works-cat header.main.is-fixed nav span ,
body.single-works header.main.is-fixed nav span{
	color: #111;
}
header.main li a span:hover ,
body.home header.main li a span:hover ,
body.page-id-1184 header.main li.web span,
body.page-id-3303 header.main li.price span,
body.post-type-archive-works header.main li.works span ,
body.page-id-3305 header.main li.support span ,
body.page-id-58 header.main li.seo span ,
body.page-id-71 header.main li.company span {
	color: #009FDD;mix-blend-mode: normal;
}
footer {
	font-size: 1.2em;color: var(--color-background-white);
	background: var(--color-primary);min-width: 1300px;
	padding: 80px 0 5px;
}
footer .wrap {gap: 90px;position: relative}
footer .wrap::after {
	content: "";width: 306px;height: 228px;position: absolute;bottom: 0;right: -30px;
	background: url(../img/icon/humhumkun.svg) no-repeat bottom / 306px 233px;
}
footer span {
	font-size: 1.6rem;color: var(--color-background-white);line-height: 1;
	display: block;
}
footer span.name {font-size: 2rem;}
footer address {font-size: 1.6rem;line-height: 1.6;margin: 25px 0;}
footer ul {gap: 10px;flex-direction: column;}
footer ul ul {margin: .7em 0 1em 1.5em;}
footer .foot {width: 100%;text-align: right;position: relative;z-index: 10;}
footer a span:hover {
	text-decoration: underline;
}
/* リスト */
section.list .flex,
section.list ul.article {gap: 60px}
section.list article ,
section.list ul.article li {
	width: 360px;background: #FFF;
	box-shadow: 0 0 60px 0 rgba(0, 0, 0, .1);
}
section.list article a ,
section.list ul.article li a {display: flex;flex-wrap: wrap;position: relative;}
section.list article .img ,
section.list ul.article li a .img {
	width: 100%;height: 240px;position: relative;overflow: hidden;
	background: var(--color-gray-200);
}
section.list article .img img ,
section.list ul.article li a .img img {
	width: 100%;
	position: relative;z-index: 2;
}
section.list article .img::before ,
section.list ul.article li a .img::before {
	content: "";width: 100px;height: 20px;position: absolute;top: 110px;left: 130px;
	background: url(../img/logo.svg) no-repeat center / 100%;opacity: .1;z-index: 1;
}
section.list article .text ,
section.list ul.article li .text {
	padding: 30px 40px 40px;margin: 0;width: 100%;box-sizing: border-box;
}
section.list.work ul.article li .text ,
section.list.works ul.article li .text {padding: 25px 30px}
section.list article p.title ,
section.list ul.article li p.title {font-size: 1.6em;line-height: 1.5;font-weight: 400}
section.list article .detail ,
section.list ul.article li .detail {
	margin: 15px 0 0;display: flex;gap: 25px;justify-content: space-between;
	font-size: 1.4rem;line-height: 1;
}
section.list ul.article li dl.category {
	display: flex;flex-wrap: wrap;gap: 10px 0;margin: 22px 0 0;
	font-size: 1.4rem;line-height: 1;
}
section.list ul.article li dl.category dt {
	width: 86px;
}
section.list ul.article li dl.category dd {
	width: 214px;
}
section.list article .detail span.date ,
section.list ul.article li .detail span.date ,
section.list article .detail span.cate ,
section.list ul.article li .detail span.cate {color: var(--color-gray-400);}
section.list article .detail span.date ,
section.list ul.article li .detail span.date {width: 6em;}

/* リード文 */
section.lead {padding: 84px 0 10px}
section.lead h1 ,
section.lead p.head {font-size: 2rem;line-height: 1.4;margin: 0 0 45px;}
section.lead h1::before ,
section.lead p.head::before {
	content: attr(data-en);font-size: 4.8rem;font-weight: 500;line-height: 1.4;letter-spacing: 1.44rem;
	position: relative;display: block;margin: 0 0 13px;
}

body.page-id-3303 section h2 {font-size: 4rem}
body.page-id-3303 section h3 {font-size: 3rem;margin: 0 0 25px;}
body.page-id-3303 section#content02 p {margin: 0 0 30px;}
section.price .flexbox .text {width: 600px}
section.price .back-grey {
	margin: 200px 0 0;
	padding: 65px 100px 50px;border-radius: 10px;
	display: flex;flex-direction: column;gap: 30px;
}
section.price .back-grey h3 {margin: 0}
section.price .back-grey p {font-size: 1.8em;line-height: 1.6}


/* 表、グラフ */
.table {position: relative;z-index: 10;margin: 80px 0;}
.table table {
	width: 100%;border-collapse: separate;border-spacing: 0 0;
	font-size: 1.6em;line-height: 1.5;text-align: center;
	table-layout: fixed;margin: 55px 0 150px;
	border-radius: 10px;border: 1px solid #E5E5E5;overflow: hidden;
	background: #FAFAFA;box-shadow: 0 0 20px 0 rgba(0, 0, 0, .1);
}
.table table caption {
	caption-side: bottom;text-align: left;
	margin: 25px 0 0;
}
.table table td span.cs {
	color: #009FDE;font-size: 1rem;
}
.table table th ,
.table table td {
	box-sizing: border-box;
	position: relative;letter-spacing: 0;line-height: 1.3;
}
.table table td.left {
	text-align: left;
}
.table table thead th {color: var(--color-background-white);padding: 32px 0 30px;font-size: 2rem;}
.table table th.head0 {background: var(--color-gray-200)}
.table table th.head1 {background: #1F82BB}
.table table th.head1:nth-of-type(3) {background: var(--color-primary)}
.table table th.head1:nth-of-type(4) {background: #28343C}
.table table span.inbox {
	display: block;border-bottom: solid 1px var(--color-gray-200);
	padding: 34px 0 32px;margin: 0 30px;
}
.table table thead span.inbox {
	padding: 28px 0 26px;
}
.table table tbody tr:last-of-type span.inbox {border: none}
.table table .ft_bl {font-size: 2rem;line-height: 1;color: #1F82BB}
.table table .ft_bl span.bold {font-size: 3rem}
ul.glaph2 {
	margin: 50px 100px 100px;display: flex;flex-wrap: wrap;align-items: flex-end;
	padding: 0 150px;position: relative;height: 250px;gap: 80px;
}
ul.glaph2::after {
	content: "";width: 100%;height: 2px;background: #d9d9d9;
	position: absolute;bottom: 0;left: 0;
}
ul.glaph2 li span.txt {
	display: block;width: 180%;padding: 15px 0 0;
	position: absolute;top: 100%;left: -40%;
	font-size: 1.4rem;text-align: center;line-height: 1.5;
}
ul.glaph2 li span.txt span {
	display: block;
	font-size: 2rem;line-height: .9;
}
ul.glaph2 li {
	flex: 1;height: 0;position: relative;transition: height .4s;
	display: block;background: #D9D9D9;
	text-align: center;line-height: 1.2;
}
ul.glaph2 li.main {
	background: #0092E5;
}
ul.glaph2 li span.num {
	position: absolute;top: -1.5em;left: 50%;transform: translateX(-50%);
	color: #A4A4A4;font-size: 3em;
}
ul.glaph2 li.main span.num {color: #0092E5}
ul.glaph2 li span.num::after {
	content: "%";color: #A4A4A4;font-size: 18px;
}

/* プランリスト */
dl.flowlist {
	border-radius: 30px;border: 1px solid #DDD;
	counter-reset: num1;margin: 0 0 50px;
}
dl.flowlist div {
	border-bottom: 1px solid #DDD;position: relative;counter-increment: mycounter;
	padding: 30px 50px 28px;display: flex;flex-wrap: wrap;
}
dl.flowlist div:last-child {border-bottom: none}
dl.flowlist dt {
	width: 288px;box-sizing: border-box;padding: 0 0 0 75px;
	line-height: 1.4;
}
dl.flowlist dd {
	width: 710px;box-sizing: border-box;line-height: 1.6;
}
dl.flowlist div::before {
	position: relative;content: counter(mycounter, decimal-leading-zero);
	font-weight: 600;font-family: 'A P-OTF A1ゴシック Std B','A1 Gothic B';line-height: 1.8;
	position: absolute;top: 27px;left: 50px;
}
body.page-id-3303 dl.flowlist {
	margin: 10px 0 140px;
}


/* サービス一覧 */
section.servicelist {
	margin: 200px 0 0;position: relative;padding: 10px 0 100px;
}
section.contactbox.back-bl + section.servicelist{
	margin: 0;position: relative;z-index: 5;
}
section.servicelist::before {
	content: "";width: 100%;height: 360px;position: absolute;top: -280px;left: 0;z-index: -1;
	background: url(../img/icon/wave2.svg) no-repeat center / 110%;
}
section.servicelist h2 {
	font-size: 4.8em;
	margin: 0 0 40px;
}
section.servicelist h3 {
	font-size: 1.8em;text-align: center;
	margin: 0 0 20px;
}
section.servicelist ul.area div {
	display: flex;flex-wrap: wrap;justify-content: center;
	font-size: 1.6em;line-height: 1.5;
}
section.servicelist ul.area a:hover {text-decoration: underline}
section.servicelist ul.area a {color: var(--color-background-white);}
section.servicelist ul.area div li::before {content: "　|　";font-size: .9em;}
section.servicelist ul.area div li:nth-of-type(1)::before {content: ""}
section.servicelist ul.list {
	width: 960px;margin: 0 auto 100px;
	display: flex;flex-wrap: wrap;justify-content: center;gap: 30px;
}
section.servicelist ul.list li {width: 300px}
section.servicelist ul.list span {
	display: block;background: var(--color-background-white);
	font-size: 2rem;text-align: center;line-height: 2;
	padding: 31px 0;border-radius: 10px;
}

section.contactbox {
	padding: 85px 0;color: var(--color-background-white);
}
section.areaentry + section.contactbox.back-bl ,
section.flow + section.contactbox.back-bl ,
section.flowbox + section.contactbox.back-bl {
	padding: 85px 0 300px;position: relative;z-index: 1;
}
section.contactbox .flex {
	justify-content: space-between;align-items: center;
}
section.contactbox h2 {margin: 0 0 10px;}
section.contactbox p {font-size: 2rem}
section.contactbox .flex .box:first-child {text-align: center}
section.contactbox .flex .box:last-child {
	width: 310px;
}
section.contactbox.back-yl p {
	font-size: 4rem;color: var(--color-text-black);text-align: left;
	line-height: 1.5;
}
section.area.contactbox {padding: 40px 0;}
section.area.contactbox dl {gap: 2px 0;justify-content: start;}
section.area dl dt {
	width: 120px;
	font-size: 1.4rem;font-weight: bold;color: var(--color-text-black);
}
section.area dl dd {
	width: calc(50% - 145px);margin: 0 50px 0 0;
	font-size: 1.4rem;color: var(--color-text-black);
}
section.area.contactbox dl dd ul {gap: 10px;justify-content: start;}


section.works {padding: 0 0 140px;}
section.works .textbox {
	width: 500px;margin: 0 0 120px;
}
.worksbox {
	display: flex;flex-wrap: wrap;gap: 60px;
}
section.works .wrap {
	display: flex;flex-wrap: wrap;gap: 0 140px;align-items: flex-start;
}
section.works .wrap .imgbox {
	display: flex;flex-wrap: wrap;gap: 10px;
	width: 560px;
}
section.works .wrap .imgbox figure {
	width: 180px;height: 100px;background: var(--color-background-white);
	box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.07);padding: 15px;box-sizing: border-box;
	display: flex;align-items: center;justify-content: center;
}
section.works .wrap .imgbox figure.big {
	width: 100%;height: auto;padding: 0;
	background: none;box-shadow: none;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(3, 1fr);
	grid-column-gap: 10px;grid-row-gap: 10px;
}
section.works .wrap .imgbox figure.big img:nth-of-type(1) { grid-area: 1 / 1 / 3 / 3; }
section.works .wrap .imgbox figure.big img:nth-of-type(2) { grid-area: 1 / 3 / 2 / 4; }
section.works .wrap .imgbox figure.big img:nth-of-type(3) { grid-area: 2 / 3 / 3 / 4; }

/* パンくずリスト */
#breadcrumb {
	padding: 40px 0 0;
	font-size: 1.2em;line-height: 1.2;
}
#breadcrumb ul {display: flex;flex-wrap: wrap;gap: 2.5em;}
#breadcrumb ul li {position: relative}
#breadcrumb ul li::before {
	content: "";width: .6em;height: .6em;background: url(../img/icon/arrow01.svg) no-repeat center / 100%;
	position: absolute;top: .3em;left: -1.55em;
}
#breadcrumb ul li a {opacity: 1;transition: opacity .3s}
#breadcrumb ul li a:hover {opacity: .5}
#breadcrumb ul li:first-child::before {display: none}
#breadcrumb ul li:first-child {padding: 0;}

/* ページャー */
.pagerBox {
	display: block;width: 100%;margin: 100px 0;
	text-align: center;
}
ul.pager {overflow: hidden;display: inline-flex;gap: 50px;}
ul.pager li {
	width: 60px;height: 60px;position: relative;
	font-size: 1.6rem;text-align: center;line-height: 1;letter-spacing: 0;
}
ul.pager li span {
	width: 60px;height: 60px;transition: all .2s;line-height: 1;
	display: block;box-sizing: border-box;
	padding-top: calc((60px - 1.7rem) / 2);padding-bottom: calc((60px - 1.7rem) / 2);
	background: var(--color-text-black);color: var(--color-background-white);
}
ul.pager li.prev span::before ,
ul.pager li.next span::before ,
ul.pager li.first span::before ,
ul.pager li.last span::before {
	content: "";width: 11px;height: 11px;position: absolute;top: -100%;bottom: -100%;left: -100%;right: -100%;margin: auto;transition: all .2s;filter: invert(1);
	background: url(../img/icon/arrow01.svg) no-repeat center / 100%;pointer-events: none;opacity: .2;
}
ul.pager li.first span::before ,
ul.pager li.last span::before {
	background: url(../img/icon/arrow00.svg) no-repeat center / 100%;
}
ul.pager li.first a span::before ,
ul.pager li.last a span::before {opacity: 1}
ul.pager li.first span::before ,
ul.pager li.last span::before {background-position: 0}
ul.pager li.first span::before ,
ul.pager li.prev span::before {transform: rotate(180deg);left: -100%;right: -100%}
ul.pager li.current span ,
ul.pager li a:hover span {background: var(--color-primary);}
ul.pager li.current span {background: var(--color-gray-100);color: var(--color-text-black);}