@charset "UTF-8";
/* CSS Document */

/*
	アジェンダTOP
-----------------------------------------------------------------------------------------------*/
#ctsWrapper.pageAgenda{
	overflow: hidden;
}

/* アンカーリンクボタンボタン
============================== */
.pageAgenda #cmnPageTitWrapper a[class^="btnBase"].btnSmall{
	width: clamp(200px, 100%, 250px);
}
.pageAgenda #cmnPageTitWrapper a[class^="btnBase"].btnSmall::after{
	transform: translateY(-50%) rotate(90deg) scale(0.23);
}
/* hover */
@media (any-hover: hover){
	.pageAgenda #cmnPageTitWrapper a[class^="btnBase"].btnSmall:hover:after{
		transform: translateY(-50%) rotate(90deg) scale(1);
	}
}

/*
	10の経営アジェンダ概要
-----------------------------------------------------------------------------------------------*/
#agendaAboutWrapper{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 60px;
	margin-bottom: 100px;
}
#agendaAboutWrapper > .txt{
	text-align: center;
}

/* 図
============================== */
.agendaAboutFigureArea{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: space-between;
	width: 600px;
}
.agendaAboutFigureArea .titArea{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
}
.agendaAboutFigureArea .titArea .tit{
	font-size: 3.2rem;
	font-weight: 600;
	line-height: 1.8;
	letter-spacing: 0.2rem;
}

/* リストテキスト
============================== */
.listAgendaAbout{
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 470px;
}
.listAgendaAbout > li{
	padding: 25px 30px;
	line-height: 1.8;
	background-color: var(--color-natural-grey-25);
	border-radius: var(--border-radius-5);
	position: relative;
}
.listAgendaAbout > li::first-letter {
	font-size: 2.2rem;
	font-weight: 700;
}
.listAgendaAbout > li::before,
.listAgendaAbout > li::after{
	font-size: 8.0rem;
	color: var(--color-primary-red-default);
	line-height: 1.0;
	position: absolute;
}
.listAgendaAbout > li::before{
	content: "“";
	top: -20px;
	left: 20px;
}
.listAgendaAbout > li::after{
	content: "”";
	right: 20px;
	bottom: -50px;
}


/*
	10の経営アジェンダ
-----------------------------------------------------------------------------------------------*/
#agendaWrapper{
	margin-bottom: 100px;
}

/* スライダーバナー
============================== */
.listAgendaBnrWrapper{
	padding-bottom: 50px;
}
.listAgendaBnr{
	display: flex;
	align-items: center;
}
.listAgendaBnr > li{
	width: 800px;
}
.listAgendaBnr > li a{
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
	min-height: 250px;
	padding: 50px;
	border-radius: var(--border-radius-5);
	position: relative;
	overflow: hidden;
}
.listAgendaBnr > li a *{
	transition: all 0.4s;
}
/* タイトル */
.listAgendaBnr > li .tit{
	font-size: 2.8rem;
	font-weight: 600;
	color: #fff;
}
/* テキスト */
.listAgendaBnr > li .txt{
	width: 350px;
	color: #fff;
	text-align: justify;
}
/* アイコン */
.listAgendaBnr > li .ico{
	width: 150px;
	position: absolute;
	left: -10px;
	bottom: -10px;
	opacity: 0.3;
}
/* 画像 */
.listAgendaBnr > li .img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	inset: 0;
	z-index: -1;
}
@media (any-hover: hover){
	.listAgendaBnr > li a:hover{
		opacity: 1;
	}
	.listAgendaBnr > li a:hover .img{
		transform: scale(1.1);
	}
}

/* swiper
============================== */
.jsSwiperAgendaBnr .swiper-slide{
	transition: all 0.4s;
	transform: scale(0.9);
}
.jsSwiperAgendaBnr .swiper-slide-active {
	transform: scale(1.0);
}
/* swiper-button */
[class*="jsSwiperBtn"]{
	top: 50%;
	transform: translateY(-50%);
}
.jsSwiperBtnPrev{
	left: calc(50% - 400px - 25px);
	transform: translateY(-50%) rotate(180deg);
}
.jsSwiperBtnNext{
	right: calc(50% - 400px - 25px);
}

