/* 메인슬라이더 */
#visual{width:100%; min-width:1100px; height:649px; margin:0 auto; position:relative; overflow:hidden;}
a{cursor:pointer}

#visual .sliderbx{ z-index:10;width:100% !important; height:649px; position:relative;}

#visual #slogan{ text-align:center; color:#fff;}
#visual #mslogan{ display:none;}
#visual #slogan .img01{ position:absolute; top:130px; left:50%; margin-left:-449px; opacity:0; z-index:998;font-size:65px; font-weight:700;}
#visual #slogan .ms_line{ position:absolute; top:200px; left:50%; margin-left:-350px; opacity:0; z-index:998; width:700px; height:1px; background:#fff;}
#visual #slogan h2{ position:absolute; top:260px; left:50%; margin-left:-260px; opacity:0; z-index:999; font-size:30px; letter-spacing:-1.5px; font-weight:700;}
#visual #slogan h2 strong{ color:#1aa5f9; font-weight:700;}
#visual #slogan h3{ position:absolute; top:310px; left:50%; margin-left:-335px; opacity:0; z-index:998;font-size:18px; letter-spacing:-1px; font-weight:lighter;}

#visual .sliderbx li{ width:100% !important; height:649px; background-repeat:no-repeat; background-position: center top;}
#visual .sliderbx li.mv01{background-image:url(../img/main/mvisual01.jpg)}
#visual .sliderbx li.mv02{background-image:url(../img/main/mvisual02.jpg)}
#visual .sliderbx li.mv03{background-image:url(../img/main/mvisual03.jpg)}

#visual div.bx-pager{ position:absolute; bottom:40px; left:50%; margin-left:-39px; z-index:101;}
#visual div.bx-pager div{ float:left; margin:0 7px;}
#visual div.bx-pager div a{ display:block; width:12px; height:12px; text-indent:-9999px; border-radius:9px; background:#FFF;}
#visual div.bx-pager div a.active{ width:16px; height:16px; background:none; border:4px solid #2494d8; margin-top:-3px;}
#visual div.bx-controls-direction a{ 
display:block; width:40px; height:40px; border-bottom:3px solid #FFF; border-left:3px solid #FFF; border-radius:0 0 0 5px; text-indent:-9999px; position:absolute; top:50%; margin-top:-25px !important; z-index:9999;} /*좌우버튼동시선택*/
#visual a.bx-prev{ transform:translateY(-50%) rotate(45deg); left:30px;}
#visual a.bx-next{ transform:translateY(-50%) rotate(-135deg); right:30px;}	
#visual div.bx-controls-auto{position:absolute; width:40px; top:30px; z-index:2; left:50%; margin-left:470px; }
#visual div.bx-controls-auto a{	float:left; margin-right:3px; width:12px; height:12px; border-radius:9px; color:#FFF; text-align:center; line-height:12px; font-size:12px; text-indent:-9999px;	} /*플레이스탑버튼동시선택*/
#visual div.bx-controls-auto a.bx-start{background:url(../img/common/btn_play.png) no-repeat 50% 50% #4C5365;}
#visual div.bx-controls-auto a.bx-stop{background:url(../img/common/btn_stop.png) no-repeat 50% 50% #4C5365;}


/*메인-중간컨텐츠*/
#middle{ width:100%; height:350px; position:relative; background:url(../img/main/middle_bg.jpg) no-repeat center top;}
#middle_in{ width:1100px; margin:0 auto;}
#middle_in:after{ display:block; content:""; clear:both;}
#middle .mid_box{ float:left; width:50%; box-sizing:border-box;}
#middle .tra_line{ width:80px; height:2px; margin-bottom:15px;}
#middle .mid_box h1{ font-size:2.5em; color:#fff; font-weight:400;}
#middle .mid_box h1 span{ font-family: 'Titillium Web', sans-serif; font-size:20px; letter-spacing:0;}
#middle .mid_box p{ font-size:1.4em; font-weight:lighter; color:rgba(250,250,250,0.7); margin:25px 0 25px 0;}
#middle .mid_box a.btn_tra{ display:block; border:1px solid #fff; width:150px; line-height:40px; font-size:1.3em; color:#fff;font-weight:lighter; text-align:center; background:rgba(250,250,250,0); transition:all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-o-transition: all 0.5s;}
#middle .mid_box a.btn_tra:hover{ background:rgba(250,250,250,1); color:#333; font-weight:normal; transition:all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-o-transition: all 0.5s;}
#middle .mdbox01{ padding:60px 0 0 0;}
#middle .mdbox01 .tra_line{ background:#55bfff;}
#middle .mdbox01 h1 span{ color:#55bfff;}
#middle .mdbox02{ padding:60px 0 0 50px;}
#middle .mdbox02 .tra_line{ background:#183d63;}
#middle .mdbox02 h1 span{ color:#183d63;}

