@charset "utf-8";
/* CSS Document */

html, body { margin:0px; }

body { width:100%; font-size-adjust:100%; -webkit-text-size-adjust:100%; box-sizing:border-box; position:relative; color:#000000; font-size:16px; font-family:"Lato", "微軟正黑體", "Microsoft JhengHei", sans-serif; overflow:hidden-x; overflow-y:auto; }

a { outline:none; text-decoration:none; }

ul, ol { list-style:none; margin:0; padding:0; }
li { vertical-align:top; }

h1, h2, h3, h4, h5, p { padding:0; margin:0; }

img { border:none; }

input, textarea { font-family:"Lato", "微軟正黑體", "Microsoft JhengHei", sans-serif; }

button, input[type=submit], input[type=reset], input[type=button] { -webkit-appearance:none; }

/* ---------------- clear fix ---------------- */

.clearfix:after { content:"."; display:block; clear:both; visibility:hidden; xline-height:0; height:0; font-size:0; }
.clearfix { display:inline-block; }
html[xmlns] .clearfix { display:block; }
* html .clearfix { height:1%; }

/*-------------------------------------------------------------------------------------*/
/* LAYOUT */

#wrap { width:100%; background-color:#ffffff; box-sizing:border-box; position:relative; z-index:1000; overflow:hidden; }
#wrap .container { width:100%; max-width:1598px; padding-left:15px; padding-right:15px; margin:0px auto; position:relative; box-sizing:border-box; display:block; }
#wrap .back_to_top { position:fixed; right:25px; bottom:0; display:none; z-index:999; }
#wrap .back_to_top a { display:block; width:50px; height:50px; background-color:#8aba7b; border-radius:12px 12px 0 0; text-align:center; line-height:50px; font-size:32px; color:white; font-weight:bold; }
#wrap .back_to_top a:hover { background-color:#A9A9A9; color:#ffffff; }

#header { position:fixed; left:0; top:0; z-index:5000; width:100%; }
#header.fancybox-margin { width:calc(100% - 17px); }

#toolbar { padding:5px 0; background-color:rgba(10,46,23,0.7); box-sizing:border-box; position:relative; }
#toolbar ul { text-align:right; }
#toolbar ul li { display:inline-block; vertical-align:top; height:32px; padding:0 8px; border-left:1px solid #437041; line-height:32px; font-size:18px; color:#ffffff; }
#toolbar ul li a { display:inline-block; vertical-align:top; margin:0 4px; color:#ffffff; }
#toolbar ul li a i { color:#fdf52f; }
#toolbar ul li a.lang { width:32px; height:32px; background-color:#ffffff; border-radius:100%; text-align:center; line-height:32px; font-size:16px; color:#264a2f; }
#toolbar ul li a.btn i { font-size:24px; color:#ffffff; line-height:32px; }
#toolbar ul li a.fb_btn { width:32px; height:32px; border-radius:100%; background-color:#ffffff; text-align:center; }
#toolbar ul li a.fb_btn i { color:#0a2c11; }

#top { background-color:rgba(0,80,0,0.74); }
#top .logo { position:absolute; left:50%; top:0; z-index:5500; width:175px; background-color:#063419; box-sizing:border-box; transform:translateX(-50%); transition:all 0.3s ease; }
#top .logo img { width:100%; display:block; }

#top .mobile_btn { position:absolute; left:15px; top:30px; z-index:10; display:none; }
#top .mobile_btn a { display:block; width:110px; height:40px; padding:0 10px; background-color:rgba(0,80,0,0.74); box-sizing:border-box; text-align:center; font-weight:500; font-size:20px; color:#ffffff; line-height:40px; cursor:pointer; }
#top .mobile_btn a i { margin-right:6px; }
#top .mobile_btn a:hover { text-decoration:none; }

#top .menu_area { margin:0 -15px; display:block; box-sizing:border-box; }
#top .menu_area .menu_header { width:100%; position:relative; display:none; }
#top .menu_area .menu_logo { padding:0 0 10px 0; text-align:center; }
#top .menu_area .menu_logo img { width:121px; }
#top .menu_area .menu_close { position:absolute; right:10px; top:10px; width:33px; height:33px; padding:0; margin:0; border:none; background:url(../img/popup_close_btn.png) no-repeat left top; outline:none; }
#top .menu_area ul.menu_list { position:relative; z-index:5700; text-align:left; font-size:0; }
#top .menu_area ul.menu_list > li { display:inline-block; vertical-align:top; position:relative; }
#top .menu_area ul.menu_list > li.mobile_only { display:none; }
#top .menu_area ul.menu_list > li > a.lv1 { display:block; height:78px; padding:0 11px; position:relative; box-sizing:border-box; font-size:21px; color:#ffffff; font-weight:900; line-height:78px; transition:all 0.3s ease; }
#top .menu_area ul.menu_list > li > a.lv1 i { position:absolute; right:0; top:0; width:50px; height:50px; text-align:center; line-height:50px; font-size:20px; color:#ffffff; font-style:normal; display:none; transition:all 0.3s ease; }
#top .menu_area ul.menu_list > li > a.lv1 i:before { position:absolute; left:50%; top:50%; content:""; width:0; height:0; margin-left:-4px; margin-top:-6px; border-style:solid; border-width:6px 0 6px 8px; border-color:transparent transparent transparent #ffffff; }
#top .menu_area ul.menu_list > li:hover > a.lv1,
#top .menu_area ul.menu_list > li > a.lv1:hover { }

#top .menu_area ul.dropdown_menu { position:absolute; left:0; top:100%; z-index:100; width:224px; padding-top:11px; display:none; }
#top .menu_area ul.dropdown_menu:before { position:absolute; left:57px; top:0; content:""; width:0; height:0; border-style:solid; border-width:0 9.5px 11px 9.5px; border-color:transparent transparent #2b9337 transparent; opacity:0.86; }
#top .menu_area ul.dropdown_menu > li { display:block; background-color:rgba(43,147,55,0.86); border-top:1px solid #90be8e; }
#top .menu_area ul.dropdown_menu > li:first-child { border-top:none; }
#top .menu_area ul.dropdown_menu > li > a.lv2 { display:block; width:100%; padding:9px 14px 9px 20px; box-sizing:border-box; font-size:15px; color:#ffffff; font-weight:bold; text-align:left; transition:all 0.3s ease; }
#top .menu_area ul.dropdown_menu > li > a.lv2:hover { background-color:#063419; }

/*#top .menu_area ul.subdrop_menu { position:absolute; right:-160px; top:12px; z-index:99; width:160px; padding:0px 0; background-color:#66ba49; box-sizing:border-box; box-shadow:5px 5px 5px rgba(0,0,0,0.3); text-align:left; opacity:0.86; display:none;}
#top .menu_area ul.subdrop_menu > li { }
#top .menu_area ul.subdrop_menu > li > a.lv3 { display:block; width:100%; padding:8px 13px 8px 18px; box-sizing:border-box; font-size:13px; color:#ffffff; font-weight:bold; text-align:left; transition:all 0.3s ease; }
#top .menu_area ul.subdrop_menu > li > a.lv3:hover { background-color:#419c2c; }

#top .menu_area ul.ssubdrop_menu { position:absolute; right:0px; top:30px; z-index:1000; width:160px; padding:0px 0; background-color:#90be8e; box-sizing:border-box; box-shadow:5px 5px 5px rgba(0,0,0,0.3); text-align:left;  display:none;}
#top .menu_area ul.ssubdrop_menu > li { }
#top .menu_area ul.ssubdrop_menu > li > a.lv4 { display:block; width:100%; padding:8px 13px 8px 18px; box-sizing:border-box; font-size:13px; color:#ffffff; font-weight:bold; text-align:left; transition:all 0.3s ease; }
#top .menu_area ul.ssubdrop_menu > li > a.lv4:hover { background-color:#419c2c; }
*/
/*#top .menu_area ul.left_menu { float:left; width:calc(50% - 88px); text-align:left; }john*/
#top .menu_area ul.left_menu { float:left;text-align:left; }
#top .menu_area ul.right_menu { float:right; width:calc(50% - 88px); text-align:right; }

#top .menu_area ul.right_menu > li:last-child > ul.dropdown_menu { left:auto; right:0; }
#top .menu_area ul.right_menu > li:last-child > ul.dropdown_menu:before { left:auto; right:27px; }

#top .menu_area ul.menu_list > li.active > a.lv1 i { transform:rotate(90deg); }
#top .menu_area ul.menu_list > li.active > ul.dropdown_menu { display:block; }
/*#top .menu_area > ul.menu_list > li > ul.dropdown_menu > li.active > ul.subdrop_menu{ display:block; }
#top .menu_area > ul.menu_list > li > ul.dropdown_menu > li > ul.subdrop_menu > li.active > ul.ssubdrop_menu{ display:block; }*/

#header.sticky_header #top { }
#header.sticky_header #top .logo { top:-42px; width:120px; }

#banner { width:100%; position:relative; }
#banner .banner_show { width:100%; box-sizing:border-box; position:relative; }
#banner .banner_show .banner { width:100%; height:738px; background-repeat:no-repeat; background-position:center center; background-size:cover; }
#banner .banner_row { position:absolute; left:50%; bottom:-76px; z-index:10; font-size:74px; color:#308a2b; line-height:1; transform:translateX(-50%); }

#banner .inner_banner { width:100%; height:322px; xheight:644px; background-repeat:no-repeat; background-position:center center; background-size:cover; }

#banner .our_school_banner { background-image:url(../img/inner_banner/our_school.jpg); }
#banner .admission_banner { background-image:url(../img/inner_banner/admission.jpg); }
#banner .academic_banner { background-image:url(../img/inner_banner/academic.jpg); }
#banner .development_banner { background-image:url(../img/inner_banner/development.jpg); }
#banner .event_banner { background-image:url(../img/inner_banner/event.jpg); }
#banner .achievement_banner { background-image:url(../img/inner_banner/achievement.jpg); }
#banner .communication_banner { background-image:url(../img/inner_banner/communication.jpg); }
#banner .album_banner { background-image:url(../img/inner_banner/album.jpg); }
#banner .other_banner { background-image:url(../img/inner_banner/other.jpg); }

#main { position:relative; background:url(../img/main_shadow.png) repeat-x center top; }
#main .title_area { padding-top:40px; border-bottom:1px solid #cccccc; }
#main .title_area .title { display:inline-block; vertical-align:top; padding-right:18px; padding-bottom:6px; border-bottom:3px solid #3ba7c5; margin-bottom:-1px; font-size:28px; color:#2789ad; font-weight:500; text-transform:uppercase; }
#main .path_area { width:100%; padding-top:16px; font-size:18px; color:#333333; font-weight:bold; }
#main .path_area span { color:#338930; }
#main .path_area a { color:#333333; transition:all 0.3s ease; }
#main .path_area a:hover { color:#338930; }
#main .content_area { padding:36px 0 46px 0; position:relative; display:block; }

#main .left_side { float:left; width:243px; }
#main .left_side .left_menu { width:100%; min-height:523px; padding:12px 19px 24px 19px; background-color:#bfdab5; border-top:5px solid #245519; box-sizing:border-box; }
#main .left_side .left_menu > ul { }
#main .left_side .left_menu > ul > li { display:block; border-bottom:1px solid #8aba7b; position:relative; }
#main .left_side .left_menu > ul > li > a { display:block; padding:16px 19px; box-sizing:border-box; margin:0 -19px; font-size:17px; color:#245519; font-weight:bold; }
#main .left_side .left_menu > ul > li > a.active,
#main .left_side .left_menu > ul > li > a:hover { background-color:#338930; color:#ffffff; }


#main .left_side .left_menu > ul > li > ul { padding:8px 0; border-top:1px solid #8aba7b; box-sizing:border-box; }
#main .left_side .left_menu > ul > li > ul > li { padding-left:14px; padding-bottom:6px; position:relative; font-size:15px; color:#338930; }
#main .left_side .left_menu > ul > li > ul > li:before { position:absolute; left:0; top:0; content:">"; }
#main .left_side .left_menu > ul > li > ul > li > a { color:#338930; transition:all 0.3s ease; }
#main .left_side .left_menu > ul > li > ul > li > a:hover { color:#245519; }
#main .left_side .left_menu > ul > li > ul > li > a.active { color: #245519; font-weight: bold; }
/*john*/
#main .left_side .select_left_menu{display: none;float: right;}
#main .right_side .text-right{}
#main .right_side .text-right select{width: 180px;height: 30px;}
@media screen and (max-width: 767px){
	#main .left_side .left_menu { display: none;}
	#main .left_side .select_left_menu {display: block;}

}
/*john*/
#main .right_side { float:right; width:calc(100% - 301px); }
#main .sub_title { font-size:38px; color:#245519; font-weight:bold; }
#main .sub_title span { color:#42a13f; }
#main .content { position:relative; box-sizing:border-box; display:block; }

#main .multipage { padding-top:24px; margin:0 -9px; font-size:0; text-align:center; clear:both; }
#main .multipage a { display:inline-block; zoom:1; *display:inline; vertical-align:top; width:32px; height:32px; margin:0 5px; text-align:center; line-height:32px; font-size:19px; color:#000000; transition:all 0.2s ease; }
#main .multipage a.row,
#main .multipage a.back,
#main .multipage a.next { width:37px; margin:0 9px; background-color:#055726; color:#ffffff; }
#main .multipage a.onpage,
#main .multipage a:hover { background-color:#338930; color:#ffffff; }
#main .multipage select { width:120px; height:32px; background-color:#efefef; border:1px solid #cccccc; box-sizing:border-box; display:none; }

#footer { padding:17px 0; background-color:#0c2e18; }
#footer .footer_area { display:table; width:100%; direction:rtl; }
#footer .footer_logo { display:table-cell; vertical-align:middle; width:230px; }
#footer .footer_logo img { width:50%; }
#footer .footer_menu { display:table-cell; vertical-align:middle; font-size:14px; color:#ffffff; direction:ltr; }
#footer .footer_menu ul { margin:0 -10px; }
#footer .footer_menu ul li { display:inline-block; vertical-align:top; padding:0 10px; border-left:1px solid #ffffff; line-height:19px; }
#footer .footer_menu ul li:first-child { border-left:none; }
#footer .footer_menu p { }
#footer .footer_menu a { color:#ffffff; }
#footer .footer_menu a:hover { }

/*-------------------------------------------------------------------------------------*/
/* INDEX */

.index_section { padding:50px 0; position:relative; box-sizing:border-box; }
.index_section .section_side { float:left; box-sizing:border-box; width: 100%; text-align: center; }
.index_section .section_title { padding-bottom:16px; position:relative; text-align:center; }
.index_section .section_title h1 { font-size:96px; font-weight:bold; }
.index_section .section_title h3 { font-size:38px; font-weight:bold; }
.index_section .section_content { }

.index_section .event_list { margin:0 -26px; }
.index_section .event_list .event_item { padding:17px 26px; }
.index_section .event_list .event_img { height:334px; }

.about_section { padding:106px 0 72px 0; background-color:#ffffff; }
.about_section .about_info { width:48%; padding-right:15px; }
.about_section .about_img { float:right; width:43.23%; padding-left:15px; }
.about_section .about_img img { width:100%; display:block; }
.about_section .about_img iframe { width:100%; display:block; }

.about_section .section_title { color:#245519; text-align:left; text-align: center; }
.about_section .section_content { padding-top:6px; width: 100%; text-align: center;  }
.about_section .section_content p { font-size:36px; color:#aa8b38; line-height:1.1; }
.about_section .section_content span.line { display:block; width:100%; max-width:213px; height:4px; background-color:#fdf52f; margin:32px 0 50px 0; }
.about_section .section_content a.btn { display:inline-block; width:316px; height:72px; background:url(../img/btn_bg.jpg) no-repeat left top; background-size:cover; font-size:27px; color:#ffffff; line-height:72px; text-align:center; text-transform:uppercase; transition:all 0.3s ease; margin-top: 50px; }

.news_section { background-color:#f3e75f; background-image:url(../img/index_news_section_bg.jpg); background-position:center center; background-repeat:no-repeat; background-size:cover; }
.news_section .section_title { color:#245519; }
.news_section .section_content { padding-top:14px; }

.events_section { background-color:#499342; background-image:url(../img/index_events_section_bg.jpg); background-position:center center; background-repeat:no-repeat; background-size:cover; }
.events_section .section_title { color:#ffffff; }
.events_section .section_content { padding-top:14px; }

.contact_section { text-align:right; }
.contact_section .map_bg { position:absolute; left:0; top:0; z-index:9; width:100%; height:100%; }
.contact_section .map_bg iframe { width:100%; height:100%; border:none; }
.contact_section .section_title { color:#ffffff; }
.contact_section .section_title:before { position:absolute; left:50%; bottom:0; content:""; width:120px; height:3px; background-color:#ffffff; transform:translateX(-50%); }
.contact_section .section_content { padding-top:25px; }
.contact_section .contact_box { display:inline-block; vertical-align:top; width:34%; padding:56px 53px; background-color:rgba(83, 160, 53, 0.78); border-radius:13px; box-sizing:border-box; position:relative; z-index:10; }
.contact_section .contact_img { width:100%; padding-bottom:40px; }
.contact_section .contact_img img { width:100%; }
.contact_section .contact_info { font-size:22px; color:#ffffff; font-weight:bold; line-height:1.8; text-align:left; }

/* Youtube responsive - css-tricks.com */
.videoWrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0;}
.videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/*-------------------------------------------------------------------------------------*/
/* EVENTS */

.event_content { }

.event_list { padding-top:8px; margin:0 -21px; display:block; }
.event_list .event_item { float:left; width:33.33334%; padding:15px 21px; box-sizing:border-box; }
.event_list .event { width:100%; max-width:500px; margin:0 auto; position:relative; display:block; overflow:hidden; }
.event_list .event_img { width:100%; height:271px; }
.event_list .event_img img { width:100%; height:100%; object-fit:cover; }
.event_list .event_title { position:absolute; left:0; bottom:0; width:100%; padding:18px 10px; background-color:rgba(255,255,255,0.6); font-size:31px; color:#308a2b; font-weight:bold; text-align:center; }
.event_list .event_overlay { position:absolute; left:0; top:100%; width:100%; height:100%; padding:24px 30px; background-color:rgba(35,86,22,0.83); box-sizing:border-box; display:flex; justify-content:center; align-items:flex-end; color:#ffffff; }
.event_list .event_info { width:100%; }
.event_list .event_info h5 { padding-bottom:6px; font-size:30px; line-height:1.1; }
.event_list .event_info p { font-size:30px; line-height:1.1; }

.event_list .event:hover .event_overlay { top:0; }

.popup_event { }
.popup_event .fancybox-skin { border-radius:0; background-color:rgba(48,138,44,0.9); }
.popup_event .fancybox-close { top:7px; right:7px; width:33px; height:33px; background:url(../img/popup_close_btn.png) no-repeat left top; }

.popup_event .popup_event_content { width:100%; padding:60px 70px; box-sizing:border-box; overflow-x:hidden; }
.popup_event .popup_event_img { float:left; width:36%; }
.popup_event .popup_event_img img { width:100%; }
.popup_event .popup_event_info { float:right; width:60%; }
.popup_event .popup_event_info .title { padding-bottom:21px; border-bottom:1px solid #e7c14d; }
.popup_event .popup_event_info .title p { padding:0 12px 0 24px; border-left:8px solid #18541e; font-size:40px; color:#ffffff; font-weight:bold; }
.popup_event .popup_event_info .content { padding:34px 12px 34px 32px; font-size:31px; color:#ffffff; line-height:1.6; }
.popup_event .popup_event_info .content table { width:100%; }
.popup_event .popup_event_info .content table td { vertical-align:top; xword-break:break-all; }
.popup_event .popup_event_info .content table td:first-child { width:142px; }
.popup_event .popup_event_info .content table td a { text-align: center; background-color: #18541e; padding: 5px 10px; margin: 5px; }

/*-------------------------------------------------------------------------------------*/
/* NEWS */

.news_content { padding-top: 40px; }

.news_list { margin: -15px 0; display: block; }
.news_list .news_item { width: 100%; padding: 15px 0; }
.news_list .news { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; width:100%; box-sizing: border-box; }
.news_list .news_photo { -ms-flex: 0 0 220px; flex: 0 0 220px; width: 220px; height:180px; background-color: #063419; }
.news_list .news_photo img { width:100%; height:100%; object-fit:cover; }
.news_list .news_info { -ms-flex: 1 0 0%; flex: 1 0 0%; padding: 12px 0 12px 20px; overflow: hidden; font-size: 20px; }
.news_list .news_info h3 { font-size:31px; color:#333333; }
.news_list .news_info p { color:#308a2b; }
.news_list .news_info a { color:#333333; }

.popup_news { }
.popup_news .fancybox-skin { border-radius:0; background-color:#bfdab5; }
.popup_news .fancybox-close { top:7px; right:7px; width:33px; height:33px; background:url(../img/popup_close_btn.png) no-repeat left top; }

.popup_news .popup_news_content { width:100%; box-sizing:border-box; overflow-x:hidden; background-color: #bfdab5; border-top: 5px solid #245519; }
.popup_news .popup_news_header { width: 100%; padding: 28px 40px; background-color: #245519; box-sizing: border-box; font-size: 20px; color: #ffffff; }
.popup_news .popup_news_info { width: 100%; padding: 28px 40px; box-sizing: border-box; }
.popup_news .popup_news_info .title { padding-bottom:21px; border-bottom:1px solid #e7c14d; font-size:40px; color:#245519; font-weight:bold; }
.popup_news .popup_news_info .content { padding-top:34px; font-size:31px; color:#245519; line-height:1.6; }

/*-------------------------------------------------------------------------------------*/
/* ALBUM */

.gallery_content { }

.gallery_list { padding-top:8px; margin:0 -21px; display:block; }
.gallery_list .gallery_item { float:left; width:33.33334%; padding:15px 21px; box-sizing:border-box; }
.gallery_list .gallery { width:100%; max-width:500px; background-color:#999999; margin:0 auto; position:relative; display:block; }
.gallery_list .gallery_photo { width:100%; height:271px; }
.gallery_list .gallery_photo img { width:100%; height:100%; object-fit:cover; }
.gallery_list .gallery_info { position:absolute; left:0; bottom:0; width:100%; padding:13px 15px; background-color:rgba(255,255,255,0.84); box-sizing:border-box; font-size:20px; }
.gallery_list .gallery_info .title { color:#333333; }
.gallery_list .gallery_info .date { color:#308a2b; }

.gallery_detail { }
.gallery_detail .gallery_detail_title { padding:17px 50px 14px 50px; background-color:#338930; }
.gallery_detail .gallery_detail_title p { width:100%; max-width:1368px; padding-left:32px; border-left:8px solid #f1eb2d; box-sizing:border-box; margin:0 auto; font-size:38px; color:#ffffff; font-weight:bold; line-height:1; }
.gallery_detail .gallery_detail_info { width:100%; max-width:1288px; padding:20px 90px; margin:0 auto; }
.gallery_detail .gallery_detail_date { margin-bottom:48px; font-size:29px; color:#06351a; font-weight:bold; }
.gallery_detail .gallery_detail_photo { width:100%; max-width:1288px; padding:0 99px; box-sizing:border-box; margin-bottom:45px; position:relative; }
.gallery_detail .gallery_detail_photo .large_photo { width:100%; box-sizing:border-box; position:relative; font-size:0; text-align:center; }
.gallery_detail .gallery_detail_photo .large_photo > img { width:100%; display:block; }
.gallery_detail .gallery_detail_photo .large_photo .photo { position:absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; }
.gallery_detail .gallery_detail_photo .large_photo .photo:after { content:""; display:inline-block; vertical-align:middle; height:100%; }
.gallery_detail .gallery_detail_photo .large_photo .photo img { max-width:100%; max-height:100%; vertical-align:middle; }
.gallery_detail .gallery_detail_photo .large_photo .row { position:absolute; left:0; top:50%; width:100%; }
.gallery_detail .gallery_detail_photo .large_photo .row_prev,
.gallery_detail .gallery_detail_photo .large_photo .row_next { position:absolute; top:-25px; width:50px; height:50px; background-color:#cacaca; border-radius:100%; font-size:28px; color:#ffffff; font-weight:bold; line-height:50px; text-align:center; transition:all 0.3s ease; cursor:pointer; }
.gallery_detail .gallery_detail_photo .large_photo .row_prev { left:-78px; }
.gallery_detail .gallery_detail_photo .large_photo .row_next { right:-78px; }
.gallery_detail .gallery_detail_photo .large_photo .row_prev:hover,
.gallery_detail .gallery_detail_photo .large_photo .row_next:hover { background-color:#063419; }

.gallery_detail .gallery_detail_photo .sub_photo_area { width:100%; padding-top:32px; }
.gallery_detail .gallery_detail_photo .sub_photo_list { margin:0 -8px; }
.gallery_detail .gallery_detail_photo .sub_photo_item { float:left; width:20%; padding:0 8px; box-sizing:border-box; }
.gallery_detail .gallery_detail_photo .sub_photo { width:100%; position:relative; box-sizing:border-box; font-size:0; text-align:center; }
.gallery_detail .gallery_detail_photo .sub_photo > img { width:100%; display:block; }
.gallery_detail .gallery_detail_photo .sub_photo .photo { position:absolute; left:0; top:0; width:100%; height:100%; display:block; box-sizing:border-box; }
.gallery_detail .gallery_detail_photo .sub_photo .photo:before { position:absolute; left:0; top:0; content:""; width:100%; height:100%; border:6px solid #67997b; box-sizing:border-box; opacity:0; transition:all 0.3s ease; }
.gallery_detail .gallery_detail_photo .sub_photo .photo:after { content:""; display:inline-block; vertical-align:middle; height:100%; }
.gallery_detail .gallery_detail_photo .sub_photo .photo img { display:inline-block !important; width:auto !important; max-width:100%; max-height:100%; vertical-align:middle; }
.gallery_detail .gallery_detail_photo .sub_photo.active .photo:before,
.gallery_detail .gallery_detail_photo .sub_photo:hover .photo:before { opacity:1; }

.gallery_detail .gallery_detail_photo .sub_photo_list.owl-carousel { width:100%; margin:0; }
.gallery_detail .gallery_detail_photo .sub_photo_list.owl-carousel .owl-item .sub_photo_item { width:100%; padding:0; }
.gallery_detail .gallery_detail_photo .sub_photo_list.owl-carousel .owl-nav { position:absolute; left:0; top:50%; width:100%; margin-top:-19px; }
.gallery_detail .gallery_detail_photo .sub_photo_list.owl-carousel .owl-prev,
.gallery_detail .gallery_detail_photo .sub_photo_list.owl-carousel .owl-next { position:absolute; top:0; font-size:38px; color:#338930; font-weight:bold; line-height:1; text-align:center; font-family:'Linearicons-Free'; cursor:pointer; }
.gallery_detail .gallery_detail_photo .sub_photo_list.owl-carousel .owl-prev { left:-68px; }
.gallery_detail .gallery_detail_photo .sub_photo_list.owl-carousel .owl-next { right:-68px; }

.gallery_detail .gallery_detail_back { text-align:center; }
.gallery_detail .gallery_detail_back a { display:block; width:288px; height:50px; background-color:#245519; margin:0 auto; font-size:18px; color:#ffffff; line-height:50px; text-align:center; transition:all 0.3s ease; }
.gallery_detail .gallery_detail_back a:hover { background-color:#063419; }
/*-------------------------------------------------------------------------------------*/
/* LINKS */
.links_content .col_left { display: inline-block; width: 50%; vertical-align: top; }
.links_content .col_right { display: inline-block; width: 49%; vertical-align: top; }
.links_content .links_list h2 { margin-top: 20px; }
.links_content .links_list h3 { margin-top: 10px; }
.links_content .links_list p a { color: #338930; }
.links_content .links_list p a:hover { color: #245519; }

/*-------------------------------------------------------------------------------------*/
/* LIBRARY */
.library_content { }
.library_list { padding-top:8px; margin:0 -21px; display:block; }
.library_list .library_item { float:left; width:33.33334%; padding:15px 21px; box-sizing:border-box; }
.library_list .library { width:100%; max-width:500px; margin:0 auto; position:relative; display:block; overflow:hidden; height:171px; }
.library_list .library_img { position: absolute;  }
.library_list .library_img img { height: auto; max-width: 100px; }
.library_list .library_title { padding: 0 10px 10px 120px; background-color:rgba(255,255,255,0.6); font-size:20px; color:#308a2b; font-weight:bold; }

/*-------------------------------------------------------------------------------------*/
/* LIST CMS */

.group_content { padding-top:26px; padding-bottom:18px; font-size:17px; color:#333333; line-height:1.65; }

.group_info { padding-bottom:50px; }

.group_list { }
.group_list .group_item { padding-bottom:20px; }
.group_list .group { width:100%; }
.group_list .group_title { padding:10px 80px 12px 30px; background-color:#f2f2f2; position:relative; font-size:22px; color:#666666; font-weight:bold; cursor:pointer; }
.group_list .group_title:before { position:absolute; right:42px; top:50%; content:"+"; margin-top:-13px; font-size:25px; line-height:1; }
.group_list .group_desc { padding:24px 30px; box-sizing:border-box; font-size:17px; color:#333333; line-height:1.65; display:none; }

.group_list .group.active .group_title,
.group_list .group_title:hover { background-color:#bfdab5; color:#336633; }
.group_list .group.active .group_title:before { content:"-"; }
.group_list .group.active .group_desc { display:block; }

/*-------------------------------------------------------------------------------------*/
/* EDITOR CONTENT */

.editor_content { min-height:420px; padding-top:20px; box-sizing:border-box; display:block; color:#333333; line-height:1.65; }
.editor_content:after { content:""; display:block; width:100%; clear:both; }
.editor_content iframe { max-width:100%; box-sizing:border-box; }
.editor_content img { max-width:100%; box-sizing:border-box; }

/* Tag default values */
.editor_content ul,
.editor_content ol { display:block; xmargin:1em 0; xpadding-left:40px; padding-left:20px; }
.editor_content ul { list-style-type:disc; }
.editor_content ol { list-style-type:decimal; }
/*
.editor_content h1 { margin:0.67em 0; }
.editor_content h2 { margin:0.83em 0; }
.editor_content h3 { margin:1em 0; }
.editor_content h4 { margin:1.33em 0; }
.editor_content h5 { margin:1.67em 0; }
.editor_content h6 { margin:2.33em 0; }
.editor_content p { margin:1em 0; }
*/

/*-------------------------------------------------------------------------------------*/
/* pop up calendar( w3school) */

.modal { display: none; position: fixed; z-index: 9999; left: 0;top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ max-height: 800px; }
.modal-content { background-color: #fefefe; margin: 15% auto; padding: 20px; border: 1px solid #888; width: 70%; max-width: 920px; }
.close { color: #aaa; float: right; font-size: 28px; font-weight: bold; }
.close:hover, .close:focus { color: black; text-decoration: none; cursor: pointer; }

@media screen and (max-width: 767px){
/* .modal-content { width: 80%; height: 80%; } */
.modal-content { width: 80%; height: 80%; overflow: scroll; }
}

.loginForm{ width: 100%; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; }
.myButton{ -moz-box-shadow:inset 0px 1px 3px 0px #91b8b3; -webkit-box-shadow:inset 0px 1px 3px 0px #91b8b3; box-shadow:inset 0px 1px 3px 0px #91b8b3; background:#768d87;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#768d87', endColorstr='#6c7c7c',GradientType=0); background-color:#768d87; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; border:1px solid #566963; display:inline-block; cursor:pointer;
	color:#ffffff; font-family:Arial; font-size:15px; font-weight:bold; padding:11px 23px; text-decoration:none; text-shadow:0px -1px 0px #2b665e; margin-top: 15px;
}
.myButton:hover{ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6c7c7c', endColorstr='#768d87',GradientType=0); background-color:#6c7c7c; }
.myButton:active { position:relative; top:1px; }



/******** Mobile Layout ********/
@media only screen and (max-width: 767px) { 
#top .menu_area .menu_logo {
    padding-top: 22px;
}
#top .menu_area .menu_close {
    top: 38px;
}


}