/* 共通 記事カード
============================== */
#agendaWrapper .cmnListArticleCard{
	justify-content: center;
}
/* DX戦略策定 */
.cmnListArticleCard li.dxStrategy .btn::after{
	background-color: var(--color-agenda-red);
}
/* 業務効率化 */
.cmnListArticleCard li.processOptimization .btn::after{
	background-color: var(--color-agenda-orange);
}
/* ERP */
.cmnListArticleCard li.erp .btn::after{
	background-color: var(--color-agenda-yellow);
}
/* レガシーモダナイゼーション */
.cmnListArticleCard li.legacyModernization .btn::after{
	background-color: var(--color-agenda-yellowGreen);
}
/* データ分析/データ活用 */
.cmnListArticleCard li.dataAnalytics .btn::after{
	background-color: var(--color-agenda-green);
}
/* セキュリティ対策 */
.cmnListArticleCard li.cyberSecurity .btn::after{
	background-color: var(--color-agenda-blueGreen);
}
/* クラウド活用(リフト/シフト) */
.cmnListArticleCard li.cloudMigration .btn::after{
	background-color: var(--color-agenda-skyBlue);
}
/* AI・IoT利活用 */
.cmnListArticleCard li.aiIot .btn::after{
	background-color: var(--color-agenda-blue);
}
/* CRM・SFA・MA */
.cmnListArticleCard li.crm .btn::after{
	background-color: var(--color-agenda-purple);
}
/* システム運用/ITガバナンス */
.cmnListArticleCard li.itGovernance .btn::after{
	background-color: var(--color-agenda-pink);
}


