@charset "UTF-8";
/*
 * om.css
 *
 */

/* !導入
---------------------------------------------------------- */
.intro {
	width:100%;
	padding:120px 50px 100px 50px;
}

.intro2 {
	padding:0 50px 150px 50px;
}
	.intro div.inner {
		width:100%;
		max-width:1100px;
		margin:0 auto;
		display: flex;
		flex-wrap: wrap;
	}
		.intro div.inner h2 {
			width:100%;
			font-size:42px;
			font-weight: 700;
			color: #21A6D8;
			text-align: center;
			line-height: 1.6;
			margin-bottom:80px; 
		}
		.intro div.inner div.left {
			width:30%;
		}
			.intro div.inner div.left h3 {
				font-size:34px;
				font-weight: 700;
				color: #26353D;
				line-height: 1.6;
				letter-spacing: 0.04em;
				position: relative;
			}
				.intro div.inner div.left h3 span {
					position: relative;
					font-family: "Roboto", sans-serif;
					font-size:54%;
					font-weight: 500;
					color:#21A6D8;
					vertical-align: middle;
					top:-3px;
				}
		.intro div.inner div.right {
			width:70%;
		}
			.intro div.inner div.right p.caution {
				display: none;
			}
			.intro div.inner div.right table {
				width:100%;
				border-collapse:collapse;
			}
				.intro div.inner div.right table th,
				.intro div.inner div.right table td {
					padding: 0.8em;
					border: 1px solid #E1E4E5;
				}
				.intro div.inner div.right table th {
					color:#21A6D8;
					font-weight: 700;
					background-color: #E4F4FA;
					text-align: center;
				}
					.intro div.inner div.right table th.fix {
						width:15%;
					}

@media screen and (max-width:1039px){
.intro {
	padding:100px 30px 80px 30px;
}

.intro2 {
	padding:0 30px 120px 30px;
}
		.intro div.inner div.left {
			width:100%;
			margin-bottom: 30px;
		}
		.intro div.inner div.right {
			width:100%;
		}
		.intro div.inner h2 {
			font-size:34px;
			margin-bottom:60px; 
		}
			.intro div.inner div.right div.tableWrap {
				width:100%;
				overflow-x: scroll;
			}
			.intro div.inner div.right table {
				width:100%;
				min-width:700px;
				border-collapse:collapse;
			}
				.intro div.inner div.right table th,
				.intro div.inner div.right table td {
					padding: 0.6em;
					border: 1px solid #E1E4E5;
					font-size:15px;
				}
				.intro div.inner div.right table th {
					color:#21A6D8;
					font-weight: 700;
					background-color: #E4F4FA;
					text-align: center;
				}
					.intro div.inner div.right table th.fix {
						width:auto;
					}
			.intro div.inner div.left h3 {
				font-size:28px;
			}
}

@media screen and (max-width:767px){
.intro {
	padding:80px 25px 70px 25px;
}
.intro2 {
	padding:0 25px 100px 25px;
}
		.intro div.inner h2 {
			font-size:24px;
			margin-bottom:50px; 
		}
		.intro div.inner div.left {
			margin-bottom: 20px;
		}
			.intro div.inner div.left h3 {
				font-size:22px;
			}
				.intro div.inner div.left h3 span {
					font-size:60%;
					top:-1px;
				}
			.intro div.inner div.right p.caution {
				display: block;
				margin-bottom: 20px;
			}
			
}

