@charset "UTF-8";


/*----------------------------------------------------
blogbody
----------------------------------------------------*/

#blogbody {
	margin-top: 6px;
	padding-bottom: 30px;
	}

#blogbody h2 img {
	width: 100%;
	}


/*----------------------------------------------------
contents
----------------------------------------------------*/

#contents {
	position: relative;
	width: 100%;
	}
#contents:after { content:""; display:block; clear:both; height:0; }
#contents { *zoom: 1; }

#sideLeft {
	position: absolute;
	top: 0;
	left: 0;
	width: 188px;
	border: solid 1px #d3b177;
	background: url(/hearttv-blog/images/side_bg.png) repeat left top;
	}

#sideRight {
	position: absolute;
	top: 0;
	right: 0;
	width: 188px;
	border: solid 1px #d3b177;
	border-width: 1px 1px 1px 0;
	background: url(/hearttv-blog/images/side_bg.png) repeat left top;
	}

#contents #mainBody {
	margin: 0 189px;
	border: solid 1px #d3b177;
	background-color: #ffffff;
	}

@media screen and (max-width: 1020px) {
#sideLeft {
	position: static;
	width: 100%;
	border: solid 1px #d3b177;
	border-width: 1px 1px 0 1px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}

#sideRight {
	position: static;
	width: 100%;
	border: solid 1px #d3b177;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}

#contents #mainBody {
	margin: 0;
	width: 100%;
	border: solid 1px #d3b177;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	}
}


/*----------------------------------------------------
sideLeft
----------------------------------------------------*/

#sideLeft h3 {
	color: #ffffff;
	font-size: 150%;
	line-height: 1;
	font-weight: normal;
	background-color: #ef5945;
	padding: 7px;
	}

#latestInfo {
	padding: 5px;
	}

#latestInfo .inner {
	margin-top: 4px;
	}

#latestInfo ul {
	max-height: 456px;
	height: auto !important;
	height: 456px;
	overflow: auto;
	}

#latestInfo li {
	margin: 0 0 4px 0;
	padding: 8px 6px;
	border: solid 1px #e7a9a1;
	background-color: #ffffff;
	font-size: 140%;
	line-height: 1.5714;
	}

#latestInfo li span {
	display: block;
	padding-top: 0.5em;
	}

#categories {
	border-top: solid 1px #d3b177;
	padding: 5px;
	}
@media screen and (max-width: 1020px) {
#categories {
	padding: 5px 5px 10px 5px;
	}
}

#categories li {
	margin: 6px 0 0 6px;
	padding-left: 16px;
	font-size: 140%;
	line-height: 1.5714;
	background: url(/hearttv-blog/images/side_icon.png) no-repeat left center;
	}


/*----------------------------------------------------
sideRight
----------------------------------------------------*/

.side_item {
	border-top: solid 1px #d3b177;
	padding: 5px;
}

.side_item h3 {
	color: #ffffff;
	font-size: 150%;
	line-height: 1;
	font-weight: normal;
	background-color: #ef5945;
	padding: 7px;
	}


.side_item p {
	font-size: 140%;
	line-height: 1.5714;
	padding: 5px;
	}

.side_item .truncate_more_link {
	display: block;
	text-align: right;
	}

.side_item .note {
	background-color: #fffaee;
	}

.side_item .listBox li {
	margin-top: 5px;
	background-color: #fffaee;
	font-size: 140%;
	line-height: 1.5714;
	padding: 5px;
	}

#sideBanner p {
	padding: 0;
	text-align: center;
	}

@media screen and (max-width: 1020px) {
	#sideRight .barBcAbout {
		display: none;
	}
}


/*----------------------------------------------------
entry
----------------------------------------------------*/

#pageBlogIndex .entry {
	padding: 0 0 30px;
	margin-bottom: 20px;
	border-bottom: solid 1px #d3b177;
	border-width: 1px 0;
	}
#pageBlogIndex .entry .moreLink {
	padding-top: 1em;
	text-align: right;
	}

.entry h3,
.entry .date,
.entry .description,
.entry .comment {
	padding: 0 30px;
	}

.entry .date {
	margin: 8px 0;
	}

.entry .date span {
	color: #ffffff;
	font-size: 140%;
	line-height: 1.2;
	background-color: #82210e;
	padding: 8px 10px;
	}

.entry h3 {
	margin-top: 14px;
	color: #000000;
	font-size: 200%;
	line-height: 1.5;
	font-weight: normal;
	}
@media screen and (max-width: 640px) {
.entry h3 {
	font-size: 180%;
	}
}
.entry .entryInfo {
	margin-top: 8px;
	border: solid 1px #d3b177;
	border-width: 1px 0;
	padding: 8px 30px;
	font-size: 130%;
	line-height: 1.2;
	}
.entry .entryInfo:after { content:""; display:block; clear:both; height:0; }
.entry .entryInfo { *zoom: 1; }

.entry .entryInfo li {
	float: left;
	padding:0 16px;
	border-left: solid 1px #7d7d7d;
	}
