/* ---- normalize ---- */


/* ボックスモデルを統一 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* 余白リセット */
body, h1, h2, h3, h4, h5, h6, p, ul, ol, figure {
  margin: 0;
  padding: 0;
}

/* リストスタイル削除 */
ul, ol {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

ul li, li li {
  margin: 0;
  padding: 0;
}


/* リンク */
a {
  color: inherit;
  text-decoration: none!important;
}

/* 画像が親幅に収まるように */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* フォーム要素のフォントを継承 */
input, button, textarea, select {
  font: inherit;
  color: inherit;
}

/* body の基本 */
body {
  line-height: 1.75;
  font-size:20px;
  -webkit-font-smoothing: antialiased;
  background: #fff;
  color: #222;
  font-feature-settings: "palt";
}





/* ---- 共通 ---- */
.logo-svg {
  color: var(--orangered);
}

/* ---- 基本構造 ---- */
.wrap {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  max-width: 1250px;
  margin:0 auto;
}
.wrap aside {
  flex: 0 0 250px;
  position: sticky;
  top: 20px;
  height: fit-content;

  margin-top:30px;
  /*font-size: 20px;*/
  color:#323232;
  padding-left:0px;
}
.wrap aside a {
  color:#323232;
  font-weight:normal;
  transition: 0.3s;
  display: block;
    width: 100%;
}
.wrap aside a:hover {
  color:var(--orangered);
}
.wrap main {
  order: 2;
  flex: 1;
  min-width: 0; 
  padding-left:30px;
}


.side-logo svg {
  width: 90%;
  height: auto;
}
.nav-side {
    padding-right:20px;
}
.nav-side .navi-toppage {
  margin-top:30px;
}
.nav-side ul li {
    margin-bottom:20px;
}
.nav-side ul li a img {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
}

.nav-side .active {
    color:var(--orangered);
}
.nav-side .btn-contact {
    color:#fff!important;
    padding:15px 0px;
    width:100%;
    text-align:center;
    background:var(--blue);
    transition: 0.3s;
    border-radius:4px;
}
.nav-side .btn-contact:hover {
    background:var(--orangered);
}




@media (max-width: 768px) {
  .wrap {
    flex-direction: column;
  }
  .wrap main { order: 1; }
  .wrap aside { display:none; }
}

/* ---- h1 NOT スライド ---- */
.tit-header {
  line-height:1.35;
  margin: 0 auto 0px;
  width: 100%;
  /*font-size: 28px;*/
  text-align: left;
  margin-top:25px;
}


/* ---- フッター ---- */
.footer-inner{
  max-width:1200px; margin:0 auto; padding:32px 16px 40px;
  display:grid; gap:24px 32px;
}


/* 文字系 */
.footer-col p{ margin:0 0 .6rem; }
.footer-col .org-en { font-weight:700; }
.footer-col .org-ja { opacity:.9; margin-top:-10px;}
.footer-col .copyright{ margin-top:.6rem; color:#444; }

.footer-col.nav ul{ list-style:none; padding:0; margin:0; }
.footer-col.nav li+li{ margin-top:.5rem; }
.footer-col.nav a{ color:#222; text-decoration:none; }

/* CTA 列（ボタンは右列で幅オート） */
.footer-col.cta{ display:flex; flex-direction:column; gap:12px; align-items:flex-start; }
.btn-footer-contact{
  display:inline-block; background:var(--blue); color:#fff;
  padding:12px 20px; border-radius:4px; text-decoration:none;
}
.btn-footer-contact:hover{ filter:brightness(1.05); }
.footer-col.cta .legal{ list-style:none; padding:0; margin:.4rem 0 0; }
.footer-col.cta .legal li+li{ margin-top:.4rem; }
.footer-col.cta .legal a{ /*font-size:14px;*/ color:#222; }

/* SNS/言語 */
.footer-col.nav.social a{ display:inline-flex; align-items:center; gap:6px; }
.footer-col.nav.social img{ display:inline-block; vertical-align:middle; }

/* ===== フッター テキストリンク ===== */
.site-footer .footer-col.nav a,
.site-footer .footer-col.cta .legal a {
  color:#323232;
  font-weight:normal;
  transition:0.3s;
}

.site-footer .footer-col.nav a:hover,
.site-footer .footer-col.cta .legal a:hover {
  color:var(--orangered);
  text-decoration:none; /* 必要なら */
}

/* ===== フッター ボタンリンク ===== */
.site-footer .btn-footer-contact {
  color:#fff !important;
  padding:10px 0;
  width:80%;
  text-align:center;
  background:var(--blue);
  border-radius:4px;
  transition:0.3s;
  display:inline-block;
}

.site-footer .btn-footer-contact:hover {
  background:var(--orangered);
}


/* --- PCレイアウト：1行4カラム（1列目を広く） --- */
@media (min-width: 992px){
  .footer-inner{
    grid-template-columns: 2fr 1fr 1fr 1fr;        /* ← 1列目だけ広い */
    grid-template-areas: "org site cta social";    /* ← 1行に固定 */
    align-items:start;
  }
  .footer-col.org    { grid-area: org; }
  .footer-col.site   { grid-area: site; }
  .footer-col.cta    { grid-area: cta; }
  .footer-col.social { grid-area: social; }
}

/* --- モバイル：縦並び --- */
@media (max-width: 991px){
  .footer-inner{
    grid-template-columns: 1fr;
    gap:18px 16px; padding:24px 12px 32px;
  }
  .site-footer .btn-footer-contact {
    width:100%;
  }
}





/* ---- パンくず全体：色を薄く＆サイズ小さく ---- */
.rank-math-breadcrumb {
  /*font-size: 15px;*/          /* 小さめ */
  color: #aaa;           /* 薄めのグレー */
  margin: 20px 0 12px;       /* H1下で少し余白 */
  font-size:.9rem;
  line-height:1.35;
}
.rank-math-breadcrumb a {
  color: #aaa;           /* リンクも薄め */
  text-decoration: none;
}
.rank-math-breadcrumb a:hover { text-decoration: none; }
.rank-math-breadcrumb .separator {
  margin: 0 6px;
  color: #aaa;           /* 区切りはさらに薄め */
}

/* 先頭（ホーム）に家アイコン：a でも span でも当てる／直下子に限定しない */
.rank-math-breadcrumb :is(a, span):first-child::before {
  content: "";
  display: inline-block;
  width: 12px; height: 12px;
  margin-right: 6px;
  translate: 0 1px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5L12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1v-10.5z' fill='%23aaa'/%3E%3C/svg%3E") no-repeat center / contain;
}










/* ---- スマホナビレイアウト ---- */
.block-menu-btn{
  background:#fff;
  position:fixed; top:0; left:0; right:0;
  z-index:9998;
  height:50px;
  border-bottom:1px solid #ccc;
}
/* スマホ限定表示（PCで非表示にしたい場合） */
@media (min-width: 992px){
  .block-menu-btn{ display:none; }
}
@media (max-width: 991px){
  body {
    padding-top:50px;
  }
}

/* 全体ラッパー */
.menu-wrapper{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  position:relative;
  height:100%;
}

/* 左のバーガー */
.navi{
  display:flex;
  align-items:center;
  justify-content:center;
  width:56px; height:100%;
}
.menu-btn{
  display:flex; flex-direction:column; align-items:center; line-height:1;
  color:var(--orangered);
}
.menu-btn p{
  /*font-size:10px;*/ font-weight:700; margin:2px 0 0;
}

/* ロゴを中央固定配置 */
.logo{
  position:absolute; left:50%; top:50%;
  transform:translate(-50%,-50%);
  display:flex; align-items:center; height:100%;
}
.logo .logo-svg{ height:24px; width:auto; display:block; }

/* ハンバーガー */
.menu-trigger, .menu-trigger span{
  display:inline-block; transition:all .25s; box-sizing:border-box;
}
.menu-trigger{ position:relative; width:32px; height:20px; }
.menu-trigger span{
  position:absolute; left:0; width:100%; height:3px;
  background:var(--orangered); border-radius:3px;
}
.menu-trigger span:nth-of-type(1){ top:0; }
.menu-trigger span:nth-of-type(2){ top:8.5px; }
.menu-trigger span:nth-of-type(3){ bottom:0; }
.menu-trigger.active span:nth-of-type(1){ transform:translateY(8.5px) rotate(-45deg); }
.menu-trigger.active span:nth-of-type(2){ opacity:0; }
.menu-trigger.active span:nth-of-type(3){ transform:translateY(-8.5px) rotate(45deg); }

.menu-label {
  /*font-size:12px;*/
  font-weight:bold;
  margin-top:5px;
}
/* ハンバーガーのボタンを素の見た目にリセット */
.navi .menu-btn{
  background: none;           /* 灰色の背景を消す */
  border: none;               /* 黒い枠線を消す */
  padding: 0;
  margin: 0;
  cursor: pointer;
  appearance: none;           /* 標準のボタン外観を無効化 */
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-tap-highlight-color: transparent; /* モバイルのタップ時の灰色ハイライト対策 */
}
/* Firefoxの内側ボーダー対策 */
.navi .menu-btn::-moz-focus-inner { border: 0; padding: 0; }

/* フォーカスリングを自前で出す（消したいなら削除） */
.navi .menu-btn:focus-visible{
  outline: 2px solid var(--orangered);
  outline-offset: 2px;
}





/* 開いてる間はスクロール抑止 */
body.nav-open { overflow: hidden; }

/* オーバーレイ（メニュー本体側の余白合わせ） */
.burger-navi .overlay {
  padding-top: 50px;
  position: fixed;
  inset: 0;
  z-index: 9990;
  display: none;
  overflow: auto;
  width: 100%;
  height: 100%;
  background: #fff;
}

.burger-navi .menu {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.burger-navi .nav-sp {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 20px;
  /*font-size: 16px;*/
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,0.3);
  text-decoration: none;
  background: var(--orangered);
}

.burger-navi .nav-sp:hover {
  opacity: .5;
}

.burger-navi .nav-arrow {
  /*font-size: 18px;*/
  margin-left: auto;
}

.burger-navi .sp-cta {
  margin: 40px 20px 20px;
  text-align: center;
}

.burger-navi .btn-sp-contact {
  display: inline-block;
  background: var(--blue);
  color: #fff;
  padding: 14px 0;
  width: 100%;
  /*font-size: 16px;*/
  border-radius: 4px;
  text-align: center;
  text-decoration: none;
}

.burger-navi .btn-sp-contact:hover {
  background: var(--orangered);
}

.burger-navi .sp-legal {
  margin: 20px;
  text-align: center;
}

.burger-navi .sp-legal a {
  /*font-size: 14px;*/
  color: #222;
  text-decoration: none;
}

.burger-navi .sp-legal a:hover {
  text-decoration: underline;
}

.burger-navi .sp-links {
  margin: 40px 0 30px;
  display: flex;
  justify-content: center;
  gap: 30px;
}

.burger-navi .sp-links a {
  color: #222;
  /*font-size: 14px;*/
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 5px;
}

.burger-navi .sp-links a:hover {
  text-decoration: underline;
}





/* ---- CTA ---- */
.sec-cta{
  --cta-max: 1200px;
  --cta-pad: clamp(24px, 4vw, 48px);
  --cta-gap: clamp(20px, 6vw, 48px);

  max-width: var(--cta-max);
  margin: clamp(48px, 8vw, 100px) auto;
  padding: var(--cta-pad);
  border: 1px solid var(--orangered);
  border-radius: 20px;
  text-align: center;
}

.sec-cta h2{
  font-size: clamp(20px, 2.5vw, 30px);
  font-weight: 700;
  line-height: 1.5;
  margin: 0 0 16px;
}

.sec-cta p {
  font-size: clamp(16px, 1.6vw, 20px);
  line-height: 1.6;
  margin: 0 auto;
  text-align: left;
  max-width: 850px;
}

.sec-cta .cta-logo{
  width:min(760px, 100%);
  height:auto;
  display:block;
  margin:0 auto 12px;color: var(--orangered);
}

/* アイコン行 */
.sec-cta .block-icon{
  display: flex;
  justify-content: center;
  gap: var(--cta-gap);
  margin-top: clamp(24px, 4vw, 45px);
  flex-wrap: wrap;        /* 狭幅で自動折返し */
}

/* クリック領域を十分に */
.sec-cta .click-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(72px, 10vw, 100px);
  height: clamp(72px, 10vw, 100px);
  border-radius: 14px;
  transition: transform .15s ease, box-shadow .15s ease;
  outline: none;
}

.sec-cta .click-cta img{
  width: 70%;
  height: auto;
}

/* ホバー&フォーカス（アクセシビリティ対応） */
.sec-cta .click-cta:hover{
  transform: translateY(-2px);
  box-shadow: none;
}
.sec-cta .click-cta:focus-visible{
  box-shadow: 0 0 0 3px #000, 0 0 0 6px var(--orangered);
}

@media (max-width: 1024px){
  .sec-cta{ text-align: left; }
  .sec-cta h2{ margin-bottom: 10px; line-height: 1.35; }
  .sec-cta p{ margin-top: 8px; }
}
@media (max-width: 560px){
  .sec-cta .block-icon{ gap: 24px; }
}
@media (prefers-reduced-motion: reduce){
  .sec-cta .click-cta{ transition: none; }
}














/* ---- TOP ---- */
.logo-top { width:1250px; margin:0 auto; padding:10px 0;}
@media (max-width: 991px) {
  .logo-top {
    display:none;
    visibility:hidden;
  }
}
.mask-container {
    max-width: 1000px;
    width: 100%;
    aspect-ratio: 1000 / 465;
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
    border-radius: 30px;
    margin-top: 25px;
}
.images-container {
    display: flex;
    width: 1300px;
    height: 465px;
}
.slide-container {
    width: 800px;
    height: 800px;
    overflow: hidden;
    position: relative;
    transform: rotate(-30deg);
    margin: 0 20px;
    margin-top: -155px;
}
.slide-image {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}





.leadtext {
    text-align: left;
    /*font-size: 30px!important;*/
    font-weight: bold;
    margin-top:20px;
    line-height: 1.35;
}
.leadtext h1 {
    color:#ec5f60;
    font-weight:bold;
    font-size:29px;
}
.leadtext h1 span {
    color:#323232;
    display:block;
    /*font-size:20px!important;*/
    font-size:26px;
}
.box-leadbody {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    margin-top:20px;
}
.box-leadbody p {
    column-count: 2;
    column-gap: 30px;
    width: 1000px;
    /*font-size:20px;*/
    font-weight:normal;
    line-height: 1.75;
    margin:0!important;
    padding:0!important;
}
.box-leadbody .left, .box-leadbody .right {
    flex:1;
}

@media only screen and (max-width: 1200px) {
    .box-leadbody {
        display:block;
        width: 100%;
    }
    .box-leadbody p {
        width: 100%;
    }
}
@media only screen and (max-width: 850px) {
    .box-leadbody p {
        column-count: 1;
        column-gap: 0px;
    }
    .leadtext {
      margin-top:5px!important;
    }
    .leadtext h2 {
      /*font-size:24px!important;*/
    }
    .leadtext h2 span {
        margin-top:5px;
        /*font-size:20px!important;*/
    }
}





.sec-works {
    display:flex;
    gap:25px;
    margin-top:140px;
    text-align: left;
    width: 1000px;
  }
  .sec-works div:first-child {
    text-align: left;
    flex: 0 0 250px;
  }
  .sec-works .btn, .sec-attract .btn {
    color: var(--orangered);
    border:1px solid var(--orangered);
    border-radius:50px;
    display:inline-block;
    text-align: center;
    margin-top:25px;
    padding:8px 20px;
    /*font-size:18px;*/
    transition:0.5s ease;
  }
  .sec-work .btn:hover, .sec-attract .btn:hover {
    background:var(--orangered);
    color:#fff;
  }
  .card04 .swiper-slide {
    width:340px;
    margin-right:40px;
  }
  @media only screen and (max-width: 991px) {
    .sec-works {
      display:block;
      gap:25px;
      margin-top:100px;
      width:100%;
    }
    .sec-works div:first-child {
      margin-bottom:20px;
    }
    .sec-works .btn {
      margin-top:15px;
    }
    .card04 .swiper-slide {
      width:100%;
      margin-right:40px;
    }
  }
  .card04 .swiper-button-prev::before, .card04 .swiper-button-next::before {
  background-color: var(--orangered);
}





.sec-service, .sec-attract {
    display:flex;
    gap:25px;
    margin-top:140px;
    text-align: left;
  }
  .sec-service h2, .sec-attract h2, .sec-works h2, .sec-blog h2 {
    color: var(--orangered);
  }
  
  .sec-service h2 span, .sec-attract h2 span, .sec-works h2 span, .sec-blog h2 span {
    display:block;
    /*font-size:18px;*/
    font-weight:normal;
    color:#323232;
  }
  .sec-service div, .sec-attract div {
    text-align: center;
    flex:1;
  }
  .sec-service div img, .sec-attract div img, .sec-works img, .sec-blog img {
    border-radius: 15px!important;
  }
  .sec-service div:first-child, .sec-attract div:first-child {
    text-align: left;
    flex: 0 0 250px;
  }
  .sec-service h3, .sec-attract h3 {
    /*font-size:20px;*/
    line-height: 1.35;
    margin-top:10px;
  }
  
  .sec-service a, .sec-attract a {
    color: var(--black);
    text-decoration: none;
    transition: opacity 0.3s ease;
  }

  .sec-service a img, .sec-attract a img {
    transition: opacity 0.3s ease;
  }

  /*.sec-service a:hover, .sec-service a:hover img
  , .sec-attract a:hover, .sec-attract a:hover img {
    opacity: 0.45;
  }*/

  @media only screen and (max-width: 991px) {
    .sec-service, .sec-attract {
      display:block;
      margin-top:140px;
    }
    .sec-service div img, .sec-attract div img {
      width:100%;
    }
    .sec-service div:nth-child(2) , .sec-attract div:nth-child(2) {
      margin-bottom: 40px;
    }
  }



.sec-blog {
    display:flex;
    gap:25px;
    margin-top:140px;
    text-align: left;
  }
  .sec-blog div:first-child {
    text-align: left;
    flex: 0 0 250px;
  }
  .sec-blog .btn {
    color: var(--orangered);
    border:1px solid var(--orangered);
    border-radius:50px;
    display:inline-block;
    text-align: center;
    margin-top:40px;
    padding:8px 20px;
    /*font-size:18px;*/
    transition:0.5s ease;
  }
  .sec-blog .btn:hover {
    background:var(--orangered);
    color:#fff;
  }
  .card02 .swiper-slide img {
    width: 100%;
  }
  .card02 h3, .card04 h3 {
    /*font-size:20px;*/
    line-height:1.45;
    margin-top:10px;
  }

  @media only screen and (max-width: 991px) {
    .sec-blog {
      display:block;
      gap:25px;
      margin-top:0px;
      width:100%;
    }
    .sec-blog div:first-child {
      margin-bottom:20px;
    }
    .sec-blog .btn {
      margin-top:15px;
    }
  }

  .card02 .swiper-slide {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  -webkit-box-shadow:none;
          box-shadow:none;
}
.card02 .slide:hover {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
    -webkit-box-shadow:none;
            box-shadow:none;
  }
  .card02 h3 {
  /*font-size:20px;*/
  font-weight: normal;
}
.card02 time {
  /*font-size:18px;*/
  font-family: "Outfit", sans-serif;
  color: var(--orangered);
}
.card02 .cate {
  /*font-size:18px;*/
  font-family: "Outfit", sans-serif;
  color: var(--orangered);
}
.card02 .swiper-button-prev::before, .card02 .swiper-button-next::before {
  background-color: var(--orangered);
}

.card02 .swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}
.card02 .swiper-button-disabled::before {
  -webkit-box-shadow:none;
          box-shadow:none;
}







.parner .slide {
    display:flex; gap:20px; align-items: center;
  }
  .text-apk {
    padding-left:270px; padding-top:15px; line-height:1.55;
  }
  @media (max-width: 991px) {
    .parner .slide {
      display:block;
    }
    .text-apk {
      padding-left:0; padding-top:15px;
    }
  }



















  @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
:root {
    --orangered:#ec5f60;
    --black:#323232;
    --blue:#16458c;
}




:root{--swiper-theme-color:#007aff}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-pointer-events{touch-action:pan-y}.swiper-pointer-events.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d,.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center}

:root {
  --easing: cubic-bezier(.2, 1, .2, 1);
  --transition: .8s var(--easing);
  --color-gray: #ddd;
  --color-theme: #f5695f;
  --box-shadow: .8rem .8rem 1.2rem rgba(0, 0, 0, .05), -.8rem -.8rem 1.2rem #fff;
  --box-shadow-hover: 1rem 1rem 1.5rem rgba(0, 0, 0, .08), -1rem -1rem 1.5rem #fff;
  --box-shadow-inset: inset .8rem .8rem 1.2rem rgba(0, 0, 0, .05), inset -.8rem -.8rem 1.2rem #fff;
  --box-shadow-dark: .8rem .8rem 1.2rem rgba(0, 0, 0, .1), -.8rem -.8rem 1.2rem rgba(#fff,.2);
}

/*html {
  font-size: 62.5%;
  line-height: 1.8;
  height: 100%;
}*/

.l-inner {
  position: relative;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  max-width: 725px;
  padding: 0;
}

/* slider */
[class*=swiper]:focus {
  outline: none;
}

.slide-media,
.thumb-media {
  position: relative;
  overflow: hidden;
}
.slide-media img,
.thumb-media img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

/* 前へ / 次へボタン */
.swiper-button-prev, .swiper-button-next {
  display: grid;
  place-content: center;
  width: 2.8rem!important;
  height: 2.8rem!important;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
}
@media only screen and (min-width: 1025px) {
  .swiper-button-prev::before, .swiper-button-next::before {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .swiper-button-prev:hover::before, .swiper-button-next:hover::before {
    -webkit-transform: scale(1.0);
            transform: scale(1.0);
  }
}
.swiper-button-prev::before, .swiper-button-next::before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: "";
  border-radius: 50%;
  /*-webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);*/
}
.swiper-button-prev::after, .swiper-button-next::after {
  width: 1.2rem;
  height: 1.2rem;
  content: "";
  border: solid #fff;
  border-width: 3px 3px 0 0;
}
.swiper-button-prev::after {
  margin-left: 0.6rem;
  -webkit-transform: rotate(-135deg);
          transform: rotate(-135deg);
}
.swiper-button-next::after {
  margin-right: 0.6rem;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}


/* ---- swiperの上書き ---- */
.card02 {
  /* コンテナ */
  overflow: hidden;
  /* コントローラー */
  /* ページネーション */
  /* 前へ / 次へボタン */
  /* スライド */
}
.card02 .swiper {
  overflow: visible;
}
.card02 .swiper-controller {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 1.6rem;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 0px!important;
}
.card02 .swiper-pagination {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  gap: 1.2rem 0.8rem;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin: 0 auto 0 0;
  text-align: center;
}
.card02 .swiper-pagination-bullet {
  width: 1.6rem;
  height: 3px;
  cursor: pointer;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  vertical-align: top;
  background-color: var(--color-gray);
}
.card02 .swiper-pagination-bullet-active {
  width: 4rem;
  background-color: var(--color-theme);
}
.card02 .swiper-button-prev, .card02 .swiper-button-next {
  position: relative;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  margin: 0;
}
.card02 .swiper-button-disabled {
  pointer-events: none;
  opacity: 0;
}

.card02 .swiper-slide {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  /*-webkit-box-shadow: var(--box-shadow);
          box-shadow: var(--box-shadow);*/
}
.card02 .slide {
  overflow: hidden;
  width: 36rem;
  border-radius: 4px;
}
@media only screen and (max-width: 599px) {
  .card02 .slide {
    width: 24rem;
  }
}
@media only screen and (min-width: 1025px) {
  .card02 .slide {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card02 .slide img {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card02 .slide:hover {
    -webkit-transform: translateY(-16px);
            transform: translateY(-16px);
    -webkit-box-shadow: var(--box-shadow-hover);
            box-shadow: var(--box-shadow-hover);
  }
  .card02 .slide:hover img {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
.card02 .slide-media {
  padding-top: 62.5%;
}
.card02 .slide-media img {
  height:100%;

}

.card02 .slide-title {
  line-height: 1.6;
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  /*font-size:24px;*/
}




.card04 {
  overflow: hidden;
}
.card04 .swiper {
  overflow: visible;
}
@media only screen and (max-width: 1024px) {
  .card04 .swiper {
    padding: 0 20px;
  }
}
.card04 .swiper-button-prev, .card04 .swiper-button-next {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 80px;
  margin: auto;
}
.card04 .swiper-button-prev::before, .card04 .swiper-button-next::before {
  background-color: var(--orangered);
  /*-webkit-box-shadow: var(--box-shadow-dark);
          box-shadow: var(--box-shadow-dark);*/
}
.card04 .swiper-button-prev::after, .card04 .swiper-button-next::after {
  border-color: #fff;
}
.card04 .swiper-button-prev {
  right: calc(100% - 1.6rem);
}
@media only screen and (max-width: 1024px) {
  .card04 .swiper-button-prev {
    right: calc(100% - 2.85rem);
  }
}
.card04 .swiper-button-next {
  left: calc(100% - 1.6rem);
}
@media only screen and (max-width: 1024px) {
  .card04 .swiper-button-next {
    left: calc(100% - 2.85rem);
  }
}
.card04 .swiper-a:not(.swiper-initialized) {
  padding: 0;
}
.card04 .swiper-a:not(.swiper-initialized) .swiper-button-prev,
.card04 .swiper-a:not(.swiper-initialized) .swiper-button-next {
  display: none;
}
.card04 .swiper-a:not(.swiper-initialized) .swiper-wrapper {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap:0px;
}
.card04 .swiper-b:not(.swiper-initialized) {
  padding: 0;
}
.card04 .swiper-b:not(.swiper-initialized) .swiper-button-prev,
.card04 .swiper-b:not(.swiper-initialized) .swiper-button-next {
  display: none;
}
.card04 .swiper-b:not(.swiper-initialized) .swiper-wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
@media only screen and (max-width: 1024px) and (min-width: 600px) {
  .card04 .swiper-b:not(.swiper-initialized) .swiper-wrapper {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}
@media only screen and (max-width: 599px) {
  .card04 .swiper-b:not(.swiper-initialized) .swiper-wrapper {
    grid-template-columns: repeat(1, 1fr);
  }
}
.card04 .slide {
  height: 100%;
  overflow: hidden;
  border-radius: 4px;
  margin-bottom:40px;
}
.card04 .swiper-slide {
  width:300px;
}
.card04 .slide img {
  width: 100%;
  height: auto;
  border-radius:8px;
}
@media only screen and (min-width: 1025px) {
  .card04 .slide {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card04 .slide img {
    -webkit-transition: var(--transition);
    transition: var(--transition);
  }
  .card04 .slide:hover {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
  .card04 .slide:hover img {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

.card04 h3 {
  /*font-size:20px;*/
  font-weight: normal;
}
.card04 a {
  color:initial;
}








/* ---- FAQ よくある質問 ---- */
.faq-nav{ margin-top:20px; }
.faq-nav ul{
  list-style:none;
  margin:0; padding:0;
  display:flex;
  flex-wrap:wrap;      /* ここで折り返す */
  gap:10px;            /* li間の余白 */
}
.faq-nav li{ line-height:1; } /* 必要なら調整 */
.faq-nav a{
  display:inline-block;
  padding:8px 14px;
  border:1px solid var(--orangered);
  border-radius:9999px;
  text-decoration:none;
  color:var(--orangered);
}
.faq-nav a:hover{ background:var(--orangered); color:#fff; }
/*.faq-nav ul li a.none-href {
  color:#fff;
  background:#c83230;
  pointer-events:none;
}*/




.faq h2 {
  color: var(--orangered);
}
.faq-category {
  margin-left:10px;
  margin-top:40px;
}
.faq-category .faq {
  margin-bottom:40px;
}
.faq-category .faq:last-child {
  margin-bottom:80px;
}
.faq h3 {
  font-weight: bold;
  /*font-size:26px;*/
}
.faq .faq-answer {
  /*font-size:22px;*/
}
.faq a {
  color: var(--orangered);
  text-decoration: underline;
}


/* ---- sitemap ---- */
.sitemap ul li ul {
  margin-left:30px;
}



/* ---- company ---- */
/* 定義リストの行レイアウト（スマホ→PCで2列などに） */
.company h2 {
  margin-top:50px;
  color: var(--orangered);
}
.company .my-profile p {
  margin-bottom:30px;
}
.company .my-profile p a {
  color: var(--orangered);
}
.company .my-profile ul {
  margin-left:20px;
}
.company-defs { margin: 1rem 0; }
.company-defs > div { display:grid; grid-template-columns: 8em 1fr; gap:.5rem 1rem; padding:.5rem 0; }
.company-defs dt { font-weight:700; }
.client-list { columns: 2; column-gap: 2rem; } /* or gridでOK */

/* 画像 */
figure { margin: 0 0 1rem; }




