@charset "utf-8";
/****************************************/
/* Name: 국립해양박물관
/* Version: 1.0 / day: 2019-03-26
/* Author:
/****************************************/


/*
================================================================================
콘텐츠 레이아웃
================================================================================
*/
#wrapper{min-width:1300px}
#container {}
.layout {width:1300px;margin:0 auto;position:relative}

#header .logo,
#header .head_box #gnb ul li a,
#header .head_box .globMenu > li > a,
#header .head_box .globMenu > li > .button,
#header .head_box .globMenu .btnLang > .button:after,
#header .head_box .memberMenu li a,
#header .head_box .btnSearch a{transition:all 0.4s ease;-webkit-transition:all 0.4s ease;transition-delay:0.5s;-webkit-transition-delay:0.5s}
.etcMenu,
.etcMenu .btnTotal span,
.etcMenu .btnTotal span::before,
.etcMenu .btnTotal span::after,
.etcMenu .btnTotal:hover span,
.etcMenu .btnTotal:hover span::before,
.etcMenu .btnTotal:hover span::after,
.etcMenu .btnFoll,
.etcMenu .btnFoll i,
.etcMenu .btnFoll i::before,
.etcMenu .btnFoll i::after,
.etcMenu .btnFoll.on,
.etcMenu .btnFoll.on i,
.etcMenu .btnFoll.on i::before,
.etcMenu .btnFoll.on i::after,
.etcMenu .btnGo,
.etcMenu .btnGo a{transition:all 0.2s ease;-webkit-transition:all 0.2s ease;transition-delay:0.2s;-webkit-transition-delay:0.2s}


/* ---- 상단영역 ---- */
#header{position:absolute;top:0;left:0;width:100%;min-width:1300px;height:90px;z-index:100}
#header .logo{position:absolute;top:30px;left:140px;width:200px;height:35px;text-indent:-9999px;overflow:hidden;background:url('/_public/images/common/logo.png') no-repeat;}
#header .logo a{display:block;height:100%;}
#header .head_box{position:absolute;top:0;right:0;padding:10px 45px 0 0;text-align:right }
#header .head_box .menuTop {width:100%}
#header .head_box #gnb{display:block;margin-top:5px}
#header .head_box #gnb ul li{display:inline-block;vertical-align:middle}
#header .head_box #gnb ul li a{display:block;padding:0 15px;color:#fff;line-height:35px;position: relative;}
#header .head_box #gnb ul li a span {position: relative;display: block;}
#header .head_box #gnb ul li a span:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: -8px;
	left: 0;
	background-color:#fff;
	visibility: hidden;
	-webkit-transform: scaleX(0);
	-moz-transform: scaleX(0);
	-ms-transform: scaleX(0);
	-o-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transition: all 0.25s ease-in-out 0s;
	-moz-transition: all 0.25s ease-in-out 0s;
	-ms-transition: all 0.25s ease-in-out 0s;
	-o-transition: all 0.25s ease-in-out 0s;
	transition: all 0.25s ease-in-out 0s;
}
#header .head_box #gnb ul li a:hover span:before,
#header .head_box #gnb ul li a:focus span:before
{
	visibility: visible;
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-ms-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
}
#header .head_box #gnb ul li.on a {
	background: transparent;
	background: none;
}
#header .head_box #gnb ul li.on a span:before {
	visibility: visible;
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
	background-color: #fff;
}
.fp-viewing-1 #header .head_box #gnb ul li a span:before,
.fp-viewing-2 #header .head_box #gnb ul li a span:before,
.fp-viewing-3 #header .head_box #gnb ul li a span:before,
.fp-viewing-1 #header .head_box #gnb ul li.on a span:before,
.fp-viewing-2 #header .head_box #gnb ul li.on a span:before,
.fp-viewing-3 #header .head_box #gnb ul li.on a span:before {background-color:#222}

