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

COMMON

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

.ttl01 {
  max-width: 400px;
  width: 100%;
  margin: 0 auto 40px;
}

.ttl02 {
  max-width: 240px;
  width: 100%;
  margin: 0 auto 40px;
}

.ttl03 {
  max-width: 550px;
  width: 100%;
  margin: 0 auto 40px;
}

.head01 {
  text-align: center;
  font-size: 2rem;
  background-color: var(--main);
  font-weight: bold;
  margin-bottom: 20px;
  color: #fff;
  padding: 10px 15px;
  border-radius: 10px;
}

.btn01 {
  display: block;
  background-color: var(--main);
  text-align: center;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 15px 25px;
  max-width: 340px;
  margin: 0 auto;
  transition-duration: 0.3s;
  border-radius: 999px;
}

.btn01:hover {
  opacity: 0.7;
}

.btn02 {
  display: block;
  background-color: var(--main);
  text-align: center;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 15px 25px;
  max-width: 340px;
  margin: 0 auto;
  transition-duration: 0.3s;
  border-radius: 999px;
}

.btn01:hover {
  opacity: 0.7;
}

.y-box {
  background-color: #fef8e1;
  padding: 25px;
  border-radius: 20px;
}

.mb0 {
  margin-bottom: 0;
}

.list01 li {
  background-image: url(/wp-content/uploads/2025/10/circle.png);
  background-size: 20px auto;
  background-repeat: no-repeat;
  background-position: left top 6px;
  padding-left: 25px;
  margin-bottom: 5px;
}

.list01 li:last-of-type {
  margin-bottom: 0;
}

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

MV

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

.mv {
  padding: 20px 0 0 200px;
  position: relative;
}

.swiper-slide img {
  border-radius: 100px 0 0 100px;
}

