/*
theme Name: fukudesign-hp
Auther: Fuku
Description:ふくデザイン
Version: 1.0
*/

@charset "utf-8";

html {
    margin-top: 0 !important;
    scroll-behavior: smooth;
}

h1,
h2,
h3,
h4,
h5,
p,
ul,
li {
    margin: 0;
    padding: 0;
}

*{
    color: #4b4641;
}

.faq-contents{
    padding-bottom: 100px;
    max-width: 1080px;
    margin: 0 auto;
}

.faq-intro{
    text-align: center;
    margin-bottom: 50px;
    padding-top: 100px;
    padding-bottom: 50px;
    border-bottom: 1px solid #AA9E96;
}
.faq-intro p{
    font-size: 18px;
    line-height: 1.75;
    letter-spacing: 1.45px;
    color: #756a61;
}

.faq-category{
    padding-top: 50px;
}

.faq-category .block-sub-title{
    color: #AA9E96;
    font-weight: 700!important;
    font-size: 1.25rem;
    margin-bottom: 30px;
}

.faq-item{
    margin-bottom: 30px;
    padding: 20px;
    border-radius: 10px;
    background-color: #fff;
    box-shadow: 0 0 20px rgba(0,0,0,0.05);
}

.faq-q{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #4b4641;
    letter-spacing: 1.45px;
    font-weight: 700;
    padding-bottom: 10px;
    border-bottom: 1px solid #e7e4e2;
    margin-bottom: 20px;
}

.faq-a{
    font-size: 14px;
    color: #756a61;
    line-height: 1.75;
    letter-spacing: 1.45px;
    padding-left: 20px;
}
.faq-a p{
    font-size: 14px;
    line-height: 1.75;
    letter-spacing: 1.45px;
}

.faq-a ol{
    padding-left: 20px;
}

.faq-a ol li{
    font-size: 14px;
    line-height: 1.75;
    letter-spacing: 1.45px;
}

.faq-a ol li::before{
    content: "・";
    margin-right: 10px;
}

.faq-cta{
    margin-top: 50px;
}
.faq-cta p{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
}
.faq-cta .cta-btn-wrap{
    margin-top: 30px;
}

.faq-cta .cta-btn{
    background-color: #4caf50;
    color: #fff;
    border-radius: 35px;
    padding: 18px 30px 18px 50px;
    overflow: hidden;
    position: relative;
    z-index: 1;
    transition: .5s ease-in-out;
    border-radius: 35px;
    box-shadow: 0 2px 4px rgba(70,67,67,.2);
}

.faq-cta .cta-btn .fa-arrow-right{
    color: #fff;
}   

.faq-cta .cta-btn:hover{
    background: #ffffffc5;
    box-shadow: 0 6px 15px rgba(0, 0, 0, .161);
    transform: translateY(-2px);
}

/* Aマーク */
.entry-content h3 + p,
.entry-content h3 + ul,
.entry-content h3 + ol {
position: relative;
padding-left: 50px;
}

.absolute{
    position: absolute;
    top: 10%;
    left: 5%;
}

.relative{
    position: relative;
}

.entry-content h3 + p::before,
.entry-content h3 + ul::before,
.entry-content h3 + ol::before {
content: "A";
position: absolute;
left: 0;
top: 3px;

width: 32px;
height: 32px;
border-radius: 50%;

background: #e53935;
color: #fff;

display: flex;
align-items: center;
justify-content: center;

font-weight: bold;
font-size: 14px;
}

/* Qマーク */
.entry-content h3 {
    position: relative;
    padding-left: 50px;
  }
  
  .entry-content h3::before {
    content: "Q";
    position: absolute;
    left: 0;
    top: 3px;
    
    width: 32px;
    height: 32px;
    border-radius: 50%;
    
    background: #111;
    color: #fff;
    
    display: flex;
    align-items: center;
    justify-content: center;
    
    font-weight: bold;
    font-size: 14px;
  }


.copyright{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.copyright a{
    font-size: 10px;
    display: inline-block;
    color: #99938e;
    letter-spacing: 0;
    margin-top: 30px;
    text-align: center;
}
.copyright a:hover{
    color: #4b4641;
}
.copyright p{
    padding: 6px 0!important;
    width: 100%;
    text-align: center;
    font-size: 10px;
    color: #99938e;
    letter-spacing: 0;
}

.copyright-top{
    font-size: larger!important;
    font-weight: 600;
    color: #4b4641;
}

.copyright-wrap{
    margin-top: 35px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.logo{
    font-weight: 700;
}
tr {
    vertical-align: baseline;
}

th{
    font-weight: normal;
}

.page-id-43 .contents-sub-title,.page-id-989 .contents-sub-title,.page-id-991 .contents-sub-title{
    color:#AA9E96;
    font-weight: 900!important;
}

/* プライバシーポリシー */
.contact-check:before{
    top: 5px!important;
}

.contact-poricy ul{
    border: 1px solid #AA9E96;
    border-radius: 5px;
    padding: 20px 50px!important;
    margin-top: 30px;
}

.contact-title{
font-size: 24px!important;
text-align: center;
font-weight: 500!important;
padding-bottom: 24px;
}


.contents-3 li{
    padding-top: 0!important;
}
/* 新・お問い合わせページ */
/* 全体的なフォームのスタイリング */
form {
    font-family: "MFW-TBGoStd-DemiBold", "Noto Sans JP", sans-serif;
    color: #33241a;
    background-color: #ffffffee;
    padding: 20px 40px;
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0,0,0,0.05);
    max-width: 720px;
    margin: 0 auto 30px auto;
    text-align: justify;
}

.check-box input{
    background: #fdfdfd!important;
}

.post-type-archive-works .footer-1{
    margin: 0 calc(50% - 50vw);
	width: 100vw;
}

.wpcf7-spinner{
    display: none;
}

.btn_submit{
    text-align: center;
    margin-top: 2em;
    margin-bottom: 1em;
}

.caution{
    font-size: 10px;
    padding: 1px 3px;
    border-radius: 2px;
    display: inline-block;
    margin-right: 12px;
    background: #c7c7c7;
    color: #f4f4f4;
}

.wpcf7 th{
    display: inline-block;
    width: 30%;
}

.wpcf7 td{
    display: inline-block;
    width: 60%;
}

.wpcf7 table{
    width: 100%;
    padding-top: 32px;
}

.wpcf7 tbody{
    display: block;
    width: 100%;
}

.wpcf7 tr{
    display: block;
    padding-bottom: 8px;
    border-bottom: 1px solid #ededed;
    margin-bottom: 12px;
    width: 100%;
}

.top-title-white{
    padding-top: 2em!important;
    color: #fff!important;
}

.top-subtitle-white span{
    color: #fff!important;
}

.top-subtitle-white{
    margin-bottom: 0!important;
}

.privacy-check-wrap{
    margin-top: 1em;
}

.caution-red{
    background: #E33146;
    font-size: 10px;
    color: #f4f4f4;
    padding: 1px 3px;
    border-radius: 2px;
    display: inline-block;
    margin-right: 12px;
}
.red{
    color: #E33146;
    display: inline-block;
    padding-bottom: 2px;
    text-decoration: underline;
}

.privacy-check{
    text-align: center;
    font-size: 12px;
}

/* Custom Checkbox Styling */
input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fffefd;
    margin-right: 10px;
    font: inherit;
    color: currentColor;
    width: 20px;
    height: 20px;
    border: 1px solid #c8bbb2;
    border-radius: 4px;
    transform: translateY(-0.075em);
    place-content: center;
}

input[type="checkbox"], input[type="radio"]{
    vertical-align: middle;
}

/* Checkmark Style */
input[type="checkbox"]:checked::before {
    content: "";
    width: 21px;
    height: 21px;
    clip-path: polygon(14% 44%, 34% 64%, 72% 27%, 66% 20%, 34% 52%, 20% 39%, 14% 44%);
    background-color: #88c0d0; /* Muted blue color */
    display: block;
}

/* Label Style When Checkbox is Checked */
input[type="checkbox"]:checked + label {
    color: #88c0d0; /* Muted blue color */
}

/* Label Styling */
label {
    color: #333; /* Default label color */
    /* Other label styles here */
}



/* テーブルスタイリング */
table {
    width: 100%;
    border-collapse: collapse;
    display: flex;
}

th{
    width: 30%;
}

.page-id-43 td{
    width: 70%;
    padding: 30px 10px 10px 10px;
    vertical-align: top;
}

.page-id-43 td:first-child{
    padding-top: 0!important;
}

.page-id-43 tr {
    vertical-align: middle;
    border-bottom: 2px solid #e4e0dd24;
    display: flex;
    align-items: center;
}


/* ラベルスタイリング */
label {
    display: block;
    margin-bottom: 5px;
    font-weight: normal;
}

/* 入力フィールドスタイリング */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea {
    width: 100%;
    padding: 10px;
    margin-bottom: 20px;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-sizing: border-box; /* ボックスのサイズを固定 */
}

/* チェックボックスとラジオボタンのスタイリング */
input[type="checkbox"],
input[type="radio"] {
    margin-right: 10px;
}

/* フォーカス時のスタイリング */
input:focus,
textarea:focus {
    border-color: #373636;
    outline: none;
}

/* 送信ボタンスタイリング */
input[type="submit"] {
    background-color: #756a61;
    color: white;
    padding: 16px ;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    width: 39%;
    transition: .5s all cubic-bezier(.2, 1.17, .4, 1.2);
}

input[type="submit"]:hover {
    background-color: #797777;
}

/* 戻るボタンスタイリング */
input[type="button"] {
    background-color: #BBB;
    color: white;
    padding: 16px 0;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    width:39%;
    display: inline-block;
    margin-right: 20px;
    transition: .5s all cubic-bezier(.2, 1.17, .4, 1.2);
}

input[type="button"]:hover {
    transform: scale(1.05, 1.05);
    filter: brightness(1.03);
  }

input[type="submit"]:hover {
    transform: scale(1.05, 1.05);
    background-color: #797777;
}

.btn_submit p{
    display: flex;
    justify-content: center;
}


/* レスポンシブデザイン */
@media (max-width: 600px) {
    td {
        display: block;
        width: 100%;
    }
}







.page-id-9 .contents-1{
width: 90%!important;
}

#wrapper {
    max-width: 100%;
    background: rgb(255, 255, 255);
    overflow: hidden;
}

.about-copy{
    font-weight: 600;
    font-size: 1.5rem;
    padding-bottom: 20px;
    text-align: justify;
    line-height: 1.9!important;
    letter-spacing: 1px;
}
.contents_sidebar {
    display: block;
}

.widget_categories {
    padding-bottom: 10px;
}

#sidebar li {
    padding-top: 5px;
    line-height: 2;
}

.back-to-top {
    display: none;
    position: fixed;
    right: 1%;
    bottom: 1%;
    color: #fff;
    padding: 2rem;
    border-radius: 50%;
    display: inline-block;
    text-decoration: none;
    font-size: 14px;
}

.back-to-top::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: inline-block;
    width: 65px;
    height: 65px;
    border:2px solid #b2a79e;
    border-radius: 50%;
    z-index: -1;
}

.fa-chevron-up{
    color: #887c72;
}

summary {
    list-style: none;
    position: relative;
    padding: 10px 70px 10px 30px;
    cursor: pointer;
    background-color: white;
    border-radius: 25px;
}

@media not all and (min-width: 768px) {
    summary {
        padding: 10px 35px 10px 20px;
        margin: 0 10px;
    }
}

summary::-webkit-details-marker {
    display: none;
}

summary:hover,
details[open] summary {
    border: 1px solid;
}

summary::after {
    content: '+';
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    transition: transform 0.5s;
    font-size: 30px;
}

