.ph{width: 94%; max-width: 1400px; margin: 0 auto;  font-size: 20px; letter-spacing: 0.1em; }

.ph * {transition: all 0.2s; }

.ph img{width: 100%;}

.ph-menu , .ph-group-title{display: none;}

.ph-group{display: flex; justify-content: space-between; flex-wrap: wrap;}


.ph-group-content{ width: 47%; display: flex;        padding: 3% 0;  }
.ph-group-content-photo{position: relative; width: 55%;    border:solid 2px white; border-radius: 10px; box-shadow: 0px 0px 7px #ff9d0c , 0px 0px 4px #ff9d0c;      align-self: flex-start;  }
.ph-group-content-photo a{ display: block; padding: 0.7em;  }
.ph-group-content-photo img{ border:solid 8px white; }

.ph-group-content-tag{ position: absolute; left: 0; top: 0; font-size: 85%; font-weight: bold; background: #ff9d0c; padding: 0.4em 1.2em; border-radius: 0 0 10px 0; }

.ph-group-content-text{position: relative; width: 45%; padding-left: 1em;    padding-top: 1em;   padding-bottom: 3em;color: white;}

.ph-group-content-text-name{display: block;  font-weight: bold; line-height: 1.2; color: white; }
.ph-group-content-text-sale{display: none;}
.ph-group-content-text-detail{ font-size: 70%; line-height: 1.5;     padding: 1em 0; }

.ph-group-content-text-price{ display: block; width: calc(100% - 1em); background: #feacff; color: black; font-weight: bold;  padding: 0.3em 0;     text-align: center; position: absolute; right: 0; bottom: 1em; }
.ph-group-content-text-price:after{content: ''; display: block; width: 100%; height: 100%; border:solid 1px #feacff; position: absolute; right: -0.2em; bottom: -0.2em; }
.ph-group-content-text-price:hover{ transform: translate(0.2em,0.2em); filter: brightness(1.1);}
.ph-group-content-text-price:hover:after{   right: -0.1em; bottom: -0.1em;  }
.ph-group-content-text-price span{font-size: 70%;}



@media screen and (max-width: 1400px){
    .ph{ font-size: 18px; }
}

@media screen and (max-width: 1200px){
    .ph-group-content{ width: 100%;     padding: 5% 0;}
}

@media screen and (max-width: 640px){
    .ph-group-content{flex-wrap: wrap;}
    .ph-group-content-photo , .ph-group-content-text{ width: 100%; }
    .ph-group-content{ padding: 7% 0; }
    .ph-group-content-text{    padding: 0.7em;}
    .ph-group-content-text-price{ position: inherit; right: inherit;  bottom: inherit; width: 100%; }
}




