@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/css?family=Open+Sans:800);

::-webkit-scrollbar {
	width: 7px;
}

::-webkit-scrollbar-track {
	background-color: #ddd;
	border-left: 3px solid #fff;
	border-right: 3px solid #fff;
}

::-webkit-scrollbar-thumb {
	background-color: #ddd;
}


body, html{
	padding: 0px;
	margin: 0px;
	height: 100%;
	font-size: 75%;
}

*{
	font-family: Arial, 'Nanum Gothic', 'MalgunGothic', 돋움;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

a{
	text-decoration: none;
	border: 0;
}

a>img{
	border: 0;
}

blockquote{
	border-left: 5px solid #777;
	padding-left: 10px;
}

.moreless_fold, .moreless_top, .moreless_bottom {
	border-left: 5px solid #777;
	padding-left: 5px;
}

.moreless_content {
	margin: 20px auto 20px auto;
}

#container{
	padding: 0px;
	margin: 0px;
	overflow:hidden;
	min-height: 100%;
	position: relative;
}

/***************************  start  ***************************/

#header{
	width: 100%;
	text-align:center;
	border-bottom: 1px solid #ccc;
}

div#header h1, div#header .menu, div#header .menu a{
	display: inline-block;
}

div#header{
	height:50px;
}

div#header h1{
	background-image: -webkit-linear-gradient(transparent, transparent), 
	url(images/light.gif);
	/*font: bold 2vmax/.8 Open Sans;*/
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	margin: 8px auto;
}
div#header h1 a{
	color: #000;
	font-size: 25px;
	font-family: Open Sans, Impact!important;
}

div#header .menu{
	position: absolute;
	top: 20px;
	left: 72px;
}

div#header .menu a{
	font-family: Open Sans, Impact!important;
	font-size: 12px;
	color: #777;
	height: 30px;
	margin: 0px 2px 0px 2px;
	padding: 0px 10px 0px 10px;
	transition: all 0.3s ease;
}

div#header .menu a:hover{
	padding-bottom: 6px;
	border-bottom: 4px solid #777;
}

#admin_menu{
	position: absolute;
	top: 15px;
	right: 80px;
}


.a-icon{
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-right: 5px;
}

.dva{
	background: url(images/github.png) top left no-repeat;
	background-size: 24px;
}

.tum{
	background: url(images/rss.png) top left no-repeat;
	background-size: 24px;
}

.twt{
	background: url(images/twitter.png) top left no-repeat;
	background-size: 24px;
}

.search{
	position: absolute;
	top: 18px;
	right: 200px;
}

.search-in{
	border: 0px;
	border-bottom: 1px solid #ccc;
	width: 120px;
	height: 20px;
}
/***************************  header end  ***************************/

#leftbar, #sidebar{
	position:absolute;
}

#leftbar{
	width: 70px;
	min-height: 100%;
	background-color: #000;
}

div[id^='__']{
	border-bottom: 1px solid #575B66;
	padding: 60px 10px 20px 10px;
	text-align: center;
	color: #575B66;
	font-size: 11px;
	cursor: pointer;
}
#__write{
	  background:url(images/write.png) center 20px no-repeat;
}
#__admin{
	  background:url(images/setting.png) center 20px no-repeat;
}
#__docs{
	  background:url(images/docs.png) center 20px no-repeat;
}
#__contact{
	  background:url(images/contact.png) center 20px no-repeat;
}


#sidebar{
	left: 70px;
	width: 256px;
	border-right: 1px solid #ccc;
	padding: 40px 43px 30px 43px;
	text-align: center;
	min-height: 100%;
}
#sidebar *{
	color: #777;
	font-size:11px;
	text-align: left;
	font-family: Calibri, 'Nanum Gothic', 'MalgunGothic', 돋움!important;
}

#blog_img{
	width: 170px;
	height: auto; /*70px*/
}

#blog_sub{
	padding:0px 10px 0px 10px;
	margin-top: 10px;
	text-align:justify;
	text-transform: uppercase;
	font-family: Calibri, 'Nanum Gothic', 'MalgunGothic', 돋움;
	font-size: 11px;
	border-left: 2px solid #ccc;
}

#writer{
	color: #ccc;
	width: 100%;
	display: inline-block;
	text-align:right;
}

#writer:hover{
	color: #777;
}

.side-menu{
	margin-top: 20px;
}

.side-menu h3{
	padding-bottom: 3px;
	border-bottom: 2px solid #777;
}

#category ul{
	list-style: none;
	padding-left: 0;
}

#category li{
	display: inline-block;
	width:80px;
	padding: 3px;
	font-size:10px;
	text-align: center;
	margin-bottom: 5px;
	border: 1px solid #ccc;
	text-transform: uppercase;
}

