@charset "utf-8";

/* -----------------------------------------------------------
CSS Information

 File name:      style.css
 Author:         GORI Style　DOI NORIKO
 Style Info:     スマイルスタジオ様用のCSS
----------------------------------------------------------- */
/*-----------------------------------------------
 ■ブラウザリセット
-----------------------------------------------*/
html {
	overflow-y: scroll;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin: 0;
	padding: 0;
}

address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption,th {
	text-align: left;
}

q:before,q:after {
	content: '';
}

object,
embed {
	vertical-align: top;
}

hr,legend {
	display: none;
}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
}

img,abbr,acronym,fieldset {
	border: 0;
}

li {
	list-style-type: none;
}

p {
	margin-bottom: 1em;
}
/*--------------------------------------------------------
■基本設定
--------------------------------------------------------*/

body{
	background: url(cmn_img/bg.jpg) repeat-x center top #fff;
	margin: 0;
	font-family: "ＭＳ Ｐゴシック","平成角ゴシック",sans-serif;
	font-size: 0.8em;/*文字サイズ*/
	color: #666;/*文字色*/
	line-height:130%;/*行間*/
	text-align: left;
}

/*-----------------------------------------------
 ■基本のリンク設定
-----------------------------------------------*/

a {
	text-decoration:none;
	color: #004D99!important;
}

a:link {
}

a:visited {
}

a:hover {
	text-decoration:underline;
}

a:active {
}


/*-----------------------------------------------
 ■コンテナ設定
-----------------------------------------------*/

#container {
	width:770px;
	margin:0 auto;
	padding:0;
}

/*-----------------------------------------------
 ■ヘッダー設定
-----------------------------------------------*/

#header {
	background:url(cmn_img/bg_header.jpg) no-repeat center top;
	width:770px;
	height:325px;
	margin:0;
}

#header h1 {
	padding:5px 15px 0;
}

/*●最上部メニューリスト（サイトマップ、個人情報保護方針等）*/
#top-menu-list{
	left: 350px;
	top: 7px;
	width: 760px;
	text-align:right;
}

#top-menu-list li{
	display:inline;
	font-size: 9pt;
	color: #333333;
}

#top-menu-list li a:link{ color: #333333; }
#top-menu-list li a:hover{ color: #33CCFF; }
#top-menu-list li a:visited{ color: #333333; }

/*-----------------------------------------------
 ■フッター設定
-----------------------------------------------*/

#footer {
	clear:both;
	width:770px;
	height:61px;
	margin-bottom:15px;
	background:#333;
	background:url(cmn_img/bg_footer.jpg) no-repeat center top;
}

#footer ul {
	margin:0px auto;
	padding:5px;
	text-align:center;
}

#footer ul li {
	display:inline;
	margin-right:5px;
	padding-left:9px;
	line-height:1.1;
	border-left:1px solid white;
}

#footer ul li.utilityHome {
	border-left:0;
}

#footer p#copyright {
	text-align:center;
	margin-bottom:0;
}

#footer li a:link{ color: #ffffff!important; }
#footer li a:hover{ color: #FFCC00!important; }
#footer li a:visited{ color: #ffffff!important; }
/*-----------------------------------------------
 ■コンテンツ
-----------------------------------------------*/

#contents {
	/*position:absolute;
	top:345px;*/
	background:url(cmn_img/bg_page2.jpg) no-repeat center top;
	width:770px;
	float:left;
	overflow:hidden;
}

#contents_page {
	background:url(cmn_img/bg_page.jpg) repeat-y center top;
	width:770px;
	float:left;
	overflow:hidden;
}

#contents_page2 {
	/*position:absolute;
	top:345px;*/
	background:url(cmn_img/bg_page2.jpg) no-repeat center top;
	width:770px;
	float:left;
	overflow:hidden;
}
/* メインエリア（右側）
------------------------------------------*/

#main {
	float:right;
	width:550px;
	color:#666;
	overflow:hidden;
	margin-bottom: 20px;
}

#main-page {
	float:right;
	width:545px;
	color:#666;
	overflow:hidden;
}

#main a {
	color:blue;
}

#main p {
	padding:3px 20px 3px 20px;
	line-height:130%;
	font-size:10.5pt;
}

#main-page p {
	padding:10px 30px 0px 20px;
	line-height:130%;
	font-size:10pt
}
.catch {
	background:url(index_images/c2.png) no-repeat top;
	padding-left:5px;
	width:530px;
	height:267px;
	margin-bottom:15px;
}

