@charset "utf-8";

#visual{position:relative;}
#visual .visu_s .slick-slide{height:670px; position:relative;}
#visual .visu_s .slick-arrow{cursor:pointer; display:inline-block; position:absolute; top:50%; z-index:5; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#visual .visu_s .slick-arrow em{display:block; line-height:14px; color:#87939b; font-size:14px; font-family:'FrutigerLTStd', sans-serif; font-weight:700; font-style:normal; position:relative; }
#visual .visu_s .slick-arrow:before{content:''; width:100px; height:10px; background:#fff; opacity:0.5; position:absolute; top:50%; margin-top:-6px;}
#visual .visu_s .slick-prev{left:0; padding-left:110px;}
#visual .visu_s .slick-prev:before{left:0;}
#visual .visu_s .slick-next{right:0; padding-right:110px;}
#visual .visu_s .slick-next:before{right:0;}
#visual .visu_s .slick-dots{position:absolute; bottom:60px; left:0; width:100%; text-align:center; font-size:0;}
#visual .visu_s .slick-dots li{display:inline-block; margin:0 5px;}
#visual .visu_s .slick-dots li button{padding:0; width:10px; height:10px; text-indent:-99999px; background:#fff;}
#visual .visu_s .slick-dots li.slick-active button{background-color:#007da9}
#visual .slogan{position:absolute; top:35%; left:0; width:100%; text-align:center; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#visual .slogan div{box-sizing:border-box; letter-spacing:-0.5px; color:#fff;}
#visual .slogan div strong{display:block; font-size:40px; line-height:50px; font-weight:500; word-break:keep-all;}
#visual .slogan div span{display:block; font-size:20px; line-height:30px; font-weight:300; word-break:keep-all; padding-top:20px;}

#m_contents .layout{max-width:1200px; margin:0 auto; box-sizing:border-box;}
#m_contents .title{text-align:center; letter-spacing:-0.5px; padding-bottom:50px;}
#m_contents .title strong{display:block; color:#007da9; font-size:44px; font-family:'FrutigerLTStd', sans-serif; font-weight:900;}
#m_contents .title span{display:block; color:#666; font-size:15px; padding-top:10px;}

#m_contents > .section_1{padding:80px 0;}
#m_contents > .section_1 .business{font-size:0; text-align:center;}
#m_contents > .section_1 .business li{display:inline-block; width:20%; vertical-align:top;}
#m_contents > .section_1 .business li p{width:140px; margin:0 auto; position:relative; padding-top:140px;}
#m_contents > .section_1 .business li p:before{content:''; width:120px; height:120px; border-radius:100%; background-size:62px !important; position:absolute; top:0; left:50%; transform:translateX(-50%); -ms-transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%);}
#m_contents > .section_1 .business li p span{display:block; font-size:18px; line-height:18px; color:#444; letter-spacing:-0.5px;}
#m_contents > .section_1 .business li:nth-of-type(1) p:before{background:url('../images/main/busIcon_1.png') no-repeat 50% 50% #ededed}
#m_contents > .section_1 .business li:nth-of-type(2) p:before{background:url('../images/main/busIcon_2.png') no-repeat 50% 50% #ededed}
#m_contents > .section_1 .business li:nth-of-type(3) p:before{background:url('../images/main/busIcon_3.png') no-repeat 50% 50% #ededed}
#m_contents > .section_1 .business li:nth-of-type(4) p:before{background:url('../images/main/busIcon_4.png') no-repeat 50% 50% #ededed}
#m_contents > .section_1 .business li:nth-of-type(5) p:before{background:url('../images/main/busIcon_5.png') no-repeat 50% 50% #ededed}

#m_contents > .section_2{padding:90px 0 0; position:relative;}
#m_contents > .section_2:before{content:''; width:100%; height:400px; background:url('../images/main/section_2_bg.jpg') no-repeat 50% 50%; background-size:cover; position:absolute; top:0; left:0; z-index:-1}
#m_contents > .section_2 .title{padding-bottom:90px;}
#m_contents > .section_2 .title span{color:#fff; font-size:30px; font-weight:300; word-break:keep-all; padding:0 !important;}

