@charset "utf-8";

/* ----------------------------------------------------
  スクロール
---------------------------------------------------- */
.mainscroll {
    position: absolute;
    bottom: 17.5%;
    left:6%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    z-index: 9999;
}
.mainscroll a {
    display: inline-block;
    position: absolute;
    bottom: 0;
    z-index: 100;
    padding: 10px 3px 140px 10px;
    overflow: hidden;
    color: #fff;
    font-size: 16px;
    line-height: 1;
    letter-spacing: .2em;
    text-decoration: none;
    writing-mode: vertical-lr;
}
.mainscroll a::after {
    content: '';
    position: absolute;
    bottom: 0%;
    left: 60%;
    width: 1px;
    height: 120px;
    background: #fff;
}
.mainscroll a::after {
    animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes sdl {
    0% {
        transform: scale(1, 0);
        transform-origin: 0 0;
    }

    50% {
        transform: scale(1, 1);
        transform-origin: 0 0;
    }

    50.1% {
        transform: scale(1, 1);
        transform-origin: 0 100%;
    }

    100% {
        transform: scale(1, 0);
        transform-origin: 0 100%;
    }
}
#mainjump {
    padding-top: 80px;
    margin-top: -80px;
}

/* ----------------------------------------------------
  quick_up_team
---------------------------------------------------- */
/* PC以外　縦横への要素はみ出しをカット */
.anim-overflow-hidden {
  overflow-x: hidden;
  overflow: hidden;
}

/* ----------------------------------------------------
   h2
---------------------------------------------------- */
.h2_wide{ padding:0 10px 15px 10px;}
@media print, screen and (min-width: 768px) {.h2_wide{ padding:0 30px 35px 30px;}}

.p-anima-9 {
	position: relative;
	overflow: hidden;
  border-radius: 20px;
}

/* イントロの背景カバー
-------------------------- */
.p-anima-9__intro {
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #0549a6; /* 任意色 */
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
}

.p-anima-9__intro h2 {
	overflow: hidden;
}

.p-anima-9__intro h2::before {
	content: "";
	display: block;
	background-color: #0549a6; /* 任意色 */
	position: absolute;
	bottom: -100%;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 1.5em;
}

.p-anima-9__intro h2 span {
	display: block;
	transform: translate(0, 105%);
}
.p-anima-9.__anima .p-anima-9__intro {
	animation: anima_intro_9 0.7s cubic-bezier(0.46, 0.26, 0.15, 0.89) 1.6s 1 forwards;
}
.p-anima-9.__anima .p-anima-9__intro h2::before {
	animation: anima_title_musk_9 0.5s cubic-bezier(0.46, 0.26, 0.15, 0.89) 0.6s 1 forwards;
}
.p-anima-9.__anima .p-anima-9__intro h2 span {
	animation: anima_title_9 0.5s cubic-bezier(0.46, 0.26, 0.15, 0.89) 1 forwards;
}

@keyframes anima_title_9 {
	0% {
		transform: translate(0, 105%);
	}
	100% {
		transform: translate(0, 0);
	}
}

@keyframes anima_title_musk_9 {
	0% {
		bottom: -100%;
	}
	100% {
		bottom: 0;
	}
}

@keyframes anima_intro_9 {
	0% {
		left: 0;
	}
	100% {
		left: 100%;
	}
}

/* メインビジュアル
-------------------------- */
.p-mv {
	display: flex;
	align-items: center;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	padding:40px 0 30px 0;
	width: 100%;
	position: relative;
}

@media print, screen and (min-width: 768px) {
	.p-mv {
		padding: 80px 0 70px 0;
	}
}
@media print, screen and (min-width: 1200px) {
	.p-mv {
		padding: 100px 0 90px 0;
	}
}

