﻿@charset "utf-8";
/* 슬라이드 */
#section .slick-prev {left: 5px; z-index:9999;}
#section .slick-next {right: 5px;}
#section .slick-dots {bottom: 20px;}
#section .slick-prev::before,#section .slick-next::before{content: none;}
#section .slick-prev, .slick-next{width: 40px; height: 81px;}
#section .slick-prev{background: url(../images/visual/left_arrow.png) no-repeat scroll 0 0;}
#section .slick-prev:hover{background: url(../images/visual/left_arrow.png) no-repeat scroll 0 0;}
#section .slick-next{background: url(../images/visual/right_arrow.png) no-repeat scroll 0 0;}
#section .slick-next:hover{background: url(../images/visual/right_arrow.png) no-repeat scroll 0 0;}
#section .slick-dots li button::before{content: none;}
#section .slick-dots li{width: 131px; height: 8px;  background:url(../images/visual/visual_dot.jpg) no-repeat;}
#section .slick-dots li:hover{background:url(../images/visual/visual_dot_active.jpg) no-repeat;}
#section .slick-dots li.slick-active{background:url(../images/visual/visual_dot_active.jpg) no-repeat;}

.text_wrap{position: relative; width: 1200px; height: 810px; margin:0 auto;}

.text_wrap > div{position: absolute;}

.text_wrap >div{left: 50%;}
.text_wrap .visual01_text01{margin-left: -201px; top: 220px;}
.text_wrap .visual01_text02{margin-left: -207px; top: 320px;}
.text_wrap .visual01_text03{margin-left: -314px; top: 480px;}
.text_wrap .visual01_text04{margin-left: -284px; top: 520px;}
.text_wrap .visual01_text05{margin-left: -99px; top: 620px;
  display: inline-block;
  width: auto;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  opacity: 0;}

.text_wrap >div{left: 50%;}
.text_wrap .visual02_text01{margin-left: -240px; top: 70px;}
.text_wrap .visual02_text02{margin-left: -273px; top: 220px;}
.text_wrap .visual02_text03{margin-left: -270px; top: 400px;}
.text_wrap .visual02_text04{margin-left: -371px; top: 450px;}
.text_wrap .visual02_text05{margin-left: -99px; top: 700px;
  display: inline-block;
  width: auto;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  opacity: 0;}

.text_wrap .visual03_text01{left: 550px; top: 100px;}
.text_wrap .visual03_text02{left: 570px; top: 200px;}
.text_wrap .visual03_text03{left: 450px; bottom: 200px;}
.text_wrap .visual03_text04{left: 750px; bottom: 100px;
  display: inline-block;
  width: auto;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  opacity: 0;}

.text_wrap .visual04_text01{left: 197px; top: 120px;}
.text_wrap .visual04_text02{left: 300px; top: 350px;}
.text_wrap .visual04_text03{left: 350px; bottom: 200px;}
.text_wrap .visual04_text04{right: 300px; bottom: 100px;
  display: inline-block;
  width: auto;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  opacity: 0;}

.text_wrap .visual05_text01{left: 50px; top: 120px;}
.text_wrap .visual05_text02{left: 830px; top: 300px;}
.text_wrap .visual05_text03{left: 370px; bottom: 100px;}
.text_wrap .visual05_text04{left: 800px; bottom: 120px;}
.text_wrap .visual05_text05{left: 50%; margin-left: -259px;  bottom: 50px;
  display: inline-block;
  width: auto;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  opacity: 0;}

.text_wrap .visual06_text01{left: 601px; top: 237px;}
.text_wrap .visual06_text02{left: 600px; top: 344px;}
.text_wrap .visual06_text03{left: 601px; top: 385px;}
.text_wrap .visual06_text04{left: 600px; top: 423px;}
.text_wrap .visual06_text05{left: 603px; top: 424px;
  display: inline-block;
  width: auto;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  opacity: 0;}  
  
.text_wrap .visual07_text01{left: 305px; top: 222px;}
.text_wrap .visual07_text02{left: 250px; top: 289px;}
.text_wrap .visual07_text03{left: 345px; bottom: 250px;}
.text_wrap .visual07_text04{left: 455px; bottom: 165px;
  display: inline-block;
  width: auto;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  opacity: 0;}
  
/* + HOME PAGE: HERO ================================ */
.hero {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
}
.hero:before {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  content: "";
  background-color: rgba(0, 0, 0, 0.5);
}
.hero .hero-slider-title {
  font-size: 38px;
  line-height: 1.15;
  margin-bottom: 10px;
  letter-spacing: -0.025em;
  color: #fff;
  opacity: 0;
}

