﻿@import url(reset.css);

/* 
---------------------------------------------------- */
body{
font-family:"HraKakuProN-W6", "HelveticaNeue";
line-height:1;
-webkit-text-size-adjust:none;
}
#suntory_contents{
background-color:#ffffff;
color:#223333;
padding:10px 0;
}

header{
text-align:center;
margin-bottom:10px;
}

#suntory_contents h1{
text-align:center;
margin:0 auto 10px auto;
}

#suntory_contents h1 span{
font-size:20px;
color:#669900;
background:url(../img/ico_cart.png) no-repeat 0 center;
padding:3px 0 0px 26px;
}

#container,
#loginContainer{
padding:0 10px 10px 10px;
}

#container .shoppingBox,
#loginContainer .shoppingBox{
background:#EDEBDC;
padding:10px 10px 1px 10px;
margin-bottom:10px;
-webkit-border-radius:6px;
}
#loginContainer .shoppingBoxErr{
background:#FFE3E3;
padding:10px 10px 1px 10px;
margin-bottom:10px;
-webkit-border-radius:6px;
}
#container dt{
font-weight:bold;
font-size:16px;
color:#886633;
padding:3px 0 3px 22px;
}
#container dt.key{
background:url(../img/ico_key.png) no-repeat 0 center;
}
#container dt.hajimete{
background:url(../img/ico_hajimete.png) no-repeat 0 center;
}

#suntory_contents input[type=text]{
height:24px;
}
#suntory_contents label[for="showPassword"].ui-btn-up-c,
#suntory_contents label[for="showPassword"].ui-btn-hover-c{
border:none;
background:#edebdc;
text-shadow:none;
display:inline-block;
margin:0;
}
#suntory_contents .shoppingBoxErr label[for="showPassword"].ui-btn-up-c,
#suntory_contents .shoppingBoxErr label[for="showPassword"].ui-btn-hover-c{
background:#ffe3e3;
}
#suntory_contents label[for="showPassword"] .ui-btn-inner{
border:none;
}