details[open] summary::after {
    transform: translateY(-50%) rotate(45deg);
}

.answer {
    padding: 20px 30px;
    background: #00000070;
    border-radius: 25px;
    margin-top: 5px;
}

@media not all and (min-width: 768px) {
    summary::after {
        right: 20px;
        font-size: 20px;
    }

    .answer {
        padding: 10px 20px;
    }
}

details[open] .answer {
    animation: fadein 0.5s ease;
}

@keyframes fadein {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

h1,h2,h3,h4,ul,li,.logo{
    font-family: "MFW-TBGoStd-DemiBold","Montserrat",'Noto Sans JP', sans-serif;
    margin: 0;
}

p,a,div,th,td,tr {
    margin-bottom: 0px;
    font-family: "MFW-TBGoStd-Medium",'Noto Sans JP', sans-serif;
}

.top-nav-title,.top-nav-title-sp p,.top-nav-title-sp a,.fd-footer-right a{
    font-family: "Montserrat",'Noto Sans JP', sans-serif!important;
    font-weight: 600;
}

.txt-white {
    color: #fff;
}


details {
    margin-bottom: 10px;
    margin-right: auto;
    margin-left: auto;
    width: 665px;
}

@media not all and (min-width: 640px) {
    details {
        width: 100%;
    }
}

details:first-of-type {
    margin-top: 30px;
}

.contents {
    margin: 0 auto 35px;
    width: 100%;
    max-width: 1180px;
}

.block {
    margin: 0px auto;
    text-align: center;
    padding-bottom: 80px;
    padding-top: 80px;
}

.block-title {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2.5rem;
    font-family: "Montserrat",'Noto Sans JP', sans-serif;
    font-weight: 700!important;
    text-align: center;
    padding-top: 15px;
    font-weight: 700!important;
    line-height: 1.25!important;
}


.block-title2 {
    height: auto;
    margin: 0;
    line-height: 1.5;
    text-align: center;
    font-size: 1.25rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.point-number {
    font-size: 13px;
    display: block;
    text-align: center;
    width: 100%;
    color: #AA9E96;
}

.block-txtbox {
    text-align: justify;
}

.sub-txt {
    text-align: center;
    color: #fff;
    padding-bottom: 30px;
}

.block-sub-title {
    font: normal bold 18px;
    margin-top: 4px;
    margin-bottom: 55px;
    font-weight: 700!important;
}


.inblock-wrap {
    max-width: 1080px;
    margin: 50px auto 80px auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.inblock {
    background: rgba(255, 255, 255, 0.7);
    padding: 20px 30px 40px 30px;
    border-radius: 50px 10px 10px 10px;
    width: 25%;
    box-shadow: 0 0 20px rgb(0 0 0 / 5%);
}

.inblock:not(:last-child) {
    margin-right: 13px;
}

.fa-arrow-right{
    color: #AA9E96;
}

.block-txtbox {
    padding-top: 25px;
}

.point-number strong {
    font-size: 2.25rem;
    margin-bottom: 18px;
    display: inline-block;
    position: relative;
}

.point-number strong::before {
    content: "";
    position: absolute;
    display: inline-block;
    bottom: 0;
    width: 30px;
    height: 2px;
    background-color: #d1c3b9;
    left: calc(50% - 15px)
}

a {
    color: #756a61;
    text-decoration: none;
}

.green {
    color: #ABAFA3;
}

/* .far {
    font-family: 'Font Awesome 5 Free';
}
 */
.li {
    list-style: none;
}

body {
    padding: 0;
    margin: 0;
    letter-spacing: 1.75px;
    scroll-behavior: smooth;
    font-size: 1rem;
    background: #FEFDFC;
}

.container {
    max-width: 1280px;
    margin: 0 auto;
    width: 95%;
}

p,
th,
td,
li {
    letter-spacing: 1.45px;
    font-size: 15px;
    line-height: 1.75;
    list-style: none;
}
.thmbnail{
    padding: 35px 0;
}

time{
    font-size: 12px;
}
h2:not(.headline-left, .block-title, .about-title, .headline-right,.about-copy) {
    font-weight: 300;
    font-size: 14px;
}

.headline-left,.list-nav-other,#menu-item-58 a,.logo{
    font-family: "Montserrat",'Noto Sans JP', sans-serif!important;
}

.headline-right {
    color: #AA9E96;
}

h3:not(.block-title2, .contents-title) {
    text-align: justify;
}

h4 {
    font-weight: 200;
    font-size: 1.2rem;
    text-align: center;
}

h2,
h3,
h4 {
    color: #756a61;
    font-weight: 600;
}

small {
    font-size: 0.95em;
}

.top-nav-title-small{
    font-size: 16px!important;
    letter-spacing: 0.08em!important;
}

.flex {
    display: flex;
}

.w-70 {
    width: 70%;
}

.w-60 {
    width: 60%;
}

.w-50 {
    width: 50%;
}

.w-40 {
    width: 40%;
}

.w-30 {
    width: 30%;
}

.top-bg-sp {
    display: none;
}

.flower-title {
    text-align: center;
}

.left {
    text-align: justify;
    list-style: none;
}

.sp-left {
    text-align: center;
}

.padding-none {
    padding: 0;
}

.pc-none {
    display: none;
}

.pc-none-inline {
    display: none !important;
}

.marker-pink {
    background: linear-gradient(transparent 65%, #AA9E96 65%);
    font-weight: bold;
    padding: 0 10px;
}

/*カスタムフールドのCSS*/

.parent-ttl {
    border-radius: 50%;
    background: rgb(33, 178, 155);
    padding: 3px 7px;
    top: 0;
    right: 0;
}

.parent-ttl02 {
    top: auto;
    right: auto;
    left: 15%;
    bottom: 7%;
}

.tag-btn {
    padding: 3px 7px;
    font-size: 14px;
}

.type-list{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 0;
}

.type-list li a{
    display: block;
    padding: 6px 1.5em;
    margin: 5px;
    color: #AA9E96;
    border-color: #AA9E96;
    border-style: solid;
    border-width: 1px;
    border-radius: 25px;
    text-decoration: none;
    background-color: #fff;
    font-weight: normal;
    font-size: 14px;
    transition: .5s all cubic-bezier(.2, 1.17, .4, 1.2);
}

.type-list li a:hover{
    transform: scale(1.05, 1.05);
    filter: brightness(1.03);
    box-shadow: 0 0 20px #0000000f;
}
.type-section{
    margin-top: 30px;
}

.type-section h3{
    color: #AA9E96;
    border-bottom: 1px solid #AA9E96;
    margin-bottom: 45px;
    padding-bottom: 10px;
}

.single_works_container img {
    max-width: 100%;
    height: auto;
}

.con {
    font-size: 14px;
}

.thumb {
    max-width: 100%;
    text-align: center;
}

.content-works-btn .text{
    font-size: 14px;
    line-height: 1;
    color: #fff!important;
}

.btn_link{
    padding: 8px 24px;
}

/* メイン画像 */
.main-image img {
    width: 100%;
    max-width: 600px;
    cursor: pointer;
    margin-bottom: 20px;
}

/* サムネイル画像 */
.thumbnail-list {
    display: flex;
    justify-content: center;
    gap: 20px;
}
.thumbnail {
    width: 100px;
    height: auto;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.thumbnail:hover {
    transform: scale(1.1);
}

/* モーダル */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 10%;
    top: 10%;
    width: 80%;
    height: 80%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5); /* 透明度を0.9から0.5に変更 */
    opacity: 0; /* 初期状態で透明 */
    transition: opacity 0.5s ease; /* 表示の速度を0.5秒に設定 */
}

.modal.show {
  display: flex;
  align-items: flex-start; /* ← 上寄せ */
  justify-content: center;
  height: 80vh; /* 縦方向の中央基準を明示 */
  padding-top: calc(35vh - 100px); /* 上から中央に配置したい高さの調整 */
  overflow-y: auto;
  top:0;
    opacity: 1; /* モーダル表示時に完全に不透明に */
}


/* モーダル内の画像 */
.modal-content {
    display: block;
    margin: auto;
    max-width: 90%;
    max-height: 90%;
}

/* 閉じるボタン */
.close {
    position: absolute;
    top: 20px;
    right: 35px;
    color: white;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}





.works_sub_txt{
    font-size: .85rem;
}

/*ふきだしのCSS*/
.balloon {
    position: relative;
    display: inline-block;
    border-bottom: solid 2px #cecece;
    padding: 16px;
    min-width: 240px;
    max-width: 100%;
    text-align: center;
    padding-bottom: 50px;
    margin-bottom: 20px;
}

.balloon:before,
.balloon:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.balloon:before {
    border: solid 12px transparent;
    border-top: solid 12px #cecece;
}

.balloon:after {
    border: solid 14px transparent;
    border-top: solid 14px #fff;
    margin-top: -5px;
}

.balloon p {
    margin: 0;
    padding: 0;
}

/* aboutページ */
.contents-1 tbody {
    padding: 24px;
    display: inline-block;
}

.profile-img {
    width: 100%;
    height: 330px;
    object-fit: cover;
    border-radius: 6px;
    box-shadow: 0 0 20px rgb(0 0 0 / 5%);
}

.profile-p-img{
    width: 100%;
}

.profile-p p {
    margin-bottom: 15px;
}

.profile-p ul {
    text-align: justify;
}

.profile-p {
    width: 90%;
    margin: 0 auto;
    padding-top: 75px;
}

.profile-p .btn_link {
    margin-bottom: 15px;
    margin-top: 15px;
    transition: .5s ease-in;
}

.profile-p-wrap {
    display: flex;
    flex-wrap: wrap-reverse;
    padding:0 0 50px 0;
    justify-content: space-around;
    box-shadow: 0 0 20px rgb(0 0 0 / 5%);
    margin-top: 30px;
}

.profile-ttl {
    text-align: justify;
    font-size: 16px;
    margin-top: 50px;
    margin-bottom: 15px;
    border-bottom: 1.5px dashed #d1ccc5;
    padding-bottom: 12px;
}


/*吹き出しのCSS終わり*/
/*about背景*/
.background-wave {
    background: url(/wp-content/uploads/2021/07/bg-wave-1.png)no-repeat center bottom;
    height: 1000px;
    margin: 0 -200%;
    padding: 0 200%;
    text-align: center;
}

/*chacol背景*/
.chacol {
    background: url(/wp-content/uploads/2021/07/chacol-bg-1.png)no-repeat center center;
    height: 428px;
    max-width: 100%;
    margin: 0 -200%;
    padding: 0 200%;
    text-align: center;
}

/*FAQ背景*/
.background-FAQ {
    background: url(/wp-content/uploads/2022/07/FQA-bg02.png)no-repeat center center;
    height: 500px;
    max-width: 100%;
    margin: 0 -200%;
    padding: 0 200%;
    text-align: center;
    position: relative;
    z-index: 0;
}

.background-FAQ:before {
    content: '';
    position: absolute;
    /* 輪郭がぼやけてしまうのでブラー範囲を広げる */
    top: -5px;
    bottom: -5px;
    left: -5px;
    right: -5px;
    background: inherit;
    filter: brightness(.5);
    z-index: -1;
}

.background-FAQ h2,
.background-FAQ h4,
.background-FAQ p {
    color: white;
}

.background-FAQ p {
    text-align: justify;
    margin-top: 0;
}

/*flow背景*/
.background-flow {
    height: auto;
    max-width: 100%;
    margin: 0 -200%;
    padding: 0 200%;
    text-align: center;
}

.home-work-wrap {
    display: inline-block;
    text-align: left;
    position: relative;
}

.home-work-wrap .type{
position: absolute;
top: 0;
right: 3%;
}

.news_list li{
    padding: 20px 10px;
    margin-bottom: 15px;
}


.works_list {
    width: 1080px;
    max-width: 90%;
    margin: 50px auto;
}

.home .news_list {
    margin-top: 50px;
    width: 90%;
    margin: 50px auto 0 auto;
}

.archive .news_list ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.archive .news_list ul::after{
    content:"";
    display: block;
    width:30%;
    margin: 15px 0;
    padding-right: 10px;
    padding-left: 10px;
  }

.archive .news_list li {
    width: 30%;
    margin: 0;
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: 30px;
}

.txt {
    width: 80%;
    margin-top: 75px;
}

.single_works_container {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    margin: 100px 0;
}

.head {
    text-align: center;
    font-size: 1.5em;
    font-weight: 200;
    margin: 2em 0;
}

.postid-637 .no_btn,
.postid-759 .no_btn {
    display: none;
}

.type {
    font-size: 0.75em;
    text-align: left;
    background: #AA9E96;
    color: #fff;
    display: inline-block;
    padding: 2px 12px;
    border-radius: 3px;
    margin-top: 12px;
    margin-bottom: 12px;
}

.client {
    font-size: 14px;
    padding: 8px 3px;
    text-align: justify;
    line-height: 1.5!important;
}

.info .client {
    font-size: 18px;
    padding-left: 0px;
}

.insta-icon .fa-instagram {
    color: #756a61;
    padding-right: 5px;
    font-size: 25px;
    font-weight: 600;
}

/*ボタン*/
.btn {
    margin: 60px auto 30px auto;
}

a.btn_06 {
    display: inline-block;
    background: rgb(255 255 255 / 83%);
    padding: 20px 24px;
    border-radius: 35px;
    box-shadow: 0 0 10px rgb(77 77 77 / 5%);
    transition: .5s all cubic-bezier(.2, 1.17, .4, 1.2);
    width: 100%;
    max-width: 280px;
}

a.btn_06:hover{
    transform: scale(1.05, 1.05);
    filter: brightness(1.03);
}


.btn_link a{
    display: inline-block;
    background: #5E524A;
    border-radius: 25px;
    font-size: 14px;
    padding: 12px 30px;
    margin: 10px auto;
    color: white;
    width: 100%;
    max-width: 230px;
    text-align: center;
}

.btn_link a:hover {
    background: #373636;

}


.work_flow {
    border-top: 1px solid;
    border-bottom: 1px solid;
    padding: 10px 0;
}

.info {
    padding-bottom: 10px;
}

.works_sub_title {
    padding: 30px 0 12px 0;
    text-align: justify;
    font-size: 16px;
    color: #534943;
}
.works_sub_title::before {
        content: '●';
        color: #aa9e96;
        margin-right: 8px;
}

.genre {
display: inline-block;
font-size: 12px;
padding: 0px 8px;
background: #877d77;
margin: 16px 4px 0 4px;
color: #fff;
border-radius: 2px;
}

.btn-stn {
    text-align: center;
}

.content-works-btn {
    margin-top: 20px;
    display: flex;
    justify-content: flex-start;
    gap: 20px;
}

/* インスタ */
#sb_instagram {
    padding-top: 70px;
}

#sb_instagram .sb_instagram_header .sbi_header_img {
    background: #ABAFA3;
}

