/* 상단비주얼 */
.subTop {position:relative; width:100%; height:940px; overflow:hidden;}
.subTop .sTit {position:absolute; top:42%; height:47px; width:100%; text-align:center; color:#fff; text-shadow:0 5px 10px rgba(0,0,0,.3); z-index:3;}
.subTop .sTit .big {font-size:70px; font-weight:600;}
.subTop .sTit .small {font-size:18px; font-weight:200;}

.imgPro {background:url(/image/sub01.jpg) no-repeat center center; background-size:100%; opacity:1; transition-duration:3s; -webkit-transition-duration:3s;}
.imgSer {width:100%; height:940px; background:url(/image/sub02.jpg) no-repeat center top; background-size:110%; opacity:1; transition-duration:3s; -webkit-transition-duration:3s;}
.imgSu {background:url(/image/sub03.jpg) no-repeat center top; background-size:100% auto; opacity:1; transition-duration:3s; -webkit-transition-duration:3s;}
.imgCo {background:url(/image/sub04.jpg) no-repeat center top; background-size:auto 110%; opacity:1; transition-duration:3s; -webkit-transition-duration:3s;}
.imgTru {background:url(/image/sub04_1.jpg) no-repeat center top; background-size:110%; opacity:1; transition-duration:3s; -webkit-transition-duration:3s;}
.imgPer {background:url(/image/sub05.jpg) no-repeat center top; background-size:110%; opacity:1; transition-duration:3s; -webkit-transition-duration:3s;}

.imgSer1 {position:relative; width:100%; height:940px; background:url(/image/sub02_1.jpg) no-repeat left -170px; background-size:1903px auto; opacity:1; transition-duration:3s; -webkit-transition-duration:3s;}
.imgSer1 .usb {position:relative; width:163px; height:119px; margin:203px 0 0 726px;  background:url(/image/usb.png) no-repeat; background-size:100%;}
.imgSer1 .light {position:absolute; top:22px; left:75px; width:24px; height:39px; background:url(/image/light.gif) no-repeat; background-size:100%;}

.suTop {width:100%; height:450px;}
.suTop .sTit {position:absolute; top:210px; height:47px; width:100%; text-align:center; color:#fff; text-shadow:0 5px 10px rgba(0,0,0,.3); }
.suTop .sTit .big {font-size:53px; font-weight:600; font-family:"Metropolis-Bold";}
.suTop .sTit .small {font-size:15px; font-weight:200;}


@media all and (max-width:1600px) {
	.subTop {height:840px; background-color:rgba(0,0,0,.1);}
	.subTop .sTit .big {font-size:65px;}
	.subTop .sTit .small {font-size:15px;}

	.suTop {height:400px;}
	.suTop .sTit {top:210px;}
	.suTop .sTit .big {font-size:48px;}
	.suTop .sTit .small {font-size:14px;}

	.imgPro {height:840px;}
	.imgSer {height:840px; background-size:auto 100%;}
	.imgSu {background-size:110% auto;}
	.imgCo {background-size:auto 115%;}
	.imgTru {height:840px; background-size:auto 105%;}
	 
	.imgPer {background-size:auto 115%;}


	.imgSer1 {height:840px; background-size:1600px auto;}
	.imgSer1 .usb {width:150px; height:110px; margin:203px 0 0 611px;}
	.imgSer1 .light {top:20px; left:69px; width:23px; height:37px;}
}

@media all and (max-width:1400px) {
	.subTop {height:800px;}
	.subTop .sTit .big {font-size:60px;}
	.subTop .sTit .small {font-size:14px;}

	.suTop {height:350px;} 
	.suTop .sTit {top:180px;}
	.suTop .sTit .big {font-size:45px;}
	.suTop .sTit .small {font-size:13px;}

	.imgPro {background:url(/image/sub01.jpg) no-repeat center top; background-size:100% auto;}
	.imgSu {background-size:auto 105%;} 
	.imgCo {background-size:auto 105%;}
	.imgPer {background-size:auto 105%;} 

	.imgSer1 {height:800px; background:url(/image/sub02_1.jpg) no-repeat left -80px; background-size:1400px auto;}
	.imgSer1 .usb {width:140px; height:102px; margin:203px 0 0 534px;}
	.imgSer1 .light {top:18px; left:64px; width:22px; height:35px;}
}


@media all and (max-width:1200px) {
	.subTop {height:600px;}
	.subTop .sTit .big {font-size:45px;}
	.subTop .sTit .small {font-size:13px;}

	.suTop {height:300px;} 
	.suTop .sTit {top:140px;}
	.suTop .sTit .big {font-size:40px;}
	.suTop .sTit .small {font-size:13px;}
	
	.imgPro {background:url(/image/sub01.jpg) no-repeat center center; background-size:105% auto;}
	.imgSu {background-size:auto 105%;} 
	.imgSer {background-size:auto 105%;}
	.imgSer1 {height:600px; background:url(/image/sub02_1.jpg) no-repeat left -80px; background-size:1200px auto;}
	.imgSer1 .usb {width:120px; height:87px; margin:165px 0 0 458px;}
	.imgSer1 .light {top:15px; left:54px; width:20px; height:31px;}
}


@media all and (max-width:1050px) {
	.imgPer {background-size:auto 100%;}
}

@media all and (max-width:860px) {
	.subTop .sTit .big {font-size:40px;}
	.subTop .sTit .small {font-size:13px;}

	.imgPro {background-size:130% auto;}
	.imgSu {background-size:auto 100%;} 
	.imgCo {background-size:auto 100%;}
	.imgPer {background-size:auto 100%;}
	.imgSer1 {height:600px; background:url(/image/sub02_1.jpg) no-repeat -300px -80px; background-size:1200px auto;}
	.imgSer1 .usb {width:120px; height:87px; margin:165px 0 0 158px;}
	.imgSer1 .light {top:15px; left:54px; width:20px; height:31px;}
}

@media all and (max-width:690px) {
	.imgPro {background-size:auto 100%;}

	.imgSer1 {background:url(/image/sub02_1m.jpg) no-repeat left -120px; background-size:690px auto;}
	.imgSer1 .usb {width:150px; height:110px; margin:185px 0 0 254px;}
	.imgSer1 .light {top:20px; left:69px; width:23px; height:37px;}
}

@media all and (max-width:460px) {
	.subTop .sTit .big {font-size:33px;}
	.subTop .sTit .small {font-size:13px;}

	.suTop .sTit .big {font-size:33px;}

	.imgSer1 {background:url(/image/sub02_1m.jpg) no-repeat left -50px; background-size:460px auto;}
	.imgSer1 .usb {width:120px; height:87px; margin:175px 0 0 169px;}
	.imgSer1 .light {top:15px; left:54px; width:20px; height:31px;}
}



/* 서브네브 */
.subNav {position:relative; width:100%; height:110px; background:#fff; border-bottom:1px solid #e8e8e8; }
.subNav .aLeft {position:absolute; right:0;  display:none; z-index:2;}
.subNav .logo {position:absolute; left:3%; top:0; width:109px; height:31px; background:url(/image/logo_b.png) no-repeat; background-size:100%; opacity:0;}
.subNav .inner {position:relative; width:1300px; margin:0 auto; text-align:center;}
.subNav .inner.w1500 {width:1500px;}
.subNav .inner.w1500 ul li {padding:0 2%;}
.subNav .inner ul li {position:relative; display:inline; height:110px; line-height:110px; padding:0 4%; text-align:center; font-size:20px; }
.subNav .inner ul li a {display:block;}
.subNav .inner ul li a.on {line-height:80px; border-bottom:2px solid #d22027;}
.subNav .inner .tt {position:relative; transition: 0.5s ease; -moz-transition: 0.5s ease; -webkit-transition: 0.5s ease;  -o-transition: 0.5s ease; display:inline-block;}
.subNav .inner .tt:before {content:""; position:absolute; width:0px; left:50%; bottom:0; height:3px; border-radius:3.5px; background:#d22027; transition:0.3s; -webkit-transition:0.3s;}
.subNav .inner .tt.on:before, .subNav .inner .tt:hover:before {width:100%; left:50%; margin-left:-50%; height:3px; background:#d22027;}

.subNav.fixed {position:fixed; top:0; left:0; height:70px; background:#fff; box-shadow:0 15px 20px rgba(0,0,0,.09); z-index:100; }
.subNav.fixed .inner {position:relative; width:1200px;}
.subNav.fixed .inner ul li {height:70px; line-height:70px; font-size:17px;}
.subNav.fixed .logo {top:18px; opacity:1;}

.subNav .inner .w05 {width:20%;}
.subNav .inner .w055 {width:20%;}
.subNav .inner .w04 {width:25%;}
.subNav .inner .w03 {width:33.3%;}
.subNav .inner .w02 {width:50%;}

.subNav .innerM {display:none;}

@media all and (max-width:1500px) {
	.subNav .inner.w1500 {width:95%;}
	.subNav.fixed .inner {width:1000px;}
	.subNav.fixed .inner ul li {font-size:15px;}
}


@media all and (max-width:1300px) {
	.subNav {height:90px;}
	.subNav .inner {width:95%;}
	.subNav .inner ul li {height:90px; line-height:90px; font-size:17px;}

	.subNav.fixed .inner {width:95%;}
	.subNav.fixed .inner ul li {padding:0 2%;}
	.subNav.fixed .logo {width:30px; height:31px; background-size:auto 100%;}
}

/* @media all and (max-width:1100px) {
	.subNav.fixed .inner ul li {padding:0 1%;}
} */


/* @media all and (max-width:960px) {
	.subNav {height:80px;}
	.subNav .inner ul li {height:80px; padding:0 2%; line-height:80px; font-size:15px; }
	.subNav .inner ul li a {display:inline-block;}
	
	.subNav.fixed .inner {width:90%; text-align:center; }
	.subNav.fixed .inner ul li {height:70px; line-height:70px; font-size:15px;}
	.subNav.fixed .inner .w055 {width:auto; padding:0 15px;}

} */

/* @media all and (max-width:960px) {	
	.subNav {height:70px;}
	.subNav .inner {width:100%; margin:0 auto;}
	.subNav .inner ul li {height:70px; line-height:70px; font-size:15px; }
	.subNav .inner .w055 {width:auto; padding:0 15px;}
	.subNav .inner .w02 {width:auto; padding:0 25px;}
	
	.subNav.fixed .inner ul li {padding:0 1%;}
	.subNav.fixed .inner .w055 {padding:0 7px;}
} */

@media all and (max-width:1100px) {
	.subNav .inner ul li {width:auto; padding:0 8px; font-size:13px;}

	.subNav.fixed .logo {display:none;}
	.subNav.fixed .inner .w055 {padding:0 5px;}
	.subNav.fixed .inner ul li {font-size:13px;}
}


@media all and (max-width:880px) {
	.subNav {width:100%; height:60px;}
	.subNav .aLeft {display:block; top:0; width:40px; height:69px; background:url(/image/s_arrow_r1.png) no-repeat right center;}
	.subNav .inner {display:none;} 

	.subNav .innerM {display:block; width:100%; height:100%; line-height:60px;}
	.subNav .innerM .home {float:left; width:15%; height:100%; background:url(/image/trustkey.png) no-repeat center center; background-size:30px; border-right:1px solid #e8e8e8;}
	.subNav .innerM .section {position:relative; float:left;  height:100%; background:url(/image/arrow_b.png) no-repeat 90% center; border-right:1px solid #e8e8e8; padding:0 0 0 5%; font-size:14px; font-weight:600; letter-spacing:0;}
	.subNav .innerM .left {width:34%;}
	.subNav .innerM .right {width:50%; border-right:0;}
	.subNav .innerM .line2 {line-height:1; padding:16px 0 0 5%;}

	.section div.sMenu {
		position:absolute; top:59px; left:-1px; 
		width:101%; height:auto; 
		background:#fff; padding:15px 30px; 
		color:#000;
		font-weight:400;
		line-height:2; 
		border-left:1px solid #ddd; border-right:1px solid #ddd; border-bottom:1px solid #ddd; 
		display:none;
		z-index:5;
	}
	.section div.sMenu a {display:block;}
	.subNav.fixed {height:60px;}
}

@media all and (max-width:460px) {
	.subNav .innerM .section {font-size:12px;}
	.subNav .innerM .line2 {line-height:1; padding:16px 0 0 3%;}
}



/* product */
.width1300 {width:1300px; margin:100px auto; word-break:break-all; overflow:hidden;}

.left30 {float:left; width:30%;}
.right70 {float:right; width:70%;}
.textBig {font-size:40px; font-weight:400; letter-spacing:-1px; line-height:1.2;}
.textCont {font-size:17px; font-weight:300;  line-height:1.7;}
.fido {position:relative; padding:0 20px 0 0; display:inline-block;}
.tm {position:absolute; top:0; width:20px; font-size:12px; display:inline-block;}

.width100 {position:relative; width:100%; height:482px; clear:both;}
.leftPic {position:absolute; left:0; width:1600px; height:482px; margin:0 0 100px 0; background:url(/image/pro01.jpg) no-repeat center top; background-size:100%;}

.textBigCenter {padding:150px 0 0 0; font-size:40px; font-weight:400; letter-spacing:-1px; text-align:center;}
.inLine {display:block;}
.inLine1 {display:block;}


@media all and (max-width:1600px) {
	.leftPic {width:100%; height:482px; background-size:auto 100%;}
}


@media all and (max-width:1300px) {
	.width1300 {width:95%;}
	.textBig {font-size:35px;}
	.textCont {font-size:15px;}

	.width100 {height:450px;}
	.leftPic {height:450px;}

	.textBigCenter {font-size:35px;}
}

@media all and (max-width:960px) {
	.width1300 {margin:80px auto;}
	.textBig {font-size:33px;}

	.width100 {height:350px;}
	.leftPic {height:350px;}

	.textBigCenter {padding:100px 0 0 0; font-size:33px;}
}

@media all and (max-width:768px) {
	.textBig {font-size:28px;}
	.textCont {font-size:14px;}

	.width100 {height:300px;}
	.leftPic {height:300px;}

	.textBigCenter {font-size:28px;}
	.inLine1 {display:inline-block;}
}

@media all and (max-width:640px) {
	.width1300 {margin:70px auto 50px auto;}
	.textBig {font-size:25px;}
	.textCont {font-size:13px;}

	.width100 {height:250px;}
	.leftPic {height:250px;}

	.textBigCenter {padding:70px 0 0 0; font-size:25px;}
}

@media all and (max-width:480px) {
	.width1300 {margin:60px auto 40px auto;}
	.left30 {float:none; width:100%; padding:0 3%;}
	.right70 {float:none; width:100%; padding:15px 3% 0 3%;}
	
	.width100 {height:200px;}
	.leftPic {height:200px;}
	.inLine {display:inline-block;}

}



.iconWrap {overflow:hidden; margin:80px auto 150px auto !important;}
.iconWrap ul {float:left; width:33.3%; height:500px; padding:40px 3% 0 3%; border-right:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;}
.iconWrap ul:nth-child(3n+3) {border-right:0;}
.iconWrap ul:nth-child(4) {border-bottom:0;}
.iconWrap ul:nth-child(5) {border-bottom:0;}
.iconWrap ul:nth-child(6) {border-bottom:0;}

.iconWrap ul li {width:100%;  overflow:hidden;}
.iconWrap ul li .name {float:left; font-size:20px; font-weight:500; line-height:1.1; display:inline-block;}
.iconWrap ul li .cir {float:left; margin:0 17px 0 0; width:43px; height:43px; border-radius:50px; background:#000; color:#fff; font-size:16px; font-weight:600; text-align:center; line-height:43px; display:inline-block;}
.iconWrap ul li.cont {height:140px; padding:20px 0 0 5px; font-size:14px; font-weight:300; line-height:1.5;}
.iconWrap ul li.icon {height:260px;}

.picon01 {background:url(/image/picon01.png) no-repeat center center; }
.picon02 {background:url(/image/picon02.png) no-repeat center center;}
.picon03 {background:url(/image/picon03.png) no-repeat center center;}
.picon04 {background:url(/image/picon04.png) no-repeat center center;}
.picon05 {background:url(/image/picon05.png) no-repeat center center;}
.picon06 {background:url(/image/picon06.png) no-repeat center center;}


@media all and (max-width:1150px) {
	.iconWrap {margin:60px auto 120px auto !important;}
	.iconWrap ul {height:460px;}
	.iconWrap ul li .name {font-size:17px;}
	.iconWrap ul li .cir {margin:0 12px 0 0; width:38px; height:38px; font-size:14px; line-height:38px;}
	.iconWrap ul li.cont {height:160px; font-size:13px;}
	.iconWrap ul li.icon {height:200px; background-size:auto 100%;}
}


@media all and (max-width:1000px) {
	.iconWrap ul {padding:30px 2% 0 2%;}
}

@media all and (max-width:860px) {
	.iconWrap ul {height:420px;}
	.iconWrap ul li .name {font-size:15px;}
	.iconWrap ul li .cir {margin:0 10px 0 0; width:34px; height:34px; font-size:13px; line-height:34px;}
	.iconWrap ul li.cont {height:170px; font-size:12px;}
	.iconWrap ul li.icon {height:170px;}
}

@media all and (max-width:754px) {
	.iconWrap ul {width:50%; padding:20px 3% 0 3%;}
	.iconWrap ul:nth-child(2) {border-right:0;}
	.iconWrap ul:nth-child(3n+3) {border-right:1px solid #e5e5e5;}
	.iconWrap ul:nth-child(4) { border-bottom:1px solid #e5e5e5; border-right:0;}
	.iconWrap ul:nth-child(6) { border-right:0;}

	.iconWrap ul li.cont {height:145px;}
	
}


@media all and (max-width:620px) {
	.iconWrap {width:80%; margin:40px auto 100px auto !important;}
	.iconWrap ul {width:100%; height:260px; padding:30px 3% 0 3%; border-right:0;}
	.iconWrap ul li .name {font-size:16px;}
	.iconWrap ul li.cont {float:right; width:55%; padding:30px 0 0 0;}
	.iconWrap ul li.icon {float:left; width:45%; background-size:auto 90%;}

	.iconWrap ul:nth-child(5) { border-bottom:1px solid #e5e5e5;}
	.iconWrap ul:nth-child(3n+3) {border-right:0px solid #e5e5e5;}
}

@media all and (max-width:520px) {
	.iconWrap {width:90%;}
	.iconWrap ul {height:250px;}
	.iconWrap ul li.cont {height:100%;}
	.iconWrap ul li.icon {background-size:auto 80%;}
}

@media all and (max-width:480px) {
	.iconWrap {width:95%; margin:20px auto 100px auto !important;}
	.iconWrap ul li.cont {padding:20px 0 0 0;}
}

/* 제품소개 */
.proWrap {position:relative; width:100%; height:575px;}
.proWrap .inner {position:absolute; right:0; width:1600px; height:575px; overflow:hidden;}
.proWrap .menu {float:left; width:17%; height:575px; background:#fff; border-left:3px solid #e6e6e6; }
.proWrap .menu li {position:relative; height:74px; line-height:74px; padding:0 0 0 34%; font-size:25px; font-weight:300; color:#b8b8b8; transition: 0.5s ease; -moz-transition: 0.5s ease; -webkit-transition: 0.5s ease;  -o-transition: 0.5s ease;}
.proWrap .menu li a {display:block;}
.proWrap .menu li.on {font-size:30px; color:#000; font-weight:600; font-family:"Metropolis-Bold"; }
.proWrap .menu li:hover {font-size:30px; color:#000; font-weight:600; font-family:"Metropolis-Bold";}
.proWrap .menu li:before {content:""; position:absolute; width:0px; left:-3px; top:0; bottom:100%;  width:3px; border-radius:3.5px; background:#d22027; transition:0.3s; -webkit-transition:0.3s;}
.proWrap .menu li.on:before, .proWrap .menu li:hover:before {width:100%; bottom:0; width:3px; background:#d22027;}


@media all and (max-width:1600px) {
	.proWrap .inner {width:100%;}
}

@media all and (max-width:1000px) {
	.proWrap {height:575px;}
	.proWrap .inner {height:500px}
	.proWrap .menu li {padding:0 0 0 25%;  font-size:20px;}
	.proWrap .menu li.on {font-size:25px;}
}


@media all and (max-width:860px) {
	.proWrap {height:400px;}
	.proWrap .inner {height:400px;}
	.proWrap .menu {width:20%;}
	.proWrap .menu li {height:65px; line-height:65px;}
}

@media all and (max-width:690px) {
	.proWrap {height:700px;}
	.proWrap .inner {height:700px;}
	.proWrap .menu {width:25%; height:700px;}
}

@media all and (max-width:520px) {
	.proWrap {height:650px;}
	.proWrap .inner {height:650px;}
	.proWrap .menu {width:25%; height:650px;}
	.proWrap .menu li {font-size:16px;}
	.proWrap .menu li.on {font-size:18px;}
}

@media all and (max-width:460px) {
	.proWrap {height:560px;}
	.proWrap .inner {height:560px;}
	.proWrap .menu { height:560px;}
}



.proWrap .cont {float:left; width:83%; height:575px; background:#f7f7f7; }
.proWrap .contWrap {position:relative; width:980px; overflow:hidden;}
.proWrap .cont .pic {float:left; width:550px; margin:90px 0 0 0; text-align:center;}
.proWrap .cont .pic img {width:auto; height:auto;}
.proWrap .cont .con {float:left; width:430px;}
.proWrap .cont .name {padding:120px 0 0 0; font-size:40px; letter-spacing:-1.2px;}
.proWrap .cont .name strong {font-weight:600; font-family:"Metropolis-Bold"; letter-spacing:-1.5px;}
.proWrap .cont .textT {padding:30px 0 20px 0; font-size:17px; font-weight:300; line-height:1.5;}
.proWrap .cont .textB {background:#fff; padding:20px 30px; font-weight:400; font-size:16px; }
.proWrap .cont .btn {margin:10px 0 0 0; background:#464646; padding:7px 25px 5px 25px; color:#fff; font-weight:500; font-size:14px; display:inline-block; cursor:pointer; }
.mask {height:575px; overflow:hidden;}
#section_1, #section_2, #section_3, #section_4, #section_5, #section_6 {top:0; margin:0; height:575px; clear:both; }


@media all and (max-width:1200px) {
	.proWrap .cont {height:550px;}
	.proWrap .contWrap {width:95%;}
	.proWrap .cont .pic {width:50%;}
	.proWrap .cont .pic img {width:77%; height:auto;}
	.proWrap .cont .con {width:50%; padding:0 0 0 0;}
	.proWrap .cont .name {padding:100px 0 0 0; font-size:35px;}
	.proWrap .cont .textT {padding:20px 0; font-size:15px;}
	.proWrap .cont .textB {font-size:14px;}

	#section_1, #section_2, #section_3, #section_4, #section_5, #section_6 {height:550px; }
}

@media all and (max-width:1000px) {
	.proWrap .cont {height:500px;}
	.proWrap .cont .textT {font-size:14px;}
	.proWrap .cont .textB {font-size:13px;}

	#section_1, #section_2, #section_3, #section_4, #section_5, #section_6 {height:500px; }
}

@media all and (max-width:860px) {
	.proWrap .cont {width:80%; height:400px;}
	.proWrap .cont .name {padding:60px 0 0 0; font-size:30px;}
	.proWrap .cont .textT {font-size:13px;}
	.proWrap .cont .textB {padding:15px 20px; font-size:13px;}
	.proWrap .cont .btn {padding:7px 15px 5px 15px; font-size:12px;}

	#section_1, #section_2, #section_3, #section_4, #section_5, #section_6 {height:400px; }
}


@media all and (max-width:690px) {
	.proWrap .cont {width:75%; height:700px;}
	.proWrap .contWrap {width:100%;}
	.proWrap .cont .pic {float:none; width:70%; margin:0 auto 0; padding:65px 0 0 0;}
	.proWrap .cont .con {float:none; width:80%; margin:0 auto; }
	.proWrap .cont .name {padding:30px 0 0 0;}
	
	#section_1, #section_2, #section_3, #section_4, #section_5, #section_6 {height:700px; }
}

@media all and (max-width:520px) {
	.proWrap .cont {height:650px;}
	.proWrap .cont .pic {width:80%;}
	.proWrap .cont .name {text-align:center;}
	#section_1, #section_2, #section_3, #section_4, #section_5, #section_6 {height:650px; }
}

@media all and (max-width:460px) {
	.proWrap .cont {height:560px;}
	.proWrap .cont .pic {padding:45px 0 0 0;}
	.proWrap .cont .name {font-size:25px;}
	.proWrap .cont .textT {padding:15px 0; font-size:12px;} 
	.proWrap .cont .textB {padding:7px 12px 3px 12px; font-size:11px;}
	#section_1, #section_2, #section_3, #section_4, #section_5, #section_6 {height:560px; }
}


/* 제품라인업 */
.lineOver {position:relative; width:1300px; margin:30px auto 150px auto; overflow-x:auto;}
.lineOver .hand {position:absolute; top:0; left:0; width:100%; height:100%; background:url(/image/scroll_hand.png) center 20% no-repeat rgba(0,0,0,.6); z-index:1; display:none;}
.lineWrap {width:1300px; margin:0 auto; text-align:center; border-top:3px solid #000; z-index:-1;}
.lineWrap .lTop {border-bottom:1px solid #000; height:152px; z-index:-1;}
.lineWrap .lTop .th {position:relative;  float:left; width:11.11%; height:152px; padding:23px 0 0 0; font-size:16px; font-weight:600; border-left:1px solid #e5e5e5; } 
.lineWrap .lTop .th img {cursor:pointer;}
.lineWrap .lTop .th .zoom {position:absolute; top:100%; left:50%; margin-left:-225px; display:none;}
.lineWrap .lTop .th:hover .zoom {display:block; box-shadow:10px 15px 20px rgba(0,0,0,.05); z-index:3;}
.lineWrap .lTop .thN {float:left; width:11.11%; height:152px; font-size:16px; font-weight:600; line-height:152px; }
.lineWrap .lTop .th span {font-size:11px; color:#f34e4e; font-weight:500; display:block;}
.lineWrap .lBottom {border-bottom:1px solid #000; }
.lineWrap .lBottom .thN {background:#fbfbfb; width:11.11%; font-size:16px; font-weight:600; border-left:0;}
.lineWrap .lBottom ul {border-bottom:1px solid #e5e5e5; overflow:hidden;}
.lineWrap .lBottom li {float:left; width:11.11%; padding:20px 0; border-left:1px solid #e5e5e5; font-size:15px;}
.lineWrap .lBottom li.h02 {height:85px;}
.caption {padding-top:5px; font-size:12px; text-align:right;}

.borL0 {border-left:0;}
.borR0 {border-right:0;}
.borB0 {border-bottom:0;}
.borT0 {border-top:0;}


@media all and (max-width:1300px) {
	.lineOver {width:100%;}
	.lineWrap {width:95%;}
	.lineWrap .lBottom .thN {font-size:14px;}
	.lineWrap .lBottom li {font-size:14px;}
}

@media all and (max-width:1000px) {
	.lineOver {width:95%; height:auto; margin:30px auto 50px auto;}
	.lineOver .hand {display:block; }
	.lineOver:hover {position:inherit;}
	.lineOver:hover .hand {background:none;}
	.lineWrap {width:1200px; margin:0 0 0 0;}
}

@media all and (max-width:640px) {
	.lineOver .hand {background-size:180px auto;}
}



/* 사용가능 서비스 */
.left25 {float:left; width:25%;}
.right75 {float:right; width:75%;}

.boxWrap {overflow:hidden;}
.boxWrap .box {float:left; width:24.3%; height:77px; margin:0 0.93% 0.93% 0; text-align:center; border:1px solid #e8e8e8; overflow:hidden;}
.boxWrap:not(.boxWrap-part) .box:hover img {margin:-77px 0 0 0;}
.boxWrap .box:nth-child(4n+4) {margin:0 0 0.93% 0;}

@media all and (max-width:1200px) {
	.left25 {width:22%;}
	.right75 {width:78%;}
	
	.boxWrap .box {height:65px;}
	.boxWrap .box img {width:auto; height:130px;}
	.boxWrap-part .box img {width: auto; height: 65px;}
	.boxWrap:not(.boxWrap-part) .box:hover img {margin:-65px 0 0 0;}
}


@media all and (max-width:960px) {
	.boxWrap .box {height:50px; }
	.boxWrap .box img {width:auto; height:100px;}
	.boxWrap-part .box img {width:auto; height:50px;}
	.boxWrap:not(.boxWrap-part) .box:hover img {margin:-50px 0 0 0;}
}


@media all and (max-width:768px) {
	.left25 {float:none; width:100%;}
	.right75 {float:none; width:100%;}
}

@media all and (max-width:640px) {
	.boxWrap .box {width:33%; margin:0 0.5% 0.5% 0;}
	.boxWrap .box:nth-child(4n+4) {margin:0 0.5% 0.5% 0;}
	.boxWrap .box:nth-child(3n+3) {margin:0 0 0.5% 0;}
}

@media all and (max-width:460px) {
	.boxWrap .box {width:49.5%; height:55px; }
	.boxWrap .box:nth-child(2n+2) {margin:0 0 0.5% 0;}
	.boxWrap .box:nth-child(4n+4) {margin:0 0 0.5% 0;}
	.boxWrap .box:nth-child(3n+3) {margin:0 0.5% 0.5% 0;}

	.boxWrap .box img {height:110px;}
	.boxWrap-part .box img {width:auto; height:55px;}
	.boxWrap:not(.boxWrap-part) .box:hover img {margin:-55px 0 0 0;}
}


/* 동영상 */
.videoWrap {position:relative; width:100%; overflow:hidden;}
.videoWrap .vod {position:relative; float:left; width:49%; height:430px; margin:0 0 0 0.5%;}
.videoWrap .vod iframe {width:100%; height:340px;}
.videoWrap .vod:fist-child {margin:0;}
.videoWrap .vod .frame {position:absolute; width:100%; height:387px; background:url(/image/vod_pro01.jpg) no-repeat; overflow:hidden; }
.videoWrap .vod .frame img {width:auto; height:387px;}
.videoWrap .vod video {width:100%; height:387px;} 
.videoWrap .vod p {padding:10px 0 0 0; font-size:20px; letter-spacing:-1.2px; text-align:center;}
.videoWrap .back {position:absolute; bottom:0; width:100%; height:450px; background:url(/image/vod_text.png) no-repeat right 80% #e7e7e7; z-index:-1;}


@media all and (max-width:1000px) {
	.videoWrap .vod {height:350px;}
	.videoWrap .vod iframe {width:100%; height:270px;}
	.videoWrap .vod p {font-size:17px;}
	.videoWrap .back {height:340px; background-size:auto 95px;}
}


@media all and (max-width:768px) {
	.videoWrap .vod {height:250px;}
	.videoWrap .vod iframe {width:100%; height:200px;}
	.videoWrap .vod p {font-size:14px;}
	.videoWrap .back {height:260px; background-size:auto 95px;}
}

@media all and (max-width:560px) {
	.videoWrap .vod {float:none;  width:80%; height:300px; margin:0 auto 15px auto;}
	.videoWrap .vod iframe {height:240px;}
	.videoWrap .back {height:580px;}
}


@media all and (max-width:460px) {
	.videoWrap .vod {width:90%; height:300px;}
	.videoWrap .vod iframe {height:230px;}
}


/* solution & server */
.serWrap {position:relative; width:100%; padding:170px 0 0 0;  text-align:center; overflow:hidden; }
.serWrap .bgWh {position:absolute; top:650px; left:0; width:100%; height:546px; background:#fbfbfb; z-index:-1;}
.serWrap .title1 {font-size:54px; font-weight:600; font-family:"Metropolis-Bold";} 
.serWrap .title1 .strong {background:#000;  padding:10px 18px 7px 18px; font-size:43px;color:#fff; display:inline-block; line-height:1;}

.cerWrap {position:relative; width:930px; height:870px; margin:75px auto 0; }
.cerWrap .cirImg {position:absolute; top:70px; right:50%; width:510px; height:510px; margin-right:-255px; background:url(/image/cir_img.png) no-repeat; background-size:100%;}
.cerWrap .cirImg img.fido {margin:177px 0 26px 0;}
.cerWrap .cirImg .text {color:#fff; font-size:29px; font-weight:600; line-height:1.1;}
.cerWrap .cirImg .text strong {font-size:32px; font-weight:600; font-family:"Metropolis-Bold";}

.cirDot {
	position:absolute; top:0; right:50%; 
	margin-right:-324.5px;
	width:649px; height:649px; 
	background:url(/image/cir_dot.png) no-repeat center center; 
	background-size:100%; 
	-webkit-animation: lot 13s linear infinite;
    animation: lot 65s linear infinite;
}


@media all and (max-width:1600px) {
	.serWrap .title1 {font-size:50px;}
	.serWrap .title1 .strong {font-size:41px;}
}

@media all and (max-width:1300px) {
	.serWrap {padding:140px 0 0 0;}
	.serWrap .bgWh {top:610px;}
	.serWrap .title1 {font-size:45px;}
	.serWrap .title1 .strong {font-size:36px;}
}


@media all and (max-width:950px) {
	.serWrap {padding:100px 0 0 0;}
	.serWrap .bgWh {top:530px;}
	.serWrap .title1 {font-size:42px;}
	.serWrap .title1 .strong {font-size:33px;}

	.cerWrap {width:800px; height:770px}
	.cerWrap .cirImg {top:60px; width:440px; height:440px; margin-right:-220px;}
	.cerWrap .cirImg .text {font-size:23px;}
	.cerWrap .cirImg .text strong {font-size:26px;}
	.cirDot {width:560px; height:560px; margin-right:-280px;}
}

@media all and (max-width:800px) {
	.serWrap .bgWh {top:430px;}

	.cerWrap {width:600px; height:580px;}
	.cerWrap .cirImg {top:45px; width:330px; height:330px; margin-right:-165px;}
	.cerWrap .cirImg img.fido {margin:107px 0 20px 0;}
	.cerWrap .cirImg .text {font-size:20px;}
	.cerWrap .cirImg .text strong {font-size:23px;}
	.cirDot {width:420px; height:420px; margin-right:-210px;}
}

@media all and (max-width:768px) {
	.serWrap {padding:80px 0 0 0;}
	.serWrap .bgWh {top:417px;}

	.serWrap .title1 {font-size:38px;}
	.serWrap .title1 .strong {font-size:29px;}
}

@media all and (max-width:600px) {
	.serWrap .bgWh {top:410px;}

	.cerWrap {width:500px; height:500px;}
	.cerWrap .cirImg {width:310px; height:310px; margin-right:-155px;}
	.cerWrap .cirImg img.fido {margin:90px 0 20px 0;}
	.cerWrap .cirImg .text {font-size:17px;}
	.cerWrap .cirImg .text strong {font-size:18px;}
	.cirDot {width:400px; height:400px; margin-right:-200px;}
}

@media all and (max-width:580px) {
	.serWrap .title1 {font-size:33px;}
	.serWrap .title1 .strong {font-size:26px;}
}

@media all and (max-width:500px) {
	.cerWrap {width:360px; height:730px;}
	.cerWrap .cirImg {top:35px; width:330px; height:330px; margin-right:-165px;}
	.cerWrap .cirImg img.fido {margin:90px 0 20px 0;}
	.cerWrap .cirImg .text {font-size:17px;}
	.cerWrap .cirImg .text strong {font-size:18px;}
	.cirDot {width:400px; height:400px; margin-right:-200px;}
}

@media all and (max-width:460px) {
	.serWrap .title1 {font-size:30px;}
	.serWrap .title1 .strong {font-size:24px;}
}

@media all and (max-width:420px) {
	.serWrap .title1 {font-size:28px;}
	.serWrap .title1 .strong {font-size:22px;}
}


@-webkit-keyframes lot /* Safari and Chrome */ {
	from {
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(-360deg);
		-o-transform: rotate(-360deg);
		transform: rotate(-360deg);
	}
}
@keyframes lot {
	from {
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-ms-transform: rotate(-360deg);
		-moz-transform: rotate(-360deg);
		-webkit-transform: rotate(-360deg);
		-o-transform: rotate(-360deg);
		transform: rotate(-360deg);
	}
}

.dot01 {position:absolute; top:315px; left:132px; width:18px; height:18px; background:#e94c4c; border-radius:9px; z-index:1;}
.posi01 {position:absolute; top:235px; left:27px; background:url(/image/sicon01.png) no-repeat center top; padding:74px 0; font-size:22px; font-weight:500; line-height:1.1; letter-spacing:-1.2px;}

.dot02 {position:absolute; top:547px; left:230px; width:18px; height:18px; background:#e94c4c; border-radius:9px; z-index:1;}
.posi02 {position:absolute; top:485px; left:85px; background:url(/image/sicon02.png) no-repeat center top; padding:70px 0; font-size:22px; font-weight:500; line-height:1.1; letter-spacing:-1.2px;}

.dot03 {position:absolute; top:638px; left:50%; margin-left:-9px; width:18px; height:18px; background:#e94c4c; border-radius:9px; z-index:1;}
.posi03 {position:absolute; top:677px; left:50%; margin-left:-5%; background:url(/image/sicon03.png) no-repeat center top; padding:70px 0; font-size:22px; font-weight:500; line-height:1.1; letter-spacing:-1.2px;}

.dot04 {position:absolute; top:547px; right:230px; width:18px; height:18px; background:#e94c4c; border-radius:9px; z-index:1;}
.posi04 {position:absolute; top:485px; right:65px; background:url(/image/sicon04.png) no-repeat center top; padding:70px 0; font-size:22px; font-weight:500; line-height:1.1; letter-spacing:-1.2px;}
.posi04 .small {padding:7px 0 0 0; font-size:13px; font-weight:300; letter-spacing:0; line-height:1.2;}

.dot05 {position:absolute; top:315px; right:134px; width:18px; height:18px; background:#e94c4c; border-radius:9px; z-index:1;}
.posi05 {position:absolute; top:235px; right:0px; background:url(/image/sicon05.png) no-repeat center top; padding:70px 0; font-size:22px; font-weight:500; line-height:1.1; letter-spacing:-1.2px;}
.posi05 .small {padding:7px 0 0 0; font-size:13px; font-weight:300; letter-spacing:0; line-height:1.2;}


@media all and (max-width:950px) {
	.dot01 {top:280px; left:112px; width:15px; height:15px; border-radius:7.5px;}
	.posi01 {top:245px; left:35px; padding:60px 0; background-size:50px; font-size:17px;}

	.dot02 {top:470px; left:192px; width:15px; height:15px; border-radius:7.5px;}
	.posi02 {top:475px; left:105px; padding:60px 0; background-size:50px; font-size:17px;}

	.dot03 {top:552px; width:15px; height:15px; border-radius:7.5px;}
	.posi03 {top:580px; padding:60px 0; background-size:50px; font-size:17px;}
	
	.dot04 {top:470px; right:192px; width:15px; height:15px; border-radius:7.5px;}
	.posi04 {top:475px; right:90px; padding:60px 0; background-size:50px; font-size:17px;}

	.dot05 {top:280px; right:113px; width:15px; height:15px; border-radius:7.5px;}
	.posi05 {top:245px; padding:60px 0; background-size:50px; font-size:17px;}
}


@media all and (max-width:800px) {
	.dot01 {top:210px; left:82px;}
	.posi01 {top:180px; left:20px; padding:50px 0; background-size:40px; font-size:14px;}

	.dot02 {top:350px; left:141px;}
	.posi02 {top:385px; left:105px; padding:50px 0; background-size:40px; font-size:14px;}

	.dot03 {top:412px; }
	.posi03 {top:440px; padding:50px 0; background-size:40px; font-size:14px;}
	
	.dot04 {top:350px; right:141px; }
	.posi04 {top:385px; right:90px; padding:50px 0; background-size:40px; font-size:14px;}

	.dot05 {top:210px; right:83px; }
	.posi05 {top:180px; padding:50px 0; background-size:40px; font-size:14px;}
	.posi05 .small {padding:7px 0 0 0; font-size:11px;}
}


@media all and (max-width:600px) {
	.dot01 {top:200px; left:86px;}

	.dot02 {top:305px; left:135px;}
	.posi02 {top:330px; left:105px; }

	.dot03 {top:348px; }
	.posi03 {top:370px; }
	
	.dot04 {top:305px; right:135px; }
	.posi04 {top:330px; right:90px; }

	.dot05 {top:200px; right:86px; }
}

@media all and (max-width:500px) {
	.dot01 {top:390px; left:15%;}
	.posi01 {top:410px; left:11%; padding:55px 0 0 0; background-size:50px;}

	.dot02 {top:390px; left:50%; margin-left:-7.5px;}
	.posi02 {top:410px; left:50%; margin-left:-37px; padding:55px 0 0 0; background-size:50px;}

	.dot03 {top:390px; right:15%; left:auto; margin-left:0;}
	.posi03 {top:410px; right:9%; left:auto; margin-left:0; padding:55px 0 0 0; background-size:50px;}
	
	.dot04 {top:520px; right:auto; left:30%;}
	.posi04 {top:540px; right:auto; left:17%; padding:55px 0 0 0; background-size:50px;}

	.dot05 {top:520px; right:30%; }
	.posi05 {top:540px; right:17%; padding:55px 0 0 0; background-size:50px;}
}






/* spec */
.specWrap {position:relative; width:100%; background:#fbfbfb; padding:100px 0; }
.specWrap .inner {width:1300px; margin:0 auto; overflow:hidden;}
.specWrap .left {float:left; width:28%; font-size:40px; font-weight:600; line-height:1;}
.specWrap .right {float:left; width:72%;}
.specWrap .right .strong {font-size:25px; font-weight:900; font-family:"Metropolis-ExtraBold";}

.specWrap .table {width:100%; border-top:2px solid #000; margin:0 0 60px 0; overflow:hidden;} 
.specWrap .table ul {float:left; border-right:1px solid #dbdbdb; }
.specWrap .table ul:nth-child(2) {border-right:0;}
.specWrap .table ul.name {width:45%;}
.specWrap .table ul.cont {width:55%;}
.specWrap .table ul li {background:#fff; padding:11px 0 11px 80px; font-size:16px; border-bottom:1px solid #dbdbdb; letter-spacing:0;}
.specWrap .table ul li.th {background:#f4f4f4; padding:14px 0 10px 80px; font-size:18px; font-weight:600;}
.sLine {display:block;}

@media all and (max-width:1300px) {
	.specWrap .inner {width:95%;}

	.specWrap .table ul li {padding:11px 0 11px 6%;}
	.specWrap .table ul li.th {padding:14px 0 10px 6%;}
}

@media all and (max-width:1100px) {
	.specWrap {padding:100px 0 80px 0;}
	.specWrap .left {font-size:35px;}
	.specWrap .table ul li {font-size:14px;}
	.specWrap .table ul li.th {font-size:15px;}
}

@media all and (max-width:890px) {
	.specWrap {padding:80px 0 60px 0;}
	.specWrap .left {font-size:30px;}
	.specWrap .right .strong {font-size:22px;}
	.specWrap .table ul.name {width:35%;}
	.specWrap .table ul.cont {width:65%;}
	.specWrap .table ul li {font-size:13px;}
	.specWrap .table ul li.th {font-size:14px;}
}

@media all and (max-width:768px) {
	.specWrap .inner {width:85%;}
	.specWrap .left {float:none; width:100%; padding:0 0 35px 0;}
	.specWrap .right {float:none; width:100%;}
	.sLine {display:inline;}
}

@media all and (max-width:570px) {
	.specWrap {padding:80px 0 50px 0;}
	.specWrap .inner {width:90%;}
	.specWrap .table ul.name {width:30%;}
	.specWrap .table ul.cont {width:70%;}
	.specWrap .table ul li {font-size:12px;}
	.specWrap .table ul li.th {font-size:13px;}
}

@media all and (max-width:460px) {
	.specWrap {padding:80px 0 30px 0;}
	.specWrap .table ul li {padding:11px 6% 11px 6%;}
	.specWrap .table ul li.h2 {height:60px;}
}


/* API */
.bigTit0 {padding:110px 0 70px 0; text-align:center; font-size:54px; font-weight:600; font-family:"Metropolis-Bold";}
.midTit {width:740px; height:90px; background:url(/image/line_left.png) no-repeat left top, url(/image/line_right.png) no-repeat right top; margin:0 auto; text-align:center; font-size:35px; font-weight:300; line-height:1.2;}
.apiWrap {width:100%; margin:62px 0 0 0; overflow:hidden;}
.apiWrap ul {float:left; width:25%;}
.apiWrap ul li {position:relative; min-height:30px; text-align:center;}
.apiWrap ul li.pic {height:339px; overflow:hidden;}
.apiWrap ul li.pic img {width:100%; height:auto;}
.apiWrap ul li.name {height:93px; padding:30px 0 0 0; font-size:30px; font-weight:200; font-family:"Metropolis-Light";  line-height:0.9;}
.apiWrap ul li.name span {font-size:20px; line-height:0.9; }
.apiWrap .vLine {position:absolute; top:0; width:1px; height:30px; left:50%; margin-left:-0.5px; background:#c2c2c2; display:inline-block; z-index:1;}
.apiWrap ul li.num {padding:7px 0; font-size:16px; font-weight:900; font-family:"Metropolis-ExtraBold";}

@media all and (max-width:1600px) {
	.bigTit0 {font-size:48px;}
	.midTit {width:700px; padding:8px 1%; font-size:30px;}
	.apiWrap ul li.name {height:80px; padding:20px 0 0 0; font-size:25px;}
	.apiWrap ul li.pic {height:300px; text-align:center;}
	.apiWrap ul li.pic img {width:auto; height:100%;}
}

@media all and (max-width:1300px) {
	.apiWrap ul li.name {height:75px; font-size:21px;}
	.apiWrap ul li.name span {font-size:18px;}
	.apiWrap ul li.pic {height:250px;}
	.apiWrap ul li.pic img {width:auto; height:100%;}
}

@media all and (max-width:1200px) {
	.bigTit0 {padding:110px 0 50px 0; font-size:43px;}
	.midTit {width:80%; padding:8px 5%; font-size:26px;}
	.apiWrap {margin:30px 0 0 0;}
}

@media all and (max-width:1050px) {
	.apiWrap ul li.name {height:70px; font-size:16px; line-height:1.2;}
	.apiWrap ul li.name span {font-size:14px;}
	.apiWrap ul li.pic {height:200px;}
	.apiWrap ul li {min-height:20px;}
	.apiWrap .vLine {height:20px;}
}

@media all and (max-width:768px) {
	.bigTit0 {padding:90px 0 30px 0;}
	.apiWrap ul li.name {height:70px; font-size:14px;}
	.apiWrap ul li.pic {height:140px;}
}

@media all and (max-width:690px) {
	.midTit {width:88%;}
	.apiWrap {margin:20px 0 0 0;}
	.apiWrap ul {width:50%;}
	.apiWrap ul li.name {height:50px;}
	.apiWrap ul li.pic {height:200px;}
	.apiWrap ul li.pic img {width:100%; height:auto;}
	.apiWrap ul li {min-height:0;}
	.apiWrap .vLine {display:none;}
	.apiWrap ul li.num {padding:0 0 25px 0;}
}

@media all and (max-width:580px) {
	.bigTit0 {padding:80px 0 30px 0; font-size:38px;}
	.midTit {width:95%; font-size:23px;}
	.apiWrap ul li.pic {height:150px;}
}

@media all and (max-width:540px) {
	.midTit {padding:15px 4% 0 4%;}
}



@media all and (max-width:480px) {
	.bigTit0 {font-size:35px;}
	.midTit {height:70px; background-size:auto 100%; padding:15px 4% 0 4%; font-size:18px;}
	.apiWrap ul li.pic img {width:auto; height:115%;}
}


.ieWrap {position:relative; width:100%; height:840px; margin:80px 0 0 0; padding:200px 0 150px 0;}
.ieWrap .title2 {background:url(/image/lines_left.png) no-repeat left top, url(/image/lines_right.png) no-repeat right top; font-size:35px; font-weight:400; text-align:center; letter-spacing:-1px;}
.ieWrap .bgG {position:absolute; bottom:0; left:0; width:100%; height:568px; background:#fbfbfb; z-index:-1;}
.ieWrap .inner {width:1300px; margin:0 auto;}
.ieWrap .dec {width:710px;}
.ieWrap .dec .iWrap {margin:150px 0 0 0; overflow:hidden;}
.ieWrap .dec .iWrap ul {float:left; width:33.3%; padding:110px 4% 0 4%; background-size:auto;}
.ieWrap .dec .iWrap ul li {font-size:17px; font-weight:400; color:#000; text-align:center; line-height:1.2;}
.i01 {background:url(/image/solicon01.png) no-repeat center top;}
.i02 {background:url(/image/solicon02.png) no-repeat center top;}
.i03 {background:url(/image/solicon03.png) no-repeat center top;}
.ieWrap .note {position:absolute; right:0; top:90px; width:961px; height:667px; background:url(/image/notebook.png) no-repeat; background-size:100%;}

@media all and (max-width:1800px) {
	.ieWrap .inner {}
	.ieWrap .note {width:850px; height:590px; }
}

@media all and (max-width:1600px) {
	.ieWrap .title2 {font-size:30px;}
	.ieWrap .dec {width:51%;}
	.ieWrap .dec .iWrap {margin:100px 0 0 0;}
	.ieWrap .note {width:50%;}
}

@media all and (max-width:1300px) {
	.ieWrap {height:700px; padding:130px 0 0 0;}
	.ieWrap .bgG {height:450px;}
	.ieWrap .inner {width:95%;}

	.ieWrap .dec .iWrap ul {background-size:90px auto;}
	.ieWrap .dec .iWrap ul li {font-size:15px;}
	.ieWrap .note {height:500px;}
}

@media all and (max-width:1200px) {
	.ieWrap {height:600px; padding:130px 0 0 0;}
	.ieWrap .bgG {height:380px;}
	.ieWrap .title2 {background-size:auto 100%; font-size:26px;}

	.ieWrap .dec .iWrap ul {background-size:80px auto; padding:90px 4% 0 4%;}
	.ieWrap .dec .iWrap ul li {font-size:14px;}
}

@media all and (max-width:1050px) {
	.ieWrap {height:550px;}
	.ieWrap .bgG {height:330px;}
	.ieWrap .dec {width:55%;}
	.ieWrap .note {width:46%; height:400px;}
}


@media all and (max-width:960px) {	
	.ieWrap .title2 {background:url(/image/com_left.png) no-repeat left top, url(/image/com_right.png) no-repeat right top; background-size:auto 100%; padding:0 8%;}
	.ieWrap .dec {width:50%; padding:0 0 0 7%;}
	.ieWrap .note {background-size:auto 100%;}
}

@media all and (max-width:768px) {	
	.ieWrap .dec {width:48%; padding:0 0 0 3%;}
	.ieWrap .dec .iWrap {margin:80px 0 0 0;}
	.ieWrap .dec .iWrap ul {background-size:60px auto; padding:70px 4% 0 4%;}
	.ieWrap .dec .iWrap ul li {font-size:13px;}
	.ieWrap .note {width:55%; }
}


@media all and (max-width:690px) {
	.ieWrap {height:1000px;}
	.ieWrap .bgG {height:760px;}
	.ieWrap .title2 {width:80%; margin:0 auto;}
	.ieWrap .dec {width:100%; padding:0; }
	.ieWrap .dec .iWrap {width:80%; margin:60px auto 0;}
	.ieWrap .dec .iWrap ul {background-size:80px auto; padding:90px 3% 0 3%;}

	.ieWrap .note {top:445px; width:100%; height:480px; background-size:100% auto; }
}

@media all and (max-width:540px) {
	.ieWrap {height:850px;}
	.ieWrap .bgG {height:630px;}
	.ieWrap .title2 {font-size:23px;}
	.ieWrap .note {top:445px; width:90%;}
}

@media all and (max-width:480px) {
	.ieWrap {height:780px;}
	.ieWrap .bgG {height:560px;}
	.ieWrap .title2 {font-size:18px;}
	.ieWrap .dec .iWrap ul {background-size:60px auto; padding:70px 3% 0 3%;}
	.ieWrap .note {top:425px;}
}


.loWrap {width:100%; height:1253px; background:url(/image/sol_bg.jpg) no-repeat; background-size:cover;} 
.loWrap .inner {width:1300px; margin:0 auto; padding:160px 0 0 0; color:#fff;}
.loWrap .big {font-size:54px; font-weight:600; font-family:"Metropolis-Bold"; text-shadow:0 0 10px rgba(0,0,0,.3);}
.loWrap .small {width:45%; padding:45px 0 75px 0; font-weight:300; font-size:25px; text-shadow:0 0 7px rgba(0,0,0,.3); line-height:1.3;}
.loWrap .width1600 {float:right; width:1600px; height:290px; background:#fff; padding:70px 0;}
.loWrap .width1600 ul {float:left; width:20%; height:100%; padding:0 4.5%;  border-left:1px solid #dedede;}
.loWrap .width1600 ul:first-child {border-left:0;}
.loWrap .width1600 .num {padding:0 0 20px 0; font-size:40px; font-weight:200; font-family:"Metropolis-Light"; color:#e94c4c; line-height:1;}
.loWrap .width1600 .name {font-size:19px; font-weight:500; line-height:1.2;}
.loWrap .width1600 .name .txt {padding:12px 0 0 0; font-size:14px; color:#737373;}
.loWrap .title21 {background:url(/image/lines_left.png) no-repeat left top, url(/image/lines_right.png) no-repeat right top; padding:0 50px; font-size:35px; font-weight:400; text-align:center; letter-spacing:-1px; display:inline-block;}

.loWrap .icon4Wrap {float:left; width:1600px; height:300px; background:#fff; margin:35px 0 0 0;}
.loWrap .icon4Wrap ul {float:right; width:1300px; overflow:hidden; padding:90px 7% 0 3%;}
.loWrap .icon4Wrap ul li {float:left; width:25%; padding:115px 3% 0 3%; text-align:center; line-height:1.2;}
.loWrap .icon4Wrap ul li p {font-size:17px; font-weight:400;}
.loWrap .icon4Wrap ul li p span {font-size:14px;}


@media all and (max-width:1600px) {
	.loWrap {width:100%; height:1140px;}
	.loWrap .inner {width:90%; margin:0 0 0 10%; padding:130px 0 0 0;}
	.loWrap .big {font-size:48px;}
	.loWrap .small {width:35%; font-size:20px;}
	.loWrap .width1600 {width:90%;}
	
	.loWrap .title21 {font-size:30px; background-size:auto 100%;}
	
	.loWrap .icon4Wrap {width:90%;}
	.loWrap .icon4Wrap ul {}
}

@media all and (max-width:1500px) {
	.loWrap .icon4Wrap ul {width:90%;}
}

@media all and (max-width:1300px) {
	.loWrap {height:1044px;}
	.loWrap .small {padding:35px 0 55px 0;}
	.loWrap .width1600 {height:220px; padding:50px 0;}
	.loWrap .width1600 ul {padding:0 4%;}
	.loWrap .width1600 .num {font-size:30px;}
	.loWrap .width1600 .name {font-size:16px;}
	
	.loWrap .icon4Wrap {height:270px;}
	.loWrap .icon4Wrap ul {width:90%; padding:70px 5% 0 3%;}
	.loWrap .icon4Wrap ul li {background-size:80px auto; padding:90px 3% 0 3%;}
	.loWrap .icon4Wrap ul li p {font-size:15px;}
}

@media all and (max-width:1200px) {
	.loWrap {height:1000px;}
	.loWrap .big {font-size:43px;}
	.loWrap .small {width:45%;}

	.loWrap .title21 {font-size:26px;}
}

@media all and (max-width:980px) {
	.loWrap {height:900px;}
	.loWrap .small {width:55%; padding:20px 0 20px 0; font-size:18px; }
	.loWrap .inner {width:90%; margin:0 auto; padding:70px 0 0 0;}
	.loWrap .width1600 {float:none; width:95%; margin:0 auto;}
	.loWrap .width1600 ul {padding:0 4%;}
	.loWrap .width1600 .num {padding:0 0 15px 0; font-size:27px;}
	.loWrap .width1600 .name {font-size:15px;}

	.loWrap .icon4Wrap {float:none; width:95%; height:230px; margin:10px auto 0;}
	.loWrap .icon4Wrap ul {float:none; width:100%; padding:50px 5% 0 5%;}
}

@media all and (max-width:840px) {
	.loWrap .width1600 {height:180px; padding:35px 0 30px 0;}
	.loWrap .width1600 ul {padding:0 3%;}
	.loWrap .width1600 .num {font-size:24px;}
	.loWrap .width1600 .name {font-size:13px;}
	.loWrap .width1600 .name .txt {padding:7px 0 0 0; font-size:12px;}	

	.loWrap .icon4Wrap {height:190px;}
	.loWrap .icon4Wrap ul {padding:40px 2% 0 2%;}
	.loWrap .icon4Wrap ul li {background-size:60px auto; padding:70px 3% 0 3%;}
	.loWrap .icon4Wrap ul li p {font-size:14px;}
}

@media all and (max-width:680px) {
	.loWrap {height:850px;}
	.loWrap .title21 {background:url(/image/com_left.png) no-repeat left top, url(/image/com_right.png) no-repeat right top; background-size:auto 100%;}
}

@media all and (max-width:580px) {
	.loWrap {height:950px;}
	.loWrap .big {font-size:38px;}
	.loWrap .small {font-size:17px;}
	.loWrap .width1600 {height:auto; background:none; padding:0;}
	.loWrap .width1600 ul {width:33.3%; height:150px; background:#fff; padding:30px 3%;}
	.loWrap .width1600 ul:nth-child(4) {border-top:1px solid #dedede;}
	.loWrap .width1600 ul:nth-child(5) {border-top:1px solid #dedede;}
	
	.loWrap .title21 {font-size:23px;}

	.loWrap .icon4Wrap ul {padding:40px 0;}
	.loWrap .icon4Wrap ul li p {font-size:13px;}
	.loWrap .icon4Wrap ul li p span {font-size:12px;}
}


@media all and (max-width:480px) {
	.loWrap {height:920px;}
	.loWrap .big {font-size:35px;}
	.loWrap .width1600 ul {padding:25px 3%;}

	.loWrap .title21 {font-size:18px;}
}

@media all and (max-width:460px) {
	.loWrap {height:1000px;}
	.loWrap .icon4Wrap {height:auto; overflow:hidden;}
	.loWrap .icon4Wrap ul {padding:20px 0;}
	.loWrap .icon4Wrap ul li {width:50%; padding:70px 10% 0 10%;}
	.loWrap .icon4Wrap ul li:nth-child(3) {margin:20px 0 0 0;}
	.loWrap .icon4Wrap ul li:nth-child(4) {margin:20px 0 0 0;}
}


.icon401 {background:url(/image/icon4_01.png) no-repeat center top;}
.icon402 {background:url(/image/icon4_02.png) no-repeat center top;}
.icon403 {background:url(/image/icon4_03.png) no-repeat center top;}
.icon404 {background:url(/image/icon4_04.png) no-repeat center top;}


.moniWrap {width:1250px; height:500px; margin:100px auto 200px auto; overflow:visible; }
.moniWrap ul {float:left; width:583px;  }
.moniWrap ul:nth-child(2) {float:right;}
.moniWrap ul li.pic {box-shadow:15px 15px 30px rgba(0,0,0,.2);}
.moniWrap ul li.pic img {width:auto; height:auto;}
.moniWrap ul li.text {padding:15px 0; text-align:center; font-size:17px;}

@media all and (max-width:1300px) {
	.moniWrap {width:95%;}
	.moniWrap ul {width:48%;}
	.moniWrap ul li.pic img {width:100%;}
}

@media all and (max-width:960px) {
	.moniWrap {height:400px;}
	.moniWrap ul {width:49%;}
	.moniWrap ul li.pic {box-shadow:10px 10px 20px rgba(0,0,0,.2);}
}

@media all and (max-width:860px) {
	.moniWrap {margin:100px auto;}
}

@media all and (max-width:640px) {
	.moniWrap {width:70%; height:800px; margin:100px auto 150px auto;}
	.moniWrap ul {width:100%;}
	
}


@media all and (max-width:580px) {
	.moniWrap {width:90%; margin:100px auto 250px auto; }
}

@media all and (max-width:520px) {
	.moniWrap {margin:100px auto;}
}

@media all and (max-width:460px) {
	.moniWrap {height:700px; margin:100px auto 80px auto;}
}

.app100 {position:relative; width:100%; height:; overflow:hidden;}
.app100 .appBg {position:absolute; top:244px; left:0; width:100%; height:665px; background:#fbfbfb; z-index:-1;}
.appWrap {float:right; width:1600px; height:560px;}
.appWrap .left {float:left; width:35%;}
.appWrap .right {float:left; width:65%; height:560px; background:url(/image/api_img.jpg) no-repeat; background-size:100%;}

.bigTit1 {padding:0 0 40px 0; text-align:center; font-size:54px; font-weight:600; font-family:"Metropolis-Bold"; text-align:left;}
.midTit1 {width:470px; height:90px; background:url(/image/line_left.png) no-repeat left top, url(/image/line_right.png) no-repeat right top; padding:0 0 0 40px; text-align:left; font-size:35px; font-weight:300; letter-spacing:-1.2px; line-height:1.2; }

.appWrap .iBox {width:470px; margin:77px 0 0 0; background:#fff; border-top:1px solid #c8c8c8; text-align:center; font-size:20px; font-weight:400; overflow:hidden;}
.appWrap .iBox ul {border-left:1px solid #c8c8c8; border-right:1px solid #c8c8c8;  border-bottom:1px solid #c8c8c8; overflow:hidden;} 
.appWrap .iBox ul li {float:left; width:50%; height:136px; padding:30px 8% 0 8%; border-left:1px solid #c8c8c8; line-height:1.1;}
.appWrap .iBox ul li p {}
.appWrap .iBox ul li:nth-child(2n+1) {border-left:0;}
.appWrap .iBox .num {padding:0 0 10px 0; font-size:18px; font-weight:800; font-family:"Metropolis-ExtraBold"; color:#e94c4c;}


@media all and (max-width:1600px) {
	.appWrap {width:95%;}
	.appWrap .right {background-size:auto 100%;}

	.bigTit1 {font-size:48px;}
	.midTit1 {font-size:30px;}
}

@media all and (max-width:1500px) {
	.app100 .appBg {top:230px;}
	.appWrap .left {width:40%;}
	.appWrap .right {width:60%; background-size:auto 100%;}

	.midTit1 {width:90%;}

	.appWrap .iBox {width:90%;}
}

@media all and (max-width:1200px) {
	.bigTit1 {font-size:43px;}
	.midTit1 {font-size:26px;}
	
	.appWrap .iBox {font-size:17px; }
	.appWrap .iBox ul li {height:126px;}
	.appWrap .iBox .num {font-size:;}
}

@media all and (max-width:1050px) {
	.app100 .appBg {top:220px;}
	.appWrap .left {width:50%;}
	.appWrap .right {width:50%;}
}

@media all and (max-width:860px) {
	.app100 .appBg {top:180px;  height:580px;} 
	.appWrap .right {height:427px;}
    
	.bigTit1 {width:90%; padding:0 0 20px 0; text-align:center; }
	.midTit1 {width:90%; text-align:center; padding:10px 0; }

	.appWrap .iBox {margin:30px 0 0 0;}
	.appWrap .iBox ul li {height:110px; padding:20px 8% 0 8%;}
}

@media all and (max-width:790px) {
	.appWrap {float:none; width:70%; height:auto; margin:0 auto; overflow:hidden;}
	.appWrap .left {float:none; width:100%; }
	.appWrap .right {float:none; width:100%; height:327px; margin:20px 0 0 0;}
	
	.bigTit1 {width:100%;}
	.midTit1 {width:100%;}
	
	.appWrap .iBox {width:100%;}
}

@media all and (max-width:680px) {
	.app100 .appBg {height:870px;}
}

@media all and (max-width:580px) {
	.appWrap {width:80%; }
	.app100 .appBg {height:990px;}
	.bigTit1 {font-size:38px;}
}

@media all and (max-width:540px) {
	.midTit1 {font-size:23px;}
}

@media all and (max-width:480px) {
	.app100 .appBg {height:1030px;}
	.app100 .appBg {top:170px;} 
	.bigTit1 {font-size:35px;}
}

@media all and (max-width:420px) {
	.appWrap {width:90%;}
}

.seWrap {width:1000px; margin:160px auto; text-align:center; overflow:hidden;}
.seWrap .titM {padding:0 0 75px 0; font-size:35px; font-weight:500; letter-spacing:-1.2px;}
.seWrap ul li {float:left; width:20%; height:190px; padding:115px 3% 0 3%; font-size:17px; line-height:1.2;}

.se01 {background:url(/image/api01.png) no-repeat center top;}
.se02 {background:url(/image/api02.png) no-repeat center top;}
.se03 {background:url(/image/api03.png) no-repeat center top;}
.se04 {background:url(/image/api04.png) no-repeat center top;}
.se05 {background:url(/image/api05.png) no-repeat center top;}


@media all and (max-width:1600px) {
	.seWrap .titM {font-size:30px;}
}

@media all and (max-width:1200px) {
	.seWrap .titM {font-size:26px;}
}

@media all and (max-width:1100px) {
	.seWrap {width:90%; margin:165px auto;}
	.seWrap ul li {background-size:85px auto; padding:100px 3% 0 3%; font-size:15px;}
}

@media all and (max-width:860px) {
	.seWrap { margin:80px auto; }
	.seWrap .titM {padding:0 0 50px 0;}
	.seWrap ul li {background-size:65px auto; padding:80px 3% 0 3%; font-size:14px;}
}

@media all and (max-width:680px) {
	.seWrap { margin:150px auto 80px auto; }
	.seWrap ul li {padding:65px 3% 0 3%; font-size:13px;}
}

@media all and (max-width:540px) {
	.seWrap .titM {font-size:23px;}
	.seWrap ul li {width:33.3%; height:135px; padding:75px 3% 0 3%;}
}

@media all and (max-width:420px) {
	.seWrap ul li {background-size:55px auto; padding:65px 3% 0 3%;}
}

/* support */
.suMid {width:100%; height:340px; background:#f7f7f7; padding:115px 0 0 0; text-align:center; font-size:50px; font-weight:400; letter-spacing:-1.2px; }
.suMid span {font-size:17px; font-weight:300; display:block;}
.suDoc {width:1200px; height:auto; min-height:500px; background:#fff; margin:-125px auto 100px; overflow:hidden;}
.perDoc {width:1200px; height:auto; min-height:500px; background:#fff; margin:-125px auto 100px; padding:80px; overflow:hidden;}

.suDoc .table {width:100%; border-top:2px solid #000;}
.suDoc .table ul {overflow:hidden; border-bottom:1px dashed #e5e5e5;}
.suDoc .table ul:hover {border-bottom:1px solid #ff6567;}
/* .suDoc .table ul:hover li {color:#ff6567;}
.suDoc .table ul:hover .down {color:#000;} */
.suDoc .table ul.th {border-bottom:1px solid #ccc;}
.suDoc .table ul.th li {font-weight:600;}
.suDoc .table ul li {float:left; height:85px; text-align:center; font-size:17px; line-height:85px;}
.suDoc .table ul li.line01 {padding:25px 5px 0 5px; line-height:1.2;}
.suDoc .w10 {width:10%;}
.suDoc .w15 {width:15%;}
.suDoc .w25 {width:25%;}
.suDoc .w201 {width:20%;}
.suDoc .w30 {width:30%; }
.suDoc .w40 {width:40%; }
.suDoc .w45 {width:45%; }
.suDoc .w60 {width:50%; text-align:left; padding:0 7%;}
.suDoc .down {width:140px; background:url(/image/icon_down.png) no-repeat 20px center rgba(0,0,0,.04); padding:12px 0 10px 40px; line-height:1; text-align:left; font-size:15px; font-weight:500; border-radius:50px; border:1px solid #dedede; display:inline-block; cursor:pointer;}
.suDoc .down:hover {background:url(/image/icon_down_w.png) no-repeat 20px center #ff6567; color:#fff !important; border:1px solid transparent;}
.suDoc .downS {float:right; width:110px; background:url(/image/icon_down.png) no-repeat 18px center #fff; padding:10px 0 8px 40px; line-height:1; text-align:left; font-size:13px; font-weight:500; border-radius:50px; border:1px solid #dedede; display:inline-block; clear:both;}
.suDoc .downS:hover {background:url(/image/icon_down_w.png) no-repeat 18px center #ff6567;  color:#fff !important; border:1px solid transparent;}

.suDoc .downF {background:url(/image/icon_down.png) no-repeat 18px center #fff; margin:20px 0 0 0; padding:10px 15px 8px 40px; font-size:13px; font-weight:500; border-radius:50px; border:1px solid #dedede; display:inline-block;}
.suDoc .downF:hover {background:url(/image/icon_down_w.png) no-repeat 18px center #ff6567;  color:#fff !important; border:1px solid transparent;}

.suDoc .bolder {font-weight:600;}

.suDoc .faq {width:100%; border-top:2px solid #000;}
.suDoc .faq ul {overflow:hidden; border-bottom:1px solid #e5e5e5;}
.suDoc .faq ul li {float:left; width:100%; height:85px; padding:0 5%; text-align:left; font-size:17px; line-height:85px; cursor:pointer;}
.suDoc .faq .iconQ {float:left; width:45px; font-size:30px; font-weight:600; font-family:"Metropolis-ExtraBold"; color:#ff6567; display:inline-block; }
.suDoc .faq .name {float:left; }
.suDoc .faq .iconR {float:right;}
.suDoc .faq .iconArrow {float:right; width:39px; height:39px; background:url(/image/ico_arrow_01.png) no-repeat center center #f5f5f5; background-size:10px 5px; margin:24px 0 0 0; border-radius:50%; border:1px solid #dedede; display:inline-block;}
.suDoc .faq .iconA {margin:12px 35px 0 0; font-size:30px; font-weight:600; font-family:"Metropolis-ExtraBold"; color:#000;}
.suDoc .faq .sub_menu {display:none; background:rgba(0,0,0,.01); border-bottom:1px solid #ccc; padding:35px 5%;}

.suDoc .faq .iconArrow.on {background:url(/image/ico_arrow_02.png) no-repeat center center #fff; background-size:10px 5px;}
.suDoc .faq span + p { display:inline-block; }

@media all and (max-width:1300px) {
	.suMid {font-size:45px;}
	.suDoc {width:95%;}
	.perDoc {width:95%;}

	.suDoc .table ul li {height:75px; font-size:15px; line-height:75px;}
	.suDoc .faq ul li {height:75px; font-size:15px; line-height:75px;}
	.suDoc .faq .iconQ { font-size:28px;}
	.suDoc .faq .iconArrow {width:33px; height:33px; background-size:8px 4px;}
	.suDoc .faq .iconArrow.on {background-size:8px 4px;}
	.suDoc .faq .iconA {margin:12px 25px 0 0; font-size:28px;}
	.suDoc .faq .sub_menu { padding:30px 5%; font-size:15px;}
}

@media all and (max-width:1000px) {
	.suMid {height:270px; }
	.suDoc {margin:-70px auto 100px;}
	.perDoc {margin:-70px auto 100px;}

	.suDoc .table ul li {height:60px; font-size:14px; line-height:60px;}
	.suDoc .down {width:115px; background:url(/image/icon_down.png) no-repeat 15px center rgba(0,0,0,.04); padding:10px 0 8px 35px; font-size:13px;}
	
}


@media all and (max-width:860px) {
	.suMid {height:250px; padding:75px 0 0 0;}
	.suDoc {margin:-85px auto 100px;}
	.perDoc {margin:-85px auto 100px; padding:60px 7%; font-size:14px;}
}

@media all and (max-width:768px) {
	.suMid {height:220px; font-size:40px;}
	.suMid.app {font-size:35px;}
	.suDoc {margin:-70px auto 100px;}
	.perDoc {margin:-70px auto 100px;}

	.suDoc .table ul li {height:50px; line-height:50px;}
	.suDoc .down {width:100px; background:url(/image/icon_down.png) no-repeat 12px center rgba(0,0,0,.04); padding:7px 0 6px 32px; font-size:11px;}
	
	.suDoc .faq ul li {height:auto; padding:20px 3% 15px 3%; font-size:14px; line-height:1.4;}
	.suDoc .faq .iconQ {width:33px; font-size:25px;}
	.suDoc .faq .name {width:88%; padding:7px 5px 0 0;}
	.suDoc .faq .iconA {margin:0 15px 0 0; font-size:25px;}
	.suDoc .faq .iconArrow {width:27px; height:27px; background-size:7px 4px; margin:0;}
	.suDoc .faq .iconArrow.on {background-size:7px 4px;}
	.suDoc .faq .sub_menu { padding:20px 3% 20px 5%; font-size:14px;}
}

@media all and (max-width:580px) {
	.suMid.app {font-size:30px;}
	.suDoc .faq .name {width:85%;}
	.perDoc {padding:40px 7%; font-size:13px;}
}

@media all and (max-width:540px) {
	.suMid {height:200px; padding:55px 0 0 0; font-size:33px;}
	.suDoc .table ul li {height:40px; font-size:13px; line-height:40px;}
	.suDoc .faq ul li { }
}

@media all and (max-width:480px) {
	.suMid {font-size:30px;}
	.suDoc .table ul li {font-size:12px;}
	.suDoc .faq ul li {}
	.suDoc .faq .name {width:80%;}
}

@media all and (max-width:420px) {
	.suMid.app {font-size:28px;}
	.suDoc .down {width:auto; background:rgba(0,0,0,.04); padding:7px 10px;}
}


/* 2024-08-14 추가디자인 */
.downWrap {width:1520px; margin:-125px auto 100px; padding:0 8px; overflow:hidden;}
.downWrap .basicWhite {background:#fff; box-shadow:0 0 8px rgba(0,0,0,.2); border-top:2px solid #000;}
.downWrap .dLeft {float:left; width:20%; }
.downWrap .dList {margin-bottom:40px; }
.downWrap .dList .dTit {background:#fafafa; padding:14px 25px; font-weight:500; font-size:15px;}
.downWrap .dList .dCont {padding:25px; font-size:14px; line-height:1.8;}
.downWrap .dList .dCont input {margin-right:7px;}
.downWrap .dList .dCont .in {margin-left:25px;}
.downWrap .dRight {float:right; width:77%;}
.downWrap .dTable ul {display:flex; justify-content:space-between; height:65px; padding:0 10px; font-size:14px; text-align:center; line-height:65px; border-bottom:1px dashed rgba(0,0,0,.2);}
.downWrap .dTable ul:hover {background:rgba(0,0,0,.01); transition:all .2s;}
.downWrap .dTable .th {border-bottom:1px solid rgba(0,0,0,.2);}
.downWrap .dTable .th.en {font-size:13px;}
.downWrap .dTable .th:hover {background:#fff;}
.downWrap .dTable .w07 {width:7%;}
.downWrap .dTable .w10 {width:10%;}
.downWrap .dTable .w13 {width:13%;}
.downWrap .dTable .w15 {width:15%;}
.downWrap .dTable .w25 {width:25%;}
.downWrap .dTable .w35 {width:35%;}
.downWrap .dTable .btnD {width:40px; height:22px; background:url(/image/icon_down.png) no-repeat center rgba(0,0,0,.05); margin:20px 0 0 0; border:1px solid rgba(0,0,0,.1); border-radius:11px; display:inline-block; cursor:pointer;}

@media all and (max-width:1520px) {
	.downWrap {width:95%;}
	.downWrap .dTable ul {height:auto; padding:15px 10px 0 10px; line-height:1.4;}
	.downWrap .dTable .th {padding:15px 10px;}
	.downWrap .dTable .btnD {margin:0;}	
}

@media all and (max-width:1100px) {
	.downWrap .dLeft {float:none; width:100%;}
	.downWrap .dList {margin-bottom:20px;}
	.downWrap .dList .dTit {background:url(/image/arrow_b.png) no-repeat 98% center #fff;}
	.downWrap .dList .dCont {display:none;}
	.downWrap .dRight {float:none; width:100%;}
}

@media all and (max-width:960px) {
	.downWrap {margin:-60px auto 80px auto;}
}

@media all and (max-width:768px) {
	.downWrap .dList .dCont {font-size:13px;}
	.downWrap .dRight {overflow-x:auto;}
	.downWrap .dTable {width:715px;}
	.downWrap .dTable ul {font-size:13px;}
}



/* 게시판글쓰기 */
.table1 {width:80%; margin:0 auto; padding:70px 0; overflow:hidden;}
.table1 .tit2 {width:100%; padding:80px 0 0 0; font-size:25px;}
.table1 .person {width:100%; height:200px; overflow-y:auto; padding:30px 4%; border:1px solid rgba(0,0,0,.1); font-size:15px; color:rgba(0,0,0,.5);}
.table1 input.check {width:16px; height:16px; display:inline-block;}
.table1 .check {padding:10px 0; font-size:17px;}
.table1 .alert {height:150px; background:url(/image/contact.png) no-repeat 5% top, url(/image/alert_bg.png) repeat-x center bottom; padding:65px 0 0 22%; font-size:20px; font-weight:300; line-height:1.3;}
.table1 .star {color:#ff6567; font-size:9px;}
.table1 .txt {padding:50px 0 5px 0; background:url(/image/pat.png) repeat-x bottom; text-align:right; font-size:12px; color:#6d6d6d;}
.table1 .th {padding:30px 0 0 0; font-size:15px; font-weight:500;}
.table1 .td {height:50px; line-height:50px;}
.table1 input {width:100%; height:50px; padding:0 0 0 15px; border:1px solid rgba(0,0,0,.1);}
.table1 textarea {width:100%; height:300px; padding:15px; border:1px solid rgba(0,0,0,.1);}
.table1 .btnOk {width:250px; margin:0 2px; padding:15px 0; background:#ff6567; font-size:17px; border-radius:4px; text-align:center; color:#fff; display:inline-block;}
.table1 .btnCan {width:150px; margin:0 2px; padding:10px 0; background:#fff; border:1px solid #ddd; border-radius:3px; text-align:center; display:inline-block;}
.table1 select {width:100%; height:50px; background:url(/image/ico_arrow_01.png) no-repeat right 20px center; padding:0 20px; border:1px solid rgba(0,0,0,.1);}
.table1 select option {}
.centerWrap {margin:50px auto; text-align:center; }
.cLine {display:block;}

@media all and (max-width:980px) {
	.table1 {width:90%;}
	.table1 .tit2 {padding:60px 0 0 0; font-size:22px;}
	.table1 .alert {padding:65px 0 0 25%; font-size:18px;}
}

@media all and (max-width:780px) {
	.table1 {padding:40px 0;}
	.table1 .alert {padding:65px 0 0 28%; font-size:15px;}
}


@media all and (max-width:680px) {
	.table1 .tit2 {padding:50px 0 0 0; font-size:20px;}
	.table1 .alert {height:125px; padding:50px 4% 0 135px; background-size:100px auto, auto 120px; word-break:break-all;}
	.table1 .check {font-size:14px;}
	.cLine {display:inline;}
}

@media all and (max-width:560px) {
	.table1 {padding:30px 0;}
	.table1 .alert {font-size:14px;}
}


@media all and (max-width:480px) {
	.table1 {padding:20px 0;}
	.table1 .tit2 {padding:50px 0 0 0; font-size:18px;}
	.table1 .alert {padding:50px 4% 0 115px; font-size:13px; background:url(/image/contact.png) no-repeat 4% 10px, url(/image/alert_bg.png) repeat-x center bottom; background-size:90px auto, auto 120px;}
}




/* 보도자료 */
.comDoc {width:1200px; height:auto; margin:-125px auto 100px; overflow:hidden;}
.preBox {float:left; width:32%; background:#fff; margin:0 2% 2% 0; padding:40px 35px 35px 35px; border:1px solid #ddd;}
.preBox.bo {padding:20px 20px 25px 20px;}
.preBox .pic {width:100%; height:200px; overflow:hidden; }
.preBox .pic img {width:100%; height:auto;}
.preBox .sort {font-size:14px; color: #d22027; font-weight:500;}
.preBox .tit {padding:15px 5px; font-size:20px; font-weight:500; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.preBox .date {padding:20px 5px 0 5px; font-size:13px; color:#ccc;}
.preBox .cont {height:60px; padding:0 5px; color:#757575; font-size:14px; font-weight:300; word-break:break-all; overflow:hidden; }
.preBox:nth-child(3n+3) {margin:0 0 2% 0;}

@media all and (max-width:1300px) {
	.comDoc {width:90%;}
	.preBox .pic img {width:auto; height:100%;}
	
}

@media all and (max-width:1100px) {
	.preBox.bo {padding:15px 15px 20px 15px;}
	.preBox .pic {height:180px;}
	.preBox .pic img {width:auto; height:100%;}
	.preBox .tit {font-size:18px;}
	.preBox .cont {height:55px; font-size:13px;}
}

@media all and (max-width:1000px) {
	.comDoc {margin:-70px auto 100px;}
}

@media all and (max-width:860px) {
	.comDoc {width:95%; margin:-85px auto 100px;}
	.preBox .pic {height:145px;}
}

@media all and (max-width:768px) {
	.comDoc {margin:-70px auto 100px;}
}

@media all and (max-width:640px) {
	.preBox {width:49.5%; margin:0 1% 1% 0;}
	.preBox:nth-child(2n+2) {margin:0 0 1% 0;}
	.preBox:nth-child(3n+3) {margin:0 1% 1% 0;}

	.preBox .pic {height:150px;}
	.preBox .pic img {width:100%; height:auto;}
}

@media all and (max-width:580px) {
	.preBox.bo {padding:15px 15px 20px 15px;}
	.preBox .pic {height:130px; }
	.preBox .pic img {width:auto; height:105%;}
	.preBox .tit {font-size:16px;}
}

@media all and (max-width:480px) {
	.comDoc {width:75%;}
	.preBox {float:none; width:100%; margin:0 0 10px 0;}
	.preBox:nth-child(2n+2) {margin:0 0 10px 0;}
	.preBox:nth-child(3n+3) {margin:0 0 10px 0;}
	.preBox .pic {height:160px;}
	.preBox .pic img {width:100%; height:auto;}
}

@media all and (max-width:400px) {
	.comDoc {width:85%;}
	.preBox {}
}


.view {width:100%; border-top:2px solid #000;}
.view .vTop {padding:60px 5% 40px 5%; overflow:hidden; border-bottom:1px solid #ddd;}
.view .vTop .vLeft {float:left; width:87%; border-right:1px solid #e5e5e5;}
.view .vTop .vRight {float:right; width:13%; padding:0 0 0 3%; line-height:1.2; text-align:right; }
.view .vTop .sort {font-size:14px; color:#d22027; font-weight:500;}
.view .vTop .vLeft strong {font-size:26px; font-weight:500; }
.view .vTop .date {font-size:17px; color:#666;}
.view .vTop .vRight strong {color:#000; font-size:38px; font-weight:300;}
.view .vMid {padding:60px 5%; font-weight:300; line-height:1.8; border-bottom:1px solid #ddd;}
.view .vMid img {margin:40px auto; min-width:auto; height:auto; max-width:100%; display:block;}
.view .btnList {clear:both; width:150px; background:#222; margin:30px auto 50px auto; padding:10px 0; border-radius:3px; text-align:center; color:#fff; font-size:15px; font-weight:500; display:inline-block;}

@media all and (max-width:1300px) {
	.view .vTop {padding:50px 4% 40px 4%;}
	.view .vTop .vLeft strong {font-size:24px; }
	.view .vTop .date {font-size:15px; }
	.view .vTop .vRight strong {font-size:31px; }
}

@media all and (max-width:1100px) {
	.view .vTop {padding:40px 4% 30px 4%;}
	.view .vTop .vLeft strong {font-size:21px; }
	.view .vTop .vRight strong {font-size:26px; }

	.view .vMid {padding:50px 4%;}
}

@media all and (max-width:860px) {
	.view .vTop .vLeft strong {font-size:18px; }
	.view .vTop .date {font-size:13px; }
	.view .vTop .vRight strong {font-size:24px; }

	.view .vMid {padding:40px 4%; font-size:15px;}
}

@media all and (max-width:790px) {
	.view .vTop .sort {font-size:12px;}
	.view .vTop .date {font-size:12px; }
	.view .vTop .vRight {padding:8px 0 0 3%;}
	.view .vTop .vRight strong {font-size:20px; }

	.view .vMid {padding:30px 3%;}
}

@media all and (max-width:660px) {
	.view .vTop {padding:30px 4% 10px 4%;}
	.view .vTop .vLeft {float:none; width:100%; border-right:0;}	
	.view .vTop .vRight {float:none; width:100%; padding:15px 0 0 0;}
	.view .vTop .date {display:inline; font-size:14px; }
	.view .vTop .vRight strong {display:inline; font-size:14px; }

}

@media all and (max-width:480px) {
}


/* 트러스트키 */
.midTit2 {width:890px; height:105px; background:url(/image/com_left.png) no-repeat left center, url(/image/com_right.png) no-repeat right center; margin:-50px auto 100px auto; padding:0 50px; text-align:center; font-size:53px; font-weight:600; line-height:1.1; }
.tWrap {position:relative; width:100%; padding:0 0 100px 0;}
.tWrap .tBg {position:absolute; bottom:360px; width:100%; height:75%; background:#f8f8f8; z-index:-1;}
.tWrap .inner {width:1240px; margin:0 auto; }
.tWrap .inner img {width:auto; height:auto; box-shadow:0 20px 30px rgba(0,0,0,.2);}
.tWrap .inner .left {float:left; width:50%;}
.tWrap .inner .right {float:right; width:50%; text-align:right;}
.tWrap .inner .cont {clear:both; width:80%; margin:100px auto; }
.tWrap .inner .cont ul {margin:0 0 30px 0; overflow:hidden;}
.tWrap .inner .cont ul li {float:left; font-size:25px; font-weight:300; word-break:break-all; }
.tWrap .inner .cont ul li:first-child {width:12%; color:#e94c4c; font-weight:600; font-family:"Metropolis-Bold";}
.tWrap .inner .cont ul li:last-child {width:78%; }
.tWrap .map {width:1240px; height:525px; margin:90px auto; box-shadow:0 20px 30px rgba(0,0,0,.12);}
.tWrap .map .guide {width:80%; margin:40px auto; padding:10px 60px; background:url(/image/icon_map.png) no-repeat left 13px; font-size:20px;}

@media all and (max-width:1600px) {
	.midTit2 {font-size:45px;}
}

@media all and (max-width:1300px) {
	.midTit2 {font-size:40px;  margin:-60px auto 70px auto;}
	.tWrap .inner {width:90%;}
	.tWrap .inner img {width:98%; }

	.tWrap .inner .cont {width:85%; margin:80px auto;}
	.tWrap .inner .cont ul li {font-size:21px;}
	.tWrap .inner .cont ul li:last-child {width:85%;}

	.tWrap .map {width:90%;}
}

@media all and (max-width:1000px) {
	.midTit2 {width:70%; margin:-60px auto 50px auto; background-size:auto 80px; padding:15px 30px 0 30px; font-size:35px; }
	.tWrap .inner .cont ul li {font-size:18px;}
	.tWrap .inner .cont ul li:last-child {width:88%;}

	.tWrap .map .guide {padding:10px 0 0 60px; font-size:17px;}
}

@media all and (max-width:860px) {
	.midTit2 {width:75%; margin:-60px auto 40px auto; font-size:31px; }
	.tWrap .inner .cont {width:95%; }
	.tWrap .inner .cont ul li {font-size:17px;}
	
	.tWrap .map {height:400px;}
	.tWrap .map .guide {width:90%;}
}

@media all and (max-width:768px) {
	.tWrap .map .guide {width:85%; background:url(/image/icon_map.png) no-repeat left top; background-size:30px auto; padding:0 0 0 40px; font-size:14px;}
	.tWrap .tBg {height:80%;}
}

@media all and (max-width:690px) {
	.midTit2 {width:80%; background-size:auto 70px; padding:25px 30px 0 30px; font-size:28px;}
	.tWrap .inner {width:70%;}
	.tWrap .inner img {width:100%; }
	.tWrap .inner .left {float:none; width:100%; height:270px; overflow:hidden;}
	.tWrap .inner .right {float:none; width:100%; height:270px; margin:10px 0 0 0; overflow:hidden;}

	.tWrap .inner .cont {width:100%; margin:50px auto 80px auto; }
	.tWrap .inner .cont ul {margin:0 0 20px 0;}
	.tWrap .inner .cont ul li  {font-size:16px;}
}

@media all and (max-width:610px) {
	.tWrap .map .guide {width:100%;}
}

@media all and (max-width:540px) {
	.midTit2 {width:90%; margin:-60px auto 0 auto; font-size:25px;}
	.tWrap .inner .left {height:230px;}
	.tWrap .inner .right {height:230px;}

	.tWrap .inner .cont {width:100%; margin:30px auto 80px auto; }
	.tWrap .inner .cont ul li  {font-size:14px;}

	.tWrap .tBg {height:77%;}
}

@media all and (max-width:460px) {
	.midTit2 {width:85%; background-size:auto 60px; font-size:21px;}
	.tWrap .inner {width:85%;}
	.tWrap .inner .left {height:210px;}
	.tWrap .inner .right {height:210px;}
	.tWrap .map .guide {background-size:20px auto; font-size:13px; padding:0 0 7px 30px;}
}

.inWrap {width:1300px; margin:50px auto 90px auto; overflow:hidden;}
.inWrap .left {float:left; width:645px; overflow:hidden; }
.inWrap .left .lTop {width:100%; height:376px; background:url(/image/block01.jpg) no-repeat center center; background-size:100%;}
.inWrap .left .lTop:hover {background-size:110%;}
.inWrap .left .lBottom01 {float:left; width:317px; height:188px; margin:10px 0 0 0; background:url(/image/block02.jpg) no-repeat center center; background-size:100%;}
.inWrap .left .lBottom01:hover {background-size:110%;}
.inWrap .left .lBottom02 {float:right; width:317px; height:188px; margin:10px 0 0 0; background:url(/image/block03.jpg) no-repeat center center; background-size:100%;}
.inWrap .left .lBottom02:hover {background-size:110%;}

.inWrap .right {float:right; width:645px; overflow:hidden;}
.inWrap .right .rTop {float:left; width:317px; height:376px; background:url(/image/block04.jpg) no-repeat center center; background-size:100%;}
.inWrap .right .rTop:hover {background-size:110%;}
.inWrap .right .rBottom {float:left; width:317px; height:188px; margin:10px 0 0 0;  background:url(/image/block05.jpg) no-repeat center center; background-size:100%;}
.inWrap .right .rBottom:hover {background-size:110%;}
.inWrap .right .rRight {float:right; width:317px; height:574px; background:url(/image/block06.jpg) no-repeat center center; background-size:100%;}
.inWrap .right .rRight:hover {background-size:110%;}

.inWrap .txt {padding:45px 0 0 45px; font-size:25px; font-weight:400; line-height:1.2;}
.inWrap .txtW {padding:45px 0 0 45px; font-size:25px; font-weight:400; line-height:1.2; color:#fff;}


@media all and (max-width:1300px) {
	.inWrap {width:90%;}
	.inWrap .left {width:49.5%;}
	.inWrap .left .lTop {height:330px; background-size:111%;}
	.inWrap .left .lBottom01 {width:49%; height:150px; background-size:111%;}
	.inWrap .left .lBottom02 {width:49%; height:150px; background-size:111%;}

	.inWrap .right {width:49.5%; }
	.inWrap .right .rTop {width:49%; height:330px; background-size:111%;}
	.inWrap .right .rBottom {width:49%; height:150px;  background-size:111%;}
	.inWrap .right .rRight {width:49%; height:490px;  background-size:111%;}

	.inWrap .txt {padding:35px 0 0 35px; font-size:22px;}
	.inWrap .txtW {padding:35px 0 0 35px; font-size:22px;}
}

@media all and (max-width:1150px) {
	.inWrap .left .lTop {height:300px; }
	.inWrap .left .lBottom01 {height:140px; }
	.inWrap .left .lBottom02 {height:140px;}

	.inWrap .right .rTop {height:300px;}
	.inWrap .right .rBottom { height:140px; }
	.inWrap .right .rRight {height:450px;}
}

@media all and (max-width:1050px) {
	.inWrap {width:95%;}
	.inWrap .left .lTop {height:270px; }
	.inWrap .left .lBottom01 {height:130px; }
	.inWrap .left .lBottom02 {height:130px;}

	.inWrap .right .rTop {height:270px;}
	.inWrap .right .rBottom { height:130px; }
	.inWrap .right .rRight {height:410px;}

	.inWrap .txt {padding:25px 0 0 25px; font-size:20px;}
	.inWrap .txtW {padding:25px 0 0 25px; font-size:20px;}
}

@media all and (max-width:890px) {
	.inWrap {width:80%;}
	.inWrap .left {float:none; width:100%;}
	.inWrap .left .lTop {height:300px; }
	.inWrap .left .lBottom01 {height:140px; }
	.inWrap .left .lBottom02 {height:140px;}

	.inWrap .right {clear:both; float:none; width:100%; margin:10px 0 0 0;}
	.inWrap .right .rTop {height:300px;}
	.inWrap .right .rBottom { height:140px; }
	.inWrap .right .rRight {height:450px;}
}

@media all and (max-width:580px) {
	.inWrap .left .lTop {height:230px; }
	.inWrap .left .lBottom01 {height:130px; }
	.inWrap .left .lBottom02 {height:130px;}

	.inWrap .right .rTop {height:230px;}
	.inWrap .right .rBottom { height:130px; }
	.inWrap .right .rRight {height:370px;}
}

@media all and (max-width:520px) {
	.inWrap {width:90%;}
}

@media all and (max-width:460px) {
	.inWrap .left .lTop {height:200px; background-size:115%;}
	.inWrap .left .lBottom01 {height:120px; background-size:115%;}
	.inWrap .left .lBottom02 {height:120px; background-size:115%;}

	.inWrap .right .rTop {height:200px; background-size:115%;}
	.inWrap .right .rBottom { height:120px; background-size:115%;}
	.inWrap .right .rRight {height:330px; background-size:115%;}
	
	.inWrap .txt {font-size:18px;}
	.inWrap .txtW {font-size:18px;}
}

@media all and (max-width:410px) {
	.inWrap .left .lTop {height:180px; background-size:auto 110%;}
	.inWrap .left .lBottom01 {background-size:auto 110%;}
	.inWrap .left .lBottom02 { background-size:auto 110%;}

	.inWrap .right .rTop {height:180px; background-size:auto 110%;}
	.inWrap .right .rBottom {background-size:auto 110%;}
	.inWrap .right .rRight {height:310px; background-size:auto 110%;}
}


/* 구매하기 */
.buyWrap {width:1200px; background:#fff; margin:-100px auto 200px auto; padding:80px 5%;}
.buyWrap .tit {padding:0 0 5px 0; font-size:40px; font-weight:300; letter-spacing:-1.5px;}
.buyWrap .online {width:100%; margin:0 0 80px 0; padding:50px 0 40px 0; border:1px solid #dfdfdf; overflow:hidden;}
.buyWrap .online ul {float:left; width:25%; border-left:1px solid #dfdfdf;}
.buyWrap .online ul:first-child {border-left:0; }
.buyWrap .online .icon {width:100%; height:140px;}
.buyWrap .online ul li {text-align:center; font-size:15px; font-weight:600; line-height:1.2;}
.buyWrap .online ul li strong {font-size:20px; font-weight:300;}

.buyWrap .online .icon011 {background:url(/image/store01.png) no-repeat center top; background-size:150px auto;}
.buyWrap .online .icon021 {background:url(/image/store02.png) no-repeat center top; background-size:150px auto; }
.buyWrap .online .icon031 {background:url(/image/store03.png) no-repeat center top; background-size:150px auto; }
.buyWrap .online .icon041 {background:url(/image/store04.png) no-repeat center top; background-size:150px auto; }
.buyWrap .online .icon051 {background:url(/image/store05.png) no-repeat center top; background-size:150px auto; }
.buyWrap .online .icon061 {background:url(/image/store06.png) no-repeat center top; background-size:150px auto; }

.buyWrap .ask {width:100%; border:1px solid #dfdfdf; overflow:hidden;}
.buyWrap .ask ul {float:left; width:50%; height:;} 
.buyWrap .ask ul li {margin-bottom:25px;}
.buyWrap .ask ul a {text-decoration:underline;}
.buyWrap .ask ul a:hover {color:#d22027;}
.buyWrap .ask ul.left {padding:60px; font-size:18px; }
.buyWrap .ask ul.right {height:100%; height:785px; background:url(/image/store05_1.jpg) no-repeat; background-size:cover;}

.buyWrap .sTit {font-size:25px; font-weight:600;}
.buyWrap input {width:100%; height:60px; margin-bottom:50px; padding:0 15px; color:#000; border:2px solid #bdbdbd; border-radius:5px;}
.buyWrap input::placeholder {color:rgba(0,0,0,.25) !important;}

.buyWrap .symbolBox {width:100%; overflow:hidden;}
.buyWrap a.sBox {float:left; width:32%; height:180px; margin:20px 0 0 2%; padding:30px; border:1px solid rgba(0,0,0,.2); border-radius:5px;}
.buyWrap a.sBox:nth-child(3n+1) {margin:20px 0 0 0;}
.buyWrap a.sBox:hover {border:1px solid #222; transition:all 1s;}
.buyWrap a.sBox .symbol {height:40px;}
.buyWrap a.sBox .symbol img {width:auto; height:100%;}
.buyWrap a.sBox .content {padding-top:20px; font-size:20px; line-height:1.2; word-break:break-all;}

.buyWrap .sBoxVod {float:left; width:50%; height:285px; border:1px solid rgba(0,0,0,.2); border-radius:5px; overflow:hidden;} 
.buyWrap .sBoxVod iframe {width:100%; height:100%;}
.buyWrap .sBoxCon {float:right; width:45%; min-height:285px; margin-bottom:50px;} 
.buyWrap .sBoxCon .symbol {height:49px;}
.buyWrap .sBoxCon .symbol img {width:auto; height:100%;}
.buyWrap .sBoxCon .text {padding-top:20px; font-size:15px; line-height:1.4;}
.buyWrap .sBoxCon .btnIns {height:36px; background:#f7f7f7; margin-top:20px; padding:0 15px; line-height:36px; font-size:13px; font-weight:600; letter-spacing:0.2px; cursor:pointer; border:1px solid #bdbdbd; border-radius:3px; display:inline-block;}

.buyWrap .deBox {width:100%; background:#f7f7f7;  padding:35px 35px 10px 35px; font-size:14px; color:rgba(0,0,0,.7); border-radius:5px; overflow:hidden;}
.buyWrap .deBox strong {font-size:16px; font-weight:600; color:#000; } 
.buyWrap .deBox ul {}
.buyWrap .deBox ul li {margin-bottom:20px; letter-spacing:0;}

.buyWrap .blogBox {position:relative; width:100%; height:300px; margin-bottom:45px; border:1px solid #cfcfcf; border-radius:5px; overflow:hidden;}
.buyWrap .blogBox:hover {border:1px solid #222; box-shadow:0 15px 20px rgba(0,0,0,.1); transition:all 0.6s;}
.buyWrap .blogBox .picture {position:absolute; float:left; width:50%; height:100%; overflow:hidden; }
.buyWrap .blogBox .picture img {position:absolute; left:50%; transform:translateX(-50%); width:auto; height:100%; border-radius:5px;}
.buyWrap .blogBox .content {position:relative; float:right; width:48%; height:300px; padding:28px 28px 28px 10px; word-break:break-all; }
.buyWrap .blogBox .content .bTop {}
.buyWrap .blogBox .content .bTop .hash span {margin-right:10px; font-size:14px; font-weight:600;}
.buyWrap .blogBox .content .bTop .date {padding:3px 10px 0px 10px; font-size:11px !important; font-weight:300 !important; border:1px solid rgba(0,0,0,.2); border-radius:4px; display:inline-block;}
.buyWrap .blogBox .content .bTitle {max-height:57px; margin:17px 0; font-size:24px; line-height:1.2; font-weight:600;  overflow:hidden;}
.buyWrap .blogBox .content .textArea {max-height:85px; font-size:14px; font-weight:300; color:rgba(0,0,0,.8); line-height:1.5; overflow:hidden; }
.buyWrap .blogBox .content .btnMore {position:absolute; bottom:20px; right:28px; text-align:right; font-size:12px; font-weight:600; letter-spacing:0.5px;}

.blogContent {width:100%; }
.blogContent .bTitle {margin:25px 0; font-size:30px; line-height:1.2; font-weight:600; word-break:break-all;}
.blogContent .hash {padding:0px 0 15px 0; text-align:right;}
.blogContent .hash span {margin-right:10px; font-size:14px; font-weight:600;}
.blogContent .date {padding:3px 10px 0px 10px; font-size:11px !important; font-weight:300 !important; border:1px solid rgba(0,0,0,.2); border-radius:4px; display:inline-block;}
.blogContent .picture {width:100%; overflow:hidden; }
.blogContent .picture img {width:100%; border-radius:5px;}
.blogContent .textArea {padding:20px 0 0 0; font-size:17px; font-weight:400; color:rgba(0,0,0,.8); line-height:1.6;}
.blogContent .bWrap {margin:70px 0 0 0; text-align:center;}
.blogContent .btnList {padding:10px 50px; text-align:center; font-size:14px; font-weight:600; letter-spacing:0.5px; border:1px solid rgba(0,0,0,.2); border-radius:3px; display:inline-block;}


@media all and (max-width:1200px) {
	.buyWrap {width:100%;}
	.buyWrap .tit {font-size:35px;}
	.buyWrap .online {padding:40px 0 30px 0;}
	.buyWrap .online .icon {height:120px;}
	.buyWrap .online ul li {font-size:14px;}
	.buyWrap .online ul li strong {font-size:18px;}

	.buyWrap .online .icon011 {background-size:120px auto;}
	.buyWrap .online .icon021 {background-size:120px auto; }
	.buyWrap .online .icon031 {background-size:120px auto; }
	.buyWrap .online .icon041 {background-size:120px auto; }
	
	.buyWrap .ask ul {height:700px;}
	.buyWrap .ask ul.left {padding:50px 4%; font-size:17px;}
	.buyWrap .ask ul.right {height:700px;}
}


@media all and (max-width:960px) {
	.buyWrap {margin:-60px auto 80px auto; padding:50px 5%;}
	.buyWrap .tit {font-size:30px;}
	.buyWrap .online {padding:40px 0 30px 0;}
	.buyWrap .online .icon {height:100px;}
	.buyWrap .online ul {padding:0 3%;}
	.buyWrap .online ul li {font-size:13px;}
	.buyWrap .online ul li strong {font-size:16px;}

	.buyWrap .online .icon011 {background-size:90px auto;}
	.buyWrap .online .icon021 {background-size:90px auto; }
	.buyWrap .online .icon031 {background-size:90px auto; }
	.buyWrap .online .icon041 {background-size:90px auto; }

	.buyWrap .ask ul {height:auto;}
	.buyWrap .ask ul.left {float:none; width:100%; padding:30px 8%; font-size:15px;}
	.buyWrap .ask ul.right {display:none; width:40%; height:auto; background-size:auto 105%;}
	
	.buyWrap .sTit {font-size:21px;}
	.buyWrap input {height:50px; font-size:14px;}
	.buyWrap a.sBox .symbol {height:35px;}
	.buyWrap a.sBox .content {font-size:18px;}
	
	.buyWrap .sBoxVod {height:250px;}
	.buyWrap .sBoxCon {min-height:250px; margin-bottom:30px; }
	.buyWrap .sBoxCon .symbol {height:38px;}
	.buyWrap .sBoxCon .text {font-size:13px;}
}

@media all and (max-width:768px) {
	.buyWrap .tit {font-size:25px;}
	.buyWrap .online {padding:30px 0 20px 0;}
	.buyWrap .online ul li strong {font-size:15px;}

	.buyWrap .ask ul {}
	.buyWrap .ask ul.left {padding:30px 8% 20px 8%; font-size:14px;}
	.buyWrap .ask ul.right {}
	
	.buyWrap a.sBox {padding:25px;}
	.buyWrap a.sBox .symbol {height:30px;}
	.buyWrap a.sBox .content {font-size:16px;}

	.buyWrap .sBoxVod {height:220px;}
	.buyWrap .sBoxCon {min-height:auto;}

	.buyWrap .deBox {font-size:13px;}
	.buyWrap .deBox strong {font-size:15px;}

	.buyWrap .blogBox {height:auto;}
	.buyWrap .blogBox .picture {position:relative; float:none; width:105%; height:auto;}
	.buyWrap .blogBox .picture img {position:relative; width:100%; height:auto; transform:0; border-radius:0;}
	.buyWrap .blogBox .content {float:none; width:100%; height:auto; padding:28px; }
	.buyWrap .blogBox .content .bTop {}
	.buyWrap .blogBox .content .bTitle {margin:25px 0; font-size:20px; }
	.buyWrap .blogBox .content .textArea {max-height:80px; font-size:13px;}
	.buyWrap .blogBox .content .btnMore {position:static; margin-top:10px;}

	.blogContent .bTitle {font-size:25px;}
	.blogContent .textArea {font-size:14px;}
}

@media all and (max-width:620px) {
	.buyWrap .online {padding:0;}
	.buyWrap .online ul {width:50%; padding:0 2% 3% 2%;}
	.buyWrap .online ul:nth-child(1) {border-bottom:1px solid #dfdfdf;}
	.buyWrap .online ul:nth-child(2) {border-bottom:1px solid #dfdfdf;}
	.buyWrap .online ul:nth-child(3) {border-left:0px solid #dfdfdf;}

	.buyWrap .online .icon011 {background:url(/image/store01.png) no-repeat center center;  background-size:90px auto;}
	.buyWrap .online .icon021 {background:url(/image/store02.png) no-repeat center center; background-size:90px auto;}
	.buyWrap .online .icon031 {background:url(/image/store03.png) no-repeat center center; background-size:90px auto;}
	.buyWrap .online .icon041 {background:url(/image/store04.png) no-repeat center center; background-size:90px auto;}

	.buyWrap .ask ul.left {float:none; width:100%; padding:35px 8% 25px 8%; }
	.buyWrap .ask ul.right {float:none; width:100%; height:180px; background:url(/image/store05.jpg) no-repeat center center; background-size:100% auto;}

	.buyWrap .sTit {font-size:18px;}
	.buyWrap input {height:45px; margin-bottom:30px; font-size:13px;}
	.buyWrap a.sBox {width:49%; height:150px; margin:15px 0 0 2%;}
	.buyWrap a.sBox:nth-child(2n+1) {margin:15px 0 0 0 !important;}
	.buyWrap a.sBox:nth-child(6n+1) {margin:15px 0 0 0 !important;}
	.buyWrap a.sBox:nth-child(3n+1) {margin:15px 0 0 2%; }
	
	.buyWrap .sBoxVod {float:none; width:100%; height:240px;}
	.buyWrap .sBoxCon {float:none; width:100%; margin-top:20px;}
	.buyWrap .sBoxCon .symbol {height:35px;}
	.buyWrap .sBoxCon .text {padding-top:10px;}
	.buyWrap .sBoxCon .btnIns {height:33px; font-size:12px; line-height:33px;}

	.buyWrap .deBox {padding:25px 25px 10px 25px;}	

	.buyWrap .blogBox .picture {height:auto;}
}

@media all and (max-width:520px) {
	.buyWrap a.sBox .symbol {height:25px;}
	.buyWrap a.sBox .content {font-size:14px;}
	
	.buyWrap .deBox {padding:25px 35px 10px 35px;}
	.buyWrap .deBox ul {float:none; width:100%;}
}

@media all and (max-width:460px) {
	.buyWrap .tit {font-size:24px;}
	.buyWrap .online ul li strong {font-size:14px;}
	.buyWrap .ask ul.left {font-size:13px;}
	
	.buyWrap .sTit {font-size:16px;}
	.buyWrap a.sBox {height:130px; padding:20px;}

	.buyWrap .sBoxVod {height:200px;}
	.buyWrap .blogBox .content .bTop .hash span {font-size:13px;}

	.blogContent .bTitle {font-size:22px;}
	.blogContent .hash span {font-size:12px;}
}

@media all and (max-width:420px) {
	.buyWrap a.sBox .content {font-size:13px;}
	.buyWrap .blogBox .content .bTitle {max-height:47px;}
	.buyWrap .blogBox .content {padding:20px;}
	.blogContent .textArea {font-size:13px;}
}


.innerHtml {display:none;}
/* #mask {position:absolute; overflow:hidden; z-index:9000; top:0; left:0; background:#000; text-align:center; display:none;} */
#pop {display:none; overflow:hidden; padding:10px; position:absolute; margin:0 auto; z-index:9999; background:#fff; border-radius:7px; text-align:center; top:50%; left:50%; transform: translate(-50%, -50%);}
#pop1 {display:none; overflow:hidden; padding:10px; position:absolute; margin:0 auto; z-index:9999; background:#fff; border-radius:7px; text-align:center; transform: translate(0, 0);}

iframe.i500 {width:500px; height:500px;}
.size450 {width:450px; height:450px;}

@media all and (max-width:500px) {
	iframe.i500 {width:100%; height:auto; height:500px;}
}

@media all and (max-width:450px) {
	#pop img {width:100%; height:auto;}
}

.close-button {
	float: right;
	width: 1.5rem;
	line-height: 1.5rem;
	text-align: center;
	cursor: pointer;
	border-radius: 50%;
	font-size:0;
	background:url(/image/icon_close.png) no-repeat center center;
}

