﻿header{
height:55px;
}

#contents h1{
position:relative;
}

#contents h1 a{
position:absolute;
display:block;
width:100%;
height:100%;
background-image:url(../img/spacer.gif);
}

#contents p#suntory_ch{
margin:7px auto;
}

#contents p#app{
margin:7px auto;
}


/* whatsnew
---------------------------------------------------- */
#contents h2{
width:100%;
height:40px;
margin:0 auto;
}

#contents h2 span{
display:block;
font-size:14px;
color:#333;
padding:13px 0 13px 47px;
}

#contents h2.off{
border:1px solid #d0d0d0;
background:url(../img/icon_news.png) no-repeat 7px center,-webkit-gradient(linear, center top, center bottom, from(#fff), to(#ddd));
-webkit-border-radius:10px;
-webkit-background-size:25px 25px,auto;
margin-bottom:8px;
}

#contents h2.off span{
background:url(../img/arrow_d.png) no-repeat right center;
-webkit-background-size:34px 30px;
}

#contents h2.on{
border-top:1px solid #d0d0d0;
border-right:1px solid #d0d0d0;
border-left:1px solid #d0d0d0;
background:url(../img/icon_news.png) no-repeat 7px center,-webkit-gradient(linear, center top, center bottom, from(#fff), to(#ddd));
-webkit-border-top-left-radius:10px;
-webkit-border-top-right-radius:10px;
-webkit-background-size:25px 25px,auto;
}

#whatsnew{
width:100%;
border-bottom:1px solid #d7d3c6;
border-left:1px solid #d7d3c6;
border-right:1px solid #d7d3c6;
-webkit-border-bottom-left-radius:10px;
-webkit-border-bottom-right-radius:10px;
background-image: url(../img/bg_cp.png);
background-repeat: no-repeat, no-repeat;
background-position: top center;
-webkit-background-size:100% 10px;
margin-bottom:8px;
}

#whatsnew li{
background-image: url(../img/line.png);
background-repeat:no-repeat;
background-position:bottom center;
-webkit-background-size: 100% 10px;
}

#whatsnew li:last-child{
-webkit-border-bottom-left-radius:10px;
-webkit-border-bottom-right-radius:10px;
}

#whatsnew li:first-child a{
}

#whatsnew li:last-child a{
}

#whatsnew li a{
display:block;
color:#333;
padding:10px;
}

#whatsnew li img{
vertical-align:top;
width:25px;
height:10px;
margin:2px 0 0 5px;
}

#whatsnew li p{
font-size:12px;
line-height:150%;
font-weight:bold;
}

#whatsnew li p em{
font-size:12px;
font-style:normal;
color:#ff8800;
}





/* nav
---------------------------------------------------- */
nav ul{
width:100%;
height:34px;
}

nav ul li{
float:left;
text-align:center;
font-size:14px;
line-height:100%;
font-weight:bold;
letter-spacing:-1px;
white-space:nowrap;
}

nav ul li a{
display:block;
color:#333;
text-align:center;
border-top:1px solid #ddd;
border-right:1px solid #ddd;
border-left:1px solid #ddd;
background:-webkit-gradient(linear, center top, center bottom, from(#fff), to(#e3e3e3));
-webkit-border-top-left-radius:10px;
-webkit-border-top-right-radius:10px;
padding:10px 0;
}

nav ul li:nth-child(1){
width:22%;
}

nav ul li:nth-child(2){
width:32.3%;
}

nav ul li:nth-child(3){
float:right;
width:46%;
}

nav ul li.selected a{
color:#fff;
border:none;
background:-webkit-gradient(linear, center top, center bottom, from(#ffcc00), to(#ff9900));
}


/* newProducts
---------------------------------------------------- */

#newProducts{
width:100%;
background-image: url(../img/bg_news.png), url(../img/btm.png), url(../img/wrapper.png);
background-repeat: no-repeat, no-repeat,repeat-y;
background-position: top center, bottom center, center center;
-webkit-background-size: 100% 10px, 100% 10px, 100% auto;
}

#newProducts li{
background-image: url(../img/line.png);
background-repeat:no-repeat;
background-position:bottom center;
-webkit-background-size: 100% 10px;
}

#newProducts li:first-child a{
padding-top:10px;
}

#newProducts li:last-child{
background-image:none;
}

