@charset "UTF-8";

/*==============================
//禁則処理
==============================*/

.wrapMain {
	line-break: strict;
    word-break: normal;
    overflow-wrap: break-word;
    word-wrap: break-word;
}
/*==============================
//見出し（汎用）
==============================*/
/*--------
//デフォルト
----------*/
.wrapMain h1 {
  color: #fff;
  border-radius: 5px;
  background-color: #064571;
  font-size: 2.9rem;
  font-weight: 600;
  padding: 1.2em 1em; }
  @media (min-width: 769px) {
    .wrapMain h1 {
      font-size: 2.6rem; } }

.wrapMain h2 {
  color: #064571;
  font-size: 2rem;
  font-weight: 600;
  background-color: #E6F7FF;
  border-bottom: 3px solid #064571;
  padding: .7em; }
  @media (min-width: 769px) {
    .wrapMain h2 {
      font-size: 2.6rem; } }

.wrapMain h3 {
  color: #064571;
  font-size: 1.8rem;
  font-weight: 600;
  border-left: 10px solid #064571;
  padding: 5px 0 5px 10px; }
  @media (min-width: 769px) {
    .wrapMain h3 {
      font-size: 2rem; } }

.wrapMain h4, .wrapMain h5, .wrapMain h6 {
  color: #064571;
  font-size: 1.8rem;
  font-weight: 600; }
  @media (min-width: 769px) {
    .wrapMain h4, .wrapMain h5, .wrapMain h6 {
      font-size: 2rem; } }


/*--------
//町民向け
----------*/
/*----h1----*/
.wrapMain h1.h1_blue{
  color: #684127;
  background-color: #DCF3EF;
  font-size: 2.9rem;
  font-weight: 600;
  padding: 1.2em 1em;
  border-radius: 30px;

  }
    @media (min-width: 769px) {
    .wrapMain h1.h1_blue{
      font-size: 2.6rem; } }

/*----h2----*/
.wrapMain h2.h2_blue {
    color: #684127;
    padding: 0.7em 1em;
    background-color: #fff;
    font-size: 2rem;
    font-weight: 600;
    position: relative;
    margin-top: 1.2em;
    border-bottom: 3px solid #684127;
}
  @media (min-width: 769px) {
    .wrapMain h2.h2_blue{
      font-size: 2.6rem; 
      } 
    }

.wrapMain h2.h2_blue::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 25px;
    height: 25px;
    background-color: #67B4CA;
    border-bottom-right-radius: 50px;
}
  @media (min-width: 769px) {
    .wrapMain h2.h2_blue::before{
     width: 30px;
     height: 30px;
      } 
    }


/*その他の設定*/
*,::before, ::after {
    box-sizing: border-box;
}


/*----h3----*/
.wrapMain h3.h3_blue {
    color: #684127;
    background-color: #fff;
    font-size: 1.8rem;
    font-weight: 600;
    position: relative;
    padding: 1.2em 0em 0.2em 1.3em;
    margin-bottom: 0.5em;
    border-bottom: 6px dotted #684127;
    border-left: none;
}
  @media (min-width: 769px) {
    .wrapMain h3.h3_blue {
      font-size: 2rem; 
      } 
      }

