@charset "UTF-8";
/*
Theme Name: nakamurasyaji
Description: 中村社寺コーポレートサイト
Version: xxx
Author: xxx
*/

/*全体*/
*{
    box-sizing: border-box;
}

body{
    font-family: "Yu Mincho", "YuMincho", serif;
    font-weight:500;
    margin:0;
    padding:0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color:#000000;
    transition:all .8s;
}
a{
    text-decoration: none;
    color:#000000;
}
ul{
    list-style: none;
    padding:0;
    margin:0;
}
img{
    max-width:100%;
    height:auto;
    vertical-align: bottom;
}
section{
    display:block;
}
dl,dt,dd,h1,h2,h3,h4,p,figure{
    margin:0;
}

/*テキストフェードイン*/
.fade-in{
    opacity:0;
    transform:translateY(30px);
}
.fade-in.js-on {
    animation-name: fadeout;
    animation-duration: 1s;
    animation-delay: .5s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    }
    @keyframes fadeout {
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/*ファーストビュー*/
#loading{
    position:fixed;
    inset:0;
    z-index:99999;
    height:100svh;
    background:#123452;
}
.loading_inner{
    width:100%;
    height:inherit;
    display:grid;
    place-content: center;
    row-gap: 10px;
}
.loading_txt{
    font-size:2em;
    font-family: "Yuji Syuku",sans-serif;
    text-align: center;
    color:#fff;
}
.loading_logo {
    margin: 0 auto;
    width: min(200px, 100%);
}

/*ヘッダー*/
.header{
    position:fixed;
    z-index:9999;
    width:100%;
    top:0;
    left:0;
    padding:0 20px;
    transition:all .8s;
}
.header_inner{
    display:flex;
    justify-content: space-between;
    align-items: center;
    height:70px;
}
.gnav_list{
    display:flex;
    align-items: center;
    gap:30px;
}
.gnav_item{
    position:relative;
    transition:all .5s;
}
.gnav_item > a{
    color:#fff;
    line-height: 70px;
}
.gnav:hover .gnav_item {
    opacity: 0.3;
}
.gnav:hover .gnav_item:hover {
    opacity: 1;
}
.gnav_item_contact{
    display:flex;
    align-items: center;
    gap:5px;
}
.gnav_item_contact span{
    color:#fff;
    font-size:1.3em;
}

/*ヘッダー　スクロールで変化*/
.header.scrolled {
    background: rgb(18, 52, 82,0.8);
}
.header.hidden {
    transform:translateY(-100%);
}

/*メガメニュー*/
.mega-menu{
    opacity:0;
    visibility: hidden;
    position:absolute;
    top:100%;
    left:50%;
    transform:translateX(-50%);
    width:360%;
    border:1px solid #fff;
    background:rgba(0,0,0,0.5);
    padding:30px 20px;
    z-index:10;
}
.mega-menu-wrapper{
    display:flex;
    justify-content: center;
    align-items: center;
    gap:35px;
}
.about_viewall{
    border-bottom:1px solid #fff;
    color:#fff;
    display:flex;
    justify-content: space-between;
    width:100%;
    font-size:1em;
}
.about_viewall_arr{
    position:relative;
    width:38px;
    height:20px;
    display:flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}
.about_viewall_arr img{
    width:16px;
    height:16px;
}
.about_viewall_arr::before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width: 8px;
    height:8px;
    border-bottom:1px solid #fff;
    border-left:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
}
.about_viewall_arr::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:8px;
    height:8px;
    border-top:1px solid #fff;
    border-right:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
}
.about_viewall:hover .about_viewall_arr::before,
.about_viewall:hover .about_viewall_arr::after{
    width:100%;
    height:100%;
}

.mega-menu-list{
    display:flex;
    flex-direction: column;
    gap:20px;
}
.mega-menu-item > a{
    display:flex;
    flex-direction: column;
}
.mega-menu-item > a > span{
    color:#fff;
    text-align:right;
}
.mega-menu-img{
    height:100px;
    width:180px;
    overflow: hidden;
}
.mega-menu-img img{
    width:100%;
    height:100%;
    object-fit: cover;
    object-position: center;
    transition:all .5s;
}
.mega-menu-item:hover .mega-menu-img img{
    transform:scale(1.1);
    filter: grayscale(100%);
}
.gnav_item:hover .mega-menu{
    opacity: 1;
    visibility: visible;
    transition:all .5s;
}

/*ハンバーガー*/
.hamburger{
    display:none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width:70px;
    height:70px;
    cursor: pointer;
    z-index:10000;
    position:relative;
    background:transparent;
}
.hamburger span{
    display:inline-block;
    width:50%;
    height:1px;
    background:#fff;
    position:absolute;
    left:50%;
    top:50%;
    transform:translateX(-50%);
    transition:all .8s;
}
.hamburger span:nth-child(1){
    top:40%;
}
.hamburger span:nth-child(2){
    top:60%;
}
.hamburger.active span:nth-child(1) {
    top:50%;
    transform:translateX(-50%) rotate(45deg);
    background:#000;
}
.hamburger.active span:nth-child(2) {
    top:50%;
    transform:translateX(-50%) rotate(-45deg);
    background:#000;
}
#hamburger-window{
    display:flex;
    position:fixed;
    top:0;
    right:0;
    width:60%;
    height:100vh;
    background:#fff;
    z-index:9999;
    align-items: flex-start;
    flex-direction: column;
    overflow-y: auto;
    scrollbar-width: none;
    opacity:0;
    visibility: hidden;
    transition:all .8s;
    transform:translateX(100%);
    padding:80px 40px 70px;
}
.hamburger-window-nav-list{
    display:flex;
    flex-direction: column;
    gap: 30px;
}
.hamburger-window-nav-item > a > p{
    position:relative;
    font-size:1.4em;
}
.hamburger-window-nav-item > a > p::after{
    content:"";
    position:absolute;
    top:-2px;
    width:12px;
    height:12px;
    border-top:3px solid #8A3318;
    border-right:3px solid #8A3318;
    transition:all .5s;
    box-sizing: border-box;
}
.about_option_list{
    display:flex;
    flex-direction: column;
    gap:5px;
    margin-top:10px;
}
.about_option_item a{
    position:relative;
    padding-left:1em;
    font-size:1.1em;
    font-weight:normal;
}
.about_option_item a::before{
    content:"-";
    position:absolute;
    top:0;
    left:0;
}
.ham-btn-list{
    display:flex;
    flex-direction: column;
    gap:15px;
    margin:35px 0;
}
.ham-btn-item a{
    color:#fff;
    transition:all .5s;
}
.ham-contact a{
    background:#333;
    padding:10px 35px;
    height:100%;
    width:100%;
    display:block;
    font-size:1.1em;
}
.ham-recruit a{
    background:#8A3318;
    padding:10px 50px;
    height:100%;
    width:100%;
    display:block;
    font-size:1.1em;
}
.ham-small-list{
    display:flex;
    align-items: center;
    gap:10px;
    margin-bottom:15px;
}
.ham-small-item a{
    font-size:.9em;
    font-weight:normal;
}

/*メインビジュアル*/
.mv_inner{
    position:relative;
}
.mv_video{
    width:100%;
    height:100vh;
}
.mv_video video{
    width:100%;
    height:100%;
    object-fit: cover;
    object-position: center center;
    filter: brightness(70%);
}
.mv_txt{
    position:absolute;
    left:120px;
    bottom:70px;
    font-family: "Yuji Syuku",sans-serif;
    color:#fff;
    font-size:2.5em;
    font-weight:500;
    opacity: 0; 
}

/*お知らせ*/
.top_news{
    padding:150px 40px 50px;
}
.top_news_inner{
    display:flex;
    width:100%;
    max-width:1200px;
    margin:0 auto;
    justify-content: space-between;
}
.top_news_left{
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
}

.ttlArea h4{
    font-size:1.3em;
    padding-right:.5em;
    position:relative;
}
.ttlArea h4::after{
    content:"";
    position:absolute;
    top:-2px;
    width:18px;
    height:18px;
    border-top:3px solid #8A3318;
    border-right:3px solid #8A3318;
    transition:all .5s;
    box-sizing: border-box;
}
 /*ボタン ここから*/
