@charset "utf-8";

/*********************************************************************
*	topContents
*********************************************************************/
#topContents{
	clear:both;
	margin:10px 6px;
	overflow:hidden;
}
#topContents .leftContents{
	float:left;
	width:678px;
}
#topContents .rightContents{
	float:right;
	width:300px;
}


/*********************************************************************
*	Pickup Area
*********************************************************************/
#pickupArea{
	display:block;
	width:675px;
	border:2px solid #bfbfbf;
	background:#f3f3f3;
	*z-index:1;
}
#pickupArea h2{
	display:block;
	width:675px;
	height:27px;
	text-indent:-9999px;
	*font-size:5px;
	*line-height:21px;
	background:url(/images/n/itpro/2013/theme/top/title_pickuparea.gif) left top no-repeat;
}
#pickupArea .pickupContents{
	display:block;
	overflow:hidden;
	background:url(/images/n/itpro/2013/theme/top/pickuparea_bg.gif) left top repeat-x;
	padding:9px 8px;
	*zoom:1;
	*height:1%;
}
* html body #pickupArea .pickupContents{
	*padding:9px 8px 1px 8px;
}
#pickupArea ul{
	float:right;
	width:265px;
	padding:1px 0 0 0;
	background:url(/images/n/itpro/2013/theme/top/pickuparea_ulbg.gif) right top no-repeat;
	overflow:hidden;
	*zoom:1;
}
#pickupArea li{
	display:block;
	width:265px;
	*zoom:1;
	*vertical-align:top;
}
#pickupArea li.now{
	background:url(/images/n/itpro/2013/theme/top/pickuparea_libg.gif) left center no-repeat;
	overflow:hidden;
}
#pickupArea li a{
	display:block;
	padding:0 0 0 5px;
	width:248px;
	height:46px;
	line-height:45px;
	font-weight:bold;
	overflow:hidden;
	border-bottom:1px solid #cbcbcb;
	float:right;
	font-size:80%;
	color:#333;
}
#pickupArea li a:hover{
	text-decoration:none;
}
#pickupArea li.now a{
	color: #342F74;
	background:#e8e8e8;
}


#pickupArea #rotationView{
	float:left;
	width:388px;
	height:277px;
	border:3px solid #7b7b7b;
	background:#fff;
	overflow:hidden;
	position:relative;
}
#pickupArea #rotationView div{
	display:none;
	position:absolute;
	top:0px;
	left:0px;
	width:388px;
	height:277px;
}
#pickupArea #rotationView div.now{
	display:block;
}
#pickupArea #rotationView div a{
	display:block;
	width:368px;
	height:256px;
	padding:13px 10px 8px 10px;
	position:relative;
	font-size:80%;
	line-height:1.5;
	color:#333;
	cursor:pointer;
}
#pickupArea #rotationView div a:hover{
	text-decoration:none;
}
#pickupArea #rotationView div a .top_title{
	display:block;
	font-weight:bold;
	margin:0 0 5px 0;
	line-height:16px;
}
* html body #pickupArea #rotationView div a .top_title{float:left;}
* html body #pickupArea #rotationView div a .top_title{float:left;}
#pickupArea #rotationView div a.feature .top_title{
	background:url(/images/n/itpro/2013/theme/top/top_pickup_icon_sp.jpg) left top no-repeat;
	text-indent:33px;
}
#pickupArea #rotationView div a.opinion .top_title{
	background:url(/images/n/itpro/2013/theme/top/top_pickup_icon_opinion.jpg) left top no-repeat;
	text-indent:55px;
}
#pickupArea #rotationView div a.active .top_title{
	background:url(/images/n/itpro/2013/theme/top/top_pickup_icon_active.jpg) left top no-repeat;
	text-indent:41px;
}
#pickupArea #rotationView div a.sokuho .top_title{
	background:url(/images/n/itpro/2013/theme/top/top_pickup_icon_sokuho.jpg) left top no-repeat;
	text-indent:29px;
}
#pickupArea #rotationView div a.scoop .top_title{
	background:url(/images/n/itpro/2013/theme/top/top_pickup_icon_scoop.jpg) left top no-repeat;
	text-indent:45px;
}
#pickupArea #rotationView div a.nc .top_title{
	background:url(/images/n/itpro/2013/theme/top/top_pickup_icon_nc.jpg) left top no-repeat;
	text-indent:60px;
}
#pickupArea #rotationView div a .title{
	display:block;
	font-size:140%;
	line-height:1.4;
	font-weight:bold;
	margin:0 0 10px 0;
	color: #342F74;
}
#pickupArea #rotationView div a .image{
	float:left;
	margin:0 10px 10px 0;
}
#pickupArea #rotationView div a .image img{
	width:120px;
	height:auto;
}
#pickupArea #rotationView div a .more{
	display:block;
	text-align:right;
	position:absolute;
	right:10px;
	bottom:8px;
	color: #342F74;
}

