@charset "utf-8";
:root{
  --PPL:#5B4080;
  --ORG:#F58024;
  --GRN:#A8C800/*#CDDB00*/;
  /* --mainColorRGB:0,122,196;
  --subColor:#009ee0;
  --subColorRGB:0,158,224;
  --pointColor:#f56634;
  --pointColorRGB:245,102,52;
  --ttlColor:#a64f30;
  --ttlColorRGB:166,79,48;
  --shadow:0 4px 8px 0 rgba(74,85,99,.2);
  --GRY:#757575;
  --GRN:#00892E;
  --RED:#D8000C;
  --BLU:#1077CF;
  --mainAnime:all .3s ease; */

}


/*------------------------------------------------------------------------ base */
*{box-sizing:border-box}
.clearfix:after,.clearfix:before{content:"";display:block;clear:both}
.clearfix{display:block}
.hottopics p{margin-bottom:1em}
.hottopics a{text-decoration:underline}
.hottopics a:hover{opacity:.5;text-decoration:none}
.txtC{text-align:center}
ul.listMark{list-style:disc;margin-left:20px}
.hottopics{position:relative}
.hottopics::after{content:"";display:table;clear:both;}
.hottopics p{line-height:1.5}
.hottopics img{max-width:100%;height:auto}
.hottopics .kome{margin-left:1.3em;}
.hottopics .kome span{display:inline-block;width:1.3em;margin-left:-1.3em}
.hottopics .txtR{text-align:right}
.hottopics .mb1em{margin-bottom:1em;}
.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}

/*------------------------------------------------------------------------ header */
.hottopics{
  background:#FFF
}
.htHead{
  margin-bottom:32px
}
.htHead h1{
  width:100%!important;
  margin-bottom:15px;
  font-size:1.8rem;
}
.htHead h1 img{
  max-width:min(100%,1280px);
  margin:0 auto;
}
.htH-l-img{
  margin-bottom:16px;
}
.htH-link{
  background-color:var(--PPL);
  color:#FFF;
  font-weight:bold;
}
.htH-link .content-wrap{
  padding:24px 0 calc(24px - .3em);
}
.hottopics p.htH-link_ttl{
  text-align:center
}
.htH-link_ttl::before,.htH-link_ttl::after{
  content:"-";
  margin:0 5px
}
.htH-link ol > li{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  justify-content:space-between;
  padding:.3em 0 .3em 2em;
  border-bottom:1px dotted rgba(255,255,255,.5);
}
.htH-link ol li > span{
  display:block;
  width:1.5em;
  height:1.5em;
  margin-left:-2em;
  margin-right:.5em;
  border-radius:100px;
  background-color:#FFF;
  text-align:center;
  line-height:1.5em;
  color:var(--PPL);
}
.htH-link ol li > a{
  display:block;
  width:100%;
  margin-bottom:.5em;
}
.htH-link ul{
  list-style:disc;
  margin-left:1.4em;
}
.htH-link ul li{
  margin-bottom:.3em
}
.htMission{
  display:inline-block;
  width:12.5em;
  padding:.2em .5em .1em;
  margin:.3em 0 0 .5em;
  background-color:var(--ORG);
  /* background-color:#E86480; */
  border-radius:4px;
  font-size:1.3rem;
  text-align:center;
  color:#FFF;
}
.htWrap{
  padding:32px 0 1px;
}
.htWrap h2{
  margin-bottom:15px;
}
.htWrap h2 img{
  margin:0 auto;
}
.htWrap h3{
  width:100%;
  margin:0 0 10px;
}
.htBox h3::before{
  content:"";
  display:inline-block;
  width:24px;
  height:24px;
  margin-right:4px;
  transform:translateY(.2em);
}
.htImg1 img,.htImg2 img,.htImgWide img,.htBox-img img{
  margin-bottom:10px;
}
.htOtoku{
  border-radius:10px;
  padding:0 16px 1px;
  margin-bottom:16px;
  background:url(../img/bg_otoku.png) repeat #E3DFE9 50% 50%/30px;
}
.htOtoku h4{
  width:calc(100% + 32px);
  margin:0 -16px 16px;
  background-color:var(--PPL);
  padding:.3em .5em;
  border-radius:10px 10px 0 0;
  text-align:center;
  color:#FFF;
  font-size:1.1em;
}
.htO-img{
  margin-bottom:10px;
}
.htMain table{
  margin-bottom:0;
  border-color:#E5E5E5
}
.htMain table th{
  background-color:#E3DFE9;
  border-color:#E5E5E5
}
.htMain table td{
  border-color:#E5E5E5
}
.htBtn{
  clear:both;
  width:100%;
  margin:1em 0;
  text-align:center
}
.htBtn a{
  display:inline-block;
  padding:.6em 1.5em .5em;
  background:#88B545;
  border-bottom:6px solid #2782AB;
  border-radius:100px;
  font-weight:bold;
  text-decoration:none;
  color:#FFF;
}
.htBtn a:hover{
  margin-top:6px;
  border-bottom:none;
  opacity:1
}

