@charset "Shift_JIS";

/* ################################################### */
/* #                                                 # */
/* #                                                 # */
/* #                テンプレート用css                # */
/* #                                                 # */
/* #                                                 # */
/* ################################################### */


/* 目次
---------------------------------------------------- */
/*

 1. base         (基本設定)
 2. Layout       (基本レイアウト枠)
 3. Header       (ヘッダ内要素)
 4. GlobalNavi   (グローバルナビゲーション内要素)
 5. Content      (サイト内枠)
 6. Main         (メインカラム内要素)
 7. Sub          (サブカラム内要素)
 8. tag    　　  (共通記述タグ)
 9. Footer       (フッタ内要素)
 10. 汎用	

/*

/* base
---------------------------------------------------- */


body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{
    margin:0;padding:0;
}
table{
    border-collapse:collapse;border-spacing:0;
}
fieldset,img{ border:0; }
address,caption,cite,code,dfn,em,strong,th,var{
    font-style:normal;font-weight:normal;
}
 caption,th{ text-align:left; }
h1,h2,h3,h4,h5,h6{
    font-size:100%;font-weight:normal;
}
q:before,q:after{ content:''; }
abbr,acronym{ border:0;font-variant:normal; }
sup{ vertical-align:text-top; }
sub{ vertical-align:text-bottom; }
input,textarea,select{ font-family:inherit;font-size:inherit;font-weight:inherit; }
input,textarea,select{ *font-size:100%; }
legend{ color:#000; }
img{
	vertical-align:bottom;}

body {
	font-family: "ＭＳ Ｐゴシック", "Osaka", sans-serif;
	background:url(../images/bg_image.gif) left top;
	text-align: center;
	color: #333;
	font-size:100%;
}
div.HomeBg {
	background: url(https://www.4353p-club.com/trial/images/change/bg.gif) center top no-repeat;
	
}
/* フォント */
#DocBody, table, h1, h2, h3, h4, h5, h6, input, p, textarea {
	font-size:15px;
	line-height:120%;
	position:relative;
}
a:link, 
a:visited, 
a:active ,
a:hover {
	color:#FF6600;
	text-decoration:underline;
}
a:hover {
	color:#FF9900;
	text-decoration:underline;
}
ol,
ul,
li{
	list-style:none;
	text-decoration:none;
	line-height:140%;
}

ul.clear,
li.clear,
div.clear,
br.clear,
p.clear {
	clear:both;
}


/* Layout
---------------------------------------------------- */


#DocBody {
	margin: 0 auto;
	text-align: center;
	width:1000px;
}

#Header{
	width:980px;
	padding:5px 0px 0px 0px;
	height:71px;
	}
#Header h1{
	text-align:left;
	width:350px;
	float:left;
	 }
	
#Content{
	width:1000px;
	clear:both;
	}
	
#Content .teacher_area{
	width:460px;
	height: 230px;
	margin-top: 20px;
	padding:10px 0px 0px 0px;
 	float:left;
	background:url(https://www.4353p-club.com/trial/images/bg_teacher.gif) left top no-repeat;
	text-align:left;
	}
#Content .teacher_area h2{
	font-size:1.2em;
	color:#FF6600;
	font-weight:bold;
	padding-bottom:10px;
	}
.teacher_area div {
	float: right;
	width:295px;
}

#Content .login_area{
	width:490px;
	background:url(https://www.4353p-club.com/trial/images/bg_login.gif) left top no-repeat;
	float:right;
	padding:80px 10px 25px 30px;
	text-align:left;
	}
	#Content .login_area ul{
	margin-bottom:15px;
	}
	#Content .login_area ul li.title{
		font-size:1.1em;
		line-height:130%;
		font-weight:bold;
	}
	#Content .login_area ul li input{
		width:300px;
		height:25px;
		font-size:1.1em;
	}


	#Content .foreget_btn{
	padding-bottom:8px;
	}
	#Content .cantlogin_btn{
	}
	 
.left_login_area{
	width:230px;
	float:left;
}
.right_login_area{
	width:245px;
	float:left;
}
p.Error{
	color:#FF0000;
	position:absolute;
	top:133px;
	left:587px;
	width:300px;
}
	