.f-m{
	margin-right: 8px;
}
#hidden-category{
	display: none;
}

#link ul{
	list-style: none;
	padding-left:0;
}
#link li{
	width: 80px;
	color: #fff;
	padding: 2px;
	text-align: center;
	font-size:10px!important;
	transition: all 0.5s ease;
}

#link a{
	color: #fff;
	display: inline-block;
	background-color: #777;
	margin-bottom: 5px;
	transition: all 0.5s ease;
}

#link a:nth-child(odd){
	margin-right: 5px;
}

#link a:hover, #link a:hover li{
	color: #777;
	background-color: transparent;
}

#union{
	margin-top: 15px;
}

.paging{
	cursor: pointer;
	text-align: right!important;
}

.paging a:hover{
	color: #D5C1A4!important;
}

/***************************  bar end  ***************************/

.taglog{
	word-break: break-all;
	text-align: justify;
}

.taglog ul{
	list-style: none;
	padding-left: 0;
}

.taglog li{
	float: left;
	margin-left: 10px;
	text-transform: uppercase;
}

.cloud1, .cloud2, .cloud3, .cloud4, .cloud5{
	padding: 3px;
	font-size: 10px;
	transition: all 0.3s ease;	
	font-family: Calibri, 'Nanum Gothic', 'MalgunGothic', 돋움!important;
}

.cloud1 {
	background: #ff6666;
	color: #fff;
}

.cloud1:hover {
	background: #fff;
	color: #ff6666;
}

.cloud2 {
	background: #99cccc;
	color: #fff;
}

.cloud2:hover {
	background: #fff;
	color: #99cccc;
}

.cloud3 {
	background: #ff9966;
	color: #fff;
}

.cloud3:hover {
	background: #fff;
	color: #ff9966;
}

.cloud4 {
	background: #cc99ff;
	color: #fff;
}

.cloud4:hover {
	background: #fff;
	color: #cc99ff;
}

.cloud5 {
	background: #ffcc99;
	color: #fff;
}

.cloud5:hover {
	background: #fff;
	color: #ffcc99;
}
/***************************  tag cloud end  ***************************/


#content{
	width: 630px;
	min-height: 100%;
	margin-top: 20px;
	margin-left: 355px;
	position: relative;
	padding: 30px;
}

.entry{
	margin-bottom: 150px;
}

.titleWrap, .titleWrap a{
	font-size: 11px;
	color: #777;
}

.titleWrap{
	line-height: 160%;
	margin-bottom: 30px;
}

.entryNotice .titleWrap{
}

.entryNotice .titleWrap *{
	font-size: 10px;
}

.titleS{
	font-weight: bold;
	font-family: tahoma, 돋움;
	letter-spacing: 1px;
}

.tagTrail a::before {
	content: "#"
}

.titleDate{
}

.sarticle{
	text-align: center;
	line-height: 160%;
	margin-bottom: 150px;
	padding-bottom: 50px;
	word-break: break-all;
	border-bottom: 1px solid #777;
}

.stitle{
	text-align: center;
}

.sip{
	color: pink;
	border: 0px;
	width: 150px;
	height: 25px;
	margin-bottom: 10px;
	border-bottom: 1px solid #ccc;
	text-align: center;
}

.sbt{
	color: #777;
	border: 0px;
	background: #fff;
	width: 120px;
	height: 20px;
}

.article{
	word-break: break-all;
	padding: 0px 10px 10px 10px;	
}

.entryNotice .txc-info, .article .txc-info {
	width: 100% !important;
}
.entryNotice *, .article *{
	color: #777;
	max-width: 100%;
	font-size: 12px;
	line-height: 180%;
}
.entryNotice img, .article img{
	height: auto;
}

.entryNotice{
	word-break: break-all;
	border: 1px solid #ccc;
	margin-bottom: 20px;
	padding: 35px;
}


.entryNotice:hover{
	color: #C5AA8C;
	border: 1px solid #D5C1A4;
}

.entryNotice:hover .titleWrap a{
	background-color: #D5C1A4;
}

.entryNotice:hover .titleWrap .date{
	color: #D5C1A4;
}

.entryNotice .titleWrap a{
	background-color: #777;
	padding: 3px;
	color: #fff;
}

.entryNotice .titleWrap .date{
	color: #777;
}

/***************************  content end  ***************************/

.actionTrail{
	*zoom:1;
	width: 100%;
	border-bottom: 0px solid #777;
}

.actionTrail div{
	width: 120px;
	text-align: right;
	padding: 0px 5px 10px 0px;
}


.actionTrail a:hover{
	color: #D5C1A4;
	border-bottom: 1px solid tan;
}

.actionTrail a:first-child{
	margin-left: 30px;
}

