
.visual-main {position: relative;  height: 750px !important; }
.visual-sub {position: relative;  width:100%; height: 550px !important; }


/**********  스크롤 안내 아이콘  ***************/
#icon_box { vertical-align: middle;position: fixed; width:100%; top:83%; margin:0 auto; text-align:center;  z-index:2}
#icon_box .icon_wrap {width:100%; height:219px;margin:0 auto; text-align:center; padding: 0px;   /*이미지는 Position 지정*/ position:relative; }
#icon_box p { font-size:12px; color: rgba(255, 255, 255, 1);}
#img_ball { text-align:center; width:25px; height:auto;}



/**********  메인 비쥬얼 슬라이드 타이틀  ***************/

#visual .slider-title {position: absolute; width: 100%;  height: 60%; top:30%; padding:0px;  text-align:center;z-index:5;}
#visual .slider-title .top {color: #fff;margin:0 0 10px 0; padding:0;font-size: 1.3rem;letter-spacing:-1px;font-weight: 400;}
#visual .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important; }
#visual .slider-title .tit {color:#fff; font-size: 3.5rem; line-height:90px; font-weight: 400; display: block;}
#visual .slider-title .txt {margin: 30px 0 60px 0; color:#fff; line-height: 1.6; font-size: 16px;}


#visual .slider-title .line01-warp, #visual-sub .slider-title .line01-warp {position: absolute;right: 25%; top: -10px;}
#visual .slider-title .line02-warp, #visual-sub .slider-title .line02-warp {position: absolute;left: 25%; top: 180px;}

#visual .slider-title .line01, #visual-sub .slider-title .line01 {  width: 88px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#visual .slider-title .line02, #visual-sub .slider-title .line02 { width: 88px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }



/**********  서브 비쥬얼 슬라이드 타이틀  ***************/
#visual-sub .slider-title {position: absolute; width: 100%;  height: 60%; top:25%; padding:0px;  text-align:center;z-index:2;}
#visual-sub .slider-title .top {color: #fff;margin:0 0 10px 0; padding:0;font-size: 1.3rem;letter-spacing:-1px;font-weight: 400;}
#visual-sub .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important; }
#visual-sub .slider-title .tit {color:#fff; font-size: 3.5rem; line-height:90px; font-weight: 400; display: block;}
#visual-sub .slider-title .txt {margin: 30px 0 60px 0; color:#fff; line-height: 1.6; font-size: 16px;}


#visual .slider-title .line01-warp, #visual-sub .slider-title .line01-warp {position: absolute;right: 25%; top: -10px;}
#visual .slider-title .line02-warp, #visual-sub .slider-title .line02-warp {position: absolute;left: 25%; top: 180px;}

#visual .slider-title .line01, #visual-sub .slider-title .line01 {  width: 88px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#visual .slider-title .line02, #visual-sub .slider-title .line02 { width: 88px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }









/**************************************** max-width:1100px *********************************************/

@media only screen and (max-width:1170px)
{




}



