
/* ===============================
   company common style
   =============================== */

/* ============================================= margin-top */

* {
	line-height:1.875;}

.sp {
   display: none !important;
}
@media (max-width: 768px) {
   .sp {
      display: block !important;
    }
    .pc {
      display: none !important;
    }
}

.company {
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: 100% auto;
   background-image: url("../imgs/company/company_background.png");
	background-attachment: fixed;
}
@media (max-width: 768px) {
   .company {
      background-image: url("../imgs/company/company_background_sp.png");
   }
}

.company::before {
   position: relative;
   display: block;
   content: "";
   height: 11rem;
   width: 1px;
   opacity: 0;
}
.company_path {
   position: relative;
   padding: 2.4rem;
}
.company_path ol {
   margin: 0 auto;
   padding: 0;
   max-width: 1120px;
   line-height: 1;
}
.company_path li {
   font-size: 1.2rem;
   display: inline-block;
}
.company_path li:not(:last-of-type) {
   padding-right: 2rem;
   position: relative;
}
.company_path li:not(:last-of-type)::before {
   content: "";
   display: block;
   position: absolute;
   height: 1rem;
   aspect-ratio: 4 / 10;
   right: 0.7rem;
   top: calc(50% - 0.5rem);
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: cover;
   background-image: url("../imgs/company/comany_path_arrow.svg");
}
.company_path a {
   text-decoration: none;
   color: #848383;
   display: inline-block;
}
@media screen and (max-width: 768px) {
   .company::before {
      height: 6rem;
   }
   .company_path {
      position: relative;
      padding: 2rem;
   }
   .company_path li {
      font-size: 1rem;
   }
}


/* ============================================= company_index */
.company_index_list {
   margin: 0 auto;
   padding: 8rem 1rem;
   max-width: 1120px;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 8rem 0;
   border-bottom: 1px solid #B8B8B8;
}
.company_index_list:last-of-type {
   border: 0 none;
   margin-bottom: 4.8rem;
}
.company_index_list > div,
.company_index_list > a {
   position: relative;
   display: block;
   aspect-ratio: 560 / 250;
   display: grid;
   align-items: center;
   text-decoration: none;
   cursor: pointer;
   max-width: 56rem;
}
.company_index_list_single.company_index_list {
   position: relative;
   grid-template-columns: 1fr 2fr 1fr;
}
.company_index_list_single.company_index_list::before,
.company_index_list_single.company_index_list::after {
   content: "";
   display: block;
   height: 100%;
   width: 1px;
}
.company_index_list figure {
   position: absolute;
   display: block;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background-repeat: no-repeat;
   background-position: 100% 100%;
   background-size: calc(368 / 560 * 100%) auto;
   background-image: url("../imgs/company/index_item_background.png");
   transition: 0.3s;
}
.company_index_list figure span {
   display: block;
   position: relative;
   z-index: 2;
   width: calc(401 / 560 * 100%);
   max-width: 40.1rem;
}
.company_index_text {
   position: relative;
   z-index: 2;
   width: calc(220 / 560 * 100%);
   aspect-ratio: 220 / 183;
   margin: 0 0 0 auto;
    padding: 20% 0 0 0;
}
.company_index_box_multiple_01 .company_index_text {
   padding: 13% 0 0 0 ;
}
.company_index_box_multiple_01.office .company_index_text {
   padding: 15.25% 0 0 0 ;
}
.company_index_text label,
.company_index_text p {
   padding-left: 2rem;
   color: #0068B6;
   font-size: 2rem;
   transition: 0.3s;
   font-weight: bold;
   background-repeat: no-repeat;
   background-position: 0 50%;
   background-size: auto 2rem;
   background-image: url("../imgs/company/comany_path_arrow.svg");
   line-height: 1.4;
   transition: 0.3s;
   display: block;
   cursor: pointer;
}
.company.under .company_index_text label,
.company.under .company_index_text p {
	font-size:1.55rem;
}
.company_index_list ul {
   position: absolute;
}
.company_index_list li {
   list-style: none;
}
.company_index_check {
   display: none;
/*   visibility:hidden;*/
}
.company_index_check ~ ul {
   opacity: 0;
   height: 0;
   width: 100%;
   position: absolute;
   transition: 0.3s;
   padding: 0.8rem 0;
   background-color: #F1F1F1;
   filter: drop-shadow(0.5rem 0.5rem 2rem rgba(0,0,0,0.3));
}
.company_index_check ~ ul li {
	margin-bottom: 0;
}
.company_index_check:checked ~ label span::before {
   transform: rotate(-45deg);
   top: calc(50% - 0.3rem);
   border-color: var(--color-white);
}
.company_index_check ~ ul li a {
   display: block;   
   color: #8C8C8C;
   padding: 0.85rem 1.6rem;
   text-decoration: none;
   transition: 0.3s;
}
.company_index_check ~ ul .external a span {
   display: inline-block;
   position: relative;
   padding-right: 1.8rem;
   background-repeat: no-repeat;
   background-position: 100% 50%;
   background-size: 1.2rem auto;
   background-image: url("../imgs/common/icon_external.svg");
   opacity: 0.5;
}