.view_btn{
    position:relative;
    padding:4px;
    box-sizing: border-box;
    transition:all .5s;
    display:inline-block;
}
.view_btn a > p{
    padding:5px 40px;
    color:#123452;
    transition:all .5s;
    font-size:.9em;
}
.view_btn:hover a > p {
    color: #fff;
    background:#123452;
}
.view_btn::before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width: 12px;
    height:12px;
    border-bottom:1px solid #123452;
    border-left:1px solid #123452;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:12px;
    height:12px;
    border-top:1px solid #123452;
    border-right:1px solid #123452;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn:hover::before,
.view_btn:hover::after{
    width:100%;
    height:100%;
}
 /*ボタン ここまで*/

.top_news_cate{
    border:0.5px solid #123452;
    color:#123452;
    padding:1px 3px;
    font-size:.8em;
    text-align: center;
    margin-bottom:10px;
}
.top_news_date{
    font-size:.8em;
}
.top_news_right{
    width:50%;
}
.top_news_item{
    border-top:1px solid #000;
}
.top_news_item:last-of-type{
    border-bottom:1px solid #000;
}
.top_news_item a{
    display:flex;
    align-items: center;
    gap:25px;
    padding:20px 10px;
}
.top_news_item02{
    display:flex;
    align-items: center;
    justify-content: space-between;
    width:100%;
}

.top_news_item_ttl{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width:40ch;
}
.top_news_arr{
    position:relative;
    width:38px;
    height:20px;
    display:flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}
.top_news_arr img{
    width:16px;
    height:16px;
}
.top_news_arr::before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width: 8px;
    height:8px;
    border-bottom:1px solid #123452;
    border-left:1px solid #123452;
    transition:all .5s;
    box-sizing: border-box;
}
.top_news_arr::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:8px;
    height:8px;
    border-top:1px solid #123452;
    border-right:1px solid #123452;
    transition:all .5s;
    box-sizing: border-box;
}
.top_news_item:hover .top_news_arr::before,
.top_news_item:hover .top_news_arr::after{
    width:100%;
    height:100%;
}

/*施工事例*/
.work_pickup{
    padding:100px 0;
}
.ttlArea2{
    text-align: center;
    margin-bottom:50px;
}

.work_pickup_item{
    position:relative;
    height:100vh;
}
.work_pickup_item_inner{
    width:100%;
    height:100dvh;
    position:absolute;
    top:0;
}
.work_pickup_item_img{
    position:relative;
    inset:0;
    height:100%;
    width:100%;
    z-index:0;
    overflow: hidden;
}
.work_pickup_item_img img{
    width:100%;
    height:100%;
    object-fit: cover;
    object-position: center center;
    filter: brightness(50%);
}

.work_pickup_message{
    position:absolute;
    top:50%;
    left:50%;
    text-align:center;
    transform:translate(-50%,-50%);
}
.work_pickup_message > p{
    color:#fff;
    margin-bottom:20px;
}
.work_pickup_info{
    position:absolute;
    top:40px;
    left:40px;
    color:#fff;
}
.info01{
    font-size:.8em;
}
.info03{
    font-size:.7em;
}
.work_pickup_num{
    position:absolute;
    top:40px;
    right:40px;
    color:#fff;
    font-size:.9em;
}

.view_btn2 p{
    padding:5px 40px;
    color:#fff;
    transition:all .5s;
    font-size:.8em;
}
.work_pickup_item a:hover .view_btn2 p {
    color: #000;
    background:#fff;
}
.view_btn2::before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width: 12px;
    height:12px;
    border-bottom:1px solid #fff;
    border-left:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn2::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:12px;
    height:12px;
    border-top:1px solid #fff;
    border-right:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.work_pickup_item a:hover .view_btn2::before,
.work_pickup_item a:hover .view_btn2::after{
    width:100%;
    height:100%;
}

/*中村社寺について*/
.top_about{
    position:relative;
    z-index:5;
    background-image:url(../images/about_bg.jpg);
    background-size:cover;
    background-position: center center;
    padding:150px 0;
}

.top_about_txt_wrapper{
    width:100%;
    max-width:1200px;
    margin:0 auto 70px auto;
    padding:0 40px;
}
.about_ttl{
    margin-bottom:30px;
}
.top_about_txt{
    line-height: 1.7;
    margin-bottom:100px;
}
.top_about_txt span{
    font-size:1.6em;
    color:#333;
}

.top_about_img01{
    width:50%;
    aspect-ratio: 720 / 500;
    overflow: hidden;
}
.top_about_img01 img,
.top_about_img02 img{
    filter: brightness(70%);
    width:100%;
    height:100%;
    object-fit: cover;
}
.top_about_img02{
    width:40%;
    aspect-ratio: 600 / 530;
    position:absolute;
    right:0;
    top:315px;
    overflow: hidden;
}

/*画像パララックス*/
.parallax_imgArea{
    height:60vh;
    background-image:url(../images/parallax.jpg);
    background-size:cover;
    background-position: center center;
    background-attachment: fixed;
    background-repeat:no-repeat;
    overflow: hidden;
}

/*背景色・テキスト色　変更*/
.is-dark-area .bg_change{
    background:#123452;
    color:#fff;
}
.is-dark-area .bg_change *{
    color:#fff !important;
}

/*施工実績*/
.top_work{
    padding:150px 0;
    overflow: hidden;
}
.work_ttl{
    padding-left:10vw;
    display:flex;
    align-items: center;
    gap:40px;
}
.work_ttl h4::after{
    border-top:3px solid #a2a2a2;
    border-right:3px solid #a2a2a2;
}
.top_work_slide{
    position:relative;
    overflow: visible;
    padding-left:10vw;
    margin-top:60px;
}
.swiper{
    overflow: visible;
    width:100%;
}
.top_work_list{
    display:flex;
    width:100%;
    height:100%;
}
.top_work_item{
    width:25vw;
    flex-shrink: 0;
}
.top_work_item:last-child {
    margin-right: 10vw;
}
.top_work_item_img{
    position:relative;
    aspect-ratio: 300 / 350;
}
.top_work_item_img img{
    width:100%;
    height:100%;
    object-fit: cover;
    transition:all .5s;
}
.top_work_item_txt{
    position:absolute;
    top:0;
    display:flex;
    justify-content: space-between;
    width:100%;
    color:#fff;
    padding:20px;
    opacity:0;
    transition:all .5s;
}
.top_work_item_txt01{
    display:flex;
    flex-direction: column;
    gap:5px;
}
.top_work_item_txt02{
    font-size:.8em;
}
.top_work_item:hover .top_work_item_txt {
    opacity: 1; 
}
.top_work_item:hover .top_work_item_img img {
    filter: brightness(70%); 
}

.swiper-button-prev,
.swiper-button-next{
    width:40px;
    height:40px;
    background:#8A3318;
    transition:all .5s;
}
.swiper-button-prev{
    position:absolute;
    left:-20px;
}
.swiper-button-next{
    position:absolute;
    right:5%;
}
.swiper-button-next:after,
.swiper-button-prev:after{
    color:#fff;
    font-size:20px;
}

