@charset "utf-8";

/* =============================================
*
*  SETTING
*
============================================= */

:root{
    /* COLOR */
    --light       :#FFFFFA;
    --light_rgb   :255 255 250;
    --accent_1     :#00873B;
    --accent_1_rgb :0 135 59;
    --accent_2     :#A39C89;
    --accent_2_rgb   :163 156 137;
    --danger       : #990000;
    --danger_rgb   : 153 0 0;
    --dark          : #3F3F3F;
    --dark_rgb      : 63, 63, 63;
    --gray          : #00000066;
    --lightgray1    :#878785;
    --lightgray2    :#A39C891A;
    /* SPACE */
    --space_8       : 144px;
    --space_7       : 112px;
    --space_6       : 72px;
    --space_5       : 40px;
    --space_4       : 32px;
    --space_3       : 20px;
    --space_2       : 16px;
    --space_1       : 8px;
    /* FONT SIZE */
    --font_5        : 32px;
    --font_5        : 24px;
    --font_4        : 20px;
    --font_3        : 18px;
    --font_2        : 16px;
    --font_1        : 14px;
}

    @media screen and (max-width:768px) {
        :root{
            /* SPACE */
            --space_8       : 96px;
            --space_7       : 72px;
            --space_6       : 56px;
        }
    }

body{
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-size: var(--font_2);
    min-height: 100vh;
    color: var(--dark);
    background-color: var(--light);
    line-height: 1.2em;
}

body *{
    letter-spacing: 0.03em;
    line-height: 1.4em;
}

.PC{
    display: block;
}

.SP{
    display: none;
}

    @media screen and (max-width:768px) {
        .PC{
            display: none;
        }

        .SP{
            display: block;
        }
    }

    section{
        padding: var(--space_8) 0;
    }

    @media screen and (max-width:768px) {
        section{
            padding-bottom: 0;
        }

        section:last-of-type{
            padding-bottom: var(--space_8);
        }
    }


h1,h2,h3,p{
    margin-bottom: 0;
}

a{
    text-decoration: none;
}

a:hover{
    text-decoration: none;
}

img{
    width: 100%;
    height: auto;
}

ul{
    padding-left: 0;
    margin-bottom: 0;
}

li{
    list-style: none;
}

.font_JS{
    font-family: "Shippori Mincho", serif;
    font-weight: 400;
    font-style: normal;
}

.font_en{
    font-family: "Josefin Sans", sans-serif;
    font-optical-sizing: auto;
    text-transform: uppercase;
}

.font_jp{
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
}

.container.Container{
    max-width: 1500px;
    margin: auto;
    width: 100%;
    padding: 0 4%;
}

.Font_1{
    font-size: var(--font_1);
}

.Font_3{
    font-size: var(--font_3);
}

/* =================================
*
*   Animation
*
================================= */

/* ふわっと */
.Anm.Normal {
    opacity: 0;
    transition: 1s;
    transform: translate(0, 10px);
}

.Anm.Normal.Show {
    opacity: 1;
    transform: translate(0, 0);
}

/* 横からスライドイン */
.Anm.SlideIn {
    opacity: 0;
    transition: 1s;
    transform: translate(-5px, 0);
}

.Anm.SlideIn.Show {
    opacity: 1;
    transform: translate(0, 0);
}

/* 横からスライドイン */
.Anm.SlideInRight{
    opacity: 0;
    transition: 0.8s;
    transform: translate(10px, 0);
}
.Anm.SlideInRight.Show{
    opacity: 1;
    transform: translate(0, 0);
}


/* 画像　ぼやけからクリア */
.Anm.Blur{
    filter: blur(2px);
    transition: 0.8s;
}
.Anm.Blur.Show{
    filter: blur(0px);
}


/* =================================
*
*   Page Title
*
================================= */

@keyframes moveGradient {
    0% {
        background-position: 0% 0%;
    }
    50% {
        background-position: 100% 100%;
    }
    100% {
        background-position: 0% 0%;
    }
}

#Page_Title_Wrap{
    width: 100%;
    height:  36vw;
    background-image: url(../img/page-title_bg.webp);
    background-size: 72%;
    background-position: top right;
    background-repeat: no-repeat;
    margin-top: -96px;
    padding-top: 96px;
}

#Page_Title_Wrap .Container{
    display: flex;
    align-items: center;
    height: 100%;
}

#Page_Title_Wrap h2{
    font-size: 120px;
    font-weight: 200;
    position: relative;
    display: inline-block;
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background-size: 150% 150%;
    animation: moveGradient 18s ease-in-out infinite;
    background-image: radial-gradient(circle at 80% 80%, #A39C89   0%, #A39C89 40%, #009944 80%);
    line-height: 1;
}

#Page_Title_Wrap h2 span{
    font-size: 32px;
    display: block;
    font-weight: 600;
    margin-top: -8px;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
}

@media screen and (max-width:768px) {
    #Page_Title_Wrap h2{
        font-size: 56px;
    }

    #Page_Title_Wrap h2 span{
        font-size: var(--font_3);
    }

    #Page_Title_Wrap{
        width: 100%;
        height:  300px;
        background-image: url(../img/page-title_bg_sp.webp);
        background-size: 72%;
        background-position: top right;
        background-repeat: no-repeat;
        margin-top: -96px;
        padding-top: 96px;
    }
}
/* =================================
*
*   Headline
*
================================= */

.Sec_Title{
    font-size: 96px;
    font-weight: 300;
    line-height: 1;
    margin-bottom: var(--space_6);
}

.Sec_Title span{
    font-size: 18px;
    font-weight: 00;
    display: block;
    font-family: "Noto Sans JP", sans-serif!important;
    font-optical-sizing: auto;
}

.Sec_Title.White{
    color: var(--light);
}

.Sec_Title.White span{
    color: var(--light);
}

.Sec_Title.Brown{
    color: var(--accent_2);
}

.Sec_Title.Brown span{
    color: var(--accent_2);
}

@media screen and (max-width:768px) {
    .Sec_Title{
        font-size: 56px;
    }

    .Sec_Title span{
        font-size: var(--font_2);
    }
}

.Sub_SecTitle{
    font-weight: 300;
    font-size: 72px;
    line-height: 1;
}

.Sub_SecTitle span{
    display: block;
    font-size: var(--font_4);
    font-family: "Noto Sans JP", sans-serif!important;
    font-optical-sizing: auto;
    font-weight: 500;
}

.Sub_SecTitle.Blown{
    color: var(--accent_2);
}

