@charset "UTF-8";

/**
* common
*--------------------------------------------------*/

.peripheral-item {
	float: left;
	width: 278px;
	margin: 12px 0 0 13px;
}

.peripheral-item .new-item {
	
}

.peripheral-item-list .onsale {
	display: block;
	height: 20px;
}

.peripheral-item-list .first {
	margin-left: 0 !important;
}

.peripheral-item-wrap {
	border: #dbdbdb 1px solid;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	background-color: #FFF;
	position: relative;
}

.peripheral-item-wrap a {
	display: block;
	position: absolute;
	text-indent: -9999px;
	width: 276px;
	height: 100%;
	top: -1px;
	left: -1px;
	z-index: 5;
}

.peripheral-info {
	padding-bottom: 2px;
	min-height: 100px;
	position: relative;
	z-index: 1;
}

.peripheral-info img {
	float: left;
	z-index: 1;
}

.peripheral-item-list .item-codename,
.peripheral-item-list .item-price,
.peripheral-item-list .item-title {
	width: 170px;
	float: right;
}
.peripheral-item-list .item-price,
.peripheral-item-list .item-title {
	font-weight: bold;
}
.peripheral-item-list .item-price {
	line-height: 1.5em;
	z-index: 4;
}
.peripheral-item-list .item-codename {
	font-size: 85%;
	color: #666666;
	z-index: 3;
}
.peripheral-item-list .item-title {
	margin-top: 2px;
	margin-right: 3px;
	z-index: 2;
	padding-top: 4px;
}

.new-item .item-title {
	background: url('/common/img/peripheral/item_new.png') no-repeat top right;
	min-height: 32px;
	height: auto !important;
	height: 32px;
	padding: 3px 32px 0 0;
	width: 138px;
}

/**
* list, page
*--------------------------------------------------*/
#peripheral-wrap {
	margin-bottom: 19px;
	border: 1px solid transparent;
	* border: 0px solid transparent;
}

/**
* 左カラム
*/
#left-area {
	width: 237px;
	float: left;
}

#left-area .group-bottom {
	background: url("/common/img/peripheral/peripheral_left_foot.png") no-repeat top left;
	font-size: 0;
	width: 219px;
	height: 2px;
	margin-bottom: 20px;
}
#tp-peripheral-categories,
#official-peripheral-categories {
	position: relative;
	background: url('/common/img/peripheral/peripheral_left_bg.png') repeat-y 0 0;
}
#tp-peripheral-categories ul,
#official-peripheral-categories ul {
	padding: 14px 0 9px 0;
	margin-left: 13px;
}

#tp-peripheral-categories li,
#official-peripheral-categories li {
	width: 221px;
	height: 42px;
	margin: 0 0 4px 0;
}

#tp-peripheral-categories li a,
#official-peripheral-categories li a {
	display: block;
	width: 221px;
	height: 42px;
}
#tp-peripheral-categories li a.current,
#official-peripheral-categories li a.current,
#tp-peripheral-categories li a:hover,
#official-peripheral-categories li a:hover {
	background-position: 0 -42px !important;
}

/**
* 右カラム
*/
#right-area {
	width: 619px;
	float: right;
}

#right-area .peripheral-item {
	width: 306px;
	margin: 6px 0 0 6px;
}
#right-area .peripheral-item-wrap a {
	width: 304px;
	top: -1px;
	left: -1px;
}

#right-area .information-title {
	background: url('/common/img/peripheral/title_background_619.png') no-repeat 0 0;
}


#right-area .peripheral-item-list .item-codename,
#right-area .peripheral-item-list .item-price,
#right-area .peripheral-item-list .item-title {
	width: 195px;
}
#right-area .new-item .item-title {
	width: 163px;
}

/**
* top
*--------------------------------------------------*/
/**
* 新着情報
*/
#new-release .information-title {
	background: url('/common/img/peripheral/title_new_release.png') no-repeat 0 0 !important;
}

