source: branches/version-2_11-dev/html/user_data/packages/sphone/css/common.css @ 20969

@charset "utf-8";

/* body
----------------------------------------------- */
body {
background: #fff;
background-position: 50% 0% fixed;
font-family: helvetica, Osaka;
font-size:medium;
margin: 0px 3.13% 10px;
padding: 0px;
-webkit-user-select: none;
-webkit-text-size-adjust: none;
-webkit-tap-highlight-color: rgba(51,102,204,0.70);
max-width: 100%;
}

/* 共通
----------------------------------------------- */
/* IE用hackここから */
.clearfix{
    zoom:100%;
}
/* IE用hackここまで */

.clearfix:after{
    display:block;
    clear:both;
    height:0px;
    visibility:hidden;
    content:".";
}


/* HTML default
----------------------------------------------- */
a {
    color: #3399cc;
    text-decoration: border;
}
form {
    margin: 0;
    padding: 0;
}
table,img,p {
    border: 0;
}
em {
    font-weight: bold;
    font-style: normal;
    color: #ff0000;
}
hr {
    display: none;
}
p {
    margin: 0 0 1em;
    padding: 0;
}
li {
list-style-type: none;
}
img {
vertical-align: bottom;
}
.hidden {
    display: none;
}
br.clear {
clear: both;
display: none;
font-size: 0px;
line-height: 0%;
height: 0px
}

/* クリアフィックス
----------------------------------------------- */
#block-login:after,
.block-center:after,
.listarea:after,
.recomendblock > div 
.whoboughtblock > div {
content: "";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/* font
----------------------------------------------- */
h1,h2,h3,h4,h5 {
font-size: 100%;
line-height: 150%;
}
.attention { color: #ff0000; }
.mini { font-size: 80%; }



/* wrapper
----------------------------------------------- */
div#wrapper {
margin: 0 auto;
padding: 0;
text-align: left;
background: #FFFFFF;
overflow: hidden;
}

/* 見出し (h2)
----------------------------------------------- */
h2 {
color:#4D576B;
font: bold 110% helvetica;
background:url(../img/common/line_01.gif) repeat-x left bottom;
/*text-shadow: 0px 1px 1px #ffffff;*/
margin: 0 0 10px 0;
padding:0 0 5px 0;
}

table th h2.product_name {
text-align:left;
margin: 5px 0;
color:#4D576B;
font: bold 110% helvetica;
background:#F0F0F0;
/*text-shadow: 0px 1px 1px #ffffff;*/
margin: 5px auto;
}

/* 見出し (h3)
----------------------------------------------- */
#mycontentsarea h3 {
color:#4D576B;
font: bold 100% helvetica;
/*text-shadow: 0px 1px 1px #ffffff;*/
}

/* ナビゲーションバー・ページタイトル
----------------------------------------------- */
#navigation_bar,
h2.title,
#title-list,
.title-mypagecolumn,
#windowarea h2,
#pan + h2 {
display: inline-block;
width: 106.8%;
margin: 0 0 1em -3.4%;
color: #ffffff;
text-shadow: 0px -1px 1px rgba(0,0,0,0.5);
font: bold 120% helvetica;
padding: 0.45em 0;
background-color: #333332;
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.25)), to(rgba(0,0,0,0.2)), color-stop(0.5, rgba(255,255,255,0.05)), color-stop(0.51, rgba(0,0,0,0.05)));
border-top: 1px solid rgba(255,255,255,0.3);
border-bottom: 1px solid rgba(0,0,0,1);
text-align:center;
vertical-align: middle;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

/* ページタイトル
----------------------------------------------- */
#navigation_bar > h2{
font: bold 100% helvetica;
color: #ffffff;
vertical-align: middle;
text-shadow: 0px -1px 1px rgba(0,0,0,0.5);
margin: 0;
display: inline-block;
max-width: 65%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-webkit-text-overflow: ellipsis;
}

/* header
----------------------------------------------- */
/* information
----------------------------------------------- */
/* navigation
----------------------------------------------- */
/* フレーム
----------------------------------------------- */
/* contents
----------------------------------------------- */

/* footer
----------------------------------------------- */
#pagetop {
width: 100%;
margin: 10px 0 0;
text-align: right;
}
#pagetop a{
color:#4D576B;
font: normal 100% helvetica;
text-shadow: 0px 1px 1px #ffffff;
text-decoration: underline;
}
div#footer {
    margin: 0;
    padding: 20px 0 0;
    text-align: center;
}