.view_btn3{
    position:relative;
    width:fit-content;
    margin:60px auto 0 auto;
    display:block;
}
.view_btn3 a > p{
    padding:5px 40px;
    color:#fff;
    transition:all .5s;
    font-size:.8em;
}
.view_btn3:hover a > p{
    color:#000;
    background:#fff;
}
.view_btn3::before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width:12px;
    height:12px;
    border-bottom:1px solid #fff;
    border-left:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn3::after{
    content:"";
    position:absolute;
    bottom:0;
    right:0;
    width:12px;
    height:12px;
    border-top:1px solid #fff;
    border-right:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn3:hover::before,
.view_btn3:hover::after{
    width:100%;
    height:100%;
}

/*伝統の技と匠*/
.top_takumi{
    margin:50px 0 100px;
}
.top_takumi_inner{
    position:relative;
}
.top_takumi_block01{
    display:flex;
    gap:100px;
}
.top_takumi_block01_imgArea{
    position:relative;
    width:40%;
}
.top_takumi_block01_imgArea img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.top_takumi_img01{
    height:100%;
    width:100%;
    overflow: hidden;
    filter: brightness(70%);
    aspect-ratio: 1 / 1;
}
.top_takumi_img_txtArea{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    display:grid;
    grid-template-columns: 1fr auto 1fr;
    grid-template-rows: 1fr auto 1fr;
    line-height: 1;
}
.top_takumi_txt01 {
    grid-area: 1 / 1 / 2 / 2;
    font-size: 1em;
    font-family:"Yuji Syuku",sans-serif;
    font-weight:500;
    font-size:5em;
}
.top_takumi_txt02 {
    grid-area: 2 / 2 / 3 / 3;
    font-size: 0.5em;
    font-size:3em;
    margin-top:0.4em;
}
.top_takumi_txt03 {
    grid-area: 3 / 3 / 4 / 4;
    font-family:"Yuji Syuku",sans-serif;
    font-weight:500;
    font-size:5em;
}

.view_btn4{
    margin-top:50px;
}
.view_btn4 a > p{
    padding:5px 40px;
    color:#fff;
    transition:all .5s;
    font-size:.8em;
}
.view_btn4:hover a > p{
    color:#000;
    background:#fff;
}
.view_btn4::before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width:12px;
    height:12px;
    border-bottom:1px solid #fff;
    border-left:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn4::after{
    content:"";
    position:absolute;
    bottom:0;
    right:0;
    width:12px;
    height:12px;
    border-top:1px solid #fff;
    border-right:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn4:hover::before,
.view_btn4:hover::after{
    width:100%;
    height:100%;
}

.top_takumi_block02{
    padding-right:40px;
}
.top_takumi_block02 h2{
    font-size:2.2em;
    margin-bottom:30px;
}
.top_takumi_img02{
    position:absolute;
    right:0;
    top:400px;
    width:35%;
    overflow: hidden;
}
.top_takumi_img02 img,
.top_takumi_img03 img{
    width:100%;
    height:100%;
    object-fit: cover;
    filter: brightness(70%);
}
.top_takumi_img03{
    margin-left:250px;
    margin-top:200px;
    width:35%;
    overflow: hidden;
}

/*建築工程*/
.top_work-flow{
    margin-bottom:100px;
}
.top_work-flow_inner{
    position:relative;
    z-index:1;
    height:600px;
}
.top_work-flow_inner::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-image:url(../images/bg_work_flow.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center center;
    filter: brightness(70%);
    z-index:-1;
}
.top_work-flow_wrapper{
    position:absolute;
    top:50%;
    left:10%;
    transform:translateY(-50%);
}
.work-flow_ttl h4::after{
    border-top:3px solid #fff;
    border-right:3px solid #fff;
}
.work-flow_txt{
    margin-top:36px;
}

/*企業概要・採用情報*/
.outline{
    display:flex;
    margin-bottom:100px;
}
.top_company,
.recruit{
    position:relative;
    flex:50%;
}
.top_company_img{
    height:100%;
    overflow: hidden;
}
.recruit_img{
    height:100%;
    overflow: hidden;
}
.top_company_img img,
.recruit_img img{
    width:100%;
    height:100%;
    object-fit: cover;
    filter: brightness(70%);
    transition:all .8s;
    transform:scale(1);
}
.top_company a:hover .top_company_img img,
.recruit a:hover .recruit_img img {
    transform: scale(1.1); 
}
.top_company_txt,
.recruit_txt{
    position:absolute;
    bottom:12%;
    left:18%;
}
.top_company_txt h2,
.recruit_txt h2{
    color:#fff;
    font-size:1.8em;
    margin-bottom:15px;
}
.view_btn5 p{
    padding:5px 40px;
    transition:all .5s;
    font-size:.8em;
    color:#fff;
}
.top_company a:hover .view_btn5 p,
.recruit a:hover .view_btn5 p{
    color:#000;
    background:#fff;
}
.view_btn5::before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    width:12px;
    height:12px;
    border-bottom:1px solid #fff;
    border-left:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.view_btn5::after{
    content:"";
    position:absolute;
    bottom:0;
    right:0;
    width:12px;
    height:12px;
    border-top:1px solid #fff;
    border-right:1px solid #fff;
    transition:all .5s;
    box-sizing: border-box;
    pointer-events: none;
}
.top_company a:hover .view_btn5::before,
.top_company a:hover .view_btn5::after,
.recruit a:hover .view_btn5::before,
.recruit a:hover .view_btn5::after{
    width:100%;
    height:100%;
}

/*フッター*/
.footer{
    padding:120px 0;
    position:relative;
    z-index:1;
    background:#123452;
    color:#fff;
}
.footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/bg_footer.png);
    background-repeat: no-repeat;
    background-size:auto 100%;
    opacity: 0.15; 
    z-index: -1; 
}
.footer_inner{
    display:flex;
    justify-content: space-between;
    padding:0 80px;
}
.footer_left{
    display:flex;
    flex-direction: column;
}
.footer_logo{
    margin-bottom:30px;
}
.footer_add01{
    font-size:1.1em;
}
.footer_add02{
    margin-bottom:30px;
}
.footer_right{
    display:flex;
    flex-direction: column;
    align-items: flex-end;
    gap:20px;
}
.f_btnArea{
    display:flex;
    align-items: center;
    gap:30px;
}
.f_contact a{
    background:#333;
    padding:10px 35px;
    height:100%;
    width:100%;
    display:block;
    font-size:1.1em;
}
.f_recruit a{
    background:#8A3318;
    padding:10px 50px;
    height:100%;
    width:100%;
    display:block;
    font-size:1.1em;
}
.f_contact a,
.f_recruit a{
    color:#fff;
    transition:all .5s;
}
.f_contact a:hover,
.f_recruit a:hover{
    background:#fff;
    color:#000;
}

.f_gnav_list{
    display:flex;
    gap:30px;
}
.f_gnav_item{
    display:flex;
    flex-direction: column;
    gap:5px;
}
.f_gnav_item a{
    color:#fff;
    transition:all .5s;
}
.f_gnav_item a:hover{
    opacity:0.5;
}
.f_gnav_sub{
    position:relative;
    padding-left:1em;
    font-weight:normal;
    font-size:.9em;
    transition:all .5s;
    width:fit-content;
}
.f_gnav_sub::before{
    content:"-";
    position:absolute;
    left:0;
    top:0;
}
.f_gnav_sub:hover{
    opacity:0.5;
}

.pagetop_txt{
    font-size:.8em;
    display:block;
    color:#fff;
    transition:all .5s;
}
.pagetop_txt::after {
    content: "\f062";
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    margin-left: 5px;
    font-size: 1em;
}
.pagetop_txt:hover{
    opacity:0.5;
}

.footer_small{
    font-size:.8em;
    font-weight:normal;
}
.f_small_link_item a{
    color:#fff;
    transition:all .5s;
}
.f_small_link_item a:hover{
    opacity:0.5;
}
.f_small_link_list{
    display:flex;
    gap:30px;
}

/*
下層ページ
*/

/*共通部分*/
/*ローディング*/
.loader_container{
    position:fixed;
    inset:0;
    z-index:99999;
    background:#123452;
    transition:all .8s;
}
.loader {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width: 40px;
    aspect-ratio: 1;
    background: #8A3318;
    clip-path: polygon(0 0,100% 0,100% 100%);
    animation: l2 2s infinite cubic-bezier(0.3,1,0,1);
}
@keyframes l2 {
    25%  {clip-path: polygon(0    0,100% 0   ,0 100%)}
    50%  {clip-path: polygon(0    0,100% 100%,0 100%)}
    75%  {clip-path: polygon(100% 0,100% 100%,0 100%)}
    100% {clip-path: polygon(100% 0,100% 100%,0 0   )}
}
.fade-out{
    opacity:0;
    visibility: hidden;
}

