@charset "utf-8";
/*
Theme Name: SSTW MobileBusiness
Description: SSTW MobileBusiness
Version: 1.0
Author: Takahiro Takeuchi
Author URI: 
*/
@import "reset.css";

/* COMMON CSS */
html {
	width: 100%;
	height: 100%;
	background: #fff;
}
body {
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	color: #222;
	width: 100%;
	height: 100%;
}
a {
	color: #a41823;
}
a:visited {
	color: #b34e58;
	text-decoration: none;
}
#wrapper01 {
	background: #fff url(images/gnavi_bg.gif) 0 105px repeat-x;
/* 	height: 100%; */
}
.subpage #wrapper01 {
	background: #fff url(images/bg_pagetitle.gif) 0 105px repeat-x;
/* 	height: 100%; */
}
body#solution #wrapper01 {
	background: url(images/bg_page.gif) 0 105px repeat-x;
/* 	height: 100%; */
}
body#solution #pagecontents {
	clear: both;
}
#main,
#footer {
	margin: 0 auto;
	width: 960px;
}
#main {
/* 	height: 100%; */
}
p.btn a {
	display: block;
	background: url(images/btn01.gif) 0 0 no-repeat;
	width: 152px;
	height: 36px;
	text-indent: -9999px;
}
p.btn a:hover {
	background: url(images/btn01.gif) 0 -36px no-repeat;
}


/* HEADER CSS */
#header {
	height: 105px;
	position: relative;
}
h1 {
	position: absolute;
	left: -9999px;
}
h2 {
	padding-top: 24px;
}
#header p.bnr {
	position: absolute;
	top: 10px;
	right: 30px;
	background: url(images/bnr_topShuukatsu_mo.gif) 0 0 no-repeat;
}
#header p.bnr a {
	display: block;
	width: 300px;
	height: 85px;
}
#header p.bnr a:hover img {
	display: none;
}

/* GNAVI & BNAVI CSS */
#gnavi {
	height: 40px;
	margin-bottom: 5px;
}
#gnavi li {
	float: left;
	font-size: 0.5px;
}
#gnavi li a {
	display: block;
	height: 40px;
	text-indent: -9999px;
}
#gnavi li#gn01 a {
	background: url(images/gnavi.gif) 0 0 no-repeat;
	width: 112px;
}
#gnavi li#gn02 a {
	background: url(images/gnavi.gif) -112px 0 no-repeat;
	width: 155px;
}
#gnavi li#gn03 a {
	background: url(images/gnavi.gif) -267px 0 no-repeat;
	width: 100px;
}
#gnavi li#gn04 a {
	background: url(images/gnavi.gif) -367px 0 no-repeat;
	width: 203px;
}
#gnavi li#gn05 a {
	background: url(images/gnavi.gif) -570px 0 no-repeat;
	width: 176px;
}
#gnavi li#gn01 a:hover,
body#home #gnavi li#gn01 a {
	background: url(images/gnavi.gif) 0 -40px no-repeat;
}
#gnavi li#gn02 a:hover,
body#solution #gnavi li#gn02 a {
	background: url(images/gnavi.gif) -112px -40px no-repeat;
}
#gnavi li#gn03 a:hover,
body#apps #gnavi li#gn03 a {
	background: url(images/gnavi.gif) -267px -40px no-repeat;
}
#gnavi li#gn04 a:hover,
body#information #gnavi li#gn04 a {
	background: url(images/gnavi.gif) -367px -40px no-repeat;
}
#gnavi li#gn05 a:hover {
	background: url(images/gnavi.gif) -570px -40px no-repeat;
}
#bnavi {
	clear: both;
	height: 20px;
	margin-bottom: 15px;
	padding-left: 10px;
	font-size: 13px;
}
#bnavi li {
	float: left;
	margin-right: 3px;
}
#bnavi li a:after {
	content: " >";
}

/* VISUAL CSS */
#visual {
	clear: both;
	height: 465px;
	position: relative;
}
#top_img {
	position: absolute;
	width: 350px;
	top: 0;
	left: 610px;
}


/* twitterArea CSS */

