/*

Theme Name: ホアピリ
Theme URI: 
Author:  obara tsutomu

*/

/* 基本設定 */
* {
	margin: 0;
	padding: 0;
}

html, body {
	height: 100%;
	font-size:12px;
	font-family:"Meiryo", "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3";
	LINE-HEIGHT: 180%;
	background-image:url(images/bg_head.gif);
	background-repeat: repeat-x;	
}

img {
	border:0;
	padding: 0;
	margin: 0;
	vertical-align:bottom;
}

a{
	color: #3399FF;
}

a:visited {
	color: #3399FF;
}

a:hover {
	color: #00CCFF;
}

.clear{
	clear:both;
}

p{
	padding:0;
	margin:0;
}

p.squeezeUP{
	padding:0;
	margin:0 0 15px 0;

}

p.midashi12 {
	font-size: 12px;
	font-weight: bold;
	padding: 0;
}

p.midashi14 {
	font-size: 14px;
	font-weight: bold;
	padding: 5px 0;
}

h2,h3{
	padding:0;
	margin:0;
}

h4 {
	margin: 0 0 8px 0;
	padding: 0 0 3px 0;
	border-bottom: 1px dotted #666666;
	font-size: 14px;
	color: #000099;
}

#wrapper {
	width: 900px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -100px; /* the bottom margin is the negative value of the footer's height */
	padding: 0px;
	color: #333333;
}

/* ヘッダー部分 */
#header {
	width: 100%;
	height: 87px;
	margin: 0;
	padding: 5px 0 8px 0;
}

#header #title {
	margin: 0;
	padding: 0;	
}

#header #title a {
	width:430px;
	height:82px;	
	overflow: hidden;
	text-indent:-600px;

}

#header #title a:visited {
	padding:0;
	margin:0;
	display:block;
}

#header #title a:link {
	padding:0;
	margin:0;
	display:block;
}

#header #title a.logo {
	background-image: url(images/logo.gif);
	background-repeat: no-repeat;
	text-decoration:none;
}

#header div#description {
	margin: 5px 0px 0px 30px;
	padding: 0px;
	color: #666666;
	font-size: 1.2em;
	text-align: left;
}

/* ナビゲーション */

#navigation {
	width: 100%;
	margin: 0px;
	padding: 0;
	height: 240px;
}

/* コンテンツ */

#main-wrapper  {
	width: 900px;
	margin: 0;
	padding: 5px 0 0 0;
}

#main-wrapper #contents {
	width: 630px;
	float: right;
	padding: 10px 10px 0 8px;
}

#topanchor {
	margin: 0;
	padding: 5px 5px 15px 0;
	display: block;
	text-align:right;
}

/* サイドバー */
#sidebar {
	width: 240px;
	margin: 0;
	padding: 5px;
	float: left;
}

#sidebar #menu {
	background-image: url(images/sidemenu_bg.gif);
	background-repeat: no-repeat;
	height: 357px;
	width: 230px;
	margin: 0 0 10px 0;
	padding: 4px 6px 0 6px;
}

#sidebar #mobile {
	background-image: url(images/sidemobile_bg.gif);
	height: 160px;
	width: 230px;
	margin: 0 0 10px 0;
	padding: 5px 6px 0 6px;
	background-repeat: no-repeat;
}
#sidebar #menu ul.menulist {
	list-style: none;
	width: 230px;
	padding: 0;
	margin: 0;
}
#sidebar #menu ul.menulist li a {
	padding:0;
	margin:0;
	height: 44px;
	overflow:hidden;
	text-indent:-300px;
}

#sidebar #menu ul.menulist li a:link {
	padding:0;
	margin:0;
	display:block;
}

#sidebar #menu ul.menulist li a:visited {
	padding:0;
	margin:0;
	display:block;
}
#sidebar #menu ul.menulist a.about {
	background-image: url(images/about.gif);
}

#sidebar #menu ul.menulist a.about:hover {
	background-position:0 -44px;
}
#sidebar #menu ul.menulist a.introduction {
	background-image: url(images/introduction.gif);
}

