@charset "UTF-8";

hgroup
{
	text-align: left;
	margin: 0 auto;
}

hgroup p
{
	margin-bottom: 0;
}

.about
{
	width: 100%;
	padding: 60px 0 60px;
	background: var(--bl);
	text-align: center;
}

.about h2
{
	position: relative;
	font-size: 2.4rem;
	padding-bottom: 20px;
	display: block;
	width: 12em;
	margin: 0 auto;
	color: #fff;
}

.about h2::before
{
	position: absolute;
	content: '';
	top: 40%;
	left: -50px;
	width: 40px;
	height: 1px;
	background: #fff;
}

.about h2::after
{
	position: absolute;
	content: '';
	top: 40%;
	right: -50px;
	width: 40px;
	height: 1px;
	background: #fff;
}

.about .flex
{
	display: flex;
	align-items: center;
}

.about p
{
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.9;
	color: #fff;
	text-align: left;
}

.about .brand
{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.about .brand img
{
	width: 195px;
	margin: 0 20px;
}

@media screen and (max-width:700px)
{
	.about .brand img
	{
		width: 40%;
		margin: 0 10px;
	}
}

@media screen and (max-width:900px)
{
	.about
	{
		padding: 40px 0;
	}

	.about h2
	{
		font-size: 1.8rem;
	}

	.about h2::before
	{
		left: -40px;
		width: 30px;
	}

	.about h2::after
	{
		right: -40px;
		width: 30px;
	}

	.about p
	{
		line-height: 1.6;
		font-size: 1.7rem;
	}

	.about .flex
	{
		display: block;
	}
}

.list-item
{
	background: linear-gradient(180deg, var(--lbl) 0%, var(--lbl) 40%, #fff 40%, #fff 100%);
	padding: 80px 0;
}

.list-item .top
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 auto 20px;
	max-width: 1000px;
	width: 90%;
}

.list-item .top .logo-area
{
	width: 335px;
}

.list-item .top .ttl-area
{
	width: calc(100% - 335px);
}

.list-item .top .logo-area img
{
	width: 240px;
}

.list-item .top .logo-area p
{
	display: block;
	font-weight: 300;
	padding-top: 5px;
	padding-left: 4em;
}

.list-item .top .ttl-area .cache
{
	font-size: 1.8rem;
	line-height: 1.7;
	font-weight: 500;
	color: var(--bl);
	padding-bottom: 15px;
}

.list-item .top .ttl-area .cache span
{
	color: #C1272D;
	font-size: 2.2rem;
	font-weight: 600;
}

.list-item .middle,
.list-item .middle2
{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 auto 30px;
	max-width: 1000px;
	width: 90%;
}

.list-item .middle2
{
	margin-bottom: 10px;
}

.list-item .middle img
{
	width: 23%;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
}

.list-item .middle2 img
{
	width: 100%;
	margin-bottom: 20px;
}

.list-item .bottom
{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 auto;
	max-width: 1000px;
	width: 90%;
}

.list-item .bottom p
{
	font-size: 1.5rem;
}

.list-item .bottom p.pb
{
	padding-bottom: 0.7em;
}

.sensei
{
	background: var(--bl);
}

.sensei .container
{
	max-width: 1000px;
	width: 85%;
	margin: 0 auto;
	padding: 70px 30px;
	text-align: center;
	font-size: 1.8rem;
	line-height: 2.2;
	font-weight: 500;
	color: #fff;
}

@media screen and (max-width:1200px)
{
	.list-item
	{
		padding: 40px 0;
	}

	.list-item .top
	{
		margin: 0 auto;
	}

	.list-item .top .logo-area
	{
		width: 100%;
		text-align: center;
	}

	.list-item .top .ttl-area
	{
		width: 100%;
	}

	.list-item .top .logo-area img
	{
		width: 200px;
	}

	.list-item .top .logo-area p
	{
		padding-left: 0;
	}

	.list-item .top .ttl-area
	{
		margin-top: 10px;
	}

	.list-item .top .ttl-area .cache
	{
		font-size: 1.6rem;
		line-height: 1.6;
	}

	.list-item .middle,
	.list-item .middle2
	{
		margin: 0 auto 15px;
	}

	.list-item .middle img
	{
		width: 48%;
		margin-bottom: 14px;
	}

	.list-item .middle2 img
	{
		width: 48%;
		margin-bottom: 14px;
	}
}

@media screen and (max-width:500px)
{
	.list-item .middle2 img
	{
		width: 100%;
	}
}

.sensei .pb
{
	padding-bottom: 1.5em;
}

@media screen and (max-width:500px)
{
	.sensei
	{
		text-align: left;
	}

	.sensei .container
	{
		padding: 40px 0px;
		font-size: 1.7rem;
		line-height: 2;
		text-align: left;
	}
}