/*all*/

section {
  padding: 50px 0;
  margin: 0 auto;
}


h2.main_title {
  font-size: 24px;
  letter-spacing: 0.15em;
  line-height: 40px;
  text-align: center;
  color: #505050;
  display: block;
}

h2.main_title span.sub_title {
  font-size: 16px;
  letter-spacing: 0.15em;
  text-align: center;
  line-height: 16px;
  color: #3ac5ce;
  margin-bottom: 30px;
  display: block;
}


h2.main_title span.title.img01 {
  width: 30px;
  display: block;
  text-align: center;
  margin: 0 auto;
  line-height: 1;
  margin-bottom: 10px;
}


.img_box {
  animation: img_box_9955 3s linear infinite;
  transform-origin: 50% 50%;
  margin: 1rem 0 !important;
}

.img_box.other {
  animation: img_box_9955 5s linear infinite;
  transform-origin: 50% 50%;
  margin: 1rem 0 !important;
}

@keyframes img_box_9955 {
  0% {
    transform: translateY(0)
  }

  33.33333% {
    transform: translateY(-10px)
  }

  66.66667% {
    transform: translateY(0)
  }

  100% {
    transform: translateY(0)
  }
}


h2.main_title span.title.img01 img {
  width: 100%;
}

h3.txt {
  font-size: 16px;
  color: #505050;
  line-height: 44px;
  letter-spacing: 0.15em;
  text-align: center;
}

#section01 .btn01 .btn-square {
  background: #3ac5ce;
}

/*button*/

.btn01 {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.15em;
  line-height: 1;
  margin: 0 auto;
  text-align: center;
}


.btn-square {
  display: inline-block;
  padding: 15px 30px;
  text-decoration: none;
  background: #247ab6;
  /*ボタン色*/
  color: #FFF;
  border-bottom: solid 5px #dddddd;
  border-radius: 10px;
}

.btn-square:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
  /*下に動く*/
  border-bottom: none;
  /*線を消す*/
}

.arrow01 {
  position: relative;
  padding-left: 22px;
}

.arrow01::before {
  position: absolute;
  content: '';
  width: 16px;
  height: 16px;
  border: 2px solid #fff;
  border-radius: 50%;
  top: 50%;
  left: 0;
  margin-top: -9px;
  margin-left: 10px;
}

.arrow01::after {
  position: absolute;
  content: '';
  width: 4px;
  height: 4px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 50%;
  left: 6px;
  margin-top: -1.6px;
  margin-left: 10px;
}


/*section01*/

#section01 {
  position: relative;
  background: linear-gradient(#fff, #ebf9fa);
  overflow: hidden;
}

#section01 .bg_left {
  position: absolute;
  top: 50%;
  left: 0;
  width: 28vw;
  transform: translateY(-50%);
  -webkit- transform: translateY(-50%);
  animation: 3.5s Roll ease-in-out infinite;
}

#section01 .bg_right {
  position: absolute;
  top: 50%;
  right: 0;
  width: 28vw;
  transform: translateY(-50%);
  -webkit- transform: translateY(-50%);
  animation: 3.5s Roll ease-in-out infinite;
}

#section01 h2.main_title {
  font-size: 30px;
  letter-spacing: 0.15em;
  line-height: 42px;
  text-align: center;
  color: #505050;
  margin-bottom: 30px;
}

#section01 h3.txt {
  margin-bottom: 30px;
}

#section01 p.txt {
  font-size: 32px;
  color: #505050;
  letter-spacing: 0.1em;
  text-align: center;
  font-weight: 600;
  font-style: italic;
  margin-bottom: 50px;
}


/*section02*/

#section02 {
  position: relative;
  background: #fff;
  margin: 0 auto;
  text-align: center;
  overflow-x: hidden;
}

#section02 h2.main_title span.title.img01 {
  width: 32px;
  display: block;
  text-align: center;
  margin: 0 auto;
  line-height: 1;
  margin-bottom: 5px !important;
}

#section02 .cruiseList.top {
  background: linear-gradient(#fff, #ebf9fa);
  padding-bottom: 50px;
  margin-bottom: 50px;
}

