@import url(http://fonts.googleapis.com/earlyaccess/jejugothic.css);

/***************
    Ini
****************/

* { 
    margin:0px; 
    padding:0px;
    font-family: 'Jeju Gothic', serif; 
}
li { 
    list-style:none; 
}
body { 
    background-color:white; 
}
a { 
    text-decoration:none; 
}

/***************
    Tistory Bool Bar
****************/

#tistorytoolbarid { 
    display : none; 
}

/***************
    For Mobile
****************/

@media screen and (max-width:1280px) {

/***************
    Title Logo
****************/

#logo {
    width:100%;
}
#logo > .logo-image { 
    text-align:center;
    margin:0 auto;
    margin:25px 0;
}

/***************
     Content, Sidebar
****************/

#container { 
    font-family: 'Jeju Gothic', serif; 
    overflow:hidden; 
    width:100%;
    margin:0 auto;
}

/***************
    Content
****************/

#content {
    margin:0 auto;
    width:100%;
    float:left;
}
#content #protected,
#content #notice,
#content #guest,
#content #posts,
#content #main-article {
    width:100%;
    background-color:white;
    border:1px solid #f1f1f1;
}

/***************
    Sidebar
****************/

#aside { 
    display:none; 
}

/***************
    Comment List
****************/

.commentList .image { 
    display:none; 
}

}
@media screen and (min-width:1280px) {

/***************
    Title Logo
****************/

#logo {
    width:100%;
}

#logo > .logo-image { 
    width:100%;
    text-align:center;
    margin:0 auto;
    margin:25px 0;
}

/***************
    Content, Sidebar
****************/

#container { 
    font-family: 'Jeju Gothic', serif; 
    overflow:hidden; 
    width:1280px;
    margin:0 auto;
}

/***************
    Content
****************/

#content {
    margin:0 auto;
    width:900px;
    float:left;
}

#content #protected,
#content #notice,
#content #guest,
#content #posts,
#content #main-article {
    width:900px;
    background-color:white;
    border:1px solid #f1f1f1;
    margin:25px auto;
}

/***************
    Comment List
****************/

.commentList .image > img { 
    width:85px; 
    height:85px; 
    margin-right:25px;
    border-radius:50px;
}

.commentList .image {
    float:left;
	margin-bottom:35px;
}

.commentList .articles {
	padding-left:125px;
}

}

/***************
    Content
****************/

#content .inner-protected,
#content .inner-notice,
#content #posts .inner-posts,
#content #main-article .inner-main { 
    margin:0 auto;
    padding:15px;
    width:80%; 
    text-align:center;
}

/***************
    Protected, Notice
****************/

#content .inner-protected,
#content .inner-notice {
    text-align:center;
}
#content .inner-protected div,
#content .inner-notice div {
    margin:25px 0;
}
#content #main-article .inner-main { 
    text-align:left; 
    padding:50px 0;
}
#content #notice div.title,
#content #protected div.title { 
    font-size:24pt; 
}
#content #notice div.date,
#content #protected div.date { 
    font-size:10pt; 
}
#content #notice div.article {
    text-align:left;
}
#content #protected input { 
    height:24px; 
    margin-right:15px;
    width:23%;
}
#content #protected a.submit {
    padding: 7px;
    padding-left:15px;
    padding-right:15px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:9pt;
}
#content #protected a.submit:hover {
    background-color:gray;
}
#content #notice div.title a,
#content #protected div.title > a {
    transition-duration:0.2s;
}
#content #notice div.title > a:link,
#content #notice div.title > a:visited,
#content #protected div.title > a:link,
#content #protected div.title > a:visited {
    color:black;
}
#content #notice div.title a:hover,
#content #protected div.title > a:hover { 
    color:#585858;
}

/***************
    Guest
****************/

#guest {
    padding:35px;
    background-color:white;
    box-sizing:border-box;
    border:1px solid #f1f1f1;
    box-sizing:border-box;
    font-size:10pt;
    word-break:break-all;
}
#guest .title { 
    text-align:center; 
    font-size:20pt; 
    margin-bottom:50px;
}
#guest .guestWrite input:first-of-type {
    margin-left:0;
}
#guest .guestWrite input {
    width:23%;
    height:25px;
    margin:0px 10px;
    border:1px solid #dfdfdf;
    box-sizing:border-box;
    padding:15px;
}
#guest .guestWrite a.g_comment:hover { 
    background-color:gray; 
}
#guest .guestWrite a.g_comment {
    padding: 10px;
    padding-left:15px;
    padding-right:15px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:9pt;
}
#guest .guestWrite textarea {
    width:100%;
    margin:20px 0;
    border:1px solid #dfdfdf;
    box-sizing:border-box;
}
#guest .guestList { 
    margin-top:50px; 
}
#guest .guestList .guest_info,
#guest .guestList .guest_comments { 
    border-bottom:1px solid #dfdfdf; 
    padding:20px;
    margin:auto 25px;
}
#guest .guestList a:visited,
#guest .guestList a:link { 
    color:black; 
}
#guest .guestList a:hover { 
    color:#ffaea1; 
}
#guest .guestList { 
    margin:25px 0; 
}
#guest .guestList .reply {
    margin:20px 0;
    margin-bottom:30px;
}
#guest .guestList .g_article { 
    padding:20px;
    padding-bottom:0px;
    margin-left:25px;
    line-height:30px; 
    font-size:12pt;
}
#guest .guestList .control > a { 
    font-size:9pt; 
}
#guest .guestList .date { 
    font-size:10pt; 
}
#guest .guestList .name { 
    font-size:12pt; 
}
#guest .guestList .reply { 
    margin-left:45px; 
}
#guest .guestList .reply > a {
    padding:5px;
    padding-left:15px;
    padding-right:15px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:9pt;
}
#guest .guestList .reply > a:hover { 
    background-color:gray; 
}

