@charset "utf-8";
/* CSS Document */

/* a {
    outline: none;
}

area:link {
    outline: none;
}

area:active {
    outline: none;
}

area:visited {
    outline: none;
}

a img {
    outline: none;
}

a:focus,
button:focus {
    outline: none;
} */

html {
    min-height: 100%;
    position: relative;
}

body {
    background-color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    z-index: 10000; /* 最前面 */
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transform: translateZ(0); /* Safari/モバイル重なりバグ回避 */
    will-change: transform;
}

    .navi_sp {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap; /* ←これ重要：改行しない */
    padding: 10px 15px;
}

.navi_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.hamburger {
    width: 40px;
    height: 25px;
    position: relative;
    cursor: pointer;
    z-index: 1100;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.hamburger span {
    position: absolute;
    height: 3px;
    width: 100%;
    background: #00438f;
    left: 0;
    transition: all 0.4s ease;
}

/* 3本線の位置 */
.hamburger span:nth-child(1) {
    top: 0;
}
.hamburger span:nth-child(2) {
    top: 11px;
}
.hamburger span:nth-child(3) {
    bottom: 0;
}

/* 開いたときのバツ（×） */
.hamburger.open span:nth-child(1) {
    transform: rotate(45deg);
    top: 11px;
}

.hamburger.open span:nth-child(2) {
    opacity: 0;
}

.hamburger.open span:nth-child(3) {
    transform: rotate(-45deg);
    bottom: auto;
    top: 11px;
}

.drawr {
    display: none;
    position: fixed; /* absolute ではなく fixed にする */
    top: 80px; /* スクロールしても固定 */
    left: 0;
    width: 100%;
    height: 100vh; /* 必要に応じてフルスクリーン */
    background: #fff;
    z-index: 10000; /* オーバーレイより上 */
    overflow-y: auto; /* メニューが長い場合スクロール */
}

.drawr ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.drawr li:first-child {
    border-top: 2px solid #eee;
}

.drawr li {
    border-bottom: 2px solid #eee;
}

.drawr li a {
    display: block;
    padding: 15px 20px;
    text-decoration: none;
    color: #000;
	font-size: 1.1rem;
	font-weight: 700;
	
}

.drawr li a:hover {
    background: #f0f0f0;
}

.drawr.show {
    display: block;
}

.logo_sp {
    display: block;
    width: 150px;
    padding: 5px 0 5px 0;
}

.logo_sp a img {
    width: 100%;
    height: auto;
}

.navi {
    display: none;
}

.menu-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #fff;
    z-index: 10000; /* メニュー（z-index: 100000）のすぐ下に */
}

/* 表示状態 */
.menu-overlay.show {
    display: block;
}

/*----------KV------------------------------------------------------------------*/

.main {
        width: 100%;
        height: auto;
        padding: 80px 0 0 0;
        display: block;
}

.main-inner{
        width: 100%;
		height: auto;
        margin: 0 auto;
        position: relative;
		background-image: url("../images/kv_sp.png");
    	background-repeat: no-repeat;
    	background-position: top center;
    	background-size: cover;
}

.main-copy{
        position: absolute;
        top: 5%;
        left: 3%;
        text-align: left;
        width: 90%;
}

.main-copy p{
        color: #00438f;
        font-size: 1.4rem;
        text-align: left;
        line-height: 33px;
		letter-spacing: 0.5;
}

