@charset "utf-8";

/* -------------------------------------
共通設定
------------------------------------- */
#dior-addict-glass-lipstick {
	text-align: center;
}
#dior-addict-glass-lipstick [loading='lazy'] {
	background: url(/images/common/loading.gif) no-repeat center center;
	background-size: 25px 25px;
}
#dior-addict-glass-lipstick h2 {
	margin-top: 28px;
	font-size: 28px;
	line-height: 1.25;
	text-box-trim: trim-both; /* stylelint-disable-line property-no-unknown */
}
#dior-addict-glass-lipstick h3 {
	font-weight: bold;
	line-height: 1.25;
	text-box-trim: trim-both; /* stylelint-disable-line property-no-unknown */
}

/* 共通ボタン */
#dior-addict-glass-lipstick .addict-common-btn {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 100%;
	max-width: 140px;
	padding-right: 10px;
	border-radius: 25px;
	background: #000;
	color: #fff;
	line-height: 30px;
}
#dior-addict-glass-lipstick .addict-common-btn::after {
	position: absolute;
	top: 0;
	right: 17px;
	bottom: 0;
	width: 6px;
	height: 6px;
	margin: auto;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: rotate(45deg);
	content: '';
}

/* キャプションテキスト */
#dior-addict-glass-lipstick .caption-text {
	color: #666;
	font-size: 11px;
}

/* 商品カラム */
#dior-addict-glass-lipstick .product-flex-container {
	display: flex;
	justify-content: space-around;
	margin-top: 40px;
}
#dior-addict-glass-lipstick .product-flex-item {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	width: calc(100% / 3);
}
#dior-addict-glass-lipstick .product-flex-itemimg {
	width: 70%;
	height: auto;
}
#dior-addict-glass-lipstick .product-flex-productname {
	margin: 18px 0 0;
	font-size: 14px;
}
#dior-addict-glass-lipstick .product-flex-sku {
	margin-top: 12px;
	font-size: 14px;
	font-weight: bold;
}
#dior-addict-glass-lipstick .product-flex-container .addict-common-btn {
	margin-top: 12px;
}

/* -------------------------------------
商品紹介セクション (メインタイトル)
------------------------------------- */
#dior-addict-glass-lipstick .keyvisual img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 1;
}
#dior-addict-glass-lipstick .product-intro-text {
	margin-top: 28px;
	line-height: 1.5;
}
#dior-addict-glass-lipstick .product-intro .addict-common-btn {
	margin: 20px auto 0;
}

/* 動画 */
#dior-addict-glass-lipstick .dior-player {
	position: relative;
	width: 100%;
	height: 0;
	margin: 40px 0;
	padding-top: 56.25%;
}
#dior-addict-glass-lipstick .dior-player iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* -------------------------------------
リップスティック
------------------------------------- */
#dior-addict-glass-lipstick .product-lipstick .product-lipstick-container {
	display: flex;
	margin-top: 24px;
}
#dior-addict-glass-lipstick .product-lipstick .product-lipstick-container .product-lipstick-img {
	width: 50%;
	height: 100%;
}
#dior-addict-glass-lipstick .product-lipstick .product-lipstick-container .product-lipstick-info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 50%;
}
#dior-addict-glass-lipstick .product-lipstick .product-lipstick-container .product-lipstick-productname {
	margin: 18px 0;
	font-size: 14px;
}
#dior-addict-glass-lipstick .product-lipstick .product-lipstick-container .lead-sup {
	padding: 0 2px;
	font-size: 8px;
	vertical-align: super;
}
#dior-addict-glass-lipstick .product-lipstick .product-lipstick-container .product-lipstick-btn {
	display: flex;
	gap: 8px;
	justify-content: center;
}
#dior-addict-glass-lipstick .product-lipstick .product-lipstick-container .caption-text {
	margin: 18px 0;
}

/* -------------------------------------
シェード バリエーション
------------------------------------- */
#dior-addict-glass-lipstick .product-shade {
	margin-top: 40px;
}
#dior-addict-glass-lipstick .product-shade-container {
	display: flex;
	margin-top: 24px;
}
#dior-addict-glass-lipstick .product-shade-container .product-shade-info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 50%;
}
#dior-addict-glass-lipstick .product-shade-container .product-shade-img {
	width: 50%;
	height: 100%;
}
#dior-addict-glass-lipstick .product-shade-container .product-shade-item {
	display: flex;
	gap: 12px;
	justify-content: center;
	margin-top: 24px;
}
#dior-addict-glass-lipstick .product-shade-container .product-shade-item .product-shade-itemimg {
	width: 40%;
	height: auto;
}
#dior-addict-glass-lipstick .product-shade-container .product-shade-btn {
	display: flex;
	justify-content: center;
	gap: 16px;
	margin-top: 20px;
}
#dior-addict-glass-lipstick .product-shade-container .caption-text {
	margin-top: 20px;
}

/* -------------------------------------
パッケージ
------------------------------------- */
#dior-addict-glass-lipstick .product-package .product-package-container {
	display: flex;
	margin-top: 24px;
}
#dior-addict-glass-lipstick .product-package-img {
	width: 50%;
	height: 100%;
	aspect-ratio: 1 / 1;
}
#dior-addict-glass-lipstick .product-package-text {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 50%;
	font-size: 14px;
}

/* -------------------------------------
ケース
------------------------------------- */
#dior-addict-glass-lipstick .product-case-kvimg {
	width: 100%;
	height: auto;
	margin-top: 24px;
}
#dior-addict-glass-lipstick .product-case-text {
	margin-top: 24px;
	text-align: center;
}

/* -------------------------------------
duos
------------------------------------- */
#dior-addict-glass-lipstick .product-duos-lead {
	margin-top: 12px;
	font-size: 18px;
}

/* -------------------------------------
メンバーシップ プログラム
------------------------------------- */
#dior-addict-glass-lipstick .membership {
	padding: 15px;
	background: #f4f4f4;
	text-align: left;
}
#dior-addict-glass-lipstick .membership .title-lv2 {
	margin: 0 0 18px;
	font-size: 18px;
	line-height: 1.2;
}
#dior-addict-glass-lipstick .membership .text {
	margin-bottom: 15px;
}
#dior-addict-glass-lipstick .membership-wrap {
	display: flex;
}
#dior-addict-glass-lipstick .membership-image {
	margin-right: 15px;
}
#dior-addict-glass-lipstick .list-notes {
	margin-top: 20px;
	font-size: 10px;
	line-height: 1.28;
}

/* -------------------------------------
フッター
------------------------------------- */
#dior-addict-glass-lipstick .dior-footer .addict-common-btn {
	max-width: 220px;
	margin: 0 auto;
}