.heading_02 {
	padding:3px 15px;}

@media screen and (min-width: 769px) {
   .company_index_list > div:hover figure,
   .company_index_list > a:hover figure{
      filter: drop-shadow(0.5rem 1rem 3rem rgba(0,0,0,0.3));
   }
   .company_index_list > div:hover .company_index_text label,
   .company_index_list a:hover .company_index_text p {
      background-image: url("../imgs/company/comany_path_arrow_blue.svg");
      transform: translate(1rem, 0);
      color: #4D4D4D;
   }
   .company_index_has_child:hover .company_index_check ~ ul {
      height: auto;
      opacity: 1;
      height: auto;
   }
   .company_index_check ~ ul li a:hover {
      background-color: rgba(0,0,0,0.1);
      color: var(--color-black);
   }
   .company_index_check ~ ul .external a:hover span {
      opacity: 1;
   }
}

@media screen and (max-width: 768px) {
   .company_index_list {
      position: relative;
      padding: 6.4rem 0;
      grid-template-columns: 1fr;
      gap: 4rem 0;
      border-bottom: 0;
   }
   .company_index_list:last-of-type {
      margin-bottom: 0;
   }
   .company_index_list > div,
   .company_index_list > a {
      aspect-ratio: 373 / 274;
      align-items: end;
   }
   .company_index_list_single.company_index_list {
      grid-template-columns: 1fr;
   }
   .company_index_list_single.company_index_list::before,
   .company_index_list_single.company_index_list::after {
      display: none;
   }
   .company_index_list_single.company_index_list:not(:last-of-type)::before,
   .company_index_list::before {
      content: "";
      display: block;
      position: absolute;
      width: calc(100% - 4.8rem);
      height: 1px;
      bottom: 0;
      left: 2.4rem;
      background-color: #bbbbbb;
   }  
   .company_index_list figure {
      background-size: 100% auto;
   }
   .company_index_list figure span {
      width: unset;
      max-width: unset;
   }
   .company_index_box_multiple_01 .company_index_text,
   .company_index_text {
      width: unset;
      height: 9.1rem;
      aspect-ratio: unset;
      margin: 0;
      padding: 0 6rem 2rem 0;
      display: grid;
      align-items: center;
   }
	.company_index_box_multiple_01.office .company_index_text {
        padding: 0 6rem 2rem 0;
	}
   .company_index_text label,
   .company_index_text p {
      margin: 0 auto;
   }
   .company_index_has_child {
      -webkit-tap-highlight-color: transparent;
   }
   .company_index_check ~ ul {
      width: fit-content;
      position: relative;
      margin: 1.5rem auto 0;
   }
   .company_index_check ~ ul li a {
      padding: 0.6rem 1.6rem;
   }

   .company_index_check:checked ~ ul {
      opacity: 1;
      height: auto;
      padding: 0.8rem 0;
      background-color: #F1F1F1;
      filter: drop-shadow(0.5rem 0.5rem 2rem rgba(0,0,0,0.3));
   }  
}






/* ============================================= 
                 下層common
 ============================================= */

/* ============================================= company_under common */

