@charset "UTF-8";
/***********************************************/
/* HTML tag styles                             */
/***********************************************/
body {
  background-color: #fff;
  margin: 0;
  min-width: 640px;
  padding: 0;
  text-align: center;
  -webkit-text-size-adjust: none;
}

div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fildset, input, textarea, p, blockquote, table, th, td, address {
  margin: 0;
  padding: 0;
  color: #333;
  font-style: normal;
  font-family: 'M PLUS Rounded 1c', sans-serif,"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
  font-size: 16px;
  line-height: 161%;
  word-wrap: break-word;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  margin-bottom: 40px;
}
table th {
  width: 30%;
  padding: 30px 20px;
  border-top: 1px dotted #ccc;
}
table th.req {
  background: url(../img/contact/hissuIcon.jpg) right 50% no-repeat;
}
table td {
  padding: 30px;
  border-top: 1px dotted #ccc;
}
table th, table td {
  border-bottom: 1px dotted #ccc;
  vertical-align: middle;
}

textarea, input {
  margin: 0;
  padding: 0;
}

caption, th {
  text-align: left;
}

td, th {
  vertical-align: top;
}

fieldset, img, abbr {
  border: none;
}

li {
  list-style-type: none;
}

hr {
  display: none;
}

a {
  color: #00ABEB;
  overflow: hidden;
  text-decoration: none;
}
a:link {
  color: #00ABEB;
  overflow: hidden;
  text-decoration: none;
}
a:visited {
  color: #00ABEB;
}
a:hover {
  color: #00ABEB;
  text-decoration: underline;
}

strong {
  font-weight: bold;
}

img {
  vertical-align: bottom;
}
img.smp {
  display: none;
}

br.smp {
  display: none;
}

input {
  padding: 10px;
  width: 80%;
  vertical-align: middle;
}

textarea {
  width: 100%;
  height: 40px;
}

/***********************************************/
/* layout divs                                 */
/***********************************************/
#wrapper {
  min-width: 1020px;
  position: relative;
  overflow: hidden;
}

/***********************************************/
/* #head style                                 */
/***********************************************/
#head {
  background: url(../img/common/headBg.png) 50% top repeat-x;
  width: 100%;
  position: fixed;
  z-index: 100;
}
#head #inner {
  text-align: left;
  margin: 0 auto;
  height: 140px;
  width: 100%;
  padding-left: 40px;
  box-sizing: border-box;
  position: relative;
}
#head #headLogo {
  position: absolute;
  top: 50px;
  left: 40px;
  width: 300px;
  height: 80px;
  background: url(../img/common/logo.png) left top no-repeat;
  text-indent: -9999px;
  z-index: 999;
}
#head #inner #headLogo a {
  display: block;
  width: 100%;
  height: 100%;
}
#head p#kyach {
  padding: 10px 0 0;
  color: #fff;
  font-size: 80%;
}
#head #telBtn {
  position: absolute;
  top: 10px;
  right: 190px;
  font-size: 200%;
}
#head #telBtn a {
  color: #FF7F00;
  text-decoration: none;
}
#head #reservBtn {
  position: absolute;
  top: 40px;
  right: 0;
  width: 100px;
  height: 100px;
  background: url(../img/common/headerReservIcon.jpg) 50% 20px no-repeat #FFF000;
  text-align: center;
}
#head #reservBtn a {
  display: block;
  width: 100%;
  height: 40px;
  padding: 60px 0 0;
  color: #00ABEB;
  transition: .3s;
}
#head #reservBtn:hover {
  opacity: 0.5;
}
#head #reservBtn:hover > a {
  text-decoration: none;
}
#head #inner #navArea {
  position: absolute;
  top: 70px;
  right: 110px;
}
#head #headContact {
  position: absolute;
  top: 8px;
  right: 40px;
  text-align: right;
  margin-bottom: 10px;
  color: #fff;
}
#head p.openTime, #head #headContactMob {
  display: none;
}
#head #headContact a#mailCont {
  margin-left: 20px;
  width: 100px;
  padding: 0 0 0 45px;
  background: url(../img/common/headMailIcon.png) left 50% no-repeat #00ABEB;
  color: #fff;
  text-decoration: none;
}
#head #headContact a#mobCont {
  font-weight: normal;
  color: #fff;
  padding: 3px 0 3px 25px;
  background: url(../img/common/headMobIcon.png) left 50% no-repeat;
  margin-left: 20px;
}
#head #headContact a#telCont {
  font-weight: normal;
  color: #fff;
  padding: 3px 0 3px 25px;
  background: url(../img/common/headMobIcon.png) left 50% no-repeat;
  margin-left: 20px;
  background: url(../img/common/headTelIcon.png) left 50% no-repeat;
}
#head #headContact a#mobCont:hover, #head #headContact a#telCont:hover {
  text-decoration: none;
}
#head #linkArea ul {
  text-align: right;
}
#head #linkArea ul li {
  display: inline-block;
  padding: 7px 0 7px 18px;
  margin-left: 20px;
  background: url(../img/common/listIcon.jpg) left 50% no-repeat;
}
#head #linkArea ul:before {
  content: "";
  display: table;
}
#head #linkArea ul:after {
  content: "";
  display: table;
  clear: both;
}
#head #inner:before {
  content: "";
  display: table;
}
#head #inner:after {
  content: "";
  display: table;
  clear: both;
}
#head #menuBtn {
  display: none;
}
#head #navArea ul#gnav li {
  float: left;
  border-left: 1px dotted #00ABEB;
}
#head #navArea ul#gnav li:hover {
  background-color: #FFF000;
}
#head #navArea ul#gnav li:hover > a {
  text-decoration: none;
}
#head #navArea ul#gnav li span {
  display: block;
}
#head #navArea ul#gnav li span a {
  display: block;
}
#head #navArea ul#gnav li .navChild {
  display: none;
  position: fixed;
  top: 100px;
  left: 0;
  width: 100%;
  background-color: #333;
  color: #fff;
  z-index: 5;
}
#head #navArea ul#gnav li a {
  display: block;
  padding: 10px 20px;
}
#head #navArea ul#gnav li .navChild .inner {
  color: #fff;
  margin: 0 auto;
}
#head #navArea ul#gnav li .navChild .inner ul {
  padding-left: 200px;
}
#head #navArea ul#gnav li .navChild .inner ul li {
  padding: 20px;
  margin-right: 20px;
  height: auto;
}
#head #navArea ul#gnav li .navChild .inner ul li a {
  font-weight: bold;
  color: #fff;
}

