.content-area {
}
.content-area section {
  margin-bottom: 6.4rem;
}
.content-area h2 {
  font-size: 2.4rem;
  font-weight: 700;
  margin-bottom: 1.6rem;
}
.content-area h3 {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 1.6rem;
}
.content-area h4 {
  font-size: 1.6rem;
  font-weight: 700;
  margin-bottom: 1.6rem;
}
.content-area p {
  font-size: 1.6rem;
  font-weight: 400;
  margin-bottom: 2.4rem;
  line-height: 1.8;
}
.content-area img {
	width: 100%;
    /* 16:9の比率 */
    overflow: hidden;
    border-radius: 10px;
}
.content-area .tel-fax-num {
  font-size: 20px;
  font-weight: 700;
}
.content-area ol,
.content-area ul {
  margin: 0 0 2rem 2rem;
  line-height: 1.8;
}
.content-area ol li,
.content-area ul li {
  margin: 0  0 0.5rem 0;
}
.content-area .colum1-w800 {
  max-width: 800px;
  margin: 0 auto;
}

.content-area table {
  border-top: 1px solid #f0f2f1;
  border-bottom: 1px solid #f0f2f1;
  margin-bottom: 4rem;
  box-sizing: border-box;
}
.content-area th,
.content-area td {
  padding: 16px;
  text-align: left;
}
.content-area th {
  font-weight: 400;
	width: 17%;
}
.content-area tr:nth-child(even) th,
.content-area tr:nth-child(even) td {
  background: #f0f2f1;
}

.content-area a {
  color: #145fa9;
  border-bottom: 1px dotted #145fa9;
  transition: 0.3s;
}
.content-area .link-to-internal:after {
  content: url(/wp-content/themes/faj/img/icon/arrow-right.svg);
  position: relative;
  top: 3px;
  left: 3px;
}
.content-area .link-to-external {
  border-bottom: 1px dotted #145fa9;
}
.content-area .link-to-external:after {
  content: url(/wp-content/themes/faj/img/icon/link-external.svg);
  position: relative;
  top: 3px;
  left: 3px;
}
.content-area .link-to-download:after {
  content: url(/wp-content/themes/faj/img/icon/link-donwload.svg);
  position: relative;
  top: 3px;
  left: 3px;
}
.content-area .link-to-internal:hover,
.content-area .link-to-external:hover,
.link-to-download:hover {
  border-bottom: 1px solid #3c403c;
  transition: 0.3s;
}

.content-area .btn_download_PDF a {
  min-width: 340px;
  font-size: 16px;
  color: #3c403c;
  display: inline-block;
  padding: 0 64px;
  border: 1px solid #dc0015;
  border-radius: 6px;
  height: 64px;
  line-height: 64px;
  background: url(/wp-content/themes/faj/img/icon/icon-PDF.svg) 16px
      center no-repeat,
    url(/wp-content/themes/faj/img/icon/icon-DL-PDF.svg) 95% center
      no-repeat;
}
.content-area .btn_download_Excel a {
  min-width: 340px;
  font-size: 16px;
  color: #3c403c;
  display: inline-block;
  padding: 0 64px;
  border: 1px solid #145fa9;
  border-radius: 6px;
  height: 64px;
  line-height: 64px;
  background: url(/wp-content/themes/faj/img/icon/icon-Excel.svg) 16px
      center no-repeat,
    url(/wp-content/themes/faj/img/icon/icon-DL-Excel.svg) 95% center
      no-repeat;
}
.content-area .btn_download_EXE a {
  min-width: 340px;
  font-size: 16px;
  color: #333;
  display: inline-block;
  padding: 0 24px;
  border: 1px solid #666;
  border-radius: 6px;
  height: 64px;
  line-height: 64px;
  background: url(/wp-content/themes/faj/img/icon/link-donwload.svg)
    95% center no-repeat;
}

.content-area .faq dt,
.content-area .faq dd {
  padding: 16px;
}
.content-area .faq dd {
  background: #f0f2f1;
  margin-bottom: 3.2rem;
  display: flex;
  align-items: center;
}
.content-area .faq .icon_question {
  color: #145fa9;
  font-size: 20px;
  font-weight: 700;
  padding-right: 2rem;
  white-space: nowrap;
}
.content-area .faq .icon_question i {
  color: #fff;
  font-size: 24px;
  padding: 4px 10px;
  font-style: normal;
  background: #145fa9;
  border-radius: 21px;
}
.content-area .faq .icon_answer {
  color: #dc0015;
  font-size: 20px;
  font-weight: 700;
  padding-right: 2rem;
  white-space: nowrap;
}
.content-area .faq .icon_answer i {
  color: #dc0015;
  font-size: 24px;
  padding: 2px 10px;
  font-style: normal;
  background: #fff;
  border: 2px solid #dc0015;
  border-radius: 21px;
}

