@charset "UTF-8";
/* CSS Document */
/*クーポン用は.mfp-contentで検索*/

.campaign_lp_wrap{
  padding-bottom: 50px;
}
.campaign_lp_detail{
  width:930px;
  background: #FFF;
border-bottom:1px solid #CCC;
line-height:1.6em;
letter-spacing: 0.2px;
  padding: 20px 0px ;
  margin: 20px auto;
}

.campaign_lp_title h2{padding-bottom: 30px;
padding-left: 5px;
font-size: 192%;
line-height:1.5em;
font-weight: normal;
}

.campaign_lp_left{
float: left;
width: 420px;
}
.campaign_lp_right{
float: right;
width: 460px;
}
.campaign_lp_left img{width:100%;max-width:420px;}
.campaign_lp_right p,.campaign_lp_right div{padding: 20px;}
div.campaign_lp_subtext{
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
padding: 15px 20px;
font-size: 11px;
line-height: 1.7em;
}
.campaign_lp_right strong{
  background-color: #eee;
  padding: 5px 20px;
  color: #333;
  display: block;
}

.campaign_lp_right div ul, .campaign_lp_right div ol{
margin-left:  20px;
font-size: 11px;
}

.campaign_lp_link a{margin-bottom:10px;}


.campaign_lp_left_off{
  width: 420px;
  height: 350px;
  float: left;
}
.campaign_lp_left_off img{
  position: relative;
  filter:alpha(opacity=30); /* IE 6,7*/
    -ms-filter: "alpha(opacity=30)"; /* IE 8,9 */
    -moz-opacity:0.3; /* FF , Netscape */
    -khtml-opacity: 0.3; /* Safari 1.x */
  opacity:0.3;
  zoom:1; /*IE*/
}
.campaign_lp_left_off img:not(:target){
  filter: none¥9;
    -ms-filter: none¥9;
}
.campaign_lp_fincp{
  display: block;
  font-size: 16px;
  overflow: hidden;
  padding: 165px 0;
  position: relative;
  text-align: center;
  top: -350px;
  font-weight: bold;
  letter-spacing: 0.5em;
  width: 420px;
  opacity: 0.7;
}
.campaign_lp_detail p a:hover{
  color: #3e3e3e;
  text-decoration: none;
}
.campaign_lp_detail .li-square{list-style-type: square !important;}

/*ポップアップ用*/
/*他のポップアップに影響しないようセレクタ指定する*/
.campaign_lp_close{text-align: center;display: none;}

.mfp-content .campaign_lp_close{display: block;cursor: pointer;}

.mfp-content>.campaign_lp_detail{
  float:none;
  position: relative;
  padding: 50px 30px;
  width: 90%;
  max-width:420px;
}
.mfp-content>.campaign_lp_detail>div{
  float: none;
  width: 100%;
}
.mfp-content>.campaign_lp_detail>.campaign_lp_title>h2{
  font-size: 130%;
}
/*ポップアップ用ここまで*/

/* coupon_shop_list */
p.coupon_lp_right_p{
  padding: 20px 5px;
}
.coupon_shop_list{
	margin: 20px 0;
	overflow: hidden;
}
.coupon_shop_list li{
	float: left;
	margin: 0 2% 0 0;
	width: 49%;
}
.coupon_shop_list li:nth-child(2n){
	margin: 0;
}
.coupon_shop_list > li > a{
	border-bottom: 1px solid #ddd;
	box-sizing: border-box;
	display: block;
	font-size: 13px;
  line-height: 1.5;
  overflow: hidden;
	padding: 5px 0 5px 5%;
	position: relative;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.coupon_shop_list > li:nth-of-type(-n+2) > a{
	border-top: 1px solid #ddd;
}

.coupon_shop_list > li > a::after{
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	content: "";
	display: inline-block;
	height: 8px;
	position: absolute;
	transform: rotate(45deg);
	width: 8px;

	top: 38%;
	right: 2px;
}

.campaign_lp_right .coupon_lp_subtext > ul{
	margin-left: 7px;
}
/*coupon_shop_list ここまで*/


@media screen and (max-width: 640px) {
/* 表示領域が640px未満の場合に適用するスタイル */

.campaign_lp_detail,.mfp-content>.campaign_lp_detail{
  width:90%!important;
  position:relative;
  padding: 50px 3% ;
}

.campaign_lp_left{
  margin-bottom: 20px;
  text-align: center;
  width:100%;
  float:none;
}
.campaign_lp_right{
  width:100%;
  float:none;
}
.campaign_lp_right p,.campaign_lp_right div{padding: 10px ;}

.campaign_lp_left_off{
  height: 80vw;
}
.campaign_lp_fincp {
  display: block;
  font-size: 16px;
  overflow: hidden;
  padding: 38vw 0;
  position: relative;
  text-align: center;
  top: -78vw;
  width: 100%;
}


/* coupon_shop_list */

.coupon_shop_list{
	margin: 15px 0;
}
.coupon_shop_list > li > a{
	font-size: 11px;
	padding: 12px 5%;
}
/* coupon_shop_listここまで */
}/* end media */


@media screen and (min-width: 641px) {
.coupon_shop_list > li > a:hover{
	background: #e8e6e3;
}
}/* end media */