#header .head_box .globMenu{display:inline-block;margin-right:12px;text-align:left}
#header .head_box .globMenu > li{position:relative;display:inline-block;margin:0 1px;vertical-align:middle}
#header .head_box .globMenu > li > a,
#header .head_box .globMenu > li > .button{display:block;padding:0 10px;font-size:12px;color:#fff;line-height:33px;border:1px solid rgba(255,255,255,0.8);}
#header .head_box .globMenu > li.first a{font-size:13px;opacity:1;border:1px solid rgba(255,255,255,0.8)}
#header .head_box .globMenu > li > a:hover,
#header .head_box .globMenu .btnLang > .button.on{opacity:1;border:1px solid rgba(255,255,255,1);}
#header .head_box .globMenu .btnLang > .button{padding-right:25px}
#header .head_box .globMenu .btnLang > .button:after{position:absolute;top:50%;right:10px;margin-top:-3px;width:9px;height:6px;content:'';background:url('/_public/images/common/ic_arrow.png') no-repeat}
#header .head_box .globMenu .btnLang ul{display:none;position:absolute;top:35px;left:0;width:100%;border:1px solid rgba(255,255,255,1);border-width:0 1px 1px;z-index:9}
#header .head_box .globMenu .btnLang ul li{border-bottom:1px solid rgba(255,255,255,0.4)}
#header .head_box .globMenu .btnLang ul li:last-child{border-bottom:0}
#header .head_box .globMenu .btnLang ul li a{display:block;padding:0 10px;font-size:12px;line-height:24px;background:#fff}
#header .head_box .globMenu .btnLang ul li a:hover{opacity:1;background:rgba(255,255,255,0.7)}
#header .head_box .btnSearch{position:relative;width:35px;height:35px;margin-right:15px;text-indent:-999px;overflow:hidden;background:rgba(255,255,255,0.2) url('/_public/images/common/ic_search.png') no-repeat center center;border-radius:50%;z-index:3}

#header .head_box .memberMenu {display:inline-block;margin-right:12px}
#header .head_box .memberMenu li {display:inline-block}
#header .head_box .memberMenu li a {padding:0 15px;font-size:13px;line-height:35px;color:#fff;}

#header .head_box .viewSearh{position:relative;vertical-align:middle;display:inline-block;padding-right:35px;width:240px;background:rgba(255,255,255,1);border-radius:18px;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;transition-delay:0.2s;border:1px solid transparent;z-index:2}
#header .head_box .viewSearh .inpwte{padding:0 36px 0 15px;width:100%;height:36px;border:0;box-sizing: border-box;}
#header .head_box .viewSearh .btn{position:absolute;top:0;right:0;width:36px;height:36px;text-indent:-999px;overflow:hidden;background:url('/_public/images/common/ic_search2.png') no-repeat center center;border-radius:50%;border:0}
#header .head_box .viewSearh .searchViewClose{position:absolute;top:0;right:-30px;width:30px;height:36px;text-indent:-999px;overflow:hidden;background:url('/_public/images/common/ic_close.png') no-repeat center center;background-size:10px}
#header .head_box .viewSearh.on{padding-right:35px;width:240px;display:inline-block;z-index:5}

