@charset "UTF-8";
/* Device Width */
/* font weight */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* common */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */
body {
  margin: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.7;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  -webkit-text-size-adjust: 100%; }

h1 {
  margin: 0;
  padding: 0;
  position: absolute;
  left: 60px;
  top: 44px; }
  @media screen and (max-width: 1024px) {
    h1 {
      left: 10px;
      top: 10px; } }
  @media only, screen and (max-width: 736px) {
    h1 {
      left: 10px;
      top: 10px; } }
  @media screen and (max-width: 414px) {
    h1 {
      left: 10px;
      top: 10px; } }
  h1 img {
    width: 754px;
    height: auto; }
    @media screen and (max-width: 1024px) {
      h1 img {
        width: 58%;
        height: auto; } }
    @media only, screen and (max-width: 736px) {
      h1 img {
        width: 60%;
        height: auto; } }
    @media screen and (max-width: 430px) {
      h1 img {
        width: 96%;
        height: auto; } }

#ctrl {
  width: 280px;
  height: 116px;
  margin: 0;
  padding: 0;
  position: fixed;
  left: inherit;
  right: 40px;
  bottom: -78px;
  z-index: 5;
  transition: bottom 0.5s;
  cursor: pointer; }
  @media screen and (max-width: 1024px) {
    #ctrl {
      /*display:none;*/
      width: 300px;
      height: 114px;
      left: 0;
      right: inherit; } }
  #ctrl img {
    width: 100%;
    height: auto; }

.pc {
  display: block; }
  @media only, screen and (max-width: 736px) {
    .pc {
      display: none; } }

.sp {
  display: none; }
  @media only, screen and (max-width: 736px) {
    .sp {
      display: block; } }

.open {
  bottom: 440px !important;
  transition: bottom 0.3s; }
  @media screen and (max-width: 1024px) {
    .open {
      bottom: 485px !important; } }

.fbox img {
  width: 37px;
  height: auto; }
  @media screen and (max-width: 1024px) {
    .fbox img {
      width: 25px;
      height: auto; } }

.map {
  width: 2530px;
  height: auto; }

#scroll {
  width: 100%;
  height: 100%;
  overflow: hidden;
  cursor: move; }
  @media screen and (max-width: 1024px) {
    #scroll {
      display: none; } }

#boxInner {
  width: 100%;
  height: 100%;
  position: relative; }
  #boxInner img {
    display: block;
    border: 0; }

/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* メガホン */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */
.icon {
  margin: 0;
  padding: 0;
  cursor: pointer;
  position: absolute;
  z-index: 2; }
  @media screen and (max-width: 1024px) {
    .icon {
      margin: 0;
      padding: 0;
      cursor: pointer;
      position: absolute;
      z-index: 2; } }

#ohenPoint {
  top: 1180px;
  left: 30px; }

#icon01 {
  top: 758px;
  left: 317px; }
  @media screen and (max-width: 1024px) {
    #icon01 {
      top: 577px;
      left: 240px; } }

#icon02 {
  top: 788px;
  left: 259px; }
  @media screen and (max-width: 1024px) {
    #icon02 {
      top: 599px;
      left: 197px; } }

#icon03 {
  top: 879px;
  left: 194px; }
  @media screen and (max-width: 1024px) {
    #icon03 {
      top: 669px;
      left: 150px; } }

#icon04 {
  top: 905px;
  left: 203px; }
  @media screen and (max-width: 1024px) {
    #icon04 {
      top: 688px;
      left: 155px; } }

#icon05 {
  top: 1021px;
  left: 222px; }
  @media screen and (max-width: 1024px) {
    #icon05 {
      top: 777px;
      left: 172px; } }

#icon06 {
  top: 1050px;
  left: 224px; }
  @media screen and (max-width: 1024px) {
    #icon06 {
      top: 799px;
      left: 172px; } }

#icon07 {
  top: 818px;
  left: 390px; }
  @media screen and (max-width: 1024px) {
    #icon07 {
      top: 622px;
      left: 297px; } }

