@charset "utf-8";

/*

--------------------------------------------------------

Title:atcafe様向け基礎CSS

Contents:

1.ページ全体設定

2.コンテナボックス・・・全体を囲むdiv

3.ヘッダー

4.コンテンツボックス・・・メインとなるコンテンツを囲む

5.左側ボックス（コンテンツボックスに内包）

6.中央ボックス（コンテンツボックスに内包）

7.右側ボックス（コンテンツボックスに内包）

8.フッター



supplement:

全ページで使用する共通設定のCSSです。

各ページで調整がいる場合は、ページごとのCSSで調整。



Lastupdate:09/14/2008

producer:koizumi

Copyright(c)2008 OPENWEBSYSTEM co. All right reserved

--------------------------------------------------------

*/

/*=====1.ページ全体設定=====*/

body{
	background:url(/images/new/bg02.jpg) repeat-x;
	color:#666;
	font-size:12px;
	line-height:1.5;
	}
body#top{background:url(/images/new/bg.jpg) repeat-x;}

a{color:#069;outline:none;}

hr {display:none;}


/*=====endページ設定=====*/

/* image */
img.mousover:hover{
	opacity:0.6;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
	}
input.mousover:hover{
	opacity:0.6;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
	}

/*=====2.コンテナボックス=====*/

div#container{
	width:960px;
	margin:0 auto;
	padding:0;
	background:#FFF;
	}


/*=====endコンテナボックス=====*/


/*=====3.ヘッダー=====*/

/*一番上*/

h1{
	margin:0;
	line-height:1.3;
	height:23px;
	line-height:23px;
	}

div#header{
	height:109px;
	background:url(/images/new/header02.jpg) no-repeat left top;
	}
#top div#header{background:url(/images/new/header.jpg) no-repeat left top;}

/*ロゴ*/

div#header p#illust{
	float:left;
	width:127px;
	padding:0;
	}

div#header p#logo{
	padding:20px 0 16px 0;
	float:left;
	}

div#header p#description{
	width:330px;
	height:60px;
	font-size:10px;
	line-height:1.3;
	background:#F1F1ED;
	padding:5px;
	margin:12px 0 0 43px;
	color:#666;
	float:left;
	}

div#header p#header_toi{
	width:202px;
	float:right;
	text-indent:0;
	}
div#header p#header_toi a{
	display:block;
	margin:38px 0 0 13px;
	}

div#header h1 {
	padding:2px 0;
	color:#006633;
	font-size:7.5pt;
	font-weight:lighter;
	}




/*=====endヘッダー=====*/


/*=====4.コンテンツボックス=====*/

div#contents{
	padding:10px 15px 45px 15px;
	background:#FFF;
	}

div#contents{display:inline-block;}

html[xmlns] div#contents{display:block;}

* html div#contents{height:1%;}

div#contents:after{
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
	}

#main_img{
	width:960px;
	height:250px;
	background:url(/images/new/mainimg.jpg) no-repeat;
	}
#main_img p{
	width:173px;
	height:215px;
	padding:13px 0 0 787px;
	}


/*=====endコンテンツボックス=====*/



/*=====5.左側ボックス（コンテンツボックス）=====*/

div#leftwrap{
	float:left;
	width:195px;
	margin:0 0 45px 0;
	}

/*メニュー*/

div#leftwrap ul{list-style-type:none;}

div#leftwrap ul li{
	height:30px;
	background:url(/images/new/menu.jpg) no-repeat 0 -30px;
	line-height:30px;
	}

div#leftwrap ul li a{
	display:block;
	height:30px;
	padding:0 0 0 22px;
	background:url(/images/new/menu.jpg) no-repeat 0 0;
	color:#1B1B1B;
	text-decoration:none;
	}

div#leftwrap ul li a:hover{background:none;}
div#leftwrap ul li a:active{background:none;}


/*お気に入り*/

div#leftwrap input{
	width:195px;
	margin:10px 0;
	}

/*枠*/

div#leftwrap div{margin:0 0 20px 0;}

div#leftwrap div h4{
	height:30px;
	text-indent:-9999px;
	}

div#leftwrap div#menu01 h4{background:url(/images/new/menu_tit.jpg) no-repeat left top;}
div#leftwrap div#menu02 h4{background:url(/images/new/menu_tit.jpg) no-repeat left top;}
div#leftwrap div#mobile h4{background:url(/images/new/mobile.jpg) no-repeat left top;}
div#leftwrap div#company h4{background:url(/images/new/company.jpg) no-repeat left top;}

div#company div{
	border-right:solid 1px #880000;
	border-bottom:solid 1px #880000;
	border-left:solid 1px #880000;
	padding:5px;
	background:#EEE;
	color:#1B1B1B;
	}