/***************
    Thumbnail
****************/

#posts .title,
#posts .detail-info,
#posts .image,
#posts .article,
#posts .read-more {
    margin:35px auto;
}
#posts .title a {
    transition-duration:0.2s;
    font-size:24pt;
}
#posts .title a:link,
#posts .title a:visited {
    color:black;
}
#posts .title a:hover { 
    color:#585858;
}
#posts .image > img { 
    width:100%; 
}
#posts .detail-info {
    color:gray;
    font-size:10pt;
}
#posts .detail-info a:link,
#posts .detail-info a:visited,
#posts .detail-info a:hover {
    color:gray;
}
#posts .article {
    color:gray;
    font-size:11pt;
    text-align:left;
}
#posts .read-more a {
    padding:10px;
    padding-left:25px;
    padding-right:25px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:9pt;
}

/***************
    Main Article
****************/

#posts .read-more a:hover {
    background-color:#585858;
}
#content #main-article { 
    font-size:10pt; 
}
#content #main-article a { 
    transition-duration: 0.2s; 
}
#content #main-article .main-article-info  a:hover,
#content #main-article .main-article-info  a:visited {
     color:#585858; 
}
#content #main-article .main-article-info  a:link { 
    color:#ffaea1; 
}
#content #main-article .main-article-info {
    width:100%;
    display:block; 
    font-size:10pt;
    padding-bottom:15px;
    text-align:center;
}
#content #main-article .main-article-info  .date {
    margin-right:10px;
    color:gray;
}
#content #main-article .main-article-info  .title {
    display:block;
    font-weight:bold;
    font-size:25pt;
    margin-bottom:35px;
}
#content #main-article .main-article-info  .category > a:hover,
#content #main-article .main-article-info  .category > a:visited,
#content #main-article .main-article-info  .category > a:link { 
    color:gray; 
}
#content #main-article .main-article-info  .category {
    margin-bottom:20px;
}
#content #main-article .main-article-info  .title ~ div {
    display:block;
    float:left;
    margin-right:1px;
}
#content #main-article .article {
    display:block;
    float:none;
    margin:25px 0;
	line-height:30px;
    font-size:12pt;
}
#content #main-article .inner-main .admin  a:visited,
#content #main-article .inner-main .admin  a:link { 
    color:#585858; 
}
#content #main-article .inner-main .admin  a:hover { 
    color:#ffaea1; 
}
#content #main-article .inner-main .admin {
	 text-align:center;
     font-size:11pt;
     border-bottom:thin solid #f1f1f1; 
     padding-bottom:25px;
}
.tagText a:link,
.tagText a:visited { 
    color:#585858; 
}
.tagText a:hover { 
    color:#ffaea1;
}
.tagText { 
    color:#ffaea1; 
    margin-bottom:15px; 
    font-size:10pt;
    transition-duration:0.2s;
}


/***************
    Comment Counter
****************/

.comments_counter  a:visited,
.comments_counter  a:link { 
    color:black; 
}
.comments_counter  a:hover { 
    color:#ffaea1; 
}
.comments_counter { 
    border-top:thin solid #f1f1f1; 
    border-bottom:thin solid #f1f1f1; 
    padding:30px 0;
    font-size:10pt;
    color:#bababa; 
}

/***************
    Trackback
****************/

.trackback  a:visited,
.trackback  a:link { 
    color:black; 
}
.trackback  a:hover { 
    color:#ffaea1; 
}
.trackback {
    border-bottom:thin solid #f1f1f1; 
    padding:30px 0;
    font-size:11pt;
    color:black; 
}
.trackback .track-item {
    margin:25px 0;
}
.trackback a.delete {
    padding:5px;
    padding-left:15px;
    padding-right:15px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:10pt;
}
.trackback a.delete:hover { 
    background-color:gray; 
}

/***************
    Comment List
****************/

