@charset "utf-8";
main h1
{
	margin: 10px 0;
	padding-left: 40px;
	font-family: 'Noto Sans TC', sans-serif;
	font-size: 2em;
	font-weight: 300;
	color: #646464;
	background-image: url("/pics/icon_edit_data.png");
	background-size: 36px 36px;
	background-repeat: no-repeat;
	background-position: left center;
}

main h2
{
	margin: 25px 0 0 0;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: 300;
	color: #646464;
}

main .main_container
{
	padding-top: 16px;
}

table.list
{
	width: 100%;
	border-spacing: 0;
	margin-bottom: 15px;
}

table.list th
{
	padding: 15px 0;
	border-top: 1px solid #ececec;
	border-bottom: 1px solid #ececec;
	font-size: 0.95em;
	color: #222;
	background-color: #fafafa;
}

table.list td
{
	padding: 15px;
	border-bottom: 1px solid #ececec;
}

td.board_name
{
	width: 200px;
}

td.thread_count, td.post_count, td.reply_count
{
	width: 76px;
	padding: 15px 5px !important;
	text-align: center;
	font-size: 0.8em;
}

td.last_thread span.author
{
	color: gray;
}

td.author, td.reply
{
	width: 110px;
	text-align: center;
}

td.author span.author, td.reply span.author
{
	font-size: 0.8em;
}

td.author span.post_time, td.reply span.post_time
{
	font-size: 0.75em;
	color: gray;
}

#adv
{
	width: 100%;
}

#adv ul
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

#adv ul li img
{
	display: block;
}

p.forum_function
{
	display: flex;
	justify-content: space-between;
	margin-top: 0;
}

p.forum_function input
{
	padding: 9px 20px;
	border: 1px solid #fa6800;
	font-size: 1.0em;
	font-weight: bold;
}

ul#posts
{
	padding: 0;
}

ul#posts li.post
{
	display: flex;
	gap: 15px;
	padding: 10px 0;
	border-bottom: 1px solid #eee;
	list-style: none;
}

ul#posts li.post .user_info
{
	width: 180px;
	min-width: 180px;
	overflow: hidden;
}

ul#posts li.post .user_info p
{
	margin: 0;
}

ul#posts li.post .user_info p.author
{
	position: relative;
	padding-top: 180px;
	font-size: 1.1em;
	font-weight: bold;
	color: #4494cd;
}

ul#posts li.post .user_info p.author img
{
	position: absolute;
	top: 0;
	left: 0;
}

ul#posts li.post .user_info p.ip, ul#posts li .user_info p.thread_count, ul#posts li .user_info p.reply_count
{
	font-size: 0.95em;
	color: gray;
}

ul#posts li.post .user_info p.floor
{
	font-size: 0.95em;
}

p.forum_function input.back
{
	color: #fa6800;
	background-color: #fff;
}

p.forum_function input.add_post, p.forum_function input.reply_post
{
	color: #fff;
	background-color: #fa6800;
}

ul#posts li .content
{
	width: 100%;
	overflow: auto;
}

ul#posts li .content .post_head
{
	display: flex;
	justify-content: space-between;
}

ul#posts li .content .post_head p
{
	margin: 0;
}

ul#posts li .content .post_head p.post_time
{
	font-size: 0.9em;
	color: gray;
}

ul#posts li .content .post_head p.post_function
{
	display: flex;
	justify-content: flex-end;
	gap: 10px;
}

ul#posts li .content .post_head p.post_function input
{
	padding: 6px 15px;
}

ul#posts li .content .post_content img
{
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

ul#posts li .content .post_content blockquote
{
	border: 1px solid #f0f0f0;
	padding: 9px 15px;
	color: gray;
	background-color: #f7f7f7;
}

ul#posts li .content .post_content table
{
	width: 100%;
	border-spacing: 0;
	border-top: 1px solid #000;
}

ul#posts li .content .post_content table tr th, ul#posts li .content .post_content table tr td
{
	padding: 3px;
	border-bottom: 1px solid #000;
	text-align: center;
}

ul#posts li .content .post_content pre code.hljs
{
	display: block;
	overflow-x: auto;
	background: #f6f8fa;
	border: 1px solid #d0d7de;
	border-radius: 6px;
	padding: 16px;
	color: #24292f;
	font-size: 14px;
	line-height: 1.6;
	font-family: Consolas, Monaco, monospace;
}

ul#posts li .content .post_content iframe
{
	display: block;
	width: 100%;
	max-width: 900px;
	aspect-ratio: 16 / 9;
	height: auto;
	margin: 0 auto;
	border: 0;
}

ul#posts li .content .post_content ul li
{
	list-style: disc;
}

.post_info
{
	position: relative;
	border: 1px solid #c7c7c7;
	padding: 20px 0;
	background-color: #fbfbfb;
}

.post_info fieldset
{
	margin: 20px 0;
	border: 0;
	padding: 0;
}

.post_info legend
{
	display: block;
	width: calc(100% - 80px);
	margin: 0 40px;
	border-bottom: 1px solid #c7c7c7;
	padding: 0;
	font-size: 1.2em;
}

.post_info fieldset .field, .post_info fieldset .info
{
	padding: 5px 40px 10px 40px;
}

.post_info fieldset .field:hover
{
	border-left: 3px solid #ef7c1b;
	padding-left: 37px;
	background-color: #f5f5f5;
}

.post_info label
{
	display: block;
}

.post_info input
{
	border: 1px solid #d9d9d9;
	padding: 3px 10px;
	font-size: 0.8em;
}

.post_info input:focus
{
	border: 1px solid #919191;
}

.post_info input.function_button
{
	border: 0;
	padding: 3px 10px;
	color: #222;
	background-color: #d9d9d9;
}

.post_info input.required
{
	background-image: url("/pics/bg_input_field_required.png");
	background-repeat: no-repeat;
	background-position: left top; 
}

.post_info input.common
{
	flex-grow: 1;
}

.post_info input.valid_code
{
	width: 105px;
}

.post_info textarea
{
}

.post_info fieldset .field .input_field
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px;
}