ol.tweetable_latest_tweets {
	font-size: 14px;
}
li.tweetable_item {
	padding: 10px;
	border-bottom: 1px dotted #666;
}
#badge {
	position: absolute;
	top: 200px;
	right: 0;
	width: 50px;
	height: 191px;
}
ol.tweetable_latest_tweets {
	margin-bottom: 20px;
}

/* ---------------------------------------------------- */
/* SLIDESHOW
/* ---------------------------------------------------- */
#slideshow {
	width: 590px;
}

#slideshow ul {
margin: 0;
padding: 0;
list-style-type: none;
height: 1%; /* IE fix */}

#slideshow ul:after {
content: ".";
clear: both;
display: block;
height: 0;
visibility: hidden;
}


.slides .li {
}
.slides li img {
	display: block;
	margin: 0 auto;
	padding-top: 15px;
}
.slides li h3 {
	margin-bottom: 5px;
	padding: 0 25px;
	font-size: 30px;
	font-weight: bold;
	line-height: 1.2em;
	color: #333;
}
.slides li p {
	padding: 0 25px;
	font-size: 14px;
}

.slides li p.btn {
	float: right;
	margin: 10px auto;
}

/* ---------------------------------------------------- */
/* SLIDESHOW > SLIDES
/* ---------------------------------------------------- */
#slideshow .slides {
	overflow: hidden;
	width: 590px;
}

#slideshow .slides ul {
	width: 2880px;
}

#slideshow .slides li {
	background: url(images/bg_slide.gif) center top no-repeat;
	width: 590px;
	height: 393px;
	float: left;
}

#slideshow .slides h2 {
	margin-top: 0;
}

/* ---------------------------------------------------- */
/* SLIDESHOW > NAVIGATION
/* ---------------------------------------------------- */
#slideshow .slides-nav {
	padding-top: 10px;
	text-align: center;
}

#slideshow .slides-nav li {
	font-size: 9px;
	display: inline;
}

#slideshow .slides-nav li a {
	color: #CCC;
	padding: 2px;
	outline: none;
	text-decoration: none;
}

.js #slideshow .slides-nav li.on,
.js #slideshow .slides-nav li.on a {
	color: #666;
}

.js #slideshow .slides-nav li.on a {
}

#slideshow ul:after {
content: ".";
clear: both;
display: block;
height: 0;
visibility: hidden;}            



/* CONTENT CSS  */
#top_content {
	clear: both;
	float: left;
	width: 590px;
}
#top_content h3 {
	clear: both;
	margin-bottom: 20px;
	background: url(images/title_nolink.gif) 0 0 no-repeat;
	height: 55px;
	color: #9f1621;
}
#top_content h3 span {
	display: block;
	font-size: 28px;
	padding: 8px 8px;
	text-indent: 24px;
	font-weight: bold;
	vertical-align: bottom;
	text-shadow: 0 1px #fff;
}
#top_content h3 a {
	display: block;
	background: url(images/title_link.gif) 0 0 no-repeat;
	height: 55px;
	text-decoration: none;
}
#top_content ul {
	padding-bottom: 15px;
	padding-left: 10px;
}

#top_content li {
	float: left;
	padding-bottom: 15px;
	margin-left: 3px;
}
#top_content .img {
	float: left;
	background: url(images/img_recommend.gif) 0 0 no-repeat;
	width: 150px;
	height: 270px;
	position: relative;
}
#top_content .img img {
	width: 103px;
	height: 156px;
	position: absolute;
	top: 42px;
	left: 24px;
}
#top_content .post {
	float: right;
	margin-bottom: 20px;
	width: 420px;
}
#top_content .post h4 {
	margin-bottom: 10px;
	padding-bottom: 5px;
	font-size: 26px;
	background: url(images/pattern01.gif) left bottom repeat-x;
}
#top_content .post p {
	font-size: 90%;
	margin-bottom: 10px;
}
#top_content p.btn {
	float: right;
}