/***********************************************/
/* #foot style                                 */
/***********************************************/
#contactBtn {
  display: none;
}

#bannerArea {
  padding: 40px 0;
  background: url(../img/common/bannerAreaBg.jpg) 50% top no-repeat;
}
#bannerArea .h2cont {
  margin: 0 auto;
  width: 1020px;
}
#bannerArea h3 {
  color: #fff;
  margin-bottom: 40px;
  font-size: 161%;
}
#bannerArea .h2cont p {
  width: 240px;
  margin-right: 20px;
  float: left;
}
#bannerArea .h2cont p.lineBtn a {
  background-color: #06C755;
}
#bannerArea .h2cont:before {
  content: "";
  display: table;
}
#bannerArea .h2cont:after {
  content: "";
  display: table;
  clear: both;
}
#bannerArea .h2cont p:last-child {
  margin: 0;
}
#bannerArea .h2cont p.btn a {
  padding: 30px 0;
}
#bannerArea .h2cont p.btn:last-child > a {
  background-color: #FFDE00;
  color: #00ABEB;
}

#foot {
  background-color: #333;
  padding: 40px 0;
}
#foot .inner {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#foot .inner .corpInfo {
  width: 340px;
  box-sizing: border-box;
  padding-right: 40px;
  border-right: 1px dotted #fff;
  margin-right: 40px;
}
#foot .inner .corpInfo .leftArea {
  text-align: left;
  margin-bottom: 40px;
}
#foot .inner .corpInfo #afetyBanner {
  text-align: left;
}
#foot .inner .corpInfo #afetyBanner img {
  margin-bottom: 20px;
}
#foot .inner .corpInfo p {
  color: #fff;
  margin-bottom: 20px;
}
#foot .inner .corpInfo p.address {
  margin: 0;
}
#foot .inner #linkArea {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 550px;
}
#foot .inner #linkArea h3 {
  text-align: left;
  color: #fff;
  margin-bottom: 20px;
}
#foot .inner #linkArea ul {
  width: 255px;
  box-sizing: border-box;
}
#foot .inner #linkArea ul li {
  width: 270px;
  box-sizing: border-box;
}
#foot .inner ul li {
  margin-bottom: 20px;
  width: 245px;
  text-align: left;
}
#foot .inner ul li a {
  color: #fff;
  font-size: 80%;
}
#foot .inner .facebookArea {
  float: right;
}

address {
  padding: 10px 0;
  width: 100%;
  background-color: #000;
  color: #fff;
}

/***********************************************/
/* #main style                                 */
/***********************************************/
a:hover img {
  opacity: .7;
  -webkit-opacity: .7;
  -moz-opacity: .7;
  filter: alpha(opacity=70);
  /* IE lt 8 */
  -ms-filter: "alpha(opacity=70)";
  /* IE 8 */
}
a img {
  -webkit-transition: opacity 0.5s ease-out;
  -moz-transition: opacity 0.5s ease-out;
  -ms-transition: opacity 0.5s ease-out;
  transition: opacity 0.5s ease-out;
}

#main {
  margin: 0 auto;
  padding: 0;
  position: relative;
  text-align: left;
}

