
/*top共通*/



.top_back{
 z-index: 0; 
  position:absolute;
  background:
    url("../assets/top_haikei.png");
  background-size:cover;
  background-position:center;
top:0px;
width:100%;
height:150px;
}



/*検索領域:*/

.ken_ryo{

position: relative; 
left:0px;
right:auto;
margin:auto;
top:-20px;
width:900px;
height:auto;



}

.site_1 {

display:block;
position:absolute; top:20px;  
 left:0px;
right:0px;
margin: auto; 
width:900px; 
height:65px;
	background-color: #0A86B8;

	text-align:left;
	color: #ffffff;
font-weight :bold;
font-size:12px;

border-radius: 20px 20px 0px 0px; 
}

.site_2 {
display:block;
position:relative;
 top:0px;  
 left:0px;
right:0px;
margin: auto; 
width:900px; 
height:800px;
	text-align:left;
	color: #666666;
font-weight :bold;
font-size:12px;
border-radius: 0px 0px 20px 20px; 
	background-color: #F2F5F7;

}


.site_1_1 {
display:block;
position:absolute; top:20px;  
 left:20px;
margin: auto; 
width:30px; 
height:30px;
}


.site_1_2 {
position:absolute; 
 top:10px;  
 left:60px;
font-weight :bold;
font-size:16px;

}


.shibori{
left:-330px;
  display:inline-flex;
  align-items:center;
  position:relative;
  padding-right:22px; /* アイコン分の余白 */
}

/* レンズ（丸） */
.shibori::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  width:12px;
  height:12px;
  margin-top:-8px;
  border:2px solid #fff;
  border-radius:50%;
  background:transparent;
}

/* 持ち手（斜め棒） */
.shibori::before{
  content:"";
  position:absolute;
  right:-8px;
  top:50%;
  width:12px;
  height:3px;
  margin-top:3px;
  background:#fff;
  transform: rotate(45deg);
  transform-origin:left center;
}



.site_2_1 {
position:relative; 
display:block;
width:90px;
height:80px;
 top:-20px;  
 left:0px;

}

.site_2_1_a {
position:absolute; 
 top:20px;  
 left:140px;
font-weight :bold;
font-size:20px;

}


.site_2_3_a {
display:block;
position:absolute;
 top:25px;  
 left:140px;
width:230px; 
height:35px;

}

.site_2_1_b {
position:absolute; 
 top:20px;  
 left:460px;
font-weight :bold;
font-size:16px;

}


.site_2_3_b {
display:block;
position:absolute;
 top:25px;  
 left:570px;
width:290px; 
height:35px;

}

.site_2_3 {
display:block;
position:absolute;
 top:0px;  
 left:0px;
width:190px; 
height:30px;

}

.site_2_3_s {
display:block;
position:absolute;
 top:10px;  
 left:0px;
width:250px; 
height:35px;

}


.site_2_3_k {
display:block;
position:absolute;
 top:10px;  
 left:415px;
width:190px; 
height:35px;

}

.site_2_4 {
display:block;
position:absolute;
 top:10px;  
 left:180px;
width:190px; 
height:35px;

}

.site_2_4_u {
display:block;
position:absolute;
 top:50px;  
 left:0px;
width:190px; 
height:35px;

}
.site_2_4_p {
display:block;
position:absolute;
 top:100px;  
 left:0px;
width:190px; 
height:35px;

}

.site_2_4_k {
display:block;
position:absolute;
 top:10px;  
 left:595px;
width:190px; 
height:35px;

}

.site_5_k {
display:block;
position:absolute;
 top:-20px;  
 left:415px;
width:100px; 
height:35px;

}

.site_2_6 {
display:block;
position:absolute;
 top:95px;  
 left:650px;
width:190px; 
height:35px;

}

.site_2_3_1 {
position:absolute;
 top:5px;  
 left:10px;
font-weight :700;
font-size:14px;
}