#Content .event_area{
	width:560px;
	float:left;
	text-align:left;
	}
	#Content .event_in{
	background:url(https://www.4353p-club.com/trial/images/bg_event_area.gif) left bottom no-repeat;
	padding:8px 10px 10px 20px;
	margin-bottom:0px;
	text-align: left;
	}
	#Content dl.event_title{
	padding-bottom:4px;
	clear:both;
	background:url(https://www.4353p-club.com/trial/images/dotted_border.gif) left bottom no-repeat;
	width: 390px;
	}
	#Content .news_area dl.event_title{
	padding-bottom:10px;
	clear:both;
	background:url(https://www.4353p-club.com/trial/images/dotted_border.gif) left bottom no-repeat;
	width: 390px;
	}
	#Content dl.event_content{
	clear:both;
	background:url(https://www.4353p-club.com/trial/images/dotted_border.gif) left bottom no-repeat;
	}				
	#Content dl.event_title dt{
	width:110px;
	float:left;
	}
	#Content dl.event_title dd{
	width:200px;
	float:left;
	font-size:12px;
	}
	#Content dl.event_content dt{
	width:110px;
	float:left;
	}
	#Content dl.event_content dd{
	width:300px;
	float:left;
	font-size:15px;
	padding-top: 10px;
	}


/*テーブル追加 2012.0612
-----------------------------------------------------------------*/
.EventInfo {
	width: 100%;
}
.EventInfo td {
	 vertical-align: top;
}
.EventInfo .Left {
	border-right: 1px dashed #ccc;
	border-bottom: 1px dashed #ccc;
	width: 50%;
}
.EventInfo .Right {
	border-bottom: 1px dashed #ccc;
	width: 50%;
}

.Event {
	margin: 5px 0;
	padding: 0;
	width: 95%;
	text-align: center;
}
.Event td {
	text-align: left;
	padding: 2px;
}
.Event .H {
	height: 0;
	padding: 0;
	visibility: hidden;
}
.Event .Ttl {
	font-weight:bold;
	color:#ff8c00;
}







/*更新＆イベント情報*/
.OneEvent {
	width: 265px;
	float: left;
}
.Info_title dt {
	width: 100px;
	float: left;
}
.Info_title dd {
	width: 150px;
	float: left;
	padding: 2px 0 0 5px;
}
.Info_content dt {
	width: 75px;
	height: 60px;
	float: left;
	padding: 5px 0 0 5px;;
}
.Info_content dd {
	width: 170px;
	float: left;
	font-size:14px;
	padding-top: 10px;
}
.Info_content{
	clear:both;
	background:url(https://www.4353p-club.com/trial/images/dotted_border.gif) left bottom no-repeat;
	margin-bottom:8px;
	padding-bottom:8px;
}	
.Bg_TateLine{
	background:url(https://www.4353p-club.com/trial/images/dotted_border_2.gif) 255px top no-repeat;
}	




#Content .news_area{
	width:420px;
	float:left;
	text-align:left;
}
#Content .news_area div{
	padding:8px 15px 8px 15px;
	margin-bottom:5px;	
	background:url(https://www.4353p-club.com/trial/images/bg_news_area.gif) left bottom no-repeat;
}

	#Content .news_area dl.event_content dt{
	width:380px;
	float:left;
	font-size:15px;
	}
	#Content .news_area dl.event_content{
	clear:both;
	background:url(https://www.4353p-club.com/trial/images/dotted_border.gif) left bottom no-repeat;
	margin-bottom:3px;
	padding-bottom:3px;
	width:380px;
	}


#Footer{
	background:url(https://www.4353p-club.com/trial/images/bg_footer.gif) center bottom no-repeat;
	width:100%;
	padding:10px 0;
	margin-top:10px;}
	#Footer dl{	
	width:950px;
	margin:0px auto;
	}
	#Footer dt{	
	width:100px;
	float:left;
	text-align:left;}
	#Footer dd{	
	width:500px;
	float:right;
	text-align:right;
	color:#FFFFFF;
	font-size:12px;}


/*ログイン後*/

.mypage{
	width:625px;
	background:url(https://www.4353p-club.com/trial/images/bg_mypage.gif) left top no-repeat;
	float:left;
	position:relative;
	}
	.mypage dl {
		padding:3px 8px 13px 8px;
		width:340px;
		}
		.mypage dl dt.classIcon {
		width:50px;
		float:left;
		}
		.mypage dl dt.classIcon img {
			padding:0 10px 0 0;
		}
		.mypage dl dd.classname {
			text-align:left;
			font-size:14px;
			padding-bottom:5px;
			margin:0 0 5px 60px;
			}
		.mypage dl dd.realname {
			text-align:left;
			font-size:20px;
			font-weight:bold;
			/*margin:0 0 5px 60px;*/
			position:absolute;
			left:68px;
			top:31px;
			width: 300px;
			}
			
	.mypage dl#datePoint{
			width:145px;
			float:left;
			text-align:right;
			padding:0 0 0 0px;		
			}
			.mypage dl#datePoint dt.day{
				text-align:right;
				font-size:12px;
				padding:3px 5px 5px 0;}
			.mypage dl#datePoint dd.point_number {
				width:115px;
				padding:0px 0 3px 0;}
			.mypage dl#datePoint dd.point_number	{ /padding-right: 33px; } /*IE6,7*/

