@charset "UTF-8";


/* メインビジュアル 
----------------------------------------------- */
.hero-area-c {
	background-color: #ddf2fe;
}
.hero-area-c + * {
	margin-top: 0;
}
.hero-area-c .visual {
	z-index: -1;
}
.hero-area-c .content-inner {
	padding-left: 5%;
	max-width: 950px;
}
.hero-area-c .content-inner .sub-txt {
	margin-bottom: 20px;
}


/* お知らせ 
----------------------------------------------- */
.list-news-a .news-content .date {
	flex-basis: 8em;
}

@media only screen and (max-width: 480px) {
	.hero-area-c + * h2 {
		margin-bottom: 20px !important;
	}
}

/* 導入事例
----------------------------------------------- */
.reversal-area > h3 > .icon-ctg-a {
	display: inline-block;
	min-width: 0;
	margin-bottom: 10px;
	padding: 4px 1em;
	font-weight: 400;
}

.category-link {
	margin-top: 40px;
	padding-top: 52px;
	display: flex;
	border-top: 1px solid #9a9a9a;
}
.category-link > h3 {
	width: 50%;
	font-size: 2.4rem;
	text-align: center;
}

@media only screen and (max-width: 480px) {
	.category-link {
		flex-direction: column;
	}
	.category-link > h3 {
		width: 100%;
		margin-bottom: 20px;
	}
}

/* ソリューションメニュー
----------------------------------------------- */
.main-contents .section.diff-bg-b {
	background: #a30b1a;
}
h2.cl-hdg-w {
	color: #fff;
	font-size: 2.8rem;
	margin-bottom: 30px;
	text-align: center;
}
#lineArt ul.list-a {
	width: 100%;
	margin: 0 auto;
}
.list-a > li::before {
	background: none;
}
.list-a[class*=diff-col] > li img {
	display: block;
	max-width: 200px;
	margin: 0 auto;
}
.pac-image {
	position: relative;
	height: 160px;
}
.pac-image img {
	width: 60%;
	height: auto;
}
a.opa07 {
	display: block;
	text-decoration: none;
}
.centerBtn .lyt-btn-b li {
	margin: 0 auto;
}
@media screen and (orientation: landscape) {
	.lyt-btn-b .btn-a,
	.lyt-btn-b .btn-b {
		width: auto;
	}
}

.mw350{
	max-width: 350px !important;
}

.lyt-item-a > .item {
	width: 50%;
}

.lyt-item-a > .img > .img-inner {
	width: 100%;
}

.lyt-item-a >.img img {
	width: 100%;
}

@media only screen and (max-width: 767px) {
	.list-a[class*=diff-col] > li {
		margin-bottom: 40px;
		padding-left: 0;
	}
	a.opa07 .lyt-btn-b {
		margin-bottom: 50px;
	}
}


/* 関連リンク
----------------------------------------------- */
.bannerArea {
	width: 100%;
	margin: 0 auto !important;
    justify-content: center;

}
.bannerArea li{
    width: 21%;
    max-width: 268px;
    margin: 0 2%;
}
.bannerArea li:hover{
	opacity: 0.7;
}

@media only screen and (max-width: 767px) {
	.bannerArea li{
		margin: 0 auto;
	}
}

ul.list-a[class*=diff-col]>li {
    padding: 0;
}
.bannerArea a img.frame {
	display: block;
	width: 100%;
	max-width: 306px;
	border: 1px solid #ccc;
	margin: 0 0 8px;
}