.wrapMain h3.h3_blue::before,
.wrapMain h3.h3_blue::after {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h3.h3_blue::before{
    width: 20px;
    height: 20px;
    bottom: -10px;
    left: -1px;
    background-color: #67B4CA;
}

.wrapMain h3.h3_blue::after{
    width: 20px;
    height: 20px;
    bottom: -10px;
    right: 0;
    background-color: #67B4CA;
}


/*----h4----*/
.wrapMain h4.h4_blue{
  color: #684127;
  font-size: 1.8rem;
  font-weight: 600;
  padding: 1.2em 1.3em;
  position: relative;
}
  @media (min-width: 769px) {
    .wrapMain h4.h4_blue {
      font-size: 2rem; } }

.wrapMain h4.h4_blue::before,
.wrapMain h4.h4_blue::after {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h4.h4_blue::before{
    top: 1.3em;
    left: 0;
    width: 1em;
    height: 1em;
    background: rgba(103, 180, 202, 1);
}
.wrapMain h4.h4_blue::after{
    bottom: 1.2em;
    left: 0.3em;
    width: 0.8em;
    height: 0.8em;
    background: rgba(194, 239, 221, .8);
}


/*----h5----*/
.wrapMain h5.h5_blue{
  color: #684127;
  font-size: 1.8rem;
  font-weight: 600;
  padding: 0em 1.3em;
  position: relative;
}
  @media (min-width: 769px) {
    .wrapMain h5.h5_blue {
      font-size: 2rem; } }

.wrapMain h5.h5_blue::before {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h5.h5_blue::before{
    top: 0.5em;
    left: 0;
    width: 1em;
    height: 1em;
    background: #C2EFDD;
}


/*--------
//魅力観光向け
----------*/
/*----h1----*/
.wrapMain h1.h1_pink {
  color: #684127;
  background-color: #F3E3DC;
  font-size: 2.9rem;
  font-weight: 600;
  padding: 1.2em 1em;
  border-radius: 30px;
}
    @media (min-width: 769px) {
    .wrapMain h1.h1_pink {
      font-size: 2.6rem; } }

/*----h2----*/
.wrapMain h2.h2_pink {
    color: #684127;
    padding: 0.7em 1em;
    background-color: #fff;
    font-size: 2rem;
    font-weight: 600;
    position: relative;
    margin-top: 1.2em;
    border-bottom: 3px solid #684127;
}
  @media (min-width: 769px) {
    .wrapMain h2.h2_pink {
      font-size: 2.6rem; 
      } 
    }

.wrapMain h2.h2_pink::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 25px;
    height: 25px;
    background-color: #F69F91;
    border-bottom-right-radius: 50px;
}
  @media (min-width: 769px) {
    .wrapMain h2.h2_pink::before{
     width: 30px;
     height: 30px;
      } 
    }



/*その他の設定*/
*,::before, ::after {
    box-sizing: border-box;
}


/*----h3----*/
.wrapMain h3.h3_pink {
    color: #684127;
    padding: 1.2em 1em;
    background-color: #fff;
    font-size: 1.8rem;
    font-weight: 600;
    position: relative;
    padding: 1.2em 0em 0.2em 1.3em;
    margin-bottom: 0.5em;
    border-bottom: 6px dotted #684127;
    border-left: none;
}
  @media (min-width: 769px) {
    .wrapMain h3.h3_pink {
      font-size: 2rem; 
      } 
      }

.wrapMain h3.h3_pink::before,
.wrapMain h3.h3_pink::after {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h3.h3_pink::before{
    width: 20px;
    height: 20px;
    bottom: -10px;
    left: -1px;
    background-color: #F69F91;
}

.wrapMain h3.h3_pink::after{
    width: 20px;
    height: 20px;
    bottom: -10px;
    right: 0;
    background-color: #F69F91;
}


/*----h4----*/
.wrapMain h4.h4_pink{
  color: #684127;
  font-size: 1.8rem;
  font-weight: 600;
  padding: 1.2em 1.3em;
  position: relative;
}
  @media (min-width: 769px) {
    .wrapMain h4.h4_pink {
      font-size: 2rem; } }

.wrapMain h4.h4_pink::before,
.wrapMain h4.h4_pink::after {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h4.h4_pink::before{
    top: 1.3em;
    left: 0;
    width: 1em;
    height: 1em;
    background: rgba(246, 159, 145, 1);
}
.wrapMain h4.h4_pink::after{
    bottom: 1.2em;
    left: 0.3em;
    width: 0.8em;
    height: 0.8em;
    background: rgba(209, 213, 196, .8);
}


/*----h5----*/
.wrapMain h5.h5_pink{
  color: #684127;
  font-size: 1.8rem;
  font-weight: 600;
  padding: 0em 1.3em;
  position: relative;
}
  @media (min-width: 769px) {
    .wrapMain h5.h5_pink {
      font-size: 2rem; } }

.wrapMain h5.h5_pink::before {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h5.h5_pink::before{
    top: 0.5em;
    left: 0;
    width: 1em;
    height: 1em;
    background: #D1D5C4;
}


/*--------
//事業者向け
----------*/
/*----h1----*/
.wrapMain h1.h1_green {
  color: #684127;
  background-color: #FDFBEA;
  font-size: 2.9rem;
  font-weight: 600;
  padding: 1.2em 1em;
  border-radius: 30px;


  }
    @media (min-width: 769px) {
    .wrapMain h1.h1_green {
      font-size: 2.6rem; 
      } 
   }

/*----h2----*/
.wrapMain h2.h2_green {
    color: #684127;
    padding: 0.7em 1em;
    background-color: #fff;
    font-size: 2rem;
    font-weight: 600;
    position: relative;
    margin-top: 1.2em;
    border-bottom: 3px solid #684127;
}
  @media (min-width: 769px) {
    .wrapMain h2.h2_green {
      font-size: 2.6rem; 
      } 
    }

.wrapMain h2.h2_green::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 25px;
    height: 25px;
    background-color: #9ACB88;
    border-bottom-right-radius: 50px;
}
  @media (min-width: 769px) {
    .wrapMain h2.h2_green::before{
     width: 30px;
     height: 30px;
      } 
    }

/*その他の設定*/
*,::before, ::after {
    box-sizing: border-box;
}

/*----h3----*/
.wrapMain h3.h3_green {
    color: #684127;
    padding: 1.2em 0em 0.2em 1.3em;
    background-color: #fff;
    font-size: 1.8rem;
    font-weight: 600;
    position: relative;
    padding: 1.2em 0em 0.2em 1em;
    margin-bottom: 0.5em;
    border-bottom: 6px dotted #684127;
    border-left: none;
}
  @media (min-width: 769px) {
    .wrapMain h3.h3_green {
      font-size: 2rem; 
      } 
      }

.wrapMain h3.h3_green::before,
.wrapMain h3.h3_green::after {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h3.h3_green::before{
    width: 20px;
    height: 20px;
    bottom: -10px;
    left: -1px;
    background-color: #9ACB88;
}

.wrapMain h3.h3_green::after{
    width: 20px;
    height: 20px;
    bottom: -10px;
    right: 0;
    background-color: #9ACB88;
}


/*----h4----*/
.wrapMain h4.h4_green{
  color: #684127;
  font-size: 1.8rem;
  font-weight: 600;
  padding: 1.2em 1.3em;
  position: relative;
}
  @media (min-width: 769px) {
    .wrapMain h4.h4_green {
      font-size: 2rem; } }

.wrapMain h4.h4_green::before,
.wrapMain h4.h4_green::after {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h4.h4_green::before{
    top: 1.3em;
    left: 0;
    width: 1em;
    height: 1em;
    background: rgba(154, 203, 136, 1);
}
.wrapMain h4.h4_green::after{
    bottom: 1.2em;
    left: 0.3em;
    width: 0.8em;
    height: 0.8em;
    background: rgba(252, 238, 33, .8);
}


/*----h5----*/
.wrapMain h5.h5_green{
  color: #684127;
  font-size: 1.8rem;
  font-weight: 600;
  padding: 0em 1.3em;
  position: relative;
}
  @media (min-width: 769px) {
    .wrapMain h5.h5_green {
      font-size: 2rem; } }

.wrapMain h5.h5_green::before {
    position: absolute;
    content: '';
    border-radius: 50%;
}

.wrapMain h5.h5_green::before{
    top: 0.5em;
    left: 0;
    width: 1em;
    height: 1em;
    background: #FDF579;
}


/*==============================
//パーツ
==============================*/
/* リスト */
.wrapMain ul {
  margin-left: .25em; }
  .wrapMain ul > li {
    line-height: 2;
    position: relative;
    padding-left: 1.5em; }
    .wrapMain ul > li::before {
      position: absolute;
      display: block;
      content: '●';
      color: #064571;
      -webkit-transform: scale(0.8, 0.8);
              transform: scale(0.8, 0.8);
      top: 0;
      left: 0; }
    .wrapMain ul > li a {
      text-decoration: underline; }
      @media (min-width: 769px) {
        .wrapMain ul > li a {
          transition: .3s; }
          .wrapMain ul > li a:hover {
            opacity: .7; } }

.wrapMain ol {
  counter-reset: num; }
  .wrapMain ol > li {
    line-height: 2;
    position: relative;
    padding-left: 2em; }
    .wrapMain ol > li::before {
      position: absolute;
      display: block;
      text-align: center;
      font-size: 1em;
      width: 24px;
      height: 24px;
      line-height: 2;
      counter-increment: num;
      content: counter(num) ".";
      color: #434343;
      margin-right: .5em;
      top: 0;
      left: 0; }
    .wrapMain ol > li a {
      text-decoration: underline; }
      @media (min-width: 769px) {
        .wrapMain ol > li a {
          transition: .3s; }
          .wrapMain ol > li a:hover {
            opacity: .7; } }

/* リンク */
.wrapMain a:not(.btn_more) {
  font-weight: 600;
  text-decoration: underline;
  color: #064571; }
  @media (min-width: 769px) {
    .wrapMain a:not(.btn_more) {
      transition: .3s; }
      .wrapMain a:not(.btn_more):hover {
        opacity: .7;
        text-decoration: none;
         } }


/* 画像 */
  @media (max-width: 769px) {
	img {
		height: auto !important;
	}
  }
  
/* テーブル */

.table2 tbody tr {
    border-top: 1px solid #064571;
    border-bottom: 1px solid #064571;
}

.table2 tbody th {
    background: #E6F7FF;
}

/* GoogleMap */
  @media (max-width: 769px) {
	.movie-wrap {
		width: 100% !important;
	}
  }


/* リンク */
.grid_center {
	margin-left: 60px;
 }
  @media (max-width: 769px) {
    .grid_center {
      margin: 0 auto;
      display: table !important; }
}


/* 文字拡大・ふりがな */
.moji__box__l:hover > .moji__box__d , .moji__box__l:focus > .moji__box__d , a:focus-visible + .moji__box__d{
  display: block;
}

.moji__box__d:hover{
  display: block;
}

.moji__box__d {
  display: none;
  position: absolute;
  top:50px;
  left:0;
  width: 150px;
  padding: 0px;
  background-color: #fff;
  border: 1px solid #ccc;
  box-sizing: border-box;
  z-index:2;
}

.moji__box__d dl{
  line-height: 2;
}

.moji__box__d dt{
	background-color: #064571;
    color: #fff;
}

.moji__box__d dd{
	text-decoration: underline;
}

.moji__box__d dd:hover{
	text-decoration: none;
}

/* 文字拡大・ふりがな SP */

.is-sp:hover > .moji__box__d__sp /*, .is-sp:focus > .moji__box__d__sp*/{
  display: block;
}

.moji__box__d__sp:hover{
  display: block;
}

.moji__box__d__sp {
  display: none;
  position: absolute;
  top:50px;
  left:-40px;
  width: 150px;
  padding: 0px;
  background-color: #fff;
  border: 1px solid #ccc;
  box-sizing: border-box;
  z-index:400;
}

.moji__box__d__sp dl{
  line-height: 2;
}

.moji__box__d__sp dt{
	background-color: #064571;
    color: #fff;
}

.moji__box__d__sp dd{
	text-decoration: underline;
    padding-top:10px;
    padding-bottom:10px;	
}

.moji__box__d__sp dd:hover{
	text-decoration: none;
}

#hojo__box__d__sp dl{
  line-height: 2;
}

#hojo__box__d__sp dt{
	background-color: #064571;
    color: #fff;
}

#hojo__box__d__sp dd{
	text-decoration: underline;
    padding-top:10px;
    padding-bottom:10px;	
}

#hojo__box__d__sp dd:hover{
	text-decoration: none;
}

#hojo__box__d__sp {
	display:none;
}

#menu_bar:checked ~ #hojo__box__d__sp {
	margin-top: 11px;
	right: 50px;
    background-color: #fff;
    z-index: 1;
    position: fixed;
    display:block;
    font-size: 1.5rem;
}

.is-sp input {
  display: none;
}


/* フッター */
/*.footMain {
    color: #fff !important;
}*/