/* 半透明のオーバーレイ
-------------------------- */
.p-mv::before {
	content: "";
	display: block;
	background-color: rgba(0, 0, 0, 0.5);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* 背景
-------------------------- */
.h2_02 { background-image: url("../images/h2_02.jpg"); }
.h2_03 { background-image: url("../images/h2_03.jpg"); }
.h2_04 { background-image: url("../images/h2_04.jpg"); }
.h2_05 { background-image: url("../images/h2_05.jpg"); }
.h2_06 { background-image: url("../images/h2_06.jpg"); }
.h2_07 { background-image: url("../images/h2_07.jpg"); }
.h2_08 { background-image: url("../images/h2_08.jpg"); }

/* タイトルパターン1
-------------------------- */
.p-mv__title {
	font-weight: lighter;	
	color: #fff; /* 任意色 */
	font-size: 15px;
	line-height: 30px;
	letter-spacing: 3px;	
	position: relative;
	z-index: 1;
}
@media print, screen and (min-width: 768px) {
	.p-mv__title {
		font-size: 45px;
		line-height: 60px;
	}
}

/* タイトルパターン2 
-------------------------- */
.p-mv__title02 {
	color: #fff; /* 任意色 */
	font-size: 20px;
	line-height: 30px;	
	position: relative;
	margin: 0 auto;
	text-align: center;
	z-index: 1;
	letter-spacing: 5px; 
}
.p-mv__title02 span {
	font-weight: lighter;	
	font-size: 40px;
	text-align: center;
}

@media print, screen and (min-width: 768px) {
	.p-mv__title02 {
		font-size: 22px;
		line-height: 46px;
  	letter-spacing: 5px;    
	}
	.p-mv__title02 span {
		font-size: 70px;
	}
}
@media print, screen and (min-width: 1200px) {
	.p-mv__title02 {
		font-size: 28px;
		line-height: 53px;
	}
	.p-mv__title02 span {
		font-size: 80px;
	}
}

/* ----------------------------------------------------
  画像スライド
---------------------------------------------------- */
/* 右からの無限ループ */
@keyframes infinity-scroll-left {
from {
  transform: translateX(0);
}
  to {
  transform: translateX(-100%);
}
}
.scroll-infinity__list--left {
animation: infinity-scroll-left 100s infinite linear 0.5s both;
}

.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}
.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0;
}
.scroll-infinity__list--left {
  animation: infinity-scroll-left 100s infinite linear 0.5s both;
}
.scroll-infinity__item {
  width: calc(100vw / 2);
}
@media print, screen and (min-width: 768px) {
.scroll-infinity__item {
  width: calc(100vw / 3);
  }
}

.scroll-infinity__item>img {
  width: 100%;
}

/* ----------------------------------------------------
  文字スライド
---------------------------------------------------- */
.marquee {
  color: #e7edfb; /* 任意色 */
  padding: 10px 0 10px 0;
  overflow: hidden;
  display: flex;  
}
.marquee-inner {
  display: flex;
  white-space: nowrap;
  animation: marquee 40s linear infinite;
}
.marquee-inner span {
  padding-right: 50px;
  font-size: 70px;
  line-height:40px;
  margin-top: -0.1em;
  }
@media print, screen and (min-width: 768px) {
.marquee {
  padding: 20px 0 10px 0;
}
.marquee-inner span {
  font-size: 180px;
  line-height: 110px;
  }
}
@media print, screen and (min-width: 1200px) {
.marquee {
  padding: 20px 0 10px 0;
}
.marquee-inner span {
  font-size: 250px;
  line-height: 170px;
  }
}

@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ----------------------------------------------------
  文字スライド
---------------------------------------------------- */
/* 親要素 */
.bg_square {
    position: relative; 
    overflow: hidden;
}

/* 背景アニメーションのエリア */
.squares {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
    overflow: hidden;
    z-index: 1;    
    margin: 0;
    padding: 0;
}

/* 前面に来るコンテンツ */
.bg_square .bg_square_hoka {
    position: relative;
    z-index: 2; 
}

/* --- 四角形の共通設定 --- */
.squares li {
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.2); 
    animation: animate 25s linear infinite;
    bottom: -150px; 
    border-radius: 20%; /* 50%で円 */
}

