@charset "UTF-8";

:root {
  --flcs-cp-2: 0, 51, 102;
  --flcs-cp-2-subtle: 204, 214, 224;
  --font-family: "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "游明朝体", "Yu Mincho", "YuMincho", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

@media screen and (max-width: 992px) {
  :root {
    font-size: 14px;
  }
}

html {
  scroll-padding-top: 105px;
  /* height of sticky header */
}

body {
  font-family: var(--font-family);
  letter-spacing: .05em;
  line-height: 1.75;
}

.section-title {
  letter-spacing: 0.2rem;
  font-weight: 200;
}

.ls-03 {
  letter-spacing: .03em;
}

.ls-05 {
  letter-spacing: .05em;
}

.ls-1 {
  letter-spacing: .1em;
}

.bg-flcs {
  background-color: rgba(var(--flcs-cp-2), 0.2);
}

.text-flcs {
  --bs-text-opacity: 1;
  color: rgba(var(--flcs-cp-2), var(--bs-text-opacity));
}

/* テーマカラー変更 */

::selection {
  background: rgb(var(--flcs-cp-2-subtle));
  color: #001428;
}

img::selection {
  background: none;
}

::-moz-selection {
  background: rgb(var(--flcs-cp-2-subtle));
  color: #001428;
}

a {
  color: rgba(var(--flcs-cp-2), var(--bs-link-opacity, 1));
}

.icon-link {
  text-decoration-color: rgba(var(--flcs-cp-2), var(--bs-link-opacity, .5));
}

.btn-scroll-top:after {
  color: rgb(var(--flcs-cp-2));
}

.btn-scroll-top svg.progress-square path {
  stroke: rgb(var(--flcs-cp-2));
}

.dropdown-menu {
  --bs-dropdown-link-hover-color: var(--bs-gray-800);
  --bs-dropdown-link-active-color: var(--bs-gray-800);
}

/* ナビゲーションバーの表示調整 */

.navbar .dropdown-item {
  padding-top: .5rem;
  padding-bottom: .5rem;
}

/* @media (max-width:992px) { */
@media (max-width:1199px) {
  .navbar .navbar-nav .nav-item .nav-link {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
}

/* コンテンツが少ない場合でもフッターを最下部に */

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main {
  flex: 1;
}

/* フッターのリンク表示調整 */

.footer-nav-item:not(:last-child)::after {
  content: "|";
  margin: 0 .5rem;
}

.footer-nav-item a {
  color: inherit;
}

/* お知らせ用のバッジデザイン調整 */

.badge {
  vertical-align: middle;
  margin-top: -.3em;
}

/* 企業理念 */

.hover-bigger {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

.hover-bigger:hover {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
}

#flcs-boat {
  position: relative;
  width: 75px;
  animation-name: side-to-side;
  animation-duration: 20s;
  animation-iteration-count: infinite;
  animation-delay: -2.5s;
}

@keyframes side-to-side {
  0% {
    transform: rotateY(180deg);
    left: 0;
  }

  40% {
    transform: rotateY(180deg);
    left: calc(100% - 75px);
  }

  50% {
    transform: rotateY(0deg);
    left: calc(100% - 75px);
  }

  90% {
    transform: rotateY(0deg);
    left: 0;
  }

  100% {
    transform: rotateY(180deg);
    left: 0;
  }
}

/* 画像ホバー時の挙動 */
.hover-opacity {
  transition-property: opacity;
  transition-duration: 0.5s;
}

.hover-opacity:hover {
  opacity: 0.7;
}

/* swiperカラーテーマ */
:root {
  --swiper-theme-color: rgb(var(--flcs-cp-2));
  --swiper-pagination-color: rgb(var(--flcs-cp-2));
}

.swiper-pagination-bullet {
  border-color: rgb(var(--flcs-cp-2));
}

.swiper-pagination-bullet-active {
  border-color: rgb(var(--flcs-cp-2));
}

.swiper-button-prev:hover {
  background-color: rgb(var(--flcs-cp-2));
}

.swiper-button-next:hover {
  background-color: rgb(var(--flcs-cp-2));
}

/* iOSでのフォーム入力時の自動ズーム防止 */
input, textarea, select {
  font-size: 16px !important;
}