.main-copy span{
		background: linear-gradient(transparent 0%, #ffea00 0%);
		font-weight: bold;
		font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", Meiryo, sans-serif;
		font-feature-settings: "palt";
		padding: 3px 5px;
}

.main_logo{
        width: 90%;
        height: auto;
		text-align: center;
		padding: 30% 0;
		margin: 0 8% 0 2%;
}

.main_logo img{
        width: 100%;
        height: auto;
}

/*----------お知らせ------------------------------------------------------------------*/

.info-bg{
		max-width: 100%;
		-webkit-background-size: 10px 10px;
		-moz-background-size: 10px 10px;
		background-size: 10px 10px;
		background-color: #00438f;
		padding: 3% 1%;
}

.info-con {
        width: 90%;
        margin: 0 auto;
		text-align: center;
        padding: 10px 2% 20px 3%;
        background: #fff;
        position: relative;
}

.info-con h2 {
       font-size: 1.4rem;
       color: #205bba;
       line-height: 2;
       padding: 0 0 0 0;
       margin: 0 0 10px 0;
       text-align: center;
       display: block;
       font-weight: bold;
}

.news01 {
       max-width: 100%;
       overflow-x: hidden;
       height:195px;
       overflow-wrap :normal;
       margin: 0 auto;
}

.news01 dl {
        font-size: .9rem;
        line-height: 1.5;
        border-top: 1px solid #00438f;
        width: 100%;
        float: left;
        padding: 10px 0 10px 0;
		position: relative;   
}

.news01 dl:last-child {
        margin-bottom: 5px;
        border-bottom: 1px solid #00438f;
}

.news01 dl dt {
        width: 110px;
        color: #fff;
        float: left;
        padding: 0 0 0 0;
		background-color: #00438f;
}

.news01 dl dd {
        color: #141414;
        float: left;
        width: 100%;
        padding: 0 0 0 0;
        overflow: auto;
		text-align: left;
}

.news01 dl a::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 1%;
		width: 20px;
		height: 20px;
		background-image: url("../images/yicon.png");
		background-size: contain;
		background-repeat: no-repeat;
		transform: translateY(-50%);
}

.news01 dl dd a {
        color: #141414;
        display: block;
		text-decoration: none;
  		position: relative;
  		padding-right: 24px;
		margin-top: 10px
}

.news01 dl dd a:hover,.ichiran a:hover{
		text-decoration: underline;
}

/* スクロールバー */
.news01 {
  		--sb-track-color: #ffffff;
  		--sb-thumb-color: #00438f;
  		--sb-size: 15px;
}

.news01::-webkit-scrollbar {
  		width: var(--sb-size)
}

.news01::-webkit-scrollbar-track {
  		background: var(--sb-track-color);
  		border-radius: 1px;
}

.news01::-webkit-scrollbar-thumb {
  		background: var(--sb-thumb-color);
  		border-radius: 1px;
  		border: 2px solid #ffffff;
}

@supports not selector(::-webkit-scrollbar) {
  .news01 {
  		scrollbar-color: var(--sb-thumb-color)
                     var(--sb-track-color);
  }
}

/*----------ステートメント------------------------------------------------------------------*/

