@charset "utf-8";

body { background: #000; color: #fff}
.item_list_default_outer a { color: #fff !important}

@media screen and (max-width: 767px) {
	  #undercolumn_blog　{ width: 100% !important}
	.only_pc { display: none}

	.PageWrapper { width: 100%; margin: 0 auto; padding: 0 0 30px; color: #fff; background: #000; font-family: 'Noto Sans JP', sans-serif}
	.PageWrapper a { color: #fff}
	.PageWrapper img { max-width: 100%; vertical-align: top}

	.mainvisual { opacity: 0; margin: 0 auto; width: 100%}
	.mainvisual img { width: 100%; height: auto}
	.mainvisual h1.logo { line-height: 1.4; margin: 30px auto 25px; text-align: center; font-size: 20px !important; font-weight: 700}
	.mainvisual h1 small { font-size: 12px}
	.mainvisual .pic { margin: 0 auto; text-align: center; width: 100%}
	.mainvisual { animation: fadein 1.5s ease 0.5s 1 forwards}
	@-webkit-keyframes fadein {
	100% { opacity: 1}
	}
	@keyframes fadein {
	100% { opacity: 1}
	}

	.PageWrapper .section { position: relative; margin: 0 auto 50px}
	.PageWrapper .check { margin: -60px auto 0; padding-top: 80px; text-align: center; font-size: 16px !important; font-weight: 700}
	.PageWrapper .btn { margin: 0 auto 45px; text-align: center; width: 79.5%}
	.PageWrapper .btn img { width: 100%; height: auto}
}

@media screen and (min-width: 768px) {
	.only_sp { display: none}
	.wrapper { position: relative; font-family: 'Noto Sans JP', sans-serif; background: #000; color: #fff}
	.wrapper { margin: 0 auto; padding: 0; width: 100%}
	.wrapper img { max-width: 100%}
	.wrapper h1 { margin: 0 auto; padding: 0 0 30px; text-align: center; font-size: 26px; font-weight: 700; color: #fff; letter-spacing: 0.025em; line-height: 1.7}
	.wrapper h1 small { display: block; font-size: 15px; font-weight: normal}

	.mainvisual { width: 100%; margin: 0 auto; text-align: center; opacity: 0}
	.mainvisual .pic { margin: 0 auto 45px; width: 860px}
	.mainvisual img { width: 100%; height: auto}
	.mainvisual { animation: fadein-main 2.5s ease 0.5s 1 forwards}

	@-webkit-keyframes fadein-main {
	100% {opacity: 1}
	}
	@keyframes fadein-main {
	100% {opacity: 1}
	}

	.wrapper .section { position: relative; max-width: 980px; width: 96.5%; margin: 0 auto 60px}
	.wrapper .section ul { display: flex; flex-wrap: wrap; justify-content: space-between}
	.wrapper .section ul li { width: 47.2%}
	.wrapper .section ul li:last-child { padding-top: 16.5%; }
	.wrapper .section ul li img { width: 100%; height: auto; margin-bottom: 11.5%}
	.wrapper .check { text-align: center; font-size: 16px; font-weight: 700; letter-spacing: 0.025em; margin: 100px auto 50px}
	.wrapper .btn { margin: 0 auto 85px; text-align: center; width: 325px; }
	.wrapper .btn img { width: 100%; height: auto; }
}