@charset 'UTF-8';

/* ■ 水着マルシェ
======================================================== */
.pc{
	display: block;
}
.sp{
	display: none;
}
.container{
	max-width: 1040px;
	padding: 0 20px;
	z-index: 2;
}
.container02{
	max-width: 940px;
	width: 100%;
	padding: 0 20px;
	margin: 0 auto;
}
section{
	padding: 50px 0 70px;
}
section.bg{
	position: relative;
}
	section.bg::before,
	section.bg::after{
		content: "";
		background: #F8EDB2;
		width: 100%;
		height: 600px;
		position: absolute;
		top: 0;
		left: 0;
	}
	section.bg::after{
		display: block;
		border-radius: 50%;
		width: 180px;
		height: 180px!important;
		transform: translateX(-50%);
		top: -20px;
		left: 50%;
	}
	section#area02.bg::before,
	section#area02.bg::after{
		background: #FFE2E8;
		height: 500px;
	}
	section#area03.bg::before,
	section#area03.bg::after{
		background: #C7E8D0;
		height: 530px;
	}
section .read{
	margin: 0 0 80px;
}


.title{
	margin: 0 0 25px;
	text-align: center;
}
.area_title{
	margin: 0 0 20px;
	text-align: center;
}

.titile_date{
	background: #FFF570;
	text-align: center;
	padding: 15px 20px;
}

.mv{
	position: relative;
}
.mv img{
	width: 100%;
}
	.mv .link{
		display: block;
		position: absolute;
		width: 11vw;
		height: 11vw;
		top: 6vw;
		left: 3vw;
	}

.mb50{
	margin-bottom: 50px;
}
/* .desc
------------------------------------------------ */
.desc *{
	text-align: center;
}
.desc{
	background: #D6F4F5;
}
.desc h2{
	color: #00B4D9;
	font-size: 22px;
	margin: 0 0 20px;
}
.desc .read{
	border-bottom: 1px solid #B8DFED;
	padding: 0 0 50px;
	margin: 0 0 50px;
}

/* ページ内ナビゲーション
------------------------------------------------ */
.page_nav{
	display: flex;
	/* justify-content: space-between; */
	justify-content: center;
	width: 90%;
	margin: 0 auto;
}
	.page_nav li{
		width: 31%;
		display: inline-block;
		margin: 0 5px;
	}

/* 共通
------------------------------------------------ */
.item_list > li{
	display: flex;
	align-items: center;
}
	.item_list > li:first-child{
		align-items: flex-start;
	}
	/* .item_list > li.mt{
		margin-top: -70px;
	} */
	.item_list > li.mt100{
		margin-top: 100px;
	}
	.item_list > li.mt30{
		margin-top: 30px;
	}
	.item_list > li.mt30_n{
		margin-top: -30px;
	}
	.item_list > li.mt100_n{
		margin-top: -100px;
	}
	.item_list > li:nth-child(odd) div.style_num{
		order: 1;
	}
	.item_list > li:nth-child(odd) div.txt_wrap{
		order: 2;
		margin-left: auto;
	}
	.item_list > li:nth-child(even) div.style_num{
		order: 2;
		margin-left: auto;
	}
	.item_list > li:nth-child(even) div.txt_wrap{
		order: 1;
	}
	.style_num{
		width: 46%;
		flex-shrink: 0;
	}
	.txt_wrap{
		width: 48%;
	}

	.item_list .txt{
		margin: 0 0 30px;
	}
	.item_list .item{
		padding-left: 25px;
		margin: 0 0 10px;
		color: #C4AE3E;
		position: relative;
	}
		.item_list .item::before{
			content: "";
			border-top: 1px solid #C4AE3E;
			width: 20px;
			position: absolute;
			transform: translateY(-50%);
			top: 50%;
			left: 0;
		}
	#area02 .item_list .item{
		color: #E6949E;
	}
		#area02 .item_list .item::before{
			border-color: #E6949E;
		}
	#area03 .item_list .item{
		color: #7AAD87;
	}
		#area03 .item_list .item::before{
			border-color: #7AAD87;
		}