/*********************************************************************
*	夏休みスペシャル
*********************************************************************/
#pickupArea.summer{
	background:#ebf4fa;
}
#pickupArea.summer h2{
	background:url(/images/n/itpro/2013/theme/top/title_pickuparea_summer.gif) left top no-repeat;
}
#pickupArea.summer li.now a{
	color: #342F74;
	background:#e0e9ee;
}

/*********************************************************************
*	週末スペシャル
*********************************************************************/
#pickupArea.weekend{
	background:#f3f3e7;
}
#pickupArea.weekend h2{
	background:url(/images/n/itpro/2013/theme/top/title_pickuparea_weekend.gif) left top no-repeat;
}
#pickupArea.weekend li.now a{
	color: #342F74;
	background:#e8e8dc;
}

/*********************************************************************
*	ITpro EXPOスペシャル
*********************************************************************/
#pickupArea.expo{
	background:#e7fbf2;
}
#pickupArea.expo h2{
	background:url(/images/n/itpro/2013/theme/top/title_pickuparea_expo2014.gif) left top no-repeat;
}
#pickupArea.expo li.now a{
	color: #342F74;
	background:#dcefe7;
}

/*********************************************************************
*	冬休みスペシャル
*********************************************************************/
#pickupArea.winter{
	background:#fffdf1;
}
#pickupArea.winter h2{
	background:url(/images/n/itpro/2013/theme/top/title_pickuparea_winter.gif) left top no-repeat;
}
#pickupArea.winter li.now a{
	color: #342F74;
	background:#f3f0e7;
}

/*********************************************************************
*	ゴールデンウイークスペシャル
*********************************************************************/
#pickupArea.goldenweek{
	background:#f4faee;
}
#pickupArea.goldenweek h2{
	background:url(/images/n/itpro/2013/theme/top/title_pickuparea_goldenweek.gif) left top no-repeat;
}
#pickupArea.goldenweek li.now a{
	color: #342F74;
	background:#eaede2;
}

/*********************************************************************
*	#mainContent内　各コンテンツ
*********************************************************************/
#mainContent .linkMore{
	text-align:right;
	font-size:75%;
	line-height:1.3;
}

/*** Headline ***/
.headlineBox{
	display:block;
	*z-index:1;
	margin:0 0 20px 0;
}
.headlineBox h2{
	margin:0 0 10px 0;
}
.headlineBox .picture{
	display:block;
	float:right;
	width:120px;
	border:1px solid #c6d7ea;
	background:#f6fbff;
	font-size:75%;
	line-height:1.3;
	padding:5px;
	margin:0 0 10px 20px;
}
.headlineBox .picture img{
	width:120px;
	margin:0 0 5px 0;
}

