@charset "utf-8";
/* -----------------------------------------------------
不要なテンプレートのエリアを非表示にする (updated on 2023.02.03)
----------------------------------------------------- */
.block-contents-1,
.block-contents-1 .block-h1 {display: none;}
/* -----------------------------------------------------
H1 header (updated on 2023.02.03)
----------------------------------------------------- */
.lineup-hdr {padding: 22px 20px; margin: 0 auto;}
.lineup-hdr .lineup-ttl {border: 0; box-shadow: none; margin: 0 0 6px; padding: 0;}
.lineup-hdr .lineup-subttl {padding: 0 0 0 3px; font-size: 1em; color: #bf8c3e; font-family: 'optima', 'Marcellus', serif; margin: 0 0 18px;}
.lineup-hdr .lineup-dcpt {padding: 0 0 0 3px; }
/* -----------------------------------------------------
lineup-items (updated on 2023.02.03)
----------------------------------------------------- */
.lineup-items {}
/* -----------------------------------------------------
Annotation (updated on 2023.02.03)
----------------------------------------------------- */
.lineup-ant {font-size: 0.75em; line-height: 1.5; text-align: center; padding: 0 15px 30px; margin: 0 auto;}
/* -----------------------------------------------------
EC button (updated on 2023.02.03)
----------------------------------------------------- */
#mail-orders {margin-top: 0;}
/* -----------------------------------------------------
シリーズから探す (updated on 2023.07.02)
----------------------------------------------------- */
.productinfo .colum-wrp .colum-wrp-inner {position: relative; background-position: left top; background-repeat: no-repeat; background-size: 100% auto; padding: 40px 15px 40px 15px;}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(1) {background-image: url(../../lineup/images/img_specialskincare_sp.jpg);}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(2) {background-image: url(../../lineup/images/img_basicskincare_sp.jpg?230809);}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(3) {background-image: url(../../lineup/images/img_basemake_sp.jpg);}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(4) {background-image: url(../../lineup/images/img_innercare_sp.jpg);}
.productinfo .colum-wrp .colum-wrp-inner h3.ttl-black {position: absolute; padding: 0; margin: 0; border: 0; text-shadow: 1px 1px 5px rgba(0,0,0,1); font-size: 1.375em; line-height: 1; letter-spacing: 0; color: #fff;}
.productinfo .colum-wrp .colum-wrp-inner h3.ttl-black:after {display: block; color: #ffffff; font-weight: normal; padding: 12px 0 0 4px; font-size: 0.7em; text-shadow: 1px 1px 5px rgba(0,0,0,1);}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(1) h3.ttl-black:after {content: "肌悩みにダイレクトにアプローチ";}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(2) h3.ttl-black:after {content: "内側からキメの整ったお肌へ";}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(3) h3.ttl-black:after {content: "透明感つるり肌へ";}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(4) h3.ttl-black:after {content: "内側からハリとうるおいのある毎日を";}
.productinfo .colum-wrp .colum-wrp-inner .block-series {padding: 78px 0 0; margin: 0;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner {background-color: #fff;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts {display: block; padding: 0 0 30px; margin: 0; background: none;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .block-inner {text-align: center;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .block-inner .description {padding: 30px 0 0;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .block-inner .description span {display: inline-block; border: 1px solid #b2b2b2; border-radius: 20px; font-size: 0.75em; line-height: 1; padding: 0.5em 2em;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .block-inner img {width: 100% !important; max-width: 300px; height: auto;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .img-name-series {text-align: center; font-size: 1.18em; letter-spacing: -1px;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .img-name-series span {display: block;}
/* -----------------------------------------------------
肌悩みから探す (updated on 2023.02.06)
----------------------------------------------------- */
.productinfo #lineup-purpose {padding: 0 15px 32px;}
.productinfo #lineup-purpose-items {text-align: center; padding: 0 0 80px;}
.productinfo #lineup-purpose-items .item-list {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0 5px;}
.productinfo #lineup-purpose-items .item-list li {width: 50%; padding: 0 0 20px;}
.productinfo #lineup-purpose-items .item-list li a {display: block; text-decoration: none;}
.productinfo #lineup-purpose-items .item-list li img {width: 100%; height: auto;}
.productinfo #lineup-purpose-items .item-list li h2 {font-size: 0.85em; line-height: 1.4; margin: 0; padding: 0 10px; letter-spacing: -0.5px;}
/* スマホのプルダウン ----------------------------------------------------- */
.productinfo #lineup-purpose select {-webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #e5e5e4; background: #f8f8f8 url(../../common/images/header/ico_navi_open.svg) top 50% right 14px no-repeat; background-size: 11px auto; color: #000; border-radius: 4px; font-size: 0.9em; line-height: 1; width: calc(100% - 10px); padding: 14px 18px; margin: 0 5px;}

/* -----------------------------------------------------
共通 updated on 2020.11.26
----------------------------------------------------- */
.productinfo #lineup-purpose-items {display: none;}

/* ----------------------------------------------------------------------------------------------------------
▼Media Query
---------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------- for PC & Tablet size */
		@media screen and (min-width: 641px) {
/* -----------------------------------------------------
H1 header (updated on 2023.02.03)
----------------------------------------------------- */
.lineup-hdr {max-width: 940px; padding: 0 10% 30px; margin-top: -60px;}
.lineup-hdr .lineup-dcpt {font-size: 1.2em;}
/* -----------------------------------------------------
Annotation (updated on 2023.02.03)
----------------------------------------------------- */
.lineup-ant {max-width: 940px;}
/* -----------------------------------------------------
シリーズから探す (updated on 2023.07.02)
----------------------------------------------------- */
.productinfo .colum-wrp {width: 100%; max-width: 1200px; margin: 0 auto;}
.productinfo .colum-wrp .colum-wrp-inner {margin: 0;}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(1) {background-image: url(../../lineup/images/img_specialskincare.jpg);}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(2) {background-image: url(../../lineup/images/img_basicskincare.jpg?230809);}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(3) {background-image: url(../../lineup/images/img_basemake.jpg);}
.productinfo .colum-wrp .colum-wrp-inner:nth-child(4) {background-image: url(../../lineup/images/img_innercare.jpg);}
.productinfo .colum-wrp .colum-wrp-inner h3.ttl-black {top: 84px; left: 11%; font-size: 2.2em;}
.productinfo .colum-wrp .colum-wrp-inner h3.ttl-black:after {font-size: 0.5em;}
.productinfo .colum-wrp .colum-wrp-inner .block-series {width: 80%; max-width: 940px; padding: 160px 0 0; margin: 0 auto;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 30px 0 0;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts {width: calc(50% - 1px); border-top: 1px solid #d8d8d8; border-left: 1px solid #d8d8d8; padding: 0 0 30px;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts:nth-child(2n+1) {border-left: 0;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts:nth-child(1),
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts:nth-child(2) {border-top: 0;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .block-inner .description span {font-size: 0.9em;}
.productinfo .colum-wrp .colum-wrp-inner .block-series .series-inner a.block-cts .img-name-series {font-size: 1.375em;}
/* -----------------------------------------------------
肌悩みから探す (updated on 2023.06.27)
----------------------------------------------------- */
#lineup-purpose {margin: 0 auto 56px;}
#lineup-purpose .list_purpose {display:-webkit-box; display:-ms-flexbox; display: flex; -webkit-align-items: stretch; -ms-align-items: stretch; align-items: stretch; -ms-flex-wrap: nowrap; flex-wrap: nowrap; max-width: 940px; margin: 0 auto;}
#lineup-purpose .list_purpose .list_purpose_item {width: 16.66%;}
#lineup-purpose .list_purpose .list_purpose_item a {display:-webkit-box; display:-ms-flexbox; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; aspect-ratio: 5/4.5; text-decoration: none; font-size: min(1.8vw,13.6px); letter-spacing: -1px; border: 1px solid #d1d1d1; border-right: 0; text-align: center; height: 100%;}
#lineup-purpose .list_purpose .list_purpose_item:nth-last-of-type(1) a {border-right: 1px solid #d1d1d1;}
#lineup-purpose .list_purpose .list_purpose_item.corrent a {background-color: #ca8169; color: #fff; width: 100%;}
#lineup-purpose .list_purpose .list_purpose_item .icon {width: 100%; padding: 0 0 4px;}
#lineup-purpose .list_purpose .list_purpose_item .ttl {width: 100%;}

#lineup-purpose-items {max-width: 940px; margin: 0 auto; text-align: center; padding: 0 0 70px;}
#lineup-purpose-items .item-list {display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: stretch; -ms-align-items: stretch; align-items: stretch; text-align: center; width: inherit;}
#lineup-purpose-items .item-list li {width: 30% !important;}
#lineup-purpose-items .item-list li a {display: block;}
#lineup-purpose-items .item-list li img {width: 100%; height: auto;}
#lineup-purpose-items .item-list li h2 {font-size: 1em; line-height: 1.33; margin: 0; padding: 0 0 10px;}

		}

/* -----------------------------------------------------
 for PC
----------------------------------------------------- */
		@media screen and (min-width: 1025px) {
/* -----------------------------------------------------
H1 header (updated on 2023.02.03)
----------------------------------------------------- */
.lineup-hdr .lineup-dcpt {font-size: 1.2em;}

		}