#sidebar #menu ul.menulist a.introduction:hover {
	background-position:0 -44px;
}

#sidebar #menu ul.menulist a.lesson {
	background-image: url(images/lesson.gif);
}

#sidebar #menu ul.menulist a.lesson:hover {
	background-position:0 -44px;
}

#sidebar #menu ul.menulist a.class {
	background-image: url(images/class.gif);
}

#sidebar #menu ul.menulist a.class:hover {
	background-position:0 -44px;
}

#sidebar #menu ul.menulist a.event {
	background-image: url(images/event.gif);
}

#sidebar #menu ul.menulist a.event:hover {
	background-position:0 -44px;
}

#sidebar #menu ul.menulist a.photo {
	background-image: url(images/photo.gif);
}

#sidebar #menu ul.menulist a.photo:hover {
	background-position:0 -44px;
}

#sidebar #menu ul.menulist a.home {
	background-image: url(images/home.gif);
}

#sidebar #menu ul.menulist a.home:hover {
	background-position:0 -43px;
}

#sidebar #bunner {
	width: 242px;
	margin: 0;
}
#sidebar #bunner li.contact {
	padding: 0 1px;
	margin: 0 0 10px 0;
	text-align: center;
	list-style:none;
}
#sidebar #bunner li.staffblog {
	margin: 0px;
	padding: 0 1px;
	list-style:none;
}

#push {
	height: 100px; /* .push must be the same height as .footer */
}

/* フッター */
#footer {
	width: 100%;
	height: 100px;
	margin: 0;
	padding: 0;
	background-image: url(images/bg_foot.gif);
}
#footer #footer-box {
	width: 900px;
	margin: 0 auto;
	text-align: center;
	padding: 10px 0 0 0;
}
#footer #footer-box p {
	margin: 0px;
	padding: 5px 0 0 0;
}

#footer #footer-box ul {
	list-style-type: none;	
}

#footer #footer-box li {	
	padding:0;
	margin:0;
	display:inline;
}

/*携帯版案内*/

#mobile #mobilearea {
	width: 230px;
	padding: 0;
	margin: 0;
}

/*コンセプト*/

#concept {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 20px 0;
}
#concept h3 {
	padding:0;
	margin:0;
	height:31px;
	
}
#concept #concept-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;

}
#concept #concept-area {
	padding: 10px 10px 0 10px;
	margin: 0;
}

#concept #concept-area #concept-read {
	margin: 0px;
	padding: 0 0 10px 0;
	float: left;
	width: 355px;
}
#concept #concept-area #concept-img {
	margin: 0px;
	padding: 0px;
	float: right;
	width: 249px;
}

/*ニュースリリース*/
#newsrelease {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 20px 0;
}

#newsrelease h3 {
	padding:0;
	margin:0;
	height:31px;
}

#newsrelease #newsrelease-title {
	padding:0 0 0 10px;
	margin:0;
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	position: relative;
}

#newsrelease #newsrelease-title #linkarea {
	width: 118px;
	position: absolute;
	left: 490px;
	top: 5px;
	height: 20px;
}

#newsrelease #newsrelease-title #newsrelease-link {
	margin: 0px;
	padding: 0px;
	height: 23px;
	width: 100px;
	position: absolute;
	left: 505px;
	top: 3px;
}

#newsrelease #newsrelease-title #linkarea a.rsslink {
	margin: 0px;
	padding: 0px;
	position: absolute;
	left: 82px;
	top: 0px;
}
#newsrelease #newsrelease-title #linkarea a.listlink {
	margin: 0px;
	padding: 0 0 0 23px;
	position: absolute;
	width: 46px;
	background-image: url(images/list_arrow.gif);
	background-repeat: no-repeat;
	background-position: left center;
	left: 2px;
}
#newsrelease #newsrelease-title #linkarea a {
	color: #000000;
	text-decoration:none;
}

#newsrelease #newsrelease-title #linkarea a:hover {
	color: #000000;
	text-decoration:underline;
}

#newsrelease #newsrelease-entry {
	padding: 10px;
	margin:0;
}

