@charset "UTF-8";
/*-----------------------
reset
-----------------------*/
html, h1, h2, h3, h4, h5, h6, body, div, span, applet, object, iframe, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  vertical-align: middle;
  font-weight: 200;
}

q::before, q::after, blockquote::before, blockquote::after {
  content: "";
  content: none;
}

a {
  display: inline-block;
}

a img {
  border: none;
}

img {
  vertical-align: bottom;
  max-width: 100%;
}

ul {
  list-style: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
}

a {
  color: #382710;
  text-decoration: none;
}
a:link {
  color: #382710;
}
a:active {
  color: #382710;
}
a:visited {
  color: #382710;
}
a:hover {
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s;
}

.bs-main-contents a {
  color: #333;
  text-decoration: none;
}
.bs-main-contents a:link {
  color: #333;
}
.bs-main-contents a:active {
  color: #333;
}
.bs-main-contents a:visited {
  color: #333;
}
.bs-main-contents a:hover {
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s;
}

p {
  margin: 0;
}

input, button, textarea, select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

*:focus {
  outline: none;
}

*, *:before, *:after {
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*path*/
/* color */
/*mediaquery*/
/*==================================================
 * classes
 *================================================*/
/*@import 'modules/fadein';*/
/*==================================================
 * layout
 *================================================*/

/*==================================================
 * イベントマップ
 *================================================*/
/*イベントマップここから*/
.MapLinkArea{
  min-height:500px;
}

@media (max-width: 960px) {
  .MapLinkArea{
    padding: 0 10px;
    min-width: 300px;
  }
}

.MapLinkBlock {
  letter-spacing: 0.02em;

}
@media (max-width: 960px) {
  .MapLinkBlock {
    padding: 0 0 30vw;
    padding:0;

  }
}
.MapLinkBlock .flex {
  justify-content: space-between;
  /*display: block;*/
  position: relative;
}
@media (max-width: 960px) {
  .MapLinkBlock .flex {
    flex-direction: column-reverse;
    gap: 40px 0;
  }
}

.MapLinkBlock .flex .links {
  width: 48%;
  display: flex;
  flex-wrap: wrap;
  align-self: flex-start;
}
/*イベント情報*/
.EventArea{}
.EventMainArea{}
.EventArea ul{
  margin:5px 0;
  width:100%;
}
.EventArea ul li{
  border-bottom:1px solid #ccc;
  padding:20px 0;
}
.EventArea ul li .list{
  text-align:left;
}
.EventArea > h3,
.EventArea > h4{
  position:relative;
  font-size:120%;
  border-bottom:1px solid #ccc;
  padding-bottom:15px;
  line-height:1.2;
}
.EventArea > h3 .Main,
.EventArea > h4 .Main{
  font-size:180%;
}
.EventArea > h3::before,
.EventArea > h4::before{
  content: '\e879';
  color:#234819;
}
.EventArea.EventMainArea > h3::before,
.EventArea.EventMainArea > h4::before{
  content: '\e879';
  color:#ec9229;
}
.EventArea > h3::before,
.EventArea > h4::before{
  font-family: "preset-icon";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  opacity: .8;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  font-size:180%;
}
.EventArea .EventTitle{
  color:#234819;
  margin-bottom:10px;
  font-size:130%;
  line-height:1.3;
}
.EventArea .EventDate{
  display:inline-block;
  vertical-align:middle;
  margin-right:1em;
  margin-top:5px;
  margin-bottom:5px;
}
.EventArea .EventDate::before{
  content: '日時';
  border:1px solid #222;
  display:inline-block;
  vertical-align:middle;
  padding:2px 5px;
  font-size:90%;
  margin-right:0.4em;
}
.EventArea .EventTime{
  display:inline-block;
  vertical-align:middle;
  margin-right:1em;
}
.EventArea .EventPlace{
  display:inline-block;
  vertical-align:middle;
}
.EventArea .EventPlace::before{
  content: '場所';
  border:1px solid #222;
  display:inline-block;
  vertical-align:middle;
  padding:2px 4px;
  font-size:90%;
  margin-right:0.4em;
}

.EventArea .EventText{
  display:block;
  margin:10px 0 0 0;
}
.EventArea .Organised{
  display:inline-block;
  vertical-align:middle;
  margin-right:1em;
  margin-top:5px;
  margin-bottom:5px;
}
.EventArea .Organised::before{
  content: '主催';
  border:1px solid #222;
  display:inline-block;
  vertical-align:middle;
  padding:2px 5px;
  font-size:90%;
  margin-right:0.4em;
}



@media (max-width: 960px) {
  .EventArea > h4 .Sub{
    display:block;
    margin-top:10px;
  }
}





@media screen and (min-width: 961px) and (max-width: 1103px) {
  .MapLinkBlock .flex .links {
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
  }

}
@media (min-width: 961px) {
  .MapLinkBlock .flex{
    position: relative;
    display: block;
    max-width:550px;
    margin-left: calc(100% - 560px);
  }


  .MapLinkBlock .flex .links {
    /*position: absolute;
    left: 0;
    top: 0;
    z-index: 2;*/


  }
  /*マップピン共通*/
  .MapLinkBlock .flex .links .AreaPin{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width:auto!important;
  }


  /*福井県全域*/
  .MapLinkBlock .flex .links .AreaPin#area-All{
    left: 10%;
    top: 25%;
    
    width:70px!important;
    height:70px!important;
    border-radius:40%;
    background:#c7e5a5;
    text-align:center;
  }

  .MapLinkBlock .flex .links .AreaPin#area-All a{
    position: relative;
    z-index: 1;
  }
  .MapLinkBlock .flex .links .AreaPin#area-All a::before{
    content: "福井県全域";
    position:absolute;
    font-size: 1.1rem;
    top: -8px;
    left: -50%;
    width: 70px;
    line-height:1;
    text-align:center;
    color: #fff;
    font-size: 70%;
    background: #222;
    line-height: 1.2;
    padding: 5px 8px 4px;
    border-radius: 14px;
    font-weight: normal;
    white-space: nowrap;
    display: block;
    width: auto;
    z-index: 1;
    transition: all 0.4s;
  }


  /*福井市*/
  .MapLinkBlock .flex .links .AreaPin#area-1{
    left: 45%;
    top: 15%;
  }
  /*敦賀市*/
  .MapLinkBlock .flex .links .AreaPin#area-2{
    left: 42%;
    top: 58%;
  }
  /*小浜市*/
  .MapLinkBlock .flex .links .AreaPin#area-3{
    left: 18%;
    top: 75%;
  }
  /*大野市*/
  .MapLinkBlock .flex .links .AreaPin#area-4{
    left: 82%;
    top: 30%;
  }
  /*勝山市*/
  .MapLinkBlock .flex .links .AreaPin#area-5{
    left: 72%;
    top: 13%;
  }
  /*あわら市*/
  .MapLinkBlock .flex .links .AreaPin#area-6{
    left: 55%;
    top: -2%;
  }
  /*鯖江市*/
  .MapLinkBlock .flex .links .AreaPin#area-7{
    left: 55%;
    top: 23%;
  }
  /*越前市*/
  .MapLinkBlock .flex .links .AreaPin#area-8{
    left: 47%;
    top: 32%;
  }
  /*坂井市*/
  .MapLinkBlock .flex .links .AreaPin#area-9{
    /*left: 60%;
    top: 4%;*/
    left: 48%;
    top: 1%;
  }
  /*永平寺町*/
  .MapLinkBlock .flex .links .AreaPin#area-10{
    left: 62%;
    top: 13%;
  }
  /*池田町*/
  .MapLinkBlock .flex .links .AreaPin#area-11{
    left: 63%;
    top: 35%;
  }
  /*越前町*/
  .MapLinkBlock .flex .links .AreaPin#area-12{
    left: 39%;
    top: 26%;
  }
  /*南越前町*/
  .MapLinkBlock .flex .links .AreaPin#area-13{
    left: 53%;
    top: 45%;
  }
  /*美浜町*/
  .MapLinkBlock .flex .links .AreaPin#area-14{
    left: 35%;
    top: 65%;
  }
  /*おおい町*/
  .MapLinkBlock .flex .links .AreaPin#area-15{
    left: 10%;
    top: 82%;
  }
  /*高浜町*/
  .MapLinkBlock .flex .links .AreaPin#area-16{
    left: 2%;
    top: 73%;
  }
  /*若狭町*/
  .MapLinkBlock .flex .links .AreaPin#area-17{
    left: 28%;
    top: 70%;
  }

  /*式典・行事等（大野市）*/
  .MapLinkBlock .flex .links .AreaPin#MainArea-1{
    left: 76%;
    top: 26%;
  }
  /*式典・行事等（勝山市）*/
  .MapLinkBlock .flex .links .AreaPin#MainArea-2{
    left: 77.5%;
    top: 12.5%;
  }
  /*式典・行事等（XX市）
  .MapLinkBlock .flex .links .AreaPin#MainArea-3{
    left: 77%;
    top: 26.3%;
  }*/

