@charset "utf-8";

/* 住宅防火の知識
----------------------------------------------------------------------------- */

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

.btn-alarm{
    display: inline-block;
    min-width:250px;
    background-image: url("/common/images/download_arr.png");
    background-repeat: no-repeat;
    background-size: 36px 36px;
    background-position: right 15px center;
    border:5px solid #C22D26;
    border-radius: 10px;
    text-decoration: none;
    padding: 10px 65px 10px 10px;
    font-weight: bold;
    margin: 0 auto 20px;
}
.btn-alarm:hover{
    background-position: right 10px center;
}
.btn-alarm img{
    width:auto;
    height: 50px;
    float: left;
    margin-right: 10px;
}
.btn-alarm span{
    font-size: 12px;
    display: block;
}
@media screen and (max-width:768px){
    .btn-pdf{
        position: relative;
        padding: 15px 65px 15px 70px;
        text-align: left;
    }
    .btn-pdf::before{
        position: absolute;
        top:calc(50% - 25px);
        left:10px;
    }

}


/* 住宅火災対策
----------------------------------------------------------------------------- */
.alarm-box01{
    margin-bottom: 50px;
    display: flex;
}

.alarm-box01-img-inner{
    background-color: #EDF1F4;
    border-radius: 10px;
    padding: 20px 30px 30px;
    width:400px;
    margin-right: 50px;
    margin-bottom: 15px;
}
.alarm-box01-img-inner .ttl-M{
    margin-bottom: 15px;
}
.alarm-box01-img-mark{
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
.alarm-box01-img-mark img{
    width: 80px;
    height: auto;
    margin-right: 10px;
}
.alarm-box01-txt{
    font-size:16px;
    line-height: 1.8em;
}

.alarm-qa{
    margin-bottom: 30px;
}
.alarm-qa table{
    width: 100%;
}
.alarm-qa table tbody th{
    text-align: left;
    vertical-align: top;
    padding-right: 30px;
    padding-bottom: 30px;
}
.alarm-qa table tbody th span{
    font-weight: bold;
    font-size: 16px;
    display: inline-block;
    margin-bottom: 10px;
}
.alarm-qa table tbody td{
    padding-bottom: 30px;
}

.alarm-notice{
    border: 5px solid #233479;
    border-radius: 10px;
    padding: 20px 30px 30px;
    margin-top: 30px;
}
.alarm .ttl-S, .article h2 {
    font-size: 23px;
    font-weight: bold;
    color: #0168B7;
    margin-bottom: 30px;
    padding-top: 100px;
    margin-top: -100px;
}

@media screen and (max-width:768px){
    .alarm-box01{
        display: block;
    }

    .alarm-box01-img-inner{
        width:100%;
        margin-right: 0;
    }
    .alarm-qa table tbody th{
        display: block;
        width: 100% !important;
        padding-right: 0;
    }
    .alarm-qa table tbody td{
        display: block;
        width: 100%;
    }
    .alarm-notice{
        padding: 20px;
    }

    .alarm .list-3col ul{
        display: block;
    }
    .alarm .list-3col ul li{
        width: 100%;
    }
}


/* 身近にある消防機器について
----------------------------------------------------------------------------- */
.general .list-4col {
	align-items: flex-end;
}
.general .ttl-SS{
    font-size: 15px;
}

.general-box{
    background-color: #F3F3F3;
    padding: 30px;
    border-radius: 10px;
    text-align: center;
    font-size:20px;
    font-weight: bold;
    color: #233479;
}

@media screen and (max-width:768px){
    .general .list-3col ul{
        display: block;
    }
    .general .list-3col ul li{
        width: 100%;
    }
    .general-box{
        padding: 20px;
    }
    .general-box img{
        width: 150px;
        height: auto;
        display: block;
        margin:0 auto;
    }
}