
/*-------------------------------------------------
Version : 1.0
Author : CHO SUN YOUNG
Create date : 2017. 06. 16.
Last update : 2018. 02. 20.
-------------------------------------------------*/

/* ========================================== 메인 비주얼 */

/* 최신뉴스 */
.visual {margin-bottom: 80px;}
.visual ul {width: 100%; height: 400px; overflow: hidden;}
.visual ul li {position: relative; float: left; overflow: hidden;}
.visual ul li a {display: inline-block; width: 320px; height: 200px; text-align: center; color: #fff;}
.visual ul li .picture {position: relative; width: 100%; height: 100%;}
.visual ul li .picture img {width: 100%; height: 100%;}
.visual ul li .picture:after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/new/images/korean/main/gradation.png) no-repeat left top; background-size: cover; content: '';}
.visual ul li .title {position: absolute; top: 110px; padding: 0 60px; height: 60px; line-height: 30px; font-size: 22px; font-size: 2.2rem; font-weight: 400; overflow: hidden;}

.visual ul li .info {position: absolute; bottom: 0; left: 0; padding: 30px; width: 100%; color: #fff;
	height: 0;
	opacity: 0;
	visibility: hidden;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
}
.visual ul li .info:before {position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); border: 3px solid #000; content: '';}

.visual ul li .line01 {display: none; position: relative; padding-bottom: 15px; height: 40px; font-size: 25px; font-size: 2.5rem; font-weight: 400; border-bottom: 1px solid rgba(255, 255, 255, 0.2); overflow: hidden;}/* 한자깨짐 제거 font-family: 'NanumSquare'; */
.visual ul li .line02 {position: relative; padding-bottom: 30px;}
.visual ul li .line02:before {position: absolute; bottom: 0; left: 0; width: 100%; height: 25px; text-align: center; font-family: xeicon; font-size: 18px; content: "\e949";}
.visual ul li .line02 span {display: inline-block; height: 50px; line-height: 25px; overflow: hidden;}
.visual ul li .line03 {font-size: 0;}
.visual ul li .line03 span {position: relative; display: inline-block; margin: 0 auto; width: 65px; height: 65px; font-size: 0; color: #fff; text-align: center; background-color: #f47629; border-radius: 50%;}
.visual ul li .line03 span:before {position: absolute; top: 0; left: 0; width: 65px; height: 65px; line-height: 65px; font-family: xeicon; font-size: 30px; content: "\e9c5";}
.visual ul li .line03 span,
.visual ul li .line03 span:before {
	opacity: 0;
	visibility: hidden;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}

.visual ul li a:hover .title {display: none;}
.visual ul li a:hover .info {
	height: 100%;
	opacity: 1;
	visibility: visible;
}

.visual ul li a:hover .line03 span,
.visual ul li a:hover .line03 span:before {
	opacity: 1;
	visibility: visible;
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
}

.visual ul li:first-child a {width: 680px; height: 400px; text-align: left;}
.visual ul li:first-child a .title {display: none;}
.visual ul li:first-child a .info,
.visual ul li:first-child a:hover .info {
	height: 100%;
	opacity: 1;
	visibility: visible;
}
.visual ul li:first-child a .info:before {
	height: 0;
	opacity: 0;
	visibility: hidden;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}
.visual ul li:first-child a:hover .info:before {
	height: 100%;
	opacity: 1;
	visibility: visible;
}

.visual ul li:first-child a .line01 {display: block; margin-top: 190px;}
.visual ul li:first-child a .line02 {position: relative; padding: 15px 0; height: 80px; line-height: 25px; overflow: hidden;}
.visual ul li:first-child a .line02:before {display: none;}
.visual ul li:first-child a .line03 span {padding-bottom: 10px; width: 120px; height: auto; font-size: 16px; font-size: 1.6rem; text-align: left; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.7); background: url(/new/images/korean/main/arrow-bg.png) no-repeat bottom right; border-radius: 0;}
.visual ul li:first-child a .line03 span:before {display: none;}
.visual ul li:first-child a .line03 span,
.visual ul li:first-child a:hover .line03 span {
	opacity: 1;
	visibility: visible;
	-webkit-transform: rotate(0);
	transform: rotate(0);
}
.visual ul li:first-child a:hover .line03 span {
	width: 100%;
}