#pageTop {
  position: fixed;
  right: 40px;
  bottom: 40px;
  z-index: 1;
}
#pageTop a {
  background: url(../img/common/pageTop.png) no-repeat 0 0;
  height: 105px;
  display: block;
  text-indent: -10000px;
  width: 105px;
}

h1 {
  z-index: 0;
}

#h1Area {
  padding: 300px 0 100px;
  background: url(../img/common/sech1Bg.jpg) 50% top no-repeat;
  margin-bottom: 80px;
}

h1 {
  padding: 0 40px;
  font-size: 261%;
  margin: 0 auto 20px;
  color: #fff;
  line-height: 120%;
  font-weight: normal;
}
h1 span {
  font-size: 62%;
  color: #FFF000;
}

h2 {
  margin-bottom: 40px;
  font-size: 161%;
  text-align: center;
  font-weight: normal;
  line-height: 200%;
}
h2.w100H2 {
  width: 100%;
  padding: 0 0 70px;
  font-size: 161%;
  color: #00ABEB;
  line-height: 120%;
}
h2.w100H2 span {
  color: #FFDE00;
  font-size: 66%;
}
h2 span {
  color: #00ABEB;
  font-size: 161%;
}

img.h2Icon {
  display: block;
  text-align: center;
  margin: 0 auto 20px;
}

.btn {
  width: 313px;
  text-align: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  background: #fff;
  border-radius: 10px;
}
.btn a {
  display: block;
  padding: 20px 20px;
  color: #fff;
  background-color: #00ABEB;
  font-size: 100%;
  text-decoration: none;
  transition: 0.3s;
  border-radius: 10px;
}
.btn a:hover {
  opacity: 0.5;
}

.inner {
  width: 1020px;
  margin: 0 auto;
}

.content_outline {
  max-width: 1020px;
  margin: 0 auto 40px;
}

/***********************index***********************/
.flowArea {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png), url(../img/course/marine/common/sectionBg.jpg);
  background-position: 50% top, left 50% bottom -140px;
  background-repeat: no-repeat, repeat-x;
}

#index #main {
  width: 100%;
}
#index #vaslider {
  position: relative;
  margin-top: 40px;
  width: 100%;
  height: 100vh;
  max-height: 1020px;
  min-height: 890px;
  z-index: 0;
}
#index #vaslider p.todayIcon {
  position: absolute;
  bottom: 10px;
  left: 0;
  right: 0;
  z-index: 2;
}
#index #vaslider .flexslider {
  width: 100%;
  height: 100vh;
  max-height: 1020px;
  z-index: 0;
}
#index #videoArea {
  position: relative;
  width: 100%;
  height: 100vh;
}
#index #videoArea h1 {
  position: relative;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  z-index: 1;
  padding: 0;
  font-size: 100%;
  border: none;
  background: url(../img/index/va/h1bg.png);
}
#index #videoArea h1 img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: auto;
  height: 203px;
}
#index #videoArea p.reserveIcon {
  position: absolute;
  bottom: 40px;
  left: -822px;
  right: 0;
  margin: auto;
  padding: 0;
  font-size: 100%;
  border: none;
  width: 22.8vh;
  height: 22.8vh;
  z-index: 3;
}
#index #videoArea p.reserveIcon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#index #videoArea p.nextIcon {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  z-index: 100;
  padding: 0;
  font-size: 100%;
  border: none;
}
#index #videoArea video {
  margin: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: visible;
  opacity: 1;
  width: 110%;
  height: auto;
  min-height: 100vh;
  z-index: 0;
}
#index .smahoSlider {
  display: none;
}
#index .flexslider ul.slides {
  width: 100%;
  height: 100vh;
}
#index .flexslider ul.slides li {
  width: 100%;
  height: 100vh;
  max-height: 1020px;
  position: relative;
  overflow: hidden;
}
#index .flexslider ul.slides li img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  height: 100vh;
  max-height: 1020px;
  min-height: 100%;
}
#index .aboutArea .inner {
  padding: 80px 40px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
