@charset "utf-8";

/* =======================================

	Customize Style

======================================= */

/* グローバルヘッダー右上のボタン */
#global_header .sub_menu>ul li a {
  display: block;
  background-repeat: no-repeat;
  background-position: left 5% top 50%;
  background-size: 23px;
  text-align: left;
  color: #333;
  text-decoration: none;
  font-size: 14px;
  background-color: #fff;
  border: 2px solid #009944;
  border-radius: 5px;
  line-height: 1.5;
}

#global_header .sub_menu>ul li a.cam {
  padding-top: 1.7rem;
  background-image: url("../img/ico_cam.png");
}

#global_header .sub_menu>ul li a.cam:hover {
  background-image: url("../img/ico_cam1.png");
}

#global_header .sub_menu>ul li a.cam span:first-child {
  letter-spacing: -2.5px;
  line-height: 12px;
}

#global_header .sub_menu>ul li a.shop {
  padding-top: 1.7rem;
  background-image: url("../img/ico_shop.png");
  background-size: 25px;
  background-position: left 24% top 50%;
}

#global_header .sub_menu>ul li a.shop:hover {
  background-image: url("../img/ico_shop1.png");
}

#global_header .sub_menu>ul li a.shop span:first-child {
  letter-spacing: -3.5px;
  line-height: 12px;
}

#global_header .sub_menu>ul li a{
  color: #009944;
}

#global_header .sub_menu>ul li a:hover {
  color: #fff;
  background-color: #009944;
}

/* グローバルヘッダーハンバーガーメニュー */
#global_header .hamburger.sp {
  position: relative;
  z-index: 3;
  width: 60px;
  height: 60px;
  margin: 0 0 0 3px;
  cursor: pointer;
  text-align: center;
  background-color: #333;
  display: none;

}

@media only screen and (max-width: 768px) {
  .hamburger.sp {
    display: block;
  }
}

#global_header .hamburger span:nth-child(1) {
  top: 20px;
}

#global_header .hamburger span:nth-child(2) {
  top: 30px;
}

#global_header .hamburger span:nth-child(3) {
  top: 40px;
}

.global_menu_sp {
  position: fixed;
  z-index: 2;
  top: 80px;
  left: 100vw;
  color: #222;
  background: #fff;
  text-align: center;
  width: 100%;
  height: 100vh;
  opacity: 0;
  transition: opacity .6s ease, visibility .6s ease;
}

.global_menu_sp ul {
  margin: 0 auto;
  padding: 0;
  width: 100%;
  height: 74%;
  overflow-y: scroll;
}

.global_menu_sp ul li {
  position: relative;
  list-style-type: none;
  margin: 0 auto;
  width: 90%;
  color: #333;
  border-bottom: solid 1px #8C9BA5;
  transition: .4s all;
  font-size: 1.6rem;
}

.global_menu_sp ul li a {
  padding-left: 20px;
}

.global_menu_sp ul li a::before {
  content: '';
  position: absolute;
  left: 0px;
  top: 30px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 6px 0 6px 10px;
  border-color: transparent transparent transparent #009944;
}

.global_menu_sp ul li:first-child {
  padding: 30px 0;
  font-size: 2rem;
}

/* グローバルナビの区切り点の色 */
#global_nav {
  border-top: none;
  text-align: left;
}

#global_nav ul {
  display: block;
  width: 90%;
  max-width: 1280px;
  height: 70px;
  margin: 0 auto;
}

#global_nav ul li {
  margin: 0 1.4em;
  padding: 0;
  font-weight: bold;
}

#global_nav ul li:nth-child(n+2)::before {
  content: none;
}

#global_nav ul li::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0;
  bottom: 0;
  background: #009944;
  transition: .3s;
  opacity: 0;
}

#global_nav ul li:hover::after {
  opacity: 1;
}

#global_nav a.active {
  color: #009944;
}

#global_nav a.active:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 4px;
  left: 0;
  bottom: -15px;
  background: #009944;
}

/* コンテンツヘッダー */
.cont_header {
  background: #F5F5F5;
 z-index: -10;
}

.reco .cont_header{
  height: 103px;
  display: flex;
  align-items: center;
}

.reco .cont_header h1{
  color: #009944;
}

.reco .visual h1{
  font-size: 26px;
}

.cont_header.visual .catch {
  color: #002d78;
}

/* コンテンツ中のボタン */
.btn_area a:link, .btn_area a:visited, .btn_area a:active, .btn_area a:hover {
  color: #009944;
}

/* グローバルフッター */
#global_footer #cont_menu {
  margin-top: 0;
}

#global_footer nav.ft_menu {
  background: #d5f3d9;
  height: 60px;
}

#global_footer nav.ft_menu a {
  font-size: 18px;
  color: #333333;
}

#global_footer .ft_menu li a::after {
  border-color: transparent transparent transparent #009944;
}


#global_footer .copy {
  color:#000000;
  background: #FFFFFF;
  margin-bottom: 0 !important;
}

/* sp版トップへ戻るボタン */
#page_top {
  background: #fff;
  border: 3px solid #009944;
  color: #009944;
  font-weight: bold;
  background-color: #009944;
}

a#page_top {
  padding-top: 3rem;
}

/* 線の矢印（∧）を2本の線で描く */
#page_top::before,
#page_top::after{
  content:"";
  position:absolute;
  left:50%;
  width:17px;                    /* 矢印の横幅 */
  height:17px;                   /* 高さ（線の長さ） */
  border-top:2px solid #fff;     /* 線の太さ・色 */
  transform-origin:50% 50%;
}

/* 左上がりの線「／」 */
#page_top::before{
  transform: translate(-50%,-55%) rotate(45deg);
}
/* 右上がりの線「＼」 */
#page_top::after{
  transform: translate(-50%,-55%) rotate(-45deg);
}
/* ------------------------------------

	Overwrite IndexElements

------------------------------------ */
#pg_index section {
  margin: 0 auto 50px;
}

#pg_index h1 {
  display: flex;
  align-items: baseline;
  flex-direction: column;
}

#pg_index h1 span {
  color: #009944;
  background: #fff;
  font-size: 20px;
  margin-left: 1.65em;

  padding: 10px 15px;

  border: 1px solid #009944;
  order: -1;
}

#pg_index h1 small {
  display: inline-block;
  font-size: 18px;
  order: 3;
}

.cont_index li::before {
  content: none;
}

.cont_index li a {
  padding: 0;
  display: block;
}

.cont_index li a::before, .cont_index li a::after {
  content: none;
}

