.ph * {
    transition: all 0.2s;
}


.ph {
    font-size: 20px;
}

.ph-menu {
    display: none;
}

.ph-group-title{
    text-align: center;
    font-size: 150%;
    font-weight: bold;
    letter-spacing: 0.4em;
    padding: 1em;
    border-top: dotted 1px #737373;
}
.ph .ph-group-title:nth-of-type(1){
    border-top: none;
}
.ph .ph-group-title img{display: none;}


.ph-group {
    display: flex;
    flex-wrap: wrap;
        justify-content: center;
}

.ph-group-content {
    position: relative;
    width: 25%;
    padding: 0 1.5% 1.5%;
}
.ph-group-content:hover{transform: translateY(5px);}
.ph-group-content:hover .ph-group-content-text-price{transform: scale(1.2);}

.ph-group-content-photo{ position: relative; }
.ph-group-content-photo img {
    width: 100%;
}

.ph-group-content-tag{
    position: absolute;
    left: 50%; bottom: 0; transform: translate(-50% , 50%);
    display: inline-block;
    background: #94793a;
    border-radius: 5em;
    color:white;
    font-size: 15px;
    padding: 0.4em 1em;
    white-space: nowrap;
}

.ph-group-content-text {
    padding: 20px 0;
}

.ph-group-content-text-name {
    display: block;
    font-weight: bold;
    line-height: 1.2;
    color: #544010;
}

.ph-group-content-text-detail {
    font-size: 15px;
    color: #737373;
    line-height: 1.5;
    padding: 20px 0;
}

.ph-group-content-text-price {
    display: block;
    font-weight: bold;
    font-size: 25px;
    color: #544010;
    text-align: center;
}

.ph-group-content-text-price span{
    font-size: 15px;
    font-style: normal;
}

.ph-group-content-text-price b {
    font-size: 14px;
    color: #666666;
    font-weight: normal;
    padding-left: 0.5em;
    text-decoration: line-through;
}


@media screen and (max-width: 1400px){
    .ph {font-size: 16px;}
    .ph-group-content-text-detail{    font-size: 14px; }
    .ph-group-content-text-price{font-size: 20px;}
}


@media screen and (max-width: 1280px){
    .ph-group-content{     width: 33%;  }
}

@media screen and (max-width: 768px){
    .ph-group{     flex-wrap: nowrap; justify-content: flex-start;     overflow-x: scroll; overflow-y: hidden; }
    .ph-group-content{     width: 85%; flex-shrink: 0; }
    .ph-group .ph-group-content:nth-of-type(1){margin-left: 7.5%;}
}




/*swiper*/
.swiperWrap{    position: relative; margin: 0 auto;     padding: 0 2%;}

/*.swiper-button-next, .swiper-container-rtl .swiper-button-prev{right: 0;  left: auto; transform: translateX(150%);}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{right: auto;  left: 0; transform: translateX(-150%);}
.swiper-pagination{ position: inherit; }
.swiper-pagination-bullet{margin: 4px;}*/