#description form {
	padding: 20px 0;
}
#description dl.mailform dt,
#description dl.mailform dd {
	padding: 5px 0;
	margin: 0;
}
#description dl.mailform dt {
	clear: both;
	float: left;
	padding: 5px 3px;
	font-size: 12px;
	width: 150px;
	vertical-align: bottom;
}
#description dl.mailform dd {
	float: right;
	width: 240px;
	margin-bottom: 5px;
}
#description dl.mailform dd input,
#description dl.mailform dd textarea {
	border: 1px solid #ccc;
	padding: 5px 3px;
	font-size: 16px;
	width: 230px;
}
#description dl.mailform p {
	clear: both;
	margin-top: 10px;
	padding-top: 10px;
	text-align: center;
	border-top: 1px solid #ededed;
}
#description dl.mailform p input {
	font-size: 14px;
	padding: 10px;
	width: 80px;
}


#description form span.wpcf7-form-control-wrap input {
}

/* TOPSIDE CSS */
#top_side {
	float: right;
	width: 350px;
}
#top_side h3 {
	margin-bottom: 12px;
	background: url(images/title_side.gif) 0 0 no-repeat;
	height: 55px;
	color: #9f1621;
}
#top_side h3 span {
	display: block;
	font-size: 30px;
	padding: 12px 8px;
	text-indent: 24px;
	font-weight: bold;
	vertical-align: bottom;
	text-shadow: 0 1px #fff;
	font-family: Arial ;
}
#top_side dl {
	margin-bottom: 20px;
}
#top_side dt {
	padding: 5px 5px 0;
	font-size: 12px;
}
#top_side dd {
	padding: 0 5px 5px;
	border-bottom: 1px dotted #808080;
	text-indent: 0.5em;
}

/* SIDEBAR CSS */
#sidebar {
	float: right;
	padding-top: 8px;
	width: 220px;
	height: auto;
}
#sidebar .titlearea img {
	display: block;
	margin: 0 auto;
}
#sidebar .titlearea img.cfg_img {
	width: 53px;
	height: 53px;
}
.inner {
	padding: 10px;
}


/* BASIC INFO CSS */
.block01 {
	margin-bottom: 15px;
	background: url(images/bg_sidecontent.png) left bottom no-repeat;
	font-size: 12px;
}
.basicinfo h3 {
	background: url(images/title_basicinfo.png) 0 0 no-repeat;
	height: 34px;
	text-indent: -9999px;
}
.basicinfo dl {
	margin-bottom: 10px;
}
.basicinfo dt {
	clear: both;
	float: left;
	margin-right: 0.5em;
}
.basicinfo ul {
	display: block;
	height: 85px;
}
.basicinfo li {
	float: left;
	margin-left: 5px;
}


/* RECENT CSS */
.recent h3 {
	background: url(images/title_recent.png) 0 0 no-repeat;
	height: 40px;
	text-indent: -9999px;
}
.recent .list {
	clear: both;
	margin-bottom: 10px;
	/*padding-bottom: 10px;*/
	border-bottom: 1px dotted #ccc;
	min-height: 53px;
}
.recent .list:last-child {
	border-bottom: none;
	margin-bottom: 0; 
}
.recent .list img {
	float: left;
	display: block;
	margin-right: 10px;
	padding-bottom: 10px;
	width: 53px;
}
.recent .list dt {
	font-size: 12px;
	font-weight: bold;
	overflow: hidden;
	margin-bottom: 3px;
	text-shadow: 0 1px #fff;
}
.recent .list dd {
	font-size: 10px;
}
.recent .list dd p {
}