#newProducts li a{
display:block;
font-size:12px;
line-height:150%;
font-weight:bold;
color:#333;
background:url(../img/next.png) no-repeat center right;
-webkit-background-size:34px 25px;
padding:10px 40px 10px 10px;
}

#newProducts li span{
display:table-cell;
vertical-align:middle;
width:1%;
}

#newProducts li img{
width:50px;
height:50px;
margin-right:5px;
}

#newProducts li p{
display:table-cell;
vertical-align:middle;
}

#newProducts li p em{
font-size:12px;
font-style:normal;
color:#ff8800;
}








/* campaign
---------------------------------------------------- */
#campaign{
width:100%;
background-image: url(../img/bg_cp.png), url(../img/btm.png), url(../img/wrapper.png);
background-repeat: no-repeat, no-repeat,repeat-y;
background-position: top center, bottom center, center center;
-webkit-background-size: 100% 10px, 100% 10px, 100% auto;
}

#campaign li{
background-image: url(../img/line.png);
background-repeat:no-repeat;
background-position:bottom center;
-webkit-background-size: 100% 19px, auto;
}

#campaign li:first-child a{
padding-top:10px;
}

#campaign li:last-child{
background-image:none;
}

#campaign li:last-child a{
padding-bottom:1px;
}

#campaign li a{
display:block;
font-size:12px;
line-height:150%;
font-weight:bold;
color:#333;
background:url(../img/next.png) no-repeat center right;
-webkit-background-size:34px 25px;
padding:10px 40px 10px 10px;
}

#campaign li span{
display:table-cell;
vertical-align:top;
width:1%;
}

#campaign li img{
width:55px;
height:50px;
margin-right:5px;
}

#campaign li p{
display:table-cell;
vertical-align:middle;
}

#campaign li p em{
font-size:12px;
font-style:normal;
color:#ff8800;
}



/* products
---------------------------------------------------- */
#products{
width:100%;
background-image: url(../img/bg_prd.png), url(../img/btm_prd.png), url(../img/wrapper.png);
background-repeat: no-repeat, no-repeat,repeat-y;
background-position: top center, bottom center, center center;
-webkit-background-size: 100% 10px, 100% 10px, 100% auto;
padding-top:10px;
padding-bottom:1px;
}

#products h3{
color:#347ecb;
font-size:10px;
font-weight:bold;
background-color:#cce4f9;
-webkit-border-radius:6px;
margin:0 7px 7px 7px;
padding:10px;
}

#products ul:after{
display:block;
margin-top:-1px;
height:1px;
content:"";
clear:both;
}

#products ul{
margin:0 7px 5px 7px;
}

#products li{
width:49%;
font-size:11px;
font-weight:bold;
background:#ffffff;
border:1px solid #ddd;
-webkit-border-radius:6px;
margin-bottom:5px;
}

#products li.long{
width:100%;
}

#products li a{
display:block;
color:#ff8800;
background:url(../img/prd_next.png) no-repeat center right;
-webkit-background-size:14px 9px;
padding:8px 14px 8px 5px;
}

#products li:nth-child(odd){
float:left;
}

#products li:nth-child(even){
float:right;
}

#products li:last-child a{
}

#products li.odd{
float:left;
}



#contents p#link {
margin-bottom:15px;
font-size: 22px;
text-align: center;
}


/* toTop
---------------------------------------------------- */
p#toTop{
text-align:center;
}

p#toTop a{
display:block;
font-size:22px;
line-height:100%;
color:#0066cc;
padding-top:20px;
padding-bottom:20px;
}


