@charset "utf-8";

/************************************
harajukuPage
*************************************/


.harajukuPage #titleBlock{background-color:#eb523a;}
.harajukuPage #rooms ul li .txtBox:before,
.harajukuPage section.grayBlock,
.harajukuPage #serviceOption h4{background-color:#004c88;}
.harajukuPage #serviceOption #freeService li a:hover:before,
.harajukuPage #serviceOption #paidService li a:hover:before{background:rgba(79,154,213,0.3);}
.harajukuPage section h3.subTitle,
.harajukuPage #rooms ul li .txtBox dt,
.harajukuPage #rooms ul li .txtBox dd a,
.harajukuPage #price .priceTblTtl span.ttl,
.harajukuPage #price .priceTbls dd strong,
.harajukuPage .srBox ul,
main.access.harajukuPage section .googleMapLink a,
.harajukuPage .sm-title{color:#eb523a;}
.harajukuPage section.grayBlock,
.harajukuPage #rooms ul li .txtBox dd,
.harajukuPage .srBox ul small,
.harajukuPage #price .priceTbls,
.harajukuPage #price h4,
.harajukuPage #price h4+ul,
.harajukuPage #price h4+ul a,
.harajukuPage #secretary dd a{color:#fff;}


.harajukuPage #price .priceTblTtl span.note{color:#8faad0;}
.harajukuPage #titleBlock h2{color:#fff;}
.harajuku.subNavPriority #locationNavi .subTitleBar{background-color:rgba(232,52,24,0.85);}
.harajukuPage .srBox h3.subTitle .title1 .roomNum{
	background-color:#eb523a;
	color:#004c88;
}
.harajukuPage #locationNavi .subTitleBar ul.downMenu li a span.roomNum{
	background-color:#eb523a;
	color:#fff;
}
.harajukuPage #price .priceTbls dd:last-of-type:after,
.harajukuPage #price .priceTbls dd:before{background-color:#fff;}
.harajukuPage #price .priceTbls dd:first-of-type:before{background-color:#eb523a;}
.harajukuPage #secretary{margin-top:10px;}
.harajukuPage #secretary .tbl {line-height: normal;}
.harajukuPage #secretary .tbl dd {margin-bottom: 15px;}
.harajukuPage #floor .inner{max-width:908px;}
.harajukuPage.locateTop #floor .inner,
.harajukuPage.access #floor .inner{
	max-width:566px;
	width:80%;
}
.harajukuPage.locateTop #floor figcaption,
.harajukuPage.access #floor figcaption{
	position:absolute;
	display:block;
	font-weight:bold;
	text-align:right;
	line-height:1.1;
}
#space{text-align:center;}
#space .spaceList,
#space .spaceDataList{
	display:flex;
	justify-content:space-between;
}
#space .spaceList li{
	display:block;
	width:32%;
}
#space .spaceDataList li{display:table;}
#space .spaceDataList li a{
	display:table-cell;
	width:100%;
	box-sizing:border-box;
	background:#004c88;
	color:#fff;
	vertical-align:middle;
}
#space .spaceDataList li a:hover{
	text-decoration:none;
	opacity:0.7;
}
#space .spaceNote{padding-left:20px;}
#space .spaceNote li{
	text-align:left;
	list-style:disc;
}
@media screen and (min-width:769px){
	#space .inner{width:96%;}
	#space .inner figure{margin-bottom:24px;}
	.harajukuPage section.centerMv .icoSlanting{
		right:-85px;
		bottom:43px;
		padding:0px 80px;
		font-size:4.8rem;
	}
	html[lang="en"] .harajukuPage section.centerMv .icoSlanting{
		right:-94px;
		bottom:58px;
	}
	.harajukuPage.locateTop #floor figcaption,
	.harajukuPage.access #floor figcaption{
		top:56px;
		left:70%;
		font-size:2rem;
		white-space:nowrap;
	}
	.harajukuPage #serviceOption .serviceList li:not(:nth-child(5n)):after{background:#eee;}
	.harajukuPage #locationNavi > ul#midNavi li a:after{background:#fff;}
	.harajukuPage #locationNavi > ul#midNavi li a {color:#fff;}
	.harajukuPage section.centerMv{
		background-image:url(/harajuku/img/mv-top_2.jpg);
		background-position:center center;
	}
	.harajukuPage.rentalspace section.centerMv{
		background-image:url(/harajuku/img/mv-rentalspace.jpg);
		background-position:center center;
	}
	.harajukuPage.share section.centerMv{
		background-image:url(/harajuku/img/mv-share.jpg);
		background-position:center center;
	}
}
@media screen and (min-width:769px) and (max-width:1080px){
	.harajukuPage.rentalspace #price #secretary .lead{font-size:2.1rem;}
	
}
@media screen and (min-width:1081px){
	#space{padding:75px 0 90px;}
	#space .inner{
		width:70%;
		max-width: 936px;
	}
	#space .inner figure{margin-bottom:36px;}
	#space .spaceList{margin:32px auto;}
	#space .spaceDataList{margin:0 auto 32px;}
	#space .spaceDataList li{width:32%;}
	#space .spaceDataList li a{
		height:88px;
		padding:16px;
		font-size:1.8rem;
	}
	.harajukuPage #locationNavi > ul#midNavi li{border-left-color:#fff;}
	.harajukuPage #locationNavi > ul#midNavi li:last-child{border-right-color:#fff;}
	.harajukuPage.rentalspace #price #secretary .lead{font-size:2.4rem;}
	body.harajuku .scrollBnr[data-type="styleroom"]{top:calc(50% - 136px);}
	body.harajuku .scrollBnr[data-type="lounge"]{top:calc(50% + 10px);}
}
@media screen and (min-width:1081px) and (max-width:1160px){
	.subNavPriority .harajukuPage #locationNavi > ul#midNavi{padding-left:100px;}
}


