@charset "utf-8";
/*pc*/
.tit_area{
background:url(../img/tit_bg.png);
background-size:cover;
padding:45px 0;
margin-bottom:70px;
}
.tit_area h2{
text-align:center;
}
.tit_area h2 img{
width:auto;
}
.inner{
max-width:1080px;
margin:0 auto;
}

.equip_nav{
max-width:980px;
margin:0 auto 40px;
border-bottom:1px solid #232124;
}
.equip_nav ul{
display:flex;
justify-content:center;
gap:20px;
}
.equip_nav li{
max-width:300px;
}
.flex{
display:flex;
justify-content:space-between;
}


/* =safety= */
.safety_area{
max-width:980px;
margin:0 auto 100px;
line-height:1.2em;
}
.safety_area h4{
font-size:18px;
color:#6a3906;
margin-bottom:15px;
}
.safety_area p{
font-size:14px;
color:#231815;
}


.security{
margin-bottom:20px;
}
.security_txt{
width:58%;
}
.security_img{
margin-top:-80px;
}

.delivery_box{
width:50%;
margin-bottom:20px;
}
.delivery_box_txt{
width:68%;
}
.delivery_box_txt p img{
margin-top:10px;
}
.delivery_box_img{
width:31%;
}

.everyday_box{
width:48%;
}
.everyday{
margin-bottom:20px;
}
.everyday_txt{
width:53%;
}
.everyday_img{
width:42%;
}

.camera{
}
.camera h5{
font-size:18px;
display:block;
margin-bottom:15px;
background-image: linear-gradient(90deg, rgba(220, 194, 152, 1), rgba(224, 198, 156, 0)30%);
padding:5px 5px 5px 10px;
}
.camera_txt{
width:69%;
}
.camera_img{
width:26%;
}

.parking_txt{
margin-top:20px;
width:28%;
}
.shutter_txt{
margin-top:10px;
}
.separate_txt{

}
.parking_txt h5{
color:#fff;
background:#40210f;
text-align:center;
font-size:18px;
padding:5px;
margin-bottom:5px;
}
.parking_img{
margin-top:20px;
width:70%;
margin-bottom:20px;
}

.parking_area{
margin-bottom:20px;
position: relative;
display:block;
height:420px;
}
.area1{
position:absolute;
top:0;
left:0;
width:46%;
}
.area2{
position:absolute;
bottom:0;
left:48%;
width:32%;
}
.mechanical_parking{
position:absolute;
top:0;
right:0;
width:52%;
display:flex;
justify-content:space-between;
}
.mechanical_parking_txt{
width:62%;
}
.mechanical_parking_txt h6{
background:#232124;
color:#fff;
padding:5px 5px 5px 10px;
margin-bottom:5px;
}
.mechanical_parking_img{
width:35%;
}

.triple_security{
margin-bottom:20px;
}
.triple_security h4{
margin-bottom:0;
}
.key_point{
margin-bottom:20px;
}
.key_point{
width:62%;
}
.key_point1,.key_point3{
margin-bottom:10px;
}
.key_point1 h4, .key_point3 h4{
background:#dbdcdc;
color:#232124;
padding:5px 5px 5px 10px;
margin-bottom:10px;
}
.key_point1 h4 span, .key_point3 h4 span{
font-size:16px;
padding:2px 6px;
margin-right:5px;
background:#604c3f;
color:#fff;
}
.key_point1 p, .key_point3 p{
margin-bottom:5px;
}
.key_point3 p span{
font-size:12px;
}
.key_img{
width:36%;
}

.three_wide h5,.four_wide h5{
background: #dbdcdc;
color: #232124;
padding: 5px 5px 5px 10px;
margin-bottom: 10px;
text-align:center;
}

.dead_bolt{
width:32%;
margin-bottom:20px;
}
.dead_bolt_txt{
width:59%;
}
.dead_bolt_img{
width:37%;
}

.dimple{
width:32%;
}
.dimple_box{
margin-bottom:20px;
}
.dimple_box::after {
content: "";
display: block;
clear: both;
}
.dimple_txt{
}
.dimple_box span{
font-size:12px;
line-height:1.2em ;
}
.dimple_box img{
float:right;
width:46%;
height: auto;
margin: 0 0 10px 10px;
}

.clavis{
width:32%;
margin-bottom:20px;
}
.clavis_txt{
}
.clavis_img{
width:66%;
margin:0 auto;
}

