@media screen and (min-width:1201px) {  

#topBanner{position: relative; width: 100%; overflow: hidden; margin-top: -100px;}
#topBanner .topBanner_image img {width: 100%;}
#topBanner .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
#topBanner .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
#topBanner .topBanner_inner .topBanner_wrap .textArea {position: absolute; top: 50%; transform: translateY(-30%);left: 18%;}
#topBanner .topBanner_inner .topBanner_wrap .textArea h2 {color: #fff;
font-size: 50px;font-weight: bold; margin-bottom: 40px; }
#topBanner .topBanner_inner .topBanner_wrap .textArea p {color: #fff ;font-size: 20px;}

#topBannerM {display: none;}
#topBanner2M {display: none;}

#topBanner2{position: relative; width: 100%; overflow: hidden;}
#topBanner2 .topBanner_image img {width: 100%;}
#topBanner2 .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
#topBanner2 .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
#topBanner2 .topBanner_inner .topBanner_wrap .textArea {position: absolute; top: 50%; transform: translateY(-50%); left: 18%;}
#topBanner2 .topBanner_inner .topBanner_wrap .textArea .img_box img{width: 100%; height:auto; max-width: 1000px;}
#topBanner2 .topBanner_inner .topBanner_wrap .textArea .text_new{background-color: #000; width: 85px; height: 25px; color: #fff; font-weight: 700; font-size: 0.9em;text-align: center; line-height: 23px; margin: 24px 0 24px 0;}
#topBanner2 .topBanner_inner .topBanner_wrap .textArea h4 {
font-size: 1.2em; margin-bottom: 24px;}
#topBanner2 .topBanner_inner .topBanner_wrap .textArea p {color: #666666 ;font-size: 1.2em; margin-bottom: 60px;}

#topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2 {
    width: 180px;
    height: 60px;
    background-color: #79B928;
    text-align: center;
    transition-duration: 0.5s;
  }
#topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2 a{
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    line-height: 57px;
    transition-duration: 0.5s;
  }
  
#topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover {
    border: 1px solid #79B928;
    background-color: #fff;
  }
  
#topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover a{
    color: #000;
  }

#product {position: relative; width: 100%; background-color: #F8FAFB;}
#product .product_wrap {max-width: 1252px; margin: 0 auto; padding-top: 100px;}
#product h2{ font-size: 2.67em; font-weight: 700; text-align: center;}
#product .product_wrap .product_list {display: flex; justify-content: space-between; margin-top: 80px; padding-bottom: 100px; flex-wrap: wrap;}
#product .product_wrap .product_list li{position: relative; width: 48.5%; background-color: #fff; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); margin-bottom: 100px;}
#product .product_wrap .product_list li div:first-child img{ width: 100%;}
#product .product_wrap .product_list li .product_text_wrap{background-color: #fff;}
#product .product_wrap .product_list li .product_text_wrap .product_text_top {background-color: #fff; margin: 24px 24px 0px 24px;}
#product .product_wrap .product_list li .product_text_top h4{font-size: 1.33em;  margin-bottom: 10px; font-weight: 700;}
#product .product_wrap .product_list li .product_text_top p{font-size: 0.9em;  color: #666; border-bottom: 1px solid #D9D9D9; padding-bottom: 24px;}

#product .product_wrap .product_list li .product_text_wrap .product_text_bottom {background-color: #fff; margin: 24px 24px 40px 24px;}
#product .product_wrap .product_list li .product_text_bottom h4{font-size: 1.33em; font-weight: 700;}
#product .product_wrap .product_list li .product_text_bottom p{font-size: 0.9em;  color: #666;}
#product .product_wrap .product_list li .product_text_bottom p.margin{margin-bottom: 24px;}

#product .product_wrap .product_list li .product_buy a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 64px;line-height: 64px;font-size: 0.9em; color: #fff; background-color: #79B928; transition: 0.5s;}
#product .product_wrap .product_list li .product_buy a:hover {background-color: #fff; border: 1px solid #79B928; color: #000; font-weight: 700;}

/* .product_buy a:before {content: "";position: absolute; z-index: 1; top: 0;
left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
}

.product_buy a:hover:before, .product_buy a:focus:before, .product_buy a:active:before {transform: scale(2);} */

#product .product_wrap .product_list li .product_more a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 64px;line-height: 64px;font-size: 0.9em; background-color: #fff; transition: 0.5s; text-decoration: underline; text-underline-position:under;}

#product .product_wrap .product_list li .product_more a:hover {color: #79B928;font-weight: 700;}

/* .product_more a:before {content: "";position: absolute; z-index: 1; top: 0;
left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
}

.product_more a:hover:before, .product_more a:focus:before, .product_more a:active:before {transform: scale(2);} */


