/*   fullpage 공통   */
#scroll-nav {position: fixed; margin: -45px 0 0 0; top: 50%; right: 40px; z-index: 80;}
#scroll-nav ul li {margin-bottom: 10px; text-align: right;}
#scroll-nav ul li a {display: inline-block; width: 100%; height: 12px;}
#scroll-nav ul li a:after {display:inline-block; content:''; width:16px; height: 16px; background: none; /*border: 1px solid #fff;*/border: 2px solid #f2bc00; cursor: pointer;}
#scroll-nav ul li span {display: inline-block; position:relative;top:-2px;margin-right: 10px; font-size: 15px; color: rgba(255 201 118 / 70%);}
#scroll-nav ul li.active span {color: #fff; font-weight: 600;/*color: rgba(255,255,255,1);*/}
/*#scroll-nav ul li a:focus span {display:inline-block;}*/
#scroll-nav ul li.active a:after, #scroll-nav ul li:hover a:after {/*background: #fff;*/background: #ffe488;}

#m-container .section {overflow:hidden; position: relative; display:block; width:100%; /*height: 100%;*/ height: auto !important; min-width: 320px; min-height: auto; transform-style: preserve-3d;}
#m-container .section.sec-tbl {display:table; width: 100%;  -webkit-box-sizing: border-box; box-sizing: border-box;}
#m-container .section .section-cell {display:table-cell;overflow: hidden; vertical-align: middle; text-align:center;}

#m-container .section .tit {/*padding-top: 20px;*/ text-align: left;}
#m-container .section .tit#m-container .section .tit h2 {color: #fff; font-size: 32px; font-weight: 350; letter-spacing: -1px;}
#m-container .section .tit h2 strong {font-size: 32px; font-weight: 500; color: #fff;}
#m-container .section .tit p {padding-top: 20px; color: #dadada; font-size: 15px;}

@media all and (min-width:961px) {
	#m-container {position: relative; width:100%; height: 100%; overflow: hidden;}
	#m-container .section-wrap {position:absolute; left:0; top:0; width: 100%;}
	.mobile_q{display:none;}
}

@media all and (max-width: 960px){
	#m-container .section.sec-tbl {display: block;}
	#m-container .section .section-cell {display: block;}
	#section02,#section03,#section04,#section05 {height: 100% !important;}
	#section03 .container {padding:0 60px;}
	#section05 .layer-slide .slide01 {background-size:cover !important;}
	#m-container .section .tit {padding-bottom:20px; text-align: center; justify-content: center; height: 70px;}
	#m-container .section .slide05 .tit {padding-top:10px;}
	#m-container .section .tit p {display:none; padding-top:10px; font-size: 12px;}
	#m-container .section .tit h2 {font-size:20px; margin: 20px 0;}
	#m-container .section .tit h2 strong {font-size:25px;}
}
 



/*   section01   */
#section01 .slick_slider {opacity:0; -webkit-transition:opacity 0.5s ease; transition:opacity 0.5s ease;}
#section01 .slick-initialized {display: block; max-width: none; position: relative; top: 0; left: 0; margin-left: 0; height: 100%; width: 100%; opacity:1;}
#section01 .btn-wrap {width:100%; margin-top:30px; z-index:100; opacity: 1; transition: -webkit-transform 1.5s; transition: transform 1.5s;}
#section01 .btn-wrap .inner {position:relative; text-align:left;}

