@charset "utf-8";


@media screen and (min-width: 751px) , print{

#content.tour .mainarea{
	height:408px;
	width:100%;
	background:url(/images/tour/main.jpg) no-repeat;
	background-size:cover;
	background-position:center;

}
	
#content.tour .maintl{
	width:95px;
	margin:-38px 0 0 -55px;

}

	
#content.tour .maintl img{
	width:100%;
	height:auto;
}
	
.wtlbox{
	height:45px;
	text-align: center;
	margin:0 0 40px 0;
}
	
.wtlbox img{
	width:auto;
	height:100%;
	display: inline-block;
}
	
.wrap {
  width:100%;
  background:#fff;
	padding:80px 0;
}
	
.wrap.box2{
  width:100%;
  background:#f0f0f0;
}
	
.wrap .thumblist{
  width:960px;
  margin:0 auto;
}

.grid-sizer,
.grid-item { width: calc(20% - 5px); margin:0 0 5px 5px;}
/* 2 columns */
.grid-item--width2{ width: calc(40% - 5px); margin:0 0 5px 5px;}
	
	.grid-item:hover{
		opacity: 0.8;
	}
	.grid-item .inph{
		width:100%;
		padding-top:50%;
		position: relative;
		background:#000;
		overflow: hidden;
		line-height: 0;
	}
	
	.grid-item .inph.box1{
		width:100%;
		padding-top:calc(50% + 2.5px);
		position: relative;
		background:#000;
		overflow: hidden;
		line-height: 0;
	}
	
	.grid-item .inph.box2{
		width:100%;
		padding-top:calc(100% + 5px);
		position: relative;
		background:#000;
		overflow: hidden;
		line-height: 0;
	}
	.grid-item img{
		width:100%;
		height:100%;
		object-fit: cover;
		position: absolute;
		top:0;
		left:0;
	}

}


@media screen and (max-width: 750px) {
	
#content.tour .mainarea{
	height:300px;
	width:100%;
	background:url(/images/tour/main.jpg) no-repeat;
	background-size:cover;
	background-position:center;

}
	
#content.tour .maintl{
	width:100%;
	text-align: center;

}

	
#content.tour .maintl img{
	width:22%;
	height:auto;
	margin:0 auto;
}
	
.wtlbox{
	height:35px;
	text-align: center;
	margin:0 0 30px 0;
}
	
.wtlbox img{
	width:auto;
	height:100%;
	display: inline-block;
}
	
.wrap {
  width:100%;
  background:#fff;
	padding:50px 0;
}
	
.wrap.box2{
  width:100%;
  background:#f0f0f0;
}
	
.wrap .thumblist{
  width:90%;
  margin:0 auto;
}

.grid-sizer,
.grid-item { width: calc(33.33333% - 5px); margin:0 0 5px 5px;}
/* 2 columns */
.grid-item--width2{ width: calc(33.3333% - 5px); margin:0 0 5px 5px;}
	
	.grid-item .inph{
		width:100%;
		padding-top:60%;
		position: relative;
		background:#000;
		overflow: hidden;
		line-height: 0;
	}
	
	.grid-item .inph.box1{
		width:100%;
		padding-top:calc(60%);
		position: relative;
		background:#000;
		overflow: hidden;
		line-height: 0;
	}
	
	.grid-item .inph.box2{
		width:100%;
		padding-top:calc(60%);
		position: relative;
		background:#000;
		overflow: hidden;
		line-height: 0;
	}
	.grid-item img{
		width:100%;
		height:100%;
		object-fit: cover;
		position: absolute;
		top:0;
		left:0;
	}
}
