@charset "utf-8";

@import url(common.css);
@import url(page_view.css);
@import url(con_common.css); /* 기본스타일 */
 
#sub_container { position: relative }
#sub_container:after { content: ""; display: block; clear: both; }


/* 서브비주얼 */
.S_visual_wrap { position: relative; width: 100%; height: 200px;  background: url('/images/web/uvrc/sub/s_visual.jpg') no-repeat center 0 }
.S_visual{ position: relative; width: 1200px; padding-top:30px; margin: 0 auto; overflow: hidden; }
.S_visual .slogan { color:#fff; 
						-webkit-animation:move 0.8s  ease; -moz-animation:move 0.8s  ease; -o-animation:move 0.8s  ease; -ms-animation:move 0.8s  ease; animation:move 0.8s  ease;}
.S_visual .slogan h2{ font-size:50px; font-family: 'NotoL'; letter-spacing:-3px; margin-bottom:15px}
.S_visual .slogan h2 span{ font-family: 'NotoM';}
.S_visual .slogan p{font-family: 'NotoL'; font-size:17px; line-height:110%}

@-webkit-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@-moz-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@-o-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@-ms-keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}
@keyframes move {
	0% {transform:translateY(100px); opacity:0;}
	100% {transform:translateY(0); opacity:1;}
}


.sub_content {position:relative; z-index:7; width:1200px; margin:0 auto; overflow:hidden; min-height:600px; font-family:'NotoM'}


