@charset "utf-8";

/* ************************************ SUB VIAUAL ************************************ */
#subVisual{position:relative; overflow:hidden; width:100%; height:356px; margin-top:100px;}
#subVisual .visualVideo{
	position:absolute; 
	top:0px; 
	left:0px; 
	width:100%;
	height:100%;
}
#subVisual .visualVideo > video{min-width:100%; min-height:100%; object-fit: cover;}
#subVisual .visualVideo > iframe{min-width:100%; min-height:100%;}
#subVisual .visualImg{
	position:absolute; 
	top:0px; 
	left:0px; 
	width:100%;
	height:100%;
	background-size:cover !important;
	-webkit-transition:transform 1500ms  cubic-bezier(0, 0.41, 0.58, 1) ;
	-moz-transition:transform 1500ms cubic-bezier(0, 0.41, 0.58, 1) ;
	-o-transition:transform 1500ms cubic-bezier(0, 0.41, 0.58, 1) ;
	-ms-transition:transform 1500ms cubic-bezier(0, 0.41, 0.58, 1) ;
    transition:transform 1500ms cubic-bezier(0, 0.41, 0.58, 1) ;
	-ms-transform: scale(1.1,1.1) rotate(0.002deg);
    -o-transform: scale(1.1,1.1) rotate(0.002deg);
    -moz-transform: scale(1.1,1.1) rotate(0.002deg);
    -webkit-transform: scale(1.1,1.1) rotate(0.002deg);
     transform: scale(1.1,1.1) rotate(0.002deg);
}
#subVisual .visualTxt{position:relative; z-index:9; width:100%; height:100%; text-align:center; line-height:1.2; color:#fff;}
#subVisual .visualTxtBox{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:100%; padding:0px 30px;}
#subVisual .visual-category,
#subVisual .visual-txt{
	opacity:0;filter:Alpha(opacity=0);
	-ms-transform: translateY(30px); 
    -o-transform: translateY(30px); 
    -moz-transform: translateY(30px);
    -webkit-transform: translateY(30px); 
     transform: translateY(30px);
	-webkit-transition:opacity 1.0s, transform 1.0s;
	-moz-transition:opacity 1.0s, transform 1.0s;
	-o-transition:opacity 1.0s, transform 1.0s;
	-ms-transition:opacity 1.0s, transform 1.0s;
	transition:opacity 1.0s, transform 1.0s;
}
#subVisual .visual-category{
	font-weight:600; 
	font-size:44px; 
	margin-bottom:40px;
}
#subVisual .visual-txt{
	font-size:20px; 
	font-weight:300; 
	padding-bottom:7px;
	-webkit-transition-delay:0.3s;
	-moz-transition-delay:0.3s;
	-o-transition-delay:0.3s;
	-ms-transition-delay:0.3s;
	transition-delay:0.3s;
}
/* SubVisual :: active */
#subVisual.active .visualImg{
	-ms-transform: scale(1.0,1.0) rotate(0.002deg);
    -o-transform: scale(1.0,1.0) rotate(0.002deg);
    -moz-transform: scale(1.0,1.0) rotate(0.002deg);
    -webkit-transform: scale(1.0,1.0) rotate(0.002deg);
     transform: scale(1.0,1.0) rotate(0.002deg);
}
#subVisual.active .visual-category,
#subVisual.active .visual-txt{
	opacity:1.0;filter:Alpha(opacity=100);
	-ms-transform: translateY(0px); 
    -o-transform: translateY(0px); 
    -moz-transform: translateY(0px);
    -webkit-transform: translateY(0px); 
     transform: translateY(0px);
}
/* -------- SubVisual 반응형 -------- */
@media all and (max-width:1024px){
	#subVisual .visual-category{font-size:38px;margin-bottom:30px;}
}
@media all and (max-width: 991px){
    #subVisual{margin-top:80px;}
	#subVisual .visual-category{font-size:33px;}
	#subVisual .visual-txt{font-size:18px;}
}
@media all and (max-width: 768px){
    #subVisual{margin-top:60px;}
	#subVisual .visualTxt{height:calc(100% - 45px);}
}
@media all and (max-width: 767px){
    #subVisual{height:250px; min-height:auto;}	
	#subVisual .visual-category{font-size:23px;margin-bottom:20px;}
	#subVisual .visual-txt{font-size:16px;}
}

