/*=== Sloths CSS */

a:link {color:#000;text-decoration:none;}
a:visited {color:#000;text-decoration:none;}
a:hover {color:red;text-decoration:none;}
a:active {color:#000;text-decoration:none;}

body {width:100%;margin:0;font-size:11px;background:#2A3640 url(../images/bg.gif) repeat-x;padding:22px 0 5px;color:#333;}

* {font-style:normal;font-size:11px;font-family:tahoma,sans-serif;padding:0;margin:0;}
img,a img {border:0;}
.clear {height:0;overflow:hidden;clear:both;}
.btn {cursor:pointer;}
ul,ol {list-style:none;}
.left {float:left;}
.right {float:right;}


/*=== logo */
h1 {width:890px;margin:0 auto -82px;padding:10px 30px 0;position:relative;}
h1 a {display:block;background:url(../images/logo.gif) no-repeat;width:221px;height:71px;text-indent:-1000px;overflow:hidden;}
h2.slogan {height:77px;text-align:right;padding:0 30px;font-size:28px;color:#999;line-height:77px;font-family:"Times New Roman",arial,sans-serif;font-weight:normal;}

/*=== out */
.out {background:#fff url(../images/top.gif) repeat-x;width:948px;margin:0 auto;overflow:hidden;}
.corner_top,
.corner_top p,
.corner_bot,
.corner_bot p {clear:both;height:10px;overflow:hidden;background:url(../images/corner.gif) no-repeat;text-indent:-1000px;}
.corner_top p {background-position:right -10px;}
.corner_bot {background-position:0 -20px;}
.corner_bot p {background-position:right -30px;}

/*=== nav */
#nav {height:32px;line-height:32px;position:relative;z-index:10;}
#nav li {position:absolute;}
#nav li.f1 {left:0;}
#nav li.f2 {left:86px;}
#nav li.f3 {left:181px;}
#nav li.f4 {left:262px;}
#nav li.f5 {left:353px;}
#nav li.f6 {left:445px;}
#nav li.f7 {left:524px;}
#nav li.f8 {left:603px;}

#nav a {display:block;color:#fff;padding:0 20px;float:left;background:url(../images/nav.gif) right 0 no-repeat;}
#nav a:hover,#nav a.sp {background:url(../images/nav.gif) 0 -32px repeat-x;}

#nav li p {clear:both;display:none;width:120px;background:#369;border:2px #014B72 solid;border-top:0;border-bottom-width:1px;}
#nav li p a {line-height:15px;float:none;background:none;display:block;padding:8px 20px;border-bottom:1px #014B72 solid;}
#nav li p a:hover {background:#69c;}

/*=== features */
#features {width:100%;background:#0A0E11 url(../images/featured.gif) 0 250px repeat-x;color:#fff;height:330px;overflow:hidden;border-bottom:4px #C1C1C1 solid}
#features h2 {overflow:hidden;width:25%;background:url(../images/featured.gif) right -80px no-repeat;float:left;height:80px;color:#fff;cursor:pointer;}
#features h2.hover {background:url(../images/featured.gif) right -160px;}
#features h2.sp {background:url(../images/featured.gif) right -240px;}

#features h2 em {background-position:25px;background-repeat:no-repeat;font-weight:normal;display:block;font-size:14px;text-indent:85px;height:80px;line-height:80px;}
#features h2 em.f1 {background-image:url(../images/soft.gif);}
#features h2 em.f2 {background-image:url(../images/design.gif);}
#features h2 em.f3 {background-image:url(../images/qa.gif);}
#features h2 em.f4 {background-image:url(../images/global.gif);}

#features #banner {-moz-user-select:none;width:100%;height:250px;position:relative;overflow:hidden;}
#features ul {width:3800px;height:250px;position:absolute;left:0;}
#features ul li {width:950px;height:250px;float:left;background-position:97%;background-repeat:no-repeat;}
#features ul li.f1 {background-image:url(../images/f1.gif);}
#features ul li.f2 {background-image:url(../images/f2.gif);}
#features ul li.f3 {background-image:url(../images/f3.gif);}
#features ul li.f4 {background-image:url(../images/f4.gif);}

#features h3 {padding:30px 30px 10px;font-size:18px;font-family:arial;line-height:30px;}
#features ol {padding:0 190px 40px 60px;list-style:square;}
#features ol li {font-size:12px;line-height:20px;font-family:arial;float:none;width:auto;height:auto;color:#aaa;}
#features ol li h4 {display:inline;color:#fff;font:normal 22px "Times New Roman",tahoma,sans-serif;padding:0 5px;}

h2.title {border-bottom:3px #eee double;height:50px;line-height:50px;margin-bottom:15px;background:url(../images/h2_t.gif) 0 no-repeat;text-indent:50px;font-size:12px;}
h2.t0 {text-indent:0;background:none;padding:20px 0 15px;height:auto;line-height:13px;font-size:12px;font-weight:normal;}

/*=== info */
#info {height:280px;padding:0 20px;overflow:hidden;}
#info .contact { float:right; border-left:1px solid #ccc; width:220px; height: auto; padding:20px 0 20px 20px; margin-bottom:-10px; }
#info .contact a {color:#369;}
#info .contact a:hover {color:#000;}
.corner_bot {margin-top:-10px;}
#info .contact * {font-size:12px;}
#info .contact h2 {color:#578;padding-bottom:10px;font-size:14px;}
#info .contact h2.n {padding-top:15px;}
#info .contact p {line-height:18px;text-indent:15px;}

#info .project,#info .contents {color:#000;float:left;width:640px;font-size:12px;}
#info .project p {float:left;width:310px;}
#info .project p.n {float:right;display:none;}

#info .project p a.n {position:relative;margin-top:-170px;float:right;background:#f90;border:2px #fff solid;color:#fff;padding:5px;}
#info .project p a.n:hover {background:#f60;}

#info .project p a.s img {display:block;}
#info .project p a.s em.title {filter:alpha(opacity = 80);-moz-opacity:0.8;opacity:0.8;width:300px;position:absolute;margin-top:-50px;display:block;background:#fff;color:#930;font:bold 16px "Times New Roman",tahoma,sans-serif;}
#info .project p a.s:hover em.title span {display:none;}
#info .project p a.s em.title span {display:inline;position:static;}
#info .project p a.s span {height:0px;overflow:hidden;display:block;}
#info .project p a.s:hover span {position:absolute;height:auto;;z-index:100;cursor:pointer;display:block;width:300px;padding:5px 10px;filter:alpha(opacity = 90);-moz-opacity:0.9;opacity:0.9;background:#fff;color:#f60;margin-top:-135px;margin-left:85px;}
#info .project p a.s:hover span em {display:block;text-align:right;}

/*=== copyright */
#copyright {color:#fff;text-align:center;padding-top:10px;}
#copyright a {color:#fff;}
#copyright a:hover {color:#ccc;}

/*=== title */
#title {padding-top:18px;height:62px;background:#0A0E11;border-bottom:4px #ccc solid;overflow:hidden;
color:#999;font-size:22px;text-indent:50px;font-family:"Times New Roman",tahoma,sans-serif;}
#title h2 {padding-top:3px;font-size:13px;font-family:arial;font-weight:normal;}


/*=== detail */
#info.detail {height:auto;}
#info.detail .contact {height:auto;padding-bottom:50px;overflow:hidden;}
#info.detail #con.contact {padding-bottom:0;height:520px;}
#info.detail .contents {border-right:1px #ccc solid;padding-right:27px;padding-bottom:20px;margin-right:-1px;}
#info.detail .project ul.sitemap {width:260px;font-weight:bold;line-height:22px;padding-left:60px;float:left;}
#info.detail .project ul.sitemap li {text-indent:15px;background:url(../images/dot.gif) 0 8px no-repeat;}
#info.detail .project ul.sitemap ul {font-weight:normal;list-style:circle;padding-left:50px;}
#info.detail .project ul.sitemap ul li {background:none;}

#info.detail #infos {float:left;width:100%;padding-bottom:30px;}
#info.detail #infos .contact p {background:none;}

#info.detail #infos ul,
#info.detail #infos ol {float:left;}

#info.detail #infos ol {width:185px;padding-right:10px;}
#info.detail #infos ol li {overflow:hidden;background:url(../images/dot.gif) 3px no-repeat;cursor:pointer;margin-bottom:1px;}
#info.detail #infos ol li.hover,
#info.detail #infos ol li.sp {background-color:#eee;}
#info.detail #infos ol li.child {padding-bottom:10px;background:none;text-align:right;}
#info.detail #infos ol li.child p {padding-right:5px;font-size:10px;line-height:15px;}
#info.detail #infos ol li.child p.sp,
#info.detail #infos ol li.child p.hover{font-weight:bold;}
#info.detail #infos ol li h3 {padding:3px 0 3px 20px;}
#info.detail #infos ol li h3 a {color:#666;display:block;}
#info.detail #infos ol li.sp h3,
#info.detail #infos ol li.hover h3 {background:url(../images/li.gif) right 0 repeat-y;color:#000;}
#info.detail #infos ol li.sp h3 a,
#info.detail #infos ol li.hover h3 a {color:#000;}
#info.detail #infos ol li.case {padding:0 0 0 33px;line-height:20px;background:none;}
#info.detail #infos ol li.case h3 {background:none;}

#info.detail #infos ul {width:430px;overflow:hidden;float:right;}
#info.detail #infos ul li {display:none; list-style:none;}
#info.detail #infos ul li.sp {display:inline;line-height:24px;}

#info.detail #infos ul h3 {font-family:"Times New Roman",tahoma,sans-serif;font-size:20px;color:#036;padding:20px 0 5px;}
#info.detail #infos ul h4 {font-size:14px;font-family:"Times New Roman",tahoma,sans-serif;padding:15px 0 5px;color:#000;}
#info.detail #infos ul h4 a {font-size:14px;text-decoration:underline;}
#info.detail #infos ul p {padding:6px 0 6px 20px;line-height:15px;background:url(../images/dot.gif) 10px 12px no-repeat;}
#info.detail #infos ul p.s {padding:3px 0 3px 30px;background:url(../images/dot2.gif) 20px 8px no-repeat;color:#666;}
#info.detail #infos ul p.n {background:none;line-height:18px;padding:6px 0;}

#info.detail #infos ul h4.img {cursor:pointer;margin:15px 5px;overflow:hidden;width:202px;height:122px;float:left;text-align:right;position:relative;border:1px #f60 solid;padding:0;}
#info.detail #infos ul h4.img em {display:block;position:absolute;right:0;height:20px;line-height:20px;background:#f60;border-left:1px #fff solid;border-bottom:1px #fff solid;color:#fff;padding:0 10px;}
#info.detail #infos ul h4.img img {width:200px;height:120px;margin:1px;}
#info.detail #infos ul img.case_img {display:block;margin:10px 0;padding:1px;border:1px #ddd solid;}

#info.detail #infos ul p.prove {padding:5px;margin:5px 0;background:#cef;}
#info.detail #infos ul p.prove em {display:block;text-align:right;font-weight:bold;}

#info.detail .book {width:650px;overflow:hidden;float:left;}
#info.detail .book div {width:48%;overflow:hidden;}
#info.detail .book p,#info.detail .book h3 {font-size:16px;line-height:30px;background:none;padding-left:50px;}
#info.detail .book p a {font-size:16px;text-decoration:underline;}
#info.detail .book h3 {font-size:18px;padding:20px 30px;}
#info.detail .contact textarea {height:200px;width:98%;border:1px #369 solid;}
#info.detail .contact div {text-align:center;margin:10px 0;}
#info.detail .contact div.n {text-align:left;}
#info.detail .contact div .btn {background:#f90;color:#fff;padding:0 5px;margin:5px;border:1px #f60 solid;}
#info.detail .contact div .txt {width:120px;float:right;margin-top:-18px;border:1px #369 solid;}

.k_pagelist {float:left;display:table;clear:both;line-height:30px;}
.k_pagelist em {padding:2px;border:1px solid #E7E7E7;font-size:12px;margin:0px 1px;background:#F5F9FE;color:#14316B;font-weight:bold;font-style:normal;}
.k_pagelist strong {padding:2px;border:1px solid #E7E7E7;font-size:12px;margin:0px 1px;color:#009900;}
.k_pagelist a {padding:2px;border:1px solid #E7E7E7;font-size:12px;margin:0px 1px;}