@charset "UTF-8";
/*------------------------------
20マイページ
------------------------------*/
.section-news {
	margin-top:-1px;
}
.section-news .wrap {
	border-radius:0;
	border-right:none;
	border-left:none;
}
.mypage-info{
	display:flex;
	display:-webkit-box;
  	display:-ms-flexbox;
}
.mypage-info .box-in{
	padding:15px 15px 10px;
}
.mypage-info .box-in.box-point{
	border-right:none;
}
.mypage-info .title-box{
	border-bottom:solid #ccc 1px;
	border-right:solid #ccc 1px;
	width:50%;
}
.mypage-info .rank-box{
	width:20%;
	border-right:solid #ccc 1px;
	border-bottom:solid #ccc 1px;
}
.mypage-info .point-box{
	width:45%;
	border-bottom:solid #ccc 1px;
}
.mypage-info .btn-box{
	width:15%;
	border-bottom:solid #ccc 1px;
	border-right:none;
}

.link-banners{
	width:100%;
	margin:0;
}
.mypage-info .rank-box h1{
	display:inline-block;
	vertical-align:bottom;
	font-size:16px;
	margin:0 15px 0 0;
}
.mypage-info .rank-box .rank{
	display:inline-block;
	vertical-align:bottom;
}
.mypage-info .rank-box .more{
	padding:15px 0 0;
}

.mypage-info .point-box table{
	width:auto;
	border-collapse:collapse;
	font-size:16px;
}
.mypage-info .point-box table tr{
	
}
.mypage-info .point-box table th{
	text-align:left;
	vertical-align:top;
	padding:0 10px 15px;
	line-height:1;
}
.mypage-info .point-box table td{
	text-align:left;
	vertical-align:top;
	padding:0 0 15px;
	line-height:1;
}
.mypage-info .point-box table th.point-value{
	vertical-align:bottom;
}
.mypage-info .point-box table td.point-value{
	font-size:30px;
	vertical-align:bottom;
}
.mypage-info .point-box table th.point-value-lost{
	vertical-align:bottom;
	padding:0 30px 15px 0;
}
.mypage-info .point-box table td.point-value-lost{
	font-size:20px;
	vertical-align:bottom;
}
.mypage-info .point-box .more{
	padding:10px 0 0 10px;
}

.mypage-info .more a{
	text-decoration:underline;
}
.mypage-info .more a:hover{
	text-decoration:none;
}

.link-banners ul{
	padding:30px 30px 10px;
}
.link-banners ul li{
	box-sizing:border-box;
	background-color:#fff;
	display:inline-block;
	vertical-align:middle;
	width:24.7%;
	height:84px;
	position:relative;
	margin-bottom:5px;
}
.link-banners ul li a{
	border-radius:5px;
	display:block;
	color:#000;
	text-decoration:none;
	padding:20px 30px 20px 35px;
	font-size:16px;
	line-height:1.5;
	box-sizing:border-box;
	height:84px;
	background:#dbedfa url(../../img/common/arrow.png) no-repeat center right 15px /7px;
}
.link-banners ul li a:hover{
	opacity:.8;
}
.link-banners ul li a span{
	padding:0 0 0 50px;
	font-weight:bold;
	display:block;
	background-position:center left;
	background-repeat:no-repeat;
}
.link-banners ul li.shopping a span{
	background-image:url(../../img/common/icon-shopping-l.png);
	background-size:34px;
}
.link-banners ul li.zumen {

}
.link-banners ul li.zumen a span{
	background-image:url(../../img/common/icon-zumen.svg);
	background-size:40px;
	line-height:52px;
}
.link-banners ul li.review a span{
	background-image:url(../../img/common/icon-review-l.png);
	background-size:36px;
}
.link-banners ul li.point a span{
	background-image:url(../../img/common/icon-point-l.png);
	background-size:41px;
	line-height:52px;
}
.link-banners ul li.coupon a span:first-child{
	background-image:url(../../img/common/icon-coupon-l.png);
	background-size:39px;
}
.link-banners ul li.customer a span:first-child{
	background-image:url(../../img/common/icon-customer.svg);
	background-size:39px;
}
.link-banners ul li.credit a span{
	background-image:url(../../img/common/icon-credit.svg);
	background-size:40px;
	line-height:52px;
}
.link-banners ul li.coupon .budge{
	position:absolute;
	top:calc(50% - 12px);
	right:36px;
}
.link-banners ul li.coupon .budge i{
	font-size:16px;
	font-weight:normal;
	color:#fff;
	font-style:normal;
	background-color:#000000;
	line-height:1;
	padding:5px 11px;
	border-radius:20px;
}