.item_list > li .style_num{
	position: relative;
}
	.item_list > li .style_num::before{
		content: "";
		background: url(../img/mizugi_marche_2022/number_01.png) no-repeat center/contain;
		width: 76px;
		height: 73px;
		position: absolute;
		top: -45px;
		left: 0;
		z-index: 3;
	}
	.item_list > li:nth-child(2) .style_num::before{
		background: url(../img/mizugi_marche_2022/number_02.png) no-repeat center/contain;
	}
	.item_list > li:nth-child(3) .style_num::before{
		background: url(../img/mizugi_marche_2022/number_03.png) no-repeat center/contain;
	}
	.item_list > li:nth-child(4) .style_num::before{
		background: url(../img/mizugi_marche_2022/number_04.png) no-repeat center/contain;
	}
	.item_list > li:nth-child(5) .style_num::before{
		background: url(../img/mizugi_marche_2022/number_05.png) no-repeat center/contain;
	}

/* スライドカスタム */
.slick-prev,
.slick-next{
	background: #fff;
	width: 35px;
	height: 35px;
	z-index: 1;
	border-radius: 50%;
	border: 0.5px solid #333;
}
	.slick-prev:hover,
	.slick-next:hover
	{
		background: #fff;
		opacity: 0.5;
	}
	.slick-prev:focus,
	.slick-next:focus{
		opacity: 1;
		background-color: #fff;
	}
	.slick-prev{
		left: -17px;
	}
	.slick-next{
		right: -17px;
	}
	.slick-prev:before,
	.slick-next:before{
		display: block;
		content: "";
		width: 8px;
		height: 8px;
		border-top: 1px solid #333;
		border-right: 1px solid #333;
		opacity: 1;
		position: absolute;
		transform: translate(-80%, -50%) rotate(45deg);
		top: 50%;
		left: 50%;
	}
	.slick-prev:before{
		transform: translate(-25%, -50%) rotate(-135deg);
		/* left: auto;
		right: 13px; */
	}

.slick-dots{
	bottom: -20px;
}
	.slick-dots li{
		padding: 0;
		margin: 10px 5px;
		width: 8px;
		height: 8px;
	}
	.slick-dots li button:before{
		content: "";
		background: #D0D0D0;
		border-radius: 50%;
		width: 100%;
		height: 100%;
		opacity: 1;
	}
	.slick-dots li.slick-active button:before{
		background: #C4AE3E;
	}
	#area02 .slick-dots li.slick-active button:before{
		background: #E6949E;
	}
	#area03 .slick-dots li.slick-active button:before{
		background: #7AAD87;
	}
.slick-dots li button{
	width: auto;
	height: auto;
	padding: 0;
}

/* FLOOR INFORMATION
------------------------------------------------ */
.map_area{
	background: #D5EFEB;
}
	.map_area .title{
		margin: 0 0 35px;
	}


/* メイキング、MODEL PLOFILE
------------------------------------------------ */
.other_area{
	background: #FFEBEB;
}

.other_area .video{
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	margin: 0 0 80px;
}
	.other_area .video iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
	}

.profile{
	display: flex;
	align-items: center;
}
	.profile .photo{
		width: 340px;
		margin-right: 75px;
		flex-shrink: 0;
	}
	.profile .txt_area{
		flex: 1;
	}
	.profile .txt_area .name{
		font-size: 18px;
		font-weight: bold;
		margin: 0 0 10px;
	}
	.profile .txt_area ul{
		margin: 30px 0 0;
	}
	.profile .txt_area ul li{
		display: inline-block;
		margin-right: 20px;
		vertical-align: bottom;
	}
	.profile .txt_area ul li:nth-child(2){
		margin-right: 10px;
	}

/* 2021 */
.map{
	position: relative;
}
	.map .list li{
		position: absolute;
	}
	.map .list li:nth-child(1){
		top: 155px;
		left: 45px;
	}
	.map .list li:nth-child(2){
		top: 30px;
		right: -210px;
	}
	.map .list li:nth-child(3){
		bottom: 30px;
		right: 185px;
	}
	.map .list li a img{
		width: 50%;
	}

	.map_area.mobile{
		display: none;
	}
