﻿/* ---reset.css--- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* ---reset.css--- */

html { font-family: "微軟正黑體", Arial; font-size:16px; -webkit-text-size-adjust:none;}

* { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */}
	
* a:link, * a:visited { text-decoration:none; color:#336699;}

* a:hover, * a:active { text-decoration:none; color:#666;}

.clear { clear:both;}

.tRed { color:#C00;}
.tWhite { color:#fff;}

.txt319 { color:#000;}
.bgt319 { background:#000;}

br {display: block; /* makes it have a width */
            content: ""; /* clears default height */
            margin: 0 0 5px 0; /* change this to whatever height you want it */}
			
br.f {display: block; /* makes it have a width */
            content: ""; /* clears default height */
            margin: 0 0 2px 0; /* change this to whatever height you want it */}
p { margin-bottom:30px;}
.box { background: #F6F6F6; padding: 35px; padding-top:-20px;}
.boxTitle { font-size:1.12em; display:block; margin: 15px 0; color:#005aaa; line-height: 24px}

/* --電腦版型------------------------------------- */

body { background: url(../images/mainBG.jpg) no-repeat center top;}
body.in { background: url(../images/mainBG-M.jpg) no-repeat center top;}

header { width:1250px; margin: 0 auto; position:relative; height:605px;}
header.in { width:1000px; margin: 0 auto; position:relative; height:310px;}

/* -- 首頁標題logo -- */
#logo { position:absolute; top:40px; right:0;}
#logo-in { position:absolute; top:40px; left:0;}
#bookH { position:absolute; top:120px; left:459px; border:#fff 3px solid; -webkit-box-shadow: 0 0 20px #797979; -moz-box-shadow: 0 0 20px #797979; box-shadow: 0 0 20px #797979;}
#bookIn { position:absolute; top:45px; left:460px; border:#fff 2px solid; -webkit-box-shadow: 0 0 20px #797979;	-moz-box-shadow: 0 0 20px #797979; box-shadow: 0 0 20px #797979;}
#bookIn img { width:195px; height:auto;}
#nameC { position:absolute; top:286px; right:0;}
#nameC-in { width:320px; position:absolute; top:115px; right:0;}
#nameE { position:absolute; top:425px; right:0;}
#nameE-in { width:320px; position:absolute; top:229px; right:0;}
#nameC-in img,
#nameE-in img { width:100%; height:auto;}

#Vol { position:absolute; left:0; top:275px; font-weight:bold;}
#Vol-in { position:absolute; left:0; top:182px; font-weight:bold;}
#Vol .no, #Vol-in .no { font-size:2em;}
#Vol .periods, #Vol-in .periods { font-size:2.8em;}
#Vol .date, #Vol-in .date { font-size:1.5em;}

#coverStory { position:absolute; left:-1px; top:343px; font-weight:bold; letter-spacing:-1px; color:#fff;}
#coverStory .t24 { font-size:1.5em; display:block; margin-bottom:10px;}
#coverStory .t40 { font-size:2.5em;}
.txt12 { font-size:0.75em; color:#666;}
.txt22 { font-size:1.25em; color:#666; display:block; margin: 5px 0 0 0;}
h2 { font-size:1.87em; font-weight:bold; display:block; margin: 45px 0 15px 0; color:#587abc; line-height: 36px}
h2 b { font-weight:bold; display:block; margin: 10px 0 15px 0; color:#000; line-height: 36px}
h3 { font-size:1.12em; display:block; margin: 45px 0 15px 0; color:#f7931d; line-height: 24px; font-weight:bold;}
h3 b { font-size: 1.37em; display:block; margin: 5px 0 0 0; color:#005aaa}

#fontTxt { position:absolute; left:0; top:435px; width:385px; font-size:15px; line-height:23px; color:#7b7b7b; text-align:justify;}

#homeList { width:1250px; margin: 0 auto; position:relative;}
#homeList ul { width:100%;}
#homeList ul li { display:block; margin-bottom:50px;}
#homeList ul li a img { float:left; margin: 0 40px 0 0; padding: 0 45px 0 0; border-right: #CCC 1px solid; opacity:0.8; filter:alpha(opacity=80);}
#homeList ul li:hover a img { float:left; margin: 0 40px 0 0; padding: 0 45px 0 0; border-right: #CCC 1px solid; opacity:1.0; filter:alpha(opacity=100);}
#homeList ul li a .item { font-size:1em; display:block; margin: 0 0 5px 0; color:#333;}
#homeList ul li a .subTitle { font-size:1.5em; display:block; margin: 0 0 5px 0; color:#231f20;}
#homeList ul li a .mainTitle { font-size:2.25em; margin: 0 0 15px 0; font-weight:bold; display:block;}
#homeList ul li:hover a .mainTitle { font-size:2.25em; margin: 0 0 15px 0; font-weight:bold; display:block; color:#900}
#homeList ul li a .more { background:url(../images/icon_more.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; margin: 0 0 0 470px;}
#homeList ul li:hover a .more { background:url(../images/icon_more.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}

ul.inList { width:100%;}
ul.inList li { display:block; margin-bottom:50px;}
ul.inList li a img { float:left; margin: 0 30px 0 0; padding: 0 30px 0 0; border-right: #CCC 1px solid; width:300px; height:auto; opacity:0.8; filter:alpha(opacity=80);}
ul.inList li:hover a img { float:left; margin: 0 30px 0 0; padding: 0 30px 0 0; border-right: #CCC 1px solid; width:300px; height:auto; opacity:1.0; filter:alpha(opacity=100);}
ul.inList li a .item { font-size:0.81em; display:block; margin: 0 0 5px 0; color:#333;}
ul.inList li a .subTitle { font-size:1em; display:block; margin: 0 0 5px 0; color:#8a8a8a;}
ul.inList li a .mainTitle { font-size:1.5em; margin: 0 0 15px 0; font-weight:bold; display:block;}
ul.inList li:hover a .mainTitle { font-size:1.5em; margin: 0 0 15px 0; font-weight:bold; display:block; color:#900}
ul.inList li a .more { background:url(../images/icon_more.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; margin: -20px 0 0 0; float:right;}
ul.inList li:hover a .more { background:url(../images/icon_more.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}
.moreTitle { width:100%; text-align:center; color: #333; margin: 0 0 25px 0; font-size:18px; font-weight:bold;}

a.back { background:url(../images/icon_back.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; position:absolute; right:0; bottom:0;}
a.back:hover { background:url(../images/icon_back.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}

article { width:1000px; margin:0 auto;}
h1 { display:block; margin: 20px 0 0 0;}
#fontCon { font-size:15px; line-height:26px; color:#000; padding:20px 30px; margin: 0 0 20px 0; width:100%; background:#F6F6F6; text-align:left; clear:both;}
.itemIn { float:left; margin: 0 15px 40px 0; border-right: #CCC 1px solid; padding: 0 15px 0 0; height:80px; color:#333;}
#inContent { clear:both; margin:30px 0; text-align:justify; text-justify: inter-ideograph; font-size:1.12em; line-height:30px; padding-bottom:30px; border-bottom:#999 1px dotted;}
.storyTitle { font-size:1.75em; color:#231f20; letter-spacing:-1px;}
.storyTitle b { font-size:42px; font-weight:bold; display:block; margin: 5px 0 0 0;}
#editor { text-align:right; font-size:0.93em; color:#666; margin: 15px 0 0 0;}

.picFull { width:100%; margin: 0 0 55px 0;}
.picLeft { margin: 0 40px 0 0; width:40%; float:left; padding-bottom:30px;}
.picRight { margin: 0 0 0 40px; width:40%; float: right; padding-bottom:30px;}
.picBox { margin: 0 0 0 40px; float: right; padding-bottom:30px;}
.picFull img,
.picLeft img,
.picRight img { width:100%; height:auto; display:block; margin-bottom:15px;}
.picBox img { width:auto; height:auto; margin-bottom:15px;}
.picLeft img.morepic,
.picRight img.morepic { width:100%; height:auto; display:block; margin: 40px 0 15px 0;}
.picTxt { font-size:0.81em; color:#999; line-height:22px; font-weight:bold; letter-spacing:1px; display:block;}

#moreList { background:#f6f6f6; width:100%; padding: 25px 0;}
.wide { width:1250px; margin: 0 auto;}
.wideIn { width:1000px; margin: 0 auto;}
#download { float:left; width:382px;}
#downloadIn { float:left; width:300px;}
a.loadBtn { color:#fff; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 5px 0; width:100%; text-align:center; background:#000;}
a.loadBtn:hover { color:#ccc; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 5px 0; width:100%; text-align:center; background:#000;}
#moreArticle { float:right; width:66%;}
#moreArticle li { width: 48%; margin: 20px 2% 0 0; color:#CCC; display:inline-block; font-size:1em; padding: 0 0 0 20px; border-left: #CCC 1px solid; height:auto; vertical-align:top;}

/* -- Footer -- */
footer {
	width: 1250px;
	color: #999;
	text-align: center;
	margin: 30px auto;
	font-size: 13px;
	line-height: 20px;
}
footer img { display: inline-block; margin: 0 0 0 20px; float:right;}
#ITBS { float:left; font-size:14px; color:#333; line-height:20px; width:40%; text-align:left;}
#ITBS img { float:left; display:inline-block; margin: 0 15px 0 0; height:50px; width:auto;} 

/* --窄螢幕版型------------------------------------- */
@media screen and (min-width: 1024px) and (max-width: 1249px) {

body { background: url(../images/mainBG.jpg) no-repeat center -30px;}
body.in { background: url(../images/mainBG-M.jpg) no-repeat center top;}

header { width:96%; margin: 0 auto; position:relative; height:570px;}
header.in { width:96%; margin: 0 auto; position:relative; height:330px;}
#logo-in { position:absolute; top:30px; left:0; width:25%;}
#logo-in img { width:100%; height:auto;}
#bookH { position:absolute; top:60px; left:34%; border:#fff 3px solid; -webkit-box-shadow: 0 0 20px #797979; -moz-box-shadow: 0 0 20px #797979; box-shadow: 0 0 20px #797979; width:27%;}
#bookH img { width:100%; height:auto;}


#nameC { position:absolute; top:266px; right:0; width:360px;}
#nameC-in { width:30%; position:absolute; top:115px; right:0;}
#nameE { position:absolute; top:395px; right:0; width:360px;}
#nameE-in { width:30%; position:absolute; top:229px; right:0;}
#nameC img,
#nameE img,
#nameC-in img,
#nameE-in img { width:100%; height:auto;}

#Vol { position:absolute; left:2%; top:256px; font-weight:bold;}
#Vol-in { position:absolute; left:0; top:185px; font-weight:bold;}
#Vol .no, #Vol-in .no { font-size:2em;}
#Vol .periods, #Vol-in .periods { font-size:2.5em;}
#Vol .date, #Vol-in .date { font-size:1.5em;}

#coverStory { position:absolute; left:0; top:323px; font-weight:bold; letter-spacing:-1px;}
#coverStory .t24 { font-size:1.25em; display:block; margin-bottom:10px;}
#coverStory .t40 { font-size:2em;}
.txt12 { font-size:0.75em; color:#666;}
.txt22 { font-size:1.37em; color:#666; display:block; margin: 5px 0 0 0;}
h2 { font-size:1.87em; font-weight:bold; display:block; margin: 45px 0 15px 0;}
h3 { font-size:1.12em; display:block; margin: 45px 0 15px 0;}
h3 b { font-size: 1.37em; font-weight:bold; display:block; margin: 5px 0 0 0;}

#fontTxt { position: relative; left:0; top:485px; width:100%; font-size:16px; line-height:24px; color:#7b7b7b; text-align:justify; padding-bottom:15px;}

#homeList { width:96%; margin: 0 auto; position:relative;}
#homeList ul { width:100%;}
#homeList ul li { display:block; margin-bottom:50px;}
#homeList ul li a img { float:left; margin: 0 40px 0 0; padding: 0 45px 0 0; border-right: #CCC 1px solid; opacity:0.8; filter:alpha(opacity=80);}
#homeList ul li:hover a img { float:left; margin: 0 40px 0 0; padding: 0 45px 0 0; border-right: #CCC 1px solid; opacity:1.0; filter:alpha(opacity=100);}
#homeList ul li a .item { font-size:1em; display:block; margin: 0 0 5px 0; color:#333;}
#homeList ul li a .subTitle { font-size:1.5em; display:block; margin: 0 0 5px 0; color:#8a8a8a;}
#homeList ul li a .mainTitle { font-size:2.25em; margin: 0 0 15px 0; font-weight:bold; display:block;}
#homeList ul li:hover a .mainTitle { font-size:2.25em; margin: 0 0 15px 0; font-weight:bold; display:block; color:#900}
#homeList ul li a .more { background:url(../images/icon_more.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; margin: 0 0 0 470px;}
#homeList ul li:hover a .more { background:url(../images/icon_more.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}

#moreList { background:#f6f6f6; width:100%; padding: 25px 0;}
.wide { width:96%; margin: 0 auto;}
.wideIn { width:96%; margin: 0 auto;}
#download { float:left; width:26%; margin: 0 1%;}
#downloadIn { float:left; width:300px;}
a.loadBtn { color:#fff; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 5px 0; width:100%; text-align:center; background:#000;}
a.loadBtn:hover { color:#ccc; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 5px 0; width:100%; text-align:center; background:#000;}
#moreArticle { float:right; width:70%;}
#moreArticle li { width: 48%; margin: 20px 2% 0 0; color:#CCC; display:inline-block; font-size:1em; padding: 0 0 0 20px; border-left: #CCC 1px solid; height:auto;}

article { width:96%; margin:0 auto;}


/* -- Footer -- */
footer { width:98%; color: #999; text-align: right; margin:30px auto; font-size:13px; line-height:20px;}
footer img { display: inline-block; margin: 0 0 0 20px; float:right;}

}

/* --平板版型------------------------------------- */

@media screen and (min-width: 769px) and (max-width: 1023px) {

body { background: url(../images/mainBG.jpg) no-repeat center -90px;}
body.in { background: url(../images/mainBG-M.jpg) no-repeat center top;}

header { width:90%; margin: 0 auto; position:relative; height:auto;}
header.in { width:96%; margin: 0 auto; position:relative; height:310px;}

#logo-in { position:absolute; top:30px; left:0; width:25%;}
#logo-in img { width:100%; height:auto;}

#bookH { position: relative; top:0; left:0; float:left; margin: 12% 0 0 1%; border:#fff 3px solid; -webkit-box-shadow: 0 0 20px #797979; -moz-box-shadow: 0 0 20px #797979; box-shadow: 0 0 20px #797979; width:240px;}

#bookH img { width:100%; height:auto;}

#bookIn { position:absolute; top:45px; left:30%; border:#fff 2px solid; -webkit-box-shadow: 0 0 20px #797979; -moz-box-shadow: 0 0 20px #797979; box-shadow: 0 0 20px #797979;}
#bookIn img { width:170px; height:auto;}

#nameC { position:absolute; top:190px; right:0; width:400px;}
#nameC-in { width:35%; position:absolute; top:120px; right:0;}
#nameE { position:absolute; top:335px; right:0; width:400px;}
#nameE-in { width:35%; position:absolute; top:229px; right:0;}
#nameC img,
#nameE img,
#nameC-in img,
#nameE-in img { width:100%; height:auto;}

a.back { background:url(../images/icon_back.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; position:absolute; left:0; bottom:40px; width:100%;}
a.back:hover { background:url(../images/icon_back.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}

#Vol { position:relative; float:right; width:400px; font-weight:bold; top:140px;}
#Vol-in { position:absolute; left:0; top:192px; font-weight:bold;}
#Vol .no, #Vol-in .no { font-size:1.5em;}
#Vol .periods, #Vol-in .periods { font-size:2em;}
#Vol .date, #Vol-in .date { font-size:1.12em;}

#coverStory { position: relative; left:0; top:0; font-weight:bold; letter-spacing:-1px; color:#333; margin: 20px 0 0 0;}
#coverStory .t24 { font-size:1.25em; display:block; margin-bottom:10px;}
#coverStory .t40 { font-size:2em;}
.txt12 { font-size:0.75em; color:#666;}
.txt22 { font-size:1.37em; color:#666; display:block; margin: 5px 0 0 0;}
h2 { font-size:1.87em; font-weight:bold; display:block; margin: 45px 0 15px 0;}
h3 { font-size:1.12em; display:block; margin: 45px 0 15px 0;}
h3 b { font-size: 1.37em; font-weight:bold; display:block; margin: 5px 0 0 0;}

#fontTxt { position: relative; left:0; top:0; width:100%; font-size:15px; line-height:24px; color:#7b7b7b; text-align:justify; margin: 25px 0 0 0;}
#fontCon { font-size:15px; line-height:26px; color:#000; padding:20px 0; margin: 20px 0; width:100%; background:none; border-top: #CCC 1px dotted; text-align:left; clear:both;}

#homeList { width:90%; margin: 0 auto; position:relative; padding:20px 0 0 0;}
#homeList ul { width:100%; padding: 0;}
#homeList ul li { display:block; margin-bottom:50px; border-top: #CCC 1px solid; padding: 30px 0 0 0}
#homeList ul li a img { float:none; margin: 0 0 30px 0; padding: 0; border-right:none; width:100%; height:auto; opacity:0.8; filter:alpha(opacity=80);}
#homeList ul li:hover a img { float:none; margin: 0 0 30px 0; padding: 0; border-right:none; width:100%; height:auto; opacity:1.0; filter:alpha(opacity=100);}
#homeList ul li a .item { font-size:1em; display:block; margin: 0 0 5px 0; color:#333;}
#homeList ul li a .subTitle { font-size:1.25em; display:block; margin: 0 0 5px 0; color:#8a8a8a;}
#homeList ul li a .mainTitle { font-size:2em; margin: 0 0 15px 0; font-weight:bold; display:block;}
#homeList ul li:hover a .mainTitle { font-size:2em; margin: 0 0 15px 0; font-weight:bold; display:block; color:#900}
#homeList ul li a .more { background:url(../images/icon_more.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; margin: 0;}
#homeList ul li:hover a .more { background:url(../images/icon_more.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}

#moreList { background:#f6f6f6; width:100%; padding: 25px 0;}
.wide { width:96%; margin: 0 auto;}
.wideIn { width:96%; margin: 0 auto;}
#download { float:none; width:100%; margin: 20px 0; text-align:center;}
#downloadIn { float:none; width:100%; text-align:center;}
a.loadBtn { color:#fff; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 10px auto; width:90%; text-align:center; background:#000;}
a.loadBtn:hover { color:#ccc; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 10px auto; width:90%; text-align:center; background:#000;}
#moreArticle { float:none; width:90%; margin:0 auto;}
#moreArticle li { width: 100%; margin: 10px 0; color:#CCC; display:inline-block; font-size:1em; padding: 0 0 0 20px; border-left: #CCC 1px solid; height:auto;}

article { width:90%; margin:0 auto;}
#editor { text-align: right; font-size:15px; color:#666; margin:15px 0; line-height:18px;}
picFull { width:100%; margin: 0 0 55px 0;}
.picLeft { width:100%; margin: 0 40px 0 0; width:45%; float:left; padding-bottom:30px;}
.picRight { width:100%; margin: 0 0 0 40px; width:45%; float:right; padding-bottom:30px;}
.picFull img,
.picLeft img,
.picRight img { width:100%; height:auto; display:block; margin-bottom:15px;}
.picLeft img.morepic,
.picRight img.morepic { width:100%; height:auto; display:block; margin: 40px 0 15px 0;}
.picTxt { font-size:0.81em; color:#999; line-height:22px; font-weight:bold; letter-spacing:1px; display:block;}

/* -- Footer -- */
footer { width:98%; color: #999; text-align: center; margin: 10px auto 30px auto; font-size:13px; line-height:20px;}
footer img { display: block; margin: 20px auto; float:none; width:auto;}
#ITBS { float:none; font-size:14px; color:#333; line-height:20px; width:50%; text-align:left; margin:20px auto 35px auto;}
#ITBS img { float:left; display:inline-block; margin: 0 15px 0 0; height:50px; width:auto;} 
}

/* --手機版型------------------------------------- */

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

body { background: url(../images/mainBG.jpg) no-repeat center -5px; background-size: 1360px auto;}
body.in { background: url(../images/mainBG-M.jpg) no-repeat center -30px;}

header { width:90%; margin: 0 auto; position:relative; height:auto;}
header.in { width:90%; margin: 0 auto; position:relative; height:310px;}

#logo { position:absolute; top:20px; right:0; width:40%;}
#logo-in { position:absolute; top:20px; left:0; width:40%;}
#logo-in img { width:100%; height:auto;}
#logo img { width:100%; height:auto;}

#bookH { position: relative; top:0; left:0; float:left; margin: 12% 0 0 1%; border:#fff 3px solid; -webkit-box-shadow: 0 0 20px #797979; -moz-box-shadow: 0 0 20px #797979; box-shadow: 0 0 20px #797979; width:40%;}
#bookH img { width:100%; height:auto;}
#bookIn { position: relative; top:0; left:0; float:right; margin: 12% 0 0 1%; border:#fff 3px solid; -webkit-box-shadow: 0 0 20px #797979; -moz-box-shadow: 0 0 20px #797979; box-shadow: 0 0 20px #797979; width:40%;}
#bookIn img { width:100%; height:auto;}

#nameC { position: relative; top:0; right:0; width:50%; float:right; margin: 120px 0 0 0;}
#nameC-in { position: relative; top:0; right:0; width:50%; float:left; margin: 130px 0 0 0;}
#nameE { position: relative; top:0; right:0; width:50%; float:right; margin: 10px 0 0 0;}
#nameE-in { position: relative; top:0; right:0; width:50%; float:left; margin: 10px 0 0 0;}
#nameC img,
#nameE img,
#nameC-in img,
#nameE-in img { width:100%; height:auto;}

a.back { background:url(../images/icon_back.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; position:absolute; left:0; bottom:40px; width:100%;}
a.back:hover { background:url(../images/icon_back.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}

#Vol { position: absolute; width:100%; font-weight:bold; top:18%; right:0; text-align:right;}
#Vol-in { position: absolute; left:0; top:100px; font-weight:bold;}
#Vol .no, #Vol-in .no { font-size:0.93em;}
#Vol .periods, #Vol-in .periods { font-size:1.12em;}
#Vol .date, #Vol-in .date { font-size:0.93em;}

#coverStory { position: relative; left:0; top:0; font-weight:bold; letter-spacing:-1px; color:#333; clear:both; margin: 25px 0 0 0;}
#coverStory .t24 { font-size:1.25em; display:block; margin-bottom:10px; color:#666;}
#coverStory .t40 { font-size:2em; color:#000;}
.txt12 { font-size:0.75em; color:#666;}
.txt22 { font-size:1.37em; color:#666; display:block; margin: 5px 0 0 0;}
h2 { font-size:1.5em; font-weight:bold; display:block; margin: 45px 0 15px 0; line-height:32px;}
h2 b { font-weight:bold; display:block; margin: 10px 0 15px 0; line-height:32px;}
h3 { font-size:1.12em; display:block; margin: 45px 0 15px 0;}
h3 b { font-size: 1.25em; font-weight:bold; display:block; margin: 5px 0 0 0; line-height:26px}

#fontTxt { position: relative; left:0; top:0; width:100%; font-size:15px; line-height:21px; color:#7b7b7b; text-align:justify; margin: 15px 0 0 0;}
#fontCon { font-size:15px; line-height:26px; color:#000; padding:20px 0; margin: 20px 0; width:100%; background:none; border-top: #CCC 1px dotted; text-align:left; clear:both;}

#homeList { width:90%; margin: 0 auto; position:relative; padding:20px 0 0 0;}
#homeList ul { width:100%; padding: 0;}
#homeList ul li { display:block; margin-bottom:50px; border-top: #CCC 1px solid; padding: 30px 0 0 0}
#homeList ul li a img { float:none; margin: 0 0 30px 0; padding: 0; border-right:none; width:100%; height:auto; opacity:0.8; filter:alpha(opacity=80);}
#homeList ul li:hover a img { float:none; margin: 0 0 30px 0; padding: 0; border-right:none; width:100%; height:auto; opacity:1.0; filter:alpha(opacity=100);}
#homeList ul li a .item { font-size:1em; display:block; margin: 0 0 5px 0; color:#333;}
#homeList ul li a .subTitle { font-size:1em; display:block; margin: 0 0 5px 0; color:#8a8a8a; line-height:24px;}
#homeList ul li a .mainTitle { font-size:1.5em; margin: 0 0 15px 0; font-weight:bold; display:block; line-height:28px;}
#homeList ul li:hover a .mainTitle { font-size:1.5em; margin: 0 0 15px 0; font-weight:bold; display:block; color:#900}
#homeList ul li a .more { background:url(../images/icon_more.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; margin: 0;}
#homeList ul li:hover a .more { background:url(../images/icon_more.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}

#moreList { background:#f6f6f6; width:100%; padding: 25px 0;}
.wide { width:90%; margin: 0 auto;}
.wideIn { width:90%; margin: 0 auto;}
#download { float:none; width:100%; margin: 20px 0; text-align:center;}
#downloadIn { float:none; width:100%; text-align:center; margin:20px 0 0 0;}
a.loadBtn { color:#fff; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 10px auto; width:90%; text-align:center; background:#000;}
a.loadBtn:hover { color:#ccc; padding: 20px 0; font-size:1.37em; font-weight:bold; display:block; margin: 10px auto; width:90%; text-align:center; background:#000;}
#moreArticle { float:none; width:90%; margin:0 auto;}
#moreArticle li { width: 100%; margin: 10px 0; color:#CCC; display:inline-block; font-size:1em; padding: 10px 0 0 20px; border-left: #CCC 1px solid; height:auto;}

article { width:90%; margin:0 auto;}
#editor { text-align:left; font-size:13px; color:#666; margin:10px 0; line-height:18px;}

.storyTitle { font-size:1em; color:#231f20; letter-spacing:0;}
.storyTitle b { font-size:30px; font-weight:bold; display:block; margin: 5px 0 0 0; line-height:36px;}
.itemIn { float:none; margin: 0 0 15px 0; border-left: #CCC 3px solid; padding: 10px 15px; height:auto; display:block; border-right:none; font-size:13px; background:#F3F3F3}
#inContent { clear:both; margin:30px 0; text-align:justify; text-justify: inter-ideograph; font-size:1em; line-height:26px; padding-bottom:30px; border-bottom:#999 1px dotted;}

.picFull { width:100%; margin: 0 0 35px 0;}
.picLeft { width:100%; margin: 25px 0; width:100%; float:none; padding-bottom:30px;}
.picRight { width:100%; margin: 25px 0; width:100%; float:none; padding-bottom:30px;}
.picFull img,
.picLeft img,
.picRight img { width:100%; height:auto; display:block; margin-bottom:10px;}
.picLeft img.morepic,
.picRight img.morepic { width:100%; height:auto; display:block; margin: 40px 0 15px 0;}
.picTxt { font-size:0.81em; color:#999; line-height:20px; font-weight:bold; letter-spacing:1px; display:block;}

ul.inList { width:100%;}
ul.inList li { display:block; margin-bottom:50px;}
ul.inList li a img { float:none; margin: 0; padding: 0; border-right: none; width:100%; height:auto;}
ul.inList li a .item { font-size:0.81em; display:block; margin: 10px 0;}
ul.inList li a .subTitle { font-size:1em; display:block; margin: 0 0 5px 0; color:#8a8a8a;}
ul.inList li a .mainTitle { font-size:1.5em; margin: 0 0 30px 0; font-weight:bold; display:block; line-height: 32px;}
ul.inList li:hover a .mainTitle { font-size:1.5em; margin: 0 0 30px 0; font-weight:bold; display:block; color:#900}
ul.inList li a .more { background:url(../images/icon_more.png) no-repeat left top; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px; margin: -20px 0 0 0; float:right;}
ul.inList li:hover a .more { background:url(../images/icon_more.png) no-repeat left bottom; padding: 0 0 0 30px; font-size:0.87em; color:#666; display:block; height:23px; line-height:23px;}
.moreTitle { display:block; float:none; color:#666; margin: 0 0 15px 0;}

/* -- Footer -- */
footer { width:98%; color: #999; text-align: center; margin: 10px auto 30px auto; font-size:13px; line-height:20px;}
footer img { display: block; margin: 20px auto; float:none; width:auto;}
#ITBS { float:none; font-size:14px; color:#333; line-height:20px; width:95%; text-align: center; margin:20px auto 35px auto;}
#ITBS img { float:none; display:block; margin: 0 auto 15px auto; height:50px; width:auto;} 

}
