@charset "utf-8";

/* 반드시 들어가야 하는 스타일 시작 */
/* 본문 공통 */

body { font-family: Calibri, Malgun Gothic, Dotum, AppleGothic,sans-serif; font-size: 11px; line-height: 1.5; color: #666; background: none; background-attachment: fixed; background-position: center center; background-size: cover; background-repeat: no-repeat; padding:0; margin:0; }

a:link { transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; color:#AAA; text-decoration:none; }
a:visited { color:#AAA; text-decoration:none; }
a:hover { color:#FEAD9E; text-decoration:none; }
a:active { color:#FEAD9E; text-decoration:none; }

/* 스크롤 */

::-webkit-scrollbar { width: 7px; } 
::-webkit-scrollbar-track-piece { background-color: #FFF; }
::-webkit-scrollbar-thumb:vertical { width: 100px; border-radius: 10px; -moz-border-radius: 100px; -webkit-border-radius: 0px; -o-border-radius: 100px; background-color: #FEAD9E; } 

/* 그림 */

img { border: 0; }
.imageblock { display: block; position: relative; max-width: 100%; overflow: hidden; margin: 2px; }
.imageblock img { max-width: 100%; height: auto !important; }
.imageblock span, .imageblock span img { max-width:100% !important; }

/* 반드시 들어가야하는 스타일 끝 - 이 아래는 자유롭게 추가, 삭제 가능 */

#container { max-width: 1000px; margin: 0 auto; }

/* 사이드바 */

#sidebar { background: rgba(255, 255, 255, 1); position: fixed; max-width: 200px; display: block; margin-top: 100px; padding: 10px; }
#blogImage { margin-bottom: 5px; }
#blogImage img { max-width: 100%; }
.blogMenu ul { list-style: none; margin: 10px 0px; padding: 0; }
.blogMenu .blog_title a { color: #FEAD9E; }
.blogMenu li { margin: 2px 0; color: #AAA; }
.blogMenu li a { display: block; padding: 5px 15px; letter-spacing: 1px; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; }
.blogMenu li a:hover, .blogMenu li a:active { letter-spacing: 5px; background: #FEAD9E; color: #FFF; }
#cate { cursor: pointer; }
#category { margin: 5px auto; display: none; }
#category a { width: 74px; margin: 3px; padding: 5px; font-size: 10px; text-align: center; background: #FEAD9E; color: #FFF; }
#category a:hover { color: #AAA; background: #FFF; }
#category ul { list-style: none; display: inline-block; margin: 0; padding: 0; }
#category ul li, #category ul li ul li ul { display: inline; }
#category ul li ul li a { display: inline-block; }
#category ul li a, .c_cnt { display: none; }
#searchBox { margin: 10px auto; max-width: 180px; border-bottom: 1px solid #DDD; }
#searchBox input.search_keyword { width: 120px; border: none; color: #7D7D7D; height: 18px; padding: 0 5px; font: 10px Calibri, Malgun Gothic; }
#searchBox input.button { background: #FFF; padding: .3em; width: 45px; height: 20px; color:#DDD; cursor: pointer; vertical-align: middle; border: none; }
#searchBox input.button:active { color: #FEAD9E; border: none; }

/* content */

#content { float: right; width: 800px; margin: 100px 0; display: inline; }
#content .nonEntry { max-width: 1000px; margin: 0 auto; }
#content .entry { background: rgba(255, 255, 255, 1); max-width: 1000px; margin: 10px auto; padding: 40px 30px; overflow: hidden; }

/* 검색 목록 */

.hbar {	text-align: right; padding-bottom: 5px; }
.hx { color: #AAA; margin-right: 10px }
#searchList { background: rgba(255, 255, 255, 1); padding: 30px; margin-bottom: 10px; }
#searchList ol, #searchRplist ol { text-align:left; list-style: none; margin: 0; padding: 0; } 
#searchList ol li, #searchRplist li { padding: 10px 5px 10px 15px; margin: 5px 0; border: 1px dashed #EEE; } 
#searchList ol li a, #searchRplist li a { padding-right: 10px; } 
#searchList .date, #searchRplist .date  { float: right; margin: 0 10px; } 
#searchRplist .name { color: #AAA; padding-left: 8px; }
.flexible_img_col { margin: 0 -30px; max-width: 700px; }
.flexible_img_col ul { margin: 0; padding: 0; float: center; list-style:none; *zoom:1 }
.flexible_img_col ul:after { display: block; clear: both; content: ""}
.flexible_img_col li { width: 160px; margin: 15px; padding: 0 !important; }
.flexible_img_col .thumb { display: block; overflow: hidden; position: relative; mix-blend-mode: screen; color: #333; width: 160px; height: auto; opacity: 0.4; line-height: 172px; text-align: center; white-space: nowrap; }
.flexible_img_col .thumb span { width: auto; }
.flexible_img_col .thumb img { width: 100%; height: auto; border: 0 }
.flexible_img_col .thumb img.dno { display: none }
.flexible_img_col a { display: block; width: auto !important; margin: 0 auto !important; padding: 0; text-decoration: none; cursor: pointer }
.flexible_img_col .list_date { display: block; text-align: center; margin: 5px 0; background: #EEE; color: #BBB !important; }
.flexible_img_col strong { display: inline-block; width: 145px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: normal; }
.flexible_img_col strong img { display: block; margin-top: -15px; padding: 0 !important; }
.flexible_img_col a:hover .thumb,.flexible_img_col a:hover p { opacity: 1.0; }
.cnt { color:#EC6941; }

/* 공지 */

#entryNotice { padding: 30px; margin-bottom: 10px; background: rgba(255, 255, 255, 1); } 
.notice_date { font: 11px Calibri, Malgun Gothic; color: #AAA; border-left: 3px solid #FEAD9E; padding: 0 10px; text-transform: uppercase; } 
#entryNotice .notice_article { margin-top: 20px; }

/* 보호글 */

#entryProtected { padding: 40px 30px; background: rgba(255, 255, 255, 1); border: none; margin: 0 0 30px 0; text-align: center; }
#entryProtected .protected_date { color: #AAA; }
#entryProtected .protect_text { color: #AAA; margin: 50px 0; }
#entryProtected label { color: #AAA; font-size: 11px; font-weight: normal; vertical-align: middle; }
#entryProtected input.input { width: 100px; height: 15px; margin-left: 0px; border: 1px solid #C9C9C9; vertical-align: middle; font-size: 10px; }
#entryProtected input.submit { background-color: #C9C9C9; width: 60px; height: 20px; color: #FFF; text-align: center; cursor: pointer; vertical-align: middle; border: 0; }

/* 본문 */

.article { padding: 0px; margin-bottom: 20px; }
.article blockquote { border-left: 3px solid #AAA; clear: both; color: #7d7d7d;	display: block;	margin: 15px 16px; padding-left: 10px; }
.admin { color: #AAA; margin: 5px 5px 0 0; text-align: right; letter-spacing: -1px; }
.posted { margin: 0px; padding: 5px 7px; border: 1px dashed #DDD; }
.posted_date { margin: 0; color: #AAA; }
iframe, embed, .txc-info { max-width: 100%; }
.tagTrail { padding: 5px 5px 0px 5px; clear:both; }
.tagTrail a:hover  { text-decoration: line-through; }
span.tagText { background: #EEE; color: #AAA; padding: 0 2px; margin-right: 5px; }
.actionTrail { display: inline; float: right; }
.actionTrail a { color:#FEAD9E; padding: 2px; } 
.actionTrail a:hover .cnt { color:#FEAD9E; }
.actionTrail .cnt { color: #AAA; }

/* 댓글 & 방명록 */

.guesttitle { color: #AAA; margin-bottom: 20px; }
legend { font: bold 1.0em 'Franklin Gothic Medium', Helvetica, Sans-Serif; color: #696969;}
label { padding-right:.2em; font: 0.85em Verdana, Helvetica, Sans-Serif; vertical-align: middle; color: #AAA; letter-spacing: -1px; }
input { width: 14%; border: 0px; border-left: 1px solid #C9C9C9; vertical-align: middle; padding: 2px; font: 0.85em Verdana, Malgun Gothic, Dotum; color: #999; }
.homepage { width: 37% !important; font: 0.85em Verdana, Malgun Gothic, Dotum; padding: 2px; color: #999; }
textarea { width: 99%; height: 70px; border: 1px solid #C9C9C9; font: 1.0em Calibri, Malgun Gothic, AppleGothic, Sans-Serif; color:#666; overflow: hieedn; margin: 5px 0; }
p.secretWrap { position: relative; margin-bottom: 5px; float: left;}
p.secretWrap input { float: left; border: 0; vertical-align: middle; margin-bottom: 5px; padding: 2px 0 0 8px; margin: 0; width: 12px; }
p.secretWrap label { float: left; width: 50px; font: 0.85em verdana; padding-top: 2px; vertical-align: middle; }
.submit { text-align: right; }
.submit input { background-color: #FFF; padding: .3em; width: 50%; height: 30px; font-size: 1.0em; color:#AAA; cursor: pointer; border: 1px solid #C9C9C9; }
.submit input:active { background-color: #FEAD9E; color: #FFF; border: 1px solid #FEAD9E; }
.date { font: 10px Calibri, Malgun Gothic; margin: 0 15px; padding: 2px; color:#BBB; }
#guestbook { max-width: 700px; margin: 0 auto; }
#commentWrite p, #guestWrite p { clear: both; padding: 0; margin-top: 5px; }
#commentWrite { margin: 30px 0 0 0; border: 0; }
#guestWrite { background: rgba(255, 255, 255, 1); padding: 30px; float: center; }
#guestList { padding: 30px; margin: 0; background: rgba(255, 255, 255, 1); }
#commentList { width: 100%; }
.comment ol, #guestList ol, #guestList ul { padding:0; margin-top: 20px; list-style: none; }
.comment ol li, #guestList ol li { float: center; padding: 10px 0 0 0;  }
.comment ul, #guestList li ul li { padding: 10px; margin: 0px 0 0px 50px; list-style: none; }
.rp_secret, .guest_secret { color: #FEAD9E; }

/* 페이지 */

#paging { background: #FFF; padding: 15px 30px; max-width: 1000px; margin: 20px auto; text-align: center; }
#paging .selected { font-weight: bold; color:#FEAD9E }
#paging #prevPage, #paging #nextPage, #paging .num { padding: 0 4px;}
.no-more-prev, .no-more-next { display: none; }

/* top & copyright */

.top { position: fixed; bottom: 60px; right: 45px;  }
.top a { padding: 10px; background: #EEE; color: #AAA; border-radius: 60px; }
.top a:hover { background: #FEAD9E; color: #FFF; }
.copyright { bottom: 30px; right: 35px; position: fixed; display: block; font-size: 10px; }

@media all and (max-width : 1000px) {
#container { margin: 0 auto; padding: 0 10px; }
#header { height: 40px; }
#content { margin: 0 auto; float: none; }
#sidebar { position: relative; max-width: 1000px; margin: 10px auto; padding: 10px 30px; text-align: center; }
.blogMenu { text-align: center; }
.blogMenu li { display: inline-block; } 
#footer { height: 100px; }
#blogImage img { width: 140px; margin: 0 auto; }}
@media all and (max-width : 656px) {
.flexible_img_col { margin: 0 auto; max-width: 380px; }}
@media all and (max-width : 466px) {
.blogMenu li a, .blogMenu li a:hover, .blogMenu li a:active { letter-spacing: 1px; padding: 5px 7px; }
.flexible_img_col { margin: 0 auto; max-width: 280px; }
.flexible_img_col li { width: 250px; }
.flexible_img_col .thumb { width: 250px; }
.flexible_img_col strong { display: inline-block; width: 235px; }}
@media all and (min-width : 1000px) {
#header, #footer { display: none; }}
#tistorytoolbarid { display: none; }