.cruiseList .title {
  justify-content: center;
  display: flex;
}

.wrapper {
  text-align: center;
}

.cruiseList .title h3 {
  font-size: 16px;
  margin-bottom: 18px;
  color: #3ac5ce;
  text-align: center;
  display: block;
  background: #edf8f8;
  padding: 5px;
  font-weight: bold;
}

.cruiseList .title h3:first-child {
  width: 84.5vw;
  margin-right: 40px;
}

.cruiseList .title h3:last-child {
  width: 26vw;
}

.cruiseList ul {
  justify-content: center;
  display: flex;
  flex-wrap: wrap;
}


.cruiseList ul li:hover div {
  opacity: 0.7 !important;
}

.cruiseList ul li {
  position: relative;
  margin-right: 40px;
  -webkit-box-shadow: 0 0 10px 0 #e7e7e7;
  -moz-box-shadow: 0 0 10px 0 #e7e7e7;
  box-shadow: 0 0 10px 0 #e7e7e7;
  border-radius: 10px;
  letter-spacing: 0.15em;
  text-align: left !important;
  width: 23%;
  background: #fff;
}

.cruiseList ul li .tag_title {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  color: #fff;
  padding: 2px 10px;
  display: block;
  width: 100%;
  background: #3ac5ce;
  display: inline-block;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.cruiseList ul li .tag_title.charter {
  background: #e8ca3d;
}



.cruiseList .wrapper {
  margin-bottom: 40px;
}

/*
.cruiseList .wrapper.right {
  margin-right: 40px;
}
*/

.cruiseList ul li:last-child {
  margin-right: 0;
}


.cruiseList ul li .img {
  padding-top: 200px;
  width: 100%;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  background: #e7e7e7;
}

.cruiseList ul li .txtList {
  padding: 20px;
}

.cruiseList ul li .txtList .tag {
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  padding: 2px 10px;
  border-radius: 50px;
  background: #505050;
  display: inline-block;
  margin-bottom: 15px;
}

.cruiseList ul li .txtList .tag.tag_col01 {
  background: #3ac5ce !important;
}

.cruiseList ul li .txtList .tag.tag_col02 {
  background: #3396d7 !important;
}

.cruiseList ul li .txtList .tag.tag_col03 {
  background: #fa8da4 !important;
}

.cruiseList ul li .txtList .tag.tag_col04 {
  background: #e8ca3d !important;
}


.cruiseList ul li .txtList .txt {
  font-size: 15px;
  font-weight: bold;
  color: #505050;
  padding-bottom: 15px;
  line-height: 24px;
  border-bottom: 1px solid #f2f2f2;

}

.cruiseList ul li .txtList .ymd {
  font-size: 12px;
  font-weight: bold;
  color: #ff0000;
  margin-top: 15px;
}


/*section03*/

#section03 {
  background: linear-gradient(#fff, #ebf9fa);
  margin: 0 auto;
  text-align: center;
}

#section03 .introList ul {
  justify-content: center;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 30px;
}

#section03 .introList ul li {
  width: 22%;
  margin-right: 30px;
  letter-spacing: 0.15em;
}

#section03 .introList ul li:last-child {
  margin-right: 0;
}

#section03 .introList ul li .img {
  padding-top: 100%;
  width: 100%;
  border-radius: 100%;
  background: #e7e7e7;
  margin: 0 auto 20px;
}

#section03 .introList ul li .title {
  font-size: 22px;
  font-weight: 400;
  line-height: 1.3;
  color: #3ac5ce;
  margin-bottom: 15px;
  text-align: center;
}

#section03 .introList ul li .title span {
  font-size: 14px;
  font-weight: 400;
  font-style: italic;
  color: #505050;
  display: block;
}

#section03 .introList ul li .text {
  font-size: 15px;
  font-weight: 400;
  text-align: left;
  color: #666666;
}

#section03 .introList ul li:nth-child(1) .img {
  background: url(/images/intro_aqualiner.jpg) center center no-repeat;
  background-size: cover;
}