body {
    font-size: 1.6rem;
}
.inner {
    max-width: 928px;
    width: 87.23%;
    margin: auto;
}
.inner.linkbanner_area {
    max-width: 928px;
    width: 87.23%;
    margin: auto;
}
.flex {
	display: flex;
}
.contents {
	margin-bottom: 100px;
}
.right {
	text-align: right;
}
.color.blue {
	color: #0068B6;
}
ul.indent {
	margin-top: 15px;
}
p.indent {
	padding-left: 1em;
	text-indent: -1em;
}
ul.indent li {
	padding-left: 1em;
	text-indent: -1em;
	margin-bottom: 5px;
}
.mini.top {
    font-size: 10px;
    position: relative;
    top: -5px;
}
@media screen and (max-width: 768px) {
.inner.linkbanner_area {
    max-width: 100%;
    width: 100%;
	}
.flex {
	display: block;
	}
.contents {
    margin-bottom: 45px;
	}
ul.indent li {
	margin-bottom: 3px;
	}
}

@media screen and (min-width: 769px) {
.forsp {
	display: none!important;
	}
}
@media screen and (max-width: 768px) {
.forpc {
	display: none!important;
	}
}

/* ============================================= 
                 下層共有タイトル
 ============================================= */

/* ============================================= 青色鍵下線タイトル */
.title_blue_line {
    display: flex;
}
.title_blue_line span {
    position: relative;
    padding-right: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #007DC8;
    font-size: 1.8rem;
}
.title_blue_line span::after {
    content: "";
    width: 1px;
    height: 8px;
    background: #007DC8;
    position: absolute;
    bottom: 0;
    right: 0;
}

@media screen and (max-width: 768px) {
.title_blue_line span {
	font-size: 1.8rem;
	}
}

/* ============================================= 
                 下層共有パーツ
 ============================================= */


/* ============================================= cta box */
.cta_box {
    margin: 75px 0 40px 0;
    padding-bottom: 65px;
    border-bottom: 1px solid #afafaf;
}

.cta_box .flexbox {
	gap: 30px;
	padding: 0;
}

.cta_box .link_type_01 {
	padding: 15px 66px;
}

.cta_box li {
    width: 288px;
}

/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
.cta_box {
	margin: 40px 0;
    padding-bottom: 30px;
	}
.cta_box .flexbox {
	gap: 25px;
	}
.cta_box li {
    width: 228px;
	}
}


/* ============================================= inner_links */
.inner_links {
  margin: 0;
  display: flex;
  justify-content: center;
  gap: 40px;
  text-align: initial;
}

.inner_links li {
  margin: 0;
  font-size: 1.6rem;
  list-style: none;
}

/* フレックスで中央揃え（矢印中央・テキスト左寄せ） */
.inner_links li a {
  color: #000;
  text-decoration: none;
  display: flex;
  align-items: center;  /* 矢印の高さを中央に */
  text-align: left;     /* テキスト左寄せ */
  position: relative;
  padding-left: 24px;   /* 矢印分の余白 */
}

/* 矢印アイコン */
.inner_links li a::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 12px solid #007dc8;
  border-right: 0;
  left: 0;
  top: 50%;
  transform: translateY(-50%); /* ←高さ中央に */
}

@media screen and (max-width: 768px) {
  .read_area {
    width: 68%;
    margin: 35px auto 60px;
  }
  .read_area .inner_links {
    display: block;
    text-align: left;
  }
  .read_area .inner_links li {
    margin-bottom: 12px;
  }
}

/* ============================================= table */
.table_content {
	width: 100%;
	overflow-x: auto;   /* 横スクロールを許可 */
	-webkit-overflow-scrolling: touch; /* スマホでスムーズスクロール */
}
.table_content table {
	width: 100%;  /* PC基準サイズ固定 */
	border-collapse: collapse;
/*	min-width: 928px; *//* スマホで縮まないようにする */
}
.table_content.w100 table {
	width:100%;
	min-width:100%;
}
.table_content table.fixed {
	table-layout:fixed;
}
.table_content table th {
	padding:10px 12px;
	border:1px solid #B8B8B8;
	background:#F5F5F5;
	font-size:1.6rem;
}
.table_content table td {
	padding:10px 12px;
	border:1px solid #B8B8B8;
	background:#FFF;
	font-size:1.6rem;
}
.table_content table td.color {
    background: #F5F5F5;
    width: 20%;
}
.table_content table td img {
	width:auto;
	max-width:100%;
	margin:0 auto;
}
.table_content table a {
	color:var(--color-main);
}
.table_content table dl dt {
	display: inline-block;
	width: 20%;
	vertical-align: top;
}
.table_content table dl dd {
	display: inline-block;
}
@media screen and (max-width: 768px) {
.table_content.scroll {
	overflow-x: auto;
	white-space: nowrap;
	}
.table_content table td {
    padding: 10px 8px;
    font-size: 1.425rem;
	}
.table_content table td.color {
	width: 23.5%;
	}
.table_content table dl dt {
    width: 56%;
	}
}
/* ===== スクロールバーのデザイン（Webkit系: Chrome, Safari, iOS対応） ===== */
.table_content::-webkit-scrollbar {
	height: 8px; /* 横スクロールバーの太さ */
}
.table_content::-webkit-scrollbar-track {
	background: #EAEAEA; /* バーの背景 */
	border-radius: 4px;
}
.table_content::-webkit-scrollbar-thumb {
	background: #C1C1C1;
	border-radius: 4px;
}

