@charset "utf-8";

/* ========================================================================
	kill browser default
------------------------------------------------------------------------ */
html,body{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6,
p,blockquote,div,object,
ul,ol,li,dl,dt,dd{margin:0;padding:0;font-size:100%;font-weight:normal;}
ul,ol{list-style:none;}
dl dt{font-weight:normal;}
strong,em{font-weight:bold;font-style:normal;}
img{border:0 none;vertical-align:top;}
caption{text-align:left;}
th{font-weight:normal;text-align:left;}
hr{display:none;}


/* ========================================================================
	base style
------------------------------------------------------------------------ */
body{
background:#fff;
font-family:\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF, "Hiragino Kaku Gothic Pro", \30D2\30E9\30AE\30CE\89D2\30B4\20\50\72\6F\20\57\33, sans-serif;
font-size:12px;
line-height:1.66;
color:#666;
}

p {
margin-bottom: 25px;
}



/* ========================================================================
	Structure style
------------------------------------------------------------------------ */

#header {
width: 902px;
margin-left: -451px;
position:absolute;
top: 0;
left:50%;
}

#promotion {

}

#promotion-content {
width: 902px;
margin:0 auto 0 auto;
}

#content {
width: 902px;
margin:-61px auto 40px auto;
}

#footer {
background-color: #acacac;
clear: #fff;
}


/* ========================================================================
	Contents style
------------------------------------------------------------------------ */

/* header
----------------------------------------- */

#header p.id-site {
position: absolute;
top: 28px;
right: 0;
margin: 0;
}

/* promotion
----------------------------------------- */

#promotion {
min-width: 902px;
height: 779px;
background: url(/sp/pw10/images/bg-prom_01.jpg) top center no-repeat;
}

#promotion-content {
position: relative;
}

#promotion-content .img,
#promotion-content .catch-copy,
#promotion-content .description {
position: absolute;
}

/*----- .img -----*/

#promotion-content .img {
top: 262px;
right: 0;
}

#promotion-content .img h1 {
margin-bottom: 10px;
}

#promotion-content .img .price {
margin-bottom: 7px;
padding-right: 0;
text-align: right;
}

#promotion-content .img .date {
margin-bottom: 9px;
padding-right: 11px;
text-align: right;
}

#promotion-content .img ul.social {
text-align: right;
}

#promotion-content .img ul.social li {
display: inline;
margin-left: 13px;
}

#promotion-content .img ul.social li.twitter {
min-width:105px;
}


/*----- .catch-copy -----*/

#promotion-content .catch-copy {
top: 73px;
left: 17px;
}

#promotion-content .catch-copy ul {
margin-bottom: 5px;
padding-left: 43px;
*zoom:1;
}

#promotion-content .catch-copy ul:after {
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
}

#promotion-content .catch-copy ul li {
float: left;
margin-right: 13px;
}

#promotion-content .catch-copy p {

}

/*----- .description -----*/

#promotion-content .description {
top: 285px;
left: 17px;
}

#promotion-content .description ul.list1 {
padding-bottom: 8px
}

#promotion-content .description ul.list1 li {
margin-bottom: 18px;
}

#promotion-content .description ul.list2 {
*zoom:1;
}

#promotion-content .description ul.list2:after {
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
}

#promotion-content .description ul.list2 li {
float: left;
margin-right: 9px;
}

#promotion-content .description .btn {
margin-bottom: 27px;
text-align: center;
}







/* heading
----------------------------------------- */

h2.heading-l2-01{
margin-bottom: 18px;
}

h3.heading-l3-01{
margin-bottom: 38px;
padding-bottom: 3px;
border-bottom: 2px solid #c0c0c0;
}


/* text
----------------------------------------- */

p.lead-01 {
margin-bottom: 25px;
font-size: 14px;
}

p.discon {
text-align: center;
margin-top: 15px;
font-weight: bold;
color: #e20000;
padding: 4px;
background: #fff;
}

/* list-img-01 
----------------------------------------- */
ul.list-img-01 {
margin-right: -59px;
margin-bottom: 10px;
*zoom:1;
}

ul.list-img-01:after {
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
}

ul.list-img-01 li {
float: left;
margin-right: 59px;
}


/* list-note-01 
----------------------------------------- */
ul.list-note-01 {
margin-bottom: 8px;
line-height: 1.4;
}

ul.list-note-01 li {
display: inline;
font-size: 11px;
}


/* box-01 
----------------------------------------- */
div.box-01 {
position: relative;
padding:14px 14px 14px 14px;
border: 2px solid #9c9c9c;
}

div.box-01 .heading {
margin: -16px -16px 18px -16px;
background-color: #9c9c9c;
}

div.box-01 .text {
position: absolute;
top:62px;
left:589px;
}

/* section
----------------------------------------- */
.section{
margin-bottom: 50px;
}

.section h3{
margin-bottom: 3px;
}

.section h3.heading-l3-01{
margin-bottom: 38px;
}

/* group-section-01
----------------------------------------- */
.group-section-01{
*zoom:1;
}

.group-section-01:after{
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
}

.group-section-01 .section{
float: right;
width: 408px;
}

.group-section-01 .section:first-child{
float: left;
width: 408px;
}


/* layout-01
----------------------------------------- */
.layout-01{
padding-bottom:20px;
*zoom:1;
}

.layout-01:after{
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
}

.layout-01 .col{
float: left;
width: 550px;
}

.layout-01 .col:first-child{
float: right;
width: 280px;
padding-right: 41px;
}

.layout-01 .col:first-child h3{
margin-top: 40px;
margin-bottom: 8px
}

.layout-01 .col:first-child h3:first-child{
margin-top: 0;
}

.layout-01 .col:first-child p{
padding-left: 23px;
}


/* Table
----------------------------------------- */
table {
width: 100%;
margin-right: auto;
margin-bottom: 25px;
margin-left: auto;
border-collapse: collapse;
border-top: 2px solid #c0c0c0; 
font-size: 11px;
}

th, td {
empty-cells: show;
padding: 5px 10px 2px 10px;
font-weight: normal;
text-align: left;
vertical-align: top;
}

th {
border-right:2px solid #c0c0c0;
border-bottom:2px solid #c0c0c0; 
background-color: #e4e4e4;
}

td {
border-bottom:2px solid #c0c0c0; 
}


/* footer
----------------------------------------- */

#footer {
padding:16px 0 13px 0;
}

#footer p.copyright {
margin:0 auto 0 auto;
width:902px;
color:#fff;
font-size:14px;
text-align:right;
}





/* Support
----------------------------------------- */
.mb00{
margin-bottom:0!important;
}
.mb12{
margin-bottom:12px!important;
}
.alignC{
text-align:center;
}



/* ========================================================================
	hasLayout, clearfix
------------------------------------------------------------------------ */

h1, h2, h3, h4, h5, h6,
blockquote, div,
ul, ol, dl, dt, dd,
table, th, td,
form, fieldset, legend, label {
*zoom: 1;
}

ul li,
ol li {
*zoom: normal;
}

.clearfix{
*zoom:1;
}
.clearfix:after{
display: block;
clear: both;
height: 0;
visibility: hidden;
content: ".";
}