#index .aboutArea .inner figure {
  display: flex;
  flex-wrap: wrap;
  width: 50%;
  padding: 0;
  margin: 0;
}
#index .aboutArea .inner figure img {
  width: 32%;
  margin-right: 1%;
  height: auto;
  min-height: 540px;
  object-fit: cover;
  border-radius: 20px;
}
#index .aboutArea .inner figure img:last-child {
  margin: 0;
}
#index .aboutArea .inner .detail {
  width: 50%;
  padding: 0 80px;
  box-sizing: border-box;
}
#index .aboutArea .inner .detail figure {
  text-align: left;
  height: auto;
  margin: 0 0 40px;
}
#index .aboutArea .inner .detail figure img {
  width: 290px;
  height: auto;
  min-height: inherit;
  object-fit: none;
}
#index .aboutArea .inner .detail h1 {
  width: 70%;
  padding: 0;
  margin: 0 0 40px;
  color: #00ABEB;
  font-size: 220%;
  line-height: 161%;
}
#index .aboutArea .inner .detail p {
  width: 70%;
  padding: 0;
  margin: 0;
  line-height: 200%;
}
#index #parasailing p.reed {
  color: #fff;
}
#index #choice {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png), url("../img/index/choice/bgImg03.jpg");
  background-position: 50% top, 50% 50%;
  background-size: auto , cover;
  background-repeat: no-repeat, no-repeat;
}
#index #choice p.reed {
  color: #fff;
  margin-bottom: 80px;
}
#index #choice .inner {
  width: 1020px;
  padding: 0 0 160px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  box-sizing: border-box;
}
#index #choice .inner item {
  text-align: center;
  padding: 40px;
  background-color: #FFF;
  width: 313px;
  box-sizing: border-box;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  margin-bottom: 80px;
}
#index #choice .inner item p.num {
  border: 5px solid #fff;
  font-size: 259%;
  color: #fff;
  font-weight: bold;
  margin: -90px auto 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  background-color: #FF7F00;
  border-radius: 50%;
}
#index #choice .inner item img {
  margin-bottom: 20px;
}
#index #choice .inner item h3 {
  font-size: 140%;
  color: #008FE1;
  font-weight: bold;
  margin-bottom: 20px;
}
#index #choice .inner item p {
  text-align: left;
}
#index #choice .inner item:nth-child(4), #index #choice .inner item:nth-child(5), #index #choice .inner item:nth-child(6) {
  margin-bottom: 0;
}
#index .flowArea .inner {
  padding: 0 0 80px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#index .flowArea .inner .flowList {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 80px;
}
#index .flowArea .inner p.btn {
  margin: 0 auto;
}
#index .flowArea .inner .flowList .flowCont {
  width: 200px;
  padding-right: 40px;
  align-items: center;
  background: url("../img/index/flow/nextAlor.png") right 0 top 130px no-repeat;
}
#index .flowArea .inner .flowList .flowCont:last-child {
  background: none;
  padding: 0;
  margin: 0;
}
#index .flowArea .inner .flowList .flowCont:first-child > .flowNum, #index .flowArea .inner .flowList .flowCont:last-child > .flowNum {
  border-color: #FF7F00;
  color: #FF7F00;
}
#index .flowArea .inner .flowList .flowCont img {
  width: 200px;
  margin-right: 40px;
  border-radius: 10px;
  margin-bottom: 10px;
}
#index .flowArea .inner .flowList .flowCont dl dt {
  font-size: 161%;
  margin-bottom: 10px;
  text-align: center;
  color: #00ABEB;
}
#index .flowArea .inner .flowList .flowCont .flowNum {
  text-align: center;
  font-size: 161%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #00ABEB;
  width: 60px;
  height: 60px;
  border: 4px solid #00ABEB;
  border-radius: 50%;
  margin: 0 auto 10px;
}
#index .flowArea .inner .flowList .flowCont p {
  text-align: left;
  width: 670px;
  font-size: 140%;
}
#index #access {
  padding-top: 40px 0 80px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#index #insta {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#index #insta .inner {
  margin-bottom: 80px;
}
#index #insta .inner ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#index #insta .inner ul li {
  width: 196px;
  height: 196px;
  margin-bottom: 10px;
}
#index #insta .inner ul li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#index #insta p.btn {
  margin: 0 auto 80px;
}
#index .faqArea {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#index .faqArea .inner {
  padding: 40px 0 80px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#index .faqArea .inner dl {
  width: 49%;
  margin-bottom: 40px;
  box-sizing: border-box;
  border-bottom: 1px dotted #00ABEB;
  cursor: pointer;
}
#index .faqArea .inner dl:last-child {
  border-bottom: 3px solid #00ABEB;
}
#index .faqArea .inner dl dt {
  padding: 30px 40px 30px 70px;
  background: url(../img/faq/QIcon.png) left 20px top 50% #E5F6FD no-repeat;
  font-weight: bold;
}
#index .faqArea .inner dl dd {
  padding: 30px 0 30px 50px;
  background: url(../img/faq/AIcon.png) left top 30px no-repeat;
}
#index .faqArea .inner p.btn {
  margin: 0 auto;
}
#index #blog {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#index #blog .inner {
  width: 1020px;
  margin: 0 auto 40px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#index #blog .inner .blogItem {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  flex-wrap: wrap;
  width: 490px;
  margin-bottom: 40px;
  transition: 0.3s;
}
#index #blog .inner .blogItem:hover {
  opacity: 0.5;
}
#index #blog .inner .blogItem p.imgArea, #index #blog .inner .blogItem dl {
  display: inline-block;
}
#index #blog .inner .blogItem p.imgArea {
  margin-right: 20px;
  height: 160px;
  width: 160px;
  border-radius: 50%;
  overflow: hidden;
}
#index #blog .inner .blogItem p.imgArea img {
  object-fit: cover;
  width: 160px;
  height: 160px;
}
#index #blog .inner .blogItem dl {
  width: 310px;
}
#index #blog .inner .blogItem dl dt {
  font-weight: bold;
  margin-bottom: 12px;
  color: #00ABEB;
}
#index #blog .inner .blogItem dl dd {
  margin-bottom: 12px;
}
#index #blog .inner .blogItem dl dd.date {
  color: #FF7F00;
}
#index #blog .inner .blogItem a.linkArea {
  position: absolute;
  width: 100%;
  height: 100%;
  text-indent: -9999px;
}
#index #blog p.btn {
  margin: 0 auto 80px;
}
#index p.reed {
  text-align: center;
  margin-bottom: 40px;
}

