@charset "UTF-8";



.payment_cont{background:#fff7d1;}

.case{background:#FFF;margin-bottom:4rem;max-width:1000px;padding:2rem 1.25rem 1.25rem;box-shadow:0 0.5rem 0 #00000020;position:relative;}

.case h3{position:absolute;padding:1rem;font-size:1.5rem;color:#FFF;border-radius:1.5rem;margin:0;line-height:0.5;font-weight:bold;top:-1.5rem;left:-0.75rem;border:0;background:#000;}
.case.c1 h3{background:#7062cf;}
.case.c2 h3{background:#ff6498;}
.case.c3 h3{background:#ff6519;}
.case > .imgs{flex-shrink:0;margin-right:1rem;}
.case > .imgs img{max-width:100%;width:auto;height:auto;display:block;}
.case > .num{flex-grow:1;}
.case > .num > dl{background:#eee;position:relative;overflow:hidden;padding:0.66rem 1rem;box-sizing:border-box;}
.case > .num > dl dt{font-weight:bold;font-size:1.875rem;padding-left:3.25rem;margin-bottom:1.25rem;}
.case > .num > dl dt span{position:absolute;width:5rem;height:5rem;padding:0.75rem 1.25rem;box-sizing:border-box;border-radius:2.5rem;background:#FFF;left:-1.5rem;top:-1.5rem;display:flex;align-items:flex-end;line-height:1;justify-content:flex-end;}
.case > .num > dl dd{color:#333;line-height:1.5;}


.case.c1 > .num > dl:nth-child(1){background:#f1effa;}
.case.c1 > .num > dl:nth-child(2){background:#e2e0f5;}
.case.c1 > .num > dl:nth-child(3){background:#d4d0f1;}
.case.c2 > .num > dl:nth-child(1){background:#ffeff5;}
.case.c2 > .num > dl:nth-child(2){background:#ffe0ea;}
.case.c2 > .num > dl:nth-child(3){background:#ffd0e0;}
.case.c3 > .num > dl:nth-child(1){background:#fff0e8;}
.case.c3 > .num > dl:nth-child(2){background:#ffe0d1;}
.case.c3 > .num > dl:nth-child(3){background:#ffd1ba;}

.case.c1 > .num > dl dt span{color:#ff6498;}
.case.c2 > .num > dl dt span{color:#ff6519;}
.case.c3 > .num > dl dt span{color:#7062cf;}

.payment_cont h2{font-weight:bold;font-size:2rem;margin-bottom:2rem;}
.payment_cont dl.pnk dt{color:#FFF;background:#ff6498;font-size:1.25rem;font-weight:bold;text-align:center;padding:0.5rem 0;}
.payment_cont dl.org dt{color:#FFF;background:#ff6519;font-size:1.25rem;font-weight:bold;text-align:center;padding:0.5rem 0;}


@media screen and (min-width:751px){
.case{display:flex;}
.payment_cont dl.pnk dt,
.payment_cont dl.org dt{display:flex;height:4em;display:flex;justify-content:center;align-items:center;}



}

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

.payment_cont dl.pnk dt,
.payment_cont dl.org dt{margin-bottom:1rem;;}
.case > .num > dl+dl{margin-top:1rem;}
.case > .imgs{width:100%;margin:0 0 1rem;}

}