/*=================================================
 * CSS for PC
 * ================================================= */

#left{	padding-right: 0;}

.cnt{
	padding: 15px 15px 25px 15px;
}

.cnt .page_title{
	margin-bottom: 15px;
}

#shop{
	padding: 0 10px 20px 10px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#nopub .data_bg{
	display: table;
	width: 100%;
	height: 370px;
	font-size: 0;
	line-height: 0;
	background: url(../../img/all/shop_nopub.png) no-repeat center center;
	-webkit-background-size: 270px 310px;
	background-size: 270px 310px;
}

#nopub .data{
	display: table-cell;
	vertical-align: middle;
}

#shop .dbox{}

#shop .dbox{
	display: table;
	table-layout: fixed;
	width: 500px;
	margin: 0 auto 10px auto;
	border: 1px solid #ddd;
	border-radius: 30px;
	box-shadow:0px 0px 0px 3px #fff inset;
	-moz-box-shadow:0px 0px 0px 3px #fff inset;
	-webkit-box-shadow:0px 0px 0px 3px #fff inset;
	background: rgba(255, 255, 255, 0.8);
}
#shop .dbox:last-of-type{	margin-bottom: 15px;}

#shop .dbox_l,
#shop .dbox_r{
	position: relative;
	display: table-cell;
	vertical-align: middle;
	line-height: 50px;
	height: 60px;
	font-size: 25px;
	font-weight: bold;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#shop .dbox_l{
	text-align: left;
	padding-left: 30px;
}

#shop .dbox_l span{
	font-size: 12px;
	font-weight: normal;
}

#shop .dbox_r{
	text-align: right;
	font-size: 18px;
	padding-right: 30px;
}

#shop .dbox_l:after,
#shop .dbox_r:after{
	content: '';
	height: calc(100% - 20px);
	position: absolute;
	top: 10px;
}

#shop .dbox_l:after{
	border-right: 1px dotted #ddd;
	position: absolute;
	right: 0;
}

#shop .dbox_r:after{
	border-left: 1px dotted #ddd;
	position: absolute;
	left: 1px;
}

#shop .dbox_l em,
#shop .dbox_r em{	color: #ff0000;}
#shop .dbox_r em:first-of-type{	font-size: 25px;}

#no_main{
	width: 700px;
	background: #f5f5f5;
	margin: 0 auto;
	padding: 10px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#no_main table{
	width: 100%;
	font-size: 14px;
	line-height: 20px;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

#no_main tr{	vertical-align: middle;}

#no_main th{
	width: 200px;
	font-size: 16px;
	font-weight: bold;
	text-align: left;
	background: #f6f6f6;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 12px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#no_main th br{	display: none;}

#no_main th em{
	font-size: 11px;
	font-weight: normal;
}

#no_main td{
	text-align: left;
	background: #fff;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 12px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#no_main td em{
	font-size: 24px;
	font-weight: bold;
	color: #ff0000;
}

#no_main td span{	font-weight: bold;}
#no_main td i{
	font-style: normal;
	color: #ff0000;
}

.notxt{
	font-size: 11px;
	line-height: 18px;
	text-align: center;
	padding: 10px 0 40px 0;
}
.notxt a{	color: #ff0000;}

.pop{
	position: relative;
	width: 760px;
	font-size: 14px;
	line-height: 20px;
	color: #fff;
	background: #ff77ae;
	border-radius: 5px;
	margin: 0 auto 15px auto;
	padding: 15px;
	animation: key1 .3s ease infinite alternate;
}

@keyframes key1{
	0% {transform: translateY(0px);}
	100% {transform: translateY(-10px);}
}

.pop:after{
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 12px 12px 0 12px;
	border-color: #ff77ae transparent transparent transparent;
	position: absolute;
	bottom: -12px;
	left: calc(50% - 12px);
}

.no_tel{
	position: relative;
	display: block;
	width: 350px;
	margin: 0 auto;
	z-index: 201;
}

.no_tel_pc{
	display: block;
	height: 70px;
	font-size: 16px;
	font-weight: bold;
	line-height: 70px;
	text-align: center;
	border-radius: 10px;
	color: #fff;
	padding: 0 0 0 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.no_tel_pc span{
	display: inline-block;
	font-family: "FontA";
	font-size: 40px;
	font-weight: normal;
	padding: 0 0 0 55px;
	background-image: url(https://www.fucolle.com/img/all/fix_div_tel.png);
	background-repeat: no-repeat;
	background-position: 0 50%;
	-webkit-background-size: 50px auto;
	background-size: 50px auto;
}

.no_tel_pc:hover{
	text-decoration: none;
}

#shop .caution{
	font-size: 13px;
	line-height: 20px;
	text-align: left;
	padding: 0 20px 20px 20px;
}
#shop .caution span{	color: #ff3399;}

#shop .bt_bg{
	text-align: center;
	margin: 0 20px;
	padding: 30px 0;
}

#shop .bt_bg a,
#shop .bt_bg span{
	display: inline-block;
	vertical-align: top;
	width: 250px;
	margin: 0 5px;
}

