@charset "utf-8";
@font-face {
  font-family: 'so500c.0';
  src: url('fonts/SamsungOne-500C_v1.0.eot');
  src: local('?'), url('fonts/SamsungOne-500C_v1.0.woff') format('woff'), url('fonts/SamsungOne-500C_v1.0.ttf') format('truetype'), url('fonts/SamsungOne-500C_v1.0.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'so400c.0';
  src: url('fonts/SamsungOne-300C_v1.0.eot');
  src: local('?'), url('fonts/SamsungOne-300C_v1.0.woff') format('woff'), url('fonts/SamsungOne-300C_v1.0.ttf') format('truetype'), url('fonts/SamsungOne-300C_v1.0.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'so300c.0';
  src: url('fonts/SamsungOne-300C_v1.0.eot');
  src: local('?'), url('fonts/SamsungOne-300C_v1.0.woff') format('woff'), url('fonts/SamsungOne-300C_v1.0.ttf') format('truetype'), url('fonts/SamsungOne-300C_v1.0.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'so800c.0';
  src: url('fonts/SamsungOne-800C_v1.0.eot');
  src: local('?'), url('fonts/SamsungOne-800C_v1.0.woff') format('woff'), url('fonts/SamsungOne-800C_v1.0.ttf') format('truetype'), url('fonts/SamsungOne-800C_v1.0.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SamsungSharpSans';
  src: url('fonts/SamsungSharpSans-Medium.eot');
  src: local('?'), url('fonts/SamsungSharpSans-Medium.woff') format('woff'), url('fonts/SamsungSharpSans-Medium.ttf') format('truetype'), url('fonts/SamsungSharpSans-Medium.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Conv_SamsungSharpSans-Bold';
  src: url('fonts/SamsungSharpSans-Bold.eot');
  src: local('?'), url('fonts/SamsungSharpSans-Bold.woff') format('woff'), url('fonts/SamsungSharpSans-Bold.ttf') format('truetype'), url('fonts/SamsungSharpSans-Bold.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

body{ font-family: 'so400c.0'; margin:0 auto; }
.section0 *, .section1 *, .section2 *, .section3 *, .section4 *, .section5 * { box-sizing: border-box; }
.section0 { display:none; }
.section1 { width: 100%; margin: 0; padding: 20px 0; padding-top: 50px; text-align: center; margin-top: 10px;}
.section2 { width: 100%; margin: 0; padding: 20px 0; text-align: center; }
.section3 { width: 100%; margin: 0; padding: 20px 0; text-align: center; }
.section4 { width: 100%; margin: 0; padding: 20px 0 50px; text-align: center; }
.section5 { width: 100%; margin: 0; padding: 20px 0; text-align: center; }
.main_container { margin: 0; width: 100%; padding: 0; overflow: hidden; }
.work_container { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0; }
.clear { clear: both; }
img { display: block; }

.kv_main { width: 100%; margin: 0; padding: 0; position: relative; }
.kv_main .kv_desktop { width: 100%; margin: 0; padding: 0; text-align: center; position: relative; z-index: 10; }
.kv_main .kv_desktop img { max-width: 100%; max-height: 100%; }
.kv_main .kv_text { width: 40%; margin: 0; padding: 0; position: absolute; top: 50%; left: 100px; margin-top: -65px; z-index: 20; }
.kv_mobile { display: none; }
h1 { font-family: 'Conv_SamsungSharpSans-Bold'; font-size: 80px; margin: 0 0 15px; padding: 0; color: #000000; }
h2 { font-family: 'Conv_SamsungSharpSans-Bold'; font-size: 22px; margin: 0; padding: 0; }
.form_elements { margin: 0; padding: 0; list-style: none; margin-left: -10px; margin-right: -10px; }
.form_elements li { width: 25%; float: left; margin: 0; padding: 0 10px; }
.form_elements li select { width: 100%; margin: 0; padding: 10px; font-family: 'so400c.0'; font-weight: 400; font-size: 16px; color: #000000; border: 1px solid #c2c2c2; border-radius: 5px;background: #fff; }
.form_elements li button { width: 100%; margin: 0; padding: 10px; font-family: 'SamsungSharpSans'; font-size: 16px; color: #ffffff; background: #000000; border-radius: 5px; border: 1px solid #000000; text-transform: uppercase; cursor: pointer; }
#result { width: 100%; margin: 0; padding: 0; overflow: hidden; border: 1px solid #c2c2c2; border-radius: 5px; background: #ffffff; }
#deviceName { font-family: 'Conv_SamsungSharpSans-Bold'; font-size: 18px; margin: 0; padding: 20px 0; text-align: center; border-bottom: 1px solid #c2c2c2; }
#result .grades_list { margin: 0; padding: 0; list-style: none; display: flex; justify-content: center; }
#result .grades_list li { width: 20%; float: left; margin: 0; padding: 20px; border-right: 1px solid #c2c2c2; }
#result .grades_list li:last-child { border-right: none; }
.grade_title { width: 100%; margin: 0 0 3px; padding: 0; font-weight: 600; font-size: 14px; color: #000000; text-align: center; }
.grade_condition { width: 100%; margin: 0 0 20px; padding: 0; font-weight: 400; font-size: 14px; color: #737373; text-align: center; }
.grade_price { width: 100%; margin: 0; padding: 0; font-family: 'Conv_SamsungSharpSans-Bold'; font-size: 40px; color: #000000; text-align: center; }
.categoryList { width: 35%; margin: 0 auto; overflow: hidden; }
.category { float: left;padding: 5px 0 15px; cursor: pointer; width: 46%; border: 2px solid #f3f3f3; border-radius: 20px; margin: 0 10px; }
.activeOption { border: 2px solid #0077c8; }
.device_name { font-size: 16px; font-family: 'Conv_SamsungSharpSans-Bold'; background: #dcdcdc; border-radius: 0; padding: 10px; }
.img-wrapper { display: inline-block; }
img {max-width: 100%; max-height: 100%;}

.form_elements .input {
  width: 100%;
  margin: 0;
  padding: 10px;
  font-family: 'so400c.0';
  font-weight: 400;
  font-size: 16px;
  color: #000000;
  border: 1px solid #c2c2c2;
  border-radius: 5px;
  background: #fff;
}
.form_elements {
  display: flex;
  justify-content: center;
}

.search-results {
  width: 100%;
  margin: 0;
  font-family: 'so400c.0';
  font-weight: 400;
  font-size: 16px;
  color: #000000;
  border: 1px solid #c2c2c2;
  border-radius: 5px;
  background: #fff;
  margin-top: 5px;
}
.search-results > div {
  padding: 8px 10px;
  text-align: left;
  cursor: pointer;
}
.search-results > div:hover {
  background-color: #f1f1f1;
}
.search-results > div:not(:last-child) {
  border-bottom: 1px solid #f1f1f1;
}

.categoryList {
  width: 90%;
  display: flex;
  justify-content: center;
  padding: 30px 0;
}
.categoryList .category {
  text-align: center;
}

.red-text {
  color: #79a9d8;
}

.text-center {
  text-align: center;
}
.btn {
  font-family: 'SamsungSharpSans'; 
  font-size: 15px;
  /* background-color: #79a9d8; */
  background-color: #c2c2c2;
  border: 1px solid #c2c2c2;
  padding: 5px 15px;
  padding-top: 7px;
  border-radius: 5px;
  cursor: pointer;
}


@media (min-width: 1025px) and (max-width: 1400px) {
  .categoryList { width: 1000px; max-width: 90%;  }
  .kv_main .kv_text { margin-top: -35px; }
  h1 { font-size: 62px;}
}
@media (min-width: 991px) and (max-width: 1024px) {
  .categoryList { width: 50%; }
  .kv_main .kv_text { margin-top: -20px; }
  h1 { font-size: 48px;}
}
@media (min-width: 768px) and (max-width: 990px) {
  .categoryList { width: 70%; }
  .form_elements li button { font-size: 14px; }
  .grade_price { font-size: 30px; }
  .kv_main .kv_text { margin-top: -20px; }
  h1 { font-size: 40px;}
}
@media (max-width: 767px) {
  .main_container { padding: 0 10px; }
  .section2 { padding: 20px 0 0; }
  .kv_desktop { display: none; }
  .kv_mobile { display: block; width: 100%; margin: 0; padding: 0; text-align: center; position: relative; z-index: 10; }
  .kv_mobile img { display:none; }
  .kv_main .kv_text { left: 0; top: 40px; margin-top: 0; width: 100%; text-align: center; }
  h1 { font-size: 44px; }
  h2 { font-size: 24px; }
  .form_elements li { width: 100%; float: none; margin: 0 0 20px; }
  #deviceName { padding: 20px 5px; }
  #result .grades_list li { width: 50%; padding: 10px; border-bottom: 1px solid #c2c2c2; }
  .noborderbtm { border-bottom: 0 none!important; }
  .noborderrgt { border-right: 0 none!important; }
  .grade_price { font-size: 30px; }
  .grade_condition { font-size: 12px; }
  .device_name { font-size: 10px; border-radius: 0; }
  .category { margin: 0 5px; border-radius: 10px; padding: 5px 0 10px; }
  .categoryList { 
    width: 100%; 
    display: block;
  }

  .categoryList .category {
    width: 90%;
    margin-bottom: 20px;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    float: none;
  }

  .device_name {
    font-size: 20px;
  }

  .section1 {
    padding-top: 0px;
  }

  #app {
    padding-top: 50px;
  }
}