@charset "utf-8";

/* 초기화 */
html {overflow-y:scroll;}
body {margin:0;padding:0;font-size:0.75em; font-family:'Montserrat','Noto Sans KR', sans-serif;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}

a {text-decoration:none}
#header { position:relative; z-index:9999999; width:100%; height:90px;}



.pc-mode {}
.mobile-mode { display:none }


/* 로고 */
.logo {width:20%; display:inline-block; vertical-align:top;}
.logo .logo-inner { vertical-align: middle;}
.logo .logo-inner h1 {padding-top:20px; padding-left:0px;}

/* 메뉴고정 (스크롤시 감춰지는 영역 높이) */


.menuFix {position: fixed;   top: 0; left: 0; width: 100%; height:0px; }


/* 메뉴 (유틸메뉴 제외한 메뉴 높이 수정) */
.navFix { width: 100%; height:85px; margin:0 auto; padding:0; background: url('../images/navi-bg.png') center;  }

.nav  { width: 1024px;  margin:0 auto; padding:0; text-align:center}

/* 메뉴 */
nav {width: 100%;}
.nav_wrapper {float: right; width: 70%; transition: top .5s ease-out; display:inline-block; padding-top:20px; }

.menu {width: 100%; height: auto; font-size:0; text-align: center; }

.menu ul {padding: 0px; margin: 0px 30px 0 0; list-style: none; position: relative; display: inline-block; float: right;}
.menu > li > ul.sub_menu {min-width: 10em; padding: 4px 0; background-color: #f4f4f4; border: 1px solid #fff;}
.menu ul li {width:120px; padding:12px 0px 12px 0px;  text-align:center;   margin: 0 auto; }
.menu ul li.menu01 {width:170px; }
.menu > ul > li { display: inline-block; }

/* 메뉴 폰트사이즈 및 컬러 */
.menu ul li a {display: block; text-decoration: none; color: #1e1e1e; font-size:16px; font-family:'Montserrat','Noto Sans KR', sans-serif; font-weight:500;}

/* 메뉴 오버시 폰트컬러 */
.menu ul li a:hover {color: #997b5c;}
.menu ul li.hover > a {color: #997b5c;}

/* 1차 메뉴 넓이,간격 수정 */
.menu ul li > a {text-align:center;}




/* 메인 상단 비쥬얼 */
#main-visual {width:100%;overflow:hidden;}
#main-visual .visual-warp {width:1024px;  overflow:hidden;margin:0 auto; text-align:center;  }
#main-visual .visual-img {  position:relative;   width:100%;  height:550px;  margin:0 auto; text-align:center;  }
#main-visual .visual-warp img { width:100%; }
#main-visual .main-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:30px; left:80px }
#main-visual .wave-type { float:left;  font-size: 100px; font-weight:700;}
#main-visual .type { float:left; margin:55px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#main-visual .type li { float:left; display: inline-block; margin:0; padding: 0; font-size: 60px; font-weight:600; }
#main-visual .type li.space { margin:0px 0 0px 20px ;   }
#main-visual .type img { width:80%; }

.main-type2  {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:60px; left:30px }
#main-visual .main-type2  .type2  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; color:#6e6e6e; font-weight:300;   position: absolute; top:120px; left:80px }
#main-visual .main-type2  .type3  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; color:#92d01b; font-weight:300;   position: absolute; top:130px; left:240px }
#main-visual .main-type2  .type4  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; color:#6e6e6e; font-weight:300;   position: absolute; top:140px; left:280px }
#main-visual .main-type2  .type5  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; font-weight:300;   position: absolute; bottom:20px; left:310px }

.sub-line-warp { width:100%; height:40px;background:#93d01b;}
.sub-line-warp .sub-line {position:relative; width:100%; height:100%; margin:0 auto; padding:0;}

#main-visual .cubu {position: absolute; top:60px; right:20px}
#main-visual .cubu img {width:100%}
#main-visual .cubu-shadow  {position: absolute; bottom:10px; right:0px}

#main-visual .menu-title {position: absolute; width:30%; top:360px; left:90px}
#main-visual .menu-title img {width:100%}


.visual-menu-warp   { width:63%; margin: 0 ;    padding: 0;   position: absolute; bottom:10px; left:80px;}
.visual-menu-warp .menu-warp   { width:100%; margin: 0 auto;    padding: 0;  text-align: center }
.visual-menu-warp .visual-menu  {  width:100%; list-style:none; display: inline-block; margin: 20px 0 0 0;    padding: 0; }
.visual-menu-warp .visual-menu  li {  width:20%; height:130px; display: inline-block; float:left; margin: 0;    padding: 0;}
.visual-menu-warp .visual-menu  li .menu-button {  width:100%;height:100%; margin:0; padding: 0;}
.visual-menu-warp .visual-menu  li .menu-button:hover { background-color:rgba(0,0,0,0.3); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out;}

.visual-menu-warp .visual-menu  li p {  width:30%;margin: 0 auto;    padding:25px;  text-align: center }
.visual-menu-warp .visual-menu  li p img{  width:100%;}
.visual-menu-warp .visual-menu  li span {  width:100%; font-size:18px; color:#ffffff; line-height:20px}
.visual-menu-warp .visual-menu  li.box1 {  background:#10cbe4; }
.visual-menu-warp .visual-menu  li.box2 {  background:#81d321; }
.visual-menu-warp .visual-menu  li.box3 {  background:#d374ff;}
.visual-menu-warp .visual-menu  li.box4 {  background:#f59525; }
.visual-menu-warp .visual-menu  li.box5 {  background:#fec107; }



/* 서브 상단 비쥬얼 */
#sub-visual {width:100%;}
#sub-visual .visual-warp {position:relative; width:1024px; height:360px; margin:0 auto; text-align:center;  }
#sub-visual .visual-warp img {width:100%; }
#sub-visual .sub-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:-10px; left:80px }
#sub-visual .wave-type1 { float:left;  font-size: 100px; font-weight:700;}
#sub-visual .type2 { float:left; margin:55px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#sub-visual .type2 li { float:left; display: inline-block; margin:0; padding: 0; font-size: 60px; font-weight:600; }
#sub-visual .type2 li.space { margin:0px 0 0px 20px ;   }
#sub-visual .type2 img { width:80%; }

#sub-visual .sub-type2  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; color:#6e6e6e; font-weight:300;   position: absolute; top:120px; left:80px }
#sub-visual .sub-type3  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; color:#92d01b; font-weight:300;   position: absolute; top:130px; left:240px }
#sub-visual .sub-type4  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; color:#6e6e6e; font-weight:300;   position: absolute; top:140px; left:280px }
#sub-visual .sub-type5  {  margin: 0 0 0 0;    padding: 0; font-size: 38px; font-weight:300;   position: absolute; bottom:20px; left:310px }


.sub-line-warp { width:100%; height:55px;background:#93d01b;}
.sub-line-warp .sub-line {position:relative; width:1024px; height:100%; margin:0 auto; text-align:center}
.sub-line-warp .cubu1 {position: absolute; top:-130px; left:50px}
.sub-line-warp .cubu1 img {width:100%}
.sub-line-warp .cubu2 {position: absolute; top:-330px; right:0px}
.sub-line-warp .cubu2 img {width:90%}
.sub-line-warp .sub-title {width:72%; height:100%; background:#3088a6;float:left}
.sub-line-warp .sub-title .sub-title-img {width:59%; height:100%;float:right;text-align:left;display: inline-block;vertical-align:middle; }
.sub-line-warp .sub-title img {width:100%; margin-top:8px;}
.sub-line-warp .orang-line {width:28%; height:100%;background:#eb9e2a;float:left}


/* 서브페이지 */
.sub-warp { width:100%; margin:0 auto; padding:70px 0 100px 0; }
.container  { width: 1024px;  margin:0 auto; padding:0; text-align:center; }

.container ul.list01 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list01 li { position:relative; overflow:hidden; width:29.2%; padding: 0px; margin: 0px 20px 50px 20px;  float:left; border:1px solid #ddd;}
.container ul.list01 img { width:100%  }
.container ul.list01 p { width:100%; margin:0 auto; padding:7px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }

.container ul.list02 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list02 li { position:relative; width:20%; padding: 0px; margin: 0px 20px 40px 20px;  float:left; border:0px solid #ddd;}
.container ul.list02 img { width:100%  }
.container ul.list02 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }

.container ul.list03 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list03 li { position:relative; width:20.7%; padding: 0px; margin: 0px 21px 40px 21px;  float:left; border:1px solid #ddd;}
.container ul.list03 img { width:100%  }
.container ul.list03 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }


/* copyright */
.tail-line-warp { position:relative; width:100%; height:5px;background:#93d01b;}
.tail-line-warp .tail-line {width:1024px; height:100%; margin:0 auto; text-align:center}
.tail-line-warp .tail-title {width:72%; height:100%; background:#3088a6;float:left}
.tail-line-warp .orang-line {width:28%; height:100%;background:#eb9e2a;float:left}

#copyright .copyright-warp { width:100%; overflow:hidden; background:#2d8ab2;margin:30px 0 0 0; padding:0 0 100px 0; bottom:0}
#copyright .copyright {width:100%; background: url('../images/tail-bg.png') center; }
#copyright .copyright-con {background: url('../images/copyright.png') center;  width:1024px;height:165px; margin:0 auto; text-align:center; padding:0px 0 0px 0px; }
#copyright .copyright-con img { width:166px; padding-top:50px;}
#copyright .copyright-con .copy-text1 {width:100%; margin:0 auto; text-align:center; padding:10px 0 0px 0px; font-size:14px; color:#ebe9b7}
#copyright .copyright-con .copy-text2 {width:100%; margin:0 auto; text-align:center; padding:3px 0 0px 0px; font-size:12px; color:#ffffff}
/*---------Authar Style----------*/


 /* TOP버튼 */
#go-top {position: fixed; right:20px; bottom:50px;  }
#go-top img {width:100%; }

#go-top a.top { width:60px; height:40px; display: block; cursor:pointer; text-align: center; font-size:12px; font-weight:600; padding-top:22px; color: #FFF; 
background-color:rgba(0,0,0,0.6); background-image: url('../images/top-bg.png'); background-repeat:no-repeat; background-position: center 18px; 
border-radius:100px; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s;}
#go-top a:hover { color: #FFF;}
#go-top div { margin-top:8px;}

#go-top .naver-talk {cursor:pointer; width:60px; height:60px;margin-bottom:5px; border-radius:100px; -webkit-transition: 1s; -moz-transition: 1s; transition: 1s; 
background-image: url('../images/navertalk-right.png'); background-repeat:no-repeat; background-position: center; }










@media all and (min-width:600px) and (max-width:900px) { 

 
.mobile-mode { display:inline-block; width:100%;}
.pc-mode {display:none;}


/* 로고 */
.logo {width:25%; height:100%; display:inline-block; vertical-align:top;float:left;}
.logo .logo-inner { vertical-align: middle; }
.logo .logo-inner h1 img {width:230px;}
.logo .logo-inner h1 {padding-top:23px; padding-left:15px;}



  /* 메뉴 */
.navFix { width: 100%; height:85px; margin:0 auto; padding:0; background: url('../images/navi-bg.png') center;  }
.nav  { width: 100%; margin:0 auto; padding:0; text-align:center}

.side-button { cursor: pointer; display: inline-block;  z-index: 99; height: 30px;  width: 30px; margin:25px 20px 0 0; float: right; }
.side-button i { font-size:30px;}
.side-fix-button {  cursor: pointer; display: inline-block; top:0;  padding:5px 0 5px 20px;  width: 100%; text-align:left; background:#000000}
.side-fix-button i { font-size:30px; }


/* 메인 상단 비쥬얼 */
#main-visual {width:100%;}
#main-visual .visual-warp {position:relative; width:100%; height:470px; margin:0 auto; padding:0;text-align:center;}

#main-visual .visual-warp {background: url('../images/main-visual-mobile.jpg') center no-repeat; background-size:cover;}


#main-visual .visual-warp img { width:100%;}
#main-visual .main-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:-10px; left:40px }
#main-visual .wave-type { float:left;  font-size: 100px; font-weight:700;}
#main-visual .type { float:left; margin:30px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#main-visual .type li { float:left; display: inline-block; margin:0; padding: 0; font-size: 80px; font-weight:600; }
#main-visual .type li.space { margin:0px 0 0px 10px ;   }
#main-visual .type img { width:100%; }


.main-type2  {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:3px; left:0px }
#main-visual .main-type2 .type2  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; color:#6e6e6e; font-weight:300;   position: absolute; top:130px; left:60px }
#main-visual .main-type2 .type3  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; color:#92d01b; font-weight:300;   position: absolute; top:180px; left:170px }
#main-visual .main-type2 .type4  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; color:#6e6e6e; font-weight:300;   position: absolute; top:220px; left:130px }
#main-visual .main-type2 .type5  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; font-weight:300;   position: absolute; bottom:10px; left:10px; text-align:left }
#main-visual .main-type2 .type5  img {  width:70% }


#main-visual .cubu {position: absolute; top:25px; right:-0px; float:right; text-align:right;z-index:200}
#main-visual .cubu img {width:105%}
#main-visual .cubu-shadow  {position: absolute; bottom:0px; right:40px}

#main-visual .menu-title {position: absolute; width:65%; top:355px; left:20px; text-align:left; z-index:200}
#main-visual .menu-title img {width:80%}


#main-visual .main-line-warp { width:100%; height:60px; position: absolute; top:410px; left:0px; margin:0 auto; padding:0; background:#2d8ab2;}
#main-visual .main-line-warp .main-line { width:100%; height:100%; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-title {width:100%;height:100%;float:left; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-title .main-title-text {width:80%;height:100%;margin:0 auto; float:left;   padding:0;}
#main-visual .main-line-warp .main-title .main-title-text h3 {width:100%;height:100%;margin:0 auto; padding:10px 0 0 20px;text-align:left; font-size:27px; color:#ebe9b7}
#main-visual .main-line-warp .main-title .main-title-text img {width:80%; margin-top:10px;}
#main-visual .main-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left;margin:0 auto; padding:0;}


.m-visual-menu-warp   { width:100%; margin: 0 ;  padding: 0; }
.m-visual-menu-warp .menu-warp   { width:100%; margin:0 auto;    padding:0;  text-align: center }
.m-visual-menu-warp .visual-menu  {  width:100%; list-style:none; display: inline-block; margin:0; padding:0; }
.m-visual-menu-warp .visual-menu  li {  width:50%; height:200px; display: inline-block; float:left; margin:0;    padding:10px 0 0 0;}
.m-visual-menu-warp .visual-menu  li .menu-button {  width:100%;height:100%; margin:0; padding:0;}
.m-visual-menu-warp .visual-menu  li p {  width:25%;margin: 0 auto;    padding:25px;  text-align: center }
.m-visual-menu-warp .visual-menu  li p img{  width:85%;}
.m-visual-menu-warp .visual-menu  li span {  width:100%; font-size:26px; color:#ffffff; line-height:0px;margin:0; padding:0;}
.m-visual-menu-warp .visual-menu  li.box1 {  background:#00bcd5; }
.m-visual-menu-warp .visual-menu  li.box2 {  background:#8cc34b; }
.m-visual-menu-warp .visual-menu  li.box3 {  background: #cf7ff4;}
.m-visual-menu-warp .visual-menu  li.box4 {  background:#ff9801; }
.m-visual-menu-warp .visual-menu   li.box5 {  background:#fec107; }
.m-visual-menu-warp .visual-menu   li.box6 {  background:#52c334; }


/* 서브 상단 비쥬얼 */
#sub-visual {width:100%; overflow:hidden;}
#sub-visual .visual-warp {position:relative; width:100%; height:350px; margin:0 auto; text-align:center;  }
#sub-visual .visual-warp img { width:70%;}
#sub-visual .sub-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:-10px; left:40px }
#sub-visual .wave-type1 { float:left;  font-size: 100px; font-weight:700;}
#sub-visual .type2 { float:left; margin:30px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#sub-visual .type2 li  { float:left; display: inline-block; margin:0; padding: 0; font-size: 80px; font-weight:600; }
#sub-visual .type2 li.space { margin:0px 0 0px 10px ;   }
#sub-visual .type2 img { width:80%; }

#sub-visual .sub-type2  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; color:#6e6e6e; font-weight:300;   position: absolute; top:130px; left:60px }
#sub-visual .sub-type3  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; color:#92d01b; font-weight:300;   position: absolute; top:180px; left:170px }
#sub-visual .sub-type4  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; color:#6e6e6e; font-weight:300;   position: absolute; top:220px; left:130px }
#sub-visual .sub-type5  {  margin: 0 0 0 0;    padding: 0; font-size: 42px; font-weight:300;   position: absolute; bottom:10px; left:10px; text-align:left }
#sub-visual .sub-type5  img {  width:100% }




.sub-line-warp { width:100%; height:60px;background:#93d01b;}
.sub-line-warp .sub-line {position:relative; width:100%; height:100%; margin:0 auto; padding:0;}
.sub-line-warp .cubu1 {display:none }
.sub-line-warp .cubu2 {position: absolute; top:-350px; right:0px; float:right; text-align:right;}
.sub-line-warp .cubu2 img {width:100%}
.sub-line-warp .sub-title {width:80%; height:100%;background:#3088a6;float:left}
.sub-line-warp .sub-title .sub-title-img {width:100%; height:100%;float:left;text-align:left;display: inline-block;vertical-align:middle; }
.sub-line-warp .sub-title img {width:75%; margin-top:6px;}
.sub-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left}



/* 서브페이지 */
.sub-warp { width:100%; margin:0 auto; padding:40px 0 0px 0; }
.container  { width: 100%;  margin:0 auto; padding:0; text-align:center;}

.container ul.list01 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list01 li { position:relative; width:45.8%; padding: 0px; margin: 0px 15px 35px 15px;  float:left; border:1px solid #ddd;}
.container ul.list01 img { width:100%  }
.container ul.list01 p { width:80%; margin:0 auto; padding:10px 0 0 40px; font-size:14px; color:#858585; text-align:left;position: absolute; top:0;  }


.container ul.list02 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list02 li { position:relative; width:41%;padding: 0px; margin: 0px 12px 40px 19px;  float:left; border:0px solid #ddd;}
.container ul.list02 img { width:100%  }
.container ul.list02 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }


.container ul.list03 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list03 li { position:relative; width:30%;padding: 0px; margin: 0px 6px 30px 15px;  float:left; border:1px solid #ddd;}
.container ul.list03 img { width:100%  }
.container ul.list03 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }


/* copyright */
.tail-line-warp { position:relative; width:100%; height:5px;background:#93d01b;}
.tail-line-warp .tail-line {width:100%; height:100%; margin:0 auto; text-align:center}
.tail-line-warp .tail-title {width:72%; height:100%; background:#3088a6;float:left}
.tail-line-warp .orang-line {width:28%; height:100%;background:#eb9e2a;float:left}

#copyright .copyright-warp { width:100%; overflow:hidden; background:#2d8ab2;margin:0px 0 0 0; padding:0 0 100px 0; bottom:0}
#copyright .copyright {width:100%; background: url('../images/tail-bg.png') center; }
#copyright .copyright-con {width:100%; height:158px; margin:0 auto; text-align:center; padding:0px 0 0px 0px; background: url('../images/mobile-copyright.jpg') center; }
#copyright .copyright-con img { width:186px; padding-top:60px;}
#copyright .copyright-con .copy-text1 {width:100%; margin:0 auto; text-align:center; padding:10px 0 0px 0px; font-size:18px; color:#ebe9b7}
#copyright .copyright-con .copy-text2 {width:100%; margin:0 auto; text-align:center; padding:10px 0 50px 0px; font-size:14px; color:#ffffff}


#copyright .copyright-con p.tel  {margin:0 auto; padding:0px 0 0 0; line-height:16px; font-size:20px; color:#ebe9b7; }
#copyright .copyright-con p.email  {margin:0 auto; padding:10px 0 0px 0px;line-height:16px; font-size:20px; color:#ebe9b7;}
#copyright .copyright-con i {margin:0 auto; padding:0px 10px 0px 0px; }



/**************************** 오른쪽 사이드 슬라이딩 메뉴 ***********************************/
/* Menu Appearance */



.pushyRight { position: fixed; width: 350px; height: 100%; text-align:top;  top: 0; z-index: 9999999999; background: #2d8ab2;  /* enables momentum scrolling in iOS overflow elements */}    
/* Menu Movement */
.pushy-right{    right:0px;
    -webkit-transform: translate3d(350px,0,0);
    -moz-transform: translate3d(350px,0,0);
    -ms-transform: translate3d(350px,0,0);
    -o-transform: translate3d(350px,0,0);
    transform: translate3d(350px,0,0);
}
.pushy-right-open{    right:0px;
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.container-right-push{    -webkit-transform: translate3d(-350px,0,0);
    -moz-transform: translate3d(-350px,0,0);
    -ms-transform: translate3d(-350px,0,0);
    -o-transform: translate3d(-350px,0,0);
    transform: translate3d(-350px,0,0);
}

.push-push{   -webkit-transform: translate3d(350px,0,0);
    -moz-transform: translate3d(350px,0,0);
    -ms-transform: translate3d(350px,0,0);
    -o-transform: translate3d(350px,0,0);
    transform: translate3d(350px,0,0);
}
/* Menu Transitions */
.pushy, #container, .push{
    -webkit-transition: -webkit-transform .2s cubic-bezier(.16, .68, .43, .99);
    -moz-transition: -moz-transform .2s cubic-bezier(.16, .68, .43, .99);
    -o-transition: -o-transform .2s cubic-bezier(.16, .68, .43, .99);
    transition: transform .2s cubic-bezier(.16, .68, .43, .99);
}
/* Site Overlay */
.overlay-pushy{    display: none;}
.overlay-pushy.overlay-active {display: block; position: fixed;top: 0; right: 0;bottom: 0;left: 0; z-index: 999999999;    
        background-color: rgba(0,0,0,0.8);
        -webkit-animation: fade 500ms; 
    -moz-animation: fade 500ms; 
    -o-animation: fade 500ms;
    animation: fade 500ms;
}


.right_warp { width:100%; height:100%;  text-align:center;background: #2d8ab2; z-index:900;  overflow-y: scroll;  overflow-x: hidden; }


.right_warp .main-line-warp { width:100%; height:60px; margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-line { width:100%; height:100%; margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-title {width:100%;height:100%;background:#2d8ab2;margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-title .main-title-text {width:100%;height:100%;margin:0 auto;   padding:0;}
.right_warp .main-line-warp .main-title .main-title-text h3 {width:100%;height:100%;margin:0 auto; padding:15px 0 0 0px; font-size:20px; color:#ebe9b7}
.right_warp .main-line-warp .main-title .main-title-text img {width:80%; margin-top:10px;}
.right_warp .main-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left;margin:0 auto; padding:0;}


.right_warp .m-visual-menu-warp   { width:100%; margin: 0 ;  padding: 0; }
.right_warp .menu-warp   { width:100%; margin:0 auto;    padding:0;  text-align: center }
.right_warp .visual-menu  {  width:100%; list-style:none; display: inline-block; margin:0; padding:0; }
.right_warp .visual-menu  li {  width:50%; height:180px; display: inline-block; float:left; margin:0;    padding:20px 0 0 0;}
.right_warp .visual-menu  li .menu-button {  width:100%;height:100%; margin:0; padding:0;}
.right_warp .visual-menu  li p {  width:35%;margin: 0 auto;    padding:25px;  text-align: center }
.right_warp .visual-menu  li p img{  width:100%;}
.right_warp .visual-menu  li span {  width:100%; font-size:16px; color:#ffffff; line-height:0px;margin:0; padding:0;}
.right_warp .visual-menu  li.box1 {  background:#00bcd5; }
.right_warp .visual-menu  li.box2 {  background:#8cc34b; }
.right_warp .visual-menu  li.box3 {  background: #cf7ff4;}
.right_warp .visual-menu  li.box4 {  background:#ff9801; }
.right_warp .visual-menu   li.box5 {  background:#fec107; }
.right_warp .visual-menu   li.box6 {  background:#52c334; }




.right_warp .copyright-con {width:90%;  margin:0 auto; text-align:center; padding:0px;  background:#2d8ab2;}
.right_warp .copyright-con p.text { margin:0 auto;  padding:20px 0 0px 0px; font-size:12px; color:#ebe9b7; }
.right_warp .copyright-con p.tel  {margin:0 auto; padding:10px 0 0 0; line-height:16px; font-size:16px; color:#ebe9b7; }
.right_warp .copyright-con p.email  {margin:0 auto; padding:10px 0 0px 0px;line-height:16px; font-size:16px; color:#ebe9b7;}
.right_warp .copyright-con i {margin:0 auto; padding:0px 10px 0px 0px; color:#ebe9b7; }

.right_warp .quickIco {width:100%; margin:5px 0 5px 5px;}
.right_warp .quickIco ul {width:100%; letter-spacing:-4px;}
.right_warp .quickIco li {float:left; width:48%;height:28px;letter-spacing:0;margin:2px 2px 2px 2px; }
.right_warp .quickIco li a {display:block;line-height:28px;border:1px solid #dfdfdf;font-size:13px;color:#333;padding:0 0 0 15px;text-align:left;}
.right_warp .quickIco li a:hover{background:#f4f4f4;text-decoration:none;font-weight:bold;}
.right_warp .quickIco li a i{line-height:28px; top:10px;margin:0px 4px 0 0;font-size:13px;color:#777;}  




.right_warp  h4 {display:block;line-height:28px;margin:10px 0 0px;border-top:1px dotted #888;border-bottom:1px dotted #888;
font-size:16px;font-weight:normal;text-align:center;letter-spacing:-0.05em; background:#f7f7f7; }
.right_wap  .oper_time{ width:87%;margin:0 auto;text-align:center;font-size:11px;line-height:17px; padding:10px 0 30px 0;}
.right_warp  .oper_time .phone{margin:0 0 10px;line-height:21px;font-size:20px;font-weight:700;letter-spacing:-0.05em;}
.right_warp  .oper_time strong{padding-right:10px;color:#333;}

.right_warp  .oper_time i {padding-right:10px;color:#333; }r



 
 }






@media all and (min-width:200px) and (max-width:580px) { 

 
.mobile-mode { display:inline-block; width:100%;}
.pc-mode {display:none;}


/* 로고 */
.logo {width:25%; height:100%; display:inline-block; vertical-align:top;float:left;}
.logo .logo-inner { vertical-align: middle; }
.logo .logo-inner h1 img {width:180px;}
.logo .logo-inner h1 {padding-top:23px; padding-left:15px;}



  /* 메뉴 */
.navFix { width: 100%; height:85px; margin:0 auto; padding:0; background: url('../images/navi-bg.png') center;  }
.nav  { width: 100%; margin:0 auto; padding:0; text-align:center}

.side-button { cursor: pointer; display: inline-block;  z-index: 99; height: 30px;  width: 30px; margin:25px 20px 0 0; float: right; }
.side-button i { font-size:30px;}
.side-fix-button {  cursor: pointer; display: inline-block; top:0;  padding:5px 0 5px 20px;  width: 100%; text-align:left; background:#000000}
.side-fix-button i { font-size:30px; }


/* 메인 상단 비쥬얼 */
#main-visual {width:100%;}
#main-visual .visual-warp {position:relative; width:100%; height:270px; margin:0 auto; padding:0;text-align:center;}

#main-visual .visual-warp {background: url('../images/main-visual-mobile.jpg') center no-repeat; background-size:cover;}


#main-visual .visual-warp img { width:100%;}
#main-visual .main-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:-20px; left:10px }
#main-visual .wave-type { float:left;  font-size: 60px; font-weight:700;}
#main-visual .type { float:left; margin:30px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#main-visual .type li { float:left; display: inline-block; margin:0; padding: 0; font-size: 40px; font-weight:600; }
#main-visual .type li.space { margin:0px 0 0px 10px ;   }
#main-visual .type img { width:100%; }


.main-type2  {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:3px; left:0px }
#main-visual .main-type2 .type2  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; color:#6e6e6e; font-weight:300;   position: absolute; top:70px; left:20px }
#main-visual .main-type2 .type3  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; color:#92d01b; font-weight:300;   position: absolute; top:100px; left:90px }
#main-visual .main-type2 .type4  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; color:#6e6e6e; font-weight:300;   position: absolute; top:120px; left:60px }
#main-visual .main-type2 .type5  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; font-weight:300;   position: absolute; bottom:10px; left:10px; text-align:left }
#main-visual .main-type2 .type5  img {  width:70% }


#main-visual .cubu {position: absolute; top:25px; right:-0px; float:right; text-align:right;z-index:200}
#main-visual .cubu img {width:57%}
#main-visual .cubu-shadow  {position: absolute; bottom:0px; right:40px}

#main-visual .menu-title {position: absolute; width:65%; top:200px; left:10px; z-index:200}
#main-visual .menu-title img {width:95%}


#main-visual .main-line-warp { width:100%; height:40px;position: absolute; top:230px; left:0px; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-line { width:100%; height:100%; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-title {width:100%;height:100%;background:#2d8ab2;float:left; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-title .main-title-text {width:100%;height:100%;margin:0 auto; float:left;   padding:0;}
#main-visual .main-line-warp .main-title .main-title-text h3 {width:100%;height:100%;margin:0 auto; padding:5px 0 0 10px;text-align:left; font-size:20px; color:#ebe9b7}
#main-visual .main-line-warp .main-title .main-title-text img {width:80%; margin-top:10px;}
#main-visual .main-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left;margin:0 auto; padding:0;}


.m-visual-menu-warp   { width:100%; margin: 0 ;  padding: 0; }
.m-visual-menu-warp .menu-warp   { width:100%; margin:0 auto;    padding:0;  text-align: center }
.m-visual-menu-warp .visual-menu  {  width:100%; list-style:none; display: inline-block; margin:0; padding:0; }
.m-visual-menu-warp .visual-menu  li {  width:50%; height:140px; display: inline-block; float:left; margin:0;    padding:0;}
.m-visual-menu-warp .visual-menu  li .menu-button {  width:100%;height:100%; margin:0; padding:0;}
.m-visual-menu-warp .visual-menu  li p {  width:25%;margin: 0 auto;    padding:25px;  text-align: center }
.m-visual-menu-warp .visual-menu  li p img{  width:100%;}
.m-visual-menu-warp .visual-menu  li span {  width:100%; font-size:20px; color:#ffffff; line-height:0px;margin:0; padding:0;}
.m-visual-menu-warp .visual-menu  li.box1 {  background:#00bcd5; }
.m-visual-menu-warp .visual-menu  li.box2 {  background:#8cc34b; }
.m-visual-menu-warp .visual-menu  li.box3 {  background: #cf7ff4;}
.m-visual-menu-warp .visual-menu  li.box4 {  background:#ff9801; }
.m-visual-menu-warp .visual-menu   li.box5 {  background:#fec107; }
.m-visual-menu-warp .visual-menu   li.box6 {  background:#52c334; }


/* 서브 상단 비쥬얼 */
#sub-visual {width:100%;}
#sub-visual .visual-warp {position:relative; width:100%; height:210px; margin:0 auto; text-align:center; background:red }
#sub-visual .visual-warp img { width:100%;}
#sub-visual .sub-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:-20px; left:10px }
#sub-visual .wave-type1 { float:left;  font-size: 55px; font-weight:700;}
#sub-visual .type2 { float:left; margin:30px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#sub-visual .type2 li { float:left; display: inline-block; margin:0; padding: 0; font-size: 35px; font-weight:600; }
#sub-visual .type2 li.space { margin:0px 0 0px 10px ;   }
#sub-visual .type2 img { width:80%; }

#sub-visual .sub-type2  {  margin: 0 0 0 0;    padding: 0; font-size: 20px; color:#6e6e6e; font-weight:300;   position: absolute; top:60px; left:20px }
#sub-visual .sub-type3  {  margin: 0 0 0 0;    padding: 0; font-size: 20px; color:#92d01b; font-weight:300;   position: absolute; top:85px; left:80px }
#sub-visual .sub-type4  {  margin: 0 0 0 0;    padding: 0; font-size: 20px; color:#6e6e6e; font-weight:300;   position: absolute; top:110px; left:40px }
#sub-visual .sub-type5  {  margin: 0 0 0 0;    padding: 0; font-size: 20px; font-weight:300;   position: absolute; bottom:10px; left:10px; text-align:left }
#sub-visual .sub-type5  img {  width:60% }

.sub-line-warp { width:100%; height:40px;background:#93d01b;}
.sub-line-warp .sub-line {position:relative; width:100%; height:100%; margin:0 auto; padding:0;}
.sub-line-warp .cubu1 {display:none }
.sub-line-warp .cubu2 {position: absolute; top:-190px; right:0px; float:right; text-align:right;}
.sub-line-warp .cubu2 img {width:55%}
.sub-line-warp .sub-title {width:80%; height:100%;background:#3088a6;float:left}
.sub-line-warp .sub-title .sub-title-img {width:100%; height:100%;float:left;text-align:left;display: inline-block;vertical-align:middle; }
.sub-line-warp .sub-title img {width:100%; margin-top:6px;}
.sub-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left}



/* 서브페이지 */
.sub-warp { width:100%; margin:0 auto; padding:40px 0 0px 0; }
.container  { width: 100%;  margin:0 auto; padding:0; text-align:center;}

.container ul.list01 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list01 li { position:relative; width:90%; padding: 0px; margin: 0px 20px 35px 20px;  float:left; border:1px solid #ddd;}
.container ul.list01 img { width:100%  }
.container ul.list01 p { width:80%; margin:0 auto; padding:10px 0 0 40px; font-size:14px; color:#858585; text-align:left;position: absolute; top:0;  }


.container ul.list02 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list02 li { position:relative; width:41%;padding: 0px; margin: 0px 12px 40px 19px;  float:left; border:0px solid #ddd;}
.container ul.list02 img { width:100%  }
.container ul.list02 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }


.container ul.list03 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list03 li { position:relative; width:43%;padding: 0px; margin: 0px 6px 30px 12px;  float:left; border:1px solid #ddd;}
.container ul.list03 img { width:100%  }
.container ul.list03 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }


/* copyright */
.tail-line-warp { position:relative; width:100%; height:5px;background:#93d01b;}
.tail-line-warp .tail-line {width:100%; height:100%; margin:0 auto; text-align:center}
.tail-line-warp .tail-title {width:72%; height:100%; background:#3088a6;float:left}
.tail-line-warp .orang-line {width:28%; height:100%;background:#eb9e2a;float:left}

#copyright .copyright-warp { width:100%; overflow:hidden; background:#2d8ab2;margin:0px 0 0 0; padding:0 0 50px 0; bottom:0}
#copyright .copyright {width:100%; background: url('../images/tail-bg.png') center; }
#copyright .copyright-con {width:100%; height:158px; margin:0 auto; text-align:center; padding:0px 0 0px 0px; background: url('../images/mobile-copyright.jpg') center; }
#copyright .copyright-con img { width:166px; padding-top:40px;}
#copyright .copyright-con .copy-text1 {width:100%; margin:0 auto; text-align:center; padding:10px 0 0px 0px; font-size:12px; color:#ebe9b7}
#copyright .copyright-con .copy-text2 {width:100%; margin:0 auto; text-align:center; padding:10px 0 50px 0px; font-size:10px; color:#ffffff}


#copyright .copyright-con p.tel  {margin:0 auto; padding:0px 0 0 0; line-height:16px; font-size:16px; color:#ebe9b7; }
#copyright .copyright-con p.email  {margin:0 auto; padding:10px 0 0px 0px;line-height:16px; font-size:16px; color:#ebe9b7;}
#copyright .copyright-con i {margin:0 auto; padding:0px 10px 0px 0px; }



/**************************** 오른쪽 사이드 슬라이딩 메뉴 ***********************************/
/* Menu Appearance */



.pushyRight { position: fixed; width: 250px; height: 100%; text-align:top;  top: 0; z-index: 9999999999; background: #2d8ab2;  /* enables momentum scrolling in iOS overflow elements */}    
/* Menu Movement */
.pushy-right{    right:0px;
    -webkit-transform: translate3d(250px,0,0);
    -moz-transform: translate3d(250px,0,0);
    -ms-transform: translate3d(250px,0,0);
    -o-transform: translate3d(250px,0,0);
    transform: translate3d(250px,0,0);
}
.pushy-right-open{    right:0px;
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.container-right-push{    -webkit-transform: translate3d(-250px,0,0);
    -moz-transform: translate3d(-250px,0,0);
    -ms-transform: translate3d(-250px,0,0);
    -o-transform: translate3d(-250px,0,0);
    transform: translate3d(-250px,0,0);
}

.push-push{   -webkit-transform: translate3d(250px,0,0);
    -moz-transform: translate3d(250px,0,0);
    -ms-transform: translate3d(250px,0,0);
    -o-transform: translate3d(250px,0,0);
    transform: translate3d(250px,0,0);
}
/* Menu Transitions */
.pushy, #container, .push{
    -webkit-transition: -webkit-transform .2s cubic-bezier(.16, .68, .43, .99);
    -moz-transition: -moz-transform .2s cubic-bezier(.16, .68, .43, .99);
    -o-transition: -o-transform .2s cubic-bezier(.16, .68, .43, .99);
    transition: transform .2s cubic-bezier(.16, .68, .43, .99);
}
/* Site Overlay */
.overlay-pushy{    display: none;}
.overlay-pushy.overlay-active {display: block; position: fixed;top: 0; right: 0;bottom: 0;left: 0; z-index: 999999999;    
        background-color: rgba(0,0,0,0.8);
        -webkit-animation: fade 500ms; 
    -moz-animation: fade 500ms; 
    -o-animation: fade 500ms;
    animation: fade 500ms;
}


.right_warp { width:100%; height:100%;  text-align:center;background: #2d8ab2; z-index:900;  overflow-y: scroll;  overflow-x: hidden; }


.right_warp .main-line-warp { width:100%; height:60px; margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-line { width:100%; height:100%; margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-title {width:100%;height:100%;background:#2d8ab2;margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-title .main-title-text {width:100%;height:100%;margin:0 auto;   padding:0;}
.right_warp .main-line-warp .main-title .main-title-text h3 {width:100%;height:100%;margin:0 auto; padding:15px 0 0 0px; font-size:20px; color:#ebe9b7}
.right_warp .main-line-warp .main-title .main-title-text img {width:80%; margin-top:10px;}
.right_warp .main-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left;margin:0 auto; padding:0;}


.right_warp .m-visual-menu-warp   { width:100%; margin: 0 ;  padding: 0; }
.right_warp .menu-warp   { width:100%; margin:0 auto;    padding:0;  text-align: center }
.right_warp .visual-menu  {  width:100%; list-style:none; display: inline-block; margin:0; padding:0; }
.right_warp .visual-menu  li {  width:50%; height:130px; display: inline-block; float:left; margin:0;    padding:0;}
.right_warp .visual-menu  li .menu-button {  width:100%;height:100%; margin:0; padding:0;}
.right_warp .visual-menu  li p {  width:35%;margin: 0 auto;    padding:25px;  text-align: center }
.right_warp .visual-menu  li p img{  width:100%;}
.right_warp .visual-menu  li span {  width:100%; font-size:16px; color:#ffffff; line-height:0px;margin:0; padding:0;}
.right_warp .visual-menu  li.box1 {  background:#00bcd5; }
.right_warp .visual-menu  li.box2 {  background:#8cc34b; }
.right_warp .visual-menu  li.box3 {  background: #cf7ff4;}
.right_warp .visual-menu  li.box4 {  background:#ff9801; }
.right_warp .visual-menu   li.box5 {  background:#fec107; }
.right_warp .visual-menu   li.box6 {  background:#52c334; }




.right_warp .copyright-con {width:90%;  margin:0 auto; text-align:center; padding:0px;  background:#2d8ab2;}
.right_warp .copyright-con p.text { margin:0 auto;  padding:20px 0 0px 0px; font-size:12px; color:#ebe9b7; }
.right_warp .copyright-con p.tel  {margin:0 auto; padding:10px 0 0 0; line-height:16px; font-size:16px; color:#ebe9b7; }
.right_warp .copyright-con p.email  {margin:0 auto; padding:10px 0 0px 0px;line-height:16px; font-size:16px; color:#ebe9b7;}
.right_warp .copyright-con i {margin:0 auto; padding:0px 10px 0px 0px; color:#ebe9b7; }

.right_warp .quickIco {width:100%; margin:5px 0 5px 5px;}
.right_warp .quickIco ul {width:100%; letter-spacing:-4px;}
.right_warp .quickIco li {float:left; width:48%;height:28px;letter-spacing:0;margin:2px 2px 2px 2px; }
.right_warp .quickIco li a {display:block;line-height:28px;border:1px solid #dfdfdf;font-size:13px;color:#333;padding:0 0 0 15px;text-align:left;}
.right_warp .quickIco li a:hover{background:#f4f4f4;text-decoration:none;font-weight:bold;}
.right_warp .quickIco li a i{line-height:28px; top:10px;margin:0px 4px 0 0;font-size:13px;color:#777;}  




.right_warp  h4 {display:block;line-height:28px;margin:10px 0 0px;border-top:1px dotted #888;border-bottom:1px dotted #888;
font-size:16px;font-weight:normal;text-align:center;letter-spacing:-0.05em; background:#f7f7f7; }
.right_wap  .oper_time{ width:87%;margin:0 auto;text-align:center;font-size:11px;line-height:17px; padding:10px 0 30px 0;}
.right_warp  .oper_time .phone{margin:0 0 10px;line-height:21px;font-size:20px;font-weight:700;letter-spacing:-0.05em;}
.right_warp  .oper_time strong{padding-right:10px;color:#333;}

.right_warp  .oper_time i {padding-right:10px;color:#333; }r



 
 }





@media all and (min-width:350px) and (max-width:480px)
 {

.mobile-mode { display:inline-block; width:100%;}
.pc-mode {display:none;}


/* 로고 */
.logo {width:25%; height:100%; display:inline-block; vertical-align:top;float:left;}
.logo .logo-inner { vertical-align: middle; }
.logo .logo-inner h1 img {width:200px;}
.logo .logo-inner h1 {padding-top:23px; padding-left:15px;}



  /* 메뉴 */
.navFix { width: 100%; height:85px; margin:0 auto; padding:0; background: url('../images/navi-bg.png') center;  }
.nav  { width: 100%; margin:0 auto; padding:0; text-align:center}

.side-button { cursor: pointer; display: inline-block;  z-index: 99; height: 30px;  width: 30px; margin:25px 20px 0 0; float: right; }
.side-button i { font-size:30px;}
.side-fix-button {  cursor: pointer; display: inline-block; top:0;  padding:5px 0 5px 20px;  width: 100%; text-align:left; background:#000000}
.side-fix-button i { font-size:30px; }


/* 메인 상단 비쥬얼 */
#main-visual {width:100%;}
#main-visual .visual-warp {position:relative; width:100%; height:270px; margin:0 auto; padding:0;text-align:center;}

#main-visual .visual-warp {background: url('../images/main-visual-mobile.jpg') center no-repeat; background-size:cover;}


#main-visual .visual-warp img { width:100%;}
#main-visual .main-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:-20px; left:10px }
#main-visual .wave-type { float:left;  font-size: 65px; font-weight:700;}
#main-visual .type { float:left; margin:30px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#main-visual .type li { float:left; display: inline-block; margin:0; padding: 0; font-size: 45px; font-weight:600; }
#main-visual .type li.space { margin:0px 0 0px 10px ;   }
#main-visual .type img { width:100%; }


.main-type2  {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:3px; left:0px }
#main-visual .main-type2 .type2  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; color:#6e6e6e; font-weight:300;   position: absolute; top:70px; left:20px }
#main-visual .main-type2 .type3  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; color:#92d01b; font-weight:300;   position: absolute; top:100px; left:90px }
#main-visual .main-type2 .type4  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; color:#6e6e6e; font-weight:300;   position: absolute; top:120px; left:60px }
#main-visual .main-type2 .type5  {  margin: 0 0 0 0;    padding: 0; font-size: 23px; font-weight:300;   position: absolute; bottom:10px; left:10px; text-align:left }
#main-visual .main-type2 .type5  img {  width:70% }


#main-visual .cubu {position: absolute; top:25px; right:-0px; float:right; text-align:right;z-index:200}
#main-visual .cubu img {width:57%}
#main-visual .cubu-shadow  {position: absolute; bottom:0px; right:40px}

#main-visual .menu-title {position: absolute; width:65%; top:200px; left:10px; z-index:200}
#main-visual .menu-title img {width:100%}


#main-visual .main-line-warp { width:100%; height:40px;position: absolute; top:230px; left:0px; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-line { width:100%; height:100%; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-title {width:100%;height:100%;background:#2d8ab2;float:left; margin:0 auto; padding:0;}
#main-visual .main-line-warp .main-title .main-title-text {width:100%;height:100%;margin:0 auto; float:left;   padding:0;}
#main-visual .main-line-warp .main-title .main-title-text h3 {width:100%;height:100%;margin:0 auto; padding:5px 0 0 10px;text-align:left; font-size:20px; color:#ebe9b7}
#main-visual .main-line-warp .main-title .main-title-text img {width:80%; margin-top:10px;}
#main-visual .main-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left;margin:0 auto; padding:0;}


.m-visual-menu-warp   { width:100%; margin: 0 ;  padding: 0; }
.m-visual-menu-warp .menu-warp   { width:100%; margin:0 auto;    padding:0;  text-align: center }
.m-visual-menu-warp .visual-menu  {  width:100%; list-style:none; display: inline-block; margin:0; padding:0; }
.m-visual-menu-warp .visual-menu  li {  width:50%; height:140px; display: inline-block; float:left; margin:0;    padding:0;}
.m-visual-menu-warp .visual-menu  li .menu-button {  width:100%;height:100%; margin:0; padding:0;}
.m-visual-menu-warp .visual-menu  li p {  width:25%;margin: 0 auto;    padding:25px;  text-align: center }
.m-visual-menu-warp .visual-menu  li p img{  width:100%;}
.m-visual-menu-warp .visual-menu  li span {  width:100%; font-size:20px; color:#ffffff; line-height:0px;margin:0; padding:0;}
.m-visual-menu-warp .visual-menu  li.box1 {  background:#00bcd5; }
.m-visual-menu-warp .visual-menu  li.box2 {  background:#8cc34b; }
.m-visual-menu-warp .visual-menu  li.box3 {  background: #cf7ff4;}
.m-visual-menu-warp .visual-menu  li.box4 {  background:#ff9801; }
.m-visual-menu-warp .visual-menu   li.box5 {  background:#fec107; }
.m-visual-menu-warp .visual-menu   li.box6 {  background:#52c334; }


/* 서브 상단 비쥬얼 */
#sub-visual {width:100%;}
#sub-visual .visual-warp {position:relative; width:100%; height:210px; margin:0 auto; text-align:center; background:red }
#sub-visual .visual-warp img { width:100%;}
#sub-visual .sub-type {  margin: 0 0 0 0;    padding: 0;    position: absolute; top:-20px; left:10px }
#sub-visual .wave-type1 { float:left;  font-size: 65px; font-weight:700;}
#sub-visual .type2 { float:left; margin:30px 0 0px 0 ; padding: 0;  color:#c360de; list-style:none}
#sub-visual .type2 li { float:left; display: inline-block; margin:0; padding: 0; font-size: 45px; font-weight:600; }
#sub-visual .type2 li.space { margin:0px 0 0px 10px ;   }
#sub-visual .type2 img { width:80%; }

#sub-visual .sub-type2  {  margin: 0 0 0 0;    padding: 0; font-size: 25px; color:#6e6e6e; font-weight:300;   position: absolute; top:70px; left:20px }
#sub-visual .sub-type3  {  margin: 0 0 0 0;    padding: 0; font-size: 25px; color:#92d01b; font-weight:300;   position: absolute; top:100px; left:80px }
#sub-visual .sub-type4  {  margin: 0 0 0 0;    padding: 0; font-size: 25px; color:#6e6e6e; font-weight:300;   position: absolute; top:120px; left:40px }
#sub-visual .sub-type5  {  margin: 0 0 0 0;    padding: 0; font-size: 25px; font-weight:300;   position: absolute; bottom:10px; left:10px; text-align:left }
#sub-visual .sub-type5  img {  width:70% }

.sub-line-warp { width:100%; height:40px;background:#93d01b;}
.sub-line-warp .sub-line {position:relative; width:100%; height:100%; margin:0 auto; padding:0;}
.sub-line-warp .cubu1 {display:none }
.sub-line-warp .cubu2 {position: absolute; top:-190px; right:0px; float:right; text-align:right;}
.sub-line-warp .cubu2 img {width:55%}
.sub-line-warp .sub-title {width:80%; height:100%;background:#3088a6;float:left}
.sub-line-warp .sub-title .sub-title-img {width:100%; height:100%;float:left;text-align:left;display: inline-block;vertical-align:middle; }
.sub-line-warp .sub-title img {width:100%; margin-top:6px;}
.sub-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left}



/* 서브페이지 */
.sub-warp { width:100%; margin:0 auto; padding:40px 0 0px 0; }
.container  { width: 100%;  margin:0 auto; padding:0; text-align:center;}

.container ul.list01 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list01 li { position:relative; width:90%; padding: 0px; margin: 0px 20px 35px 20px;  float:left; border:1px solid #ddd;}
.container ul.list01 img { width:100%  }
.container ul.list01 p { width:80%; margin:0 auto; padding:10px 0 0 40px; font-size:14px; color:#858585; text-align:left;position: absolute; top:0;  }


.container ul.list02 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list02 li { position:relative; width:41%;padding: 0px; margin: 0px 12px 40px 19px;  float:left; border:0px solid #ddd;}
.container ul.list02 img { width:100%  }
.container ul.list02 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }


.container ul.list03 {width:100%; display: inline-block; list-style: none;  padding: 0px; margin: 0px 0px 0 0; }
.container ul.list03 li { position:relative; width:44%;padding: 0px; margin: 0px 6px 30px 12px;  float:left; border:1px solid #ddd;}
.container ul.list03 img { width:100%  }
.container ul.list03 p { width:100%; margin:0 auto; padding:8px 0 0 0; font-size:14px; color:#858585; position: absolute; top:0;  }


/* copyright */
.tail-line-warp { position:relative; width:100%; height:5px;background:#93d01b;}
.tail-line-warp .tail-line {width:100%; height:100%; margin:0 auto; text-align:center}
.tail-line-warp .tail-title {width:72%; height:100%; background:#3088a6;float:left}
.tail-line-warp .orang-line {width:28%; height:100%;background:#eb9e2a;float:left}

#copyright .copyright-warp { width:100%; overflow:hidden; background:#2d8ab2;margin:0px 0 0 0; padding:0 0 50px 0; bottom:0}
#copyright .copyright {width:100%; background: url('../images/tail-bg.png') center; }
#copyright .copyright-con {width:100%; height:158px; margin:0 auto; text-align:center; padding:0px 0 0px 0px; background: url('../images/mobile-copyright.jpg') center; }
#copyright .copyright-con img { width:166px; padding-top:40px;}
#copyright .copyright-con .copy-text1 {width:100%; margin:0 auto; text-align:center; padding:10px 0 0px 0px; font-size:12px; color:#ebe9b7}
#copyright .copyright-con .copy-text2 {width:100%; margin:0 auto; text-align:center; padding:10px 0 50px 0px; font-size:10px; color:#ffffff}


#copyright .copyright-con p.tel  {margin:0 auto; padding:0px 0 0 0; line-height:16px; font-size:16px; color:#ebe9b7; }
#copyright .copyright-con p.email  {margin:0 auto; padding:10px 0 0px 0px;line-height:16px; font-size:16px; color:#ebe9b7;}
#copyright .copyright-con i {margin:0 auto; padding:0px 10px 0px 0px; }



/**************************** 오른쪽 사이드 슬라이딩 메뉴 ***********************************/
/* Menu Appearance */



.pushyRight { position: fixed; width: 250px; height: 100%; text-align:top;  top: 0; z-index: 9999999999; background: #2d8ab2;  /* enables momentum scrolling in iOS overflow elements */}    
/* Menu Movement */
.pushy-right{    right:0px;
    -webkit-transform: translate3d(250px,0,0);
    -moz-transform: translate3d(250px,0,0);
    -ms-transform: translate3d(250px,0,0);
    -o-transform: translate3d(250px,0,0);
    transform: translate3d(250px,0,0);
}
.pushy-right-open{    right:0px;
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.container-right-push{    -webkit-transform: translate3d(-250px,0,0);
    -moz-transform: translate3d(-250px,0,0);
    -ms-transform: translate3d(-250px,0,0);
    -o-transform: translate3d(-250px,0,0);
    transform: translate3d(-250px,0,0);
}

.push-push{   -webkit-transform: translate3d(250px,0,0);
    -moz-transform: translate3d(250px,0,0);
    -ms-transform: translate3d(250px,0,0);
    -o-transform: translate3d(250px,0,0);
    transform: translate3d(250px,0,0);
}
/* Menu Transitions */
.pushy, #container, .push{
    -webkit-transition: -webkit-transform .2s cubic-bezier(.16, .68, .43, .99);
    -moz-transition: -moz-transform .2s cubic-bezier(.16, .68, .43, .99);
    -o-transition: -o-transform .2s cubic-bezier(.16, .68, .43, .99);
    transition: transform .2s cubic-bezier(.16, .68, .43, .99);
}
/* Site Overlay */
.overlay-pushy{    display: none;}
.overlay-pushy.overlay-active {display: block; position: fixed;top: 0; right: 0;bottom: 0;left: 0; z-index: 999999999;    
        background-color: rgba(0,0,0,0.8);
        -webkit-animation: fade 500ms; 
    -moz-animation: fade 500ms; 
    -o-animation: fade 500ms;
    animation: fade 500ms;
}


.right_warp { width:100%; height:100%;  text-align:center;background: #2d8ab2; z-index:900;  overflow-y: scroll;  overflow-x: hidden; }


.right_warp .main-line-warp { width:100%; height:60px; margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-line { width:100%; height:100%; margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-title {width:100%;height:100%;background:#2d8ab2;margin:0 auto; padding:0;}
.right_warp .main-line-warp .main-title .main-title-text {width:100%;height:100%;margin:0 auto;   padding:0;}
.right_warp .main-line-warp .main-title .main-title-text h3 {width:100%;height:100%;margin:0 auto; padding:15px 0 0 0px; font-size:20px; color:#ebe9b7}
.right_warp .main-line-warp .main-title .main-title-text img {width:80%; margin-top:10px;}
.right_warp .main-line-warp .orang-line {width:20%; height:100%;background:#eb9e2a;float:left;margin:0 auto; padding:0;}


.right_warp .m-visual-menu-warp   { width:100%; margin: 0 ;  padding: 0; }
.right_warp .menu-warp   { width:100%; margin:0 auto;    padding:0;  text-align: center }
.right_warp .visual-menu  {  width:100%; list-style:none; display: inline-block; margin:0; padding:0; }
.right_warp .visual-menu  li {  width:50%; height:130px; display: inline-block; float:left; margin:0;    padding:0;}
.right_warp .visual-menu  li .menu-button {  width:100%;height:100%; margin:0; padding:0;}
.right_warp .visual-menu  li p {  width:35%;margin: 0 auto;    padding:25px;  text-align: center }
.right_warp .visual-menu  li p img{  width:100%;}
.right_warp .visual-menu  li span {  width:100%; font-size:16px; color:#ffffff; line-height:0px;margin:0; padding:0;}
.right_warp .visual-menu  li.box1 {  background:#00bcd5; }
.right_warp .visual-menu  li.box2 {  background:#8cc34b; }
.right_warp .visual-menu  li.box3 {  background: #cf7ff4;}
.right_warp .visual-menu  li.box4 {  background:#ff9801; }
.right_warp .visual-menu   li.box5 {  background:#fec107; }
.right_warp .visual-menu   li.box6 {  background:#52c334; }




.right_warp .copyright-con {width:90%;  margin:0 auto; text-align:center; padding:0px;  background:#2d8ab2;}
.right_warp .copyright-con p.text { margin:0 auto;  padding:20px 0 0px 0px; font-size:12px; color:#ebe9b7; }
.right_warp .copyright-con p.tel  {margin:0 auto; padding:10px 0 0 0; line-height:16px; font-size:16px; color:#ebe9b7; }
.right_warp .copyright-con p.email  {margin:0 auto; padding:10px 0 0px 0px;line-height:16px; font-size:16px; color:#ebe9b7;}
.right_warp .copyright-con i {margin:0 auto; padding:0px 10px 0px 0px; color:#ebe9b7; }

.right_warp .quickIco {width:100%; margin:5px 0 5px 5px;}
.right_warp .quickIco ul {width:100%; letter-spacing:-4px;}
.right_warp .quickIco li {float:left; width:48%;height:28px;letter-spacing:0;margin:2px 2px 2px 2px; }
.right_warp .quickIco li a {display:block;line-height:28px;border:1px solid #dfdfdf;font-size:13px;color:#333;padding:0 0 0 15px;text-align:left;}
.right_warp .quickIco li a:hover{background:#f4f4f4;text-decoration:none;font-weight:bold;}
.right_warp .quickIco li a i{line-height:28px; top:10px;margin:0px 4px 0 0;font-size:13px;color:#777;}  




.right_warp  h4 {display:block;line-height:28px;margin:10px 0 0px;border-top:1px dotted #888;border-bottom:1px dotted #888;
font-size:16px;font-weight:normal;text-align:center;letter-spacing:-0.05em; background:#f7f7f7; }
.right_wap  .oper_time{ width:87%;margin:0 auto;text-align:center;font-size:11px;line-height:17px; padding:10px 0 30px 0;}
.right_warp  .oper_time .phone{margin:0 0 10px;line-height:21px;font-size:20px;font-weight:700;letter-spacing:-0.05em;}
.right_warp  .oper_time strong{padding-right:10px;color:#333;}

.right_warp  .oper_time i {padding-right:10px;color:#333; }r







}