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

/*common*/
.inner{max-width:1500px; width:100%; position:relative; margin: 0 auto;}
.pdinner{max-width: 1400px;padding:0 3%;position:relative;margin: 0 auto;}
.ofh{overflow:hidden;}
.clear:after {content:''; display:block; clear:both;}

.mb{margin-bottom:30px !important}
.bmb{margin-bottom:40px !important}
.pb{padding-bottom:30px !important}
.bpb{padding-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}
.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}

@media all and (min-width:768px) {
.mb{margin-bottom:40px !important; }
.bmb{margin-bottom:60px !important;}
.pb{padding-bottom:40px !important}
.bpb{padding-bottom:60px !important}
.mo_only{display:none;}
.move_scroll{max-width:100%;}
.pdinner{padding:0 3%;}
}

@media all and (min-width:1200px) {
body, html{font-size:17px; line-height:1.5}
.mb{margin-bottom:60px !important}
.bmb{margin-bottom:100px !important}
.pb{padding-bottom:50px !important}
.bpb{padding-bottom:80px !important}
.pdinner{padding:0 20px;}
}



/* ==== 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}



/* main */
#main .main_wrap {overflow:hidden;}
#main .visual {width:100%; position:relative; z-index:0; background:#eee;}
#main .visual_wrap {width:100%;border-bottom: 5px solid #dc1c26;}
#main .visual dd {height:640px; transition:0.2s;}
#main .visual dd div.bg {display:inline-block; position:absolute; left:0; top:0; width:100%; height:100%; background-position:center center; background-size:cover;}
#main .visual dd div.txt {position:relative; z-index:10; color:#fff; display:flex; align-items:center; height:90%;}
#main .visual dd div.txt p.t01{width:300px; margin-bottom:20px;}
#main .visual dd div.txt p.t03 {font-size:1.6em; font-weight:800;}
#main .visual dd.slick-active div.bg {animation:visbg 6s ease-in-out infinite alternate; animation-iteration-count:1;}
#main .visual dd.slick-active div.txt p {animation-name:anim01; animation-duration:1s; animation-fill-mode:both; animation-delay:1s;}
#main .visual dd.slick-active div.txt p.t02 {animation-delay:1.5s;}
#main .visual dd.slick-active div.txt p.t03 {animation-delay:2s;}

#main .visual_dots {position:absolute; left:0; bottom:20px;; width:100%;}
#main .visual_dots ul {display:flex; justify-content:center;}
#main .visual_dots li {position:relative; width:60px; height:60px; display:flex; align-items:center; justify-content:center;}
#main .visual_dots li .circle {width:60px; height:60px; position:relative; display:flex; align-items:center; justify-content:center;}
#main .visual_dots li .circle_wrap {width:30px; height:60px; position:absolute; top:0; overflow:hidden;}
#main .visual_dots li .circle_wrap.right {right:0;}
#main .visual_dots li .circle_wrap.left {left:0;}
#main .visual_dots li .circle_whole {width:60px; height:60px; border:2px solid transparent; border-radius:50%; position:absolute; top:0; transform:rotate(-135deg);}
#main .visual_dots li .circle_whole.right {border-top:2px solid #fff; border-right:2px solid #fff; right:0px;}
#main .visual_dots li .circle_whole.left {border-bottom:2px solid #fff; border-left:2px solid #fff; left:0px;}
#main .visual_dots li.slick-active .circle_whole.right {animation:circleRight 4s linear forwards;}
#main .visual_dots li.slick-active .circle_whole.left {animation:circleLeft 4s linear forwards;}
#main .visual_dots li p {font-size:1.1em; font-weight:700; color:#fff;}

#main .visual_scroll {display:none; position:absolute; right:20px; bottom:0; width:100px; height:220px; overflow:hidden;}
#main .visual_scroll:before {content:''; display:inline-block; width:4px; height:100%; background:rgba(255,255,255,0.3); position:absolute; left:0; top:0;}
#main .visual_scroll:after {content:''; display:inline-block; width:4px; height:30%; background:#fff; position:absolute; left:0; top:0; animation:scroll 3s ease-in infinite;}
#main .visual_scroll div {position:relative;}
#main .visual_scroll p:after{display:block; content:'';  width:20px; height:150px; background-size: 100%; position: absolute; top:0;background: url(../img/scroll_down.png)no-repeat;left: 20px;}
/*#main .visual_scroll p {display:inline-block;  transform-origin:left bottom; position:absolute; left:0.7em; top:-3em; color:#fff; font-size:1em;}
#main .visual_scroll p img{width:20px; height:150px;}*/