/**
* 各フォーマット周辺機器
*/
#sce-category {
	position: relative;
	margin-top: 19px;
}
#license-category ul,
#sce-category ul {
	margin: 12px 0 20px 0;
	width: 870px;
}
#license-category li,
#sce-category li {
	width: 209px;
	height: 42px;
	float: left;
	display: list-item;
	margin: 0 8px 8px 0;
	background: url('/common/img/peripheral/peripheral_category_none.png') no-repeat 0 0;
}

#license-category li a,
#sce-category li a {
	position: absolute;
	width: 207px;
	height: 40px;
	text-indent: -9999px;
}

/**
* オフィシャルライセンス商品
*/
#license-category .information-title {
	background: url('/common/img/peripheral/title_official_license.png') no-repeat 0 0 !important;
}

#license-description img {
	float: left;
	margin: 12px 10px 0 0;
}

#license-description p {
	float: left;
	color: #4c4c4c;
	margin-top: 14px;
}

/**
* list
*--------------------------------------------------*/

#category-title .information-title {
	background: url('/common/img/peripheral/title_peripheral_category_general.png') no-repeat 0 0;
	margin-bottom: 6px;
}


#discontinued-title {
	margin: 20px 0 8px 0;
}
#discontinued-title .information-title {
	background: url('/common/img/peripheral/title_peripheral_category_general.png') no-repeat 0 0;

}

#closed-model-wrap {
	width: 619px;
}

#closed-model-wrap ul li {
	display: block;
	float: left;
	background: #FFF url(/common/img/arrow.gif) no-repeat 0 5px;
	padding-left: 11px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	width: 290px;
	margin-bottom: 7px;
	margin-right: 7px;
}


/**
* page
*--------------------------------------------------*/

.wysiwyg-area {
	margin-bottom: 20px;
}

.news-general ul li a {
	width: 450px;
}

.news-wrap {
	width: 450px;
}
.news-general ul li a {
	display: inline !important;
	float: none !important;
	width: auto !important;
	background: none !important;
	padding: 0;
}
.news-general ul li a:link {
	color:#0077c8 !important;
}

.news-general ul li a:visited {
	color:#0077c8 !important;
}

.news-general ul li a:hover {
	color:#0077c8 !important;
	text-decoration:underline;
}

.news-general ul li a:active{
	color:#0077c8 !important;
	text-decoration:none;
}

.news-general ul li div,
.news-general ul li .news-wrap div ,
.news-general ul li .wysiwyg-area div {
	float: none;
	padding: 0;
	margin: 0;
}
.news-general ul li div.news-wrap {
	display: block;
	float: right;
	padding-left: 2px;
	margin: 0 0 5px 0;
}

#carousel-cover-image {
	background: #FFF url('/common/img/peripheral/peripheral_item_bg.jpg') no-repeat 5px 5px;
	height: 174px;
}

/**
* カルーセルなし
*-------------------------*/
#main-data-area {
	background-color: #FFF;
	margin-bottom: 11px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	border: #dcdcdc 1px solid;
	text-align: center;
}
#main-data-wrap {
	margin: 4px;
}
#main-data-wrap-sce {
	margin: 4px;
	background: #edeff1 url('/common/img/peripheral/peripheral_item_bg.jpg') no-repeat 0 0;
}
/** 2013.2.6 add START */
#main-data-area table {
	margin: 0 auto;
	opacity: 0;
	-webkit-transition: all 600ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	-moz-transition: all 600ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	-ms-transition: all 600ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	-o-transition: all 600ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	transition: all 600ms cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */
}


#main-data-area table.show {
	opacity: 1;
}
/** 2013.2.6 add END */

#main-data-area td {
	vertical-align: middle;
	padding: 12px 4px 12px 4px;
	text-align: center;
}

#product-main-image {
	width: 150px;
}

#product-info {
	min-width: 210px;
	width: auto;
}