.hero .hero-slider-teaser {
  font-size: 18px;
  line-height: 1.66;
  color: white;
  opacity: 0;
}
@media screen and (max-width: 48em) {
  .hero .hero-slider-teaser {
    font-size: 14px;
  }
}
.hero .hero-slider-btn {
  margin-top: 25px;
  font-weight: 500;
  position: relative;
  display: inline-block;
  width: auto;
  padding: 8px 25px;
  cursor: pointer;
  -moz-transition: all 0.30s;
  -o-transition: all 0.30s;
  -webkit-transition: all 0.30s;
  transition: all 0.30s;
  text-align: center;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  text-decoration: none;
  color: white;
  opacity: 0;
}
.section-hero-slider .hero-slider .hero-slider-image {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: absolute;
  top: 0;
  left: 0;
  height: 810px;
  width: 100%;
}


.section-hero-slider .hero-slider .hero {
  min-height: 586px;
  background-color: rgba(0, 0, 0, 0.87);
}
.section-hero-slider .hero-slider .hero:before {
  display: none;
}



@media screen and (max-width: 64em) {
  .section-hero-slider .hero-slider .hero .hero-slider-teaser {
    font-size: 16px;
  }
}

@media screen and (max-width: 30em) {
  .section-hero-slider .hero-slider .hero .hero-slider-btn {
    min-width: 0;
    display: block;
  }
}
.section-hero-slider .hero-slider .hero[data-background="dark"] {
  background-color: rgba(0, 0, 0, 0.87);
}

.section-hero-slider .hero-slider .hero[data-background="light"] {
  background-color: white;
}
.section-hero-slider .hero-slider .hero[data-background="light"] .hero-slider-image:after {
  background-color: rgba(0, 0, 0, 0.1);
}
@media screen and (max-width: 30em) {
  .section-hero-slider .hero-slider .hero[data-background="light"] .hero-slider-container {
    background-color: white;
  }
}
.section-hero-slider .hero-slider .hero[data-background="light"] .hero-slider-title {
  color: rgba(0, 0, 0, 0.87);
}
.section-hero-slider .hero-slider .hero[data-background="light"] .hero-slider-teaser {
  color: rgba(0, 0, 0, 0.87);
}

/* board */
.board_wrap{width: 100%;}
.board_wrap .board{width: 1200px; margin: 0 auto; overflow: hidden;}
.board_wrap .board > div{float: left; width: 300px; height: 500px; padding: 0 50px; background: url(../images/board_line.jpg) no-repeat right center;}
.board_wrap .board > div ul li{background: url(/images/main/mid_dot_gray.gif) no-repeat scroll 0 5px; margin-bottom: 7px; padding-left: 10px; text-align: left;}
.board_wrap .board > div h2{margin-top: 100px; margin-bottom: 20px; text-align: center;}
.board_wrap .board > div.board01{width: 400px;}
.board_wrap .board > div.board02{width: 400px;}
.board_wrap .board > div.board03{width: 400px;}
.board_wrap .board > div td{line-height: 35px;}
.board_wrap .board > div td img{vertical-align: middle;}

