@charset "UTF-8";
.white {
  color: #ffffff !important;
}
.black {
  color: #000000 !important;
}

.fs-20 {
  font-size: 20px !important;
}

.va-mi {
  vertical-align: middle !important;
}

.aboutus-bg {
  background-image: url("/dcms_media/image/aboutus-bg.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.area-bg {
  background-image: url("/dcms_media/image/area-bg.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.rinen-bg {
  height: 500px;
  width: 100%;
  background-image: radial-gradient(rgba(64, 185, 211, 1), rgba(255, 255, 255, 1) 70%);
}
@media (max-width: 540px) {
  .rinen-bg {
    /* height: auto; */
    background-image: radial-gradient(circle, rgba(64, 185, 211, 1) 0% 50%, rgba(255, 255, 255, 1) 80% 100%);
  }
}

.dlb_table_row .table th {
  font-weight: 500 !important;
}
.title-border-bottom {
  border-bottom: 1px solid #000000;
  width: 200px;
}
ul.dashed {
  list-style-type: none;
  padding-inline-start: 50px;
}
ul.dashed > li {
  text-indent: -2em;
  font-size: 1.5em;
  font-family: serif;
}
ul.dashed > li:before {
  content: "一、";
  text-indent: -2em;
}
#form_contact_main a {
  color: #ffffff !important;
}
#form_contact_main a:hover {
  color: #348bce !important;
  text-decoration: none !important;
}
#privacy_txt a {
  color: #348bce !important;
}
#privacy_txt a:hover {
  text-decoration: underline !important;
}
.flex {
  display: flex;
  justify-content: center;
}
.heading-029 {
  display: inline-block;
  position: relative;
  margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
  color: #000000;
  line-height: 1;
  font-weight: bold;
}
.heading-029::before {
  position: absolute;
  bottom: calc(-3em / 4);
  left: calc(-3em / 2);
  z-index: -1;
  width: 3em;
  height: 3em;
  border-radius: 50%;
  background: #98c4e6;
  content: "";
}
#footer-01 div.btn a {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
.heading-025 {
  position: relative;
  padding-top: 0.75em;
  color: #348bce;
  margin-bottom: 0px !important;
}
.heading-025::before {
  position: absolute;
  bottom: 0.3em;
  left: 15%;
  z-index: -1;
  color: #cee0ee;
  font-size: 2em;
  line-height: 1;
  content: attr(data-word);
  pointer-events: none;
  font-weight: bold;
}
.hover-white:hover {
  background-color: #ffffff !important;
}

@media (max-width: 1500px) {
  .w-60 {
    width: 90% !important;
  }
}

@media (min-width: 992px) {
  .navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }
  #footer-01 .row-cols-lg-4 > * {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 25%;
    flex: 0 0 20% !important;
    max-width: 20% !important;
  }
  #footer-01 .footer-col-logo {
    max-width: 35% !important;
    flex: 0 0 35% !important;
  }
}

@media (min-width: 768px) {
  .row-cols-md-3 > * {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50% !important;
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

@media (max-width: 768px) {
  .sp-flex {
    flex-flow: column !important;
  }
  .sp-center {
    text-align: center !important;
  }
  .sp-mb-30 {
    margin-bottom: 30px !important;
  }
  #footer-01 .w-60 {
    width: 94% !important;
  }
  .w-20 {
    width: 40% !important;
  }
  .px-5 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  ul.dashed {
    padding-inline-start: 30px;
  }
  ul.dashed > li {
    font-size: 1em;
  }
  .heading-025::before {
    left: 15%;
  }
  .heading-025 {
    margin-bottom: 30px !important;
  }
}

/*---------------- 追記ここから ----------------*/
/* ユーティリティー */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 6rem;
}

.fz-xl {
  font-size: 3.75rem;
}

.u-uppercase {
  text-transform: uppercase;
}

.u-ff-avenir-next {
  font-family: "Avenir Next", "Avenir", "Helvetica neue", Helvetica, sans-serif;
  /* Avenir Next → iOSのみ */
}