#newsrelease #newsrelease-entry dl {
	border-bottom:1px dotted #999;
}   
#newsrelease #newsrelease-entry dt {
	float:left;
	width:80px;
	padding:5px 0 4px 15px;
	clear:both;
	font-weight:normal;
	background-image: url(images/news_arrow.gif);
	background-repeat: no-repeat;
	background-position:left center;
	margin: 0;
	font-size: 14px;
}   
#newsrelease #newsrelease-entry dd {
	margin-left:110px;
	padding:5px 5px 10px 10px;
	width: 480px;
}

#newsrelease #newsrelease-entry dd p.read {
	margin: 0px;
	padding: 0px;
	width: 480px;
}

#newsrelease #newsrelease-entry dd p.newstitle01 {
	font-weight: bold;
	margin: 0px;
	padding: 0 0 3px 0;
	font-size: 14px;
	color:#F60;
}

#newsrelease #newsrelease-entry dd p.newstitle01 img {
	vertical-align:middle;
}

#newsrelease #newsrelease-entry dd p.newstitle {
	font-weight: bold;
	margin: 0px;
	padding: 0 45px 3px 0;
	font-size: 14px;
}

#newsrelease #newsrelease-backno {
	text-align: right;
	padding: 10px 5px 5px 0;
}

#newsrelease #newsrelease-navi {
	text-align: center;
	padding:0;
	margin:10px 0;
}

#newsrelease #newsrelease-back {
	text-align: left;
	padding:0;
	margin:10px 0;
}
#newsrelease #newsrelease-entry #newsrelease-backno a {
	background-image: url(images/newsback_arrow.gif);
	background-repeat: no-repeat;
	background-position:left center;
	padding: 0 0 0 15px;
	margin: 0;
}

/*リンクエリア*/

#link-area {
	margin: 0 0 15px 0;
	padding: 0px;
	text-align: center;
}

#link-area .bunner {
	width: 210px;
	padding:0 0 10px 0;
	margin:0px;
	float: left;
}

#link-area #bunnerdata {
	margin: 0;
	padding: 10px 0 0 0;
	text-align: left;
	height: 80px;
}

#link-area #bunnerdata #bunnerread {
	margin: 0px;
	padding: 0 5px;
	width: 415px;
	float: left;
	height: 40px;
	vertical-align: text-top;
}

#link-area #bunnerimage {
	margin: 0px;
	padding: 0px;
	width: 200px;
	float: left;
}

/*フラッて？*/

#howhula {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}
#howhula h3 {
	padding:0;
	margin:0;
	height:31px;
}
#howhula #howhula-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#howhula #howhula-area {
	padding: 10px;
	margin: 0;
}
#howhula #howhula-area p.midashi {
	font-size: 14px;
	font-weight: bold;
	padding: 0 0 10px 0;
}

#howhula #howhula-area #howhula-read {
	margin: 0;
	padding: 0;
	width:420px;
	float: left;
}

#howhula #howhula-area #howhula-read p {
	margin: 0px;
	padding: 5px 0;
}

#howhula #howhula-area #areaimg {
	margin: 0px;
	padding: 35px 0 0 0;
	float: right;
}


/*講師紹介*/
#introduction {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 20px 0;
}
#introduction h3 {
	padding:0;
	margin:0;
	height:31px;
}

#introduction #introduction-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#introduction #introduction-area {
	padding: 10px;
	margin: 0;
}

#introduction #introduction-area #introductionimg {
	margin: 0px;
	padding: 0px;
	float: left;
	width: 208px;
}
#introduction #introduction-area #introductionlead {
	margin: 0px;
	padding: 0px;
	float: right;
	width: 390px;
}
#introduction #introduction-area #introductionlead p {
	margin: 0px;
	padding: 0 0 10px 0;
}
#introduction #introduction-area .introductionname {
	margin: 0px;
	padding: 10px 0;
	display: block;
}
#introduction #introduction-area .introductionleadl {
	margin: 0px;
	padding: 0 0 15px 0;
	display: block;
}