.content-area ul.start-guide-wrap {
  display: flex;
  margin: 4.8rem 0;
  justify-content: center;
}
.content-area ul.start-guide-wrap li {
  margin-right: 2.4rem;
}
.content-area ul.start-guide-wrap li:last-child {
  margin-right: 0;
}
.content-area ul.start-guide-wrap li a {
  border: 1px solid #145fa9;
  border-radius: 6px;
  padding: 24px;
  font-size: 1.8rem;
  display: block;
  width: 344px;
  text-align: center;
}
.content-area ul.start-guide-wrap li a:hover {
  border: 1px solid #145fa9;
  background: #f0f2f1;
  text-decoration: none;
}

.content-area .new-transaction-flow {
  counter-reset: number;
  list-style-type: none;
  margin-left: 0;
  padding-left: 0;
}
.content-area .new-transaction-flow li {
  font-weight: 700;
  margin-bottom: 1.6rem;
  background: #f0f2f1;
  padding: 16px 16px 16px 80px;
  border-radius: 5px;
  position: relative;
}
.content-area .new-transaction-flow li:before {
  position: absolute;
  counter-increment: number;
  content: counter(number);
  display: inline-block;
  background: #fff;
  color: #145fa9;
  font-weight: 400;
  font-size: 32px;
  border-radius: 50%;
  left: 16px;
  width: 48px;
  height: 48px;
  line-height: 48px;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.content-area .new-transaction-flow li .detail {
  font-weight: 400;
}
.content-area .group-company-logo img {
  border: 1px solid #ddd;
  border-radius: 6px;
}

/* Google Map埋め込み用レスポンシブ対応 */
.map {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9の比率 */
  height: 0;
  overflow: hidden;
}

.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.content-area .irodori-midori-description li,
.content-area .irodori-midori-note li {
  list-style: circle;
  font-weight: 400;
}

.content-area .market-plant .market-plant-facility {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}
.content-area .market-plant .market-plant-facility li {
  width: calc(50% - 16px);
  margin: 0 32px 32px 0;
}
.content-area .market-plant .market-plant-facility li:nth-child(2n) {
  margin-right: 0;
}
.content-area .market-plant .market-plant-facility li h3,
.content-area .market-plant .market-plant-facility li p {
  margin-bottom: 0;
}
.content-area .quality-eco .img_badge img {
  width: 40%;
}
.content-area .treatment .delivery-value {
  margin-bottom: 40px;
}
.content-area .treatment .delivery-value li {
  list-style: circle;
}
.content-area .treatment .delivery-flow {
  margin-bottom: 6.4rem;
}
.content-area .treatment .delivery-flow img {
  width: 60%;
}
.content-area .global .logo_jpec {
  float: right;
  width: 120px;
}

@media screen and (max-width: 768px) {
  .content-area .treatment .delivery-flow img {
    width: 100%;
  }
  .content-area .quality-eco .img_badge {
    text-align: center;
  }
  .content-area .quality-eco .img_badge img {
    width: 70%;
  }
}

@media screen and (max-width: 599px) {
  .content-area ul.start-guide-wrap {
    display: flex;
    flex-flow: column;
    margin: 4.8rem 0;
    justfy-contents: center;
  }
  .content-area ul.start-guide-wrap li {
    width: 100%;
    margin: 0 0 1.6rem 0;
  }
  .content-area ul.start-guide-wrap li a {
    width: 100%;
  }
}

/* 2024.11追加 */

.case-list {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 40px auto;
  padding: 0 20px;
  max-width: 1240px;
}

/* 各記事アイテム */
.case-item {
  flex: 0 0 calc(33.333% - 20px);
  background: #fff;
  overflow: hidden;
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
  transition: box-shadow 0.3s ease;
  position: relative;
}

/* ホバー効果 */
.case-item:hover {
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15);
}

/* 記事リンク */
a.case-item-link {
  display: block;
  text-decoration: none;
  color: inherit;
  height: 100%;
  border: none;
}

/* サムネイル */
.case-thumb {
  aspect-ratio: 16/9;
  overflow: hidden;
}

.case-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
}

/* 記事コンテンツ */
.case-item-content {
  padding: 20px;
}

/* 記事タイトル */
h2.case-title {
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 15px;
  line-height: 1.6;
  color: #333;
}

/* メタ情報（カテゴリと日付） */
.case-meta {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 15px;
  font-size: 14px;
  justify-content: space-between;
}

.case-date {
  color: #666;
  font-size: 14px;
}

.case-category {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 20px;
  border: 1px solid #145fa9;
  color: #145fa9;
}