/*中村社寺について*/
.bg_fixed{
    padding:0 40px;
}
.bg_fixed_inner{
    position:relative;
}
.bg_fixed_img{
    width:100%;
    height:100vh;
    position:fixed;
    top:0;
    left:0;
    z-index:-1;
}
.bg_fixed_img img{
    width:100%;
    height:100%;
    object-fit: cover;
    filter: brightness(50%);
}
.main_ttl{
    height:100vh;
    display:flex;
    justify-content: center;
    align-items: center;
    color:#fff;
    font-size:2.3em;
}
.about_txt_container{
    color:#fff;
    max-width:1200px;
    margin:0 auto;
}
.about_txt_block01{
    display:flex;
    justify-content: space-between;
    margin:50vh 0;
}
.about_txt_block01 > h2{
    writing-mode: vertical-lr;
    font-size:2em;
    letter-spacing: 0.1em;
}
.about_feeling{
    width:40%;
}
.about_feeling h3{
    font-size:1.6em;
    margin-bottom:60px;
}
.about_feeling h4{
    font-size:1.4em;
    margin-bottom:40px;
}
.about_feeling p{
    line-height: 2;
}

.about_txt_block02{
    padding-bottom:180px;
    width:70%;
    margin:0 auto;
}
.about_txt_block02 h3{
    font-size:1.6em;
    text-align: center;
    margin-bottom:80px;
}
.about_greeting h4{
    font-size:1.4em;
    text-align: center;
    margin-bottom:30px;
}
.about_greeting p{
    line-height: 2;
}
.pre_name{
    text-align: right;
    margin-top:30px;
}

.img_loop{
    background:#fff;
    overflow: hidden;
    padding:100px 0;
}
.img_loop_wrapper{
    transition-timing-function: linear !important;
}

.about_content{
    background:#fff;
    padding:100px 0;
}
.about_content_inner > h3{
    max-width:1200px;
    margin:0 auto 50px auto;
    font-size:1.6em;
    padding:0 40px;
}
.about_content_list{
    display:flex;
    flex-direction: column;
    gap:100px;
}
.about_content_item{
    display:flex;
    align-items: flex-start;
    gap:60px;
}
.about_content_item2{
    display:flex;
    flex-direction: row-reverse;
    gap:60px;
}
.about_content_item_img{
    overflow: hidden;
    width:50%;
    height:600px;
}
.about_content_item_img img{
    width:100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(70%);
}
.about_content_item_txt{
    width:40%;
}
.about_content_item_ttl{
    font-size:1.3em;
    display:flex;
    align-items: center;
    gap: 30px;
}
.about_content_item_ttl span{
    color:#fff;
    background:#123452;
    border-radius: 50%;
    padding:8px 19px;
}
.about_content_item_detail{
    margin-top:50px;
    line-height: 2;
}

/*再生事例*/
.about_saisei_wrapper{
    background:rgba(162, 162, 162,0.2);
    padding:40px;
    border-radius:20px;
    max-width:1200px;
    margin:0 auto;
    position:relative;
}
.about_saisei_wrapper > h3{
    text-align:center;
    margin-bottom:40px;
    font-size:1.3em;
    border-bottom:1px solid #000;
}
.content_wrapper{
    max-height:450px;
    overflow: hidden;
}
.about_saisei_wrapper.saisei-open .content_wrapper{
    max-height:100%;
}
.toggle-button{
    display:block;
    margin:20px auto 0;
    padding:10px 30px;
    background:#123452;
    color:#fff;
    cursor: pointer;
    border:none;
    font-size:1em;
    letter-spacing: 0.05em;
    font-family: "Yu Mincho", "YuMincho", serif;
}

.about_saisei_list{
    display:flex;
    flex-direction: column;
    max-width:1200px;
    margin:0 auto;
    gap:50px;
}
.about_saisei_item{
    display:flex;
    flex-direction: column;
    gap:20px;
}
.about_saisei_item > h4{
    font-size:1.3em;
}
.about_saisei_content{
    display:flex;
    flex-direction: column;
    gap:25px;
}
.about_saisei_txt{
    line-height: 2;
}

.about_saisei_imgArea{
    display:flex;
    justify-content: center;
    gap:50px;
}
.about_saisei_img_content{
    position:relative;
}
.before{
    position:absolute;
    top:0;
    left:0;
    background:#123452;
    color:#fff;
    padding:5px 15px;
    letter-spacing: 0.1em;
}
.after{
    position:absolute;
    top:0;
    left:0;
    background:#8A3318;
    color:#fff;
    padding:5px 15px;
    letter-spacing: 0.1em;
}
.about_saisei_img{
    aspect-ratio: 4 / 3;
    max-width:400px;
}
.about_saisei_img img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.about_saisei_img_content2{
    position:relative;
}
.about_saisei_img_content2::before{
    content:"";
    position:absolute;
    top:50%;
    left:-45px;
    transform:translateY(-50%) rotate(-90deg);
    border-top:25px solid #123452;
    border-right:25px solid transparent;
    border-left:25px solid transparent;
}
/*再生事例　ここまで*/

.outline2{
    margin-bottom:0 !important;
}

/*伝統の技と匠*/
.dentou{
    background:#123452;
    position:relative;
}
.dentou_inner{
    padding:180px 0;
}
.dentou_txtArea{
    max-width:45%;
    margin:0 auto;
    color:#fff;
    height:60vh;
}
.dentou_txtArea h1{
    font-size:2.5em;
    margin-bottom:50px;
}
.dentou_txtArea p{
    line-height: 3;
}

.dentou_leftbox{
    position:absolute;
    left:0;
    top:10%;
    width:22%;
}
.dentou_rightbox{
    position:absolute;
    right:0;
    top:10%;
}
.dentou_img{
    filter: brightness(70%);
}
.leftimg1{
    max-width:240px;
    aspect-ratio: 1 / 1;
}
.leftimg2{
    max-width:190px;
    aspect-ratio: 1 / 1;
    margin:30px 0 30px 80px;
}
.leftimg3{
    max-width:200px;
    aspect-ratio: 1 / 1;
}
.rightimg1{
    max-width:200px;
    aspect-ratio: 1 / 1;
    margin-left:80px;
}
.rightimg2{
    max-width:240px;
    aspect-ratio: 3 / 4;
    margin:30px 0 60px 0;
    position:relative;
    z-index:1;
}
.rightimg3{
    max-width:200px;
    aspect-ratio: 1 / 1;
    margin-left:80px;
}
.leftimg1 img,
.leftimg2 img,
.leftimg3 img,
.rightimg1 img,
.rightimg2 img,
.rightimg3 img,
.bottomimg1 img,
.bottomimg2 img,
.bottomimg3 img{
    width:100%;
    height:100%;
    object-fit: cover;
}

.dentou_bottombox{
    position:relative;
    margin:0 auto 300px auto;
    max-width: 50%;
}
.bottomimg1{
    max-width:300px;
    aspect-ratio: 300 / 200;
    position:absolute;
    top:50px;
    left:0;
    z-index:2;
    width:45%;
}
.bottomimg2{
    max-width:400px;
    aspect-ratio: 4 / 3;
    position:absolute;
    left:50%;
    top:-80px;
    transform:translateX(-50%);
}
.bottomimg3{
    max-width:300px;
    aspect-ratio: 300 / 200;
    position:absolute;
    top:50px;
    right:0;
    z-index:2;
    width: 45%;
}

.sekou{
    background:#123452;
    color:#fff;
}
.sekou_inner{
    max-width:1200px;
    margin:0 auto;
    padding:0 40px;
}
.sekou_inner > h3{
    font-size:1.6em;
    margin-bottom:50px;
}
.sekou_list{
    display:flex;
    flex-direction: column;
    gap:70px;
}
.sekou_item{
    display:flex;
    gap:50px;
}
.sekou_item2{
    display:flex;
    flex-direction: row-reverse;
    gap:50px;
}
.sekou_img{
    max-width:600px;
    aspect-ratio: 6 / 5;
    flex:50%;
    overflow: hidden;
}
.sekou_img img{
    width:100%;
    height:100%;
    object-fit: cover;
    filter: brightness(80%);
}
.sekou_txt{
    flex:50%;
}
.sekou_txt_ttl{
    font-size:1.3em;
    display:flex;
    align-items: center;
    gap:30px;
}
.sekou_txt_ttl span{
    color:#123452;
    background:#fff;
    border-radius: 50%;
    padding:8px 19px;
}
.sekou_txt_detail{
    margin-top:50px;
    line-height: 2;
}

