@charset "utf-8";
/* CSS Document */
/*====================================
Top
====================================*/
/* common
--------------------------------------*/
#top .top_sec_ttl .sec_ttl_icon,
#top .top_sec_ttl .sec_ttl,
#top .top_sec_ttl .sec_ttl_e{
	text-align: center;
}
#top .top_sec_ttl .sec_ttl_icon img,
#top .top_sec_ttl .sec_ttl,
#top .top_sec_ttl .sec_ttl_e{
	opacity: 0;
}
#top .top_sec_ttl .sec_ttl,
#top .top_sec_ttl .sec_ttl_e{
	transform: translateY(2.5rem);
}
#top .top_sec_ttl .sec_ttl_icon{
	width: 9.3rem;
	margin: 0 auto;
}
#top .top_sec_ttl .sec_ttl{
	font-size: 2.4rem;
}
#top .effect--flash_icon{
	position: relative;
	width: 9.3rem;
	height: 3.7rem;
	background-image: url(../img/top/flash-flames.png);
	background-size: auto 100%;
	background-repeat: no-repeat;
	background-position: top left;
}
#top .top_sec_ttl.is--scrolled .effect--flash_icon{
	animation: flash_icon_animation .72s steps(3) forwards;
	animation-delay: .3s;
}
#top .top_sec_ttl.is--scrolled .sec_ttl_icon img,
#top .top_sec_ttl.is--scrolled .sec_ttl,
#top .top_sec_ttl.is--scrolled .sec_ttl_e{
	opacity: 1;
}
#top .top_sec_ttl.is--scrolled .sec_ttl,
#top .top_sec_ttl.is--scrolled .sec_ttl_e{
	transform: translate(0);
	transition: opacity 1s ease-out, transform 1s ease-out;
}
#top .top_sec_ttl.is--scrolled .sec_ttl_icon img{
	transition: opacity 1s ease-out;
	transition-delay: .2s;
}
#top .top_sec_ttl.is--scrolled .sec_ttl{
	transition-delay: .35s;
}
#top .top_sec_ttl.is--scrolled .sec_ttl_e{
	transition-delay: .5s;
}

@keyframes flash_icon_animation {
  0% { background-position-x: 0; }
  100% { background-position-x: 100%; }
}

/* sec_main
--------------------------------------*/
#top .sec_main .blc_slide{
	position: relative;
}
#top .sec_main .slider_pagination{
	margin-top: 2rem;
}

@media screen and (max-width: 599px) {
	#main_slider .disp--pc{
		display: none;
	}
	#top .sec_main .slider_prev,
	#top .sec_main .slider_next{
		top: -3rem;
		width: 3rem;
		height: 6rem;
	}
	#top .sec_main .slider_prev:before,
	#top .sec_main .slider_next:before{
		width: 6rem;
		height: 6rem;
	}
	#top .sec_main .slider_prev:after{
		left: 30%;
	}
	#top .sec_main .slider_next:after{
		right: 30%;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_main .blc_slide{
		width: 120rem;
		margin: 0 auto;
	}
	#main_slider .disp--sp{
		display: none;
	}
	#main_slider a.main_item_inner img{
		transition: opacity .3s ease;
	}
	#main_slider a.main_item_inner:hover img{
		opacity: .7;
	}
	#top .sec_main .slider_prev{
		left: -2.5rem;
	}
	#top .sec_main .slider_next{
		right: -2.5rem;
	}
}

/* sec_bnr
--------------------------------------*/
#top .sec_bnr{
	padding-top: 5rem;
}
#bnr_slider .bnr_item_img{
	overflow: hidden;
	border-radius: 1rem;
}
#bnr_slider .bnr_item_ttl{
	margin-top: 2.4rem;
	font-size: 1.8rem;
	line-height: 1.66;
}
#bnr_slider .bnr_item_txt{
	color: #8B8B8B;
	font-size: 1.5rem;
	line-height: 1.73;
	margin-top: 0.5rem;
}

@media screen and (min-width: 600px) {
	#top .sec_bnr{
		overflow: hidden;
	}
	#top .sec_bnr .blc_slide{
		margin-left: -20.9rem;
		width: calc(100% + 41.8rem);
	}
	#bnr_slider .swiper-slide{
		width: 39.2rem;
	}
	#bnr_slider .bnr_item_ttl{
		margin-top: 3.4rem;
	}
	#bnr_slider .bnr_item_txt{
		margin-top: 1rem;
	}
	#bnr_slider .bnr_item_link:hover .bnr_item_ttl{
		text-decoration: underline;
	}
}