/* 왼쪽메뉴 */
#sideContent { position: absolute; left: 0; top: 0; width: 220px; height: 100%; overflow: hidden; min-height: 1px; }
#sideContent h1 {height: 120px;  background: #366D95 url(/images/web/uvrc/sub/left_mn_tit.png) no-repeat; text-align: center; line-height: 120px; font-size: 1.7em; font-family: "NanumBold"; color: #fff; letter-spacing: -1px; margin: 0 0 6px; }
.sideNavi { display: block; font-family: "Nanum"; border: 1px solid #d9d9d9; overflow: hidden }
.sideNavi li { border-top: 1px solid #d9d9d9; background: #fff; }
.sideNavi li:first-child { border-top: none }
.sideNavi li a { display: block; padding: 15px 0 15px 14px; font-size: 14px; color: #333; font-family: "NanumBold"; }
.sideNavi li a:hover, .sideNavi li a:focus, .sideNavi li a:active, .sideNavi li a.on, .sideNavi li a.lock { color: #2658B5; background: url('/images/web/uvrc/sub/bgSideNavi.gif') 94% center no-repeat; }
.sideNavi li ul { display: none; padding: 12px 0 12px 14px; border-top: 1px solid #d9d9d9; background: #f5f5f5; }
.sideNavi li ul li { border: 0; margin: 0 0 5px 0; background: #f5f5f5; }
.sideNavi li ul li a { padding: 1px 0 1px 10px; font-size: 13px; background: url('/images/web/uvrc/sub/bgSideNaviSub.gif') 0 9px no-repeat; }
.sideNavi li ul li a:hover, .sideNavi li ul li a:focus, .sideNavi li ul li a:active, .sideNavi li ul li a.on, .sideNavi li ul li a.lock { background: url('/images/web/uvrc/sub/bgSideNaviSub_on.gif') 0 7px no-repeat; }

/* 서브페이지 */
#subContent { position: relative; margin: 0 0 100px 280px; }
.subContent_body { position: relative; min-height: 600px; }

/* 로케이션 */
#location { position: relative; display: block; overflow: hidden; font-size: 12px; vertical-align: middle; padding-top: 40px; }
#location img { vertical-align: middle; margin-top: -1px }
#location span, #location strong { display: inline-block; padding-left: 13px; margin-left: 7px; background: url('/images/web/uvrc/sub/bgLocation.gif') no-repeat 0 3px; }
#location span { color: #666; }
#location strong { color: #333; }
.box_line_map { display: none; }

/* 페이지 타이틀 */
#pageTitle { font-size:30px; letter-spacing:-1px; color:#111; font-family:'NotoR'; font-weight:600; border-bottom:1px solid #ddd; padding:9px 0 13px; margin-bottom:30px}

/* etc : sns*/ 
.snsBox { position: absolute; top: 17px; right: 0; text-align: right; }
.snsBox button { display: inline-block; width: 26px; height: 26px; overflow: hidden; margin-left: 3px; background: url("/images/web/uvrc/sub/btnSns.gif") no-repeat 0 0; }
.snsBox button > span { text-indent: -1000px; font-size: 0; line-height: 0; }
.snsBox .btnPrint { background-position: 0 0; }
.snsBox .btnFbook { background-position: -29px 0; }
.snsBox .btnTwt { background-position: -58px 0; }
.snsBox .btnBlog { background-position: -87px 0; }
.snsBox .btnYtb { background-position: -116px 0; }
.snsBox .btnInstar { background-position: -145px 0; }
.snsBox .btnShare { background-position: -174px 0; }
.snsBox .sns_more { display: none; position: absolute; top: 30px; right: 0; width: 165px; *width:145px; border: 1px solid #bbb; border-radius: 2px; padding: 10px 10px 10px 7px; z-index: 30; background-color: #fff; }


 @media (max-width:800px) {
	 
	#sub_container,  .sub_content { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box }
	#sub_container { margin-top: 0; padding-top: 69px }
	#sideContent { display: none; }
	#subContent { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; width: 100%; margin: 0 0 50px 0; }
	.subContent_body { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; padding: 0 2% 0; min-height: auto; }	
	
	/* 서브비주얼 */
	.S_visual_wrap {height:auto; background-position: 60% top; background-size:cover}
	.S_visual {width:100%; height:auto; padding:8% 0 8%}
	.S_visual .slogan{width:95%; margin:0 auto; padding-top:0; text-shadow:1px 1px 4px rgba(0, 0, 0, 0.5)}
	.S_visual .slogan h2{ font-size:40px; margin-bottom:15px}
	.S_visual .slogan p{ font-family: 'NotoM'; font-size:15px; line-height:150%}
	
	
	/* 로케이션 */
	#location { padding:20px 2.5% 0}

	/* 페이지 타이틀 */
	#pageTitle { font-size: 27px; padding-top: 16px; }

	/* etc : sns*/ 
	.snsBox { position: absolute; top: 21px; right: 2%; }

	/* 라인 */
	.hr { height: 10px; border-bottom: 1px solid #ddd; margin-bottom: 30px }

	.box_snb_1 { display: none; overflow: hidden; position: absolute; top: 35px; left: -5px; z-index: 1; max-height: 0; }
	.box_snb_1 ul { border-top: 1px solid #d5d5d5; border-left: 1px solid #d5d5d5; border-right: 1px solid #d5d5d5; }
	.box_snb_1 a { display: block; font-size: 12px; padding: 0 20px; border-bottom: 1px solid #d5d5d5; background-color: #fff; color: #555; line-height: 39px; white-space: nowrap; }
	.box_snb_1 a:hover,  .box_snb_1 li.on a { background-color: #4e9c2c; color: #fff; text-decoration: underline; }

}


 @media (max-width:690px) {

	/* 페이지 타이틀 */
	#pageTitle { font-size: 24px; padding-top: 18px; }
	
	/* 서브비주얼 */
	.S_visual {padding:7% 0 9%}
	.S_visual .slogan { width:80%; margin:0 0 0 5%; word-break:keep-all}	
	.S_visual .slogan h2{margin-bottom:10px; line-height:130%}
	.S_visual .slogan h2 span{ display:block}
	.S_visual .slogan p{font-size:15px; line-height:130%}
	.S_visual .slogan p br{ display:none}

}

 @media (max-width:560px) {

	/* 서브비주얼 */
	.S_visual {padding:8% 0 8%}
	.S_visual .slogan { width:90%}	
	.S_visual .slogan h2{ font-size:30px; margin-bottom:10px; line-height:120%}
	.S_visual .slogan p{font-size:14px; line-height:120%}

}



 @media (max-width:480px) {
	
	 
	/* 페이지 타이틀 */
	#pageTitle { font-size: 20px }

	/* etc : sns*/ 
	.snsBox { top: 17px }


}


 @media (max-width:380px) {
	 
	/* 페이지 타이틀 */
	#pageTxt { font-size: 12px; margin: 6px 0 20px 0; }
	

}