#tech {position: relative; width: 100%; background-color: #000;}
#tech .tech_wrap {max-width: 1252px; margin: 0 auto; padding-top: 100px;}
#tech .tech_wrap h2{ font-size: 2.67em; font-weight: 700; text-align: center; color: #fff;}
#tech .img_wrap {overflow: hidden;  border: 1px solid #666666;}
#tech .img_wrap img {width: 100%; transition: 0.3s ease-in-out;}
#tech .img_wrap:hover img{transform: scale(1.3);}
#tech>.tech_wrap>p{ font-size: 1em; font-weight: 400; text-align: center; color: #fff; margin-top: 24px;}
#tech .tech_wrap .tech_list {display: flex; margin-top: 80px; padding-bottom: 100px; flex-wrap: wrap; justify-content: center;}
#tech .tech_wrap .tech_list .tech_item{position: relative; width: 32%;  margin-bottom: 100px; margin-right: 2%;}
#tech .tech_wrap .tech_list .tech_item2{position: relative; width: 31.78%; }
#tech .tech_wrap .tech_list li .text_wrap h4{color: #fff; font-size: 1em; font-weight: 700;margin-top: 24px;}
#tech .tech_wrap .tech_list li .text_wrap p{color: #fff; font-size: 0.9em; font-weight: 400;margin-top: 14px;}

.padding {padding-top: 100px;}



#contents {position: relative; width: 100%; background-color: #F8FAFB;}
#contents .contents_wrap {max-width: 1252px; margin: 0 auto; padding-top: 100px; display: flex; flex-wrap: wrap; justify-content: space-between;}
#contents .contents_wrap .accessory {width: 100%; margin: 0 auto; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative; margin-bottom: 48px;}
#contents .contents_wrap .accessory2 {width: 48%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;}
#contents .contents_wrap .accessory3 {width: 48%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;}
#contents .contents_wrap .accessory3 .accessory_img {width: 163px; margin: 0 auto; margin-top: 60px;}
#contents .contents_wrap .accessory_img img{width: 100%;}
#contents .contents_wrap .accessory .textArea {position: absolute; top: 28%; left: 50%; transform: translate(-50%, -50%); text-align: center;}
#contents .contents_wrap .accessory2 .textArea {position: absolute; top: 25%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 80%;}
#contents .contents_wrap .accessory3 .textArea {position: relative; text-align: center; width: 80%; margin: 0 auto;}
#contents .contents_wrap .accessory3 .textArea p{font-size: 1em; font-weight: 400; color: #666666; margin: 24px 0 48px 0;}

#contents .contents_wrap .textArea h2 {font-size: 48px; font-weight: 700;}
#contents .contents_wrap .textArea p {font-size: 1em; font-weight: 400; color: #666666; margin: 24px 0 24px 0;}
#contents .contents_wrap .textArea a {font-size: 0.9em; font-weight: 700; color: #79B928; position: relative;}
#contents .contents_wrap .textArea a span{position: absolute; display: inline-block; margin-top: 4px;}
#contents .contents_wrap .textArea a:hover {text-decoration: underline; text-decoration-color: #79B928;}
#contents .contents_wrap .textArea a:hover span{animation: green 0.7s ease-in-out infinite;}

#contents .contents_wrap .accessory3 .appstore {display: flex; width: 100%; justify-content: center;}
#contents .contents_wrap .accessory3 .appstore a {width: 150px;}
#contents .contents_wrap .accessory3 .appstore a img{width: 100%;}
#contents .contents_wrap .accessory3 .app {position: absolute; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%);}
#contents .contents_wrap .accessory3 .app img {width: 100%;}