.actionTrail span{
	font-size: 10px;
	font-family: Open Sans, Impact;
	text-transform: uppercase;
}

.actionTrail::after{
	content: ""; 
	display: block; 
	clear: both;
}

.actionTrail a{
	color: #777;
	float: right;
	display: inline-block;
	border-bottom: 1px solid #777;
}

.guestWrite{
	margin-bottom: 50px;
}

.guestList,.commentList{
	padding-top: 30px;
	padding-bottom: 30px;
}

textarea{
	padding: 10px;
}

input{
	font-size: 11px;
}
textarea, .guestList, .guestList a, .commentList, .commentList a{
	line-height: 180%;
	font-size: 11px;
	color: #777;
}

.guestList .control>a{
	display: inline-block;
	color: #000;
	font-size: 10px;
	margin-left: 5px;
}

.guestList ol, .guestList ul, .commentList ol, .commentList ul{
	list-style: none;
	padding-left: 0;
}

.name{
	font-weight: bold;
}

.lrpd, .lrpd-r{
	word-break: break-all;	
}

.guestList ul>li, .commentList ul>li{
	margin-left: 30px;
}

.guestList ol>li, .commentList ol>li{
	margin-bottom: 20px;
}

.guestList ol>li, .guestList ul>li{
	padding-bottom: 5px;
}

ol>li{
	border-bottom: 1px solid #ccc;
}
.commentList ul>li{
	border-left: 3px solid #D5C1A4;
	padding-left: 15px;
	margin-bottom: 10px;
}

.guestList ul>li{
	color: #777;
	background-color: #eee;
	padding: 15px 15px 3px 15px;
	margin-bottom: 10px;
}

ul>li .lrpd-r .date{
	width: inherit;
	text-align: right;
	display: block;
	color: #eee;
}

ul>li .lrpd-r:hover .date{
	color: #777;
}
.commentWrite{
	padding-top: 0px;
}

.rph, .rpn, .rpp{
	color: #777;
	border: 0px;
	height: 20px;
	border-bottom: 1px solid #ccc;
}

.rpn{
	width:100px;
	margin-right: 20px;
}

.tistoryProfileLayerTrigger{
	position: relative;
	top: 3px;
}

.rpp{
	width:100px;
	margin-right: 20px;
}

.rph{
	width:220px;
}

.rpbox{
	width: 100%;
	height: 120px;
	margin: auto;
	overflow-y: auto;
	background-color: #eee;
	border: 1px solid #ccc;
	border-left-width: 0px;
	border-right-width: 0px;
}

.rpsc{
	float: right;
	position: relative;
	top: 3px;
}

.rpbt{
	font-size: 11px;
	width: 80px;
	border: 0px;
	padding: 5px;
	float: right;
	color: #ffffff;
	background-color: #777;
}

/***************************  content plus end  ***************************/
.searchList{
	margin-bottom: 50px;
	font-family: Calibri, 'Nanum Gothic', 'MalgunGothic', 돋움!important;
}



.searchList h3{
	color: #777;
	margin-bottom: 30px;
}

.drake{
	margin-bottom: 10px;	
}

.drake a{
	transition: all 0.5s ease;
}

.drake, .drake a{
	color: #777;
	font-size: 11px;
}

.drake:hover a{
	color: #D5C1A4;
	letter-spacing: 2px;
}

.drake .date{
	color: #fff;
	background-color: #777;
	padding: 3px 5px 3px 5px;
	margin-right: 8px;
	width: 60px;
	font-size: 10px;
	display: inline-block;
	text-align: center;
	transition: all 0.5s ease;
}

.drake .date:hover{
	color: #777;
	background-color: #fff;
}

/***************************  list end  ***************************/

.grayson{
	width: 142px;
	text-align: center;
	display: inline-block;
	min-height: 84px;
	transition: all 0.3s ease;
}

.grayson a{
	color: #777;
	display: block;
	width: 135px;
	line-height: 76px;
	height: 76px;
}

.todd{
	width: 135px;
	height: auto;
	transition: all 0.3s ease;
}

.searchList .grayson:hover {
	opacity: 1;
	transform: rotate3d(0, 1, 0, -360deg);
	transition: all 0.4s;
}

.searchList .grayson:hover a {
	background: rgba(0, 0, 0, 0.9);
	transition: all 0.4s;
	transition-delay: 0.3s;
}

.searchList .grayson:hover .todd {
	transform: rotate3d(0, 1, 0, -180deg);
	opacity: 0.5;
	transition: all 0.4s;
}

/***************************  gallery end  ***************************/

#gotop{
	position: fixed;
	bottom: 30px;
	right: 30px;
	cursor: pointer;
}

#copyright{
	position: fixed;
	left: 90px;
	bottom: 15px;
}

#tistorytoolbarid {
	display: none;
}