@charset "UTF-8";
/* CSS Document */





.shop{
	width: 94%;
	max-width: 1350px;
	margin: 180px auto 350px;
	color: #33334B;
}



.shop .shopLeft{
	width: 240px;
	float: left;
}
.shop .shopLeft h2{
	font-size: 24px;
	letter-spacing: 0.05em;
}
.shop .shopRight{
	width: calc(100% - 240px);
	float: right;
	padding-top: 140px;
}


.shoplist{
	width: 100%;
	font-size: 0;
}
.shoplist li{
	width: 50%;
	display: inline-block;
	position: relative;
	vertical-align: top;
	margin-bottom: 50px;
}
.shoplist .map{
	width: 18px;
	position: absolute;
	top:50%;
	left:0;
	-webkit-transform:translateY(-50%);
	transform:translateY(-50%);
}
.shoplist .map a{
	-webkit-transition: opacity 0.4s;
	transition: opacity 0.4s;
}

.shoplist .info{
	width: 100%;
	padding:0 0 0 35px;
	line-height: 1.6;
}

.shoplist li:nth-child(odd) .info{padding-right: 25px;}


.shoplist .info h4{
	font-size: 15px;
	letter-spacing: 0.03em;
}
.shoplist .info p{
	font-size: 13px;
	letter-spacing: 0.03em;
	margin-top: 0.5em;
}


.webstore{
	padding-left: 35px;
	line-height: 1.5;
	font-size: 14px;

}
.webstore span{
	font-family:'DINPro-Regular';
	font-size: 16px;
	letter-spacing: 0.01em;
}
.webstore a{
	color: #33334B;
	text-decoration: underline;
}


@media(min-width: 769px) {
.shoplist .map a:hover{opacity: 0.6;}
.webstore a:hover{text-decoration: none;}
}




/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/











@media(max-width:980px) {


.shop{width: 90%;margin: 150px auto 300px;}
.shop .shopLeft{width: 100%;float: none;}

.shop .shopRight{width:100%;float: none;padding-top: 80px;}


}



@media(max-width:768px) {

.shop{width: 90%;margin: 18% auto 20%;}

.shop .shopLeft h2{font-size: 24px;}
.shop .shopRight{padding-top: 50px;}

.shoplist li{width: 100%;margin-bottom: 50px;}
.shoplist .info{padding-left:45px;}
.shoplist li:nth-child(odd) .info{padding-right: 0;}

.webstore{padding-left: 45px;}

}



@media(max-width:510px) {

.shop{margin: 22% auto 33%;}
.shop .shopLeft h2{font-size: 21px;}

.shop .shopRight{padding-top: 40px;}

.shoplist li{margin-bottom: 40px;}

.shoplist .info{padding-left:30px;}
.shoplist .info h4{font-size: 14px;}
.shoplist .info p{font-size: 12px;}

.webstore{font-size: 13px;padding-left: 30px;}
.webstore span{font-size: 15px;}

}


@media(max-width:350px) {

.shop .shopRight{padding-top: 30px;}
.shoplist li{margin-bottom: 30px;}
.shoplist .info h4{font-size: 13px;}

}