@charset "utf-8";
.hide {display: none;}
@media screen and (max-width: 1200px) {
	.only-1200 {display: none;}
}

.LandbotLivechat {
	display: none !important;}
/**************************************************
	Layout
**************************************************/

#header {position: absolute; top: 0; left: 50%; transform: translate(-50%); z-index: 90; width: 100%; transition: all 1s ease-in;}
#header .inner {position: relative; width: 100%; height: 95px; margin: 0 auto;}
#header .logo {position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
#header .logo a {display: block; width: 100%; height: 100%;}
/* #gnb {display: none; position: absolute; top: -100000%;} */
#slide-menu {position: fixed; top: 0; right: -100%; width: 360px; height: 100%; 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: 99;}
#slide-menu.open {right: 0;}
#slide-menu .tit {height: 95px; position: relative; background: #fff; z-index: 99;}
#slide-menu.on {right: 0; z-index: 10000;}
#slide-bg {position: fixed; z-index: 80; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); display: none;}
#slide-bg.on {display: block;}
#slide-close {position: absolute; top: 32px; right: 30px; width: 31px; height: 30px; }
#tnb-mo {text-align: center; line-height: 40px; background: #f7f7f7;}
#tnb-mo>li {display: inline-block; margin: 0 10px;}
#tnb-mo>li a {font-size: 12px; color: #333;}
#gnb-mo {border-top: 1px solid #e1e1e1;}
#gnb-mo>li {border-bottom: 1px solid #e1e1e1;}
#gnb-mo>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-mo>li>ul {padding: 10px 55px; border-top: 1px solid #e1e1e1; background: #f7f7f7; display: none;}
#gnb-mo>li>ul li a {line-height: 30px; font-size: 15px; font-weight: 200; color: #666; text-decoration: none;}
#gnb-mo>li.hidden-gnb {display: none;}
section#main.none {display: none !important;}
.section.foot {height: 150px !important;}
.section.foot .fp-tableCell {height: 150px !important;}

.fp-viewing-Bottom #header {position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
#footer {background: #222222;}
#footer .ftWrap {position: relative; width: 100%; padding: 23px 10px; box-sizing: border-box; margin: 0 auto;}
#footer .ftWrap strong {font-size: 14px; color: #ddd; font-weight: 300; display: block; width: 100%; line-height: 24px; padding-bottom: 10px;}
#footer .ftWrap p {display: block; width: 100%; box-sizing: border-box;  position: relative; line-height: 24px; font-size: 14px; color: #999;}
#footer .ftWrap p span {display: inline-block; line-height: 1.5; font-size: 14px; color: #999;}

#footer .ftWrap p span.copyright b {font-size: 14px; font-weight: normal; color: #999;}

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

#wrap {width: 100%; height: 100%; margin: 0 auto; clear: both; display: none; }
.fp-viewing-Bottom #header .logo {display: none; transition: all 0.3s ease-in;}
/*풀페이지 페이지이동버튼*/
#fp-nav { display: none !important;}

.section:not(.foot) {position: relative; display: block; width:100vw; padding: 15px; box-sizing: border-box; background: url('../images/ㄷㄴㄷ/main_bg1.jpg') center no-repeat; background-size: cover; color: #222;}
.section h3 {font-size: 28px; 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: 18px;}
#section5 h3 {text-align: center;}

.section p {font-size: 16px;}
.section p + p {margin-top: 20px;}
.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('/images/layout/arrow_1.png') top 12px right no-repeat; border-bottom: 2px solid #034694;}
.section .section-body {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80%;}
#section3 .section-body {bottom: 10vh; top: unset; left: unset; transform: unset}
@media screen and (max-width: 450px ){
	.section .section-body {width: calc(100% - 30px)}
	.section ul.link li a {font-size: 14px;}
	.section h3 {font-size: 25px; padding-bottom: 0;}
}
.en .section p {font-weight: 100; font-size: 16px;}
.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; background-position : center center;}
#section3 {background: url('/images/main/mob_main_bg3.png'); background-position : top 10vh center; background-repeat: no-repeat;}
#section4 {background: url('/images/main/main_bg4.jpg'); background-size: cover; background-position : center center;}
#section5 {background: url('/images/main/medivelbio_backgroun_img_article_detail.jpg'); background-size: cover; background-position : center center;}
#section6 {background: url('/images/main/main_bg6.jpg'); background-size: cover; background-position : center center;}