.etcMenu{position:absolute;top:0;left:0;width:90px;height:635px;border-right:1px solid rgba(255,255,255,0.2);z-index:110}
.etcMenu .btnTotal{width:90px;height:90px;text-indent:-999px;overflow:hidden;transition:all 0.4s ease;background:rgba(255,255,255,0.08);z-index:110}
.etcMenu .btnTotal span{position:relative;display:block;margin:0 auto;width:27px;height:1px;background:#eeeff0;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;}
.etcMenu .btnTotal span::before{position:absolute;top:-9px;left:-6px;width:100%;height:1px;content:'';background:#eeeff0;transition:all 0.2s ease;-webkit-transition:all 0.2s ease}
.etcMenu .btnTotal span::after{position:absolute;top:9px;left:-3px;width:100%;height:1px;content:'';background:#eeeff0;transition:all 0.2s ease;-webkit-transition:all 0.2s ease}
.etcMenu .btnTotal:hover span{background:#fff}
.etcMenu .btnTotal:hover span::before{left:0;background:#fff;}
.etcMenu .btnTotal:hover span::after{left:0;background:#fff;}
.etcMenu .btnTotal.on span{margin-left:18px;width:40px;height:40px;background:none}
.etcMenu .btnTotal.on span::before{left:9px;top:18px;width:30px;transform: rotate(45deg);-webkit-transform: rotate(45deg);background:#eeeff0;}
.etcMenu .btnTotal.on span::after{left:9px;top:18px;width:30px;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);background:#eeeff0;}


.etcMenu .btnFoll{position:absolute;bottom:320px;left:0;padding-bottom:0;width:90px;height:160px;font-size:14px;color:#fff;font-weight:700;line-height:90px;border-top: 1px solid rgba(255,255,255,0.2);border-bottom:1px solid rgba(255, 255, 255, 0.2)}
.etcMenu .btnFoll span{position:relative;display:block;text-align:center;white-space: nowrap;transform:rotate(-90deg);-webkit-transform:rotate(-90deg);font-size:15px;font-weight:bold;margin:3px 0 -30px -10px}
.etcMenu .btnFoll .icon {width:23px;height:23px;position:absolute;display:inline-block;top:21px;right:38px;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;opacity:0.8;background:url('/_public/images/common/cplus.svg') center center / cover no-repeat;}
.etcMenu .btnFoll:hover .icon,
.etcMenu .btnFoll.on .icon {transform:rotate(-45deg);-webkit-transform:rotate(-45deg);opacity:1}

/*.etcMenu .btnFoll i{position:absolute;bottom:25px;left:50%;width:5px;height:5px;background:#fff;border-radius:3px;transform:translateX(-50%);-webkit-transform:translateX(-50%);transition:all 0.2s ease;-webkit-transition:all 0.2s ease;}
.etcMenu .btnFoll i::before{position:absolute;top:-10px;left:0;width:5px;height:5px;content:'';background:#fff;border-radius:3px;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;}
.etcMenu .btnFoll i::after{position:absolute;bottom:-10px;left:0;width:5px;height:5px;content:'';background:#fff;border-radius:3px;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;}*/
.etcMenu .btnFoll.on i{width:25px;background:transparent;opacity:0.6;}
.etcMenu .btnFoll.on i::before{top:0;width:25px;height:2px;transform:rotate(-45deg)}
.etcMenu .btnFoll.on i::after{top:0;width:25px;height:2px;transform:rotate(45deg)}

.etcMenu .btnGo{position:absolute;bottom:70px;left:0;width:90px;height:260px;font-size:14px;color:#fff;opacity:0.89;font-weight:700;line-height:90px;}
.etcMenu .btnGo a{position:absolute;top:0;left:0;display:block;width:260px;color:#fff;text-align:center;white-space: nowrap;transform:translate(-86px, 80px) rotate(-90deg);-webkit-transform:translate(-86px, 80px) rotate(-90deg);border-right:0px solid rgba(255,255,255,0.2)}
.etcMenu .btnGo a span {font-weight:bold;font-size:18px;letter-spacing:0}
.subfollow .btnFoll {bottom:auto;top:396px;border-bottom:0px solid rgba(255, 255, 255, 0.2)}
.subfollow .etcMenu .btnGo {display:none}

.follPop{display:none;position:absolute;bottom:440px;left:0;padding-left:180px;width:100%;height:160px;line-height:160px;overflow:hidden;background:rgba(0,0,0,0.8);transition:all 0.2s ease;-webkit-transition:all 0.2s ease;transition-delay: 0.2s;-webkit-transition-delay: 0.2s;z-index:100}

.follPop dl{display:none;vertical-align:middle;line-height:40px;transition:all 0.2s ease;-webkit-transition:all 0.2s ease;transition-delay: 0s;-webkit-transition-delay: 0s;transform:translateX(-20px);-webkit-transform:translateX(-20px)}
.follPop dl dt{display:inline-block;font-size:15px;color:#fff;font-weight:bold;}
.follPop dl dd{display:inline-block;}
.follPop .follCon1{display:none;margin-right:140px}
.follPop .follCon2{display:none;}
.follPop .follCon1 dt{margin-right:50px}
.follPop .follCon1 dd ul li{display:inline-block;margin:0 8px;vertical-align:middle}
.follPop .follCon1 dd ul li a{display:block;width:40px;height:40px;text-indent:-999px;overflow:hidden;background-repeat:no-repeat}
.follPop .follCon1 dd ul li.ic1 a{background-image:url('/_public/images/common/ic_sns1.png') }
.follPop .follCon1 dd ul li.ic2 a{background-image:url('/_public/images/common/ic_sns2.png') }
.follPop .follCon1 dd ul li.ic3 a{background-image:url('/_public/images/common/ic_sns3.png') }
.follPop .follCon1 dd ul li.ic4 a{background-image:url('/_public/images/common/ic_sns4.png') }
.follPop.on{display:block;bottom:339px;left:0;}
.follPop.on dl{display:inline-block;transform:translateX(0);-webkit-transform:translateX(0);transition-delay: 0.4s;-webkit-transition-delay: 0.4s;}
.follPop.on .follCon1,
.follPop.on .follCon2{display:inline-block;}



/*
.follPop .follCon2{border-bottom:1px solid #fff}
.follPop .follCon2 dd input{padding-bottom:5px;width:250px;height:40px;font-size:18px;color:#fff;border:0}
.follPop .follCon2 dd .btn{width:50px;height:auto;padding:5px 0;overflow:hidden;background-color:#111;border:1px solid rgba(255,255,255,0.4);transition:all 0.2s ease;-webkit-transition:all 0.2s ease;text-align:center;font-weight:500;}
.follPop .follCon2 dd .btn:hover {border:1px solid rgba(255,255,255,0.8)}
.follPop .follCon2 dd input {width:250px;color:rgba(255,255,255,0.8);font-size:13px;}
.follPop .follCon2 .privacy,
.follPop .follCon2 .btn,
.follPop .follCon2 a {float:right; color:#ffffff;font-size:13px}
.follPop .follCon2 a,
.follPop .follCon2 .privacy {margin-top:10px;position:relative}
.follPop .follCon2 .privacy:after{content:'';display:block;    position: absolute;width: 10px;height: 6px;border: 1px solid #ffffff;border-width: 0 0 1px 1px;transform: rotate(-45deg); top:4px;left:-15px; opacity:0.4;}
.follPop .follCon2 #privacy_chk:checked ~  .privacy:after {opacity:1}
.follPop .follCon2 .link {width:80px;background:url('/_public/images/common/ic_arrow3.png') no-repeat right center}
*/
.follPop .follCon2 dt {line-height:2.4}
.follPop .follCon2 dt,.follPop .follCon2 dd {height:40px;float:left;padding-right:40px}
.follPop .follCon2 dd {background-color:#d9d9d9}
.follPop .follCon2 dd:nth-of-type(1) input{width:250px;height:40px;border:0;background-color:#fff;float:left;}
.follPop .follCon2 dd:nth-of-type(1) input::placeholder {color:#444;font-size:14px}
.follPop .follCon2 dd:nth-of-type(1) input.btn{width:80px;height:40px;padding:5px 0;overflow:hidden;background-color:#111;border:1px solid rgba(255,255,255,0.4);transition:all 0.2s ease;-webkit-transition:all 0.2s ease;text-align:center;font-weight:500;color:#fff;}

.follPop .follCon2 dd:nth-of-type(2) {padding-right:30px}
.follPop .follCon2 dd:nth-of-type(2) .privacy,
.follPop .follCon2 dd:nth-of-type(3) .link {font-size:13px;line-height:2.9;font-weight:400}
.follPop .follCon2 dd:nth-of-type(2) .privacy {position:relative}
.follPop .follCon2 dd:nth-of-type(2) .privacy:after{content:'';display:block; position: absolute;width: 10px;height: 6px;border: 1px solid #222f;border-width: 0 0 1px 1px;transform: rotate(-45deg); top:5px;right:-20px; opacity:0.5;}
.follPop .follCon2 dd:nth-of-type(2) .privacy:hover:after,
.follPop .follCon2 dd:nth-of-type(2) #privacy_chk:checked ~ .privacy:after {opacity:1}

.chek_mail{position:absolute;opacity:0;width:0;height:0}
.chek_mail + label{position:relative;display:inline-block;margin:9px 10px 5px 0;padding-left:23px;height:24px;line-height:1.3}
.chek_mail + label::before{opacity:0;position:absolute;top:10px;left:0;width:19px;height:19px;content:'';border:1px solid #262626;border-radius:50%;box-sizing:border-box;transform:translateY(-50%);-webkit-transform:translateY(-50%);}
.chek_mail + label::after{position:absolute;top:5px;left:4px;width:10px;height:6px;content:'';border:1px solid #262626;border-width:0 0 1px 1px;transform:rotate(-45deg);}
.chek_mail:checked + label span{background:none;}
.chek_mail:checked + label::after{}
.chek_mail:checked + label:before{opacity:1}


.follPop .follCon2 dd:nth-of-type(3) {padding:0 20px 0 0}
.follPop .follCon2 dd:nth-of-type(3) .link {width:63px;display:inline-block;position:relative;background:url('/_public/images/common/ic_s_next.png') no-repeat right center}
.follPop .follCon2 dd:nth-of-type(3) .link:after {content:"";width:50px;height:1px;position:absolute;bottom:8px;background-color:#444;display:block}

.subfollow .follPop.on {top:396px;bottom:auto}
.subfollow .follPop {top:396px;bottom:auto}

/*.subfollow .follPop.on {bottom:79px}*/

/* 전체메뉴 */
.totalMenu{display:none;overflow-y:auto;position:fixed;top:0;left:0;padding:0 90px;width:100%;height:100%;background:rgba(0,0,0,0.95);z-index:2000;}
.totalMenu .btnTotalClose{position:absolute;top:0;left:0;width:90px;height:90px;text-indent:-999px;overflow:hidden;background:url('/_public/images/common/ic_close.png') no-repeat center center;}
/*
.totalMenu .menuWrap{display:table;margin:0 auto;max-width:1300px;height:100%}
.totalMenu .menuBox{position:relative;display:table-cell;vertical-align:middle}
.totalMenu .menuBox header{position:relative;margin-bottom:120px;;padding-top:28px;height:90px}
.totalMenu .menuBox header .logo{width:182px;height:32px;text-indent:-9999px;overflow:hidden;background:url('/_public/images/common/logo.png') no-repeat;}
.totalMenu .menuBox .to_btnMember{position:absolute;top:28px;right:0;}
.totalMenu .menuBox .to_btnMember .btn{display:inline-block;margin-left:3px;}
.totalMenu .menuBox .to_btnMember .btn a{display:block;padding:0 25px;font-size:13px;color:rgba(255,255,255,0.6);line-height:35px;border:1px solid rgb(255,255,255,0.2)}
.totalMenu .menuBox .menuCon{}

.totalMenu .menuBox dl{position:relative;margin-bottom:40px;padding-left:290px}
.totalMenu .menuBox dl dt{position:absolute;top:0;left:0;font-weight:700;color:#fff}
.totalMenu .menuBox dl dt::after{position:absolute;top:12px;left:93px;width:150px;height:1px;content:'';background:#fff}
.totalMenu .menuBox dl dd a{display:block;color:#fff}
.totalMenu .menuBox dl dd .site1 > li{position:relative;margin-bottom:30px;padding-left:95px}
.totalMenu .menuBox dl dd .site1 > li .tit{position:absolute;top:0;left:0;font-weight:700;}
.totalMenu .menuBox dl dd .site1 > li ul li{display:inline-block;margin-right:12px}
.totalMenu .menuBox dl dd .site1 > li ul li a{font-size:15px;color:#fff;opacity:0.6}
.totalMenu .menuBox dl dd .site2 li{display:inline-block;margin-right:15px;font-size:15px;font-weight:700;}
*/
.totalMenu .menuWrap{display:table;margin:0 auto;/*max-width:1600px;*/height:100%}
.totalMenu .menuBox{position:relative;display:table-cell;vertical-align:middle}
.totalMenu .menuBox header{position:relative;margin-bottom:50px}
.totalMenu .menuBox header .logo{width:205px;height:40px;text-indent:-9999px;overflow:hidden;background:url('/_public/images/common/logo.png') no-repeat;}
.totalMenu .menuBox .to_btnMember{position:absolute;top:0;right:0;}
.totalMenu .menuBox .to_btnMember .btn{display:inline-block;margin-left:3px;}
.totalMenu .menuBox .to_btnMember .btn a{display:block;padding:0 20px;font-size:15px;line-height:25px;border:2px solid rgb(255,255,255,0.9);color:#fff;font-weight:500}
.totalMenu .menuBox .to_btnMember .btn.joinsp a{border:2px solid rgb(255,255,255,0.9);background:#fff;color:#222;}
.totalMenu .menuBox .menuCon{max-width:1260px;}
.totalMenu .menuBox .smbox{width:100%;position:relative;margin-bottom:20px;padding-left:290px}
.totalMenu .menuBox .smbox:after {width:100%;content:"";display:table}
.totalMenu .menuBox .smbox .list a{font-size:14px;display:block;color:#fff}

.totalMenu .menuBox .smbox.smbox1 {padding-left:0;border-bottom:2px solid rgba(255,255,255,0.2)}
.totalMenu .menuBox .smbox.smbox1 .list {width:170px;display:inline-block;float:left;margin-right:10px}
.totalMenu .menuBox .smbox.smbox1 .list .tit{display:block;font-weight:700;border-bottom:2px solid rgba(255,255,255,0.2);padding-bottom:10px;text-align:center}
.totalMenu .menuBox .smbox.smbox1 .list > ul > li{position:relative;padding:7px 10px 7px  10px;border-bottom:1px dashed rgba(255,255,255,0.15);}
.totalMenu .menuBox .smbox.smbox1 .list > ul > li:last-child {border-bottom:0}
.totalMenu .menuBox .smbox.smbox1 .list .sp:after {content:'';width:100%;display:table}
.totalMenu .menuBox .smbox.smbox1 .list ul.smdepth {padding-top:5px}
.totalMenu .menuBox .smbox.smbox1 .list ul.smdepth li {position:relative;padding-left:5px}
.totalMenu .menuBox .smbox.smbox1 .list.knmm ul.smdepth li {display:inline-block;float:left;margin-right:5px;float:left;padding-left:5px}
.totalMenu .menuBox .smbox.smbox1 .list ul.smdepth li:before {content:'';width:2px;height:2px;background-color:rgba(255,255,255,0.7);display:inline-block;position:absolute;top:9px;left:0}

.totalMenu .menuBox .smbox.smbox1 .list ul.smdepth a {font-size:14px;opacity:0.8}
.totalMenu .menuBox .smbox.smbox1 .list > li > ul > li a{font-size:14px;color:#fff;}

.totalMenu .menuBox .smbox .list .site2 li{display:inline-block;margin-right:15px;font-size:15px;font-weight:700;}
.totalMenu .menuBox .smbox strong.smtitle {font-size:14px;position:absolute;top:0;left:0;font-weight:700;color:#fff}
.totalMenu .menuBox .smbox strong.smtitle::after{position:absolute;top:12px;left:93px;width:150px;height:1px;content:'';background:#fff}



/* ---- 중간영역 ---- */
#container .subVisual{position:relative;padding:250px 140px 0;height:635px;overflow:hidden;background-size:cover;box-sizing:border-box;}
#container .subVisual::after{position:absolute;top:-10%;left:0;width:100%;height:115%;content:'';z-index:1;-webkit-animation: mymove 15s ; animation: mymove 15s ;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;background-repeat:no-repeat;background-position:center top;background-color:#000;background-size:auto 100%}
#container .subVisual.bg1::after{background-image:url('/_public/images/sub/sub_visual01.jpg')}
#container .subVisual.bg1_1::after{background-image:url('/_public/images/sub/sub_visual01_2.jpg')}
#container .subVisual.bg2::after{background-image:url('/_public/images/sub/sub_visual02.jpg')}
#container.sub2_1 .subVisual.bg2::after{background-image:url('/_public/images/sub/sub3_6.jpg')}
#container.sub2_2 .subVisual.bg2::after{background-image:url('/_public/images/sub/sub2_2.jpg')}
#container.sub2_3 .subVisual.bg2::after{background-image:url('/_public/images/sub/sub2_3.jpg')}
#container.sub2_4 .subVisual.bg2::after{background-image:url('/_public/images/sub/sub2_4.jpg')}
#container .subVisual.bg3::after{background-image:url('/_public/images/sub/sub_visual03_2.jpg')}
#container .subVisual.bg3_2::after{background-image:url('/_public/images/sub/sub_visual03_3.jpg')}
#container .subVisual.bg3_3::after{background-image:url('/_public/images/sub/sub_visual03_4.jpg')}
#container .subVisual.bg4_3::after{background-image:url('/_public/images/sub/sub_visual04_4.jpg')}
#container.sub3_3 .subVisual.bg3::after{background-image:url('/_public/images/sub/sub3_3.jpg')}
#container.research .subVisual::after{background-image:url('/_public/images/sub/sub2_1.jpg')}
#container.research .subVisual.bg8_2::after{background-image:url('/_public/images/sub/sub3_6_2.jpg')}
#container .subVisual.bg8_2::after{background-image:url('/_public/images/sub/sub3_6_2.jpg')}
#container .subVisual.bg4::after{background-image:url('/_public/images/sub/sub_visual04.jpg')}
#container .subVisual.bg5::after{background-image:url('/_public/images/sub/sub_visual05_1.jpg')}
#container .subVisual.bg6::after{background-image:url('/_public/images/sub/sub_visual06.jpg')}
#container.sub6_1 .subVisual.bg6::after{background-image:url('/_public/images/sub/sub6_1_2.jpg')}
#container .subVisual.bg7::after{background-image:url('/_public/images/sub/sub_visual07.jpg')}
#container .subVisual.material::after{background-image:url('/_public/images/sub/sub_visual08.jpg')}
#container .subVisual.bg9::after{background-image:url('/_public/images/sub/sub_visual09.jpg')}
@-webkit-keyframes mymove{
	0% {top:-10%;}
	50% {top:0}
	100% {top:0}
}
@keyframes mymove{
	0% {top:-10%;}
	50% {top:0}
	100% {top:0}
}

.left_title{position:relative;margin:0 auto;max-width:1300px;color:#fff;z-index:2}
.left_title h2{margin-bottom:35px;font-size:55px;font-weight:400}
.left_title p{font-weight:300;/*opacity:0.8;*/line-height:1.4;letter-spacing:0}

.breadcrumb{position:absolute;right:0;bottom:-100px;width:100%;z-index:2}
.breadcrumb::after{display:block;clear:both;content:''}
.breadcrumb .box{margin:0 auto}
.breadcrumb ul{float:right;}
.breadcrumb ul li{float:left;border-bottom:1px solid rgba(255,255,255,0.4)}
.breadcrumb ul li a {display:block;padding:0 24px 20px;font-size:15px;color:#fff;opacity:0.9;font-weight:400;}
.breadcrumb ul li:last-child a,
.breadcrumb ul li a:hover {opacity:1; font-weight:500}
.breadcrumb ul li:last-child{opacity:1;border-bottom:1px solid rgba(255,255,255,1); }

.breadcrumb ul li:first-child{width:95px;text-indent:-999px;overflow:hidden;background:url('/_public/images/common/ic_home.png') no-repeat center 5px;}

#lnb{position:absolute;left:0;top:567px;width:100%;height:68px;text-align:center;background:rgba(0,0,0,0.5);z-index:2}
#lnb > ul > li{/*position:relative;*/display:inline-block}
#lnb > ul > li > a{position:relative;display:block;padding:0 18px;}
#lnb > ul > li > a span{position:relative;display:block;font-size:16px;color:#fff;line-height:68px;font-weight:300;}
#lnb > ul > li > a::before{position:absolute;top:50%;left:0;width:2px;height:2px;content:'';background:#fff;opacity:0.2}
#lnb > ul > li:first-child a::before{display:none}
#lnb > ul > li > a::after{position:absolute;left:0;right:0;bottom:0;margin:0 auto;width:56px;height:0;content:'';background:#fff;transition:all 0.2s ease;-webkit-transition:all 0.2s ease}
#lnb > ul > li.on > a{font-weight:500}
#lnb > ul > li.on > a::after,
#lnb > ul > li > a:hover::after{height:3px;background:#dedede}
#lnb.fix{position:fixed;top:0;bottom:auto;background:rgba(0,0,0,0.8);z-index:100}
/*
#lnb .tabMenu {top: 100%;left: 0;z-index:3;width:100%;padding:8px 0;background-color:#dedede;}
#lnb .tabMenu,
#lnb .tabMenu > ul > li > ul{position: absolute;opacity: 0;-webkit-transition: opacity .25s ease .1s;-moz-transition: opacity .25s ease .1s;-o-transition: opacity .25s ease .1s;-ms-transition: opacity .25s ease .1s;transition: opacity .25s ease .1s}
#lnb .tabMenu > ul > li,
#lnb .tabMenu > ul > li > li.has-sub {visibility: hidden; -webkit-transition: height .25s ease .1s; -moz-transition: height .25s ease .1s; -o-transition: height .25s ease .1s; -ms-transition: height .25s ease .1s; transition: height .25s ease .1ss}
#lnb > ul > li:hover .tabMenu,
#lnb .tabMenu > ul > li:hover > ul {opacity: 1}
#lnb > ul > li:hover .tabMenu > ul > li {height: 28px; visibility: visible}
*/
.tabMenu {top: 100%;left: 0;z-index:3;width:100%;padding:8px 0;background-color:#dedede;}
.tabMenu,
.tabMenu > ul > li > ul{position: absolute;}
.tabMenu > ul > li{position:relative;display:inline-block;padding:0 7px}
.tabMenu > ul > li::before{position:absolute;top:14px;left:0;width:2px;height:2px;content:'';background:#222;}
.tabMenu > ul > li:first-child{padding-left:0}
.tabMenu > ul > li:last-child{padding-right:0}
.tabMenu > ul > li:first-child::before{display:none}
.tabMenu > ul > li > a{display:block;padding:0 7px;font-size:15px;color:#222;line-height:26px;letter-spacing:-1px;border:1px solid rgba(34,34,34,0);font-weight:400}
.tabMenu > ul > li > a:hover{border:1px solid #222;transform:translateY(-2px);-webkit-transform:translateY(-2px)}
.tabMenu > ul > li.on > a,
.tabMenu > ul > li.hv > a{border:1px solid #222;}
.tabMenu.li4 > ul > li:nth-child(5){clear:left;padding-left:0}
.tabMenu.li4 > ul > li:nth-child(5)::before{display:none}
.tabMenu > ul > li > ul{display:none;position:absolute;top:35px;padding:0 10px;background:#fff;border:1px solid #e2e2e2}
.tabMenu > ul > li > ul > li{display:inline-block;margin:0 10px;font-size:14px}
.tabMenu > ul > li > ul > li > a{display:block;line-height:49px}
.tabMenu > ul > li > ul > li > a:hover,
.tabMenu > ul > li > ul > li.on > a{font-weight:500}
.tabMenu > ul > li > ul.sMenu1{right:-500px;width:890px !important}
.tabMenu > ul > li > ul.sMenu2{left:0;width:280px;}
.tabMenu > ul > li > ul.sMenu6{right:0;width:380px;}
.tabMenu > ul > li.hv ul,
.tabMenu > ul > li.on ul{display:block}
.tabMenu > ul > li.hv > ul{display:block}
.tabMenu > ul > li.on.active ul{display:none}
.tabMenu > ul > li.on.hv.active ul{display:block}

/* tabMenu 위치 맞춤*/
.location #lnb > ul > li:nth-child(2) > .tabMenu > ul {margin-left:-490px}

#container #content{min-height:500px}

/* ---- 하단영역 ---- */
#footer{background:#fafafa;border-top:1px solid #cfcfcf}
#footer .foot_menu1{display:none;text-align:center;border-bottom:1px solid #cfcfcf}
#footer .foot_menu1 li{display:inline-block;margin:0 60px;line-height:83px}
#footer .foot_menu1 li a{display:block}
#footer .footWrap{position:relative;margin:0 auto;padding:60px 0;width:1300px}
#footer .footWrap address{font-size:15px;font-weight:300;font-style:normal;line-height:35px}
#footer .footWrap address .loca{position:relative;display:inline-block;margin-left:20px;padding-left:20px}
#footer .footWrap address .loca::before{position:absolute;top:50%;left:0;margin-top:-5px;width:1px;height:10px;content:'';background:#949494}
#footer .footWrap .foot_menu2{position:absolute;top:50px;right:0;}
#footer .footWrap .foot_menu2::after{display:block;clear:both;content:''}
#footer .footWrap .foot_menu2 li{float:left;margin-left:10px;width:240px;}
#footer .footWrap .foot_menu2 li a{display:block;padding-left:25px;color:#949494;line-height:54px;font-weight:300;background:url('/_public/images/common/ic_arrow2.png') no-repeat right 20px center;border:1px solid #b5b5b5}
#footer .footWrap .foot_menu2 li:first-child{margin-left:0}
#footer .footWrap .foot_menu2 li a:hover{color:#000;background:url('/_public/images/common/ic_arrow4.png') no-repeat right 20px center;border:1px solid #000}
#footer .footWrap small{display:block;font-size:15px;color:#949494;font-weight:300;float:left}

#footer .foot_menu2 li select {width:100%;height:35px;padding-left:25px;color:#222;line-height:35px;}
#footer .foot_menu3 {float:right}
#footer .foot_menu3 li {float:left; margin:0 20px;position:relative}
#footer .foot_menu3 li::after{content:'';display:block;width:1px;height:10px;background:#949494;position:absolute;top:50%;right:-21px;margin-top:-5px}
#footer .foot_menu3 li:last-child{margin-right:0}
#footer .foot_menu3 li:last-child::after{display:none}

/* 메인 하단 레이아웃 */
.main #footer{border-top:0}
.main #footer .foot_menu1{display:block}




/* ----- 회원가입 4단계 certify ------ */
.certify {
	margin-top:40px;
	width:100%;
	background:#f8f8f8;
	padding:20px 2%;
}
.certify h5 {
	margin-bottom:12px;
	font-size:20px;
}
.certify h5:before {
	content:'';
	display:inline-block;
}
.certify > div {
	width:48%;
	float:left;
	padding:10px 0;
}
.certify > div:first-child { margin-right:2%; }
.certify::after {
	content:'';
	display:block;
	clear:both;
}
.certify > div > div {
	background:#fff;
	border-top:1px solid #222;
	padding:20px;
	min-height:480px;
}
.certify > div > div strong {
	display:block;
	margin-bottom:8px;
	padding-top:14px;
}
.certify > div > div > div {
	min-height:250px;
	border:2px solid #f8f8f8;
	padding:0 12px;
	margin-top:14px;
}
.certify > div > div > div li {
	margin-bottom:5px;
}
.certify > div > div > button {
	width:50%;
	display:block;
	background:#222;
	color:#fff;
	padding:12px 0;
	text-align:center;
	margin:15px auto 0;
}
