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

body{
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  -webkit-text-size-adjust: 100%;
}
body.open{
  height: 100%;
  overflow: hidden;
}

input{-webkit-tap-highlight-color:rgba(0,0,0,0);}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
  border-radius: 0;
}
select{appearance: none;}
select::-ms-expand{display: none;}
input[type="number"] {-moz-appearance:textfield;}
button,
select,
textarea{
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  font-size: 1rem;
  -webkit-tap-highlight-color:rgba(0,0,0,0);
}
a:focus,
input:focus,
button:focus,
textarea:focus,
select:focus{
  -webkit-tap-highlight-color:rgba(0,0,0,0);
  outline: 0;
}



.tss_wrap{overflow:hidden;}
.tss_wrap img{
  user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -webkit-touch-callout: none;
}


/* chrome opera */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
    body img{
        image-rendering: -webkit-optimize-contrast;
    }
}



/*-------------------- header nav --------------------*/
.tss_comprehensiveHead{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 142px;
  padding: 14px 0;
  background-color: #FFFFFF;
}
.tss_comprehensiveHead a{text-decoration: none;}
.tss_logo{width: 216px;}
.tss_logo a{
  display: block;
  /*aspect-ratio: 128 / 29;*/
  aspect-ratio: 265 / 152;
  padding:16px;

}
.tss_logo img{
  width: 100%;
  height: 100%;
}
.tss_comprehensiveHead ul{
  display: flex;
  align-items: stretch;
}
.tss_comprehensiveHead nav{width: 700px;}
.tss_grNav li{width: calc(100% / 7);}
.tss_grNav li a{
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100px;
  text-align: center;
  font-weight: bold;
  color: #000000;
}
.tss_grNav li a img{
  width: auto;
  margin-bottom: 14px;
}