/* APPS CSS */
body#apps #bnavi {
	margin-bottom: 7px;
}
body#apps #category_content .titlearea {
	margin-bottom: 5px;
}
body#apps #category_content .titlearea h3 {
	background: url(images/icon_apps.png) 0 5px no-repeat;
	height: 77px;
	color: #333;
	font-size: 40px;
}
body#apps #category_content .titlearea h3 span {
	display: block;
	padding: 5px 0 0 80px;
}
*html body#apps #category_content .titlearea h3 span {
	padding-top: 15px;
	vertical-align: bottom;
}
#postmain .posttitle img.cfg_img {
	width: 80px;
	height: 80px;
}
#postmain .posttitle img.cfg_img {
	float: left;
	margin-right: 10px;
}
#postmain .posttitle h3 {
	margin-bottom: 5px;
	padding-top: 5px;
	font-size: 30px;
	color: #000;
}
#postmain .posttitle img {
	margin-right: 0.5em;
}
#postmain .posttitle p {
	font-size: 14px;
}
#postmain .postread {
	clear: both;
	margin-bottom: 15px;
	padding: 10px 0;
	font-size: 13px;
	border-bottom: 1px dotted #ccc;
}
.mail h3 {
	background: url(images/title_info.png) 0 0 no-repeat;
	height: 40px;
	text-indent: -9999px;
}
.mail h4 {
	margin-bottom: 5px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #ccc;
}
#mailform01 dt{
	font-size: 10px;
}
#mailform01 dd {
	padding-right: 5px;
}
#mailform01 dd input {
	margin-bottom: 3px;
	padding: 3px;
	width: 100%;
	border: none;
	font-size: 14px;
}
#mailform01 dd textarea {
	margin-bottom: 5px;
	padding: 3px;
	width: 100%;
	border: none;
		font-size: 14px;
	height: 100px;
}
.titlearea p.btn {
	font-size: 14px;
}

/* INFORMATION CSS */
body#information #bnavi {
	margin-bottom: 7px;
}
body#information #category_content .titlearea {
	margin-bottom: 10px;
}
body#information #category_content .titlearea h3 {
	background: url(images/icon_information.png) 0 5px no-repeat;
	height: 77px;
	color: #333;
	font-size: 40px;
} 
body#information #category_content .titlearea h3 span {
	display: block;
	padding: 5px 0 0 80px;
}
*html body#information #category_content .titlearea h3 span {
	padding-top: 15px;
	vertical-align: bottom;
}
body#information #category_content .posttitle p {
	font-family: "Myriad Pro Semibold", Helvetica, "Arial Bold";
	font-size: 13px;
	font-weight: bold;
	color: #b21a26;
	line-height: 1em;
}
body#information #category_content .posttitle h3 {
	margin: 0;
	font-size: 28px;
	line-height: 1em;
	color: #343434;
}


/* SOLUTION CSS */
body#solution #bnavi {
	margin-bottom: 7px;
}
body#solution #page_content {
	width: 960px;
	height: 100%;
}
body#solution #page_content .titlearea {
	margin-bottom: 10px;
}
body#solution #page_content .titlearea h3 {
	background: url(images/icon_solution.png) 0 5px no-repeat;
	height: 77px;
	color: #333;
	font-size: 40px;
}
body#solution #page_content .titlearea h3 span {
	display: block;
	padding: 5px 0 0 80px;
}
*html body#solution #page_content .titlearea h3 span {
	padding-top: 15px;
	vertical-align: bottom;
}
#page_content .titlearea {
	padding-left: 15px;
}
#page_content #page_visual {
	height: 370px;
}
#page_content #page_visual .img {
	float: left;
	width: 200px;
}
#page_content #page_visual h3 {
	margin-bottom: 10px;
	background: url(images/h2_sol_visual.png) 200px 30px no-repeat;
	text-indent: -9999px;
	height: 173px;
}
*html #page_content #page_visual h3 {
	background: url(images/h2_sol_visual.png) 0 30px no-repeat;
}
#page_content #page_visual p {
	padding: 0 20px;
}
.contentblock {
	clear: both;
}
.salespoint {
	float: left;
	margin: 0 10px;
	background: url(images/bg_sol_salespoint.gif) center bottom no-repeat;
	width: 300px;
	height: 411px;
}

*html .salespoint {
	margin: 0 8px;
}