/*************course*************/
section#recruit {
  padding: 80px 0;
  background-color: #E5F6FD;
}
section#recruit .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  border-radius: 10px;
  width: 1200px;
}
section#recruit .inner figure {
  display: block;
  padding: 0;
  margin: 0;
  width: 50%;
  height: 100%;
}
section#recruit .inner figure img {
  border-radius: 10px 0 0 10px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
section#recruit .inner .detail {
  background-color: #fff;
  padding: 40px;
  width: 50%;
  box-sizing: border-box;
  border-radius: 0 10px 10px 0;
}
section#recruit .inner .detail h2 {
  padding: 30px 0 10px;
  margin-bottom: 20px;
  background: url("../img/index/recruit/beginner.jpg") 50% top no-repeat;
  border-bottom: 3px solid #00ABEB;
  font-size: 200%;
  font-weight: bold;
  color: #00ABEB;
}
section#recruit .inner .detail p {
  margin-bottom: 20px;
  text-align: center;
}
section#recruit .inner .detail p strong {
  text-align: center;
  font-weight: bold;
  color: #00ABEB;
}
section#recruit .inner .detail p.btn {
  width: 100%;
  margin: 0 auto;
}
section#parasailing {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png), url(../img/course/parasailing/common/sectionBg.jpg);
  background-position: 50% top, 50% top;
  background-repeat: no-repeat, repeat-x;
}

/*************course*************/
#setcourse {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#setcourse .inner {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#setcourse .inner .courseItem {
  margin: 0 20px 40px;
}

#parasailing .inner {
  width: 1420px;
  padding-top: 60px;
}

#marineSports {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png), url(../img/course/marine/common/sectionBg.jpg);
  background-position: 50% top, 50% bottom;
  background-repeat: no-repeat, repeat-x;
}

#marineSports .inner {
  width: 100%;
  justify-content: center;
}

.courseList .inner {
  width: 1080px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -webkit-flex-pack: justify;
  -moz-flex-pack: justify;
  -ms-flex-pack: justify;
  padding-bottom: 40px;
  flex-wrap: wrap;
}
.courseList .inner .courseItem {
  position: relative;
  width: 313px;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  background-color: #fff;
  transition: 0.3s;
  margin-bottom: 40px;
  padding-bottom: 20px;
  background: url(../img/course/common/moreBg.jpg) 50% bottom no-repeat #fff;
  margin-right: 40px;
}
.courseList .inner .courseItem:nth-child(4n) {
  margin-right: 0;
}
.courseList .inner .courseItem:hover {
  opacity: 0.5;
}

p.kyachIcon {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 90px;
  left: -36px;
  min-width: 129px;
  min-height: 110px;
  box-sizing: border-box;
  padding: 33px 32px;
  text-align: center;
  color: #fff;
  line-height: 120%;
  font-size: 100%;
  background: url(../img/course/common/kyachIconBg.png) 50% 50% no-repeat;
}
p.kyachIcon3 {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 90px;
  left: -36px;
  min-width: 129px;
  min-height: 110px;
  box-sizing: border-box;
  padding: 33px 32px;
  text-align: center;
  color: #fff;
  line-height: 120%;
  font-size: 100%;
  background: url(../img/course/common/kyachIconBg.png) 50% 50% no-repeat;
  background: url(../img/course/common/kyachIconSPBg.png) 50% 50% no-repeat;
}

.courseItem:nth-child(3n) > p.kyachIcon {
  background: url(../img/course/common/kyachIconSPBg.png) 50% 50% no-repeat;
}

.courseList .inner .courseItem img {
  width: 100%;
  border-radius: 10px 10px 0 0;
}
.courseList .inner .courseItem dl {
  padding: 20px;
}
.courseList .inner .courseItem dl dt {
  font-size: 140%;
  text-align: center;
  color: #00ABEB;
  margin-bottom: 20px;
}
.courseList .inner .courseItem dl dd {
  margin-bottom: 20px;
}
.courseList .inner .courseItem dl dd.price, .courseList .inner .courseItem dl dd.priceOff {
  text-align: right;
}
.courseList .inner .courseItem dl dd.price .priceNum, .courseList .inner .courseItem dl dd.priceOff span {
  font-size: 161%;
  color: #FF7F00;
  margin-bottom: 0;
}
.courseList .inner .courseItem dl dd.price .priceNum {
  font-weight: bold;
}
.courseList .inner .courseItem dl dd.priceOff {
  background-color: #FFF000;
  padding: 10px;
}
.courseList .inner .courseItem dl dd.priceOff span {
  font-size: 140%;
  color: #00ABEB;
}
.courseList .inner .courseItem p.detailLink {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.courseList .inner .courseItem p.detailLink a {
  display: block;
  width: 100%;
  height: 100%;
  text-indent: -9999px;
}

#setImg ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -webkit-flex-pack: justify;
  -moz-flex-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
}
#setImg ul li {
  width: 20%;
}
#setImg ul li img {
  width: 100%;
}