@media all and (min-width:768px) {
  #main .visual dd div.txt p.t03 { padding:0 300px 0 0; font-size:2em;}
  #main .visual_dots {bottom:100px;}
  #main .visual_dots ul {justify-content:flex-start; max-width:1300px; padding:0 20px; margin:0 auto;}
}
@media all and (min-width:980px) {
#main .visual dd div.txt p.t03 { padding:0 300px 0 0;font-size: 2.8em;}
  #main .visual_dots {bottom:180px; left:20px}
}

@media all and (min-width:1200px) {
  #main .visual dd {height:720px;}
  #main .visual dd div.txt .pdinner {padding:0 40px;}
  #main .visual dd div.txt p.t01,
  #main .visual dd div.txt p.t02 {/*! font-size:3em; */}
  #main .visual dd div.txt p.t03 {/*! margin:40px 0 160px 2.5em; */ font-size:3em;}
	#main .visual dd div.txt p.t01{width:450px; margin-bottom:25px;}

  #main .visual_dots {bottom:150px;}
  #main .visual_scroll {display:block;}
	#main .visual dd div.txt p.t03 {padding:0 400px 0 0;}
}

@media all and (min-width:1400px) {
  #main .visual_scroll {right:calc(50% - 680px);}
	#main .visual dd div.txt p.t03 {padding:0 490px 0 0;}
	#main .visual dd div.txt p.t01{width:650px; margin-bottom:25px;}
  #main .visual dd div.txt p.t03 {font-size:3.5em;}

}

@media all and (min-width:1600px) {
  #main .visual dd {height:980px;}
  #main .visual_dots {bottom:300px;left: -40px;}
}





