@charset "utf-8";

/* ----------------------------------------------------
	layout
---------------------------------------------------- */
#wrapper { width:100%;min-width:320px; }
#container { overflow:hidden;margin-bottom:10px; }
#content-main { overflow:hidden; }

/* ----------------------------------------------------
	header
---------------------------------------------------- */
#header-main {
	width:100%;
	overflow:hidden;
}
#header-main .wrap-header{
	overflow:hidden;
}
#header-main p {
	width:100px;
	float:left;
	padding:12px 0 0 5px;
}
#header-main #sp-nav-global ul {
	width:200px;
	height:50px;
	float:right;
	overflow:hidden;
}
#header-main #sp-nav-global li {
	display:block;
	width:50px;
	height:50px;
	float:right;
	background-repeat:no-repeat;
	background-position:0 0;
	-moz-background-size:cover;
	background-size:cover;
	text-indent: 100%;
	white-space: nowrap;
	overflow:hidden;
	-webkit-appearance: none;
}
#header-main #sp-nav-global li a {
	display:block;
	width:50px;
	height:50px;
}
#header-main #sp-nav-global li:hover { cursor:pointer;}
#header-main #sp-nav-global .n01 {background-image:url(/common/images/sp/nav_btn01.png);}
#header-main #sp-nav-global .n01on {background-image:url(/common/images/sp/nav_btn01_on.png);}
#header-main #sp-nav-global .n02 {background-image:url(/common/images/sp/nav_btn02.png);}
#header-main #sp-nav-global .n02on {background-image:url(/common/images/sp/nav_btn02_on.png);}
#header-main #sp-nav-global .n03 {background-image:url(/common/images/sp/nav_btn03.png);text-indent:inherit;text-align:center;}
#header-main #sp-nav-global .n04 {background-image:url(/common/images/sp/nav_btn04.png);}
#header-main #sp-nav-global .n05 {background-image:url(/common/images/sp/nav_btn05.png);}
#header-main #sp-nav-global .n03 img {margin-top:6px;border:1px solid #dedede;}
#header-main #nav-global {padding-top:5px;overflow:hidden;}
#header-main .popup-mypage {overflow:hidden;}
#header-main .popup-mypage li {margin:0 5px 5px 5px;background-color: rgba(255,255,255,0.9);}
#header-main .popup-mypage li a {
     display:block;
     padding:5px 5px 5px 15px ;
     color:#0000de;
     background:url(../images/arrow.png) no-repeat 5px 9px;
}
#header-main .popup-mypage { display:none;}
#header-main .popup-search {margin:0 5px 5px 5px;padding:20px 10px 0 10px;background-color: rgba(255,255,255,0.9); overflow:hidden;}
#header-main .popup-search input[type="search"] {
	display:block;
	width:96%;
	margin:0 auto;
	padding:3% 2%;
	border:1px solid #dedede;
	-webkit-appearance: none;
}
#header-main .popup-search .input-submit {
	width:200px;
	min-width:200px;
	padding:7px 10px;
}

/* ----------------------------------------------------
	footer
---------------------------------------------------- */
#nav-local ul { clear:both;overflow:hidden;border-bottom:1px solid #CCCCCC;}
#nav-local ul li a {
	display:block;
	width:auto;
	padding:10px 10px 10px 30px;
	border-top:1px solid #CCCCCC;
	text-shadow: #cccccc 0 -1px 0;
	background:#ffffff url(/common/images/sp/icons.png) no-repeat 10px 15px;
	-webkit-tap-highlight-color:#cccccc;
	font-weight:bold;
}
#list-navi {
    background-color:#EEEEEE;
    margin:0 0 10px 0;
    overflow: hidden;
    padding: 15px 15px 10px 15px;
}
#list-navi dt {
    border-left: 5px solid #CCCCCC;
    padding-left: 5px;
    text-align: left;
	font-size:10px;
	margin-bottom:10px;
}
#list-navi li {
	width:180px;
	float:left;
	padding-right:10px;
	padding-bottom:5px;
	font-size:10px;
}
footer { clear:both;width:100%; }
footer .copyright {
	display:block;
	text-align:center;
	color:#999;
	padding:10px 0 5px 0;
}
/* Floating Ad------------- */
#floating-ad {
	width: 100%;
	height: auto;
	position: fixed;
	bottom: 0;
	left:0;
}
#floating-ad img {
	width: 100%;
	height: auto;
}

/* ----------------------------------------------------
  Common
---------------------------------------------------- */
.cmnUl02 { clear:both;overflow:hidden;}
.cmnUl02 li a {
	display:block;
	width:auto;
	padding:10px 10px 10px 30px;
	border-bottom:1px solid #dddddd;
	background:#ffffff url(/common/images/sp/icons.png) no-repeat 10px 15px;
	-webkit-tap-highlight-color:#dddddd;
	font-weight:bold;
}
/* ----------------------------------------------------
  Search conditions CSS
  @extends base.css
---------------------------------------------------- */
div.cmn-search-box div.search-right {
	position:static;
	float: right;
	width: 150px;
	display: table-cell;
	vertical-align:middle;
	margin-top: 8%;
}
div.cmn-search-box div.search-left {
	width:100%;
}

div.cmn-search-box div.search-left dl dt {
	width:100%;
}
div.cmn-search-box div.search-left dl dt {
	text-align:left;
}
div.cmn-search-box div.search-left dl dd span.add-btn {
	display:inline-block;
	float:left;
	margin:auto 10px;
}
div.cmn-search-box div.search-left dl dd {
    float: left;
	width:98%;
}

/* ----------------------------------------------------
  Form layout CSS
  @extends base.css
---------------------------------------------------- */
input[type="text"],input[type="url"],input[type="file"],input[type="email"],input[type="tel"],textarea{ width:90%;margin:12px auto;}
.input-value,.wrap_image .input-value {
	width:95%;
}
.wrap_image .input-value {
	margin-bottom:0px;
}
.wrap_image .input-notice-area {
	width: 260px;
}
form.freeze .input-value {
	/** Form is Check mode */
	width:95%;
}
/* ----------------------------------------------------
  Index
---------------------------------------------------- */
/* ranking
------------------------------------ */
#ranking-grape .period {
	padding:2px 5px 2px 5px;
	text-align:right;
	color:#333;
	font-size:12px;
}
#ranking-grape ul { padding:0 5px; border-bottom:1px dotted #dedede;}
#ranking-grape li {
	padding-bottom:5px;
	overflow:hidden;
}
#ranking-grape .rank {
	width:30px;
	float:left;
	line-height:1;
	white-space:nowrap;
}
#ranking-grape .rank span {
	font-weight:bold;
	padding-right:2px;
	color:#666;
	font-size:20px;
}
#ranking-grape .wrap-right {
	width:100%;
	float:right;
	margin-left:-30px;
}
#ranking-grape .rank-detail {
	margin-left:40px;
	padding-top:3px;
}
#ranking-grape .rank .first { color:#FF8295;}
#ranking-grape .rank .second { color:#64BF42;}
#ranking-grape .rank .third { color:#4AA5FF;}
#ranking-grape .rank-num { color:#666; font-size:14px;}
#ranking-grape .chk-all {
	text-align:right;
	padding:5px 5px 5px 0;
}
.cmn-ranking .item-ranking{margin-right:0;}
.cmn-ranking .item-photo{
	display:none;
	width:0;
}
.cmn-ranking .liquid-right{margin: 0 0 0 -100px;}
.cmn-ranking .wrap-right{ margin: 0 0 0 100px;}