/*** 連載新着 ***/
.seriesBox{
	display:block;
	margin:0 0 20px 0;
}
.seriesBox .ctBox{
	border-top:1px solid #e4e4e4;
	font-size:90%;
	line-height:1.3;
	padding:10px 0 0 0;
	margin:10px 0 0 0;
}
.seriesBox .first{
	border:none;
	padding:0;
}
.seriesBox .ctBox p{
	margin:0;
}
.seriesBox .ctBox .img{
	float:right;
	margin:0 0 10px 10px;
}
.seriesBox .ctBox .img img{
	width:120px;
}
.seriesBox .ctBox .category{
	display:block;
	font-weight:bold;
	margin:0 0 3px 0;
	color:#595959;
}
.seriesBox .ctBox .title{
	display:block;
	font-weight:bold;
	font-size:120%;
	line-height:1.3;
	margin:0 0 3px 0;
}
.seriesBox .ctBox .subtitle{
	display:block;
	font-weight:bold;
}
.seriesBox .ctBox .summary{
	display:block;
	margin:3px 0 0 0;
	line-height:1.4;
}

/*** ITpro Active 新着記事 ***/
.itproActiveBox{
	display:block;
	margin:0 0 20px 0;
}
.itproActiveBox .itemWrap{
	display:block;
	width:536px;
	overflow:hidden;
	margin:0 0 0 2px;
}
.itproActiveBox .itemBox{
	display:block;
	width:560px;
	clear:both;
	overflow:hidden;
	background:url(/images/n/itpro/2013/theme/top/active_latest_bg.gif) left top no-repeat;
}
.itproActiveBox .itemBoxFirst{
	background:none;
}
.itproActiveBox .item{
	width:261px;
	margin:10px 14px 10px 0;
	float:left;
	font-size:90%;
	line-height:120%;
}
.itproActiveBox .item img{
	width:70px;
	height:auto;
	margin:0 0 5px 5px;
	float:right;
}
.itproActiveBox .item .top_title{
	display:block;
	color:#595959;
	font-size:78%;
}


/*** ITpro 24hrs ***/
#timeline_24h{
	display:block;
	width:540px;
	position:relative;
	margin:0 0 20px 0;
}
#timeLineWrap{
	display:block;
	width:538px;
	border-left:1px solid #aac2e0;
	border-right:1px solid #aac2e0;
	border-bottom:1px solid #aac2e0;
	height:670px;
	overflow:hidden;
	overflow-y:auto;
	background:#fff;
	margin:0 auto;
	position:relative;
}
#timeLineWrap #timeLineAll{
	display:block;
	padding:0 5px;
	overflow:hidden;
	*float:left;
	*zoom:1;
}
#timeLineWrap #timeLineAll li{
	display:block;
	*width:515px;
	clear:both;
	overflow:hidden;
	border-bottom:1px solid #cecece;
	padding:4px 0;
	*float:left;
	min-height:45px;
	font-size:90%;
	line-height:120%;
}
#timeLineWrap #timeLineAll li .image{
	width:60px;
	float:left;
	height:45px;
	overflow:hidden;
	margin:0 10px 0 0;
}
#timeLineWrap #timeLineAll li .image img{
	width:60px;
}
#timeLineWrap #timeLineAll li .top_title{
	color:#595959;
	font-size:78%;
	display:inline-block;
	*display:inline;
	*zoom:1;
	margin:0v 0 0
}
#timeLineWrap #timeLineAll li .date{
	font-size:85%;
	color:#7f7f7f;
	display:inline-block;
	*display:inline;
	*zoom:1;
}
#timeLineWrap #timeLineAll li .title{
	display:block;
}
#timeLineWrap #timeLineAll li.pr_box{
	padding:5px 0;
	position:relative;
	*width:515px;
}
#timeLineWrap #timeLineAll li.pr_box .pr_text{
	position:absolute;
	display:block;
	right:0;
	top:2px;
	font-size:12px;
	color:#7f7f7f;
}
#timeLineWrap #timeLineAll li.pr_box .item{
	display:block;
	float:left;
	width:50%;
	*width:250px;
	overflow:hidden;
	min-height:70px;
}
#timeLineWrap #timeLineAll li.pr_box .item .image{
	display:block;
	vertical-align:middle;
	width:70px;
	height:70px;
	margin:0 10px 0 0;
	float:left;
	position:relative;
	top:0;
	overflow:hidden;
}
#timeLineWrap #timeLineAll li.pr_box .item .image img{
	width:70px;
	height:70px;
}
#timeLineWrap #timeLineAll li.pr_box .item .title{
	display:block;
	width:165px;
	margin:1.1em 0 0 10px;
	overflow:hidden;
}
#timeLineWrap #timeLineAll li.nowloading{
	display:block;
	padding:32px 0 5px 0;
	*width:515px;
	text-align:center;
	background:url(/images/n/itpro/2012/loadinfo.gif) center 5px no-repeat;
	min-height:20px;
	border:none;
}