@media screen and (max-width:768px){
	#space .inner{margin:0 10px;}
	#space .inner figure{margin-bottom:4vw;}
	section h3.subTitle+p.catch{margin:-6vw auto 6vw;}
	
	.harajukuPage section.centerMv .icoSlanting{
		right:-46px;
		bottom:28px;
		padding:0px 50px;
		font-size:1.6rem;
	}
	.harajukuPage.locateTop section.centerMv{
		background-image:url(/harajuku/img/mv-top-sp_2.jpg);
		background-position:center center;
	}
	.harajukuPage.rentalspace section.centerMv{
		background-image:url(/harajuku/img/mv-rentalspace-sp.jpg);
		background-position:center center;
	}
	.harajukuPage.share section.centerMv{
		background-image:url(/harajuku/img/mv-share-sp.jpg);
		background-position:center center;
	}
	.harajukuPage.locateTop #floor figcaption,
	.harajukuPage.access #floor figcaption{
		top:5vw;
		right:-4%;
		font-size:4vw;
	}
	.harajukuPage.rentalspace #price #secretary .lead{font-size:1.8rem;}
}
@media screen and (max-width:1080px){
	#space{padding:7vw 0 9vw;}
	#space .spaceList{margin:3vw auto;}
	#space .spaceDataList{
		margin:0 auto 3vw;
		flex-wrap:wrap;
	}
	#space .spaceDataList li{
		width:48%;
		height:9.438vw;
	}
	#space .spaceDataList li:nth-child(n+3){margin-top:2vw;}
	#space .spaceDataList li a{padding:2vw;}
	.harajukuPage #locationNavi > ul#midNavi{background:#004c88;}
	.harajukuPage #locationNavi > ul#midNavi li+li,
	.harajukuPage #locationNavi > ul#midNavi li.srDown.active .downMenu li{border-color:#fff;}
	.harajukuPage #locationNavi > ul#midNavi.active li.srDown.active .downMenu li a span.roomNum{background:#eb523a;}
}

/*download*/
#download{padding:30px 0;}
#download .inner{max-width: 1052px;}
#download h4{
	background:#004c88;
	display: block;
	width: 100%;
	padding: 8px 0;
	font-size: 1.7rem;
	line-height: 1.0;
	color: #fff;
	text-align: center;
	margin-bottom: 20px ;
}
#download p{
	display: block;
	margin-bottom:40px;
	text-align: center;
	color: #393939;
	font-size: 1.6rem;
}

#download .dlList{
	width:100%;
}
#download .dlList2{
	display:flex;
	justify-content:space-between;
flex-wrap: wrap;}

#download .dlList li{
	text-align: center ; 
	padding: 12px ;
	margin-bottom: 15px ;
	position: relative ;
    border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px; 
border: 1px solid #004c88;

}

#download .dlList2 li{
	width:49%;
	text-align: center ; 
	padding: 12px ;
	margin-bottom: 15px ;
	position: relative ;
    border-radius: 3px;        /* CSS3草案 */  
    -webkit-border-radius: 3px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 3px; 
border: 1px solid #004c88;
}
#download .dlList li a,#download .dlList2 li a{
	background:#fff;
	color:#004c88;
	vertical-align: middle ;
}


#download .dlList li a:hover,#download .dlList2 li a:hover{
	text-decoration:none;
	opacity:0.7;
}

#download .dlList li a:after,#download .dlList2 li a:after{
	    content: "";
    display: inline-block;
    width: 28px;
    height: 29px;
    margin-left: 8px;
    background: url("/harajuku/img/dl_pdf.jpg") no-repeat;
    background-size: contain;
    vertical-align: middle;
}



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

#download .dlList,#download .dlList2{margin:0 auto 32px;}
#download .dlList li a,#download .dlList2 li a{

		font-size:1.8rem;
	}
	}
	.srBox li.harajuku{margin:0 25px;}




#serviceOption .serviceList li img.w92{
	width: 92px;
	height:72px;
	margin: 0 auto 10px;
}

.harajukuPage #price p a,
.harajukuPage .centerMv p a{
	color: #fff;
}