@import url(../fonts/font-awesome/font-awesome.min.css);
@import url(../fonts/flaticon/flaticon.css);

/*========================================================
                      Main Styles
=========================================================*/

body {
	font-family: "微軟正黑體", Arial, Verdana, Helvetica, sans-serif;	
	font-size: 15px;
	line-height: 24px;
	padding-top: 68px;/*有頂部固定導髚條時設置*/
}


/*==================  navbar-fixed  ======================*/

.navbar-fixed {
	top: 0px;
	visibility: visible;
	position: fixed;
	width: 100%;
	margin-top: 0px;
	padding-top: 0;
	z-index: 9999;
	background: #fff url(../../images/navbar_bg.png) repeat-x left bottom;
	min-height: 68px;
}

/* ----------------------- navbar-nav ----------------------- */

.navbar-default {
	background: none;
	/*border-bottom: 7px solid #ef9fae;*/
}
.navbar-header .navbar-brand {
	background: url(../../images/logo_2.png) no-repeat left center;
	width: 140px;
	height: 48px;
	text-indent: -9999px;
}

.navbar {
	position: relative;
	border: none;
	margin-bottom: 0;
	padding-top: 6px;
	padding-bottom: 14px;
}
.navbar-nav {
}
.navbar-nav > li:nth-of-type(-n+1) {
	display: none;
}
.navbar-default .navbar-nav > li > a {
	display: block;
	font-size: 18px;
	padding: 0;
	color: #fff;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
	color: #f2db18;
	/*text-shadow: 0px 2px 0px #fff;*/
}


.navbar-text {
	position: absolute;
	right: 50px;
	top: -44px;
	z-index: 10;
	display: none;
}
.navbar-text img {
	width: 20px;
	margin: 0 3px;
}
.navbar-default .navbar-link {
    color: #fff;
}
.navbar-default .navbar-link:hover {
    color: #fff;
}




/* 下拉式選單設定 */
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #f2db18;
    background-color: transparent;
}
.dropdown-menu {
    padding: 10px 0;
}
.dropdown-menu > li > a {
    padding: 7px 20px;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
	color: #fff;
	background-color: #d06e0d;
}

.navbar-nav > li > .dropdown-menu:after, 
.navbar-nav > li > .dropdown-menu:before {
  position: absolute;
  content: " ";
  width: 0;
  height: 0;
  border: solid transparent;
  top: -18px;
  left: 20%;
} 
.navbar-nav > li > .dropdown-menu:after {
  border-width: 9px;
  border-bottom-color: white;
  margin-left: -9px;
}




/* -------------------------- banner -------------------------- */