/*********************************************************************
*	その他
*********************************************************************/

/*** 右ペイン　システム運用ナレッジパーツ ***/
.smkSideParts{
	border:1px solid #e4e4e4;
	margin:0 0 10px 0;
	padding:0 0 1px 0;
	font-size: 78%;
	line-height:1.3;
}
.smkSideParts h3{
	display:block;
	padding:0;
	margin:0;
	border-bottom:1px solid #e4e4e4;
}
.smkSideParts h3 a{
	display:block;
}
.smkSideParts li{
	border-bottom:1px dashed #e4e4e4;
	padding:7px 0;
	margin:0 10px;
}
.smkSideParts li a .top_title{
	color:#777;
}
.smkSideParts .more{
	text-align:right;
	margin:10px;
}



/*********************************************************************
*	速報枠
*********************************************************************/

#sokuhoArea{ width:300px; text-align:left; margin:0; padding:0; }
#sokuhoArea .articleBox{ margin-bottom:10px; width:298px; background:#f2f9ff; border:solid 1px #93defd; }

#sokuhoArea .articleBox h3 { clear: both; height: 28px; clear:both; text-align:left; padding: 0 13px; margin-bottom:5px; font-size:11pt; line-height: 28px; position: relative; overflow: hidden; }
#sokuhoArea .articleBox h3 a { display: block; color: #000; height: 28px; _line-height: 18px; _height: 18px; _padding-top: 2px; }
#sokuhoArea .articleBox h3 a:hover { text-decoration: none; background: #EAEAEA; width: 527px; margin: 0 -13px; padding-left: 13px; cursor: pointer; color: #000; _line-height: 18px; _height: 18px; }
#sokuhoArea .articleBox h3 { width:298px; height:28px; line-height:30px; background:url(/images/itpro/2011/theme/top/sokuho/bg_blue.gif) repeat-y left top; border-top:none; border-bottom:1px solid #4265db; !important; }
#sokuhoArea .articleBox h3 span { font-size:9pt; font-weight:bold; padding: 0px; width: 160px; position: absolute; right: 0; top: 0; display: block; text-align: right; padding-right: 30px; }

#sokuhoArea .articleBox h3 a:hover{background:url(/images/itpro/2011/theme/top/sokuho/bg_blue.gif) repeat-y left top;}
#sokuhoArea .articleBox h3 span{ color:#ffffff;}
#sokuhoArea .articleBox ul{padding:5px;}
#sokuhoArea .articleBox li{font-size:10pt; background:url(/images/itpro/2012/mark_square_top.gif) left 2px no-repeat; padding-left:18px;}

#sokuhoArea .articleBox img{width:60px; float:right; margin:0 2px 4px 4px}

/*********************************************************************
*	EXPO枠
*********************************************************************/

#expoArea { width:300px; text-align:left; margin:0; padding:0; }
#expoArea .articleBox { margin-bottom:10px; width:296px; background:#ffffff; border:solid 2px #3e58ba; }
#expoArea .articleBox ul{padding:5px;}
#expoArea .articleBox li{font-size:10pt; background:url(/images/n/itpro/2012/mark_square_top.gif) left 2px no-repeat; padding-left:18px;}

#expoArea .articleBox .sokuhoimg{width:80px; float:right; margin:0 2px 4px 4px}