@charset "shift_jis";

/*=========================================================

	Site Name: SONY WALKMAN
	File Name: software_common.css
	Info: new software page common css file

==========================================================*/

/* -------------------------------------------------------
	Basic Settings
------------------------------------------------------- */
ul {
	padding-left:0;
}

li {
	list-style:none;
}

#main-visual {
	margin-bottom:20px;
}

#main img {
	vertical-align:bottom;
}

#container #pagebody #pagetoparea {
	margin-top:40px;
}

/* -------------------------------------------------------
	Main Area Settings
------------------------------------------------------- */

.mod-brandTopImage {
	margin-bottom:0;
}

/* navigation */
.softwareNavi {
	margin-bottom:38px;
	background:url(../images/navi_b_bg.gif) no-repeat left bottom;
}
.softwareNaviBottom ul {
	background:url(../images/navi_b_shadow_2.gif) no-repeat left top;
	padding-top:5px;
}
.softwareNaviBottom ul li ul {
	background:none;
}
.softwareNavi ul li {
	float:left;
}
.softwareNavi ul li.navi00 {
	width:134px;
}
.softwareNavi ul li.navi01,
.softwareNavi ul li.navi02,
.softwareNavi ul li.navi03,
.softwareNavi ul li.navi04 {
float:left;
	width:204px;
}
.softwareNavi ul li ul {
	padding:9px 0 12px;
}
.pagenateBtn {
	margin-top:50px;
	margin-bottom:50px;
	text-align:center;
}

.pagenateTxt {
	display:none;
}

.mod-partsImage {
	margin-top:20px;
	margin-bottom:0;
}

.mod-subTitle {
	_margin-top:0 !important;
}

@media (max-width:640px) {
.mod-subTitle {
	margin-bottom:10px !important;
}

.mod-brandTopImage {
	margin-right:0 !important;
	margin-left:0 !important;
}

h3 {
	margin-top:0 !important;
	margin-bottom: 15px;
}

.mod-brandTopImage-extra h3,
.mod-seriesList-item2-text h3 {
	margin-bottom:15px;
}

.mod-brandTopImage-extra h3 {
	color:#4f7393;
}

.mod-brandTopImage-extra h3,
.mod-seriesList-item2-text h3 {
	margin-top:0 !important;
	margin-bottom:15px;
}

.mod-brandTopImage-extra-alternate {
	margin:15px 0 30px !important;
}

h4 {
	margin-bottom: 15px;
}

ul.notes {
	margin-bottom:0;
}

.pagenateBtn {
	width:300px;
	height:47px;
	margin:20px auto;
	text-align:left;
	background:url(../images/bg_btn01.gif);
}

.pagenateBtn a {
	color:#000;
	display:table-cell;
	vertical-align:middle;
	height:44px;
	padding:0 0 0 24px;
}

.pagenateBtn img {
	display:none;
}

.pagenateTxt {
	display:inline;
	font-size:90%;
}

}

.indentWrapper {
	padding:0 30px;
}
.separater  {
	margin-bottom:30px;
	padding-bottom:31px;
	background:url(../images/dotline.gif) no-repeat left bottom;
}

/* multi column settings */
.box1,
.box2,
.box3 {
	display:table-cell;
	vertical-align:top;
}

	/* for IE6-7 */
	* html .box1,
	* html .box2,
	* html .box3	{
		display:inline;
		zoom:1;
	}
	*:first-child+html .box1,
	*:first-child+html .box2,
	*:first-child+html .box3 {
		display:inline;
		zoom:1;
	}

.box1W635 .box1 {
	width:635px;
	 padding-right:30px
}
.box1W635 .box2 {
	width:225px
}
.box1W490 .box1 {
	width:490px;
	 padding-right:30px
}
.box1W490 .box2 {
	width:370px
}
.box1W357 .box1 {
	width:357px;
	 padding-right:30px
}
.box1W357 .box2 {
	width:503px
}
.box1W426 .box1 {
	width:426px;
	 padding-right:30px
}
.box1W426 .box2 {
	width:434px
}
.box1W426 .box1 h4 {
	margin-top:0
}
.box1W426 .box2 h4 {
	margin-top:0
}
.box1W293 .box1 {
	width:597px;
	 padding-right:30px
}
.box1W293 .box2 {
	width:293px
}
.box1W572 .box1 {
	width:572px;
	 padding-right:30px
}
.box1W572 .box1 h4 {
	margin-top:0
}
.box1W572 .box2 {
	width:348px
}
.box1W136 .box1 {
	width:136px;
	 padding-right:30px
}
.box1W136 .box2 {
	width:724px
}

