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

	*{
		box-sizing:border-box;
	}

	html{
		scroll-behavior:smooth;
	}

	body{
		margin:0;
		padding:10px;
		font-family:"Arial", sans-serif;
		font-size:16px;
		line-height:1.7;
		overflow-x:hidden;
		color:#000;
		background:#fff;
	}

	h1, h2, h3{
		line-height:1.4;
	}

	p,
	div,
	span,
	a,
	button,
	input,
	textarea{
		font-size:inherit;
	}

	img{
		max-width:100%;
		height:auto;
	}

	a{
		word-break:break-all;
	}

	.pc-only{
		display:none !important;
	}

	.sp-only{
		display:block !important;
	}

	input[type="text"],
	input[type="email"],
	input[type="password"],
	input[type="search"],
	input[type="url"],
	textarea,
	select{
		width:100%;
		max-width:100%;
		font-size:16px;
		box-sizing:border-box;
	}

	textarea{
		min-height:100px;
	}

	button,
	input[type="submit"],
	input[type="button"]{
		max-width:100%;
		cursor:pointer;
	}

	header,
	.header,
	.page-header{
		display:block;
		width:100%;
		margin-bottom:10px;
	}

	.page-header-left,
	.page-header-right{
		display:block;
		width:100%;
		text-align:left;
		margin-bottom:8px;
		word-break:break-all;
	}

	.container,
	.main,
	.content,
	.wrapper{
		width:100%;
		max-width:100%;
		padding:0;
		margin:0;
	}

	.thumb{
		display:inline-block;
		width:46%;
		margin:6px 1%;
		text-align:center;
		vertical-align:top;
	}

	.thumb img{
		width:100%;
		max-width:120px;
		height:auto;
	}

	.thread-box,
	.file-box,
	.post-box{
		width:100%;
		max-width:100%;
		margin:10px 0;
	}

	#drop-zone{
		width:100%;
		max-width:100%;
		height:160px;
		padding:1em;
	}

	#preview{
		width:100%;
		max-width:100%;
	}

	#preview li{
		width:100%;
		height:auto;
		align-items:flex-start;
	}

	#preview img{
		width:80px;
		height:80px;
	}

	#clear-btn{
		width:70px;
		height:28px;
	}

	form{
		max-width:100%;
	}

	form input,
	form textarea,
	form select{
		margin-bottom:6px;
	}

	#main-image,
	.main-image{
		max-width:100%;
		height:auto;
	}

	.comment{
		width:100%;
		max-width:100%;
		box-sizing:border-box;
		padding:6px 0;
		margin:0;
		border-bottom:1px solid #ddd;
		background:#fff;
		overflow-wrap:break-word;
		word-break:break-word;
	}

	.comment.mine{
		background:#fff8dc;
	}

	.comment-header{
		display:block;
		width:100%;
	}

	.comment-header .left{
		display:flex;
		flex-wrap:wrap;
		gap:4px 6px;
		width:100%;
	}

	.comment-header .right{
		display:block;
		width:100%;
		margin-top:4px;
		text-align:left;
		white-space:normal;
	}

	.left{
		display:block;
		width:100%;
	}

	.comment .no,
	.no,
	span.no{
		color:#66f;
		font-size:14px;
		font-weight:bold
;	}

	.no small{
		color:#666;
		font-size:11px;
	}

	.no.reply-link{
		cursor:pointer;
		color:#999;
		font-size:11px;
		display:inline;
	}

	.ip_address,
	.comment .ip_address{
		color:red;
		font-size:13px;
		word-break:break-all;
	}

	.uid,
	.comment .uid{
		color:#008800;
		font-size:13px;
		word-break:break-all;
		overflow-wrap:anywhere;
	}

	.ng-user-btn{
		border:1px solid #ccc;
		background:#f5f5f5;
		color:#555;
		font-size:11px;
		padding:2px 6px;
		border-radius:10px;
		cursor:pointer;
		margin-left:4px;
		vertical-align:middle;
	}

	.ng-user-btn:hover{
		background:#ffe5e5;
		color:#c00;
	}

	div.comment p{
		font-size:15px;
		font-weight:normal;
		color:#000;
		margin:6px 0;
	}

	.reply{
		color:#007bff;
		cursor:pointer;
	}

	.popup{
		position:absolute;
		background:#ffc;
		color:#666;
		border:1px solid #ccc;
		padding:8px;
		max-width:90vw;
		z-index:9999;
		white-space:pre-wrap;
		pointer-events:none;
		font-size:14px;
		box-shadow:0 2px 8px rgba(0,0,0,0.2);
	}

	.comment.new-comment{
		animation:flash 2s;
	}

	.comment.ng-hidden{
		display:none;
	}

	#clear-ng-btn{
		border:1px solid #000;
		cursor:pointer;
	}

	#clear-ng-btn:hover{
		background:#ffecec;
		color:#c00;
		cursor:pointer;
	}

	div.report,
	.report{
		width:100%;
		text-align:left;
		margin-top:4px;
	}

	.report-button{
		border:1px solid #ccc;
		background:#f5f5f5;
		color:#000;
		font-size:11px;
		padding:2px 6px;
		border-radius:5px;
		cursor:pointer;
	}

	.report-button:hover{
		background:#ffe5e5;
		color:#c00;
	}

	#report_form{
		text-align:left;
	}

	#comment-form{
		width:100%;
		max-width:100%;
	}

	#comment{
		width:100%;
		max-width:100%;
	}

	.like-area{
		margin:15px 0;
	}

	#like-btn{
		padding:5px 10px;
		cursor:pointer;
		border:1px solid #aaa;
	}

	.like-btn{
		background:none;
		border:none;
		cursor:pointer;
		font-size:24px;
		color:#999;
		padding:0;
		margin:0 4px 0 0;
		transition:0.2s;
	}

	.like-btn:hover{
		transform:scale(1.15);
	}

	.like-btn.liked{
		color:#ff3366;
		text-shadow:0 0 8px rgba(255,51,102,0.5);
	}

	.copy-area{
		margin:15px 0;
		display:flex;
		flex-wrap:wrap;
		gap:8px;
		align-items:center;
	}

	.copy-area button{
		min-width:72px;
	}

	.action-btn{
		padding:10px 14px;
		border-radius:6px;
		font-size:15px;
	}

	.copy-btn{
		border:1px solid #ccc;
		background:#f7f7f7;
		padding:7px 12px;
		border-radius:18px;
		cursor:pointer;
		font-size:13px;
		transition:0.2s;
	}

	.copy-btn:hover{
		background:#eef4ff;
		border-color:#7aa7ff;
	}

	.copy-btn.copied{
		background:#2ecc71;
		color:#fff;
		border-color:#2ecc71;
		transform:scale(1.05);
	}

	#copy-message{
		opacity:0;
		transform:translateY(5px);
		transition:opacity 0.3s ease, transform 0.3s ease;
		color:#2e7d32;
		font-size:13px;
		margin-left:5px;
	}

	#copy-message.show{
		opacity:1;
		transform:translateY(0);
	}

	#new-comment-btn{
		position:fixed;
		left:50%;
		transform:translateX(-50%);
		bottom:90px;
		width:auto;
		max-width:90%;
		padding:10px 20px;
		border:none;
		border-radius:20px;
		background:#007bff;
		color:#fff;
		cursor:pointer;
		display:none;
		z-index:9999;
		box-shadow:0 2px 6px rgba(0,0,0,0.3);
	}

	#new-comment-btn:hover{
		background:#0056b3;
	}

	#scroll-buttons{
		position:fixed;
		right:8px;
		bottom:8px;
		display:none;
		flex-direction:column;
		gap:8px;
		z-index:9999;
	}

	#scroll-buttons button{
		width:42px;
		height:42px;
		border:none;
		border-radius:50%;
		background:#333;
		color:#fff;
		font-size:18px;
		cursor:pointer;
		box-shadow:0 2px 6px rgba(0,0,0,0.3);
	}

	#scroll-buttons button:hover{
		background:#555;
	}

	.next-thread-notice{
		max-width:100%;
		margin:15px 0;
		padding:12px 15px;
		background:#fff8dc;
		border:1px solid #e0c36a;
		border-radius:8px;
		color:#6b4e00;
		line-height:1.7;
		word-break:break-word;
	}

	.prev-notice{
		max-width:100%;
		margin:15px 0;
		padding:12px 15px;
		background:#eef;
		border:1px solid #99f;
		border-radius:8px;
		color:#00f;
		line-height:1.7;
		word-break:break-word;
	}

	.search-result-list{
		margin-top:20px;
	}

	.search-item{
		padding:12px 4px;
		border-bottom:1px solid #ccc;
	}

	.search-item h2{
		margin:0 0 8px 0;
		font-size:18px;
	}

	.search-item a{
		color:#0066cc;
		text-decoration:none;
	}

	.search-item a:hover{
		text-decoration:underline;
	}

	.keyword{
		color:#666;
		margin-bottom:5px;
	}

	.score{
		color:#999;
		font-size:12px;
	}

	.notification{
		background:#fff3cd;
		border:1px solid #ffeeba;
		color:#856404;
		padding:5px;
		margin-bottom:10px;
	}

	table{
		width:100%;
		display:block;
		overflow-x:auto;
		white-space:nowrap;
	}

	.meta{
		font-size:12px;
		color:#555;
		margin-top:3px;
	}

	div.sort{
		margin-top:10px;
		margin-bottom:0;
	}

	.jump-highlight{
		background:#fffa9c !important;
		transition:background 0.5s;
	}

	.comment:target{
		animation:targetFlash 3s ease;
		outline:3px solid #ccf !important;
		background:#eef;
	}

	.comment-header .left{
		display:flex;
		flex-wrap:wrap;
		align-items:center;
		gap:4px;
	}

	.comment .no,
	.comment .ip_address,
	.comment .uid{
		font-size:13px;
	}

	.comment-header .right{
		font-size:11px;
		color:#800000;
	}

	div.comment p{
		font-size:15px;
	}

	.ng-user-btn{
		font-size:11px;
		padding:2px 6px;
	}

	body.login{
		padding:12px;
		background:#f5f5f5;
	}

	body.login .login-box{
		width:100%;
		max-width:360px;
		margin:24px auto;
		padding:20px;
		background:#fff;
		border-radius:8px;
	}

	body.login .login-box input{
		width:100%;
		padding:10px;
		margin:10px 0;
		font-size:16px;
	}

	body.login .login-box button{
		width:100%;
		padding:10px;
		font-size:16px;
		background:#2196F3;
		color:#fff;
		border:none;
	}

	body.login .login-box p{
		text-align:center;
	}

	body.login .error{
		color:red;
	}