.statement-bg{
  		max-width: 100%;
  		-webkit-background-size: 10px 10px;
  		-moz-background-size: 10px 10px;
  		background:
			url(../images/st_bg_sp.png)left top no-repeat,
			linear-gradient(to bottom, #ffffff, #cccccc);
  		padding: 30px 0 15px 0;
  		background-size: auto 100%, 100% 100%;
}

.statement-con {
        width: 100%;
        margin: 0 auto;
		text-align: center;
        padding: 10px 0 10px 0;
        position: relative;
		font-family: 'Noto Serif JP', serif;
}

.statement-con .tight {
  		margin-right: -0.5em; /* 後ろを詰める */
}

.statement-con h2 {
       font-size: 2rem;
       color: #000;
       line-height: 2;
       padding: 0 0 0 10px;
       margin: 25px 0 35px 0;
       text-align: center;
       display: inline;
       font-weight: bold;
	   background: linear-gradient(transparent 70%, #f58a1e 70%);
}

.statement-con p {
        width: 90%;
        font-size: 1.1rem;
        line-height: 1.8;
        padding: 0 0 0 0;
        margin: 20px 5% 20px 5%;
        text-align: left;
        font-weight: bold;
  		text-shadow:
      -1px -1px 2px #fff,
       1px -1px 2px #fff,
      -1px  1px 2px #fff,
       1px  1px 2px #fff;
}

/*----------デジタル人材とは------------------------------------------------------------------*/

.about-con {
        width: 100%;
        margin: 0 auto;
		text-align: center;
        padding: 50px 0 50px 0;
        background: #fff;
        position: relative;
}

.about-con h2 {
        font-size: 2rem;
        position: relative;
        display: inline-block;
        margin: 0.8em 0 1.5em;
        padding: 10px 5% 15px;
        min-width: 250px;
        max-width: 100%;
        color: #fff;
        background: #00438f;
}

.about-con h2:before {
       content: "";
       position: absolute;
       top: 100%;
       left: 50%;
       margin-left: -15px;
       border: 10px solid transparent;
       border-top: 15px solid #00438f;
}

.about-con .txt {
       	color: #454545;
		text-align: left;
        font-size: 1rem;
       	margin: 0 5% 30px 5%;
       	padding: 0;
		line-height: 2;
		font-weight: 600;
		letter-spacing: 0.1px;
}

.about-con01 {
        width: 90%;
		height: auto;
        margin: 0 auto;
        padding: 0 5% 0 5%;
        position: relative;
}

.about-con01 .about-left{
		width: 100%;
}

.about-con01 .about-right{
		width: 100%;
}

.about-con01 h3 {
		width: 100%;
       	color: #fff;
       	background: #00438f;
		text-align: center;
        font-size: 1.3rem;
       	margin: 0;
       	padding: 5px 0 10px;
}

.about-con01 .about-img01 {
		text-align: center;
       	margin: 0;
       	padding: 20px 0 20px;
		width: 100%;
}

.about-con01 .about-img01 img{
		width: 300px;
		height: auto;
}

.about-con01 h4 {
       	color: #00438f;
       	background: #fff;
		border: #00438f solid 2px;
		border-radius: 30px;
		text-align: center;
        font-size: 1.1rem;
		font-weight: bold;
       	margin: 0;
       	padding: 3px;
}

.about-con01 p {
       	color: #454545;
		text-align: left;
        font-size: 1rem;
       	margin: 0;
       	padding: 15px 5px 30px;
		line-height: 2;
		font-weight: 600;
		letter-spacing: 0.1px;
}

.about-con01 p span {
		margin-left: 90%;
		font-weight: 600;
}

/*----------柔軟なワークスタイル------------------------------------------------------------------*/

.wstyle-bg{
  		max-width: 100%;
  		-webkit-background-size: 10px 10px;
  		-moz-background-size: 10px 10px;
  		background:
			url(../images/con1_bg_sp.png)center top no-repeat;
  		padding: 0;
  		background-size: cover;
}

.wstyle-con {
        width: 100%;
        margin: 0 auto;
		text-align: center;
        padding: 2px 0;
        position: relative;
}

.wstyle-con h2 {
       font-size: 1.6rem;
  	   position: relative;
       display: inline-block;
       margin: 1em 0;
       padding: 10px 0 0;
       min-width: 100%;
       max-width: 100%;
       color: #00438f;
	   font-weight: 600;
  		text-shadow:
      -1px -1px 2px #fff,
       1px -1px 2px #fff,
      -1px  1px 2px #fff,
       1px  1px 2px #fff;
}

.wstyle-con h2 {
       display: flex;
       align-items: center; /* 垂直中心 */
       justify-content: center; /* 水平中心 */
}

.wstyle-con h2:before, .wstyle-con h2:after {
       border-top: 3px solid;
       content: "";
       width: 2em; /* 線の長さ */
}

.wstyle-con h2:before {
       margin-right: .5em; /* 文字の右隣 */
}

.wstyle-con h2:after {
       margin-left: .5em; /* 文字の左隣 */
}

.wstyle-con .txt {
       	color: #454545;
		text-align: left;
        font-size: 1rem;
       	margin: 0 5% 30px 5%;
       	padding: 0;
		line-height: 2;
		font-weight: 600;
		letter-spacing: 0.1px;
  		text-shadow:
      -1px -1px 2px #fff,
       1px -1px 2px #fff,
      -1px  1px 2px #fff,
       1px  1px 2px #fff;
}

.wstyle-con .txt01 {
       	color: #454545;
		text-align: left;
        font-size: .9rem;
       	margin: 0 5% 30px 5%;
       	padding: 0;
		font-weight: 600;
		letter-spacing: 0.1px;
  		text-shadow:
      -1px -1px 2px #fff,
       1px -1px 2px #fff,
      -1px  1px 2px #fff,
       1px  1px 2px #fff;
}

.wstyle-con01 {
        width: 90%;
		height: auto;
        margin: 0 auto;
        padding: 0 5% 20px 5%;
        position: relative;
}

.wstyle-con01 .wstyle-left{
		background: #fff;
		width: 100%;
		border: solid 2px #00438f;
		border-radius: 15px;
	    margin-bottom: 4%;
}

.wstyle-con01 .wstyle-right{
		background: #fff;
		width: 100%;
		border: solid 2px #00438f;
		border-radius: 15px;
		padding-bottom: 20px;
}

.wstyle-con01 h3 {
		width: 100%;
       	color: #fff;
       	background: #00438f;
		text-align: center;
        font-size: 1.3rem;
       	margin: 0;
       	padding: 10px 0 15px;
		border-radius: 12px 12px 0 0;
}

.wstyle-con01 .wstyle-img01 {
		text-align: center;
       	margin: 0;
       	padding: 0 0 0;
		width: 100%;
}

.wstyle-con01 .wstyle-img01 img{
		width: 90%;
		height: auto;
		margin-bottom: 15px;
}

.wstyle-con01 h4 {
       	color: #00438f;
       	background: #fff;
		border: #00438f solid 2px;
		text-align: center;
        font-size: 1.1rem;
		font-weight: bold;
       	margin: 0 20px;
       	padding: 0px;
}

.wstyle-con01 h5 {
       	margin: 20px 20px;
       	padding: 3px;
		position: relative;
}

.wstyle-con01 .triangle1{
		background-color: #00438f;
		width: 15px;
		height: 19px;
		clip-path: polygon(0 0, 0 100%, 100% 50%);
}

.wstyle-con01 .text {
  		position: absolute;
  		left: 30px; /* 三角形から少し離す */
  		top: 0;
       	color: #00438f;
        font-size: 1.1rem;
		font-weight: bold;
}

.wstyle-con01 p {
       	color: #454545;
		text-align: left;
        font-size: 1.1rem;
       	margin: 0;
       	padding: 15px 20px;
		line-height: 1.5;
		font-weight: 600;
		letter-spacing: 0.1px;
}

.wstyle-con01 span {
        font-weight: bold;
        background: linear-gradient(transparent 65%, #f58a1e 65%);
}

/*----------チェックリスト------------------------------------------------------------------*/

.check-bg{
  		max-width: 100%;
  		-webkit-background-size: 10px 10px;
  		-moz-background-size: 10px 10px;
		background: #cee5ff;
  		padding: 0;
}

.check-con {
        width: 90%;
        margin: 0 auto;
		text-align: center;
        padding: 5px 5%;
        position: relative;
}

.check-con .txt {
       	color: #00438f;
		text-align: left;
        font-size: 1.1rem;
       	margin: 30px 0 30px 0;
       	padding: 0;
		line-height: 2;
		font-weight: 600;
		letter-spacing: 0.1px;
}

.check-con01 {
        width: 100%;
		height: auto;
        margin: 0 auto;
        padding: 0 0 20px 0;
        justify-content: space-between;
        position: relative;
}

.check-con01 .list-flex {
        list-style: none;
        margin: 0;
        padding: 0;
}

.check-con01 .list-flex li {
        display: flex;
        align-items: center;
        gap: 5px;
        padding: 8px 10px 10px 10px;
        box-sizing: border-box;
        border-radius: 30px;
        background-color: #fff;
        margin-bottom: 15px;
        width: 100%;
        border: 3px solid #00438f;
        text-align: left;
        font-size: .85rem;
        font-weight: 600;
        font-feature-settings: "palt";
}

.check-con01 .list-flex li:nth-child(odd) {
        margin-right: 10px;
}

.check-con01 .list-flex img {
        width: 30px;
        height: 24px;
        object-fit: contain;
}

.check-con01 p {
       	color: #454545;
		text-align: left;
        font-size: 1.02rem;
       	margin: 0;
       	padding: 15px 15px;
		line-height: 1.5;
		font-weight: 600;
		letter-spacing: 0.1px;
}

/*----------FOCUS------------------------------------------------------------------*/

  .focus-con {
    width: 90%;
    margin: 0 auto;
    text-align: center;
    padding: 30px 5% 15px 5%;
    background: #fff;
    position: relative;
  }

.focus-con h2 {
  font-size: 2rem;
  display: inline-block;
  margin: 1.5em 0 1.5em;
  padding: 10px 22% 15px;
  color: #fff;
  background: #00438f;
  position: relative;
}

.focus-con h2:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 10px solid transparent;
  border-top: 15px solid #00438f;
}

  .focus-con .txt {
    font-size: 1rem;
    margin: 0 0 20px 0;
    line-height: 1.8;
  }

  /* ---- スマホ用Swiperスライド ---- */
  .swiper-slide.focus-slide {
    display: flex !important;
    justify-content: space-between;
    gap: 0;
	margin-bottom: 10%;
  }

  .swiper-slide.focus-slide .focus-item {
    flex: 100% !important;
    max-width: 100% !important;
    text-align: center;
  }

  .focus-item h3 {
  font-size: 1.06rem;
  margin: 0;
  padding: 5px 0 10px;
  font-weight: 600;
  }

.focus-item .focus-img01 {
  text-align: center;
  margin: 0;
  width: 98%;
}
  .focus-item .focus-img01 img {
    width: 100%;
    height: auto;
  }

/* ▼ 矢印＋ページャーのまとまり（PC/スマホ共通） */
.focus-con .swiper-controls {
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 0;
  z-index: 10;
}

/* ページネーション（ドット） */
.focus-con .swiper-controls .swiper-pagination {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 7.5% 0 0 0; /* ドットが下にずれない */
}

/* ドット */
.swiper-pagination-bullet {
  background: #ccc;
  opacity: 1;
  margin: 0 4px;
}

.swiper-pagination-bullet-active {
  background: #00438f;
}

/* 自動再生ボタン */
.autoplay-toggle {
  position: absolute;         /* 絶対配置 */
  top: 50%;                  
  right: -36px;               /* 右矢印の外側 */
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  padding: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 11;
}

/* アイコン */
.icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  position: relative;
}

/* ▶ 再生アイコン */
.icon.play::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 14px solid #0072ff;
}