#sb_instagram #sbi_load {
    display: none;
}

.contents-insta {
    margin: 50px auto;
}

/* ローディング */

/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/

#splash {
    /*fixedで全面に固定*/
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 999;
    background: #F5F4F4;
    text-align: center;
    color: #fff;
}

/* Loading画像中央配置　*/

#splash_logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/

#splash_logo img {
    width: 260px;
}

/* fadeUpをするアイコンの動き */

.fadeUp {
    /* animation-name: fadeUpAnime; */
    animation: float_2979 3s linear infinite;
    transform-origin: 50% 50%;
    animation-duration: .5s;
    animation-fill-mode: forwards;
    /* opacity: 0; */
}

@keyframes float_2979 {
    0% {
        transform: translateY(0)
    }

    33.33333% {
        transform: translateY(-6px)
    }

    66.66667% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(0)
    }
}

.archive .img {
    width: 100%;
    max-width: 400px;
    height: auto;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 5px;
    box-shadow: 0 0 20px #0000000e;
}


.archive .img img {
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .6s ease;
}
.archive .img:hover img{
    transform: scale(1.1); /* 拡大 */
}


/* ヘッダーの上の帯 */

.area-header-top {
    font-weight: 300;
    width: 100%;
    font-size: .75rem;
    letter-spacing: 1.75px;
    line-height: 2;
    text-align: center;
    align-items: center;
    color: #676565;
    margin-top: 0;
    box-shadow: 0px 1px 5px #d8d1d157;
    background-color: #fff;
    background-image: radial-gradient(#f9f8f8 20%, transparent 20%), radial-gradient(#f8f4f4 20%, transparent 20%);
    background-position: 0 0, 20px 20px;
    background-size: 40px 40px;
}

/*ヘッダー*/

.header_other_home .container {
    height: 85px;
    margin: 10px auto;
    display: flex;
    align-items: center;
    max-width: 1180px;
}

/* ヘッダーのエフェクト */

/* エリアロゴへッダー */

.area-logo-header-img .logo {
    font-size: 1.75em;
    display: block;
}

.more-btn-a-sp {
    display: none;
}

.area-logo-header .logo img {
    height: 26px;
    vertical-align: bottom;
}

/* エリアnavヘッダー */

/* ハンバーガーnone */

#menu-btn-check {
    display: none;
}

.menu-btn,
.list-nav-header-sp {
    display: none;
}

.list-nav-header ul {
    display: flex;
    align-items: center;
    text-align: center;
}



.area-nav-header {
    margin-left: auto;
}

.list-nav-header ul {
    list-style: none;
}

.list-nav-header a {
    font-size: 15px;
    color: #756a61;
    line-height: 1.2;
    transition: .5s;
    display: block;
    position: relative;
    margin: 15px 15px 5px 15px;
    padding: 8px 5px;
}
.list-nav-header a:not(.list-nav-header a span) {
font-weight: 600;
}

.list-nav-header li :hover {
    color: #AA9E96;
    transition: 0.24s all ease;
}

.list-nav-header li {
    background-color: transparent;
    /* default value */
}

.list-nav-header a {
    position: relative;
}

.list-nav-header a::before {
    background: #c7c0bb;
    content: '';
    width: 100%;
    height: 1.5px;
    position: absolute;
    left: 0;
    bottom: -2px;
    margin: auto;
    transform-origin: center top;
    transform: scale(0, 1);
    transition: transform .3s;
}

.list-nav-header a:hover::before {
    transform-origin: left top;
    transform: scale(1, 1);
}

.list-nav-header li {
    transition: 0.24s all ease;
    line-height: 0.5em;
}

.current-menu-item a ::after {
    width: 100%;
}

.current-menu-item a {
    color: #AA9E96 !important;
}

.list-nav-header span {
    display: inline-block;
    color: #AA9E96;
    font-size: 11.5px;
    font-weight: 500;
    letter-spacing: 1.95px;
}

.contact-special {
    text-align: center;
}

.list-nav-contact,
.list-nav-other {
    display: inline-block;
    align-items: center;
    position: relative;
}

/* パンクズリスト */
.breadcrumb-wrapper{
    display: inline-block;
    padding: 0 5px;
    text-decoration: none;
    color: #AA9E96;
    transition: .5s all cubic-bezier(.2, 1.17, .4, 1.2);
    font-weight: normal;
    font-size: 12px;
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
}

/* ヘッドライン */

.headline {
    display: flex;
    align-items: center;
    background: none;
    border: none;
    height: 75px;
    box-shadow: 5px 5px 20px #c8c9cc6e, -5px -5px 20px #ffffff;
    padding: 0 30px;
    margin: 30px auto 10px auto;
    border-radius: 3px;
    width: 100%;
    max-width: stretch;
}

.headline h1,.headline p {
    line-height: 37.5px;
    font-weight: 600;
}

.headline h1{
    font-size: 16px;
}
.headline p {
    color: #756a61;
    font-size: 24px;
}

.headline-right {
    margin-left: auto;
}

.point_block{
    background: #f7f4f2;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding-top: 80px;
    padding-bottom: 100px;
}

/* パンくずリスト */

.bread {
    padding-left: 20px;
    font-weight: 200;
}


.home-icon:after {
    font-family: "Font Awesome 5 Free";
    content: '\f0da';
    padding: 0 0.2em;
    color: silver;
    font-weight: bold;
}

.breadcrumb span{
    display: inline-block;
    padding: 0 5px;
    text-decoration: none;
    color: #AA9E96;
    transition: .5s all cubic-bezier(.2, 1.17, .4, 1.2);
    font-weight: normal;
    font-size: 12px;
}
/* パンくずリストEND */

.contents-title {
    text-align: center;
    position: relative;
    margin-bottom: 15px;
    padding-top: 30px;
    padding-bottom: 50px;
    margin-top: 0px;
    font-size: 1.5em;
}

.contents-title::before {
    position: absolute;
    bottom: 15px;
    left: calc(50% - 0.5px);
    width: 1px;
    height: 20px;
    content: "";
    border-radius: 5px;
    background: #756a61;
}

/*コンテンツのタイトル*/
.top-mockup {
    /* border-radius: 50px 10px 10px 10px;
    box-shadow: 0 0 20px #0000000f; */
    width: 100%;
    max-width:800px;
    filter: opacity(0.9);
    height: auto;
    object-fit: cover;
    transition: all 0.95s;
}

/* ページコンテンツのサブタイトル */

.contents-sub-title {
    font-size: 1.5rem;
    padding: 1.5em 0 1em 0;
}

/* 料金コンテンツ */

.contents-price {
    background: #ffff;
    box-shadow: 0 0 4px rgb(0 0 0 / 15%);
    border-radius: 5px;
    padding: 35px 70px 45px 70px;
    margin-bottom: 30px;
}

.contents-price h4 {
    margin-bottom: 24px;
    color: #756a61;
    text-align: initial;
    display: flex;
    align-items: center;
    font-size: 18px;
    line-height: 2;
}

.price-detail {
    justify-content: space-between;
}

.price-detail li {
    position: relative;
    text-align: justify;
}

.price-detail li:before {
    content: "";
    display: block;
    width: 12px;
    height: 22px;
    background: url(/wp-content/uploads/2021/05/reshot-icon-check-ZF7PNAWK8U.svg) no-repeat center center;
    background-size: contain;
    position: absolute;
    top: 0;
    left: -25px;
}

.price-detail ul {
    padding: 0 50px 0 24px;
}

.price-sub-ttl {
    padding-bottom: 16px;
    text-align: justify;
}

.price-others .price-sub-ttl {
    padding-bottom: 0;
}

.price-others h4 {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
}

.price {
    font-size: 24px;
    font-weight: 600;
    color: #AA9E96;
    padding-left: 10px;
}

.price small {
    font-size: x-small;
}

/*お知らせコンテンツ*/

.thmbnail img{
    width: 600px;
height: auto;
max-width: 100%;
}

#categories-3,#recent-posts-3{
    width: 100%;
}
.news-post {
    padding-top: 30px;
    padding-right: 10px;
}

.news-post p{
    padding: 10px 0;
    font-size: 16px;
}

.news-post li{
    font-size: 16px;
}

.news-post h4{
    padding: 1rem 2rem;
    border-left: 5px dotted #000;
    background: #f4f4f4;
    text-align: justify;
    margin-bottom: 30px;
}

.btn06{
    padding: 10px 20px;
    background: #756a61;
    color: #fff;
    border-radius: 3px;
    display: inline-block;
    width: 30%;
    text-align: center;
    margin-top: 10px;
}

.date-wrap {
    align-items: center;
    padding-bottom: 20px;
}

