@charset "utf-8";
/* CSS Document */

/*
ヘッダー、グローバルナビはcommon.cssに記載
コンテンツエリア、メインコンテンツエリア、サブコンテンツ等の構造枠はcntsCommon.cssに記載
*/

p#mVisualBtn {
	width: 102px;
	height: 102px;
	position: absolute;
	top: 110px;
	right: 10px;
	z-index: 100;
}

p#mVisualBtn_rfvv {
	width: 157px;
	height: 85px;
	position: absolute;
	top: 133px;
	right: 12px;
	z-index: 100;
}

p.CanBtn_rfvv {
	width: 187px;
	height: 47px;
	position: absolute;
	top: 255px;
	left: 8px;
	z-index: 80;
}



/*　各会場：レンタルオフィス紹介
----------------------------------------------------------------------*/
#vertualSlide {
	width: 670px;
	height: 214px;
	margin: 0 auto 10px auto;
	overflow: hidden;
}
#vertualSlide li {
	width: 670px;
	height: 214px;
}
#vertualSlidePager {
	width: 670px;
	height: 52px;
	margin: 10px auto 30px auto;
}
#vertualSlidePager li {
	width: 129px;
	height: 52px;
	margin: 0 6px 0 0;
	float: left;
}
#vertualSlidePager li#pager01 a,
#vertualSlidePager li#pager02 a,
#vertualSlidePager li#pager03 a,
#vertualSlidePager li#pager04 a,
#vertualSlidePager li#pager05 a {
	display: block;
	width: 129px;
	height: 52px;
}

#vertualSlidePager li#pager01 a {
	background: url(../img/vertualSlideThum_01.jpg) no-repeat 0 -52px;
}
#vertualSlidePager li#pager02 a {
	background: url(../img/vertualSlideThum_02.jpg) no-repeat 0 -52px;
}
#vertualSlidePager li#pager03 a {
	background: url(../img/vertualSlideThum_03.jpg) no-repeat 0 -52px;
}
#vertualSlidePager li#pager04 a {
	background: url(../img/vertualSlideThum_04.jpg) no-repeat 0 -52px;
}
#vertualSlidePager li#pager05 a {
	background: url(../img/vertualSlideThum_05.jpg) no-repeat 0 -52px;
}

#vertualSlidePager li.noMg {
	margin: 0;
}
#vertualSlidePager li#pager01 a.active,
#vertualSlidePager li#pager02 a.active,
#vertualSlidePager li#pager03 a.active,
#vertualSlidePager li#pager04 a.active,
#vertualSlidePager li#pager05 a.active {
	background-position: 0 0;
}
#vertualSlidePager li#pager01 a:hover,
#vertualSlidePager li#pager02 a:hover,
#vertualSlidePager li#pager03 a:hover,
#vertualSlidePager li#pager04 a:hover,
#vertualSlidePager li#pager05 a:hover {
	background-position: 0 0;
}





.co3plan {
  display: flex;
  justify-content: space-between;
  margin-top: 24px;
  margin-bottom: 16px;
}

.co3planIn {
  width: 211px;
}

.co3planImg img {
  width: 211px;
}

.co3planTxt {
  position: relative;
  z-index: 10;
  background: rgba(0,102,153,0.6);
  margin-top: -66px;
}
.co3planTxt a {
  display: block;
  color: #FFFFFF;
  padding: 16px 0 0;
  text-align: center;
  text-decoration: none;
  font-size: 15px;
  line-height: 1.7em;
  height: 50px;
}
.co3planTxt a span {
  font-size: 10px;
}
.co3planTxt a:hover {
  text-decoration: underline;
}

.plan3 {
  margin: 20px 0 10px;
}
.plan3 ul {
  display: flex;
  justify-content: space-between;
}

.plan3-1 { background: url(../img/plan3-1.jpg); }
.plan3-2 { background: url(../img/plan3-2.jpg); }
.plan3-3 { background: url(../img/plan3-3.jpg); }

.plan3 li {
  position: relative;
  width: 210px;
  height: 210px;
  background-size: 100% auto;
  background-position: center;
  transition: all 0.5s ease;
}

.plan3 li:hover {
  background-size: 110% auto;
background-color:rgba(255,255,255,0.3);
background-blend-mode:lighten;
}

.plan3 li a {
  position: absolute;
  display: block;
  width :100%;
  height: 100%;
}

.plan3btm {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: rgba(0,102,153,0.6);
  padding: 12px 0;
  color: #FFFFFF;
  text-align: center;
  font-size: 16px;
  line-height: 1.8em;
}

.plan3btm span {
  font-size: 12px;
}

.dtlLinkPrice {
	width: 110px;
	height: auto;
}
.dtlLinkTxt {
	text-align: center;
}
.dtlLinkBox .dtlLinkTxt a {
	font-size: 110%;
	float: none;
}
.extrPrice p.roomType {
	width: 100%;
}


@media only screen and (max-width: 767px) {
	.plan3 ul {
		flex-wrap: wrap;
		justify-content: center;
	}
	.plan3 li {
		margin-bottom: 10px;
	}
	.plan3 li.plan3-3 {
		margin-bottom: 0;
	}
}