.action {
	text-align: right;
}
	
.p_club{
	float:right;}
.p_club li{
	float:left;}

.p_number{
	float:left;}
		
			dl.event_title {
	padding:5px 0 0 0;}
	
			.newsIcon { float:left;}
			.newsDate { padding:0 0 5px 0;}
			.newsDetail { padding:0 0 3px 0;
				width:390px!important;}


	
.index_navi{
	position:absolute;
	left:115px;
	top:150px;
	width:770px;
	margin:0 auto;}
	.index_navi ul{
		margin-bottom:10px;
		}		
		.index_navi ul li{
			display:inline;
			margin-right:10px;
			}

.teacher_area_login{
	background:url(https://www.4353p-club.com/trial/images/bg_teacher_login.gif) left top no-repeat;
	float:left;
	text-align:left;
	padding:20px 27px 30px 182px;
	width: 340px;
	height: 170px;
	}
	.teacher_area_login p.title{
	font-size:20px;
	font-weight:bold;
	color:#FF6905;
	padding-bottom:15px;
	}

#Content .news_area_login{
	width:410px;
	background:url(https://www.4353p-club.com/trial/images/bg_news_area_login.gif) left top no-repeat;
	float:left;
	text-align:left;
	padding:13px 0 25px 20px;
	}
	#Content .news_area_login p{
	text-align:right;
	width:390px;
	padding-bottom:19px;
	}	
	#Content .news_area_login dl.event_content dt{
	width:400px;
	float:left;
	font-size:15px;
	}
	#Content .news_area_login dl.event_content{
	clear:both;
	background:url(https://www.4353p-club.com/trial/images/dotted_border.gif) left bottom no-repeat;
	margin-bottom:10px;
	padding-bottom:10px;
	width:390px;
	}

#Footer_login{
	background:url(https://www.4353p-club.com/trial/images/common/bg_footer.gif) center bottom no-repeat;
	width:100%;
	padding:2px 0 1px 0;
}
	#Footer_login dl{	
	width:950px;
	margin:0px auto;
	}
	#Footer_login dt{	
	width:600px;
	float:left;
	text-align:left;}
	
	#Footer_login dt img.sub{
	padding-bottom:10px;
	margin:0 10px;
	}
	
	#Footer_login dd{	
	width:350px;
	float:right;
	text-align:right;
	color:#FFFFFF;
	font-size:12px;
	padding-top:15px;}


.index_navi .learn{
	width:366px;
	height:169px;
	float:left;
	position:relative;
/*	background:url(/img/index/btn_learn_rollout.gif) left top;*/
}
.index_navi .btn_common{
	width:178px;
	height:169px;
	float:left;
}
.point_get{
	position:absolute;
	left:615px; top:65px;
	z-index:1;}
/* 先生のコメント1行目 */
p.title{
	color: #FF6600;
	font-weight: bold;
}



/* 汎用
---------------------------------------------------- */
.Fleft { float:left;}
.Fright { float:right;}
.Center {text-align: center !important;}

.Right  {text-align: right  !important;}
.pr15{padding-right:15px;}
.pb10{padding-bottom:10px;}
.ml10{margin-left:10px;}
.mt10{margin-top:10px;}
.mt30{margin-top:30px;}
.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}

.font16 {font-size:16px!important;}

.red { color:#FF0000;}

.bg_none{
	background:none!important;}	
/* clearfix */
ul#GlobalNavi:after ,
dl.foundation:after ,
#Contents #Main .history-table td dl:after ,
.clearfix:after {
	content: ",";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
ul#GlobalNavi ,
dl.foundation ,
#Contents #Main .history-table td dl ,
.clearfix {
	display: inline-block;
}
.clearfix:after {
    content: ".";
    display: block;
    height: 0px;
    clear: both;
    visibility: hidden;
    font-size: 0.1em;
	}
/* Hides from IE-mac \*/
	*html ul#GlobalNavi ,
	*html dl.foundation ,
	*html #Contents #Main .history-table td dl ,
	*html .clearfix { height: 1%; }
	ul#GlobalNavi ,
	dl.foundation ,
	#Contents #Main .history-table td dl ,
	.clearfix { display: block; }
/* End hide from IE-mac */

/*FFのみオーバー*/
a:hover img, x:-moz-any-link {
filter: alpha(opacity=60);
opacity:0.6;
}

input:hover{
filter: alpha(opacity=60);
opacity:0.6;
}

/* ■20120619追加■ */
#game_trial {
	text-align: right;
	width: 460px;
	margin: 0;
	padding: 0;
	float: right;
	display: inline;
}

.clear {
	clear: both;
}

#game_trial a:hover img {
filter: alpha(Style=0, Opacity=100) !important;
opacity:1 !important;
}