@charset "utf-8";
@font-face{ font-family:'Myriad Bold Italic'; src:url('../fonts/Myriad Pro Bold Italic.ttf'); src: url('../fonts/Myriad Pro Bold Italic.ttf') format('truetype'); }

*{ box-sizing:border-box; }
html, body{ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; width:100%; height:100%; min-height:100%; margin:0; padding:0; }
body{ font-family:'Myriad Bold Italic'; } div{ outline:none; }


.containerWrap{ width:100%; height:100%; font-size:0; position:relative; min-width:1300px; }
.bgBox{ width:100%; } .bgBox img{ width:100%; }

/* header */
header{ width:100%; position:absolute; top:0; left:0; text-align:right; z-index:2; } header.hbLine{ border-bottom:1px solid #98BFD8; }
header ul{ width:75%; list-style:none; margin:0; padding:0; display:inline-block; vertical-align:middle;  } header ul li{ display:inline-block; position:relative; line-height:normal; }
header ul li:last-child{ margin-right:0; } header ul li a{ font-size:22px; color:#000; text-decoration:none; border-radius:10px; width:180px; display:inline-block; text-align:center; line-height:normal; vertical-align:middle; padding:10px 0; }
header ul li a:hover{ background-color:#0E2A46; color:#FFF; } .headerLogoBox{ display:inline-block; } .headerLogoBox img{ cursor:pointer; vertical-align:middle; }
header ul li a.active{ background-color:#0E2A46; color:#FFF; }
header ul.onWhite li a{ color:#FFF; } header ul.onWhite li a:hover{ background-color:#FFF; color:#000; }
header ul li ul{
	display:none; height:auto; padding:0px; margin:0px; position:absolute; z-index: 999; left:0; top:45px; width: 180px; background: #81AFCF;
	border-radius:10px; box-shadow:5px 5px 5px;
}
header ul li ul li{ position:relative; } header ul li ul a{ color:#FFF; }
header ul li ul li ul{
	display:none; height:auto; padding:0px; margin:0px; position:absolute; z-index: 999; left:180px; top:0; width: 180px; background: #81AFCF;
	border-radius:10px; box-shadow:5px 5px 5px;
} header ul li ul li ul li{ position:relative; }

header ul li:hover ul.depth1{ display:block; } header ul li:hover ul.depth1 li:hover ul.depth2{ display:block; }
header ul li:hover ul.depth1 li:hover ul.depth2 li:hover ul { display:block; }
header ul li ul li ul li a{ font-size:16px; color:#FFF; }
.headerBox{ width:100%; padding:0 30px; position:relative; height:70px; line-height:70px; } .headerIconBox{ display:inline-block; vertical-align:middle; margin-left:20px; }
.headerIconBox img{ width:35px; vertical-align:middle; } .headerIconBox img:nth-child(1){ margin-right:20px; }

/* contents */
.contents{ width:100%; height:calc(100% - 110px); position:relative; z-index:1; }
.departmentBG{
	width:100%; height:100%; background-image:url('../images/bg/main_bg_img.jpg'); background-size:cover;
	background-position:center center; background-repeat:no-repeat;
}
.cosmeticBG{
	width:100%; height:100%; background-image:url('../images/bg/cosmetic_bg_img.jpg'); background-size:cover;
	background-position:center center; background-repeat:no-repeat;
}
.tourBG{
	width:100%; height:100%; background-image:url('../images/bg/medicaltour_bg_img.jpg'); background-size:cover;
	background-position:center center; background-repeat:no-repeat;
}
.investmentBG{
	width:100%; height:100%; background-image:url('../images/bg/investment_bg_img.jpg'); background-size:cover;
	background-position:center center; background-repeat:no-repeat;
}
.contactBG{
    width:100%; height:100%; background-image:url('../images/bg/contact_bg_img.png'); background-size:100% 85%;
    background-position:center center; background-repeat:no-repeat;
}
.aboutBG{
    width:100%; height:100%; background-image:url('../images/bg/aboutus_bg_img.jpg'); background-size:cover;
    background-position:center center; background-repeat:no-repeat;
}
.logoBox{ width:65%; max-width:1012px; position:absolute; top:300px; } .logoBox img{ width:100%; }
.inline{ display:inline-block; vertical-align:middle; } .wid42{ width:42%; } .wid42 img{ width:100%; } .cosmeticBox{ position:absolute; bottom:0; }
.wid58{ width:58%; vertical-align:top;} .topLogoBox{ width:56%; max-width:551px; margin:0 auto; } .topLogoBox img{ width:100%; }
.btmLogoBox{ width:100%; max-width:1012px; margin:5% auto 0 auto; } .btmLogoBox img{ width:100%; }
.tourBG .leftBox{ width:30%; } .tourBG .rightBox{ width:65%; } .tourBG img{ width:100%; } .tourBox{ position:absolute; bottom:0; text-align:center; }
.tourBox div:nth-child(1){ width:30%; } .tourBox div:nth-child(2){ width:70%; margin-left:-5%; } .tourBox div img{ width:100%; }
.investmentBox{ position:absolute; width:100%; text-align:center; top:250px; } .investmentBox img{ width:100%; }
.investmentBox div:nth-child(1){ width:38.5%; margin:0 auto; } .investmentBox div:nth-child(2){ width:50%; margin:5% auto 0 auto; }

.opacity1{ animation: fadein 1s; -moz-animation: fadein 1s; -webkit-animation: fadein 1s; -o-animation: fadein 1s; }
.opacity05{ animation: fadein05 1s; -moz-animation: fadein05 1s; -webkit-animation: fadein05 1s; -o-animation: fadein05 1s; }

/* footer */
footer div img{ width:100%; }


/* popular */
.leftArea{ width:30%; height:100%; padding-top:70px; text-align:center; } .leftArea img{ height:100%; } .rightArea{ width:70%; padding-top:70px; margin:0 auto; height:100%; display:inline-block; } .verticalTop{ vertical-align:top; }
.topFive ul{ width:100%; margin:0; padding:0; } .topFive ul li{ display:inline-block; margin-right:20px; width:18.5%; } .topFive ul li:last-child{ margin-right:0; }
.topFive ul li img{ width:100%; } .topFive{ margin-top:2%; } .marginTop2{ margin-top:2%; } .center{ text-align:center; } .textTable img{ width:100%; }
.sliderText{ border:1px solid #BDBDBD; border-bottom:none; width:99.9%; } .sliderText span{ font-size:16pt; color:#000; font-weight:bold; display:inline-block; text-align:center; padding:10px; }
.sliderText span:nth-child(1){ width:6%; } .sliderText span:nth-child(2){ width:15.5%; } .sliderText span:nth-child(3){ width:46.5%; }
.sliderText span:nth-child(4){ width:16%; } .sliderText span:nth-child(5){ width:16%; } .marginTop10{ margin-top:10px; } .company{ margin-top:1%; }
.company img{ width:100%; max-width:240px; } .company div{ display:inline-block; width:20%; } .sliderBox div:last-child{ border-bottom:1px solid #BDBDBD; }
.textTblTitle{ margin-top:2%; } .date{ color:#000; font-size:32pt; font-weight:bold; display:inline-block; vertical-align:middle; } .rHeader img{ vertical-align:middle; margin-right:5%; }
.cHeight{ height:88.5%; } .leftTextBox{ display:inline-block; height:100%; padding-top:70px; } .leftTextBox img{ margin-top:10%; }
.textTblTitle img:nth-child(2){ float:right; cursor:pointer; }


/* popup */
.popupLayer{ position:fixed; width:100%; height:100%; left:0; top:0; background-color:rgba(0,0,0,0.5); z-index:99; display:none; text-align:center; }
.popupCell{ display:table-cell; vertical-align:middle; } .popupContents{ text-align:right; display:inline-block; width:100%; padding:1%; } .close_btn{ width:35px; cursor:pointer; }
.popupBody{ margin:0 auto; text-align:center; } .popupBody img{ width:100%; }


/* contact */
.formBox{ padding-top:112px; } .formTable{ display:table; width:100%; } .formCell{ display:table-cell; }
.wid20{ width:20%; border-right:1px solid #98BFD8; } .wid80{ width:80%; padding:50px; } .contactLogo{ margin-top:20px; }
.formBox table{ width:100%; } .formBox input{ width:100%; border:1px solid #98BFD8; padding:10px; height:50px; line-height:50px; font-size:18px; color:#C9C7C7; outline:none; }
.formBox table td{ padding-top:25px; } .formBox textarea{ width:100%; height:350px; border:1px solid #98BFD8; padding:10px; resize:none; color:#C9C7C7; font-size:18px; font: 400 18px Arial; outline:none; }
.formBox input::placeholder { color:#C9C7C7; } .formBox textarea::placeholder { color:#C9C7C7; }
.formBox .button{ width:150px; padding:5px; border-radius:20px; font-size:20px; cursor:pointer; line-height:normal; }
.formBox input.submit{ background-color:#98BFD8; color:#FFF; margin-right:20px; } .formBox input.cancel{ background-color:#FFF; color:#98BFD8; border:1px solid #98BFD8; }
.conBtnBox{ position:absolute; left:21.3%; bottom:20%; } .conBtnBox img{ cursor:pointer; }


/* news */
.newsListWrap{ padding-top:100px; width:60%; margin:0 auto 50px auto; } .articleBox ul{ width:100%; margin:0; padding:0; } .articleBox ul li{ padding:20px 0; border-top:1px solid #E7E7E7; border-bottom:1px solid #E7E7E7; margin:20px 0; position:relative; }
.articleBox dl dt{ width:13.5%; max-width:150px; } .articleBox dl dt img{ width:100%; } .articleBox dd, .articleBox dt{ display:inline-block; vertical-align:middle; }
.articleBox dd .newsDate{ color:#A9A9A9; font-size:16px; margin:0; } .articleBox dd .newsDate span{ vertical-align:middle; } .articleBox dd .newsDate .dateLine{ margin:0 10px; font-size:14px; }
.articleBox dd .newsTitle{ color:#000; font-size:22px; margin:10px 0; } .articleBox dd .newsSummery{ color:#A9A9A9; font-size:18px; margin:15px 0 0 0; } .articleBox dd{ width:82%; margin-left:4%; }
.articleBox li a:hover .newsDate, .articleBox li a:hover .newsTitle, .articleBox li a:hover .newsSummery{ color:#D3D3D3; }
.countryBox{ position:absolute; right:0; top:20px; } .countryBox span{ font-size:16px; color:#A9A9A9; vertical-align:middle; } .countryBox img{ vertical-align:middle; margin-right:10px; max-width:38px; }


/* paging */
.pagingBox{ text-align:center; } .pagingBox ul li{ display:inline-block; margin-right:5px; }
.pagingBox ul li a{ font-size:16px; list-style:none; display:inline-block; color:#000; text-decoration:none; border-radius:50px; padding:0 5px;  }
.pagingBox ul li.active a{ background-color:#1178A8; color:#FFF; }


/* ventilator */
.venTop{ width:100%; } .venTop div{ display:inline-block; vertical-align:middle; }
.venTop div:nth-child(1){ width:60%; } .venTop div:nth-child(1) p{ font-size:32pt; font-weight:bold; color:#6D9BAC; margin:0; }
.venTop div:nth-child(2){ width:40%; }
.venContents{ width:100%; margin-top:5%; } .venContents ul{ width:100%; margin:0; padding:0; }
.venContents li{ display:inline-block; vertical-align:middle; margin-right:2%; text-align:center; width:20%; }
.venContents li div:nth-child(1) img{ width:100%; } .venContents li div:nth-child(1){ border:1px solid #D8D8D8; padding:5%; }
.venContents li div:nth-child(2){ margin-top:20px; } .venContents li div:nth-child(2) img{ cursor:pointer; }


/* nasopharyngeal */
.rHeader p{ font-size:32pt; font-weight:bold; color:#6D9BAC; margin:0; display:inline-block; vertical-align:middle; width:60%; }
.textTblTitle p{ color:#000; font-weight:bold; font-size:36pt; }


/* media query */
@media screen and (max-width: 1760px) {
    header ul{ width:79%; }
    .sliderText span{ font-size:18px; }
}

@media screen and (max-width: 1695px) {
    header ul{ width:77%; }
    header ul li a{ width:150px; font-size:17px; }
    header ul li ul{ width:150px; top:40px; }
    header ul li ul li ul{ width:150px; left:150px; }
    header ul li ul li ul li a{ font-size:14px; }
}

@media screen and (max-width: 1555px) {
    header ul{ width:75%; }
    .conBtnBox{ left:19.5%; }
}

@media screen and (max-width: 1485px) {
    header ul{ width:72%; }
    header ul li a{ width:135px; font-size:16px; }
    header ul li ul{ width:135px; top:38px; }
    header ul li ul li ul{ width:135px; left:135px; }
    header ul li ul li ul li a{ font-size:13px; }
    .conBtnBox{ left:18%; }
    .sliderText span{ font-size:16px; }
}

@media screen and (max-width: 1390px) {
    header ul{ width:72%; }
    header ul li a{ width:125px; }
    header ul li ul{ width:125px; }
    header ul li ul li ul{ width:125px; left:125px; }
    .conBtnBox{ left:15%; }
}

@media screen and (max-height: 780px) {
    .marginTop2{ margin-top:1%; }
}

@media screen and (max-height: 735px) {
    .marginTop2{ margin-top:0; }
}

@media screen and (max-height: 625px) {
    .rHeader img{ width:40%; } .date{ font-size:26pt; }
    .textTblTitle img{ width:60%; }
    .containerWrap{ min-height:625px; }
}

/* animation */
@keyframes fadein {
    from { opacity:0; }
    to { opacity:1; }
}
@-moz-keyframes fadein { /* Firefox */
    from { opacity:0; }
    to { opacity:1; }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from { opacity:0; }
    to { opacity:1; }
}
@-o-keyframes fadein { /* Opera */
    from { opacity:0; }
    to { opacity: 1; }
}

@keyframes fadein05 {
    from { opacity:0.5; }
    to { opacity:1; }
}
@-moz-keyframes fadein05 { /* Firefox */
    from { opacity:0.5; }
    to { opacity:1; }
}
@-webkit-keyframes fadein05 { /* Safari and Chrome */
    from { opacity:0.5; }
    to { opacity:1; }
}
@-o-keyframes fadein05 { /* Opera */
    from { opacity:0.5; }
    to { opacity: 1; }
}
