@charset "utf-8";

.bx-controls{display:none}

@-webkit-keyframes scrolldown{0%{-webkit-transform:translateY(-10px) translateZ(0)}50%{-webkit-transform:translateY(10px) translateZ(0)}100%{-webkit-transform:translateY(-10px) translateZ(0)}}
@-moz-keyframes scrolldown{0%{-moz-transform:translateY(-10px) translateZ(0)}50%{-moz-transform:translateY(10px) translateZ(0)}100%{-moz-transform:translateY(-10px) translateZ(0)}}
@-o-keyframes scrolldown{0%{-o-transform:translateY(-10px) translateZ(0)}50%{-o-transform:translateY(10px) translateZ(0)}100%{-o-transform:translateY(-10px) translateZ(0)}}
@keyframes scrolldown{0%{transform:translateY(-10px) translateZ(0)}50%{transform:translateY(10px) translateZ(0)}100%{transform:translateY(-10px) translateZ(0)}}

/* skip Navi */
#accessibility{display:none;position:absolute;z-index:99999;top:-66px;left:0;background-color:#f8f8f8}
#accessibility a{display:block;padding:5px 0;text-align:center;line-height:21px}
#accessibility a:link,
#accessibility a:visited{color:#333}
#accessibility a:hover,
#accessibility a:active,
#accessibility a:focus{text-decoration:underline}

#header{position:fixed;z-index:20;left:0;top:0;width:100%;border-bottom:1px solid #6d6e71;background:#fff}
#header .header{width:1100px;min-width:1100px;margin:0 auto;position:relative}
#header .header h1{position:absolute;left:0;top:30%}
#header .header .nav{padding-left:280px;text-align:center;overflow:hidden}
#header .header .nav li{float:left}
#header .header .nav li a{display:block;margin:0 32px;padding:39px 0 33px 0;font-size:13px;font-weight:300;color:#000;text-transform:uppercase;border-bottom:2px solid #fff}
#header .header .nav li a:hover{color:#e12f29;border-bottom:2px solid #e12f29}
#header .down{position:absolute;top:35%;right:0;padding:5px 22px;font-size:10px;text-transform:uppercase;color:#6d6e71;border:1px solid #ccc;background:#fff}
#header .down:hover{color:#fff;border:1px solid #e12f29;background:#e12f29}

#header.headersel .header h1{top:12px;text-align:center}
#header.headersel .header h1 img{width:80%}
#header.headersel .header .nav li a{padding:20px 0 15px 0}
#header.headersel .down{top:15px}

#footer{padding:40px 0;min-width:1200px;background:#6d6e71/*e12f29*/;text-align:center}
#footer address{font-size:15px;color:#fff}
#footer cite{font-size:11px;color:#fff}

#visual{position:relative;z-index:1;width:100%;height:600px}
#visual .visual{position:absolute;z-index:1;left:0;top:0;width:100%}
#visual .visual ul{position:relative;z-index:1;width:100%}
#visual .visual ul li{height:600px}
#visual .visual ul iframe{height:600px;overflow:hidden}
#visual .visual ul .vd1{background:url(../video/vd1.png) no-repeat 50% 0}
#visual .visual ul .vd2{background:url(../video/vd2.png) no-repeat 50% 0}
#visual .visual ul .vd3{background:url(../video/vd3.png) no-repeat 50% -200px}
#visual .visual ul .vd3 iframe{position:relative;top:-200px;height:800px}
#visual .txt{position:absolute;position:fixed;z-index:2;top:200px;left:0;width:100%}
#visual .txt h2{padding:0 0 30px 0;line-height:72px;font-size:78px;font-weight:100;letter-spacing:-1px;text-transform:uppercase;text-align:center;color:#e12f29}
#visual .txt h2 strong{font-weight:400}
#visual .txt p{margin:0 auto;width:820px;font-size:18px;font-weight:300;text-align:justify;color:#fff}
#visual .go{position:absolute;z-index:20;top:500px;left:50%;display:block;margin:0 0 0 -25px;width:50px;height:50px;background:url(../img/ico_go.png) no-repeat 50% 50%;text-indent:-9999em;
-webkit-animation:scrolldown 1.5s infinite ease-in-out;
-moz-animation:scrolldown 1.5s infinite ease-in-out;
-o-animation:scrolldown 1.5s infinite ease-in-out;
animation:scrolldown 1.5s infinite ease-in-out}
#visual .bg{position:absolute;z-index:3;top:0;left:0;width:100%;height:600px;background:url(../img/main_visual_bg.png) no-repeat 50% 100%}
#visual .co{position:absolute;z-index:1;top:0;left:0;width:100%;height:600px;background:rgba(0,0,0,0.4)}

#container{padding-top:55px;min-width:1200px}
#container .mainTitle{padding:50px 0 0 0;font-size:40px;font-weight:300;text-transform:uppercase;color:#6d6e71;text-align:center}
#container .mainText{padding:70px 0 0 0;text-align:center;font-size:18px;color:#6d6e71}

#container .sollution{position:relative;z-index:5;height:560px;background:#fff}
#container .sollution ul{width:1100px;margin:0 auto;padding-top:80px}
#container .sollution ul li{width:20%;text-align:center;float:left}
#container .sollution ul li{text-align:center;color:#333;font-size:13px}
#container .sollution ul li img{display:block;margin:0 auto;padding-bottom:5px}

#container .works{position:relative;z-index:5;padding-bottom:120px;min-height:520px;border-top:1px solid #ddd;background:url(../img/main_work_bg.gif) no-repeat center top;background-attachment:fixed;overflow:hidden}
#container .works .selectList{text-align:center;padding-top:25px;padding-bottom:10px}
#container .works .portfolioBox{width:1035px;margin:0 auto;overflow:hidden}