.site_3 {
position:absolute; 
 top:155px;  
 left:50px;
font-weight :bold;
font-size:16px;
}

.site_3_1 {
position:absolute; 
 top:185px;  
 left:50px;
font-weight :bold;
font-size:16px;
}


.select-box option.site_3_1_1{
  color:#000;
  font-weight:bold;
}


/* 外枠（輪郭） */
.select-wrap{
  position: relative;
  width: 110px;
  height: 40px;
}

.select-wrap_s{
  position: relative;
  width: 160px;
  height: 40px;
}


/* select本体 */
.select-box{
  width: 110px;
  height: 35px;
  background: #fff;

  border: 1px solid #ccc;      /* 輪郭 */
  border-radius: 10px;          /* 角丸10px */

  /* 未選択時の「指定なし」位置：left 10px / top 5px 相当 */
  padding-left: 10px;
  padding-top: 5px;

  /* 右端の▼と干渉しないように右に余白 */
  padding-right: 34px;

  /* 選択文字の指定（プルダウン時も含む） */
  font-size: 16px;
  font-weight: normal;
  color: #000000;

  /* OS標準の矢印を消す（見た目統一） */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  cursor: pointer;
  outline: none;
  box-sizing: border-box;
}

/* 右端のプルダウン記号（▼） */
.select-arrow{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  font-weight: bold;
  color: #000;
  pointer-events: none; /* クリックはselectへ */
  line-height: 1;
}

/* 右端のプルダウン記号（▼） */
.select-arrow_s{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  font-weight: bold;
  color: #000;
  pointer-events: none; /* クリックはselectへ */
  line-height: 1;
}

/* プルダウン展開中の候補リスト（可能な範囲で） */
.select-box option{
  font-size: 16px;
  font-weight: bold;
}

/* 任意：フォーカス時（不要なら削除OK） */
.select-box:focus{
  border-color: #0A86B8;
}


/* select本体 */
.select-box_s{
  width: 160px;
  height: 35px;
  background: #fff;

  border: 1px solid #ccc;      /* 輪郭 */
  border-radius: 10px;          /* 角丸10px */

  /* 未選択時の「指定なし」位置：left 10px / top 5px 相当 */
  padding-left: 10px;
  padding-top: 5px;

  /* 右端の▼と干渉しないように右に余白 */
  padding-right: 34px;

  /* 選択文字の指定（プルダウン時も含む） */
  font-size: 16px;
  font-weight: normal;
  color: #000000;

  /* OS標準の矢印を消す（見た目統一） */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  cursor: pointer;
  outline: none;
  box-sizing: border-box;
}

/* 右端のプルダウン記号（▼） */
.select-arrow{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  font-weight: bold;
  color: #000;
  pointer-events: none; /* クリックはselectへ */
  line-height: 1;
}

/* プルダウン展開中の候補リスト（可能な範囲で） */
.select-box_s option{
  font-size: 16px;
  font-weight: bold;
}

/* 任意：フォーカス時（不要なら削除OK） */
.select-box_s:focus{
  border-color: #0A86B8;
}


.kara_1 {
position:absolute; 
display:block;
width:60px;
height:30px;

 top:5px;  
 left:185px;
font-weight :bold;
font-size:14px;
  border-color: #0A86B8;

}


.site_4 {
position:absolute; 
 top:150px;  
 left:450px;
font-weight :bold;
font-size:16px;
}

.site_4_1 {
position:absolute; 
 top:185px;  
 left:450px;
font-weight :bold;
font-size:16px;
}



.site_5 {
position:absolute; 
 top:245px;  
 left:50px;
font-weight :bold;
font-size:16px;
}

.site_5_1 {
position:absolute; 
 top:280px;  
 left:50px;
font-weight :bold;
font-size:16px;
}

.site_6 {
position:absolute; 
 top:245px;  
 left:450px;
font-weight :bold;
font-size:16px;
}

.site_6_1 {
position:absolute; 
 top:280px;  
 left:450px;
font-weight :bold;
font-size:16px;
}

