@charset "utf-8";
/*--****************************************


@item


*****************************************--*/
@media screen and (max-width:767px){
.wrapper{
	width:100%;
	height:480px;
	padding:0 0 20px 0;
	overflow-y:scroll;
	-webkit-overflow-scrolling : touch;
	overflow-x:hidden;
	background:#fff;
	border:10px solid #2bafa6;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}

.main{
	width: 94%;
	margin:0 auto;
}

.item-ttl{
	padding: 20px 0 20px 0;
	font-size: 14px;
	line-height: 1.5em;
	font-weight: bold;
}
.leftCol{
  width: 100%;
  margin: 0 20px 20px 0;
  text-align: center;
}

.leftCol .photo {
	margin: 0;
	padding: 1px;
	border: 1px solid #C7DAC7;
	text-align: center;
	background: #fff;
	
 	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;

}

.photo img {
  width: 100%;
}

.thumbnail {
  display: block;
}

.thumbnail li{
	width: 20%;
	margin: 0 2.5% 2.5% 2.5%;
	padding: 0;
	border: 4px solid #C7DAC7;
	cursor: pointer;
	float: left;
	font-size: 0;
	line-height: 0;
	
	  
 	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;


}

.rightCol .photo {
  width: 100%;
}
	


}
@media screen and (min-width: 768px){
	
	
.wrapper{
	width:780px;
	height:480px;
	overflow-y:auto;
	overflow-x:hidden;
	background:#fff;
	border:10px solid #02a48d;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
}

.main{
	  width: 740px;
  margin: 0 auto;
}

.item-ttl{
	padding: 20px 0 20px 0;
	font-size: 14px;
	line-height: 1.5em;
	font-weight: bold;
}

.leftCol{
  width: 340px;
  margin: 0 20px 20px 0;
  text-align: center;
  float: left;
}

.box {
  margin: 0 6px 0 6px;
  text-align: center;
  float: left;
}

.leftCol .photo {
  margin: 0;
  padding: 1px;
  border: 1px solid #C7DAC7;
  text-align: center;
  background: #fff;
}

.photo img {
  width: 100%;
}

.rightCol {
  width: 360px;
  margin: 0;
  padding: 0;
  font-size: 93%;
  line-height: 1.75em;
  text-align: left;
  float: right;
}

.thumbnail {
  display: block;
}

.thumbnail li{
  width: 50px;
  margin: 0 8px 10px 0;
  padding: 0;
  border: 4px solid #C7DAC7;
  cursor: pointer;
  float: left;
  font-size: 0;
  line-height: 0;
}

.rightCol .photo {
  width: 50px;
}
	
}