.b1 {
	background:url(index_images/c3.jpg) no-repeat top;
	width:260px;
	height:290px;
	padding:10px 4px;
	float:left;
}/**/




.b2 {
	background:url(index_images/c4.jpg) no-repeat top;
	width:260px;
	height:290px;
	padding:10px 4px;
	float:left;
}/**/



.b3 {
	background:url(rentalfee_images/b1.gif) no-repeat top;
	width:498px;
	height:135px;
	}

.b4 {
	background:url(rentalfee_images/b2.jpg) no-repeat top;
	width:479px;
	height:244px;
	margin-left:20px;
	margin-top:30px;
	padding-top:55px;
	font-size:9.5pt!important;
	}


.b5 {
	border:3px dashed #FF6633;
	background-color: #FFF9E1;
	margin:20px 30px 20px 20px;
	padding:20px 10px 20px 20px;
}
	
.b5 h2 {
	font-size:14pt;
	font-weight:bold;
	color:#FF3300;
	border-bottom:double solid #FF6633;
} 

.b6 {
	border:3px dashed #0099CC;
	background-color: #FFFFFF;
	margin:20px 30px 20px 20px;
	padding:10px;
}
	
.b6 h2 {
	font-size:14pt;
	font-weight:bold;
	color:#0099CC;
} 
/*--List menu orange---------------*/
dl.list309 dt {  
	clear: left;  
	float: left;  
	margin: 0 0 0.8em;  
	width: 7.5em;  
	border-left: solid 6px #FF6633;  
	padding-left: 5px;  
	color: #000;
	}
	
dl.list309 dd {  
	margin-bottom: 0.8em;  
	margin-left: 7.5em;
	}
	
.lesson {
	width:500px;
	border-top:2px solid #FF9900;
	border-bottom:2px solid #FF9900;
	margin:20px 10px;
	padding:10px 5px;
	color:#333333;
}

dl.lesson dt {  
	clear: left;  
	float: left;  
	margin: 0 0 0.8em;  
	width: 7em;  
	border-left: solid 5px #FFCC33;  
	padding-left: 5px;
	padding-top:2px;
	font-size:10pt;
	}
	
dl.lesson dd {  
	margin-bottom: 0.8em;
	margin-left: 7em;
	padding-top:2px;
	font-size:9pt;
	}
/*--List menu blue---------------*/
dl.list310 dd {  
	margin-bottom: 0.8em;  
	margin-left: 7.5em;
	}
	
.lesson2 {
	width:500px;
	/*border-top:2px solid #00CCFF;
	border-bottom:2px solid #00CCFF;
	margin:10px;*/
	padding:5px;
	color:#333333;
}

dl.lesson2 dt {  
	clear: left;  
	float: left;  
	margin: 0 0 0.8em;  
	width: 8em;  
	border-left: solid 5px #00CCFF;  
	padding-left: 5px;
	padding-top:2px;
	font-size:10pt;
	}
	
dl.lesson2 dd {  
	margin-bottom: 0.8em;
	margin-left: 8em;
	padding-top:2px;
	font-size:9pt;
	}

/*--List menu red---------------*/
dl.list311 dd {  
	margin-bottom: 0.8em;  
	margin-left: 7.5em;
	}
	
.lesson3 {
	width:500px;
	padding:5px;
	color:#333333;
}

dl.lesson3 dt {  
	clear: left;  
	float: left;  
	margin: 0 0 0.8em;  
	width: 8em;  
	border-left: solid 5px #ff0000;  
	padding-left: 5px;
	padding-top:2px;
	font-size:10pt;
	}
	
dl.lesson3 dd {  
	margin-bottom: 0.8em;
	margin-left: 8em;
	padding-top:2px;
	font-size:9pt;
	}

/*--レッスンページ用タイトル設定-------------------*/
h3.lesson_t {
	background:url(cmn_img/bg_title.gif) repeat-x;
	height:28px;
	width:490px;
	padding:5px 10px;
	font-size:12pt;
	color:#E73667;
	margin:20px 5px 10px 5px;
	clear:both;
}

/*--夏休み企画用タイトル設定-------------------*/
h3.lesson_summer {
	background:url(kids-summer_images/t2.jpg) no-repeat;
	height:69px;
	width:525px;
	padding:49px 10px 0px 10px;
	font-size:12pt;
	color:#ffffff;
	margin:5px 5px 0px 5px;
}