.site_6_2 {
position:absolute; 
 top:280px;  
 left:580px;
font-weight :bold;
font-size:16px;

}

.site_6_3 {
position:absolute; 
 top:280px;  
 left:690px;
}

.site_6_4 {
position:absolute; 
 top:290px;  
 left:820px;
font-weight :bold;
font-size:16px;

}
.site_7 {
position:absolute; 
 top:335px;  
 left:50px;
font-weight :bold;
font-size:16px;
}

.site_7_1 {
position:absolute; 
 top:365px;  
 left:50px;
font-weight :bold;
font-size:16px;
}

.site_8 {
position:absolute; 
 top:335px;  
 left:450px;
font-weight :bold;
font-size:16px;
}

.site_8_1 {
position:absolute; 
 top:365px;  
 left:450px;
font-weight :bold;
font-size:16px;
}

.site_9_1 {
position:absolute; 

 top:410px;  
left:0px;
right:0px;
margin:auto;
}

.btn-post{
position:absolute; 

 top:450px;  
left:0px;
right:0px;
margin:auto;

  width: 300px;              /* 必要なければ削除OK */
  height: 60px;              /* 既存UIと高さ合わせ */

  background: #138FC2;       /* 指定色 */
  color: #ffffff;            /* 文字色 */

  border: none;
  border-radius: 5px;        /* 角丸5px */

  font-size: 16px;
  font-weight: bold;

  cursor: pointer;
  outline: none;
}

/* hover（任意・UI的に自然） */
.btn-post:hover{
  opacity: 0.9;
}

/* 押下時（任意） */
.btn-post:active{
  transform: translateY(1px);
}


.btn-post_cle{
position:absolute; 

 top:450px;  
right:0px;

  width: 100px;              /* 必要なければ削除OK */
  height: 40px;              /* 既存UIと高さ合わせ */

  background: #EEEEEE;       /* 指定色 */
  color: #0000ff;            /* 文字色 */

  border: none;
  border-radius: 5px;        /* 角丸5px */

  font-size: 14px;
  font-weight: bold;

  cursor: pointer;
  outline: none;
  border: 1px solid #BBBBBB;

}

/* hover（任意・UI的に自然） */
.btn-post_cle:hover{
  opacity: 0.9;
  background: #DDDDDD;       /* 指定色 */

}

/* 押下時（任意） */
.btn-post_cle:active{
  transform: translateY(1px);
}


/* ラジオ全体 */
.radio-wrap{
  display: inline-flex;
  align-items: center;
  gap: 8px;
width: 150px;

  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid #ccc;
  background: #fff;

  cursor: pointer;
  user-select: none;
  margin-right: 10px;
}

/* 元のradioは隠す */
.radio-wrap input[type="radio"]{
  display: none;
}

/* 見た目用の丸 */
.radio-ui{
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #138FC2;
  box-sizing: border-box;
  position: relative;
}

/* 中の●（選択時） */
.radio-ui::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:8px;
  height:8px;
  background:#138FC2;
  border-radius:50%;
  transform: translate(-50%, -50%) scale(0);
  transition: transform .15s ease;
}

/* チェック時 */
.radio-wrap input:checked + .radio-ui::after{
  transform: translate(-50%, -50%) scale(1);
}

/* 文字 */
.radio-text{
  font-size: 14px;
  font-weight: bold;
  color: #333;
}

/* hover（おしゃれさ） */
.radio-wrap:hover{
  background: #f2f5f7;
}

/* 選択中は少し強調 */
.radio-wrap input:checked ~ .radio-text{
  color: #138FC2;
}

.site_b{
  display: block;
  position: relative;
top:80px;
width:900px;
height: 70px;  
}

.site_b_1{
  display: block;
  position: absolute;
left:10px;
top:35px;
width:100px;
height: 30px;  
  color: #000;
  font-size: 20px;
  font-weight: bold;

}