.salespoint h4 {
	text-indent: -9999px;
}
.salespoint img {
	display: block;
	margin: 15px auto;
	width: 269px;
}
.salespoint p {
	padding: 0 15px;
}
.point01 h4 {
	background: url(images/h3_sol_sales01.gif) 0 0 no-repeat;
	width: 300px;
	height: 40px;
}
.point02 h4 {
	background: url(images/h3_sol_sales02.gif) 0 0 no-repeat;
	width: 300px;
	height: 40px;
}
.point03 h4 {
	background: url(images/h3_sol_sales03.gif) 0 0 no-repeat;
	width: 300px;
	height: 40px;
}
.contentblock {
}
.basic p.min {
	font-size: 80%;
	color: #666;
	font-weight: bold;
}
.basic h4 {
	margin-bottom: 5px;
}
.dev-flow {
	padding-top: 15px;
}
.dev-flow h4 {
	background: url(images/title_sol_dev.gif) 0 0 no-repeat;
	width: 235px;
	height: 65px;
	text-indent: -9999px;
}
.dev-flow img {
	display: block;
	margin: 0 auto;	
}
.dev-flow p {
	padding: 0 15px;
}
.module {
	padding-top: 15px;
}
.module h4 {
	background: url(images/title_sol_mod.gif) 0 0 no-repeat;
	width: 291px;
	height: 65px;
	text-indent: -9999px;
}
.module ul {
	padding: 15px 0 0;
}
.module li {
	float: left;
	margin: 0 10px 20px;
}
*html .module li {
	margin: 0 8px 10px;
}
.module p {
	padding: 0 15px;
}
.info {
}
.info h4 {
	background: url(images/title_sol_info.gif) 0 0 no-repeat;
	width: 262px;
	height: 65px;
	text-indent: -9999px;
}
.info p {
	padding: 0 15px;
}
.info .left {
	float: left;
	width: 460px;
}
.info .right {
	float: right;
	width: 480px;
	
}
.info .right ul {
	padding-bottom: 15px;
}
.info .right li {
	float: left;
	margin: 0 20px 20px 0;
	width: 220px;
	height: 110px;
}


/* 404 CSS */
body#nf #category_content .titlearea {
	margin-bottom: 10px;
}
body#nf #category_content .titlearea h3 {
	background: url(images/icon_404.png) 0 0 no-repeat;
	height: 77px; 
	color: #333;
	font-size: 40px;
} 
body#nf #category_content .titlearea h3 span {
	padding-left: 80px;
}


/* SINGLE CSS */
.subpage #bnavi {
	margin-bottom: 5px;
}


body#apps #category_content .titlearea h3 {
	background: url(images/icon_apps.png) 0 5px no-repeat;
	height: 77px;
	color: #333;
	font-size: 40px;
}
body#apps #category_content .titlearea h3 span {
	padding-left: 80px;
}
#category_content {
	clear: both;
	float: left;
	padding-left: 15px;
	width: 700px;
}

#single_content {
	clear: both;
	float: left;
	padding-left: 15px;
	width: 700px;
	height: auto;
}
#single_content .titlearea img {
	display: block;
	float: left;
	margin-right: 10px;
}
#single_content .titlearea img.cfg_img {
	width: 80px;
	height: 80px;
}
.titlearea {
	height: 91px;
	margin-bottom: 0px;
}
.titlearea h3 {
	/*padding-top: 5px;*/
	font-size: 36px;
	color: #b11a26;
	font-weight: bold;
	font-family: "Myriad Pro Semibold","Arial Bold";
}
.left-content {
	float: left;
	width: 300px;
}
#iphoneimage {
	margin-bottom: 15px;
	background: url(images/img_appmonitor01.png) center bottom no-repeat;
	height: 503px;
	width: 281px;
	position: relative;
}
#iphoneimage img {
	width: 211px;
	height: 315px;
}
#iphoneimage IMG {
    position:absolute;
    top: 91px;
    left: 38px;
    z-index:8;
    opacity:0.0;
}

#iphoneimage IMG.active {
    z-index:10;
    opacity:1.0;
}

#iphoneimage IMG.last-active {
    z-index:9;
}

#update {
	clear: both;
	margin-bottom: 15px;
	background: #f2f2f2;
	width: 280px;
	border-radius: 10px;		/* CSS3草案 */
	-webkit-border-radius: 10px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 10px;	/* Firefox用 */
}
#update h3 {
	display: block;
	padding: 10px 10px 5px 10px;
	font-weight: bold;
	line-height: 1em;
	text-shadow: 0 1px #fff;
	font-size: 22px;
	border-bottom:1px solid #ccc;
}
#update p {
	padding: 5px 10px 10px;
	font-size: 10px;
}