#icon08 {
  top: 865px;
  left: 462px; }
  @media screen and (max-width: 1024px) {
    #icon08 {
      top: 658px;
      left: 353px; } }

#icon09 {
  top: 773px;
  left: 506px; }
  @media screen and (max-width: 1024px) {
    #icon09 {
      top: 588px;
      left: 386px; } }

#icon10 {
  top: 497px;
  left: 581px; }
  @media screen and (max-width: 1024px) {
    #icon10 {
      top: 379px;
      left: 442px; } }

#icon11 {
  top: 375px;
  left: 813px; }
  @media screen and (max-width: 1024px) {
    #icon11 {
      top: 287px;
      left: 617px; } }

#icon12 {
  top: 351px;
  left: 834px; }
  @media screen and (max-width: 1024px) {
    #icon12 {
      top: 268px;
      left: 633px; } }

#icon13 {
  top: 388px;
  left: 870px; }
  @media screen and (max-width: 1024px) {
    #icon13 {
      top: 296px;
      left: 664px; } }

#icon14 {
  top: 384px;
  left: 949px; }
  @media screen and (max-width: 1024px) {
    #icon14 {
      top: 292px;
      left: 723px; } }

#icon15 {
  top: 430px;
  left: 1045px; }
  @media screen and (max-width: 1024px) {
    #icon15 {
      top: 330px;
      left: 794px; } }

#icon16 {
  top: 449px;
  left: 1065px; }
  @media screen and (max-width: 1024px) {
    #icon16 {
      top: 341px;
      left: 809px; } }

/*ジョギングの部*/
#icon001 {
  top: 473px;
  left: 1048px; }
  @media screen and (max-width: 1024px) {
    #icon001 {
      top: 361px;
      left: 800px; } }

#icon17 {
  top: 467px;
  left: 1086px; }
  @media screen and (max-width: 1024px) {
    #icon17 {
      top: 354px;
      left: 827px; } }

#icon18 {
  top: 514px;
  left: 1204px; }
  @media screen and (max-width: 1024px) {
    #icon18 {
      top: 390px;
      left: 917px; } }

#icon19 {
  top: 663px;
  left: 1610px; }
  @media screen and (max-width: 1024px) {
    #icon19 {
      top: 505px;
      left: 1226px; } }

#icon20 {
  top: 833px;
  left: 1546px; }
  @media screen and (max-width: 1024px) {
    #icon20 {
      top: 633px;
      left: 1175px; } }

#icon21 {
  top: 848px;
  left: 1664px; }
  @media screen and (max-width: 1024px) {
    #icon21 {
      top: 645px;
      left: 1264px; } }

#icon22 {
  top: 805px;
  left: 1930px; }
  @media screen and (max-width: 1024px) {
    #icon22 {
      top: 612px;
      left: 1466px; } }

#icon23 {
  top: 1008px;
  left: 1871px; }
  @media screen and (max-width: 1024px) {
    #icon23 {
      top: 767px;
      left: 1422px; } }

#icon24 {
  top: 1201px;
  left: 1973px; }
  @media screen and (max-width: 1024px) {
    #icon24 {
      top: 914px;
      left: 1500px; } }

#icon25 {
  top: 1313px;
  left: 2096px; }
  @media screen and (max-width: 1024px) {
    #icon25 {
      top: 999px;
      left: 1591px; } }

#icon26 {
  top: 1328px;
  left: 2148px; }
  @media screen and (max-width: 1024px) {
    #icon26 {
      top: 1010px;
      left: 1633px; } }

#icon27 {
  top: 1383px;
  left: 2177px; }
  @media screen and (max-width: 1024px) {
    #icon27 {
      top: 1053px;
      left: 1656px; } }

#icon28 {
  top: 1279px;
  left: 2214px; }
  @media screen and (max-width: 1024px) {
    #icon28 {
      top: 974px;
      left: 1683px; } }