@media (max-width: 1024px) {
  .case-item {
    flex: 0 0 calc(50% - 15px);
  }
}

@media (max-width: 768px) {
  .case-list {
    gap: 20px;
    padding: 0 15px;
  }

  .case-item {
    flex: 0 0 100%;
  }

  .case-item-content {
    padding: 15px;
  }

  .case-title {
    font-size: 16px;
  }
}

p.usage-list-btn {
  margin: auto;
  text-align: center;
  margin: 30px auto 60px;
}
.usage-list-btn a {
  display: inline-block;
  text-align: center;
  border: 1px solid #145fa9;
  background-color: #fff;
  border-radius: 5px;
  padding: 8px 20px 8px 40px;
  color: #145fa9;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  font-weight: 700;
}
.usage-list-btn a i {
  margin-left: 20px;
  position: relative;
  top: 3px;
}
.usage-list-btn a:hover {
  -webkit-transition: 0.3s;
  transition: 0.3s;
  color: #fff;
  background-color: #145fa9;
}

/* 動画コンテナ */
.usage-movie {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 40px auto;
  padding: 0 20px;
  max-width: 1240px;
}

/* 各動画ボックス */
.movie-box {
  flex: 0 0 calc(50% - 15px); /* 2列レイアウト用 */
  position: relative;
  width: 100%;
}

/* レスポンシブ対応の共通スタイル */
.movie-box iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* アスペクト比を維持するためのラッパー */
.movie-box::before {
  content: "";
  display: block;
  padding-top: 56.25%; /* 16:9のアスペクト比 */
}

/* スマートフォン対応 */
@media screen and (max-width: 768px) {
  .usage-movie {
    gap: 20px;
    padding: 0 15px;
    margin: 30px auto;
  }

  .movie-box {
    flex: 0 0 100%; /* 1列レイアウト */
  }
}

p.headline {
  text-align: center;
  font-size: 18px;
  font-weight: bold;
}

ul.usage-features {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 40px auto;
  padding: 20px 80px;
  max-width: 700px;
  background-color: #f0f2f1;
  border-radius: 5px;
  list-style: none; /* デフォルトのリストスタイルを無効化 */
}

ul.usage-features li {
  display: flex; /* liをFlexコンテナに */
  align-items: center;
  font-size: 18px;
  font-weight: bold;
}

ul.usage-features li::before {
  content: "●";
  flex-shrink: 0; /* バレットが縮まないように */
  margin-right: 16px;
  color: #dc0116;
  line-height: 1.5; /* バレットとテキストの高さを揃える */
}

/* レスポンシブ対応 */
@media screen and (max-width: 768px) {
  p.headline {
    font-size: 16px;
  }
  ul.usage-features {
    padding: 20px;
  }
  ul.usage-features li {
    align-items: flex-start;
  }
}

.faq-container h2.accessory {
  margin-bottom: 30px;
}

/* タブボタン */
.faq-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 2rem;
  justify-content: center;
  border-bottom: 3px solid #145fa9;
}

.tab-button {
  padding: 8px 60px;
  background: #f0f2f1;
  border: none;
  color: #145fa9;
  cursor: pointer;
  font-weight: bold;
  border-radius: 4px 4px 0 0;
  position: relative;
}

.tab-button.active:after {
  content: "";
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #145fa9;
}

.tab-button.active {
  background: #145fa9;
  color: #fff;
}

@media screen and (max-width: 768px) {
  .tab-button {
    padding: 8px 30px;
  }
}

/* 表示制御 */
.faq-item {
  display: none;
}

.faq-item.visible {
  display: flex;
}

.faq-container .faq dt.faq-item,
.faq-container .faq dd.faq-item {
  display: none;
}

.faq-container .faq dt.faq-item.visible,
.faq-container .faq dd.faq-item.visible {
  display: flex;
}

.faq-container {
  margin-bottom: 70px;
}

section.notice-area {
  text-align: center;
}
section.notice-area .irodori-midori-appList {
  justify-content: center;
}

.vision h2 {
  color: #3c403c;
  font-family: "Hiragino Sans";
  font-size: 36px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  margin-bottom: 60px;
}

.vision h3 {
  color: #3c403c;
  font-family: "Hiragino Sans";
  font-size: 24px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
}

.vision img {
  max-width: 600px;
}

@media screen and (max-width: 768px) {
  .vision img {
    max-width: 100%;
  }
}

.compliance h2 {
  color: #145FA9;
  font-family: "Hiragino Sans";
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}


.outline-list-table ul,
.outline-list-table ol {
  list-style-type: disc; /* ●の丸い点をつける */
  padding-left: 1.5em;  /* 点とテキストの間の余白調整 */
  margin: 0 0 1em 1.5em; /* 必要に応じて上下の余白調整 */
}