.link-banners ul li.shopping a{
	border-right:solid #fff 1px;
	border-bottom:solid #fff 1px;
}
.link-banners ul li.review a{
	border-bottom:solid #fff 1px;
}
.link-banners ul li.point a{
	border-right:solid #fff 1px;
}

.news-box-left{
	width:15%;
	max-width: 120px;
	text-align:center;
	display:flex;
	display:-webkit-box;
  	display:-ms-flexbox;
	align-items: center;
  justify-content: center;

}
.news-box-left .news-title{
	margin-left:30px;
}
.news-box-left .news-title h1{
	font-size:16px;
}
.news-box-right{
	width:88%;
	border-left:solid #ccc 1px;
}

.button-links{
	padding:0 30px 30px;
	font-size:0;
}
.button-links .btn-default {
	width: 24.25% !important;
	margin:0 1% 15px 0 !important;
}
.button-links .btn-default.w30:nth-child(4n) {
	margin:0 0 15px 0 !important;
}

@media screen and (max-width: 1210px) {
	.link-banners ul {
		
		padding: 15px;
	}
	.link-banners ul li {
		width:49.6%;
		margin-bottom:5px;
	}
	.button-links{
		padding:15px;
		font-size:0;
	}
	.button-links .btn-default {
	  width: 49% !important;
		margin:0 2% 15px 0 !important;
	}
	.button-links .btn-default.w30:nth-child(2n) {
		margin:0 0 15px 0 !important;
	}
	.mypage-info .box-in{
		padding:15px;
	}
	.mypage-info .point-box table{
		font-size:14px;
	}
	.mypage-info .point-box table th{
		padding:0 10px 10px;
	}
	.mypage-info .point-box table td{
		padding:0 0 10px 10px;
	}
	.link-banners ul li{
		height:87px;
	}
	.link-banners ul li a{
		display:block;
		background-color:#dbedfa;
		color:#000;
		text-decoration:none;
		padding:15px 15px 15px 30px;
		font-size:14px;
		line-height:1.8;
		box-sizing:border-box;
		height:87px;
	}
	.mypage-info .point-box .more {
		padding: 10px 0 0 0;
	}

}
@media screen and (max-width: 1040px) {
	.mypage-info .btn-box{
		width:100%;
		display:block;

	}
	.mypage-info .title-box{
		dislay:block;
		width:100%;
	}
	.mypage-info{
		display:block;
	}
	.mypage-info .box-in{
		padding:15px 15px 0;
		border-right:none;
		border-bottom:none;
	}
	.mypage-info .rank-box{
		width:auto;
		padding-bottom:15px;
	}
	.mypage-info .point-box{
		width:auto;
		padding:0 0 15px;
	}
	.link-banners{
		width:auto;
	}
	.mypage-info .rank-box h1{
		display:inline-block;
		vertical-align:bottom;
		font-size:16px;
		margin:0 15px 0 0;
		font-weight:normal;
		width:165px;
	}
	.mypage-info .rank-box .rank{
		display:inline-block;
		vertical-align:bottom;
	}
	.mypage-info .rank-box .more{
		padding:0;
		display:inline-block;
		vertical-align:bottom;
	}
		
	.section-news .wrap.flex {
	    display: block;
	}
	.news-box-left{
		width:auto;
		text-align:left;
		display:block;
		border-right:none;
		border-bottom:solid #ccc 1px;
		max-width: unset;
	}
	.section-mypage .news-title{
		margin-left:5px;
	}
	.news-box-left .news-title{
		padding:15px;
	}
	.news-box-left .news-title h1{
		font-size:16px;
	}
	.news-box-right{
		width:auto;
	}
	.section-mypage .news-box-right{
		border-left:none;
	}
		
	.button-links{
		padding:15px;
		font-size:0;
	}
	.button-links .btn-default {
	  width: 49% !important;
		margin:0 2% 15px 0 !important;
	}
	.button-links .btn-default.w30:nth-child(2n) {
		margin:0 0 15px 0 !important;
	}
}
@media screen and (max-width: 640px) {
	.news-box-right{
		border-left:none;
	}
	.mypage-info .rank-box,
	.mypage-info .point-box{
		border-right:none;
	}
	.link-banners ul li {
		width:100%;
		display:block;
	}
	.button-links .btn-default {
	  width: 100% !important;
		margin:0 0 15px 0 !important;
	}
	.link-banners ul li.coupon .budge{
		top:calc(50% - 12px);
		right:36px;
	}
	.link-banners ul li.coupon .budge i{
		font-size:12px;
		line-height:1;
		padding:2px 7px;
		border-radius:15px;
	}

}