.total{
    background:#123452;
    color:#fff;
}
.total_inner{
    max-width:950px;
    margin:0 auto;
    padding:150px 40px;
}
.total_inner h3{
    text-align: center;
    font-size:1.6em;
    margin-bottom:40px;
}
.total_inner h4{
    text-align: center;
    font-size:1.4em;
    margin-bottom:40px;
}
.total_item{
    display:flex;
    align-items: center;
    justify-content: center;
    gap:100px;
}
.total_icon{
    border:1px solid #fff;
    padding:60px;
    max-width:245px;
    aspect-ratio: 1 / 1;
}
.total_txt{
    width:50%;
    line-height: 2;
}

.quality{
    background:#123452;
    color:#fff;
    padding-bottom:100px;
}
.quality_inner{
    position:relative;
}
.quality_bg{
    width:100%;
    height:700px;
    overflow: hidden;
}
.quality_bg img{
    width:100%;
    height:100%;
    object-fit: cover;
    filter: brightness(50%);
}
.quality_txt{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}
.quality_txt h3{
    text-align: center;
    font-size:1.6em;
    margin-bottom:40px;
}
.quality_txt h4{
    text-align: center;
    font-size:1.4em;
    margin-bottom:40px;
}
.quality_txt p{
    line-height: 2;
}

/*企業概要*/
.main_ttl2{
    background:#123452;
    height:330px;
    position: relative;
}
.main_ttl2::before{
    content:"";
    position:absolute;
    bottom:0;
    right:0;
    width:100%;
    height:100%;
    background-image:url(../images/company/ttl_bg.png);
    background-repeat:no-repeat;
    background-position: top right;
    opacity:0.3;
}
.main_ttl2_inner h2{
    position:absolute;
    top:50%;
    left:5em;
    font-size:2em;
    color:#fff;
}

.page_link{
    max-width:1200px;
    margin:0 auto;
}
.page_link_inner{
    padding:50px 40px;
}
.page_link_list{
    display:flex;
    align-items: center;
    justify-content: center;
    gap:100px;
}

.page_link_item{
    width:100%;
    max-width:240px;
    height:65px;
}
.page_link_item a{
    position:relative;
    border:1px solid #123452;
    color:#123452;
    display:block;
    width:100%;
    height:100%;
    padding:20px 40px;
    transition:all .5s;
}
.page_link_item a::after{
    content:"";
    position:absolute;
    top:38%;
    right:24px;
    width: 16px;
    height:16px;
    background-image:url(../images/company/arrow-down.svg);
    background-repeat:no-repeat;
    transition:all .5s;
}
.page_link_item a:hover::after{
    transform:translateY(5px);
}

.company01{
    padding:100px 40px;
}
.company01_inner{
    max-width:1200px;
    margin:0 auto;
}
.company01_inner > h3{
    font-size:1.6em;
    margin-bottom:50px;
}
.company_profile{
    max-width:1000px;
    margin:0 auto 50px auto;
}
.company_profile_item{
    display:flex;
    border-top:1px solid #123452;
    border-bottom:1px solid #123452;
    margin-bottom:-1px;
    padding:30px 0 30px 1em;
}
.company_profile_item dt{
    width:30%;
    line-height: 2;
}
.company_profile_item dd{
    line-height: 2;
    font-weight:normal;
}
.company_profile_item dd > span{
    font-weight:500;
}

.access_add{
    font-weight:normal;
}

.company02{
    padding:100px 40px;
}
.company02_inner{
    max-width:1200px;
    margin:0 auto;
}
.company02_inner > h3{
    font-size:1.6em;
    margin-bottom:50px;
}
.group_list_wrapper{
    max-width:1000px;
    margin:0 auto;
}
.group_list_wrapper > h4{
    font-weight:normal;
    font-size:1.4em;
    text-align: center;
    margin-top:70px;
    margin-bottom:30px;
}

.group_list01{
    display:flex;
    justify-content: center;
}
.group_item01{
    text-align: center;
    border:1px solid #6e6e6e;
}
.group_item01 a{
    padding:20px;
    display:block;
    transition:all .5s;
}
.group_item01 a:hover{
    opacity:0.5;
}
.group_list02{
    display:grid;
    grid-template-columns: repeat(2,1fr);
    row-gap:25px;
    column-gap:45px;
}
.group_item02{
    border:1px solid #6e6e6e;
    height:150px;
}
.group_item02 a{
    display:flex;
    align-items: center;
    gap:30px;
    height:100%;
    padding:20px;
    transition:all .5s;
}
.group_item02 a:hover{
    opacity:0.5;
}

.group_img img{
    height:auto;
    width:80px;
    aspect-ratio: 1 / 1;
}
.group_nameArea{
    display:flex;
    flex-direction: column;
    gap:10px;
    width:80%;
}
.group_name{
    font-size:1.1em;
}
.group_txt{
    font-size:.8em;
}
.no_link{
    display:flex;
    align-items: center;
    height:100%;
    padding:20px;
    gap:30px;
}

.company03{
    padding:100px 40px;
}
.company03_inner{
    max-width:1200px;
    margin:0 auto;
}
.company03_inner > h3{
    font-size:1.6em;
    margin-bottom:50px;
}
.company03_ttl{
    border-bottom:1px solid #000;
}
.company03_ttl h4{
    font-size:1.4em;
}
.company03_txt{
    line-height: 2;
    margin-top:20px;
    font-weight:normal;
}
.company03_txt > span{
    font-size:1.2em;
    font-weight:500;
}
.company03_block{
    margin:50px 0;
}
.company03_block > h4{
    font-size:1.4em;
    color:#123452;
    border:1px solid #123452;
    padding:5px 15px;
    width: max-content;
}
.company03_list{
    margin:20px 0;
}
.company03_item{
    position:relative;
    padding-left:1em;
}
.company03_item::before{
    content:"";
    position:absolute;
    top:50%;
    left:0;
    transform:translateY(-50%);
    width:8px;
    height:8px;
    border-radius:50%;
    background:#000;
}
.company03_imgArea{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
}
.company03_img{
    width:100%;
    max-width:180px;
    aspect-ratio: 1 / 1;
}
.company03_img img{
    width:100%;
    height:100%;
    object-fit: cover;
}

/*歴史/沿革*/
.main_ttl3{
    background:#123452;
    height:330px;
    position: relative;
}
.main_ttl3::before{
    content:"";
    position:absolute;
    bottom:0;
    right:0;
    width:100%;
    height:100%;
    background-image:url(../images/history/ttl_bg.png);
    background-repeat:no-repeat;
    background-position: top right;
    opacity:0.3;
}
.main_ttl3_inner h2{
    position:absolute;
    top:50%;
    left:5em;
    font-size:2em;
    color:#fff;
}
.history_wrapper{
    position:relative;
}
.history_wrapper::before{
    content:"";
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-image:url(../images/history/history_bg.webp);
    background-position:center center;
    opacity:0.3;
    z-index:-1;
}

.history_message{
    padding:100px 40px;
    text-align: center;
}

/*画像ループ*/
.img_loop2{
    overflow: hidden;
}
.img_loop_slide2{
    aspect-ratio: 4 / 3;
}
.img_loop_slide2 img{
    width:100%;
    height:100%;
    object-fit: cover;
    filter: brightness(70%);
}
/*画像ループ　ここまで*/