.squares li:nth-child(1){ left: 5%;  width: 80px; height: 80px; animation-delay: 0s; }
.squares li:nth-child(2){ left: 10%; width: 20px; height: 20px; animation-delay: 2s; animation-duration: 12s; }
.squares li:nth-child(3){ left: 80%; width: 20px; height: 20px; animation-delay: 4s; }
.squares li:nth-child(4){ left: 10%; width: 60px; height: 60px; animation-delay: 0s; animation-duration: 18s; }
.squares li:nth-child(5){ left: 85%; width: 100px; height: 100px; animation-delay: 0s; }
.squares li:nth-child(6){ left: 95%; width: 110px; height: 110px; animation-delay: 3s; }
.squares li:nth-child(7){ left: 15%; width: 150px; height: 150px; animation-delay: 7s; }
.squares li:nth-child(8){ left: 95%; width: 50px; height: 50px; animation-delay: 15s; animation-duration: 45s; }
.squares li:nth-child(9){ left: 10%; width: 15px; height: 15px; animation-delay: 2s; animation-duration: 35s; }
.squares li:nth-child(10){ left: 95%;width: 50px; height: 50px; animation-delay: 0s; animation-duration: 11s; }
.squares li:nth-child(11){ left: 5%; width: 45px; height: 45px; animation-delay: 9s; animation-duration: 22s; }
.squares li:nth-child(12){ left: 75%;width: 90px; height: 90px; animation-delay: 12s; animation-duration: 16s; }
.squares li:nth-child(13){ left: 90%;width: 30px; height: 30px; animation-delay: 5s; animation-duration: 20s; }
.squares li:nth-child(14){ left: 5%; width: 70px; height: 70px; animation-delay: 17s; animation-duration: 28s; }
.squares li:nth-child(15){ left: 90%;width: 40px; height: 40px; animation-delay: 8s; animation-duration: 14s; }

/* --- アニメーションの動き --- */
@keyframes animate {
    0% {
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 20%; 
    }
    100% {
        transform: translateY(-2500px) rotate(720deg);
        opacity: 0;
        border-radius: 50%; 
    }
}

/* ----------------------------------------------------
  リンクボタン
---------------------------------------------------- */
.link-card {
  display: block;
  text-decoration: none;
  transition-duration: 300ms;
}
.link-card:hover {
  box-shadow: 0 10px 24px rgba(0,0,0,0.12);
  transition-duration: 300ms;
  background: #eee; /* 任意色 */
}

/* テキスト＋矢印
-------------------------- */
.link-card__body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #f4f7fe; /* 任意色 */
  padding:20px;
}
@media only screen and (max-width: 767px) {
  .link-card__body{
    border-bottom: 1px solid #111; /* 任意色 */
  }
}
@media print, screen and (min-width: 768px) {
.link-card__body {
  padding:30px;
  }
}
@media print, screen and (min-width: 992px) {
.link-card__body {
  padding:50px;
  }
}

/* 左側テキスト
-------------------------- */
.link-card__text {
  flex: 5 1 0%;
  min-width: 0;
}

.link-card__title {
  color: #0549a6; /* 任意色 */
  font-size: 20px;
  margin-bottom: 10px;
}
@media print, screen and (min-width: 768px) {
.link-card__title {
  font-size: 25px;
  }
}
@media print, screen and (min-width: 992px) {
.link-card__title {
  font-size: 28px;
  }
}

/* 矢印
-------------------------- */
.link-card__arrow {
  flex: 1 0 0%;
  display: flex;
  justify-content: flex-end;
  margin-left: 16px;
}
.link-card__arrow img {
  width: 40px;
  height: auto;
}
.link-card__arrow {
  transition: transform 0.3s ease;
}
.link-card:hover .link-card__arrow {
  transform: translateX(6px);
}

/* zoom
-------------------------- */
.mask_01 {
  display: block;
  line-height: 0;
  overflow: hidden;
  background: #292c30; /* 任意色 */
}
.zoomIn_01 img {
  transform: scale(1);
  transition: .3s ease-in-out;
}
.zoomIn_01 .link-card:hover img {
  transform: scale(1.1);
}

