@font-face{font-family:'Spoqa-Han-Sans-Regular'; src:url('../font/Spoqa-Han-Sans-Regular.woff')}

*{margin:0; padding:0;outline:none; }
body {font-family: /*'宋體', 'simsun', Arial;*/'Spoqa-Han-Sans-Thin', sans-serif; }

ul,li{list-style:none;}
	a{text-decoration:none; color:inherit;}
	img{display:block;}
input {
   -webkit-appearance: none;
   -webkit-border-radius: 0;
}
textarea{
	padding:2%; 
	box-sizing:border-box;
	color:#666; 
	font-size:12px;
}
input::placeholder {
  color: #bbb;
}
select::-ms-expand {
   display: none;   /* 화살표 없애기 for IE10, 11*/
}

#wrap{width:100%; max-width:1024px; margin:0 auto;}
	
.header{
width:100%; 
height:60px; 
background:#000; 
color:#fff; 
position:relative; 
top:0; 
left:0; 
z-index:20
}
.section{
position:relative; z-index:5
}
.section img{width:100%; height:auto;}
.footer{
position:relative;  
width:100%; 
background:#222; 
text-align:center 
}
.footer img{
display:inline-block
}

/* 메뉴  */
#wrap .over{
	width:100%;  
	height:100%;
	background:rgba(53,53,53,0.5);  
	position:fixed; 
	top:0;
	left:0; 
	z-index:25; 
	display:none;
}	
.menu{
	width:77%; 
	height:100%; 
	background:rgba(25,25,25,0.8); 
	position:fixed; 
	top:0;
	right:0; 
	z-index:50; 
	display:none; 
	color:#fff;
	overflow:auto;
}
.close{
	width:18px; 
	height:29px; 
	margin:4% 0 0 7%
}
.close img{width:100%; height:100%;}

