@charset "utf-8";

/*
서울눈에빛안과
C00361
*/

@keyframes RoundOpen{ 
	0%{border-radius:0;}
	100%{border-radius:50px;}
}

@keyframes shakeMotion {
	0% {transform: translateX(0);}
	50% {transform: translateX(3px);} 
	100% {transform: translateX(0);}
}

/* 메인전용컨텐츠 */
.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;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 공통 */
.MainSection .TitleBox p{font-size:22pt; color:#999; font-weight:500; text-align:left;}
.MainSection .TitleBox h2{font-size:37pt; color:#111; font-weight:700; text-align:left; padding-top:10px;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 1번배너 */
.MainSection01{width:100%; position:relative; height:730px; overflow:hidden; margin:150px auto 0; padding:0 60px;}
.MainSection01 .Inner{width:100%; min-width:100%;}
.MainSection01 .swiper-container{position:relative; height:730px;}
.MainSection01 .swiper-wrapper{text-align:center;}
.MainSection01 .swiper-slide{animation:RoundOpen 1s ease-out forwards; border-radius:50px; overflow:hidden; height:700px;}
.MainSection01 .swiper-slide .BgBox{height:700px;}
.MainSection01 .swiper-slide .BgBox img{width:100%; height:100%; object-fit:cover;}

.MainSection01 .Banner01 .TextBox{position:absolute; top:50%; left:17%; right:auto; transform:translate(0,-60%);}
.MainSection01 .Banner01 .Text01{font-size:11pt; color:#999; font-family:'SUIT'; letter-spacing:2pt; text-align:left; font-weight:500;}
.MainSection01 .Banner01 .Text02{font-size:45pt; color:#111; font-family:'Pretendard', sans-serif; font-weight:500; text-align:left; line-height:1.4; margin:20px 0 40px;}
.MainSection01 .Banner01 .Text02 b{font-weight:700;}
.MainSection01 .Banner01 .Text02 span{display:inline-block; margin:15px 5px; color:#86FFFF;}
.MainSection01 .Banner01 .Text03{font-size:18pt; color:#111; font-family:'Pretendard', sans-serif; text-align:left; line-height:1.4;}

.MainSection01 .Banner01 .Slide01 .Text01{color:#fff; opacity:0.7;}
.MainSection01 .Banner01 .Slide01 .Text02{color:#fff;}
.MainSection01 .Banner01 .Slide01 .Text02 b{line-height:1;}
.MainSection01 .Banner01 .Slide01 .Text03{color:#fff;}

.MainSection01 .SliderBtn{position:absolute; left:0; bottom:0 !important; z-index:2; transform:translate(0, -50%); text-align:center;}
.MainSection01 .swiper-pagination-bullet-active{background:#1272B9 !important; width:30px !important; border-radius:50px;}
.MainSection01 .swiper-pagination-bullet{width:10px; height:10px; background:#CECECE; opacity:1;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 2번배너 */
.MainSection02{}
.MainSection02 .Inner{padding:170px 0 150px; margin:0 auto;}

.MainSection02 .ContArea{}
.MainSection02 ul{display:flex; justify-content:space-between; align-items:center;}
.MainSection02 ul li{width:calc(100% / 3);}
.MainSection02 ul li p{display:flex; flex-direction:column; align-items:center;}
.MainSection02 ul li strong{display:inline-block; font-family:'GmarketSans'; font-size:60pt; background:linear-gradient(to bottom, #42C6FF, #0A6CC8); background-clip:text; color:transparent;}
.MainSection02 ul li #counter1{width:245px;}
.MainSection02 ul li #counter2{width:300px;}
.MainSection02 ul li #counter3{width:285px;}
.MainSection02 ul li small{font-size:16.5pt; color:#484848; font-weight:600;}
.MainSection02 ul li p span{display:block; margin-top:25px;}
.MainSection02 ul li p span b{font-size:19pt; color:#111;}
.MainSection02 .AddClass{text-align:center; color:#999; font-size:15pt; margin-top:80px; font-weight:500;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 3번배너 */
.MainSection03{}
.MainSection03 .Inner{padding:30px 0 120px; width:1400px; margin:0 auto;}

.MainSection03 .ContBox{margin-top:20px;}
.MainSection03 ul{display:flex; flex-wrap:wrap; justify-content:space-between;}
.MainSection03 ul li{background-size:cover; background-repeat:no-repeat; background-position:center; overflow:hidden; width:calc(100% / 2 - 20px); margin:20px 0; border-radius:30px; height:350px;}
.MainSection03 ul li a{display:block; width:100%; height:100%; position:relative;}
.MainSection03 ul li .TextBox{width:100%; position:absolute; padding:60px 70px; bottom:0; font-size:12pt;}
.MainSection03 ul li .TextBox span{display:block; color:#003F79; font-weight:600; position:absolute; z-index:2; top:150px;}
.MainSection03 ul li .Text01{font-size:15pt; color:#111; text-align:left; line-height:1.4; font-weight:300; position:relative; z-index:3;}
.MainSection03 ul li .Text02{font-size:27pt; color:#111; text-align:left; font-weight:700; padding-top:15px; position:relative; z-index:3;}

.MainSection03 ul li .TextBox::before{content:''; display:block; background:url('/img/C00361/MainSection03_logo.png')no-repeat center/cover; width:120px; height:70px; margin-bottom:50px; position:relative; z-index:3;}
.MainSection03 ul li a::after{content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:linear-gradient(31deg, #0059AC 3.27%, rgba(9, 108, 200, 0.5) 59%), linear-gradient(90deg, #2B8CE6 20.23%, rgba(27, 126, 218, 0.5) 39%); opacity:0;}
.MainSection03 ul li:hover a::after{opacity:1; transition:0.5s all ease;}
.MainSection03 ul li:hover span{color:#fff;}
.MainSection03 ul li:hover .Text01{color:#fff;}
.MainSection03 ul li:hover .Text02{color:#fff;}

/*27년에 신설예정이라서 버튼클릭 막아둠*/
.MainSection03 ul li:last-child:hover a{cursor:default;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 4번배너 */
.MainSection04{background-color:#EBF5FF;}
.MainSection04 .Inner{padding:120px 0; width:1400px; margin:0 auto;}

.MainSection04 .ContBox{margin-top:50px;}
.MainSection04 .LeftBox{display:flex; flex-direction:column; align-items:flex-start; width:450px;}
.MainSection04 .LeftBox span{display:block; width:100%; height:80px; background-color:#fff; border-radius:20px; border:1px solid #999; opacity:1; margin:10px 0; color:#999; font-weight:500; font-size:16pt; text-align:left; padding:0 50px; line-height:80px;}
.MainSection04 .LeftBox span:nth-child(1){margin-top:0;}

.MainSection04 .LeftBox .swiper-pagination-bullet-active{background-color:#003F79; color:#fff; border:none; font-weight:700; filter:drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.30));}
.MainSection04 .LeftBox .swiper-pagination-bullet-active::before{content:''; display:block; width:0; height:0; border-left:50px solid #003F79; border-right:50px solid transparent; border-top:50px solid transparent; position:absolute; right:-70px; bottom:0;}

.MainSection04 .RightBox{width:870px; margin-left:530px; position:relative;}
.MainSection04 .RightBox .ImgBox{width:100%; border-radius:20px; overflow:hidden;}
.MainSection04 .ImgBox img{width:100%; object-fit:cover;}
.MainSection04 .TextBox{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; padding:80px 65px;}
.MainSection04 .TextBox .Text01{text-align:left; color:#fff; font-size:16pt;}
.MainSection04 .TextBox .Text01 b{color:#fff; font-size:24pt; font-weight:600; margin-top:10px; display:block;}
.MainSection04 .TextBox .Text02{margin-top:30px; color:#D0D0D0; font-size:15pt; line-height:1.6;}

.MainSection04 .List05 a{display:inline-block; background-color:#A8FFF5; border:1px solid #111; padding:15px 30px; border-radius:50px; font-size:12pt; color:#111; font-weight:500; margin-top:50px;}
.MainSection04 a span{width:19px; display:inline-block; margin-left:10px; animation:shakeMotion 1s ease-in-out infinite;}
.MainSection04 a span img{width:100%; object-fit:cover;}

.MainSection04 .Video{width:100%; border-radius:20px; overflow:hidden;}
.MainSection04 .Video .Movie_Iframe{position:relative; width:100%;  padding-bottom:56.25%;}
.MainSection04 .Video .Movie_Iframe iframe{position:absolute; top:0; left:0; width:100%;height:100%;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 5번배너 */
.MainSection05{background-color:#fff; padding:120px 0;}
.MainSection05 .Inner{background-color:#F2F4F8; border-radius:30px; width:1700px; min-width:1700px; padding:100px 150px;}
.MainSection05 .TitleBox p{text-align:center;}
.MainSection05 .TitleBox h2{text-align:center;}

.MainSection05 ul{display:flex; justify-content:space-between; margin-top:60px;}
.MainSection05 ul li{width:calc(100% / 7 - 10px); background-color:#fff; border-radius:15px; height:220px; transition:0.5s all ease-in-out;}
.MainSection05 ul li a{display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; height:100%;}
.MainSection05 ul li p{font-size:15pt; color:#111; text-align:center; margin-top:25px; font-weight:500;}
.MainSection05 ul li.LastBox{width:330px; background-color:#003F79;}
.MainSection05 ul li.LastBox a{display:flex; justify-content:center; align-items:center; width:100%; height:100%;}
.MainSection05 ul li.LastBox .ThumbBox{display:flex; align-items:center;}
.MainSection05 ul li.LastBox .ThumbBox ImgBox{width:45px; height:45px;}
.MainSection05 ul li.LastBox .ThumbBox img{width:100%; object-fit:cover;}
.MainSection05 ul li.LastBox .ThumbBox p{color:#A8FFF5; font-size:13.5pt; font-weight:500; text-align:left; margin-top:0; padding-left:20px; line-height:1.4;}
.MainSection05 ul li.LastBox .TelNum{color:#fff; font-size:22.5pt; font-weight:700; text-align:center; font-family:'GmarketSans'; letter-spacing:-0.2pt;}

.MainSection05 ul li:hover{transform:translateY(-30px) !important;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 6번배너 */
.MainSection06{}
.MainSection06 .Inner{padding:30px 0 0; width:1400px; min-width:1400px;}
.MainSection06 .TitleBox p{text-align:center; color:#3CA1FF;}
.MainSection06 .TitleBox h2{text-align:center;}

	/* 롤링배너일때 */
	.MainSection06 .MultiSliderWrap{overflow:hidden; padding-bottom:120px;}
	.MainSection06 .MultiSlider{clear:none;}
	.MainSection06 .MultiSlider.slider-for{width:775px; height:430px; float:left; position:relative; margin-top:60px;}
	.MainSection06 .MultiSlider.slider-for .TextBox{display:none;}
	.MainSection06 .MultiSlider.slider-nav .ThumBox{float:none; display:block; width:140px; height:80px; position:relative; overflow:hidden; margin-left:0;}
	.MainSection06 .MultiSlider.slider-nav li{height: 100%; text-align:left; padding:10px 0; overflow:hidden; position:relative; display:table; table-layout:fixed; width:100%; cursor:pointer; margin-bottom:0;}
	.MainSection06 .MultiSlider.slider-nav .slick-slide li{background-color:#fdf9f9; padding:0.5em; margin-bottom:0.4em; background-color:rgb(235 235 235 / 50%); border:2px solid rgb(235 235 235 / 0%);}
	.MainSection06 .MultiSlider.slider-nav .slick-slide.slick-current li{background-color:rgb(255 255 255 / 50%); border:2px solid #003F79;}
	.MainSection06 .MultiSlider.slider-nav .TextBox{position:absolute; top:0.48em; left:165px; color:#333333; font-size:16px; line-height:100%; overflow:visible; vertical-align:middle; margin:0; width:auto; float:none; width:calc(100% - 165px); white-space:normal; margin-left:0; height:80px; display:inline-flex; align-items:center;}
	
	.MainSection06 .MultiSlider.slider-nav{position:relative!important; width:600px!important; float:left; margin-left:24px!important;}
	
	.MainSection06 .MultiSlider.slider-nav .slick-list{margin-top:60px; height:426px !important;}
	.MainSection06 .MultiSlider.slider-nav .slick-slide{width:100% !important; height:auto; overflow:hidden;}
	.MainSection06 .MultiSlider.slider-nav .slick-slide li{width:100%; cursor:pointer;}

	.MainSection06 .MultiSlider .slick-slide li .ThumBox{background-color:#000;}
	.MainSection06 .slider-nav .slick-slide.slick-current li .ThumBox:after{content:''; position: absolute; top:0; left:0; width:100%; height:100%; box-sizing:border-box; opacity:1; transition:opacity 0.5s;}
	.MainSection06 .slider-nav .slick-slide.slick-current li .TextBox p strong{color:#ac97c2;}
	.MainSection06 .slider-nav .slick-active + .slick-active + .slick-active + .slick-active + .slick-active + .slick-active + .slick-active li{padding-right:0 !important;}

	.MainSection06 li{display:table-cell; position:relative; vertical-align:top; cursor:pointer;}
	.MainSection06 li .ThumBox{display:block; position:relative; margin:auto; overflow:hidden;} 
	.MainSection06 li .ThumBox img{width:100%;}
	.MainSection06 li .TextBox *{font-size:12pt !important; font-weight:normal !important;}
	.MainSection06 li .TextBox{padding-left:12px; color:#a0a0a0 !important; padding-top:5px; height:25px; display:block; line-height:120%; letter-spacing:-1px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
	.MainSection06 li .TextBox .Text01{width:95%; font-size:16pt !important; font-weight:500 !important; line-height:1.2; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; margin-bottom:5px !important; color:#121212 !important;}
	.MainSection06 li .TextBox .Text02{width:95%; line-height:1.3; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; margin-bottom:5px !important; color:#a0a0a0 !important; height:1.4em !important; display:none;}
	.MainSection06 li .TextBox .Text02 *{line-height:normal !important; color:#a0a0a0 !important; font-family:"Noto Sans KR" !important;}

	/*more버튼*/
	.MainSection06 .MoreBtn{width:100%; display:flex; justify-content:center;}
	.MainSection06 .MoreBtn a{display:inline-block; background-color:#fff; border:1px solid #111; padding:15px 30px; border-radius:50px; font-size:12pt; color:#111; font-weight:500; transition:0.5s all ease; margin-top:30px;}
	.MainSection06 .MoreBtn span{width:19px; display:inline-block; margin-left:10px; animation:shakeMotion 1s ease-in-out infinite;}
	.MainSection06 .MoreBtn span img{width:100%; object-fit:cover;}

	.MainSection06 .MoreBtn:hover a{background-color:#003F79; color:#fff; border:1px solid transparent;}
	.MainSection06 .MoreBtn:hover span img{filter:brightness(0) invert(1);}

	/*스크롤바*/
	.MainSection06 .MultiSlider.Right .slick-list{overflow-y:scroll; padding-right:10px;}
	.MainSection06 .MultiSlider.Right .slick-list::-webkit-scrollbar{background-color:#f4f4f4; border-radius:30px; width:6px;}
	.MainSection06 .MultiSlider.Right .slick-list::-webkit-scrollbar-thumb{background-color:#003F79;}

/* ----------------------------------------------------------------------------------------------------------------------------------------- */
/* 7번배너 */
.MainSection07{}
.MainSection07 .Inner{padding:30px 0 120px; width:1400px; min-width:1400px;}
.MainSection07 .ContBox{display:flex; justify-content:space-between;}

/* 왼쪽 */
.MainSection07 .LeftBox{width:610px;}
.MainSection07 .LeftBox .ListBox{width:100%; height:325px; border-radius:20px; background-color:#F6F6F6; padding:50px 80px;}
.MainSection07 .LeftBox .ListBox.LeftBottom{margin-top:20px;}
.MainSection07 .LeftBox h2{text-align:left; font-size:21pt; color:#222; font-weight:600; padding-bottom:20px; border-bottom:1px solid rgba(34,34,34,0.3);}
.MainSection07 .LeftBox .ContBox{margin-top:5px;}

.MainSection07 .LeftBox .TxtList{width:100%; overflow:hidden;}
.MainSection07 .LeftBox .BnfText a{display:block; margin:18px 0;}
.MainSection07 .LeftBox .TextBox p{display:flex; justify-content:space-between; align-items:center;}
.MainSection07 .LeftBox .TextBox .LeftText{color:#484848; text-align:left; font-size:12pt; font-weight:400;}
.MainSection07 .LeftBox .TextBox .RightText{color:#999999; text-align:right; font-size:9pt; font-weight:400;}

.MainSection07 .LeftBox .TextBox p:hover .LeftText{font-weight:500;}

/* 오른쪽 */
.MainSection07 .RightBox{width:750px; display:flex; flex-direction:column; align-items:center;}
.MainSection07 .RightBox .RightTop{width:100%; display:flex; justify-content:space-between;}

.MainSection07 .RightTop .InfoBox{/*width:calc(100% / 2 - 10px);*/ width:100%; height:325px; background-size:cover; background-repeat:no-repeat; background-position:center; overflow:hidden; border-radius:30px;}
.MainSection07 .RightTop .InfoBox a{display:flex; flex-direction:column; justify-content:center; align-items:center; width:100%; height:100%;}
.MainSection07 .RightTop .InfoBox .ImgBox{width:100px; height:100px; border-radius:50%; display:flex; justify-content:center; align-items:center;}
.MainSection07 .RightTop .InfoBox.Info01 .ImgBox{background-color:rgba(91, 179, 211, 0.5); transition:0.3s all ease-in-out;}
.MainSection07 .RightTop .InfoBox.Info02 .ImgBox{background-color:rgba(228, 170, 109, 0.5); transition:0.3s all ease-in-out;}
.MainSection07 .RightTop .InfoBox .TextBox{margin-top:25px;}
.MainSection07 .RightTop .InfoBox .Text01{text-align:center; color:#111; font-size:13.5pt;}
.MainSection07 .RightTop .InfoBox .Text02{text-align:center; color:#111; font-size:21pt; font-weight:600; padding-top:10px;}

.MainSection07 .RightTop .InfoBox.Info01:hover .ImgBox{background-color:rgba(91, 179, 211, 1);}
.MainSection07 .RightTop .InfoBox.Info02:hover .ImgBox{background-color:rgba(228, 170, 109, 1);}

.MainSection07 .RightBottom{width:100%; background-color:#1B7EDA; border-radius:20px; overflow:hidden; padding:40px 80px; margin-top:20px;}
.MainSection07 .RightBottom .BoxTitle p{color:#fff; font-size:26pt; font-weight:600; display:flex; align-items:center;}
.MainSection07 .RightBottom .BoxTitle p span{color:#A8FFF5; font-size:30pt; font-weight:600; padding-left:20px;}
.MainSection07 .RightBottom ul{display:flex; justify-content:space-between; margin-top:35px;}
.MainSection07 .RightBottom ul li{width:calc(100% / 3 - 30px); background-color:#fff; border-radius:15px; transition:0.5s all ease-in-out;}
.MainSection07 .RightBottom ul li a{display:flex; flex-direction:column; justify-content:center; align-items:center; padding:40px 25px;}
.MainSection07 .RightBottom ul li p{padding-top:20px; font-size:14pt; font-weight:600; color:#1B7EDA;}

.MainSection07 .RightBottom ul li:hover{transform:translateY(-10px) !important;}