body {
	min-height: 100vh;
}
* { 
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
/************************************************/
@media screen and (min-width:640px) {
	.main{
		padding:5px;
		margin:0;
		width: 200px;
		height:100vh;
		overflow: scroll;
		float:left;
	}
	iframe{
		margin:0;
		width: calc(100% - 200px);
		display: flex;
		min-height: 100vh;
		min-height: 100svh;
		border:1px solid white;
		float:right;
	}
	h3{
		font-size: large;
		margin:10px;
		padding:10px;
	}
	.detail_box{
		margin:10px 0;
		padding:0;
	}
	.thum_box{
		padding:5px;
		width:60px;
	}
	.subject_box{
		width:calc(100% - 60px);
		text-align:right;
	}
	.count{
		float:right;
	}
	.lastupdate{
		float:left;
	}
}
@media screen and (max-width:639px) {
	.main-detail{
		margin:10px auto;
		padding:10px;
	}
	iframe{
		display:none;
	}
	.box{
		max-width: fit-content;
		padding:10px;
		margin:10px auto;
	}
	.thum_box{
		width:60px;
		padding:0;
		margin:0;
		text-align: right;
		float: left;
	}
	.subject_box{
		width:calc(100% - 60px);
		padding:0;
		margin:0;
		float: left;
	}
	.subject_box2{
		padding:0;
		margin:0;

	}
	h3{
		text-align: left;
		margin:0;
		padding:0;
	}
	.count{
		float: right;
	}
	.lastupdate{
		padding-left:3px;
		float: left;
	}
}
h2{
	font-size:large;
	margin:10px;
	padding:10px;
}
/* detail ****************************************************/