/* +++++++++++++++++++ common.css +++++++++++++++++++ */

@charset "utf-8";
/* noto-sans-kr-regular - latin_korean */
/* noto-sans-kr-100 - latin_korean */
@font-face {
  font-family: 'NotoSansKR-Thin';
  src: url('../fonts/noto-sans-kr-v21-latin_korean-100.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-kr-v21-latin_korean-100.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v21-latin_korean-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v21-latin_korean-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v21-latin_korean-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../img/noto-sans-kr-v21-latin_korean-100.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-regular - latin_korean */
@font-face {
  	font-family: 'NotoSansKR-Regular';
  	src: url('../fonts/noto-sans-kr-v21-latin_korean-regular.eot'); /* IE9 Compat Modes */
  	src: local('Noto Sans KR Regular'), local('NotoSansKR-Regular'),
  		url('../fonts/noto-sans-kr-v21-latin_korean-regular.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
  		url('../fonts/noto-sans-kr-v21-latin_korean-regular.woff2') format('woff2'), /* Super Modern Browsers */
  		url('../fonts/noto-sans-kr-v21-latin_korean-regular.woff') format('woff'), /* Modern Browsers */
  		url('../fonts/noto-sans-kr-v21-latin_korean-regular.ttf') format('truetype'), /* Safari, Android, iOS */
  		url('../img/noto-sans-kr-v21-latin_korean-regular.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-300 - latin_korean */
@font-face {
  font-family: 'NotoSansKR-Light';
  src: url('../fonts/noto-sans-kr-v21-latin_korean-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-kr-v21-latin_korean-300.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v21-latin_korean-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v21-latin_korean-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v21-latin_korean-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../img/noto-sans-kr-v21-latin_korean-300.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-500 - latin_korean */
@font-face {
  font-family: 'NotoSansKR-Medium';
  src: url('../fonts/noto-sans-kr-v21-latin_korean-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/noto-sans-kr-v21-latin_korean-500.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/noto-sans-kr-v21-latin_korean-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/noto-sans-kr-v21-latin_korean-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/noto-sans-kr-v21-latin_korean-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../img/noto-sans-kr-v21-latin_korean-500.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-900 - latin_korean */
@font-face {
	font-family: 'NotoSansKR-Black';
	src: url('../fonts/noto-sans-kr-v21-latin_korean-900.eot'); /* IE9 Compat Modes */
	src: local('Noto Sans KR Black'), local('NotoSansKR-Black'),
		url('../fonts/noto-sans-kr-v21-latin_korean-900.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('../fonts/noto-sans-kr-v21-latin_korean-900.woff2') format('woff2'), /* Super Modern Browsers */
		url('../fonts/noto-sans-kr-v21-latin_korean-900.woff') format('woff'), /* Modern Browsers */
		url('../fonts/noto-sans-kr-v21-latin_korean-900.ttf') format('truetype'), /* Safari, Android, iOS */
		url('../img/noto-sans-kr-v21-latin_korean-900.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}
/* noto-sans-kr-700 - latin_korean */
@font-face {
	font-family: 'NotoSansKR-Bold';
	src: url('../fonts/noto-sans-kr-v21-latin_korean-700.eot'); /* IE9 Compat Modes */
	src: local('Noto Sans KR Bold'), local('NotoSansKR-Bold'),
		url('../fonts/noto-sans-kr-v21-latin_korean-700.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('../fonts/noto-sans-kr-v21-latin_korean-700.woff2') format('woff2'), /* Super Modern Browsers */
		url('../fonts/noto-sans-kr-v21-latin_korean-700.woff') format('woff'), /* Modern Browsers */
		url('../fonts/noto-sans-kr-v21-latin_korean-700.ttf') format('truetype'), /* Safari, Android, iOS */
		url('../img/noto-sans-kr-v21-latin_korean-700.svg#NotoSansKR') format('svg'); /* Legacy iOS */
}

html {
/* Prevent font scaling in landscape */
-webkit-text-size-adjust: none; /*Chrome, Safari, newer versions of Opera*/
-moz-text-size-adjust: none; /*Firefox*/
-ms-text-size-adjust: none; /*Ie*/
-o-text-size-adjust: none; /*old versions of Opera*/
}

/* =========== mobile(start) ============ */
@media screen and (max-width: 767px) {
  
  .desc_title img { width: 100%;}
  .mobile_blind { display: none; }
  .blind { display: none; }
  header { position: fixed; width: 100%; padding-top: 24px; height: 76px; z-index: 100; }
  header > h1 { position: absolute; left: 4%; width: 118px; object-fit: fill;  z-index: 100; }
  header > h1 img { width: 118px; }
  .logo { display: inline-block; width: 118px; height: 30px; background: url("../img/kdl_header_logo.png") no-repeat center; background-size: contain; }

  #hamberger { z-index: 100; width: 20px;}

  header.down { background: #fff; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); }
  header.down #hamberger { -webkit-filter: brightness(0%); filter: brightness(0%); }
  header.down > nav ul > li > a { color: #000;}
  header.down .logo { display: inline-block; width: 118px; height: 30px; background: url("../img/kdl_header_logo_c.png") no-repeat center; background-size: contain; }

  header.on .gnb_01{ position: fixed; transform: translateX(0); }
  header.on #hamberger { -webkit-filter: brightness(0%); filter: brightness(0%); }
  header.on .logo { display: inline-block; width: 118px; height: 30px; background: url("../img/kdl_header_logo_c.png") no-repeat center; background-size: contain; }

  nav { position: relative; width: 100%; height: 24px; }
  .gnb_01 { top: 0; position: fixed; background: #fff; transform: translateX(100%); height: 100vh; width: 100vw; padding: 30px;  transition: transform 0.3s ease-in-out; }

  nav ul.gnb_01 { overflow-y: scroll; height: 100%; text-align: right;}
  nav ul.gnb_01 li { display: block; position: relative; width: 100%; padding: 1em 6.25vw; color: #231f20; font-size: 20px; font-family: "NotoSansKR-Bold"; top: 20%;}
  nav ul.gnb_01 li > a::after { content: ""; display: block; position: absolute; right: 6.25vw; top: 50%; width: 12px; height: 12px; background: url("../img/btn_submenu_open.png") no-repeat; background-size: cover; transform: translateY(-50%); }
  nav ul.gnb_01 li > a.active::after { background: url("../img/btn_submenu_close.png") no-repeat; background-size: cover; }

  nav ul.gnb_01 > li > ul { display: none; padding: 0.7em 0; font-size: 0.75em; }
  nav ul.gnb_01 > li > ul > li > a { display: block; padding: 0.7em 3.90625vw 0.7em 9.375vw; color: #231f20;  }

  nav > h2 > img { position: absolute; right: 4%; object-fit: fill; }

  
  footer { position: relative; display: block; margin: 0 auto; width: 100%; height: 440px; background: #292929; }
  .footer_left { width: 320px; padding-top: 56px; font-size: 13px; color: #fff; margin: 0 auto; }
  .footer_left img { width: 160px; margin-bottom: 20px; }
  .bold { font-family: "NotoSansKR-Medium"; }
  .footer_one { float: left; margin-right: 5px; }
  .footer_two { float: left; margin-right: 5px; }
  .footer_one:after { content: "|";  font-size: 13px; margin-left: 5px; vertical-align: top; }
  .footer_two:after { content: "|";  font-size: 13px; margin-left: 5px; vertical-align: top; }
  .footer_slice { margin-bottom: 10px; }

  .footer_text { text-align: left; line-height: 1.7;}

  .footer_right { position: absolute; left: 4%; bottom: 30px; }
  .footer_right img { width: 32px; height: 32px; float: left; margin-left: 10px;}

  .title_wrap { width: 90%; display: block; margin: 0 auto; padding-bottom: 40px;}
.title_wrap > p { font-size: .8125rem; font-family: "NotoSansKR-bold";}
.title_wrap > h2 { font-size: 1.375rem; margin-bottom: 20px; font-family: "NotoSansKR-bold"; font-weight: 100;}


  .js-load {
    display: none;
}
.js-load.active {
    display: block;
}
.is_comp.js-load:after {
    display: none;
}
.btn-wrap, .lists, .main {
    display: block;
}

.top_btn { position: fixed; width: 60px; height: 60px; background: rgba(0, 0, 0, 0.5); bottom: 30px; right: 30px; z-index: 100; border-radius: 100px; }

  .top_btn:hover { background: rgba(0, 0, 0, 0.8); }

  .top_btn p { text-align: center; color: #fff; }


}

/* =========== mobile(end) ============ */

/* =========== tablet(start) ============ */
@media screen and (min-width: 768px) and (max-width: 1349px) {

  .desc_title img { width: 100%;}
  .mobile_blind { display: none; }
  .blind { display: none; }
  header { position: fixed; width: 100%; padding-top: 24px; height: 76px; z-index: 100; }
  header > h1 { position: absolute; left: 4%; width: 118px; object-fit: fill;  z-index: 100; }
  header > h1 img { width: 118px; }
  .logo { display: inline-block; width: 118px; height: 30px; background: url("../img/kdl_header_logo.png") no-repeat center; background-size: contain; }

  #hamberger { z-index: 100; width: 20px;}

  header.down { background: #fff; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); }
  header.down #hamberger { -webkit-filter: brightness(0%); filter: brightness(0%); }
  header.down > nav ul > li > a { color: #000;}
  header.down .logo { display: inline-block; width: 118px; height: 30px; background: url("../img/kdl_header_logo_c.png") no-repeat center; background-size: contain; }

  header.on .gnb_01{ position: fixed; transform: translateX(0); }
  header.on #hamberger { -webkit-filter: brightness(0%); filter: brightness(0%); }
  header.on .logo { display: inline-block; width: 118px; height: 30px; background: url("../img/kdl_header_logo_c.png") no-repeat center; background-size: contain; }

  nav { position: relative; width: 100%; height: 24px; }
  .gnb_01 { top: 0; position: fixed; background: #fff; transform: translateX(100%); height: 100vh; width: 100vw; padding: 30px;  transition: transform 0.3s ease-in-out; }

  nav ul.gnb_01 { overflow-y: scroll; height: 100%; text-align: right;}
  nav ul.gnb_01 li { display: block; position: relative; width: 100%; padding: 1em 6.25vw; color: #231f20; font-size: 20px; font-family: "NotoSansKR-Bold"; top: 20%;}
  nav ul.gnb_01 li > a::after { content: ""; display: block; position: absolute; right: 6.25vw; top: 50%; width: 12px; height: 12px; background: url("../img/btn_submenu_open.png") no-repeat; background-size: cover; transform: translateY(-50%); }
  nav ul.gnb_01 li > a.active::after { background: url("../img/btn_submenu_close.png") no-repeat; background-size: cover; }

  nav ul.gnb_01 > li > ul { display: none; padding: 0.7em 0; font-size: 0.75em; }
  nav ul.gnb_01 > li > ul > li > a { display: block; padding: 0.7em 3.90625vw 0.7em 9.375vw; color: #231f20;  }

  nav > h2 > img { position: absolute; right: 4%; object-fit: fill; }

  
  footer { position: relative; display: block; margin: 0 auto; width: 100%; height: 440px; background: #292929; }
  .footer_left { width: 90%; padding-top: 56px; font-size: 13px; color: #fff; margin: 0 auto; }
  .footer_left img { width: 160px; margin-bottom: 20px; }
  .bold { font-family: "NotoSansKR-Medium"; }
  .footer_one { float: left; margin-right: 5px; }
  .footer_two { float: left; margin-right: 5px; }
  .footer_one:after { content: "|";  font-size: 13px; margin-left: 5px; vertical-align: top; }
  .footer_two:after { content: "|";  font-size: 13px; margin-left: 5px; vertical-align: top; }
  .footer_slice { margin-bottom: 10px; }

  .footer_text { text-align: left; line-height: 1.7;}

  .footer_right { position: absolute; left: 4%; bottom: 30px; }
  .footer_right img { width: 32px; height: 32px; float: left; margin-left: 10px;}

  .title_wrap { width: 90%; display: block; margin: 0 auto; padding-bottom: 40px;}
.title_wrap > p { font-size: .8125rem; font-family: "NotoSansKR-bold";}
.title_wrap > h2 { font-size: 1.375rem; margin-bottom: 20px; font-family: "NotoSansKR-bold"; font-weight: 100;}


  .js-load {
    display: none;
}
.js-load.active {
    display: block;
}
.is_comp.js-load:after {
    display: none;
}
.btn-wrap, .lists, .main {
    display: block;
}

.top_btn { position: fixed; width: 60px; height: 60px; background: rgba(0, 0, 0, 0.5); bottom: 30px; right: 30px; z-index: 100; border-radius: 100px; }

  .top_btn:hover { background: rgba(0, 0, 0, 0.8); }

  .top_btn p { text-align: center; color: #fff; }
}


/* =========== tablet(end) ============ */

/* =========== Desktop(start) ============ */
@media screen and (min-width: 1350px) {

  .desc_blind { display: none; }


  body { color: #292929; font-size: 16px;}

  header.down { background: #fff; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); }
  header.down > nav ul > li > a { color: #000;}
  header.down .logo { display: inline-block; width: 175px; height: 40px; background: url("../img/kdl_header_logo_c.png") no-repeat center;}
  header { position: fixed; width: 100%; height: 85px; z-index: 20; padding: 24px 0; min-width: 1300px; }
  header > h1 { position: absolute; left: 10%; }


  .logo { display: inline-block; width: 175px; height: 40px; background: url("../img/kdl_header_logo.png") no-repeat center;}
  .sub_visual { position: relative; width: 100%; height: 500px; margin-bottom: 80px; }
  .desc_blind { display: none; }
  .blind { display: none; }
  .inner_wrap { display: block; width: 70%; margin: 0 auto; }
  .blind { display: none; }
  .wrapper { margin: 0 auto 50px auto; width: 900px; }

  .wait_bold { font-family: "NotoSansKR-Black";}

  .nav { transition: transform .3s; }
  .nav.hide {
    transform: translateY(-140%);
  }

  .sub_nav { background: #000; position: absolute; bottom: 0; z-index: 10; }

  nav > ul.gnb_01 { width: 100%; height: 220px; }
  nav > ul.gnb_01 > li { float: left; width: 14%; height: 60px; text-align: center; vertical-align: middle;}
  nav > ul.gnb_01 > li > a { display: block; width: 100%; height: 60px; text-align: center; line-height: 40px; color: #fff; font-size: 16px; }
  nav > ul.gnb_01 > li:hover > a { color: #00bff3; }

  nav ul.sub { height: 220px;  }
  nav ul.sub > li { width: 100%; height: 40px; }
  nav ul.sub > li > a { display: block; width: 100%; height: 100%; padding: 0 10px; color: #fff; font-size: 14px; line-height: 40px; }
  nav ul.sub > li > a:hover { color: #00bff3; }

  nav { float: right; position: absolute; right: 6%; overflow: hidden; height: 60px; transition: height 0.3s; }


  .inner_wrap { margin-top: 136px; margin-bottom: 110px; }



  .top_btn { position: fixed; width: 70px; height: 70px; background: rgba(0, 0, 0, 0.5); bottom: 30px; right: 30px; z-index: 100; border-radius: 100px; }

  .top_btn:hover { background: rgba(0, 0, 0, 0.8); }

  .top_btn p { text-align: center; color: #fff; }

  .pdf_btn { display: block; text-align: left; margin-top: 40px; width: 164px; height: 50px; background: linear-gradient(to top right, #1573FD, #579BFF); border-radius: 50px; text-align: center; }
  .pdf_btn a { color: #fff; font-family: "NotoSansKR-medium"; text-align: center; }

  /* 공통 버튼 */

  /*특허 띠*/

  .license_line { height: 50px; width: 100%; text-align: center; color: #000; background: #f8f8f8; border-top: 1px solid #ECECEC; border-bottom: 1px solid #ECECEC; padding-top: 12px; }
  .license_line p::before { content: ""; display: inline-block; background: url("../img/award_ico.png") no-repeat center; width: 15px; height: 18px; transform: translateY(3px); margin-right: 5px; }

  .sub_vis_title_all { top: 220px; }

  .js-load {
    display: none;
}
.js-load.active {
    display: block;
}
.is_comp.js-load:after {
    display: none;
}
.btn-wrap, .lists, .main {
    display: block;
}

  

body { font-family: "NotoSansKR-Regular";}

.bold { font-family: "NotoSansKR-bold"; }

.title_wrap { width: 1350px; display: block; margin: 0 auto; padding-bottom: 40px;}
.title_wrap > p { font-size: 1.625rem; }
.title_wrap > h2 { font-size: 2.75rem; margin-bottom: 20px; font-family: "NotoSansKR-bold"; font-weight: 100;}


  footer { position: relative; display: block; width: 100%; height: 320px; background: #292929; transform: translateY(-43%); }
  .footer_left { padding-top: 56px; font-size: 13px; color: #fff; line-height: 1.7;}
  .footer_left img { margin-bottom: 20px; }
  .bold { font-family: "NotoSansKR-Medium"; }
  .footer_one { float: left; margin-right: 10px; }
  .footer_two { float: left; margin-right: 10px; }
  .footer_one:after { content: "|";  font-size: 13px; margin-left: 10px; vertical-align: top; }
  .footer_two:after { content: "|";  font-size: 13px; margin-left: 10px; vertical-align: top; }
  .footer_slice { margin-bottom: 10px; }

  .footer_right { position: absolute; right: 10%; top: 56px; }

  .footer_right img {  width: 32px; height: 32px; float: left; margin-left: 10px;}

.news_li_title { font-size: 26px; font-family: "NotoSansKR-bold";}
.news_list li { border-bottom: 1px solid #E6E6E6; padding-top: 30px; padding-bottom: 30px;}

.news_li_title { margin-bottom: 10px; }

.news_bott p { color: #C0C0C0; margin-right: 15px; font-size: 16px;}


div.line { margin-top: 40px; margin-bottom: 40px; width: 100px; height: 1px; background: #ccc; }

}
/* =========== Desktop(end) ============ */