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



@media screen and (max-width:1630px){
#header .top_wrap.box0{ margin:0 1.5%;}
#header .gnb_wrap .gnb > li .dp1{ padding:0 1em;}
.translated-ltr[lang=en] #header .gnb_wrap .gnb > li .dp1 .va{ width:150px; line-height:1.2;}
.translated-ltr[lang=en] #header .gnb_wrap .gnb > li.m_1 .dp1 .va,
.translated-ltr[lang=en] #header .gnb_wrap .gnb > li.m_3 .dp1 .va,
.translated-ltr[lang=en] #header .gnb_wrap .gnb > li.m_6 .dp1 .va{ width:100px;}
}


@media screen and (max-width:1480px){
#header .gnb_wrap .gnb > li .dp1 .va{ font-size:1.068em;}
#header .top_wrap .logo{ width:160px; height:auto;}
#header .etc_wrap .all_wrap .all_btn{ width:2.5em; height:2.5em;}
}


@media screen and (max-width:1400px){
#header .gnb_wrap .gnb > li .dp1{ padding:0 .7em;}
#header .gnb_wrap .gnb > li .dp1 .va{ font-size:1em;}
#header .gnb_wrap .gnb > li .dp2 > li > a{ padding:.6em .5em;}
#header .gnb_wrap .gnb > li .dp2 > li > a .va{ font-size:.875em;}
#header .etc_wrap .mem_wrap > li a .xi{ margin-right:0; display:block;}	

.translated-ltr[lang=en] #header .gnb_wrap .gnb > li.m_1 .dp1 .va,
.translated-ltr[lang=en] #header .gnb_wrap .gnb > li.m_3 .dp1 .va,
.translated-ltr[lang=en] #header .gnb_wrap .gnb > li.m_6 .dp1 .va{ width:80px;}
}

@media screen and (max-width:1300px){
#header .top_wrap.box0{ margin:0 1%;}
#header .all_wrap{ padding:0 .5em;}
#header .top_wrap .logo{ width:140px;}
#header .etc_wrap .all_wrap .all_btn{ font-size:1em;}
.translated-ltr[lang=en] #header .gnb_wrap .gnb > li .dp1 .va{ width:130px; line-height:1.2;}
}

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

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

#header .top_wrap.box0{ margin:0 3%;}
#header .top_wrap .gnb_wrap{ display:none;}
#header .top_wrap .logo{width:160px;}	
#header .all_wrap{ padding:0 1em;}
#header .etc_wrap .all_wrap .all_btn{ font-size:1.125em;}
}

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

.main_con1 .about_list > li{ width:50%;}
.about_content2 .in_tx_box{ padding:7em 8em 6em;}


}

