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

/*----------------------------------------------------
    .scroll
----------------------------------------------------*/
.scroll {
	max-width:800px;
	height:auto;
	margin:0 auto;
}

.scroll ul li img {
	margin:4px;
	width:13%;
	border:solid 1px #FFFFFF;
	float:left;
}

.list {
	max-width:800px;
	height:auto;
	margin:auto;
	padding-top:30px;
	padding-bottom:80px;
	overflow: hidden;
	clear:both;
}

.list h2 {
	color:#FFF;
	text-align:center;
	font-size:large;
}

.list h3 {
	color:#FF0000;
	text-align:center;
	font-size:20px;
	margin:10px;
}

table {
	width:100%;
	color:#FFFFFF;
	border:solid 1px #CCCCCC;
	line-height:1.5em;
	font-size:12px;
}

.price-l {
	border-collapse :collapse;
}

th, td {
	padding:3px;
	text-align:center;
	border:solid 1px #CCCCCC;
}



/*----------------------------------------------------
    .price-l
----------------------------------------------------*/
.price-l th  {
	width:70%;
}
 



.thanks p {
	font-size:medium;
	padding-top:25px;
	line-height:2em;
	color:#F5F5F5;
}


/*----------------------------------------------------
  smartphone 480px
----------------------------------------------------*/
@media screen and (max-width:480px){
	.scroll-link {
	width:85%;
	margin-left:0;
	}
	
	.scroll ul li img {
	width:31%;
	margin:0.8%;
	float:left;
	}
	
	.list h3 {
	width:95%;
	margin-left:2.5%;
	}
	.price-l {
	width:95%;
	margin-left:2.5%;
	}
}

/*----------------------------------------------------
  tablet 481px~768px
----------------------------------------------------*/
@media screen and (min-width:481px) and ( max-width:768px) {
	.scroll-link {
	width:95%;
	margin-left:2.5%;
	}
	
	.scroll ul li img {
	width:22.8%;
	margin:0.85%;
	float:left;
	}
	
	.list h3 {
	width:95%;
	margin-left:2.5%;
	}
	.price-l {
	width:95%;
	margin-left:2.5%;
	}
}

/*----------------------------------------------------
  below 769px~1170px
----------------------------------------------------*/
@media screen and (min-width:769px) and ( max-width:1170px) {
	.scroll-link {
	width:95%;
	margin-left:2.5%;
	}
	
	.scroll ul li img {
	width:16%;
	margin:0.2%;
	float:left;
	}
	
	.list h3 {
	width:95%;
	margin-left:2.5%;
	}
	.price-l {
	width:95%;
	margin-left:2.5%;
	}
}

/*----------------------------------------------------
   above 1171px
----------------------------------------------------*/
@media screen and (min-width:1171px) {
	.scroll ul li img {
	width:15%;
	margin:0.7%;
	float:left;
	}
}