/*ボタン*/
#container p.btn_orng,
#loginContainer #submit,
#container #submit{
display:block;
border:1px solid #ff7701;
-webkit-border-radius:6px;
-moz-box-shadow:0 2px 4px rgba(0,0,0,.3);
-webkit-box-shadow:0 2px 4px rgba(0,0,0,.3);
box-shadow:0 2px 4px rgba(0,0,0,.3);
background:-webkit-gradient(linear, center top, center bottom, from(#FDB06C),
			color-stop(0.01,#FDB06C),
			color-stop(0.49,#FF811A),
			color-stop(0.50,#FF5900),
			color-stop(0.99,#FF8B1E),
			to(#FF8B1E));
margin:10px 0;
}
#container p.btn_orng a,
#container p.submit a,
#loginContainer p.submit a{
display:block;
text-align:center;
font-size:20px;
font-weight:bold;
font-weight:bold;
text-decoration:none;
text-shadow:1px 1px 3px #B40;
color:#fff;
background:url(../img/btn_go.png) 14px center no-repeat;
-webkit-background-size:14px 14px;
padding:14px 0;
}
#loginContainer p.btn_gry,
#container p.btn_gry,
#container #submitGry,
#loginContainer #submitGry{
display:block;
border:1px solid #BCBCBC;
-webkit-border-radius:6px;
-moz-box-shadow:0 2px 4px rgba(0,0,0,.3);
-webkit-box-shadow:0 2px 4px rgba(0,0,0,.3);
box-shadow:0 2px 4px rgba(0,0,0,.3);
background:-webkit-gradient(linear, center top, center bottom, from(#FDFDFD),
			color-stop(0.01,#FDFDFD),
			color-stop(0.49,#E0E0E0),
			color-stop(0.50,#C6C6C6),
			color-stop(0.99,#E0E0E0),
			to(#E0E0E0));
margin:15px 0;
}
#container p.btn_gry a,
#loginContainer p.btn_gry a{
display:block;
text-align:center;
font-size:20px;
font-weight:bold;
text-decoration:none;
text-shadow:none;
color:#664F03;
background:url(../img/btn_go2.png) 14px center no-repeat;
-webkit-background-size:14px 14px;
padding:14px 0;
}
#container .back{
text-align:center;
margin:15px 0 0 0;
}
#container #backBtn1{
width:78%;
margin:0 auto;
}
#container #backBtn1 a{
background:url(../img/btn_go2.png) 14px center no-repeat;
text-decoration:none;
text-shadow:none;
padding:10px 0;
}

#container p{
font-size:18px;
color:#555;
line-height:1.4;
margin:0 0 5px 0;
padding:0;
}
#loginContainer p{
font-size:20px;
line-height:1.4;
color:#555;
margin:5px 0;
}
#loginContainer .kome{
color:#ff0000;
}
#container p.caution,
#loginContainer p.caution{
color:#ff0000;
}

/*会員ログイン*/
#loginContainer h1 span{
font-size:20px;
color:#669900;
background:url(../img/ico_key2.png) no-repeat 0 center;
padding:3px 0 0 26px;
}
#loginContainer h2{
font-weight:bold;
font-size:16px;
color:#886633;
background:url(../img/ico_key.png) no-repeat 0 center;
margin:0 0 5px 0;
padding:2px 0 2px 22px;
}
#loginContainer p span{
color:#F00;
}
#loginContainer .loginErr{
display:block;
border:solid #F00 2px;
padding:10px;
margin-bottom:10px;
}
#loginContainer .loginErr .loginErr_msg1{
font-weight:bold;
color:#F00;
background:url(../img/ico_err.png) no-repeat 0 4px;
-webkit-background-size:18px 18px;
margin:0;
padding:0 0 2px 24px;
}
#loginContainer .loginErr .loginErr_msg2{
color:#F00;
margin:2px 0 0 0;
}
#loginContainer .loginErr .loginErr_msg3{
margin:4px 0 0 0;
}
#loginContainer dl{
}
#loginContainer dl.not1st{
margin:10px 0 0 0;
}
#loginContainer dt{
font-weight:bold;
font-size:18px;
color:#886633;
padding:3px 0 3px 0;
}
#loginContainer dd.autologin{
margin:15px 0 10px 0;
padding:0;
}

#loginContainer dd{
font-size:18px;
line-height:1.4;
color:#555;
padding-top:3px;
}
#loginContainer dd.caution{
}
#loginContainer dd.inpt{
word-wrap:break-word;
}

#loginContainer dd.case_panel.open{
background:#fff;
border:solid #2489ce 1px;
-webkit-border-radius:4px;
margin:5px 0 10px 0;
padding:6px 10px;
}
#loginContainer dd.case_panel .tit{
font-size:18px;
background:url(../img/ico_othermail.png) 0 center no-repeat;
-webkit-background-size:18px;
}
#loginContainer dd.case_panel .tit a{
color:#0080ff;
display:block;
background:url(../img/ico_open2.png) no-repeat right center;
padding:3px 18px 3px 20px;
}
#loginContainer dd.case_panel.open .tit a{
text-decoration:none;
background:url(../img/ico_close2.png) no-repeat right center;
}
#loginContainer dd.case_panel .txt{
font-size:18px;
}

#loginContainer dd.qst{
margin-bottom:5px;
}
#loginContainer dd.qst a{
display:block;
color:#0080ff;
background:url(../img/ico_qst.png) no-repeat 0 6px;
padding:3px 0 3px 20px;
}
#loginContainer dd.othermail{
margin-bottom:10px;
}
#loginContainer dd.othermail a{
display:block;
color:#0080ff;
background:url(../img/ico_othermail.png) no-repeat 0 6px;
padding:3px 0 3px 20px;
}
#loginContainer dd.err_msg{
font-weight:bold;
color:#F00;
background:url(../img/ico_err.png) no-repeat 0 center;
-webkit-background-size:40px 40px;
padding:10px 0 10px 45px;
}
#loginContainer .close{
text-align:center;
margin:15px 0 0 0;
}