/* ===== Firefox 対応 ===== */
.table_content {
	scrollbar-width: thin;
	scrollbar-color: #C1C1C1;
}

/* ===== スマホ用微調整 ===== */
@media screen and (max-width: 928px) {
	.table_content table{
		margin-bottom: 1.5rem;
	}
}

/* -- color -- */
.table_content table td span.red {
	color:var(--color-accent-2);
}

/* -- 横スクロール設定 -- */
.wrap.scroll {
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0 20px;
}
.scroll_box {
    display: flex;
    align-items: flex-start;
    /* 左端のアイテムから見えるように設定 */
    justify-content: flex-start; 
    /* 横スクロールの設定 */
    overflow-x: scroll; 
}


/* ============================================= scroll arrow */
.scroll_arrow {
	margin-top:30px;
    margin-bottom: 20px;
	font-size:1.4rem;
}
.scroll_arrow span {
	position: relative;
	padding-right: 24px;
	padding-bottom: 8px;
	border-bottom: 1px solid #000;
}
.scroll_arrow span::after {
	content: "";
	position: absolute;
	width: 16px;              /* 少し長めに */
	height: 1px;             /* 横線に変更 */
	background: #000;
	bottom: -1px;               /* 下辺に揃える */
	right: 0;                /* 右端に配置 */
	transform: rotate(45deg); /* 右下方向に傾ける */
	transform-origin: right bottom; /* 回転の基準を右下に */
}

/* ============================================= タブ切り替え */
.tabs_01 .tabs_nav {
	display: flex;
	justify-content: center;
	gap: 15px;
	overflow-x:auto;
	-webkit-overflow-scrolling:touch;
	scroll-snap-type:x proximity;
	margin-bottom:50px;
}

.tabs_01 .tabs_nav .tab {
	appearance: none;
	outline: none;
	cursor: pointer;
	opacity: 0.8;
	flex: 0 0 auto;
	scroll-snap-align: start;
	padding: 0 16px 16px;
	background-color: transparent;
	border: none;
	border-bottom: #cce5f4 5px solid;
	font-size: 2.0rem;
	font-weight: 700;
	color: #7f7f7f;
	white-space:nowrap;
}

.tabs_01 .tabs_nav .tab:hover,
.tabs_01 .tabs_nav .tab.is-active {
	opacity: 1;
	border-bottom-color: #007DC8;
	color: var(--color-black);
}

/* パネルの基本状態（非表示） */
.tabs_01 .tabs_panels .tab-panel {
	display: none;
	opacity: 0;
	transition: opacity .3s ease;
}

/* 表示状態 */
.tabs_01 .tabs_panels .tab-panel.is-active {
	display: block;
	opacity: 1;
}

/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
	.tabs_01 .tabs_nav {
		justify-content: flex-start;
	}

	.tabs_01 .tabs_nav .tab {
        font-size: 1.65rem;
	}
}
@media screen and (min-width: 768.0px) and (max-width: 768.9px) {
.tabs_01 .tabs_nav {
	justify-content: flex-start;
	}
.tabs_01 .tabs_nav .tab {
    font-size: 1.6rem;
	}
}

/* ============================================= アコーディオン */
.accordion_button {
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	padding: 7px 14px;
	background: #fff;
	border: 1px solid #7a7a7a;
	border-radius: 7px;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 1;
	color: #7a7a7a;
    line-height: 1.35;
}