/*
	ソリューション一覧
-----------------------------------------------------------------------------------------------*/
.agendaSolution{
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.agendaSolution *{
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0;
}

/* グループ
============================== */
/* 赤帯タイトル */
.agendaSolutionGroup > .tit{
	display: flex;
	align-items: center;
	min-height: 35px;
	padding: 5px 15px;
	font-size: 1.5rem;
	color: #fff;
	letter-spacing: 0.1rem;
	background-color: var(--color-primary-red-default);
	border-radius: var(--border-radius-5) var(--border-radius-5) 0 0;
}
/* グレー背景 */
.agendaSolutionGroup > .ctsBox{
	padding: 15px;
	background-color: var(--color-natural-grey-25);
	border-radius: 0 0 var(--border-radius-5) var(--border-radius-5);
}

/* セクション
============================== */
.agendaSolutionSection{
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px solid var(--color-natural-grey-100);
}
.agendaSolutionSection:last-of-type{
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

/* カード
============================== */
.agendaSolutionCardArea{
	display: grid;
	gap: 10px;
}
.agendaSolutionCard{
	display: flex;
	flex-direction: column;
	gap: 5px;
}
/* 左線タイトル */
.agendaSolutionCard > .tit {
	padding-left: 10px;
	border-left: 3px solid var(--color-primary-red-default);
}
/* 5カラム */
[data-cols="5"]{
	grid-template-columns: repeat(5, minmax(0, 1fr));
}
[data-cols="5"] .listAgendaSolutionBtn > li{
	width: 100%;
}
/* 3カラム */
[data-cols="3"]{
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
[data-cols="3"] .listAgendaSolutionBtn > li{
	width: calc((100% - 10px)/2);
}
/* 2カラム */
[data-cols="2"]{
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
[data-cols="2"] .listAgendaSolutionBtn > li{
	width: calc((100% - 30px)/4);
}
/* 1カラム */
[data-cols="1"] .listAgendaSolutionBtn a{
	padding-inline: 20px;
}

/* ボタン
============================== */
.agendaSolutionBtnAreaWrapper{
	display: grid;
	gap: 10px;
	height: 100%;
}
.agendaSolutionBtnArea{
	display: inline-flex;
	flex-direction: column;
	gap: 10px;
	padding: 10px;
	background-color: var(--color-natural-grey-50);
	border-radius: var(--border-radius-5);
}
.agendaSolutionBtnArea > .tit{
	font-size: 1.2rem;
	text-align: center;
}
/* ボタンリスト */
.listAgendaSolutionBtn{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.listAgendaSolutionBtn a{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 30px;
	padding-inline: 10px;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--color-primary-red-default);
	background: #fff;
	border-radius: 15px;
}
@media (any-hover: hover){
	.listAgendaSolutionBtn a:hover{
		color: #fff;
		background-color: var(--color-natural-grey-900);
		opacity: 1;
	}
}


/*
	アジェンダ詳細
-----------------------------------------------------------------------------------------------*/
.pageAgendaDetail .cmnPageTitArea{
	align-items: flex-start;
}

/* 特徴
============================== */
.agendaFeatureWrapper{
	margin-bottom: 100px;
	padding-block: 80px;
	background: url("../images/bg_agenda_agendaFeature_pc.png") no-repeat center center / cover;
	position: relative;
	z-index: 0;
}
.agendaFeatureWrapper::before{
	content: "";
	width: 100%;
	height: 100%;
	mix-blend-mode: color-dodge;
	position: absolute;
	inset: 0;
	z-index: -1;
}
/* ループテキスト */
.loopTxt{
	width: 100%;
	position: absolute;
	top: -100px;
	left: 0;
	overflow: hidden;
}
.loopTrack{
	display:flex;
	gap:80px;
	width:max-content;
	will-change: transform;
	animation: marquee 30s linear infinite;
	mix-blend-mode: multiply;
}
.loopTxt .item{
	flex-shrink: 0;
	white-space: nowrap;
	font-family: var(--font-family-en);
	font-size: 12.0rem;
	font-weight: 900;
	color: #fff;
	line-height: 1.2;
	text-shadow: 1px 1px 0 var(--color-natural-grey-200), -1px -1px 0 var(--color-natural-grey-200), -1px 1px 0 var(--color-natural-grey-200),
				1px -1px 0 var(--color-natural-grey-200), 1px 0 0 var(--color-natural-grey-200), -1px 0 0 var(--color-natural-grey-200),
				0 1px 0 var(--color-natural-grey-200), 0 -1px 0 var(--color-natural-grey-200);
}
@keyframes marquee{
	from{ transform: translateX(0); }
	to  { transform: translateX(calc(-1 * var(--shift))); }
}
/* リスト */
.listAgendaFeature{
	display: flex;
	justify-content: space-between;
}
.listAgendaFeature > li{
	width: calc((100% - 120px)/3);
	color: #fff;
	position: relative;
}
.listAgendaFeature > li:not(:last-child)::after{
	content: "";
	width: 1px;
	height: 100%;
	position: absolute;
	top: 0;
	right: -30px;
	background: #fff;
	opacity: 0.5;
}
.listAgendaFeature .ico{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100px;
	aspect-ratio: 1/1;
	margin: 0 auto 20px;
	position: relative;
	z-index: 0;
}
.listAgendaFeature .ico::after{
	content: "";
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: #fff;
	filter: blur(10px);
	position: absolute;
	inset: 0;
	z-index: -1;
}
.listAgendaFeature .ico svg{
	width: 60%;
	height: auto;
}
.listAgendaFeature .tit{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
	margin-bottom: 15px;
	font-size: 1.7rem;
	font-weight: 600;
	text-align: center;
}
.listAgendaFeature .tit::after{
	content: "";
	width: 30px;
	height: 3px;
	background: #fff;
}
.listAgendaFeature .txt{
	text-align: justify;
}


/*
	業態別の課題解決
-----------------------------------------------------------------------------------------------*/
.cts2colArea{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	margin-bottom: 100px;
	position: relative;
}

/* アンカーリンクボタンボタン
============================== */
.pageAgendaDetail .cmnListAnkerLinkWrapper{
	width: 230px;
	position: sticky;
	top: 80px;
}

/* 解決ソリューション一覧
============================== */
/* 課題解決タイプ */
.solutionTypeWrapper{
	display: flex;
	flex-direction: column;
	gap: 100px;
	width: 840px;
}
.solutionBox{
	margin-bottom: 30px;
}
/* 課題解決ボックス */
.solutionBox .titArea{
	min-height: 50px;
	border-radius: var(--border-radius-5) var(--border-radius-5) 0 0;
	position: relative;
	z-index: 0;
}
.solutionBox .titArea::before{
	content: "";
	width: 100%;
	height: 100%;
	background: var(--background-noise);
	position: absolute;
	inset: 0;
	z-index: -1;
}
.solutionBox .label{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 80px;
	aspect-ratio: 1/1;
	padding: 5px 0 0 0;
	font-family: var(--font-family-en);
	color: #fff;
	font-weight: 900;
	line-height: 1.2;
	background-color: var(--color-natural-grey-900);
	border-radius: 50%;
	position: absolute;
	left: 15px;
	bottom: 10px;
}
.solutionBox .label .num{
	font-size: 3.6rem;
	line-height: 1.0;
}
.solutionBox .titArea .tit{
	display: flex;
	align-items: center;
	padding: 10px 15px 10px 110px;
	font-size: 1.8rem;
	font-weight: 600;
	color: #fff;
}
.solutionBox .bodyArea{
	padding: 45px 30px 30px;
	background: url("../images/bg_agenda_solution_pc.png") no-repeat center center / cover;
	border-radius: 0 0 var(--border-radius-5) var(--border-radius-5);
	position: relative;
	overflow: hidden;
	z-index: 0;
}
.solutionBox .bodyArea::before{
	content: "";
	width: 100%;
	height: 100%;
	mix-blend-mode: color-dodge;
	position: absolute;
	inset: 0;
	z-index: -1;
	opacity: 0.5;
}
.solutionBox .leadTxt{
	color: #fff;
	text-align: center;
}
/* 解決ソリューション */
.solutionCardArea{
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
}
.solutionCard{
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	width: calc((100% - 15px)/2);
	padding: 25px 20px 20px;
	background-color: #fff;
	border-radius: var(--border-radius-5);
	position: relative;
}
.solutionCard .tit{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 26px;
	padding-inline: 20px;
	font-size: 1.3rem;
	font-weight: 600;
	color: #fff;
	background-color: var(--color-primary-red-default);
	border-radius: 20px;
	position: absolute;
	top: -13px;
	left: 50%;
	transform: translateX(-50%);
}
.solutionCard .ico{
	width: 70px;
}
.listAgendaSolution{
	width: calc(100% - 90px);
	display: flex;
	flex-direction: column;
	gap: 5px;
}
.listAgendaSolution > li{
	padding-left: 10px;
	font-size: 1.3rem;
	font-weight: 500;
	position: relative;
}
.listAgendaSolution > li::before{
	content: " ";
	width: 4px;
	aspect-ratio: 1/1;
	background: var(--color-natural-grey-900);
	border-radius: 50%;
	position: absolute;
	top: 8px;
	left: 0;
}
/* 共通 記事カード */
.pageAgendaDetail .cmnListArticleCardWrapper{
	gap: 0;
}
.pageAgendaDetail .cmnListArticleCard > li  figure.img{
	height: 80px;
}
/* フッター */
.agendaDetailFooter{
	padding-block: 50px;
	background-color: var(--color-natural-grey-25);
}


/*
	アジェンダ別カラー
-----------------------------------------------------------------------------------------------*/
/* DX戦略策定
============================== */
.dx-strategy .agendaFeatureWrapper::before,
.dx-strategy .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-red);
}
.dx-strategy .listAgendaFeature .ico svg{
	color: var(--color-agenda-red);
}
.dx-strategy .cmnPageSlash,
.dx-strategy .solutionBox .titArea{
	background: var(--gradation-agenda-red);
}

/* 業務効率化
============================== */
.process-optimization .agendaFeatureWrapper::before,
.process-optimization .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-orange);
}
.process-optimization .agendaFeatureWrapper::before{
	opacity: 0.5;
}
.process-optimization .listAgendaFeature .ico svg{
	color: var(--color-agenda-orange);
}
.process-optimization .cmnPageSlash,
.process-optimization .solutionBox .titArea{
	background: var(--gradation-agenda-orange);
}

