@charset"utf-8";
@import "common.css";

/* "h" tag
-------------------------------------------------- */
/* common */
h3.h3-cmn{
  margin-bottom: 5rem;
  font-size: 2.8rem;
  line-height: 1.3;
  font-weight: bold;
  color: #264995;
  text-align: center;
}
h3.h3-cmn::before {
    color: #6699FF;
    font-size: 1.4rem;
    display: block;
    margin-bottom: 0.2rem;
}
h4.h4-cmn{
  text-align: center;
  font-size: 2.4rem;
  line-height: 1.6;
  position: relative;
  margin: 5rem 0 6rem;
}
h5.h5-cmn{
  height: 4.2rem;
  line-height: 4.2rem;
  font-size: 2.0rem;
  font-weight: bold;
  position: relative;
  margin-bottom: 1rem;
}
@media print, screen and (max-width: 767px) {
  h3.h3-cmn{
    margin-bottom: 3rem;
    font-size: 2.4rem;
  }
  h4.h4-cmn{
    font-size: 2.0rem;
    line-height: 1.5;
  }
  h5.h5-cmn{
    height: 3.8rem;
    line-height: 3.8rem;
    font-size: 1.8rem;
    margin-bottom: 1rem;
  }
}

/* breadcrumbSec
-------------------------------------------------- */
section.breadcrumbSec div.content div.breadcrumb{
  margin: 4rem 0 10rem;
}
section.breadcrumbSec div.content div.breadcrumb ul{
  text-align: right;
}
section.breadcrumbSec div.content div.breadcrumb ul li{
  display: inline-block;
}
section.breadcrumbSec div.content div.breadcrumb ul li::after{
  content: '>';
  padding: 0 1.5rem;
}
section.breadcrumbSec div.content div.breadcrumb ul li:last-child::after{
  display: none;
}
section.breadcrumbSec div.content div.breadcrumb ul li a{
  text-decoration: underline;
  color: #6699FF;
}
section.breadcrumbSec div.content div.breadcrumb ul li a:hover{
  opacity: 0.5;
  transition: 0.6s;
}
@media print, screen and (max-width: 767px) {
  section.breadcrumbSec div.content div.breadcrumb{
    margin: 3rem 0 5rem;
  }
  section.breadcrumbSec div.content div.breadcrumb ul li{
    font-size: 1.3rem;
    line-height: 1.6;
  }
  section.breadcrumbSec div.content div.breadcrumb ul li::after{
    padding: 0 1.0rem;
  }
}

/* contentVisualSec
-------------------------------------------------- */
section.contentVisualSec{
  width: 100%;
  position: relative;
}
/* diving */
section.contentVisualSec div.swiper-container{
  width: 85%;
  height: 50rem;
  margin: 0 0 0 auto;
  position: relative;
}
section.contentVisualSec div.swiper-container div.swiper-slide.mv01{
  background:url(../img/diving/visual_diving01.jpg) center center / cover no-repeat;
}
section.contentVisualSec div.swiper-container div.swiper-slide.mv02{
  background:url(../img/diving/visual_diving02.jpg) center center / cover no-repeat;
}
section.contentVisualSec div.swiper-container div.swiper-slide.mv03{
  background:url(../img/diving/visual_diving03.jpg) center center / cover no-repeat;
}
section.contentVisualSec div.swiper-container div.swiper-slide.mv04{
  background:url(../img/diving/visual_diving04.jpg) center center / cover no-repeat;
}
section.contentVisualSec div.swiper-container div.swiper-slide.mv05{
  background:url(../img/diving/visual_diving05.jpg) center center / cover no-repeat;
}
section.contentVisualSec div.visual{
  width: 85%;
  height: 50rem;
  margin: 0 0 0 auto;
}
/* menu */
section.contentVisualSec div.visual.accommodation{
  background: url(../img/accommodation/visual_accommodation.jpg) center center / cover no-repeat;
}
/* news */
section.contentVisualSec div.visual.news{
  background: url(../img/news/visual_news.jpg) center center / cover no-repeat;
}
/* inquiry */
section.contentVisualSec div.visual.inquiry{
  background: url(../img/inquiry/visual_inquiry.jpg) center bottom / cover no-repeat;
}
/* request */
section.contentVisualSec div.visual.request{
  background: url(../img/request/visual_request.jpg) center center / cover no-repeat;
}
/* privacy */
section.contentVisualSec div.visual.privacy{
  background: url(../img/privacy/visual_privacy.jpg) center center / cover no-repeat;
}
@media print, screen and (max-width: 767px) {
  section.contentVisualSec div.visual{
    width: 100%;
    height: 50rem;
  }
  /* diving */
  section.contentVisualSec div.swiper-container{
    width: 100%;    
  }
  /* inquiry */
  section.contentVisualSec div.visual.inquiry{
    background: url(../img/inquiry/visual_inquiry_sp.jpg) left bottom / cover no-repeat;
  }
}
@media print, screen and (max-width: 374px) {
  /* diving */
  section.contentVisualSec div.swiper-container{
    height: calc(100vh - 8rem);
  }
  section.contentVisualSec div.visual{
    height: calc(100vh - 8rem);
  }
}