@media screen and (max-width:950px){
	
.main_con2{ margin-top:2em;}	
.main_con2 .board_cont, .main_con2 .food_news{ width:100%;}	
.main_con2 .board_cont .detail_wrap, .main_con2 .food_news .in_con{ min-height:auto;}
.main_con2 .food_news{ margin-top:2em;}
.about_content2 .in_tx_box{ padding:7em 5em 6em;}

.bs_cont .bs_bg{ height:200px;}
.bs_cont .bs_tit{ padding:2.5em 2em 0; width:70%;}
.bs_cont .bs_tx{ padding:3.5em 2em 0;}
.bs_list > li{ width:50%; margin-bottom:2em;}

.prod_wrap{ margin:-1em 0 3em -1em;}
.prod_wrap > li{ width:33.33%;}
.prod_wrap > li .in{ margin:1.5em 0 0 1em;}

.tbl_info{ display:block; color:#666;}
.fixed_w {overflow-x:scroll;}
.fixed_w .fixed {width:1000px !important; table-layout:fixed;}
.fixed_w.fix_st .fixed {width:1300px !important; table-layout:fixed;}

#contents .sub_visual_wrap .sub_gnb_wrap .gnb > li .dp2 > li{ max-width:25%;}

}

@media screen and (max-width:768px){
body{ font-size:15px;}
.box0{ margin:0 1.5% !important;}

#header .top_wrap .logo{ width:150px;}
#header .top_wrap, #header .va_wrap{ height:4.5em;}
#header .all_wrap{ padding:.6em;}
#header .etc_wrap .all_wrap .all_btn{ font-size:1em;}
#header .etc_wrap .mem_wrap > li{ margin:0 7px;}

#contents .sub_visual_wrap .sub_gnb_wrap{ display:none;}
#contents .sub_visual_wrap .slogan{ margin-top:0;}
#contents .sub_visual_wrap .va_wrap{ height:15em;}

.mainVisual .el{ height:400px; height:22vh;}
.mainVisual_wrap {margin-top:3em;}
.mainVisual_wrap .control_wrap {bottom:0;}
.mainVisual_wrap .control_wrap .nav .btn{ width:2em; line-height:2em; width:1.5em; line-height:1.5em;}
.mainVisual_wrap .control_wrap .nav .btn .xi {font-size:1em;}

.main_con2 .board_cont .tab_idx > li{ min-width:auto;}
.main_con2 .board_cont .brd_top .brd_dd{ font-size:1.125em;}
.main_con2 .new_prod > li .in_w .txt_dv,
.main_con2 .food_news .in_con .news_list > li .n_in .txt_dv{ height:40px;}

html.l-nav-open .l-nav{ width:80%;}
html.l-nav-open .l-main {
  -webkit-transform: translate3d(-80%, 0, 0);
  -moz-transform: translate3d(-80%, 0, 0);
  -o-transform: translate3d(-80%, 0, 0);
  transform: translate3d(-80%, 0, 0);
}

.tab_idx > li > a .va{ font-size:.938em;}
.sub_tit .t1{ font-size:2.125em;}
.bs_cont,
.bs_list{ font-size:.938em;}
.prod_wrap > li{ width:50%;}
.tab_idx.fs7 > li{flex:33.33%;}
.step_list{ margin-right:-1em;}
.step_list > li .in{ margin-right:1em;}
.step_list > li{ margin-top:1em;}
.step_st > li .in{ padding:0 1em;}
.step_st > li .in .icon{ display:none;}
.step_st > li .in:after{ display:none;}
.agree_box .check{ font-size:1.068em;}
.agree_box .agree_wrap{ margin-left:0;}
.page_tit .t2{ font-size:1.85em;}
.box_st{ padding:2em 1.5em; font-size:.938em;}

.mod_vcon{ margin-right:-5px;}
.mod_vcon li{ width:50%;}
.mod_vcon li .in{ margin-right:5px;}
#footer .info_wrap .f_logo{ width:140px; height:auto; margin:0 auto 1.5em;}
.pop1_explain .left .into_btn{ position:inherit; bottom:inherit; left:inherit;; margin-left:0; margin-top:.5em; text-align:center;}
.member_wrap .login_box{ font-size:.938em;}

.prod_search .search .tit_wrap{width:130px;}
.prod_search .search .inp_wrap{ padding:0 3.5em 0 2em;}
.prod_search .search .btn_wrap{ width:75px;}

.mainVisual_wrap .control_wrap .paging ol > li > a.flex-active {height:3em;}

}


@media screen and (max-width:600px){
	
.main_con1 .about_list > li{ width:100%; min-height:auto; padding:1.5em; margin-bottom:10px;}
.main_con1 .about_list > li:nth-child(3){ border-right:1px solid #d0c2b4}

.about_content2 .in_tx_box{ padding:4em 2em;}
.about_content2 .in_tx_box .tw_tit{ font-size:1.65em;}
.about_content2 .in_tx_box .tw_en{ font-size:1em;}
.about_content2 .in_tx_box .tw{ font-size:1em;}
.about_content2 .in_tx_box .ceo{ font-size:1.125em;}
.wrap_map{ height:300px !important;}

.pj_con{ margin-top:3em;}
.pj_con li .in{ display:block; margin-bottom:5em;}
.pj_con li .in > *{ width:100%;}
.pj_con li .in .img{ width:100%;}
.pj_con li .in .tx{ width:100%;}

.com_top .txt_wrap{ min-width:100%; box-sizing:border-box;}
.step_list{ margin-right:0;}
.step_list > li{ flex: 100%;}
.step_list > li .in{ min-height:auto; margin-right:0;}
.step_list > li .box_line{ display:none;}

.vod_in01,
.vod_in02{ width:100% !important;}
.page_tit .t2{ font-size:1.5em;}
#footer{ font-size:.938em;}
.step_pop .step_tt{ font-size:1.25em;}

#google_translate_element{ position:absolute; top:10px; right:65px;}
.goog-te-gadget-simple .goog-te-menu-value span{ font-size:.813em;}
#header .etc_wrap .mem_wrap{ margin-top:26px;}	
#header .etc_wrap .mem_wrap > li{ margin:0 5px;}
#header .top_wrap .logo{ width:130px;}
.main_con2 .board_cont .more_btn{ width:2em; height:2em; line-height:2em;}

.pop1_explain .left,
.pop1_explain .right{ float:none !important;}
.pop1_explain .left{ width:250px; margin:0 auto;}
.pop1_explain .right{ width:95%; margin:3em auto 0; padding-left:0;}

.bs_cont .bs_tit{ padding:2.5em 1em 0;}
.bs_cont .bs_tx{ padding:3.5em 1em 0; font-size:1em;}
.prod_wrap{ margin:-.5em 0 3em -.5em;}
.prod_wrap > li .in{ padding:.5em; margin:.5em 0 0 .5em;}
.prod_wrap > li .in .more{ width:1.25em; height:1.25em; line-height:1.5em;}
.prod_wrap > li .in .tit{ font-size:1.125em;}
#header .etc_wrap .mem_wrap > li a .xi{ display:none;}

.translated-ltr[lang=en] .main_con1 .about_list > li,
.translated-ltr[lang=en] .main_con1 .about_list > li .ab_st1 > li a{ min-height:auto;}
.translated-ltr[lang=en] .mod_vcon li{ width:100%; margin-bottom:1em;}
.translated-ltr[lang=en] .mod_vcon li .in{ min-height: auto;}
.member_wrap .member_tit{ font-size:.813em;}
.member_wrap .member_form{ padding:2em;}


}


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

.mainVisual .el{ height:310px; height:22vh;}
.main_con1{ margin-top:2em;}
.main_con1 .about_list > li .ab_st1,
.main_con1 .about_list > li .ab_st2{ margin-top:1em;}
.main_con1 .about_list > li .ab_st2 .inp{ height:3em;}
.main_con2 .board_cont .tab_idx > li{ font-size:1.068em;}
.main_con2 .board_cont .brd_top{ padding:0 1em 1.5em;}
.main_con2 .board_cont .brd_top .brd_date{ width:4.5em; height:4.5em;}
.main_con2 .board_cont .brd_tit{ margin-top:.4em;}
.main_con2 .board_cont .brd_tit .in_tt{ max-width:80%;}
.main_con2 .board_cont .brd_tit .in_tw{ margin-top:-6px;}
.main_con2 .board_cont .brd_top .brd_ym{ margin-top:10px;}
.l-nav .nav_logo img{ width:50%;}
#contents .sub_visual_wrap .va_wrap{ height:12em;}
#contents .sub_visual_wrap .slogan .tit{ font-size:1.85em;}
#contents .doc{ padding:2.5em 0 6em;}
.about_content2{ padding:4em 0 6em;}
.about_content2 .in_tx_box{ padding:3em 1.5em;}
.about_content2 .in_tx_box .tw_tit{ font-size:1.45em;}
.about_content2 .in_tx_box .bar{ margin:20px auto;}
.about_content2 .in_tx_box .ceo{ margin-top:2em;}
#footer .f_menu{ margin-bottom:1em;;}
#footer .f_menu > li{ margin-right:2em;}
#footer .f_menu > li:after{ height:11px; right:-1em;}
#footer .info_wrap{ padding:1em 0;}
.sub_tit .t1{ font-size:1.85em;}
.bs_cont .bs_tit{ width:75%;}
.bs_cont .bs_tit .t2{ font-size:1.75em;}
.bs_cont .bs_bg{ height:150px;}
.bs_cont .bs_tx{ line-height:1.5;}
.bs_list{ margin-top:2em; padding-top:2.5em;}
.bs_list > li .in .bs_img{ width:5em; height:5em; margin:0 auto 15px;}
.bs_list > li .in .bs_img .fas{ font-size:1.5em;}

.com_top{ height:220px;}
.com_top .txt_wrap{ padding:30px; margin-top:30px;}
.pj_con li .in .img span{ height:180px;}
.step_list > li .in{ padding:1em;}
.agree_wrap{ padding:1em;}
.step_st{ font-size:.938em;}
.pn_wrap .pn_tbox{ width:100%;}
.pn_wrap .pn_tbox:after{ display:block; clear:both; content:'';}
.pn_wrap .pn_control,
.pn_wrap .pn_tbox .pn_tt{ float:left;}
.pn_wrap .pn_control{ margin-top:0; margin-left:7px;}
.pn_wrap .pn_control .i_btn{ width:2em; height:2em; line-height:2em;}
.pn_wrap .in_con{ width:100%; margin-top:10px;}
.pn_wrap .in_con li .n_in{ margin:0 3px;}
.main_con2 .food_news .in_con .news_list > li{ padding:.8em;}

.prod_search .search .tit_wrap{width:110px;}
.prod_search .search .inp_wrap{ padding:0 2em 0 1em;}
.prod_search .search .btn_wrap{ width:65px;}
.prod_search .search .inner{ padding:0 50px 0 110px;}

}