﻿/*-------------------------------------------------------------/
    FreeFuri基本カラー 
        背景 - 中部：#94D4FF、端部：#3E94D1
        罫線 - コンテンツ外：#3E94D1、コンテンツ内：#0A64A4
        文字 - オレンジ：#FF4500、h2：#03406A、h3：#24577B
/-------------------------------------------------------------*/
body, div, h1, h2, h3, h4, ul, li, table{
    color:#444444;
	margin:0;
	padding:0;
	border:none;
}
body, div, td{line-height:1.3;}
h1, h2, h3, h4, h5, h6 {
    font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', Trebuchet MS, Lucida Sans Unicode, Arial, Sans-Serif;
}
body{
    font-size:12px;
}
html>/**/body {     /* Except IE */
    color:#444444;
    font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'Osaka', 'ＭＳ Ｐゴシック', Trebuchet MS, Lucida Sans Unicode, Arial, Sans-Serif;
    font-size: 12px;
}
body,html {
    word-break:break-all; /* 文字列を折り返させる IEのみ */
	width:100%;
	height:100%;
    margin:0;
}
img {       /* IEで画像を縮小表示させた時、画像が汚くなることを防止 */
	-ms-interpolation-mode: bicubic;
	border:none;
}
/* Link (★デザインにより変更) */
a         {text-decoration:none;}
a:link    {color:#0044CC;}
a:visited {color:#2244CC;}
a:active  {color:#CC0000;}
a:hover   {color:#0044FF; text-decoration: underline;} 
/* Link (★デザインにより変更) - ToolTip */
/* 使用方法：<a class="tooltip" href="#"><span class="xContent">Tooltip内容</span></a> */
a.tooltip {background:url(../img/common/icon/hint.gif) no-repeat left bottom; display:inline-block; height:12px; width:12px; margin:0 3px;}
a.tooltip span.xContent {display:none; font-size:85%; padding:2px 3px; margin-left:8px; text-decoration:none; width:250px;}
a.tooltip:hover {_background:#ffffE0 url(img/common/icon/hint.gif) no-repeat left bottom; text-decoration:none;} /* BG Color is a must for IE6 */
a.tooltip:hover span.xContent{display:inline; position:absolute; background:#ffffE0; border:2px solid #cccccc; color:#222222;}
/* Body */
body{background:#3E94D1 url(../img/common/wall.jpg) repeat-y center top;}
.bodyFrame{background-color:#FFFFFF; border-color:#3E94D1; border-style:solid; border-width:0px 1px 1px 1px; margin: 0px auto; padding:10px 0px; width:1000px;}
/* Header */
.topFrame{clear:both; margin:0px auto; width:1002px;}
.topArea {}
.topArea table{table-layout:fixed; width:100%; height:125px;}
.topArea h1{display:inline; margin:0px;}
.topArea .logoPanel {background-color:#FFFFFF; height:125px; width:400px;}
.topArea .logoPanel .signboard {border:none; height:125px; width:400px;}
.topArea .adsPanel  {height:65px; text-align:center; vertical-align:top;}
.topArea .menuPanel{height:30px; vertical-align:top;}
.topArea .menu     {background:#FFFFFF url(../img/common/header/menuTab_BG.gif) repeat-x left top; height:30px;}
.topArea .menu li  {border-bottom:solid 1px #3E94D1; float:left; height:30px; width:100px; list-style:none none inside; text-align:center;}
.topArea .menu li.nomalMenu {background:#94D4FF url(../img/common/header/menuTab.gif) repeat-x left top;}
.topArea .menu li.activeMenu{background:#94D4FF url(../img/common/header/menuTab_Active.gif) repeat-x left top;  border-bottom:solid 1px #FFFFFF; font-weight:bold;}
.topArea .menu li a{display:block; margin-top:5px; padding-top:10px;}
.topArea .helloPanel {background-color:#FFFFFF; border-right:solid 1px #3E94D1; height:30px; vertical-align:middle;}
.topArea .helloPanel .helloUser {text-align:right; margin:0px 5px 0px 0px;}
/* Contents */
.leftFrame {float:left; width:190px; margin:0px;}
.mainArea {margin:5px 10px;}
.mainArea h2{border-bottom:solid 1px #14476B; color:#14476B; padding-left:10px;}
.mainArea h2:first-letter{color:#FF4500; font-size:1.8em;}
.mainArea h3{color:#24577B; margin:5px 0px;}
.mainArea h4{display:inline;}
.leftArea, .rightArea{margin:27px 5px 5px 10px;}
.leftArea  h3, .rightArea h3{border-bottom:solid 1px #34678B; color:#24577B; padding-left:5px;}
.leftArea  h4, .rightArea h4{color:#24577B; margin:10px 0px 5px 0px;}
.mainPanel {margin:5px 5px 20px 10px;}
.leftPanel, .rightPanel{padding:5px; margin:0em 0em 2em 0em;}
/* Footer */
.bottomArea{clear:both; text-align:center; margin-top:10px;}
.bottomArea .Copyright  {color:#24577B; font-style:italic;}
.bottomArea .Copyright a{color:#24577B;}
/* Goods */
.goodsImg{border:solid 1px #AAAAAA; margin:auto; width:90px;}
/* Goods Chart */
.chartArea {margin:0px auto; width:580px;}
.chartArea .chartLeftPanel {float:left; width:135px; text-align:center; overflow:hidden; zoom:1;}
.chartArea .chartRightPanel{float:right;width:445px; overflow:hidden; zoom:1;}
.chartArea .goodsImg {margin-top:0.5em; width:120px;}
.chartLeftPanel .itemPanel {margin:10px 0px 0px 5px; padding:10px 5px; text-align:left; background-color:#E4FAFF;}
.chartLeftPanel .itemName  {margin: 0px;}
.chartLeftPanel .itemName img{cursor:pointer;}
.chartLeftPanel .itemPoint {margin: 0px 0px 0px 10px; text-align:right;}
.chartLeftPanel .itemPoint .pointNum {font-size:1.2em;}
.chartRightPanel h3 {margin:0px 0px 5px 0px;}
.chartRightPanel .postDate  {color:#666666; font-size:0.8em; text-align:right; margin:0px;}
.chartRightPanel .goodsInfo {clear:both; margin:5px 0px 5px 10px;}
.chartRightPanel .userInfoPanel  {clear:both; border:solid 1px #85C5F1; margin:0px 0px 0px 10px; overflow:auto;}
.chartRightPanel .userInfoTitle  {float:left; margin:0px 2px 1px 0px; height:16px; width: 60px; background-color:#95D5FF; color:#24577B; text-align:center;}
.chartRightPanel .userInfoContent{float:left; margin:0px 2px 0px 0px; width:360px; clear:right;}
.chartRightPanel .userInfoContentSmall{float:left; margin:0px 0px 1px 0px; height:16px; width:140px;}
.chartRatingPanel {text-align:right; clear:both;}
.chartRatingPanel .ratingYes,       .chartRatingPanel .ratingNo{background:url(../img/common/control/miniButton_Blue.gif) no-repeat left top; height:16px; width:42px; display:inline-block; text-align:center; padding-top:2px; cursor:pointer;}
.chartRatingPanel .ratingYes:hover, .chartRatingPanel .ratingNo:hover{background:url(../img/common/control/miniButton_Red.gif) repeat-x left top;}
/* Goods Chart List用 */
.chartListArea {border:none; border-bottom:dashed 1px #0A64A4; margin:0px auto; padding:5px 0px 10px 0px; width:580px;}
.chartListArea .chartLeftPanel {float:left; width:135px; text-align:center;}
.chartListArea .chartCenterPanel{float:left;width:210px;}
.chartListArea .chartRightPanel{float:right;width:445px;}
.chartListArea .chartPanel     {float:right;width:230px;}
.chartListArea .goodsImg  {border:solid 1px #AAAAAA; margin-top:1.5em;}
.chartCenterPanel .goodsInfo {clear:both; margin:0px 0px 5px 10px;}
.chartCenterPanel .userInfoPanel  {clear:both; border:solid 1px #85C5F1;}
.chartCenterPanel .userInfoImage  {float:left; margin:0px 0px 1px 0px; height:60px; width: 60px; background-color:#95D5FF; color:#24577B; text-align:center;}
.chartCenterPanel .userInfoImage img{height:56px; width:56px; margin:2px;}
.chartCenterPanel .userInfoUserName{float:left; margin:0px 0px 1px 2px; height:60px; width:130px;}
.chartCenterPanel .userInfoUserName span{display:block; padding-top:20px;}
.chartCenterPanel .userInfoTitle  {float:left; margin:0px 0px 1px 0px; height:16px; width: 60px; background-color:#95D5FF; color:#24577B; text-align:center;}
.chartCenterPanel .userInfoContent{margin:0px 0px 0px 2px; clear:both;}
.chartCenterPanel .userInfoContentSmall{float:left; margin:0px 0px 1px 2px; height:16px; width:130px;}
/* Horizon(横並び) List用 */
.horizonList{}
.horizonList p{margin:0px 0px 5px 0px;}
.horizonList .goodsPanel{overflow:hidden; padding:0px 5px;}
.horizonList .imgPanel  {height:140px; text-align:center;}
.horizonList .goodsImg  {margin:auto;}
.horizonList .titlePanel{height:40px;}
.horizonList .linkButtonPanel{text-align:center;}
/* Button */
.skeletonButton{border-color:#0A64A4; border-style:dashed; border-width:0px 1px; padding:0px 10px;}
/* List */
.headerRowStyle{border:none; border-bottom:solid 1px #0A64A4; vertical-align:bottom;}
.itemRowStyle  {border:none; border-bottom:dashed 1px #0A64A4; padding-top:5px;}
.pagerRowStyle {border:none; border-bottom:solid 1px #0A64A4; vertical-align:bottom; text-align:center;}
.pagerRowStyle table{margin:auto;}
.pagerRowStyle td   {padding:0px 5px; font-size:larger;}
/* Icon */
.IconM {height:14px; width:14px; border:none; vertical-align:middle;}
.IconL {height:32px; width:32px; border:none; vertical-align:middle;}
/*-- Utility ---------------------------------------------->*/
.fixedTable{table-layout:fixed; width:100%;}
.Width_100 {width:100%;}
.alertPanel{border:solid 1px #FF0000; background-color:#FFCCFF; color:#FF0000; padding:10px 10px 10px 20px; text-align:left;}
.infoPanel {border:solid 1px #0000FF; background-color:#CCE0FF; color:#0000FF; padding:10px 10px 10px 20px; text-align:left;}
/* Display */
.display   {visibility:visible; display:block;}
.displayNo {visibility:hidden;  display:none;}
.displayInline{display:inline;}
/* IME 制御（IEのみ） */
.imeActive {ime-mode: active;}
.imeDisabled {ime-mode: disabled;}
/* Padding ・ Margin */
.padding_5 {padding:5px;}
.padding_10{padding:10px;}
.padding_Top5 {padding-top:5px;}
.padding_Bottom5 {padding-bottom:5px;}
.spacer    {margin: 5px;}
.margin_0  {margin: 0px;}
.margin_5  {margin: 5px;}
.margin_10 {margin:10px;}
.margin_Bottom5{margin-bottom:5px;}
.margin_Auto{margin:auto;}
.indent_5  {margin-left:5px;}
.indent_10 {margin-left:10px;}
.indent_15 {margin-left:15px;}
.indent_20 {margin-left:20px;}
.indent_25 {margin-left:25px;}
/* Float */
.floatLeft {float:left;}
.floatRight{float:right;}
.floatNone {float:none;}
.clearFloat{clear:both;}
/* Background */
.bgNone{background:none;}
/* Border */
.borderNone     {border:none;}
.borderGray     {border:solid 1px #888888;}
.borderLightblue{border:solid 1px #38AFEF;}
/* Font Size */
.fontSimple        {font-weight:normal;letter-spacing: normal;}
.fontLarge         {font-size:115%;}
.fontSmall         {font-size:85%;}
.fontSmallGray     {font-size:85%; color:#666666;}
.fontSmallSilver   {font-size:85%; color:#888888;}
.fontSmallRed      {font-size:85%; color:#FF0000;}
.fontSmallOrange   {font-size:85%; color:#FF6622;}
.fontSmallLightblue{font-size:85%; color:#3388FF;}
.font_80           {font-size:80%;}
.font_80Gray       {font-size:80%; color:#666666;}
.font_90           {font-size:90%;}
.font_100          {font-size:100%;}
.cloudFont01{font-size:0.8em; color:#9090FF;}
.cloudFont02{font-size:1.0em; color:#8888FF;}
.cloudFont03{font-size:1.2em; color:#8080FF;}
.cloudFont04{font-size:1.4em; color:#7878FF;}
.cloudFont05{font-size:1.6em; color:#7070FF;}
.cloudFont06{font-size:1.8em; color:#6868FF;}
.cloudFont07{font-size:2.0em; color:#6060FF;}
.cloudFont08{font-size:2.2em; color:#5858FF;}
.cloudFont09{font-size:2.4em; color:#5050FF;}
.cloudFont10{font-size:2.6em; color:#4848FF;}
/* Font Color */
.fontGray     {color:#666666;}
.fontGreen    {color:#10C050;}
.fontBlue     {color:#0000FF;}
.fontBrown    {color:#CC6622;}
.fontLightBlue{color:#3388FF;}
.fontOrange   {color:#FF6622;}
.fontPink     {color:#FF22BB;}
.fontRed      {color:#FF0000;}
.fontWhite    {color:#FFFFFF;}
/* Font Decoration */
.fontStrike{text-decoration:line-through;}
.fontBold  {font-weight:bold;}
/* Align */
.alignCenter{text-align:center;}
.alignLeft  {text-align:left;}
.alignRight {text-align:right;}
.valignTop  {vertical-align:top;}
.valignMiddle{vertical-align:middle;}
.valignBottom{vertical-align:bottom;}
/* Dummy Link */
.dummyLink       {color:#4444FF; text-decoration:none; cursor:pointer;}
.dummyLink:active{color:#FF0000;}
.dummyLink:hover {color:#0033FF; text-decoration: underline;} 
.cursorPointer   {cursor:pointer;}
/* Decorate */
.underlineNote {border-bottom:solid 1px #88AAFF; padding-top:3px;}
.underlineRed  {border-bottom:solid 1px #FF0000; padding-top:2px;}
.underlineBlack{text-decoration:underline;}
/* List */
.listNone     {list-style:none none outside;}
.listDecimal  {list-style:decimal none outside;}
.listCircle   {list-style:circle none outside;}
.listDisc     {list-style:disc none outside;}
.listSquare   {list-style:square none outside;}
.listRoman_Low{list-style:lower-roman none outside;}
.listRoman_Up { list-style:upper-roman none outside;}

