@charset "utf-8";
main{
    background: url(../img/customer_review/bg.png) no-repeat top center / 100% auto;
}
.c-subhead-ttlwrap{
    background-image: url(../img/customer_review/head_bg.jpg);
}
.p-intro{
    position: relative;
    padding: 1.5rem 0 1rem;
}
.p-intro-deco{
    position: absolute;
    top: 0;
    left: 0;
    color: rgba(233,217,173,.4);
}
.p-review{
    padding-bottom: 1rem;
}
.p-review .c-inner{
    display: grid;
    gap: .4rem;
}
.p-review-conts{
    -webkit-box-shadow: 0 0 8px 2px rgba(63, 45, 41, .25);
    box-shadow: 0 0 8px 2px rgba(63, 45, 41, .25);
    display: grid;
    gap: .15rem;
    padding: .5rem;
}
.p-review-conts:nth-child(odd){
    background: #f9f4f0;
}
.p-review-conts:nth-child(even){
    background: #e7dcd2;
}
.p-review-conts-cus{
    width: min(100%,800px);
    margin: auto;
    color: #560707;
}
.p-review-conts-prob{
    width: min(100%,800px);
    margin: auto;
    background: #9d958f;
    color: #fff;
    text-align: center;
    padding: .2rem;
}
.p-review-conts-solu{
    width: min(100%,600px);
    min-height: 1rem;
    margin: auto;
    padding: .2rem .2rem .3rem;
    clip-path: polygon(0 0, 100% 0, 100% 50%, 50% 100%, 0 50%);
    background: linear-gradient(to right,#cc925e,#d5ae64);
    -webkit-box-shadow: 0 0 8px 2px rgba(63, 45, 41, .25);
    box-shadow: 0 0 8px 2px rgba(63, 45, 41, .25);
    color: #fff;
    text-align: center;
}
.p-review-conts-sup{
    text-align: center;
}
.p-review-conts-sup span{
    border-bottom: 1px solid #000;
    padding-bottom: .05rem;
}
.p-review-conts-cmt{
    display: flex;
    align-items: center;
    gap: calc(45px + .1rem);
}
.p-review-conts:nth-child(even) .p-review-conts-cmt{
    flex-direction: row-reverse;
}
.p-review-conts-cmt figure{
    flex: 0 0 1.5rem;
    text-align: center;
}
.p-review-conts-cmt p{
    flex: 1;
    padding: .3rem .5rem;
    position: relative;
}
.p-review-conts-cmt p::after{
    content: '';
    width: 45px;
    height: 45px;
}
.p-review-conts:nth-child(odd) .p-review-conts-cmt p{
    background: #e7dcd2 url(../img/customer_review/deco.png) no-repeat bottom right / .9rem auto;
}
.p-review-conts:nth-child(odd) .p-review-conts-cmt p::after{
    background: #e7dcd2;
    position: absolute;
    bottom: 0;
    left: -45px;
    clip-path: polygon(0 100%, 100% 60%, 100% 0);
}
.p-review-conts:nth-child(even) .p-review-conts-cmt p{
    background: #fcf9f6 url(../img/customer_review/deco02.png) no-repeat bottom left / .9rem auto;
}
.p-review-conts:nth-child(even) .p-review-conts-cmt p::after{
    background: #fcf9f6;
    position: absolute;
    bottom: 0;
    right: -45px;
    clip-path: polygon(0 0, 0 60%, 100% 100%);
}
@media only screen and (max-width: 1024px) {
    .p-intro{
        padding-top: 2rem;
    }
    .p-review-conts{
        gap: .2rem;
    }
    .p-review-conts-prob{
        text-align: left;
    }
    .p-review-conts-solu{
        padding-bottom: .5rem;
        clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 80%);
    }
    .p-review-conts-sup{
        text-align: left;
        margin-bottom: .5rem;
    }
    .p-review-conts-cmt{
        flex-direction: column-reverse;
    }
    .p-review-conts:nth-child(even) .p-review-conts-cmt{
        flex-direction: column-reverse;
    }
    .p-review-conts-cmt figure{
        flex: 1;
        width: 2.5rem;
    }
    .p-review-conts:nth-child(odd) .p-review-conts-cmt p::after{
        right: 0;
        left: auto;
        bottom: -45px;
        clip-path: polygon(0 0, 0 100%, 60% 0);
    }
    .p-review-conts:nth-child(even) .p-review-conts-cmt p::after{
        right: 0;
        bottom: -45px;
        clip-path: polygon(0 0, 0 100%, 60% 0);
    }
}