/*--秋の無料体験用タイトル設定-------------------*/
h3.autumn_special {
	background:url(autumn2009_images/t2.jpg) no-repeat;
	height:60px;
	width:525px;
	padding:33px 10px 0px 10px;
	font-size:12pt;
	color:#333333;
	margin:0px 5px;
}

h2.autumn_special {
	border-left:#FFCC66 solid 5px;
	width:525px;
	padding:0px 10px;
	font-size:12pt;
	color:#333333;
	margin:0px;
}


.mama1{
	clear:both;
	background:url(mama-support_images/b2_a.gif) no-repeat top;
	float:left;
	margin:0;
	padding:0;
	width:530px;
	height:190px;
}

.mama2{
	clear:both;
	background:url(mama-support_images/b3_a.gif) no-repeat top;
	float:left;
	margin:0;
	padding:0;
	width:530px;
	height:190px;
	font-size:10pt;
}

.mama3{
	clear:both;
	background:url(mama-support_images/b4_a.gif) no-repeat top;
	float:left;
	margin:0 0 20px 0;
	padding:0;
	width:530px;
	height:190px;
	font-size:10pt;
}

.mama1 p {
	margin:0;
	}
	
.mama2 p {
	margin:0;
	}
.mama3 p {
	margin:0;
	}
/* サブメニュー（左側）
------------------------------------------*/

#sub {
	float:left;
	width:210px;
	overflow:hidden;
	line-height:0px;
}

#sub .menu1{
	background:url(cmn_img/menu_2.jpg) no-repeat top;
	/*height:297px;*/
	height:310px;
	width:190px;
	margin-bottom:20px;
	margin-left:15px;
}

#sub .menu2{
	clear:both;
	background:url(cmn_img/menu_2.jpg) no-repeat top;
	/*background-color:#eff6e8;
	border-left:1px solid #dde7d4;
	border-right:1px solid #dde7d4;
	border-bottom:1px solid #dde7d4;*/
	height:530px;
	width:190px;
	margin-bottom:20px;
	margin-left:15px;
}

#sub .menu3{
	clear:both;
	background:url(cmn_img/menu_2.jpg) no-repeat top;
	height:550px;
	width:190px;
	margin-bottom:20px;
	margin-left:15px;
}

#sub ul {
	display:block;
	line-height:0px;
}

#sub ul li {
 float: left;
 display: block;
 list-style-type: none;
 font:1px;
 line-height:1px;
}

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



#sub .add{
	clear:both;
	background-color:#fff;
	height:270px;
	width:160px;
	margin-top:60px!important;
	_margin-top:20px!important;
	margin-left:10px;
	padding:5px;
}




/*--------------------------------------------------------
■パンクズナビの設定
--------------------------------------------------------*/
#pan{
	width: 520px;
	height: 20px;
	text-align:right;
}

#pan li{
	margin: 6px 0 0 4px;
	font-size: 8.5pt;
	line-height: 14pt;
	display:inline;
}

/*--------------------------------------------------------
■画像配置の設定
--------------------------------------------------------*/

/*左に画像、右に文章*/
.left{
	float: left;
	margin: 0px 30px 20px 0px;
}

/*左に文章、右に画像*/
.right{
	float: right;
	margin: 0px 0px 20px 30px;
}


/*--------------------------------------------------------
■見出しタグ・装飾タグの設定
--------------------------------------------------------*/