.date-wrap .date {
    padding-right: 20px;
    color: #AA9E96;
}


.contents_news {
    width: 70%;
}

.contents_news h3 {
    padding-bottom: 5px;
    font-size: 1.5rem;
}

.sidebar-title a{
    font-size: 0.83em;
}

.contents_news li {
    list-style: inside;
}

.sidebar-title {
    border-bottom: 1px solid #d4d0cc;
    padding: 5px 10px;
    margin: 1em 0;
}

.grecaptcha-badge{
    display: none;
}

#sidebar {
    display: flex;
    justify-content: space-around;
    margin-top: 100px;
    margin-bottom: 50px;
    box-shadow: 0 0 20px #bdb8b42e;
    border-radius: 5px;
    padding: 20px;
    height: fit-content;
    width: 20%;
    flex-wrap: wrap;
}

#categories-3, #recent-posts-3{
    width: 100%;
}

.contents_sidebar{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.contents_news {
    margin-top: 100px;
    margin-bottom: 70px;
}

.date {
    font-size: .75rem;
}

.news-title {
    padding: 0%;
    margin: 0%;
    font-size: 16px;
}

/* コンテンツブロック */

.contents-block {
    text-align: center;
    margin-bottom: 50px;
    padding: 50px;
    text-align: center;
    position: relative;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
}

.contact-poricy {
    margin-bottom: 50px;
    padding: 50px;
    text-align: center;
}

.contact-poricy .contents-title {
    padding-top: 30px;
    font-weight: 400;
    font-size: 24px;
}

/* コンテンツを中央揃え */

.contents-center {
    text-align: center;
}

/* コンテンツ１ */
.fa-check-square {
    padding-right: 5px;
}


.contents-1 {
    margin-top: 33px;
    width: 60%;
    margin: 0 auto 50px auto;
    box-shadow: 0 0 20px rgb(0 0 0 / 5%);
}

.contents-1 th {
    width: 20%;
    text-align: justify;
}

.contents-1 th,
.contents-1 td {
    border-radius: 3px;
    padding: 15px 20px;
}

.contents-1 td {
    text-align: initial;
}

.color-1 {
    background: rgb(255, 255, 255, 0.6);
}

.color-2 {
    background: #FFFFFF;
}

/* コンテンツ２ */
.sub_title-box {
    margin: 2em 0;
}

.line {
    max-width: 100%;
}

.sub-profile {
    text-align: center;
}

.contents-2-profile {
    padding-top: 0em;
    padding-bottom: 0;
    line-height: 1.5;
    letter-spacing: 1.25px;
}

.sub-message {
    padding-top: 2em;
    padding-bottom: 3em;
}

.contact-top {
    padding-top: 100px;
    padding-bottom: 55px;
    line-height: 1.75!important;
    max-width: 720px;
    text-align: center;
    margin: 0 auto;
}

.highlight{
    font-weight: 700;
    font-size: 1.55rem;
    background: #756a61;
    color: #fff;
    padding: 2px 5px 2px 10px;
    margin-right: 5px;
    border-radius: 2px;
    display: inline-block;
    letter-spacing: 1.45px;
    font-weight: 700;
    line-height: 1.2;
}

.flex-column{
    flex-direction: column;
    margin-left: 0!important;
}

/* フッター１ */

.footer-1 {
    background: #EAE6E1;
    position: relative;
    text-align: center;
    padding-top: 100px;
    padding-bottom: 100px;
  }
  
  /* ノイズ感を重ねる */
  .footer-1::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("https://grainy-gradients.vercel.app/noise.svg");
    opacity: 0.25;
    mix-blend-mode: overlay;
    pointer-events: none;
  }

  .top-subtitle-white{
    text-align: center;
  }

.wave-container{
    position: relative;
  background: #EAE6E1;
  margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.last-message-wrapper{
    display: flex;
    justify-content: space-between;
    padding-top: 2em;
    padding-bottom: 2em;
margin : 0 auto;
max-width: 1080px;
width: 80%;
}

.contact {
    letter-spacing: 1px;
}

/* コンタクトページ */
.last-message p, .last-message ul, .last-message li {
    text-align: center;
    font-size: 16px;
    font-weight: 500;
}

.footer-1{
    text-align: center;
}


.footer-2 {
    text-align: center;
    background: #fff;
    color: #5E524A;
    padding-bottom: 40px;
}


.area-nav-footer {
    padding: 30px 0 40px o;
}

.list-nav-footer ul {
    list-style: none;
    display: flex;
    justify-content: center;
    text-align: center;
    font-size: 0.75em;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0 0 30px 0;
}

.list-nav-footer a {
    padding-bottom: 5px;
    position: relative;
}

.list-nav-footer a::before {
    content: "";
    background: #AA9E96;
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: 0;
    margin: auto;
    transform-origin: center top;
    transform: scale(0, 1);
    transition: transform .3s;
}

.list-nav-footer a:hover {
    color: #AA9E96;
}

.list-nav-footer a:hover::before {
    transform-origin: left top;
    transform: scale(1, 1);
}


.list-nav-footer a {
    color: #5E524A;
    letter-spacing: 2px;
    font-size: .85rem;
    display: inline-block;
    margin: 14px 1.4em;
}

.list-nav-footer>li+li {
    margin-left: 30px;
}

.list-nav-footer li+li {
    border-left: 1px solid white;
}

.sns-icon {
    display: flex;
    justify-content: center;
}

.sns-icon img {
    width: 25px;
    height: 25px;
    margin-bottom: 0;
    margin-top: 30px;
}

.insta {
    margin-left: 60px;
}

.footer-2 small {
    padding: 20px;
    letter-spacing: 1px;
}

.footer-illust-area {
    max-width: 1366px;
    position: relative;
    height: 200px;
    margin: 0 auto;
}

.footer-illust {
    width: 100%;
    height: 200px;
    position: absolute;
    bottom: 0;
}

.footer-illust-sp {
    display: none;
}




.cta-btn-wrap {
    text-align: center;
    width: 100%;
    margin: 0 auto;
    padding-top: 30px;
    padding-bottom: 6em;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
}

.cta-btn {
    display: block;
    width: 100%;
    max-width: 250px;
    background-color: #f7f7f7;
    color: #5e524a;
    letter-spacing: 2px;
    font-size: 16px;
    padding: 18px 30px 18px 50px;
    border-radius: 35px;
    overflow: hidden;
    position: relative;
    z-index: 1;
    transition: .5s ease-in-out;
    border-radius: 35px;
    box-shadow: 0 2px 4px rgba(70,67,67,.2);
}

.line-btn {
    background-color: #4caf50;
    color: #fff;
}
.line-btn .fa-arrow-right{
    color: #fff;
}

.cta-btn:hover {
    background: #ffffffc5;
    box-shadow: 0 6px 15px rgba(0, 0, 0, .161);
    transform: translateY(-2px);
}

.line-btn:hover {
    background-color: #45a049;
}

.service-detail{
    background:#756a61;
}

.service-detail02{
    background: #f7f4f2;
    background-image: radial-gradient(#f9f8f8 20%, transparent 20%), radial-gradient(#f8f4f4 20%, transparent 20%);
    background-position: 0 0, 10px 10px;
    background-size: 10px 10px;
}


/* .textlink02 a:hover::after {
    width: 100%;
}

.mail-address {
    padding: 3em 0;
    margin-bottom: 1em;
    font-size: 1.25em;
}

.mail-address strong {
    display: inline-block;
    position: relative;
}

.mail-address strong:before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 5px;
    left: -40px;
    background: url(/wp-content/uploads/2021/06/メールのアイコンその9.svg) no-repeat center center;
    background-size: contain;
    width: 30px;
    height: 30px;
} */

.fa-twitter,
.fa-instagram {
    font-size: 25px;
}

.fa-twitter {
    padding-right: 12px;
}

.fa-wrap {
    justify-content: center;
    padding-top: 30px;
    padding-left: 0;
}

.fa-envelope {
    display: inline-block;
    position: absolute;
    left: -20px;
    top: 5px;
}

.sub-comment {
    text-align: right;
}

/* サービス-page */

.service {
    flex-wrap: wrap;
    justify-content: space-between;
}

.service-period {
    background: #AA9E96;
    padding: 2px 8px;
    margin-left: 8px;
    border-radius: 2px;
    color: #fff;
    font-weight: 400;
    font-size: 12px;
    display: inline-block;
}

.work_span{
    font-size: 12px;
    color: #878787;
}

/*コンタクトページ*/
.contents-3 {
    padding: 10px;
    margin: 10px;
}

.border-frame {
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.832);
    width: 90%;
    margin: 0 auto;
    padding-bottom: 2em;
}

.service-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    background: white;
    padding: 40px 30px 30px 30px;
}

.another-icon-sp {
    display: none;
}

.sub-title {
    margin-top: 30px;
    margin-bottom: 30px;
}

.sub-text {
    margin: 0 auto;
    padding-bottom: 3em;
    letter-spacing: 2px;
}

.service-list {
    padding: 40px 30px 30px 30px;
    max-width: 1080px;
    margin: 0 auto;
}

.service-box {
    margin: 1.5em 0;
    padding: 10px 0;
    display: block;
    text-align: justify;
    width: 24% !important;
    height: 150px;
    border-right: rgb(0 0 0 / 5%) 2px solid;
    display: flex;
    justify-content: center;
    align-items: center;
}

.service-box:first-of-type,
.service-box:nth-child(5) {
    border-left: 2px solid rgb(0 0 0 / 5%);
}

.service-box li {
    list-style: none;
    display: inline-block;
    width: 100%;
    font-weight: 100;
}

.select {
    color: #635659;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    margin-top: 25px;
    height: 250px;
}

.select .flex{
    justify-content: center;
    align-items: center;
}

.select-inner {
    display: inline-block;
    width: auto;
    padding-top: 100px;
    padding-bottom:100px;
    font-size: 24px;
    line-height: 1.5;
    font-weight: 600;
    padding-left: 20px;
}

.service-detail .select-inner {
    width: auto;
    padding-left: 20px;
}

.select-inner small {
    color: #bfb5b5;
}

.select-inner01 {
    color: #f7f4f2;
}

.pc-hover {
    font-size: 0.75em;
}

.service-title {
    font-size: 1.05em;
}

.serivce-icon {
    height: 120px;
}

.service-block {
    position: relative;
    padding-bottom: 0;
}

.chacol {
    position: relative;
}

.service-block:before,
.chacol:before {
    content: "";
    z-index: -1;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #f5f5f5;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

.service-box-main {
    text-align: center;
    padding: 0;
}

.service-box-mask {
    min-height: 100% !important;
    height: 175px !important;
    width: 95% !important;
    left: -15px !important;
    top: -15px !important;
}

.service-box-mask {
    text-align: center;
}

.pc-hover {
    transition: 1.5s ease-in-out;
}

.logo-fuwafuwa {
    animation: fuwafuwa 3s infinite ease-in-out .8s alternate;
    display: inline-block;
    transition: 1.5s ease-in-out;
    width: 170px;
    height: 170px;
    margin-top: 15px;
}

@keyframes fuwafuwa {
    0% {
        transform: translate(0, 0) rotate(-7deg);
    }

    50% {
        transform: translate(0, -7px) rotate(0deg);
    }

    100% {
        transform: translate(0, 0) rotate(7deg);
    }
}

}

.icon-left .service-list {
    width: 55%;
    margin-left: 20px;
}

.icon-right .service-list {
    width: 40%;
    margin-left: 20px;
}

.service-list li {
    font-size: 0.75em;
    list-style: none;
    text-align: justify;
    padding-left: 20px;
    line-height: 3;
    background: url(img/ico/check-pink.svg) left 0px top 3px no-repeat;
    background-size: 15px auto;
}

