@charset "utf-8";
:root{
  --colorRED:#F74140;
  --colorGRN:#D7E24D;
  --colorPPL:#A13B87;
  --colorORG:#F09015;
  --color01:#000;
  --color02:#FFF;
  --color03:#424242;
  --color04:#DEDEDE;
}
@font-face{
  font-family:'icomoon';
  src:url('../fonts/icomoon.eot?xqc86u');
  src:url('../fonts/icomoon.eot?xqc86u#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?xqc86u') format('truetype'),
    url('../fonts/icomoon.woff?xqc86u') format('woff'),
    url('../fonts/icomoon.svg?xqc86u#icomoon') format('svg');
  font-weight:normal;
  font-style:normal;
  font-display:block}

[class^="icon-"]::after, [class*=" icon-"]::after,.htBtn a::after,.htHeadNav a::after{
  font-family:'icomoon' !important;
  speak:never;
  font-style:normal;
  font-weight:normal;
  font-variant:normal;
  text-transform:none;
  line-height:1;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale
}
.icon-plus::after{content:"\e901"}
.icon-minus::after{content:"\e911"}
.icon-search-l::after{content:"\e902"}
.icon-blank::after,.htBtn a.icon-blank::after{content:"\e903";margin-left:4px;}
.icon-arrow-t::after{content:"\e908"}
.icon-arrow-b::after,.htHeadNav a::after{content:"\e909"}
.icon-arrow-l::after{content:"\e90a"}
.icon-arrow-r::after,.htBtn a::after{content:"\e90b"}
.icon-instagram::after{content:"\ea92"}
*{box-sizing:border-box;}
.clearfix:after,.clearfix:before{content:"";display:block;clear:both}
.clearfix{display:block}
.hottopics{
  background:var(--color02);
  font-family:'Noto Sans JP', sans-serif;
  font-weight:400;
  font-style:normal;
}

.hottopics .mb5{
  margin-bottom:5px
}

.hottopics p{
  margin-bottom:16px;
  line-height:1.75;
}
.hottopics .htTxtC{
  text-align:center;
}
.hottopics .htFontS{
  font-size:.875em;
}
.hottopics .htFontM{
  font-size:1.4em
}
.hottopics .htFontL{
  font-size:2em
}
.hottopics a{
  text-decoration:underline
}
.hottopics a:hover{
  text-decoration:none
}
.hottopics .skip{
	width:1px;
	color:var(--color01);
	font-size:.1%;
	line-height:.1;
	position:absolute;
	left:-3000px;
	z-index:9999
}
.hottopics ul{
  list-style:disc;
  margin-bottom:1em;
  padding-left:20px
}
.hottopics ul.kome{
  list-style:none;
  padding-left:1em
}
.hottopics ul.kome li{
  line-height:1.75;
  font-size:.875em
}
.hottopics ul.kome li span{
  display:inline-block;
  width:1em;
  margin-left:-1em
}
.hottopics ol.kome{
  list-style:none;
  padding-left:2em
}
.hottopics ol.kome li span{
  display:inline-block;
  width:2em;
  margin-left:-2em
}

/*SP only*/
@media screen and (max-width:599px){
  .forPC,.forTB,.hiddenSP{display:none}
}
/*TB only*/
@media screen and (min-width:600px) and (max-width:1024px){
  .forPC,.forSP,.hiddenTB{display:none}
}
/*PC以上*/
@media screen and (min-width:1025px){
  .forTB,.forSP,.hiddenPC{display:none}
}
/*------------------------------------------------------------------------ .htHeader */

