@charset "UTF-8";
/******************** レンタルオフィス一覧検索********************/
/* ---------- 必須CSS ここから ------------ */
#result [class*=hidden-] {
  display: none;
}

/* ---------- 必須CSS ここまで ------------ */
.vo .box {
  margin-bottom: 2.5rem;
  padding: 0;
}
.vo .box .img {
  margin-bottom: 1.5rem;
}
.vo .box h3.name {
  font-size: 1.4rem;
  font-weight: bold;
  color: #ffffff;
  background-color: #003C92;
  padding: 0.5rem 0 0.5rem 1rem;
  position: relative;
  margin-bottom: 2.5rem;
}
.vo .box h3.name:before {
  content: "";
  width: 0;
  height: 0;
  border-width: 8px;
  border-style: solid;
  border-color: #003C92 transparent transparent transparent;
  position: absolute;
  top: 100%;
  left: 5%;
}
.vo .box .feature {
  border: #b8d6ff solid 5px;
  padding: 1rem 1rem;
  border-radius: 20px;
  position: relative;
  margin-bottom: 1rem;
}
.vo .box .feature .wrap {
  text-align: center;
}
.vo .box .feature .wrap h4 {
  position: relative;
  display: inline-block;
  background-color: #fff;
  top: -20px;
  padding: 0 1em;
}
.vo .box .pr {
  padding: 1rem;
  background: #f5f5f5;
  position: relative;
}
.vo .box .pr:before {
  position: absolute;
  bottom: 15px;
  left: 10px;
  z-index: -1;
  width: 300px;
  height: 25px;
  /* box-shadow: 横方向 縦方向 ぼかし 影色 */
  -webkit-box-shadow: 0 15px 10px #777;
          box-shadow: 0 15px 10px #777;
  background: #777;
  -webkit-transform: rotate(-3deg);
          transform: rotate(-3deg);
  content: "";
}
.vo .box .pr span.m {
  font-weight: bold;
  color: #c41d00;
}
.vo table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #E0E0E0;
  margin: 15px 0;
}
.vo table th {
  width: 25%;
  border: 1px solid #E0E0E0;
  padding: 6px;
  background-color: #F5F5F5;
}
.vo table td {
  border: 1px solid #E0E0E0;
  padding: 6px;
}
.vo .feature {
  /* 住所 */
}
.vo .feature span {
  border-radius: 5px;
  padding: 2px 5px;
  display: inline-block;
  margin-right: 5px;
  font-size: 14px;
  /* Virtual Office */
  /* 受付 */
  /* フリードリンク */
  /* ラウンジ */
  /* Station (駅) */
  /*24h */
  /* 電話代行サービス */
  /* 駐車場 */
  /* 会議室 */
  /* 個室タイプ */
  /* ブース型 */
  /* Co-working space */
}
.vo .feature span.vo {
  background-color: #D00000; /*  */
  color: #fff;
}
.vo .feature span.rece {
  background-color: #FFD700; /* ゴールド */
  color: #000; /* 白抜き文字だと見にくい可能性があるため、黒に変更 */
}
.vo .feature span.drink {
  background-color: #FF69B4; /* ホットピンク */
  color: #fff;
}
.vo .feature span.runge {
  background-color: #4682B4; /* スチールブルー */
  color: #fff;
}
.vo .feature span.station {
  background-color: #00B7EE; /* 駅に近い、便利さを象徴する明るいグリーン */
  color: #fff;
}
.vo .feature span.h24 {
  background-color: #603913; /* 駅に近い、便利さを象徴する明るいグリーン */
  color: #fff;
}
.vo .feature span.daikou {
  background-color: #8DC63F; /* 代行のサポート感を表現する柔らかいピンク系 */
  color: #fff;
}
.vo .feature span.parking {
  background-color: #F28E0C; /* 信頼感と専門性を表す落ち着いたパープル */
  color: #fff;
}
.vo .feature span.kaigi {
  background-color: #070075; /* アクティブでクリエイティブなイメージを与えるオレンジ */
  color: #fff;
}
.vo .feature span.personal {
  background-color: #4B0082; /* より柔らかく、親しみやすさを表現する淡いオレンジ */
  color: #fff;
}
.vo .feature span.booth {
  background-color: #603913; /* 複数のサービスを提供する多用途性を表す中間的なオレンジ */
  color: #fff;
}
.vo .feature span.share {
  background-color: #2E8B57; /* コミュニティ感やコラボレーションを表すビビッドなピンク */
  color: #fff;
}
.vo a.hp_det {
  padding: 5px 5px 15px 0;
  line-height: 1.6em;
  background-color: #9eceff;
  border-radius: 5px;
  color: #fff;
  background: url(images/hp_detail.png) no-repeat;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  display: block;
  width: 254px;
}

