.is-mobile {
  display: none !important;
}
@media (max-width:768px) { 
  .is-desktop {
    display: none !important;
  }
  .is-mobile {
    display: block !important;
  }
}
/*  min-width 1200px */
@media (min-width:1200px) {
  .service_slide .slide_item .desc .info {
    font-size: 19px;
  }
  .service_slide .slide_item .desc .more {
    font-size: 15px;
  }
}
/*  max-width 1200px */
@media (max-width:1200px) {
  .nav .wrap {
    padding: 18px 15px;
  }
  .nav .wrap .company_info {
    width: 16%;
    margin-left: 3%;
  }
  .nav .wrap .company_info a {
    font-size: 15px;
    text-align: center;
    background:  url(../images/download_btn_hover.png) 87% 44% no-repeat;
  }
  .nav .wrap .company_info a:hover {
    background: #4880a1 url(../images/download_btn.png) 87% 44% no-repeat;
  }
}
/* adjust service slide tool */
@media (max-width:960px) {
  .about .wrap .inner .about_txt .txt_wrap {
    width: 100%;    
  }
  .about_txt .txt_wrap .txt1 {
    padding: 25px 0 0 26px;
    font-size: 20px;
  }
  .about_txt .txt_wrap .txt2 {
    margin-top: 12%;
    padding: 25px 27px;
  }
  .service .wrap .section_title {
    left: 20px;
  }
  .service_slide .slick-prev {
    left: 5px;
  }
  .service_slide .slick-next {
    left: 105px;
  }
  .service_slide .slick-dots {
    left: 47px;
  }
}