#contents .support {max-width: 1252px; margin: 0 auto; text-align: center;}
#contents .support h2{font-size: 48px; font-weight: 700; margin-top: 100px; margin-bottom: 70px;}
#contents .support_list {width: 100%; margin: 0 auto; display: flex; justify-content: space-between; padding-bottom: 100px;}
#contents .support_list li{width: 23%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;  text-align: center; padding: 14px 0 14px 0;}
#contents .support_list li img {width: 40px; margin: 0 auto;}
#contents .support_list li p {font-size: 20px; text-decoration: underline; text-decoration-thickness : 1px;}

}










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

  #topBanner{position: relative; width: 100%; overflow: hidden; margin-top: -100px;}
  #topBanner .topBanner_image img {width: 100%;}
  #topBanner .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
  #topBanner .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
  #topBanner .topBanner_inner .topBanner_wrap .textArea {position: absolute; top: 50%; transform: translateY(-30%);left: 18%;}
  #topBanner .topBanner_inner .topBanner_wrap .textArea h2 {color: #fff;
  font-size: 48px;font-weight: bold; margin-bottom: 40px; }
  #topBanner .topBanner_inner .topBanner_wrap .textArea p {color: #fff ;font-size: 18px;}
  
  #topBannerM {display: none;}
  #topBanner2M {display: none;}

  #topBanner2{position: relative; width: 100%; overflow: hidden;}
  #topBanner2 .topBanner_image img {width: 100%;}
  #topBanner2 .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
  #topBanner2 .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea {position: absolute; top: 50%; transform: translateY(-50%); left: 18%;}
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea .img_box img{width: 300px; height:auto; max-width: 1000px;}
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea .text_new{background-color: #000; width: 85px; height: 25px; color: #fff; font-weight: 700; font-size: 0.9em;text-align: center; line-height: 23px; margin: 24px 0 24px 0;}
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea h4 {
  font-size: 1em; margin-bottom: 24px;}
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea p {color: #666666 ;font-size: 1em; margin-bottom: 40px;}
  
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2 {
      width: 160px;
      height: 50px;
      background-color: #79B928;
      text-align: center;
      transition-duration: 0.5s;
    }
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2 a{
      font-size: 14px;
      font-weight: 700;
      color: #fff;
      line-height: 48px;
      transition-duration: 0.5s;
    }
    
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover {
      border: 1px solid #79B928;
      background-color: #fff;
    }
    
  #topBanner2 .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover a{
      color: #000;
    }
  
  #product {position: relative; width: 100%; background-color: #F8FAFB;}
  #product .product_wrap {width: 90%; margin: 0 auto; padding-top: 100px;}
  #product h2{ font-size: 2.47em; font-weight: 700; text-align: center;}
  #product .product_wrap .product_list {display: flex; justify-content: space-between; margin-top: 80px; padding-bottom: 100px; flex-wrap: wrap;}
  #product .product_wrap .product_list li{position: relative; width: 47.5%; background-color: #fff; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); margin-bottom: 100px;}
  #product .product_wrap .product_list li:last-child{left: 0;}
  #product .product_wrap .product_list li div:first-child img{ width: 100%;}
  #product .product_wrap .product_list li .product_text_wrap{background-color: #fff;}
  #product .product_wrap .product_list li .product_text_wrap .product_text_top {background-color: #fff; margin: 24px 24px 0px 24px;}
  #product .product_wrap .product_list li .product_text_top h4{font-size: 1.33em;  margin-bottom: 10px; font-weight: 700;}
  #product .product_wrap .product_list li .product_text_top p{font-size: 0.9em;  color: #666; border-bottom: 1px solid #D9D9D9; padding-bottom: 24px;}
  
  #product .product_wrap .product_list li .product_text_wrap .product_text_bottom {background-color: #fff; margin: 24px 24px 40px 24px;}
  #product .product_wrap .product_list li .product_text_bottom h4{font-size: 1.33em; font-weight: 700;}
  #product .product_wrap .product_list li .product_text_bottom p{font-size: 0.9em;  color: #666;}
  #product .product_wrap .product_list li .product_text_bottom p.margin{margin-bottom: 24px;}
  
  #product .product_wrap .product_list li .product_buy a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 64px;line-height: 64px;font-size: 0.9em; color: #fff; background-color: #79B928; transition: 0.5s;}
  #product .product_wrap .product_list li .product_buy a:hover {background-color: #fff; border: 1px solid #79B928; color: #000; font-weight: 700;}
  
  /* .product_buy a:before {content: "";position: absolute; z-index: 1; top: 0;
  left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
  }
  
  .product_buy a:hover:before, .product_buy a:focus:before, .product_buy a:active:before {transform: scale(2);} */
  
  #product .product_wrap .product_list li .product_more a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 64px;line-height: 64px;font-size: 0.9em; background-color: #fff; transition: 0.5s; text-decoration: underline; text-underline-position:under;}
  
  #product .product_wrap .product_list li .product_more a:hover {color: #79B928;font-weight: 700;}
  
  /* .product_more a:before {content: "";position: absolute; z-index: 1; top: 0;
  left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
  }
  
  .product_more a:hover:before, .product_more a:focus:before, .product_more a:active:before {transform: scale(2);} */
  
  
  #tech {position: relative; width: 100%; background-color: #000;}
  #tech .tech_wrap {max-width: 90%; margin: 0 auto; padding-top: 100px;}
  #tech .tech_wrap h2{ font-size: 2.47em; font-weight: 700; text-align: center; color: #fff;}
  #tech .img_wrap {overflow: hidden;  border: 1px solid #666666;}
  #tech .img_wrap img {width: 100%; transition: 0.3s ease-in-out;}
  #tech .img_wrap:hover img{transform: scale(1.3);}
  #tech>.tech_wrap>p{ font-size: 0.9em; font-weight: 400; text-align: center; color: #fff; margin-top: 24px;}
  #tech .tech_wrap .tech_list {display: flex; margin-top: 80px; padding-bottom: 100px; flex-wrap: wrap; justify-content: center;}
  #tech .tech_wrap .tech_list .tech_item{position: relative; width: 32%;  margin-bottom: 100px; margin-right: 2%;}
  #tech .tech_wrap .tech_list .tech_item2{position: relative; width: 31.78%; }
  #tech .tech_wrap .tech_list li .text_wrap h4{color: #fff; font-size: 0,9em; font-weight: 700;margin-top: 24px;}
  #tech .tech_wrap .tech_list li .text_wrap p{color: #fff; font-size: 0.8em; font-weight: 400;margin-top: 14px;}
  
  .padding {padding-top: 100px;}
  
  
  
  #contents {position: relative; width: 100%; background-color: #F8FAFB;}
  #contents .contents_wrap {width: 90%; margin: 0 auto; padding-top: 100px; display: flex; flex-wrap: wrap; justify-content: space-between;}
  #contents .contents_wrap .accessory {width: 100%; margin: 0 auto; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative; margin-bottom: 48px;}
  #contents .contents_wrap .accessory2 {width: 48%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;}
  #contents .contents_wrap .accessory3 {width: 48%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;}
  #contents .contents_wrap .accessory_img img{width: 100%;}
  #contents .contents_wrap .accessory .textArea {position: absolute; top: 28%; left: 50%; transform: translate(-50%, -50%); text-align: center;}
  #contents .contents_wrap .accessory2 .textArea {position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 80%;}
  #contents .contents_wrap .accessory3 .textArea {position: relative; text-align: center; width: 90%; margin: 0 auto;}
  #contents .contents_wrap .accessory3 .textArea p{font-size: 0.9em; font-weight: 400; color: #666666; margin: 24px 0 48px 0;}
  
  #contents .contents_wrap .textArea h2 {font-size: 40px; font-weight: 700;}
  #contents .contents_wrap .textArea p {font-size: 0.9em; font-weight: 400; color: #666666; margin: 24px 0 24px 0;}
  #contents .contents_wrap .textArea a {font-size: 0.8em; font-weight: 700; color: #79B928; position: relative;}
  #contents .contents_wrap .textArea a span{position: absolute; display: inline-block; margin-top: 4px;}
  #contents .contents_wrap .textArea a:hover {text-decoration: underline; text-decoration-color: #79B928;}
  #contents .contents_wrap .textArea a:hover span{animation: green 0.7s ease-in-out infinite;}

  #contents .contents_wrap .accessory3 .accessory_img {width: 123px; margin: 0 auto; margin-top: 60px;}
  #contents .contents_wrap .accessory3 .appstore {display: flex; width: 100%; justify-content: center;}
  #contents .contents_wrap .accessory3 .appstore a {width: 130px;}
  #contents .contents_wrap .accessory3 .appstore a img{width: 100%;}
  #contents .contents_wrap .accessory3 .app {position: absolute; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%);}
  #contents .contents_wrap .accessory3 .app img {width: 90%;}
  
  #contents .support {max-width: 1252px; margin: 0 auto; text-align: center;}
  #contents .support h2{font-size: 2.47em; font-weight: 700; margin-top: 100px; margin-bottom: 70px;}
  #contents .support_list {width: 100%; margin: 0 auto; display: flex; justify-content: space-around; padding-bottom: 100px;}
  #contents .support_list li{width: 23%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;  text-align: center; padding: 14px 0 14px 0;}
  #contents .support_list li img {width: 30px; margin: 0 auto;}
  #contents .support_list li p {font-size: 18px; text-decoration: underline; text-decoration-thickness : 1px;}
}