.cont_index li p {
  margin-bottom: 0 !important;
  position: relative;
}

.cont_index li p.other::after {
  border-color: transparent transparent transparent #9c0000;
}

.cont_index li:hover p::after {
  right: 25px;
}

.cont_index li:hover p.other::after {
  right: 35px;
}

.cont_index li span {
  font-weight: normal;
  display: block;
  font-size: 16px;
}

/* ------------------------------------

	Overwrite ContentsElements

------------------------------------ */
/* 共通 */
html {
  font-family: Hiragino Sans Pr6N;
}

h1 {
  color: #fff;
}

h2 {
  border-left:5px solid #009944;
  background-color: #EAEAEA;
  font-size: 20px;
  color: #009944;
  margin-bottom: 30px;
  padding:5px 15px;
}

img {
  image-rendering: -webkit-optimize-contrast;
}

p {
  font-size: 16px;
  margin-bottom: 50px !important;
}

main figure {
  text-align: center;
}

section.mb_100 {
  margin-bottom: 100px !important;
}

.flex {
  display: flex;
  justify-content: space-between;
      max-width: 720px;
}

.flex figure {
  margin-right: 0;
  margin-left: 0;
}

figcaption {
  font-size: 14px;
}

.btn_area a {
  font-weight: bold !important;
  border: 1px solid #009944;
}

body .btn_area a:hover {
  color: #fff;
  background-color: #009944 !important;
  border-color: #009944;
}

hr {
  width: 200px;
  border: 1px solid #B2B2B2;
  margin-bottom: 100px;
}

.base_wrap.mb_0 {
  margin-bottom: 0;
}

.attention {
  font-size: 14px;
}

.attention_text {
  margin: -2.1em 0 20px 3em !important;
  font-size: 14px;
}

.attention_kome+p {
  margin: -2.25em 0 20px 2em !important;
}

.attention_kome+p.mb_0 {
  margin-bottom: 0 !important;
}

ul.disc li {
  position: relative;
  padding-left: 1.5em;
}

ul.disc li::before {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  background: #B2B2B2;
  left: 0;
  top: 10px;
  border-radius: 50px;
}

/* 本文中のリンク */
main a:link, main a:visited, main a:active, main a:hover {
  font-weight: bold;
}

@media print, screen and (min-width: 769px) {
  #global_nav ul li {
    font-size: 16px;
    position: relative;
  }

  #global_nav ul li a.active:after {
    bottom: 0px;
  }
}

/* footer pc版*/
@media print, screen and (min-width: 868px) {
  #cont_menu ul li:nth-of-type(2) {
    text-align: center;
  }

  #cont_menu ul li:nth-of-type(3) {
    text-align: right;
  }

  #cont_menu ul li:nth-of-type(4) {
    margin-right: 3.7em;
    white-space: nowrap;
  }
}

/*フッター部分のスマートフォン時の横幅100%　オーバーライド */
@media only screen and (max-width: 768px) {
  #cont_menu ul li {
    width: 100% !important;
    text-align: start;
  }
}

#cont_menu ul li {
  margin: 0;
  padding: 0 0 30px;
  width: calc(800px/3);
}

.home_area ul {
  display: flex;
  justify-content: center;
}

.home_area ul li {
  padding: 0 5px;
  box-sizing: border-box;
}

.home_area ul li img {
  max-width: 100%;
}

/* header背景設定 */
#pg_index .cont_header.visual {
  height: 290px;
   transform: none !important;
}

/* 親要素 */
#pg_index .cont_header.visual {
  position: relative;
  overflow: hidden; /* 背景がはみ出すのを防ぐ */
}



/* 擬似要素（背景画像を出す） */
#pg_index .cont_header.visual::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;

  /* 背景設定 */
  background-image: url("../img/top_header.jpeg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 60% !important; /* ← 中央を基準にトリミング */
  transform: none; /* 念のため、前の指定を無効化 */
  right: auto;     /* 念のため右固定を解除 */
}



.contents-1 .cont_header.visual.large.message {
  height: 480px;
}

.contents-2 .cont_header.visual, .contents-3 .cont_header.visual, .contents-4 .cont_header.visual {
  height: 240px;
}

/* .contents-1 .cont_header.visual.large.message::after {
  background: url(../img/contents-1/top_header.png) right no-repeat;
  background-color: #F2F2F2;
   background-size: 900px auto; 
} */

.contents-2 .cont_header.visual.summary::after {
  content:"";
  position:absolute; inset:0;
  background:
    /* ← 黒半透明グラデーション（左→右） */
    linear-gradient(
      to right,
      rgba(0,0,0,.60) 0%,
      rgba(0,0,0,.25) 60%,
      rgba(0,0,0,0)   90%
    ),
    /* ← もともとの画像 */
    url("../img/contents-2/top_header.png") center / cover no-repeat;
  pointer-events:none;
}



.contents-3 .cont_header.visual.feature::after {
  content:"";
  position:absolute; inset:0;
  background:
    /* ← 黒半透明グラデーション（左→右） */
    linear-gradient(
      to right,
      rgba(0,0,0,.60) 0%,
      rgba(0,0,0,.25) 60%,
      rgba(0,0,0,0)   90%
    ),
    /* ← もともとの画像 */
    url("../img/contents-3/top_header.png") center / cover no-repeat;
  pointer-events:none;
}

.contents-4 .cont_header.visual.feature::after {
  content:"";
  position:absolute; inset:0;
  background:
    /* ← 黒半透明グラデーション（左→右） */
    linear-gradient(
      to right,
      rgba(0,0,0,.60) 0%,
      rgba(0,0,0,.25) 60%,
      rgba(0,0,0,0)   90%
    ),
    /* ← もともとの画像 */
    url("../img/contents-4/top_header.png") center / cover no-repeat;
  pointer-events:none;
}

/* @media (max-width: 888px) {
  .contents-1 .cont_header.visual.large.message::after {
    background-position: bottom right -120px !important;
  }
} */



/*contents-1 社長インタビュー*/
.contents-1 .cont_header.visual h1 {
  margin-bottom: 29px;
  line-height: 1.4em;
  font-size: 50px;
}

.contents-1 .cont_header.visual h1 small {
  margin-bottom: 6px;
  line-height: 1.4em;
}

.contents-1 .cont_header.visual h1 span {
  display: table;
  background: #009944;
  font-size: 26px;
  color: #FFF;
  width: auto;
  padding-left: 18px;
  padding-right: 18px;
  margin-top: 20px;
  margin-bottom: 10px;
}