#section1 {background: url('/images/main/main_bg1.jpg'); background-size: cover; background-position : center center;}
.en #section1 {background: url('/images/main/eng_main_bg1.jpg'); background-size: cover; background-position : center center;}
#section1 h3 {margin-top: 30px; font-size: 30px; text-align: center;}
#section1 p {text-align: center;}
#section1 .img {margin: 0 auto; width: 30vw; min-width: 180px;}
#section1 .img img {width: 100%;}
.section ul {overflow: hidden;}
.section ul.link {margin-top: 20px;}
.section ul.link li {margin-top: 10px; width: 50%; border-bottom: 1px solid #fff;}
.section:not(#section5) ul li a {display: block; text-align: left; line-height: 30px; font-size: 14px; background-image: url('../images/layout/arrow-white.png'); background-repeat: no-repeat; background-position: right 0 center; background-size: 10px; transition: all 0.5;}
.section ul li a:hover {text-decoration: none; background-position: right 0 center; transition: all 0.5s;}
#section2 ul.link > li {width: 70%;}
#section3 ul.link li {border-bottom: 2px solid #034694;}
#section3 ul.link li a {color: #034694; font-size: 16px; background-image: url('../images/layout/arrow-blue.png'); }
.section ul li.slide {position: relative;}

#section5 .cke_contents {max-height: 65vh !important;}
.main table {table-layout: fixed; width: 100%; font-size: 16px;}
.main table tr {line-height: 30px; border: 1px solid #fff;}
.main table tr td {padding: 5px 10px; box-sizing: border-box; height: 40px; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.main table tr td.title {max-width: 1100px;}
.main table thead {width: 100%; background: #034694;} 
.main table tr {width: 100%;}
.main table tr.article-table-row td:nth-child(1) {width: 80%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.main table tr td .article-title {display: block; 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 {position: relative; height: 165px; overflow: hidden;}
.main  .table .news {position: absolute; top: 0; left: 0; max-height: 165px; overflow: hidden;}
.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 {text-align: center;}
#section6 h4 {margin-bottom: 20px;}
#section6 .p-policy {height: 15vh; max-height: 300px; overflow-y: scroll; padding: 5px; box-sizing: border-box; border: 1px solid #666666; background: #fff; opacity: 0.5;}
#section6 .p-policy p {font-size: 12px; color: #666;}
#section6 .p-policy + span {color: #666; font-size: 12px;}
#section6 fieldset {width: 100%;}
#section6 fieldset:first-child {margin-top: 5px; padding: 5px; box-sizing: border-box; background: rgba(255,255,255,0.5);}
#section6 fieldset label {display: inline-block; color: #666; font-size: 12px; }
#section6 fieldset:nth-child(2) label {width: calc(50% - 4px);}
#section6 fieldset:nth-child(2) label:nth-child(2n) {margin-left: 4px;}
#section6 fieldset:nth-child(2) label:nth-child(3),
#section6 fieldset:nth-child(2) label:nth-child(4) {margin-top: 3px;}
#section6 fieldset:nth-child(3) label  {width: 100%; margin-top: 5px;}
#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: 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 {font-size: 18px; padding: .5em 4em; margin-top: 2em; background: #034694; color: #fff;}


@media screen and (max-width: 450px ){
	#section1 h3 {font-size: 25px; padding-bottom: 10px;}
	#section2 ul.link > li {width: 100%;}
	.section p {font-size: 16px; word-break: keep-all}
	#section6 h4 {margin-bottom: 5px; text-align: center; font-size: 12px;}
	#section6 button {display: block; margin: 10px auto; font-size: 14px}
	#section6 fieldset:nth-child(1) label {width: auto; font-size: 12px}
	#section6 fieldset:first-child {text-align: left}
}