#mask {
	background: rgb(0, 0, 0); left: 0px; top: 0px; width: 100%; height: 100%; display: none; position: fixed; z-index: 1000; opacity: 0.8;
}
#videolayer {
	left: 50%; width: 60%; margin-left: -30%; display: none; position: fixed; z-index: 1010;
}
#mainSlide {
	padding: 0px 500px 0px 200px; position: relative;
}
#mainSlide .visual_wrap {
	height: 1040px; overflow: hidden; position: relative;
}
#mainSlide .visual_wrap .thumbBox {
	position: absolute;bottom:-7px;
}
#mainSlide .visual_wrap .thumbBox ul {
	display:flex;
}
#mainSlide .visual_wrap .thumbBox ul li{
	width:33.333%;
}
#mainSlide .visual_wrap .thumbBox ul li img{
	width:100%;
}
#mainSlide ul.imgRolling {
	position: relative;
}
#mainSlide ul.imgRolling li {
	float: left; position: relative;
}
#mainSlide ul.imgRolling li .text .darkTxt {
	color:#000 !important;
}
#mainSlide ul.imgRolling li img {
	display: block;
}
#mainSlide ul.imgRolling li .text {
	left: 120px; top: 100px; position: absolute;
}
#mainSlide ul.imgRolling li .text h2 {
	color: rgb(255, 255, 255); line-height: 1.1; padding-bottom: 20px; font-family: "Source Sans Pro", "Nanum Gothic",sans-serif; font-size: 56px; font-weight: 300; margin-bottom:-2.016%; position: relative;
}
#mainSlide ul.imgRolling li .text h2 span {
	font-weight: 700;
}
/*#mainSlide ul.imgRolling li .text h2::after {*/
/*	background: rgb(255, 255, 255); left: 5px; width: 100px; height: 3px; bottom: 0px; position: absolute; content: "";*/
/*}*/
#mainSlide ul.imgRolling li .text h2.black {
	color: rgb(0, 0, 0);
}
#mainSlide ul.imgRolling li .text h2.black::after {
	background: rgb(0, 0, 0);
}
#mainSlide ul.imgRolling li .text h3 {
	color: rgb(244, 189, 0); font-size: 24px;margin-left:2.05%;
}
#mainSlide ul.imgRolling li .text h3.black {
	color: rgb(0, 0, 0) !important;
}
#mainSlide ul.imgRolling li .text a.btn {
	padding: 10px 50px; border: 2px solid rgb(255, 255, 255); transition:0.4s; color: rgb(255, 255, 255); font-size: 16px; margin-top: 50px; display: inline-block;
}
#mainSlide ul.imgRolling li .text a.btn:hover {
	background: rgb(244, 189, 0); border-color: rgb(244, 189, 0); color: rgb(255, 255, 255);
}
#mainSlide .visual_wrap ol.indicator {
	left: 0px; width: 100%; text-align: center; bottom: 50px; position: absolute;
}
#mainSlide .visual_wrap ol.indicator li {
	background: rgb(255, 255, 255); margin: 0px 3px; width: 40px; height: 4px; display: inline-block; cursor: pointer;
}
#mainSlide .visual_wrap ol.indicator li.active {
	background: rgb(244, 189, 0);
}
#mainSlide .visual_wrap a.control {
	top: 50%; margin-top: -23px; position: absolute; z-index: 50;
}
#mainSlide .visual_wrap a.control img {
	display: block;
}
#mainSlide .visual_wrap a.prev {
	left: 50px;
}
#mainSlide .visual_wrap a.next {
	right: 50px;
}
#aside {
	background: rgb(33, 187, 177); top: 0px; width: 500px; height: 100%; right: 0px; position: absolute;
}
#aside div h2 {
	left: 30px; top: 30px; color: rgb(238, 238, 238); font-size: 15px; position: absolute; z-index: 30;
}
#aside div h2.black {
	color: rgb(51, 51, 51);
}
#aside .imgSlide {
	background: rgb(51, 51, 51); height: 300px; overflow: hidden; position: relative;
}
#aside .imgSlide ul.imgList {
	width: 1000%; position: relative;
}
#aside .imgSlide ul.imgList li {
	width: 500px; height: 300px; position: absolute; z-index: 5;
}
#aside .imgSlide ul.imgList li.active {
	position: relative; z-index: 20;
}
#aside .imgSlide ul.imgList li img {
	width: 100%; display: block;
}
#aside .imgSlide ul.imgList li p.caption {
	padding: 15px 0px; left: 30px; top: 150px; color: rgb(244, 189, 0); line-height: 1.2; font-size: 22px; font-weight: 600; position: absolute; z-index: 30;
}
#aside .imgSlide ul.imgList li p.desc {
	left: 30px; top: 210px; width: 80%; color: rgb(255, 255, 255); line-height: 1.5; position: absolute; z-index: 30; opacity: 0.8;
}
#aside .imgSlide ul.imgList li p.caption::after {
	background: rgb(244, 189, 0); left: 0px; width: 30px; height: 2px; bottom: 0px; position: absolute; content: "";
}
#aside .imgSlide ol.pagination {
	left: 30px; bottom: 30px; position: absolute; z-index: 30;
}
#aside .imgSlide ol.pagination li {
	background: rgb(221, 221, 221); border-radius: 50%; width: 10px; height: 10px; margin-right: 5px; display: inline-block; cursor: pointer;
}
#aside .imgSlide ol.pagination li.on {
	background: rgb(244, 189, 0);
}
#aside .srepuSlide {
	height: 300px; overflow: hidden; position: relative;
}
#aside .srepuSlide ul.imgList {
	width: 1000%; height: 100%; overflow: hidden; position: relative;
}
#aside .srepuSlide ul.imgList li {
	height: 100%; float: left; position: relative;
}
#aside .srepuSlide ul.imgList li img {
	width: 100%; height: 100%; display: block;
}
#aside .srepuSlide ul.imgList li .caption {
	left: 30px; top: 30px; position: absolute;
}
#aside .srepuSlide ul.imgList li .caption h3 {
	color: rgb(244, 189, 0); line-height: 1; font-size: 22px;
}
#aside .srepuSlide ul.imgList li .caption h3::after {
	background: rgb(244, 189, 0); margin: 20px 0px; width: 30px; height: 2px; display: block; content: "";
}
#aside .srepuSlide ul.imgList li .caption p {
	color: rgb(255, 255, 255); opacity: 0.8;
}
#aside .srepuSlide ul.imgList li .caption span.more {
	background: rgba(255, 255, 255, 0.15); padding: 8px 20px; border: 1px solid rgb(204, 204, 204); transition:0.3s; color: rgb(255, 255, 255); font-weight: 600; margin-top: 40px; display: inline-block;
}
#aside .srepuSlide ul.imgList li .caption span.more:hover {
	background: rgb(244, 189, 0); border-color: rgb(244, 189, 0);
}
#aside .srepuSlide ol.pagination {
	left: 30px; bottom: 30px; position: absolute; z-index: 30;
}
#aside .srepuSlide ol.pagination li {
	background: rgb(221, 221, 221); border-radius: 50%; width: 10px; height: 10px; margin-right: 5px; display: inline-block; cursor: pointer;
}
#aside .srepuSlide ol.pagination li.on {
	background: rgb(244, 189, 0);
}
#aside .video_box {
	width: 250px; float: left; position: relative; cursor: pointer;
}
#aside .video_box img {
	display: block;
}
#aside .video_box .play {
	left: 0px; top: 100px; width: 100%; text-align: center; color: rgb(238, 238, 238); display: block; position: absolute;
}
#aside .video_box .play img {
	margin: 0px auto 10px;
}
#aside .solution_box {
	background: url("/img_2017/main_side_178_01.png") no-repeat right 20px bottom 0% rgb(255, 181, 8); width: 250px; height: 300px; float: left; position: relative;
}
#aside .solution_box a {
	width: 100%; height: 100%; display: block;
}
#aside .solution_box .desc {
	padding: 80px 30px 0px;
}