/* # # # # # # # # # # # # # # # # # #*/

	.site-header{
		display:block;
		width:100%;
		background:navy;
		color:#fff;
		margin-bottom:12px;
		font-size:16px;
		line-height:1.7;
	}

	.site-header .header-left,
	.site-header .header-right{
		display:block;
		width:100%;
		box-sizing:border-box;
		padding:6px 8px;
		text-align:left;
	}

	.site-header .header-link,
	.site-header span{
		font-size:16px;
		line-height:1.7;
	}

	.site-header .header-separator{
		display:none;
	}

/*	.site-header .login-info{
		display:block;
		margin-bottom:4px;
	}
*/

	/* 投稿ボタン */
	#submit-btn{
		background:#0077cc;
		color:#fff;
		font-weight:bold;
	}

	.login-info{
		margin-bottom:6px;
	}

	.header-menu a{
		display:inline-block;
		margin-right:10px;
		margin-bottom:4px;
	}

	.copy-button{
		margin:6px;
	}

/*


	.site-header .header-link{
		display:inline-block;
		color:#fff;
		margin-right:8px;
	}


	.header-link{
		display:inline;
		color:#fff;
		text-align:right;
		margin:0px 0px 0px 5px;
	}

	.login-info{
		display:inline;
		margin-bottom:6px;
	}

	.login-name{
		font-weight:bold;
		color:#fff;
	}
*/

