@charset "utf-8";
/**
 * @File Name : lib2.css
 * @Description : Add Share Contents ..
 * @Modification Information
 * <pre>
 * 수정일 | 수정자 | 수정내용
 * 2017.05.31 | 문영신 | 최초 등록
 * 2017.06.05 | 문영신 | 요구반영. 결함개선. 고도화.
 * </pre>
 * @author 웹표준화실 문영신
 * @since 2017.05.31
 *
 * @Copyright (C) IACTS.CO.KR All rights reserved.
 */

/*! CSS Library v0.1. 20170602~ 20170605 | by MoonYoungshin[myshin@naver.com] | MIT License
 * 공유 콘텐츠 CSS 추가
 * class 선택자에 정의한다. 우선순위 높은 id 선택자는 필연적일 때만 사용한다.
 */

/** Compatible!
 * [IE8+]
 */

/** Table of contents ))
 | Base Adjust
 */


/* All Device ◆◆◆◆◆◆◆◆◆◆ */


/* Contents Styles Library 20170605 ◇◆◇◆◇◆◇◆◇◆ */



/* 패널.글1내용1 20170605 */
.panel1h1c1{display:block;position:relative;margin:0 auto;
	padding:0;
	border:0;
	line-height:1.333;
}
.panel1h1c1 *{list-style:none;margin:0;padding:0;}
.panel1h1c1 .wrap1{margin:0;}
/* 제목그룹 */
.panel1h1c1 .hg1{position:relative;
	padding:0;
	background:#fff;
	overflow:hidden;
}
.panel1h1c1 .h1{float:left;
	margin:3px 0 0;
	color:#000;font-weight:normal;font-size:22px;
	letter-spacing:-1px;
}
.panel1h1c1 .more{float:right;position:relative;
	width:24px;height:24px;
	padding:5px;
	text-indent:-9999px;
	overflow:hidden;
	background:#aaa;
	border-radius:100%;
}
.panel1h1c1 .more .t1{}
.panel1h1c1 .more .ic1{display:inline-block;
	position:absolute;left:50%;top:50%;
	width:24px;height:24px;
	margin:-12px;
	background:url(../../img/lib2/more@2x.png) no-repeat center center;
	background-size:contain;text-indent:-9999px;overflow:hidden;
	vertical-align:middle;
}
/* 내용물블록 */
.panel1h1c1 .cont{display:block;position:relative;
	min-height:132px;
	margin:10px 0 0;
	padding:15px 20px;
	border:1px solid #ddd;
	background:#fff;
}
.panel1h1c1 .cont0{display:block;position:relative;
	padding:10px 0;
}
/* 비순서목록 */
.panel1h1c1 .lst1{}
.panel1h1c1 .lst1 li{display:inline;}
.panel1h1c1 .lst1 li .a1{display:block;
	padding:3px 0 3px 10px;
	background:url(../../img/lib2/bu3.png) no-repeat 0 50%;
	color:#555;
	font-size:14px;
	text-align:left;
	overflow:hidden;cursor:pointer;
}
.panel1h1c1 .lst1 li .t1{float:left;position:relative;width:100%;height:1.333em;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.panel1h1c1 p{padding:.5em 0;} /* 내용 없으면 */
/* 순서목록 */
.panel1h1c1 ol.lst1 li .a1{padding-left:2em;}
.panel1h1c1 ol.lst1 li .a1:before{
	display:inline-block;float:left;
	box-sizing:border-box; /* ☆ */
	width:1.8em; /* =18/12 */
	height:1.7em;
	min-width:18px;
	min-height:18px;
	margin:0 .5em 0 -2.334em; /* =2/.857 */
	padding:0;
	background:#999;
	color:#fff;font-weight:400;font-size:.857em; /* =12/14 */
	font-family:Helvetica,Arial,sans-serif;
	line-height:1.8;
	letter-spacing:-1px;
	text-align:center;
	vertical-align:middle;
	border-radius:100%;
}
.panel1h1c1 ol.lst1 li:nth-child(1) .a1:before{content:'1';background:#0170e0;}
.panel1h1c1 ol.lst1 li:nth-child(2) .a1:before{content:'2';background:#4094dd;}
.panel1h1c1 ol.lst1 li:nth-child(3) .a1:before{content:'3';background:#7da7d9;}
.panel1h1c1 ol.lst1 li:nth-child(4) .a1:before{content:'4';}
.panel1h1c1 ol.lst1 li:nth-child(5) .a1:before{content:'5';}





/* 한눈에보기 20170605 */
.numbers1{display:block;
	clear:both;
	position:relative;margin:0 auto 20px;line-height:1.333;
	background:#e3e9f0;
}
.numbers1 *{list-style:none;margin:0;padding:0;}
.numbers1 .wrap1{}
.numbers1 .even-grid{}
.numbers1 .column{}
.numbers1 ul{}
.numbers1 li{}
.numbers1 li .a1{display:block;
	padding:20px 5px 19px;
	background:#047cc8;
	color:#fff;
	text-align:center;
}
.numbers1 li .t1{display:block;font-size:16px;}
.numbers1 li .t2{display:block;font-size:24px;}
.numbers1 li .ic1{display:block;
	margin:0 auto 10px;
	width:45px;height:45px;
	background:url() no-repeat;
	background-size:contain;
}
.numbers1 li.m1 .a1{background:#047cc8;}
.numbers1 li.m1 .ic1{background-image:url(../../img/lib2/numbers1p1@2x.png)}
.numbers1 li.m2 .a1{background:#012c61;}
.numbers1 li.m2 .ic1{background-image:url(../../img/lib2/numbers1p2@2x.png)}
.numbers1 li.m3 .a1{background:#074181;}
.numbers1 li.m3 .ic1{background-image:url(../../img/lib2/numbers1p3@2x.png)}
.numbers1 li.m4 .a1{background:#032251;}
.numbers1 li.m4 .ic1{background-image:url(../../img/lib2/numbers1p4@2x.png)}
.numbers1 li.m5 .a1{background:#0d2c91;}
.numbers1 li.m5 .ic1{background-image:url(../../img/lib2/numbers1p5@2x.png)}

/* @media */
@media all and (min-width:768px){
	.numbers1 li .t2{font-size:30px;}
}


/* 접속자통계 20170605 */
img.chart1bar1{display:block;width:auto;height:auto;max-height:132px;margin:0 auto;}


/* 운영체제별 접속비율 20170605 */
img.chart1donut1{display:block;width:auto;height:auto;max-height:125px;margin:0 5px;}


/* 카드.픽1글1 */
.card1f1t1{display:block;position:relative;margin:0 auto;line-height:1.333;}
.card1f1t1 *{list-style:none;margin:0;padding:0;}
.card1f1t1 .even-grid{margin:0 -8px;}
.card1f1t1 .column{
	display:none; /* ☆ for show-* */
	padding:8px;
}
.card1f1t1 .column .a1{display:block;border:1px solid #ddd;text-decoration:none;}
.card1f1t1 .column .texts>.t1{display:block;margin:8px 6px;color:#888;font-size:13px;
	overflow:hidden;
}
.card1f1t1 .column .texts>.t1 .t1t1{display:inline-block;
	margin:0 0 0 -1px;
	padding:0 6px;
	background:url(../../img/lib2/sep1.png) no-repeat 0 50%;
}
.card1f1t1 .column .f1{display:block;position:relative;height:auto;margin:-1px -1px 0;
	padding:0 0 75%; /* =3/4 */
	background:#eee;
	text-align:center;
}
.card1f1t1 .column .f1 .f1p1{display:block;position:absolute;left:0;right:0;top:0;bottom:0;height:100%;overflow:hidden;}
.card1f1t1 .column .f1 img{display:block;position:absolute;left:0;top:0;width:100%;height:auto;min-height:100%;margin:0 auto;}


/* 카드.픽1글2 20170605 */
.card1f1t2{display:block;position:relative;margin:0 auto;line-height:1.333;}
.card1f1t2 *{list-style:none;margin:0;padding:0;}
.card1f1t2 .even-grid{margin:0 -8px;}
.card1f1t2 .column{
	display:none; /* ☆ for show-* */
	padding:8px;
}
.card1f1t2 .column .a1{display:block;border:1px solid #ddd;text-decoration:none;}
.card1f1t2 .column .texts>.t1{display:block;padding:8px 12px;border-bottom:1px solid #ddd;color:#333;}
.card1f1t2 .column .texts>.t1 .t1t1{display:block;position:relative;height:2.832em;line-height:1.416;overflow:hidden;}
.card1f1t2 .column .texts>.t1 .t1t1:after{content:'…';display:block;
	position:absolute;right:0;bottom:0;width:3em;height:1.416em;overflow:hidden;text-indent:-9999px;
	background:linear-gradient(to right, rgba(255,255,255, 0) 0, #fff 100%);
}
.card1f1t2 .column .texts>.t2{display:block;margin:8px 6px;color:#888;font-size:13px;
	overflow:hidden;
}
.card1f1t2 .column .texts>.t2 .t2t1{display:inline-block;
	margin:0 0 0 -1px;
	padding:0 6px;
	background:url(../../img/lib2/sep1.png) no-repeat 0 50%;
}
.card1f1t2 .column .f1{display:block;position:relative;height:auto;
	margin:-1px -1px 0;
	padding:0 0 75%; /* =3/4 */
	background:#eee;
	text-align:center;
}
.card1f1t2 .column .f1 .f1p1{display:block;position:absolute;left:0;right:0;top:0;bottom:0;height:100%;overflow:hidden;}
.card1f1t2 .column .f1 img{display:block;position:absolute;left:0;top:0;width:100%;height:auto;min-height:100%;margin:0 auto;}

/* 카드.글2 20170605 */
.card1t2{display:block;position:relative;margin:0 auto;line-height:1.333;}
.card1t2 *{list-style:none;margin:0;padding:0;}
.card1t2 .even-grid{margin:0 -8px;}
.card1t2 .column{
	display:none; /* ☆ for show-* */
	padding:8px;
}
.card1t2 .column .a1{display:block;text-decoration:none;}
.card1t2 .column .texts{display:block;padding:15px 20px;background:#012c61;}
.card1t2 .column .texts>.t1{display:block;padding:0 0 6px 30px;color:#fff;}
.card1t2 .column .texts>.t1 .t1t1{display:block;position:relative;height:2.832em;line-height:1.416;overflow:hidden;}
.card1t2 .column .texts>.t1 .t1t1:after{content:'…';display:block;
	position:absolute;right:0;bottom:0;width:3em;height:1.416em;overflow:hidden;text-indent:-9999px;
	background:linear-gradient(to right, rgba(23,92,169, 0) 0, #012c61 100%);
}
.card1t2 .column .texts>.t2{display:block;
	color:#c4d5e9;
	font-size:13px;
	overflow:hidden;
}
.card1t2 .column .texts>.t2 .t2t1{display:block;
	height:1.333em;
	padding:1px 0 1px 10px;
	background:url(../../img/lib2/bu2.png) no-repeat 0 50%;
	text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;
}
.card1t2 .column .texts2{display:block;
	padding:8px 6px;
	border:1px solid #ddd;border-top:0;
}
.card1t2 .column .texts2>.t3{display:block;
	color:#888;font-size:13px;
	overflow:hidden;
}
.card1t2 .column .texts2>.t3 .t3t1{display:inline-block;
	margin:0 0 0 -1px;
	padding:0 6px;
	background:url(../../img/lib2/sep1.png) no-repeat 0 50%;
}



/* 카드.픽1 20170605 */
.card1f1{display:block;position:relative;margin:0 auto;line-height:1.333;}
.card1f1 *{list-style:none;margin:0;padding:0;}
.card1f1 .even-grid{margin:0 -8px;}
.card1f1 .column{
	display:none; /* ☆ for show-* */
	padding:8px;
}
.card1f1 .column .a1{display:block;border:1px solid #ddd;text-decoration:none;}
.card1f1 .column .a1:focus{outline:1px dotted #000;}
.card1f1 .column .f1{display:block;position:relative;height:auto;margin:-1px -1px 0;
	padding:0 0 75%; /* =3/4 */
	background:#eee;
	text-align:center;
}
.card1f1 .column .f1 .f1p1{display:block;position:absolute;left:0;right:0;top:0;bottom:0;height:100%;overflow:hidden;}
.card1f1 .column .f1 img{display:block;position:absolute;left:0;top:0;width:100%;height:auto;min-height:100%;margin:0 auto;}


/* 순위 */
b.num{display:block;
	z-index:10;
	position:absolute;left:8px;top:8px;
	width:45px;height:48px;line-height:46px;
	background:#aaa;
	color:#fff;font-size:18px;
	text-align:center;
	font-family:Helvetica,Arial,sans-serif;
	background:#999;
	background:url(../../img/lib2/flag1bg00@2x.png) no-repeat;
	background-size:cover;
}

b.num.n01{background-image:url(../../img/lib2/flag1bg01@2x.png);}
b.num.n02{background-image:url(../../img/lib2/flag1bg02@2x.png)}
b.num.n03{background-image:url(../../img/lib2/flag1bg03@2x.png)}



b.num2{
	display:block;
	box-sizing:border-box; /* ☆ */
	width:2.3em; /* =18/12 */
	height:2.3em;
	min-width:18px;min-height:18px;
	margin:10px auto; /* =2/.857 */
	padding:0;
	background:#999;
	color:#fff;font-weight:600;font-size:.929em; /* =12/14 */
	font-family:Helvetica,Arial,sans-serif;
	line-height:2.3;
	letter-spacing:-1px;
	text-align:center;
	vertical-align:middle;
	border-radius:100%;
}
b.num2.n01{background:#0170e0;}
b.num2.n02{background:#4094dd;}
b.num2.n03{background:#7da7d9;}


.list2table1>table .ic1.new{width:20px;height:20px;padding:0;border-radius:100%;}




/* paginate_complex 20180212 */
.paginate_complex{clear:both;width:100%;margin:.75em auto 0;text-align:center;}
.paginate_complex a{display:inline-block;
	width:34px;height:34px;
	margin:0 .0625em .375em .0625em;
	border:1px solid #d7d7d7;
	background:#fff;
	color:#777;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-decoration:none;
	line-height:34px;
}
.paginate_complex strong{display:inline-block;
	width:34px;height:34px;
	margin:0 .0625em .375em .0625em;
	border:1px solid #555;
	background:#555;
	color:#fff;
	vertical-align:middle;
	white-space:nowrap;
	overflow:hidden;
	text-decoration:none;
	line-height:34px;
}
.paginate_complex .control .m a .ic{display:block;
	font-weight:100;
	font-family: Arial, sans-serif; /* ☆ */
	font-size:30px;
	line-height:30px;
}
.paginate_complex a:not([href]){cursor:default;}
.paginate_complex a:not([href]){opacity:.7;}
.paginate_complex .m>a>a>.ic{text-indent:-999999px;}
.paginate_complex .m>a>a>.ic:before{content:'';

}

/* 서비스소개 */
.service1info1{display:block;
	position:relative;
	font-size:16px;
	padding:0 2em 2em;
	font-family:'Noto Sans';
}
.service1info1:before{content:'';
	display:block;
	position:absolute;left:0;right:0;top:0;bottom:0;
	background:url(../../img/lib2/service1bg1.png) no-repeat;
}
.service1info1 p{position:relative;margin:0;padding:0;}
.service1info1 .t1{display:block;
	background:#5d77c1;
	color:#fff;font-size:18px;
	width:80%;
	padding:1em;margin:0 auto 1em;
}
.service1info1 .t2{display:block;
	color:#fff;
	padding:1em 2em;
}
.service1info1 .t3{display:block;
	color:#fff;
	padding:1em 2em;
}
.service1info1 .t4{display:block;
	color:#fff;
	padding:0 2em;
	font-size:18px;
}
/* @media */
@media all and (min-width:768px){
	.service1info1{font-size:18px;padding:0 3em 3em 2em;}
	.service1info1:before{top:50px;background-size:cover;}
	.service1info1 .t1{margin:0;width:57%;padding:2.5em;font-size:20px;}
	.service1info1 .t4{font-size:20px;}
}





/* Add Share Contents Style ◇◆◇◆◇◆◇◆◇◆ */
/* YYYYMMDD.Writer. ◇◆ */
/* 20170111 RWD ◇◆.. 코드 )) base.css */