/*************ACCESS*************/
#company figure.mapImg {
  margin: 0 auto 80px;
  padding: 0;
  text-align: center;
}
#company figure.mapImg img {
  max-width: 740px;
  height: auto;
  margin: 0 auto;
}

#access .inner {
  margin: 0 auto 40px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  flex-wrap: wrap;
}
#access .inner dl {
  width: 490px;
  margin-bottom: 20px;
}
#access .inner dl dt {
  padding: 10px 20px;
  width: 110px;
  margin-right: 20px;
  background-color: #00ABEB;
  border-radius: 10px;
  text-align: center;
  color: #fff;
  display: inline-block;
  vertical-align: middle;
}
#access .inner dl dd {
  display: inline-block;
  vertical-align: middle;
}
#access p {
  margin-bottom: 40px;
  text-align: center;
}
#access #googleMap {
  margin-bottom: 80px;
}
#access p.btn {
  margin: 0 auto;
  border-radius: 10px;
  margin-bottom: 80px;
}

/*************STAFF BLOG*************/
.comBanner {
  margin-bottom: 40px;
  text-align: center;
}
.comBanner a {
  display: block;
  margin: 0 auto;
}

/*************FAQ*************/
#faq section ul.janpLink {
  margin-bottom: 80px;
}
#faq section ul.janpLink li {
  float: left;
  text-align: center;
  width: 489px;
  height: 120px;
  border: 1px solid #00ABEB;
  margin-right: 38px;
}
#faq section ul.janpLink li:last-child {
  margin-right: 0;
}
#faq section ul.janpLink li a {
  display: block;
  width: 100%;
  height: 100px;
  padding-top: 20px;
  background: url(../img/faq/janpBg.png) 50% 20px no-repeat;
  background-position: left 50% bottom 15px;
}
#faq section ul.janpLink li a:hover {
  text-decoration: none;
  background-color: #F9FDFF;
}
#faq section ul.janpLink:before {
  content: "";
  display: table;
}
#faq section ul.janpLink:after {
  content: "";
  display: table;
  clear: both;
}

#faq, #faq #h201 {
  margin-bottom: 80px;
}

#faq h2 {
  margin-bottom: 0;
  padding-bottom: 40px;
  border-bottom: 3px solid #00ABEB;
}

.faq dl {
  padding: 0 40px 0 40px;
  border-bottom: 1px dotted #00ABEB;
  cursor: pointer;
}
.faq dl:last-child {
  border-bottom: 3px solid #00ABEB;
}
.faq dl dt {
  padding: 30px 0 30px 50px;
  background: url(../img/faq/QIcon.png) left 50% no-repeat;
  font-weight: bold;
}
.faq dl dd {
  border-top: 1px dotted #ccc;
  padding: 30px 0 30px 50px;
  background: url(../img/faq/AIcon.png) left top 30px no-repeat;
}

/***********************course LIST***********************/
#courseList #main {
  width: 100%;
  margin-bottom: 80px;
}
#courseList #parasailing {
  background: none;
}

