@charset "utf-8";
.btnWrap {margin-top: 30px;}
.btnWrap>* {margin: 0 2px;}
.btn1 {display: inline-block; background: #333; border: 1px solid #333; color: #fff !important; height: 35px; line-height: 35px; padding: 0 20px; font-size: 14px; box-sizing: border-box;}
.btn1.small {height: 30px; line-height: 30px; padding: 0 10px; font-size: 12px;}
.btn2 {display: inline-block; background: #fff; border: 1px solid #ddd; color: #000 !important; height: 35px; line-height: 35px; padding: 0 20px; font-size: 14px; box-sizing: border-box;}
.btn2.small {height: 30px; line-height: 30px; padding: 0 10px; font-size: 12px;}
.hide {display: none;}

@media screen and (max-width: 1024px) {
	.only-1200 {display: none;}
}

#header {position: absolute; top: 0; left: 0; z-index: 90; width: 100%; transition: all 1s ease-in;}
#header .inner {position: relative; width: 100%; height: 95px; margin: 0 auto;}
#header .inner .logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#header .logo a {display: block; width: 100%; height: 100%;}

#slide-close {position: absolute; top: 32px; right: 30px; width: 31px; height: 30px; }

#gnb {position: fixed; top: 0; right: -100%; padding-top: 100px; width: 360px; height: 100vh; display: block; background: #fff; z-index: 201; overflow-y: auto; transition: all 0.3s cubic-bezier(0.930, 0.635, 0.650, 0.970); box-shadow: -6px 0px 15px 2px rgba(0, 0, 0, 0.1); z-index: 1000;}
#gnb.open {right: 0;}
#gnb>li {border-bottom: 1px solid #e1e1e1;}
#gnb>li>a {display: block; line-height: 70px; padding: 0 55px; font-size: 18px; font-weight: 200; letter-spacing: -1px; color: #333; text-decoration: none;}
#gnb>li>ul {padding: 10px 55px; border-top: 1px solid #e1e1e1; background: #f7f7f7; display: none;}
#gnb>li>ul li a {line-height: 30px; font-size: 15px; font-weight: 200; color: #666; text-decoration: none;}
#gnb>li.hidden-gnb {display: none;}

/**************************************************
	Main
**************************************************/

#wrap {width: 100%; height: 100%; margin: 0 auto; clear: both; }
.fp-viewing-Bottom #header .logo {display: none; transition: all 0.3s ease-in;}
/*풀페이지 페이지이동버튼*/
#fp-nav {position: fixed; top: 50%; right: 80px; z-index: 10;}
#fp-nav>ul>li {display: block; box-sizing: border-box; width: 160px; line-height: 26px; padding: 10px 0;}
#fp-nav>ul>li>a {display: block; position: relative;}
#fp-nav>ul>li>a:after {position: absolute; content: ''; width: 4px; height: 4px; border-radius: 50%; background: #ddd; top: 50%; margin-top: -2px; right: 13px;}
#fp-nav>ul>li>a:hover {text-decoration: none;}
#fp-nav>ul>li>a.active .fp-tooltip {line-height: 26px; font-weight: 300;}
#fp-nav>ul>li>a span.fp-sr-only {line-height: 26px; font-size: 15px; color: #ddd; padding-left: 10px; padding-right: 20px;}
#fp-nav>ul>li>a.active span.fp-sr-only {color: #29c1ff; display: block; font-weight: 400;}
#fp-nav>ul>li>a.active:after {background: #29c1ff;}
#fp-nav>ul>li>a.active:before {position: absolute; content: ''; width: 26px; height: 26px; border-radius: 50%; border: 2px solid #29c1ff; top: 50%; margin-top: -14px; right: 0;}
#fp-nav .fp-tooltip {display: none;}
#fp-nav>ul>li:last-child {display: none;}
.fp-viewing-Section3 #fp-nav>ul>li>a span.fp-sr-only,
.fp-viewing-Section6 #fp-nav>ul>li>a span.fp-sr-only {color: #666;}

span.mouse {position: absolute; bottom: 10px; left: 50%; transform: translate(-50%, 0); width: 30px; height: 50px; border: 2px solid #fff; border-radius: 20px; z-index: 100;}
span.mouse::after {position: absolute; top: 5px; left: 50%; transform: translate(-50%, 0); content:''; width: 5px; height: 5px; background: #fff; border-radius: 50%; animation: wheelMove 1s ease-in-out infinite;}

@-webkit-keyframes wheelMove {
	0% {top: 5px;}
	100% {top: 15px;}
  }
.section {width: 100vw; height: 100vh; display: block; position: relative; background: url('/images/main/main_bg1.jpg') center no-repeat; background-size: cover; color: #222;}
.en #section1 {background: url('/images/main/eng_main_bg1.jpg'); background-size: cover;}
.section h3 {font-size: 40px; padding-bottom: 20px;}
.section h3 span {font-size: 55px; font-weight: 200; line-height: 65px; display: block;}
.section h3 span b {font-size: 22px; font-weight: 600; color: #888; line-height: 32px;}
.section h4 {font-size: 20px; font-weight: normal;}
#section5 h3 {text-align: center;}

.section p {font-size: 18px; font-weight: 100;}
.section p span {display: block; font-size: 18px; font-weight: 200; color: #888; line-height: 32px;}
.section p span b {font-size: 22px; font-weight: 600; color: #888; line-height: 32px;}
.section p span a {width: 220px; display: inline-block; text-decoration: none; margin-right: 30px; font-size: 16px; color: #034694; font-weight: 200; line-height: 40px; background: url('/src/images/layout/arrow_1.png') top 12px right no-repeat; border-bottom: 2px solid #034694;}
.section .section-body {position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); width: calc(100% - 400px); max-width: 1024px;}

@media screen and (max-width: 1200px){
	.section p {font-size: 18px;}
	.section .section-body {left: 40%; transform: translate(-50%, -50%); width: calc(100% - 400px); margin-left: 0;}
}
.en .section p {font-weight: 100;}
.section.white h3,
.section.white h4,
.section.white p,
.section.white a {color: #fff;}
#section2 {background: url('/images/main/main_bg2.jpg'); background-size: cover;}
#section2.second {background: url('/images/main/main_bg2-1.jpg'); background-size: cover;}
#section3 {background: url('/images/main/main_bg3.png'); background-size: 40vw auto; background-repeat: no-repeat; background-position: right 20vw center;}
#section4 {background: url('/images/main/main_bg4.jpg'); background-size: cover;}
/* 0620 수정 */
#section5 {background: url('/images/main/medivelbio_backgroun_img_article_detail.jpg'); background-size: cover;}
#section6 {background: url('/images/main/main_bg6.jpg'); background-size: cover;}
#section1 {background: url('/images/main/main_bg1.jpg'); background-size: cover;}
#section1 h3 {margin-top: 30px; text-align: center;}
.en #section1 h3 {margin-top: 30px; text-align: center; font-size: 40px;}
#section1 p {text-align: center;}
#section1 .img {float: left; width: 30vw; max-width: 250px; margin-right: 2vw;}
#section1 .img img {width: 100%;}
#section1 .text {float: left;}
.section ul {overflow: hidden;}
.section ul li.slide {position: relative;}
.section ul.link li {margin-top: 60px; float: left; width: auto; background-repeat: no-repeat; background-position: right 0px bottom 4px; background-size: 10px}
.section ul.link li a {position: relative; padding-right: 20px; background-position: right 5px bottom 4px; cursor: pointer; background-repeat: no-repeat;}
.section ul.link li a::after {position: absolute; bottom: 0; left:0; content: ''; width: calc(100% - 18px); height: 1px; background: #fff; }
#section3.section ul.link li a::after {background: #034694;}
.section ul.link li + li {margin-left: 20px;}
.section:not(#section5) ul.link li {background-image: url('/images/layout/arrow-white.png');  background-repeat: no-repeat;}
.section:not(#section5) ul.link li a {display: block; text-align: left; line-height: 30px; font-size: 18px;  transition: all 0.5;}
#section3 ul.link li a {color: #034694; background-image: url('/images/layout/arrow-blue.png'); background-size: 10px;}
.en .section ul.link {margin-top: 50px;}
.en .section ul.link li {margin: 10px 15px 0 0;}
.en #section2 ul.link li {width: 70%; max-width: 450px;}
.en #section2 ul.link li + li {margin-left: 0;}

@media screen and (max-width: 1200px){
	.section ul.link li {display: block;}
	#section3 ul.link li a {font-size: 18px;}
	#section1 .img {float: none; margin: 0 auto; width: 30vw; max-width: 250px;}
	#section1 .text {float: none; margin:  0 auto;}
}

.main table {position: relative; width: 100%; font-size: 18px;table-layout: fixed; height: 165px; overflow: hidden;}
.main table thead {width: 100%; background: #034694;}
.main table tr {line-height: 30px; border: 1px solid #fff; width: 100%;}
.main table tr td {padding: 5px 10px; box-sizing: border-box; height: 40px; color: #fff; }
.main table tr td.title {max-width: 1100px;}
.main table tr td:nth-child(1) {width: 80%;}
.main table tr.article-table-row td:nth-child(1) {width: 80%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer;}
.main table tr td:nth-child(2) {width: 20%; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: right;}
.main table tr td a {display: block;  width: 900px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.main .table {height: 165px; overflow: hidden}
.main .table .news {margin-top: -1px; max-width: 1200px;}

.main .btn {position: absolute; bottom: -50px; right: 0; overflow: hidden;}
.main .btn li {float: left; width: 15px;}
.main .btn li + li {margin-left: 20px;}
.main .btn li a {display: block;}
.main .btn li a img {width: 100%;}
.main .btn li a.prev img {transform: rotate(-180deg);}

#section6 h3,
#section6 h4 {text-align: center;}
#section6 .p-policy {height: 20vh; max-height: 300px; overflow-y: scroll; padding: 10px; box-sizing: border-box; margin-bottom: 30px; border: 1px solid #666666; background: rgba(255, 255,255, 0.5);}
#section6 .p-policy p {font-size: 14px; color: #666;}
#section6 .p-policy p b {display: block;}
#section6 fieldset {width: 100%; margin-top: 5px;}
#section6 fieldset:first-child,
#section6 fieldset:last-child {text-align: center;}
#section6 fieldset:first-child {padding: 7px; box-sizing: border-box; background: rgba(255,255,255,0.5); border: 1px solid #d6d6d6;}
#section6 fieldset label {display: inline-block; color: #555; font-size: 14px; }
#section6 fieldset:nth-child(1) label {float: left; width: 30%; text-align: left;}
#section6 fieldset:nth-child(2) label {width: calc(50% - 12px);}
#section6 fieldset:nth-child(2) label:nth-child(2n) {margin-left: 20px;}
#section6 fieldset:nth-child(2) label:nth-child(3),
#section6 fieldset:nth-child(2) label:nth-child(4) {margin-top: 5px;}
#section6 fieldset:nth-child(3) label  {width: 100%; margin-top: 10px;}
#section6 fieldset:nth-child(3) label textarea {padding: 10px; width: 100%; border: 1px solid #d6d6d6; box-sizing: border-box; resize: none;}

#section6 fieldset input {padding: 10px; margin-top: 5px; line-height: 1.8; width: 100%; line-height: 120%; border: 1px solid #d6d6d6; background: #fff; opacity: 0.5; border-radius: 2px; box-sizing: border-box;}
#section6 fieldset input[type="checkbox"] {width: auto;}
#section6 button {position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 120%); font-size: 18px; padding: .5em 4em; background: #034694; color: #fff;}