#aside .solution_box02 {
	background: url("/img_2017/main_side_178_02.png") no-repeat right 20px bottom 0% rgb(235, 235, 235); width: 250px; height: 300px; float: left; position: relative;
}
#aside .solution_box02 a {
	width: 100%; height: 100%; display: block;
}
#aside .solution_box02 .desc {
	padding: 80px 30px 0px;
}

#aside .banner_area {
	background: rgb(255, 255, 255); height: 140px; clear: both;
}
#aside .banner_area ul {
	height: 100%; overflow: hidden;
}
#aside .banner_area ul li {
	width: 20%; height: 100%; text-align: center; float: left; position: relative;
}
#aside .banner_area ul li::before {
	background: rgb(238, 238, 238); left: 0px; top: 50%; width: 1px; height: 80px; margin-top: -40px; position: absolute; content: "";
}
#aside .banner_area ul li:first-child::before {
	display: none;
}
#aside .banner_area ul li a img {
	margin: 0px auto 15px; padding-top: 25px; display: block;
}
#aside .banner_area ul li a {
	height: 100%; display: block;
}
#aside .banner_area ul li a img {
	margin: 0px auto 15px; width: 48px; display: block;
}
@media screen and (max-width:1400px)
{
#mainSlide {
	padding-right: 0px;
}
#aside {
	display: none;
}
}
@media screen and (max-width:1024px)
{
body.main #container {
	margin: 0px;
}
#mainSlide {
	padding: 0px;
}
#mainSlide .visual_wrap {
	height: 650px;
}
#mainSlide ul.imgRolling li {
	height: 650px;
}
#mainSlide ul.imgRolling li img {
	width: 100%; height: 100%;
}
#mainSlide ul.imgRolling li .text h2 {
	font-size: 32px;
}
#mainSlide ul.imgRolling li .text h2::after {
	width: 32px; height: 2px;
}
#mainSlide ul.imgRolling li .text h3 {
	font-size: 18px;
}
#mainSlide ul.imgRolling li .text a.btn {
	margin-top: 40px;
}
#aside {
	width: 100%; clear: both; float: none; display: block !important; position: static !important;
}
#aside .imgSlide {
	width: 50%; overflow: hidden; float: left;
}
#aside .imgSlide ul.imgList li {
	width: 540px;
}
#aside .latest_box {
	margin-left: 50%;
}
#aside .video_box {
	width: 50%; height: 300px; float: left;
}
#aside .video_box > img {
	width: 100%; height: 100%;
}
#aside .solution_box {
	width: 50%;
}
}
@media screen and (max-width:640px)
{
#videolayer {
	margin-left: -150px !important;
}
#videolayer iframe {
	width: 300px !important; height: 300px !important;
}
#mainSlide .visual_wrap {
	height: auto;
}
#mainSlide ul.imgRolling li {
	height: 350px;
}
#mainSlide ul.imgRolling li img {
	display: block;
}
#mainSlide ul.imgRolling li .text {
	left: 13%; top: 60px;
}
#mainSlide ul.imgRolling li .text h2 {
	font-size: 28px;
}
#mainSlide ul.imgRolling li .text h2::after {
	width: 30px; height: 2px;
}
#mainSlide ul.imgRolling li .text h3 {
	font-size: 12px;
}
#mainSlide ul.imgRolling li .text a.btn {
	display: none;
}
#mainSlide .visual_wrap a.control {
	width: 15px; margin-top: -14px;
}
#mainSlide .visual_wrap a.control img {
	width: 100%;
}
#mainSlide .visual_wrap a.prev {
	left: 20px;
}
#mainSlide .visual_wrap a.next {
	right: 20px;
}
#aside .imgSlide {
	width: 100% !important; float: none;
}
#aside .imgSlide ul.imgList li {
	width: 640px;
}
#aside .latest_box {
	margin: 0px;
}
#aside .video_box {
	width: 100%; float: none;
}
#aside .solution_box {
	width: 100%; float: none;
}
#aside .banner_area {
	height: 120px;
}
#aside .banner_area ul li a {
	font-size: 12px !important;
}
#aside .banner_area ul li a img {
	width: 32px;
}
}
@media screen and (max-width:480px)
{
#mainSlide ul.imgRolling li .text h2 {
	font-size: 26px !important;
}
#aside .banner_area {
	height: 100px;
}
#aside .banner_area ul li::before {
	height: 50px !important; margin-top: -25px;
}
#aside .banner_area ul li a img {
	padding-top: 15px !important;
}
}