@media (max-width:640px) {
.box1W635 .box1,
.box1W635 .box2,
.box1W490 .box1,
.box1W490 .box2,
.box1W357 .box1,
.box1W357 .box2,
.box1W426 .box1,
.box1W426 .box2,
.box1W293 .box1,
.box1W293 .box2,
.box1W572 .box1,
.box1W572 .box2,
.box1W136 .box1,
.box1W136 .box2 {
	float:none;
	display:block;
	width:auto !important;
	 padding:0 !important
}

.box1W635 .box1 img,
.box1W635 .box2 img,
.box1W490 .box1 img,
.box1W490 .box2 img,
.box1W357 .box1 img,
.box1W357 .box2 img,
.box1W426 .box1 img,
.box1W426 .box2 img,
.box1W293 .box1 img,
.box1W293 .box2 img,
.box1W572 .box1 img,
.box1W572 .box2 img,
.box1W136 .box1 img,
.box1W136 .box2 img {
	display:block;
	 margin:0 auto !important
}

}
/* software support */
.softwareSupport {
	background:url(../images/foot_02.gif) no-repeat left bottom;
	padding-bottom:11px;
	margin-bottom:30px;
}

.softwareSupport h3 {
	margin-bottom:0;
	height:31px;
}
.softwareSupportInner {
	border-left:1px solid #d4d9df;
	border-right:1px solid #d4d9df;
	background:#f2f2f2;
	padding:15px 30px 4px;
}
.softwareSupport .box1 {
	padding-right:20px;
	width:351px;
}
.softwareSupport .box2 {
	background:url(../images/foot_line.gif) repeat-y left top;
	padding:0 20px 0 21px;
	width:237px;
}
.softwareSupport .box3 {
	background:url(../images/foot_line.gif) repeat-y left top;
	padding-left:21px;
	width:218px;
}
.softwareSupport .box1 ul li,
.softwareSupport .box2 ul li,
.softwareSupport .box3 ul li {
	background:url(../images/foot_arrow.gif) no-repeat left 0.4em;
	padding-left:12px;
}
.softwareSupport .box2 p,
.softwareSupport .box3 p {
	margin-bottom:10px;
}

.imgCenter {
	margin-top:20px;
	text-align:center;
}
.notes {
	margin-top:20px;
	font-size:86%;
}
.notes li {
	padding-left:1.5em;
	text-indent:-1.5em;
}
.indent2em li {
	padding-left:2em;
	text-indent:-2em;
}


/* clearfix */
.softwareNavi ul:after {
	content: ".";
	display: block;
	height: 0;
	font-size:0.1em;
	line-height:0;
	clear: both;
	visibility: hidden;
}
.softwareNavi ul {
	zoom: 1;
}

@media (max-width:640px) {
.notes {
	margin-top:15px;
	color:#999999;
}

.softwareSupport {
	background:none;
	padding-bottom:6px;
}

.softwareSupport h3 {
padding:5px 10px;
height:auto;
color:#fff;
background:none;
padding-bottom:6px;
background-image: linear-gradient(bottom, rgb(100,112,125) -1%, rgb(123,134,145) 47%, rgb(149,159,168) 100%);
background-image: -o-linear-gradient(bottom, rgb(100,112,125) -1%, rgb(123,134,145) 47%, rgb(149,159,168) 100%);
background-image: -moz-linear-gradient(bottom, rgb(100,112,125) -1%, rgb(123,134,145) 47%, rgb(149,159,168) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(100,112,125) -1%, rgb(123,134,145) 47%, rgb(149,159,168) 100%);
background-image: -ms-linear-gradient(bottom, rgb(100,112,125) -1%, rgb(123,134,145) 47%, rgb(149,159,168) 100%);

background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(-0.01, rgb(100,112,125)),
	color-stop(0.47, rgb(123,134,145)),
	color-stop(1, rgb(149,159,168))
);
border-top-left-radius: 4px;
-webkit-top-left-border-radius: 4px;
-moz-border-radius-topleft: 4px;
border-top-right-radius: 4px;
-webkit-top-right-border-radius: 4px;
-moz-border-radius-topright: 4px;
}

