﻿@charset "utf-8";

#sub_container { position: relative }
#sub_container:after { content: ""; display: block; clear: both; }
.s_visual_wrap { position: relative; width: 100%; background:#0080a2; }

/* 서브비주얼 */
.S_visual { width: 980px; height: auto; margin: 0 auto; overflow: hidden; }
.S_visual img { width: 100%; }
.sub_content { position: relative; width: 980px; min-height:600px; margin: 0 auto; overflow: hidden; z-index: 7; }
.box_line_map_1 .sp_home, .box_line_map_1 .span_gt { display: block; overflow: hidden; height: 0; font-size: 0; line-height: 100px; text-indent: -10000px; }

/* 왼쪽메뉴 */
#sideContent { position: absolute; left: 0; top: 0; width: 220px; height: 100%; overflow: hidden; min-height: 1px; }
#sideContent h1 {height: 120px;  background: #266dad url(/images/sch/web/jjfirst-h/sub/left_mn_tit.png) no-repeat; border-radius:15px 15px 0 0;  text-align: center; line-height: 120px; font-size: 1.7em; font-family: "NotoM"; color: #fff; letter-spacing: -1px; margin:35px 0 6px; }
.sideNavi { display: block; font-family: "NotoR"; 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: "NotoM"; }
.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/sch/web/jjfirst-h/sub/bgSideNavi.png') 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/sch/web/jjfirst-h/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/sch/web/jjfirst-h/sub/bgSideNaviSub_on.png') 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/sch/web/jjfirst-h/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: "NotoM"; padding-top: 9px; }
#pageTxt { margin: 8px 0 30px 0; color: #666; font-size: 13px; line-height: 150%; font-family: "NotoR"; }

/* 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/sch/web/jjfirst-h/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; }

/* 라인 */
.hr { height: 10px; border-bottom: 1px solid #ddd; margin-bottom: 30px }

 @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: 67px }
	#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 { width: 100%; margin: 0; }
	#location { display: none; }

	/* 페이지 타이틀 */
	#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 }

	/* linemap */
	.box_line_map_1 .span_gt,  .box_line_map_1 .sp_home,  .box_line_map_2 > a .sp_img { background-image: url("/images/sch/web/jjfirst-h/common/sp_sub.png"); background-repeat: no-repeat; }
	.box_line_map { display: block; width: 100%; position: relative; z-index: 80; height: 39px; padding: 0; margin: 0; border-bottom: 1px solid #eee; background-color: #f3f3f3; }
	.box_line_map_1 { position: relative; width: 800px; }
	.box_line_map_1 > p,  .box_line_map_1 > p > span,  .box_line_map_1 .box_line_map_2 { float: left; margin: 0 7px; }
	.box_line_map_1 .box_line_map_2 { margin: 0; }
	.box_line_map_1 > p { height: 39px; font-family: "NotoM"; color: #555; }
	.box_line_map_1 > p > span { font-family: "NotoM"; }
	.box_line_map_1 .txt { line-height: 39px; }
	.box_line_map_1 .sp_home { width: 15px; margin: 14px 7px 0 13px; padding-top: 13px; background-position: 0 0; }
	.box_line_map_1 .span_gt { width: 9px; margin-top: 12px; padding-top: 17px; background-position: -40px 0; }
	.box_line_map_2 { position: relative; }
	.box_line_map_2.on { width: 200px; }
	.box_line_map_2 > a { display: block; float: left; position: relative; padding-right: 23px; line-height: 39px; font-family: "NotoM"; color: #555; }
	.box_line_map_2 > a .sp_img { display: block; position: absolute; top: 18px; right: 5px; width: 9px; height: 5px; background-position: -20px 0; }
	.box_line_map_2.on > a .sp_img { background-position: -30px 0; }
	.box_line_map_2.on > a { color: #151515; }
	.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: #1f5aa0; color: #fff; text-decoration: underline; }

	/* 전체 가로 스크롤 테이블  */
	#all-scroll { display: block; position: relative; overflow: hidden; overflow-x: auto; margin: 0 }
	#all-scroll .page { white-space: nowrap; border-bottom: 0; border-right: 0 }

}


 @media (max-width:690px) {

	/* 페이지 타이틀 */
	#pageTitle { font-size: 24px; padding-top: 18px; }

}


 @media (max-width:480px) {
	 
	/* 페이지 타이틀 */
	#pageTitle { font-size: 20px }

	/* etc : sns*/ 
	.snsBox { top: 17px }

	/* linemap */
	.box_line_map_2 > a { padding-right: 0; }
	.box_line_map_2 > a .sp_img,  .box_line_map_1 .sp_home,  .box_line_map_1 .sp_home + .span_gt { display: none }
	.box_line_map_1 .span_gt { overflow: hidden; position: relative; width: 23px; height: 39px; margin-top: 0; padding-top: 0; background-image: none;/* Old browsers */ background: #f3f3f3;/* FF3.6+ */ background: -moz-linear-gradient(left, #bababa 0%, #f3f3f3 100%); /* Chrome,Safari4+ */ background: -webkit-gradient(linear, left top, right top, color-stop(0%, #bababa), color-stop(100%, #f3f3f3)); /* Chrome10+,Safari5.1+ */ background: -webkit-linear-gradient(left, #bababa 0%, #f3f3f3 100%); /* Opera 11.10+ */ background: -o-linear-gradient(left, #bababa 0%, #f3f3f3 100%); /* IE10+ */ background: -ms-linear-gradient(left, #bababa 0%, #f3f3f3 100%); /* W3C */ background: linear-gradient(to right, #bababa 0%, #f3f3f3 100%); /* IE6-9 */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bababa', endColorstr='#f3f3f3', GradientType=1 );}
	
	.box_line_map_1 .span_gt:before { display: block; position: absolute; top: 20px; left: -40px; width: 40px; height: 40px; border: 1px solid #fff; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; background-color: #f3f3f3; content: ''; }
	.box_line_map_1 > p > span,  .box_line_map_1 > p { margin: 0 3px; }
	.box_line_map_1 > p:first-child { padding-left: 10px; }

}


 @media (max-width:380px) {
	 
	/* 페이지 타이틀 */
	#pageTxt { font-size: 12px; margin: 6px 0 20px 0; }

}