/* ---------- ソートシステム ------------ */
.featureSearch {
  padding: 0 1rem 1rem;
  border-radius: 20px;
  border: 4px solid #003C92;
  position: relative;
  margin-bottom: 2rem;
}
.featureSearch span {
  padding: 0 1rem;
  background-color: #fff;
  color: #003C92;
  font-weight: bold;
  position: relative;
  top: -20px;
}
.featureSearch .row .all label {
  color: #970000;
  font-size: 1em;
  font-weight: bold;
}

.stationSerchArea {
  padding: 0 1rem 1rem;
  border-radius: 20px;
  border: 4px solid #003C92;
  position: relative;
  margin-bottom: 2rem;
}
.stationSerchArea span.title {
  padding: 0 1rem;
  background-color: #fff;
  color: #003C92;
  font-weight: bold;
  position: relative;
  top: -20px;
}

.stationSerchArea .title {
  font-size: 1.5em;
  font-weight: bold;
}
.stationSerchArea #staitonLink {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  list-style: none;
  padding: 0;
}
.stationSerchArea #staitonLink li {
  margin: 10px;
}
.stationSerchArea #staitonLink li a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1em;
  text-decoration: none;
  color: #333;
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
}
.stationSerchArea #staitonLink li a:before {
  content: "\f238";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 8px;
}
.stationSerchArea #staitonLink li a:hover {
  color: #007bff;
}

p.total span.totalsum {
  font-size: 2rem;
  font-weight: bold;
  color: red;
}

.kasou h2.linkserch {
  font-size: 1.5em;
  font-weight: bold;
  color: #003366;
  background: -webkit-repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #f0f0f0 10px, #f0f0f0 20px);
  background: repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #f0f0f0 10px, #f0f0f0 20px);
  border-top: 2px solid #003366;
  border-bottom: 2px solid #003366;
  padding: 10px;
}
.kasou h2.linkserch:before {
  content: "\f238";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 8px;
}

.vo .box {
  display: block;
}

.vo .box.none {
  display: none;
}

.kasou .relate h2 {
  font-size: 1.5em;
  font-weight: bold;
  color: #003366;
  background: -webkit-repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #f0f0f0 10px, #f0f0f0 20px);
  background: repeating-linear-gradient(45deg, #ffffff, #ffffff 10px, #f0f0f0 10px, #f0f0f0 20px);
  border-top: 2px solid #003366;
  border-bottom: 2px solid #003366;
  padding: 10px;
}
.kasou .relate ul li {
  text-align: center;
  border-radius: 10px;
  text-align: center;
}
.kasou .relate ul li a {
  display: block;
  text-align: center;
  background-color: #e1e1e1;
  color: #2f2f2f;
  padding: 0.5em 2.5em;
}

/* ---------- ソートシステム終了 ------------ */
div.portal ul {
  margin-bottom: 1.5rem;
}
div.portal ul li {
  padding: 0;
  text-align: center;
  border: 1px solid #c2c2c2;
}
div.portal ul li a {
  background-color: #f2f2f2;
  padding: 1em 1em;
  color: #000;
  margin: auto;
  display: block;
  text-decoration: none;
}
div.portal ul li a:hover {
  text-decoration: none;
  background-color: #d4d4d4;
}
div.portal h2 {
  font-size: 1.2rem;
  background-color: #f5faff;
  margin-bottom: 1.5rem;
  padding: 1rem 0;
  text-align: center;
  border-bottom: 1px solid #d8d8d8;
}

#sidebar.rentaloffice aside h3 {
  font-size: 1.2rem;
  background-color: #f5faff;
  margin-bottom: 1.5rem;
  padding: 1rem 0;
  text-align: center;
  border-bottom: 1px solid #d8d8d8;
}
#sidebar.rentaloffice aside ul.sidemenu {
  list-style: none;
  padding: 0;
}
#sidebar.rentaloffice aside ul.sidemenu li {
  border-bottom: 1px solid #d8d8d8;
}
#sidebar.rentaloffice aside ul.sidemenu li a {
  display: block;
  padding: 0.5em 1em;
  color: #000;
  text-decoration: none;
  position: relative; /* for absolute ::before */
  padding-left: 2.2rem; /* space for the icon */
}
#sidebar.rentaloffice aside ul.sidemenu li a::before {
  content: "➜"; /* 矢印アイコン（必要なら FontAwesome に変更可） */
  position: absolute;
  left: 0.6rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  font-size: 1rem;
  color: #003C92;
  -webkit-transition: color 0.18s ease, -webkit-transform 0.18s ease;
  transition: color 0.18s ease, -webkit-transform 0.18s ease;
  transition: transform 0.18s ease, color 0.18s ease;
  transition: transform 0.18s ease, color 0.18s ease, -webkit-transform 0.18s ease;
}
#sidebar.rentaloffice aside ul.sidemenu li a:hover {
  background-color: #f2f2f2;
  text-decoration: none;
}
#sidebar.rentaloffice aside ul.sidemenu li a:hover::before {
  color: #970000;
  -webkit-transform: translateY(-50%) translateX(4px);
          transform: translateY(-50%) translateX(4px);
}/*# sourceMappingURL=portal.css.map */