@charset "utf-8";
@import url('base.css');
@import url('common.css');

#mainContainer									{ width:100%; margin:0 auto; position:relative; }
	
#backBg											{ width:100%; position: relative; overflow: hidden;}
div.mainCon1Bg									{ height:100%; max-height: 460px; background: #f8f8f8 repeat-x;}
div.mainCon2Bg									{ height:100%; max-height: 217px; background: #f8f8f8 repeat-x;}

div.eventMore { position: absolute; left:50%; top:0px; margin-left:550px;}

div.mainCon1									{ width:100%; max-width: 1100px; margin: 0 auto 0; position: relative; }
div.mainCon1 div.mainV		{ position:absolute; }
div.mainCon1 div.mainVisual	{ top: 0; left: 0; height: 460px; }
div.mainCon1 div.mainVisual .visualList		{ width:640px; position:relative; }
div.mainCon1 div.mainVisual .visualList div		{ width:100%; background: #454545; }

ul.visualList li span.visual_txt				{ width:100%; max-width:640px; line-height: 49px; padding-left: 20px; color:#fff; font-size:16px;}
ul.visualList li span.visual_txt em				{padding: 0 0 0 10px; font-size:14px; vertical-align: text-bottom;}	

ul.visualList li a.num							{ width:0; height:0; top: 430px; padding:11px 0 0 11px; line-height:0; overflow:hidden; background:url(/_static/kinu/eng/igm/main/visual_num_off.gif) 0 0 no-repeat; bottom:16px; right:0; }
ul.visualList li a.on,
ul.visualList li a.num:hover					{ background:url(/_static/kinu/eng/igm/main/visual_num_on.gif) 0 0 no-repeat; }

div.mainCon1 div.visBtn							{ height:49px; line-height: 47px; position: absolute; right: -20px; z-index:9999;}
div.mainCon1 div.visBtn div.bt						{ float:right; margin:19px 120px 0 0; }
div.mainCon1 div.visBtn div.bt a					{ float:left; padding: 0 10px 0 10px; }


div.mainCon1 div.mainEvent { margin-left: 640px; height:460px; }

div.mainCon1 div.mainEvent ul { width:100%; display:inline-block; }
div.mainCon1 div.mainEvent ul li { float: left; width: 50%; height: 215px; padding-bottom: 15px; background: #fff; }
div.mainCon1 div.mainEvent ul li:first-child { background:url(/_static/kinu/eng/igm/main/reportRbg1.png) 0 0 no-repeat;}
div.mainCon1 div.mainEvent ul li:last-child { background:url(/_static/kinu/eng/igm/main/reportRbg2.png) 0 0 no-repeat;}	
div.mainCon1 div.mainEvent ul li a { text-decoration: none; }
div.mainCon1 div.mainEvent ul li span.eventTit { height: 35px; padding: 14px 10px 7px 10px; display: block; font-size: 1.2em; color: #2f363c; font-weight: bold; letter-spacing: -0.5px;}
div.mainCon1 div.mainEvent ul li span.eventTxt { padding: 0px 10px 0 10px; display: block; font-size: 1.2em; color: #666; line-height: 140%; height: 141px; letter-spacing: -0.2px; overflow: hidden; }
div.mainCon1 div.mainEvent ul li span.eventDate { float: right; padding: 0 10px 0; font-size: 13px; color: #666; }

div.mainCon1 div.mainEvent ul li:first-child span.eventTit { color: #fffd56; }
div.mainCon1 div.mainEvent ul li:first-child span.eventTxt { color: #fff;}
div.mainCon1 div.mainEvent ul li:first-child span.eventDate { color: #fff; }

div.mainCon1 div.mainEvent ul li:last-child span.eventTit { color: #fffd56; }
div.mainCon1 div.mainEvent ul li:last-child span.eventTxt { color: #fff;}
div.mainCon1 div.mainEvent ul li:last-child span.eventDate { color: #fff; }

div.visualWrap{display:none;}

div.mainCon2					{ width:100%; max-width: 1100px;  margin: 0 auto 0; background: #0c9aae; position: relative;}
div.mainCon2 p.reportMore		{ right: 0; position:absolute;}
div.mainCon2 div.mainReport		{ position:relative; top:40px; left:0; height:217px;}
div.mainCon2 div.tabCon					{ padding:0 9px; position:relative; }
div.mainCon2 div.tabCon p.tabL			{ position:absolute; top:31%; left:10px; width:15px;}
div.mainCon2 div.tabCon p.tabR			{ position:absolute; top:31%; right:10px; width:15px;}
div.mainCon2 div.tabCon ul					{ width:98.4%; height:178px; padding-left: 28px;}
div.mainCon2 div.tabCon ul li				{ width:30.7%; height: 123px; float: left; padding:10px; background:url(/_static/kinu/eng/igm/main/reportBg.png) 0 0 no-repeat;}
div.mainCon2 div.tabCon ul li span.report_Img {padding: 16px 0 0 4px; float: left;}
div.mainCon2 div.tabCon ul li span.report_Tit	{ width: 68%; float: right; padding: 15px 5px 0; font-size: 1.2em; color: #323232; font-weight: 700; letter-spacing: -0.3px;}	

div.mainContent				{ width:100%; max-width: 1100px; margin: 0 auto 0;}
div.mainCon3				{ width:100%; margin: 23px auto 0; overflow: hidden;}
div.mainCon3 p.mTabTit1		{ padding-left: 22px; height: 52px; line-height: 52px; font-size: 21px; color: #303030; background: #f8f8f8; letter-spacing: -0.5px;}
div.mainCon3 p.mTabTit1	span { float: right; margin: 11px;}

div.mainCon3 div.mTab1				{ width:48.5%; max-width:533px; height:264px; float:left; border: 1px solid #ddd; position:relative; }
div.mainCon3 div.mTab1 ul.mTab1ul	{ height:211px; padding:0 0 0 10px; position: absolute; width: 98%; border-top:1px solid #ddd; }
div.mainCon3 div.mTab1 div.mtab1Con			{ position:absolute; top: 10px; left:0; width:100%; }
div.mainCon3 div.mTab1 div.mtab1Con ul		{ padding:10px 0 0 19px; }
div.mainCon3 div.mTab1 div.mtab1Con ul li		{ padding:0 24px 13px 11px; background:url(/_static/kinu/eng/igm/main/tabBul.gif) 0 9px no-repeat; overflow:hidden; }
div.mainCon3 div.mTab1 div.mtab1Con ul li a	{ width: 80%; max-width: 300px; display:inline-block; font-size:14px; color:#3c3c3c; letter-spacing: -0.2px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
div.mainCon3 div.mTab1 div.mtab1Con ul li span		{ float:right; font-size:13px; color:#737373; }
div.mainCon3 div.mTab1 div.mtab1Con a.more			{ position:absolute; top:-93px; right:9px; }

div.mainCon3 div.mTab2						{ width:48.5%; max-width:533px; height:264px; float:left; margin-left:30px; border: 1px solid #ddd; position:relative; }
div.mainCon3 div.mTab2 ul.mTab2ul			{ height:211px; padding:0 0 0 10px; position: absolute; width: 98.2%; border-top:1px solid #ddd;}
div.mainCon3 div.mTab2 div.mtab2Con			{ position:absolute; top: 10px; left:0; width:100%; }
div.mainCon3 div.mTab2 div.mtab2Con ul		{ padding:10px 0 0 19px; }
div.mainCon3 div.mTab2 div.mtab2Con ul li		{ padding:0 24px 13px 11px; background:url(/_static/kinu/eng/igm/main/tabBul.gif) 0 9px no-repeat; overflow:hidden; }
div.mainCon3 div.mTab2 div.mtab2Con ul li a	{width: 80%; max-width: 300px; display:inline-block; font-size:14px; color:#3c3c3c; letter-spacing: -0.2px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
div.mainCon3 div.mTab2 div.mtab2Con ul li span		{ float:right; font-size:13px; color:#737373; }
div.mainCon3 div.mTab2 div.mtab2Con a.more			{ position:absolute; top:-93px; right:9px; }

div.mainCon4				{ width:100%; margin: 30px auto 0; overflow: hidden;}
div.mainCon4 div.conLeft	{ float: left; width:32%; display: block; }
div.mainCon4 div.conLeft ul { }
div.mainCon4 div.conLeft ul li { width: 100%; display: block; padding-bottom: 19px; }
div.mainCon4 div.conLeft ul li:nth-child(2) { height: 58px; padding-top: 16px; background: url(/_static/kinu/eng/igm/main/mbanner_02.png) 0 0 no-repeat;}
div.mainCon4 div.conLeft ul li:nth-child(2) span { display:block; margin-left: 150px; padding: 0 0 5px 11px; font-size: 14px; color: #3c3c3c; background: url(/_static/kinu/eng/igm/main/tabBul.gif) 0 9px no-repeat;}
div.mainCon4 div.conLeft ul li:last-child img { padding: 1px 0 1px; border:1px solid #ddd;}

div.mainCon4 div.conCenter	{ float:left; display: block;}
div.popupZone				{ float:right; position:relative; border: 1px solid #d0d0d0;}
div.popupZone p.tit		{ width:398px; top: 227px; overflow:hidden; position: absolute; }
div.popupZone p.tit em.banner_btn	{ float:right; }
div.popupZone p.tit em.banner_btn a			{ display:inline-block; padding-left: 3px; float:left;}
	
div.mainCon4 div.conRight	{float:right; width: 30%; /* max-height: 251px; */}
div.mainCon4 div.conRight p.videoTit {padding: 10px 0 10px 15px;font-size: 22px;color: #333;letter-spacing: -0.5px;}
div.mainCon4 div.conRight p.videoImg { width: 100%; text-align: center; display: block;}
div.mainCon4 div.conRight p.videoImg span { padding:5px 0 5px; display: block; font-size: 14px; color: #ebeaff; font-weight: 600;}
div.mainCon4 div.conRight ul {	
	margin-top: -30px;
	overflow: hidden;
	}
div.mainCon4 div.conRight ul li {
	height: 110px;
	margin-top: 30px;
    border: 1px solid #ddd;
	overflow: hidden;
	}
div.mainCon4 div.conRight ul li a {
	display: block;
	}

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

div.mainCon1 div.mainEvent ul li span.eventTit { height: 40px; padding: 16px 10px 0 10px;}
div.mainCon1 div.mainEvent ul li span.eventTxt {height: 160px;}

div.mainCon2 div.tabCon ul { padding-left: 3%;}
div.mainCon2 div.tabCon ul li		{ width:30.5%; height: 160px;}
div.mainCon2 div.tabCon ul li span.report_Tit { padding: 15px 5px 0 28px; position: absolute; max-width: 200px; }

}

@media screen and (min-width : 768px) and ( max-width:1200px ){

div.mainCon3						{ width: 99%; margin: 10px 5px 0 5px;}
div.mainCon3 div.mTab1				{width: 48%;}
div.mainCon3 div.mTab2				{width: 48%; margin-left: 23px;}

div.mainCon4 div.conLeft { width: 31%; }
div.mainCon4 div.conLeft ul {width: 100%;}



div.mainCon4 div.conRight {margin-right: 10px; }
div.mainCon4 div.conRight p.videoImg img { width: 88%;}


div.banner { display:none;}


}

@media screen and (min-width : 768px) and ( max-width:1023px ){

div.mainCon1Bg									{ height:100%; max-height: 100%; background: #a7dff2 repeat-x;}
div.eventMore { display: none;}

div.mainCon1					{ width:100%; overflow:hidden; position:relative; }
div.mainCon1 div.mainV { position:relative;}

div.mainCon1					{ width:100%; overflow:hidden; position:relative; }

div.visualWrap { display:block; }
#slider ul.slides a				{ display:block; text-align:center; }
#slider ul.slides img			{ width:auto; max-width:100%; }
ul.flex-direction-nav			{ position:absolute; right:0; z-index:999; bottom: 0px;}
ul.flex-direction-nav li		{ float:left; }
ul.flex-direction-nav a			{ display:inline-block; overflow:hidden; text-indent:-999999px; }
ul.flex-direction-nav a.flex-prev			{ width:39px; height:40px; background:url(/_static/kinu/kr/igm/main/slideL.png) 0 0 no-repeat; }
ul.flex-direction-nav a.flex-next			{ width:39px; height:40px; background:url(/_static/kinu/kr/igm/main/slideR.png) 0 0 no-repeat; }
ul.flex-direction-nav a.flex-pause			{ width:40px; height:40px; background:url(/_static/kinu/kr/igm/main/slideC.png) 0 0 no-repeat; }

div.mainVisual { display:none;}

div.mainCon1 div.mainEvent { width: 100%; max-width: 100%; max-height: 100%; height: 100%; margin: 0; display:block;}
div.mainCon1 div.mainEvent ul { }
div.mainCon1 div.mainEvent ul li { /* height: 100px; */ width:25%; }
/* 2017-07-05 �ּ�ó��
div.mainCon1 div.mainEvent ul li:first-child { background:url(/_static/kinu/kr/igm/main/reportRbg1mob.png) 0 0 no-repeat;}
div.mainCon1 div.mainEvent ul li:last-child { background:url(/_static/kinu/kr/igm/main/reportRbg2mob.png) 0 0 no-repeat;}	
*/
div.mainCon1 div.mainEvent ul li:first-child { background:url(/_static/kinu/kr/igm/main/reportRbg1mob.png) 0 0 no-repeat;}
div.mainCon1 div.mainEvent ul li:first-child + li + li {background:url(/_static/kinu/kr/igm/main/reportRbg1mob.png) 0 0 repeat;}
div.mainCon1 div.mainEvent ul li:first-child + li + li span.eventTit {color:#fffd56 }
div.mainCon1 div.mainEvent ul li:first-child + li + li span.eventDate { color:#fff;} 
div.mainCon1 div.mainEvent ul li:last-child { background:#fff;}
div.mainCon1 div.mainEvent ul li:last-child .eventTit { height: 45px; padding: 10px 10px 0 10px; color: #666 !important;}
div.mainCon1 div.mainEvent ul li:last-child span.eventDate { color:#666} 
div.mainCon1 div.mainEvent ul li span.eventTit { height:45px; padding: 10px 10px 0 10px; }
div.mainCon1 div.mainEvent ul li span.eventTxt { /*height: 80px;*/}
div.mainCon1 div.mainEvent ul li span.eventDate { float: right; padding: 0 10px 10px; font-size: 13px; color: #666; }

div.mainCon2 div.tabCon ul { padding-left: 4%;}
div.mainCon2 div.tabCon ul li		{ width:43%; height: 160px; margin-right: 10px;}
div.mainCon2 div.tabCon ul li span.report_Tit { padding: 15px 5px 0 28px; position: absolute; max-width: 190px;}

div.mainCon4 { margin: 20px auto 0;}
div.mainCon4 div.conLeft { width: 100%; display: block; text-align: center; margin-bottom: 20px; float: none;}
div.mainCon4 div.conLeft ul li { width: 32%; padding-bottom: 0; display:inline-block;}
div.mainCon4 div.conLeft ul li:nth-child(2) { background: url(/_static/kinu/eng/igm/main/mbanner_02.png) 20% 0 no-repeat;}
div.mainCon4 div.conLeft ul li:nth-child(2) span { margin-left: 45%; text-align: left;}
div.mainCon4 div.conLeft ul li:last-child img { padding: 9px 0 9px; border:1px solid #ddd;}

div.mainCon4 div.conCenter {  margin: 0 0 20px 14px;}
div.popupZone { float: none; margin: 0 auto;}

div.mainCon4 div.conRight { margin: 0 auto; width: 100%; max-width: 340px; float:none; overflow: hidden; background: url(/_static/kinu/kr/igm/main/prvideoBg.png) 50% 0 no-repeat #535174;}
div.mainCon4 div.conRight p.videoTit { padding-left: 5px;}
div.mainCon4 div.conRight p.videoImg span	{ padding: 10px 0 5px 0;}

}


@media screen and (max-width : 767px){

div.mainCon1Bg									{ height:100%; max-height: 100%; background: #a7dff2 repeat-x;}
div.eventMore { display: none;}
div.mainCon1 div.mainV { position:relative;}

div.mainCon1					{ width:100%; overflow:hidden; position:relative; }

div.visualWrap { display:block; }
#slider ul.slides a				{ display:block; text-align:center; }
#slider ul.slides img			{ width:auto; max-width:100%; }
ul.flex-direction-nav			{ position:absolute; right:0; z-index:999; bottom: 0px;}
ul.flex-direction-nav li		{ float:left; }
ul.flex-direction-nav a			{ display:inline-block; overflow:hidden; text-indent:-999999px; }
ul.flex-direction-nav a.flex-prev			{ width:39px; height:40px; background:url(/_static/kinu/kr/igm/main/slideL.png) 0 0 no-repeat; }
ul.flex-direction-nav a.flex-next			{ width:39px; height:40px; background:url(/_static/kinu/kr/igm/main/slideR.png) 0 0 no-repeat; }
ul.flex-direction-nav a.flex-pause			{ width:40px; height:40px; background:url(/_static/kinu/kr/igm/main/slideC.png) 0 0 no-repeat; }

div.mainVisual { display:none;}

div.mainCon1 div.mainEvent { width: 100%; max-width: 100%; max-height: 100%; height: 100%; margin: 0; display:block;}
div.mainCon1 div.mainEvent ul { }
div.mainCon1 div.mainEvent ul li { /* height: 85px; */ width: 49%; height: 100%; }
div.mainCon1 div.mainEvent ul li:first-child { background:url(/_static/kinu/kr/igm/main/reportRbg1mob.png) 0 0 repeat;}
div.mainCon1 div.mainEvent ul li:last-child { background:url(/_static/kinu/kr/igm/main/reportRbg2mob.png) 0 0 repeat;}	
div.mainCon1 div.mainEvent ul li span.eventTit { height:40px; padding: 10px 10px 0 10px; font-size: 1.25em; }
div.mainCon1 div.mainEvent ul li span.eventTxt {/* height: 85px;*/ font-size: 1em; height:100% !important; padding-bottom: 5%; padding-top:6px;}
div.mainCon1 div.mainEvent ul li span.eventDate { float: right; padding: 0 10px 10px; font-size: 11px; color: #666; }


div.mainCon2 div.tabCon ul { padding-left: 4%;}
div.mainCon2 div.tabCon ul li		{ width:43%; height: 160px; margin-right: 10px;}
div.mainCon2 div.tabCon ul li span.report_Tit { padding: 15px 5px 0 28px; position: absolute; max-width: 190px;}

div.mainCon3						{ margin: 15px 0 0 0;}
div.mainCon3 div.mTab1				{ width:99.5%; max-width: 99.5%;}
div.mainCon3 div.mTab2				{ width:99.5%; max-width: 99.5%; margin:15px 0 0 0;}
div.mainCon3 div.mTab1 ul.mTab1ul { width: 98.5%;}
div.mainCon3 div.mTab2 ul.mTab2ul { width: 98.5%;}

div.mainCon3 p.mTabTit1 { padding-left: 10px; height: 45px; line-height: 45px; font-size: 18px;}
div.mainCon3 p.mTabTit1 span { margin: 8px;}

div.mainCon3 div.mTab1 { height: 250px;}
div.mainCon3 div.mTab1 div.mtab1Con ul { padding: 5px 0 0 8px;}
div.mainCon3 div.mTab1 div.mtab1Con ul li { padding: 0 13px 13px 11px;}
div.mainCon3 div.mTab1 div.mtab1Con ul li a { max-width: 200px; font-size: 12px;}

div.mainCon3 div.mTab2 { height: 250px;}
div.mainCon3 div.mTab2 div.mtab2Con ul { padding: 5px 0 0 8px;}
div.mainCon3 div.mTab2 div.mtab2Con ul li { padding: 0 13px 13px 11px;}
div.mainCon3 div.mTab2 div.mtab2Con ul li a { max-width: 200px; font-size: 12px;}

div.mainCon4 { margin: 20px auto 0;}
div.mainCon4 div.conLeft { width: 100%; display: block; text-align: center; margin-bottom: 20px; float: none;}
div.mainCon4 div.conLeft ul li { padding-bottom: 10px;}
div.mainCon4 div.conLeft ul li:nth-child(2) { background: url(/_static/kinu/eng/igm/main/mbanner_02.png) 50% 0 no-repeat;}
div.mainCon4 div.conLeft ul li:nth-child(2) span { margin-left: 50%; text-align: left;}

div.mainCon4 div.conCenter { float: none; margin: 0 0 20px 0;}
div.popupZone { float: none; margin: 0 auto; max-width: 398px;}
div.popupZone p.tit { width: 100%; max-width: 398px; top: 0px; }


div.mainCon4 div.conRight {margin: 0 auto;width: 100%;max-width: 330px;float:none;/* background: url(/_static/kinu/kr/igm/main/prvideoBg.png) 50% 0 no-repeat; */}
div.mainCon4 div.conRight p.videoTit { padding-left: 5px;}
div.mainCon4 div.conRight p.videoImg span	{ padding: 10px 0 5px 0;}


}

@media screen and (max-width : 600px){

div.mainVisual { display:none;}

div.mainCon1					{ width:100%; overflow:hidden; position:relative; }
div.visualWrap { display:block; background: #555;}
#slider ul.slides a				{ display:block; text-align:center; }
#slider ul.slides img			{ width:auto; max-width:100%; }
ul.flex-direction-nav			{ position:absolute; right:0; z-index:999; }
ul.flex-direction-nav li		{ float:left; }
ul.flex-direction-nav a			{ display:inline-block; overflow:hidden; text-indent:-999999px; }
ul.flex-direction-nav a.flex-prev			{ width:39px; height:40px; background:url(/_static/kinu/kr/igm/main/slideL.png) 0 0 no-repeat; }
ul.flex-direction-nav a.flex-next			{ width:39px; height:40px; background:url(/_static/kinu/kr/igm/main/slideR.png) 0 0 no-repeat; }
ul.flex-direction-nav a.flex-pause			{ width:40px; height:40px; background:url(/_static/kinu/kr/igm/main/slideC.png) 0 0 no-repeat; }

div.mainCon1 div.mainEvent ul li { height: 100%}
div.mainCon1 div.mainEvent ul li span.eventTit { padding: 10px 10px 0 10px; font-size: 1.2em;}
div.mainCon1 div.mainEvent ul li span.eventTxt { height: 82px; font-size: 1em;}

div.mainCon2 div.tabCon ul { padding-left: 19%;}
div.mainCon2 div.tabCon ul li		{ width:85%; height: 160px;}
div.mainCon2 div.tabCon ul li span.report_Tit { width: 100%; padding: 15px 5px 0 28px; position: absolute; max-width: 180px;}

}


@media screen and (min-width : 320px) and ( max-width:460px ){

div.mainCon1 div.mainEvent ul li { height: 190px;}
div.mainCon1 div.mainEvent ul li span.eventTit { height: 20%; line-height: 110%; padding: 10px 10px 0 10px; font-size: 1.2em;}
div.mainCon1 div.mainEvent ul li span.eventTxt { height: 20%; font-size: 1em;}

div.mainCon2 div.tabCon ul { padding-left: 7%;}
div.mainCon2 div.tabCon ul li	{ width:80%;}

div.mainCon2 div.tabCon ul li span.report_Tit { font-size: 1em; max-width: 150px;}


}