.visual-slide .intro .txt-wrap a {display: inline-block; min-width:130px; width: 156px; height: 47px; margin:0; padding: 0 0 0 20px; text-align: left; border: 2px solid #fff; border-radius:0; color: #fff; letter-spacing:-1px; background: url(../img/more_btn_white.png) no-repeat 110px 20px;}
.visual-slide .intro .txt-wrap a:hover {color:#222; background:url(../img/more_btn_black.png) no-repeat 110px 20px, #fff;  }
.visual-slide .intro {display: table; position: absolute; top: 0; left: 50%; margin-left: -630px; right: 0; bottom: 0; width: 100%; height: 100%; padding: 30px 60px 200px 60px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.visual-slide .intro .txt-wrap {display: table-cell; padding-top:100px; text-align: left; vertical-align: middle;}
.visual-slide .intro .top {color: #fff; font-size: 24px; letter-spacing:-1px; font-weight: 300; opacity: 0; text-shadow: 2px 2px 5px rgba(0,0,0,.6);}
.visual-slide .intro .new-top {font-size: 30px; letter-spacing:7px;}
.visual-slide .intro .tit {position: relative; padding: 0; letter-spacing: -2.5px; height: 90px; display: flex; align-items: center;}
.visual-slide .slide05 .intro .tit {height: 110px; padding-top: 20px;}

.visual-slide .intro .tit strong {display: block; font-size:55px; line-height:100px; font-weight: 500; color:#fff; -webkit-transform:translateX(-50px); transform:translateX(-50px); opacity: 0; text-shadow: 2px 2px 5px rgba(0,0,0,.6);}
.visual-slide .intro .tit em {color: #fff; font-size: 55px; font-weight: 500; font-style:normal;}
.visual-slide .intro .txt01 {text-shadow: 2px 2px 5px rgba(0,0,0,.6); padding: 30px 0 15px; color: #fff; font-size: 22px; font-weight: 300; line-height: 1.8; letter-spacing:-1px; opacity: 0; -webkit-transform:translateX(50px); transform:translateX(50px);}
.visual-slide .intro .txt01 strong {color: #fff; font-size: 28px; font-weight: 700;  }
.visual-slide .intro .txt02 {text-shadow: 2px 2px 5px rgba(0,0,0,.6); max-width:800px; color: #fff; opacity: 0; text-align: left; font-size: 20px; line-height:1.3;} 
.visual-slide .intro .txt02 {font-size: 18px;}
.visual-slide .slide02 .intro .tit img {height: 50px;}
.visual-slide .slide03 .intro .tit img {height: 45px;}
.visual-slide .slide04 .intro .tit img {height: 70px;}
.visual-slide .slide05 .intro .tit img {height: 110px; display: inline-block;}
.visual-slide .slide06 .intro .tit strong {font-size:25px;}
.visual-slide.ani .slide.slick-active .intro .top {opacity: 1; transition: -webkit-transform 3s; transition: transform 3s; transition: transform 3s;}
.visual-slide.ani .slide.slick-active .intro .tit strong {-webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s;}
.visual-slide.ani .slide.slick-active .intro .tit img {-webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s;}
.visual-slide.ani .slide.slick-active .intro .txt01 {-webkit-transform:translateX(0); transform:translateX(0); opacity: 1; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s;}
.visual-slide.ani .slide.slick-active .intro .txt02 {opacity: 1; transition: -webkit-transform 3s; transition: transform 3s; transition: transform 3s;}

.sec-lt .tit {text-align:left !important;}
.sec-rt .tit {text-align:right !important;}

.visual-slide .slick-dots {position: absolute; top:100%; left: 0; margin-top:-150px; width: 100%; text-align: center; z-index: 2;  }
.visual-slide .slick-dots li {position:relative; display: inline-block; width: 10px; height: 10px; margin:0 19px; -webkit-transition: all 0.3s ease; border-radius:50%; background:#adadad;}
.visual-slide .slick-dots li:first-child {margin-left:0;}
.visual-slide .slick-dots li:last-child {margin-right:0;}
.visual-slide .slick-dots li a {position: absolute; overflow: visible; display: block; width: 110%; height: 110%;  border: none;}
.visual-slide .slick-dots li a em {position: absolute; top: 40px; left: -60px; width: 130px; height: 30px; line-height: 20px; display: block; text-align: center; color: #9a9c9c; z-index: 3;font-style: normal; opacity: 0; font-size: 15px;}
.visual-slide .slick-dots li:first-child a em {width:155px; left: -70px;}
.visual-slide .slick-dots li.slick-active a em {top: -40px; opacity: 1;}
.visual-slide .slick-dots li a:hover {opacity:1; transition:.5s;}
.visual-slide .slick-dots li.slick-active {width: 14px; height: 14px;  background:#fff; top:1px;}
.visual-slide .slick-dots li.slick-active a {opacity:1;}
.visual-slide .slick-dots li.slick-active a em {color: #fff;}
.visual-slide .slick-dots .percent_circle {position: absolute; display: block; text-align: center; width:40px; height: 40px; top: -13px; left: -13px;}
.visual-slide .slick-dots .percent_circle svg {transform: rotate(-90deg); transform-origin: center center 0px;}
.visual-slide .slick-dots li .percent_circle svg {opacity: 0; transition: all .5s;}
.visual-slide .slick-dots li.slick-active .percent_circle svg {opacity: 1;}
.visual-slide .slick-dots li.slick-active .state_bar {stroke-dasharray: 249; animation: progress 7s; -moz-animation: progress 7s; -webkit-animation: progress 7s;}
@keyframes progress {to {stroke-dashoffset: 0px;} }
@-moz-keyframes progress {to {stroke-dashoffset: 0px;}}
@-webkit-keyframes progress {to {stroke-dashoffset: 0px;}}

.visual-slide .slick-dots li.btn-play {background:none;}
.visual-slide .slick-dots li.btn-play a {opacity:1;}
.visual-slide .slick-dots li.btn-play a img.pause {display: block;}
.visual-slide .slick-dots li.btn-play a img.play {display:none;}

.visual-slide .slide {width: 100%; height: 100vh;}
.visual-slide .slide .bg {position: absolute; top: 0; left:0; right:0; bottom:0; width: 100%; height: 100vh; z-index: -1; background-position:50% 50%; background-repeat:no-repeat; background-size:cover; opacity: 0; -ms-transform: scale(1.2, 1.2); -webkit-transform: scale(1.2, 1.2); -webkit-transition:transform 7s ease-out, opacity 1s ease 0.3s; transition:transform 7s ease-out, opacity 1s ease 0.3s;
}
.visual-slide.ani .slide.slick-active .bg {opacity: 1; -ms-transform: scale(1, 1) rotate(.001deg); -webkit-transform: scale(1, 1) rotate(.001deg); transform: scale(1, 1) rotate(.001deg); -webkit-transition-delay: 0s; transition-delay: 0s;
}
.visual-slide .slide .dim {width:100%; height:100%;  background: rgba(0, 0, 0, 0.3);}

.visual-slide .slide.slide01 .bg {background: url("../img/slide01.jpg") no-repeat 50% 50%; background-size: cover;}
.visual-slide .slide.slide02 .bg {background: url("../img/slide02.jpg") no-repeat 50% 50%; background-size: cover;}
.visual-slide .slide.slide03 .bg {background: url("../img/slide03.jpg") no-repeat 50% 50%; background-size: cover;}
.visual-slide .slide.slide04 .bg {background: url("../img/slide04.jpg") no-repeat 50% 50%; background-size: cover;}
.visual-slide .slide.slide05 .bg {background: url("../img/slide05.jpg") no-repeat 50% 50%; background-size: cover;}
.visual-slide .slide.slide06 .bg {background: url("../img/slide06.jpg") no-repeat 50% 50%; background-size: cover;}
.slick-dots li a:focus, 
.slide .btn-wrap a {outline: 2px border #000 !important; outline-offset: 4px; position: absolute; top: 0;}

@media all and (max-width: 1250px) {
	.visual-slide .intro {margin-left: -500px;}
}

@media all and (max-width: 960px) {
	.visual-slide .intro {left:0; margin-left:0; padding: 55px 0 100px;}
	.visual-slide .intro .top {font-size: 15px;}
	.visual-slide .intro .tit:after {width: 150px;}
	.visual-slide .intro .tit strong {font-size: 30px; line-height:1.3;}
	.visual-slide .intro .tit strong em {font-size: 30px;}
	.visual-slide .slide02 .intro .tit img {height: 30px;}
	.visual-slide .slide03 .intro .tit img {height: 25px;}
	.visual-slide .slide04 .intro .tit img {height: 40px;}
	.visual-slide .slide05 .intro .tit img {height: 70px;}
	.visual-slide .intro .txt01 {padding-top:10px; font-size:16px;line-height:1.5;}
	.visual-slide .intro .txt01 strong {font-size:16px;}
	.visual-slide .intro .txt02 {font-size:14px; text-align: center;}
	.visual-slide .slide01 .intro .txt02 {display:none;}
	.visual-slide .intro .txt-wrap {padding-top:0; text-align: center;}
	.visual-slide .intro .txt-wrap a {position: static; padding:0 15px;min-width:110px;width:110px; height:30px; line-height:28px; background-position: 80px 13px; background-size: 20px; margin:0;}
	.visual-slide .intro .box {padding:15px; width:310px;height:138px;margin:0 auto;background:url('../img/bg_box_slide05.png') repeat; box-sizing:border-box;}
	.visual-slide.ani .slide.slick-active .intro .tit strong {font-size:20px;}
	#section01 .slide06 .btn-wrap {margin-top:15px;}
	#section01 .btn-wrap {margin-top:20px;}
	#section01 .btn-wrap .inner {width:100% !important; text-align: center;}
	#section01 .visual-slide .slide04 .intro {padding-bottom: 100px;}
	#section01 .visual-slide .slick-dots {margin-top:-100px;}
	#section01 .visual-slide .slick-dots li {margin: 0 12px;}
	.visual-slide .slide.slide01 .bg {background: url("../img/img_slide_m01.jpg") no-repeat 50% 50%; background-size: cover;}
	.visual-slide .slide.slide02 .bg {background: url("../img/img_slide_m02.jpg") no-repeat 50% 50%; background-size: cover;}
	.visual-slide .slide.slide03 .bg {background: url("../img/img_slide_m08.jpg") no-repeat 50% 50%; background-size: cover;}
	.visual-slide .slide.slide04 .bg {background: url("../img/img_slide_m03.jpg") no-repeat 50% 50%; background-size: cover;}
	.visual-slide .slide.slide05 .bg {background: url("../img/img_slide_m05.jpg") no-repeat 50% 50%; background-size: cover;}
	.visual-slide .slide.slide06 .bg {background: url("../img/img_slide_m05_250108.jpg") no-repeat 50% 50%; background-size: cover;}
}



/*   스크롤 인디케이터   */
.scroll_indicator {position: absolute;padding-top:20px; width:2px;height:80px;right:108px;bottom:0;z-index: 8;border-radius: 1px;}
.scroll_indicator::before {content:'';background: rgba(255,255,255,.15);position: relative;display: block; height:100%;}
.scroll_indicator .indi_bar {width:100%; position: absolute; left:0; top:-80px;background:#fff;}
.scroll_indicator .indi_text {position: absolute; bottom: 10px;  left: 20px; color: #fff; font: initial; letter-spacing: 8px;}
.indi_animation.scroll_indicator .indi_bar {height:30px; -webkit-animation:scroll_indi 2.5s both infinite; animation:scroll_indi 2.5s both infinite;}

@keyframes scroll_indi {0%{ top:20px; opacity: 50%;} 100%{ top:100%; opacity: 100%;}}
@-webkit-keyframes scroll_indi {0%{ top:20px; opacity: 50%;} 100%{ top:100%; opacity: 100%;}}

@media all and (max-width: 960px) {
	.scroll_indicator {display: none;}
}



/*   section02   */
/*
#m-container #section02 {background: url("../img/bg02.jpg") no-repeat 50% 50%; background-size: cover;}
*/
#section02 .container {width: 900px;}
#section02 .section-list {padding: 50px 0;}
#section02 .section-list li {position:relative; float: left; margin:0 15px; -webkit-box-sizing: border-box; box-sizing: border-box;}
#section02 .tit {/* max-width:1020px;*/ max-width:990px; width:100%;}
#section02 .sec02-slide li {max-width:260px; height:340px; background-size: cover; border-radius: 5px; overflow:hidden; position:relative;}
#section02 .sec02-slide li .bg {width: 100%; height: 100%; display:block; transition:.5s;}
#section02 .sec02-slide li.slide01 .bg {background:url(/product/kor/ui/img/indus_01.jpg) no-repeat;}
#section02 .sec02-slide li.slide02 .bg {background:url(/product/kor/ui/img/indus_02.jpg) no-repeat;}
#section02 .sec02-slide li.slide03 .bg {background:url(/product/kor/ui/img/indus_03.jpg) no-repeat;}
#section02 .sec02-slide li.slide04 .bg {background:url(/product/kor/ui/img/indus_04.jpg) no-repeat;}
#section02 .sec02-slide li.slide05 .bg {background:url(/product/kor/ui/img/indus_05.jpg) no-repeat;}
#section02 .sec02-slide li.slide06 .bg {background:url(/product/kor/ui/img/indus_06.jpg) no-repeat;}
#section02 .sec02-slide li:hover .bg {transform:scale(1.1); transition:.5s;}
#section02 .sec02-slide li a {width: 100%; height: 100%; display:block; transition:.5s; position:absolute; top: 0; left:0;}
#section02 .sec02-slide li:hover a {background:rgba(0,0,0,.3); transition:.5s;}
#section02 .sec02-slide li a p {padding-top: 130px;}
#section02 .sec02-slide li a p span {color:#fff; display:block; text-align: center; font-size: 27px; font-weight:400; text-shadow: 1px 1px rgba(0,0,0,.6);}
#section02 .sec02-slide li a p span:nth-child(2) {font-size:20px; padding-top:20px;}
#section02 .sec02-slide .slick-arrow {background:none; position:absolute;  }
#section02 .sec02-slide .slick-prev {top:50%; left:50%; margin-top: -20px; margin-left:-470px;} 
#section02 .sec02-slide .slick-next {top:50%; right:50%; margin-top: -20px; margin-right:-470px;}

@media all and (max-width: 960px){
	#section02 .container {width: 100%; padding:0 60px;}
	#section02 .section-list {padding: 50px 15% 50px;}
	#section02 .sec02-slide li {max-width: 260px; height: 340px;}
	#section02 .sec02-slide li a p span {font-size: 20px;}
	#section02 .sec02-slide li a p span:nth-child(2) {font-size:15px;}
	#section02 .sec02-slide .slick-prev {margin-left: -320px; margin-top: -20px;}
	#section02 .sec02-slide .slick-next {margin-right: -320px; margin-top: -20px;}
}

@media all and (max-width: 768px){
	#section02 .section-list {padding: 50px 5% 60px;}
	#section02 .sec02-slide .slick-next {margin-right: -340px;}
	#section02 .sec02-slide .slick-prev {margin-left: -340px;}
}

@media all and (max-width: 480px) {
	#section02 .container {padding:0 20px;}
	#section02 .section-list {width: 260px; overflow: visible; padding: 40px 10px 50px; display: block; margin: 0 auto;}
	#section02 .sec02-slide li {height: 300px;}
	#section02 .sec02-slide .slick-prev {margin-top: -20px; margin-left: -150px;}
	#section02 .sec02-slide .slick-next {margin-top: -20px; margin-right: -150px;}
	#section02 .section-list li {margin: 0 12px;}
}


/*   section03   */
#m-container #section03 {background: url("../img/bg03.jpg") no-repeat 50% 50%; background-size: cover;}
#section03 .container {width: 900px;}
#section03 .tit {max-width:990px; width:100%;}
#section03 .section-list-wrap {position: relative; overflow:hidden; height: 430px; padding-top: 50px; padding-bottom: 50px;}
#section03 .section-list {max-width: 650px; width:100%; height: 340px; display:inline-block; float:right;}
/*230622 웹접근성_ 세번째섹션 네비게이션 위치 변경
#section03 .section-list {max-width: 650px; width:100%; height: 340px; display:inline-block; float:left;}
#section03 .slider-nav {width: 160px; height:340px; position:relative; float:right; overflow:hidden;}
*/
#section03 .section-list [class^="slide"] {width: 650px; height: 340px; border: none;}
#section03 .section-list [class^="slide"] dl {position:relative; padding: 40px 20px 0 25px; text-align: left; background:#fff; float:left;}
#section03 .section-list [class^="slide"] dl dt {padding-bottom:15px; font-weight: 400; color: #222; font-size: 24px;}
#section03 .section-list [class^="slide"] dl dd.btn {position:absolute; left:25px;bottom:25px;color: #008bca;}
#section03 .section-list [class^="slide"] dl dd.btn a {color:#005890; padding-right:40px; background: url(/product/kor/ui/img/more_btn_blue.png) no-repeat right;}
#section03 .section-list [class^="slide"] .bottom{overflow: hidden; width:100%; height: 100%;background:none; /*border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;*/}
#section03 .section-list [class^="slide"] .bottom dl {width:235px;  height:100%; padding-bottom:35px; box-sizing:border-box;-webkit-box-sizing:border-box;}
#section03 .section-list [class^="slide"] .bottom dl dt + dd {word-break: keep-all; font-size: 14px;}
#section03 .section-list [class^="slide"] .bottom .pic {display: block; width:415px; height: 100%; float:left;}
#section03 .section-list [class^="slide"] .bottom .pic img {width: auto; height: 100%;}
#section03 .slider-nav {width: 160px; height:350px; position:relative; float:left; overflow:hidden;}
#section03 .slider-nav .slick-track {top:0;}
#section03 .slider-nav .slick-slide a {font-size: 20px; padding: 16px 0; display: block; color:#dbdbdb;}
#section03 .slider-nav .slick-center a {font-size: 22px; color:#fff; font-weight: bold ;}
#section03 .slider-nav button {background: none;}
#section03 .slider-nav button.slick-next {position: absolute; bottom: 0; left: 50%; margin-left: -15px;}
#section03 .slider-nav .slick-list {padding: 60px 0 !important; top: 10px;}
#section03 .slider-nav .slick-list .slick-slide {opacity:0;}
#section03 .slider-nav .slick-list .slick-slide.slick-active {opacity:1;}

@media all and (max-width: 960px) {
	#section03 .container {width: 100%;  padding:0 60px;}
	#section03 .section-list-wrap {height: 380px; padding-top: 0;}
	#section03 .section-list {width: 70%; height: 100%; padding-right: 5px;}
	#section03 .section-list [class^="slide"] {width: 100%; height: 380px;}
	#section03 .section-list [class^="slide"] .bottom {height: 100%; margin-top: -40px;}
	#section03 .section-list [class^="slide"] .bottom .pic {width: 100%; height: 50%; float:none;}
	#section03 .section-list [class^="slide"] .bottom .pic img {width: 100%; height: auto;}
	#section03 .section-list [class^="slide"] .bottom dl {max-width: 100%; width: 100%; height: 50%; padding: 20px; float:none;}
	#section03 .section-list [class^="slide"] dl dd.btn {left:20px; padding-top:10px; bottom:inherit;}
	#section03 .section-list [class^="slide"] dl dt {font-size:18px;}
	#section03 .slider-nav {width: 30%; height: 100%;}
	#section03 .slider-nav .slick-slide a {font-size: 15px;}
	#section03 .slider-nav .slick-list {padding: 40px 0 !important; top: 55px;}
	#section03 .slider-nav .slick-list .slick-slide {margin-left: 45px;}
}

@media all and (max-width: 575px) {
	#section03 .slider-nav .slick-list .slick-slide {margin-left: -15px;}
	#section03 .slider-nav .slick-list {top: 35px;}
}
@media all and (max-width: 480px) {
	#section03 .container {width: 100%; padding:0 20px;}
	#section03 .section-list [class^="slide"] .bottom .pic {height: 40%;}
	#section03 .section-list [class^="slide"] .bottom dl {height: 60%;}
	#section03 .slider-nav .slick-list {top: 25px;}
	#section03 .slider-nav .slick-list .slick-slide {margin-left: -30px;}
}



/*   section03   */
/*
#m-container #section04 {background: url("../img/bg04.jpg") no-repeat 50% 50%; background-size: cover;}
#section04 .container {width: 900px;}
#section04 .tit {max-width:990px; width:100%;}
#section04 .section-list-wrap {position: relative; overflow:hidden; height: 430px; padding-top: 50px; padding-bottom: 50px;}
#section04 .section-list {max-width: 650px; width:100%; height: 340px; display:inline-block; float:right;}

#section04 .section-list [class^="slide"] {width: 650px; height: 340px; border: none;}
#section04 .section-list [class^="slide"] dl {position:relative; padding: 40px 20px 0 25px; text-align: left; background:#fff; float:left;}
#section04 .section-list [class^="slide"] dl dt {padding-bottom:15px; font-weight: 400; color: #222; font-size: 24px;}
#section04 .section-list [class^="slide"] dl dd.btn {position:absolute; left:25px;bottom:25px;color: #008bca;}
#section04 .section-list [class^="slide"] dl dd.btn a {color:#005890; padding-right:40px; background: url(/product/kor/ui/img/more_btn_blue.png) no-repeat right;}
#section04 .section-list [class^="slide"] .bottom{overflow: hidden; width:100%; height: 100%;background:none;}
#section04 .section-list [class^="slide"] .bottom dl {width:235px;  height:100%; padding-bottom:35px; box-sizing:border-box;-webkit-box-sizing:border-box;}
#section04 .section-list [class^="slide"] .bottom dl dt + dd {word-break: keep-all; font-size: 14px;}
#section04 .section-list [class^="slide"] .bottom .pic {display: block; width:415px; height: 100%; float:left;}
#section04 .section-list [class^="slide"] .bottom .pic img {width: auto; height: 100%;}
#section04 .slider-nav {width: 160px; height:350px; position:relative; float:left; overflow:hidden;}
#section04 .slider-nav .slick-track {top:0;}
#section04 .slider-nav .slick-slide a {font-size: 20px; padding: 16px 0; display: block; color:#dbdbdb;}
#section04 .slider-nav .slick-center a {font-size: 22px; color:#fff; font-weight: bold ;}
#section04 .slider-nav button {background: none;}
#section04 .slider-nav button.slick-next {position: absolute; bottom: 0; left: 50%; margin-left: -15px;}
#section04 .slider-nav .slick-list {padding: 60px 0 !important; top: 10px;}
#section04 .slider-nav .slick-list .slick-slide {opacity:0;}
#section04 .slider-nav .slick-list .slick-slide.slick-active {opacity:1;}

@media all and (max-width: 960px) {
	#section04 .container {width: 100%;  padding:0 60px;}
	#section04 .section-list-wrap {height: 380px; padding-top: 0;}
	#section04 .section-list {width: 70%; height: 100%; padding-right: 5px;}
	#section04 .section-list [class^="slide"] {width: 100%; height: 380px;}
	#section04 .section-list [class^="slide"] .bottom {height: 100%; margin-top: -40px;}
	#section04 .section-list [class^="slide"] .bottom .pic {width: 100%; height: 50%; float:none;}
	#section04 .section-list [class^="slide"] .bottom .pic img {width: 100%; height: auto;}
	#section04 .section-list [class^="slide"] .bottom dl {max-width: 100%; width: 100%; height: 50%; padding: 20px; float:none;}
	#section04 .section-list [class^="slide"] dl dd.btn {left:20px; padding-top:10px; bottom:inherit;}
	#section04 .section-list [class^="slide"] dl dt {font-size:18px;}
	#section04 .slider-nav {width: 30%; height: 100%;}
	#section04 .slider-nav .slick-slide a {font-size: 15px;}
	#section04 .slider-nav .slick-list {padding: 40px 0 !important; top: 55px;}
	#section04 .slider-nav .slick-list .slick-slide {margin-left: 45px;}
}

@media all and (max-width: 575px) {
	#section04 .slider-nav .slick-list .slick-slide {margin-left: -15px;}
	#section04 .slider-nav .slick-list {top: 35px;}
}
@media all and (max-width: 480px) {
	#section04 .container {width: 100%; padding:0 20px;}
	#section04 .section-list [class^="slide"] .bottom .pic {height: 40%;}
	#section04 .section-list [class^="slide"] .bottom dl {height: 60%;}
	#section04 .slider-nav .slick-list {top: 25px;}
	#section04 .slider-nav .slick-list .slick-slide {margin-left: -30px;}
}
*/

/*   section04   */

#m-container #section04 {background: url("../img/bg04.jpg") no-repeat 50% 50%; background-size: cover;}
#m-container #section04 .tit h2 {font-weight: 500;}

#section04 .container {position:relative; max-width:900px;}
#section04 .tit {position:relative; display:inline-block; float: right; height: 460px; margin-top: 20px;}
#section04 .main-news {position:relative; width: 620px; display:inline-block; float:left;}
#section04 .news-card-wrap{text-align:left;}
#section04 .news-card-list > li {width: calc(50% - 20px); height: 220px;}
#section04 .news-card-list > li:nth-child(2n) {margin-left: 20px;}
#section04 .news-card-list > li:nth-child(3) {margin-left:0;}
#section04 .news-card-wrap .tit, #section04 .news-card-wrap .solid {display:none;}
#section04 .btn { display:block;color:#fff; font-size: 16px; position: absolute; right:0; bottom: 40px;}
#section04 .btn:after {display: inline-block; margin-left: 8px; width: 31px; height: 10px;}
#section04 .btn:hover {text-decoration:underline;}
#section04 .newsroom-btn {position:absolute; bottom:0;}
#section04 .container_bg {width: 100%; height: 700px; position:absolute; top:50%; margin-top: -320px; background:rgba(0,0,0, .5);}

#section04  .drop-share .drop-list {top: 80%; height: 210px;}

@media all and (min-width: 961px){
	#section04 .item-category-info{height:50px;}
}

@media all and (max-width: 960px){
	#section04 .container {margin:0; padding: 0 60px;}
	#section04 .tit {float:none; width: 100%; height: 120px;  }
	#section04 .btn {position:relative; padding: 10px 0; bottom:0; font-size: 14px;}
	#section04 .btn:nth-child(2) {padding-top: 30px;}
	#section04 .main-news {float:none; width: 100%;}
	.news-card-list > li:nth-child(odd) {margin-right: 20px;}
}

@media all and (max-width: 480px){
	#section04 .container {padding: 0 20px;}
	#section04 .news-card-list > li {width: calc(50% - 10px);}
	#section04 .news-card-list > li:nth-child(odd) {margin-right:10px;}
	#section04 .news-card-list li:nth-child(2n) {margin-left: 10px;}
	#section04 .news-card-list .item-thumb img {width: auto; height: 100%;}

}



/*   section05   */
/*
#m-container #section05 {background: url("../img/bg05.jpg") no-repeat 50% 50%; background-size: cover;}
#m-container #section05 .tit h2 {font-weight: 500;}

#section05 .container {position:relative; max-width:900px;}
#section05 .tit {position:relative; display:inline-block; float: right; height: 460px; margin-top: 20px;}
#section05 .main-news {position:relative; width: 620px; display:inline-block; float:left;}
#section05 .news-card-wrap{text-align:left;}
#section05 .news-card-list > li {width: calc(50% - 20px); height: 220px;}
#section05 .news-card-list > li:nth-child(2n) {margin-left: 20px;}
#section05 .news-card-list > li:nth-child(3) {margin-left:0;}
#section05 .news-card-wrap .tit, #section04 .news-card-wrap .solid {display:none;}
#section05 .btn { display:block;color:#fff; font-size: 16px; position: absolute; right:0; bottom: 40px;}
#section05 .btn:after {display: inline-block; margin-left: 8px; width: 31px; height: 10px;}
#section05 .btn:hover {text-decoration:underline;}
#section05 .newsroom-btn {position:absolute; bottom:0;}
#section05 .container_bg {width: 100%; height: 700px; position:absolute; top:50%; margin-top: -320px; background:rgba(0,0,0, .5);}

#section05  .drop-share .drop-list {top: 80%; height: 210px;}

@media all and (min-width: 961px){
	#section05 .item-category-info{height:50px;}
}

@media all and (max-width: 960px){
	#section05 .container {margin:150px 0; padding: 0 60px;}
	#section05 .tit {float:none; width: 100%; height: 120px;  }
	#section05 .btn {position:relative; padding: 10px 0; bottom:0; font-size: 14px;}
	#section05 .btn:nth-child(2) {padding-top: 30px;}
	#section05 .main-news {float:none; width: 100%;}
	.news-card-list > li:nth-child(odd) {margin-right: 20px;}
}

@media all and (max-width: 480px){
	#section05 .container {padding: 0 20px;}
	#section05 .news-card-list > li {width: calc(50% - 10px);}
	#section05 .news-card-list > li:nth-child(odd) {margin-right:10px;}
	#section05 .news-card-list li:nth-child(2n) {margin-left: 10px;}
	#section05 .news-card-list .item-thumb img {width: auto; height: 100%;}

}

*/