/* sec_news
--------------------------------------*/
#top .sec_news{
	padding-top: 8rem;
	padding-bottom: 11rem;
}
#top .sec_news .top_sec_ttl{
	margin-bottom: 4rem;
}
#top .sec_news .sec_ttl_icon img{
	padding-top: 0.4rem;
	width: 2.5rem;
}
#top .sec_news .sec_ttl{
	margin-top: 1.1rem;
	margin-bottom: 1.3rem;
}
#top .sec_news .sec_ttl_e img{
	width: 10.7rem;
}
#top .sec_news .blc_slide{
	position: relative;
}
#top .sec_news .news_item_inner{
	display: block;
}
#top .sec_news .news_item_img{
	overflow: hidden;
	border-radius: 1rem;
}
#top .sec_news .news_item_head{
	margin-top: 2.2rem;
	display: flex;
	justify-content: space-between;
}
#top .sec_news .news_item_cat{
	background-color: #333;
	color: #fff;
	font-size: 1.3rem;
	border-radius: 0.5rem;
	padding: 0.7rem;
}
#top .sec_news .news_item_date{
	font-size: 1.3rem;
	color: #8B8B8B;
}
#top .sec_news .news_item_date .new{
	color: #E5696A;
	padding-right: 0.5rem;
}
#top .sec_news .news_item_ttl{
	margin-top: 0.5rem;
	font-size: 1.8rem;
	line-height: 1.66;
}
#top .sec_news .slider_arrows{
	top: 10.7rem;
}
#top .sec_news .slider_prev,
#top .sec_news .slider_next{
	top: 0;
}
#top .sec_news .btn_archive{
	width: 29.4rem;
	margin: 4rem auto 0 auto;
}

@media screen and (max-width: 599px) {
	#top .sec_news .news_item_inner{
		width: 29.4rem;
		margin: 0 auto;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_news{
		padding-top: 10rem;
		padding-bottom: 13rem;
	}
	#top .sec_news .top_sec_ttl{
		margin-bottom: 7rem;
	}
	#top .sec_news .blc_slide{
		width: 120rem;
		margin: 0 auto;
	}
	#top .sec_news .news_item_head{
		margin-top: 2.5rem;
	}
	#top .sec_news .news_item_ttl{
		margin-top: 0.7rem;
	}
	#top .sec_news a:hover .news_item_ttl{
		text-decoration: underline;
	}
	#top .sec_news .slider_prev{
		left: -2.5rem;
	}
	#top .sec_news .slider_next{
		right: -2.5rem;
	}
	#top .sec_news .btn_archive{
		width: 32rem;
		margin-top: 9.5rem;
	}
}

/* sec_lineup
--------------------------------------*/
#top .sec_lineup{
	position: relative;
	padding-top: 8.1rem;
	padding-bottom: 20rem;
	background: url(../img/top/lineup-bg-sp.jpg) repeat-y top center;
	background-size: 100% auto;
}
#top .sec_lineup .bg_top_convex{
	position: absolute;
	pointer-events: none;
	width: 100%;
	height: 9.3rem;
	top: 0;
	left: 0;
	display: flex;
}
#top .sec_lineup .bg_top_convex img{
	display: block;
	width: 34.8rem;
}
#top .sec_lineup .bg_top_convex .bg{
	flex: 1;
	background-color: #fff;
	height: 100%;
}
#top .sec_lineup .top_sec_ttl{
	margin-bottom: 4rem;
}
#top .sec_lineup .sec_ttl_icon img{
	width: 3.6rem;
}
#top .sec_lineup .sec_ttl{
	margin-top: 1rem;
	margin-bottom: 1rem;
}
#top .sec_lineup .sec_ttl_e img{
	width: 5rem;
}
#top .sec_lineup .lineup_item{
	position: relative;
	display: block;
	box-sizing: border-box;
	border-radius: 1rem;
	width: 100%;
	height: 40.1rem;
	background-color: #fff;
	opacity: 0;
	transform: translateY(2.5rem);
}
#top .sec_lineup .lineup_item_inner{
	position: relative;
	overflow: hidden;
	border-radius: 1rem;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
