@charset "utf-8";
/* CSS Document */
@media screen and (max-width:1600px){

}

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

}
@media screen and (max-width:1200px){
#header .gnb_wrap .gnb .dp1{padding:0 15px;}
.main_section .btn_wrap.c2 > a.go_btn.st1{ background:#fff;}
.main_section .btn_wrap.c1 > a.go_btn.st1{ background:#f5f5f5}
	
#contents .sub_gnb{ float:none; display:none}
#contents .sub_con{ float:none; width:100%}
#contents .sub_tit_wrap{ padding:0 3px}

.page2_1wrap .table_wrap .bg_img{ display:none}


}


@media screen and (max-width:1100px){
#header .gnb_wrap .gnb .dp1{padding:0 6px;}
.main_icon_col .inner .list > li .in{ text-align:center}
.main_icon_col .list.st1 > li .in{ padding:1em 0 2em 0; }
.main_icon_col .list.st1 > li .sbj{ display:block; text-align:center}
}

@media screen and (max-width:1024px){
body:not(#pop){ font-size:14px; font-weight:normal;}

.box1{}

body{font-size:13px;}

#header .header_wrap .btn_wrap{padding-left:15px;}
#header .gnb_wrap .gnb .dp1{padding:0 6px;}
#header .header_wrap .logo .txt{padding-left:10px;}
#header .header_wrap .logo .txt .tt1{font-size:1em;}
#header .header_wrap .logo .txt .tt2{letter-spacing:-1px}

.main_section6 .family_wrap{ padding:1em 0; margin-top:5em}
.main_section6 .family_wrap .arrow_wrap{ display:none}
.main_section6 .family_wrap .family{ float:none; width:100%;}

.main_section1 .list01 > li .inBox > dl{ padding:1.5em}
.main_section .btn_wrap2 > ul > li > .btn_ul{ padding:0 .5em}
.main_section2 .board{ width:341.33px; max-width:100%}
.main_section2 .board .tab_wrap .tab > li .tt{ padding:1em 1em}
.main_section2 .gall_wrap{ max-width:341.33px; width:100%}
.main_section2 .edu_wrap{ max-width:230px; width:100%}
.main_section3 .list01 .area1{ max-width:650px; width:100%}
.main_section3 .list01 .area2{ max-width:300px; width:100%}
.main_section1 .list01 > li, .main_section1 .list01 > li.list02{ width:50%;}


#contents .subNav_wrap .nav div[class^="depth"] .tt{padding:0 20px;}

#contents .subCon .doc{ padding:40px 0 140px 0;}

#footer .menu_wrap .menu > li > a{padding:0 5px; font-size:0.92em;}
#footer .menu_wrap .vm_wrap{height:50px;}
#footer .menu_wrap .top{width:50px;}
#footer .info_wrap .info .con_wrap{ padding:0 30px 0 90px;}
#footer .info_wrap .cs .con_wrap{padding:0 120px 0 30px;}
#footer .info_wrap{padding:30px 0;}

.page2_2wrap .over .l_dv{ float:none; text-align:center; width:50%; margin:0 auto }
.page2_2wrap .over .r_dv{ float:none; width:100%;}

}




@media screen and (max-width:768px){
body{font-size:11px;}
.PC{ display:none !important;}
.PHONE{ display:block !important;}

.main_visual .slick-dots{ top:70% !important}
.main_visual .arrow_wrap > li .xi{ font-size:1.570em}
.main_visual .slogan{ top:4.5em}
.main_visual .slogan .slogan_area{ padding-left:3em}
.main_section1 .list01 > li .inBox > dl .tt, .main_section1 .list01 > li.list02 .inBox > dl .tt{ font-size:1.250em}
.main_section1 .list01 > li .inBox > dl .icon{ display:none}
.main_section1 .list01 > li .inBox > dl .t1{ width:100%}
.main_section1 .list01 > li .inBox > dl, .main_section1 .list01 > li.list02 .inBox > dl{ padding:1.5em}
.main_section .btn_wrap2{ margin-top:1em}
.main_section .btn_wrap2 > ul > li{}
.main_section .btn_wrap2 > ul > li > .btn_ul{ padding:0 .5em; border:none; position:relative}
.main_section .btn_wrap2 > ul > li > .btn_ul::after{ content:""; position:absolute; top:15px; left:0; width:3px; height:3px; background:rgba(255,255,255,.5);}
.main_searching .board_search .search_inp{ width:14em}
.main_section2{ top:0}
.main_section2 .gall_wrap{ width:100%; max-width:350px}
.main_section2 .edu_wrap{ width:100%; max-width:350px}

#contents .subVisual_wrap{ height:200px}
#contents .subTitle{ padding-top:0 !important}
#contents .subTitle .tit_area .tit2{ font-size:1.570em; letter-spacing:-.5px}
#contents .subCon{ padding:0 !important}
#contents .subCon .subPage_Tit .in{ padding:1em !important; font-size:1.375em}
#contents .subCon .doc{ padding:30px .3em 140px .3em;}

#footer .menu_wrap .top{ top:70px; z-index:10000;}
#footer .info_wrap{ padding:10px 0}
#footer .info_wrap .info .con_wrap{padding:0; text-align:left;}
#footer .info_wrap .info .con_wrap > li{ padding-right:10px}
#footer .info_wrap .info .con_wrap .copy{ font-family:sans-serif;}
#footer .menu_wrap .family_wrap .family_btn{ width:10em}

.main_list_col,
.main_list_col{ flex-direction:column; margin-left:0}
.main_list_col .inner .list_wrap,
.main_list_col .inner .list_wrap{ margin:0 0 1em 0}
.main_icon_col .inner .list{ flex-wrap:wrap;}
.main_icon_col .list.st1 > li .arrow{ display:none}
.main_icon_col .list.st1 > li .sbj{ margin-left:.3em}

.main_list_col .inner{ flex-direction:column; }
.main_section4 .gall_wrap{ max-width:100%}	

.page_tab .tab{ margin:0 -.4em -.4em 0;}
.page_tab .tab > li{ flex:1 0 50%; max-width:50%;}
.page_tab .tab > li > a{ flex:1; padding-left:.5em; padding-right:.5em; margin:3px}
.page_tab .tab, .page_tab .tab > li, .page_tab .tab > li > a{ flex-wrap:wrap}

.page_tab_wrap .tab_ul > li > a{ height:30px; line-height:30px}
.login_wrap .in{ border:none; background:none; margin:0}
.edit_wrap{ padding:1.5em}
.member_wrap .member_tit .tit{ font-size:1.750em}
.member_wrap .member_tit .txt, .page_step_wrap .step > li .in .tt{ font-size:.875em}
.member_wrap .form2 .field .txt{ font-size:.875em}
.page_step_wrap .step > li .in{ padding:0; min-width:6em}
.member_wrap .finish_wrap .join_fin .th{ width:5em}
.member_wrap .finish_wrap .tit{ font-size:1.250em}
.main_tit .tit{ font-size:1.250em !important}
.main_btn, .main_section2 .board .tab_wrap .tab > li .more{ width:25px; line-height:20px;}
.main_section2 .board{ width:auto}
.main_section3{ top:0}
.main_section3 .list01 .area2{ width:100%; max-width:100%;}
.main_section3 .list01 .area2 .banner_ul{ overflow:hidden} 
.main_section3 .list01 .area2 .banner_ul > li{ width:50%; float:left}
.main_section3 .list01 .area2 .banner_ul > li > a{ height:5.5em; padding:1em}
.main_section3 .list01 dl > dd .t1{}
.main_section3 .list01 dl > dd .t2{ padding:5px 0}
.sub2_ul li{ width:100%}
.sub2_ul li .border_dv .p1{ font-size:1em}
.site_ul li{ width:50%}
.greetings_wrap .img_dv{ display:none}
.greetings_wrap .txt_dv{ width:100%; font-size:.875em}
.about_wrap .right{ display:none}
.about_wrap .left{ width:100%; font-size:.875em}
.page_tab_wrap .tab_ul.st1 > li{ width:50%}
.society .t_nav ul li{ width:33.33%}
.society .t_nav ul{ margin:20px 0 25px -5px}
.society .t_nav ul li .inner{ margin:0 0 5px 5px; font-size:.875em; padding:.5em}
.page_tab_wrap .tab_ul > li > a, .society .edit_wrap .t2, .edit_wrap.in_tb{ font-size:.875em}
.logo_in li{ width:100%}
.logo_in li:last-child{ margin-top:1em}
.color_list > li{ width:50%}
.table_wrap{ overflow-x:scroll}
.sub2_tab .tab_idx li .border_dv{ font-size:.875em}
.sub3_tab .tab_idx li{ width:33.33%; margin-bottom:0; padding:1em 0; font-size:.875em}
.sub3_tab .con_idx .down_dv a{ margin-top:1em}
.history_area .history_lst .list dd{ padding:4px 0 4px 80px; font-size:.875em}
.input_tt{ display:block; font-size:.875em}
.member_wrap .form2 .check_wrap .check_ul > li{ width:50%}
.history_area .history_lst .list dt .year{ font-size:1.125em}
.page_tit4 .tit{ font-size:1em}
.cont_dv .top_tit_dv .p1 span{ font-size:1.125em !important}
.page_tit5{ font-size:1em}
.search_w{ padding:1.5em}
.search_w .search_selec{ width:6em}
.search_w .search_bt{ padding:0 .5em}

.history_wrap .history_area .history_sst{ margin-left:85px}
.history_wrap .history_area .history_sst .list{ padding:10px 0}
.history_wrap .history_area .history_sst .list dd.first{ padding:5px 0 5px 10px; margin-left:-50px; font-size:.938em; text-align:right}
.history_wrap .history_area .history_sst .list dt .year{ font-size:1.570em; margin:3px 10px 0 0}
.history_wrap .history_area .history_sst .list dt{ margin:0 0 0 -160px}
.history_wrap .history_area .history_sst .list dd{ float:none}
.history_wrap .history_area .history_sst .list dd strong{ min-width:27px}


/**/	
#header .top_wrap .symbol{display:none;}
#header .top_wrap .mem_wrap .tt{padding:0 7px;}
#header .header_wrap .logo .txt{padding-left:13px;}

#header .gnb_wrap{display:none;}
#header .searchSection.on{top:70px;}
#header .searchSection .inp_wrap{ padding:.5em 0}
#header .searchSection .inp_wrap .inp_sel{width:92px;}
#header .searchSection .searchClose{right:10px;}

#contents .subNav_wrap .nav > div.home{display:none;}
#contents .subNav_wrap .nav div[class^="depth"] .tt{min-width:90px; padding:0 10px; font-size:.875em}
#contents .subNav_wrap .nav div[class^="depth"] .tt:after{right:6px;}
#contents .subNav_wrap .tt{height:45px; line-height:45px;}
#contents .subNav_wrap .sns .tt{padding-left:7px; margin-left:7px;}
#contents .subNav_wrap .sns li:first-child{display:none;}
#contents .subNav_wrap .sns .tt:before{background:none;}

#contents .subNav_wrap .nav .gnb li > a{padding:10px 5px 10px 10px;}
#contents .subNav_wrap .nav > div.depth_2{width:150px;}



.f_equal{height:auto!important;}


#footer .info_wrap .info{width:100%;}
#footer .info_wrap .cs{width:100%;}

#footer .info_wrap .info .logo{position:inherit; text-align:center;}

#footer .info_wrap .cs .con_wrap{padding:0; margin-top:20px; border-top:1px solid #777; padding-top:20px;}

#footer .info_wrap .cs .sns_wrap{top:80px;}
#footer .info_wrap .cs .f_equal{height:inherit!important; border-left:0;}


.main_slide .visual_con{display:none;}
#con1 .notice_dv{margin-top:30px;}
#con1 .notice_dv .l_dv{width:100%; height:auto!important; margin-left:0; float:none; margin-bottom:15px; padding-bottom:20px; border-bottom:1px solid #ddd;}
#con1 .notice_dv .r_dv{width:100%; padding-left:0; height:auto!important;  float:none;}
#con1 .notice_dv .r_dv::before{background:none;}
#con1 .notice_dv .l_dv .today_notice .date{height:88px;}
#con1 .notice_dv .l_dv .today_notice .date .st1{padding-top:24px;}
#con1 .notice_dv .l_dv .today_notice .p1{margin-bottom:10px;}

#con2 .con2_ul{margin-left:-10px;}
#con2 .con2_ul > li{width:50%;}
#con2 .con2_ul > li .pd_dv{margin:0 0 10px 10px; padding:30px;}

#con3 .over .event_slider{width:100%; margin-bottom:20px;}
#con3 .over .popzone_slider{width:100%; margin-left:0;}
#con4 .gall_slider .flex-direction-nav{right:50px;}

#con4 .con4_ul > li{width:50%;}
#con4 .con4_ul > li .pd_dv{margin:0 7px 10px;}

#con5 .site_dv .flex-direction-nav > li .flex-prev{right:50px; width:30px; height:30px; top:-40px;}
#con5 .site_dv .flex-direction-nav > li .flex-next{width:30px; height:30px; top:-40px;}




.tbl_st2{ font-size:0.75em;}
.tbl_st2 thead th { padding:5px 5px;}
.tbl_st2 tbody th { padding:5px 5px;}
.tbl_st2 tbody td { padding:5px 5px;}
	
.sub2_ibox1{ padding:15px;}

.img_box1{ padding:15px;}

.sub2_ibox2 .ul_st2{margin-left:0px; margin-top:-10px;}
.sub2_ibox2 .ul_st2 .li_st2{ float:none; width:100%;}
.sub2_ibox2 .ul_st2 .li_st2.wid2{ float:none; width:100%;}
.sub2_ibox2 .ul_st2 .li_st2 .inner_w{ padding:15px; margin-left:0; margin-top:10px;}
.sub2_ibox2 .ul_st2 .li_st2 .inner_w .tit1{ height:auto; padding:10px 20px;}

.ment1 .ul_di .li_in{ float:none; width:100%;}

.greet{ background-size:40%}
.greet p.txt:nth-child(2){ width:100%}
		
.peo_box li{ width:100%; padding:0}		
.history_area .history_lst{ padding-left:80px}
.history_area .history_lst .list dd.first{ padding:0}
.w_view_info{ width:inherit !important}
.board_st.gallery .list > li{ width:50% !important}

}


@media screen and (max-width:767px){
body:not(#pop){ font-size:13px;}

.PC{ display:none !important;}
.PHONE{ display:block !important;}


/*header*/
#header .header_wrap .logo .mark{ height:50px;}
#header .searchSection .inp_wrap .inp_txt{ width:60%}
#header .header_wrap .vm_wrap{ height:70px}





/*footer*/
#footer .foot_wrap{}
#footer .foot_wrap .sitemap_wrap{ display:none;}
#footer .foot_wrap .info_wrap{ float:none; width:100%;}
#footer .info_wrap .inner{ padding:15px 0px 15px 0;}
#footer .info_wrap .info > dt, #footer .info_wrap .info > dd{ padding:2px 0;}
#footer .info_wrap .menu{ margin-top:10px;}
#footer .info_wrap .logo{ display:none;}

#footer .info_wrap .menu > li > a{ font-size:0.68em;}

#footer .copy_wrap{ padding:15px; line-height:1.6;}
#footer .info_wrap .footerLogo{ width:120px; margin-top:10px}
#footer .info_wrap .info{ margin-top:1em; padding-left:0}
#footer .menu_wrap .family_wrap{ right:50px; top:70px}


/*main*/
.main_section1{ top:1em}
.main_visual .arrow_wrap{ display:none}
.main_visual .slogan{ top:2.5em}
.main_visual .slogan .slogan_area{ width:80%; margin-left:-2em}
.main_visual .slogan .t1{ font-size:2.250em !important;}
.main_visual .slogan .t2{ font-size:.938em;}
.main_visual .arrow_wrap{ top:90%; left:5%}
.main_visual .arrow_wrap > li.next{ right:78%}
.main_visual, .main_visual .visual .item{ height:430px; background-position:70% bottom;}
.main_section1 .list01 > li{ min-height:auto}
.main_section1 .list01 > li .inBox > dl .tt{ font-size:1.125em;}
.main_section1 .list01 > li .inBox > dl .t1{ word-break:break-all;}
.main_section .btn_wrap2{ display:none}
.main_searching{ padding-top:.5em}
.main_searching .board_search .search_inp{ width:9.5em}
.main_btn, .main_section2 .board .tab_wrap .tab > li .more{ width:25px; line-height:20px;}
.main_btn .xi{}
.main_section2{ top:3em}
.main_section2 .board{ float:none; width:auto}
.main_section2 .board .tab_wrap .tab > li .tt{ padding:.7em .8em; font-size:.875em}
.main_section2 .gall_wrap{ top:3em; max-width:767px; width:100%;}
.main_section2 .edu_wrap{ width:100%; top:5em; position:relative; max-width:100%; min-height:290px}
.main_section2 .edu_wrap .in .tt{ font-size:1.375em}
.main_section3{ top:5em}
.main_section3 .list01 dl > dd{ width:60%}
.main_section3 .list01 dl.st1:after{ display:none}
.main_section3 .list01 .area2{ float:left !important; max-width:100%; margin-top:2em}
.main_section4{ position:relative; margin-top:5em}
.main_section4 #client ul.ptn_photo li a{ height:45px}
.main_section4 #client ul.btn .client_tt{ display:none}
.main_section4 .owl-carousel{ left:25% !important}
#footer{ position:relative}

.memo_wrap{ padding:1em}
.layer_closeBg{ top:-150px !important}


.main_section4 .board2 .txt_wrap{ width:72%}

/*sub*/
#contents .contents_top{ height:140px;}
#contents .subVisual_wrap{ height:150px !important}
#contents .subTitle{ padding-top:35px; height:150px !important}
#contents .subTitle .tit{ font-size:1.8em;}
#contents .subNav_wrap{}
#contents .conTitle{ padding:10px 0;}
#contents .conTitle .tit_wrap{ float:none; text-align:center;}
#contents .conTitle .nav_wrap{ float:none; text-align:center;}
#contents .subCon{ padding:30px 0 70px 0}

/*fixed table*/
.fixed_t_in{ overflow-x:scroll}
.fixed_t{ table-layout:fixed; width:800px !important}

/*공통*/
.txt_box{ padding:15px;}
.txt_box:after{ width:2px; height:20px;}
.txt_box:before{ width:20px; height:2px;}

/*1_1*/
.info_icon{ display:none;}
.info_in .info_tx{ float:none; width:100%; padding-left:0;}
.center_info{ margin-bottom:50px;}

.table_w2{ width:25%;}
.table_w8{ width:75%;}

.tbl_st2{ font-size:0.875em;}
.tbl_st2 thead th { padding:5px; }
.tbl_st2 tbody th { padding:5px; }
.tbl_st2 tbody td { padding:5px; }

/*1_2*/
.info_box1 .info_form{ margin:-5px 0 0 -5px;}
.info_box1 .info_form li{ width:33.33%;}
.info_box1 .info_form li div.in_box2{ padding:10px; margin:5px 0 0 5px; line-height:1.4;}

.rules{ margin:0;}
.sub_tit3{ margin:30px 0 5px 0}

/*1_7*/
.map_wrap .left_map{ float:none; width:100%;}
.map_wrap .left_map iframe{ height:250px !important;}
.map_wrap .right_map{ float:none; width:100%;}
.map_wrap .right_map iframe{ height:250px !important;}

/*2_1*/
.in_ul2{ margin-left:16px;}

/*4_1*/
.col_wrap.sec3 > * { width:100%;}
.prod_cate_wrap{ margin:0 0 40px 0;}
.prod_cate_wrap .list > li > a{ border-right:1px solid #bbb; height:40px; margin-bottom:5px;}

/*5_1*/
.top_txt_w .top_ul{ margin-top:-25px;}
.top_txt_w .top_ul li .tit1{ display:block; width:30%; margin-bottom:5px; margin-top:25px;}
.top_txt_w .top_ul li .tit1.none{ margin-top:10px;}
.top_txt_w .top_ul li p { margin-bottom: 0; }

.top_txt_w{ padding:15px; margin-bottom:20px;}
.faq_wrap.mb40{ margin-bottom:20px !important;}

/*privacy*/
.terms_area{ padding:15px;}
.terms_area .terms_box{ padding:0; font-size:0.875em;}
.sub_tit4{ font-size:0.75em; color:#333; margin:0 0 5px 0;}

.edu_search{ padding:1.2em 2em}
.edu_search .input_st.w3{ width:100%}
.edu_search .input_st.w6{ width:100%}
.edu_search label{ margin-right:0; width:100%}
.edu_search button.input_st{ height:40px; line-height:40px; width:100%;}

.page1_2wrap .right_con .logo{ width:100%}
.page1_2wrap .right_con .txtB{ width:100%; padding-left:0}
.page1_2wrap .about .ab_list li .btn_r{ width:35px; height:35px}
.page1_2wrap .about .ab_list li i{ line-height:35px}
.peo_box ul{ margin:0;}
.peo_box li{ margin:0 0 1em}
}



@media screen and (max-width:530px){
body:not(#pop){ font-size:13px;}
.layer_closeBg{ top:-160px !important}
#header .top_wrap{ display:none}
#header .header_wrap{ border-top:4px solid #e8a6cb}

.main_section1 .list01 > li, .main_section1 .list01 > li.list02{ width:50%}
.page1_5wrap .peo_list ul{ width:100%}
.edu_search label span{ display:block; margin-bottom:5px; text-align:left}
.main_icon_col .inner .list > li{ min-width:33.33%}

.greet{ background:none}
.greet p.txt{ width:100%}
#footer .menu_wrap .vm_wrap{ height:40px}
}


@media (min-width: 480px) and (orientation: landscape){


}