@charset "UTF-8";

/* =========================================================
 * テンプレ調整
 * ====================================================== */

/*コンテンツ下 空きすぎ調整*/
@media screen and (min-width: 769px){
	.main-article__contents {
		padding-bottom: 0;
	}
}

/* =========================================================
 * 汎用
 * ====================================================== */

/*改行*/
@media screen and (max-width: 480px){
	.only_pc{
		display:none;
	}
}

/*画像*/
.pic-wrap{
	max-width:100%;
	text-align:center;
	margin:50px 30px 0;
}
@media screen and (max-width: 480px){
	.pic-wrap{
		margin:50px 0 0;
	}
}

/* =========================================================
 * こんなお悩みありませんか？
 * ====================================================== */

.problem-wrap{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.problem-pic{
	width:40%;
	text-align:center;
}
.problem-txt{
	width:58%;
}
@media screen and (max-width: 480px){
	.problem-pic{
		width:100%;
	}
	.problem-txt{
		width:100%;
	}
}
.problem-pic img{
	width:100%;
}

/*チェックマーク付きリスト*/
ul.check-mark {
	list-style-type: none;
	margin-left:2em;
}
ul.check-mark li {
	position: relative;
	line-height: 1.8;
	margin:0 0 1em 0;
}
ul.check-mark li::after {
	content: '';
	display: block;
	position: absolute;
	top: .5em;
	left: -1.5em;
	width: 16px;
	height: 8px;
	border-left: 3px solid #333;
	border-bottom: 3px solid #333;
	transform: rotate(-45deg);
}

/* =========================================================
 * 安全安心ソリューションで解決いたします
 * ====================================================== */

/*見出し*/
.resolve-wrap{
	margin:30px 0;
}
.resolve-wrap h3{
	font-size:24px;
	font-weight:bold;
	line-height:1.5;
	text-align:center;
	margin:0 0 15px;
}
/*見出し 下向き三角*/
.triangle {
	width: 0;
	height: 0;
	border-style: solid;
	/*border-width: 8vh 10vw 0 10vw;*/
	border-width: 80px 100px 0 100px;
	border-color: #CC0033 transparent transparent transparent;
	margin:0 auto;
}

/*ソリューション*/
.solution-wrap{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin:0;
}
.solution-box{
	width:calc(33% - 10px);
	background-color:#F2F2F2;
	padding:15px;
	margin-bottom:30px;
}
@media screen and (max-width: 768px){
	.solution-box{
		width:100%;
	}
	.solution-box:last-child{
		margin-bottom:0;
	}
}
/*ソリューション タイトル*/
.solution-ttl-wrap{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items:center;
	justify-content:center;
	margin-bottom:10px;
}
.solution-icon{
	width:40px;
}
.solution-icon img{
	width:30px;
	margin:0 10px 0 0;
}
.solution-ttl{
	width:auto;
}
.solution-ttl h4{
	font-size:18px;
	font-weight:bold;
	line-height:1.3;
	margin:0;
}
/*ソリューション コンテンツ*/
.solution-cont{
	background-color:#FFF;
	padding:15px;
}
.solution-cont p{
	font-size:16px;
	line-height:1.5;
	margin:0;
}

/* =========================================================
 * 特長/メリット
 * ====================================================== */

/*タイトル*/
.merit-ttl-wrap{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:center;
}
.merit-ttl-point{
	width:160px;
	background:#CC0033;
	color:#FFF;
	font-size:16px;
	font-weight:bold;
	text-align:center;
	padding:10px;
}
.problem-ttl-txt{
	width:calc(100% - 180px);
	font-size:18px;
	font-weight:bold;
	line-height:1.5;
	border-bottom:2px solid #CC0033;
	padding:4px;
}
@media screen and (max-width: 480px){
	.merit-ttl-point,
	.problem-ttl-txt{
		width:100%;
	}
}

/*コンテンツ*/
.merit-cont-wrap{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items:center;
	margin:20px 0 60px;
}
.merit-cont-pic{
	width:160px;
	text-align:center;
	padding:0 20px;
}
.merit-cont-txt{
	width:calc(100% - 180px);
}
.merit-cont-pic img{
	width:100%;
}
@media screen and (max-width: 480px){
	.merit-cont-pic{
		width:100%;
	}
	.merit-cont-txt{
		width:100%;
	}
	.merit-cont-pic img{
		width:40%;
		margin:0 0 20px 0;
	}
}
.merit-cont-txt p{
	font-size:16px;
	line-height:1.5;
	margin:0;
}

/* =========================================================
 * 課題と導入効果
 * ====================================================== */

/*テーブル装飾*/
.effect-tbl table {
	border-collapse: separate;
	border-spacing: 5px;
	border:none;
	min-width:500px;
}
.effect-tbl table th,
.effect-tbl table td{
	vertical-align:middle;
	padding: 15px;
	border:none;
}
.effect-tbl table th{
	background-color:#4D4D4D;
	color:#FFF;
	font-weight:bold;
	text-align:center;
}
.effect-tbl table tr td:nth-of-type(1){
	background-color:#D9D9D9;
}
.effect-tbl table tr td:nth-of-type(2),
.effect-tbl table tr td.bg-pale-orange{
	background-color:#FCEDE4 !important;
	text-align:center;
}
.effect-tbl table tr td:nth-of-type(3){
	background-color:#F0CBB8;
}

/*テーブル内*/
.effect-tbl table tr th,
.effect-tbl table tr td{
	font-size:16px;
	line-height:1.5;
	margin:0;
}
.effect-tbl table tr td p{
	font-size:14px;
	line-height:1.5;
	margin:0;
}
.effect-tbl table ul{
	list-style-type:disc;
	margin: 0 0 0 1em;
	padding: 0;
}
.effect-tbl table tr td a{
	color:#CC0033;
	text-decoration:underline;
}
.effect-tbl table tr td ahover{
	text-decoration:none;
}

/*〇番号タイトル*/
.num-ttl-wrap {
	display: flex;
	align-items:center;
	margin-bottom: 10px;
}
.num-circle {
	width: 40px;
	height: 40px;
	margin-right: 15px;
	padding-top: 0.5em;
	background-color: #666;
	border-radius: 50%;
	box-sizing: border-box;
	color:#FFF;
	text-align: center;
	font-weight: bold;
}
.num-ttl-wrap h4 {
	font-size:16px;
	font-weight:bold;
	margin: 0;
}

/*詳細*/
h3.detail-ttl{
	font-size:22px;
	font-weight:bold;
	line-height:1.5;
	margin:100px 0 10px;
}
h4.detail-ttl{
	font-size:18px;
	font-weight:bold;
	line-height:1.5;
	margin:50px 0 10px;
}
/*上へ戻る*/
.section_top{
	text-align:right;
	margin:30px 0 0;
}
.section_top a{
	text-decoration:underline;
}
.section_top a:hover{
	text-decoration:none;
}