@charset "utf-8";
/* CSS Document */

.tenki_body{
  background-color: #F5F5F5;
}
.tenki_body a{text-decoration: none;}
.tenki_warp{
  max-width: 832px;
  margin: auto;
  padding: 40px 16px 140px;
}
.tenki_spbr{display: inline-block;}



/*head emargency*/
.tenki_emgy{
  display: none;
  margin: 0 auto 40px;
  padding: 0 16px;
  max-width: 1460px;
  width: 100%;
}
.tenki_topemblock{
  display:flex;
  justify-content:space-between;
  border-top: 4px solid #DE2A21;
  padding-top: 24px;
  padding-bottom:16px;
  align-items: flex-start;
}
.tenki_emgy h2{
  margin-bottom: 8px;
  font-weight: bold;
  color: #DE2A21;
}
.tenki_emgy dl{
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  font-size: 0.875rem;
  border: 1px solid #C1C1C1;
}
.tenki_emgy dl dt{
  display: flex;
  align-items: center;
  width: 190px;
  padding: 8px 8px 4px;
  border-right: 1px solid #C1C1C1;
}
.tenki_emgy dl dt.warning{
  color: #FFFFFF;
  background-color: #000000;
}
.tenki_emgy dl dd.warning{
  background-color:#3e3e3e;
}
.tenki_emgy dl dt.alarm{
  color: #FFFFFF;
  background-color: #d22017;
}
.tenki_emgy dl dd.alarm{
  background-color:#FFC1BE;
}
.tenki_emgy dl dt.advisory{
  background-color: #fdec4c;
}
.tenki_emgy dl dd.advisory{
  background-color: #F8F8F8;
}
.tenki_emgy dl dt.sediment{
  color: #FFFFFF;
  background-color: #721b72;
}
.tenki_emgy dl dd.sediment{
  background-color: #c38bc3;
}
.tenki_emgy dl dd{
  display: flex;
  flex-wrap: wrap;
  width: calc(100% - 190px);
  line-height: 1.875;
  padding: 8px 8px 2px 8px;
}
.tenki_emgy dl dd span{
  padding: 2px 8px 0;
  display: block;
  background-color: #FFFFFF;
  font-weight:bold;
  margin-bottom: 6px;
}
.tenki_emgy dl dd.advisory span{
  background-color:transparent;
  padding:0;
  font-weight:normal;
}
.tenki_emgy dl dd span:nth-last-of-type(n+2){margin-right: 1em;}
.tenki_emgy dl dt:nth-last-of-type(n+2),
.tenki_emgy dl dd:nth-last-of-type(n+2){border-bottom: 1px solid #C1C1C1;}
.tenki_topemblock .em_cate{
  background-color:#FFEB37;
  border:solid 1px #C1C1C1;
  border-radius:20px;
  max-width:270px;
  width:40%;
  min-height:40px;
  align-items: center;
  display: flex;
}
.tenki_topemblock .em_cate a{
  display:flex;
  justify-content:center;
  align-items: center;
  width:100%;
  color:#000;
  padding:8px;
  position:relative;
}

.tenki_topemblock .em_cate a:hover{
  opacity:0.6;
}

.tenki_topemblock .em_cate a::after{
  content: "";
  position: absolute;
  display: block;
  width: 8px;
  height: 8px;
  right: 28px;
  top: calc(50% - 8px);
  border-top: 2px solid #DE2A21;
  border-left: 2px solid #DE2A21;
  transform: rotate(225deg);
}

/*コンテンツ*/
.tenki_warp h1 {
  position: relative;
  width: 100%;
  max-width: 1060px;
  margin: 0 auto 28px;
  font-weight: bold;
  font-size: 1.375rem;
  line-height: 2em;
}
.tenki_warp h1 a {
  font-size: clamp(1rem,2vw,1.375rem);
  color: #000000;
}
.tenki_warp h1:before {
  content: "";
  display: inline-block;
  width: 54px;
  height: 35px;
  vertical-align: middle;
  background: url("https://www.tss-tv.co.jp/themes/weather2026@tss/img/icon_tenki.png") no-repeat;
  background-size: contain;
}


.tenki_tabindex{
  display: flex;
  gap: 3px;
  width: 100%;
  border-bottom: 1px solid #00539C;
  overflow-x: auto;
}
.tenki_tabindex li{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 14%;
  min-width: 72px;
  height: 40px;
  text-align: center;
  font-size: clamp(0.75rem, 0.4595rem + 1.0811vw, 1rem);/*12-16 430-800*/
  font-weight: bold;
  color: #424C7A;
  border-radius: 8px 8px 0px 0px;
  background-color: #E0E9F1;
  cursor: pointer;
  transition: background-color 0.2s linear;
}
.tenki_tabindex li.active{
  background-color: #00539C;
  color: #FFFFFF;
}

.tenki_top{
  margin-bottom: 24px;
  padding: 16px clamp(12px,2vw,36px) clamp(24px,2vw,32px);
  border: 1px solid #00539C;
  background-color: #FFFFFF;
}
.tenki_imagehead{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.tenki_opendate{
  text-align: right;
  font-size: 0.875rem;
}
.tenki_mainimg{
  position: relative;
  aspect-ratio: 16/9;
}
.tenki_mainimg img{
  width: 100%;
}
.swiper[data-cateimg],
[data-cateimg]{
  display: none;
}
.swiper[data-cateimg]:first-of-type,
[data-cateimg]:first-of-type{
  display: block;
}


/*画像内tab*/
.tenki_categorytablist{
  flex: 1 1 auto;
  display: flex;
  gap: 2px;
}
.tenki_categorytablist li{
  flex: 1;
  max-width: 112px;
  height: 34px;
  padding-top: 10px;
  text-align: center;
  font-size: clamp(0.875rem, 0.7297rem + 0.5405vw, 1rem);/*14-16 430-800*/
  font-weight: bold;
  color: #485B6D;
  border-radius: 8px 8px 0px 0px;
  background-color: #FFFFFF;
  border: 1px solid #9AA8B4;
  border-bottom: none;
  transition: background-color 0.2s linear;
  cursor: pointer;
}
.tenki_categorytablist li.active{
  color: #FFFFFF;
  background-color: #678095;
}


/*スマホアコーディオンの処理*/
.accordion-box {
  margin-bottom: clamp(8px,2vw,24px);
}
.accordion-box>input {
  display: none;
}
.sp_radar {
  display: none;
  position: fixed;
  bottom: 110px;
  right:8px;
}
.sp_radar img {
  border-radius: 100%;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.35);
  width:72%;
}
.tenki_txt {
  margin-top: 24px;
  font-size: clamp(0.875rem, 0.7297rem + 0.5405vw, 1rem);/*14-16 430-800*/
  line-height: 2;
}
.tenki_txt strong {
  font-weight: bold;
}
.tenki_update_info{
  text-align: right;
}
.tenki_customimgbox {
  width: 100%;
}
.tenki_customimgbox p {
  padding: 1%;
  display: inline-block;
}
.tenki_customimgbox p img {
  width: 100%;
}



/*----------お天気ブログ----------*/
.tenki_blogsection{
  display: grid;
  grid-template-columns: 37.5% 20% 20% 20%;
  grid-template-rows: 27% 69%;
  gap: 7px 0.8%;
  margin-bottom: 56px;
}
.tenki_blogsection h2{
  grid-column: 2 / 5;
  grid-row: 1 / 2;
}
.tenki_blogsection h2 img{
  width: 100%;
}
.tenki_blog{
  display: contents;
}
.tenki_blog li{
  border-radius: 0 0 8px 8px;
  background-color: #FFFFFF;
}
.tenki_blog li:first-of-type{
  grid-column: 1 / 2;
  grid-row: 1 / 3;
}
.tenki_blog li:nth-of-type(2){
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}
.tenki_blog li:nth-of-type(3){
  grid-column: 3 / 4;
  grid-row: 2 / 3;
}
.tenki_blog li:nth-of-type(4){
  grid-column: 4 / 5;
  grid-row: 2 / 3;
}
.tenki_blog li a{
  display: block;
}
.tenki_blog li a .tenki_blogimg{
  aspect-ratio: 16/9;
}
.tenki_blog li a .tenki_blogimg img{
  width: 100%;
}
.tenki_blog li a .tenki_bloghead{
  line-height: 1.5;
  padding: clamp(8px,1.5vw,14px) clamp(8px,2vw,10px) clamp(8px,2vw,12px);
}
.tenki_blog li:first-of-type a .tenki_bloghead{
  padding: 14px;
}
.tenki_blog li a .tenki_bloghead span{
  display: block;
  font-size: 0.75rem;
  color: #7B7B7B;
  line-height: 1;
}
.tenki_blog li a .tenki_bloghead p{
  padding-top: 8px;
  font-size: 0.875rem;
  color: #7B7B7B;
}



/*交通情報*/
.tenki_traficsection{
  margin-bottom: 56px;
}
.tenki_traficbtn{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}
.tenki_traficbtn h2{
  flex: 1 1 auto;
  font-size: 1.25rem;
  font-weight: bold;
}
.tenki_traficbtn h2 span{
  margin-left: 8px;
  font-size: 0.6em;
  font-weight: normal;
}
.tenki_traficbtn ul{
  flex: 1 1 auto;
  display: flex;
  align-items: flex-end;
  /* justify-content: flex-end; */
  gap: 2px;
}
.tenki_traficbtn ul li{
  flex: 1;
  max-width: 160px;
  max-height: 40px;
  min-width: fit-content;
  padding: 12px 8px;
  text-align: center;
  font-size: 1rem;
  font-weight: bold;
  color: #2F6560;
  border-radius: 8px 8px 0px 0px;
  background-color: #CDE8E5;
  transition: background-color 0.2s linear;
  cursor: pointer;
}
.tenki_traficbtn ul li.active{
  color: #FFFFFF;
  background-color: #009C8C;
}
.tenki_traficlink{
  padding: 20px 20px clamp(20px,8vw,80px);
  background-color: #009C8C;
}
.tenki_traficlink > div{
  display: none;
}
.tenki_traficlink > div:first-of-type{
  display: block;
}
.tenki_traficlink ul{
  display: flex;
  gap: clamp(8px,2vw,16px);
}
.tenki_traficlink ul li{
  width: 240px;
}
.tenki_traficlink ul li a{
  display: block;
  height: 80px;
  padding: 14px 12px;
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.53);
  transition: background-color 0.2s linear;
}
.tenki_traficlink ul li a h3{
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 8px;
  font-weight: bold;
}
.tenki_traficlink [data-cateimg="railway"] ul li:first-of-type a h3{color: #00539C;}
.tenki_traficlink [data-cateimg="railway"] ul li:nth-of-type(2) a h3{color: #33C2C6;}
.tenki_traficlink [data-cateimg="railway"] ul li:nth-of-type(3) a h3{color: #009944;}
.tenki_traficlink [data-cateimg="bus"] ul li:first-of-type a h3{color: #009944;}
.tenki_traficlink [data-cateimg="bus"] ul li:nth-of-type(2) a h3{color: #0065B1;}
.tenki_traficlink [data-cateimg="road"] ul li:first-of-type a h3{color: #8B8B8B;}
.tenki_traficlink [data-cateimg="road"] ul li:nth-of-type(2) a h3{color: #1C93CF;}
.tenki_traficlink [data-cateimg="road"] ul li:nth-of-type(3) a h3{color: #0CB0EE;}
.tenki_traficlink ul li a p{
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.75rem;
  color: #000;
}



/*防災情報*/
.tenki_emgcysection{
  margin-bottom: 56px;
}
.tenki_emgcysection h2{
  padding-bottom: 14px;
  font-size: 1.25rem;
  font-weight: bold;
}
.tenki_emgcy{
  padding: clamp(8px,2vw,28px) clamp(12px,2vw,20px);
  border: 1px solid #C2B756;
  border-top: 2px solid #E30000;
  background-color: #FFF7AE;
}
.tenki_includeemg{
  margin-bottom: 20px;
}
.tenki_includeemg .portal-wrap{
  padding: 0;
  background-color: transparent;
}
.portal-item{padding: clamp(8px,2vw,12px)!important;}
.portal-item .portal-img{background-position: center;}
.portal .portal-detail{margin-top: 4px; line-height: 1 !important;}
.portal-item select[name="select_city"]{font-size: clamp(0.875rem,3vw,1rem)!important;}

.tenki_includeLinfo{
  margin-bottom: 32px;
}
.eme_detailbox h3{
  position: relative;
  height: 40px;
  margin-bottom: 4px;
  padding: 12px;
  text-align: center;
  font-size: 0.875rem;
  font-weight: bold;
  color: #00539C;
  background-color: #F1F1F1;
  display:flex;
  justify-content:space-between;
  border-right:solid 40px #00539C;
  border-left: solid 1px #5087B7;
  border-top: solid 1px #5087B7;
  border-bottom: solid 1px #5087B7;
}
.eme_detailbox h3::after{
  content: "";
  position: absolute;
  display: block;
  width: 8px;
  height: 8px;
  right: -25px;
  top: calc(50% - 8px);
  border-top: 2px solid #FFFFFF;
  border-left: 2px solid #FFFFFF;
  transform: rotate(225deg);
}
.eme_detailbox h3:hover{
  background-color:#C5DBEF;
  cursor:pointer;
  border-right:solid 40px #437AAB;
}
.eme_detailbox h3.active{
  background-color:#C5DBEF;
  border-right:solid 40px #437AAB;
}
.eme_detailbox h3.active::after{
  top: calc(50% - 5px);
  transform: rotate(45deg);
}
.eme_detailbox h3 span{
  font-size:0.7rem;
  color:#426482;
  font-weight:normal;
}
.eme_detailbox > div{
  display: none;
  line-height: 1.5;
  padding: 2px clamp(12px, 2vw, 24px) clamp(12px, 2vw, 24px);
  font-size: 0.875rem;
  background-color: #FFFFFF;
  margin-bottom: 16px;
}
.eme_detailbox > div p{line-height: 1.75;}
.eme_detailbox h4{
  display: none;
  width: 100%;
  margin: 0px auto 0;
  line-height: 1;
  padding: 10px 0 8px 16px;
  font-size: 0.9375rem;
  border-left: solid 4px #bbbbbb;
  font-weight: bold;
  background: #FFF;
  color: #555;
}

.tenki_emgbnr{
  margin-bottom: 32px;
  text-align: center;
}
.tenki_emgbnr a{
  display: inline-block;
  background-color: #FFFFFF;
}
.tenki_emgbnr a img{
  width: 100%;
  transition: opacity 0.2s linear;
}

.tenki_emglink dt{
  margin-bottom: 8px;
  font-size: 1rem;
  font-weight: bold;
}
.tenki_emglink dd:nth-last-of-type(n+2){
  margin-bottom: 24px;
}
.tenki_emglink dd ul{
  display: flex;
  gap: clamp(8px,2vw,14px);
}
.tenki_emglink dd ul li{
  width: 240px;
}
.tenki_emglink dd ul li a{
  display: flex;
  align-items: center;
  gap: 4px;
  height: 54px;
  padding: 8px 10px;
  font-size: 1rem;
  font-weight: bold;
  color: #000000;
  border-radius: 8px;
  background-color: #FFFFFF;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.37);
  transition: background-color 0.2s linear;
  cursor: pointer;
}
.tenki_emglink dd ul li a p span{
  font-size: 0.75em;
}



/*広島の天気*/
.tenki_hiroshima{
  margin-bottom: 56px;
  margin-top:56px;
}
.tenki_hiroshima h2{
  padding-bottom: 8px;
  font-size: 1.25rem;
  font-weight: bold;
  border-bottom: 1px solid #00539C;
}
.tenki_tabsection{
  padding: clamp(24px,2vw,32px) clamp(12px,2vw,32px) 24px;
  background-color: #FFFFFF;
}
.tenki_tabsection:nth-last-of-type(n+2){
  margin-bottom: 8px;
}
.tenki_tabsection .tenki_imgbox{
  aspect-ratio: 16/9;
  margin-bottom: 8px;
}
.tenki_tabsection .tenki_imgbox img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.tenki_tablifelist,
.tenki_tabtenkilist{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: auto;
}
.tenki_tablifelist li,
.tenki_tabtenkilist li{
  padding: 8px 16px;
  font-size: 1rem;
  text-align: center;
  color: #424C7A;
  border-radius: 8px;
  background-color: #E0E9F1;
  border: 1px solid #B9C1C8;
  box-shadow: 0px 2px 0px #BDCCD9;
  cursor: pointer;
  transition: background-color 0.2s linear;
}
.tenki_tablifelist li.active,
.tenki_tabtenkilist li.active{
  color: #FFFFFF;
  background-color: #00539C;
}



/*天気画像スライダー*/
.tenki_slider{
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.tenki_sldguide{
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 8px 0  16px;
}
.tenki_btn {
  width:68px;
}
.tenki_btn img{
  cursor: pointer;
}
.tenki_btn + div{
  width:calc(100% - 68px);
  padding:0;
}
.tenki_btn p {
  display: none;
  width: 64px;
}
.tenki_btn p:first-of-type {
  display: block;
}
.tenki_btn p img {
  width: 100%;
}
.tenki_sldr_scrollbar{
  width: 100%;
  height: 100%;
  position: relative;
}
.tenki_sldr_scrollbar::before {
  content: "";
  display: block;
  width: 100%;
  height: 24px;
  background-image: url(https://www.tss-tv.co.jp/themes/weather2026@tss/img/scale_slide1.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 100% 24px;
  position: absolute;
  top: calc(50% - 10px);
  left: 0;
  transform: translateY(-50%);
}
.tenki_sand .tenki_sldr_scrollbar::before,
.tenki_pm25 .tenki_sldr_scrollbar::before {
  background-image: url(https://www.tss-tv.co.jp/themes/weather2026@tss/img/scale_slide2.svg);
}
.tenki_sldr_scrollbar > div{
  position: relative;
  height: 1em;
  background-color: #FFFFFF;
  border: 4px solid #294677;
  border-radius: 0.5em;
  box-shadow: 0 2px 2px 1px rgba(0, 0 , 0 , 0.1);
  cursor: pointer;
  margin-top:8px; 
}



/*そのほかのリンク*/
.tenki_otherlink{
  display: flex;
  gap: 24px clamp(12px,2vw,24px);
}
.tenki_otherlink dl dt{
  margin-bottom: 8px;
  font-size: 1rem;
  font-weight: bold;
}
.tenki_otherlink dl dd ul{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tenki_otherlink dl dd ul li a{
  display: block;
  height: 38px;
  padding: 10px 8px;
  font-size: 1rem;
  color: #000000;
  border-radius: 10px;
  background-color: #FFFFFF;
  border: 1px solid #B9C1C8;
  box-shadow: 0px 2px 0px #9A9A9A;
  transition: background-color 0.2s linear;
  cursor: pointer;
}



#tss_gototop{
  width: 20%;
  max-width: 112px;
  display: none;
}
#tss_gototop img{
  width: 100%;
}












/*----------ホバー----------*/

@media screen and (min-width:801px){
  .tenki_tabindex li:not(.active):hover{
    background-color: #66A4DA;
  }
  .tenki_categorytablist li:not(.active):hover{
    background-color: #E4E4E4;
  }
  .tenki_tabtenkilist li:not(.active):hover,
  .tenki_tablifelist li:not(.active):hover{
    background-color: #FFFFFF;
  }

  .tenki_traficbtn ul li:not(.active):hover{
    background-color: #A6DFD8;
  }
  .tenki_traficlink ul li a:hover{
    background-color: #DAEEFF;
  }

  .tenki_emgbnr a:hover img{
    opacity: 0.5;
  }
  .tenki_emglink dd ul li a:hover{
    background-color: #DAEEFF;
  }

  .tenki_otherlink dl dd ul li a:hover{
    background-color: #E4E4E4;
  }
}








/* sp------------------------------------------*/

@media screen and (max-width:970px){/*デザイン依存（コンテンツ幅が下部の広告幅と同じになるウインドウサイズ）*/
  
  /*-- add 202305 --*/
  .tenki_emergencywrap{
    padding-bottom:30px;
  }
  
  .tenki_topemblock{
    display:block;
  }
  
  .tenki_topemblock .em_cate{
    width: auto;
    margin: auto;
    min-width: 40%;
    height: 3em;
  }

  .tenki_emgy dl{display:block;}
  .tenki_emgy dl dt,
  .tenki_emgy dl dd{
    width:100%;
    line-height:1.5;
  }
  .tenki_emgy dl dt{
    padding: 6px 8px 4px;
    font-size: 0.75rem;
    font-weight:bold;
  }
  
  .tenki_emgy dl dd span{
    margin-bottom:4px;
    font-size: 0.75rem;
  }
  
  .eme_detailbox h3,
  .tenki_includeemeblock h3{
    display:block;
    text-align:left;
    height:auto;
  }
  .eme_detailh3 span{
    margin-left:auto;
    display:block;
    text-align:right;
    margin-top:8px;
  }
  
  .em_title{font-size:1.125rem;}
  .tenki_toprainbox{margin-bottom: 64px;}
  .tenki_toprainbox .slick-slide img{
    width:100%;
  }

  
  /*-- Lアラート連携ここまで --*/
  
  .tenki_container {
    padding: 10px 0 204px;
  }
  .tenki_container h1 {
    padding: 0 3%;
    margin-bottom: 5px;
    font-size: 1.125rem;
  }
  .tenki_main_wrapper h2 {
    font-size: 1.125rem;
    padding-top: 15px;
  }
  .tenki_ad, .tenki_blog_title img:first-of-type {
    display: none;
  }
  .tenki_blog_title img:nth-of-type(2) {
    display: block;
    width: 100%;
  }
  .tenki_content {
    display: block;
    width: 94%;
    margin: 0 auto;
  }
  .tenki_ovtitle {
    margin-bottom: 8px;
    font-size: 1rem;
    font-weight: normal;
  }
  h2.tenki_update {
    position: static;
  }
  h2.tenki_update span {
    display: inline-block;
    padding-right: 0;
    margin-bottom: 1em;
  }
  .tenki_btn {
    left: 8px;
    top: 54.5vw;
  }
  .tenki_main {
    width: 100%;
    position: relative;
  }
  .tenki_sub {
    width: 100%;
    padding-top: 0;
  }
  .tenki_sub a{font-size: 0.875rem;}
  .tenki_nav a {
    width: 100%;
    font-size: 0.875rem;
  }
  .tenki_update_info {
    font-size: 0.75rem;
  }
  .tenki_wrapper {
    min-height: auto;
    padding: 15px 14px;
  }
  /* アコーディオン処理 */
  .accordion-box {
    position: relative;
  }
  .accordion-box label {
    height: 140px;
    /* グラデーションの高さ */
    cursor: pointer;
    text-align: center;
    font-size: 12px;
    position: absolute;
    bottom: 0;
    width: 100%;
    /* 以下グラデーションは「背景が白」に併せて設定しています */
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.95) 90%);
  }
  .accordion-box>input:checked+label {
    background: inherit;
    /* 開いた時には背景グラデーションを消す */
  }
  .accordion-box label:after {
    content: "続きを読む";
    /* ラベルの文字 */
    letter-spacing: .05em;
    /*line-height: 2.5rem;*/
    padding: 14px 0;
    position: absolute;
    bottom: clamp(0px,calc(16px + (-16) * ((100vw - 430px) / 540)),16px);/*16-0 430-970*/
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    /*color: #FFFFFF; */
    background-color: #f8f8f8;
    border: 1px solid #C4C4C4;
    width: 18.75rem;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
  }
  .accordion-box label:before {
    content: "↓";
    position: absolute;
    bottom: clamp(11px,calc(27px + (-16) * ((100vw - 430px) / 540)),27px);/*27-11 430-970*/
    left: 50%;
    -webkit-transform: translate(-140px, 0);
    transform: translate(-140px, 0);
    background-color: #E4E4E4;
    z-index: 1;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    width: 20px;
    height: 20px;
    line-height: 20px;
  }
  .accordion-box .accordion-container {
    overflow: hidden;
    height: 200px;
    /* 開く前に見えている部分の高さ */
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
  }
/*  .accordion-box>input:checked+label {
     display: none ; 閉じるボタンは要らないとき 
  }*/
  .accordion-box>input:checked+label:after {
    content: "閉じる";
  }
  .accordion-box>input:checked+label:before {
    content: "↑";
  }
  .accordion-box>input:checked~.accordion-container {
    height: auto;
    padding-bottom: 80px;
    /* 閉じるボタンのbottomからの位置 */
    -webkit-transition: all 0.1s;
    -moz-transition: all 0.1s;
    -ms-transition: all 0.1s;
    -o-transition: all 0.1s;
    transition: all 0.1s;
  }
  .tenki_adsp {
    margin: 16px auto;
    min-height:100px;
    width: 336px;
    display: block;
  }
  .sp_radar {
    display: block;
    bottom:188px;
  }
  #tss_gototop {
    left: auto;
    right: 0;
    margin-left: 0;
  }
  .tenki_bousaibn a {
    width: 92%;
    margin: auto;
    display: block;
  }
  
  /*-- emergency --*/
  #emergencytop_return{
    width:96%;
    margin:16px auto 0;
  }



  #tss_gototop{bottom: 256px;}
}


/* tss_footer------------------------------------------*/

.tss_footer {
  width: 100%;
  padding: 1em 0;
  text-align: center;
  background-color: #FFFFFF !important;
  border-top: #D6D6D6 solid 1px;
}

.tss_footer a {
  color: #6D6D6D !important;
  text-decoration: none;
}

@media screen and (max-width:420px) {
  .tenki_btn{top: 56vw;}
}


/*-- ad関連 --*/
.cc-color-override--958013087.cc-window{
  z-index:99999;
}
.halfway .dummy-ad-box {
  display: flex;
  justify-content: space-around;
}

.tenki_toprainbox{
  padding:40px 10px 0;
}

.tenki_toprainbox .tenki_ovtitle{
  margin-top:36px;
  margin-bottom:0.5em;
}

.tenki_toprainimg img{
  display:block;
  width:100%;
}

.tenki_bswcap{
  line-height:1.5;
  padding-bottom:24px;
}

.tenki_bwbnr{
  padding-bottom:24px;
}

.tenki_bwbnr img{
  display:block;
  width:100%;
}

/*-- navi関連 --*/

@media screen and (max-width:800px) {
  .tss_spNav{padding-bottom:118px;}

  /*そのほかのリンク*/
  .tenki_otherlink{flex-direction: column;}
}



@media screen and (max-width:690px){
  /* ----------- お天気ブログ ----------- */
  .tenki_blogsection{
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, auto);
  }
  .tenki_blogsection h2{
    grid-column: 1 / -1;
    grid-row: 1 / 2;
  }
  .tenki_blog li:first-of-type{
    grid-column: 1 / 2;
    grid-row: 2 / 3;
  }
  .tenki_blog li:nth-of-type(2){
    grid-column: 2 / -1;
    grid-row: 2 / 3;
  }
  .tenki_blog li:nth-of-type(3){
    grid-column: 1 / 2;
    grid-row: 3 / -1;
  }
  .tenki_blog li:nth-of-type(4){
    grid-column: 2 / -1;
    grid-row: 3 / -1;
  }

  /* ----------- 防災情報 ----------- */
  .tenki_traficlink ul{flex-direction: column;}
  .tenki_traficlink ul li{width: unset;}

  /* ----------- 防災情報 ----------- */
  .portal-item.portal-area{padding-inline: 0;}
  /* 警報・災害  防災外部リンク */
  .tenki_emglink dd ul{flex-direction: column;}
  .tenki_emglink dd ul li{flex: 1 1 auto;width: unset;}
}