.Sub_SecTitle.White{
    color: var(--light);
}

.Sub_SecTitle.Black{
    color: var(--dark);
}

@media screen and (max-width:768px) {
    .Sub_SecTitle{
        font-size: 40px;
    }

    .Sub_SecTitle span{
        font-size: var(--font_3);
    }
}


/* =================================
*
*   Buttons
*
================================= */

/* 四角形のボタン */
.Btn_Box{
    min-width: 200px;
    width: fit-content;
    padding: 20px;
    text-align: center;
    border-radius: 0;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.4s all;
}

.Btn_Box:hover{
    opacity: 0.8;
}

.Btn_Box.Wh{
    background-color: var(--light);
    color: var(--accent_1);
}

.Btn_Box.Gr{
    background-color: var(--accent_1);
    color: var(--light);
}

.Btn_Box.Arrow{
    position: relative;
}

.Btn_Box.Arrow .Arrow_Wrap{
    position: absolute;
    top: 50%;
    right: 8px;
    transform: translateY(-50%);
}

.Arrow_Icon{
    position: relative;
    height: 1px;
    width: 16px;
    background-color: var(--dark);
    display: block;
}

.Arrow_Icon::before,
.Arrow_Icon::after{
    content: "";
    position: absolute;
    right: -1.5px;
    width: 6px;
    height: 1px;
    background-color: var(--dark);
}

.Arrow_Icon::before{
    transform: rotate(45deg) skew(-45deg);
    top: -2px;
}

.Arrow_Icon::after{
    transform: rotate(-45deg) skew(45deg);
    top: 2px;
}

.Btn_Box.Wh .Arrow_Icon{
    background-color: var(--accent_1);
}

.Btn_Box.Wh .Arrow_Icon::before,
.Btn_Box.Wh .Arrow_Icon::after{
    background-color: var(--accent_1);
}

/* ラインボタン */
/* 緑 */
.Btn_Arrow_Line{
    position: relative;
    color: var(--dark);
    border-bottom: solid 1px var(--dark);
    border-radius: 0;
    padding-inline: 0;
    margin-right: 88px;
}

.Btn_Arrow_Line.font_en{
    font-weight: 400;
}

.Btn_Arrow_Line .Btn_Arrow_Line_Icon_Wrap{
    position: absolute;
    top: 50%;
    left: calc(100% + 16px);
    width: 72px;
    height: 72px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translateY(-50%);
    background-color: var(--accent_1);
}

@media screen and (max-width:768px) {
    .Btn_Arrow_Line .Btn_Arrow_Line_Icon_Wrap{
        width: 64px;
        height: 64px;
    }
}

.Btn_Arrow_Line .Btn_Arrow_Line_Icon_Wrap .Arrow_Icon{
    transition: 0.4s all;
}

.Btn_Arrow_Line.Green .Btn_Arrow_Line_Icon_Wrap .Arrow_Icon{
    background-color: var(--light);
}

.Btn_Arrow_Line.Green .Btn_Arrow_Line_Icon_Wrap .Arrow_Icon::before,
.Btn_Arrow_Line.Green .Btn_Arrow_Line_Icon_Wrap .Arrow_Icon::after{
    background-color: var(--light);
}


.Btn_Arrow_Line:hover .Arrow_Icon{
    transform: translateX(4px);
}
/* 白 */
.Btn_Arrow_Line.White{
    color: var(--light);
    border-bottom: solid 1px var(--light);
}

.Btn_Arrow_Line.White .Btn_Arrow_Line_Icon_Wrap{
    background-color: var(--light);
}

.Btn_Arrow_Line.White .Btn_Arrow_Line_Icon_Wrap .Arrow_Icon{
    background-color: var(--accent_2);
}

.Btn_Arrow_Line.White .Btn_Arrow_Line_Icon_Wrap .Arrow_Icon::before,
.Btn_Arrow_Line.White .Btn_Arrow_Line_Icon_Wrap .Arrow_Icon::after{
    background-color: var(--accent_2);
}


/* =================================
*
*   Header
*
================================= */

header{
    position: sticky;
    top: 0;
    z-index: 20;
    background-image: linear-gradient(rgba(var(--light_rgb) / 0.8) 0%, rgba(var(--light_rgb) / 0.5) 60%, transparent 100%);
}

#Header_Inner{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 96px;
    max-width: 1500px;
}

header h1{
    height: 64px;
    width: auto;
    margin-bottom: 0;
}

header h1 img{
    max-height: 64px;
    width: auto;
}

header nav{
    display: flex;
    align-items: center;
    justify-content: end;
    width: 100%;
    max-width: calc(100vw - 200px);
}

header nav ul{
    display: flex;
    align-items: center;
    width: fit-content;
    gap: var(--space_4);
}

header nav ul a{
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--dark);
    font-size: var(--font_3);
    width: auto;
    font-weight: 500;
    transition: 0.4s all;
}

header nav ul a:hover{
    transform: translateY(2px);
    color: var(--dark);
}

header nav ul a span{
    color: var(--accent_2);
    font-size: var(--font_1);
    font-weight: 300;
}

header #GNav_Tel{
    background-color: var(--accent_1);
    color: var(--light);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 64px;
    padding-inline: 24px;
    font-size: var(--font_4);
    margin-left: var(--space_4);
    transition: 0.4s all;
}

header #GNav_Tel:hover{
    opacity: 0.8;
}

header #GNav_Tel i{
    font-size: var(--font_3);
    margin-right: var(--space_1);
}

#Btn_SP_Gnav_Toggle_Wrap{
    display: none;
}


@media screen and (max-width:1200px) { 
    
    header nav ul{
        gap: var(--space_3);
    }

    header nav ul a{
        font-size: var(--font_2);
    }

    header #GNav_Tel{
        margin-left: var(--space_3);
    }
}

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

    #PC_Nav_Wrap{
        display: none;
    }

    #Btn_SP_Gnav_Toggle_Wrap{
        display: block;
    }
    
    #Btn_SP_Gnav_Open{
        width: 56px;
        height: 56px;
        background-color: var(--accent_1);
        color: var(--light);
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 100%;
        font-weight: bold;
        font-size: 12px;
    }
}


#SP_Gnav_Wrap{
    background-color: var(--accent_1);
    width: 100vw;
    height: 100%;
    min-height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 50;
    padding-top: 96px;
    padding-inline: 16px;
    display: none;
    opacity: 0;
    transition: opacity 0.1s ease;
    overflow-y: scroll;
    padding-bottom: var(--space_8);
    color: var(--light);
}