/*____________________________#no01*/
#no01.htWrap{
  background-color:var(--ORG);
}
#no01 .htBox{
  position: relative;
  padding:16px 10px 1px;
  margin-bottom:32px;
  border-radius:10px;
  background:#FFF;
}
#no01 .htBox:not(:last-of-type)::after{
  content:"";
  position:absolute;
  bottom:-32px;right:0;left:0;
  display:block;
  width:100%;
  height:32px;
  background:url(../img/bg_ashi.png) repeat-y 50% 0/auto auto;
}
#no01 .htBox h3{
  color:var(--ORG);
}
#no01 .htBox h3::before{
  background:url(../img/icon_01.png) no-repeat 0 0;
}
#no01 .htImgHalf img{
  width:60%;
  margin:0 auto 10px;
}

/*____________________________#no02*/
#no02.htWrap{
  background-color:var(--GRN);
}
/*____________________________#no03*/
#no03.htWrap{
  background-color:var(--PPL);
}
#no03 .htLead{
  color:#FFF;
}
#no03 .htBox{
  position: relative;
  padding:16px 0 6px;
  margin-bottom:32px;
  border-radius:10px;
  background:#FFF;
}
#no03 .htBox h3{
  padding:0 10px;
  color:var(--PPL)
}
#no03 .htBox h3::before{
  background:url(../img/icon_01.png) no-repeat 0 0;
}
#no03 .htBox ul li{
  padding:.5em 10px;
  line-height:1.5;
}
#no03 .htBox ul li:not(:last-of-type){
  border-bottom:1px dotted var(--PPL);
}
#no03 .htBox ul li span{
  display:inline-block;
  background-color:var(--PPL);
  border-radius:4px;
  padding:.2em .5em .08em;
  margin-right:.5em;
  color:#FFF;
  font-size:.75em;
}
/*____________________________#no04*/
#no04.htWrap{
  background-color:#CB0D00;
  color:#FFF;
}
#no04 .htBox h3{
  color:#CB0D00;
}
#no04 .htBox h3::before{
  background:url(../img/icon_01.png) no-repeat 0 0;
}
#no04 .htBox{
  position: relative;
  padding:10px 10px 1px;
  margin-bottom:32px;
  border-radius:10px;
  background:#FFF;
  color:#000;
}
.ht04-block{
  margin-bottom:1em;
}
/*____________________________#no05*/
#no05.htWrap{
  background-color:var(--GRN);
}
.ht05-iconList{
  border-radius:10px;
  padding:16px;
  margin-bottom:24px;
  background-color:#FFF;
}
.ht05-iconList h4{
  margin-bottom:10px;
}
.ht05-iconList li{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:5px;
}
.htMain table.ht05-spot{
  margin-bottom:24px;
  overflow:hidden;
  border-radius:10px;
  border:none;
}
.htMain table.ht05-spot th{
  background-color:var(--PPL);
  border:none;
  color:#FFF;
}
.ht05-spot dt{
  margin-bottom:.2em;
}
.ht05-spot dd{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  border-bottom:1px dashed #DDD;
  padding-bottom:.5em;
  margin-bottom:.3em;
}
.ht05-spot dd:last-of-type{
  border-bottom:none;
  padding-bottom:0;
  margin-bottom:0;
}
.ht05-spot dd img{
  width:40px;
  margin-right:5px;
}
.ht05-spot dd ul{
  width:100%;
  margin-top:.3em;
  list-style:disc;
  padding-left:20px;
}
/*____________________________#no06*/
#no06.htWrap{
  background-color:var(--PPL);
}
#no06 .htBox h3{
  color:var(--ORG)
}
#no06 .htBox h3::before{
  content:"";
  background:url(../img/icon_01.png) no-repeat 0 0;
}
.htQA dt{
  clear:both;
  background-color:#FFF;
  padding:.2em .5em .2em 2em;
  border-radius:4px;
  color:var(--PPL);
  font-weight:bold;
}
.htQA dt span{
  display:block;
  float: left;
  width:2em;
  padding-left:.5em;
  margin-left:-2em;
  font-weight:bold;
}
.htQA dd{
  padding:.5em 0 1em 2em;
  clear:both;
  color:#FFF;
}
.htQA dd span{
  display:block;
  float: left;
  width:2em;
  padding-left:.5em;
  margin-left:-2em;
  font-weight:bold;
}
.htQA dd ul{
  width:calc(100% - 2em);
  list-style:disc;
  padding-left:20px;
}
.htQA dd ul li{
  margin-bottom:.3em;
}
.htCopyright{
  color:#FFF;
  text-align:right;
  font-size:.75em
}
#etcEvent{
  background-color:#F4F8DF;
  padding-bottom:32px;
}
#etcEvent h2{
  text-align:center;
  color:var(--GRN);
}