.thumb_turn{
width:24%;
margin-bottom:20px;
}
.thumb_turn_img{
width:50%;
margin:5px auto;
}
.scope{
width:24%;
margin-bottom:20px;
}
.scope_txt{
}
.scope_img{
width:49%;
margin:5px auto;
}
.louve{
width:24%;
margin-bottom:20px;
}
.louve_img{
width:49%;
margin:5px auto;
}
.intercom{
width:24%;
margin-bottom:20px;
}
.intercom_img{
width:45%;
margin:5px auto;
}

.prevention_box{
width:63%;
}
.prevention_box p{
margin-bottom:20px;
}
.prevention_img{
align-items:center;
}

.prevention_list{
width:35%;

}
.prevention_list .flex{
margin-bottom:10px;
}
.prevention_list h5{
background:#232124;
color:#fff;
padding:5px 5px 5px 10px;
margin-bottom:5px;
}
.prevention_list p{
font-size:13px;
}
.alarm_txt,.distribution_txt,.detector_txt,.gas_meter_txt{
width:73%;
}
.alarm_img,.distribution_img,.detector_img,.gas_meter_img{
width:25%;
}
.stop_fire_txt{
width:60%;
}
.stop_fire_img{
width:38%;
}

.elevator_box{
}
.elevator_box h5{
background: #dbdcdc;
color: #232124;
padding: 5px 5px 5px 10px;
margin-bottom: 10px;
}
.elevator{
width:48%;
}
.elevator span{
font-size:12px;
}
.fire{
width:51%;
}

/* =infra= */
.infra_area{
max-width:980px;
margin:0 auto 100px;
line-height:1.2em;
}
.infra_area h4{
font-size:18px;
color:#6a3906;
margin-bottom:15px;
}
.infra_area p{
font-size:14px;
color:#231815;
}

.net{
width:55%;
margin-bottom:20px;
}
.kcn{
justify-content:space-between;
margin-bottom:20px;
}
.kcn_txt{
width:55%;
}
.kcn_img{
width:25%;
}
.net_txt{
margin-bottom:10px;
}

.router_box{
width:43%;
margin-bottom:20px;
}
.router h5{
background:#dbdcdc;
color:#232124;
padding:5px 5px 5px 10px;
margin-bottom:10px;
}
.router_txt{
margin-bottom:10px;
}
.router_txt span{
font-size:12px;
}

.supply{
width:56%;
background:url(../img/infra/water_supply.png)no-repeat right top;
padding-bottom:120px;
margin-bottom:20px;
}
.supply_txt{
width:68%;
}
.pet{
width:42%;
background:url(../img/infra/pet.png)no-repeat right top;
padding-bottom:30px;
margin-bottom:20px;
}
.pet_txt{
width:70%;
}
.pet_txt span{
font-size:12px;
}

.eco{
margin-bottom:20px;
}
.eco_txt{
}
.eco_txt span{
font-size:12px;
}
.eco_img{
margin-top:-30px;
}
.hot_water{
width:56%;
margin-bottom:20px;
}
.three_place{
width:42%;
margin-bottom:20px;
}
.hot_water h5,.three_place h5{
background:#dbdcdc;
color:#232124;
padding:5px 5px 5px 10px;
margin-bottom:10px;
}
.hot_water_txt,.three_place_txt{
margin-bottom:10px;
}
.infra_area p.infra_note{
max-width:980px;
margin:0 auto;
font-size:10px;
}
/* =comfort= */
.comfort_area{
max-width:980px;
margin:0 auto 100px;
line-height:1.2em;
}
.comfort_area h4{
font-size:18px;
color:#6a3906;
margin-bottom:15px;
}
.comfort_area p{
font-size:14px;
color:#231815;
}

.ventilation{
width:48%;
margin-bottom:20px;
}
.sick_house_box{
width:48%;
margin-bottom:20px;
}

.insulation{
width:48%;
margin-bottom:20px;
}
.led{
width:48%;
margin-bottom:20px;
}
.led_txt{
width:60%;
}
.led_img{
width:36%;
}

.outlet{
width:27%;
margin-bottom:20px;
}
.outlet_txt{
width:64%;
}
.outlet_img{
width:34%;
}
.auto_light{
width:44%;
margin-bottom:20px;
}
.auto_light_txt{
width:34%;
}
.auto_light_img{
width:64%;
}
.room_insulation{
width:26%;
margin-bottom:20px;
}

.floor{
margin-bottom:20px;
}

.sliding_door{
width:33%;
border-left:2px solid #232124;
}
.sliding_door h6{
border-bottom:2px solid #232124;
margin-bottom:5px;
padding-bottom:5px;
padding-left:10px;
font-size:20px;
}
.sliding_door_txt{
padding-left:10px;
width:42%;
}
.sliding_door_img{
width:54%;
}

.handrail_img{
width:65%;
}
/* ================================================
tab
================================================ */
@media screen and (max-width: 1200px) {
}