#section03 .introList ul li:nth-child(2) .img {
  background: url(/images/intro_aquamini.jpg) center center no-repeat;
  background-size: cover;
}


#section03 .introList ul li:nth-child(3) .img {
  background: url(/images/intro_himawari.jpg) center center no-repeat;
  background-size: cover;
}


#section03 .introList ul li:nth-child(4) .img {
  background: url(/images/intro_santamaria.jpg) center center no-repeat;
  background-size: cover;
}

#section03 .introList ul a p:hover {
  opacity: 0.6;
}

/*loop slider*/

#loopSlider {
  background: linear-gradient(#ebf9fa, #fff);
}

/*section04*/

#section04 {
  background: #fff;
  margin: 0 auto;
  text-align: center;
}

.ftBtn_area {
  margin-bottom: 50px
}

.ftBtn_area .wrap {
  justify-content: center;
  display: flex;
  flex-wrap: wrap;
}

.ftBtn_area .wrap a {
  background: #edf8f8;
  border-radius: 10px;
  border-bottom: 5px solid #eeeeee;
  width: 22.9%;
  margin-right: 30px;
  padding: 50px 0;
}

.ftBtn_area .wrap a:last-child {
  margin-right: 0 !important;
}

.ftBtn_area .wrap .contentsBox .img {
  display: inline-block;
  width: 70px;
  margin-bottom: 10px;
}

.ftBtn_area .wrap .contentsBox .title {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.3;
  color: #3ac5ce;
  margin-bottom: 5px;
  text-align: center;
}

.ftBtn_area .wrap .contentsBox .sub {
  font-size: 14px;
  font-weight: 400;
  font-style: italic;
  color: #505050;
  display: block;
}

.btn_booking {
  background: #247ab6;
  text-align: center;
  padding: 20px 0;
  border-radius: 10px;
}

.btn_booking a:hover .title {
  opacity: 0.7;
}

.btn_booking .img {
  width: 30px;
  margin-bottom: 10px;
  display: inline-block;
}

.btn_booking .img img {
  width: 100%;
}

.btn_booking .title {
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
  color: #fff;
  text-align: center;
}

#contactArea .scInr {
  display: flex;
  justify-content: center;
}

#contactArea .scInr a {
  width: 50%;
  margin-right: 20px;
}

.btn_booking.reservation {
  background: #6abc61;
  text-align: center;
  padding: 20px 0;
  border-radius: 10px;
}

#contactArea .scInr a:last-child {
  margin-right: 0;
}

@media screen and (max-width: 720px) {

  #contactArea .scInr {
    flex-wrap: wrap;
  }

  #contactArea .scInr a {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px
  }

  #contactArea .scInr a:last-child {
    margin-bottom: 0;
  }

}


@media screen and (max-width: 1600px) {


  .cruiseList .content_current ul {
    justify-content: center;
  }

  .cruiseList ul li {
    width: 23%;
    margin-bottom: 50px;
    margin-right: 20px;
  }

  .cruiseList ul li:last-child {
    margin-right: 0;
  }

  .cruiseList ul li .img {
    padding-top: 154px !important;
  }


}



@media screen and (max-width: 1000px) {

  .cruiseList ul li {
    width: 40%;
    margin-bottom: 50px;
  }

  .cruiseList ul li:nth-child(even) {
    margin-right: 0;
  }

  .cruiseList ul li .img {
    padding-top: 223px !important;
  }

}




@media screen and (max-width: 1200px) {
  section {
    padding-left: 50px;
    padding-right: 50px;
  }

  .news {
    font-size: 12px;
  }

  .btn.news {
    display: none;
  }

  .news {
    padding: 10px 20px;
  }

  #section03 .introList ul {
    margin-bottom: 0;
  }

  #section03 .introList ul li {
    width: 31%;
    margin-right: 50px;
    margin-bottom: 50px;
  }

  #section03 .introList ul li:nth-child(even) {
    margin-right: 0;
  }



  /*ftBtn_area*/

  .ftBtn_area .wrap a {
    width: 45%;
    margin-right: 30px;
    margin-bottom: 30px;
  }

  .ftBtn_area a:nth-child(even) {
    margin-right: 0;
  }

  .footer {
    padding-left: 50px;
    padding-right: 50px;
  }

  .copyright {
    padding: 0 50px 20px;
  }

}