/* ‖ 停止アイコン */
.icon.pause::before,
.icon.pause::after {
  content: "";
  position: absolute;
  top: 0;
  width: 4px; 
  height: 100%;
  background: #0072ff;
  border-radius: 1px;
}
.icon.pause::before { left: 3px; }
.icon.pause::after  { right: 3px; }

/* 矢印ボタン */
.nav-btn {
  width: 30px;
  height: 30px;
  border: none;
  display: grid;
  place-items: center;
  cursor: pointer;
  background: #fff;
}

/* くの字マーク */
.nav-btn::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border: 2px solid #00438f;
  border-top: 0;
  border-right: 0;
}

/* 左右の回転 */
.custom-prev::before { transform: rotate(45deg); }
.custom-next::before { transform: rotate(-135deg); }

/* 矢印の順序 */
.custom-prev { order: 0; }
.custom-next { order: 2; }

/* ===== スマホ用調整 ===*



/*----------全国採用情報一覧日本地図------------------------------------------------------------------*/

.maps-bg{
  		padding: 15px 0 15px 0;
}

.maps-con {
        width: 90%;
		height: auto;
        margin: 0 auto;
		text-align: center;
        padding: 50px 0 10px 0;
        position: relative;
		display: block;
}

.maps-con h2 {
       font-size: 2rem;
  	   position: relative;
       display: inline-block;
       margin: 0.8em 0 0.8em;
       padding: 10px 5% 15px;
       min-width: 250px;
       max-width: 100%;
       color: #fff;
       background: #00438f;
}