.softwareSupport .box1,
.softwareSupport .box2,
.softwareSupport .box3{
	display:block;
	background:none;
	padding-left:0;
	width:100% !important;
}

.softwareSupport .box2 p,
.softwareSupport .box3 p {
	margin-top:10px;
	padding-top:10px;
	border-top:solid 1px #d4d9df;
	margin-bottom:5px;
	width:auto !important;
}

.softwareSupportInner {
	border:1px solid #d4d9df;
	border-top:0;
	background:#f2f2f2;
	padding:10px 10px 0;
	border-bottom-left-radius: 4px;
	-webkit-bottom-left-border-radius: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	-webkit-bottom-right-border-radius: 4px;
	-moz-border-radius-bottomright: 4px;
}

.softwareSupport .box1 ul li, .softwareSupport .box2 ul li, .softwareSupport .box3 ul li {
    margin:0 5px;
	padding-left: 12px;
}

}

/* -------------------------------------------------------
	For Index Page Settings
------------------------------------------------------- */
.index .softwareNavi {
	background:url(../images/navi_a_bg.gif) no-repeat left bottom;
}
.interfaceColorList {
	margin-right: -25px;
	padding-bottom:30px;
}
.interfaceColorList li {
	float: left;
	margin-top: 15px;
	margin-right: 25px;
	width: 280px;
}

.interfaceColorList li {
	vertical-align: middle;
}

.interfaceColorList li span {
	padding: 5px;
	font-size: 77%;
	color: #666;
	display: block;
	text-align: center;
}

@media (max-width:640px) {

.indentWrapper {
    padding: 0;
	margin:0 5px;
}

.interfaceColorList li {
	margin-right: auto;
	float: none;
	text-align:center;
	/*width:100%;*/
}
.interfaceColorList li img {
	margin:auto;
}

}

/* -------------------------------------------------------
	For feat1 Page Settings
------------------------------------------------------- */
.absoluteLayout {
	position:relative;
}
.absoluteLayout .itemText {
	position:absolute;
	top:0;
	right:0;
	width:425px;
}
.absoluteLayout .item1 {
	margin-bottom:20px;
	width:425px;
}
.absoluteLayout .item2 {
	position:absolute;
	top:229px;
	left:455px;
	width:40px;
	height:27px;
	background:url(../images/feat1_img_04_a1.gif) no-repeat;
}
.absoluteLayout .item3 {
	position:absolute;
	top:164px;
	left:495px;
	width:425px;
}
.absoluteLayout .item4 {
	position:absolute;
	top:413px;
	left:455px;
	width:40px;
	height:27px;
	background:url(../images/feat1_img_04_a2.gif) no-repeat;
}
.absoluteLayout .item5 {
	width:425px;
}

@media (max-width:640px) {
.absoluteLayout .itemText,
.absoluteLayout .item1, 
.absoluteLayout .item2, 
.absoluteLayout .item3, 
.absoluteLayout .item4, 
.absoluteLayout .item5 {
	position:relative;
	top:0;
	left:0;
	width:auto;
	text-align:center;
}

.absoluteLayout .itemText {
	text-align:left;
}

.absoluteLayout .item2, .absoluteLayout .item4 {
	height:40px;
	background:url(../images/feat1_img_04_a3.gif) no-repeat center top;
}

.separater {
    background:none;
}

}

/* -------------------------------------------------------
	For feat3 Page Settings
------------------------------------------------------- */
.indentInner {
	padding-left:30px;
}