.contents-1 a.none::after {
  content: none;
}
.contents-1 .flex{
    gap: 40px;
    margin-left: -20px;
}
@media print, screen and (min-width: 769px) {
.contents-1 figure.mb_0 {
  margin-bottom: 0;
}
}


.contents-1 figure.end{
margin-bottom:0;
}
/*contents-2 決算サマリー*/
.contents-2 dl {
  height: 100px;
  border: 1px solid #009944;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.contents-2 dl dt {
  width: 35%;
  background: #009944;
  height: 100px;
  color: #fff;
  padding-top: 25px;
}

.contents-2 dl dd {
  width: 65%;
}

.contents-2 dl dd span {
  font-size: 50px;
}

dl.border-radius {
  height: 60px;
  background: #F1EEE9;
  border: none;
  border-radius: 50px;
  margin-top: 98px;
  margin-bottom: 50px;
}

dl.border-radius dt {
  color: #009944;
  background: none;
  padding: 0;
  text-align: right;
  height: auto;
  width: 38%;
  position: relative;
}

dl.border-radius dt::after {
  content: "";
  position: absolute;
  border: 1px solid #009944;
  height: 24px;
  transform: translate(30px, 11px);
}

dl.border-radius dd small {
  font-size: 16px;
}

.contents-2 h3.pink::before {
  border-color: #DC3A86;
}

.contents-2 h3.green::before {
  border-color: #009E84;
}

.contents-2 h3.blue::before {
  border-color: #006DB9;
}

.contents-2 h3.purple::before {
  border-color: #8E60A2;
}

.contents-2 .flex {
  align-items: center;
  justify-content: space-between;
}

.contents-2 .flex>div {
  width: 70%;
}

.contents-2 figcaption {
  padding-top: 14px;
}

.contents-2 ul.disc {
  margin-bottom: 100px;
}

.contents-2 .btn_area a::after, .contents-3 .btn_area a::after {
  right: inherit;
}

.contents-2 .mb-140 {
  margin-bottom: 143px;
}

/* contents-3.html 特集*/
.contents-3 h3, .contents-4 h3 {
  font-size: 20px;
  color: #009944;
  margin-bottom: 20px !important;
}

.contents-3 figure.mb_0 {
  margin-bottom: 0;
}

.contents-3 .flex figure figcaption {
  text-align: center;
}

.contents-3 .flex .btn_area {
  margin-bottom: 0;
}

.contents-3 .flex.center {
  align-items: center;
  justify-content: center;
}

.contents-3 .flex.center div {
  margin: 0;
}

.contents-3 .flex.center div span {
  text-align: center;
  display: block;
  font-size: 14px;
}

/* contents-4.html 株主様限定*/
.contents-4 .mb_130 {
  margin-bottom: 130px;
}

.contents-4 dl {
  display: flex;
  /*flex-direction: row;*/
  align-items: center;
  background: #B2B2B2;
  height: auto;
  margin-bottom: 20px;
}

.contents-4 dl:last-child {
  margin-bottom: 0;
}

.contents-4 dl dt {
  width: 140px;
  color: #fff;
  font-weight: bold;
  text-align: center;
}

.contents-4 dl dd {
  background: #fff;
  width: 660px;
  padding-left: 20px;
}

.contents-4 dl dd ul li {
  position: relative;
  padding-left: 20px;
}

.contents-4 dl dd ul li::before {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  background: #009944;
  top: 10px;
  left: 2px;
  border-radius: 50%;
}

.contents-4 dl dd p {
  font-size: 14px;
  margin-bottom: 0 !important;
}

.contents-4 p.mb_20 {
  margin-bottom: 20px !important;
}

.contents-4 ul.disc li::before {
  background: #009944;
}



.contents-4 a.none::after {
  content: none;
}

/* footer */
#global_footer .home_area img {
  max-height: 60px;
}

  .br-768{
    display: none;
  }

/************************ スマートフォン用オーバーライド *****************************/
/* @media print, screen and (max-width: 1460px) {
  .contents-1 .cont_header.visual h1 {
    font-size: 35px;
  }
} */

@media print, screen and (max-width: 1190px) {

  #pg_index .cont_header .wrap {
    margin-left: auto;
  }

  /* .contents-1 .cont_header.visual h1 {
    font-size: 30px;
  } */
}

@media only screen and (max-width: 440px) {
    .contents-1 .cont_header.visual h1 {
    font-size: 25px;
  }
}

@media screen and (max-width: 1150px) {
  #pg_index .btn_area.flex {
    display: block;
    margin-top: 30px;
  }

  #pg_index .btn_area.flex a, #pg_index .btn_area.flex a:nth-child(2) {
    margin: 10px auto;
    display: block;
  }
}

@media print, screen and (max-width: 1050px) {
  .contents-1 .cont_header.visual h1 span {
    font-size: 22px;
  }
    .contents-1 .cont_header.visual h1 {
    font-size: 30px;
  }
.cont_header.visual.large .wrap::before{
  margin-right: none;
}

}

@media print, screen and (max-width: 1028px) {
  #pg_index .cont_header.visual::after {
    background-position: right;
  }

  #pg_index h1 {
    text-align: center;
    align-items: center;
  }

  #pg_index h1>* {
    order: 0 !important;
  }
}