.maps-con h2:before {
       content: "";
       position: absolute;
       top: 100%;
       left: 50%;
       margin-left: -15px;
       border: 10px solid transparent;
       border-top: 15px solid #00438f;
}

.maps-con .txt {
		color: #454545;
		text-align: center;
        font-size: 1rem;
       	margin: 0 0 30px 0;
       	padding: 0;
		line-height: 2;
		font-weight: 600;
		letter-spacing: 0.1px;
  		text-shadow:
      -1px -1px 2px #fff,
       1px -1px 2px #fff,
      -1px  1px 2px #fff,
       1px  1px 2px #fff;
}

.maps-con01 {
        width: 100%;
		height: auto;
        margin: 0 auto;
        padding: 0 0 20px 0;
		display: block;
  		max-width: 100%;
  		-webkit-background-size: 10px 10px;
  		-moz-background-size: 10px 10px;
  		background:
			url(../images/maps_bg.png)center 25% no-repeat,#cee5ff;
  		background-size: 100%;
}

.maps-con .map-container {
		position: relative;
        width: 100%;
		margin: 0 auto;
}

.maps-con .region {
		position: relative;
		background: #ffffff;
		border: 2px solid #00438f;
		padding: 0;
		width: 100%;
		margin: 3% 0;
}

.maps-con .region h3 {
		background: #00438f;
		color: #fff;
		font-size: 1.4rem;
		margin: 0 0 0;
		text-align: center;
		line-height: 2;
}