/* -------------------------------------------------------
	For feat4 Page Settings
------------------------------------------------------- */
.lifeXColumn {
	margin:30px 0 40px;
	padding-bottom:4px;
	background:url(../images/columnbg_bottom.jpg) no-repeat left bottom;
}
.lifeXColumnInner {
	padding:17px 20px 13px;
	background:#e7eef4 url(../images/columnbg_top.gif) no-repeat left top;
}
.lifeXColumn .box1W131 .box1 {
	width:131px;
	 padding:30px 30px 10px 0
}
.lifeXColumn .box1W131 .box2 {
	width:689px
}

@media (max-width:640px) {
.lifeXColumn {
	margin:30px 0;
	padding-bottom:4px;
	background:url(../images/columnbg_bottom.jpg) no-repeat left bottom;
}
.lifeXColumnInner {
	padding:17px 20px 13px;
	background:#e7eef4 url(../images/columnbg_top.gif) no-repeat left top;
}
.lifeXColumn .box1W131 .box1,
.lifeXColumn .box1W131 .box2 {
	display:block;
	width:auto
}

.lifeXColumn .box1W131 .box1 {
	line-height:0;
	 padding:0
}

}

/**
 * .mod-homeFeatuerdImage
 */
.mod-homeFeatuerdImage {
  width: 950px;
  margin: 15px auto 0;
	 }
  .mod-homeFeatuerdImage img {
    display: block;
	 }

.mod-column2 .mod-column2-main {
    width: 950px;
}

@media (max-width:640px) {
  .mod-homeFeatuerdImage {
    width: auto;
    margin: 1px 0 20px;
	 }
    .mod-homeFeatuerdImage img {
      max-width: 100%;
      height: auto;
}

}

/**
 * .mod-homeProductList
 */

.mod-homeProductList {
  clear: both;
  *zoom: 1;
}
  .mod-homeProductList:after {
    content: '';
    display: block;
    clear: both;
    height: 0;
}
  .mod-homeProductList ul.mod-homeProductList-main {
    margin: 0 0 0;
    padding: 0;
    list-style: none;
	background:url(../images/navi_b_bg.gif) no-repeat left bottom;
	padding-bottom:11px;
    *zoom: 1;
 }

html*.mod-homeProductList ul.mod-homeProductList-main {
	padding-bottom:1px;
}

#index .mod-homeProductList ul.mod-homeProductList-main {
	background:url(../images/navi_a_bg.gif) no-repeat left bottom;
}
    .mod-homeProductList ul.mod-homeProductList-main:after {
      content: '';
      display: block;
      clear: both;
      height: 0;
	 }
    .mod-homeProductList ul.mod-homeProductList-main li {
      margin: 0 0 1px 0;
      padding: 0;
      float: left;
	 }

.mod-homeProductList ul.mod-homeProductList-main li.navi00 {
	width:134px;
}

.mod-homeProductList ul.mod-homeProductList-main li.navi01,
.mod-homeProductList ul.mod-homeProductList-main li.navi02,
.mod-homeProductList ul.mod-homeProductList-main li.navi03,
.mod-homeProductList ul.mod-homeProductList-main li.navi04 {
	width:204px;
}

.mod-homeProductList ul.mod-homeProductList-main .mod-homeProductList-main-image ul {
	padding-top:9px
}

    #index .mod-homeProductList ul.mod-homeProductList-main li {
      width: 237px
}
    #index .mod-homeProductList ul.mod-homeProductList-main li.navi01,
    #index .mod-homeProductList ul.mod-homeProductList-main li.navi03 {
	width:238px;
}

    #index .mod-homeProductList ul.mod-homeProductList-main li ul {
      padding-top:9px
}
html*#index .mod-homeProductList ul.mod-homeProductList-main li ul {
      padding-top:3
}
    .mod-homeProductList ul.mod-homeProductList-main li ul {
      padding:0
}
    .mod-homeProductList ul.mod-homeProductList-main li ul li {
      height: 40px;
	  margin:0;
      float:none
}
    .mod-homeProductList ul.mod-homeProductList-main a {
      color: #000;
      text-decoration: none;
}
  .mod-homeProductList .mod-homeProductList-main-text {
    width: 0;
    height: 0;
    overflow: hidden;
}
  .mod-homeProductList {
    margin-bottom:40px !important;
}

  .mod-homeProductList .mod-homeProductList-main-image img {
    display: block;
}

