@charset "UTF-8";
/*
エネトリ!	#81e122
エネジョイ!	#ffc91a
エネスタ!	#aa58ef
エネコミ!	#16c187
エネグッズ!	#ec3e2c
エネレポ!	#3cdbe5
エネジョ!	#ed3a8e
エネメン!	#367be2
文字色	#1a1a1a
*/
/* - fixed: 2018年11月27日
id - name	color hex code
encomi → マンガ	16c187
enjoy → グルメ	ffc91a
energy → ゴラム	aa58ef
enemen → インタビュー	81e122
enrepo → Conちゃんが行く!	ec3e2c
enetry → 電力会社アレコレ	367be2
*/
/*
エネトリ!	#81e122
エネジョイ!	#ffc91a
エネスタ!	#aa58ef
エネコミ!	#16c187
エネグッズ!	#ec3e2c
エネレポ!	#3cdbe5
エネジョ!	#ed3a8e
エネメン!	#367be2
文字色	#1a1a1a
*/
/* - fixed: 2018年11月27日
id - name	color hex code
encomi → マンガ	16c187
enjoy → グルメ	ffc91a
energy → ゴラム	aa58ef
enemen → インタビュー	81e122
enrepo → Conちゃんが行く!	ec3e2c
enetry → 電力会社アレコレ	367be2
*/
div.article-list {
 margin-left: auto;
 margin-right: auto;
 text-align: left;
 max-width: 1010px;
 list-style: none;
 overflow-x: auto;
 overflow-y: hidden;
 white-space: nowrap;
 padding-bottom: 1rem;
 padding-left: 0rem;
 padding-right: 0rem;
}
div.article-list .item {
 position: relative;
 box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.1), 1px 1px 10px 0px transparent;
 background-color: white;
 display: block;
 float: none;
 width: 320px;
 min-height: 320px;
 overflow: hidden;
 padding: 1rem;
 margin-right: 1rem;
 margin-top: 1rem;
}
div.article-list .item .lb {
 margin-left: -1rem;
 margin-top: -1rem;
}
div.article-list .item .visual {
 width: 100%;
 height: 65%;
 overflow: hidden;
}
div.article-list .item .visual img {
 width: 100%;
 height: auto;
}
div.article-list .item .new-label {
 font-weight: bold;
 color: red;
 display: inline-block;
 background-color: white;
 font-size: 1.25em;
 position: absolute;
 top: 5px;
 left: -3.5px;
 transform: rotate(-45deg);
 padding-left: 0.25rem;
 padding-right: 1rem;
}
div.article-list .item .title {
 margin-top: 0.5rem;
 white-space: normal;
 font-size: 1em;
 font-weight: normal;
 display: inline;
}
div.article-list .item .time {
 margin-top: 0.5rem;
}
div.article-list .item:first-child {
 margin-left: 0;
}
div.article-list .item:last-child {
 margin-right: 0;
}
@media all and (max-width: 1200px) and (min-width: 769px) {
 div.article-list {
 max-width: 890px;
 }
 div.article-list .item {
 width: 280px;
 }
 div.article-list .item .title {
 font-size: 0.8em;
 }
}
@media all and (max-width: 768px) and (min-width: 481px) {
 div.article-list {
 max-width: 675px;
 }
}
@media only screen and (max-device-width: 480px) {
 div.article-list {
 overflow-x: hidden;
 overflow-y: visible;
 white-space: normal;
 }
 div.article-list .item {
 width: 100%;
 margin-left: 0;
 margin-right: 0;
 margin-bottom: 0;
 }
}
#page-home {
 /* slick customize */
 /* Arrows */
 /* Dots */ }
 #page-home .categories-list {
 padding-left: 15px;
 padding-right: 15px; }
 #page-home .categories-list .list-container {
 text-align: center; }
 #page-home .categories-list .list-container .bottom-navbar {
 display: flex;
 width: 100%;
 flex-wrap: wrap;
 justify-content: center; }
 #page-home .categories-list .list-container .bottom-navbar .bottom-nav-item {
 margin-right: 16px;
 margin-top: 8px; }
 #page-home .categories-list .top-navbar {
 display: inline-block;
 text-align: center;
 margin-left: auto;
 margin-right: auto; }
 #page-home .categories-list .category-item {
 padding-left: 0;
 padding-right: 0;
 text-align: center; }
 #page-home .categories-list .category-item img {
 height: 51.5px;
 width: auto;
 padding-top: 0.1rem;
 padding-bottom: 0.1rem; }
 #page-home .categories-list .category-item img.on {
 display: inline-block; }
 #page-home .categories-list .category-item img.off {
 display: none; }
 #page-home .slick-to-slider .visual {
 display: block;
 position: relative;
 width: calc(75vw);
 height: calc(75vw/2.0775);
 max-width: 855px;
 max-height: calc(855px/2.0775);
 overflow: hidden;
 text-align: center;
 background-color: transparent;
 background-position: center center;
 background-size: contain;
 background-repeat: no-repeat; }
 #page-home .slick-to-slider .visual img {
 margin-top: auto;
 margin-bottom: auto;
 margin-left: auto;
 margin-right: auto;
 max-width: 100%;
 display: block;
 width: 100%;
 height: auto; }
 #page-home .slick-to-slider .visual .caption {
 background-color: rgba(0, 0, 0, 0.49);
 width: 100%;
 position: absolute;
 right: 0px;
 padding-right: 1rem;
 bottom: 25px;
 color: white;
 font-size: 1em;
 text-align: right; }
 #page-home .categories-list {
 margin-top: 2rem;
 margin-bottom: 72px; }
 #page-home .categories-label {
 margin-top: 1rem;
 margin-bottom: 1rem; }
 #page-home .categories-label img {
 width: auto;
 height: 63px; }
 #page-home .topics-label {
 margin-top: 1rem;
 margin-bottom: 1rem; }
 #page-home .topics-label img {
 width: auto;
 height: 63px; }
 #page-home .more-label {
 margin-top: 1rem;
 margin-bottom: 1rem; }
 #page-home .more-label img {
 width: auto;
 height: 63px; }
 #page-home .concent-to-ha img.toha {
 width: auto;
 height: 47px;
 margin-top: 1rem;
 margin-bottom: 1rem; }
 #page-home .concent-to-ha .about-btn {
 display: inline-block;
 margin-top: 1rem;
 margin-bottom: 1rem; }
 #page-home .concent-to-ha .about-btn img {
 width: auto;
 height: 34px; }
 #page-home .top-slider {
 width: 75vw;
 height: calc(75vw/2.0775);
 max-width: 855px;
 max-height: calc(855px/2.0775);
 margin: 0 auto; }
 #page-home .slick-prev,
 #page-home .slick-next {
 font-size: 0;
 line-height: 0;
 position: absolute;
 top: 50%;
 display: block;
 width: 40px;
 height: 40px;
 padding: 0;
 -webkit-transform: translate(0, -50%);
 -ms-transform: translate(0, -50%);
 transform: translate(0, -50%);
 cursor: pointer;
 border: none;
 outline: none; }
 #page-home .slick-prev:hover:before,
 #page-home .slick-prev:focus:before,
 #page-home .slick-next:hover:before,
 #page-home .slick-next:focus:before {
 opacity: 1; }
 #page-home .slick-prev.slick-disabled:before,
 #page-home .slick-next.slick-disabled:before {
 opacity: .25; }
 #page-home .slick-prev:before,
 #page-home .slick-next:before {
 font-family: 'slick';
 font-size: 40px;
 line-height: 1;
 opacity: .75;
 color: black;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale; }
 #page-home .slick-prev {
 left: -50px; }
 #page-home [dir='rtl'] .slick-prev {
 right: -50px;
 left: auto; }
 #page-home .slick-prev:before {
 content: ''; }
 #page-home [dir='rtl'] .slick-prev:before {
 content: ''; }
 #page-home .slick-next {
 right: -50px; }
 #page-home [dir='rtl'] .slick-next {
 right: auto;
 left: -50px; }
 #page-home .slick-next:before {
 content: ''; }
 #page-home [dir='rtl'] .slick-next:before {
 content: ''; }
 #page-home .slick-next {
 background-image: url("/static/newspapers/img/right.png");
 background-repeat: no-repeat;
 background-size: 40px 40px; }
 #page-home .slick-prev {
 background-image: url("/static/newspapers/img/left.png");
 background-repeat: no-repeat;
 background-size: 40px 40px; }
 #page-home .slick-dotted.slick-slider {
 margin-bottom: 30px; }
 #page-home .slick-dots {
 position: absolute;
 bottom: 5px;
 display: block;
 width: 100%;
 padding: 0;
 margin: 0;
 list-style: none;
 text-align: center; }
 #page-home .slick-dots li {
 position: relative;
 display: inline-block;
 width: 20px;
 height: 20px;
 margin: 0 5px;
 padding: 0;
 cursor: pointer; }
 #page-home .slick-dots li button {
 font-size: 0;
 line-height: 0;
 display: block;
 width: 20px;
 height: 20px;
 padding: 5px;
 cursor: pointer;
 color: transparent;
 border: 0;
 outline: none;
 background: transparent; }
 #page-home .slick-dots li button:hover,
 #page-home .slick-dots li button:focus {
 outline: none; }
 #page-home .slick-dots li button:hover:before,
 #page-home .slick-dots li button:focus:before {
 opacity: 1; }
 #page-home .slick-dots li button:before {
 font-family: 'slick';
 font-size: 10px;
 line-height: 20px;
 position: absolute;
 top: 0;
 left: 0;
 width: 20px;
 height: 20px;
 content: '•';
 text-align: center;
 opacity: .4;
 color: white;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale; }
 #page-home .slick-dots li.slick-active button:before {
 opacity: .85;
 color: white; }
 @media (min-device-width: 980px) {
 #page-home .categories-list .category-item:hover {
 text-decoration: none;
 background: transparent; }
 #page-home .categories-list .category-item:hover img.on {
 display: none; }
 #page-home .categories-list .category-item:hover img.off {
 display: inline-block; } }
 @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
 #page-home .categories-list {
 max-width: 767px; } }
 @media only screen and (max-device-width: 480px) {
 #page-home .fluid-slider {
 width: 100%;
 max-width: 100%;
 padding-left: 0;
 padding-right: 0; }
 #page-home .fluid-slider .top-slider {
 width: 100vw;
 height: calc(100vw/2.0775);
 margin: 0 auto; }
 #page-home .slick-to-slider .visual {
 width: 100vw;
 height: calc(100vw/2.0775);
 /*height: 200px;*/ }
 #page-home .slick-to-slider .visual img {
 /*height: 200px;*/ }
 #page-home .slick-to-slider .visual .caption {
 width: 100%;
 position: absolute;
 left: 0px;
 padding-left: 1rem;
 padding-right: 0;
 top: 10px;
 bottom: auto;
 color: white;
 font-size: 0.8em;
 text-align: left; }
 #page-home .categories-list {
 padding-left: 0rem;
 padding-right: 0rem; }
 #page-home .categories-list .category-item {
 padding: 0;
 padding-top: 0.1rem;
 padding-bottom: 0.1rem; }
 #page-home .categories-list .category-item img {
 height: 38px;
 width: auto; }
 #page-home .categories-list .col-odd {
 padding-right: 0.1rem;
 text-align: right; }
 #page-home .categories-list .col-even {
 padding-left: 0.1rem;
 text-align: left; }
 #page-home .categories-label img {
 height: 40px; }
 #page-home .topics-label img {
 height: 40px; }
 #page-home .more-label img {
 height: 40px; }
 #page-home .concent-to-ha img.toha {
 height: 35px; }
 #page-home .concent-to-ha p {
 font-size: 0.8em; } }
</div><div class="naked_ctrl">
<form action="/index.cgi/contrast" method="get" name="gate">
<p><a href="http://altstyle.alfasado.net">AltStyle</a> によって変換されたページ <a href="https://www.concent-f.jp/static/newspapers/css/home.css">(-&gt;オリジナル)</a>
/ <label>アドレス: <input type="text" name="naked_post_url" value="https://www.concent-f.jp/static/newspapers/css/home.css" size="22" /></label> <label>モード: <select name="naked_post_mode">
<option value="default">デフォルト</option>
<option value="speech">音声ブラウザ</option>
<option value="ruby">ルビ付き</option>
<option value="contrast" selected="selected">配色反転</option>
<option value="larger-text">文字拡大</option>
<option value="mobile">モバイル</option>
</select>
<input type="submit" value="表示" />
</p>
</form>
</div>