.site_b_2{
  display: block;
  position: absolute;
left:120px;

top:40px;
width:100px;
height: 30px;  
  color: #000;
  font-size: 14px;
  font-weight: normal;

}


.site_b_3{
  display: block;
  position: absolute;
right:30px;

top:35px;
width:100px;
height: 30px;  

}

/* 外枠 */
.select-wrap_1{
  position: relative;
  width: 100px;
  height: 35px;
}

/* select本体 */
.select-box_1{
  width: 100%;
  height: 100%;
  padding: 10px 34px 10px 12px;

  background: #fff;
  border: 1px solid #ccc;
  border-radius: 10px;

  font-size: 12px;
  font-weight: bold;
  color: #000;

  cursor: pointer;
  outline: none;

  /* OSデフォルト矢印を消す */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* ▼アイコン */
.select-arrow{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  font-weight: bold;
  color: #000;
  pointer-events: none;
}

/* hover */
.select-box_1:hover{
  border-color: #138FC2;
}

/* focus */
.select-box_1:focus{
  border-color: #138FC2;
  box-shadow: 0 0 0 2px rgba(19,143,194,.15);
}



.site_a{
  display: block;
  position: relative;
top:80px;
width:900px;
height: 300px;  
}


.site_a_1{
  display: block;
  position: absolute;
left:0px;
right:0px;
margin:auto;
top:20px;
width:900px;
height: 270px;  
  border: 1px solid #ddd;
  border-radius: 10px;
  background: #fff;
}

.site_a_2{
  display: block;
  position: absolute;
left:30px;
top:10px;
width:250px;
height: 220px;  
}

.site_a_3{
  display: block;
  position: absolute;
left:310px;
top:10px;
width:170px;
height: 190px;  
	text-align:left;

}



.site_a_5{
  display: block;
  position: absolute;
left:307px;
top:200px;
width:500px;
height: 45px;  
	text-align:left;
}


.site_pa{
  display: block;
  position: relative;
top:80px;
width:900px;
height: 40px;
left:0px;
right:0px;
margin:auto;
padding-top:30px;

padding-bottom:180px;

}


.sho_sai{
  display: block;
  position: absolute;
top:0px;
left:0px;

width:120px;
height: 40px;
  border-radius: 10px;
  background: #094761;
color:#ffffff;
	text-align:center;
font-weight :bold;
font-size:14px;
  line-height: 40px;


}

.card--link{
  display: block;
  text-decoration: none;
  color: inherit;
}


/* ==============================
   Pager
============================== */
.pager{
  display: flex;
  justify-content: center;
  margin: -20px 0;
 padding-bottom: 160px;
}

.pager__list{
  list-style: none;
  display: flex;          /* 右に増える */
  flex-wrap: wrap;        /* 画面が狭いと折り返す */
  gap: 8px;
  padding: 0;
  margin: 0;
  align-items: center;
}

.pager__item{
  display: flex;
}

.pager__btn{
  min-width: 40px;
  height: 40px;
  padding: 0 12px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 14px;
  text-decoration: none;
  color: #1f2937;

  background: #fff;
  border: 1px solid #d1d5db;
  border-radius: 8px;

  box-shadow: 0 8px 18px rgba(0,0,0,0.06);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.pager__btn:hover{
  transform: translateY(-1px);
  border-color: #0A86B8;
}

.pager__btn.is-active{
  background: #0A86B8;
  color: #fff;
  border-color: #0A86B8;
}

.pager__btn.is-disabled{
  pointer-events: none;
  opacity: 0.45;
  box-shadow: none;
}

.pager__ellipsis{
  color: #6b7280;
  padding: 0 6px;
}



.txt{
  width: 120px;              /* 必要なら変更 */
  height: 35px;

  padding: 10px 12px;
  box-sizing: border-box;

  background: #fff;
  border: 1px solid #ccc;
  border-radius: 10px;

  font-size: 16px;
  font-weight: bold;
  color: #000;

  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}

/* placeholder */
.txt::placeholder{
  color: #999;
  font-weight: normal;
}

/* hover */
.txt:hover{
  border-color: #138FC2;
}

/* focus（選択中の気持ちよさ） */
.txt:focus{
  border-color: #138FC2;
  box-shadow: 0 0 0 2px rgba(19,143,194,.15);
}



.site_a_3_1{
  display: block;
  width: 300px;
  height: 35px;
  position: relative;
	text-align:left;
	left:0px;
	top:10px;
  color: #000;
  font-size: 16px;
  font-weight: bold;

}

.site_a_3_1_1{
  display: block;
  width: 120px;
  height: 35px;
  position: absolute;
	text-align:left;
	left:80px;
	top:0px;
  color: #000;
  font-size: 16px;
  font-weight: bold;

}

.site_a_3_2{
  display: block;
  width: 70px;
  height: 25px;
  position: relative;
	text-align:left;
	left:0px;
	top:10px;
  color: #000;
  font-size: 12px;
  font-weight: bold;
}

.site_a_3_2_1{
  display: block;
  width: 120px;
  height: 35px;
  position: absolute;
	text-align:left;
	left:80px;
	top:0px;
  color: #000;
  font-size: 12px;
  font-weight: bold;
}

.site_a_4{
  display: block;
  position: absolute;
left:510px;
top:55px;
width:200px;
height: 100px;  
	text-align:left;
}

.site_a_4_1{
  display: block;
  width: 50px;
  height: 25px;
  position: relative;
	text-align:left;
	left:0px;
	top:0px;
  color: #000;
  font-size: 12px;
  font-weight: bold;
padding-top:0px;

}

.site_a_4_1_b{
  display: block;
  width: 90px;
  height: 25px;
  position: relative;
	text-align:left;
	left:0px;
	top:0px;
  color: #000;
  font-size: 12px;
  font-weight: bold;
padding-top:10px;
padding-left:10px;

}


.site_a_4_1_1{
  display: block;
  width: 120px;
  height: 35px;
  position: absolute;
	text-align:left;
	left:90px;
	top:0px;
  color: #000;
  font-size: 12px;
  font-weight: bold;
padding-top:10px;
padding-left:10px;

}


.site_a_4_1_3{
  display: block;
  width: 120px;
  height: 35px;
  position: absolute;
	text-align:left;
	left:60px;
	top:0px;
  color: #000;
  font-size: 12px;
  font-weight: bold;
}



.site_a_5_2{
  display: block;
  width: 160px;
  height: 25px;
  position: relative;
	text-align:center;
	left:15px;
	top:20px;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
padding-top:5px;
border-radius: 8px 8px 0px 0px; 
	background-color: #000000;

}


.site_a_4_2_1{
  display: block;
  width: 160px;
  height: 30px;
  position: absolute;
	text-align:center;
	left:0px;
	top:25px;
padding-top:0px;
  color: #000;
  font-size: 16px;
  font-weight: bold;
	background-color: #ffffff;

border-radius: 0px 0px 8px 8px; 

}

.site_a_5_a{
  display: block;
  position: absolute;
left:680px;
top:20px;
width:190px;
height: 150px;  
	text-align:left;
border-radius: 5px 5px 5px 5px; 
  background: #f5f5f5;

}




.btn_a{
position:absolute; 

 top:0px;  
left:0px;

  width: 120px;              /* 必要なければ削除OK */
  height: 40px;              /* 既存UIと高さ合わせ */

  background: #138FC2;       /* 指定色 */
  color: #ffffff;            /* 文字色 */

  border: none;
  border-radius: 5px;        /* 角丸5px */

  font-size: 12px;
  font-weight: bold;

  cursor: pointer;
  outline: none;
}

/* hover（任意・UI的に自然） */
.btn_a:hover{
  opacity: 0.9;

}

/* 押下時（任意） */
.btn_a:active{
  transform: translateY(1px);
}




.btn_a_1 a{
position:absolute; 

 top:0px;  
left:135px;

  width: 160px;              /* 必要なければ削除OK */
  height: 40px;              /* 既存UIと高さ合わせ */

  background: #fff;       /* 指定色 */
  color: #138FC2;            /* 文字色 */

  border: 1px solid #138FC2;
  border-radius: 5px;        /* 角丸5px */

  font-size: 11px;
  font-weight: bold;

  cursor: pointer;
  outline: none;
padding-top:10px;
}

/* hover（任意・UI的に自然） */
.btn_a_1 a:hover{
  opacity: 0.9;
  background: #dcdcdc;       /* 指定色 */

}

/* 押下時（任意） */
.btn_a_1 a:active{
  transform: translateY(1px);
}




.btn_a_2 a{
position:absolute; 

 top:0px;  
left:305px;

  width: 150px;              /* 必要なければ削除OK */
  height: 40px;              /* 既存UIと高さ合わせ */

  background:#006400;       /* 指定色 */
  color: #06C755;            /* 文字色 */

  border: 1px solid #06C755;
  border-radius: 5px;        /* 角丸5px */

  font-size: 11px;
  font-weight: bold;
padding-top:5px;
  cursor: pointer;
  outline: none;
	text-align:center;

}

/* hover（任意・UI的に自然） */
.btn_a_2 a:hover{
  opacity: 0.9;
  background: #dcdcdc;       /* 指定色 */

}

/* 押下時（任意） */
.btn_a_2 a:active{
  transform: translateY(1px);
}



.btn_a_3 a{
position:absolute; 

 top:0px;  
left:465px;

  width: 100px;              /* 必要なければ削除OK */
  height: 40px;              /* 既存UIと高さ合わせ */

  background: #fff;       /* 指定色 */
  color: #06C755;            /* 文字色 */

  border: 1px solid #06C755;
  border-radius: 5px;        /* 角丸5px */

  font-size: 11px;
  font-weight: bold;
padding-top:5px;
  cursor: pointer;
  outline: none;
}

/* hover（任意・UI的に自然） */
.btn_a_3 a:hover{
  opacity: 0.9;
  background: #dcdcdc;       /* 指定色 */

}

/* 押下時（任意） */
.btn_a_3 a:active{
  transform: translateY(1px);
}



.l_k{
position:absolute; 

 top:10px;  
left:8px;
  font-size: 12px;
  font-weight: bold;
  color: #06C755;

}

.l_k_1{
position:absolute; 

 top:9px;
left:40px;
  font-size: 14px;
  font-weight: bold;
  color: #ffffff;

}


.l_k_2{
position:absolute; 

 top:13px;  
left:30px;
  font-size: 11px;
  font-weight: bold;
  color: #0000cd;

}


.l_k_3{
position:absolute; 

 top:13px;  
left:35px;
  font-size: 11px;
  font-weight: bold;
  color: #000;

}


/* ==============================
   Stylish Editbox
============================== */
.editbox{
  width: 100%;
  padding: 12px 8px;
  font-size: 14px;
  line-height: 0.8;
  color: #1f2937;

  background-color: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 10px;

  box-shadow:
    inset 0 1px 2px rgba(0,0,0,0.04);

  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;

  outline: none;
}

.editbox:focus{
  border-color: #0A86B8; /* サイトのブルー */
  background-color: #f9fcff;

  box-shadow:
    0 0 0 3px rgba(10,134,184,0.15),
    inset 0 1px 2px rgba(0,0,0,0.03);
}

.editbox::placeholder{
  color: #9ca3af;
}


.field-label{
  display:block;
  margin-bottom:6px;
  font-size:14px;
  color:#374151;
}

.k_s1{
position:relative; 
  display: block;
height:130px;
width:800px;

 top:0px;  
left:0px;
right:0px;
margin:auto;
  font-size: 14px;
  font-weight: bold;
  color: #000;

}


