@charset "UTF-8";
/*================
access.css
================*/

:root{
    --blue: #19767A;
}
.page_title{color: var(--blue); font-family: "EB Garamond", serif; font-size: 5.5rem; padding-top: 90px; margin-bottom: 30px; }
.page_title::before{background: var(--blue); width: 2px; height: 80px;}
.mainvisual_lead{padding: 50px 0 100px;}

.page_anchorlink_wrap{padding: 10px 20px 20px;}
.page_anchorlink_wrap ul{border: none;}
.page_anchorlink_wrap ul li a{background: #DFE7EC;}
.page_anchorlink_wrap ul li.active a{background: #007EA1;}

@media screen and (max-width: 640px){
	.page_title{font-size: 2.2rem; padding-top: 40px;}
	.page_title::before{height: 40px;}
	.mainvisual_lead{padding: 30px 0;}

	.page_anchorlink_wrap{padding: 10px 0 20px;}
}

/* parts */
.location_lead{text-align: center; padding: 30px 0; margin: 0 0 50px;}
.location_lead h2{font-family: var(--font_serif); font-size: 4.2rem; font-weight: 500; letter-spacing: 2px; margin: 0 0 20px;}

@media screen and (max-width: 960px){
	.location_lead h2{font-size: 3.0rem;}
	.location_lead h2 + p{font-size: 1.8rem;}
}
@media screen and (max-width: 640px){
	.location_lead{padding: 0;}
	.location_lead h2{font-size: 2.5rem;}
	.location_lead h2 + p{text-align: left;}
}

.location_item + .location_item{padding-top: 80px;}
.location_itemTitle{font-family: var(--font_serif); font-size: 3.0rem; font-weight: 600; text-align: center; margin: 0 0 45px;}

.location_lineup{margin: 0 -15px;}
.location_lineup.col_4 .location_box{width: calc(100% / 4);}
.location_lineup.col_3 .location_box{width: calc(100% / 3);}
.location_lineup.col_2 .location_box{width: calc(100% / 2);}
.location_box{padding: 0 15px;}
.location_lineup .location_box figure{}
.location_lineup .location_box figure + p{font-size: 1.6rem; margin: 8px 0 0;}
.location_lineup .location_box figure + p span{display: block;}

.location_bigImage{align-items: center;}
.bigImage_img{width: 720px; position: relative;}
.bigImage_img figure + p{position: absolute; bottom: 0; left: 0; transform: translateY(100%) translateY(5px);}
.bigImage_text{width: calc(100% - 720px); padding-left: 50px}

.location_bigImage + .location_lineup{margin-top: 80px;}


@media screen and (max-width: 1200px){
	.bigImage_img{width: 400px;}
	.bigImage_text{width: calc(100% - 400px); padding-left: 30px}
}
@media screen and (max-width: 640px){
	.location_item + .location_item{padding-top: 50px;}
	.location_itemTitle{font-size: 2.2rem; margin: 0 0 25px;}

	.location_lineup{margin: 0;}
	.location_lineup.col_4 .location_box{width: 100%;}
	.location_lineup.col_3 .location_box{width: 100%;}
	.location_lineup.col_2 .location_box{width: 100%;}
	.location_box{padding: 0;}
	.location_box + .location_box{margin-top: 30px;}

	.bigImage_img{width: 100%;}
	.bigImage_img figure{margin: 0 -15px;}
	.bigImage_img figure + p{position: static; transform: translateY(0); margin-top: 5px;}
	.bigImage_img figure + p span{display: block;}
	.bigImage_text{width: 100%; padding-left: 0; margin-top: 20px;}

	.location_bigImage + .location_lineup{margin-top: 40px;}
}

.access_title h3{font-family: "EB Garamond", serif; text-align: center; color: #19767A; font-size: 5.5rem; font-weight: 500;}
.annotation p{font-size: 1.2rem;}

@media screen and (max-width: 640px){
	.access_title h3{font-size: 3.0rem;}
}


/* shop_mainArea */
#shop_mainArea{margin: 0 0 50px;}
.shop_mainImage{width: 100%; max-width: 800px; margin: 0 auto 30px;}
.shop_mainImage p{font-size: 2.0rem; margin: 8px 0 0;}

.shop_floorMap_wrap{background: #FFE6D8; padding: 40px 60px; margin: 30px 0 0;}
.shop_floor_image{}
.shop_floorBox{width: calc(100% / 3);}
.shop_floorMap_illust{background: #fff; text-align: center; padding: 40px;}
.shop_floorMap_illust figure,
.shop_floorMap_illust figure img{width: 100%;}

@media screen and (max-width: 640px){
.shop_mainImage figure{margin: 0 -15px;}
.shop_mainImage p{font-size: 1.6rem;}

.shop_floorMap_wrap{padding: 20px; margin: 30px -15px 0;}
.shop_floorMap_illust{padding: 15px;}

}

/* park_content */
#park_content{position: relative; padding: 60px 0;
	background: url(../../img/pages/access/location/park_back.png) repeat-y center top; background-size: 100%;}
#park_content .park_deco01{position: absolute; left: 0; top: -50px; max-width: 220px;}
#park_content .park_deco02{position: absolute; right: 0; bottom: -50px; max-width: 220px; z-index: 2;}

.park_bigImage{padding: 0 50px; align-items: center;}
.park_bigImage_text .text{margin: 40px 0; text-align: center;}

.park_lineup{margin: 0;}
.park_lineup .location_box{padding: 0;}
.park_bigImage_column .column_list{display: none;}

@media screen and (min-width: 641px){
	.park_bigImage_column{background: #fff; padding: 40px; display: flex; flex-wrap: wrap; flex-direction: row-reverse; justify-content: space-between; position: relative;}
	.park_bigImage_column::before{content: ""; position: absolute; top: -30px; left: -30px;
		display: block; width: 160px; height: 160px;
		background: url(../../img/pages/access/location/park_deco01_pc.png) no-repeat center center; background-size: contain;
	}
	.park_bigImage_column::after{content: ""; position: absolute; bottom: -30px; right: -30px;
		display: block; width: 160px; height: 160px;
		background: url(../../img/pages/access/location/park_deco02_pc.png) no-repeat center center; background-size: contain;
	}
	.park_bigImage_column .column_content{width: calc(53% - 20px);}
	.park_bigImage_column .column_content .img_cap{font-size: 1.4rem; text-align: center; margin: 10px 0 0;}
	.park_bigImage_column .column_list{width: calc(47% - 20px); display: flex; flex-wrap: wrap;}
	.park_bigImage_column .column_list li{width: calc(100% / 2); padding: 2px;}
}


@media screen and (max-width: 1200px){
	.park_bigImage{padding: 0 30px;}
}
@media screen and (max-width: 640px){
	#park_content{padding: 30px 0 60px;}
	#park_content .park_deco01{max-width: 30vw; top: -10vw;}
	#park_content .park_deco02{max-width: 30vw; bottom: -10vw;}

	.park_bigImage{padding: 0;}
	.park_bigImage_img{width: 100%; margin: 0 0 30px;}
	.park_bigImage_text{width: 100%; padding-left: 0;}
	.park_bigImage_img figure{margin: 0 -15px;}
	.park_bigImage_text .text{margin: 0 0 20px; text-align: left;}

	.location_lineup.col_3.park_lineup .location_box{width: calc(100% / 3);}
	.location_lineup.col_3.park_lineup .location_box + .location_box{margin-top: 0;}
}

/* around_station */
#around_station{padding: 50px 0;
	background: url(../../img/pages/access/location/station_back.jpg) repeat-y center top; background-size: cover;}
#around_station .location_itemTitle{margin-bottom: 30px;}
#around_station .location_itemTitle + p{text-align: center;}
#around_station .location_lineup{margin-top: 50px;}

@media screen and (max-width: 640px){
	#around_station .location_itemTitle + p{text-align: left;}
	#around_station .location_lineup{margin-top: 30px;}
}

/* life_information */
#life_information{padding-bottom: 120px;}
#life_information h3{font-family: "EB Garamond", serif; font-size: 2.6rem; font-weight: 500; text-align: center; margin: 0 0 25px;}

.infoMap_tab{justify-content: center;}
.infoMap_tab li{position: relative; padding: 2px 20px; transition: 0.3s ease; width: calc(100% / 6); display: flex; justify-content: center; align-items: center; text-align: center; border-right: 1px solid #000;}
.infoMap_tab li:nth-child(1){border-left: 1px solid #000;}
.infoMap_tab li:hover{cursor: pointer; color: #fff;}
.infoMap_tab li.active{color: #fff;}


#infoMap{margin-top: 30px;}
#infoMap .info_detail{display: none;}
#infoMap .info_detail.active{display: block;}

.info_detail_wrap{justify-content: center;}

.lifestyle_map_wrap{justify-content: space-between; margin: 50px 0 0;}
.lifestyle_map_column{width: 48%;}
.lifestyle_map_column h4{font-family: var(--font_sans); font-size: 2.6rem; font-weight: 400;}
.lifestyle_map_column ul{margin: 10px 0 35px; counter-reset: number 0;}
.lifestyle_map_column ul li{font-family: var(--font_sans); font-size: 1.5rem;
	display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; margin-bottom: 5px;
	background: url(../../img/elements/dot.png) repeat-x center top 10px;
	background-size: 7px;
}
.lifestyle_map_column ul li:before{content: counter(number) " ";
	counter-increment: number 1;
	width: 18px; height: 18px; border-radius: 50%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; font-size: 11px;
	position: absolute; top: 4px; left: 0; color: #fff;
}
.lifestyle_map_column ul li span{background: #fff;}
.lifestyle_map_column ul li span:nth-child(1){padding: 0 5px 0 22px; max-width: calc(100% - 140px);}
.lifestyle_map_column ul li span:nth-child(2){padding: 0 0 0 5px;}

.facility_wrap h4{color: #DD8657;}
.restaurants_wrap h4{color: #BE4022;}
.medical_wrap h4{color: #0090DF;}
.financial_wrap h4{color: #734A8D;}
.parks_wrap h4{color: #71A339;}
.cultural_wrap h4{color: #A27120;}

.facility_wrap ul li:before{background: #DD8657;}
.restaurants_wrap ul li:before{background: #BE4022;}
.medical_wrap ul li:before{background: #0090DF;}
.financial_wrap ul li:before{background: #734A8D;}
.parks_wrap ul li:before{background: #71A339;}
.cultural_wrap ul li:before{background: #A27120;}

.infoMap_tab li:nth-child(1).active,
.infoMap_tab li:nth-child(1):hover{background: #DD8657;}
.infoMap_tab li:nth-child(2).active,
.infoMap_tab li:nth-child(2):hover{background: #BE4022;}
.infoMap_tab li:nth-child(3).active,
.infoMap_tab li:nth-child(3):hover{background: #0090DF;}
.infoMap_tab li:nth-child(4).active,
.infoMap_tab li:nth-child(4):hover{background: #734A8D;}
.infoMap_tab li:nth-child(5).active,
.infoMap_tab li:nth-child(5):hover{background: #71A339;}
.infoMap_tab li:nth-child(6).active,
.infoMap_tab li:nth-child(6):hover{background: #A27120;}


@media screen and (max-width:960px){
	.lifestyle_map_wrap{padding: 0 10%;}
	.lifestyle_map_column{width: 100%;}

	.info_detail_wrap{max-width: 600px; width: 100%; margin: 0 auto;}

	.infoMap_tab li{width: calc(100% / 3); font-size: 15px; margin: 5px 0; padding: 0 5px;}
	.infoMap_tab li:nth-child(3n + 1){border-left: 1px solid #000;}
}
@media screen and (max-width: 640px){
	#life_information{padding-bottom: 60px;}

	.infoMap_tab{gap: 0; justify-content: space-between;}

	#infoMap{margin-top: 10px;}
	.info_detail_wrap .map_img{margin: 0 0 20px;}
	.info_detail_wrap .map_img figure{margin: 0 -15px;}

	.lifestyle_map_wrap{padding: 0; margin: 20px 0 0;}
	.lifestyle_map_column h4{font-size: 2.2rem;}
	.lifestyle_map_column ul li{font-size: 1.4rem;}
}


/* train_list */
.train_image{margin: 0 0 30px;}
.train_list{margin: 0 -20px 20px;}
.train_listBox{width: calc(100% / 2); padding: 0 20px; margin: 0 0 20px;}
.train_listBox img{width: 100%;}

/* car_area */
#car_area{background: #E7F1EC; padding: 50px 0;}
#car_area .inner{max-width: 1080px;}
#car_area .car_lead{text-align: center; margin: 30px 0;}
#car_area .bus_content{padding: 60px 0 0;}
#car_area .bus_content h3{font-family: var(--font_serif); font-size: 3.0rem; font-weight: 500; color: #19767A; text-align: center; margin: 0 0 20px;}
.bus_wrap{margin: 0 -30px;}
.bus_box{width: calc(100% / 2); padding: 0 30px;}

.haneda_area{border: 2px solid var(--blue); background: #fff;}
.haneda_image{position: relative;}
.haneda_image::before{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 40%; display: block; background: #ccc; z-index: 1;
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
}
.haneda_image span{position: absolute; top: 20px; left: 0; right: 0; z-index: 2; text-align: center;
	font-family: var(--font_serif); font-size: 2.5rem; font-weight: 600; color: var(--blue);
}
.haneda_image img{width: 100%;}
.haneda_about{padding: 30px;}
.haneda_about img{width: 100%;}

@media screen and (max-width: 640px){
	.train_list{margin: 0 0 20px;}
	.train_listBox{width: 100%; padding: 0; margin: 0 0 20px;}

	#car_area{padding: 50px 0 10px;}
	#car_area .car_lead{text-align: left; margin: 20px 0;}
	.car_map figure{margin: 0 -15px;}
	#car_area .bus_content{padding: 40px 0 0;}
	#car_area .bus_content h3{font-size: 2.0rem;}
	.bus_wrap{margin: 0;}
	.bus_box{width: 100%; padding: 0; margin-bottom: 40px;}
}