.apeal-point {
    display: flex;
    justify-content: flex-end;
}

.apeal-point-btn {
    font-size: 0.5em;
}

.apeal-point-btn {
    text-decoration: none;
    color: #756a61;
    display: inline-block;
    padding-right: 16px;
    position: relative;
}

.apeal-point-btn:before,
.apeal-point-btn:after {
    content: "";
    display: block;
    -webkit-transform: skewX(45deg);
    transform: skewX(45deg);
    position: absolute;
    right: 0;
    bottom: 6px;
}

.apeal-point-btn:before {
    width: 12px;
    height: 3px;
    background: #756a61;
}

.apeal-point-btn:after {
    width: 4px;
    height: 8px;
    background: #756a61;
}

.apeal-point-btn:hover {
    color: rgb(255, 255, 255, 0.6);
}

.apeal-point-btn:hover::before {
    background: rgb(255, 255, 255, 0.6);
    transition: 1s;
}

.apeal-point-btn:hover::after {
    background: rgb(255, 255, 255, 0.6);
    transition: 1s;
}

.step {
    display: flex;
    justify-content: space-evenly;
    gap: 24px;
    flex-wrap: wrap;
    margin-top: 75px;
}

.number {
    font-weight: bold;
    width: 50%;
    margin: 0px auto;
    font-size: 1rem;
    background-color: #AA9E96;
    color: #fff;
    padding: 10px;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.step-box {
    position: relative;
    text-align: center;
    width: 15%;
}
.number-1 {
    margin-top: 0%;
    font-size: 1.5rem;
    font-weight: 900;
    color: #fff;
    text-align: center;
    line-height: 1.5;
    font-family: "Montserrat",'Noto Sans JP', sans-serif,;
}

.number-2{
    display: none;
    font-size: 24px;
    font-weight: 900;
    color: #fff;
    background: #AA9E96;
    border-radius: 50%;
    font-family: "Montserrat",'Noto Sans JP', sans-serif,;
}

.step-text {
    box-shadow: 0 0 12px rgba(61, 53, 53, 0.1);
    padding: 50px 24px 0px 24px;
    width: auto;
    height: 80px;
    letter-spacing: 3px;
    margin: 0;
    border-radius: 2px;
    font-size: 18px;
    color: #756a61;
    margin-top: -35px;
    text-align: center;
}

/* トップページ */

/* トップ左画像側 */

.top-area {
    align-items: flex-start;
    gap: 35px;
}

.top-left {
    animation: fadein 3s forwards;
    width: 70%;
}

.f-mv {
    flex-wrap: wrap;
    justify-content: space-between;
}

.fa-arrow-right{
    padding-left: 15px;
}

.title-img {
    width: 100%;
    height: 100vh;
    object-fit: contain;
    padding-left: 10%;
}

.title-img-sp {
    display: none;
}

.about-text{
    padding-left: 40px;
}

.frame {
    margin: 0;
}

.frame2{
    position: absolute;
    bottom: -120px;
    right: -24px;
    filter: none!important;
}

.frame2 img{
    width: 230px;
    height: auto;
}

.frame3{
    position: absolute;
    top: 45%;
    right: -10px;
    width: 250px;
    height: auto;
    opacity: 0.5;
}

.copy-txt-wrap {
    padding-top: 25px;
    color: #756a61;
    width: 100%;
}

.block-txtbox,.block-title2{
    color: #756a61;
}

.copy-txt {
    padding-bottom: 20px;
    line-height: 2!important;
}

body {
    margin: 0;
}

.title-logo {
    position: absolute;
    right: 10px;
    top: 30%;
    max-width: 100%;
}

/* トップ右側 */

.top-right {
    padding-top: 100px;
}

.pink-bg {
    background-color: rgb(197, 194, 187, 0.2);
    width: 1223px;
    height: 300px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
}

.top-list-nav-header ul {
    padding-left: 0;
    border-top: 1px solid #ABAFA3;
    padding-top: 24px;
    padding-left: 24px;
}

.top-list-nav-header li {
    list-style: none;
    padding-top: 3px;
    position: relative;
    padding-bottom: 8px;
}

.top-list-nav-header li::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0da"; /* ▶ */
    position: absolute;
    top: 20%;
    left: -20px; /* 初期位置 */
    font-size: 17px;
    color: #AA9E96;
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform: translateX(0);
    opacity: 0.6;
    }
    
    /* ホバー時：右に5pxスライド＋ふわっと濃く */
    .top-list-nav-header li:hover::before {
    transform: translateX(5px);
    opacity: 1;
    }
    
    /* テキストカラーも変化させたい場合 */
    .top-list-nav-header a:hover {
    color: #AA9E96;
    transition: color 0.3s ease;
    }
    

.top-list-nav-header a {
    color: #756a61;
    font-size: 1.25rem;
    letter-spacing: 2px;
    line-height: 1.75em;
    font-weight: 600;
}

.header-home-nav {
    display: inline-block;
    font-family: "Montserrat",'Noto Sans JP', sans-serif;
    align-items: center;
    font-size: 16px;
}

.header-home-nav small {
    color: #AA9E96;
    display: inline-block;
    letter-spacing: 1.85px;
    padding-left: 12px;
    font-size: 12px;
}

.top-list-nav-header a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    transition: width 0.3s;
    background-color: #AA9E96;
}

.top-list-nav-header a:hover {
    color: #AA9E96;
    width: 100%;
}

.green {
    display: inline-block;
}


.top-nav-title {
    font-size: 3em;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 4.75px;
    margin-bottom: 50px;
    margin-top: 12px;
    text-align: justify;
    display: inline-block;
}

.top-nav-title-sp {
    font-size: 1.75em;
    display: none;
}

.scroll-downs {
    right: 0;
    bottom: 5%;
    left: 0;
    position: absolute;
}

.field {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 300px;
    margin: 0 auto;
}

.slide-items{
    max-width: 1080px;
    width: 100%;
    margin: 0 auto;
}

.slick-slide{
width: 33%;
}
.slick-slide img {
    max-width: 100%;
    height: px;
    object-fit: cover;
    border-radius: 5px;
    box-shadow: 0 0 20px #0000000e;
}

.slick01 {
    width: 100%;
}

.slick-next {
    display: none;
}

.slick-dots li {
    margin: 0 4px !important;
    width: 30px !important;
    height: 3px !important;
}

.slick-dots li button:before {
    content: '' !important;
    width: 30px !important;
    height: 3px !important;
    background: #E0E0E0;
    opacity: 1 !important;
    border-radius: 3px;
}

.slick-dots li.slick-active button:before {
    background: #82898F;
}


.mouse {
    width: 25px;
    height: 50px;
    border: 1px solid #333;
    border-radius: 60px;
    position: relative;
}

.mouse:before {
    content: '';
    width: 5px;
    height: 5px;
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #333;
    border-radius: 50%;
    opacity: 1;
    animation: wheel 2s infinite;
    -webkit-animation: wheel 2s infinite;
}

@keyframes wheel {
    to {
        opacity: 0;
        top: 40px;
    }
}

@-webkit-keyframes wheel {
    to {
        opacity: 0;
        top: 40px;
    }
}


.sub-profile {
    margin: 0 auto;
    width: 90%;
    padding-bottom: 60px;
    padding-top: 30px;
}

.sub-profile1{
    font-size: 16px!important;
    padding-bottom: 0;
}

.about-title {
    font: normal 150%;
    font-size: 2.5rem;
    text-align: justify;
}

.about-text p {
    text-align: justify;
}

.about-text h3 {
    font-size: 1.35em;
}

.scroll {
    display: inline-block;
    padding-top: 70px;
    margin-left: 5%;
    position: relative;
}

.scroll::before {
    animation: scroll 3.5s infinite;
    border: solid #000;
    border-width: 0 0 1px 1px;
    content: "";
    display: inline-block;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    transform: rotate(-45deg);
    width: 20px;
    height: 20px;
}

.txt {
    color: #5E524A;
}

@keyframes scroll {
    0% {
        transform: rotate(-45deg) translate(0, 0);
    }

    80% {
        transform: rotate(-45deg) translate(-30px, 30px);
    }

    0%,
    80%,
    100% {
        opacity: 0;
    }

    40% {
        opacity: 1;
    }
}

.area_intro {
    text-align: center;
}

.message {
    padding: 5px;
    padding-bottom: 4em;
}

.top-message {
    padding-top: 40px;
    text-align: center;
}

.message-frame {
    opacity: 0.15;
}

.service-lady {
    display: inline-block;
    position: absolute;
    right: 15%;
    top: 15%;
}

.service-lady-left {
    display: inline-block;
}

.flex-box {
    display: flex;
    justify-content: center;
    height: 500px;
    padding-top: 70px;
}

.parts-title {
    font: normal bold 25px/100%;
    color: #ABAFA3;
    position: relative;
}

.grey {
    color: #AA9E96;
}

.parts-title::before {
    position: absolute;
    bottom: -15px;
    left: calc(60% - 60px);
    width: 50px;
    height: 2px;
    content: "";
    border-radius: 1px;
    background: #ABAFA3;
}

.parts-img {
    display: inline-block;
    width: 80%;
    height: 100px;
    padding-top: 20px;
}

.parts-box {
    display: block;
    width: 30%;
    background: rgb(245, 244, 244, 0.95);
    border-radius: 3px;
    text-align: center;
    transition: 0.2s;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
}

.parts-box:hover {
    background-color: rgb(245, 244, 244, 1);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    padding-top: 10px;
    padding-bottom: 10px;
}

.parts-box+.parts-box {
    margin-left: 30px;
}

.parts-text {
    width: 90%;
    height: 70px;
    margin: 0 auto;
    padding-top: 12px;
    padding-bottom: 30px;
}

.more-btn-2 {
    font-size: 20px;
    font-weight: 100;
    display: inline-block;
    padding: 10px 20px 20px 0;
    color: #756a61;
    padding-right: 16px;
    position: relative;
}

.more-btn-2:before,
.more-btn-2:after {
    content: "";
    display: block;
    -webkit-transform: skewX(45deg);
    transform: skewX(45deg);
    position: absolute;
    right: -7px;
    bottom: 16px;
    transition: all 0.5s ease;
}

.more-btn-2:before {
    width: 55px;
    height: 2px;
    background: #756a61;
}

.more-btn-2:after {
    width: 3px;
    height: 8px;
    background: #756a61;
}

.more-btn-2:hover::before,
.more-btn-2:hover::after {
    right: -23px;
}

.list-img {
    padding: 0 5px 0 5px;
}

/* フッターのSNS */

.fd-sns{
    margin-top:12px;
    display:flex;
    gap:14px;
  }
  
  .fd-sns a{
    font-size:20px;
    color:#555;
    transition:0.3s;
  }
  
  .fd-sns a:hover{
    color:#000;
  }


/* サイドバー */
.sidebar-wrapper ul {
    padding-left: 10px;
}


.content h1 {
    text-align: center;
    font-size: 40px;
    padding: 0;
    margin: 0 0 20px 0;
    position: relative;
    color: #8C8C8C;
}

/** have a nice ampersand **/

/* Here comes to good stuff : content styling */