#m_contents > .section_2 .solutions_new:after{content:''; display:block; clear:both;}
#m_contents > .section_2 .solutions_new dl{position:absolute; top:0; left:0; width:100%; height:100%; box-sizing:border-box; padding:60px 20px 60px 40px; word-break:keep-all; color:#fff; letter-spacing:-0.5px; -webkit-transition:all 0.5s; -moz-transition:all 0.5s; transition:all 0.5s;}
#m_contents > .section_2 .solutions_new dl dt{font-size:24px; font-weight:500; padding-bottom:15px;}
#m_contents > .section_2 .solutions_new dl dd{font-size:16px; line-height:26px; font-weight:300;}
#m_contents > .section_2 .solutions_new img{width:100%}
#m_contents > .section_2 .solutions_new .box_1{float:left; width:66.666%}
#m_contents > .section_2 .solutions_new .box_1 .box_1_1{position:relative; background:url('../images/main/sbg_1.jpg') no-repeat 50% 50%; background-size:cover; -webkit-transition:transform 0.5s; -moz-transition:transform 0.5s; transition:transform 0.5s;}
#m_contents > .section_2 .solutions_new .box_1 .box_1_2:after{content:''; display:block; clear:both;}
#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div{float:left; width:50%; position:relative; -webkit-transition:transform 0.5s; -moz-transition:transform 0.5s; transition:transform 0.5s;}
#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div:nth-of-type(1){background:url('../images/main/sbg_2.jpg') no-repeat 50% 50%; background-size:cover;}
#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div:nth-of-type(2){background:url('../images/main/sbg_3.jpg') no-repeat 50% 50%; background-size:cover;}
#m_contents > .section_2 .solutions_new .box_2{float:left; width:33.333%; position:relative; background:url('../images/main/sbg_4.jpg') no-repeat 50% 50%; background-size:cover; -webkit-transition:transform 0.5s; -moz-transition:transform 0.5s; transition:transform 0.5s;}

#m_contents > .section_3{padding:80px 0;}
#m_contents > .section_3 .product{text-align:center;}
#m_contents > .section_3 .product p{padding-bottom:30px;}
#m_contents > .section_3 .product p img{max-width:100%;}
#m_contents > .section_3 .product ul{display:none;}
#m_contents > .section_3 .product a{display:inline-block; position:relative; z-index:1; overflow:hidden; padding:0 30px; background:#007da9; box-sizing:border-box;}
#m_contents > .section_3 .product a span{display:inline-block; line-height:70px; color:#fff; font-family:'FrutigerLTStd', sans-serif; font-weight:700; font-size:24px; padding-right:95px; background:url('../images/icon/icon_arr.png') no-repeat 99% 50%; background-size:8px 14px; transition:0.5s ease-in-out; -webkit-transition:0.5s ease-in-out; -moz-transition:0.5s ease-in-out;}
#m_contents > .section_3 .product a span:before{box-sizing:border-box; transition:0.5s ease-in-out; z-index:-1; content:''; position:absolute; top:0; right:-50px; bottom:0; left:0; border-right:35px solid transparent; border-bottom:70px solid rgba(255,255,255,0.1); transform:translateX(-100%); -ms-transform:translateX(-100%); -webkit-transform:translateX(-100%); -moz-transform:translateX(-100%);}

