@charset "utf-8";
/* 
C00336 프리마 피부과
*/

/* 메인전용컨텐츠 */
.MainContents_Area * {}
.MainContents_Area{content:""; clear:both; display:block; position:relative; width:100%; text-align:center; box-sizing:border-box; white-space:normal; word-break:keep-all;}
/*슬라이드 초기화*/
.MultiImgSlider .slick-slide li .ThumBox{background-color:transparent;}

body .MainContents_Area .Inner{width:1200px; min-width:1200px;}
body .MainContents_Area > .MainSection{z-index:1;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/*1번배너*/
body .MainContents_Area .mainSection01{width:100%; position:relative; overflow:hidden; height:100vh;}
body .MainContents_Area .mainSection01 .Inner{width:100%; min-width:100%;}
body .MainContents_Area .mainSection01 .wrap{width:100%; position:relative;}
body .MainContents_Area .mainSection01 .back img{width:100%;}
body .MainContents_Area .mainSection01 .wrap .mainTitle{position:absolute; top:50%; left:50%; transform:translate(-50%,-75%); width:100%; z-index:10; text-align:left; padding-left:360px;}
body .MainContents_Area .mainSection01 .wrap .mainTitle span{display:block;}
body .MainContents_Area .mainSection01 .wrap .mainTitle img{display:inline-block;}
	/*배경*/
	body .MainContents_Area .mainSection01 .wrap .back{width:100%; position:relative;}
	body .MainContents_Area .mainSection01 .wrap .back span{position:absolute; height:100%; right:0; bottom:0;}
	/*디폴트*/
	body .MainContents_Area .mainSection01 .wrap .mainTitle .sld_ani01 span{display:inline-block; vertical-align:middle; margin-left:15px; font-size:17pt; font-weight:500; color:#605449;}
	body .MainContents_Area .mainSection01 .wrap .mainTitle .sld_ani02 span{font-size:48pt; font-weight:700; color:#605449; margin-top:40px;}
	body .MainContents_Area .mainSection01 .wrap .mainTitle .sld_ani03 span{font-size:14pt; font-weight:400; line-height:1.6; margin-top:40px;}
	body .MainContents_Area .mainSection01 .wrap .mainTitle .sld_ani01{opacity:0;}
	body .MainContents_Area .mainSection01 .wrap .mainTitle .sld_ani02{opacity:0;}
	body .MainContents_Area .mainSection01 .wrap .mainTitle .sld_ani03{opacity:0;}
	/*1번영역*/
	body .MainContents_Area .mainSection01 .Slide01 .wrap .mainTitle{text-align:center; padding-left:0;}
	body .MainContents_Area .mainSection01 .Slide01 .wrap .mainTitle .sld_ani01 span{font-size:56pt; color:#605449; line-height:1.4; display:block; margin-left:0;}
	body .MainContents_Area .mainSection01 .Slide01 .wrap .mainTitle .sld_ani02{margin-top:60px;}
	body .MainContents_Area .mainSection01 .Slide01 .wrap .mainTitle .sld_ani02 span{font-size:17pt; font-weight:400; color:#605449; display:inline-block; vertical-align:middle; margin:0 20px;}
	body .MainContents_Area .mainSection01 .Slide01 .wrap .mainTitle .sld_ani02 span b{font-weight:700; color:#605449;}

	/*페이지네이션*/
	body .MainContents_Area .mainSection01 .SwiperPagination1{position:absolute; left:50%; bottom:250px; transform:translate(-50%,0); z-index:1;}
	body .MainContents_Area .mainSection01 .SwiperPagination1 span{display:inline-block; vertical-align:middle; margin:0 6px; background:#d2cac0; width:8px; height:8px; opacity:1;}
	body .MainContents_Area .mainSection01 .SwiperPagination1 span.swiper-pagination-bullet-active{border:4px solid #d2cac0; background:#605449; box-sizing:content-box;}

	/*텍스트애니메이션*/
	.mainSection01 .Slide .Slide01Ani01_01{animation:Slide01Ani01_01 2s ease; animation-fill-mode:forwards; transform:translateX(50px);}
	@keyframes Slide01Ani01_01{ 0%{transform:translateX(50px); opacity:0;} 100%{transform:translateX(0); opacity:1;} }
	.mainSection01 .Slide .Slide01Ani01_02{animation:Slide01Ani01_02 2s ease; animation-fill-mode:forwards; animation-delay: 0.5s; transform:translateX(50px);}
	@keyframes Slide01Ani01_02{ 0%{transform:translateX(50px); opacity:0;} 100%{transform:translateX(0); opacity:1;} }
	.mainSection01 .Slide .Slide01Ani01_03{animation:Slide01Ani01_03 2s ease; animation-fill-mode:forwards; animation-delay: 1s; transform:translateX(50px);}
	@keyframes Slide01Ani01_03{ 0%{transform:translateX(50px) opacity:0;;} 100%{transform:translateX(0); opacity:1;} }
	/*1번 애니메이션*/
	.mainSection01 .Slide01 .Slide01Ani01_01{animation:Slide01Ani01_01_1 2s ease; animation-fill-mode:forwards; transform:translateY(-50px);}
	@keyframes Slide01Ani01_01_1{ 0%{transform:translateY(-50px); opacity:0;} 100%{transform:translateY(0); opacity:1;} }
	.mainSection01 .Slide01 .Slide01Ani01_02{animation:Slide01Ani01_01_2 2s ease; animation-fill-mode:forwards; animation-delay: 0.5s; transform:translateY(-50px);}
	@keyframes Slide01Ani01_01_2{ 0%{transform:translateY(-50px); opacity:0;} 100%{transform:translateY(0); opacity:1;} }

	/*스크롤다운*/
	body .MainContents_Area .mainSection01 .scrollDown{position:absolute; left:50%; bottom:120px; transform:translate(-50%,0); width:100%; z-index:1;}
	body .MainContents_Area .mainSection01 .scrollDown p{color:#605449; font-size:8pt; font-weight:600; letter-spacing:1.5pt; padding-bottom:10px;}
	body .MainContents_Area .mainSection01 .scrollDown span{display:block; width:6px; height:6px; margin:0 auto; background:#605449; opacity:0.45; border-radius:500px; margin-top:5px; animation: circleFade 1.6s infinite ease-in-out;}
	body .MainContents_Area .mainSection01 .scrollDown span.circle01{ animation-delay: 0s; }
	body .MainContents_Area .mainSection01 .scrollDown span.circle02{ animation-delay: 0.2s; }
	body .MainContents_Area .mainSection01 .scrollDown span.circle03{ animation-delay: 0.4s; }
	body .MainContents_Area .mainSection01 .scrollDown span.circle04{ animation-delay: 0.6s; }
	@keyframes circleFade{ 0%   { opacity: 0.2; }	25%  { opacity: 1; }	50%  { opacity: 0.2; }	100% { opacity: 0.2; } }
	
	/*반응형*/
	@media screen and (min-width:1930px) {
	body .MainContents_Area .mainSection01 .wrap .mainTitle{padding-left:20vw; top:20vw;}
	}
	@media screen and (min-width:2200px) {
	body .MainContents_Area .mainSection01 .wrap .mainTitle{padding-left:20vw; top:15vw;}
	}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/*2번배너*/
body .MainContents_Area .mainSection02{width:100%; position:relative; overflow:hidden; padding:150px 0; background:#ffffff;}
body .MainContents_Area .mainSection02 .contWrap{width:100%; display:inline-flex; align-items:center; justify-content:space-between;}
body .MainContents_Area .mainSection02 .contWrap .imgWrap{width:45%; position:relative; height:100%;}
body .MainContents_Area .mainSection02 .contWrap .imgWrap .imgBox{position:absolute; width:100%; height:100%; top:0; left:0; opacity:0; transition:0.5s;}
body .MainContents_Area .mainSection02 .contWrap .imgWrap .imgBox01{position:relative;}
body .MainContents_Area .mainSection02 .contWrap .imgWrap .imgBox.active{opacity:1;}
body .MainContents_Area .mainSection02 .contWrap .imgWrap .imgBox img{width:100%;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap{width:55%; padding-left:100px;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox{width:100%; background:#f5f4ef; margin-top:10px; transition:0.5s;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox a{display:block; width:100%; padding:35px 30px;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox span{display:inline-block; vertical-align:middle; color:#605449; font-size:36pt; width:16%;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox .txt{display:inline-block; vertical-align:middle;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox .txt p.typeA{font-weight:600; line-height:1; font-size:13pt;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox .txt p.typeB{color:#605449; margin-top:10px; font-weight:600; line-height:1; font-size:19pt;}
body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox01{margin-top:0;}
	/*액티브*/
	body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox.active{background:#afa194;}
	body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox.active span{color:#fff;}
	body .MainContents_Area .mainSection02 .contWrap .txtWrap .txtBox.active .txt p{color:#fff;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/*3번배너*/
body .MainContents_Area .mainSection03{width:100%; position:relative; overflow:hidden; padding:150px 0; background:#f7f6f0;}
body .MainContents_Area .mainSection03 .Inner{width:100%; min-width:100%;}
body .MainContents_Area .mainSection03 .contWrap{width:100%; display:inline-flex; align-items:center; justify-content:space-between;}
body .MainContents_Area .mainSection03 .txtWrap{width:50%; padding-left:360px;}
body .MainContents_Area .mainSection03 .txtWrap h2{color:#605449;}
body .MainContents_Area .mainSection03 .txtWrap h2 b{color:#605449;}
body .MainContents_Area .mainSection03 .txtWrap span{display:block; margin:40px 0;}
body .MainContents_Area .mainSection03 .imgWrap{width:50%; position:relative;}
body .MainContents_Area .mainSection03 .imgWrap .imgBox{width:100%; position:relative; overflow:hidden; border-radius:500px 0 0 500px;}
body .MainContents_Area .mainSection03 .imgWrap .imgBox img{width:100%;}
body .MainContents_Area .mainSection03 .imgWrap span{position:absolute; right:20px; bottom:-33px;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/*4번배너*/
body .MainContents_Area .mainSection04{width:100%; position:relative; overflow:hidden; background:url('/img/C00336/mainSection04_img.jpg')no-repeat center/cover;}
body .MainContents_Area .mainSection04 .Inner{width:100%; min-width:100%;}
body .MainContents_Area .mainSection04 .contWrap{width:100%; display:inline-flex; align-items:center; justify-content:space-between;}
body .MainContents_Area .mainSection04 .contWrap .txtBox{width:25%; text-align:center; opacity:0.5; border-right:1px solid #fff; padding:200px 0;}
body .MainContents_Area .mainSection04 .contWrap .txtBox:last-child{border-right:0;}
body .MainContents_Area .mainSection04 .contWrap .txtBox span{color:#fff; font-size:24pt; display:block;}
body .MainContents_Area .mainSection04 .contWrap .txtBox p{color:#fff; margin-top:40px;}
body .MainContents_Area .mainSection04 .contWrap .txtBox p.typeA{margin-top:50px;}
body .MainContents_Area .mainSection04 .contWrap .txtBox p b{color:#fff;}
	/*액티브*/
	body .MainContents_Area .mainSection04 .contWrap .txtBox.active{opacity:1; background:rgba(49,40,26,0.8); border:0;}
	body .MainContents_Area .mainSection04 .contWrap .txtBox.active span{color:#afa194;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/*5번배너*/
body .MainContents_Area .mainSection05{width:100%; position:relative; overflow:hidden; padding:150px 0; background:#f7f6f0;}
body .MainContents_Area .mainSection05 .Inner{width:100%; min-width:100%; display:inline-flex; align-items:center; justify-content:space-between;}
body .MainContents_Area .mainSection05 .txtWrap{width:45%; padding-left:360px;}
body .MainContents_Area .mainSection05 .txtWrap h2{font-weight:800;}
body .MainContents_Area .mainSection05 .txtWrap h2 b{font-weight:800; color:#605449;}
body .MainContents_Area .mainSection05 .txtWrap .arrowWrap{margin-top:30px;}
body .MainContents_Area .mainSection05 .txtWrap .arrowWrap .swiper-button{width:40px; height:40px; border-radius:500px; border:2px solid #afa194; text-align:center; position:relative; display:inline-block; margin-right:12px; cursor:pointer; transition:0.5s;}
body .MainContents_Area .mainSection05 .txtWrap .arrowWrap .swiper-button img{position:absolute; width:auto; left:50%; top:50%; transform:translate(-50%,-50%);}
body .MainContents_Area .mainSection05 .txtWrap .arrowWrap .swiper-button:hover{background:#afa194;}
body .MainContents_Area .mainSection05 .txtWrap .arrowWrap .swiper-button:hover img{filter:brightness(1000);}
body .MainContents_Area .mainSection05 .sectionCont{width:55%;}
body .MainContents_Area .mainSection05 .sectionCont a{width:100%; display:block;}
body .MainContents_Area .mainSection05 .sectionCont .imgBox{width:100%; overflow:hidden; position:relative;}
body .MainContents_Area .mainSection05 .sectionCont .imgBox::before{content:''; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:100%; height:100%; background:rgba(96,84,73,0.5); z-index:1; transition:0.5s; opacity:0;}
body .MainContents_Area .mainSection05 .sectionCont .imgBox::after{content:'MORE'; position:absolute; left:50%; top:100%; transform:translate(-50%,0); width:100%; z-index:1; text-align:center; font-size:14pt; font-weight:800; color:#e1ded9; letter-spacing:3pt; transition:0.5s;}
body .MainContents_Area .mainSection05 .sectionCont .imgBox img{width:100%;}
body .MainContents_Area .mainSection05 .sectionCont .txtBox p{font-weight:600; margin-top:15px; width:100%; text-align:left;}
	/*호버*/
	body .MainContents_Area .mainSection05 .sectionCont a:hover .imgBox::before{opacity:1;}
	body .MainContents_Area .mainSection05 .sectionCont a:hover .imgBox::after{transform:translate(-50%,-50%); top:50%;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/*6번배너*/
body .MainContents_Area .mainSection06{width:100%; position:relative; overflow:hidden;}
body .MainContents_Area .mainSection06 .Inner{width:100%; min-width:100%;}
body .MainContents_Area .mainSection06 .txtBox{width:1200px; margin:0 auto;}
body .MainContents_Area .mainSection06 .txtBox p.italiana-regular{font-size:36pt; font-weight:400; color:#fff; line-height:1.4; position:relative;}
body .MainContents_Area .mainSection06 .txtBox p.italiana-regular span{display:block; position:absolute; text-align:right; width:780px; right:0; bottom:20px;}
body .MainContents_Area .mainSection06 .txtBox p.italiana-regular span b{display:inline-block; width:90%; height:1px; background:#afa194; vertical-align:middle; margin-right:2%;}
body .MainContents_Area .mainSection06 .txtBox p.typeA{color:#fff; text-align:right; margin-top:40px;}
body .MainContents_Area .mainSection06 .contBox{background:url('/img/C00336/mainSection06_bg.jpg')no-repeat; background-position:center center; background-size:cover; background-position-y:40%; background-attachment:fixed; padding:150px 0;}
