@charset "utf-8"; /* header * --------------------------- */ #NR-header-logo-goo img { height: 36px; margin-right: 2px; /*10px → 2px に変更*/ width: 70px; } @media screen and (max-width: 599px){ .NR-rwd #NR-header-logo-goo img { height: 32px; margin-right: 0; vertical-align: middle;/*vertical-align: bottom;を削除*/ width: auto; } } #NR-header-logo #NR-header-logo-sv { font-size: 28px; /*21px → 28px に変更*/ vertical-align: middle; font-weight: bold; /*追加*/ letter-spacing: 0.05em; /*追加*/ } @media screen and (max-width: 599px){ .NR-rwd #NR-header-logo #NR-header-logo-sv { font-size: 25px; /*19px → 25px に変更*/ } } @media screen and (max-width: 599px){ .NR-rwd #NR-header-logo-sv { display: block; line-height: 38px; /*36px → 38pxに変更*/ margin: 0px 32px 0 68px; /*70px → 68pxに変更*/ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } } /* nav * --------------------------- */ html body #NR-nav { border-bottom: none; } html body #NR-nav #NR-nav-main { background-color: #aaa; /* #cc3333 → #aaaに変更 */ margin-bottom: 0; padding-bottom: 0; } /* cate * --------------------------- */ #NR-category { width: 100%; overflow: hidden; } #ranking-category { overflow-x: auto; } html body #ranking-category ul li { flex: 0 0 20%; /*※common.cssの「flex:1;」をこれに書き換える*/ } @media screen and (max-width: 599px){ html body #ranking-category ul li:nth-child(4), html body #ranking-category ul li:nth-child(n+6) { display: block; } } /* * ※↑はサンプル用に打ち消しているだけなので実際は * * common.cssの @media screen and (max-width: 599px) の * html body #ranking-category ul li:nth-child(4), html body #ranking-category ul li:nth-child(n+6) のスタイルを * 削除(またはコメントアウトで無効に)する * * */ /* toc * --------------------------- */ #toc_container { background: #f9f9f9; border: 1px solid #aaa; padding: 10px; margin-bottom: 2em; min-width: 250px; display: table; font-size: 85%; } .toc_title { text-align: center; font-weight:bold; } .toc_list a { background: none !important; text-decoration: underline !important; } .toc_list ol { margin-left: 1.5em; } /* add 20190213 * --------------------------- */ html body #ranking-category { width: 1004px; margin: 3px auto 0; } html body #ranking-category::-webkit-scrollbar { display: none; height: 0 !important; } html body #ranking-category ul li { flex: 1; } @media screen and (min-width: 600px) and (max-device-width: 1004px){ #NR-category { width: 1004px; } } @media screen and (max-width: 599px){ html body #ranking-category { width: 100%; margin: 3px 0 0; } html body #ranking-category ul li { flex: 0 0 110px; } } /*↓追加*/ .header-img { position: relative; text-align: center; width: 100%; height: 200px; background : #fff url(https://i.xgoo.jp/img/watch/header-img.png) no-repeat center center; box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2) inset; } .header-img.post { height: 80px; } .header-ttl { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 100%; height: 100%; background: rgba(255,255,255,0.6); } .header-ttl img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 280px; height: auto; } .post .header-ttl img { width: 180px; } @media screen and (min-width: 1024px) { .header-ttl { width: 1024px; } .header-ttl img { left: 50px; right: auto; } } @media screen and (max-width: 599px) { .header-ttl { width: 100%; } .header-ttl img { width: 60%; } } /* add 20190307 * --------------------------- */ .fixed-nav { position: fixed; width: 100%; background: #fff; z-index: 9999; } #NR-main #toc_container { position: relative; } #NR-main .toc-container-wrapper { position: absolute; bottom: -1px; left: -1px; width: 101%; height: 101%; z-index: 2; background: linear-gradient( to bottom, hsla(0, 100%, 100%, 0) 0%, hsla(0, 100%, 100%, .95) 100% ); } body #readmorebutton { display: block; width: 100%; height: 50px; position: relative; margin-top: 0; z-index: 3; display: flex; justify-content: center; align-items: center; font-weight: bold; background: #BF3137; color: #fff !important; } #readmorebutton:hover { cursor: pointer; } /* add 20190910 * --------------------------- */ .entry-item-in img { max-width:100%; } #toc_container2 { display: none; } .footer__docomo { background: #fff; padding:2rem 0; text-align: center; } .footer__docomo img { display:initial; width:120px; height:30px; }