/* ERP
============================== */
.erp .agendaFeatureWrapper::before{
	background-color: #e5d285;
	opacity: 0.4;
}
.erp .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-yellow);
}
.erp .listAgendaFeature .ico svg{
	color: var(--color-agenda-yellow);
}
.erp .cmnPageSlash,
.erp .solutionBox .titArea{
	background: var(--gradation-agenda-yellow);
}

/* レガシーモダナイゼーション
============================== */
.legacy-modernization .agendaFeatureWrapper::before,
.legacy-modernization .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-yellowGreen);
}
.legacy-modernization .agendaFeatureWrapper::before{
	opacity: 0.7;
}
.legacy-modernization .listAgendaFeature .ico svg{
	color: var(--color-agenda-yellowGreen);
}
.legacy-modernization .cmnPageSlash,
.legacy-modernization .solutionBox .titArea{
	background: var(--gradation-agenda-yellowGreen);
}

/* データ分析/データ活用
============================== */
.data-analytics .agendaFeatureWrapper::before,
.data-analytics .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-green);
}
.data-analytics .listAgendaFeature .ico svg{
	color: var(--color-agenda-green);
}
.data-analytics .cmnPageSlash,
.data-analytics .solutionBox .titArea{
	background: var(--gradation-agenda-green);
}