/* titleSec
-------------------------------------------------- */
div.titleSec{
  position: absolute;
  top: 48%;
/*  left: 5rem;*/
  left: 8rem;
  text-align: center;
  transform: translateY(-52%);
  z-index: 1;
}
h2.h2-title{
  color: #333;
  font-size: 2.8rem;
  line-height: 1.3;
  font-weight: bold;
  text-shadow: 2px 2px 0 #fff;
  text-align: left;
}
h2.h2-title::before{
  font-weight: normal;
  font-size: 1.5rem;
  display: block;
  color: #999;
  letter-spacing: 0.05rem;
  margin-left: 0.3rem;
}
h2.h2-title.accommodation::before{
  content: "Accommodation";
}
h2.h2-title.news::before{
  content: "News";
}
h2.h2-title.diving::before{
  content: "Diving";
}
h2.h2-title.introductoryDiving::before{
  content: "Introductory diving";
}
h2.h2-title.funDiving::before{
  content: "Fun diving";
}
h2.h2-title.certification_courses::before{
  content: "Certification courses";
}
h2.h2-title.inquiry::before{
  content: "Inquiry";
}
h2.h2-title.request::before{
  content: "Reservation";
}
h2.h2-title.privacy::before{
  content: "Privacy policy";
}
@media print, screen and (max-width: 767px) {  
  div.titleSec{
    position: absolute;
    top: 47%;
    left: 5rem;
    text-align: center;
    transform: translateY(-53%);
    z-index: 1;
  }
  h2.h2-title{
    font-size: 2.6rem;
    color: #fff;
    text-shadow: 2px 2px 1px #333;
    font-weight: normal;
  }
  h2.h2-title::before{
    font-size: 1.3rem;
    color: #fff;
  }
}

/* button
-------------------------------------------------- */
input.button {
  background: #264995;
  border: 1px solid #264995;
  display: inline-block;
  height: 5.5rem;
  width: 20rem;  
  line-height: 5.2rem;
  text-align: center;
  outline: none;
  color: #fff;
  font-size: 1.5rem;
  position: relative;
}
a.button {
  color: #fff!important;
  text-decoration: none!important;
}
a.button:hover {
  color: #264995!important;
}
input.button::after {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  top: 50%;
  right: -1.5rem;
  width: 3rem;
  height: 1px;
  background: #E5E5E5;
}
input.button:hover{
  background: #fff;
  color: #264995;
  transition: .5s;
}
input.button:hover::after{
  background: #264995;
}
input.btn-back {
  color: #fff;
  background: #363947;
  margin-bottom: 10px;
}
@media print, screen and (max-width: 767px) {
  input.button {
    width: 18rem;  
    font-size: 1.4rem;    
  }
}