@media (max-width:640px) {

    .mod-homeProductList {
	margin-bottom:30px !important;
	 }
    .mod-homeProductList ul.mod-homeProductList-main {
	padding-bottom:0;
	    
	display:none;
	 }
    #index .mod-homeProductList ul.mod-homeProductList-main {
	display:block;
    border: 1px solid #ccc;
    -webkit-border-radius: 4px;
    border-radius: 4px;
	background:none;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	 }
    #index .mod-homeProductList ul.mod-homeProductList-main li {
      position: relative;
      float: none;
      display: table;
      width: auto;
      height: auto;
      width: 100% !important;
      background: url(/share2/images/mod-homeProductList/bg_01.png) no-repeat 100% 50%;
	 }

.mod-homeProductList ul.mod-homeProductList-main li .mod-homeProductList-text-subheading a {
    height: 50px;
    padding: 5px 10px;
    vertical-align: middle;
}



    .mod-homeProductList ul.mod-homeProductList-main li.navi01,
    .mod-homeProductList ul.mod-homeProductList-main li.navi03 {
	width:100%;
	}
    .mod-homeProductList ul.mod-homeProductList-main li ul {
	  width:100%;
      padding:0
}
    .mod-homeProductList ul.mod-homeProductList-main li ul li {
	  width:100%;
      height: 40px;
      float:none
}
    .mod-homeProductList ul.mod-homeProductList-main li + li {
      border-top: 1px solid #ccc;
	 }
    .mod-homeProductList ul.mod-homeProductList-main li:first-child {
      border-radius: 3px 3px 0 0;
	 }
    .mod-homeProductList ul.mod-homeProductList-main li:last-child {
      border-radius: 0 0 3px 3px;
	 }
    .mod-homeProductList ul.mod-homeProductList-main a {
      display: table-cell;
      width: 100%;
      vertical-align: middle;
      height: 50px;
      padding: 5px 10px 5px 80px;
	 }
  .mod-homeProductList .mod-homeProductList-main-image {
    width: 70px;
    height: 50px;
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -25px;
	 }
  .mod-homeProductList .mod-homeProductList-main-text {
    width: auto;
    height: auto;
    padding-top: 5px;
    -webkit-transition: opacity 0.3s ease-in;
    -moz-transition: opacity 0.3s ease-in;
    -ms-transition: opacity 0.3s ease-in;
    -o-transition: opacity 0.3s ease-in;
    transition: opacity 0.3s ease-in;
	 }
  .mod-homeProductList a:hover .mod-homeProductList-main-text {
    opacity: .5;
	 }
  .mod-homeProductList .mod-homeProductList-main-text-subject {
    font-size: 1.143em;
	 }
  .mod-homeProductList .mod-homeProductList-main-text-subheading {
    font-size: 0.857em;
    display: block;
}

}

.mod-softwareTitle h3 {
	border-bottom:none;
	width:950px;
}

.mod-softwareTitle h3 img,
.mod-softwareTitle h4 img {
	display:block;
}

.mod-softwareTitle h3 span.txt,
.mod-softwareTitle h4 span.txt {
	display:none;
}



@media (max-width:640px) {
.mod-displayNone,
.mod-softwareTitle h3 img,
.mod-softwareTitle h4 img
 {
	display:none !important;
}

.mod-softwareTitle h3 span.txt,
.mod-softwareTitle h4 span.txt {
	display:block !important;
}

.mod-softwareTitle h3 {
	padding:0 5px;
	width:auto;
    border-bottom: 1px solid #CCCCCC;
}

.mod-softwareTitle h4 {
	padding:0 5px;
	width:auto;
    border-left:5px solid #CCCCCC;
}

.mod-pageTop {
	margin-bottom:20px;
}

}

.mod-localNav{
	display:none
}