.content:after {
    background: #F9F9F9;
    margin: 10px;
    position: absolute;
    content: " ";
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    z-index: -1;
    /*border-radius*/
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

input:required,
textarea:required {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
}

.mwform-tel-field input[type="text"],
.mwform-zip-field input[type="text"] {
    border: 1px solid rgb(235, 235, 235);
    height: 25px;
    font-size: 15px;
    box-shadow: 0 0 20px rgb(0 0 0 / 5%);
}

.mw_wp_form p textarea {
    font-size: 15px;
    width: 100%;
    padding: 8px 12px;
    border-radius: 2px;
    border: 1px solid rgb(235, 235, 235);
}


::-webkit-input-placeholder {
    color: #BABABA;
}

input:-moz-placeholder,
textarea:-moz-placeholder {
    color: #BABABA;
}

textarea {
    min-height: 150px;
    resize: vertical
}

/** labels**/

/** adding our icon font !! */

.iconic:before {
    font-size: 25px;
}

.iconic.link:before {
    content: '/';
}

.iconic.quote-alt:before {
    content: "'";
}

.iconic.comment:before {
    content: "q";
}

.iconic.user:before {
    content: "u";
}

.iconic.mail-alt:before {
    content: "M";
}

label {
    color: #7F7E7E;
    -webkit-transition: color 1s ease;
    -moz-transition: color 1s ease;
    transition: color 1s ease;
}

label:hover,label:active {
    color: #4d4843;
}

label:before {
    color: #C1BFBD;
    -webkit-transition: color 1s ease;
    -moz-transition: color 1s ease;
    transition: color 1s ease;
}

label:hover:before {
    color: #969696;
    -webkit-transition: color 1s ease;
    -moz-transition: color 1s ease;
    transition: color 1s ease;
}

.indication {
    color: #878787;
    font-size: 12px;
    font-style: ;
    text-align: right;
    padding-right: 10px;
}

.required {
    color: #E5224C;
}

/** Styling the send button **/
button[type=submit] {
    background: #493e3e;
    color: #fff;
    cursor: pointer;
    border: none;
    font-size: 1em;
    padding: .75em 7.5em;
    margin-top: 5px;
    /*border-radius*/
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    /*transition*/
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

button[type=submit]:hover {
    color: #2b2b2b;
    border-color: #CECECE;
}

button[type=submit]:active,
button[type=submit]:focus {
    position: relative;
    top: 1px;
    color: #515151;
}

/* タイトルnanimation */
@-webkit-keyframes passing-bar {
    0% {
        left: 0;
        right: auto;
        width: 0;
    }

    50% {
        left: 0;
        right: auto;
        width: 100%;
    }

    51% {
        left: auto;
        right: 0;
        width: 100%;
    }

    100% {
        left: auto;
        right: 0;
        width: 0;
    }
}

@keyframes passing-bar {
    0% {
        left: 0;
        width: 0;
    }

    50% {
        left: 0;
        width: 100%;
    }

    51% {
        left: 0;
        width: 100%;
    }

    100% {
        left: 100%;
        width: 0;
    }
}

@-webkit-keyframes passing-txt {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes passing-txt {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }

}
/* css */
.passing .passing-box {
    display: block;
}

.passing .passing-bar {
    position: relative;
    display: inline-block;
    /*　後ほど解説　*/
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.passing .passing-bar:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    /* 任意の値 */
    background: #000;
}

.passing .passing-txt {
    opacity: 0;
    /* 後ほど解説 */
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    /* 任意の値 */
}

.passing.move .passing-bar:before {
    -webkit-animation: passing-bar 1s ease 0s 1 normal forwards;
    animation: passing-bar 1s ease 0s 1 normal forwards;
}

.passing.move .passing-txt {
    -webkit-animation: passing-txt 0s ease .5s 1 normal forwards;
    animation: passing-txt 0s ease .5s 1 normal forwards;
}

/*フワッと表示*/
.scroll-fade {
    opacity: 0;
    transition: all .5s
        /*処理にかかる時間*/
    ;
}

.scroll-up {
    opacity: 0;
    transform: translateY(25px)
        /*スクロールアップする距離*/
    ;
    transition: all .5s
        /*処理にかかる時間*/
    ;
}

.scroll-up.done,
.scroll-fade.done {
    opacity: 1;
    transform: translate(0, 0);
}

.load-fade {
    opacity: 0;
    transition: all .5s
        /*処理にかかる時間*/
    ;
}

.load-up {
    opacity: 0;
    transform: translateY(25px)
        /*スクロールアップする距離*/
    ;
    transition: all 0.95s
        /*処理にかかる時間*/
    ;
}

.load-up.done,
.load-fade.done {
    opacity: 1;
    transform: translate(0, 0);
}










/* PC用のCSSはメディアクエリの外に記述する */

@media screen and (max-width: 959px) {
    /* 959px以下に適用されるCSS（レスポンシブ タブレット用） */

    .works_list{
        width: 90%;
        margin: 0 auto;
    }

    /*全体の幅*/
    .contents {
        margin: 0 auto;
        width: 95%;
    }

    .home .news_list{
        height: auto;
    }

    /*横幅突き抜けるやつ消す*/
    .background-flow,
    .background-FAQ,
    .chacol,
    .background-wave {
        margin: 0 -500%;
        padding: 0 500%;
    }

    .service-detail .select-inner{
   width: 45%;
    }

   .select-inner{
        width: 35%;
    }

    .btn06{
        width: 40%;
    }

    .contents_news{
        width: 100%;
    }

    .profile-p {
        width: 90%;
        padding: 36px 24px;
    }


    .logo-fuwafuwa {
        display: none;
    }

    .top-right {
        width: 30%;
    }

    .top-nav-title {
        font-size: 2em;
    }

    .top-list-nav-header a {
        line-height: 1;
        font-size: .95rem;
    }

    .profile-p-wrap {
        justify-content: center;
        padding:0 0 30px 0;
        width: 100%;
        margin: 0 auto;
    }

    .profile-p-img {
        width: 100%;
        margin-bottom: 30px;
    }

    .profile-img {
        height: 180px;
    }


    .mouse {
        display: none;
        opacity: 0;
    }

    .f_mv{
        margin-top: 0;
    }


    .scroll {
        position: absolute;
        left: 40%;
        bottom: 0%;
    }

    .p1{
        font-size: 14px;
        line-height: 2!important;
    }

    #sns-link {
        display: none;
    }

    .contents-block {
        padding: 0;
        padding-left: 0.5em;
    }

    .flex-box {
        margin: 0 auto;
    }

    .service-box {
        width: 30%;
        text-align: center;
    }

    .parts-img {
        height: 80px;
    }

    .btn07 {
        text-align: center;
    }

    /* 流れ */
    .sp-none {
        display: none;
    }

    .mail-address:before {
        display: none;
    }

    .more-btn-top {
        display: none;
    }

    .more-btn-a-sp {
        display: block;
    }

    /* フッター */
    .list-nav-footer {
        display: block;
        padding: 50px 0 0 0;
    }

    .list-nav-footer li {
        width: 100%;
    }

    .list-nav-footer li+li {
        border-left: none;
    }

    .list-nav-footer>li+li {
        margin-left: 0;
    }

    .sns-hover-sp {
        display: block;
        text-align: center;
        padding-left: 0;
        padding-top: 45px;
    }

    /* サービス一覧 */
    .more-btn-2 {
        display: inherit;
    }

    .more-btn-2:before,
    .more-btn-2:after {
        right: 20%;
    }

    /* トップページ */
    .title-logo {
        right: 0;
    }

    .list-nav-header {
        display: none;
    }

    .top-title-white{
        padding-top: 1em!important;
    }

    .top-subtitle-white{
        margin-bottom: 0!important;
    }


    /* ハンバーガー */
    .menu-btn {
        display: block;
        position: fixed;
        top: 0;
        right: 0;
        display: flex;
        height: 70px;
        width: 60px;
        justify-content: center;
        align-items: center;
        z-index: 90;
    }

    .menu-btn span,
    .menu-btn span:before,
    .menu-btn span:after {
        content: '';
        display: block;
        height: 1px;
        width: 25px;
        border-radius: 3px;
        background-color: #756a61;
        position: absolute;
    }

    .menu-btn span {
        background-color: rgba(0, 0, 0, 0);
    }

    .menu-btn span:before {
        bottom: 5px;
        background-color: #756a61;
    }

    .menu-btn span:after {
        top: 5px;
        background-color: #756a61;
    }

    /* ハンバーガー */
    .hamburger-menu {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 30;
    }

    /* チェックした時にバツにかわる */
    #menu-btn-check:checked~.menu-btn span {
        background-color: rgba(255, 255, 255, 0);
        /*メニューオープン時は真ん中の線を透明にする*/
    }

    #menu-btn-check:checked~.menu-btn span::before {
        bottom: 0;
        background: white;
        transform: rotate(45deg);
    }

    #menu-btn-check:checked~.menu-btn span::after {
        top: 0;
        background: white;
        transform: rotate(-45deg);
    }

    .list-nav-header-sp {
        display: block;
        width: 0%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 100%;
        z-index: 80;
        background-color: #695f59;
        transition: all 0.5s;
    }

    #menu-btn-check:checked~.list-nav-header-sp {
        left: auto;
        right: 0;
        width: 65%;
        /*メニューを画面内へ*/
    }

    .list-nav-header-sp ul {
        padding: 70px 24px 0;
    }

    .list-nav-header-sp ul li {
        border-bottom: solid 1px #8f867f;
        list-style: none;
        padding-bottom: 4px;
        padding-top: 4px;
    }

    .list-nav-header-sp ul li a {
        display: block;
        width: 100%;
        box-sizing: border-box;
        color: #ffffffd8;
        text-decoration: none;
        padding: 12px 16px;
    position: relative;
    font-size: 13px;
    }

    .copy-txt-wrap{
        padding-bottom: 2em;
    }

    .list-nav-header-sp ul li a::before {
        content: "";
        width: 7px;
        height: 7px;
        border-top: solid 2px #8f867f;
        border-right: solid 2px #8f867f;
        transform: rotate(45deg);
        position: absolute;
        right: 11px;
        top: 16px;
    }

    .about-title {
        display: none;
    }

    .more-btn,
    .more-btn-a {
        display: none;
        text-align: center;
    }

    .more-btn-a-sp {
        display: inline-block;
        background-color: #AA9E96;
        border: 1px solid transparent;
        border-radius: 5px;
        position: relative;
        padding: 0px 15% 5px 15%;
    }

    .more-btn-a-sp::before {
        content: '';
        position: absolute;
        top: -5px;
        left: -5px;
        width: 100%;
        height: 100%;
        background-color: transparent;
        border: 1px solid #333;
        border-radius: 5px;
    }

    .more-btn-a-sp:hover {
        background-color: #AA9E96;
    }

    .icon-right .service-list {
        padding: 0 50px 0 0;
    }

    .top-message {
        margin: 30px auto;
        text-align: center;
    }


    /* コンタクトページ */
    .contact-top {
        padding-top: 50px;
        padding-bottom: 50px;
        line-height: 1.9!important;
        margin: 0 auto;
        width: 95%;
    }

    .contents_sidebar {
        display: block;
    }

}