/*SP only*/
@media screen and (max-width:599px){
  .forPC,.forTB,.hiddenSP{display:none}
  .forSP{display:inline-block}
  .htHead h1 .htSubttl.forSP{
    display:block;
    max-width:80%;
    margin:16px auto;
  }
  .htMain table{
    border-left:none
  }
  .htMain table th{
    display:block;
    width:100%;
    border-bottom:none;
  }
  .htMain table td{
    display:block;
    width:100%;
    border-right:none;
  }
  .ht05-iconList li img{
    width:32px
  }
  .ht05-iconList li span{
    width:calc(100% - 32px);
    padding-left:5px;
  }
}
/*TB only*/
@media screen and (min-width:600px) and (max-width:1024px){
  .forPC,.forSP,.hiddenTB{display:none}
  .forTB{display:inline-block}
  #no04 .ht04-bus .htBox-img{
    width:min(50%,496px);
    float:right;
    padding:0 0 10px 24px;
  }
  #no04 .ht04-ticket .htBox-img{
    width:min(30%,260px);
    float:right;
    padding:0 0 10px 24px;
  }
}
/*TB以上*/
@media screen and (min-width:600px){
  .htHead h1 .htSubttl.hiddenSP{
    display:block;
    max-width:720px;
    padding:32px 24px 0;
    margin:0 auto
  }
  .htWrap{
    padding:48px 0 32px;
  }
  .htWrap h2{
    margin-bottom:24px;
  }
  .htBox h3::before{
    margin-right:8px;
  }
  .htH-lead.content-wrap,.htH-link.content-wrap,.htMain .content-wrap{
    padding-left:24px;
    padding-right:24px;
  }
  .htH-lead{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    margin-top:32px;
  }
  .htH-l-img{
    width:50%;
  }
  .htH-l-txt{
    width:50%;
    padding-left:32px;
  }
  .htH-link .content-wrap{
    padding:40px 0;
  }
  .htH-link ol{
    max-width:42em;
    margin:0 auto;
  }
  .htOtoku{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    padding:0 24px 1px;
    margin-top:32px;
  }
  .htOtoku h4{
    width:calc(100% + 48px);
    margin:0 -24px 24px;
    padding:.5em 1em;
    font-size:1.2em;
  }
  .htO-img{
    width:40%;
    margin-bottom:24px;
  }
  .htO-txt{
    width:60%;
    padding-left:24px;
  }
  .htMain table th{
    border-bottom:1px solid #FFF;
  }
  .htImg2{
    display:flex;
    flex-wrap:wrap;
    margin:0 -4px 6px;
  }
  .htImg2 > div{
    width:50%;
    padding:0 4px;
  }
  .htImgHalf{
    width:50%;
    float:left;
    padding-right:24px;
  }
  .htTxtHalf{
    width:50%;
    float:left;
  }
/*____________________________#no01*/
  #no01 .htBox{
    padding:24px 24px 8px;
  }
  #no01 .htBox:not(:last-of-type){
    margin-bottom:56px;
  }
  #no01 .htBox:not(:last-of-type)::after{
    bottom:-56px;
    height:56px;
  }
  #no01 .htImgHalf img{
    width:100%;
  }