#introduction #introduction-area #readleft {
	margin: 0px;
	padding: 0px;
	width: 310px;
	float: left;
}
#introduction #introduction-area #introhead {
	margin: 0px;
	padding: 0px;
	background-image: url(images/introduction_backimage.gif);
	background-repeat: no-repeat;
	height:230px;
}

#introduction #introduction-area #introhead #imgright {
	margin: 0px;
	padding: 0 0 10px 0;
	width: 300px;
	float: right;
	text-align: center;
}

/*教室案内*/

#classroom {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}

#classroom h3 {
	padding:0;
	margin:0;
	height:31px;
}

#classroom #classroom-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#classroom #classroom-area {
	padding: 10px 10px 15px 10px;
	margin: 0;
}

#classroom #classroom-area #map {
	text-align: center;
	margin: 0 0 10px 0;
}

#classroom #classroom-classdata {
	margin: 0px;
	padding: 0;
}

#classroom #classroom-area #classroom-classdata .lessonphoto {
	margin: 0px;
	padding: 0px;
	width: 202px;
	float: left;
	text-align: center;
}

/*お問い合わせ*/

#contactform {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}
#contactform #contactform-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#contactform #contactform-area {
	padding: 10px 80px;
	margin: 0;
}

/*フォトギャラリー*/
#photogallery {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}
#photogallery #photogallery-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#photogallery #photogallery-area {
	padding: 10px;
	margin: 0;
}

#photogallery #photogallery-area .sum {
	margin: 0px;
	padding: 2px 5px 15px 5px;
	width: 192px;
	float: left;
	text-align: center;
	height: 210px;
}

#photogallery #photogallery-area .sum .phototitle {
	margin: 5px 0;
	padding: 0px;
}


#photogallery #photogallery-area .sum img {
	border:2px solid #dddddd;
}

#photogallery #photogallery-area .sum a:hover img {
	border:2px solid #00CCFF;
}

#photogallery #photogallery-area .sum a {
	text-decoration:underline;
}

#photogallery #photogallery-area #backlink {
	margin: 0px;
	padding: 0 0 0 10px;
}

#photogallery #photogallery-area #backlink a.link {
	background-image: url(images/photoback_arrow.gif);
	margin: 0px;
	padding: 0 0 0 15px;
	background-repeat: no-repeat;
	background-position: left center;
}

/*レッスン*/

#lesson {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}

#lesson h3 {
	padding:0;
	margin:0;
	height:31px;
}

#lesson #lesson-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#lesson #lesson-area {
	padding: 10px;
	margin: 0;
}

#lesson #lesson-area #free-lesson p.caution {
	color: #FF0000;
	padding: 0px;
	margin: 0;
}

#lesson #lesson-area table.course {
	margin: 10px 0 20px 0;
	padding: 0px;
	width: 100%;
	border: 1px solid #cccccc;
	border-collapse: collapse;
}

#lesson #lesson-area table.course th {
	width: 9%;
	border: 1px solid #cccccc;
	padding: 3px;
}
#lesson #lesson-area table.course td {
	width: 13%;
	border: 1px solid #cccccc;
	padding: 5px 2px;
}

#lesson #lesson-area table.price {
	margin: 0;
	padding: 0px;
	width: 50%;
}

#lesson #lesson-area table.lessonschedule {
	width: 100%;
	border: 1px solid #cccccc;
	border-collapse: collapse;
	text-align: center;
	margin: 0 0 10px 0;
}

#lesson #lesson-area .lessonschedule th.time {
	width:9%;
	background-color: #efefef;
	border: 1px solid #cccccc;
	padding: 2px 0;
	overflow: hidden;
}

#lesson #lesson-area table.lessonschedule td.week {
	width: 13%;
	background-color: #efefef;	
	border: 1px solid #cccccc;
}

#lesson #lesson-area table.lessonschedule td {
	width: 13%;
	border: 1px solid #cccccc;
	padding: 2px 0;
}

#lesson #lesson-area .lessonschedule img {
	vertical-align: middle;
}

#lesson #lesson-area .course td.coursename {
	margin: 0px;
	padding: 3px 5px;
	width: 30%;
	font-weight: bold;
	background-color: #efefef;
}
#lesson #lesson-area .course td.courseread {
	margin: 0px;
	padding: 3px 5px;
	width: 70%;
}

