@charset "utf-8";

/*------------------------------
  Wrap
------------------------------*/

/*------------------------------
  コンテンツ
------------------------------*/
.btn__scroll--arw {
  animation: scrl-arw .8s ease infinite alternate;
  display: block;
  left: 50%;
  margin-left: -5px;
  position: absolute;
}
@keyframes scrl-arw {
  0% {
    top: 12px;
  }
  100% {
    top: 18px;
  }
}

/*------------------------------
  PC用スタイルここから
------------------------------*/
@media screen and (min-width: 768px) {

/*------------------------------
  ヘッダー
------------------------------*/
.header__pc {
  left: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1;
}
.header__pc.night {
  display: none;
}
.header__pc .header__inn {
  position: relative;
}
.logo {
  left: 62px;
  top: 36px;
}
.logo .logo__img {
  width: 180px;
}
.share {
  bottom: 0;
  left: auto;
  position: absolute;
  right: 310px;
  top: 20px;
}
.share p {
  font-size: 1.4rem;
  letter-spacing: .2rem;
  text-align: center;
}
.header__pc.night .share p {
  color: #fff;
}
.shareFb {
  margin-left: 4px;
}
.os__link {
  position: absolute;
  right: 40px;
  top: 40px;
}
.header__sp {
  display: none !important;
}

/*------------------------------
  コンテンツ
------------------------------*/
.section {
  position: relative;
}

/* セクションヘッダー */
.section__header {
  background: #fff;
  height: 120px;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.section__header--inn {
  height: 100%;
  position: relative;
  width: 100%;
}
#menu {
  left: 300px;
  overflow: hidden;
  position: absolute;
  top: 40px;
  z-index: 1;
}
.menu__item {
  float: left;
  margin-right: 40px;
}
.menu__link {
  border-bottom: 4px solid #001525;
  color: #001525;
  display: block;
  font-size: 2rem;
  font-weight: bold;
  height: 36px;
  letter-spacing: .6rem;
  line-height: 1;
  text-decoration: none;
}
.menu__link .num {
  font-size: 2.6rem;
  font-weight: bold;
}
.ico__evening {
  display: block;
}

/* 1ページ目 */
#tourtop {
  background: url(/common/img/officetour/bg_top_pc.jpg) right 120px /cover no-repeat;
}
.btn__scroll {
  background: url(/common/img/top/ico_scroll_wrap_pc.png) left top no-repeat;
  bottom: 60px;
  display: block;
  height: 40px;
  left: 50%;
  margin-left: -13px;
  position: absolute;
  width: 26px;
}
.btn__scroll--inn {
  display: block;
  height: 40px;
  position: relative;
  width: 26px;
}

/* 2ページ目以降 */
.ttl__officetour {
  font-size: 3.2rem;
  font-weight: bold;
  left: 300px;
  letter-spacing: .8rem;
  line-height: 1;
  position: absolute;
  top: 40px;
}
.detail__header {
  background: #fff;
  height: 180px;
  left: 0;
  position: absolute;
  top: 120px;
  width: 100%;
}
.detail__header--inn {
  height: 100%;
  position: relative;
  padding: 40px 0 0 24%;
  width: 100%;
}
.floor__num {
  left: 6%;
  position: absolute;
  top: 50px;
  z-index: 1;
}
#floor1 .floor__num {
  max-width: 198px;
  width: 11%;
}
#floor2 .floor__num {
  max-width: 204px;
  width: 11%;
}
#floor3 .floor__num {
  max-width: 206px;
  width: 11%;
}
#evening .floor__num {
  max-width: 496px;
  width: 26%;
}
.floor__num--img {
  display: block;
  width: 100%;
}
.detail__lead {
  font-size: 1.8rem;
  font-weight: bold;
}
.detail__body {
  height: 100%;
  padding: 300px 0 0 18%;
  position: relative;
  width: 100%;
}
.detail__img {
  bottom: 20%;
  display: block;
  left: 2%;
  max-width: 256px;
  position: absolute;
  width: 16%;
}
#evening .detail__img {
  left: 5%;
  max-width: 348px;
  width: 20%;
}
.detail__table {
  display: table;
  height: 50%;
  table-layout: fixed;
  width: 100%;
}
.detail__cell {
  display: table-cell;
  position: relative;
}
.img__sp {
  display: none;
}
.detail__txt {
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  max-width: 170px;
  position: absolute;
  text-shadow: 0 0 6px rgba(0, 0, 0, 0.8);
}

