/* ===================================================================
   Flexera Software 製品ページ - Bootstrap 5 対応スタイル
   =================================================================== */

/* -------------------------------------------------------------------
   製品ナビゲーションバー (prodnavbar) - Bootstrap 5 navbar オーバーライド
   ------------------------------------------------------------------- */

.prodnavbar {
  background-color: #EFEFEF;
  border-bottom: 5px solid #deb408;
  margin-bottom: 20px;
}

.prodnavbar-brand {
  background: url(../images/logo_flexerasoftware.png) 0 center no-repeat;
  width: 250px;
  height: 38px;
  display: block;
  font-size: 20px;
  font-weight: 200;
  color: transparent;
  text-indent: -9999px;
  flex-shrink: 0;
}

.prodnavbar-brand:hover,
.prodnavbar-brand:focus {
  text-decoration: none;
}

/* ナビゲーションリンクの色設定 */
.prodnavbar .navbar-nav .nav-link {
  color: #000000;
  padding-top: 15px;
  padding-bottom: 15px;
}

.prodnavbar .navbar-nav .nav-link:hover,
.prodnavbar .navbar-nav .nav-link:focus {
  color: #0065bd;
  background-color: transparent;
}

.prodnavbar .navbar-nav .nav-item.active .nav-link {
  color: #0065bd;
}

/* ドロップダウンメニュー */
.prodnavbar .dropdown-menu {
  border-top: 2px solid #deb408;
}

.prodnavbar .dropdown-item {
  color: #000000;
}

.prodnavbar .dropdown-item:hover,
.prodnavbar .dropdown-item:focus {
  color: #0065bd;
  background-color: #f0f0f0;
}

/* ハンバーガーアイコン (モバイル) - 暗い背景用 */
.prodnavbar .navbar-toggler {
  border-color: #0065bd;
}

.prodnavbar .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 101, 189, 0.85%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* デスクトップサイズ (992px以上) でのみ横並びレイアウトを適用 */
@media (min-width: 992px) {
  .prodnavbar .navbar-nav.prodnav {
    display: flex !important;
    flex-direction: row !important;
  }
}

/* モバイル時の縦書き防止 */
@media (max-width: 991.98px) {
  .prodnavbar .navbar-nav .nav-link {
    writing-mode: horizontal-tb;
    display: block;
  }
}

/* -------------------------------------------------------------------
   ジャンボトロン (Bootstrap 5 で削除されたため独自定義)
   ------------------------------------------------------------------- */

.jumbotron {
  margin-top: -20px;
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: #0065bd;
  background: url(../images/splash/background_office.jpg) center/cover no-repeat;
  background-attachment: fixed;
}

.jumbotron h1.featurette-heading {
  color: #ffffff;
  font-size: 30pt;
  font-weight: bold;
  text-shadow: 2px 2px #231F20;
}

.jumbotron .featurette {
  color: #FFF;
}

.jumbotron .featurette ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.jumbotron .featurette ul li {
  background-image: url(../images/bullet1.png);
  background-repeat: no-repeat;
  background-position: 0 center;
  padding-left: 15px;
}

/* -------------------------------------------------------------------
   製品フッター (widefooter.inc) のカスタマイズ
   注意: 製品フッターの基本スタイルは ../../scripts/style_bs5.css で定義されています。
   ここでは Flexera Software 製品固有の配色にオーバーライドしています。
   ------------------------------------------------------------------- */

footer.product {
  background-color: #424242;
  border-top: 5px solid #deb408;
}

footer.product h3 {
  color: #ffffff;
  font-size: 18px;
}

footer.product .footerlist {
  color: #ffffff;
  line-height: 180%;
}

footer.product .footerlist a {
  color: #ffffff;
  text-decoration: none;
}

footer.product .footerlist a:hover {
  color: #99CBFF;
  text-decoration: none;
}

/* -------------------------------------------------------------------
   左サイドメニュー
   ------------------------------------------------------------------- */

.leftmenu h4 {
  font: 700 18px/26px "PT Sans", Helvetica, Arial, sans-serif;
  margin: 0 0 10px;
  color: #4c5259;
}

.small-grpdcs {
  display: block;
  font-size: 16px;
  margin-bottom: -11px;
}

.leftmenu {
  padding: 0 30px 0 0;
  border-right: 1px dashed #d6d6d6;
  min-height: 300px;
}