.accordion_icon {
	position: relative;
	width: 20px;
	height: 20px;
}

.accordion_icon::before,
.accordion_icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 70%;
	height: 2px;
	background: #7a7a7a;
	transition: transform 0.2s;
}

.accordion_icon::after {
	transform: translate(-50%, -45%) rotate(90deg);
}

/* 開いているときの「×」 */
.accordion_button.is-open .accordion_icon::before {
	transform: translate(-50%, -50%) rotate(45deg);
}
.accordion_button.is-open .accordion_icon::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

/* パネル */
.accordion_content {
	display: none;
	margin-top: 40px;
}

.accordion_content.is-open {
  display: block;
}



/* ============================================= 下層 下部 企業情報リンク */
.top_cta_container > ul {
    display: block;
    width: 440px;
    margin-top: 128px;
    margin-bottom: 70px;
    margin-left: auto;
    margin-right: auto;
	position: relative;
	z-index: 1;
}
.top_cta_container > ul li {
   vertical-align: top;
}
.top_cta_label,
.top_cta_container > ul > li > a {
   display: grid;
   align-items: center;
   width: 100%;
   text-align: center;
   border: 1px solid #007DC8;
   text-decoration: none;
   color: #007DC8;
   cursor: pointer;
   padding: 1.7rem 1rem;
   transition: 0.3s;
    background-color: #ffffff;
}
.top_cta_label span {
   display: block;
   margin: 0 auto;
   padding-right: 3.6rem;
   position: relative;
}
.top_cta_label span::before {
   content: "";
   display: block;
   position: absolute;
   width: 1.2rem;
   aspect-ratio: 1 / 1;
   right: 0;
   top: calc(50% - 0.7rem);
   border-right: 2px solid #007DC8;
   border-top: 2px solid #007DC8;
   transform: rotate(135deg);
   transition: 0.3s;
}
.top_cta_check {
   display: none;
}
.top_cta_pulldown {
   position: relative;
}
.top_cta_check ~ ul {
   opacity: 0;
   height: 0;
   width: 100%;
   position: relative;
   transition: 0.3s;
}
.top_cta_check:checked ~ ul {
   opacity: 1;
   height: auto;
   padding: 0 0;
   background-color: #F1F1F1;
}
.top_cta_check:checked ~ label,
.top_cta_check:checked ~ label:hover {
   background-color: #007DC8;
   color: #fff;
}
.top_cta_check:checked ~ label span::before {
   transform: rotate(-45deg);
   top: calc(50% - 0.3rem);
   border-color: var(--color-white);
}
.top_cta_check ~ ul li {
   display: inline-block;
   width: 49%;
	margin-bottom: 0;
}
.top_cta_check ~ ul li a {
   display: block;
   color: #8C8C8C;
   padding: 1.2rem 1.2rem;
   text-decoration: none;
   transition: 0.3s;
   vertical-align: top;
}
.top_cta_check ~ ul li a:hover {
    background-color: rgba(0,0,0,0.1);
    color: var(--color-black);
}
.top_cta_check ~ ul .external a span {
   display: inline-block;
   position: relative;
   padding-right: 1.8rem;
   background-repeat: no-repeat;
   background-position: 100% 50%;
   background-size: 1.2rem auto;
   background-image: url("../imgs/common/icon_external.svg");
   opacity: 0.75;
}
.top_cta_check ~ ul .external a:hover span {
    opacity: 1;
}

.top_cta_check ~ ul{
	display:none;
}

.top_cta_check:checked ~ ul {
	display:block;
}

@media screen and (max-width: 768px) {
.top_cta_container > ul {
    width: 100%;
	margin-top: 50px;
	margin-bottom: 80px;
	}

.top_cta_check ~ ul li a {
   }
}
@media screen and (min-width: 768.0px) and (max-width: 768.9px) {
.top_cta_container > ul {
    margin-top: 100px;
    margin-bottom: 120px;
	}
}


/* ============================================= 下層 画像、テキスト 設置エリア 画像3列版 */
.grid.three_lines {
	display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0 3.2rem;
}
.grid.three_lines .text_box p {
	padding-top: 5px;
	text-align: center;
	font-size: 12px;
}
@media screen and (max-width: 768px) {
.grid.three_lines {
	display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
	}
.grid.three_lines .item {
	margin-bottom: 20px;
	}
.grid img {
    width: 100%;
	}
}