/*스크롤다운*/
.main .visual_scroll {display:none;}
.main .visual_scroll:before {content:''; display:inline-block; width:3px; height:100%; background:rgba(255,255,255,0.3); position:absolute; left:0; top:0;}
.main .visual_scroll:after {content:''; display:inline-block; width:2px; height:30%; background:#fff; position:absolute; left:0; top:0; animation:scroll 3s ease-in infinite;}
.main .visual_scroll div {position:relative;}
.main .visual_scroll p {display:inline-block; transform:rotate(90deg); transform-origin:left bottom; position:absolute; left:0.7em; top:-1.4em; color:#fff; font-size:0.8em;}

.main .visual_dots {position:absolute; right:0; bottom:20px;; width:100%;}
.main .visual_dots ul {display:flex; justify-content:center;}
.main .visual_dots li {position:relative; width:50px; height:50px; display:flex; align-items:center; justify-content:center;}
.main .visual_dots li .circle {width:50px; height:50px; position:relative; display:flex; align-items:center; justify-content:center;}
.main .visual_dots li .circle_wrap {width:25px; height:50px; position:absolute; top:0; overflow:hidden;}
.main .visual_dots li .circle_wrap.right {right:0;}
.main .visual_dots li .circle_wrap.left {left:0;}
.main .visual_dots li .circle_whole {width:50px; height:50px; border:2px solid transparent; border-radius:50%; position:absolute; top:0; transform:rotate(-135deg);}
.main .visual_dots li .circle_whole.right {border-top:2px solid #fff; border-right:2px solid #fff; right:0px;}
.main .visual_dots li .circle_whole.left {border-bottom:2px solid #fff; border-left:2px solid #fff; left:0px;}
.main .visual_dots li.slick-active .circle_whole.right {animation:circleRight 4s linear forwards;}
.main .visual_dots li.slick-active .circle_whole.left {animation:circleLeft 4s linear forwards;}
.main .visual_dots li p {font-size:0.9em; font-weight:700; color:#fff;}


@media all and (min-width:768px) {
.main .visual_scroll {display:block;position: absolute;right: 0px;bottom: -100px;width: 100px;height: 150px;overflow: hidden;}
}

@media all and (min-width:1200px) {
.main .visual_scroll {right:50px;height: 200px; bottom:-200px;}
}

@media all and (min-width:1400px) {
.main .visual_scroll {right:120px;height: 220px;}
}


/* animation */
@-webkit-keyframes dot {
		0% {-webkit-transform:scaleX(0); -webkit-transform-origin:0 0;}
    100% {-webkit-transform:scaleX(1); -webkit-transform-origin:0 0;}
}
@keyframes dot {
		0% {transform:scaleX(0); transform-origin:0 0;}
    100% {transform:scaleX(1); transform-origin:0 0;}
}
@-webkit-keyframes visbg {
  from {-webkit-transform:scale(110%);}
  to {-webkit-transform:scale(100%);}
}
@keyframes visbg {
  from {transform:scale(110%);}
  to {transform:scale(100%);}
}
@-webkit-keyframes anim01 {
	0% {opacity:0; -webkit-transform:translateX(30px);}
	100% {-webkit-transform:translateX(0); opacity:1;}
}
@keyframes anim01 {
	0% {opacity:0; transform:translateX(30px);}
	100% {transform:translateX(0); opacity:1;}
}
@-webkit-keyframes scroll {
	0% {-webkit-top:-30%;}
	100% {-webkit-top:100%;}
}
@keyframes scroll {
	0% {top:-30%;}
	100% {top:100%;}
}
@keyframes circleRight {
  0% {
    transform: rotate(-135deg);
  }
  50%,
  100% {
    transform: rotate(45deg);
  }
}
@keyframes circleLeft {
  0%,
  50% {
    transform: rotate(-135deg);
  }
  100% {
    -webkit-transform: rotate(45deg);
  }
}



/*footer*/
#footer{background: var(--sub_color3); color:#9c9e9f; font-size:0.9em;text-align:left;padding:40px 0px;position:relative;display: block;}
#footer .pdinner{max-width:1500px;position: relative;}
#footer .footer_wrap{}
#footer .footer_wrap .lbox{margin-bottom: 20px;}
#footer .footer_wrap b{color:#ddd}
#footer .footer_wrap .lbox .logo{}
#footer .footer_wrap .lbox .logo img{width:150px; margin-bottom:10px}
#footer .footer_wrap .rbox ul{display:none}
#footer .btm{border-top: 1px solid #73737375;padding-top: 20px;}

@media all and (min-width:768px) {
#footer .footer_wrap .rbox ul{display:flex; flex-wrap:wrap;}
#footer .footer_wrap .rbox ul li{width:40%; text-align:right;}
#footer .footer_wrap{display:flex; flex-wrap:wrap;}
	#footer .footer_wrap .lbox{width:70%;}
	#footer .footer_wrap .rbox{width:30%;font-size: 1.1em;}
	#footer .footer_wrap .rbox a{color:#ddd;font-size: 1.15em; font-weight:600}
	#footer .footer_wrap .lbox .logo img{width:200px; margin-bottom:20px}
	#footer .footer_wrap address{font-size:1.1em}
	#footer .footer_wrap address p{display:inline-block}
	
	#footer .footer_wrap address p.p01{margin-right:30px;}
}

@media all and (min-width:980px) {
	#footer{padding:60px 0px 20px}
}

@media all and (min-width:1200px) {
	#footer{padding:80px 0px 20px}
	#footer .footer_wrap .lbox{margin-bottom:60px}
	#footer .footer_wrap .lbox{width:80%;}
	#footer .footer_wrap .rbox{width:20%}
}


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

@media all and (min-width:1200px) {
#pageup {right:20px;width: 70px;height: 70px;}
}




/* 서브레이아웃 */
#sub_vis {position:relative; padding:120px 0 30px; background:#eee no-repeat center center / cover; color:#fff; text-align:center;}
#sub_vis h2 {font-size:1.5em; color:#fff; font-weight:600;}
#sub_vis p {text-transform:uppercase; font-size:0.8em; opacity:0.8;}

@media all and (min-width:768px) {
	#sub_vis {padding:150px 0 50px;}
	#sub_vis h2 {font-size:2em;}
}

@media all and (min-width:1200px) {
	#sub_vis {padding:180px 0 130px;}
  #sub_vis h2 {font-size:2.2em; font-weight:800}
}


#sub {width:100%; margin:0 auto; position:relative; min-height:400px; padding:40px 0 80px; overflow:hidden;}
#sub.pb0 {padding-bottom:0;}
#sub.sub01{padding-bottom:0;}
.subwrap {margin:0 auto;}
.sub_tit_wrap {margin-bottom:40px; display:flex; align-items:center; justify-content:center;}
.sub_tit_wrap .loc {margin:0 0 0 auto; display:none; justify-content:flex-end; font-size:0.9em; color:#999;}
.sub_tit_wrap .loc li {display:flex; align-items:center;}
.sub_tit_wrap .loc li:not(:last-child) {margin:0 0.2em 0 0; padding:0 0.2em 0 0;}
.sub_tit_wrap .loc li:not(:last-child):after {content:'\e93f'; font-family:'xeicon';}
.sub_tit_wrap .loc li .home:after {content:'\e900'; font-family:'xeicon';}
.sub_tit {font-size:1.5em; font-weight:800;}

@media all and (min-width:768px) {
  #sub {padding:60px 0 100px;}
  .sub_tit_wrap {margin-bottom:60px;}
  .sub_tit_wrap .loc {display:flex;}
	.sub_tit {font-size:2em;}
}

@media all and (min-width:1200px) {
  #sub {min-height:650px; padding:80px 0 120px;}
  .sub_tit_wrap {margin-bottom:80px;}
  .sub_tit {font-size:2.5em;}
}


/*서브메뉴 - 공통 */
.menu_wrap {height:50px;}
.menu_wrap .inner {background:#fff;}

@media all and (min-width:768px) {
  .menu_wrap {height:60px;}
}

@media all and (min-width:1200px) {
  .menu_wrap {margin-top:-60px;}
}


/*서브메뉴 - type01 */
#sub_drop {display:flex; width:100%; z-index:100; height:50px;}
#sub_drop .dropdown.home {width:50px; height:100%; overflow:hidden;}
#sub_drop .dropdown.home a {display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:#307adf;}
#sub_drop .dropdown.home a:after {content:'\e900'; font-family:'xeicon'; color:#fff;}
#sub_drop .dropdown {position:relative; z-index:101; height:50px;}
#sub_drop .dropdown.deph01 {width:calc(50% - 50px); max-width:200px;}
#sub_drop .dropdown.deph02 {width:50%; max-width:300px;}
#sub_drop .dropbtn {width:100%; display:inline-block; position:relative; padding:0 2em 0 1em; cursor:pointer;  text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden; height:50px; line-height:50px;}
#sub_drop .dropbtn:after{font-family:'xeicon'; content:'\e942'; position:absolute; right:0.5em;}
#sub_drop .dropdown .show {display:block; position:absolute; left:0; top:50px;}
#sub_drop .dropdown ul li {padding:10px;}
#sub_drop .dropdown ul li:hover {background:#333;}
#sub_drop .dropdown ul li a {display:block; color:#fff;}
#sub_drop .dropmenu {display:none; background:#444; box-sizing:content-box; width:100%; overflow:hidden;}

@media all and (min-width:768px) {
  #sub_drop {height:60px;}
  #sub_drop .dropdown.home {width:60px;}
  #sub_drop .dropdown {height:60px;}
  #sub_drop .dropbtn {height:60px; line-height:60px;}
  #sub_drop .dropdown .show {top:60px;}
}


/*서브메뉴 - type02 */
#submenu {display:flex; border-bottom:1px solid #e0e0e0;}
#submenu a.home {display:flex; align-items:center; justify-content:center; width:50px; height:50px; background:var(--main_color);}
#submenu a.home:after {content:'\e900'; font-family:'xeicon'; color:#fff;}
#submenu a.arr {display:flex; width:calc(100% - 50px); line-height:50px; padding:0 2em 0 1em; background:rgba(255,255,255,0.6);}
#submenu a.arr:after {font-family:'xeicon'; content:'\e942'; position:absolute; right:1em; top:0; transition:0.2s;}
#submenu .list {display:none; position:absolute; left:50px; top:50px; width:calc(100% - 50px); background:#444; z-index:99;}
#submenu .list a {text-align:left; display:block; color:#fff; padding:0 10px; line-height:50px; cursor:pointer;}
#submenu .list a:hover {background:#333;}
#submenu .list a.on {display:none;}
#submenu.on .list {display:block;}
#submenu.on a.arr:after {-webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -ms-transform:rotate(180deg); -o-transform:rotate(180deg); transform:rotate(180deg);}

@media screen and (min-width:960px) {
  #submenu {border-bottom:0;}
  #submenu a.home {width:60px; height:60px;}
  #submenu a.arr {display:none;}
  #submenu .list {display:flex; width:calc(100% - 60px); position:absolute; left:60px; top:0; border:0; padding:0; background:rgba(0,0,0,0.6); backdrop-filter:blur(10px);}
  #submenu .list a {line-height:60px; font-size:1.1em; font-weight:600; flex:1; text-align:center; color:#aaa; background:#fafafa;}
  #submenu .list a:hover {background:0;}
  #submenu .list a.on {display:block; color:var(--main_color); background:#fff; border-bottom: 1px solid #ddd;}
}

@media screen and (min-width:1200px) {
  #submenu .list a {background:0;}
}




/*텍스트효과*/
.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:500ms;animation-timing-fonction:ease-out;}
/* Chrome, Safari, Opera */ 
@-webkit-keyframes sub_tt { 
      0%   {opacity: 0; transform: translateY(30px);}
    100% {transform: translateY(0px);opacity: 1;}

}
/* Standard syntax */
@keyframes sub_tt {
     0%   {opacity: 0; transform: translateY(30px);}
    100% {transform: translateY(0px);opacity: 1;}

}
/* Chrome, Safari, Opera */ 
@-webkit-keyframes sub_tt {
       0%   {opacity: 0; transform: translateY(30px);}
    100% {transform: translateY(0px);opacity: 1;}

}
/* Standard syntax */
@keyframes sub_tt {
     0%   {opacity: 0; transform: translateY(30px);}
    100% {transform: translateY(0px);opacity: 1;}
}

.anim01 {animation-name: anim01; animation-duration: 1s; animation-fill-mode: both;}
@keyframes anim01 {
	0% {opacity: 0; transform: translateY(-1000px);} 
    60% {opacity: 1; transform: translateY(30px);} 
    80% {transform: translateY(-10px);} 
    100% {transform: translateY(0); } 
} 
.anim02 {animation-name: anim02; animation-duration: 1s; animation-fill-mode: both;}
@keyframes anim02 {
	0% {opacity: 0; transform: translateY(1000px);} 
    60% {opacity: 1; transform: translateY(-30px);} 
    80% {transform: translateY(10px);} 
    100% {transform: translateY(0); } 
} 
.anim03 {animation-name: anim01; animation-duration: 1s; animation-fill-mode: both;}
@keyframes anim01 {
	0% {opacity: 0; transform: translateY(-100px);} 
    40% {opacity: 1; transform: translateY(20px);} 
    60% {transform: translateY(-10px);} 
    100% {transform: translateY(0); } 
} 
.anim04 {animation-name: anim02; animation-duration: 1s; animation-fill-mode: both;}
@keyframes anim02 {
	0% {opacity: 0; transform: translateY(100px);} 
    40% {opacity: 1; transform: translateY(-20px);} 
    60% {transform: translateY(10px);} 
    100% {transform: translateY(0); } 
} 
.anim05 {animation-name: anim05; animation-duration: 1s; animation-fill-mode: both;}
@keyframes anim05 {
	0% {transform: translateY(0);} 
    50% {transform: translateY(-10px);} 
    100% {transform: translateY(0); } 
} 


@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;}
}

.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);
  }
}


/*공통*/
.section{padding:40px 0px;}
#section01.section{padding-bottom:0px;}
.section .main_txt .left p {text-transform: uppercase;color: var(--main_color);font-weight: 700; }
.section .main_txt .left h2 {font-size: 1.5em;font-weight: 900;color: #111;margin: 5px 0px 20px;}

@media all and (min-width:768px) {
	.section{padding:60px 0px;}
	.section .main_txt{display:flex; flex-wrap:wrap; }
	.section .main_txt .left{width:60%;}
	.section .main_txt .left h2 {margin: 5px 0px 00px;font-size: 2em;}
	.section .main_txt .right{width:40%; text-align:right; align-content: flex-end;}
}

@media all and (min-width:980px) {
	.section{padding:80px 0px;}
	.section .main_txt .left h2 {font-size: 2.3em;}
}

@media all and (min-width:1200px) {
	.section{padding:100px 0px;}
	.section .main_txt .left h2 {font-size: 2.8em;}
}

@media all and (min-width:1400px) {
	.section{padding:120px 0px;}
	.section .main_txt .left h2 {font-size: 3em;}
}

/*section01*/
#section01 .main_txt {text-transform: uppercase;color: var(--main_color);font-weight: 700;margin-bottom: 60px;}
#section01 .main_txt:after{display:block; content: ''; background: url(../img/logo_bg.png) no-repeat; width:300px; height:100%; position: absolute; bottom:-80px; z-index: -9; background-size: 100%; right:-80px;}
#section01 .main_txt .right p {color: #5A5A5A;font-weight: 500;}

#section01 .busi_nav {position: relative;}
#section01 .busi_nav ul {position: absolute;z-index: 99;top: -20px;}
#section01 .busi_nav ul li {background: #f8f8f8;color: #949494;padding: 15px 5px; text-align:center;border-right: 1px solid #ddd;}
#section01 .busi_nav ul li:last-child{border-right:0px;}
#section01 .busi_nav ul li.slick-current{background: var(--main_color); color:#fff;}

#section01 .busi_area .busibox {padding:70px 0px 40px;}
#section01 .busi_area .busibox.busi01 {background: #4f4f4f url(../img/sec01_bg02.png) no-repeat;background-size: cover;}
#section01 .busi_area .busibox.busi02 {background: #4f4f4f url(../img/sec01_bg01.png) no-repeat;background-size: cover;}
#section01 .busi_area .busibox.busi03 {background: #4f4f4f url(../img/sec01_bg03.png) no-repeat;background-size: cover;}
#section01 .busi_area .busibox.busi04 {background: #4f4f4f url(../img/sec01_bg04.png) no-repeat;background-size: cover;}
#section01 .busi_area .busibox.busi05 {background: #4f4f4f url(../img/sec01_bg03.png) no-repeat;background-size: cover;}

#section01 .busi_area .busibox .photo img {width: 100%;display: block; margin-bottom:20px;}

#section01 .busi_area .busibox .info {color: #fff;}
#section01 .busi_area .busibox .info b {display:block; width:100%}
#section01 .busi_area .busibox .info h3 {display:block; font-size: 1.6em;font-weight: 900;margin: 5px 0 20px;}

#section01 .busi_area .busibox .info .link_btn li a {margin-top: 20px;display: block;border: 1px solid #999;padding: 10px;width: 150px;text-align: center;color: #ffffffb2;}
#section01 .busi_area .busibox .info .link_btn li a:hover{background: #999; font-weight:700}
#main .slick-arrow {padding: 0;background: none;border: 0px;text-indent: -9999px;position: absolute;}

@media all and (min-width:768px) {
#section01 .main_txt{margin-bottom:80px}
#section01 .busi_nav ul li {padding: 20px 5px; font-size:1.1em}
#section01 .busi_area .busibox {padding:80px 0px 50px;}	
#section01 .busi_area .busibox .pdinner{display:flex; flex-wrap:wrap;}
	#section01 .busi_area .busibox .photo{width:400px; margin-right:50px;}
	#section01 .busi_area .busibox .info{width:calc(100% - 450px); align-content: center; }
	#section01 .busi_area .busibox .photo img {margin-bottom:0px;}
	#section01 .busi_nav ul {top: -30px;}
}

@media all and (min-width:980px) {
#section01 .busi_area .busibox {padding:100px 0px 70px;}

#section01 .busi_area .busibox .photo{width:500px;}
#section01 .busi_area .busibox .info{width:calc(100% - 550px);}
#section01 .busi_area .busibox .info .link_btn li a{margin-top:50px;}
#section01 .busi_area .busibox .info h3 {display:block; font-size: 2.3em}
#section01 .busi_area .busibox .info p {font-size:1.1em; line-height:1.6}
}

@media all and (min-width:1200px) {
#section01 .busi_area .busibox {padding:120px 0px 120px;}
#section01 .busi_area .busibox .photo{width:600px;}
#section01 .busi_area .busibox .info{width:calc(100% - 650px);}
#section01 .busi_area .busibox .info h3 {font-size: 2.6em}
	#section01 .main_txt .right p, .section .main_txt .left p {font-size:1.1em}
	#section01 .busi_nav ul li {padding: 25px 5px; font-size:1.2em}
}

@media all and (min-width:1600px) {
#main .slick-arrow:before{display: block; clear: both; content: ""; width: 30px; height: 30px; border-top: 4px solid #979797; border-right: 4px solid #979797; position: absolute;   transform: rotate(225deg);z-index: 99;left: 0;}
#main .slick-next:before{transform: rotate(45deg);}
#main .slick-prev{top:50%; left:1.5%;}
#main .slick-next{top:50%; right:4%;}
	
#section01 .busi_area .busibox .photo{width:720px; margin-right:100px}
#section01 .busi_area .busibox .info{width:calc(100% - 820px);}
#section01 .busi_area .busibox .info h3 {font-size: 2.8em}
#section01 .busi_area .busibox .info p {font-size:1.2em; line-height:1.6}
}

@media all and (min-width:1800px) {
#main .slick-prev{left:4.2%;}
#main .slick-next{right:6%}
}

@media all and (min-width:1900px) {
#main .slick-prev{left:5.3%;}
#main .slick-next{right:7.5%}
}


/*section02*/
#section02{background: #f9f9f9 url(../img/sec03_bg.png) no-repeat;}
#section02 a{position: relative; background:#fff; margin:0 5px; padding:15px; padding-top:80px}
#section02 a:hover{background:var(--main_color); color:#fff;}
#section02 a.ico:hover p{color:#fff;}
#section02 a.ico:before{display:block; content:''; background: url(../img/sec03_ico01.png)no-repeat; width:40px; height:40px; background-size: 100%; position: absolute;top:15px;}
#section02 a.ico.i01{}
#section02 a.ico.i02:before{background: url(../img/sec03_ico02.png)no-repeat; background-size: 100%;}
#section02 a.ico.i03:before{background: url(../img/sec03_ico03.png)no-repeat; background-size: 100%;}
#section02 a.ico.i04:before{background: url(../img/sec03_ico04.png)no-repeat; background-size: 100%;}
#section02 a.ico.i05:before{background: url(../img/sec03_ico05.png)no-repeat; background-size: 100%;}
#section02 a.ico.i06:before{background: url(../img/sec03_ico06.png)no-repeat; background-size: 100%;}

#section02 a.ico:hover:before{background: url(../img/sec03_ho01.png)no-repeat; background-size: 100%;}
#section02 a.ico.i02:hover:before{background: url(../img/sec03_ho02.png)no-repeat; background-size: 100%;}
#section02 a.ico.i03:hover:before{background: url(../img/sec03_ho03.png)no-repeat; background-size: 100%;}
#section02 a.ico.i04:hover:before{background: url(../img/sec03_ho04.png)no-repeat; background-size: 100%;}
#section02 a.ico.i05:hover:before{background: url(../img/sec03_ho05.png)no-repeat; background-size: 100%;}
#section02 a.ico.i06:hover:before{background: url(../img/sec03_ho06.png)no-repeat; background-size: 100%;}

#section02 a.ico h3{font-size: 1.2em;font-weight: 800; margin-bottom:5px}
#section02 a.ico p{color:#5A5A5A; line-height:1.3; font-size:0.9em}

@media all and (min-width:768px) {
#section02 .main_txt{margin-bottom:30px;}
#section02 a{padding:20px; padding-top:150px}
#section02 a.ico h3{font-size: 1.5em;font-weight: 700; margin-bottom:5px}
#section02 a.ico p{color:#5A5A5A; line-height:1.3; font-size:0.9em;letter-spacing: -0.099em;}
#section02 a.ico:before{width:60px; height:60px; top:25px}
}

@media all and (min-width:980px) {
	#section02 .main_txt{margin-bottom:40px;}
#section02 a{padding:30px 24px; padding-top:200px}
#section02 a.ico h3{font-size: 1.5em;}
#section02 a.ico p{color:#5A5A5A; line-height:1.3; /*font-size:0.95em;*/}
	#section02 a.ico:before{width:80px; height:80px; top:30px}
}

@media all and (min-width:1600px) {
#main #section02 .slick-prev{left:-1.5%}
#main #section02 .slick-next{right:1%}
#main #section03 .slick-prev{left:-3%; top:30%}
#main #section03 .slick-next{right:-0.5%; top:30%}

#main #section04 .slick-arrow:before{display: block; clear: both; content: ""; width: 15px; height: 15px; border-top: 2px solid #979797; border-right: 2px solid #979797; position: absolute;   transform: rotate(225deg);}
#main #section04 .slick-next:before{transform: rotate(45deg);}
	#main #section04 .slick-prev{left:-215px; top:100%;}
	#main #section04 .slick-prev:after{display:block; width:1px ; height:25px; content:''; background: #ddd; position: absolute; left:25px; top:-4px;}
#main #section04 .slick-next{right:0%; left:-180px; top:100%}
}

@media all and (min-width:1800px) {
#main #section02 .slick-prev{left:-5%}
#main #section02 .slick-next{right:-2.5%}
#main #section03 .slick-prev{left:-6.5%;}
#main #section03 .slick-next{right:-4%;}
}

@media all and (min-width:1900px) {
#main #section02 .slick-prev{left:-7%}
#main #section02 .slick-next{right:-4%}
#main #section03 .slick-prev{left:-8%;}
#main #section03 .slick-next{right:-5.5%;}
}



/*section03*/
#section03{background: #212121 url(../img/sec04_bg.png) no-repeat; color:#fff}
#section03 .main_txt h2{color:#fff !important;}
#section03 .menulist{}
#section03 .menulist dl{display:flex; flex-wrap:wrap; text-align:center; margin-bottom: 30px;}
#section03 .menulist dd{width:33.333%; border-bottom:3px solid #a2a2a2;padding:10px; color:#a2a2a2;}
#section03 .menulist dd.on{border-bottom:3px solid var(--main_color); color:#fff}

#section03 .not_list a .img{position:relative;}
#section03 .not_list a .img span{display: block;width: 80px; text-align:center; padding:5px; position: absolute; background:#3D4043}
#section03 .not_list a .img span.r_bg{background: var(--main_color)}
#section03 .not_list a .img img{margin-bottom: 20px;width: 100%;}
#section03 .not_list a .txt h3{font-size: 1.3em;font-weight: 800;}
#section03 .not_list a .txt p{color: #b9b9b9;margin: 3px 0px 10px;}

/* 여백 30px / -2 설정 */
#section03 .slick-list, #section02 .slick-list{ margin: 0 -10px;}
/* 여백 30px / 2 설정 */
#section03 .slick-slide, #section02 .slick-slide{margin: 0 10px;}

@media all and (min-width:768px) {
	#section03 .main_txt{margin-bottom:40px}
  #section03 .menulist dl{margin-bottom: 0px;}
	#section03 .menulist dd{font-size:1.1em}
	#section03 .not_list a .img img{height: 150px;object-fit: cover;}
}

@media all and (min-width:980px) {
	#section03 .not_list a .img img{height: 200px;}
}

@media all and (min-width:1200px) {
 #section03 .main_txt .left{width:68%;}
 #section03 .main_txt .right{width:32%; }
/* 여백 30px / -2 설정 */
#section03 .slick-list, #section02 .slick-list{ margin: 0 -15px;}
/* 여백 30px / 2 설정 */
#section03 .slick-slide, #section02 .slick-slide{margin: 0 15px;}
#section03 .not_list a .img img{height: 300px;}
  #section03 .slick-list .slick-track{margin:0}
}



/*section04*/
.busi_nav .slick-track{transform: translate3d(0px, 0px, 0px) !important;}
#section04{}
#section04 .left h5{font-size: 1.3em;font-weight: 800;margin-bottom: 15px;}
#section04 .cus_list{}
#section04 .cus_list li{border: 1px solid #ddd; margin-right: 10px}

/*section05*/
#section05{}
#section05 .go_box{}
#section05 .go_box a.box{background: var(--main_color);display: block;color: #fff;padding: 20px 10px;position: relative;}
#section05 .go_box a.box:after{display:block; content: ''; background: url(../img/bottom_ico01.png)no-repeat; width:30px; height:30px; background-size: 100%; position: absolute; right: 10px; top:33%;}
#section05 .go_box a.box.b02:after{background: url(../img/bottom_ico02.png)no-repeat; background-size: 100%}
#section05 .go_box a.box.b03:after{background: url(../img/bottom_ico03.png)no-repeat; background-size: 100%}
#section05 .go_box a.b01{}
#section05 .go_box a.b02{background: var(--sub_color);}
#section05 .go_box a.b03{background: var(--sub_color2);}
#section05 .go_box h3{font-size: 1.3em;font-weight: 800;margin-bottom: 5px;}
#section05 .go_box p{font-size: 0.9em;}

@media all and (min-width:500px) {
	#section05 .go_box a.box{padding:25px;}
	#section05 .go_box a.box:after{width:40px; height:40px; top:30%; right:25px}
}

@media all and (min-width:768px) {
#section04 .flex_box{display:flex; flex-wrap:wrap;}
	#section04 .left{width:15%}
	#section04 .right{width:85%;}
	
#section05 .go_box {display: flex; flex-wrap:wrap;}
#section05 .go_box a.box{width:33.333%; padding:25px 20px}
#section05 .go_box p{width:70%;}
}

@media all and (min-width:980px) {
#section05 .go_box a.box{padding:40px 25px}
	#section05 .go_box h3{font-size:1.55em}
#section05 .go_box p{width:100%;}
}

@media all and (min-width:1200px) {
#section05 .go_box a.box{padding:50px 30px}
#section05 .go_box a.box:after{width:50px; height:50px; top:35%; right:30px}
#section04 .left h5{font-size: 1.5em;}
}

@media all and (min-width:1600px) {
#section05 .go_box a.box{padding:60px 60px}
#section05 .go_box a.box:after{width:60px; height:60px; top:33%; right:60px}
}