@charset "utf-8";


/* 서브레이아웃 */
#svisible { width:100%; }

#scontainer { width:1400px; margin:0 auto 70px; }	
		
	#sleft { float:left; width:280px; margin-right:60px; }
	#sright { float:left; position:relative; width:calc(100% - 340px); }
		#content { width:100%; }


@media (min-width:1281px) and (max-width:1400px){
	#svisible { width:100%; }

	#scontainer { width:100%; padding:0 15px; margin:0 auto 70px; }	
			
		#sleft { float:left; width:250px; margin-right:50px; }
		#sright { float:left; position:relative; width:calc(100% - 300px); }
			#content { width:100%; }
}


@media (min-width:1025px) and (max-width:1280px){
	#svisible { width:100%; }
	
	#scontainer { width:100%; padding:0 15px; margin:0 auto 70px; }
		
		#sleft { float:left; width:220px; margin-right:30px; }
		#sright { float:left; position:relative; width:calc(100% - 250px); }
			#content { width:100%; }
}



@media (min-width:769px) and (max-width:1024px){
	#svisible { width:100%; }
	
	#scontainer { width:100%; margin:0 auto 50px; }
		
		#sleft { display:none; }
		#sright { float:none; position:relative; width:100%; padding:0 30px; }
			#content { width:100%; }
}


@media (max-width:768px){
	#svisible { display:none; }
	
	#scontainer { width:100%; margin:0 auto 30px; }
		
		#sleft { display:none; }
		#sright { float:none; position:relative; top:0; width:100%; padding:0;  }
			#content { width:100%; padding:0 15px; }
}



	 
/* h3, h4, h5 */
#content h3 { padding-left:27px; background:url(/images/common/blt_h3.gif) no-repeat 0 7px; font-weight:normal; font-family:NotoSans-Medium, "본고딕 미디엄"; font-size:130%; color:#000; margin-bottom:20px; }
#content h4 { padding-left:21px; background:url(/images/common/blt_h4.gif) no-repeat 0 6px; font-weight:normal; font-family:NotoSans-Medium, "본고딕 미디엄"; font-size:110%; color:#222; margin-bottom:10px; }
#content h5 { padding-left:17px; background:url(/images/common/blt_h5.gif) no-repeat 0 9px; font-weight:normal; font-size:105%; color:#000; margin-bottom:6px; }

#printArea h3 { padding-left:27px; background:url(/images/common/blt_h3.gif) no-repeat 0 7px; font-weight:normal; font-family:NotoSans-Medium, "본고딕 미디엄"; font-size:130%; color:#000; margin-bottom:10px; }
#printArea h4 { padding-left:21px; background:url(/images/common/blt_h4.gif) no-repeat 0 6px; font-weight:normal; font-family:NotoSans-Medium, "본고딕 미디엄"; font-size:110%; color:#222; margin-bottom:10px; }
#printArea h5 { padding-left:17px; background:url(/images/common/blt_h5.gif) no-repeat 0 9px; font-weight:normal; font-size:105%; color:#000; margin-bottom:6px; }




/* 서브비주얼 */
#svisible { position:relative; height:170px; background:#111 url(/images/eng/inc/svisible_bg.jpg) no-repeat 50% top;  }

#svisible .txt1 { position:absolute; top:50px; font-size:160%; font-family:NotoSans-Medium, "본고딕 미디엄"; opacity:0; letter-spacing:-1px;
	animation-name:txtMove1;
	animation-duration:1.0s; /* 걸리는 시간 */
	animation-fill-mode:forwards;
	animation-delay:0.2s;
	animation-timing-function:ease;
	animation-iteration-count:1; /* 반복횟수 */
	animation-direction:normal; /* 진행방향 alternate : 순방향 -> 역방향*/ 
	/*
	animation:txtMove1 1.5s 0.2s 1 ease fowards normal;
	*/
}

#svisible .txt1 span { color:#009fda; }

