@charset "utf-8";

/* coupon
-------------------------------------------------*/

#d_coupon{
	padding:2rem 500% .8rem;
	background:rgb(220,239,224);
	margin:0 -500% 0;
}

.cpn_item{
	position:relative;
	float:left;
	width:46%;
	padding-bottom:35px;
	background:rgb(236,246,244);
	border:3px dashed rgba(42,156,128,.5);
	border-radius:6px;
	margin:0 1% 15px;
}
	.cpn_hd{
		display:table;
		width:96%;
		margin:7px auto 10px;
	}
	
	.cpn_logo,
	.cpn_ttl{
		display:table-cell;
		width:23%;
		text-align:center;
		vertical-align:middle;
	}
	.cpn_logo img{
		width:81%;
		height:auto;
	}
	.cpn_ttl{
		width:77%;
	}
	
	.cpn_ttl h2{
		padding:0 15px;
		color:rgb(42,156,128);
		font-size:1.3rem;
		font-weight:bold;
		line-height:1.2;
		margin:0 0 10px;
	}
	.cpn_ttl time{
		display:block;
		padding:0 15px;
		color:rgb(42,156,128);
		font-size:.9rem;
		font-weight:bold;
		line-height:1.2;
	}
	.cpn_item .sup{
		padding:1rem 1rem;
		width:100%;
		text-align:left;
		font-size:.85rem;
		line-height:1.3;
		background:#fff;
	}
	.cpn_item .sup:after {
		content: "";
		display: table;
		clear: both;
	}
	.cpn_item .chk_box{
		position:relative;
		float:right;
		width:25px;
		height:25px;
		margin:0 0 50px 1.5em;
	}
	.cpn_item .chk_box:after{
		position:absolute;
		display:block;
		content:'';
		left:3px;
		top:32px;
		width:30px;
		height:41px;
		background:url(/coupon/i_mobile.png) no-repeat;
	}
	.cpn_item footer{
		position:absolute;
		bottom:0;
		width:100%;
		padding:6px;
		text-align:center;
		color:#fff;
		font-size:.9rem;
		font-weight:bold;
		line-height:1;
		background:rgb(42,156,128);
	}

#mob_coupon input[type='submit'] {
	border-style: none;
	display: inline-block;
	padding: 3px 15px;
	text-align: center;
	color: #fff;
	font-family: font-family: "Yu Gothic", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif !important;
	font-size: 1rem;
	background: rgb(42,156,128);
	border-radius: 3px;
}
#mob_coupon input[type='email']{
	width:250px;
	height:30px;
}

@media screen and (max-width: 900px){
	.cpn_ttl h2{
		text-align:left;
		font-size:1.2rem;
	}
	.cpn_ttl h2 br{
		display:none;
	}
	.cpn_ttl time{
		text-align:left;
	}
}
@media screen and (max-width: 500px){
	.cpn_item{
		float:none;
		width:90%;
		margin:0 auto 15px;
	}
}