/* !保守管理
---------------------------------------------------------- */
.om1 {
	width:100%;
	padding:0 50px 150px 50px;
}
	.om1 div.inner {
		width:100%;
		max-width:1100px;
		margin:0 auto;
	}
		.om1 div.inner h2 {
			font-size:28px;
			font-weight: 700;
			color: #26353D;
			line-height: 1.6;
			letter-spacing: 0.04em;
			padding-left:0.8em;
			position: relative;
			margin-bottom: 40px;
		}
			.om1 div.inner h2:before {
				position: absolute;
				content: "";
				width:3px;
				height: 100%;
				background-color: #21A6D8;
				top:0;
				left:0;
				transform: rotate(20deg);
			}
				.om1 div.inner h3 {
					width:100%;
					font-size:40px;
					font-weight: 700;
					color: #21A6D8;
					text-align: center;
					line-height: 1.6;
					margin-bottom:60px;
				}
		.om1 div.inner div.col {
			width:100%;
			display: flex;
			justify-content: space-between;
			margin-bottom: 100px;
		}
			.om1 div.inner div.col div.left {
				width:48%;
			}
				.om1 div.inner div.col div.left ol {
					margin-bottom: 40px;
				}
					.om1 div.inner div.col div.left ol li {
						font-size:21px;
						font-weight: 700;
						line-height: 1.7;
						padding-left:30px;
						margin-bottom: 30px;
						position: relative;
					}
						.om1 div.inner div.col div.left ol li:last-child {
							margin-bottom: 20px;
						}
						.om1 div.inner div.col div.left ol li:before {
							position: absolute;
							font-family: "Roboto", sans-serif;
							font-size:16px;
							font-weight: 700;
							color: #21A6D8;
							top:5px;
							left:0;
						}
						.om1 div.inner div.col div.left ol li:first-child:before {
							content:"01";
						}
						.om1 div.inner div.col div.left ol li:nth-child(2):before {
							content:"02";
						}
			.om1 div.inner div.col div.right {
				width:45%;
			}
				.om1 div.inner div.col div.right img {
					display: block;
					width:100%;
					border-radius: 12px;
				}
		.om1 div.inner ul.drone {
			width:100%;
		}
			.om1 div.inner ul.drone li {
				width:100%;
				display: flex;
				justify-content: space-between;
				padding-bottom:30px;
				margin-bottom: 30px;
				border-bottom: 1px dashed #C1C8CF;
			}
			.om1 div.inner ul.drone li:last-child {
				margin-bottom: 0;
			}
				.om1 div.inner ul.drone li div.left {
					width:68%;
				}
				.om1 div.inner ul.drone li div.right {
					width:25%;
				}
				.om1 div.inner ul.drone li div.noCol {
					width:100%;
				}
					.om1 div.inner ul.drone li div.right img {
						display: block;
						width:100%;
						border-radius: 12px;
					}
				.om1 div.inner ul.drone li h4 {
					width:100%;
					font-size:21px;
					font-weight: 700;
					line-height: 1.7;
					padding-left:30px;
					margin-bottom: 30px;
					position: relative;
				}
					.om1 div.inner ul.drone li h4:before {
						position: absolute;
						font-family: "Roboto", sans-serif;
						font-size:16px;
						font-weight: 700;
						color: #21A6D8;
						top:5px;
						left:0;
					}
					.om1 div.inner ul.drone li:first-child h4:before {
						content:"01";
					}
					.om1 div.inner ul.drone li:nth-child(2) h4:before {
						content:"02";
					}
					.om1 div.inner ul.drone li:nth-child(3) h4:before {
						content:"03";
					}
					.om1 div.inner ul.drone li:nth-child(4) h4:before {
						content:"04";
					}

@media screen and (max-width:1039px){
.om1 {
	padding:0 30px 120px 30px;
}
		.om1 div.inner h2 {
			font-size:24px;
		}
				.om1 div.inner h3 {
					font-size:30px;
					margin-bottom:50px;
				}
		.om1 div.inner div.col {
			margin-bottom: 80px;
		}
			.om1 div.inner div.col div.left {
				width:52%;
			}
				.om1 div.inner div.col div.left ol {
					margin-bottom: 30px;
				}
					.om1 div.inner div.col div.left ol li {
						font-size:18px;
						margin-bottom: 25px;
					}
						.om1 div.inner div.col div.left ol li:before {
							top:3px;
						}
				.om1 div.inner div.col div.right img {
					border-radius: 10px;
				}
					.om1 div.inner ul.drone li div.right img {
						border-radius: 10px;
					}
				.om1 div.inner ul.drone li h4 {
					font-size:18px;
					margin-bottom: 25px;
				}
					.om1 div.inner ul.drone li h4:before {
						top:3px;
					}
}

