@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Architects+Daughter);
@import url(https://fonts.googleapis.com/css?family=Roboto);
@import url(../font-awesome/css/font-awesome.min.css);
.container::after, .inner::after, .header::after, .banner::after, .service::after, .news::after, .footer-nav::after, .info-warp::after, .course-title::after, .page-button::after { clear: both; content: ''; display: block; visibility: hidden; height: 0; }

.curriculum .cur-item .subject:before, .curriculum-tag .cur-item .subject:before { font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; color: #333; font-size: 18px; padding-right: 0.5em; vertical-align: top; }

/* ================================================================ FlexSlider ================================================================*/
@font-face { font-family: 'flexslider-icon'; src: url("../fonts/flexslider-icon.eot"); src: url("../fonts/flexslider-icon.eot?#iefix") format("embedded-opentype"), url("../fonts/flexslider-icon.woff") format("woff"), url("../fonts/flexslider-icon.ttf") format("truetype"), url("../fonts/flexslider-icon.svg#flexslider-icon") format("svg"); font-weight: normal; font-style: normal; }
.flex-container a:hover, .flex-slider a:hover { outline: none; }

.slides, .slides > li, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; }

.flex-pauseplay span { text-transform: capitalize; }

.flexslider { margin: 0; padding: 0; }
.flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; }
.flexslider .slides img { width: 100%; display: block; }
.flexslider .slides:after { content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }

html[xmlns] .flexslider .slides { display: block; }

* html .flexslider .slides { height: 1%; }

.no-js .flexslider .slides > li:first-child { display: block; }

.flexslider { margin: 0 0 0px; position: relative; zoom: 1; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; -moz-box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2); }
.flexslider .slides { zoom: 1; }
.flexslider .slides img { height: auto; -moz-user-select: none; }

.flex-viewport { max-height: 2000px; -moz-transition: all 1s ease; -o-transition: all 1s ease; -webkit-transition: all 1s ease; transition: all 1s ease; }

.loading .flex-viewport { max-height: 300px; }

.carousel li { margin-right: 5px; }

.flex-direction-nav { *height: 0; }
.flex-direction-nav a { text-decoration: none; display: block; width: 20px; height: 20px; margin: -10px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0, 0, 0, 0.8); -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); }
.flex-direction-nav a:before { line-height: 1; font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f001'; color: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3); }
.flex-direction-nav a.flex-next:before { content: '\f002'; }
.flex-direction-nav .flex-prev { left: -10px; }
.flex-direction-nav .flex-next { right: -10px; text-align: right; }

.flexslider:hover .flex-direction-nav .flex-prev { opacity: 0.7; left: -20px; }
.flexslider:hover .flex-direction-nav .flex-prev:hover { opacity: 1; }
.flexslider:hover .flex-direction-nav .flex-next { opacity: 0.7; right: -20px; }
.flexslider:hover .flex-direction-nav .flex-next:hover { opacity: 1; }

.flex-direction-nav .flex-disabled { opacity: 0 !important; filter: alpha(opacity=0); cursor: default; z-index: -1; }

.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

.flex-control-nav { width: 100%; position: absolute; bottom: -40px; z-index: 9999; text-align: center; }
.flex-control-nav li { margin: 0 6px; display: inline-block; zoom: 1; *display: inline; }

.flex-control-paging li a { width: 14px; height: 14px; display: block; cursor: pointer; text-indent: -9999px; background: rgba(255, 255, 255, 0.5); -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); -webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.flex-control-paging li a:hover { background: rgba(255, 255, 255, 0.7); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.flex-control-paging li a.flex-active { background: rgba(255, 255, 255, 0.9); -moz-box-shadow: 1px 1px 0 transparent; -webkit-box-shadow: 1px 1px 0 transparent; box-shadow: 1px 1px 0 transparent; cursor: default; }

.flex-control-thumbs { margin: 5px 0 0; position: static; overflow: hidden; }
.flex-control-thumbs li { width: 25%; float: left; margin: 0; }
.flex-control-thumbs img { width: 100%; height: auto; display: block; opacity: .7; cursor: pointer; -moz-user-select: none; -moz-transition: all 1s ease; -o-transition: all 1s ease; -webkit-transition: all 1s ease; transition: all 1s ease; }
.flex-control-thumbs img:hover { opacity: 1; }
.flex-control-thumbs .flex-active { opacity: 1; cursor: default; }

@media (max-width: 860px) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px; }
  .flex-direction-nav .flex-next { opacity: 1; right: 10px; } }
@media (max-width: 480px) { .flex-direction-nav .flex-prev { opacity: 1; left: -20px; }
  .flex-direction-nav .flex-next { opacity: 1; right: -20px; } }
