:root{
    --space_sm: 15px;
    --space_md: 30px;
    --space_lg: 80px;
}
/* タブレット */
@media screen and (max-width: 768px){
    :root{}
}
/* スマホ */
@media screen and (max-width: 667px){
    :root{}
}


/*■■ fv ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#main_img{aspect-ratio: 1.1;}

#main_img .main_img{
    width: 110%;
    max-width: 1590px;
    position: absolute;
    left: 47%;
    top: -6%;
    
    transform: translate(-50%, 0) scale(1.05);
    opacity: 0;
    filter: blur(20px);
    transition: all 0.7s;
}
#main_img .main_img.start{
    transform: translate(-50%, 0) scale(1.0);
    opacity: 1;
    filter: blur(0px);
}


/* タブレット */
@media screen and (max-width: 768px){
    #main_img .main_img{
         top: 0%;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    #main_img .main_img{
        width: 113%;
        left: 49%;
    }
    #main_img .main_img.start{}
}



/*■■ link ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.cate_list li{width: 50% !important;}
.cate_list li a:hover,#page10 li a:hover{background-color: var(--color3);}


/* タブレット */
@media screen and (max-width: 768px){
    .cate_list li{
        width: 100% !important;
        text-align: left;
    }
    .cate_list li a{
        padding: 10px 3%;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .cate_list li a{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}


/*■■ 全体・top ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#loading_bg{background-color:var(--color3)!important;}


#contents1{
    margin: -18% auto 0;
    padding: 0 5% 50px;
    width: 90%;
}

#contents1 .title{
    font-size: clamp(16px, (1rem + 2.3vw), 50px);
    letter-spacing: 0em;
}
#contents2 .title, #contents3 .title{
    font-size: clamp(16px, (1rem + 1.2vw), 35px);
    letter-spacing: 0em;
}
.img-container:before{
    background: var(--color3);
}
.blur,.footer_back .f_before{
    background-color: var(--color3);
}

/* タブレット */
@media screen and (max-width: 768px){
    .fat-nav li{font-size: 18px;}
    
    #contents1{padding: 0 6% 50px;}
    
    .footer_back .f_before{
        right: -33%;
        top: 40%;
    }
    header.bg_color1{
        background-color: var(--color3);
        padding: 18px 0;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    header.bg_color1{padding: 13px 0;}
    .footer_back .f_before{right: -46%;}
    
    #contents1 .title{
        font-size:clamp(16px, (1rem + 1.3vw), 50px);
    }
}


/*■■ cms ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.all main.scrollin{background-color: var(--color2);}
.all main.scrollin .all_bg{display: none;}
.all main.scrollin article{padding:50px 3%;}


.cate{}

/* タイトル大 */
.big_cate_title,
.cate .cate_title{
    font-size: 2.5em;
    line-height: 1.3!important;
    padding: 10px 2%;
    font-weight: bold;
}

/* タイトル中（大カテゴリ使用のとき） */
#cms_3-e .cate_title{
    font-size: clamp(16px, (1rem + 1.4vw), 28px);
}

/* タイトル小 */

.cate .cate_txt1{}
.cate .cate_title_wrap{}
.cate .box_wrap{
    padding: 0 0;
}
.cate_box{
    padding: 0 0 30px;
    margin: 0 auto 0;
}

.link_type2 .cate_box{
    padding: 0 10px 10px;
}

#cms_5-f #cate4811 .cate_box .open_bt .box_title1::before{
    display: none;
}
#cms_5-f #cate4811 .cate_box .open_bt .box_title1{
    margin-left: 40px;
}
#cms_3-e .cate_box:last-child .box_title2,#cms_3-e .cate_box:last-child .box_title1{
    border: none;
}

#page7 .box_title1{
    letter-spacing: 0em;
    padding: 0 10px;
}

/* タブレット */
@media screen and (max-width: 768px){
    #page10 li{
        width: 50%!important;
    }
}
/* スマホ */
@media screen and (max-width: 667px){
    .big_cate_title, .cate .cate_title{
        font-size: 1.8em!important;
        line-height: 1.4 !important;
        padding: 10px 4%;
        letter-spacing: 0em;
    }
    
    #page10 li{
        width: 100%!important;
    }
    #cms_5-f .cate_box .box_txt1, .cms_5-f .cate_box .box_txt1{
        padding: 20px 8%;
        text-align: justify;
    }
    #cms_7-a .cate_box{
        border-bottom: 1px solid var(--color4);
        padding: 20px 0%;
    }
    #cms_7-a .box_txt1{
        padding: 5px 10px 0px;
    }
    #cms_3-e{
        padding: 0!important;
    }
    #cms_3-e .cate .cate_title{
        padding: 20px 0% 10px;
        font-size: 1.6em !important;
    }
    #cms_3-e .cate .cate_txt1{
        padding: 0 10px 20px;
    }
    #cms_5-f .cate_box .open_bt .box_title1{
        margin-left: 64px;
        text-align: justify;
        letter-spacing: -0.02em;
    }
    #cms_5-f .cate_box .open_bt .box_title1::before{
        left: -22px;
    }
}

/*■■ 施工事例 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#cms_3-f .cate_box{
    margin: 0px 0 20px;
}
#cms_3-f .cate_img1 {
    box-sizing: border-box;
}
#cms_3-f .sub_cate_title{
    font-size: clamp(16px, (1rem + 1.2vw), 25px);}
#cms_3-f .sub_cate_wrap {
/*     padding: 10px 2%; */
}
#cms_3-f .box_wrap{}
#cms_3-f .box_wrap .box_item{
    background-color: var(--color3);
    color: #fff;
    padding: 7px 5px;
}




/*■■ 問い合わせ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.contact_box{}

.contact_title{
    display: flex;
    justify-content: center; 
    align-items: center; 
}
.contact_box .box{
    border-left: 2px solid var(--color3);
    padding: var(--space_md);
}

.contact_box .title{
    width: 40%;
    display: block;
}
.contact_box .con_btn{
    width: fit-content;
    margin: 0px auto 20px;
}
.contact_box .con_btn a{
    background-color: var(--color3);
    color: #fff;
    padding: 10px calc(10px * 1.7);
    border-radius: 6px;
    transition: all 0.3s;
    display: block;
}

.box .sub_box{}



/* タブレット */
@media screen and (max-width: 768px){}
/* スマホ */
@media screen and (max-width: 667px){
    .contact_box .title, .contact_box .con_btn{
        width: 100%;
        text-align: center;
    }

    .box{
        border-left: none;
        border-bottom: 2px solid var(--color3);
        padding: var(--space_md) 5%;
    }
    #top_cms .box{
        border: none;
    }
}


/*■■ 施工メニューTOP ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.link_type2 .cate_box a {
    color: #fff;
}
.link_type2 .cate_box a:before, .link_type2 .cate_box a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 1;
}
.link_type2 .cate_box a:after {
    top: 100%;
    background-color: var(--color3);
    transition: 0.5s;
	z-index: 3;
}
.link_type2 .cate_box a:hover:after {
    top: 0;
}
.link_type2 .cate_box .txt_wrap {
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center; 
}
.link_type2 .more {
	letter-spacing: 3px;
    box-sizing: border-box;
	opacity: 0;
	transition: opacity .8s;
	z-index: 4;
}
.link_type2 .cate_box a:hover .more {
    opacity: 1;
}