.entry .entryInfo li:first-child {
	padding:0 16px 0 0;
	border-left: none;
	}

.entry .description {
	margin-top: 14px;
	font-size: 160%;
	line-height: 1.73333;
	}

.entry .description .movie {
	text-align: center;
	}

.entry .comment {
	position: relative;
	border-top: solid 1px #d2dfd2;
	line-height: 1.7142857;
	margin-top: 1.5em;
	padding: 12px 0 50px 0;
	}

.entry .comment h4 {
	position: absolute;
	top: 12px;
	left: 0;
	width: 4.2em;
	color: #ffffff;
	background-color: #82210e;
	padding: 0.4em 0.8em;
	font-weight: normal;
	}

.entry .comment p {
	padding-top: 0.4em;
	padding-left: 7em;	
	}
.entry .comment p.note {
	padding-top: 0;
	padding-left: 0;
	}

.entry .comment .user {
	padding: 0.4em 0 28px;
	margin-left: 7em;
	margin-bottom: 16px;
	border-bottom: solid 1px #aaaaaa;
	}
.entry .comment .user p {
	font-size: 93.3333%;
	padding-left: 0;
	}
.entry .comment .user p.data {
	background: url(/hearttv-blog/images/dot_line.png) repeat-x left top;
	margin-top: 0.5em;
	padding-top: 0.5em;
	font-size: 92.857%;
	line-height: 1.3;
	}

.entry .comment .btn_comment {
	margin-top: 20px;
	text-align: center;
	}


@media screen and (max-width: 640px) {
.entry h3,
.entry .date,
.entry .description,
.entry .comment {
	padding: 0 19px;
	}
.entry .comment h4 {
	position: static;
	top: 0;
	}
.entry .comment p {
	padding: 12px 0;
	padding-left: 0;
	}
.entry .comment .user {
	margin-left: 0;
	padding: 0.4em 0 12px;
	margin-bottom: 6px;
	}
}
.entry .comment .socialButtons {
	margin-top: 30px;
}


/****************************************************
 movie
****************************************************/

.movie {
	display:block;
	width:520px;
	height:322px;
	margin:10px auto;
}

.movie img {
	width:100%;
	vertical-align:bottom;
}

@media only screen and (max-width: 590px) {
.movie {
	width:290px;
	height:192px;
	}
.movie embed {
	width:290px; height:192px;
	}
}

@media only screen and (max-width: 480px) {
.movie {
	width:244px;
	height:166px;
	}
.movie embed, .movie video {
	width: 100% !important;
	height: auto;
	margin-top:0;
	}
}


/*----------------------------------------------------
pagination
----------------------------------------------------*/

.pagination {
	padding: 0 0 50px;
	text-align: center;
	}
.pagination:after { content:""; display:block; clear:both; height:0; }
.pagination { *zoom: 1; }

.pagination p,
.pagination ul,
.pagination li {
	display: inline;
	}

.pagination p.prev {
	padding: 0 14px 0 0;
	white-space: nowrap; 
	}
.pagination p.next {
	padding: 0 0 0 14px;
	white-space: nowrap; 
	}

.pagination p a {
	color: #ec4d38;
	text-decoration: underline;
	font-size: 130%;
	}
.pagination p a:hover {
	text-decoration: none;
	}

.pagination ul {
	letter-spacing: -.40em;
	}

.pagination li a {
	display: inline-block;
	letter-spacing: normal;
	color: #000000;
	font-size: 130%;
	line-height: 1;
	text-decoration: none;
	background-color: #ffffff;
	border: solid 1px #000000;
	margin: 10px 3px 10px 3px;
	padding: 8px;
	}

*+html .pagination ul li a {
	display: inline;
	}

.pagination ul li a:hover {
	color: #ffffff;
	background-color: #ef5945;
	}

.pagination ul li .current_page {
	display: inline-block;
	letter-spacing: normal;
	color: #ffffff;
	font-size: 130%;
	line-height: 1;
	text-decoration: none;
	background-color: #ef5945;
	border: solid 1px #000000;
	margin: 10px 3px 10px 3px;
	padding: 8px;
	}

/* in case p > li */
.pagination p.prev li a	{
	padding: 0 14px 0 0;
	white-space: nowrap;
	}
.pagination p.next li	{
	padding: 0 0 0 14px;
	white-space: nowrap; 
	}
.pagination li a {
	color: #ec4d38;
	text-decoration: underline;
	font-size: 130%;
	}
.pagination li a:hover {
	text-decoration: none;
	}
.pagination ul {
	padding-left: 14px;
	}


/* image float fix */

@media only screen and (max-width: 640px) {
#mainBody img {
	max-width: 100% !important;
	height: auto !important;
	}
.mt-image-none,
.mt-image-left,
.mt-image-center,
.mt-image-right{
	float: none !important;
	max-width: 100% !important;
	height: auto !important;
	margin: 0 0 20px 0 !important;
	}
}