@charset "utf-8";
/*
	Common Layout CSS _ 15.05.18
*/

/*common*/


.inner{max-width:1500px; width:100%; position:relative; margin: 0 auto;}
.pdinner{max-width:1500px; padding:0 5%; position:relative; margin: 0 auto;}
.ofh{overflow:hidden;}
.ls10{letter-spacing:10px;}
.ls5{letter-spacing:5px;}

.tit_h3{font-size:28px;font-weight:400; color:#323232;  position:relative; letter-spacing:-1px}
.tit_h3:after{content:''; width:60px; height:1px; display:block; background:#505050; margin: 0 auto; margin-top:20px;}
.tit_h4{font-size:26px; color:#323232; font-weight:bold; letter-spacing:-1px}

.tit_h5{color:#323232; font-weight:bold; font-size:18px;}

.tit_h4.noLine:after{width:0; height:0px; margin-top:0px;}


.mEnter{display:block;}
.mb{margin-bottom:30px !important}
.pb{padding-bottom:30px;}
.bmb{margin-bottom:40px !important}
.mb10{margin-bottom:10px !important;}
.mb20{margin-bottom:20px !important;}
.mb30{margin-bottom:30px !important;}


.tac{text-align:center;}
.tal{text-align:left;}
.tar{text-align:right;}
.mo_only{display:block;}

.move_scroll{max-width:768px; overflow-x:auto}

.line_link{display:inline-block; color:#ffffff; padding-bottom:5px; border-bottom:3px solid #ffffff; font-size:0.9em}
.line_btn{overflow:hidden;}
.line_btn li{width:100%; margin-bottom:10px;}
.line_btn li a{display:block; border:1px solid #ffffff; padding:5px; text-align:center; font-size:0.8em}
.line_btn li:last-child{margin:0; }

.arrow_cir_w:after{content:''; width:28px; height:25px; background:url(../img/ic_arrow_w.png) no-repeat center center; background-size:100%; display:inline-block; vertical-align:middle; margin-left:10px;}

.dpib{display:inline-block}
.dpb{display:block;}

.upper{text-transform:uppercase}
.fwb{font-weight:600}
.fwbb{font-weight:800}
.fss{font-size:0.8em}
.Tblack{color:#323232}
.Tred{color:#e83428}
.ylTxt{color:#fff94e;}
.grTxt{color:#11ae4b}
.orgTxt{color:#ffa60a}
.upcase{text-transform:uppercase}

.btn_more{display:inline-block; color:#ffffff; background:#1c3f95; padding:6px 20px; border-radius:500px}

@media all and (min-width:768px) {


.tit_h4{font-size:30px; letter-spacing:-1px}
.tit_h5{font-size:20px; letter-spacing:-1px}


.mb{margin-bottom:45px !important; }
.pb{padding-bottom:45px;}
.bmb{margin-bottom:60px !important;}

.mo_only{display:none;}
.move_scroll{max-width:100%;}
.pdinner{padding:0 5%}

.half{width:47.5%; float:left;}
.mr{margin-right:3%;}

.line_btn li{width:47.5%; float:left; margin-right:3%;}
.line_btn li:last-child{margin:0}
.line_btn li a{padding:8px}
}

@media all and (min-width:1200px) {

body, html{font-size:17px;}
.mEnter{display:inline-block;}


.tit_h3:after{margin-top:25px;}

.tit_h4{font-size:30px; }

.tit_h5{font-size:20px; }


.mb{margin-bottom:50px !important}
.pb{padding-bottom:50px;}
.bmb{margin-bottom:80px !important}
.pdinner{padding:0 20px}

.subwrap .pdinner{padding-right:100px; max-width:1400px;}

}

@media all and (min-width:1640px) {
.subwrap .pdinner{padding-right:20px}
.bmb{margin-bottom:120px !important}
}



/*owl 컨트롤러 css변경*/
.owl-controls{width:100%; margin:0 auto;}

/*owl pagenation css변경 */
.page_btn .owl-page span{width:20px !important; height:20px !important; background:none !important; border:4px solid #ffffff; border-radius:20px; opacity:0.7 }
.page_btn .owl-page.active span{opacity:1;}

.page_btn2 .owl-page span{width:5px !important; height:5px !important; background:#808080 !important; border-radius:20px; position:relative; opacity:1 !important; margin:0 20px !important;}
.page_btn2 .owl-page.active span:before{content:''; width:30px; height:30px; position:absolute; margin-left:-16px; left:50%; margin-top:-16px; top:50%; border:1px solid #808080; border-radius:200px;}

/*owl navigation css변경*/
.owl-theme .owl-controls{position:relative}
.arrow_btn .owl-buttons{position:absolute; width:100%; top:-250px;}
.arrow_btn .owl-buttons div{position:absolute; font-family:'FontAwesome'; text-indent:-999999px; background:none !important; padding:0px !important; margin:0px !important;}
.arrow_btn .owl-buttons div:first-child{left:2%;}
.arrow_btn .owl-buttons div:last-child{right:2%;}
.arrow_btn .owl-buttons div.owl-prev:after,
.arrow_btn .owl-buttons div.owl-next:after{content:'\f104'; font-family:'FontAwesome'; position:absolute; left:0; top:0; text-indent:0 !important; font-size:3em;}
.arrow_btn .owl-buttons div.owl-next:after{content:'\f105'; right:0; left:auto;}

.pop_page_btn{position:relative;}
.pop_page_btn .owl-controls{position:absolute; bottom:0px; text-align:right !important}
.pop_page_btn .owl-pagination{display:inline-block; padding:1px 10px; border-radius:500px; height:22px;}
.pop_page_btn .owl-controls .owl-page span{width:10px !important; height:10px !important; background:#505050 !important; margin:2px 4px !important}
.pop_page_btn .owl-controls .active span{background:#8c000a !important}

@media all and (min-width:1200px) {
.arrow_btn .owl-buttons div:first-child{left:-10%;}
.arrow_btn .owl-buttons div:last-child{right:-10%;}
.arrow_btn .owl-buttons div.owl-prev:after,
.arrow_btn .owl-buttons div.owl-next:after{font-size:50px;}
}



/* ==== Slider Image Transition === */
@-webkit-keyframes ProgressDots{from{width:0px;}to{width:100%;}}
@keyframes ProgressDots{from{width:0px;}to{width:100%;}}
@keyframes zoomout {	0% { transform: scale(1.1); }    100% {        transform: scale(1.0);    }}
@-webkit-keyframes zoomout {	0% { transform: scale(1.1); }    100% {        transform: scale(1.0);    }}
@-webkit-keyframes scaling {	From {    -webkit-transform: scale(1.1);}	To {    -webkit-transform: scale(1.0);}}


/* ==== Slick Slider Css Ruls === */
.slick-slider{position:relative;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent}
.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}
.slick-list:focus{outline:none}.slick-list.dragging{cursor:hand}
.slick-slider .slick-track,.slick-slider .slick-list{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.slick-track{position:relative;top:0;left:0;display:block}
.slick-track:before,.slick-track:after{display:table;content:''}.slick-track:after{clear:both}
.slick-loading .slick-track{visibility:hidden}
.slick-slide{display:none;float:left /* If RTL Make This Right */ ;height:100%;min-height:1px}
.slick-slide.dragging img{pointer-events:none}
.slick-initialized .slick-slide{display:block}
.slick-loading .slick-slide{visibility:hidden}
.slick-vertical .slick-slide{display:block;height:auto;/*border:1px solid transparent*/}



/* Arrows */
.slick-arrow{position: absolute;  top: 50%; z-index:100;  display: block;   width: 50px;   height: 50px; border:0;   cursor: pointer;  background:none; text-indent:-999999px;
/*	-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);*/}

.slick-arrow:before{text-indent:0; content:''; display:block; position:absolute; font-family:'LA Free'; width:100%; height:100%; line-height:50px; text-align:center; left:0; right:0; bottom:0; top:0;  margin:auto; font-weight:600 }
.slick-arrow:before{content:'\f060'; font-size:2em;}
.slick-next{right:0;}
.slick-next:before{content:'\f061'; }

/* Circle Arrows */
.cir-arrow .slick-arrow{position: absolute;  top: 50%; z-index:100;  display: block;   width: 50px;   height: 50px; border:0;   cursor: pointer;  background:none; border:2px solid #ffffff; border-radius:500px; text-indent:-999999px;
/*	-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);*/}

.cir-arrow .slick-arrow:before{text-indent:0; content:''; display:block; position:absolute; font-family:'FontAwesome'; width:20px; height:20px; line-height:20px; left:0; right:0; bottom:0; top:0;  margin:auto; font-weight:600 }
.cir-arrow .slick-arrow:before{content:'\f104'; font-size:22px; color:#ffffff}
.cir-arrow .slick-arrow.slick-next{right:0;}
.cir-arrow .slick-arrow.slick-next:before{content:'\f105'; }


/* rec Arrows */
.rec-arrow .slick-arrow{position: absolute;  top: 50%; z-index:100;  display: block;   width: 50px;   height: 50px; border:0;   cursor: pointer;  background:none; border:1px solid #ffffff; text-indent:-999999px;
/*	-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);*/}

.rec-arrow .slick-arrow:before{text-indent:0; content:''; display:block; position:absolute; font-family:'FontAwesome'; width:20px; height:20px; line-height:20px; left:0; right:0; bottom:0; top:0;  margin:auto; font-weight:600 }
.rec-arrow .slick-arrow:before{content:'\f104'; font-size:22px; color:#ffffff}
.rec-arrow .slick-arrow.slick-next{right:0;}
.rec-arrow .slick-arrow.slick-next:before{content:'\f105'; }



/*line-Dots*/
.slick-dots{position: absolute;    bottom: -15px;    display: block;    width: 100%;    padding: 0;    margin: 0;   text-align: center; z-index:10}
.slick-dots li{position: relative;  display: inline-block;  width: 10px;  height: 10px;  margin: 0 5px;   padding: 0;   cursor: pointer;}
.slick-dots li button{ font-size: 0;   line-height: 0;  display: block;  width:100%; height:100%; border-radius:500px; background:#313131; cursor: pointer;  color: transparent;  border: 0;  outline: none;  opacity:0.8}
.slick-dots li.slick-active button{background:#a98b7c; opacity:1}


/*pop_dot*/
.pop_dot .slick-dots{position: absolute;    bottom: 10%;  right:20px; display: inline-block; padding: 5px; line-height:100%;  width:auto; background:rgba(0,0,0,0.5); text-align: center; z-index:10}
.pop_dot .slick-dots li{position: relative;  display: inline-block;  width: 13px;  height: 13px;  margin: 0 5px;  padding: 0;   cursor: pointer; vertical-align:middle;}
.pop_dot .slick-dots li button{ font-size: 0;   line-height: 0;  display: block;  width: 100%;  height: 100%; border-radius:500px;  cursor: pointer;  color: transparent;  border: 0;  outline: none;  background:none; background:#ffffff; opacity:0.5}
.pop_dot .slick-dots li.slick-active button{background:#fcc754; opacity:1}



/*slick_circle_arrow*/

.slick_circle_arrow button{position:absolute; top:auto; bottom:10px; right:20px; background:none; border:1px solid #ffffff; border-radius:500px; border-color:rgba(255,255,255,0.5)}
.slick_circle_arrow button:before{color:#ffffff;}
.slick_circle_arrow button.slick-prev{margin-right:60px}


/**/
.wrap{max-width:2000px; min-width:320px; width:100%; margin: 0 auto; position:relative;  }

.mainvisual {position:relative; overflow:hidden; z-index:0; }
.mainvisual h1.tit{height:0;opacity:0}

#scroll_down{width:50px; height:50px; background:#23b14d; position:absolute; bottom:30px; left:0; right:0; margin:auto; z-index:1000;
-webkit-box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.5);
box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.5);}

#scroll_down a{display:block; width:100%; height:100%; position:relative; text-align:center}
#scroll_down a img{max-width:45px; -webkit-animation:text-pop-up-bottom 1.5s cubic-bezier(.25,.46,.45,.94) infinite both;animation:text-pop-up-bottom 1.5s cubic-bezier(.25,.46,.45,.94) infinite both}
/*.heartbeat{-webkit-animation:heartbeat 1.5s ease-in-out infinite both;animation:heartbeat 1.5s ease-in-out infinite both}*/
.jello-vertical{-webkit-animation:jello-vertical .9s both;animation:jello-vertical .9s both}
.btn_bike{max-width:45px;}


/*비주얼*/
.visusliderWrap{position:relative; }

.visuslider{background:#ffffff}
.visuslider .visu{position:relative; height:100vh; min-height:600px; max-height:700px; z-index:2}
/*.visuslider .visu:after{content:''; width:100%; position:absolute; top:0; left:0; right:0; height:100%; background:linear-gradient(180deg, rgba(62,61,60,0.5) 0%, rgba(62,61,60, 0.3) 60%, rgba(62,61,60, 0.0) 100%); z-index:3}검은레이어*/
.visuslider .visu:after{content:''; width:100%; position:absolute; top:0; left:0; right:0; height:100%; background:linear-gradient(180deg, rgba(255,255,255,0.85) 0%, rgba(255,255,255, 0.3) 60%, rgba(255,255,255, 0.0) 100%); z-index:3}/*화이트레이어*/
.main_video .visu:after{content:''; width:100%; position:absolute; top:0; left:0; right:0; height:100%; background:rgba(0,0,0,0.2); z-index:3}/*검은레이어*/

.visuslider .visu:before{content:''; position:absolute; background:#004098; background:rgba(0,64,152,0.9); left:0; right:0; top:0; bottom:0; width:100%;  bottom:0; z-index:1; }

.visuslider .visu:before{content:''; display:block; position:absolute; left:0; top:0; bottom:0; right:0; margin:auto; background-size:cover !Important;}
.visuslider .visu.slick-active:before{animation: zoomout 0.5s ease-in-out infinite alternate;    -webkit-animation: zoomout 0.5s ease-in-out infinite alternate; animation-iteration-count:1; 	-webkit-animation-iteration-count:1;}
.visuslider .visu.visu01:before{background:url(../img/main01.jpg) no-repeat center center;}
.visuslider .visu.visu02:before{background:url(../img/main02.jpg) no-repeat center center;}
.visuslider .visu.visu03:before{background:url(../img/main03.jpg) no-repeat center center;}
.visuslider .visu.visu04:before{background:url(../img/main04.jpg) no-repeat center center;}
.visuslider .visu.visu05:before{background:url(../img/main05.jpg) no-repeat center center;}

.visuslider .visu .txt{  bottom:280px; width:100%; padding:0 4%;  position:absolute; z-index:5; text-align:center;} /*텍스트글자*/
.visuslider .visu .txt h2{font-size:2.6em; margin-bottom:20px; text-align:center; line-height:1.15}
.main_video .visu .txt h2,
.main_video .visu .txt p{color:#ffffff}
.visuslider .visu .txt h2 span.tit{display:block}
.visuslider .visu .txt h2 span.mark{font-size:0.7em; display:inline-block; position:relative; padding-left:50px;}
.visuslider .visu .txt h2 span.mark:before{content:''; position:absolute; left:0; top:0; bottom:0; width:30px; height:30px; margin:auto; background:url(../img/mark.png) no-repeat center center; background-size:100% !important}
.main_video .visu .txt h2 span.mark:before{content:''; position:absolute; left:0; top:0; bottom:0; width:30px; height:30px; margin:auto; background:url(../img/mark_w.png) no-repeat center center; background-size:100% !important}
.visuslider .visu .txt img{width:100%; max-width:750px; }
.visuslider .slick-dots{top:0; background:rgba(255,255,255,0.5); height:3px;width:100%;}
.visuslider .slick-dots li{ float:left;  width:0px;  height:3px;  background:#a98b7c;  position:absolute;  left:0px;  bottom:0px; margin:0;}
.visuslider .slick-dots button{display:none}

.visuslider .slick-dots li.slick-active{
  width:100%;
  -webkit-animation:ProgressDots 4.2s both;
          animation:ProgressDots 4.2s both;
}

.visuslider .video_con{position:absolute;  height:100%;  z-index:1;  left:50%; top:50%; transform:translate(-50%,-50%)}

@media all and (min-width:620px) {
.visuslider .visu .txt img{width:70%; }

}
/*비주얼 arrow/num */

.visu_dot{width:94%; left:0; right:0; margin:0 auto; bottom:150px; position:absolute; text-align:center; font-size:0.9em }

.visu_dot p{display:inline-block; vertical-align:middle; letter-spacing:5px; position:relative}
.visu_dot p:after{content:''; display:inline-block; vertical-align:middle; margin:0 20px; width:20px; height:2px; background:#323232; }
.visu_dot .visu-nav{display:inline-block; vertical-align:middle;}
.visu_dot .visu-nav .slick-track{width:100% !important}
.visu_dot .slick-slide{display:inline-block !important; float:none; width:auto !important; padding:0 5px; cursor:pointer; letter-spacing:1px}



/*비주얼 변곡점*/


@media all and (min-width:768px) {

.visusliderWrap{position:relative;}
.visuslider .visu{height:800px; min-height:800px;}

.visuslider .visu .txt h2{text-align:left; font-size:4em}
.visuslider .visu .txt h2 span.mark{padding-left:80px}
.visuslider .visu .txt h2 span.mark:before {width:60px; height:60px;}
.visuslider .visu .txt p{text-align:left; font-size:1.1em}
}

@media all and (min-width:1200px) {
#section00{position:relative}
.visu_dot{bottom:200px}

.visuslider .visu{height:100vh; min-height:900px; max-height:1024px;}

.visuslider .visu .txt{text-align:left; width:90%;  padding:0; top:auto; bottom:280px; max-width:1400px; left:0; right:0; margin:0 auto; }
.visuslider .visu .txt h2{font-size:6em; line-height:1.1; margin-bottom:40px}
.visuslider .visu .txt p{font-size:1.3em; }
.visu_dot{text-align:right; margin-right:170px; max-width:1400px;}
.visu_dot .slick-slide{padding:0 10px}

.visuslider .video_con{width:auto; height:auto}
}
@media all and (min-width:1400px) {
.visuslider .video_con{width:107%; height:auto}
}



/*공지사항*/
#noticebox {position:absolute; width:100%; bottom:0; z-index:5 }
#noticebox .inner{overflow:hidden; padding:30px 3%; color:#ffffff;  background-color: rgba(169,139,124,  0.5);
    -webkit-backdrop-filter: blur(14px);
            backdrop-filter: blur(14px); }
#noticebox .inner a{color:#ffffff}

.news_li{position:relative; overflow:hidden; }

.news_li:after{content:''; position:absolute; right:0; top:0; bottom:0; margin:auto; background:url(../img/ic_arrow.png) no-repeat center center; width:20px; height:20px; background-size:100% !important;}
.news_li h3{display:block; width:65px; margin-right:15px;  color:#323232;  letter-spacing:1px; float:left; position:relative; font-size:0.9em; font-weight:600}
/*.news_li h3:after{position:absolute; content:''; width:1px; height:10px; top:0; bottom:0; right:0; margin:auto;  background:#c8c8c8; opacity:0.5}*/
.news_li ul{display:block; overflow:hidden; width: calc(100% - 80px); right:0;}
.news_li ul li{overflow:hidden}
.news_li ul li a{width: calc(100% - 70px); float:left; display:block; text-overflow: ellipsis; overflow:hidden; white-space:nowrap;}
.news_li ul li span.date{width:70px; float:left; text-align:right; font-size:0.8em; }
.news_li ul li a{color:#323232}

.recruit_li{margin-top:7px;} 




@media all and (min-width:768px) {
#noticebox .inner{padding:30px 5%;}

}


@media all and (min-width:1200px) {
#noticebox{border-top:1px solid #e6e6e6; border-color:rgba(255,255,255,0.3);  }
#noticebox .inner{padding:26px 60px; width:40%;margin:0; }

}



/*section 공통*/
.section{padding:60px 0; position:relative; }
.section .stit{font-weight:700; }
.section .section_top{text-align:center; position:relative}
.section .section_top .tit{font-size:1.6em;}
.section .section_top .txt{font-size:1.2em}
.line_li{text-align:center;}
.line_li li{display:inline-block; font-size:0.9em; padding:0px 15px; line-height:50px; vertical-align:middle; margin:0 2px; border:1px solid #e6e6e6; border-radius:500px}
.line_li li a{display:block;}

a.btn_arr{color:#000000; font-weight:500}
a.btn_arr:after{content:''; display:inline-block; margin-left:5px; vertical-align:middle; width:16px; height:16px; background:url(../img/btn_arr.png) no-repeat center center; background-size:100% !important}

a.btn_txt{display:inline-block; padding:12px 25px; border:1px solid #505050; text-align:center; margin:0 auto; position:relative;  transition:0.3s}
a.btn_txt span{position:relative;}
a.btn_txt:before{content:''; display:block; position:absolute; z-index:0; bottom:0; top:0; left:0px; width:100%; height:100%; background:#303030; transform: scaleX(0); transform-origin: left; transition: .1s ease-in;}
a.btn_txt:hover:before{transform:scaleX(1); transition: .3s ease-out;}
a.btn_txt:hover{color:#ffffff; transition:0.3s}

.comm_btn{line-height:50px; position:relative; display:inline-block; padding:0 30px; font-size:0.9em; font-weight:600;}
.comm_btn:hover{color:#a98b7c;}
.comm_btn:after{content:''; width:100%; height:2px; background:#161616; position:absolute; left:0; right:0;  bottom:0; z-index:0}
.comm_btn:before{content:''; display:block; position:absolute; z-index:1;   bottom:0;  left:0;  width:100%;  height:3px; background:#a98b7c;  transform: scaleX(0);  transform-origin: left; transition: .1s ease-in; }
.comm_btn:hover:before{transform: scaleX(1); transition: .3s ease-out; }

.more_btn{position:relative; display:flex; justify-content:space-between; width:100px;  font-weight:600}
.more_btn span{display:inline-block; }
.more_btn i{display:inline-block;}
.more_btn i:before{font-family:'LA Free'; content:'\f061'; font-size:2em }
.more_btn,
.more_btn span,
.more_btn i,
.more_btn i:before{line-height:50px; height:50px}

@media all and (min-width:768px) {
.section .section_top .tit{font-size:2.4em}
.section .section_top .txt{font-size:1.4em}
.section .stit{font-size:1.2em}
.section{padding:100px 0;}

.comm_btn{line-height:60px; padding:0 50px}
}

@media all and (min-width:1024px) {
.section .section_top .tit{font-size:3em; }

}

@media all and (min-width:1200px) {


.section{padding:120px 0;}

.line_li li{padding:0 20px}

.comm_btn{line-height:80px; padding:0 50px}
.more_btn{width:150px}

}

@media all and (min-width:1400px) {
.section{padding:130px 0;}
.section .section_top .tit{font-size:4em; line-height:1.2}
.section .section_top p{font-size:1.1em}
}

#section01{position:relative;}
#section01 .section_top{border-bottom:1px solid #e6e6e6; position:relative; z-index:2}
#section01:before{position:absolute; bottom:0; left:0; right:0; height:1px; width:100%; background:#e6e6e6 }
#section01 .section01_img{padding:0 5%;  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  align-content: space-around; max-width:640px; margin:0 auto;}
#section01 .section01_img .box{border-radius:500px; overflow:hidden; width:48%;  position:relative; z-index:5}
#section01 .section01_img .center_img{max-width:1500px; margin:0 auto; width:100%; position:relative; opacity:0.2; margin-top:40px; display:none}
#section01 .section01_img .left_img{margin-top:-50px}
#section01 .section01_img .right_img{margin-top:50px}

@media all and (min-width:640px) {

}


@media all and (min-width:1024px) {
#section01 .section01_img{ margin-top:-400px;}
#section01 .section01_img{max-width:100%}
#section01 .section01_img .box{  width:25%;}

}

@media all and (min-width:1200px) {
#section01{padding:150px 0 0; margin-right:80px}
#section01 .section01_img{padding:0 20px; max-width:1650px; position:relative; margin:0 auto; margin-top:-340px;}
#section01 .section01_img .box:hover img{transform:scale(1.1); transition:0.5s;}
#section01 .section01_img .box img{transition:0.5s;}
#section01 .section01_img .center_img{margin-top:-40px; z-index:5}
}



@media all and (min-width:1620px) {

#section01{padding:200px 0 0; margin-right:00px}
#section01 .section01_img{margin-top:-540px}
#section01 .section01_img .box{max-width:430px;}
#section01 .section01_img .left_img{margin-top:-300px}
#section01 .section01_img .right_img{margin-top:100px}
#section01 .section01_img .center_img{margin-top:-80px;}

}



#section02{position:relative}
#section02:before{content:''; width:100%; height:1px; position:absolute; left:0; top:255px; background:#e6e6e6}
#section02 .stit{position:absolute;left:3%; top:-40px; writing-mode:sideways-lr}
#section02 .business_slider{max-width:620px; margin:0 auto;}
#section02 .business_slider .slick-dots{bottom:0;}

#section02 .business_slider .slick-arrow{top:-50px;}
#section02 .business_slider .slick-prev{right:50px;}
#section02 .business_slider .slick-list{padding-bottom:30px}
#section02 .business .section_top{margin-bottom:100px}
#section02 .business .img_box{ background-size:cover !important; position:relative; }
#section02 .business .img_box:before{content:''; width:50%; height:40%; position:absolute; z-index:0; background:#f8f8f8; border-radius:0 50px 50px 0; bottom:-10%; right:0; margin:auto}
#section02 .business .img_box:after{content:''; width:90%; height:70%; position:absolute; z-index:1; background:#323232; border-radius:50px 0 0 0; bottom:5%; left:0; margin:auto}
#section02 .business .img_box img{display:block; width:60%; margin:0 auto; position:relative; z-index:2; -webkit-box-shadow: 0px 0px 30px -5px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 30px -5px rgba(0,0,0,0.3);
box-shadow: 0px 0px 30px -5px rgba(0,0,0,0.3);  }


#section02 .busi01 .img_box:after{background:url(../img/busi01_bg.jpg) no-repeat center center}
#section02 .busi02 .img_box:after{background:url(../img/busi02_bg.jpg) no-repeat center center}
#section02 .busi03 .img_box:after{background:url(../img/busi03_bg.jpg) no-repeat center center}

@media all and (min-width:768px) {
#section02:before{top:355px;}
}

@media all and (min-width:1024px) {
#section02:before{top:370px;}
}



@media all and (min-width:1200px) {
#section02 {padding-bottom:200px; padding-top:50px}
#section02 .stit{left:0; top:0px; z-index:5}
#section02:before{top:50%; margin-top:85px; width:50%}

#section02 .business_slider .slick-list{padding:50px 0px}
#section02 .business_slider .slick-arrow{top:50px; right:80px}
#section02 .business_slider .slick-prev{right:110px;}
#section02 .business_slider .slick-arrow:before{font-size:3em}

#section02 .business_slider{max-width:100%}
#section02 .business{display:flex; flex-wrap:wrap; align-items:center; margin-right:80px}
#section02 .business .section_top{width:50%;  text-align:left; padding-left:3%;  margin-bottom:0}
#section02 .business .section_top p{font-size:1.1em}

#section02 .business .comm_btn{padding:0 100px 0 0}
#section02 .business .img_box{width:50%}
#section02 .business .img_box img{margin:0; margin-left:-75%; left:50%;}

#section02 .business .img_box:before{display:none}
#section02 .business .img_box:after{ margin:0; left:5%;  height:90%; bottom:-10%}

#section02 .business_slider .slick-dots{text-align:left; padding-left:3%}
}

@media all and (min-width:1400px) {

}

@media all and (min-width:1640px) {
#section02 .business{margin-right:0}
#section02 .business .img_box:after{ width:95%}
#section02 .business_slider .slick-arrow{top:90px; right:0px}
#section02 .business_slider .slick-prev{right:80px;}

}


/*section03*/
#section03{position:relative; overflow:hidden; background:#3f3a39; padding-bottom:0; color:#ffffff}
#section03 .pdinner {max-width:1500px; }
#section03:after,
#notice:after {content:''; clear:both; display:block;}
#section03 .section_top{margin-bottom:20px; color:#ffffff; text-align:left;}
#section03 .section_top .tit{margin-bottom:30px}
/*#section03 .stit{position:absolute;left:-3%; top:0px; writing-mode:sideways-lr}*/



#m_product li {position:relative; margin:0 10px}
#m_product li .photo{overflow:hidden; border-radius:500px; background:#494443}
#m_product li .photo img {position:relative; transition: transform 0.5s ease; /*max-width:350px;*/ width:100%} 
#m_product li:hover .photo img {transform: scale(1.1);}
#m_product li .photo span {color:#fff; position:absolute;width:60px; height:60px; top:20px; right:20px;  background:#b59d6e; border-radius:500px; line-height:59px; text-align:center}
#m_product li .info { position:relative; padding:20px 0px 30px; position:relative}


#m_product li .info dt {position:relative; font-size:1.2em; font-weight:600; overflow: hidden;}
#m_product li .info dt  span{font-size:0.8em; font-weight:400}
#m_product li .info dd{font-size:0.8em; position:relative}
#m_product li .info dd.tag{margin-top:10px}
#m_product li .info dd.tag i{display:inline-block; line-height:28px; padding:0 15px;  border:1px solid #ffffff; border-radius:500px}


#m_product .slick-arrow:before{color:#ffffff;}
#m_product .slick-arrow {top:-30px;}
#m_product .slick-prev {right:50px;}
#m_product .slick-dots li { margin:0 5px}




@media all and (min-width:768px) {
#m_product .slick-arrow{top:-110px}
#m_product li {margin:0 20px }

}

@media all and (min-width:1200px) {


#section03 .pdinner{margin-right:80px}

#m_product li .info { position:relative; padding:25px 20px;}

#m_product li .info dd.tag{margin-top:10px}

#m_product .slick-arrow{right:0; top:-100px; background:none}
#m_product .slick-arrow:before{font-size:3em}
#m_product .slick-arrow.slick-prev{right:80px}

#m_product li{margin:0 15px;  transition:0.3s; opacity:0.3; }

#m_product .slick-arrow{top:-130px}
#m_product li.slick-active{opacity:1}
#m_product li.slick-current .info dt{font-size:1.3em}
#m_product li.slick-current{margin-top:-40px;  transition:0.3s}
#m_product li.slick-current .info{font-size:1.05em; }
#m_product .slick-list{overflow:visible; }

}

@media all and (min-width:1400px) {

}


@media all and (min-width:1640px) {
#section03 .pdinner{margin:0 auto}


}



/*관련배너*/
.related_banner{padding:50px 0px; border-top:1px solid #e6e6e6; border-color:rgba(255,255,255,0.3); position:relative}
.related_banner h3{font-size:1.2em;  color:#ffffff; margin-bottom:10px;  text-align:center; display:inline-block; position:absolute; width:180px;left:50%; margin-left:-90px; top:-15px}
.related_banner h3 span{position:relative; z-index:1; opacity:0.3;}
.related_banner h3:before{content:''; width:100%; height:100%;position:absolute; background:#3f3a39; z-index:0; left:0; right:0;}
.related_banner li{text-align:center; margin:0 5px; opacity:0.3}
.related_banner .slick-dots{right:0; top:-30px; text-align:right}
.related_banner .slick-arrow{background:none; width:30px; height:30px; left:auto; top:-35px; }
.related_banner .slick-arrow.slick-prev{right:60px}

@media all and (min-width:768px) {
.related_banner{padding:50px 0px; }
}

@media all and (min-width:1200px) {
.related_banner h3{width:220px; margin-left:-110px}
.related_banner{padding:80px 0px}
.related_banner:after{content:''; clear:both; display:block}

.related_banner .slick-arrow{top:auto; left:-110px; bottom:0;}
.related_banner .slick-arrow.slick-prev{right:auto; left:-160px}
.related_banner img{height:50px;}
}




/*section04*/
#section04{border-bottom:1px solid #e6e6e6}
#section04 .section_top {position:relative; text-align:left; display:flex; justify-content:space-between; align-items:center}

.news_box{position:relative; }
.news_box .photo{overflow:hidden; padding-bottom:60%; position:relative;}
.news_box .photo img {position:relative; transition: transform 0.5s ease; /*max-width:350px;*/ width:100%; position:absolute; left:0; right:0; top:0; bottom:0;} 
.news_box:hover .photo img {transform: scale(1.1);}
.news_box dl{position:relative; background:#fff; padding:20px 0px}
.news_box dl dt {margin-bottom:20px; font-weight:600; font-size:1.2em; word-break:break-all;}
.news_box dl dd{}
.news_box .info dd.date{display:block;  font-size:0.9em; }

@media all and (min-width:540px) {

.news_list .news_box{margin:0 5px }
}


@media all and (min-width:768px) {
.news_list .news_box{margin:0 10px }
}



@media all and (min-width:1200px) {

#section04 .pdinner{margin-right:80px; max-width:1400px}
#section04 .section_top{padding:0 20px}
.news_list .news_box{margin:0 20px }

}

@media all and (min-width:1640px) {
#section04 .pdinner{margin:0 auto}

}


/*section05*/
#section05{overflow:hidden}
#section05:before{content:''; width:300px; height:300px; position:absolute; z-index:0; top:10px; right:-70px; background:url(../img/network_deco.png) no-repeat center center; background-size:100% !important; -webkit-animation:rotate-center 80s ease-in-out infinite both;animation:rotate-center 80s ease-in-out infinite both}



#section05 .section_top{text-align:left; position:relative; z-index:1;}
.network_box{position:relative; z-index:1;}
.network_box .photo{overflow:hidden; padding-bottom:60%; position:relative;}
.network_box .photo img {position:relative; transition: transform 0.5s ease; /*max-width:350px;*/ width:100%; position:absolute; left:0; right:0; top:0; bottom:0;} 
.network_box:hover .photo img {transform: scale(1.1);}
.network_box span{position:relative; display:block; padding:20px 0px; display:flex; align-items:center; font-weight:600; text-transform:uppercase}
.network_box span i{display:inline-block; width:30px; height:20px; margin-right:15px; background:#f0f0f0; border:1px solid #e6e6e6; background-size:100% !important}
.network_box span i.icon_russia{background:url(../img/icon_russia.jpg) no-repeat center center}
.network_box span i.icon_kyrgyzstan{background:url(../img/icon_kyrgyzstan.jpg) no-repeat center center}

.network_list .slick-arrow{top:auto; bottom:10px;}
.network_list .slick-prev{right:50px}

@media all and (min-width:540px) {

.network_list .slick-arrow{bottom:auto; top:-100px;}

.network_list .network_box{margin:0 5px }
}


@media all and (min-width:768px) {
#section05:before{width:500px; height:500px}
.network_list .network_box{margin:0 10px }
}


@media all and (min-width:1200px) {
#section05:before{width:800px; height:800px; right:80px}
#section05 .pdinner{margin-right:80px; max-width:1400px}
#section05 .section_top{padding:0 20px}
.network_list .network_box{margin:0 20px }

.network_list .slick-arrow{ top:-120px; }
.network_list .slick-arrow:before{font-size:3em}
.network_list .slick-prev{right:80px}
}


@media all and (min-width:1640px) {
#section05 .pdinner{margin:0 auto}

}


@-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

/*footer*/
#footer{background:#252525;  color:#aaaaaa; font-size:0.9em;padding:50px 0px 20px;}

#footer .pdinner,
#footer .inner{max-width:1500px}
/*#footer div{background:url(../img/foot_logo.png) no-repeat right center;}*/

#footer .foot_li{margin-bottom:20px; overflow:hidden; text-align:left; clear:both;  }
#footer .foot_li li{display:inline-block; margin-right:20px}
#footer .foot_li li a{display:block; line-height:25px; font-weight:600; text-transform:uppercase}

#footer p{font-size:0.8em; clear:both; text-transform:uppercase }
#footer p b{font-weight:bold; color:#928c74}

#footer address{padding-bottom:3px;}
#footer:after{display:block; content:''; clear:both;}

.footinfo{position:relative; overflow:hidden}
.footinfo .box{padding-bottom:50px; border-color:rgba(255,255,255,0.2); text-align:left; }
.footinfo .box h4{font-size:1.6em; font-weight:500; margin-bottom:10px; vertical-align:bottom}
.footinfo .box h4 span{font-size:0.6em; margin-left:15px; display:inline-block;}
.footinfo .box ul li{display:inline-block; margin-right:10px;}
.copy{border-top:1px solid #dcdcdc; border-color:rgba(255,255,255,0.2); padding-top:20px; letter-spacing:0;}


@media all and (min-width:768px) {

#footer{font-size:0.9em}
#footer .inner{padding:0 5%;}
#footer .inner:after{content:''; clear:both; display:block}

#footer{padding:50px 0px 30px}

#footer{text-align:left;}


#footer .dropbtn{padding:0 30px 0 20px; line-height:60px}
#footer .dropdown ul li{padding:0px 20px; }
#footer .dropdown{min-width:200px; border-bottom:0; border-right:1px solid #dcdcdc;border-color:rgba(255,255,255,0.2); }
#footer .dropdown.deph02{min-width:200px}
#footer .dropmenu a{line-height:40px;}
#footer .dropbtn:after{right:15px}


.footinfo .box h4{font-size:2.2em; margin-bottom:20px}
.copy{padding-top:30px}
}

@media all and (min-width:1200px) {
#footer{padding:80px 0px 30px}

#footer .dropdown.deph02{min-width:250px}
#footer .inner{padding:0 20px;}

.footinfo .box h4{font-size:2.4em}
.footinfo .box{width:50%; float:left;}
.footinfo .box{ padding:50px 0;}
.footinfo:after{content:''; display:block; position:absolute; width:180px; background:url(../img/logo_bottom.png) no-repeat center center; background-size:100% !Important; right:110px; top:0; bottom:0; margin:auto; opacity:0.3}
}


/*page up*/
#pageup {position:fixed; z-index:999; right:1%; bottom:1%; width:50px; height:50px; background:#222222 url('../img/Htop.png') no-repeat center center; background-size: 50px 50px; display:block; cursor:pointer; z-index:4000; border-radius:500px}

@media all and (min-width:1200px) {
#pageup{right:130px; border-radius:0px}
#pageup {right:0; width:79px; height:79px; bottom:0px; transition:0.3s}
body.scroll #pageup{bottom:0; transition:0.3s}
}


/*키프레임셋팅*/

@keyframes zoomout {
	0% { transform: scale(1.05); }
    100% {        transform: scale(1.0);    }
}
@-webkit-keyframes scaling {
	From {    -webkit-transform: scale(1.05);}
	To {    -webkit-transform: scale(1.0);}
}

@-webkit-keyframes bounce-top{0%{-webkit-transform:translateY(-30px);transform:translateY(-30px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:1}24%{opacity:1}40%{-webkit-transform:translateY(-15px);transform:translateY(-15px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}65%{-webkit-transform:translateY(-3px);transform:translateY(-3px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}82%{-webkit-transform:translateY(-0px);transform:translateY(-0px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}93%{-webkit-transform:translateY(-4px);transform:translateY(-4px);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}25%,55%,75%,87%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;opacity:1}}
@-webkit-keyframes scale-up-center{0%{-webkit-transform:scale(.5);transform:scale(.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes scale-up-center{0%{-webkit-transform:scale(.5);transform:scale(.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}
@-webkit-keyframes kenburns-top{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0);-webkit-transform-origin:50% 16%;transform-origin:50% 16%}100%{-webkit-transform:scale(1.05) translateY(-15px);transform:scale(1.05) translateY(-15px);-webkit-transform-origin:top;transform-origin:top}}@keyframes kenburns-top{0%{-webkit-transform:scale(1) translateY(0);transform:scale(1) translateY(0);-webkit-transform-origin:50% 16%;transform-origin:50% 16%}100%{-webkit-transform:scale(1.05) translateY(-15px);transform:scale(1.05) translateY(-15px);-webkit-transform-origin:top;transform-origin:top}}



.bounce-top:hover a:before{-webkit-animation:bounce-top .9s both;animation:bounce-top .9s both}
/*.kenburns-top{-webkit-animation:kenburns-top 10s ease-out both;animation:kenburns-top 10s ease-out both}*/
.zmout{animation: zoomout 5s ease-in-out infinite alternate;    -webkit-animation: zoomout 5s ease-in-out infinite alternate; animation-iteration-count:1; 	-webkit-animation-iteration-count:1; }
@-webkit-keyframes text-pop-up-top
{0%{-webkit-transform:translateY(0);transform:translateY(0);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
100%{-webkit-transform:translateY(-10px);transform:translateY(-10px);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}}
@keyframes text-pop-up-top{0%{-webkit-transform:translateY(0);transform:translateY(0);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
100%{-webkit-transform:translateY(-10px);transform:translateY(-10px);
-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}}


@-webkit-keyframes kenburns-top {
  0% {
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
            transform-origin: 50% 16%;
  }
  50% {
    -webkit-transform: scale(1.1) translateY(-15px);
            transform: scale(1.1) translateY(-15px);
    -webkit-transform-origin: top;
            transform-origin: top;
  }
   100% {
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
            transform-origin: 50% 16%;
  }


}


@keyframes kenburns-top {
 0% {
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
            transform-origin: 50% 16%;
  }
  50% {
    -webkit-transform: scale(1.25) translateY(-15px);
            transform: scale(1.25) translateY(-15px);
    -webkit-transform-origin: top;
            transform-origin: top;
  }
   100% {
    -webkit-transform: scale(1) translateY(0);
            transform: scale(1) translateY(0);
    -webkit-transform-origin: 50% 16%;
            transform-origin: 50% 16%;
  }


}


@-webkit-keyframes rotation {
	0% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	50% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	100% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
}
@keyframes rotation{

	0% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	50% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	100% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
}



@-webkit-keyframes rotation2 {
	0% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
	50% {
		-webkit-transform: rotate(-5deg);
		-o-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
	100% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
}
@keyframes rotation2{

	0% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
	50% {
		-webkit-transform: rotate(-5deg);
		-o-transform: rotate(-5deg);
		transform: rotate(-5deg);
	}
	100% {
		-webkit-transform: rotate(5deg);
		-o-transform: rotate(5deg);
		transform: rotate(5deg);
	}
}




@-webkit-keyframes rotation3 {
	0% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	50% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	100% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
}
@keyframes rotation3{

	0% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	50% {
		-webkit-transform: rotate(10deg);
		-o-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	100% {
		-webkit-transform: rotate(-10deg);
		-o-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
}

.vibrate-1{-webkit-animation:vibrate-1 3s linear infinite both;animation:vibrate-1 3s linear infinite both}
@-webkit-keyframes vibrate-1 {
0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
 
  25% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  50% {
    -webkit-transform: translate(0px, -8px);
            transform: translate(0px, -8px);
  }

  75% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@keyframes vibrate-1 {
  0% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
 
  25% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  50% {
    -webkit-transform: translate(0px, -8px);
            transform: translate(0px, -8px);
  }

  75% {
    -webkit-transform: translate(0px, 4px);
            transform: translate(0px, 4px);
  }
  100% {
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}







/*서브레이아웃*/
#sub_visual{position:relative; background:#fff8f8 url(../img/sub_visual01.jpg) no-repeat center top; background-attachment:fixed }
/*#sub_visual:after{content:''; width:100%; position:absolute; top:0; left:0; right:0; height:100%; background:linear-gradient(180deg, rgba(255,255,255,0.85) 0%, rgba(255,255,255, 0.3) 60%, rgba(255,255,255, 0.0) 100%); z-index:0}/*화이트레이어*/
#sub_visual .pdinner{z-index:1; height:150px; text-align:center; text-align:center; justify-content:center; align-items:end; display:flex; flex-wrap:wrap}
#sub_visual .tit_h2{letter-spacing:0; margin-bottom:-20px}
#sub_visual .tit_h2 span{display:block; }
#sub_visual .tit_h2 span:last-child{font-size:1.6em}

#sub_visual.sub01{ background:url(../img/sub_visual01.jpg) no-repeat center center; }
#sub_visual.sub02{ background:url(../img/sub_visual02.jpg) no-repeat center center; }
#sub_visual.sub03{ background:none}
/*#sub_visual.sub03{ background:url(../img/sub_visual03.jpg) no-repeat center center; }*/
#sub_visual.sub04{ background:url(../img/sub_visual04.jpg) no-repeat center center; background:none}
#sub_visual.sub05{ background:url(../img/sub_visual05.jpg) no-repeat center center; background:none}
#sub_visual.sub06{ background:url(../img/sub_visual06.jpg) no-repeat center center; }
/*
#sub_visual.sub010{ background:url(../img/sub_visual10.jpg) no-repeat center center; }
#sub_visual.sub011{ background:url(../img/sub_visual10.jpg) no-repeat center center; }*/

#sub_visual{}
#sub_visual .tit_h2{letter-spacing:0}

.path{display:block; text-align:center; margin-bottom:60px}
.path li{font-size:12px; display:inline-block; vertical-align:top; line-height:20px; vertical-align:middle}
.path li:first-child:before{font-family:'LA Free'; content:'\f015'; font-size:1.1em; line-height:20px; vertical-align:middle}
.path li:before{content:'\f105'; font-family:'LA Free'; display:inline-block; padding:0px 10px}

@media all and (min-width:380px) {
#sub_visual .tit_h2 span:last-child{font-size:1.8em}
}

@media all and (min-width:768px) {

.path{margin-bottom:80px}
.path li{font-size:14px}
#sub_visual .pdinner{height:250px}
/*
#sub_visual .pdinner:before{content:''; width:160px; height:160px; position:absolute; right:5%; bottom:0; opacity:0.2; background-size:100% !important; background:url(../img/mark_c.png) no-repeat center center}*/
#sub_visual .tit_h2{margin-bottom:-35px; font-size:2em;}

#sub_visual .tit_h2 span:after{position:absolute; right:0; top:0; margin:0}
}

@media all and (min-width:1200px) {
.path{position:absolute; right:100px; top:-140px; display:none}
#sub_visual .pdinner{height:400px; justify-content:start; max-width:1400px}
#sub_visual .tit_h2{font-size:2.5em; text-align:left; margin-bottom:-55px}
#sub_visual p{font-size:18px}

#sub_visual .pdinner:before{width:350px; height:350px; }


}

@media all and (min-width:1640px) {
.path{ right:20px; }

}


.subwrap{padding:40px 0}
.sub_tab{display:none}
.sub_con{margin: 0 auto; position:relative; max-width:1500px; min-height:500px; padding:40px 5% 60px;  }
.sub_con:after{content:''; clear:both; display:block}

@media all and (min-width:768px) {
.subwrap{padding:70px 0}

}

@media all and (min-width:1200px) {
.subwrap{padding:90px 0}


}

@media all and (min-width:1640px) {
.subwrap{padding:100px 0}


}


/*컬러패스*/
#sub_drop{position:relative; bottom:0; width:100%; left:0; right:0;  z-index:5; font-size:0.8em; display:flex; justify-content:end; display:none}
#sub_drop .pdinner{max-width:500px; width:100%}
#sub_drop .inner:after{content:''; display:block; clear:both}
#sub_drop .dropdown.home a{display:block; line-height:45px; width:20px;}
#sub_drop .dropdown.home a:after{font-family:'LA Free';  content:'\f015';  font-size:1.3em}
#sub_drop .dropdown.home{width:20px !Important; border:0px !Important}
#sub_drop .dropdown.home img{display:inline-block; vertical-align:middle; max-width:10px}
#sub_drop .dropdown{width:40%; float:left; position:relative;}
#sub_drop .dropdown.deph02{width:calc(57% - 20px); margin-left:3%}
#sub_drop .dropbtn {width:100%; text-align:left; display:inline-block; height:auto; position:relative; line-height:45px; padding:0 10px 0 7px; cursor:pointer; font-weight:600; }
#sub_drop .dropbtn:after{font-family:'LA Free'; content:'\f107'; position:absolute; right:0px; font-size:14px; top:0; bottom:0; margin:auto;  transition:0.3s; font-weight:600 }
#sub_drop .dropdown.active a.dropbtn:after{ -webkit-transform:rotate(180deg);
  -moz-transform:rotate(180deg);
  -ms-transform:rotate(180deg);
  -o-transform:rotate(180deg);
  transform:rotate(180deg)}

#sub_drop .dropdown ul{}
#sub_drop .dropdown ul li{ }
#sub_drop .dropmenu {display: none;  position: absolute;  z-index: 5; color:#ffffff;  box-sizing:content-box; left:0; top:40px; width:100%; text-align:center; padding:10px 0px; border-radius:10px;
background-color: rgba(190,149,129,  0.5);
    -webkit-backdrop-filter: blur(14px);
            backdrop-filter: blur(14px); 
			}
#sub_drop .dropmenu a{display:block; line-height:35px; font-weight:500 }
#sub_drop .dropmenu a:hover { font-weight:600;}
#sub_drop .dropdown > .dropmenu li{position:relative;}
#sub_drop .dropdown > .dropmenu li a{display: block;}
#sub_drop .dropdown > .dropmenu li dl{text-align:left; padding-left:15px}
#sub_drop .dropdown > .dropmenu li dl a{}
#sub_drop .dropdown > .dropmenu li dl dt a{line-height:35px;}
#sub_drop .dropdown > .dropmenu li dl dd a{line-height:30px; padding-left:10px; border-left: 1px solid #ffffff; border-color:rgba(255,255,255,0.3)}
#sub_drop .dropdown.active > .dropmenu {display:block;}

#sub_drop:after{display:block; content:''; clear:both;}

#sub_drop h3{padding:0 5%; font-size:2em;}
/*
@media all and (min-width:768px) {
#sub_drop .dropbtn{padding:0 25px 0 20px}
#sub_drop .dropdown ul li{padding:5px 20px; }
#sub_drop .dropdown{min-width:250px}
#sub_drop .dropdown.deph02{min-width:250px}
#sub_drop .dropmenu a{line-height:40px;}
#sub_drop .home a{line-height:60px; min-width:60px; text-align:center; padding:0 20px} 
#sub_drop .dropbtn {line-height:60px}
#sub_drop .dropbtn:after{right:15px}

}

@media all and (min-width:1200px) {
#sub_drop{display:block}
#sub_drop{font-size:1em;  background-color: rgba(169,139,124,  0.5);
    -webkit-backdrop-filter: blur(14px);
            backdrop-filter: blur(14px);  }
#sub_drop .inner{position:static}
#sub_drop .dropdown{position:static;}
#sub_drop .dropmenu{border:0px; background:#928c74; color:#ffffff}
#sub_drop .dropdown.active a.dropbtn,
#sub_drop .dropbtn.has-focus{background:#928c74; border:0px;}

#sub_drop .dropmenu a{color:#ffffff}
#sub_drop .dropmenu a:hover{color:inherit; text-decoration:underline}
#sub_drop .dropdown > .dropmenu li{display:inline-block; padding:0 20px;}
#sub_drop .dropdown > .dropmenu li a{line-height:65px;}
}
*/

@media all and (min-width:1200px) {
#sub_drop{display:block; max-width:1400px; margin:0 auto; display:flex; justify-content:end}
#sub_drop .pdinner{margin:0; margin-top:30px; margin-right:80px}

#sub_drop .dropbtn{padding:0 20px 0 10px}
#sub_drop .dropdown.home a{width:30px;}
#sub_drop .dropdown.home{width:30px !Important;}
#sub_drop .dropdown{width:35%; }
#sub_drop .dropdown.deph02{width:calc(62% - 30px); margin-left:3%}
}

@media all and (min-width:1640px) {
#sub_drop .pdinner{margin-right:0; }
}



#fl_menu{display:none;}
.con{position:relative; min-height:500px;}
.conh3{font-size:1.4em; font-weight:500; color:#000000; text-align:center; padding-bottom:20px; border-bottom:20px; position:relative}
.conh3:after{content:''; display:block; width:40px; height:1px; background:#323232; position:absolute; bottom:0; left:0; right:0; margin:auto}


/*패스메뉴
.dropbtn {background:none; width:100%; text-align:left; border:none; display:inline-block; height:auto; position:relative; color:#ffffff; font-size:12px;}
.dropbtn:after{font-family:'FontAwesome'; content:'\f078'; position:absolute; right:10px; color:#ffffff; font-size:8px; line-height:36px;}


.dropmenu {display: none; width:100%; position: absolute;  z-index: 5; border-width:0 1px 1px 1px; margin-top:-1px}
.dropmenu a {display:block; color:inherit; font-size:12px}
.dropmenu.show {display:block;}

.dropmenu ul{padding:10px; background:#1c3f95; }
.dropmenu ul li{padding:5px 0px; font-size:0.9em; cursor: pointer; color:#ffffff; text-align:left; line-height:32px;}
*/



@media all and (min-width:768px) {
.sub_con{padding:70px 20px}
.conh3{font-size:1.8em}



}

@media all and (min-width:1200px) {


.sub_tab{display:block;background:#0788c7; padding:10px 0px; text-align:right; color:#ffffff; font-size:0.85em; text-align:right;}
.sub_tab h3, .sub_tab p{display:inline-block; margin-left:15px; color:#fbdf40; font-weight:bold}
.sub_tab h3{color:#ffffff}
.sub_tab h3 span{margin-right:10px; text-transform:uppercase; color:#fbdf40}
.sub_tab p {border-radius:50px; background:#462e16; padding:5px 10px;}

#twodepthNav {position:relative; display:block; margin-top:-70px}
#twodepthNav ul.li02 li{width:25%;}


.sub_con{position:relative;  min-height:700px;  padding:90px 20px; padding-right:110px}

.con{width:1160px; margin:0 auto; min-height:800px;}
.conh3{font-size:2em; padding-bottom:30px}
}


@media all and (min-width:1640px) {
.sub_con{padding:120px 20px; }

}

@media all and (min-width:1640px) {
#sidemenu{display:block}
#fl_menu{display:block; position:absolute; right:20px; z-index:9999; width:125px; top:0px; height:600px}
#fl_menu .label{text-align:center; line-height:80px; font-size:18px; font-weight:bold; background:#29343f; color:#fff;}
#fl_menu ul {text-align:center; padding:10px 0px 30px; background:#ffffff}
#fl_menu ul li a{font-size:16px; font-weight:600; padding:8px 0px}
#fl_menu ul li span{display:block}
#fl_menu .menu{display:block; border:1px solid #dcdcdc}
#fl_menu .menu img{max-width:60px}
#fl_menu .menu .menu_item{display:block; background:#ffffff; color:#323232; }


}




/*텍스트효과*/

.motion01{animation-name:sub_tt;animation-duration:1000ms;animation-fill-mode:both;animation-delay:200ms;animation-timing-fonction:ease-out;}
.motion02{animation-name:sub_tt;animation-duration:1000ms;animation-fill-mode:both;animation-delay:200ms;animation-timing-fonction:ease-out;}

/* Chrome, Safari, Opera */ 
@-webkit-keyframes sub_tt { 
	0%   {top: 30px; opacity: 0;}
    100% {top: 0; opacity: 1;}
}
/* Standard syntax */
@keyframes sub_tt {
     0%   {top: 30px; opacity: 0;}
    100% {top: 0px; opacity:1;}
}
/* Chrome, Safari, Opera */ 
@-webkit-keyframes sub_tt {
    0%   {top: 30px; opacity: 0;}
    100% {top: 0; opacity: 0;}
}
/* Standard syntax */
@keyframes sub_tt {
     0%   {top: 30px; opacity: 0;}
    100% {top: 0px; opacity: 1;}
}



@-webkit-keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes heartbeat{from{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:center center;transform-origin:center center;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}10%{-webkit-transform:scale(.91);transform:scale(.91);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}17%{-webkit-transform:scale(.98);transform:scale(.98);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}33%{-webkit-transform:scale(.87);transform:scale(.87);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}45%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}
@-webkit-keyframes jello-vertical{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}40%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}50%{-webkit-transform:scale3d(.85,1.15,1);transform:scale3d(.85,1.15,1)}65%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}75%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes jello-vertical{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}40%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}50%{-webkit-transform:scale3d(.85,1.15,1);transform:scale3d(.85,1.15,1)}65%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}75%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}
@-webkit-keyframes text-pop-up-bottom{
	0%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;text-shadow:none}
	100%{-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
	}
@keyframes text-pop-up-bottom
	{0%{-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;text-shadow:none}
	100%{-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;}
	}

@media all and (max-width:1200px) {
#layerPopup0{top:100px !Important; left:0 !Important;}
#layerPopup1{top:435px !Important; left:0 !Important;}
#layerPopup2{top:770px !Important; left:0 !Important;}
#layerPopup3{top:1105px !Important; left:0 !Important;}
#layerPopup4{top:1440px !Important; left:0 !Important;}
#layerPopup5{top:1775px !Important; left:0 !Important;}
}