/* ========================================== 메인 컨텐츠 영역 */

/* 메인 컨텐츠 공통 영역 */

h2 {font-family: 'NanumSquare'; color: #333;}

.btn-more-view {margin-top: 30px; text-align: center;}
.btn-more-view a {position: relative; display: inline-block; width: 150px; height: 40px; line-height: 40px; text-align: center; font-size: 15px; font-size: 1.5rem; color: #333; border: 1px solid #c8c8c8;}
.btn-more-view a:before {position: absolute; top: 0; right: 15px; font-family: xeicon; font-size: 18px; content: "\e90a";}
.btn-more-view a:hover {
	font-weight: bold;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}

.list-style01 {overflow: hidden;
    -webkit-transition: 1s ease;
    transition: 1s ease;
}
.list-style01 li {float: left; margin-right: 39px; margin-bottom: 40px; width: 307px; overflow: hidden;}
.list-style01 li:nth-child(3n) {margin-right: 0;}
.list-style01 li a {position: relative; display: block; width: 100%; line-height: 20px; overflow: hidden;}
.list-style01 li a .picture {width: 100%; height: 224px; overflow: hidden;}
.list-style01 li a .picture img {width: 100%; height: 100%;}
.list-style01 li a .line01 {position: absolute; top: 0; left: 0; padding: 35px 30px; width: 100%; text-align: center; font-size: 15px; font-size: 1.5rem; color: #fff; background-color: rgba(0, 0, 0, 0.7);
	height: 0;
	opacity: 0;
	visibility: hidden;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}
.list-style01 li a .line01 .line01-1 {padding-bottom: 20px; height: 110px; line-height: 22px; overflow: hidden;}
.list-style01 li a .line01 .line01-2 {margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.2);}

.list-style01 li a:hover .line01 {
	height: 224px;
	opacity: 1;
	visibility: visible;
}

/* 뉴스브리핑 */
.section01 {position: relative; width: 100%; height: 260px;}
.section01:before {position: absolute; top: 0; left: 50%; margin-left: -150%; width: 300%; height: 100%; background: url(/new/images/korean/main/section01-bg.png) repeat-x top center; content: ''; z-index: -1;}
.section01 h2 {height: 60px; line-height: 60px; font-size: 25px; font-size: 2.5rem; color: #fff;}
.section01 .btn-more a {color: #fff;}
.section01 ul {padding: 30px 0; overflow: hidden;}
.section01 ul li {float: left; width: 485px; height: 35px;}
.section01 ul li a {position: relative; display: block; padding-right: 110px; width: 100%; height: 35px; line-height: 35px; color: #fff; overflow: hidden;}
.section01 ul li:nth-child(2n) {float: right;}
.section01 ul li a .date {position: absolute; top: 0; right: 0; display: inline-block; max-width: 110px; color: rgba(255, 255, 255, 0.5); overflow: hidden;}

/* 이슈분석 */
.section02 {position: relative; padding: 50px 0 40px; width: 100%; overflow: hidden;}
.section02 h2 {margin-bottom: 40px; text-align: center; font-size: 32px; font-size: 3.2rem;}
.section02 .btn-more a {top: 55px;}
.section02 .list-style01 {height: 370px;}
.section02 .list-style01 li {height: 370px;}
.section02 .list-style01 li a {height: 370px;}
.section02 .list-style01 li a .line02.color01 {background-color: #6d47bc;}
.section02 .list-style01 li a .line02.color02 {background-color: #19857a;}
.section02 .list-style01 li a .line02 {position: absolute; top: 180px; left: 20px; display: inline-block; width: 70px; height: 60px; line-height: 60px; text-align: center; font-size: 14px; font-size: 1.4rem; color: #fff;}
.section02 .list-style01 li a .line03 {margin-top: 40px; height: 25px; line-height: 25px; font-size: 21px; font-size: 2.1rem; overflow: hidden;}
.section02 .list-style01 li a .line04 {margin-top: 15px; padding-top: 15px; height: 40px; color: #333; border-top: 1px solid #e6e6e6; overflow: hidden;}
.section02 .list-style01 li a .line05 {height: 20px; color: #666; overflow: hidden;}
.section02 .list-style01 li a .line06 {margin-top: 5px; height: 20px; font-size: 15px; font-size: 1.5rem; color: #bebebe; overflow: hidden;}

.section02 .list-style01 li a:hover .line02 {display: none;}
.section02 .list-style01 li a:hover .line03 span {text-decoration: underline;}

/* 이슈분석 더보기 클릭시 */
.section02.active .list-style01 {
	height: 780px;
}

.section.active .btn-more-view a:before {content: "\e909";}

/* 연구보고서 */
.section04 {position: relative; padding: 60px 0 50px; width: 100%; height: 420px;}
.section04:before {position: absolute; top: 0; left: 50%; margin-left: -150%; width: 300%; height: 100%; background-color: #ececec; content: ''; z-index: -1;}
.section04 h2 {margin-bottom: 30px; font-size: 27px; font-size: 2.7rem;}
.section04 .btn-more a {top: 70px;}

.btn-more-number {position: absolute; top: 73px; right: 20px; display: inline-block; height: 25px; color: #222; overflow: hidden;}
.btn-more-number li {float: left; margin-right: 30px;}
.btn-more-number li a {display: inline-block; width: 25px; height: 25px; text-align: center; color: #9c9b9b;}
.btn-more-number li.active a,
.btn-more-number li a:hover {color: #000; border-bottom: 3px solid #0e3563;}

.list-style02 {padding-top: 5px; width: 100%; height: 265px; overflow: hidden;}
.list-style02 li {position: relative; float: left; margin-right: 100px; margin-bottom: 50px; padding: 60px 20px 30px 20px; width: 260px !important; height: 240px; background-color: #fff; border: 1px solid #e6e8eb;}
.list-style02 li:before {position: absolute; top: 5px; left: 5px; width: 260px; height: 240px; background-color: #fff; border: 1px solid #e6e8eb; box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2); content: ''; z-index: -1;}
.list-style02 li .info {height: 120px; text-align: center; overflow: hidden;}
.list-style02 li > span {position: absolute; top: -5px; left: 20px; width: 35px; height: 47px; background: url(/new/images/korean/main/type07.png) no-repeat left top;}
.list-style02 li > a.new-window {position: absolute; top: 20px; right: 25px; width: 20px; height: 20px;}
.list-style02 li > a.new-window:before {position: absolute; top: 0; left: 0; width: 20px; height: 20px; font-family: xeicon; font-size: 22px; color: #d0d0d0; content: "\e980";}
.list-style02 li .line01 {margin-bottom: 5px; font-size: 15px; font-size: 1.5rem; color: #da292d;}
.list-style02 li .line02 {margin-bottom: 20px; line-height: 26px; max-height: 52px; font-size: 18px; font-size: 1.8rem; color: #555; overflow: hidden;}
.list-style02 li .line03 {position: relative; font-size: 15px; font-size: 1.5rem; color: #999;}
.list-style02 li .line03 span {position: relative; display: inline-block; padding-left: 20px; line-height: 1.3; letter-spacing: -0.03em;}
.list-style02 li .line03 span:before {position: absolute; left: 0; top: 0; font-family: xeicon; color: #3b58a1; content: "\e9f5";}
.list-style02 li .line04 {padding-top: 15px; height: 75px; overflow: hidden;}
.list-style02 li .line04 a {display: inline-block; margin-right: 5px; margin-bottom: 5px; padding: 0 10px; max-width: 100%; height: 25px; line-height: 23px; font-size: 13px; font-size: 1.3rem; color: #6e6e6e; white-space: nowrap; text-overflow: ellipsis; border: 1px solid #e6e8eb; border-radius: 3px; overflow: hidden;}

.list-style02 li.type01 > span {background-image: url(/new/images/korean/main/type01.png);}
.list-style02 li.type01 .line01 {color: #3b58a1;}
.list-style02 li.type02 > span {background-image: url(/new/images/korean/main/type02.png);}
.list-style02 li.type02 .line01 {color: #da292d;}
.list-style02 li.type03 > span {background-image: url(/new/images/korean/main/type03.png);}
.list-style02 li.type03 .line01 {color: #19857a;}
.list-style02 li.type04 > span {background-image: url(/new/images/korean/main/type04.png);}
.list-style02 li.type04 .line01 {color: #6d47bc;}
.list-style02 li.type05 > span {background-image: url(/new/images/korean/main/type05.png);}
.list-style02 li.type05 .line01 {color: #3399d3;}
.list-style02 li.type06 > span {background-image: url(/new/images/korean/main/type06.png);}
.list-style02 li.type06 .line01 {color: #dc6220;}

.section04 .bx-wrapper {max-width: 100% !important;}
.section04 .bx-viewport {height: 385px !important;}

/* 비즈니스정보 */
.section03 {position: relative; padding: 50px 0; width: 100%; overflow: hidden;}
.section03 h2 {margin-bottom: 45px; text-align: left; font-size: 25px; font-size: 2.5rem;}
.third {float: left; display: inline-block; width: 333px; overflow: hidden;}
.third > div {padding: 0 15px;}
.section03 .third.expert {width: 334px;}
.region .picture {position: relative; width: 100%; height: 198px; background: url(/new/images/korean/main/picture03-1.png) no-repeat left top; overflow: hidden;}
.region .picture .bounce {position: absolute; left: 134px; width: 53px; height: 62px;
	top: 26px;
	animation: bounceInUp 1s infinite;
	-webkit-animation: bounceInUp 1s infinite;
}
@-webkit-keyframes bounceInUp {
	0% {opacity: 0.9; -webkit-transform: translateY(-10px);}
	50% {opacity: 1; -webkit-transform: translateY(0);}
	100% {opacity: 0.7; -webkit-transform: translateY(-10px);}
}
@keyframes bounceInUp {
	0% {opacity: 0.9; transform: translateY(-10px);}
	50% {opacity: 1; transform: translateY(0);}
	100% {opacity: 0.7; transform: translateY(-10px);}
}

.business .list-style01,
.business .list-style01 li {height: 198px;}
.business .list-style01 li a {height: 198px;}
.business .list-style01 li a .picture {height: 198px;}
.business .list-style01 li a .line01 {background-color: rgba(0, 0, 0, 0.6);
	height: 198px;
	opacity: 1;
	visibility: visible;
}
.business .list-style01 li a .line01 .line01-1 {height: 70px; font-size: 20px; font-size: 2rem;
	margin-top: 30px;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}
.business .list-style01 li a .line01 .line01-2 {margin-top: 10px;
	opacity: 0;
	visibility: hidden;
    -webkit-transition: 0.5s ease;
    transition: 0.5s ease;
}
.business .list-style01 li a:hover .line01 .line01-1 {margin-top: 20px;}
.business .list-style01 li a:hover .line01 .line01-2 {
	opacity: 1;
	visibility: visible;
}

.expert {position: relative;}
.expert .btn-more a {top: 5px; color: #c9c9c9;}
.expert .btn-more a:before {font-size: 16px;}
.expert .btn-more .btn-L {right: 20px;}
.expert .list-style01 {width: 100%; height: 198px;}
.expert .list-style01 li {margin-right: 0; width: 100%; height: 198px;}
.expert .list-style01 li a {height: 198px;}
.expert .list-style01 li .line03 {padding: 15px; height: 105px; text-align: center; color: #fff; background-color: #f14d20;}
.expert .list-style01 li .line03-1 {position: relative; margin-bottom: 10px; padding-bottom: 10px; height: 35px; line-height: 25px; font-size: 18px; font-size: 1.8rem; font-weight: 500; overflow: hidden;}
.expert .list-style01 li .line03-1:before {position: absolute; left: 50%; bottom: 0; margin-left: -14px; width: 28px; height: 1px; background-color: rgba(255,255,255,0.8); content: '';}
.expert .list-style01 li .line04 {padding: 20px; height: 92px; line-height: 25px; color: #333; border: 1px solid #ebebeb; border-top: none;}

/* ========================================== 반응형 */

@media screen and (max-width: 999px)
{
	/* 최신뉴스 */
	.visual {position: relative; margin-bottom: 0; padding-bottom: 50px;}
	.visual ul {height: 100%;}
	.visual ul li {float: none; width: 100%; height: 100%;}
	.visual ul li:first-child a,
	.visual ul li a {display: block; width: 100%; height: 100%; text-align: left;}
	.visual ul li .picture {width: 100%; height: 100%;}
	.visual ul li .picture img {width: 100%; height: 260px;}
	.visual ul li .title {display: none;}
	.visual ul li a:hover .info,
	.visual ul li .info {padding: 20px; height: auto; opacity: 1; visibility: visible;}
	.visual ul li .info:before {display: none;}
	.visual ul li .line01 {display: block; height: auto; line-height: 1.2; border-bottom: none;}
	.visual ul li .line02 {display: none;}
	.visual ul li .line03 span,
	.visual ul li a:hover .line03 span,
	.visual ul li:first-child a .line03 span {padding-bottom: 10px; width: 120px; height: auto; font-size: 16px; font-size: 1.6rem; text-align: left; text-shadow: none; background: url(/new/images/korean/main/arrow-bg.png) no-repeat bottom right; border-radius: 0; opacity: 1; visibility: visible; -webkit-transform: rotate(0); transform: rotate(0);}

	.visual ul li .line03 span:before,
	.visual ul li a:hover .line03 span:before,
	.visual ul li:first-child a .line03 span:before {display: none;}

	.visual .bx-viewport {height: 260px !important;}
	.visual .bx-controls {position: absolute; bottom: 0; width: 100%; height: 50px; line-height: 50px; text-align: center;}
	.visual .bx-controls .bx-pager-item {display: inline-block; margin: 0 10px;}
	.visual .bx-controls .bx-pager-item .bx-pager-link {display: block; width: 15px; height: 15px; line-height: 15px; color: #d1d1d1; background-color: #d1d1d1; border-radius: 50%;}
	.visual .bx-controls .bx-pager-item .bx-pager-link.active {color: #f14d20; background-color: #f14d20;}

	/* 뉴스브리핑 */
	.section01 {padding: 0 15px 15px; height: auto; background-color: #a82712;}
	.section01:before {top: 50px; left: 0; margin-left: auto; width: 100%; height: 1px; background: rgba(255,255,255,0.4); z-index: 1;}
	.section01 h2 {height: 50px; line-height: 50px; font-size: 2rem;}
	.section01 ul {padding: 15px 0; max-height: none;}
	.section01 ul li,
	.section01 ul li:nth-child(2n) {float: none;}
	.section01 ul li {margin-top: 5px; width: 100%; height: auto;}
	.section01 ul li a {padding-right: 0; height: auto; line-height: 20px;}
	.section01 ul li a .date {position: static; top: auto; right: auto; bottom: 0; left: 0; display: block; width: 100%; text-align: left;}

	/* 이슈분석 */
	.section02 {padding: 20px 0; width: 100%; overflow: hidden;}
	.section02 h2 {margin-bottom: 0; padding: 0 15px; text-align: left; font-size: 2rem;}
	.section02 .btn-more a {top: 15px;}
	.section02 .list-style01,
	.section02.active .list-style01 {height: 345px;}
	.section02 .list-style01 li {float: none; margin: 0; width: 100%; height: auto; border-bottom: 1px solid #e6e6e6;}
	.section02 .list-style01 li a {position: relative; padding: 15px 15px 15px 150px; height: 115px;}
	.section02 .list-style01 li a .picture {position: absolute; top: 15px; left: 15px; width: 120px; height: 85px;}
	.section02 .list-style01 li a .line01,
	.section02 .list-style01 li a:hover .line01 {display: none;}
	.section02 .list-style01 li a .line03 {margin-top: 0; margin-bottom: 10px; height: auto; max-height: 40px; line-height: 20px; font-size: 1.8rem;}
	.section02 .list-style01 li a .line04 {float: left; position: relative; display: inline-block; margin-top: 0; margin-right: 10px; padding-top: 0; padding-right: 10px; height: 20px; border-top: none;}
	.section02 .list-style01 li a .line04:before {position: absolute; top: 5px; right: 0; width: 1px; height: 10px; background-color: #ddd; content: '';}
	.section02 .list-style01 li a .line06 {clear: both;}

	.section02 .btn-more-view,
	.section02.active .btn-more-view {display: none;}

	/* 연구보고서 */
	.section04 {padding: 15px 0 15px 15px; height: 225px; background-color: #ececec;}
	.section04:before {display: none;}
	.section04 h2 {margin-bottom: 15px; font-size: 2rem;}
	.section04 .btn-more a {top: 15px;}

	.btn-more-number {display: none;}
	/*
	.btn-more-number {top: 15px; right: 30px;}
	.btn-more-number li {margin-right: 10px;}
	*/

	.list-style02 {height: 140px;}
	.list-style02 li {margin-right: 30px; margin-bottom: 10px; padding: 30px 10px 15px 10px; width: 140px !important; height: 120px;}
	.list-style02 li:before {width: 140px; height: 120px;}
	.list-style02 li .info {height: 80px;}
	.list-style02 li > span {left: 10px; width: 18px; height: 24px; background-size: cover;}
	.list-style02 li > a.new-window {top: 5px; right: 5px;}

	.list-style02 li .line02 {line-height: 1.2; font-size: 1.6rem;}
	.list-style02 li .line03 {display: none;}

	.section04 .bx-viewport {height: 140px !important;}

	.section03 {padding: 15px;}
	.section03 h2 {margin-bottom: 25px; font-size: 2rem;}
	.third {float: none; display: block; width: 100%;}
	.third > div {padding: 0;}

	/* 지역별 정보 */
	.region .picture {background-position: center center;}
	.region .picture .bounce {left: 50%; margin-left: -18px;}

	/* 비즈니스정보 */
	.section03 .third.business {margin: 20px 0;}
	.business .list-style01,
	.business .list-style01 li,
	.business .list-style01 li a,
	.business .list-style01 li a .picture {width: 100%; height: auto;}
	.business .list-style01 li a .line01 {height: 100%;}
	.business .list-style01 li {float: none; margin-right: 0; margin-bottom: 0;}
	.business .list-style01 li a .line01 .line01-1 {margin-top: 0; height: auto;}
	.business .list-style01 li a .line01 .line01-2,
	.business .list-style01 li a:hover .line01 .line01-2 {
		opacity: 1;
		visibility: visible;
	}

	/* 전문가 정보 */
	.section03 .third.expert {width: 100%;}
	.expert .btn-more a:before {font-size: 2rem;}
	.expert .btn-more .btn-R {right: 0;}
}