div#leftwrap div#company div p{margin:0 0 5px 0;}

div#leftwrap p{
	margin:0 0 20px 0;
	line-height:1.5;
	color:#1B1B1B;
	}


@

/*=====end左側ボックス（コンテンツボックス）=====*/


/*=====6.中央ボックス（コンテンツボックス）=====*/

/*=====end中央ボックス（コンテンツボックス）=====*/


/*=====7.右側ボックス（コンテンツボックス）=====*/

div#rightwrap{
	float:right;
	width:715px;
	}

/*段落*/

div#rightwrap p{margin:0 0 1em 0;}

div#rightwrap strong{
	color:#c00;
	font-weight:bold;
	}

div#rightwrap em{background:#FFF0D2;}



/*帯*/

div#rightwrap h3{
	height:40px;
	margin:10px 0 10px 0;
	padding:0 10px 2px 30px;
	background:url(/images/new/obi.jpg) no-repeat left top;
	color:#111;
	font-size:14px;
	font-weight:bold;
	line-height:42px;
	}
div#rightwrap h3.mb_0{margin-bottom:0;}

div#rightwrap h3 a{
	display:block;
	width:130px;
	height:30px;
	margin:-38px 0 0 auto;
	padding:0 20px 0 10px;
	background:url(/images/new/obibtn.gif) no-repeat left top;
	font-size:12px;
	text-decoration:none;
	line-height:30px;
	text-align:center;
	}

/*ボックス*/

div#rightwrap div.graybox{
	margin:0 0 10px 0;
	border:1px solid #dedede;
	background:#f3f3f3;
	}

div#rightwrap div.graybox h4{
	padding:3px 0 3px 10px;
	border-bottom:1px solid #ccc;
	background:#dedede;
	color:#333;
	line-height:1.5;
	font-weight:bold;
	}

div#rightwrap div.graybox dl{padding:10px 10px 0 10px;}

div#rightwrap div.graybox dl dt{font-weight:bold;}

div#rightwrap div.graybox dl dd{
	border-bottom:1px solid #dedede;
	margin:0 0 6px 0;
	padding:0 0 6px 0;
	}

div#rightwrap div.graybox p{margin:10px;}


/*リスト*/

div#rightwrap ul{
	list-style-type:none;
	margin:15px 0;
	}

div#rightwrap ul li{
	padding:2px 0 2px 22px;
	border-bottom:1px solid #dedede;
	background:url(/images/new/point.gif) no-repeat left 4px;
	}

/*数字リスト*/

div#rightwrap ol{
	list-style-type:upper-roman;
	padding:10px 10px 10px 40px;
	border:1px solid #fc0;
	background:#FFF0D2;
	}

div#rightwrap ol li{
	margin:0 0 5px 0;
	color:#333;
	}

div#rightwrap ol li strong{color:#333;}


/*=====end右側ボックス=====*/



/*=====8.フッター=====*/

div#footer{
	clear:both;
	padding:25px 0 0 0;
	background:url(/images/new/border.jpg)  no-repeat left top;
	}

div#footer p{
	padding:10px;
	background:#f3f3f3;
	}

div#footer address{
	margin:0 -15px;
	padding:10px 0 20px 0;
	text-align:center;
	background:none;
	}


/*=====endフッター=====*/



/*=====サブページ用=====*/

/*タイトル下ナビゲーション*/

#submenu{
	display:inline-block;
	width:695px;
	_width:715px;
	margin:0 0 15px 0;
	padding:10px;
	background:#f6f6f6;
	}

html[xmlns]#submenu{display:block;}

* html#submenu{height:1%;}

#submenu:after{
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
	}

div#rightwrap div#submenu p#crumbs{
	float:left;
	width:70%;
	margin:0;
	padding:0;
	font-size:10px;
	}

div#rightwrap div#submenu p#free a{
	display:block;
	float:right;
	width:14em;
	margin:0;
	padding:0;
	background:url(/images/new/free.gif) no-repeat left center;
	text-align:right;
	font-size:10px;
	}
div#rightwrap h3 span{ font-size:10px;}
div#rightwrap h3.toph3{margin-top:0;}

/*枠の拡張*/


div#rightwrap div.onebox ul li.chu{
	list-style-type:none;
	margin:10px 0 0 -1.2em;
	}

div#rightwrap div.onebox p img{margin:0 0 10px 0;}

div#rightwrap div.img2 p img{margin:10px 10px 10px 0;}


.bt_border{
	border-bottom:solid 1px #880000;
	padding-bottom:10px;
	}
	