#product-price span,
#product-name {
	font-size: 138.5%;
}
#product-name {
	font-weight: bold;
}
#product-price,
#product-maker,
#product-codename {
	font-size: 93%;
}
td#official-licensed-logo {
	width: 96px;
	text-align: center;
}
/** 2013.2.6 add START */
td#store-button-area,
td#store-button {
	position: static !important;
	text-align: center;
	width: 160px;
	display: none;
}

#store-button-area a {
	display: block;
	width: 139px;
	margin: 5px 0 0 10px;
	-webkit-transition: all 320ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	-moz-transition: all 320ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	-ms-transition: all 320ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	-o-transition: all 320ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
	transition: all 320ms cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */
}

#store-button-area a:hover,
#store-button a:hover {
	opacity: .7;
}

.store-info-area {
	display: none;
}

.store-button-show {
	display: block !important;
}
/** 2013.2.6 add END */

/**
* 詳細表示のパターン
*-------------------------*/
/**
* 画像表示パターン
*/

.item-useimage-pattern .item-useimage-wrap {
	border-left: #E5E5E5 1px solid;
	border-right: #E5E5E5 1px solid;
}
.item-useimage-pattern .inner {
	border: none;
	float: left;
}
.item-useimage-pattern ul li {
	width: 290px;
}
.item-useimage-pattern .image {
	float: right;
}

/**
* wysiwyg表示パターン
*/
.item-wysiwyg-pattern .wysiwyg-area {
	width: 100%;
}
.item-wysiwyg-pattern .wysiwyg-area {
	width: 100%;
}

/**
* key-value表示パターン
*/
.item-key-value-pattern {
	
}
/**
* シンプルリストパターン
*/

/**
* 関連商品
*/
#relation-item-area .information-title {
	margin-bottom: 4px;
}

/**
* 関連バナー
*/
#relation-banner-area {
	background: url(/common/img/peripheral/frame_foot_619.gif) no-repeat 0 bottom;
	padding-bottom: 3px;
	margin-top: 20px;
	position: relative;
}

#relation-banner-wrap {
	background: url(/common/img/peripheral/frame_head_619.gif) no-repeat 0 top;
}

#relation-banner-inner {
	border-left: #E5E5E5 1px solid;
	border-right: #E5E5E5 1px solid;
	padding: 5px 0 3px 0;
	margin: 0 !important;
}

#relation-banner-inner ul {
	background-color: #EDEFF0;
	width: 609px;
	position: relative;
	left: 4px;
	padding-bottom: 11px;
}

#relation-banner-inner ul li {
	float: left;
	width: 288px;
	height: 64px;
	margin: 11px 0 0 11px;
	display: inline;
}
#relation-banner-inner ul li a {
	display: block;
	position: absolute;
	width: 284px;
	height: 60px;
	text-indent: -9999px;
}

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

2013.10 override start

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

.peripheral-item-list .onsale {
	display: block;
	padding:5px;
	background-color:#F1F1F1;
	border:solid 2px #FFFFFF;
	border-bottom:none;
}

.peripheral-item-list li {
	background-color:#FFFFFF;
}

.peripheral-item-list li .peripheral-item-wrap{
	margin:2px;
}

.peripheral-item-list li.on .peripheral-item-wrap,
.peripheral-item-wrap a:hover {
	border: #003791 1px solid;
	width:272px;
}

#relation-banner-inner ul li a.on,
#relation-banner-inner ul li a:hover {
	border: #003791 2px solid;
}

.peripheral-item-list .item-codename,
.peripheral-item-list .item-price,
.peripheral-item-list .item-title {
	width: 169px;
}

.new-item .item-title {
	width: 137px;
}


/* 2013 12 02 edit start */


#right-area .peripheral-item-list li.on .peripheral-item-wrap,
#right-area .peripheral-item-wrap a:hover {
	border: #003791 1px solid;
	width:300px!important;
}

#closed-model-wrap{
	background-color:#FFFFFF;
	width:auto!important;
	padding:10px;
}

#closed-model-wrap li{
	width:280px!important;
}

/* 2013 12 02 edit end */

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

2013.10 override end

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