@charset "UTF-8";
/* CSS Document */

/* CSS Design ==================
= CSS 디자인: 주우정(Ju Ujeong)
= 제작자 e-mail: henalwin@gmail.com
= 제작자 homepage : henal.kr
= Create Date: 2013.12.09
============================= */

/*구글 한글서체 망라*/
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/css?family=Noto+Sans);

/*공통*/
html, body {
width:100%; height:auto; font-size: 88%; 
margin: 0; padding: 0;
font-family:'Noto Sans', 'Nanum Gothic' , '맑은 고딕','Malgun Gothic',Dotum,tahoma,Arial,Helvetica,AppleGothic,sans-serif; 
overflow-x:hidden; overflow-y:auto;
}

pre, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, li, ol, th, td, p, blockquote, legend, 
menu, nav, section, hgroup, article, header, aside, footer, spa, form, fieldset, 
input, select, textarea, button {
margin: 0; border: 0; padding: 0; list-style:none; 
font-family:'Noto Sans', 'Nanum Gothic' , '맑은 고딕','Malgun Gothic',Dotum,tahoma,Arial,Helvetica,AppleGothic,sans-serif; 
}
h2{display: inline;
font-weight: bold;
color: #333;
font-family:'Noto Sans', 'Nanum Gothic' , '맑은 고딕','Malgun Gothic',Dotum,tahoma,Arial,Helvetica,AppleGothic,sans-serif; 
}
a {color:#333; text-decoration: none; background-color: transparent;} 
/* background-color: transparent; 클릭시 뒷배경 상황 해소 */
a:link, a:visited, a:hover, a:active, a:focus {text-decoration: none;}
a img {border: none;}
a {outline: none;}
a{selector-dummy: expression(this.hideFocus=true)}
.mb10{display:block; margin-bottom:10px;}
.mb20{display:block; margin-bottom:20px;}
.mb30{display:block; margin-bottom:30px;}
.mb40{display:block; margin-bottom:40px;}
.mb50{display:block; margin-bottom:50px;}
section h2{display:block;font-size:140%; line-height:160%;height:auto; } /*상품상세설명페이지 서브타이틀*/

.fs80{font-size:80%;}
.fs85{font-size:85%;}
.fs90{font-size:90%;}
.fs95{font-size:95%;}
.fs100{font-size:100%;}
.fs105{font-size:105%;}
.fs110{font-size:110%;}
.fs115{font-size:115%;}
.fs120{font-size:120%;}
.fs125{font-size:125%;}
.fs130{font-size:130%;}
.fs135{font-size:135%;}
.fs140{font-size:140%;}
.fs145{font-size:145%;}
.fs150{font-size:150%;}

.tc0{color:#000;}
.tc1{color:#111;}
.tc2{color:#222;}
.tc3{color:#333;}
.tc4{color:#444;}
.tc5{color:#555;}
.tc6{color:#666;}
.tc7{color:#777;}
.tc8{color:#888;}
.tc9{color:#999;}

.lh23{line-height:23px;}
.lh25{line-height:25px;}
.lh28{line-height:28px;}
.lh30{line-height:30px;}

.br5{border-radius:5px;}
.br10{border-radius:10px;}
.br15{border-radius:15px;}
.br20{border-radius:20px;}

p.ea50{position:absolute; top:-3px; right:0; width:43px; height:43px; text-indent:-9999px; background:url("/henal/img/ico_50.png") left top no-repeat;}
p.ea40{position:absolute; top:-3px; right:0; width:43px; height:43px; text-indent:-9999px; background:url("/henal/img/ico_40.png") left top no-repeat;}
p.ea30{position:absolute; top:-3px; right:0; width:43px; height:43px; text-indent:-9999px; background:url("/henal/img/ico_30.png") left top no-repeat;}
p.ea20{position:absolute; top:-3px; right:0; width:43px; height:43px; text-indent:-9999px; background:url("/henal/img/ico_20.png") left top no-repeat;}
p.ea10{position:absolute; top:-3px; right:0; width:43px; height:43px; text-indent:-9999px; background:url("/henal/img/ico_10.png") left top no-repeat;}
/*공통끝*/


/*디바이스 선택*/
.changedevice{width:100%; height:auto; background:#333; padding:10px 0;}

.mk-toggle-button, .toggle-handle {
    border-radius: 40px;
    background-clip: padding-box;
    transition: all 0.1s ease-in-out 0s;
}

.mk-toggle-button {
    display: block;
    background-color: #BBB;
    width: 60px;
    height: 28px;
    cursor: pointer;
    position: relative;
    -moz-user-select: none;
	margin:0 auto; /*상하*/
}
.mk-toggle-button a{display:block; width:100%; height:100%;}

.mk-toggle-button.on {
    background-color: #14A5ED;
position:relative;
}

.mk-toggle-button .toggle-handle {
    width: 22px;
    height: 22px;
    background-color: #FFF;
    position: relative;
    display: block;
    left: 3px;
    top: 3px;
}
.mk-toggle-button.on .toggle-handle {
    right: 34px;
}

.mk-toggle-button, .toggle-handle {
    border-radius: 40px;
    background-clip: padding-box;
    transition: all 0.1s ease-in-out 0s;
}

b.devicepc{position:absolute; top:0; left:-30px; height:28px; line-height:28px; font-weight:bold; font-size:95%; color:#14A5ED; text-align:right;}
b.devicemobile{position:absolute; top:0; right:-50px; height:28px; line-height:28px; color:#ccc; font-weight:bold; font-size:95%; text-align:left;}
/*디바이스 선택끝*/

/*홈>회사>제작실적 런칭 부분*/
ul.launching{width:100%; margin:5% 0;}
ul.launching li{display:bock; text-align:center;}
ul.launching li.title{font-weight:bold; height:80px; line-height:80px; font-size:280%;color:#222; }
ul.launching li.siteurl{display:none; font-size:100%; height:23px; line-height:23px;}
ul.launching li.date{font-size:98%; height:30px; line-height:30px;}
ul.launching li.tit_mainpage{font-size:198%;padding:30px; width:200px; height:30px; line-height:30px; background:#f30; color:#fff; text-align:center; font-weight:bold; margin:100px auto 50px; border-top-right-radius:15px; border-bottom-left-radius:15px;}
ul.launching li.tit_subpage{font-size:198%;padding:30px; width:200px; height:30px; line-height:30px; background:#f30; color:#fff; text-align:center; font-weight:bold; margin:100px auto 50px; border-top-right-radius:15px; border-bottom-left-radius:15px;}

/*홈>회사>제작실적 런칭 부분끝*/




/*게시판 - 견적문의*/
span.btn_prepare{background:#f30; color:#fff;}



/*shop상세설명*/

#sit_pvi{float:left;}
#sit_ov{

}

.boundary h4.title,#sit_ex h2,#sit_inf h2,#sit_qa h2,#sit_use h2,#sit_rel h2{clear:both;display:block;width:100%; height:40px; line-height:40px; text-align:left; padding: 5px 0; color:#333;font-size:140%; background:#fafafa url("/henal/img/ico_check.png") 15px center no-repeat; text-indent:40px; border-top:1px solid #efefef;border-bottom:1px solid #efefef; margin:30px 0;}

h2.detail2{display:block;width:100%; height:40px; padding: 5px 0; color:#333;font-size:140%;background:#fafafa url("/henal/img/ico_check.png") 15px center no-repeat; text-indent:40px; border-top:1px solid #efefef;border-bottom:1px solid #efefef;}

.priceframe{ 
background:#272727 url("/henal/img/bg_check.png") left top repeat;
width:90%;
height:130px;
border-radius:15px;
padding:5%;
}
.priceframe p.subtitle{ 
display:block;
width:90%;
height:auto; 
line-height:30px;
font-size:230%;
text-align:center;
font-weight:bold;
color:#ff0000;
margin:0 auto;
}
.priceframe h4{ 
display:block;
width:90%;
height:auto; 
line-height:50px;
font-size:170%;
text-align:center;
font-weight:bold;
color:#fff;
margin:0 auto;
position:relative;
}

.priceframe  ul.price{
display:block;
width:90%;
height:auto; 
margin:0 auto;
}

.priceframe  ul.price li{ /*자료접수시점*/
display:block;
float:left;
width:50%;
height:50px;
line-height:50px;
background:#b30002;
font-size:160%;
color:#f3f3f3;
text-align:center;
border-radius: 0px 0 0 20px;
}

.priceframe  ul.price li.point{ /*몇일안에*/
background:#fafafa;
color:#b30002;
font-weight:bold;
text-align:center;
border-radius: 0px 20px 0  0;
}

.priceframe h5{
display:block;
color:#fff;
font-size:200%;
text-align:center;
font-weight:bold;
width:100%;
padding:0 10px;
margin:0 auto;
position:relative;
}


/*현재 pc버전만 샘플로 보여주는 부분*/
.pconly{clear:both; width:100%;height:25px; line-height:25px; margin:0 auto; border-radius:5px;}
.pconly h5.pctit{font-size:120%;color:#b0de26; padding:0 20px; width:20%; height:20px;margin:0 auto; margin-top:-1%;}




/*pc와 mobile을 샘플보여주는 부분*/
.priceframe .pc{display:none; float:left;width:45%;height:auto; padding:2% 0; margin:0 10% 10px 0;}
.priceframe .pc h5.pctit{clear:both; font-size:140%;color:#b0de26; padding:0 20px; width:50%; height:40px;line-height:40px;margin:0 auto; }
.priceframe .pc ul.demobtn{clear:both; display:block; width:90%; height:auto; margin:0 auto; }
.priceframe .pc ul.demobtn li a.pcbtn{display:block;float:left;width:48%;margin:0 0 0 0.5%;height:55px;line-height:55px;padding:5px 0px;
border:1px solid #91b41a; -webkit-border-radius: 10px; -moz-border-radius: 10px;border-radius: 10px;font-size:120%;text-align:center;
 text-decoration:none; display:block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
 background-color: #b6e026; background-image: -webkit-gradient(linear, left top, left bottom, from(#b6e026), to(#abdc28));
 background-image: -webkit-linear-gradient(top, #b6e026, #abdc28);
 background-image: -moz-linear-gradient(top, #b6e026, #abdc28);
 background-image: -ms-linear-gradient(top, #b6e026, #abdc28);
 background-image: -o-linear-gradient(top, #b6e026, #abdc28);
 background-image: linear-gradient(to bottom, #b6e026, #abdc28);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#b6e026, endColorstr=#abdc28);
}
.priceframe .pc ul.demobtn li a.pcbtn:hover {
 border:1px solid #718c14;
  background-color: #95b91a; background-image: -webkit-gradient(linear, left top, left bottom, from(#95b91a), to(#8bb41d));
 background-image: -webkit-linear-gradient(top, #95b91a, #8bb41d);
 background-image: -moz-linear-gradient(top, #95b91a, #8bb41d);
 background-image: -ms-linear-gradient(top, #95b91a, #8bb41d);
 background-image: -o-linear-gradient(top, #95b91a, #8bb41d);
 background-image: linear-gradient(to bottom, #95b91a, #8bb41d);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#95b91a, endColorstr=#8bb41d);
}

.priceframe .mobile{display:none; float:right;width:45%; height:auto; padding:2% 0;}
.priceframe .mobile h5.mobiletit{clear:both; font-size:140%;color:#39b6e9; padding:0 20px; width:50%; height:40px;line-height:40px;margin:0 auto; }
.priceframe .mobile ul.demobtn{clear:both; display:block; width:90%; height:auto; margin:0 auto; }
.priceframe .mobile ul.demobtn li a.mobilebtn{display:block;float:left;width:48%;margin:0 0 0 0.5%;height:55px;line-height:55px;padding:5px 0px;
border:1px solid #15aeec; -webkit-border-radius: 10px; -moz-border-radius: 10px;border-radius: 10px;font-size:120%;text-align:center;
 text-decoration:none; display:block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
  background-color: #49c0f0; background-image: -webkit-gradient(linear, left top, left bottom, from(#49c0f0), to(#2CAFE3));
 background-image: -webkit-linear-gradient(top, #49c0f0, #2CAFE3);
 background-image: -moz-linear-gradient(top, #49c0f0, #2CAFE3);
 background-image: -ms-linear-gradient(top, #49c0f0, #2CAFE3);
 background-image: -o-linear-gradient(top, #49c0f0, #2CAFE3);
 background-image: linear-gradient(to bottom, #49c0f0, #2CAFE3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#49c0f0, endColorstr=#2CAFE3);
}

.priceframe .mobile ul.demobtn li a.mobilebtn:hover {
 border:1px solid #1090c3;
 background-color: #1ab0ec; background-image: -webkit-gradient(linear, left top, left bottom, from(#1ab0ec), to(#1a92c2));
 background-image: -webkit-linear-gradient(top, #1ab0ec, #1a92c2);
 background-image: -moz-linear-gradient(top, #1ab0ec, #1a92c2);
 background-image: -ms-linear-gradient(top, #1ab0ec, #1a92c2);
 background-image: -o-linear-gradient(top, #1ab0ec, #1a92c2);
 background-image: linear-gradient(to bottom, #1ab0ec, #1a92c2);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#1ab0ec, endColorstr=#1a92c2);
}

.priceframe .mobile ul.demobtn li.end{margin-right:0;}

/*프리뷰 : 의미없어서 일단 제외*/
.preview{display:none; clear:both;width:98%; height:auto;margin:70px auto 0px; border-radius:15px;padding:1%; background:url("/henal/img/symphony.png") left top repeat; }
.preview h4.title{width:100%; height:auto; font-weight:bold; text-align:center; margin-top:50px;}
.preview h4.title span{display:inline-block;font-size:250%;}
.preview h4.title span.line1{color:#433; font-weight:normal; }
.preview h4.title span.line2{color:#333; font-size:350%; }
.preview h4.title span b{color:#f30;}
.preview p.subtitle{display:block; width:90%;height:auto;line-height:23px; color:#777; font-weight:normal; margin: 30px auto 10px; }
.preview p.next{width:90%; height:auto;line-height:18px; text-align:center; padding-top:50px; margin:0px auto 30px; font-size:90%; color:#333; background:url("/henal/img/arrow_down.png") center top no-repeat;}

/*제작범위예시*/
.boundary{width:100%; height:auto; margin-bottom:1px; margin-top:20px; }
.boundary h4.title{display:none;}
.boundary p.subtitle{width:100%;height:25px;line-height:25px;font-size:180%; color:#555; margin:20px 0 10px 0; font-weight:normal; text-align:center; }
.boundary b.red{color:#f30;}

.mainpage {color:#ff00ff;}
.subcontents {color:#00a99d;}
.board {color:#dc7495;}
.module {color:#0000ff;}

/*작업범위*/
table.hn_table {
	border-collapse:collapse;
	border-top:1px solid #777; 
	border-bottom:1px solid #777; 
	display:block;
	height:auto;
	width:100%;
}
table.hn_table tbody.hn_tbody{display:block;}
table.hn_table th.hn_th {
	border-collapse:collapse;
	width:30%;
	border-bottom: 1px solid #ccc; 
	border-right: 1px solid #ccc; 
	background:#fafafa;
}
table.hn_table th.all {
	background:#fff;
	border-bottom: 1px solid #ccc; 	
}

table.hn_table td.hn_td {
	border-collapse:collapse;
	width:70%;
	border-bottom: 1px solid #e1e1e1; 
	color:#777;
}
table.hn_table td.hn_td.on {
	color:#ff5b89;
}


/*테이블속 테이블*/
table.hn_table2 {
	border-collapse:collapse;    /* border 사이의 간격 없앰 */
	border: 3px solid #fafafa;    /* border 하단 두께 지정 */
	width:90%;                  /* 전체 테이블 길이 설정 */
	height:auto;
	font-size:98%;
	margin:5px auto 20px;
}

table.hn_table2 th.hn_th2.start {
	padding:10px 0;
	border-bottom: 1px solid #fafafa; 
}

table.hn_table2 th.hn_th2 {
	border-bottom: 1px solid #fafafa; 
	border-right: 1px solid #fafafa; 
	background:#fefefe;
}

table.hn_table2 td.hn_td2 {
	border-bottom: 1px solid #fafafa; 
	border-right: 1px solid #fafafa; 
	color:#777;
}

table.hn_table2 td.hn_td2 p.text{
	color:#777;
}

table.hn_table p.text{
	height:30px;
	line-height:30px;
	color:#333; padding:5px 0; text-align:center;
}

span.mainpage{color:#99cc33;}
span.subpage{color:#f30; text-decoration:underline;}
span.module{color:#9966ff;}
span.board{color:#ff66ff;}



/*NOTICE*/
.before{width:98%; height:auto;margin:0 auto; border-radius:15px;padding:1%;margin-bottom:1px; background:#f30;}
.before h4.title{width:100%; height:auto; line-height:50px; margin:20px auto 0;  text-align:center; font-size:190%; color:#333; font-weight:bold;}
.before p.subtitle{width:90%;height:auto;line-height:25px;font-size:120%; color:#fff; margin:10px auto 10px; font-weight:bold; font-size:140%;}
.before ul{display:block;width:90%; margin:0 auto;}
.before ul li{display:block;height:auto; line-height:23px; background:url("/henal/img/arrow_menu.png") left 5px no-repeat; text-indent:15px; color:#fafafa; font-size:110%; margin-bottom:20px;}

/*해날이드리는 특별한 서비스*/
.bonus{width:98%; height:auto; margin:0 auto; border-radius:15px; padding:3% 1%; background:#585858;}
.bonus h4.title{width:100%; height:auto; line-height:50px; margin:20px auto 0;  text-align:center; font-size:190%; color:#fff; font-weight:bold;}
.bonus p.subtitle{width:90%;height:auto;line-height:25px;font-size:120%; color:#ff4f00; margin:10px auto 10px; font-weight:normal; text-align:center; }
.bonus ul{display:block; width:90%; height:auto; background:#434343; border-radius:15px; margin:0 auto;padding:3%;}
.bonus ul li{display:block; height:auto; margin:5px 0;}
.bonus ul li span.number{display:inline-block; background:#333; color:#fff; width:30px; height:30px; line-height:30px; text-align:center; padding:1%;}
.bonus ul li span.title{display:inline-block; color:#fff; height:30px; line-height:30px; padding-left:15px; font-size:140%; font-weight:bold; }
.bonus ul li span.text{display:inline-block; color:#fff; height:auto; line-height:30px; padding-left:15px; }

/*자주하시는질문들*/
.maybe{width:98%; height:auto;margin:0 auto; border-radius:15px;padding:3% 1%;margin-bottom:1px; background:#f8f8f8; margin-top:20px;}
.maybe h4.title{width:100%; height:auto; line-height:50px; margin:20px auto 0;  text-align:center; font-size:190%; color:#333; font-weight:bold;}
.maybe p.subtitle{width:90%;height:auto;line-height:25px;font-size:120%; color:#ff4f00; margin:30px auto 10px; font-weight:normal; text-align:center; }
.maybe dl{display:block; width:90%; height:auto; padding:3%; background:#fff; border-radius:15px; margin:0 auto;}
.maybe dl b{color:#f30;margin-right:5px;}
.maybe dl dt{clear:both; display:block; width:100%; height:35px; margin:15px auto 5px; font-weight:bold;}
.maybe dl dd{clear:both; display:block; width:100%; height:auto; line-height:23px; border-bottom:1px dashed #777; padding-bottom:20px;}

/*카카오톡문의*/
.kakaotalk{width:98%; height:auto;margin:3% auto 3%;border-radius:15px;padding:3% 1%; background:#ffe616 url("/henal/img/img_kakaotalk.png") center center no-repeat;}
.kakaotalk h4.title{width:100%; height:auto; line-height:50px; margin:0 auto;  text-align:center; font-size:130%; color:#333; font-weight:bold;}
.kakaotalk p.subtitle{width:100%;height:25px;line-height:25px; color:#f20; margin:220px 0 10px 0; font-weight:normal; text-align:center; font-weight:bold;}
.kakaotalk p.subtitle b{font-size:200%; color:#333;}

/*결제시확인절차안내*/
.worktime{width:98%; height:auto;margin:0 auto;border-radius:15px;padding:3% 1%;margin-bottom:1px; background:#f8f8f8; margin-top:20px;}
.worktime h4.title{width:100%; height:50px; line-height:50px; margin:0 auto;  text-align:center; font-size:190%; color:#333; font-weight:bold;}
.worktime dl{display:block; width:100%;}
.worktime dl dt{width:90%; margin:0 auto;color:#fff; background:#f30; padding:10px; text-align:center; font-size:130%; border-radius:10px; margin-top:20px;}
.worktime dl dd{width:90%; margin:0 auto;}
.worktime dl dd b{font-size:130%; color:#333; margin:10px 0; display:block;}


/*등록지원*/
ul.circle{}
ul.circle li{float:left;display:block; width:225px;height:200px;border-radius:15px;margin:20px 10px; padding:20px;background:#fefefe;border:3px solid #333;}
ul.circle li:hover{border:3px solid #f30;}
ul.circle li.domain{}
ul.circle li.hosting{}
ul.circle li.naver{}
ul.circle li b{display:block;width:100%; text-align:center;font-size:150%; margin-bottom:10px;color:#f30;}
ul.circle li span{clear:both; display:block;}
/*등록지원끝*/


/*상품설명페이지의 구매버튼*/
#button_wrap{width:80%; margin:0 auto;}
a.button_sample{ float:left; width:44%; text-align:center; margin:15px 5px 50px 0px;
border:1px solid #df0909; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:200%; padding: 10px 10px 10px 10px; text-decoration:none; display:block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
 background-color: #ff5db1; background-image: -webkit-gradient(linear, left top, left bottom, from(#ff5db1), to(#ef007c));
 background-image: -webkit-linear-gradient(top, #ff5db1, #ef007c);
 background-image: -moz-linear-gradient(top, #ff5db1, #ef007c);
 background-image: -ms-linear-gradient(top, #ff5db1, #ef007c);
 background-image: -o-linear-gradient(top, #ff5db1, #ef007c);
 background-image: linear-gradient(to bottom, #ff5db1, #ef007c);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff5db1, endColorstr=#ef007c);
}

a.button_sample:hover{ 
 border:1px solid #f60080;
 background-color: #ff2a98; background-image: -webkit-gradient(linear, left top, left bottom, from(#ff2a98), to(#bc0062));
 background-image: -webkit-linear-gradient(top, #ff2a98, #bc0062);
 background-image: -moz-linear-gradient(top, #ff2a98, #bc0062);
 background-image: -ms-linear-gradient(top, #ff2a98, #bc0062);
 background-image: -o-linear-gradient(top, #ff2a98, #bc0062);
 background-image: linear-gradient(to bottom, #ff2a98, #bc0062);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff2a98, endColorstr=#bc0062);
}

a.button_buy{ display:none; float:left; width:40%; text-align:center; margin:15px 10px 50px 10px;
border:1px solid #ff2596; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:200%;padding: 19px 19px 19px 19px; text-decoration:none;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #fff;
 background-color: #ff5db1; background-image: -webkit-gradient(linear, left top, left bottom, from(#ff5db1), to(#ef007c));
 background-image: -webkit-linear-gradient(top, #ff5db1, #ef007c);
 background-image: -moz-linear-gradient(top, #ff5db1, #ef007c);
 background-image: -ms-linear-gradient(top, #ff5db1, #ef007c);
 background-image: -o-linear-gradient(top, #ff5db1, #ef007c);
 background-image: linear-gradient(to bottom, #ff5db1, #ef007c);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff5db1, endColorstr=#ef007c);
}

a.button_buy:hover{ 
 border:1px solid #f60080;
 background-color: #ff2a98; background-image: -webkit-gradient(linear, left top, left bottom, from(#ff2a98), to(#bc0062));
 background-image: -webkit-linear-gradient(top, #ff2a98, #bc0062);
 background-image: -moz-linear-gradient(top, #ff2a98, #bc0062);
 background-image: -ms-linear-gradient(top, #ff2a98, #bc0062);
 background-image: -o-linear-gradient(top, #ff2a98, #bc0062);
 background-image: linear-gradient(to bottom, #ff2a98, #bc0062);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#ff2a98, endColorstr=#bc0062);
}


/*상품설명페이지의 상담버튼*/
a.button_estimate{ float:right; width:44%; text-align:center; margin:15px 0px 50px 5px;
border:1px solid #df0909; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:200%; padding: 10px 10px 10px 10px; text-decoration:none; display:block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
 background-color: #f62b2b; background-image: -webkit-gradient(linear, left top, left bottom, from(#f62b2b), to(#d20202));
 background-image: -webkit-linear-gradient(top, #f62b2b, #d20202);
 background-image: -moz-linear-gradient(top, #f62b2b, #d20202);
 background-image: -ms-linear-gradient(top, #f62b2b, #d20202);
 background-image: -o-linear-gradient(top, #f62b2b, #d20202);
 background-image: linear-gradient(to bottom, #f62b2b, #d20202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f62b2b, endColorstr=#d20202);
}

a.button_estimate:hover{
 border:1px solid #b30808;
 background-color: #e40a0a; background-image: -webkit-gradient(linear, left top, left bottom, from(#e40a0a), to(#9f0202));
 background-image: -webkit-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -moz-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -ms-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -o-linear-gradient(top, #e40a0a, #9f0202);
 background-image: linear-gradient(to bottom, #e40a0a, #9f0202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e40a0a, endColorstr=#9f0202);
}


/*홈 메인화면의 상담버튼*/
a.button_estimate2{ clear:both; width:90%; height:30px; line-height:30px; margin:10px auto 0; text-align:center;
border:1px solid #df0909; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:140%; padding: 10px 10px 10px 10px; text-decoration:none; display:block;text-shadow: -1px -1px 0 rgba(0,0,0,0.3);font-weight:bold; color: #FFFFFF;
 background-color: #f62b2b; background-image: -webkit-gradient(linear, left top, left bottom, from(#f62b2b), to(#d20202));
 background-image: -webkit-linear-gradient(top, #f62b2b, #d20202);
 background-image: -moz-linear-gradient(top, #f62b2b, #d20202);
 background-image: -ms-linear-gradient(top, #f62b2b, #d20202);
 background-image: -o-linear-gradient(top, #f62b2b, #d20202);
 background-image: linear-gradient(to bottom, #f62b2b, #d20202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f62b2b, endColorstr=#d20202);
}

a.button_estimate2:hover{
 border:1px solid #b30808;
 background-color: #e40a0a; background-image: -webkit-gradient(linear, left top, left bottom, from(#e40a0a), to(#9f0202));
 background-image: -webkit-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -moz-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -ms-linear-gradient(top, #e40a0a, #9f0202);
 background-image: -o-linear-gradient(top, #e40a0a, #9f0202);
 background-image: linear-gradient(to bottom, #e40a0a, #9f0202);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e40a0a, endColorstr=#9f0202);
}



/*shop상세설명끝*/



/*홈>유지보수 절차*/

h5.localtitle{width: 100%;
color: #DE3F0A;
font-size: 120%;
margin: 30px 0px 10px;
font-weight: bold;
}


/*유지보수 비용*/
table.maintenace {
	border-collapse:collapse;    /* border 사이의 간격 없앰 */
	border-top: 2px solid #333;       /* border 상단 두께 지정 */
	border-bottom: 1px solid #333;    /* border 하단 두께 지정 */
	width:100%; 
	height:auto;

	margin-bottom:30px;
}
table.maintenace tbody{width:100%;}
table.maintenace tr{width:100%;}
table.maintenace th, td {/* 테이블의 th 와 td 마진과 패딩 지정 */
	padding:8px 0;
}
table.maintenace th, td:hover {
	background:#fff;
}

table.maintenace th {
	background: #F2F5F9;
	color: #777; 
	border-bottom:1px dotted #000;
	width:20%;
}

table.maintenace td.title{background:#fefefe;
	text-align:center;
}

table.maintenace td {
	border-bottom:1px dotted #666;
	color:#777;
	text-align:right;
}

table.maintenace td.on {
	color:#ff5b89;
}

table.maintenace td em{font-weight:bold; font-style:normal; color:#9933ff; font-size:160%;}
/*유지보수 비용끝*/




/*부분수정 비용*/
table.part {
	border-collapse:collapse;    /* border 사이의 간격 없앰 */
	border-top: 2px solid #333;       /* border 상단 두께 지정 */
	border-bottom: 1px solid #333;    /* border 하단 두께 지정 */
	width:100%; 
	height:auto;

}
table.part tbody{width:100%;}
table.part tr{width:100%;}
table.part th, td {/* 테이블의 th 와 td 마진과 패딩 지정 */
	padding:8px 0;
}
table.part th, td:hover {
	background:#fff;
}

table.part th {
	background: #F2F5F9;
	color: #777; 
	border-bottom:1px dotted #000;
	width:20%;
}

table.part td.title{background:#fefefe;}

table.part td {
	border-bottom:1px dotted #666;
	color:#777;
	text-align:center;
}

table.part td.on {
	color:#ff5b89;
}

table.part td em{font-weight:bold; font-style:normal; color:#9933ff; font-size:160%;}
/*부분수정 비용끝*/




table.maintenancelist {
	border-collapse:collapse;    /* border 사이의 간격 없앰 */
	border-top: 2px solid #333;       /* border 상단 두께 지정 */
	border-bottom: 1px solid #333;    /* border 하단 두께 지정 */
	width:100%; 
	height:auto;
	font-size:100%;
}
table.maintenancelist tbody{width:100%;}
table.maintenancelist tr{width:100%;}
table.maintenancelist th, td {/* 테이블의 th 와 td 마진과 패딩 지정 */
	padding:8px 0;
}
table.maintenancelist th, td:hover {
	background:#fff;
}

table.maintenancelist th {
	background: #F2F5F9;
	color: #777; 
	border-bottom:1px dotted #000;
	
}

table.maintenancelist td.title{background:#fefefe;width:20%;}

table.maintenancelist td {
	border-bottom:1px dotted #666;
	color:#777;
	text-align:center;
}

table.maintenancelist td.on {
	color:#ff5b89;
}

table.maintenancelist td em{font-weight:bold; font-style:normal; color:#9933ff; font-size:160%;}




table.maintenancefq {
	border-collapse:collapse;    /* border 사이의 간격 없앰 */
	border-top: 2px solid #333;       /* border 상단 두께 지정 */
	border-bottom: 1px solid #333;    /* border 하단 두께 지정 */
	width:100%; 
	height:auto;

}
table.maintenancefq tbody{width:100%;}
table.maintenancefq tr{width:100%;}
table.maintenancefq th, td {/* 테이블의 th 와 td 마진과 패딩 지정 */
	padding:8px 0;
}
table.maintenancefq th, td:hover {
	background:#fff;
}

table.maintenancefq th {
	background: #F2F5F9;
	color: #777; 
	border-bottom:1px dotted #000;
}

table.maintenancefq th.title{ width:40%;}

table.maintenancefq td.title{background:#fefefe;}

table.maintenancefq td {
	border-bottom:1px dotted #666;
	color:#777;
	text-align:center;
}

table.maintenancefq td.on {
	color:#ff5b89;
}

table.maintenancefq td em{font-weight:bold; font-style:normal; color:#9933ff; font-size:160%;}



/*홈 > 안내 페이지 공통버튼*/
.button_go{
border:1px solid #d7dada; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:95%;padding: 5%; text-decoration:none; display:inline-block;
 color: #777; margin:1%;
 background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
 background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd);
}

.button_go:hover{
 border:1px solid #bfc4c4;
 background-color: #d9dddd; background-image: -webkit-gradient(linear, left top, left bottom, from(#d9dddd), to(#c6c3c3));
 background-image: -webkit-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -moz-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -ms-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -o-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: linear-gradient(to bottom, #d9dddd, #c6c3c3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d9dddd, endColorstr=#c6c3c3);
}


/*홈>제작비용*/
section#howmuch .titleimg{width:100%; height:auto; margin:0 0 15px 0; background:#e56161; padding:50px 0; border-radius:0 20px;}
section#howmuch .titleimg h4{height:auto; color:#fff; font-size:400%; font-weight:bold;text-align:center;}
section#howmuch .titleimg h4 b{color:#333;}
section#howmuch .titleimg p.subtitle{clear:both;display:block; height:30px; font-size:140%; color:#fafafa;text-align:center;padding:10px;}
section#howmuch ul {margin-top:20px;}
section#howmuch ul li{float:left; width:26%; margin:0.5%; text-align:center;}
section#howmuch ul li a{display:block; width:100%; height:200px; line-height:200px; font-size:140%;
border:1px solid #d7dada; -webkit-border-radius: 8px; -moz-border-radius: 8px;border-radius: 8px; display:inline-block;font-weight:bold; 
   background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
 background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd);
}
section#howmuch ul li a:hover{
 border:1px solid #bfc4c4;
 background-color: #d9dddd; background-image: -webkit-gradient(linear, left top, left bottom, from(#d9dddd), to(#c6c3c3));
 background-image: -webkit-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -moz-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -ms-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -o-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: linear-gradient(to bottom, #d9dddd, #c6c3c3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d9dddd, endColorstr=#c6c3c3);
}

/*홈>제작절차*/
section#henalprocess .titleimg{width:100%; height:auto; margin:0 0 15px 0; background:#79beaa; padding:50px 0; border-radius:0 20px;}
section#henalprocess .titleimg h4{height:auto; color:#fff; font-size:400%; font-weight:bold;text-align:center;}
section#henalprocess .titleimg h4 b{color:#333;}
section#henalprocess .titleimg p.subtitle{clear:both;display:block; height:30px; font-size:140%; color:#fafafa;text-align:center;padding:10px;}
section#henalprocess ul {margin-top:20px;}
section#henalprocess ul li{float:left; width:26%; margin:0.5%; text-align:center;}
section#henalprocess ul li a{display:block; width:100%; height:200px; line-height:200px; font-size:140%;
border:1px solid #d7dada; -webkit-border-radius: 8px; -moz-border-radius: 8px;border-radius: 8px; display:inline-block;font-weight:bold; 
   background-color: #f4f5f5; background-image: -webkit-gradient(linear, left top, left bottom, from(#f4f5f5), to(#dfdddd));
 background-image: -webkit-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -moz-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -ms-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: -o-linear-gradient(top, #f4f5f5, #dfdddd);
 background-image: linear-gradient(to bottom, #f4f5f5, #dfdddd);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#f4f5f5, endColorstr=#dfdddd);
}
section#henalprocess ul li a:hover{
 border:1px solid #bfc4c4;
 background-color: #d9dddd; background-image: -webkit-gradient(linear, left top, left bottom, from(#d9dddd), to(#c6c3c3));
 background-image: -webkit-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -moz-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -ms-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: -o-linear-gradient(top, #d9dddd, #c6c3c3);
 background-image: linear-gradient(to bottom, #d9dddd, #c6c3c3);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d9dddd, endColorstr=#c6c3c3);
}
/*홈>제작절차끝*/


/*홈>제작절차>웹사이트 제작절차*/
section#websiteprocess .titleimg{width:100%; height:auto; margin:0 0 15px 0; background:#ff1d72; padding:50px 0; border-radius:0 20px;}
section#websiteprocess .titleimg h4{height:auto; color:#fff; font-size:400%; font-weight:bold;text-align:center;}
section#websiteprocess .titleimg h4 b{color:#333;}
section#websiteprocess .titleimg p.subtitle{clear:both;display:block; height:30px; font-size:140%; color:#fafafa;text-align:center;padding:10px;}
section#websiteprocess ul {padding:50px 0;}
section#websiteprocess ul li{float:left; width:26%; height:120px; margin:0 5px; padding:20px; color:#777;margin-bottom:10px; border:1px solid #f1f1f1; }
section#websiteprocess ul li h4{color:#333;font-size:140%; padding:10px 0; font-weight:bold;}
section#websiteprocess ul li h4 b{padding:5px; background:#ff1d72; color:#fff; padding:0 10px;}
section#websiteprocess ul li p{padding:5px 0; color:#777;}

/*홈>제작절차>솔루션 제작절차*/
section#solutionprocess .titleimg{width:100%; height:auto; margin:0 0 15px 0; background:#ff33cc; padding:50px 0; border-radius:0 20px;}
section#solutionprocess .titleimg h4{height:auto; color:#fff; font-size:400%; font-weight:bold;text-align:center;}
section#solutionprocess .titleimg h4 b{color:#333;}
section#solutionprocess .titleimg p.subtitle{clear:both;display:block; height:30px; font-size:140%; color:#fafafa;text-align:center;padding:10px;}
section#solutionprocess ul {padding:50px 0;}
section#solutionprocess ul li{float:left; width:26%; height:120px; margin:0 5px; padding:20px; color:#777;margin-bottom:10px; border:1px solid #f1f1f1;}
section#solutionprocess ul li h4{color:#333;font-size:140%; padding:10px 0; font-weight:bold;}
section#solutionprocess ul li h4 b{padding:5px; background:#ff33cc; color:#fff; padding:0 10px;}
section#solutionprocess ul li p{padding:5px 0; color:#777;}

/*홈>제작절차>추가 제작절차*/
section#optionprocess .titleimg{width:100%; height:auto; margin:0 0 15px 0; background:#cc33ff; padding:50px 0; border-radius:0 20px;}
section#optionprocess .titleimg h4{height:auto; color:#fff; font-size:400%; font-weight:bold;text-align:center;}
section#optionprocess .titleimg h4 b{color:#333;}
section#optionprocess .titleimg p.subtitle{clear:both;display:block; height:30px; font-size:140%; color:#fafafa;text-align:center;padding:10px;}
section#optionprocess ul {padding:50px 0;}
section#optionprocess ul li{float:left; width:26%; height:100px; margin:0 5px; padding:20px; color:#777;margin-bottom:10px; border:1px solid #f1f1f1; }
section#optionprocess ul li h4{color:#333;font-size:140%; padding:10px 0; font-weight:bold;}
section#optionprocess ul li h4 b{padding:5px; background:#cc33ff; color:#fff; padding:0 10px;}
section#optionprocess ul li p{padding:5px 0; color:#777;}

/*홈>제작절차>유지보수 절차*/
section#maintenanceprocess .titleimg{width:100%; height:auto; margin:0 0 15px 0; background:#9933ff; padding:50px 0; border-radius:0 20px;}
section#maintenanceprocess .titleimg h4{height:auto; color:#fff; font-size:400%; font-weight:bold;text-align:center;}
section#maintenanceprocess .titleimg h4 b{color:#333;}
section#maintenanceprocess .titleimg p.subtitle{clear:both;display:block; height:30px; font-size:140%; color:#fafafa;text-align:center;padding:10px;}
section#maintenanceprocess ul {padding:50px 0;}
section#maintenanceprocess ul li{float:left; width:26%; height:100px; margin:0 5px; padding:20px; color:#777;margin-bottom:10px; border:1px solid #f1f1f1; }
section#maintenanceprocess ul li h4{color:#333;font-size:140%; padding:10px 0; font-weight:bold;}
section#maintenanceprocess ul li h4 b{padding:5px; background:#9933ff; color:#fff; padding:0 10px;}
section#maintenanceprocess ul li p{padding:5px 0; color:#777;}

/*홈>상품상세설명페이지*/
section#henalportfolio{
	width:100%;
	height: 514px;
	background:url("/henal/img/img_imacbg.png") center center no-repeat;
}
article#henalportfolio{
	width:100%;
}
.henalportfolio{
	width:600px;
	height:337px;
	margin:0 auto;
	padding-top:35px;
}

section#henalportfolio_m{
	width:100%;
	height: 514px;
	background:url("/henal/img/img_iphonebg.png") center center no-repeat;
}
article#henalportfolio_m{
	width:100%;
}
.henalportfolio_m{
	width:236px;
	height:384px;
	margin:0 auto;
	padding-top:60px;
	padding-left:3px;
}



/*홈>상품상세설명페이지끝*/


/*홈>회원가입*/
.mbskin .tbl_frm01 th {width:30%;}
.mbskin .tbl_frm01 td {width:70%;}
ul.join_step{
	display:block; 
	width:99%; height:50px; margin-bottom:20px;
	padding:20px 0;
	background:url("/henal/img/swirl_pattern.png") center center repeat; /*noisy_grid.png swirl_pattern.png graphy.png*/
	border:1px solid #fafafa;
}
ul.join_step li{float:left; display:block; width:30%; height:45px; line-height:45px; text-align:center; margin:0 1%; font-size:120%;}
ul.join_step li.on{color:#f30; font-size:130%; font-weight:bold;}
#fregister h2 {text-align:left; margin-bottom:10px;}
#fregister section{margin-bottom:0; padding:0;}

.ment{font-size:120%; text-align:center;}
.caution{color:#f30; font-size:90%;}


/*상품안내페이지의 탭메뉴*/

#tabbox {
	width: 100%;
	height:auto;
}

ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    height: auto;
    border-left: 1px solid #eee;
    width: 100%;
}

ul.tabs li {
    float:left;
    text-align:center;
    cursor: pointer;
    width:33%;
    height: 60px;
    line-height: 60px;
    font-size:130%;
    border: 1px solid #eee;
    border-left: none;
    font-weight: bold;
    background: #fafafa;
    overflow: hidden;
    position: relative;
}

ul.tabs li a{display:block; width:100%; height:100%;}

ul.tabs li.half{width:49%;}

ul.tabs li.active {
    color:#f20;
    background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}

ul.tabs li span{display:none; font-size:80%; color:#444; font-weight:normal;}


.tab_container {
    border: 0px solid #eee;
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
height:auto;
    background: #FFFFFF;
	padding:15px 0;
}
.tab_content {
height:auto;
    /*padding:5px;  내부의 li을 침범해서 일단 막음*/
    display: none;
}
.tab_container .tab_content ul {
    width:100%;height:auto;
    margin:0px;
    padding:0px;
}
.tab_container .tab_content ul li {
    /*padding:5px;  내부의 li을 침범해서 일단 막음*/
    list-style:none
height:auto;
}

/*홈 > 앱*/
a.henalapp{display:block;position:absolute; right:0; bottom:0; width:300px; height:31px; line-height:31px; margin-bottom:5px; text-indent:40px; background:url("/henal/img/img_henalapp.png") left center no-repeat;}