/* link-card__img
-------------------------- */
.link-card__img {
  position: relative;
}
/* ホバー後 */
.link-card__img::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #47a5c490, #1450b090); /* 末尾に 90 透過率 */
  z-index: 1;
}
/* ホバー前 */
.link-card__img::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #1450b010, #47a5c410); /* 末尾に 10 透過率 */
  transition: opacity 0.6s ease-in-out;
  z-index: 2;
  opacity: 1;
}
.zoomIn_01 .link-card:hover .link-card__img::after {
  opacity: 0;
}
.link-card__img p {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff; /* 任意色 */
  font-size: 30px;
  letter-spacing: 5px;
}
@media print, screen and (min-width: 992px) {
.link-card__img p {
  font-size: 40px;
  }
}
@media print, screen and (min-width: 1200px) {
.link-card__img p {
  font-size: 50px;
  }
}
@media print, screen and (min-width: 1400px) {
.link-card__img p {
  font-size: 60px;
  }
}

/* ----------------------------------------------------
  ぼかしから出現
---------------------------------------------------- */
.blur{
	animation-name:blurAnime;
	animation-duration:1s;
	animation-fill-mode:forwards;
}

@keyframes blurAnime{
  from {
	filter: blur(10px);
	transform: scale(1.02);
  }

  to {
	filter: blur(0);
	transform: scale(1);
  }
}

/* ----------------------------------------------------
  帯からのテキスト出現
---------------------------------------------------- */
.animated__colorBox {
  font-size: 18px;  
  position: relative;
  white-space: nowrap;
  width: fit-content;
  clip-path: inset(0 100% 0 0);
  color: #fff;
  background-image: linear-gradient(90deg, #22d3ee, #8b5cf6);
  padding:10px 15px 12px 20px;
  border-radius: 10px 0 10px 0;
}
@media print, screen and (min-width: 768px) {
.animated__colorBox {
  font-size: 20px;
  }
}
@media print, screen and (min-width: 992px) {
.animated__colorBox {
  font-size: 22px;
  }
}

.animated__colorBox::after {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff000;
  transform: scaleX(0);
  transform-origin: 0 50%;
  pointer-events: none;
}
.animated__colorBox.js-show {
  animation: 0.8s forwards ease-in-out textView;
}
.animated__colorBox.js-show::after {
  animation: 0.8s forwards ease-in-out colorBox;
}

/* keyframes
--------------------------- */
@keyframes textView {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}

@keyframes colorBox {
  0%, 50% {
    transform-origin: 0 50%;
  }
  60%, 100% {
    transform-origin: 100% 50%;
  }
  60% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(0);
  }
}

/* ----------------------------------------------------
	 ★横　カテゴリー（カタログ）
---------------------------------------------------- */
/* 共通余白　必須class
--------------------------- */
.tenkai_ctrg{
  padding:0;
}
@media print, screen and (min-width: 1200px) {
.tenkai_ctrg{
    padding:0;
  }
}

/* アコーディオン基本
--------------------------- */
.tenkai_ctrg .accordion dt{
  display:block;
  width:100%;
  padding:15px 20px;
  font-weight:normal;
  color: #fff; /* 任意色 */
  background: #0549a6; /* 任意色 */
  cursor:pointer;
}
.tenkai_ctrg .accordion dd{
  display:none;
}
.tenkai_ctrg .accordion dd ul{
  list-style:none;
  padding:0;
  margin:0;
}
.tenkai_ctrg .accordion dd li a{
  display:block;
  padding:15px 40px 15px 20px;
  border-top:1px solid #c8d3ed; /* 任意色 */
  transition:.3s;
  position:relative;
}
@media only screen and (max-width: 767px) {
.tenkai_ctrg .accordion dd li a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%) rotate(45deg);
  width: 8px;
  height: 8px;
  border-top: 2px solid #333;
  border-right: 2px solid #333;
  }
}

/* 縦メニュー　角丸
--------------------------- */
@media only screen and (max-width: 767px) {
.tenkai_ctrg .accordion dt{
  border-radius:0;
  }
.tenkai_ctrg .accordion dd li:last-child a{
  border-radius:0 0 10px 10px;
  border-bottom:none;
  }
}

