@charset "utf-8";
/* ================================
  brand.css
  - 브랜드 공통(모든 정적 서브페이지)
================================ */
.brand .contents {
	padding-bottom: 0;
}
@media (min-width: 1024px) {
    .brand .contents {
        padding-top: 0 !important;
    }
}
@media (min-width: 1280px) {
    .brand .contents {
        max-width: unset;
        padding-top: 0 !important;
    }
}

/* 브랜드 소개 */
.brand.introduce {

}
/* 브랜드 소개  >  공통 */
.brand.introduce .conts-wrap {
	height: calc(100vh - var(--header-any--h));
	position: relative;
	display: flex;
	flex-direction: column;
}
.brand.introduce .img-cont {
	flex: 0 0 auto;
	width: 100%;
	height: 34rem;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-color: var(--sdcm-color-secondary-10);
}
.brand.introduce .img-cont.bg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
}
.brand.introduce .text-cont {
	position: relative;
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 3rem;
	width: 100%;
	height: 55%;
}
.brand.introduce .img-cont.bg + .text-cont {
	z-index: 1;
	width: 100%;
	height: 100%;
}
.brand.introduce .text-cont .text-wrap {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	gap: .8rem;
}
.brand.introduce .text-cont .title {
	position: relative;
	font-weight: var(--sdcm-font-weight-bold);
	font-size: 1.9rem;
	text-align: center;
}
.brand.introduce .text-cont .title > * {
	position: relative;
	z-index: 1;
}
.brand.introduce .text-cont .title:before {
	position: absolute;
	top: 30%;
	left: 50%;
	z-index: 0;
	transform: translate(-50%, -50%);
	font-size: 12rem;
	font-weight: var(--sdcm-font-weight-bold);
	color: var(--sdcm-color-primary-5);
}
.brand.introduce .text-cont .text {
	font-size: 1.5rem;
	text-align: center;
}
.brand.introduce .text-cont .text .accent {
	font-weight: var(--sdcm-font-weight-bold);
	color: var(--sdcm-color-text-primary);
}
/* 브랜드소개 > start */
.brand.introduce .start-wrap {

}
.brand.introduce .start-wrap .img-cont {
	background-image: url(/images/sdcm/m/img-brand-intro-start-mobile.jpg);
}
.brand.introduce .start-wrap .text-cont {
	color: #fff;
	font-weight: var(--sdcm-font-weight-medium);
	gap: 0;
}
.brand.introduce .start-wrap .text-cont .small {
	font-family: 'Paperlogy', 'Pretendard Variable' ;
	font-weight: var(--sdcm-font-weight-regular);
	font-size: 1.5rem;
	margin-bottom: 1.6rem;
}
.brand.introduce .start-wrap .text-cont .title {
	font-weight: var(--sdcm-font-weight-bold);
	font-size: 3.3rem;
	text-shadow: 0 0 6px rgba(0,0,0,0.25);
	margin-bottom: 3rem;
}
.brand.introduce .start-wrap .text-cont .text {
	text-shadow: 0 0 6px rgba(0,0,0,0.6);
}