/* footer information
----------------------------------------------- */
#footer-menu {
text-align: left;
font: bold 100% helvetica;
}
#footer-menu li{
background: #ffffff url(../img/common/chevron.png) no-repeat right center;
}
#footer-navi {
float:left;
list-style:none outside none;
margin: 0 auto 4px;
padding: 0;
text-align:center;
width: 100%;
border: none;
background-color: transparent;
}
#footer-navi > li{
display: inline;
color:#4D576B;
font: normal 70% helvetica;
background-color: transparent;
/*text-shadow: 0px 1px 1px #ffffff;*/
border: none;
/*border-right: 1px dotted #999999;*/
/*-webkit-border-radius: 0;*/
line-height: 1.8em;
margin: 0;
padding: 0;
}
#footer-navi > li:last-child{
border-right: none;
}
#footer-navi > li > a {
margin: 0;
padding: 0;
display: inline;
color:#4D576B;
text-decoration:underline;
}
#copyright {
margin: 7px 0px;
color: #4D576B;
font: normal 70% helvetica;
/*text-shadow: 0px 1px 1px #ffffff;*/
text-align: center;
}
#copyright a{
color: #4D576B;
text-decoration: under-line;
}

/* ニュース
----------------------------------------------- */
/* おすすめ
----------------------------------------------- */

/* panlist
----------------------------------------------- */
div#pan {
display: none;
}

/* error
----------------------------------------*/

div .error {
    text-align:left;
    padding: 15px 0;
}


/* フォーム
----------------------------------------------- */
/*input[size="40"] {
width: 50%;
}*/
/*input[type="password"] {
width: 50%;
}*/
input[type="tel"] {
width: 3em;
}
input, tr, th, td {
max-width: 100%;
}
input {
font-size: 100%;
}
textarea{
font-size: 100%;
width: 95%;
}
form dl{
font: bold 100% helvetica;
margin: 10px 0;
}
form dt{
margin: 5px 0;
color:#4D576B;
font: bold 100% helvetica;
background-color: transparent;
/*text-shadow: 0px 1px 1px #ffffff;*/
border: none;
}
form dd{
margin:0;
background-color: rgba(255,255,255,0.3);
color: #999999;
list-style-type: none;
padding: 10px 7px;
}

body, p,
table, thead, tbody, th, td {
word-break: break-all;
}
table, thead, tbody {
white-space: normal;
overflow: hidden;
}

/* プライバシーポリシー
----------------------------------------------- */
ol {
padding-start:0;
-o-padding-start:0; 
-moz-padding-start:0;
-webkit-padding-start:0;
margin: 1em 3.13%;
}
ol > li.privacy_ol{
margin: 1em;
}
ol > li.privacy_ol > strong{
color:#4D576B;
font: bold 100% helvetica;
text-shadow: 0px 1px 1px #ffffff;
line-height: 2em;
}

/* 特定商取引に基づく表記
----------------------------------------------- */
#undercolumn_order dl{
margin: 0;
}
#undercolumn_order dt{
color:#4D576B;
font: bold 100% helvetica;
text-shadow: 0px 1px 1px #ffffff;
line-height: 2em;
}
#undercolumn_order dd,
#undercolumn_order ul {
padding-start:0;
-o-padding-start:0; 
-moz-padding-start:0;
-webkit-padding-start:0;
margin: 0 3.13%;
}

/* マイページ
----------------------------------------------- */
#welcome-message {
color: #4D576B;
text-shadow: 0px 1px 1px #ffffff;
}
.your-point {
display: inline-block;
padding: 0.1em;
text-align: right;
color: #ffffff;
width: 100%;
background-color: rgba(0,0,0,0.3);
margin-bottom: 5px;
}
.your-point em {
text-shadow: 0 0 2px #ffffff;
}
#btn-mypagetop {
width: 100%;
text-align: left;
-webkit-border-radius: 8px;
background: #ffffff url(../img/common/chevron.png) no-repeat right center;
border: solid 1px #cccccc;
margin: 10px 0;
}
#btn-mypagetop a {
display: inline-block;
margin: 7px 3.3%;
width: 93%;
color: black;
text-decoration: none;
font: bold 100% helvetica;
}

/* マイページ・購入履歴
----------------------------------------------- */
table[summary="購入履歴"] td:first-child {
width: 20%;
text-align: center;
}
table[summary="購入履歴"] tr[onclick] td:last-child {
background: #ffffff url(../img/common/chevron.png) no-repeat right center;
}
table[summary="お届け先の指定"] td:nth-child(2),
table[summary="購入履歴"] tr[onclick] td:last-child {
text-align: left;
}

/* 商品詳細・カート
----------------------------------------------- */
div#cartbtn_default {
text-align:center;
}

/*商品一覧ページ
-----------------------------------------------*/
.navi li {
width:100%;
display:inline;
}

p.listcomment {
font-size:90%;
}

/*規約内容
-----------------------------------------------*/
div#kiyaku_text {
padding:10px 0;
font-size:70%;
border-top-width: 1px;
border-right-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
border-top-style: solid;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-top-color: #cccccc;
border-right-color: #cccccc;
border-bottom-color: #cccccc;
border-left-color: #cccccc;
}