/* 追従 */
.lp_jump {
  border: #2e6333 4px solid;
}
.lp_jump a {
  color: #2e6333;
  background-image: url(../img/shibakariki/kusa_icon.webp);
  background-position-y: 25px;
}
.lp_jump a p span.arrow {
  background-color: #2e6333;
}

/* ==========================
  メイン
========================== */

.bg_wh {
  background-color: #fff;
}
.bg_blue {
  background-color: #b7d105;
}
.bg_gr {
  background-color: #f9fbe5;
}
.max_width {
  max-width: 1200px;
  margin: auto;
}
.sec_pdg {
  padding-top: min(60px, 6vw);
}
iframe {
  vertical-align: bottom;
}

@media screen and (max-width:759.98px) {
  .sec_pdg {
    padding-top: min(120px, 12vw);
  }
}

.fv {
  background-image: url(../img/shibakariki/fv.webp); 
  background-size: 108%;
  background-position: bottom right;
}


.fv_title h2 span.line {
  background: linear-gradient(transparent 70%, #b7d105 0);
}


@media screen and (max-width:759.98px) {
  .fv {
      flex-direction: column;
      height: 102vw;
      background-image: url(../img/kusakariki/fv_sp.webp);
  }
}

/* ==========================
  共通
========================== */

/*タイトル*/
.tab_title {
  border-color:#5d9119;
  color: #5d9119; /* 色が異なる */
}

/* ==========================
  タブ
========================== */
.bl_tabList .tab_1,
.bl_tabList2 .tab_1 {
  background-color: #5d9119;
}

.bl_tabList .tab_2,
.bl_tabList2 .tab_2 {
  background-color: #b7d105;
}

.bl_tabList .tab_3,
.bl_tabList2 .tab_3 {
  background-color: #e5a54e;
}

.bl_tabList .tab_4,
.bl_tabList2 .tab_4 {
  background-color: #efcd3a;
}

.bl_tabList .tab_5,
.bl_tabList2 .tab_5 {
  background-color: #87be8b;
}


/* ==========================
  タブの中身
========================== */
.bl_tabContent > .tab_1_inner.active,
.bl_tabContent2 > .tab_1_inner.active,
.video_area.js_tab_1 {
  background-color: #5d9119;
}
.bl_tabContent > .tab_2_inner.active,
.bl_tabContent2 > .tab_2_inner.active,
.video_area.js_tab_2 {
  background-color: #b7d105;
}
.bl_tabContent > .tab_3_inner.active,
.bl_tabContent2 > .tab_3_inner.active,
.video_area.js_tab_3 {
  background-color: #e5a54e;
}
.bl_tabContent > .tab_4_inner.active,
.bl_tabContent2 > .tab_4_inner.active,
.video_area.js_tab_4 {
  background-color: #efcd3a
}
.bl_tabContent > .tab_5_inner.active,
.bl_tabContent2 > .tab_5_inner.active,
.video_area.js_tab_5{
  background-color: #87be8b;
}


/* ====================================
  テーブル①
==================================== */



/* ====================================
  テーブル②　◯の表
==================================== */

/* ====================================
  テーブル③　グラフ型
==================================== */
.tbl3_inner {
  border-collapse:collapse;
  border-spacing: 0px;
  width: 100%;
}
.tbl3_inner tr {
  width: 100%;
  max-width: 100%;
}
.tbl3_inner th {
  width: 32%;
}
.tbl3_inner td {
  text-align: center;
  width: 68%;
}
.tbl3_inner td ul {
  display: flex;
}
.tbl3_inner td ul li {
  width: 100%;
}
.tbl3_inner.siba_icon td {
  vertical-align: middle;
}
.tbl3_inner.siba_icon td ul {
  padding: min(10px, 1vw) 0 min(50px, 5vw) 0;
}
.tbl3_inner .item_txts {
  align-items: start;
  text-align: start;
  flex-direction: column-reverse;
}
.tbl3_inner .videoBtn {
  flex-direction: row;
}
.tbl3_inner .videoBtn img {
  width: min(8vw,80px);
  margin: min(1vw,10px);
}

/* アイコン */
.videoBtn span.bg_color {
  background-color: #5d9119;
}
.item_txts p.bg_color,
p.bg_color {
  background-color: #5d9119;
}
.tbl3_item td p.bg_color {
  margin-top: min(1vw,10px);
}

/* 草の画像 */
.tbl3_imgs th {
  vertical-align: bottom;
}
ul.shiba_img li.active {
  padding: 0;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: min(10vw,100px);
  background: url(../img/shibakariki/siba_icon.webp);
  background-repeat: repeat-x;
  background-position: bottom;
  background-size: min(200px, 20vw) 155%;
} 
.tbl3_imgs td ul li span {
  position: absolute;
  right: 12%;
  bottom: 8%;
  width: max-content;
  font-size: var( --font16);
  font-weight: 600;
  color: #5d9119;
  background-color: #fff;
  padding: 0 min(1vw,10px);
}


ul.shiba_img li:nth-child(1) {
  background-position: 0 min(8vw,80px);
}
ul.shiba_img li:nth-child(2) {
  background-position: 0 min(7vw,70px);
}
ul.shiba_img li:nth-child(3) {
  background-position: 0 min(6vw,60px);
}
ul.shiba_img li:nth-child(4) {
  background-position: 0 min(5vw,50px);
}
ul.shiba_img li:nth-child(5) {
  background-position: 0 min(4vw,40px);
}
ul.shiba_img li:nth-child(6) {
  background-position: 0 min(3vw,30px);
}
ul.shiba_img li:nth-child(7) {
  background-position: 0 min(2vw,20px);
}
ul.shiba_img li:nth-child(8) {
  background-position: 0 min(1vw,10px);
}
ul.shiba_img p {
  transform: translateY(100%);
}
.tbl3_number ul,
ul.shiba_img {
  padding: 0 0 min(30px,3vw) 0;
}
.tbl3_imgs td ul.shiba_img {
  padding: 0;
}
.tbl3_inner th,
.tbl3_inner td {
  font-size: var( --font14);
  font-weight: bold;
}

.tbl3_item:nth-child(odd) th,
.tbl3_item:nth-child(odd) td {
  background-color: #eef8d8;
}

.tbl3_item td {
  font-size: var( --font14);
  font-weight: bold;
  white-space: nowrap;
}
.tbl3_inner td span,
.tbl3_item td p span {
  font-size: 80%;
}
.siba_icon .tbl3_item td p {
  vertical-align: bottom;
  transform: translateY(min(6vw,60px));
}
@media screen and (max-width:759.98px) {
  .tbl3_wrap {
    overflow-x: scroll;
  }
  .tbl3_inner {
    width: 174vw;
  }
  .tbl3_inner td {
    width: 50%;
  }
  .tbl4_inner .videoBtn img, .tbl3_inner .videoBtn img {
    width: 22vw;
    height: 22vw;
    margin: 2vw;
}
  ul.shiba_img li.active {
    background-size: 27vw 34vw;
    height: 14vw;
  }
  .tbl3_imgs td ul li span {
    right: 24%;
  }

  .tbl3_imgs td ul li:nth-child(1) {
    background-position: 0 10.5vw;
  }
  .tbl3_imgs td ul li:nth-child(2) {
    background-position: 0 9vw;
  }
  .tbl3_imgs td ul li:nth-child(3) {
    background-position: 0 7.5vw;
  }
  .tbl3_imgs td ul li:nth-child(4) {
    background-position: 0 6vw;
  }
  .tbl3_imgs td ul li:nth-child(5) {
    background-position: 0 4.5vw;
  }
  .tbl3_imgs td ul li:nth-child(6) {
    background-position: 0 3vw;
  }
  .tbl3_imgs td ul li:nth-child(7) {
    background-position: 0 1.5vw;
  }
  .tbl3_imgs td ul li:nth-child(8) {
    background-position: 0;
  }
}



/* 線と矢印 */
.arrow_line,
.arrow_start,
.arrow_dot,
.arrow_end {
  position: relative;
}
.siba_icon .arrow_line,
.siba_icon .arrow_start,
.siba_icon .arrow_dot,
.siba_icon .arrow_end {
  background: url(../img/shibakariki/siba_icon.webp);
  background-size: min(14vw, 140px);
  background-repeat: repeat-x;
  background-position-y: 0%;
  width: 100%;
  height: min(4vw, 40px);
}

.arrow_line::before,
.arrow_dot::before,
.arrow_start::before,
.arrow_end::before {
  position: absolute;
  top: min(4.8vw, 48px);
  content: "";
  height: min(2px,0.2vw);
  background-color: #5d9119;
  transform: translateY(-50%);
}

.arrow_line::before,
.arrow_dot::before {
  width: 100%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.arrow_start::before {
  width: 50%;
  left: 50%;
}
.arrow_end::before {
  width: 50%;
  left: 0;
}
.siba_icon .arrow_start::before,
.siba_icon .arrow_end::before {
  width: 98%;
  transform: translateY(-50%);
}
.siba_icon .arrow_start::before {
  right: 0;
  left: auto;
}
.siba_icon .arrow_end::before {
  left: 0;
}

.arrow_dot::after,
.arrow_start::after,
.arrow_end::after {
  position: absolute;
  top: min(4.8vw, 48px);
  left: 50%;
  content: "";
  transform: translate(-50%,-50%);
  background-color: #5d9119;
}

.arrow_dot::after {
  border-radius: 50%;
  height: min(10px,1vw);
  width: min(10px,1vw);
}
.siba_icon .arrow_start::after {
  left: 0%;
  transform: translateY(-50%);
}
.siba_icon .arrow_end::after {
  right: 0%;
  left: auto;
  transform: translateY(-50%);
}


/* 矢印 */
.tbl3_inner .arrow_start::after {
  height: calc(tan(70deg) * min(1vw,10px) / 2);
  width: min(1.2vw,12px);
  clip-path: polygon(100% 0, 0 50%, 100% 100%);
}
.tbl3_inner .arrow_end::after {
  height: calc(tan(70deg) * min(1vw,10px) / 2);
  width: min(1.2vw,12px);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.siba_icon .arrow_line::before,
.siba_icon .arrow_start::before,
.siba_icon .arrow_dot::before,
.siba_icon .arrow_end::before,
.siba_icon .arrow_start::after,
.siba_icon .arrow_dot::after,
.siba_icon .arrow_end::after {
  top: min(54px,5.4vw);
}
@media screen and (max-width:759.98px) {
  .arrow_line::before, .arrow_dot::before, .arrow_start::before, .arrow_end::before {
    height: 0.4vw;
  }
  .tbl3_inner .arrow_end::after,
  .tbl3_inner .arrow_start::after {
    height: calc(tan(70deg) * 2vw / 2);
    width: 3vw;
  }
  .arrow_dot::after {
    height: 2vw;
    width: 2vw;
  }
  .siba_icon .arrow_line, .siba_icon .arrow_start, .siba_icon .arrow_dot, .siba_icon .arrow_end {
    background-size: 25vw;
    background-position-y: 0%;
    height: 8vw;
  }
  .siba_icon .arrow_line::before, .siba_icon .arrow_start::before, .siba_icon .arrow_dot::before, .siba_icon .arrow_end::before, .siba_icon .arrow_start::after, .siba_icon .arrow_dot::after, .siba_icon .arrow_end::after {
    top: 11vw;
  }
  .siba_icon .tbl3_item td p {
    padding: min(12vw,120px) 0 0 0;
  }
}


/* 左寄り */
.arrow_start.left::before,
.arrow_dot.left::before{
  left: 0;
  transform: translate(0,-50%);
  width: 100%;
}
.arrow_end.left::before  {
  width: 0;
}
.arrow_start.left::after,
.arrow_dot.left::after,
.arrow_end.left::after {
  left: 0;
}
.arrow_start.left,
.arrow_dot.left,
.arrow_end.left {
  text-align: start;
}
.arrow_start.left p,
.arrow_dot.left p,
.arrow_end.left p {
  transform: translateX(-18%);
}
.arrow_line.left p {
 margin-right: min(2vw,24px);
}
.arrow_end.center p {
  transform: translateX(-32%);
}



/* ====================================
  比較表動画エリア
==================================== */
.video_area {
  background-color: #5d9119;
}
.video_area h3::before {
  background: #5d9119;
}

/* ====================================
  地域ごとの動画エリア
==================================== */
.wh_title {
  background-color: #b7d105;
}
.location_icon ul li:hover {
  color: #5d9119;
  border-color: #5d9119;
}
.lc_1.active, .lc_2.active, .lc_3.active, .lc_4.active {
  color: #5d9119;
  border-color: #5d9119;
}

.location_icon ul li p.active:after,
.location_icon ul li p:hover:after {
  background-color: #5d9119;
}



.lc_movie_items h3 {
  color: #5d9119;
}
.lc_movie_main_txts {
  color: #5d9119;
}
.lc_movie_main_txts span {
  background-color: #5d9119;
}
.lc_movie_main_txts p {
  border: min(4px, 0.4vw) solid #5d9119;
}

.item_info_wrap {
  border: min(2px, 0.2vw) solid #5d9119;
}