@charset "shift_jis";

/* --------------------------------------------------
	SiteName : pocketcard.co.jp
	FileName : index.css
	Description : index styles
	== TOC =========================================
	1 : topArea
	2 : topInfoArea
	3 : topLinksIcnArea
	4 : topLinksArea
-------------------------------------------------- */

/* 1. headerArea
================================================== */

/* ____________________________ search form 201402 */
/*#headerArea ul form input {
	vertical-align:middle;
}
#headerArea ul form .keyword{
	padding: 0;
	width:120px;
	height:18px;
	margin-right:4px;
	border: solid 1px #b6b6b6;
}*/

/* 1. mainArea
================================================== */
#mainArea{
	width:635px;
	float:left;
}
/* _______________________________________ topArea */
#topArea{
	position:relative;
	width:635px;
	height:270px;
	overflow: hidden;
	background:url(/images/bg_main.gif) no-repeat;
}
/* ___________________________________ topInfoArea */
#topInfoArea{
	margin:20px 0;
	background:url(/images/bg_topinfoarea.gif) no-repeat top center;
}
#topInfoArea .infoArea {
	float: left;
	width: 636px;
}

#pickupArea{
	padding:10px 10px 0;
}
#pickupArea h3{
	width:610px;
	margin:5px auto;
	padding:0;
}
#pickupArea h3 img{
	margin:0;
}
.pickup_box{
	margin:10px auto 5px;
	overflow:hidden;
}
.pickup_box .bnr_box .left_box{
	float: left;
	width: 300px;
	height:218px;
	background:url(/images/prenew/bg_cpnbnr.gif) no-repeat top center;
	text-align:center;
/*
	border:#cccccc 5px solid;
*/
}
.pickup_box .bnr_box .right_box{
	float: right;
	width: 300px;
	height:218px;
	background:url(/images/prenew/bg_cpnbnr.gif) no-repeat top center;
	text-align:center;
/*
	border:#cccccc 5px solid;

	margin-left:10px;
*/
}

.pickup_box .bnr_box .right_box img,
.pickup_box .bnr_box .left_box img {
	width:290px;
	height:208px;
	vertical-align:bottom;
	margin-top:5px;
}

.list_box{
	margin:10px auto;
	border-top:1px #cccccc solid;
}
.pickup_list{
	border-bottom:1px #cccccc solid;
	padding:10px 0;
}
.pickup_list dt.icon_pickup {
	clear: left;
	float: left;
	margin: 0 0 0.8em;
/*	
	width: 7.5em;
*/
	padding-left: 5px;
	color: #000;
}

.pickup_list dd.txt_pickup {
  margin-bottom: 0.8em;
  margin-left: 7.5em;
}
.pickup_list .txt_pickup dl dt a {
	color: #0070a8;
	text-decoration:underline;
}
.list_box p{
  margin: 10px 0 ;
  text-align:right;
}

.list_box p a{
	display:block;
	margin:0;
	padding:0 0 0 20px;
	background:url(/images/icon_arrow.gif) no-repeat left center;
	float:right;
}

#importantArea,
#whatsnewsArea{
	padding:10px;
}
#importantArea .header ,
#whatsnewsArea .header {
	padding: 4px 0 5px 0;
	border-top: solid 7px #878787;
	*zoom: 1;
}
#importantArea .header h3 ,
#whatsnewsArea .header h3 {
	float: left;
	margin: 0;
	width:200px;
}
#importantArea .header p ,
#whatsnewsArea .header p {
	float: right;
}
#importantArea .newsList ,
#whatsnewsArea .newsList {
	background: #eeeeee;
	border: solid 1px #ccc;
	/*height: 140px;*/
	overflow: hidden;
}
#importantArea .newsList ul ,
#whatsnewsArea .newsList ul {
	margin: 11px;
	border-top: solid 1px #ccc;
}
#importantArea .newsList li ,
#whatsnewsArea .newsList li {
	padding: 3px 0;
	border-bottom: solid 1px #ccc;
}