.floor1-1 {
  background: url(/common/img/officetour/bg_detail_1f01_pc.jpg) center center /cover no-repeat;
}
.floor1-1 .detail__txt {
  left: 2%;
  top: 8%;
}
.floor1-2 {
  background: url(/common/img/officetour/bg_detail_1f02_pc.jpg) center center /cover no-repeat;
}
.floor1-2 .detail__txt {
  bottom: 8%;
  left: 2%;
}
.floor1-3 {
  background: url(/common/img/officetour/bg_detail_1f03_pc.jpg) center center /cover no-repeat;
}
.floor1-3 .detail__txt {
  bottom: 8%;
  right: 2%;
}
.floor1-4 {
  background: url(/common/img/officetour/bg_detail_1f04_pc.jpg) center center /cover no-repeat;
}
.floor1-4 .detail__txt {
  right: 2%;
  top: 8%;
}

.floor2-1 {
  background: url(/common/img/officetour/bg_detail_2f01_pc.jpg) center center /cover no-repeat;
}
.floor2-1 .detail__txt {
  left: 2%;
  top: 8%;
}
.floor2-2 {
  background: url(/common/img/officetour/bg_detail_2f02_pc.jpg) center center /cover no-repeat;
}
.floor2-2 .detail__txt {
  bottom: 8%;
  left: 2%;
}
.floor2-3 {
  background: url(/common/img/officetour/bg_detail_2f03_pc.jpg) center center /cover no-repeat;
}
.floor2-3 .detail__txt {
  bottom: 8%;
  right: 2%;
}
.floor2-4 {
  background: url(/common/img/officetour/bg_detail_2f04_pc.jpg) center center /cover no-repeat;
}
.floor2-4 .detail__txt {
  right: 2%;
  top: 8%;
}

.floor3-1 {
  background: url(/common/img/officetour/bg_detail_3f01_pc.jpg) center center /cover no-repeat;
}
.floor3-1 .detail__txt {
  left: 2%;
  top: 8%;
}
.floor3-2 {
  background: url(/common/img/officetour/bg_detail_3f02_pc.jpg) center center /cover no-repeat;
}
.floor3-2 .detail__txt {
  bottom: 8%;
  left: 2%;
}
.floor3-3 {
  background: url(/common/img/officetour/bg_detail_3f03_pc.jpg) center center /cover no-repeat;
}
.floor3-3 .detail__txt {
  bottom: 8%;
  right: 2%;
}
.floor3-4 {
  background: url(/common/img/officetour/bg_detail_3f04_pc.jpg) center center /cover no-repeat;
}
.floor3-4 .detail__txt {
  right: 2%;
  top: 8%;
}

/* Evening */
#evening,
#evening .section__header,
#evening .detail__header {
  background: #0f0a02;
}
#evening .ttl__officetour,
#evening .share p,
#evening .detail__lead {
  color: #fff;
}
#evening .detail__header--inn {
  padding-left: 37%;
}
#evening .detail__body {
  padding-left: 32%;
}
#evening .detail__table {
  height: 100%;
}
.evening-1 {
  background: url(/common/img/officetour/bg_detail_eve01_pc.jpg) center center /cover no-repeat;
  width: 40%;
}
.evening-1 .detail__txt {
  bottom: 4%;
  max-width: none;
  padding: 0 2%;
  right: 0;
  width: 100%;
}
.evening-2 .detail__table--inn {
  display: table;
  height: 50%;
  table-layout: fixed;
  width: 100%;
}
.evening-2 .detail__table--inn .detail__cell {
  height: 100%;
  width: 100%;
}
.evening-2-1 {
  background: url(/common/img/officetour/bg_detail_eve02_pc.jpg) center center /cover no-repeat;
}
.evening-2-1 .detail__txt {
  bottom: 8%;
  left: 2%;
}
.evening-2-2 {
  background: url(/common/img/officetour/bg_detail_eve03_pc.jpg) center center /cover no-repeat;
}
.evening-2-2 .detail__txt {
  right: 2%;
  top: 8%;
}