/***********************course***********************/
#course .cont {
  width: 1020px;
  margin: 0 auto;
  padding-bottom: 80px;
}
#course #point {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png), url("../img/course/parasailing/100m/pointBg.png");
  background-position: 50% top, 50% top;
  background-repeat: no-repeat, no-repeat;
}
#course #point .cont {
  width: 1020px;
  margin: 0 auto 40px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#course #point .cont .pointcont {
  position: relative;
  width: 313px;
}
#course #point .cont .pointcont p.kyachIcon {
  top: 220px;
}
#course #point .cont .pointcont p img {
  margin-bottom: 20px;
}
#course #point .cont .pointcont dl dt {
  font-size: 161%;
  text-align: center;
  color: #00ABEB;
  margin-bottom: 16px;
}
#course #imgArea {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#course #imgArea .cont {
  width: 1020px;
  margin: 0 auto;
  padding-bottom: 80px;
}
#course #imgArea .cont .mainVisual {
  margin-bottom: 40px;
}
#course #imgArea .cont .mainVisual .flex-viewport {
  height: 565px;
  margin-bottom: 10px;
}
#course #imgArea .cont .mainVisual .flex-control-thumbs li {
  width: 194px;
  margin-right: 10px;
}
#course #imgArea .cont section {
  margin-bottom: 80px;
}
#course #imgArea .cont section#disc {
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px dotted #00ABEB;
}
#course #imgArea .cont h2.kyach {
  font-size: 161%;
  color: #00ABEB;
}
#course #flow {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#course #flow .flowCont {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding-bottom: 40px;
  background: url(../img/course/common/flowNextIcon.jpg) 180px bottom no-repeat;
  margin-bottom: 20px;
}
#course #flow .flowCont:last-child {
  background: none;
}
#course #flow .flowCont:first-child > .flowNum, #course #flow .flowCont:last-child > .flowNum, #course #flow .flowCont:first-child > p, #course #flow .flowCont:last-child > p {
  border-color: #FF7F00;
  color: #FF7F00;
}
#course #flow .flowCont img {
  width: 200px;
  margin-right: 40px;
  border-radius: 10px;
}
#course #flow .flowCont .flowNum {
  line-height: 100%;
  text-align: center;
  font-size: 161%;
  color: #00ABEB;
  width: 40px;
  height: 40px;
  padding: 30px 20px 10px;
  border: 4px solid #00ABEB;
  border-radius: 50%;
  margin-right: 40px;
}
#course #flow .flowCont p {
  text-align: left;
  width: 670px;
  font-size: 140%;
}
#course #movie {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png), url("../img/course/common/movieBg.jpg");
  background-position: 50% top, 50% top;
  background-repeat: no-repeat, no-repeat;
}
#course #fee {
  padding-top: 40px;
  background-image: url(../img/common/w100H2Bg.png);
  background-position: 50% top;
  background-repeat: no-repeat;
}
#course #fee .payArea {
  display: flex;
}
#course #fee dl {
  width: 500px;
  margin-right: 20px;
  margin-bottom: 40px;
  border-bottom: 1px dotted #00ABEB;
  text-align: center;
}
#course #fee dl.time {
  margin-right: 0;
}
#course #fee dl dt {
  padding: 20px;
  background-color: #00ABEB;
  font-size: 161%;
  color: #fff;
}
#course #fee dl dd {
  padding: 20px;
  font-size: 161%;
}
#course #fee dl dd strong {
  font-weight: bold;
  color: #FF7F00;
}
#course #fee dl dd span {
  font-size: 64%;
}
#course #h1Area {
  margin-bottom: 0;
}
#course #googleMap {
  margin-bottom: 80px;
}
#course #reserv p.btn {
  width: 100%;
}
#course #reserv p.btn a {
  padding: 30px;
  background-color: #FF7F00;
  font-size: 161%;
}

#h1Area .cont {
  width: 840px;
  position: relative;
  margin: 0 auto;
}
#h1Area .cont p.kyachIcon {
  position: absolute;
  top: -90px;
  left: -20px;
}

#h1Area .cont p.kyachIcon {
  background: url(../img/course/common/kyachIconSPBg.png) 50% 50% no-repeat;
}

#h1Area .cont h1 {
  border-width: 0 0 3px 0;
}
#h1Area .cont p.kyach {
  border-top: 2px solid #fff;
  padding-top: 20px;
  color: #fff;
}

.movie-wrap {
  position: relative;
  padding-bottom: 56.25%;
  /*アスペクト比 16:9の場合の縦幅*/
  height: 0;
  overflow: hidden;
}
.movie-wrap:first-child {
  margin-bottom: 40px;
}
.movie-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

span.gentei {
  color: #00ABEB;
}

table tr:first-child {
  border-top: 2px solid #00ABEB;
}
table tr th, table tr td {
  border-bottom: 1px dotted #00ABEB;
}
table tr:last-child {
  border-bottom: 2px solid #00ABEB;
}

/******************STAFF******************/
#staff .staffDetail {
  width: 313px;
  float: left;
  margin: 0 40px 40px 0;
  min-height: 630px;
}
#staff .staffDetail:nth-child(3n) {
  margin-right: 0;
}
#staff .staffDetail img {
  margin-bottom: 10px;
}
#staff .staffDetail dl dt, #staff .staffDetail dl dd {
  margin-bottom: 10px;
}
#staff .staffDetail img {
  border-radius: 50%;
}
#staff .staffDetail dl dt {
  font-size: 161%;
  text-align: center;
}
#staff .staffDetail dl dd {
  text-align: center;
}
#staff .staffDetail dl dt span {
  font-size: 62%;
  color: #00ABEB;
}

/******************ACCESS******************/
#access #main {
  width: 1020px;
}
#access section {
  margin-bottom: 80px;
}

