@charset "UTF-8";
@media screen and (min-width: 768px) {
  .content {
    border-top: solid 10px #e9e9e9;
    margin-top: 65px;
  }
}
@media screen and (max-width: 768px) {
  .content {
    border-top: solid 10px #e9e9e9;
    margin-top: 50px;
  }
}
/*topスライド*/
.slideshow {
  position: relative;
  width: 100%;
  height: 80vh;
  overflow: hidden;
  margin: 0 auto;
}
.slideshow-image {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0;
  background: no-repeat 50% 50%;
  background-size: cover;
  -webkit-animation-name: tsuki;
  animation-name: tsuki;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-duration: 20s;
  animation-duration: 20s;
  opacity: 1;
  transform: scale(1.2);
}
.slideshow-image:nth-child(1) {
  -webkit-animation-name: tsuki-1;
  animation-name: tsuki-1;
  z-index: 77;
}
.slideshow-image:nth-child(2) {
  -webkit-animation-name: tsuki-2;
  animation-name: tsuki-2;
  z-index: 75;
}
.slideshow-image:nth-child(3) {
  -webkit-animation-name: tsuki-3;
  animation-name: tsuki-3;
  z-index: 73;
}
.slideshow-image:nth-child(4) {
  -webkit-animation-name: tsuki-4;
  animation-name: tsuki-4;
  z-index: 70;
}
@-webkit-keyframes tsuki-1 {
  0% {
    opacity: 1;
    transform: scale(1.2);
  }
  1.5625% {
    opacity: 1;
  }
  23.4375% {
    opacity: 1;
  }
  26.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
  98.4375% {
    opacity: 0;
    transform: scale(1.2117647059);
  }
  100% {
    opacity: 1;
  }
}
@keyframes tsuki-1 {
  0% {
    opacity: 1;
    transform: scale(1.2);
  }
  1.5625% {
    opacity: 1;
  }
  23.4375% {
    opacity: 1;
  }
  26.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
  98.4375% {
    opacity: 0;
    transform: scale(1.2117647059);
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes tsuki-2 {
  23.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  26.5625% {
    opacity: 1;
  }
  48.4375% {
    opacity: 1;
  }
  51.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}
@keyframes tsuki-2 {
  23.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  26.5625% {
    opacity: 1;
  }
  48.4375% {
    opacity: 1;
  }
  51.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}
@-webkit-keyframes tsuki-3 {
  48.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  51.5625% {
    opacity: 1;
  }
  73.4375% {
    opacity: 1;
  }
  76.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}
@keyframes tsuki-3 {
  48.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  51.5625% {
    opacity: 1;
  }
  73.4375% {
    opacity: 1;
  }
  76.5625% {
    opacity: 0;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}
@-webkit-keyframes tsuki-4 {
  73.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  76.5625% {
    opacity: 1;
  }
  98.4375% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
@keyframes tsuki-4 {
  73.4375% {
    opacity: 1;
    transform: scale(1.2);
  }
  76.5625% {
    opacity: 1;
  }
  98.4375% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
h1 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  z-index: 99;
  text-align: center;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 3em;
  font-weight: 400;
  text-transform: uppercase;
  color: #FFFFFF;
  text-shadow: 2px 2px 3px #000000;
  /*box-sizing: content-box;
  width: 25%;
  
  
  background-color: rgba(255, 255, 255, 0.75);
  box-shadow: 0 1em 2em -1em rgba(0, 0, 0, 0.5);*/
  padding: 0.8em 0.8em;
  line-height: 1.5;
}
h1 small {
  display: block;
  text-transform: lowercase;
  font-size: 0.5em;
}
h1 small:first-child {
  border-bottom: 2px solid rgba(255, 255, 255, 0.25);
  padding-bottom: 1.5em;
}
h1 small:last-child {
  border-top: 2px solid rgba(255, 255, 255, 0.25);
  padding-top: 1.5em;
}
/*intoro*/
.intro {
  width: 100%;
  height: 100%;
  margin: 0px;
  padding: 20px 0 60px 0px;
  background-image: url(../images/top/b1.jpg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}
.intro .wrap {
  position: relative;
}
.intro h3 {
  font-size: 32px;
  line-height: 2;
  margin: 0px 0px 10px 0px;
  text-shadow: 1px 1px 2px #808080;
}
.intro p {
  width: 1000px;
  font-size: 16px;
  color: #000066;
  line-height: 1.9;
  padding: 10px 10px 0px 10px;
  position: relative;
  text-align: center;
}
/*お知らせ*/
.news {
  padding: 30px 0 80px 10px;
}
.news .wrap {
  position: relative;
}
.news h2 {
  margin-bottom: 15px;
}
.news ul li {
  float: none;
  width: 1000px;
  padding-top: 15px;
  position: relative;
}
.news ul li .date {
  padding-left: 10px;
  display: inline-block;
  vertical-align: middle;
  border-left: #003399 solid 3px;
  font-size: 23px;
  line-height: 15px;
}
.news h3 {
  font-size: 19px;
  line-height: 2;
  margin-top: 13px;
}
.news ul li {
  font-size: 14px;
  line-height: 2;
  margin-top: 13px;
}
.news .link-list {
  position: absolute;
  right: 0;
  top: 60px;
}
.news .link-list a {
  display: inline-block;
  padding-right: 45px;
  font-size: 15px;
  background: url(../images/common/link_2.png) no-repeat right 10px center;
  background-size: 22px auto;
}
.news p {
  width: 1000px;
  line-height: 1.8;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  position: relative;
}

.news p a{color:#F3573A;;}

.news a:hover{color:#003399; text-decoration:underline;}

/*施設案内*/
.facility {
  padding: 30px 0 10px 7px;
  background-color: #efefef;
}
.facility h2 {
  margin-bottom: 50px;
}

.guide a{color:#F3573A; text-decoration:none;}
.guide {padding: 10px 0 50px 7px;
}
.guide h2 {
  margin: 10px 0 5px 0;
  box-sizing: border-box;
  align-items: center;
}
.guide-flex {
  display: flex;
}

.guide div {
  margin: 5px 0 0 5px;
}


/*ご利用料金*/
.price a{color:#F3573A; text-decoration:none;}
.price {
  padding: 30px 0 50px 5px;
}
.price h2 {
  margin-bottom: 50px;
}

/*売店料金*/
.stand h2 {
border-left: #003399 solid 5px;
font-size: 20px;
line-height: 2;
margin: 20px 0px 5px 10px;
padding: 0px 0px 0px 10px;
}

.stand_price{
  display: flex;
  flex-wrap: wrap;
  margin: 10px 0px 30px 0px;
}

.stand_container {
  padding: 6px;
  width: 18%;
  background-color: #fff;
}

.stand_container:not(:nth-child(5n+5)) {
  margin-right: 0.5%;
  margin-left: 0.5%;
}

.stand_container:nth-child(n+6) {
  margin-top: 15px;
}

.stand_container h3 {
  padding: 5px;
  background-color:#6a7070;
  color: #ffffff;
  text-align: center;
  height:70px;
  line-height:70px;
  
}

.stand_container span {
  font-size: 0.7rem;
  padding: 0px 0px 0px 0px;
}

.stand_container p {
  background-color: #FFFFFF;
  border: #5F5D5D solid 1px;
  text-align: center;
  padding: 6px 3px 6px 3px;
  height:50px;
}
.stand_container img {
  width: 75px;
}

figcaption {
  background-color: #6a7070;
  color: #fff;
  font: italic smaller sans-serif;
  margin: 10px 30px;
  padding: 10px;
  text-align: center;
}

/*お問い合わせ*/
.contact {
  padding: 30px 0 40px 0px;
  background-color: #efefef;
}
.contact .wrap {
  position: relative;
}
.contact h2 {
  margin-bottom: 40px;
}
.contact p {
  font-size: 1.0rem;
  margin: 0px 0 10px 0;
  text-align: center;
}

/*よくある質問*/
.faq {
  padding: 0px 0 10px 0px;
}

.faq h2 {
border-left: #003399 solid 3px;
font-size: 20px;
line-height: 2;
margin: 30px 0px 20px 0px;
padding: 0px 0px 0px 10px;
}

.faq P {line-height:1.0; padding-top:10px; padding-left:5px; padding-right:5px;text-align: left;}

.faq .link {
  display: flex;
  justify-content: flex-end;
 margin: 20px 0px 0px 0px;
}
.faq .link a {
  display: inline-block;
  padding-right: 45px;
  font-size: 15px;
  background: url(../images/common/link_2.png) no-repeat right 10px center;
  background-size: 22px auto;
  }

.faq a:hover{color:#003399; text-decoration:underline;}


/*アクセス*/
.access {
  padding: 40px 0 0px 0px;
}
.access h2 {
  margin-bottom: 30px;
}
.access h3 {
  font-size: 1.2rem;
  margin: 10px 0 5px 10px;
}
.access p {
  font-size: 1.0rem;
  padding: 0 0 10px 10px;
}
.access .map-box {
  position: relative;
  margin: 60px 0 70px;
}
.access .bt-block {
  width: 800px;
  margin: 0 auto;
}
.slope {
  display: flex;
}
.slope div {
  margin: 20px 0 0 10px;
}
@media screen and (max-width: 767px) {
  .intro {
    padding: 5px 0px 10px;
  }
  .intro h3 {
    font-size: 23px;
    line-height: 2;
    margin: 0px 0 10px 0;
  }
  .intro p {
    width: auto;
    font-size: 14px;
    line-height: 1.9;
    margin: 0px;
    padding: 0px;
    text-align: left;
  }
  .news {
    padding: 20px 0 0px;
  }
  .news h2 {
    margin-bottom: 20px;
  }
  .news ul {
    margin-bottom: 30px;
  }
  .news ul li {
    float: none;
    width: 100%;
    padding: 15px 0 10px;
    border-bottom: #c5c5c5 solid 2px;
  }
  .news ul li:first-child {
    padding-right: 0;
  }
  .news ul li:last-child {
    padding-left: 0;
  }
  .news ul li:nth-child(2) {
    padding: 15px 0 10px;
    width: 100%;
  }
  .news ul li:nth-child(2):before, .news ul li:nth-child(2):after {
    display: none;
  }
  .news ul li .date {
    display: block;
    border-left: #003399 solid 2px;
    font-size: 14px;
    line-height: 20px;
    float: left;
  }
  .news h3 {
    font-size: 18px;
    margin-top: 30px;
  }
  .news ul li {
    font-size: 14px;
    margin-top: 30px;
  }
  .news p {
    width: auto;
  }
  .news .link-list {
    position: static;
    top: 0;
  }
  .news .link-list a {
    display: block;
    width: 100%;
    padding: 0;
    background: none;
  }
  .news .link-list a:before {
    top: 0;
  }
  .news .link-list a:after {
    bottom: 0;
  }
  .news .link-list a span {
    font-size: 13px;
    line-height: 45px;
    background: url(../images/common/sp/link_2.png) no-repeat transparent;
    background-size: 28px auto;
    background-position: right 10px center;
    text-align: right;
    padding-right: 45px;
    display: block;
    color: #003399;
  }
  .facility {
    padding: 50px 0 10px;
  }
  .facility h2 {
    margin-bottom: 30px;
  }
  .facility .right {
    margin-top: 20px;
  }
	
　.guide {padding: 10px 0 0px 7px;
}
.guide h2 {
  margin: 10px 0 10px 0;
  
}
.guide-flex {
  display: flex;
}

.guide div {
  margin: 5px 0 0 3px;
}	
	
/*売店料金*/
.stand h2 {
border-left: #003399 solid 3px;
font-size: 0.9rem;
margin: 20px 0px 5px 5px;
padding: 0px 0px 0px 10px;
}	
	
.stand_container {
  padding: 2px;
  width: 47%;
}

.stand_container:not(:nth-child(2n+2)) {
  margin-right: 0.5%;
  margin-left: 0.5%;
}

.stand_container:nth-child(n+3) {
  margin-top: 10px;
}

.stand_container h3 {
  padding: 2px;
  font-size: 0.8rem;
  height:72px;
  line-height:72px;
  
}

.stand_container span {
  font-size: 0.7rem;
}

.stand_container p {
  padding:5px 3px 15px 3px;
  height:48px;
  font-size: 0.9rem;
}
.stand_container img {
  width: 60px;
}

	
	
  /*お問い合わせ*/
  .contact {
    padding: 10px 0 10px 5px;
  }
  .contact h2 {
    margin-bottom: 50px;
  }
  .contact p {
    font-size: 0.9rem;
    text-align: left;
  }

.faq {
  width: auto;
  padding: 0px 0 5px 0px;
}	

.faq h2 {
font-size: 18px;
margin: 0px 0px 20px 0px;
padding: 0px 0px 0px 10px;
}	

.faq p {line-height:1.3;padding-top:3px;padding-left:3px; padding-right:3px;}		
	
.faq .link {
    position: static;
    top: 0;
  }
  .faq .link a {
    display: block;
    width: 100%;
    padding: 0;
    background: none;
  }
  .faq .link a:before {
    top: 0;
  }
  .faq .link a:after {
    bottom: 0;
  }
  .faq .link a span{
    font-size: 13px;
    line-height: 45px;
    background: url(../images/common/sp/link_2.png) no-repeat transparent;
    background-size: 28px auto;
    background-position: right 10px center;
    text-align: right;
    padding-right: 45px;
    display: block;
    color: #003399;
  }
	

  .news .link-list {
    position: static;
    top: 0;
  }
  .news .link-list a {
    display: block;
    width: 100%;
    padding: 0;
    background: none;
  }
  .news .link-list a:before {
    top: 0;
  }
  .news .link-list a:after {
    bottom: 0;
  }
  .news .link-list a span {
    font-size: 13px;
    line-height: 45px;
    background: url(../images/common/sp/link_2.png) no-repeat transparent;
    background-size: 28px auto;
    background-position: right 10px center;
    text-align: right;
    padding-right: 45px;
    display: block;
    color: #003399;
  }
	
	
	
  /*アクセス*/
  .access {
    padding: 10px 0 0px 0px;
  }
  .access h2 {
    margin-bottom: 40px;
  }
  .access h3 {
    font-size: 1.1rem;
  }
  .access p {
    font-size: 0.9rem;
    line-height: 1.5;
  }
  .access .map-box {
    position: relative;
    margin: 40px 0 30px;
  }
  .access .bt-block {
    width: 100%;
  }
  .access .bt-block li.left {
    float: none;
    margin-bottom: 15px;
  }
  .access .bt-block li.right {
    float: none;
  }
  h1 {
    box-sizing: content-box;
    width: 100%;
    height: auto;
    font-size: 2.3em;
  }
}
/*料金テーブル*/
.flexbox {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
}
/* 
TABLE
================================================ */
table {
  table-layout: fixed;
  width: 100%;
  border-bottom: 1px solid #ddd;
  margin-bottom: 15px;
  overflow-y: hidden;
  overflow-x: scroll;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  border: 1px solid #ddd;
  -webkit-overflow-scrolling: touch;
}
th, td {
  padding: 20px;
  text-align: center;
  vertical-align: top;
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
}
tr:nth-child(even) > td, tr:nth-child(even) > th {
  background-color: #efefef;
}
th, .plan-name {
  color: #fff;
}
.plan-name {
  font-size: 1.3rem;
  border-top: 1px solid rgba(255, 255, 255, .2);
  padding: 18px 0px 5px 0px;
}
.plan-name p {
  font-size: 1.2rem;
  margin: 0px 0 0 0;
  padding: 0px 0px 5px 0px;
}
.plan-name span {
  font-size: 0.8rem;
  padding: 0px 0px 0px 0px;
}
.plan-price {
  color: #fff;
  border-top: 1px solid rgba(255, 255, 255, .2);
  font-size: 1.6rem;
}
.plan-price p span {
  font-size: 0.9rem;
}



/*調整　マージン*/
.m1 {
  margin: 40px 0 0px 0;
}
.m2 {
  margin: 0px 0 235px 0;
}
.m3 {
  margin: 0px 0 52px 0;
}
.m4 {
  margin: 0px 0 3px 0;
}
.m5 {
  margin: 0px 0 26px 0;
}
.m6 {
  margin: 0px 0 57px 0;
}
.m7 {
  margin: 0px 0 30px 0;
}
.m8 {
  margin: 0px 0 79px 0;
}
/* Background colour */
.plan-tent th, .plan-tent .plan-price {
  background-color: #003366;
}
.plan-bung th, .plan-bung .plan-price {
  background-color: #003366;
}
.plan-day th, .plan-day .plan-price {
  background-color: #003366;
}
.plan-fish th, .plan-fish .plan-price {
  background-color: #003366;
  /*background: linear-gradient(-90deg, #00ccff, #003399);*/
}
/* 
BUTTON
================================================ */
.btn {
  color: #fff;
  font-size: 1.2rem;
  text-decoration: none;
  background: #6fc173;
  border-radius: 5px;
  box-shadow: 0 3px #449f49;
  position: relative;
  display: inline-block;
  top: -2px;
  padding: 15px;
  width: 80%;
  text-align: center;
  margin: 10px 0;
}
.btn:hover {
  box-shadow: 0 1px #449f49;
  top: 1px;
}
/* 
LARGE DISPLAY
================================================ */
@media (min-width : 700px) {
  .flexbox {
    -webkit-flex-direction: row;
    flex-direction: row;
  }
  .plan-table {
    margin-left: 3%;
  }
  .plan-table:first-of-type {
    margin-left: 0;
  }
}
@media screen and (max-width: 767px) {
  .m2 {
    margin: 0px 0px 0px 0px;
  }
  .m6 {
    margin: 0px 0px 0px 0px;
  }
  .plan-name {
    font-size: 1.2rem;
  }
  .plan-name p {
    font-size: 0.9rem;
    margin: 0px 0 0 0;
    padding: 0px 0px 5px 0px;
  }
  .plan-name span {
    font-size: 0.7rem;
    padding: 0px 0px 0px 0px;
  }
  .plan-price {
    color: #fff;
    border-top: 1px solid rgba(255, 255, 255, .2);
    font-size: 1.2rem;
  }
  .plan-price p span {
    font-size: 1rem;
  }
}