#top .sec_lineup .lineup_item_inner:before,
#top .sec_lineup .lineup_item_inner:after{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	box-sizing: border-box;
}
#top .sec_lineup .lineup_item_inner:before{
	background-color: #E5696A;
	transform: rotate(45deg);
	width: 12.8rem;
	height: 12.8rem;
	bottom: -6.4rem;
	right: -6.4rem;
}
#top .sec_lineup .lineup_item_inner:after{
	width: 1.6rem;
	height: 1.6rem;
	border-top: solid 0.2rem #FFF;
	border-right: solid 0.2rem #FFF;
	transform: rotate(45deg);
	right: 2.2rem;
	bottom: 1.9rem;
}
#top .sec_lineup .lineup_item_ttl_e{
	position: absolute;
	pointer-events: none;
	left: -2.84rem;
	z-index: 2;
}
#top .sec_lineup .lineup_item_content{
	position: relative;
	z-index: 2;
}
#top .sec_lineup .lineup_item_img{
	width: 21.4rem;
	margin: 0 auto 3rem auto;
}
#top .sec_lineup .lineup_item_ttl{
	text-align: center;
	font-size: 1.8rem;
}
#top .sec_lineup .lineup_item_txt{
	color: #8B8B8B;
	text-align: center;
	font-size: 1.5rem;
	line-height: 1.46;
	margin: 1.3rem auto 0 auto;
	max-width: calc(100% - 3rem);
}
#top .sec_lineup .lineup_item_txt span{
	display: inline-block;
}

#top .sec_lineup .nail-tip-press-and-go .lineup_item_ttl_e{
	width: 25.169rem;
	top: -6.03rem;
}
#top .sec_lineup .nail-tip-reusable .lineup_item_ttl_e{
	width: 23.736rem;
	top: -5.67rem;
}
#top .sec_lineup .nail-item .lineup_item_ttl_e{
	width: 18.192rem;
	top: -4.33rem;
}
#top .sec_lineup .eyebrow .lineup_item_ttl_e{
	width: 16.422rem;
	top: -3.63rem;
}
#top .sec_lineup .mascara .lineup_item_ttl_e{
	width: 14.872rem;
	top: -1.38rem;
}
#top .sec_lineup .self-nail .lineup_item_ttl_e{
	width: 16.936rem;
	top: -3.78rem;
}

@media screen and (max-width: 599px) {
	#top .sec_lineup .lineup_list{
		width: 29.4rem;
	}
	#top .sec_lineup .lineup_item:not(:last-child){
		margin-bottom: 5rem;
	}
	#top .sec_lineup .lineup_item.is--scrolled{
		opacity: 1;
		transform: translate(0);
		transition: opacity 1s ease-out, transform 1s ease-out;
		transition-delay: .2s;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_lineup{
		padding-bottom: 26rem;
		background-image: url(../img/top/lineup-bg-pc.jpg);
		background-repeat: repeat;
		background-size: 200rem auto;
	}
	#top .sec_lineup .top_sec_ttl{
		margin-bottom: 0;
	}
	#top .sec_lineup .lineup_list{
		margin-top: 6rem;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	#top .sec_lineup .lineup_item{
		width: 36.4rem;
		height: 41.2rem;
	}
	#top .sec_lineup .lineup_item:not(:nth-child(3n)){
		margin-right: 5.4rem;
	}
	.browser--firefox #top .sec_lineup .lineup_item:not(:nth-child(3n)){
		margin-right: 5.3rem;
	}
	#top .sec_lineup .lineup_item:nth-child(n+4){
		margin-top: 7rem;
	}
	#top .sec_lineup .lineup_list.is--scrolled .lineup_item{
		opacity: 1;
		transform: translate(0);
		transition: opacity 1s ease-out, transform 1s ease-out;
		transition-delay: .2s;
	}
	#top .sec_lineup .lineup_list.is--scrolled .lineup_item:nth-child(2){
		transition-delay: .5s;
	}
	#top .sec_lineup .lineup_list.is--scrolled .lineup_item:nth-child(3){
		transition-delay: .8s;
	}
	#top .sec_lineup .lineup_list.is--scrolled .lineup_item:nth-child(4){
		transition-delay: 1.1s;
	}
	#top .sec_lineup .lineup_list.is--scrolled .lineup_item:nth-child(5){
		transition-delay: 1.4s;
	}
	#top .sec_lineup .lineup_list.is--scrolled .lineup_item:nth-child(6){
		transition-delay: 1.7s;
	}
	#top .sec_lineup .lineup_item_inner:before{
		width: 56rem;
		height: 56rem;
		bottom: -43.25rem;
		right: -43.5rem;
		transition: transform .3s ease;
	}
	#top .sec_lineup .lineup_item:hover .lineup_item_inner:before{
		transform: translate(-34rem, -36rem) rotate(45deg);
	}
	#top .sec_lineup .lineup_item_ttl_e{
		width: 25.169rem;
		top: -6.13rem;
		left: -2.94rem;
	}
	#top .sec_lineup .lineup_item_img{
		width: 24.4rem;
		margin-bottom: 2.5rem;
	}
	#top .sec_lineup .lineup_item_ttl,
	#top .sec_lineup .lineup_item_txt{
		transition: color .25s ease;
	}
	#top .sec_lineup .lineup_item:hover .lineup_item_ttl,
	#top .sec_lineup .lineup_item:hover .lineup_item_txt{
		color: #fff;
	}
	
	#top .sec_lineup .nail-tip-reusable .lineup_item_ttl_e{
		width: 23.736rem;
		top: -5.75rem;
	}
	#top .sec_lineup .nail-item .lineup_item_ttl_e{
		width: 18.192rem;
		top: -4.52rem;
		left: -2.84rem;
	}
	#top .sec_lineup .eyebrow .lineup_item_ttl_e{
		width: 16.422rem;
		top: -3.83rem;
		left: -3.04rem;
	}
	#top .sec_lineup .mascara .lineup_item_ttl_e{
		width: 14.872rem;
		top: -1.6rem;
		left: -2.36rem;
	}
	#top .sec_lineup .self-nail .lineup_item_ttl_e{
		width: 16.936rem;
		top: -4rem;
		left: -3.16rem;
	}
}

