@charset "utf-8";

html	{ height: 100%; overflow: hidden; }
body	{ margin: 0; padding: 0; background: #dffdff; font-family: 'Century Gothic', 'Lucida Grande', 'Microsoft JhengHei', '微軟正黑體', Tahoma, PMingLiu; height: 100%; color: #666; }
table	{ font-family: 'Century Gothic', 'Lucida Grande', 'Microsoft JhengHei', Tahoma, PMingLiu; }
a			{ outline: 0; color: #66f; }
a:hover		{ text-decoration: none; color: #f60; }
img			{ border: 0; }
form		{ display: inline; }

input.input, input.button, select, textarea		{ background: #eee; font-family: 'Century Gothic', 'Lucida Grande', 'Microsoft JhengHei', '微軟正黑體', Tahoma, PMingLiu; font-size: 12px; border-top: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; color: #666; }
input.button	{ cursor: pointer; }
input.hide, textarea.hide	{ color: #eee; }

.keyword	{ color: #c6a; }
.keyword1	{ color: #f66; }
.keyword2	{ color: #66f; }
.keyword3	{ color: #282; }
.keyword4	{ color: #660; }
.keyword5	{ color: #000; }
.jpn	{ font-family: 'Century Gothic', 'メイリオ', Verdana, MS Gothic; }
.cen	{ text-align: center; }
.alt	{ display: none; }
.clr	{ clear: both; overflow: hidden; height: 1px; }

.basic		{ color: #39f; }
.fuuko		{ color: #875; }
.pink		{ color: #c6c; }
.clover		{ color: #282; }
.error		{ color: #f00; }
.js_on, .js_in	{ display: none; }

ul li.f1					{ background-image: url(../images/icon_f1.gif); padding-left: 20px; }
ul li.f2					{ background-image: url(../images/icon_f2.gif); padding-left: 20px; }
ul li.f3					{ background-image: url(../images/icon_f3.gif); padding-left: 20px; }
ul li.f4					{ background-image: url(../images/icon_f4.gif); padding-left: 20px; }

h1			{ position: absolute; margin: 0; padding: 0; background: url(../images/banner.gif) no-repeat; left: 30%; bottom: 70px; z-index: 5; }
h1 a		{ display: block; width: 500px; height: 110px; }

div.white						{ position: absolute; width: 55%; height: 100%; background: url(../images/main/mid_lef.gif) #fff repeat-y left; top: 0; left: 20%; z-index: 1; }
div.white div.mid				{ position: relative; background: url(../images/main/mid_rig.gif) repeat-y right; width: 100%; height: 100%; }
div.white div.mid div			{ position: absolute; width: 117px; height: 45px; top: 65px; right: 15px; }
div.white div.mid div.onpu		{ background: url(../images/onpu.gif) no-repeat; width: 388px; height: 44px; top: auto; bottom: 215px; left: 20px; }
div.white div.bg_news			{ background: url(../images/bg/news.gif) #fff no-repeat; }
div.white div.bg_talk			{ background: url(../images/bg/talk.gif) #fff no-repeat; }
div.white div.bg_html			{ background: url(../images/bg/html.gif) #fff no-repeat; }
div.white div.bg_soft			{ background: url(../images/bg/soft.gif) #fff no-repeat; }
div.white div.bg_guest			{ background: url(../images/bg/guest.gif) #fff no-repeat; }
div.white div.bg_link			{ background: url(../images/bg/link.gif) #fff no-repeat; }
div.white div.bg_other			{ background: url(../images/bg/other.gif) #fff no-repeat; }
div.hind div.top				{ position: absolute; background: url(../images/main/top_min.gif) #dffdff repeat-x bottom; width: 55%; height: 65px; left: 20%; z-index: 3; }
div.hind div.top div.lef		{ background: url(../images/main/top_lef.gif) no-repeat bottom; width: 15px; height: 65px; float: left; }
div.hind div.top div.rig		{ background: url(../images/main/top_rig.gif) no-repeat bottom; width: 15px; height: 65px; float: right; }
div.hind div.bot				{ position: absolute; background: url(../images/main/bot_min.gif) #dffdff repeat-x top; width: 55%; height: 15px; left: 20%; bottom: 200px; z-index: 3; }
div.hind div.bot div.lef		{ background: url(../images/main/bot_lef.gif) no-repeat; width: 15px; height: 15px; float: left; }
div.hind div.bot div.rig		{ background: url(../images/main/bot_rig.gif) no-repeat; width: 15px; height: 15px; float: right; }
div.search						{ position: absolute; width: 55%; height: 50px; left: 20%; z-index: 4; }
div.search div					{ float: right; }
div.search div span				{ line-height: 20px; float: left; }
div.search div span.keyword		{ padding: 15px; background: url(../images/keyword.gif) no-repeat; }
div.search div span.search		{ padding: 0; background: url(../images/search.gif) no-repeat; }
div.search div input.input		{ background: transparent; border: 0; width: 170px; height: 20px; }
div.search div input.button		{ background: transparent; border: 0; width: 90px; height: 50px; text-indent: -10000px; }

div.menu				{ position: absolute; left: 0; width: 20%; z-index: 10; }
div.menu ul				{ position: relative; margin: 0; padding: 0; list-style-type: none; width: 100%; left: 0; top: 0; }
div.menu ul li			{ position: absolute; margin: 0; padding: 0; }
div.menu ul li a		{ display: block; width: 150px; height: 50px; }
div.menu ul li.news		{ background: url(../images/button/news.gif); right: 30px; top: 30px; }
div.menu ul li.talk		{ background: url(../images/button/talk.gif); right: 20px; top: 85px; }
div.menu ul li.html		{ background: url(../images/button/html.gif); right: 10px; top: 140px; }
div.menu ul li.soft		{ background: url(../images/button/soft.gif); right: 20px; top: 195px; }
div.menu ul li.guest	{ background: url(../images/button/guest.gif); right: 30px; top: 250px; }
div.menu ul li.link		{ background: url(../images/button/link.gif); right: 20px; top: 305px; }
div.menu ul li.other	{ background: url(../images/button/other.gif); right: 10px; top: 360px; }
div.menu ul li.on		{ right: -150px; top: 0; }

div.count				{ position: absolute; width: 23%; right: 20px; top: 20px; z-index: 10; }
div.count ul			{ margin: 0; padding: 30px 0 0 80px; background: url(../images/count.gif) no-repeat 20px top; list-style-type: none; }
div.count ul li			{ margin: 0; padding: 0; font-size: 12px; line-height: 20px; }
div.count ul li span	{ color: #66f; }

div.newres				{ position: absolute; width: 23%; right: 20px; top: 130px; z-index: 10; }
div.paint				{ display: none; }
div.paint ul			{ margin: 0; padding: 33px 0 0 40px; background: url(../images/paint.gif) no-repeat 20px top; list-style-type: none; }
div.paint ul li			{ margin: 0; padding: 0; font-size: 12px; text-align: center; white-space: nowrap; overflow: hidden; line-height: 20px; width: 180px; }
div.paint ul li a		{ margin: 0 auto; padding: 0; background: no-repeat center; display: block; width: 120px; height: 120px; }

div.reslute h3			{ margin: 0 0 5px 10px; padding: 0; background: url(../images/reslute.gif) no-repeat; width: 180px; height: 50px; }
div.reslute ul			{ margin: 0 0 20px; padding: 0; list-style-type: none; }
div.reslute ul li		{ margin: 0 0 0 30px; padding: 0 0 0 20px; background-repeat: no-repeat; background-position: 3px 3px; }

div.center						{ position: absolute; width: 100%; height: 100%; overflow: scroll; z-index: 2; }
div.center div.left				{ position: absolute; left: 20%; width: 55%; overflow: hidden; }
div.center div.left div.ind		{ width: 100%; }
div.center div.left div.ins		{ margin: 65px 20px 220px 30px; }
div.center h3							{ margin: 0 0 10px; padding: 14px 0 16px 50px; background: url(../images/line.gif) no-repeat left bottom; font-size: 18px; font-weight: normal; color: #600; }
div.center div.line					{ margin: 0 0 0 4px; padding: 0; border: 0; background: url(../images/line1.gif) no-repeat left center; width: 348px; height: 55px; clear: both; }
div.center div.textbox					{ padding: 0 20px 20px; }
div.center div.textbox div.sub			{ padding: 0 0 10px 20px; font-size: 11px; color: #aaa; }
div.center div.textbox h4				{ margin: 0; padding: 0; font-size: 15px; font-weight: normal; white-space: nowrap; overflow: hidden; }
div.center div.textbox p				{ margin: 0; padding: 0 0 10px; }
div.center div.textbox ul				{ margin: 0; padding: 0; list-style-type: none; }
div.center div.textbox ul li			{ margin: 0; padding: 0 0 10px 20px; background-repeat: no-repeat; background-position: 3px 4px; }
div.center div.textbox ul li a.sample	{ padding: 0 0 0 20px; background: url(../images/image.php?pnt=parts/dir.gif) no-repeat 0 1px; }
div.center div.textbox ul li div.logo	{ margin: 0 0 5px; font-size: 15px; }
div.center div.textbox ul li div.logo a	{ text-decoration: none; }
div.center div.textbox ul li div.logo img	{ margin: 0 10px 0 0; vertical-align: middle; }
div.center div.textbox ul li.icon		{ padding: 0 20px; }
div.center div.textbox ul li.soft		{ padding: 0 0 5px 20px; margin: 0; }
div.center div.textbox ul li.soft img	{ vertical-align: middle; }
div.center div.textbox ul li.addthis	{ float: left; }
div.center div.textbox ul li.mail		{ float: left; }
div.center div.textbox ul li.mail a	{ padding: 0 0 0 20px; background: url(../images/mail.gif) no-repeat; }
div.center div.textbox ul li.home		{ float: left; }
div.center div.textbox ul li.home a	{ padding: 0 0 0 20px; background: url(../images/home.gif) no-repeat; }
div.center div.textbox ul li.edit		{ position: relative; padding: 0 0 0 40px; background: url(../images/edit.gif) no-repeat 20px 1px; float: left; }
div.center div.textbox ul li.edit div	{ position: absolute; display: block; white-space: nowrap; top: 0; }
div.center div.textbox ul li.edit input	{ vertical-align: middle; }
div.center div.textbox ul.list li		{ padding: 4px 5px; border-bottom: 1px dashed #ccc; clear: left; }
div.center div.textbox ul.list li.pgjp	{ border: 0; text-align: right; }
div.center div.textbox ul.list li.pgjp b	{ color: #f66; }
div.center div.textbox ul.list li.cate	{ padding: 2px 0; }
div.center div.textbox ul.list span.date	{ padding: 0 5px; overflow: hidden; white-space: nowrap; font-family: 'Century Gothic', Tahoma; font-size: 11px; line-height: 20px; text-align: right; width: 100px; float: right; color: #aaa; }
div.center div.textbox ul.list span.name	{ padding: 0 5px; overflow: hidden; white-space: nowrap; width: 20%; float: right; }
div.center div.textbox ul.res			{ margin: 10px 0; }
div.center div.textbox ul.res li		{ padding: 0 0 2px 20px; }
div.center div.textbox ul.res div.smiley img	{ border: 0; vertical-align: middle; }
div.center div.textbox ul.res textarea	{ vertical-align: top; }
div.center div.textbox ul.res a#sec_code		{ padding: 2px 0 2px 82px; background: url(../images/security.php) no-repeat left center; }
div.center div.textbox ul#soft			{ margin: 3px 0 0; }
div.center div.textbox ul#soft li		{ margin: 0; padding: 0 0 3px 22px; }
div.center div.textbox ul#soft li#dl	{ background-image: url(../images/image.php?pnt=parts/dl.gif); }
div.center div.textbox ul#soft li#bt	{ background-image: url(../images/image.php?pnt=parts/bt.gif); }
div.center div.textbox ul#soft li#em	{ background-image: url(../images/image.php?pnt=parts/em.gif); }
div.center div.textbox ul#guest		{ margin: 3px 0 0; }
div.center div.textbox ul#guest li		{ margin: 0 0 3px 28px; padding: 0; list-style-type: circle; color: #39f; }
div.center div.textbox ul#guest li div	{ color: #666; }
div.center div.textbox textarea#mylink_tag		{ overflow: hidden; width: 220px; height: 85px; }
div.center div.resform					{ float: left; }
div.center div.chaform					{  }
div.center div.chaform ul.res			{ margin: 0 20px 10px; float: left; }
div.center div.chaform ul.res li		{ white-space: nowrap; }
div.center div.chaform div.cha			{ margin: 0 30px; }
div.center div.chaform div.guest_cha	{ padding: 0 15px 5px 0; float: right; }
div.center img.sec						{ vertical-align: middle; display: inline-block; }
div.center ul.list li.cate div			{ padding: 2px 5px; float: left; width: 120px; }
div.center ul.list li.cate div.on		{ background: #ffc; }
div.center ul.list li.cate div.clr		{ border: 0; padding: 0; float: none; }
div.center ul.bktop						{ margin: 0; padding: 0; list-style-type: none; float: right; }
div.center ul.bktop li					{ margin: 0; padding: 0 5px 0 20px; background-repeat: no-repeat; background-position: 3px 3px; float: left; }

/*訪客留言紙娃娃*/
div.center div.left div.guest_cha			{ padding: 0 15px 5px 20px; width: 188px; float: left; }
div.center div.left div.guest_nam			{ text-align: center; }
div.center div.left div.guest_bor			{ position: relative; padding: 3px; border: 1px solid #ddd; width: 180px; height: 150px; }
div.center div.left div.guest_bg			{ position: absolute; width: 180px; height: 150px; background: no-repeat center; z-index: 1; }
div.center div.left div.guest_cart			{ position: absolute; width: 180px; height: 150px; background: no-repeat center; z-index: 2; }
div.center div.left div.guest_body			{ position: absolute; width: 180px; height: 150px; background: no-repeat center; z-index: 3; }
div.center div.left div.guest_head			{ position: absolute; width: 100px; height: 110px; background: no-repeat center; z-index: 4; left: 48px; top: 8px; }
div.center div.left div.guest_helm_bot		{ position: absolute; width: 100px; height: 110px; background: no-repeat center; z-index: 5; left: 48px; top: 5px; }
div.center div.left div.guest_helm_mid		{ position: absolute; width: 100px; height: 110px; background: no-repeat center; z-index: 6; left: 48px; top: 5px; }
div.center div.left div.guest_helm_top		{ position: absolute; width: 100px; height: 110px; background: no-repeat center; z-index: 7; left: 48px; top: 5px; }

div.center div.right			{ position: absolute; right: 0; top: 120px; width: 23%; z-index: 3; }
div.center div.right h3			{ margin: 0; padding: 0; width: 180px; height: 50px; }
div.center div.right h3.res		{ background: url(../images/res.gif) no-repeat; }

div.footer				{ position: absolute; width: 100%; bottom: 0; right: 20px; z-index: 3; display: block; overflow: hidden; }
div.footer div.main		{ position: relative; background: url(../images/bg.gif) #dffdff repeat-x bottom; margin: 0 0 0 20px; height: 201px; }
div.footer div.left		{ position: absolute; background: url(../images/left.gif) no-repeat; width: 497px; height: 200px; left: 0; }
div.footer div.right	{ position: absolute; background: url(../images/right.gif) no-repeat; width: 258px; height: 200px; right: 0; }
div.footer div.bottom	{ position: absolute; right: 10px; bottom: 5px; }
div.footer div.bottom ul	{ margin: 0; padding: 0; display: inline; list-style-type: none; font-size: 11px; line-height: 20px; }
div.footer div.bottom ul li	{ margin: 0; padding: 0 10px; border-right: 1px solid #000; display: inline; }
div.footer div.bottom ul li img	{ position: relative; top: 3px; }
div.footer a				{ color: #262; }
div.footer div#bottom_left			{ position: absolute; left: 0; bottom: 4px; }
div.footer div#bottom_left h3		{ margin: 0; padding: 0 10px; font-weight: normal; font-size: 12px; line-height: 20px; display: inline; }
div.footer div#bottom_left ul		{ position: absolute; margin: 0; padding: 0; list-style-type: none; bottom: 25px; left: -10px; }
div.footer div#bottom_left ul li	{ margin: 0; padding: 0 10px; display: none; font-size: 11px; line-height: 20px; font-family: 'Century Gothic', Tahoma; width: 120px; }

div.footer h4			{ margin: 0; padding: 0 10px; display: inline; font-weight: normal; font-size: 11px; line-height: 20px; text-align: right; color: #262; }

div#fuusen div	{ position: absolute; z-index: 100; left: -10000px; overflow: hidden; width: 30px; height: 78px; }
div#fuusen_00	{ background: url(../images/fu01.gif) no-repeat top; }
div#fuusen_01	{ background: url(../images/fu02.gif) no-repeat top; }
div#fuusen_02	{ background: url(../images/fu03.gif) no-repeat top; }
div#fuusen_03	{ background: url(../images/fu04.gif) no-repeat top; }

/*JSSC*/
div.center div.left div.ins  div.textbox div.jssc				{ margin: 5px 0 10px; padding: 1px 2px 1px 5px; background: #fff; border: 1px solid #ddd; font-size: 11px; line-height: 20px; font-family: "Courier New",Courier; overflow: auto; }
div.center div.left div.ins div.textbox div.jssccodetitle		{ font-size: 11px; line-height: 20px; font-family: Verdana; font-weight: bold; color: #79a; }
div.center div.left div.ins div.textbox div.jssccodetitle span	{ margin: 0 0 0 30px; font-weight: normal; text-decoration: underline; cursor: pointer; }
div.center div.left div.ins div.textbox div.jssccodetitle img	{ border: 0; }
div.center div.left div.ins div.textbox div.jssc ol			{ margin: 0; padding: 0; list-style: decimal outside; line-height: 180%; color: #369; }
div.center div.left div.ins div.textbox div.jssc ol .on_line	{ background: #ffc; color: #666; }
div.center div.left div.ins div.textbox div.jssc ol div		{ color: #666; padding: 0 0 0 10px; }
div.center div.left div.ins div.textbox div.jssc ol li			{ margin: 0; padding: 0; background: #fff; border: 0; color: #666; }
div.center div.left div.ins div.textbox div.jssc ol li.alt		{ background: #eef7ff; display: list-item; }

.jssc .javascriptcomment, .jssc .javacomment, .jssc .ccomment, .jssc .cppcomment, .jssc .phpcomment, .jssc .csharpcomment, .jssc .vbcomment, .jssc .rubycomment, .jssc .delphicomment, .jssc .sqlcomment, .jssc .actionscriptstring, .jssc .xhtmlcomment, .jssc .xmlcomment, .jssc .pythoncomment, .jssc .htmlcomment, .jssc .csscomment { color: #696; }
.jssc .javastring, .jssc .ckeywords, .jssc .cppkeywords, .jssc .phpkeywords, .jssc .csharpkeywords, .jssc .vbkeywords, .jssc .rubykeywords, .jssc .delphikeywords, .jssc .sqlkeywords, .jssc .actionscriptkeywords, .jssc .xmlkeywords, .jssc .pythonkeywords { color: #cae; }
.jssc .javachar, .jssc .cchar, .jssc .cppchar, .jssc .phpchar, .jssc .rubychar, .jssc .actionscriptchar, .jssc .xhtmlchar, .jssc .xmlchar, .jssc .csschar { color: #e9a; }
.jssc .javascriptstring, .jssc .javascriptchar, .jssc .javascriptnum, .jssc .javanum, .jssc .cstring, .jssc .cppstring, .jssc .phpstring, .jssc .rubystring, .jssc .delphistring, .jssc .sqlstring, .jssc .actionscriptnum, .jssc .xhtmlstring, .jssc .xmlstring, .jssc .pythonstring, .jssc .htmlstring, .jssc .htmlchar, .jssc .cssnum, .jssc .cssstring { color: #f66; }
.jssc .cnum, .jssc .cppnum, .jssc .phpnum, .jssc .csharpnum, .jssc .vbnum, .jssc .delphinum, .jssc .sqlnum, .jssc .rubynum, .jssc .pythonnum, .jssc .xhtmlnum, .jssc .htmlnum { color: #a36; }
.jssc .javakeywords, .jssc .javascriptkeywords, .jssc .actionscriptkeywords, .jssc .phpvariables, .jssc .rubyvariables, .jssc .csskeywords, .jssc .xhtmlvariables, .jssc .xmlvariables, .jssc .htmlvariables, .jssc .htmlkeywords, .jssc .xhtmlkeywords { color: #66f; font-weight: bold; }
.jssc .csharpstring, .jssc .vbstring, .jssc .rubysymbol { color: #900; }
.jssc .csharpregion, .jssc .vbregion, .jssc .actionscriptcomment { color: #666; }
.copy_ico { margin: 0 0 0 5px; border: 0; cursor: pointer; }

/*ChgSel*/
div.center div.left div.ins div.textbox div.chgsel						{ line-height: 14px; font-family: 'Century Gothic', 'Lucida Grande', 'Microsoft JhengHei', '微軟正黑體', Tahoma, PMingLiu; font-size: 12px; }
div.center div.left div.ins div.textbox div.chgsel a					{ background: #eee; padding: 2px 5px; display: block; text-decoration: none; color: #666; }
div.center div.left div.ins div.textbox div.chgsel a:hover				{ background: #ffe; color: #77f; }
div.center div.left div.ins div.textbox div.chgsel div.chgselfloat		{ margin-top: -2px; display: inline; }
div.center div.left div.ins div.textbox div.chgsel div.chgseltitle		{ border: 1px solid #fff; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; white-space: nowrap; }
div.center div.left div.ins div.textbox div.chgsel ul.chgselul			{ padding: 0; margin: 0; background: #eee; border: 1px solid #fff; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; list-style-type: none; }
div.center div.left div.ins div.textbox div.chgsel ul.chgselul li		{ padding: 0; margin: 0; }