@charset "utf-8";
/* ===================================================================================================================

	トップページ

=================================================================================================================== */

.home_section {
  position: relative;
  margin: 0 auto;
  margin-top: -1px;
}
.home_section > .inner {
  padding: 10% 5%;
}
.home_section p {
  /*letter-spacing: -.05em;*/
  font-feature-settings: "palt";
}


/* eyecatch ------------------ */

.eyecatch {
  position: relative;
  background: url("../images/home/eyecatch/bg.png") no-repeat center bottom / auto 100%;
}
.eyecatch:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 0;
  padding-top: 20%;
  background: url("../images/home/eyecatch/bg-wave.png") no-repeat center bottom / 100% 100%;
}
.eyecatch h2 {
  margin-top: 10%;
}

.eyecatch .txt01 {
  position: relative;
  z-index: 2;
}
.eyecatch .txt02 {
  position: relative;
  margin-top: -10%;
  padding: 40% 0 45% 0;
}
.eyecatch .txt02:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: url("../images/home/eyecatch/bg01.svg") no-repeat center center / contain;
  transform: scale(1.1) translateX(1%);
  z-index: -1;
}


/* charter ------------------ */

#charter {
}
#charter h2 {
  margin: 5% 0;
}
#charter .img01 {
  margin: 5% auto;
  max-width: 45%;
}
#charter .img02 {
  margin: 5% 0;
}
#charter .img03 {
  margin: 5% 0;
}
#charter .img04 {
  margin: 5% 0;
}
#charter .txt01 {
  margin: 5% 0;
}
#charter .txt02 {
  position: relative;
  margin: 5% 0;
}
#charter .txt02:before {
  content: '';
  position: absolute;
  top: 0;
  right: -3%;
  display: block;
  width: 25%;
  height: 0;
  padding-top: 25%;
  /*background: url("../images/home/charter/icon01.svg") no-repeat center / contain;*/
  transform: translateY(-65%);
}
#charter .txt03 {
  position: relative;
  margin: 5% 0;
}
#charter .txt03:before {
  content: '';
  position: absolute;
  top: 0;
  right: -5%;
  display: block;
  width: 30%;
  height: 0;
  padding-top: 30%;
  background: url("../images/home/charter/icon02.svg") no-repeat center / contain;
  transform: translateY(-50%);
}
#charter .txt03 img {
  margin-right: 30%;
}

/* plan ------------------ */

#plan {
}
#plan h2 {
  margin: 5% 0;
}


.tab_wrap {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  column-gap: 3%;
  row-gap: 10px;
}
.tab_wrap .tab_check {
  display: none;
}
.tab_wrap .tab_label {
  position: relative;
  order: 1;
}
.tab_wrap .tab_content {
  position: relative;
  order: 99;
  display: none;
  width: 100%;
}
.tab_wrap .tab_check:checked +.tab_label + .tab_content {
  display: block;
}


#plan .tab_wrap .tab_label {
  position: relative;
  width: calc(50% - (3%/2));
  padding: 3% 3% 3% 10%;
  border-radius: 3px;
  background: #94D2E4;
}
#plan .tab_wrap .tab_check:checked + .tab_label {
  background: #FFDB6A;
}
#plan .tab_wrap .tab_label:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 10%;
  display: block;
  width: 15px;
  height: 15px;
  background: #fff;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  transform: translate(-50%, -50%);
}

/*
#plan .tab_wrap .tab_label[for="tab02"] img {
  padding-right: 20%;
}*/
#plan .tab_wrap .tab_label[for="tab03"] img {
  padding-right: 13%;
}

#plan .tab_wrap .tab_label.no_fishing:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 15%;
  height: 0;
  padding-top: 15%;
  background: url("../images/home/plan/icon_nofishing.svg") no-repeat center / contain;
  transform: translate(5px, -8px);
}

#plan .tab_wrap .tab_content {
  padding-top: 3%;
}
#plan .tab_wrap #plan_detail {
  order: 50;
  width: 100%;
}



#plan h3 {
  margin: 0 0 5% 0;
}
#plan h4 {
  margin: 8% 0 3% 0;
  color: #0C4680;
  font-weight: bold;
  font-size: 1.5em;
}
#plan mark {
  font-weight: bold;
  background: rgb(255,223,49);
  background: -webkit-linear-gradient(rgba(255,223,49,0) 50%, rgba(255,223,49,1) 51%);
  background: -o-linear-gradient(rgba(255,223,49,0) 50%, rgba(255,223,49,1) 51%);
  background: linear-gradient(rgba(255,223,49,0) 50%, rgba(255,223,49,1) 51%);
}
#plan .tag_plan {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 5px;
  margin: 5% 0;
}
#plan .tag_plan li {
  padding: .5em .75em;
  border-radius: 3px;
  line-height: 1;
  color: #fff;
  background-color: #9d9d9d;
}
#plan .tag_plan li.child {
  background-color: #419DE0;
}
#plan .tag_plan li.empty_handed {
  background-color: #5BC1A9;
}
#plan .tag_plan li.soft_drink {
  background-color: #EA88B5;
}
#plan .tag_plan li.shuttle  {
  background-color: #EB9556;
}