/* sec_sns
--------------------------------------*/
#top .sec_sns{
	position: relative;
	padding-bottom: 10rem;
}
#top .sec_sns:before{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	width: 34.6rem;
	height: 9.3rem;
	background: url(../img/top/sns-top-convex-bg.png) no-repeat top center;
	background-size: contain;
	top: -9.25rem;
	left: calc(50% - 17.3rem);
}
#top .sec_sns .top_sec_ttl{
	position: relative;
	top: -1.1rem;
	margin-bottom: 7rem;
}
#top .sec_sns .sec_ttl_icon img{
	width: 2.8rem;
}
#top .sec_sns .sec_ttl{
	margin-top: 0.6rem;
	margin-bottom: 0.9rem;
}
#top .sec_sns .sec_ttl_e img{
	width: 8.4rem;
}
#top .sec_sns .blc_movie{
	background:
		url(../img/top/sns-movie-bg-l-sp.png) no-repeat left 6.3rem,
		url(../img/top/sns-movie-bg-r-sp.png) no-repeat right 8.1rem;
	background-size: 8.7rem auto, 8.4rem auto;
}
#top .sec_sns .blc_movie .blc_ttl_wrap{
	margin-bottom: 1.5rem;
}
#top .sec_sns .blc_movie .ttl_line1{
	text-align: center;
	margin-bottom: 1rem;
}
#top .sec_sns .blc_movie .ttl_line1 .ttl_txt{
	display: inline-block;
	position: relative;
	padding: 0 1.7rem;
	font-size: 1.5rem;
}
#top .sec_sns .blc_movie .ttl_line1 .ttl_txt:before,
#top .sec_sns .blc_movie .ttl_line1 .ttl_txt:after{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	width: 0.1rem;
	height: 2rem;
	top: -0.3rem;
	background-color: #000;
}
#top .sec_sns .blc_movie .ttl_line1 .ttl_txt:before{
	left: 0.3rem;
	transform: rotate(-23deg)
}
#top .sec_sns .blc_movie .ttl_line1 .ttl_txt:after{
	right: 0.3rem;
	transform: rotate(23deg)
}
#top .sec_sns .blc_movie .ttl_line2{
	display: flex;
	align-items: center;
}
#top .sec_sns .blc_movie .ttl_line2 .icon{
	width: 3.4rem;
	margin-right: 1rem;
}
#top .sec_sns .blc_movie .ttl_line2 .ttl_txt{
	font-size: 1.8rem;
}