#shop .bt_bg a.bt_exp{
	background:  #ff3399;
	box-shadow: 0px 1px 0px 0px #cc0066;
}

#shop .bt_bg a.bt_review{
	background:  #00bea5;
	box-shadow: 0px 1px 0px 0px #007283;
}

#shop .bt_bg span.bt_exp,
#shop .bt_bg span.bt_review{
	background:  #999;
	box-shadow: 0px 1px 0px 0px #666;
}

.arrow{	margin: 0 20px 20px 20px;}

.eigyo{
	font-size: 16px;
	line-height: 22px;
	text-align: center;
}


/** rece_user **/

.rece_user{
	padding: 40px 0 0 0;
}

.rece_user h4{
	margin: 0 0 15px 0;
}

.rece_user .sort{
	width: 870px;
	font-size: 13px;
	line-height: 25px;
	text-align: center;
	color: #ccc;
	background: #f5f5f5;
	border-radius: 12.5px;
	margin: 0 auto 15px auto;
}
.rece_user .sort span{
	font-weight: bold;
	color: #333;
}

.rece_user ul{
	font-size: 0;
	line-height: 0;
	padding: 0 25px 15px 25px;
}

.rece_user li{
	display: inline-block;
	vertical-align: top;
	width: calc(100% / 4 - 10px);
	margin: 0 5px 10px 5px;
}