/* # # # # # # # # # # # # # # # # # #*/

/*	.site-header.login-label,
	.site-header.login-email{
		display:inline;
	}
*/

	.header-separator{
		display:none;
	}

	body.register{
		padding:12px;
		background:#f5f5f5;
	}

	body.register .box{
		width:100%;
		max-width:360px;
		margin:40px auto;
		padding:20px;
		background:#fff;
		border-radius:8px;
	}

	body.register .box input,
	body.register .box button{
		width:100%;
		box-sizing:border-box;
		font-size:16px;
	}

	body.forgot{
		padding:12px;
		background:#f5f5f5;
	}

	body.forgot .box{
		width:100%;
		max-width:360px;
		margin:40px auto;
		padding:20px;
		background:#fff;
		border-radius:8px;
	}

	body.forgot .box input,
	body.forgot .box button{
		width:100%;
		box-sizing:border-box;
		font-size:16px;
	}

	body.reset{
		padding:12px;
		background:#f5f5f5;
	}

	body.reset .box{
		width:100%;
		max-width:360px;
		margin:40px auto;
		padding:20px;
		background:#fff;
		border-radius:8px;
	}

	body.reset .box input,
	body.reset .box button{
		width:100%;
		box-sizing:border-box;
		font-size:16px;
	}

	body.verify{
		padding:12px;
		background:#f5f5f5;
	}

	body.verify .box{
		width:100%;
		max-width:360px;
		margin:40px auto;
		padding:20px;
		background:#fff;
		border-radius:8px;
	}

	body.forgot p.error{
		color:red !important;
		font-weight:bold;
	}

	body.forgot p.success{
		color:#2e7d32 !important;
		font-weight:bold;
	}

	body.upload{
		padding:8px;
	}

	body.upload #upload_form{
		width:100%;
		max-width:100%;
	}

	body.upload #drop-zone{
		width:100%;
		height:180px;
		padding:18px;
		text-align:left;
		line-height:1.7;
	}

	body.upload #clear-btn{
		display:inline-block;
		margin:10px 0;
	}

	body.upload .upload-table,
	body.upload .upload-table tbody,
	body.upload .upload-table tr,
	body.upload .upload-table th,
	body.upload .upload-table td{
		display:block;
		width:100%;
	}

	body.upload .upload-table th{
		padding:10px 0 2px;
		font-weight:bold;
	}

	body.upload .upload-table td{
		padding:0 0 6px;
	}

	body.upload input[type="text"],
	body.upload input[type="email"],
	body.upload input[type="password"],
	body.upload textarea{
		width:100%;
		max-width:100%;
		box-sizing:border-box;
		font-size:16px;
	}

	body.upload textarea{
		min-height:120px;
	}

	body.upload #submit_button{
		width:100%;
		padding:10px;
		margin-top:10px;
		font-size:16px;
	}

	body.admin-mail-log{
		padding:8px;
	}

	body.admin-mail-log .mail-log-box{

		width:100%;
		max-width:100%;
/*
		width:360px;
		max-width:360px;
*/
		padding:10px;
		margin:10px 0;
	}

	body.admin-mail-log .mail-body{
		font-size:13px;
		word-break:break-all;
		overflow-wrap:anywhere;
	}

	body.admin-mail-log .meta{
		font-size:12px;
		line-height:1.6;
	}

	.comment-body,
	div.comment p{
		font-size:16px !important;
		line-height:1.7;
	}

	div.comment p,
	.comment-body{
		font-size:20px !important;
		line-height:1.8 !important;
	}

	.comment .no,
	.comment .ip_address,
	.comment .uid,
	.comment-header .right{
		font-size:15px !important;
		line-height:1.7 !important;
	}

	.report-button,
	.ng-user-btn,
	.reported-label{
		font-size:14px !important;
	}

	body div.comment p.comment-body{
		font-size:24px !important;
		line-height:1.8 !important;
	}

	.comment-textarea{
		width:100% !important;
		max-width:100% !important;
		min-height:90px;
		font-size:16px !important;
		line-height:1.6;
		margin:15px 0 8px 0;
		display:block;
	}

	.site-header,
	.site-header *{
		font-size:16px !important;
		line-height:1.7 !important;
	}

	.site-header{
		padding:0;
	}

	.site-header .header-left,
	.site-header .header-right{
		padding:10px 12px;
	}

	header.site-header,
	header.site-header div,
	header.site-header span,
	header.site-header a{
		font-size:16px !important;
		line-height:1.7 !important;
	}

	.comment{
		max-width:none !important;
		width:100% !important;
	}

	body.thread-view{
		line-height:1.7 !important;
	}

	body.thread-view main{
		width:100% !important;
		max-width:100% !important;
	}

	body.thread-view{
		line-height:1.7 !important;
	}

	body.thread-view main{
		width:100% !important;
		max-width:100% !important;
	}

	.view-count{
		font-size:14px;
		margin-bottom:8px;
		color:#666;
	}

	.related-threads{
		margin:15px 0;
		padding:12px;
	}

	.related-title{
		font-size:18px;
		margin-top:0;
	}

	.related-score{
		font-size:13px;
		color:#999;
	}

	div.account_box, div.account_delete_box{
		border:1px solid #ccc;
		padding:15px;
		margin:15px 0;
		max-width:100%;
		background:#fff;
	}

	.comment-header .username{
		font-weight:normal;
		color:#336699;
		margin-right:6px;
	}

	.comment-header{
		display:block !important;
		width:100%;
	}

	.comment-header .left{
		display:flex !important;
		flex-wrap:wrap !important;
		gap:4px 6px;
		width:100%;
	}

	.comment-header .right{
		display:block !important;
		width:100%;
		margin-top:4px;
		text-align:left !important;
		white-space:normal !important;
	}

	.comment-header .username,
	.comment-header .ip_address,
	.comment-header .uid{
		overflow-wrap:anywhere;
		word-break:break-all;
	}

	.comment-header .uid{
		display:inline-block;
		max-width:100%;
		overflow-wrap:anywhere;
		word-break:break-all;
	}

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

	.site-header{
		display:block !important;
		width:100% !important;
		box-sizing:border-box !important;
		overflow:hidden !important;
	}

	.site-header .header-left,
	.site-header .header-right{
		display:block !important;
		width:100% !important;
		box-sizing:border-box !important;
		padding:6px 8px !important;
		text-align:left !important;
		white-space:normal !important;
		overflow-wrap:anywhere !important;
		word-break:normal !important;
	}

	.site-header .header-left{
		border-bottom:1px solid rgba(255,255,255,0.25);
	}

	.site-header .header-left a{
		display:inline-block !important;
		white-space:nowrap !important;
	}

	.site-header .login-info{
		display:block !important;
		margin-bottom:4px !important;
		white-space:normal !important;
	}

	.site-header .header-menu{
		display:block !important;
		white-space:normal !important;
	}

	.site-header .header-link{
		display:inline-block !important;
		margin:0 8px 4px 0 !important;
		color:#fff !important;
		white-space:nowrap !important;
	}

	.site-header .header-separator{
		display:none !important;
	}

}

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

	.site-header,
	.site-header a,
	.site-header span,
	.site-header .login-info,
	.site-header .login-email,
	.site-header .header-link{
		font-size:13px !important;
		line-height:1.7 !important;
	}

}

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

	html,
	body{
		width:100%;
		max-width:100%;
		overflow-x:hidden;
		-webkit-text-size-adjust:100%;
		text-size-adjust:100%;
	}

	img,
	video,
	iframe{
		max-width:100%;
		height:auto;
	}

	.site-header{
		font-size:13px !important;
		line-height:1.7 !important;
		-webkit-text-size-adjust:100%;
		text-size-adjust:100%;
	}

}

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

	.comment,
	.comment-body,
	main{
		max-width:100%;
		box-sizing:border-box;
		overflow-wrap:anywhere;
		word-break:break-word;
	}

}

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

	header.site-header{
		font-size:16px !important;
	}

	header.site-header *{
		font-size:16px !important;
	}

}

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

	.site-header,
	.site-header *{
		font-size:16px !important;
		line-height:1.7 !important;
		font-weight:normal !important;
	}

	.site-header .login-email,
	.site-header .login-name{
		font-weight:bold !important;
	}

}