@charset "utf-8";


@media screen and (max-width: 769px) {
	
.pc-display{
display: none!important		
}

.pc-display2{
display: none!important		
}

.sp-display{
display: block!important
}


video.lloyds_video {
    max-width: 96%;
    background: black;
}

/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #header01 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/


#header01{
padding:30px 0 50px 0;
}


/*===========================
header ul.for
===========================*/


#header01 h3.for{
padding:0 10px 20px 10px;

}

#header01 h3.for div{
font-size:11px;
color:#023a95;
width:90px;
display: flex;
justify-content: center;
align-items: center;
min-height:55px;
padding:5px 10px;
text-align:center;
}

/*===========================
#header01 .catch
===========================*/

#header01 .catch .text{
font-size:25px;
color:#023a95;
border-top:solid 2px #023a95;
border-left:solid 2px #023a95;
padding:8px;

}


#header01 .catch .text:last-child{
border-right:solid 2px #023a95;
}

#header01 .catch:last-child .text{
border-bottom:solid 2px #023a95;
}




/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #header02 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/


#header02{
padding:60px 0 50px 0;
}

#header02 .box-wrapper{
width:90%;
box-shadow: 0px 0px 0px 4px #fff ;
}


/*===========================
#header02 .box-wrapper h3
===========================*/



#header02 .box-wrapper h3{
font-size:15px;
padding:10px 10px 10px;
width:84%;
margin:-20px auto 20px;
}

/*===========================
#header02 .box-wrapper h2
===========================*/


#header02 .box-wrapper h2{
padding:0px 12px 35px 12px;
letter-spacing:0px;
font-size:30px;
}




/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #header03 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/


/*===========================
#header03 .inner
===========================*/
#header03 .inner{
width:100%;
}

/*===========================
#header03 .text
===========================*/


#header03 .wrapper .text{
bottom:-40px;
width:100%;
margin:0 auto 0;
padding:0 2% 0 2%;
}

#header03 .wrapper .text h2{
font-size:14px;
padding:5px 10px 8px 10px;
font-weight:700;
background:#023a95;
color:#fff;
width:160px;
text-align:center;
border-radius:30px;
letter-spacing:1px;
position:static;
z-index:2;
}


#header03 .wrapper .text h3{
font-size:11px;
text-align:center;
width:85px;
height:85px;
border-radius:90px;
border:solid 2px #023a95;

}

#header03 .wrapper .text h3:first-child{
margin:0 -5px 0 0;
}

#header03 .wrapper .text h3:last-child{
margin:0 0 0 -5px;
}



/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #header04 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/


/*===========================
#header04 .box h3
===========================*/

#header04 .box-wrapper:before{
content:"MANSION\AREPAIR";
font-size:50px;
bottom:3%;
left:3%;
}

/*===========================
#header04 .box h3
===========================*/
#header04 .box{
width:92%;
box-shadow: 0px 0px 0px 4px #fff ;
}


#header04 .box-wrapper h3{
font-size:16px;
padding:8px 20px 9px;
width:220px;
margin:-40px auto 25px;
}


/*===========================
#header04 .box-wrapper h2
===========================*/


#header04 .box-wrapper h2{
padding:0px 10px 35px 10px;
letter-spacing:0px;
font-size:32px;
}

/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #header05 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/
#header05{
    width:100%;
    position:relative;
    margin:0 auto;
    height:400px;
    overflow:hidden;
    margin:0 0 -50px 0;
}
        
    #header05 .wrapper{
    position:absolute;
    color:#fff;
    background:var(--main-color);
    width:80%;
    height:250px;
    overflow:visible;
    transform:skew(-20deg);
    left:10%;
    bottom:50px;
    text-align:left;
    }
    
    #header05 .wrapper h1{
    padding:10% 8% 0 8%;
    font-size:23px;
    }
    
    #header05 .wrapper h1 span.big{
    font-size:24px;
    }
    
    
    #header05 .wrapper p{
    padding:20px 8% 0 8%;
    font-size:13px;
    }
    
    #header05 img.main-img{
    width:100%;
    height:auto;
    overflow: hidden;
}



/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #header06 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/
#header06{
background:url(../images/header06-sp.jpg);
background-size:100% auto;
background-position:0 -30px;
height:52rem;
padding-top: 3.6rem;
}
    
#header06 h1{
width:80%;
margin:0 auto;
overflow: hidden;
padding-top:0;
}
    
#header06 h1 img.copy{
width:100%;
height:auto;
}
        
/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #header07 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/  
#header07 img.copy{
width:85%;
}
    

/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #second01 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/



#second01 h2{
width:70%;
font-size:23px;
padding:10px 2% 10px 2%;
}

#second01 p.sub{
font-size:18px;
padding:10px 2% 0px 2%;
text-align:center;
}

#second01 p.explain{
font-size:15px;
width:90%;
}




/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #second02 〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/



#second02 h2{
font-size:35px;
padding:15px 2% 15px 2%;
}

#second02 p.sub{
font-size:18px;
padding:0px 2% 0px 2%;
text-align:center;
}

#second02 p.explain{
font-size:15px;
width:90%;
}

/*=============================================
 □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □

〇 #form-wrapper　〇

□ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □ □
=============================================*/



#form-wrapper .privacy-section .privacy-button img.p-mark{
position: relative;
top:25px;
padding:0 5px 0 0;
}


} /* 769px responsive-closed */


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



} /* 481px responsive-closed */


/* 960px〜1279px：小型PC
------------------------------ */
@media screen and (min-width:960px) and (max-width:2980px) {

} /* 960px〜1279px responsive-closed */



/* 1280px〜：大型PC
------------------------------ */
@media screen and (min-width:2980px) {

}/* 1280px〜 responsive-closed */



	
	