@media only screen and (max-width: 768px) {

  body {
    padding-top: 80px;
  }

  #global_header .wrap {
    height: 80px;
  }

  /* nav */
  #global_header .sub_menu>ul li {
    height: 60px;
  }


  #pg_index h1 span {
    margin: 0;
  }

  .cont_index li {
    width: 80%;
    margin: 20px auto;
  }

  .cont_index li::before {
    content: "";
    height: 175px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border-radius: 20px 20px 0 0;
    padding-top: 0px;
  }

  .cont_index li:nth-child(4n) {
    margin-right: auto;
  }

  #global_footer nav.ft_menu {
    height: auto;
  }

  /*共通*/
  .flex {
    display: block;
  }

  h2 {
    font-size: 20px;
  }

  /*sp版ヘッダー背景画像*/
  .contents-2 .cont_header.visual .wrap, .contents-3 .cont_header.visual .wrap, .contents-4 .cont_header.visual .wrap {
    margin-top: 20px;
  }

  .contents-2 .cont_header.visual.summary::after {
    content:"";
    position:absolute; inset:0;
    background:
      /* ← 黒半透明グラデーション（左→右） */
      linear-gradient(
        to right,
        rgba(0,0,0,.60) 0%,
        rgba(0,0,0,.25) 60%,
        rgba(0,0,0,0)   90%
      ),
      /* ← もともとの画像 */
      url("../img/contents-2/top_header.png") center / cover no-repeat;
    pointer-events:none;
  }

  .contents-3 .cont_header.visual.feature::after {
    content:"";
    position:absolute; inset:0;
    background:
      /* ← 黒半透明グラデーション（左→右） */
      linear-gradient(
        to right,
        rgba(0,0,0,.60) 0%,
        rgba(0,0,0,.25) 60%,
        rgba(0,0,0,0)   90%
      ),
      /* ← もともとの画像 */
      url("../img/contents-3/top_header.png") center / cover no-repeat;
    pointer-events:none;
  }

  .contents-4 .cont_header.visual.feature::after {
    content:"";
    position:absolute; inset:0;
    background:
      /* ← 黒半透明グラデーション（左→右） */
      linear-gradient(
        to right,
        rgba(0,0,0,.60) 0%,
        rgba(0,0,0,.25) 60%,
        rgba(0,0,0,0)   90%
      ),
      /* ← もともとの画像 */
      url("../img/contents-4/top_header.png") center / cover no-repeat;
    pointer-events:none;
  }

  .contents-2 dl {
    flex-direction: column;
    height: auto;
  }

  .contents-2 dl.border-radius {
    padding-left: 20px;
  }

  .contents-2 dl.border-radius dt {
    text-align: left;
    min-width: 240px;
  }

  .contents-2 dl dt {
    font-size: 18px;
    padding-top: 0px;
    width: 100%;
    height: auto;
  }

  .contents-2 dl dd {
    font-size: 20px;
    line-height: 1.7em;
    text-align: left;
    padding: 5px 0px;
    width: auto;
  }

  .contents-2 dl dd span {
    font-size: 40px;
  }

  .contents-2 dl.border-radius dt {
    padding: 0;
    width: auto;
  }

  .contents-2 dl.border-radius dt::after {
    height: 45px;
    transform: translate(15px, -5px);
    display: none;
  }

  .contents-2 dl.border-radius dd {
    line-height: 1.5;
    min-width: 240px;
    border-top: 1px solid #009944;
  }

  .contents-2 dl.border-radius dd small {
    display: block;
  }

  .contents-2 figcaption span:first-child {
    margin-right: 15px;
  }

  /* contents-1 */
  .cont_header.visual.large .wrap {
    background: #F1EEE9;
    margin: 0;
    width: 100%;
  }

  /* contents-2 */
  .contents-2 .mb-140 {
    margin-bottom: 0px;
  }

  /* contents-3 */
  .contents-3 .flex figure figcaption {
    text-align: center;
  }

  .contents-4 dl {
    background: none;
    flex-direction: column;
  }

  .contents-4 dt {
    background: #B2B2B2;
    width: 100% !important;
  }

  .contents-4 dd {
    width: 100% !important;
  }

  /*footer*/
  #global_footer nav.ft_menu a {
    font-size: 16px;
  }

  #cont_menu {
    margin-bottom: 0;
    background: #EAEAEA;
    padding: 15px 0 0;
  }

  #cont_menu ul li {
    padding: 15px 0px;
    width: calc(100% - 30px) !important;
    margin: 0 15px !important;
    border-bottom: 1px solid #009944;
    font-weight: bold;
  }

  #cont_menu ul li:last-child {
    border: none;
  }

  #cont_menu ul li a::before {
    /* top: 3px; */
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 5px 10px;
    border-color: transparent transparent transparent #009944;
  }

  #cont_menu ul li br.pc {
    display: none;
  }

  .home_area ul {
    display: block;
  }

  .br-768{
    display: block;
  }
}

@media screen and (max-width: 868px) {
  #cont_menu ul {
    justify-content: space-between;
  }

  #cont_menu ul li {
    width: 45%;
  }
}

/* contents1用*/
/* メッセージのPC版時の表示位置調整 */
@media only screen and (max-width: 768px) {
  .cont_header.visual h1 {
    font-size: 30px;
    /* margin-top: 50px; */
  }

  #global_header .sub_menu>ul li a {
    width: 60px;
    flex-direction: column;
    padding: 32px 0 0 !important;
    font-size: 1rem;
    background-position: center 5px !important;
    line-height: 1.1;
    background-size: 20px;
    text-align: center;
  }

#global_header .sub_menu li a.shop {
  letter-spacing: 1px;
}



  #global_header .sub_menu>ul li a.shop {
    background-size: 20px;
    padding: 38px 0 0 !important;
    background-position: center 10px !important;

  }

  #global_header .sub_menu>ul li a:hover {
    background-color: #009944 !important;
    color: #fff !important;
  }

  .global_menu_sp ul li:first-child {
    color: #333;
  }

  .contents-1 .cont_header.visual.large.message {
    height: auto;
  }

  .cont_header.visual.large .wrap {
    display: flex;
    flex-direction: column;
  }

  .cont_header.visual.large .wrap h1 {
    order: -2;
  }

  .cont_header.visual.message .wrap::after {
    content: '';
    background: transparent url("../img/contents-1/top_sp_header.png") top center;
    background-size: cover;
    display: block;
    width: 100%;
    height: 80vw;
    order: -1;
  }

  .contents-1 .cont_header.visual.large.message::after {
    content: none;
  }

  .cont_header.visual h1 small {
    font-size: 14px;
  }

  .cont_header.visual.large .wrap h1 {
    background: #F1EEE9;
    margin: 20px;
  }

  .cont_header.visual.large .wrap {
    padding-bottom: 0px;
    margin-bottom: 5px;
  }

  .cont_header.visual.large p {
    background-color: #F1EEE9;
    width: calc(100vw - 2%);
    padding: 25px 8%;
    margin-top: 0px;
    margin-left: calc(-50vw + 50%);
    margin-bottom: 0 !important;
  }
}

