@charset "UTF-8";

#renewal2022 {
	z-index: 0;
}

#pankuzu {
	background: #fff;
}

.pagetop {
	position: fixed;
	right: 1.5em;
	bottom: 1.5em;
	z-index: 5;
}

#renewal2022 ul.attention {
	color: #fff;
	padding: 2vw 1.5em;
}

#renewal2022 ul.attention li {
	display: inline;
	padding-right: 0.5em;
}

.wrap-top-btn a {
	opacity: 1;
	background-color: transparent;
}

.wrap-top-btn a::after {
	display: none;
}

@media (min-width: 769px) {

	.wrap-top-btn {
		background: url(/lazona-kawasaki/campaign/beautyfair_2026/common/image/pagetop_o.png) no-repeat;
		background-size: contain;
	}

	.wrap-top-btn a img {
		width: 60px;
		transition: .3s;
	}

	.wrap-top-btn a:hover img {
		opacity: 0;
	}

	#renewal2022 ul.attention {
		padding: 2vw 35px;
	}

	.pagetop {
		width: 50px;
	}

	.secWrap {
		max-width: 1000px;
		margin-left: auto;
		margin-right: auto;
	}

}

@media (max-width: 769px) {

	#renewal2022 ul.attention {
		padding: 4.5vw 1.5em 3vw;
		font-size: 10px;
	}

	.secWrap {
		margin: 1.5em;
	}

	.pagetop {
		width: 15%;
		right: 0.5em;
		bottom: 6.5em;
	}

	footer {
		z-index: -1;
	}

}

/*  area_left(PC)
//////////////////////////////////////////////////// */

@media (min-width: 769px) {

	.area_left {
		height: 100%;
		width: 250px;
		margin-right: 75px;
	}

	.area_left h1 {
		position: sticky;
	}

	.area_left h1 img {
		transform: translateY( -50% );
		top: 50%;
		position: absolute;
	}

}

@media (max-width: 769px) {

	.area_left {
		display: none;
	}

}

/* area_navigation
//////////////////////////////////////////////////// */

@media (min-width: 769px) {

	.area_navigation {
		width: 300px;
		height: 100%;
	}

	.area_navigation nav {
		position: sticky;
		display: block;
		top: 0;
		margin-left: 75px;
		width: 200px;
	}

	.area_navigation nav dl {
		position: absolute;
		top: 25%;
		transform: translateY( -35% );
	}

	.area_navigation nav dl dt {
		margin: 40px 0 10px;
	}

	.area_navigation nav dl dd ul li {
		margin: -10px 0;
	}

}

@media (max-width: 769px) {

	.area_navigation {
		position: fixed;
		z-index: 9999;
		bottom: -100px;
		left: 0;
		width: 100%;
		transition: .3s;
	}

	.area_navigation.flex {
		bottom: 0;
	}

	.area_navigation ul {
		display: flex;
		justify-content: space-between;
	}

	.area_navigation ul li {
		background: #fff;
	}

	.area_navigation ul li:first-child {
	}

	.area_navigation ul li:last-child {
		margin-right: 0;
	}

}

/* area_center
//////////////////////////////////////////////////// */

.contentWrap01 {
	background: rgba( 255, 255, 255, 0.8 );
	overflow: hidden;
}

@media (min-width: 769px) {

	.area_center {
		max-width: 550px;
		width: 100%;
	}

	.contentWrap01 {
		padding: 0 30px 0 30px;
		box-shadow: 0px 0px 10px rgba( 255, 255, 255, 0.8 ), 0px 0px 10px rgba( 255, 255, 255, 0.8 ), 0px 0px 10px rgba( 255, 255, 255, 0.8 );
		margin: 50px 0;
	}

	.contentWrap01 h3 {
		padding-top: 50px;
	}

}

