/* mobile */
@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;}
    
/*    menu*/
    
    
    #header {margin-top: 0px;  border-bottom: none;     height: 90px;} 
    #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: 90px;  left: 0px; background-color: #4c4c4c; margin-left: 0px; padding-bottom: 20px; margin-right: 0px; border: 3px solid #fff}
    #nav:hover { background-color: #4c4c4c; }
    #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: 80px; right: 0%; top: 0%; z-index: 100;padding-top: 0px}
    #menu_icon img {width: 100%;}
    #open_btn {display: block;}
    #close_btn {display: none;}
    #nav:hover .sub_menu { display: none;}

    #right_header {margin-top: 15px;}
    
    #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;}
    
    
    
/*    main*/
    #ms1_ul li:nth-child(1) { width: 90%; padding-left: 0px; margin: 0px auto; display: block;}
    #ms1_ul li:nth-child(2) {width: 90%; margin: 0px auto; display: block;}
    
     #ms1_ul2 li:nth-child(1) { width: 90%; padding-left: 0px; margin: 0px auto; display: block;}
    #ms1_ul2 li:nth-child(2) {width: 90%; margin: 0px auto; display: block; padding-left: 0px;}
    
    
    #ms1_ul li:nth-child(1) p:nth-child(1) { font-size: 27px; line-height: 33px; text-align: center}
    #ms1_ul li:nth-child(1) p:nth-child(2) {  font-size: 12px;  line-height: 20px;  padding-top: 10px; padding-bottom: 20px; text-align: center;}
    
    .more {margin: 0px auto; font-size: 14px;}
    #ms1_ul li:nth-child(2) img { max-width: 270px;  margin: 20px auto; }
    
    #ms1_ul2 li:nth-child(1) img {  max-width: 220px; margin: 0px auto 20px; display: block;}
    #ms1_ul2 li:nth-child(2) p:nth-child(1) { font-size: 27px; line-height: 33px; text-align: center}
    #ms1_ul2 li:nth-child(2) p:nth-child(2) {  font-size: 12px;  line-height: 20px;  padding-top: 10px; padding-bottom: 20px; text-align: center;}
    #ms1_ul2 .more {float: none;}
    
    .m_title p:nth-child(1) { border-left: 0px solid #fff;  padding-left: 20px; padding-top: 50px;  font-size: 20px;  margin-bottom: 10px;}
    .m_title p:nth-child(2) { padding-left: 20px; font-size: 30px; line-height: 40px;}
    
    
    
    #ms2 {margin-bottom: 0px;}
    #ms2_ul { padding-top: 210px;}
    #ms2_ul li { display: block; width: 90%; margin: 0px auto 10px; padding: 15px 20px 25px;}
    #ms2_ul li p:nth-child(1) { font-size: 22px; line-height: 40.23px;}
    .ms2_ul_line {  height: 2px; margin-bottom: 12px;}
    #ms2_ul li p:nth-child(3) { font-size: 13px; transform: skewX(-0.3deg); line-height: 20.35px; }
    #ms2_ul li#ms2_ul_blue { margin-top: 0px;}
    
    
    
    #ms3_ul {padding-top: 210px;}
    #ms3_ul li {  width: 90%; margin: 0px auto; display: block; height: auto;}
    #ms3_ul li:nth-child(1) p { font-size: 15px; line-height: 22.35px;  width: 100%; transform: skewX(-0.3deg);  padding-top: 0px; padding-left: 0px;}
    #ms3_ul li:nth-child(2) {height: 400px;}
    #ms3_ul li:nth-child(2) #main_ani1 {max-width: 266px;
    left: 4.7%;  top: 13.6%;}
    #ms3_ul li:nth-child(2) #main_ani2{ position: relative; left: auto; top: auto; margin: 30px auto;
    display: block;}
    #counter_num { top: 43%; left: 29%; font-size: 30px; transform: translate(0px, -50%);}
    
    #ms4 {margin-bottom: 70px;}
    #ms4_ul {padding-top: 160px;}
    #ms4_ul li { width: 90%; display: block; margin: 0px auto;}
    #ms4_ul li:nth-child(1) > img { max-width: 235px; margin: 35px auto 0px; display: block;}
    #ms4_ul > li:nth-child(2) > p { font-size: 13px;
    line-height: 24.35px; text-align: right;  transform: skewX(-0.3deg); padding-top: 25px;  padding-right: 0px;}
    #ms4_sub {margin-top: 25px;}
    #ms4_sub li:nth-child(1) > img {max-width: 50px;  margin-top: 0px;}
    #ms4_sub li p { font-size: 13px; line-height: 20.93px;  padding-top: 12px;}
    #ms4_sub li img { max-width: 50px;}
    #ms4_sub li { width: 33%; display: inline-block;}
    
    
    #ms5 {padding-bottom: 50px;}
    #ms5_ul {padding-top: 210px;}
    #ms5_ul li {  width: 90%; display: block;  margin: 0px auto;}
    #ms5_ul li:nth-child(1) p { font-size: 14px;line-height: 22.35px; width: 100%; transform: skewX(-0.3deg); padding-top: 0px; box-sizing: border-box;  padding-left: 0px;}
    #ms5_ul li:nth-child(2) img { margin: 35px auto;}
    
    
    #f_inner { width: 90%; padding-bottom: 30px; }
    #f_info1 { width: 50%;}
    #f_info2 { width: 50%;}
    #f_info3 { width: 100%; margin-top: 15px}
    #f_inner li { font-size: 12px; line-height: 18.83px;}
    #f_info1::after {right: 15%; top: 0%; height: 100%; width: 1px; }
    .f_p1 {font-size: 14px;}
    #f_info2::after {display: none;}
    #f_info3 p { line-height: 20px;}
    #copyright p { font-size: 11px; line-height: 15.96px; width: 90%; margin: 0px auto;  text-align: center;
    transform: skewX(-0.3deg);}
    
    
    