#description {
	float: right;
	padding-top: 10px;
	width: 400px;
	color: #222;
}
#description h4 {
	margin-bottom: 5px;
	padding-bottom: 5px;
	line-height: 130%;
	font-size: 32px;
	font-weight: bold;
	background: url(images/pattern01.gif) left bottom repeat-x;
	color: #333;
}
#description h5 {
	margin: 10px 0 7px;
	padding-bottom: 3px;
	font-weight: bold;
	border-bottom: 1px dotted #ededed;
	color: #000080;
}
#description p {
	text-indent: 1em;
}
#description p,
#update p {
	font-size: 14px;
	line-height: 1.8em;
}
#description ul:nth-child li {
	margin-bottom: 20px;	
	padding-left: 5px;
}
#description ul {
	padding-left: 25px;
}
#description li {
	margin-bottom: 7px;
	font-size: 14px;
	list-style: disc;
	line-height: 1.5em;
}
#description ul.star {
	padding-left: 0;
}
#description ul.star li {
	list-style: none;
	background: url(images/star.png) 0 1px no-repeat;
	padding-left: 25px;
}
#description dt {
	margin-bottom: 10px;
	font-weight: bold;
	color: #a78649;
}
#description dd {
	margin-bottom: 15px;
	line-height:200%;
	font-size: 14px;
}


/* FOOTER CSS */
#wrapper02 {
	clear: both;
	background: #f2f2f2 url(images/bg_footer.gif) 0 0 repeat-x;
}
#footer {
	clear: both;
	position: relative;
	height: 140px;
}
#footer ul {
	height: 40px;
	margin-bottom: 40px;
	padding-top: 3px;
}
#footer li {
	float: left;
	margin-right: 20px;
	font-family: "Myriad Pro Semibold", Helvetica, "Arial Bold";
}
#footer li a {
	display: block;
	padding: 11px 0;
	color: #4d4d4d;
	font-weight: bold;
	text-decoration: none;
}
#footer li a:hover {
	color: #666;
}
address {
	clear: both;
	font-size: 0.5px;
}
address a {
	display: block;
	background: url(images/text_copyright.gif) 0 0 no-repeat;
	width: 442px;
	height: 17px;
	text-indent: -9999px;
}
#footer p.bnr {
	position: absolute;
	top: 55px;
	left: 768px;
}


/* Easy Slider */

#slider .item {
	margin:0;
	padding:0;
}
#slider .item { 
/* 
	define width and height of list item (slide)
	entire slider area will adjust according to the parameters provided here
*/ 
	width:590px;
	height:393px;
	overflow:hidden; 
}	
#prevBtn,
#nextBtn,
#slider1next,
#slider1prev { 
	display:block;
	width:30px;
	height:77px;
	position:absolute;
	left:-30px;
	top:71px;
	z-index:1000;
}	
#nextBtn,
#slider1next { 
	left:696px;
}														
#prevBtn a,
#nextBtn a,
#slider1next a,
#slider1prev a {  
	display:block;
	position:relative;
	width:30px;
	height:77px;
	background:url(../images/btn_prev.gif) no-repeat 0 0;	
}	
#nextBtn a,
#slider1next a { 
	background:url(../images/btn_next.gif) no-repeat 0 0;	
}	
	
/* numeric controls */	

ol#controls{
	margin:1em 0;
	padding:0;
	height:28px;	
}
ol#controls li{
	margin:0 10px 0 0; 
	padding:0;
	float:left;
	list-style:none;
	height:28px;
	line-height:28px;
}
ol#controls li a{
	float:left;
	height:28px;
	line-height:28px;
	border:1px solid #ccc;
	background:#DAF3F8;
	color:#555;
	padding:0 10px;
	text-decoration:none;
}
ol#controls li.current a{
	background:#5DC9E1;
	color:#fff;
}
ol#controls li a:focus,
#prevBtn a:focus,
#nextBtn a:focus {
	outline:none;
}

/* // Easy Slider */


/* clear fix CSS */
hr {
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
	overflow: hidden;
}
.clear:after {
	content: ".";
	display: block;
	visibility: hidden;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	clear: both;
}