#icon29 {
  top: 1309px;
  left: 2236px; }
  @media screen and (max-width: 1024px) {
    #icon29 {
      top: 995px;
      left: 1698px; } }

#icon30 {
  top: 1279px;
  left: 2251px; }
  @media screen and (max-width: 1024px) {
    #icon30 {
      top: 975px;
      left: 1712px; } }

/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* エイドステーション */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */
.aid {
  margin: 0;
  padding: 0;
  cursor: pointer;
  position: absolute;
  z-index: 2;
  transform: scale(0.5);
  -webkit-transform: scale(0.5); }
  @media screen and (max-width: 1024px) {
    .aid {
      margin: 0;
      padding: 0;
      cursor: pointer;
      position: absolute;
      z-index: 2;
      transform: scale(0.5) !important;
      -webkit-transform: scale(0.5) !important; } }
  @media screen and (max-width: 1024px) {
    .aid img {
      width: 44px;
      height: auto; } }

#aidCont {
  background-color: #fff; }
  #aidCont h1 {
    min-height: 40px;
    margin: 0 0 10px;
    padding: 8px 0 0 60px;
    font-size: 16px;
    color: #0091da;
    background: url(../img/bg_aid.gif) left top no-repeat;
    position: inherit; }
    @media screen and (max-width: 1024px) {
      #aidCont h1 {
        min-height: 40px;
        margin: 0 0 10px;
        padding: 8px 0 0 60px;
        font-size: 16px;
        color: #ee0084;
        background: url(../img/bg_aid.gif) left top no-repeat;
        background-size: 42px auto;
        position: inherit; } }
  #aidCont table {
    width: 100%;
    margin: 0 0 10px;
    border-collapse: separate;
    border-spacing: 5px; }
    #aidCont table th, #aidCont table td {
      padding: 5px 10px;
      vertical-align: top; }
    #aidCont table th {
      width: 30%;
      text-align: left;
      background-color: #eee; }
  #aidCont p {
    margin: 0 0 10px;
    padding: 0;
    font-size: 14px; }
    @media screen and (max-width: 1024px) {
      #aidCont p {
        margin: 0 0 10px;
        padding: 0;
        font-size: 14px; } }
  #aidCont ul {
    display: flex;
    width: 560px;
    margin: 0;
    padding: 0;
    list-style: none;
    flex-wrap: wrap; }
    #aidCont ul li {
      width: 100px;
      margin: 0 10px 10px 0; }
      #aidCont ul li img {
        width: 100%;
        height: auto; }

#aid00 {
  top: 749px;
  left: 262px; }
  @media screen and (max-width: 1024px) {
    #aid00 {
      top: 567px;
      left: 197px; } }

#aid01 {
  top: 1021px;
  left: 180px; }
  @media screen and (max-width: 1024px) {
    #aid01 {
      top: 774px;
      left: 136px; } }

#aid02 {
  top: 859px;
  left: 370px; }
  @media screen and (max-width: 1024px) {
    #aid02 {
      top: 652px;
      left: 279px; } }

#aid03 {
  top: 643px;
  left: 574px; }
  @media screen and (max-width: 1024px) {
    #aid03 {
      top: 488px;
      left: 436px; } }

#aid04 {
  top: 357px;
  left: 666px; }
  @media screen and (max-width: 1024px) {
    #aid04 {
      top: 271px;
      left: 505px; } }

#aid05 {
  top: 437px;
  left: 1005px; }
  @media screen and (max-width: 1024px) {
    #aid05 {
      top: 337px;
      left: 765px; } }

#aid06 {
  top: 491px;
  left: 1334px; }
  @media screen and (max-width: 1024px) {
    #aid06 {
      top: 370px;
      left: 1012px; } }

#aid06-02 {
  top: 605px;
  left: 1108px; }
  @media screen and (max-width: 1024px) {
    #aid06-02 {
      top: 458px;
      left: 840px; } }