/*====karekomi====*/	
	/*=====写真のボタン=====*/

	div#rightwrap ul#photos{
		height:240px;
		margin:15px 0 20px 0;
		background:url(/images/top/photos.jpg) no-repeat left top;
	}

	div#rightwrap ul#photos li{
		float:left;
		width:232px;
		margin:0;
		padding:0;
		border:none;
		background:none;
	}

	div#rightwrap ul#photos li a{
		display:block;
		width:232px;
		height:240px;
		padding:13px 13px 0 13px;
		color:#666;
		text-decoration:none;
		line-height:160%;
		}
	div#rightwrap ul#photos li a img{margin:0 0 10px 0;}
	div#rightwrap ul#photos li a strong{
		color:#f90;
		font-weight:bold;
	}
	div#rightwrap ul#photos li.photo_left01{}
	div#rightwrap ul#photos li.photo_left02{margin-left:10px;}
	div#rightwrap ul#photos li.photo_left03{margin-left:9px;}
	div#rightwrap ul#photos li span{
		text-decoration:underline;
		color:#014CB4;
		}
	
	img.freelesson:hover{
		opacity:0.6;
	}



	div#rightwrap #media{
		font-size:14px;  
		margin:5px 0px 20px;
	}
	div#rightwrap #media li{
		list-style:none;      
		background:none;
		padding-left:10px;            
		color:black;
	}


#kousi-h2{
	background:none;
	height:auto;
}

	#container *{
		//font-family:'メイリオ',meiryo;
	}
	#fixedSidebar{

		position:fixed;
		border:solid 1px #ccc;
		width:210px;        
		display:none;       
		top:0;
		bottom:0;
		color:black;
		
	} 
	#fixedSidebar *{
		font-family:'メイリオ',meiryo;
		line-height:150%;
	}
	#fixedSidebar .head{
		border-bottom:solid 1px #ccc;
		background:white;
		width:210px;   
		padding:12px 0px 8px;
		position:fixed;
		top:0;  
		height:49px;
	}
	#fixedSidebar .body{
		padding:10px;  
		background:#eee;
		position:fixed;
		top:70px;
		bottom:0;      
		width:190px;
		padding:10px;
	}            
	#fixedSidebar em{
		background:yellow;
	}
	#fixedSidebar li{
		list-style:none;
	}                 
	#fixedSidebar button{
	border:1px solid #91b41a; -webkit-border-radius: 3px; -moz-border-radius: 3px;border-radius: 3px;font-size:12px;font-family:arial, helvetica, sans-serif; padding: 10px 10px 10px 10px; text-decoration:none; display:inline-block;font-weight:bold; color: black;
	 background-color: #b6e026; background-image: -webkit-gradient(linear, left top, left bottom, from(#b6e026), to(#abdc28));
	 background-image: -webkit-linear-gradient(top, #b6e026, #abdc28);
	 background-image: -moz-linear-gradient(top, #b6e026, #abdc28);
	 background-image: -ms-linear-gradient(top, #b6e026, #abdc28);
	 background-image: -o-linear-gradient(top, #b6e026, #abdc28);
	 background-image: linear-gradient(to bottom, #b6e026, #abdc28);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#b6e026, endColorstr=#abdc28);
	}

	#fixedSidebar button:hover{
	 border:1px solid #718c14;
	 background-color: #95b91a; background-image: -webkit-gradient(linear, left top, left bottom, from(#95b91a), to(#8bb41d));
	 background-image: -webkit-linear-gradient(top, #95b91a, #8bb41d);
	 background-image: -moz-linear-gradient(top, #95b91a, #8bb41d);
	 background-image: -ms-linear-gradient(top, #95b91a, #8bb41d);
	 background-image: -o-linear-gradient(top, #95b91a, #8bb41d);
	 background-image: linear-gradient(to bottom, #95b91a, #8bb41d);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#95b91a, endColorstr=#8bb41d);
	}
	#fixedSidebar button{

		border:solid 1px #ccc;
		padding:10px 20px;   
		font-size:16px;
		width:190px;	
		margin-bottom:10px;
		margin-top:20px;
	}                
	#fixedSidebar #tel{
		width:148px;
		height:20px;
		padding:5px 20px;
		text-align:center;
		font-size:16px;
		font-weight:bold;
		background:yellow;
		margin-top:5px;
	}                
	#fixedSidebar hr{
		margin-bottom: 10px;
		display: block;
		margin-top: 10px;
		border-color:#ccc;
	}
	#fixedSidebar h3{
	}
	
	#fixedAreaList{
	}	            
	#fixedAreaList span{
	 padding:0px 5px 0px 0px; 
	 font-size:11px;
	}    
	#fixedSidebar button{
		cursor:pointer;
	}         


/* for mobile menu 14.11.11 */

.visible-mobile-inline,
.visible-mobile-block{
	display:none;
}

div#rightwrap.mobile.k .listFrame{
	overflow:hidden;
}