#m_contents > .section_4{padding:70px 0; background:#f3f3f3}
#m_contents > .section_4 .title{padding-bottom:40px;}
#m_contents > .section_4 .title span{font-size:22px;}
#m_contents > .section_4 .prd_list{padding:0 50px; box-sizing:border-box;}
#m_contents > .section_4 .prd_list .prd_s .slick-slide a{display:block; width:95%; margin:0 auto 10px; outline:none; background:#fff; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; transition:all 0.3s;}
#m_contents > .section_4 .prd_list .prd_s .slick-slide a span{width:100%}
#m_contents > .section_4 .prd_list .prd_s .slick-slide a span img{width:100%}
#m_contents > .section_4 .prd_list .prd_s .slick-slide a p{padding:25px 10px; width:calc(100% - 40px); margin:0 auto; border-top:1px solid #ddd; text-align:center; box-sizing:border-box;}
#m_contents > .section_4 .prd_list .prd_s .slick-slide a p strong{display:block; color:#222; font-size:18px; line-height:30px; font-family:'FrutigerLTStd', sans-serif; font-weight:400; max-width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
#m_contents > .section_4 .prd_list .prd_s .slick-slide a p span{display:inline-block; vertical-align:middle; font-size:14px; line-height:24px; font-weight:300; /*height:48px;white-space:normal; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:keep-all;*/}
#m_contents > .section_4 .prd_list .slick-arrow{padding:0; margin-top:-10px; position:absolute; top:50%; width:50px; height:50px; text-indent:-99999px; z-index:10; background-size:10px 14px !important; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#m_contents > .section_4 .prd_list .slick-prev{left:-20px; background:url('../images/main/prdBtn_prev.png') no-repeat 50% 50% #777}
#m_contents > .section_4 .prd_list .slick-next{right:-20px; background:url('../images/main/prdBtn_next.png') no-repeat 50% 50% #777}

#m_contents > .section_5{padding:80px 0}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a{display:block; width:92%; margin:0 auto; position:relative; cursor:default;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .thumb{display:block;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .thumb img{width:100%}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt{border:1px solid #ddd; box-sizing:border-box; padding:35px 30px; letter-spacing:-0.5px;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt dl{padding-bottom:60px;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt dl dt{display:inline-block; vertical-align:middle; color:#333; font-size:18px; line-height:22px; font-weight:700; max-width:100%; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; margin-bottom:15px;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt dl dd{color:#666; font-size:16px; line-height:26px; height:78px; white-space:normal; word-wrap: break-word; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt em{display:block; font-style:normal; color:#999; font-size:14px; font-family:'FrutigerLTStd', sans-serif; font-weight:700;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .more{opacity:0; z-index:-1; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); transition:0.5s ease-in-out; -webkit-transition:0.5s ease-in-out; -moz-transition:0.5s ease-in-out;}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .more span{cursor:pointer; display:inline-block; position:absolute; top:50%; left:50%; z-index:1; overflow:hidden; padding:0 30px; background:#007da9; border:2px solid #007da9; box-sizing:border-box; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%)}
#m_contents > .section_5 .notice_list .notice_s .slick-slide a .more span em{font-style:normal; display:inline-block; line-height:51px; color:#fff; font-family:'FrutigerLTStd', sans-serif; font-weight:700; font-size:20px; padding-right:80px; background:url('../images/icon/icon_arr.png') no-repeat 99% 50%; background-size:8px 14px;}
#m_contents > .section_5 .notice_list .slick-dots{text-align:center; font-size:0; padding-top:60px;}
#m_contents > .section_5 .notice_list .slick-dots li{display:inline-block; margin:0 5px;}
#m_contents > .section_5 .notice_list .slick-dots li button{padding:0; width:10px; height:10px; text-indent:-99999px; background:#999;}
#m_contents > .section_5 .notice_list .slick-dots li.slick-active button{background-color:#007da9}

