@charset "UTF-8";
/* Vendor */
#mappage-wrap { padding: 0 3%; max-width: 1600px; margin: 0 auto; }
@media screen and (max-width: 959px) { #mappage-wrap { padding: 0 10px; } }
#mappage-wrap img { width: 100%; }
#mappage-wrap #map { /*js上スタイル*/ }
#mappage-wrap #map #mappage-hero { background: #0778be; position: relative; width: 100%; height: 310px; margin-bottom: 35px; }
@media screen and (max-width: 959px) { #mappage-wrap #map #mappage-hero { height: 255px; } }
@media screen and (max-width: 559px) { #mappage-wrap #map #mappage-hero { height: 190px; margin-bottom: 30px; } }
#mappage-wrap #map #mappage-hero .image { width: 754px; position: relative; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); }
@media screen and (max-width: 959px) { #mappage-wrap #map #mappage-hero .image { width: 500px; } }
@media screen and (max-width: 559px) { #mappage-wrap #map #mappage-hero .image { display: none; } }
#mappage-wrap #map #mappage-hero .image-sp { display: none; width: 280px; position: relative; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); }
@media screen and (max-width: 559px) { #mappage-wrap #map #mappage-hero .image-sp { display: block; } }
#mappage-wrap #map .sec-ttlbox { display: flex; flex-direction: column; }
#mappage-wrap #map .sec-ttlbox .sec-ttl { order: 2; font-size: 20px; color: #313882; font-weight: 700; text-align: center; margin-bottom: 20px; }
@media screen and (max-width: 959px) { #mappage-wrap #map .sec-ttlbox .sec-ttl { font-size: 18px; } }
@media screen and (max-width: 559px) { #mappage-wrap #map .sec-ttlbox .sec-ttl { font-size: 17px; } }
#mappage-wrap #map .sec-ttlbox div { order: 1; margin: 0 auto 10px; }
#mappage-wrap #map .sec-ttlbox div.ic-bag { width: 60px; }
#mappage-wrap #map .sec-ttlbox div.ic-human { margin: 0 auto; width: 100px; }
#mappage-wrap #map .lead { font-size: 15px; line-height: 1.5; font-weight: 700; text-align: center; }
@media screen and (max-width: 767px) { #mappage-wrap #map .lead { text-align: left; } }
@media screen and (max-width: 559px) { #mappage-wrap #map .lead { font-size: 14px; } }
#mappage-wrap #map #maps { width: 100%; height: 600px; margin: 40px auto; }
@media screen and (max-width: 559px) { #mappage-wrap #map #maps { height: 440px; margin: 20px auto; } }
#mappage-wrap #map #region-navi { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 5px; padding: 20px 5px; border-top: 1px solid #313882; border-bottom: 1px solid #313882; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-navi { padding: 20px 5px 0; } }
#mappage-wrap #map #region-navi li { width: 15.2%; text-align: center; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-navi li { width: 33.2%; margin-bottom: 20px; } }
@media screen and (max-width: 440px) { #mappage-wrap #map #region-navi li { width: 49%; } }
#mappage-wrap #map #region-navi li a { display: block; color: #313882; position: relative; font-weight: 700; }
#mappage-wrap #map #region-navi li a:after { content: ""; display: inline-block; margin-left: 5px; width: 7px; height: 5px; background-size: contain; background-image: url(../img/common/arrow-down.svg); vertical-align: middle; }
#mappage-wrap #map #region-list .region { border-top: 1px dotted #444; padding-top: 20px; margin-top: 20px; }
#mappage-wrap #map #region-list .region:first-child { border-top: none; margin-top: 30px; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-list .region:first-child { margin-top: 20px; } }
@media screen and (max-width: 440px) { #mappage-wrap #map #region-list .region:first-child { margin-top: 10px; } }
#mappage-wrap #map #region-list .region ul { display: flex; flex-wrap: wrap; padding-bottom: 10px; }
#mappage-wrap #map #region-list .region ul li { /*地区別詳細*/ padding: 10px 0 10px 0; width: 24%; margin-right: calc(4% / 3); margin-bottom: 5px; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-list .region ul li { width: 32%; margin-right: 2%; } }
@media screen and (max-width: 620px) { #mappage-wrap #map #region-list .region ul li { width: 49%; margin-right: 2%; } }
@media screen and (max-width: 360px) { #mappage-wrap #map #region-list .region ul li { width: 100%; margin-right: 0; } }
#mappage-wrap #map #region-list .region ul li:nth-child(4n) { margin-right: 0; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-list .region ul li:nth-child(4n) { margin-right: 2%; }
  #mappage-wrap #map #region-list .region ul li:nth-child(3n) { margin-right: 0; } }
@media screen and (max-width: 620px) { #mappage-wrap #map #region-list .region ul li:nth-child(3n) { margin-right: 0; }
  #mappage-wrap #map #region-list .region ul li:nth-child(even) { margin-right: 0; }
  #mappage-wrap #map #region-list .region ul li:nth-child(odd) { margin-right: 2%; } }
@media screen and (max-width: 360px) { #mappage-wrap #map #region-list .region ul li:nth-child(odd) { margin-right: 0; } }
#mappage-wrap #map #region-list .region ul li a { display: flex; align-items: center; }
#mappage-wrap #map #region-list .region ul li a:hover { opacity: 0.8; }
#mappage-wrap #map #region-list .region ul li .image { width: 60px; height: 60px; margin-right: 1rem; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-list .region ul li .image { width: 50px; height: 50px; } }
@media screen and (max-width: 440px) { #mappage-wrap #map #region-list .region ul li .image { width: 40px; height: 40px; } }
#mappage-wrap #map #region-list .region ul li .image img { width: 60px; height: 60px; border-radius: 50%; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-list .region ul li .image img { width: 50px; height: 50px; } }
@media screen and (max-width: 440px) { #mappage-wrap #map #region-list .region ul li .image img { width: 40px; height: 40px; } }
#mappage-wrap #map #region-list .region ul li .name h4 { font-size: 13px; line-height: 18px; font-weight: bold; color: #444; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-list .region ul li .name h4 { font-size: 12px; } }
#mappage-wrap #map #region-list .region ul li .name p.location { font-size: 12px; line-height: 16px; color: #444; }
#mappage-wrap #map #region-list .region ul li .name p.location:before { content: "["; padding-right: 2px; }
#mappage-wrap #map #region-list .region ul li .name p.location:after { content: "]"; padding-left: 2px; }
#mappage-wrap #map #region-list .region ul li .name p.date { font-size: 13px; line-height: 13px; color: #313882; letter-spacing: 1px; margin-bottom: 5px; }
@media screen and (max-width: 959px) { #mappage-wrap #map #region-list .region ul li .name p.date { font-size: 12px; line-height: 12px; letter-spacing: 0; margin-bottom: 3px; } }
#mappage-wrap #map #region-list .region ul li .name p.date span:nth-of-type(1):after { content: "開催"; padding-left: 4px; font-size: 12px; line-height: 12px; }
@media screen and (max-width: 959px) { #mappage-wrap #map #region-list .region ul li .name p.date span:nth-of-type(1):after { font-size: 11px; line-height: 11px; } }
#mappage-wrap #map #region-list .region ul li .name p.date span:nth-of-type(2) { color: #d50d18; margin-left: 8px; letter-spacing: -1px; font-size: 12px; line-height: 12px; }
#mappage-wrap #map #region-list .region h3 { /*地区名*/ font-size: 17px; color: #313882; font-weight: bold; letter-spacing: 2px; margin-bottom: 10px; }
@media screen and (max-width: 860px) { #mappage-wrap #map #region-list .region h3 { font-size: 15px; } }
#mappage-wrap #map #region-list p.coming { font-size: 13px; }
#mappage-wrap #map .iw-wrappe { max-width: 200px; display: flex; align-items: center; flex-direction: column; }
#mappage-wrap #map .iw-image, #mappage-wrap #map .iw-image img { width: 100%; height: 115px; margin-top: 5px; }
#mappage-wrap #map .iw-name { font-size: 12px; font-weight: bold; line-height: 17px; margin-top: 8px; }
#mappage-wrap #map .iw-crew { font-size: 11px; text-align: left; line-height: 16px; padding-top: 3px; margin-top: 3px; border-top: 1px solid #ddd; }
#mappage-wrap #mappage-footer { border-top: 1px solid #313882; padding: 20px 0 25px; margin-top: 20px; }
@media screen and (max-width: 660px) { #mappage-wrap #mappage-footer { padding: 20px 0 0; } }
#mappage-wrap #mappage-footer .mpft { border-bottom: 1px solid #313882; padding: 0 0 20px; margin-bottom: 20px; }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .mpft { padding: 0 0 10px; } }
#mappage-wrap #mappage-footer .mpft .mpft-box { display: flex; align-items: center; }
@media screen and (max-width: 767px) { #mappage-wrap #mappage-footer .mpft .mpft-box { flex-direction: column; } }
#mappage-wrap #mappage-footer .mpft .mpft-box .tosite-top a { display: flex; align-items: center; }
#mappage-wrap #mappage-footer .mpft .mpft-box .tosite-top a span:nth-of-type(1) { width: 90px; height: 20px; margin-right: 5px; }
#mappage-wrap #mappage-footer .mpft .mpft-box .tosite-top a span:nth-of-type(2) { font-size: 13px; color: #005194; }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .mpft .mpft-box .tosite-top a span:nth-of-type(2) { font-size: 12px; } }
#mappage-wrap #mappage-footer .mpft .mpft-box .vertical-line { width: 1px; height: 35px; background: #0a5294; margin: 0 25px 0 20px; display: block; }
@media screen and (max-width: 767px) { #mappage-wrap #mappage-footer .mpft .mpft-box .vertical-line { width: 100%; height: 1px; margin: 20px auto; } }
#mappage-wrap #mappage-footer .mpft .mpft-box .mpft-eventname a { display: flex; align-items: center; }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .mpft .mpft-box .mpft-eventname a { flex-direction: column; } }
#mappage-wrap #mappage-footer .mpft .mpft-box .mpft-eventname a span:nth-of-type(1) { width: 176px; height: 17px; position: relative; top: -2px; margin-right: 10px; }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .mpft .mpft-box .mpft-eventname a span:nth-of-type(1) { margin: 0 auto 2px; } }
#mappage-wrap #mappage-footer .mpft .mpft-box .mpft-eventname a span:nth-of-type(2) { font-size: 13px; color: #0068b6; }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .mpft .mpft-box .mpft-eventname a span:nth-of-type(2) { font-size: 12px; } }
#mappage-wrap #mappage-footer .logo-area { width: 100%; display: flex; flex-direction: column; /*.kyoryoku-kyosan { display: flex; align-items: center; @media screen and (max-width:1150px) { flex-direction: column; align-items: flex-start; }
}*/ }
#mappage-wrap #mappage-footer .logo-area .logo-box { display: flex; align-items: center; /*&.kyoryoku { margin-right: 15px; @media screen and (max-width:$break-thistbout) { margin: 0; }
}
&.kyosan { @media screen and (max-width:1150px) { margin-top: 20px; } .vertical-lines { width: 1px; height: 35px; background: #0a5294; display: block; }
}*/ }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .logo-area .logo-box { justify-content: center; } }
#mappage-wrap #mappage-footer .logo-area .logo-box p { width: 35px; font-size: 10px; line-height: 1; }
#mappage-wrap #mappage-footer .logo-area .logo-box ul { flex: 1; display: flex; align-items: center; flex-wrap: wrap; }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .logo-area .logo-box ul { flex: inherit; } }
#mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-umitonihon { width: 114px; }
#mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-cfb { width: 66px; }
#mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-zaidan { width: 123px; }
#mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-umisakura { width: 137px; }
@media screen and (max-width: 559px) { #mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-umitonihon { width: 50px; }
  #mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-cfb { width: 35px; }
  #mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-zaidan { width: 73px; }
  #mappage-wrap #mappage-footer .logo-area .logo-box ul li.logo-map-umisakura { width: 77px; } }
#mappage-wrap #mappage-footer .logo-area .logo-box ul li:not(:last-child) { margin-right: 15px; }
@media screen and (max-width: 767px) { #mappage-wrap #mappage-footer .logo-area .logo-box ul li:not(:last-child) { margin-right: 10px; } }
#mappage-wrap #mappage-footer .logo-area .logo-box ul li a { display: block; }
#mappage-wrap #mappage-footer .logo-area .logo-box ul li a:hover { opacity: .7; }
#mappage-wrap #mappage-footer .logo-area .logo-box.kyosai { margin-bottom: 15px; }
#mappage-wrap #mappage-footer .logo-area .logo-box.kyosai p { margin-right: 5px; }
@media screen and (max-width: 767px) { #mappage-wrap #mappage-footer .logo-area .logo-box.kyosai p { margin-right: 5px; } }
#mappage-wrap #mappage-footer .logo-area .logo-box.kyosai ul li:not(:last-child) { margin-right: 30px; }
@media screen and (max-width: 767px) { #mappage-wrap #mappage-footer .logo-area .logo-box.kyosai ul li:not(:last-child) { margin-right: 10px; } }