#loginContainer .mailBox2{
margin-top:5px;
}
#loginContainer .mailBox2 .mailBoxL{
width:43%;
float:left;
}
#loginContainer .mailBox2 .mailBoxC{
width:18px;
padding:10px 0 0 12px;
float:left;
text-shadow:none;
}
#loginContainer .mailBox2 .mailBoxR{
width:43%;
float:left;
}

input[type=email]{
height:24px;
font-size:16px;
-webkit-border-radius:0;
background:#FFF;
}

input[type=password]{
height:24px;
font-size:16px;
-webkit-border-radius:0;
background:#FFF;
}

input[type=checkbox]{
vertical-align:bottom;
height:20px;
width:20px;
}

#loginContainer p.submit{
border:1px solid #ff7701;
-webkit-border-radius:6px;
-moz-box-shadow:0 2px 4px rgba(0,0,0,.3);
-webkit-box-shadow:0 2px 4px rgba(0,0,0,.3);
box-shadow:0 2px 4px rgba(0,0,0,.3);
background:-webkit-gradient(linear, center top, center bottom, from(#FDB06C),
			color-stop(0.01,#FDB06C),
			color-stop(0.49,#FF811A),
			color-stop(0.50,#FF5900),
			color-stop(0.99,#FF8B1E),
			to(#FF8B1E));
margin:10px 0;
}
#loginContainer p.submit a{
display:block;
text-align:center;
font-size:20px;
font-weight:bold;
text-decoration:none;
text-shadow:1px 1px 3px #B40;
font-weight:bold;
color:#fff;
background:url(../img/btn_go.png) 14px center no-repeat;
-webkit-background-size:14px 14px;
padding:18px 0;
}
#loginContainer .back{
text-align:center;
margin:15px 0 0 0;
}
#loginContainer #btnClose{
width:50%;
margin:0 auto 10px auto;
}
#loginContainer #btnClose a{
text-decoration:none;
padding:8px 0;
}

/*ソーシャルログイン*/
#social_login{
	margin:0 0 10px;
	padding:10px 0;
	text-align:center;
	background-color:#EDEBDC;
	-webkit-border-radius:6px;
}
#social_login h2{
	width:264px;
	height:32px;
	margin:0 auto 5px;
	padding:0;
	text-indent:-9999px;
	overflow:hidden;
	background:url(../img/sns/ico_sns2.png) no-repeat;
	-webkit-background-size:100%;
}
#social_login h3{
	margin:0 0 10px;
	padding:0;
	font-size:16px;
	font-weight:normal;
	line-height:1.4;
	color:#555;
}
#social_login ul{
	width:280px;
	margin:0 auto;
}
#social_login ul li{
	margin-bottom:16px;
	-webkit-border-radius:5px;
	-webkit-box-shadow:0 2px 4px rgba(0,0,0,.3);
}
#social_login ul li.mainte{
	opacity:0.5;
	-webkit-box-shadow:none;
}
#social_login ul li a{
	width:280px;
	height:44px;
	display:block;
	text-indent:-9999px;
	overflow:hidden;
}
#social_login ul li a.btn_yahoo{
	background:url(../img/sns/btn_yahoo_login.png) no-repeat;
	-webkit-background-size:100%;
}
#social_login ul li a.btn_google{
	background:url(../img/sns/btn_google_login.png) no-repeat;
	-webkit-background-size:100%;
}
#social_login ul li a.btn_facebook{
	background:url(../img/sns/btn_facebook_login.png) no-repeat;
	-webkit-background-size:100%;
}
#social_login ul li a.btn_suntorytown{
	background:url(../img/sns/btn_suntorytown_login.png) no-repeat;
	-webkit-background-size:100%;
}
#social_login .mainte_text{
	margin:-10px 0 10px;
	font-size:11px;
	line-height:1.2;
	text-align:center;
}
#social_login #social_link{
	width:280px;
	margin:0 auto;
	font-size:18px;
	line-height:1.4;
	text-align:left;
}
#social_login #social_link a{
	color:#2489ce;
	font-weight:normal;
}