.twitter{display:inline-block}
.twitter iframe{vertical-align:bottom}
.fb-share-button{display:inline-block !important;vertical-align:top !important}
.fb-share-button span{vertical-align:top !important}
.fb-share-button iframe{max-width:none !important}
.sns-post-box{
  margin-top:min(10vw,80px);
}
.sns-post-box .sclFb, .sns-post-box .sclTw, .sns-post-box .sclLine{vertical-align:top;}
.sns-post-box .sclTw{padding:4px 10px 5px;background-color:var(--color01);border:1px solid #333;}
.sns-post-box .sclTw:hover{background-color:#333;}
.sns-post-box .sclLine a{padding:4px 10px 2px;}

.htHeader .htKV{
  width:100%;
}
.htHeader .htKV img{
  margin:0 auto;
  max-width:1280px;
  width:100%;
}
.htHeadTxt{
  padding:min(8vw,52px) 0;
}
.htHeadTxt h1{
  width:100%;
  margin-bottom:min(4vw,32px);
  font-family: "Cinzel", serif;
  font-weight:700;
  font-style:normal;
  font-feature-settings:"palt";
  text-align:center;
}
.htHeadTxt h1 .htHeadTtl1{
  display:block;
  font-size:min(9vw,1.5em)
}
.htHeadTxt h1 .htHeadTtl2{
  display:inline-block;
  /* padding:.2em .5em .1em; */
  margin-top:min(1vw,8px);
  font-size:min(6vw,1.2em);
}
.htHeadTxt .htDate{
  max-width:30em;
  padding:min(1vw,.5em) .5em;
  margin:min(2vw,52px) auto 0;
  border:2px solid var(--color01);
  text-align:center;
}
.htHeadTxt p.htDateTxt{
  margin-bottom:0;
  font-family: "Cinzel", serif;
  font-weight:700;
  font-size:min(4.2vw,20px);
  font-feature-settings:"palt";
}
.htHeadTxt .htDate .htFontS{
  margin-bottom:0;
}
.htHeadNav{
  background-color:var(--color01);
}
.htHeadNav ul{
  display:flex;
  flex-wrap:wrap;
  text-align:center;
  justify-content:center;
  margin-bottom:0;
  padding:0;
  list-style:none;
}
.htHeadNav ul li{
  width:50%;
  padding:0;
  border-right:1px solid #666;
  border-bottom:1px solid #666;
}
.htHeadNav a{
  display:flex;
  flex-wrap:wrap;
  align-content:center;
  justify-content:center;
  height:100%;
  padding:10px 4px 8px;
  font-size:min(3.4vw , .875em);
  line-height:1.4;
  font-weight:bold;
  color:var(--color02);
  text-decoration:none;
  transition:all .3s
}
.htHeadNav a::after{
  width:100%;
  margin-top:4px;
  font-size:12px;
  font-weight:normal
}
.htHeadNav a:hover::after{
  transform:translateY(4px)
}

@media screen and (max-width:599px){
  .pub .txtPub{display:block;width:100%;}
  .pub .snsBox{margin-top:.3em}
  .htHeadNav .content-wrap{
    width:100%;
    max-width:none;
  }
}
/*TB以上*/
@media screen and (min-width:600px){
  .htHeadNav ul li{
    width:25%;
  }
  .htHeadTxt{
    text-align:center;
  }
}
/*------------------------------------------------------------------------ htMain */
.htMain{
  /* background-color:var(--color01); */
  color:var(--color02);
  padding-bottom:min(10vw,56px)
}
.htMain table{
  border:none;
  margin-bottom:16px;
  line-height:1.75
}
.htMain th{
  background:rgba(255,255,255,.3);
  border:none;
}
.htMain td{
  background:none;
  border:none;
}
.htMain table ul{
  margin-bottom:0
}
.htMain table ul.mb10{
  margin-bottom:10px;
}
.htBlock{
  padding:min(10vw,80px) min(2vw,16px) min(6vw,16px)
}
.htBlock h2{
  margin:0 auto min(8vw,32px);
  font-size:min(6vw,1.9em);
  line-height:1;
  font-feature-settings:"palt";
}
.htBlock h2 span{
  display:inline-block;
  background-color:var(--color01);
  padding:.2em .4em;
  margin-bottom:3px;
  color:#FFF;
}
.htBlock h3{
  display:inline-block;
  background-color:var(--color01);
  padding:.1em .4em .2em;
  margin-bottom:clamp(2vw, .6em, 24px);
  font-size:min(5vw,1.4em);
  font-feature-settings:"palt"
}
.htBlock .htBox{
  margin-bottom:min(5vw, 40px)
}
.htBoxImg,.htBoxImg-full{
  margin-bottom:min(4vw, 16px);
}
.htBtn{
  text-align:center
}
.htBtn a{
  display:inline-block;
  min-width:80%;
  padding:.8em 1em;
  margin-bottom:min(4vw,26px);
  cursor:pointer;
  text-decoration:none;
  border:2px solid var(--color01);
  color:var(--color01);
  font-weight:600;
  transition:all .3s
}
.htBtn a::after{
  display:inline-block;
  font-size:12px;
  font-weight:normal;
  margin-left:.5em;
  transition:all .3s
}
.htBtn a:hover{
  background-color:var(--color01);
}
.htBtn a:hover::after{
  transform:translateX(4px)
}

/*SP only*/
@media screen and (max-width:599px){
  .htTableBlock th{
    display:block;
    width:100%;
    padding:8px 0;
  }
  .htTableBlock td{
    display:block;
    width:100%;
    padding:.5em 0;
  }
  .htBoxImg,.htBoxImg-full{
    width:100vw;
    margin-left:min(-2vw,-16px);
    margin-right:min(-2vw,-16px);
  }
  .htBoxImg-full img:first-of-type {
    margin-bottom: 4px;
  }
  .htMain #list ul.iconAll li span{
    font-size:min(.75em,3vw);
    line-height:1.2;
  }
}
/*TB以上*/
@media screen and (min-width:600px){
  .htGroup{
    display:flex;
    flex-wrap:wrap;
  }
  .htBoxImg{
    width:50%;
    padding-right:min(6vw,40px);
  }
  /* .htBoxTxt{
    width:50%;
  }  */
  .htMain table{
    border-collapse: separate;
    border-spacing:0 4px;
  }
  .htMain th{
    min-width:3em;
  }
  .htMain td{
    padding:.5em 0 .5em 1em;
  }
  .htBtn{
    margin-top:2em;
  }
  .htBtn a{
    min-width:26em;
    padding:1.5em 3em;
  }

}
/*PC以上*/
@media screen and (min-width:1025px){

}




/*_______________ステッカー*/
.htHeadNav .htNav01 a:hover{
  background-color:var(--colorRED)
}
#sticker{
  background-color:var(--colorRED);
}
#sticker .htSpotList{
  display:flex;
  flex-wrap:wrap;
}
#sticker .htSpotList li{
  width:20em;
}
#sticker .htBtn a:hover{
  color:var(--colorRED);
}

