*, *::before, *::after { box-sizing: border-box; }
img, video { max-width: 100%; height: auto; }
body { overflow-x: hidden; }

.content p, .content li, .content a { overflow-wrap: anywhere; }

@media (max-width: 980px) {
	.top{
		display: none;
	}

	div.bg-bottom{
		padding-bottom: 200px;
		background-size: 90% auto;
	}
	
	header {
		width: 220px;
	}
	header p.left-logo strong {
		font-size: 60px;
	}
	header .back{
		top: 5px;
		left: 0;
	}

	.content{
		min-width: 0;
		max-width: 100%;
		margin: 50px;
		font-size: 16px;
	}

	.content h1{ font-size: 38px; }
	.content h2{ font-size: 26px; }
}

@media (max-width: 640px) {
	div.top{
		height: auto;
		min-height: 120px;
	}

	header p.left-logo{
		display: none;
	}
	
	header .back{
		top: 5px;
		left: auto;
		right: 5px;
	}

	.content{
		font-size: 16px;
		margin: 30px;
	}

	.content h1{
		font-size: 32px;
		margin-bottom: 30px;
	}
	.content h2{
		font-size: 22px;
		margin-bottom: 12px;
	}
	.content h3{
		font-size: 18px;
		margin-bottom: 10px;
	}

	.content .menu a{
		display: block;
		padding: 10px 12px;
		margin: 6px 0;
	}
	.content .menu br {
		display: none;
	}
}

@media (max-width: 380px) {
	header p.left-logo strong{ font-size: 28px; }
	.content h1{ font-size: 24px; }
}