/*名称*/
@media (min-width: 961px) {
  /*共通*/
  .MapLinkBlock .flex .links .AreaPin a:hover .SpAreaTitle{
    display:block;
    position:relative;
    z-index: 1;
    transition: all 0.4s;
  }
  .MapLinkBlock .flex .links .AreaPin a:hover .SpAreaTitle .Main{
    position:absolute;
    top:-83px;
    left:-0.5em;
    color:#fff;
    font-size:70%;
    background:#555;
    line-height:1.2;
    padding:5px 8px 4px;
    border-radius:14px;
    font-weight:normal;
    white-space:nowrap;
    display: block;
    width:auto;
    z-index: 1;
    transition: all 0.4s;
  }
  /*福井県全域*/
  .MapLinkBlock .flex .links .AreaPin#area-All .SpAreaTitle .Main{
    left:-1.75em;
  }
  

  
  
  /*福井市*/
  .MapLinkBlock .flex .links .AreaPin#area-1 .SpAreaTitle .Main{

  }
  /*敦賀市*/
  .MapLinkBlock .flex .links .AreaPin#area-2 .SpAreaTitle .Main{

  }
  /*小浜市*/
  .MapLinkBlock .flex .links .AreaPin#area-3 .SpAreaTitle .Main{

  }
  /*大野市*/
  .MapLinkBlock .flex .links .AreaPin#area-4 .SpAreaTitle .Main{

  }
  /*勝山市*/
  .MapLinkBlock .flex .links .AreaPin#area-5 .SpAreaTitle .Main{

  }
  /*あわら市*/
  .MapLinkBlock .flex .links .AreaPin#area-6 .SpAreaTitle .Main{
    left:-0.85em;
  }
  /*鯖江市*/
  .MapLinkBlock .flex .links .AreaPin#area-7 .SpAreaTitle .Main{

  }
  /*越前市*/
  .MapLinkBlock .flex .links .AreaPin#area-8 .SpAreaTitle .Main{

  }
  /*坂井市*/
  .MapLinkBlock .flex .links .AreaPin#area-9 .SpAreaTitle .Main{

  }
  /*永平寺町*/
  .MapLinkBlock .flex .links .AreaPin#area-10 .SpAreaTitle .Main{
    left:-0.85em;
  }
  /*池田町*/
  .MapLinkBlock .flex .links .AreaPin#area-11 .SpAreaTitle .Main{

  }
  /*越前町*/
  .MapLinkBlock .flex .links .AreaPin#area-12 .SpAreaTitle .Main{

  }
  /*南越前町*/
  .MapLinkBlock .flex .links .AreaPin#area-13 .SpAreaTitle .Main{
    left:-0.85em;
  }
  /*美浜町*/
  .MapLinkBlock .flex .links .AreaPin#area-14 .SpAreaTitle .Main{

  }
  /*おおい町*/
  .MapLinkBlock .flex .links .AreaPin#area-15 .SpAreaTitle .Main{
    left:-0.85em;
  }
  /*高浜町*/
  .MapLinkBlock .flex .links .AreaPin#area-16 .SpAreaTitle .Main{

  }
  /*若狭町*/
  .MapLinkBlock .flex .links .AreaPin#area-17 .SpAreaTitle .Main{

  }
  
  /*式典・行事等（大野市）*/
  .MapLinkBlock .flex .links .AreaPin#MainArea-1 .SpAreaTitle .Main{
    left:-4.5em;
  }
  /*式典・行事等（勝山市）*/
  .MapLinkBlock .flex .links .AreaPin#MainArea-2 .SpAreaTitle .Main{
    left:-3em;
  }
  /*式典・行事等（XX市）*/
  .MapLinkBlock .flex .links .AreaPin#MainArea-3 .SpAreaTitle .Main{
    left:-1.5em;
  }
  
  
}


  .MapLinkBlock .flex .links .AreaPin a {

  }
  .MapLinkBlock .flex .links .AreaPin a .Icon{
    color:#234819;
    font-size:2.5em;
  }
  .MapLinkBlock .flex .links .AreaPin a:hover{
    opacity: 1;
  }
  /*メイン会場*/
  .MapLinkBlock .flex .links .AreaPin.Main a .Icon{
    color:#ec9229;
    font-size:2.5em;
  }
  .SpAreaTitle{
    display:none;
  }
  
  
  
}
@media (max-width: 960px) {
  .MapLinkBlock .flex .links {
    width: 100%;
    margin-bottom: 40px;
  }
  
  .SpAreaTitle{
    display:inline-block;
    vertical-align:top;
  }
  .SpAreaTitle .Main{
    display:block;
    vertical-align:top;
    margin-bottom:10px;
  }
  .SpAreaTitle .Sub{
    display:block;
  }
  
  .MapLinkBlock .flex .links .AreaPin{
    display:block;
    width:45%;
    margin:5px auto;
  }
  .MapLinkBlock .flex .links .AreaPin.Main{
   width:100%!important;
   margin: 0px auto 5px auto!important;
  }
  .MapLinkBlock .flex .links .AreaPin a{
    display: block;
    padding: 10px 15px 6px;
    font-size: 16px;
    line-height: 2;
    font-weight: bold;
    transition: all 0.3s;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0px 0px 30px rgb(233, 233, 233);
    border: 2px solid #79ca29;
  }
  .MapLinkBlock .flex .links .AreaPin a .Icon {
    
  }
  .MapLinkBlock .flex .links .AreaPin a .Main{
    margin:0;
  }
  
  
}

