@charset "UTF-8";

/* ---------------------------------------------------------
   amamori.css【雨漏り診断】
----------------------------------------------------------*/
/********雨漏り****************/
#amamori h2 {
    font-weight: 900;
    line-height: 1.2em;
}

/* 21版sytle.cssから移植 */
.amamori-mainimg {
    position: relative;
    max-width: 980px;
    margin: 0 auto;
    height: 220px;
    background: url(../../assets/images/amamori/main-amamori.jpg) right/contain no-repeat;
}

/* amamori */
.amamori-main-ttl h2 {
    position: absolute;
    font-size: 56px;
    font-weight: 900;
    text-align: center;
    left: 7%;
    top: 50%;
    transform: translateY(-50%);
    text-shadow: white 2px 0px, white -2px 0px, white 0px -2px, white 0px 2px, white 2px 2px, white -2px 2px, white 2px -2px, white -2px -2px, white 1px 2px, white -1px 2px, white 1px -2px, white -1px -2px, white 2px 1px, white -2px 1px, white 2px -1px, white -2px -1px;
}



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

    #page_title {
        margin: 20px 0 0;
    }

    .amamori-mainimg {
        height: 100px;
        background-size: cover;
    }

    .amamori-main-ttl h2 {
        left: 5%;
        font-size: 20px;
    }
}


.amamori_main {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
}

.amamori_main .amamori_con {
    width: 980px;
}

.amamori_main .amamori_main_box {
    background: #E0F2FE;
    margin-top: 50px;
    padding: 20px;
}

.amamori_main .amamori_main_box .amamori_main_ttl {
    text-align: center;
}

.amamori_main .amamori_main_box .amamori_main_ttl h3 {
    font-size: 28px;
}

.amamori_main .amamori_main_box .amamori_main_ttl h3 .amamori_ttl_color {
    color: #008CEA;
    line-height: 1em;
    font-size: 28px;
}

.amamori_main .amamori_main_box .amamori_main_ttl h3 .amamori_subttl {
    font-size: 16px;
    display: inline-block;
    color: #000;
}

.amamori_main .amamori_main_txt {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    padding: 10px;
    margin: 10px;
    background: #fff;
}

.amamori_main .amamori_main_txt .amamori_main_img {
    width: 240px;
}

.amamori_main .amamori_main_txt p {
    width: calc(100% - 300px);
    font-size: 18px;
    line-height: 2em;
}

@media screen and (max-width: 767px) {
    .amamori_main .amamori_con {
        width: 100%;
    }

    .amamori_main .amamori_main_box {
        padding: 10px;
        margin-top: 0;
    }

    .amamori_main .amamori_main_box .amamori_main_ttl h3 {
        font-size: 28px;
    }

    .amamori_main .amamori_main_txt {
        display: block;
    }

    .amamori_main .amamori_main_txt .amamori_main_img {
        width: auto;
        text-align: center;
    }

    .amamori_main .amamori_main_txt p {
        width: 100%;
        font-size: 18px;
        line-height: 2em;
    }
}

.amamori_content {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
}

.amamori_content .amamori_con {
    width: 980px;
}

.amamori_content .amamori_block {
    margin-top: 50px;
}

.amamori_content .amamori_block .amamori_con_ttl {
    border-bottom: 1px solid #008CEA;
}

.amamori_content .amamori_block .amamori_con_ttl h2 {
    font-size: 18px;
    padding: 5px 0;
}

@media screen and (max-width: 767px) {
    .amamori_content .amamori_block .amamori_con_ttl h2 {
        padding-left: 10px;
    }
}

.amamori_content .amamori_block .amamori_con_subttl h3 {
    font-size: 34px;
    position: relative;
    padding: 15px 15px 15px 70px;
    color: #000;
    margin-top: 20px;
}

.amamori_content .amamori_block .amamori_con_subttl h3 span {
    color: #008CEA;
    font-size: 34px;
    line-height: 1em;
}

.amamori_content .amamori_block .amamori_con_subttl h3::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 25px;
    border-top: 3px solid #000;
    border-right: 3px solid #000;
    box-sizing: border-box;
}

.amamori_content .amamori_block .amamori_con_subttl h3::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 25px;
    border-bottom: 3px solid #eb6120;
    border-right: 3px solid #eb6120;
    box-sizing: border-box;
}

.amamori_content .amamori_block .amamori_con_subttl h3 .amamori_list_item::before {
    content: "";
    width: 70px;
    height: 70px;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 70px 70px 0 0;
    border-color: #000000 transparent transparent transparent;
    line-height: 0px;
    _border-color: #000000 #ffffff #ffffff #ffffff;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#ffffff');
}

@media screen and (max-width: 767px) {
    .amamori_content .amamori_block .amamori_con_subttl h3 {
        margin: 20px 10px;
    }
}

.amamori_content .amamori_block .amamori_con_box {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-around;
}

.amamori_content .amamori_block .amamori_con_box .con_box_txt {
    font-size: 16px;
    color: #008CEA;
    background: #E0F2FE;
    border-radius: 10px;
    padding: 10px;
}

.amamori_content .amamori_block p {
    margin-top: 20px;
    font-size: 18px;
    line-height: 2em;
}

.amamori_content .amamori_block .amamori_con_imgbox {
    text-align: center;
    background: #E0F2FE;
}

.amamori_content .amamori_block .amamori_con_imgbox h3 {
    color: #008CEA;
    font-size: 24px;
    padding-top: 20px;
    margin-top: 20px;
}

.amamori_content .amamori_block .amamori_con_img {
    text-align: center;
    margin-top: 20px;
}

.amamori_content .amamori_block .amamori_con_img a:hover {
    opacity: 0.7;
}

@media screen and (max-width: 767px) {
    .amamori_content .amamori_con {
        width: 100%;
    }

    .amamori_content .amamori_block {
        margin-top: 50px;
    }

    .amamori_content .amamori_block .amamori_con_subttl h3 {
        font-size: 28px;
    }

    .amamori_content .amamori_block .amamori_con_subttl h3 span {
        font-size: 28px;
    }

    .amamori_content .amamori_block .amamori_con_box {
        display: block;
        margin: 10px;
    }

    .amamori_content .amamori_block .amamori_con_box .con_box_txt {
        margin: 10px;
    }

    .amamori_content .amamori_block p {
        padding: 10px;
    }

    .amamori_content .amamori_block .amamori_con_imgbox {
        text-align: center;
        background: #E0F2FE;
    }

    .amamori_content .amamori_block .amamori_con_imgbox h3 {
        font-size: 20px;
    }
}