@charset "utf-8";
/*
Theme Name: Jangkunblog
Description: Jangkunblog New Skin
Version: 2.0
Author: J.S.M
Author URI: http://www.jangkunblog.com
*/

/* common
------------------------------------------------------------------------------------ */
html {_overflow-y:scroll; _overflow-x:auto; height:100%;}
img {border:0 none;}
form, fieldset {border:0 none;}
select {background-color:#fff;}
address, caption, em {font-weight:normal; font-style:normal;}
acronym, abbr {cursor:help; letter-spacing:0; border-bottom:1px dotted #000; /* fix opera bug */}
.accessibility, .blind, legend {position:absolute; width:0; height:0; font-size:0; overflow:hidden; visibility:hidden;}
hr {display:none;}
.png {_behavior:url(/wp/wp-content/themes/jangkunblog_v02/png/iepngfix.htc);}
h1, h2, h3, h4, h5, h6 {font-family:"Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}


/* anchor */
a,
a:link,
a:visited {color:#000; text-decoration:none;}
a:hover,
a:active,
a:focus {color:#2d75cc; text-decoration:none; background-color:#eee;}

a.link {color:#06c; text-decoration:underline; font-weight:bold;}
a.link:hover,
a.link:focus {color:#0CA445;}

.newData {padding-right: 15px !important; background: url(images/icon_new.gif) no-repeat right center !important;}

#tistorySticker {position:absolute; right:0; top:0; background: url('http://cfs.tistory.com/custom/blog/0/7349/skin/images/download.png') no-repeat; width: 132px; height: 132px; text-indent:-9999em; display: block; z-index: 1000;} 


/* layout
------------------------------------------------------------------------------------ */
body {font-size:13px; line-height:1.7; text-align:center; margin:0; padding:0; font-family:"NanumGothic", "나눔고딕", "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}
#wrap {position:relative; width:960px; margin:0 auto; padding:0 20px; text-align:left;}
	#header {position:relative; padding-top:20px;}
	#container {position:relative; *zoom:1;}
	#container:after {content:" "; display:block; height:0; clear:both;}
		#content {float:left; width:720px; overflow:hidden;}
		#sidebar {float:right; width:200px; overflow:hidden;}
		#footer {clear:both; text-align:center; font-size:12px; margin-top:50px; border-top:5px solid #000; padding-bottom:20px;}


/* header
------------------------------------------------------------------------------------ */
/* gnb */
#header * {margin:0; padding:0;}
#header h1 {margin-bottom:2px; height:77px;}
#header h1 a:hover {background-color:#fff; background:none; border:0 none;}
#header h1 a:focus {background-color:#fff; background:none; border:0 none !important;}
#header .description {position:absolute; top:75px; left:100px; font-size:12px;}
#header .notice {position:absolute; top:155px; left:15px; padding-left:17px; background:url(images/icon_notice.gif) no-repeat left 2px; font-size:11px;}
#header .notice a {text-decoration:underline; font-weight:bold;}

#header .gnb {list-style:none; width:945px; height:31px; padding:13px 0 0 15px; background:url(images/gnb_bg_1.png) no-repeat; overflow:hidden;}
#header .gnb li {float:left; list-style:none; margin:0; padding:0 2px 0 0; background:url(images/gnb_title_all_line.png) no-repeat right top;}
#header .gnb a {float:left; display:block; height:14px; overflow:hidden; background:url(images/gnb_title_all.png) no-repeat; text-indent:-9999em; text-decoration:none; color:#fff; margin:0 25px; _margin:0 27px 0 25px; _display:inline;}
#header .gnb a.archive {width:34px; background-position:0 0;}
#header .gnb a.archive:hover {background-position:0 -14px;}
#header .gnb a.jangkun {width:51px; background-position:-37px 0;}
#header .gnb a.jangkun:hover {background-position:-37px -14px;}
#header .gnb a.career {width:48px; background-position:-91px 0;}
#header .gnb a.career:hover {background-position:-91px -14px;}
#header .gnb a.favorite {width:44px; background-position:-142px 0;}
#header .gnb a.favorite:hover {background-position:-142px -14px;}
#header .gnb a.guestbook {width:34px; background-position:-189px 0;}
#header .gnb a.guestbook:hover {background-position:-189px -14px;}
#header .gnb a.contact {width:44px; background-position:-225px 0;}
#header .gnb a.contact:hover {background-position:-225px -14px;}
#header .gnb li.contact {background:none;}

#header .gnb li.calendar {background:none;}
#header .gnb a.calendar {margin-left:160px; width:135px; background-position:-272px 0;}
#header .gnb a.calendar:hover {background-position:-272px -14px;}

#header .link {list-style:none; width:950px; height:48px; padding:1px 10px 0 0; background:url(images/gnb_bg_2.png) no-repeat; text-align:right;}
#header .link li {display:inline; padding:0 1px;}
#header .link li a:hover {background-color:transparent;}

#header dl * {font-family:"NanumGothic", "나눔고딕", "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}
#header dl {position:absolute; top:105px; right:80px;}
#header dl dd input#s {width:100px; height:19px; padding:1px 0 0 3px; border:1px solid #eee; }


/* content
------------------------------------------------------------------------------------ */
#content .post {padding-top:20px;}

/* main title */
#content .mTitle {position:relative; height:50px; margin:0; padding:0; overflow:hidden;}
#content .mTitle h1 {float:right; width:645px; margin:0; padding:0; font:bold 20px/1.2 "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}
#content .mTitle h1 a {font:bold 20px/1.2 "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}
#content .mTitle h1 a:hover {background-color:#fff;}
#content .mTitle h1 span {font-size:11px; font-weight:normal;}

#content .mTitle .date {float:left; width:60px; height:40px; padding-top:4px; margin-top:3px; background-color:#000; text-align:center; border-right:3px solid #eee; border-bottom:3px solid #eee; color:#999; line-height:1; font:bold 12px tahoma;}
#content .mTitle .date strong {color:#fff; font:bold 18px tahoma;}
#content .mTitle .info {position:absolute; top:16px; *top:27px; left:75px; height:24px; font-size:12px; width:100%;}
#content .mTitle .info .cate {padding-left:20px; background:url(images/icon_category.gif) no-repeat left 0px;}
#content .mTitle .info .tags {margin-left:20px; padding-left:22px; background:url(images/icon_tags.gif) no-repeat left 0px;}
#content .mTitle .info .comments {margin-left:20px; padding-left:22px; background:url(images/icon_comment.gif) no-repeat left 0px;}

/* text - index summary */
#content .entry {padding-bottom:10px; border-bottom:1px solid #eee;}
#content .entry h2 {padding:0 0 3px 40px; background:url(images/jangkun_cha_2.gif) no-repeat left top; border-bottom:2px dashed #eee; margin-top:30px;}
#content .entry h3 {padding-left:10px; background:url(images/bullet_1.gif) no-repeat left 50%;}
#content .entry h4 {font-size:110%;}
#content .entry h5 {font-size:100%;}
#content .entry p {padding:3px 0 3px 10px; text-align:justify; _letter-spacing:-1px;}
#content .entry a {color:#2d75cc; text-decoration:none; background-color:#eee; border-bottom:1px dotted #2d75cc;}
#content .entry a:hover,
#content .entry a:focus {color:#000; text-decoration:none; background-color:#dfedff;}
#content .entry a.no {border:0 none;}

/* post info */
#content .entry .entryInfo {border-top:3px solid #eee; padding-top:0px; margin:50px 0 0 0;}
#content .entry .entryInfo a {color:#000; background-color:#fff; border:0 none;}
#content .entry .entryInfo a:hover {color:#2d75cc; text-decoration:none; background-color:#eee;}

#content .pagetitle {font:bold 22px "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif; color:#999; margin:20px 0 0 0; padding:0;}

/* code */
#content .entry code {background-color:#dfedff; font:13px/1.7 "Consolas","Courier New",Courier,mono;}
#content .entry pre {width:680px; padding:0 20px 20px 20px; overflow:auto; background:url(images/code_bg.gif) repeat;}
#content .entry pre code { background-color:transparent; font-size:12px;}

/* blockquote */
#content .entry div.blockquote {margin:0; padding:0 30px 0 0; min-height:38px; _height:38px; background:url(images/blockquote_right.gif) no-repeat right bottom; color:#666;}
#content .entry blockquote {margin:10px 0 10px 0; padding:5px 0 5px 30px; min-height:28px; _height:28px; background:url(images/blockquote_left.gif) no-repeat left top;}
#content .entry blockquote p {}
#content .entry blockquote dl dt {font-weight:bold; margin-bottom:10px;}

#content .entry blockquote.box1 {margin:0 20px; padding:15px 20px; min-height:auto; _height:auto; background:none; background-color:#eee; border:1px solid #ccc;}
#content .entry blockquote.box1 p {margin:0; padding:0; min-height:auto; _height:auto; background:none; color:inherit;}

#content .entry blockquote.box2 {margin:0 15px 30px 15px; padding:5px 20px 0 20px; min-height:auto; _height:auto; background:none; background-color:#eee; border:1px dashed #ccc; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
#content .entry blockquote.box2 dl dt {font-weight:bold; border-bottom:1px dashed #666; margin-bottom:5px; padding-bottom:5px;}
#content .entry blockquote.box2 dl dd {margin-left:10px;}

/* page - title */
#content .pageWrap h1 {margin:0; padding:0; height:45px; font-weight:bold; font-size:25px; line-height:1.2;}
#content .pageWrap p {padding-left:15px;}

/* search - title */
#content h1.search-title {margin:20px 0 30px 0; padding:0; height:40px; font-weight:bold; font-size:25px; line-height:1.2; border-bottom:2px solid #eee;}
#content .search-lists {margin-left:20px;}
#content .search-lists h2 {margin:0px 0 0 0; padding:0; font-weight:bold; font-size:25px; line-height:1.2;}

/* comments - title */
#content #comments {font:bold 18px/1.2 "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}
#content #comments strong {margin-left:10px;}

/* comments - list */
#content .commentlist {margin:0; padding:0; list-style:none;}
#content .commentlist li {position:relative; margin:0; padding:0; list-style:none;}
#content .commentlist .comment-author {background-color:#eee; height:35px; padding:6px;}
#content .commentlist .comment-author img {vertical-align:middle; border:1px solid #000;}
#content .commentlist .comment-author cite {font-style:normal; font-weight:bold; margin-left:10px;}
#content .commentlist .comment-author cite a {color:#2d75cc;}

#content .commentlist .comment-meta {position:absolute; top:13px; right:75px; font-size:12px;}
#content .commentlist p {margin:10px 10px 30px 50px; text-align:justify;}
#content .commentlist p a {background-color:#eee; color:#000;}
#content .commentlist p a:hover {text-decoration:underline;}
#content .commentlist .children {position:relative; width:100%; margin:0; padding:0;}
#content .commentlist .children .comment-author {background-color:#fff; border:1px solid #eee;}

#content .commentlist .reply {position:absolute; top:13px; right:15px; text-align:right;}

/* comments - write */
#content #respond * {margin:0; padding:0; font-family:"Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif; line-height:1.5;}
#content #respond {position:relative; margin:30px 0; padding:10px 20px; border:5px solid #eee;}
#content #respond h3 {font-size:18px; padding-bottom:15px;}
#content #respond .comment-wrap a {color:#2d75cc; font-size:10px;}
#content #respond .cancel-comment-reply {position:absolute; top:16px; left:100px;}
#content #respond .cancel-comment-reply a {font-size:12px; color:#494949; background-color:#eee;}

#content #respond .comment-wrap {position:relative;}
#content #respond .comment-wrap dl {height:150px;}
#content #respond .comment-wrap dl dt {float:left; width:60px; font-size:12px; font-weight:normal; padding-top:3px;}
#content #respond .comment-wrap dl dd {margin-bottom:13px;}
#content #respond .comment-wrap dl dd input {width:200px; height:21px; padding:4px 0 0 3px; border:1px solid #000;  font-size:12px;}
#content #respond .comment-wrap .comment-textarea {position:absolute; top:0px; right:0px;}
#content #respond .comment-wrap .comment-textarea input {width:395px; margin-top:5px;}
#content #respond .comment-wrap .comment-textarea textarea {width:390px; height:105px; padding:3px 0 0 3px; border:1px solid #000; font-size:13px;}
#content #respond .comment-wrap p.hint {font-size:15px; font-weight:normal;}

#content #respond .comment-admin-login {height:160px;}


.navigation {overflow:hidden; _height:1%;}
.navigation a {font-weight:bold;}
.navigation .alignleft {float:left;}
.navigation .alignright {float:right;}

/* add */
#content .entry h4 abbr {font-size:18px !important; border:0 none;}
#content .entry h2 code {background-color:#fff; font:bold 20px "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}
#content .entry h2 ins {font-size:12px;}

#content .post .homeEntry p {margin-top:8px;}
/*#content .post .homeEntry {position:relative; padding:0; margin:0;}
#content .post .homeEntry p {margin-top:8px; padding-left:170px;}
#content .post .homeEntry .pointImg {position:absolute; top:5px; left:0; border:1px solid #eee; width:150px; height:130px; padding:0;}*/

.pageLinkPost a {font-size:.7em; font-family:arial, sans-serif;}


/* footer
------------------------------------------------------------------------------------ */
#footer ul {}
#footer ul li {margin:0; padding:0 5px; list-style:none; display:inline;}

.mb {position:absolute; top:7px; right:20px;}
.mb strong {font-weight:bold; letter-spacing:-1px; color:#f40;}
.mb a {border-bottom:1px dotted #000;}

.rss {position:absolute; top:70px; right:20px; margin:0; padding:0;}
.rss li {margin:0; padding:0; display:inline;}


/* sidebar
------------------------------------------------------------------------------------ */
#sidebar * {margin:0; padding:0; list-style:none;}
#sidebar h2 {font:bold 15px "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif !important; margin:20px 0 2px 0; text-transform:uppercase; padding-left:19px; background:url(images/icon_arrow_2.gif) no-repeat left 5px;}
/*#sidebar ul li ul li {white-space:nowrap; margin-left:5px; padding-left:8px; background:url(images/icon_arrow_1.gif) no-repeat left 9px;}*/
#sidebar ul li ul li {height:22px; overflow:hidden; margin-left:5px; padding-left:8px; background:url(images/icon_arrow_1.gif) no-repeat left 9px;}
#sidebar #best h2 strong {color:#2d75cc;}
#sidebar #flickr a:hover {border:0 none; background:none;}

#sidebar .banner {padding:20px 0; text-align: center;}
#sidebar .banner ul li {padding:5px 0;}
#sidebar .etc {padding:20px 0; text-align: center;}

/* pagebar
------------------------------------------------------------------------------------ */
/*
	Plugin URL: http://www.mis-algoritmos.com
	Autor: Victor De la Rocha
	Version: 0.2
*/
/*Digg*/
	div.pagination {
		padding: 3px;
		margin:30px 3px 3px 3px;
		text-align:center;
	}
	
	div.pagination a {
		padding: 2px 5px 2px 5px;
		margin: 2px;
		border: 1px solid #eee;
		
		text-decoration: none; /* no underline */
		color: #000;
	}
	div.pagination a:hover, div.pagination a:active {
		border: 1px solid #2d75cc;
		background-color:#2d75cc;
		color: #fff;
	}
	div.pagination span.current {
		padding: 2px 5px 2px 5px;
		margin: 2px;
		border: 1px solid #2d75cc;
		
		font-weight: bold;
		background-color:#2d75cc;
		color: #FFF;
	}
	div.pagination span.disabled {
		padding: 2px 5px 2px 5px;
		margin: 2px;
		border: 1px solid #EEE;
	
		color: #DDD;
	}

/* favoriteContents
------------------------------------------------------------------------------------ */
.favoriteContents {float:right; font-size:12px !important; border:1px dashed #ccc; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; padding-right:20px;}
.favoriteContents a {color:#000 !important; background-color:#fff !important; border:0 none !important; font:12px "Malgun Gothic", "맑은 고딕", "AppleGothic", "Lucida Grande", gulim, "굴림", dotum, "돋움", verdana, serif;}
.favoriteContents a:hover,
.favoriteContents a:focus {background-color:#eee !important; border-bottom:1px dotted #000 !important;}


/* related posts
------------------------------------------------------------------------------------ */
#content h3.related_post {margin-bottom:5px; padding-left:20px; background:url(images/icon_star.gif) no-repeat left 6px;}
#content h3.related_post {*background:url(images/icon_star.gif) no-repeat left 9px;}
#content ul.related_post {margin:0; padding:0 0 20px 20px; margin-bottom:60px; border-bottom:3px solid #eee; list-style:none;}
#content ul.related_post li {}

/* All posts
------------------------------------------------------------------------------------ */
span.srg_switcher a {background-color:#fff !important;}
span.monthtitle a strong {font-size:1.5em !important; background-color:#fff !important;  color:#000 !important; font-weight:bold !important;}
ul.postspermonth li a {background-color:#fff !important;}
span.monthtitle a.detailed {display:none !important;}

/* Contacts
------------------------------------------------------------------------------------ */
/*#wpcf fieldset {width:100% !important; border:0 none !important;}
#wpcf fieldset legend {display:none;}
#wpcf fieldset p {position:relative; border-bottom:1px solid #eee; height:30px;}
#wpcf fieldset p.text {height:110px;}
#wpcf fieldset p label {position:absolute; top:2px; left:0; width:100px;}
#wpcf fieldset p input {position:absolute; top:3px; left:130px; border:1px solid #eee; height:20px; padding:3px 0 0 3px;}
#wpcf fieldset p span {position:absolute; top:3px; left:130px;}
#wpcf fieldset p textarea {position:absolute; top:3px; left:130px; border:1px solid #eee; width:500px; height:90px; padding:3px 0 0 3px;} 
#wpcf fieldset p.button {border-bottom:0 none;} 
#wpcf fieldset p.button input {display:block; width:80px; height:30px;} */

#content .wpContact div {margin:0 15px; padding:5px 20px 0 20px; border:1px dashed #ccc; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
#content .wpContact p {vertical-align:top;}
#content .wpContact p label {display:inline-block; width:80px;}
#content .wpContact p input.inputText {border:1px solid #dcdcdc; width:500px; height:20px; padding:3px 0 0 3px; font-size:12px;}
#content .wpContact p textarea {border:1px solid #dcdcdc; width:500px; height:150px; padding:3px 0 0 3px; font-size:12px;} 
#content .wpContact p.btn {text-align:center; padding:5px 20px;}


/* KWCAG 2.0
------------------------------------------------------------------------------------ */
.kwcag2 {}
.kwcag2 blockquote h3 {background:none !important;}
.kwcag2 h3.exGood {border-top:5px solid #184ca2 !important; border-bottom:2px solid #eee !important; padding:7px 7px 7px 15px;  background:url(images/icon_good_2.gif) no-repeat right 2px !important;; color:#184ca2; margin:30px 0 0 10px;}
.kwcag2 h3.exBad {border-top:5px solid #f64000 !important; border-bottom:2px solid #eee !important; padding:7px 7px 7px 15px;  background:url(images/icon_bad_2.gif) no-repeat right 2px !important;; color:#f64000; margin:30px 0 0 10px;}
.kwcag2 h4 {padding-left:13px;}

/* sociable
------------------------------------------------------------------------------------ */
.sociable {text-align: center; margin:50px 15px 30px 15px; padding:5px 20px 0 20px; border:1px dashed #ccc; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px;}
.sociable .sociable_tagline {display: none;}
.sociable .sociable_tagline strong {font-size:2em; font-family:"Lucida Grande", "AppleGothic", verdana, serif;}
.sociable ul {list-style:none; padding:0;}
.sociable ul li {list-style:none; display:inline; margin:0 10px;}
.sociable ul li a {background-color:#fff !important; border-bottom:0 none !important;}



/* print
------------------------------------------------------------------------------------ */
/*@media print {
	.accessibility,
	.mb,
	.rss,
	#tistorySticker,
	#sidebar,
	.link,
	.notice,
	#content .mTitle .info,
	#respond {display:none !important;}
	#wrap,
	#content {width:100%; font-size:12pt;}
	#content .mTitle h1 {float:none; font-size:20pt; margin-bottom:10px;}
	#content .mTitle .date {float:none; width:auto; height:auto; padding:0 0 10px 0; margin:0; background-color:#fff; color:#000; text-align:left; border:0 none; border-bottom:3px solid #000; font-size:12pt; font-weight:normal;}
	#content .mTitle .date strong {font-size:12pt; color:#000; font-weight:normal;}

	
}*/

/* iPad
------------------------------------------------------------------------------------ */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	body {font-size: 18px;}
	a#tistorySticker, #header p.notice, #header .link, #content .post .homeEntry p, #content .mTitle .date, #content .mTitle .info, #sidebar li, #sidebar .etc, .tweetmeme_button 
	
	{display: none;}
	#header {padding-top: 10px;}
	#header h1 {text-align: center;}
	#header .description {position: static; text-align: center; padding-bottom: 10px;}
	#content .post {padding: :0 !important;}
	#content .mTitle {height: 30px;}
	#content .mTitle h1 {float: none; width: 100%; text-align: center; padding-bottom: 10px; height: 60px;}
	#content .mTitle h1 a {font-size:18px;}
	#content {float: none; width: 90%; margin:0 auto; padding:2em;}


}