/* 브랜드소개 > lab */
.brand .lab-wrap {}
.brand.introduce .lab-wrap .img-cont {
	background-image: url(/images/sdcm/m/img-brand-intro-lab-mobile.jpg);
}
.brand.introduce .lab-wrap .text-cont .title:before {
	content: 'Lab';
}
/* 브랜드소개 > care */
.brand .care-wrap {}
.brand.introduce .care-wrap .img-cont {
	background-image: url(/images/sdcm/m/img-brand-intro-care-mobile.jpg);
}
.brand.introduce .care-wrap .text-cont .title:before {
	content: 'Care';
}
/* 브랜드소개 > life */
.brand .life-wrap {}
.brand.introduce .life-wrap .img-cont {
	background-image: url(/images/sdcm/m/img-brand-intro-life-mobile.jpg);
}
.brand.introduce .life-wrap .text-cont .title:before {
	content: 'Life';
}
/* 브랜드소개 > end */
.brand .end-wrap {}
.brand.introduce .end-wrap .img-cont {
	background-image: url(/images/sdcm/m/img-brand-intro-end-mobile.jpg);
}
.brand.introduce .end-wrap .text-cont {
	color: #fff;
	font-weight: var(--sdcm-font-weight-medium);
}
.brand.introduce .end-wrap .text-cont .title {
	font-weight: var(--sdcm-font-weight-regular);
	font-size: 2.5rem;
}
.brand.introduce .end-wrap .text-cont .title {
	display: flex;
	flex-direction: column;
	gap:0;
}
.brand.introduce .end-wrap .text-cont .text {
	text-shadow: 0 0 6px rgba(0,0,0,0.6);
}
.brand.introduce .end-wrap .text-cont .title > div {
	text-shadow: 0 0 6px rgba(0,0,0,0.25);
}
.brand.introduce .end-wrap .text-cont .title > div:first-child {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 1rem;
}
.brand.introduce .end-wrap .text-cont .title strong {
	font-weight: var(--sdcm-font-weight-bold);
}
.brand.introduce .end-wrap .text-cont .title span {
	font-size: 0;
	display: inline-flex;
}
.brand.introduce .end-wrap .text-cont .title span img {
	width: 9.8rem;
}

@media (min-width: 1024px) {
	/* 브랜드 소개 */
	/* 브랜드 소개  >  공통 */
	.brand.introduce .img-cont {
		height: 45%;
	}
}

@media (min-width: 1280px) {
	/* 브랜드 소개 */
	/* 브랜드 소개  >  공통 */
	.brand.introduce .conts-wrap {
		flex-direction: row;
	}
	.brand.introduce .img-cont {
		width: 50%;
		height: 100%;
	}
	.brand.introduce .img-cont.bg + .text-cont {
		width: 50%;
	}
	.brand.introduce .text-cont {
		width: 50%;
		height: 100%;
	}
	.brand.introduce .text-cont .text-wrap {
		gap: 1.6rem;
	}
	.brand.introduce .text-cont .title {
		position: static;
		font-weight: var(--sdcm-font-weight-semibold);
		font-size: 2.6rem;
	}
	.brand.introduce .text-cont .title:before {
		transform: translate(0, 0);
		font-size: 24rem;
	}
	.brand.introduce .text-cont .text {
		font-size: 1.7rem;
	}
	.brand.introduce .text-cont .text .accent {
		font-weight: var(--sdcm-font-weight-semibold);
	}
	/* 브랜드소개 > start */
	.brand.introduce .start-wrap .img-cont {
		background-image: url(/images/sdcm/m/img-brand-intro-start-pc.jpg);
	}
	.brand.introduce .start-wrap .text-cont .title {
		font-size: 4.4rem;
	}
	.brand.introduce .start-wrap .text-cont .small {
		font-size: 1.7rem;
	}
	.brand.introduce .start-wrap .text-cont .text {
		font-size: 1.9rem;
	}

	/* 브랜드소개 > lab */
	.brand .lab-wrap .img-cont {
		background-image: url(/images/sdcm/m/img-brand-intro-lab-pc.jpg);
		order: 2;
	}
	.brand .lab-wrap .text-cont {
		order: 1;
	}
	.brand.introduce .lab-wrap .text-cont .title:before {
		top: 1rem;
		left: 6.8rem;
	}
	/* 브랜드소개 > care */
	.brand .care-wrap {}
	.brand.introduce .care-wrap .img-cont {
		background-image: url(/images/sdcm/m/img-brand-intro-care-pc.jpg);
	}
	.brand.introduce .care-wrap .text-cont .title:before {
		top: unset;
		left: unset;
		right: 6.7rem;
		bottom: -3rem;
	}
	/* 브랜드소개 > life */
	.brand .life-wrap .img-cont {
		background-image: url(/images/sdcm/m/img-brand-intro-life-pc.jpg);
		order: 2;
	}
	.brand .life-wrap .text-cont {
		order: 1;
	}
	.brand.introduce .life-wrap .text-cont .title:before {
		top: 0;
		left: unset;
		right: 6.7rem;
	}

	/* 브랜드소개 > end */
	.brand.introduce .end-wrap .img-cont {
		background-image: url(/images/sdcm/m/img-brand-intro-end-pc.jpg);
	}
	.brand.introduce .end-wrap .text-cont {
		margin-left: auto;
		font-weight: var(--sdcm-font-weight-regular);
	}
	.brand.introduce .end-wrap .text-cont .text  {
		 font-size: 2.6rem;
	}
	.brand.introduce .end-wrap .text-cont .text {
		font-size: 1.9rem;
	}
	.brand.introduce .end-wrap .text-cont .title span img {
		width: 12rem;
	}

}