/* ============================================= 下層 画像、テキスト 設置エリア 画像2列版 */
.grid.two_lines {
	display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 3.2rem;
    justify-items: center;
}
.grid.two_lines .text_box p {
	padding-top: 5px;
	text-align: center;
	font-size: 12px;
}
@media screen and (max-width: 768px) {
.grid.two_lines {
	display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
	}
.grid.two_lines .item {
	margin-bottom: 20px;
	}
.grid.two_lines .text_box p {
    font-size: 1.5rem;
	}
}

/* ============================================= 左テキスト 右画像エリア */
.flexbox.pc-text-col2 {
	gap: 1%;
	margin: 18px 0 0;
}

.flexbox.pc-text-col2 .text {
    width: 60%;
	margin: 0;
}

.flexbox.pc-text-col2 .image {
    width: 39%;
}
/* ------------------------------------- for sp */
@media ( max-width : 768px ) {
	.flexbox.pc-text-col2 .text,
	.flexbox.pc-text-col2 .image {
		width: 100%;
	}
	.flexbox.pc-text-col2 .text .flexbox > p {
		width:4em;
	}
	.flexbox.pc-text-col2 .text .flexbox > p + p {
		width:calc(100% - 4em);
	}
}



/* ============================================= product_content */

.product_content .link_type_01 {
	display: inline-block;
	width: auto;
	padding: 8px 66px;
}


.product_content .pc-thumb-col3 {
	gap: 32px;
	margin: 18px 0 0;
	padding: 0;
}

.product_content .pc-thumb-col3 {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	margin: 18px 0 0;
	padding: 0;
}

.product_content .pc-thumb-col3 > li {
	width: 288px;
	display: flex; /* 子要素を伸ばすため */
}

.product_content .pc-thumb-col3 > li a,
a.link_thumbnail_text_button {
	display: flex;
	flex-direction: column;
	width: 100%;
	text-decoration:none;
}

.product_content .pc-thumb-col3 > li a div,
a.link_thumbnail_text_button div {
	position:relative;
	display: flex;
	justify-content: center; /* 横中央 */
	align-items: center;     /* 縦中央 */
	overflow: hidden;        /* はみ出し防止 */
}
.product_content .pc-thumb-col3 > li a div::after,
a.link_thumbnail_text_button div::after {
	content: "";
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background: rgba(255, 255, 255, 0); /* 初期は透明 */
	transition: background 0.3s ease;
}
.product_content .pc-thumb-col3 > li a div img,
a.link_thumbnail_text_button div img {
	width: 90%;
	max-width: 100%; /* レスポンシブ対応 */
	transition: transform 0.3s ease;
	transform: scale(0.95);   /* 初期は80% */
}

.link_thumbnail_text_button {
	display: flex;
	flex-direction: column;
	height: auto;
}
.product_content .pc-thumb-col3 > li a p,
a.link_thumbnail_text_button p {
	width: 100%;
	display: flex;              /* テキストと矢印を中央寄せ */
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 0.7rem 0.6rem;
	background-color: var(--color-white);
	border: 1px solid #8C8C8C;
	color: #8C8C8C;
	border-radius: 0.7rem;
	transition: 0.3s;
	flex-grow: 1;               /* ← 高さを均等に揃える */
	box-sizing: border-box;
}

.product_content .pc-thumb-col3 > li a p span,
a.link_thumbnail_text_button p span {
	position: relative;
	font-size: 1.4rem;
	line-height: 1.4;
	display: inline-block;
	padding-right: 2rem;
	transition: 0.3s;
	color:#4D4D4D;
	vertical-align: middle;
    font-weight: 500;
}

.product_content .pc-thumb-col3 > li a p span::before,
a.link_thumbnail_text_button p span::before {
	content: "";
	display: block;
	position: absolute;
	width: 1.2rem;
	aspect-ratio: 1 / 1;
	right: 0;
	top: 50%;
	transform: translateY(-50%) rotate(45deg); /* ← 矢印を縦中央に */
	border-right: 2px solid #8C8C8C;
	border-top: 2px solid #8C8C8C;
	transition: 0.3s;
}


