body.Main{ background:#fff; }

/*---------------------------------------------------------------------
    메인 : 관리자 설정 UI
---------------------------------------------------------------------*/
.admin_set_block{ z-index:3; position:absolute; right:0; top:0; text-align:right; }
.admin_set_bg{ position:fixed; width:100%; right:0; top:0; background:rgba(0,0,0,.5); }

.admin_set_btn{ display:inline-block; margin:20px; width:38px; height:38px; font-size:0; background:url(/img/set_close_btn.png) no-repeat center; background-size:100%; }

.admin_set_wrap{ overflow-y:auto; position:fixed; width:1px; height:100%; right:-100%; top:0; box-sizing:border-box; background:#fff; transition:right .4s ease-in-out; -webkit-transition:right .4s ease-in-out; opacity:0; }
.admin_set_wrap{ padding:50px; text-align:right; }
.admin_set_wrap{ -webkit-transition-duration:0.2s; -moz-transition-duration:0.2s; -o-transition-duration:0.2s; -ms-transition-duration:0.2s; transition-duration:0.2s; }
.admin_set_close_btn{ display:inline-block; }

.admin_set{ margin:12px 0; text-align:left; }
.admin_set h5{ position:relative; }
.admin_set h5 b{ z-index:1; position:relative; display:block; font-weight:500; font-size:19px; line-height:46px; color:#333; }
.admin_set h5 span{ position:absolute; right:0; top:0; display:block; font-size:13px; font-weight:300; line-height:46px; color:#777; }
.admin_set h5 span.color_red{ color:#830008; }
.admin_set h5 span i{ font-style:normal; letter-spacing:-1.5px; }

.set_control{ width:100%; height:40px; padding:0 10px; border:1px solid #ddd; font-weight:300; font-size:14px; line-height:40px; color:#555; }
textarea.set_control{ padding:5px 10px; min-height:84px; font-weight:300; font-size:14px; line-height:24px; }
textarea.set_control_small{ min-height:40px; }

.set_upfile_wrap{ overflow:hidden; margin:1px 0 7px; }
.set_upfile_wrap .set_file{ float:left; width:20%; font-weight:400; font-size:13px; line-height:40px; color:#fff; background:#555; text-align:center; }
.set_upfile_wrap .set_file{ -webkit-transition-duration:0.2s; -moz-transition-duration:0.2s; -o-transition-duration:0.2s; -ms-transition-duration:0.2s; transition-duration:0.2s; }
.set_upfile_wrap{ position:relative; }
.set_upfile_wrap:hover .set_file{ background:#1b84c7; }
.set_upfile_wrap .set_filename{ float:left; width:80%; padding-right:70px; }
.set_upfile_wrap .set_upfilebtn{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }

.set_upfile_delete{ position:absolute; right:15px; top:8px; color:#555; }
.set_upfile_delete:hover{ color:#333; }
.set_upfile_delete input[type="checkbox"]{ vertical-align:-2px; }

.admin_set_wrap .set_save{ margin:15px 0 0 0; width:100%; height:46px; border-radius:0; font-size:17px; font-weight:500; line-height:46px; background:#1b84c7; border:none; color:rgba(255,255,255,0.9); }
.admin_set_wrap .set_save:hover{ background:#1d3f80; }

.admin_set ul{ overflow:hidden; }
.admin_set ul li{ float:left; width:58%; margin:0; }
.admin_set ul li:last-child{ margin-left:2%; width:40%; }
.admin_set ul li .set_upfile_wrap .set_file{ width:35%; }
.admin_set ul li .set_upfile_wrap .set_filename{ width:65%; }

.admin_set_block.on{ z-index:100; width:100%; height:100%; }
.admin_set_block.on:before{ width:100%; opacity:1; }
.admin_set_block.on .admin_set_btn{ display:none; }
.admin_set_block.on > .admin_set_wrap{ z-index:101; width:580px; right:0; opacity:1; }
.admin_set_block.on > .admin_set_bg{ height:100%; }

.file_del{ position:absolute; right:0; top:0; padding:0 10px; border:1px solid #ddd; font-size:13px; font-weight:400; color:#555; line-height:38px; }
.file_del:hover{ background:#1d3f80; border-color:#1d3f80; color:#fff; }

/* 서브 게시판으로 링크 이동 버튼 */
.admin_set_block2{ z-index:3; position:absolute; right:0; top:0; text-align:right; }
.admin_set_block2 a{ display:inline-block; margin:20px; width:38px; height:38px; font-size:0; background:url(/img/set_close_btn.png) no-repeat center; background-size:100%; }

.main_video_wrap .admin_set_block{ top:95px; }


/*------------------------------------
    메인 섹션 : 네비게이션
------------------------------------*/
.Main .container1{ height:100%; }
.Main .section{ height:947px; position:relative; }
.Main #container5{ height:auto; }

#container1{max-width:1920px; width:auto; margin:0 auto; }
#container2{max-width:1920px; width:auto; margin:0 auto;}
#container3{max-width:1920px; width:auto; margin:0 auto;}



/* page_nav */
ul.page_nav{ z-index:9; position:fixed; top:50%; right:2.5%; margin-top:-50px; }
ul.page_nav li{ margin:10px auto; }
ul.page_nav li a{ display:block; width:15px; height:15px; text-indent:-9999px; background:#b2b3b6; border-radius:10px; }
ul.page_nav li a{ -webkit-transition-duration:0.2s; -moz-transition-duration:0.2s; -o-transition-duration:0.2s; -ms-transition-duration:0.2s; transition-duration:0.2s; }
ul.page_nav li a:hover, ul.page_nav li.active a:hover{ background:#0c4ca3 !important; }
ul.page_nav li.active_btn a{ position:relative; height:30px; background:#1d3f80; }
/* ul.page_nav li:hover a, ul.page_nav li:hover a:focus, ul.page_nav li:hover a:active{ height:15px !important; background:#aaa !important; } */

ul.page_nav li.container5-1{ display:none; }
ul.page_nav li span{ display:none; }



/*------------------------------------
    메인타이틀
------------------------------------*/
.main_contents_title{ margin-bottom:10px; }
.main_contents_title h1{ font:600 33px 'Play','Roboto','Noto Sans KR','Malgun Gothic',Sans-serif; line-height:140%; }
.main_contents_title p{ font:400 22px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:#888; letter-spacing:-1px; }
.main_contents_title p:after{display:block; content:''; width:60px; height:2px; margin-top:25px; background:#0c4da2; }

/*------------------------------------
	스크롤
------------------------------------*/

@-webkit-keyframes scroll {
  0% {
    left:-160px;
  }
  100% {
    left:160px;
  }
}

.main_banner_wrap{position:relative; }
.main_banner_wrap .scroll{position:absolute;left:197px;bottom:0;z-index:9;}
.main_banner_wrap .scroll .scroll_bar{width:165px;height:1px;background:rgba(255,255,255,0.2);overflow:hidden;transform:rotate(90deg);-webkit-transform:rotate(90deg);position:absolute;left:0;top:-50px;}
.main_banner_wrap .scroll:before{display:block;content:"";width:18px;height:18px;border-radius:50%;border:1px solid #fff;position:absolute;left:72px;bottom:157px;}
.main_banner_wrap .scroll span{font-size:13px;font-family:'GilroyM';color:#fff;letter-spacing:6px;display:inline-block;text-align:center;position:relative;right:-60px;top:-66px;transform:rotate(90deg);-webkit-transform:rotate(90deg);}
.main_banner_wrap .scroll .scroll_bar:after{position:absolute;display:block;content:"";width:165px;height:1px;opacity:1;top:0;background:rgba(255,255,255,1);animation:scroll ease-in-out 1s infinite;}



/*------------------------------------
    메인 : product
------------------------------------*/

.main_works {overflow:hidden;  padding:80px 0;}


.main_works .works_left:after{position:absolute; animation-name: slidein; animation-duration: 3s; top:25px; left:400px; content:'WORKS'; font:800 200px 'Raleway','Roboto','Noto Sans KR',Sans-serif; color:#eee; opacity:.5;}
@keyframes slidein {
  from {
    margin-left: 100%;
  }

  to {
    margin-left: 0%;
  }
}

.main_works .works_left{ position:relative; float:left; width:45%; margin-right:10%; padding-left:130px; padding-top:100px; text-align:left; }
.main_works .works_left h2{font:800 50px 'Raleway','Roboto','Noto Sans KR',Sans-serif; line-height:140%; text-align:left; }
.main_works .works_left h2:after{display:block; content:''; width:50px; height:2px; background:#b73839; margin-top:30px; }
.main_works .works_left h3{ font:400 28px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:#333; padding:40px 0 40px; }
.main_works .works_left p{ font:300 17px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:#555; line-height:180%; }
.main_works .works_right{float:left; width:45%; border-radius:8px 0 0 8px;} 
.main_works .works_right img{border-radius:8px; }


/*--------------------------------------------
    메인: service
--------------------------------------------*/

.main_service {overflow:hidden;  }
.main_service li{float:left; width:50%; background:url(/img/about_background1.jpg)no-repeat top left; height:947px; padding:250px 0 0 130px;  }
.main_service li:nth-child(2){ background:url(/img/about_background2.jpg)no-repeat top left; }

.main_service h2{font:800 50px 'Raleway','Roboto','Noto Sans KR',Sans-serif; line-height:140%; color:#fff;}
.main_service h2:after{display:block; content:''; width:50px; height:2px; background:#b73839; margin:23px 0; }
.main_service p{ font:400 20px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:rgba(255,255,255,.8); line-height:160%; }

.main_service .about_content{position:relative; }
.main_service .icon{position:absolute; top:20%; right:120px; }
.main_service .icon.one{top:23%;}


#about_icon{width:300px; padding:50px; border-radius:50px; background:#fff; stroke-dasharray: 500; stroke-dashoffset: 500;  animation: ani 2s linear infinite;   }
@keyframes ani {
  0% {
    stroke-dashoffset: 500;  /*500지점부터 svg가 나타남*/
  }
  100% {
    stroke-dashoffset: 0;   /*0지점부터 svg가 나타남*/
  }
}

/*#contact_icon{width:280px; padding:50px; border-radius:50px; background:#fff; stroke-dasharray: 500; stroke-dashoffset: 500;  animation: ani2 3s linear infinite;   }
@keyframes ani2 {
  0% {
    stroke-dashoffset: 500;  /*500지점부터 svg가 나타남*/
  /*}
  100% {
    stroke-dashoffset: 0;   /*0지점부터 svg가 나타남*/
 /* }
}*/

#service_icon{width:280px; padding:50px; border-radius:50px; background:#fff; stroke-dasharray: 500; stroke-dashoffset: 500;  animation: ani2 2s linear infinite;   }
@keyframes ani2 {
  0% {
    stroke-dashoffset: 500;  /*500지점부터 svg가 나타남*/
  }
  100% {
    stroke-dashoffset: 0;   /*0지점부터 svg가 나타남*/
  }
}

/*------------------------------------
	more
------------------------------------*/

@-webkit-keyframes scroll {
  0% {
    left:-160px;
  }
  100% {
    left:160px;
  }
}

.about_content{position:relative; }
.about_content .more{position:absolute; left:0; bottom:-180px; z-index:9;}
.about_content .more .more_bar{width:165px;height:1px;background:rgba(255,255,255,0.2);overflow:hidden;position:absolute;left:0;top:-30px;}
.about_content .more span{font-size:15px;font-family:'GilroyM';color:#fff; display:inline-block; text-align:center;position:relative; left:10px; top:-66px;}
.about_content .more .more_bar:after{position:absolute;display:block;content:"";width:165px;height:1px;opacity:1;top:0;background:rgba(255,255,255,1); animation:scroll ease-in-out 3s infinite;}
.about_content .more .more_bar2{position:absolute; background:#fff; right:-84px; bottom:61px; width:20px; height:1px; transform:rotate(45deg); -webkit-transform:rotate(45deg); }

/*--------------------------------------------
    메인: CONTACT
--------------------------------------------*/

.main_contact_wrap{background:url(/img/main_contact_background.jpg)no-repeat center; }
.main_contact{max-width:1650px; width:auto; margin:0 auto; overflow:hidden;  padding:80px 0 0;  }
.main_contact h2{font:800 50px 'Raleway','Roboto','Noto Sans KR',Sans-serif; line-height:140%; color:#fff;}
.main_contact h2:after{display:block; content:''; width:50px; height:2px; background:#b73839; margin:23px 0; }
.main_contact p{ font:400 20px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:rgba(255,255,255,.8); line-height:180%; padding-bottom:50px;  }
.main_contact span{ display:block; padding-bottom:10px; font:300 17px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:rgba(255,255,255,.8); line-height:180%; }

.contact_left{float:left; width:49%; }
.contact_right{float:left; width:49%; margin-left:2%;  }
.main_contact li{margin-bottom:15px; }
.main_contact .two{overflow:hidden; }
.main_contact .two li{float:left; width:49%; margin-left:2%; }
.main_contact .two li:nth-child(2n+1){margin-left:0; }

.contact_btn{text-align:center;  padding:30px 0 80px; }
.contact_btn label{ display:block; font:300 17px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:#fff; padding:0 0 15px;  }
.contact_btn label:hover{color:#fff; }
.contact_btn label:hover a{color:#b73839; transition:ease all .7s; }
.contact_btn label input{margin-right:8px; margin-bottom:4px;  }
.contact_btn label a{color:rgba(255,255,255,.5); }
.contact_submit{padding-top:5px; }
.contact_submit input{background:rgba(0,0,0,.5); padding:10px 60px 15px; border:none; font:400 18px 'Noto Sans KR','Malgun Gothic',Sans-serif; color:#fff; -webkit-appearance:none;  }
.contact_submit input:hover{background:#b73839; transition:ease all .7s; border-radius:5px;  }


.form-control{ width:100%; height:40px; padding:0 10px; border:1px solid #ddd;  font-weight:300; font-size:15px; line-height:40px; color:#555; }
.upfile_wrap .btn_file{ float:left; width:15%; font-weight:400; font-size:15px; line-height:40px; color:#fff; background:#333; text-align:center; }
.upfile_wrap .btn_file{ -webkit-transition-duration:0.2s; -moz-transition-duration:0.2s; -o-transition-duration:0.2s; -ms-transition-duration:0.2s; transition-duration:0.2s; }
.upfile_wrap{ }
.upfile_wrap:hover .btn_file{ background:#0e518c; }
.upfile_wrap .filename{ float:left; width:85%; padding-right:70px; }
.upfile_wrap .upfilebtn{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }



@media(max-width:1200px){

/*---------------------------------------------------------------------
    메인 : 관리자 설정 UI
---------------------------------------------------------------------*/
.admin_set_block, .admin_set_block2{ display:none !important; }
.Main .container_wrap .centerWrap{max-width:1100px !important; }

.main_contents_title{margin-top:30px;}
.main_contents_title h1{font-size:28px;}
.main_contents_title p{font-size:18px;}

/*------프로덕트------*/

.main_product li dl dd{font-size:18px; padding:20px 0; margin:-35px auto; }

.product_list li dl dd strong{font-size:17px;}
.product_list li dl dd h3{font-size:25px; }
.product_list li dl dd p{font-size:15px;}
.product_list li dl dd a{font-size:13px; padding:8px 27px; }

/*------공지사항------*/

.main_notice_wrap{padding:30px 0 60px; }
.main_notice_wrap .main_catalog h2{font-size:31px;}
.main_notice p{font-size:31px;}
.main_notice_wrap .main_notice{padding:20px 15px 30px; height:330px;}
.catalog_content dl{padding-top:30px;}
.catalog_content dd h3{font-size:22px;}
.catalog_content dd p{font-size:14px;}
.catalog_content dd a{ margin-top:30px; font-size:13px; padding:5px 26px; }
.main_notice .main_news strong{font-size:15px;}
.main_notice .main_news b{font-size:13px;}
.main_notice .main_news li{padding:10px 0;}

/*------about------*/

.main_about_wrap{padding:50px 0 80px;}
.main_contact_txt_wrap h3{font-size:20px; margin-top:5px;}
.main_contact_txt_wrap p{font-size:15px; line-height:145%; padding-top:5px; }

}

@media(max-width:999px){

.navbar_center .centerWrap .logo{width:190px !important; top:13px !important; left:15px; }
.Main .container_wrap .centerWrap{max-width:100%; }

.Main .section{height:100%;}
.main_contents_title{ margin:15px 0; }
.main_contents_title h1{ font-size:20px; }
.main_contents_title p{font-size:15px;}
.main_contents_title p:after{width:40px; height:1px; margin-top:15px;}

.product_list li dl dt {float:none; width:100%; }
.product_list li dl dd {float:none; width:100%; }

#section0 {height:400px !important;}
#section0 .fp-tableCell {height:300px !important;}
.visual_text .txt01 {opacity:.8}
.visual_box .left_img {display:none;}
.visual_box .right_img {display:none;}
.visual_box .visual_text {width:100%; opacity:.8}
.visual_txt .txt01 {margin-bottom:0; font-size:13px;}
.visual_text .txt02 {font-size:24px; font-weight:400; margin-bottom:20px; line-height:35px;}
.visual_text p { letter-spacing:0; padding:0 15px; font-size:13px;}
.fp-controlArrow {top:60% !important;}
.fp-controlArrow.fp-next,
.fp-controlArrow.fp-prev {width:30px !important; height:30px !important;}
.visual_text .btn_more {margin-top:30px; font-size:13px; padding:10px 20px 6px}


/*------메인 포트폴리오---*/

.main_banner_wrap .scroll{display:none; }
.main_works .works_left{float:none; width:100%; padding:15px;}
.main_works .works_left:after{top:-5px; left:39%; font-size:65px; }
.main_works .works_right{float:none; width:100%; }
.main_works .works_right img{max-width:100%; width:auto; margin:0 auto; }

.main_works .works_left h2{font-size:25px;}
.main_works .works_left h2:after{width:35px; height:1px; margin-top:15px;}
.main_works .works_left h3{font-size:18px; padding:15px 0 10px; }
.main_works .works_left p{font-size:13px; line-height:160%; }

/*------about----------*/

.main_service_wrap{padding:0 ;}
.main_service li{float:none; width:100%; padding:50px 15px; height:auto;  }
.main_service h2{font-size:25px;}
.main_service h2:after{width:35px; height:1px; margin-top:15px;}
.main_service p{font-size:2vh; line-height:160%; margin-bottom:30px; }

#about_icon{width:180px; padding:25px; border-radius:25px; }
#contact_icon{width:180px; padding:25px; border-radius:25px;}
#service_icon{width:180px; padding:25px; border-radius:25px;}

.main_service .icon{display:block; position:inherit; top:auto; right:auto; text-align:center; }

.about_content .more{position:inherit; bottom:auto; right:auto; display:block; margin-top:30px; text-align:center;  }
.about_content .more .more_bar{left:50%; margin-left:-55px; width:110px; top:30px; background:rgba(255,255,255,0.3); }
.about_content .more .more_bar2{display:none;  }
.about_content .more span{left:auto; top:auto; font-size:13px; }

/*------contact----------*/

.main_contact{padding:40px 15px 0; }
.main_contact h2{font-size:25px;}
.main_contact h2:after{width:35px; height:1px; margin-top:15px;}
.main_contact p{font-size:2.5vh; line-height:160%; padding-bottom:30px;  }

.main_contact li{margin-bottom:10px; }
.contact_left{float:none; width:100%; }
.contact_right{float:none; width:100%; margin-left:0;  }
.contact_right .textarea{padding:10px; width:100%; }

.form-control{height:35px; font-size:13px; }
.main_contact span{padding-bottom:5px; font-size:2vh; }
.upfile_wrap .btn_file{width:18%; font-size:13px; line-height:35px;  }
.upfile_wrap .filename{width:82%; margin-bottom:10px; }

.contact_btn{padding:10px 0 50px; }
.contact_btn label{font-size:13px; }
.contact_submit{padding-top:0; }
.contact_submit input{padding:8px 45px 10px; font-size:15px; }
}