/* recommendSec
-------------------------------------------------- */
section.recommendSec div.content div.wrap{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
section.recommendSec div.content div.wrap div.img-area{
  width: 45%;
}
section.recommendSec div.content div.wrap div.img-area ul.imgwrap li{
  width: 100%;
  border: 1px solid #ccc;
  font-size: 0;
}
section.recommendSec div.content div.wrap div.img-area ul.imgwrap li img{
  width: 100%;
  height: auto;
}
section.recommendSec div.content div.wrap div.text-area{
  width: 50%;
}
section.recommendSec div.content div.wrap div.text-area ul li{
  line-height: 1.6;
  list-style-type: disc;
  margin-left: 2.5rem;
}
section.recommendSec div.content div.wrap div.text-area h3.h3-cmn{
  text-align: left;
  font-size: 2.4rem;
  margin-bottom: 3rem;
}
@media print, screen and (max-width: 767px) {
  section.recommendSec div.content div.wrap{
    display: block;
  }
  section.recommendSec div.content div.wrap div.img-area{
    width: 100%;
  }
  section.recommendSec div.content div.wrap div.text-area{
    width: 100%;
    margin-bottom: 3rem;
  }
  section.recommendSec div.content div.wrap div.text-area h3.h3-cmn{
    text-align: center;
    font-size: 2.0rem;
  }
}

/* ==================================================
ダイビング一覧
================================================== */
/* "h"tag */
h3.h3-cmn.recommend::before {
    content: "Recommend point";
}
h3.h3-cmn.service::before {
    content: "Service";
}
h3.h3-cmn.price::before {
    content: "Price";
}
h3.h3-cmn.rental::before {
    content: "Rental equipment";
}
h4.h4-payment{
  font-size: 2.4rem;
  text-align: center;
  color: #264995;
  margin-bottom: 3rem;
}
h4.h4-diving{
  font-size: 2.4rem;
  color: #3AB0E2;
  margin-bottom: 3rem;
}
/* section */
section.divinglistSec{
  margin: 10rem auto 0;
}
section.divinglistSec p.lead{
  margin-bottom: 5rem;
}
section.divinglistSec div.content div.wrap{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding-bottom: 3rem;
  margin-bottom: 3rem;
  border-bottom: 1px dotted #707070;
}
section.divinglistSec div.content div.wrap:last-child{
  margin-bottom: 0;
}
section.divinglistSec div.content div.wrap div.img-area{
  width: 45%;
}
section.divinglistSec div.content div.wrap div.img-area img{
  width: 100%;
  height: auto;
}
section.divinglistSec div.content div.wrap div.text-area{
  width: 50%;
}
section.divinglistSec div.content div.wrap div.button-area{
  margin: 5rem auto 0 0;
}
section.priceSec{
  margin: 10rem auto 0;
}
section.priceSec div.content div.text-area{
  margin-bottom: 5rem;
}
section.priceSec div.content div.block{
  margin-bottom: 7rem;
}
section.priceSec div.content div.block p{
  text-align: center;
  font-size: 1.8rem;
}
section.priceSec div.content div.wrap{
  margin-bottom: 5rem;
}
section.priceSec div.content div.wrap h4.h4-diving{
  padding-bottom: 1.5rem;
  border-bottom: 1px dotted #707070;
}
section.priceSec div.content div.wrap dl dt,
section.priceSec div.content div.wrap dl dd{
  line-height: 1.8;
}
section.priceSec div.content div.wrap dl dt{
  float: left;
  width: 45%;
  font-weight: bold;
  color: #264995;
}
section.priceSec div.content div.wrap dl dd{
  text-align: right;
  font-weight: bold;
  color: #6699FF;
}
section.priceSec div.content div.wrap dl dd::after{
  display: block;
  content: "";
  clear: both;
}
section.priceSec div.content ul li{
  list-style-type: disc;
  margin-left: 2.5rem;
}
section.rentalgearSec{
  margin: 10rem auto 0;
}
section.rentalgearSec div.content div.text-area{
  margin-bottom: 5rem;
}
section.rentalgearSec div.content div.wrap h4.h4-diving{
  padding-bottom: 1.5rem;
  border-bottom: 1px dotted #707070;
}
section.rentalgearSec div.content div.wrap dl dt,
section.rentalgearSec div.content div.wrap dl dd{
  line-height: 1.8;
}
section.rentalgearSec div.content div.wrap dl dt{
  float: left;
  width: 65%;
  font-weight: bold;
  color: #264995;
}
section.rentalgearSec div.content div.wrap dl dd{
  text-align: right;
  font-weight: bold;
  color: #6699FF;
}
section.rentalgearSec div.content div.wrap dl dd::after{
  display: block;
  content: "";
  clear: both;
}
@media print, screen and (max-width: 767px) {
  /* "h"tag */
  h4.h4-diving{
    font-size: 2.0rem;
  }
  h4.h4-payment{
    font-size: 2.0rem;
  }
  /* section */  
  section.divinglistSec{
    margin: 7rem auto 0;
  }
  section.divinglistSec div.content div.wrap{
    display: block;
    padding-bottom: 3rem;
    margin-bottom: 3rem;
    border-bottom: 1px dotted #707070;
  }
  section.divinglistSec div.content div.wrap div.img-area{
    width: 100%;
  }
  section.divinglistSec div.content div.wrap div.img-area img{
    width: 100%;
    height: auto;
  }
  section.divinglistSec div.content div.wrap div.text-area{
    margin-top: 3rem;
    width: 100%;
  }
  section.divinglistSec div.content div.wrap div.button-area{
    margin: 5rem auto 0 0;
  }
  section.priceSec{
    margin: 7rem auto 0;
  }
  section.priceSec div.content div.block{
    margin-bottom: 5rem;
  }
  section.priceSec div.content div.block p{
    text-align: center;
    font-size: 1.6rem;
  }
  section.priceSec div.content div.text-area{
    margin-bottom: 3rem;
  }
  section.priceSec div.content div.wrap{
    margin-bottom: 3rem;
  }
  section.priceSec div.content div.wrap dl dt,
  section.priceSec div.content div.wrap dl dd{
    line-height: 1.6;
  }
  section.priceSec div.content div.wrap dl dt{
    float: none;
    width: 100%;
    font-weight: bold;
    font-size: 1.5rem;
  }
  section.priceSec div.content div.wrap dl dd{
    text-align: left;
    margin-bottom: 2rem;
  } 
  section.priceSec div.content div.wrap dl dd:last-child{
    margin-bottom: 0;
  }  
  section.rentalgearSec{
    margin: 7rem auto 0;
  }
  section.rentalgearSec div.content div.wrap dl dt,
  section.rentalgearSec div.content div.wrap dl dd{
    line-height: 1.6;
  }
  section.rentalgearSec div.content div.wrap dl dt{
    float: none;
    width: 100%;
    font-weight: bold;
    font-size: 1.5rem;
  }
  section.rentalgearSec div.content div.wrap dl dd{
    margin-bottom: 2rem;
    text-align: left;
  }
  section.rentalgearSec div.content div.wrap dl dd:last-child{
    margin-bottom: 0;
  }
}

/* ==================================================
ダイビング詳細
================================================== */
/* "h"tag */
h3.h3-cmn.activity::before {
  content: "Activity";
}
h3.h3-cmn.introductoryDiving::before {
  content: "Introductory diving";
}
h3.h3-cmn.funDiving::before {
  content: "Fun diving";
}
h3.h3-cmn.certification_courses::before {
  content: "Certification courses";
}
h4.h4-divingDetail{
  font-size: 2.4rem;
  color: #3AB0E2;
  margin-bottom: 3rem;
  line-height: 1.4;
}
h4.h4-activity{
  position: relative;
  font-size: 2.4rem;
  color: #3AB0E2;
  margin-bottom: 3rem;
  padding-left: 2.8rem;
}
h4.h4-activity::before{
  position: absolute;
  left: 0;
  top: 49%;
  transform: translateY(-45%);
  content: '';
  width: 15px;
  height: 15px;
  border: 4px solid #3AB0E2;
  border-radius: 100%;
}
section.divingDetailSec div.content div.wrap{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
section.divingDetailSec div.content div.wrap div.text-area{
  width: 48%;
}
section.divingDetailSec div.content div.wrap div.img-area{
  width: 48%;
}
section.divingDetailSec div.content div.wrap div.img-area img{
  width: 100%;
  height: auto;
}
section.activitySec{
  margin: 10rem auto 0;
}
section.activitySec a{
  text-decoration: underline;
  color: #6699FF;
}
section.activitySec div.content table{
  padding: 3rem 0;
  line-height: 1.6;
  width: 100%;
  margin-bottom: 7rem;
}
section.activitySec div.content table tr{
  border-top: 1px dotted #707070;
  border-bottom: 1px dotted #707070;
}
section.activitySec div.content table th{
  text-align: left;
  padding: 3rem 0;
  width: 40%;
  color: #264995;
}
section.activitySec div.content table td{
  padding: 3rem 0;  
}
section.activitySec div.content div.qualification ul{
  margin-top: 2rem;
}
section.activitySec div.content div.qualification ul.ul01 li{
  list-style-type: disc;
  margin-left: 2.5rem;
}
@media print, screen and (max-width: 767px) {
  /* "h"tag */
  h4.h4-divingDetail{
    font-size: 2.0rem;
  }
  h4.h4-activity{
    font-size: 2.0rem;
    padding-left: 2.5rem;
    margin-bottom: 2rem;
  }
  h4.h4-activity::before{
    top: 52%;
    transform: translateY(-48%);
    width: 12px;
    height: 12px;
  }
  section.divingDetailSec div.content div.wrap{
    display: block;
  }
  section.divingDetailSec div.content div.wrap div.text-area{
    width: 100%;
    margin-bottom: 3rem;
  }
  section.divingDetailSec div.content div.wrap div.img-area{
    width: 100%;
  }
  section.activitySec{
    margin: 7rem auto 0;
  }
  section.activitySec div.content table{
    margin-bottom: 5rem;
  }
  section.activitySec div.content table th{
    display: block;
    padding: 2.5rem 0 0;
    width: 100%;
    font-weight: bold;
  }
  section.activitySec div.content table td{
    display: block;
    padding: 1rem 0 2.5rem;
    font-size: 1.4rem;
  }
}

/* ==================================================
宿泊案内
================================================== */
/* "h"tag */
h3.h3-cmn.guide::before {
  content: "Accommodation guide";
}
h3.h3-cmn.fee::before {
  content: "Accommodation fee";
}
h4.h4-accommodation{
  font-size: 2.4rem;
  color: #3AB0E2;
  margin-bottom: 3rem;
  line-height: 1.4;
}
/* section */
section.accommodationGuideSec{
  margin: 10rem auto 0;
}
section.accommodationGuideSec div.content div.wrap{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 7rem;
}
section.accommodationGuideSec div.content div.wrap div.text-area{
  width: 54%;
  margin-top: 0!important;
}
section.accommodationGuideSec div.content div.wrap.a02{
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse;
}
section.accommodationGuideSec div.content div.wrap div.img-area{
  width: 42%;
}
section.accommodationGuideSec div.content div.wrap div.img-area img{
  width: 100%;
  height: auto;
}
section.accommodationGuideSec div.content div.wrap div.img-area div.slider-arrow.slider-prev.fa.fa-chevron-left.slick-arrow {
  position: absolute;
  color: #fff;
  z-index: 8;
  font-size: 2.6rem;
  top: 50%;
  left: 2.5%;
  transform: translateY(-47%);
  text-shadow: 1px 1px 1px rgba(30,30,30,1);
  -webkit-text-shadow: 1px 1px 1px rgba(30,30,30,1);
}
section.accommodationGuideSec div.content div.wrap div.img-area div.slider-arrow.slider-next.fa.fa-chevron-right.slick-arrow {
  position: absolute;
  color: #fff;
  z-index: 8;
  font-size: 2.6rem;
  top: 50%;
  right: 2.5%;
  transform: translateY(-47%);
  text-shadow: 1px 1px 1px rgba(30,30,30,1);
  -webkit-text-shadow: 1px 1px 1px rgba(30,30,30,1);
}
section.accommodationGuideSec div.content div.wrap div.img-area div.slider-arrow.slider-prev.fa.fa-chevron-left.slick-arrow:hover,
section.accommodationGuideSec div.content div.wrap div.img-area div.slider-arrow.slider-next.fa.fa-chevron-right.slick-arrow:hover {
  cursor: pointer;
  opacity: 0.4;
  transition: 0.6s;
}
section.accommodationGuideSec div.content div.wrap div.img-area ul.slick-dots{
  bottom: 2%;
}
section.accommodationGuideSec div.content div.wrap div.img-area ul.slick-dots li{
  margin: 0 0.2rem;
}
section.accommodationGuideSec div.content div.wrap div.img-area ul.slick-dots li.slick-active button:before{
  opacity: 1!important;
}
section.accommodationGuideSec div.content div.wrap div.img-area ul.slick-dots li button:before{
  font-size: 2rem;
  color: #fff;
}
section.accommodationGuideSec div.content table{
  padding: 3rem 0;
  line-height: 1.6;
  width: 100%;
  margin-bottom: 3rem;
}
section.accommodationGuideSec div.content table tr{
  border-top: 1px dotted #707070;
  border-bottom: 1px dotted #707070;
}
section.accommodationGuideSec div.content table th{
  text-align: left;
  padding: 3rem 0;
  width: 40%;
  vertical-align: middle;
  color: #264995;
}
section.accommodationGuideSec div.content table td{
  padding: 3rem 0;  
}
section.accommodationGuideSec div.content table td ul{
  margin-top: 2rem;  
}
section.accommodationGuideSec div.content table td ul li{
  list-style-type: disc;
  margin-left: 2.5rem;
}
section.accommodationFeeSec{
  margin: 10rem auto 0;
}
section.accommodationFeeSec div.content div.block{
  margin: 5rem 0;
}
section.accommodationFeeSec div.content div.block p{
  text-align: center;
  font-size: 1.8rem;
}
section.accommodationFeeSec div.content table.pc{
  line-height: 1.4;
  width: 100%;
  margin-bottom: 3rem;
}
section.accommodationFeeSec div.content table.sp{
  display: none;
}
section.accommodationFeeSec div.content table.pc th.age,
section.accommodationFeeSec div.content table.pc td.age{
  width: 60%;
}
section.accommodationFeeSec div.content table.pc th{
  width: 20%;
  text-align: center;
  color: #264995;
  font-size: 1.6rem;
  padding-bottom: 1rem;
  border-bottom: 1px dotted #707070;
}
section.accommodationFeeSec div.content table.pc td{
  width: 20%;
  text-align: center;
  padding-top: 1.5rem;
}
section.accommodationFeeSec div.content table.pc td.age{
  text-align: left;
}
section.accommodationFeeSec p span.ttl{
  color: #264995;
  font-weight: bold;
}
section.accommodationFeeSec p.sp{
  display: none;
}
section.accommodationFeeSec div.option{
  margin-top: 5rem;
}
section.accommodationFeeSec div.option p.title{
  color: #264995;
  font-size: 2.0rem;
  font-weight: bold;
  margin-bottom: 2rem;
}
section.accommodationFeeSec div.option ul li{
  line-height: 1.6;
  list-style-type: disc;
  margin-left: 2.5rem;
}
section.accommodationFeeSec div.content div.button-area{
  margin-top: 7rem;
}
@media print, screen and (max-width: 767px) {
  /* "h"tag */
  h4.h4-accommodation{
    font-size: 2.0rem;
  }
  /* section */
  section.accommodationGuideSec{
    margin: 7rem auto 0;
  }
  section.accommodationGuideSec div.content div.wrap{
    display: block;
    margin-bottom: 5rem;
  }
  section.accommodationGuideSec div.content div.wrap div.text-area{
    width: 100%;
  }
  section.accommodationGuideSec div.content div.wrap div.img-area{
    width: 100%;
    margin-top: 3rem;
  }
  section.accommodationGuideSec div.content table th{
    display: block;
    padding: 2.5rem 0 0;
    width: 100%;
    font-weight: bold;    
  }
  section.accommodationGuideSec div.content table td{
    display: block;
    padding: 1.2rem 0 2.5rem;
    font-size: 1.4rem;
  }
  section.accommodationFeeSec{
    margin: 7rem auto 0;
  }
  section.accommodationFeeSec div.content table.pc{
    display: none;
  }
  section.accommodationFeeSec div.content table.sp{
    display: block;
    width: 100%;
    line-height: 1.2;
    margin-bottom: 2rem;
  }
  section.accommodationFeeSec div.content table.sp:last-child{
    margin-bottom: 0;
  }
  section.accommodationFeeSec div.content table.sp th{
    color: #264995;
    font-size: 1.7rem;
    text-align: left;
    border-bottom: 1px dotted #707070;
    width: 100%;
    padding-bottom: 1rem;
  }
  section.accommodationFeeSec div.content table.sp td{
    padding-top: 1rem;
    font-size: 1.4rem;
  }
  section.accommodationFeeSec div.content table.sp td.age{
    width: 35rem;
  }
  section.accommodationFeeSec div.content table.sp td.price{
    width: 55%;
    text-align: right;
    font-weight: bold;
    color: #6699FF;
  }
  section.accommodationFeeSec p.pc{
    display: none;
  }
  section.accommodationFeeSec p.sp{
    display: block;
  }
  section.accommodationFeeSec p.sp.btm{
    margin-bottom: 4rem;
  }
  section.accommodationFeeSec div.content div.block{
    margin: 5rem 0;
  }
  section.accommodationFeeSec div.content div.block h4{
    margin-bottom: 2rem;
  }
  section.accommodationFeeSec div.content div.block p{
    font-size: 1.6rem;
    line-height: 1.6;
  }
  section.accommodationFeeSec div.option{
    margin-top: 0rem;
  }
  section.accommodationFeeSec div.option p.title{
    font-size: 1.8rem;
    margin-bottom: 1rem;
  }
  section.accommodationFeeSec div.content div.button-area{
    margin-top: 5rem;
  }
}


/* ==================================================
ニュース一覧
================================================== */
/* "h"tag */
h3.h3-cmn.news::before {
    content: "News";
}
/* newsListSec
-------------------------------------------------- */
section.newsListSec div.content div.infolist{
  margin: 5rem auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
section.newsListSec div.content div.infolist div.box{
  width: 23.5%;  
}
section.newsListSec div.content div.infolist div.box div.img img{
  width: 100%;
  height: auto;
}
section.newsListSec div.content div.infolist div.box div.img img:hover{
  opacity: 0.5;
  transition: 0.6s;
}
section.newsListSec div.content div.infolist div.box dl{
  line-height: 1.5;
  text-align: left;
  position: relative;
}
section.newsListSec div.content div.infolist div.box dl dt.date{
  margin: 1.0rem 0 0;
  padding-top: 0.3rem;
  font-size: 1.3rem;
  color: #aaa;
}
section.newsListSec div.content div.infolist div.box dl dd.category{
  position: absolute;
  right: 0;
  top: 0;  
}
section.newsListSec div.content div.infolist div.box dl dd.category a{
  font-size: 1.3rem;
  pointer-events: none;
  padding: 0.3rem 0.5rem 0.3rem;
}
section.newsListSec div.content div.infolist div.box dl dd.category.information a{
  color: #264995;
  border: 1px solid #264995;
}
section.newsListSec div.content div.infolist div.box dl dd.category.divingnews a{
  color: #DE4830;
  border: 1px solid #DE4830;
}
section.newsListSec div.content div.infolist div.box dl dd.title{
  margin: 0.5rem 0 0.5rem;
  height: 5rem;
}
section.newsListSec div.content div.infolist div.box dl dd.title a:hover{
  color: #6699FF;
  transition: 0.6s;
}
section.newsListSec div.content div.button-area{
  margin-top: 7rem;
}
@media print, screen and (max-width: 767px) {
  section.newsListSec{
    margin: 7rem auto 0;
  }
  section.newsListSec div.content div.infolist{
    margin: 5rem auto 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    line-height: 1.3;
  }
  section.newsListSec div.content div.infolist div.box{
    width: 48.5%;
  }
  section.newsListSec div.content div.infolist div.box dl dt.date{
    margin: 0.8rem 0 0;
    padding-top: 0.4rem;
    font-size: 1.2rem;
  }
  section.newsListSec div.content div.infolist div.box dl dd.category{
    top: 0rem;  
  }
  section.newsListSec div.content div.infolist div.box dl dd.category a{
    font-size: 1.2rem;
  }
  section.newsListSec div.content div.infolist div.box dl dd.title{
    margin: 1rem 0 0.5rem;
    height: 4.5rem;
    line-height: 1.3;
  }
  section.newsListSec div.content div.button-area{
    margin-top: 3rem;
  }
}
/* pagenationSec
-------------------------------------------------- */
section.pagenationSec{
  margin: 7rem auto 0;
  text-align: center;
}
.wp-pagenavi a, 
.wp-pagenavi span {
  background: #B5B5B5;
  width: 3.5rem;
  line-height: 2.5;
  text-align: center;
  display: inline-block;
  margin-right: 1.0rem;
  border-radius: 50%;
  color: #fff;
}
div.wp-pagenavi span.current{
  background: #6699FF!important;
  cursor: pointer;
}
div.wp-pagenavi span.current:hover{
  opacity: 0.4!important; 
  transition: 0.6s!important; 
}
div.wp-pagenavi a.nextpostslink{
  margin-right: 0!important; 
}
div.wp-pagenavi a:hover{
  opacity: 0.4!important; 
  transition: 0.6s!important; 
}
@media print, screen and (max-width: 767px) {
  section.pagenationSec{
    margin: 5rem auto 0;
    text-align: center;
  }
  .wp-pagenavi a, 
  .wp-pagenavi span {
    background: #B5B5B5;
    width: 3.2rem;
    height: 3.2rem;
    line-height: 2.0;
    margin-right: 0.8rem;
  }
}

/* ==================================================
ニュース詳細
================================================== */
/* "h"tag */
h3.h3-newstitle{
  font-size: 2.4rem;
  border-bottom: 1px solid #C8C8C8;
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 3rem;
  line-height: 1.4;
}
h4.h4-newsnavi{
  padding-left: 1.0rem;
  font-size: 2.0rem;
  line-height: 2.0;
  margin-bottom: 3rem;
  background-color: #6699FF;
  color: #fff;
}
/* section */
section.columnSec{
  margin: 10rem auto;
}
section.columnSec div.content{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
section.columnSec div.content div.column_left{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 66%;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-date{
  text-align: right;
  margin-bottom: 2.5rem;
}
section.columnSec div.content div.column_left section.newsDetailSec{
  overflow:hidden;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-text h2{
  font-size: 2.0rem;
  line-height: 1.4;
  margin-bottom: 2rem;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-text h3{
  font-size: 1.8rem;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-text,
section.columnSec div.content div.column_left section.newsDetailSec div.news-text p{
  line-height: 1.6;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-text ol li{
  list-style-type: decimal;
  margin-left: 2.3rem;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-text ul li{
  list-style-type: disc;
  margin-left: 2.3rem;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-text img{
  width: 100%;
  height: auto;
  margin: 2rem 0;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-text a img:hover{
  opacity: 0.4;
  transition: 0.6s;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-navi{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin: 5rem 0;
  color: #6699FF;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-navi a{
  color: #6699FF;
  text-decoration: underline;
}
section.columnSec div.content div.column_left section.newsDetailSec div.news-navi a:hover{
  opacity: 0.4;
  transition: 0.6s;
}
section.columnSec div.content div.column_right{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 30%;
}
section.columnSec div.content div.column_right div.widget{
  margin-bottom: 5rem;
}
section.columnSec div.content div.column_right div.widget ul li{
  margin-bottom: 2rem;
  border-bottom: 1px dotted #888;
  padding-bottom: 2rem;
  line-height: 1.4;
}
section.columnSec div.content div.column_right div.widget ul li:hover{
  opacity: 0.4;
  transition: 0.6s;
}
/*section.columnSec div.content div.column_right div.widget ul li::before{
  content: '';
  display: inline-block;
  vertical-align: middle;
  margin-right: 0.5rem;
  margin-bottom: 0.2rem;
  transform: rotate(45deg);
  width: 7px;
  height: 7px;
  border-top: solid 2px #6699FF;
  border-right: solid 2px #6699FF;
}*/

@media print, screen and (max-width: 767px) {
  /* "h"tag */
  h3.h3-newstitle{
    font-size: 2.0rem;
  }
  h4.h4-newsnavi{
    font-size: 1.8rem;
  }
  /* section */
  section.columnSec{
    margin: 7rem auto 0;
  }
  section.columnSec div.content{
    display: block;
  }  
  /* column_left */
  section.columnSec div.content div.column_left{
    display: block;
    width: 100%;
    margin-bottom: 5rem;
  }
  /* column_right */
  section.columnSec div.inner div.column_right{
    display: block;
    width: 100%;
  }  
}

/* table
-------------------------------------------------- */
/* span */
th span.required{
  background: #D2302F;
  padding: 0.2rem 0.6rem 0.2rem 0.5rem;
  color: #fff;
  margin-left: 1rem;
  font-size: 1.2rem;
  line-height: 1.8;
  display: inline-block;
}
th span.optional{
  background: #F7E56C;
  padding: 0.2rem 0.6rem 0.2rem 0.5rem;
  color: #000;
  margin-left: 1rem;
  font-size: 1.2rem;
  line-height: 1.8;
  display: inline-block;
}
/* th */
table.table_inquiry th,
table.table_request th{
  width: 28rem;
  text-align: left;
  padding: 2rem 0 0;
  vertical-align: middle;
  line-height: 2.0;
  font-weight: normal;
}
table.table_inquiry th.name,
table.table_request th.plan{
  padding: 0;
}
table.table_request th.vatop{
  vertical-align: top;
}
/* td */
table.table_inquiry td,
table.table_request td{
  padding: 2rem 0 0;
}
table.table_inquiry td input,
table.table_request td input{
  line-height: 3.0;
  height: 3.0em;
  padding-left: 1rem;
  border: 1px solid #E5E5E5;
}
table.table_inquiry td.name,
table.table_request td.plan{
  padding: 0;
}
td.name input,
td.kana input{
  width: 70%;
}
td.phone-number input,
td.checkindate input,
td.checkoutdate input,
td.divingdate input,
td.tourdate input{
  width: 50%;
}
td.mail-address input{
  width: 100%;
}
td.remarks textarea{
  width: 100%;
  height: 12em;
  line-height: 1.6;
  padding-left: 1rem;
  background-color: #F5F5F5;
  border: 1px solid #E5E5E5;
}
td input[type=text],
td input[type=tel],
td input[type=email],
td input[type=date],
td input[type=number]{
  background-color: #F5F5F5;
}
td select{
  background-color: #F5F5F5;
  border: 1px solid #E5E5E5;
  line-height: 3.0;
  height: 3.0em;
  width: 70%;
}
td.address input,
td.arrivaldate input,
td.departuredate input{
  width: 100%;
}
td.divingdays input,
td.age input,
td.career input,
td.numberOfPeople input{
  width: 15rem;
}
td.group textarea{
  width: 100%;
  height: 12em;
  line-height: 1.6;
  padding-left: 1rem;
  background-color: #F5F5F5;
  border: 1px solid #E5E5E5;
}
span.wpcf7-list-item {
  display: block!important;
  margin: 0!important;
}
/* error */
.wpcf7 .wpcf7-not-valid{
    background: pink;
}
span.wpcf7-not-valid-tip{
  display: none!important;
}
@media print, screen and (max-width: 767px) {
  /* th */
  table.table_inquiry th,
  table.table_request th{
    width: 100%;
    display: block;
    padding: 3rem 0 0;
  }
  /* td */
  table.table_inquiry td,
  table.table_request td,
  table.table_request td.plan,
  table.table_inquiry td.name,
  table.table_request td.name{
    padding: 1.5rem 0 0;
    width: 100%;
    display: block;
  }
  table.table_inquiry td input,
  table.table_request td input{
    line-height: 3.5;
    height: 3.5em;
    padding-left: 1rem;
    border: 1px solid #E5E5E5;
  }
  td.name input,
  td.kana input{
    width: 100%;
  }
  td.phone-number input,
  td.checkindate input,
  td.checkoutdate input,
  td.divingdate input,
  td.tourdate input{
    width: 70%;
  }
  td.mail-address input{
    width: 100%;
  }
  td.remarks textarea{
    line-height: 1.4;
  }
  td.divingdays input,
  td.age input,
  td.career input,
  td.numberOfPeople input{
    width: 10rem;
  }
  td.group textarea{
    line-height: 1.4;
  }
  td.type span.wpcf7-list-item{
    margin: 0.5rem 2rem 0.5rem 0;
    top: 49%;
    transform: translateY(-49%);
  }
  td select{
    width: 100%;
  }
}

/* ==================================================
お問い合わせ
================================================== */
/* inquirySec
-------------------------------------------------- */
section.inquirySec div.content table.table_inquiry{
  width: 100%;
  margin: 0 auto 7rem;
}
section.inquirySec div.content div.text-area{
  margin-bottom: 5rem;
}
@media print, screen and (max-width: 767px) {
  section.inquirySec div.content table.table_inquiry{
    width: 100%;
    margin: 3rem auto 5rem;
  }
}

/* ==================================================
ツアー予約
================================================== */
/* gotoSec
-------------------------------------------------- */
section.gotoSec{
  width: 100%;
  margin: 0 auto 5rem;
}
section.gotoSec div.text-area p{
  text-align: center;
}
section.gotoSec div.img-area{
  margin: 3rem auto;
  width: 85%;
}
section.gotoSec div.img-area img{
  width: 100%;
  height: auto;
}
section.gotoSec div.img-area img:hover{
  opacity: 0.4; 
  transition: 0.6s; 
}
@media print, screen and (max-width: 767px) {
  section.gotoSec div.text-area p{
    text-align: left;
  }
  section.gotoSec div.img-area{
    width: 100%;
  }
}

/* textSec
-------------------------------------------------- */
section.textSec{
  width: 100%;
  margin: 0 auto 5rem;
}

/* requestSec
-------------------------------------------------- */
section.requestSec div.content table.table_request{
  width: 100%;
  margin: 0 auto;
}
section.requestSec div.content p{
  display: none;
}
section.requestSec div.content div.text-area{
  margin-bottom: 5rem;
}
section.requestSec div.content table.table_request th.formtitle{
  font-size: 2.4rem;
  font-weight: bold;
  border-bottom: 1px dotted #333;
  position: relative;
  padding-top: 5rem;
}
section.requestSec div.content table.table_request td input[type=radio]{
  line-height: 2.0;
  height: 2.0em;
}
section.requestSec div.content table.table_request th.stayplan,
section.requestSec div.content table.table_request td.stayplan,
section.requestSec div.content table.table_request th.tourmenu,
section.requestSec div.content table.table_request td.tourmenu{
  padding-top: 3rem;
}
section.requestSec div.content table.table_request th div.att{
  line-height: 1.8;
  margin-top: 1rem;
}
section.requestSec div.content table.table_request span.attention{
  margin-left: 0.3rem;
  line-height: 1.2;
  display: block;
}
section.requestSec div.content div.button-area{
  margin: 7rem auto 0;
}
@media print, screen and (max-width: 767px) {
  section.requestSec div.content table.table_request{
    width: 100%;
    margin: 3rem auto 5rem;
  }
  section.requestSec div.content table.table_request td input{
    line-height: 3.5;
    height: 3.5em;
    padding-left: 1rem;
    border: 1px solid #E5E5E5;
  }
  section.requestSec div.content table.table_request td.stayplan,
  section.requestSec div.content table.table_request td.tourmenu{
    padding-top: 1.5rem;
  }
  section.requestSec div.content table.table_request span.attention{
    font-size: 1.4rem;
  }
}

/* ==================================================
送信完了
================================================== */
/* sendmessageSec
-------------------------------------------------- */
section.sendmessageSec{
  margin-bottom: 8rem;
}
section.sendmessageSec div.content {
  width: 97%;
  margin: 0 auto;
}
section.sendmessageSec table.contactInfo{
    width: 75%;
    margin: 5rem auto 7rem;
    border: 1px solid #C8C8C8;
    border-collapse: collapse;
}
section.sendmessageSec table.contactInfo th {
    text-align: center;
    background-color: #6699FF;
    color: #fff;
    font-weight: normal;
    border: 1px solid #C8C8C8;
    padding: 2.0rem 0 1.8rem;
}
section.sendmessageSec table.contactInfo td {
    text-indent: 1rem;
    border: 1px solid #C8C8C8;
}
@media screen and (max-width: 767px){
  section.sendmessageSec div.content {
    width: 95%;
  }
  section.sendmessageSec table.contactInfo{
      width: 100%;
      margin: 3rem auto 5rem;
      border-collapse: collapse;
  }
  section.sendmessageSec table.contactInfo th{
    width: 100%;
    display: block;
    padding: 1.5rem;
    line-height: 1.5;
    border-top: none;
    border-left: none;
    border-right: none;
    text-align: center;
  }
  section.sendmessageSec table.contactInfo td {
    display: block;
    border: none;
    box-sizing: content-box;
    padding: 1.5rem;
    line-height: 1.5;
    text-align: center;
  }
}

/* ==================================================
プライバシーポリシー
================================================== */
/* "h"tag
-------------------------------------------------- */
h4.h4-privacy{
  font-size: 2.0rem;
  border-bottom :1px solid #B5B5B5;
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
@media print, screen and (max-width: 374px) {
  section.privacySec h3.h3-cmn{
    font-size: 2.0rem;
  }
  h4.h4-privacy{
    font-size: 1.8rem;
  }
}

/* privacySec
-------------------------------------------------- */
section.privacySec div.content div.block{
  margin-bottom: 5rem;
}
section.privacySec div.content ol li{
  margin-left: 1.6rem;
  line-height: 1.6;
}
@media print, screen and (max-width: 767px) {
  section.privacySec{
    margin: 0 auto 8rem;
  }
  section.privacySec div.content{
    width: 95%;
  }
  section.privacySec div.content ol li{
    font-size: 1.4rem;
    line-height: 1.8;
  }
}

/* ==================================================
以下、装飾の指定
================================================== */
/*iPhoneでinput要素にCSSが効かない時 */
input[type="button"],input[type="text"],input[type="email"],input[type="number"],input[type="tel"],input[type="date"],input[type="submit"],textarea{
   -webkit-appearance: none!important;
   border-radius: 0!important;
}