/*
Theme Name: ESTATE2026
Theme URI: 
Description: ESTATE
Version: 1.1
Author: ESTATE
Author URI: 
*/
@charset "UTF-8";
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.montserrat-font {
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: weight;
  font-style: normal;
}
body {
    margin: 0;
    padding: 0;
    font-family: YakuHanJP, "Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.9;
    overflow-x: hidden;
}
p {
    font-size: 0.95rem;
    margin: 0;
    font-weight: 400;
    line-height: 1.9;
    color: #222;
    font-family: YakuHanJP, "Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
a,
a:active,
a:focus,
a:active {
  text-decoration: none !important;
}
img{
    max-width: 100%;
}
.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}
.fade-left,
.fade-right{
  opacity: 0;
  transition: opacity .5s ease, transform .5s ease-out;
  will-change: transform, opacity;
}
.fade-left{
  transform: translateX(-60px);
}
.fade-right{
  transform: translateX(60px);
}
.fade-left.is-in,
.fade-right.is-in{
  opacity: 1;
  transform: translateX(0);
}
.fade-up{
  opacity: 0;
  transition: opacity .7s ease, transform .7s ease-out;
  will-change: transform, opacity;
}
.fade-up{
  transform: translateY(30px);
}
.fade-up.is-in{
  opacity: 1;
  transform: translateX(0);
}
:root{
    --bg: #333;      /* グレー背景 */
    --bar: #4f9c41;     /* 緑 */
    --barW: 2%;        /* 左端の幅（5%相当。厳密に5%なら 5% にしてOK） */
    --t-vert: 1200ms;   /* 縦に伸びる時間 */
    --t-horz: 700ms;    /* 横に広がる時間 */
    --t-fade: 500ms;    /* フェイドアウト */
    --ease-vert: cubic-bezier(.33,0,.2,1);
    --ease-horz: cubic-bezier(.3,.85,.45,1);
}
.loading{
  position: fixed;
  inset: 0;
  background: var(--bg);
  z-index: 9999;
  overflow: hidden;
  opacity: 1;
  transition: opacity var(--t-fade) ease;
  will-change: opacity;
}
.loading.is-fade{
  opacity: 0;
}
@keyframes loadingFade{
  to { opacity: 0; }
}
.loading__logo {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font: 700 28px/1.1 system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
    color: rgba(0,0,0,.65);
    letter-spacing: .04em;
    user-select: none;
}
.loading__bar{
    position: absolute;
    left: 0;
    top: 0;
    width: var(--barW);
    height: 0;
    background: var(--bar);
    transform-origin: top left;

    animation:
        barVertical var(--t-vert) var(--ease-vert) forwards,
        barHorizontal var(--t-horz) var(--ease-horz) forwards;

    animation-delay:
        0ms,
        var(--t-vert);
}
@keyframes barVertical {
    from { height: 0; }
    to   { height: 100vh; }
}
/* 横に広がる */
@keyframes barHorizontal {
    from { width: var(--barW); }
    to   { width: 100%; }
}
.loading__pct {
    position: absolute;
    left: 0;
    top: 0;
    font: 700 14px/1 system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
    color: #4f9c41;
    user-select: none;
    pointer-events: none;
    white-space: nowrap;
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: reduce){
    .loading__bar { animation: none; height: 100vh; width: 100%; opacity: 0; }
    .loading__pct { opacity: 0; }
}
.heading-wrap{
    position: relative;
    border-bottom: 3px double #ddd;
    padding: 3rem 0 2rem;
    margin: 0 0 3rem;
}
.heading-wrap::after{
    content: "";
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 150px;
    height: 3px;
    background-color: #4f9c41;
}
.heading-shape{
    position: relative;
}
.heading-shape::before{
    content: "";
    position: absolute;
    left: 13px;
    top: -15px;
    width: 10px;
    height: 60px;
    background: #4f9c41;
    transform: skewX(-25deg);
    transform-origin: center;
}
.heading-shape-w::before{
    content: "";
    position: absolute;
    left: 0px;
    top: -15px;
    width: 10px;
    height: 60px;
    background: #fff;
    transform: skewX(-25deg);
    transform-origin: center;
}
.heading-wrap h2 {
    position: relative;
    font-size: 2.25rem;
    line-height: 1.6;
    font-family: YakuHanJP,"Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    margin: 0 auto;
    letter-spacing: 2px;
    color: #333;
}
.heading-wrap h2::before {
    position: absolute;
    top: -50px;
    left: 50px;
    font-size: 1.5rem;
    font-family: "Montserrat", sans-serif;
    font-weight: bold;
    color: #4f9c41;
}


.sub-header{
    margin: 85px auto 0;
    background: #4f9c41;
    display: flex;
    justify-content: flex-end;
    align-items: self-end;
}
.sub-header-wrap {
    text-align: right;
    display: block;
    padding: 2.5rem 0.5rem 0.5rem;
}
.sub-header-wrap h2{
    font-family: "Montserrat", sans-serif;
    color: #fff;
    margin: 0 auto 5px;
    font-size: 4rem;
    letter-spacing: 3px;
    line-height: 1;
}
.sub-header-wrap p{
    font-size: 1.1rem;
    margin: 0 auto;
    color: #fff;
    font-weight: 600;
    letter-spacing: 2px;
}

h3 {
    font-family:YakuHanJP, "Noto Sans JP",'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
.link-btn {
    position: relative;
    display: inline-block;
    margin: 1.5rem auto 0;
}
.link-btn a {
    position: relative;
    display: flex;
    align-items: center;
}
.link-btn a p{
    position: relative;
    font-family: YakuHanJP,"Noto Sans JP",'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    font-size: 1.1rem;
    margin: 0;
    line-height: 1;
    color: #333;
    font-weight: 700;
    letter-spacing: 1px;
    display: inline-block;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3 ease;
    -o-transition: all 0.3 ease;
}
.link-btn a:hover p{
    color: #4f9c41;
}
.link-btn a p::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -5px; /* テキストの下に罫線が表示される位置 */
    width: 0;
    height: 1px; /* 線の太さ */
    background: #4f9c41; /* 線の色 */
    transition: width 0.2s ease;
}
.link-btn a:hover p::before {
    width: 100%;
}
.link-btn a span {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #4f9c41;
    font-size: 1.2rem;
    width: 70px;
    height: 70px;
    color: #fff;
    border-radius: 50%;
    margin: 0 0 0 2rem;
    overflow: visible; /* 波紋が隠れないようにする */
    z-index: 1; /* 矢印が前面に表示されるように */
    transition: transform 0.3s ease; /* ホバー時のスムーズなスケール変化 */
}
.link-btn a:hover span {
    transform: scale(1.1); /* a要素にホバーした時に少しだけ大きくする */
}
.link-btn a span::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: rgba(0, 128, 181, 0.5); /* 波紋の色を薄く調整 */
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.95);
    pointer-events: none;
    z-index: -1; /* 波紋を矢印の後ろに配置 */
    transition: transform 0.2s ease-out, opacity 0.2s ease-out;
}
.link-btn a:hover span::before {
    animation: pulsate 0.6s ease-out forwards;
}
@keyframes pulsate {
    0% {
        transform: translate(-50%, -50%) scale(0.95);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.4);
        opacity: 0;
    }
}
.sp-none{
    display: block;
}
.pc-none{
    display: none;
}
.sub-pages{
    margin: 0px auto 0;
    padding: 2.0vw 0 7.5vw;
}
.sub-pages .heading-wrap {
    margin: 0 0 4rem;
}
.breadcrumbs {
    position: relative;
    display: flex;
    align-items: center;
    font-size: 0.85rem;
    color: #333;
    margin: 0 auto 3.5rem;
}
.breadcrumbs a{
    color: #333;
    transition: 0.3s;
}
.breadcrumbs a:hover{
    color: #4f9c41;
    transition: 0.3s;
}
.breadcrumbs span.fas.fa-angle-right {
    color: #4f9c41;
    padding: 0 0.7rem;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    p {
        font-size: 0.9rem;
    }
    .heading-wrap h2 {
        position: relative;
        font-size: 1.8rem;
    }
    .sub-pages {
        margin: 0px auto 0;
        padding: 2vw 0 8vw;
    }
    .breadcrumbs {
        font-size: 0.7rem;
        margin: 0 auto 3rem;
    }
    .sub-header-wrap {
        padding: 2.0rem 0.5rem 0.5rem;
    }
    .sub-header-wrap h2 {
        margin: 0 auto 5px;
        font-size: 2.5rem;
        letter-spacing: 3px;
    }
    .sub-header-wrap p {
        font-size: 15px;
    }
}
@media screen and (max-width: 767px) {
    .sp-none{
        display: none;
    }
    .pc-none{
        display: block;
    }
    p {
        font-size: 0.9rem;
    }
    .heading-wrap h2 {
        font-size: 1.5rem;
    }
    .heading-wrap h2::before {
        top: -2.5rem;
        left: 0;
        font-size: 0.9rem;
    }
    .link-btn a span {
        font-size: 1.2rem;
        width: 60px;
        height: 60px;
        margin: 0 0 0 0.8rem;
    }
    .link-btn {
        margin: 1rem auto 0;
    }
    .link-btn a p {
        font-size: 1.0rem;
    }
    .sub-pages {
        margin: 0px auto 0;
        padding: 15px 0 70px;
    }
    .sub-pages .heading-wrap {
        margin: 0 0 50px;
    }
    .breadcrumbs {
        font-size: 11px;
        margin: 0 auto 25px;
        flex-wrap: wrap;
    }
    .heading-shape::before {
        content: "";
        position: absolute;
        left: 8px;
        top: 5px;
        width: 8px;
        height: 40px;
    }
    .heading-wrap h2::before {
        top: -31px;
        left: 35px;
        font-size: 0.9rem;
        font-weight: 800;
    }
    .heading-wrap {
        padding: 3rem 0 1.2rem;
    }
    .sub-header {
        margin: 70px auto 0;
    }
    .heading-wrap::after {
        width: 80px;
    }
    .sub-header-wrap {
        padding: 1.5rem 0.5rem 0.5rem;
    }
    .sub-header-wrap h2 {
        margin: 0 auto 3px;
        font-size: 24px;
    }
    .sub-header-wrap p {
        font-size: 12px;
    }
}
/* -----------------------------------ヘッダー・固定関連----------------------------------- */
header {
    width: 100%;
    position: fixed;
    display: flex;
    top: 0;
    left: 0;
    align-items: center;
    height: 85px;
    background: #333;
    z-index: 2;
    transition-duration: 0.5s;
}
header.hide {
  transform: translateY(-90px);
}
.header-h1-wrap {
    width: 350px;
    margin-left: 1.5%;
}
.header-h1-wrap h1 {
    font-size: 10px;
    padding: 0px 0 0;
    text-align: left;
    font-weight: 400;
    margin: 0;
    color: #fff;
}
img.logo {
    width: 200px;
    margin: 0px 0 3px;
    display: block;
}
.pc-menu{
    position: absolute;
    right: 125px;
    display: flex;
    align-items: center;
}
.pc-menu ul{
    display: flex;
    padding: 0 1rem 0 0;
}
.pc-menu ul a{
    padding: 10px 1.5rem;
    text-decoration: none;
}
.pc-menu ul a li{
    color: #fff;
    position: relative;
    font-weight: 600;
    list-style: none;
    text-decoration: none;
    font-size: clamp(12px, 1vw, 16px);
    letter-spacing: 1px;
}
.pc-menu ul a li:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    bottom: -6px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3 ease;
    -o-transition: all 0.3 ease;
}
.pc-menu ul a li:hover:after {
    background: #4f9c41;
    bottom: -1px;
}
.pc-tel-wrap{
    display: block;
    position: relative;
    border-left: 1px solid #ccc;
    padding: 0 2rem;
}
.pc-tel-wrap a{
    display: flex;
    font-size: 1.5rem;
    font-weight: 700;
    align-items: center;
    letter-spacing: 1px;
    text-decoration: none;
    color: #fff;
}
.pc-tel-wrap a i{
    background: #4f9c41;
    border-radius: 50%;
    position: relative;
    display: inline-block;
    width: 30px;
    height: 30px;
    text-align: center;
    margin-right: 8px;
}
.pc-tel-wrap a .fa-phone:before {
    content: "\f095";
    position: absolute;
    top: 8px;
    left: 8px;
    color: #fff;
    font-size: 14px;
}
.pc-tel-wrap p{
    margin: -5px 0 0;
    font-size: 0.75rem;
    text-align: right;
    color: #fff;
}
.pc-mail-wrap{
    display: flex;
    position: fixed;
    z-index: 3;
    right: 0px;
    top: 0px;
    width: 120px;
    height: 85px;
    cursor: pointer;
    align-items: center;
    background: #4f9c41;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3 ease;
}
.pc-mail-wrap a{
    margin: 0;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 1px;
    text-decoration: none;
}
.pc-mail-wrap a i {
    font-size: 1.4rem;
    transition: transform 0.3s ease, opacity 0.2s ease;
    position: relative;
    z-index: 2;
}
.pc-mail-wrap:hover{
    background: #fff;
}
.pc-mail-wrap:hover a{
    color: #4f9c41;
}
.hamburger,nav.globalMenuSp {
    display: none;
}
#page-top {
    position: fixed;
    right: 1.5%;
    bottom: 150px;
    height: 50px;
    text-decoration: none;
    font-weight: bold;
    letter-spacing: 1px;
    transform: rotate(90deg);
    font-size: 100%;
    line-height: 1.5rem;
    color: #00aecc;
    padding: 10px 0 0 35px;
    border-top: solid 2px;
}
#page-top::before {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    left: 0px;
    width: 15px;
    border-top: solid 2px;
    transform: rotate(35deg);
    transform-origin: left top;
}
#page-top:hover {
    bottom: 170px;
    transition: 0.3s;
}

