/********************************************************************
 * Web Fonts 

@font-face{font-family:Nanum Gothic; 
src:local('Nanum Gothic'),
url('/_webfonts/NanumGothic.eot'),url('/_webfonts/NanumGothic.woff')format('woff');}

@font-face{font-family:Nanum GothicExtraBold; 
src:local('Nanum GothicExtraBold'),
url('/_webfonts/NanumGothicExtraBold.otf'),url('/_webfonts/NanumGothicExtraBold.otf')format('otf');}
********************************************************************/
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/********************************************************************
 * 초기화 CSS 
********************************************************************/
*{box-sizing:border-box; margin:0; padding:0px;}
body{font-family:Nanum Gothic; margin:0; padding:0px; }
a:link, a:visited, a:hover{text-decoration: none;}
div,span,p,td,dt,dd,li {  }
li { list-style: none; }



/********************************************************************
 * Header 
********************************************************************/
#header-wrapper{width:100%;   background:#fff; position:relative; min-width:300px;} /* position: fixed;*/
.header-gnb {margin:0 auto;}
.header-gnb-menu a:link {color: #000; }
.header-gnb-menu a:hover {color: #000;}
.header-gnb-menu a:visited {color: #000;}
/********************************************************************
 * Header 981px~
********************************************************************/
@media screen and (min-width: 981px)  {

.header-gnb {width:981px;  overflow: hidden; font-family:Nanum Gothic; }
.header-gnb-logo {float:left;  background:url('/img/logo.jpg') 0 0px no-repeat; width:280px;height:353px; position:absolute; }
.header-gnb-banner {float:right;  height:185px;}
.header-gnb-banner>p{float:left; padding-right:30px; padding-top:56px;  color:#8a8a8a; font-size:34px; }
.header-gnb-banner>p>font{color:#cb3abd; }
.header-gnb-banner>img{float:right;padding-top:56px;}
.btn_m_menu {display:none;}
.header-gnb-menu-bg {width:100%; height:75px; background: #17e9e0;  }
.header-gnb-menu{margin:0 auto;  height:75px;font-size:20px; width:981px; padding-left:230px;}
.header-gnb-menu> ul { display: inline-block; padding:1px; white-space:nowrap;}
.header-gnb-menu> ul>li { display:inline; padding:0 25px;display:table-cell; vertical-align: middle;}
.header-gnb-menu> ul> .menu_on { background:#fff; display:inline-block;display:table-cell; vertical-align: middle; height:73px; }
/*.main_menu{display:block!important;}*/

}

/********************************************************************
 * Header 761px~ 980px
********************************************************************/
@media screen and (min-width: 761px) and (max-width: 980px)   {

.header-gnb {width:100%;  overflow: hidden; font-family:Nanum Gothic; }
.header-gnb-logo {float:left;  background:url('/img/logo_230.jpg') 0 0px no-repeat; width:230px;height:257px; position:absolute; }
.header-gnb-banner {padding-left:260px;  height:182px;}
.header-gnb-banner>p{float:left; padding-top:56px;  color:#8a8a8a; font-size:36px; }
.header-gnb-banner>p>font{color:#cb3abd; }
.header-gnb-banner>img{display:none;}
.btn_m_menu {display:none;}
.header-gnb-menu-bg {width:100%; height:75px; background: #17e9e0;  }
.header-gnb-menu{margin:0 auto;  height:75px;font-size:16px; width:100%; text-align:left; padding-left:200px;}
.header-gnb-menu> ul { display: inline-block; padding:1px; white-space:nowrap;}
.header-gnb-menu> ul>li { display:inline; padding:0 20px;display:table-cell; vertical-align: middle;}
.header-gnb-menu> ul> .menu_on { background:#fff; display:inline-block;display:table-cell; vertical-align: middle; height:73px; }
/*.main_menu{display:block!important;}*/
}
/********************************************************************
 * Header 760px~0 pad,mobile
********************************************************************/
@media screen and (max-width: 760px)  {

.header-gnb {width:100%;  overflow: hidden; font-family:Nanum Gothic; border-bottom:1px solid #ccc; }
/*.header-gnb-logo {clear:left;  background:url('/img/logo_m.png') 10 70px no-repeat; width:160px; height:109px; display:none}*/
.header-gnb-banner {float:left; height:60px;}
.header-gnb-banner>p{padding:5px 10px; top:0px;  color:#fff;font-weight:bold; font-size:20px; background:#17e9e0; width:100%;  height:60px; position:absolute;}
.header-gnb-banner>p>font{color:#ff00e6; }
.header-gnb-banner>img{display:none;}
/*.btn_m_menu {float:right; cursor:pointer;padding:10px; position:absolute; top:60px; right:0px;}*/
.header-gnb-menu-bg {width:100%; height:0px; background: #fff;  }
.header-gnb-menu{margin:0 auto;font-size:14px; width:100%; text-align:center; padding-left:0px;}
.header-gnb-menu> ul { padding-top:0px;  }
.header-gnb-menu> ul>li { display:block; padding:15px 0px; border-top:1px solid #ccc; background:#fff;top:250px; }
.header-gnb-menu> ul>li:last-of-type {border-bottom:1px solid #ccc;}
.header-gnb-menu> ul> .menu_on { background:#f5f5f5; display:block; }

/*오른쪽에서 왼쪽으로 나오는 메뉴*/
 html.open {overflow: auto; }
.btn { width: 50px;  height: 50px;  position: absolute;  right: 0px;  top: 0px;  z-index: 1;  background-image: url("/img/menu.png");   background-size: 50%;  background-repeat: no-repeat;  background-position: center;  cursor: pointer;}
.close { width: 50px;  height: 50px;  position: absolute;  right: 0px;  top: 0px; background-image: url("/img/close.png");  background-size: 50%;  background-repeat: no-repeat;  background-position: center;  cursor: pointer;}
#menu { width: 250px;  height: 100%;  overflow-y: auto; position: fixed; top: 0px; right: -252px; z-index: 10;  background-color: white;  text-align: center;
  transition: All 0.2s ease;
  -webkit-transition: All 0.2s ease;
  -moz-transition: All 0.2s ease;
  -o-transition: All 0.2s ease;
}

#menu.open {  right: 0px;}
.page_cover.open {  display: block;}
.page_cover {  width: 100%;  height: 100%;  position: fixed;  top: 0px;  left: 0px;  background-color: rgba(0, 0, 0, 0.4);  z-index: 4;  display: none;}
/*.main_menu{display:none;}*/


}
/********************************************************************
 * Body
********************************************************************/
#body-wrapper {width:100%;}

.con-title{font-size:24px; color:#8d2f86; } /*보라색 컨텐츠 타이틀*/

/*price*/
#body-wrapper .con-1 {width:100%;   }
#body-wrapper .con-1>p{padding:5px 0; line-height:1.5; }
#body-wrapper .con-1>.table-price {	border-spacing:0;	border-collapse:collapse;   text-align:center;  width:100%; margin-top:10px;}
#body-wrapper .con-1>.table-price > thead th { 	border:1px solid #000; background-color:#d4fffe; padding:10px; color:#000; font-size:18px;}
#body-wrapper .con-1>.table-price td { border:1px solid #000; padding:15px 0; font-size:18px;	}
#body-wrapper .con-1>.table-price .price-title {  background-color:#ecf5f5; }
#body-wrapper .con-1>.con-smalltext {font-size:14px;}


/* service */
#body-wrapper .con-2 {margin-right:4%; margin-bottom:20px; vertical-align:middle;}
#body-wrapper .con-2>p{padding:5px 0; line-height:1.9;}
#body-wrapper .con-2 .service-list { background:url('/img/service_list_item.jpg')0 50% no-repeat;  font-size:18px; padding-left:30px;margin-left:10px; color:#411c48; background-size:17px 1px; line-height:1.2;}
#body-wrapper .con-2 .service-list:nth-of-type(2n) {  background:url('/img/service_list_item.jpg')0 50% no-repeat;  color:#85337f; background-size:17px 1px;}

/* contac */
#body-wrapper .con-3 {margin-left:300px; }
#body-wrapper .con-3>.con-title{padding-bottom:20px; }
#body-wrapper .con-3>h1{display:inline-block; font-size:20px; font-weight:600; color:#666565; padding-bottom:10px; }
#body-wrapper .con-3>h2{display:inline-block; font-size:20px; font-weight:600; }
#body-wrapper .con-3>h3{display:inline-block; font-size:18px; font-weight:600; padding-top:18px;}
#body-wrapper .con-3>h4{display:inline-block; font-size:24px; font-weight:600; color:#666; padding-top:30px; padding-bottom:10px;}
#body-wrapper .con-3>h5{display:inline-block; font-size:24px; font-weight:600; }
#body-wrapper .con-3 .google_map { border:1px solid #ccc ;height: 400px;}

#body-wrapper .con-3 .field {color:#777; margin-top:20px; border:1px solid #000; padding:20px;}

#body-wrapper .con-3 .field>h6{ font-size:16px; font-weight:600; width:50px; display:inline-block; padding-top:5px;}
#body-wrapper .con-3 .field>p>textarea{ margin:10px 0;border:1px solid #ccc;}
#body-wrapper .con-3 .field>input{ border:1px solid #ccc; }
#body-wrapper .con-3 .field>button {width:100%; height:40px;background:url('/img/btn_bg2.jpg') no-repeat; border:0px;  color:#fff;}


/********************************************************************
 * Body  981px~
********************************************************************/
@media screen and (min-width: 981px)  {

#body-wrapper{width:980px; margin:0 auto; }
#body-wrapper .main-con {display:inline-block; width:50%; padding-top:0px; font-size:24px; letter-spacing:.03em; position:relative;top:-50px; }
#body-wrapper .main-con>p>font {color:#8d2f86; }
#body-wrapper .main-con .btn-arrow a {background:url('/img/btn_arrow.png') 250px 8px no-repeat;color:#fff;width:260px; display:inline-block;}
#body-wrapper .main-con .btn-arrow{ background:url('/img/btn_bg.jpg') no-repeat #0063ed;   width:270px; font-size:16px; padding:10px; }
#body-wrapper .main-con>p {padding-bottom:25px; }
#body-wrapper .main-img {display:inline-block; width:45%;padding-top:35px; margin-left:10px; }
/*#body-wrapper .main-img>img{width:450px;}*/





#body-wrapper .menu-title{ background:url('/img/con_title.jpg') 300px 6px no-repeat;  height:35px; margin-top:35px; margin-bottom:50px; text-align: top; }
#body-wrapper .menu-title>h1{color:#22d0cf; font-size:30px; font-weight:600; padding-left:320px; }

/* about us */
#body-wrapper .con-1 .aboutus-img {background: url("/img/aboutus_img01.jpg") no-repeat top center ;background-size: cover; width:100%; height:300px;}/*cover속성:같은비율 유지 contain*/
#body-wrapper .con-1 .aboutus-img2 {background: url("/img/aboutus_img02.jpg") no-repeat top center ;background-size: cover; width:100%; height:300px;}/*cover속성:같은비율 유지 contain*/

/* service */
#body-wrapper .con-2 {width:45%; display:inline-block;}
#body-wrapper .con-2 .service-img {background: url("/img/service_img01.jpg") no-repeat top center ;background-size: cover; height:255px;/*cover속성:같은비율 유지 contain*/}
#body-wrapper .con-2 .service-img2 {background: url("/img/service_img02.jpg") no-repeat top center ;background-size: cover; height:305px;/*cover속성:같은비율 유지 contain*/}




}
/********************************************************************
 * Body 980px~0 pad,mobile
********************************************************************/
@media screen and (max-width: 980px)  {
#body-wrapper{width:95%; margin:0 auto; }

#body-wrapper .main-con {display:block; width:100%; padding-top:0px; font-size:20px; letter-spacing:.03em; position:relative;top:20px; }
#body-wrapper .main-con>p>font {color:#8d2f86; }
#body-wrapper .main-con .btn-arrow a {background:url('/img/btn_arrow.png') 250px 8px no-repeat;color:#fff;width:270px; display:inline-block;}
#body-wrapper .main-con .btn-arrow{ background:url('/img/btn_bg.jpg') no-repeat #0063ed;   width:280px; font-size:16px; padding:10px; }
#body-wrapper .main-con>p {padding-bottom:25px; }
#body-wrapper .main-img {display:inline-block; width:100%;padding-top:35px;  }
/*#body-wrapper .main-img>img{width:100%;}*/


#body-wrapper .menu-title{ background:url('/img/con_title.jpg') 0px 6px no-repeat;  height:35px; margin-top:20px; margin-bottom:10px; text-align: top; }
#body-wrapper .menu-title>h1{color:#22d0cf; font-size:30px; font-weight:600; padding-left:20px; }

/* about us */
#body-wrapper .con-1 .aboutus-img {background: url("/img/aboutus_img01_m.jpg") no-repeat top center ;background-size: cover; width:100%; height:300px;}/*cover속성:같은비율 유지 contain*/
#body-wrapper .con-1 .aboutus-img2 {background: url("/img/aboutus_img02_m.jpg") no-repeat top center ;background-size: cover; width:100%; height:300px;}/*cover속성:같은비율 유지 contain*/

/* service */
#body-wrapper .con-2 {width:100%; display:inline-block;}
#body-wrapper .con-2 .service-img {background: url("/img/service_img01.jpg") no-repeat center center ; background-size:cover; height:200px;/*height:305px; cover속성:같은비율 유지 contain*/}
#body-wrapper .con-2 .service-img2 {background: url("/img/service_img02.jpg") no-repeat center center ;background-size: cover; height:305px;/*cover속성:같은비율 유지 contain*/}
#body-wrapper .con-2 .service-list {margin-left:0px;}

/* contac */
#body-wrapper .con-3 {margin-left:0px; width:100%;}
#body-wrapper .con-3>h3{ padding-top:0px;}
#body-wrapper .con-3>h4{ padding-top:10px; padding-bottom:10px;}
#body-wrapper .con-3 .google_map { border:1px solid #ccc; height: 300px;}



}

/********************************************************************
 * footer *
********************************************************************/
#footer-wrapper-line { border-top:1px solid #b2b2b2; width:100%;  float:none; margin-top:50px;}

/********************************************************************
 * footer  981px~
********************************************************************/
@media screen and (min-width: 981px)  {

#footer-wrapper {width:981px;  margin:0 auto; padding-top:30px;  padding-bottom:20px;}

.footer-follow {border:1px solid #fff; width:220px; display:inline-block; vertical-align: top; }
.footer-follow>h4 {font-size:18px; color:#000;font-weight:100;}
.footer-follow>h5 {font-size:16px; color:#acacac;font-weight:100; padding-top:20px;}
.footer-follow>ul,li { padding-top:5px;display:inline-block;}
.footer-follow>ul>li a { background:url('/img/footer_followus.jpg') no-repeat;display:inline-block;}
.footer-follow>ul>li:nth-of-type(1) a { background-position: 0px 0px; width:37px; height:37px; }
.footer-follow>ul>li:nth-of-type(2) a { background-position: 0px -37px; width:37px; height:37px;}
.footer-follow>ul>li:nth-of-type(3) a { background-position: 0px -74px; width:37px; height:37px;}

.footer-contact {border:1px solid #000; width:280px;  display:inline-block; vertical-align: top; height:135px; padding:20px;}
.footer-contact>h1{font-size:18px; color:#12b3af;font-weight:600; padding-bottom:10px;}
.footer-contact>h2{font-size:16px; font-weight:100;}
.footer-contact>h3{font-size:14px; color:#777; font-weight:100; padding-top:5px; display:inline-block;}
.footer-contact>h4{font-size:14px;font-weight:100; padding-top:5px;display:inline-block;}

.footer-map {display:inline-block; padding-left:10px;vertical-align: top;}
.footer-qr {display:inline-block; padding-left:10px;vertical-align: top;}
.footer-banner {display:inline-block; padding-left:10px;vertical-align: top;}
}

/********************************************************************
 * footer   761px~ 980px
********************************************************************/
@media screen and (min-width: 761px) and (max-width: 980px)   {

#footer-wrapper {width:95%;  margin:0 auto; padding-top:20px; padding-bottom:15px; }

.footer-follow {border:1px solid #fff; width:100%; display:inline-block; }
.footer-follow>h4 {font-size:18px; color:#000;font-weight:100; display:inline-block; vertical-align: top;  padding-top:10px;}
.footer-follow>h5 {font-size:16px; color:#acacac;font-weight:100; padding-left:20px; display:inline-block; vertical-align: top;  padding-top:10px;}
.footer-follow>ul,li { padding-top:0px;display:inline-block;}
.footer-follow>ul>li a { background:url('/img/footer_followus.jpg') no-repeat;display:inline-block;}
.footer-follow>ul>li:nth-of-type(1) a { background-position: 0px 0px; width:37px; height:37px; }
.footer-follow>ul>li:nth-of-type(2) a { background-position: 0px -37px; width:37px; height:37px;}
.footer-follow>ul>li:nth-of-type(3) a { background-position: 0px -74px; width:37px; height:37px;}

.footer-contact {border:1px solid #fff; width:100%;  display:inline-block; vertical-align: top;  }
.footer-contact>h1{font-size:18px; color:#12b3af;font-weight:600; padding-bottom:10px; display:inline-block; padding-right:10px;}
.footer-contact>h2{font-size:16px; font-weight:100;display:inline-block; padding-right:10px;}
.footer-contact>h3{font-size:14px; color:#777; font-weight:100; padding-top:5px; display:inline-block;}
.footer-contact>h4{font-size:14px;font-weight:100; padding-top:5px;display:inline-block;}
.footer-contact>p {display:inline-block;}

.footer-map {display:inline-block;  }
.footer-map>img{width:150px;}
.footer-qr {display:inline-block; padding-left:10px; vertical-align: top;}
.footer-banner {display:inline-block; padding-left:10px; vertical-align: top;}
.footer-banner>img{width:100px;}

}

/********************************************************************
 * footer 960px~0 pad,mobile
********************************************************************/
@media screen and (max-width: 760px)  {

#footer-wrapper {width:95%;  margin:0 auto;  }

.footer-follow {border:1px solid #fff; width:100%;  }
.footer-follow>h4 {font-size:18px; color:#000;font-weight:100; vertical-align: top;  padding:10px 0;}
.footer-follow>h5 {font-size:16px; color:#acacac;font-weight:100; padding-left:20px; display:none; vertical-align: top;  padding-top:10px;}
.footer-follow>ul,li { padding-top:0px;display:inline-block;}
.footer-follow>ul>li a { background:url('/img/footer_followus.jpg') no-repeat;display:inline-block;}
.footer-follow>ul>li:nth-of-type(1) a { background-position: 0px 0px; width:37px; height:37px; }
.footer-follow>ul>li:nth-of-type(2) a { background-position: 0px -37px; width:37px; height:37px;}
.footer-follow>ul>li:nth-of-type(3) a { background-position: 0px -74px; width:37px; height:37px;}

.footer-contact {border:1px solid #fff; width:100%;  display:inline-block; vertical-align: top;  }
.footer-contact>h1{font-size:18px; color:#12b3af;font-weight:600; padding-top:10px; display:inline-block; padding-right:10px;}
.footer-contact>h2{font-size:16px; font-weight:100;display:inline-block; padding-right:10px;}
.footer-contact>h3{font-size:14px; color:#777; font-weight:100; padding-top:5px; display:inline-block;}
.footer-contact>h4{font-size:14px;font-weight:100; padding-top:5px;display:inline-block;}
.footer-contact>p {display:block;}

.footer-map {display:none;  }
.footer-map>img{width:200px;}
.footer-qr {display:inline-block; padding-left:10px;}
.footer-banner {display:inline-block; padding-left:10px;}
.footer-banner>img{width:100px;}

}
}
/******************************************************************** 
 * contact us
********************************************************************/

.ui-dialog-titlebar {background:#fff; color:#666;  font-size:12px;  border-radius:0; border-style:none; }
.my-dialog .ui-dialog-titlebar {color:red; background:#fff;  font-size:14px; border-style:none;}
.ui-dialog.ui-widget-content {  text-align:center; padding-bottom:10px; }
.ui-widget-overlay {background: #000;opacity: .7;}