@charset "utf-8";

@import url('grid.css');
@import url('ui.css');

/*  Default Style */

.en { font-family: roboto, sans-serif; }

h2.title,  h3.title { font-weight: 600; color: #000; font-size: 36px; margin-top: 0px; text-align: center; margin-bottom:30px; }
.smallTitle { font-size: 24px; font-weight: bold; color: #000; margin-bottom: 30px; text-align: center; }
.smallTitle.hasSub { margin-bottom: 10px; }
h2.title:before,  h3.title:before { content: ""; display: block; margin: 0 auto; border-top:2px solid #d90000; width: 40px; margin-bottom: 15px;  }
h2.title.alignLeft:before,  h3.title.alignLeft:before { margin: 0 0 15px; }
h2.title.hasSub,  h3.title.hasSub { margin-bottom: 10px; }
p.titleSub { text-align: center; font-size: 20px; color: #999; margin-bottom: 40px; }
p.titleSub.small {  font-size: 16px; color: #666; line-height: 1.5em; margin-bottom: 40px; }
h2.title .sub, h3.title .sub { font-weight: normal; color: #999; }
h4.slogan { font-size: 16px; font-weight: bold; margin: 0 0 5px; }
h4.title {  color: #d90000; margin-bottom: 10px; font-size: 16px; font-weight: bold; }
h4.title.hasSub { margin-bottom: 5px; }
h4.title .sub { color: #999; font-size: 12px; font-weight: normal; font-family: roboto; }
h4.title.black {  color: #222;  }
h4.title.hasLine { border-top:1px solid #ddd; padding-top: 10px; }
h4.title.underPoint {   }
h4.title.underPoint:after { border-bottom:2px solid #ff4b00;  width: 10px;  content: ""; display: block;  margin-top: 8px;}
.pageContent h5 { font-weight: bold; margin: 10px 0; }
#content .setWidth.custom{
 width:1200px !important;
}
.setWidth > .ttl_area {
 margin-bottom: 100px;
}
.setWidth > .ttl_area h2,
.setWidth > .ttl_area p {
 text-align: center;
}
.setWidth > .ttl_area h2 {
 margin-bottom: 20px;
 font-size: 40px;
 font-weight: 700;
 line-height: 1.4;
}
.grid .col_item.half {
width:50%;}

p { font-size: 14px; line-height: 1.7em;  letter-spacing: -0.02em;}
p.highlight { font-size: 16px; }
p.first { margin-top: 0; }
p.strong { font-size: 16px;   }
p.intro { font-size: 16px; }
p.smallText { font-size: 12px; color: #999; }

.textGray { color: #888 !important; }
.textblack { color: #000 !important; }
.textRed { color: #d90000 !important; }
.textWhite { color: #fff !important; }
.textBlue { color: #1e8df9 !important; }
.textOrange { color: #ffa100 !important; }

.divider { margin: 50px 0;   border-bottom: 1px solid #ddd;  clear: both; }
.divider.tight { margin: 15px 0; } 

.blind { display: block; height: 0px; width: 0px; overflow: hidden; }

.blank { clear: both; height:40px; }
.blank.h10 { clear: both; height: 10px; }
.blank.h20 { clear: both; height: 30px; }
.blank.h30 { clear: both; height: 30px; }
.blank.h60 { clear: both; height: 60px; }

.p30 { padding: 30px !important; }
.p60  { padding: 60px !important; }
.bgWrap { background: #eee; }
.bgWrap2 { background: #ddd; }
.lineWrap { border:1px solid #ddd; }
@media all and (max-width: 740px) { 
.lineWrap .col {margin: 0px !important; }
.p30  { padding: 20px !important; }
.p60  { padding: 40px 20x !important; }
}

.iconWrap { text-align: center;  display: block; }
.iconWrap.icon128 { padding: 10px 0; }

.imgWrap {  position: relative; text-align: center;  display: block; }
.imgWrap img { width: 100%; height: auto; vertical-align: middle; }
.imgWrap.singleImg img {  width: auto; max-width: 100%; }
.imgWrap .caption { position: absolute;  display: block; bottom:0px; left:0px; right:0px; z-index: 0; color: #fff; background: rgba(0,0,0,.7); padding: 10px;  text-align: center; }
.imgWrap  .captionBottom { margin: 10px 0 20px; color: #666; } 
.imgWrap  .captionRibbon {  position: absolute;  display: block; top:0px; left:0px; font-size: 16px;  z-index: 0; color: #fff; background: rgba(0,0,0,.7); padding: 5px 15px;  text-align: center;  }
.setWidthInner { width: 100%; max-width: 720px; margin: 0 auto; }
.setWidthInner.short { max-width: 420px; }
.imgWrap   .centerOverlay {  line-height: 1.3em; height: 2.6em; font-size: 20px;  position: absolute; text-align: center; top:50%;  margin-top: -1.3em; text-align: center; right:0px; left:0px;}

.col.grayBox { padding: 20px 10px; margin-bottom: 20px; background: #eee ; }


i.red { color: #d90000;   vertical-align: 0px !important; }
.textRed { color: #d90000;  }

.alignLeft { text-align: left !important; }
.alignCenter, .alignCenter * { text-align: center !important; }
.alignRight { text-align: right !important; }

.termsContent { padding: 40px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; }
.termsContent h3 { font-size: 18px; margin-bottom: 20px; font-weight: 700;}
.termsContent p { color: #666; }

.termsContent a { color: #555; text-decoration: underline; }
.termsContent {  }
.termsContent  ol > li { font-size: 18px; font-weight: 700; margin-left: 20px; padding-top: 20px;  list-style: decimal; }
.termsContent  ol > li h4 { font-size: 18px; font-weight: bold; margin-bottom: 20px; }
.termsContent  ol > li p { font-size: 14px; font-weight: normal;  }

.termsContent ul { margin-top: 10px; margin-bottom: 20px; }
.termsContent ul li { margin-top: 5px;  padding-left: 12px; font-size: 14px; font-weight: normal; color: #666; position: relative; line-height: 20px;}
.termsContent ul li:first-child { margin-top: 0; }
.termsContent ul li:before { display: block;  content: ""; width: 6px; border-top:2px solid #ccc; top:10px; left: 0px; position: absolute;  }

/* google Map */

#map_01 {
	width: 100%;
	height: 100%;
}
#map_02 {
	width: 100%;
	height: 100%;
}
#map_03 {
	width: 100%;
	height: 100%;
}
#map_04 {
	width: 100%;
	height: 100%;
}
#map_05 {
	width: 100%;
	height: 100%;
}
.mapWrap {height:420px;}

 /* Table */
 
 .tableControl { margin-bottom: 10px; overflow: hidden; }

table { width: 100%; border-collapse: collapse; border-spacing: 0; position: relative; }
summary { height: 0px; display: block; overflow: hidden; }

table.infoTable {   border-top:1px solid #666; }
table.infoTable caption {  margin-bottom: 15px;  height: 24px;  }
table.infoTable caption h4 { float: left; margin:-3px 0 0 0;   font-size: 18px; font-weight: bold;  }
table.infoTable caption .extra { display: block; float: left; color: #fff; margin-left: 20px;  padding: 3px 8px; background: #999; font-size: 12px; }


table.infoTable th { font-weight: bold; padding: 15px 10px;  line-height: 20px; border-bottom: 1px solid #ccc; background: #eee;  text-align: center; vertical-align: middle; font-size: 13px;}
table.infoTable tbody th { text-align: left;  }
table.infoTable td { padding: 15px 10px;  border-bottom: 1px solid #ccc;  font-size: 13px; text-align: center; vertical-align: middle;}

table.infoTable.hasLine td, table.infoTable.hasLine th { border-left:1px solid #ccc; }
table.infoTable.hasLine td:first-child, table.infoTable.hasLine th:first-child { border-left: none; }

table.infoTable.stock td, table.infoTable.stock th { width: 25%; padding: 15px 10px; }
table.infoTable.stock td { text-align: right; }


table.infoTable td.number { width: 50px; text-align:   }
table.infoTable td.link { text-align: left; }
table.infoTable td  a { color: #000; }
table.infoTable td  a:hover { text-decoration: underline; }

/* List */

.listType1 li a, .listType2 li a, .listType3 li a { color: #3e99ff; text-decoration: underline; }

.listType1 {}
.listType1 li { position: relative; padding-left: 9px;  margin-top: 7px;  line-height: 21px;}
.listType1 li:first-child { margin: 0; }
.listType1 li:before { content: " "; display: block; left: 0px; top:9px; background: #d90000;  width: 3px; height: 3px; position: absolute; border-radius: 2px; }
.listType1 li b {  }
.listType1.tight  li { margin-top: 5px; }

.listType2 {  }
.listType2 li { line-height: 21px;  text-align: center;}
.listType2 li:first-child { margin: 0;  }
.listType2 li:first-child:before { display: none; }
.listType2 li:before { content: ""; display: block;   background: #d90000;  width: 3px; height: 3px;  border-radius: 2px; margin: 10px auto;}

.listType3 {  }
.listType3 li { position: relative; padding-left: 9px;  margin-top: 5px;  line-height: 17px; font-size: 12px; color: #666;}
.listType3 li:first-child { margin: 0; }
.listType3 li:before { content: " "; display: block; left: 0px; top:9px; background: #d90000;  width: 3px; height: 3px; position: absolute; border-radius: 2px; }
.listType3 li b {  }

.listType4 {}
.listType4 li { position: relative; padding-left: 80px;  margin-top: 10px;  line-height: 17px; font-size: 14px; color: #666; overflow: hidden;}
.listType4 li:first-child { margin-top: 0; }
.listType4 li h5 {  position: absolute; left: 0px; top:0px; margin: 0; width: 80px; color: #000; line-height: 1.4em; }
.listType4 li p { line-height: 1.4em; }

.checkList { overflow: hidden; }
.checkList li { display: inline-block; margin:10px 20px 0px 0;  padding-left: 20px; background: url(../images/bull_check.png)  left no-repeat; }

.roundNumList { display: table; width: 100%; }
.roundNumList > li { display: table-cell; padding-left: 25px; position: relative;  }
.roundNumList > li span.number { position: absolute; left: 0px; top:0px; height: 20px; width: 20px; border:1px solid #ccc; color: #333; font-size: 12px; font-family: Roboto, sans-serif; box-sizing: border-box; line-height: 18px; text-align: center; border-radius: 50%; }
 .roundNumList li h6 { line-height: 20px; font-weight: bold; }
 .roundNumList li ul li { font-size: 13px; color: #666; margin-top: 5px;  }

/*
.roundNumList.t2 {display: block;}
.roundNumList.t2 > li {display: block; margin: 10px 0}
.roundNumList.t2 > li span.number {border-color: #d90000; background: # color: #d90000}
*/
 
 .tileList { border:1px solid #ddd;  border-left:none; overflow: hidden; max-width: 640px; margin: 0 auto;}
 .tileList li { width: 33.33%; float: left; text-align: center;  padding: 30px 0;  box-sizing: border-box; border-left: 1px solid #ddd;  margin-top: -1px; border-top:1px solid #ddd; }
 .tileList li p{ text-align: center; color: #d90000}
 
.pictoList li { overflow: hidden;  margin-bottom: 30px;  border-top:1px solid #ddd; }
.pictoList li .iconWrap { float: left;  width: 20%;  }
.pictoList li h4 { margin-top: 10px; }
.pictoList li h4 em { font-weight: bold; font-family: roboto; color: #d90000; margin-right: 5px; }

.pictoList2 li { overflow: hidden; margin: 10px 0;    float: left;  width: 50%;  }
.pictoList2 li .iconWrap { float: left;  width: 140px;  margin-right: 10px; }
.pictoList2 li h4 { margin-top: 25px; }
.pictoList2 li p { padding-right: 30px; }


@media all and (max-width: 740px) { 
.pictoList2 li {  float: none; width: 100%;  margin: 20px 0; }
.pictoList2 li .iconWrap { float: left;  width: 25%;  }
.pictoList2 li .iconWrap img { max-width: 100%; }
.pictoList2 li h4 { margin-top: 10px; }
.pictoList2 li p { padding-right: 0; }
}
 

.markList { overflow: hidden;  text-align: center; display: block; }
 .markList  li { display: inline-block; margin: 10px 20px;}
 
 /* History */
 
 .historyContent {}
 
 h4.historyYear { font-family: roboto; font-size: 24px; font-weight: bold; margin-bottom: 15px; }
 .historyList {}
.historyList li { position: relative; padding-left: 30px;  margin-top: 15px;  line-height: 17px; font-size: 14px;   overflow: hidden; color: #666;}
.historyList li:first-child { margin-top: 0; }
.historyList li b { display: block;  position: absolute; left: 0px; top:0px; margin: 0; width: 80px;  line-height: 1.4em;  color: #222; }
 .historyList li.highlight { color: #d90000 !important;  }
  .historyList li.important {  font-size: 16px; padding: 0; color: #222; }
 
 
 /* Company */
 
 .comapnyOverview {  }
 .comapnyOverview .col { padding-bottom: 30px; }
 .comapnyOverview .col .imgWrap { margin-bottom: 10px; }
 .comapnyOverview .col h4 { color: #d90000; font-size: 16px; margin-bottom: 10px; }
 .comapnyOverview .col p { line-height: 1.4em; letter-spacing: -0.02em; color: #333; margin-bottom: 10px; }
 .comapnyOverview .col  a { font-size: 12px; color: #999; }
 .comapnyOverview .col  a:hover,  .comapnyOverview .col  a:focus { color: #d90000; text-decoration: underline; }
 
 .companySection { margin-bottom: 80px;  }
 .companySection > .imgWrap { margin-bottom: 30px; }
 .companySection h4 { color: #d90000; margin-bottom: 10px; font-size: 16px; }
 .companySection h5 { padding: 20px 0 10px;  font-weight: bold; }
 .companySection h5:first-child { padding-top: 0px; }
 .companySection h5:before { content: ""; display: block; height: 0px; border-top:1px solid #d90000; width: 20px; margin-bottom:5px; }
 
  .slogan { font-size: 20px; letter-spacing: -1px; display: block; margin-bottom: 20px; }
 
 
 .shareSection {  }
  .shareSection h4 {  }
   .shareSection p {  }
   
   .valueBox { border:3px solid #ddd; padding: 10px 20px; margin-top: 20px; }
   .valueBox h5 { font-weight: bold; margin-bottom: 5px; color: #d90000; } 
   
    /* Ci */

.ciHighlight {  padding: 40px; background: #eee; }
.ciHighlight .imgWrap { border:1px solid #ccc; }
.ciHighlight h4 { margin:15px 0 5px; }
.ciHighlight h4:first-child { margin-top: 0px; }

.ciRuleTable { border:1px solid #ccc; }
.ciRuleTable td { border-bottom:1px solid #ccc; padding: 10px; }
.ciRuleTable th { padding: 10px; text-align: center; vertical-align: middle; width:15%; }

.colorBox {  }
.colorBox h5 { color: #fff; font-weight: bold;  padding: 20px 15px;  margin-bottom: 0;}
.colorBox p { border:1px solid #ccc; border-top:none; padding: 10px 15px; font-size: 12px; color: #666;   }

 /* History */
 
 .historyContent {}
 
 h4.historyYear { font-family: roboto; font-size: 24px; font-weight: bold; margin-bottom: 15px; }
 .historyList {}
.historyList li { position: relative; padding-left: 30px;  margin-top: 15px;  line-height: 17px; font-size: 14px;   overflow: hidden; color: #666;}
.historyList li:first-child { margin-top: 0; }
.historyList li b { display: block;  position: absolute; left: 0px; top:0px; margin: 0; width: 80px;  line-height: 1.4em;  color: #222; }
 .historyList li.highlight { color: #d90000 !important;  }
  .historyList li.important {  font-size: 16px; padding: 0; color: #222; }
 
 
/* Culture */

.cultureSection h4 { font-size: 18px; margin: 20px 0 10px; }

.locationInfo h4 {  }
.shareSection .tabContents .col p { font-size: 13px; color: #777; }
.shareSection .tabContents h4 { color: #000; font-weight: bold; margin-bottom: 5px; }
.shareSection .tabContents > div > p { margin-bottom: 20px; color: #999; font-size: 13px; }

/* Location */

.locationInfo h4 { margin: 0; }
.locationGuide span { white-space: nowrap; }
.locationGuide i { margin: 0 10px; border-radius: 20px; background: #ccc; color: #fff; }

.mapWrap  { margin: 20px 0; } 
.mapWrap iframe { width: 100%; height: 420px; }

/* EthicsList */

.ethicsList1 li p { text-align: center; padding: 10px 20px; position: relative; }
.ethicsList1 li p:before, .ethicsList1 li p:after { content: ""; position: absolute; display: block; top:0px; bottom:0px; width: 10px; border:1px solid #ccc; }
.ethicsList1 li p:before { border-right:none; left: 0px; }
.ethicsList1 li p:after { border-left: none; right: 0px; }
.ethicsList1 li { margin-top: 20px; }

.ethicList2 { overflow: hidden; margin-bottom: 40px; }
.ethicList2  li  { margin-left: 2%; width: 15%; float: left; }
@media all and (max-width: 980px) { .ethicList2  li { width: 33.3%; margin: 0 0 20px; } }
@media all and (max-width: 479px) { .ethicList2  li { width: 50%;   } }
.ethicList2  li .iconWrap { padding: 10px; }
.ethicList2  li .iconWrap img { width: 100%; max-width: 180px; }
.ethicList2  li:first-child { margin-left: 0; }
.ethicList2  li h4 { font-weight: bold; margin: 0 0 0px; text-align: center; }
.ethicList2  li  p { text-align: center; color: #777; line-height: 1.3em; }

.markList2 { overflow: hidden;   text-align: center; }
.markList2 li {display: inline-block; width: 18%; text-align: center; color: #999; margin: 20px 0;  }
.markList2 li img { display: block; margin: 0 auto;  }


/* About */

.branchInfo {}
.branchInfo h5 { margin-bottom: 0px; margin-top: 20px; }
.branchInfo  p { color: #777;  }
.branchInfo .titleBox { width: 180px; height: 180px; border-radius: 90px; overflow: hidden; padding: 30px; background: #eee; box-sizing: border-box; float: left; margin-right: 20px; }
.branchInfo .titleBox h4 { text-align: center; font-size: 14px; }
.branchInfo .titleBox p { text-align: center; color: #d90000; }
.branchInfo .titleBox p b { font-size: 36px; font-family: roboto; font-weight: bold; }

/* Stock*/



.stockOverview { border }
.stockHighlight {  border-top:1px solid #666; border-bottom: 1px solid #ccc; height: 102px; overflow: hidden; border-right: 1px solid #ddd; }
.stockHighlight h3 { color: #333; font-size: 48px; line-height: 100px;  float: left; font-family: roboto; margin-right: 20px; }
.stockHighlight p { margin: 30px 0; line-height: 20px;   color: #666; font-size: 12px;} 
.stockHighlight p span { color: #333; margin-right: 20px;}

.stockOverview table.infoTable.stock td { text-align: center; }

.chartWrap { padding: 20px; border:1px solid #ddd; position: relative;  }
.chartWrap .chartTab { overflow: hidden; border:1px solid #ddd; float: left;  margin-bottom: 20px;}
.chartWrap .chartTab  a { border-left: 1px solid #ddd; display: block; color: #666;  float: left; padding: 0 20px; line-height: 30px; background: #eee; }
.chartWrap .chartTab  a:first-child { border-left: none; }
.chartWrap .chartTab  a:hover { background: #fff; }
.chartWrap .chartTab  a.active { background: #fff; color: #d90000; }

.dungrak1, .dungrak2 { color: #d90000 !important; }
.dungrak3 {  }
.dungrak5, .dungrak4 { color: #666 !important; }
.dungrak5:before, .dungrak4:before, .dungrak3:before, .dungrak2:before, .dungrak1:before { content: ""; font-family: xeicon; display: inline-block;    vertical-align: middle; }

.dungrak5:before, .dungrak4:before { content: "" }
.dungrak3:before { content: "";  }
.dungrak2:before, .dungrak1:before { content: ""; }
	
.noneArrow:before { display: none !important; }

.packageWrap { border:1px solid #ccc; position: relative; padding: 10px 20px 20px; text-align: center; }
.packageWrap h4 {  display: block;  padding: 0 10px ; background: #fff;  margin: -25px auto 20px; max-width: 220px; text-align: center;}
.packageWrap  h5 { text-align: center; }
.packageWrap  h5:after { content: ""; display: block; margin: 5px auto; border-top:2px solid #d90000; width: 20px; }
.packageWrap  p { text-align: center; font-size: 13px; color: #666; }

/* ProductModule */


/* 2020.10.16 joo 추가 */

/* about */
.companySection .number_info_group {
 padding: 80px 0;
 margin-left: -70px;
 margin-right: -70px;
}
.companySection .number_info_group .col {
 width: 33.33%;
 padding: 0 70px;
 margin-bottom: 30px;
 box-sizing: border-box;
}
.companySection .number_info_group .item .number_area {
 border-bottom: 3px solid #000;
 padding-bottom: 10px;
 margin-bottom: 20px;
 font-weight: 700;
 font-size: 30px;
 line-height: 1;
}
.companySection .number_info_group .item .number_area strong {
 display: inline-block;
 margin-right: 5px;
 font-size: 2.1em;
 font-weight: 900;
 letter-spacing: -.05em;
}
.companySection .number_info_group .item .desc {
 padding: 0 5px;
 font-size: 18px;
 color: #666;
}

.companySection .no1_wrap {
 position: relative;
 padding: 80px 0;
}
.companySection .no1_wrap:before {
 display: block;
 content: '';
 position: absolute;
 top: 0;
 left: 0;
 z-index: -1;
 width: 150%;
 height: 100%;
 background: #eee;
}
.companySection .no1_wrap .detail_info_area {
 position: relative;
 padding-left: 200px;
}
.companySection .no1_wrap .detail_info_area:before {
 display: block;
 content: '';
 position: absolute;
 left: -100px;
 top: 50%;
 width: 200px;
 height: 360px;
 margin-top: -180px;
 background: url(../images/sub/img_about_no1.png) 0 0 no-repeat;
}

.companySection .no1_wrap .detail_info_area .detail_info {
 display: inline-block;
 vertical-align: top;
 padding: 0 60px;
}
.companySection .no1_wrap .detail_info_area .detail_info h4.title {
 font-size: 36px;
 font-weight: 700;
 margin-bottom: 40px;
 color: #000;
}
.companySection .no1_wrap .detail_info_area .detail_info .dot_list>li {
 font-size: 18px;
 font-weight: 700;
}
.companySection .no1_wrap .detail_info_area .detail_info .dot_list>li:before {
 background: #ff3336;
}
.companySection .no1_wrap .detail_info_area .detail_info .dot_list>li span {
 color: #666;
}
.companySection .networks_wrap {
 padding: 80px 0;
}
.companySection .networks_wrap .networks_info {
 margin-left: -20px;
 margin-right: -20px;
}
.companySection .networks_wrap .networks_info .img_area {
 text-align: center;
}

.networksSection .state_wrap {
 border-bottom: 1px solid #dfdfdf;
}
.networksSection .img_txt_group {
 position: relative;
}
.networksSection .img_txt_group .txt_area {
 position: absolute;
 right: 70px;
 top: 100px;
 color: #fff;
}
.networksSection .img_txt_group .txt_area .title {
 color: #fff;
 text-align: right;
 font-size: 60px;
 line-height: 1;
 margin-bottom: 15px;
}
.networksSection .img_txt_group .txt_area .title:before {
 display: none;
}
.networksSection .img_txt_group .txt_area p {
 font-size: 20px;
 text-align: right;
 line-height: 1.2;
}
.networksSection .state_group {
 display: table;
 width: 100%;
 padding: 130px 0;
}
.networksSection .state_group>div {
 display: table-cell;
 vertical-align: middle;
}
.networksSection .state_group .ttl_area h1{
 font-size: 40px;
 margin-bottom: 40px;
}
.networksSection .state_group .button i.ic_link {
 margin-left: 10px;
 margin-right: -5px;
}
.networksSection .state_group .cnt_area {
 width: 780px;
}
.networksSection .state_group .state_item_group {
 margin-left: -20px;
 margin-right: -20px;
}
.networksSection .state_group .state_item_group .state_item_col {
 float: left;
 width: 33.33%;
 padding: 0 20px;
 box-sizing: border-box;
}
.networksSection .state_group .state_item {
 display: block;
 position: relative;
 width: 100%;
 min-width: 230px;
 padding-bottom: 100%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
 border-radius: 50%;
}
.networksSection .state_group .state_item:before {
 display: block;
 content: '';
 position: absolute;
 width: 100%;
 height: 100%;
 border: 1px solid #e6e6e6;
 border-radius: 50%;
}
.networksSection .state_group .state_item .txt {
 position: absolute;
 top: 50%;
 width: 100%;
 font-size: 18px;
 color: #666;
 transform: translateY(-50%);
}
.networksSection .state_group .state_item .txt .no {
 display: block;
 font-size: 3.1em;
 font-weight: 900;
 color: #000;
 text-align: center;
 line-height: 1;
}
.networksSection .state_group .state_item .txt p {
 text-align: center;
}
.networksSection .map_wrap {
 padding: 130px 0;
}
.productSection .overview_wrap {
 position: relative;
 padding: 200px 0 300px;
}
.productSection .overview_wrap:before {
 display: block;
 content: '';
 position: absolute;
 right: 300px;
 top: 310px;
 z-index: -1;
 width: 150%;
 height: 430px;
 background: #f9f9f9;
}
.productSection .overview_wrap .ttl_area {
 margin-bottom: 110px;
}
.productSection .overview_wrap .ttl_area h2 {
 margin-bottom: 30px;
 font-size: 52px;
 font-weight: 400;
 line-height: 1.3;
}
.productSection .overview_wrap .ttl_area p {
 font-size: 18px;
 color: #777;
}
.productSection .overview_wrap .img_area {
 position: absolute;
 right: -30px;
 top: 140px;
}
.productSection.ezray .overview_wrap {
 padding-bottom: 200px;
}
.productSection.ezray .overview_wrap:before {
 top: 240px;
 right: 0;
 margin-top: 0px;
}
.productSection.ezray .overview_wrap .img_area {
 right: -20px;
 top: 120px;
 margin-top: 0;
}

.superior_wrap {
 padding: 100px 0;
}
.superior_wrap .txt_group,
.superior_wrap .img_area {
 float: left;
 width: 50%;
}
.superior_wrap .info_item + .info_item {
 margin-top: 30px;
}
.superior_wrap .info_item h2{
 font-size: 28px;
 color: #959595;
 margin-bottom: 10px;
}
.superior_wrap .info_item p {
 color: #fff;
}
.superior_wrap .img_area {
 padding-top: 40px;
}
.imging_wrap {
 padding: 100px 0;
}
.imging_wrap .img_group {
 margin-bottom: 100px;
 margin-left: -10px;
 margin-right: -10px;
}
.imging_wrap .img_group:after {
 display: block;
 content: '';
 clear: both;
}
.imging_wrap .img_col {
 float: left;
 padding: 0 10px;
}
.imging_wrap .img_item + .img_item {
 margin-top: 10px;
}
.imging_wrap .img_item p{
 font-size: 18px;
 line-height: 30px;
}

.productSection.ezray .info_wrap {
 padding: 100px 0;
}

.productSection.ezray .info_wrap .ttl_area h2{
 font-size: 40px;
 font-weight: 700;
 letter-spacing: -.03em;
}

.productSection.ezray .info_wrap .dot_list li {
 font-size: 18px;
 margin-bottom: 10px;
}
.productSection.ezray .info_wrap .img_area {
 margin-top: 60px;
}
.productSection.ezray .info_wrap.innovation_wrap .img_area{
 margin-left: -20px;
 margin-top: 60px;
}
.productSection.ezray .info_wrap.central_wrap .video_area {
 margin-top: 60px;
}

.rndSection {}

.rndSection .overview_wrap .ttl_area .title {
 text-align: left;
 font-size: 42px;
 margin-bottom: 10px;
}
.rndSection .overview_wrap .ttl_area .title:before {
 margin: 0 0 15px;
}
.rndSection .overview_wrap .ttl_area p {
 font-size: 18px;
 color: #777;
}

.rndSection .number_info_group {
 padding: 80px 0;
 margin-left: -10px;
 margin-right: -10px;
}
.rndSection .number_info_group .col {
 width: 25%;
 padding: 0 10px;
 box-sizing: border-box;
}
.rndSection .number_info_group .item .number_area {
 border-bottom: 3px solid #000;
 padding-bottom: 10px;
 margin-bottom: 20px;
 font-weight: 700;
 font-size: 30px;
 line-height: 1;
}
.rndSection .number_info_group .item .number_area strong {
 display: inline-block;
 margin-right: 5px;
 font-size: 2.1em;
 font-weight: 900;
 letter-spacing: -.05em;
}
.rndSection .number_info_group .item .desc {
 padding: 0 5px;
 font-size: 18px;
 color: #666;
}
.rndSection .ttl_area h3 {
 margin-bottom: 30px;
 font-size: 32px;
 font-weight: 700;
}
.rndSection .tech_wrap,
.rndSection .infra_wrap{
 padding: 100px 0;
}
.rndSection .bg {
 background: #eee;
}

.rndSection .tech_wrap .tech_item {
 background: #fff;
 border: 1px solid #e2e2e2;
}
.rndSection .tech_wrap .tech_item .txt_area {
 padding: 20px 15px;
}
.rndSection .tech_wrap .tech_item .txt_area h4 {
 margin-bottom: 6px;
 font-size: 24px;
 font-weight: 700;
}
.rndSection .tech_wrap .tech_item .txt_area p {
 min-height: 75px;
 letter-spacing: -.03em;
 color: #777;
 font-size: 16px;
 line-height: 1.6;
}
.infra_wrap .tbl_area.networks_area td{
 padding: 30px 0 10px;
}
.infra_wrap .tbl_area.clinical_area {
 margin-top: 60px;
}
.infra_wrap .tbl_area.clinical_area td{
 padding: 20px 0;
}
.techSection > .setWidth > .ttl_area {
 margin-bottom: 100px;
}
.techSection > .setWidth > .ttl_area h2,
.techSection > .setWidth > .ttl_area p {
 text-align: center;
}
.techSection > .setWidth > .ttl_area h2 {
 margin-bottom: 20px;
 font-size: 40px;
 font-weight: 700;
 line-height: 1.4;
}
.techSection > .setWidth > .ttl_area p {
 color: #777;
}
.techSection .overview_wrap {
 position: relative;
 padding: 110px 0 300px;
}
.techSection .overview_wrap:before {
 display: block;
 content: '';
 position: absolute;
 right: 0;
 top: 200px;
 z-index: -1;
 width: 150%;
 height: 430px;
 background: #f9f9f9;
}
.techSection .overview_wrap .ttl_area {
 margin-bottom: 110px;
}
.techSection .overview_wrap .ttl_area h2 {
 margin-bottom: 30px;
 font-size: 52px;
 font-weight: 700;
 line-height: 1.3;
}
.techSection .overview_wrap .ttl_area p {
 font-size: 18px;
 color: #777;
}
.techSection .overview_wrap .info_area .down_num {
 position: relative;
 padding-left: 100px;
}
.techSection .overview_wrap .info_area .down_num:before {
 display: block;
 content: '';
 position: absolute;
 left: 0;
 bottom: 28px;
 width: 90px;
 height: 90px;
 background: url(../images/sub/img_tech_downarw.png) 0 0 no-repeat;
}
.techSection .overview_wrap .info_area .down_num strong {
 display: inline-block;
 font-size: 136px;
 line-height: 100px;
 letter-spacing: ;
}
.techSection .overview_wrap .info_area .down_num .unit {
 display: inline-block;
 font-size: 40px;
 line-height: 1;
}
.techSection .overview_wrap .info_area .down_num .unit small {
 display: block;
 font-size: .4em;
}

.techSection .overview_wrap .img_area {
 position: absolute;
 right: -90px;
 top: -23px;
}

.scan_wrap .box_cnt {
 display: table;
 width: 100%;
 padding: 40px;
 border: 1px solid #e1e1e1;
 box-sizing: border-box;
}
.scan_wrap .box_cnt >div {
 display: table-cell;
 vertical-align: middle;
}
.scan_wrap .box_cnt .ttl_area {
 padding-right: 60px;
}
.scan_wrap .box_cnt .ttl_area h2 {
 font-size: 32px;
 font-weight: 700;
 margin-bottom: 20px;
}
.scan_wrap .box_cnt .ttl_area p {
 color: #777;
}
.scan_wrap .box_cnt .img_area {
 text-align: right;
}

.techSection .info_wrap {
 padding: 140px 0 100px;
}
.techSection .info_wrap .ttl_area {
 margin-bottom: 40px;
}

.techSection .info_wrap .ttl_area h2 {
 margin-bottom: 20px;
 font-size: 32px;
 font-weight: 700;
}
.techSection .info_wrap .ttl_area p {
 color: #777;
}
.techSection .info_wrap .img_group {
 margin-left: -6px;
 margin-right: -6px;
}
.techSection .info_wrap .img_group .img_area {
 float: left;
 padding: 0 6px;
 box-sizing: border-box;
}
.techSection .info_wrap .img_group .img_area:last-child {
 margin-top: 12px;
}
.techSection .info_wrap + .info_wrap {
 padding-top: 0;
}
.techSection .detail_group {
 margin-top: 50px;
}
.techSection .detail_group .detail_item {
 display: table;
 width: 100%;
 padding: 50px 0;
}
.techSection .detail_group .detail_item + .detail_item {
 border-top: 1px solid #dadada;
}
.techSection .detail_group .detail_item>div {
 display: table-cell;
 vertical-align: middle;
}
.techSection .detail_group .detail_item .txt_area {
 padding-left: 20px;
}
.techSection .detail_group .detail_item h3 {
 position: relative;
 margin-bottom: 15px;
 font-size: 28px;

 line-height: 1.3;
}
.techSection .detail_group .detail_item h3:before {
 display: block;
 content: '';
 position: absolute;
 left: -20px;
 top: 3px;
 width: 2px;
 height: 1em;
 background: #ff2629;
}
.techSection .detail_group .detail_item p {
 color: #777;
}
.techSection .detail_group .detail_item .img_area {
 text-align: right;
}
.techSection.sw .overview_wrap {
 padding-bottom: 100px;
}
.techSection.sw .overview_wrap:before {
 bottom: 400px;
 height: auto;
}

.techSection.sw .overview_wrap .txt_group .ttl_area,
.techSection.sw .overview_wrap .txt_group .ttl_area p {
 color: #ffc000;
}
.techSection.sw .overview_wrap .ttl_area,
.techSection.sw .segment_wrap .ttl_area{
 margin-bottom: 50px;
}
.techSection.sw .overview_wrap .txt_group .ttl_area h1 {
 display: inline-block;
 font-size: 132px;
 line-height: 1;
 margin-left: -10px;
}
.techSection.sw .overview_wrap .txt_group .ttl_area h1:before {
 font-size: .25em;
 top: 12px;
}
.techSection.sw .overview_wrap .txt_group .ttl_area p {
 font-size: 36px;
}
.techSection.sw .overview_wrap .txt_group > p {
 margin-bottom: 50px;
 font-size: 18px;
 color: #777;
}
.techSection.sw .overview_wrap .txt_group > p strong {
 color: #000;
 font-weight: 700;
}
.techSection.sw .overview_wrap .img_area.bg_img {
 position: relative;
 height: 672px;
 right: 0;
}
.techSection.sw .swtech_main {
 display: block;
 position: absolute;
 top: 0;
 left: -320px;
 right: 0;
 height: 672px;
 background: url(../images/sub/img_swtech_main.png) right 0 no-repeat;

}
.techSection.sw .overview_wrap .img_area {
 position: static;
 top: auto;
 left: auto;
}

.tracing_group {
 padding-top: 170px;
}
.tracing_group .img_area {
 padding-top: 50px;
}
.tracing_group .img_area .img_col {
 float: left;
}
.tracing_group .img_area .img_col:last-child {
 float: right;
}
.techSection.sw > .setWidth > .ttl_area {
 margin-bottom: 0;
}
.techSection.sw .ttl_area h3 {
 font-size: 32px;
 font-weight: 700;
}
.techSection.sw .txt_area h6{
 font-size: 20px;
 font-weight: 700;
 margin-bottom: 10px;
}
.techSection.sw .txt_area p {
 color: #777;
 line-height: 1.6;
}

.techSection.sw .segment_wrap {
 padding-bottom: 100px;
}
.techSection.sw .segment_wrap .img_area {
 margin-top: 50px;
}
.techSection.newtech .overview_wrap:before {
 display: none;
}
.techSection.newtech .tabs_area {
 margin-bottom: 170px;
}

.techSection.newtech .img_area.bg_img {
 position: relative;
 top: 0;
 right: 0;
 height: 830px;
}
.techSection.newtech .overview_wrap {
 padding: 0;
}
.techSection.newtech .img_area .zirconia_main {
 display: block;
 position: absolute;
 top: 0;
 left: -320px;
 right: 0;
 height: 830px;
 background: url(../images/sub/img_newtech_1_1.png) right 0 no-repeat;
}
.techSection.newtech .txt_area {
 position: relative;
 z-index: 10;
 float: right;
 width: 600px;
 margin-top: -120px;
 padding: 45px 50px;
 margin-bottom: 150px;
 background: #fff;
 box-sizing: border-box;
}
.techSection.newtech .txt_area h3 {
 font-size: 36px;
 font-weight: 700;
 margin-bottom: 20px;
 line-height: 1.3;
}
.techSection.newtech .txt_area p {
 font-size: 15px;
 letter-spacing: -.035em;
 color: #777;
}
.techSection.newtech .txt_area p + p {
 margin-top: 15px;
}
.techSection.newtech .perfit_wrap .txt_area {
 margin-bottom: 50px;
}
.techSection.newtech.new_2 .img_area.bg_img {
 position: relative;
 top: 0;
 right: 0;
 height: 900px;
}

.techSection.newtech.new_2 .img_area .cnt_main {
 display: block;
 position: absolute;
 top: 0;
 left: -320px;
 right: 0;
 height: 900px;
 background: url(../images/sub/img_newtech_2_1.png) right 0 no-repeat;
}
.techSection.newtech.new_2 .overview_wrap {
 margin-bottom: 200px;
}
.techSection.newtech.new_2 .overview_wrap h1{
 position: absolute;
 left: 80px;
 bottom: -60px;
 z-index: 10;
 font-size: 126px;
 color: #eee;
 line-height: 1;
 font-weight: 700;
 letter-spacing: -.07em;
}

.step_area {
 margin-bottom: 50px;
}
.step_area .step_group,
.step_area .step_group .step_col {
 float: left;
}
.step_area .step_group {
 position: relative;
}
.step_area .step_group:before,
.step_area .step_group:after {
 display: block;
 content: '';
 position: absolute;
 top: 50%;
 left: 100%;
 background: #ff3336;
 border-radius: 50%;
}
.step_area .step_group:before {
 left: 100%;
 width: 145px;
 height: 1px;

}
.step_area .step_group:after {
 width: 8px;
 height: 8px;
 margin-top: -4px;
 margin-left: 145px;
}
.step_area .step_group .step_col + .step_col {
 margin-left: -18px;
}
.step_area .step_group .step_item {
 position: relative;
 width: 230px;
 height: 230px;
 border-radius: 50%;
 background: rgba(0,0,0,.07);
}
.step_area .step_group .step_item .no,
.step_area .step_group .step_item p {
 position: absolute;
 font-size: 20px;
 text-align: center;
}
.step_area .step_group .step_item .no {
 top: 30px;
 left: 50%;
 width: 34px;
 margin-left: -17px;
 background: #000;
 padding: 3px 0;
 color: #fff;
 font-weight: 700;
 line-height: 1;
}
.step_area .step_group .step_item p {
 left: 0;
 top: 50%;
 width: 100%;
 margin-top: 10px;
 line-height: 1.2;
 transform: translateY(-50%);
}
.step_area .img_area {
 width: 240px;
 float: right;
 margin-top: -40px;
}
.techSection.newtech.new_2 .rescue_item {
 border: 1px solid #eee;
}
.techSection.newtech.new_2 .rescue_item .txt_area {
 background-position: right 30px center;
 background-repeat: no-repeat;
}
.techSection.newtech.new_2 .rescue_item.digital .txt_area {
 background-image: url(../images/sub/img_newtech_2_rescue_1.png);
}
.techSection.newtech.new_2 .rescue_item.analog .txt_area {
 background-image: url(../images/sub/img_newtech_2_rescue_2.png);
}


.techSection.newtech.new_2 .txt_area {
 width: auto;
 float: none;
 margin-bottom: 0;
 margin-top: 0;
}
.techSection.newtech.new_2 .ttl_area h2 {
}
.techSection .rescue_wrap,
.techSection .strength_wrap {
 padding: 100px 0;
}
.techSection .strength_wrap {
 padding-bottom: 0;
}
.techSection .rescue_wrap .ttl_area,
.techSection .strength_wrap .ttl_area {
 margin-bottom: 30px;
}
.rescue_wrap .ttl_area h3,
.strength_wrap .ttl_area h3 {
 font-size: 28px;
 font-weight: 700;
 text-align: center;
}

.techSection .rescue_wrap .txt_area h2,
.strength_group .strength_item h2 {
 position: relative;
 font-size: 20px;
 margin-bottom: 10px;
 font-weight: 700;
}
.techSection .rescue_wrap .txt_area h2:before,
.strength_group .strength_item h2:before {
 display: block;
 content: '';
 position: absolute;
 left: -15px;
 top: 5px;
 width: 2px;
 height: 1em;
 background: #ff3336;
}
.strength_group .strength_item {
 display: table;
 width: 100%;
 border-top: 1px solid #eee;
}
.strength_group .strength_item > div {
 display: table-cell;
 vertical-align: middle;
 padding: 30px 0;
}
.techSection.newtech.new_2 .strength_item .txt_area {
 width: 50%;
}

.techSection.newtech.new_2 .video_area {
 margin: 100px 0;
}

.networksSection .networks_info .mob{display: none;}
.companySection .networks_info .mob{display: none;}
#content>h1{display: none;}

/* 201022 hayeon - top area */
.sns_btns i{display: inline-block; vertical-align: middle; background-size: contain;}
.sns_btns .ic_blog{width: 34px; height: 16px; background: url(../images/ic_blog.png)center no-repeat;}
.sns_btns .ic_youtube{width: 24px; height: 17px; background: url(../images/ic_youtube.png)center no-repeat;}


/*CIsection*/


.CIsection .vatech_logo,.CIsection .vatech_color{box-sizing: border-box;display:flex;align-items: center;justify-content: space-between;}
.CIsection .vatech_logo{
 padding-bottom:100px;margin-bottom:100px;
 border-bottom:1px solid #e5e5e5;
}

.CIsection .vatech_logo .img_area{position:relative;}
.CIsection .vatech_logo .img_area #CI_download{
 width:240px;
 height:50px;
 display:block;
 position:absolute;;
 right:0;
 bottom:0;
 transform:translateY(50%);
 background:#dc062f;
 text-align:center;line-height:50px;color:white;font-size:16px;
 letter-spacing: -1px;
}

.CIsection .ttl_area{margin:100px 0;}
.CIsection .ttl_area h1{font-size:52px;}
.CIsection .txt_group{box-sizing: border-box;width:50%;padding-right:70px;}
.CIsection .txt_group p{font-size:18px;margin-bottom:30px;}

.CIsection .img_area{width:50%;max-width:640px;}
.CIsection figure{width:100%;height:330px;border:1px solid #e5e5e5;text-align:center;line-height:330px;padding:0    20px; box-sizing: border-box;}
.CIsection #CI_download::after{
 content:"";
 display:inline-block;
 width:16px;
 height:16px;
 background-image: url('http://www.vatech.co.kr/files/attach/images/5045/047/005/269adc14b0a1c8505aa77039bc101b22.png');
 background-position: center center;
 background-size: contain;
 background-repeat: no-repeat;
 margin-top:5px;
 margin-left:10px;
 margin-bottom:-2px;transition:margin 0.3s;
}
.CIsection #CI_download:hover::after{
 margin-left:20px;
}

@media all and (max-width: 980px) {
  .slogan { font-size: 18px; }
 .roundNumList { display: block; }
 .roundNumList > li { display: list-item; margin-top: 15px; }
 .roundNumList > li:first-child { margin-top: 0; }

  h2.title,  h3.title { font-size: 30px;}
  
  .pictoList li .iconWrap { width: 200px; }
  .cultureSection h4 { margin-top: 0; }
  .mapWrap iframe { height:  320px; }
}

@media all and (max-width: 740px) {
.ciHighlight { padding: 20px; } 
 h2.title,  h3.title { font-size: 24px;}
 p.titleSub.small { font-size: 14px; }
.pictoList li .iconWrap { width: 100%; float: none; }
.pictoList li h4 { text-align: center; }
.companySection > .imgWrap { margin-bottom: 20px; }
.companySection .slogan { margin-bottom: 15px; }
.companySection h4 { margin-bottom: 0; }
.imgWrap .caption { font-size: 12px; padding: 5px 10px; }

.packageWrap {padding: 10px 5px}
 .CIsection .vatech_logo,
 .CIsection .vatech_color{display:block;}
 .CIsection .txt_group,
 .CIsection .img_area{width:100%;}
 .CIsection .txt_group{padding-right:0;}
 .CIsection .ttl_area h1{font-size:30px;}
 .CIsection .ttl_area{margin-bottom:50px;}
 .CIsection .vatech_logo{margin-bottom:50px;}
 .CIsection .txt_group p{font-size:16px;}
 .CIsection figure{height:200px;line-height:200px;}
}

@media all and (max-width: 479px) {
  .tileList li { width: 100%; }
  .tileList.doubleColumn li { width: 50%; }
  .mapWrap {height:300px;}
  .mapWrap iframe { height:  280px; }
 .branchInfo .titleBox { zoom: 0.8; } 
 .branchInfo  p { font-size: 13px; } 
 .branchInfo h5 { margin-top: 10px; } 
 
 }
@media all and (max-width: 320px) {
 
}


.f_vatech{
 font-family: 'Vatech', 'NanumSquare', NanumGothic, ng, sans-serif;
}