.rece_user li > a,
.rece_user li > span{
	display: block;
	color: #333;
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 5px;
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.rece_user li > a:hover{
	text-decoration: none;
}

.rece_user li .rcbox{
	display: table;
	width: 100%;
	font-size: 0;
	line-height: 0;
}

.rece_user li .rcbox_l,
.rece_user li .rcbox_r{
	display: table-cell;
	vertical-align: middle;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.rece_user li .rcbox_l{
	width: 60px;
	padding: 0 10px 0 0;
}

.rece_user li .rcbox_r{
	font-size: 10px;
	line-height: 12px;
	text-align: left;
	padding: 0 0 28px 0;
}
.rece_user li .rcbox_r em{	font-size: 11px;}
.rece_user li .rcbox_r br{	display: none;}

.rece_user li .rctxt{
	font-size: 10px;
	line-height: 12px;
	text-align: left;
	margin: -25px 0 0 0;
	padding: 0 0 0 60px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.rece_user li .rctxt em{
	font-weight: bold;
}

#u_img{
	position: relative;
	display: inline-block;
	font-size: 0;
	line-height: 0;
	width: 50px;
	height: 50px;
	padding: 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#u_img a{	border-radius: 50%;}

#u_img img{
	width: 50px;
	height: auto;
	border-radius: 50%;
}

#u_img p{
	width: 50px;
	font-size: 10px;
	line-height: 12px;
	text-align: center;
	color: #fff;
	background: #333;
	border-radius: 6px;
	position: absolute;
	top: 35px;
	left: 0;
}
#u_img p.bad{	background: #ff0000;}

#u_img.rank1 img.lazy{
	box-shadow:0px 0px 0px 2px #ffd321 !important;
	-moz-box-shadow:0px 0px 0px 2px #ffd321 !important;
	-webkit-box-shadow:0px 0px 0px 2px #ffd321 !important;
}
#u_img.rank1 p{
	color: #333;
	background: -webkit-linear-gradient(0deg, #ddad12 0%, #fffb85 49%, #ddad12 100%);
	background: -moz-linear-gradient(0deg, #ddad12 0%, #fffb85 49%, #ddad12 100%);
	background: -o-linear-gradient(0deg, #ddad12 0%, #fffb85 49%, #ddad12 100%);
	background: -ms-linear-gradient(0deg, #ddad12 0%, #fffb85 49%, #ddad12 100%);
	background: linear-gradient(90deg, #ddad12 0%, #fffb85 49%, #ddad12 100%);
}
#u_img.rank2 img.lazy{
	box-shadow:0px 0px 0px 2px #68c75e !important;
	-moz-box-shadow:0px 0px 0px 2px #68c75e !important;
	-webkit-box-shadow:0px 0px 0px 2px #68c75e !important;
}
#u_img.rank2 p{
	color: #333;
	background: -webkit-linear-gradient(0deg, #22c016 0%, #a8ff6e 49%, #22c016 100%);
	background: -moz-linear-gradient(0deg, #22c016 0%, #a8ff6e 49%, #22c016 100%);
	background: -o-linear-gradient(0deg, #22c016 0%, #a8ff6e 49%, #22c016 100%);
	background: -ms-linear-gradient(0deg, #22c016 0%, #a8ff6e 49%, #22c016 100%);
	background: linear-gradient(90deg, #22c016 0%, #a8ff6e 49%, #22c016 100%);
}
#u_img.rank3 img.lazy{
	box-shadow:0px 0px 0px 2px #5dadff !important;
	-moz-box-shadow:0px 0px 0px 2px #5dadff !important;
	-webkit-box-shadow:0px 0px 0px 2px #5dadff !important;
}
#u_img.rank3 p{
	color: #333;
	background: -webkit-linear-gradient(0deg, #2b9eff 0%, #6ce5ff 49%, #2b9eff 100%);
	background: -moz-linear-gradient(0deg, #2b9eff 0%, #6ce5ff 49%, #2b9eff 100%);
	background: -o-linear-gradient(0deg, #2b9eff 0%, #6ce5ff 49%, #2b9eff 100%);
	background: -ms-linear-gradient(0deg, #2b9eff 0%, #6ce5ff 49%, #2b9eff 100%);
	background: linear-gradient(90deg, #2b9eff 0%, #6ce5ff 49%, #2b9eff 100%);
}


/** shop_free **/

.shop_free{}

.shop_free > h4{
	font-size: 18px;
	font-weight: bold;
	line-height: 20px;
	text-align: center;
	color: #fff;
	margin: 0 0 15px 0;
	padding: 10px 0;
	box-shadow:0px 0px 0px 4px rgba(255, 255, 255, 0.3) inset;
	-moz-box-shadow:0px 0px 0px 4px rgba(255, 255, 255, 0.3) inset;
	-webkit-box-shadow:0px 0px 0px 4px rgba(255, 255, 255, 0.3) inset;
}

.shop_free .frbox{
	display: table;
	width: 100%;
	font-size: 0;
	line-height: 0;
	background: #f5f5f5;
	margin: 0 0 10px 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.shop_free .frbox_l,
.shop_free .frbox_r{
	display: table-cell;
	vertical-align: top;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.shop_free .frbox_l{
	padding: 10px;
}

.shop_free .frbox_l ul{
	border-top: 1px solid #ccc;
}

.shop_free .frbox_l li{
	display: inline-block;
	vertical-align: top;
	width: 50%;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.shop_free .frbox_l li:nth-of-type(even){
	border-right: 1px solid #ccc;
}
.shop_free .frbox_l li div{
	display: table;
	width: 100%;
	background: #fff;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.shop_free .frbox_l li span,
.shop_free .frbox_l li em{
	display: table-cell;
	vertical-align: middle;
	height: 44px;
	border-bottom: 1px solid #ccc;
	border-left: 1px solid #ccc;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.shop_free .frbox_l li span{
	width: 70px;
	font-size: 14px;
	font-weight: bold;
	line-height: 18px;
	text-align: center;
	background: #f6f6f6;
}

.shop_free .frbox_l li em{
	font-size: 14px;
	line-height: 16px;
	text-align: left;
	padding: 0 5px;
}

.shop_free .frbox_l li em a{
	color: #333333;
}

.shop_free .frbox_r{
	width: 220px;
	padding: 10px 10px 10px 0;
}

.shop_free .txt{
	font-size: 12px;
	line-height: 30px;
	padding: 0 2px;
	background: url(../../img/all/dot30.gif) top left;
}

.shop_free #d_area{
	font-size: 0;
	line-height: 0;
	text-align: center;
	border-radius: 3px;
	background: #fff;
	box-shadow:0px 0px 0px 1px #dddddd inset,0px 0px 0px 3px #f5f5f5 inset;
	padding: 0 5px;
}

.shop_free #d_area h4{
	display: block;
	vertical-align: top;
	width: 150px;
	font-size: 16px;
	font-weight: bold;
	line-height: 25px;
	color: #fff;
	border-radius: 0 0 5px 5px;
	margin: 0 auto;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.shop_free #d_area div{
	width: 100%;
	display: table;
}

.shop_free #d_area div p{
	display: table-cell;
	vertical-align: middle;
	height: 108px;
}

.shop_free #d_area a{
	display: inline-block;
	vertical-align: top;
	font-size: 13px;
	font-weight: bold;
	line-height: 18px;
	color: #333;
	border: 2px solid #ddd;
	border-radius: 2px;
	margin: 0 2.5px 5px 2.5px;
	padding: 0 5px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.shop_free #d_area a:hover{	text-decoration: underline;}

.bnr_exp{	display: none;}


/*=================================================
 * CSS for SP
 * ================================================= */

@media screen and (max-width: 650px) {
	.cnt{	padding: 0;}
	.cnt .page_title{
		margin-bottom: 0;
	}
	#shop{
		margin: 0;
		padding: 0;
		border: none;
	}
	#nopub .data_bg{
		height: 200px;
		-webkit-background-size: 155px 178px;
		background-size: 155px 178px;
	}
	#nopub .dbox{
		width: calc(100% - 20px);
		margin: 0 auto 5px auto;
		border-radius: 25px;
	}
	#shop .dbox{	width: calc(100% - 20px);}
	#shop .dbox:last-of-type{	margin-bottom: 10px;}
	#shop .dbox_l,
	#shop .dbox_r{
		font-size: 16px;
		height: 41px;
		line-height: 41px;
	}
	#shop .dbox_l{	padding-left: 20px;}
	#shop .dbox_r{	font-size: 11px; padding-right: 20px;}
	#shop .dbox_r em:first-of-type{	font-size: 17px;}
	#no_main{
		width: auto;
		margin: 0;
		padding: 10px;
	}
	#no_main table{
		font-size: 14px;
		line-height: 16px;
	}
	#no_main th{
		width: 100px;
		font-size: 14px;
		padding: 10px 5px;
	}
	#no_main th.th1{	padding: 9px 5px 10px 5px;}
	#no_main th.th2{	padding: 7px 5px 3px 5px;}
	#no_main th.th1+td{	padding: 9px 10px 10px 10px;}
	#no_main th.th2+td{	padding: 7px 10px 3px 10px;}
	#no_main th br{	display: inline;}
	#no_main th em{
		display: inline-block;
		vertical-align: top;
		font-size: 10px;
		line-height: 10px;
	}
	#no_main td{
		padding: 10px;
	}
	#no_main td em{	font-size: 18px;}
	.notxt{
		font-size: 11px;
		line-height: 18px;
		text-align: left;
		border-top: 1px dotted #ddd;
		border-bottom: 1px dotted #ddd;
		margin: 0 10px 20px 10px;
		padding: 7px 0;
	}
	.notxt a{	color: #ff0000;}
	.pop{
		width: auto;
		font-size: 13px;
		line-height: 20px;
		border-radius: 5px;
		margin: 0 10px 10px 10px;
		padding: 10px;
	}
	.no_tel{
		position: relative;
		width: auto;
		margin: 0 10px 10px 10px;
		z-index: 201;
	}
	.no_tel_pc{
		height: 55px;
		line-height: 55px;
	}
	
	.no_tel_pc span{
		font-size: 34px;
		padding: 0 0 0 50px;
		background-image: url(https://www.fucolle.com/img/all/fix_div_tel.png);
		background-repeat: no-repeat;
		background-position: 0 50%;
		-webkit-background-size: 45px auto;
		background-size: 45px auto;
	}

	.no_tel_pc:hover{
		text-decoration: none;
	}
	#shop .caution{
		font-size: 13px;
		line-height: 18px;
		padding: 0 10px 10px 10px;
	}
	#shop .caution br{	display: none;}
	#shop .bt_bg{
		margin: 0;
		padding: 10px;
	}
	#shop .dbox_l span{
	font-size: 11px;
	}
	#shop .bt_bg a,
	#shop .bt_bg span{
		display: block;
		width: auto;
		margin: 0 0 10px 0;
	}
	#shop .bt_bg a:last-child,
	#shop .bt_bg span:last-child{	margin-bottom: 0;}
	.arrow{	margin: 0 10px 10px 10px;}

	/** rece_user **/
	.rece_user{
		padding: 0;
		border-bottom: 1px solid #dddddd;
		margin-bottom: 10px;
	}
	.rece_user h4{
		margin: 0 0 10px 0;
	}
	.rece_user h4 span{
		width: 240px;
		font-size: 14px;
	}
	.rece_user .sort{
		width: auto;
		margin: 0 10px 10px 10px;
	}
	.rece_user ul{
		padding: 0 5px;
	}
	.rece_user li{
		width: calc(100% / 2 - 10px);
		margin: 0 5px 10px 5px;
	}
	.rece_user li > a,
	.rece_user li > span{	padding: 8px;}
	.rece_user li .rcbox_r{
		font-size: 10px;
		line-height: 14px;
		text-align: center;
		padding: 0;
	}
	.rece_user li .rcbox_r em{	font-size: 11px;}
	.rece_user li .rcbox_r br{	display: inline;}
	.rece_user li .rctxt{
		font-size: 10px;
		line-height: 12px;
		text-align: left;
		margin: 8px 0 0 0;
		padding: 0;
	}

	/** shop_free **/
	.shop_free{}
	.shop_free > h4{
		font-size: 16px;
		line-height: 18px;
		margin: 0;
		padding: 10px 5px;
		box-shadow:0px 3px 0px 0px rgba(255, 255, 255, 0.3) inset,0px -3px 0px 0px rgba(255, 255, 255, 0.3) inset;
		-moz-box-shadow:0px 3px 0px 0px rgba(255, 255, 255, 0.3) inset,0px -3px 0px 0px rgba(255, 255, 255, 0.3) inset;
		-webkit-box-shadow:0px 3px 0px 0px rgba(255, 255, 255, 0.3) inset,0px -3px 0px 0px rgba(255, 255, 255, 0.3) inset;
	}
	.shop_free .frbox{
		display: block;
		width: auto;
		background: none;
		margin: 0 0 10px 0;
	}
	.shop_free .frbox_l,
	.shop_free .frbox_r{
		display: block;
		width: auto;
	}
	.shop_free .frbox_l{
		padding: 10px;
		background: #f5f5f5;
	}
	.shop_free .frbox_l ul{
		border-top: 1px solid #ccc;
	}
	.shop_free .frbox_l li{
		display: block;
		width: auto;
	}
	.shop_free .frbox_l li:nth-of-type(odd),
	.shop_free .frbox_l li:nth-of-type(even){
		border-right: 1px solid #ccc;
	}
	.shop_free .frbox_l li span,
	.shop_free .frbox_l li em{	height: 40px;}
	.shop_free .frbox_r{	padding: 10px 10px 0 10px;}
	.shop_free .txt{
		line-height: 18px;
		margin: 0 10px;
		padding: 0 0 10px 0;
		background: none;
		border-bottom: 1px dotted #ddd;
	}
	.shop_free #d_area{
		margin: 0;
	}
	.shop_free #d_area h4{	font-size: 14px;}
	.shop_free #d_area div{
		width: auto;
		display: block;
	}
	.shop_free #d_area div p{
		width: auto;
		display: block;
		height: auto;
		padding: 10px 0 8px 0;
	}
	.shop_free #d_area span{	margin: 0 1px 2px 1px;}

	#ch h4{
	}
	#ch p{
	}
	#d_area{
	}

	.bnr_exp{
		display: block;
		text-align: center;
		margin: 0 10px;
		padding: 10px 0;
	}
	.bnr_exp p{
		font-size: 10px;
		line-height: 14px;
	}
	.bnr_exp div{	padding: 0;}
	.bnr_exp div img{
		width: 100%;
		max-width: 468px;
	}
}