/* 케어포랩 스토리 */
.brand.story {

}
/* 케어포랩 스토리  >  공통 */
.brand.story .conts-wrap {
	height: calc(100vh - var(--header-any--h));
	position: relative;
	display: flex;
	flex-direction: column;
}
.brand.story .img-cont {
	flex: 0 0 auto;
	width: 100%;
	height: 34rem;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-color: var(--sdcm-color-secondary-10);
}
.brand.story .img-cont.bg {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
}
.brand.story .text-cont {
	position: relative;
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 3rem;
	width: 100%;
	height: 55%;
}
.brand.story .img-cont.bg + .text-cont {
	z-index: 1;
	width: 100%;
	height: 100%;
}
.brand.story .text-cont .text-wrap {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	gap: 1.2rem;
}
.brand.story .text-cont .title {
	position: relative;
	font-weight: var(--sdcm-font-weight-bold);
	font-size: 1.9rem;
	text-align: center;
}
.brand.story .text-cont .title > * {
	position: relative;
	z-index: 1;
}
.brand.story .text-cont .title:before {
	position: absolute;
	top: 30%;
	left: 50%;
	z-index: 0;
	transform: translate(-50%, -50%);
	font-size: 12rem;
	font-weight: var(--sdcm-font-weight-bold);
	color: var(--sdcm-color-primary-5);
}
.brand.story .text-cont .text {
	font-size: 1.5rem;
	text-align: center;
}
.brand.story .text-cont .text .accent {
	font-weight: var(--sdcm-font-weight-bold);
	color: var(--sdcm-color-text-primary);
}

/* 케어포랩 스토리 > start */
.brand.story .start-wrap {

}
.brand.story .start-wrap .img-cont {
	background-image: url(/images/sdcm/m/img-brand-story-start.jpg);
}
.brand.story .start-wrap .text-cont {
	color: #fff;
	font-weight: var(--sdcm-font-weight-medium);
	gap: 0;
}
.brand.story .start-wrap .text-cont .small {
	font-family: 'Paperlogy', 'Pretendard Variable' ;
	font-weight: var(--sdcm-font-weight-regular);
	font-size: 1.5rem;
	margin-bottom: 1.6rem;
}
.brand.story .start-wrap .text-cont .title {
	font-weight: var(--sdcm-font-weight-bold);
	font-size: 3.3rem;
	text-shadow: 0 0 6px rgba(0,0,0,0.25);
	margin-bottom: 3rem;
}
.brand.story .start-wrap .text-cont .text {
	text-shadow: 0 0 6px rgba(0,0,0,0.6);
}
.brand.story .start-wrap .text-cont .text strong {
	font-weight: var(--sdcm-font-weight-semibold);
}

