/* CSS Document */

#main{
	height: 100%;
	position: relative;
	box-sizing: border-box;
}

#main h2 , #main .overlay , #main .btn{position: absolute;}
#main .slider{ position: fixed;}
#main h2{ z-index: 2; font-size: 4.8rem; color: #fff; text-align: center; top: 50%; width: 100%; text-shadow:0 0 1rem rgba(0,0,0,0.2);}
#main .btn{ z-index: 2; top: 50%; margin-top: 12rem; font-size: 1.8rem; border: none; box-shadow:0 0 1rem rgba(0,0,0,0.2); width: 30rem; left: 50%; margin-left: -15rem;}
#main .overlay{
	width: 100%;
	height: 100%;
	background:rgba(0,0,0,0.3);
	position: absolute;
	z-index: 2;
	display: none;
}


#main .slider{
	position: fixed;
	z-index: 1;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

#main .slider .cap , #main .slider .cap figure{
	width: 100%;
	height: 100%;
}

#main .slider .cap figure{ background-size: cover;}


.slick-track , .slick-list{height: 100%;}
.slider .cap, .slider {
    height: 100vh;
}
.slider:after {
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.cap figure {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    z-index: 1;
    -webkit-transition: .5s;
    transition: .5s;
	filter:alpha(opacity=.75);
	-ms-filter: "alpha(opacity=75)";
	-moz-opacity:.75;
	-khtml-opacity:.75;
	opacity:.75;
}
.slick-slide img.sp-only{ display: none;}


#top #pickup{ z-index: 3; text-align: center; position: relative;}
#top #pickup .wrap-box{ top: -4rem; position: relative; margin-bottom: -4rem;}
#top #pickup li { width: 24%; text-align: center; background: #fff; border-radius: 1rem; box-shadow:0 0 2rem rgba(0,0,0,0.1);}
#top #pickup li figure{ padding-top: 75%; background-size: cover; background-position: center; border-radius: 1rem 1rem 0 0;}
#top #pickup li h3{ font-size: 1.8rem; padding: 2rem 1rem; position: relative; line-height: 1;}
#top #pickup li h3 svg{ height: 1.2rem; fill:#FF8066; right:2rem; position: absolute; top: 50%; margin-top: -.4rem; -webkit-transition: .4s; transition: .4s;}
#top #pickup li a:hover h3 svg{ right:1.5rem; }

#top #news li{ border-bottom: .2rem dotted #FF8066; padding-bottom: 2rem; margin-bottom: 2rem;}

#top #news.wrap-box{ align-items: center;}
#top #news .title{ width: 30%; text-align: center;}
#top #news .title h2{ font-size:2.4rem; margin-bottom: 2rem; padding: 0; display: block; line-height:1; line-height: 3.6rem; }
#top #news .title h2:before , #top #news .title h2:after{ display: none;}
#top #news .title .btn{ height: inherit; width: 11rem; font-size: 1.3rem; padding:.5rem 1rem .8rem; box-sizing: border-box; min-width: inherit;}
#top #news ul{ width: 70%;}
#top #news li:last-child{ margin-bottom: 0; padding-bottom: 0; border: none;}
#top #news li .tag{ color:#fff; font-size:1.2rem; padding: .5rem 1rem; width:14rem; text-align: center; box-sizing: border-box; display: inline-block; border-radius: 10rem; margin: 0 1.5rem; line-height: 2rem; background: #EDC25F;}
#top #news li .news03{ background: #ED2F00;}
#top #news li .news02 , #top #news li .news01{ background: #EDC25F;}
#top #news.box{ margin-bottom: 0;}
#top .bgPink { position: relative;}
#top .bgPink img{ width: 27rem; left: 3rem; height: auto; position: absolute; bottom: -8rem; }

#top #point .wrap-box { margin-bottom: 6rem;}
#top #point .wrap-box li { width: 33%; background: #FFF9F7; border-radius: 2rem; position: relative;}
#top #point .wrap-box li figure{ background-size:cover; background-repeat: no-repeat; padding-top: 75%; position: relative; border-radius: 2rem 2rem 0 0; }
#top #point .wrap-box li figure figcaption{ position: absolute; top: -2rem; right: 1rem; width: auto; height: 9rem;}
#top #point .wrap-box li figure figcaption img{ height: 100%; width: auto;}
#top #point .wrap-box li dl{ padding: 3rem 2rem 6rem;}
#top #point .wrap-box li dt{ color:#FF8066; font-size: 2rem; margin-bottom: 2rem; text-align: center;}
#top #point .wrap-box li dd{ font-size:1.5rem; text-align: left;}
#top #point .wrap-box li a.link{ margin: 0; position: absolute; bottom: 2rem; right: 2rem; display: inline-block;}

#top #illust02{ width: 100%; background: url(../images/top/illust02.png) right top no-repeat; background-size: 39.9rem; padding-top: 12rem; margin-top: -12rem; }
#top #album .wrap-box { justify-content: flex-start; margin-bottom: 6rem;}
#top #album .wrap-box li{ width: 20%; padding:.1rem; box-sizing: border-box;}
#top #album .wrap-box li figure{ background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 100%;}
#top #album .btn svg.insta{ fill:#FF8066; position: absolute; left: 2rem; top: 50%; margin-top: -1rem; fill:#FF8066; -webkit-transition: .4s; transition: .4s; }
#top #album .btn:hover svg.insta{ fill:#fff;}
#top #album .wrap-box li:last-child , #top #album .wrap-box li:nth-last-child(2){ display: none;}


@media screen and ( max-width:768px) {
#main .slider .cap figure{ background-image: none !important;}
#main h2 { font-size: 3.6rem; line-height: 4.8rem; margin-top: -7rem;}
#main .btn { font-size: 1.2rem; width: 20rem; padding: 1.2rem 0; height: auto; margin-top:6rem; margin-left: -10rem;}
.slick-slide img.sp-only{ display:inherit;}
#top #pickup .wrap-box { top: -2rem; margin-bottom: -2rem; }
#top #pickup li { width: 48.5%; border-radius: 1rem; margin-bottom: 1rem; }
#top #pickup li h3 svg { width: .5rem; height: 1rem; right: 1.2rem; margin-top: -.5rem; }
#top #pickup li h3 { font-size: 1rem; padding: 1.2rem 0; }
#top .bgPink img { width: 13rem; left: 1rem; bottom: inherit; top: -3rem;}

#top #news .title , #top #news ul { width: 100%; }
#top #news .title .btn{ display: none;}
#top #news .title{ margin-bottom:2rem;}
#top #news li .tag { font-size: 1rem; padding: 0; width: 12rem; margin: 0 1rem;}
#top #news li a:not(.tag) { display: block; margin-top: .5rem;}
#top #news li { padding-bottom: 1.5rem;}
#top #news li:last-child{ border-bottom: .2rem dotted #FF8066; padding-bottom: 1.5rem; margin-bottom: 2rem; }
#top #news .title, #top #news ul { margin-bottom: 2rem; }
#top #news .btn{ width: auto; min-width: inherit; height: auto; padding: .5rem 3rem; text-align: center; display: block;}	
	
#top #point .wrap-box li { width: 100%; border-radius: 1rem; margin-bottom: 2rem; padding-bottom: 4rem;}
#top #point .wrap-box li dt { font-size: 1.5rem; margin-bottom: 1.5rem; }
#top #point .wrap-box li dl { padding: 2rem; }
#top #point .wrap-box li dd { font-size: 1.2rem; text-align: left; }
#top #point .wrap-box li a.link { margin: 0; }
#top #point .wrap-box li figure figcaption { top: -1rem; height: 6.8rem; }
#top #point .wrap-box { margin-bottom: 2rem; }
#top #point.box {  margin: 0 5% 4rem; }
	
#top #illust02 { background-size: 18rem; margin-top: 0; padding-top: 8rem; }

#top #album .wrap-box li { width: 25%;}
#top #album .wrap-box { margin-bottom: 4rem; }
#top #album .wrap-box li:last-child , #top #album .wrap-box li:nth-last-child(2){ display: block;}
	
	
	
	
	
	
	
	
}















