/*
	DESTOON Copyright (C)2008-2099 www.destoon.com
	This is NOT a freeware,Use is subject to license.txt
*/
.submit_success {background:#F1FBE8 url('okay.gif') no-repeat 20px center;padding:20px 20px 20px 60px;font-size:14px;margin-bottom:20px;}
.submit_btn {background:#258CFF;color:#FFFFFF;font-size:14px;padding:5px 15px 5px 15px;border:none;}
.cp{width:11px;height:11px;padding:0 10px;cursor:pointer;}
.cp:hover{padding:0 11px;}
/* gift */
.g_info {padding:24px;}
.g_info li {padding:12px 6px;border-bottom:#EEEEEE 1px dotted;}
.g_img {padding:2px;border:#EEEEEE 1px solid;}
/* poll */
.poll_show {padding:0 16px;text-align:center;}
.poll_show li {height:20px;line-height:20px;overflow:hidden;padding:6px 0;}
.poll_show td:hover {background:#F2F2F2;}
.poll_img {border:#CCCCCC 1px solid;margin:0 0 5px 0;}
.poll_verify {width:400px;height:120px;background:#FAFAFA;overflow:hidden;z-index:1;position:absolute;left:50%;margin:100px 0 100px -200px;display:none;}
/* vote */
.vote_show {padding:0 20px 20px 20px;}
.vote_show_n {width:18px;height:18px;line-height:18px;font-size:11px;background:#258CFF;color:#FFFFFF;text-align:center;}
.vote_show_p {height:11px;line-height:11px;background:#EDEDED;font-size:1px;}
.vote_show_p div {height:11px;line-height:11px;float:left;}
.vote_show_1 {background:#EA7211 url('vote_bg.gif') repeat-x 0 0;border-left:#EA7211 1px solid;border-right:#EA7211 1px solid;}
.vote_show_2 {background:#AABF00 url('vote_bg.gif') repeat-x 0 -11px;border-left:#AABF00 1px solid;border-right:#AABF00 1px solid;}
.vote_show_3 {background:#8B2A00 url('vote_bg.gif') repeat-x 0 -22px;border-left:#8B2A00 1px solid;border-right:#8B2A00 1px solid;}
.vote_show_4 {background:#BF844A url('vote_bg.gif') repeat-x 0 -33px;border-left:#BF844A 1px solid;border-right:#BF844A 1px solid;}
.vote_show_5 {background:#3A8938 url('vote_bg.gif') repeat-x 0 -44px;border-left:#3A8938 1px solid;border-right:#3A8938 1px solid;}
.vote_show_6 {background:#486193 url('vote_bg.gif') repeat-x 0 -55px;border-left:#486193 1px solid;border-right:#486193 1px solid;}
.vote_show_7 {background:#7DA3AE url('vote_bg.gif') repeat-x 0 -66px;border-left:#7DA3AE 1px solid;border-right:#7DA3AE 1px solid;}
.vote_show_8 {background:#AE1486 url('vote_bg.gif') repeat-x 0 -77px;border-left:#AE1486 1px solid;border-right:#AE1486 1px solid;}
.vote_show_9 {background:#5AB502 url('vote_bg.gif') repeat-x 0 -88px;border-left:#5AB502 1px solid;border-right:#5AB502 1px solid;}
.vote_show_10 {background:#BF2146 url('vote_bg.gif') repeat-x 0 -99px;border-left:#BF2146 1px solid;border-right:#BF2146 1px solid;}
/* from */
.form {margin:10px 32px 0 32px;border:#EEEEEE 1px solid;border-bottom:none;}
.form .f_0 {display:none;}
.form .f_1 {width:150px;background:#F4F4F4;border-bottom:#EEEEEE 1px solid;}
.form .f_2 {border-left:#EEEEEE 1px solid;border-bottom:#EEEEEE 1px solid;}
.form .f_3 {float:left;padding:6px 20px 6px 0;}
.form .f_3 input {padding:2px;}
.form .f_s {font-size:12px;color:#999999;padding:0 6px 10px 6px;}
.survey {margin:10px 32px 0 32px;}
.survey .f_0 {}
.survey .f_1 {font-weight:bold;}
.survey .f_2 {border-bottom:#EEEEEE 1px dotted;padding-left:32px;}
.survey .f_3 {padding:6px 0;}
.survey .f_3 input {padding:2px;}
.survey .f_s {font-size:12px;color:#999999;padding:0 6px 10px 6px;}
/* spread */
.btn-spread {font-size:16px;font-weight:bold;letter-spacing:1px;width:136px;height:42px;line-height:42px;text-align:center;cursor:pointer;padding:0;-webkit-appearance:none;margin:6px 10px 0 0;background:#DC182B;border:#E11111 2px solid;border-radius:24px;color:#FFFFFF;}
.btn-spread:hover {background:#C5000C;}
.sp_input {width:360px;padding:8px;font-size:16px;border:#E11111 2px solid;color:#666666;}
.rank_box {padding:16px 0;}
.rank_head {padding:0 0 0 5px;height:32px;line-height:32px;overflow:hidden;border-bottom:#CCCCCC 1px dotted;font-weight:bold;font-size:14px;margin:0 0 8px 0;}
.new_head {padding:0 0 0 10px;height:22px;line-height:22px;font-weight:bold;font-size:13px;color:#FFFFFF;background:#F8B003;}
.new_body {padding:8px 16px;background:#FFFFFF;border:#F8B003 1px solid;}
.new_body li {height:25px;line-height:25px;overflow:hidden;background:url('spread_li.gif') no-repeat 0 5px;padding:0 0 0 18px;}
.new_body li a {font-size:13px;}
.new_price {color:#F43111;font-weight:bold;}
.body_n {padding:5px 5px 0 5px;}
.head_n {background:#F43111;line-height:22px;height:22px;font-weight:bold;padding:0 0 0 10px;color:#FFFFFF;}
.h_box {padding:0 15px 10px 15px;}
.head_h {background:#F3B200;line-height:22px;height:22px;padding:2px 10px 0 10px;color:#FFFFFF;}
.body_h {padding:5px 5px 0 5px;}
.body_h li {height:22px;line-height:22px;overflow:hidden;}
.norecord {padding:20px 0 20px 0;text-align:center;color:#666666;}
.buy_head {margin:15px 0 0 0;padding:0 0 0 10px;height:24px;line-height:24px;font-weight:bold;font-size:13px;color:#FFFFFF;background:#F8B003;}
.buy_body {padding:8px 15px 8px 15px;background:#FFFFFF;border:#F8B003 1px solid;}
.buy_submit {background:#006699;color:#FFFFFF;padding:2px;font-size:13px;font-weight:bold;}
.buy_login {padding:30px 0 50px 20px;font-size:13px;}
.list_tb {}
.list_tb h1 {padding:16px 0;font-size:14px;text-align:center;}
.list_tb table {background:#FFFFFF;width:100%;}
.list_tb th {background:#F1F1F1;}
.list_dl {background:url('dot.gif') repeat-x 0 center;}

/* ============================================================
   extend 单页两栏重排（webpage / guestbook / vote 等共用骨架）

   旧骨架：.m1l 固定 960px + .m1r 固定 250px（style.css 第 33~35 行），
   是为 1220px 老容器设计的。本站 --f-content 已提到 1560px，
   于是两栏之间空出约 300px 死区，右栏又只有几百像素高，
   长正文滚动时右列整片留白 —— 版面失衡。
   改为：栅格 1fr + 348px、右栏吸顶跟随。
   ============================================================ */
.m.m1{
	display: grid;
	grid-template-columns: minmax(0, 1fr) 348px;
	gap: 24px;
	align-items: start;
	background-image: none !important;   /* 去掉旧 960px 处的竖分隔线 */
	background-color: transparent !important;
	overflow: visible;
}
.m.m1 > .m1l{ width: auto; float: none; min-width: 0; }
.m.m1 > .m1r{ width: auto; float: none; }

/* —— 右栏：吸顶跟随，长文滚动时不再留白 —— */
.m.m1 > .m1r.side{
	position: sticky;
	top: 58px;                            /* .head 顶条 sticky 高 44px + 呼吸 */
	padding: 0 0 12px;
	background: var(--f-card-3) !important;
	box-shadow: var(--f-shadow) !important;
}
.m.m1 > .m1r.side > .side-hd{
	margin: 0;
	padding: 16px 20px 13px;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 1px;
	color: var(--f-ink);
	border-bottom: 1px solid var(--f-line);
}
/* 注：guestbook 侧栏项 id 为 type_*，带 style.css 的图标底图，
   保留其原生外观不动，只改造 webpage 等无图标项。 */
.m.m1 > .m1r.side > ul{ margin: 0; padding: 8px 0 0; list-style: none; }
.m.m1 > .m1r.side .side_li:not([id^="type_"]),
.m.m1 > .m1r.side .side_on:not([id^="type_"]){
	height: auto; line-height: 1.5; padding: 0;
	margin: 2px 10px; border-radius: 12px; overflow: visible;
}
.m.m1 > .m1r.side .side_li:not([id^="type_"]) > a,
.m.m1 > .m1r.side .side_on:not([id^="type_"]) > a{
	display: block; width: auto; box-sizing: border-box;
	position: relative; padding: 11px 14px 11px 32px;
	font-size: 15.5px; font-weight: 600; color: var(--f-ink2);
	border-radius: 12px; transition: background .18s, color .18s;
}
.m.m1 > .m1r.side .side_li:not([id^="type_"]) > a::before{
	content: ""; position: absolute; left: 14px; top: 50%; margin-top: -3px;
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--f-ink4); transition: transform .18s, background .18s, height .18s, margin-top .18s;
}
.m.m1 > .m1r.side .side_li:not([id^="type_"]) > a:hover{ background: rgba(61,214,140,.10); color: var(--f-p2); }
.m.m1 > .m1r.side .side_li:not([id^="type_"]) > a:hover::before{ background: var(--f-p1); transform: scale(1.35); }
.m.m1 > .m1r.side .side_on:not([id^="type_"]) > a{
	background: linear-gradient(135deg, rgba(61,214,140,.20), rgba(43,182,115,.10));
	color: var(--f-p2) !important; font-weight: 800;
	box-shadow: inset 0 0 0 1px rgba(61,214,140,.30);
}
.m.m1 > .m1r.side .side_on:not([id^="type_"]) > a::before{
	left: 13px; width: 6px; height: 16px; margin-top: -8px; border-radius: 3px; background: var(--f-p1);
}

/* —— 左栏：加宽后给足内边距，正文限制最大行宽 —— */
.m.m1 > .m1l > .title{ text-align: left; padding: 24px 40px 18px; }
.m.m1 > .m1l > .content{ padding: 26px 40px 30px; font-size: 16.5px; }
.m.m1 > .m1l > .content > p{ max-width: 1010px; }
.m.m1 > .m1l > .content > p:has(img),
.m.m1 > .m1l > .content > p:has(table),
.m.m1 > .m1l > .content > p:has(iframe){ max-width: none; }
.m.m1 > .m1l > .content > p > img:only-child{ display: block; margin: 0 auto; border-radius: 14px; }
.m.m1 > .m1l > .content img{ border-radius: 12px; }

@media (max-width: 1320px){
	.m.m1{ grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; }
	.m.m1 > .m1r.side .side_li > a,
	.m.m1 > .m1r.side .side_on > a{ font-size: 14.5px; }
}
@media (max-width: 1000px){
	.m.m1{ grid-template-columns: minmax(0, 1fr); gap: 14px; }
	/* 窄屏：右侧导航改为横向胶囊条，置于正文之前 */
	.m.m1 > .m1r.side{
		position: static; order: -1; padding: 10px 12px;
	}
	.m.m1 > .m1r.side > .side-hd{ padding: 2px 6px 10px; border-bottom: 0; }
	.m.m1 > .m1r.side > ul{
		display: flex; gap: 8px; overflow-x: auto; padding: 0 0 2px;
		-webkit-overflow-scrolling: touch; scrollbar-width: none;
	}
	.m.m1 > .m1r.side > ul::-webkit-scrollbar{ display: none; }
	.m.m1 > .m1r.side .side_li:not([id^="type_"]),
	.m.m1 > .m1r.side .side_on:not([id^="type_"]){ margin: 0; flex: 0 0 auto; }
	.m.m1 > .m1r.side .side_li:not([id^="type_"]) > a,
	.m.m1 > .m1r.side .side_on:not([id^="type_"]) > a{
		padding: 9px 15px; font-size: 14px; font-weight: 600;
		white-space: nowrap; box-shadow: none; background: rgba(18,51,42,.05);
	}
	.m.m1 > .m1r.side .side_on:not([id^="type_"]) > a{ background: rgba(61,214,140,.20); }
	.m.m1 > .m1r.side .side_li:not([id^="type_"]) > a::before,
	.m.m1 > .m1r.side .side_on:not([id^="type_"]) > a::before{ display: none; }
	/* guestbook 等带图标项在横向条里去掉底图与缩进，统一为胶囊 */
	.m.m1 > .m1r.side .side_li[id^="type_"],
	.m.m1 > .m1r.side .side_on[id^="type_"]{
		background-image: none !important; padding: 0 !important;
		height: auto !important; line-height: 1.5 !important; margin: 0; flex: 0 0 auto;
	}
	.m.m1 > .m1r.side .side_li[id^="type_"] > a,
	.m.m1 > .m1r.side .side_on[id^="type_"] > a{
		width: auto; padding: 9px 15px; font-size: 14px; white-space: nowrap; border-radius: 999px;
	}
	.m.m1 > .m1l > .content > p{ max-width: none; }
}
@media (max-width: 620px){
	.m.m1 > .m1l > .title{ padding: 18px 18px 14px; font-size: 20px; }
	.m.m1 > .m1l > .content{ padding: 18px 18px 22px; font-size: 16px; }
}