#Btn_SP_Gnav_Wrap_Toggle_Wrap{
    position: fixed;
    top: 20px;
    right: 16px;
}

#Btn_SP_Gnav_Wrap_Close{
    width: 56px;
    height: 56px;
    background-color: var(--light);
    color: var(--accent_1);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-weight: bold;
    font-size: 12px;
}

#SP_Gnav_Inner{
    max-width: 480px;
    margin: auto;
}

#SP_Gnav_Inner ul li a{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: var(--light);
    font-size: var(--font_3);
    padding: var(--space_3) var(--space_1);
    border-bottom: solid 1px var(--accent_2);
    font-weight: 500;
}

#SP_Gnav_Inner a span{
    color: var(--accent_2);
    font-weight: 400;
    font-size: var(--font_1);
    margin-top: 10px;
}

#SP_Gnav_Tel{
    background-color: var(--light);
    color: var(--accent_1);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 64px;
    padding-inline: 24px;
    font-size: var(--font_4);
    margin-left: var(--space_4);
    margin: var(--space_4) auto;
}


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

/* Contact Link */
#Common_Contact_Wrap{
    background-color: var(--accent_1);
    padding: var(--space_7) 0;
}

#Common_Contact_Wrap h2{
    font-size: 72px;
    font-weight: 300;
    text-align: center;
    line-height: 1;
    margin-bottom: var(--space_4);
    color: var(--light);
}

#Common_Contact_Wrap h2 span{
    display: block;
    font-size: var(--font_2);
    text-align: center;
    font-weight: 400;
}

@media screen and (max-width:768px) {
    #Common_Contact_Wrap h2{
        font-size: 56px;
    }
}


/* Footer  */

footer{
    padding: var(--space_5) var(--space_2);
}

footer .PC{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space_6);
}

footer .Logo_Wrap img{
    width: 260px;
    height: auto;
}

footer .Logo_Wrap span{
    color: var(--accent_1);
    display: block;
    font-size: var(--font_1);
}

footer .PC ul{
    display: flex;
    gap: 24px;
}

footer .PC ul a{
    color: var(--dark);
    font-size: var(--font_3);
    font-weight: 500;
    text-align: center;
    display: inline-block;
    transition: 0.4s all;
}

footer .PC ul a:hover{
    color: var(--accent_1);
}

footer .PC ul a span{
    font-weight: 300;
    color: var(--accent_1);
    font-size: var(--font_1);
    display: block;
}

footer small{
    display: block;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    color: var(--accent_1);
}

@media screen and (max-width:1024px) { 
    footer .PC{
        display: none;
    }
}




/* =================================
*
*   TOP Page
*
================================= */
/* --- Main Visual --- */
#Main_Visual_Wrap{
    padding-top: var(--space_7);
}

.masked-text {
    font-size: 72px;
    font-weight: bold;
    line-height: 1;
    color: var(--dark);
}

.mask-word {
    position: relative;
    display: inline-block;
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background-size: 300% 300%;
    animation: moveGradient 18s ease-in-out infinite;
}

/* グラデーション背景をそれぞれの単語に適用 */
.word1 {
    background-image: radial-gradient(circle at 80% 80%, #8F9900 0%, #D6CDB4 40%,var(--dark) 80%
);
}

.word2 {
    background-image: radial-gradient(circle at 80% 80%, var(--dark) 0%, #87CC00 20%, #D6CDB4 60%);
}

#Main_Visual_Wrap h3{
    font-size: 40px;
    color: var(--accent_1);
    font-weight: 800;
}

@media screen and (max-width:1024px) { 
    .masked-text{
        font-size: 56px;
    }

    #Main_Visual_Wrap h3{
        font-size: 31px;
    }
}

@media screen and (max-width:768px) { 
    .masked-text{
        font-size: 40px;
    }

    #Main_Visual_Wrap h3{
        font-size: 22px;
    }
}

@media screen and (max-width:540px) { 
    .masked-text{
        font-size: 28px;
    }

    #Main_Visual_Wrap h3{
        font-size: 18px;
    }
}

@media screen and (max-width:340px) { 
    .masked-text{
        font-size: 26px;
    }
}


#Main_Visual_Wrap .Img_Wrap{
    margin-top: var(--space_5);
    position: relative;
}

#Main_Visual_Wrap .Img_Wrap .Scroll_Down{
    position: absolute;
    bottom: calc(100% - 16px);
    right: 4%;
    color: var(--accent_2);
    font-weight: 300;
    width: fit-content;
    height: fit-content;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#Main_Visual_Wrap .Img_Wrap .Scroll_Down > span{
    white-space: nowrap;
    letter-spacing: 0.08em;
    writing-mode: vertical-rl;
    font-size: var(--font_1);
}

#Main_Visual_Wrap .Img_Wrap .Scroll_Down .Down_Icon_Wrap{
    width: 72px;
    height: 72px;
    border: solid 1px var(--accent_2);
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: var(--space_3);
    transform: rotate(90deg);
}

#Main_Visual_Wrap .Img_Wrap .Scroll_Down .Down_Icon_Wrap .Arrow_Icon{
    background-color: var(--accent_2);
    -webkit-animation: arrow 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s infinite alternate;
    animation: arrow 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s infinite alternate;
}

#Main_Visual_Wrap .Img_Wrap .Scroll_Down .Down_Icon_Wrap .Arrow_Icon::before,
#Main_Visual_Wrap .Img_Wrap .Scroll_Down .Down_Icon_Wrap .Arrow_Icon::after{
    background-color: var(--accent_2);
}

@keyframes arrow {
    0% {
        opacity: 1;
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0);
    }
    100% {
        opacity: 0.8;
        -webkit-transform: translate3d(4px, -50%, 0);
        transform: translate3d(4px, -50%, 0);
    }
}

@media screen and (max-width:768px) {
    #Main_Visual_Wrap .Img_Wrap{
        margin-top: 180px;
    }

    #Main_Visual_Wrap .Img_Wrap .Scroll_Down > span{
        font-size: 12px;
    }

    #Main_Visual_Wrap .Img_Wrap .Scroll_Down .Down_Icon_Wrap{
        width: 56px;
        height: 56px;
        margin-top: var(--space_2);
    }
}

/* --- About --- */

#Top_About_Inner{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#Top_About_Wrap .Text_Wrap h2{
    font-size: 24px;
    font-weight: 500;
    margin-bottom: var(--space_6);
}