@media screen and (max-width:767px){
.om1 {
	padding:0 25px 100px 25px;
}
		.om1 div.inner h2 {
			font-size:18px;
			margin-bottom: 30px;
		}
			.om1 div.inner h2:before {
				width:2px;
			}
				.om1 div.inner h3 {
					font-size:22px;
					margin-bottom:50px;
				}
		.om1 div.inner div.col {
			flex-wrap: wrap;
			margin-bottom: 80px;
		}
			.om1 div.inner div.col div.left {
				width:100%;
				margin-bottom: 40px;
			}
				.om1 div.inner div.col div.left ol {
					margin-bottom: 30px;
				}
					.om1 div.inner div.col div.left ol li {
						font-size:18px;
						padding-left:26px;
						margin-bottom: 25px;
					}
						.om1 div.inner div.col div.left ol li:before {
							font-size:14px;
							top:3px;
						}
						.om1 div.inner div.col div.left ol li br {
							display: none;
						}
			.om1 div.inner div.col div.right {
				width:100%;
			}
				.om1 div.inner div.col div.right img {
					max-width:100%;
					width:320px;
					margin: 0 auto;
				}
		.om1 div.inner ul.drone {
			width:100%;
		}
			.om1 div.inner ul.drone li {
				flex-wrap: wrap;
				padding-bottom:30px;
				margin-bottom: 30px;
			}
				.om1 div.inner ul.drone li div.left {
					width:100%;
					margin-bottom: 30px;
				}
				.om1 div.inner ul.drone li div.right {
					width:100%;
				}
				.om1 div.inner ul.drone li div.noCol {
					width:100%;
				}
					.om1 div.inner ul.drone li div.right img {
						max-width:260px;
						margin: 0 auto;
					}
				.om1 div.inner ul.drone li h4 {
					font-size:18px;
					padding-left:26px;
					margin-bottom: 25px;
				}
					.om1 div.inner ul.drone li h4:before {
						font-size:14px;
						top:3px;
					}
}

/* !分析力の向上
---------------------------------------------------------- */
.om2 {
	width:100%;
	padding:0 50px 150px 50px;
}
	.om2 div.inner {
		width:100%;
		max-width:1100px;
		margin:0 auto;
	}
		.om2 div.inner h2 {
			width:100%;
			font-size:40px;
			font-weight: 700;
			color: #21A6D8;
			text-align: center;
			line-height: 1.6;
			margin-bottom:50px;
		}
		.om2 div.inner ul {
			width:100%;
			display: flex;
		}
			.om2 div.inner ul li {
				width:100%;
				border-left:1px dashed #C1C8CF;
			}
			.om2 div.inner ul li:last-child {
				border-right:1px dashed #C1C8CF;
			}
				.om2 div.inner ul li img {
					display: block;
					width:80px;
					margin: 0 auto 20px auto;
				}
				.om2 div.inner ul li h3 {
					font-size:22px;
					font-weight: 700;
					line-height: 1.6;
					text-align: center;
				}

@media screen and (max-width:1039px){
.om2 {
	padding:0 30px 120px 30px;
}
		.om2 div.inner h2 {
			font-size:30px;
			margin-bottom:45px;
		}
				.om2 div.inner ul li img {
					width:70px;
				}
				.om2 div.inner ul li h3 {
					font-size:20px;
				}
}

@media screen and (max-width:767px){
.om2 {
	padding:0 25px 100px 25px;
}
		.om2 div.inner h2 {
			font-size:22px;
			margin-bottom:30px;
		}
		.om2 div.inner ul {
			flex-wrap: wrap;
			max-width:280px;
			margin: 0 auto;
		}
			.om2 div.inner ul li {
				width:100%;
				padding-bottom: 30px;
				border-left:0;
				border-bottom:1px dashed #C1C8CF;
				margin-bottom: 30px;
			}
			.om2 div.inner ul li:last-child {
				border-right:0;
				margin-bottom: 0;
			}
				.om2 div.inner ul li img {
					width:60px;
					margin: 0 auto 20px auto;
				}
				.om2 div.inner ul li h3 {
					font-size:18px;
				}
}

/* !発電量の改善維持 ＝ 資産価値の向上
---------------------------------------------------------- */
.om3 {
	width:100%;
	padding:0 50px 150px 50px;
}
	.om3 div.inner {
		width:100%;
		max-width:1100px;
		margin:0 auto;
	}
		.om3 div.inner h2 {
			font-size:40px;
			font-weight: 700;
			color: #21A6D8;
			text-align: center;
			line-height: 1.6;
			margin-bottom:50px;
		}
		.om3 div.inner img {
			display: block;
			width:100%;
		}

@media screen and (max-width:1039px){
.om3 {
	padding:0 30px 120px 30px;
}
		.om3 div.inner h2 {
			font-size:30px;
			margin-bottom:45px;
		}
}

@media screen and (max-width:767px){
.om3 {
	padding:0 25px 100px 25px;
}
		.om3 div.inner h2 {
			font-size:19px;
			margin-bottom:30px;
		}
}

@media screen and (max-width:360px){
		.om3 div.inner h2 {
			font-size:16px;
			margin-bottom:25px;
		}
}