@charset "utf-8";

/*** WEBFONT ***/

@font-face {
    font-family: 'InkLipquid';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/InkLipquid.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


.font--mont {font-family: 'Montserrat', sans-serif;}
.font--Ink {font-family: 'InkLipquid', sans-serif;}



/*** COMMON STYLE ***/
.clearfix{content: '';display: block;clear:both}

.flex {display: flex;}
.flex--ac {display: flex;align-items:center;}
.flex--ac-jc {display: flex;align-items:center;;justify-content:center;}
.flex--jsb {display: flex;justify-content:space-between;}
.flex--ac-jsb {display: flex;align-items:center;justify-content:space-between;}

.blind { opacity: 0; position: absolute; top: -9999px; left: -9999px; text-indent: -9999px;}


/*** SECTION ***/
.section {position: relative;}
.section .inner {position: relative;margin: 0 auto;box-sizing: border-box;}
.inner{margin:0 auto;}
.inner{margin:0 auto;}

.w1800 {width: 1800px;margin:auto;}
.w1600 {width: 1600px;margin:auto;}
.w1400 {width: 1400px;margin:auto;}



/*** HEADER ***/
header{position: fixed;width: 100%;height: 100px;z-index: 999;border-bottom: 1px solid rgba(255,255,255,0.2);transition:0.3s;}

header .header__logo {float: left;height: 100px;}
header .header__logo a{display: block;width: 378px;height: 39px;background: url(../images/layout/meditech_1.png) no-repeat center;background-size: contain;}
header.scrollOn .header__logo a {background: url(../images/layout/meditech_2.png) no-repeat center;background-size: contain;}

header nav {float: left;margin-left: 18.8%;}
header nav > ul > li {position: relative;width: 255px;text-align: center;}
header nav > ul > li > a{display: inline-block;font-size:1.25em;line-height: 100px;color: #ffffff;font-weight: 500;transition:0.3s;}
header nav > ul > li:after{content: '';position: absolute;top:45%;right:0;transform:translate(-50%);width: 1px;height: 11px;background-color: #6e7479;}
header nav > ul > li:last-child:after{display: none;}

header nav > ul > li .gnb__depth2 {display: none;position: absolute;top:100px;left: 0;right: 0;padding:20px 0;background-color: #fff;}



/* sub header */
header.sub__header,
header.sub__header .header__logo,
header.sub__header .header__sitemap {height: 90px;}
header.sub__header nav > ul > li > a {line-height: 90px;}


/* sitemap */
.sitemap-wrap {position: fixed;top: 0;bottom:0;right:-90%;width: 90%;max-width:300px;}
.sitemap-wrap .sitemap__top{position: relative;height: 90px;border-bottom:1px solid #ddd;background-color: rgba(255,255,255,0.95)}
.sitemap-wrap .sitemap__top .button--sitemap-close {position: absolute; display: block; width: 100px;height: 100px;right: 0px;top: 0;cursor: pointer; transition: .3s;}
.sitemap-wrap .sitemap__top .button--sitemap-close:before,
.sitemap-wrap .sitemap__top .button--sitemap-close:after{position: absolute; content:''; width: 3px; height: 45px; background: #333; left: 50px; top: 25px; transform:rotate(-45deg); transition:.3s;}
.sitemap-wrap .sitemap__top .button--sitemap-close:after{transform:rotate(45deg); }

.sitemap__nav {height: calc(100vh - 90px);background: #fff;padding:40px 0;box-sizing:border-box;}

.sitemap__nav li.has-depth2 > a{position: relative;}
.sitemap__nav li.has-depth2 > a:after{content: '';position: absolute;top:50%;right:2vw;transform: translateY(-50%);width: 11px;height: 8px;background: url(../images/layout/sitemap__arrow.jpg) no-repeat center;transition:0.3s;}
.sitemap__nav li.has-depth2.on > a:after{transform: translateY(-50%) rotate(180deg)}

.sitemap__nav li a{display: block;padding: 0 3.2vw;font-size:1.125em;line-height: 3;font-weight: 500;transition:0.3s;}
.sitemap__nav li.current a,
.sitemap__nav .sitemap__nav__depth2 li.current a{color: #419f88;}
.sitemap__nav .sitemap__nav__depth2 {display: none;padding: 15px 0;background-color: #e3ecef;}
.sitemap__nav .sitemap__nav__depth2 li a{padding: 0 3.2vw;box-sizing:border-box;font-size:1.05em;line-height: 2.5;color: #666;transition:0.3s;border:0;}


/* sitemap button */
.header__sitemap {float: right;width: 41px;height: 100px; margin: 2px 2px 0 0;text-align: center;cursor: pointer;}
.header__sitemap div {position: relative;width: 100%;height: 30px;}
.header__sitemap div span.line{position: absolute;left: 0;right: 0;display: block;width: 40px;height: 3px;background-color: #ffffff;}
.header__sitemap div span.line1{top:0;transition:0.3s;}
.header__sitemap div span.line2{top:10px;transition:0.3s;}
.header__sitemap div span.text{position: absolute;top:20px;left: 0;right:0;font-size:12px;line-height: 1;font-weight: 700;color: #ffffff;transition:0.3s;}


/* header scroll effect */
header.scrollOn{background-color: #fff;border-bottom: 1px solid #ddd;}
header.scrollOn nav > ul > li > a {color: #333;transition:0.3s;}
header.scrollOn .header__sitemap span.line {background-color: #333;}
header.scrollOn .header__sitemap span.text {color: #333;}



/*** FOOTER ***/
#footer {height: 260px;background-color: #191919;}
#footer > div {transform:translateY(-2px);}
#footer .footer__top em,
#footer .footer__top ul li,
#footer .footer__bottom .copyright{color: #606060;line-height: 1.8125;}
#footer .footer__bottom .copyright {line-height: 1;}
#footer .footer__top .footer__info ul li {position: relative;margin-right: 17px;}
#footer .footer__top .footer__info ul li:after {content: '';position: absolute;top:8px;right:-10px;width: 1px;height: 15px;background-color: #606060;}
#footer .footer__top .footer__info ul li:last-child {margin-right: 0;}
#footer .footer__top .footer__info ul li:last-child:after {display: none;}

#footer .footer__top .footer__family {position: relative;width: 245px;height: 45px;border:1px solid #474747;box-sizing:border-box;}
#footer .footer__top .footer__family:after {content: '';position: absolute;top:46%;right:25px;width: 9px;height: 7px;background: url(../images/layout/family__icon---down.jpg) no-repeat center;transition:0.3s;}
#footer .footer__top .footer__family .title {padding-left: 24px;box-sizing:border-box;line-height: 42px;font-weight: 500;color: #fff;cursor: pointer;}

#footer .footer__top .footer__family .family__list {display: none;position: absolute;bottom:43px;/* top:43px; */left: -1px;right: -1px;z-index: 1;padding: 10px 0;border:1px solid #474747;background-color: #191919;box-sizing:border-box;}
#footer .footer__top .footer__family .family__list li a{display: block;padding: 0 26px;color: #606060;line-height: 2;transition:0.3s;}
#footer .footer__top .footer__family .family__list li:hover a {color: #fff;}

#footer .footer__top .footer__family.familyOpen:after {transform: translateY(-50%) rotate(-180deg);}

#footer .footer__bottom {margin-top:22px;padding-top: 22px;border-top:1px solid #303030;}
#footer .footer__bottom .buttons li.button--pop-privacy {margin-right: 18px;}
#footer .footer__bottom .buttons li.button--pop-privacy a{color: #148dd6;}
#footer .footer__bottom .buttons li.button--pop-email a{color: #fff;}



/*** top button ***/
.button--top{opacity:0; position: fixed;bottom:85px;right:3.125%;z-index: 999;width:55px;height: 55px;background-color: #4c4e4e;border-radius:50%;cursor: pointer;transition:0.5s;}
.button--top.active {opacity:1;}
.button--top:hover figure {transition:0.3s;}
.button--top:hover figure{transform:translateY(-8px);}



/*** POP UP LAYER ***/
.popup-layer {display: none;position: relative;}
.popup-layer .popup-bg {position: fixed;top: 0;bottom:0;left: 0;right: 0;z-index: 999;background-color: rgba(0,0,0,0.6);}
.popup-layer .popup-inner {position: fixed;top: 50%;left: 50%;z-index: 9999;transform: translate(-50%,-50%);width: 700px;height: 420px;background-color: #fff;}
.popup-layer .popup-inner .popup__button--close {position: absolute;top:0;right:0;cursor: pointer;}

.popup-layer .popup-inner .popup__contents {padding:30px 20px;box-sizing:border-box;}

.popup-layer .popup-inner .popup__contents {height: 100%;}
.popup-layer .popup-inner .popup__contents .title{margin-bottom: 15px;font-size: 1.875em;font-weight: 700;}
.popup-layer .popup-inner .popup__contents > div {height: 300px;overflow-y:scroll;padding:20px;box-sizing:border-box;border:1px solid #ddd;font-size: 0.9em}
.popup-layer--email .popup-inner .popup__contents > div {text-align: center;}
.popup-layer .popup-inner .popup__contents > div div > strong {display: block;font-size:1.35em;margin-bottom: 10px;font-weight: 700;}
.popup-layer .popup-inner .popup__contents > div p strong{font-weight: 500;}



/***  모바일사이즈 HOVER효과 해제***/
@media (min-width:768px){


	header:hover {background-color: #fff;}
	header:hover nav > ul > li a{color: #333;}
	header:hover .header__sitemap div span.line{background-color: #333;}
	header:hover .header__sitemap div span.text{color: #333;}
	header:hover .header__logo a {background: url(../images/layout/meditech_2.png) no-repeat center;background-size: contain;}

	#header.scrollOn nav > ul > li:hover > a, 
	#header.scrollOn nav > ul > li.current > a, 
	header nav > ul > li:hover a,
	header.sub__header nav > ul > li:hover a{color: #419f88;}
	header nav > ul > li:hover > a:after,
	header nav > ul > li:focus > a:after{left: 0;width: 100%;opacity:1}

	/* 사이트맵 */
	.header__sitemap:hover div span.line2{top:28px;}
	.header__sitemap:hover div span.text{top:10px}

	.sitemap__nav li:hover > a,
	.sitemap__nav .sitemap__nav__depth2 li:hover a{color: #419f88;}

	.sitemap-wrap .sitemap__top .button--sitemap-close:hover:before, 
	.sitemap-wrap .sitemap__top .button--sitemap-close:hover:after {height: 38px;}

}

