@charset "UTF-8";

/* .info_nenmatsu
---------------------------------------------------- */

#suntory_contents dl.info_nenmatsu{
width:100%;
background-color:#fff;
border:1px solid #669900;
-webkit-border-radius:6px;
display:table;
margin:15px 0;
padding:0;
}
#suntory_contents dl.info_nenmatsu dt{
font-size:14px;
color:#fff;
text-align:center;
text-shadow:none;
white-space:nowrap;
float:none;
background-color:#669900;
-webkit-border-top-left-radius:2px;
-webkit-border-bottom-left-radius:2px;
display:table-cell;
margin:0;
padding:5px;
}
#suntory_contents dl.info_nenmatsu dd{
font-size:16px;
text-align:center;
float:none;
display:table-cell;
margin:0;
padding:5px 0;
}
#suntory_contents dl.info_nenmatsu dd a{
font-weight:normal;
color:#2489CE;
text-decoration:underline;
}


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

#list{
}

#list dl{
border:1px solid #aba792;
-webkit-border-radius:3px;
}
#list dt a{
display:block;
color:#fff;
font-size:20px;
line-height:1.4;
font-weight:bold;
position:relative;
text-shadow:-1px -1px 1px rgba(0,0,0,0.3);
padding:8px 0 8px 75px;
}
#list dt a:after {
	content:"";
	position:absolute;
	right:12px;
	top:50%;
	display:block;
	width:5px;
	height:5px;
	margin-top:-5px;
	border-top:solid 2px #fff;
	border-right:solid 2px #fff;
	-webkit-transform:rotate(45deg);
}
#list dt.supplement a{
letter-spacing:-0.08em;
background:url(../img/top/list_supplement.png) no-repeat 10px center,-webkit-gradient(linear, center top, center bottom, from(#ffb64d), to(#f57300));
-webkit-background-size:59px 34px,auto;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:3px;
}
#list dt.skincare a{
background:url(../img/top/list_skincare.png) no-repeat 6px center,-webkit-gradient(linear, center top, center bottom, from(#ffb64d), to(#f57300));
-webkit-background-size:58px 35px,auto;
}
#list dt.healthgoods a{
background:url(../img/top/list_healthgoods.png) no-repeat 10px center,-webkit-gradient(linear, center top, center bottom, from(#ffb64d), to(#f57300));
-webkit-background-size:59px 34px,auto;
}

#list dd a{
display:block;
color:#0066aa;
font-size:18px;
font-weight:bold;
border-bottom:1px solid #aba792;
padding:14px 20px 14px 10px;
position:relative;
background:#fff;
-webkit-background-size:14px 14px;
}
#list dd:last-child a{
border:none;
-webkit-border-bottom-left-radius:3px;
-webkit-border-bottom-right-radius:3px;
}
#list dd a span{
font-size:16px;
}
#list dd a:after {
	content:"";
	position:absolute;
	right:12px;
	top:50%;
	display:block;
	width:5px;
	height:5px;
	margin-top:-5px;
	border-top:solid 2px #ff7802;
	border-right:solid 2px #ff7802;
	-webkit-transform:rotate(45deg);
}


/* #mypage
---------------------------------------------------- */

p#mypage a{
display:block;
font-size:18px;
font-weight:bold;
color:#333;
margin:14px 0;
border:1px solid #aba792;
background:-webkit-gradient(linear, center top, center bottom, from(#fff), to(#dfddd2));
-webkit-border-radius:3px;
position:relative;
padding:10px;
}
p#mypage a:after {
	content:"";
	position:absolute;
	right:12px;
	top:50%;
	display:block;
	width:5px;
	height:5px;
	margin-top:-5px;
	border-top:solid 2px #ff7802;
	border-right:solid 2px #ff7802;
	-webkit-transform:rotate(45deg);
}


/* #whatsnew
---------------------------------------------------- */

#whatsnew1 {
}
.whatsnew {
}
.whatsnew h2 {
padding:0;
font-size:18px;
color:#333!important;
border:1px solid #aba792;
background:-webkit-gradient(linear, center top, center bottom, from(#fff), to(#dedcd1));
padding:10px;
}
.whatsnew h2 span {
vertical-align:top;
background-color:#fe7702;
color:#fff;
font-size:12px;
line-height:1.1;
font-weight:bold;
-webkit-border-radius:8px;
padding:1px 8px;
margin:2px 0 0 5px;
display:inline-block;
}

.whatsnewInner {
clear:both;
background:#fff;
border-right:1px solid #aba792;
border-bottom:1px solid #aba792;
border-left:1px solid #aba792;
-webkit-border-bottom-left-radius:4px;
-webkit-border-bottom-right-radius:4px;
}

.backnumber{
margin:0 10px 10px;
clear:both;
background:#fff;
border-top:1px solid #aba792;
border-right:1px solid #aba792;
border-left:1px solid #aba792;
-webkit-border-radius:4px;
}

.whatsnew dd span{
color:#6c6c6c;
font-size:14px;
font-weight:bold;
}
.whatsnew dd span.contents{
vertical-align:middle;
border:1px solid #7ba723;
color:#7ba723;
font-size:7px;
font-weight:bold;
padding:1px 2px;
-webkit-border-radius:3px;
margin-left:10px;
}
.whatsnew dd span.cp,
.whatsnew dd span.prd,
.whatsnew dd span.cont{
vertical-align:middle;
font-size:7px;
font-weight:bold;
padding:1px 2px;
-webkit-border-radius:3px;
margin-left:10px;
}
.whatsnew dd span.cp{
border:1px solid #ff5c33;
color:#ff5c33;
}
.whatsnew dd span.prd{
border:1px solid #ff7700;
color:#ff7700;
}
.whatsnew dd span.cont{
border:1px solid #96B84F;
color:#96B84F;
}
.whatsnew dd.pc a {
	display:block;
	color:#0066aa;
	font-size:16px;
	line-height:1.4;
	font-weight:bold;
	padding:10px 20px 10px 10px;
	border-bottom:1px solid #aba792;
	background:url(../img/top/icon_pc.png) no-repeat 98% center;
	-webkit-background-size:15px 14px;
}
.whatsnew dd.mobile a {
	display:block;
	color:#0066aa;
	font-size:16px;
	line-height:1.4;
	font-weight:bold;
	padding:10px 20px 10px 10px;
	border-bottom:1px solid #aba792;
	position:relative;
}
.whatsnew dd.mobile a:after {
	content:"";
	position:absolute;
	right:12px;
	top:50%;
	display:block;
	width:5px;
	height:5px;
	margin-top:-5px;
	border-top:solid 2px #ff7802;
	border-right:solid 2px #ff7802;
	-webkit-transform:rotate(45deg);
}
.whatsnew dd a.nolink {
	color:#6c6c6c!important;
}
.whatsnew dd a em {
	font-size:12px;
	font-style:normal;
}
.whatsnew p a{
display:block;
text-align:right;
font-size:16px;
font-weight:bold;
color:#0066aa;
-webkit-border-radius:3px;
padding:10px 25px 10px 0;
position:relative;
}
.whatsnew p a:after {
	content:"";
	position:absolute;
	right:12px;
	top:50%;
	display:block;
	width:5px;
	height:5px;
	margin-top:-5px;
	border-top:solid 2px #ff7802;
	border-right:solid 2px #ff7802;
	-webkit-transform:rotate(45deg);
}

.disasterMessage{
	margin-bottom:15px;
	padding:12px;
	background-color:#fff;
}

.disasterMessage .massageTitle{
	font-weight: bold;
}

.disasterMessage p{
	font-size:14px;
	line-height:1.4;
}