@media screen and (max-width: 740px) {

    /* 740px以下に適用されるCSS（スマホ用）レスポンシブ  */
    .w-40, .w-60 {
        width: 100%;
    }

    .btn{
        width: 100%;
        margin: 0 auto;
    }

    .contact-top{
        width: 90%;
        font-size: 14px;
    }

    .breadcrumb{
        width: 90%;
        margin: 0 auto;
    }

    .breadcrumb span{
        font-size: 12px;
    }

    .contact-poricy ul{
        padding: 20px 20px 20px 40px!important;
    }

    /* ボタン */
    a.btn_06{
        width: 100%;
    }

    p{
        line-height: 1.75!important;
    }

    .page-id-965 .headline-left{
        display: none;
    }

    .page-id-965 .headline-right{
        margin-right: auto;
    }

    p, th, td, li{
        font-size: 14px;
        letter-spacing: 0.15em;
        line-height: 1.8;
        color: #756a61;
        font-weight: 400;
    }

    .service-detail .select-inner{
        width: 40%;
    }

    .page-id-9 .contents-1{
        width: 90%!important;
    }

    .select-inner{
   width: 40%;
    }

    .page-id-13 .contents-2-profile{
        width: 90%;
        margin: 0 auto;
    }

    .page-id-9 .breadcrumb{
        width: 90%;
        margin: 0 auto;
    }

    .contact-poricy{
        padding: 15px 8px;
    }

    .news-post{
        padding-right: 0;
    }

    .contact .container{
        width: 90%;
    }

    /* お問合せページ */
    .page-id-43 tr{
        flex-wrap: wrap;
        padding-top: 1em;
    }

    .page-id-43 th,.page-id-43 td{
width: 100%;
    }

    .page-id-43 td{
        padding: 0;
    }


    .caution-red{
        margin-right: 5px;
    }

    .page-id-43 .contents-sub-title{
        font-weight: 500!important;
        font-size: 24px;
    }

/* 入力フィールドスタイリング */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea {
    padding: 8px;
    font-size: 15px;
}


/* お問い合わせページ */
.wpcf7 th{
    width: 100%;
    display: block;
}

.wpcf7 table{
    width: 100%;
}

.wpcf7 tr{
    display: block;
    padding-bottom: 8px;
    border-bottom: 1px solid #ededed;
    margin-bottom: 12px;
}

    .select{
        flex-wrap: wrap;
    }

    .select .w-50{
        width: 100%
    }

    .select-inner{
        padding-top: 40px;
        padding-bottom: 40px;
font-size: 1.25rem;
    }

    .btn06{
        width: 60%;
    }

    #sidebar {
        display: block;
        width: 90%;
    }


    .top-nav-title-sp{
        display: block;
    }

    .top-nav-title-sp p,.top-nav-title-sp a {
        font-size: 20px;
        line-height: 50px!important;
    }

    .contents-price h4{
        flex-wrap: wrap;
    }

    .page-content{
        width: 90%;
        margin: 0 auto;
    }

    .headline h1{
        font-size: 15px;
        margin: 0;
        padding-left: 12px;
        padding-top: 6px;
        color: #cec6c1;
    }

    .top-nav-title-sp a {
        display: inline-block;
        line-height: 50px;
    }

    .top-left .area-logo-header{
        height: 70px;
        width: 90%;
        margin: 0 auto;
        display: flex;
        align-items: center;
    }

    .border-frame {
        width: 100%;
    }

    .contents-price {
        padding: 25px;
    }

    .price {
        display: block;
        padding-left: 0;
    }

    .price-detail {
        display: block;
    }

    .price-others .header_other_home .container {
        padding-top: 0;
    }

    .content-works-btn{
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .header_other_home .container{
        height: 50px;
    }

    .logo-fuwafuwa {
        display: none;
    }

    .about-text {
        width: 100%;
    }

    .top-left {
        left: 0;
        width: 100%;
    }

    .top-right {
        display: none;
    }

    .top-mockup {
        margin-top: 30px;
    }

    .f-mv {
        display: block;
        margin-top: 0;
    }

    .header-home-nav{
        font-size: 18px;
    }


    .thumbnail a:hover {
        outline-width: 0;
    }

    .last-message p, .last-message ul, .last-message li{
        padding-bottom: 55px;
        font-size: 14px;
    }


    .title-img {
        border-radius: 0;
        height: 45vh;
        object-fit:cover;
        max-width: 100%;
        overflow: hidden;
    }

    .top-area {
        display: block;
        width: 100%;
        margin-top: 0;
        padding-top: 0;
        padding-bottom: 0!important;
    }

    .inblock{
        margin-right: 0!important;
        margin-left: 0!important;
    }

    .about-copy {
        margin-top: 0;
        font-size: 1.35rem;
    }


    .front-logo {
        height: 25px;
    }

    /* お知らせ */


    .date-wrap {
        display: block;
    }

    .contents_news {
        width: 100%;
    }

    .archive .news_list li{
width: 100%;
padding-right: 0;
padding-left: 0;
margin: 0px;
    }


    .works-thumbnail {
        margin: 0 auto;
    }

    .works-thumbnail img {
        height: auto;
        width: 100%;
        aspect-ratio: 4 / 3;
        overflow: hidden;
        margin-bottom: 20px;
    }

    .archive .img img{
        width: 100%;
        aspect-ratio: 4 / 3;
    }

    .client{
        font-size: 14px;
    padding: 12px 0;
    line-height: 1.5;
    }

    .archive .img{
        width: 100%;
    max-width: 400px;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    /*インスタ画像*/
    #sb_instagram.sbi_col_5.sbi_disable_mobile #sbi_images .sbi_item {
        width: 100%;
    }

    .form{
        padding: 20px 20px;
    }

    .balloon {
        display: none;
    }

    .logo-top-sp {
        position: absolute;
        right: 5%;
        top: 33%;
    }

    .single_works_container {
        display: block;
    }

    .thumb,
    .txt {
        max-width: 100%;
    }

    .mail-address strong:before {
        top: 12px;
        left: -30px;
        width: 20px;
        height: 20px;
    }

    .area_intro {
        height: 100px;
    }

    .top-message {
        display: none;
    }

    .left {
        padding: 0;
    }

    .area_intro {
        padding-top: 50px;
    }

    .parts-text {
        height: 120px;
        padding: 20px 0;
    }

    .message-frame {
        display: none;
    }

    .btn_link{
        padding: 0%;
        width: 100%;
    }

    .about-text {
    padding-left: 0px;
    }

    .message img {
        width: 150px;
        height: 150px;
        position: inherit;
        opacity: 0.8;
    }

    .sp-block {
        display: inline-block;
    }
    

    #wpadminbar {
        position: fixed;
    }

    /*about*/
    .background-wave {
        background: none;
        height: auto;
    }

    .inblock-wrap {
        display: block;
        height: auto;
        max-width: 80%;
    }

    .inblock-wrap h3 {
        display: block;
    }

    .point-number {
        width: 100%;
    }

    .inblock {
        width: auto;
        height: auto;
        margin: 0 auto;
        padding: 32px;
    }

    .service-block{
        padding-top: 0;
    }

    .inblock:not(:last-child) {
        margin-bottom: 30px;
    }

    /* 全体 */
    /*タイトル*/

    #list-nav-footer_id {
        height: auto;
    }


    .pc-none {
        display: block;
    }

    .pc-none-inline {
        display: inline-block !important;
    }

    .sp-left {
        text-align: justify;
    }

    .home-work-wrap .type{
        top: 0;
        right: 5%;
    }

    /* トップページ */
    .top-nav-title,
    .top-area-nav-header {
        display: none;
    }

    .contents-center {
        text-align: justify;
    }


    /*FAQ*/
    .background-FAQ {
        display: none;
    }

    /*works*/
    .news_list ul {
        margin: 0 auto;
        padding: 0;
    }

    .news_list li {
        padding-bottom: 8px;
        margin: 0;
    }

    .works_list{
        margin-bottom: 50px;
    }

    /*flow*/

    /* フッター */
    .footer-1 .contact {
        margin-top: 45px;
    }

    .footer-1{
        padding-top: 80px;
        padding-bottom: 0;
    }

    .list-nav-footer ul {
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        text-align: justify;
        padding: 0;
    }

    /* サービス一覧 */
    .service {
        width: 100%;
        flex-wrap: wrap;
        justify-content: center;
        margin-right: 0% !important;
        margin-left: 0 !important;
    }

    .service-contents {
        height: auto;
    }

    .service-box {
        width: 48% !important;
        text-align: center;
        padding: 0 !important;
        height: 250px !important;
    }

    .service-box:nth-child(3) {
        border-left: 3px solid rgb(0 0 0 / 5%) !important;
    }

    .service-box:nth-child(1),
    .service-box:nth-child(2) {
        border-bottom: 3px solid rgb(0 0 0 / 5%);
    }

    .service-box img {
        width: 55px;
        margin-top: 10px;
    }

    .pc-hover {
        text-align: justify;
    }

    .service-box-mask {
        display: none !important;
    }

    .service-box:hover .service-box-mask {
        padding: 15px;
        text-align: center;
        height: 100px
    }

    .icon-left .service-list {
        padding-left: 40px;
    }

    .icon-right {
        flex-direction: row-reverse;
        width: 80%;
    }

    .select .service-icon{
display: flex;
justify-content: flex-start;
align-items: center;
width: 20%;
    }

    .service-icon img{
        width: 60px;
        height: auto;
        opacity: 0.6;
    }

    .service-icon {
        margin: 0;
    }

    .service-icon .another-icon-sp {
        display: block;
    }

    .another-icon {
        display: none;
    }

    .number,
    .number-1 {
        display: none;
    }

    .step-text {
        writing-mode: inherit;
        height: inherit;
        padding: 15px 25px;
        margin-top: 10px;
        border-radius: 2px;
        display: flex;
        align-items: center;
        font-size: 15px;
    }

    .step-box {
        margin-bottom: 1.75rem;
        position: relative;
        font-size: 26px;
        text-align: center;
        width: 90%;
    }

    .step-box:not(:first-child)::after{
        font-family: "Font Awesome 5 Free";
        content: "\f0d7";
    font-weight: 900;
    position: absolute;
    font-size: 45px;
    color: #cac2bd35;
    right: 48%;
    top: -50%;
    }

    .background-flow .block{
        padding-bottom: 0;
    }

    .number-2{
        display: block;
        text-align: center;
        width: 45px;
    height: 45px;
    margin-right: 12px;
    }

    .step{
        margin-bottom: 50px;
    }


    /*フロー*/
    .area_intro {
        padding-top: 50px;
    }

    /* ヘッダー */
    h2 {
        font-size: 0.95rem;
    }

    h4 {
        font-size: 0.95rem;
    }

    .container {
        width: 90%;
    }

    .area-header-top {
        display: none;
    }

    .area-logo-header .logo {
        display: none;
    }

    .area-logo-header .logo-sp {
        display: block;
        width: 90%;
        margin: 0 auto;
        font-size: 1.5em;
    }

    /* ページコンテンツサブタイトル */
    .contents-sub-title {
        padding: 1.5em 0;
        font-size: 0.95rem;
    }

    /* 内容　料金 */
    /* 事業内容表 */
    .contents-1 {
        width: 90%;
        margin: 50px auto 50px auto;
    }

    /* 内容 表*/
    .headline {
        margin-top: 0;
        margin-bottom: 0;
        padding: 0.5em 5%;
        margin:0 auto;
        box-shadow: none;
        border: none;
        height: 90px;
        margin-left: calc(((100vw - 100%) / 2) * -1);
        margin-right: calc(((100vw - 100%) / 2) * -1);
        align-items: center;
        border-top: 1px solid #aaa6a163;
    }

    .headline-right {
        position: relative;
    }

    .headline-right :before {
        position: absolute;
        top: 0;
        left: 0;
        border-left: 2px solid rgb(77, 76, 76);
    }

    .bread {
        display: none;
    }

    .contents-block {
        padding: 0;
    }

    .contents-1 th {
        width: 30%;
    }

    .sp-none {
        display: none;
    }

    .list-nav-footer {
        display: block;
        padding: 50px 0 0 0;
    }

    .list-nav-footer li {
        width: 50%;
    }

    .list-nav-footer a{
        margin: 5px 1.4em;
        padding: 0.2rem;
    line-height: 1.3;
    }

    .list-nav-footer li+li {
        border-left: none;
        padding-left: 0;
    }

    .list-nav-footer>li+li {
        margin-left: 0;
    }

    /* お問い合わせボタン */
    .cta-btn-wrap {
        padding-bottom: 5em;
        padding-top: 0;
        border-radius: 10px;
        gap: 20px;
        width: 100%;
    }

    #menu-btn-check:checked~.list-nav-header-sp{
        width: 90%;
        opacity: 0.95;
    }

    .cta-btn {
        width: 100%;
        padding-left: 50px;
        font-size: 16px;
        font-weight: 500;
        margin: 0 auto;
    }

    .wpcf7 .wpcf7-submit:disabled{
        width: 100%;
    }

    form{
        box-shadow: none;
        border-top: 1px solid #ededed;
    }

    .frame2{
        bottom: -48px;
        left: -60%;
    }

    .top-area .relative{
        height: 40vh;
    }

    .frame2 img{
        width: 30%;
    }

    /* トップページ */
    .parts-box {
        width: 100%;
    }

    .flex-box {
        height: auto;
        flex-direction: column !important;
        margin: 0 auto;
        align-items: center;
    }

    .parts-box+.parts-box {
        margin: 5px 0;
    }

    /* about事業内容の表 */
    .contents-1 th,
    .contents-1 td {
        padding: 10px 0;
    }

    th{
        letter-spacing: 0.25em;
    }

    .last-message {
        padding-top: 0;
        font-size: 14px;
    }

    .relative{
        height: 75vh;
    }

    .title-img{
        margin-top: 0;
        position: absolute;
        bottom: 12px;
        right: 0;
    }