@media (max-width: 767px) {
  .leftmenu {
    display: none;
  }
}

.products-list {
  font-size: 14px;
  margin: 0 0 25px 0;
  padding: 0;
  list-style: none;
}

.products-list li {
  padding: 0 0 13px;
  border-bottom: 1px dashed #d6d6d6;
  margin-bottom: 10px;
  color: #979797;
}

.products-list li:last-child {
  border-bottom: 0;
}

.products-list a {
  color: #0087cb;
}

.products-list a:hover {
  text-decoration: none;
  color: #53bbf0;
}

.products-list .small-grpdcs {
  display: block;
  font-size: 13px;
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .content-products {
    padding: 0 0 0 30px;
  }
}

/* -------------------------------------------------------------------
   コンテンツ共通スタイル
   ------------------------------------------------------------------- */

.thumbnail p {
  line-height: 160%;
}

dt, dd {
  font-weight: normal;
  line-height: 160%;
}

dt {
  margin-top: 7px;
  font-weight: bold;
}

.container {
  line-height: 160%;
}

/* -------------------------------------------------------------------
   タブコンテンツ
   ------------------------------------------------------------------- */

.tab-content h2 {
  margin-top: 30px;
  margin-bottom: 15px;
  line-height: 150%;
}

.tab-content h3 {
  margin-top: 30px;
  margin-bottom: 0;
  line-height: 110%;
}

.tab-content h4 {
  margin-top: 20px;
  color: #004F7D;
  line-height: 140%;
}

/* -------------------------------------------------------------------
   製品機能リスト
   ------------------------------------------------------------------- */

.featuresList {
  margin-top: 5px;
}

.featuresList > div {
  margin: 10px 0 5px 0;
  padding: 15px 0;
  clear: both;
  border-top: 1px solid #efefef;
}

.featuresList div:first-child {
  border-top: 1px solid white;
}

.featuresList h3 {
  margin: 5px 0 0 0;
  padding: 2px 0 !important;
  border-left: 0 !important;
}

.featuresList span.sub {
  display: block;
  font-weight: normal;
  color: #777777;
  font-size: 13px;
}

.featuresList p img {
  margin-top: 10px;
  margin-bottom: 15px;
}

.featuresList span.badge {
  background-color: #800000;
  color: white;
  font-family: "Open Sans", Verdana, Helvetica, "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 11px;
  padding: 2px 6px;
  margin-right: 8px;
  position: relative;
  top: -3px;
  border-radius: 2px;
  line-height: 170%;
}

/* -------------------------------------------------------------------
   Product page polish
   ------------------------------------------------------------------- */

.product-page {
  color: #263238;
}

.product-hero {
  position: relative;
  overflow: hidden;
  margin: 0 0 24px;
  padding: 28px 32px;
  border: 1px solid #dce6ef;
  border-left: 6px solid #0065bd;
  background: #f7fbff;
}

.product-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 24px;
  align-items: center;
}

.product-hero__logo {
  max-width: 210px;
  justify-self: end;
}

.product-hero h1 {
  margin: 0 0 12px;
  color: #17324d;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.3;
}

.product-hero__lead {
  margin: 0 0 14px;
  color: #004f7d;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.55;
}

.product-hero__text {
  margin: 0;
  max-width: 820px;
  color: #3d4b57;
  font-size: 16px;
  line-height: 1.8;
}

.product-hero__actions,
.product-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 22px;
}

.product-hero__actions .btn,
.product-cta-row .btn {
  min-width: 190px;
  border-radius: 4px;
  font-weight: 700;
}

.product-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 26px;
}

.product-summary__item {
  padding: 14px 16px;
  border: 1px solid #e1e8ef;
  border-top: 3px solid #deb408;
  background: #ffffff;
}

.product-summary__label {
  display: block;
  margin-bottom: 3px;
  color: #60717f;
  font-size: 12px;
  font-weight: 700;
}

.product-summary__value {
  display: block;
  color: #17324d;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.55;
}

.product-tabs {
  gap: 6px;
  margin: 24px 0 28px !important;
  border-bottom: 2px solid #dce6ef;
}

.product-tabs .nav-link {
  border: 0;
  border-radius: 4px 4px 0 0;
  color: #44515c;
  font-weight: 700;
  padding: 12px 18px;
}

.product-tabs .nav-link:hover,
.product-tabs .nav-link:focus {
  color: #0065bd;
  background-color: #f2f7fb;
}