@keyframes bound {
  from { transform: scale(1); }
  25% { transform: scale(1.15); }
  50% { transform: scale(0.95); }
  75% { transform: scale(1.05); }
  to { transform: scale(1); }
}


/* マイページカウント */
.count h2 {
	padding: 10px 35px 0 0;
	display: inline-block;
	font-size: 14px;

}

@media screen and (max-width: 1280px) {
	.item-list ul li{
	  width: 49%;
		margin:0 2% 30px 0;
	}
	.item-list ul li:nth-child(2n){
		margin:0 0 30px 0;
	}
	.item-list ul li figure ul{
		height:380px;
	}
	.item-list ul li figure ul li{
		height:380px;
	}
}
@media screen and (max-width: 1040px) {
	.count h2 {
		font-weight: normal;
		width: 185px;
		padding: 15px 0 0;
	}
}
@media screen and (max-width: 480px) {
	.count h2 {
		width: 50%;
	}
	.mypage-info .rank-box h1 {
	    font-size: 14px;
	    margin: 0;
	    width: 48%;
	}
	.mypage-info .point-box table {
	    font-size: 14px;
	    width: 100%;
	}
	.mypage-info .point-box table th {
	    font-weight: normal;
	    width: 50%;
	}
	.mypage-info .point-box table th.point-value {
	    vertical-align: middle;
	}
	.mypage-info .point-box table td.point-value {
	    font-size: 25px;
	    vertical-align: middle;
	}
	.mypage-info .point-box table th.point-value-lost {
	    vertical-align: middle;
	    padding: 0 15px 15px 0;
	}
	.mypage-info .point-box table td.point-value-lost {
	    vertical-align: middle;
	}
	.link-banners ul li {
	    height: 70px;
	}
	.link-banners ul li a {
	    padding: 15px 15px 15px 15px;
	    font-size: 14px;
	    line-height: 1.5;
	    height: 70px;
	}
	.link-banners ul li a span{
		padding:0 0 0 50px;
	}
	.link-banners ul li.shopping a span{
		background-size:24px;
	}
	.link-banners ul li.zumen a span{
		background-size:30px;
	}
	.link-banners ul li.review a span{
		background-size:26px;
	}
	.link-banners ul li.point a span{
		background-size:31px;
	}
	.link-banners ul li.coupon a span{
		background-size:30px!important;
	}
	.link-banners ul li a {
	    background: #dbedfa url(../../img/common/arrow.png) no-repeat center right 7px /7px;
	}
	.link-banners ul li.coupon .budge{
		right:20px;
	}
		
	.section-news .wrap.flex {
	    display: block;
	}
	.news-box-left{
		width:auto;
		text-align:left;
		display:block;
		border-right:none;
		border-bottom:solid #ccc 1px;
	}
	.news-box-left .news-title{
		padding:15px;
	}
	.news-box-left .news-title h1{
		font-size:16px;
	}
	.news-box-right{
		width:auto;
	}
	.news-box-left{
		width:auto;
		text-align:left;
		display:block;
		border-right:none;
		border-bottom:solid #ccc 1px;
	}
	.news-box-left .news-title{
		padding:15px;
	}
	.news-box-left .news-title h1{
		font-size:16px;
	}
	.news-box-right{
		width:auto;
	}
		
	.item-list ul li figure ul{
		height:240px;
	}
	.item-list ul li figure ul li{
		height:240px;
	}
	.item-list ul li figure img {
	    max-width: 211px;
	    max-height: 240px;
	}
	.item-list ul li .tags{
	margin:0;
	}
	.item-list ul li .tags span.tag{
		margin:0 .5em 10px 0;
	}
}