/**************************************** max-width:980px *********************************************/
@media only screen and (max-width:980px)
{

.visual-main {position: relative;  width:100%; height: 550px !important; }
.visual-sub {position: relative;  width:100%; height: 400px !important; }



/**********  메인 비쥬얼 슬라이드 타이틀  ***************/
#visual .slider-title {  position: absolute; top: 20%;  bottom: 0;  left: 0;  right: 0;  width: 100%;  height: 60%;   margin: auto; z-index:3;}
#visual .slider-title .txt-wrap {height:100%; margin:0 auto; text-align:center; padding: 0px; }
#visual .slider-title .top {color: #fff;padding:0;font-size: 1.2rem;letter-spacing:-1px;font-weight: 400;}
#visual .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important;}
#visual .slider-title .tit { color:#fff; font-size: 3rem; line-height:60px; font-weight: 700; display: block;}
#visual .slider-title .txt {margin: 20px 0 40px 0; color:#fff; line-height: 1.2; font-size: 16px;}


/**********  서브 비쥬얼 슬라이드 타이틀  ***************/
.visual-sub .slider-title {  position: absolute; top: 30%;  bottom: 0;  left: 0;  width: 100%;  height: 60%;   margin: auto; z-index:3;}
.visual-sub .slider-title .txt-wrap {height:100%; margin:0 auto; text-align:center; padding: 0px; }
.visual-sub .slider-title .top {color: #fff;padding:0;font-size: 1.2rem;letter-spacing:-1px;font-weight: 400;}
.visual-sub .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important; }
.visual-sub .slider-title .tit { color:#fff; font-size: 2.5rem; line-height:55px; font-weight: 700; display: block;}
.visual-sub .slider-title .txt {margin: 10px 0 60px 0; color:#fff; line-height: 1.6; font-size: 16px;}




}





/**************************************** max-width:768px *********************************************/
@media only screen and (max-width:768px)
{



.visual-main {position: relative;  width:100%; height: 550px !important; }
.visual-sub {position: relative;  width:100%; height: 400px !important; }


/**********  메인 비쥬얼 슬라이드 타이틀  ***************/
#visual .slider-title {  position: absolute; top: 20%;  bottom: 0;  left: 0;  right: 0;  width: 100%;  height: 60%;   margin: auto; z-index:3;}
#visual .slider-title .txt-wrap {height:100%; margin:0 auto; text-align:center; padding: 0px; }
#visual .slider-title .top {color: #fff;padding:0;font-size: 1.2rem;letter-spacing:-1px;font-weight: 400;}
#visual .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important;}
#visual .slider-title .tit { color:#fff; font-size: 3rem; line-height:60px; font-weight: 700; display: block;}
#visual .slider-title .txt {margin: 20px 0 40px 0; color:#fff; line-height: 1.2; font-size: 16px;}


/**********  서브 비쥬얼 슬라이드 타이틀  ***************/
.visual-sub .slider-title {  position: absolute; top: 30%;  bottom: 0;  left: 0;  width: 100%;  height: 60%;   margin: auto; z-index:3;}
.visual-sub .slider-title .txt-wrap {height:100%; margin:0 auto; text-align:center; padding: 0px; }
.visual-sub .slider-title .top {color: #fff;padding:0;font-size: 1.2rem;letter-spacing:-1px;font-weight: 400;}
.visual-sub .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important; }
.visual-sub .slider-title .tit { color:#fff; font-size: 2.5rem; line-height:55px; font-weight: 700; display: block;}
.visual-sub .slider-title .txt {margin: 10px 0 60px 0; color:#fff; line-height: 1.6; font-size: 16px;}



}

/**************************************** max-width:480px *********************************************/

@media screen and (max-width:480px)
{


.visual-main {position: relative;  width:100%; height: 550px !important; }
.visual-sub {position: relative;  width:100%; height: 450px !important; }

/**********  메인 비쥬얼 슬라이드 타이틀  ***************/
#visual .slider-title {  position: absolute; top: 10%;  bottom: 0;  left: 0;  right: 0;  width: 95%;  height: 60%;   margin: auto; z-index:3;}
#visual .slider-title .txt-wrap {height:100%; margin:0 auto; text-align:center; padding: 0px; }
#visual .slider-title .top {color: #fff;padding:0;font-size: 1.2rem;letter-spacing:-1px;font-weight: 400;}
#visual .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important;}
#visual .slider-title .tit { color:#fff; font-size: 2.3rem; line-height:50px; font-weight: 700; display: block;}
#visual .slider-title .txt {margin: 20px 0 40px 0; color:#fff; line-height: 1.2; font-size: 16px;}


#visual .slider-title .line01-warp{position: absolute;right: 5%; top: -10px;}
#visual .slider-title .line02-warp{position: absolute;left: 5%; top: 250px;}

#visual .slider-title .line01{  width: 70px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#visual .slider-title .line02{ width: 70px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }




/**********  서브 비쥬얼 슬라이드 타이틀  ***************/
#visual-sub .slider-title {  position: absolute; top: 3%;  bottom: 0;  left: 0;  right: 0;  width: 95%;  height: 60%;   margin: auto; z-index:3;}
#visual-sub .slider-title .txt-wrap {height:100%; margin:0 auto; text-align:center; padding: 0px; }
#visual-sub .slider-title .top {color: #fff;padding:0;font-size: 1.2rem;letter-spacing:-1px;font-weight: 400;}
#visual-sub .slider-title .tit {width:100%;  margin:0 auto; padding: 0px !important;}
#visual-sub .slider-title .tit { color:#fff; font-size: 2.0rem; line-height:45px; font-weight: 700; display: block;}
#visual-sub .slider-title .txt {margin: 20px 0 40px 0; color:#fff; line-height: 1.2; font-size: 0.9rem;}


#visual-sub .slider-title .line01-warp{position: absolute;right: 2%; top: 50px;}
#visual-sub .slider-title .line02-warp{position: absolute;left: 2%; top: 200px;}

#visual-sub .slider-title .line01{  width: 70px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#visual-sub .slider-title .line02{ width: 70px; height: 2px;  background-color: rgba(255,255,255,0.5); 
-ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }


}