.product-tabs .nav-link.active {
  color: #ffffff;
  background-color: #0065bd;
}

.product-page .tab-content {
  padding-top: 2px;
}

.product-page .tab-content h2 {
  color: #17324d;
  font-weight: 700;
}

.product-page .tab-content h3 {
  margin-top: 34px;
  margin-bottom: 14px;
  padding-left: 12px;
  border-left: 4px solid #deb408;
  color: #17324d;
  line-height: 1.45;
  font-weight: 700;
}

.product-page .tab-content h4 {
  margin-top: 24px;
  color: #004f7d;
  font-weight: 700;
}

.product-page .table {
  margin-top: 16px;
  border-color: #dce6ef;
  background: #ffffff;
}

.product-page .table th {
  color: #17324d;
  background-color: #f3f6f9;
}

.product-page .table td,
.product-page .table th {
  padding: 12px 14px;
  vertical-align: middle;
}

.product-page .table td:first-child,
.product-page .table th:first-child {
  text-align: left;
}

.product-comparison-table td:not(:first-child),
.product-comparison-table th:not(:first-child) {
  text-align: center;
}

.product-page .table-responsive {
  margin: 18px 0 8px;
}

.product-history {
  height: 240px;
  overflow: auto;
  border: 1px solid #dce6ef !important;
  padding: 16px 18px !important;
  background: #fbfcfd;
}

.product-history h3 {
  margin-top: 10px !important;
  border-left-color: #0065bd;
  font-size: 18px;
}

.product-page .featuresList {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.product-page .featuresList > div {
  margin: 0;
  padding: 18px;
  border: 1px solid #e1e8ef;
  border-top: 3px solid #0065bd;
  background: #ffffff;
}

.product-page .featuresList div:first-child {
  border-top: 3px solid #0065bd;
}

.product-page .featuresList h3 {
  margin-top: 0;
  padding-left: 0 !important;
  border-left: 0 !important;
  font-size: 18px;
}

.product-capability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0 28px;
}

.product-capability {
  padding: 16px 18px;
  border: 1px solid #e1e8ef;
  border-left: 4px solid #0065bd;
  background: #ffffff;
}

.product-capability h4 {
  margin: 0 0 8px !important;
  color: #17324d;
  font-size: 17px;
}

.product-capability p {
  margin: 0;
  color: #3d4b57;
  line-height: 1.65;
}

.product-note {
  margin: 18px 0;
  padding: 16px 18px;
  border: 1px solid #e6d58b;
  border-left: 4px solid #deb408;
  background: #fffdf2;
}

.product-note p:last-child {
  margin-bottom: 0;
}

.product-pricing-section {
  margin: 34px 0;
}

.product-pricing-section > h2 {
  padding-bottom: 10px;
  border-bottom: 2px solid #dce6ef;
}

.product-pricing-section .row {
  margin-top: 14px;
}