/* ************************************ SUB MENU ************************************ */
/* --------  SUB MENU PC -------- */
#subMenuPC{position:relative; margin-top:0px; width:100%; display:block; height:70px; background-color:#fff; border-bottom: 1px solid #bbb; z-index:11}
#subMenuPC .subMenuInner{text-align:left; width:100%; height:70px;}
#subMenuPC .subMenuInner ul{
  display:table;position:relative;width:100%;height:70px;
  list-style: none;
}
#subMenuPC .subMenuInner ul li {
  display:table-cell; vertical-align:middle;
  font-size:100%;font-weight:400;color:#001848;
}
#subMenuPC .subMenuInner ul li > a{font-size:100%;font-weight:400;color:#001848;}
#subMenuPC .subMenuInner ul li > span{color: #1e8ab1;}
#subMenuPC.fixed {position:fixed; width:100%; top:0px; left:0; height:70px; margin-top:0px; z-index:9999;}/* SUB MENU PC :: FIXED */
#subMenuMobile{display:none;}/* SUB MENU MOBILE :: HIDDEN */
/* -------- SUB MENU :: 반응형 -------- */
@media all and (max-width: 991px){
    #subMenuPC,
	#subMenuPC .subMenuInner,
    #subMenuPC .subMenuInner ul	{height:60px;}
}
@media all and (max-width:768px){
	#subMenuPC{display:none} /*  SUB MENU PC :: HIDDEN */
    /* --------  SUB MENU MOBILE -------- */
	#subMenuMobile{position:relative; margin-top:-45px; width:100%; display:block; height:45px; background-color:#001848; z-index:11}
	#subMenuMobile .subMenuInner{height:45px }
	#subMenuMobile .menu-location{position:relative;}
	#subMenuMobile .menu-location > .cur-location{position:relative; display:block; height:44px; padding:0 30px 0 15px;}
	#subMenuMobile .menu-location > .cur-location span{display:block; white-space:nowrap; overflow:hidden; font-size:15px; text-overflow:ellipsis; line-height:44px; color:#fff; font-weight:400; font-size:15px;}
	#subMenuMobile .menu-location > .cur-location .arrow{position:absolute; top:50%; right:10px; width:20px; height:20px;margin-top:-12px; font-size:20px; color:#fff;}
	#subMenuMobile .menu-location > .cur-location .arrow i{color:#fff;}
	#subMenuMobile .menu-location > .cur-location.open .arrow{transform:rotate(-180deg); margin-top:-10px;}
	
	#subMenuMobile .menu-location .location-menu-con{display:none; position:absolute; top:44px; left:0px; width:100%; background-color:#f9f9f9;border-bottom:1px solid #e5e5e5; z-index:11; padding-top:10px;padding-bottom:10px;}
	#subMenuMobile .menu-location.location1 .location-menu-con{width:calc(100% - 1px)}
	#subMenuMobile .menu-location .location-menu-con li{position:relative;}
	#subMenuMobile .menu-location .location-menu-con li a{display:block; padding:7px 15px; font-size:15px; line-height:1.5; word-break:keep-all; color:#001848;}
	#subMenuMobile .menu-location .location-menu-con li a .gnb-icon{position:absolute; top:5px; right:10px; }
	#subMenuMobile .menu-location .location-menu-con li.on a{color:#1e8ab1; font-weight:500;}
}



