   @media screen and (max-width: 780px) {
    .pc {display: none;}
    .mob {display: block;}
      html,body { min-width: initial;}
      #wrap { min-width: initial;}
    #header {min-width: initial;}
     

    #header {margin-top: 0px;  border-bottom: none;     height: 100px;} 
    #header:hover { border-bottom: none;}
    #header_inner {margin-top: 15px; position: relative; margin: 20px 0px; padding-top: 0px;}
    #header_logo { width: 100%; max-width: 120px;
    margin-left: 0px; position: absolute; left: 50%;
    top: 0%; transform: translate(-50%, 0px); padding-top: 10px}
    

    #lang > li img {max-width: 28px;}
    #nav {display: none; width: 100%; padding: 0px 35px; box-sizing: border-box; position: absolute;
    top: 65px;  left: 0px; background-color: #3f3f3f; margin-left: 0px; padding-bottom: 20px; margin-right: 0px;}
    #nav  li {height: auto; width: 100% !important; color: #fff; font-weight: bold; margin-top: 0px; text-align: left; margin-bottom: 15px; padding-left: 0px;}
    #nav:hover  li { color: #fff; padding-bottom: 0px; border-right: none;}
    
    
    #nav a:nth-child(1) li {margin-top: 25px;}
    #nav.on {display: block;}
    #nav:hover .menubg {display: none;}
    .sub_menu {  position: relative; padding-top: 8px; top: 0px; background-color: transparent; text-align: left !important; padding-bottom: 0px; margin-left: 15px !important; width: auto !important;}
    .sub_menu li {display: block; color: #fff;text-align: left;     padding-left: 0px;  padding-bottom: 7px; box-sizing: border-box; font-weight: 500;}
    .sub_menu li:hover {color: #fff; border-bottom: 0px;}
    #menu_icon {display: block; position: absolute; width: 100%; max-width: 30px; right: 5%; top: 0%; z-index: 100; padding-top: 10px}
    #menu_icon img {width: 100%;}
    #open_btn {display: block;}
    #close_btn {display: none;}
    #nav:hover .sub_menu { display: none;}

    #right_header {margin-top: 15px; margin-left: 15px; width: 20%;}
    
    #shop {width: 100%; margin-right: 0%;  display: block; margin-bottom: 8px;}
    #shop i { display: none;}
    #shop p { font-size: 12px; line-height: 16px;}
    #lang { width: 100%;  margin-left: 0%; display: block; }
    #lang li { font-size: 12px; line-height: 16px;}
       
       .m_1 {width: 100%; height: 80vh;}
       .container {width: 100%;}
       .m_1_img_box {width: 90%;}
       
       .dilivery {width: 100%; padding-top: 30px !important; border-bottom: none; padding: 0;}
       .dilivery_img {width: 90%; margin-bottom: 15px;}
       
       .m_2 {width: 100%; height: auto; padding: 40px 0;}
       .m_2_img_box {display: block; width: 90%; float: initial; margin: 0 auto;}
       .m_2_img_box:last-child {float: initial; margin-top: 40px;}
       .m_2_img_text {width: 100%;}
       .m_2_img_text br {display: none;}
    
       .m_3 {padding: 40px 0; overflow: hidden;}
       .m_3_img img:first-child {max-width: 90%; margin: 0 auto; display: block; margin-bottom: 40px;}
       .m_3_img img:nth-child(2) {width: 165%; position: relative; left: 50%; transform: translateX(-50%);}
       .m_3_back_img {width: 100%;}
       
       #ss4 {display: block; position: initial !important; top: 0; box-shadow: 0px 5px 10px -5px #000;}
       .m_4 {height: auto; padding: 40px 0;}
       .m_4_back {overflow: hidden;}
       .m_4_back li {width: 100%; float: initial;}
       .m_4_back li:last-child {width: 185%; float: left;}
       .m_4_back li:last-child img {height: auto; margin-top: -4px;}
       ul.m_4_back:before {content: ''; display: table; clear: both;}
       ul.m_4_back:after {content: ''; display: table; clear: both;}
       .m_4_contact {position: initial; padding-bottom: 60px;}
       .sub_inner {position: relative; top: 50%; left: 50%; transform: translate(-50%,-50%);}
       
       .m_5 {padding: 20px 0 80px 0;}
       .m_5_ex {width: 90%;}
       .m_5_ex img:first-child {display: none;}
       .m_5_ex img:last-child {display: block;}
       
       .m_6 {height: auto; overflow: hidden; width: 100%;}
       .m_6 img {position: relative; width: 250%; left: 50%;  transform: translateX(-50%); margin-bottom: -4px;}
       #f_inner {width: 100%; text-align: center;}
       #f_inner li:nth-child(1) {width: 100%;}
       #f_inner li:nth-child(2) {width: 100%;}
       #f_inner li:nth-child(2) p {width: 100%;}
       #f_inner li:nth-child(2) p:nth-child(2) {width: 90%;}
       #f_inner li:nth-child(3) {width: 100%;}
       
}