@charset "utf-8";
@media screen and (min-height: 1000px) {
	.mainviual{
		height: 40vh !important;
	}
}
@media screen and (min-width: 820px) {
  /* ここに850px以上の画面幅で適用するCSSを書く */
	.mainviual{
		height: 350px;
		overflow: hidden;
	}
	.mainviual img{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		filter: brightness(0.7);
	}
	.content_01,
	.content_02,
	.content_03	{
		max-width: 1100px;
		margin: 70px auto 0;
	}
	.content_04{
		max-width: 1100px;
		margin: 40px auto 80px;
	}
	.pc{
		display: block;
	}
	.content_title{
		font-size: 270%;
	}
	.text_inner{
		font-size: 1.1rem;
	}
	.list_btn a{
    display: block;
    width: 300px;
    margin: 20px 0 0;
    background: #eb6000;
    color: #fff;
    text-align: center;
    padding: 20px 0;
    font-size: 116%;
    font-weight: bold;
    letter-spacing: 1px;
	}
	.looplist{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	.looplist li{
		width: calc(95% / 4);
	}
}