/*____________________________#no02*/
  #no02 .htBox{
    margin-bottom:24px;
  }
/*____________________________#no03*/
  #no03 .htBox{
    padding:24px 0 8px;
  }
  #no03 .htBox h3{
    padding:0 24px;
  }
  #no03 .htBox ul li{
    padding-left:24px;
    padding-right:24px;
  }
/*____________________________#no04*/
  #no04 .htBox{
    padding:24px 24px 8px;
  }
  #no04 .htBox{
    height:100%;
  }
  #no04 .htBox-img img{
    margin-bottom:16px;
  }
  #no04 .ht04-ticket .htBox-img img{
    max-width:240px;
    border:1px solid #ddd;
    margin-left:auto;
    margin-right:auto
  }
  #no04 .ht04-ticket ul{
    list-style-type:disc;
    padding-left:24px;
  }
/*____________________________#no05*/
  .ht05-iconList{
    padding:24px;
  }
  .ht05-iconList ul{
    display:flex;
    flex-wrap:wrap;
  }
  .ht05-iconList ul li{
    width:50%;
  }
  .ht05-iconList li img{
    width:40px;
  }
  .ht05-iconList li span{
    width:calc(100% - 40px);
    padding-left:10px;
  }
  .htMain table.ht05-spot th{
    text-align:left;
    border-bottom:1px solid #FFF;
  }
  .ht05-spot dl{
    display:flex;
    flex-wrap:wrap;
  }
  .ht05-spot dt{
    width:15em;
    border-bottom: 1px dashed #DDD;
    padding-bottom: .5em;
    margin-bottom: .3em;
  }
  .ht05-spot dt:last-of-type{
    border-bottom:none;
    padding-bottom:0;
    margin-bottom:0;
  }
  .ht05-spot dd{
    width:calc(100% - 15em);
  }
  .htQA dt{
    padding-top:.5em;
    padding-bottom:.5em;
  }
  .htQA dd{
    padding:.5em .5em 1em 2em;
  }
  #etcEvent{
    padding:32px 0 40px;
  }
  #etcEvent ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
  }
  #etcEvent ul li{
    width:50%;
    padding:0 10px;
  }
}
/*PC以上*/
@media screen and (min-width:1025px){
  .htWrap {
    padding:56px 0 40px;
  }
  .htWrap h2{
    margin-bottom:32px;
  }
  #no01 .htBox {
    padding:40px 40px 32px;
  }
  .htImg1-img{
    width:calc(50% - 2px);
    float:right;
  }
  .htImg1-txt{
    width:50%;
    float:right;
    padding:24px 0 0 24px;
  }
  .htImg1-img{
    width:calc(50% - 2px);
    float:left;
  }
  .ht03-block{
    display:flex;
    flex-wrap:wrap;
    margin-left:-8px;
    margin-right:-8px;
  }
  .ht03-block .ht03-box{
    width:33.333333%;
    padding:0 8px;
  }
  .ht03-block .ht03-box .htBox{
    height:100%;
  }
  .ht04-block{
    display:flex;
    flex-wrap:wrap;
    margin-left:-8px;
    margin-right:-8px;
  }
  .ht04-ticket,.ht04-bus{
    width:50%;
    padding:0 8px;
  }
  .ht04-block h3 span{
    display:inline-block;
  }
}
/*______________新版はこちら */
a.btnNew{
  display:block;
  max-width:680px;
  min-height:inherit;
  position:relative;
  padding:10px;
  margin:.5em auto 1em;
  border-radius:5px;
  background:#FCA026;
  font-size:20px;
  font-weight:bold;
  color:#fff;
  text-align:center;
  text-decoration:none;
  box-shadow:0 6px #D77D04
}
a.btnNew:hover {
  opacity:1;
  box-shadow:0 0 #D77D04;
  top:6px
}