/*#plan .list-price,*/
#plan .list-details {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 1rem;
  font-weight: bold;
}
#plan .list-price {
  font-weight: bold;
}

/*#plan .list-price dt,*/
#plan .list-details dt {
  white-space: nowrap;
}
#plan .list-price dt:after ,
#plan .list-details dt:after {
  content: '：';
}
#plan .list-price dd,
#plan .list-details dd {
  flex-grow: 1;
}

#plan .list-price {
  align-items: baseline;
}
#plan .list-price dd {
  font-size: 2.0em;
  color: #EF1D4D;
}
#plan .list-price dd .small {
  font-size: .5em;
}
#plan .list-timetable {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 1rem;
}
/*#plan .list-timetable dt {
  white-space: nowrap;
}*/
#plan .list-timetable dt:after {
  /*content: '：';*/
}
#plan .list-timetable dd {
  flex-grow: 1;
}


#plan .wrap-details {
  margin: .5em 0;
  padding: .5em 0;
  border-top: #707070 dashed 1px;
  border-bottom: #707070 dashed 1px;
}


#plan .list-rect {
  margin: 5% 0;
}
#plan .column2 a {
  width: 100%;
}


#plan .swiper {
  margin: 3% 0;
}
#plan .swiper .swiper-button-next,#plan .swiper  .swiper-button-prev {
  color: #fff;
}
#plan .swiperThumbnail .swiper-slide {
  border: transparent solid 3px;
  opacity: .7;
}
#plan .swiperThumbnail .swiper-slide-thumb-active {
  border-color: #fff;
  opacity: 1;
}

/* map ------------------ */

#map {
  
}
#map .txt01 {
  margin: 5% 0;
}
#map iframe {
  width: 100%;
}


/* other ------------------ */

#other {
}
#other h2 {
  margin: 5% 0;
}
#other .img01 {
  margin: 5% auto;
  max-width: 45%;
}
#other .img02 {
  margin: 5% 0;
}

#other .btn_insta {
  display: inline-block;
  margin: 8% 0 5% 0;
}


/* line ------------------ */
#line {
  background: url("../images/home/line/bg.svg") no-repeat right bottom / 60% auto;
}
#line h2 {
  margin: 0 0 5% 0;
}
#line p {
  color: #fff;
  font-size: 1.2em;
  font-weight: bold;
  line-height: 1.5;
}
#line p .large {
  color: #FFD112;
  font-size: 1.5em;
}

.list-line {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0;
  margin: 3% 0;
  width: 35%;
  background: #fff;
}
.list-line dt {
  width: 100%;
  padding: .75em;
  line-height: 1;
}
.list-line dd {
  width: 100%;
  padding: .75em;
  color: #fff;
  font-size: .8em;
  font-weight: bold;
  line-height: 1;
  background: #FF9F2E;
}



/* faq ------------------ */
#faq h2 {
  margin: 0 0 5% 0;
}

#faq .details-faq {
  padding: .5em 0;
  border-bottom: #D6D6D6 dashed 1px;
}
#faq .details-faq summary .summary_inner {
  position: relative;
  padding: .25em 0 .25em 3em;
}
#faq .details-faq summary .summary_inner:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 2em;
  height: 2em;
  background: url("../images/home/faq/icon_q.svg") no-repeat center center / contain; 
}

#faq .details-faq .details_inner {
  position: relative;
  margin-top: 1em;
  padding: .25em 0 .25em 3em;
}
#faq .details-faq .details_inner:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 2em;
  height: 2em;
  background: url("../images/home/faq/icon_a.svg") no-repeat center center / contain; 
}



/* cancel ------------------ */

#cancel h2 {
  margin: 0 0 5% 0;
}
#cancel h3 {
  position: relative;
  margin: 3% 0;
  padding-left: 1.0em;
  font-size: 1.5em;
  font-weight: bold;
}
#cancel h3:before {
  content: '';
  position: absolute;
  top: .5em;
  left: 0;
  display: block;
  width: .5em;
  height: 3px;
  background: #404040;
  transform: translateY(10%);
}

.cancel-inner {
  padding-left: 5%;
}

.list-cancel {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  gap: 1rem;
}
.list-cancel dt {
  white-space: nowrap;
}
.list-cancel dt:after {
  content: '：';
}
.list-cancel dd {
  flex-grow: 1;
}

table.table th, table.table td{
  padding: 10px 8px;
  border-bottom:1px dotted #ccc;
}
.rakuten_t img {
  width: 40%;
}