@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Libre+Caslon+Text&family=Noto+Sans+JP:wght@300;500;700&family=Noto+Serif+JP:wght@600;700;900&display=swap');
/* -----------------------------------------------------
X special care series (updated on 2025.07.10)
----------------------------------------------------- */
/* letter spacing --------------------------------------- */
.ls3 {letter-spacing: 3px;}
/* series_feature
----------------------------------------------------- */
.series_feature {padding: 0 15px; overflow-x: hidden;}
.series_feature span {border: 0; padding: 0; font-size: 1em;}
.series_feature em {font-style: normal;}
.series_feature a:hover {text-decoration: none;}
.series_feature .font_sans {font-family: 'Noto Sans JP', sans-serif; font-weight: 300;}
.series_feature .font_serif {font-family: 'Noto Serif JP', serif; font-weight: 600;}/* for Android */
.series_feature sup {font-size: 0.6em; line-height: 0;}.series_feature p {margin: 0; padding: 0;}
.series_feature li {margin: 0;}
.series_feature h1,
.series_feature h2,
.series_feature h3,
.series_feature h4 {border: 0; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; margin: 0; padding: 0; background: none; letter-spacing: 0;}
.series_feature .font_sans {font-family: 'Noto Sans JP', sans-serif; font-weight: 300;}
.series_feature .font_serif {font-family: 'Noto Serif JP', serif; font-weight: 600;}/* for Android */
/* Category Header
----------------------------------------------------- */
.series_cat_hdr {position: relative; padding: 40px 0;}
.series_cat_hdr .cat_hdr_ttl {border: 1px solid #aaa; border-left: 0; padding: 7px 7px 7px 75px; text-align: left; border-radius: 0 3px 3px 0; font-size: 1.1em;}
.series_cat_hdr .cat_hdr_pic {position: absolute; top: 25px; left: 0; aspect-ratio: 1 / 1;}
.series_cat_hdr .cat_hdr_pic img {width: 65px; height: auto;}
/* Item Feature
----------------------------------------------------- */
.item_feature .simple_txt {margin: 0 0 1em; font-size: min(4.26vw,16px); line-height: 1.5;}
.item_feature .simple_txt_ant {font-size: min(2.66vw,10px); line-height: 1.3; color: #333;}
.item_feature .feat_ant {font-size: min(3.2vw,12px); line-height: 1.33;}
.item_feature_main {padding: 0 15px;}
/* Title
----------------------------------------------------- */
.item_feature_head {margin-right: 15px; margin-left: 15px;}
/* tokucho_ttl
----------------------------------------------------- */
.tokucho_ttl {position: relative; text-align: center; padding: 0 0 10px; margin: 0 auto;}
.tokucho_ttl .num {position: relative; display: inline-block; z-index: 2;}
.tokucho_ttl .num:after {margin: -35px 0 0 -32px; padding: 0 35px 0 32px; content: " "; display: block; width: 100%; border-bottom: 1px solid #C3984D; z-index: 1;}
.tokucho_ttl .num .num01 {font-size: 1.3em !important; font-style: oblique; color: #C3984D; padding: 0 0 0 10px !important; background: #ffffff; vertical-align: middle;}
.tokucho_ttl .num .num02 {font-size: 3em !important; font-style: oblique; color: #C3984D; background: #ffffff; vertical-align: middle;}
.tokucho_ttl .txt {font-size: 1.35em !important; line-height: 1.4; letter-spacing: 0; margin: 25px 0;}
/* Item Use
----------------------------------------------------- */
.item_use_info {padding: 0 15px;}
.item_use_info .use_info_txt {font-size: min(4.26vw,16px); line-height: 1.68;}
.item_use_info .use_info_list {padding: 10px 0;}
.item_use_info .use_info_list li {font-size: min(4.26vw,16px); line-height: 1.3; margin: 0 0 7px 1em; list-style-type: disc;}
.item_use_info .use_info_movie iframe {display: block; width: 100%; height: auto; aspect-ratio: 16 / 9;}
/* Item FAQ
----------------------------------------------------- */
.item_faq {}


/* ====================================================== Media Querie
641px〜
TB , PC 
======================================== */
		@media screen and (min-width: 641px) {
.tb-pc_none {display: none;}
.series_feature {width: 600px; margin: 0 auto;}
.series_c-product .block-contents-4 {width: 90% !important;}
.series_feature {width: 600px; margin-right: auto; margin-left: auto;}
/* Category Header
----------------------------------------------------- */
.series_cat_hdr {padding: 70px 0;}
.series_cat_hdr .cat_hdr_ttl {padding: 10px 10px 10px 110px; font-size: 1.5em;}
.series_cat_hdr .cat_hdr_pic {top: 50px;}
.series_cat_hdr .cat_hdr_pic img {width: 95px;}
/* Item Feature
----------------------------------------------------- */
.item_feature .simple_txt {font-size: min(1.25vw,18px);}
.item_feature .simple_txt_ant {font-size: min(0.902vw,13px);}
/* tokucho_ttl
----------------------------------------------------- */
.tokucho_ttl .txt {margin: 25px 0;}
/* Item Use
----------------------------------------------------- */
.item_use_info {padding: 40px 0 0 0;}
.item_use_info .use_info_txt {font-size: min(1.25vw,18px); line-height: 1.5;}
.item_use_info .use_info_list {padding: 10px 0 20px;}
.item_use_info .use_info_list li {font-size: min(1.25vw,18px); line-height: 1.5; margin: 0 0 5px 1em;}
.item_use_info .use_info_movie iframe {max-width: 560px; margin: 0 auto;}
/* Item FAQ
----------------------------------------------------- */
.item_faq {}

		}
/* ====================================================== Media Querie
1025px〜
PCのみ
======================================== */
		@media screen and (min-width: 1025px) {
/* Wide 960px Area
----------------------------------------------------- */
.series_feature {width: 960px; margin-right: auto; margin-left: auto;}
/* tokucho_ttl
----------------------------------------------------- */
.tokucho_ttl .txt {font-size: 1.6em;}
		}

/* ======================================================================

+++ 商品ラインナップ updated on 2025.08.28

====================================================================== */
#series_obagix_specialcare .block-contents-4 #itemlist01 {display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-align: stretch; align-items: stretch; -webkit-box-pack: center; justify-content: center;}
/* 250828 テスト環境で既存品を非表示にするためにいれています。本番は不要。 */
#series_obagix_specialcare .block-contents-4 .series-inner a.block-cts[href*="dermaadvancedlift"],
#series_obagix_specialcare .block-contents-4 .series-inner a.block-cts[href*="dermaadvancedlift_refill"] {display: none;}
/* シリーズページ：アドバンスドリフトレフィル ----------------------------------------
#series_obagix_specialcare .block-contents-4 .series-inner a.block-cts[href*="dermaadvancedlift_refill"] .block-inner .img-name-item span span {display: block;} */

/* 商品詳細：バイタライズリフトクリーム ＜共通＞ ==================================== */
/* Concept --------------------------------------- */
.x_cream_cncpt {padding: min(16vw,120px) min(4vw,30px) min(2.66vw,20px);}
.x_cream_cncpt .cncpt_item_pic {text-align: center;}
.x_cream_cncpt .cncpt_item_pic img {width: min(40vw,300px); height: auto;}
.x_cream_cncpt .cncpt_item_cpy {font-size: min(6.8vw,32px); line-height: 1.5; text-align: center; padding: 0 0 min(5.33vw,40px);}
.x_cream_cncpt .cncpt_item_dtl {max-width: 660px; border: 1px solid #000; padding: min(2.4vw,18px); margin: 0 auto min(5.33vw,40px); text-align: center;}
.x_cream_cncpt .cncpt_item_dtl .item_name,
.x_cream_cncpt .cncpt_item_dtl .item_price {font-size: min(3.8vw,22px); line-height: 1.5;}
.x_cream_cncpt .cncpt_item_dtl .item_ant {font-size: min(3vw,12px); line-height: 1.5; padding: 5px 0 0;}
.x_cream_cncpt .cncpt_ant {max-width: 680px; margin: 0 auto; font-size: min(2.5vw,12px); line-height: 1.6; text-align: center; font-family: sans-serif; }
/* Movie --------------------------------------- */
.x_cream_mov {max-width: 700px; margin: 0 auto; padding: min(8vw,60px) 0 min(16vw,120px);}
.x_cream_mov .mov_frame {padding: 0 min(8vw,60px);}
.x_cream_mov .mov_frame iframe {aspect-ratio: 9 / 16; width: 100%; height: auto;}
/* Point --------------------------------------- */
.x_cream_point {max-width: 750px; margin: 0 auto;}
.x_cream_point .point_box {position: relative; padding: 0 min(4vw,30px) min(13.3vw,100px);}
.x_cream_point .point04 {padding-bottom: 0;}
.x_cream_point .point_box .point_hdr {padding: min(5.33vw,40px) 0 0;}
.x_cream_point .point_box .point_hdr .txt,
.x_cream_point .point_box .point_txt {display: block; font-size: min(4.2vw,22px); line-height: 1.5; text-align: center; margin: 0 0 min(6.4vw,48px);}
.x_cream_point .point_box .point_hdr strong {display: block; font-size: min(8vw,32px); line-height: 1.125; text-align: center; margin: 0 0 min(6.4vw,48px);}
.x_cream_point .point_box .point_hdr .mark {font-size: 85% !important; vertical-align: top; position: relative; top: -0.2em;}
.x_cream_point .point_box .point_pic {text-align: center; margin: 0 0 min(6.4vw,48px);}
.x_cream_point .point_box .point_ant {font-family: sans-serif; font-size: min(2.5vw,12px); line-height: 1.5; text-align: center; color: #333;}

.x_cream_point .point01 .point_pic img,
.x_cream_point .point03 .point_pic img,
.x_cream_point .point04 .point_pic img {max-width: min(32vw,240px); height: auto;}
.x_cream_point .point02 .point_pic img {max-width: min(50vw,380px); height: auto;}
/* Method --------------------------------------- */
.x_cream_method {max-width: 750px; margin: 0 auto; padding: min(8vw,60px) 0;}
.x_cream_method .mthd_ttl {font-size: min(8vw,32px); line-height: 1.125; padding: 0 0 min(8vw,60px); text-align: center;}
.x_cream_method .mthd_point {max-width: 614px; background-color: #f4f1f1; padding: min(5vw,38px) min(5vw,38px) min(2.66vw,20px);}
.x_cream_method .mthd_point .mthd_p_ttl {font-size: min(5.4vw,28px); line-height: 1; color: #bf912e; padding: 0;}
.x_cream_method .mthd_p_main {display: -webkit-box; display: flex; flex-wrap: nowrap;}
.x_cream_method .mthd_point .mthd_p_txt {width: 72%; font-size: min(3.8vw,20px); color: #333; line-height: 1.5; padding: min(4vw,30px) 0 0;}
.x_cream_method .mthd_p_main .mthd_p_pic {width: 28%;}
.x_cream_method .mthd_p_main .mthd_p_pic img {width: 100%; height: auto;}

.x_cream_method .mthd_point01 {margin: 0 auto min(2.66vw,20px);}
.x_cream_method .mthd_point02 {margin: 0 auto min(5.33vw,40px);}

.x_cream_method .mthd_step {max-width: 690px; margin: 0 auto;}
.x_cream_method .mthd_step .mthd_s_ttl {background-color: #c0aa7d !important; padding: 0 0 0 min(4.8vw,36px);}
.x_cream_method .mthd_step .mthd_s_ttl .ttl_num {display: inline-block; color: #fff; font-family: 'Jost', 'Noto Sans JP', sans-serif; font-size: min(5.4vw,30px); line-height: 1.66; font-weight: 400;}
.x_cream_method .mthd_step .mthd_s_ttl .ttl_sub {display: inline-block; vertical-align: bottom; font-size: min(4vw,22px); color: #333; line-height: 1; padding: 0 0 0.6em 1em !important;}
.x_cream_method .mthd_step .mthd_s_main {display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; padding: min(3vw,23px) min(4.6vw,35px); background-color: #f4f1f1;}
.x_cream_method .mthd_step .mthd_s_main:nth-of-type(2) {padding-top: 0;}
.x_cream_method .mthd_step .mthd_s_main .content_left {width: min(60vw,450px);}
.x_cream_method .mthd_step .mthd_s_main .content_left .left_with_point {width: min(50vw,375px); display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-pack: justify; justify-content: space-between; background-color: #fff; border-radius: min(0.66vw,5px); padding: min(1.33vw,10px);}
.x_cream_method .mthd_step .mthd_s_main .content_left .point_txt {width: min(30.9vw,232px);}
.x_cream_method .mthd_step .mthd_s_main .point_txt_ttl {display: inline-block; font-family: 'Jost', 'Noto Sans JP', sans-serif;  font-weight: 400; font-size:  min(4.4vw,28px); line-height: 1.2; border-bottom: 1px solid #231815; margin: 0 0 min(2.4vw,18px);}
.x_cream_method .mthd_step .mthd_s_main .point_txt_main {font-size: min(3vw,20px); line-height: 1.4; color: #231815; white-space: nowrap;}
.x_cream_method .mthd_step .mthd_s_main .content_left .point_pic {width: min(18.6vw,140px);}
.x_cream_method .mthd_step .content {font-size: min(3.8vw,20px); color: #333; line-height: 1.5;}
.x_cream_method .mthd_step .mthd_s_main .content_right {width: min(17.3vw,130px); padding: 0 min(1.73vw,13px) 0 0;}
.x_cream_method .mthd_step .mthd_s_btm img {width: 100%; height: auto;}
/* Apply --------------------------------------- */
.x_cream_apply {max-width: 700px; margin: 0 auto; padding: min(8vw,60px) 0 min(16vw,120px); text-align: center;}
.x_cream_apply .apply_ttl {padding: 0 0 min(5.33vw,40px);}
.x_cream_apply .apply_ttl .txt_ja {display: block; font-size: min(5vw,32px);  line-height: 1; color: #333;}
.x_cream_apply .apply_mov iframe {aspect-ratio: 9 / 16; width: 100%; height: auto;}


/* 商品詳細：アイクリーム #eyecream ＜共通＞ ==================================== */
/* ---------------------- Detail ---------------------- */
#eyecream .detail-section .item_detail .item_copy {display: block; font-size: 2.7em; line-height: 1.2; padding: 0 0 28px !important; margin: 0 !important;}
#eyecream .stem_build_complex {padding: 0 0 40px;}
#eyecream .stem_build_complex .bnr img {width: 100%; height: auto; margin: 0 0 15px;}
#eyecream .stem_build_complex p {text-align: center;}
#eyecream .detail-section .item_detail .item_pic {float: left;}
#eyecream .detail-section #item1 .item_pic img {width: 100%; height: auto; max-width: 310px;}
#eyecream .detail-section #item2 .item_pic img {width: 100%; height: auto; max-width: 270px;}
#eyecream .detail-section #item1 .item_txt {padding: 36px 0 0;}
#eyecream .detail-section #item2 .item_txt {padding: 14px 0 0;}
#eyecream .detail-section .item_detail .item_txt p {margin: 0;}
#eyecream .detail-section .item_detail .item_essential {display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-align: end; align-items: flex-end; -webkit-box-pack: center; justify-content: center; padding: 0 0 54px;}
#eyecream .detail-section .item_detail #essential1 .left {width: calc((100% - min(30.6vw,230px))/2); text-align: center;}
#eyecream .detail-section .item_detail #essential1 .center {width: min(30.6vw,230px); text-align: center;}
#eyecream .detail-section .item_detail #essential1 .right {width: calc((100% - min(30.6vw,230px))/2); text-align: center;}
#eyecream .detail-section .item_detail #essential1 dt {line-height: 1.2; padding: 0 0 12px; margin: 0; color: #000; border: 1px solid #f000;}
#eyecream .detail-section .item_detail #essential1 dd {display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; background: #e6d9c7; padding: 0; margin: 0 0 2px;}
#eyecream .detail-section .item_detail #essential1 dd:nth-last-of-type(1) {margin: 0;}
#eyecream .detail-section .item_detail #essential1 dd .txt {display: block; line-height: 1.2; color: #000;}
#eyecream .detail-section .item_detail #essential1 dd .txt .ant {font-size: 0.8em;}
#eyecream .detail-section .item_detail #essential1 .left dd {height: 54px;}
#eyecream .detail-section .item_detail #essential1 .right dd.L1 {height: 22px;}
#eyecream .detail-section .item_detail #essential1 .right dd.L2 {height: 38px;}
#eyecream .detail-section .item_detail #essential2 {width: 100%;}
#eyecream .detail-section .item_detail #essential2 ul {display: -webkit-box; display: flex; flex-wrap: wrap;}
#eyecream .detail-section .item_detail #essential2 ul li {position: relative; background: #e6d9c7; width: calc(50% - 2px); text-align: center; color: #000; border-bottom: 2px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #fff; }
#eyecream .detail-section .item_detail #essential2 ul li.list03 {background: #b40000 url(/-/media/obagi/derma-powerx/bg_dtl_cream_SBC.png) center top no-repeat; background-size: auto 100%;}
#eyecream .detail-section .item_detail #essential2 ul li .txt {display: block; line-height: 1.2;}
#eyecream .detail-section .item_detail #essential2 ul li .txt .ant {font-size: 0.8em;}
#eyecream .detail-section .item_detail #essential2 ul li.list03 .txt {color: #fff; letter-spacing: -1px;}
#eyecream .detail-section .item_detail #essential2 ul li.list04 .txt {letter-spacing: -1px;}
#eyecream .detail-section #stem_build_complex {text-align: center;}
#eyecream .detail-section #stem_build_complex img {width: 100%; max-width: 798px; height: auto; margin-bottom: 1em;}
/* 使い方 ----------------------------------------------------- */
.howto-section {text-align: center; margin: 0 auto;}
.howto-section .ttl {text-align: center;}
.howto-section .ttl .txt .inr {display: inline-block; font-size: 1.8em; line-height: 1.0; color: #7c6555; background-color: #fff; padding: 0 20px; white-space: nowrap !important;}
#advancedlift .howto-section .ttl .txt .inr {font-size: 1.2em;}
.howto-section .ttl .txt:after {content: ""; display: block; width: 40%; margin: -1rem auto; border-top: 1px solid #7c6555;}
.howto-section .dtl {line-height: 1.6; margin-top: 0;}
.howto-section .dtl .item_name {margin: 0 0 15px; font-size: 1em;}
.howto-section .dtl .pic {text-align: center; margin: 0 0 20px;}
.howto-section .dtl .pic img {width: 118px; height: auto;}
.howto-section .dtl .txt {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.9em; text-align: left; margin: 0; padding: 0 20px 20px;}
.howto-section .dtl .txt .meyasu {border-radius: 6px; background-color: #e5e0dd; padding: 20px 4px; text-align: center; width: 40%;}
.howto-section .dtl .txt .meyasu .meyasu_ttl {border-bottom: 1px solid #c5bbb4; padding: 0 0 6px; margin: 0;}
.howto-section .dtl .txt .meyasu .illust {padding: 15px 0;}
#advancedlift .howto-section .dtl .txt .meyasu .illust img {width: 26px;}
.howto-section .dtl .txt .meyasu .size {font-size: 0.95em;}
.howto-section .dtl .txt .dcp {width: 60%; padding-left: 20px;}
.howto-section .dtl .txt .dcp em {color: #e62388; font-style: normal;}
.howto-section .dtl .txt .ant {font-size: 0.85em; padding-top: 10px;}
#eyecream .item_all_ant {font-size: min(2.5vw,12px); line-height: 1.5;}
/* 商品詳細：ディープアドバンスドリフト セラム ＜共通＞ ======================================= */
#deepserum img {width: 100%; height: auto;}
/* Recommendation --------------------------------------- */
#deepserum_rcmd {padding: 0 0 min(16vw,60px);}
#deepserum_rcmd .rcmd_hdr {font-size: min(5.33vw,20px); line-height: 1.4; text-align: center; margin: 0 0 min(3.73vw,14px);}
#deepserum_rcmd .rcmd_ttl {font-size: min(8.53vw,32px); line-height: 1; text-align: center; font-weight: 600; margin: 0 0 min(6.4vw,24px);}
#deepserum_rcmd .rcmd_list {padding: 0 min(4.26vw,16px);}
#deepserum_rcmd .rcmd_list .rcmd_list_inr {padding: min(8.53vw,32px) 0 min(3.2vw,12px) min(5.86vw,22px);}
#deepserum_rcmd .rcmd_list ul li { font-size: min(4.8vw,18px); line-height: 1.44; background: url(/-/media/obagi/promotion/xserum/ico_ck.svg) left top no-repeat; background-size: min(9.6vw,36px) auto; padding: 0 0 min(4.8vw,18px) min(12vw,45px);}
#deepserum_rcmd .rcmd_list ul li strong {font-size: 1.25em; background: linear-gradient(transparent 50%, rgba(255, 212, 214, 0.8) 50%);}
#deepserum_rcmd .rcmd_list .rcmd_ant {text-align: right; font-size: min(2.66vw,10px); line-height: 1.3; padding: min(2.13vw,8px) 0 0;}
/* Feature --------------------------------------- updated on 2025.07.15 */
#deepserum_fet .fet_box {text-align: center; padding: 0 min(4.26vw,16px);}
#deepserum_fet .fet_box.fet05 {margin: 0 0 min(8.53vw,32px);}
#deepserum_fet .fet_box .fet_box_inr {position: relative; padding: min(11.73vw,44px) 0 min(12.2vw,46px);}
#deepserum_fet .fet_box .point_catch {font-size: min(4.26vw,16px); line-height: 1.5; margin: 0 0 min(1.06vw,4px);}
#deepserum_fet .fet_box .point_ttl {font-size: min(6.93vw,26px); line-height: 1.3; text-align: center; margin: 0 0 min(5.33vw,20px);}
#deepserum_fet .fet_box .point_txt {font-size: min(4.26vw,16px); line-height: 1.875; padding: 0 0 min(5.86vw,22px);}
#deepserum_fet .fet_box .point_txt strong {color: #cd020d;}
#deepserum_fet .fet_box .point_main_pic {text-align: center;}
#deepserum_fet .fet_box.fet01 .point_main_pic img {width: min(54.4vw,204px);}
#deepserum_fet .fet_box.fet02 .point_main_pic img,
#deepserum_fet .fet_box.fet03 .point_main_pic img {width: min(57.33vw,215px);}
#deepserum_fet .fet_box.fet04 .point_main_pic img {width: min(66.66vw,250px);}
#deepserum_fet .fet_box.fet05 .point_main_pic img {width: min(42.6vw,160px); margin: 0 0 min(8.53vw,32px);}
#deepserum_fet .fet_box.fet02 .point_list {display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; padding: 0 min(4.93vw,18.5px); margin: 0 0 min(7.46vw,28px);}
#deepserum_fet .fet_box.fet02 .point_list li {width: calc(50% - min(14.28vw,5px)); margin: 0 min(7.14vw,2.5px) min(1.6vw,6px);}
#deepserum_fet .fet_box.fet02 .point_list li p {background-color: #ec9fa3; border-radius: min(1.06vw,4px); color: #fff; font-weight: 700; font-size: min(3.46vw,13px); line-height: 2.38;}
#deepserum_fet .fet_box.fet05 .point_list {margin-left: 1.6em;}
#deepserum_fet .fet_box.fet05 .point_list li {list-style-type: disc; font-size: min(3.73vw,14px); line-height: 1.78;  text-align: left; margin: 0 0 1em;}

#deepserum_fet .point_ant {font-size: min(1.8vw,12px); line-height: 1.3; color: #333; padding: min(2.13vw,8px) min(4.26vw,16px) min(11.2vw,42px); text-align: right;}
/* Method --------------------------------------- */
#deepserum_method .mtd_step {margin: min(5.86vw,22px) min(4.26vw,16px) 0;}
#deepserum_method .mtd_step01 {border-bottom: 1px dashed #987949;}
#deepserum_method .mtd_step_sp {padding: 0 min(5.86vw,22px) min(4.8vw,18px) 0; text-align: right;}
#deepserum_method .mtd_step .mtd_step_sp{text-align: center;}
#deepserum_method .mtd_step01 .mtd_step_sp img {width: min(66.13vw,248px);}
#deepserum_method .mtd_step02 .mtd_step_sp img {width: min(68.26vw,256px);}
#deepserum_method .mtd_txt {font-size: min(3.73vw,14px); line-height: 1.78; padding: 0 0 min(3.73vw,14px); font-weight: 500;}
#deepserum_method .mtd_point_wrap {padding: min(8vw,30px) min(4.26vw,16px) min(5.86vw,22px);}
#deepserum_method .mtd_point {border-radius: min(4.26vw,16px); border: 1px solid #987949; padding: min(8vw,30px) 0 min(6.93vw,26px);}
#deepserum_method .mtd_point .p_ttl {text-align: center;}
#deepserum_method .mtd_point .p_ttl img {width: min(71.2vw,267px);}
#deepserum_method .mtd_point .p_txt {font-size: min(3.73vw,14px); line-height: 1.78; font-weight: 500; padding: min(3.73vw,14px) min(9.6vw,36px) min(4.8vw,18px);}
#deepserum_method .mtd_point .p_pic {text-align: center;}
#deepserum_method .mtd_point .p_pic img {width: min(25vw,94px);}

/* 商品詳細：リップエッセンス #lipessence ＜共通＞ ======================================= */
#lipessence .feature_main #feature_lip {border: 1px solid #987949; text-align: center; border-radius: 10px;}
#lipessence .feature_main #feature_lip .feature-ttl {font-weight: 500; color: #987949;}
#lipessence .feature_main #feature_lip p .element {display: inline-block; border: 1px solid #fff;}
#lipessence .feature_main .item_end_ant  {font-size: min(2vw,12px); line-height: 1.5;}

/* Media Querie
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 
SP ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
		@media screen and (max-width: 640px) {
/* シリーズページ：アドバンスドリフトレフィル ---------------------------------------- */
#series_obagix_specialcare .block-contents-4 .series-inner a.block-cts[href*="dermaadvancedlift"] .block-inner .img-name-item {letter-spacing: -1px;}
#advancedlift_point .sp_none {display: none;}
/* 商品詳細：アイクリーム #eyecream ＜スマホ＞ ====================================== */
/* ---------------------- Detail ---------------------- */
#eyecream .detail-section {padding: 0;}
#eyecream .detail-section .section-ttl {font-size: 1.3em; line-height: 1.6;}
#eyecream .detail-section .inr {padding: 0 0 30px;}
#eyecream .detail-section .item_detail .item_copy {font-size: 1.4em;}
#eyecream .detail-section .item_detail .item_pic {
	float: none;
	width: 200px;
	padding: 0;
	margin: 0 auto;
	text-align: center;
}
#eyecream .detail-section #item1 .item_pic {padding: 0 0 0 20px;}
#eyecream .detail-section #item2 .item_pic {padding: 0 20px 0 0;}
#eyecream .detail-section .item_detail .item_pic img {width: 100%; height: auto;}
#eyecream .detail-section .item_detail .item_txt {;float: none; width: auto; padding: 0 !important; margin: 0; text-align: center;}
#eyecream .detail-section .item_detail .item_dsc {font-size: 14px; line-height: 1.6; margin: 0; padding: 0 0 20px;}
#eyecream .detail-section .item_detail #essential1 {padding-top: 0; padding-bottom: 30px;}
#eyecream .detail-section .item_detail #essential1 .left {width: calc((100% - 110px)/2);}
#eyecream .detail-section .item_detail #essential1 .center {width: 110px;text-align: center;}
#eyecream .detail-section .item_detail #essential1 .center img {width: 100%; height: auto;}
#eyecream .detail-section .item_detail #essential1 .right {width: calc((100% - 110px)/2);}
#eyecream .detail-section .item_detail #essential1 dt {font-size: 0.8em; padding: 0 0 8px;}
#eyecream .detail-section .item_detail #essential1 dd .txt {font-size: 0.6em;}
#eyecream .detail-section .item_detail #essential1 dd .txt .ant {font-size: 0.65em;}
#eyecream .detail-section .item_detail #essential1 .ls-1 {letter-spacing: -1px;}
#eyecream .detail-section .item_detail #essential1 .ls-2 {letter-spacing: -2px;}
#eyecream .detail-section #stem_build_complex p {font-size: 0.9em;}
#eyecream .detail-section .item_detail #essential2 {padding: 30px 0 0;}
#eyecream .detail-section .item_detail #essential2 ul li {
	float: left;
	height: 62px;
	text-align: center;
	color: #000000;
}
#eyecream .detail-section .item_detail #essential2 ul li.list03 {background: #b40000 url(/-/media/obagi/derma-powerx/bg_dtl_cream_SBC.png) center top no-repeat; background-size: auto 100%;}
#eyecream .detail-section .item_detail #essential2 ul li .txt {display: block; font-size: 0.8em; line-height: 1.2;}
#eyecream .detail-section .item_detail #essential2 ul li .txt .ant {font-size: 0.65em;}
#eyecream .detail-section .item_detail #essential2 ul li.list01 .txt,
#eyecream .detail-section .item_detail #essential2 ul li.list02 .txt {padding: 18px 0 0;}
#eyecream .detail-section .item_detail #essential2 ul li.list03 .txt {padding: 18px 0 0; letter-spacing: -1.5px;}
#eyecream .detail-section .item_detail #essential2 ul li.list04 .txt {letter-spacing: -1px; font-size: 0.7em; padding: 12px 58px 0 7px; letter-spacing: -1.5px; text-align: left;}
#eyecream .detail-section .item_detail #essential2 ul li.list04 img {position: absolute; width: auto; height: 38px; top: 12px; right: 10px;}
/* ---------------------- How To ---------------------- */
.howto-section {padding: 0 0 40px;}
.howto-section .ttl .txt .inr {font-size: 1.4em; padding: 0 20px;}
/* ---------------------- Annotation ---------------------- */
#eyecream .annotation {padding-top: 40px; text-align: left; letter-spacing: -1px;}

/* 商品詳細：リップエッセンス #lipessence ＜スマホ＞ ================================== */
#lipessence .lip_hdr .ttl {font-size: 1.6em; margin: 0 0 30px;}
#lipessence .lip_hdr .pic img {width: 100%; height: auto;}
#lipessence .lip_hdr .txt {font-size: 1.3em; margin: 0 0 20px; text-align: center;}
#lipessence .feature_main #feature_lip {padding: 24px 0 18px; margin: 0; font-weight: normal;}
#lipessence .feature_main #feature_lip .feature-ttl {margin: 0 0 18px; font-size: 1.2em; line-height: 1.0; letter-spacing: 0;}
#lipessence .feature_main #feature_lip p {font-size: 0.75em; line-height: 1;}
#lipessence .feature_main #feature_lip p .element {padding: 3px 7px; margin: 0 3px 10px;}
#lipessence .feature_main .item_end_ant {padding: 15px 0;}
		}

/* SP small 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
		@media screen and (max-width: 320px) {
#advancedlift_point .sp_small_none {display: none;}
#advancedlift_point .sp_small_is {display: block;}
#lipessence .feature_main #feature_lip .feature-ttl {padding: 0 20px;}
		}

/* TB・PC 
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
		@media screen and (min-width:641px) {
/* 使い方Youtube ----------------------------------------------------- */
.item_use iframe {width: 560px; height: 315px; margin: 0 auto;}

/* 商品詳細：バイタライズリフトクリーム ＜TB・PC＞ ================================ */
/* Movie --------------------------------------- */
.x_cream_mov .mov_frame  {width: 50%; margin: 0 auto; padding: 0;}
/* Apply --------------------------------------- */
.x_cream_apply .apply_mov iframe  {width: 50%; margin: 0 auto; padding: 0;}

/* 商品詳細：アイクリーム　 #eyecream ＜TB・PC＞ ================================== */
/* ---------------------- Detail ---------------------- */
#eyecream .detail-section {padding: 0;}
#eyecream .detail-section .inr {width: 100%; max-width: 800px; margin: 0 auto; padding: 0;}
#eyecream .stem_build_complex p {font-size: min(1.38vw,20px);}

#eyecream .detail-section .item_detail .item_copy {font-size: min(3.05vw,44px);}
#eyecream .detail-section .item2_fl_box {display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;}
#eyecream .detail-section .item2_fl_box .item_pic {padding-right: min(1.38vw,20px);}
#eyecream .detail-section .item2_fl_box .item_pic img {width: min(17.36vw,270px);}
#eyecream .detail-section .item2_fl_box .item_dsc {white-space: nowrap; font-size: min(1.458vw,21px); line-height: 1.6; padding: 0 0 10px;}
#eyecream .detail-section .item_detail .item_ant {font-size: min(1.11vw,16px); text-align: right; padding: 20px 0 0;}
#eyecream .detail-section #item1 {max-width: 684px; margin: 0 auto;}
#eyecream .detail-section #item2 {max-width: 620px; margin: 0 auto;}
#eyecream .detail-section .item_detail #essential1 dt {font-size: min(1.805vw,26px);}
#eyecream .detail-section .item_detail #essential1 dd .txt {font-size: min(1.38vw,20px);}
#eyecream .detail-section .item_detail #essential1 .left dd {height: 104px;}
#eyecream .detail-section .item_detail #essential1 .right dd.L1 {height: 45px;}
#eyecream .detail-section .item_detail #essential1 .right dd.L2 {height: 69px;}
#eyecream .detail-section .item_detail #essential2 ul li {border-bottom: 4px solid #fff; border-left: 2px solid #fff; border-right: 2px solid #fff; height: 82px; width: calc(50% - 4px); display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;}
#eyecream .detail-section .item_detail #essential2 ul li.list04 .txt {text-align: left; padding-right: 10px;}
/* ---------------------- How To ---------------------- */
.howto-section {width: 100%; max-width: 668px;}
.howto-section .dtl {margin-top: 50px;}
.howto-section .dtl .txt {padding: 20px 30px;}
#advancedlift .howto-section {padding-bottom: 0;}
.howto-section .dtl .txt .meyasu {width: 30%;}
.howto-section .dtl .txt .dcp {width: 70%;}
/* ---------------------- Annotation ---------------------- */
#eyecream .item_all_ant {font-size: min(0.902vw,13px); text-align: left;}
/* 商品詳細：ディープアドバンスドリフト セラム #deepserum ＜TB・PC＞ ================================== */
/* Recommendation --------------------------------------- */
#deepserum_rcmd {padding: 0 0 min(4.72vw,68px);}
#deepserum_rcmd .rcmd_hdr {font-size: min(1.805vw,26px); margin: 0 0 min(1.38vw,20px);}
#deepserum_rcmd .rcmd_ttl {font-size: min(2.638vw,38px); margin: 0 0 min(3.8vw,55px);}
#deepserum_rcmd .rcmd_list {width: min(63.19vw,910px); margin: 0 auto; padding: 0;}
#deepserum_rcmd .rcmd_list .rcmd_list_inr {width: 100%; background-color: #fff; padding: min(4.86vw,70px) 0 min(4.16vw,60px); text-align: center;}
#deepserum_rcmd .rcmd_list ul {display: inline-block; text-align: left;}
#deepserum_rcmd .rcmd_list ul li {font-size: min(1.38vw,20px); line-height: 1.4; background: url(/-/media/obagi/promotion/xserum/ico_ck.svg) left top 0.2em no-repeat; background-size: min(2.5vw,36px) auto; padding: 0 0 min(1.11vw,16px) min(3.47vw,50px);}
#deepserum_rcmd .rcmd_list ul li strong {background: linear-gradient(transparent 60%, rgba(255, 212, 214, 0.8) 60%);}
#deepserum_rcmd .rcmd_list .rcmd_ant {font-size: min(0.902vw,13px); padding: min(0.69vw,10px) 0 0;}
/* Feature --------------------------------------- updated on 2025.07.15 */
#deepserum_fet {padding: min(4.72vw,68px) 0 0;}
#deepserum_fet .fet_box {padding: 0;}
#deepserum_fet .fet_box.fet04 {margin: 0 0 min(5vw,72px);}
#deepserum_fet .fet_box .fet_box_inr {position: relative; width: min(63.19vw,910px); padding: min(4.86vw,70px) 0; margin: 0 auto;}
#deepserum_fet .fet_box .point_catch {font-size: min(1.66vw,24px); line-height: 1.3; margin: 0 0 min(0.97vw,14px);}
#deepserum_fet .fet_box .point_ttl {font-size: min(2.63vw,38px); line-height: 1.26; margin: 0 0 min(2.22vw,32px);}
#deepserum_fet .fet_box .point_main {display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center;}
#deepserum_fet .fet_box.fet01 .point_main,
#deepserum_fet .fet_box.fet03 .point_main {-webkit-box-orient: horizontal; -webkit-box-direction: reverse; flex-direction: row-reverse;}
#deepserum_fet .fet_box .point_txt {font-size: min(1.458vw,21px); line-height: 1.9; padding: 0; text-align: left;}
#deepserum_fet .fet_box .point_txt strong {color: #cd020d;}
#deepserum_fet .fet_box .point_txt .sml {font-size: 0.75em;}
#deepserum_fet .fet_box.fet01 .point_txt {padding-left: min(3.05vw,44px);}
#deepserum_fet .fet_box.fet02 .point_txt {padding-right: min(1.66vw,24px);}
#deepserum_fet .fet_box.fet03 .point_txt {padding-left: min(3.75vw,54px);}
#deepserum_fet .fet_box.fet04 .point_txt {padding-right: min(4.3vw,62px);}
#deepserum_fet .fet_box.fet05 .point_txt {padding-right: min(4.3vw,62px);}
#deepserum_fet .fet_box.fet01 .point_main_pic img {width: min(17.36vw,250px);}
#deepserum_fet .fet_box.fet02 .point_main_pic img,
#deepserum_fet .fet_box.fet03 .point_main_pic img {width: min(20.8vw,300px);}
#deepserum_fet .fet_box.fet04 .point_main_pic img {width: min(22.6vw,326px);}
#deepserum_fet .fet_box.fet05 .point_main_pic img {width: min(12vw,160px);}
#deepserum_fet .fet_box.fet02 .point_list {padding: min(1.388vw,20px) 0 0; margin: 0; width: min(25.4vw,366px);}
#deepserum_fet .fet_box.fet02 .point_list li {width: calc(50% - min(0.41vw,6px)); margin: 0 min(0.2vw,3px) min(0.41vw,6px);}
#deepserum_fet .fet_box.fet02 .point_list li p {border-radius: min(0.55vw,8px); color: #fff; font-weight: 700; font-size: min(0.9vw,13px); line-height: 2.38;}
#deepserum_fet .fet_box.fet05 .point_list {width: 75%;}
#deepserum_fet .fet_box.fet05 .point_list li {font-size:min(1.11vw,16px);}

#deepserum_fet .point_ant {width: min(63.19vw,910px); margin: 0 auto; font-size: min(0.9vw,13px); padding: min(0.55vw,8px) 0 min(4.51vw,65px);}
/* Method --------------------------------------- */
#deepserum_method .mtd_pc_flex {display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; max-width: 1024px; margin: 0 auto;}
#deepserum_method .mtd_step {display: -webkit-box; display: flex; flex-wrap: nowrap; -webkit-box-align: center; align-items: center; margin: 0 min(4.16vw,60px) 0 0; width: min(42.77vw,616px);}
#deepserum_method .mtd_step .mtd_pic {width: min(14.58vw,210px); text-align: center;}
#deepserum_method .mtd_step01 .mtd_pic {padding: 0 0 min(2.43vw,35px);}
#deepserum_method .mtd_step01 .mtd_pic img {width: min(6.944vw,100px);}
#deepserum_method .mtd_step02 {padding: min(2.08vw,30px) 0 0;}
#deepserum_method .mtd_step02 .mtd_pic img {width: min(8.19vw,118px);}
#deepserum_method .mtd_txt {width: min(26.38vw,380px); font-size: min(1.11vw,16px); line-height: 2; padding: 0;}
#deepserum_method .mtd_txt .pic_num {display: block; margin: 0 0 min(1.66vw,24px); color: #987949; font-size: min(2.22vw,32px); line-height: 1; letter-spacing: 2px;}
#deepserum_method .mtd_point_wrap {padding: 0; width: min(23.88vw,344px);}
#deepserum_method .mtd_point {border-radius: min(1.11vw,16px); padding: min(2.08vw,30px) 0 min(1.388vw,20px);}
#deepserum_method .mtd_point .p_ttl img {width: min(18.54vw,267px);}
#deepserum_method .mtd_point .p_txt {font-size: min(1.04vw,15px); line-height: 1.73; padding: min(1.388vw,20px) min(2.77vw,40px) min(1.66vw,24px);}
#deepserum_method .mtd_point .p_pic img {width: min(6.52vw,94px);}
/* 商品詳細：リップエッセンス #lipessence ＜TB・PC＞ ====================================== */
#lipessence .lip_hdr .ttl {font-size: min(2.43vw,35px); margin: 0 0 30px;}
#lipessence .lip_hdr .pic {text-align: center;}
#lipessence .lip_hdr .pic img {width: min(25.27vw,364px); height: auto;}
#lipessence .lip_hdr .txt {font-size: min(1.875vw,27px); margin: 0 0 20px; text-align: center;}
#lipessence .feature_main #feature_lip {width: 100%; max-width: 960px; padding: 34px 0 30px; margin: 0 auto;}
#lipessence .feature_main #feature_lip .feature-ttl {margin: 0 0 min(1.94vw,28px); font-size: min(1.94vw,28px);}
#lipessence .feature_main #feature_lip p {font-size: min(1.31vw,19px);}
#lipessence .feature_main #feature_lip sup {font-size: 0.6em;}
#lipessence .feature_main #feature_lip p .element {padding: 3px 7px; margin: 0 3px 8px;}
#lipessence .feature_main .item_end_ant {width: 100%; max-width: 940px; margin: 0 auto; padding: 24px 0; font-size: min(0.902vw,13px); line-height: 1.7; text-align: left;}
		}


/* 
TB ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
		@media screen and (min-width:641px) and (max-width:1024px) {
#advancedlift_point .tb_none {display: none;}
/* Point info --------------------------------------- */
#advancedlift_point .info .pic_box .pic {width: 60%; padding: 20px 0 0;}
#advancedlift_point .info .txt_box {padding: 46px 0 0;}
#advancedlift_point .info .dtl_box {padding: 20px 0 0;}
/* 商品詳細：アイクリーム　 #eyecream ＜TB＞ ====================================== */
/* ---------------------- Detail ---------------------- */
#eyecream .detail-section .section-ttl {font-size: 1.6em; line-height: 1.6;}
#eyecream .detail-section {padding: 50px 8%;}
#eyecream .detail-section .item_detail .item_pic {width: 37%;}
#eyecream .detail-section .item_detail .item_txt {width: 60%;padding: 5px 0 50px;}
#eyecream .detail-section .item_detail .item_ant {padding: 10px 0;}

		}

/* 
PC ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
		@media print, screen and (min-width:1025px) {
/* basic --------------------------------------- */
#advancedlift_point .pc_none {display: none;}
		}