/* max-width 768px */
@media (max-width:768px) {
  /*----- header area -----*/
  .nav.is-mobile .wrap {
    padding: 12px 10px;
  }
  .nav.is-mobile .wrap .company_info {
    width: 25.3333%;
    margin-left: 0;
  }
  .nav.is-mobile .wrap .company_info a {
    margin-right: auto;
    border: 0;
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
  }
  .nav.is-mobile .wrap .company_info a img {
    max-width: 115px;
    width: 100%;
  }
  .nav.is-mobile .wrap .header_logo {
    width: 61.3333%;
    margin-right: 0;
    text-align: center;
  }
  .nav.is-mobile .wrap .header_logo a {
    width: 60%;
  }
  .nav.is-mobile .wrap .header_logo a img {
    max-width: 148px;
  }
  .nav.is-mobile .wrap .menu_btn {
    width: 13.3333%;
    text-align: right;
  }
  .nav.is-mobile .wrap .menu_btn a {
    max-width: 30px;
    display: inline-block;
  }
  .nav.is-mobile .wrap .menu_btn a img {
  width: 100%;
  display: block;
  }
  .nav.is-mobile .wrap .menu_btn a img.close {
    display: none;
    width: 21px;
  }
  
  /*----- end header area -----*/

  /*----- top visual area -----*/
  .top_visual {
    background: url(../images/m_top_visual.png) center no-repeat;
    background-size: cover;
  }
  .top_visual .wrap .txt_box .title {
    font-size: 8vw;
  }
  .top_visual .wrap .txt_box .sub_title {
    font-size: 4vw;
  }
  #scroll_btn {
    top: 85%;
  }
  /*----- end top visual area -----*/
  
  /*----- main common -----*/
  #main .section_title {
    font-size: 32px;
  }
  /*----- end main common -----*/
  
  /*----- about area -----*/
  .about .wrap {
    padding: 26px 20px 4px;
    overflow: hidden;
  }
  .about .wrap .inner .about_txt {
    width: 100%;
  }
  .about .wrap .inner .about_txt .txt_wrap {
    position: static;
  }
  .about_txt .txt_wrap .section_title {
    padding: 20px 0 10px;
    text-align: center;
  }
  .about_txt .txt_wrap .txt1 {
    padding: 0 0 30px 0;
    text-align: center;
    font-size: 18px;
  }
  .about_txt .txt_wrap .txt1::after {
    left: 48%;
    bottom: -19px;
  }
  .m_about_cont .txt2 {
    background-color: #dcf5ff;
    padding: 5% 10% 5% 5%;
    font-size: 3.2vw;
    line-height: 147%;
    position: relative;
    top: -51px;
    right: -40px;
  }
  .m_about_cont .txt2 br {
    display: none;
  }
  /*----- end about area -----*/
  
  /*----- service area -----*/
  .service .wrap .section_title {
    position: static;
    text-align: center;
  }
  .service .wrap .slide_container {
    padding: 35px 0;
  }
  .service_slide .slide_item .flex_box {
    display: block;
    padding: 0 15px;
  }
  .service_slide .slide_item .flex_box .img_wrap {
    width: 100%;
  }
  .service_slide .slide_item .flex_box .desc {
    width: 100%;
    padding: 20px 0;
    background-color: #fff;
    text-align: center;
  }
  .service_slide .slide_item .desc .type {
    padding-top: 0;
    font-size: 6vw;
  }
  .service_slide .slide_item .desc .icon {
    display: none;
  }
  .service_slide .slide_item .desc .info {
    font-size: 4.3vw;
    line-height: 133%
  }
  .service_slide .slide_item .desc .more {
    font-size: 3.8vw;
    padding: 4% 11%;
    margin-top: 5%;
  }
  .service_slide .slide_item .desc .type::before {
    display: none;
  }
  /*----- end service area -----*/

  /*----- solution area -----*/
  .solution .wrap {
    padding: 50px 0;
  }
  .solution .wrap .solution_list.is-mobile {
    margin: 20px 0 0;
  }
  .solution .wrap .solution_list.is-mobile li {
    margin: 5px 0;
  }
  .solution .wrap .solution_list.is-mobile li a {
    display: block;
    cursor: pointer;
  }
  .solution .wrap .solution_list.is-mobile li img {
    vertical-align: bottom;
  }
  /*----- end solution area -----*/
  
  /*----- history area -----*/
  .history .wrap .inner {
    background: url(../images/history/m_history_visual.png) center no-repeat;
    background-size: cover;
  }
  .history .wrap .history_visual {
    display: none;
  }
  .history .wrap .slide_container {
    width: 100%;
    background: none;
  }
  .history .wrap .section_title.is-mobile {
    text-align: center;
    padding-bottom: 25px;
  }
  .history .wrap .slide_container .slide_wrap {
    padding: 0 35px;
  }
  .history_list {
    padding: 0;
  }
  .history_item {
    padding: 3% 10px 3% 35px;  
    outline: none;
    min-height: auto;
  }
  .history_item:nth-child(2) {
    padding: 3% 10px 3% 35px;  
    outline: none;
  }
  .history_item:nth-child(3) {
    padding: 3% 0 3% 35px;  
    outline: none;
  }
  .history_item::after {
    display: none;
  }
  .history_item .year {
    padding-top: 13px;
  }
  .history_item .year::after {
    top: 21px;
    left: -16px;
  }
  .history_list .slick-arrow {
    top: 42%;
    padding: 15px 20px;
  }
  .history_list .slick-prev {
    left: -26px;
    background: url(../images/history/left.png) center no-repeat;
    background-size: 33px;    
} 
  .history_list .slick-next {
    bottom: auto;
    left: auto;
    right: -26px;
    background: url(../images/history/right.png) center no-repeat;
    background-size: 33px;
}
  /*----- end history area -----*/

  /*----- client area -----*/
  .client .wrap .slide_container {
    padding: 15px 20px;
  }
  .clients ul li img {
    max-width: 95px;
    padding: 15px 0;
  }
  /*----- end client area -----*/

  /*----- contact area -----*/
  .contact .wrap .section_title.is-mobile {
    text-align: center;
    padding-bottom: 25px;
  }
  .contact_info {
    padding: 10px 30px 30px 30px;
    position: static;
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    box-shadow: none;
    background-color: #f8f8f8;
    transform: translate(0,0)  ;
    -webkit-transform: translate(0,0)  ;
    -moz-transform: translate(0,0)  ;
    -ms-transform: translate(0,0)  ;
    -o-transform: translate(0,0)  ;
}
  .contact_info p {
    padding-left: 58px;
    margin-top: 24px;
  }
  .contact_info p span:first-child {
    font-size: 17px;
    font-weight: 500;
    padding-bottom: 6px;
  }
  .contact_info p span:last-child {
    color: #000;
    font-size: 17px;
    font-weight: bold;
  }
  .contact_info p.tel {
    background: url(../images/contact/m_tel_icon.png) left center no-repeat;
    background-size: 45px;
  }

  .contact_info p.address {
    background: url(../images/contact/m_address_icon.png) left center no-repeat;
    background-size: 45px;
  }

  .contact_info p.fax {
    background: url(../images/contact/m_fax_icon.png) left center no-repeat;
    background-size: 45px;
  }
   
  #map {
    height: 40vh;
  }
  /*----- end contact area -----*/

  /* mobile menu bar */
  #dim {
    position: fixed;
    top:0;
    right: -100%;
    bottom: 0;
    width: 100%;
    background: rgba(0,0,0,0.8);
    z-index: 7777;
  }
  #m_menu_list {
    position: fixed;
    top: 52px;
    bottom: 0;
    right: -290px;
    max-width: 290px;
    width: 75%;
    background: #fff;
    z-index: 8888;
  }
  #m_menu_list ul {
    padding: 20px 0 0 30px;
  }
  #m_menu_list ul li {
    padding: 10px 0;
  }
  #m_menu_list ul li a {
    display: block;
    text-transform: uppercase;
    font-size: 20px;
  }
  #m_menu_list ul li a.active {
    color: #2a7ca8;
    font-weight: bold;
    text-decoration: underline;
  }
  .btn_top.on {
    right: 10px;
    bottom: 60px !important;
    opacity: 1;
  }
  #popups {
    width: 90%;
    height: 75%;
    padding: 25px 15px;
  }
  #popups_bg .pop_close {
    position: fixed;
    top: 7%;
    right: 5%;
  }
  #popups_bg .pop_close img {
    max-width: 25px;
  }
  #popups_bg2 .pop_close {
    position: fixed;
    top: 2.5%;
    right: 5%;
  }
  #popups_bg2 .pop_close img {
    max-width: 25px;
  }
  
  #popups2 {
    width: 90%;
    padding: 45px 15px;
  }
  #popups2 .tab_list a {
    font-size: 14px;
    padding: 12px 0;
  }
  #popups2 .main_tit {
    padding: 10px 0 15px;
  }
  #popups2 .tab_cont .cont {
    padding-top: 39px;
  }
}

@media (max-width:378px) {
  .m_about_cont .txt2 {
    font-size: 14px;
  }
}