/*!　*/*{outline:none !important;margin:0;padding:0;border:0;box-sizing:border-box}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	font:inherit;
	vertical-align:baseline;
} 
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
	display:block;
}
html{
	line-height:1;
	font-family:"Noto Serif JP","游明朝","YuMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ＭＳ Ｐ明朝","MS PMincho",serif;
	font-size:62.5%
}
body{
	font-size:1.5rem;
	line-height:1;
	color:#3E3E3E;
	background-color:#f9fafc;
}
img{max-width:100%;
	height:auto;vertical-align:middle
}
a{
	text-decoration:none;
	color:#000;
	-webkit-transition:all .3s;
	transition:all .3s;
	display:inline-block;width:100%
}
ol,ul{
	list-style:none
}
#page{
	max-width:750px;
	margin:0 auto;overflow:hidden;
}
.Container{
	position:relative;
}

.wrap{
	width:90%;
	margin-right:auto;
	margin-left:auto;
}

.wrap2{
	width:100%;
	margin-right:auto;
	margin-left:auto;
}

.number {
    font-weight: 500;
}

a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
}

.Flex {
    display: flex;
}

.Flex--BtwCenter {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
}

.Flex--justBtw {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

.Flex--justCen {
    display: flex;
    justify-content: center;
}

.Flex--alCenter {
    display: flex;
    align-items: center;
}

.Flex--allCenter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.Flex--wrapS {
    flex-wrap: wrap;
    -webkit-box-align: start;
    align-items: flex-start;
}

.Header {
    text-align: center;
    padding: min(3.2vw, 24px) 0;
    background-color: #fff;
}

.Header--inner {
    display: flex;
    justify-content: space-between;
    padding: 0 .5em;
}

.Logo {
    width: 37%;
}

.name {
    width: 60%;
}

.FV {
    overflow: hidden;
}

.FV__inner {
    width: 100%;
}

.SectionLimited{
	background-image:url(../img/bg05.png);
	background-size:100% auto;
	background-position:0 0;
	background-repeat:no-repeat;
	background-color:#f8f9fc;
	padding-bottom:min(10vw,35px)
}
.SectionLimited__t{
	line-height:0;
	margin-bottom:min(8vw,60px)
}
.SectionLimited__btn{
	margin-top:min(5.3333333333vw,40px);
	margin-left:max(-0.8vw,-6px);
	margin-right:max(-.6666666667vw,-5px)
}
.SectionLimited__btn a{display:block}
.SectionLimited__fbtn{margin-top:min(0vw,40px)}
.SectionLimited__fbtn a{display:block}
.SectionLimited__sample{margin-top:min(5.3333333333vw,40px)}

.SectionCause{padding-top:min(12vw,90px);padding-bottom:min(2.9333333333vw,22px);position:relative}
.SectionCause--sup{
	padding-left:5vw;
	font-size:min(2.6666666667vw,20px);
	text-align:start
}
.CatchCause {
    line-height: 1.6;
    font-weight: 600;
    font-size: min(5.3333333333vw, 40px);
}

.CatchCause__top {
    font-size: min(6.1333333333vw, 46px);
    text-align: center;
    margin-bottom: 1em;
}

.CatchCause__top .big {
    font-size: min(7.7333333333vw, 58px);
}

.CatchCause__middle {
    position: absolute;
    bottom: 50%;
    right: 0;
    transform: translate(0, 50%);
}

.CatchCause__bottom {
    text-align: center;
    margin-bottom: 1em;
}

.CatchCause__bottom .big {
    font-size: min(6.4vw, 48px);
}

.CatchCause .color {
    color: #a08200;
}

.sup{
	display:inline-block;
	position:relative;
	font-size:min(2.6666666667vw,20px);
	top:max(-3.4666666667vw,-26px);
	transform:scale(0.7)
}
.BoxCause {
    position: relative;
    display: flex;
    justify-content: center;
    margin-bottom: 1em;
}

.BoxCause__img {
    text-align: center;
    width: 70%;
    margin: 0 25% 0 4%;
}

.SectionNewidea {
    position: relative;
    background-color: #001e4b;
    padding-top: min(21.0666666667vw, 158px);
    padding-bottom: min(9.0666666667vw, 68px);
}

.SectionNewidea::before {
    position: absolute;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: min(12.8vw, 96px) min(50vw, 375px) 0 min(50vw, 375px);
    border-color: #f9fafc transparent transparent transparent;
    left: 50%;
    top: -1px;
    transform: translateX(-50%);
}

.CatchNewidea {
    text-align: center;
}

.CatchNewidea--main {
    font-size: min(10.9333333333vw, 82px);
    background: linear-gradient(270deg, #E3D68C, #B59C5C);
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
}

.BoxNewidea {
    width: 100%;
    color: #fff;
    justify-content: space-between;
    margin: 0 auto 2em;
    position: relative;
    padding-top: 2em;
}

.BoxNewidea:before {
    position: absolute;
    content: "";
    background-image: url(../img/catch22_sp.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    height: 70%;
    padding: 8%;
    right: min(4.2666666667vw, 32px);
    top: 0;
}

.BoxNewidea__left {
    padding-top: 25%;
    width: 35%;
}

.BoxNewidea__right {
    padding-top: 55%;
    width: 35%;
    align-self: flex-end;
    padding-bottom: 5%;
}

.BoxNewidea__mid {
    width: 30%;
    text-align: center;
}

.CatchNewidea--sub {
    color: #fff;
    font-size: 2.9rem;
}

.CatchNewidea--sub .sup {
    position: relative;
    font-size: 1rem;
    top: -20px;
}

.SectionOffer {
    padding: 10% 0 1%;
    background-image: url(../img/bg01_sp.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.SectionOffer.idea {
    position: relative;
}

.SectionOffer.idea::before {
    top: -1px;
    position: absolute;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: min(12.8vw, 96px) min(50vw, 375px) 0 min(50vw, 375px);
    border-color: #001e4b transparent transparent transparent;
    left: 50%;
    transform: translateX(-50%);
}

.SectionOffer.third {
    background-image: url(../img/bg02_sp.png);
    padding: min(4.5333333333vw, 34px) 0 min(8vw, 60px);
}

.SectionOffer.second {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../img/bg02_sp.png);
    padding: min(19.2vw, 144px) 0 min(8vw, 60px);
}

.SectionApproach {
    padding: 10% 0;
    padding-bottom: 6%;
    background-color: #fbf8f1;
}
.SectionApproach-wt {
    padding: 10% 0;
    padding-bottom: 6%;
    background-color: #fff;
}

.SectionApproach .wrap {
    width: 90%;
}

.SectionProcess {
    background-image: url(../img/bg04_sp.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 30% 0 8%;
}

.CatchProcess {
    font-size: min(8.9333333333vw, 67px);
    font-weight: 600;
    position: relative;
    text-align: center;
    margin-bottom: 1.5em;
    color: #001e4b;
    padding-top: .4em;
}

.CatchProcess:before {
    padding-bottom: 14%;
    background-image: url(../img/catch17_sp.png);
    width: 100%;
    position: absolute;
    content: "";
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    top: 0;
    left: 50%;
    transform: translate(-50%, -105%);
}

.BoxProcess {
    font-size: min(8.9333333333vw, 67px);
    margin-bottom: min(8vw, 60px);
    position: relative;
}

.BoxProcess:not(:first-of-type) {
    padding-top: min(12.8vw, 96px);
}

.BoxProcess:not(:first-of-type):after {
    height: 9%;
    width: 9%;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    content: "";
    display: block;
    position: absolute;
    background-image: url(../img/arrow02.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.BoxProcess.second .BoxProcess__txt {
    font-size: min(3.4666666667vw, 26px);
}

.BoxProcess--img {
    width: 40%;
    margin: 0 auto min(4vw, 30px);
}

.BoxProcess__right {
    text-align: center;
}

.BoxProcess__head {
    font-size: min(6vw, 45px);
    font-weight: 500;
    padding-top: 1.1em;
    margin-bottom: .6em;
    position: relative;
}

.BoxProcess__head::before {
    font-size: min(3.7333333333vw, 28px);
    top: -2px;
    position: absolute;
    content: "SKIN CARE";
    display: block;
    font-family: "Noto Sans JP", sans-serif;
    color: #e3007f;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
}

.BoxProcess__head.second::before {
    content: "TREATMENT DAY CREAM";
}

.BoxProcess__head.third::before {
    content: "MAKEUP BASE";
}

.BoxProcess__txt {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(4.2666666667vw, 32px);
    line-height: 1.8;
}

.ListHowto {
    width: 95%;
    padding-top: min(24vw, 180px);
    margin-bottom: min(4vw, 30px);
    position: relative;
}

.ListHowto::after {
    top: -5px;
    background-image: url(../img/drop01_sp.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 26%;
    padding-bottom: 26%;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
    content: "";
    display: block;
}

.ListHowto--img {
    width: 40%;
    margin: 0 auto min(4vw, 30px);
}

.ListHowto--title {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(4.4vw, 33px);
    padding: .6em 1em;
    margin-bottom: 1.5em;
    text-align: center;
    background: linear-gradient(66deg, rgb(200, 216, 238) 0%, rgb(235, 212, 227) 100%);
}

.ListHowto--item {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(4vw, 30px);
    padding-left: .8em;
    margin-bottom: 1em;
    line-height: 1.5;
    position: relative;
}

.ListHowto--item::before {
    padding: .4em;
    top: min(1.0666666667vw, 8px);
    position: absolute;
    content: "";
    display: block;
    background-color: #001e4b;
    border-radius: min(13.3333333333vw, 100px);
    left: 0;
    transform: translateX(-50%);
}

.ContainerNewidea__txt {
    text-align: center;
    margin: 0 auto;
    width: 90%;
}

.ContainerNewidea__txt--min {
    color: #fff;
    margin-top: 2em;
    font-size: 10px;
    text-align: right;
}

.CatchOffer {
    text-align: center;
    color: #001e4b;
    margin-bottom: min(8vw, 60px);
}

.CatchOffer.second .Catch__txt {
    margin-top: 1.1em;
}

.CatchOffer.third {
    margin-bottom: min(12vw, 90px);
}

.CatchOffer--txt {
    font-size: 3rem;
    line-height: 1.6;
    margin-bottom: .8em;
}

.CatchOffer--min {
    font-family: "Noto Sans JP", sans-serif;
    color: #fff;
    padding: .4em 2.3em;
    font-size: 2.4vw;
    background-color: #ae9100;
}

.Catch {
    text-align: center;
    color: #001e4b;
}

.Catch__img {
    position: relative;
    display: inline-block;
    font-size: min(8vw, 60px);
    font-weight: 500;
    margin-bottom: 1em;
    padding-bottom: .4em;
}

.Catch__img::after {
    position: absolute;
    content: "";
    display: block;
    background-color: #ae9100;
    height: 1px;
    bottom: 0;
    width: 10%;
    left: 50%;
    transform: translateX(-50%);
}

.Catch__img.third {
    font-size: min(6.6666666667vw, 50px);
    line-height: 1.5;
    padding-bottom: 1em;
    margin-bottom: 1em;
}

.Catch__img.third .min {
    font-size: min(4vw, 30px);
    margin-bottom: -2.3em;
    line-height: 1.5;
    display: block;
}

.Catch__img.second {
    line-height: 1.4;
    margin-bottom: .3em;
    padding-bottom: .7em;
}

.Catch__txt {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(4.2666666667vw, 32px);
    color: #001e4b;
    font-weight: 500;
    line-height: 1.5;
}

.BoxProduct {
    position: relative;
    align-items: center;
}

.BoxProduct__img {
    margin-bottom: 2em;
    text-align: center;
}

.BoxProduct__img img {
    width: 26%;
}

.BoxProduct__txt--use {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(2.9333333333vw, 22px);
    margin-bottom: 1em;
    justify-content: center;
}

.BoxProduct__txt--use .left {
    padding: .4em 1em;
    margin-right: 1em;
    border: solid #001e4b 1px;
}

.BoxProduct__txt--use .right {
    padding: .4em 1em;
    border-radius: min(13.3333333333vw, 100px);
    background: #c8d8ee;
    background: linear-gradient(66deg, rgba(16, 164, 228, 0.5333333333) 0%, rgba(245, 108, 181, 0.4941176471) 100%);
}

.BoxProduct__txt--container {
    padding: 1em 0;
    width: 80%;
    margin: 0 auto;
}

.BoxProduct__txt--price {
    font-size: min(6vw, 45px);
}

.BoxProduct__txt--price .min {
    font-size: .5em;
}

.BoxProduct__txt--price .sup {
    position: relative;
    font-size: .5em;
    transform: scale(0.744);
    top: -1em;
}

.BoxProduct--namemin {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(3.7333333333vw, 28px);
    margin-bottom: 1.2em;
    text-align: center;
}

.number{
font-weight:500
}

.SectionApproach {
    padding-bottom: 6%;
    background-color: #fbf8f1;
}
.SectionApproach_wt {

    background-color: #fff;
}

.CatchApproach {
    margin-bottom: min(12vw, 90px);
    text-align: center;
}

.CatchApproach--top {
    font-size: min(4vw, 30px);
    margin-bottom: .6em;
    color: #000;
}

.CatchApproach--main {
    font-weight: 400;
    font-size: min(8.9333333333vw, 67px);
    margin-bottom: .3em;
}

.CatchApproach--bottom {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(4.9333333333vw, 37px);
}

.CatchApproach__bottom {
    font-size: min(4vw, 30px);
    color: #3e3e3e;
    line-height: 1.6;
}

.CatchApproach__bottom span {
    font-size: .4em;
    display: inline-block;
    position: relative;
    top: -1em;
}

.BoxApproach:not(:last-child) {
    margin-bottom: min(16vw, 120px);
}

.BoxApproach__img {
    text-align: center;
}

.BoxApproach__img figcaption {
    font-size: min(4.8vw, 36px);
    font-weight: 600;
    margin-bottom: 1em;
    text-align: center;
}


.BoxApproach__mv {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16/10;
	background-color: #fff;
}

.BoxApproach__mv span {
    position: absolute;
    left: 0;
    top: 70%;
    transform: translateY(-70%);
	text-align: center;
}

.BoxApproach__mv video {
    width: 90%;
}

.CatchApproach__top {
    font-size: min(6.4vw, 48px);
    font-weight: 500;
    line-height: 1.4;
    padding-top: 9%;
    text-align: center;
    margin-bottom: .5em;
    position: relative;
}

.CatchApproach__top.last::after {
    position: absolute;
    content: "";
    display: inline-block;
    background-image: url(../img/drop04.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 12%;
    padding-bottom: 12%;
    right: 6%;
    top: -17%;
}

.CatchApproach01,
.CatchApproach02,
.CatchApproach03,
.CatchApproach04 {
    margin-bottom: min(8vw, 60px);
    position: relative;
}

.CatchApproach01::before,
.CatchApproach02::before,
.CatchApproach03::before,
.CatchApproach04::before {
    position: absolute;
    content: "";
    display: block;
    transform: translate(-50%, -50%) scale(0.5);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: min(56.5333333333vw, 424px);
    height: min(29.6vw, 222px);
    left: 50%;
    top: 0;
}

.CatchApproach01::before {
    background-image: url(../img/approach01_sp.png);
}

.CatchApproach02::before {
    background-image: url(../img/approach02_sp.png);
}

.CatchApproach02__img {
    text-align: center;
    margin: min(5.3333333333vw, 40px) 0;
}

.CatchApproach02__img img {
    width: 83.33%;
}

.CatchApproach03::before {
    background-image: url(../img/approach03_sp.png);
}

.CatchApproach04::before {
    background-image: url(../img/approach04_sp.png);
}

.Footer {
    font-family: "Noto Sans JP", sans-serif;
    font-size: min(3.2vw, 24px);
    background-color: #001e4b;
    text-align: center;
    padding: 1em 0;
    color: #fff;
}

.Footer a {
    color: #fff;
    text-decoration: underline;
    margin-bottom: .5em;
    transition: all .3s;
    display: inline-block;
    width: 100%;
}

.Footer--inner {
    width: 80%;
    margin: 0 auto;
    padding-bottom: .4em;
}

.SectionRead img {
    width: 100%;
}

/*202403追加*/
.introduction{
	background-color: #FFF;
}
.introduction_t{
}
.title01{
}
.SectionApproach--sup{
	color: #3e3e3e;
	margin-top: 30px;
	padding-left:10vw;
	font-size:min(2.6666666667vw,16px);
	text-align:right;
}

.bestcosme{
    position: relative;
	width: 100%;
}

.bestcosme-text {
    position: absolute;
}


.point_mv {
    position: relative; 
    max-width: 100%; 
}

.point_mv img {
    width: 100%; 
    height: auto; 
}

.mv03 {
    position: absolute; 
    left: 15%; 
    top: 62%; 
    transform: translate(-5%, -50%); 
    width: 80vw; 
    max-width: 580px; 
/*    height: auto;  高さを自動調整 */
}

/* 750px以下の画面サイズに対するスタイル */
@media (max-width: 750px) {
    .mv03 {
        left: 50%; 
        top: 62%; 
        transform: translate(-50%, -50%); 
        width: 80%; 
        max-width: none; 
        height: auto; 
        aspect-ratio: 16 / 10; 
    }
}

.mv03 video {
    width: 100%; 
    height: auto; 
    aspect-ratio: 16 / 10;
    object-fit: cover; 
}

/* 応募規約 */
/* フォント全体設定 */
body {
  font-family: 'Noto Sans', sans-serif; /* Googleフォント「Noto Sans」 */
  background-color: #fff; /* 背景色を白に */
  margin: 0; /* ページ全体のマージンをリセット */
  padding: 0;
}

/* 全体の幅設定 */
.box01 {
  max-width: 750px;
  width: 90%; 
  border: 1px solid #bc9837; 
  padding: 20px; 
  box-sizing: border-box; 
  margin: 10px auto 55px; 
  background-color: #fff; 
  position: relative; /* 三角形を配置するために相対配置 */
}

/* タイトル部分 */
.box-ttl {
  width: 95%; 
  font-size: 30px; 
  color: #bc9837; 
  font-weight: 300; 
  margin-bottom: 10px; 
  letter-spacing: 0.1em;}

/* タイトル下の線 */
.box-divider {
  width: 98%; 
  height: 2px; 
  background-color: #bc9837; 
  margin: 0 auto 20px; 
}

/* リストスタイル */
.box-list {
  width: 95%; 
  list-style: none;
  padding: 0;
  margin: 0; 
}

/* リスト項目 - 点付き */
.box-item-dot {
  margin-bottom: 15px; 
  padding-left: 20px; 
  text-indent: -20px; 
  font-size: 20px; 
  color: #000; 
  line-height:1.4em;
}

.box-item-dot::before {
  content: "・"; 
  color: #000; 
  margin-right: 5px; 
}

/* リスト項目 - 注記 */
.box-item-note {
  margin-bottom: 10px; 
  padding-left: 20px; 
  text-indent: -20px; 
  font-size: 16px; 
  color: #000; 
  line-height:1.4em;
}

.box-item-note::before {
  content: "※"; 
  color: #000; 
  margin-right: 5px; 
}
/* リスト項目 - 注記赤 */
.box-item-note-red {
  margin-bottom: 10px; 
  padding-left: 20px; 
  text-indent: -20px; 
  font-size: 16px; 
  color: red;
  line-height:1.4em;
}

.box-item-note-red::before {
  content: "※"; 
  color: red; 
  margin-right: 5px;
}

/* 三角形を追加 */
.box-triangle {
  width: 0;
  height: 0;
  border-left: 26px solid transparent; 
  border-right: 26px solid transparent;
  border-top: 30px solid #bc9837; 
  position: absolute;
  bottom: -50px; 
  left: calc(50% - 30px); 
}

/*モニター募集*/
.monitor{
	margin-bottom: 20px;
}
.monitor a{
	margin: 30px auto 50px;
}
.monitor a:hover{
    opacity: 0.7;	
}
#monitor-flow{
	margin-bottom: 10%;
}
.apply{
	margin-bottom: 50px;
	font-size: xx-large;
	text-align: center;
	font-weight: 400;
	line-height: 1.6;
}
.apply a{
	margin: 0 0 30px;
}
.apply a:hover{
    opacity: 0.7;	
}

.kome{
	background-color:#fff;
	color: #000;
	font-weight: 200;
	text-align:left;
	padding-top:10px;
	padding-bottom: 30px;
	padding-left: clamp(10px, 1.2vw + 15px, 30px);
	width:100%;
	font-size: clamp(12px, 1vw + 8px, 15px);
	line-height: 1.5;
}

/* ----------------------------------------
    Media query
---------------------------------------- */
/* -- PC -- */
@media screen and (min-width: 750px) {
    .is-Pc {
        display: inline-block;
    }

    .is-Sp {
        display: none;
    }
}

/* -- SP -- */
@media screen and (max-width: 749px) {
    .is-Sp {
        display: inline-block;
    }

    .is-Pc {
        display: none;
    }
}