.history_list{
    max-width:1200px;
    margin:0 auto;
    padding:100px 40px;
}
.history_item{
    position:relative;
    margin-left:1em;
    padding-left:8em;
    padding-bottom:70px;
    display:flex;
    gap:130px;
    border-left:25px solid #123452;
}
.history_item::before{
    content:"";
    position:absolute;
    top:14px;
    left:0;
    width:100%;
    max-width:100px;
    height:1px;
    background:#123452;
}
.history_item::after{
    content:"";
    position:absolute;
    top:5px;
    left:-21px;
    display:block;
    box-sizing: initial;
    width:12px;
    height:12px;
    border-radius:50%;
    background:transparent;
    border:3px solid #fff;
}
.history_item:last-of-type{
    padding-bottom:0;
}
.history_year{
    font-family: 'Yu Gothic',sans-serif;
    font-size:2.4em;
    font-weight:bold;
    color:#123452;
    line-height: 1;
}
.history_year .wareki{
    display:block;
    font-size:.4em;
    color:#000;
    margin-top:4px;
}
.history_item > div{
    display:flex;
    justify-content: space-between;
    align-items: flex-start;
    width:100%;
    gap:50px;
}
.history_item_txtArea{
    width:60%;
}
.history_month{
    color:#6e6e6e;
    font-size:1.1em;
}
.history_txt ul li{
    position:relative;
    padding-left:1em;
}
.history_txt ul li::before{
    content:"・";
    position:absolute;
    top:0;
    left:0;
}
.history_item_img{
    width:100%;
    max-width:240px;
    aspect-ratio: 240 / 180;
}
.history_item_img img{
    width:100%;
    height:100%;
    object-fit: cover;
    filter: brightness(70%);
}

/*施工実績*/
.main_ttl4{
    background:#123452;
    height:330px;
    position: relative;
}
.main_ttl4::before{
    content:"";
    position:absolute;
    bottom:0;
    right:0;
    width:100%;
    height:100%;
    background-image:url(../images/work/ttl_bg.png);
    background-repeat:no-repeat;
    background-position: top right;
    opacity:0.3;
}
.main_ttl4_inner h2{
    position:absolute;
    top:50%;
    left:5em;
    font-size:2em;
    color:#fff;
}

.search_wrapper{
    max-width:1200px;
    margin:0 auto;
    padding:100px 40px;
}
.search_inner{
    border:1px solid #123452;
}
.search_list{
    display:grid;
    grid-template-columns: repeat(3,1fr);
    justify-content: center;
    gap:30px;
    margin-bottom:50px;
}
.search_box{
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    gap:5px;
}
.select_wrapper{
    position:relative;
    background:#fff;
    border:1px solid #123452;
    overflow: hidden;
    width:100%;
}
.select_wrapper::after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    width:50px;
    height:100%;
    background:#123452;
    background-image:url(../images/work/search-down.svg);
    background-repeat:no-repeat;
    background-position:center center;
    background-size:18px 18px;
    pointer-events: none;
}
.select01,
.select02,
.select03,
.select04{
    padding:15px 15px 15px 1em;
    width:100%;
    height:100%;
    border:none;
    background:transparent;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance: none;
    cursor: pointer;
    font-size:1em;
    font-family:"Yu Mincho", "YuMincho", serif;
    font-weight:500;
    color:#000;
}
.js-accordion-content{
    display:none;
    margin:60px 0;
    padding:0 3em;
    text-align: center;
}
.search_header{
    display:flex;
    align-items: center;
    cursor: pointer;
    font-size:1.2em;
    padding:20px 3em;
    position:relative;
    gap:8px;
}
.search_icon{
    display:flex;
}
.toggle_icon{
    position:absolute;
    right:0;
    display:block;
    height:100%;
    aspect-ratio: 1 / 1;
    background:#123452;
    flex-shrink: 0;
}
.toggle_icon::before,
.toggle_icon::after{
    content:"";
    position:absolute;
    background:#fff;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
}
.toggle_icon::before{
    width:1px;
    height:30px;
}
.toggle_icon::after{
    width:30px;
    height:1px;
}
.js-accordion-trigger.js-open .toggle_icon::before{
    opacity:0;
}

.search_btn_wrapper{
    display:inline-flex;
    flex-direction: column;
    gap:25px;
}
.search_btn{
    border:none;
    color:#fff;
    background:#123452;
    padding:16px 35px;
    cursor: pointer;
    font-size:1em;
    font-weight:500;
    font-family:"Yu Mincho", "YuMincho", serif;
}
.reset_btn{
    border:none;
    background:none;
    color:#333;
    text-decoration: underline;
    cursor: pointer;
    font-family:"Yu Mincho", "YuMincho", serif;
    font-weight:500;
    font-size:.9em;
}

.work_list{
    display:grid;
    grid-template-columns: repeat(3,1fr);
    width:100%;
    row-gap:50px;
}
.work_item:hover .work_item_img img{
    transform:scale(1.1);
    filter: brightness(70%);
}
.work_item_img{
    width:100%;
    aspect-ratio: 480 / 395;
    overflow: hidden;
}
.work_item_img img{
    width:100%;
    height:100%;
    object-fit: cover;
    transform:scale(1);
    transition:all .8s;
}
.work_item_txtArea{
    display:flex;
    justify-content: space-between;
    padding:10px 30px;
}
.work_item_txt01{
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    gap:5px;
}
.work_item_txt02{
    display:flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    gap:5px;
}
.work_item_sect{
    font-size:.8em;
    font-weight:normal;
}
.build_name{
    font-size:1.1em;
}
.work_item_structure{
    font-size:.85em;
    color:#123452;
    border:1px solid #123452;
    padding:3px 10px;
    text-align: center;
    font-weight:normal;
}
.work_item_area{
    font-weight:normal;
}

/*ページネーション*/
.pagenation{
    padding:100px 0;
    max-width:1200px;
    margin:0 auto;
    text-align: center;
    display:flex;
    align-items: center;
    justify-content: center;
    gap:20px;
}

