@charset "UTF-8";

/* product
----------------------------------------------- */
.top-products::after { display: none; }
.product-list .top-products-items { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: flex-start; align-items: flex-start; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.product-list .top-products-item { margin-bottom: 14vw; }
.product-list .top-products-item-title .en { width: fit-content; display: block; }
.product-list .top-products-item-title .jp { margin-bottom: 0; }
.product-list .more01 {width: 50vw;margin: 0;text-align: left;}
.product-list .more01 span {margin: 0;background: url(../../images/arrow-gray.png) no-repeat right top 1vw;background-size: 2.5vw;}

.second-text { width: 100%; }
.product p.sub-title { margin-bottom: 6vw; color: #bfa992; font-size: 6vw; font-family: "baskerville-urw"; font-weight: 400; letter-spacing: 0.04rem; }
.product .title {margin-bottom: 4vw;font-size: 4.6vw;font-family: var(--mincho);line-height: 1.6;}
.product .title b {margin-bottom: 4vw;display: block; text-decoration: underline;}
.product .title .jp { display: block; font-size: 7.6vw; }
.product .title .en { color: #bfa992; display: block; font-size: 80%; font-weight: normal;letter-spacing: .04rem; }
.product p.lead { margin-bottom: 6vw; font-size: 4.2vw; font-family: var(--mincho); line-height: 1.6; }
.product b { color: #c6050d; }

.product-intro { width: 90%; margin: 0 auto 12vw; }
.product-intro img { width: 100%; margin-bottom: 8vw; }

.product .recommend {margin-bottom: 10vw;padding: 16vw 0 2vw;background: url(../../images/menu/menulist-bg.jpg) no-repeat top center, #f9f7f4;background-size: 210%;}
.product .recommend p.sub-title { text-align: center; }
.product .recommend-text { width: 90%; margin: 0 auto; }
.product .recommend-text .title { text-align: center; }
.product .recommend-text .jp { font-size: 6vw; }
.product .recommend-inner { margin-bottom: 10vw; padding: 4vw; background: #fff; }
.product .recommend-inner { margin-bottom: 10vw; padding: 4vw; background: #fff; }
.product .recommend-inner li { margin-bottom: 3vw; padding-left: 5vw; font-size: 3.5vw; position: relative; }
.product .recommend-inner li:last-child { margin-bottom: 0; }
.product .recommend-inner li:before {content: '';width: 14px;height: 12px;background: url(../../images/product/check.png)no-repeat center / cover;position: absolute;top: 50%;left:0;transform: translateY(-50%);-webkit-transform: translateY(-50%);}
.product .recommend-content  { width: 90%; margin: 0 auto 16vw; }
.product .recommend-content img { width: 100%; margin: 0 auto; }
.product .recommend-content dl {margin: 0 auto 8vw;padding: 8vw 0 2vw;background: #fff;position: relative;}
.product .recommend-content dt { margin-bottom: 2vw; color: #b62c34; font-size: 5vw; font-family: var(--mincho); font-weight: 600; line-height: 1.6; text-align: center; position: relative; }
.product .recommend-content dt span {margin: 0 auto 2vw;padding: 4% 0;font-size: 7vw;font-family: "baskerville-urw";font-weight: 400;line-height: 1;text-align: center;border-radius: 50%;display: block;position: absolute;top: -180%;left: 50%;transform: translateX(-50%);-webkit-transform: translateX(-50%);}
.product .recommend-content dt span::after { content: ''; width: 15vw; height: 15vw; border-radius: 50%; background: #fff; position: absolute; top: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); z-index: -1; }
.product .recommend-content dd { width: 90%; margin: 0 auto 4vw; }
.product .recommend-content dd img { width: 12%; margin: 0 auto 4vw; }

.product .treatment { padding: 6vw 0; background: #fefdf5; }
.product .treatment p.sub-title { margin-bottom: 4vw; text-align: center; }
.product .treatment .title .jp { text-align: center; }
.product .treatment img { width: 100%; }
.product .treatment .recommend-content dt { font-size: 4.6vw; }
.product .treatment .recommend-content dt span { top: -100%; }

.product .detail { width: 90%; margin: 0 auto; }
.product .detail img { width: 100%; margin-bottom: 6vw; }
.product .detail li { margin-bottom: 4vw; font-size: 3.6vw; line-height: 1.6; }
.product .detail .price { font-size: 6vw; font-weight: bold; }
.product .detail .price span {padding: 2vw 4vw 0 0;color: #000;font-size: 5vw;background: none;display: inline-block;}
.product .detail li span { width: fit-content; margin-bottom: 2vw; padding: 2vw 4vw; display: block; color: #fff; font-size: 3.6vw; font-weight: bold; background: #bfa992; }
.product .contact-area { padding: 8vw 5vw; border: 1px solid #000; }
.product .contact-area dt {width: fit-content;margin: 0 auto 4vw;padding: 2vw 4vw;display: block;color: #fff;font-size: 4vw;font-weight: bold;line-height: 1.6;background: #bfa992;}
.product .contact-area dd { text-align: center; line-height: 1.8; }
.product .contact-area dd a { width: 60vw; margin: 6vw auto 0; color: #fff; font-weight: bold; background: #b62c34; }
.product .contact-area dd .more01 span {background: url(../../images/arrow-white.png) no-repeat right top 2.5vw;background-size: 2.5vw;}

/* =============================================
pc-size 
================================================*/
@media screen and (min-width: 900px) {
.product-list .top-products-content { width: 90%; max-width: 1200px; margin: auto; }
.product-list .top-products-items { width: 100% }
.product-list .top-products-item { width: 31%; margin: 0; }
.product-list .top-products-item-title .jp { margin-bottom: 0; font-size: 24px; }
.product-list .more01 { width: 280px; }
.product-list .more01 span { background: url(../../images/arrow-gray.png) no-repeat top 4px right; background-size: 8px; }

.product p.sub-title { margin-bottom: 40px; font-size: 24px; }
.product .title { margin-bottom: 20px; font-size: 18px; }
.product .title b { margin-bottom: 20px; }
.product .title .jp { font-size: 36px; }
.product .title .en { font-size: 20px; }
.product p.lead {margin-bottom: 30px;font-size: 20px;}

.product-intro { margin-bottom: 60px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.product-intro img { width: 40%; margin-bottom: 40px; }
.product-intro p.sub-title { font-size: 24px; }
.product-intro .title { margin-bottom: 60px; position: relative; }
.product-intro .title::after { content: ''; width: 50px; height: 0.5px; background: #000; position: absolute; bottom: -20px; left: 0; }
.product-intro .intro-text { width: 54%; margin-bottom: 40px; }
.product-intro p.lead { font-size: 20px; }
.product-intro p { font-size: 15px; }

.product .recommend { margin-bottom: 80px; padding: 80px 0; }
.product .recommend-text .jp { font-size: 24px; }
.product .recommend-inner {margin-bottom: 50px;padding: 20px 0 20px 50px;display: -webkit-box;display: -webkit-flex;display: flex;-webkit-justify-content: space-around;justify-content: space-around;-webkit-align-items: center;align-items: center;-webkit-flex-wrap: wrap;flex-wrap: wrap;}
.product .recommend-inner li {width: 24%;margin-bottom: 0;padding-left: 20px;font-size: 15px;}
.product .recommend-inner li:before { width: 14px;height: 12px; }
.product .recommend-content { width: 100%; margin-bottom: 0; }
.product .recommend-content ul { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.product .recommend-content li { width: 24%; }
.product .recommend-content dl { margin: 0 auto; padding: 30px 0 10px; }
.product .recommend-content dt { margin-bottom: 10px; font-size: 18px; }
.product .recommend-content dt.l02 { margin-bottom: 14px; font-size: 15px; line-height: 1.8; }
.product .recommend-content dt span { margin: 0 auto 10px; padding: 12px 0; font-size: 24px; top: -52px; }
.product .recommend-content dt span::after { width: 40px; height: 40px; top: 6px; }
.product .recommend-content dd { width: 90%; margin: 0 auto 20px; }
.product .recommend-content dd p { font-size: 15px; }
.product .recommend-content dd img { width: 40px; margin: 0 auto 20px; }

.product .treatment { padding: 80px 0; }
.product .treatment p.sub-title { margin-bottom: 18px; }
.product .treatment .recommend-content dt { font-size: 16px; }
.product .treatment .recommend-content dt span { top: -100%; }
.product .recommend-inner.herb-recommend-inner li { width: 32%; line-height: 1.6; }

.product .detail .detail-inner { margin-bottom: 30px; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: flex-start; align-items: flex-start; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.product .detail img {width: 58%;margin-bottom: 0;order: 1;}
.product .detail dl {width: 40%;}
.product .detail ul li:nth-child(4) { margin-bottom: 20px; }
.product .detail li { margin-bottom: 10px; font-size: 15px; }
.product .detail li span { margin-bottom: 10px; padding: 10px 20px; font-size: 16px; }
.product .detail .price { margin-bottom: 10px; font-size: 24px; }
.product .detail .price span { padding: 10px 20px 10px 0; font-size: 18px; }
.product dl.contact-area { width: 100%; padding: 50px 0; }
.product .contact-area dt { width: 60%; margin: 0 auto 30px; padding: 10px 20px; font-size: 18px; text-align: center; }
.product .contact-area dd { font-size: 16px; line-height: 2; }
.product .contact-area dd a { width: 320px; margin: 40px auto 0; }
.product .contact-area dd .more01 span { background: url(../../images/arrow-white.png) no-repeat top 11px right; background-size: 8px; }

@media screen and (min-width: 900px) {
.product .treatment .recommend-content { width: 1200px; margin: auto; }
}
@media screen and (min-width: 1000px) {
.product .detail { width: 1000px; margin: 0 auto; }
.product .recommend-inner { padding: 20px 20px 20px 80px; }
.product .recommend-inner li { width: 24%; font-size: 15px; }
.product .recommend-inner.herb-recommend-inner li { width: 26%; line-height: 1.6; }
}

@media screen and (min-width: 1300px) {
.product .product-intro,.product .recommend-content,.product .recommend-inner,.product .detail { width: 1200px; margin: 0 auto 50px; }
}
}

/* retina用
----------------------------------------------- */ 
@media screen and (min-width: 736px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 736px) and (min-resolution: 2dppx) {
.more01 span { background: url(../../images/arrow-gray@2x.png) no-repeat top 4px right; background-size: 8px; } 
}