@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;700&display=swap');
html,body {
    padding: 0px; margin: 0px; min-height:100%; font-size:18px; color: #333; line-height:28px;
	font-family: "cwTeXYen",'Noto Sans TC', sans-serif;
}
a{transition: all 0.3s ease 0s;}
a:link, a:visited {color: #333333; text-decoration: none;}
a:hover {color: #ffa800  }

.clear{clear:both}
.contextual-links-region{ position: static}
table{border-collapse: inherit; line-height:28px;}
table ul, table ol{ margin:0; }
img {border:0;}
div, ul li{ margin:0px auto; padding:0px;}

.wrap{ width:100%; min-height:100%;overflow: hidden; }
.screen{ min-width:300px; max-width:1600px; position:relative; padding:0px 10px;}
.container{ height: auto; min-height:500px;   }
.container .screen{  padding:0 15px; }

.container a {-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1;}

h1{ font-size:38px; color:#032d69; text-transform:uppercase; line-height:38px;}
h2{ font-size:33px; color:#3c99dc; }
h3{ color:#032d69; border-left:2px solid #2565ae; background:#f9f9f9; padding:10px 20px 10px 20px; box-shadow:1px 2px 3px rgba(0,0,0,.2); margin:0px 0 15px 0; display:inline-table; font-size:24px; }
h4{ font-size:23px; margin:0px; color:#ffa800; line-height:33px;}
h5{ font-size:23px; margin:0px; color:#117098; line-height:33px;}
p{ margin:0px; padding:0px}


.container{ height: auto; min-height:500px; }
.FullPage  .main_content{ width:100% !important}
#tpl { background: linear-gradient(#ebf9ff,#fff); border-top:5px solid #f4f02b }

.container #full { padding:10px; width:calc(100% - 20px); float:none; background: #fff; }
.more_area{ position:absolute; right:0px; display:block; font-size:14px; margin-top:30px ;text-align:center; }
.more_area a{ color:#333; background: #fff; padding: 10px 40px 10px 40px;text-transform: uppercase;border-top-left-radius: 8px;
border-bottom-left-radius: 8px; }
.more_area a:hover{ background: #333 ; color:#fff }
.main_events_area {  background:#fff ; padding:5px; margin-top: 10px;}
.container .title{padding:35px 0 35px 15px; color:#333; font-size:30px; } 
.hover01 figure img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity:1;
}
.hover01 figure:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	opacity:.8;
}
figure {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background: #fff;
	overflow: hidden;
}
figure:hover+span {
	bottom: -36px;
	opacity: 1;
}
.hover02 figure img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity:.3;
}
.hover02 figure:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	opacity:.7;
}


#jssor_1{ overflow: hidden; }
#slogan_left { position:absolute; left:5%; color:#fff; font-size:60px; line-height:68px; text-shadow: 0 0 3px rgba(0,0,0,.2); bottom:100px; background:rgba(255,102,0,.7); padding:5px 10px 10px 10px  }
#slogan_right { position:absolute; right:5%; color:#fff; font-size:60px; line-height:68px; text-shadow: 0 0 3px rgba(0,0,0,.2); bottom:100px; background:rgba(255,102,0,.7); padding:5px 10px 10px 10px  }


.header{ background:url(../images/web/bg_top.png) #fff ; border-top:3px solid #0075d4 ; z-index:1; position:relative }
.logo{ float:left; padding: 5px 5px 10px 5px;background: #fff; top:-3px; box-shadow: 0 0 2px rgba(0,0,0,.3);position: absolute;border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px; z-index:1; width: calc(12% - 5px); }
.logo img{height: 168px ; max-width: 100%; height:auto; }

.header .links_top { position: relative;right: 0;margin: 55px 0px 0 0;float: right; width:8%; margin-left:1%;}
.header .links_top ul li a img { height: auto; max-width:100%; width:auto;}
.header .links_top ul { list-style:none; margin:0; padding: 0 0 ;}
.header .links_top ul li { float:left; margin:0;}
.header .links_top ul li a { color:#333; display:block}

.header .links_top .lang a{background: #f2ac00;padding: 5px 10px;display:block; border-radius: 8px; }
.header .links_top .lang a:hover {color:#333; background: #3ac6ca;}
.header .links_top .lang a.current {color: #fff; background:#F90 }

.sticky { z-index:10; opacity: 1; }
.sticky .header { position:fixed; top:0px; z-index:10; width:100%; box-shadow:  0 0 3px rgba(0,0,0,.2) ;  } 
.sticky .logo { top:-3px}
/* Menu Bar */
#bs-example-navbar-collapse-animations ul.navbar-nav{ float: right; text-align: center; width:80% }
.navbar-material-blue .navbar-nav > li > a {  color: #1b3e98; padding:75px 0 10px 0; margin:5px 2px 0 5px;}
.navbar-material-blue .navbar-nav > li > a:hover, .navbar-material-blue .navbar-nav > li > a:focus { 
}

.navbar-material-blue .navbar-nav > .open > a,.navbar-material-blue .navbar-nav > .open > a:hover,.navbar-material-blue .navbar-nav > .open > a:focus {
}


.dropdown-menu > li > a {
  display: block;
  padding: 8px 20px; font-size:16px; line-height:21px;
  clear: both;
  font-weight: normal;
  color: #333;
  white-space:break-spaces;
  
}
.dropdown-menu > li > a.current { background-color: #1b3e98;  color: #ffffff; }

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: #fff;
  text-decoration: none;
  background-color:#fcc04c;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #fff;
  text-decoration: none;
  background-color: #fcc04c;
  outline: 0;
}
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
  background-color: #e7f9ff;
}
.btn_back{ margin:0px auto; text-align: center; margin-top:50px; margin-bottom:50px;}
.btn_back a{ border-radius:8px; display: inline-block; padding:10px 50px; color:#fff !important;  background: linear-gradient(to left, #013d85 50%, #eee9e4 50%); background-size: 200% 100%; background-position: right bottom;  transition: all .5s ease-out;  }
.btn_back a:hover { background-position: left bottom; color:#013d85 !important;}

.slider_inner{ margin:30px auto; text-align: center}
/* Main */
.main_1{ border-top: 3px dashed #6baeca;  padding:50px 0;  border-bottom: 3px dashed #6baeca;  margin:10px 0; background:url(../images/web/inner_bg.png) no-repeat center #fff; background-size:cover}

.latest_new {  float: left;width: calc(33.3% - 1%);margin-right: 1%;}
.latest_new .area{ background:url(../images/web/news_bg.png) no-repeat top left #3a85ce  ; }

.latest_new .title span{ background: url(../images/web/news_icon.png) no-repeat left}

.latest_new ul li{ border-bottom:none; position:relative; padding: 10px 5px;}
.latest_new ul li:nth-of-type(even){background: #f7f7f7;}

.latest_new ul li a{ display:block; padding:0; color:#333;}
.latest_new ul li:hover .content{ color:#0090ff}
.latest_new ul li .cover{ float: left; width: 30%; margin:0 15px 0 0; }
.latest_new ul li .cover img{ max-width:100%; box-shadow: 0px 0px 3px rgba(0,0,0,.2) }
.latest_new .content{ color:#4a4a4a; padding-left:20px; font-weight: bold;font-size: 20px; display: table-cell;
vertical-align: top;}
.latest_new .content p { font-size:16px;  }
.latest_new .content img{ width:25px;}

.latest_new ul li:nth-of-type(2n)  .datebox { background: #ee0f0f;}

.latest_new ul li:nth-of-type(2n)  .day { background: #ee0f0f;}
.latest_new ul li:nth-of-type(2n)  .month span{ color: #ee0f0f;}



.latest_new .datebox {  width:80px; margin:0 0 0 2%; text-align:center; background: #4e8fd8; padding:2% } 
.latest_new .date_area {display: table-cell;
vertical-align: top; } 
.latest_new .day{font-size: 28px; display: block; color: #fff; font-weight:bold; background:#4e8fd8; padding:8px 0; text-align: center;}
.latest_new .datebox span{float: none; padding: 0; color:#fff}
.latest_new .month{font-size: 12px; line-height:15px; background: #fff;padding: 0; color: #000; text-transform: uppercase; text-align: center;display: block;margin: 0 2px 2px; }
.latest_new .datebox span{ padding:2px 0 0 0;} 
.latest_new .month span { color:#4e8fd8}

.latest_new .more_area a {background: #0e4fad;
color: #fff; }
.latest_new .more_area a:hover { background:rgba(0,144,255,1); color:#fff; }
.latest_new .strokeText { color: #0e4fad;-webkit-text-stroke: 1px #0e4fad;}


.latest_new ul { scrollbar-color: #0666d9 #5c9eed; scrollbar-width: thin; }
.latest_new ul::-webkit-scrollbar { width: 5px; }
.latest_new ul::-webkit-scrollbar-track { background: #5c9eed; }
.latest_new ul::-webkit-scrollbar-thumb { background: #0666d9; }



.latest_gallery{ float: left; width:calc(33.3% - 1%);position:relative;  margin:0 0.5%;}
.latest_gallery .area{background: url(../images/web/event_bg.png) no-repeat top left #ffe65c;}

.latest_gallery .title span{ background: url(../images/web/event_icon.png) no-repeat left;}

.latest_gallery ul li{ border-bottom:none;background: #fff; position:relative; padding: 10px 5px;}
.latest_gallery ul li:nth-of-type(even){background: #f7f7f7;}
.latest_gallery ul li span{ padding: 5px;width: 120px;color: #fff;background: #ff9b19;}
.latest_gallery ul li a{ display:block; padding:0; color:#333;}
.latest_gallery .cover{ width:42%; vertical-align: middle;display: table-cell;padding-right: 20px;}
.latest_gallery .content{ vertical-align: middle;display: table-cell;}
.latest_gallery img{ width:100%; }
.latest_gallery ul li span{ display:block}
.latest_gallery .more_area a { background:#ff9b19; color:#fff; }
.latest_gallery .more_area a:hover { background:rgba(253,98,116,1); color:#fff; }

.latest_gallery ul { scrollbar-color:#ffc140 #fff4b6; scrollbar-width: thin; }
.latest_gallery ul::-webkit-scrollbar { width: 5px; }
.latest_gallery ul::-webkit-scrollbar-track { background: #fff4b6; }
.latest_gallery ul::-webkit-scrollbar-thumb { background: #ffc140; }



.latest_video{ float: left; width: calc(33.3% - 1%);margin-left: 1%; position:relative; }
.latest_video .area{background: url(../images/web/video_bg.png) no-repeat top left #ff2a48;}

.latest_video .title span{ background: url(../images/web/video_icon.png) no-repeat left;}
{ list-style:none; margin: 0; padding: 0px;}
.latest_video ul li{ border-bottom:none;background: #fff; position:relative; padding: 10px 5px;}
.latest_video ul li:nth-of-type(even){background: #f7f7f7;}
.latest_video ul li span{ padding: 5px;width: 120px;color: #fff;background: #ff3f5a;}
.latest_video ul li a{ display:block; padding:0; color:#333;}
.latest_video .cover{ width:42%; vertical-align: middle;display: table-cell;padding-right: 20px;}
.latest_video .content{ vertical-align: middle;display: table-cell;}
.latest_video img{ width:100%; }
.latest_video ul li span{ display:block}
.latest_video .more_area a { background:#ffb5ca; color:#000; }
.latest_video .more_area a:hover { background:rgba(0,156,181,1); color:#fff; }
.latest_video .strokeText { color: #df0a28;-webkit-text-stroke: 1px #df0a28;}

.latest_video ul { scrollbar-color:#ec142f #fbc8c8; scrollbar-width: thin; }
.latest_video ul::-webkit-scrollbar { width: 5px; }
.latest_video ul::-webkit-scrollbar-track { background: #fbc8c8; }
.latest_video ul::-webkit-scrollbar-thumb { background: #ec142f; }


.latest_video .title,.latest_gallery .title,.latest_new .title  { position: relative;padding: 20px 0 20px 70px;display: inline-block; z-index:0 }
.latest_new .title span, .latest_gallery .title span, .latest_video .title span{position: absolute;width: 105px;height: 97px;top: -40px;left: -30px; }

.latest_video .area, .latest_gallery .area, .latest_new .area {  padding: 10px 10px 20px 10px;border-radius: 16px;
position: relative;}

.latest_new ul, .latest_video ul, .latest_gallery ul{ list-style:none; margin: 0; padding: 0px; max-height: 400px;min-height: 400px;overflow-y: scroll;z-index: 0;position: relative;}

/* Main Userful Links */
.Userful_link_inside { }
.Userful_link_inside .screen {  padding-bottom:30px;}

.Userful_link_inside ul{ list-style:none; margin:0 0 0 -2%; padding:0 }
.Userful_link_inside ul li{ float:left;}

.Userful_link_inside ul li{ width:18%; margin-left:2%;}

.Userful_link_inside ul li img{ width:100%;  }
.Userful_link_inside ul li:hover img{ opacity:.7; box-shadow:0 0 2px rgba(0,0,0,.4)}
.Userful_link_inside ul li a{display: block;}

#line { width:100%; border-top:3px solid #dedede}


/* Footer */
footer { }

.sch_info {  padding: 20px 0;width: 45%;margin: 0 0 0 27.5%; z-index:1; position:relative}
.sch_info ul{ list-style:none; margin:0;padding:0 ; text-align: center; margin-right: auto; margin-left: auto; display:table}
.sch_info ul li{ float:left; margin:5px 15px;  width: calc(100% - 30px);
text-align: left;}
.sch_info ul li span{vertical-align: middle;display: table-cell;  }
.sch_info ul li p{ vertical-align: middle;display: table-cell;  }
#motto {vertical-align: middle;display: table-cell; }
.sch_info ul li+li {  width: calc(50% - 30px); }
.sch_info ul li img { max-width:100%}


.footer{  font-size:14px; background: #0073d3;border-top: 5px solid #f4f02b;}
.footer .screen{ padding:40px 15px;}
.footer .copyright{ float:left; width:65%; text-align: left ;  color:#fff}
.footer .power{ float:right; width:30%; text-align: right}
.footer .power a{ color:#fff;}
.footer .power a:hover{ color: #094388;}
.footer .copyright a{ color:#fff;}

.inner_banner { position:relative; overflow:hidden; border-radius: 8px; min-height:330px; background-size:cover; background-position: right top; margin:0px auto; border:3px solid #fff; box-shadow: 0 0 3px rgba(0,0,0,.2); margin:5px auto; width:calc(100% - 6px); max-width:1592px; }
.inner_banner h1{ text-align: right; color:#fff; padding:120px 0 20px 0; display:inline-block; float:right; margin-right:50px; background:url(../images/web/border_white.png) repeat-x bottom center; width:20%}

.non_banner{ display:none;  }
.non_banner h1{ }

#media {}

/* Nevigation */
.nevigation{ padding:15px 0px; font-size:13px; border-bottom:1px dotted #ddd; margin-bottom:15px;  }
.nevigation .screen{ padding:0; }
.nevigation .home{ background:url(../images/icon/icon_home.png) no-repeat; background-position:0px 3px; display: block; padding-left:25px; }
.nevigation ul{ list-style: none; margin:0px; padding:0px; }
.nevigation ul .sp{ padding:0px 15px; color:#666 }
.nevigation ul li{ float: left; line-height:24px;  }
.nevigation ul li a{ color:#666; text-decoration: none }
.nevigation ul li a:hover{ text-decoration: underline ; color:#032d69}

/* Page Content */

.new_blue .information{border: 3px dashed #3a85ce;background: #dfefff; border-radius: 16px;}
.new_blue .information ul { background:#fff; border-radius: 16px; box-shadow:0 0 3px rgba(0,0,0,.2); padding:10px !important}
.new_blue .information ul li a{ padding: 5px 15px !important;}
.new_blue h1 { color:#3a85ce }



.event_yellow .information{border: 3px dashed #ffe65c;background: #fff8cf; border-radius: 16px;}
.event_yellow .information ul { background:#fff; border-radius: 16px; box-shadow:0 0 3px rgba(0,0,0,.2); padding:10px !important; }
.event_yellow .information ul li a{ padding: 10px !important;background: #fffcf5 !important; }
.event_yellow h1 { color:#ff7800 }
.event_yellow .date span { background: url(../images/icon/icon_calendar_yellow.png) no-repeat; background-position: 0px 45%;}
.event_yellow #pages ul li a.pgCurrent { background: #ffa85c;}




.video_pink .information{border: 3px dashed #ff4177;background: #fff4f8; border-radius: 16px;}
.video_pink .information ul { background:#fff; border-radius: 16px; box-shadow:0 0 3px rgba(0,0,0,.2); padding:10px !important; }
.video_pink .information ul li a{ padding: 10px !important;background:#fff5f5 !important; }
.video_pink h1 { color:#ff4177 }
.video_pink .date span { background: url(../images/icon/icon_calendar_pink.png) no-repeat; background-position: 0px 45%;}
.video_pink #pages ul li a.pgCurrent { background: #ffa85c;}




.inner_content{background: #fff;padding: 30px;}
.inner_content .main_content{ float:right; width:77%; }
.inner_content_full{  }
.inner_content_full .main_content{ }
.inner_content img, .inner_content_full img{ max-width:100%; width:100%}

.left_menu{ float:left; width: 21%; }
.sidebar-nav {float:left; width:21%; }
.sidebar-nav .title {padding: 52px 0; background: url(../images/web/banner_title_bg.png) no-repeat center; line-height:24px; color:#fff; font-size:26px; background-size: contain;  margin:0px;  text-align: center; }
.sidebar-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
background: #fff;
box-shadow: 0 0 4px rgba(0,0,0,.3);
}


.sidebar-nav ul li ul { background:none; box-shadow:none}
.sidebar-nav .metismenu {
    padding: 8px; border-radius:8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
	border-top: 3px solid #4fb0e5;
margin-top: 5px;
}

.sidebar-nav .metismenu a.current { color:#0766c0; }

.sidebar-nav .metismenu li + li {
  margin-top: 5px;
}
.sidebar-nav .metismenu li:first-child {
  margin-top: 5px;
}
.sidebar-nav .metismenu li:last-child {
  margin-bottom: 5px;
}
.sidebar-nav .metismenu > li {
    /*-webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;*/
	width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
}
.sidebar-nav .metismenu a {
    position: relative;
    display: block;
    padding: 5px 35px 5px 15px;
    color: #333333;
    outline-width: 0;
    transition: all .3s ease-out;
}

.sidebar-nav .metismenu ul a {
    padding: 5px 35px 5px 30px;
}
.sidebar-nav .metismenu ul ul a {
    padding: 5px 35px 5px 45px;
}
.sidebar-nav .mm-active { color: #0866c1 !important; }
.sidebar-nav .metismenu a:hover,
.sidebar-nav .metismenu a:focus,
.sidebar-nav .metismenu a:active,
.sidebar-nav .metismenu .mm-active > a {
    color: #0866c1;
    text-decoration: none;
}

/* Content Template */

.boxing .description{padding:10px; box-shadow: 0 0 3px rgba(0,0,0,.2)}


.boxing  {margin: 0 0 30px 0;padding: 10px;border-radius: 17px;position: relative;}
.boxing .description{border-radius: 16px;padding: 20px;  background: #fff; margin-bottom:20px}
.boxing .title { padding: 20px 30px 10px 0px;color: #fff;display: inline-block;position: relative;
top: 0px; margin-bottom:20px;}

.boxing p { padding:10px 0; text-align:center}
.boxing li { margin-bottom:20px}
.Album ul { list-style:none}

.boxing:nth-child(2n+1) {border: 3px dashed #1f58cd !important;background: #e8f7ff !important; }
.boxing:nth-child(n+1) {border: 3px dashed #ff4177;background: #fff4f8; }


.boxing:nth-child(2n+1) .title { border-bottom: 5px dotted #1f58cd !important; color:#1f58cd !important}
.boxing:nth-child(n+1) .title {border-bottom: 5px dotted #d1003b; color:#d1003b}


.boxing ul{ list-style:none; padding:0px; margin:0; }


#Inner_Type_A:nth-child(2n+1), #Inner_Type_B:nth-child(2n+1), #Inner_Type_C:nth-child(2n+1) ,#Inner_Type_A2:nth-child(2n+1),#Inner_Type_B2:nth-child(2n+1),#Inner_Type_C2:nth-child(2n+1){border: 3px dashed #1f58cd !important;background: #e8f7ff !important; }

#Inner_Type_A:nth-child(n+1) ,#Inner_Type_B:nth-child(n+1),#Inner_Type_C:nth-child(n+1),#Inner_Type_A2:nth-child(n+1) ,#Inner_Type_B2:nth-child(n+1),#Inner_Type_C2:nth-child(n+1){border: 3px dashed #ff4177;background: #fff4f8; }





.right_desc ul { margin:0 0 0 20px !important; padding:0; list-style:outside}
.right_desc ol { margin:0 0 0 20px !important; padding:0; }
.right_desc ul li, .right_desc ol li{ float: none !important;}

#Inner_Type_A ul, #Inner_Type_A2 ul{ margin:0 0 15px -2%; }
#Inner_Type_A li, #Inner_Type_A2 li{ float:left; width:31.3%; margin:0 0 15px 2%; }
#Inner_Type_A li:nth-child(3n+1), #Inner_Type_A2 li:nth-child(3n+1) { clear:both}
#Inner_Type_A li p, #Inner_Type_A2 li p{ text-align: center; }
/*#Inner_Type_A li:nth-child(3n+1), #Inner_Type_A2 li:nth-child(3n+1){ clear:both; }*/

#Inner_Type_B ul, #Inner_Type_B2 ul{ margin:0 0 15px -2%; }
#Inner_Type_B li, #Inner_Type_B2 li{ float:left; width:48%; margin:0 0 15px 2%; }
#Inner_Type_B li p, #Inner_Type_B2 li p{ text-align: left; }
/*#Inner_Type_B li:nth-child(2n+1), #Inner_Type_B2 li:nth-child(2n+1){ clear:both; }*/

#Inner_Type_C li .title_des{ float: left; width:28%}
#Inner_Type_C li,#Inner_Type_C2 li  { clear:both}
#Inner_Type_C li .right_desc{ float: right; width:70%; text-align: left}
#Inner_Type_C2 li { width:100%}
#Inner_Type_C2 li .title_des{ float: right; width:28%}
#Inner_Type_C2 li .right_desc{ float: left; width:70%; text-align: left}
#Inner_Type_C li p, #Inner_Type_C2 li p{ text-align: left; }


.download_area { border: 3px dashed #f90000;background: #fff3f3;border-radius: 16px;padding: 20px; margin-bottom:30px}
.download_area .title { line-height:40px; padding: 0px 0 5px 0px; margin-bottom:30px;color: #f90000;border-bottom: 5px dotted #f90000;
display: inline-block;}
.download_area ul{ list-style:none; margin:0px 0;  padding: 10px;background: #fff;border-radius: 16px; box-shadow: 0 0 3px rgba(0,0,0,.2);}
.download_area ul li{  margin: 10px 0; text-align: left;}
.download_area ul li a{ background:url(../images/icon/icon_download.png) no-repeat left; background-position:3px 5px; padding:8px 0 3px 30px; line-height:19px; color:#555; background-size:23px 23px; display:block;}
.download_area ul li a:hover{ background:url(../images/icon/icon_download.png) no-repeat left; background-position:3px 8px; color:#666;background-size:23px 23px}

#Inner_Type_D ul{ list-style:none; margin:0px 0 ; padding:0px;}
#Inner_Type_D ul li{ float:left; width:31%; margin:0 0 15px 2%; text-align: left;}
#Inner_Type_D ul li a{ background:url(../images/icon/icon_download.png) no-repeat left; background-position:3px 5px; padding:8px 0 3px 30px; line-height:19px; color:#555; background-size:23px 23px; display:block;}
#Inner_Type_D ul li a:hover{ background:url(../images/icon/icon_download.png) no-repeat left; background-position:3px 8px; color:#666;background-size:23px 23px}

#tpl .dropdown span {cursor: pointer;border-bottom:1px solid #039;color:#004b87; font-size:16px; border:1px solid #ddd; padding:5px 30px 5px 5px; position:relative;   }
#tpl .dropdown { float:right; margin: 0 0; position:relative;  }
#tpl .dropdown span::after {
    content: "\f078"; color:#27548d; font-weight:normal;
	font-style:normal; font-family: FontAwesome; position:absolute; right:5px; top:5px;

    outline: none;

 
    pointer-events: painted;
	float:right;   display:block; 
}

#tpl .dropdown-content {
  display: none;
  position: absolute; right:0;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
  padding: 0;
  z-index: 1;
}
#tpl .dropdown:hover .dropdown-content {  display: block;}
#tpl .dropdown-content ul { list-style: none; padding:5px; margin:0; display: flex;
  flex-direction: column-reverse;}
#tpl .dropdown-content ul li {  float: right;  width:100%;}
#tpl .dropdown-content ul li a{ display:block; padding:5px ; text-align: center; border-bottom:1px dotted #ddd; color:#333 }
#tpl .dropdown-content ul li a:hover { background:#004b87; color:#fff; }

/* Sub Category  */
.sub_category{ float: left; margin-bottom:20px; }
.sub_category ul{ list-style:none; padding:0px; margin:0px; }
.sub_category ul li{ float:left; margin-right:15px;}
.sub_category ul li a{ padding:10px 21px; display:block; color:#2080d1; background: #fff; font-size:16px; line-height:19px; border:1px solid #2080d1; }
.sub_category ul li a:hover{ background: #ffae00; color:#fff; border:1px solid #2080d1;}
.sub_category ul li a.current{ background: #013d85 ; color:#fff; border:1px solid #032d69 ; }

/* Information Template */
#pages{ float:right; margin:15px 0px 0 ; clear: both; font-size:12px;}
.pages_page{ float:left;padding:0px 10px 0 0;}
#pages ul{ float: left; list-style:none; min-height:17px; margin:0px; padding:0px;}
#pages ul li{  float: left; margin:0px 5px 0px 5px;}
#pages ul li a{ line-height:25px; height:25px; width:25px; display: inline-block; text-align: center; background:#fff; border-radius:50%; color:#333; box-shadow:0 0 3px rgba(0,0,0,.2)}
#pages ul li a:hover{ background:#ececec; text-decoration:underline }
#pages ul li a.pgCurrent{ background:#013d85; color:#fff}

.information{background: #fff;padding: 10px; }
.information ul{ list-style:none; margin:0; padding:0px;}
.information ul li{ position:relative; border-bottom: 1px solid rgba(157, 157, 157, 0.2); }
.information ul li a{ display:block}

.date span {background:url(../images/icon/icon_calendar.png) no-repeat  ; padding:8px 20px 8px 40px; display: inline-block; color:#333; background-size:35px 32px; background-position:0px 45%;  background-size:15% !important}


#template_A .information ul{ list-style:none; padding:5px 0;}
#template_A .information ul li .cover{ float:left; width:33%; margin:0 15px 0 0; }
#template_A .information ul li:nth-child(3n+1) { clear:both; }
#template_A .information ul li a{ padding:15px; margin:10px 0}
#template_A .information ul li a:hover { background:#eee9e4; }
#template_A .information .date { display:inline-block}

#template_B .information ul{ list-style:none; padding:5px 0; margin:0 0 0 -2%;}
#template_B .information ul li{ float:left; width:48%; margin:0 0 15px 2%; }
#template_B information ul li:nth-child(2n+1) { clear:both; }
#template_B .information ul li .cover{ float:left; width:33%; margin:0 15px 0 0; }
#template_B .information ul li a{ padding:15px; border:1px solid rgba(255,255,255,0.2); margin-bottom:10px; background:#f6faff; }
#template_B .information ul li a:hover { background:#eee9e4; border:1px solid rgba(255,255,255,0.3); }

#template_C .information ul{ list-style:none; padding:5px 0; margin:0 0 0 0%;}
#template_C .information ul li{ float:left; width: calc(33.3% - 2%);margin: 0 1% 15px 1%; }
#template_C .information ul li img { border-radius:8px;} 
#template_C .information ul li:nth-child(3n+1) { clear:both; }
#template_C .information ul li .cover{ width:100%; margin:0 ; }
#template_C .information ul li a{ padding:15px; border:1px solid rgba(255,255,255,0.2); margin-bottom:10px; background:#f6faff; }
#template_C .information ul li a:hover { background:#eee9e4; border:1px solid rgba(255,255,255,0.3); }

/* Notice */
#template_notice .information ul{  margin:0 0 0 0%; border-top:2px solid #ddd}
#template_notice .information ul li{ float:none; width: 100%; margin:0; padding:10px 0px 10px 0; line-height:17px; border-bottom:1px solid #ddd;  }
#template_notice .information ul li a{ display:inline-block; padding:0px 0; width:100%; }
#template_notice .information ul li a:hover{ color:#333; text-decoration:none}
#template_notice .information ul li:hover{ background:#eff9ff; }
#template_notice .information .date{ float:left; width:15%; padding:5px 5px 5px 10px;}
#template_notice .information .date span{ padding:0px 0 0px 28px; background-size:20px 18px;}
#template_notice .information .number{ float:left; width:10%; padding:5px 0; font-size:16px; }
#template_notice .information .title{ float:left; width:60%; padding:5px 0; font-size:16px; line-height:19px; text-shadow:0 0 0 }
#template_notice .information p{ width: auto; font-size:15px;}
#template_notice .information .download{ float:right; width:8%; overflow: hidden }
#template_notice .information .download a{ background: url(../images/icon/icon_pdf.png) no-repeat; background-position:0px 0px; background-size:20px; padding:5px 5px 5px 30px; display:block; color:#fc2130;font-size:16px; line-height:19px; display:block}

.youtube_video { margin:50px auto ; width:80%; box-shadow:0 0 5px rgba(0,0,0,.2); padding:2%;}
.youtube_video iframe { width:100%; min-height:650px;} 

.grid_photo
{
float: left;
position: relative;
overflow: hidden;
cursor: pointer;
}
.grid_photo .caption{opacity: 0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.grid_photo:hover .caption{opacity: 1;	}
.grid_photo .blur{
		background-color: rgba(1,65,146,0.65);
		height: 100%;
		width: 100%;
		z-index: 5; 
		position: absolute;
}
.grid_photo a {
	display:block;height: 100%;
		width: 100%;
}
.grid_photo .caption-text{
		z-index: 10;
		color: #fff;
		position: absolute;
		width: 100%;
		height: 100%; top:0;
		text-align: center;
}

.grid_photo .caption-text h5 { 
  font-size:21px; position: absolute;
  top: 47.5%; line-height:23px; margin:0; padding:0; text-align:center; display:inline-block;
  left: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%); color:#fff !important; border-left:0;   }

.my-masonry-grid { margin:30px 0; }

.my-masonry-grid-item {
  margin: 0 6px 12px;
  padding: 5px;
  background:#F2F2F2;
}

/* Site Map */
.site-map { margin:0; padding:0;}
.site-map ul{ list-style:none; margin:0 0 0 -3%; padding:0;}
.site-map ul li{ float: left; width: 22%; margin:0 0 15px 3%; padding:0; list-style:none;}
.site-map ul li:nth-child(4n+1){ clear: both; }
.site-map ul li ul{ list-style:none; margin:0 0 0 0px; padding:0;}
.site-map ul li ul li{ float: none; width: 100%; margin:0; }
.site-map ul li ul li ul{ list-style:none; margin:0 0 0 15px; padding:0;}

.site-map ul li a{ color:#085cba; padding:5px 0px; display:block; border-bottom:1px solid #ddd;}
.site-map ul li a:hover{ text-decoration:none;}
.site-map ul li ul li a{ border-bottom:0px solid #ddd; color:#333}

.site-map ul li ul li ul li a{ font-size:16px; border-bottom:0px solid #ddd; color:#555; background:url(../images/icon/arrow_right.png) no-repeat; background-size:15px 15px; background-position:0px 50%; padding:5px 0px 5px 20px ; display:block}
ul.site-map-menu li ul li ul li a:hover{ background:url(../images/icon/arrow_right.png) no-repeat; background-size:15px 15px; background-position:0px 50%; }
.site-map ul li ul li ul li ul li a{ font-size:16px; border-bottom:0px solid #ddd; color:#555; background:url(../images/icon/poting_right.png) no-repeat; background-size:7px 7px; background-position:5px 50%; padding:5px 0px 5px 20px ; display:block}
ul.site-map-menu li ul li ul li ul li a:hover{ background:url(../images/icon/poting_right.png) no-repeat; background-size:7px 7px; background-position:0px 50%; }

/* Subject Template */
.subject_category{}
.subject_category ul{ list-style:none; margin:0 0 0 -1.5%; padding:0px;}
.subject_category ul li{ float:left; width: 31%; margin:0 0 30px 2%; padding:0;}
.subject_category p{ }
.subject_category a{ padding:10px; border:1px solid #333; display:block }
.subject_category a:hover{ background:#F90; color:#fff; }

.location{ width:100%; margin:20px 0; box-shadow: 0 0 3px rgba(0,0,0,.2) }
.location iframe{ width:100%; }

.sentense{ margin:20px 0;  }
.sentense .area{padding: 5px;float: right;width: calc(90% - 10px);background: #ffde00;border: 2px solid #fff;box-shadow: 0 0 0 4px #ffa800;border-radius: 8px;}
.sentense .area p{background: #fff;padding: 5px 5px;border-radius: 8px; }
.sentense .title { position:absolute ; left:10px; top:10px; }

/* Table */
table{border-collapse: inherit; width:100%; box-shadow: 0 0 2px rgba(0,0,0,.1); padding:0px; line-height:33px; }
tr:nth-child(even) td { background:#fffcf3; color:#333; padding:2px;}
tr:nth-child(odd) td { background:#fff; color:#333; padding:2px;}
table ul, table ol{ margin:0; }

#table_box{ border-collapse:inherit; background:#ddd }
#table_box tr td{ padding:5px; background:#fff }
#table_box tr:nth-child(1) td{ background:#1b3e98 !important; color:#fff !important;}
#table_box tr:nth-child(odd) td{ background:#f3f5ff}




/* Subject Menu */
.arrowlistmenu{ }
.arrowlistmenu .title {margin-bottom:5px; color:#0da7b6; text-align: left; font-size:24px; padding:15px 0px 15px 0px;  font-weight: bold; border-bottom:2px solid #0da7b6;}
.arrowlistmenu ul{ list-style:none; margin:0; padding:0px}
.arrowlistmenu ul li{ margin-bottom:5px; float: left; margin-right:5px;  }
.arrowlistmenu ul li a{ padding:5px 15px; display:block; border-radius:8px; box-shadow: 0 2px 3px rgba(0,0,0,.1) ; background:#f9f0d8; color:#333  }
.arrowlistmenu ul li a:hover{ color:#fff; background:#F90}
.arrowlistmenu ul li a.current{ color:#fff; background:#0da7b6;  }

.bg_paper{ background:#fffdeb; margin:10px 0; padding:5px 10px; box-shadow: 0 0 2px rgba(0,0,0,.1)}

/* Pop Up Message Box */
#popup_this h2 { color:#fff; font-size:21px; line-height:26px;}
#popup_this {
    text-align:center; 
    margin-top: 0px;
    margin-left: 0px;
    width:80%;
    background:#fff; color:#333;
	max-width:960px; 
}
#popup_this .content { min-width:800px; min-height:450px; max-height:650px; overflow-y: auto; padding:15px ; margin:15px; border:0px solid #fff; }

.b-close {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    color: #333;
    background: #D3D3D3; line-height:23px;
    padding: 5px 12px;
}
.b-close:hover { 
    background: #F90;
}


.banner_bg { background:#ddeef5}
.banner_area { margin: 0 auto;width: 100%;max-width: 1630px; padding:20px 0}
.banner_border {border-radius: 8px;width: calc(100% - 6px);border: 3px solid #fff;overflow: hidden;box-shadow: 0 0 2px rgba(0,0,0,.4);}


.strokeText {color: #ff8e00;-webkit-text-stroke: 1px #ff8e00;z-index: 0;position: relative;}
.strokeText::before {   content: attr(data-storke);  position: absolute;  color: #fff;  -webkit-text-stroke: 6px #fff;  z-index: -1;}

.main_3 { background: url(../images/web/bottom.png) #fff no-repeat bottom ; position:relative; background-size:100%}
#school {background: url(../images/web/school.png) no-repeat bottom left ; position:absolute ; bottom:0; left:0; width: 414px;
height: 197px;z-index: 1;background-size: 100%;} 


#inner_footer .sch_info { padding: 20px 0 80px 0;}


.accordion {
  background: #fff4f8;
  color: #000;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  margin-bottom:10px;
  font-family: "cwTeXYen";
}





.active, .accordion:hover {
  background: #e2f2f9; 
}

.panel {
  padding: 0 18px;
  display: none;
  background-color: white;
  overflow: hidden;
}


.description p { text-align:left}




.banner_button{ position:absolute; bottom:5%; left:3% ; margin-top:10px;}
.banner_button ul{ list-style:none; margin:0; padding:0; }
.banner_button ul li{ margin:5px 0 ; }

.banner_button ul li a{ display: block;  color:#fff; font-size:23px; line-height:23px; padding:15px 20px 15px 80px;  ; background:#0e4fad; border:3px solid #fff; border-radius: 16px; position:relative}

.banner_button ul li+li a{ display: block;color:#fff;  background:#ff9000 }
.banner_button ul li+li+li a{ display: block; color:#fff; background:#ff4a62 }

.banner_button ul li a:hover {
  -ms-transform: rotate(3deg); /* IE 9 */
  transform: rotate(3deg);
}

.banner_button ul li span { background:url(../images/web/button_facebook.png) no-repeat center left;position: absolute;width: 63px;
height: 56px; left: 5%;top: -10px;}

.banner_button ul li+li  { background:url(../images/web/button_p1.png) no-repeat  center left;position: absolute;width: 63px;
height: 56px;}



.banner_button ul li+li+li span { background:url(../images/web/button_calendar.png) no-repeat  center left;position: absolute;width: 63px;
height: 56px;}


.banner_area { position:relative}

.sidebar-nav .strokeText { color: #243a77;
-webkit-text-stroke: 1px #243a77;}


.level2 a { position:relative}

.new_blue .inner_content{border: 3px dashed #ff4177;
background: #fff4f8;
border-radius: 16px;
margin-top: 50px;}


.subject_list{
  list-style-type: none;
  display: flex;
  flex-wrap: wrap;
  text-align: center;
}

.subject_list li{
  margin: 4px;    
  padding: 10px;
  border-radius: 17px;
}

.subject_list li:nth-child(even){
  border: 3px dashed #ff4177;
  background: #fff4f8;
}
.subject_list li:nth-child(odd){
  border: 3px dashed #1f58cd !important;
  background: #e8f7ff !important;
}

.cd-top {
  cursor: pointer;
  display: inline-block;
  position: fixed;
  opacity: 0;
  box-shadow: 0 0 10px rgb(0 0 0 / 5%);
  height: 50px;
  width: 50px;
  bottom: 50px;
  right: 50px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  border: 1px solid #fff;
  box-shadow: 0px 0px 5px #999;
  background: #ffc200 url(../images/icon/cd-top-arrow.svg) no-repeat center center;
  border-radius: 50%;
}


.panel img{ width:auto}

@media (max-width: 1380px) {

.header .links_top{}

}
@media (max-width: 1200px) { 

.header .links_top ul li a img { height:28px}
.navbar-nav > li > a { font-size:15px ; line-height: 17px !important;}

.header .links_top {  margin: 45px 0px 0 0; }
#school {background-size: 80%;} 
.sch_info { width: 50%;margin: 0 25%;}

.logo img,.header .links_top ul li a img,.sch_info ul li ,#school {-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}

.banner_button ul li span , .banner_button ul li + li span, .banner_button ul li + li +li span{ background-size:80%}
.banner_button ul li a { padding:10px 20px 10px 80px}

#bs-example-navbar-collapse-animations ul.navbar-nav { width:80% !important; margin:0;}
.nav > li > a { padding:40px 0 5px 0 }
#school {background-size: 60% !important; }
}

@media (max-width: 1140px) { 
.logo img { height:100px}
.navbar-nav { padding:0 0 5px 0}
}

#block-footer-sitemap-footer-sitemap {background: #015aa5;border-top: 5px solid #f4f02b;
  padding: 40px 0;}
#block-footer-sitemap-footer-sitemap h2 { display: none;}
#footer-sitemap {min-width: 300px;  max-width: 1600px;  position: relative;  padding: 0px 10px;margin: auto !important;}
#footer-sitemap ul{display: flex;  flex-wrap: wrap;gap: 40px;}
#footer-sitemap ul li {flex: 1 1 auto;}

#footer-sitemap ul li ul {display: block;margin: 20px 0 0 0px;}
#footer-sitemap ul li ul li ul {margin: 0px 0 0 20px;}
#footer-sitemap ul li ul li a{ position: relative;display: inline-block;  padding: 2px 15px 2px 0px;}
#footer-sitemap ul li ul li a::before { content:"‧"; color: #fff}
#footer-sitemap a.fs-root-link {color: #fff; border-bottom: 2px solid #fff;  padding: 10px 0;}
#footer-sitemap a {color: #fff;}

#footer-sitemap .active, #footer-sitemap  ul li ul li a:hover{ background:#063a66}