/* リンク
--------------------------- */
.tenkai_ctrg .accordion dd li a:link,
.tenkai_ctrg .accordion dd li a:visited{
  color:#2c3b52; /* 任意色 */
  background: #fff; /* 任意色 */
}
.tenkai_ctrg .accordion dd li a:hover{
  color:#2c3b52; /* 任意色 */
  background: #cdd8f0; /* 任意色 */
}

/* アイコン
--------------------------- */
.tenkai_ctrg .accordionIcon{
  position:relative;
  float:right;
  top:2px;
  width:30px;
  height:25px;
}
.tenkai_ctrg .accordionIcon span{
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  background:#fff;
  transition:.4s;
}
.tenkai_ctrg .accordionIcon span:nth-of-type(1){top:0;}
.tenkai_ctrg .accordionIcon span:nth-of-type(2){top:11px;}
.tenkai_ctrg .accordionIcon span:nth-of-type(3){bottom:0;}
.tenkai_ctrg .active .accordionIcon span:nth-of-type(1){
  transform:translateY(11px) rotate(-315deg);
}
.tenkai_ctrg .active .accordionIcon span:nth-of-type(2){
  opacity:0;
}
.tenkai_ctrg .active .accordionIcon span:nth-of-type(3){
  transform:translateY(-11px) rotate(315deg);
}

/* 選択中
--------------------------- */
@media only screen and (max-width: 767px) {
.tenkai_ctrg .navon{
  background: #cdd8f0 !important; /* 任意色 */
  color:#2c3b52 !important; /* 任意色 */
  }
}
@media print, screen and (min-width: 768px) {
.tenkai_ctrg .navon{
  background: #0549a6 !important; /* 任意色 */
  color:#fff !important; /* 任意色 */
  }
}

/* カテゴリ（横並び）
--------------------------- */
@media print, screen and (min-width: 768px) {
  .tenkai_ctrg--a .accordion dd{
    display:block;
  }
  .tenkai_ctrg--a .accordion dd ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
  }
  .tenkai_ctrg--a .accordion dd li{
    max-width: 100%; 
  }
  .tenkai_ctrg--a .accordion dd li a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:10px 20px;
    border-radius: 10px; /* 丸み */
    border:2px solid #2c3b52; /* 任意色 */
    background: #fff; /* 任意色 */
    white-space: normal;
    word-break: break-all;
  }
}
@media print, screen and (min-width: 992px) {
.tenkai_ctrg--a .accordion dd ul{
  gap:20px;
  }
}

/* ----------------------------------------------------
	 ★縦 カテゴリー（カタログ）
---------------------------------------------------- */
/* 共通余白　必須class
--------------------------- */
.tenkai_ctrg_02{
  padding:0 0 20px 0;
}
@media print, screen and (min-width: 1200px) {
.tenkai_ctrg_02{
    padding:0 0 30px 0;
  }
}
.tenkai_ctrg_02:last-child{
  padding:0;
}

/* アコーディオン基本
--------------------------- */
.tenkai_ctrg_02 .accordion dt{
  display:block;
  width:100%;
  padding:15px 20px;
  font-weight:normal;
  color:#fff; /* 任意色 */
  background: #23b7e8; /* 任意色 */
  cursor:pointer;
}
.tenkai_ctrg_02 .accordion dd{
  display:none;
}
.tenkai_ctrg_02 .accordion dd ul{
  list-style:none;
  padding:0;
  margin:0;
}
.tenkai_ctrg_02 .accordion dd li a{
  display:block;
  padding:15px 40px 15px 20px;
  border-top:1px solid #c8d3ed;
  transition:.3s;
  position:relative;
}

/* 縦メニュー　角丸
--------------------------- */
@media only screen and (max-width: 767px) {
.tenkai_ctrg_02 .accordion dd li:last-child a{
  border-radius:0 0 10px 10px;
  border-bottom:none;
  }
}
@media print, screen and (min-width: 768px) {
.tenkai_ctrg--b .accordion dd li:first-child a{
  border-radius:10px 10px 0 0;
  }
.tenkai_ctrg--b .accordion dd li:last-child a{
  border-radius:0 0 10px 10px;
  }
}