/*_______________フォトスポット*/
#photospot1{
  background-color:var(--colorGRN);
  color:var(--color01);
}
.htHeadNav .htNav02 a:hover{
  background-color:var(--colorGRN);
}
#photospot1 .htBtn a:hover{
  color:var(--colorGRN);
}
/*TB以上*/
@media screen and (min-width:600px){
  #photospot1 .htBoxImg{
    order:2;
    padding-left:min(6vw,40px);
  }
}


/*_______________大型*/
.htHeadNav .htNav03 a:hover{
  background-color:var(--colorPPL);
}
#photospot2{
  background-color:var(--colorPPL);
}
#photospot2 .htBtn a:hover{
  color:var(--colorPPL);
}
/*TB以上*/
@media screen and (min-width:600px){
  #photospot2 .htBoxImg-full{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
  }

}

/*_______________SP*/
.htHeadNav .htNav04 a:hover{
  background-color:var(--colorORG);
}
#special{
  background-color:var(--colorORG);
  color:var(--color01);
}
#special.htBlock h3{
  color:var(--colorORG);
}
#special .htBtn a:hover{
  color:var(--colorORG);
}
/*_______________補足*/
#about{
  color:var(--color01);
}
#about.htBlock h3{
  position:relative;
  z-index:2;
  margin-bottom:0;
  color:var(--color02);
}
#about.htBlock h3 span{
  display:inline-block;
}
.htAboutBox{
  width:calc(100% - 1em);
  border:1px solid #000;
  padding:min(calc(4vw + .6em),calc(32px + .6em)) min(4vw,32px) min(4vw,32px);
  margin-bottom:min(5vw, 40px);
  transform:translate(1em,-1em);
  font-size: .875em;
}
.htAboutBox h4{
  margin-bottom:10px;
  font-size:min(4vw,1em);
}
.htAboutBox th{
  text-align:left;
  vertical-align:top;
}
.htAboutBox .copyright{
  font-size:.9em;
  text-align:right;
  
}
/*SP only*/
@media screen and (max-width:599px){
  .htTableBlock th{
    display:block;
    width:100%;
    padding:8px 0;
  }
  .htAboutBox .htTableBlock th{
    padding-bottom:.1em;
  }
  .htAboutBox .htTableBlock td{
    padding-top:0;
  }
}
/*TB以上*/
@media screen and (min-width:600px){
  .htAboutBox{
    width:calc(100% - 4em);
    transform:translate(4em,-1em);
  }
}
/*PC以上*/
@media screen and (min-width:1025px){
  #special .htSpWrap{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
  }
  #special .htSpWrap .htBox{
    width:calc(50% - 40px)
  }
}