#lesson #lesson-area .lessonschedule td.kojin {
	background-color: #FFF0FF;
}
#lesson #lesson-area .lessonschedule td.new {
	background-color: #e2fce2;
}
#lesson #lesson-area .lessonschedule td.enjoy {
	background-color: #DFF8FF;
}
#lesson #lesson-area .lessonschedule td.exp {
	background-color: #FFFFEC;
}
#lesson #lesson-area .lessonschedule td.yuttari {
	background-color: #DDDDFF;
}
#lesson #lesson-area .lessonschedule td.junior {
	background-color: #FFCC99;
}
#lesson #lesson-area .lessonschedule td.newschedule {
	background-color: #F8CCCB;
}

#lesson #lesson-area #free-lesson {
	padding: 30px 5px 0 5px;
	background-image: url(images/3monthsfree.gif);
	background-repeat:no-repeat;
	height: 150px;
	line-height: 1.6em;
}

#lessoninfo {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}
#lessoninfo h3 {
	padding:0;
	margin:0;
	height:31px;
}
#lessoninfo #lessoninfo-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#lessoninfo #lessoninfo-area {
	padding: 10px;
	margin: 0;
}

/*イベント*/

#event {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}
#event #event-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#event .event-area {
	padding: 10px;
	margin: 0;
	display:block;
}

#event .event-area img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#event .event-area img.alignright {
	padding: 2px;
	margin: 0 0 2px 5px;
	display:block;
	border:1px solid #EFEFEF;
}

#event .event-area img.alignleft {
	padding: 2px;
	margin: 0 5px 2px 0;
	display:block;
	border:1px solid #EFEFEF;
	}

#event .event-area .alignright {
	float: right;
	}

#event .event-area .alignleft {
	float: left
}

#event h4.event-name {
	border-bottom:1px dotted #CCCCCC;
	font-size:12px;
	font-weight:bold;
	line-height:15px;
	color:#000;
	margin: 0 0 10px 0;
}

#event .event-area #eventimg {
	float: right;
	padding: 0;
	margin: 0;
	width: 198px;
}
#event .event-area #eventread {
	margin: 0px;
	padding: 0px;
	float: left;
	width: 400px;
}

#eventinfo {
	border:1px solid #cccccc;
	display: block;
	overflow: hidden;
	background: #ffffff;
	padding: 0;
	margin: 0 0 15px 0;
}
#eventinfo #eventinfo-title {
	background-image: url(images/titleber_bg.gif);
	background-repeat:repeat-x;
	padding: 0 0 0 10px;
}
#eventinfo #eventinfo-area {
	padding: 10px;
	margin: 0;
}

#eventinfo #eventinfo-area {
	padding: 10px;
	margin: 0;
}

#eventinfo #eventinfo-area #eventlog {
	margin: 0px;
	padding: 0;
}
#eventinfo #eventinfo-area #form-link {
	margin: 10px 0;
	padding: 0 153px;
	text-align: center;
}

#eventinfo #eventinfo-area #form-link a {
	margin: 0px;
	padding: 0px;
	width: 283px;
	height: 45px;
	overflow:hidden;
	text-indent:-500px;
}

#eventinfo #eventinfo-area #form-link a.botan {
	background-image: url(images/form_link.gif);
}

#eventinfo #eventinfo-area #form-link a:hover {
	background-position:0 -45px;
}

#eventinfo #eventinfo-area #form-link a:link {
	padding:0;
	margin:0;
	display:block;
}

#eventinfo #eventinfo-area #form-link a:visited {
	padding:0;
	margin:0;
	display:block;
}

#eventinfo #eventinfo-area #eventlog #list {
	margin: 0px;
	padding: 0 0 0 10px;
	width: 350px;
	float: right;
}
#eventinfo #eventinfo-area #eventlog #image {
	margin: 40px 0 0 0;
	padding: 0;
	float: left;
	width: 220px;
}

@media print{
body {
	background-image:none;	
}
}