/* -----------------------------------------------
= contents
----------------------------------------------- */
@media print, screen and (min-width: 1023px) {/* PC */
.contents {
	display: flex;
	gap: 0 calc(120 / 1500 * 100vw);
	max-width: 1446px;
	margin-inline: auto;
	padding-top: 80px;
}
.contents .side-wrap {
	width: 200px;
}
.contents .article {
	flex: 1;
	min-width: 0;
}
}/* @media */
@media print, screen and (max-width: 1023px) and (min-width: 768px) {/* TABLET */
.article {
	padding: 20px;
}
}/* @media */
/* -----------------------------------------------
= side
----------------------------------------------- */
.btn-side {
	position: fixed;
	right: 0;
	bottom: 60px;
	z-index: 5;
	padding: 9px 88px 9px 20px;
	color: #fff;
	background:  #b9b9b1;
	font-family: var(--zen);
	font-size: calc(2rem / 1.6);
	font-weight: 400;
}
.btn-side::after {
	content: "";
	position: absolute;
	top: 20px;
	right: 10px;
	width: 33px;
	height: 12px;
	background: url(../../img/index/icon-index.svg) no-repeat 50% / 100% auto;
}
.btn-close {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 30px;
	height: 30px;
}
.btn-close::before,
.btn-close::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 0.5px;
	background: #808080;
}
.btn-close::before {
	transform: rotate(-45deg);
}
.btn-close::after {
	transform: rotate(45deg);
}
.side.index {
	position: fixed;
	right: 0;
	bottom: 60px;
	width: calc(100% - 32px);
	padding: 16px;
	background: #f2f2ee;
	z-index: 6;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .4s;
}
.side.index[aria-hidden="false"] {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
.side.index .inner {
	display: flex;
	gap: 0 20px;
}
.side.index h2 {
	font-family: var(--zen);
	font-size: calc(1.4rem / 1.6);
	font-weight: 400;
	line-height: 1;
}
.side.index li {
	font-size: calc(1.2rem / 1.6);
	line-height: calc(17 / 12);
	letter-spacing: .02em;
}
.side.index li + li {
	margin-top: 15px;
}
.side.index a.is-current {
	color: var(--red);
}
@media print, screen and (min-width: 1023px) {/* PC */
.btn-side,
.btn-close {
	display: none;
}
.side.index {
	position: sticky;
	top: 100px;
	width: 100%;
	margin-bottom: 190px;
	padding: 0;
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
.side.index .inner {
	display: block;
	padding: 25px;
	background: #f2f2ee;
	text-transform: uppercase;
}
.side.index h2 {
	margin-bottom: 30px;
	font-family: var(--en);
	font-size: calc(2rem / 1.6);
}
.side.index li {
	font-size: calc(1.4rem / 1.6);
	line-height: calc(20 / 14);
	letter-spacing: .02em;
}
.side.index li + li {
	margin-top: 20px;
}
}/* @media */
@media (hover:hover) {
.btn-side {
	transition: color .3s;
}
.btn-side:hover {
	color: var(--red);
}
.index a {
	transition: color .3s;
}
.index a:hover {
	color: var(--red);
}
}/* @media */
@media print, screen and (max-width: 1024px) and (min-width: 768px) {/* TABLET */
.btn-side {
	right: auto;
	left: 0;
}
.side.index {
	right: auto;
	left: 0;
	max-width: 300px;
}
}/* @media */
/* -----------------------------------------------
= block
----------------------------------------------- */
.block {
	margin: 0 13px 90px;
	scroll-margin-top: 45px;
}
.block .title {
	display: flex;
	align-items: center;
	min-height: 58px;
	margin-bottom: 15px;
	padding: 16px;
	color: #fff;
	font-size: calc(2rem / 1.6);
	font-weight: 700;
	letter-spacing: .08em;
}
#systems .title {
	margin-bottom: 35px;
	background: url(../../img/benefits/systems-title-bg.jpg) no-repeat 50% / cover;
}
#case .title {
	background: url(../../img/benefits/case-title-bg.jpg) no-repeat 50% / cover;
}
.block .text {
	margin-bottom: 30px;
	font-size: calc(1.4rem / 1.6);
	line-height: calc(22 / 14);
}
.block .sub-title {
	position: relative;
	margin-bottom: 15px;
	padding: 0 0 4px 14px;
	border-bottom: 0.75px solid #969696 ;
	font-size: calc(1.5rem / 1.6);
	letter-spacing: .04em;
}
.block .sub-title::before {
	content: "";
	position: absolute;
	top: 2px;
	left: 0;
	width: 9px;
	height: 16.5px;
	background: var(--red);
}
.block .img {
	margin-right: -13px;
	padding-bottom: 10px;
}
.block .img img {
	width: 750px;
	max-width: none;
}
@media print, screen and (min-width: 768px) {/* PC */
.block {
	margin: 0 0 190px;
	scroll-margin-top: 66px;
}
.block .title {
	min-height: 110px;
	margin-bottom: 30px;
	padding: 35px;
	font-size: calc(2.8rem / 1.6);
}
.block .text {
	margin-bottom: 70px;
	font-size: calc(1.8rem / 1.6);
	line-height: calc(32 / 18);
}
.block .sub-title {
	margin-bottom: 20px;
	padding: 0 0 4px 20px;
	border-bottom: 1px solid #969696 ;
	font-size: calc(2rem / 1.6);
}
.block .sub-title::before {
	top: 4px;
	width: 12px;
	height: 22px;
}
.block .inner {
	margin-inline: 50px;
}
.block .img {
	margin-inline: auto;
	padding-bottom: 0;
}
.block .img img {
	width: auto;
	max-width: 100%;
}
}/* @media */
/* -----------------------------------------------
= intro
----------------------------------------------- */
.intro {
	margin: 25px 13px 35px;
}
.intro .text {
	font-size: calc(1.4rem / 1.6);
	line-height: calc(22 / 14);
}
@media print, screen and (min-width: 768px) {/* PC */
.intro {
	margin: 0 0 130px;
}
.intro .text {
	font-size: calc(1.8rem / 1.6);
	line-height: calc(36 / 18);
}
}/* @media */
/* -----------------------------------------------
= systems
----------------------------------------------- */
.systems .item {
	padding: 20px;
	border: 0.5px solid #f25f69;
	box-shadow: 0 0 3.25px rgba(0,0,0,.2);
}
.systems .item + .item {
	margin-top: 20px;
}
.systems .item h3 {
	position: relative;
	margin-bottom: 15px;
	padding-bottom: 10px;
	font-size: calc(1.5rem / 1.6);
	text-align: center;
}
.systems .item h3::after {
	content: "";
	position: absolute;
	left: calc(50% - 13px);
	bottom: 0;
	width: 26px;
	height: 1px;
	background: var(--red);
}
.systems .item figure {
	display: block;
	max-width: 242px;
	margin-inline: auto;
}
.systems .item figcaption {
	margin-top: 5px;
	font-size: calc(1rem / 1.6);
}
.systems .item p {
	margin-top: 10px;
	font-size: calc(1.3rem / 1.6);
	line-height: calc(20 / 13);
}
.systems .item li {
	position: relative;
	margin-top: 15px;
	padding-left: 12px;
	font-size: calc(1.3rem / 1.6);
	line-height: calc(20 / 13);
}
.systems .item li::before {
	content: "";
	position: absolute;
	top: 4px;
	left: 0;
	width: 10px;
	height: 10px;
	background: #ff8600;
	border-radius: 50%;
}
.systems .item li span {
	font-size: calc(1.4rem / 1.6);
	font-weight: 700;
}
.systems .item-other {
	display: flex;
	flex-wrap: wrap;
	gap: 0 1em;
}
.systems .item-other li:nth-child(4) {
	width: 100%;
}
.systems .evaluation {
	margin-top: 20px;
	padding: 20px;
	box-shadow: 0 0 3.25px rgba(0,0,0,.2);
}
.systems .evaluation h3 {
	margin-bottom: 40px;
	font-size: calc(1.5rem / 1.6);
	text-align: center;
}
.systems .evaluation .set + .set {
	margin-top: 35px;
}
.systems .evaluation h4 {
	max-width: 180px;
	margin: 0 auto 20px;
	padding: 3px 0;
	color: #fff;
	background: #b0b098;
	border-radius: 4px;
	font-size: calc(1.5rem / 1.6);
	text-align: center;
	letter-spacing: .1em;
}
.systems .evaluation img {
	display: block;
	max-width: 245px;
	margin-inline: auto;
}
.systems .evaluation p {
	font-size: calc(1.3rem / 1.6);
	line-height: calc(20 / 13);
	letter-spacing: .04em;
}
@media print, screen and (min-width: 768px) {/* PC */
.systems .list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 42px;
}
.systems .item {
	padding: 30px 60px;
	border: 1px solid #f25f69;
	box-shadow: 0 0 5px rgba(0,0,0,.2);
}
.systems .item + .item {
	margin-top: 0;
}
.systems .item h3 {
	margin-bottom: 30px;
	padding-bottom: 25px;
	font-size: calc(2.2rem / 1.6);
}
.systems .item h3::after {
	left: calc(50% - 20px);
	width: 40px;
	height: 2px;
}
.systems .item figure {
	max-width: none;
	margin-bottom: 20px;
}
.systems .item figcaption {
	margin-top: 5px;
	font-size: calc(1.4rem / 1.6);
}
.systems .item p {
	margin-top: 10px;
	font-size: calc(1.6rem / 1.6);
	line-height: calc(28 / 16);
}
.systems .item li {
	margin-top: 10px;
	padding-left: 12px;
	font-size: calc(1.6rem / 1.6);
	line-height: calc(28 / 16);
}
.systems .item li::before {
	top: 10px;
}
.systems .item li span {
	font-size: calc(1.8rem / 1.6);
}
.systems .evaluation {
	margin-top: 40px;
	padding: 35px 40px;
	box-shadow: 0 0 5px rgba(0,0,0,.2);
}
.systems .evaluation-inner {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 123px;
}
.systems .evaluation h3 {
	margin-bottom: 25px;
	font-size: calc(2.4rem / 1.6);
}
.systems .evaluation .set + .set {
	margin-top: 0;
}
.systems .evaluation h4 {
	max-width: 300px;
	margin: 0 auto 10px;
	padding: 3px 0;
	border-radius: 8px;
	font-size: calc(2.2rem / 1.6);
}
.systems .evaluation p {
	font-size: calc(1.6rem / 1.6);
	line-height: calc(28 / 16);
}
}/* @media */
/* -----------------------------------------------
= case
----------------------------------------------- */
.case .sub-text-title {
	margin-bottom: 10px;
	font-size: calc(1.6rem / 1.6);
	font-weight: 700;
	line-height: calc(30 / 16);
	letter-spacing: .08em;
}
.case-map {
	position: relative;
	width: 824px;
	height: 585px;
}
.case-map li {
	position: absolute;
}
.case-map li:nth-child(1) {
	top: 35px;
	left: 78px;
	width: 147px;
	height: 27px;
}
.case-map li:nth-child(2) {
	top: 76px;
	left: 226px;
	width: 148px;
	height: 27px;
}
.case-map li:nth-child(3) {
	top: 116px;
	left: 283px;
	width: 468px;
	height: 27px;
}
.case-map li:nth-child(4) {
	top: 79px;
	left: 221px;
	width: 147px;
	height: 27px;
}
.case-map li:nth-child(5) {
	top: 295px;
	left: 375px;
	width: 297px;
	height: 27px;
}
.case-map li a {
	display: block;
	height: 100%;
}
.case-map li a span {
	display: none;
}
.case .list {
	margin: 34px 0;
}
.case .list li {
	scroll-margin-top: 46px;
	border: 0.5px solid #f25f69;
	box-shadow: 0 0 3.25px rgba(0,0,0,.2);
}
.case .list li + li {
	margin-top: 20px;
}
.case .list .title-set {
	display: flex;
	align-items: center;
	gap: 0 10px;
	padding-inline: 22px 16px;
}
.case .list .title-set .num {
	display: grid;
	place-content: center;
	width: 22px;
	height: 22px;
	color: var(--red);
	background: #fff;
	border: 1px solid #ff414d;
	border-radius: 50%;
	font-size: calc(1.1rem / 1.6);
	letter-spacing: 0;
}
.case .list .title-set h4 {
	font-size: calc(1.5rem / 1.6);
	letter-spacing: .04em;
}
.case .list .title-set div {
	flex: 1;
	position: relative;
	margin-bottom: -6px;
	text-align: right;
}
.case .list .title-set img {
	width: 92px;
}
.case .list li:nth-child(1) .title-set {
	background: #fcf0f2;
}
.case .list li:nth-child(2) .title-set {
	background: #fdf1e1;
}
.case .list li:nth-child(3) .title-set {
	background: #f1ecf2;
}
.case .list li:nth-child(4) .title-set {
	background: #f1ecf2;
}
.case .list li:nth-child(5) .title-set {
	background: #f1ecf2;
}
.case .list .text {
	margin-bottom: 0;
	padding: 20px;
	font-size: calc(1.3rem / 1.6);
	line-height: calc(20 / 13);
	letter-spacing: .06em;
}
.case .ex {
	margin-bottom: 46px;
}
.case .ex li {
	padding: 0 17px 17px;
	background: #f2f2ee;
	text-align: center;
}
.case .ex li + li {
	margin-top: 16px;
}
.case .ex .num {
	display: inline-block;
	margin-bottom: 24px;
	padding: 2px 30px;
	color: #fff;
	background: #98cd44;
	border-radius: 0 0 10px 10px;
	font-size: calc(1.1rem / 1.6);
	letter-spacing: .08em;
}
.case .ex h4 {
	margin-bottom: 24px;
	font-size: calc(1.4rem / 1.6);
	font-weight: 700;
	letter-spacing: .08em;
}
.case .ex img {
	display: block;
	position: relative;
	width: 82px;
	margin: 0 auto -40px;
}
.case .ex .box {
	padding: 40px 0 30px;
	background: #fff;
	border-radius: 10px;
}
.case .ex .item-title {
	display: flex;
	justify-content: space-between;
	max-width: 234px;
	margin: 0 auto 13px;
}
.case .ex .item-title h5 {
	position: relative;
	width: 84px;
	padding-bottom: 12px;
	color: #98cd44;
	font-size: calc(1.2rem / 1.6);
	font-weight: 700;
	letter-spacing: .08em;
}
.case .ex .item-title h5::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 7.2px;
	background: url(../../img/benefits/case-ex-title-bg.svg) no-repeat 50% / auto 100%;
}
.case .ex .box-inner {
	position: relative;
}
.case .ex .box-inner::before {
	content: "";
	position: absolute;
	bottom: 0;
	left: calc(50% - 1.5px);
	width: 3px;
	height: calc(100% - 20px);
	background: #ffea43;
}
.case .ex .item {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr 53px 1fr;
	gap: 0 8px;
	align-items: center;
}
.case .ex .item + .item {
	margin-top: 30px;
}
.case .ex .item .year {
	order: 2;
	display: grid;
	place-content: center;
	min-height: 30px;
	color: #fff;
	background: #98cd44;
	border-radius: 4.8px;
	font-size: calc(1.1rem / 1.6);
	font-weight: 700;
	line-height: calc(12 / 11);
	letter-spacing: .08em;
}
.case .ex .item .career {
	order: 1;
	font-size: calc(1.2rem / 1.6);
	line-height: calc(14 / 12);
	text-align: right;
	letter-spacing: .04em;
}
.case .ex .item .use {
	order: 3;
	font-size: calc(1.2rem / 1.6);
	font-weight: 700;
	line-height: calc(14 / 12);
	text-align: left;
	letter-spacing: .04em;
}
.case .ex .item .use span {
	font-size: calc(1rem / 1.6);
	font-weight: 500;
}
.case .voice {
	padding: 33px 33px 50px;
	background: #f2f2ee;
}
.case .voice li {
	position: relative;
	padding: 13px 20px;
	background: linear-gradient(45deg,#ffc43a,#7fc22d);
	border-radius: 16.8px;
}
.case .voice li + li {
	margin-top: 42px;
}
.case .voice li::after {
	content: "";
	position: absolute;
	inset: 3px;
	background: #fff;
	border-radius: 15px;
}
.case .voice li::before {
	content: "";
	position: absolute;
	left: 50px;
	bottom: -19px;
	width: 39px;
	height: 19px;
	background: url(../../img/benefits/case-voice-bg.svg) no-repeat 50% / cover;
}
.case .voice li h4 {
	position: relative;
	z-index: 1;
	margin-bottom: 5px;
	font-size: calc(1.5rem / 1.6);
	font-weight: 700;
}
.case .voice li p {
	position: relative;
	z-index: 1;
	font-size: calc(1.3rem / 1.6);
	line-height: calc(22 / 13);
}
@media print, screen and (min-width: 768px) {/* PC */
.case .sub-text-title {
	margin-bottom: 10px;
	font-size: calc(2.4rem / 1.6);
}
.case .text {
	margin-bottom: 60px;
}
.case-map {
	width: 1098px;
	height: 780px;
}
.case-map li:nth-child(1) {
	top: 49px;
	left: 105px;
	width: 196px;
	height: 36px;
}
.case-map li:nth-child(2) {
	top: 103px;
	left: 302px;
	width: 198px;
	height: 36px;
}
.case-map li:nth-child(3) {
	top: 156px;
	left: 378px;
	width: 624px;
	height: 36px;
}
.case-map li:nth-child(4) {
	top: 297px;
	left: 105px;
	width: 196px;
	height: 36px;
}
.case-map li:nth-child(5) {
	top: 395px;
	left: 501px;
	width: 397px;
	height: 36px;
}
.case .list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 42px;
	margin: 44px 0 75px;
}
.case .list li {
	scroll-margin-top: 66px;
	border: 1px solid #f25f69;
	box-shadow: 0 0 5px rgba(0,0,0,.2);
}
.case .list li + li {
	margin-top: 0;
}
.case .list .title-set {
	gap: 0 12px;
	padding-inline: 13px 0;
}
.case .list .title-set .num {
	width: 36px;
	height: 36px;
	font-size: calc(1.8rem / 1.6);
}
.case .list .title-set h4 {
	font-size: calc(2.2rem / 1.6);
}
.case .list .title-set div {
	margin-bottom: -10px;
}
.case .list .title-set img {
	width: 150px;
}
.case .list .text {
	padding: 30px 62px;
	font-size: calc(1.6rem / 1.6);
	line-height: calc(28 / 16);
}
.case .ex {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 44px;
	margin-bottom: 50px;
}
.case .ex li {
	padding: 0 28px 28px;
}
.case .ex li + li {
	margin-top: 0;
}
.case .ex .num {
	margin-bottom: 40px;
	padding: 4px 45px;
	border-radius: 0 0 10px 10px;
	font-size: calc(1.6rem / 1.6);
}
.case .ex h4 {
	margin-bottom: 40px;
	font-size: calc(2.4rem / 1.6);
}
.case .ex img {
	width: 136px;
	margin: 0 auto -68px;
}
.case .ex .box {
	padding: 67px 0 50px;
	border-radius: 20px;
}
.case .ex .item-title {
	max-width: 390px;
	margin: 0 auto 20px;
}
.case .ex .item-title h5 {
	width: 141px;
	padding-bottom: 12px;
	font-size: calc(2rem / 1.6);
}
.case .ex .item-title h5::after {
	height: 12px;
}
.case .ex .box-inner::before {
	left: calc(50% - 2px);
	width: 4px;
}
.case .ex .item {
	grid-template-columns: 1fr 88px 1fr;
	gap: 0 16px;
}
.case .ex .item + .item {
	margin-top: 50px;
}
.case .ex .item .year {
	min-height: 50px;
	border-radius: 8px;
	font-size: calc(1.8rem / 1.6);
	line-height: calc(20 / 18);
}
.case .ex .item .career {
	font-size: calc(1.8rem / 1.6);
	line-height: calc(22 / 18);
}
.case .ex .item .use {
	font-size: calc(1.8rem / 1.6);
	line-height: calc(22 / 18);
}
.case .ex .item .use span {
	font-size: calc(1.6rem / 1.6);
}
.case .voice {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 88px 60px;
	padding: 76px 60px 90px;
}
.case .voice li {
	padding: 20px 33px;
	border-radius: 28px;
}
.case .voice li + li {
	margin-top: 0;
}
.case .voice li::after {
	inset: 4px;
	border-radius: 25px;
}
.case .voice li::before {
	left: 80px;
	bottom: -32px;
	width: 65px;
	height: 32px;
}
.case .voice li h4 {
	margin-bottom: 10px;
	font-size: calc(2.2rem / 1.6);
}
.case .voice li p {
	font-size: calc(1.6rem / 1.6);
	line-height: calc(28 / 16);
}
}/* @media */