@media print, screen and (max-width: 658px) {
  .contents-2 .cont_header.visual.summary::after {
    content:"";
    position:absolute; inset:0;
    background:
      /* ← 黒半透明グラデーション（左→右） */
      linear-gradient(
        to right,
        rgba(0,0,0,.60) 0%,
        rgba(0,0,0,.25) 60%,
        rgba(0,0,0,0)   90%
      ),
      /* ← もともとの画像 */
      url("../img/contents-2/header_sp.png") center / cover no-repeat;
    pointer-events:none;
  }



  .contents-3 .cont_header.visual.feature::after {
    content:"";
    position:absolute; inset:0;
    background:
      /* ← 黒半透明グラデーション（左→右） */
      linear-gradient(
        to right,
        rgba(0,0,0,.60) 0%,
        rgba(0,0,0,.25) 60%,
        rgba(0,0,0,0)   90%
      ),
      /* ← もともとの画像 */
      url("../img/contents-3/header_sp.png") center / cover no-repeat;
    pointer-events:none;
  }

  .contents-4 .cont_header.visual.feature::after {
    content:"";
    position:absolute; inset:0;
    background:
      /* ← 黒半透明グラデーション（左→右） */
      linear-gradient(
        to right,
        rgba(0,0,0,.60) 0%,
        rgba(0,0,0,.25) 60%,
        rgba(0,0,0,0)   90%
      ),
      /* ← もともとの画像 */
      url("../img/contents-4/header_sp.png") center / cover no-repeat;
    pointer-events:none;
  }
}
/* append */
.marker_or {
  background: linear-gradient(transparent 60%, #FFEBBF 60%);
  font-weight: bold;
}

.home_area a.name:hover img {
  opacity: 0.7;
}

.marker_yel {
  background: linear-gradient(transparent 0%, #fff799 0%);
}

/* vol24 addition */
.contents-1 .c2025 dt {
  font-weight: bold;
}

contents-1 .c2025 dt::before {
  content: attr(data-count) ". ";
}

contents-1 .c2025 dd {
  margin-bottom: 30px;
}

.contents-2 .flex {
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: stretch;
}

.contents-2 .flex figure {
  width: calc(50% - 19px);
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 65px;
  break-inside: avoid;
}

@media only screen and (max-width: 768px) {
  .contents-2 .flex figure {
    width: 100%;
    margin-bottom: 65px;
  }
}

.contents-3 .flex figure {
  align-self: end;
}

.contents-3 table th {
  background-color: #f1eee9;
  white-space: nowrap;
  padding: 20px;
  border: solid 1px #ccc9c9;
}

.contents-3 table {
  border: solid 1px #ccc9c9;
  border-collapse: collapse;
}

.contents-3 table td {
  border: solid 1px #ccc9c9;
  padding: 20px;
}

.contents-3 dl.detail dt {
  font-weight: bold;
}

.contents-3 dl.detail dt:before {
  content: "・";
  display: inline-block
}

.contents-3 dl.detail dd {
  margin-bottom: 30px;
}

.contents-3 .flex.mb-50 {
  margin-bottom:50px;
}
.contents-3 .flex figure {
  flex-basis: 100%;
  align-self: initial;
}

.contents-3 .flex figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.contents-3 .flex figure figcaption {

  display: block;
}

@media only screen and (max-width: 768px) {
  .contents-3 .flex figure img {
    width: 495px;
    height: 278px;
  }

  .contents-3 .flex figure figcaption {
    position: static;
    display: block;
  }
}


/* 2024年度 ネットで株通対応 */
main#pg_index .cont_header.visual {
  height: 290px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 90px;
  position: relative;
  background: transparent;
  text-align: center;
}

@media (max-width: 768px) {
	main#pg_index .cont_header.visual  {
		margin: 0 0 2.5rem;
	}
}

main#pg_index h1 {
  display: flex;
  flex-direction: column;
  position: relative;
  color: #fff;  
  text-shadow: 0px 0px 5px #009944;
}

main#pg_index h1 span {
  padding: 6px 10px;
  color: white;
  display: inline-block;
  position: relative;
  margin-top: 10px;
  transform: translateX(0%) skewY(0deg);
  order: 0;
  background: none;
  border: none;
  line-height: 1em;
}

/* 平行四辺形部分 */
main#pg_index h1 span::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #009944;
  z-index: -1;
border-radius: 4px;

}

/* main#pg_index h1 small {
  display: inline-block;
  font-size: 20px;
  order: 3;
  padding: 0 0 0 9.5px;
  margin-left:4px;
  border-left:1px solid #FFF;
} */
/*----*/
.cont_index li.cont_page04 {
  background: url("../img/img04_b4.png") top no-repeat;
  color: #999;
}

.cont_index li p.other::after {
  border-color: transparent transparent transparent #009944;
}




/* スマホ対応 */
@media only screen and (max-width: 375px) {
  main#pg_index .cont_header.visual::after {
    background: url(../img/top_sp-header.png) bottom no-repeat;
    background-size: cover;
  }

  main#pg_index .cont_header .wrap {
    width: 100%;
  }

  main#pg_index h1 {
    text-align: center;
    align-items: center;
    font-size: 30px;
  }

  main#pg_index h1 span {
    padding: 4px 9px;
    transform: none;
    background: #009944;
    color: white;
    margin-top: 19px;
    font-size: 16px;
      border-radius:4px;
  }


  main#pg_index h1 small {
    display: inline-block;
    font-size: 16px;
    order: 3;

  }

  .br_pc {
    display: none;
  }

  /* TOPページ 各コンテンツ部分 */
  .cont_index li {
    width: 100%;
    margin: 10px auto;
  }

  /* 平行四辺形部分解除 */
  main#pg_index h1 span::before {
    content: none;
  }

  .base_wrap {
    width: 94%;
    max-width: 800px;
    margin: 0 10px 50px 10px;
    position: relative;
  }
}

/* contents-2 */
.contents-2 .attention_note+p {
  margin: -2em 0 20px 3.4em !important;
}

/* contents-3 */
.contents-3 .br_tb {
  display: none;
}
.br_sp{
display: none;
}
/* タブレット表示時: 改行あり */
@media only screen and (min-width: 768px) and (max-width: 1280px) {
  .br_tb {
    display: block;
  }

}
@media only screen and (width < 768px ) {
  .br_sp {
    display: block;
  }
}



/* ------------------------------------
	contents-1
------------------------------------ */
/* 基準にする親要素 */
.contents-1 .cont_header.visual.large .wrap {
  align-self: stretch;        /* 親の高さまで伸ばす（画像用） */
  position: relative;         /* ::before の基準 */
  
  display: flex;              /* 中身をflexに */
  flex-direction: column;     /* h1 → p を縦に並べる */
  justify-content: center;    /* 縦方向センター寄せ */
}


.contents-1 .cont_header.visual.large .wrap::before {
  content: "";
  position: absolute;
  inset: 0; 
  background-image: url("../img/contents-1/top_header.png");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: contain;
  z-index: 0;
  align-items: none;

}

.contents-1 .sign{
  margin-bottom: 2.8rem !important;

}