@media screen and (min-width:601px) and (max-width:900px) {

  #topBannerM{position: relative; width: 100%; overflow: hidden; margin-top: -100px;}
  #topBannerM .topBanner_image img {width: 100%;}
  #topBannerM .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
  #topBannerM .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
  #topBannerM .topBanner_inner .topBanner_wrap .textArea {position: absolute; bottom: 0;  left: 10%; margin-bottom: 60px;}
  #topBannerM .topBanner_inner .topBanner_wrap .textArea h2 {color: #fff;
  font-size: 5vw;font-weight: bold; margin-bottom: 25px; }
  #topBannerM .topBanner_inner .topBanner_wrap .textArea p {color: #fff ;font-size: 2vw;}
  

  #topBanner {display: none;}
  #topBanner2 {display: none;}


  #topBanner2M{position: relative; width: 100%; overflow: hidden;}
  #topBanner2M .topBanner_image img {width: 100%;}
  #topBanner2M .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
  #topBanner2M .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea {position: absolute; top: 50%; transform: translateY(-50%); left: 10%;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .img_box img{width: 300px; height:auto; max-width: 1000px;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .text_new{background-color: #000; width: 85px; height: 25px; color: #fff; font-weight: 700; font-size: 0.9em;text-align: center; line-height: 23px; margin: 24px 0 24px 0;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea h4 {
  font-size: 0.9em; margin-bottom: 24px;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea p {color: #666666 ;font-size: 0.9em; margin-bottom: 40px;}
  
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2 {
      width: 160px;
      height: 50px;
      background-color: #79B928;
      text-align: center;
      transition-duration: 0.5s;
    }
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2 a{
      font-size: 14px;
      font-weight: 700;
      color: #fff;
      line-height: 48px;
      transition-duration: 0.5s;
    }
    
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover {
      border: 1px solid #79B928;
      background-color: #fff;
    }
    
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover a{
      color: #000;
    }
  
  #product {position: relative; width: 100%; background-color: #F8FAFB;}
  #product .product_wrap {width: 90%; margin: 0 auto; padding-top: 100px;}
  #product h2{ font-size: 2.47em; font-weight: 700; text-align: center;}
  #product .product_wrap .product_list {display: flex; justify-content: space-between; margin-top: 80px; padding-bottom: 100px; flex-wrap: wrap;}
  #product .product_wrap .product_list li{position: relative; width: 100%; background-color: #fff; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); margin-bottom: 100px;}
  #product .product_wrap .product_list li:last-child{left: 0;}
  #product .product_wrap .product_list li div:first-child img{ width: 100%;}
  #product .product_wrap .product_list li .product_text_wrap{background-color: #fff;}
  #product .product_wrap .product_list li .product_text_wrap .product_text_top {background-color: #fff; margin: 24px 24px 0px 24px;}
  #product .product_wrap .product_list li .product_text_top h4{font-size: 1.33em;  margin-bottom: 10px; font-weight: 700;}
  #product .product_wrap .product_list li .product_text_top p{font-size: 0.9em;  color: #666; border-bottom: 1px solid #D9D9D9; padding-bottom: 24px;}
  
  #product .product_wrap .product_list li .product_text_wrap .product_text_bottom {background-color: #fff; margin: 24px 24px 40px 24px;}
  #product .product_wrap .product_list li .product_text_bottom h4{font-size: 1.33em; font-weight: 700;}
  #product .product_wrap .product_list li .product_text_bottom p{font-size: 0.9em;  color: #666;}
  #product .product_wrap .product_list li .product_text_bottom p.margin{margin-bottom: 24px;}
  
  #product .product_wrap .product_list li .product_buy a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 64px;line-height: 64px;font-size: 0.9em; color: #fff; background-color: #79B928; transition: 0.5s;}
  #product .product_wrap .product_list li .product_buy a:hover {background-color: #fff; border: 1px solid #79B928; color: #000; font-weight: 700;}
  
  /* .product_buy a:before {content: "";position: absolute; z-index: 1; top: 0;
  left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
  }
  
  .product_buy a:hover:before, .product_buy a:focus:before, .product_buy a:active:before {transform: scale(2);} */
  
  #product .product_wrap .product_list li .product_more a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 64px;line-height: 64px;font-size: 0.9em; background-color: #fff; transition: 0.5s; text-decoration: underline; text-underline-position:under;}
  
  #product .product_wrap .product_list li .product_more a:hover {color: #79B928;font-weight: 700;}
  
  /* .product_more a:before {content: "";position: absolute; z-index: 1; top: 0;
  left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
  }
  
  .product_more a:hover:before, .product_more a:focus:before, .product_more a:active:before {transform: scale(2);} */
  
  
  #tech {position: relative; width: 100%; background-color: #000;}
  #tech .tech_wrap {max-width: 90%; margin: 0 auto; padding-top: 100px;}
  #tech .tech_wrap h2{ font-size: 2.47em; font-weight: 700; text-align: center; color: #fff;}
  #tech .img_wrap {overflow: hidden;  border: 1px solid #666666;}
  #tech .img_wrap img {width: 100%; transition: 0.3s ease-in-out;}
  #tech .img_wrap:hover img{transform: scale(1.3);}
  #tech>.tech_wrap>p{ font-size: 0.9em; font-weight: 400; text-align: center; color: #fff; margin-top: 24px;}
  #tech .tech_wrap .tech_list {display: flex; margin-top: 80px; padding-bottom: 100px; flex-wrap: wrap; justify-content:space-between}
  #tech .tech_wrap .tech_list .tech_item{position: relative; width: 48%;  margin-bottom: 100px;}
  #tech .tech_wrap .tech_list .tech_item2{position: relative; width: 48%; }
  #tech .tech_wrap .tech_list li .text_wrap h4{color: #fff; font-size: 0,9em; font-weight: 700;margin-top: 24px;}
  #tech .tech_wrap .tech_list li .text_wrap p{color: #fff; font-size: 0.8em; font-weight: 400;margin-top: 14px;}
  
  .padding {padding-top: 100px;}
  
  
  #contents {position: relative; width: 100%; background-color: #F8FAFB;}
  #contents .contents_wrap {width: 90%; margin: 0 auto; padding-top: 100px; display: flex; flex-wrap: wrap; justify-content: space-between;}
  #contents .contents_wrap .accessory {width: 100%; margin: 0 auto; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative; margin-bottom: 44px;}
  #contents .contents_wrap .accessory2 {width: 48%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative; height: 430px;}
  #contents .contents_wrap .accessory3 {width: 48%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;}
  #contents .contents_wrap .accessory_img img{width: 100%;}
  #contents .contents_wrap .accessory .textArea {position: absolute; top: 32%; left: 50%; transform: translate(-50%, -50%); text-align: center;}
  #contents .contents_wrap .accessory2 .textArea {position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 80%;}
  #contents .contents_wrap .accessory3 .textArea {position: relative; text-align: center; width: 90%; margin: 0 auto;}
  #contents .contents_wrap .accessory3 .textArea p{font-size: 0.8em; font-weight: 400; color: #666666; margin: 24px 0 48px 0;}

  #contents .contents_wrap .textArea h2 {font-size: 32px; font-weight: 700;}
  #contents .contents_wrap .textArea p {font-size: 0.9em; font-weight: 400; color: #666666; margin: 24px 0 24px 0;}
  #contents .contents_wrap .textArea a {font-size: 0.8em; font-weight: 700; color: #79B928; position: relative;}
  #contents .contents_wrap .textArea a span{position: absolute; display: inline-block; margin-top: 5px;}
  #contents .contents_wrap .textArea a:hover {text-decoration: underline; text-decoration-color: #79B928;}
  #contents .contents_wrap .textArea a:hover span{animation: green 0.7s ease-in-out infinite;}

  #contents .contents_wrap .accessory2 .accessory_img {position: absolute; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%); width: 100%;}
  #contents .contents_wrap .accessory2 .accessory_img img {width: 100%;}
  #contents .contents_wrap .accessory3 .accessory_img {width: 123px; margin: 0 auto; margin-top: 40px;}
  #contents .contents_wrap .accessory3 .appstore {display: flex; width: 70%; margin: 0 auto;}
  #contents .contents_wrap .accessory3 .appstore a img{width: 100%;}
  #contents .contents_wrap .accessory3 .app {position: absolute; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%); width: 50%;}
  #contents .contents_wrap .accessory3 .app img {width: 100%;}
  
  #contents .support {max-width: 90%; margin: 0 auto; text-align: center;}
  #contents .support h2{font-size: 2.47em; font-weight: 700; margin-top: 100px; margin-bottom: 70px;}
  #contents .support_list {width: 100%; margin: 0 auto; display: flex; justify-content: space-around; padding-bottom: 100px;}
  #contents .support_list li{width: 23%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;  text-align: center; padding: 14px 0 14px 0;}
  #contents .support_list li img {width: 30px; margin: 0 auto;}
  #contents .support_list li p {font-size: 16px; text-decoration: underline; text-decoration-thickness : 1px;}




}

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

  #topBannerM{position: relative; width: 100%; overflow: hidden; margin-top: -100px;}
  #topBannerM .topBanner_image img {width: 100%;}
  #topBannerM .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
  #topBannerM .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
  #topBannerM .topBanner_inner .topBanner_wrap .textArea {position: absolute; bottom: 0;  left: 10%; margin-bottom: 60px;}
  #topBannerM .topBanner_inner .topBanner_wrap .textArea h2 {color: #fff;
  font-size: 30px;font-weight: bold; margin-bottom: 25px; }
  #topBannerM .topBanner_inner .topBanner_wrap .textArea p {color: #fff ;font-size: 15px;}
  

  #topBanner {display: none;}
  #topBanner2 {display: none;}


  #topBanner2M{position: relative; width: 100%; overflow: hidden;}
  #topBanner2M .topBanner_image img {width: 100%;}
  #topBanner2M .topBanner_inner {position: absolute; top: 0; width: 100%; height: 100%;}
  #topBanner2M .topBanner_inner .topBanner_wrap { position: relative; width: 100%; margin: 0 auto; height: 100%;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea {position: absolute; top: 50%; transform: translateY(-50%); left: 10%;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .img_box img{width: 180px; height:auto; max-width: 1000px;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .text_new{background-color: #000; width: 60px; height: 18px; color: #fff; font-weight: 700; font-size: 10px;text-align: center; line-height: 18px; margin: 24px 0 24px 0;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea h4 {
  font-size: 15px; margin-bottom: 24px;}
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea p {color: #666666 ;font-size: 15px; margin-bottom: 40px; display: none;}
  
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2 {
      width: 130px;
      height: 40px;
      background-color: #79B928;
      text-align: center;
      transition-duration: 0.5s;
    }
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2 a{
      font-size: 12px;
      font-weight: 700;
      color: #fff;
      line-height: 38px;
      transition-duration: 0.5s;
    }
    
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover {
      border: 1px solid #79B928;
      background-color: #fff;
    }
    
  #topBanner2M .topBanner_inner .topBanner_wrap .textArea .more_btn2:hover a{
      color: #000;
    }
  
  #product {position: relative; width: 100%; background-color: #F8FAFB;}
  #product .product_wrap {width: 90%; margin: 0 auto; padding-top: 100px;}
  #product h2{ font-size: 30px; font-weight: 700; text-align: center;}
  #product .product_wrap .product_list {display: flex; justify-content: space-between; margin-top: 80px; padding-bottom: 100px; flex-wrap: wrap;}
  #product .product_wrap .product_list li{position: relative; width: 100%; background-color: #fff; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); margin-bottom: 100px;}
  #product .product_wrap .product_list li:last-child{left: 0;}
  #product .product_wrap .product_list li div:first-child img{ width: 100%;}
  #product .product_wrap .product_list li .product_text_wrap{background-color: #fff;}
  #product .product_wrap .product_list li .product_text_wrap .product_text_top {background-color: #fff; margin: 20px 20px 0px 20px;}
  #product .product_wrap .product_list li .product_text_top h4{font-size: 22px;  margin-bottom: 10px; font-weight: 700;}
  #product .product_wrap .product_list li .product_text_top p{font-size: 15px;  color: #666; border-bottom: 1px solid #D9D9D9; padding-bottom: 24px;}
  
  #product .product_wrap .product_list li .product_text_wrap .product_text_bottom {background-color: #fff; margin: 20px 20px 30px 20px;}
  #product .product_wrap .product_list li .product_text_bottom h4{font-size: 20px; font-weight: 700;}
  #product .product_wrap .product_list li .product_text_bottom p{font-size: 15px;  color: #666;}
  #product .product_wrap .product_list li .product_text_bottom p.margin{margin-bottom: 24px;}
  
  #product .product_wrap .product_list li .product_buy a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 55px;line-height: 53px;font-size: 16px; color: #fff; background-color: #79B928; transition: 0.5s;}
  #product .product_wrap .product_list li .product_buy a:hover {background-color: #fff; border: 1px solid #79B928; color: #000; font-weight: 700;}
  
  /* .product_buy a:before {content: "";position: absolute; z-index: 1; top: 0;
  left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
  }
  
  .product_buy a:hover:before, .product_buy a:focus:before, .product_buy a:active:before {transform: scale(2);} */
  
  #product .product_wrap .product_list li .product_more a{ display: block; position: relative; overflow: hidden; text-align: center;width: 100%;height: 55px;line-height: 53px;font-size: 16px; background-color: #fff; transition: 0.5s; text-decoration: underline; text-underline-position:under;}
  
  #product .product_wrap .product_list li .product_more a:hover {color: #79B928;font-weight: 700;}
  
  /* .product_more a:before {content: "";position: absolute; z-index: 1; top: 0;
  left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.2); transform: scale(0); transition-property: transform; transition-duration: 0.5s; transition-timing-function: ease-out;
  }
  
  .product_more a:hover:before, .product_more a:focus:before, .product_more a:active:before {transform: scale(2);} */
  
  
  #tech {position: relative; width: 100%; background-color: #000;}
  #tech .tech_wrap {max-width: 90%; margin: 0 auto; padding-top: 60px;}
  #tech .tech_wrap h2{ font-size: 30px; font-weight: 700; text-align: center; color: #fff;}
  #tech .img_wrap {overflow: hidden;  border: 1px solid #666666;}
  #tech .img_wrap img {width: 100%; transition: 0.3s ease-in-out;}
  #tech .img_wrap:hover img{transform: scale(1.3);}
  #tech>.tech_wrap>p{ font-size: 15px; font-weight: 400; text-align: center; color: #fff; margin-top: 24px;}
  #tech .tech_wrap .tech_list {display: flex; margin-top: 50px; flex-wrap: wrap; justify-content:space-between}
  #tech .tech_wrap .tech_list .tech_item{position: relative; width: 100%;  margin-bottom: 100px;}
  #tech .tech_wrap .tech_list .tech_item2{position: relative; width: 100%; margin-bottom: 100px;}
  #tech .tech_wrap .tech_list li .text_wrap h4{color: #fff; font-size: 0,9em; font-weight: 700;margin-top: 24px;}
  #tech .tech_wrap .tech_list li .text_wrap p{color: #fff; font-size: 15px; font-weight: 400;margin-top: 14px;}
  
  .padding {padding-top: 100px;}
  
  
  #contents {position: relative; width: 100%; background-color: #F8FAFB;}
  #contents .contents_wrap {width: 90%; margin: 0 auto; padding-top: 100px; display: flex; flex-wrap: wrap; justify-content: space-between;}
  #contents .contents_wrap .accessory {width: 100%; margin: 0 auto; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative; margin-bottom: 30px; height: 400px;}
  #contents .contents_wrap .accessory2 {width: 100%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative; height: 500px; margin-bottom: 30px; }
  #contents .contents_wrap .accessory3 {width: 100%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative; height: 500px;}
  #contents .contents_wrap .accessory .textArea {position: absolute; top: 32%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 88%;}
  #contents .contents_wrap .accessory2 .textArea {position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%); text-align: center; width: 80%;}
  #contents .contents_wrap .accessory3 .textArea {position: relative; text-align: center; width: 90%; margin: 0 auto;}
  #contents .contents_wrap .accessory3 .textArea p{font-size: 0.8em; font-weight: 400; color: #666666; margin: 24px 0 48px 0;}

  #contents .contents_wrap .textArea h2 {font-size: 32px; font-weight: 700;}
  #contents .contents_wrap .textArea p {font-size: 0.9em; font-weight: 400; color: #666666; margin: 24px 0 24px 0;}
  #contents .contents_wrap .textArea a {font-size: 0.8em; font-weight: 700; color: #79B928; position: relative;}
  #contents .contents_wrap .textArea a span{position: absolute; display: inline-block; margin-top: 5px;}
  #contents .contents_wrap .textArea a:hover {text-decoration: underline; text-decoration-color: #79B928;}
  #contents .contents_wrap .textArea a:hover span{animation: green 0.7s ease-in-out infinite;}
  
  #contents .contents_wrap .accessory_img {position: absolute; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%); width: 100%;}
  #contents .contents_wrap .accessory_img img{width: 100%;}
  #contents .contents_wrap .accessory2 .accessory_img {position: absolute; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%); width: 100%;}
  #contents .contents_wrap .accessory2 .accessory_img img {width: 100%;}
  #contents .contents_wrap .accessory3 .accessory_img {width: 100%; position: relative; margin-top: 40px;}
  #contents .contents_wrap .accessory3 .accessory_img img{width: 133px; margin: 0 auto; }
  #contents .contents_wrap .accessory3 .appstore {display: flex; width: 70%; margin: 0 auto;}
  #contents .contents_wrap .accessory3 .appstore a img{width: 100%;}
  #contents .contents_wrap .accessory3 .app {position: absolute; bottom: 0; margin: 0 auto; left: 50%; transform: translateX(-50%); width: 50%;}
  #contents .contents_wrap .accessory3 .app img {width: 100%;}
  
  #contents .support {max-width: 90%; margin: 0 auto; text-align: center;}
  #contents .support h2{font-size: 30px; font-weight: 700; margin-top: 100px; margin-bottom: 70px;}
  #contents .support_list {width: 100%; margin: 0 auto; display: flex; justify-content: space-between; padding-bottom: 100px; flex-wrap: wrap;}
  #contents .support_list li{width: 46%; box-shadow: 2px 4px 12px rgba(0, 0, 0, 20%); background-color: #fff; position: relative;  text-align: center; padding: 14px 0 14px 0; margin-bottom: 20px;}
  #contents .support_list li img {width: 30px; margin: 0 auto;}
  #contents .support_list li p {font-size: 15px; text-decoration: underline; text-decoration-thickness : 1px;}



}