@media screen and (min-width:768px) and ( max-width:1024px) {
    .pc-menu {
        display: none;
    }
    .pc-tel-wrap,.pc-mail-wrap{
        display: none
    }
    .header-h1-wrap h1 {
        font-size: 10px;
    }
    /*　ハンバーガーボタン　*/
    .hamburger {
        display: block;
        position: fixed;
        z-index: 3;
        right: 0px;
        top: 0px;
        width: 90px;
        height: 85px;
        cursor: pointer;
        text-align: center;
        background: #4f9c41;
    }
    .hamburger span {
        display : block;
        position: absolute;
        width   : 30px;
        height  : 2px ;
        left    : 30px;
        background : #fff;
        -webkit-transition: 0.3s ease-in-out;
        -moz-transition   : 0.3s ease-in-out;
        transition        : 0.3s ease-in-out;
    }
    .hamburger:hover {
        background: #4f9c41;
        transition: 0.3s;
    }
    .hamburger span:nth-child(1) {
    top: 40px;
    }
    .hamburger span:nth-child(2) {
    top: 50px;
    }
    .hamburger span:nth-child(3) {
    top: 60px;
    }
    .hamburger p{
        color: #fff;
        font-size: 12px;
        margin: 5px auto 0px;
        padding: 10px;
    }
    /* ナビ開いてる時のボタン */
    .hamburger.active span:nth-child(1) {
        top: 50px;
            left: 30px;
        -webkit-transform: rotate(-45deg);
        -moz-transform   : rotate(-45deg);
        transform        : rotate(-45deg);
    }
    .hamburger.active span:nth-child(2),
    .hamburger.active span:nth-child(3) {
        top: 50px;
        -webkit-transform: rotate(45deg);
        -moz-transform   : rotate(45deg);
        transform        : rotate(45deg);
    }
    nav.globalMenuSp {
        display: block;
        position: fixed;
        z-index : 2;
        top  : 85px;
        left : 0;
        color: #000;
        background: #fff;
        text-align: center;
        transform: translateX(100%);
        transition: all 0.3s;
        width: 100%;
    }
    /* このクラスを、jQueryで付与・削除する */
    nav.globalMenuSp.active {
        transform: translateX(0%);
        background: #333;
        background-size: cover;
        background-position: center;
    }
    .nav-open {
        position: relative;
        display: block;
        flex-wrap: wrap;
        margin: 30px 0 0;
        align-items: center;
        height: 100vh;
        justify-content: center;
        padding: 0px 0 150px;
        box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
    }
    .nav-open ul{
        width: 100%;
        padding: 0;
    }
    .nav-open ul a{
        text-decoration: none;
        color:#fff;
    }
    .nav-open ul a li {
        padding: 15px 5px;
        font-size: 1rem;
        font-weight: 600;
        list-style: none;
        letter-spacing: 3px;
        transition: 0.2s;
    }
    .nav-open ul a:hover{
        color: #4f9c41;
    }
    .sp-contact-wrap {
        display: block;
        width: 45%;
        border-radius: 20px;
        box-shadow: 0px 2px 5px rgb(0 0 0 / 15%);
        padding: 25px;
        margin: 30px auto 0;
        background: #fff;
    }
    .sp-tel-wrap{
        display: flex;
        position: relative;
        border-left: none;
        padding: 0 1.0rem;
        justify-content: center;
        flex-wrap: wrap;
    }
    .sp-tel-wrap a{
        display: flex;
        font-size: 1.8rem;
        font-weight: 700;
        align-items: center;
        text-decoration: none;
        color: #333;
        width: 100%;
        margin: 0 auto;
        position: relative;
        justify-content: center;
    }
    .sp-tel-wrap a i{
        background: #4f9c41;
        border-radius: 50%;
        position: relative;
        display: inline-block;
        width: 30px;
        height: 30px;
        text-align: center;
        margin-right: 8px;
    }
    .sp-tel-wrap a .fa-phone:before {
        content: "\f095";
        position: absolute;
        top: 8px;
        left: 8px;
        color: #fff;
        font-size: 14px;
    }
    .sp-tel-wrap p{
        margin: -5px 0 0;
        font-size: 0.9rem;
        text-align: right;
        color: #333;
    }
    .sp-mail-wrap{
        display: block;
        margin: 30px auto 0;
    }
    .sp-mail-wrap a{
        position: relative;
        display: block;
        text-decoration: none;
        color: #fff;
        background: #4f9c41;
        font-size: 0.95rem;
        padding: 25px 20px;
        border-radius: 50px;
        line-height: 1;
    }
    .sp-mail-wrap a i{
        font-size: 1.1rem;
        margin: 0 7px 0 0;
    }
}
@media screen and (max-width: 767px) {
    header {
        height: 70px;
    }
    .pc-menu {
        display: none;
    }
    .pc-tel-wrap,.pc-mail-wrap{
        display: none
    }
    img.logo {
        width: 150px;
        margin: 0px 0 3px;
        display: block;
    }
    .header-h1-wrap h1 {
        font-size: 0.55rem;
    }
    /*　ハンバーガーボタン　*/
    .hamburger {
        display: block;
        position: fixed;
        z-index: 3;
        right: 0px;
        top: 0px;
        width: 70px;
        height: 70px;
        cursor: pointer;
        text-align: center;
        background: #333;
    }
    .hamburger span {
        display : block;
        position: absolute;
        width   : 30px;
        height  : 2px ;
        left    : 20px;
        background : #fff;
        -webkit-transition: 0.3s ease-in-out;
        -moz-transition   : 0.3s ease-in-out;
        transition        : 0.3s ease-in-out;
    }
    .hamburger:hover {
        background: #333;
        transition: 0.3s;
    }
    .hamburger span:nth-child(1) {
    top: 32px;
    }
    .hamburger span:nth-child(2) {
    top: 40px;
    }
    .hamburger span:nth-child(3) {
    top: 48px;
    }
    .hamburger p {
        color: #fff;
        font-size: 10px;
        margin: 0px auto 0px;
        padding: 10px;
    }
    /* ナビ開いてる時のボタン */
    .hamburger.active span:nth-child(1) {
        top: 40px;
        left: 21px;
        -webkit-transform: rotate(-45deg);
        -moz-transform   : rotate(-45deg);
        transform        : rotate(-45deg);
    }
    .hamburger.active span:nth-child(2),
    .hamburger.active span:nth-child(3) {
        top: 40px;
        -webkit-transform: rotate(45deg);
        -moz-transform   : rotate(45deg);
        transform        : rotate(45deg);
    }
    nav.globalMenuSp {
        display: block;
        position: fixed;
        z-index : 2;
        top  : 70px;
        left : 0;
        color: #000;
        background: #fff;
        text-align: center;
        transform: translateX(100%);
        transition: all 0.3s;
        width: 100%;
    }
    /* このクラスを、jQueryで付与・削除する */
    nav.globalMenuSp.active {
        transform: translateX(0%);
        background: #fff;
        background-size: cover;
        background-position: center;
    }
    .nav-open{
        display: block;
        background: #333;
        flex-wrap: wrap;
        margin: 0px 0 0;
        height: 100vh;
        align-items: flex-start;
        justify-content: center;
        padding: 0px 0 70px;
        box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
    }
    .nav-open ul{
        width: 100%;
        padding: 15px 0 0;
    }
    .nav-open ul a{
        text-decoration: none;
        color:#333;
    }
    .nav-open ul a li {
        padding: 20px 5px;
        font-size: 15px;
        font-weight: 600;
        color: #fff;
        list-style: none;
        letter-spacing: 3px;
        transition: 0.3s;
        line-height: 1;
    }
    .nav-open ul a:hover{
        color: #4f9c41;
    }
    .sp-contact-wrap {
        display: block;
        width: 80%;
        border-radius: 10px;
        box-shadow: 0px 2px 5px rgb(0 0 0 / 15%);
        padding: 2% 5% 5%;
        background: #fff;
        margin: 20px auto 0;
    }
    .sp-tel-wrap{
        display: flex;
        position: relative;
        border-left: none;
        padding: 0 1.0rem;
        justify-content: center;
        flex-wrap: wrap;
    }
    .sp-tel-wrap a{
        display: flex;
        font-size:24px;
        font-weight: 800;
        align-items: center;
        text-decoration: none;
        color: #333;
        width: 100%;
        margin: 0 auto;
        position: relative;
        justify-content: center;
    }
    .sp-tel-wrap a i{
        background: #4f9c41;
        border-radius: 50%;
        position: relative;
        display: inline-block;
        width: 30px;
        height: 30px;
        text-align: center;
        margin-right: 8px;
        margin-top: 2px;
    }
    .sp-tel-wrap a .fa-phone:before {
        content: "\f095";
        position: absolute;
        top: 8px;
        left: 8px;
        color: #fff;
        font-size: 14px;
    }
    .sp-tel-wrap p{
        margin: -7px 0 0;
        font-size: 13px;
        text-align: right;
        color: #333;
    }
    .sp-mail-wrap{
        display: block;
        margin: 15px auto 0;
    }
    .sp-mail-wrap a{
        position: relative;
        display: block;
        text-decoration: none;
        color: #fff;
        background: #4f9c41;
        font-size: 1rem;
        padding: 25px 20px;
        letter-spacing: 1px;
        font-weight: 600;
        border-radius: 50px;
        line-height: 1;
    }
    .sp-mail-wrap a i{
        font-size: 1.1rem;
        margin: 0 7px 0 0;
    }
}
/* -----------------------------------フッター----------------------------------- */
footer {
    position: relative;
    background-color: #333;
    color: white;
    padding: 8rem 0 2rem;
    margin: 0rem auto 0;
}
.footer-content {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.footer-left{
    width: 30%;
}
.footer-left img {
    display: block;
    margin: 0 0 2.5rem;
    max-width: 270px;
}
.footer-left p {
    font-size: 0.85rem;
    color: #fff;
    line-height: 2;
}
.footer-right{
    width: 65%;
}
.footer-link01{
    display: flex;
    justify-content: center;
    border-bottom: 1px solid #777;
    margin: 0 auto 2rem;
    padding: 0 0 2rem;
}
.footer-link02{
    display: flex;
    justify-content: center;
}
.footer-link01 ul a,.footer-link02 ul a {
    position: relative;
    color: #fff;
    font-size: 0.95rem;
    text-decoration: none;
    line-height: 1;
    letter-spacing: 1px;
    display: inline-block;
    margin: 0 1.1rem;
    font-weight: 500;
}
.footer-link01 ul a::after,.footer-link02 ul a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -5px; /* テキストの下に罫線が表示される位置 */
    width: 0;
    height: 1px; /* 線の太さ */
    background: #fff; /* 線の色 */
    transition: width 0.2s ease;
}
.footer-link01 ul a:hover::after,.footer-link02 ul a:hover::after {
    width: 100%;
}
.footer-copy {
    width: 100%;
    text-align: center;
    margin: 5rem auto 0;
}
.footer-copy p {
    color: #fff;
    font-size: 0.8rem;
}
.footer-contact-wrap {
    position: absolute;
    top: -4rem;
    right: 10%;
    display: flex;
    width: 36%;
    max-width: 700px;
    min-width: 450px;
    align-items: center;
    background: #fff;
    border-radius: 100px;
    padding: 1.5% 1.2%;
    margin: 0 auto;
    z-index: 1;
    box-shadow: 0px 0px 10px rgb(0 0 0 / 15%);
}
.footer-tel-wrap{
    width: 50%;
    display: flex;
    position: relative;
    border-left: none;
    padding: 0;
    justify-content: center;
    flex-wrap: wrap;
}
.footer-tel-wrap a{
    display: flex;
    font-size: clamp(18px, 1.6vw, 30px);
    font-weight: 900;
    align-items: center;
    letter-spacing: 1px;
    line-height: 1.6;
    text-decoration: none;
    color: #333;
    width: 100%;
    margin: 0 auto;
    position: relative;
    justify-content: center;
}
.footer-tel-wrap a i{
    background: #4f9c41;
    border-radius: 50%;
    position: relative;
    display: inline-block;
    width: 2.0rem;
    height: 2.0rem;
    text-align: center;
    margin-right: 8px;
}
.footer-tel-wrap a .fa-phone:before {
    content: "\f095";
    position: absolute;
    top: 0.6rem;
    left: 0.6rem;
    color: #fff;
    font-size: 14px;
}
.footer-tel-wrap p{
    margin: 0px 0 0;
    font-size: 0.85rem;
    text-align: right;
    color: #111;
}
.footer-mail-wrap{
    width: 45%;
    display: block;
    margin: 0px auto 0;
    text-align: center;
}
.footer-mail-wrap a{
    position: relative;
    display: block;
    text-decoration: none;
    color: #fff;
    background: #4f9c41;
    border: 1px solid #fff;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 25px 20px;
    border-radius: 50px;
    transition: 0.3s;
    line-height: 1;
}
.footer-mail-wrap a i{
    font-size: 1.15rem;
    margin: 0 7px 0 0;
}
.footer-mail-wrap a:hover{
    position: relative;
    display: block;
    text-decoration: none;
    color: #4f9c41;
    background: #fff;
    border: 1px solid #4f9c41;
    border-radius: 50px;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    footer {
        padding: 5rem 0 2rem;
        margin: 0rem auto 0;
    }
    .footer-left {
        width: 45%;
    }
    .footer-left img {
        display: block;
        margin: 0 0 1.5rem;
        max-width: 270px;
    }
    .footer-left p {
        font-size: 0.7rem;
    }
    .footer-right {
        width: 54%;
    }
    .footer-link01 {
        text-align: center;
    }
    .footer-link01 ul a, .footer-link02 ul a {
        font-size: 0.8rem;
        margin: 0 1.5rem 1rem;
    }
    .footer-copy {
        margin: 5rem auto 0;
    }
    .footer-copy p {
        font-size: 0.65rem;
    }
    .footer-contact-wrap {
        display: none;
    }
}
@media screen and (max-width: 767px) {
    footer {
        padding: 70px 0 2rem;
        margin: 0px auto 0;
    }
    .footer-left {
        width: 100%;
        margin: 0 auto 30px;
    }
    .footer-left img {
        margin: 0 0 1.5rem;
        max-width: 320px;
    }
    .footer-left p {
        font-size: 0.8rem;
    }
    .footer-right {
        width: 100%;
    }
    .footer-link01 {
        margin: 0 auto 1rem;
        padding: 0 0 1rem;
        text-align: center;
    }
    .footer-link02 {
        text-align: center;
    }
    .footer-link01 ul a, .footer-link02 ul a {
        font-size: 0.9rem;
        display: block;
        margin: 2rem auto;
        width: 100%;
    }
    .footer-copy {
        margin: 50px auto 0;
    }
    .footer-contact-wrap {
        display: none;
    }
}
/* -----------------------------------トップメインビジュアル----------------------------------- */
.hero {
    position: relative;
    background-color: #fefefe;
    margin: 85px auto 0;
    padding: 80px 0 0;
}
.hero-text{
    position: relative;
    display: block;
}
.hero-text h2{
    font-size: 2.5rem;
    line-height: 1.5;
    font-family: serif;
    margin: 0 auto 1.5rem;
    letter-spacing: 3px;
    color: #222;
    font-weight: 900;
}
.hero-text p {
    font-size: 1.05rem;
    margin: 0;
    line-height: 2;
    color: #111;
}
.hero-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}
.hero-news{
    position: relative;
    margin: 80px auto 0;
}
.hero-news-inner{
    position: absolute;
    top: -30px;
    right: 0;
    background: #4f9c41;
    width: 40%;
    display: flex;
    align-items: center;
    z-index: 1;
}
.hero-news-inner span{
    background: #fff;
    padding: 2px 10px;
    font-size: 0.85rem;
    margin: 0 1.5rem;
    color: #4f9c41;
    font-weight: 600;
}
.hero-news-inner dl {
    display: flex;
    align-items: baseline;
}
.hero-news-inner dl dt{
    color: #fff;
    font-size: 0.85rem;
    line-height: 1;
}
.hero-news-inner dl dd {
    padding: 0px 0 0;
    margin: 0 0 5px 2rem;
}
.hero-news-inner a {
    position: relative;
    color: #fff;
    font-size: 0.9rem;
    text-decoration: none;
    line-height: 1;
    display: inline-block;
}
.hero-news-inner a::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -3px; /* テキストの下に罫線が表示される位置 */
    width: 0;
    height: 1px; /* 線の太さ */
    background: #fff; /* 線の色 */
    transition: width 0.2s ease;
}
.hero-news-inner a:hover::after {
    width: 100%;
}
.hero-img{
    position: relative;
    background-image: url(images/top/hero-bg.webp);
    width: 80%;
    height: auto;
    margin: 0 0 0 auto;
    background-position: center;
    aspect-ratio: 16/8;
    background-size: cover;
}
.hero-scrollbar {
    display: flex;
    position: absolute;
    top: 10%;
    right: 5%;
    z-index: 1;
    align-items: center;
    flex-direction: column;
}
.hero-scrollbar .txt {
    margin-bottom: 10px;
    color: #4f9c41;
    font-size: 0.8rem;
}
.hero-scrollbar .bar {
    background: #4f9c41;
    position: relative;
    display: inline-block;
    width: 1px;
    height: 234px;
}
.hero-scrollbar .bar::before {
    content: "";
    position: absolute;
    top: 0;
    left: -3px;
    width: 7px;
    height: 7px;
    background-color: #4f9c41;
    border-radius: 50%;
    animation-name: scrollBar;
    animation-duration: 3s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@keyframes scrollBar {
    0% {
      transform: translateY(0);
    }
    100% {
      transform: translateY(234px);
    }
}
.hero-scrollbar .txt {
    margin-bottom: 8px;
    color: #4f9c41;
    writing-mode: vertical-rl;
    text-orientation: sideways;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    .hero {
        padding: 50px 0 0;
    }
    .hero-news {
        position: relative;
        margin: 72px auto 0;
    }
    .hero-news-inner dl dt {
        font-size: 0.7rem;
    }
    .hero-news-inner dl dd {
        margin: 0 0 2px 1.5rem;
    }
    .hero-news-inner a {
        font-size: 0.75rem;
    }
    .hero-news-inner span {
        font-size: 0.7rem;
        margin: 0 1.0rem;
    }
    .hero-news-inner {
        width: 65%;
    }
    .hero-text h2 {
        font-size: 1.9rem;
    }
    .hero-text p {
        font-size: 0.9rem;
    }
    .hero-scrollbar .bar {
        height: 200px;
    }
    .hero-scrollbar {
        right: 1%;
    }
    @keyframes scrollBar {
        0% {
          transform: translateY(0);
        }
        100% {
          transform: translateY(200px);
        }
    }
}
@media screen and (max-width: 767px) {
    .hero {
        margin: 70px auto 0;
        padding: 50px 0 0;
    }
    .hero-text h2 {
        font-size: 26px;
        margin: 0 auto 25px;
        letter-spacing: 2px;
    }
    .hero-text p {
        font-size: 15px;
        width: 100%;
        line-height: 1.9;
    }
    .hero-news-inner {
        top: -30px;
        right: 0;
        width: 93%;
        z-index: 1;
    }
    .hero-news {
        margin: 70px auto 0;
    }
    .hero-news-inner span {
        padding: 8px 5px;
        font-size: 10px;
        margin: 0 10px;
        line-height: 1;
    }
    .hero-news-inner dl dt {
        font-size: 10px;
        line-height: 1;
    }
    .hero-news-inner dl dd {
        padding: 0px 0 0;
        margin: 0 0 3px 10px;
        line-height: 1;
    }
    .hero-news-inner a {
        font-size: 11px;
        line-height: 1.4;
    }
    .hero-scrollbar {
        display: none;
    }
    .hero-img {
        width: 96%;
    }
}
/* ----------------------トップAbout-------------------------- */
section.top-about{
    position: relative;
    padding: 5vw 0;
    overflow-x: hidden;
}
section.top-about::before {
    content: "ABOUT";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 10%;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}

section.top-about .heading-wrap {
    width: 65%;
}
section.top-about .heading-wrap h2::before {
    content: "ABOUT";
}
.top-about p{
    font-size: 1rem;
    margin: 0 auto 1rem;
    line-height: 1.9;
}
.top-about-bg{
    position: relative;
    background-image: url(images/top/about-bg.webp);
    height: 500px;
    width: 55%;
    max-width: 950px;
    margin: 0 0 0 auto;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 1;
    overflow: hidden;
    clip-path: inset(0 100% 0 0);
    transition: clip-path .9s cubic-bezier(.2,.85,.3,1);
    will-change: clip-path;
}
.top-about-bg.is-in{
    clip-path: inset(0 0 0 0);
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.top-about {
        position: relative;
        padding: 8vw 0;
    }
    section.top-about::before {
        font-size: 6rem;
        right: -15px;
    }
    section.top-about .heading-wrap {
        width: 80%;
    }
    .top-about p {
        font-size: 0.9rem;
    }
    .top-about-bg {
        height: 300px;
        width: 65%;
    }
    @keyframes scrollBar {
        0% {
          transform: translateY(0);
        }
        100% {
          transform: translateY(190px);
        }
    }
}
@media screen and (max-width: 767px) {
    section.top-about {
        position: relative;
        padding: 70px 0;
    }
    section.top-about::before {
        content: none;
    }
    section.top-about .heading-wrap {
        width: 100%;
    }
    .top-about p {
        font-size: 15px;
    }
    .top-about-bg {
        height: 200px;
        width: 80%;
    }
}
.onestop{
    position: relative;
    padding: 0 0 5vw;
}
.midashi-wrap {
    position: relative;
    text-align: center;
}
.midashi-wrap h2{
    position: relative;
    display: inline-block;
    font-size: 2.25rem;
    text-align: center;
    color: #333;
    line-height: 1.5;
    letter-spacing: 2px;
    margin: 0 auto 5rem;
}
.midashi-wrap h2:before{
    content: "";
    position: absolute;
    width: 80px;
    height: 5px;
    bottom: -2.5rem;
    left: 50%;
    transform: translateX(-50%);
    background: #4f9c41;
}
.onestop-p{

}
.onestop-p p{
    text-align: center;
    line-height: 1.9;
    color: #111;
    font-size: 1rem;
}
.onestop-wrap{
    position: relative;
    margin: 3rem auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.onestop-wrap .left{
    width: 48%;
    border:2px solid #333;
    text-align: center;
}
.onestop-wrap .right{
    width: 48%;
    border: 2px solid #4f9c41;
    text-align: center;
}
.onestop-wrap .left h3{
    background: #333;
    color: #fff;
    margin: 0 auto;
    text-align: center;
    line-height: 1;
    padding: 1rem;
    font-size: 1.5rem;
}
.onestop-wrap .right h3{
    background: #4f9c41;
    color: #fff;
    margin: 0 auto;
    text-align: center;
    line-height: 1;
    padding: 1rem;
    font-size: 1.5rem;
}
.onestop-wrap .right img,.onestop-wrap .left img {
    padding: 30px 30px 20px;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    .midashi-wrap h2 {
        font-size: 1.8rem;
    }
    .onestop-p p {
        text-align: left;
        font-size: 14px;
    }
    .onestop-wrap {
        margin: 1.5rem auto;
    }
    .onestop {
        padding: 0 0 8vw;
    }
    .onestop-wrap .left h3,.onestop-wrap .right h3 {
        padding: 1rem;
        font-size: 1.0rem;
    }
    .onestop-wrap .right img, .onestop-wrap .left img {
        padding: 25px 25px 15px;
    }
}
@media screen and (max-width: 767px) {
    .midashi-wrap h2 {
        font-size: 1.5rem;
        margin: 0 auto 4rem;
    }
    .midashi-wrap h2:before {
        width: 70px;
        height: 3px;
        bottom: -2.0rem;
    }
    .onestop-p p {
        text-align: left;
        line-height: 2;
        font-size: 15px;
    }
    .onestop-wrap {
        flex-wrap: wrap;
        margin: 2rem auto;
    }
    .onestop-wrap .left {
        width: 100%;
        margin: 0 auto 20px;
    }
    .onestop-wrap .right {
        width: 100%;
    }
    .onestop-wrap .left h3,.onestop-wrap .right h3 {
        padding: 1rem;
        font-size: 1.2rem;
    }
    .onestop {
        position: relative;
        padding: 0 0 60px;
    }
    .onestop-wrap .right img, .onestop-wrap .left img {
        padding: 15px 10px 10px;
    }
}
/* ----------------------トップService-------------------------- */
section.top-services {
    position: relative;
    background-color: #4f9c41;
    padding: 250px 0 5vw;
    margin: -250px auto 0;
    overflow-x: hidden;
}
section.top-services::before {
    content: "SERVICES";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 20%;
    right: -25px;
    color: #fff;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.1;
    transform: rotate(-180deg);
}
section.top-services .heading-wrap h2::before {
    content: "Services";
    color: #fff;
}
section.top-services .heading-wrap h2{
    color: #fff;
}
section.top-services .heading-wrap {
    width: 50%;
}
section.top-services .heading-wrap::after {
    content: none;
}
.services-cards {
    position: relative;
}
.service-card {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    margin: 4rem auto;
}
.service-card img{
    width: 43%;
}
.service-card-inner {
    width: 40%;
}
.service-card-inner span{
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 1px;
    font-family: "Noto Sans JP",'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
.service-card-inner h3{
    font-size: 1.9rem;
    color: #fff;
    margin: 1.0rem auto 2.5rem;
    letter-spacing: 1px;
    line-height: 1;
}
.service-card-inner p {
    color: #fff;
    font-size: 1rem;
}
.service-card.card-reverse{
    flex-direction: row-reverse;
}
.services-link-wrap {
    position: relative;
    margin: 0 auto 1rem;
    text-align: center;
}
.services-link-wrap02 {
    margin: 2.5rem auto 0;
}
.services-link-wrap .link-btn a p {
    color: #fff;
}
.services-link-wrap .link-btn a:hover p {
    color: #fff;
}
.services-link-wrap .link-btn a p::before {
    background: #fff; /* 線の色 */
}
.services-link-wrap .link-btn a span {
    background: #fff;
    color: #4f9c41;
}
.services-link-wrap .link-btn a span::before {
    background: rgba(255, 255, 255, 0.5); /* 波紋の色を薄く調整 */
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.top-services {
        padding: 160px 0 8vw;
        margin: -160px auto 0;
    }
    section.top-services::before {
        font-size: 6rem;
        right: -15px;
    }
    .service-card-inner h3 {
        font-size: 1.4rem;
        margin: 1.0rem auto 2rem;
    }
    .service-card img {
        width: 47%;
    }
    .service-card {
        margin: 3rem auto;
    }
    .service-card-inner p {
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    section.top-services {
        padding: 175px 0 70px;
        margin: -100px auto 0;
    }
    section.top-services::before {
        content:none;
    }
    section.top-services .heading-wrap {
        width: 100%;
    }
    .service-card img {
        width: 95%;
    }
    .service-card-inner {
        width: 95%;
        margin: 25px auto 0;
    }
    .service-card-inner span {
        font-size: 0.8rem;
    }
    .service-card-inner h3 {
        font-size: 1.3rem;
        margin: 1.5rem auto 2.0rem;
    }
    .service-card {
        margin: 3rem auto;
    }
    .service-card-inner p {
        color: #fff;
        font-size: 14px;
    }
}
/* ----------------------トップachievement-------------------------- */
section.top-achievement{
    position: relative;
    padding: 5vw 0;
}
section.top-achievement::before {
    content: "ACHIEVEMENT";
    position: absolute;
    top: 40%;
    left: 0;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    opacity: 0.1;
    font-family: "Montserrat", sans-serif;
}
section.top-achievement .heading-wrap {
    width: 65%;
}
section.top-achievement .heading-wrap h2::before {
    content: "ACHIEVEMENT";
}
.top-achievement-txt {
    position: relative;
    border-bottom: 1px solid #eee;
    padding: 0 0 3rem;
    margin: 0 0 1.5rem;
}
.top-achievement p{
    font-size: 1rem;
    line-height: 1.9;
}
.achievement-cards {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 8% 0 0;
    overflow: visible;
}
.slider-container {
    overflow: hidden;
}
.achievement-slider {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}
.achievement-slider li {
    margin: 0 15px;
    transition: all 0.3s ease;
}
.achievement-slider li a {
    display: block;
    text-decoration: none;
    transition: all 0.3s ease;
}
.achievement-slider li img {
    width: 100%;
    height: auto;
    /*object-fit: cover;
    aspect-ratio: 16/12;*/
    transition: opacity 0.3s ease;
}
.achievement-slider li:hover img {
    opacity: 0.7;
}
.achievement-slider li:hover h3,
.achievement-slider li:hover p {
    color: #4f9c41;
}
.achievement-card {
    padding: 10px 5px 0;

}
.achievement-card h3 {
    margin: 0.8rem auto 1rem;
    font-size: 0.95rem;
    color: #333;
    line-height: 1.4;
}
.achievement-card p{
    font-size: 0.85rem;
    line-height: 1;
    margin: 0 auto 1rem;
}

.achievement-slider-bottom{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.achievement-slider-bottom p{
    padding: 0 1rem 0 0;
    font-weight: bold;
    font-size: 1.05em;
    color: #f36533;
}
.achievement-slider li:hover .achievement-slider-bottom p {
    color: #f36533;
}
.achievement-category {
    display: inline-block !important;
    background-color: #4f9c41;
    color: #fff;
    padding: 3px 1rem;
    margin: 0 0 0 5px;
    text-decoration: none;
    font-size: 0.75em;
    transition: all 0.3s ease;
}
/* ナビゲーションボタンのスタイル */
.slick-prev, .slick-next {
    position: absolute;
    top: 8.5%;
    transform: translateY(-50%);
    background: #4f9c41;
    border: 1px solid #4f9c41;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1;
    border: none;
    color: #fff;
}
.slick-prev:before, .slick-next:before {
    font-family: 'slick';
    font-size: 22px;
    line-height: 1;
    opacity: 1;
}
.slick-prev {
    left: 16.9%;
}
.slick-next {
    left: -47.5%;
}
.slick-prev span, .slick-next span {
    font-size: 24px;
    color: #fff;
}
.slick-prev:hover,.slick-prev:focus, .slick-next:hover,.slick-next:focus{
    outline: none;
    background: #4f9c41;
}
.achievement-link-wrap {
    position: relative;
    display: block;
    margin: 3rem auto 7rem;
}
.achievement-link-wrap .link-btn {
    position: absolute;
    right: 20%;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.top-achievement {
        position: relative;
        padding: 8vw 0;
        overflow: hidden;
    }
    section.top-achievement::before {
        top: 42%;
        font-size: 6rem;
    }
    .top-achievement p {
        font-size: 0.9rem;
    }
    .achievement-cards {
        padding: 10% 0 0;
        margin: 3% auto 0;
        overflow: visible;
    }
    .slick-next {
        left: -28%;
    }
    .achievement-link-wrap .link-btn {
        position: absolute;
        right: 10%;
    }
    .top-achievement p {
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    section.top-achievement {
        padding: 70px 0 80px;
    }
    section.top-achievement::before {
        content: none;
    }
    section.top-achievement .heading-wrap {
        width: 100%;
    }
    .top-achievement p {
        font-size: 15px;
    }
    .achievement-slider li {
        margin: 0 10px;
    }
    .achievement-cards {
        width: 90%;
        padding: 20% 0 0;
    }
    .achievement-card h3 {
        margin: 0.8rem auto 1rem;
        font-size: 0.95rem;
    }
    .achievement-card p {
        font-size: 0.85rem;
    }
    .achievement-link-wrap {
        margin: 1rem auto 6rem;
    }
    .slick-prev, .slick-next {
        width: 60px;
        height: 60px;
    }
    .slick-prev, .slick-next {
        top: 6%;
    }
    .slick-prev {
        left: 1vw;
    }
    .slick-next {
        left: 65vw;
    }
    .achievement-slider-bottom p {
        font-size: 20px;
        padding: 0 2rem 0 0;
    }
    .achievement-slider-bottom {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
}
/* ----------------------トップOverview-------------------------- */
section.top-overview{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 5vw 0 0;
}
section.top-overview::before {
    content: "FAQ";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 1rem;
    right: -3%;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    opacity: 0.2;
}
section.top-overview .heading-wrap h2::before {
    content: "FAQ";
    color: #4f9c41;
}
.overview-left{
    width: 50%;
    background: url(images/top/overview.webp);
    background-size: cover;
    background-position: center;
    height: 70vh;
    min-height: 500px;
    z-index: 1;
}
.overview-right{
    width: 50%;
    padding: 0 8%;
}
.overview-right p{
    font-size: 0.95rem;
    margin: 0 auto 1rem;
    line-height: 1.9;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.top-overview {
        padding: 8vw 0;
    }
    section.top-overview::before {
        top: 0.5rem;
        right: 1%;
        color: #4f9c41;
        font-size: 6rem;
        z-index: 0;
    }
    .overview-left {
        width: 47%;
        background: url(images/top/overview.webp);
        background-size: cover;
        background-position: center;
        height: 450px;
        min-height: 450px;
        z-index: 1;
    }
    .overview-right {
        width: 52%;
        padding: 0 5%;
    }
    .overview-right p {
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    section.top-overview {
        padding: 0vw 0 80px;
    }
    .overview-left {
        width: 95%;
        height: 200px;
        min-height: 200px;
    }
    .overview-right {
        width: 100%;
        padding: 0 5%;
        margin: 50px auto 0;
    }
    .overview-right p {
        font-size: 15px;
    }
    section.top-overview::before {
        content: none;
    }
}
/* ----------------------Map埋め込み-------------------------- */
.map{
    position: relative;
    width: 100%;
    margin: 0 auto -10px;
}
.map iframe {
    width: 100%;
    height: 400px;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    .map iframe {
        width: 100%;
        height: 350px;
    }
}
@media screen and (max-width: 767px) {
    .map iframe {
        width: 100%;
        height: 250px;
    }
}
/* ---------------servicesページ---------------- */
section.services {
    position: relative;
    overflow-x: hidden;
    padding: 2.0vw 0 0;
}
section.services::before {
    content: "SERVICES";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    mix-blend-mode: color-burn;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.1;
    transform: rotate(-180deg);
}
section.services .heading-wrap{
    width: 50%;
}
section.services .heading-wrap h2::before {
    content: "SERVICES";
}
.services-wrap {
    position: relative;
    width: 90%;
    display: block;
    margin: 0 auto 1.5vw;
}
.services-wrap span {
    font-size: 1.3rem;
    font-weight: 700;
    color: #4f9c41;
    letter-spacing: 1px;
    font-family: "Noto Sans JP",'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
.services-wrap h3 {
    font-size: 1.9rem;
    color: #333;
    margin: 1.0rem auto 2.5rem;
    letter-spacing: 1px;
    line-height: 1;
}
.services-wrap p{
    margin: 0 auto 0.8rem;
    font-size: 1rem;
}
.services-contents01 {
    position: relative;
    margin: 2rem auto 5rem;
}
.services-contents01 h4 {
    font-size: 1.3rem;
    color: #4f9c41;
    font-family: "Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    margin: 0 auto 1rem;
    padding: 0 0 1rem;
    border-bottom: 1px solid #4f9c41;
}
.services-contents01 ul {
    display: flex;
    flex-wrap: wrap;
}
.services-contents01 ul li {
    font-size: 1.05rem;
    padding: 0 0.7rem 0 0;
}
.services-contents03 ul li {
    color: #fff;
}
.services-contents01 ul li::before{
    content: "・";
    color: #4f9c41;
    font-weight: bold;
    padding: 0 0.2rem 0 0;
}
.services-contents03 ul li::before{
    content: "・";
    color: #fff;
    font-weight: bold;
    padding: 0 0.2rem 0 0;
}
.services-figure01 {
    position: relative;
    background: url(images/services/services-bg01.webp);
    height: 400px;
    width: 55%;
    background-size: cover;
    background-position: center;
    z-index: 1;
}
.services-color-bg {
    background: #4f9c41;
    margin: -200px auto -200px;
    padding: 200px 0 200px;
}
.services-color-bg .services-wrap {
    margin: 5rem auto 5.5rem;
}
.services-color-bg02 {
    padding: 1rem 0 2rem;
    margin: 0rem auto 0;
}
.services-color-bg .services-wrap span,.services-color-bg .services-wrap h3,.services-color-bg .services-wrap p{
    color: #fff;
}
.services-figure01 {
    position: relative;
    background: url(images/services/services-bg01.webp);
    height: 400px;
    width: 55%;
    background-size: cover;
    background-position: center;
    z-index: 1;
    overflow: hidden;
    clip-path: inset(0 100% 0 0);
    transition: clip-path .9s cubic-bezier(.2, .85, .3, 1);
    will-change: clip-path;
}
.services-figure02 {
    position: relative;
    background: url(images/services/services-bg02.webp);
    height: 400px;
    width: 55%;
    background-size: cover;
    background-position: center;
    z-index: 1;
    display: block;
    margin: 0 0 5rem auto;
    overflow: hidden;
    clip-path: inset(0 100% 0 0);
    transition: clip-path .9s cubic-bezier(.2, .85, .3, 1);
    will-change: clip-path;
}
.services-figure01.is-in,.services-figure02.is-in {
    clip-path: inset(0 0 0 0);
}
.services-contents02 {
    display: block;
    text-align: center;
    margin: 2.5rem auto 0;
    padding: 2.5rem;
    background: #fff;
}
.services-contents03 {
    position: relative;
    margin: 2rem auto 0rem;
}
.services-contents03 h4 {
    font-size: 1.3rem;
    color: #fff;
    font-family: "Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    margin: 0 auto 1rem;
    padding: 0 0 1rem;
    border-bottom: 1px solid #fff;
}
.services-contents03 p {
    margin: 0 auto 1.5rem;
}
.services-contents03 p:last-child{
    margin: 0 auto;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.services::before{
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    section.services .heading-wrap {
        width: 70%;
    }
    .services-wrap {
        width: 90%;
    }
    .services-wrap h3 {
        font-size: 1.4rem;
        margin: 1.0rem auto 2rem;
    }
    .services-wrap p {
        margin: 0 auto 0.8em;
        font-size: 14px;
    }
    .services-contents01 ul li {
        font-size: 1.0rem;
        padding: 0 0.7rem 0 0;
    }
    .services-figure01,.services-figure02 {
        height: 300px;
    }
    .services-color-bg {
        background: #4f9c41;
        margin: -150px auto -150px;
        padding: 150px 0 150px;
    }
    .services-contents01 h4,.services-contents03 h4 {
        font-size: 1.1rem;
    }
    .services-color-bg02 {
        padding: 0.5rem 0 0.5rem;
        margin: 0rem auto 0;
    }
}
@media screen and (max-width: 767px) {
    section.services::before {
        content: none;
    }
    section.services .heading-wrap {
        width: 100%;
    }
    .services-wrap {
        width: 100%;
    }
    .services-wrap span {
        font-size: 16px;
        font-weight: 800;
    }
    .services-wrap h3 {
        font-size: 1.3rem;
        margin: 1.0rem auto 2.0rem;
    }
    .services-wrap p {
        margin: 0 auto 1em;
        font-size: 15px;
    }
    .services-figure01,.services-figure02 {
        height: 200px;
        width: 75%;
    }
    .services-contents01 ul li {
        font-size: 14px;
    }
    .services-contents01 h4, .services-contents03 h4 {
        font-size: 18px;
    }
    .services-contents01 {
        margin: 2rem auto 60px;
    }
    .services-color-bg {
        background: #4f9c41;
        margin: -100px auto -100px;
        padding: 100px 0 100px;
    }
    .services-color-bg .services-wrap {
        margin: 60px auto 70px;
    }
    .services-contents02 {
        padding: 10px 5px 5px;
    }
    .services-figure02 {
        height: 200px;
        width: 75%;
        margin: 0 0 60px auto;
    }
    .services-color-bg02 {
        padding: 0.5rem 0 0.5rem;
        margin: 0rem auto 0;
    }
}
/* ---------------overviewページ---------------- */
section.overview {
    position: relative;
    overflow-x: hidden;
}
section.overview::before {
    content: "Inheritance";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -12px;
    color: #4f9c41;
    font-size: 8rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.1;
    transform: rotate(-180deg);
    z-index: 1;
}
section.overview .heading-wrap{
    width: 50%;
}
section.overview .heading-wrap h2::before {
    content: "Inheritance";
}
.overview-wrap01 {
    position: relative;
    width: 90%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin: 0 auto 5.5rem;
}
.overview-wrap01 h3, .overview-contents02 h3,.overview-contents04 h3{
    display: block;
    width: 100%;
    font-size: 1.9rem;
    color: #333;
    margin: 1.5rem auto 3.5rem;
    padding: 0 0 1.5rem;
    letter-spacing: 1px;
    line-height: 1;
}
.overview-wrap01 p {
    width: 55%;
}
.overview-contents01 {
    position: relative;
    width: 40%;
    padding: 2rem;
    border-radius: 5px;
    background: #f5fcff;
    border: 1px solid #4f9c41;
}
.overview-contents03 {
    position: relative;
    display: block;
    width: 85%;
    margin: 1.5rem auto;
    padding: 1rem 2rem;
    border-radius: 5px;
    background: #f5fcff;
    border: 1px solid #4f9c41;
}
.overview-contents01 h4,.overview-contents03 h4 {
    font-size: 1.3rem;
    color: #4f9c41;
    font-family: "Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    margin: 0 auto 1rem;
    padding: 0 0 1rem;
    border-bottom: 1px solid #4f9c41;
}
.overview-contents01 ul li,.overview-contents03 ul li {
    font-size: 0.9rem;
    padding: 0.2rem 0;
}
.overview-contents01 ul li::before,.overview-contents03 ul li::before{
    content: "・";
    color: #4f9c41;
    font-weight: bold;
}
.overview-wrap02 {
    position: relative;
    background: #fafafa;
    padding: 4.5rem 0 5rem;
}
.overview-contents02{
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.overview-contents02 .left{
    width: 45%;
}
.overview-contents02 .left p{
    margin: 1rem auto;
}
.overview-contents02 .right{
    width: 50%;
    padding: 1rem;
    background: #fff;
}
.line {
    position: relative;
}
.line::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background-color: #4f9c41;
    transition: width 1s ease;
}
.line.scrolled::after {
    width: 100%;
}
.overview-wrap03{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.overview-wrap03 .left{
    width: 50%;
    background: url(images/inheritance/inheritance02.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 800px;
}
.overview-wrap03 .right {
    width: 50%;
    padding: 2.5% 5%;
}
.overview-wrap03 .right h3{
    display: block;
    width: 100%;
    font-size: 1.9rem;
    color: #333;
    margin: 1.5rem auto 3.5rem;
    padding: 0 0 1.5rem;
    letter-spacing: 1px;
    line-height: 1;
}
.overview-wrap04 {
    position: relative;
    padding: 4.5rem 0 0;
}
.overview-contents04{
    width: 90%;
    margin: 0 auto;
}
.overview-inner04 {
    width: 95%;
    position: relative;
    margin: 2rem auto 0;
}
.overview-inner04 h4{
    font-size: 1.3rem;
    color: #4f9c41;
    font-family: "Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    margin: 0 auto 1rem;
    padding: 0 0 1rem;
    border-bottom: 1px solid #4f9c41;
}
.overview-inner04 ul {
    display: flex;
    flex-wrap: wrap;
}
.overview-inner04 ul li {
    font-size: 0.95rem;
    padding: 0 0.7rem 0 0;
}
.overview-inner04 ul li::before {
    content: "・";
    color: #4f9c41;
    font-weight: bold;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.overview::before{
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    section.overview .heading-wrap {
        width: 70%;
    }
    .overview-wrap01 p {
        width: 50%;
    }
    .overview-contents01 {
        width: 47%;
        padding: 1rem;
        z-index: 1;
    }
    .overview-contents01 h4, .overview-contents03 h4 {
        font-size: 1.1rem;
    }
    .overview-contents01 ul li, .overview-contents03 ul li {
        font-size: 0.85rem;
        padding: 0.2rem 0;
    }
    .overview-contents02 .left {
        width: 100%;
    }
    .overview-contents02 .right {
        width: 90%;
        padding: 2rem;
        margin: 1rem auto 0;
    }
    .overview-wrap03 .left {
        width: 100%;
        height: 350px;
    }
    .overview-wrap03 .right {
        width: 81%;
        margin: 4rem auto 0rem;
        padding: 0;
    }
    .overview-inner04 h4 {
        font-size: 1.1rem;
    }
    .overview-inner04 ul li {
        font-size: 0.85rem;
    }
    .overview-wrap01 h3, .overview-contents02 h3,.overview-contents04 h3{
        font-size: 1.4rem;
        margin: 1.0rem auto 2rem;
    }
}
@media screen and (max-width: 767px) {
    section.overview::before {
        content: none;
    }
    section.overview .heading-wrap {
        width: 100%;
    }
    .overview-wrap01 {
        position: relative;
        width: 100%;
        margin: 0 auto 70px;
    }
    .overview-wrap01 h3, .overview-contents02 h3, .overview-contents04 h3 {
        width: 100%;
        font-size: 1.2rem;
        margin: 0 auto 2rem;
        padding: 0 0 1rem;
        line-height: 1.5;
    }
    .overview-wrap01 p {
        width: 100%;
    }
    .overview-contents01 {
        width: 100%;
        padding: 20px;
        margin: 2.5rem auto 0;
    }
    .overview-contents01 h4, .overview-contents03 h4 {
        font-size: 1.0rem;
    }
    .overview-contents01 ul li, .overview-contents03 ul li {
        font-size: 0.85rem;
        padding: 0.2rem 0;
    }
    .overview-contents02 {
        width: 100%;
    }
    .overview-wrap02 {
        padding: 60px 0 70px;
    }
    .overview-contents02 .left {
        width: 100%;
    }
    .overview-contents02 .left p {
        margin: 0 auto 1rem;
    }
    .overview-contents02 .right {
        width: 100%;
        padding: 10px 5px 5px;
        margin: 1.0rem auto 0;
    }
    .overview-wrap03 .left {
        width: 100%;
        height: 200px;
    }
    .overview-wrap03 .right {
        width: 90%;
        margin: 0 auto;
        padding: 60px 0 0;
    }
    .overview-contents03 {
        width: 100%;
        margin: 1.5rem auto;
        padding: 20px;
    }
    .overview-wrap03 .right h3 {
        width: 100%;
        font-size: 1.2rem;
        margin: 0 auto 2rem;
        padding: 0 0 1rem;
        line-height: 1.5;
    }
    .overview-wrap04 {
        padding: 60px 0 0;
    }
    .overview-contents04 {
        width: 100%;
    }
    .overview-inner04 h4 {
        font-size: 1.0rem;
    }
    .overview-inner04 ul li {
        font-size: 0.8rem;
        padding: 0 0.7rem 0 0;
    }
}
/* ---------------achievementページ---------------- */
section.achievement {
    position: relative;
}
section.achievement-post {
    position: relative;
    overflow-x: hidden;
}
section.achievement::before {
    content: "ACHIEVEMENT";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}
section.achievement-post::before {
    content: "ACHIEVEMENT";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}
section.achievement .heading-wrap{
    width: 50%;
}
section.achievement-post .heading-wrap{
    width: 50%;
}
section.achievement .heading-wrap h2{
    color: #333;
}
section.achievement .heading-wrap::after {
    background-color: #4f9c41;
}
section.achievement .heading-wrap h2::before {
    content: "ACHIEVEMENT";
    color: #4f9c41;
}
section.achievement .soldout .heading-wrap h2::before {
    content: none;
}
section.achievement-post .heading-wrap h2::before {
    content: "ACHIEVEMENT";
    color: #4f9c41;
}
.top-achievement-card {
    margin: 0 auto 15px;
}
.achievement-slider-bottom p.achievement-category {
    display: inline-block !important;
    background-color: #4f9c41;
    color: #fff;
    font-weight: 500;
    letter-spacing: 1px;
    padding: 3px 0.8rem;
    margin: 0 0 0rem 0.5rem;
    text-decoration: none;
    font-size: 0.8em;
    transition: all 0.3s ease;
}
.achievement-slider li:hover .achievement-slider-bottom p.achievement-category {
    color: #fff;
}
.achievements-cards {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 0 0 0;
    overflow: visible;
}
.achievement-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}
.achievement-inner li {
    width: 29.3%;
    margin: 2% 2%;
    transition: all 0.3s ease;
    background: #fafafa;
    box-shadow: 0 0 10px rgb(0 0 0 / 10%);
}
.achievement-inner li a {
    display: block;
    text-decoration: none;
    transition: all 0.3s ease;
}
.achievement-inner li img {
    width: 100%;
    height: auto;
    /*object-fit: cover;
    aspect-ratio: 16/12; */
    transition: opacity 0.3s ease;
}
.achievement-inner li:hover img {
    opacity: 0.7;
}
.achievement-inner li:hover h3,
.achievement-inner li:hover p {
    color: #4f9c41;
}
.achievement-card {
    padding: 0px 0.5rem 0;
}
.achievement-card h3 {
    margin: 0.8rem auto 0rem;
    font-size: 1rem;
    color: #333;
    line-height: 1.4;
}
.achievement-card p{
    font-size: 0.9rem;
    line-height: 1;
    margin: 0.8rem auto 0.3rem;
}
.achievement-bottom{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin: 0 auto 1rem;
}
.achievement-bottom p{
    font-size: 1.5rem;
    padding: 0 1rem;
    font-weight: bold;
    color: #f36533;
}
.achievement-bottom p.achievement-category{
    display: inline-block !important;
    background-color: #4f9c41;
    color: #fff;
    font-weight: 500;
    letter-spacing: 1px;
    padding: 3px 0.8rem;
    margin: 0 0 0rem 0.5rem;
    text-decoration: none;
    font-size: 0.8em;
    transition: all 0.3s ease;
}
.achievement-inner li:hover .achievement-bottom p {
    color: #f36533;
}
.achievement-inner li:hover .achievement-bottom p.achievement-category{
    color: #fff;
}
.achievement-post-wrap{
    position: relative;
    width: 80%;
    display: block;
    margin: 0 auto ;
}
.achievement-post-data01{
    display: block;
    margin: 0 auto 3.5rem;
}
.achievement-post-data01 dl {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 1.0rem 1.5rem;
    margin: 0rem 0 0rem;
    border-bottom: 1px solid #ccc;
}
.achievement-post-data01 dl dt {
    width: 20%;
    font-size: 1rem;
    letter-spacing: 1px;
    font-weight: 700;
}
.achievement-post-data01 dl dd {
    width: 75%;
    font-size: 1rem;
}
.achievement-post-data01 dl:before {
    content: "";
    position: absolute;
    width: 20%;
    height: 1px;
    background: #4f9c41;
    left: 0;
    bottom: -1px;
}
.achievement-post-data01 dl dd span.name {
    font-size: 1.1rem;
}
.achievement-post-data01 dl dd span.price {
    font-size: 1.5rem;
    font-weight: 700;
    color: #f36533;
    padding-right: 5px;
}
.achievement-post-data02 {
    display: block;
    margin: 0 auto 2.5rem;
}
.achievement-post-data02 p{
    font-size: 1rem;
    margin: 0 auto 0.8rem;
}
.achievement-post-data03{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-top: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
}
.achievement-post-data03 dl {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
}
.achievement-post-data03 dl dt{
    width: 30%;
    font-size: 15px;
    font-weight: 500;
    background: #ececec;
    padding: 15px 20px;
    border-bottom: 1px solid #cccccc;
}
.achievement-post-data03 dl dd{
    width: 70%;
    font-size: 15px;
    margin: 0;
    padding: 15px 20px;
    border-bottom: 1px solid #cccccc;
}

.slider{
    display: grid;
    grid-template-columns: 70px 1fr 70px; /* 矢印幅 / 中央 / 矢印幅 */
    align-items: center;                 /* ← 全部を上下中央へ */
    gap: 0;
    max-width: 850px;
    margin: 40px auto;
}
.slider__viewport{
    overflow: hidden;
    display: flex;
    align-items: center;
}
.slider__track{
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
    transition: transform .45s ease;
    will-change: transform;
}
.slider__slide{
    flex: 0 0 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.slider__slide img{
    max-width: 100%;
    max-height: 100%;   /* ←見切れ防止の要 */
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
}
.slider__arrow{
    position: static;
    width: 60px;
    height: 120px;
    justify-self: center;  /* セル内で中央寄せ */
    background: transparent;
    border: none;
    cursor: pointer;
    opacity: .35;
    transition: opacity .2s ease;
}
.slider__arrow:hover{ opacity: .7; }

.slider__arrow--left{
  left: calc(var(--arrow-space) * -1);   /* 外に出す */
}
.slider__arrow--right{
  right: calc(var(--arrow-space) * -1);  /* 外に出す */
}

/* 三角をCSSで作る */
.slider__arrow--left::before,
.slider__arrow--right::before{
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin: auto;
  border-style: solid;
}

.slider__arrow--left::before{
  border-width: 40px 48px 40px 0;
  border-color: transparent #4f9c41 transparent transparent;
}

.slider__arrow--right::before{
  border-width: 40px 0 40px 48px;
  border-color: transparent transparent transparent #4f9c41;
}
.achievement-gallery {
    width: 80%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 10px;
    margin: 0 auto 2.5rem;
}
.main-image {
    width: 75%;
    height: 430px; /* 希望の高さに調整 */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.main-image img {
    width: auto;
    height: 100%;
    object-fit: contain; /* 縦横比を保ちながら高さを揃える */
}
.thumbnails {
    width: 20%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin: 00px 0 0;
}
.thumbnail {
    width: 125px;
    height: 125px;
    background-size: cover;
    background-position: center;
    cursor: pointer;
}
.empty-thumbnail {
    background-color: #ddd; /* グレー背景 */
    cursor: default;
}
.achievement-post-link-wrap {
    display: block;
    margin: 2rem auto 1rem;
    text-align: center;
}
.pn{
    display: block;
    margin: 2rem auto 2rem;
    text-align: center;
}
.wp-pagenavi a, .wp-pagenavi span {
    text-decoration: none;
    border: 1px solid #ffffff!important;
    padding: 5px 7px!important;
    margin: 3px;
    color: #fff;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
    border-color: #fff!important;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
    border-color: #fff;
    background: #fff;
    color: #4f9c41;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.achievement::before{
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    section.achievement .heading-wrap {
        width: 70%;
    }
    .achievement-inner li {
        width: 30%;
        margin: 1.65%;
    }
    .achievement-card {
        padding: 0 0.5rem;
    }
    .achievement-card h3 {
        font-size: 15px;
    }
    .achievement-card p {
        font-size: 12px;
        line-height: 1.3;
        margin: 0.5rem auto 0.8rem;
    }
    .achievement-category {
        padding: 3px 0.8rem;
        margin: 0 0 0rem 0.5rem;
        font-size: 0.7em;
    }
    .achievement-bottom p {
        font-size: 16px;
    }
    section.achievement-post {
        position: relative;
        overflow-x: hidden;
    }
    section.achievement-post::before{
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    section.achievement-post .heading-wrap {
        width: 70%;
    }
    .achievement-post-wrap{
        position: relative;
        width: 90%;
    }
    .achievement-post-data01 dl dt {
        font-size: 0.9rem;
    }
    .achievement-post-data01 dl dd {
        width: 70%;
        font-size: 0.9rem;
    }
    .achievement-post-data01 dl dd span.name {
        font-size: 1.0rem;
    }
    .achievement-post-data01 dl dd span.price {
        font-size: 1.2rem;
    }
    .achievement-post-data03 dl dt {
        width: 35%;
        font-size: 13px;
        padding: 15px 5px;
        text-align: center;
    }
    .achievement-post-data03 dl dd {
        width: 65%;
        font-size: 13px;
        padding: 15px 10px;
    }
    .achievement-post-data02 p {
        font-size: 14px;
        margin: 0 auto 1rem;
    }
    .achievement-gallery {
        width: 100%;
    }
    .main-image {
        height: 350px;
    }
    .thumbnail {
        width: 110px;
        height: 110px;
    }
    .achievement-bottom p.achievement-category {
        padding: 7px 0.5rem 8px;
        font-size: 12px;
        line-height: 1;
    }
    .slider__slide img{
        max-width: 450px;
        width: 100%;
        height: auto;
    }
    .slider__arrow--right {
        position: relative;
        right: 15px;
    }
}
@media screen and (max-width: 767px) {
    section.achievement::before {
        content: none;
    }
    section.achievement .heading-wrap {
        width: 100%;
    }
    .achievement-inner li {
        width: 90%;
        margin: 0% auto 30px;
    }
    .achievement-card {
        padding: 0px 1rem 0;
    }
    .achievement-category {
        margin: 0 0 0rem 1rem;
        font-size: 12px;
    }
    .achievement-card h3 {
        margin: 0.8rem auto 0rem;
        font-size: 15px;
    }
    .achievement-card p {
        font-size: 14px;
        line-height: 1;
        margin: 0.7rem auto 0.7rem;
    }
    section.achievement-post::before {
        content: none;
    }
    section.achievement-post .heading-wrap {
        width: 100%;
    }
    .achievement-post-wrap {
        width: 100%;
    }
    .achievement-post-data01 {
        display: block;
        margin: 0 auto 50px;
    }
    .achievement-post-data01 dl {
        padding: 10px 10px;
        margin: 0rem 0 0rem;
    }
    .achievement-post-data01 dl dt {
        width: 100%;
        font-size: 15px;
        font-weight: 700;
        letter-spacing: 2px;
        border-bottom: 1px dotted #ccc;
        padding: 0 0 10px;
        margin: 0 0 10px;
    }
    .achievement-post-data01 dl dd {
        width: 100%;
        font-size: 14px;
        margin: 0;
        padding: 0 10px;
    }
    .achievement-post-data01 dl dd span.name,.achievement-post-data01 dl dd span.price {
        font-size: 16px;
    }
    .achievement-post-data02 p {
        font-size: 15px;
        margin: 0 auto 0.8rem;
    }
    .achievement-post-data02 {
        margin: 0 auto 30px;
    }
    .achievement-post-data03 dl {
        width: 100%;
    }
    .achievement-post-data03 dl dt {
        width: 30%;
        font-size: 13px;
        padding: 15px 5px;
        text-align: center;
    }
    .achievement-post-data03 dl dd {
        width: 70%;
        font-size: 13px;
        padding: 15px 10px;
    }
    .achievement-gallery {
        width: 100%;
        flex-direction: column;
        align-items: center;
        margin: 0 auto 30px;
    }
    .main-image {
        width: 100%;
        height: 260px;
    }
    .main-image img {
        width: 100%;
    }
    .thumbnails {
        flex-direction: row;
        justify-content: center;
        width: 100%;
        margin: -5px 0 0;
    }
    .thumbnail {
        width: 120px;
        height: 100px;
    }
    .thumbnails img {
        width: 33.33%;
    }
    .achievement-post-link-wrap {
        display: block;
        margin: 30px auto 0rem;
        text-align: left;
    }
    .achievement-bottom p {
        padding: 0 1.2rem 0px 0px;
        font-weight: bold;
        font-size: 20px;
    }
    .achievement-bottom p.achievement-category {
        padding: 7px 0.7rem;
        margin: 0 0 0rem 1rem;
        font-size: 12px;
        line-height: 1;
    }
    .slider {
        display: grid;
        grid-template-columns: 30px 1fr 30px;
        align-items: center;
        gap: 0;
        max-width: 100%;
        margin: 40px auto;
        padding: 0;
    }
    .achievement-slider-bottom p.achievement-category {
        padding: 3px 0.8rem;
        margin: 0 0 0rem 1rem;
        font-size: 12px;
    }
    .slider__arrow{ width: 44px; height: 92px; }
    .slider__arrow--left::before{ border-width: 20px 20px 20px 0; }
    .slider__arrow--right::before{ border-width: 20px 0 20px 20px; }
    .slider__viewport{
    touch-action: pan-y;
    }

    .slider__arrow--left {
        position: relative;
        left: -25px;
    }
    .slider__arrow--right {
        position: relative;
        right: 5px;
    }
}
/* ---------------news-singleページ---------------- */
section.news-single {
    position: relative;
    overflow-x: hidden;
}
section.news-single::before {
    content: "NEWS";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
    z-index: 1;
}
section.news-single .heading-wrap{
    width: 50%;
}
section.news-single .heading-wrap h2::before {
    content: "NEWS";
}
.news-single-wrap {
    position: relative;
    width: 90%;
    display: block;
    margin: 0 auto 2rem;
}
.news-single-wrap h3 {
    display: block;
    width: 100%;
    font-size: 1.9rem;
    color: #333;
    margin: 1.5rem auto 3.5rem;
    padding: 0 0 1.5rem;
    letter-spacing: 1px;
    line-height: 1.5;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.news-single::before{
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    section.news-single .heading-wrap {
        width: 70%;
    }
    .news-single-wrap h3{
        font-size: 1.4rem;
        margin: 1.0rem auto 2rem;
    }
}
@media screen and (max-width: 767px) {
    section.news-single::before {
        content: none;
    }
    section.news-single .heading-wrap {
        width: 100%;
    }
    .news-single-wrap {
        width: 100%;
    }
    section.news-single h3{
        width: 100%;
        font-size: 1.2rem;
        margin: 0 auto 2rem;
        padding: 0 0 1rem;
        line-height: 1.5;
    }
}
/* ---------------companyページ---------------- */
section.company,section.recruit {
    position: relative;
    overflow-x: hidden;
}
section.company::before {
    content: "ABOUT";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}
section.recruit::before {
    content: "RECRUIT";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}
section.company .heading-wrap,section.recruit .heading-wrap{
    width: 50%;
}
section.company .heading-wrap h2::before {
    content: "ABOUT";
}
section.recruit .heading-wrap h2::before {
    content: "RECRUIT";
}
.company-txt {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 auto 5vw;
}
.company-txt .left{
    width: 50%;
    background: url(images/company/company-bg.webp);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    height: 450px;
}
.company-txt .right {
    width: 49%;
    padding: 5% 7%;
}
.company-txt .right p {
    font-size: 1rem;
    margin: 1rem auto;
}
.company-wrap {
    position: relative;
    width: 80%;
    display: block;
    margin: 0 auto 1.5vw;
}
.company-wrap dl {
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 2rem 1.5rem;
    margin: 0rem 0 0rem;
    border-bottom: 1px solid #ccc;
}
.company-wrap dl:before {
    content: "";
    position: absolute;
    width: 20%;
    height: 1px;
    background: #4f9c41;
    left: 0;
    bottom: -1px;
}
.company-wrap dl dt{
    width: 20%;
    font-size: 1rem;
    letter-spacing: 1px;
}
.company-wrap dl dd{
    width: 75%;
    font-size: 1rem;
}
.recruit-txt{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 auto 3vw;
}
.recruit-txt p {
    font-size: 1rem;
    margin: 1rem auto;
    text-align: center;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.company::before,section.recruit::before{
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    section.company .heading-wrap,section.recruit .heading-wrap {
        width: 70%;
    }
    .company-txt .right p {
        font-size: 15px;
        margin: 1rem auto;
    }
    .company-txt .left {
        width: 45%;
        height: 450px;
    }
    .company-txt .right {
        width: 54%;
        padding: 0% 5%;
    }
    .company-wrap {
        width: 90%;
    }
    .company-wrap dl dt {
        font-size: 14px;
    }
    .company-wrap dl dd {
        width: 70%;
        font-size: 14px;
    }
    .recruit-txt p {
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    section.company::before,section.recruit::before {
        content: none;
    }
    section.company .heading-wrap,section.recruit .heading-wrap {
        width: 100%;
    }
    .company-txt {
        align-items: flex-start;
        margin: 0 auto 25px;
        flex-direction: column-reverse;
    }
    .company-txt .left {
        width: 95%;
        height: 200px;
    }
    .company-txt .right {
        width: 100%;
        padding: 0 5% 25px;
    }
    .company-txt .right p {
        margin: 0 auto 1rem;
        font-size: 15px;
    }
    .company-wrap {
        width: 100%;
    }
    .company-wrap dl {
        padding: 20px 10px;
        margin: 0rem 0 0rem;
    }
    .company-wrap dl dt {
        width: 100%;
        font-size: 16px;
        font-weight: 700;
        letter-spacing: 2px;
        border-bottom: 1px dotted #ccc;
        padding: 0 0 10px;
        margin: 0 0 10px;
    }
    .company-wrap dl dd {
        width: 100%;
        font-size: 15px;
        margin: 0;
        padding: 0 10px;
    }
    .recruit-txt p {
        font-size: 15px;
        margin: 0rem auto 1rem;
        text-align: left;
    }
}
/* ------------お問い合わせページ---------------- */
section.contact {
    position: relative;
    overflow-x: hidden;
}
section.contact::before {
    content: "CONTACT";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.1;
    transform: rotate(-180deg);
}
section.contact .heading-wrap{
    width: 50%;
}
section.contact .heading-wrap h2::before {
    content: "CONTACT";
}
.contact-txt {
    position: relative;
    margin: 0 auto 4vw;
}
.contact-txt p{
    text-align: center;
    font-size: 1rem;
    margin: 0 auto 1rem;
}
.contact-txt p a{
    color: #4f9c41;
}
.contact-txt p a:hover{
    opacity: 0.8;
}
.contact-txt p span{
    font-size: 0.9rem;
    color: #c40000;
}
form {
    width: 70%;
    min-width: 800px;
    margin: 0 auto;
    padding: 20px;
}
.form-group {
    position: relative;
    display: flex;
    align-items: center;
    margin-bottom: 35px;
    padding-bottom: 35px;
    border-bottom: 1px solid #ccc;
}
.form-group:after {
    content: "";
    background: #4f9c41;
    width: 29%;
    height: 1px;
    position: absolute;
    bottom: -1px;
}
.form-group label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 30%;
    font-size: 0.95rem;
    font-weight: 600;
    font-family: "Noto Sans JP",'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
.form-group .checkbox-group label {
    width: 100%;
    font-size: 0.9rem;
    font-weight: 400;
}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
    flex: 1;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    height: 45px;
}
.checkbox-group label {
    display: block;
    margin-bottom: 10px;
    font-weight: 400;
}
textarea {
    height: 150px;
}
.required {
    display: inline-block;
    color: white;
    font-weight: normal;
    background: #e24343;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.0;
    padding: 5px 5px 6px;
    border-radius: 3px;
    margin: 0 1.5rem 1px 0;
}
#remainingRequired {
    color: #e24343;
    font-weight: bold;
    margin-bottom: 30px;
    text-align: center;
}
.form-group p {
    padding: 0 40% 0 10px;
}
select#timing {
    padding: 10px;
}
  button {
    padding: 10px 20px;
    color: white;
    border: none;
    border-radius: 4px;
    display: block;
    margin: 0 auto;
    cursor: not-allowed;
    transition: background-color 0.3s, cursor 0.3s;
  }
button {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #4f9c41;
  font-weight: bold;
  padding: 20px 10px 20px 25px;
  border-radius: 50px;
  border: solid 1px #4f9c41;
  max-width: 320px;
  width: 100%;
  box-sizing: border-box;
  margin: 0 auto 0;
}
button span {
    color: #fff;
    letter-spacing: 2px;
    font-size: 16px;
}
button:enabled {
    cursor: pointer;
}
button:hover {
    background-color: #fff;
}
button:hover span{
    color: #4f9c41;
}
div#confirmationContainer h2{
    display: block;
    text-align: center;
    margin: 0 auto 25px;
    font-size: 18px;
}
.form-wrap table {
      width: 70%;
      margin: 0 auto 50px;
      border-collapse: collapse;
}
.form-wrap table,.form-wrap table th,.form-wrap table td {
    border: 1px solid #ccc;
    padding: 10px;
    font-family: "Noto Sans JP",'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
    font-weight: 400;
    font-size: 0.95rem;
}
.form-wrap table th {
    background-color: #f2fef0;
    text-align: left;
    font-family: "Noto Sans JP",'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
}
.message {
    font-family: "Noto Sans JP",'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
    text-align: center;
    margin: 20px auto;
    padding: 20px;
    border: 1px solid #4f9c41;
    background-color: #fdfffd;
    width: 70%;
    max-width: 800px;
    line-height: 1.9;
}
  #confirmationContainer button#backButton{
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    padding: 15px;
    border-radius: 50px;
    border: solid 1px #4f9c41;
    max-width: 320px;
    width: 100%;
    letter-spacing: 1px;
    box-sizing: border-box;
    margin: 0 auto 0;
    transition: 0.3s;
  }
  #confirmationContainer button#finalSubmitButton{
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    padding: 15px;
    border-radius: 50px;
    border: solid 1px #4f9c41;
    max-width: 320px;
    letter-spacing: 1px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto 25px;
    transition: 0.3s;
  }
  #confirmationContainer button#backButton:hover,#confirmationContainer button#finalSubmitButton:hover{
    background:#fff;
    color: #4f9c41;
  }
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.contact::before{
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    section.contact .heading-wrap{
        width: 70%;
    }
    form {
        width: 90%;
        min-width: 90%;
    }
    .contact-txt p {
        text-align: left;
        font-size: 14px;
    }
    .form-group label {
        width: 35%;
        font-size: 0.9rem;
    }
    .form-group p {
        padding: 0 20% 0 10px;
    }
    .form-wrap table th {
        font-family: "Noto Sans JP",'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
        font-size: 0.9rem;
        width: 35%;
    }
    .form-wrap table, .form-wrap table th, .form-wrap table td {
        font-size: 0.9rem;
    }
    #confirmationContainer button#finalSubmitButton {
        font-size: 16px;
        margin: 0 auto 20px;
    }
}
@media screen and (max-width: 767px) {
    section.contact::before {
        content: none;
    }
    section.contact .heading-wrap {
        width: 100%;
    }
    .contact-txt p {
        text-align: left;
        font-size: 15px;
    }
    form {
        width: 100%;
        min-width: 100%;
        padding: 10px;
    }
    .form-wrap {
        position: relative;
        margin: 70px auto 25px;
    }
    .form-group {
        flex-wrap: wrap;
    }
    .form-group label {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        width: 100%;
        margin: 0 auto 15px;
        font-size: 0.95rem;
    }
    .required {
        font-size: 10px;
        padding: 5px 5px 6px;
        margin: 0 0 3px 1rem;
    }
    div#confirmationContainer h2 {
        font-size: 16px;
    }
    .form-wrap table tr {
        display: flex;
        flex-wrap: wrap;
    }
    .form-wrap table, .form-wrap table th, .form-wrap table td {
        width: 95%;
        border: 1px solid #ccc;
        padding: 15px 10px;
        font-size: 0.85rem;
        line-height: 1.6;
    }
    .form-wrap table th {
        width: 100%;
        font-size: 0.85rem;
        line-height: 1.5;
        text-align: center;
        border: none;
    }
    .form-wrap table td {
        width: 100%;
        border: none;
        border-bottom: 1px solid #ccc;
    }
    .message {
        font-family: "Noto Sans JP",'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
        text-align: left;
        margin: 0px auto;
        padding: 20px 15px;
        width: 100%;
        max-width: 100%;
        font-size: 15px;
        line-height: 1.9;
    }
    .contact-txt {
        position: relative;
        margin: 0 auto 30px;
    }
}
section.faq {
    position: relative;
    overflow-x: hidden;
}
section.faq .heading-wrap{
    width: 50%;
}
section.faq::before {
    content: "FAQ";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}
section.faq .heading-wrap h2::before {
    content: "FAQ";
}
.faq-wrap{
    position: relative;
    width: 90%;
    display: block;
    margin: 0 auto;
    background: none;
    padding: 10px 35px;
}
.faq-item{
  border-bottom: 1px solid #ccc;
}
.faq-item:last-child{
  border-bottom: none
}
.faq-q{
    list-style: none;
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 22px 10px;
    cursor: pointer;
}
.faq-q::-webkit-details-marker{
  display: none;
}
.faq-mark{
    color: #4f9c41;
    display: grid;
    place-items: center;
    font-weight: 700;
    border-radius: 50%;
    flex: none;
    font-size: 28px;
}
.faq-amark{
  color: #e74040;
}
.faq-qtext {
    font-size: 18px;
    font-weight: 500;
    line-height: 1.7;
}
.faq-a {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 0 10px 22px;
}
.faq-atext p{
  margin: 0 0 10px;
  line-height: 1.9;
}
.faq-atext p:last-child{
  margin-bottom: 0;
}
.faq-item[open] .faq-q{
  padding-bottom: 12px;
}
/* A部分をアニメ対象にする */
.faq-a {
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition:
    height 0.35s ease,
    opacity 0.25s ease;
}
/* open時 */
.faq-item[open] .faq-a {
  max-height: 1000px; /* 中身より十分大きく */
  opacity: 1;
}
@media (max-width: 1024px) {
    section.faq .heading-wrap {
        width: 70%;
    }
    .faq-qtext {
        font-size: 16px;
    }
    .faq-atext p {
        font-size: 14px;
    }
    .faq-mark {
        font-size: 24px;
    }
    .faq-q {
        gap: 14px;
    }
    .faq-a {
        gap: 14px;
    }
    .faq-wrap {
        padding:0;
    }
}
@media (max-width: 767px) {
    .faq-wrap {
        width: 100%;
        padding: 0;
    }
    section.faq .heading-wrap{
        width: 100%;
    }
    .faq-qtext {
        font-size: 15px;
    }
    section.faq::before {
        content: none;
    }
}

/* ------------プライバシーポリシー・サイトポリシー---------------- */
section.privacy,section.policy {
    position: relative;
    overflow-x: hidden;
}
section.privacy .heading-wrap,section.policy .heading-wrap{
    width: 50%;
}
section.privacy::before {
    content: "PRIVACY POLICY";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}
section.policy::before {
    content: "SITE POLICY";
    position: absolute;
    font-family: "Montserrat", sans-serif;
    top: 50px;
    right: -25px;
    color: #4f9c41;
    font-size: 10rem;
    font-weight: bold;
    line-height: 1;
    writing-mode: vertical-rl;
    opacity: 0.2;
    transform: rotate(-180deg);
}
section.privacy .heading-wrap h2::before {
    content: "PRIVACY POLICY";
}
section.policy .heading-wrap h2::before {
    content: "SITE POLICY";
}
.privacy-wrap,.policy-wrap{
    position: relative;
    width: 90%;
    display: block;
    margin: 0 auto;
}
.privacy-wrap h3,.policy-wrap h3{
    font-size: 1rem;
}
.privacy-wrap p,.policy-wrap p{
    font-size: 1rem;
    margin: 0 auto 1rem;
    color: #111;
}
.company-wrap dl dd a button{
    display: inline-block;
    background-color: #4f9c41;
    font-weight: bold;
    padding: 15px 5px 15px 5px;
    border-radius: 50px;
    border: solid 1px #4f9c41;
    max-width: 100px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 0 0 1rem;
}
.company-wrap dl dd a button:hover{
    background-color: #fff;
    color: #4f9c41;
}
@media screen and (min-width:768px) and ( max-width:1024px) {
    section.privacy .heading-wrap,section.policy .heading-wrap {
        width: 70%;
    }
    .privacy-wrap p,.policy-wrap p {
        font-size: 0.9rem;
    }
    .privacy-wrap,.policy-wrap {
        position: relative;
        width: 95%;
    }
    section.privacy::before,section.policy::before  {
        font-size: 6rem;
        right: -15px;
        top: 50px;
    }
    .company-wrap dl dd a button {
        padding: 10px 5px 10px 5px;
        max-width: 85px;
        width: 100%;
        box-sizing: border-box;
        margin: 0 0 0 0.5rem;
    }
}
@media screen and (max-width: 767px) {
    section.privacy .heading-wrap,section.policy .heading-wrap {
        width: 100%;
    }
    section.privacy::before,section.policy::before {
        content: none;
    }
    .privacy-wrap,.policy-wrap {
        width: 100%;
    }
    .privacy-wrap h3,.policy-wrap h3 {
        font-size:16px;
    }
    .privacy-wrap p,.policy-wrap p {
        font-size: 14px;
    }
    .company-wrap dl dd a button {
        padding: 8px 5px 8px 5px;
        max-width: 70px;
        margin: 0 0 0 0.5rem;
    }
}