#aid07 {
  top: 626px;
  left: 1541px; }
  @media screen and (max-width: 1024px) {
    #aid07 {
      top: 475px;
      left: 1170px; } }

#aid07-02 {
  top: 736px;
  left: 1400px; }
  @media screen and (max-width: 1024px) {
    #aid07-02 {
      top: 554px;
      left: 1064px; } }

#aid08 {
  top: 744px;
  left: 1567px; }
  @media screen and (max-width: 1024px) {
    #aid08 {
      top: 566px;
      left: 1190px; } }

#aid09 {
  top: 867px;
  left: 1549px; }
  @media screen and (max-width: 1024px) {
    #aid09 {
      top: 657px;
      left: 1175px; } }

#aid10 {
  top: 935px;
  left: 1906px; }
  @media screen and (max-width: 1024px) {
    #aid10 {
      top: 711px;
      left: 1448px; } }

#aid11 {
  top: 1061px;
  left: 1998px; }
  @media screen and (max-width: 1024px) {
    #aid11 {
      top: 805px;
      left: 1516px; } }

#aid12 {
  top: 1224px;
  left: 1921px; }
  @media screen and (max-width: 1024px) {
    #aid12 {
      top: 928px;
      left: 1458px; } }

#aid13 {
  top: 1276px;
  left: 2014px; }
  @media screen and (max-width: 1024px) {
    #aid13 {
      top: 969px;
      left: 1527px; } }

#aid14 {
  top: 1351px;
  left: 2192px; }
  @media screen and (max-width: 1024px) {
    #aid14 {
      top: 1028px;
      left: 1665px; } }

#aid15 {
  top: 1351px;
  left: 2192px; }
  @media screen and (max-width: 1024px) {
    #aid15 {
      top: 1028px;
      left: 1665px; } }

