﻿/*	bnr
============================== */
div.bnr {
}
div.bnr {
	background-color:hsla(42,90%,54%,.5);
}
div.bnr-paravi {
	background-color:hsla(0,0%,0%, 1);
}
div.bnr aside ul li span,
div.bnr aside ul li a {
	display:block;
}
div.bnr aside ul li span a {
	position:relative;
	height:0;
	padding-top:30%;
	background-size:contain;
	background-position:center center;
}
div.bnr aside ul li span a.lazy-done {
	-webkit-animation: fadeIn 800ms;
	animation: fadeIn 800ms;
}
div.bnr aside ul li span a span {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	text-indent:110%;white-space:nowrap;overflow:hidden;
}
div.bnr aside ul li span a span b {
	position: absolute;
	left:50%;
	top:50%;
	width:100%;
	transform:translate(-50%, -50%);
	text-align:center;
	font-size:3vw;
}
@media all and (min-width: 768px) {
div.bnr {
	padding:40px 0 10px;
}
div.bnr-over {
	margin-bottom:40px;
}
div.bnr aside {
	width:1080px;
	margin:0 auto;
}
div.bnr-case1 aside ul {
	width:50%;
	margin:0 auto;
}
div.bnr-case2 aside ul li {
	width:50%;
	float:left;
}
div.bnr aside ul li {
	margin-bottom:30px;
}
div.bnr-odd aside ul li:last-child {
	margin-left:25%;
}
div.bnr aside ul li:nth-child(odd) > span {
	margin-right:15px;
}
div.bnr aside ul li:nth-child(even) > span {
	margin-left:15px;
}
div.bnr aside ul li span a.lazy-done {
	-webkit-box-shadow:8px 12px 0 0 hsla(35,78%,42%,0.3);
	box-shadow:8px 12px 0 0 hsla(35,78%,42%,0.3);
}
}
@media all and (max-width: 767px) {
div.bnr {
	padding:25px 0;
}
div.bnr aside h2 {
	font-size:4vw;
}
div.bnr aside ul {
	width:80%;
	margin:0 auto;
}
div.bnr aside ul li:not(:last-child) {
	margin-bottom:15px;
}
div.bnr aside ul li span a.lazy-done {
	-webkit-box-shadow:5px 8px 0 0 hsla(35,78%,42%,0.3);
	box-shadow:5px 8px 0 0 hsla(35,78%,42%,0.3);
}
}