/* 全球華文網 
----------------------------------------*/
html {
    font-size: 14px;
	direction: ltr;
	overflow-x: hidden;
	box-shadow: none !important;
}
body {
    /* background: url("../img/bg-wrap.png"); */
    border-top: 0.57rem solid #F2F2F2;
	color: #777;
	font-family: "微軟正黑體",Arial, Helvetica, sans-serif;
    margin: 0;
}
Header
#header { bottom:-10px; }

section {clear: both;}
ul li:last-child { border-bottom: 0 !important;  }
button, input { outline:none; }

a ,a:hover, a:focus { color:#3a9bbb; }
.inner-section { font-size: 1.143rem; line-height: 1.714rem; font-weight: 300; }
.inner-section .h2, .inner-section h2 { font-size: 2.286rem; color: #615a58; font-weight: 300; }
.inner-section .h4, .inner-section h4 { color: #444; font-size: 1.286rem; line-height: 1.500rem; }

.checkbox label, .radio label , label.control-label,
.form-group .redio-inline { font-weight: 300;}

input,
input[type=checkbox], input[type=radio],
.checkbox input[type=checkbox], 
.checkbox-inline input[type=checkbox], 
.radio input[type=radio], 
.radio-inline input[type=radio] { border-radius: 0 !important; }

select:not([multiple]){
    -webkit-appearance:none;
    -moz-appearance:none;
    background-position:right 50%;
    background-repeat:no-repeat;
    background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
    background-position: 99%;
    padding:0 1.5em 0 1em;
    border-radius:0;
}
/* img */
.rounded-circle {
    border-radius: 50%!important;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}

.form-group.row select { margin: 15px; width: 95%; }

.content_wrap{ 
    background-color: #FFF; 
    /* box-shadow: 0 2px 17px rgba(0, 0, 0, .3);  */
}
.content_wrap .container{ 
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.content_wrap .breadcrumb { background-color: #FFF !important; font-size: 1.143rem; font-weight: 300; padding: 1.429rem 0; margin-bottom: 0; }
.content_wrap .breadcrumb a {color: #868585;}
.content_wrap .breadcrumb a:hover {color: #739a3c;}
.content_wrap .breadcrumb>.active { color: #739a3c; }

/* 灰底狀態 */
.content_wrap .breadcrumb.bg-grey { background-color: #f5f5f5 !important; padding: 1.429rem; border-radius: 0; }

.content_wrap .description { color: #444; font-size: 1.286rem; background-color: #f2f2f2;font-weight: 300;line-height: 1.929rem; padding: 2.143rem 3.36rem; }

.content_wrap .description p { margin: 0; font-size: 1.286rem; }
.content_wrap .description.notice-box p { margin: 0; font-size: 1.143rem; letter-spacing: .06rem;}

.notice-box { border:#ef9898 solid 2px; }

.input-lg {font-size: 16px !important;}
.help-block { font-size: 16px; line-height: 24px; /*letter-spacing: -.2px;*/ }

.card-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1.25rem;
}
.card-body, 
.description .card-body p { font-size: 1.143rem;}
.user-box { margin: 0 -15px; padding: 0;}



/* 清除gutters */
.row.no-gutters {
    margin-right: 0;
    margin-left: 0;
  }
  .row.no-gutters > [class^="col-"],
  .row.no-gutters > [class*=" col-"] {
    padding-right: 0;
    padding-left: 0;
  } 
  section {margin: 2.286rem 0;}
 .inner-section {margin: 2.143rem 0 !important;}

 /* Tab */
 .nav-tabs { font-size: 1.186rem; font-weight: 300; }
 .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    border-top: 3px solid #9abf65;
	margin-bottom: -1px;
 }
 .nav-tabs>li>a { border-top: 3px solid #eeeeee; background-color: #f4f4f4; border-bottom: 0; }

html body .tabs .nav-tabs .nav-link,
html.dark body .tabs .nav-tabs .nav-link,
html body .tabs .nav-tabs .nav-link:hover,
html.dark body .tabs .nav-tabs .nav-link:hover {
  color: #615a58;
}

html body .tabs .nav-tabs .nav-link:hover,
html.dark body .tabs .nav-tabs .nav-link:hover,
html body .tabs .nav-tabs .nav-link:focus,
html.dark body .tabs .nav-tabs .nav-link:focus {
  border-top-color: #9abf65;
}
html body .tabs .nav-tabs li.active .nav-link,
html.dark body .tabs .nav-tabs li.active .nav-link {
  border-top-color: #9abf65;
  /* color: #9abf65; */
}
html body .tabs .nav-tabs.nav-justified .nav-link:hover,
html.dark body .tabs .nav-tabs.nav-justified .nav-link:hover,
html body .tabs .nav-tabs.nav-justified .nav-link:focus,
html.dark body .tabs .nav-tabs.nav-justified .nav-link:focus {
  border-top-color: #9abf65;
}
html body .tabs.tabs-bottom .nav-tabs li .nav-link:hover,
html.dark body .tabs.tabs-bottom .nav-tabs li .nav-link:hover,
html body .tabs.tabs-bottom .nav-tabs li.active .nav-link,
html.dark body .tabs.tabs-bottom .nav-tabs li.active .nav-link,
html body .tabs.tabs-bottom .nav-tabs li.active .nav-link:hover,
html.dark body .tabs.tabs-bottom .nav-tabs li.active .nav-link:hover,
html body .tabs.tabs-bottom .nav-tabs li.active .nav-link:focus,
html.dark body .tabs.tabs-bottom .nav-tabs li.active .nav-link:focus {
  border-bottom-color: #9abf65;
}
html body .tabs.tabs-vertical.tabs-left .nav-tabs li .nav-link:hover,
html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li .nav-link:hover,
html body .tabs.tabs-vertical.tabs-left .nav-tabs li.active .nav-link,
html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li.active .nav-link,
html body .tabs.tabs-vertical.tabs-left .nav-tabs li.active .nav-link:hover,
html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li.active .nav-link:hover,
html body .tabs.tabs-vertical.tabs-left .nav-tabs li.active .nav-link:focus,
html.dark body .tabs.tabs-vertical.tabs-left .nav-tabs li.active .nav-link:focus {
  border-left-color: #9abf65;
}
html body .tabs.tabs-vertical.tabs-right .nav-tabs li .nav-link:hover,
html.dark body .tabs.tabs-vertical.tabs-right .nav-tabs li .nav-link:hover,
html body .tabs.tabs-vertical.tabs-right .nav-tabs li.active .nav-link,
html.dark body .tabs.tabs-vertical.tabs-right .nav-tabs li.active .nav-link,
html body .tabs.tabs-vertical.tabs-right .nav-tabs li.active .nav-link:hover,
html.dark body .tabs.tabs-vertical.tabs-right .nav-tabs li.active .nav-link:hover,
html body .tabs.tabs-vertical.tabs-right .nav-tabs li.active .nav-link:focus,
html.dark body .tabs.tabs-vertical.tabs-right .nav-tabs li.active .nav-link:focus {
  border-right-color: #9abf65;
}
html body .tabs.tabs-simple .nav-tabs > li.active .nav-link,
html.dark body .tabs.tabs-simple .nav-tabs > li.active .nav-link,
html body .tabs.tabs-simple .nav-tabs > li.active .nav-link:focus,
html.dark body .tabs.tabs-simple .nav-tabs > li.active .nav-link:focus,
html body .tabs.tabs-simple .nav-tabs > li .nav-link:hover,
html.dark body .tabs.tabs-simple .nav-tabs > li .nav-link:hover,
html body .tabs.tabs-simple .nav-tabs > li.active .nav-link:hover,
html.dark body .tabs.tabs-simple .nav-tabs > li.active .nav-link:hover {
  border-top-color: #9abf65;
  color: #9abf65;
}
html body .tabs-primary .nav-tabs li .nav-link,
html.dark body .tabs-primary .nav-tabs li .nav-link,
html body .tabs-primary .nav-tabs.nav-justified li .nav-link,
html.dark body .tabs-primary .nav-tabs.nav-justified li .nav-link,
html body .tabs-primary .nav-tabs li .nav-link:hover,
html.dark body .tabs-primary .nav-tabs li .nav-link:hover,
html body .tabs-primary .nav-tabs.nav-justified li .nav-link:hover,
html.dark body .tabs-primary .nav-tabs.nav-justified li .nav-link:hover {
  color: #9abf65;
}
html body .tabs-primary .nav-tabs li .nav-link:hover,
html.dark body .tabs-primary .nav-tabs li .nav-link:hover,
html body .tabs-primary .nav-tabs.nav-justified li .nav-link:hover,
html.dark body .tabs-primary .nav-tabs.nav-justified li .nav-link:hover {
  border-top-color: #9abf65;
}
html body .tabs-primary .nav-tabs li.active .nav-link,
html.dark body .tabs-primary .nav-tabs li.active .nav-link,
html body .tabs-primary .nav-tabs.nav-justified li.active .nav-link,
html.dark body .tabs-primary .nav-tabs.nav-justified li.active .nav-link,
html body .tabs-primary .nav-tabs li.active .nav-link:hover,
html.dark body .tabs-primary .nav-tabs li.active .nav-link:hover,
html body .tabs-primary .nav-tabs.nav-justified li.active .nav-link:hover,
html.dark body .tabs-primary .nav-tabs.nav-justified li.active .nav-link:hover,
html body .tabs-primary .nav-tabs li.active .nav-link:focus,
html.dark body .tabs-primary .nav-tabs li.active .nav-link:focus,
html body .tabs-primary .nav-tabs.nav-justified li.active .nav-link:focus,
html.dark body .tabs-primary .nav-tabs.nav-justified li.active .nav-link:focus {
  border-top-color: #9abf65;
  color: #9abf65;
}
html body .tabs-primary.tabs-bottom .nav-tabs li .nav-link:hover,
html.dark body .tabs-primary.tabs-bottom .nav-tabs li .nav-link:hover,
html body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li .nav-link:hover,
html.dark body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li .nav-link:hover {
  border-bottom-color: #9abf65;
}
html body .tabs-primary.tabs-bottom .nav-tabs li.active .nav-link,
html.dark body .tabs-primary.tabs-bottom .nav-tabs li.active .nav-link,
html body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li.active .nav-link,
html.dark body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li.active .nav-link,
html body .tabs-primary.tabs-bottom .nav-tabs li.active .nav-link:hover,
html.dark body .tabs-primary.tabs-bottom .nav-tabs li.active .nav-link:hover,
html body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li.active .nav-link:hover,
html.dark body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li.active .nav-link:hover,
html body .tabs-primary.tabs-bottom .nav-tabs li.active .nav-link:focus,
html.dark body .tabs-primary.tabs-bottom .nav-tabs li.active .nav-link:focus,
html body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li.active .nav-link:focus,
html.dark body .tabs-primary.tabs-bottom .nav-tabs.nav-justified li.active .nav-link:focus {
  border-bottom-color: #9abf65;
}
html body .tabs-primary.tabs-vertical.tabs-left li .nav-link:hover,
html.dark body .tabs-primary.tabs-vertical.tabs-left li .nav-link:hover {
  border-left-color: #9abf65;
}
html body .tabs-primary.tabs-vertical.tabs-left li.active .nav-link,
html.dark body .tabs-primary.tabs-vertical.tabs-left li.active .nav-link,
html body .tabs-primary.tabs-vertical.tabs-left li.active .nav-link:hover,
html.dark body .tabs-primary.tabs-vertical.tabs-left li.active .nav-link:hover,
html body .tabs-primary.tabs-vertical.tabs-left li.active .nav-link:focus,
html.dark body .tabs-primary.tabs-vertical.tabs-left li.active .nav-link:focus {
  border-left-color: #9abf65;
}
html body .tabs-primary.tabs-vertical.tabs-right li .nav-link:hover,
html.dark body .tabs-primary.tabs-vertical.tabs-right li .nav-link:hover {
  border-right-color: #9abf65;
}
html body .tabs-primary.tabs-vertical.tabs-right li.active .nav-link,
html.dark body .tabs-primary.tabs-vertical.tabs-right li.active .nav-link,
html body .tabs-primary.tabs-vertical.tabs-right li.active .nav-link:hover,
html.dark body .tabs-primary.tabs-vertical.tabs-right li.active .nav-link:hover,
html body .tabs-primary.tabs-vertical.tabs-right li.active .nav-link:focus,
html.dark body .tabs-primary.tabs-vertical.tabs-right li.active .nav-link:focus {
  border-right-color: #9abf65;
}

.tab-content { font-size: 1.143rem; font-weight: 300; color: #615a58; padding: 1.714rem 0; }

/* Table */
.table, .table>thead>tr>th { text-align: center;}

.table a { color: #615a58; }

.table-hover > tbody > tr:hover,
.table-hover.table-striped>tbody>tr:hover{
    font-weight: 400;
    cursor: pointer;
    background-color: rgba(212, 212, 212, 0.55);
  }

.table>thead>tr>th {  background-color: #9ABF65; color: #fff; border-bottom: 0; }

.table>thead>tr>th ,.table>tbody>tr>td  { border-left: 1px rgba(255, 255, 255, 0.7) solid;}

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 12px;
    border-top: 1px solid transparent;
}
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: transparent;
}
.table-striped>tbody>tr:nth-of-type(even) {
    background-color: #f4f4f4;
}

/* 首頁 
-------------------------------------------------------------------*/
/* Header */
.header-login .btn {padding: 0; border-radius: 0;}

.nav-pills>li.btn-login i { display:none!important; }
.nav-pills>li.btn-login { color: #FFF; font-weight: 400; text-align: center; width: 4.86rem; height: 2.43rem;  line-height: 1.14rem; background-color: #9ABF65; border-color: #9ABF65 #9ABF65 #8bad5d; }
.nav-pills>li.btn-login>a { border-radius: 0 !important; }
.nav-pills>li.btn-login>a:hover,
.nav-pills>li.btn-login>a:focus { color: #666!important; width: 4.86rem; height: 2.43rem; }

#header .header-search .btn-search {
    background-color: #888;
    border: 0 none;
    border-radius: 0;
    color: #FFF;
    height: 34px;
    /* position: absolute; */
    right: 0;
    top: 0;
    z-index: 3;
} 
#header .header-search .btn-search:hover, #header .header-search .btn-search:focus {background-color: #666;}

.header-login.list-inline li {margin: 0; padding: 0;}
.header-login.list-inline button {margin: 0 0 0 -5px; }
.navbar-right {margin-top:-16px;}

.header-r-nav { margin-top: 3.48rem; }
.header-r-nav li {     
    display: inline-block;
    padding-right: 12px !important;
    padding-left: 12px !important;
    border-left: 1px solid #DCD5D3;
}
.header-r-nav li a { color: #444444; }
.header-r-nav li a:hover { color: #9ABF65; }
.header-r-nav li:first-child {
    border-left: none !important;
}

.header-nav-main nav {margin-top: .6rem;}

.header-nav-main nav > ul > li > a {
    color: #444;
    border-radius: 0 !important;
    line-height: 3px!important;
    padding: 2px ;
    font-weight: normal !important;
    padding-right: 12px ;
    padding-left: 12px ;
}
.header-nav-main nav > ul > li { border-left: 1px solid #DCD5D3;}
.header-nav-main nav > ul > li:first-child {border-left: none !important;}

.header-nav-main nav > ul > li > a:hover {
    color: #9ABF65 !important; background: none !important;
}

.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {
    color: #739a3c  !important;
    background-color: transparent;
}
.dropdown-menu { font-size: 1.143rem;}

/* 僑校影片區 */
div.bg-youtube iframe { background-image: url('../img/bg-youtube.jpg'); background-repeat: no-repeat; background-size: cover;} 
iframe { margin-top: 40px; }

/*  Left Side
------------------------------- */
/* 最新消息 */
.news-item { margin: 0 auto; }
.news-item .area-title h2 { margin-top: 0;}
.news-item ul { margin:0 ;padding: 0; list-style: none; }
.news-item ul li a { color: #FFF; line-height: 3.86rem; font-size:1.21rem; background-color: #9ABF65; display: block; padding: 0 20px;border: 0px;border-bottom: #DCD5D3 dotted 1px;}
.news-item ul li a:hover, .news-item ul li a:focus { background-color: #8bad5d;}
.news-item i { margin-right: 6px; }
.news-date { margin-right: 16px; font-family: Arial, Helvetica, sans-serif;}
.news-item li.more a { color: #9ABF65; margin: 0 auto; text-align: center; background-color: #F2F2F2; line-height: 2.86rem; border-bottom:none; }
.news-item li.more a:hover, .news-item li.more a:focus { color: #739a3c; background-color: #e3e3e3;}

/* 列表專區 */
/* 按鈕 Start */
.btn-green { color: #FFF; font-size: 18px; background: #9ABF65; width: 2.5rem;height: 2.5rem; line-height: .9rem;  text-align: center; border-radius: 0;}
.btn-green:hover, .btn-green:focus{ color: #FFF; background: #739a3c; font-size: 1.143rem; }

.btn.btn-green-nwh {color: #FFF; font-size: 16px; font-weight: normal; background: #9ABF65; line-height: 2.857rem; border-radius: 0; }
.btn.btn-green-nwh:hover { font-size: 1.143rem; color: #FFF; background: #739a3c; }

/* 僑校園地－貼文區 */
.ocac-place .btn.btn-green-nwh { color:#444444;  background-color: #e7e4e4;}
.ocac-place .btn.btn-green-nwh:hover,
.ocac-place .btn.btn-green-nwh:focus,
.ocac-place .btn.btn-green-nwh.active { color:#FFF;  background-color: #9abf65;}

.btn.btn-green-radius , input.btn.btn-green-radius {color: #FFF; font-size: 16px; font-weight: normal; background: #9ABF65; line-height: 2.857rem; border-radius: 4px !important; }
.btn.btn-green-radius:hover, input.btn.btn-green-radius:hover { font-size: 1.143rem; color: #FFF; background: #739a3c; }

.btn.btn-grey-radius , input.btn.btn-grey-radius {color: #FFF; font-size: 16px; font-weight: normal; background: #7f7f7f; line-height: 2.857rem; border-radius: 4px !important; }
.btn.btn-grey-radius:hover, input.btn.btn-grey-radius:hover { font-size: 1.143rem; color: #FFF; background: #636364; }

/* 僑校園地 Start */
html .ocac-place li.more a { background-color: #e3e3e3; }
html .ocac-place li.more a:hover, html .ocac-place li.more a:focus { background: #d9d6d6; }
/* 僑校園地 End */

/* 按鈕 End */

.area-title h2 { font-size: 1.43rem; color: #444444; line-height: 2rem; text-align: left; font-weight: 500; display:block; }
.area-title b  { font-size: 1.21rem; font-weight: 200; color: #94652e; line-height: 1.74rem; margin-left:10px; }

.zone-wrap { position: relative; clear: both;}
.zone-wrap .b-pre { position: absolute; left: 0; top: 5.2rem; z-index:3; }
.zone-wrap .b-next { position: absolute; right: 0px; top: 5.2rem; z-index:3;}

/* .zone-box { margin-bottom: 1.429em; } */
.zone-box h4 { font-size: 1.43rem; font-weight: normal; color: #444444; line-height: 1.93rem;} 
.zone-box p { font-size: 1.07rem; font-weight: 300; color: #444444; line-height: 1.57rem;
    overflow : hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;/* for Opera */
    -moz-binding: url('ellipsis.xml#ellipsis');    /* Firefox */
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical; }

a:hover .zone-box h4 {color: #8bad5d; }

/* .area-imgbox img:last-child { border-right: #FFF solid 1px;}*/
.area-imgbox { min-width: 17.79rem; min-height: 7.68rem; width: 100%; background-color: #F2F2F2; margin: 0; } 
.area-link { min-width: 17.79rem; min-height: 7.68rem; width: 100%; margin: 0; } 
.area-link ul { margin: 0; padding: 2.143rem; list-style: none; background-color: #F2F2F2; } 
.area-link ul li a { margin-bottom: 0.571rem; border: #FFF solid 1px;position: relative; display: list-item; } 

/* ＋僑校園地 Start */
.ocac-place .area-link { min-width: 17.79rem; min-height: auto; width: 100%; margin: 0; }
.ocac-place .breadcrumb.bg-grey { padding: 12px !important; }

.ocac-place .honor-roll h2 { font-size: 1.429rem; color: #444444; font-weight: 500; text-align: left; margin: 0; height: 30px; } 
.ocac-place .honor-roll .box { 
    background-color: #ebf4dd; 
    padding: 1.65rem 0.214rem;
    min-height: 8.00rem;
    border-top: #9ABF65 solid 0.214rem; 
    margin-bottom: 20px;
    text-align: center;
    display: flex;
}
.ocac-place .honor-roll .box p { 
    color: #444444; 
    font-size: 0.929rem;
    overflow: hidden;
	white-space: nowrap;
    text-overflow: ellipsis;
    width: 66px;
    text-align: center;
    margin: 0 auto;
}

.ocac-place .ocac-box ul li, 
.ocac-place .ocac-box ul li a { 
    overflow: hidden;
	white-space: nowrap;
    text-overflow: ellipsis;
}

.ocac-place .main-r-box { padding: 0 0 0 2.143rem !important; }
.ocac-place .area-imgbox img { height: 334px; }

.ocac-place .title-green { font-size: 1.286rem ; color: #9abf65; margin: 0 0 15px 0; }

.badge-box { position: relative; float: left; text-align: center; display: block; }

.badge-1 { background-image: url("../img/ic-school.png"); display: block; position: relative; text-decoration: none; width: 66px; height: 60px; margin: 0 auto;}
.badge-1 span { font-size: 15px; color: #FFF; font-weight: bold; display: block; position: relative;float:right; padding: 23px 9px 0  0; text-shadow: 1px 1px 4px #b34141; }

.badge-box2 { position: relative; float: left; text-align: center; display: block; z-index: 0; width:66px; }
.badge-box2 img { width: 60px; max-width: 66px;  }
.badge-2 { z-index: 9 ; background: url("../img/ic-medal.png") top center no-repeat;display: block; position: absolute; width: 20px; height: 30px; bottom: 1.4rem; right: 0; text-align: center; margin: 0 auto;}
.badge-2 span { font-size: 15px; color: #FFF; font-weight: bold; display: block; position: relative; padding: 0; text-shadow: 1px 1px 4px #b34141; }
.badge-box2 p { display: block; padding-top: 4px;} 

/* ＋僑校園地 End */


/* 打暗效果 */
.area-link ul li a:hover,  .area-link ul li a:focus { -webkit-filter:grayscale(1); }
/* 
.area-link ul li a:hover::before, .area-link ul li a:focus::before {
	display: block;
    position: absolute;    
    background: rgba(23, 23, 23, 0.1５);
    -webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
 } */


.areabox { padding: 0.86rem 1rem;}

.index_areabox { 
	padding: 0.86rem 1rem 0 1rem;
    margin-bottom: 0.86rem;
	font-size: 1.07rem; font-weight: 300; color: #444444; line-height: 1.57rem;
    overflow : hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;/* for Opera */
    -moz-binding: url('ellipsis.xml#ellipsis');    /* Firefox */
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}
.index_areabox p{
    visibility: visible;
}

.course-info .thumb-info-wrapper:last-child {border-right: #FFF solid 1px;}

.btn.btn-green.pull-right {margin-right: 2px;}

/* carousel */
.ad-item a { 
        font-weight: 400; 
        color: #444; 

        width:100%;
        display: -webkit-box;
        overflow : hidden;
        -webkit-box-orient: vertical;
        text-overflow: ellipsis;

        -o-text-overflow: ellipsis;/* for Opera */
        -moz-binding: url('ellipsis.xml#ellipsis');/* Firefox */
        -webkit-line-clamp: 2;
    }
.ad-item a i { color: #777;}
.ad-item {
    font-size: 1.286rem;
    font-weight: 300;
    line-height: 1.8rem;
    background-color: #ddd;
    padding: 1.24rem 1.429rem;
}
.ad-item:hover, .ad-item:focus { background-color: #C6C6C6; cursor: pointer; }


/*  Right Side
------------------------------- */
/* 僑校園地 */
.ocac-box  { margin: 0 auto; }
.ocac-box ul { margin:0 ;padding: 0; list-style: none; }
.ocac-box ul li a { color: #444; line-height: 3.21rem; font-size:1.14rem; font-weight: 300; background-color: #F2F2F2; display: block; padding: 0 .93rem;border: 0px;border-bottom: #FFF solid .14rem;}
.ocac-box ul li a:hover,.ocac-box ul li a:focus { background-color: #e3e3e3;}

/* 相關連結 */
.area-link .owl-nav { display: flex; }
.area-link button { float: left; margin: 0; padding: 0;}
.area-link button.btn-block+.btn-block {
    margin-top: 0; margin-left: 1px;
}
.area-link .btn-green-nwh i { font-size: 24px; font-weight: 600; }


/* Footer 
------------------------------- */
/* Social Icons */
.social-icons {
	margin: 0;
	padding: 0;
	width: auto;
}

.social-icons li {
    font-size: 36px;
	display: inline-block;
	margin: -1px 0 5px 10px;
    padding: 0;
    border-radius: 4px;
	overflow: visible;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3);
}

.social-icons li a {
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
    border-radius: 4px;
	display: block;
	height: 4.29rem;
	line-height: 4.29rem;
    width: 4.29rem;
	text-align: center;
	color: #FFF !important;
	text-decoration: none;
}


.social-icons li.social-icons-facebook a {
	background: #3B5998;
}
.social-icons li:hover.social-icons-facebook a {
	background: #4365ae;
}
.social-icons li.social-icons-youtube a {
	background: #e11a0c;
}
.social-icons li:hover.social-icons-youtube a {
	background: #f51d0e;
}

#footer a:hover, #footer a:focus {
    color: #FFF !important;
}

ul.footer-list { line-height: 1.714rem; margin-left: -10px;}

.footer-list-item,
.footer-social-buttons li { 
    line-height: 1rem;
    display: inline-block;
    padding-right: 12px !important;
    padding-left: 12px !important;
    border-right: 1px solid #D3D3D3;
}
.footer-list-item:last-child {
    border-right: none !important;
}

#footer .footer-copyright ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
#footer .footer-copyright ul li {
    line-height: 1.714rem;
    margin: 0;
    padding: 0;
}



/* Inner Pages
---------------------------------------------- */
/* Breadcrumb */
.breadcrumb>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "\003e";
}
/* Banners */
.inner-banner { width: 81.429rem; height: 23.571rem; margin:0 auto; vertical-align: middle; clear: both;}
.inner-banner span { font-size: 2.286rem; color: #FFF; background-color: rgba(0, 0, 0, .65); padding: 2.000rem 4.286em; display: block; z-index: 99; }
.banner-001 { background-image:url("img/inner/inner-banner-001.jpg");}

/* 最新消息 */
.sidebar { 
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f2f2f2+2,ffffff+100&1+40,0+100 */
    background: -moz-linear-gradient(top, rgba(242,242,242,1) 2%, rgba(247,247,247,1) 80%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(242,242,242,1) 2%,rgba(247,247,247,1) 80%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(242,242,242,1) 2%,rgba(247,247,247,1) 40%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */; padding: 1.07rem; min-height: 50.000rem; border-top: #9ABF65 solid .93rem; margin-bottom: 20px; }
.sidebar ul { margin: 0; padding: 0;list-style: none; }
.sidebar ul li { font-size: 1.29rem; color: #444; font-weight: 200; line-height: 4.21rem; border-bottom: #D2DFBF solid 1px;text-align: center; }
.sidebar ul li:last-child { border-bottom: 0; }
.sidebar ul li a {color: #444;}
.sidebar ul li a:hover, .sidebar ul li a:focus, 
.sidebar ul li.active a, .sidebar ul li.active a:hover, .sidebar ul li.active a:focus { color: #000; font-weight: 400; } 

/* 進階搜尋 */
.search-advanced {
    font-size: 1.29rem;
    color: #444;
    font-weight: 200;
    line-height: 4rem;
    width: 100%;
    background-color: #d2dfbf;
    text-align: center;
    border: none;
}
.search-advanced:hover, .search-advanced:focus,
.search-advanced.active {
    color: #000;
    font-weight: 400;
}

.search-wrap {  font-size: 1.143rem; line-height: 1.786rem; background-color: #F2F2F2; padding:1.29rem; margin: -15px -20px -20px -20px; clear: both;}
/* +僑校園地 */
.search-wrap.m-0 { padding: 15px !important; margin: 0 !important;; clear: both !important;;}

.search-wrap.row.no-gutters{ font-size: 1.143rem; line-height: 1.786rem; background-color: transparent !important; padding:1.29rem;clear: both; margin:0 -15px 0 -15px;  }

.search-wrap .form-group { margin: 6px 0 !important; display: inline-block; }
.search-wrap .form-group label { line-height: 34px; }
.search-wrap .form-group input[type=checkbox], .search-wrap .form-group input[type=radio] {
    margin: 8px 0 0 -20px;
    padding: 0;
}

/* 搜尋條件 */
.s-criteria { margin-top:0; }
.inner-section.s-criteria { margin-top:0 !important; }

.search-criteria { min-height: 46.286rem; 
    background: #f2f2f2 url("../img/inner/bg-search-criteria.jpg") no-repeat center center/cover; display: table; }
.search-criteria .search-wrap { background: transparent; width: 100vw; padding: 0; display: table-cell; vertical-align: middle; }
.bg-search-bar {
    display: inline-block;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    user-select: none;
    background: rgba(77, 77, 77, 0.65);
    padding: 24px;
    border-width: 1px;
    border-style: solid;
    border-color: transparent;
    border-image: initial;
}
.search-criteria .search-wrap h2 { color: #FFF; margin: 0; margin-bottom: 1.714rem; font-weight: 300; }

.search-box .divider, .tblog-box .divider {
    border: 0;
    height: 1px;
    margin: 10px auto 30px auto; 
    background: #9abf65;
    text-align: left;
    position: relative;
    clear: both;
}

.tblog-box .news-list ul { padding: 0; }

.search-box .divider h2, 
.tblog-box .divider h2 { font-size: 1.429rem; margin: 0 auto; padding-right: 10px; top: -10px; z-index: 1;position: absolute; background-color: #FFF;}

.search-wrap [type="checkbox"], .search-wrap [type="radio"] { border-radius: 0;}

.bubble {
    position: relative;
    background-color: #99bf64;
    width: 100px;
    margin-right: 26px;
    padding: 0;
    height: 34px;
    font-size: 16px;
    line-height: 2.42em;
    color: #FFF;
    text-align: center;
}

.bubble:after {
    position: absolute;
    content: "";
    left: 100%;
    top: 0;
    width: 0;
    height: 0;
    border-top: 17px solid transparent;
    border-left: 15px solid #99bf64;
    border-bottom: 17px solid transparent;
    border-right: 1rem solid transparent;
}

.search-wrap .checkbox-inline+.checkbox-inline,
.search-wrap .radio-inline+.radio-inline ,
.search-wrap .checkbox-inline, .search-wrap .radio-inline {
    margin-top: 0;
    margin-left: 0;
    margin-right: 15px;
}
.search-wrap .form-control { border-radius: 0; }
.search-wrap .input-group .form-control { 
    font-size: 16px;
    line-height: 2.857rem;
    height: 2.857rem;
    border: 1px solid #cfcfcf;
 }

.search-wrap .input-group-btn .btn-green { font-size: 16px; font-weight: 200; width: 100px; margin-left: 10px; height: 2.857rem ; border-radius:4px;  }

.info-kyeword { font-size: 1.143rem; font-weight: 200; line-height: 1.786rem; display: block; clear: both; margin: 1.429rem 0; }

.ebookinfo-box {border:1px solid #adafab; border-top:0; margin-top: 80px; }
.sort-item h2 { color: #FFF; font-size: 1.286rem;line-height: 3.143rem; height: 3.143rem; background-color: #adafab; display: block; padding: 0 20px; margin: 0; }

.book-list .thumb-info-caption-text h4 { margin-top: 2px; margin-bottom: 14px; }

.sort-item .book-list { padding: 0 3.143rem;}
.sort-item .book-list hr { border: 0; border-top: 1px dotted #b5b5b5; display: block; height: 0; clear: both; margin: 1.571rem 0 !important; }

.sort-item .book-list .thumb-info { padding: 24px 0; border-bottom: 1px dotted #ccc; top:1px; background-color: transparent; }

.sort-item .news-list i, .sort-item.news-list i { color: #9ABF65; }
.sort-item .news-list ul {
    list-style: none;
    margin: 0px auto;
    padding: 10px 36px;
}
.sort-item .news-list ul li a:hover { color: #000000; }
.sort-item.news-list ul {margin: 10px -15px; padding: 0; }
.sort-item.news-list ul li a:hover { color: #000000; background-color: rgba(255, 255, 255, .7);  }
.sort-item.news-list ul li {line-height: 3.4rem;}

.sort-item .thumb-info-caption-text { margin-top: 28px; vertical-align: middle;}

.book-list-btn .btn.btn-green-nwh { font-size: 16px; border-radius: 4px; vertical-align: middle;height: 50px; width: 30.33333%; /* padding: 0 5.2rem;*/ }
.book-list-btn .btn.btn-green-nwh i { font-size: 33px; vertical-align: middle; margin-left: 8px; margin-top: -6px; }

.sort-item .book-list .thumb-info-caption-text { vertical-align: middle; padding:0; }
.sort-item .book-list .thumb-info-caption-text h4 { font-size: 16px; }
.thumb-info-caption .book-list-btn .btn.btn-green-nwh { font-size: 16px; border-radius: 4px; vertical-align: middle; line-height: 40px;  width: 25%;  }
.thumb-info-caption .book-list-btn .btn.btn-green-nwh i { font-size: 20px; vertical-align: middle; margin-left: 4px; }

.ebook-date i { color: #739a3c; font-weight: 200; margin-right: 10px; }
.ebook-date { font-size: 1rem;color: #adafab; }

/* 會員註冊 */
.register-info ul { list-style: none; padding: 5px 0 0 0; list-style-position: inside;  }
.register-info ul li { margin: 0 0 8px 0; padding: 0 0 0 24px; }
.register-info ul li.red, .register-info li.red:before { color: #901d22; }
.register-info li:before {
    content: '※';
    float: left;
    margin-left: -1.5em;
  }
  .form-horizontal .control-label {
    padding-top: 0;
    margin-bottom: 0;
    text-align: left;
}

.notice-box .red,  .red { color: #901d22;}

.register-box { background-color: #dbe8c9; border: none; }
.google-box { background-color: #f0d2cf; border: none; }
.facebook-box { background-color: #cdd8ef; border: none;  }

.register-box,.google-box,.facebook-box { font-weight: 200; color: #666;}
.register-box:hover, .register-box:focus, 
.google-box:hover, .google-box:focus, 
.facebook-box:hover, .facebook-box:focus { color: #000; }
.register-box:hover i, .register-box:focus i { color: #f2f2f2; background-color: #4e8e46; }
.google-box:hover i, .google-box:focus i { color: #f2f2f2; background-color: #901d22; }
.facebook-box:hover i, .facebook-box:focus i { color: #f2f2f2; background-color:#223c72; }
.register-box i { font-size: 2.4rem; color: #fff; background-color: #9abf65; border-radius:4.571rem; width: 4.571rem; height: 4.571rem;  text-align: center; line-height:4.571rem; vertical-align: middle; }
.google-box i { font-size: 2.4rem; color: #fff; background-color: #dc4e41; border-radius:4.571rem; width: 4.571rem; height: 4.571rem;  text-align: center; line-height:4.571rem; vertical-align: middle; }
.facebook-box i { font-size: 3.143rem; color: #fff; background-color: #3b5998; border-radius:4.571rem; width: 4.571rem; height: 4.571rem;  text-align: center; line-height:4.571rem; vertical-align: middle; padding-top: 2px; }
.register-box ul, .google-box ul, .facebook-box ul { padding-left: 0; margin: 1.571rem auto; }
.register-box ul li, .google-box ul li, .facebook-box ul li { font-size: 1.143rem; display: inline-block; vertical-align: middle; text-align: left; }
.register-box li p, .google-box li p, .facebook-box li p { padding: 0.714rem 0 0 8px; }

.img-vcode { width: 100% !important; height: 46px; background: #FFF;}


/* 最新消息 */
.news-list ul { list-style: none; margin: 0 auto; padding: 2rem 0 0.93rem 2.5rem;  }
.news-list ul li { font-size: 1.14rem; font-weight: 300; line-height: 4.07rem; border-bottom: 1px dotted #D8D8D8;  clear: both; }
.news-list ul li a { color: #444; display: block;}
.news-list ul li a:hover { font-weight: 400; color: #000; background-color: #F2F2F2;}
.news-list ul li a:hover .news-date { color: #444;}
.news-list i { color: #901D22; margin-left: 1rem; margin-right: .7rem;}
.news-list .news-date { margin-right: 16px; font-family: Arial, Helvetica, sans-serif;}

.inner-wrap { padding: 0 0 0 3.357rem;}
.inner-wrap h2{ padding: 0; margin: 0; }

.inner-article {font-size: 1.143rem; font-weight: 300; display: block; line-height: 1.714rem; padding: 1.5rem 2.143rem; margin: 0;}

.inner-article p {  
    margin: 0 0 10px 0;
    line-height: 1.857rem;
    text-align: justify;
    }

/* .inner-article p img { max-width: 600px; height: auto;  } */
aside img { max-width: 600px; height: auto; margin: 0 auto 30px auto; }

.inner-article a {color:#51addd ; }

.inner-article ul {list-style: none; padding: 0; margin: 0; margin: 2.143rem 0;}
.inner-article ul li { line-height: 2.143rem; }
.inner-article ul li strong { font-weight: 400;}
.inner-article i { color: #9ABF65; margin-right: 3px; }

hr.dashed, .divider.dashed {
	background: none;
	position: relative;
}

hr.dashed:after, .divider.dashed:after {
	border-top: 1px dashed #DBDBDB;
	content: "";
	display: block;
	height: 0;
	position: absolute;
	top: 50%;
	margin-top: -1px;
	width: 100%;
}

.blockquote-title { border-left: 15px solid #9abf65; line-height: 1.714rem; padding: 0 1.071rem;}
.blockquote-title .date { font-size: 1.286rem; color: #a7a7a7; font-weight: 300;  } 
.blockquote-title h2 { font-size: 1.286rem; } 

.annex img { margin: 1.714rem 0; max-width: 600px; }

/* 分頁 */
.pagination>li>a, .pagination>li>span { color: #444; font-size: 1.14rem; line-height: 3.29rem; padding: 0 18px;}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, 
.pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    background-color: #6a6a6a;
    border-color: #6a6a6a;
}

/* 電子書城 */
.main-r-box { padding: 0 0 0 3rem !important; }

.book-list .thumb-info-caption-text { color: #444;}
.book-list .thumb-info-side-image .thumb-info-caption .thumb-info-caption-text { padding: 0;}
.book-list .thumb-info-side-image .thumb-info-side-image-wrapper { padding: 0; }
.book-list .thumb-info img { border-radius: 0; }
.book-list .thumb-info a:hover img { -webkit-filter:brightness(.65); background-color: #000; }
.book-list .thumb-info a:focus img { -webkit-filter:brightness(.65); background-color: #000; }

.ebook-title { margin: 0 0 1.8rem 0;}

.book-list .thumb-info-caption-text h4 { 
    font-size: 1.286rem;
    line-height: 1.5rem;
    height: 1.5rem;
    overflow : hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;/* for Opera */
    -moz-binding: url('ellipsis.xml#ellipsis');    /* Firefox */
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.book-list .thumb-info-caption-text ul { list-style: none; }
.book-list .thumb-info-caption-text ul li { 
    font-size: 1.14rem; 
    line-height: 1.79rem; 
    font-weight: 200;
    margin-bottom: 6px;
    overflow : hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;/* for Opera */
    -moz-binding: url('ellipsis.xml#ellipsis');    /* Firefox */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

 hr.book-list {
    margin-top: 1.57rem;
    margin-bottom: 1.57rem;
    border: 0;
    border-top: 1px dotted #B5B5B5;
}

/* 搜尋結果＋一般文案頁面 */
.inner-section .search-results h2,
.inner-section .gen-wrap h2 { margin: 0; }
.search-results, .gen-wrap,
.inner-section .gen-wrap .h4, .inner-section .gen-wrap h4 { color: #615a58 !important; }

/* 影音專區 */
section.search-bar { margin: 1.571rem 0 -10px 0 !important; } 
.video-area h2 { font-size: 1.571rem; color: #444444; font-weight: normal; }

/* 僑校活動成果 */
.ocac-img-list .thumb-info-wrapper { border-radius: 0; margin: 0; }

/* .ocac-img-list .thumb-info-caption-text {
    
    font-size: 1.14rem;
    line-height: 1.79rem;
    font-weight: 300;
    
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow:    ellipsis;
    padding: 0;
    margin: 1rem 0;
}  */

.ocac-img-list .thumb-info-caption-text {
    color: #444;
    font-size: 1.14rem;
    line-height: 2rem;
    font-weight: 300;
    text-align: justify;
    overflow : hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    padding: 0; 
    margin: 1rem 0;
}

.ocac-img-list a:hover .thumb-info-caption-text { color: #739a3c; font-weight: 400; }

.title-ocac { font-size: 20px; color: #444444; }
.ocac .inner-article { padding: 1rem 0; } 
hr.ocac { border-top: 1rem solid #f2f2f2; margin: 0 0 1.857rem 0;}

/* 學華語向前走 */
.tab-item .btn.btn-block.btn-green-nwh:hover,
.tab-item .btn.btn-block.btn-green-nwh:focus,
.tab-item.tblog .btn.btn-block.btn-green-nwh:hover,
.tab-item.tblog .btn.btn-block.btn-green-nwh:focus { background-color: #739a3c;}

.tab-item .btn.btn-block.btn-green-nwh.active,
.tab-item.tblog .btn.btn-block.btn-green-nwh { background-color: #9abf65; box-shadow:none; }
.tab-item .btn.btn-block.btn-green-nwh {background-color: #bccaa8;}


.lc-book .thumb-info { background-color: #f2f2f2 !important; padding: 1.286rem; color: #615a58; font-size: 1.143rem; margin-bottom: 2.143rem; min-height:22rem; }
.lc-book .thumb-info h5 { font-size: 1.429rem;}
.lc-book .thumb-info-side-image .thumb-info-side-image-wrapper { padding: 0; margin-right: 1.286rem; }
.lc-book .thumb-info-side-image .thumb-info-caption .thumb-info-caption-text {padding: 0; vertical-align: middle; }

.lc-book .thumb-info-caption {display: table; padding: 0; }
.lc-book .thumb-info-caption button { line-height: 30px; margin-top: 10px; border-radius: 4px; }
.lc-book .thumb-info img { border-radius: 0; }
.br-1 { border-right: 1px solid #FFF; }

.btn.plr-50 {padding: 0 3.571rem; border-radius: 4px !important; }

.news-list.material-info ul {margin: 0; padding: 0;}
.news-list.material-info ul li {margin: 0 !important; padding: 0 !important; line-height: 2rem; border-bottom: 0;  }
.news-list.material-info  i { margin-left: 0; margin-right: 0.286rem; color: #9ABF65;}

/* Toggle Style */
html .toggle-primary .toggle label {
    color: #444;
    border-left-color: #f2f2f2;
    border-right-color: #f2f2f2;
  }
  html .toggle-primary .toggle.active > label {
    background-color: #f2f2f2;
    border-color: #f2f2f2;
    color: #444;
  }
  html .toggle-primary.toggle-simple .toggle > label:after {
    background-color: #f2f2f2;
  }
  html .toggle-primary .toggle > .toggle-content {
    line-height: 1.714rem;
    background-color: #f8f8f8;    
	padding: 1.429rem 3.429rem 3.000rem 3.429rem ;
    margin-bottom: 2px;
    }
    html .toggle-primary .toggle > .toggle-content ul {  margin: 0; padding: 0; margin-top: 15px;}
    
    html .toggle-primary .toggle > .toggle-content ul ol,
    html .toggle-primary .toggle > .toggle-content ul li {
        color: #444;
        font-size: 1.143rem;
        font-weight: 300;
       margin: 0; padding: 0; list-style: none;
    }
    .toggle > .toggle-content > p,
    b, strong  {
        color: #444;
        font-size: 1.143rem;
        font-weight: 300;
        line-height: 2rem;
    }
    
    


/* 網站地圖 */
    .sitemap-wrap h2 { color: #ffffff; font-size: 1.429rem; text-align: center; background-color: #9abf65; padding: 1rem; line-height:3.571rem; font-weight: 300; margin: 0; border-right: 1px solid #FFF; }
    .sitemap-wrap h2 a { color: #ffffff; }
    .sitemap-wrap a:hover h2 { background-color: #739a3c; }
    .sitemap-wrap ul {  margin: 0; padding: 20px 0 ; min-height: 330px;  }    
    .sitemap-wrap ul li { list-style: none; color: #444; font-size: 1.143rem; letter-spacing: .05em;  font-weight: 300; text-align: left;  padding: .65rem 2.143rem; }
    .sitemap-wrap ul li a { color: #000000;}
    .sitemap-wrap ul li:hover { background-color: #f2f2f2; font-weight: 400; cursor: pointer; }

/* PopUp Dialog */
    .modal-header .close { font-size: 2rem;}
    .modal-content { font-size: 16px; }
    .modal-dialog .form-horizontal .control-label {
        line-height: 34px;
    }
    .modal-footer { border-top: 0; }



/* Responsive */
@media (max-width: 1200px) {
    
    .news-item ul li a { line-height: 1.6rem; padding: 16px 20px;}
    .news-list ul li i { margin-left: 10px !important;}
    .btn.btn-green.pull-right {margin-right: 1px !important;}
    .area-imgbox { min-height: 7.52rem !important;}
    .zone-wrap .b-next { right: 0!important;}
    /* 電子書城 */
    .ebook-title { margin: 0px 0px .9rem; }
    .book-list .thumb-info-caption-text h4 { margin-top: 0; margin-bottom: 6px; }
    .sort-item .book-list {  padding: 0 20px; }
    .thumb-info-caption .book-list-btn .btn.btn-green-nwh { width: 24%; }
    .col-sm-8 .sort-item .news-list ul { margin: 0px; padding: 10px;}
    .col-sm-8 .sort-item .news-list ul li a { line-height: 2rem; padding: 10px; }
    .col-sm-8 .sort-item .news-list ul li a .news-date { display: block;}
    .news-list i { margin-left: 0;}

    .content_wrap .description p.nowrap { white-space: normal; }
}

@media (min-width: 991px) and (max-width: 1200px) {
    .btn.btn-green.pull-right {margin-right: 0 !important;}
    .zone-wrap .b-next { right: 0 !important;}
    .zone-wrap .b-pre, .zone-wrap .b-next { top: 5rem; }

}

@media (min-width: 992px) {
    .ocac-box>ul>li>a { line-height: 22px; padding: .9rem; }
}

@media (max-width: 991px) {
    .content_wrap .description { padding: 1.5rem 1.8rem; } 

    #header .header-search .btn-search { position: absolute;}
    .nav-pills>li.btn-login { margin-right: 36px;}

    .header-nav-main nav > ul > li { border-left: 0; }
    .header-nav-main nav > ul > li > a { line-height: 1rem !important; }

    .dropdown-menu>li>a { color: #666!important; font-size: 13px; font-weight: 300!important; line-height:14px; padding: 4px!important;  }
    .dropdown-menu>li>a:hover { color: #739a3c!important;  }

    section.search-bar { margin:1rem 0 -20px 0 !important; } 
    .area-link ul { padding: 2.143rem 6.68rem; } 

    .news-item ul { margin-bottom: 30px;}
    iframe {height: 420px; margin: 0px;}
    .area-imgbox { min-height: 11.24rem !important;}

    .btn.btn-green.pull-right {margin-right: 1px !important;}
    .zone-wrap .b-pre, .zone-wrap .b-next {display: none !important;}
    .zone-box .course-info { min-height: 305px; }

    .sidebar { background-color: #F2F2F2; padding: .5rem; min-height: auto; border-top: #9ABF65 solid .93rem; }
    .news-list ul { list-style: none; margin: 0 auto; padding: 0;  }

    .main-r-box { padding: 0 0 0 15px !important;}
    .ocac-place .col-md-8.main-r-box  { padding: 0 !important; }
    
    .book-list .thumb-info {margin-bottom: 1.57rem;}
    hr.book-list { margin-top: 0;}
    .sort-item .thumb-info-caption-text { margin-top: 0;}
    .sort-item .thumb-info-caption { padding: 0; }
    .sort-item .thumb-info-caption .book-list-btn .btn.btn-green-nwh { line-height: 30px; }
    .thumb-info-caption .book-list-btn .btn.btn-green-nwh { width: 32%; }   
    
    .ocac-place .area-imgbox img {
        height: 315px;
    }

    .badge-box2 { padding-left: 1rem;}

}

@media (max-width: 767px) {
    .input-group[class*=col-] {
        float: none;
        /* padding-right: 0; */
        /* padding-left: 0; */
    }

    .inner-section { margin-left: 15px !important; margin-right: 15px !important; }
    
    .google-box ul, .facebook-box ul { float: left; padding-left: 22px !important; margin: 1rem auto;  }
    .area-title h2 { padding-left: 15px !important; }
    header#header { min-height: 76px !important; }
    
    #header .header-logo img { width: 172px; margin: 10px; }
    #header .header-btn-collapse-nav { margin: 8px 10px;}
    #header .header-nav-top { margin-top: 10px; }

    .nav-pills>li.btn-login { background-color:#F2F2F2 !important; border-color:#F2F2F2 !important; }

    .nav-pills>li.btn-login>a {color: #888 !important;}

    .nav-pills>li.btn-login,
    .nav-pills>li.btn-login>a:hover,
    .nav-pills>li.btn-login>a:focus {width: 38px; height: 34px; border-radius: 4px !important; margin-right: 10px; }

    .nav-pills>li.btn-login i { display: block !important; font-size: 0.9em; }

    #header .header-nav-main nav > ul > li.active > a, #header .header-nav-main nav > ul > li.active > a:focus, #header .header-nav-main nav > ul > li.active > a:hover { background-color: #F2F2F2;}

    iframe { height: 280px;}
    .thumb-info .thumb-info-title {padding: 8px 10px; }

    /* .content_wrap .breadcrumb { margin: -5px 10px; } */
    .content_wrap .description { padding: 10px 10px;}

    .sidebar ul li { line-height: 3.2rem;}
    .main-r-box { padding: 15px !important;}

    .sort-item .news-list ul { padding: 0 !important; }
    .sort-item .news-list ul li a .news-date, .sort-item .news-list ul li a:hover .news-date {
        color: #444;
    }
    
    
}
@media (max-width: 768px) {
    .content_wrap .breadcrumb {padding: 10px 15px !important; }
    .content_wrap .description { padding: 10px !important; }
    .news-list ul { margin: 15px !important;}

    .ocac-place .area-imgbox img { height: auto; }
    
}
@media (max-width: 640px) {
    
    .news-item ul li a { line-height: 2rem; padding: 8px 15px; font-size: 16px; text-align: justify;}
    .news-list ul li i { margin-left: 0 !important;}
    .area-title h2 { line-height: 2rem; } 
    .area-title b { display: block; padding: 0; margin: 0; line-height: 1.7rem; }
    .zone-box h4 { font-size: 1.24rem;padding: 0 0 4px 0; margin: 0;}

    .ad-item a{
        width: 100vw;
        overflow : hidden;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;/* for Opera */
        -moz-binding: url('ellipsis.xml#ellipsis');    /* Firefox */
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical; }
    
    .area-link { min-width: 17.79rem; min-height: 7.68rem;}  

    .footer-info span { padding-left:0 !important; }
    
    .inner-wrap { padding: 0 15px; }

    .inner-article p { margin: 0 0 20px 0;}

    .zone-box .course-info { min-height: auto; }
    .news-date { display: block;}
    .news-list ul li a .news-date,.news-list ul li a:hover .news-date { color: #901D22;}
    .news-list ul li a { line-height: 1.64rem; padding: 10px 15px; }
    .news-list ul li i { margin-left: 0; }

    .pagination>li>a, .pagination>li>span {
        color: #444;
        font-size: 14px;
        line-height: 2.7rem;
        padding: 0 1rem;
    }
    .dropdown-menu { font-size: 14px;}
    .main-r-box { padding: 10px !important;}
    .ocac-place .main-r-box { padding: 0 15px !important; }
    .search-wrap .form-group { margin: 3px  !important; }
    .book-list .thumb-info-caption .book-list-btn .btn.btn-green-nwh { width: 45%; }
    .book-list .thumb-info-caption { display: flex;}

    .thumb-info-caption-text ul { width: 100%; margin: 0; padding: 0;  }


    .sitemap-wrap ul { min-height: 60px; padding: 0 !important;} 
    
  }

  @media (max-width: 480px) {

    .inner-article {  padding: 0 0 1.5rem 0 ; }
    * { font-weight: normal; }
    .content_wrap .description p { margin: 0 10px !important; }
    .content_wrap .description.notice-box p { line-height: 1.2em }
    
    .inner-article p { text-align: left;}
    .inner-article p img, .annex img { width: 100% !important; height: auto !important; }

    #footer { margin-top: 0; }
    iframe {height: 210px;}
    .area-link ul { padding: 2.143rem; } 
    section.search-bar { margin: 10px 0 -40px 0 !important; } 

    .search-wrap .checkbox-inline+.checkbox-inline,
    .search-wrap .radio-inline+.radio-inline ,
    .search-wrap .checkbox-inline, .search-wrap .radio-inline {        
        margin-right: 40px;
    }
    .book-list-btn .btn.btn-green-nwh { width: 100%;}
    .book-list .thumb-info-caption .book-list-btn .btn.btn-green-nwh { width: 90%; }
    .book-list .thumb-info-caption .book-list-btn .m-xs {margin: 3px 0 !important;}
    .thumb-info-caption .book-list-btn .btn.btn-green-nwh {
        font-size: 15px;
        line-height: 16px !important;
        height: 36px;
    }
    .news-list ul { margin:0 !important;}
    .news-list i { margin-right: 4px; }
    .sort-item .news-list ul { padding: 0 !important; }
    .col-sm-8 .sort-item .news-list ul li a { line-height: 1.8rem; padding: 12px 20px; }
    /* .thumb-info-side-image-wrapper a img { width: 100% !important; display: flex;}
    .ebook-info ul { display: flex; clear:both ;} */
    .content_wrap .description * { font-size: 15px !important; line-height: 22px; }
    .content_wrap .description { padding: 10px 5px !important;  }

    .google-box *, .facebook-box * ,.search-results *,.gen-wrap *, .inner-section * { font-size: 15px; }

    .inner-section .search-results, .inner-section .gen-wrap { margin: -15px 10px;}
    .inner-section .search-results h2,.inner-section .gen-wrap h2 { font-size: 24px; margin: 10px 0 0 0; }
    .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { padding: 8px; }
    .search-wrap { margin: 0 !important;}
    .search-criteria { min-height: 23.143rem; margin: 0; }

    /* 學華語向前走 */
    .lc-book .thumb-info {  margin-bottom: 1.7rem; }
    .btn.plr-50 { width: 100%; }

    /* 教師部落格 */
    .tblog-box .news-list { margin-bottom: 30px;}

    /* 網站導覽 */
    .sitemap-wrap * {font-size: 15px; font-weight: 400 !important; }
    .sitemap-wrap h2 { margin: 5px 0; padding: 0; } 
    .sitemap-wrap ul { min-height: auto; padding: 5px !important;} 

    /* 僑校園地－個人排行 */
    .badge-box2 { padding-left: 0;}
  }