#Top_About_Wrap .Text_Wrap h2 > span{
    font-size: 32px;
    color: var(--accent_1);
}

#Top_About_Wrap .Text_Wrap p{
    margin-bottom: var(--space_3);
}

#Top_About_Wrap .Link_Wrap{
    margin-top: var(--space_6);
}

#Top_About_Wrap .Img_Wrap{
    width: 37%;
    position: relative;
}


#Top_About_Wrap .Img_Wrap .Img_1{
    width: 100%;
    height: auto;
}

#Top_About_Wrap .Img_Wrap .Img_2{
    position: absolute;
    top: 78%;
    left: -8%;
    width: 42.116%;


}
@media screen and (max-width:768px) {
    #Top_About_Inner{
        flex-direction: column;
    }

    #Top_About_Wrap .Link_Wrap{
        display: flex;
        justify-content: end;
    }
}

/* --- News&Column --- */

#Top_News_Wrap{
    margin-top: var(--space_8);
    position: relative;
}

#Top_News_Wrap::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 0;
    padding-bottom: 21.376%;
    background-image: url(../img/top/news_bg.webp);
    top: 0;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
    background-size: cover;
}

@media screen and (max-width:768px) {
    #Top_News_Wrap::before{
        background-image: url(../img/top/sp_news_bg.webp);
        padding-bottom: 49.4152%;
    }
}

.News_Box_Wrap{
    border-radius: 20px;
    padding: var(--space_7) 4%;
    display: flex;
    justify-content: space-between;
    gap: 6%;
    position: relative;
}

.News_Box_Wrap .Title_Wrap{
    width: 440px;
}
.News_Box_Wrap .News_List_Wrap{
    width: 100%;
}

#Top_News_Inner.News_Box_Wrap::before{
    content: "";
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(249deg, #c7bdab,#7E796B, #A39C89);
    background-size: 300% 300%;
    animation: GradFlow 40s ease infinite;
    border-radius: 20px;
    z-index: -1;
}

#Top_Column_Inner.News_Box_Wrap::before{
    content: "";
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(249deg, #C7C7C4,#878785, #C7C7C4);
    background-size: 300% 300%;
    animation: GradFlow 40s ease infinite;
    border-radius: 20px;
    z-index: -1;
}

@keyframes GradFlow {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}


.News_Item_Wrap > a{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border-bottom: solid 1px var(--light);
    padding: 20px 16px;
    color: var(--light);
    transition: 0.4s all;
}

.News_Item_Wrap > a:hover{
    opacity: 0.6;
}

.News_Item_Wrap:first-of-type > a{
    border-top: solid 1px var(--light);
}

.News_Item_Wrap > a .Info_Wrap{
    display: flex;
    align-items: center;
    gap: 24px;
}

.News_Item_Wrap > a .Info_Wrap time{
    font-size: var(--font_1);
    font-family: "Josefin Sans", sans-serif;
    font-optical-sizing: auto;
    margin-bottom: 0;
    line-height: 14px;
    display: inline-block;
    vertical-align: middle;
    transform: translateY(2px);
}

.News_Item_Wrap > a .Info_Wrap h3{
    font-size: 16px;
}

.News_Item_Wrap > a .Circle_Arrow_Wrap{
    width: 44px;
    height: 44px;
    border: solid 1px var(--light);
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon{
    background-color: var(--light);
}

.News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon::before,
.News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon::after{
    background-color: var(--light);
}

@media screen and (max-width:768px) {
    .News_Box_Wrap{
        flex-direction: column;
    }

    .News_Box_Wrap .Title_Wrap h2{
        text-align: center;
    }

    .News_Box_Wrap .Link_Wrap.SP{
        justify-content: end;
        display: flex;
        margin-top: var(--space_5);
    }

    .News_Item_Wrap > a{
        padding: var(--space_1);
    }

    .News_Item_Wrap > a .Info_Wrap{
        flex-direction: column;
        align-items: start;
        gap: 4px;
    }

    .News_Box_Wrap .Title_Wrap{
        width: 100%;
    }

    #Top_Column_Wrap{
        padding-bottom: var(--space_8);
    }

    .News_Item_Wrap > a .Circle_Arrow_Wrap{
        width: 36px;
        height: 36px;
    }

    .News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon{
        width: 12px;
    }

    .News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon::before,
    .News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon::after{
        width: 6px;
    }
}


/* --- Service --- */

#Top_Service_Wrap .Content_Wrap ul{
    display: flex;
    justify-content: space-between;
    gap: 4%;
    flex-wrap: wrap;
}

#Top_Service_Wrap .Content_Wrap ul li{
    width: calc(92% / 3);
    margin-bottom: var(--space_3);
}

#Top_Service_Wrap .Content_Wrap ul li a{
    width: 100%;
    transition: 0.4s;
}

#Top_Service_Wrap .Content_Wrap ul li a .Img_Wrap{
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: var(--space_1);
    transition: 0.4s;
    position: relative;
}

#Top_Service_Wrap .Content_Wrap ul li a .Img_Wrap::after{
    transition: 0.4s all;
    content: "VIEW MORE";
    background-color: rgba(var(--accent_1_rgb) / 0.6);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 16px;
    font-family: "Josefin Sans", sans-serif;
    font-optical-sizing: auto;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--light);
    opacity: 0;
}

#Top_Service_Wrap .Content_Wrap ul li a:hover .Img_Wrap::after{
    opacity: 1;
}


#Top_Service_Wrap .Content_Wrap ul li .Img_Wrap img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

#Top_Service_Wrap .Content_Wrap ul li .Text_Wrap{
    color: var(--dark);
    font-size: var(--font_3);
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: 0.4s all;
}

#Top_Service_Wrap .Content_Wrap ul li a:hover .Text_Wrap{
    color: var(--accent_1);
    font-weight: 500;
}

#Top_Service_Wrap .Content_Wrap ul li .Text_Wrap .Arrow_Icon_Wrap{
    width: 34px;
    height: 34px;
    border-radius: 100%;
    border: solid 1px var(--dark);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.2s all;
}

#Top_Service_Wrap .Content_Wrap ul li a:hover .Text_Wrap .Arrow_Icon_Wrap{
    border: solid 1px var(--accent_1);
    background-color: var(--accent_1);
}

#Top_Service_Wrap .Content_Wrap ul li .Text_Wrap .Arrow_Icon_Wrap .Arrow_Icon{
    width: 12px;
    transition: 0.2s all;
}

