@charset "UTF-8";
/* CSS Document */
body, div, span{
	padding:0;
	margin:0;
}
body{	
	font:12px/0.8 Verdana, Geneva, sans-serif; 
	background-color:#000;
}
#wrapper{
	margin:0 auto;
	width:100%;
	height:100vh;
	max-width:950px;
	max-height:600px;
}
img{
	width:100%;
}
#inner{
	position:relative;
	width:100%;
}
.coupon{
	position:absolute;
	z-index:10000;
	display:flex;
	justify-content:center;
	width:100%;
	height:100%;
}
.coupon div{
	width:50%;
}
a{
	position:relative;
	display:block;
	text-decoration:none;
	width:100%;
	height:100%;
}
#five a{
	color:#FFF;
}
#ten a{	
	color:#FF0;
}
.code{
	position:absolute;
	width:100%;	
	text-align:center;
	font-size:34px;
	bottom:0;
}
a:hover{
	opacity:0.8;
}
.date{
	display:block;
	padding-top:10.5%;
	font-size:0.8em;
}
.date:before{
	content:'有効期限：';
	padding-left:5px;
}
.date:after{
	content:'まで';
	font-size:0.7em;
	padding-right:5px;
}
	

@media (max-width: 839px){
.date{
	padding-top:9%;
}
}
@media (max-width: 669px){
.code{
	font-size:32px;
}
}
@media (max-width: 649px){
.code{
	font-size:26px;
}
}
@media (max-width: 517px){
.code{
	font-size:20px;
}
}
@media (max-width: 439px){
.code{
	font-size:18px;
}
}
@media (max-width: 342px){
.code{
	font-size:14px;
}
}