.commentList {
    word-break:break-all;
}
.commentList  a:visited,
.commentList  a:link { 
    color:black; 
}
.commentList  a:hover { 
    color:#ffaea1; 
}
.commentList { 
    margin:25px 0;
}
.commentList .reply {
    margin:20px 0;
    margin-bottom:25px;
}
.commentList .articles { 
    margin-top:25px; 
    font-size:12pt; 
}
.commentList .comment_article { 
    line-height:30px; 
}
.commentList .comment_info {
    margin:10px 0;
}
.commentList .control,
.commentList .date { 
    font-size:10pt; 
}
.commentList .name { 
    font-size:12pt; 
}
.commentList .reply > a {
    padding:5px;
    padding-left:15px;
    padding-right:15px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:9pt;
}
.commentList .reply > a:hover { 
    background-color:gray; 
}
.commentList .comments { 
    overflow:hidden; 
}
.commentList .s-rp2 { 
    margin-left:50px; 
}

/***************
    Comment Writer
****************/

.commentWrite {
    margin-top:25px;
    color:#bababa; 
}
.commentWrite .info_wirter {
    display:block;
    width:85%;
    float:left;
    text-align:left;
}
.commentWrite .check_secret {
    display:block;
    width:15%;
    float:right;
    text-align:right;
    margin-top:10px;
}
.commentWrite .check_secret > .checkbox { 
    display:none; 
}
.commentWrite .check_secret > .checkbox:checked + label { 
    background-color:gray; 
}
.commentWrite .check_secret > .checkbox + label {
    padding: 5px;
    padding-left:10px;
    padding-right:10px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:9pt;
    cursor:pointer;
}
.commentWrite s_rp_guest > input:first-of-type {
    margin-left:0;
}
.commentWrite s_rp_guest > input {
    width:23%;
    height:25px;
    margin:0 10px;
    border:1px solid #dfdfdf;
    box-sizing:border-box;
    padding:15px;
}
.commentWrite label { 
    font-size:9pt; 
}
.commentWrite a.comment:hover { 
    background-color:gray; 
}
.commentWrite a.comment {
    padding: 10px;
    padding-left:15px;
    padding-right:15px;
    background-color:black;
    color:white;
    transition-duration:0.2s;
    font-size:9pt;
}
.commentWrite textarea {
    width:100%;
    margin:20px 0;
    border:1px solid #dfdfdf;
    box-sizing:border-box;
    padding:15px;
}

/***************
    Sidebar
****************/

#aside {
    width:340px;
    float:right;
}

#aside .side-item {
    background-color:white;
    border:1px solid #f1f1f1;
    margin:25px auto;
    padding:15px;
    text-align:center;
}
#aside .side-item a {
	transition-duration:0.5s;
}
#aside .side-item  a:link,
#aside .side-item  a:visited {
    color:black;
}
#aside .side-item  a:hover { 
    color:#585858;
}
#aside .side-item  div { 
    margin:15px 0;
}
#aside .side-item .title {
    width:70%;
    font-size:11pt;
    font-weight:bold;
    margin:10px auto;
}
#aside .side-item .line {
    width:15%;
    margin:15px auto;
    border:1px solid black;
}
#aside .side-item .article { 
	font-size:11pt; 
	width:70%;
	margin:0 auto;
}
#aside .side-item .blogger {
    font-weight:bold; 
}
#aside .side-item .article div.blogImage img { 
    width:100%;
}
#aside .side-item .article a.tag {
    font-size:10pt; 
	margin-bottom:10px;
	padding: 5px;
    padding-left:10px;
    padding-right:10px;
	border:1px solid black;
	display:inline-block;
}
#aside .side-item .article .align-left { 
    text-align:left; 
}
#aside .side-item .counter { 
    width:80%; 
    margin:0 auto; 
    line-height:23px; 
}
#aside .side-item .counter > div, 
#aside .side-item .counter > span { 
	margin:0;
	color:#bababa; 
	font-size:10pt; 
}
#aside .side-item .counter .counter_title { 
    float:left; 
}
#aside .side-item .counter .counter_no { 
    float:right; 
}
#aside .side-item .counter .total { 
    overflow:hidden; 
    font-size:12pt; 
    color:#585858; 
}
#aside .side-item .counter .today { 
    overflow:hidden;
}
#aside .side-item .counter .yesterday { 
    overflow:hidden;
}

/***************
    Paging
****************/

.paging  a:visited,
.paging  a:link,
.paging  a:hover { 
    color:white; 
}
.paging {
    text-align:center;
	margin:50px auto;
}
.paging > .numbox > a {
    padding: 10px;
    padding-left:15px;
    padding-right:15px;
    background-color:black;
    color:white;
    margin-right:10px;
    transition-duration:0.2s;
    font-size:10pt;
}
.paging > .numbox  > a.num:hover { 
    background-color:gray; 
}

.copyright {
    text-align:center;
    margin-top:125px;
    margin-bottom:50px;
    font-size:9pt;
    font-family: 'Jeju Gothic', serif; 
}