/* リンク
--------------------------- */
.tenkai_ctrg_02 .accordion dd li a:link,
.tenkai_ctrg_02 .accordion dd li a:visited{
  color:#222; /* 任意色 */
  background:#fff; /* 任意色 */
}
.tenkai_ctrg_02 .accordion dd li a:hover{
  color:#222; /* 任意色 */
  background:#d7dff2; /* 任意色 */
}

/* アイコン
--------------------------- */
.tenkai_ctrg_02 .accordionIcon{
  position:relative;
  float:right;
  top:2px;
  width:30px;
  height:25px;
}
.tenkai_ctrg_02 .accordionIcon span{
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  background:#fff; /* 任意色 */
  transition:.4s;
}
.tenkai_ctrg_02 .accordionIcon span:nth-of-type(1){top:0;}
.tenkai_ctrg_02 .accordionIcon span:nth-of-type(2){top:11px;}
.tenkai_ctrg_02 .accordionIcon span:nth-of-type(3){bottom:0;}
.tenkai_ctrg_02 .active .accordionIcon span:nth-of-type(1){
  transform:translateY(11px) rotate(-315deg);
}
.tenkai_ctrg_02 .active .accordionIcon span:nth-of-type(2){
  opacity:0;
}
.tenkai_ctrg_02 .active .accordionIcon span:nth-of-type(3){
  transform:translateY(-11px) rotate(315deg);
}

/* 現在選択中のカテゴリ
--------------------------- */
@media only screen and (max-width: 767px) {
.tenkai_ctrg_02 .navon{
  background:#cdd8f0 !important; /* 任意色 */
  color:#222 !important; /* 任意色 */
  }
}
@media print, screen and (min-width: 768px) {
.tenkai_ctrg_02 .navon{
  background:#185db3 !important; /* 選択中　背景色 */
  color:#fff !important; /* 任意色 */
  }
}

/* カテゴリ Bタイプ（縦メニュー）
--------------------------- */
.tenkai_ctrg--b .accordion dd li a::after{
	font-family: "Font Awesome 5 Free";
  content:"\f054";
  font-weight:900;
  position:absolute;
  right:20px;
  top:50%;
  transform:translateY(-50%);
  font-size:14px;
  }
@media print, screen and (min-width: 768px) {
.tenkai_ctrg--b .accordion dd{
  display:block;
  }
.tenkai_ctrg--b .accordion dd ul{
  display:block;
  }
.tenkai_ctrg--b .accordion dd li{
  width:100%;
  }
.tenkai_ctrg--b .accordion dd li a{
  text-align:left;
  border-radius:0;
  }
}

/* 追従 */
@media screen and (min-width: 768px) {
  .tenkai_ctrg_02.tenkai_ctrg--b {
    position: -webkit-sticky;
    position: sticky;
    top: 115px;
    z-index: 1;
    height: max-content;
  }
}
@media screen and (min-width: 992px) {
  .tenkai_ctrg_02.tenkai_ctrg--b {
    top: 100px;
  }
}

/* ----------------------------------------------------
	   ページング
---------------------------------------------------- */
.part_paging{padding:30px 0 0 0}
@media print, screen and (min-width: 992px) {.part_paging{padding:40px 0 0 0}}
.paging { text-align: center; font-size: 90%;}
.paging span.current,
.paging span.paging-text{
	margin:0px 0.5px;
	color:#2c3b52; /* 任意色 */
	border:2px solid #2c3b52; /* 任意色 */
	zoom:1;
	display:inline-block;
	overflow:hidden;
	text-decoration:none;
	background: #fff;
  border-radius: 5px;  
}
.paging span.paging-text a{
	padding:5px 8.5px;
	display:block;
	color: #2c3b52; /* 任意色 */
}
.paging span.current{
	background: #2c3b52; /* 任意色 */
	border:2px solid #2c3b52; /* 任意色 */
	color:#fff; /* 任意色 */
	zoom:1;
	padding:5px 8.5px;
	text-decoration:none;
	display:inline-block;
	cursor:pointer;
  border-radius: 5px;
}
.paging span.paging-text a:hover{
	background: #2c3b52; /* 任意色 */
	color:#fff; /* 任意色 */
	text-decoration:none;
	cursor:pointer;
	opacity: 1;
}
@media print, screen and (min-width: 768px) {
	.paging { font-size: 100%;}
	.paging span.current,
	.paging span.paging-text{margin:0px 2px;}
	.paging span.paging-text a{padding:10px 15px;}
	.paging span.current{padding:10px 15px;}
}

