@charset "utf-8";

/* Font
------------------------------------------------------------------------------------------------------------------------------------------------------*/
	@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');

	@font-face {
	  font-family: 'Noto Sans KR';
	  font-style: normal;
	  font-weight: 100;
	  src: url(/skin/f_whoiswel/font/NotoSansKR-Thin.eot) format('eot'),
		   url(/skin/f_whoiswel/font/NotoSansKR-Thin.woff) format('woff'),
		   url(/skin/f_whoiswel/font/NotoSansKR-Thin.otf) format('opentype');
	}
	@font-face {
	  font-family: 'Noto Sans KR';
	  font-style: normal;
	  font-weight: 300;
	  src: url(/skin/f_whoiswel/font/NotoSansKR-Light.eot) format('eot'),
		   url(/skin/f_whoiswel/font/NotoSansKR-Light.woff) format('woff'),
		   url(/skin/f_whoiswel/font/NotoSansKR-Light.otf) format('opentype');
	}
	@font-face {
	   font-family: 'Noto Sans KR';
	   font-style: normal;
	   font-weight: 400;
	   src: url(/skin/f_whoiswel/font/NotoSansKR-Regular.eot) format('eot'),
			url(/skin/f_whoiswel/font/NotoSansKR-Regular.woff) format('woff'),
			url(/skin/f_whoiswel/font/NotoSansKR-Regular.otf) format('opentype');
	 }
	@font-face {
	   font-family: 'Noto Sans KR';
	   font-style: normal;
	   font-weight: 500;
	   src: url(/skin/f_whoiswel/font/NotoSansKR-Medium.eot) format('eot'),
			url(/skin/f_whoiswel/font/NotoSansKR-Medium.woff) format('woff'),
			url(/skin/f_whoiswel/font/NotoSansKR-Medium.otf) format('opentype');
	 }
	@font-face {
	   font-family: 'Noto Sans KR';
	   font-style: normal;
	   font-weight: 700;
	   src: url(/skin/f_whoiswel/font/NotoSansKR-Bold.eot) format('eot'),
			url(/skin/f_whoiswel/font/NotoSansKR-Bold.woff) format('woff'),
			url(/skin/f_whoiswel/font/NotoSansKR-Bold.otf) format('opentype');
	 }
	@font-face {
	   font-family: 'Noto Sans KR';
	   font-style: normal;
	   font-weight: 900;
	   src: url(/skin/f_whoiswel/font/NotoSansKR-Black.eot) format('eot'),
			url(/skin/f_whoiswel/font/NotoSansKR-Black.woff) format('woff'),
			url(/skin/f_whoiswel/font/NotoSansKR-Black.otf) format('opentype');
	}


/* Reset
------------------------------------------------------------------------------------------------------------------------------------------------------*/
	html,body{margin:0; padding:0; width:100%; height:100%;}
	body,div,section,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button{margin:0; padding:0; box-sizing:border-box;}
	article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary{display:block;}
	fieldset,img {border:0 none;}
	dl,ul,ol,menu,li {list-style:none;}
	blockquote, q {quotes:none;}
	blockquote:before, blockquote:after,q:before, q:after {content:''; content:none;}
	img,input,select,textarea,button {vertical-align:middle;}
	body{background:#fff; overflow-y:scroll; *overflow-y:; -webkit-text-size-adjust:none;}
	body,th,td,input,select,textarea,button {font-size:12px; line-height:1.5; letter-spacing:-1px; font-family:'Malgun Gothic', dotum, sans-serif; color:#666;}
	h1,h2,h3,h4,h5,h6{font-weight:normal;}
	a{color:#666; text-decoration:none; box-sizing:border-box; -webkit-transition:all .2s ease-out; -moz-transition:all .2s ease-out; transition:all .2s ease-out;}
	a:active, a:hover {text-decoration:none;}
	address,caption,cite,code,dfn,em,var {font-style:normal; font-weight:normal;}
	table{table-layout:fixed; border-collapse:collapse; border-spacing:0;}
	caption{text-align:left;}
	fieldset{border:0 none;}
	hr{display:none;}
	abbr,acronym{border:0 none;}
	abbr[title], dfn[title] {border-bottom:1px dotted #000000; cursor:help;}
	em,i{font-style:normal;}
	

	/* form */
	input:focus, button:focus, select:focus, textarea:focus{outline:0;}
	input[type="text"], input[type="password"], input[type="tel"], input[type="date"], input[type="email"], select, textarea{display:inline-block; vertical-align:middle; -webkit-appearance:none; -moz-appearance:none; -o-appearance:none; appearance:none; margin:0; padding:0;  border:0 none; box-sizing:border-box; border-radius:0; outline:0; border:1px solid #d2d2d2;}
	input[type="text"], input[type="password"], input[type="tel"], input[type="date"], input[type="email"]{padding:0 10px; height:36px;}
	input[type="radio"]{display:inline-block; width:15px; height:15px; vertical-align:middle; background:#fff;}
	input[type="checkbox"]{display:inline-block; width:15px; height:15px; vertical-align:middle; background:#fff; border:1px solid #d7d7d7;}
	input[type="image"]{vertical-align:middle; border:0 none;}
	button{-webkit-appearance:none; -moz-appearance:none; appearance:none; margin:0; padding:0; box-sizing:border-box; border:0 none; background-color:transparent; cursor:pointer;}
	select{padding:0 46px 1px 10px; height:36px; background:#fff url('/skin/m_modern/images/common/select_arrow.png') no-repeat right center/36px;}
	select::-ms-expand{display:none;}
	textarea{padding:10px; max-width:100%; min-height:70px;}

	input:-ms-input-placeholder{color:#999;}
	input::-webkit-input-placeholder{color:#999;}
	input::-moz-placeholder{color:#999;}
	input::-moz-placeholder{color:#999;}


/* Common 
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
	/* 마크업에만 보이게 */
	.hidden{width:0; height:0; margin:0; padding:0; text-indent:-9999em; overflow:hidden; line-height:0; font-size:0;}
	
	/* 말줄임 */
	.ellipsis{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
	.ellipsis2{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; white-space:initial;}
	.ellipsis3{display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; white-space:initial;}


/* Layout
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */	
	#wrap{margin:0 auto; width:100%; min-width:320px; max-width:100%; height:100%;}


/* Header(임시)
------------------------------------------------------------------------------------------------------------------------------------------------------*/
	#userHeader{height:50px; background:#fff;}
	#userHeader h1{position:relative; left:0; right:0; margin:auto; width:170px; height:100%; overflow:hidden;}
	#userHeader h1 a {display:block; width:100%; height:100%;}
	#userHeader h1 img{position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; max-width:100%; max-height:100%;}


/* Footer(임시)
------------------------------------------------------------------------------------------------------------------------------------------------------*/
	#userFooter{padding:30px 20px; width:100%; background:#333;}
	
	#userFooter .foot-menu{margin-bottom:15px; text-align:center; line-height:0; font-size:0;}
	#userFooter .btn-pc-ver{display:inline-block; padding:0 25px; height:28px; margin:0 auto; line-height:26px; font-size:13px; color:#ddd; border:1px solid #ddd;}
	
	#userFooter .site-info{text-align:center;}
	#userFooter .site-info span{display:block; line-height:1.5; font-size:12px; color:#aaa;}
	#userFooter .site-info span:first-child{margin-left:0; padding-left:0; border-left:0;}
	#userFooter .site-info a{display:inline-block; font-size:13px; color:#6eb0da;}
	#userFooter .site-info .copy{margin-top:10px; color:#aaa;}