@media (max-width: 769px) {

	.area_center {
		width: 100%;
	}

	.contentWrap01 {
		box-shadow: 0px 0px 0.5em rgba( 255, 255, 255, 0.8 ), 0px 0px 0.5em rgba( 255, 255, 255, 0.8 ), 0px 0px 0.5em rgba( 255, 255, 255, 0.8 );
		padding: 0 1.5em;
		margin: 2em 0;
	}

	.contentWrap01 h3 {
		padding-top: 2em;
	}


}

/* 
//////////////////////////////////////////////////// */

#header {
	border-bottom: 0;
}



@media (min-width: 769px) {

	#header:before {
		background: url(/lazona-kawasaki/campaign/beautyfair_2026/common/image/head_title01_pc.png) no-repeat;
		background-size: contain;
		content: "";
		display: block;
		width: 100%;
	}

	#main {
		background-image: url(/lazona-kawasaki/campaign/beautyfair_2026/common/image/common_bg01_pc.png);
		background-position: top left;
		background-size: cover;
		background-attachment: fixed;
	}

	#header {
		background-color: transparent;
		z-index: 299;
		position: relative;
	}

	#header .secWrap {
		width: 100%;
		max-width: 100%;
		padding-bottom: 100px;
	}

	#header .secWrap h1 {
		margin: 0 auto 50px;
	}

	#header .secWrap h1 img {
		width: 100%;
	}

	#header p {
		position: absolute;
		top: 0;
		right: 0;
		width: 150px;
	}

	#renewal2022 #header ul {
		position: relative;
		display: flex;
		width: 100%;
		max-width: 1200px;
		margin: -110px auto 0;
		justify-content: space-between;
	}

	#header ul li {
		width: 48.5%;
	}

	.inner, .bg {
		display: none;
	}

}

@media (max-width: 769px) {

	.inner{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		clip-path: inset(0);
		z-index: -1;
	}

	.bg{
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		background: url(/lazona-kawasaki/campaign/beautyfair_2026/common/image/common_bg01_sp.png) repeat-y;
		background-size: cover;
		background-position: center;
		z-index: -1;
	}

/*
	#main {
		background: url(/lazona-kawasaki/campaign/beautyfair_2026/common/image/common_bg01_sp.png) repeat-y;
		background-size: 100%;
		background-attachment: fixed;
	}
*/

	#header {
		z-index: 99;
		background: transparent;
	}

	#header .secWrap {
		margin: 0;
		overflow: hidden;
	}

	#header ul {
		display: flex;
		justify-content: space-between;
		margin: -12em 1.5em 2.5em;
		flex-wrap: wrap;
	}

	#header ul li {
		width: 48.5%;
	}
}

/* content
//////////////////////////////////////////////////// */


@media (min-width: 769px) {

	.sec_title {
		margin: 0 0 50px;
	}

}

@media (max-width: 769px) {

	.sec_title {
		margin: 0 0 1.5em;
	}

}



/* event
//////////////////////////////////////////////////// */

.sec01 .secWrap dl {
	position: relative;
}

.sec01 .secWrap dl dt {
	display: block;
}

.sec01 .secWrap dl dd,
.sec01 .secWrap dl dd ul,
.sec01 .secWrap dl dd ul li {
	display: inline;
}

#renewal2022 .contentWrap01 ul#sec01_list {
	overflow: hidden;
}

#renewal2022 .sec01 .secWrap dl dd ul li a {
	display: block;
	position: absolute;
}

.sec01 .secWrap dl dd ul li a span {
	display: none;
}