@media (max-width: 827px) and (min-width: 769px) {
  .contents-1 .cont_header.visual.large .wrap::before {
    right: -4%;   /* ← wrap の右余白（100%−92%の半分）だけ外側へ */
  }
}

@media(max-width: 768px) {
  .contents-1 .cont_header.visual.large .wrap::before {
  background-image: none;
  }

}

  @media print, screen and (max-width: 768px) {
    .contents-1 .cont_header.visual h1 {
     font-size: min(40px, 6.7vw);
    }
}

.contents-1 h1{
  color: #000;
}

.contents-1 .h1-color{
  color: #009944;
}

/* -------------------------------- */
/*             　　表                */
/* -------------------------------- */
/* 色トークン（必要に応じて調整） */
:root{
  --brand:#009944;
  --brand-weak:#e6f6ec;
  --line:#222;
}

/* 枠（横いっぱい使いたいときは親のpaddingを調整） */
.contents-1 .dv-table-wrap{ background:#fff; }

/* テーブル本体 */
.contents-1 .dv-table{
  width:100%;
  border-collapse: collapse;
  table-layout:fixed;
  font-feature-settings:"palt";
  border-bottom: 2px solid var(--line);
}


/* ヘッダー行 */
.contents-1 .dv-table thead th{
  display: table-cell;
  font-weight:700;
  text-align:center;
  padding:.75rem .5rem;
  border-bottom:1px solid var(--line);
  border-top:2px solid var(--line);
  color:#fff;
  line-height:1.5;
  vertical-align:middle;
}


/* 行見出し（前期/当期） */
.contents-1 .dv-table .rowhead{
  width:5em;
  text-align:left;
  padding:.75rem .75rem .75rem 1rem;
  white-space:nowrap;
  border-top:1px solid var(--line);
  font-weight: bold;
  background:#D5F3D9;
}

@media (max-width: 767px){
.contents-1 .dv-table .rowhead{
  padding:.75rem .75rem;
}
}

.contents-1 .dv-table tbody tr:first-child .rowhead{ border-top:none; }

/* セル共通 */
.contents-1 .dv-table td{
  padding:.5rem .5rem .75rem;
  text-align:center;
  vertical-align:middle;
  border-top:1px solid var(--line);
}
.contents-1 .dv-table tbody tr:first-child td{ border-top:none; font-weight: bold;}

/* 数値の大きさ */
.contents-1 .dv-table .v{ font-size:20px;  color:#111; }
.contents-1 .dv-table .big{ font-weight: bold; letter-spacing:.02em; }

/* （予定）などの注記 */
.contents-1 .dv-table .note{ display:block; margin-top:.15rem; color:#2a2a2a; font-size:12px; }

.contents-1 .dv-table tr.current th,
.contents-1 .dv-table tr.current td{
  background:#009944;
  color:#fff;
}

.contents-1 .dv-table tr.current td{
  line-height: 1;   /* color指定は消す */
}
.contents-1 .dv-table tbody tr.current td{
  color:#fff;       /* or 少し薄い白でもOK */
}

.contents-1 .dv-table tbody tr.current td .note{
  color: #009944;          /* 少し落とした色など */
}

.contents-1 .br-768{
  display: none;
}

  .contents-1 .base_wrap{
    margin-bottom: 150px;
  }

@media (max-width: 767px) {
.contents-1 .br-768{
  display: inline;
}

.contents-1 .dv-table .v{ font-size:15px;  color:#111; }

.contents-1 .dv-table .rowhead {
  font-size: 14px;
}
  
}
/* -------------------------------- */
/*             表end                */
/* -------------------------------- */


.contents-1 .p-right{
  display: block;
  text-align:right;  
}



/* ------------------------------------
	contents-2
------------------------------------ */

.contents-2 .topic-line{
  --tri: 8px;
  --tri-color: var(--main-color, #0a9638);
  display: grid;
  grid-template-columns: auto auto 1fr; /* [label][tri][text] */
  grid-template-rows: auto auto;       
  column-gap: .6rem;
  align-items: start;                   /* ← 上揃えに統一 */
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 1rem;
}

/* ラベル（1行固定） */
.contents-2 .topic-line .label{
  grid-column: 1; grid-row: 1;
  color:#009944;
  font-weight:700;
  white-space: nowrap;
  align-self: start;                   
}

/* 三角（1行目だけ・縦位置を行の中で調整） */
.contents-2 .topic-line .tri{
  grid-column: 2; grid-row: 1;
  width:0; height:0;
  border-left: calc(var(--tri) * 1.4) solid var(--tri-color);
  border-top:  var(--tri) solid transparent;
  border-bottom: var(--tri) solid transparent;
  align-self: start;
  margin-top:0.5rem;
}

/* 1行目・2行目の本文 */
.contents-2 .topic-line .t1{ grid-column:3; grid-row:1; font-weight:700; }

@media (max-width:480px){
  .contents-2 .topic-line{ font-size:14px; --tri: 8px; }
}


/* 色（必要に応じて変更） */
.contents-2 .kpi-grid{ --green:#009944; --border:#2dbb73; }

/* 2カラム配置 */
.contents-2 .kpi-grid{
  display:grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap:48px;
  align-items:start;
  margin-bottom: 5rem;
}

/* カード */
/* 緑の見出し帯 */
.contents-2 .kpi-head{
  background:var(--green);
  color:#fff;
  text-align:center;
  font-weight:700;
  padding:.3rem 1rem;
}

/* 大きな数値の枠 */
.contents-2 .kpi-value{
  margin:.8rem 0 .4rem;
  text-align:center;
  padding:.4rem .8rem;
}

/* 数値と単位 */
.contents-2 .kpi-value .num{
  font-size:40px;
  line-height:1.1;
  font-weight:800;
  color:var(--green);
  letter-spacing:.02em;
}
.contents-2 .kpi-value .unit{
  margin-left:.25rem;
  font-size:16px;
  font-weight:700;
  color:#222;
  vertical-align:baseline; /* 数字のベースラインに沿わせる */
}

/* 前年同期比の行 */
.contents-2 .kpi-compare{
  text-align:center;
  font-size:16px;
  font-weight: bold;
}
.contents-2 .kpi-compare b{ 
  font-weight:800; 
  color:var(--green); 
  font-size: 26px;
} /* 数値は緑 */

.contents-2 .region-kpis p{
  margin: 0 !important;
}


/* レスポンシブ（スマホは1カラム＆少し縮小） */
@media (max-width: 640px){
  .contents-2 .kpi-grid{ grid-template-columns:1fr; gap:28px; }
  .contents-2 .kpi-value .num{ font-size:44px; }
}

.contents-2 img.center{
  width: auto;
  margin: 50px auto 20px;
  display: block;
}


/* -------------------------------- */
/*             グラフ                */
/* -------------------------------- */
/* レイアウト */
.contents-2 .region-kpis{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:28px;
  
}

/* カード */
.contents-2 .kpi-card{
  background:#fff;
  border-radius:6px;
}

/* 見出し帯 */
.contents-2 .kpi-card .head{
  margin: 0 0 12px;    
  padding:0 16px;
  color:#fff; font-weight:700;
}
.contents-2 .kpi-card.is-japan  .head{ background:#1e77cf; }   /* ブルー */
.contents-2 .kpi-card.is-us     .head{ background:#e0694f; }   /* コーラル */
.contents-2 .kpi-card.is-europe .head{ background:#F6C63B;}
.contents-2 .kpi-card.is-asia   .head{ background:#7AD15C;}

.contents-2 .kpi-card .title{
  display:inline-block; 
  font-size: 20px;
}

/* 2カラムの指標行 */
.contents-2 .kpi-card .row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
  align-items:end;
  margin-bottom:8px;
}
.contents-2 .metric .label{
  font-size:14px; color:#333; font-weight:700;
}
.contents-2 .metric .value{
  margin:0; text-align:left;  padding-bottom:8px;
}

/* 数値（単位は小さくベースライン合わせ） */
.contents-2 .metric .num{
  font-size:30px; line-height:1.1; font-weight:800; letter-spacing:.02em;
  color:#111;
}
.contents-2 .metric .unit{
  margin-left:.25rem; font-size:14px; font-weight:700; color:#222;
  vertical-align:baseline;
}

/* グラフ画像 */
.contents-2 .chart{ margin:10px 0 0; }
.contents-2 .chart img{ display:block; width:100%; height:auto; }


/* 行・グラフの左寄せ（念のため） */
.contents-2 .kpi-card .row{ justify-items:start; }
.contents-2 .kpi-card .value{ text-align:left; }
.contents-2 .kpi-card .chart img{ display:block; width:100%; height:auto; }


/* レスポンシブ */
@media (max-width: 768px){
  .contents-2 .region-kpis{ grid-template-columns:1fr; }
  .contents-2 .metric .num{ font-size:34px; }
}

.contents-2 .p-color{
  color: #009944;
  font-weight: bold;
}

/* -------------------------------- */
/*             　　表                */
/* -------------------------------- */
/* 色トークン（必要に応じて調整） */
:root{
  --brand:#009944;
  --brand-weak:#e6f6ec;
  --line:#222;
  --badge:#f56f5e;
}

/* 見出し（左の緑＆単位の小さめ表記） */
.contents-2 .dv-title{
  margin:0 0 .75rem;
  font-size:24px;
  font-weight:800;
  color:var(--brand);
  width:100%;
  font-feature-settings: "palt";
}
.contents-2 .dv-title small{ font-size:16px; color:#333; margin-left:.25em; }

/* 枠（横いっぱい使いたいときは親のpaddingを調整） */
.contents-2 .dv-table-wrap{ background:#fff; }

/* テーブル本体 */
.contents-2 .dv-table{
  width:100%;
  border-collapse: collapse;  
  border-spacing:0;
  table-layout:fixed;
  font-feature-settings:"palt";
  border-bottom: 2px solid var(--line);
}

/* ヘッダー行 */
.contents-2 .dv-table thead th{
  font-weight:700;
  text-align:center;
  padding:.75rem .5rem;
  border-bottom:2px solid var(--line);
}

/* 行見出し（前期/当期） */
.contents-2 .dv-table .rowhead{
  width:5em;
  text-align:left;
  padding:.75rem .75rem;
  white-space:nowrap;
  border-top:1px solid var(--line);
  font-weight: bold;
  vertical-align: middle;
}
.contents-2 .dv-table tbody tr:first-child .rowhead{ border-top:none; }

/* セル共通 */
.contents-2 .dv-table td{
  padding:.5rem .5rem .75rem;
  text-align:center;
  vertical-align:middle;
  border-top:1px solid var(--line);
}
.contents-2 .dv-table tbody tr:first-child td{ border-top:none; }

/* 数値の大きさ */
.contents-2 .dv-table .v{ font-size:28px; color:#111; }
.contents-2 .dv-table .big{ font-size:28px; font-weight:700; letter-spacing:.02em; }

/* （予定）などの注記 */
.contents-2 .dv-table .note{ display:block; margin-top:.15rem; color:#2a2a2a; font-size:12px;  font-weight: bold}

/* 当期行の強調（薄いグリーンの帯） */
.contents-2 .dv-table tr.current th,
.contents-2 .dv-table tr.current td{
  background:#D5F3D9;
}

/* 合計セルにバッジを入れるための並び */
.contents-2 .dv-table .with-badge{
  position:relative;
  padding-right:5.5rem; 
}
.contents-2 .dv-table .with-badge .vbox{ display:inline-block; text-align:center; }

/* 右端の小バッジ */
.contents-2 .dv-table .badge{
  position:absolute; right:3rem; top:.5rem;
  display:inline-block;
  font-size:12px; line-height:1.15; text-align:center;
  color:#E8684B; background:#fff;
  border-radius:6px; padding:0.6rem .5rem;
  border:2px solid #E8684B;
  font-weight: bold;
}


.contents-2 .dv-table thead th.stub{  border-bottom:2px solid var(--line);  }

.contents-2 .dv-table .current td{
  color: #009944;
  line-height: 1;
}

.contents-2 .dv-table tbody tr.current td .v{
  color: #009944;         
}
.contents-2 .dv-table tbody tr.current td .note{
  color: #009944;         
}

@media (max-width: 768px) {
  /* 合計セル：スマホ時は中央寄せ＆縦積み */
  .contents-2 .dv-table .with-badge {
    position: static;          /* 絶対配置解除 */
    padding-right: 0;
    text-align: center;
  }

  .contents-2 .dv-table .with-badge .vbox {
    display: block;            /* 1ブロックで表示 */
  }

  .contents-2 .dv-table .with-badge .badge {
    position: static;          /* 絶対→通常フローに */
    margin: 4px auto 0;        /* 数値の下に中央寄せ表示 */
  }
}

/* スマホ最適化 */
@media (max-width:560px){
  .contents-2 .dv-title{ font-size:18px; }
  .contents-2 .dv-table .big{ font-size:26px; }
  .contents-2 .dv-table .badge{ right:.4rem; top:.45rem; font-size:11px; }
}
/* -------------------------------- */
/*             表 end               */
/* -------------------------------- */

.contents-2 .base_wrap img{
  max-width:100%;
  height:auto;
  display:block;          /* 余計な下余白対策 */
}

.contents-2 .base_wrap .card-list{
  display:flex;
  flex-wrap: nowrap;  
  gap:3rem;
}

/* 4枚を等幅で収めたい場合 */
.contents-2 .base_wrap .card-list img{
  width:calc(23% - 7px);  /* = 4列。gapに合わせて微調整 */
  object-fit:cover;       /* 必要ならトリミング風 */
}

.contents-2 .btn_area a:link, .btn_area a:visited, .btn_area a:active {
    color: #000;
}
.contents-2 .btn_area a {
    font-weight: bold !important;
    border: 1px solid #000;
}

.contents-2 .btn_area a:hover{
  color: #fff; 
}

body .btn_area a:hover {
  color: #fff;
  background-color: #009944 !important;
  border-color: #009944;
}

/* --- タブレット: 2列 --- */
@media (max-width:768px){
  .contents-2 .base_wrap .card-list{
    display: block;
    overflow:visible;        /* スクロール解除 */
  }
  .contents-2 .base_wrap .card-list img{
    flex:0 0 calc(50% - 12px); /* 2列 */
    width:100%;
    margin-bottom: 2rem;
  }

  .contents-2 .base_wrap .card-list img:nth-child(4) {
    margin-bottom: 0;
  }
}

/* ------------------------------------
	contents-3
------------------------------------ */
  .contents-3 .mg-bo-25{
    margin-bottom: 25px !important;
  }

  .contents-3 .letter-spacing{
    letter-spacing: -0.7px;
  }

.contents-3 img.center{
  width: auto;
  margin: 50px auto 20px;
  display: block;
}


.contents-3 .region-kpis{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:28px;
}




.contents-3 .kpi-card{
  background:#fff;
  border-radius:6px;
  padding:0 16px 16px;
}

.contents-3 .base_wrap img{
  max-width:100%;
  height:auto;
  display:block;          
}

@media (max-width:768px){
  .contents-3 img.center-768 {
    width: auto;
    margin: 0 auto 2rem;
    display: block;
}

.contents-3 .region-kpis{
  display:block;
}
}

body .contents-3 .btn_area a:hover {
    color: #000;
    background-color: #fff !important;
    border-color: #000;
}

.contents-3 .btn_area a:link, .btn_area a:visited, .btn_area a:active{
    color: #000;
}

.contents-3 .btn_area a:hover{
color: #fff;
}
.contents-3 .btn_area a {
    font-weight: bold !important;
    border: 1px solid #000;
}

.contents-3 .ext-link{
  display: inline-block;   
  margin-bottom: 50px; 
  text-decoration: none;
  text-underline-offset: 3px;
}

.contents-3 .ext-link::after{
  content:"";
  display:inline-block;
  width: 1em;                
  height: 1em;
  margin-left: .35em;        
  vertical-align: -.15em;     
  background: url("../img/contents-3/ico_blank.png") no-repeat center / contain;
}

/* ------------------------------------
	contents-4
------------------------------------ */
.contents-4 .region-kpis {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;     /* 棒の基準位置 */
    padding: 0 40px;        /* 棒の左右スペース調整 */
}

/* 縦棒 */
.contents-4 .region-kpis::before {
    content: "";
    position: absolute;
    left: 50%;              /* 常に中央に配置 */
    top: 0;
    transform: translateX(-50%);
    width: 1px;             /* 棒の太さ */
    height: 100px;           /* 高さ */
    background-color: #707070; /* 色 */
}

@media (max-width:768px){
  .contents-4 .region-kpis::before {
    background: none;
  }
}

.contents-4 .region-kpis-mb{
  margin-bottom: 50px !important;
}


.contents-4 img.center{
  width: auto;
  margin: 0 auto 2rem;
  display: block;
}

.contents-4 .base_wrap img{
  max-width:100%;
  height:auto;
  display:block;          
}

.contents-4 .btn_area a:link,
.contents-4 .btn_area a:visited,
.contents-4 .btn_area a:active {
  color: #000;
}


.contents-4 .btn_area a:hover{
color: #fff;
}
.contents-4 .btn_area a {
  font-weight: bold !important;
  border: 1px solid #000;

}

.contents-4 .region-kpis{
  display: grid;
  grid-template-columns: repeat(2, 1fr); 
  gap: 24px;                            
  place-items: center;    
  margin-bottom: 60px;              
}

.contents-4 .region-kpis img{
  max-width: 100%;
  height: auto;
  display: block;                     
}

.contents-4 .btn_area a.icon-right {
  position: relative;
  padding-right: 3em;   
}

.contents-4 .btn_area a.icon-right::after{
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 1em;
    height: 1em;
    background: transparent url(../img/ico_blank.png) center center no-repeat;
    background-size: 100%;
}

.contents-4 .btn_area a.icon-right:hover::after{
  background-image: url(../img/ico_blank1.png);
}

@media (max-width: 768px) {
.contents-4 .btn_area a.icon-right{
  position: relative;
  padding-right: 36px; 
}
.contents-4 .btn_area a.icon-right:hover::after{
  content:"";
  position: absolute;
  top: 50%;
  transform: translateY(-50%); 
  width: 16px; height: 16px;
  background: url("../img/ico_blank1.png") center/100% no-repeat;
  pointer-events: none;
}

}

@media (max-width: 768px){
  .contents-4 .region-kpis{ grid-template-columns: 1fr; }
  .contents-4 .region-kpis img:first-of-type{
    margin-bottom: 5rem; 
  }
}


/* ------------------------------------
	ご留意事項
------------------------------------ */
.reco .color{
  color: #009944;
  font-size: 20px;
}

.reco .mid-line {
  border: 0;
  border-top: 1px solid #009944; /* 緑色の横線 */
  width: 200px;                  /* 線の長さ（お好みで） */
  margin: 40px auto;             /* 上下余白＋中央寄せ */
}


@media only screen and (min-width: 768px) {
 
.index #global_nav{
display: none;
}
 
}
body.index.gnav {
    padding-top: 110px;
}
 
@media only screen and (max-width: 768px) {
    body.index.gnav {
        padding-top: 80px;
    }
}