.no-work {
    text-align: center;
    padding: 60px 0;
}
/*絞り込みレイアウト*/
.searchandfilter label {
    display: none;
}
.searchandfilter li:nth-child(1)::before {
    content: "構造/種別から探す";
    display: block;
    margin-bottom: 8px;
    text-align: left;
}
.searchandfilter li:nth-child(2)::before {
    content: "エリア別にみる";
    display: block;
    margin-bottom: 8px;
    text-align: left;
}
.searchandfilter li:nth-child(3)::before {
    content: "アーカイブをみる";
    display: block;
    margin-bottom: 8px;
    text-align: left;
}
.searchandfilter input[type="submit"]{
    border:none;
    color:#fff;
    background:#123452;
    padding:16px 35px;
    cursor: pointer;
    font-size:1em;
    font-weight:500;
    font-family:"Yu Mincho", "YuMincho", serif;
}
.searchandfilter ul {
    width:100%;
    flex-wrap: wrap;
    display:flex !important;
    justify-content: space-between;
}
.searchandfilter li {
    position:relative;
    width:30%;
    padding-right:0 !important;
}
.searchandfilter li:last-child {
    flex: 0 0 100%;
    display: flex;
    justify-content: center;
    margin-top: 40px;
}
.searchandfilter li::after {
    content: "";
    position: absolute;
    top: calc(100% - 56px);
    right: 0;
    width: 56px;
    aspect-ratio: 1 / 1;
    background: #123452;
    background-image: url(../images/work/search-down.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 18px 18px;
    pointer-events: none;
}
.searchandfilter li:last-child::after{
    content:none;
}
.searchandfilter select {
    padding: 0 56px 0 16px;
    width: 100%;
    height:56px;
    border: 1px solid #000;
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    font-size: 1em;
    font-family: "Yu Mincho", "YuMincho", serif;
    font-weight: 500;
    color: #000;
}


/*施工実績　詳細*/
.work_single{
    padding:100px 40px;
}
.work_single_inner{
    width:100%;
    max-width:1200px;
    margin:0 auto;
}
.work_single_inner > h1{
    text-align: center;
    margin-bottom:70px;
}
.work_single_img{
    max-width:1200px;
    width:100%;
    aspect-ratio: 1200 / 750;
}
.work_single_img img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.work_single_detail{
    max-width:700px;
    width:100%;
    margin:70px auto;
}
.work_single_detail_item{
    display:flex;
    border-top:1px solid #123452;
    border-bottom:1px solid #123452;
    margin-bottom:-1px;
    padding:25px;
}
.work_single_detail_ttl{
    width:20%;
    font-size:1.1em;
}
.work_single_detail_txt{
    font-weight:normal;
    font-size:1.1em;
}
.work_single_concept h3{
    font-size:1.4em;
    margin-bottom:20px;
}
.work_single_concept p{
    font-weight:normal;
    line-height: 2;
}


.work_single_slide{
    max-width:900px;
    width:100%;
    margin:0 auto;
}
.work_single_slide_wrapper{
    overflow: hidden;
    position:relative;
    width:100%;
    aspect-ratio: 4 / 3;
}
.work_single_slide_img img{
    width:100%;
    height:100%;
    object-fit: cover;
}

.slider_thumbnail{
    max-width:900px;
    width:100%;
    margin:30px auto 0;
    padding:0 20px;
}
.work_single_thumbnail_wrapper{
    display:grid;
    grid-template-columns: repeat(5,1fr);
    row-gap:10px;
}
.slider_thumbnail .work_single_thumbnail_img {
    opacity: .5;
    transition: all .5s;
    width:100%;
    aspect-ratio: 145 / 96;
    cursor: pointer;
}
.work_single_thumbnail_img img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.slider_thumbnail .swiper-slide.swiper-slide-thumb-active {
    opacity: 1;
}
.lightbox_comment{
    font-size:.9em;
    margin-top:10px;
}

.work_view{
    padding:120px 40px;
    text-align: center;
}
.work_view_inner{
    display:flex;
    align-items: center;
    justify-content: space-between;
    max-width:1200px;
    margin:0 auto 20px auto;
}

.fade-in-blur{
    opacity:0;
    filter: blur(10px);
    transition:all .8s;
}
.fade-in-blur.is-visible{
    opacity:1;
    filter: blur(0);
}

/*建築工程*/

.bg_wh{
    background:#fff;
}
.wf_message{
    padding:120px 40px;
}
.wf_message h2{
    font-size:2em;
    text-align: center;
}
.work-flow_container{
    position:relative;
}
.work-flow_inner{
    background:linear-gradient(
        -120deg,
        #123452 0%,
        #144d7f 50%,
        #1666ad 80%
    );
}
.work-flow_inner h2{
    position:absolute;
    top:20%;
    left:100px;
    color:#fff;
    font-size:1.6em;
}
.flow_list{
    position:relative;
    min-height:875px;
    overflow: hidden;
}
.flow_list::before{
    content:"";
    position:absolute;
    top:50%;
    left:-330px;
    width:1150px;
    height:1000px;
    transform:translateY(-50%);
    border:1px solid #fff;
    border-left:none;
    border-radius:50%;
    z-index:0;
}
.flow_step{
    display:flex;
    align-items: center;
    position:absolute;
    left:685px;
    top:120px;
    gap:60px;
}
.flow02{
    top:270px;
    left:765px;
}
.flow03{
    top:420px;
    left:790px;
}
.flow04{
    top:570px;
    left:765px;
}
.flow05{
    top:720px;
    left:670px;
}
.flow_num{
    width:60px;
    height:60px;
    background:#fff;
    border-radius:50%;
    display:flex;
    align-items: center;
    justify-content: center;
    font-size:1.4em;
    color:#123452;
}
.flow_content{
    background:#fff;
    padding:15px 30px;
    display:flex;
    align-items: center;
    gap:15px;
    font-size:1.1em;
    color:#123452;
}

.step_container{
    padding:120px 40px;
}
.step_inner{
    max-width:1200px;
    margin:0 auto;
}
.after-care{
    max-width:900px;
    margin:0 auto 100px;
}
.after-care h2{
    margin-bottom:50px;
    text-align:center;
    font-size:1.8em;
}
.after-care p{
    line-height: 2;
}

.step_list{
    display:flex;
    flex-direction: column;
    gap:80px;
}
.step_item{
    display:flex;
    align-items: center;
    justify-content: space-between;
    position:relative;
    border:1px solid #123452;
    padding:30px 60px 30px 0;
}
.step_item h2{
    display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position:absolute;
    width:160px;
    height:100%;
    background:#123452;
    color:#fff;
}
.step_item h2::before{
    content:"";
    position:absolute;
    top:100%;
    left:0;
    border-top:50px solid #123452;
    border-right:75px solid transparent;
    border-left:85px solid transparent;
}
.step_item_last::before {
    content: none !important;
}
.step_content_wrapper{
    display:flex;
    align-items: center;
    justify-content: space-between;
}
.step_content{
    padding-left:200px;
    width:60%;
}
.step_content h3{
    font-size:1.5em;
    margin-bottom:60px;
}
.step_content p{
    line-height: 2;
}
.step_img{
    max-width:340px;
    aspect-ratio: 340 / 320;
}
.step_img img{
    width:100%;
    height:100%;
    object-fit: cover;
}

/*お問い合わせ*/
.main_ttl5{
    background:#123452;
    height:330px;
    position:relative;
}
.main_ttl5_inner h2{
    position:absolute;
    top:50%;
    left:5em;
    font-size:2em;
    color:#fff;
}
.contact{
    padding:100px 40px;
}
.contact_inner{
    max-width:910px;
    margin-inline:auto;
}
.contact_info01{
    line-height: 2;
    max-width:500px;
    margin:0 auto 20px auto;
}
.contact_info02{
    max-width:500px;
    margin:0 auto 80px auto;
}
.link_blank{
    color:#8A3318;
    text-decoration: underline;
    transition:all .5s;
}
.link_blank:hover{
    opacity:.5;
    text-decoration: none;
}
.contact_telbox{
    background:#fff;
    border:2px solid #123452;
    color:#123452;
    padding:15px 40px;
    width:max-content;
    margin:0 auto;
    text-align: center;
}
.contact_telbox > dl{
    display:flex;
    gap:10px;
    align-items: center;
    justify-content: center;
}
.contact_telbox > dl dd{
    font-size:2.2em;
}

#contactForm{
    margin-top:80px;
}
.mail_form_item{
    display:flex;
    border-top:1px solid #000;
    border-bottom:1px solid #000;
    padding:30px 0;
    margin-bottom:-1px;
}
.mail_form_item > dt{
    width:40%;
}
.mail_form_item > dd{
    width:60%;
}
.grid{
    display:flex;
    gap:20px;
}
.checkbox{
    position:absolute;
    opacity:0;
    width:0;
    height:0;
}
.label{
    display:flex;
    align-items: center;
    cursor: pointer;
    position:relative;
    padding-left:25px;
}
.agree_btn{
    position:relative;
    padding-left:25px;
    cursor: pointer;
}
.label::before,
.agree_btn::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    transform:translateY(-50%);
    width:18px;
    height:18px;
    border:1px solid #123452;
    background:#fff;
    transition:all .5s;
}
.label::after,
.agree_btn::after{
    content:"";
    position:absolute;
    left:7px;
    top:50%;
    transform:translateY(-50%) rotate(45deg);
    width:3px;
    height:5px;
    border:solid #fff;
    border-width:0 2px 2px 0;
    opacity:0;
    transition:all .5s;
}
.label:has(.checkbox:checked)::before,
.agree_btn:has(.checkbox:checked)::before{
    background: #123452;
}
.label:has(.checkbox:checked)::after,
.agree_btn:has(.checkbox:checked)::after{
    opacity:1;
}
.form_text{
    width:100%;
    padding:10px;
    font-size:1em;
    font-family:"Yu Mincho", "YuMincho", serif;
    border:1px solid #123452;
}
.form_text2{
    width:50%;
    padding:10px;
    font-size:1em;
    font-family:"Yu Mincho", "YuMincho", serif;
    border:1px solid #123452;
}
.form_required{
    background:#8A3318;
    color:#fff;
    padding:2px 5px;
    font-size:.9em;
    margin-left:5px;
    margin-right:15px;
}
.add_box{
    display:flex;
    flex-direction: column;
    gap:10px;
    width:60%;
}