/* ================================================
sp
================================================ */
@media screen and (max-width: 768px) {
.tit_area{
padding:10% 0;
margin-bottom:10%;
}
.tit_area h2{
width:70%;
margin:0 auto;
}
.tit_area h2 img{
width:auto;
}
.inner{
max-width:1080px;
margin:0 auto;
}

.equip_nav{
max-width:100%;
margin:0 auto 10%;
padding:0 2% 0;
}
.equip_nav ul{
gap:3%;
}
.equip_nav li{
max-width:33%;
}
.flex{
display:flex;
justify-content:space-between;
flex-wrap:wrap;
}



/* =safety= */
.safety_area{
max-width:90%;
margin:0 auto 20%;
}
.safety_area h4{
font-size:4vw;
margin-bottom:3%;
text-indent:-1em;
padding-left:1em;
line-height:1.3em;
}
.safety_area p{
font-size:3.5vw;
line-height:1.3em;
}
.security{
margin-bottom:5%;
}
.security_txt{
width:100%;
}
.security_img{
margin-top:0;
}

.delivery_box{
margin-bottom:5%;
width:100%;
}
.delivery_box_txt{
width:100%;
}
.delivery_box_txt p img{
margin-top:10px;
}
.delivery_box_img{
width:60%;
margin:5% auto 5%;
}

.everyday_box{
width:100%;
}
.everyday{
margin-bottom:5%;
}
.everyday_txt{
width:100%;
}
.everyday_img{
width:60%;
margin:5% auto 5%;
}

.camera{
}
.camera h5{
font-size:4vw;
display:block;
margin-bottom:5%;
}
.camera_txt{
width:100%;
}
.camera_img{
width:40%;
margin:5% auto 5%;
}

.parking_txt{
margin-top:5%;
width:100%;
}
.shutter_txt{
margin-top:0;
margin-bottom:5%;
}
.separate_txt{

}
.parking_txt h5{
color:#fff;
background:#40210f;
text-align:center;
font-size:4vw;
}
.parking_img{
margin-top:5%;
width:100%;
margin-bottom:5%;
}

.parking_area{
margin-bottom:5%;
position:static;
height:auto;
}
.area1{
position:static;
top:0;
left:0;
width:100%;
}
.area2{
position:static;
bottom:0;
left:48%;
width:70%;
margin:5% auto;
}
.mechanical_parking{
position:static;
top:0;
right:0;
width:100%;
display:flex;
flex-wrap:wrap;
}
.mechanical_parking_txt{
width:100%;
}
.mechanical_parking_txt h6{
background:#232124;
color:#fff;
padding:5px 5px 5px 10px;
margin-bottom:5px;
}
.mechanical_parking_img{
width:60%;
margin:5% auto;
}

.triple_security{
margin-bottom:5%;
}
.triple_security h4{
margin-bottom:0;
}
.key_point{
margin-bottom:5%;
}
.key_point{
width:100%;
}
.key_point1,.key_point3{
margin-bottom:10px;
}
.key_point1 h4, .key_point3 h4{
margin-bottom:3%;
padding-left:1.5em;
font-size:3.5vw;
}
.key_point1 h4 span, .key_point3 h4 span{
font-size:3vw;
}
.key_point1 p, .key_point3 p{
margin-bottom:3%;
}
.key_point3 p span{
font-size:2.5vw;
}
.key_img{
width:70%;
margin:5% auto;
}

.three_wide h5,.four_wide h5{
background: #dbdcdc;
color: #232124;
padding: 5px 5px 5px 10px;
margin-bottom: 10px;
text-align:center;
}

.dead_bolt{
width:100%;
margin-bottom:5%;
}
.dead_bolt_txt{
width:59%;
}
.dead_bolt_img{
width:37%;
}

.dimple{
width:100%;
}
.dimple_box{
margin-bottom:5%;
}
.dimple_box::after {
content: "";
display: block;
clear: both;
}
.dimple_txt{
}
.dimple_box span{
font-size:2.5vw;
line-height:1.3em ;
}
.dimple_box img{
float:right;
width:46%;
height: auto;
margin: 0 0 10px 10px;
}

.clavis{
width:100%;
margin-bottom:5%;
}
.clavis_txt{
}
.clavis_img{
width:66%;
margin:0 auto;
}

.thumb_turn{
width:100%;
margin-bottom:5%;
}
.thumb_turn_img{
width:50%;
margin:5px auto;
}
.scope{
width:100%;
margin-bottom:5%;
}
.scope_txt{
}
.scope_img{
width:49%;
margin:5px auto;
}
.louve{
width:100%;
margin-bottom:5%;
}
.louve_img{
width:49%;
margin:5px auto;
}
.intercom{
width:100%;
margin-bottom:5%;
}
.intercom_img{
width:45%;
margin:5px auto;
}

.prevention_box{
width:100%;
}
.prevention_box p{
margin-bottom:5%;
}
.prevention_img{
align-items:center;
}
.prevention_sub{
width:70%;
margin:0 auto;
}
.prevention_list{
width:100%;

}
.prevention_list .flex{
margin-bottom:10px;
}
.prevention_list h5{
background:#232124;
color:#fff;
padding:5px 5px 5px 10px;
margin-bottom:3%;
}
.prevention_list p{
font-size:3vw;

}
.alarm_txt,.distribution_txt,.detector_txt,.gas_meter_txt{
width:73%;
}
.alarm_img,.distribution_img,.detector_img,.gas_meter_img{
width:25%;
}
.stop_fire_txt{
width:60%;
}
.stop_fire_img{
width:38%;
}

.elevator_box{
}
.elevator_box h5{
margin-bottom: 3%;
}
.elevator{
width:100%;
margin-bottom:5%;
}
.elevator span{
font-size:2.5vw;
}
.fire{
width:100%;
}

/* =infra= */
.infra_area{
max-width:90%;
margin:0 auto 20%;
}
.infra_area h4{
font-size:4vw;
margin-bottom:3%;
text-indent:-1em;
padding-left:1em;
line-height:1.3em;
}
.infra_area p{
font-size:3.5vw;
line-height:1.3em;
}

.net{
width:100%;
margin-bottom:5%;
}
.kcn{
justify-content:space-between;
margin-bottom:5%;
}
.kcn_txt{
width:100%;
font-size:4vw;
text-align:center;
margin-bottom:5%;
}
.kcn_img{
width:40%;
margin:0 auto;
}
.net_txt{
margin-bottom:3%;
}

.router_box{
width:100%;
margin-bottom:5%;
}
.router h5{
margin-bottom:3%;
}
.router_txt{
margin-bottom:3%;
}
.router_txt span{
font-size:2.5vw;
}

.supply{
width:100%;
background:url(../img/infra/water_supply.png)no-repeat right top;
padding-bottom:15%;
margin-bottom:5%;
}
.supply_txt{
width:52%;
}
.pet{
width:100%;
background:url(../img/infra/pet.png)no-repeat right top;
padding-bottom:10%;
margin-bottom:5%;
}
.pet_txt{
width:65%;
}
.pet_txt span{
font-size:2.5vw;
}

.eco{
margin-bottom:5%;
}
.eco_txt{
}
.eco_txt span{
font-size:2.5vw;
}
.eco_img{
margin-top:3%;
}
.hot_water{
width:100%;
margin-bottom:5%;
}
.three_place{
width:100%;
margin-bottom:5%;
}
.hot_water h5,.three_place h5{
margin-bottom:3%;
}
.hot_water_txt,.three_place_txt{
margin-bottom:3%;
}
.infra_area p.infra_note{
max-width:100%;
font-size:2.5vw;
}

/* =comfort= */
.comfort_area{
max-width:90%;
margin:0 auto 20%;
}
.comfort_area h4{
font-size:4vw;
margin-bottom:3%;
text-indent:-1em;
padding-left:1em;
line-height:1.3em;
}
.comfort_area p{
font-size:3.5vw;
line-height:1.3em;
}

.ventilation{
width:100%;
margin-bottom:5%;
}
.sick_house_box{
width:100%;
margin-bottom:5%;
}
.sick_house{
margin-bottom:5%;
}

.insulation{
width:100%;
margin-bottom:5%;
}
.led{
width:100%;
margin-bottom:5%;
}
.led_txt{
width:60%;
}
.led_img{
width:36%;
}

.outlet{
width:100%;
margin-bottom:5%;
}
.outlet_txt{
width:64%;
}
.outlet_img{
width:34%;
}
.auto_light{
width:100%;
margin-bottom:5%;
}
.auto_light_txt{
width:34%;
}
.auto_light_img{
width:64%;
}
.room_insulation{
width:100%;
margin-bottom:5%;
}
.room_insulation_img{
width:70%;
margin:0 auto;
}

.floor{
margin-bottom:5%;
}

.sliding_door{
width:100%;
margin-bottom:5%;
}
.sliding_door h6{
margin-bottom:3%;
padding-bottom:3%;
padding-left:3%;
font-size:5vw;
}
.sliding_door_txt{
padding-left:10px;
width:55%;
}
.sliding_door_img{
width:40%;
}

.handrail_img{
width:100%;
}
}