@media (max-width:640px){
.mod-localNav{
	line-height:1.1;
	display:block;
	width:auto !important;
	margin:20px 10px !important;
	vertical-align:middle;
	border:1px solid #D3D2D2;
	padding:2px 6px 2px 16px;
	margin:0;
	background:url(/share2/images/mod-localNav/ico_05.png) no-repeat 100% 50%;
	-webkit-transition:opacity 0.3s ease-in;
	-moz-transition:opacity 0.3s ease-in;
	-ms-transition:opacity 0.3s ease-in;
	-o-transition:opacity 0.3s ease-in;
	transition:opacity 0.3s ease-in
}

.mod-localNav:before{
	content:"";
	display:inline-block;
	vertical-align:middle;
	height:2.4em;
	width:0;
	margin:0 0 0 -1em
}

.mod-localNav.js-localNav-on{
	background-image:url(/share2/images/mod-localNav/ico_04.png)
}

.mod-localNav.js-localNav-on ul.mod-localNav-menulist{
	display:block
}

.mod-localNav.js-localNav-off{
	opacity:.5
}

.mod-localNav h3{
	color:#333;
	font-size:0.857em;
	display:inline-block;
	vertical-align:middle;
	margin:0 !important;
	padding:0;
	background:none
}

.mod-localNav h3:after{
	content:"" !important
}

.mod-localNav ul.mod-localNav-menulist{
	display:none;
	position:absolute;
	z-index:5;
	left:10px;
	right:10px;
	padding:20px 10px 0;
	margin:6px 0 0;
	background:#EEEDEE
}

.mod-localNav ul.mod-localNav-menulist li{
	line-height:1.2;
	margin:0 0 5px;
	padding:0 0 10px 10px;
	border-bottom:none;
	background:url(/share2/images/mod-localNav/ico_03.png) 0px 4px no-repeat
}

.mod-localNav ul.mod-localNav-menulist li.mod-localNav-menulist-current{
	font-weight:bold
}

.mod-localNav ul.mod-localNav-menulist li .mod-localNav-menulist-label{
	background:none
}
}

/*----------------------------------------------------------
	Common Module
-----------------------------------------------------------*/
/* margin */
.mt0 {
	margin-top:0 ! important
}
.mt10 {
	margin-top:10px ! important
}
.mt15 {
	margin-top:15px ! important
}
.mt20 {
	margin-top:20px ! important
}
.mt30 {
	margin-top:30px ! important
}
.mb0 {
	margin-bottom:0 ! important
}
.mb5 {
	margin-bottom:5px ! important
}
.mb10 {
	margin-bottom:10px ! important
}
.mb15 {
	margin-bottom:15px ! important
}
.mb20 {
	margin-bottom:20px ! important
}
.mb30 {
	margin-bottom:30px ! important
}
.mb40 {
	margin-bottom:40px ! important
}
.mb50 {
	margin-bottom:50px ! important
}
.mr27 {
	margin-right:27px ! important
}
.pr95 {
	padding-right:95px !important
}
.pb30 {
	padding-bottom:30px ! important
}
.dis_inl {
	display:inline !important
}

.mod-smp {
	display:none;
}

@media (max-width:640px) {
.smt0 {
	margin-top:0 ! important
}
.smt10 {
	margin-top:10px ! important
}
.smt15 {
	margin-top:15px ! important
}
.smt20 {
	margin-top:20px ! important
}
.smt30 {
	margin-top:30px ! important
}
.smb0 {
	margin-bottom:0 ! important
}
.smb5 {
	margin-bottom:5px ! important
}
.smb10 {
	margin-bottom:10px ! important
}
.smb15 {
	margin-bottom:15px ! important
}
.smb20 {
	margin-bottom:20px ! important
}
.smb30 {
	margin-bottom:30px ! important
}
.smb40 {
	margin-bottom:40px ! important
}
.smr27 {
	margin-right:27px ! important
}
.spl0 {
	padding-left:0 ! important
}
.spb0 {
	padding-bottom:0 ! important
}
.pr95 {
	padding-right:0 !important
}
.dis_inl {
	display:block !important
}

.mod-pc {
	display:none;
}

.mod-smp {
	display:block;
}

}

/* text-align */
.alignCenter {
	text-align:center
}
.alignRight {
	text-align:right
}

/* text-color */
.important {
	color:#ff0000;
}

/*clearfix*/
#contents:after,
.interfaceColorList:after,
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size:0.1em;
	line-height:0;
	clear: both;
	visibility: hidden;
}

#contents,
.interfaceColorList,
.clearfix {
	zoom: 1;
}