@media (max-width: 360px) { .flex-control-nav { display: none; } }
body { background: #fff; font-family: "微軟正黑體", Verdana, Geneva, sans-serif; font-size: 16px; color: #333; line-height: 1.4; }
body a:link, body a:visited { color: #4d4d4d; outline: 0; text-decoration: none; }
body a:hover, body a:active { color: #bc354b; outline: 0; text-decoration: none; }
body .ework { display: inline-block; letter-spacing: 0; font-size: 10px; padding: 5px 5px 5px 25px; }

.container { width: 100%; }

.inner { position: relative; }

/* search */
.shbox { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; outline: none; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.shbox::-webkit-input-placeholder { -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); color: rgba(77, 77, 77, 0.75); text-transform: uppercase; }
.shbox:-moz-placeholder { color: rgba(77, 77, 77, 0.75); text-transform: uppercase; }
.shbox::-moz-placeholder { color: rgba(77, 77, 77, 0.75); text-transform: uppercase; }
.shbox:-ms-input-placeholder { color: rgba(77, 77, 77, 0.25); }
.shbox:focus::-webkit-input-placeholder { -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); color: rgba(77, 77, 77, 0.25); }
.shbox:focus:-moz-placeholder { color: rgba(77, 77, 77, 0.25); }
.shbox:focus::-moz-placeholder { color: rgba(77, 77, 77, 0.25); }
.shbox:focus:-ms-input-placeholder { color: rgba(77, 77, 77, 0.25); }

/*text-align*/
.center { text-align: center; }

.left { text-align: left; }

.right { text-align: right; }

#TOP { position: fixed; right: 10px; bottom: 100px; width: 40px; height: 40px; cursor: pointer; z-index: 2000; border-radius: 40px; background: #bc354b; color: #fff; text-indent: -9998em; }
#TOP:before { content: ""; width: 12px; height: 12px; position: absolute; left: 50%; top: 50%; margin-top: -5px; margin-left: -8px; border-top: solid 5px #fff; border-left: solid 5px #fff; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
#TOP:hover { background: #666; color: #fff; }
#TOP:hover:before { border-top: solid 5px #fff; border-left: solid 5px #fff; }

.pagetop { opacity: 0; -moz-transition: all 1s; -o-transition: all 1s; -webkit-transition: all 1s; transition: all 1s; }

.pagetop-show { opacity: 1; -moz-transition: all 1s; -o-transition: all 1s; -webkit-transition: all 1s; transition: all 1s; }

/*header*/
.header { height: 90px; /* menu */ }
.header .header-logo-container { display: inline-block; width: 380px; float: left; padding-top: 20px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-top: 25px; padding-top: 30px; }
.header .header-logo-container img { display: inline; width: 300px; width: 225px; height: 45px; border-bottom: none; height: auto; }
.header .header-logo-container h1 { display: inline; width: calc(380px - 156px); padding-left: 10px; box-sizing: border-box; white-space: nowrap; overflow: hidden; font-size: 14px; color: #666; }
.header .header-search-container { position: relative; margin-top: 10px; display: block; float: right; width: 150px; height: 24px; margin-right: 20px; line-height: 20px; padding: 0 5px; border: 1px solid #919191; -moz-border-radius: 9px; -webkit-border-radius: 9px; border-radius: 9px; outline: none; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.header .header-search-container:hover { color: #bc354b; background: rgba(77, 77, 77, 0.1); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.header .header-search-container .shbox { position: absolute; top: 0px; left: 5px; font-family: Candara; font-size: 16px; width: 120px; height: 20px; border: none; vertical-align: middle; background: transparent; }
.header .header-search-container .shicon { position: absolute; top: 3px; right: 5px; width: 18px; height: 18px; border: none; text-indent: -9999px; background: url("../images/search.png") center center no-repeat; cursor: pointer; outline: none; }
.header .header-socialIcon { position: relative; float: right; width: 230px; margin-top: 10px; margin-right: 15px; text-align: right; }
.header .header-socialIcon .fb-like-button { display: inline-block; padding-top: 4px; box-sizing: border-box; }
.header .header-socialIcon .googlePlus { display: inline-block; margin-left: 5px; }
.header .menu-container { margin-top: 10px; display: inline-block; width: calc(100% - 380px); float: left; }
.header .menu-container ul li { position: relative; float: left; display: inline-block; width: 20%; text-align: right; padding-right: 20px; box-sizing: border-box; font-size: 20px; }
.header .menu-container ul li a:hover { text-decoration: underline; }
.header .menu-container .subDiv { display: none; position: absolute; right: -15px; z-index: 1000; width: 140px; padding: 10px; box-sizing: border-box; background: #fff; }
.header .menu-container .subDiv a { display: block; padding: 8px 10px 8px 25px; font-size: 16px; text-align: left; }
.header .menu-container .subDiv a::before { font-family: FontAwesome; content: "\f105"; font-size: 14px; position: absolute; margin-left: -14px; color: #4d4d4d; }
.header .menu-container .subDiv a:hover::before { content: "\f054"; color: #4d4d4d; margin-top: 1px; margin-left: -15px; }

.mobile-menu-top { width: 100%; background: #fff; height: 70px; }

.menu-search-container { position: relative; display: block; float: left; width: calc(100% - 84px); height: 24px; margin-top: 23px; margin-left: 10px; line-height: 20px; padding: 0 5px; border: 1px solid #bc354b; -moz-border-radius: 9px; -webkit-border-radius: 9px; border-radius: 9px; }
.menu-search-container .shbox { outline: none; position: absolute; top: 0px; left: 5px; font-family: Candara; font-size: 16px; width: calc(100% - 18px - 15px); height: 20px; border: none; vertical-align: middle; background: transparent; outline: none; border: 0; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.menu-search-container .shbox::-webkit-input-placeholder { color: #bc354b; font-family: "微軟正黑體"; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.menu-search-container .shbox:-moz-placeholder { color: #bc354b; }
.menu-search-container .shbox::-moz-placeholder { color: #bc354b; }
.menu-search-container .shbox:-ms-input-placeholder { color: #bc354b; }
.menu-search-container .shbox:hover { color: #bc354b; -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.menu-search-container .shbox:hover::-webkit-input-placeholder { color: #bc354b; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.menu-search-container .shbox:hover:-moz-placeholder { color: #bc354b; }
.menu-search-container .shbox:hover::-moz-placeholder { color: #bc354b; }
.menu-search-container .shbox:hover:-ms-input-placeholder { color: #bc354b; }
.menu-search-container .shbox:hover:focus::-webkit-input-placeholder { -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); color: rgba(188, 53, 75, 0.5); }
.menu-search-container .shbox:hover:focus:-moz-placeholder { color: rgba(188, 53, 75, 0.5); }
.menu-search-container .shbox:hover:focus::-moz-placeholder { color: rgba(188, 53, 75, 0.5); }
.menu-search-container .shbox:hover:focus:-ms-input-placeholder { color: rgba(188, 53, 75, 0.5); }
.menu-search-container .shicon { position: absolute; top: 3px; right: 5px; width: 18px; height: 18px; border: none; text-indent: -9999px; background: url("../images/search-menu.png") center center no-repeat; cursor: pointer; outline: none; }

/*mobile-menu*/
.mobile-menu-btn { display: none; cursor: pointer; position: absolute; top: 15px; right: 10px; width: 42px; height: 42px; opacity: 1; z-index: 3000; background: #bc354b; border-radius: 40px; cursor: pointer; }
.mobile-menu-btn span { -moz-transition: margin 0s, -moz-transform 0.2s, background-color 0.1s; -o-transition: margin 0s, -o-transform 0.2s, background-color 0.1s; -webkit-transition: margin 0s, -webkit-transform 0.2s, background-color 0.1s; transition: margin 0s, transform 0.2s, background-color 0.1s; -moz-transform-origin: 50% 50% 50%; -ms-transform-origin: 50% 50% 50%; -webkit-transform-origin: 50% 50% 50%; transform-origin: 50% 50% 50%; display: block; position: absolute; right: 8px; top: 10px; width: 26px; height: 4px; background: #fff; }
.mobile-menu-btn span:nth-child(2) { top: 19px; }
.mobile-menu-btn span:nth-child(3) { top: 28px; }

.mobile-menu-btn-opened { position: absolute; top: 15px; right: 10px; position: fixed; }
.mobile-menu-btn-opened span:first-child { background-color: #fff; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); margin-top: 9px; }
.mobile-menu-btn-opened span:nth-child(2) { -moz-transform: scale(0, 1); -ms-transform: scale(0, 1); -webkit-transform: scale(0, 1); transform: scale(0, 1); }
.mobile-menu-btn-opened span:nth-child(3) { background-color: #fff; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -9px; }

.mobile-menu { opacity: 0; height: 100%; width: 250px; position: fixed; top: 0; z-index: 1; right: 0; background: #bc354b; -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; -webkit-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; }

.mobile-menu-items { position: relative; margin-top: 30px; padding-left: 30px; }
.mobile-menu-items a:link, .mobile-menu-items a:visited { color: #fff; }
.mobile-menu-items a:hover, .mobile-menu-items a:active { color: #fff; }
.mobile-menu-items .mobile-menu-item { margin: 30px 0; opacity: 0; -moz-transform: translateY(-20px); -ms-transform: translateY(-20px); -webkit-transform: translateY(-20px); transform: translateY(-20px); }
.mobile-menu-items .mobile-menu-item:nth-child(1) { -moz-transition: transform 0.2s ease-in-out; -o-transition: transform 0.2s ease-in-out; -webkit-transition: transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out; }
.mobile-menu-items .mobile-menu-item:nth-child(2) { -moz-transition: transform 0.4s ease-in-out; -o-transition: transform 0.4s ease-in-out; -webkit-transition: transform 0.4s ease-in-out; transition: transform 0.4s ease-in-out; }
.mobile-menu-items .mobile-menu-item:nth-child(3) { -moz-transition: transform 0.6s ease-in-out; -o-transition: transform 0.6s ease-in-out; -webkit-transition: transform 0.6s ease-in-out; transition: transform 0.6s ease-in-out; }
.mobile-menu-items .mobile-menu-item:nth-child(4) { -moz-transition: transform 0.8s ease-in-out; -o-transition: transform 0.8s ease-in-out; -webkit-transition: transform 0.8s ease-in-out; transition: transform 0.8s ease-in-out; }
.mobile-menu-items .mobile-menu-item:nth-child(5) { -moz-transition: transform 1s ease-in-out; -o-transition: transform 1s ease-in-out; -webkit-transition: transform 1s ease-in-out; transition: transform 1s ease-in-out; }
.mobile-menu-items .mobile-menu-item:nth-child(6) { -moz-transition: transform 1.2s ease-in-out; -o-transition: transform 1.2s ease-in-out; -webkit-transition: transform 1.2s ease-in-out; transition: transform 1.2s ease-in-out; }
.mobile-menu-items .mobile-menu-item.active { opacity: 1; -moz-transform: translateY(0px); -ms-transform: translateY(0px); -webkit-transform: translateY(0px); transform: translateY(0px); }

.wrapper { z-index: 2; position: relative; width: 100%; height: 100%; background: #fff; -moz-transition: -moz-transform 0.7s ease-in-out; -o-transition: -o-transform 0.7s ease-in-out; -webkit-transition: -webkit-transform 0.7s ease-in-out; transition: transform 0.7s ease-in-out; }

.move-to-left { -moz-transform: translateX(-250px); -ms-transform: translateX(-250px); -webkit-transform: translateX(-250px); transform: translateX(-250px); }

.mobile-menu-bgColor { opacity: 1; -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; -webkit-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; }

.menu-footer-links { display: inline-block; float: left; padding-left: 30px; }
.menu-footer-links li { float: left; display: inline-block; width: 30px; margin-right: 10px; }

.sidebar-anchor { color: #FFF; font-size: 20px; position: relative; padding-bottom: 7px; }
.sidebar-anchor:before { content: ""; width: 0; height: 2px; position: absolute; bottom: 0; left: 0; background-color: #FFF; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; -webkit-transition: all 0.7s ease-in-out; transition: all 0.7s ease-in-out; }
.sidebar-anchor:hover:before { width: 100%; }

.banner { position: relative; }
.banner .flex-direction-nav a { width: 20px; height: 20px; margin: -10px 0 0; top: 50%; color: rgba(0, 0, 0, 0.8); }
.banner .flex-direction-nav a:before { font-size: 20px; color: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3); }
.banner .flex-direction-nav .flex-prev { left: 10px; }
.banner .flex-direction-nav .flex-next { right: 10px; }
.banner .flexslider:hover .flex-direction-nav .flex-prev { left: 20px; }
.banner .flexslider:hover .flex-direction-nav .flex-next { right: 20px; }
.banner .flex-control-nav { bottom: 20px; }
.banner .flex-control-nav li { margin: 0 6px; }
.banner .flex-control-paging li a { width: 14px; height: 14px; background: rgba(102, 102, 102, 0.5); -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); -webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.banner .flex-control-paging li a:hover { background: rgba(188, 53, 75, 0.7); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.banner .flex-control-paging li a.flex-active { background: rgba(188, 53, 75, 0.9); -moz-box-shadow: 1px 1px 0 transparent; -webkit-box-shadow: 1px 1px 0 transparent; box-shadow: 1px 1px 0 transparent; cursor: default; }

/* pager */
.cycle-pager { text-align: center; width: 100%; z-index: 500; position: absolute; bottom: 10px; overflow: hidden; }
.cycle-pager span { font-family: arial; font-size: 60px; width: 24px; height: 24px; display: inline-block; color: #CCC; cursor: pointer; }
.cycle-pager span.cycle-pager-active { color: #bc354b; }
.cycle-pager > * { cursor: pointer; }

/*Color*/
.white { color: #fff; }

.red { background: #bc354b; }
.red a:link, .red a:visited { color: #fff; }
.red a:hover, .red a:active { color: rgba(255, 255, 255, 0.8); }

/*main*/
.heading { padding: 30px 0; text-align: center; font-size: 24px; }

/* service */
@-moz-keyframes FromTo { 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(360deg); transform: rotate(360deg); } }
@-webkit-keyframes FromTo { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
@keyframes FromTo { 0% { -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
.service { margin-bottom: 20px; min-height: 520px; }

.service-column { width: 22.91667%; float: left; margin-left: 1.04167%; margin-right: 1.04167%; padding: 20px 0; text-align: center; }
.service-column .service-item-1 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-1 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-1:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-1:hover .text { display: none; }
.service-column .service-item-1:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-1:hover { background: #fff url("../images/service-item-1.png") no-repeat; background-size: 100% 100%; }
.service-column .service-item-2 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-2 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-2:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-2:hover .text { display: none; }
.service-column .service-item-2:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-2:hover { background: #fff url("../images/service-item-2.png") no-repeat; background-size: 100% 100%; }
.service-column .service-item-3 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-3 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-3:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-3:hover .text { display: none; }
.service-column .service-item-3:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-3:hover { background: #fff url("../images/service-item-3.png") no-repeat; background-size: 100% 100%; }
.service-column .service-item-4 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-4 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-4:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-4:hover .text { display: none; }
.service-column .service-item-4:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-4:hover { background: #fff url("../images/service-item-4.png") no-repeat; background-size: 100% 100%; }
.service-column .service-item-5 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-5 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-5:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-5:hover .text { display: none; }
.service-column .service-item-5:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-5:hover { background: #fff url("../images/service-item-5.png") no-repeat; background-size: 100% 100%; }
.service-column .service-item-6 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-6 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-6:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-6:hover .text { display: none; }
.service-column .service-item-6:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-6:hover { background: #fff url("../images/service-item-6.png") no-repeat; background-size: 100% 100%; }
.service-column .service-item-7 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-7 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-7:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-7:hover .text { display: none; }
.service-column .service-item-7:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-7:hover { background: #fff url("../images/service-item-7.png") no-repeat; background-size: 100% 100%; }
.service-column .service-item-8 { position: relative; width: 205px; height: 205px; -moz-border-radius: 205px; -webkit-border-radius: 205px; border-radius: 205px; margin: 0 auto; font-size: 24px; color: #fff; background: #808080; -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-8 .text { padding-top: 70px; line-height: 30px; }
.service-column .service-item-8:hover { -moz-transition: background-color 0.5s; -o-transition: background-color 0.5s; -webkit-transition: background-color 0.5s; transition: background-color 0.5s; }
.service-column .service-item-8:hover .text { display: none; }
.service-column .service-item-8:hover:before { content: ""; float: left; width: 205px; height: 205px; margin: 0 auto; background: url("../images/circle.png") no-repeat; -moz-animation: FromTo 4s infinite linear; -webkit-animation: FromTo 4s infinite linear; animation: FromTo 4s infinite linear; background-size: 100% 100%; }
.service-column .service-item-8:hover { background: #fff url("../images/service-item-8.png") no-repeat; background-size: 100% 100%; }

/* case */
.case { padding: 0 20px 50px; }

.case-item { width: calc(100% - 20px); margin: 0 10px; border: 1px solid #fff; padding: 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin-bottom: 0px; }
.case-item img { width: 100%; height: auto; }
.case-item .content { position: relative; height: 140px; color: #fff; }
.case-item .content .title { font-size: 20px; padding: 10px 0; width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-weight: bold; }
.case-item .content .text { height: 72px; font-size: 16px; line-height: 24px; overflow: hidden; }

.more { position: absolute; right: 0; bottom: 0; width: 60px; font-size: 16px; font-weight: 600; line-height: 24px; white-space: nowrap; }
.more a:link, .more a:visited { color: #fff; }
.more a:hover, .more a:active { color: rgba(255, 255, 255, 0.8); }

/* 課程資訊 */
.course-inner { float: left; width: 100%; padding: 0 30px; box-sizing: border-box; }

.calendar { position: relative; width: 420px; height: 250px; float: left; border: 1px solid #333; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.calendar .month { position: absolute; top: -60px; left: 10px; width: 80px; font-size: 100px; padding-right: 10px; line-height: 0.9; font-weight: 100; text-align: center; background: #fff; letter-spacing: -10px; }
.calendar .timetable { position: absolute; top: 10px; right: 10px; width: calc(100% - 100px); height: 228px; display: table; border-collapse: collapse; font-size: 16px; line-height: 32px; font-weight: bold; }
.calendar .timetable .td, .calendar .timetable .th { display: table-cell; vertical-align: middle; text-align: center; }
.calendar .timetable .thead { display: table-header-group; }
.calendar .timetable .tbody { display: table-row-group; }
.calendar .timetable .tr { display: table-row; }
.calendar .timetable a:link, .calendar .timetable a:visited { display: block; margin: auto; width: 26px; height: 26px; line-height: 26px; color: #fff; background: #bc354b; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
.calendar .timetable a:hover, .calendar .timetable a:active { color: #fff; background: #333; }

.curriculum { float: left; width: calc(100% - 420px - 30px); margin-left: 30px; }
.curriculum .cur-item { position: relative; padding-bottom: 20px; border-bottom: 1px solid #666; margin-bottom: 20px; }
.curriculum .cur-item .subject, .curriculum .cur-item .time, .curriculum .cur-item .location { width: 100%; font-size: 18px; line-height: 30px; }
.curriculum .cur-item .subject { height: 30px; overflow: hidden; padding-left: 45px; box-sizing: border-box; }
.curriculum .cur-item .subject .date { font-size: 20px; }
.curriculum .cur-item .subject:before { display: inline-block; width: 30px; content: "\f073"; font-size: 30px; margin-left: -35px; padding-right: 5px; }
.curriculum .cur-item .time, .curriculum .cur-item .location { padding-left: 45px; box-sizing: border-box; }
.curriculum .cur-item .more a:link, .curriculum .cur-item .more a:visited { color: #4d4d4d; }
.curriculum .cur-item .more a:hover, .curriculum .cur-item .more a:active { color: #bc354b; }

/* 一路新知 */
.news { padding: 0 20px; box-sizing: border-box; }

.news-item { width: 47.91667%; float: left; margin-left: 1.04167%; margin-right: 1.04167%; position: relative; margin-bottom: 20px; }
.news-item .news-img { float: left; display: inline-block; width: 70px; height: 70px; background: #bc354b; color: #fff; text-align: center; line-height: 70px; }
.news-item .news-info { float: left; display: inline-block; width: calc(100% - 70px); padding-left: 10px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.news-item .news-date { width: 100%; height: 20px; font-size: 14px; }
.news-item .news-title { width: 100%; height: 48px; margin-top: calc(70px / 2 - 24px); overflow: hidden; font-size: 18px; line-height: 1.3; font-weight: bold; }
.news-item .news-content { float: left; width: 100%; height: 48px; overflow: hidden; margin-top: 15px; margin-bottom: 30px; position: relative; font-size: 16px; line-height: 1.5; }
.news-item .more a:link, .news-item .more a:visited { color: #4d4d4d; }
.news-item .more a:hover, .news-item .more a:active { color: #bc354b; }

@keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); }
  70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); }
  90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } }
.footer-contact { position: relative; text-align: center; padding: 70px 0; }
.footer-contact h2 { font-size: 42px; line-height: 56px; margin-bottom: 20px; }
.footer-contact h2 a:hover { color: #000; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.footer-contact p { font-size: 20px; line-height: 30px; }
.footer-contact .btn { width: 200px; background: #fbb03b; padding: 10px; margin: 20px auto 0; font-size: 18px; color: #000; outline: none; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.footer-contact .btn:hover { color: #fff; background: #4d4d4d; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.footer-contact .btn span { font-size: 24px; }

.contac-title { position: relative; z-index: 99; }

.contact-animate { position: absolute; top: 70px; left: calc(50% - 182px / 2); width: 182px; height: 56px; border: 1px dotted rgba(255, 255, 255, 0.5); z-index: 66; }

@-moz-keyframes FromToScaleX { 0% { -moz-transform: scaleX(0.7); transform: scaleX(0.7); }
  50% { -moz-transform: scaleX(1); transform: scaleX(1); }
  100% { -moz-transform: scaleX(0.7); transform: scaleX(0.7); } }
@-webkit-keyframes FromToScaleX { 0% { -webkit-transform: scaleX(0.7); transform: scaleX(0.7); }
  50% { -webkit-transform: scaleX(1); transform: scaleX(1); }
  100% { -webkit-transform: scaleX(0.7); transform: scaleX(0.7); } }
@keyframes FromToScaleX { 0% { -moz-transform: scaleX(0.7); -ms-transform: scaleX(0.7); -webkit-transform: scaleX(0.7); transform: scaleX(0.7); }
  50% { -moz-transform: scaleX(1); -ms-transform: scaleX(1); -webkit-transform: scaleX(1); transform: scaleX(1); }
  100% { -moz-transform: scaleX(0.7); -ms-transform: scaleX(0.7); -webkit-transform: scaleX(0.7); transform: scaleX(0.7); } }
@-moz-keyframes FromToScaleY { 0% { height: 10px; top: calc(71px + 54px / 2); -moz-transform: scaleY(0.5); transform: scaleY(0.5); }
  50% { height: 54px; top: 71px; -moz-transform: scaleY(1); transform: scaleY(1); }
  100% { height: 10px; top: calc(71px + 54px / 2); -moz-transform: scaleY(0.5); transform: scaleY(0.5); } }
@-webkit-keyframes FromToScaleY { 0% { height: 10px; top: calc(71px + 54px / 2); -webkit-transform: scaleY(0.5); transform: scaleY(0.5); }
  50% { height: 54px; top: 71px; -webkit-transform: scaleY(1); transform: scaleY(1); }
  100% { height: 10px; top: calc(71px + 54px / 2); -webkit-transform: scaleY(0.5); transform: scaleY(0.5); } }
@keyframes FromToScaleY { 0% { height: 10px; top: calc(71px + 54px / 2); -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -webkit-transform: scaleY(0.5); transform: scaleY(0.5); }
  50% { height: 54px; top: 71px; -moz-transform: scaleY(1); -ms-transform: scaleY(1); -webkit-transform: scaleY(1); transform: scaleY(1); }
  100% { height: 10px; top: calc(71px + 54px / 2); -moz-transform: scaleY(0.5); -ms-transform: scaleY(0.5); -webkit-transform: scaleY(0.5); transform: scaleY(0.5); } }
.contact-animate2 { position: absolute; top: 70px; left: calc(50% - 180px / 2); width: 180px; height: 58px; z-index: 77; -moz-animation: FromToScaleX 4s infinite linear; -webkit-animation: FromToScaleX 4s infinite linear; animation: FromToScaleX 4s infinite linear; }

.contact-animate3 { position: absolute; top: 70px; left: calc(50% - 190px / 2); width: 190px; height: 2px; z-index: 88; -moz-animation: FromToScaleY 4s infinite linear; -webkit-animation: FromToScaleY 4s infinite linear; animation: FromToScaleY 4s infinite linear; }

/*footer*/
.footer-container { width: 100%; float: left; padding: 20px 0; }

.socialIcon { position: relative; width: 100%; padding: 0 10px 15px; box-sizing: border-box; text-align: right; }
.socialIcon .fb-like-button { display: inline-block; padding-top: 4px; box-sizing: border-box; }
.socialIcon .googlePlus { display: inline-block; margin-left: 5px; }

.footer-nav { display: inline-block; float: left; width: calc(100% - 0px); margin: 0 auto; }
.footer-nav li { display: inline-block; width: calc(100% / 9); float: left; font-size: 18px; margin-bottom: 20px; text-align: center; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-right: 1px solid #666; }
.footer-nav li:nth-child(9n) { border-right: 0; }
.footer-nav .footer-nav-column { font-size: 14px; font-weight: 600; padding: 10px 0; }
.footer-nav .footer-nav-column > li { display: block; }

.footer-logo { display: inline-block; float: left; width: 220px; padding: 10px 10px 0; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 25px 10px 0;}
.footer-logo img { width: 200px; width: 300px; }

.footer-info { width: calc(100% - 220px - 150px); display: inline-block; float: left; text-align: center; padding: 20px 0 0; }
.footer-info .footer-company-text { display: inline-block; text-align: left; padding: 0 10px; }
.footer-info .footer-company-text .text { font-size: 18px; line-height: 20px; text-align: left; padding-top: 5px; }

.footer-links-wrapper { display: inline-block; float: left; width: 150px; padding-top: 40px; }
.footer-links-wrapper .footer-links { text-align: center; }
.footer-links-wrapper .footer-links a { padding: 0 5px; display: inline-block; vertical-align: middle; width: 36px; height: 36px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.footer-links-wrapper .footer-links a img { width: 100%; }
.footer-links-wrapper .footer-links a:hover, .footer-links-wrapper .footer-links a:active { padding: 3px 8px; width: 30px; height: 30px; }

@keyframes zoomOut { from { opacity: 1; }
  50% { opacity: 1; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } }
footer { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMzAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYWFhYWFhIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g'); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(30%, #ffffff), color-stop(100%, #aaaaaa)); background-image: -moz-linear-gradient(#ffffff, #ffffff 30%, #aaaaaa); background-image: -webkit-linear-gradient(#ffffff, #ffffff 30%, #aaaaaa); background-image: linear-gradient(#ffffff, #ffffff 30%, #aaaaaa); }

.footer-project { display: inline-block; width: calc(100% - 320px); float: left; font-size: 16px; text-align: center; padding: 10px 0; }

.footer-copyright { display: inline-block; width: 320px; padding: 10px 0; float: left; font-size: 14px; color: rgba(255, 255, 255, 0.5); text-align: right; }

@media (min-width: 1024px) { .inner { width: 960px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } 
  
}
@media (min-width: 1260px) { .inner { width: 1188px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
/*media*/
@media (max-width: 1250px) {

  .footer-logo img{ width: 230px; }
}
@media (max-width: 1024px) { .inner { width: 100%; padding: 0 20px; box-sizing: border-box; }
  .service-column .service-item { width: 170px; height: 170px; }
  .service-column .service-item .text { padding-top: 55px; line-height: 30px; }
  .service-column .service-item:hover:before { width: 170px; height: 170px; } 
 
}
@media (max-width: 768px) { /* mobile-men */
  .mobile-menu-btn, .mobile-menu-opened { display: block; }
  /* menu */
  .header { height: 70px; }
  .header .header-logo-container { width: auto; padding-top: 15px; }
  .header .header-logo-container img { width: auto; height: 40px; }
  .header .menu-container { display: none; }
  .header .header-search-container { display: none; }
  .heading { padding: 20px 0; }
  .service-column { padding: 10px 0; }
  .service-column .service-item { width: 160px; height: 160px; font-size: 22px; }
  .service-column .service-item .text { padding-top: 55px; line-height: 30px; }
  .service-column .service-item:hover:before { width: 160px; height: 160px; }
  .calendar { width: 50%; }
  .curriculum { width: calc(50% - 30px); }
  .footer-logo { width: 200px; padding: 0; }
  /*.footer-logo img { width: auto; height: 54px; }*/
  .footer-info { width: auto; float: right; }
  .footer-info .footer-company-text { padding: 0 5px; }
  .footer-info .footer-company-text .text { line-height: 25px; font-size: 18px; }
  .footer-nav li { width: 20%; }
  .footer-nav li:nth-child(5n) { border-right: 0; }
  .footer-links-wrapper { float: right; } }
@media (max-width: 640px) { .service-column { width: 33.3%; margin: 0; }
  .course-inner { padding: 0; }
  .calendar { width: 100%; margin-bottom: 20px; margin-top: 40px; }
  .curriculum { width: 100%; margin-left: 0; }
  .news { padding: 0; }
  .news-item { width: 97.91667%; float: left; margin-left: 1.04167%; margin-right: 1.04167%; }
  .footer-logo { width: 100%; margin-top: 10px; text-align: center; }
  .footer-info { width: 100%; margin-bottom: 20px; text-align: center; }
  .footer-nav { width: 100%; margin-bottom: 20px; }
  .footer-links-wrapper { width: 100%; }
  .footer-project { width: 100%; display: block; padding: 10px 0 0; }
  .footer-copyright { width: 100%; display: block; padding: 10px 0; } 
  .footer-logo img{ width: 280px; }
}
@media (max-width: 480px) { .header .header-logo-container h1 { display: none; }
  .service-column { width: 50%; margin: 0; }
  .footer-info { width: auto; }
  .footer-info .text { width: auto; margin: 0 auto; }
  .footer-company-text:nth-child(1) .text:nth-child(2) { width: 250px; margin: 0 auto; }
  .footer-nav { width: 100%; margin: 0 auto; float: none; display: block; }
  .footer-nav li { width: 33.3%; }
  .footer-nav li:nth-child(5n) { border-right: 1px solid #666; }
  .footer-nav li:nth-child(3n) { border-right: 0; }
  .footer-links-wrapper { padding-top: 0; } }
@media (max-width: 360px) { .service-column { width: 97.91667%; float: left; margin-left: 1.04167%; margin-right: 1.04167%; } }
.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.deep-red { background: #8F1616; }

.gray { background: #F2F2F2; padding: 30px 0; }

.breadcrumb-wrap { width: 100%; padding: 10px 0; box-sizing: border-box; }
.breadcrumb-wrap li { font-size: 12px; line-height: 1.5; color: #fff; display: inline-block; }
.breadcrumb-wrap li a { color: #fff; }
.breadcrumb-wrap li:not(:first-child):before { content: "/"; color: #fff; font-size: 12px; padding: 0 5px; }

.title-wrap { display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; width: 100%; background: #EEE; padding: 20px 0; }
.title-wrap h2 { font-size: 30px; line-height: 1; font-weight: bold; color: #8F1616; text-transform: uppercase; text-align: center; }
.title-wrap h3 { font-size: 18px; line-height: 20px; text-align: center; }
.title-wrap:before { content: ''; width: 50px; height: 50px; margin-right: 10px; background: url(../images/line-01.svg) no-repeat; }
.title-wrap:after { content: ''; width: 50px; height: 50px; margin-left: 10px; background: url(../images/line-01.svg) no-repeat; }

.info-warp { max-width: 900px; margin: 0 auto; min-height: 500px; }

.about-wrap { margin-top: 40px; min-height: 520px; }
.about-wrap .about-img { position: relative; float: left; width: 379px; }
.about-wrap .about-img img { display: inline-block; width: 100%; height: auto; -moz-box-shadow: 4px 4px 5px #969696; -webkit-box-shadow: 4px 4px 5px #969696; box-shadow: 4px 4px 5px #969696; }
.about-wrap .about-img::before { content: ''; position: absolute; bottom: 5px; right: 10px; width: 196px; height: 78px; background: url(../images/ezlook-logo.svg) no-repeat; }

.edit-about { float: left; width: calc(100% - 379px); }
.edit-about h3 { padding: 20px 40px; border-bottom: 1px solid #CCC; box-sizing: border-box; font-size: 22px; line-height: 1.5; }
.edit-about h3 strong { font-weight: bold; }
.edit-about p { padding: 40px 40px; box-sizing: border-box; font-size: 18px; line-height: 1.5; }
.edit-about img { float: right; height: auto; }

@media (max-width: 1024px) { .edit-about { width: 60%; } }
@media (max-width: 768px) { .edit-about { width: 100%; margin-top: 20px; text-align: justify; }
  .edit-about img { width: 80%; } }
@media (max-width: 480px) { .edit-about { margin-top: 10px; }
  .edit-about h3, .edit-about p { padding: 20px 0; } }
.service-title { display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-item-align: center; align-items: center; padding: 20px 20px; box-sizing: border-box; background: #bc354b; font-size: 60px; line-height: 1.2; color: #fff; text-align: center; }

.edit-service { font-size: 18px; line-height: 1.5; }
.edit-service img { max-width: 100%; }

.case-list { float: left; width: 100%; min-height: 400px; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; -webkit-align-content: flex-start; -moz-align-content: flex-start; -ms-align-content: flex-start; -ms-flex-align: flex-start; align-content: flex-start; }
.case-list .item { display: inline-block; width: calc(100% / 3 - 20px); margin-right: 30px; }
.case-list .item:nth-child(3n) { margin-right: 0px; }
.case-list .item .photo { border: 8px solid #F2F2F2; box-sizing: border-box; }
.case-list .item .photo img { display: block; max-width: 100%; }
.case-list .title { float: left; width: 100%; padding: 20px 0; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.case-list .title h3 { width: 100%; font-size: 20px; line-height: 1.2; text-align: center; font-weight: bold; }
.case-list .title .case-url { float: left; position: relative; max-width: 100%; height: 38px; overflow: hidden; padding-top: 5px; font-size: 14px; line-height: 1.4; color: #fff; }
.case-list .title a:link, .case-list .title a:visited { color: #fff; }
.case-list .title a:hover, .case-list .title a:active { color: #fff; text-decoration: underline; }

.case-detail-wrap { padding-bottom: 30px; min-height: 500px; }
.case-detail-wrap .title { font-size: 28px; line-height: 1.2; color: #fff; text-align: center; }
.case-detail-wrap .url { margin-top: 10px; margin-bottom: 20px; text-align: center; }
.case-detail-wrap .url a:link, .case-detail-wrap .url a:visited { font-size: 14px; line-height: 1.2; color: #fff; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.case-detail-wrap .url a:hover, .case-detail-wrap .url a:active { color: #fff; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.case-detail-wrap .photo { margin-bottom: 20px; }
.case-detail-wrap .photo .flex-control-nav { bottom: 20px; }
.case-detail-wrap .photo .flex-control-nav li { margin: 0 6px; }
.case-detail-wrap .photo .flex-control-paging li a { width: 14px; height: 14px; background: rgba(102, 102, 102, 0.5); -moz-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); -webkit-box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.case-detail-wrap .photo .flex-control-paging li a:hover { background: rgba(188, 53, 75, 0.7); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.case-detail-wrap .photo .flex-control-paging li a.flex-active { background: rgba(188, 53, 75, 0.9); -moz-box-shadow: 1px 1px 0 transparent; -webkit-box-shadow: 1px 1px 0 transparent; box-shadow: 1px 1px 0 transparent; cursor: default; }
.case-detail-wrap .photo img { max-width: 100%; }
.case-detail-wrap .type { float: left; width: 100%; margin-top: 10px; text-align: right; }
.case-detail-wrap .type li { display: inline-block; width: 50px; margin-right: 10px; }
.case-detail-wrap .date { position: relative; float: left; width: 100%; margin-bottom: 15px; padding-left: 20px; box-sizing: border-box; font-size: 13px; line-height: 1; color: #fff; }
.case-detail-wrap .date:before { position: absolute; top: 0; left: 0; content: ""; width: 14px; height: 14px; background: url(../images/clock.svg) no-repeat 50% 50%; }

.edit-case { font-size: 16px; line-height: 1.5; color: #fff; }
.edit-case img { max-width: 100%; }

.course-wrap { float: left; width: 100%; margin-top: 50px; }
.course-wrap .calendar-wrap { float: left; width: 50%; height: 350px; padding: 80px 0 0; background: #F2F2F2; box-sizing: border-box; }
.course-wrap .calendar-wrap .calendar { position: relative; width: 100%; height: 250px; float: left; border: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.course-wrap .calendar-wrap .calendar .year { position: absolute; top: -80px; left: 0px; width: 100%; height: 30px; background: #999; font-size: 20px; color: #fff; line-height: 30px; font-weight: bold; text-align: center; letter-spacing: 3px; }
.course-wrap .calendar-wrap .calendar .month { position: absolute; top: -45px; left: 10px; width: 115px; font-size: 120px; padding-right: 10px; box-sizing: border-box; line-height: 0.9; font-weight: 100; text-align: center; background: transparent; letter-spacing: -10px; }
.course-wrap .calendar-wrap .calendar .timetable { position: absolute; top: 10px; right: 40px; width: calc(100% - 160px); height: 228px; display: table; border-collapse: collapse; font-size: 16px; line-height: 32px; font-weight: bold; }
.course-wrap .calendar-wrap .calendar .timetable .td, .course-wrap .calendar-wrap .calendar .timetable .th { display: table-cell; width: calc(100% / 7); vertical-align: middle; text-align: center; }
.course-wrap .calendar-wrap .calendar .timetable .thead { display: table-header-group; }
.course-wrap .calendar-wrap .calendar .timetable .tbody { display: table-row-group; }
.course-wrap .calendar-wrap .calendar .timetable .tr { display: table-row; }
.course-wrap .calendar-wrap .calendar .timetable a:link, .course-wrap .calendar-wrap .calendar .timetable a:visited { display: block; margin: auto; width: 26px; height: 26px; line-height: 26px; color: #fff; background: #bc354b; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
.course-wrap .calendar-wrap .calendar .timetable a:hover, .course-wrap .calendar-wrap .calendar .timetable a:active { color: #fff; background: #333; }
.course-wrap .calendar-wrap .calendar .direction-nav { *height: 0; }
.course-wrap .calendar-wrap .calendar .direction-nav a { position: absolute; top: 50%; z-index: 10; display: block; width: 20px; height: 50px; overflow: hidden; margin: -25px 0 0; opacity: .7; cursor: pointer; text-decoration: none; color: rgba(0, 0, 0, 0.8); -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); }
.course-wrap .calendar-wrap .calendar .direction-nav a:before { font-family: "FontAwesome"; content: '\f104'; line-height: 1; font-size: 50px; display: inline-block; color: rgba(0, 0, 0, 0.8); text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3); }
.course-wrap .calendar-wrap .calendar .direction-nav a.next:before { content: '\f105'; }
.course-wrap .calendar-wrap .calendar .direction-nav .prev { left: 5px; }
.course-wrap .calendar-wrap .calendar .direction-nav .next { right: 5px; text-align: right; }
.course-wrap .calendar-wrap .calendar:hover .direction-nav .prev { opacity: .7; }
.course-wrap .calendar-wrap .calendar:hover .direction-nav .prev:hover { opacity: 1; }
.course-wrap .calendar-wrap .calendar:hover .direction-nav .prev:hover:before { color: #bc354b; }
.course-wrap .calendar-wrap .calendar:hover .direction-nav .next { opacity: .7; }
.course-wrap .calendar-wrap .calendar:hover .direction-nav .next:hover { opacity: 1; }
.course-wrap .calendar-wrap .calendar:hover .direction-nav .next:hover:before { color: #bc354b; }
.course-wrap .calendar-info { position: relative; float: left; width: 50%; height: 350px; overflow: hidden; background: #bc354b; padding: 30px 30px 30px; box-sizing: border-box; font-size: 18px; color: #fff; }
.course-wrap .calendar-info a:link, .course-wrap .calendar-info a:visited { display: block; color: #fff; }
.course-wrap .calendar-info a:hover, .course-wrap .calendar-info a:active { color: rgba(255, 255, 255, 0.8); }
.course-wrap .calendar-info .year { padding-left: 2px; font-size: 18px; line-height: 1; }
.course-wrap .calendar-info .date { float: left; height: 66px; margin-right: 10px; font-size: 66px; line-height: 1; font-weight: 100; }
.course-wrap .calendar-info .time, .course-wrap .calendar-info .location { height: 33px; font-size: 20px; line-height: 33px; }
.course-wrap .calendar-info .time i, .course-wrap .calendar-info .location i { width: 30px; text-align: center; }
.course-wrap .calendar-info .subject { float: left; width: 100%; height: 30px; overflow: hidden; margin-top: 10px; font-size: 30px; line-height: 30px; }
.course-wrap .calendar-info .text { float: left; width: 100%; height: 162px; overflow: hidden; margin-top: 10px; font-size: 18px; line-height: 27px; }
.course-wrap .calendar-info .more { display: none; background: #555; padding: 5px 10px; margin-bottom: 15px; }

.course-list { float: left; width: 100%; margin: 40px 0; }
.course-list li { width: 33.33333%; float: left; background: #F2F2F2; position: relative; }
.course-list li:nth-child(2n) { background: #E6E6E6; }
.course-list li .date { position: absolute; top: 0; left: 20px; width: 100px; border: 1px solid #bc354b; background: #fff; }
.course-list li .date .year { float: left; width: 100%; font-size: 16px; line-height: 20px; text-align: center; background: #bc354b; color: #fff; }
.course-list li .date .month { float: left; width: 100%; padding: 0px 0 5px; background: #bc354b; color: #fff; font-size: 24px; line-height: 1; text-align: center; text-transform: uppercase; }
.course-list li .date .day { float: left; width: 100%; padding: 3px 0; font-size: 66px; line-height: 66px; color: #bc354b; text-align: center; font-family: "Roboto", Verdana, Geneva, sans-serif; }
.course-list li .top-info { float: left; width: 100%; height: 128px; margin-bottom: 20px; padding-top: 40px; padding-left: 125px; box-sizing: border-box; }
.course-list li .top-info .time, .course-list li .top-info .location { height: 24px; overflow: hidden; margin-top: 10px; font-size: 18px; }
.course-list li .top-info .time i, .course-list li .top-info .location i { width: 30px; text-align: center; }
.course-list li .bottom-info { float: left; width: 100%; height: 160px; padding: 0 20px; overflow: hidden; margin-bottom: 30px; box-sizing: border-box; }
.course-list li .bottom-info .subject { float: left; width: 100%; height: 30px; overflow: hidden; margin-bottom: 15px; font-size: 30px; line-height: 30px; }
.course-list li .bottom-info .subject a:link, .course-list li .bottom-info .subject a:visited { display: block; color: #bc354b; }
.course-list li .bottom-info .subject a:hover, .course-list li .bottom-info .subject a:active { color: rgba(188, 53, 75, 0.8); }
.course-list li .text { float: left; width: 100%; height: 120px; overflow: hidden; font-size: 16px; line-height: 24px; }
.course-list li .more { display: none; background: #555; padding: 5px 10px; margin-bottom: 15px; }

.course-title { position: relative; width: 100%; max-width: 900px; margin: 0 auto; padding-top: 30px; font-size: 18px; font-weight: 100; color: #fff; }
.course-title .year { font-size: 18px; line-height: 18px; padding-left: 5px; box-sizing: border-box; }
.course-title .date { float: left; height: 66px; padding-right: 10px; font-size: 66px; line-height: 66px; }
.course-title .time, .course-title .location { font-size: 20px; line-height: 33px; }
.course-title .time i, .course-title .location i { width: 30px; text-align: center; }
.course-title .subject { float: left; width: 100%; padding-top: 10px; margin-bottom: 30px; font-size: 30px; }

.edit-course { font-size: 18px; color: #111; }
.edit-course img { max-width: 100%; }

.sub-menu { padding-top: 30px; margin-bottom: 30px; border-bottom: 1px solid #8F1616; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.sub-menu li { padding: 15px 20px; box-sizing: border-box; }
.sub-menu .active { color: #fff; background: #8F1616; }
.sub-menu a:link, .sub-menu a:visited { display: block; font-size: 18px; line-height: 1.2; color: #fff; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.sub-menu a:hover, .sub-menu a:active { color: #fff; background: rgba(143, 22, 22, 0.6); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }

.news-menu a:link, .news-menu a:visited { color: #111; }
.news-menu a:hover, .news-menu a:active { color: #fff; background: rgba(188, 53, 75, 0.9); }
.news-menu .active { color: #fff !important; background: #bc354b; }

.page-button { text-align: center; padding: 20px 0; }
.page-button .page-numbers { width: 40px; height: 40px; display: inline-block; text-align: center; margin-left: 10px; background: #eaedf2; color: #333; font-size: 16px; line-height: 40px; overflow: hidden; }
.page-button .page-numbers:first-child { margin-left: 0; }
.page-button .page-numbers.current { background: #333; color: #fff; }
.page-button .page-numbers.disabled { color: #ccc; }
.page-button .page-numbers:hover:not([class*="disabled"]) { background: #666; color: #fff; }
.page-button a:link, .page-button a:visited { color: #333; }
.page-button a:hover, .page-button a:active { color: rgba(51, 51, 51, 0.8); }

@media (max-width: 640px) { .page-button .page-numbers { margin-left: 2px; }
  .page-button .page-numbers:first-child, .page-button .page-numbers:last-child { position: absolute; top: -9999px; left: -9999px; } }
@media (max-width: 360px) { .page-button .page-numbers { position: absolute; top: -9999px; left: -9999px; }
  .page-button .page-numbers.current, .page-button .page-numbers:first-of-type, .page-button .page-numbers:last-of-type { position: initial; top: initial; left: initial; } 

  .header .header-logo-container img{ height: 34px;}
}
.post-navigation { float: left; width: 100%; }
.post-navigation:last-child { margin-bottom: 0; }
.post-navigation .nav-links { display: flex; padding: 10px 0; }
.post-navigation .nav-links .fa { color: white; }
.post-navigation .nav-links .fa:hover { color: rgba(255, 255, 255, 0.6); }
.post-navigation .nav-links .back-to-list { width: 30px; }
.post-navigation .nav-links .back-to-list .fa { color: #bc354b; font-size: 28px; }
.post-navigation .nav-links .meta-nav { margin-bottom: 5px; text-transform: uppercase; font-size: 15px; line-height: 1.5; color: #999; }
.post-navigation .nav-links .screen-reader-text { height: 1px; overflow: hidden; position: absolute !important; width: 1px; }
.post-navigation .back-to-list, .post-navigation .nav-next, .post-navigation .nav-previous { position: relative; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: column wrap; flex-flow: column wrap; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; text-decoration: none; }
.post-navigation .back-to-list .post-title, .post-navigation .nav-next .post-title, .post-navigation .nav-previous .post-title { font-size: 16px; line-height: 1.5; color: #666; font-weight: bold; }
.post-navigation .back-to-list .post-title:link, .post-navigation .back-to-list .post-title:visited, .post-navigation .nav-next .post-title:link, .post-navigation .nav-next .post-title:visited, .post-navigation .nav-previous .post-title:link, .post-navigation .nav-previous .post-title:visited { color: #4d4d4d; }
.post-navigation .back-to-list .post-title:hover, .post-navigation .back-to-list .post-title:active, .post-navigation .nav-next .post-title:hover, .post-navigation .nav-next .post-title:active, .post-navigation .nav-previous .post-title:hover, .post-navigation .nav-previous .post-title:active { color: #bc354b; }
.post-navigation .nav-previous { width: 45%; padding-left: 45px; margin-right: 30px; }
.post-navigation .nav-previous i { position: absolute; left: 0; top: 50%; width: 35px; height: 35px; padding-left: 8px; box-sizing: border-box; background: #bc354b; font-size: 42px; line-height: 32px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.post-navigation .nav-previous .post-title { -webkit-align-content: flex-start; -moz-align-content: flex-start; -ms-align-content: flex-start; -ms-flex-align: flex-start; align-content: flex-start; }
.post-navigation .nav-next { width: 45%; padding-right: 45px; margin-left: 30px; text-align: right; }
.post-navigation .nav-next i { position: absolute; right: 0; top: 50%; width: 35px; height: 35px; padding-right: 8px; box-sizing: border-box; background: #bc354b; font-size: 42px; line-height: 32px; -moz-border-radius: 50px; -webkit-border-radius: 50px; border-radius: 50px; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.post-navigation .nav-next .post-title { -webkit-align-content: flex-end; -moz-align-content: flex-end; -ms-align-content: flex-end; -ms-flex-align: flex-end; align-content: flex-end; }

@media (max-width: 480px) { .post-navigation .nav-next .post-title, .post-navigation .nav-previous .post-title { display: none; } }
.tag-wrap { padding-bottom: 30px; }

.title-tag { width: 100%; padding: 30px 0; font-size: 30px; color: #8F1616; text-align: center; }

.flexslider-tag .flex-direction-nav a { color: #bc354b; text-shadow: 1px 1px 0 #bc354b; }
.flexslider-tag .flex-direction-nav a:before { color: #bc354b; text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.1); }
.flexslider-tag .flex-control-paging li a { background: #666; }
.flexslider-tag .flex-control-paging li a:hover { background: rgba(188, 53, 75, 0.8); }
.flexslider-tag .flex-control-paging li a.flex-active { background: #bc354b; }

.service-tag { float: left; width: 100%; }

.case-tag .case-item { border: 1px solid #bc354b; }
.case-tag .case-item .content { color: #4d4d4d; }
.case-tag .case-item .content .title { font-weight: bold; }
.case-tag .case-item .content a:link, .case-tag .case-item .content a:visited { color: #bc354b; }
.case-tag .case-item .content a:hover, .case-tag .case-item .content a:active { color: #4d4d4d; }

.news-tag { padding-bottom: 50px; }

.curriculum-tag { width: 100%; padding-bottom: 50px; }
.curriculum-tag .cur-item { position: relative; padding: 20px; -moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.4); -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.4); box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.4); }
.curriculum-tag .cur-item .subject, .curriculum-tag .cur-item .time, .curriculum-tag .cur-item .location { width: 100%; font-size: 18px; line-height: 30px; }
.curriculum-tag .cur-item .subject { height: 30px; overflow: hidden; padding-left: 45px; box-sizing: border-box; }
.curriculum-tag .cur-item .subject .date { font-size: 20px; }
.curriculum-tag .cur-item .subject:before { display: inline-block; width: 30px; content: "\f073"; font-size: 30px; margin-left: -35px; padding-right: 5px; }
.curriculum-tag .cur-item .time, .curriculum-tag .cur-item .location { padding-left: 45px; box-sizing: border-box; }
.curriculum-tag .cur-item .more a:link, .curriculum-tag .cur-item .more a:visited { color: #4d4d4d; }
.curriculum-tag .cur-item .more a:hover, .curriculum-tag .cur-item .more a:active { color: #bc354b; }

.news-wrap { float: left; width: 100%; margin-top: 20px; min-height: 400px; }
.news-wrap .news-item .news-title { height: 48px; margin-top: calc(70px / 2 - 24px); font-weight: bold; }
.news-wrap .news-item .more { display: none; }

.news-detail-title { display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-item-align: center; align-items: center; width: 100%; padding: 30px 20px; box-sizing: border-box; background: url(../images/04_news_02.gif) center center; font-size: 36px; line-height: 1.6; color: #fff; }

.edit-news { font-size: 18px; line-height: 1.5; color: #666; }
.edit-news .news-first { font-size: 36px; }
.edit-news .pink { color: #BD334C; font-size: 24px; }
.edit-news .black { color: #000; font-size: 18px; font-weight: bold; }

.contact-wrap { width: 100%; max-width: 700px; min-height: 450px; margin: 0 auto; padding: 30px 0 50px; font-size: 14px; line-height: 1.5; color: #fff; }
.contact-wrap .remark { margin-left: 180px; padding: 0 10px; box-sizing: border-box; font-size: 18px; }
.contact-wrap .btn-wrap { width: 100%; max-width: 450px; margin: 0 auto; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.contact-wrap .btn-wrap .btn-reset, .contact-wrap .btn-wrap .btn-submit { border: 0; width: 200px; margin: 20px auto 0; padding: 10px; background: #ccc; font-size: 18px; color: #000; font-family: "微軟正黑體", Verdana, Geneva, sans-serif; outline: none; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.contact-wrap .btn-wrap .btn-reset:hover, .contact-wrap .btn-wrap .btn-submit:hover { color: #fff; background: #4d4d4d; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.contact-wrap .btn-wrap .btn-submit { background: #fbb03b; margin-left: 20px; }
.contact-wrap h2 { font-size: 20px; }
.contact-wrap h3 { font-size: 18px; }

.form-wrap { float: left; margin-bottom: 20px; }
.form-wrap .form-field { float: left; width: 100%; padding-top: 15px; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-item-align: center; align-items: center; }
.form-wrap .form-field.message { display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-align-items: baseline; -moz-align-items: baseline; -ms-align-items: baseline; -ms-flex-item-align: baseline; align-items: baseline; }
.form-wrap .form-field .field-label { position: relative; float: left; width: 190px; padding: 6px 10px; box-sizing: border-box; font-size: 18px; line-height: 1; color: #fff; text-align: right; }
.form-wrap .form-field .field-desc { float: left; width: calc(100% - 190px); max-width: 400px; padding: 6px 10px; box-sizing: border-box; font-size: 18px; color: #444; outline: none; border: 0; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-wrap .form-field .field-desc::-webkit-input-placeholder { color: #999; font-family: "微軟正黑體"; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-wrap .form-field .field-desc:-moz-placeholder { color: #999; }
.form-wrap .form-field .field-desc::-moz-placeholder { color: #999; }
.form-wrap .form-field .field-desc:-ms-input-placeholder { color: #999; }
.form-wrap .form-field .field-desc:hover { color: #bc354b; -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-wrap .form-field .field-desc:hover::-webkit-input-placeholder { color: #bc354b; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-wrap .form-field .field-desc:hover:-moz-placeholder { color: #bc354b; }
.form-wrap .form-field .field-desc:hover::-moz-placeholder { color: #bc354b; }
.form-wrap .form-field .field-desc:hover:-ms-input-placeholder { color: #bc354b; }
.form-wrap .form-field .field-desc:hover:focus::-webkit-input-placeholder { -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); color: rgba(153, 153, 153, 0.5); }
.form-wrap .form-field .field-desc:hover:focus:-moz-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-wrap .form-field .field-desc:hover:focus::-moz-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-wrap .form-field .field-desc:hover:focus:-ms-input-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-wrap .form-field .field-desc.ucode { width: 145px; }
.form-wrap .form-field .field-radio { float: left; width: calc(100% - 190px); max-width: 400px; padding: 6px 10px; box-sizing: border-box; font-size: 18px; color: #fff; font-size: 18px; }
.form-wrap .form-field .field-radio .radio { margin-right: 10px; }
.form-wrap .form-field .field-radio .radio:last-child { margin-right: 0; }
.form-wrap .form-field .getcode { display: inline-block; float: left; height: 33px; margin: 0 5px; }
.form-wrap .form-field .reset { display: inline-block; float: left; height: 33px; cursor: pointer; }
.form-wrap .form-free { display: block; }
.form-wrap .free-text { float: left; width: 100%; font-size: 30px; color: #fff; text-align: center; letter-spacing: 4px; }
.form-wrap .free-text .radio { color: #fff; width: 100%; font-size: 24px; }
.form-wrap .free-text .radio:nth-child(1) { font-weight: bold; }
.form-wrap .free-text .radio:nth-child(2) { color: rgba(255, 255, 255, 0.6); }
.form-wrap .free-radio { float: left; width: calc(100% - 190px); max-width: 400px; padding: 6px 10px; box-sizing: border-box; font-size: 18px; }

.sitemap-menu { display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; padding: 50px 0; }
.sitemap-menu ul { width: 900px; }
.sitemap-menu ul li { float: left; width: 100%; margin-bottom: 20px; }
.sitemap-menu ul li a { float: left; width: calc(100% / 5 - 10px); padding: 10px 0; border: 1px solid #fff; font-size: 24px; line-height: 1; font-weight: bold; color: #fff; text-align: center; }
.sitemap-menu ul .submenu { float: left; width: calc(100% / 5 * 4 - 12px); margin-left: 20px; position: relative; }
.sitemap-menu ul .submenu:before { content: ""; width: 0; height: 0; position: absolute; left: -20px; top: 12px; border-style: solid; border-color: transparent transparent transparent #fff; border-width: 12px 0 12px 12px; }
.sitemap-menu ul .submenu li { float: left; width: calc(100% / 4 - 8px); margin-bottom: 10px; margin-right: 10px; }
.sitemap-menu ul .submenu li:nth-child(4n) { margin-right: 0; }
.sitemap-menu ul .submenu li a { width: auto; float: none; display: block; font-size: 21px; line-height: 24px; font-weight: normal; }

@media (max-width: 1280px) { .news-list li:nth-child(2) { width: 65%; height: 2em; } }
@media (max-width: 1024px) { .case-detail-wrap { width: 90%; }
  .about-wrap .about-img { width: 40%; }
  .course-wrap .calendar-info { padding: 20px; }
  .course-wrap .calendar-info .date { float: left; height: 80px; margin-right: 10px; font-size: 66px; line-height: 1.2; }
  .course-wrap .calendar-info .time, .course-wrap .calendar-info .location { height: 24px; overflow: hidden; font-size: 18px; }
  .course-list li { width: 50%; float: left; -moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.1); } }
@media (max-width: 768px) { .case-detail-wrap { width: 100%; }
  .about-wrap .about-img { width: 100%; height: 350px; overflow: hidden; }
  .course-wrap .calendar-wrap { width: 100%; height: auto; padding-top: 30px; padding-bottom: 30px; }
  .course-wrap .calendar-wrap .calendar { height: auto; }
  .course-wrap .calendar-wrap .calendar .year { top: -30px; }
  .course-wrap .calendar-wrap .calendar .month { top: 0; }
  .course-wrap .calendar-wrap .calendar .timetable { position: relative; float: left; margin-left: 120px; right: 0; }
  .course-wrap .calendar-info { width: 100%; }
  .news-title { font-size: 50px; } }
@media (max-width: 640px) { .sub-menu { display: block; }
  .sub-menu li { text-align: center; }
  .case-list { display: block; }
  .case-list .item { width: calc(50% - 30px); margin-right: 30px !important; }
  .case-list .item:nth-child(2n) { margin-right: 0 !important; }
  .course-wrap .calendar-wrap .calendar { margin: 0; }
  .course-wrap .calendar-wrap .calendar .month { left: 10px; width: 90px; font-size: 90px; }
  .course-wrap .calendar-wrap .calendar .timetable { width: calc(100% - 115px); margin-left: 90px; }
  .course-list li { width: 100%; float: left; }
  .news-title { font-size: 35px; }
  .service-ezlook ul { width: 80%; }
  .news-list { width: 100%; padding-top: 20px; }
  .contact-wrap .remark { margin-left: 0px; text-align: center; }
  .form-wrap .form-field { display: block; }
  .form-wrap .form-field .field-radio { display: block; padding-left: 0; }
  .form-wrap .form-field .field-radio .radio { width: 50%; }
  .form-wrap .form-field .field-label { width: 100%; padding-left: 0; text-align: left; }
  .form-wrap .form-field .field-desc { width: 100%; max-width: inherit; }
  .form-wrap .form-field.message { display: block; }
  .form-wrap .free-text { font-size: 24px; letter-spacing: 0; }
  .sitemap-menu ul { width: 100%; }
  .sitemap-menu ul li a { width: calc(100% / 3 - 10px); }
  .sitemap-menu ul .submenu { float: left; width: calc(100% / 3 * 2 - 12px); }
  .sitemap-menu ul .submenu li { width: calc(100% / 2 - 8px); }
  .sitemap-menu ul .submenu li:nth-child(2n) { margin-right: 0; } }
@media (max-width: 480px) { .case-list { display: block; }
  .case-list .item { display: inline-block; width: 100%; margin-right: 0; }
  .case-list .item .photo img { width: 100%; max-width: inherit; }
  .course-wrap .calendar-info .date { width: 100%; }
  .course-wrap .calendar-info .time, .course-wrap .calendar-info .location { float: left; width: 100%; }
  .course-title .date { height: 80px; font-size: 58px; line-height: 1.2; }
  .course-title .time, .course-title .location { height: 24px; padding-top: 10px; font-size: 18px; }
  .course-title .subject { font-size: 24px; }
  .news-title { font-size: 30px; } }
@media (max-width: 390px) { .course-title .date { width: 100%; height: auto; }
  .course-title .time, .course-title .location { float: left; width: 100%; height: auto; }
  .course-title .subject { font-size: 20px; }
  .about-wrap .about-img { height: 300px; }
  .news-title { font-size: 20px; }
  .sitemap-menu ul { width: 100%; }
  .sitemap-menu ul li a { width: calc(100% / 2 - 10px); }
  .sitemap-menu ul .submenu { float: left; width: 100%; margin-left: 0; margin-top: 20px; }
  .sitemap-menu ul .submenu:before { content: ""; width: 0; height: 0; position: absolute; left: calc(25% - 18px); top: -20px; border-style: solid; border-width: 12px 12px 0 12px; border-color: #fff transparent transparent transparent; }
  .sitemap-menu ul .submenu li { width: calc(100% / 2 - 8px); } }

/*# sourceMappingURL=style.css.map */