/* 1. rightArea
================================================== */
#rightArea{
	float:left;
	width:290px;
	overflow: hidden;
	margin-left:5px;
}

/* 1-. LoginArea
-------------------------------------------------- */
#rightArea .LoginArea{
	/* [disabled]height:305px; */
	padding: 5px;
	background: url(/images/bg_login.gif) no-repeat top center;
}
#rightArea .LoginArea h3{
	height:50px !important;
	width:100%;
	margin:0;
	padding:0;
}
#rightArea .LoginArea h3 img{
	margin:0;
}
#rightArea ul {
	width:250px;
	margin:0 auto !important;
	padding:0 !important;
}
#rightArea .txt_list li {
	margin:0;
	padding: 0 0 5px 15px;
	background:url(/images/icon_list.png) no-repeat left top;
}

#rightArea .login_box li {
	padding:5px 5px 0 !important;
	background: none !important;
}

#rightArea .LoginArea_bottom{
	padding: 5px;
	background: url(/images/bg_login_bottom.gif) no-repeat bottom center;
}

/* 5-1. loginarea_topA
-------------------------------------------------- */
#loginarea_topA {
padding:0;
}

#loginarea_topA ul li {
margin-bottom:10px;
}

#loginarea_topA ul li:hover {
-ms-filter: "alpha( opacity=60 )";
filter: alpha( opacity=60 );
opacity: 0.6;
cursor:pointer;
}


#loginarea_topA ul li a img {
vertical-align:bottom;
}

/* 5-2. loginarea_topB
-------------------------------------------------- */
#loginarea_topB {
padding:0 0 5px;
margin-bottom:15px;
}

#loginarea_topB ul li {
margin-bottom:10px;
}

#loginarea_topB ul li:hover {
-ms-filter: "alpha( opacity=60 )";
filter: alpha( opacity=60 );
opacity: 0.6;
cursor:pointer;
}


#loginarea_topB ul li a img {
vertical-align:bottom;
}


/* ______________________________________ cardArea */
#rightArea .cardArea {
	padding:15px 15px 5px;
	margin:10px 0 0;
	background: url(/images/bg_rightarea.gif) no-repeat top left;
}
#rightArea .bottom{
	padding: 0 0 10px;
	margin: 0 0 20px;
	background: url(/images/bg_rightarea.gif) no-repeat bottom left;
}
#rightArea .cardArea h3{
	margin:0 auto;
	width: 100%;
}

.card_list{
	padding:10px 0 0;
}

#rightArea .cardArea dt.icon_card {
  clear: left;
  float: left;
  margin: 0 0 0.8em;
  width: 7.5em;
  padding-left: 5px;
  color: #000;
}

#rightArea .cardArea dd.txt_card {
  margin-bottom: 0.8em;
  margin-left: 7.5em;
}
#rightArea .cardArea .txt_card dl dt a {
	text-decoration:underline;
}



/* _________________________________ recommendArea */
#rightArea .recommendArea {
	padding:15px 15px 5px;
	margin:10px 0 0;
	background: url(/images/bg_rightarea.gif) no-repeat top left;
}

#rightArea .recommendArea h3{
	margin:0 auto;
	width: 100%;
}

.recommend_box{
	width: 245px;
	padding: 10px 10px 0;
	margin: 10px 0 0;
	background: url(/images/bg_recommendbox.gif) no-repeat top left;
	text-align: center;
}
.recommend_bottom{
	width: 235px;
	padding: 0 15px 10px;
	margin: 0;
	background: url(/images/bg_recommendbox.gif) no-repeat bottom left;
}

.recommend_box p{
	word-break: break-all;
	padding: 0 15px 5px;
	text-align: left;
}

.recommend_box p a {
	text-decoration:underline;
}