#renewal2022 .sec01 .secWrap dl dd ul li.ev01 a { top: 12%; left: 13%; width: 85%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev02 a { top: 16%; left: 13%; width: 85%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev02-02 a { top: 30%; left: 2%; width: 9%; height: 1.7%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev03 a { top: 19.8%; left: 13%; width: 85%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev03-02 a { top: 31.7%; left: 2%; width: 9%; height: 2%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev04 a { top: 30%; left: 56%; width: 42%; height: 4.2%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev05 a { top: 34.2%; left: 56%; width: 42%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev06 a { top: 43.5%; left: 2%; width: 96%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev07 a { top: 47.5%; left: 56%; width: 42%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev08 a { top: 57%; left: 56%; width: 42%; height: 3.7%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev09 a { top: 60.7%; left: 56%; width: 42%; height: 4.3%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev10 a { top: 65%; left: 56%; width: 42%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev10-02 a { top: 84%; left: 2%; width: 96%; height: 1.5%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev10-03 a { top: 95%; left: 2%; width: 74%; height: 2.5%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev11 a { top: 74.5%; left: 2%; width: 96%; height: 4%; }
#renewal2022 .sec01 .secWrap dl dd ul li.ev12 a { top: 85.5%; left: 55%; width: 43%; height: 4.5%; }

@media (min-width: 769px) {

	.sec01 .secWrap h3,
	.sec01 .secWrap dl {
		margin: 50px 0;
	}

	#renewal2022 .sec01 .secWrap dl dd ul li a:hover {
		background: rgba( 255, 255, 255, 0.5 );
		opacity: 1;
	}

	#renewal2022 .sec01 .contentWrap01 {
		margin-top: 100px;
	}

	#renewal2022 .sec01 ul.accd_list li {
		margin-top: 30px;
	}

	#renewal2022 .contentWrap01 .more_btn {
		margin-top: 50px;
	}

}

@media (max-width: 769px) {

	.sec01 .secWrap h3,
	.sec01 .secWrap dl {
		margin: 1.5em 0;
	}

	#renewal2022 .sec01 ul.accd_list li {
		padding-top: 4.5em;
	}

	#renewal2022 .sec01 .contentWrap01 {
		margin-top: 4.5em;
	}

	#renewal2022 .contentWrap01 .more_btn {
		margin-top: 1.5em;
	}

}


/* 
sec02
//////////////////////////////////////////////////// */

.sec02 h2.sec_title {
	margin-bottom: 0;
}


.sec02 h2.sec_title + p {
	margin-top: 0;
}

@media (min-width: 769px) {

	.sec02 {
		padding-top: 50px;
	}

	.sec02 p {
		margin: 5px 0;
	}

	.sec02 p.first {
		margin-top: 50px;
	}

	.sec02 p.last {
		margin-bottom: 50px;
	}

}

@media (max-width: 769px) {

	.sec02 {
		padding-top: 1.5em;
	}

	.sec02 p {
		margin: 0.25em 0;
	}

	.sec02 p.first {
		margin-top: 2.5em;
	}

	.sec02 p.last {
		margin-bottom: 2.5em;
	}

}

/* 
sec03
//////////////////////////////////////////////////// */

#renewal2022 .sec03 ul.sec03_nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 95%;
}

#renewal2022 .sec03 ul.sec03_nav li {
	width: 31%;
	margin: 0 0.5%;
}

#renewal2022 ul.accd_list {
	overflow: hidden;
}


#renewal2022 ul.accd_list li img {
	transition: .3s;
	opacity: 0;
}

#renewal2022 ul.accd_list li.def img,
#renewal2022 ul.accd_list li.show_item img {
	height: auto;
	opacity: 1;
}

@media (min-width: 769px) {

	.sec03 {
		padding-top: 50px;
	}

	.sec03 h2.sec_title {
		margin-bottom: -70px;
	}

	#renewal2022 .sec03 ul.sec03_nav {
		margin: 30px auto 0;
	}

	#renewal2022 .sec03 ul.sec03_nav li {
		margin: 5px 0.5%;
	}

	#renewal2022 ul.accd_list li {
		padding: 60px 0 0;
	}

	#renewal2022 ul.accd_list li:nth-child(1) {
		padding-top: 40px;
	}

	#renewal2022 .sec03 .more_btn {
		padding-top: 50px;
	}

	#renewal2022 .sec04 .more_btn {
		padding-top: 50px;
	}

	#renewal2022 ul#gourmet_list03 {
		padding-bottom: 50px;
	}

}

