@charset "utf-8";
@import url('./common.css');
@import url('./layout.css');


/*  SUB LAYOUT :: 비주얼 */
#sub_visual{overflow:hidden; position:relative; width:100%; height:300px; background-size:cover !important;}
#sub_visual .visual-img-con{
	position:absolute; left:0; width:100%; height:100%; 
	-ms-transform: scale(1.1,1.1) rotate(0.0001deg);
    -o-transform: scale(1.1,1.1) rotate(0.0001deg);
    -moz-transform: scale(1.1,1.1) rotate(0.0001deg);
    -webkit-transform: scale(1.1,1.1) rotate(0.0001deg);
     transform: scale(1.1,1.1) rotate(0.0001deg);
	-webkit-transition:transform 5s  ease-in-out ;
	-moz-transition:transform 5s ease-in-out ;
	-o-transition:transform 5s ease-in-out ;
	-ms-transition:transform 5s ease-in-out ;
    transition:transform 5s ease-in-out ;	
}
#sub_visual .visual-txt-con{position:relative; width:100%; margin:0 auto; height:100%; letter-spacing:-0.5px; text-align:center; color:#fff; padding:0 5%; z-index:2;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}
#sub_visual .visual-tit{font-weight:500; color:#fff; font-size:43px;line-height:1;letter-spacing:-0.00em; padding-top:100px; text-shadow:0px 0px 7px rgba(0, 0, 0, .5);}

#sub_visual .visual-tit {position:relative; opacity:0;filter:Alpha(opacity=0); visibility:hidden;
	-moz-transition:transform 0.8s, opacity 1.0s;
	-ms-transition:transform 0.8s, opacity 1.0s;
	-webkit-transition:transform 0.8s, opacity 1.0s;
	-o-transition:transform 0.8s, opacity 1.0s;
	transition:transform 0.8s, opacity 1.0s;
}
/* Active */
#sub_visual.active .visual-img-con{
	-ms-transform: scale(1.0,1.0) rotate(0.0001deg);
    -o-transform: scale(1.0,1.0) rotate(0.0001deg);
    -moz-transform: scale(1.0,1.0) rotate(0.0001deg);
    -webkit-transform: scale(1.0,1.0) rotate(0.0001deg);
     transform: scale(1.0,1.0) rotate(0.0001deg);
}
#sub_visual.active .visual-tit { opacity:1.0;filter:Alpha(opacity=100); visibility:visible;
	-ms-transform: translateX(0) rotate(0.0001deg);
    -o-transform: translateX(0) rotate(0.0001deg);
    -moz-transform: translateX(0) rotate(0.0001deg);
    -webkit-transform: translateX(0) rotate(0.0001deg);
     transform: translateX(0) rotate(0.0001deg); 
}
#sub_visual.active .visual-tit { letter-spacing:.2em; 
	-webkit-transition-delay:0.3s; 
	-moz-transition-delay:0.3s; 
	-o-transition-delay:0.3s; 
	-ms-transition-delay:0.3s; 
	transition-delay:0.3s
}

.topbg01 {background: url("/img/sub/topbg1.jpg") no-repeat center / cover rgb(255, 255, 255);}
.topbg02 {background: url("/img/sub/topbg2.jpg") no-repeat center / cover rgb(255, 255, 255);}
.topbg03 {background: url("/img/sub/topbg3.jpg") no-repeat center / cover rgb(255, 255, 255);}
.topbg04 {background: url("/img/sub/topbg4.jpg") no-repeat center / cover rgb(255, 255, 255);}
.topbg05 {background: url("/img/sub/topbg5.jpg") no-repeat center / cover rgb(255, 255, 255);}


/* ■ 서브메뉴 */
#sub_menu {position:absolute; left:0; bottom:0;  width:100%; height:52px; z-index:99999}
#sub_menu li {float:left; height:100%; text-align:center}
#sub_menu a {display:block; font-size:19px; width:calc(100%-1); height:100%; line-height:50px; background:#fff; margin-left:1px; background-color:rgba(255,255,255,0.8); transition:all 0.3s ease-in-out; -webkit-transition:all 0.3.0s ease-in-out}
#sub_menu a:hover, #sub_menu a.on {color:#fff; background-color:rgba(229,1,18,0.8)}
#sub_menu a:hover {transition:all 0.3s ease-in-out; -webkit-transition:all 0.3.0s ease-in-out}
/* #sub_menu li:first-child a {margin-left:0; padding-left:0.1%} */
#sub_menu .sms {width:1170px; height:100%; margin:0 auto; display:none}
#sub_menu .sms.on {display:block}
#sub_menu .sm1 li {width:25%;}
#sub_menu .sm2 li {width:33.333%;}
#sub_menu .sm3 li {width:100%;}


/* ■ 서브 공통 */
#mid_layout {padding:64px 0 150px}
#mid_layout h2 {text-align:center; font-weight:500; font-size:38px; padding-bottom:30px}


/* ■ 기업개요 */
.intro > div {height:744px; background:url('/img/sub/intro_bg.jpg') no-repeat ;}
.intro li {float:left}
.intro .row01 {padding:70px 40px}
.intro .row01 li.img {width:25%; }
.intro .row01 li.txt {width:75%; text-align:right; font-size:18px; line-height:30px}
.intro .row02 > div {height:450px; margin:0 40px 0; background-color:rgba(255,255,255,0.65)}
.intro .row02 li {width:33.333%; text-align:center}
.intro .row02 h3 {color:#002393; font-size:18px; font-weight:500; padding:85px 0 20px}
.intro .row02 p {width:280px; font-size:15px; color:#000; text-align:left; margin-left:95px}


/* ■ 오시는 길 */
.map .row02 {width:100%;margin:0px; padding-top:20px;text-align: left; }
.map .row02 ul {border-bottom:2px dotted #dedede;padding:10px 0px}
.map .row02 .ltitle {display:inline-block; width:100px; font-size:16px; font-weight:500;padding-left:10px}
.map .row02 .rcontent{display:inline-block; width:auto; font-size:15px; color:#5f5f5f; line-height:24px; margin-left:22px}
.map .row02 i {margin-right:5px}


/* ■ 솔루션 */
.tms .table,
.tms .img img {width:100%; margin-top:40px}

.tms .table th {background:#0060a8; color:#fff}
.tms .table em {color:#0060a8}
.tms .table td {text-align:center}
.tms .table td:first-child {background:#f2f2f2; font-weight:500; font-size:16px; color:#000}