.maps-con .region ul {
		list-style: none;
		padding: 0;
		margin: 0;
}

.maps-con .region ul li {
		padding: 4px 0;
		border-bottom : 2px solid #00438f;
}

.maps-con .region ul li:last-child {
		border-bottom : none;
}

.maps-con .region ul li a {
		text-decoration: none;
		color: #003366;
		display: flex;
		justify-content: space-evenly;
		font-weight: 600;
		position: relative;
		font-size: 1.4rem;
		line-height: 1.5;
}

.maps-con .region ul li a::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 5px;
		width: 25px;
		height: 25px;
		background-image: url("../images/yicon.png");
		background-size: contain;
		background-repeat: no-repeat;
		transform: translateY(-50%);
}
.maps-con .region ul li:hover {
		background: #bedcff;
}

.maps-con .region ul li.nlink{
		pointer-events: none;
		background: #919191;
}

.maps-con .new {
		content: "";
		position: absolute;
		top: 0;
		left: 5px;
		color: red;
		font-size: 16px;
		margin-right: 5px;
		font-weight: 600;
}

.maps-con .accordion-btn {
		width: 100%;
		background: #eee;
		padding: 0;
		text-align: left;
		border: none;
		cursor: pointer;
		position: relative;
}

.maps-con .accordion-btn::after {
		content: '＋';
		position: absolute;
		right: 10px;
		font-weight: bold;
}

.maps-con .accordion-btn.active::after {
		content: '−';
}

.maps-con .accordion-content {
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.3s ease;
		background: #f9f9f9;
		padding: 0 0;
}

.maps-con .accordion-content ul {
		margin: 0;
		padding: 0 0;
		list-style: none;
}

.map-container {
  display: none;
}
.map-container.active {
  display: block;
}

/*----------全国採用情報一覧------------------------------------------------------------------*/

.list-bg{
  		max-width: 100%;
  		-webkit-background-size: 10px 10px;
  		-moz-background-size: 10px 10px;
  		padding: 0 0 15px 0;
}

.list-con {
  		max-width: 90%;
		height: 950px;
        margin: 0 auto;
		text-align: left;
        padding: 0 0 10px 0;
        position: relative;
}

.list-con .txt01 {
       	color: #454545;
		text-align: left;
        font-size: .9rem;
       	margin: 0 0 30px 0;
       	padding: 0;
		font-weight: 600;
		letter-spacing: 0.1px;
  		text-shadow:
      -1px -1px 2px #fff,
       1px -1px 2px #fff,
      -1px  1px 2px #fff,
       1px  1px 2px #fff;
}

.button-area {
	   margin-bottom: 20px;
	   display: flex;
	   justify-content: space-between;
	   gap: 10px;
}

.soon-wrapper {
	   display: flex;
	   flex-direction: column;
	   align-items: center;
	   width: 48.6%;
}

.current {
	   font-size: 16px;
	   margin-bottom: 20px;
	   font-weight: bold;
	   height: 20px; /* 高さを固定して、上下でズレないように */
}

.coming-soon {
	   font-size: 14px;
	   color: #ff6600;
	   margin-bottom: 5px;
	   font-weight: bold;
	   height: 20px; /* 高さを固定して、上下でズレないように */
}

.coming-soon.invisible {
	   visibility: hidden; /* 都道府県側には見えないダミー */
}

.button-area button {
	   padding: 15px 20px;
	   font-size: 16px;
	   cursor: pointer;
	   width: 100%;
	   border-radius: 30px;
	   background-color: #fff;
	   border: 3px #00438f solid;
	   color: #00438f;
	   font-weight: bold;
}

.button-area button.active {
	   background-color: #00438f;
	   color: #fff;
	   border: 3px #00438f solid;
}