/* PC */
@media all and (min-width:1025px){
	#m_contents > .section_3 .product a:hover span:before{transform:translateX(0); -ms-transform:translateX(0); -webkit-transform:translateX(0); -moz-transform:translateX(0);}

	#m_contents > .section_4 .prd_list .prd_s .slick-slide a:hover{box-shadow:4px 4px 5px rgba(58,58,58,0.35)}

	#m_contents > .section_5 .notice_list .notice_s .slick-slide a:hover .more{opacity:1; z-index:1}

	#m_contents > .section_2 .solutions_new .box_1 .box_1_1:hover{z-index:5; transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05); -moz-transform:scale(1.05,1.05)}
	#m_contents > .section_2 .solutions_new .box_1 .box_1_1:hover dl{background:rgba(0,125,169,0.5)}
	#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div:hover{z-index:5; transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05); -moz-transform:scale(1.05,1.05)}
	#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div:hover dl{background:rgba(0,125,169,0.5)}
	#m_contents > .section_2 .solutions_new .box_2:hover{z-index:5; transform:scale(1.05,1.05); -ms-transform:scale(1.05,1.05); -webkit-transform:scale(1.05,1.05); -moz-transform:scale(1.05,1.05)}
	#m_contents > .section_2 .solutions_new .box_2:hover dl{background:rgba(0,125,169,0.5)}
}

@media all and (max-width:1230px){
	#m_contents .layout{padding:0 15px;}
}

