@charset "UTF-8";

*{
	margin:0;
	padding:0;
}

html,body{
	width:100%;
	height:100%;
}

body{
	background-color:#fff;
}

img{
	height:auto;
	border:none;
}

a:link, a:visited, a:hover{
	text-decoration:none;
}

li a:hover{
	color:#666;
}

.dl_box{
	width:350px;
	margin:0 auto;
}

.left{
	float:left;
	margin-right:12%;
}

.clear{
	clear:both;
}

.center{
	text-align:center;
}

b{
	text-decoration: underline;
}

p, a, li, .bflink, h1, h2, .dl, li a, .top-link, .credit{
	font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color:#000;	
	text-align: justify;
}

.attention{
	color:#790103;
}

footer{
	width:100%;
	margin-top:150px;
}

.footer{
	width:900px;
	padding:30px;
	margin:0 auto;
	text-align: center;
}

.top-link{
	display:block;
	margin:10px 0 40px;
}

.footer ul li{
	display:inline-block;
	border-left:1px solid #666;
	padding:0 15px;
	margin:15px 0 20px;
}

.footer ul li:first-child{
	border:0;
}

.footer a{
	font-size:13px;
}

.footer img{
	width:60px;
}

.credit, .top-link{
	text-align: center;
}

.footer a:link, .footer a:visited{
	text-decoration:none;
}

.s-wrapper ul li{
	font-size:14px;
	margin-bottom:2%;
}


h2{
	color:#666;
	font-size:100%;
	margin:2% 0;
}


/*戻るボタン*/

.p-top {
    position: fixed;
    bottom: 3%;
    right: 2%;
	z-index:1000;
	padding:1%;
}

.credit{
	font-size:10px;
}


.dl{
	text-align: center;
	font-size:90%;
}

h1{
	font-size:130%;
	margin:2% 0;
}

.emp, .question{
	font-size:100%;
	font-weight:bold;
	color:#666;
}

p, a, h2, li{
	letter-spacing:2px;
	line-height:170%;
}

.question{
	margin-bottom:2%;
}

.answer{
	font-size:90%;
}

.question_ini, .answer_ini{
	font-size:130%;
	font-weight:bold;
}

.question_ini{
	color:#3B3B3B;
}

.answer_ini{
	color:#B43E40;
}

.important{
	font-weight:bold;
	color:#A20002;
}

#wrapper{
	width:900px;
	margin:3% auto;
}

.mid-wrapper{
	margin:5% 0 10%;
	background-color:#DCDDDD;
	border-radius:10px;
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
   -moz-border-radius: 10px;   /* Firefox用 */
	padding:3%;
}

#qanda{
	background-color:#e1ebf9;
}

.w-wrapper, .q-wrapper{
	width:600px;
	padding:5% 3%;
	margin:0 auto;
}

.s-wrapper{
	background-color:#fff;
	padding:2%;
	margin-bottom:3%;
}

.s-wrapper ul, .pointbox ul{
	padding:1% 3%;
	list-style-type:circle;
}

.w-img{
	width:45%;
	margin:20px auto;
}

.w-img img, .middle-img img{
	width:100%;
}

.w-img{
	margin-right:4%;
	float: left;
}

.middle-img{
	text-align: center;
	margin-bottom:4%;
}

.pointbox{
	background:#fff;
	margin-top:4%;
	padding:3%;
	/*overflow: hidden;*/
}

.pointbox-cap{
	font-size:90%;
}

.point-img{
	margin:2% 0;
	text-align:center;
}

.top-img, .title-img, .top-cap, .center{	
	text-align: center;
}

.caption{
	margin:3%;
}

.caption p{
	font-size:90%;
	margin-bottom:2%;
}

.bold{
	font-weight: bold;
	color:#780002;
}

.sp, .tab{
	display: none;
}
	
.pc{
	display:block;
}

.sp{
	display: none;
}
	
.pc, .pc_dl{
	display:block;
}



@media screen and (max-width: 768px){

	
	img{
		height:auto;
	}
	
	.tab{
		display:block;
	}
	
	.pc_dl{
		display:none;
	}
	
	.bflink{
		font-size:70%;
	}
	
	.right p{
		margin-bottom:2.5%;
	}
	
	.dl .right img{
		margin-left:10%;
	}
	
	#wrapper{
		width:680px;
	}
	
	
	 .top-img img, .title-img img, .coupon-btn img, .cap img{
		width:100%;
	}
	
	.footer{
		width:680px;
		margin:0 auto;
		padding:20px;
	}
	
	.footer ul li{
		border:none;
		display:block;
		text-align: center;
	}
	
	.footer ul li a{
		font-size:12px;
	}
	
	
}

@media screen and (max-width:640px){

	.sp{
		display: block;
	}
	
	.pc{
		display:none;
	}

	#wrapper{
		width:350px;
	}	
	
	.mid-wrapper, .q-wrapper{
		width:330px;
	}
		
	.dl_box{
		width:320px;
		margin:2% auto;
	}
	
	.dl .right img{
		margin-left:0;
	}
	
	.right p{
		margin-bottom:3%;
	}
	
	.left{
		margin-right:25px;
	}
	
	 .w-wrapper, .q-wrapper, .w-img, .pointbox-cap, .middle-img img, .point-img img{
		width:100%;
	}
	
	.w-img img{
		width:50%;
	}
	
	.w-img{
		clear: both;
		margin-bottom:5%;
		margin-left:-8px;
	}
	
	.w-img, .middle-img{
		text-align: center;
	}
	
	.middle-img{
		width:300px;
	}
	
	.w-cap, .middle-cap{
		width:300px;
	}
	
	.pointbox{
		width:290px;
	}
	
	.w-wrapper{
	margin:5% auto;
	}
	
	h1 img{
		width:90%;
	}
	
	.cap img{
		margin:3% 0;
	}
	
	.s-wrapper{
		margin:5% 0;
	}
	
	.s-wrapper ul{
		margin:1% 0 3% 3%;
	}
	
	.caption p, .s-wrapper ul li, .pagetop{
		font-size:70%;
	}
	
	h2, .back-box p, .friend p, .insta p, .coupon p{
		font-size:75%;
	}
	
	.emp{
		margin-bottom:5%;
	}
	
	.s-wrapper ul{
		margin:1% 0 3% 3%;
	}
	
	.footer{
			width:350px;
			padding:20px 0;
		}

	#p-top{
		padding:2%;	
	}
	
	
	
}

/* CSS Document */