#middle2{ width:100%; border-bottom:1px solid #ddd;}
#middle2_in{ width:1100px; margin:0 auto;}
#middle2_in:after{ display:block; content:""; clear:both;}
#middle2 .abox{ float:left; width:33%; min-height:300px; box-sizing: border-box;}
#middle2 .abox01{ border-right:1px solid #ddd; padding:40px 40px 40px 0px;}
#middle2 .bbs:after{ display:block; content:""; clear:both;}
#middle2 .abox02{ border-right:1px solid #ddd; padding:40px 40px;}
#middle2 .abox02 h1{ font-family: 'Titillium Web', sans-serif; font-size:3.5em; color:#333; margin:15px 0 20px 0;}
#middle2 .abox02 h2{ font-family: 'Titillium Web', sans-serif; font-size:1.3em; color:#b2b2b2; letter-spacing:0;}
#middle2 .abox02 h2 span{ font-family:'Noto Sans KR', sans-serif; font-size:1.3em; font-weight:500; color:#183d63; letter-spacing:-1px;}
#middle2 .abox02 h3{ font-family: 'Titillium Web', sans-serif; font-size:1.5em; font-weight:500; text-align:center; color:#878787; background:#e0e0e0; padding:10px 0; margin-bottom:3px;}
#middle2 .abox02 h4{ font-family: 'Titillium Web', sans-serif; font-size:1.3em; text-align:center; color:#fff; background:#1aa5f9; padding:12px 0; letter-spacing:0;}
#middle2 .abox03{ padding:40px 0px 40px 40px;}
#middle2 .ab01{ background:url(../img/main/mcont_icon01.gif) no-repeat 90% center; border-bottom:1px solid #ddd; padding-bottom:25px; margin-bottom:20px;}
#middle2 .ab02{ background:url(../img/main/mcont_icon02.gif) no-repeat 90% center;}
#middle2 dt{ font-size:2em; margin-bottom:10px; font-weight:300; color:#333; letter-spacing:-1px;}
#middle2 dd{ font-size:15px; color:#999;}

#middle3{ background:#f3f3f3; padding:70px 0;}
#middle3_in{ width:1100px; margin:0 auto;}
#middle3 h1{ font-family: 'Titillium Web', sans-serif; font-size:3em; color:#333; text-align:center; margin:0px 0 50px 0;}
#middle3 a{ display:inline-block; width:33%; height:399px; background-position:center top; background-repeat:no-repeat; text-align:center; position:relative; transition:all 0.5s;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-o-transition: all 0.5s;}
#middle3 a.mdbox01{ background-image:url(../img/main/mdong_img01.jpg);}
#middle3 a.mdbox02{ background-image:url(../img/main/mdong_img02.jpg);}
#middle3 a.mdbox03{ background-image:url(../img/main/mdong_img03.jpg);}
#middle3 a:hover{ transform:scale(1.05);}
#middle3 .txt{ position:absolute; bottom:40px; left:40px; color:#fff; font-size:2em;}
#middle3 .txt p{ width:30px; height:3px; background:#fff; margin-bottom:10px;}


@media (max-width:575px) {
#visual{ width:100%; min-width:100%; height:230px; margin:0; position:relative; overflow:hidden;}
#visual #slogan{ display:none;}
#visual #mslogan{ display:block; text-align:center; color:#fff; position:absolute; top:0px; left:50%; margin-left:-153px; opacity:0; z-index:998;}
#visual #mslogan .img01{ font-size:23px; font-weight:700;}
#visual #mslogan .ms_line{ width:200px; height:1px; background:rgba(250,250,250,0.3); margin:10px auto;}
#visual #mslogan h2{ font-size:17px; letter-spacing:-1px;}
#visual #mslogan h2 strong{ color:#1aa5f9; font-weight:700;}
#visual #mslogan h3{ font-size:12px; letter-spacing:-1px; font-weight:lighter; margin-top:10px;}
#visual .sliderbx li{ width:100% !important; height:250px; background-position:center top; background-size:cover; text-align:center;}
#visual div.bx-pager{ bottom:15px; margin-left:-22px;}
#visual div.bx-pager div{ margin:0 3px;}
#visual div.bx-pager div a{ width:8px; height:8px;}
#visual div.bx-pager div a.active{ width:10px; height:10px; border:3px solid #2494d8; margin-top:-1px;}
#visual div.bx-controls-direction{ display:none;}

/*메인-중간컨텐츠*/
#middle{ height:auto; background:none;}
#middle_in{ width:100%;}
#middle .tra_line{ width:40px; margin-bottom:10px;}
#middle .mid_box h1{ font-size:1.8em; line-height:1em; margin-bottom:20px;}
#middle .mid_box h1 span{ font-size:14px;}
#middle .mid_box p{ display:none;}
#middle .mid_box a.btn_tra{ width:100px; line-height:25px; font-size:1em;}
#middle .mdbox01{ padding:30px 20px; background:#183d63;}
#middle .mdbox02{ padding:30px 20px; background:#55bfff;}

#middle2_in{ width:100%;}
#middle2 .abox{ float:none; width:100%; min-height:auto;}
#middle2 .abox01{ display:none;}
#middle2 .abox02{ border-right:0; border-bottom:1px solid #ddd; padding:30px 30px;}
#middle2 .abox02 h1{ margin:10px 0 10px 0;}
#middle2 .abox03{ padding:0px;}
#middle2 .abox03:after{ display:block; content:""; clear:both;}
#middle2 dl{ float:left; width:50%; padding:20px 30px; box-sizing:border-box; border-right:1px solid #ddd;}
#middle2 .ab01{ background-position:center 20px; border-bottom:0; margin-bottom:0px;}
#middle2 .ab02{ background-position:center 20px; border-right:0;}
#middle2 dt{ font-size:1.5em; padding-top:60px; font-weight:500; text-align:center;}
#middle2 dd{ font-size:11px; text-align:center;}

#middle3{ padding:40px 0;}
#middle3_in{ width:95%;}
#middle3 h1{ font-size:2em; margin:0px 0 20px 0;}
#middle3 a{ width:30%; height:150px; background-size:cover;}
#middle3 a.mdbox01{ margin:0 0 0 10px;}
#middle3 a.mdbox02{ margin:0 5px;}
#middle3 .txt{ bottom:20px; left:5px; font-size:1.1em;}
#middle3 .txt p{ width:20px; height:2px; margin-bottom:3px;}

}



