@charset "utf-8";
/* ************************************************
 *
 * cover
 *
************************************************* */
legend{margin-bottom: 25px}
legend>h3{margin:0;}
/*------ tabs-box ------*/
/* #tabs-2{opacity:0;position:absolute;z-index:-1;top:0;left:-1000em} */
#tabs-2{opacity:1; display:none; position:static; z-index:-1;top:0;left:-1000em}
.tab-content>div{overflow:hidden}
.tabs-box{margin-bottom:50px}
.tabs-box.left{border-bottom:2px solid #f7931e;}
.tabs-box.right{border-bottom:2px solid #363c97;}
/* --2024-- */
.tabs-box.middle{border-bottom:2px solid #39b54a;}
/* #tabs-3{opacity:0;position:absolute;z-index:-1;top:0;left:-1000em} */
#tabs-3{opacity:1; display:none; position:static; z-index:-1;top:0;left:-1000em}
/* --2024-- */

/* --2024--
.list-tab>li{width:50%;padding:28px 0;text-align:center;cursor:pointer;font-size:20px;position:relative;text-indent: -1em;}
2024-- */
.list-tab>li{width:33%;padding:28px 0;text-align:center;cursor:pointer;font-size:18px;position:relative;text-indent: -1em;}

/* --2024--
.list-tab>li:first-child{margin-right:20px;}
2024-- */
.list-tab>li:first-child{margin-right:18px;}

.inner-left-tab{color: #f7931e;border: 2px solid #f7931e;}
.inner-right-tab{color: #363c97;border: 2px solid #363c97;}
/* --2024-- */
.inner-middle-tab{color: #39b54a;border: 2px solid #39b54a;margin-right:20px;}
/* --2024-- */


.list-tab>li.active{
  border-bottom-color:#fff;
/* --2024-- 
  padding: 31px 0;
 --2024-- */
  padding: 30px 0;

  margin-bottom: -2px;
/* --2024-- 
  font-size: 28px;
 --2024-- */
  font-size: 24px;

  text-indent: 0;
}
.list-tab>li.active>.arrow-bottom{display:none;}
.list-tab>li>.arrow-bottom{
  border-radius: 99em;
  position: absolute;
  right: 25px;
/* --2024-- 
  width:50px;height:50px;
 --2024-- */
  width:30px;height:30px;

  bottom: 50%;
transform: translateY(50%);
}
.list-tab>li>.arrow-bottom::after{
  content:"";width: 14px;height:14px;
  border:1px solid #fff;border-left:none;border-bottom:none;
  position: absolute;bottom: 50%;right:50%;transform:translate(50%,30%) rotate(135deg);
}
.list-tab>.inner-left-tab>.arrow-bottom{background:#f7931e;}
.list-tab>.inner-right-tab>.arrow-bottom{background:#363c97;}
/* --2024-- */
.list-tab>.inner-middle-tab>.arrow-bottom{background:#39b54a;}

/*---- cover-block-list ----*/
.cover-block-list{margin-bottom:50px;flex-wrap:wrap}
.cover-block-list>li{width:32%}
.cover-block-list>li:not(:nth-child(3n)){margin-right:2%;}
.cover-block-list>li:nth-child(n + 4){margin-top: 20px;}
.cover-block-list>li .height-macth{max-height:500px;overflow: hidden;position:relative}
.cover-block-list>li .height-macth::after{content:"";position:absolute;bottom:0;left:0;background: url(../img/icon/img-icon-transmission.png) repeat-x center bottom;width: 100%;height: 20px;}
.br-tab::before{content:"・";display:inline}
.br-default{display:block;}

.block-report{padding: 15px 7%;line-height: 1;}
.block-report>.main-info>span{font-size:14px;display:block;margin-bottom: 8px;}
.block-report h3{font-size:16px;margin-bottom:0}
.block-report>.separate{margin:10px auto 15px}

.more-info>.icon-point{color: #39b54a;margin-bottom:10px;border:1px solid #39b54a;padding: 3px 8px;font-size: 14px;display: inline-block;line-height: 1;}
.more-info>ul{text-align:justify}
.more-info>ul>li:before{width:4px;height:4px;}
.more-info>ul>li{font-size: 14px;line-height: 1.4;font-weight:300;}
.more-info>h4{border:none;margin-bottom:10px;background:none;padding:0;font-size:14px;line-height:1.5}
.more-info>p{font-size:14px;line-height:1.4;font-weight:300;text-align:justify}

/* ************************************************
 *
 * keyword
 *
************************************************* */
.keyword-wrap>.search-keyword{height:60px;margin-right: 20px;}
.keyword-wrap>.btn-keyword{padding:0;width:160px;height:60px;padding-left: 1.5em;background-position: center left 30px;}

/*------ multi-box ------*/
.multi-box{margin-bottom:30px;clear:both}
.multi-box>ul{letter-spacing: -.4em;}
.multi-box>ul>li{
  width: 23.5%;
  margin-right: 2%;
  margin-bottom: 20px;
  position:relative;
  height: 60px;
  display:inline-block;
  vertical-align: top;
  letter-spacing: .04em;
}
.multi-box>ul>li:nth-child(4n) {margin-right: 0;}
.keyword-s-font{font-size:1.4rem;color:#999;margin-left: 17px;}
.map-left{position:absolute;z-index: 1;}
.map-left>ul{margin-bottom:30px}
.map-left>ul>li {width: 47%;max-width: 287px;}

/* map */
.pc-map>legend{text-indent:-1000em;position:absolute}
.multi-box input[type="checkbox"]{position:absolute;left:10px;bottom:50%;transform:translateY(50%)}
.multi-box label {
  width: 100%;
  height: 60px;
  color: #555;
  background: #eee;
  text-align: center;
  cursor: pointer;
  font-size: 16px;
  border-radius: 5px;
  padding: 0 10px 0 25px;
  transition: background 0.3s;
  line-height: 1.4;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  flex-direction: column;
}
.tab-content .multi-box label{
  flex-direction:row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.map-left label{padding: 15px 0}
.multi-box input[type="checkbox"]:focus + label{color: #5facf3;outline: auto;}
.multi-box input[type="checkbox"]:checked + label,
.multi-box input[type="checkbox"]:checked:focus + label{background: #5facf3;color: #fff;}
.multi-box label:hover{color: #5facf3;}

/* soft-green-map */
.multi-box .soft-green-map label:hover{color: #5abf98;}
.multi-box .soft-green-map input[type="checkbox"]:focus + label{color: #5abf98;}
.soft-green-map input[type="checkbox"]:checked + label,
.soft-green-map input[type="checkbox"]:checked:focus + label{background: #5abf98;color:#fff}
/* hard-green-map */
.multi-box .hard-green-map label:hover{color: #39b54a;}
.multi-box .hard-green-map input[type="checkbox"]:focus + label{color: #39b54a;}
.hard-green-map input[type="checkbox"]:checked + label,
.hard-green-map input[type="checkbox"]:checked:focus + label{background: #39b54a;color:#fff}
/* orange-map */
.multi-box .orange-map label:hover{color: #f7931e;}
.multi-box .orange-map input[type="checkbox"]:focus + label{color: #f7931e;}
.orange-map input[type="checkbox"]:checked + label,
.orange-map input[type="checkbox"]:checked:focus + label{background: #f7931e;color:#fff}
/* yellow-map */
.multi-box .yellow-map label:hover{color: #dbc153;}
.multi-box .yellow-map input[type="checkbox"]:focus + label{color: #dbc153;}
.yellow-map input[type="checkbox"]:checked + label,
.yellow-map input[type="checkbox"]:checked:focus + label{background: #dbc153;color:#fff}
/* violet-map */
.multi-box .violet-map label:hover{color: #dd9bd1;}
.multi-box .violet-map input[type="checkbox"]:focus + label{color: #dd9bd1;}
.violet-map input[type="checkbox"]:checked + label,
.violet-map input[type="checkbox"]:checked:focus + label{background: #dd9bd1;color:#fff}
/* pink-map */
.multi-box .pink-map label:hover{color: #ef95a2;}
.multi-box .pink-map input[type="checkbox"]:focus + label{color: #ef95a2;}
.pink-map input[type="checkbox"]:checked + label,
.pink-map input[type="checkbox"]:checked:focus + label{background: #ef95a2;color:#fff}

/*------ multibox-map ------*/
.hokkaido-map>div{position:relative}
.multi-box .hokkaido-map>div {width: 120px;margin-left: 83.2%;}
.multi-box .hokkaido-map>div>label{padding: 0;display: block;vertical-align: baseline;height: 120px;width: 120px;line-height: 118px;background-color: #eee;border-radius: 3px;margin-bottom: 8px;cursor: pointer;transition: background 0.3s;border: 1px solid #5facf3;}
.multi-box.multibox-map input[type="checkbox"],
.multi-box.multibox-map-mobile input[type="checkbox"]{left:auto;top:3px;right:3px;bottom:auto;transform:none;}
.multi-box .ul-map {margin-bottom: 0;}
.multi-box .ul-map .map-button-001{float:left;width: 56px;margin-right: 8px;margin-bottom: 8px;display: block;height: auto;text-indent: 0}

/*------ border  -map ------*/
.ul-map label {font-size: 14px;border: 1px solid #5facf3;padding: 20px 0;display: block;height: 56px;}
.blue-map label{border-color: #5facf3}
.soft-green-map label{border-color: #5abf98}
.hard-green-map label{border-color: #39b54a}
.orange-map label{border-color: #f7931e}
.yellow-map label{border-color: #dbc153}
.violet-map label{border-color: #dd9bd1}
.pink-map label{border-color: #ef95a2}


/*------ title ------*/
/*color*/
.multi-box>ul>li.title-map{margin:0;}
.multibox-map .map-title-area.blue-title{position:relative;right:-20px;}
.blue-title{color:#5facf3}
.soft-green-title{color:#5abf98}
.hard-green-title{color:#39b54a}
.orange-title{color:#f7931e}
.yellow-title{color:#dbc153}
.violet-title{color:#dd9bd1}
.pink-title{color:#ef95a2}

.map-title-area{position: absolute;width: 120px !important;text-align: center;font-size:14px}
.map-title-area.left{margin-top: 13px;}
.map-title-area.top{margin-top: 22px;}
.map-title-area.bottom{margin-top: 5px;height:auto}
.map-title-area.soft-green-title, .map-title-area.pink-title, .map-title-area.orange-title{text-align:left}

/* ************************************************
 *
 * under
 *
************************************************* */
/*------ about ------*/
.column-main-cont{flex:1 0 0%}
.column-sub-cont{width:240px;margin-left:5%}
.border-wrap{border:1px solid #999;padding:1.5em 2.5em;}

/*-- side-nav --*/
.side-nav-title{font-size:1.8rem;color:#fff;background:#f7931e;text-align:center;height: 80px;padding: .3em;}
.column-sub-cont>ul{border:1px solid #f7931e;border-top:none}
.column-sub-cont>ul>li>a{display:block;padding:1em 1.5em;font-size:1.4rem}
.column-sub-cont>ul>li:not(:first-child){border-top:1px solid #ddd}
.column-sub-cont a:not(.side-nav-title):hover, .column-sub-cont a.active{color:#f7931e;background: #f8f3ec;opacity:1}

/*-- under-nav-inner --*/
.under-nav-inner>li{border-top: 1px solid #F0F0F0}
.under-nav-inner>li>a{display:block;padding: .8em .5em .8em 1.5em;font-size:1.2rem;line-height: 1.5;}
.under-nav-inner>li>a::before{content:"";width:6px;height:6px;border:1px solid #999;border-bottom:transparent;border-left:transparent;transform:rotate(45deg);display: inline-block;margin-right: 1em;position: relative;right: -6px;}

/* ************************************************
 *
 * sitemap
 *
************************************************* */
.sitemap h1{text-align:center;margin-bottom: 35px;}
.sitemap-inner{margin-bottom: 40px;flex-wrap:wrap}
.sitemap-inner>li{width:48%;text-align:center;margin-bottom:50px}
.sitemap-inner>li:nth-child(odd){margin-right:4%}
.sitemap-inner>li>a{font-size: 2.4rem;font-weight:500;margin-bottom: 20px;margin-bottom: 15px;display: block;line-height: 1;padding:.5em 0;}
.sitemap-inner>li>ul>li>a{font-size: 1.8rem}
.title-orange{color: #f7931e;border:2px solid #f7931e}
.title-blue{color: #5facf3;border: 2px solid #5facf3}
.title-green{color:#39b54a;border: 2px solid #39b54a}
.sitemap-inner-sub>li{border-bottom:1px solid #999;margin-bottom: 1em;padding-left: 2em}
.sitemap-inner-sub>li>ul>li:not(:last-child){margin-right: 2.5em}
.sitemap-inner-sub>li>ul>li{float: left;white-space: nowrap;}
.sitemap-inner-sub>li>ul{list-style-type:disc}

@media print, screen and (max-width: 1100px){
.map-left{position:static}
.map-left>ul>li{width: 23.5%;max-width: none;}
.multibox-map{display:none}
.multibox-map-mobile{display:block}
.multi-box>ul>li.sp-title{display:table;font-size: 1.6rem;width:auto;float:none;margin: 15px 0 10px 0;height: auto;text-indent: 0;}

}

@media print, screen and (max-width: 1024px){
.multi-box>ul>li{width:32%}
.multi-box>ul>li:nth-child(4n) {margin-right: 2%;}
.multi-box>ul>li:nth-child(3n) {margin-right:0}

/* ************************************************
 *
 * block-content 1024
 *
************************************************* */
.list-tab>li{font-size:16px}
.list-tab>li.active{font-size:20px}
.list-tab>li>.arrow-bottom{width:36px;height:36px;right:13px}
.list-tab>li>.arrow-bottom::after {width: 10px;height: 10px;}
.cover .block-content-wrap h3{font-size: 1.75781vw}
.cover .block-content-wrap .population,
.cover .block-content .label{font-size:12px}
.cover .sub-info{display:block}
}

@media screen and (max-width: 767px){
/*---- cover-block-list ----*/
.br-tab{display:block;width:100%}
.br-tab::before{content:none;}

/* ************************************************
 *
 * tabs-box 767
 *
************************************************* */
.tabs-box>.content-wrap-10{overflow:visible}
.list-tab>li{font-size:14px;line-height: 1.4;padding:8px 0;text-indent: 0;
  height:60px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  flex-wrap:wrap}
.list-tab>li:first-child {margin-right: 10px;}
.list-tab>li>.br-tab{display:inline;width:auto}
.list-tab>li>.br-tab::before{content:"・";}

.list-tab>li.inner-right-tab>span:not(.br-tab):not(.arrow-bottom){display:block;width: 100%;}
.list-tab>li.active{font-size:14px;padding: 0;height:70px}
.list-tab>li>.arrow-bottom{display:none}
.list-tab>li:not(.active).inner-left-tab{padding: 18px 0}
.list-tab>li.active.inner-right-tab{padding: 13px 0}

/* --2024-- */
.list-tab>li.inner-middle-tab>span:not(.br-tab):not(.arrow-bottom){display:block;width: 100%;}
.list-tab>li.active.middle-right-tab{padding: 13px 0}

.cover-block-list{display:block;margin-bottom:60px}.cover-block-list img{width:100%}
.cover-block-list>li{width:100%;margin:0 0 40px 0}

.cover-block-list>li .height-macth{max-height:none;overflow:visible}
.cover-block-list>li .height-macth::after{content:none}

/* ************************************************
 *
 * keyword 767
 *
************************************************* */
.keyword-wrap>.search-keyword{height:50px;margin-right:2%}
.keyword-wrap>.btn-keyword{width:80px;height:50px;background-position: center left 8px;}

.multi-box>ul>li{float: left;width:48%;margin-right:4%;display: table;}
.multi-box>ul>li:nth-child(3n) {margin-right: 4%;}
.multi-box>ul>li:nth-child(even){margin-right:0}
.multi-box label{font-size:14px;display:table-cell;vertical-align: middle;height:56px;padding: 0;line-height: 1.4;}
.multi-box input[type="checkbox"]{left:auto;right:3px;top:3px;bottom:auto;transform:none}
.ul-map label{width:56px}
.multi-box.sp-column-1>ul>li{width:100%;margin: 0 auto 15px;}
.multi-box.sp-column-1 label{padding: 0 20px}
.br-default{display:inline-block;margin-top:0;text-indent: 0;}

/* ************************************************
 *
 * block-content 767
 *
************************************************* */
.cover .block-content-wrap h3{font-size: 1.6rem}

/* ************************************************
 *
 * under 767
 *
************************************************* */
/*------ about ------*/
.column2-under{display:block}
.column-main-cont,.column-sub-cont{width:100%;margin-left:0;}
.column-main-cont{margin-bottom: 70px}
/*-- side-nav --*/
.side-nav-title>br{display:none}

/* ************************************************
 *
 * .sitemap 767
 *
************************************************* */
.sitemap-inner{display:block}
.sitemap-inner>li{width:100%}
.sitemap-inner>li:nth-child(odd){margin-right:0}
.sitemap-inner>li>a{font-size:1.8rem}
.sitemap-inner>li>ul>li{margin-bottom:15px}
.sitemap-inner>li>ul>li>a{font-size: 1.4rem}
.sitemap-inner-sub>li{border:none}
.sitemap-inner-sub>li>ul>li{float:none;margin-bottom: 15px;}
.sitemap-inner-sub>li>ul>li:not(:last-child){margin-right:0}
}

@media screen and (max-width: 480px){
.ul-map>li{line-height:2}
}

@media screen and (max-width: 359px){
.list-tab>li{font-size:12px;padding: 10px 0;}
.list-tab>li.active{font-size:12px;}
}

/* --2024-- */
.under .youtube-16-9 {
    max-width: 560px;
    height: auto;
    aspect-ratio: 16 / 9;
    display: block;
    margin: auto;
}

.cover .youtube-16-9 {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    max-width: 400px;
    display: block;
    margin: auto;
}