legend{display: none;}
.board_wrap .board > div.board03 form fieldset div dl{overflow: hidden; margin-bottom: 5px; font-family: '돋움'; font-size: 12px;}
.board_wrap .board > div.board03 form fieldset div dl dt{float: left; width: 50px; text-align: left; letter-spacing: -1px; line-height: 25px;}
.board_wrap .board > div.board03 form fieldset div dl dd{float: left;}
.board_wrap .board > div.board03 form fieldset div dl dd input,
.board_wrap .board > div.board03 form fieldset div dl dd select
{width: 230px; margin-left: 20px; height: 25px; padding-left: 9px;  border: 1px solid #d2d2d2;}

.board_wrap .board > div.board03 form fieldset div.check_box{text-align: right;}
.board_wrap .board > div.board03 form fieldset div.check_box dl{overflow: hidden;}
.board_wrap .board > div.board03 form fieldset div.check_box dl dt{float: left;}
.board_wrap .board > div.board03 form fieldset div.check_box dl dt{float: left;}
.check_box input {margin-top: -2px;}
.pop-layer01 .btn_wrap{overflow: hidden; position: relative; left: 50%; margin-left: -45px;}
.pop-layer01 .btn_wrap > div{margin: 10px 0 20px; padding: 5px; text-align: center;}
.pop-layer01{display: none; position: absolute; top: 50%; left: 50%; width: 500px; height: auto; background-color: #fff; border: 1px solid #cccccc; z-index: 10;}
.dim-layer01{display: none; position: fixed; _position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100;}
.dim-layer01 .dimBg01{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: .5; filter: alpha(opacity=50);}
.dim-layer01 .pop-layer01{display: block; padding: 10px;}
.dim-layer01 .pop-layer01 #txt1 {border: 1px solid #e9e9e9;height: 350px; line-height: 150%; width: 100%; padding : 20px;}
a.btn-go01{display: inline-block; height: 25px; padding: 10px 15px; background-color: #c3a684; font-size: 13px; color: #fff; line-height: 25px;}
a.btn-layerClose01{height: 31px;}

.button_wrap{margin-top: 20px;}
.button_wrap button{background: #555555; width: 100%; height: 49px; border: none; color: #ffffff;}

/* content */
.content_wrap .cont01{width: 100%; height: 311px; background: url(../images/main_text01.png) no-repeat center;}
.cont02_wrap {height:672px;  cursor:pointer; left: 50%; margin-left: -960px; position: relative; width: 1920px; overflow: hidden;}
.cont02_container {overflow: hidden; position: relative; width: 100%;}
.cont02_wrap .on { top:271px; left:0; width:100%; height:0px; overflow:hidden; position:absolute; }
.cont02_wrap .on img { top:-271px; position:relative; opacity:0; filter:alpha(opacity=0); }
.cont02_wrap .title_wrap .go { bottom:-130px; position:absolute; opacity:0; filter:alpha(opacity=0); }

.content_wrap .cont03{width: 100%;}
.content_wrap .cont03 .media_bf_wrap{width: 100%;}
.content_wrap .cont03 .media_bf_wrap ul{overflow: hidden;}
.content_wrap .cont03 .media_bf_wrap ul li{float: left; width: 50%;}
.content_wrap .cont03 .media_bf_wrap ul li a{display: block; height: 523px;}
.content_wrap .cont03 .media_bf_wrap ul li.media a{background: url(../images/left_media_on.jpg) no-repeat right center; transition: all 0.8s;}
.content_wrap .cont03 .media_bf_wrap ul li.media a img{transition: all 0.8s; float: right;}
.content_wrap .cont03 .media_bf_wrap ul li.media a:hover img{opacity: 0;}

.content_wrap .cont03 .media_bf_wrap ul li.bf{background: #e8e9ee;}
.content_wrap .cont03 .media_bf_wrap ul li.bf a{background: url(../images/right_b_f.jpg) no-repeat left center;}

.content_wrap .cont04{width: 100%; height: 423px; background: url(../images/cont04_bg.png) no-repeat center; margin: 160px 0;}
.content_wrap .cont04 a{display: block; height: 423px;}


.cont05 .tabSet01 .tabs{width: 1200px; margin: 0 auto; overflow: hidden;}
.cont05 .tabSet01 .tabs li{float: left;}
.cont05 .tabSet01 .tabs li a{display: block;}
.cont05 .tabSet01 .tabs li.roa01 a{background: url(../images/roa_btn_map_02.jpg) no-repeat center; height: 61px; width: 240px;}
.cont05 .tabSet01 .tabs li.roa01 a:hover,
.cont05 .tabSet01 .tabs li.roa01 a.on{background: url(../images/roa_btn_map_02_on.jpg) no-repeat center; height: 61px; width: 240px;}

.cont05 .tabSet01 .tabs li.roa02 a{background: url(../images/roa_btn_map_03.jpg) no-repeat center; height: 61px; width: 240px;}
.cont05 .tabSet01 .tabs li.roa02 a:hover,
.cont05 .tabSet01 .tabs li.roa02 a.on{background: url(../images/roa_btn_map_03_on.jpg) no-repeat center; height: 61px; width: 240px;}

.cont05 .tabSet01 .tabs li.roa03 a{background: url(../images/roa_btn_map_04.jpg) no-repeat center; height: 61px; width: 240px;}
.cont05 .tabSet01 .tabs li.roa03 a:hover,
.cont05 .tabSet01 .tabs li.roa03 a.on{background: url(../images/roa_btn_map_04_on.jpg) no-repeat center; height: 61px; width: 240px;}

.cont05 .tabSet01 .tabs li.roa04 a{background: url(../images/roa_btn_map_05.jpg) no-repeat center; height: 61px; width: 240px;}
.cont05 .tabSet01 .tabs li.roa04 a:hover,
.cont05 .tabSet01 .tabs li.roa04 a.on{background: url(../images/roa_btn_map_05_on.jpg) no-repeat center; height: 61px; width: 240px;}

.panels{position: relative;}
.panels .panel{margin-bottom: 0px!important;}
#panel1-1{background: url(../images/roa01.jpg) no-repeat center; height: 419px;}
#panel1-2{background: url(/roa_kmc/images/roa02.jpg) no-repeat center; height: 419px;}
#panel1-3{background: url(../images/roa03.jpg) no-repeat center; height: 419px;}
#panel1-4{background: url(../images/roa04.jpg) no-repeat center; height: 419px;}

.btn_wrap01{width: 1200px; margin: 0 auto; height: 419px;}
.btn_wrap01 div{position: absolute;}
.btn_wrap01 div a{display: block;}
.btn_wrap01 div.btn01{left: 50%;margin-left: -447px;top: 38px;}
.btn_wrap01 div.btn02{left: 50%;margin-left: -114px; top: 38px;}

.cont06{width: 100%; height: 211px; background: url(../images/mark.jpg) no-repeat center; border-top: 1px solid #636363;display: none;}

.cont07{width: 100%;}
.cont07 .site_map_wrap{width: 100%;height: 250px; padding: 35px 0; background: #38373a;}
.cont07 .site_map_wrap .site_map{width: 1200px; margin: 0 auto; overflow: hidden;}
.cont07 .site_map_wrap .site_map dl{width: 125px; margin-right:8px; float: left; text-align: left;}
.cont07 .site_map_wrap .site_map dl dt{font-size: 17px; margin-bottom: 15px;}
.cont07 .site_map_wrap .site_map dl dd{font-size: 12px; line-height: 200%;}
.cont07 .site_map_wrap .site_map dl dd a{padding-left: 5px;display: block;}
.site_map dl dt{color: #aaaaaa;}
.site_map dl dd a{color: #aaaaaa;}
.site_map dl:hover dt, .site_map dl dd a:hover{color: #ffdfa7; transition: all 0.7s;}
.site_map dl dd a:hover{display: block; background: #4c4b4e; color: #ffdfa7; transition: all 0.7s;}

.footer_menu{border-bottom: 1px solid #dddddd; padding: 5px 0;}
.footer_menu ul{overflow: hidden; width: 1200px; margin: 0 auto; }
.footer_menu ul li{float: left;}
.footer_menu ul li span{display: block; margin: 4px 10px; width: 1px; height: 11px; background : #aaaaaa;}
.footer_menu ul li a{display: block; font-size: 13px; color: #777777;}
.footer_menu ul li a:hover{color: #333333}

.mobile_go{margin: 20px;}
.mobile_go a{display: block; text-align: center;border: 1px solid #dddddd; padding: 50px 0; font-size: 50px; font-weight: bold; background: #ffffff; color: #333333}

/* 인천점 추가 */
.cont05 .tabSet01 .tabs li.roa05 a{background: url(/roa_index/images/roa_btn_map_06.jpg) no-repeat center; height: 61px; width: 240px;}
.cont05 .tabSet01 .tabs li.roa05 a:hover,
.cont05 .tabSet01 .tabs li.roa05 a.on{background: url(/roa_index/images/roa_btn_map_06_on.jpg) no-repeat center; height: 61px; width: 240px;}
#panel1-4{background: url(/roa_index/images/roa05.jpg) no-repeat center; height: 419px;}

/* 노원점 추가 */
.cont05 .tabSet01 .tabs li.roa02 a{background: url(/roa_index/images/roa_btn_map_03.jpg) no-repeat center; height: 61px; width: 240px;}
.cont05 .tabSet01 .tabs li.roa02 a:hover,
.cont05 .tabSet01 .tabs li.roa02 a.on{background: url(/roa_index/images/roa_btn_map_03_on.jpg) no-repeat center; height: 61px; width: 240px;}
#panel1-2{background: url(/roa_index/images/roa02.jpg) no-repeat center; height: 419px;}

/* 창원점 추가 */
.cont05 .tabSet01 .tabs li.roa06 a{background: url(/roa_index/images/roa_btn_map_07.jpg) no-repeat center; height: 61px; width: 200px;}
.cont05 .tabSet01 .tabs li.roa06 a:hover,
.cont05 .tabSet01 .tabs li.roa06 a.on{background: url(/roa_index/images/roa_btn_map_07_on.jpg) no-repeat center; height: 61px; width: 200px;}
#panel1-5{background: url(/roa_kmc/images/roa06.jpg) no-repeat center; height: 419px;}