/* ■ 480px〜768px
======================================================== */
@media screen and (max-width: 768px) {
	.sp{
		display: block;
	}
	.pc{
		display: none;
	}
	section{
		padding: 30px 0 60px;
	}
		section.bg::before,
		section.bg::after{
			width: 100%;
			height: 530px;
		}
		section.bg::after{
			display: block;
			border-radius: 50%;
			width: 180px;
			height: 180px!important;
			transform: translateX(-50%);
			top: -20px;
			left: 50%;
		}
	section .read{
		margin: 0;
		font-size: 12px;
        line-height: 1.85;
        letter-spacing: 0.02em;
	}

	.title{
		margin: 0 0 20px;
	}
		.title img{
			width: 80%;
			margin: 0 auto;
		}
	.area_title{
		margin: 0 0 15px;
	}
		.area_title img{
			width: 45%;
			margin: 0 auto;
		}

	.titile_date{
		background: #FFF570;
		text-align: center;
		padding: 15px 20px;
	}

	.mv .link{
		width: 24.8vw;
		height: 24.8vw;
		top: 3vw;
		left: 3vw;
	}

	/* .slide_photo{
		display: none;
	}
	.slide_photo.slick-initialized{
		display: block; 
	} */
	.slick-prev{
		left: 0;
	}
	.mb50{
		margin-bottom: 30px;
	}
	/* .desc
	------------------------------------------------ */
	.desc h2{
		font-size: 16px;
		margin: 0 0 15px;
	}
	.desc .read{
		padding: 0 0 40px;
		margin: 0 0 40px;
		font-size: 12px;
	}

	/* ページ内ナビゲーション
	------------------------------------------------ */
	.page_nav{
		display: block;
		width: 100%;
		margin: 0 auto;
	}
		.page_nav li{
			width: 100%;
			margin: 0 auto;
		}
		.page_nav li:not(:last-child){
			margin: 0 0 10px;
		}

	/* 共通
	------------------------------------------------ */
	.item_list > li{
		display: block;
		margin-top: 70px!important;
	}
		.style_num{
			width: 100%;
			margin: 0 0 20px;
		}
		.txt_wrap{
			width: 100%;
		}

		.item_list .txt{
			margin: 0 0 20px;
			font-size: 12px;
			line-height: 1.85;
			letter-spacing: 0.02em;
		}
		.item_list .item{
			padding-left: 20px;
			font-size: 11px;
			margin: 0 0 5px;
			letter-spacing: 0.11em;
		}
			.item_list .item::before{
				width: 15px;
			}

			.item_list .fee{
				font-size: 11px;
				line-height: 1.82;
				letter-spacing: 0.02em;
			}

	.item_list > li .style_num::before{
		width: 53px;
		height: 51px;
		top: -30px;
	}


	/* FLOOR INFORMATION
	------------------------------------------------ */
	.map_area .title{
		margin: 0 0 35px;
	}
	.map_area .map{
		position: relative;
		margin: 0 3px 0 -15px;
	}


	/* メイキング、MODEL PLOFILE
	------------------------------------------------ */
	.other_area{
		background: #FFEBEB;
	}
	.other_area h2.title img{
		width: 100%;
	}
	.other_area .video{
		margin: 0 0 60px;
	}

	.profile{
		display: block;
	}
		.profile .photo{
			width: 230px;
			margin: 0 auto 20px;
		}
		.profile .txt_area{
			text-align: center;
		}
		.profile .txt_area .name{
			font-size: 14px;
			margin: 0 0 5px;
		}
		.profile .txt_area ul{
			display: inline-block;
			margin: 20px 0 0;
		}
		.profile .txt_area ul li{
			margin-right: 15px;
			width: 45px;
		}
		.profile .txt_area ul li:nth-child(2){
			margin-right: 5px;
		}
		.profile .txt_area ul li:last-child{
			width: 106px;
			margin: 0;
		}

	/* 2021 */
	.map .list li{
		width: 38.8%;
		margin-left: -19.4%;
	}
	.map .list li img{
		width: 100%;
		height: auto;
	}
	.map .list li:nth-child(1){
		top: 7%;
		left: 31%;
	}
	.map .list li:nth-child(2){
		top: 7%;
		left: 72%;
		right: auto;
	}
	.map .list li:nth-child(3){
		bottom: 4%;
		left: 50%;
		right: auto;
	}
	.map .list li a img{
		width: 100%;
	}
	/* .map_area{
		display: none;
	} */
	/* .map_area.mobile{
		display: block;
	} */

}
img[usemap] {
	border: none;
	height: auto;
  max-width: 100%;
	width: auto;
}