.mail_form_item2{
    border-bottom:1px solid #000;
    padding:30px 0;
}
.mail_form_item2 > dt{
    margin-bottom:25px;
}
.mail_form_item2 > dd{
    text-align: center;
}
.form_textarea{
    width:100%;
    padding:10px;
    font-size:1em;
    font-family:"Yu Mincho", "YuMincho", serif;
    border:1px solid #123452;
}
.gazo_text{
    margin:20px 0 10px;
}
.submit{
    text-align:center;
    margin-top:80px;
}
.submit_btn{
    background:#123452;
    border:none;
    padding:20px 30px;
    color:#fff;
    font-size:1em;
    font-family: "Yu Mincho", "YuMincho", serif;
    cursor: pointer;
    transition:all .5s;
}
.submit_btn:not(:disabled):hover{
    opacity:.5;
}
.submit_btn[disabled]{
    cursor:not-allowed;
    background:#a2a2a2;
}

.error{
    border:2px solid #e60000 !important;
}
.error-message{
    color:#e60000;
    font-size:.8em;

}

/*プライバシーポリシー*/
.privacy{
    padding:100px 40px;
}
.privacy_inner{
    max-width:1200px;
    margin:0 auto;
    display:flex;
    flex-direction: column;
    gap:50px;
}
.privacy_item > h4{
    color:#123452;
    font-size:1.4em;
    border-bottom:1px solid #123452;
    margin-bottom:15px;
}
.privacy_item > p{
    line-height: 2;
    font-size:.95em;
}
.privacy_item > ul li{
    position:relative;
    padding-left:1em;
    font-size:.95em;
}
.privacy_item > ul li::before{
    content:"";
    position:absolute;
    width:8px;
    height:8px;
    background:#123452;
    border-radius:50%;
    left:0;
    transform:translateY(100%);
}

/*お知らせ*/
.news{
    padding:100px 40px 0;
}
.news_inner{
    max-width:1200px;
    margin:0 auto;
}
.news-panel {
    display: none;
}
.news-panel.news-active {
    display: block;
}
.news_tablist{
    display:flex;
    align-items: center;
    gap:15px;
    margin-bottom:70px;
    white-space: nowrap;
    padding:10px 0;
}
.tab-link{
    border:1px solid #6e6e6e;
    padding:5px 10px;
}

.news_item{
    border-top:1px solid #000;
    border-bottom:1px solid #000;
    margin-bottom:-1px;
}
.news_item a{
    display:flex;
    align-items: center;
    gap:25px;
    padding:35px 10px;
}
.news_item01{
    display:flex;
    align-items: center;
    gap:25px;
}
.news_date{
    font-size:.9em;
}
.news_cate{
    white-space: nowrap;
    border:0.5px solid #123452;
    color:#123452;
    padding:1px 8px;
    text-align: center;
    font-size:.9em;
}
.news_item:hover .top_news_arr::before,
.news_item:hover .top_news_arr::after{
    width:100%;
    height:100%;
}
.news_tablist .tab-link.news-active{
    color:#fff;
    background:#123452;
}

/*ページネーション*/
.wp-pagenavi a, .wp-pagenavi span{
    border:1px solid #123452;
    padding:3px 5px;
    margin:0 5px;
    display:inline-flex;
    align-items: center;
    justify-content: center;
    width:40px;
    height:40px;
    color:#fff;
    background:#123452;
    transition:all .5s;
}
.wp-pagenavi a:hover{
    background:#fff;
    color:#123452;
}
.wp-pagenavi span.current{
    color:#123452;
    background:#fff;
}
.previouspostslink,
.nextpostslink{
    position:relative;
    font-size:0;
}
.previouspostslink::before{
    content:"";
    width:9px;
    height:9px;
    border-top:1px solid #fff;
    border-left:1px solid #fff;
    transform:rotate(-45deg) translate(2px,2px);
}
.nextpostslink::before{
    content:"";
    width:9px;
    height:9px;
    border-top:1px solid #fff;
    border-right:1px solid #fff;
    transform:rotate(45deg) translate(-2px,2px);
}
.previouspostslink:hover::before{
    border-top-color:#123452;
    border-left-color:#123452;
}

.nextpostslink:hover::before{
    border-top-color:#123452;
    border-right-color:#123452;
}

/*前の記事　次の記事*/
.news_view_inner a,
.work_view_inner a{
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    gap:10px;
}
.nav_icon{
    width: 40px;
    height: 40px;
    background: #123452;
    display: flex;
    align-items: center;
    justify-content: center;
}
.nav_icon::before{
    content:"";
    width: 8px;
    height: 8px;
    border-top: 1px solid #fff;
}
.nav_icon.prev::before{
    border-left: 1px solid #fff;
    transform: rotate(-45deg) translate(2px, 2px);
}
.nav_icon.next::before{
    border-right: 1px solid #fff;
    transform: rotate(45deg) translate(-2px, 2px);
}
.nav_placeholder {
    width: 1px;
    visibility: hidden; /* 見えないようにする */
}

/*お知らせ詳細*/
.news_inner > h3{
    font-size:1.7em;
    margin:10px 0 35px;
}
.news-s_item{
    display:flex;
    align-items: center;
    gap:20px;
}
.news-s_cate{
    border:1px solid #123452;
    padding:5px 8px;
    line-height: 1;
    color: #123452;
}
.news-s_img{
    max-width:1200px;
    aspect-ratio: 1200 / 700;
}
.news-s_img img{
    width:100%;
    height:100%;
    object-fit: cover;
}
.news-s_txt{
    margin-bottom:35px;
    line-height: 2;
}
.news-s_txt a{
    color:#8A3318;
    text-decoration: underline;
    transition:all .5s;
}
.news-s_txt a:hover{
    opacity:.5;
}
.news_view{
    padding:100px 0;
    text-align: center;
}
.news_view_inner{
    display:flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom:20px;
}

/*サイトマップ*/
.sitemap{
    padding:120px 40px;
}
.sitemap_inner{
    max-width:1200px;
    margin:0 auto;
    display:flex;
    flex-direction: column;
    gap:60px;
}
.sitemap_item > a{
    background:#123452;
    color:#fff;
    display: block;
    width:100%;
    padding:20px 20px 20px 2em;
    font-size:1.1em;
    position:relative;
}
.sitemap_item > a::before{
    content:"";
    position:absolute;
    top:50%;
    left:12px;
    width:8px;
    height:8px;
    border-top:1px solid #fff;
    border-right:1px solid #fff;
    transform:rotate(45deg) translateY(-50%);
    transition:all .5s;
}
.sitemap_item > a:hover::before{
    left:17px;
}
.sitemap_item ul{
    display:grid;
    grid-template-columns: repeat(3,1fr);
    row-gap:15px;
    column-gap:30px;
    margin-top:20px;
}
.sitemap_item ul li a{
    position:relative;
    padding-left:1.5em;
    transition:all .5s;
}
.sitemap_item ul li a::before{
    content:"";
    position:absolute;
    top:50%;
    left:0;
    width:8px;
    height:8px;
    border-top:1px solid #000;
    border-right:1px solid #000;
    transform:rotate(45deg) translateY(-50%);
}
.sitemap_item ul li a:hover{
    opacity:.5;
}

/*準備中*/
.reserve{
    background:#123452;
}
.reserve_inner{
    padding:200px 40px;
    max-width:1200px;
    margin:0 auto;
    color:#fff;
}
.reserve_inner > h2{
    font-size:2em;
    margin-bottom:30px;
    border:1px solid #fff;
    padding:30px 0 30px 1em;
}
.reserve_inner > p{
    line-height: 2;
}

/*404*/
.pagenone{
    background:#123452;
}
.pagenone_inner{
    padding:200px 40px;
    max-width:1200px;
    margin:0 auto;
    color:#fff;
}
.pagenone_inner > h2{
    font-size:2em;
    margin-bottom:30px;
    border:1px solid #fff;
    padding:30px 0 30px 1em;
}
.pagenone_inner > p{
    line-height: 2;
}
.pagenone_link{
    color:#fff;
    text-decoration: underline;
    transition:all .5s;
}
.pagenone_link:hover{
    opacity:.5;
}