#Top_Service_Wrap .Content_Wrap ul li .Text_Wrap .Arrow_Icon_Wrap .Arrow_Icon::before,
#Top_Service_Wrap .Content_Wrap ul li .Text_Wrap .Arrow_Icon_Wrap .Arrow_Icon::after{
    width: 6px;
}

#Top_Service_Wrap .Content_Wrap ul li a:hover .Arrow_Icon_Wrap .Arrow_Icon{
    background-color: var(--light);
}

#Top_Service_Wrap .Content_Wrap ul li a:hover .Text_Wrap .Arrow_Icon_Wrap .Arrow_Icon::before,
#Top_Service_Wrap .Content_Wrap ul li a:hover .Text_Wrap .Arrow_Icon_Wrap .Arrow_Icon::after{
        background-color: var(--light);
}

@media screen and (max-width: 768px) {
    #Top_Service_Wrap .Content_Wrap ul li{
        width: 100%;
        margin-bottom: var(--space_3);  
    }

    #Top_Service_Wrap .Content_Wrap ul li a{
        display: flex;
        align-items: center;
        gap: 4%;
    }

    #Top_Service_Wrap .Content_Wrap ul li a .Img_Wrap{
        width: 40%;
        flex-shrink: 0;
    }

    #Top_Service_Wrap .Content_Wrap ul li .Text_Wrap{
        width: 100%;
        font-size: var(--font_2);
    }
}



/* --- Price --- */

#Price_Inner{
    border: solid 1px var(--dark);
    padding: var(--space_7) 8%;
    max-width: 1024px;
    margin: auto;
}

#Price_Inner h2{
    font-size: 64px;
}

#Price_List_Wrap{
    background-color: rgba(var(--accent_2_rgb) / 0.09);
    padding: var(--space_3) 4%;
    max-width: 600px;
    margin: var(--space_4) auto;
}

#Price_List_Wrap h3{
    text-align: center;
    font-size: var(--font_2);
    font-weight: 500;
    color: var(--accent_1);
}

#Price_List_Inner{
    border-top: solid 1px var(--accent_1);
    border-bottom: solid 1px var(--accent_1);
    padding: var(--space_2) 4%;
}

#Price_List_Inner dl {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    margin-bottom: var(--space_1);
}

#Price_List_Inner dt {
    display: flex;
    align-items: center;
    white-space: nowrap;
    width: 100%;
}

@media screen and (max-width:500px) {	
	#Price_Inner {
		padding: var(--space_7) 4%;
	}
	#Price_List_Inner{
		padding: var(--space_2) 0%;
	}
	#Price_List_Inner dt {
		white-space: break-spaces;
	}
}

#Price_List_Inner dt span {
    flex-grow: 1;
    height: 1px;
    width: fit-content;
    border-bottom: 1px dotted var(--accent_2);
    display: block;
    margin: auto var(--space_2);
}

#Price_List_Inner dd {
    font-size: 24px;
    color: var(--accent_1);
    white-space: nowrap;
    margin-bottom: 0;
}

#Price_List_Wrap > span{
    color: var(--lightgray1);
    font-size: var(--font_1);
}

.Separate_Estimate_Wrap ol{
    margin: var(--space_4) auto;
    width: fit-content;
    padding-left: var(--space_3);
}

.Separate_Estimate_Wrap ol li{
    list-style: decimal;
}

.Separate_Estimate_Wrap ol li::marker{
    color: var(--accent_2);
    font-family: "Josefin Sans", sans-serif;
    font-size: var(--font_3);
}

@media screen and (max-width:768px) {
    #Price_Inner h2{
        font-size: 40px;
    }

    #Price_Inner p.text-center{
        text-align: start!important;
    }

    #Price_List_Inner dd{
        font-size: var(--font_3);
    }
}

/* --- Flow --- */
.Flow_Item {
    position: relative;
}

.Flow_Item .Arrow_Icon_Wrap{
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: solid 1px var(--dark);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: calc(100% + 16px);
    left: 28px;
    margin-left: 0;
    line-height: 40px;
    font-size: var(--font_1);
    transform: rotate(90deg);
}

.Flow_Item:last-of-type::after{
    display: none;
}

.Flow_Item .Flow_Item_Inner{
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 20px;
    align-items: start;
    margin-bottom: var(--space_6);
}

.Flow_Item:last-of-type .Flow_Item_Inner{
    margin-bottom: 0;
}

.Flow_Item .Icon_Wrap{
    color: var(--accent_2);
    font-size: var(--font_3);
    text-align: center;
}

.Flow_Item .Icon_Wrap span{
    font-size: 24px;
}

.Flow_Item .Icon_Wrap .Icon{
    background-color: var(--accent_2);
    padding: var(--space_2);
    width: 96px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}

.Flow_Item .Icon_Wrap .Icon img{
    max-width: 56px;
    max-height: 56px;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.Flow_Title{
    font-size: var(--font_4);
    font-weight: 700;
}

.Flow_Item .Flow_Detail{
    background-color: rgba(var(--accent_2_rgb) / 0.1);
    border-radius: 12px;
    padding: var(--space_3) var(--space_2);
    min-height: 96px;
}

.Flow_Item .Flow_Detail a{
    background-color: var(--accent_2);
    border-radius: 0;
    padding: 6px var(--space_4);
    color: var(--light);
    font-weight: 500;
    position: relative;
    margin-top: var(--space_1);
    transition: 0.4s all;
}

.Flow_Item .Flow_Detail a .Arrow_Icon{
    position: absolute;
    top: 50%;
    right: 4px;
    transform: translateY(-50%);
    font-size: var(--font_1);
    background-color: var(--light);
    transition: 0.4s all;
}

.Flow_Item .Flow_Detail a .Arrow_Icon::before,
.Flow_Item .Flow_Detail a .Arrow_Icon::after{
    background-color: var(--light);
    transition: 0.4s all;
}

.Flow_Item .Flow_Detail a:hover{
    background-color: var(--light);
    color: var(--accent_2);
    border: solid 1px var(--accent_2);
}

.Flow_Item .Flow_Detail a:hover .Arrow_Icon{
    background-color: var(--accent_2);
}

.Flow_Item .Flow_Detail a:hover .Arrow_Icon::before,
.Flow_Item .Flow_Detail a:hover .Arrow_Icon::after{
    background-color: var(--accent_2);
}

/* スマホのとき */
@media screen and (max-width: 768px) {

    #Flow_Wrap{
        /*padding-bottom: 0; */
    }

    .Flow_Item .Flow_Item_Inner {
        display: block;
    }

    .Flow_Item .Left_Group {
        display: flex;
        align-items: end;
        margin-bottom: var(--space_2);
        gap: 16px;
    }

    .Flow_Item .Left_Group .Flow_Title{
        padding-bottom: 15px;
        font-size: var(--font_4);
    }

    .Flow_Item .Icon_Wrap .Icon{
        background-color: var(--accent_2);
        padding: 12px;
        width: 56px;
        height: 56px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 6px;
    }

    .Flow_Item .Icon_Wrap .Icon img{
        max-width: 48px;
        max-height: 48px;
    }

    .Flow_Item .Arrow_Icon_Wrap{
        left: 50%;
        top: calc(100% + 10px);
        transform: translateX(-50%) rotate(90deg);
    }

    .Flow_Item .Icon_Wrap{
        font-size: var(--font_1);
    }

    .Flow_Item .Icon_Wrap span{
        font-size: var(--font_3);
    }
}



