
* { margin:0; padding:0; }
body {font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 14px; line-height: 1.5;}
img {border:none;}
.clear { clear:both; margin:0; padding:0; height:0px; margin-top: 0px; }

h3 { font-size:24px; }
h4 { font-size:18px; }

h1,h2,h3,h4,h5 { color:#0693b9; }
h1.orange,h2.orange,h3.orange,h4.orange,h5.orange { color:#FF9300; }
h1.black,h2.black,h3.black,h4.black,h5.black { color:#000000; }

h3.page-topic { line-height:32px; background:url('../img/page-topic.jpg') no-repeat; padding-left:32px; font-weight:bold; }
h4.contact { line-height:35px; background:url('../img/page-contact.jpg') no-repeat; padding-left:35px; font-size:1.3em; font-weight:bold; }
h4.course-head span { line-height:40px; background:url('../img/label-bg.jpg') repeat-x; display:block; margin-left:-5px; padding-left:10px; }
h4.course-head-a { line-height:40px; background:url('../img/label-a.jpg') no-repeat; padding-left:45px; }
h4.course-head-b { line-height:40px; background:url('../img/label-b.jpg') no-repeat; padding-left:45px; }
h4.course-head-c { line-height:40px; background:url('../img/label-c.jpg') no-repeat; padding-left:45px; }

a { color: #428bca; text-decoration: none; }
a.small { font-size:0.8em; }

.wrapper { min-width:1248px; margin: 0 auto; /*overflow-x: hidden;*/ }

#top-banner{ border-bottom: 2px solid #0693b9; /*background: #FAB620;*/ }
#top-banner img { width:100%; /*height:100%;*/ }
.visual{ background:url(../img/banner1.jpg) center no-repeat; height:384px; }
/*.visual{ background-image:url(../img/banner1.jpg); background-position: center top no-repeat; background-size: 100% auto; height:384px; }*/

img.center { /*margin: 0 auto;*/ display:block; }
.img-container { width:100%; height:69px; position:relative; bottom:0; right:0; }
.img-container img.right { position:absolute; right:0px; top:0; width:113px; height:69px; }

header { height:110px; background:url('../img/top_bg.gif') repeat-x; padding-top:10px; border-bottom:2px solid #0693b9; }
header #logo h1 { margin-top:5px; margin-left:110px; }
header #logo h1 span { display:none; }
header .container, #main-content .container, #main-course .container, footer .container, #main-content .container-other { position:relative; width:1246px; margin:0 auto; }
header .container .col { position:relative; float:left; }
header .container .left-logo { width: 275px;}
header .container .main-menu-container { width: 971px; position:relative; }
/*.main-menu-container { position:relative; padding:0; z-index:15000; }*/
.sub-nav { /*position:absolute; top:0; right:0; min-width:200px;*/ height:30px; }
.sub-nav a { float:right; margin:2px; }
.main-nav { /*position:relative; margin-top:55px; width:100%;*/ height:50px; padding-top:25px; }
/*.main-nav ul { width:100%; background:#red; }*/
.main-nav ul > li { float:right; list-style:none; width:120px; height:20px; margin:0 3px; border-right:1px solid #D0D6DB; font-size: 1.2em; font-weight:bold; text-align:center; }
.main-nav ul > li a { color:#999999; text-decoration:none; }
.main-nav ul > li a:hover { color:#FFA800; }
.main-nav ul > li a.active { color:#FFA800; }
.main-nav ul > li a img { margin-top:-8px; vertical-align: text-top; }
.main-nav ul > li.last { border-right:none; text-align:right; width:120px; }

/*fix calendar table*/
#main-content { width:100%; /*min-height:1250px;*/ margin-bottom: 5px; }
#main-content .col-left, #main-content .col-center, #main-content .col-right, #main-content .col-contact, #main-content .col-page-content { display:block; position:relative; float:left; }
#main-content .col-left, #main-content .col-contact { width:250px; padding: 10px; } 
#main-content .col-right { width:210px; padding: 10px; }
#main-content .col-page-content { width: 950px;  padding: 10px; }

#main-content .col-left{ /*background-image: url('../img/left_bg.jpg'); background-repeat: no-repeat; background-position:top;*/  min-height:250px; /*padding-top:210px;*/ margin-top:10px; }
#main-content .col-left h4, #main-content .col-left h5 { text-align:center; }
.table>tbody>tr>td.detail:first-child{ background:#FFFEE8; width:50px; text-align:left; }
.panel-heading { padding: 5px !important; }
.table>tbody>tr>td { padding: 2px 5px !important; }
.calendar-head{ background:#F7901E; color:#FFFFFF; padding-left:10px; }

#main-content .col-center { width:710px; border-right: 1px solid #D0D6DB; padding:20px 10px; }
#main-content p { font-size: 1.2em; color:#667265; font-weight:normal; }
#main-content p.normal { font-size: 1.2em; color:#667265; font-weight:normal; }
#main-content p.special { font-size: 1.4em; }
#main-content .our-course-list { background-color: #F2F2F2; background-image: url('../img/bg-course-list.jpg'); background-position: right; background-repeat: no-repeat; padding:10px; margin:20px;}
#main-content .our-course-list .course { line-height:30px; clear:both; font-size:1.1em; color:#545454; }
#main-content .our-course-list .course kbd { float:left; font-size:1.0em; font-weight:bold; background:#F18900; color:#FFFFFF; width:150px; height:27px; line-height:27px; margin:2px 5px; display:block; padding:5px 0px 0px 5px; }
#main-content .orange { color:#F59323; }
#main-content .bold { font-weight:bold; }
#main-content .green { color:#277589; }
#main-content .center { text-align:center; }
#main-content .left-30 { padding-left:30px; }
#main-content table tr > td { vertical-align: middle; }
#main-content table tr > td.detail { vertical-align: top; }

#main-content .container-other { padding-top:30px; }

#main-content .col-contact a.tel { font-size:1.8em; color:#FF6600; font-weight:bold; }
#main-content .col-contact a.tel:hover { text-decoration:none; }
#main-content .col-contact .working-hour { color:#666666; font-weight:bold; }
#main-content .col-contact .social { margin: 10px 0; }
#main-content .contact-summary { background:#FFFDE6; padding:4px; font-size:1.0em; }
#main-content .contact-summary a { text-align:right; }
#main-content .contact-summary a.tel { font-size:1.4em; color:#FF6600; font-weight:bold; }
#main-content .contact-summary a.tel:hover { text-decoration:none; }
#main-content .highlight { background:#FFF0DD; padding:4px; font-size:1.1em; margin-left:30px; padding:10px; }

#main-content .col-page-content { border-left: 1px solid #D0D6DB; }

#main-course { background:#FFC230; min-height:255px; }
#main-course img.course-list { margin:0 auto; display:block; }
#main-course .course-container { width:1246px; height:142px; margin: 0 auto; /*border: solid 1px #da9a02;*/}
#main-course .course-container .course {  margin-top:-10px; /*padding:5px 10px;*/ /*min-width:191px;*/ width:20%; height:140px; float:left; }
#main-course .course-container .course h4 {padding:5px 10px;}
#main-course .course-container .piano { background:#fff url('../img/course_piano.jpg') no-repeat 100%; }
#main-course .course-container .violin { background:#fff url('../img/course_violin.jpg') no-repeat 100%; }
#main-course .course-container .guitar { background:#fff url('../img/course_guitar.jpg') no-repeat 100%; }
#main-course .course-container .elecguitar { background:#fff url('../img/course_elecguitar.jpg') no-repeat 100%; }
#main-course .course-container .drum { background:#fff url('../img/course_drum.jpg') no-repeat 100%; }
p.slogan { font-size:1.4em; color:black; padding:20px; text-align:center; }

#main-content .course-desc { display:block; margin: 40px 0; }

#main-content .contact-form { background:#187E88; padding:10px 40px; color:#FFFFFF; font-size:1.1em; }
#main-content .contact-form td { height: 30px; }
#main-content .contact-form input { line-height:20px; color:#000000; }
#main-content .contact-form select { line-height:20px; color:#000000; height:25px; min-width:171px; }
#main-content .contact-form .absent-input { width: 180px; }
#main-content .contact-form .absent-select { width: 184px; }
#main-content .map-wrapper { width:49%; display:block; }
#main-content .map-wrapper.left { float: left; }
#main-content .map-wrapper.right { float: right; }
#main-content .map-wrapper .map-canvas { width: 100%;  min-height:300px; }
#main-content .hint { font-size:0.9em; color:#A1D2EA; }

footer { background:#F4F4F4; min-height:150px; clear:both; }
footer .container .col { display:block; float:left; }
footer .container .col-left { width:70%; }
footer .container .col-right { width:30%; }
footer .container {  margin-bottom: 5px; }
/*footer p { margin-top:10px; margin-bottom:10px; color:#929292; line-height:150%; padding:10px; }*/
footer .left { text-align:left; }
footer .right { text-align:right; }
/*footer .head { font-size:1.2em; font-weight:bold; color:#000; margin-bottom: 10px; }*/
/*footer .tel { font-size:1.8em; color:#FF6600; font-weight:bold; }*/
/*footer .tel:hover { text-decoration:none; }*/
/*footer .bold { font-weight:bold; }*/
/*footer .grey { color:#929292; }*/
/*footer .orange { color:#FF6600; }*/
/*footer .mobile-app a { display:block; margin:3px 5px; text-decoration:none; color:#000; font-weight:bold; opacity:0.6; }*/
/*footer .mobile-app a:hover { opacity:1; }*/
/*footer .mobile-app a img { max-width:25px; }*/
footer .footer-wrapper { margin-top:10px; margin-bottom:10px; color:#929292; line-height:100%; padding:10px; }
footer .footer-wrapper .line-height-150 { line-height:150%; }
footer .footer-wrapper .head { font-size:1.2em; font-weight:bold; color:#000; margin-bottom: 10px; }
footer .footer-wrapper .text-tel { font-size:1.8em; color:#ff6600; font-weight:bold; }
footer .footer-wrapper .text-tel:hover { text-decoration:none; }
footer .footer-wrapper .text-min { font-size:0.8em; color:#929292; }
footer .footer-wrapper .bold { font-weight:bold; }
footer .footer-wrapper .grey { color:#929292; }
footer .footer-wrapper .orange { color:#ff6600; }
/*footer .min { font-size:0.9em; font-weight:bold; }*/

//* CALENDAR TABLE *//
.panel-default {
    border-color: #ddd;
}
.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
}
.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
.panel>.table:last-child, .panel>.table-responsive:last-child>.table:last-child {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}
.panel-default>.calendar-heading { background:#F7901E; color:#FFF; border-color:#F7901E; padding:2px; }
.panel-calendar { border:1px solid #F7901E; }

table {
    border-spacing: 0;
    border-collapse: collapse;
}
.table>tbody>tr>td { border-top: 1px solid #F7901E; }