@import url("common.css");

#visual {position:relative; width:100%; height:100%; width:100%;  overflow:hidden; z-index:1}

#visual .slick-slider {position: relative; display: block;}
#visual .slick-list {position: relative; display: block; overflow: hidden;}
#visual .slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
#visual .slick-initialized .slick-slide{display: block;}
#visual .slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;}
#visual .slick-prev, #visual .slick-next{ font-size: 0; line-height: 0; position: absolute; top: 53%; display: block; cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}

#visual .sub_imgbox {height:100%;}
#visual .section {position:relative; margin-bottom:2px;width:100%; height:100%; overflow:hidden;background-position:center;background-size:cover; border:0;}
#visual .sub_imgbox .slick-list, #visual .sub_imgbox .slick-track {height:100%;}

#visual  .slick-dots {position: absolute; text-align:center; bottom:97px; z-index:999; width:100%}
#visual  .slick-dots li {display: inline-block;  margin:0 2px; font-size: 0;}
#visual  .slick-dots li button {width:40px; height:4px; border:0; font-size:0; background:#fff; cursor:pointer}
#visual  .slick-dots li.slick-active button{background:#13b6c0;}
#visual .v_txt {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); text-align:center; z-index:1000;}
	.v_txt .txt_area {position:relative; width:1170px; margin:0 auto;}
	.v_txt .txt_area p {font-size:1.25rem; line-height:130%; font-weight:400; color:#fff; letter-spacing:0;}
	.v_txt .txt_area p br {display:none;}
	.v_txt .txt_area h3 {display:block; font-size:4rem; letter-spacing:0; margin:25px 0 50px 0; line-height:105%; font-family:"Heebo", Noto Sans, Arial, tahoma, verdana, sans-serif; color:#fff;}
	.v_txt .txt_area h3 br {display:none;}
	.v_txt .txt_area a.btn {display:inline-block; width:300px; padding:15px 20px; border-radius:100px; border:2px solid #fff; text-align:left; color:#fff; box-sizing:border-box; background:url('/img/main_btnArr.png') right 20px center no-repeat; font-size:0.9375rem; letter-spacing:0; transition:all 0.3s ease-out;}
	.v_txt .txt_area a.btn:hover {padding:15px 20px 15px 30px; color:#333; background:#fff url('/img/main_btnArr_b.png') right 30px center no-repeat; transition:all 0.3s ease-out;}

	.cover03 .v_txt .txt_area a.btn {width:370px}

	.visual_wrap {position:relative; overflow: hidden; height:100%; width:100%; margin:0 auto;}
	/*.visual_wrap .inner_video {position:absolute; top:0; left:0; bottom:0; right:0;}*/
	.visual_wrap .inner_video .bg_video {position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);}
	video[poster]{ /* 포스터 이미지의 크기를 비디오 영상에 꽉차도록 */ height:100%; width:100%;}
	.visual_wrap:after {content:''; width:100%; height:100%; background:rgba(0,0,0,0.2); position: absolute;}

/*#visual .section.cover01 .inner_video { background-position:top center; background-repeat:no-repeat; background-size:cover;}
#visual .section.cover02 .inner_video {background-position:top center; background-repeat:no-repeat; background-size:cover;}
#visual .section.cover03 .inner_video { background-position:top center; background-repeat:no-repeat; background-size:cover;}*/

#visual .scroll_down { width:16px; height:20px; z-index:99999; }
#visual .scroll_down a img{text-align:center;}


.scroll_down .actions{
    position: absolute;
    bottom: 20px;
	left:50%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    animation: scroll_ani 1.5s ease-in-out infinite;
 }
@keyframes scroll_ani {          
       0% {bottom: 20px;} 
	   50% {bottom: 30px;}  
       100% {bottom: 20px;} 
}

#main_container {position:relative; width:100%;}
#main_container h2 {font-family:"Heebo", sans-serif; font-size:70px; line-height:100%; }
#main_container h2.kor {font-size:60px; font-weight:700; letter-spacing:0; font-family:"Noto Sans KR", sans-serif; transition:all 0.3s ease-out;}
#main_container a.more {display:inline-block; font-size:20px; font-weight:400; letter-spacing:0; padding:20px 0; box-sizing:border-box; transition:all 0.3s ease-out;}

#business {position:relative; text-align:center; padding:150px 0 140px 0; overflow:hidden;}
#business h2 {background:url('/img/main_titBg.png') center top no-repeat; padding:30px 0 40px 0; color:#333; font-weight:700;}
#business h2 p.stit {font-size:20px; letter-spacing:0; color:#777; line-height:100%; font-weight:300; margin-top:15px;}
#business ul {width:100%; max-width:1480px; margin:0 auto; overflow:hidden;}
#business ul li {float:left; width:20%; text-align:center;}
/*#business ul li {float:left; margin-right:20px; text-align:center;}*/
#business ul li a:link, #business ul li a:visited {display:block;}
#business ul li a dl {position:relative; width:98%; max-width:280px; margin:0 auto;}
#business ul li a dt {position:relative; margin-bottom:20px;}
#business ul li a dt img {width:100%;}
#business ul li a dd {display:block; text-align:center;}
#business ul li a dd span.icon {width:100%; height:60px; padding:40px 0 15px 0; display:none;}
#business ul li a dd h3 {font-size:1.25rem; letter-spacing:0; font-weight:400; color:#333; text-align:center;}
#business ul li a dd h3 br {display:none;}
#business ul li a dd p {font-size:16px; color:rgba(255,255,255,0.4); letter-spacing:0; line-height:140%; padding-bottom:20px; display:none;}
#business ul li a dd span.more {display:inline-block; padding-right:40px; background:url('/img/icon_arr_w.png') right center no-repeat; color:#fff; display:none;}

#business ul li a:hover {}
#business ul li a:hover dt {margin-bottom:0px; }
#business ul li a:hover dt img {background:url('/img/busi_hover.png') left top no-repeat;}
#business ul li a:hover dd {position:absolute; left:0; top:0; width:100%; height:100%; z-index:3; background:url('/img/busi_hover.png') left top no-repeat; padding:0 3%; box-sizing:border-box}
#business ul li a:hover dd span.icon {display:block;} /* background-position:center 55%; background-repeat:no-repeat; */
#business ul li a:hover dd {display:block; text-align:center;}
#business ul li a:hover dd h3 {font-size:1.25rem; color:#fff; text-align:center; margin-bottom:10px; line-height:130%}
#business ul li a:hover dd h3 br {display:none;}
#business ul li a:hover dd p {font-size:0.95rem; color:rgba(255,255,255,0.4); letter-spacing:0; line-height:140%; padding-bottom:20px; display:block;}
#business ul li a:hover dd span.more {display:inline-block; padding-right:40px; background:url('/img/icon_arr_w.png') right center no-repeat; color:#fff;}

#business .slick-slider {position: relative; display: block;}
#business .slick-list {position: relative; display: block; overflow: hidden;}
#business .slick-slide {display: none; float: left; height: 100%; min-height: 1px;}
#business .slick-initialized .slick-slide{display: block;}
#business .slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent;}

#business .slick-dots {display:none;}


/*#business ul li:first-child a:hover dd span.icon {background-image:url('/img/busi_img1_up.png');}
#business ul li:nth-child(2) a:hover dd span.icon {background-image:url('/img/busi_img2_up.png');}
#business ul li:nth-child(3) a:hover dd span.icon {background-image:url('/img/busi_img3_up.png');}
#business ul li:nth-child(4) a:hover dd span.icon {background-image:url('/img/busi_img4_up.png');}
#business ul li:last-child a:hover dd span.icon {background-image:url('/img/busi_img5_up.png');}*/
#business span.icon_sw {display:none; text-align:center; min-height:60px; background:url('/img/ico.swipe.png') top center no-repeat; text-indent:-2222222222px; margin-top:20px;} /* min-height:30px; background-size:auto 30px;  */

#about {position:relative;}
#about .banner {background:url('/img/about_bg.jpg') top center no-repeat; padding:130px 0 210px 0; text-align:center;}
#about .banner h2 {background:url('/img/about_titBg.png') top center no-repeat; padding:30px 0; color:#fff; text-transform:uppercase;}
#about .banner p {font-size:20px; color:rgba(255,255,255,0.7); letter-spacing:0; font-weight:300; margin-bottom:20px; line-height:140%;}
#about .banner a.more:link, #about a.more:visited {color:#fff; padding:20px 45px 20px 0; background:url('/img/icon_arr_w.png') right center no-repeat; border-bottom:1px solid #868d9b;}
#about .banner a.more:hover {background:url('/img/icon_arr_w.png') right 8% center no-repeat;}
#about .quick_bn {position:relative; width:100%; max-width:1480px; margin:-100px auto 0 auto; background:#fff; overflow:hidden;}
#about .quick_bn dl {width:100%; display:table;}
#about .quick_bn dd {display:table-cell; width:50%; box-sizing:border-box; padding:60px 0px 60px 70px; font-size:28px; letter-spacing:0; color:#666; font-weight:300; line-height:140%; vertical-align:middle; box-sizing:border-box;}
#about .quick_bn dt {display:table-cell; width:50%; box-sizing:border-box; padding:60px 10px 60px 0px; text-align:right; vertical-align:middle; box-sizing:border-box;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {text-align:center; display:inline-block; position:relative; padding:90px 60px 5px 60px; border-right:1px solid #ddd; color:#333; font-size:25px; letter-spacing:0;  background-position:center top; background-repeat:no-repeat; transition:all 0.2s ease-out;}
#about .quick_bn dt a:hover {background-position:center 10px; transition:all 0.2s ease-out;}
#about .quick_bn dt a:first-child {background-image:url('/img/welliv_moral.png');}
#about .quick_bn dt a:nth-child(2) {background-image:url('/img/welliv_movie.png');}
#about .quick_bn dt a:last-child {border-right:none; background-image:url('/img/welliv_community.png');}

#notice {position:relative; width:100%; padding:150px 0; background:#f9f9f9}
#notice .notice_con {position:relative; width:100%; max-width:1480px; margin:0 auto; overflow:hidden;}
#notice h2 {float:left; display:block; width:300px; background:url('/img/main_titBg.png') top left no-repeat; padding:30px 0 25px 0; color:#333; font-weight:700;}
#notice h2 p {margin-top:25px; font-size:20px; letter-spacing:0; color:#777; line-height:150%; font-weight:300;}
#notice h2 a:link, #notice h2 a:visited {width:147px; color:#333; background:url('/img/icon_arr_b.png') right center no-repeat; border-bottom:1px solid #ddd;}
#notice a.more:hover {background:url('/img/icon_arr_b.png') right 12% center no-repeat;}
#notice .list {float:left; width:calc(100% - 300px);}
#notice .list ul {width:100%; overflow:hidden;}
#notice .list ul li {float:left; width:33.3%;}
#notice .list ul li dl {width:100%; max-width:380px; margin:0 auto;}
#notice .list ul li dt {margin-bottom:20px;}
#notice .list ul li dt img {background-size:cover; background-position:50% 50%; background-repeat:no-repeat; border:1px solid #ddd; box-sizing:border-box;}
#notice .list ul li dd p {font-size:20px; color:#333; letter-spacing:0; font-weight:400; margin-bottom:10px;}
#notice .list ul li dd span {background:url('/img/thum_date.png') left center no-repeat; padding-left:25px; font-size:16px; color:#777; font-family:"Heebo", sans-serif; min-height:15px;}
#notice a.main_mobile:link, #notice a.main_mobile:visited {display:none;}

#recruit {background:url('/img/recruit_bg.jpg') top center no-repeat; padding:80px 0; text-align:center;}
#recruit h2 {background:url('/img/about_titBg.png') top center no-repeat; padding:30px 0; color:#fff;}
#recruit p {font-size:20px; color:rgba(255,255,255,0.7); letter-spacing:0; font-weight:300; margin-bottom:12px; line-height:140%;}
#recruit a.more:link, #recruit a.more:visited {width:250px; color:#fff; padding:20px 50px 20px 0; background:url('/img/icon_arr_w.png') right center no-repeat; border-bottom:1px solid #78b4ca;}
#recruit a.more:hover {background:url('/img/icon_arr_w.png') right 8% center no-repeat;}


/*******************************************************************************
	@media 1241px~1480px
*******************************************************************************/
@media all and (max-width:1480px){


#business ul {width:98%; max-width:100%;}
#business ul li a:hover dt { height:100%;}
/*#business ul li a dd span.icon {padding:20% 0 10% 0;}
#business ul li a:hover dd span.icon {background-position:center 65%;  padding:20% 0 10% 0;}*/
#business span.icon_sw {display:block;} /* min-height:30px; background-size:auto 30px;  */

#about .banner h2 {padding:30px 0;}
#about .quick_bn {width:98%; max-width:100%; }
#about .quick_bn dd {padding:45px 0px 45px 50px; font-size:25px;}
#about .quick_bn dt {padding:45px 10px 45px 0px;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:90px 40px 5px 40px; font-size:22px;}

#notice .notice_con {width:98%; max-width:100%; }
#notice .list {float:left; width:calc(100% - 300px);}
#notice .list ul li dl {width:98%; max-width:100%;}

}


/*******************************************************************************
	@media 1024px~1240px
*******************************************************************************/
@media all and (max-width:1240px){

#business {padding:120px 0 100px 0;}
#business ul li a:hover dd span.icon {padding:20% 0 10% 0;}
#business ul li a:hover dd h3 {font-size:1.15rem; margin-bottom:8px;}
#business ul li a:hover dd p {font-size:0.9rem; padding-bottom:15px;}

#about .banner {padding:110px 0 180px 0;}

#notice {padding:120px 0;}
#notice h2 {float:none; width:100%; background:url('/img/main_titBg.png') top center no-repeat; text-align:center; padding:30px 0 40px 0;}
#notice h2 p {text-align:center;}
#notice h2 p br {display:none;}
#notice h2 a:link, #notice h2 a:visited {display:none;}
#notice .list {float:none; width:100%;}
#notice .list ul li dd p {line-height:130%;}
#notice a.main_mobile:link, #notice a.main_mobile:visited {display:block; margin:20px auto 0 auto; width:147px; color:#333; background:url('/img/icon_arr_b.png') right center no-repeat; border-bottom:1px solid #ddd; transition:all 0.2s ease-out;}
#notice a.main_mobile:hover {background:url('/img/icon_arr_b.png') right 8% center no-repeat; transition:all 0.2s ease-out;}

#recruit {padding:70px 0;}

}

/*******************************************************************************
	@media 1024px~1240px
*******************************************************************************/
@media all and (max-width:1100px){

#visual .v_txt {width:100%; padding:0 2%;}
	.v_txt .txt_area {width:100%;}

#about .quick_bn dd br {display:none;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:90px 30px 5px 30px; font-size:20px;}
}

/*******************************************************************************
	@media 769~980px
*******************************************************************************/
@media all and (max-width:980px){

#visual {min-height:auto;}
#visual .section {min-height:auto;}

#main_container h2 {font-size:55px;}
#main_container h2.kor {font-size:45px; letter-spacing:-1pt;}
#main_container a.more {font-size:18px; padding:18px 0;}

#business {padding:90px 0 80px 0;}
#business h2 p.stit {font-size:18px;}
/*#business ul li {width:33.3%;}*/
#business ul li a dl dt {margin-bottom:15px;}
#business ul li a dl dt img {width:100%;}
#business ul li a dd span.icon { padding:50px 0 20px 0; display:none;}
#business ul li a dd h3 {line-height:130%;}
#business ul li a:hover dd p {display:none}


#about .banner h2 {padding:30px 0 25px 0;}
#about .banner {padding:80px 0 150px 0;}
#about .banner p {font-size:18px; margin-bottom:10px;}
#about .banner a.more:link, #about a.more:visited {padding:18px 40px 18px 0;}

#about .quick_bn dd {display:block; width:100%; padding:40px 0px 20px 0px; font-size:22px; text-align:center;}
#about .quick_bn dd br {display:block;}
#about .quick_bn dt {display:block; width:100%; padding:20px 0px 40px 0px; text-align:center;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:85px 40px 5px 40px; font-size:18px;}

#notice {padding:90px 0;}
#notice h2 p {font-size:18px; margin-top:15px;}
#notice .list ul li dd p {font-size:18px;}
#notice .list ul li dd span {font-size:15px; padding-left:22px;}

#notice a.main_mobile:link, #notice a.main_mobile:visited {margin:18px auto 0 auto; }

#recruit {padding:60px 0;}
#recruit h2 {padding:25px 0 20px 0;}
#recruit p {font-size:18px;}
#recruit a.more:link, #recruit a.more:visited {width:220px; padding:18px 50px 18px 0;}

}


/*******************************************************************************
	@media 671~768px
*******************************************************************************/
@media all and (max-width:768px){


#main_container h2 {font-size:50px;}
#main_container h2.kor {font-size:40px;}
#main_container a.more {font-size:16px; padding:16px 0;}

#visual .slick-dots{bottom:70px}



#business {padding:70px 0 60px 0;}
#business h2 {padding:25px 0 35px 0;}

#about .banner {padding:50px 0 135px 0;}
#about .banner h2 {padding:25px 0 20px 0;}
#about .banner a.more:link, #about a.more:visited {padding:16px 40px 16px 0;}

#notice {padding:60px 0;}
#notice h2 {padding:25px 0 35px 0;}
#notice .list ul li {width:50%;}
#notice .list ul li:nth-child(3) {display:none;}
#notice .list ul li dt {margin-bottom:15px;}
#notice .list ul li dt img {width:100%;}
#notice a.main_mobile:link, #notice a.main_mobile:visited {margin:16px auto 0 auto; }

#recruit {padding:50px 0;}
#recruit a.more:link, #recruit a.more:visited {width:190px; padding:16px 50px 16px 0;}


}


/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

.visual_wrap .inner_video {background-size:cover;}

.v_txt .txt_area p {font-size:1.1rem;}
.v_txt .txt_area p {line-height:140%;}
.v_txt .txt_area p br {display:block;}
.v_txt .txt_area h3 {font-size:3.5rem; margin:25px 3% 50px 0}
.v_txt .txt_area h3 br {display:block;}
#business ul li a dd span.icon {height:40px}
#business ul li a dd span.icon img {height:100%}
#business ul li a dd span.more {font-size:12px; background-size:15px auto}

#main_container h2 {font-size:40px;}
#main_container h2.kor {font-size:30px;}
#main_container a.more {font-size:15px; padding:15px 0;}

#business {padding:60px 0 50px 0;}
#business h2 p.stit {font-size:16px;}
#business span.icon_sw {min-height:40px; background-size:auto 40px;}

#about .banner h2 {padding:25px 0 15px 0;}
#about .banner {padding:60px 0 120px 0;}
#about .banner a.more:link, #about a.more:visited {padding:15px 40px 15px 0;}
#about .quick_bn {margin:-80px auto 0 auto;}

#about .banner p {font-size:16px;}
#about .quick_bn dd {padding:30px 0px 10px 0px; font-size:18px;}
#about .quick_bn dt {padding:20px 0px 30px 0px;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:80px 40px 5px 40px; font-size:16px;}

#notice {padding:45px 0;}
#notice h2 p {font-size:16px; margin-top:12px;}
#notice .list ul li dd p {font-size:16px;}
#notice .list ul li dd span {font-size:14px;}
#notice a.main_mobile:link, #notice a.main_mobile:visited {margin:15px auto 0 auto; }

#recruit {padding:50px 0;}
#recruit h2 {padding:25px 0 20px 0;}
#recruit p {font-size:16px;}
#recruit a.more:link, #recruit a.more:visited {padding:15px 45px 15px 0;}


}

/*******************************************************************************
	@media ~480px
*******************************************************************************/
@media all and (max-width:480px){

#main_container h2 {font-size:30px;}
#main_container h2.kor {font-size:25px;}
#main_container a.more {font-size:14px; padding:12px 0;}
.v_txt .txt_area h3 {font-size:2.5rem;}
.v_txt .txt_area a.btn{width:220px}

.cover03 .v_txt .txt_area a.btn {width:300px}


#business {padding:50px 0 40px 0;}
#business h2 p.stit {font-size:14px;}
#business ul li a dd h3 br {display:block;}
#business span.icon_sw {margin-top:10px; min-height:30px; background-size:auto 30px;}

#about .banner {padding:40px 0 100px 0;}
#about .banner p {font-size:14px; padding:0 5%; box-sizing:border-box;}
#about .banner p br {display:none;}
#about .banner a.more:link, #about a.more:visited {padding:12px 40px 12px 0;}
#about .quick_bn {margin:-60px auto 0 auto;}
#about .quick_bn dd {padding:25px 5% 10px 5%; font-size:16px; box-sizing:border-box;}
#about .quick_bn dd br {display:none;}
#about .quick_bn dt a:link, #about .quick_bn dt a:visited {padding:56px 6% 0px 6%; font-size:15px; background-size:45px;}

#notice h2 {padding:20px 0 25px 0}
#notice h2 p {font-size:14px;}
#notice .list ul li dt {margin-bottom:10px;}
#notice .list ul li dd p {font-size:14px; margin-bottom:6px;}

#recruit p {font-size:14px; padding:0 2%; box-sizing:border-box;}
#recruit p br {display:none;}
#recruit a.more:link, #recruit a.more:visited {width:175px; padding:12px 40px 12px 0;}

}


/*******************************************************************************
	@media ~480px
*******************************************************************************/
@media all and (max-width:380px){

.v_txt .txt_area h3 {font-size:2.1rem;}

.cover03 .v_txt .txt_area a.btn {width:100%}

#business ul li a dd span.icon {height:30px}

#about .quick_bn dd {font-size:15px;}

}