#access p {
  margin-bottom: 40px;
  text-align: center;
}
#access p.telNum {
  font-size: 261%;
}
#access h3 {
  width: 100%;
  margin: 0 auto 40px;
  font-size: 161%;
  color: #00ABEB;
  text-align: center;
  padding: 20px;
  background-color: #E5F6FD;
  box-sizing: border-box;
}
#access ol li {
  text-align: center;
  padding: 0 0 65px;
  margin-bottom: 30px;
  background: url(../img/access/alorIcon.jpg) 50% bottom no-repeat;
}
#access ol li:last-child {
  background: none;
  padding-bottom: none;
  margin-bottom: 40px;
}

/******************contact******************/
#contact #main {
  width: 1020px;
  margin: 0 auto 40px;
}
#contact #h201 table tr td.select label {
  display: block;
  padding: 10px 20px;
  border: 1px solid #ccc;
  background-color: #f5f5f5;
}
#contact #h201 table tr td.select input {
  width: 20px;
  height: 20px;
  margin-right: 10px;
}
#contact #h201 table tr td.postcode {
  border-bottom: none;
}
#contact #h201 table tr td.address {
  border-top: none;
  padding-top: 0;
}
#contact #h201 p {
  margin-bottom: 80px;
}
#contact #h201 .btn {
  margin: 0 auto 80px;
}
#contact #h201 .btn input {
  display: block;
  padding: 20px 20px;
  color: #fff;
  background-color: #FF7F00;
  font-size: 140%;
  text-decoration: none;
  transition: 0.3s;
  width: 100%;
  border: none;
  height: auto;
}
#contact #h201 .btn input:hover {
  opacity: 0.5;
}

.sizeSmall input {
  width: 20%;
}

#contact #mfp_overlay {
  width: 100%;
}
#contact #mfp_overlay_inner {
  padding: 40px;
  margin: 0 auto;
}

#mfp_overlay_inner h4 {
  font-size: 140%;
  padding: 40px;
}

table#mfp_confirm_table tr th, table#mfp_confirm_table tr td {
  padding: 20px !important;
  border-top: 1px dotted #ccc !important;
}

div.mfp_buttons button {
  display: block;
  padding: 20px;
  color: #fff;
  background-color: #FF7F00;
  font-size: 140%;
  text-decoration: none;
  transition: 0.3s;
  border: none;
  height: auto;
  width: 43%;
  float: left;
  margin: 20px;
}
div.mfp_buttons button:hover {
  opacity: 0.5;
}
div.mfp_buttons button#mfp_button_cancel {
  background-color: #ccc;
}
div.mfp_buttons:before {
  content: "";
  display: table;
}
div.mfp_buttons:after {
  content: "";
  display: table;
  clear: both;
}

/******************thanks******************/
#thanks #main {
  width: 1020px;
  margin: 0 auto 80px;
}
#thanks section .btn {
  margin: 80px auto;
}
#thanks section .btn a {
  background-color: #FF7F00;
}

/******************個人情報保護******************/
#discPage #main section h2 {
  font-size: 140%;
  background-color: #E5F6FD;
  text-align: left;
  padding: 10px 20px;
}
#discPage #main section p {
  margin-bottom: 40px;
}
#discPage #main section ul {
  margin-bottom: 40px;
  margin-left: 20px;
}
#discPage #main section ul li {
  margin-bottom: 20px;
  list-style-type: square;
}

/******************サイトマップ******************/
#sitemap #main {
  max-width: 1020px;
}
#sitemap #main section {
  margin-bottom: 80px;
}
#sitemap #main section ul li {
  width: 100%;
  border-bottom: 1px dotted #00ABEB;
}
#sitemap #main section ul li:first-child {
  border-top: 1px dotted #00ABEB;
}
#sitemap #main section ul li a {
  display: block;
  widows: 100%;
  height: 100%;
  padding: 20px;
}

/******************会社概要******************/
#company #main {
  width: 1020px;
}
#company #main #googleMap {
  margin-bottom: 80px;
}

/*********************** BLOG LIST ***********************/
.post_list {
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  background-color: #fff;
  transition: 0.3s;
  margin-bottom: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
}
.post_list:hover {
  opacity: 0.7;
}
.post_list .subtitle {
  margin-bottom: 20px;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
}
.post_list .subtitle h2 {
  border-radius: 10px 10px 0 0;
  margin-bottom: 0;
  width: 100%;
}
.post_list p.spcen {
  width: 220px;
  padding: 0 20px 20px 20px;
  box-sizing: border-box;
}
.post_list p.spcen a img {
  width: 180px;
  height: 180px;
  object-fit: cover;
}
.post_list .desc_area {
  width: 467px;
  margin: 0 20px 0 0;
}
.post_list a.read_more {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-indent: -99999px;
}

.tumb_l a img {
  border-radius: 50%;
}

.side-head {
  padding: 10px 0;
  text-align: center;
  background-color: #D9F2FC;
  margin-bottom: 20px;
  border-radius: 10px;
}

.rarti {
  padding-bottom: 20px;
  border-bottom: 1px dotted #00ABEB;
  margin-bottom: 20px;
}

/*********************** BLOG DETAIL ***********************/