/* **************************************************

	ライブチャットクチコミランキング カスタマイズCSS

************************************************** */
/*

bootstrap以外のCSSはここにまとめてあります。

目次

sass変数
commonスタイル
基礎レイアウト
ヘッダー
└グローバルナビゲーション
└ランキング選択ナビゲーション
フッター

ランキング一覧ページ

ランキング詳細ページ

レビューページ


*/
/* **************************************************
	sass変数
************************************************** */
/* **************************************************
	ボタン
************************************************** */
.btn-yellow { background-color: #ffce31; background-image: -moz-linear-gradient(top, #ffe141, #ffb51c); background-image: -ms-linear-gradient(top, #ffe141, #ffb51c); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffe141), to(#ffb51c)); background-image: -webkit-linear-gradient(top, #ffe141, #ffb51c); background-image: -o-linear-gradient(top, #ffe141, #ffb51c); background-image: linear-gradient(top, #ffe141, #ffb51c); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffe141', endColorstr='#ffffb51c', GradientType=0); border-color: #ffb51c #ffb51c black; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); filter: progid:dximagetransform.microsoft.gradient(enabled=false); }

.btn-yellow:hover, .btn-yellow:active, .btn-yellow.active, .btn-yellow.disabled, .btn-yellow[disabled] { background-color: #ffb51c; }

.btn-yellow:active, .btn-yellow.active { background-color: #ffce31 \9; }

.btn-pink { background-color: #ff7cb5; background-image: -moz-linear-gradient(top, #ff97c6, #ff5ea2); background-image: -ms-linear-gradient(top, #ff97c6, #ff5ea2); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ff97c6), to(#ff5ea2)); background-image: -webkit-linear-gradient(top, #ff97c6, #ff5ea2); background-image: -o-linear-gradient(top, #ff97c6, #ff5ea2); background-image: linear-gradient(top, #ff97c6, #ff5ea2); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff97c6', endColorstr='#ffff5ea2', GradientType=0); border-color: #ff5ea2 #ff5ea2 black; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); filter: progid:dximagetransform.microsoft.gradient(enabled=false); }

.btn-pink:hover, .btn-pink:active, .btn-pink.active, .btn-pink.disabled, .btn-pink[disabled] { background-color: #ff5ea2; }

.btn-pink:active, .btn-pink.active { background-color: #ff7cb5 \9; }

.btn-Lightpink { color: #b1567c; background-color: #ffcfe3; background-image: -moz-linear-gradient(top, #ffe0ed, #ffbad6); background-image: -ms-linear-gradient(top, #ffe0ed, #ffbad6); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffe0ed), to(#ffbad6)); background-image: -webkit-linear-gradient(top, #ffe0ed, #ffbad6); background-image: -o-linear-gradient(top, #ffe0ed, #ffbad6); background-image: linear-gradient(top, #ffe0ed, #ffbad6); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffc0da', endColorstr='#ffff9ac3', GradientType=0); border-color: #ffbad6 #ffbad6 black; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); filter: progid:dximagetransform.microsoft.gradient(enabled=false); }

.btn-Lightpink:hover, .btn-Lightpink:active, .btn-Lightpink.active, .btn-Lightpink.disabled, .btn-Lightpink[disabled] { background-color: #ffbad6; }

.btn-Lightpink:active, .btn-Lightpink.active { background-color: #ffcfe3 \9; }

.btn-Lightblue { color: #367599; background-color: #ace0ff; background-image: -moz-linear-gradient(top, #daf1ff, #9bdbff); background-image: -ms-linear-gradient(top, #daf1ff, #9bdbff); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#daf1ff), to(#9bdbff)); background-image: -webkit-linear-gradient(top, #daf1ff, #9bdbff); background-image: -o-linear-gradient(top, #daf1ff, #9bdbff); background-image: linear-gradient(top, #daf1ff, #9bdbff); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffc0da', endColorstr='#ff#ff9ac3', GradientType=0); border-color: #9bdbff #9bdbff black; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); filter: progid:dximagetransform.microsoft.gradient(enabled=false); }

.btn-Lightblue:hover, .btn-Lightblue:active, .btn-Lightblue.active, .btn-Lightblue.disabled, .btn-Lightblue[disabled] { background-color: #9bdbff; }

.btn-Lightblue:active, .btn-Lightblue.active { background-color: #ffcfe3 \9; }

.btn-Lightgreen { color: #618841; background-color: #e1ffbc; background-image: -moz-linear-gradient(top, #eeffe0, #bef194); background-image: -ms-linear-gradient(top, #eeffe0, #bef194); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeffe0), to(#bef194)); background-image: -webkit-linear-gradient(top, #eeffe0, #bef194); background-image: -o-linear-gradient(top, #eeffe0, #bef194); background-image: linear-gradient(top, #eeffe0, #bef194); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffc0da', endColorstr='#ff#ff9ac3', GradientType=0); border-color: #bef194 #bef194 black; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); filter: progid:dximagetransform.microsoft.gradient(enabled=false); }

.btn-Lightgreen:hover, .btn-Lightgreen:active, .btn-Lightgreen.active, .btn-Lightgreen.disabled, .btn-Lightgreen[disabled] { background-color: #bef194; }

.btn-Lightgreen:active, .btn-Lightgreen.active { background-color: #ffcfe3 \9; }

/* **************************************************
	commonスタイル
************************************************** */
a { color: #4c4646; text-decoration: none; }

a:hover { color: #ff7db8; text-decoration: none; }

a:hover { text-decoration: none; }

p, ul, ol, dl { padding: 0; margin: 0; }

li { list-style-type: none; }

dd { margin: 2 !important; }

h1, h2 { margin: 0; line-height: 1em; }

/* **************************************************
	基礎レイアウト
************************************************** */
* { margin: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

html, body { height: 100%; }

#body { position: relative; margin: 0; color: #4c4646; background: url(../image/body-bg.png) repeat center top; }

#layout { width: 100%; }

::selection { background: #2dc1ff; }

::-moz-selection { background: #ffbce2; }

#layout { position: relative; min-height: 0%; }

#upper { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto; }

#lower { z-index: 100; width: 100%; height: 245px; position: absolute; bottom: 0; left: 0; font-size: 12px; background-color: transparent; }

.mainColumn { padding-top: 0px; position: relative; }

/* **************************************************

	ヘッダー
	
************************************************** */
/* **************************************************
	グローバルナビゲーション
************************************************** */
.logo { width: 180px; position: absolute; top: 0; left: -5px; z-index: 1000; }

.logo a {display: block;position: absolute;top: -6px;left: 0px;width: 180px;overflow: hidden;height: 45px;text-indent: -9999px;background: url(/sp/movie/image/jewel-logoTab.png) no-repeat left top;}

.logosp {width: 132px;height: 62px;position: absolute;top: -11px;left: 0px;z-index: 1000;background: url(/sp/movie/image/jewel-logoTab.png) no-repeat left top;background-size: 100%;}

.logosp a {display: block;width: 100%;height: 62px;text-indent: -9999px;}

.navbar { border-bottom: 1px solid #e1e1e1; background: #fff; }

.navbar-inner { min-height: 35px; }

.navbar .container { position: relative; height: 60px;}

.navbar .brand img { position: relative; top: 0px; left: 0px; }

.navbar-inverse > .navbar-inner { background-color: #1b1b1b; background-image: -moz-linear-gradient(top, #343434, #111111); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#343434), to(#111111)); background-image: -webkit-linear-gradient(top, #343434, #111111); background-image: -o-linear-gradient(top, #343434, #111111); background-image: linear-gradient(to bottom, #343434, #111111); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff343434', endColorstr='#ff111111', GradientType=0); }

/*グローバルナビゲーション　ボタン部分*/
.globalNav-ul { top: 0px; left: 140px !important; }

.globalNav-li a { position: relative; display: block; height: 34px; padding: 0px !important; text-decoration: none; background-image: url(../image/globalNav-splite.png); background-repeat: no-repeat; text-indent: -9999px; }

.globalNav-li.li-01 a { width: 65px; background-position: 0 0; }

.globalNav-li.li-02 a { width: 78px; background-position: -65px 0; }

.globalNav-li.li-03 a { width: 91px; background-position: -143px 0; }

.globalNav-li.li-04 a { width: 90px; background-position: -234px 0; }

.globalNav-li.li-05 a { width: 66px; background-position: -323px 0; }

.globalNav-li.li-06 a { width: 44px; background-position: -388px 0; }

.globalNav-li.li-07 a { width: 98px; background-position: -432px 0; }

.globalNav-li.li-08 a { width: 76px; background-position: -531px 0; }

.globalNav-li.li-01 a:hover { width: 65px; background-position: 0 -34px; }

.globalNav-li.li-02 a:hover { width: 78px; background-position: -65px -34px; }

.globalNav-li.li-03 a:hover { width: 91px; background-position: -143px -34px; }

.globalNav-li.li-04 a:hover { width: 90px; background-position: -234px -34px; }

.globalNav-li.li-05 a:hover { width: 66px; background-position: -323px -34px; }

.globalNav-li.li-06 a:hover { width: 44px; background-position: -388px -34px; }

.globalNav-li.li-07 a:hover { width: 98px; background-position: -432px -34px; }

.globalNav-li.li-08 a:hover { width: 76px; background-position: -531px -34px; }

/* *************************************************グローバルナビゲーション　ボタン境界線部分*/
.globalNav-li a:before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 2px; height: 34px; background: url(../image/globalNav-border.png) no-repeat left 6px; }

.globalNav-li:first-child a:before { background: none; }

/* *************************************************無料新規登録　ログインボタン*/
.sign { width: 190px; position: absolute; top: 0; right: -5px; }

.sign .sign-li { float: left; }

.sign .sign-li a { text-indent: -9999px; display: block; height: 35px; background-image: url(../image/globalNav-signSplite.png); background-repeat: no-repeat; }

.sign .sign-li.sign-regist a { width: 110px; background-position: 0 0; }

.sign .sign-li.sign-login a { width: 80px; background-position: -110px 0; }

.sign .sign-li.sign-regist a:hover { background-position: 0 -35px; }

.sign .sign-li.sign-login a:hover { background-position: -110px -35px; }

/* スマホ版の登録ログインボタン非表示 */
.signSmt { display: none; }

/* **************************************************
	ランキング選択ナビゲーション
************************************************** */
.rank-select.nav-pillWrap { width: 100%; padding: 0px 0; margin: 0 auto; font-size: 13px;  }

.rank-select .rankSelect-ul { display: inline-block; float: center; }

.rank-select .rankSelect-ul .nav-pills-title { padding: 10px 5px !important; }

/* ランキング選択リンク */
.rankSelect-ul .rankSelect-li > a { color: #6c6c6c !important; padding: 10px 5px !important; text-shadow: 0 0 0 !important; }

/* ランキング選択リンクホバー状態 */
.rankSelect-ul .rankSelect-li > a:hover { color: #2dc1ff !important; }

/* ランキング選択リンク ページアクティブ状態 */
.rankSelect-ul .rankSelect-li.active > a {color: #fff !important;background-color: #ff5fa0 !important;text-shadow: 0 0 0 !important;box-shadow: 0 0 0;}

/* ************************************************* ランキング選択内　ドロップダウンボタン*/
/* トグルスイッチ クリック状態 */
.rankSelect-ul .open a.dropdown-toggle { color: #6c6c6c !important; background-color: #ffc2db !important; }

/* ドロップダウンメニュー */
.rankSelect-ul .dropdown-menu { top: 90%; }

/* マウスオーバーでドロップダウンメニューを開く */
.rankSelect-ul li.dropdown:hover ul.dropdown-menu { display: block; }

.rankSelect-ul a.menu:after, .rankSelect-ul .dropdown-toggle:after { content: none; }

/* ドロップダウンメニュー内のホバーした時 */
.rankSelect-ul .dropdown-menu a:hover { background-image: none; background-color: #2dc1ff; }

/* スマホ版ランキングセレクタを非表示 */
.rank-select .rankSelect-smt { display: none; }

/*時間帯別ページ　時間帯選択*/
.time-select { display: none; }

/* **************************************************

	フッター

************************************************** */
#lower .footer { width: 940px; border-radius: 5px 5px 0px 0px; position: absolute; bottom: 30px; padding: 20px 0; background: white; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccFFFFFF,endColorstr=#ccFFFFFF); box-shadow: 5px 5px 11px #c3c3c3; }

#lower .footer a { color: #4c4646; line-height: 1.5em; }

#lower .footer a:hover { color: #ff7db8; }

#lower .footLogo img { position: relative; top: 50px; text-align: center; }

#lower .footMenu dt { position: relative; font-size: 15px; border-bottom: 2px solid #ff5fa0; margin-bottom: 10px; }
#lower .footMenu dt:after { content: ""; position: absolute; right: 10px; bottom: -13px; display: block; width: 20px; height: 20px; background: url(../image/rankTitle-pointEd.png) no-repeat left top; background-size: 75% auto; }

#lower .addressWrap { display: block; width: 100%; position: absolute; bottom: 0; height: 30px; overflow: hidden; background: #000; }

#lower .address { line-height: 3em; background: #000; font-size: 10px; text-align: center; }

#lower .address a { color: #fff; text-decoration: none; }

/* ***************************************ページに戻るボタン*/
.pageTop { display: block; text-indent: -9999px; background: red; width: 210px; height: 30px; position: absolute; top: -30px; right: 10px; background: url(../image/pageTop.png) no-repeat left top; }

.pageTop:hover { height: 35px; top: -35px; background: url(../image/pageTop-R.png) no-repeat left top; }

/* **************************************************

	ランキング一覧ページ

************************************************** */
.rank-section {max-width: 940px;padding: 20px 0;margin: 50px auto;margin-bottom: 40px;background: white;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccFFFFFF,endColorstr=#ccFFFFFF);border-radius: 5px;box-shadow: 5px 5px 11px #c3c3c3;position: relative;}

/* ***************************************ランキング見だし*/
.rank-h1 { width: 100%; height: 40px; margin: 5px 0 30px 0px; border-bottom: 3px #21a9ff solid; position: relative; }

.rank-h1 p { position: relative; top: -5px; left: 45px; width: 900px; height: 40px; text-indent: -9999px; background-image: url(../image/rankTitle-splite.png); background-repeat: no-repeat; }

/* ランキング一覧ページの見だし */
.rank-all .rank-daily .rank-h1 p { background-position: 0 0px; }

.rank-all .rank-weekly .rank-h1 p { background-position: 0 -80px; }

.rank-all .rank-monthly .rank-h1 p { background-position: 0 -160px; }

.rank-morning .rank-daily .rank-h1 p { background-position: 0 -240px; }

.rank-morning .rank-weekly .rank-h1 p { background-position: 0 -320px; }

.rank-morning .rank-monthly .rank-h1 p { background-position: 0 -400px; }

.rank-noon .rank-daily .rank-h1 p { background-position: 0 -480px; }

.rank-noon .rank-weekly .rank-h1 p { background-position: 0 -560px; }

.rank-noon .rank-monthly .rank-h1 p { background-position: 0 -640px; }

.rank-night .rank-daily .rank-h1 p { background-position: 0 -720px; }

.rank-night .rank-weekly .rank-h1 p { background-position: 0 -800px; }

.rank-night .rank-monthly .rank-h1 p { background-position: 0 -880px; }

.rank-post .rank-daily .rank-h1 p { background-position: 0 -960px; }

.rank-newface .rank-daily .rank-h1 p { background-position: 0 -1040px; }

.rank-newface .rank-weekly .rank-h1 p { background-position: 0 -1120px; }

.rank-newface .rank-monthly .rank-h1 p { background-position: 0 -1200px; }

.rank-drama .rank-daily .rank-h1 p { background-position: 0 -1280px; }

.rank-drama .rank-weekly .rank-h1 p { background-position: 0 -1360px; }

.rank-drama .rank-monthly .rank-h1 p { background-position: 0 -1440px; }


/* ランキング詳細ページの見だし */
.rank-all-daily .rank-h1 p { background-position: 0 -40px; }

.rank-all-weekly .rank-h1 p { background-position: 0 -120px; }

.rank-all-monthly .rank-h1 p { background-position: 0 -200px; }

.rank-morning-daily .rank-h1 p { background-position: 0 -280px; }

.rank-morning-weekly .rank-h1 p { background-position: 0 -360px; }

.rank-morning-monthly .rank-h1 p { background-position: 0 -440px; }

.rank-noon-daily .rank-h1 p { background-position: 0 -520px; }

.rank-noon-weekly .rank-h1 p { background-position: 0 -600px; }

.rank-noon-monthly .rank-h1 p { background-position: 0 -680px; }

.rank-night-daily .rank-h1 p { background-position: 0 -760px; }

.rank-night-weekly .rank-h1 p { background-position: 0 -840px; }

.rank-night-monthly .rank-h1 p { background-position: 0 -920px; }

.rank-post-all .rank-h1 p { background-position: 0 -1000px; }

.rank-newface-daily .rank-h1 p { background-position: 0 -1080px; }

.rank-newface-weekly .rank-h1 p { background-position: 0 -1160px; }

.rank-newface-monthly .rank-h1 p { background-position: 0 -1240px; }

.rank-drama-daily .rank-h1 p { background-position: 0 -1320px; }

.rank-drama-weekly .rank-h1 p { background-position: 0 -1400px; }

.rank-drama-monthly .rank-h1 p { background-position: 0 -1480px; }

.rank-h1:before { content: ""; position: absolute; left: 0; bottom: -3px; display: block; width: 40px; height: 40px; background: url(../image/rankTitle-pointSt.png) no-repeat left top; }

.rank-h1:after { content: ""; position: absolute; right: 10px; bottom: -10px; display: block; width: 20px; height: 20px; background: url(../image/rankTitle-pointEd.png) no-repeat left top; }

/* **************************************************
	ランキング集計期間
************************************************** */
.rank-date { position: absolute; top: 80px; right: 30px; font-size: 13px; color: #919191; }

/* **************************************************
	ランキング本体
************************************************** */
.rank-ul { position: relative; width: 920px; height: 580px; overflow: hidden; margin: 0 auto; }

.rank-ul a { color: #4c4646; display: block; height: auto; }

.rank-ul a:hover { color: #ff5fa0; }

.rank-li { text-align: center; float: left; position: absolute; width: 184px; }

/*
.rank-li.rank1{z-index:5; top:22px * 0; left:184px * 0;}
.rank-li.rank2{z-index:4; top:22px * 1; left:184px * 1;}
.rank-li.rank3{z-index:3; top:22px * 2; left:184px * 2;}
.rank-li.rank4{z-index:2; top:22px * 3; left:184px * 3;}
.rank-li.rank5{z-index:1; top:22px * 4; left:184px * 4;}
*/
.rank-li-inner { height: 100%; position: relative; }

/* 順位メダル＆テキスト */
.rank-h2 { color: #f69ac4; width: 100%; height: 130px; position: relative; }

.rank1 .rank-h2 p, .rank2 .rank-h2 p, .rank3 .rank-h2 p, .rank4 .rank-h2 p, .rank5 .rank-h2 p { text-indent: -9999px; width: 90px; height: 130px; margin: 0 auto; text-indent: -9999px; background-image: url(../image/rankNumber-splite.png); background-repeat: no-repeat; }

.rank1 .rank-h2 p { background-position: 5px 0; }

.rank2 .rank-h2 p { background-position: -95px 0; }

.rank3 .rank-h2 p { background-position: -195px 0; }

.rank4 .rank-h2 p { background-position: -295px 0; }

.rank5 .rank-h2 p { background-position: -395px 0; }

.rankThumb { position: absolute; left: 17px; top: 120px; width: 150px; height: 112px; overflow: hidden; z-index: 99; }

.rankThumb-p { width: 150px; height: 112px; text-align: right; }

.rankThumb-img { display: block; border-radius: 5px; }

/* ***************************************ランキング プロフィール（お立ち台部分） */
.rankBottom { width: 184px; height: 350px; position: absolute; top: 240px; background-color: white; background-image: -moz-linear-gradient(top, white, #f4f4f4); background-image: -ms-linear-gradient(top, white, #f4f4f4); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(white), to(#f4f4f4)); background-image: -webkit-linear-gradient(top, white, #f4f4f4); background-image: -o-linear-gradient(top, white, #f4f4f4); background-image: linear-gradient(top, white, #f4f4f4); }

.rankBottom-inner { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; padding-top: 15px; border-left: 1px solid #e0e0e0; height: 100%; }

.rank-li:last-child .rankBottom-inner { border-right: 1px solid #e0e0e0; }

/* お立ち台の上端デザイン */
.rankBottom:before { content: ""; display: block; width: 184px; height: 7px; box-shadow: 0px 1px 1px #a6a6a6; background-color: #ffc0da; background-image: -moz-linear-gradient(top, #ffc0da, #ff9ac3); background-image: -ms-linear-gradient(top, #ffc0da, #ff9ac3); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffc0da), to(#ff9ac3)); background-image: -webkit-linear-gradient(top, #ffc0da, #ff9ac3); background-image: -o-linear-gradient(top, #ffc0da, #ff9ac3); background-image: linear-gradient(top, #ffc0da, #ff9ac3); z-index: 1; }

/* お立ち台のドロップシャドウデザイン */
.rankBottom:after { content: ""; display: block; width: 10px; height: 300px; position: absolute; top: -22px; left: 0px; background: url(../image/rankBar-side.png) no-repeat left top; }

.rank-li:first-child .rankBottom:after { display: none; }

/* お立ち台ドロップシャドウの例外処理 */
li[data-sort="first"] > div > .rankBottom:after { display: none; }

li[data-sort="secound"] > div > .rankBottom:after { background: url(../image/rankBar-sideLongRight.png) no-repeat left top; top: 0; }

li[data-sort="third"] > div > .rankBottom:after { background: url(../image/rankBar-sideLong.png) no-repeat left top; top: -44px; }

/* ***************************************ランキング プロフィール各要素 */
.rankBottom-online { text-indent: -9999px; width: 130px; height: 22px; margin: 0 auto; font-size: 10px; line-height: 1em; font-weight: bold; background-image: url(../image/online-flag.png); background-repeat: no-repeat; background-size:130px 100px;}

.status-online { background-position: 0 0; }

.status-chat { background-position: 0 -25px; }

.status-2shot { background-position: 0 -50px; }

.status-offline { background-position: 0 -75px; }

.rankBottom-name { padding-top: 5px; line-height: 1.5em; font-weight: bold; }

.rankBottom-before { line-height: 1.5em; font-size: 12px; }

/* *************************************** ランキングのあげさげアイコン*/
.rankBottom-before i { top: -2px; font-size: 20px; height: 0.9em; }

.rankBottom-before i.icon-typicons-G { color: #f56da8; }

/* ↑上 */
.rankBottom-before i.icon-typicons-F { color: #f9ad3b; }

/* ↓下 */
.rankBottom-before i.icon-typicons-H { color: #3ba7fa; }

/* →右 */
/* *************************************** ランキングお立ち台のボタン周り*/
.rankBottom-btnWrap { display: inline-block; min-width: 130px; }

/* ***** レビューへのボタン*/
.btn-review { margin-top: 5px; font-size: 13px; }

/* ***** メール、お気に入りボタン*/
.rankBottom-subWrap { margin: 0 auto; margin-top: 5px; }

.rankBottom-subWrap .btn { float: left; padding: 1px 3px; font-size: 10px; width: 49%; }

.rankBottom-subWrap a:last-child .btn { float: right; }

/* ***************************************ランキング詳細へのボタン */
.rankBtn-detail { width: 100%; height: 100px; position: absolute; bottom: 20px; text-indent: -9999px; background: url(../image/rankBtn-bg.png) no-repeat center top; z-index: 10; }
.rankBtn-detail .rankBtn-detail-PCbtn { position: relative; top: 25px; display: block; width: 600px; height: 60px; margin: 0 auto; background: url(../image/rankBtn-detail.png) no-repeat left top; }
.rankBtn-detail .rankBtn-detail-PCbtn:hover { background-position: left -60px; }
.rankBtn-detail .rankBtn-detail-SPbtn { display: none; }

/* **************************************************

	ランキング詳細ページ

************************************************** */
.rank-sectionDetail .rank-ul { height: 520px; border-bottom: 1px solid #e0e0e0; }

/* ***************************************ランキング折り返し（左肩下がり）のスタイル */
.rank-flap .rankBottom:after { content: ""; display: block; width: 10px; height: 300px; position: absolute; top: 0; left: -10px; background: url(../image/rankBar-sideRight.png) no-repeat left top; }

.rank-flap .rank-li:first-child .rankBottom:after{display: block;}
.rank-flap .rank-li:last-child .rankBottom:after{display: none;}

.rank-flap .rank-li:first-child .rankBottom-inner { border-right: 1px solid #e0e0e0; }

/* ***************************************６位以下のスタイル */
.rank-under.rank-ul { height: 430px; margin-top: 20px; }

.rank-under .rank-h2 { height: auto; padding: 10px; }

.rank-under .rank-h2 p { text-indent: 0; font-size: 18px; height: auto; padding: 10px; }

.rank-under .rankThumb { top: 50px; }

.rank-under .rankBottom { top: 180px; }

/* ***************************************６位以下に１位?５位が来たときのスタイル */
.rank-under.rank-top5.rank-ul { height: 520px; }

.rank-under.rank-top5.rank-ul .rank-h2 { top: 50px; }

.rank-under.rank-top5.rank-ul .rank1 .rank-h2, .rank-under.rank-top5.rank-ul .rank2 .rank-h2, .rank-under.rank-top5.rank-ul .rank3 .rank-h2, .rank-under.rank-top5.rank-ul .rank4 .rank-h2, .rank-under.rank-top5.rank-ul .rank5 .rank-h2 { top: 0; height: 130px; padding: 0; }

.rank-under.rank-top5.rank-ul .rankThumb { top: 120px; }

.rank-under.rank-top5.rank-ul .rankBottom { top: 240px; }

.rank-under.rank-top5.rank-ul .rank1 .rank-h2 p, .rank-under.rank-top5.rank-ul .rank2 .rank-h2 p, .rank-under.rank-top5.rank-ul .rank3 .rank-h2 p, .rank-under.rank-top5.rank-ul .rank4 .rank-h2 p, .rank-under.rank-top5.rank-ul .rank5 .rank-h2 p { text-indent: -9999px; width: 90px; height: 130px; margin: 0 auto; text-indent: -9999px; background-image: url(../image/rankNumber-splite.png); background-repeat: no-repeat; }

/* *************************************** ６位以下のポジション */
/*
.rank6, .rank16, .rank26{z-index:1; top:22px * 0; left:184px * 4;}
.rank7, .rank17, .rank27{z-index:2; top:22px * 1; left:184px * 3;}
.rank8, .rank18, .rank28{z-index:3; top:22px * 2; left:184px * 2;}
.rank9, .rank19, .rank29{z-index:4; top:22px * 3; left:184px * 1;}
.rank10, .rank20, .rank30{z-index:5; top:22px * 4; left:184px * 0;}

.rank11, .rank21{z-index:5; top:22px * 0; left:184px * 0;}
.rank12, .rank22{z-index:4; top:22px * 1; left:184px * 1;}
.rank13, .rank23{z-index:3; top:22px * 2; left:184px * 2;}
.rank14, .rank24{z-index:2; top:22px * 3; left:184px * 3;}
.rank15, .rank25{z-index:1; top:22px * 4; left:184px * 4;}

*/
/* **************************************************

	レビューページ

************************************************** */
/* **************************************************
	レビューページ　メインカラム
************************************************** */
.review-section {width: 100%;padding: 60px 0;margin: 0 auto;margin-bottom: 40px;background: white;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccFFFFFF,endColorstr=#ccFFFFFF);border-radius: 5px;box-shadow: 5px 5px 11px #c3c3c3;position: relative;}

.review-h1 { line-height: 1.7em; font-size: 20px; text-indent: 2.5em; border-bottom: 3px #21a9ff solid; margin-bottom: 30px; position: relative; font-weight: normal; }

.review-h1:before { content: ""; position: absolute; left: 0; bottom: -3px; display: block; width: 40px; height: 40px; background: url(../image/rankTitle-pointSt.png) no-repeat left top; }

.review-h1:after { content: ""; position: absolute; right: 10px; bottom: -10px; display: block; width: 20px; height: 20px; background: url(../image/rankTitle-pointEd.png) no-repeat left top; }

/* **************************　レビュー用プロフ　*/
.review-profile { margin: 0 50px; margin-bottom: 30px; position: relative; padding: 10px 0; background: #e9f6ff; border-radius: 5px; box-shadow: 0px 2px 5px #c8c4bd; }

.review-profile-image { width: 40%; padding-right: 20px; float: left; }

.review-profile-image img { -webkit-transform: rotate(354deg); -moz-transform: rotate(354deg); -o-transform: rotate(354deg); writing-mode: lr-tb; border: 6px solid white; box-shadow: 0px 2px 5px #dfd5bc; position: relative; z-index: 2; }

.review-profile-btn li { display: inline-block; width: 35px; height: 35px; float: right; margin-left: 3px; }

.review-profile-btn a { display: block; width: 37px; height: 37px; text-indent: -9999px; background-image: url(../image/btn-prof-splite.png); background-repeat: no-repeat; }

.review-profile-btn .btn-mail { background-position: -2px 0; }

.review-profile-btn .btn-fav { background-position: -42px 0; }

.review-profile-detail { float: right; width: 60%; }

.review-profile-detail table { color: #868686; font-size: 14px; width: 100%; }

.review-profile-detail th { padding: 5px 0; width: 30%; text-align: right; }

.review-profile-detail td { padding: 5px 0; width: 70%; }

.review-profile-detail tr { border-bottom: 1px dashed #bed0dc; }

.review-profile-detail tr:last-child { border-bottom: none; }

/* エッチ度のデザイン */
.review-profile-detail .h-star { width: 100%; padding: 0; height: 1em; position: relative; text-indent: -9999px; background: url(../image/h-starBg.png) no-repeat left 3px; }

.review-profile-detail .h-star-p { position: absolute; left: 0; top: 0; display: block; background: url(../image/h-star.png) no-repeat left 3px; width: 80px; height: 19px; }

.h-star-p.star1 { position: relative; background-position: -64px 3px; }

.h-star-p.star2 { position: relative; background-position: -48px 3px; }

.h-star-p.star3 { position: relative; background-position: -32px 3px; }

.h-star-p.star4 { position: relative; background-position: -16px 3px; }

.h-star-p.star5 { position: relative; background-position: 0 3px; }

/*なんか星がIE以外ヘンだったから↑にしてみた。
.h-star-p.star1 { background-position: -64px 3px; }

.h-star-p.star2 { background-position: -48px 3px; }

.h-star-p.star3 { background-position: -32px 3px; }

.h-star-p.star4 { background-position: -16px 3px; }

.h-star-p.star5 { background-position: 0 3px; }
*/
/* オンラインステータスのデザイン */
.review-profile-online { text-indent: -9999px; height: 22px; margin: 0 auto; font-size: 10px; line-height: 1em; font-weight: bold; background-image: url(../image/online-flag.png); background-repeat: no-repeat; }

/* **************************　レビュー記事閲覧　*/
.reviewArticle { padding: 0 40px; }

.review-btn-post { margin-bottom: 20px; }

.review-h2 { color: #6d6d6d; line-height: 1.8em; font-size: 15px; border-bottom: 3px solid #21a9ff; margin-bottom: 20px; }

.reviewArticle-li { margin: 0 20px 30px 20px; border-bottom: 1px dashed #b8b8b8; }

.reviewArticle-head { font-size: 12px; margin-bottom: -5px; padding: 5px 0; }

.reviewArticle-head p { color: #f69ac4; min-height: 1.5em !important; }

/* 記事内のハートランク */
.reviewArticle-rate { position: relative; white-space: nowrap; }

.reviewArticle-rate > span { display: inline-block; width: 95px; height: 15px; background-image: url(../image/rate-splite.png); background-repeat: no-repeat; }

.reviewArticle-rate .rate1 { background-position: 0 0; }

.reviewArticle-rate .rate2 { background-position: 0 -20px; }

.reviewArticle-rate .rate3 { background-position: 0 -40px; }

.reviewArticle-rate .rate4 { background-position: 0 -60px; }

.reviewArticle-rate .rate5 { background-position: 0 -80px; }

.reviewArticle-reviewText { font-size: 14px; line-height: 1.8em; margin-bottom: 30px; overflow: hidden; }

.reviewArticle-reviewText a { color: #ff7db8; }

.readMore { white-space: nowrap; }

.nologin-reviewText{ font-size: 14px;  line-height: 1.8em;  margin-bottom: 30px;  overflow: hidden; }

.nologin-reviewText a{ color: #ff7db8; }
/* **************************　ページネーション　*/
.pagination { font-size: 12px; position: relative; right: 10px; }

.pagination a, .pagination span { color: #6d6d6d; padding: 10px !important; line-height: 1.3em !important; }

.pagination-arrowL { position: relative; top: 0; left: 0; }

.pagination-arrowL:before { content: ""; position: absolute; top: 13px; left: 2px; border-top: 3px solid transparent; border-bottom: 3px solid transparent; border-right: 5px solid #ff5fa0; }

.pagination-arrowR { position: relative; top: 0; left: 0; }

.pagination-arrowR:before { content: ""; position: absolute; top: 13px; right: 2px; border-top: 3px solid transparent; border-bottom: 3px solid transparent; border-left: 5px solid #ff5fa0; }

.pagination li:first-child a, .pagination li:first-child span { -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; }

.pagination li:last-child a, .pagination li:last-child span { -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0; }

.pagination .disabled span, .pagination .disabled a, .pagination .disabled a:hover { background-color: #fff; }

.pagination .disabled span, .pagination .disabled .pagination-arrowL:before { border-right: 5px solid #999; }

.pagination .disabled span, .pagination .disabled .pagination-arrowR:before { border-left: 5px solid #999; }

/* **************************************************
	レビューページ　サイドカラム（ランキング）
************************************************** */
.sideRank-section {padding-top: 46px;width: 100%;padding-bottom: 20px;margin: 0 auto;margin-bottom: 40px;background: white;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccFFFFFF,endColorstr=#ccFFFFFF);border-radius: 5px;box-shadow: 5px 5px 11px #c3c3c3;position: relative;text-align: center;}

.sideRank-h1 { color: #fff; font-weight: bold; font-size: 13px; text-align: left; text-indent: 1em; margin: 0; padding: 10px 0; position: relative; border-radius: 5px 5px 0px 0px; background-image: -moz-linear-gradient(top, #fc64a3, #fb3d8c); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fc64a3), to(#fb3d8c)); background-image: -webkit-linear-gradient(top, #fc64a3, #fb3d8c); background-image: -o-linear-gradient(top, #fc64a3, #fb3d8c); background-image: linear-gradient(to bottom, #fc64a3, #fb3d8c); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffc64a3', endColorstr='#fffb3d8c', GradientType=0); }

.sideRank-li { padding: 15px 5px; border-bottom: 1px dashed #b8b8b8; }

.sideRank-li:last-child { border-bottom: none; }

.sideRank-h2 { color: #f69ac4; font-size: 15px; text-align: center; position: relative; margin-bottom: 5px; }

.sideRank-h2:before { content: ""; display: block; position: absolute; bottom: 0; left: 60px; width: 20px; height: 20px; }

.rank1 .sideRank-h2:before { background: url(../image/rank-crown1.png) no-repeat left top; }

.rank2 .sideRank-h2:before { background: url(../image/rank-crown2.png) no-repeat left top; }

.rank3 .sideRank-h2:before { background: url(../image/rank-crown3.png) no-repeat left top; }

.sideRank-h2-number { font-size: 25px; }

.sideRank-image { width: 100px; }

.sideRank-image img { border-radius: 5px; }

.sideRank-detail { font-size: 10px; text-align: left; }

.sideRank-detail p { line-height: 1.8em; }

.sideRank-detail p a { color: #ff7db8; }

.btn-sideRank-ranking { font-size: 13px; }

/* **************************************************

	レビュー投稿ページ

************************************************** */
.reviewPost-wrap { padding: 0 50px; }

.reviewPost-dl { color: #868686; width: 100%; font-size: 13px; padding: 10px 0; margin-bottom: 30px; background: #e9f6ff; border-radius: 5px; box-shadow: 0px 2px 5px #c8c4bd; display: table; }

.reviewPost-dt, .reviewPost-dd { float: left; vertical-align: middle; padding: 20px 0; border-bottom: 1px dashed #bed0dc; line-height: 1.7em; }

.reviewPost-dt:last-child, .reviewPost-dd:last-child { border-bottom: 0; }

.reviewPost-dt { text-align: right; width: 20%; }

.reviewPost-dd { width: 80%; padding-left: 10px; padding-right: 20px; }

.rate-dt, .rate-dd { height: 200px; }

.name-dt, .name-dd { height: 65px; }

.review-dt, .review-dd { height: auto; border-bottom: 0; }

.name-dd input[type="text"] { width: 50%; margin-bottom: 0; height: 2em; }

.review-dd textarea { width: 90%; height: 150px; line-height: 1.8em; text-indent: 0.5em; }

/* **************************　五段階評価　*/
.reviewPost-rate-table { width: 100%; }

.reviewPost-rate-th { width: 20%; padding: 5px 0; text-align: right; vertical-align: middle; }

.reviewPost-rate-td { width: 80%; padding: 5px 0; padding-left: 1em; }

.reviewPost-attention { font-size: 10px; line-height: 1.8em; }

.reviewPost-rate-inner { height: 20px; }

.reviewPost-rate-inner label { display: inline-block; cursor: pointer; width: 25px; height: 20px; text-align: left; position: relative;overflow: hidden; background: url(../image/rate-off.png) no-repeat left top; }

.reviewPost-rate-inner label.rate-on { background: url(../image/rate-on.png) no-repeat left top; }

.reviewPost-rate-inner input { display: block; position: absolute; left: -200px; top: 0; }

/*テキストエリアにフォーカスした時の色設定*/
.reviewPost-wrap textarea:focus, .reviewPost-wrap input[type="text"]:focus, .reviewPost-wrap input[type="password"]:focus, .reviewPost-wrap input[type="datetime"]:focus, .reviewPost-wrap input[type="datetime-local"]:focus, .reviewPost-wrap input[type="date"]:focus, .reviewPost-wrap input[type="month"]:focus, .reviewPost-wrap input[type="time"]:focus, .reviewPost-wrap input[type="week"]:focus, .reviewPost-wrap input[type="number"]:focus, .reviewPost-wrap input[type="email"]:focus, .reviewPost-wrap input[type="url"]:focus, .reviewPost-wrap input[type="search"]:focus, .reviewPost-wrap input[type="tel"]:focus, .reviewPost-wrap input[type="color"]:focus, .reviewPost-wrap .uneditable-input:focus { border-color: rgba(255, 208, 230, 0.8); outline: 0; outline: thin dotted \9; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 140, 186, 0.6); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 140, 186, 0.6); box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 140, 186, 0.6); }

/* **************************　投稿完了　*/
.reviewPost-wrap.reviewFinish h1 { height: 200px; text-indent: -9999px; background: url(../image/review-finish.png) no-repeat center top; }

.reviewPost-wrap.reviewFinish p { line-height: 2em; margin-bottom: 1em; }