/*    sub1-1*/
    .sub_top {height: 255px;}
    #sub_top_p { font-size: 35px; padding-top: 140px;}
    #sub_top_p::after { max-width: 1px; height: 40px;  margin: 0px auto 0px;}
    .sub_top_title_s1 { height: 95px; padding: 25px 20px 0px;}
    .sub_top_title_s1 p {top: auto; font-size: 16px; font-weight: 300; line-height: 28px; transform: skewX(-0.3deg); word-break: keep-all; padding: 0px 10px; box-sizing: border-box;}
    .sub_top_title_s1 p br {display: none;}
    .quote { font-size: 35px; top: -10px;}
    
    .m_title.p2 p:nth-child(1) { border-left: 0px solid #205280;}
    .m_title.p2 { margin-bottom: 50px;}
    .sub1_p { font-size: 14px;}
    #sub_s1-1 { margin-bottom: 90px;}
    
    
    #sub_s1_ul1 { margin-top: 40px;}
    .sub_s1_ul { width: 95%;  margin: 0px auto;  display: block; }
    
    .sub_s1_ul li {width: 33.28%; margin-bottom: 15px;}
    .sub_s1_ul li p { font-size: 12px; line-height: 16px;}
    .sub_s1-2_p { right: 30%; top: 35%; transform: rotate(-90deg);  max-width: 35px;}
    #sub_s1_ul3 { margin-bottom: 0px; padding-bottom: 100px; }
    
     .sub_top_title_s3 { height: 95px; padding: 25px 20px 0px;}
    .sub_top_title_s3 p { top: auto;  font-size: 16px;
    font-weight: 300;  line-height: 24px;  transform: skewX(-0.3deg); padding: 0px 20px; box-sizing: border-box; word-break: keep-all;}
    .sub_top_title_s3 p br {display: none;}
    
    
    .s3_contents_2 .m_title_s3 p:nth-child(1) {   border-left: 0px solid #fff; }
    

    .m_title_s3 {width: 90%;}
    .m_title_s3 p:nth-child(1) { padding-left: 20px;
    padding-top: 50px; font-size: 20px; margin-bottom: 10px;}    
    .m_title_s3 p:nth-child(2) { padding-left: 20px;    font-size: 30px; line-height: 40.99px;}
    
    #s3-1_ul1.ul_a { padding-top: 210px;}
    .ul_a  {padding-bottom: 65px;}
    
    #s3-1_ul1 .ul_a_txt { width: 90%; margin: 0px auto;  display: block;}    
    #s3-1_ul1 .ul_a_img { width: 90%; margin: 0px auto;  display: block;}    
    #s3-1_ul1 .ul_a_txt p {width: 100%;}
    .ul_a_txt p { font-size: 14px;  line-height: 22.35px;  width: 100%; padding-top: 0px; padding-left: 0px; }
    .ul_a_img img { max-width: 255px;}

    
    
    .s3_contents_2_2 .m_title_s3 p:nth-child(1) {border-left: 0px solid #959696; }
    .m_title_s3.p2 p:nth-child(1) { font-size: 20px;
    line-height: 30px; margin-bottom: 10px;}
    .m_title_s3.p2 p:nth-child(2) { padding-left: 20px; font-size: 30px; line-height: 40.99px;}
    #s3-1_ul2 {width: 90% !important; margin: 0px auto}
    .ul_a_txt p {  transform: skewX(-0.3deg);}
    #s3-1_ul2.ul_a { padding-top: 140px;}
    .ul_a.tech {padding-bottom: 50px;}
    .ul_a_txt p.tech_p1 {font-size: 23px; line-height: 33.99px; }
    .ul_a_txt p.tech_p2 { padding-top: 20px; font-size: 12px;  word-break: keep-all;}
    .ul_a_txt p.tech_p2 br {display: none;}
    #s3-1_ul3 .ul_a_img img { max-width: 170px;}
    #s3-1_ul4 .ul_a_img img { max-width: 170px;}
    .s3_contents_2_2 {padding-bottom: 45px;}
    .sub_s32_img { width: 95%;  margin: 50px auto 100px;}
    
    
    
    .m_title_s2 p:nth-child(1) { border-left: 0px solid #ccc; padding-left: 20px; padding-top: 50px; font-size: 20px;  margin-bottom: 10px;}
    .m_title_s2 p:nth-child(2) {  padding-left: 20px; font-size: 30px;  line-height: 40.99px;}
    
    
    #s2-1_ul1.ul_a { padding-top: 235px; width: 90%; margin: 0px auto; padding-bottom: 25px; }
    #s2-1_ul1 .ul_a_txt {padding-top: 0px;}
    #s2-1_ul1 .ul_a_txt p {padding-top: 0px; font-size: 12px;  word-break: keep-all;}
    #s2-1_ul1 .ul_a_txt p br {display: none}
    #s2-1_ul1 .ul_a_img img { max-width: 165px;}
    .s21_img1 { max-width: 345px; display: block;
    margin-top: 0px;  width: 90%;  margin: 0px auto;}
    .s21_img2 {  max-width: 370px;  display: block;     margin: 50px auto 0px;  width: 95%;  margin-bottom: 0px;}

    #sub_s2-2 { margin: 70px auto 110px; padding: 55px 20px;  width: 90%; box-sizing: border-box;}
    #sub_s2-2 p:nth-child(1) { font-size: 22px; line-height: 33px; }
    #sub_s2-2 p:nth-child(2) {font-size: 30px; line-height: 40.99px; }
    
    #ss4 {margin-top: 20px;}
    #inq_s {margin: 0px auto; width: 90%;}
    
    
    
    #cuname_1 {box-sizing: border-box;}
    #cumail_1 {box-sizing: border-box;}
    #cunumber_1 {box-sizing: border-box;}
    #cusubject_1 {box-sizing: border-box;}
    #cucontent_1 {box-sizing: border-box;}
    
    
    #ss5_1 { margin: 60px 0px 50px;}
    .ss5_p1 { font-size: 23px;  line-height: 30px;}
    .ss5_p2 { font-size: 27px; line-height: 40.99px; margin-top: 5px;}
    .ss5_ul { width: 90%; margin: 35px auto 25px;}
    .ss5_ul > li {height: auto;}
    .ss5_ul > li:nth-child(1) { width: 100%; margin-right: 0; padding-bottom: 40px;}
    .ss5_ul > li:nth-child(1) p:nth-child(2) {font-size: 20px;  line-height: 28px; padding: 18px 0px;}
    .ss5_ul > li:nth-child(1) p:nth-child(3) { font-size: 14px; line-height: 23px; transform: skewX(-0.3deg);}
    
    .ss5_ul > li:nth-child(2) { width: 100%;margin-top: 20px;}
    .ss5_ul_sub > li { padding: 15px 20px; margin-bottom: 20px;}
    .ss5_ul_sub > li span {  font-size: 20px; line-height: 30px;}
    .ss5_ul_sub > li p { font-size: 13px;  line-height: 20px;  padding: 10px 0px;}
    
    #ss5_2 {  padding: 45px 0px 100px;}
    #ss5_2 .ms_inner img { width: 90%; margin: 55px auto 0px; display: block;}
    
    
    .m_title.re p:nth-child(1) { border-left: 0px solid #205280;}
    .m_title.re {  margin-bottom: 55px;}
    
    
    #bo_list { width: 90% !important; margin: 0px auto; display: block;}
    .tab_btn.shop { margin-top: 0px;  padding-top: 110px;}
    
    #ss6 { margin: 60px 0px 100px;}
    #ss6 .ms_inner p:nth-child(1) { font-size: 26px}  
    #ss6 .ms_inner p:nth-child(2) {font-size: 20px; width: 90%; margin: 0px auto; line-height: 28px;}
    #ss6 .ms_inner p:nth-child(2)::after { height: 40px; margin: 0px auto 0px;}
    
    
     #ms1_ul {padding-top: 130px;}
     #ms1_ul2 {padding-top: 130px;}

    #ms1_ul li:nth-child(1) p:nth-child(2) br {display: none;} 
    #ms1_ul li:nth-child(1) p:nth-child(2) {word-break: keep-all;}
    #ms1_ul2 li:nth-child(2) p:nth-child(2) br {display: none;}
    #ms1_ul2 li:nth-child(2) p:nth-child(2) {word-break: keep-all;}
    #ms4_ul > li:nth-child(2) > p {word-break: keep-all; text-align: center;}
    #ms4_ul > li:nth-child(2) > p br {display: none}
    #s3-1_ul1 .ul_a_txt p {word-break: keep-all;}
    #s3-1_ul1 .ul_a_txt p br {display: none}
    .ul_a_txt p.tech_p1 {word-break: keep-all; }
    .ul_a_txt p.tech_p1 br {display: none;}
    
    .m_title_s2 {width: 90%;}
    
    .quote { display: none !important;}
    #main_ani1 {display: none !important;}
    
    
/*    2020/05/06     */
    #header {min-width: initial;}
   .swiper-container {height: auto;} {height: auto;}
    #ms1_1 {height: auto;}
    #ms1_2 {height: auto;}
    #ms2 { height: auto; padding-bottom: 75px;}
    
    /************6/30 J.H****************/
    /*****header******/
    .nav_ul {position: initial; background:#4c4c4c; border-top: none;}
    #nav {padding-top: 35px; padding-bottom: 35px;}
    #nav > li {padding-bottom: 0px;}
    #nav:hover {}
    
    /*****Index*******/
    #ms1_1 {background-image: url(../image/ms1_img1_m.jpg);}
    #ms1_2 {background-image: url(../image/ms1_img2_m.jpg);}
    .ms1_txtbox {left: 10%; top: 45%; max-width: 250px;}
    .ms2_c_box {width:100%;}
    #ms3_ul_txt p:nth-child(4) br {display: none;}
    #ms3_ul_txt img:nth-child(2) {max-width: 225px;}
    .ms3_ul li:nth-child(1) {width: 90%; display: block; margin: 0 auto;}
    .ms3_ul li:nth-child(1) > img {width: 100%; position: inherit; margin-top: 40px;}
    .ms3_ul li:nth-child(2) {width: 90%; display: block; margin: 0 auto;}
    .ms3_ul li:nth-child(2) img {width: 100%; margin-top: 25px;}
    .ms4_ul li {width: 50%; border-right: none;}
    .ms4_ul li:nth-child(1),.ms4_ul li:nth-child(2) {margin-bottom: 40px;}
    .ms4_c_box p:nth-child(4) br {display: none;}
    .ms5_ul {padding: 80px 0;}
    
    /***index-slide***/
    .ms5_ul li {width: 100%; display: block; margin-top: 30px;}
    .ms5_ul_inner {width: 90%;}
    .more_btn2.bl.a2 {margin-top: 25px;}
    .swiper-button-next, .swiper-button-prev {top: 75%;}
    .ms5_ul li:nth-child(2)#ms5_ul_img1 img {width: 50%;}
    .ms5_pro_box p.ms5_p_txt {padding-left: 90px;}
    
    /*******sub 1-1*******/
    /**sub 1-1 nav**/
    .tab_btn ul li {width: 50%; line-height: 35px;}
    .tab_btn {padding: 15px 0;}
    .sub_top_p {word-break: keep-all; font-size: 35px;}
    
    /**sub 1-1 content**/
    #s1s1_s1 p:nth-child(1) {word-break: keep-all;}
    #s1s1_s1 p:nth-child(3) br {display: none;}
    .s1s2_txt {width: 90%; padding: 15px 0px 0px;}
    #s1s3 p {width: 100%; margin: 0 auto; word-break: keep-all;}
    .s1s3_ul {width: 95%;}
    .s1s3_ul li.year_txt p {font-size: 14px;}
    
    
    
    /**sub 1-2 content**/
    .s1_p1 {width: 90%; margin: 0 auto; word-break: keep-all;}
    #s2s1 {padding: 100px 0;}
    .s2s1_ul {margin-bottom: 0;}
    .s2s1_ul li {width: 50%; margin-bottom: 30px; border-left: none;}
    .s2s1_ul li:nth-child(3),.s2s1_ul li:nth-child(4) {margin-bottom: 0;}
    .s2s1_ul li p:nth-child(3) {width: 90%; margin: 0 auto;}
    .s2s1_ul li p br {display: none;}
    
    .s2s3_ul {width: 100%;}
    .s2s3_ul li {width: 100%; padding: 0;}
    .s2s3_ul li:nth-child(2) {border-left: none; margin-top: 60px;}
    .s2s3_ul li p:nth-child(1) {margin-bottom: 20px;}
    
    #s2s3 {padding-bottom: 60px;}
    
    /**sub 1-3 content**/
    #s3s1 {margin: 100px 0px 40px;}
    #s3s1 > img:nth-child(4) {margin: 40px auto 0px;}
    .s3s2_ul li:nth-child(1) {width: 100%;}
    .s3s2_ul li:nth-child(2) {display: block; margin: 0 auto; width: 90%; padding-left: 0;}
    .s3s2_ul li:nth-child(2) p:nth-child(3) {width: 100%;}
    .s3s2_ul li:nth-child(2) p:nth-child(3) br {display: none;}
    #s3s2 {margin-bottom: 100px;}
    #s3s1 > p:nth-child(3) br {display: none;}
    .s3s2_ul li:nth-child(2) {margin-top: 40px;}
    .s3s2_ul li:nth-child(2) p:nth-child(1) {font-size: 30px; line-height: 35px;}
    .s3s2_ul li:nth-child(2) p:nth-child(3) {font-size: 17px;}
    
    /**sub 1-4 content**/
    #s4s1 {margin: 100px 0;}
    .s4s1_ul {margin-top: 60px;}
    .s4s1_ul li:nth-child(1) {width: 100%;}
    .s4s1_ul li:nth-child(2) {width: 90%; padding-left: 0; display: block; margin: 0 auto; margin-top: 60px;}
    .s4s1_ul li:nth-child(2) p:nth-child(3) br {display: none;}
    #s4s1 > img:nth-child(1) {width: 90%;}
    .s4s1_ul li:nth-child(2) p:nth-child(3) {font-size: 17px;}
    #s4s2_inner > p:nth-child(1) {font-size: 30px;}
    .s4s2_ul li {margin-bottom: 25px;}
    .s4s2_ul li.w50 p:nth-child(2) {font-size: 20px;}
    .s4s2_ul li.w50 p:nth-child(3) {font-size: 14px;}
    .s4s2_ul li p:nth-child(2) {width: 90%; font-size: 14px; word-break: keep-all;}
    .s4s2_ul li p:nth-child(3) {width: 90%; font-size: 12px; word-break: keep-all;}
    
    /***********sub 2-1*************/
    #s21s1 {margin: 100px 0px 60px;}
    #s21s2 {margin: 0px 0px 60px;}
    .sub_inner {margin: 50px auto 0px;}
    #s21s3 .sub_inner {padding-top: 100px;}
    
    .s2_ul {width: 90%; margin: 0 auto;}
    .s2_ul li {width: 100%; margin: 20px 0;}
    .s2_ul li.s2_ul_li {display: none;}
    
    #s21s3 {margin: 100px 0px 80px;}
    
    /***********sub 3-1*************/
    .s31s1_txtbox {margin: 0 auto; padding-left: 0px;}
    .s31s1_ul {margin-top: 25px;}
    .s31s1_ul li {width: 90%; display: block; margin-top: 40px; margin: 0 auto;}
    #s31s1 > img:nth-child(1) {max-width: 225px;}
    .s31s1_txtbox p.sub3_p_txt {padding-left: 95px;}.
    .s31s1_ul_img.s3pro1 img {width: 90%; margin-top: 40px;}
    #partner {width: 90%;}
    .s31s1_ul_txt > img:nth-child(2) {max-width: 225px;}
    
    /***********sub 3-2*************/
    .s31s1_ul {margin-top: 25px;}
    .s31s1_ul_img.s3pro2 img {width: 50%; margin-top: 40px;}
    
    /***********board**************/
    .ol_inner {width: 100%; margin: 0 auto;}
    .sir_ol {margin: 0 auto !important; left: 5% !important; top: 80%;}
    #sir_ol label {margin-right: 35%;}
    
    /************footer************/
    #f_inner li:nth-child(1) {display: block; width: 100%; text-align: center; margin-bottom: 25px;}
    #f_inner li:nth-child(2) {display: block; width: 90%; margin: 0 auto;}
    
}