.post_info fieldset p.post_function
{
	margin: 9px 0 0 0;
	text-align: center;
}

.post_info fieldset p.post_function input.send_post
{
	padding: 9px 20px;
	border: 1px solid #fa6800;
	font-size: 1.0em;
	font-weight: bold;
	color: #fff;
	background-color: #fa6800;
}

.bbs_navigation_bar
{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	row-gap: 6px;
	column-gap: 10px;
	margin-bottom: 15px;
	border: 1px solid #f0f0f0;
	padding: 9px 5px;
	background-color: #f7f7f7;
	overflow: auto;
}

.bbs_navigation_bar ul
{
	display: flex;
	gap: 5px;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.bbs_navigation_bar ul li
{
	width: 26px;
	height: 26px;
	background-size: contain;
}

.bbs_navigation_bar ul#function_order_by li
{
	text-indent: -9999px;
}

.bbs_navigation_bar ul li.up
{
	background-image: url("/pics/icon_up.rwd.png");
}

.bbs_navigation_bar ul li.down
{
	background-image: url("/pics/icon_down.rwd.png");
}

.bbs_navigation_bar ul li.first_page
{
	text-indent: -9999px;
	background-image: url("/pics/icon_first_page.rwd.png");
}

.bbs_navigation_bar ul li.previous_page
{
	text-indent: -9999px;
	background-image: url("/pics/icon_previous_page.rwd.png");
}

.bbs_navigation_bar ul li.next_page
{
	text-indent: -9999px;
	background-image: url("/pics/icon_next_page.rwd.png");
}

.bbs_navigation_bar ul li.last_page
{
	text-indent: -9999px;
	background-image: url("/pics/icon_last_page.rwd.png");
}

.bbs_navigation_bar ul li a
{
	display: block;
	width: 26px;
	height: 26px;
}

.bbs_navigation_bar ul.function_page
{
	display: flex;
	flex-wrap: wrap;
	flex-grow: 1;
	gap: 5px;
	margin: 0;
	padding: 0 !important;
	list-style: none;
}

.bbs_navigation_bar ul.function_page li, ul#additional_page_selector li
{
	display: flex;
	justify-content: center;
	width: 26px;
	height: 26px;
	line-height: 26px;
	text-align: center;
	color: #fff;
	background-color: #999;
}

.bbs_navigation_bar ul.function_page li a, ul#additional_page_selector li a
{
	color: #fff;
}

.bbs_navigation_bar ul.function_page li.this_page, ul#additional_page_selector li.this_page
{
	background-color: #4390df;
}

.bbs_navigation_bar ul.function_page li.digit_3
{
	font-size: 0.8em;
}

#ad_200, #adv
{
	width: 100%;
}

#ad_200 ul, #adv ul
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

#ad_200 ul li img, #adv ul li img
{
	display: block;
}

@media all and (max-width: 576px) {
.fixed
{
	display: none;
}

.expanded
{
	flex-grow: 1;
	max-width: 100%;
}

ul#posts li .user_info
{
	width: 90px;
	min-width: 90px;
}

ul#posts li .user_info p.author
{
	padding-top: 90px;
}

ul#posts li .user_info p.author img
{
	width: 90px;
}

ul#posts li .user_info p.ip
{
	display: none;
}
}
@media all and (min-width: 577px) and (max-width: 768px) {
.fixed
{
	display: none;
}

.expanded
{
	flex-grow: 1;
	max-width: 768px;
}

ul#posts li .user_info
{
	width: 90px;
	min-width: 90px;
}

ul#posts li .user_info p.author
{
	padding-top: 90px;
}

ul#posts li .user_info p.author img
{
	width: 90px;
}

ul#posts li .user_info p.ip
{
	display: none;
}
}
@media all and (min-width: 769px) and (max-width: 992px) {
.fixed
{
	display: none;
}

.expanded
{
	width: 100%;
}

ul#posts li .user_info
{
	width: 90px;
	min-width: 90px;
}

ul#posts li .user_info p.author
{
	padding-top: 90px;
}

ul#posts li .user_info p.author img
{
	width: 90px;
}

ul#posts li .user_info p.ip
{
	display: none;
}
}
@media all and (min-width: 993px) and (max-width: 1199px) {
.fixed
{
	display: none;
}

.expanded
{
	width: 100%;
}

ul#posts li .user_info
{
	width: 120px;
	min-width: 120px;
}

ul#posts li .user_info p.author
{
	padding-top: 120px;
}

ul#posts li .user_info p.author img
{
	width: 120px;
}
}
@media all and (min-width: 1200px) {
main .main_container
{
	gap: 25px;
}

.fixed
{
	display: none;
}

.expanded
{
	width: 1200px;
}
}
@media all and (min-width: 1600px) {
main .main_container
{
	gap: 25px;
}

.fixed
{
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	gap: 10px;
	width: 200px;
}

.expanded
{
	width: 1375px;
	max-width: 1375px;
}
}