/* ------------------------------------- for pc */
@media ( min-width : 768px ) {
	.product_content .pc-thumb-col3 > li:hover a div img,
	a.link_thumbnail_text_button:hover div img {
	    transform: scale(1);     /* hover時に100% */
	}
	.product_content .pc-thumb-col3 > li:hover a div::after,
	a.link_thumbnail_text_button:hover div::after {
		background: rgba(255, 255, 255, 0.2); /* 薄い白を重ねる */
	}
	.product_content .pc-thumb-col3 > li a:hover p,
	a.link_thumbnail_text_button:hover p {
		background-color: var(--color-main);
		color: var(--color-white);
		border-color: var(--color-main);
	}
	.product_content .pc-thumb-col3 > li a:hover p span,
	a.link_thumbnail_text_button:hover p span {
		transform: translateX(0.5rem);
		color:#ffffff;
	}
	.product_content .pc-thumb-col3 > li a:hover p span::before,
	a.link_thumbnail_text_button:hover p span::before {
		border-color: var(--color-white);
	}
}

/* ------------------------------------- for sp */
@media ( max-width : 767px ) {
	.product_content .link_type_01 {
		font-size: 1.44rem;
	}

	.product_content .pc-thumb-col3 > li {
		width: 100%;
	}
}




/* ============================================= company_under_header */
.company.under {
}
.company_under_header {
    max-width: 1260px;
    width: 90%;
    margin: auto;
    margin-bottom: 80px;
   padding: 2.85rem 1rem;
   font-size: 3rem;
   color: #0068b6;
   text-align: center;
   background-repeat: no-repeat;
   background-position: 0 0;
   background-size: cover;
   background-image: url("../imgs/company/under_header_background.png");
}
@media screen and (max-width: 768px) {
.company.under {
	background-position-y: -20px;
	}
.company_under_header {
	font-size: 2.4rem;
	padding: 3rem 1rem 2.8rem;
    margin-bottom: 40px;
    width: 100%;
    background-image: url("../imgs/company/under_header_background_sp.png");
    }
}

/* ============================================= 下層フッター上部 リンクエリア */

.company.under .company_index_list {
    border-bottom: 0px;
    position: inherit;
    padding: 2rem 1rem;
}
.company.under .company_index_list > a:nth-child(3) {
	left: 50%;
}
.company.under .company_index_list_single.company_index_list:not(:last-of-type)::before,
.company.under .company_index_list::before {
      content: none;
}
.linkbanner_area .company_index_box_multiple_01.office .company_index_text {
    padding: 13.5% 0 0 0;
}
@media screen and (max-width: 768px) {
.company.under .company_index_list {
    padding: 0.5rem 0;
	}
.company.under .company_index_list div ,
.company.under .company_index_list a {
    aspect-ratio: 560 / 250;
/*	width:100%;*/
	}
.company.under .company_index_list > a:nth-child(3) {
	left: 0;
	}
.company.under .company_index_box_multiple_01 .company_index_text, 
.company.under .company_index_text {
/*	width: 100%;*/
    display: block;
	padding: 0;
	}
.company.under .company_index_text label,
.company.under .company_index_text p {
	font-size: 1.5rem;
	position: absolute;
	top: 20px;
	left: 57vw;
    width: 70%;
	}
.company.under a.office .company_index_text p {
	top: 0;
	}
.company.under .company_index_list figure {
    background-size: 66%;
	height: 100%;
	}
.company.under .company_index_list figure img {
    max-width: 70%;
	}
.company.under .company_index_list .company_index_text ul {
	width: 100%;
	left: 41vw;
	top: 32px;
	}
.company.under .company_index_list .company_index_text ul li {
	margin-bottom: 0;
	}
.company.under .company_index_list .company_index_text ul a {
	aspect-ratio: inherit;
	}

.company_index_check ~ ul {
	display:none;
}

.company_index_check:checked ~ ul {
	display:block;
}

}



@media screen and (min-width: 768.0px) and (max-width: 768.9px) {
.company.under .company_index_text label, 
.company.under .company_index_text p {
    top: 60px;
    left: 390px;
    width: 260px;
	}
}
@media screen and (max-width: 385px) {
.company.under .company_index_text label,
.company.under .company_index_text p {
	top: 20px;
	left: 215px;
	}
}