.MapLinkBlock .flex .map {
  width: 550px;
  margin: 0;

}

@media (max-width: 960px) {
  .MapLinkBlock .flex .map {
    width: 100%;
    background: url(../map_files/img/mappu.jpg)no-repeat top left;
    background-size: auto;
    background-size: 100% auto;
    
  }
}


/*イベント説明*/
.EventOutlineItem{
  position:absolute;
  top:0%;
  left:0%;
  display:block;
  width:400px;
  height:500px;
  background: #fff;
  border-radius:20px;
  border:4px solid #b2dca7;

}
.EventOutlineItem > .innerPadding{
  position:relative;
  padding:45px;
  z-index:2;
}
.EventOutlineItem > .innerPadding:before{
  content: "";
  position:absolute;
  right:-80px;
  top:50%;
  width:100px;
  height:100px;
  margin-top:-50px;
  background: #b2dca7;
  z-index:1;
  height: calc(60px / 2 * tan(60deg));
  width: 100px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  transform: rotate(90deg);
}


.EventOutlineItem .EventOutlineTitle{
  text-align:center;
  font-size:2em;
  font-weight:bold;
  margin-bottom:20px;
}
.EventOutlineItem .Comment{
  text-align:left;
  font-size:1.0em;
  line-height:1.8;
  margin-bottom:1px;
  /*margin-bottom:20px;*/
  font-weight:600;
  height:150px;
}
.EventOutlineItem .ImageItem{
  border-radius:20px;
  overflow:hidden;
  aspect-ratio: 3/1.8;
}
.EventOutlineItem .ImageItem > img{
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}