#svisible .txt2 { position:absolute; top:85px; font-size:140%; font-family:NotoSans-Medium, "본고딕 미디엄"; opacity:0; letter-spacing:-1px;
	animation:txtMove2 1.0s 0.5s 1 forwards;
}

	@keyframes txtMove1 {
		from { right:0px; opacity:0; color:#000; }
		to { right:100px; opacity:1; color:#fff; }	
	}
	
	@keyframes txtMove2 {
		from { right:0px; color:#000; opacity:0; }
		to { right:100px; color:#fff; opacity:1; }	
	}



@media (min-width:1281px) and (max-width:1400px){
	#svisible { width:100%; } 
}



@media (min-width:1025px) and (max-width:1280px){
	#svisible { width:100%; } 
	
	@keyframes txtMove1 {
		from { right:0; opacity:0; color:#000; }
		to { right:100px; opacity:1; color:#fff; }	
	}
	
	@keyframes txtMove2 {
		from { right:0px; color:#000; opacity:0; }
		to { right:100px; color:#fff; opacity:1; }	
	}
}



@media (min-width:769px) and (max-width:1024px){


	@keyframes txtMove1 {
		from { right:0px; opacity:0; color:#000; }
		to { right:50px; opacity:1; color:#fff; }	
	}
	
	@keyframes txtMove2 {
		from { right:0px; color:#000; opacity:0; }
		to { right:50px; color:#fff; opacity:1; }	
	}

}


@media (max-width:768px){
	#svisible { width:100%; } 
}



/* 좌측메뉴 */
.leftmenu { position:relative; top:-120px; width:100%; margin-bottom:30px;  }
.leftmenu h1 { height:120px; line-height:120px; background:linear-gradient(135deg, #FFF886, #F072B6); background-size:200%; color:#fff; text-align:center; text-shadow:2px 2px 5px rgba(0,0,0,0.4); font-size:150%; font-family:NotoSans-Medium, "본고딕 미디엄";
	animation : leftmenu 10s ease-in-out infinite;
}

.leftmenu h1.twoline { padding-top:28px; line-height:1.3; }

.leftmenu > ul { width:100%; border:1px solid #ddd; border-top:none; box-sizing:border-box; }
.leftmenu > ul > li { width:100%; border-bottom:1px solid #ddd; }
.leftmenu > ul > li:last-child { border-bottom:none; }
.leftmenu > ul > li > a:link,
.leftmenu > ul > li > a:visited { width:100%; padding:13px 27px 14px 15px; background:url(/images/common/leftmenu_blt1_off.gif) no-repeat right top; font-size:105%; letter-spacing:-1px; display:block; }
.leftmenu > ul > li > a:active,
.leftmenu > ul > li > a:focus,
.leftmenu > ul > li > a:hover,
.leftmenu > ul > li > a.select { background:#f4f4f4 url(/images/common/leftmenu_blt1_on.gif) no-repeat right top; color:#1757b7;  }

.leftmenu > ul ul {  width:100%; padding:10px 0 10px 15px;  border-top:1px solid #ddd; box-sizing:border-box;background:#fafafa; }
.leftmenu > ul ul li {  width:100%;  }
.leftmenu > ul ul li a:link,
.leftmenu > ul ul li a:visited { width:100%;  height:auto; line-height:1.3; padding:7px 0 5px 15px;background:url(/images/common/leftmenu_blt2_off.gif) no-repeat 0px 17px; color:#666; font-size:95%; font-family: NotoSans-DemiLight, "본고딕 데미라이트"; display:block;  }
.leftmenu > ul ul li a:active,
.leftmenu > ul ul li a:focus,
.leftmenu > ul ul li a:hover, 
.leftmenu > ul ul li a.select { background:url(/images/common/leftmenu_blt2_on.gif) no-repeat 0px 17px; color:#e96576;  }




@keyframes leftmenu {
	0% { background-position:0 50%; }
	50% { background-position:100% 50%; }
	100% { background-position:0 50%; }
}






/* 페이지 타이틀 */
.pagetitle { position:relative; width:100%; height:140px; border-bottom:1px solid #ddd; margin-bottom:50px; }

.pagetitle .path { position:absolute; left:0; top:100px; font-size:90%; color:#888; word-spacing:5px; }
.pagetitle .path span { position:relative; width:4px; height:7px; line-height:7px; background:url(/images/common/path_blt.gif) no-repeat 0 50%; text-indent:-9999em; display:inline-block; }
.pagetitle .path strong { color:#666; font-weight:normal; }

.pagetitle h1 { padding:41px 0 0 0px; font-family:NotoSans-Medium, "본고딕 미디엄"; font-size:220%; color:#000; }


.pagetitle .snsbtn { position:absolute; right:0; bottom:11px; height:35px; }
.pagetitle .snsbtn ul { height:35px; overflow:hidden;}

.pagetitle .snsbtn ul.pcTabletBtn { display:block; }
.pagetitle .snsbtn ul.mobileBtn { display:none; }

.pagetitle .snsbtn ul li { float:left; margin-left:10px; }


@media (min-width:1281px) and (max-width:1600px){
	.pagetitle .snsbtn { right:15px; }
}


@media (min-width:1025px) and (max-width:1280px){
	.pagetitle .snsbtn { right:15px; }
}


@media (min-width:769px) and (max-width:1024px){
	.pagetitle { height:100px; }
	
	.pagetitle .path { top:60px; }	
	.pagetitle h1 { padding:12px 0 0 0px; font-size:200%;  }
	
	.pagetitle .snsbtn { bottom:32px; }
	
	.pagetitle .snsbtn ul.pcTabletBtn { display:none; }
	.pagetitle .snsbtn ul.mobileBtn { display:block; }
	.pagetitle .snsbtn ul li { margin-left:5px; }
			
}

@media (max-width:768px){
	.pagetitle { height:110px; border:none; }
	.pagetitle .path { position:static; width:100%; height:55px; line-height:55px; padding:0 80px 0 10px; border-bottom:1px solid #1b2668; box-sizing:border-box; background:#26348b; color:#fff; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; display:block; }	
	.pagetitle .path strong { color:#fff; }
	
	.pagetitle h1 { padding:30px 15px 0 15px; font-size:150%; }

	.pagetitle .snsbtn { right:8px; top:10px; }
	
	.pagetitle .snsbtn ul.pcTabletBtn { display:none; }
	.pagetitle .snsbtn ul.mobileBtn { display:block; }
	.pagetitle .snsbtn ul li { margin-left:8px; }
}





/* 인사말 */
.greeting { width:100%; }
.greeting .picarea { position:relative; width:100%; height:320px; border:5px solid #ddd; box-sizing:border-box; background:#f6fafd url(/images/council/main/chairman_bg.png) no-repeat right top; overflow:hidden; margin-bottom:30px; }
.greeting .picarea .txt { line-height:1.7; color:#113d8e; font-size:120%; z-index:7; margin:105px 0 0 70px; }
.greeting .picarea .pic { position:absolute; right:100px; bottom:0; z-index:1; }

.greeting .mobile { display:none; }

.greeting .sign { line-height:3.5; text-align:right; font-size:90%; }
.greeting .sign img { position:relative; top:-4px; padding-left:10px; }

.greeting .txtarea p { line-height:1.7; margin-bottom:15px; }


@media (min-width:1025px) and (max-width:1280px){
	.greeting .picarea .txt { font-size:110%; letter-spacing:-1px; margin:60px 0 0 40px; }
	.greeting .picarea .pic { right:10px; }
}


@media (min-width:769px) and (max-width:1024px){
	.greeting .picarea .txt { font-size:110%; letter-spacing:-1px; margin:60px 0 0 40px; }
	.greeting .picarea .pic { right:0px; }
}


@media (max-width:768px){
	.greeting .picarea { height:320px; text-align:center; }
	.greeting .picarea .txt { font-size:135%; margin:30px 0 30px 0; }
	.greeting .picarea .pic { left:0; right:0; text-align:center;  }	
	
	.greeting .pc { display:none; }
	.greeting .mobile { line-height:1.7; color:#113d8e; font-size:110%; font-family:NotoSans-Medium, "본고딕 미디엄";  display:block; }
}

@media (max-width:425px){
	.greeting .picarea .txt { font-size:105%; letter-spacing:-1.2px; margin:10px 0 30px 0; }
	
}


/* 약력 */
.profile { width:100%; }

.Profile .mobile { display:none; }




/* history */
.history { width:100%; }
.history h3 span { color:#555; font-family:NotoSans-DemiLight, "본고딕 데미라이트"; font-size:80%; margin-left:10px; }
.history ul li { width:100%; border-bottom:1px dashed #eee; }




/* Members */
.member { width:100%; }

ul.mlist { width:100%; }
ul.mlist li { float:left; width:calc(50% - 15px); min-height:184px; padding:20px; border:1px solid #ddd; box-sizing:border-box; background:#fff; margin:0 15px 30px 0; }
ul.mlist li:nth-child(even) { margin:0 0 30px 15px;  }
ul.mlist li:nth-child(odd) { clear:both; }

ul.mlist li dl { width:100%; }
ul.mlist li dt { float:left; width:150px; }
ul.mlist li dt img { width:120px; height:140px; padding:3px; border:1px solid #ccc; box-sizing:content-box;  }
ul.mlist li dd { margin-left:150px; width:calc(100% - 150px); padding:3px 0 1px 0; overflow:hidden;  }

ul.mlist li dd.name { font-size:135%; color:#113d8e; font-family:NotoSans-Medium, "본고딕 미디엄"; }
ul.mlist li dd b { float:left; color:#888; font-weight:normal; display:inline-block; }
ul.mlist li dd b .ts {padding-right:15px; }
ul.mlist li dd .itemContent { float:left; /*width:calc(100% - 60px);*/ display:inline-block; }

.areatxt { font-size:90%; color:#777; } /* 선거구 동표시 */

ul.mlist li dd .email { font-style:normal; word-break:break-all; }

ul.mlist li dd a.abtn1 { width:110px; height:40px; line-height:40px; border-radius:3px; background:#e06546; color:#fff; font-size:90%; text-align:center; display:inline-block; margin:10px 5px 0 0; }
ul.mlist li dd a.abtn2 { width:110px; height:40px; line-height:40px; border-radius:3px; background:#19ce60; color:#fff; font-size:90%; text-align:center; display:inline-block; margin-top:10px; }


@media (min-width:1281px) and (max-width:1400px){
	ul.mlist li dt { width:133px; }
	ul.mlist li dt img { width:110px; height:142px; }
	ul.mlist li dd { margin-left:133px; width:calc(100% - 133px); }
}


@media (min-width:1025px) and (max-width:1280px){
	ul.mlist li dt { width:133px; }
	ul.mlist li dt img { width:110px; height:142px; }
	ul.mlist li dd { margin-left:133px; width:calc(100% - 133px); }
}

@media (min-width:769px) and (max-width:1024px){
	ul.mlist li dt { width:133px; }
	ul.mlist li dt img { width:110px; height:142px; }
	ul.mlist li dd { margin-left:133px; width:calc(100% - 133px); }

}


@media (max-width:768px){
	ul.mlist li { float:none; width:100%; min-height:auto; padding:15px; margin:0 0 15px 0 !important; }

	ul.mlist li dt { width:119px; }
	ul.mlist li dt img { width:90px; height:115px; }
	ul.mlist li dd { margin-left:119px; width:calc(100% - 119px); }
}

@media (max-width:425px){
	ul.mlist li { padding:10px; }
	ul.mlist li dt { width:99px; }
	ul.mlist li dt img { width:80px; height:102px; }
	ul.mlist li dd { margin-left:99px; width:calc(100% - 99px); }


	ul.mlist li dd a.abtn1 { width:90px; height:36px; line-height:36px; }
	ul.mlist li dd a.abtn2 { width:90px; height:36px; line-height:36px; }
}


/* profile */
/*.profile { width:100%;  }
.profile .picarea { position:relative; width:100%; height:300px; border:5px solid #ddd; box-sizing:border-box; background:#fff0d9; margin-bottom:30px; }
.profile .picarea .txt { position:absolute; left:70px; top:75px;  padding-right:400px; color:#113d8e; font-size:130%; font-family:NotoSans-Medium, "본고딕 미디엄";  z-index:7; }
.profile .picarea .txt .txt1 { margin-bottom:10px; width:620px; }
.profile .picarea .txt .txt1 span { display:inline-block; }
.profile .picarea .txt .txt2 { color:#4e771d;  }
.profile .picarea .pic { position:absolute; right:50px; bottom:0; z-index:6; }

.profile .sign { padding-right:20px; line-height:3.5; text-align:right; font-size:90%; }
.profile .sign img { position:relative; top:-8px; padding-left:15px; }

.profile .txtarea p { line-height:1.7; margin-bottom:15px; }


@media (min-width:1025px) and (max-width:1152px){	
	.profile .picarea .txt { left:50px; top:50px;  padding-right:350px; }	
}


@media (min-width:769px) and (max-width:1024px){
	.profile .picarea .txt { left:50px; top:50px;  padding-right:350px; }
}


@media (max-width:768px){
	.profile .picarea { height:auto; padding:20px 20px 0 20px; text-align:center; }
	.profile .picarea .txt { position:static; padding-right:0px; margin-bottom:20px; }
	.profile .picarea .pic { position:static; }	
} */


/* name */

#content .members .name { fon-size:120%;  font-family:NotoSans-Medium, "본고딕 미디엄"; }






/* organization */

.org { width:100%; }
.org .imgbox { text-align:center; }
.org img { width:100%;}

@media (max-width:741px){
	.org .imgbox img { width:100%; }
}