@charset "utf-8";
/* CSS Document */

/* main_view
   ========================================================================== */
.main_view {
    background-image: url("../images/webp/kv_bg01.webp");
}


/* footer
   ========================================================================== */
.footer_bg{
	background-image: url("../images/webp/footer_bg.webp");
}


/* ==========================================================================
    about_page
   ========================================================================== */
/* representative_message
   ========================================================================== */
.representative_message{
	margin: 0 0 0;
}

.representative_message .profile{
	margin: 0 0 0;
}

.representative_message .profile .left{
	width: 60vw;
}

.representative_message .profile .name{
	margin: 4vw 0 0;
    text-align: right;
}

.representative_message .profile .name img{
	width: 50vw;
}

.representative_message .profile .right{
	margin: 6vw 0 0;
}

.representative_message .profile .right .list{
	margin: 0 0 0;
}

.representative_message .profile .right .list > li{
	padding: 5vw;
    border: 1px solid #ddd;
}

.representative_message .profile .right .list > li + li{
	margin: 3vw 0 0;
}

.representative_message .profile .right .list li .ttl{
	font-size: 4vw;
    font-weight: 700;
    color: #BC1B21;
}

.representative_message .profile .right .list li p{
    margin: 3vw 0 0 3vw;
    line-height: 0;
}

.representative_message .bottom{
    margin: 6vw 0 0;
}

.representative_message .bottom .common_border_list{
    margin: 6vw 0 0;
}

.representative_message .bottom .common_border_list + p{
    margin: 6vw 0 0;
}


@media screen and (min-width: 500px) {


    /* ==========================================================================
        about_page
       ========================================================================== */
    /* representative_message
       ========================================================================== */
    .representative_message{
        margin: 0 0 0;
    }

    .representative_message .profile{
        display: flex;
    }

    .representative_message .profile .left{
        width: 30.0vw;
    }

    .representative_message .profile .name{
        margin: 2.0vw 0 0;
    }

    .representative_message .profile .name img{
        width: 22.3vw;
    }

    .representative_message .profile .right{
        margin: 0 0 0;
        padding: 0 0 0 3.0vw;
        width: calc(100% - 30.0vw);
        box-sizing: border-box;
    }

    .representative_message .profile .right .list{
        margin: 0 0 0;
    }

    .representative_message .profile .right .list > li{
        padding: 1.5vw 2.5vw 3.0vw;
    }

    .representative_message .profile .right .list > li + li{
        margin: 1.5vw 0 0;
    }

    .representative_message .profile .right .list li .ttl{
        font-size: 2.0vw;
    }

    .representative_message .profile .right .list li p{
        margin: 2.0vw 0 0 2.0vw;
        width: 50.7vw;
    }

    .representative_message .bottom{
        margin: 4.8vw 0 0;
    }

    .representative_message .bottom .common_border_list{
        margin: 3.0vw 0 0;
    }

    .representative_message .bottom .common_border_list + p{
        margin: 3.0vw 0 0;
    }

    

}
@media screen and (min-width: 1040px) {


    /* ==========================================================================
        about_page
       ========================================================================== */
    /* representative_message
       ========================================================================== */
    .representative_message{
        margin: 0 0 0;
    }

    .representative_message .profile{
        display: flex;
    }

    .representative_message .profile .left{
        width: 300px;
    }

    .representative_message .profile .name{
        margin: 20px 0 0;
    }

    .representative_message .profile .name img{
        width: 223px;
    }

    .representative_message .profile .right{
        margin: 0 0 0;
        padding: 0 0 0 30px;
        width: calc(100% - 300px);
        box-sizing: border-box;
    }

    .representative_message .profile .right .list{
        margin: 0 0 0;
    }

    .representative_message .profile .right .list > li{
        padding: 15px 25px 30px;
    }

    .representative_message .profile .right .list > li + li{
        margin: 15px 0 0;
    }

    .representative_message .profile .right .list li .ttl{
        font-size: 20px;
    }

    .representative_message .profile .right .list li p{
        margin: 20px 0 0 20px;
        width: 507px;
    }

    .representative_message .bottom{
        margin: 48px 0 0;
    }

    .representative_message .bottom .common_border_list{
        margin: 30px 0 0;
    }

    .representative_message .bottom .common_border_list + p{
        margin: 30px 0 0;
    }

    
}