/* ----------------------------------------------------
	 スクロールヒント用
---------------------------------------------------- */
.table_wrap {
  width: 100%;
  margin-inline: auto;
}

/* スクロールバーの見た目 */
.table_wrap::-webkit-scrollbar { height: 10px; }
.table_wrap::-webkit-scrollbar-track { background-color: #E2E2E2; }
.table_wrap::-webkit-scrollbar-thumb { background-color: #bbb; }

/* テーブルを囲うエリア
---------------------------------------------------- */
@media only screen and (max-width: 767px) {
.table_wrap {
  width: 100%;
  height: auto; 
  overflow-x: auto; /* 横スクロールを出す */
  overflow-y: hidden !important; /* 縦スクロールを出さない */
  }
}
@media print, screen and (min-width: 768px) {
.table_wrap {
  overflow-y: hidden !important; /* 縦スクロールを出さない */
  }
}

/* テーブル自体につけるスタイル
---------------------------------------------------- */
@media only screen and (max-width: 767px) {
.table_hint {
  width: 800px; /* テーブルの横幅を固定して横スクロールを発生させる */
  margin: 0 auto;
  }
}
@media print, screen and (min-width: 768px) {
.table_hint {
    width: 100%; /* 画面幅いっぱいに広げる */
  }
}

@media only screen and (max-width: 767px) {
.table_hint_02 {
  width: 500px; /* テーブルの横幅を固定して横スクロールを発生させる */
  margin: 0 auto;
  }
}
@media print, screen and (min-width: 768px) {
.table_hint_02 {
    width: 100%; /* 画面幅いっぱいに広げる */
  }
}

/* ----------------------------------------------------
  アイテムボックス（ボタンリンクあり）
---------------------------------------------------- */
/* アイテム全体
----------------------------- */
.item_panel{
  background: #fff; /* 任意色 */
  gap: 15px;
  padding: 20px;
  border: 2px solid #e4e9f6; /* 任意色 */
  border-radius: 10px;
  margin-bottom: 20px;
  color: #2c3b52; /* 任意色 */
}
@media print, screen and (min-width: 992px) {
  .item_panel{
    padding: 30px;
    margin-bottom: 30px;
  }
}

/* アイテム写真
----------------------------- */
.item_panel_photo{
  margin-bottom: 10px;
}

/* タイトル
----------------------------- */
.item_panel_title{
  font-size: 16px;
  line-height: 26px;
}
@media print, screen and (min-width: 992px) {
  .item_panel_title{
    font-size: 18px;
    line-height: 28px;
  }
}

/* 詳細ボタン
----------------------------- */
.syousai_btn {
  margin-top: 5px;
  font-size: 14px;
  text-align: left;
  display: inline-block;  
  color: #fff !important; /* 任意色 */
  background: #2c3b52;
  border: 2px solid #2c3b52; /* 任意色 */
  width: 180px;
  padding: 6px 40px 6px 14px; 
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 10px;
  position: relative;
  box-sizing: border-box;
}
@media print, screen and (min-width: 768px) {
  .syousai_btn {
    margin-top: 10px;
  }
}

.syousai_btn:hover {
  background: #185db3;
  border-color: #185db3;
  opacity: 0.9;
}

/* 丸 */
.syousai_btn::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 14px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #fff; /* 任意色 */
  transition: all 0.3s ease;
}

/* 矢印 */
.syousai_btn::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%) rotate(45deg);
  right: 22px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #2c3b52; /* 任意色 */
  border-right: 1px solid #2c3b52; /* 任意色 */
  z-index: 1;
  transition: all 0.3s ease;
}

/* 矢印のカラーホバー連動 */
.syousai_btn:hover::before {
  border-top: 1px solid #185db3;
  border-right: 1px solid #185db3;
}