@media screen and (max-width: 1079px) {

  .mv ul.mv_list li .txtBox p:nth-child(1) {
    font-size: 14px;
  }

  .mv ul.mv_list li .txtBox p:nth-child(2) {
    font-size: 26px;
  }

  .mv ul.mv_list li .txtBox p:nth-child(3) {
    font-size: 16px;
  }


}

@media screen and (max-width: 950px) {

  #section01 .bg_left {
    display: none;
  }

  #section01 .bg_right {
    display: none;
  }

}



@media screen and (max-width: 720px) {

  .mv ul.mv_list li .txtBox p:nth-child(1) {
    font-size: 14px;
  }

  .mv ul.mv_list li .txtBox p:nth-child(2) {
    font-size: 26px;
  }

  .mv ul.mv_list li .txtBox p:nth-child(3) {
    font-size: 16px;
  }

  .news {
    padding: 10px 20px;
  }

  .news p {
    font-size: 12px;
    line-height: 1.5;
  }

  .news p.title {
    margin-right: 5px;
  }

  .news li.text {
    margin: 5px 0;
    line-height: 1.5;
  }

  .btn.news {
    float: inherit;
    font-size: 12px;
  }

  section {
    padding: 50px 20px;
  }

  /*section01*/

  #section01 {
    padding: 50px 20px 0;
  }

  h2.main_title span.title.img01 {
    width: 25px !important;
    margin-bottom: 0 !important;
  }

  #section01 h2.main_title {
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 15px;
  }

  #section01 .bg_left {
    display: none;
  }

  #section01 .bg_right {
    display: none;
  }

  #section01 h3.txt {
    margin-bottom: 20px;
  }

  #section01 p.txt {
    line-height: 1.2;
    font-size: 30px;
  }

  h3.txt {
    font-size: 14px;
    line-height: 34px;
  }

  /*section02*/

  .cruiseList ul {
    margin-bottom: 0;
  }

  .cruiseList ul li .txtList {
    padding: 15px;
  }

  .cruiseList ul li .txtList .txt {
    font-size: 14px;
  }

  .cruiseList ul li {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
    margin-bottom: 20px;
  }

  .cruiseList .wrapper {
    margin-bottom: 20px;
  }

  .cruiseList.bottom ul li {
    width: 47%;
    margin-right: 15px;
  }

  .cruiseList.bottom ul li:nth-child(even) {
    margin-right: 0;
  }

  .cruiseList.top ul li .img {
    padding-top: 210px;
  }

  .cruiseList.bottom ul li .img {
    padding-top: 98px !important;
  }

  /*section03*/
  #section03 {
    padding: 10px 20px;
  }

  #section03 .introList ul li {
    width: 47%;
    margin-right: 20px;
    margin-bottom: 20px;
  }

  #section03 .introList ul li:last-child {
    margin-right: 0;
  }

  #section03 .introList ul li .title {
    font-size: 18px;
  }

  .introList {
    margin-bottom: 20px;
  }

  #loopSlider {
    padding: 30px 0;
  }

  /*section04*/

  #section04 {
    padding: 10px 20px;
  }

  .ftBtn_area {
    margin-bottom: 10px;
  }

  .ftBtn_area .wrap a {
    width: 45%;
    margin-right: 15px;
    margin-bottom: 15px;
    padding: 20px;
  }

  .ftBtn_area .wrap .a:nth-child(even) {
    margin-right: 0;
  }

  .ftBtn_area .wrap .contentsBox .img {
    width: 50px;
    margin-bottom: 0;
  }

  .ftBtn_area .wrap .contentsBox .title {
    font-size: 14px;
  }

  .ftBtn_area .wrap .contentsBox .sub {
    font-size: 12px;
  }

  .ftBtn_area .wrap a {
    padding: 20px 0;
  }

  .btn_booking .title {
    font-size: 14px;
  }


}