/* =================================
*
*   About Page
*
================================= */

/* --- About Text --- */
#About_Text_Wrap{
    padding-top: 0;
}

#About_Text_Inner{
    max-width: 670px;
    width: 100%;
    margin: auto;
}

#About_Text_Wrap h3{
    font-size: var(--font_5);
    font-weight: 500;
}

#About_Text_Wrap h3 span{
    color: var(--accent_1);
    font-size: 32px;
}

#About_Text_Wrap .Text_Wrap{
    margin-top: var(--space_5);
}

#About_Text_Wrap p{
    margin-bottom: var(--space_3);
} 

@media screen and (max-width: 768px) {
    #About_Text_Inner{
        max-width: inherit;
    }


    #About_Text_Wrap h3{
        font-size: var(--font_3);
        font-weight: 500;
    }

    #About_Text_Wrap h3 span{
        font-size: 24px;
    }
}

/* --- Message --- */

#Message_Inner{
    display: flex;
    gap: 8%;
    justify-content: space-between;
    align-items: flex-start;
}

#Message_Inner .Text_Wrap{
    width: 100%;
    max-width: 725px;
    padding-top: var(--space_6);
}

#Message_Inner .Img_Wrap{
    width: 40%;
    max-width: 440px;
    overflow: hidden;
    border-radius: 20px;
    flex-shrink: 0;
}

#Message_Inner .Text_Wrap h4{
    margin-bottom: var(--space_4);
    font-size: var(--font_5);
}

#Message_Inner .Text_Wrap p{
    margin-bottom: var(--space_3);
}

#Message_Name{
    font-size: var(--font_4);
    font-weight: 500;
    display: flex;
    align-items: baseline;
    justify-content: end;
    gap: var(--space_3);
    margin-top: var(--space_4);
}

#Message_Name > span{
    font-size: var(--font_1);
    color: var(--accent_1);
}

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

    #Message_Wrap .Sub_SecTitle{
        text-align: center;
    }

    #Message_Inner{
        flex-direction: column-reverse;
        gap: 8%;
        justify-content: center;
        align-items: center;
        margin-top: var(--space_4);
        margin-bottom: var(--space_8);
    }

    #Message_Inner .Text_Wrap h4{
        margin-bottom: var(--space_3);
        font-size: var(--font_4);
    }

    #Message_Inner .Img_Wrap{
        width: 80%;
        max-width: 440px;
        border-radius: 12px;
    }
}

/* --- Our Experts --- */

#Experts_Wrap{
    position: relative;
}

#Experts_Wrap::before{
    content: "";
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(90deg, #C7C7C4,#878785, #C7C7C4);
    background-size: 150% 150%;
    animation: GradFlow 30s ease infinite;
    z-index: -1;
}

#Experts_Inner{
    margin: var(--space_4) 0;
}

#Experts_Inner ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: var(--space_6) var(--space_2);
}

#Experts_Inner li{
    width: calc((100% / 4) - 16px);
}

#Experts_Inner li .Img_Wrap{
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: var(--space_1);
	aspect-ratio: 224 / 283;
}

#Experts_Inner li .Text_Wrap{
    color: var(--light);
    font-weight: 700;
}

#Experts_Inner li .Text_Wrap .Role{
    margin-bottom: 12px;
}

#Experts_Inner li .Text_Wrap .Name{
    font-size: var(--font_5);
    line-height: 1;
    margin-bottom: 12px;
}

#Experts_Inner li .Text_Wrap .Name span{
    display: block;
    font-size: var(--font_1);
    line-height: var(--font_1);
}

@media screen and (max-width: 1024px) {
    #Experts_Inner li{
        width: calc((100% / 3) - 16px);
    }
}

@media screen and (max-width: 768px) {
    #Experts_Inner li{
        width: calc((100% / 2) - 16px);
    }
}

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

    #Experts_Wrap{
        padding-bottom: var(--space_8);
    }

    #Experts_Inner ul{
        gap: var(--space_3);
    }

    #Experts_Inner li{
        width: 100%;
        display: flex;
        align-items: start;
        border-bottom: solid 1px var(--light);
        padding-bottom: var(--space_3);
        gap: var(--space_1);
    }

    #Experts_Inner li:last-of-type{
        border-bottom: none;
    }

    #Experts_Inner li .Img_Wrap{
        width: 40%;
        border-radius: 8px;
    }

    #Experts_Inner li .Text_Wrap .Role{
        margin-bottom: 8px;
        font-size: 13px;
    }

    #Experts_Inner li .Text_Wrap .Name{
        font-size: 20px;
        line-height: 1;
        margin-bottom: 12px;
    }

    #Experts_Inner li .Text_Wrap .Name span{
        display: block;
        font-size: 12px;
        line-height: 12px;
    }

    #Experts_Inner li .Text_Wrap .Free_Text{
        font-size: var(--font_1);
    }
}

/* --- Company --- */

#Company_Wrap .Info_Wrap{
    margin-top: var(--space_6);
    margin-inline: auto;
    max-width: 800px;
}

#Company_Wrap .Info_Wrap dl{
    display: flex;
    margin-bottom: 0;
}

#Company_Wrap .Info_Wrap dl dt{
    width: 200px;
    border-right: solid 1px var(--accent_2);
    font-size: var(--font_3);
    padding: var(--space_2) 0;
    flex-shrink: 0;
}

#Company_Wrap .Info_Wrap dl dd{
    width: 100%;
    padding: var(--space_2) 0;
    padding-left: var(--space_4);
}

