@charset "utf-8";


/* top */
h2{width: 95%; max-width: 924px; margin: 0 auto; padding: 180px 0  5% 0;}

.main-gallery-list-top{width: 95%; max-width: 1500px; margin: 0 auto; padding-bottom: 10%;}
.main-gallery-list-top ul{justify-content: center;}
.main-gallery-list-top li{width: 32%; padding:0.5% 0.5% 2.5% 0.5%; opacity: 0; animation-name: fade-inanime; animation-duration: 1s; animation-fill-mode: forwards; position: relative;}

.sub-gallery-list{width: 95%; max-width: 1500px; margin: 0 auto; padding:10% 0 5% 0;}
.sub-gallery-list ul{justify-content: center;}
.sub-gallery-list li{width: 19%; padding:0.5%; opacity: 0; animation-name: fade-inanime; animation-duration: 1s; animation-fill-mode: forwards;}

.main-gallery-list-top li a:hover,
.sub-gallery-list li a:hover{filter: contrast(140%);}

.gallery-top-bg{background:url(../img/common/cont-common-bg.jpg) top center no-repeat; -moz-background-size:100% auto; background-size:100% auto; background-attachment:fixed; animation-name: fade-inanime; animation-duration: 2s;}



.ss-img-box{width: 100%; max-width: 1500px; margin: 0 auto; padding-top:45px;}
.ss-title{color: #605d78; padding:2px 0;}

.main-gallery-list-top ul li:nth-child(1) { animation-delay: 0.15s;}
.main-gallery-list-top ul li:nth-child(2) { animation-delay: 0.3s;}
.main-gallery-list-top ul li:nth-child(3) { animation-delay: 0.45s;}
.main-gallery-list-top ul li:nth-child(4) { animation-delay: 0.6s;}
.main-gallery-list-top ul li:nth-child(5) { animation-delay: 0.75s;}
.main-gallery-list-top ul li:nth-child(6) { animation-delay: 0.9s;}
.main-gallery-list-top ul li:nth-child(7) { animation-delay: 1.05s;}
.main-gallery-list-top ul li:nth-child(8) { animation-delay: 1.2s;}
.main-gallery-list-top ul li:nth-child(9) { animation-delay: 1.35s;}

.gallery-txt-bg{width: 95%; max-width: 1500px; background-color:rgba(255,255,255,0.65); padding:2% 0 5% 0; margin: 5% auto 0 auto;}

@media screen and (max-width: 700px) {
h2{width: 95%; max-width: 924px; margin: 0 auto; padding: 30% 0  5% 0;}

.gallery-top-bg{background:url(../img/common/cont-common-bg.jpg) top center no-repeat; -moz-background-size:150% auto; background-size:150% auto;  background-attachment:fixed; }
.main-gallery-list-top li{font-size: 2vw;}
.gallery-txt-bg{width: 100%; max-width: 1500px;}

.sub-gallery-list li{width: 32%; padding:0.5%; opacity: 0;}

}



.gallery-txt-full{width: 95%; max-width: 1100px; margin: 0 auto; padding:3% 0 0 0;}
.gallery-txt{width: 95%; max-width: 1100px; margin: 0 auto; padding:3% 0 0 0; display: -webkit-flex; display: flex;}
.gallery-txt dt{width: 80px;}
.gallery-txt dt.long{width: 110px;}
.gallery-txt dd{-webkit-flex: 1; flex: 1;}
.gallery-txt, .gallery-txt-full{color: #605d78; font-size: 18px; line-height:1.61;}


@media screen and (max-width: 700px) {
.gallery-txt, .gallery-txt-full{font-size: 3vw;}

.gallery-txt dt{width: 60px;}
.gallery-txt dt.long{width: 80px;}
.gallery-txt-bg{ margin: 2% auto 0 auto;}
}



.namecolor00 dt{color:#f781a7;}
.namecolor01 dt{color:#b8962b;}
.namecolor02 dt{color:#782e78;}
.namecolor03 dt{color:#fe9832;}
.namecolor04 dt{color:#56c6f4;}
.namecolor05 dt{color:#bf284f;}
.namecolor06 dt{color:#4c8c4c;}
.namecolor07 dt{color:#e10c8a;}
.namecolor08 dt{color:#d671d0;}
.namecolor09 dt{color:#007657;}

.namecolor10 dt{color:#3b7a5e;}
.namecolor11 dt{color:#06b5bf;}
.namecolor12 dt{color:#3e68d5;}


.new-icon{
	width: 20%;
	position: absolute; 
	top:-10px;
	left:-10px;
	-webkit-animation:blink 1.5s ease-in-out infinite alternate;
    -moz-animation:blink 1.5s ease-in-out infinite alternate;
    animation:blink 1.5s ease-in-out infinite alternate;
}

.btn-top { width: 60%; max-width: 280px; margin: 0 auto; padding: 5% 0 2% 0;}
.btn-top a img:hover{filter: contrast(140%);}

@media screen and (max-width: 700px) {
.new-icon{ width: 15%;
	top:-1%;
	left:-1%;
}
}




/* anime */

@keyframes fade-inanime {
    0% {opacity: 0;}
    100% {opacity: 1;}
}


/* starfestival */

.starfestival-bg{background:#191d3d;}
.starfestival-header{width: 100%; margin: 0 auto;}
.starfestival-header img{width: 100%;}
.starfestival-txt-bg{}
.starfestival-txt-bg .gallery-txt, .starfestival-txt-bg .gallery-txt-full{color: #fff;}
.starfestival-title{font-size: 5vw; color: #fff;}
.starfestival-title2{font-size: 3vw; color: #fff; text-align: center;}
.starfestival-item li{width: 10.5%; padding:1%;}
.starfestival-banner{width: 90%; max-width: 600px; margin: 0 auto; padding:5% 0;}

@media screen and (max-width: 700px) {
.starfestival-item li{width: 12.2%; padding:1%;}
}