/* breadcrumb */

.breadcrumb {
    width: 960px;
    margin: 0 auto;
}

.breadcrumb li {
    float: left;
    margin-right: 5px;
}

.breadcrumb li a {
    color: #f00;
}

/* section */
.section {
    margin-bottom: 40px;
}

/* main-content-wrapper */
.main-content-wrapper {
    padding: 19px!important;
}

/* anchor */
.anchor li {
    float: left;
    margin-left: 8px;
}

.anchor li:first-child {
    margin-left: 0px;
}

/* items */
.items h2 {

}

.itemleft,
.itemright {
    float: left;
    height: 536px;
    position: relative;
}

.grid {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    z-index: 10;
    width: 100%;
    border: 1px solid #e0e0e0;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

.itemleft {
    width: 330px;
    margin-right: 12px;
}

.itemleft .grid {
    height: 530px;
}

.itemright {
    width: 540px;
}

.itemright p {
    margin-top: 10px;
    margin-bottom: 0;
}

.itemright p:first-child {
    margin-top: 0;
}

.itemright h3 {
    margin-top: 20px;
}

/* preview */
.preview img {
    position: absolute;
    top: 0;
    left: 0;
}

.preview .active {
    z-index: 1;
}

/* styling */
.stylingwrapp {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 540px;
}
.styling {
    margin-bottom: 0!important;
}

.styling .grid {
    height: 140px;
}

.styling .active .grid {
    border: 3px solid #f00;
}

.styling li {
    float: left;
    margin-right: 12px;
    margin-right: 12px;
    position: relative;
    cursor: pointer;
}

/* info */
.info {
    position: relative;
    clear: both;
}

/* size */
.size {
    float: left;
    margin-right: 20px;
}
.size p {
    margin-bottom: 3px;
}

.size .sizelink {
    text-align: right;
}

/* color */
.color {
  position: absolute;
  top: 0;
  left: 440px;
  margin-right: 20px;
}

.color p {
    margin-bottom: 3px;
}

.color .grid {
    height: 31px;
    border: none;
}

.color .active .grid {
    border: 3px solid #f00;
}

.color ul li {
    position: relative;
    float: left;
    width: 50px;
    margin-right: 4px;
    cursor: pointer;
    line-height: 1;
}

.color ul li img {
    vertical-align: bottom;
}

.color .off_white {
    position:relative;
    left: -7px;
}

.color.gradation {
    top: auto;
    bottom: 0;
}

/* table */
table{
	margin-bottom:10px;
	width:420px;
    font-size: 12px;
}
table th,
table td{
	padding:0px;
	border:1px solid #666;
}
table th{
	text-align:center;
	background-color:#ccc;
}
table td {
	text-align:center;
	background-color:#fff;
}
th.header01{
	color:#fff;
	background-color:#666;
	border:1px solid #ccc;
}
th.header01{
	color:#fff;
	background-color:#666;
	border-left:1px solid #666;
	border-top:1px solid #666;
	border-bottom:1px solid #ccc;
	border-right:1px solid #ccc;
}

th.header02{
	color:#fff;
	background-color:#ff0000;
	border-left:1px solid #ff0000;
	border-top:1px solid #ff0000;
	border-bottom:1px solid #ccc;
	border-right:1px solid #ccc;
}
th.header03{
	color:#fff;
	background-color:#0015b2;
	border-left:1px solid #0015b2;
	border-top:1px solid #0015b2;
	border-bottom:1px solid #ccc;
	border-right:1px solid #ccc;
}

table tr th:last-child{
	border-right:1px solid #666;
}

/* clearfix */
.clearfix:after {
    content: "";
    font-size: 0;
    visibility: hidden;
    display: block;
    clear: both;
}