/*------------------------------
  フッター
------------------------------*/
#footer {
  background: none;
  bottom: 0;
  height: auto;
  left: 0;
  position: fixed;
  width: 100%;
}
.tour__pagetop {
  display: none;
}
.tour__copy {
  font-size: 1.2rem;
  font-weight: bold;
  padding: 0 0 10px 10px;
}
.tour__copy.eve {
  color: #fff;
}

}
/*------------------------------
  PC用スタイルここまで
------------------------------*/



/*------------------------------
  ミドルサイズ用スタイルここから
------------------------------*/
@media (min-width: 768px) and (max-width: 1023px) {

.logo {
  left: 20px;
}
.share {
  right: 280px;
}
.os__link {
  right: 20px;
}
#menu {
  display: none;
  /*left: 230px;*/
}
.menu__item {
  margin-right: 20px;
}
.ttl__officetour {
  display: none;
  /*font-size: 2.8rem;
  left: 230px;
  letter-spacing: .6rem;
  top: 42px;*/
}

}
/*------------------------------
  ミドルサイズ用スタイルここまで
------------------------------*/



/*------------------------------
  SP用スタイルここから
------------------------------*/
@media screen and (max-width: 767px) {

/*------------------------------
  Wrap
------------------------------*/
#wrap {
  background: #fff;
}

/*------------------------------
  ヘッダー
------------------------------*/
.header__pc {
  display: none !important;
}
.header__sp {
  height: 60px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1;
}
.header__sp.day {
  background: #fff;
}
.header__sp.night {
  background: #0f0a02;
  display: none;
}
.header__sp .header__inn {
  height: 100%;
  position: relative;
}
.share {
  position: absolute;
  right: 20px;
}
.header__sp.night .share p {
  color: #fff;
}

/*------------------------------
  コンテンツ
------------------------------*/
.section {
  padding-top: 80px;
}
#floor1,
#floor2,
#floor3,
#evening {
  height: auto !important;
}
.section__header {
  display: none;
}

/* 1ページ目 */
#tourtop {
  background: url(/common/img/officetour/bg_top_sp.jpg) center 60px /cover no-repeat;
  position: relative;
}
.btn__scroll {
  background: url(/common/img/top/ico_scroll_wrap_sp.png) left top /20px 31px no-repeat;
  bottom: 29px;
  display: block;
  height: 31px;
  left: 50%;
  margin-left: -10px;
  position: absolute;
  width: 20px;
}
.btn__scroll--inn {
  display: block;
  height: 31px;
  position: relative;
  width: 20px;
}
.btn__scroll--arw {
  animation: scrl-arw .8s ease infinite alternate;
  display: block;
  height: 7px;
  left: 50%;
  margin-left: -3px;
  position: absolute;
  width: 6px;
}
@keyframes scrl-arw {
  0% {
    top: 12px;
  }
  100% {
    top: 18px;
  }
}

/* 2ページ目以降 */
.floor__num {
  margin: 50px 0 20px 36px;
}
.detail__lead {
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 20px;
  padding: 0 20px;
}
.img__sp {
  display: block;
  width: 100%
}
.detail__txt {
  background: #001525;
  color: #fff;
  font-size: 1rem;
  font-weight: bold;
  padding: 10px 20px;
}

#floor1 {
  background: #fff url(/common/img/officetour/img_floor01_sp.png) right 32px top 85px /128px 87px no-repeat;
}
#floor1 .floor__num img {
  width: 99px;
}

#floor2 {
  background: #fff url(/common/img/officetour/img_floor02_sp.png) right 32px top 85px /128px 87px no-repeat;
}
#floor2 .floor__num img {
  width: 102px;
}

#floor3 {
  background: #fff url(/common/img/officetour/img_floor03_sp.png) right 32px top 85px /128px 87px no-repeat;
}
#floor3 .floor__num img {
  width: 103px;
}

#evening {
  background: #0f0a02 url(/common/img/officetour/img_evening_sp.png) right 32px top 85px /174px 117px no-repeat;
}
#evening .floor__num {
  margin-top: 130px;
}
#evening .floor__num img {
  width: 195px;
}
#evening .detail__lead {
  color: #fff;
}
#evening .detail__txt {
  background: #1d1a14;
}

/*------------------------------
  フッター
------------------------------*/
#footer {
  background: #fff;
  height: auto;
  padding: 40px 0;
}
.tour__pagetop {
  display: block;
  height: 40px;
  margin: 0 auto 20px;
  width: 35px;
}
.tour__copy {
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
}

}
/*------------------------------
  SP用スタイルここまで
------------------------------*/