/*エイドステーション提供品一覧*/
.offer {
  width: 2530px;
  margin: 0 0 0 30px;
  padding: 30px 0;
  overflow: hidden; }
  @media screen and (max-width: 1024px) {
    .offer {
      width: 1891px;
      margin: 0 0 0 30px;
      padding: 30px 0;
      overflow: hidden; } }
  .offer h2 {
    margin: 0 30px 20px 0;
    padding: 0 0 10px;
    min-height: 24px;
    font-size: 22px;
    line-height: 1.3;
    border-bottom: solid 5px #009d24; }
    @media screen and (max-width: 1024px) {
      .offer h2 {
        margin: 0 0 20px;
        padding: 0 0 10px;
        min-height: 24px;
        font-size: 18px;
        line-height: 1.3;
        border-bottom: solid 5px #009d24; } }
  .offer .flex-box {
    display: flex; }
    .offer .flex-box div {
      width: 420px; }
      .offer .flex-box div:first-of-type {
        margin: 0 40px 0 0; }
      .offer .flex-box div a {
        color: #0052A6; }
        .offer .flex-box div a:hover {
          color: #DB0D08; }
        .offer .flex-box div a figure {
          margin: 0; }
        .offer .flex-box div a img {
          width: 100%;
          height: auto; }
  .offer ul {
    margin: 0;
    padding: 0;
    list-style: none; }
    @media screen and (max-width: 1024px) {
      .offer ul {
        margin: 0;
        padding: 0;
        list-style: none; } }
    .offer ul:after {
      content: "";
      clear: both;
      display: block; }
    .offer ul li {
      width: 200px;
      height: 258px;
      margin: 0 30px 30px 0;
      float: left; }
      @media screen and (max-width: 1024px) {
        .offer ul li {
          width: 168px;
          height: inherit;
          min-height: 200px;
          margin: 0 20px 20px 0;
          float: left; } }
      .offer ul li img {
        width: 100%;
        height: auto; }
      .offer ul li h3 {
        margin: 5px 0;
        padding: 0;
        font-size: 14px;
        color: #008edc;
        border-bottom: solid 1px #ccc; }
        @media screen and (max-width: 1024px) {
          .offer ul li h3 {
            margin: 5px 0;
            padding: 0;
            font-size: 12px;
            color: #008edc;
            border-bottom: solid 1px #ccc; } }
      .offer ul li p {
        margin: 0;
        padding: 0;
        font-size: 14px;
        line-height: 1.5; }
        @media screen and (max-width: 1024px) {
          .offer ul li p {
            margin: 0;
            padding: 0;
            font-size: 12px;
            line-height: 1.5; } }

#modal-overlay {
  display: none;
  z-index: 900;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 120%;
  background-color: rgba(0, 0, 0, 0.75);
  background: rgba(0, 0, 0, 0.75);
  /*IE9*/
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99000000,EndColorStr=#99000000);
  /*IE8以下用*/ }

.fancybox-image {
  max-width: 672px; }

#scrollSP {
  display: none; }
  @media screen and (max-width: 1024px) {
    #scrollSP {
      display: block; } }

#modal-content {
  width: 50%;
  height: 100vh;
  margin: auto;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 999; }
  @media screen and (max-width: 1024px) {
    #modal-content {
      width: 90%;
      height: 60%;
      margin: auto;
      position: fixed;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      z-index: 999;
      text-align: center; } }
  #modal-content img {
    width: auto;
    height: 100%; }
    @media screen and (max-width: 1024px) {
      #modal-content img {
        width: auto;
        height: 100%; } }

/* --------------------------------------------------------------------------------------------------------------------------------------------- */
/* 見どころ */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */
.point {
  margin: 0;
  padding: 0;
  cursor: pointer;
  position: absolute;
  z-index: 2;
  transform: scale(0.5);
  -webkit-transform: scale(0.5); }
  @media screen and (max-width: 1024px) {
    .point {
      margin: 0;
      padding: 0;
      cursor: pointer;
      position: absolute;
      z-index: 2;
      transform: scale(0.5) !important;
      -webkit-transform: scale(0.5) !important; } }
  .point .pointBox img {
    width: auto;
    height: 66px; }
    @media screen and (max-width: 1024px) {
      .point .pointBox img {
        height: 56px; } }

#pointCont figure {
  width: 100%;
  margin: 0 auto 5px; }
  #pointCont figure img {
    width: 100%;
    height: auto;
    vertical-align: bottom; }
#pointCont .caption {
  margin: 0 0 20px;
  padding: 0 20px 0 0;
  font-size: 13px;
  text-align: right; }
#pointCont .flex-box {
  display: flex; }
  #pointCont .flex-box div {
    padding: 0 20px 0 0;
    flex: 1; }
    #pointCont .flex-box div h1 {
      font-size: 24px;
      color: #34af35;
      position: static; }
      #pointCont .flex-box div h1 span {
        font-size: 20px;
        color: #000; }
    #pointCont .flex-box div p {
      margin: 0;
      font-size: 15px; }
  #pointCont .flex-box .num {
    width: 54px;
    margin: 0 10px 0 0; }
    #pointCont .flex-box .num img {
      width: 100%;
      height: auto;
      vertical-align: bottom; }

#point01 {
  top: 768px;
  left: 100px; }
  @media screen and (max-width: 1024px) {
    #point01 {
      top: 578px;
      left: 60px; } }

#point02 {
  top: 808px;
  left: 44px; }
  @media screen and (max-width: 1024px) {
    #point02 {
      top: 610px;
      left: 18px; } }

#point03 {
  top: 421px;
  left: 1146px; }
  @media screen and (max-width: 1024px) {
    #point03 {
      top: 315px;
      left: 862px; } }

#point04 {
  top: 898px;
  left: 1830px; }
  @media screen and (max-width: 1024px) {
    #point04 {
      top: 680px;
      left: 1385px; } }

#point05 {
  top: 1371px;
  left: 2147px; }
  @media screen and (max-width: 1024px) {
    #point05 {
      top: 1040px;
      left: 1626px; } }