.bxslider1, .bxslider2 {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.banner-l {
	display: none;
}

.banner-l, .banner-m {
	position: relative;
}

/* -------------------------- scroll -------------------------- */

.scroll-banner {
	width: 100%;
	position: absolute;
	bottom: 8%;
	z-index: 9;
	cursor: pointer;
	}
.scroll-banner img {
	display: block;
	margin: 0 auto;
}

.scroll-style {
	text-align: center;
	margin-top: 20px;
}
.scroll-style img {
	cursor: pointer;
}

.scroll-star {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}




/* -------------------------- 共同設定 -------------------------- */

.about-list h1, .contact-list h1, .news-list h1, .class-list h1  {
	margin-top: 0;
	margin-bottom: 0;
	background-color: #fff;
	font-size: 30px;
	padding: 10px 0;
	text-align: center;
	font-weight: bold;
	color: #232323;
}



/* -------------------------- 關於我們 -------------------------- */

.about-list {
	position: relative;
	background: none,
				none,
				url("../../images/about_back1.jpg") no-repeat center bottom;
    -moz-background-origin: content-box;
    -webkit-background-origin: content-box;
    -o-background-origin: content-box;
    background-origin: content-box;
}

.about-list h2 {
	font-size: 36px;
	color: #fff;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.2);
	padding: 3% 0;
	margin-top: 0;
}
.about-main {
	padding-top: 2%;
	padding-bottom: 2%;

}
.about-main ul {
	list-style: none;
	margin-bottom: 10px;
}
.about-main ul li {
	font-size: 20px;
	line-height: 30px;
	margin-bottom: 16px;
	position: relative;
	padding-left: 24px;
}
.about-main ul li:before {
	position: absolute;
	left: 0;
	top: 2px;
	z-index: 9;
	font-family: "FontAwesome", Arial, Verdana, Helvetica, sans-serif;
	content: "\f111";	
	color: #d9730e;
	}
.about-tree {
	position: absolute;
	left: 1%;
	bottom: 0;
	z-index: 1;
	}
.about-bottom img {
	width: 100%;
	background-size: 100%;
	}
	
/*.about-more {
	margin: 0 0 0 20px;
	}	
.about-more h3 {
	display: inline-block;
	font-size: 24px;
	color: #fff;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.3);
	padding: 18px 20px;
	border-radius: 10px;
	}
.about-more p {
	font-size: 20px;
	line-height: 30px;
	}
		
.youtube a {
	display: inline-block;
	background: url(../../images/youtube1.png) no-repeat 10px center;
	padding: 13px 15px 13px 62px;
	margin-left: 20px;
	font-size: 20px;
	background-color: #c7312b;
	border-radius: 10px;
	color: #fff;
	}*/	
		
.about-more {
	margin: 20px 0 0 20px;
	}		
.about-more a {
	font-size: 24px;
	color: #fff;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.3);
	padding: 10px 50px 12px 20px;
	border-radius: 10px;
	position: relative;
	}
.about-more a:after {
	position: absolute;
	right: 20px;
	top: 14px;
	z-index: 9;
	font-family: "FontAwesome", Arial, Verdana, Helvetica, sans-serif;
	content: "\f0a6";	
}

.about_1 {
	margin-top: 30px;
	margin-bottom: 30px;

	}
.about_1 img {
	display: block;
	max-width: 100%;
	vertical-align: bottom;
	max-height: 400px;
	margin: 0 auto;
	}
.about_1 dl {
	border-bottom: 2px dashed #adadad;
	padding-top: 30px;
	padding-bottom: 30px;
}
.about_1 dl:last-of-type {
	border-bottom: none;
}
.about_1 dl dd {
	font-size: 18px;
	line-height: 36px;
}
.about_1 dl dd h3 {
	color: #f15500;
	font-weight: bold;
}
.about_1 dl dd h3 span {
	float: right;
	font-size: 16px;
	color: #333;
}






/* -------------------------- 聯絡我們 -------------------------- */

.contact-list {
	background: url(../../images/contact_back.jpg) no-repeat center top;
	background-size: auto 100%;	
	position: relative;
	text-align: center;
	font-weight: bold;	
	color: #fff;
}
.contact-main {
	padding-top: 1%;
	padding-bottom: 1%;
	background-color: rgba(0, 0, 0, 0.3);
}
.contact-main h2 {
	font-size: 40px;	
	margin-top: 0;	
}
.contact-main h3 {
	font-size: 26px;
	background-color: #000;
	margin-bottom: 0;
	padding: 10px 0;
}
.contact-main iframe {
	border: 7px solid #000;
	margin-bottom: 20px;
}
.contact-main address {
	font-size: 20px;
	line-height: 34px;
	margin-bottom: 0;
}
.contact-main address b {
	font-size: 34px;
}
.contact-btn {
	display: inline-block;
	background-color: #fff;
	color: #000;
	margin: 20px 0 0 0;
	padding: 7px 120px;
	border-radius: 10px;
}
.contact-btn:hover {
	background-color: #ac0226;
	color: #fff;
}


/* -------------------------- 新聞訊息 -------------------------- */

.news-list {
	background: url(../../images/news_back.jpg) no-repeat center 50px;
	background-size: auto 100%;
	padding-bottom: 20px;
}

.news-main {
	margin-top: 100px;
	margin-bottom: 60px;
	background-color: rgba(217, 115, 14, 0.7);
	text-align: center;
	}

.news-list ul {
	list-style: none;
	margin: 30px 0 60px;
	padding: 0;
}
.news-list li {
	border-bottom: 1px solid #fff;
}
.news-list li {
	display: block;
	color: #fff;
	padding: 14px;
	font-size: 20px;
}
.news-list li a:hover {
	background-color: #591212;
	color: #fff000;
	text-decoration: none;
}
.news-btn {
	font-size: 28px;
	display: inline-block;
	background-color: #c34e00;
	color: #fff;
	margin: 0 0 60px 0;
	padding: 15px 80px 17px;
	border-radius: 10px;
}
.news-btn:hover {
	background-color: #fff;
	color: #000;
}


/* -------------------------- 課程介紹 -------------------------- */

.class-list {
	background: url(../../images/class_back.jpg) no-repeat center 50px;
	background-size: auto 100%;
	padding-bottom: 20px;	
	color: #fff;
	font-size: 22px;
	text-align: center;
}
.class-list h2 {
	font-size: 72px;
	font-weight: bold;
	}
.class-list p {
	margin: 30px 0 50px 0;
	line-height: 36px;
	}
.class-list p span {
	color: #ebf557;
	}	
.class-info dl:nth-of-type(1) {
	background: url(../../images/class_pic1.png) no-repeat center top;
	background-size: 100% 100%;
}
.class-info dl:nth-of-type(2) {
	background: url(../../images/class_pic2.png) no-repeat center top;
	background-size: 100% 100%;
}
.class-info dl:nth-of-type(3) {
	background: url(../../images/class_pic3.png) no-repeat center top;
	background-size: 100% 100%;
}
.class-info dl:nth-of-type(4) {
	background: url(../../images/class_pic4.png) no-repeat center top;
	background-size: 100% 100%;
}
.class-info {
	padding-left: 15px;
	margin-bottom: 20px;
}
.class-info dl {
	padding: 30px 40px 30px 20px;
}
.class-info dl dt {
	font-size: 32px;
	margin-bottom: 20px;
}
.class-info dl dt span {
	display: block;
	text-align: right;
	font-size: 18px;
}
.class-info dl dt span.f3 {
	color: #62bee5;
}
.class-info dl dt span.f4 {
	color: #e46799;
}
.class-info dl dd ul {
	list-style: none;
	margin: 0 0 40px 0;
	padding: 0;
}
.class-info dl dd ul li {
	border-top: 1px solid #fff;
	padding: 5px 0;
}

.class-info dl dd.more {
	font-size: 18px;
	text-align: left;
	position: relative;
	padding: 0 0 0 12px;
}
.class-info dl dd.more:before {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 9;
	font-family: "FontAwesome", Arial, Verdana, Helvetica, sans-serif;
	content: "\f0da";	
	color: #fff;
	}
.class-info dl:nth-of-type(1) dd.more a {
	color: #79610c;
}
.class-info dl:nth-of-type(2) dd.more a {
	color: #883e09;
}
.class-info dl:nth-of-type(3) dd.more a {
	color: #09648a;
}
.class-info dl:nth-of-type(4) dd.more a {
	color: #951849;
}


.class-btn {
	font-size: 28px;
	display: inline-block;
	color: #59fdff;
	padding: 15px 80px 17px;
	border-radius: 10px;
	border: 5px solid #fff;
}
.class-btn:hover {
	background-color: #fff;
	color: #000;
}



/* -------------------------- 課程介紹 -------------------------- */

.star-list {
	background: url(../../images/star_back.jpg) no-repeat center top;
	background-size: auto 100%;
	padding-bottom: 100px;
	text-align: center;	
	color: #fff;	
	font-size: 20px;
    position: relative;
}
.star-list h1 {
	display: inline-block;
	background-color: rgba(0, 0, 0, 0.3);
	font-size: 40px;
	margin: 24% 0 3% 0;
	padding: 15px 80px 17px;
	border-radius: 10px;
}
.star-main p.info {
	line-height: 30px;
	margin: 0 15px 3% 15px;	
}
.star-main .main {
	position: relative;
	background-color: rgba(255, 255, 255, 0.8);		
	margin: 0 15px 3% 15px;	
	padding: 2.5% 5% 3%;
	border-radius: 10px;	
	color: #a80c0c;
	line-height: 40px;
}
.star-main .main div {
}

.star-main .star-slider div {
	padding-bottom: 30px;
}
.star-main .star-slider .box {
	background-color: #cea350;
	padding: 30px 20px;
	text-align: left;
}
.star-main .star-slider .box h3 {
	margin-top: 0;
}
.star-main .star-slider .box p  {
	text-align: right;
}
.star-main .star-slider .box p a {
	display: inline-block;
	font-size: 18px;
	color: #fff;
	background-color: #593b02;
	padding: 5px 40px 5px 15px;
	border-radius: 5px;
	position: relative;
	
}
.star-main .star-slider .box p a:after {
	position: absolute;
	right: 15px;
	top: 5px;
	z-index: 9;
	font-family: "FontAwesome", Arial, Verdana, Helvetica, sans-serif;
	content: "\f0a6";	
}
.star-main .star-slider .col-sm-4:nth-of-type(1) .box p a {
	background-color: #593b02;	
}
.star-main .star-slider .col-sm-4:nth-of-type(2) .box p a {
	background-color: #023759;	
}
.star-main .star-slider .col-sm-4:nth-of-type(3) .box p a {
	background-color: #02592d;	
}

.star-main .star-slider .box p a:hover {
	background-color: #891110;
}
.star-main .star-slider img {
	width: 100%;
	vertical-align: bottom;
}


.star-main .star-slider .col-sm-4:nth-of-type(1) .box {
	background-color: #e58f14;
}
.star-main .star-slider .col-sm-4:nth-of-type(2) .box {
	background-color: #14a1e5;
}
.star-main .star-slider .col-sm-4:nth-of-type(3) .box {
	background-color: #3fad4c;
}





.star-info {
	margin-bottom: 50px;
	line-height: 26px;
	}
.star-info div {
	margin-bottom: 20px;
	}
.star-info h1 {
	color: #8d0016;
	font-size: 32px;
	background-color:#fff;
	}
.star-info h2 {
	background-color: #8c0014;
	color: #fff;
	font-size: 24px;
	padding: 6px 15px;
	}

.star-info ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.star-info li {
	display: -moz-inline-stack;
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: top;
	width: 100%;
	margin-right: -4px;
	padding: 6px 0 6px 16px;
	position: relative;
}
.star-info li:nth-of-type(2n) {
	background-color: #f8f2f3;
}

.star-info li:before {
	position: absolute;
	left: 8px;
	top: 6px;
	z-index: 9;
	content: '\f0da';
	font-family: 'FontAwesome';
	font-size: 10px;
}


@media (min-width: 640px) {

.star-info li {
	width: 49.5%;
}
.star-info li:nth-of-type(2n) {
	background-color: #fff;
}
.star-info li:nth-of-type(4n+3) {
	background-color: #f8f2f3;
}
.star-info li:nth-of-type(4n+4) {
	background-color: #f8f2f3;
}
}


@media (min-width: 992px) {
	
.star-info li {
	width: 33%;
}
.star-info li:nth-of-type(2n) {
	background-color: #fff;
}
.star-info li:nth-of-type(4n+3) {
	background-color: #fff;
}
.star-info li:nth-of-type(4n+4) {
	background-color: #fff;
}
.star-info li:nth-of-type(6n+4) {
	background-color: #f8f2f3;
}
.star-info li:nth-of-type(6n+5) {
	background-color: #f8f2f3;
}
.star-info li:nth-of-type(6n+6) {
	background-color: #f8f2f3;
}
}

@media (min-width: 1200px) {
	
.star-info li {
	width: 24.7%;
}
.star-info li:nth-of-type(2n) {
	background-color: #fff;
}
.star-info li:nth-of-type(4n+3) {
	background-color: #fff;
}
.star-info li:nth-of-type(4n+4) {
	background-color: #fff;
}
.star-info li:nth-of-type(6n+4) {
	background-color: #fff;
}
.star-info li:nth-of-type(6n+5) {
	background-color: #fff;
}
.star-info li:nth-of-type(6n+6) {
	background-color: #fff;
}
.star-info li:nth-of-type(8n+5) {
	background-color: #f8f2f3;
}
.star-info li:nth-of-type(8n+6) {
	background-color: #f8f2f3;
}
.star-info li:nth-of-type(8n+7) {
	background-color: #f8f2f3;
}
.star-info li:nth-of-type(8n+8) {
	background-color: #f8f2f3;
}
}


/* -------------------------- 師資招募 -------------------------- */

.teach-list {
	background: url(../../images/teach_bg.jpg) no-repeat center top;
	background-size: cover;
	padding-bottom: 20px;
	}
.teach-list h1 {
	font-size: 42px;
	padding: 30px 0;
	text-align: center;
	color: #fff;
	background-color: #cc6e0c;
}

.teach-main {
	margin: 0 15px;
	padding: 2% 3%;
	background-color: rgba(255, 255, 255, 0.7);
	color: #333;
	font-size: 20px;
	line-height: 32px;
	font-family: Arial, Verdana, Helvetica, sans-serif;	
	}
.teach-main p {
	margin-bottom: 20px;
	}
.teach-main p img {
	display: block;
	width: 100%;
	max-width: 240px;
	margin: 0 auto 20px;
	}


.teach-list h2 {
	margin: 2% 15px 2%;
	font-size: 42px;
	color: #8d0016;
}	

/* 計數器 */
.count {
	list-style: none;
	margin: 0;
	padding: 0;
	color: #000;
	text-align: right;
	font-size: 15px;
	line-height: 24px;
}
.count li {
	display: -moz-inline-stack;
	display: inline-block;
	*display: inline;
	zoom: 1;
	vertical-align: top;
	background-color: #d9730e;
	text-align: center;
	margin: 0 1px 0 0;
	padding: 0px 5px;
	color: #fff;
}



/* -------------------------- 家長推薦 -------------------------- */

.family-list {
	background: url(../../images/family_back.jpg) no-repeat center top;
	background-size: auto 100%;
	padding-bottom: 10%;
	text-align: center;	
	color: #fff;	
	font-size: 22px;
}
.family-list h1 {
	display: inline-block;
	background-color: rgba(255, 255, 255, 0.7);
	font-size: 40px;
	margin: 20% 0 4% 0;
	padding: 15px 80px 17px;
	border-radius: 10px;
	color: #000;
}
.family-main article {
	background-color: rgba(0, 0, 0, 0.4);
	padding: 0;
	margin: 0;
	}
.family-main article h2 {
	background-color: rgba(255, 255, 255, 0.8);
	font-size: 32px;	
	color: #a70909;
	padding: 20px 20px;
	margin: 5% 0;
	}
.family-main article p {
	text-align: left;	
	padding: 0 4% 2% 4%;
	line-height: 30px;
	}
.family-btn {
	background-color: #591212;
	font-size: 28px;
	display: inline-block;
	color: #fff;
	padding: 15px 40px 17px;
	border-radius: 10px;
	border: 5px solid #fff;
}
.family-btn:hover {
	background-color: #fff;
	color: #591212;
	border: 5px solid #591212;
}



/* -------------------------- footer -------------------------- */

.footer-list {
	background-color: #fff; 
	text-align: left;
	padding-top: 20px;
	color: #676767;
}
.footer-list [class *= col-]{
	margin-bottom: 20px;
	background-color: #ededed;
	margin-left: 15px;
	margin-right: 15px;
	padding: 10px 10px 20px 10px;
}
.footer-list [class *= col-]:first-of-type {
	margin-top: 20px;
}
.footer-list [class *= col-]:last-of-type {
	background-color: #fff;
	text-align: center;
}
.footer-list [class *= col-] ul {
	list-style: none;
	margin: 0;
	padding: 0;
}


.address_map {
	text-align: center;
	padding: 20px 0;
}
.address_map a {
	font-size: 15px;
	color: #000;
	margin: 0 10px;
	padding: 7px 12px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.address_map a span {
	margin: 0 2% 0 0;
}
.address_map a:hover {
	background-color: #2e7a87;
	border: 1px solid #2e7a87;
	text-decoration: none;
}
.address_map .btn-pink {
	background-color: #00525f;
	border: 1px solid #00525f;
	color: #fff;
}