.highlight{
    font-weight: 700;
    font-size: 1.55rem;
    color: #fff;
    padding: 2px 5px 2px 10px;
    margin-right: 5px;
    border-radius: 2px;
    display: inline-block;
    letter-spacing: 1.45px;
    font-weight: 700;
    line-height: 1.2;
}

/* 背景伸びる */

/*==================================================
背景色が伸びて出現
===================================*/

/*全共通*/

.bgextend{
    animation-name:bgextendAnimeBase;
    animation-duration:1s;
    animation-fill-mode:forwards;
    position: relative;
    overflow: hidden;/*　はみ出た色要素を隠す　*/
    opacity:0;
  }
  
  @keyframes bgextendAnimeBase{
    from {
      opacity:0;
    }
  
    to {
      opacity:1;  
  }
  }
  
  /*中の要素*/
  .bgappear{
    animation-name:bgextendAnimeSecond;
    animation-duration:1s;
    animation-delay: 0.6s;
    animation-fill-mode:forwards;
    opacity: 0;
  }
  
  @keyframes bgextendAnimeSecond{
    0% {
    opacity: 0;
    }
    100% {
    opacity: 1;
  }
  }
  
  /*左から右*/
  .bgLRextend::before{
    animation-name:bgLRextendAnime;
    animation-duration:1s;
    animation-fill-mode:forwards;
      content: "";
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: #AA9F96;/*伸びる背景色の設定*/
  }
  @keyframes bgLRextendAnime{
    0% {
      transform-origin:left;
      transform:scaleX(0);
    }
    50% {
      transform-origin:left;
      transform:scaleX(1);
    }
    50.001% {
      transform-origin:right;
    }
    100% {
      transform-origin:right;
      transform:scaleX(0);
    }
  }
  
  /* スクロールをしたら出現する要素にはじめに透過0を指定　*/
  .bgappearTrigger,
  .bgLRextendTrigger{
      opacity: 0;
  }
}


/* ============================
   Service Section (提供メニュー)
   ============================ */
   .service-section {
    background: linear-gradient(160deg, #f9f8f6 0%, #f7f5f3 50%, #fefdfb 100%);
    background-blend-mode: lighten;
    position: relative;
    overflow: hidden;
  }
  
  .service-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("https://grainy-gradients.vercel.app/noise.svg");
    opacity: 0.15;
    mix-blend-mode: overlay;
    pointer-events: none;
  }
  
  .service-lead {
    text-align: center;
    color: #6c625b;
    font-size: 15px;
    line-height: 2;
    margin: 30px auto 50px;
    letter-spacing: 0.05em;
  }
  
  /* ===== グリッド ===== */
  .service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
    width: 92%;
    max-width: 1080px;
    margin: 0 auto 60px;
    list-style: none;
    padding: 0;
  }
  
  @media (max-width: 960px) {
    .service-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
    }
  }
  
  @media (max-width: 740px) {
    .service-grid {
      grid-template-columns: 1fr;
      gap: 16px;
    }
  }
  
  /* ===== カード ===== */
  .service-card {
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
    padding: 28px 26px 32px;
    text-align: left;
    color: #4b4641;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    position: relative;

  }
  
  .service-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08);
  }
  
  /* ===== 見出し部分 ===== */
  .service-head {
    display: block;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
  }

  .service-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-right: 12px;
    margin-bottom: 12px;
    padding: 12px;
    border-radius: 50%;
    background-color: #f7f5f3;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
  }

  .service-icon svg {
    width: 28px;
    height: 28px;
    display: block;
  }
  
  .service-emoji {
    font-size: 28px;
    filter: grayscale(15%) brightness(1.05);
  }
  
  .service-title {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #756A61;
  }
  
  /* ===== 説明文 ===== */
  .service-desc {
    font-size: 0.92rem;
    line-height: 1.9;
    color: #6c625b;
    margin-bottom: 18px;
    letter
  }


/* =========================
   Service セクション調整（追加CSS）
   - 背景はフルブリード、内容は中央 1080px に収める
   - カードの絵文字をモノクロSVGアイコンに差し替え（HTML変更なし）
   ========================= */

/* フルブリード背景＋左右の余白を詰める */
.service-section.grainy-gradient{
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-top: 80px;      /* .block の余白と馴染ませる */
  padding-bottom: 100px;
  background: radial-gradient(circle at 30% 20%, #f3efec 0%, #efe9e5 40%, #e7e1dc 80%);
  position: relative;
}
.service-section.grainy-gradient::before{
  /* 既存footerのノイズと同系の薄い粒状感 */
  content:"";
  position:absolute; inset:0;
  background-image:url("https://grainy-gradients.vercel.app/noise.svg");
  opacity:.18; mix-blend-mode:overlay; pointer-events:none;
}

/* セクション内の横幅を統一して中央揃え（ラベル・見出し・グリッド） */
.service-section .block-title,
.service-section .block-sub-title,
.service-section .service-lead,
.service-section .service-grid,
.service-section .btn{
  width: min(1080px, 92vw);
  margin-left: auto;
  margin-right: auto;
  text-align: left; /* カードとリードは左揃えの方が読みやすい */
}

.service-section .block-sub-title,.service-section .service-lead,
.service-section .btn{
    text-align: center;
}

/* リード文のトーンと行間 */
.service-section .service-lead{
  margin-top: 10px;
  margin-bottom: 35px;
  color: #6b625b;
  line-height: 1.9;
  letter-spacing: .02em;
}

/* グリッド：3列→タブレット2列→SP1列 */
.service-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
@media (max-width: 959px){
  .service-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px){
  .service-grid{ grid-template-columns: 1fr; }
}

/* カード */
.service-card{
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  padding: 22px 22px 20px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.service-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.09);
}

/* 見出し行 */
.service-head{
  margin-bottom: 10px;
}
.service-title{
  font-size: 1.08rem;
  line-height: 1.5;
  color: #756A61;
  font-weight: 700;
  margin: 0;
}

/* 説明文 */
.service-desc{
  color: #6f6761;
  font-size: .95rem;
  line-height: 1.9;
  margin: 0 0 12px;
  text-align: left;
}

/* テキストリンク調整（既存btn_06とトーン統一） */
.service-link{
  display: inline-block;
  font-size: .92rem;
  color: #756a61;
  border-bottom: 1px solid #d9d2cd;
  padding-bottom: 2px;
  transition: color .25s ease, border-color .25s ease, transform .25s ease;
}
.service-card:hover .service-link{
  color: #AA9E96;
  border-color: #AA9E96;
  transform: translateX(2px);
}
/* ===== Service アイコン Safari対応・描画修正版 ===== */
.service-emoji{ ... display:inline-flex; ... }
.service-emoji::before{ ... background-image: url("data:image/svg+xml;utf8,<svg ...>"); }

/* ===== Modern Split Footer ===== */
.fd-footer-split {
    background: #fff;
    color: #4b4641;
    border-top: 1px solid #eee6e1;
    padding: 80px 0 110px; /* 余白アップ */
  }
  
  .fd-footer-inner {
    max-width: 1120px;
    width: 90%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 24px 40px;
  }
  
  /* 左側 */
  .fd-footer-left {
    display: block;
    gap: 16px;
    flex-shrink: 0;
    margin-bottom: 24px;
  }
  
  .fd-logo a{
    text-decoration: none;
    font-family: "Montserrat", "Noto Sans JP", sans-serif;
    font-weight: 600;
    font-size: 1.2rem;
    letter-spacing: 0.01em;
    color: #716b65;
    margin: 0;
  }
  
  .fd-policy {
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    display: inline-block;
    width: 100%;
    text-align: left;
    color: #756a61;
    text-decoration: none;
    transition: color 0.25s ease;
  }
  .fd-policy:hover {
    color: #aa9e96;
  }
  
  /* 右側ナビ */
  .fd-footer-right {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 28px;
    justify-content: flex-start;
    flex-grow: 1;
  }
  
  .fd-footer-right a {
    text-decoration: none;
    color: #6f6761;
    font-size: 0.92rem;
    position: relative;
    transition: color 0.25s ease, transform 0.25s ease;
  }
  .fd-footer-right a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 100%;
    height: 1px;
    background: #d9d2cd;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.25s ease;
  }
  .fd-footer-right a:hover {
    color: #aa9e96;
    transform: translateY(-1px);
  }
  .fd-footer-right a:hover::after {
    transform: scaleX(1);
  }
  
  /* レスポンシブ */
  @media (max-width: 768px) {
    .fd-footer-inner {
      flex-direction: column;
      gap: 45px;
    }
    .fd-footer-left {
      order: 2;
    }
    .fd-footer-right {
      order: 1;
      justify-content: flex-start;
    }

    .fd-footer-right a{
        font-size: .75rem;
    }
    .fd-footer-split{
        padding: 36px 0;
    }

    .footer-2 p{
        margin-top: 35px;
        margin-bottom: 12px;
    }
  }

/* =========================
Footer Layout
========================= */

.footer-2{
    padding:60px 20px 40px;
    border-top:1px solid #eee;
    background:#fff;
  }
  
  .fd-footer-inner{
    max-width:1100px;
    margin:0 auto;
    text-align: left;
    display:block;
    justify-content:space-between;
    align-items:flex-start;
    gap:40px;
  }
  
  /* =========================
  Logo
  ========================= */
  
  .fd-logo{
    font-size:18px;
    font-weight:600;
    letter-spacing:0.08em;
  }
  
  .fd-logo a{
    color:#222;
    text-decoration:none;
  }
  
  /* =========================
  SNS
  ========================= */
  
  .fd-sns{
    margin-top:14px;
    display:flex;
    gap:14px;
  }
  
  .fd-sns a{
    font-size:18px;
    color:#666;
    transition:0.3s;
  }
  
  .fd-sns a:hover{
    color:#000;
    transform:translateY(-2px);
  }
  
  /* =========================
  Footer Nav
  ========================= */
  
  .fd-footer-right{
    display:flex;
    flex-wrap:wrap;
    gap:22px;
  }
  
  .fd-footer-right a{
    font-size:14px;
    color:#444;
    text-decoration:none;
    letter-spacing:0.05em;
  }
  
  .fd-footer-right a:hover{
    opacity:0.6;
  }
  
  /* =========================
  Copyright
  ========================= */
  
  .copyright{
    text-align:center;
    font-size:13px;
    color:#777;
    margin-top:40px;
  }
  
  .fd-policy{
    display:block;
    margin-bottom:8px;
    color:#666;
    text-decoration:none;
  }
  
  .fd-policy:hover{
    opacity:0.6;
  }