#topInfoArea .newsInfoArea {
	width: 610px;
	height: 482px;
	padding: 12px 13px 0;
/*	background: url(/images/top/infoarea/bg_newsinfo.gif) no-repeat;*/
}
#topInfoArea .newsInfoArea img {
	vertical-align: bottom;
}

#topInfoArea .newsInfoArea .newsItem {
	margin-bottom: 10px;
}
#topInfoArea .newsInfoArea .newsItem .header {
	padding: 4px 0 5px 0;
	border-top: solid 7px #878787;
	*zoom: 1;
}
#topInfoArea .newsInfoArea .newsItem .header:after {
	content:"";
	display:block;
	clear:both;
}
#topInfoArea .newsInfoArea .newsItem .header h2 {
	float: left;
	margin: 0;
}
#topInfoArea .newsInfoArea .newsItem .header p {
	float: right;
}
#topInfoArea .newsInfoArea .newsItem .newsList {
	background: #eeeeee;
	border: solid 1px #ccc;
	height: 140px;
	overflow: hidden;
}
#topInfoArea .newsInfoArea .newsItem .importantList {
	height: 116px;
}
#topInfoArea .newsInfoArea .newsItem .newestList {
	height: 92px;
}
#topInfoArea .newsInfoArea .newsItem .newsList ul {
	margin: 11px;
	border-top: solid 1px #ccc;
}
#topInfoArea .newsInfoArea .newsItem .newsList li {
	padding: 3px 0;
	border-bottom: solid 1px #ccc;
}

	
/*
#topInfoArea .newsInfoArea .newsItem dl dt{
	padding:5px 0 0;
}

#topInfoArea .newsInfoArea .newsItem dl dd{
	padding:5px;
	border-bottom:solid 1px #ccc;
}
*/
#topInfoArea .newsInfoArea .newsItem dl{
	margin: 11px;
	border-top: solid 1px #ccc;
}
#topInfoArea .newsInfoArea .newsItem .importantList dl dt,
#topInfoArea .newsInfoArea .newsItem .newestList dl dt{
	padding:5px 0 0;
	width:100px;
	float:left;
}

#topInfoArea .newsInfoArea .newsItem .importantList dl dd,
#topInfoArea .newsInfoArea .newsItem .newestList dl dd{
	padding:5px 5px 5px 0;
	border-bottom:solid 1px #ccc;
}



#topInfoArea .newsInfoArea .newsItem div table{
	width:100%;
	line-height:1.3;
}
#topInfoArea .newsInfoArea .newsItem div table th{
	padding:5px;
	border-bottom:solid 1px #e2e2e2;
	font-weight:normal;
	text-align:left;
	white-space:nowrap;
	vertical-align:top;
}
#topInfoArea .newsInfoArea .newsItem div table td{
	padding:5px 10px 5px 15px;
	border-bottom:solid 1px #e2e2e2;
	vertical-align:top;
}



/* pickupArea
================================================== */
#pickupArea .header{
	padding: 4px 0 5px 0;
	border-top: solid 7px #878787;
	*zoom: 1;
}
#pickupArea h3 {
	float: left;
	margin: 0;
	width:200px;
}
#pickupArea .header p {
	float: right;
}


/* importantArea ’Ç‹L
================================================== */
#topInfoArea .newsList dl{
	margin:10px;
	border-top: solid 1px #ccc;
}

#topInfoArea .newsList dt{
	padding:5px 0 0;
}

#topInfoArea .newsList dd{
	padding:5px;
	border-bottom:solid 1px #ccc;
}

#topInfoArea .importantList dl dt,
#topInfoArea .newestList    dl dt{
	padding:5px 0 0;
	width:100px;
	float:left;
	clear:both;
}

#topInfoArea .importantList dl dd,
#topInfoArea .newestList    dl dd{ 
}



/* 3. topLinksIcnArea
================================================== */
#topLinksIcnArea{
	margin-bottom:14px;
	clear: both;
}