@charset "UTF-8";

/* GRANDIT とは */
/*BoxInnerLink*/

#overviewArea #innerLinkBoxList{
	display:flex;
	justify-content:center;
	gap:30px;
	margin-bottom:50px;
}

#overviewArea #innerLinkBoxList li{
	flex-basis:550px;
}

#overviewArea #innerLinkBoxList li a{
	display:block;
	text-align:center;
	text-decoration:none;
	border:2px solid #00964e;
}
#overviewArea #innerLinkBoxList li a:after{
	display: none;
}

#overviewArea #innerLinkBoxList li + li a{
	border-color:#0064fa;
}

#overviewArea #innerLinkBoxList li a span{
	display:block;
	background:#00964e;
	color:#FFF;
	padding:10px 30px;
	font-weight:bold;
}

#overviewArea #innerLinkBoxList li a:hover span{
	text-decoration:underline;
}

#overviewArea #innerLinkBoxList li + li a span{
	background:#0064fa;
}

#overviewArea #innerLinkBoxList li a span:after{
	content:"";
	display:inline-block;
	width:0.5em;
	height:0.5em;
	border:4px solid #FFF;
	border-top-color:rgba(255, 255, 255, 0);
	border-left-color:rgba(255, 255, 255, 0);
	transform:rotate(45deg);
	margin-left:10px;
	position:relative;
	top:-0.2em;
}

/* for - 768px
=========================================================================================== */
@media screen and (max-width:768px){
	.JS #overviewArea #innerLinkBoxList{
		flex-direction:column;
	}
	.JS #overviewArea #innerLinkBoxList li{
		flex-basis:auto;
	}
}

/* 課題と解決 */


dl.solve  ul.mark{
	display:flex;
	float:right;
	gap:20px;
	margin:-30px 20px 0 0;
}
dl.solve  ul.mark li.grandit{
	color:#FFF;
	padding:2px 20px;
	font-size:80%;
	font-weight:bold;
	border-radius:1em;
}
dl.solve  ul.mark li.miraimil{
	color:#FFF;
	padding:2px 20px;
	font-size:80%;
	font-weight:bold;
	border-radius:1em;
}

dl.solve  ul.mark li.CFsupport{
	color:#FFF;
	padding:2px 20px;
	font-size:80%;
	font-weight:bold;
	border-radius:1em;
}

dl.solve dd ul.mark li.grandit{ background:#00964e; }
dl.solve dd ul.mark li.miraimil{ background:#0064fa; }
dl.solve dd ul.mark li.CFsupport{ background:#004596; }

/* 選ばれる理由 リンクボタン*/

#reasonArea div.container article.container div.FlexWrap.noIconFigure dl dd a {
    display: inline-block;
    text-decoration: none;
    font-weight: bold;
    margin-top: 10px;
}

#reasonArea div.container article.container div.FlexWrap.noIconFigure dl dd a:hover{
	text-decoration: underline;
}