.product-page-price .product-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.product-page-home .product-summary {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.product-page-home .product-hero {
  min-height: 420px;
  padding: 52px 42px;
  border: 0;
  border-left: 6px solid #deb408;
  background:
    linear-gradient(90deg, rgba(4, 20, 39, 0.98) 0%, rgba(7, 32, 58, 0.9) 34%, rgba(7, 32, 58, 0.5) 60%, rgba(7, 32, 58, 0.08) 100%),
    url(../images/hero-flexera-products-overview.png) center right / cover no-repeat;
}

.product-page-home .product-hero__inner {
  grid-template-columns: 1fr;
  min-height: 316px;
}

.product-page-home .product-hero h1 {
  max-width: 760px;
  color: #ffffff;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
}

.product-page-home .product-hero__lead {
  max-width: 760px;
  color: #dcecff;
}

.product-page-home .product-hero__text {
  max-width: 740px;
  color: #f3f8ff;
}

.product-page-installshield .product-hero__inner {
  grid-template-columns: 1fr;
  min-height: 316px;
}

.product-page-installshield .product-hero {
  min-height: 420px;
  padding: 52px 42px;
  border: 0;
  border-left: 6px solid #deb408;
  background:
    linear-gradient(90deg, rgba(4, 20, 39, 0.98) 0%, rgba(7, 32, 58, 0.9) 34%, rgba(7, 32, 58, 0.52) 60%, rgba(7, 32, 58, 0.08) 100%),
    url(../images/hero-installshield-windows-installer.png) center right / cover no-repeat;
}

.product-page-installshield .product-hero h1 {
  max-width: 760px;
  color: #ffffff;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
}

.product-page-installshield .product-hero__lead {
  max-width: 760px;
  color: #dcecff;
}

.product-page-installshield .product-hero__text {
  max-width: 740px;
  color: #f3f8ff;
}

.product-page-installanywhere .product-hero__inner {
  grid-template-columns: 1fr;
  min-height: 316px;
}

.product-page-installanywhere .product-hero {
  min-height: 420px;
  padding: 52px 42px;
  border: 0;
  border-left: 6px solid #deb408;
  background:
    linear-gradient(90deg, rgba(4, 20, 39, 0.98) 0%, rgba(7, 32, 58, 0.9) 34%, rgba(7, 32, 58, 0.52) 60%, rgba(7, 32, 58, 0.08) 100%),
    url(../images/hero-installanywhere-multiplatform-deployment.png) center right / cover no-repeat;
}

.product-page-installanywhere .product-hero h1 {
  max-width: 760px;
  color: #ffffff;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
}

.product-page-installanywhere .product-hero__lead {
  max-width: 760px;
  color: #dcecff;
}

.product-page-installanywhere .product-hero__text {
  max-width: 740px;
  color: #f3f8ff;
}

.product-license-alert {
  margin: 22px 0 18px;
  padding: 18px 20px;
  border: 1px solid #e7c65f;
  border-left: 5px solid #deb408;
  background: #fff9df;
}

.product-license-alert h3 {
  margin: 0 0 8px !important;
  padding-left: 0 !important;
  border-left: 0 !important;
  color: #17324d;
}

.product-license-alert p {
  margin: 0;
  color: #3d4b57;
}

.product-license-table th.product-license-table__current,
.product-license-table td.product-license-table__current,
.product-license-table tbody th:nth-child(2),
.product-license-table tbody td:nth-child(2) {
  background: #f3f9ff;
}

.product-license-table thead th.product-license-table__current {
  color: #ffffff;
  background: #0065bd;
}

.product-license-badge {
  display: inline-block;
  margin-top: 6px;
  padding: 3px 8px;
  border-radius: 3px;
  color: #ffffff;
  background: #8a1f1f;
  font-size: 12px;
  font-weight: 700;
}

.product-license-note {
  margin: 12px 0 26px;
  padding: 12px 14px;
  border-left: 4px solid #8a1f1f;
  background: #fff5f5;
  color: #4b3434;
}

.product-home-section {
  margin: 34px 0;
}

.product-home-section > h2,
.product-note h2 {
  margin-bottom: 18px;
  padding-bottom: 10px;
  border-bottom: 2px solid #dce6ef;
  color: #17324d;
  font-size: 24px;
  font-weight: 700;
}

.product-home-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.product-home-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 20px;
  border: 1px solid #e1e8ef;
  border-top: 4px solid #0065bd;
  background: #ffffff;
}

.product-home-card__eyebrow {
  margin: 0 0 8px;
  color: #60717f;
  font-size: 13px;
  font-weight: 700;
}

.product-home-card h3 {
  margin: 0 0 12px;
  color: #17324d;
  font-size: 24px;
  font-weight: 700;
}

.product-home-card p {
  color: #3d4b57;
  line-height: 1.75;
}

.product-home-card ul {
  margin: 4px 0 0;
  padding-left: 1.2em;
}

.product-home-card li {
  margin-bottom: 6px;
}

.product-home-card .product-cta-row {
  margin-top: auto;
  padding-top: 18px;
}

.product-release-table__date {
  width: 150px;
}

.product-release-table__product {
  width: 210px;
}

.product-release-table td:first-child,
.product-release-table th:first-child {
  white-space: nowrap;
}

@media (max-width: 991.98px) {
  .product-hero__inner,
  .product-summary,
  .product-page .featuresList,
  .product-capability-grid,
  .product-home-grid {
    grid-template-columns: 1fr;
  }

  .product-hero__logo {
    justify-self: start;
  }
}

@media (max-width: 575.98px) {
  .product-hero {
    padding: 22px 18px;
  }

  .product-hero h1 {
    font-size: 26px;
  }

  .product-hero__lead {
    font-size: 18px;
  }

  .product-tabs .nav-link {
    padding: 10px 12px;
  }
}