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

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

@media screen and (max-width: 1300px){


}


@media screen and (max-width: 999px){
/* desktop to ipad */
#wrap { min-width:100px; }
#wrap .container { width:100%; padding:0 15px; }
html, body { overflow-x: hidden; overflow-y: scroll; }
input[type=submit], input[type=button], input[type=reset] { -webkit-appearance: none; }

#top .container { }
#top .logo { display: none; }
#top .logo.mobile { display: block; width: 80%; position: relative; padding-bottom: 15px; }
#top .logo.mobile img { max-width: 100%; max-height: 100%; }
#top .right_part .toolbar { display: none; }
#top .right_part .form_btn { display: none; }
#top .mobile_btn_area { display: block; }
#menu { display: none; }

#banner { z-index: 1; }
#banner .banner_show .banner { background-size: auto 100%; }
#banner.news,
#banner.course,
#banner.career { background-size: auto 100%; }
#banner.news img,
#banner.course img,
#banner.career img { max-width: 100%; max-height: 100%; }
#main .intro_right { margin-left: 0; width: 100%; }
#main .intro_left { margin-left: 0; margin-bottom: 10px; }
#main .intro_left .sub_title { padding-top: 0; text-align: left; padding-left: 5px; padding-bottom: 5px; }
#main .index_course .course_gallery .owl-prev { left: -5px; margin-top: -30px }
#main .index_course .course_gallery .owl-next { right: -5px; margin-top: -30px; }
#main .advertisement { background-size: auto 100%; }

#left_menu.about_us,
#left_menu.course,
#left_menu.news { display: none; }
#main .right_side { padding-top: 20px; padding-bottom: 30px; min-height: 0; }
#main .right_side.about_us,
#main.news .right_side { width: 100%; float: none; }

#main .right_side .about_us table { margin: 10px 0 30px 0; }
#banner.course .banner_text:before { width: 100%; background-size: 100% 100%; }
#main.course .right_side { float: none; width: 100%; }
#main.course .right_side .course_list { font-size: 0; } 
#main .right_side .course_list .course_item { margin-right: 0; margin-left: calc(25% - 184px); }
#main .right_side .detail_banner { width: 100%; height: auto; text-align: center; }
#main .right_side .detail_banner .info_area { text-align: left; }

#main .apply_list { width: 100%; }
#main .apply_list .td { display: inline-block; vertical-align: top; }
#main .apply_list .tr .td:first-child,
#main .apply_list .tr .td:nth-child(3) { text-align: left; }
#main .apply_list .td:nth-child(even) { width: calc(100% - 170px); }
#main .apply_list .td#gender_td { width: 145px !important; padding-right: 12px; }
#main .apply_list .td#age_td { width: calc(100% - 160px); padding-right: 0; }
#main .apply_list .address p { text-align: left; }
#main .apply_list .long_text input[name="exp"] { width: 80%; }
#main .apply_list .address input[type="text"] { width: 80%; }
#main .apply_list .tr .td:nth-child(3) { width: 145px; }
#main .apply_list .apply_item .apply_title { background-size: 100% 100%; }
#main .apply_list .apply_item .apply_content { width: 97%; box-sizing: border-box; }
#main .apply_list input[name="course_name"] { width: 100%; }

#main .career_list { width: 100%; }
#main .career_list .career_item .career_title { background-size: 100% 100%; }
#main .career_list .career_item .career_content { width: 97%; }
#main .career_list .career_item .career_content .career_left { width: calc(100% - 210px); }

#main .download_list { width: 100%; }

#footer .footer_brand  { font-size: 0; }
#footer .footer_brand .brand_item { width: 25%; margin-left: 0; margin-right: 0; box-sizing: border-box; }
#footer .sitemap { display: none; }
#footer .copyright { float: none; margin: 0 auto; }
}

@media screen and (max-width: 820px){
#main .right_side .course_list .course_item { width: 41%; margin-left: 6%; padding-top: 5px; height: auto; }
#main .right_side .detail_banner .photo_area { display: block; background-size: contain; }
#main .right_side .detail_banner .info_area { display: block; width: 100%; height: auto; }
}

@media screen and (max-width: 767px){
/* ipad to iphone 6 plus */
#main .apply_list .long_text input[name="exp"],
#main .apply_list .address input[type="text"] { width: 90%; }
#main .career_list .career_item .career_content .career_left { width: calc(100% - 160px); }
#main .career_list .career_item .career_content .career_right { width: 150px; }
#main .career_list .career_item .career_content .career_btn { left: 20px; }
#main .download_list .download_item { padding-right: 50px; }
#main .download_list .download_btn { right: 20px; }
#main .download_list .download_title i { vertical-align: top; padding-top: 10px; }
#main .download_list .download_title p { vertical-align: top; width: calc(100% - 35px); padding-left: 10px; padding-top: 3px; padding-bottom: 3px; }
}