/* セキュリティ対策
============================== */
.cyber-security .agendaFeatureWrapper::before,
.cyber-security .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-blueGreen);
}
.cyber-security .listAgendaFeature .ico svg{
	color: var(--color-agenda-blueGreen);
}
.cyber-security .cmnPageSlash,
.cyber-security .solutionBox .titArea{
	background: var(--gradation-agenda-blueGreen);
}

/* クラウド活用(リフト/シフト)
============================== */
.cloud-migration .agendaFeatureWrapper::before,
.cloud-migration .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-skyBlue);
}
.cloud-migration .listAgendaFeature .ico svg{
	color: var(--color-agenda-skyBlue);
}
.cloud-migration .cmnPageSlash,
.cloud-migration .solutionBox .titArea{
	background: var(--gradation-agenda-skyBlue);
}

/* AI・IoT利活用
============================== */
.ai-iot .agendaFeatureWrapper::before{
	background-color: #015ead;
}
.ai-iot .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-blue);
}
.ai-iot .listAgendaFeature .ico svg{
	color: var(--color-agenda-blue);
}
.ai-iot .cmnPageSlash,
.ai-iot .solutionBox .titArea{
	background: var(--gradation-agenda-blue);
}

/* CRM・SFA・MA
============================== */
.crm .agendaFeatureWrapper::before{
	background-color: #7a2995;
}
.crm .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-purple);
}
.crm .listAgendaFeature .ico svg{
	color: var(--color-agenda-purple);
}
.crm .cmnPageSlash,
.crm .solutionBox .titArea{
	background: var(--gradation-agenda-purple);
}

/* システム運用/ITガバナンス
============================== */
.it-governance .agendaFeatureWrapper::before,
.it-governance .solutionBox .bodyArea::before{
	background-color: var(--color-agenda-pink);
}
.it-governance .listAgendaFeature .ico svg{
	color: var(--color-agenda-pink);
}
.it-governance .cmnPageSlash,
.it-governance .solutionBox .titArea{
	background: var(--gradation-agenda-pink);
}




