@charset "utf-8";

/* layout */
html,body {height:100% }
#warp { width:100%; /*padding-bottom:80px;*/ }
.vsBg { background:url(../img/vs_bg.jpg) no-repeat center top; }

/* Head */
#head {width:100%; z-index:20;}
.headWrap { width:1355px; margin:0 auto; height:100px; }
.headWrap img { width: 100%; }
.headWrap h1 { float:left; padding-top:20px; }
.headTop { float:right; position:relative; text-align:right; padding-top:30px; }
.headTop ul { float:right; }
.headTop ul li { float:left; }
.headTop ul li:last-child { margin-right:0; }
.gnbWrap { width: 1355px; border-top-style:solid; border-top-width:15px; }
.gnb { margin:0 auto; height:110px; display:table; width:1000px; padding:0 0; }
.gnb li { width:210px; display:table-cell; height:100px; }
.gnb li a { width:225px; height:70px; padding:28px 0 0 46px; display:block; }
.gnb li a.sub1 { background:#374654; }
.gnb li a.sub2 { background:#94b75e; }
.gnb li a.sub3 { background:#622a80; }
.gnb li a.sub4 { background:#feb356; }
.gnb li a.sub5 { background:#00b9b3; }
.gnb li .dapth2 { height:30px; padding-left:20px; overflow:hidden; line-height:35px; }
.gnb li .dapth2.on1 { background:#171d20; }
.gnb li .dapth2.on2 { background:#596d37; }
.gnb li .dapth2.on3 { background:#331844; }
.gnb li .dapth2.on4 { background:#a37030; }
.gnb li .dapth2.on5 { background:#307472; }
.sub1 { border-color:#374654; margin: 0 auto;}
.sub2 { border-color:#94b75e; margin: 0 auto;}
.sub3 { border-color:#622a80; margin: 0 auto;}
.sub4 { border-color:#feb356; margin: 0 auto;}
.sub5 { border-color:#00b9b3; margin: 0 auto;}

/* main */
.mainWrap {height:100%; text-align:center; display:table-cell; vertical-align:middle; }
.mainWrap img { margin:auto; position:absolute; left:0; right:0; top:0; bottom:0; }

/* sub */
#subWrap { width:100%; }
.prevWrap { position:absolute; left:150px; height: 530px; top:0px; }
.nextWrap { position:absolute; right:150px; height: 530px; top:0px; }
.prevWrap a, .nextWrap a { height:466px; display:block; }
.prevWrap img, .nextWrap img { margin-top:210px; cursor: pointer; }
.contentWrap { text-align:center; position:relative; margin:0 auto; height:610px;}
.bottomBtn { overflow:hidden; text-align:center; margin:0 auto 0 auto; clear:both; padding-top:20px; }
.bottomBtn img { display:inline-block; margin-right:5px; }

.contentWrap02 { width:1355px; margin:0 auto; overflow:hidden; position:relative; }

.vsMain { width:802px; margin:150px auto 0 auto; }
.vsMain li { float:left; margin-right:20px; line-height:0; margin-bottom:20px; }

.vsContent { width:1300px; height:625px; margin:0 auto; overflow:hidden; }
.vsContent .leftWrap { width:590px; float:left; position:relative; top:35px; }
.vsContent .leftWrap .line1 { position:absolute; top:162px; left:0; width:392px; height:100px; margin-top:40px; width:600px;}
.vsContent .leftWrap .line1 span.text1 { font:normal 15px "Open Sans"; color:#d6d6d6; display:block; word-break: keep-all; letter-spacing: normal; line-height: normal; text-align: left; }
.vsContent .leftWrap .line1 span.text2 { font:normal 15px "Open Sans"; color:#d6d6d6; display:block; word-break: keep-all; letter-spacing: normal; line-height: normal; text-align: left; margin-top:10px; }
.vsContent .leftWrap .line2 { width:400px; position:absolute; top:270px; left:0; display:table; }
.vsContent .leftWrap .line2 li { display:table-cell; }
.vsContent .leftWrap .line2 li div { width:110px; height:64px; padding:8px 8px; color:#fff; font:normal 14px/16px "Open Sans"; letter-spacing:-0.5px; vertical-align:top; margin-bottom:10px; }
.vsContent .leftWrap .line2 li div.org { background-color:rgba(246,163,28, 0.8); }
.vsContent .leftWrap .line2 li div.green { background-color:rgba(0,170,163, 0.8); }
.vsContent .leftWrap .line2 li div.purple { background-color:rgba(32,26,86, 0.8); }
.vsContent .leftWrap .line2 li span { font:normal 9px/11px "Open Sans"; color:#c0c0c0; display:block; letter-spacing:-0.5px; display:block; width:128px; word-break: keep-all; overflow:hidden; }
.vsContent .leftWrap .tabDn { position:absolute; right:0; top:0; margin-right: -190px; }
.vsContent .rightWrap { width:505px; height:500px; float:right; position:relative; top:35px; }
.vsContent.content1, .vsContent.content2, .vsContent.content3, .vsContent.content4, .vsContent.content5, .vsContent.content6, .vsContent.content7, .vsContent.content8 { width: 1390px; height: 720px; }

.tabWrap li { width:34px; height:42px; }
.tabWrap li a { display:block; width:34px; height:42px; text-indent:9999px; }
.tabWrap li.btnA { background:url(../img/vertical/tab_a.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnB { background:url(../img/vertical/tab_b.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnC { background:url(../img/vertical/tab_c.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnD { background:url(../img/vertical/tab_d.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnE { background:url(../img/vertical/tab_e.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnF { background:url(../img/vertical/tab_f.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnG { background:url(../img/vertical/tab_g.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnH { background:url(../img/vertical/tab_h.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnI { background:url(../img/vertical/tab_i.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnJ { background:url(../img/vertical/tab_j.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnK { background:url(../img/vertical/tab_k.png) no-repeat 0 0; opacity: 0.7; }
.tabWrap li.btnA:hover, .tabWrap li.btnB:hover, .tabWrap li.btnC:hover, .tabWrap li.btnD:hover, .tabWrap li.btnE:hover, .tabWrap li.btnF:hover, .tabWrap li.btnG:hover, .tabWrap li.btnH:hover, .tabWrap li.btnI:hover, .tabWrap li.btnJ:hover, .tabWrap li.btnK:hover { opacity: 1.0; }
.tabWrap li.btnA.on, .tabWrap li.btnB.on, .tabWrap li.btnC.on, .tabWrap li.btnD.on, .tabWrap li.btnE.on, .tabWrap li.btnF.on, .tabWrap li.btnG.on, .tabWrap li.btnH.on, .tabWrap li.btnI.on, .tabWrap li.btnJ.on, .tabWrap li.btnK.on {
	background-position: 0 1px;
	opacity: 1.0;
	background-size: 33px;
}
.tabWrap li.btnA, .tabWrap li.btnB, .tabWrap li.btnC, .tabWrap li.btnD, .tabWrap li.btnE, .tabWrap li.btnF, .tabWrap li.btnG, .tabWrap li.btnH, .tabWrap li.btnI, .tabWrap li.btnJ, .tabWrap li.btnK {
	background-position: 0 -49px;
	opacity: 1.0;
	background-size: 40px;
}

.content1 .po1 { position:absolute; left:200px; top:216px; }
.content1 .po2 { position:absolute; right:98px; top:195px; }
.content1 .po3 { position:absolute; left:329px; top:222px; }
.content1 .po4 { position:absolute; left:308px; top:344px; }
.content1 .po5 { position:absolute; left:329px; bottom:55px; }
.content1 .po6 { position:absolute; left:245px; top:347px; }
.content1 .po7 { position:absolute; left:245px; bottom:37px; }
.content1 .po8 { position:absolute; left:298px; bottom:-101px; }
.content1 .po9 { position:absolute; left:194px; bottom:-62px; }
.content1 .p10 { position:absolute; left:161px; bottom:94px; }
.content1 .po2.on { top:180px; }
.content1 .po4.on { top:331px; }
.content1 .po5.on { bottom:67px; }
.content1 .po6.on { top:331px; }
.content1 .po7.on { left: 251px; bottom: 54px; }
.content1 .po8.on { left: 287px; bottom: -86px; }
.content1 .po9.on { bottom: -53px; }
.content1 .p10.on { left: 154px; bottom: 109px; }

.content2 .po1 { position:absolute; left:165px; top:190px; }
.content2 .po2 { position:absolute; left:206px; top:193px; }
.content2 .po3 { position:absolute; right:189px; top:145px; }
.content2 .po4 { position:absolute; left:150px; top:93px; }
.content2 .po5 { position:absolute; left:-28px; top:131px; }
.content2 .po6 { position:absolute; left:243px; top:76px; }
.content2 .po7 { position:absolute; left:85px; top:53px; }
.content2 .po8 { position:absolute; left:94px; top:207px; }
.content2 .po9 { position:absolute; right:58px; top:112px; }
.content2 .p10 { position:absolute; left:47px; top:190px; }
.content2 .p11 { position:absolute; left:230px; top:161px; }
.content2 .po1.on { left:167px; top:182px; }
.content2 .po2.on { left: 215px; top:188px; }
.content2 .po4.on { left: 138px; top:90px; }
.content2 .po5.on { left:-14px; top:122px; }
.content2 .po6.on { top:75px; }
.content2 .po7.on { left: 90px; top: 54px; }
.content2 .po8.on { left: 96px; top: 207px; }
.content2 .po9.on { top: 105px; }
.content2 .p10.on { left: 52px; top: 186px; }
.content2 .p11.on { left: 236px; top: 156px; }

.content3 .po1 { position:absolute; left:165px; top:34px; }
.content3 .po2 { position:absolute; left:138px; top:106px; }
.content3 .po3 { position:absolute; right:105px; top:128px; }
.content3 .po4 { position:absolute; left:199px; top:139px; }
.content3 .po5 { position:absolute; left:92px; top:119px; }
.content3 .po6 { position:absolute; left:-3px; top:117px; }
.content3 .po7 { position:absolute; left:65px; top:89px; }
.content3 .po8 { position:absolute; left:126px; top:50px; }
.content3 .po9 { position:absolute; right:250px; top:84px; }
.content3 .p10 { position:absolute; right:352px; top:269px; }
.content3 .po1.on { left:184px; top:28px; }
.content3 .po2.on { left:140px; top:101px; }
.content3 .po3.on { top:124px; }
.content3 .po4.on { left:202px; top:138px; }
.content3 .po5.on { left:97px; top:115px; }
.content3 .po6.on { left:-1px; top:114px; }
.content3 .po7.on { left:68px; top:86px; }
.content3 .po8.on { left:129px; top:46px; }
.content3 .po9.on { right:245px; top:81px; }
.content3 .p10.on { right:349px; top:266px; }

.content4 .po1 { position:absolute; left:81px; top:78px; }
.content4 .po2 { position:absolute; left:173px; top:111px; }
.content4 .po3 { position:absolute; right:283px; top:24px; }
.content4 .po4 { position:absolute; left:106px; top:63px; }
.content4 .po5 { position:absolute; right:139px; top:100px; }
.content4 .po6 { position:absolute; right:150px; top:166px; }
.content4 .po7 { position:absolute; right:211px; top:176px; }
.content4 .po8 { position:absolute; left:25px; top:87px; }
.content4 .po9 { position:absolute; left:120px; top:137px; }
.content4 .p10 { position:absolute; left:239px; top:159px; }
.content4 .po1.on { left:80px; top:78px; }
.content4 .po2.on { left:176px; top:108px; }
.content4 .po3.on { right:279px; top:28px; }
.content4 .po4.on { left:108px; top:60px; }
.content4 .po5.on { right:136px; top:95px; }
.content4 .po6.on { right:147px; top:163px; }
.content4 .po7.on { right:208px; top:171px; }
.content4 .po8.on { left:29px; top:80px; }
.content4 .po9.on { left:124px; top:128px; }
.content4 .p10.on { left:242px; top:150px; }

.content5 .po1 { position:absolute; right:74px; top:54px; }
.content5 .po2 { position:absolute; left:267px; top:187px; }
.content5 .po3 { position:absolute; right:64px; top:200px; }
.content5 .po4 { position:absolute; left:355px; top:312px; }
.content5 .po5 { position:absolute; left:316px; bottom:7px; }
.content5 .po6 { position:absolute; left:291px; bottom:-41px; }
.content5 .po7 { position:absolute; right:82px; bottom:-41px; }
.content5 .po8 { position:absolute; left:227px; bottom:-63px; }
.content5 .po9 { position:absolute; left:183px; bottom:-26px; }
.content5 .p10 { position:absolute; left:164px; bottom:128px; }
.content5 .po1.on { right:74px; top:54px; }
.content5 .po2.on { left:270px; top:180px; }
.content5 .po3.on { right:64px; top:198px; }
.content5 .po4.on { left:360px; top:307px; }
.content5 .po5.on { left:319px; bottom:11px; }
.content5 .po6.on { left:295px; bottom:-35px; }
.content5 .po7.on { right:78px; bottom:-35px; }
.content5 .po8.on { left:231px; bottom:-62px; }
.content5 .po9.on { left:186px; bottom:-22px; }
.content5 .p10.on { left:167px; bottom:134px; }

.content6 .po1 { position:absolute; right:164px; top:122px; }
.content6 .po2 { position:absolute; right:257px; top:120px; }
.content6 .po3 { position:absolute; right:215px; top:162px; }
.content6 .po4 { position:absolute; right:273px; top:42px; }
.content6 .po5 { position:absolute; left:141px; top:65px; }
.content6 .po6 { position:absolute; left:35px; top:73px; }
.content6 .po7 { position:absolute; left:50px; top:113px; }
.content6 .po8 { position:absolute; right:142px; top:179px; }
.content6 .po9 { position:absolute; left:177px; top:153px; }
.content6 .p10 { position:absolute; left:203px; top:246px; }
.content6 .p11 { position:absolute; left:252px; top:113px; }
.content6 .po1.on { right:160px; top:113px; }
.content6 .po2.on { right:254px; top:113px; }
.content6 .po3.on { right:212px; top:158px; }
.content6 .po4.on { right:271px; top:38px; }
.content6 .po5.on { left:144px; top:60px; }
.content6 .po6.on { left:39px; top:72px; }
.content6 .po7.on { left:53px; top:109px; }
.content6 .po8.on { right:139px; top:174px; }
.content6 .po9.on { left:182px; top:151px; }
.content6 .p10.on { left:207px; top:243px; }
.content6 .p11.on { left:252px; top:108px; }

.content7 .po1 { position:absolute; right:103px; top:161px; }
.content7 .po2 { position:absolute; left:128px; top:116px; }
.content7 .po3 { position:absolute; right:233px; top:127px; }
.content7 .po4 { position:absolute; right:247px; top:220px; }
.content7 .po5 { position:absolute; right:197px; top:147px; }
.content7 .po6 { position:absolute; right:151px; top:198px; }
.content7 .po7 { position:absolute; left:173px; top:35px; }
.content7 .po8 { position:absolute; left:83px; top:159px; }
.content7 .po9 { position:absolute; left:185px; top:123px; }
.content7 .po1.on { right:99px; top:154px; }
.content7 .po2.on { left:131px; top:111px; }
.content7 .po3.on { right:231px; top:126px; }
.content7 .po4.on { right:244px; top:215px; }
.content7 .po5.on { right:192px; top:143px; }
.content7 .po6.on { right:148px; top:194px; }
.content7 .po7.on { left:177px; top:34px; }
.content7 .po8.on { left:86px; top:153px; }
.content7 .po9.on { left:189px; top:119px; }

.content8 .po1 { position:absolute; right:106px; top:248px; }
.content8 .po2 { position:absolute; left:310px; top:283px; }
.content8 .po3 { position:absolute; right:267px; top:206px; }
.content8 .po4 { position:absolute; right:237px; top:223px; }
.content8 .po5 { position:absolute; right:160px; top:235px; }
.content8 .po6 { position:absolute; right:259px; top:315px; }
.content8 .po7 { position:absolute; left:269px; top:179px; }
.content8 .po8 { position:absolute; left:101px; top:257px; }
.content8 .po9 { position:absolute; left:372px; top:293px; }
.content8 .p10 { position:absolute; left:69px; top:153px; }
.content8 .p11 { position:absolute; left:137px; top:283px; }
.content8 .po1.on { right:103px; top:241px; }
.content8 .po2.on { left:313px; top:276px; }
.content8 .po3.on { right:264px; top:199px; }
.content8 .po4.on { right:234px; top:217px; }
.content8 .po5.on { right:159px; top:229px; }
.content8 .po6.on { right:254px; top:307px; }
.content8 .po7.on { left:272px; top:172px; }
.content8 .po8.on { left:104px; top:252px; }
.content8 .po9.on { left:373px; top:290px; }
.content8 .p10.on { left:72px; top:147px; }
.content8 .p11.on { left:140px; top:276px; }

.click { position:absolute; top:-20px; right:0; }
.click img {width: 45px;}

.caseMain { margin:45px auto 0 auto; text-align:center; }
.caseMain a img { padding:0 0; }

.caseContent { width:1355px; height:610px; margin:0 auto 0 auto; overflow:hidden; }
.caseContent #tab01 img, .caseContent #tab02 img, .caseContent #tab03 img, .caseContent #tab04 img, .caseContent #tab05 img { margin-top: -70px; width:100% !important; }

.caseTab { width:582px; margin:0 auto; }
.caseTab li { float:left; margin-right:10px; width:138px; height:59px; }
.caseTab li:last-child { margin-right:0; }
.caseTab li a { display:block; width:138px; height:59px; text-indent:-999999px; }
.caseTab li.btnA { background:url(../img/casestudy/caseStudies_tab01.png) no-repeat 0 -59px; }
.caseTab li.btnB { background:url(../img/casestudy/caseStudies_tab02.png) no-repeat 0 -59px; }
.caseTab li.btnC { background:url(../img/casestudy/caseStudies_tab03.png) no-repeat 0 -59px; }
.caseTab li.btnD { background:url(../img/casestudy/caseStudies_tab04.png) no-repeat 0 -59px; }
.caseTab li.btnA.on, .caseTab li.btnB.on, .caseTab li.btnC.on, .caseTab li.btnD.on { background-position: 0 0; }

.downloadbtn {
	margin: 17px 21px 0 -10px;
	position: absolute;
	text-align: right;
	width: 100%;
}

.m_right_15 {
	margin-right: 15px;
}
.p_right_31 {
	padding-right: 0;
}