@charset "utf-8"; body { font-family: "メイリオ","Meiryo", Verdana,'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','MS Pゴシック',Osaka,sans-serif,Ariel,Helvetica; color: #111111; margin: 0 auto; line-height : 160%; font-size: 100%; background: #000; } img {padding: 0px 1px 0px 1px; border: none;} a img:hover {opacity:0.6; filter: alpha(opacity=60);} a:link {color: #0000CC; text-decoration: none;} a:visited {color: #80008b;} a:hover {color: #CC0000; position: relative; top: 1px; left: 1px; text-decoration: underline;} a:active {color: #CC0000;} ul { list-style: none; list-style-type: none; padding:0; } h1 { margin: 0 0 15px; } /* レイアウト */ #main { width: 940px; margin: 0 auto; padding: 20px 20px 0; background: #fff; border-left: 0px solid rgb(176, 176, 176); border-right: 0px solid rgb(176, 176, 176); } #primary { clear: both; } #secondary { float:right; width: 250px; padding: 5px 5px 0px; } #content { width: 650px; float: left; padding: 5px 5px 0px; } /* header */ #site-navigation { background: #fff; border-bottom: 1px solid rgb(176, 176, 176); } #page-title { width: 885px; text-align: left; font-size: 0.75em; font-weight: normal; margin: 0px auto; padding: 5px 20px; text-align: left; } hgroup { background: url(https://1000giribest.com/wp-content/uploads/2016/09/newheader01.gif); padding-top: 20px; padding-bottom: 1px; text-align: center;; } h2.site-description { color: #fff; font-size: 0.75em; text-align: center; margin: 0px auto; padding: 0px 20px; font-weight: normal; width: 845px; } #head-ads { width: 900px; margin: 0 auto; } #head-ads ul li { display: table-cell; width: 300px; height: 250px; } #head-ads ul li img:first-child { margin-bottom: -8px; } #site-menu { background: url(https://1000giribest.com/wp-content/uploads/2015/10/menuimage01.png) repeat-x rgb(255, 255, 255); height: 42px; margin-top: 1px; } #site-menu ul { width: 940px; margin:0 auto; } #site-menu ul li { border-left: 1px solid rgb(44, 70, 85); float: left; } #site-menu ul li:last-child { border-right: 1px solid rgb(44, 70, 85); } #site-menu ul li a { border-right: 1px solid rgb(44, 70, 85); padding: 0px; font-size: 0.75em; font-weight: bold; color: rgb(255, 255, 255); width: 128px; line-height: 42px; height: 100%; display: block; text-align: center; text-decoration: none; float: left; } #site-menu ul li a:hover { background: rgba(255, 255, 255, 0.3); color: #ffff00; text-decoration: underline; top: 0; left: 0; } /* widget */ #main-bottom-widget h3, #main-top-widget h3 { font-size: 1em; background: url(https://1000giribest.com/wp-content/uploads/2015/10/image-001.png) repeat-x rgb(255, 255, 255); border-top: 0px solid rgb(255, 255, 255); padding: 10px 10px 0px; height: 42px; color: rgb(255, 255, 255); } #secondary { font-size: 0.75em; line-height: 1.5; } #secondary h3{ text-align: center; font-size: 0.75em; line-height: 1.5; font-weight: bold; background: url(https://1000giribest.com/wp-content/uploads/2015/10/image-002.png) repeat-x rgb(255, 255, 255); padding: 6px 7px 3px 17px; margin: 0; color: rgb(255, 255, 255); border-top: 2px solid rgb(44, 70, 85); border-left: 1px solid rgb(176, 176, 176); border-right: 1px solid rgb(176, 176, 176); } #secondary .widget { margin-bottom: 20px; } #secondary .textwidget, #secondary .tagcloud { text-align: center; padding: 5px 0; border-top: 1px dotted rgb(44, 70, 85); border-left: 1px solid rgb(176, 176, 176); border-right: 1px solid rgb(176, 176, 176); border-bottom: 1px solid rgb(176, 176, 176); } #secondary .ninja-recommend { width: 235px; margin: 0 auto; } /* entry */ .post h1 { background: url(https://1000giribest.com/wp-content/uploads/2015/10/image-001.png) repeat rgb(255, 255, 255); padding: 10px 10px 5px; margin: 0; border-top: 1px solid rgb(44, 70, 85); border-left: 7px solid rgb(44, 70, 85); border-right: 1px solid rgb(44, 70, 85); border-bottom: 1px solid rgb(44, 70, 85); } .post h1 a { font-size: 16px; color: #fff; } .post h1 a:hover { color: #CC0000; top: 0; left: 0; } .entry-footer, .entry-meta { font-size: 0.85em; color: rgb(119, 119, 119); margin: 0px auto; text-align: right; } .entry-footer a, .entry-meta a { color: rgb(119, 119, 119); } .entry-footer a:hover, .entry-meta a:hover { color: #CC0000; } .post { font-size: 0.875em; text-align: left; margin: 0px auto; padding: 10px 10px 0px; border-bottom: 1px solid rgb(119, 119, 119); } /* single */ .kijishita { font-size: 0.875em; text-align: left; border: 1px solid #b0b0b0; margin: 2em 0; padding: 10px; } .kijishita a { text-decoration: underline;; } /* navigation */ .navigation { font-size: 13px; text-align: left; margin: 1em 0; padding: 0px; } .navigation div { float: left; } .navigation a { border: 0px solid rgb(85, 85, 85); border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; color: rgb(17, 17, 17); text-decoration: none; } .navigation a:hover { text-decoration: underline;; color: #CC0000; top:0; left:0; } .nav-home { background: url(https://1000giribest.com/wp-content/uploads/2015/11/image-home01.png) 0px 2px no-repeat; padding-left: 18px; margin: 0 3px; } .nav-previous { background: url(https://1000giribest.com/wp-content/uploads/2015/11/i_arrow_left01.gif) 0% 50% no-repeat rgb(255, 255, 255); padding-left: 20px; margin: 0; } .nav-next { background: #ffffff url(https://1000giribest.com/wp-content/uploads/2015/11/i_arrow_right01.gif) right no-repeat; padding-right: 20px; margin: 0; } .nav-top { background: url(https://1000giribest.com/wp-content/uploads/2015/11/pageup01.png) 0px 2px no-repeat; padding-left: 18px; margin: 0; } .nav-single { font-size: 12px; text-align: left; margin: 1em 0 2em; line-height: 2.5; } .nav-single-next { display: block; background: url(https://1000giribest.com/wp-content/uploads/2015/11/i_bg_Newer001.gif) 0% 0% no-repeat; margin: 0px; } .nav-single-previous { display: block; background: url(https://1000giribest.com/wp-content/uploads/2015/11/i_bg_Older001.gif) 0% 0% no-repeat; margin: 0px; } .nav-single-previous a, .nav-single-next a { border-bottom: 1px solid rgb(85, 85, 85); color: rgb(85, 85, 85); text-decoration: none; padding: 0px 1em 3px 100px; } .nav-single-previous a:hover, .nav-single-next a:hover { border-bottom: 2px solid rgb(211, 0, 0); color: rgb(211, 0, 0); top:0; left:0; } /* footer */ #colophon { clear: both; width: 940px; margin: 0 auto; background: #fff; padding: 20px 20px 0; text-align: center; } #footer-navi { font-size: 12px; margin: 0px auto; display: inline-block; } .footer-info { clear: both; font-size: 0.875em; color: #fff; background: rgb(0, 0, 0); border-top: 1px solid rgb(176, 176, 176); border-left: 0px solid rgb(176, 176, 176); border-right: 0px solid rgb(176, 176, 176); padding: 1em; } .footer-info a { color: #fff; font-weight: bold; } .footer-info a:hover { color: #fff; top: 0; left: 0; } .site-info a { font-size: 1.15em; padding: 0 10px; } .kadomaruimage img{ border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; } div.kadomaru { -moz-border-radius: 20px; /* Firefox */ -webkit-border-radius: 20px; /* Safari,Chrome */ border-radius: 10px; /* CSS3 */ border: 2px black solid; /* 枠線の装飾 */ background-color: #FFFF33; /* 背景色 */ } .shadow{ -moz-box-shadow: 2px 2px 2px 2px #CCC; -webkit-box-shadow: 2px 2px 2px 2px #CCC; box-shadow: 2px 2px 2px 2px #CCC; background-color: #000000; padding: 10px; margin: 20px; } .defaultlist ,.defaultlist li{ padding:0px; margin:0px; } .defaultlist li{ list-style-type:none !important; list-style-image:none !important; margin: 5px 0px 5px 0px !important; } .list1 li{ position:relative; padding-left:20px; font-size:14px } .list1 li:before{ content:''; display:block; position:absolute; box-shadow: 0 0 2px 2px rgba(255,255,255,0.2) inset; top:3px; left:2px; height:0; width:0; border-top: 6px solid transparent; border-right: 7px solid transparent; border-bottom: 6px solid transparent; border-left: 9px solid #aaa; } #wpp-2 ul li { height:90; overflow:hidden; } #wpp-2 ul img { float:left; margin-right:5px; margin-bottom:5px; } #fam_news { margin-bottom: 1px; margin-top: 1px; } #fam_news ul{ list-style-type: none; width: 900px; padding-left: 10px; padding-right: 10px; } #fam_news ul li{ border-bottom: 1px dashed #C4C4C4; padding: 3px 25px; /* アローアイコン */ background-image: url(https://1000giribest.com/wp-content/uploads/2015/04/news_arrow02.png); background-repeat: no-repeat; background-position: 3px center; } #fam_news ul li a { color: #333; text-decoration: none; font-size: 91%; } .fam_rec { margin-bottom: 10px; margin-left: auto; margin-right: auto; } .fam_rec a { /* バナーの横幅 */ width: 224px; /* バナーの縦幅 */ height: 175px; float: left; display: block; margin-left: 1px; margin-right: 1px; border: 1.5px solid #BBB; overflow: hidden; } .fam_rec a div span { /* バナーの横幅 -10px */ width:214px !important; /* バナーの横幅の半分をマイナスで指定 */ margin-left:-112px !important; font-size: 84%; } #fam_hover_banner a div > img { /* 拡大するまでの秒数 */ -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear; } #fam_hover_banner a div > img:hover { opacity: 0.7; /* 拡大する大きさ */ -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } * html .clearfix { zoom: 1; } .clear { clear: both; } *:first-child+html .clearfix { zoom: 1; } /* タグクラウドに枠線を付ける(+フォントサイズ統一) */ .tagcloud a { font-size: 13px !important; border: solid 1px #000080; border-radius: 5px; display: inline-block; padding: 5px; margin-bottom: 8px; } .box10 { padding: 0.5em 1em; margin: 2em 0; font-weight: bold; border: solid 3px #000000; } .box15{ padding: 0.5em 1em; margin: 2em 0; color: #5d627b; background: white; border-top: solid 5px #5d627b; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22); } .box18 { padding: 0.5em 1em; margin: 1em 0; background: #d7dadd; border: dashed 2px #777a7f;/*点線*/ } .box30 { padding: 0.5em 1em; margin: 2em 0; color: #232323; background: #fff8e8; border-left: solid 10px #ffc06e; } .box43 { padding: 0.5em 1em; margin: 2em 0; font-weight: bold; color: #000000;/*文字色*/ background: #FFF; border: solid 2px #ff8c00;/*線*/ border-radius: 10px;/*角の丸み*/ } .box39 { padding: 0.5em 1em; margin: 2em 0; border: double 5px #f49c61; } .box99 { position: relative; margin: 2em 0; padding: 30px 10px 7px; border: solid 2px #878380; } .box99 .box-title { position: absolute; display: inline-block; top: -2px; left: -2px; padding: 0 9px; height: 25px; line-height: 25px; vertical-align: middle; font-size: 17px; background: #878380; color: #ffffff; font-weight: bold; } .box99 p { margin: 0; padding: 0; } box100 { margin: 2em 0; background: #f984ee; } .box100 .box-title { font-size: 1.2em; background: #f984ee; padding: 4px; text-align: center; color: #FFF; font-weight: bold; letter-spacing: 0.05em; } .box111{ padding: 8px 19px; margin: 2em 0; color: #2c2c2f; background: #f7cfb9; border-top: solid 5px #f95902; border-bottom: solid 5px #f95902; } ul.wpp-list li { border-bottom: 1px solid #ddd;/* 投稿下に下線 */ position:relative;/* 位置の指定 */ } /* リスト1段目の余白 */ ul.wpp-list li:nth-child(1){ padding: 10px 5px!important; } /* リスト2段目?10段目の余白 */ ul.wpp-list li:nth-child(n+2):nth-child(-n+10){ padding: 2px 5px 10px 5px !important; } /*ランキングカウンター実装*/ ul.wpp-list li:before{ content: counter(wpp-count);/*カウンターを表示*/ display: block;/* 縦に並べる指定 */ position: absolute;/* 左上に固定 */ color: #fff;/* 数字の色 */ text-shadow: 0 1px 2px rgba(0,0,0,0.2);/* 数字に影をつける */ font-size: 13px;/* 数字サイズ */ font-weight: bold;/* 数字を太字 */ background: #555;/* 背景色 */ padding: 3px 8px;/* 丸枠内の余白 */ border-radius: 10%;/* 背景の丸み */ z-index:1;/* 重なりの指定 */ } /*カウント数を実装*/ ul.wpp-list li { counter-increment: wpp-count; } /*上位3位の背景色変更*/ ul.wpp-list li:nth-child(1):before{ background: #fdd35c; } ul.wpp-list li:nth-child(2):before{ background: #a0a0a0; } ul.wpp-list li:nth-child(3):before{ background: #bf783e; } .contents-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; } .contents-box { margin-bottom: 3rem; padding: 3rem; width: 49%; background-color: #f0f0f0; } .contents-box img { display: block; margin-bottom: 3rem; width: 100%; height: auto; } .contents-box h2 { margin-bottom: 2rem; font-size: 2.2rem; text-align: center; } @media screen and (max-width: 768px){ .contents-wrap { flex-direction: column; } .contents-box { width: 100%; } }