@charset "UTF-8";


#pn{
	background:#000;
	padding-top:60px;
	height:auto;
}
#pn .wrap{
	background:#fff;
}
#pn img{
	display:block;
}
#pn .v li{
	float:left;
	width:25%;
	opacity: 0;
}
#pn .v li img{
	width:100%;
}

#pn .inner{
	color: #000;
	font-size:14px;
	line-height:1.78;
	margin:0 auto;
	padding:40px 0 20px;
	max-width:1180px;
}

#pn dt {
	color:#a50000;
	font-size:16px;
	padding:.15em 0;
}
#pn dt:before {
	content:'■';
	font-size:25px;
	margin-right:.25em;
}
#pn dd {
	padding-bottom:1em;
}
#pn dd ul {
	padding-top:1em;
}

#pn dd li {
	width:16.66666666666667%;
	float:left;
}
#pn dd li div{
	padding-bottom:65.98%;
	position:relative;
	overflow:hidden;
}
#pn dd li img{
	position:absolute;
	width:100%;
}

#pn.active .v li {
    opacity: 1;
    -webkit-transition: all .8s ease 0s;
    -moz-transition: all .8s ease 0s;
    -ms-transition: all .8s ease 0s;
    -o-transition: all .8s ease 0s;
    transition: all .8s ease 0s;
}

#pn.active .v li:nth-child(2) {
    -webkit-transition-delay: .2s;
    -moz-transition-delay: .2s;
    -ms-transition-delay: .2s;
    -o-transition-delay: .2s;
    transition-delay: .2s;
}
#pn.active .v li:nth-child(3) {
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -ms-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s;
}
#pn.active .v li:nth-child(4) {
    -webkit-transition-delay: .5s;
    -moz-transition-delay: .5s;
    -ms-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s;
}