.bg_image {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  transition: transform 0.6s ease;
}

.u-hover-up {
  transition: all 0.3s ease-in-out;
  color: inherit;
  cursor: pointer;
}
.u-hover-up:hover {
  transform: translateY(-0.125rem);
  opacity: 0.75;
  text-decoration: none;
}

.u-aspect-16-9 img {
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
.u-aspect-1-1 img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.--contain img {
  object-fit: contain;
}

.u-rounded-md {
  border-radius: 0.75rem;
}
.u-rounded-lg {
  border-radius: 1.5rem;
}
.u-rounded-xl {
  border-radius: 3rem;
}
.u-rounded-xxl {
  border-radius: 5rem;
}

/* 改行 */
.br-pc {
  display: inline;
}
.br-sp {
  display: none;
}
@media only screen and (max-width: 767px) {
  .br-sp {
    display: inline;
  }
  .br-pc {
    display: none;
  }
}

/* 見出し */
.c-h-circle {
  display: inline-block;
  position: relative;
  margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
  color: #333333;
  line-height: 1;
}

.c-h-circle::before {
  position: absolute;
  bottom: calc(-3.5em / 4);
  left: calc(-3.5em / 2);
  z-index: -1;
  width: 3.5em;
  height: 3.5em;
  border-radius: 50%;
  background: #99c5e6;
  content: "";
}

.c-h-en {
  font-size: clamp(2rem, 6vw, 3.75rem);
  /* line-height: 1.1;
  font-weight: 700;
  margin-bottom: -0.125em; */
  opacity: 0.2;
}

/* 事業所一覧部分 */
.p-location-grid {
  display: grid;
  /* grid-template-columns: repeat(2, 1fr); */
  grid-template-columns: repeat(auto-fit, 12rem);
  gap: 2rem;
  justify-content: space-around;
}

.p-location-grid div.btn a {
  padding: 0.5rem 2rem;
}

/* MAPのボタン */
div.btn.u-btn-map a {
  padding: 0.25rem 2rem;
  font-weight: 400;
}
.u-btn-map:hover {
  background-color: #444;
  color: #fff;
}

.c-hukidashi {
  position: relative;
}
.c-hukidashi::after {
  position: absolute;
  display: block;
  content: "";
  bottom: -1em;
  /* width: 1.5em; */
  /* height: 1.5em; */
  /* background-color: inherit; */
  border: solid;
  border-color: transparent;
  border-top-color: inherit;
}

/*---------------- TOP ----------------*/
/*----- 背景画像（3分でわかるのページも） -----*/
/* .page_index {
  background-image: url("/dcms_media/image/bg-top.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-position: center center;
} */
.page_index::before,
.page_in-3minutes::before {
  content: "";
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100vh;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("/dcms_media/image/bg-top.png");
  background-size: cover;
}

/*----- MV -----*/
.tmpl_01_kv_slide {
  min-height: 100vh;
}
@media only screen and (max-width: 979px) {
  .tmpl_01_kv_slide {
    min-height: 100vh;
  }
}

/*----- News 新着情報 -----*/
.dlb_news.--top dl {
  padding: 0.5rem 0;
}
.dlb_news.--top .rss_date {
  padding-left: 0;
  text-align: left;
}
.dlb_news.--top .rss_title {
  padding-left: 0;
  width: 100%;
  display: flex;
  align-items: flex-start;
}
@media only screen and (min-width: 768px) {
  .dlb_news.--top dl {
    display: flex;
  }
}
/*----- お知らせ一覧ページ（下層） -----*/
.tmpl_01_newlist.--news dl {
  padding: 0.5rem 0;
}
.tmpl_01_newlist.--news .rss_date {
  padding-left: 0;
  text-align: left;
}
.tmpl_01_newlist.--news .rss_title {
  padding-left: 0;
  width: 100%;
  display: flex;
  align-items: flex-start;
}
@media only screen and (min-width: 768px) {
  .tmpl_01_newlist.--news dl {
    display: flex;
  }
}
/*----- アイコン（TOP・下層共通） -----*/
.tmpl_01_newlist dl .rss_title span,
.c-news-icon {
  background-color: #348bce;
  color: #fff;
  padding: 0 0.5em 0.125em;
  border-radius: 0.25em;
  margin-right: 0.5rem;
  min-width: 4.5rem;
  text-align: center;
  font-size: 0.875rem;
}

/*----- Product＆Service 製品・サービス -----*/
/*----- ホバーアクションの調整 -----*/
.u-top-product-hover a.bg-white:hover,
.u-top-product-hover a.bg-white:focus,
.u-top-product-hover button.bg-white:hover,
.u-top-product-hover button.bg-white:focus {
  background-color: #fff !important;
  opacity: 1;
}

/*----- Search 身近に -----*/
/*----- アイコンとテキストの横並び -----*/
.c-icon-text-box {
  display: grid;
  grid-template-columns: 3rem auto;
  align-items: center;
  gap: 1rem;
}

/*----- 吹き出しの形状 -----*/
.c-hukidashi {
  position: relative;
}
.c-hukidashi::after {
  position: absolute;
  display: block;
  content: "";
  bottom: -1em;
  /* width: 1.5em; */
  /* height: 1.5em; */
  /* background-color: inherit; */
  border: solid;
  border-color: transparent;
  border-top-color: inherit;
}
.c-hukidashi.--p-r::after {
  right: 1.75em;
}
.c-hukidashi.--p-l::after {
  left: 1.75em;
}
.c-hukidashi.--d-r::after {
  border-width: 1em 0 0 1.5em;
}
.c-hukidashi.--d-l::after {
  border-width: 1em 1.5em 0 0;
}

/* .l-map-position {
  position: absolute;
  top: 0;
  left: 50vw;
  width: 100%;
  height: 100%;
}
.p-map-position {
  position: absolute;
}
.p-map-position.--01 {
  top: 80%;
  left: 7%;
}
.p-map-position.--02 {
  top: 65%;
  left: -35%;
}
.p-map-position.--03 {
  top: 47%;
  left: 35%;
}
.p-map-position.--04 {
  top: 1.5%;
  left: -45%;
}
.p-map-position.--05 {
  top: 54%;
  left: 3%;
}
.p-map-position.--06 {
  top: 12%;
  left: -5%;
} */
.l-map-position {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.p-map-position {
  position: absolute;
}
.p-map-position.--01 {
  top: 80%;
  left: 55%;
}
.p-map-position.--02 {
  top: 63%;
  left: 15%;
}
.p-map-position.--03 {
  top: 45%;
  left: 85%;
}
.p-map-position.--04 {
  top: 1.5%;
  left: 5%;
}
.p-map-position.--05 {
  top: 53%;
  left: 53%;
}
.p-map-position.--06 {
  top: 10%;
  left: 44%;
}
/* .l-map-position {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.p-map-position {
  position: absolute;
  transform: translate(-50%, -50%);
}
.p-map-position.--01 {
  top: 85%;
  left: 60%;
}
.p-map-position.--02 {
  top: 65%;
  left: -35%;
}
.p-map-position.--03 {
  top: 67%;
  left: 20%;
}
.p-map-position.--04 {
  top: 6%;
  left: 15%;
}
.p-map-position.--05 {
  top: 54%;
  left: 3%;
}
.p-map-position.--06 {
  top: 12%;
  left: -5%;
} */

/* モーダルの調整 */
.close.--u {
  opacity: 1;
  line-height: 1;
  transform: translate(10%, -50%);
  /* box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,.15); */
  background-color: #fff !important;
  border-radius: 50%;
}

/*----- Company 会社情報 -----*/
/*----- 左にはみ出させる -----*/
@media only screen and (min-width: 768px) {
  .u-top-company-l-over {
    margin-left: calc(50% - 50vw);
  }
}

/*----- ロゴ一覧 -----*/
.p-logo-grid {
  display: grid;
  grid-template-columns: repeat(1, auto);
  grid-auto-columns: auto;
  /* grid-template-rows: repeat(7, 3rem); */
  grid-auto-rows: 3rem;
  justify-content: center;
  align-items: center;
  gap: 2rem;
}

@media only screen and (min-width: 768px) {
  .p-logo-grid {
    display: grid;
    grid-template-columns: repeat(2, auto);
    /* grid-template-rows: repeat(3, 3rem); */
    justify-content: center;
    align-items: center;
    gap: 2rem;
  }
}
@media only screen and (min-width: 991px) {
  .p-logo-grid {
    display: grid;
    grid-template-columns: repeat(3, auto);
    /* grid-template-rows: repeat(2, 4rem); */
    grid-auto-rows: 4rem;
    justify-content: center;
    align-items: center;
    gap: 2rem;
  }
}
.p-logo-grid .c-logo-grid-item {
  height: 100%;
  width: 100%;
  max-width: 100%;
}
.p-logo-grid .c-logo-grid-item img {
  max-height: 100%;
  width: auto;
}

.p-logo-grid .c-logo-grid-item.--height img {
  scale: 1.3;
  transform-origin: left;
}

/*----- リンク3つ並び、重ねレイアウト -----*/
.u-top-company-link-text-position {
  position: absolute;
  bottom: 0;
  right: 0;
}

/* フッターのリンクの調整 */
.p-footer .bs_text-link a {
  text-indent: 0;
  color: #348bce !important;
}
.p-footer .bs_text-link a::before {
  content: none;
}

.p-footer .btn:hover a span {
  text-decoration: underline;
}

/*----- 検索結果ページの検索ボタンの調整 -----*/
.sub_search input.submit_btn {
  background-color: inherit;
  background-image: none;
}

/*---------------- 3分でわかる ----------------*/
/* ナビゲーション */
@media only screen and (min-width: 768px) {
  .p-3minutes-nav {
    position: absolute;
    width: 100%;
    top: 30%;
    left: 0;
  }
}

@media (max-width: 767px) {
  .u-sp-vartical {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: upright;
  }
}

/*---------- アイコンフォント ----------*/
/* GoogleのMaterial Icons使用 */
/* https://fonts.google.com/icons */
/* btnの左側に余白 */
.u-mi.--left a {
  padding-left: 2.75em;
  position: relative;
}
.u-mi.--left a::after {
  position: absolute;
  display: block;
  top: 50%;
  left: 0.75em;
  transform: translateY(-50%);
  font-family: "Material Icons";
  font-size: 1.25em;
  font-weight: 100;
}
.u-mi.--right a {
  padding-right: 2.75em;
  position: relative;
  display: block;
}
.u-mi.--right a::after {
  position: absolute;
  display: block;
  top: 50%;
  right: 0.75em;
  transform: translateY(-50%);
  font-family: "Material Icons";
  font-size: 1.25em;
  font-weight: 100;
}

.u-mi.--expand-circle-down a::after {
  content: "\e7cd";
  font-size: 1.25em;
  font-weight: 100;
}
.u-mi.--newtab a::after {
  content: "\e89e";
  font-size: 1.25em;
  font-weight: 100;
}

/* material-symbols */
.material-symbols-outlined {
  font-size: 1.25em;
}

.c-h-center-line {
  display: inline-block;
  position: relative;
  padding: 0 4rem;
}
.c-h-center-line::before,
.c-h-center-line::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  width: 3rem;
  height: 0.25rem;
  background-color: #549cd5;
}
.c-h-center-line::before {
  left: 0;
}
.c-h-center-line::after {
  right: 0;
}

.c-grad.--pink {
  background-image: linear-gradient(0deg, #ff9ca0, #fecfee);
}
.c-grad.--blue {
  background-image: linear-gradient(0deg, #65a5ff, #b6dcff);
}
.c-grad.--orange {
  background-image: linear-gradient(0deg, #f7cb6b, #fba980);
}

.d-grid {
  display: grid;
}
.d-grid.--icon {
  align-items: center;
  justify-content: center;
  grid-template-columns: 5rem auto;
  gap: 1em;
}

.c-border-history {
  border-left: 0.25rem solid #333;
}
.c-border-history.--yellow {
  border-color: #ffd800;
}
.c-border-history.--blue {
  border-color: #0972c3;
}

.c-circle {
  position: relative;
}
.c-circle::before {
  display: block;
  position: absolute;
  content: "";
  width: 2em;
  height: 2em;
  background-color: #333;
  border-radius: 50%;
  top: 0;
  left: 0;
  transform: translateX(calc(-50% - 0.25rem / 2));
}
.c-circle.--yellow::before {
  background-color: #ffd800;
}

/* ========================================
  ヘッダー
======================================== */
/*---------- SP時開閉ボタン ----------*/
.c-btn-accordion {
  top: 0;
  right: 0;
  height: 2.5em;
  width: 2.5em;
  background-color: transparent;
  border: none;
}
.c-accordion-icon {
  display: block;
  width: 100%;
  height: 100%;
}
.c-accordion-icon::before,
.c-accordion-icon::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  background-color: #348bce;
  transition: all 0.3s ease-in-out;
}
.c-accordion-icon::before {
  width: 1em;
  height: 2px;
}
.c-accordion-icon::after {
  width: 2px;
  height: 1em;
}
.c-accordion-icon.is-active::after {
  opacity: 0;
}

/* SP時 子メニューのshaowとborderをなくす */
@media (max-width: 991px) {
  .p-header .dropdown-menu {
    border: unset;
  }
  .p-header .dropdown-menu.shadow {
    box-shadow: unset !important;
  }
}

.c-h-circle.--dfd029::before {
  background: #dfd029;
}
.c-h-circle.--598863::before {
  background: #598863;
}
.c-h-circle.--fd8e9a::before {
  background: #fd8e9a;
}
.c-h-circle.--4deda1::before {
  background: #4deda1;
}
.c-h-circle.--f7ac5f::before {
  background: #f7ac5f;
}
/*---------------- 追記ここまで ----------------*/

/*---------------- MV追記 ----------------*/
/* ボタンのスタイル */
.swiper-button-play-pause {
  position: absolute;
  bottom: 38px;
  left: 50%;
  transform: translateX(60px);
  z-index: 10;
  width: 30px;
  height: 30px;
  background: transparent !important;
  border: none !important;
  border-radius: 50%;
  cursor: pointer;
  color: #606060;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s;
  padding: 0;
  line-height: 1; /* アイコンのズレ防止 */
  outline: none !important;
  border: 2px solid #fff !important;
  filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.35));
  
}
.swiper-button-play-pause:hover {
  opacity: .6;
}

/* アイコン共通設定 */
.swiper-button-play-pause::before, .swiper-button-play-pause::after {
  font-family: 'Material Symbols Outlined';
  font-size: 35px;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  background: transparent !important;
  border: none !important;
  
}

/* 停止アイコン（通常時） */
.swiper-button-play-pause::before {
  /* content: "\e034"; */
  content: "";
  width: 3px;
  height: 15px;
  background-color: #fff !important;
  opacity: 1 !important;
 }

 .swiper-button-play-pause::after {
  /* content: "\e034"; */
   content: "";
   width: 3px;
   height: 15px;
   background-color: #fff !important;
   opacity: 1 !important;
   margin-left: 4px !important;
 }
  
/* 再生アイコン（停止中：is-pausedクラスがついた時） */
.swiper-button-play-pause.is-paused::before {
  /*content: "\e1c4"; 
  background-color: transparent !important;
  width: auto;
  height: auto;*/
  width: 12px;
  height: 17px;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
  margin-left: 2px !important;
     background-color: #fff !important;
}
.swiper-button-play-pause.is-paused::after {
  display: none;
}
@media (max-width: 767px) {
  .swiper-button-play-pause.is-paused::before {
    width: 13px;
    height: 17px;
  }
}

.tmpl_01_kv .swiper-pagination-bullet {
  box-shadow: 2px 2px 3px rgba(0,0,0,0.5);
}