@media screen and (max-width: 620px){
.openResponsive #wrap { transform:translate3d(280px, 0, 0); }
.openResponsive #mobile_menu { width:280px; overflow-y: scroll; }
#wrap .container { padding: 0 10px; }
#main .advertisement { padding-top: 0; }
#main .advertisement .advertise_btn { margin-top: 30px; }
#banner .banner_text { padding-top: 5px; padding-bottom: 5px; font-size: 18px; }
#main .right_side .about_us h2 { font-size: 24px; line-height: 30px; }
#main .advertisement .advertise_title,
#main.index .advertisement .advertise_title { padding-top: 30px; font-size: 30px; }
#main .advertisement .advertise_sub_title { font-size: 22px; }
#main .advertisement .advertise_content { font-size: 14px; }
#main .right_side .about_us td { font-size: 15px; display: block; box-sizing: border-box; }
#main .right_side .about_us td:nth-child(2) { text-align: center; padding-bottom: 20px; }
#banner .banner_text .search_form { top: 40px; left: 15px; z-index: 100; }
#banner .banner_text .search_form .search_area { border: 1px solid #666666; box-sizing: border-box; }
#banner .banner_text .search_form .search_area input[type=text] { height: 29px; line-height: 29px; }
#main.course .right_side { padding-top: 60px; }
#main .right_side .course_list .course_item .course_content { box-sizing: border-box; padding: 5px; }
#main .right_side .course_list .course_item { width: 45%; margin-left: 3%; }
#main .right_side .detail_banner .info_area { padding: 20px 12px; }
#main .right_side .detail_banner .info_area .fee { margin-bottom: 15px; }
#main .apply_list .table,
#main .apply_list .tr { display: block; }
#main .apply_list .long_text input[name="exp"],
#main .apply_list .address input[type="text"] { width: 100%; }
#main .apply_list .td:nth-child(even) { width: 100%; }
#main .apply_list .one_row p { display: block; }
#main .apply_list input[type="text"] { width: 100%; box-sizing: border-box; }
#main .apply_list select { margin-left: 5px; }
#main .apply_list .tr .td:nth-child(3) { width: 100%; }
#main .apply_list .td#age_td { width: 100%; }

#main .career_list .career_item .career_content .career_left { display: block; width: 100%; border-right: none; }
#main .career_list .career_item .career_content .career_right { display: block; width: 100%; text-align: center; }
#main .career_list .career_item .career_content .career_btn  { position: relative; left: auto; top: auto; margin: 0 auto; }
#main .download_list .download_item { padding-left: 10px; padding-right: 40px; }
#main .download_list .download_btn { right: 10px; }
#main .download_list .download_title p { font-size: 16px; }

#main .right_side .news_item .news_photo { display: block; width: 100%; text-align: center; margin-bottom: 10px; }
#main .right_side .news_item .news_content { display: block; width: 100%; margin-left: 0; }
#main .right_side .news_item .news_content .news_topic { padding-bottom: 4px; }
#main .right_side .news_item .news_content .news_date { padding-bottom: 4px; }

#main .right_side .news_detail { padding: 25px 20px; }
#main .right_side .news_detail .news_content { text-align: left; }

#main.career .advertisement .advertise_content:last-child { padding: 0 15px; }
}

@media screen and (max-width: 479px){
/* below iphone 6 plus */
#wrap .container { padding: 0 5px; }
#top .logo.mobile { left: 0; top: 10px; width: 85%; }
#top .mobile_btn_area { right: 0; }
#main.index .advertisement .advertise_title { padding-top: 20px; }
#main .advertisement .advertise_sub_title { font-size: 19px; padding-bottom: 10px; }
#main .advertisement { padding-bottom: 30px; }
#main .advertisement .advertise_btn { margin-top: 20px; }
#main .advertisement .advertise_content { padding: 0px; }
#main .right_side .about_us td { font-size: 13px; padding: 4px 5px; }
#main .right_side .course_list .course_item { width: 80%; margin-left: 10%; }
#main .apply_list .long_text p { width: 100%; }
#main .apply_list .apply_item .apply_content { padding: 10px; }
#main .download_list .download_title p { font-size: 15px; }

#main .right_side .news_detail { padding: 15px 10px; }
}

@media screen and (max-width: 375px){
#main .right_side .course_list .course_item { width: 95%; margin-left: 2.5%; }
#banner .banner_text .search_form { left: 10px; }
#main .right_side .news_detail { padding: 10px 5px; }
}

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

@media screen and (max-width: 1300px){

}

@media screen and (max-width: 999px){

}

@media screen and (max-width: 767px){

}

@media screen and (max-width: 479px){

}