@charset "utf-8";

main {
    background: url(../images/aboutus.png) no-repeat top right;
    background-size: 85%;
    padding: 60% 0 0 20%;
}

.aboutus .text {
    position: relative;
    padding: 40px 35px;
    margin: 3% 15% 50px 0;
    max-width: 80%;
    background: rgb(255 255 255 / 0.6);
    border-radius: 6px;
}

.clients {
    text-align: center;
    margin-bottom: -15%;
}

.clients ul {
    position: relative;
    padding: 20px 30px;
    margin-top: -1%;
    background: #fff;
    border-radius: 6px;
    filter: drop-shadow(5px 5px 5px #c6c4a7);
}

.clients ul li {
    line-height: 1.5;
    padding: 0.5rem 0;
    border-bottom: dashed 1.5px #c6c4a7;
    list-style-type: disc;
    list-style-position: inside;
}

ul li:last-of-type {
    border-bottom: none;
}

.btn {
    display: inline-block;
    padding: 10px 40px;
    margin-right: 15%;
    margin-bottom: 10px;
    max-width: 85%;
    font-size: 1.125rem; /*18px相当*/
    font-weight: bold;
    letter-spacing: 0.05rem
}

.btn-border {
    border-radius: 30px;
    background: rgb(255 184 42 / 1);
    color: #fff;
}

.btn-border:hover {
    background: rgb(255 184 42 / 0.9);
    mix-blend-mode: multiply;
    text-shadow: 0 0 5px #fff;
}

@media (max-width: 600px){
    main {
        background-size: 92%;
    }

    .aboutus .text {
        position: relative;
        padding: 30px 20px;
        margin: 7% 10% 50px -5%;
        max-width: 95%;

    }

    .clients ul {
        margin-top: 3%;
    }

    .btn {
        display: inline-block;
        padding: 5px 24px;
        margin-top: -10px;
        margin-bottom: 5px;
        font-size: 1rem;
    }    
}