#Company_Wrap .Info_Wrap dl dd .Map_Wrap{
    width: 100%;
    max-width: 570px;
    max-height: 312px;
    height: 0;
    padding-bottom: 55.714%;
    position: relative;
    overflow: hidden;
    margin-top: var(--space_1);
}

#Company_Wrap .Info_Wrap dl dd .Map_Wrap iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


#Company_Wrap .Info_Wrap dl dd a{
    color: var(--dark);
}

#Company_Wrap .Gmap_Link{
    display: flex;
    justify-content: end;
}

#Company_Wrap .Gmap_Link a{
    background-color: var(--accent_2);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--light)!important;
    border-radius: 0;
    padding: 4px var(--space_2);
    margin-top: var(--space_1);
}

#Company_Wrap .Gmap_Link a i{
    margin-right: 4px;
}

@media screen and (max-width: 768px) {
    #Company_Wrap{
        padding-bottom: var(--space_8);
    }
}

@media screen and (max-width: 540px) {
    #Company_Wrap .Info_Wrap dl{
        display: block;
        margin-bottom: 0;
        border-bottom: solid 1px var(--accent_2);
        padding: var(--space_2) var(--space_1);
    }

    #Company_Wrap .Info_Wrap dl dt{
        width: 100%;
        border-right: none;
        font-size: var(--font_3);
        padding: 0;
    }

    #Company_Wrap .Info_Wrap dl dd{
        width: 100%;
        padding: 0;
        padding-left: 0;
        padding-top: var(--space_1);
    }

    #Company_Wrap .Info_Wrap dl dd .Map_Wrap{
        width: 100%;
        max-width: 570px;
        max-height: 312px;
        height: 0;
        padding-bottom: 55.714%;
        position: relative;
        overflow: hidden;
        margin-top: var(--space_1);
    }
}

/* =================================
*
*   News List Page / Column List Page
*
================================= */

#News_List{
    padding-top: 0;
}

#Uniqe_Page_News_List{
    padding-bottom: var(--space_4);
}

#Uniqe_Page_News_List .News_Item_Wrap > a{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border-bottom: solid 1px var(--dark);
    padding: 20px 16px;
    color: var(--dark);
    transition: 0.4s all;
}

#Uniqe_Page_News_List .News_Item_Wrap:first-of-type > a{
    border-top: solid 1px var(--dark);
}

#Uniqe_Page_News_List .News_Item_Wrap > a .Circle_Arrow_Wrap{
    border: solid 1px var(--accent_2);
}

#Uniqe_Page_News_List .News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon{
    background-color: var(--accent_2);
}

#Uniqe_Page_News_List .News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon::before,
#Uniqe_Page_News_List .News_Item_Wrap > a .Circle_Arrow_Wrap .Arrow_Icon::after{
    background-color: var(--accent_2);
}

#Uniqe_Page_News_List .News_Item_Wrap > a time{
    color: var(--accent_2);
}

#Paging{
    margin: auto;
    width: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--space_2);
}

#Paging .Btn_Box{
    border: solid 1px var(--accent_2);
    color: var(--accent_2);
}

#Paging .Btn_Box:hover{
    background-color: var(--accent_2);
    color: var(--light);
    opacity: 1;
}

#Paging .Circle_Arrow_Wrap{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 100%;
    background-color: var(--accent_2);
    transition: 0.4s all;
}

#Paging .Circle_Arrow_Wrap .Arrow_Icon{
    background-color: var(--light);
    width: 12px;
}

#Paging .Circle_Arrow_Wrap .Arrow_Icon::before,
#Paging .Circle_Arrow_Wrap .Arrow_Icon::after{
    background-color: var(--light);
    width: 6px;
}

#Paging .Circle_Arrow_Wrap.prev .Arrow_Icon{
    transform: rotate(180deg);
}

.Paging_Link.empty{
    width: 134.41px;
    display: inline-block;
    pointer-events: none;
}

@media screen and (max-width: 768px) {
    #News_List{
        padding-bottom: var(--space_8);
        padding-top: 0;
    }

    #Uniqe_Page_News_List{
        padding-top: 0;
        padding-inline: 0;
    }

    .Paging_Link.empty{
        width: 44px;
    }

    #Paging a:hover div.Circle_Arrow_Wrap{
        opacity: 0.4;
    }

}

#Paging > a.d-flex{
    color: var(--accent_2);
}

#Paging > a.d-flex:hover .PC{
    transition: 0.8s all;
}

#Paging > a.d-flex:hover .PC{
    text-decoration: underline;
}


/* =================================
*
*   News Article Page / Column Article Page
*
================================= */

#News_Article_Wrap{
    padding-top: 0;
}

article{
    max-width: 1080px;
    margin: auto;
}
article .Info_Wrap{
    display: flex;
    align-items: center;
    gap: var(--space_4);
    padding-bottom: var(--space_4);
    padding-inline: var(--space_2);
}

article .Document{
    border-top: solid 1px var(--dark);
    border-bottom: solid 1px var(--dark);
    padding: var(--space_4)  var(--space_2);
    margin-bottom: var(--space_4);
}

article .Document p{
    max-width: 900px;
    margin-bottom: var(--space_2);
}

article .Document img{
    max-width: 640px;
    max-height: 640px;
    width: 100%;
    height: auto;
    object-fit: contain;
    margin-bottom: var(--space_2);
    object-position: top left;
}

article .Document ul,
article .Document ol{
    padding-left: var(--space_3);
    margin-bottom: var(--space_3);
    max-width: 900px;
}

article .Document ul li{
    list-style: disc;
}

article .Document ol li{
    list-style: auto;
}

article .Document li::marker{
    color: var(--accent_2);
}
article .Info_Wrap time{
    color: var(--accent_2);
    font-size: var(--font_1);
    font-weight: 700;
}

article .Info_Wrap h3{
    font-size: var(--font_2);
}

@media screen and (max-width: 768px) {
    #News_Article_Wrap{
        padding-bottom: var(--space_8);
        padding-top: 0;
    }
}


/* =================================
*
*   Service Page
*
================================= */

.One_Service_Wrap{
    border: solid 1px var(--accent_2);
    padding: var(--space_4);
    display: flex;
    gap: 8%;
    box-shadow: 0px 3px 6px rgba(0 0 0 / 0.08);
    margin-bottom: var(--space_6);
}

.One_Service_Wrap:last-of-type{
    margin-bottom: 0;
}

.One_Service_Wrap .Text_Wrap{
    width: 50%;
}

