
.fade-in {
  opacity: 0;
  transition-duration: 500ms;
  transition-property: opacity, transform;
  transform: translate(0, 7.8125vw);
  transition-timing-function:ease-out;
}

.fade-in-up,
.shadow1.fade-in-up,
.shadow2.fade-in-up{
  transform: translate(0, 7.8125vw);
}
.scroll-in,
.shadow1.scroll-in,
.shadow2.scroll-in{
  opacity: 1;
  transform: translate(0, 0);
}

.shadow1.fade-in{
	transition-delay: 0.3s;
  transition-duration: 500ms;
}
.shadow2.fade-in{
	transition-delay: 0.3s;
  transition-duration: 500ms;
}



.inner {
  padding: 0 3.125vw;
}
.inner h2{
	width:100%;
	margin-top:10px;
}
.inner h2 img{
	width:100%;
	height:auto;
}

div.inner div.contentsHeader div,
div.inner div.contentsHeader p,
div.inner div.contentsHeader span,
div.inner div.contentsHeader a,
div.inner div.contentsHeader ul,
div.inner div.contentsHeader li,
div.inner a:link,
div.inner a:visited{
	font-style: normal;
	/*font-family: 'Noto Serif JP', serif;*/
	color:#4d4d4d;
	vertical-align:inherit;
}
div.contentsHeader{
	width:100vw;
	height:118.75vw;
	margin-top:0;
	margin-bottom:0;
}

div.contentsHeader img.titleImg{
	width:100%;
	height:auto;
	padding: 0;
	margin: 0;
	display:block;
}
div.contentsHeader img.titleTxt{
	width:81.25vw;
	height:auto;
	padding: 0;
	margin: -20.3125vw auto 0 auto;
	display:block;
}
.contentsHeader p{
	text-align: center;
	font-size: 3.125vw;
	letter-spacing: 0.1em;
	line-height: 1.8em;
}



#wrapper{
	overflow: inherit;
}
.contentsWrapper{
	width:100vw;
	padding-top:0;
	position: relative;
}

.contentsInner{
	width:100vw;
	margin: 0 auto 0 auto;
	padding: 31.25vw 0 0 0;
	position: relative;
}
.badge{
	width:28.125vw;
	height:auto;
	position:absolute;
	top:14.735vw;
	right:3.125vw;
	z-index:2;
}

.item2 .badge,
.item4 .badge{
	left:3.125vw;
}

.contentsInner .item{
	width:100vw;
	margin: 0 auto;
	position: relative;
}
.contentsInner .item .mainImg{
	position: relative;
	width:81.25vw;
	height:90.625vw;
	margin-bottom:9.375vw;
}
.contentsInner .item .mainImg a{
	width:81.25vw;
	height:81.25vw;
	display:block;
	position: absolute;
	top:0;
	left:9.375vw;
}
.contentsInner .item .mainImg a::after{
	content: "";
	display: block;
	width:81.25vw;
	height:81.25vw;
	background: #f7d0d0;
	position: absolute;
	top:9.375vw;
	left:-9.375vw;
	z-index:-1;
	pointer-events: none;
}
.item2 .item .mainImg a::after{
	background: #b09c81;
	left:9.375vw;
}
.item3 .item .mainImg a::after{
	background: #bdb9b8;
}
.item4 .item .mainImg a::after{
	background: #fe7d80;
	left:9.375vw;
}


.contentsInner .item .mainImg img{
	width:81.25vw;
	height:81.25vw;
}

.contentsInner .item .subImg{
	position: relative;
	width:100vw;
}
.contentsInner .item .subImg a{
	width:70.3125vw;
	height:auto;
	display:block;
	margin:0 0 0 20.3125vw;
}

.item2 .item .subImg a,
.item4 .item .subImg a{
	margin:0 0 0 9.375vw;
}

.contentsInner .item .subImg img{
	width:70.3125vw;
	height:auto;
}
.contentsInner .item .subImg img.txt1{
	width:9.375vw;
	height:auto;
	display:block;
	position:absolute;
	top:0;
	right:0;
	margin:0 0 0 0;
	pointer-events: none;
}
.contentsInner .item .subImg img.txt2{
	width:31.25vw;
	height:auto;
	display:block;
	position:absolute;
	top:0;
	left:0;
	margin:0 0 0 0;
	pointer-events: none;
}
.item2 .item .subImg img.txt1,
.item4 .item .subImg img.txt1{
	left:0;
}
.item2 .item .subImg img.txt2,
.item4 .item .subImg img.txt2{
	left:inherit;
	right:0;
}

.viewBtn{
	width:100vw;
}
.viewBtn a{
	width:62.5vw;
	height:15.625vw;
	display:block;
	margin: 6.25vw auto 0 auto;
}
.viewBtn a img{
	width:62.5vw;
	height:auto;
	display:block;
	margin: 6.25vw auto 0 auto;
}

.btnAll{
	width:100%;
	margin: 23.4375vw 0;
}
.btnAll a img{
	width:100%;
	height:auto;
	display: block;
}
.btnAll a:hover img{
	opacity: 0.5;
}

