/*●文字色（<span class="red">などとして使用）*/
.black{ color: #000000;}/*黒色テキスト*/
.red{ color: #ff0000;}/*赤色テキスト*/
.blue{ color: #0000dd;}/*青色テキスト*/
.green{ color: #008000;}/*緑色テキスト*/
.yellow{ color: #ffff00;}/*黄色テキスト*/
.navy{ color: #1F26A9;}/*紺色テキスト*/
.gray{ color: #cccccc;}/*灰色テキスト*/
.orange{ color: #ff6600;}/*橙色テキスト*/
.pink{ color: #cc6699;}/*ピンク色テキスト*/
.purple{ color: #660099;}/*紫色テキスト*/
.olive{ color: #808000;}/*黄土色テキスト*/
.lime{ color: #00ff00;}/*黄緑テキスト*/
.aqua{ color: #167FA6;}/*黄緑テキスト*/

.b {
	font-weight:bold;
	color:#666;
	}

.waku0 {
	border:#cccccc solid 1px;
	background-color:#fff;
	padding:2px;
	margin:5px;
	}

.waku {
	border:#FF6600 solid 1px;
	background-color:#fff;
	padding:10px 0px 10px 10px;
	margin:20px 20px 20px 10px;
	}
	
.waku2 {
	border: #0033CC solid 1px;
	background-color:#fff;
	padding:10px;
	margin:10px 30px 10px 20px;
	}
	
.waku3 {
	border: #FF6600 solid 1px;
	background-color:#fff;
	padding:10px;
	margin:10px 30px 10px 20px;
	}
.waku4 {
	border:#FF6600 solid 1px;
	background-color:#fff;
	padding:2px;
	margin:5px;
	}
	
.waku5 {
	border:#FF6600 solid 1px;
	background-color:#fff;
	padding:2px;
	margin:3px;
	}

.pic {
	border:1px solid #ccc;
	padding:2px;
	float:right;
	}

.lesson_menu{
	background:url(cmn_img/allow.gif) left center no-repeat;
	padding: 3px 3px 3px 18px;
	font-weight: bold;
	font-size:1em;
}

/*●戻る＆進むリンク*/
.link-back,.link-next{
	padding: 3px;
	margin: 30px 0px 30px 0px;
	font-weight: bold;
	font-size:1.2em;
	clear: both;
}

.link-back{ float: left;}
.link-next{ float: right;}
.link-top{ float: right;}

.link-top{
	background:url(cmn_img/icon5.gif) right center no-repeat;
	padding: 3px 15px 3px 3px;
	margin: 20px 20px 20px 0px;
	font-weight: bold;
	font-size:1em;
	clear: both;
}

.link-lesson{
	padding: 3px;
	margin: 0px 20px 20px 10px;
	font-weight: bold;
	font-size:1.2em;
	color:#FF3333;
	float:right;
}


/*●アンダーライン*/
.underline{ text-decoration:underline;}


/*●取り消し線*/
.not{ text-decoration:line-through;}


/*●強調1*/
.impact{
	padding: 0px;
	color: #000000;
	background-color: #ffff66;
}


.m10{ margin: 10px!important; }/*周りからのmarginが10px*/
.m10-t{ margin-top: 10px!important; }/*上からのmarginが10px*/
.m10-r{ margin-right: 10px!important; }/*右からのmarginが10px*/
.m10-b{ margin-bottom: 10px!important; }/*下からのmarginが10px*/
.m10-l{ margin-left: 10px!important; }/*左からのmarginが10px*/

.m15{ margin: 15px!important; }
.m15-t{ margin-top: 15px!important; }
.m15-r{ margin-right: 15px!important; }
.m15-b{ margin-bottom: 15px!important; }
.m15-l{ margin-left: 15px!important; }

.m16-l{ margin-left: 16px!important; }
.m18-t{ margin-top: 18px!important; }

.m20{ margin: 20px!important; }
.m20-t{ margin-top: 20px!important; }
.m20-r{ margin-right: 20px!important; }
.m20-b{ margin-bottom: 20px!important; }
.m20-l{ margin-left: 20px!important; }

.m30{ margin: 30px!important; }
.m30-t{ margin-top: 30px!important; }
.m30-r{ margin-right: 30px!important; }
.m30-b{ margin-bottom: 30px!important; }
.m30-l{ margin-left: 30px!important; }

.m45-t{ margin-top: 45px!important; }

.m40{ margin: 40px!important; }
.m40-t{ margin-top: 40px!important; }
.m40-r{ margin-right: 40px!important; }
.m40-b{ margin-bottom: 40px!important; }
.m40-l{ margin-left: 40px!important; }

.m50{ margin: 50px!important; }
.m50-t{ margin-top: 50px!important; }
.m50-r{ margin-right: 50px!important; }
.m50-b{ margin-bottom: 50px!important; }
.m50-l{ margin-left: 50px!important; }

.m60{ margin: 60px!important; }
.m60-t{ margin-top: 60px!important; }
.m60-r{ margin-right: 60px!important; }
.m60-b{ margin-bottom: 60px!important; }
.m60-l{ margin-left: 60px!important; }

.m100-l{ margin-left: 100px!important; }
.m120-l{ margin-left: 120px!important; }
.m200-l{ margin-left: 200px!important; }
.m200-t{ margin-top: 200px!important; }
.m210-t{ margin-top: 210px!important; }
.m220-t{ margin-top: 220px!important; }
.m230-t{ margin-top: 230px!important; }
.m240-t{ margin-top: 240px!important; }

.p0{ padding: 0px!important; }/*周りからのmarginを0にする*/
.p0-t{ padding-top: 0px!important; }/*上からのmarginが0px*/
.p0-r{ padding-right: 0px!important; }/*右からのmarginが0px*/
.p0-b{ padding-bottom: 0px!important; }/*下からのmarginが0px*/
.p0-l{ padding-left: 0px!important; }/*左からのmarginが0px*/

.p10{ padding: 10px!important; }/*周りからのmarginが10px*/
.p10-t{ padding-top: 10px!important; }/*上からのmarginが10px*/
.p10-r{ padding-right: 10px!important; }/*右からのmarginが10px*/
.p10-b{ padding-bottom: 10px!important; }/*下からのmarginが10px*/
.p10-l{ padding-left: 10px!important; }/*左からのmarginが10px*/

.p15{ padding: 15px!important; }
.p15-t{ padding-top: 15px!important; }
.p15-r{ padding-right: 15px!important; }
.p15-b{ padding-bottom: 15px!important; }
.p15-l{ padding-left: 15px!important; }

.p20{ padding: 20px!important; }
.p20-t{ padding-top: 20px!important; }
.p20-r{ padding-right: 20px!important; }
.p20-b{ padding-bottom: 20px!important; }
.p20-l{ padding-left: 20px!important; }

.p30{ padding: 30px!important; }
.p30-t{ padding-top: 30px!important; }
.p30-r{ padding-right: 30px!important; }
.p30-b{ padding-bottom: 30px!important; }
.p30-l{ padding-left: 30px!important; }

.p40{ padding: 40px!important; }
.p40-t{ padding-top: 40px!important; }
.p40-r{ padding-right: 40px!important; }
.p40-b{ padding-bottom: 40px!important; }
.p40-l{ padding-left: 40px!important; }

.p50{ padding: 50px!important; }
.p50-t{ padding-top: 50px!important; }
.p50-r{ padding-right: 50px!important; }
.p50-b{ padding-bottom: 50px!important; }
.p50-l{ padding-left: 50px!important; }

.p55-t{ padding-top: 55px!important; }

.p60-l{ padding-left: 60px!important; }
.p65-l{ padding-left: 65px!important; }

.p90-l{ padding-left: 90px!important; }

.big{ font-size: 120%!important; }
.big2{ font-size: 150%!important; }
.big3{ font-size: 180%!important; }

.small{ font-size: 80%!important; }

.f08em{ font-size: 0.8em; }
.f09em{ font-size: 0.9em; }
.f10em{ font-size: 1.0em; }
.f11em{ font-size: 1.1em; }
.f12em{ font-size: 1.2em; }
.f13em{ font-size: 1.3em; }
.f14em{ font-size: 1.4em; }
.f16em{ font-size: 1.6em; }
.f18em{ font-size: 1.8em; }
.f20em{ font-size: 2.0em; }
.f22em{ font-size: 2.2em; }
.f24em{ font-size: 2.4em; }

.f8pt{ font-size: 8.5pt!important; }
.f9pt{ font-size: 9.0pt!important; }
.f10pt{ font-size: 10pt!important; }
.f11pt{ font-size: 11pt!important; }
.f12pt{ font-size: 12pt!important; }
.f13pt{ font-size: 13pt!important; }
.f14pt{ font-size: 14pt!important; }
.f16pt{ font-size: 16pt!important; }
.f18pt{ font-size: 18pt!important; }
.f20pt{ font-size: 20pt!important; }
.f22pt{ font-size: 22pt!important; }
.f24pt{ font-size: 24pt!important; }

/*------------------------------------------------------------
line-height・・・行間の設定
-------------------------------------------------------------*/
.lh12{ line-height: 1.2em!important; }
.lh13{ line-height: 1.3em!important; }
.lh14{ line-height: 1.4em!important; }
.lh15{ line-height: 1.5em!important; }
.lh16{ line-height: 1.6em!important; }
.lh17{ line-height: 1.7em!important; }
.lh18{ line-height: 1.8em!important; }
.lh19{ line-height: 1.9em!important; }
.lh20{ line-height: 2.0em!important; }