@media (max-width: 960px) {

/*イベント説明*/
.EventOutlineItem{
  position:relative;
  display:block;
  width:100%;
  max-width:600px;
  height:auto;
  background: #fff;
  border-radius:20px;
  border:4px solid #b2dca7;
  margin:0 auto;
  margin-bottom:30px;
}
.EventOutlineItem > .innerPadding{
  position:relative;
  padding:45px;
  z-index:2;
}
.EventOutlineItem > .innerPadding:before{
  display:none;
}



  .EventOutlineItem .EventOutlineTitle{
    text-align:center;
    font-size:2em;
    font-weight:bold;
    margin-bottom:20px;
  }
  .EventOutlineItem .Comment{
    text-align:left;
    font-size:1.0em;
    line-height:1.8;
    margin-bottom:20px;
    font-weight:600;
    height:auto;
  }
  .EventOutlineItem .ImageItem{
    border-radius:20px;
    overflow:hidden;
    aspect-ratio: 3/1.8;
  }
  .EventOutlineItem .ImageItem > img{
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
  }
}





.MapLinkBlock .flex .map svg {
  filter: drop-shadow(6px 6px 10px #f4f4f4);
}
.MapLinkBlock .flex .map svg .cls-1 {
  fill: #c7e5a5;
}
.MapLinkBlock .flex .map svg .cls-2 {
  fill: #fff;
}
.MapLinkBlock .flex .map svg g .cls-1 {
  fill: #c7e5a5;
  transition: all 0.4s;
}
.MapLinkBlock .flex .map svg g:hover a {
  opacity: 1;
}
@media (min-width: 961px) {
  .MapLinkBlock .flex .map svg g:hover .cls-1 {
    /*fill: #79ca29;*/
  }
}
.MapLinkBlock .flex .map svg g.active .cls-1 {
  fill: #79ca29;
}

/* + + + + + ƒŒƒXƒ|ƒ“ƒVƒu + + + + +  */
@media screen and (max-width: 960px) {

  .MapLinkBlock .flex .map{
    display:none;
  }
  .MapLinkBlock .flex .map svg g .cls-1{
    fill: rgba(255,255,255,0)!important;
  }
  .MapLinkBlock .flex .map svg g.active .cls-1,
  .MapLinkBlock .flex .map svg g a:hover .cls-1{
    fill: rgba(121,202,41,0.2)!important;
  }
  
 

}

.Koushiki {
  color: #f0a854;
}


/*イベントマップここまで*/




/*-----------------------
common
-----------------------*/
/*
html {
  font-size: 62.5%;
  line-height: 1;
}

body {
  width: 100%;
  color: #111;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", sans-serif;
  font-weight: 400;
  font-size: 15px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  color: #382710;
}
body.active {
  overflow-y: hidden;
}
*/
a {
  transition: 0.3s;
  color: #111;
  text-decoration: none;
}

.flex {
  display: flex;
}

.inner {
  width: 92%;
  max-width: 120rem;
  margin: 0 auto;
}
@media (max-width: 960px) {
  .inner {
    width: calc(100% - 40px);
  }
}

.sp {
  display: none;
}
@media (max-width: 960px) {
  .sp {
    display: block;
  }
}

.tab {
  display: none;
}
@media (min-width: 961px) and (max-width: 1024px) {
  .tab {
    display: block;
  }
}
@media (max-width: 960px) {
  .tab {
    display: none;
  }
}

@media (min-width: 961px) and (max-width: 1024px) {
  .pc {
    display: block;
  }
}
@media (max-width: 960px) {
  .pc {
    display: none;
  }
}/*# sourceMappingURL=style.css.map */


@media (max-width: 960px) {
  #top .news .flex{
    display: block;
  }
  
  #top .news .flex .news-detail{
    display: block;
    margin-bottom:30px;
  }
  #top .news .flex .news-detail:last-child{
    margin-bottom:0;
  }
  
  #top .news .flex a{
    display: block;
  }
}