.mv-catch {
  position: absolute;
  z-index: 10;
  width: 800px;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

.mv-catch-sp {
  display: none;
}

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

HOME

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

.news-section {
  background-image: url(/wp-content/uploads/2025/09/flag-left.png),
    url(/wp-content/uploads/2025/09/flag-right.png),
    url(/wp-content/uploads/2025/09/cloud-right.png);
  background-repeat: no-repeat;
  background-size: 200px auto, 200px auto, 200px auto;
  background-position: left 10% top 100px, right 10% top 100px, right top 80%;
  padding-bottom: 0px;
}

.greeting-section {
  background-image: url(/wp-content/uploads/2025/09/cloud-left.png);
  background-repeat: no-repeat;
  background-size: 240px auto;
  background-position: left top 40px;
  position: relative;
}

.greeting-txt-wrap {
  max-width: 800px;
  padding: 40px;
  background-color: #fef8e1;
  border-radius: 40px;
  margin: 0 auto;
}

.greeting-txt {
  font-size: 1.6rem;
  margin-bottom: 0;
}

.sailboat {
  position: absolute;
  z-index: 1;
  width: 200px;
  height: auto;
  bottom: -80px;
  right: 15%;
}

.office-section {
  background-image: url(/wp-content/uploads/2025/09/wave-wt.png),
    url(/wp-content/uploads/2025/09/town-bg-2.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/blue-bg02.jpg);
  background-size: 100% auto, 800px auto, 200px auto, 200px auto, cover;
  background-repeat: no-repeat;
  background-position: top -1px left 0, bottom right, top 25% left 7%,
    top 60% right 7%, top;
  padding-top: 160px;
}

.office-ttl {
  max-width: 400px;
  width: 100%;
  margin: 0 auto 40px;
}

.office-wrap {
  padding: 80px 60px;
  background-color: #fff;
  border-radius: 60px;
}

.office-box {
  width: 47%;
}

.office-img {
  margin-bottom: 25px;
}

.office-table {
  margin-bottom: 25px;
}

.office-img img {
  border-radius: 20px;
  aspect-ratio: 16 / 9;
  width: 100%;
  height: auto;
}

.gmap {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%;
}

.gmap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.d-link {
  max-width: 300px;
  margin: 25px auto 0;
}

.d-link img {
  transition-duration: 0.3s;
}

.d-link img:hover {
  opacity: 0.7;
}

.para {
  background-image: url(/wp-content/uploads/2025/09/para01.jpg);
  background-size: cover;
  height: 300px;
  background-attachment: fixed;
  background-position: top;
}

.para02 {
  background-image: url(/wp-content/uploads/2025/10/para02.jpg);
}

.top-recruit-section {
  background-image: url(/wp-content/uploads/2025/09/cloud-lt.png),
    url(/wp-content/uploads/2025/09/cloud-rt.png),
    url(/wp-content/uploads/2025/09/kikyuu-right.png);
  background-size: 300px auto, 300px auto, 240px auto;
  background-repeat: no-repeat;
  background-position: top left, top right, bottom right;
  padding-bottom: 0;
}

.top-guide-section {
  background-image: url(/wp-content/uploads/2025/09/cloud-left.png);
  background-repeat: no-repeat;
  background-size: 240px auto;
  background-position: left bottom 200px;
  position: relative;
}

.top-recruit-block.flex,
.top-guide-block.flex {
  align-items: center;
}

.top-recruit-box,
.top-guide-box {
  width: 47%;
}

.top-recruit-box img,
.top-guide-box img {
  border-radius: 30px;
}

.ship {
  position: absolute;
  z-index: 1;
  width: 200px;
  height: auto;
  bottom: -80px;
  left: 15%;
}

.company-section {
  background-image: url(/wp-content/uploads/2025/09/wave-wt.png),
    url(/wp-content/uploads/2025/09/town-bg02.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/blue-bg02.jpg);
  background-size: 100% auto, 800px auto, 200px auto, 200px auto, cover;
  background-repeat: no-repeat;
  background-position: top -1px left 0, bottom left, top 25% left 7%,
    top 65% right 7%, top;
  padding-top: 160px;
}

.company-wrap {
  padding: 80px 60px;
  background-color: #fff;
  border-radius: 60px;
}

.company-box {
  width: 47%;
}

.company-ttl {
  max-width: 400px;
  width: 100%;
  margin: 0 auto 40px;
}

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

サービス内容

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

.service-section01 {
  background-image: url(/wp-content/uploads/2025/09/flag-left.png),
    url(/wp-content/uploads/2025/09/flag-right.png),
    url(/wp-content/uploads/2025/09/cloud-left.png),
    url(/wp-content/uploads/2025/10/cloud-right-bird.png),
    url(/wp-content/uploads/2025/09/cloud-left.png),
    url(/wp-content/uploads/2025/09/sailboat.png),
    url(/wp-content/uploads/2025/10/footer-sea.png);
  background-repeat: no-repeat;
  background-size: 200px auto, 200px auto, 200px auto, 200px auto, 200px auto,
    160px auto, 100% auto;
  background-position: left 10% top 0, right 10% top 0, left top 25%,
    right top 50%, left top 75%, bottom 60px right 10%, bottom center;
}

.service-block01.flex {
  align-items: center;
  margin-bottom: 70px;
}

.service-txt-wrap01 {
  width: 47%;
}

.service-table01 {
  width: 47%;
}

.service-img01 {
  max-width: 600px;
  margin: 0 auto 20px;
}

.service-block02 {
  margin-bottom: 80px;
}

.service-list > li {
  width: 30%;
}

.service-icon {
  max-width: 200px;
  margin: 0 auto 20px;
  width: 100%;
}

.service-head {
  text-align: center;
  background-color: var(--main);
  color: #fff;
  font-weight: bold;
  padding: 5px 15px;
  border-radius: 10px;
  margin-bottom: 20px;
}

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

採用情報

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

.recruit-section01 {
  background-image: url(/wp-content/uploads/2025/09/flag-left.png),
    url(/wp-content/uploads/2025/09/flag-right.png),
    url(/wp-content/uploads/2025/09/cloud-left.png);
  background-repeat: no-repeat;
  background-size: 200px auto, 200px auto, 200px auto;
  background-position: left 10% top 0, right 10% top 0, left top 50%;
  position: relative;
}

.view-list li {
  width: 30%;
}

.view-img {
  margin-bottom: 15px;
}

.view-ttl {
  background-color: var(--main);
  text-align: center;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 15px;
}

.recruit-section02 {
  background-image: url(/wp-content/uploads/2025/09/wave-wt.png),
    url(/wp-content/uploads/2025/09/town-bg-2.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/blue-bg02.jpg);
  background-size: 100% auto, 800px auto, 200px auto, 200px auto, cover;
  background-repeat: no-repeat;
  background-position: top -1px left 0, bottom right, top 25% left 7%,
    top 60% right 7%, top;
  padding-top: 160px;
}

.recommend-ttl {
  max-width: 400px;
  width: 100%;
  margin: 0 auto 40px;
}

.recommend-wrap {
  padding: 80px 60px;
  background-color: #fff;
  border-radius: 60px;
}

.recommend-list li {
  width: 31%;
}

.recommend-head {
  background-color: var(--main);
  text-align: center;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 15px;
  border-radius: 10px;
  width: 100%;
  margin-bottom: 15px;
}

.recruit-section03 {
  background-image: url(/wp-content/uploads/2025/09/cloud-lt.png),
    url(/wp-content/uploads/2025/09/cloud-rt.png),
    url(/wp-content/uploads/2025/09/kikyuu-right.png);
  background-size: 300px auto, 300px auto, 240px auto;
  background-repeat: no-repeat;
  background-position: top left, top right, top 50% right;
  position: relative;
}

.recruit-flow-block {
  margin-bottom: 60px;
}

.flow-list-box01 {
  padding: 30px;
  border-radius: 20px;
  background-color: #fef8e1;
  width: 29%;
}

.flow-list-head {
  background-color: var(--main);
  text-align: center;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  padding: 15px;
  border-radius: 10px;
  width: 100%;
  margin-bottom: 15px;
}

.flow-list-icon {
  max-width: 140px;
  width: 100%;
  margin: 0 auto 15px;
}

.flow-list-arrow {
  display: flex;
  align-items: center;
  width: 3%;
}

.req-ttl {
  max-width: 400px;
  width: 100%;
  margin: 0 auto 40px;
}

.faq-block {
  padding: 40px 40px 20px 40px;
  border-radius: 20px;
  background-color: #fef8e1;
}

.recruit-section04 {
  background-image: url(/wp-content/uploads/2025/09/wave-wt.png),
    url(/wp-content/uploads/2025/09/town-bg02.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/wave-bg02.png),
    url(/wp-content/uploads/2025/09/blue-bg02.jpg);
  background-size: 100% auto, 800px auto, 200px auto, 200px auto, cover;
  background-repeat: no-repeat;
  background-position: top -1px left 0, bottom left, top 25% left 7%,
    top 65% right 7%, top;
  padding-top: 160px;
}

.ship02 {
  position: absolute;
  z-index: 1;
  width: 200px;
  height: auto;
  bottom: -80px;
  left: 15%;
}

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

ご利用とお問い合わせ

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

.contact-section01 {
  background-image: url(/wp-content/uploads/2025/09/flag-left.png),
    url(/wp-content/uploads/2025/09/flag-right.png),
    url(/wp-content/uploads/2025/09/cloud-left.png),
    url(/wp-content/uploads/2025/10/cloud-right-bird.png),
    url(/wp-content/uploads/2025/09/cloud-left.png),
    url(/wp-content/uploads/2025/09/sailboat.png),
    url(/wp-content/uploads/2025/10/footer-sea.png);
  background-repeat: no-repeat;
  background-size: 200px auto, 200px auto, 200px auto, 200px auto, 200px auto,
    160px auto, 100% auto;
  background-position: left 10% top 0, right 10% top 0, left top 25%,
    right top 50%, left top 75%, bottom 60px right 10%, bottom center;
}

.contact-block01 {
  margin-bottom: 80px;
}