/* 케어포랩 스토리 > why */
.brand.story .why-wrap {

}
.brand.story .why-wrap .img-cont {
}
.brand.story .why-wrap .text-cont {
	align-items: flex-start;
	height: 100%;
	padding: 2.4rem;
	background-image: url(/images/sdcm/m/img-brand-story-why-text.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.brand.story .why-wrap .text-cont .text-wrap {
	align-items: flex-start;
	gap: 2rem;
}
.brand.story .why-wrap .text-cont .title {
	font-size: 2.6rem;
	font-weight: var(--sdcm-font-weight-semibold);
}
.brand.story .why-wrap .text-cont .text {
	font-size: 1.9rem;
	text-align: left;
}
.brand.story .why-wrap .text-cont .text .accent {
	font-size: 2.2rem;
}


/* 케어포랩 스토리 > detail */
.brand.story .detail-wrap {
	height: auto;
}
.brand.story .detail-wrap .img-cont {
	background-color: #fff;
}
.brand.story .detail-wrap .img-cont.bg + .text-cont {
	height: 40rem;
}
.brand.story .detail-wrap .text-cont {
	height: 40rem;
	background-color: transparent;
	transition: .2s ease-in-out;
}
.brand.story .detail-wrap .text-cont:hover {
	background-color: var(--sdcm-color-primary-30);
	color: #fff;
}

.brand.story .detail-wrap .text-cont:not(:last-child) {
	border-bottom: 1px solid var(--sdcm-color-primary-30);
}

/* 케어포랩 스토리 > end */
.brand.story .end-wrap {

}
.brand.story .end-wrap .img-cont {
	background-image: url(/images/sdcm/m/img-brand-story-end.jpg);
}
.brand.story .end-wrap .text-cont {
	color: #fff;
	font-weight: var(--sdcm-font-weight-medium);
}
.brand.story .end-wrap .text-cont .title {
	font-size: 2.6rem;
}
.brand.story .end-wrap .text-cont .title {
	display: flex;
	flex-direction: column;
	gap:0;
}
.brand.story .end-wrap .text-cont .text {
	text-shadow: 0 0 6px rgba(0,0,0,0.6);
}
.brand.story .end-wrap .text-cont .title {
	text-shadow: 0 0 6px rgba(0,0,0,0.25);
}

@media (min-width: 1024px) {
	/* 케어포랩 스토리 */
	/* 케어포랩 스토리  >  공통 */
	.brand.story .img-cont {
		height: 45%;
	}
}

@media (min-width: 1280px) {
	/* 케어포랩 스토리 */
	/* 케어포랩 스토리  >  공통 */
	.brand.story .conts-wrap {
		flex-direction: row;
	}
	.brand.story .img-cont {
		width: 50%;
		height: 100%;
	}
	.brand.story .img-cont.bg + .text-cont {
		width: 42%;
	}
	.brand.story .text-cont {
		height: 100%;
	}
	.brand.story .text-cont .text-wrap {
		gap: 1.6rem;
	}
	.brand.story .text-cont .title {
		position: static;
		font-weight: var(--sdcm-font-weight-semibold);
		font-size: 2.6rem;
	}
	.brand.story .text-cont .title:before {
		transform: translate(0, 0);
		font-size: 24rem;
	}
	.brand.story .text-cont .text {
		font-size: 1.7rem;
	}
	.brand.story .text-cont .text .accent {
		font-weight: var(--sdcm-font-weight-semibold);
	}
	/* 케어포랩 스토리 > start */
	.brand.story .start-wrap {
		justify-content: center;
	}
	.brand.story .start-wrap .img-cont {

	}
	.brand.story .start-wrap .text-cont .title {
		font-size: 4.4rem;
	}
	.brand.story .start-wrap .text-cont .small {
		font-size: 1.7rem;
	}
	.brand.story .start-wrap .text-cont .text {
		font-size: 1.9rem;
	}

	/* 케어포랩 스토리 > why */
	.brand.story .why-wrap .img-cont {
		width: 42%;
		background-image: url(/images/sdcm/m/img-brand-story-why.jpg);
	}
	.brand.story .why-wrap .text-cont {
		width: 58%;
		padding: 0 2.4rem 0 10.5%;
	}

	/* 케어포랩 스토리 > detail */
	.brand.story .detail-wrap {
		height: calc(100vh - var(--header-any--h));
	}
	.brand.story .detail-wrap .img-cont {
		background-image: url(/images/sdcm/m/img-brand-story-detail.jpg);
	}
	.brand.story .detail-wrap .img-cont.bg + .text-cont {
		width: 33.3333%;
		height: 100%;
	}
	.brand.story .detail-wrap .text-cont {
		width: 33.3333%;
		height: 100%;
	}
	.brand.story .detail-wrap .text-cont:not(:last-child) {
		border-bottom: none;
		border-right: 1px solid var(--sdcm-color-primary-30);
	}

	/* 케어포랩 스토리 > end */
	.brand.story .end-wrap .text-cont .title {
		font-size: 4.4rem;
		font-weight: var(--sdcm-font-weight-bold);
	}
	.brand.story .end-wrap .text-cont .text {
		font-size: 1.9rem;
	}
}