@media (max-width: 769px) {

	.sec03 {
		padding-top: 1.5em;
	}

	.sec03 h2.sec_title {
		margin-bottom: -4em;
	}

	#renewal2022 .sec03 ul.sec03_nav {
		margin: 1.5em auto 0;
	}

	#renewal2022 .sec03 ul.sec03_nav li {
		margin: 0.5em 0.5%;
	}

	#renewal2022 ul.accd_list li {
		padding: 1.5em 0 0;
	}

	#renewal2022 .sec03 .more_btn {
		padding-top: 1.5em;
	}

	#renewal2022 .sec04 .more_btn {
		padding-top: 1.5em;
	}

	#renewal2022 ul#gourmet_list03 {
		padding-bottom: 2em;
	}
}

/* 
sec04
//////////////////////////////////////////////////// */


#renewal2022 .sec04 ul.sec04_nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 95%;
}

#renewal2022 .sec04 ul.sec04_nav li {
	width: 31%;
	margin: 0 0.5%;
}


@media (min-width: 769px) {

	.sec04 {
		padding-top: 50px;
	}

	.sec04 h2.sec_title {
		margin-bottom: -70px;
	}

	#renewal2022 .sec04 ul.sec04_nav {
		margin: 30px auto 0;
	}

	#renewal2022 .sec04 ul.sec04_nav li {
		margin: 15px 0.5%;
	}

}

@media (max-width: 769px) {

	.sec04 {
		padding-top: 1.5em;
	}

	.sec04 h2.sec_title {
		margin-bottom: -4em;
	}

	#renewal2022 .sec04 ul.sec04_nav {
		margin: 1.5em auto;
	}

	#renewal2022 .sec04 ul.sec04_nav li {
		margin: 0.5em 0.5%;
	}


}


/* 
sec05
//////////////////////////////////////////////////// */


@media (min-width: 769px) {

	.sec05 {
		padding-top: 50px;
	}

	#renewal2022 .sec05 ul li {
		margin: 30px 0;
	}

}

@media (max-width: 769px) {

	.sec05 {
		padding-top: 1.5em;
	}

	#renewal2022 .sec05 ul li {
		margin: 1em 0;
	}

}

/* 
sec06
//////////////////////////////////////////////////// */


@media (min-width: 769px) {

	.sec06 {
		padding: 50px 0 100px;
	}

	.sec06 h2.sec_title {
		margin-bottom: -70px;
	}


}

@media (max-width: 769px) {

	.sec06 {
		padding: 1.5em 0 2.5em;
	}

	.sec06 h2.sec_title {
		margin-bottom: -4em;
	}

}


/*  area_left(PC)
//////////////////////////////////////////////////// */

p._accd {
	width: 80%;
}

p._accd.selected {
}

p._accd a.open {
}

#renewal2022 p._accd.selected a.open,
#renewal2022 p._accd a.close {
	display: none;
}

ul.accd_list li {
	display: none;
	transition: .3s;
	opacity: 0;
	height: 0;
}

ul.accd_list li.def,
ul.accd_list li.show_item {
	display: block;
	opacity: 1;
	height: auto;
}

#renewal2022 p.more_btn {
	width: 75%;
}

#renewal2022 p.more_btn a.hide img.close_btn,
#renewal2022 p.more_btn a.selected img.open_btn {
	display: none;
}

@media (min-width: 769px) {

	#main {
	}

	.cpWrap {
		display: flex;
		justify-content: center;
	}

	p.more_btn {
		margin: 0 auto 50px;
	}

}

@media (max-width: 769px) {

	p.more_btn {
		margin: 0 auto 2em;
	}


}


@media (min-width: 769px) {

	.attention {
		padding: 50px 0;
	}

	.attention ul {
		font-size: 11px;
	}

}

@media (max-width: 769px) {

	.attention ul {
		font-size: 80%;
	}

}


/* fade
//////////////////////////////////////////////////// */

/*
#header h1.head_title {
	
	animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
	0% {opacity: 0; transform: translateY(300px);}
	100% {opacity: 1;transform: translateY(0px);}
}

*/