/* 태블릿&모바일 공통*/
@media all and (max-width:1024px){
	#visual .visu_s .slick-slide{height:355px}
	#visual .slogan div{padding:0 30px;}
	#visual .slogan div strong{font-size:22px; line-height:28px;}
	#visual .slogan div span{font-size:13px; line-height:18px; padding-top:10px;}

	#m_contents .title{padding-bottom:30px;}
	#m_contents .title strong{font-size:27px;}
	#m_contents .title span{font-size:13px; padding-top:10px;}

	#m_contents > .section_1{padding:50px 0 35px;}
	#m_contents > .section_1 .layout{padding:0;}
	#m_contents > .section_1 .title{padding-bottom:15px;}
	#m_contents > .section_1 .business li{width:100px; margin:15px 5px}
	#m_contents > .section_1 .business li:nth-of-type(2){width:95px}
	#m_contents > .section_1 .business li:nth-of-type(4){width:95px}
	#m_contents > .section_1 .business li:nth-of-type(5){width:95px}
	#m_contents > .section_1 .business li p{width:100%; padding-top:95px;}
	#m_contents > .section_1 .business li p:before{width:80px; height:80px; background-size:38px !important;}
	#m_contents > .section_1 .business li p span{font-size:14px; line-height:14px;}

	#m_contents > .section_2{padding:50px 0 0;}
	#m_contents > .section_2:before{height:245px;}
	#m_contents > .section_2 .title{padding-bottom:50px}
	#m_contents > .section_2 .title span{font-size:22px;}
	#m_contents > .section_2 .solutions_new dl{position:static; padding:25px 20px; min-height:195px}
	#m_contents > .section_2 .solutions_new dl dt{font-size:17px; line-height:22px; padding-bottom:10px;}
	#m_contents > .section_2 .solutions_new dl dd{font-size:13px; line-height:18px;}
	#m_contents > .section_2 .solutions_new img{display:none;}
	#m_contents > .section_2 .solutions_new .box_1{width:100%;}
	#m_contents > .section_2 .solutions_new .box_1 .box_1_1{background-image:url('../images/main/sbg_1_m.jpg');}
	#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div{width:100%}
	#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div:nth-of-type(1){background-image:url('../images/main/sbg_2_m.jpg')}
	#m_contents > .section_2 .solutions_new .box_1 .box_1_2 div:nth-of-type(2){background-image:url('../images/main/sbg_3_m.jpg')}
	#m_contents > .section_2 .solutions_new .box_2{width:100%; background-image:url('../images/main/sbg_4_m.jpg')}

	#m_contents > .section_3{padding:50px 0;}
	#m_contents > .section_3 .product p{padding-bottom:20px;}
	#m_contents > .section_3 .product ul{display:block; margin-bottom:17px; text-align:left;}
	#m_contents > .section_3 .product ul li{margin-top:15px;}
	#m_contents > .section_3 .product ul li:first-child{margin-top:0;}
	#m_contents > .section_3 .product ul li a{display:block; border:1px solid #007da9; line-height:48px; box-sizing:border-box; padding-left:60px; color:#007da9; font-size:18px; font-family:'FrutigerLTStd', sans-serif; font-weight:700; letter-spacing:-1px; background-size:31px !important;}
	#m_contents > .section_3 .product ul li:nth-of-type(1) a{background:url('../images/main/prdIcon_1.png') no-repeat 15px 50%}
	#m_contents > .section_3 .product ul li:nth-of-type(2) a{background:url('../images/main/prdIcon_2.png') no-repeat 15px 50%}
	#m_contents > .section_3 .product ul li:nth-of-type(3) a{background:url('../images/main/prdIcon_3.png') no-repeat 15px 50%}
	#m_contents > .section_3 .product ul li:nth-of-type(4) a{background:url('../images/main/prdIcon_4.png') no-repeat 15px 50%}
	#m_contents > .section_3 .product ul li:nth-of-type(5) a{background:url('../images/main/prdIcon_5.png') no-repeat 15px 50%}
	#m_contents > .section_3 .product ul li:nth-of-type(6) a{background:url('../images/main/prdIcon_6.png') no-repeat 15px 50%}
	#m_contents > .section_3 .product a{display:block; padding:0 15px; text-align:left;}
	#m_contents > .section_3 .product a span{display:block; line-height:40px; font-size:15px; padding:0; background-size:6px 10px;}
	#m_contents > .section_3 .product a span:before{display:none;}

	#m_contents > .section_4{padding:50px 0;}
	#m_contents > .section_4 .title{padding-bottom:30px;}
	#m_contents > .section_4 .title span{font-size:16px;}
	#m_contents > .section_4 .prd_list{padding:0 25px;}
	#m_contents > .section_4 .prd_list .prd_s .slick-slide a{margin:0 auto;}
	#m_contents > .section_4 .prd_list .prd_s .slick-slide a p{padding:12px 0; width:calc(100% - 20px);}
	#m_contents > .section_4 .prd_list .prd_s .slick-slide a p strong{font-size:14px; line-height:20px;}
	#m_contents > .section_4 .prd_list .prd_s .slick-slide a p span{font-size:12px; line-height:16px; /*height:32px;*/}
	#m_contents > .section_4 .prd_list .slick-arrow{margin-top:0; width:40px; height:40px; background-size:8px 11px !important;}
	#m_contents > .section_4 .prd_list .slick-prev{left:-10px}
	#m_contents > .section_4 .prd_list .slick-next{right:-10px;}

	#m_contents > .section_5{padding:50px 0}
	#m_contents > .section_5 .notice_list .notice_s{padding:0 26px}
	#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt{padding:20px;}
	#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt dl{padding-bottom:30px;}
	#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt dl dt{font-size:14px; line-height:18px; margin-bottom:10px;}
	#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt dl dd{font-size:13px; line-height:18px; height:54px;}
	#m_contents > .section_5 .notice_list .notice_s .slick-slide a .txt em{font-size:12px;;}
	#m_contents > .section_5 .notice_list .notice_s .slick-slide a .more{display:none;}
	#m_contents > .section_5 .notice_list .slick-dots{padding-top:30px;}
}

/* 모바일 */
@media all and (max-width:768px){
	#m_contents > .section_2 .solutions .box_1 > div > dl{width:100%}

	#m_contents > .section_4 .prd_list{padding:0 15px;}
	#m_contents > .section_4 .prd_list .prd_s .slick-slide a{width:54%}
	#m_contents > .section_4 .prd_list .slick-prev{left:0}
	#m_contents > .section_4 .prd_list .slick-next{right:0;}

	#m_contents > .section_5 .notice_list .notice_s .slick-slide a{width:100%}
}