.list-con .fixed-rowk {
       position: sticky;
       top: 0;
	   left:0;
       z-index: 200;
       background-clip: padding-box;
}
.list-con .fixed-row {
       position: sticky;
       top: 0;
       z-index: 200;
       background-clip: padding-box;
}

.anchor-spacer {
       display: block;
       height: 85px;         /* 固定ヘッダーと同じ高さ */
       margin-top: -85px;
       visibility: hidden;
}

.table-container {
      display: none;
      position: relative;
      overflow: auto;
}

.table-container.active {
      display: block;
  	  overflow-x: auto;
      -webkit-overflow-scrolling: touch; /* iOS対応 */
 	  box-sizing: content-box; 
      height:800px;
}

.list-con table {
     border-collapse: collapse; /* 親要素に指定 */
     border-spacing: 0;
   }
.list-con .sticky {
       position: sticky;
       left: 0;
       z-index: 200;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}
.list-con .sticky02 {
       position: sticky;
       left: 93px;
       z-index: 200;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}
.list-con .stickyk {
       position: sticky;
	   top:0;
       left: 0;
       z-index: 230;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}
.list-con .stickyk02 {
       position: sticky;
	   top:0;
       left: 93px;
       z-index: 230;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}
.list-con td.sticky {
       position: sticky;
       left: 0;
       z-index: 200;
       background-color: #fff;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}

.list-con table tr.end td.sticky {
       position: sticky;
       left: 0;
       z-index: 200;
       background: #f4f4f4;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}
.list-con td.sticky02 {
       position: sticky;
       left: 93px;
       z-index: 200;
       background-color: #fff;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}

.list-con table tr.end td.sticky02 {
       position: sticky;
       left: 93px;
       z-index: 200;
       background: #f4f4f4;
       border: 2px solid #e5f1ff;
       background-clip: padding-box;
}
.list-con table {
     border-collapse: separate; /* 親要素に指定 */
     border-spacing: 0;
      width: 100%;
      table-layout: fixed;
      margin-top: 0;
      min-width: 850px; /* スクロールが必要な幅を設定 */
    }

/* スクロールバー */
.list-con .table-container{
       --sb-track-color: #ffffff;
       --sb-thumb-color: #00438f;
       --sb-size: 10px;
}

.list-con .table-container::-webkit-scrollbar {
  		width: var(--sb-size)
}

.list-con .table-container::-webkit-scrollbar-track {
  		background: var(--sb-track-color);
  		border-radius: 1px;
}

.list-con .table-container::-webkit-scrollbar-thumb {
  		background: var(--sb-thumb-color);
  		border-radius: 1px;
}

.list-con .table-container th[data-sortable="true"] {
    cursor: pointer;
}

.list-con table th, td {
       border-top: 2px solid #e5f1ff;
       border-bottom: 2px solid #e5f1ff;
       border-left: 1px solid #e5f1ff;
       border-right: 1px solid #e5f1ff;
       padding: 10px;
       text-align: center;
       position: relative;
}

.list-con table tr {
       background: #fff;
}

.list-con table tr.end {
		background: #f4f4f4;
}

.list-con table td span a{
       background: #00438f;
       color: #fff;
       border-radius: 15px;
       font-size: 12px;
       padding: 3px 10px 5px;
       text-decoration: none;	
}

.list-con table td span a:hover{
       background: #bedcff;
}

.list-con table th[data-sortable="true"] {
       background-color: #d3d3d3;
       cursor: pointer;
       color: #00438f;
       text-decoration:underline;
       padding: 15px 0;
       vertical-align:middle;
       line-height: 1.2;
}

.list-con table th:not([data-sortable="true"]) {
       background-color: #d3d3d3;
       color: #00438f;
       cursor: default;
       padding: 15px 0;
       vertical-align:middle;
       line-height: 1.2;
}

.list-con table .sort-icon {
       position: absolute;
       bottom: 4px;
       left: 50%;
       transform: translateX(-50%);
       font-size: 10px;
       color: #00438f;
       pointer-events: none;
       user-select: none;
}

.list-con table th.sorted .sort-icon {
       color: #000;
       font-weight: bold;
}

.scroll-hint-icon,
.scroll-hint-text {
    z-index: 500; /* 固定セル(200)より高く、header(10000)より低い */
    position: relative; /* stacking context作成 */
    pointer-events: none; /* クリックを透過 */
}
/*----------関連情報------------------------------------------------------------------*/

.link-con {
        width: 100%;
        margin: 0 auto;
		text-align: center;
        padding: 10px 0 30px 0;
        background: #fff;
        position: relative;
}

.link-con h2 {
        font-size: 1.5rem;
        position: relative;
        display: inline-block;
        margin: 0.8em 0 0.8em;
        padding: 0 0 5px;
        min-width: 100%;
        max-width: 100%;
        color: #fff;
        background: #00438f;
}

.link-con01 {
        width: 90%;
		height: auto;
        margin: 0 auto;
        padding: 0 5% 20px 5%;
        position: relative;
		text-align: left;
		line-height: 2;
}

.link-con01 p{
        font-size: 1.1rem;
}

.link-con01 a {
       	color: #00438f;
        font-size: .85rem;
		word-wrap: break-word; 
}

.link-con01 a:hover {
        opacity: 0.7;
}

.link-con01 a.external-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  flex-wrap: wrap; /* テキストだけ折り返す場合は wrap */
  max-width: 100%;
}

.link-con01 .external-icon {
  width: 1em;
  height: 1em;
  background-image: url('../images/icon_window_keycolor.svg');
  background-size: contain;
  background-repeat: no-repeat;
  flex-shrink: 0;
}


/*----------footer------------------------------------------------------------------*/

.footer {
        width: 100%;
        font-size: .73rem;
        padding: 15px 0;
        text-align: center;
        overflow: hidden;
}

.footer_center {
        margin: 0 auto;
        text-align: center;
        width: 90%;
		height:auto;
		position:relative; 
}

.footer_center img {
		width: 50%;
}

.footer-p{
        padding: 50px 0 0 0;
        font-weight: bold;
}

.indent{
        padding-left:1em;
        text-indent:-1em;
}

/* 追従バナー */
.fixed-banner {
        position: fixed;
        bottom: 8%;
        right: -5%;
        z-index: 999;
        width: 168px; /* 固定幅 */
        animation: floatUpDown 3s ease-in-out infinite;
}

.fixed-banner img {
        width: 70%; /* 固定幅 */
        height: auto;
        display: block;
        margin: 0 auto;
}

.fixed-banner a {
        display: inline-block;
}
.fixed-banner a:hover {
        opacity: 0.7;
}
.fixed-banner.hidden {
  opacity: 0;
  pointer-events: none;
}

 /* アニメーション定義：上下にふわふわ動く */
 @keyframes floatUpDown {
      0%   { transform: translateY(0); }
      50%  { transform: translateY(-10px); }
      100% { transform: translateY(0); }
}


.go-top {
    position: fixed;
    /*固定表示*/
    bottom: 20px;
    right: 5px;
    border-radius: 100%;
    text-decoration: none;
    background-color: #00438f;
    padding: 1em;
    display: none;
    /*通常は非表示に*/
    height: 20px;
    width: 20px;
    z-index: 9999;
}

.go-top img {
    width: 100%;
    height: auto;
}

.pcv {
    display: none!important;
}

.spv {
    display: block!important;
}

.arrow_ft {
    color: #b2b2b2;
    font-size: .1rem;
    padding: 0 0;
}

.mt10 {
    margin-top: 10px;
}

.mt20 {
    margin-top: 20px;
}

.mt30 {
    margin-top: 3%;
}

.mt40 {
    margin-top: 5%;
}

.mt50 {
    margin-top: 50px;
}

.mt60 {
    margin-top: 60px;
}

.mt70 {
    margin-top: 70px;
}

.mt80 {
    margin-top: 80px;
}

.mt90 {
    margin-top: 90px;
}

.mt100 {
    margin-top: 100px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb20 {
    margin-bottom: 2%;
}

.mb30 {
    margin-bottom: 30px;
}

.mb40 {
    margin-bottom: 40px;
}

.mb50 {
    margin-bottom: 50px;
}

.mb60 {
    margin-bottom: 6%;
}

.mb70 {
    margin-bottom: 70px;
}

.mb80 {
    margin-bottom: 80px;
}

.mb90 {
    margin-bottom: 90px;
}

.pl10{
    padding-left: 10px;
}