@media screen and (max-width:812px){
	/*
		アジェンダTOP
	-----------------------------------------------------------------------------------------------*/
	/* アンカーリンクボタンボタン
	============================== */
	.pageAgenda #cmnPageTitWrapper a[class^="btnBase"].btnSmall{
		width: clamp(150px, 100%, 200px);
		font-size: 1.0rem;
	}
	.pageAgenda #cmnPageTitWrapper a[class^="btnBase"].btnSmall::after{
		transform: translateY(-50%) rotate(90deg) scale(1);
	}

	/*
		10の経営アジェンダ概要
	-----------------------------------------------------------------------------------------------*/
	#agendaAboutWrapper{
		flex-direction: column;
		gap: 30px;
		margin-bottom: 80px;
	}

	/* 図
	============================== */
	.agendaAboutFigureArea{
		gap: 20px;
		width: 100%;
	}
	.agendaAboutFigureArea .titArea .tit{
		font-size: 2.0rem;
		line-height: 1.5;
	}
	.agendaAboutFigureArea .titArea .img{
		width: calc(100% - 200px);
		font-size: 2.0rem;
	}

	/* リストテキスト
	============================== */
	.listAgendaAbout{
		width: 100%;
	}
	.listAgendaAbout > li{
		padding: 15px 20px;
		font-size: 1.3rem;
	}
	.listAgendaAbout > li::first-letter {
		font-size: 1.6rem;
	}
	.listAgendaAbout > li::before,
	.listAgendaAbout > li::after{
		font-size: 5.0rem;
	}
	.listAgendaAbout > li::before{
		top: -15px;
		left: 10px;
	}
	.listAgendaAbout > li::after{
		right: 10px;
		bottom: -35px;
	}


	/*
		10の経営アジェンダ
	-----------------------------------------------------------------------------------------------*/
	/* スライダーバナー
	============================== */
	.listAgendaBnrWrapper{
		padding-bottom: 30px;
		overflow: visible;
	}
	.listAgendaBnr > li{
		width: 100%;
		max-width: 300px;
	}
	.listAgendaBnr > li a{
		min-height: 150px;
		padding: 20px 30px;
	}
	/* タイトル */
	.listAgendaBnr > li .tit{
		font-size: 1.6rem;
	}
	/* テキスト */
	.listAgendaBnr > li .txt{
		width: 100%;
		font-size: 1.3rem;
	}
	/* アイコン */
	.listAgendaBnr > li .ico{
		width: 80px;
		left: -5px;
		bottom: -5px;
	}

	/* swiper
	============================== */
	.jsSwiperBtnPrev{
		left: calc(50% - 150px - 20px);
		transform: translateY(-50%) rotate(180deg);
	}
	.jsSwiperBtnNext{
		right: calc(50% - 150px - 20px);
	}


	/*
		ソリューション一覧
	-----------------------------------------------------------------------------------------------*/
	/* グループ
	============================== */
	/* 赤帯タイトル */
	.agendaSolutionGroup > .tit{
		min-height: 30px;
		padding: 5px 10px;
		font-size: 1.4rem;
	}
	/* グレー背景 */
	.agendaSolutionGroup > .ctsBox{
		padding: 10px;
	}

	/* セクション
	============================== */
	.agendaSolutionSection{
		margin-bottom: 10px;
		padding-bottom: 10px;
	}

	/* カード
	============================== */
	/* 左線タイトル */
	.agendaSolutionCard > .tit {
		font-size: 1.3rem;
	}
	/* 5カラム */
	[data-cols="5"]{
		grid-template-columns: 1fr;
	}
	[data-cols="5"] .listAgendaSolutionBtn > li{
		width: calc((100% - 5px)/2);
	}
	/* 3カラム */
	[data-cols="3"]{
		grid-template-columns: 1fr;
	}
	[data-cols="3"] .listAgendaSolutionBtn > li{
		width: calc((100% - 5px)/2);
	}
	/* 2カラム */
	[data-cols="2"]{
		grid-template-columns: 1fr;
	}
	[data-cols="2"] .listAgendaSolutionBtn > li{
		width: calc((100% - 5px)/2);
	}
	/* 1カラム */
	[data-cols="1"] .listAgendaSolutionBtn a{
		padding: 5px;
	}

	/* ボタン
	============================== */
	.agendaSolutionBtnArea > .tit{
		font-size: 1.1rem;
	}
	/* ボタンリスト */
	.listAgendaSolutionBtn{
		gap: 5px;
	}
	.listAgendaSolutionBtn > li{
		width: calc((100% - 5px)/2);
	}
	.listAgendaSolutionBtn a{
		min-height: 25px;
		height: 100%;
		padding: 5px 10px;
		font-size: 1.0rem;
		text-align: center;
		border-radius: 3px;
	}


	/*
		アジェンダ詳細
	-----------------------------------------------------------------------------------------------*/
	.pageAgendaDetail .cmnPageTitArea{
		min-height: 200px;
	}

	/* 特徴
	============================== */
	.agendaFeatureWrapper{
		margin-bottom: 50px;
		padding-block: 50px;
		background: url("../images/bg_agenda_agendaFeature_sp.png") no-repeat center center / cover;
	}
	/* ループテキスト */
	.loopTxt{
		top: -45px;
	}
	.loopTrack{
		gap:50px;
	}
	.loopTxt .item{
		font-size: 5.0rem;
	}
	/* リスト */
	.listAgendaFeature{
		flex-direction: column;
	}
	.listAgendaFeature > li{
		width: 100%;
		margin-bottom: 30px;
		padding-bottom: 20px;
		border-bottom: 1px solid rgba(255,255,255,0.5);
	}
	.listAgendaFeature > li:last-of-type{
		margin-bottom: 0;
		padding-bottom: 0;
		border-bottom: none;
	}
	.listAgendaFeature > li:not(:last-child)::after{
		display: none;
	}
	.listAgendaFeature .ico{
		width: 70px;
		margin: 0 auto 15px;
	}
	.listAgendaFeature .tit{
		align-items: center;
		gap: 10px;
		margin-bottom: 10px;
		font-size: 1.5rem;
	}
	.listAgendaFeature .tit::after{
		width: 20px;
		height: 2px;
	}
	.listAgendaFeature .txt{
		font-size: 1.3rem;
	}


	/*
		業態別の課題解決
	-----------------------------------------------------------------------------------------------*/
	.cts2colArea{
		gap: 50px;
		margin-bottom: 50px;
	}

	/* アンカーリンクボタンボタン
	============================== */
	.pageAgendaDetail .cmnListAnkerLinkWrapper{
		width: 100%;
		position: static;
		top: 0;
	}

	/* 解決ソリューション一覧
	============================== */
	/* 課題解決タイプ */
	.solutionTypeWrapper{
		gap: 60px;
		width: 100%;
	}
	.solutionBox{
		margin-bottom: 20px;
	}
	/* 課題解決ボックス */
	.solutionBox .titArea{
		min-height: 30px;
	}
	.solutionBox .label{
		width: 50px;
		padding: 3px 0 0 2px;
		font-size: 1.0rem;
		left: 10px;
		bottom: 5px;
	}
	.solutionBox .label .num{
		font-size: 2.0rem;
	}
	.solutionBox .titArea .tit{
		padding: 5px 10px 5px 70px;
		font-size: 1.6rem;
	}
	.solutionBox .bodyArea{
		padding: 35px 20px 20px;
		background: url("../images/bg_agenda_solution_sp.png") no-repeat center center / cover;
	}
	.solutionBox .leadTxt{
		font-size: 1.3rem;
	}
	/* 解決ソリューション */
	.solutionCardArea{
		flex-direction: column;
		gap: 20px;
	}
	.solutionCard{
		width: 100%;
		padding: 20px 15px 15px;
	}
	.solutionCard .tit{
		min-height: 20px;
		padding-inline: 15px;
		font-size: 1.1rem;
		top: -10px;
	}
	.solutionCard .ico{
		width: 50px;
	}
	.listAgendaSolution{
		width: calc(100% - 60px);
	}
	.listAgendaSolution > li{
		padding-left: 10px;
		font-size: 1.2rem;
	}
	.listAgendaSolution > li::before{
		width: 3px;
		top: 9px;
	}
	/* 共通 記事カード */
	.pageAgendaDetail .cmnListArticleCard > li  figure.img{
		height: auto;
	}
	/* フッター */
	.agendaDetailFooter{
		padding-block: 30px;
	}
}