.tss_hdbnr{width: 206px;}
.tss_hdbnr li{width: calc((100% / 2) - 3px);}
.tss_hdbnr li a{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100px;
  aspect-ratio: 1;
}
.tss_hdbnr li a img{max-width: 100%;}
.tss_hdbnr li:first-of-type{margin-right: 5px;}
.tss_hdbnr li:first-of-type a{background-color: #006A4F;}
.tss_hdbnr li:last-of-type a{background-color: #DB8A03;}

.tss_todayWeather{
  width: 245px;
  margin-left: 16px;
}
.tss_todayWeather div{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tss_todayWeather a{
  display: block;
  color:#000;
}
.tss_todayWeather iframe{
  width: 245px;
  height: 54px;
  pointer-events: none;
}
.tss_todayWeather div p:first-of-type{
  font-size: 0.6875rem;
  font-weight: bold;
}
.tss_todayWeather div p:first-of-type .tss_datefont{font-size: 1.75rem;}
.tss_todayWeather div p:first-of-type .tss_weekday{
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-left: 10px;
  padding-top: 6px;
  text-align: center;
  vertical-align: super;
  font-weight: bold;
  font-size: 0.6875rem;
  border-radius: 100%;
  background-color: #E5E5E5;
}
.tss_todayWeather div p:last-of-type{
  font-size: 0.875rem;
  font-weight: bold;
}






.tss_spbtmnavi{
  display:none;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #FFFFFF;
  z-index: 300;
}
.tss_spbtmnavi>div{
  display: flex;
  padding: 8px;
}
.tss_spbtmnavi ul{display: flex;}
.tss_spbtmnavi ul li:nth-of-type(n+2){margin-left: 0.8vw;}
.tss_spbtmnavi ul li a{
  display: block;
  width: 15.4vw;
  aspect-ratio: 29 / 25;
}
.tss_spbtmnavi ul li a img{
  width: 100%;
  height: 100%;
}

.tss_spNavBtn{
  position: relative;
  display: flex;
  flex-flow: column;
  justify-content: flex-end;
  width: 15.4vw;
  aspect-ratio: 29 / 25;
  margin-left: 0.8vw;
  padding-bottom: 3px;
}
.tss_spNavBtn span{
  display: block;
  position: absolute;
  width: 6.9vw;
  height: 3px;
  left: calc(50% - 3.45vw);
  background-color: #1D1D1D;
  transition: all 0.2s linear;
}
.tss_spNavBtn span:first-of-type{top: 3.2vw;}
.tss_spNavBtn span:nth-of-type(2){top: 5.2vw;}
.tss_spNavBtn span:last-of-type{top: 7.2vw;}
.tss_spNavBtn p::after{
  content: "menu";
  display: block;
  text-align: center;
  font-size: 0.875rem;
  font-weight: bold;
}

.tss_spNavBtn.active span:first-of-type{
  top: 5.2vw;
  transform: rotate(225deg);
}
.tss_spNavBtn.active span:nth-of-type(2){opacity: 0;}
.tss_spNavBtn.active span:last-of-type{
  top: 5.2vw;
  transform: rotate(-225deg);
}
.tss_spNavBtn.active p::after{content: "close"}
.tss_spcopy{
  padding: 4px 0;
  text-align: center;
  font-size: 0.625rem;
  font-weight: bold;
  color: #FFFFFF;
  background-color: #E63B3C;
}



.tss_spNav{
  position: fixed;
  top: 0;
  left: 100%;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: left 0.2s linear, opacity 0.2s linear,visibility 0s linear 0.2s;
  z-index: 250;
  background-color: #FFFFFF;
}
.tss_spNav.active{
  left: 0;
  opacity: 1;
  visibility: visible;
  transition: left 0.2s linear, opacity 0.2s linear;
}
.tss_spNav>div{
  height: calc(100% - 13.3vw - 39px);
  overflow-y: scroll;
}
.tss_spNav ul li{border-bottom: 1px solid #BFBFBF;}
.tss_spNav ul li a{
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 13.3vw;
  padding: 0 20px;
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: bold;
  color: #333333;
  background-color: #FFFFFF;
}
.tss_spNav ul li:nth-of-type(12) a{font-size: 0.8125rem}
.tss_spNav ul li a p span{
  display: inline-block;
  vertical-align: middle;
}
.tss_spNav ul li a p span:first-of-type{margin-right: 12px;}
.tss_spNav ul li a p span:last-of-type{width: calc(100% - 54px);}







/* tss_footer------------------------------------------*/

.tss_footer{
  width:100%;
  padding:1em 0;
  text-align:center;
  background-color:#D52E31;
}

.tss_footer a{
  color:#FFFFFF;
  text-decoration:none;
}

.tss_gotop{
  position: fixed;
  right: calc(50% - 700px);
  bottom: 40px;
  z-index: 200;
}

.tss_fade{
  opacity: 0;
  transition: opacity 0.2s linear;
}
.tss_fade.tss_fadein{opacity: 1;}







@media screen and (min-width: 801px){
  .tss_comprehensiveHead ul li:hover{background-color:#E4E4E4;}
  .tss_hdbnr li:first-of-type a:hover{background-color:#00553F; }
  .tss_hdbnr li:last-of-type a:hover{background-color: #AF6E03;}
  .tss_todayWeather a:hover{opacity: 0.5;}
}








@media screen and (max-width:1440px){
  .tss_comprehensiveHead{padding: 10px 24px;}
  .tss_logo{width: 17.7vw;}
  .tss_comprehensiveHead nav{width: 48.6vw;}
  .tss_hdbnr{width: 14.2vw;}
  .tss_grNav li a{font-size: clamp(12px, 0.625rem + 0.2vw, 16px);}
  .tss_gotop{right:16px;}
}
@media screen and (max-width:1200px){
  .tss_comprehensiveHead{
    flex-wrap: wrap;
    height: auto;
  }
  .tss_logo{width: 256px;}
  .tss_hdbnr{
    width: 205px;
    order: 2;
  }
  .tss_hdbnr li a{height: auto;}
  .tss_comprehensiveHead nav{
    width: calc(100% - 262px);
    order: 3;
  }
  .tss_todayWeather{order: 4;}
}



/*-- styleSP --*/
@media screen and (max-width: 800px){
  .tss_comprehensiveHead{flex-wrap: nowrap;}
  .tss_dsppc{display:none !important;}
  .tss_spbtmnavi{display:block;}


  .tss_gotop{
    right: 8px;
    bottom: 160px;
  }

  .tss_footer{display: none;}
}



@media screen and (max-width: 420px){
  .tss_comprehensiveHead{justify-content: space-between;}
  .tss_logo{width: 148px;}
  .tss_logo a{padding: 0 16px 16px 0;}
  .tss_todayWeather{width: 166px;}
  .tss_todayWeather{margin-left: 0;}
  .tss_todayWeather div p:first-of-type{font-size: 0.625rem;}
  .tss_todayWeather div p:first-of-type .tss_datefont{font-size: 0.9375rem;}
  .tss_todayWeather div p:first-of-type .tss_weekday{
    width: 15px;
    height: 15px;
    margin-left: 0;
    padding-top: 0.25em;
    vertical-align: text-bottom;
    font-size: 0.625rem;
  }
  .tss_todayWeather iframe{
    width: 166px;
    height: 55px;
  }

  .tss_spNavBtn{padding-bottom: 0;}
  .tss_spNavBtn span:first-of-type{top: 12px;}
  .tss_spNavBtn span:nth-of-type(2){top: 19px;}
  .tss_spNavBtn span:last-of-type{top: 27px;}
  .tss_spNavBtn.active span:first-of-type{top: 19px;}
  .tss_spNavBtn.active span:last-of-type{top: 19px;}

  .tss_spNav>div{height: calc(100% - 88px);}



  .tss_gotop{
    bottom: 106px;
    width:64px;
  }


}
/**/