@charset "utf-8"; /* CSS Document */ body{ line-height:1.3em; } /* ====================================== COMMON 汎用 ====================================== */ /* リード文 */ .read{ padding:20px;} a{ color:#000; text-decoration:none;} /* 汎用CLASS */ .tCenter{ text-align:center;} .tRight{ text-align:right;} .tLeft{ text-align:left;} .tHeight{ line-height:100px;} .p10{ padding:10px;} .p05{ padding:5px;} .redTxt{ color:#C00;} /* ---------------------- 占い：ランキングマーク */ .rank01, .rank02, .rank03, .rank04, .rank05, .rank06, .rank07, .rank08, .rank09, .rank10, .rank11, .rank12{ display:block; width:34px; height:34px; text-indent:-999em; } /*1位 */ .rank01{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank01.png); background-size:100%;} /*2位 */ .rank02{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank02.png); background-size:100%;} /*3位 */ .rank03{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank03.png); background-size:100%;} /*4位 */ .rank04{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank04.png); background-size:100%;} /*5位 */ .rank05{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank05.png); background-size:100%;} /*6位 */ .rank06{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank06.png); background-size:100%;} /*7位 */ .rank07{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank07.png); background-size:100%;} /*8位 */ .rank08{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank08.png); background-size:100%;} /*9位 */ .rank09{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank09.png); background-size:100%;} /*10位*/ .rank10{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank10.png); background-size:100%;} /*11位*/ .rank11{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank11.png); background-size:100%;} /*12位*/ .rank12{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/rank12.png); background-size:100%;} /* 占い：12星座マーク */ .astro01, .astro02, .astro03, .astro04, .astro05, .astro06, .astro07, .astro08, .astro09, .astro10, .astro11, .astro12, .astro01w, .astro02w, .astro03w, .astro04w, .astro05w, .astro06w, .astro07w, .astro08w, .astro09w, .astro10w, .astro11w, .astro12w{ display:block; width:34px; height:34px; margin:0 0 0 10px; text-indent:-999em; } /*おひつじ座*/ .astro01{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) 0 -157px;} /*おうし座*/ .astro02{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -77px -157px;} /*ふたご座*/ .astro03{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -154px -157px;} /*かに　座*/ .astro04{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -231px -157px;} /*しし　座*/ .astro05{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -308px -157px;} /*おとめ座*/ .astro06{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -385px -157px;} /*てんびん座*/ .astro07{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) 0 -237px;} /*さそり座*/ .astro08{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -77px -237px;} /*いて　座*/ .astro09{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -154px -237px;} /*やぎ　座*/ .astro10{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -231px -237px;} /*みずがめ座*/ .astro11{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -308px -237px;} /*うお　座*/ .astro12{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -385px -237px;} /* 白Version */ /*おひつじ座*/ .astro01w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) 0 -306px;} /*おうし座*/ .astro02w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -77px -306px;} /*ふたご座*/ .astro03w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -154px -306px;} /*かに　座*/ .astro04w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -231px -306px;} /*しし　座*/ .astro05w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -308px -306px;} /*おとめ座*/ .astro06w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -385px -306px;} /*てんびん座*/ .astro07w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) 0 -237px;} /*さそり座*/ .astro08w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -77px -387px;} /*いて　座*/ .astro09w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -154px -387px;} /*やぎ　座*/ .astro10w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -231px -387px;} /*みずがめ座*/ .astro11w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -308px -387px;} /*うお　座*/ .astro12w{ background:url(http://ic.sp1.fujitv.co.jp/inform/static/fortune/img/sprite_fortune.png) -385px -387px;} /* ベーシックフレーム(box-shadow:inset) */ .bscFrm{ border-radius:10px; margin:10px; padding:10px; position:relative; box-shadow:1px 1px 1px 1px rgba(0,0,0,0.2) inset; -webkit-box-shadow:1px 1px 1px 1px rgba(0,0,0,0.2) inset; } .bscFrm2{ border-radius:10px; margin:10px; padding:10px; position:relative; border:2px solid #666; box-shadow:1px 2px 1px 1px rgba(0,0,0,0.2); -webkit-box-shadow:1px 2px 1px 1px rgba(0,0,0,0.2); } /* ====================================== 非会員　未ログインの場合 ====================================== */ section.login { padding:20px; text-align:center; border-bottom:#333 1px solid;} section.login div.frame{ border-radius:10px; background:rgba(0,0,0,0.05); padding:15px 10px 15px 10px; box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5) inset; -webkit-box-shadow: 1px 1px 2px 1px rgba(0,0,0,0.5) inset; } section.login .btn.login a{ background:#137BF4; color:#fff; text-shadow:0 -1px 1px rgba(0,0,0,0.5); } section.login p{ padding:0 20px 20px 20px; text-align:left;} /* 頁下部リンク */ .pegaLink ul { margin:20px 20px 20px 20px; border-radius:10px; clear:both; float:none;} .pegaLink ul li{ line-height:40px; list-style:none; border-bottom: 1px solid rgba(0, 0, 0, 0.2);} .pegaLink ul li:nth-last-of-type(1){ border-bottom:none;} .pegaLink ul li a{ position:relative; display:block; padding:0 30px 0 20px;} .pegaLink ul li a::after{ position:absolute; width:6px; height:9px; top:60%; right:10px; margin-top:-9px; background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_top.png) no-repeat -110px -25px; content:"";} .pegaLink ul.white li a{ color:#fff;} .pegaLink ul.white li a::after{ position:absolute; width:12px; height:18px; top:50%; right:10px; margin-top:-9px; background:url(http://ic.sp1.fujitv.co.jp/inform/static/common/img/sprite_top.png) no-repeat -250px -50px; content:"";} /* -------------- FOOTER MAV -------------- */ footer{ background:rgba(0,0,0,0.1); text-shadow:0 1px 1px #FFFFFF; -webkit-text-shadow:0 1px 1px #FFFFFF;} #ftrNav{} #ftrNav ul{} #ftrNav ul li{ position:relative; border-bottom:1px #CCCCCC solid;} #ftrNav ul li::after{ display:block; position:absolute; right:0; top:50%; margin-top:-19px; width:20px; height:38px; content: ""; background:url(http://ic.sp1.fujitv.co.jp/inform/static/common/img/sprite_top.png) no-repeat -220px -100px;} #ftrNav ul li a{ display:block; padding-left:30px; line-height:80px; color:#666666;} #ftrNav ul li.home a{ padding-left:85px;} #ftrNav ul li.home a::after{ display:block; position:absolute; left:30px; top:50%; margin-top:-19px; width:42px; height:42px; content: ""; background:url(http://ic.sp1.fujitv.co.jp/inform/static/common/img/sprite_top.png) no-repeat -360px 0px;} /* FOOTER */ gbBizFooter{} /* jqでclass指定 */ .fujitop{ margin:15px 0 10px 0;padding-left:44px; height:48px; line-height:48px; font-size:24px; clear:both; overflow:hidden; display:inline-block; background: url('http://www.fujitv.co.jp/common/images/logo_bizfooter.png') no-repeat; -webkit-background-size:40px 44px; background-size:40px 44px;} footer small{ background:rgba(0,0,0,0.15); display:block;} small#copyright{ display:block; font-size:24px; text-align:center; padding:10px 0; background:#161616; color:#FFF; text-shadow:0 -1px 1px rgba(0,0,0,1); -webkit-text-shadow:0 -1px 1px rgba(0,0,0,1);} /* ============================== コンテンツタイトルグループ ============================== */ #fortune{background:#fff; margin:0; padding:5px 0; } body#fortune hgroup{/* background:rgba(209, 95, 234,1);*/ background:#f0f0f0; height:80px; position:relative;} /* たまご　画像 */ body#fortune hgroup::before{ position:absolute; width:85px; height:48px; top:50%; margin-top:-25px; left:12px; background:url(http://ic.sp1.fujitv.co.jp/inform/static/common/img/sprite_topnav.png) -58px -119px no-repeat; text-indent:-999em; content:"";} /* [占い]　タイトル画像*/ body#fortune hgroup > h1{ position:absolute; width:428px; height:37px; top:50%; margin-top:-18px; left:100px; background:url(../img/common/sprite_fortune2.png) 0px 0px no-repeat; text-indent:-999em;} /* 番組アイコン */ body#fortune hgroup > h2{ position:absolute; width:99px; height:18px; top:50%; margin-top:-9px; right:20px; background:url(http://ic.sp1.fujitv.co.jp/inform/static/common/img/sprite_topnav.png) -52px -168px no-repeat; text-indent:-999em;} /* ============================== ページタイトル ============================== */ /* 日付表示周り */ #fortune > article > section{ position:relative;} /*固定めざましくん*/ #fortune #mezaFix{ position:absolute; margin:0; left:10px; width:58px; height:50px; text-indent:-999em; background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character01.png);background-size:100%;} /* オレンジ枠吹き出し */ #fortune h1.pageTitle{ position: relative; padding:10px 5px; margin:20px 20px 20px 90px; border-radius:10px; border: 3px solid #ff5a1f;text-align:center; background:#faffe3; color:#000;letter-spacing:0.05em; text-shadow:0px 1px 1px rgba(255, 255, 255, 0.9), 0px -1px 1px rgba(0,0,0,0.5); -webkit-text-shadow:0px 1px 1px rgba(255, 255, 255, 0.9), 0px -1px 1px rgba(0,0,0,0.5); box-shadow:0px 2px 2px rgba(0,0,0,0.3); -webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.3); font-size:90%; } #fortune h1.pageTitle::after,#fortune h1.pageTitle::before{ right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } #fortune h1.pageTitle::after{ border-color: rgba(250, 255, 227, 0); border-right-color: #faffe3; border-width: 6px; top: 80%; margin-top: -15px;} #fortune h1.pageTitle::before { border-color: rgba(255, 90, 31, 0); border-right-color: #ff5a1f; border-width: 10px; top: 80%; margin-top: -19px;} /* ================================= 星座＆ランキングタイトル =================================*/ #fortune .rankAstro{ position:relative; text-align:left; margin:0 20px 0 15px; padding:2px 10px 2px 80px; text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.5); -webkit-text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.5); line-height:45px; text-decoration:none; font-size:130%; } /*ランキング　位置だけ上書き指定*/ #fortune .rankAstro span[class^="rank"]{ position:absolute; left:0; top:50%; margin-top:-17px; margin-left:0px;} /*星座　位置だけ上書き指定*/ #fortune .rankAstro span[class^="astro"]::before{ display:block; position:absolute; left:40px; width:34px;/*幅固定(高さは固有)*/ top:50%;content:"";}/* 星座固有指定は指定済 */ /*おひつじ座*/ .astro01ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -5px -79px; height:22px; margin-top:-11px;} /*おうし座*/ .astro02ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -45px -78px; height:22px; margin-top:-10px;} /*ふたご座*/ .astro03ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -82px -77px; height:23px; margin-top:-12px;} /*かに　座*/ .astro04ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -120px -78px; height:21px; margin-top:-11px;} /*しし　座*/ .astro05ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -161px -78px; height:21px; margin-top:-10px;} /*おとめ座*/ .astro06ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -200px -79px; height:21px; margin-top:-11px;} /*てんびん座*/ .astro07ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -5px -117px; height:19px; margin-top:-11px;} /*さそり座*/ .astro08ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -45px -119px; height:21px; margin-top:-11px;} /*いて　座*/ .astro09ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -82px -119px; height:20px; margin-top:-11px;} /*やぎ　座*/ .astro10ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -125px -118px; height:20px; margin-top:-11px;} /*みずがめ座*/ .astro11ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -161px -117px; height:19px; margin-top:-9px;} /*うお　座*/ .astro12ic::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune.png) -200px -119px; height:18px; margin-top:-9px;} .rankAstro span{ text-decoration:none; } /* [★]タイトル */ #fortune .starTitle{ position:relative; padding:5px 0 0 42px; text-shadow: 0px -1px 1px rgba(0,0,0,0.5); -webkit-text-shadow: 0px -1px 1px rgba(0,0,0,0.5); } #fortune .starTitle::before{ position:absolute; top:50%;content:" ";width:18px; height:30px; margin-top:-20px; left:18px;} dl.spLucky{ padding-left:10px;} dl.spLucky dt{} dl.spLucky dt::before{ content:">>";} dl.spLucky dd{ padding-left:10px;} /* 色別[★]タイトル */ /* 1位 */ #fortune #rank01page .starTitle, #fortune #rank01page dl.spLucky dt{ color:#F53F42;} #fortune #rank01page .starTitle::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -60px -61px;} /* 2,3位 */ #fortune #rank02page .starTitle, #fortune #rank03page .starTitle, #fortune #rank02page dl.spLucky dt, #fortune #rank03page dl.spLucky dt{ color:#FF9833;} #fortune #rank02page .starTitle::before, #fortune #rank03page .starTitle::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -79px -61px;}/*+40*/ /* 4,5位 */ #fortune #rank04page .starTitle, #fortune #rank05page .starTitle, #fortune #rank04page dl.spLucky dt, #fortune #rank05page dl.spLucky dt{ color:#F7BF08;} #fortune #rank04page .starTitle::before, #fortune #rank05page .starTitle::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -100px -61px;}/*+40*/ /* 6,7位 */ #fortune #rank06page .starTitle, #fortune #rank07page .starTitle, #fortune #rank06page dl.spLucky dt, #fortune #rank07page dl.spLucky dt{ color:#18AD3A;} #fortune #rank06page .starTitle::before, #fortune #rank07page .starTitle::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -120px -61px;}/*+40*/ /* 8,9位 */ #fortune #rank08page .starTitle, #fortune #rank09page .starTitle, #fortune #rank08page dl.spLucky dt, #fortune #rank09page dl.spLucky dt{ color:#148FC9;} #fortune #rank08page .starTitle::before, #fortune #rank09page .starTitle::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -139px -61px;}/*+40*/ /* 10,11位 */ #fortune #rank10page .starTitle, #fortune #rank11page .starTitle, #fortune #rank10page dl.spLucky dt, #fortune #rank11page dl.spLucky dt{ color:#2952D5;} #fortune #rank10page .starTitle::before, #fortune #rank11page .starTitle::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -160px -61px;}/*+40*/ /* 12位 */ #fortune #rank12page .starTitle, #fortune #rank12page dl.spLucky dt{ color:#7E1B9E;} #fortune #rank12page .starTitle::before{ background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -180px -61px;}/*+40*/ /* ============================== 星座　一覧 ============================== */ /*星座一覧設定ボタン(リンクアリ)*/ #fortune #astroList > a{ display:block; position:relative; margin:0 20px 20px 20px; padding-left:60px; line-height:50px; border-radius:10px; background: #FFBC00; text-shadow: none; box-shadow: none; } /* (>)右マーク */ #fortune #astroList > a::before{ position: absolute; right: 10px; top: 50%; margin-top: -5px; width: 10px; height: 19px; content: ""; background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_top.png) no-repeat -110px -25px; } /*星座設定　確認内容(リンクナシ)*/ #fortune #astroList > h2{ display:block; position:relative; margin:0 20px 20px 20px; padding-left:55px; line-height:50px; border-radius:10px; border:#000 2px solid; text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.5); -webkit-text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.5); } /*星座　位置だけ上書き指定*/ #fortune #astroList h2::before{ display:block; position:absolute; left:20px; width:34px; top:50%;content:"";}/* 星座固有指定は指定済 */ #fortune #astroList h2 span{ font-size:smaller; color:#333;} /* 設定ボタン左右 */ #fortune #astroList .half .btn a{ text-align:center;} #fortune #astroList .half .btn:nth-of-type(2n+1) a{ background:rgba(0,0,0,0.5); color:#FFF;} #fortune #astroList .half .btn:nth-of-type(2n) a{ background:rgba(255, 90, 31,0.9)} #fortune #astroList .half{ margin-bottom:40px; overflow:hidden;} /* 左右2つボタンver */ .half .btn{ width:50%; float:left; margin:0; padding:0;} .half .btn:nth-of-type(2n+1) a{ margin:10px 10px 20px 20px;} .half .btn:nth-of-type(2n) a{ margin:10px 20px 20px 10px;} /* ON btn*/ .btn a::after{ display:block; position:absolute; width:20px; height:38px; top:50%; margin-top:-19px;right:0; content: ""; background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_top.png) no-repeat -99px -40px; } /* btn class */ .btn{padding:10px 20px 10px 20px;} .btn a{ position:relative; display:block; padding: 0 20px; border-radius: 10px; line-height:50px; border-top:0; border-right:rgba(0, 0, 0 , 0.5) 1px solid; border-bottom:rgba(0, 0, 0, 0.5) 2px solid; border-left:rgba(0, 0, 0, 0.5) 1px solid; } #fortune .btn_box { display: flex; flex-wrap: wrap; margin: 0 20px 20px 20px; } #fortune .btn_item { display: inline-block; width: 49%; margin-top: 20px; border-radius: 30px; } #fortune .btn_item:first-child { margin-right: 2%; } #fortune .btn_item:first-child a { background: #9E9E9E; } #fortune .btn_item a { display: block; padding: 10px 0; line-height: 1; font-size: 13px; font-weight: bold; text-align: center; color: #ffffff; background: #ff8c1b; border-radius: 30px; } /* 汎用CLASS */ .tCenter{ text-align:center;} .tRight{ text-align:right;} .tLeft{ text-align:left;} .tHeight{ line-height:100px;} .p10{ padding:10px;} .p05{ padding:5px;} .redTxt{ color:#C00;} .btn.red a {background: #d24120;} .btn.green a{background: #25723d;} .btn.gray a {background: #444!important;} /* ---------------- 個別ページ ---------------- */ /* ランキングと星座表示背景色指定 */ .nonFrm{ margin:20px; border-radius:10px;box-shadow:0px 2px 2px rgba(0,0,0,0.2);-webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.2);} /* 個別背景指定 */ #fortune #rank01page .nonFrm{background:rgba(245, 63, 66 , 1);} #fortune #rank02page .nonFrm{background:rgba(255, 152, 51, 1);} #fortune #rank03page .nonFrm{background:rgba(255, 152, 51, 0.8);} #fortune #rank04page .nonFrm{background:rgba(247, 191, 8, 0.8);} #fortune #rank05page .nonFrm{background:rgba(247, 191, 8, 0.6);} #fortune #rank06page .nonFrm{background:rgba(39, 178, 71, 0.7);} #fortune #rank07page .nonFrm{background:rgba(24, 173, 58, 0.85);} #fortune #rank08page .nonFrm{background:rgba(20, 143, 201, 0.75);} #fortune #rank09page .nonFrm{background:rgba(20, 143, 201, 0.9);} #fortune #rank10page .nonFrm{background:rgba(41, 82, 213, 0.6);} #fortune #rank11page .nonFrm{background:rgba(41, 82, 213, 0.8);} #fortune #rank12page .nonFrm{background:rgba(126, 27, 158, 0.65);} /* ------------- 表情は5段階 ------------- */ #fortune .mezaFace{ position:relative; margin:0 30px 20px 30px; min-height:90px;} #fortune .mezaFace::before{ width:54px; height:39px; position:absolute; top:50%; margin-top:-39px; text-indent:-999em; content:"";} /*顔の向きによって左右に配置変更*/ #fortune #rank01page .mezaFace{padding-right: 80px;} /* 個別左右テキスト表示エリア余白*/ #fortune #rank02page .mezaFace, #fortune #rank03page .mezaFace, #fortune #rank04page .mezaFace, #fortune #rank05page .mezaFace{padding-left:75px;} /**/ #fortune #rank06page .mezaFace, #fortune #rank07page .mezaFace, #fortune #rank08page .mezaFace{padding-right:70px;} /**/ #fortune #rank09page .mezaFace, #fortune #rank10page .mezaFace, #fortune #rank11page .mezaFace{padding-right:75px;} /**/ #fortune #rank12page .mezaFace{padding-left:70px;} /* 個別左右めざましくん位置*/ /* 左置き */ #fortune #rank02page .mezaFace::before, #fortune #rank03page .mezaFace::before, #fortune #rank04page .mezaFace::before, #fortune #rank05page .mezaFace::before, #fortune #rank12page .mezaFace::before{ left:0;} /* 右置き */ #fortune #rank01page .mezaFace::before, #fortune #rank06page .mezaFace::before, #fortune #rank07page .mezaFace::before, #fortune #rank08page .mezaFace::before, #fortune #rank09page .mezaFace::before, #fortune #rank10page .mezaFace::before, #fortune #rank11page .mezaFace::before{ right:0;} /* HAPPY------------ */ /* 1位 */#fortune #rank01page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character02.png); background-size:100%} /* GOOD------------ */ /* 2位 */#fortune #rank02page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character03.png); background-size:100%} /* 3位 */#fortune #rank03page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character03.png); background-size:100%} /* 4位 */#fortune #rank04page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character03.png); background-size:100%} /* 5位 */#fortune #rank05page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character03.png); background-size:100%} /* usual------------ */ /* 6位 */#fortune #rank06page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character04.png); background-size:100%} /* 7位 */#fortune #rank07page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character04.png); background-size:100%} /* 8位 */#fortune #rank08page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character04.png); background-size:100%} /* unlucky------------ */ /* 9位 */#fortune #rank09page .mezaFace::before{background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character05.png); background-size:100%} /* 10位 */#fortune #rank10page .mezaFace::before{background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character05.png); background-size:100%} /* 11位 */#fortune #rank11page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character05.png); background-size:100%} /* BAD------------ */ /* 12位 */#fortune #rank12page .mezaFace::before{background: url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/character06.png); background-size:100%} /* ------------------ ランキング頁 ------------------ */ #fortune #rankList{ position:relative;} /* ランキング一覧まとめ */ #fortune #rankList > a{ display:block; border-radius:10px; margin:10px 20px;overflow:hidden; box-shadow:0px 2px 2px rgba(0,0,0,0.2); -webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.2); } #fortune #rankList > a .rankAstro::before{ position:absolute; width:12px; height:18px; top:60%; right:0; margin-top:-9px; background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_top.png) no-repeat -110px -25px; content:"";} /* 個別背景指定 */ #fortune #rankList > a:nth-of-type(1){ margin-top:0px; background:rgba(245, 63, 66 , 1);} #fortune #rankList > a:nth-of-type(2){background:rgba(255, 152, 51, 1);} #fortune #rankList > a:nth-of-type(3){background:rgba(255, 152, 51, 0.8);} #fortune #rankList > a:nth-of-type(4){background:rgba(247, 191, 8, 0.8);} #fortune #rankList > a:nth-of-type(5){background:rgba(247, 191, 8, 0.6);} #fortune #rankList > a:nth-of-type(6){background:rgba(39, 178, 71, 0.7);} #fortune #rankList > a:nth-of-type(7){background:rgba(24, 173, 58, 0.85);} #fortune #rankList > a:nth-of-type(8){background:rgba(20, 143, 201, 0.75);} #fortune #rankList > a:nth-of-type(9){background:rgba(20, 143, 201, 0.9);} #fortune #rankList > a:nth-of-type(10){background:rgba(41, 82, 213, 0.6);} #fortune #rankList > a:nth-of-type(11){background:rgba(41, 82, 213, 0.8);} #fortune #rankList > a:nth-of-type(12){background:rgba(126, 27, 158, 0.65);} /* アドバイス表 */ #fortune #rankList > a section{ background:#fff; margin:0 10px 10px 10px; padding:10px; border-radius:10px; box-shadow:0px 2px 2px rgba(0,0,0,0.3) inset; -webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.3) inset; } #fortune #rankList > a section table{} #fortune #rankList > a section table th{ text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.3); -webkit-text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.3); text-align:left; font-size:100%; } /* 項目名文字色 */ #fortune #rankList > a:nth-of-type(1) section table th{color:#F53F42;} #fortune #rankList > a:nth-of-type(2) section table th, #fortune #rankList > a:nth-of-type(3) section table th{color:#FF9833;} #fortune #rankList > a:nth-of-type(4) section table th, #fortune #rankList > a:nth-of-type(5) section table th{color:#F7BF08;} #fortune #rankList > a:nth-of-type(6) section table th, #fortune #rankList > a:nth-of-type(7) section table th{color:#18AD3A;} #fortune #rankList > a:nth-of-type(8) section table th, #fortune #rankList > a:nth-of-type(9) section table th{color:#148FC9;} #fortune #rankList > a:nth-of-type(10) section table th, #fortune #rankList > a:nth-of-type(11) section table th{color:#2952D5;} #fortune #rankList > a:nth-of-type(12) section table th{color:#7E1B9E;} /*色々*/ #fortune #rankList > a section table th::before{ content:"★"; text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.3); -webkit-text-shadow:0px 1px 1px rgba(255, 255, 255, 0.5), 0px -1px 1px rgba(0,0,0,0.3); } #fortune #rankList > a section table td{font-size:90%;} /*#fortune #rankList > a section table td::before{ content:"：";}*/ /*#fortune #rankList > a section table td::after{ content:"..."; color:#666;}*/ #fortune #rankList > a section p.wordBgnng{font-size:90%; line-height:1.3em; padding-bottom:5px;} #fortune #rankList > a section p.wordBgnng::after{ content:"..."; color:#666; } #fortune #login .adArea span{ color:rgba(255, 90, 31, 1); text-decoration:underline;} /* comming soon */ /* 更新時間テーブル */ .updateTime{ padding:10px; font-size:90%;} .updateTime table caption{margin-bottom:5px;} .updateTime table, .updateTime table th, .updateTime table td{ padding: 5px; border: #999 1px dotted;} .updateTime table{ width:100%; border-collapse: collapse;} .updateTime table caption{ text-align:left;} .updateTime table th{ background-color:#f0f0f0; text-align: center; } .updateTime table td{ text-align: left; padding: 10px;} /* ============================ 頁下部　コンテンツ内リンクメニュー(baseはcommon) ============================*/ #fortune .pegaLink ul {/* background:rgba(209, 95, 234,0.5);*/ background:#f0f0f0;} /* 設定　画像 */ #fortune .pegaLink .setting a{ padding:0 0 0 50px; font-size:80%; } #fortune .pegaLink .setting a::before{ position:absolute; width:25px; height:25px; top:18%; margin-top:-2px; left:15px; background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/setting.png);background-size:100%; text-indent:-999em; content:"";} /*ランキング画像*/ #fortune .pegaLink .rankLink a{ padding:0 0 0 50px; font-size:80%;} #fortune .pegaLink .rankLink a::before{ position:absolute; top:50%;content:" "; background:url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/sprite_fortune2.png) -28px -75px; width:20px; height:15px; margin-top:-7px; left:16px;} #rankList .cap { font-size: 93%; margin: 0 20px 8px 20px; text-align: center; } #rankList .cap strong { color: #f53f42; } .logincatch { border: 1px solid #ff875c; border-radius: 10px; padding: 15px 15px 10px 15px; margin: 0 15px; background-color: #ffefe9; } .logincatch p { font-size: 89%; text-align: center; } .logincatch p .ttl { display: block; color: #ff5a1f; font-size: 118%; font-weight: bold; margin-bottom: 10px; } .logincatch p strong { display: block; margin-bottom: 10px; } #fortune #rankList > a .rankAstro::before { content: "詳細"; position: absolute; top: 12px; right: -9px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; font-size: 60%; line-height: 2; width: auto; height: auto; padding: 0px 18px 0px 13px; margin: 0; background: #fff url(https://fujitvforsugotoku.jp/1images/sugotoku/fortune/arrow.png) no-repeat center right; background-size: 12px 12px; -moz-background-size: 12px 12px; -webkit-background-size: 12px 12px; box-shadow: 0 3px 0 rgba(0,0,0,0.4); -moz-box-shadow: 0 3px 0 rgba(0,0,0,0.4); -webkit-box-shadow: 0 3px 0 rgba(0,0,0,0.4); } /* 人気のコンテンツ */ #fortune .popular { padding-bottom: 5px; background: url(http://img.sp2.fujitv.co.jp/v/bg-s-yellow.png) repeat left top; } #fortune .popular h3 { border-top: 2px solid #000; border-bottom: 2px solid #000; color: #000; font-weight: bold; padding: 5px 0 5px 15px; margin: 0 0 15px 0; background-color: #ffef32; } #fortune .popular ul li { margin: 0 15px 10px 15px; } #fortune .popular ul li img { width: 100%; vertical-align: bottom; }