@media screen and (max-width: 599px) {
	#top .sec_sns .blc_movie .blc_ttl{
		margin-bottom: 1.5rem;
	}
	#top .sec_sns .blc_movie .ttl_line2{
		justify-content: center;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_sns{
		padding-bottom: 15.7rem;
	}
	#top .sec_sns .top_sec_ttl{
		margin-bottom: 4rem;
	}
	#top .sec_sns .blc_movie{
		background-image: url(../img/top/sns-movie-bg-l-pc.png), url(../img/top/sns-movie-bg-r-pc.png);
		background-position: left 5.8rem, right 10.7rem;
		background-size: 17.7rem auto, 15.7rem auto;
	}
	#top .sec_sns .blc_movie .blc_ttl_wrap,
	#top .sec_sns .blc_movie .box_movie{
		width: 87.1rem;
	}
	#top .sec_sns .blc_movie .blc_ttl_wrap{
		box-sizing: border-box;
		padding-left: 6.4rem;
		margin-bottom: 2.5rem;
		display: flex;
		align-items: flex-end;
	}
	#top .sec_sns .blc_movie .blc_ttl_wrap .lead_txt{
		line-height: 1;
		margin-left: 3rem;
		padding-bottom: 0.5rem;
	}
}

#top .sec_sns .blc_insta{
	position: relative;
	padding-top: 10rem;
	padding-bottom: 10rem;
	background:
		url(../img/top/sns-insta-bg-l-sp.png) no-repeat left 8.5rem,
		url(../img/top/sns-insta-bg-r-sp.png) no-repeat right 8.8rem;
	background-size: 11.6rem auto, 8.2rem auto;
}
#top .sec_sns .blc_insta:before{
	content: '';
	display: block;
	position: absolute;
	pointer-events: none;
	background: url(../img/top/sns-insta-bg-sp.jpg) repeat-y center top;
	background-size: 100% auto;
	width: 100%;
	height: calc(100% - 70.8rem);
	top: 70.8rem;
	left: 0;
}
#top .sec_sns .blc_insta .blc_inner{
	position: relative;
}
#top .sec_sns .blc_insta .blc_ttl{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 2.5rem;
}
#top .sec_sns .blc_insta .blc_ttl .icon{
	width: 2.4rem;
	height: 2.4rem;
}
#top .sec_sns .blc_insta .blc_ttl .icon svg{
	width: 100%;
	height: 100%;
}
#top .sec_sns .blc_insta .blc_ttl .icon path{
	fill: #000;
}
#top .sec_sns .blc_insta .blc_ttl .ttl_txt{
	font-size: 1.8rem;
	margin-left: 0.8rem;
}
#top .sec_sns .blc_insta .box_btn{
	margin-bottom: 5rem;
}
#top .sec_sns .blc_insta .box_btn .btn{
	width: 24rem;
	height: 5rem;
	font-size: 2rem;
	margin: 0 auto;
}
#top .sec_sns .blc_insta .box_btn .btn:after{
	display: none;
}
#top #sbi_images{
	display: flex !important;
	flex-wrap: wrap !important;
}
#top #sbi_images .sbi_item{
	display: block !important;
	width: calc((100% - 2.2rem) / 2) !important;
	overflow: hidden !important;
	border-radius: 1rem !important;
}

@media screen and (max-width: 599px) {
	#top #sbi_images{
		justify-content: space-between !important;
	}
	#top #sbi_images .sbi_item:nth-child(n+3){
		margin-top: 2.2rem !important;
	}
}

@media screen and (min-width: 600px) {
	#top .sec_sns .blc_insta{
		padding-top: 13.2rem;
		padding-bottom: 13rem;
		background-image: url(../img/top/sns-insta-bg-l-pc.png), url(../img/top/sns-insta-bg-r-pc.png);
		background-position: left 2.5rem, right top;
		background-size: 26.3rem auto, 15.6rem auto;
	}
	#top .sec_sns .blc_insta:before{
		background-image: url(../img/top/sns-insta-bg-pc.jpg);
		height: calc(100% - 42rem);
		top: 42rem;
	}
	#top .sec_sns .blc_insta .blc_ttl{
		margin-bottom: 2.5rem;
	}
	#top .sec_sns .blc_insta .box_btn{
		margin-bottom: 8rem;
	}
	#top #sbi_images .sbi_item{
		width: calc((100% - 12rem) / 5) !important;
		background-color: #fff !important;
	}
	#top #sbi_images .sbi_item:not(:nth-child(5n)){
		margin-right: 3rem !important;
	}
	.browser--firefox #top #sbi_images .sbi_item:not(:nth-child(5n)){
		margin-right: 2.9rem !important;
	}
	#top #sbi_images .sbi_item:nth-child(n+6){
		margin-top: 3rem !important;
	}
	#top #sbi_images .sbi_item img{
		transition: opacity .3s ease !important;
	}
	#top #sbi_images .sbi_item:hover img{
		opacity: .7 !important;
	}
}

/*===============================

===============================*/
/*
--------------------------------------*/
@media screen and (max-width: 599px) {
}

@media screen and (min-width: 600px) {
}