.all{width:100%;}
.all:after{content:""; display:block; clear:both;}
.all>div{
	float:left; 
	width:50%; 
	height:20px; 
	line-height:25px; 
	margin:17px 0 5px 0;
	text-align:center; 
}
.all>div a{display:block;}
.login{border-right:1px solid #fff; box-sizing:border-box;}

.nav{ 
	margin-left:5%; 
	font-family:'OmniGothic50', sans-serif;
	font-weight:bold;
}
.nav>li{
	position:relative;
	color:#fff; 
	font-size:19px; 
	padding:6.5px 0; 
	cursor:pointer;
	
}

.nav>li>a{
	display:inline-block; 
	width:80%;
	height:20px;
	line-height:20px;
	
}
.nav li>span {
	position:relative; 
	display:inline-block; 
	width:20px; 
	height:20px;			
	vertical-align:middle; 
	margin-right:10px;
	
}
.nav li>span:before,.nav li>span:after{
	content:"";
	position:absolute;
	background-color:#fff
}
.nav li>span:before {
	width:2px;
	height:18px;
	left:8px;
	top:1.5px
}
.nav li.on>span:before {
	display:none;
}
.nav li>span:after {
	width:18px;
	height:2px;
	left:0;
	top:8.5px
}
.nav>li:nth-child(1){margin-top:6%;}
.nav span,.nav>li>a{vertical-align:middle;}
/*
.nav span,.nav>li,.nav>li a,.nav li>span:before,.nav li>span:after{vertical-align:middle;}
*/
.submenu{
	display:none; 
	padding-left:30px; padding-top:6px; box-sizing:border-box; 
}
.submenu>li{
	font-size:16.5px; 
	font-family:'OmniGothic30', sans-serif;
	padding:6.5px 0;
}
.submenu>li:nth-child(1){padding-top:8px;}

.call{
	/*position:absolute;
	bottom:10%;*/
	margin-top:39%;
	width:100%;
	text-align:center;
}
.call h4{text-indent:-170px}
.call a{color:#3cc0c5}
.call span{
	display:inline-block;
	font-weight:lighter;
	font-size:19px;
	color:#fff;
}
.call h1{font-size:180%;}

.language{/*position:absolute; bottom:1%;*/margin-top:8%; width:100%; }
.language ul:after{content:""; display:block; clear:both;}
.language ul>li{width:50%; float:left; height:40px; line-height:30px; }
.language ul>li a{display:block; width:80px; height:30px; text-align:center; border:1px solid #fff; }
.language ul>li:nth-child(1) a{margin-left:40%;}
.language ul>li:nth-child(2) a{margin-left:7%;}






/* header */
.header h2{
 position:absolute; 
 top:7px; 
 left:50%; 
 transform:translatex(-50%);
 letter-spacing:0.7px; 
 text-indent:4.5px;
 }
.header .sub{
 font-size:9px; 
 letter-spacing:7.5px; 
 position:absolute; 
 bottom:20.5%; 
 left:50%; 
 transform:translatex(-50%); 
 text-indent:10px 
 }
.main{
 position:absolute; 
 top:14.3px; 
 right:15px; 
 width:28px; 
 height:30px; 
 line-height:40px 
 }
.main img{
 width:100%; 
 }

/* sns - 다이렉트메뉴*/


.direct{
	position:absolute;
	top:60px;
	left:15px; 
	width:55px;
	z-index:10
}
.sub_dir{
	position:absolute; 
	top:110px; 
}
.coun,.calling,.kkof{
	width:50px; 
	height:50px;  
	margin-top:10px; 
}
.direct>div img{
	width:100%; 
	opacity:0.7;
}
.direct>div a{
	display:block; 
	width:100%; 
	height:100%
}
.side-btn {
	 position:absolute;
	 right:-20px;
	 top:40px;
	 width:auto;
	 height:auto;  
	 padding:5px;
	 background:rgba(50,50,50,0.6); 
	 border-radius:6px; 
	 writing-mode:tb-rl
}
.side-btn span {
	  display:inline-block;
	  position:absolute;
	  left:0;
	  top:0;
	  overflow:hidden; 
	  text-indent:-9999px 
}
.side-btn:after {content:"Close"; color:#fff;}
.direct.off .side-btn:after {content:"Show"; }
.direct.off {left:-57px}
  
  
/* index 컨텐츠 */  
.insta,.youtube,.stargram,.content{
	position:relative;
	border-bottom:1px solid #ddd; 
	box-sizing:border-box; 
}

.push{position:relative; width:100%; height:50px; line-height:50px; text-align:center; 
	 }
p{text-align:center; }
.push p span{
	font-size:18px; 
	font-weight:bold;
}
.ins span{
	color:purple;  
}
.you span{
	color:red; 
}
.gram span{
	color:#4dd1d4; 
}
.clinic span{
	color:salmon; 
}

#instafeed,#insta2{padding-bottom:3%; box-sizing:border-box; }
#instafeed:after,#insta2:after{content:""; display:block; clear:both;}
#instafeed img,#insta2 img{width:31%; display:inline-block; float:left; margin:0.75% 0 0.5% 1.35%;  border:1px solid #eee; }

.load{position:relative; width:100%; height:100%; }
.load img{width:100%;}

.youtube .load{
	padding:5% 0; width:100%; box-sizing:border-box;
}
.youtube .load iframe{width:90%; margin-left:5%; border:none;}

.arrow{position:absolute; top:20px; right:5%;
	width: 0px;height: 0px;
	border-top:10px solid none;
	border-bottom:10px solid #bbb;
	border-right: 10px solid transparent;
	border-left: 10px solid  transparent;
	border-radius:3px;}
.arrow.on{transform:rotate(180deg);}


/* 메인 바로가기 탭  brow/ line/ lips/ mans / special */
.content{position:relative;}
.content .load div{
	width:100%; 
	height:auto;  
	overflow:hidden
}
.content .load div:nth-child(5){border:none;}
.fotorama li {width:100%;}
		
/* footer */
.map{
	width:100%;
	} 
.map img{
	width:100%;
	}	

.sns li{
	display:inline-block;
	width:60px;
	margin:20px 8px 5px 8px;
}
.sns li img{
	width:100%;
}	

.footLine>img{width:100%; }
.nation{
	padding-bottom:15px;
	width:100%;
	}	
.nation li{
	display:inline-block;
	background:;
	vertical-align:middle;
	font-size:13px; 
	font-weight:bold;
	color:#ddd;
	margin:0 0.5%;
}
.nation li:nth-child(1),.nation li:nth-child(2){width:40px; height:28px; }
.nation li:nth-child(1) img,.nation li:nth-child(2) img{width:100%; height:100%;}	
	
address{
	font-style:normal; 
	font-size:10.5px; 
	color:#fff; 
	padding:5px 15px 15px 15px
	}
small{font-size:11px; letter-spacing:-1px;}

	
/*  서브페이지 ////////////////////////  sub로 시작하는 .html 페이지 css  */	

/* 로그인하면 .before b 없애주세요~ Before&After before 사진 !!!!!!!!!!!!!!!!!!!!!!!!!!! */


/* sub page section */
.sub-section{
	position:relative; 
	width:100%; 
	/*height:100%; */
	}
.sub-section>p{position:relative; width:100%}
.sub-section img{
	width:100%; 
	height:100%;
	}

	
/* text_animation 페이지 text 깜빡임 */ 
#txtmation{
	 position:absolute; 
	 left:50%;
	 transform:translateX(-50%);
	 display:none;
}
 .ani2{width:58%;top:6.37%; }
 .ani31{width:80%;top:6.37%; }
 .ani32{width:88%;top:8%;}
 .ani33{width:88%;top:7.8%;}
 .ani4{width:90%;top:6.85%; }
 .ani5{width:78%; top:15.8%; }
 .ani11{width:80%; top:6.5%}
 .ani12{width:80%; top:8.7%}
 .ani13{width:80%; top:10.9%}
 .ani14{width:80%; top:19%}
 .ani15{width:80%; top:9%}
 
 
/* sub1-2 결색소 video */
.sub_vid2{position:relative; width:100%; margin:20px 0 35px 0;}
.sub_vid2 p{width:100%; height:35px; line-height:35px}
.vid2-1{margin-bottom:20px;}
.sub_vid2 video{width:100%;} 

/*  sub6 결스타 */	
.star_bd{width:100%; margin-bottom:35px}
.imgs{
	width:94%;
	position:relative;
	top:20px;
	left:3%;
}
.imgs:after{content:""; display:block; clear:both;}
.imgs li{
	width:50%;	
	float:left;
	margin:0 0 3% 0;
	font-size:14px;
}
.imgbox{
	width:100%;
	position:relative;
}

/* sub 7-1  리얼스토리 */
.headup {z-index:8; position:relative; top:0; left:0; }
.realtalk{position:relative; top:-10px; left:0; width:100%; z-index:4; text-align:center; }
#story{position:relative;}
#story>li img{margin:20px 0;}	
.plus {width:40px; height:40px; position:absolute; bottom:20px; right:0; }
/* 7-1 .tail */
.tail{display:none; position:relative; }
.subclosing{width:24px; height:24px; position:absolute; top:2.5%;right:2.5%; }	
 

/* sub 7-2 , 7-3 , 7-4 리얼스토리 탭메뉴 - id-tabs */
#tabs>ul:after{content:""; display:block; clear:both;}
#tabs>ul>li{border-right:1px solid #ddd; border-bottom:1px solid #ddd;display:inline-block; height:50px; line-height:50px;float:left; text-align:center; box-sizing:border-box; font-weight:bold;font-weight:bold; color:#aaa;font-size:15px;  }
#tabs>ul>li a{display:block;}
#tabs>ul>li:last-child{border-right:none;}
#tabs>ul>li.on{color:#4dd1d4}

/* tabs .headimg */
.headimg{width:100%;  }

/* tabs .real_tab  */
.real_tab{width:100%; }
.real_tab li,h5 p{
	width:92%; 
	margin-left:4%; 
	margin:3.5% 0 3.5% 4%; 
}
.real_tab li:last-child{margin-bottom:0.5%}
.real_tab li a:after{content:""; display:block; clear:both;}
.real_tab li:after{content:""; display:block; clear:both;}
.real_tab li p{
	width:50%; 
	height:auto;/*height:105px;  */
	float:left; 
	display:inline-block;
	border:1px solid #d5d5d5; 
	box-sizing:border-box; 
	position:relative;  
}
.real_tab li p:first-child{border-right:none;}
.real_tab li p img{width:100%; }
.real_tab li p em{
	font-style:normal; 
	color:#fff; 
	position:absolute;
	width:24%; 
	height:16%;
}
.real_tab li p strong{ 
	font-size:10px; 
	position:absolute; 
	bottom:3px; 
	left:50%; 
	transform:translateX(-50%);
}

.before b{position:absolute;top:0; left:0; background:rgba(25,25,25,0.8); width:100%; height:100%; z-index:1; color:#fff; font-size:11px; text-align:center;}
.before b i{display:inline-block; position:absolute; width:100%; top:50%; left:50%; transform:translate(-50%,-50%); font-style:normal; }
.before b i:before{content:"登录后可看更多的术";}
.before b i:after{content:"前术后对比照"; display:block; margin-top:5px;}

.before em{ background:#8f8f8f;right:0; bottom:0;}
.after em{background:#4dd1d4; left:0; bottom:0;}
.before strong:before{content:"before"}
.after strong:before{content:"After"}

/*  sub2,3,4 하단 게시판  */
.after .sub2,.tag22{background:#2a6365;}
.after .sub31,.tag31{background:#4d9cd4;}
.after .sub32,.tag32{background:#ff5988;}
.after .sub33,.tag33{background:#c49800;}
.after .sub4,.tag44{background:#302a55;}
h5 p{height:30px; line-height:30px; color:#fff; margin-left:50%; transform:translate(-50%); margin-bottom:-10px; }


/* sub,2,3,4, sub 7-2 , 7-3 , 7-4 시술 후 멍 등 안내문 */
.caution{height:40px; line-height:40px; font-size:11px; letter-spacing:-1px; margin-bottom:12px;}
.caution:before{content:"* 术后根据肤质和体质不一样，会有不同现象的出血，肿胀等反应 *"}


/* pageing sub 6 /7-1 / 7-2 / 7-3 /7-4 */
.pageing {text-align:center; margin:0 0 33px 0; }
.pageing * {font-size:12px;color:#333;vertical-align:middle}
.page_fr,.page_ls,.page_pr,.page_nx {display:inline-block;
width:26px;height:26px;
overflow:hidden;text-indent:-9999px;
background:transparent url(../images/page.png) no-repeat 0 0; }
.page_fr,.page_pr,.page_nx,.page_ls{display:none;} 

.first:hover {background-position:0 100%}
.page_ls {background-position:-31px 0; }
.page_ls:hover {background-position:-31px 100%}
.page_nx {background-position:-62px 0}
.page_nx:hover {background-position:-62px 100%}
.page_pr {background-position: 100% 0}
.page_pr:hover {background-position:100% 100%}
.pageList {margin:0 7px}
.pageing span a {display:inline-block;position:relative;min-width:16px; width:26px; height:26px;color:#333;line-height:26px;/*background:transparent url(../img/bg/num_bg.png) no-repeat 0 0;*/ border:1px solid #ddd; vertical-align:middle; }
.pageing span a:first-child{}
.pageing span a em {display:block;padding:0 10px;height:100%;/*background:transparent url(../img/bg/num_bg.png) no-repeat 100% 0; */ font-style:normal; }
.pageing span a:hover {background-position:0 100%}
.pageing span a:hover em {color:#555;background-position:100% 100%}
.pageing span a.on {background-position:0 -26px; border-color:#4dd1d4; }    
.pageing span a.on em {color:#4dd1d4; font-weight:bold; background-position:100% -26px}	
	

/*  텍스트 제목 서브페이지 CSS  : login, member, memcomplete, reserv, searchid, seachpass */ 

/* 로그인 회원가입 등 '준비중 입니다' 문구 cover  */
.delay{
	position:fixed; 
	top:0;
	left:0;
	width:100%; 
	height:100%; 
	background:rgba(255,255,255,0.9); 
	z-index:40;
	/*display:none*/
}
.delay p{margin-top:50%; line-height:25px}
.delay p img{width:32%; margin-left:50%; transform:translateX(-50%);}
.delay strong{font-size:18px; }
.delay em{color:#4dd1d4; font-style:normal}


/* table wrap */
.subwrap{
	position:relative; 
	width:92%;
	height:auto;
	margin:2.7% -4% 7% 4%;
	}
.subwrap input{
	font-weight:bold; 
	letter-spacing:-1px; 
	font-size:14px;
	}

/* 전체페이지 title  */
.log1{font-size:25px; letter-spacing:-2.5px}
.log1 span{
	color:#4dd1d4; 
	display:inline-block;
	font-size:26px;
}/* title 설명 */
.log2{
	font-size:11px; 
	letter-spacing:0px; 
	font-weight:bold;
	margin:1.5% 0 6% 0;
}
/* reserv title 줄간격때문에 log2삭제 .second로 변경 */
.second{font-size:12px; letter-spacing:-1px; line-height:15px; }


/*  전체페이지 span 컬러색지정  */
.color{color:#4dd1d4; font-weight:bold; font-size:14px;}


/*  clear:both   --    member, searchid, searchpass, login  */
.clear {clear:both; height:0; overflow:hidden;} 

/* ? */
.big{font-size:20px; color:#4dd1d4; font-weight:bold;}



/* table box 테이블 시작 : reserv, member, searchid, searchpass  */
.writebox{width:100%;}
.writebox li >span{display:inline-block; width:19% }
.writebox>li{margin:3.5% 0;}	
.writebox .notempty{font-size:13px; margin:3% 0;  }
.writebox .notempty span{width:auto;}
.writebox .notempty span em{color:#666; font-style:normal; letter-spacing:-1px;}
.writebox li form {display:inline-block; width:80%; }
.writebox li form select:first-child{margin-left:0;}
.writebox>li input{height:38px; }
.writebox li span,.writebox li form,.check,textarea{vertical-align:middle;}
			/*  생년월일  member, searchid, searchpass */
.writebox select{
	float:left; 
	width:32.3%; 
	height:40px; 
	margin-left:1.5%; 
	border:1px solid #d5d5d5; 
	box-sizing:border-box; 
	color:#aaa;
    padding:10px;
    border-radius: 3px;
    -webkit-appearance: none; /* 화살표 없애기 for chrome*/
    -moz-appearance: none;    /* 화살표 없애기 for firefox*/
    appearance: none;
	background: url('../images/joinarrow.png') no-repeat 92% 50%;
	background-size:15px 9px;	/* 화살표 없애기 공통*/
}


.writebox>li input,.writebox select{vertical-align:middle;}

	/*  searchpass   */ 
#selectEmail{position:absolute; right:1.2%;  }



/* reserv  하단 개인정보 동의 checkbox + input */
.down{margin-bottom:30px; position:relative;}
.agree{font-weight:bold; font-size:1em; margin:6% 0; }
.agree>input[type=checkbox]{appearance:checkbox;-webkit-appearance:checkbox;-moz-appearance:checkbox;border:0px;padding:0px;height:1.5em;margin-top:-0.8%; }
.under{text-decoration:underline; color:#4dd1d4; font-weight:bold;}

.agree>input,.agree span{vertical-align:middle}

			/* reserv 개인정보 취급방침 자세히 보기 클릭시 */
.up{z-index:10;
	position:absolute; 
	top:0; 
	left:0; 
	width:100%; height:100%; 
	background:#fff;
	font-size:14px;
	display:none
}
.ubody{width:90%; height:90%; margin-left:5%;}
.exit{
	width:92%; 
	height:8%; 
	background:#4dd1d4; 
	color:#fff; 
	text-align:center;
	font-size:17px;
	margin-left:4%;
}
.exit strong{display:inline-block; margin-top:2.5%;}
	
	
/* .down1 -> login, searchid, searchpass  하단 취소, 확인 창  member.html은 .writein  */
.down1{width:100%; }
.down1 input,.writein input{
	height:44px;
	background:#4dd1d4;
	color:#fff;
	border:none;
	margin:6.5px 0;
}
.wide input{
	width:100%;
}
.half input{
	width:49%;
	background:#d5d5d5;
	float:left;
}
.half:after{content:""; display:block; clear:both;}
			/* login */
.half a:nth-child(2) input{margin-left:2%;}
			/* member - 취소/ 확인   */
.half input:nth-child(2){margin-left:2%;}
			/*  member '취소버튼', writein 으로  half 창과 따로 분리 */
.writein li input{font-size:16px; font-weight:bold; }
.writein .confirm{background:#4dd1d4}
	
	
/*  login  */
.ltb:after{content:""; display:block; clear:both;}
.ltb>div{float:left; }
.idpass:after{content:""; display:block; clear:both;}
.idpass{width:70%; height:100px;}
.idpass p{float:left; margin-bottom:10px; }
#box{width:75%;}
.title{width:25%; height:40px; line-height:40px; text-align:left; }

.idpass p input,input{
	color:#aaa; 
	font-weight:normal; 
	font-size:12.5px;
}
.idpass em{
	display:inline-block;
	font-style:normal;
	color:#4dd1d4;
	font-weight:bold;
	font-size:14px;
	letter-spacing:-1px
}
			/* login  로그인 버튼 */
.send1{width:30%; height:100px; margin-bottom:5px; }
.send1 input{
	width:98%; 
	height:90%;
	background:#4dd1d4;
	color:#fff;
	border:none;
	margin-left:2%;
}



/* member 약관/개인정보 취급방침 */
.personal{
	width:100%; 
	border:1px solid #ddd; 
	margin-bottom:4.5%;} 
.personal span{
	font-size:13.3px; 
	letter-spacing:-2px;
}
.personal p{
	padding:0 3%;
}
.per1{width:100%; 
	border-bottom:1px solid #ddd;
}
.per1:after{content:"";display:block; clear:both;}
.per1 li{
	display:inline-block;
	float:left;
	padding:2% 2%; box-sizing:border-box;/**/
	font-weight:bold;
}
.per1 li:nth-child(1){width:45%; }
.per1 li:nth-child(2){width:55%; text-align:right;}
			/* member 남/여 checkbox  */
.check{
	display:inline-block;
	width:79%; 
	height:40px;
	margin-left:-1.3%;
	position:relative; 
	overflow:auto;}
.check li {
	display:inline-block;
	border:1px solid #d5d5d5;
	box-sizing:border-box;
	width:30%;
	height:40px;
	line-height:40px;
	color:#4dd1d4; 
	font-weight:bold; 
	font-size:13.5px; 
	text-align:center;
}
input[id="cb1"] + label,input[id="cb2"] + label,input[id="cb3"] + label,input[id="cb4"] + label {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 1px solid #bbb;
  cursor: pointer;
  position:relative; top:2px;
}
input[id="cb1"]:checked + label:after,input[id="cb2"]:checked + label:after{
  position:absolute; 
  top:-17px; 
  left:0;
  content: '\2713';
  font-size: 18px;
 }
input[id="cb3"]:checked + label:after,input[id="cb4"]:checked + label:after {
  position:absolute; 
  top:-10px; 
  left:0;
  content: '\2713';
  font-size: 18px;
  color:#4dd1d4;
}
input[id="cb1"],input[id="cb2"],input[id="cb3"],input[id="cb4"] {
  display: none;
}
			/*  member  하단 '이메일 확인' 텍스트  */
.memberlogin p{
	font-size:11.5px; 
	letter-spacing:-1px; 
	line-height:16px;
	text-align:left;
	
	margin:15px 0;
}	
.memberlogin input{text-indent:2%;}