.One_Service_Wrap .Text_Wrap h3{
    color: var(--dark);
    font-size: 22px;
    border-bottom: solid 1px var(--accent_1);
    padding: var(--space_1) var(--space_3);
}

.One_Service_Wrap .Text_Wrap p{
    padding: var(--space_3);
}

.One_Service_Wrap .Img_Wrap{
    width: 42%;
    margin-top: calc(var(--space_4) * -2);
}

@media screen and (max-width: 1024px) {
    .One_Service_Wrap{
        gap: 4%;
    }

    .One_Service_Wrap .Text_Wrap{
        width: 50%;
    }

    .One_Service_Wrap .Img_Wrap{
        width: 46%;
    }
}

@media screen and (max-width: 768px) {
    .One_Service_Wrap{
        flex-direction: column-reverse;
    }

    .One_Service_Wrap .Text_Wrap{
        width: 100%;
    }

    .One_Service_Wrap .Img_Wrap{
        width: 100%;
    }

    .One_Service_Wrap .Text_Wrap h3{
        padding: var(--space_3) 0 var(--space_1);
    }

    .One_Service_Wrap .Text_Wrap p{
        padding: var(--space_3) 0;
    }
}

@media screen and (max-width: 540px) {
    .One_Service_Wrap{
        padding: var(--space_3) var(--space_2);
        margin-bottom: var(--space_8);
    }
}
/* =================================
*
*   Contact Page
*
================================= */

.One_Form_Wrap{
    margin-bottom: var(--space_5);
}

.One_Form_Wrap label{
    font-weight: 500;
    font-size: var(--font_3);
    margin-bottom: var(--space_1);
}

.One_Form_Wrap label span{
    color: var(--danger);
    border: solid 1px var(--danger);
    font-size: var(--font_1);
    padding: 1px var(--space_1);
    margin-left: var(--space_1);
}

.One_Form_Wrap input,
.One_Form_Wrap select,
.One_Form_Wrap textarea {
    border: solid 1px var(--accent_2);
    background-color: #ffffff;
    outline: none;
    border-radius: 4px;
}

.One_Form_Wrap input:focus,
.One_Form_Wrap select:focus,
.One_Form_Wrap textarea:focus{
    border: solid 2px var(--accent_2);
    box-shadow: none;
}

.One_Form_Wrap p{
    margin-bottom: var(--space_1);
}

/* .form-check{
    align-items: center;
    display: flex;
    gap: var(--space_1);
}

.form-check label{
    font-size: var(--font_2);
    margin-bottom: 0;
    transform: translateY(2px);
}

.form-check:first-of-type{
    margin-right: var(--space_4);
}

.form-check input{
    width: 24px;
    height: 24px;
    border: solid 2px var(--accent_2);
}

.form-check-input:checked[type=radio]{
    background-color: var(--light);
    border-color: var(--accent_2);
    background-image: none;
    position: relative;
}

.form-check-input:checked[type=radio]::after{
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--accent_2);
    width: 16px;
    height: 16px;
    border-radius: 100%; 
}*/

/* ラジオボタンの横並びラッパー */
.d-flex {
    display: flex;
    gap: var(--space_4);
}

/* ラジオボタンごとのラッパー */
.form-check {
    display: flex;
    align-items: center;
    gap: var(--space_1);
    position: relative;
}

/* ラベル文字のスタイル */
.form-check-label {
    font-size: var(--font_2);
    margin-bottom: 0;
    cursor: pointer;
}

/* ラジオボタン本体 */
.wpcf7-list-item input {
    appearance: none;
    width: 24px;
    height: 24px;
    border: solid 2px var(--accent_2);
    border-radius: 50%;
    position: relative;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    background-color: transparent;
}

.wpcf7-form-control.wpcf7-radio .wpcf7-list-item > label{
    display: flex;
    align-items: center;
    margin-bottom: 0;
}
/* チェックされたときの外枠 */
.wpcf7-list-item input:checked {
    background-color: var(--light);
    border-color: var(--accent_2);
}

/* チェックされたときの内側丸（カスタム） */
.wpcf7-list-item input:checked::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 14px;
    background-color: var(--accent_2);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.wpcf7-list-item-label{
    border: none!important;
    color: var(--dark)!important;
    display: inline-block;
    width: 80px;
    font-size: var(--font_2)!important;
}

.wpcf7-response-output{
    margin: var(--space_4) 0!important;
    border: solid 1px var(--danger)!important;
    color: var(--danger)!important;
    font-weight: 400!important;
    padding: var(--space_4) var(--space_3)!important;
}

.wpcf7-not-valid-tip{
    color: var(--danger)!important;
}

.wpcf7-list-item.first{
    margin-left: 0;
}

.About_Privacy{
    margin-bottom: var(--space_6);
}

.About_Privacy h3{
    font-size: var(--font_2);
}

.About_Privacy p{
    width: 100%;
    max-width: 720px;
    font-size: var(--font_2);
    margin-top: var(--space_1);
    font-weight: 500;
}

.About_Privacy a{
    color: var(--accent_1);
    text-decoration: underline;
}

@media screen and (max-width: 768px) {
    #Contact_Wrap{
        padding-bottom: var(--space_8);
        padding-top: 0;
    }
}

/* =================================
*
*   Thanks Page
*
================================= */

h3.Gr_Text{
    font-size: var(--font_5);
    color: var(--accent_1);
    margin-bottom: var(--space_4);
}

#Thanks_Wrap p{
    margin-bottom: var(--space_6);
}


/* =================================
*
*   Privacy Page
*
================================= */

#Privacy_Wrap{
    padding-top: 0;
}

.One_Privacy_Wrap{
    margin-bottom: var(--space_5);
}

.One_Privacy_Wrap h4{
    color: var(--accent_2);
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font_4);
}

.One_Privacy_Wrap h4 span{
    width: 24px;
    height: 24px;
    border: solid 1px var(--accent_2);
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    display: flex;
    font-size: var(--font_3);
    margin-top: -px;
}

.One_Privacy_Wrap p{
    padding-left: 28px;
}

.One_Privacy_Wrap a{
    color: var(--accent_1);
    text-decoration: underline;
}

@media screen and (max-width: 1200px) {
    #Page_Title_Wrap h2{
        font-size: 80px;
    }

    #Privacy_Wrap{
        padding-top: var(--space_6);
    }
}
@media screen and (max-width: 768px) {
    .One_Privacy_Wrap p{
        padding-left: 0px;
    }

    #Page_Title_Wrap h2{
        font-size: 56px;
    }
}