/* ************************************  :: TAB 스타일 ::  ************************************ */
.tabArea{padding:4% 0 0;}
.tabArea ul{display:flex; flex-wrap: wrap; justify-content:center;}
.tabArea ul li{flex:1; -ms-flex: 1;border:1px solid #1e8ab1;background-color:#fff;}
.tabArea ul li{margin-left:-1px}/*탭 붙은 스타일*/
.tabArea ul li{margin-left:10px;}
.tabArea ul li:first-child{margin-left:0;}
.tabArea ul li > a{
	display:table; 
	position:relative;
	width:100%;
	height:66px;line-height:1.2;
	text-align:center;
	color:#1e8ab1; 
	font-size:110%; 
	font-weight:500;
	word-break:keep-all;
}
.tabArea ul li > a > span{display:table-cell; vertical-align:middle; padding:0 18px;}
.tabArea ul li:hover{background-color:#f9f9f9;}
.tabArea ul li.on{background-color:#1e8ab1;}
.tabArea ul li.on> a{color:#fff;}
/* -------- TAB 스타일 :: 반응형 -------- */
@media all and (max-width:1024px){
    .tabArea ul li > a{font-size:110%;}
    .tabArea ul li > a{height:56px;}
}
@media all and (max-width:768px){
    .tabArea ul li{flex:100%; margin-left:0px; margin-bottom:-1px;}
    .tabArea ul li:last-child{margin-bottom:0}
    .tabArea ul li > a{font-size:120%;height:40px;}
}



/* ************************************ CONTENT  :: 컨텐츠 레이아웃 ************************************ */
#content{padding:5% 0 10%;}
.subTitle{font-size:40px;font-weight:600;text-align:center;margin-bottom:2%;}
.subTitleBar{text-align:center;margin-bottom:5%;}
.contentsTit{font-size:160%;}
/* -------- 컨텐츠 레이아웃 :: 반응형 -------- */
@media all and (max-width:1400px){
	#content{padding:7% 0 12%}
}
@media all and (max-width:1024px){
	#content{padding:8% 0 13%}	
    .subTitle{font-size:36px;}
	.subTitleBar{margin-bottom:7%;}
}
@media all and (max-width:991px){
    .subTitle{font-size:33px;}
	.contentsTit{font-size:150%;}
}
@media all and (max-width: 767px) {
	.subTitleBar{margin-bottom:10%;}
}
@media all and (max-width:575px){
	#content{padding:30px 0px 50px}
    .subTitle{font-size:23px;}
}



/* ************************************  OUR TECHNOLOGY  ************************************ */
/* ---------------- Overview ---------------- */
.txtBanner{position:relative; overflow:hidden; width:100%; height:100%; min-height:420px; overflow:hidden; background-size:cover;}
.txtBanner .txtBannerBox{
	position:absolute; top:50%; left:0px; width:70%; margin:0 15%; padding:5% 5%; background-color:rgba(255, 255, 255, 0.8);z-index:2;
	-ms-transform: translateY(-50%); 
    -o-transform: translateY(-50%); 
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%); 
    transform: translateY(-50%);
	text-align:center;
}
.txtBannersub{display:block; font-size:120%; font-weight:500; margin-bottom:20px;}
.txtBannerTxt{display:block; font-size:200%; font-weight:600;}
.overviewTxt{font-size:110%;}
/* Button 스타일 */
.button02{
	cursor:pointer;display:inline-block;margin:40px 0 0;padding:10px 25px;border:1px solid #667491;background:transparent;font-size:90%;font-weight:400;color:#001848;
	-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s
}
.button02:hover{background-color:#001848;color:#fff;}
.button02 i{display:inline-block;margin-left:30px;}

@media all and (max-width:1024px){
.txtBanner{min-height:400px;}
.txtBannerTxt{font-size:190%;}
}
@media all and (max-width:768px){
.txtBanner{min-height:360px;}
.txtBanner .txtBannerBox{padding:6% 8%;}
.txtBannerTxtsub{font-size:100%;}
.txtBannerTxt{font-size:170%;}
.button02{font-size:100%;margin:30px auto 0px;}
}
@media all and (max-width:575px){
.button02{margin:20px auto 0px;}
}

/* ---------------- PMPC ---------------- */
/* UL style*/
.ListLineBlue{width:100%;margin:0 auto;list-style-image: url('/imgs/common/dot_line.jpg');}
.ListLineBlue li{padding:7px 0 27px 10px;}
.ListLineBlue li:last-child{padding:7px 0 0 10px;}

.ListDotSquareBlue{width:100%;margin:0 auto;list-style-image: url('/imgs/common/dot_square.jpg');}
.ListDotSquareBlue li{padding:5px 0 5px 10px;text-align:left;}
/* BOX style*/
.BoxGreyTitCon{width:100%;background-color:#f2f2f2;border:1px solid #ddd;padding:12px 20px;text-align:left;}
.BoxGreyCon{width:100%;background-color:#fff;border-left:1px solid #ddd;border-right:1px solid #ddd;border-bottom:1px solid #ddd;padding:30px 20px;margin-bottom:0;text-align:center;}
.BoxGreyTit{font-size:110%;font-weight:500;color:#1e8ab1;}
.BoxGreyTit span{font-size:90%;font-weight:400;color:#636363;}
.BoxGreyTxt{font-size:100%;font-weight:400;line-height:1.3;margin-bottom:40px;text-align:left;}
.BoxGreyCon img{width:100%; max-width:100%; height: auto; margin:0 auto;}

.BoxBlueTitCon{width:100%;background-color:#1e8ab1;border:1px solid #1e8ab1;padding:12px 20px;text-align:center;}
.BoxBlueCon{width:100%;background-color:#fff;border-left:1px solid #1e8ab1;border-right:1px solid #1e8ab1;border-bottom:1px solid #1e8ab1;padding:50px 20px;margin-bottom:0;text-align:center;}
.BoxBlueTit{font-size:110%;font-weight:500;color:#fff;}
.BoxBlueTit span{font-size:90%;font-weight:400;color:#636363;}
.BoxBlueTxt{font-size:100%;font-weight:400;line-height:1.3;margin-bottom:40px;}
.BoxBlueCon img{width:100%; max-width:100%; height: auto; margin:0 auto;}
/* BG style*/
.bgGrey{background-color:#f8f8f8;padding:5% 0;margin-bottom:7%;}
/* TXT style*/
.txtSub01{font-size:90%;color:#1e8ab1;padding-left:10px;}

@media all and (max-width: 991px){
.ListLineBlue{list-style:none;}
.ListLineBlue li{padding:7px 0 27px 0;}
.ListLineBlue li:last-child{padding:7px 0 10px 0;}
.txtSub01{padding-left:0px;}
.BoxGreyCon{margin-bottom:30px;}
.BoxGreyTxt{text-align:center;}
.BoxBlueCon{padding:30px 20px;margin-bottom:30px;}
.bgGrey{padding:10% 0 5%;margin-bottom:10%;}
}

/* ---------------- Biocompatible Surface Platform ---------------- */
/* Carousel style*/
.imgCarouselCon{position:relative; width:100%; height:400px;}
.imgSlide{position:relative;width:100%; height:100%;}
.imgSlide .slick-slider,
.imgSlide .slick-list,
.imgSlide .slick-track,
.imgSlide .imgSlide-item{height:100%; z-index:2;}
.imgSlide .imgSlide-inner{position:absolute; left:0; top:0; width:100%; height:100%; background-size:cover !important ; 
    -webkit-transition:all 1s;
	-moz-transition:all 1s;
	-o-transition:all 1s;
	-ms-transition:all 1s;
	transition:all 1s
} 
.imgSlide .slick-prev{position:absolute; left:0; bottom:calc(50% - 25px); width:50px; height:50px; z-index:3; background:rgba(255,255,255,0.5);}
.imgSlide .slick-next{position:absolute; right:0; bottom:calc(50% - 25px); width:50px; height:50px; z-index:3; background:rgba(255,255,255,0.5);}
.imgSlide .slick-prev i{font-size:33px; font-weight:500; color:#1e8ab1; vertical-align:middle;}
.imgSlide .slick-next i{font-size:33px; font-weight:500; color:#1e8ab1; vertical-align:middle;}
/* BG style*/
.bgImg{position:relative; overflow:hidden; width:100%; height:100%; min-height:860px; padding:5% 0; background-size:cover !important;}



/* ************************************  OUR PIPELINE  ************************************ */
/* ---------------- BMH™ Shell ---------------- */
.paragraphTitCon{background:#f6f6f6 url(/imgs/pipeline/titBgLine.jpg) no-repeat 50% 50%;margin-bottom:8%;}
.paragraphTit{font-family:'Caladea';font-size:180%;font-weight:700;font-style:italic;color:#1e8ab1;text-align:center;padding:15px 0;}
/* Table */
.tblGreen{position:relative;width:100%;text-align:center;background-color:#fff;border:1px solid #59babf;font-size:18px;}
.tblGreen th{padding:15px 5px;background-color:#e4f3f4;border-right:1px solid #59babf;color:#43aaaf;font-size:100%;font-weight:500;line-height:1.2;}
.tblGreen td{padding:15px 5px;border-right:1px solid #59babf;font-size:90%;line-height:1.2;}
.tblGreen th:last-child, .tblGreen td:last-child{border-right:0px;}
@media all and (max-width: 575px){
.paragraphTit{font-size:160%;font-weight:600;margin-bottom:10%;}
}

/* ---------------- Market needs & Expansion ---------------- */
.txtRef{font-size:15px;color:#666;margin-top:30px;margin-bottom:10px;}
.padLeft{padding-left:10px;margin-top:7%;}
/* Table */
.tblBlue{position:relative;width:100%;text-align:center;background-color:#f2f2f2;font-size:18px;}
.tblBlue th{padding:12px 3px;background-color:#1e8ab1;border:5px solid #1e8ab1;color:#fff;font-size:100%;font-weight:500;line-height:1.2;}
.tblBlue td{padding:5px 5px;background-color:#fff;border:5px solid #f2f2f2;font-size:90%;line-height:1.2;}
@media all and (max-width: 1024px){
.tblGreen{ font-size:16px; }	
.tblBlue{ font-size:16px; }	
}
@media all and (max-width:991px){
.padLeft{padding-left:0px;margin-top:5%;}
}
@media all and (max-width:767px){
.txtRef{font-size:13px;}
.tblGreen{font-size:15px;}
.tblBlue{font-size:15px;}
}
@media all and (max-width: 575px){
.txtRef{font-size:12px;margin-top:20px;}
.tblGreen{font-size:14px;}
.tblBlue{font-size:14px;}
}
@media all and (max-width: 400px){
.tblGreen{font-size:13px;}
.tblBlue{font-size:13px;}
}



/* ************************************  OUR COMPANY  ************************************ */
/* ---------------- About Us ---------------- */
.movieBoxWrap{position:relative;width:100%;height:1100px;overflow:hidden;}
.movieBoxVideo{position:relative;width:100%;min-width:100%;height:auto;}
.movieBoxTxtWrap{
	position:absolute; top:50%; left:0px; width:80%; margin:0 10%;
	-ms-transform:translateY(-50%);-o-transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); 
	transform: translateY(-50%);
	z-index:3;}
.boxWhite{position:relative;background-color:#fff;box-shadow: 5px 5px 20px 0px #aaa;padding:8% 8%;z-index:3;}
.aboutTable{position:relative;display:table;width:100%;height:100%;font-size:100%;padding:20px 0;border-bottom:1px solid #ddd;}
.aboutTable .tbLabel{display:table-cell; width:30%; vertical-align:top;font-weight:500;}
.aboutTable .tbContents{display:table-cell; width:70%; vertical-align:top;}
/*.aboutTable:nth-last-child(1){border-bottom:0px;}*/
@media all and (max-width:1024px){
.movieBoxWrap{height:950px;}
.movieBoxTxtWrap{width:86%; margin:0 7%;}
.boxWhite{padding:5% 5%;}
}
@media all and (max-width:767px){
.movieBoxWrap{height:150vh;}
.movieBoxTxtWrap{position:relative;width:100%;height:100%;margin:0 0;}
.boxWhite{padding:30px 0;box-shadow:none;}
.aboutTable .tbLabel{display:block;width:100%;margin-bottom:10px;font-size:110%;}
.aboutTable .tbContents{display:block;width:100%;}
}
@media all and (max-width:400px){
.movieBoxWrap{height:150vh;}
}

/* ---------------- History ---------------- */
.historyWrap{display:table;width:100%;margin:0px auto;}
.historyWrap .historyY{display:table-cell; width:18%; vertical-align:top; padding:40px 0; font-size:320%; font-weight:600; color:#1e8ab1;}
.historyWrap .historyMD{display:table-cell; width:82%; vertical-align:middle; padding:40px 0; border-bottom:1px solid #ddd;}
.historyWrap .historyMD dl{display:table;width:100%;padding:5px 0;}
.historyWrap .historyMD dt{display:table-cell; width:10%; vertical-align:middle;font-size:170%;font-weight:500;}
.historyWrap .historyMD dd{display:table-cell; width:90%; vertical-align:middle;}
@media all and (max-width:991px){
	.historyWrap .historyY{display:block; width:100%; padding:30px 0 0; font-size:250%;}
    .historyWrap .historyMD{display:block; width:100%; vertical-align:top; padding:20px 0 30px;}
	.historyWrap .historyMD dt{display:table-cell; width:15%; vertical-align:top; font-size:150%;}
	.historyWrap .historyMD dd{display:table-cell; width:85%;}
}
@media all and (max-width:575px){
	.historyWrap .historyY{font-size:180%;}
	.historyWrap .historyMD dt{font-size:130%;}
}

/* ---------------- Leadership ---------------- */
.txtBox01{width:100%;height:auto;}
.txtBoxTitBlock{padding:15px 0;}
.txtBoxsubTitBlock{padding:10px 0;border-top:1px solid #ddd;font-size:110%;font-weight:500;}
.txtBoxTit{font-size:160%;font-weight:600;}
/* UL style*/
.ListDotBlue{list-style-image: url('/imgs/common/dot_blue.jpg'); width:100%; padding-left:15px;}
.ListDotBlue li{padding:7px 0 7px 10px;}
@media all and (max-width:767px){
.txtBoxTit{font-size:140%;}
}

/* ---------------- C.I ---------------- */
ul.download {position:relative;width:100%;list-style:none;}
ul.download li{display:inline-block;margin-left:10px;}
.button03{
	cursor:pointer;padding:10px 30px;margin-bottom:15px;border:1px solid #667491;background:transparent;font-size:90%;font-weight:400;color:#001848;
	-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s
}
.button03:hover{background-color:#001848;color:#fff;}
.button03 i{margin-left:70px}
@media all and (max-width:991px){
	ul.download li{margin-left:0px;margin-right:10px;}
}
@media all and (max-width:767px){
	.button03{width:130px;padding:8px 15px;}
	.button03 i{margin-left:50px}
}

/* ---------------- RND  ---------------- */
.txtBoxTitBlockRnd{padding:0px 0 15px 0px;border-bottom:1px solid #ddd;line-height:1.8;margin-bottom:15px;}
.txtBoxsubTit{font-size:120%;font-weight:500;}

/* ---------------- Contact Us  ---------------- */
.borderLeft{border-right:1px solid #777;}
.leftTxt{font-size:160%;font-weight:600;line-height:1.3;letter-spacing:-0.5;margin-bottom:15px;}
.rightTxt{line-height:2.2;}
.mapBox{width:100%;height:500px;margin-top:5%;border:1px solid #ddd;}
@media all and (max-width: 991px){
	.borderLeft{border-right:0px;}
	.leftTxt{font-size:160%;margin-bottom:20px;}
	.rightTxt{line-height:1.8;}
}
@media all and (max-width:767px){
	.leftTxt{font-size:140%;}
	.rightTxt{line-height:1.5;}
	.mapBox{height:300px;}
}
@media all and (max-width:575px){
	.leftTxt{font-size:120%;}
}


/* ANIMATION */
.animate {
  -webkit-animation-duration: 1s;
          animation-duration:1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}
.animationTxt{
animation: fadeIn;
-webkit-animation-duration: 1s;
          animation-duration:1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
animation-delay:0.3s;
}
@-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

.fadeIn {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
}