.filters{width:1180px;text-align:center;margin:0 auto;margin-bottom:20px}
.filters button{background:none;color:#fff;font-size:12px}
.selectList button{color:#888}
.filters button:focus,
.filters button.is-checked ,
.selectList button.is-checked{font-weight:600;color:#e12f29}
.mainGrid .element-item2 {border:1px solid #bbb;float:none;display:inline-block}
.grid{text-align:center;width:1255px;min-height:621px;margin:0 auto;overflow:hidden}
.grid.mainGrid{width:1255px}
.grid2{text-align:center;width:1035px;min-height:200px;margin:0 auto;overflow:hidden}
.gridWrap2 {width:100%;padding:60px 0;background:url(../img/main_work_bg3.gif) no-repeat center top;background-attachment:fixed}
.grid2 .element-item2{float:left}
.element-item2{width:199px;height:199px;display:inline;margin:4px;color:#fff;text-align:center;line-height:199px;font-size:13px;background:#e12f29}
.mainGrid .element-item2:hover{border:1px solid #e12f29}
.element-item2 a{display:block;padding-top:90px;width:199px;height:109px;font-size:13px;font-weight:500;text-align:center;color:#333}
.element-item2 a:hover{margin:4px;padding-top:86px;width:191px;height:109px;color:#e12f29} 
.element-item2 a span{display:block;text-align:center;font-size:11px;opacity:.5}

.element-item2.imgbox a{padding-top:154px;height:45px}
.element-item2.imgbox a:hover{padding-top:146px}
.element-item2.line2 a {height: 57px;padding-top: 142px;line-height: 1.2em;}
.element-item2.line2 a:hover{padding-top:134px}

.element-item2.no01 a{background:url(../img/img01.jpg) no-repeat center center}
.element-item2.no02 a{background:url(../img/img02.jpg) no-repeat center center}
.element-item2.no03 a{background:url(../img/img03.jpg) no-repeat center center}
.element-item2.no04 a{background:url(../img/img04.jpg) no-repeat center center}
.element-item2.no05 a{background:url(../img/img05.jpg) no-repeat center center}
.element-item2.no06 a{background:url(../img/img06.jpg) no-repeat center center}
.element-item2.no07 a{background:url(../img/img07.jpg) no-repeat center center}
.element-item2.no08 a{background:url(../img/img08.jpg) no-repeat center center}
.element-item2.no09 a{background:url(../img/img09.jpg) no-repeat center center}
.element-item2.no10 a{background:url(../img/img10.jpg) no-repeat center center}
.element-item2.no11 a{background:url(../img/img11.jpg) no-repeat center center}
.element-item2.no12 a{background:url(../img/img12.jpg) no-repeat center center}
.element-item2.no13 a{background:url(../img/img13.jpg) no-repeat center center}
.element-item2.no14 a{background:url(../img/img14.jpg) no-repeat center center}
.element-item2.no15 a{background:url(../img/img15.jpg) no-repeat center center}
.element-item2.no16 a{background:url(../img/img16.jpg) no-repeat center center}
.element-item2.no17 a{background:url(../img/img17.jpg) no-repeat center center}
.element-item2.no18 a{background:url(../img/img18.jpg) no-repeat center center}
.element-item2.no19 a{background:url(../img/img19.jpg) no-repeat center center}
.element-item2.no20 a{background:url(../img/img20.jpg) no-repeat center center}
.element-item2.no21 a{background:url(../img/img21.jpg) no-repeat center center}
.element-item2.no22 a{background:url(../img/img22.jpg) no-repeat center center}
.element-item2.no23 a{background:url(../img/img23.jpg) no-repeat center center}
.element-item2.no24 a{background:url(../img/img24.jpg) no-repeat center center}
.element-item2.no25 a{background:url(../img/img25.jpg) no-repeat center center}
.element-item2.no26 a{background:url(../img/img26.jpg) no-repeat center center}
.element-item2.no27 a{background:url(../img/img27.jpg) no-repeat center center}
.element-item2.no28 a{background:url(../img/img28.jpg) no-repeat center center}
.element-item2.no29 a{background:url(../img/img29.jpg) no-repeat center center}
.element-item2.no30 a{background:url(../img/img30.jpg) no-repeat center center}
.element-item2.no31 a{background:url(../img/img31.jpg) no-repeat center center}
.element-item2.no32 a{background:url(../img/img32.jpg) no-repeat center center}
.element-item2.no33 a{background:url(../img/img33.jpg) no-repeat center center}
.element-item2.no34 a{background:url(../img/img34.jpg) no-repeat center center}
.element-item2.no35 a{background:url(../img/img35.jpg) no-repeat center center}
.element-item2.no36 a{background:url(../img/img36.jpg) no-repeat center center}
.element-item2.no37 a{background:url(../img/img37.jpg) no-repeat center center}
.element-item2.no38 a{background:url(../img/img38.jpg) no-repeat center center}
.element-item2.no39 a{background:url(../img/img39.jpg) no-repeat center center}
.element-item2.no40 a{background:url(../img/img40.jpg) no-repeat center center}
.element-item2.no41 a{background:url(../img/img41.jpg) no-repeat center center}
.element-item2.no42 a{background:url(../img/img42.jpg) no-repeat center center}
.element-item2.no43 a{background:url(../img/img43.jpg) no-repeat center center}
.element-item2.no44 a{background:url(../img/img44.jpg) no-repeat center center}
.element-item2.no45 a{background:url(../img/img45.jpg) no-repeat center center}
.element-item2.no46 a{background:url(../img/img46.gif) no-repeat center center}
.element-item2.no47 a{background:url(../img/img47.jpg) no-repeat center center}
.element-item2.no48 a{background:url(../img/img48.jpg) no-repeat center center}
.element-item2.no49 a{background:url(../img/img49.jpg) no-repeat center center}
.element-item2.no50 a{background:url(../img/img50.jpg) no-repeat center center}
.element-item2.no51 a{background:url(../img/img51.jpg) no-repeat center center}
.element-item2.no52 a{background:url(../img/img52.jpg) no-repeat center center}

.portfolioBox2{overflow:hidden;margin:0 auto;width:948px;padding-top:30px}
.portfolioBox2 a{display:block;width:300px;height:60px;text-align:center;border:1px solid #ddd;padding-top:240px;background:#fff url(../img/work01.png) no-repeat center -10px;float:left;margin:7px}
.portfolioBox2 a span{}
.portfolioBox2 a.no02{background:#fff url(../img/work02.png) no-repeat center -10px}
.portfolioBox2 a.no03{background:#fff url(../img/work03.png) no-repeat center -15px}
.portfolioBox2 a:hover{border:1px solid #f68b1f;color:#f68b1f;font-weight:600}

#container .project{padding-bottom:100px}
#container .project .projectWrap{width:672px;margin:0 auto;overflow:hidden;padding-top:30px}
#container .project .projectWrap .box{height:32px;margin-bottom:15px;float:left}
#container .project .projectWrap .box div{border:1px solid #000;height:30px}
#container .project .projectWrap .box div label{display:inline-block;width:80px;padding-left:10px;font-weight:600;vertical-align:top;padding-top:2px;color:#000}
#container .project .projectWrap .box div input{width:70%;height:30px;font-size:13px;color:#666}
#container .notice{position:relative;z-index:5;width:1000px;margin:0 auto;height:560px;display:none}
#container .notice div{width:700px;margin:0 auto;padding:50px 20px;margin-top:40px;border:1px solid #e2e2e2;text-align:center;color:#333}
#container .notice div strong{font-size:16px;display:block;font-weight:600;padding-bottom:6px;color:#333}
#container .notice div span{display:block;font-size:12px;padding-top:20px}
#container .project .projectWrap .box.box50{width:49%;float:left}
#container .project .projectWrap .box.boxleft{margin-right:2%}
#container .project .projectWrap .box.box100{width:100%}
#container .project .projectWrap .memo{width:100%;height:200px !important}
#container .project .projectWrap .memo div{height:198px}
#container .project .projectWrap .change a{float:right;display:block;color:#000}
#container .project .projectWrap a.submit {float:right;display:block;width:78px;height:36px;border:2px solid #000;text-align:center;line-height:36px;font-size:16px;font-family:arial;font-weight:bold;color:#000}

#container .location{position:relative;z-index:5;width:100%;height:815px;background:#0f0e13 url(../img/location_bg.jpg) no-repeat 50% 0;background-attachment:fixed}
#container .location .mainTitle{background:url(../img/line03.png) no-repeat 50% 100%}
#container .location .mainText{color:#fff}
#container .location .mainText strong{display:block;line-height:50px;font-size:40px;font-weight:800;color:#e12f29}
#container .location .mainText span{display:block;font-size:14px}
#container .location .mapWrap {margin:0 auto;margin-top:40px;width:820px;overflow:hidden}
#container .location .mapWrap iframe{display:block}
#container .location .mapWrap .wrap_controllers{display:none}

.subVisual{height:230px;background:url(../img/s_visual01.jpg) no-repeat 50% 0;background-attachment:fixed;overflow:hidden}
.subVisual h2{padding:87px 0;font-size:48px;font-weight:500;text-transform:uppercase;text-align:center;vertical-align:middle;color:#e12f29;background:#eee;background:rgba(0,0,0,0.2)}

.subNavi{width:100%;padding-bottom:40px;border-bottom:1px dashed #e2e2e2;background:#f2f2f2;background:rgba(0,0,0,0.02)}
.subNavi .subNaviWrap{width:1200px;margin:0 auto;overflow:hidden;position:relative;text-align:center;padding-top:40px}
.subNavi .subNaviWrap ul li{display:inline-block}
.subNavi .subNaviWrap ul li a{display:block;position:relative;padding:0 30px;height:44px;line-height:44px;font-size:15px;text-align:center;color:#888;border:2px solid #ccc;background:#fff;border-radius:50px}
.subNavi .subNaviWrap ul li a:hover{padding:0 50px 0 30px;color:#fff;border:2px solid #aaa;background:#aaa}
.subNavi .subNaviWrap ul li a:hover:before{position:absolute;right:22px;top:12px;content:'+';display:block;width:20px;height:20px;line-height:20px;font-size:14px;color:#999;text-align:center;background:#fff;border-radius:20px}
.subNavi .subNaviWrap ul li a.on{padding:0 50px 0 30px;color:#fff;border:2px solid #e12f29;background:#e12f29}
.subNavi .subNaviWrap ul li a.on:before{position:absolute;right:22px;top:12px;content:'+';display:block;width:20px;height:20px;line-height:20px;font-size:14px;color:#e12f29;text-align:center;background:#fff;border-radius:20px}
.subNavi .subNaviWrap ul li.home{display:none}
.subNavi .subNaviWrap ul li.home a{padding:0;width:53px;border-left:1px solid #dfdfdf;background:url(../img/sub_home.png) no-repeat center center}
.subNavi .subNaviWrap div{float:right}
.subNavi .subNaviWrap div a{float:left;margin-left:1px}

.company{background:url(../img/main_work_bg.gif) no-repeat center top;background-attachment:fixed}
.company_detail{width:1200px;margin:0 auto;overflow:hidden;padding-bottom:140px}
.company_detail h3{text-align:center;margin:0 auto;padding-top:80px;padding-bottom:70px;font-size:42px;font-weight:600;color:#333}
.company_detail ul{overflow:hidden;margin-top:-20px}
.company_detail ul li{float:left;width:28.333%;border:1px solid #e2e2e2;margin:0 2.2%;padding-top:40px;min-height:450px;background:#fff;text-align:center}
.company_detail ul li h4{margin-bottom:28px;padding-top:30px;font-size:16px;font-weight:500;color:#e12f29;background:url(../img/sub01_line.png) no-repeat center bottom;background:none}
.company_detail ul li p{font-size:14px;padding:0 30px;text-align:justify;height:170px}
.company .centerVisual{width:100%;padding:100px 0;font-weight:700;line-height:64px;text-align:center;color:#fff;font-size:36px;background:url(../img/sub01_com_img04.png) no-repeat center top;background-attachment:fixed;overflow:hidden}
.company .centerVisual span{font-size:24px;color:#fff;font-weight:300}
.company .centerVisual img{padding-top:90px}
.company .org{background:#fff;background:url(../img/main_work_bg.gif) no-repeat center top;background-attachment:fixed}
.company .org h3{text-align:center;margin:0 auto;padding-top:80px;padding-bottom:70px;font-size:56px;font-weight:600;color:#434343}
.company .org .orgWrap{width:1200px;margin:0 auto;background:url(../img/sub_navi_bg.png) repeat-y center bottom;position:relative}
.company .org .orgWrap h4{margin-left:596px;padding-left:21px;color:#e12f29;font-size:24px;font-weight:bold;font-family:arial;padding-bottom:12px;background:url(../img/org_bullet02.png) no-repeat left 14px}
.company .org .orgWrap h4.left{text-align:right;margin-left:0px;width:583px;padding-left:0px;padding-right:21px !important;font-size:22px;padding-bottom:20px;background:url(../img/org_bullet02.png) no-repeat right 14px}
.company .org .orgWrap ul{margin-left:597px;padding-bottom:30px}
.company .org .orgWrap ul li{padding-left:20px;font-size:13px;color:#434343;padding-bottom:11px;background:url(../img/org_bullet01.png) no-repeat left 6px}
.company .org .orgWrap ul.left{margin-left:0px;width:604px;padding-bottom:40px} 
.company .org .orgWrap ul.left li{text-align:right;padding-left:0px;padding-right:20px;padding-bottom:6px;background:url(../img/org_bullet01.png) no-repeat right 6px}

.product .subVisual{background:url(../img/s_visual02.jpg) no-repeat 50% 0;background-attachment:fixed;overflow:hidden}
.product .detail01{padding-bottom:120px;background:url(../img/main_work_bg2.gif) no-repeat center top;background-attachment:fixed;text-align:center}
.product .detail01 .detailWrap{width:1200px;margin:0 auto}
.product .detail01 h3{text-align:center;margin:0 auto;padding-top:80px;margin-bottom:34px;font-size:42px;font-weight:600;color:#434343}
.product .detail01 p{text-align:center;font-size:15px}
.product .detail01 img{margin:0 auto;text-align:center;padding-top:65px;padding-bottom:20px}

.product .productImg{width:100%;background:#333 url(../img/product_list_bg.png) no-repeat center center;background-attachment:fixed}
.product .productImgWrap{max-width:1700px;text-align:center;margin:0 auto;overflow:hidden}
.product .productImg a{display:inline-block;width:180px;color:#fff;font-size:16px;text-align:center;line-height:110px}
.product .productImg a:hover{background:url(../img/b_50.png) repeat;background:#fff;font-size:16px;color:#333;opacity:.86}

.product .productList{background:url(../img/main_work_bg2.gif) no-repeat center top;background-attachment:fixed}
.product .productList .productListWrap{width:1200px;height:890px;margin:0 auto}
.product .productList h3{text-align:center;margin:0 auto;padding-top:80px;margin-bottom:34px;font-size:42px;font-weight:600;color:#434343}
.product .productList p{text-align:center;font-size:13px}
.product .productList .moreList{overflow:hidden;padding-top:70px;width:930px;margin:0 auto}
.product .productList .moreList li{float:left;width:250px;position:relative;margin:30px;text-align:center}
.product .productList .moreList li a{display:block;height:300px}
.product .productList .moreList li img{display:block;margin:0 auto;padding-bottom:20px}
.product .productList .moreList li strong{display:block;text-align:center;line-height:14px;padding-top:10px;font-size:16px;font-weight:600;color:#e12f29}
.product .productList .moreList span.over{display:none;position:absolute;left:0;top:0;width:250px;height:250px;background:url(../img/over_round.png) no-repeat}
.product .productList .moreList li img.more{display:inline}
.product .productList .moreList2 li{font-size:14px;font-weight:600}
.product .productList .website{overflow:hidden;margin:0 auto;width:942px;padding-left:13px}
.product .productList .website li{width:301px;height:160px;margin-right:13px;margin-bottom:24px;background:url(../img/web_bg.png) no-repeat;float:left}
.product .productList .website li h4{padding:15px 0 0 12px;font-size:17px;font-weight:600;color:#0967b3}
.product .productList .website li h4 span{color:#fff;padding-right:23px;font-family:arial;font-size:19px;vertical-align:top}
.product .productList .website li p{margin:20px 16px 0 27px;padding:8px;height:64px;font-size:12px;text-align:left;background:#f5f5f5}

.lightBoxBg{position:fixed;width:100%;height:2000px;left:0;top:0;z-index:999;background:#222;opacity:.5}
.dls-le{position:fixed;width:1180px;height:540px;left:50%;margin-left:-590px;z-index:9999;top:50%;margin-top:-350px;background:#fff}
.dls-le .dls-leWrap {position:relative}
.dls-le .imgWrap{width:540px;padding-top:140px;line-height:540px;text-align:center;float:left}
.dls-le  .textWrap{float:right;width:640px;height:600px;background:#191919}
.dls-le  .textWrap .textTop{background:#000;padding:32px 35px}
.dls-le  .textWrap .textTop h4{font-size:18px;font-weight:600;color:#fff;padding-bottom:12px}
.dls-le  .textWrap .textTop a{color:#00ccff;font-size:13px}
.dls-le  .textWrap .textTop ul{padding-top:12px}
.dls-le  .textWrap .textTop ul li{color:#fff;font-size:12px;color:#fff;padding-bottom:3px}
.dls-le  .textWrap .textTop ul li.last{padding-bottom:0;padding-top:16px}
.dls-le  .textWrap .textBottom{padding:22px 35px 30px 35px;text-align:left;background:#191919}
.dls-le  .textWrap .textBottom h4{font-size:18px;font-weight:600;color:#fff;padding-bottom:12px}
.dls-le  .textWrap .textBottom p{text-align:left;font-size:12px;color:#fff;line-height:21px}
.dls-le  .textWrap .closeBtn{position:absolute;right:20px;top:20px}

.design .subVisual{background:url(../img/s_visual03.jpg) no-repeat center top;background-attachment:fixed}
.design .ci_box{width:1040px;overflow:hidden;margin:0 auto;padding:60px 0 180px 0}
.design .ci_box li{float:left;width:248px;height:248px;border:1px solid #d2d2d2;margin:5px;position:relative}
.design .ci_box li:hover{border:1px solid #e12f29}
.design .ci_box li span{display:block;position:absolute;left:0;bottom:0;width:100%;line-height:34px;background:#fafafa;border-top:1px solid #d2d2d2;font-size:13px;text-align:center}
.design .ci_box li.no01{background:url(../img/ci01.png) no-repeat center 40%}
.design .ci_box li.no02{background:url(../img/ci02.png) no-repeat center 40%}
.design .ci_box li.no03{background:url(../img/ci03.png) no-repeat center 40%}
.design .ci_box li.no04{background:url(../img/ci04.png) no-repeat center 30%}
.design .ci_box li.no05{background:url(../img/ci05.png) no-repeat center 40%}
.design .ci_box li.no06{background:url(../img/ci06.png) no-repeat center 40%}
.design .ci_box li.no07{background:url(../img/ci07.png) no-repeat center 40%}
.design .ci_box li.no08{background:url(../img/ci08.png) no-repeat center 40%}

.design .package_box{width:1200px;overflow:hidden;margin:0 auto;padding:60px 0 180px 0}
.design .package_box li{width:380px;height:380px;float:left;margin:0 10px}
.design .package_box li span{display:block;text-align:center;padding-top:400px}
.design .package_box li.no01{background:url(../img/package01.png) no-repeat center top}
.design .package_box li.no02{background:url(../img/package02.png) no-repeat center top}
.design .package_box li.no03{background:url(../img/package03.png) no-repeat center top}
.design .poster_box{width:1200px;overflow:hidden;margin:0 auto;padding:60px 0 180px 0}
.design .poster_box li {width:50%;text-align:center;float:left}
.design .poster_box li img{width:76%;display:block;margin:0 auto;margin-bottom:15px;border:1px solid #d2d2d2}
.design .poster_box li span{}
.design .bro_box{width:1200px;overflow:hidden;margin:0 auto;margin:60px auto 0px auto;position:relative}
.design .bro_box li{float:left;width:25%;overflow:hidden}
.design .bro_box li.first{width:50%;background:#333}
.design .bro_box li.first img{}
.design .bro_box li.text{position:absolute;left:0;top:0;width:50%;height:150px;line-height:150px;color:#333;text-align:center;font-size:18px}
.design .bro_box li img{width:100%}
.design .bro_box li.b_bg{background:#333}
.design .bro_box li.b_bg img{opacity:.95}

.subWorks{margin-top:76px;background:#c7c6c5 url(../img/work_bg.jpg) no-repeat center top;padding-bottom:100px;background-attachment:fixed}
.subWorks  h2{margin:0 auto;padding:87px 0;font-size:48px;font-weight:500;text-transform:uppercase;text-align:center;vertical-align:middle;color:#e12f29}
.subWorks .workList{text-align:center}
.subWorks .workList a{margin:0 10px;padding:0 10px;font-size:12px;color:#fff}
.subWorks .workList a.on{color:#ffb628;font-weight:600}
.subWorks .worksDetail{width:1234px;margin:0 auto;position:relative}
.subWorks .worksDetail p{color:#333;position:absolute;left:414px;background:#eee;top:207px;text-align:center;line-height:199px;width:406px;height:199px;font-size:24px;font-weight:normal}

.contactText{position:fixed;left:50%;top:200px;margin-left:-550px;padding:30px;width:340px;background:#e12f29}
.contactText h2{padding-bottom:10px;font-size:36px;font-weight:500;color:#fff}
.contactText p{font-size:14px;letter-spacing:-1px;color:#fff;padding-bottom:20px}
.contactText address{font-size:13px;letter-spacing:-1px;color:#fff}
.contactText ul{overflow:hidden}
.contactText ul li{float:left;color:#fff;margin-right:12px;font-size:12px}

.page{position:fixed;z-index:100;top:28%;right:30px}
.page a{display:block;margin-bottom:8px;width:14px;height:14px;border:1px solid #e12f29;border-radius:12px}
.page a:focus{background:#e12f29}

#poplayer{position:absolute;z-index:1000;top:120px;left:50%;margin:0 0 0 -300px;width:600px;height:600px}
#poplayer *{margin:0;padding:0;border:0}
#poplayer img{display:block}
#poplayer .todays{padding:2px 20px 8px 20px;text-align:right;background:#323232}
#poplayer .todays a{font-size:14px;color:#fff}

@media screen and ( max-width: 1200px ){
#header{height:120px}
#header .header{width:100%;min-width:100%}
#header .header h1{position:static;top:auto;left:auto;text-align:left !important}
#header .header h1 a{display:block;padding:21px 0 21px 2%}
#header .header h1 img{width:120px !important}
#header .header .nav{padding:0;box-shadow:0 10px 10px 0 rgba(0,0,0,0.1)}
#header .header .nav li{width:20%}
#header .header .nav li a{display:block;margin:0;padding:0;height:45px;line-height:45px;font-size:13px;font-weight:300;text-align:center;border-top:1px solid #ccc;border-right:1px solid #eee;background:#fff}
#header.headersel .header h1{top:12px;text-align:center}
#header.headersel .header h1 img{width:80%}
#header.headersel .header .nav li a{padding:10px 0}
#header.headersel .down{top:20px}

#header .down{top:21px;right:2%}
#visual .bg{height:330px;background-size:100% auto}
#visual{min-width:100%;height:330px}
#visual .visual{position:absolute;left:0;top:0;z-index:1;width:100%}
#visual .visual div.no01{width:100%;min-width:100%;background:url(../img/main_visual03.jpg) no-repeat 50% 50%;background-size:cover;background-attachment:fixed}
#visual .visual div.no02{width:100%;min-width:100%;background:url(../img/main_visual04.jpg) no-repeat 50% 50%;background-size:cover;background-attachment:fixed}
#visual .txt{width:100%}
#visual .txt h2{line-height:28px;font-size:32px}
#visual .txt p{width:330px;line-height:20px;font-size:13px}
#visual .go{top:250px}


#container{margin-top:65px;min-width:100%}
#container .sollution ul{max-width:70%;min-width:640px;margin:0 auto}
#container .sollution ul li{width:16%;padding:0 2%}
#container .sollution ul li img{width:100%}

.filters{width:100%}
#container .works .portfolioBox {width:100%}
.grid2 , .grid{width:96%;margin:0 auto}

.gridWrap2 {width:100%;padding:60px 0;margin-bottom:60px;background:url(../img/product_bg3.jpg) no-repeat center -110px;background-attachment:fixed}
.grid2 .element-item2{float:none;display:inline-block !important}
.element-item2{width:199px;height:199px;background:#e12f29;display:inline;margin:4px;margin-bottom:8px;color:#fff;text-align:center;line-height:199px;font-size:13px}
.element-item2 a{color:#333;background:#fff;width:199px;height:109px;padding-top:90px;font-size:13px;display:block;text-align:center;transition:all 0.25s }
.element-item2 a:hover{margin-bottom:0px} 
.grid.mainGrid{width:836px}
.grid.mainGrid .element-item2{margin-bottom:4px}
.grid.workGrid{width:836px}
.grid.workGrid .element-item2{margin-bottom:4px}



#footer{min-width:100%}


.subNavi{width:100%;padding-bottom:30px}
.subNavi .subNaviWrap{width:98%;margin:0 auto;padding-top:30px}
.subNavi .subNaviWrap ul li{display:inline-block;width:23%}
.subNavi .subNaviWrap ul li a{height:44px;border:2px solid #ccc;color:#888;border-radius:50px;text-align:center;line-height:44px;display:block;font-size:15px}
.subNavi .subNaviWrap ul li a:hover{background:#aaa;border:2px solid #aaa;color:#fff}
.subNavi .subNaviWrap ul li a.on{border:2px solid #1d3865;background:#1d3865;color:#fff;position:relative}
.subNavi .subNaviWrap ul li a.on:before{content:'+';color:#aaa;display:block;width:20px;height:20px;font-size:13px;font-family:dotum;text-align:center;line-height:20px;border-radius:20px;background:#fff;position:absolute;right:8px;top:12px}
.subNavi .subNaviWrap ul li.home{display:none}
.subNavi .subNaviWrap ul li.home a{padding:0;width:53px;border-left:1px solid #dfdfdf;background:url(../img/sub_home.png) no-repeat center center}



.subNavi .subNaviWrap div{float:right}
.subNavi .subNaviWrap div a{float:left;margin-left:1px}

.company_detail{width:100%;background-size:120%}
.company_detail h3{text-align:center;margin:0 auto;padding-top:80px;padding-bottom:70px;font-size:42px;font-weight:600;color:#434343}
.company_detail ul{overflow:hidden;margin-top:-20px}
.company_detail ul li{border:0;padding:0;min-height:auto;height:auto;background:none}
.company_detail ul li h4{font-size:15px;font-weight:600}
.company_detail ul li p{height:auto;padding:0}

.company .centerVisual{font-size:32px}
.company .centerVisual span{font-size:24px;color:#fff;font-weight:300}

.company .org{width:100%;background-size:120%}
.company .org img{display:none}
.company .org .orgWrap{width:100%;margin:0 auto;position:relative}
.company .org .orgWrap h4{padding:0;text-align:center;width:120px;margin:0 auto;margin-bottom:20px;height:42px;line-height:42px;border:1px solid #333;background:#fff}
.company .org .orgWrap h4.left{width:100%;padding:0;text-align:center;width:120px;margin:0 auto;margin-bottom:20px;height:42px;border:1px solid #333;background:#fff}
.company .org .orgWrap ul{margin:0;text-align:center}
.company .org .orgWrap ul li{text-align:center;background:none}
.company .org .orgWrap ul.left{width:100%} 
.company .org .orgWrap ul.left li{text-align:center;padding:0;margin:0;padding-bottom:6px;background:none}


.product .detail01{padding-bottom:120px;background-size:100%;text-align:center}
.product .detail01 .detailWrap{width:96%;margin:0;padding:0 2%}
.product .detail01 h3{text-align:center;margin:0 auto;padding-top:80px;padding-bottom:24px;margin-bottom:34px;font-size:42px;font-weight:600;color:#434343;background:url(../img/product_line.png) no-repeat center bottom}
.product .detail01 p{text-align:center;font-size:13px}
.product .detail01 img{margin:0 auto;text-align:center;padding-top:65px;padding-bottom:20px}

.product .productImg{width:100%;background:#333 url(../img/product_list_bg.png) no-repeat center center;background-attachment:fixed}
.product .productImgWrap {width:100%;text-align:center;margin:0 auto;overflow:hidden}
.product .productImg a{display:inline-block;width:180px;color:#fff;font-size:16px;text-align:center;line-height:110px}
.product .productImg a:hover{background:url(../img/b_50.png) repeat;background:#fff;font-size:16px;color:#333;opacity:.86}

.product .productList{background-size:100%}
.product .productList .productListWrap{width:96%;height:auto;padding-bottom:80px;margin:0 auto;background:url(../img/round_bg.png) no-repeat right 700px}
.product .productList h3{text-align:center;margin:0 auto;padding-top:80px;padding-bottom:24px;margin-bottom:34px;font-size:42px;font-weight:600;color:#434343;background:url(../img/product_line.png) no-repeat center bottom}
.product .productList p{text-align:center;font-size:13px}
.product .productList .moreList{overflow:hidden;padding-top:70px;width:96%;margin:0 auto}
.product .productList .moreList li{float:left;width:27.33333%;padding:0 3%;position:relative;margin:30px 0;text-align:center}
.product .productList .moreList li a{display:block;height:auto}
.product .productList .moreList li img{display:block;width:100%;margin:0 auto;padding-bottom:20px}
.product .productList .moreList li strong{display:block;text-align:center;line-height:14px;padding-top:10px;font-size:16px;font-weight:600;color:#0967b3}
.product .productList .moreList span.over{display:none;position:absolute;left:0;top:0;width:100%;background:url(../img/over_round.png) no-repeat center top;background-size:84%}
.product .productList .moreList li img.more{display:inline;width:20px}

.product .productList .moreList2 li{font-size:14px;font-weight:600}

.product .productList .website{overflow:hidden;margin:0 auto;width:96%}
.product .productList .website li{background:#f2f2f2;width:30.33333%;margin:0 1.5%;margin-bottom:30px}
.product .productList .website li h4{padding:15px 0 0 0;font-size:15px;letter-spacing:-2px;line-height:27px;font-weight:600;color:#0967b3}
.product .productList .website li h4 span{color:#f78f1e;padding-right:10px;font-family:arial;letter-spacing:0;font-size:19px;vertical-align:top}
.product .productList .website li p{margin:16px;padding:8px;height:64px;line-height:17px;font-size:12px;text-align:left;background:#fff}

.lightBoxBg{position:fixed;width:100%;height:2000px;left:0;top:0;z-index:999;background:#222;opacity:.5}
.dls-le{position:fixed;width:96%;height:340px;left:0;margin-left:2%;z-index:9999;top:0;margin-top:20px}
.dls-le .dls-leWrap {position:relative}
.dls-le .imgWrap{width:28%;padding:3% 1%;text-align:center;float:left}
.dls-le .imgWrap img{width:100%}
.dls-le  .textWrap{float:right;width:70%;height:600px;background:#191919}
.dls-le  .textWrap .textTop{background:#000;padding:32px 35px}
.dls-le  .textWrap .textTop h4{font-size:18px;font-weight:600;color:#fff;padding-bottom:12px}
.dls-le  .textWrap .textTop a{color:#00ccff;font-size:13px}
.dls-le  .textWrap .textTop ul{padding-top:12px}
.dls-le  .textWrap .textTop ul li{color:#fff;font-size:12px;color:#fff;padding-bottom:3px}
.dls-le  .textWrap .textTop ul li.last{padding-bottom:0;padding-top:16px}

.dls-le  .textWrap .textBottom{padding:22px 35px 30px 35px;text-align:left;background:#191919}
.dls-le  .textWrap .textBottom h4{font-size:18px;font-weight:600;color:#fff;padding-bottom:12px}
.dls-le  .textWrap .textBottom p{text-align:left;font-size:12px;color:#fff;line-height:21px}
.dls-le  .textWrap .closeBtn{position:absolute;right:20px;top:20px}



.design .ci_box{width:98%;overflow:hidden;margin:0 auto;padding:40px 0 120px 0}
.design .ci_box li{float:left;width:24%;box-sizing:border-box;height:248px;border:1px solid #d2d2d2;margin:5px 0.5%;position:relative}
.design .ci_box li:hover{border:1px solid #f78f1e}
.design .ci_box li span{display:block;position:absolute;left:0;bottom:0;width:100%;line-height:34px;background:#fafafa;border-top:1px solid #d2d2d2;font-size:13px;text-align:center}
.design .ci_box li.no01{background:url(../img/ci01.png) no-repeat center 40%}
.design .ci_box li.no02{background:url(../img/ci02.png) no-repeat center 40%}
.design .ci_box li.no03{background:url(../img/ci03.png) no-repeat center 40%}
.design .ci_box li.no04{background:url(../img/ci04.png) no-repeat center 40%}
.design .ci_box li.no05{background:url(../img/ci05.png) no-repeat center 40%}
.design .ci_box li.no06{background:url(../img/ci06.png) no-repeat center 40%}
.design .ci_box li.no07{background:url(../img/ci07.png) no-repeat center 40%}
.design .ci_box li.no08{background:url(../img/ci08.png) no-repeat center 40%}
.design .ci_box li{background-size:100% !important}

.design .bro_box{width:98%;overflow:hidden;margin:0 auto;margin:40px auto 0px auto;position:relative}
.design .bro_box li{float:left;width:25%;overflow:hidden}
.design .bro_box li.first{width:50%;background:#333}
.design .bro_box li.first img{}
.design .bro_box li.text{position:absolute;left:0;top:0;width:50%;height:150px;line-height:120px;color:#333;text-align:center;font-size:18px}
.design .bro_box li img{width:100%}
.design .bro_box li.b_bg{background:#333}
.design .bro_box li.b_bg img{opacity:.95}


.design .package_box{width:98%;overflow:hidden;margin:0 auto;padding:40px 0 120px 0}
.design .package_box li{width:32.33%;height:380px;float:left;margin:0 0.5%}
.design .package_box li span{display:block;text-align:center;padding-top:45%;margin-top:190px}
.design .package_box li.no01{background:url(../img/package01.png) no-repeat center top;background-size:100%}
.design .package_box li.no02{background:url(../img/package02.png) no-repeat center top;background-size:100%}
.design .package_box li.no03{background:url(../img/package03.png) no-repeat center top;background-size:100%}

.design .poster_box{width:98%;overflow:hidden;margin:0 auto;padding:40px 0 120px 0}
.design .poster_box li {width:50%;text-align:center;float:left}
.design .poster_box li img{width:76%;display:block;margin:0 auto;margin-bottom:15px;border:1px solid #d2d2d2}
.design .poster_box li span{}







.contactText{position:absolute;margin-left:0;left:20px;top:140px;height:146px;padding:20px;background:url(../img/blue_90.png) repeat}
.contactText h2{padding-bottom:15px;margin-bottom:10px;background:url(../img/line04.png) no-repeat left bottom}
.contactText p{font-size:13px;letter-spacing:-1px;color:#fff;padding-bottom:20px}
.contactText address{font-size:12px;color:#fff;padding-bottom:2px}
.contactText ul{overflow:hidden}
.contactText ul li{float:left;color:#fff;margin-right:12px;font-size:12px}


}

@media screen and ( max-width: 836px ){.grid.mainGrid{width:627px}
.grid.mainGrid .element-item2{margin-bottom:4px}
.grid.workGrid{width:627px}
.grid.workGrid .element-item2{margin-bottom:4px}



.design .ci_box{width:98%;overflow:hidden;margin:0 auto;padding:40px 0 120px 0}
.design .ci_box li{float:left;width:49%;box-sizing:border-box;height:248px;border:1px solid #d2d2d2;margin:5px 0.5%;position:relative}








}

@media screen and ( max-width: 640px ){#poplayer{position:absolute;z-index:1000;top:120px;left:0px;margin:0 0 0 0;width:auto;height:auto}
#poplayer *{margin:0;padding:0;border:0}
#poplayer img{display:block;width:100%;height:auto}
#poplayer .todays{padding:2px 20px 8px 20px;text-align:right;background:#323232}
#poplayer .todays a{font-size:14px;color:#fff}

#header, #container , #footer{min-width:320px}

#header{}
#header .headerWrap h1{left:3%;top:12px}
#header .headerWrap h1 img{width:100px}
#header .headerWrap{width:100%;min-width:100%}
#header .headerWrap .nav  {padding:0;width:100%}
#header .headerWrap .nav li{width:20%;margin-top:50px;background:#303030}
#header .headerWrap .nav li a{padding:0;display:block;text-align:center;height:40px;font-weight:300;font-size:14px;line-height:40px;border-right:1px solid #000}
#header .headerWrap .downBtn{right:3%;top:18px}
#header .headerWrap .downBtn img{width:80px;border:1px solid #333}

#container{min-width:100%}
#container .visualWrap .main_visual div.no01{  min-width:100%;background-size:auto 500px}
#container .visualWrap .main_visual div.no02{  min-width:100%;background-size:auto 500px}
#container .visualWrap .textBox{width:100%;padding:0;margin:0}
#container .visualWrap .textBox h2 {width:auto;padding:0;margin:0;padding:70px 3% 30px 3%;font-size:28px;background-position:center 90%;background-size: 60px 1px}
#container .visualWrap .textBox p{width:auto;font-size:13px;padding:0 4%}
#container .visualWrap .textBox p br{display:none}
#container .visualWrap .textBox .go_bottom{border:1px solid #fff;border-radius:50px;top:280px;padding-top:0px;margin-top:40px}
#container .visualWrap .textBox .go_bottom img{padding-top:17px;width:11px}
#container .visualWrap .visual_bg{width:100%;height:23px;background:url(../img/main_visual_bg.png) no-repeat center bottom;background-size:auto 23px;position:absolute;left:0;bottom:0}

#container h2.mainTitle{font-size:32px;padding-bottom:10px;margin-bottom:10px;background-position:center 94%}

#container .sollution{height:auto;width:100%;padding:0;border-bottom:0px;margin:0 auto}
#container .sollution .mainTitle{padding-top:30px}
#container .sollution p{font-size:13px;padding:0 2%}
#container .sollution p br{display:none}
#container .sollution ul {width:94%;padding:30px 0 20px 0;height:auto;min-width:94%;margin:0 auto;overflow:hidden}
#container .sollution ul li{margin:0;padding:0;width:45.2%;margin:0 2%;margin-bottom:4%;padding:10px 0;padding-bottom:20px;font-size:12px;border-radius:5px;border:1px solid #eee}
#container .sollution ul li img{width:42%;padding:5%;margin-bottom:4px}

#container .works{padding-bottom:30px;border-top:1px solid #ddd;background-size:120%}
#container .works .mainTitle{padding-top:30px}
#container .works p{font-size:13px;padding:0 2%}
#container .works p br{display:none}

#container .location#contactUs{height:530px;background-size:auto 530px}
#container .location .mainTitle{padding-top:30px}
#container .location img{width:150px;padding-top:10px}
#container .location#contactUs .mapWrap{margin-top:20px}

.filters{width:100%;margin:0;padding:0}
#container .works .portfolioBox {width:100%}
.grid2 , .grid{width:96%;margin:0 auto}





.grid2 .element-item2{float:none;display:inline-block !important}
.element-item2{width:199px;height:199px;background:#e12f29;display:inline;margin:4px;margin-bottom:8px;color:#fff;text-align:center;line-height:199px;font-size:13px}
.element-item2 a{color:#333;background:#fff;width:199px;height:109px;padding-top:90px;font-size:13px;display:block;text-align:center;transition:all 0.25s }
.element-item2 a:hover{margin-bottom:0px} 
.grid.mainGrid{width:92%;height:auto;min-height:auto;margin:0 auto}
.grid.mainGrid .element-item2{width:48%;height:auto;border:0;padding:0;margin:1%;overflow:hidden;background:none}
.grid.mainGrid .element-item2:hover {padding:0;width:48%;height:auto;border:0;padding:0;margin:1%;overflow:hidden;background:none}
.grid.mainGrid .element-item2 a{line-height:15px;width:auto;height:40px;padding:0;padding-top:120px;font-size:12px;border:1px solid #eee;background-color:#fff;background-position:center 0;background-size:150px}
.grid.mainGrid .element-item2 a:hover{margin:0;line-height:15px;width:auto;height:40px;padding:0;padding-top:116px;font-size:12px;border:3px solid #f78f1e;background-color:#fff;background-position:center 0;background-size:150px}
.grid.workGrid{width:836px}
.grid.workGrid .element-item2{margin-bottom:4px}

.gridWrap2.gridWrap3 {width:auto;height:auto;min-height:auto;padding:0px;background:#f2f2f2;background-attachment:fixed}
.gridWrap3 .grid2{width:auto;height:auto;min-height:auto;padding:0;margin:0;width:100%;padding:1% 0}
.gridWrap3 .element-item2{height:80px;width:96%;display:block;margin:0;padding:1.2% 2%;;background:#f2f2f2}
.gridWrap3 .element-item2 a{border-radius:5px;padding:0;margin:0;width:auto;padding-left:116px;text-align:left;height:60px;padding-top:20px;background-color:#fff;background-size:auto 96px;background-position:left top;font-size:12px}
.gridWrap3 .element-item2 a:hover{padding:0;margin:0;width:auto;padding-left:116px;text-align:left;height:60px;padding-top:20px;background-color:#fff;background-size:auto 96px;background-position:left top;font-size:12px}
.gridWrap3 .element-item2 a span{text-align:left}

#container .location{padding:0;height:700px}
#container .location h2{padding-top:50px}
#container .location .mapWrap{width:90%;margin:0 auto;overflow:hidden;border:3px solid #fff;margin-top:40px}

#footer{min-width:100%;height:auto}
#footer address{line-height:18px;padding:15px 10px 18px 10px;color:#aaa}

#container .subVisual {height:200px;background-size:auto 400px}
#container .subVisual h2{padding-top:126px}
#container .subVisual h2 img ,  .subWorks h2 img{height:34px;margin:0 auto}

.subNavi{padding-bottom:10px}
.subNavi .subNaviWrap{width:98%;margin:0 auto;overflow:hidden;position:relative;;padding-top:10px}
.subNavi .subNaviWrap ul li{width:25%;min-width:25%;float:left}
.subNavi .subNaviWrap ul li a{width:auto;margin:0 2px;font-size:12px;border-radius:4px}
.subNavi .subNaviWrap ul li a.on:before{display:none}
.subNavi .subNaviWrap div{float:right}
.subNavi .subNaviWrap div a{float:left;margin-left:1px}

.company_detail{width:100%;padding:0;margin:0}
.company_detail h3{text-align:center;margin:0 auto;padding-top:30px;padding-bottom:40px;font-size:32px;font-weight:600;color:#434343}
.company_detail ul{overflow:hidden;width:100%;padding:0;margin:0;margin-top:-20px}
.company_detail ul li{width:94%;margin:0 3%;padding:0;padding-top:20px;border-top:1px solid #f0f0f0;margin-bottom:0px}
.company_detail ul li img{width:20%;min-width:80px;padding-bottom:125px;padding-top:5px;float:left;padding-right:14px}
.company_detail ul li h4{font-size:15px;text-align:left;padding:0;margin:0;padding:0;font-weight:600}
.company_detail ul li p{height:auto;padding:0;padding-top:6px;text-align:left;margin:0;font-size:12px;line-height:18px;padding-bottom:20px}

.company .centerVisual{font-size:22px;line-height:32px;padding:80px 0}
.company .centerVisual span{font-size:16px;color:#fff;font-weight:300}

.company .org{width:100%;background-size:100%}
.company .org h3{padding:30px 0 24px 0;font-size:42px}
.company .org img{display:none}
.company .org .orgWrap{width:100%;margin:0 auto;position:relative}
.company .org .orgWrap h4{padding:0;text-align:center;width:100px;margin:0 auto;margin-bottom:12px;border-radius:4px;height:32px;line-height:33px;border:1px solid #aaa;font-size:18px;background:#fff}
.company .org .orgWrap h4.left{width:100%;padding:0;text-align:center;width:100px;margin:0 auto;margin-bottom:12px;height:33px;border:1px solid #aaa;font-size:18px;background:#fff}
.company .org .orgWrap ul{padding:0;margin:0;margin-bottom:30px;text-align:center}
.company .org .orgWrap ul li{padding:0;margin:0;border:1px solid #ddd;padding:10px 4%;margin:0 6% 6px 6%;border-radius:300px;text-align:center;background:#fff;line-height:15px;font-size:12px}
.company .org .orgWrap ul.left {padding:0;margin:0;width:100%;margin-bottom:30px} 
.company .org .orgWrap ul.left li{padding:0;margin:0;border:1px solid #ddd;padding:10px 4%;margin:0 6% 6px 6%;border-radius:300px;text-align:center;background:#fff;line-height:15px;font-size:12px}
.company .org .orgWrap ul li:hover{border:1px solid #f78f1e;color:#f78f1e}

.product{background:none}
.product .detail01{padding:0;margin:0;padding-bottom:50px;background:url(../img/product_bg.png) no-repeat center top;background-attachment:fixed;text-align:center}
.product .detail01 .detailWrap{width:96%;margin:0 2%}
.product .detail01 h3{text-align:center;margin:0 auto;padding-top:30px;padding-bottom:10px;margin-bottom:10px;font-size:32px;font-weight:600;color:#434343;background:url(../img/product_line.png) no-repeat center 93%;background-size:70px 1px}
.product .detail01 p{text-align:center;font-size:13px}
.product .detail01 p br{display:none}
.product .detail01 img{margin:0 auto;width:80%;text-align:center;padding-top:35px;padding-bottom:0px}
.mobileGridWrap2{display:none}
.product .productImg{width:100%;background:#333 url(../img/product_list_bg.png) no-repeat center center;background-attachment:fixed}
.product .productImgWrap {width:100%;text-align:center;margin:0 auto;overflow:hidden}
.product .productImg a{display:inline-block;width:180px;color:#fff;font-size:16px;text-align:center;line-height:110px}
.product .productImg a:hover{background:url(../img/b_50.png) repeat;background:#fff;font-size:16px;color:#333;opacity:.86}

.product .productList{margin-top:0px;padding-top:0;background:none;background-attachment:fixed}
.product .productList .productListWrap{width:96%;margin-top:0;padding-top:0;height:auto;padding-bottom:20px;margin:0 auto;background:url(../img/round_bg.png) no-repeat right 700px}
.product .productList h3{text-align:center;margin:0 auto;padding-top:0px;margin-top:-20px;padding-bottom:10px;margin-bottom:10px;font-size:32px;font-weight:600;color:#434343;background:url(../img/product_line.png) no-repeat center 93%;background-size:70px 1px}
.product .productList p{text-align:center;font-size:13px}
.product .productList p br{display:none}
.product .productList .moreList{overflow:hidden;padding-top:20px;width:96%;margin:0 auto}
.product .productList .moreList li{float:left;width:27.33333%;padding:0 3%;position:relative;margin:30px 0;text-align:center}
.product .productList .moreList li a{display:block;height:auto}
.product .productList .moreList li img{display:block;width:100%;margin:0 auto;padding-bottom:20px}
.product .productList .moreList li strong{display:block;text-align:center;line-height:14px;padding-top:10px;font-size:16px;font-weight:600;color:#0967b3}
.product .productList .moreList span.over{display:none;position:absolute;left:0;top:0;width:100%;background:url(../img/over_round.png) no-repeat center top;background-size:84%}
.product .productList .moreList li img.more{display:inline;width:20px}

.product .productList .moreList2 li{font-size:14px;font-weight:600}

.product .productList .website{padding:0 1%;overflow:hidden;margin:0;width:98%}
.product .productList .website li{background:#f2f2f2;border-radius:5px;height:152px;width:47%;margin:0 1.5%;margin-bottom:10px}
.product .productList .website li h4{padding:10px 0 0 10px;font-size:14px;letter-spacing:-2px;line-height:22px;font-weight:600;color:#0967b3}
.product .productList .website li h4 span{color:#f78f1e;padding:0;margin:0;padding-right:4px;font-family:arial;line-height:20px;letter-spacing:0;font-size:15px;vertical-align:top}
.product .productList .website li p{margin:10px;padding:8px;border-radius:3px;height:84px;line-height:16px;font-size:12px;text-align:left;background:#fff}

.subWorks {background-color:#111;min-height:auto;background-size:auto 500px;border-bottom:1px solid #323232;padding-bottom:30px;margin-bottom:0px}
.subWorks .filters{margin-bottom:10px}
.subWorks h2{padding:130px 0 30px 0;}
.subWorks .grid{width:96%;min-height:auto;max-width:96%;height:auto;margin:0 auto}
.subWorks .grid .element-item2{width:48%;height:auto;border:0;padding:0;margin:1%;overflow:hidden;background:none}
.subWorks .grid .element-item2:hover {padding:0;width:48%;height:auto;border:0;padding:0;margin:1%;overflow:hidden;background:none}
.subWorks .grid .element-item2 a{line-height:15px;width:auto;height:40px;padding:0;padding-top:120px;font-size:12px;border:1px solid #eee;background-color:#fff;background-position:center 0;background-size:150px}
.subWorks .grid .element-item2 a:hover{margin:0;line-height:15px;width:auto;height:40px;padding:0;padding-top:116px;font-size:12px;border:3px solid #f78f1e;background-color:#fff;background-position:center 0;background-size:150px}
.subWorks .grid{width:836px}
.subWorks .grid .element-item2{margin-bottom:4px}

.lightBoxBg{position:fixed;width:100%;height:500px;left:0;top:0;z-index:999;background:#222;opacity:.5}
.dls-le{position:fixed;width:96%;height:auto;min-height:auto;left:0;margin-left:2%;z-index:9999;top:0;margin-top:15px}
.dls-le .dls-leWrap {position:relative;height:auto;min-height:auto}
.dls-le .imgWrap{display:none;width:28%;padding:3% 1%;text-align:center;float:left}
.dls-le .imgWrap img{width:100%}
.dls-le  .textWrap{float:none;width:auto;padding-bottom:15px;height:auto;background:#000}
.dls-le  .textWrap .textTop{background:#000;padding:15px}
.dls-le  .textWrap .textTop h4{font-size:18px;font-weight:600;color:#fff;padding-bottom:8px}
.dls-le  .textWrap .textTop a{color:#00ccff;font-size:13px}
.dls-le  .textWrap .textTop ul{padding-top:8px}
.dls-le  .textWrap .textTop ul li{color:#fff;font-size:12px;color:#fff;padding-bottom:3px}
.dls-le  .textWrap .textTop ul li.last{padding-bottom:0;padding-top:8px;display:none}

.dls-le  .textWrap .textBottom{padding:10px;margin:0 15px;height:160px;overflow-y:scroll;text-align:left;background:#fff}
.dls-le  .textWrap .textBottom h4{font-size:16px;font-weight:600;color:#333;padding-bottom:8px}

.dls-le  .textWrap .textBottom p{text-align:left;font-size:12px;color:#333;line-height:21px}
.dls-le  .textWrap .closeBtn{position:absolute;right:15px;top:15px}





.design .ci_box{width:98%;overflow:hidden;margin:0 auto;padding:40px 0 120px 0}
.design .ci_box li{float:left;width:99%;box-sizing:border-box;height:248px;border:1px solid #d2d2d2;margin:5px 0.5%;position:relative}


.design .bro_box{width:98%;overflow:hidden;margin:0 auto;margin:40px auto 0px auto;position:relative}
.design .bro_box li{float:left;width:50%;overflow:hidden}
.design .bro_box li.first{width:100%;background:#333}
.design .bro_box li.first img{}
.design .bro_box li.text{position:absolute;left:0;top:0;width:100%;height:150px;line-height:20px;color:#333;text-align:center;font-size:13px}
.design .bro_box li img{width:100%}
.design .bro_box li.b_bg{background:#333}
.design .bro_box li.b_bg img{opacity:.95}


.design .package_box{width:96%;overflow:hidden;margin:0 auto;padding:40px 0 120px 0}
.design .package_box li{width:100%;height:380px;float:left;margin:0 0.5%}
.design .package_box li span{display:block;text-align:center;padding-top:45%;margin-top:190px}
.design .package_box li.no01{background:url(../img/package01.png) no-repeat center top;background-size:100%}
.design .package_box li.no02{background:url(../img/package02.png) no-repeat center top;background-size:100%}
.design .package_box li.no03{background:url(../img/package03.png) no-repeat center top;background-size:100%}

.design .poster_box{width:98%;overflow:hidden;margin:0 auto;padding:40px 0 60px 0}
.design .poster_box li {width:96%;text-align:center;float:left;padding-bottom:30px}
.design .poster_box li img{width:76%;display:block;margin:0 auto;margin-bottom:15px;border:1px solid #d2d2d2}
.design .poster_box li span{}







.contactText{position:fixed;margin-left:0;left:0px;top:90px;height:auto;width:94%;margin:12px 3%;padding:0;background:url(../img/blue_90.png) repeat}
.contactText h2{display:none;padding:15px;margin-bottom:10px;background:url(../img/line04.png) no-repeat 15px bottom}
.contactText h2 img{width:120px}
.contactText p{display:none;font-size:12px;padding-left:15px;padding-top:15px;letter-spacing:-1px;color:#fff;padding-bottom:6px}
.contactText address{font-size:11px;padding-left:15px;padding-top:15px;color:#fff;padding-bottom:2px}
.contactText ul{overflow:hidden;padding-left:15px;padding-bottom:15px}
.contactText ul li{float:left;color:#fff;margin-right:12px;font-size:11px}
.contactMapWrap{margin-top:-160px}

.page{opacity:.6;right:4px;display:none}



}

/*

.animation-element{opacity: 0;position: relative}


.animation-element.animation-wrap{opacity: 0;-moz-transition: all 1000ms;-webkit-transition: all 1000ms;-o-transition: all 1000ms easeOutBounce;transition: all 1000ms easeOutBounce;-moz-transform: translate3d(0px, -50px, 0px);-webkit-transform: translate3d(0px, -50px, 0px);-o-transform: translate(0px, -50px);-ms-transform: translate(0px, -50px);transform: translate3d(0px, -50px, 0px)}

.animation-element.animation-title{opacity: 0;-moz-transition: all 600ms;-webkit-transition: all 600ms;-o-transition: all 600ms easeOutBounce;transition: all 1000ms easeOutBounce;-moz-transform: translate3d(-120px, 0px, 0px);-webkit-transform: translate3d(-120px, 0px, 0px);-o-transform: translate(-120px, 0px);-ms-transform: translate(-120px, 0px);transform: translate3d(-120px, 0px, 0px);-webkit-transition-delay: 0.25s;transition-delay: 0.25s}

.animation-element.animation-title-left{opacity: 0;-moz-transition: all 600ms;-webkit-transition: all 600ms;-o-transition: all 600ms easeOutBounce;transition: all 1000ms easeOutBounce;-moz-transform: translate3d(120px, 0px, 0px);-webkit-transform: translate3d(120px, 0px, 0px);-o-transform: translate(120px, 0px);-ms-transform: translate(120px, 0px);transform: translate3d(120px, 0px, 0px);-webkit-transition-delay: 0.25s;transition-delay: 0.25s}


.animation-element.animation-content{opacity: 0;-moz-transition: all 1000ms;-webkit-transition: all 1000ms;-o-transition: all 1000ms easeOutBounce;transition: all 1000ms easeOutBounce;-moz-transform: translate3d(0px, 120px, 0px);-webkit-transform: translate3d(0px, 120px, 0px);-o-transform: translate(0px, 120px);-ms-transform: translate(0px, 120px);transform: translate3d(0px, 120px, 0px);-webkit-transition-delay: 0.5s;transition-delay: 0.5s}


.animation-element.in-view{opacity: 1;-moz-transform: translate3d(0px, 0px, 0px);-webkit-transform: translate3d(0px, 0px, 0px);-o-transform: translate(0px, 0px);-ms-transform: translate(0px, 0px);transform: translate3d(0px, 0px, 0px)}
*/
.mfp-bg{top: 0;left: 0;width: 100%;height: 100%;z-index: 1042;overflow: hidden;position: fixed;background: #0b0b0b;opacity: 0.8}

.mfp-wrap{top: 0;left: 0;width: 100%;height: 100%;z-index: 1043;position: fixed;outline: none !important;-webkit-backface-visibility: hidden}

.mfp-container{text-align: center;position: absolute;width: 100%;height: 100%;left: 0;top: 0;padding: 0 8px;box-sizing: border-box}

.mfp-container:before{content: '';display: inline-block;height: 100%;vertical-align: middle}

.mfp-align-top .mfp-container:before{display: none}

.mfp-content{position: relative;display: inline-block;vertical-align: middle;margin: 0 auto;text-align: left;z-index: 1045}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content{width: 100%;cursor: auto}

.mfp-ajax-cur{cursor: progress}

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor: -moz-zoom-out;cursor: -webkit-zoom-out;cursor: zoom-out}

.mfp-zoom{cursor: pointer;cursor: -webkit-zoom-in;cursor: -moz-zoom-in;cursor: zoom-in}

.mfp-auto-cursor .mfp-content{cursor: auto}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter{-webkit-user-select: none;-moz-user-select: none;user-select: none}

.mfp-loading.mfp-figure{display: none}

.mfp-hide{display: none !important}

.mfp-preloader{color: #CCC;position: absolute;top: 50%;width: auto;text-align: center;margin-top: -0.8em;left: 8px;right: 8px;z-index: 1044}
  .mfp-preloader a{color: #CCC}
    .mfp-preloader a:hover{color: #FFF}

.mfp-s-ready .mfp-preloader{display: none}

.mfp-s-error .mfp-content{display: none}

button.mfp-close,
button.mfp-arrow{overflow: visible;cursor: pointer;background: transparent;border: 0;-webkit-appearance: none;display: block;outline: none;padding: 0;z-index: 1046;box-shadow: none;touch-action: manipulation}

button::-moz-focus-inner{padding: 0;border: 0}

.mfp-close{width: 44px;height: 44px;line-height: 44px;position: absolute;right: 0;top: 0;text-decoration: none;text-align: center;opacity: 0.65;padding: 0 0 18px 10px;color: #FFF;font-style: normal;font-size: 28px;font-family: Arial, Baskerville, monospace}
  .mfp-close:hover,
  .mfp-close:focus{opacity: 1}
  .mfp-close:active{top: 1px}

.mfp-close-btn-in .mfp-close{color: #333}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close{color: #FFF;right: -6px;text-align: right;padding-right: 6px;width: 100%}

.mfp-counter{position: absolute;top: 0;right: 0;color: #CCC;font-size: 12px;line-height: 18px;white-space: nowrap}

.mfp-arrow{position: absolute;opacity: 0.65;margin: 0;top: 50%;margin-top: -55px;padding: 0;width: 90px;height: 110px;-webkit-tap-highlight-color: transparent}
  .mfp-arrow:active{margin-top: -54px}
  .mfp-arrow:hover,
  .mfp-arrow:focus{opacity: 1}
  .mfp-arrow:before,
  .mfp-arrow:after{content: '';display: block;width: 0;height: 0;position: absolute;left: 0;top: 0;margin-top: 35px;margin-left: 35px;border: medium inset transparent}
  .mfp-arrow:after{border-top-width: 13px;border-bottom-width: 13px;top: 8px}
  .mfp-arrow:before{border-top-width: 21px;border-bottom-width: 21px;opacity: 0.7}

.mfp-arrow-left{left: 0}
  .mfp-arrow-left:after{border-right: 17px solid #FFF;margin-left: 31px}
  .mfp-arrow-left:before{margin-left: 25px;border-right: 27px solid #3F3F3F}

.mfp-arrow-right{right: 0}
  .mfp-arrow-right:after{border-left: 17px solid #FFF;margin-left: 39px}
  .mfp-arrow-right:before{border-left: 27px solid #3F3F3F}

.mfp-iframe-holder{padding-top: 40px;padding-bottom: 40px}
  .mfp-iframe-holder .mfp-content{line-height: 0;width: 100%;max-width: 900px}
  .mfp-iframe-holder .mfp-close{top: -40px}

.mfp-iframe-scaler{width: 100%;height: 0;overflow: hidden;padding-top: 56.25%}
  .mfp-iframe-scaler iframe{position: absolute;display: block;top: 0;left: 0;width: 100%;height: 100%;box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);background: #000}

/* Main image in popup */
img.mfp-img{width: auto;max-width: 100%;height: auto;display: block;line-height: 0;box-sizing: border-box;padding: 40px 0 40px;margin: 0 auto}

/* The shadow behind the image */
.mfp-figure{line-height: 0}
  .mfp-figure:after{content: '';position: absolute;left: 0;top: 40px;bottom: 40px;display: block;right: 0;width: auto;height: auto;z-index: -1;box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);background: #444}
  .mfp-figure small{color: #BDBDBD;display: block;font-size: 12px;line-height: 14px}
  .mfp-figure figure{margin: 0}

.mfp-bottom-bar{margin-top: -36px;position: absolute;top: 100%;left: 0;width: 100%;cursor: auto}

.mfp-title{text-align: left;line-height: 18px;color: #F3F3F3;word-wrap: break-word;padding-right: 36px}

.mfp-image-holder .mfp-content{max-width: 100%}

.mfp-gallery .mfp-image-holder .mfp-figure{cursor: pointer}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px){/**
       * Remove all paddings around the image on small screen
       */
  .mfp-img-mobile .mfp-image-holder{padding-left: 0;padding-right: 0}
  .mfp-img-mobile img.mfp-img{padding: 0}
  .mfp-img-mobile .mfp-figure:after{top: 0;bottom: 0}
  .mfp-img-mobile .mfp-figure small{display: inline;margin-left: 5px}
  .mfp-img-mobile .mfp-bottom-bar{background: rgba(0, 0, 0, 0.6);bottom: 0;margin: 0;top: auto;padding: 3px 5px;position: fixed;box-sizing: border-box}
    .mfp-img-mobile .mfp-bottom-bar:empty{padding: 0}
  .mfp-img-mobile .mfp-counter{right: 5px;top: 3px}
  .mfp-img-mobile .mfp-close{top: 0;right: 0;width: 35px;height: 35px;line-height: 35px;background: rgba(0, 0, 0, 0.6);position: fixed;text-align: center;padding: 0} }

@media all and (max-width: 900px){.mfp-arrow{-webkit-transform: scale(0.75);transform: scale(0.75)}
  .mfp-arrow-left{-webkit-transform-origin: 0;transform-origin: 0}
  .mfp-arrow-right{-webkit-transform-origin: 100%;transform-origin: 100%}
  .mfp-container{padding-left: 6px;padding-right: 6px} }










