@charset "utf-8";
/*
더원의원
C00329
*/

/* [메인] body바로 아래 wrap */
#wrap.mainWrap{overflow:visible;}

/* [메인] 메인컨텐츠 */
.MainContents_Area *{}
.MainContents_Area{content:""; clear:both; display:block; position:relative; width:100%; text-align:center; margin:auto; box-sizing:border-box; white-space:normal; word-break:keep-all; }
/* 영역 */
.MainContents_Area > section{content:""; clear:both; display:block; position:relative; width:100%; text-align:center; margin:auto; font-size:16px; padding:0; margin:0;}
.MainContents_Area > section > .Inner{padding:0;}
	

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* [통합섹션] 소개영역 */
section.NetSectionAbout{line-height:1; letter-spacing:-0.5px; background-size:cover; background-position:center; background-repeat:no-repeat; overflow:hidden;}
.NetSectionAbout > .Inner{width:100%; min-width:100%; display:flex; width:100%; height:auto; align-items:end; justify-content:center;}

	/* 기본세팅 --------------------------------------------------------- */
	/* 타이틀 */
	.NetSectionAbout .MainTitle{position:relative; display:inline-flex; width:50%; flex-direction:column; padding-left:16%; padding-bottom:9em;}
	.NetSectionAbout .MainTitle em{font-size:12pt; letter-spacing:1.5px; font-weight:400; display:block; color:#222222;}
	.NetSectionAbout .MainTitle h2{color:#222222; line-height:1.3; margin-top:10px; display:block; font-size:33pt; font-weight:600; margin-top:0.5em;}
	.NetSectionAbout .MainTitle h2 b{position:relative; line-height:1.1; margin-top:0.5em; color:#0e84f9; font-weight:600;}
	.NetSectionAbout .MainTitle p{width:100%; line-height:1.7; letter-spacing:-0.5px; font-size:15pt; font-weight:400; color:#222; margin-top:2em;}
	.NetSectionAbout .MainTitle p b{font-weight:600;}
	
	/* 내용 */
	.NetSectionAbout .ContArea{position:relative;  display:inline-flex; width:50%; margin:0 0 0 auto;}
	.NetSectionAbout .ContArea img{height:100%;}

	
/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* [통합섹션] 지점영역 */
section.NetSectionBranch{line-height:1; letter-spacing:-0.5px; overflow:hidden; padding:150px 0;}
.NetSectionBranch > .Inner{}

	/* 기본세팅 --------------------------------------------------------- */
	/* 타이틀 */
	.NetSectionBranch .MainTitle{position:relative; display:block; width:100%; text-align:center;}
	.NetSectionBranch .MainTitle em{font-size:12pt; letter-spacing:1.5px; font-weight:400; display:block; color:#888888;}
	.NetSectionBranch .MainTitle h2{color:#222222; line-height:1.3; margin-top:10px; display:block; font-size:36pt; font-weight:400; margin-top:0.5em;}
	.NetSectionBranch .MainTitle h2 b{color:#222222; font-weight:600;}
	
	/* 내용 */
	.NetSectionBranch ul{position:relative; display:flex; align-items:center; margin-top:5em; gap:4em; justify-content:center;}
	.NetSectionBranch ul li{position:relative; display:block; overflow:hidden;}
	.NetSectionBranch ul li a{position:relative; display:flex; overflow:hidden; padding:3.5em 3.5em 7em 3.5em; background-color:#e4e4e4; border-radius:12px; transition:all 300ms;}
	.NetSectionBranch ul li a span{color:#4f4f4f; font-size:24pt; letter-spacing:-0.5px; font-weight:600; min-width:400px; z-index:2;}
	.NetSectionBranch ul li a span small{color:#8d8d8d; font-size:20pt; font-weight:600; display:block; margin-top:0.8em;}
	.NetSectionBranch ul li a > div{position:relative;}
	.NetSectionBranch ul li a img{position:relative; transition:all 300ms;}
	.NetSectionBranch ul li a img.Defult{opacity:1; visibility:visible; z-index:2;}
	.NetSectionBranch ul li a img.Active{position:absolute; right:0; top:0; opacity:0; visibility:hidden; z-index:1;}
	.NetSectionBranch ul li a + img{position:absolute; bottom:-5%; z-index:1; left:50%; transform:translateX(-50%);}

	.NetSectionBranch ul li a:hover{background-color:#0e84f9;}
	.NetSectionBranch ul li a:hover span{color:#fff;}
	.NetSectionBranch ul li a:hover span small{color:#fff;}
	.NetSectionBranch ul li a:hover img.Defult{position:absolute; right:0; top:0; opacity:0; visibility:hidden; z-index:1;}
	.NetSectionBranch ul li a:hover img.Active{opacity:1; visibility:visible; z-index:2;}


/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* [섹션] 영상영역 */
section.SectionVideo{}
.SectionVideo > .Inner{width:100%; min-width:100vh; overflow:hidden;}

	/* 영상 --------------------------------------------------------- */
	.SectionVideo .swiper-slide{height:100vh; overflow:hidden;}
	.SectionVideo .MovieArea{position:absolute; display:table; z-index:1; width:100%; margin-left:-50%; left:50%; transform:translate(0%, -50%); top:50%;}
	.SectionVideo .Movie_IframArea{height:100%;}
	.SectionVideo .Movie_IframArea > div > div{height:100%; position:absolute; background-position:top; background-size:contain; background-repeat:no-repeat; top:0; width:100%; top:0;}

	/* 스크롤유도 --------------------------------------------------------- */
	.SectionVideo .MainScrollArea{position:absolute; z-index:10; left:50%; bottom:1.2em; transform:translate(-50%, 0); transition:all 500ms ease; opacity:1;}
	.SectionVideo .MainScrollArea img{}
	.SectionVideo .MainScrollArea .Mouse{border:2px solid #fff; display:block; border-radius:100px; width:33px; height:58px; margin:0 auto;}
	.SectionVideo .MainScrollArea .Mouse span{display:block; background:#fff; width:8px; height:8px; margin:10px auto auto auto; border-radius:50px;}
	.SectionVideo .MainScrollArea .Arrow{position:relative; display:block; margin-top:5px;}
	.SectionVideo .MainScrollArea .Arrow span{display:block; width:10px; height:10px; border-bottom:2px solid white; border-right:2px solid white; transform: rotate(45deg); margin-left:11.5px; animation:MainScroll 2s infinite; margin-top:1px;}
	.SectionVideo .MainScrollArea .Arrow span:nth-child(1){animation-delay:0s;}
	.SectionVideo .MainScrollArea .Arrow span:nth-child(2){animation-delay: -0.2s;}
	.SectionVideo .MainScrollArea .Arrow span:nth-child(3){ animation-delay:-0.4s;}
	
@media (max-width: 1920px) {
	section.SectionVideo > .Inner{width:100%; margin-left:-50%; left:50%;}
}
	
@keyframes MainScroll {
	0%	{opacity:0; transform:rotate(45deg) translate(-5px, -5px);}
	50%	{opacity:1;}
	100%{opacity:0;	transform:rotate(45deg) translate(5px, 5px);}
}


/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* [섹션] 프로그램영역 */
section.SectionProgram{line-height:1; letter-spacing:-0; background-color:#fff;}
.SectionProgram > .Inner{width:100%; min-width:100%;}

	/* 기본세팅 --------------------------------------------------------- */
	/* 타이틀 */
	.SectionProgram .MainTitle{position:relative; display:flex; width:50%; flex-direction:column; padding-left:6%; padding-top:clamp(0px, 8%, 10em);}
	.SectionProgram .MainTitle em{font-size:13pt; letter-spacing:1.5px; font-weight:400; display:block; color:#ababab;}
	.SectionProgram .MainTitle h2{color:#222222; line-height:1.1; margin-top:10px; display:block; font-size:36pt; font-weight:700; margin-top:17px;}
	.SectionProgram .MainTitle h2 b{position:relative; line-height:1.1; margin-top:0.5em; color:#0e84f9; font-weight:800;}
	.SectionProgram .MainTitle div{display:flex; align-items:start; width:620px; padding-top:2em;}
	.SectionProgram .MainTitle div p{width:50%; line-height:2; letter-spacing:-0.3px; font-size:15pt; font-weight:400; color:#434343;}

	/* 내용 */
	.SectionProgram .ContArea{height:fit-content;}
	.SectionProgram .ContArea > img{position:absolute; bottom:0; right:4%; z-index:1;}

	/* 슬라이드_큰이미지 */
	.SectionProgram .SwiperProgram_Big{position:relative; z-index:2;}
	.SectionProgram .SwiperProgram_Big .Slide > div{display:flex; width:100%; background-color:#fff;}
	.SectionProgram .SwiperProgram_Big .Slide .ImgBox{display:flex; width:50%; overflow:hidden; justify-content:center;}
	.SectionProgram .SwiperProgram_Big .Slide01 .ImgBox{background-color:#eff3f5; justify-content:flex-start;}
	.SectionProgram .SwiperProgram_Big .Slide02 .ImgBox{background-color:#f9f9f9;}
	.SectionProgram .SwiperProgram_Big .Slide03 .ImgBox{background-color:#dee8eb;}
	.SectionProgram .SwiperProgram_Big .Slide .ImgBox img{height:100%; width:100%; object-fit:cover; max-width:fit-content;}
	.SectionProgram .SwiperProgram_Big .Slide .ImgBox img[data-aos=zoom-out]{transform:scale(1.05); }
	.SectionProgram .SwiperProgram_Big .Slide .ImgBox img[data-aos=zoom-out].aos-animate{transform:scale(1);}

	/* 슬라이드_썸네일 */
	.SectionProgram .SwiperProgram_Small{position:absolute; bottom:clamp(0px, 15%, 7.5em); display:block; z-index:2; width:30%; max-width:600px; height:fit-content; left:56.4%;}
	.SectionProgram .SwiperProgram_Small .ImgBox{background-color:#000; border-radius:10px; overflow:hidden; cursor:pointer; transition:all 200ms;}
	.SectionProgram .SwiperProgram_Small .ImgBox img{opacity:.5; filter:blur(3px); scale:1.05; transition:all 200ms; width:100%; height:100%; object-fit:cover;}
	.SectionProgram .SwiperProgram_Small .swiper-slide-active .ImgBox{background-color:#fff;}
	.SectionProgram .SwiperProgram_Small .swiper-slide-active .ImgBox img{filter:none; scale:1; opacity:1;}


/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* [섹션] 스토리영역 */
section.SectionStory{line-height:1; padding:10em 0 7em 0; background-size:cover; background-repeat:no-repeat;}
.SectionStory > .Inner{width:100%; min-width:100%;}

	/* 기본세팅 --------------------------------------------------------- */
	/* 타이틀 */
	.SectionStory .MainTitle{position:relative; display:flex; flex-direction:column; color:#fff; gap:1em; align-items:center;}
	.SectionStory .MainTitle em{font-size:13pt; letter-spacing:1.5px; font-weight:400; display:block; color:#c6c6c6;}
	.SectionStory .MainTitle h2{line-height:1.1; margin-top:10px; display:block; font-size:29pt; font-weight:600; margin-top:0.5em; letter-spacing:-0.5px;}
	.SectionStory .MainTitle p{line-height:1.5; letter-spacing:-0.5px; font-size:18pt; font-weight:300; text-align:center;}
	.SectionStory .MainTitle .More{display:inline-block; position:relative; margin-top:2em;}
	.SectionStory .MainTitle .More a{display:block; font-size:11pt; letter-spacing:0; padding:1em 2.4em; border:1px solid #fff; border-radius:100px; position:relative; transition:all 300ms; letter-spacing:0.5px; font-weight:300;}
	.SectionStory .MainTitle .More a:hover{background-color:#ffffff41;}

	/* 내용 */
	.SectionStory .ContArea{position:relative; display:block; margin:2em auto 0 auto; display:flex; align-items:baseline; justify-content:center;}
	.SectionStory .ContArea .TextBox{position:relative; display:inline-flex; flex-direction:column; justify-content:center; align-items:center; gap:0.5em; width:calc(1400px / 3); padding:3em 0;}
	.SectionStory .ContArea .TextBox em{display:inline-block; width:8px; height:8px; transform:rotate(45deg); background-color:#0e84f9;}
	.SectionStory .ContArea .TextBox b{font-size:44pt; width:fit-content; background:linear-gradient(to bottom, #464646d5 0%, #46464600 85%); -webkit-background-clip:text;  -webkit-text-fill-color:transparent; background-clip:text; color:transparent; font-weight:600; letter-spacing:-1px; margin-top:0.1em;}
	.SectionStory .ContArea .TextBox span{color:#fff; line-height:1.5; letter-spacing:-0.5px; font-size:19pt; font-weight:400; text-align:center; margin-top:0.1em;}
	.SectionStory .ContArea .TextBox p{font-size:14pt; color:#c6c6c6; font-weight:300; letter-spacing:-0.3px; line-height:1.8; text-align:center; margin-top:0.8em;}
	.SectionStory .ContArea .TextBox:nth-child(2):before{content:''; position:absolute; top:0; left:0; z-index:2; height:100%; width:1px; background:linear-gradient(to bottom, transparent 0%  5%, #747474 35% 65%, transparent 95% 100%);}
	.SectionStory .ContArea .TextBox:nth-child(2):after{content:''; position:absolute; top:0; right:0; z-index:2; height:100%; width:1px; background:linear-gradient(to bottom, transparent 0%  5%, #747474 35% 65%, transparent 95% 100%);}
	
/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* [섹션] 이벤트영역 */
section.SectionEvent{line-height:1; padding:10em 0; background-size:cover; background-repeat:no-repeat;}
.SectionEvent .Inner{width:1400px; min-width:1400px;}

	/* 기본세팅 --------------------------------------------------------- */
	/* 타이틀 */
	.SectionEvent .MainTitle{position:relative; display:block; color:#222222; margin:0 auto; text-align:center;}
	.SectionEvent .MainTitle h2{line-height:1.2; display:block; font-size:37pt; font-weight:300; letter-spacing:-1px;}
	.SectionEvent .MainTitle h2 b{color:#0e84f9; font-weight:800; font-size:44pt;}

	/* 내용 */
	.SectionEvent .ContArea{position:relative; display:block; margin-top:5em;}
	.SectionEvent .ClinicCateList ul.List{width:1280px; margin:0 auto;}
	.SectionEvent .ClinicCateList ul li.TextBox{background-color:#fff; border:none !important;}
	.SectionEvent .ClinicCateList ul li a{color:#222; font-weight:400; padding:0.9em 0; font-size:15pt;}
	.SectionEvent .ClinicCateList ul li a.Active{background-color:#0e84f9;}
	.SectionEvent .ClinicCateList ul li a:not(.Active):hover{background-color:#f0f4f7; color:#222;}
	.SectionEvent .ClinicCateList ul li.TextBox + li{border-top:1px solid #d0d0d0 !important; margin:0;}
	.SectionEvent .ClinicCateList ul li.TextBox + li a span{border-left:1px solid #d0d0d0;}
	.SectionEvent .ClinicCateList ul li.TextBox:nth-child(-n+4){border-top:none !important;}
	.SectionEvent .ClinicCateList ul li.TextBox:nth-child(4n-3) a span{border-left:none !important;}
	.SectionEvent .ClinicCateList ul li.TextBox span{padding:0.3em 0}
	.SectionEvent .MultiSlider{width:1280px; margin:3em auto 0 auto;}
	.SectionEvent .MultiSlider dl{}
	.SectionEvent .MultiSlider dt{}
	.SectionEvent .MultiSlider dd{}
	.SectionEvent .Slide{}
	.SectionEvent .Slide a{}
	.SectionEvent .Slide .ThumbBox{position:relative; display:block; overflow:hidden;}
	.SectionEvent .Slide .ThumbBox img{position:relative; display:block; width:100%; transition:all 300ms;}
	.SectionEvent .Slide .ClinicInfo{}
	.SectionEvent .Slide .ClinicInfo .Name{position:relative; font-size:16pt; letter-spacing:-0.3px; font-weight:500; display:-webkit-box; width:100%; line-height:1.4; padding-top:0.8em; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; -webkit-line-clamp:1; -webkit-box-orient:vertical; color:#1f1f1f;}
	.SectionEvent .Slide .ClinicInfo .Info{position:relative; font-size:13pt; letter-spacing:-0.3px; font-weight:300; display:-webkit-box; width:100%; line-height:1.4; padding-top:0.3em; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; -webkit-line-clamp:1; -webkit-box-orient:vertical; color:#1f1f1f;}
	.SectionEvent .Slide .ClinicPrice{}
	.SectionEvent .Slide .ClinicPrice > div{position:relative; display:block; font-size:18pt; color:#202020; letter-spacing:-0.3px; margin-top:0.7em;}
	.SectionEvent .Slide .ClinicPrice > div *{font-weight:700;}
	.SectionEvent .Slide .ClinicPrice span{ font-size:16pt;}
	.SectionEvent .Slide .ClinicPrice em{display:none;}
	.SectionEvent .Slide .ClinicPrice big{font-weight:600; font-size:16pt;}
	.SectionEvent .SliderBtn{display:none;}
	.SectionEvent .SliderBtn .CommonEvent_Prev{position:absolute; top:62%; left:0px; font-size:35pt; font-weight:300; line-height: 1em;}
	.SectionEvent .SliderBtn .CommonEvent_Prev:hover{cursor:pointer;}
	.SectionEvent .SliderBtn .CommonEvent_Next{position:absolute; top:62%; right:0px; font-size:35pt; font-weight:300; line-height: 1em;}
	.SectionEvent .SliderBtn .CommonEvent_Next:hover{cursor:pointer;}
	.SectionEvent .Slide a:hover img{scale:1.05;}


/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* [섹션] 포인트영역 */
section.SectionPoint{line-height:1; letter-spacing:-1px; background-color:#fff;}
.SectionPoint > .Inner{width:100%; min-width:100%;}

	/* 기본세팅 --------------------------------------------------------- */	
	/* 내용 */
	.SectionPoint .StickyWrap{position:relative; display:flex; align-items:flex-start;}

	/* 좌측내용 */
	.SectionPoint .LeftArea{position:sticky; left:0; top:0; display:flex; align-self:flex-start; width:41%; height:670px; background-color:#1c2740; border-bottom-right-radius:180px; align-items:center; justify-content:center; background-size:cover; margin-bottom:13em;}
	.SectionPoint .LeftArea .MainTitle{position:relative; display:block; justify-content:center; text-align:left; align-items:center; color:#fff; margin-left:2em;}
	.SectionPoint .LeftArea .MainTitle em{font-size:13pt; letter-spacing:1.5px; font-weight:300; display:block;}
	.SectionPoint .LeftArea .MainTitle h2{color:#fff; line-height:1.1; margin-top:0.5em; display:block; font-size:44pt; font-weight:300;}
	.SectionPoint .LeftArea .MainTitle b{color:#fff; font-weight:700;}

	/* 우측내용 */
	.SectionPoint .RightArea{display:flex; width:calc(100% - 41%); margin:0 0 0 auto; padding:8em calc(calc(100% - 1400px) / 2) 9em 0; justify-content:end; align-items:center;}
	.SectionPoint .RightArea .ContArea *{text-align:left;}
	.SectionPoint .RightArea .ContArea{display:flex; text-align:center; align-items:center; flex-direction:column; gap:4em;}
	.SectionPoint .RightArea .ContArea > div:nth-child(2){margin-top:-5.2em;}
	.SectionPoint .RightArea .ContArea > div{z-index:2; position:relative;}
	.SectionPoint .RightArea .ContArea .ImgBox{position:relative;}
	.SectionPoint .RightArea .ContArea .TextBox{position:relative; display:flex; gap:1em; align-items:center; line-height:1; color:#222222; font-size:16pt; font-weight:600; letter-spacing:-0.5px; margin-top:0.8em;}
	.SectionPoint .RightArea .ContArea .TextBox span{letter-spacing:0;}
	.SectionPoint .RightArea .ContArea .TextBox p{font-weight:400; padding-left:1em; border-left:2px solid #cecece;}
	.SectionPoint .RightArea .ContArea .TextBox p b{font-weight:700;}

