@charset "UTF-8";

/* reset */

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
img{ width: 100%; display: block;}
p{ word-break: break-all;}
a {
  color: #222;
  margin:0;
  padding:0;
/*  font-size:100%; */
  vertical-align:baseline;
  background:transparent;
  display: block;
  -webkit-tap-highlight-color: rgba( 0, 0, 0, 0.2);
}
a, a *, *:after, *:before, .ranking_show p{ -webkit-user-select: none; user-select: none;}
.ios .tabbar-labels .tab-link:not(.tab-link-active) .icon-ios-fill { display: none;}
.ios .tabbar-labels .tab-link.tab-link-active .icon:not(.icon-ios-fill) { display: none;}

.md .navbar:after,
.md .navbar a.link:before,
.md .list > ul:before,
.md .list > ul:after,
.md .list .item-inner:after,
.md .block-strong:before,
.md .block-strong:after,
.md .links-list a:after{ display: none;}



.md body{
    color: #222;
    font-size: 11pt;
    font-family: "ヒラギノ角ゴ Pro", "メイリオ","Meiryo",verdana, "Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
    background-color: #f5f5f5;
    -webkit-text-size-adjust: 100%;
    -webkit-touch-callout: none;
    -webkit-font-smoothing: subpixel–antialiased;
}



/* font size setting */

.md[data-font="big"] body{ font-size: 13pt;}
.md[data-font="big"] .navbar .right p,
.md[data-font="big"] .navbar .left p{ font-size: 0.95rem;}


/* loading */
/*
.md .preloader-inner .preloader-inner-gap{ border-color: #fe6767;}
.md .preloader-inner .preloader-inner-left .preloader-inner-half-circle{ border-color: #fe6767;}
.md .preloader-inner .preloader-inner-right .preloader-inner-half-circle{ border-color: #e00;}
*/
#nowLoading,
html.nowLoading:not(.cacheLoading).device-ios #nowLoading:before{ display: none;}

html[class*="Loading"] #openmenu,
html[class*="Loading"] .title ,
html[class*="Loading"] .header-weather,
html[class*="Loading"] .tab-swiper{ pointer-events: none;}

html[class*="Loading"] *[data-name="detail"],
html[class*="Loading"] .swiper-emergency > *,
html[class*="Loading"] .swiper-category,
html[class*="Loading"] .headerhome:after,
html[class*="Loading"] .right,
html[class*="Loading"] .left{ visibility: hidden;}

html[class*="Loading"] #nowLoading{ width: 100%; height: 100%; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 9999; display: block;}
html[class*="Loading"] #nowLoading:before{
  content: "";
  background-image: url(https://news.tv-asahi.co.jp/img/common-img/tva_news-logo.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 75%;
  width: 100%;
  height: 100%;
  opacity: 0.2;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
}
html[class*="Loading"] #nowLoading .preloader{ margin-top: -16px; margin-left: -16px; position: fixed; top: 50%; left: 50%; z-index: 9999;}



html.headerLoading #nowLoading{ top: 50px; /* background-color: transparent;*/}
/*
html.headerLoading #nowLoading .preloader{ margin-top: 51px;}
*/
html.headerLoading .view:after{
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba( 255, 255, 255, 0.6);
  background-image: none;
  position: absolute;
  top: 50px;
  left: 0;
  z-index: 9999;
  display: block;
}

html.headerLoading #nowLoading,
html.nowLoading.cacheLoading #nowLoading{ background-color: transparent;}
html.headerLoading #nowLoading:before,
html.nowLoading.cacheLoading #nowLoading:before{ display: none;}

/*
.md.nowLoading.cacheLoading #nowLoading{ display: none;}
*/
/* navbar */
/*
#roothome{ width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 9999;}
*/
.md .navbar{ color: #222; font-size: inherit; height: 50px; background-color: #fff; border-top: solid 4px #e00; border-bottom: solid 1px #ccc; position: relative;}
.page #roothome .navbar{ border-bottom: none; height: 50px;}

.md .navbar .navbar-inner a{ color: #1ba9cd; line-height: initial; min-width: initial; padding: 0; height: 45px;}
.md .navbar .navbar-inner > *{ font-weight: bold; width: 25%; height: 100%; display: table; z-index: initial;}
.md .navbar .navbar-inner > *{ width: 25vw;}
.md .navbar .navbar-inner > div > *{ vertical-align: middle; display: table-cell;}

.md .navbar .title{ font-size: 1.2em; text-align: center; width: 50%; margin: 0;}
.md .navbar .title{ width: 40vw; position: absolute; top: 0; left: 31vw;}
.md[data-font="big"] .navbar .title p{ font-size: 1.2rem;}

.md .navbar .right{ text-align: right;}
.md .navbar .right a{ padding-right: 0.75em;}

.md .navbar .left{ text-align: left; width: 32vw;}
.md .navbar .left p{ padding-left: 1.75em;}
.md .navbar .left a > *{ position: relative;}
.md .navbar .left a > *:after{ 
  content: ""; 
  width: 8px; 
  height: 8px; 
  background-color: transparent; 
  border: solid 2px #1ba9cd; 
  border-top: none; 
  border-right: none;
  margin-top: -6px;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 1em;
  display: block;
}

.md .navbar~* .page-content,
.md .navbar~.page-content{ background-color: #f5f5f5; padding-top: 0; /* overflow: scroll; */ -webkit-overflow-scrolling: touch;}



/* homeVeiw */

*[data-name="homeView"] #roothome .right{ text-align: right; display: flex; padding-right: 0;}
*[data-name="homeView"] #roothome .left a{ color: inherit; padding-left: 1em;}
*[data-name="homeView"] #roothome .left i.icon{ font-size: 1.8em; font-weight: bold; text-align: center;} 
*[data-name="homeView"] #roothome .left i.icon:after{ 
  content: "メニュー";
  font-size: 0.6rem;
  font-weight: bold;
  width: auto;
  height: auto;
  border: none;
  margin-top: 0;
  position: relative;
  top: -3px;
  left: initial;
  transform: none;
}
*[data-name="homeView"] #roothome .title > div{ 
  background-image: url(https://news.tv-asahi.co.jp/img/common-img/tva_news-logo.png);
  background-size: 60%;
  background-position: center;
  background-repeat: no-repeat;
  margin: 0;
  z-index: -1;
}
*[data-name="homeView"] #roothome .right{ text-align: center; background-color: #fff; position: relative; z-index: 2;}
*[data-name="homeView"] #roothome .right .weather-thum{ width: 60%;}
*[data-name="homeView"] #roothome .right .weather-thum img{ width: 85%; margin: 0 auto;}
*[data-name="homeView"] #roothome .right .weather-temp{ width: 40%; position: absolute; right: 0;}
.md[data-font="big"] *[data-name="homeView"] #roothome .right .weather-temp{ font-size: 0.9em;}
/*
*[data-name="homeView"] #roothome .right[data-rain]:before{
  content: "降水確率";
  color: #55aed3;
  font-size: 0.6em;
  width: 100%;
  margin-top: -1em;
  position: absolute;
  opacity: 0;
  display: block;
}
*[data-name="homeView"] #roothome .right[data-rain]:after{
  content: attr(data-rain)"";
  color: #55aed3;
  font-weight: bold;
  text-align: center;
  width: 100%;
  margin-top: 5px;
  position: absolute;
  opacity: 0;
  display: block;
}
*/
*[data-name="homeView"] #roothome .right .weather-rain{ width: 100%; height: 70%;position: absolute; top: 15%; left: 0;}
*[data-name="homeView"] #roothome .right .weather-rain[data-rain]:before{
  content: "降水確率";
  color: #55aed3;
  font-size: 0.6em;
  width: 100%;
  margin-top: -2em;
  top: 50%;
  position: absolute;
  display: block;
}
*[data-name="homeView"] #roothome .right .weather-rain[data-rain]:after{
  content: attr(data-rain)"";
  color: #55aed3;
  font-weight: bold;
  text-align: center;
  width: 100%;
  margin-top: -0.5em;
  top: 50%;
  position: absolute;
  display: block;
}

*[data-name="homeView"] #roothome .right .weather-thum,
*[data-name="homeView"] #roothome .right .weather-temp:before,
*[data-name="homeView"] #roothome .right .weather-temp:after{ font-size: 0.8em; font-weight: bold; display: block;}
*[data-name="homeView"] #roothome .right .weather-temp:before{ content: attr(data-temp-h)""; color: #f4512b; padding-right: 0.75em;}
*[data-name="homeView"] #roothome .right .weather-temp:after{ content: attr(data-temp-l)""; color: #1997fb; padding-right: 0.75em;}

/* fade animation */
/*
.md:not(.nowLoading) *[data-name="homeView"] #roothome .right[data-rain]:before,
.md:not(.nowLoading) *[data-name="homeView"] #roothome .right[data-rain]:after{ animation-name: fade1;}
*/

.md:not(.nowLoading) *[data-name="homeView"] #roothome .right .weather-thum,
.md:not(.nowLoading) *[data-name="homeView"] #roothome .right .weather-temp:before,
.md:not(.nowLoading) *[data-name="homeView"] #roothome .right .weather-temp:after{ opacity: 1;animation-name: fade1;}

.md:not(.nowLoading) *[data-name="homeView"] #roothome .right .weather-rain[data-rain]:before,
.md:not(.nowLoading) *[data-name="homeView"] #roothome .right .weather-rain[data-rain]:after{ opacity: 0; animation-name: fade2;}

/*
*[data-name="homeView"] #roothome .right[data-rain]:before,
*[data-name="homeView"] #roothome .right[data-rain]:after,
*/
*[data-name="homeView"] #roothome .right .weather-thum,
*[data-name="homeView"] #roothome .right .weather-temp:before,
*[data-name="homeView"] #roothome .right .weather-temp:after,
*[data-name="homeView"] #roothome .right .weather-rain[data-rain]:before,
*[data-name="homeView"] #roothome .right .weather-rain[data-rain]:after{
  animation-duration: 10s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-fill-mode: forwards;
  animation-delay: 3s;
}

@keyframes fade1 {
  from { opacity: 1;}
  50% { opacity: 0;}
  to { opacity: 1;}
}
@keyframes fade2 {
  from  { opacity: 0;}
  50% { opacity: 1;}
  to { opacity: 0;}
}


.temp-high{ color: #f4512b;}
.temp-low{ color: #1997fb;}

*[data-name="homeView"] #roothome .navbar-inner:after{
  content: "";
  width: 25%;
  height: 50%;
  display: block;
  position: absolute;
  top: 25%;
  right: 0;
  -weblit-box-shadow: -2px 0 10px rgba( 0, 0, 0, 0.2);
  -moz-box-shadow: -2px 0 10px rgba( 0, 0, 0, 0.2);
  box-shadow: -2px 0 10px rgba( 0, 0, 0, 0.2);
  z-index: 1;
}
*[data-name="homeView"] #roothome .navbar-inner:after{ width: 25vw;}

/* badge update menu*/

.md .navbar .left i[data-update="on"]:before{ 
  content: ""; 
  color: #fff;
  text-align: center;
  width: 8px;
  height: 8px;
  background-color: #fb0001;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  position: absolute;
  top: 2px;
  right: 6px;
  display: block;
}
.md[data-font="big"] .navbar .left i[data-update="on"]:before{ top: 4px; right: 4px;}

.md:not(.device-ios) .navbar .left i[data-update="on"]:before{ right: 4px;}
.md[data-font="big"]:not(.device-ios) .navbar .left i[data-update="on"]:before{ right: 1px;}

/* preloader */

.isc{ top: 0;}
.md .ptr-preloader,
.md .ptr-refreshing .ptr-preloader,
.md .ptr-transitioning .ptr-preloader{ top: -36px;}

/* emergency info */

.swiper-emergency{ color: #fff; text-align: left; height: initial; background-color: #f35427; padding: 0; position: relative; top: 65px; z-index: 500;}
.swiper-emergency{ top: inherit;}
.swiper-emergency p{ font-size: 0.9em; font-weight: bold; margin: 0.5em 1.5em;}
.swiper-emergency .swiper-button-prev,
.swiper-emergency .swiper-button-next{
  height: 20px;
  width: 10px;
  margin-top: -10px;
  background-size: contain;
  top: 50%;
}
/*
.swiper-slide-duplicate p{ margin: 0.75em 1.5em;}
*/
.swiper-emergency .swiper-button-prev{ left: 0.3em; background-position: left; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
.swiper-emergency .swiper-button-next{ right: 0.3em; background-position: right; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
/*
.swiper-emergency .swiper-button-prev.swiper-button-disabled{ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
.swiper-emergency .swiper-button-next.swiper-button-disabled{ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");}
*/
.swiper-category-emergency{ padding-top: 125px; top: 0;}
.swiper-category-emergency{ padding-top: 0; top: inherit;}

.swiper-category {
  position: absolute;
  top: inherit; 
  bottom: inherit; 
  height: 100%;
  width: 100%;
}



/* tab */

.swiper-tabs{ color: #777; font-size: 0.8rem; background-color: #ccc; height: auto; top: 65px; z-index: 500;}
.swiper-tabs{ top: inherit;}
.swiper-tab-emergency{ text-align: initial; margin: 0; padding: 0;}
.swiper-tab-emergency a{ text-decoration: underline;}
.tab-swiper{ color: inherit; text-align: center; background-color: transparent; padding: 0.5em 0; }
.tab-swiper.active-category-tab{ color: #222; font-weight: bold; background-color: #f5f5f5;}

/* contents parts */

.md.device-ios .swiper-tabs + .page-content .page .page-content{ padding-bottom: 2em;}

.md .swiper-emergency + div .swiper-tabs + .page-content .page .page-content { padding-bottom: 58px;}
.md[font-size="big"] .swiper-emergency + div .swiper-tabs + .page-content .page .page-content { padding-bottom: 70px;}

.md.device-android .swiper-tabs + .page-content .page .page-content { padding-bottom: 60px;}
.md.device-android .swiper-emergency + div .swiper-tabs + .page-content .page .page-content { padding-bottom: 120px;}
.md.device-android[font-size="big"] .swiper-emergency + div .swiper-tabs + .page-content .page .page-content { padding-bottom: 125px;}

/* タブコンテンツでスライドロード時の記事が無い時、何かしら設定する場合 */
/*
.md .complete:not(#special) > .page .list:last-child:after{ 
  content: "表示できる記事がありません。"; 
  color: #aaa;
  text-align: center; 
  position: relative; 
  bottom: 25px; 
  z-index: 1;
  display: block;
}
.md .swiper-tabs + .swiper-category .complete:not(#special) > .page:last-child:after{ bottom: 101px;}
.md .swiper-emergency + div .swiper-tabs + .swiper-category .complete:not(#special) > .page:last-child:after{ bottom: 153px;}

.md[font-size="big"] .swiper-tabs + .swiper-category .complete:not(#special) > .page:last-child:after{ bottom: 104px;}
.md[font-size="big"] .swiper-emergency + div .swiper-tabs + .swiper-category .complete:not(#special) > .page:last-child:after{ bottom: 163px;}
*/



.md .block{ margin: 0; padding: 0;}
.md .block-title{ color: inherit; font-size: inherit; font-weight: inherit; line-height: inherit; margin: 0; padding: 1em 1em 0.5em;}
.md .block-title p{ font-size: 0.9em; font-weight: bold;}
.md h2{ font-size: 1.3em; font-weight: bold; text-align: center; padding: 0.5em 0; position: relative;}
.md h2:after{
  content:"";
  width: 10%;
  height: 2px;
  background-color: #db2d0a;
  position: absolute;
  bottom: 0;
  left: 45%; 
}
.md a{ color: inherit;}
.md .list{ font-size: inherit; margin: 0; position: relative}
.md .list li{ background-color: #fff; border-bottom: solid 1px #ccc; overflow: hidden; position: relative;}
.md .list li[data-subcategory="注目ニュース"]:first-child{ overflow: initial;}
.md .list li:last-child{ border-bottom: none;}
.md .list li > p { padding: 0.75em;}
.md .links-list a{ height: auto;}
.md .list .item-content{ min-height: auto; padding: 0.5em;}
.md .list .list-title{
  font-size: 0.9em; 
  font-weight: bold;
  white-space: initial;
  padding: 1.5em 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  position: relative;
  line-height: 1.3;
}
.md .list .list-title:before{ content: attr(data-update)""; color: #aaa; font-size: 0.8em; font-weight: normal; position: absolute; right: 0; bottom: 0;}
.md .list .list-thum{ max-width: 45%; background-color: #f5f5f5; margin-left: 0.5em; position: relative;}
.md .list .list-thum img{ margin: 0 auto;}
.md .list li[data-category] .list-thum:before{ content: ""; padding-top: 56.25%; display: block;}
.md .list li[data-category] .list-thum:after{ content: "Loading"; color: #aaa; font-size: 0.8em; text-align: center; width: 100%; margin-top: -7px; position: absolute; top: 50%; left: 0;}
.md .list li[data-category] .list-thum .list-thum-wrapper{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1;}
.md .list li[data-category] .list-thum .list-thum-wrapper img{ width: auto; height: 100%;}

.md .list .no-img:before{
  content: "";
  width: 100%;
  padding-top: 56.25%;
  background-image: url( https://news.tv-asahi.co.jp/img/default.jpg );
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: block;
}
.md .list .no-img:after{ display: none;}

.md .list li[data-category="社会"] .no-img:before{ background-image: url( https://news.tv-asahi.co.jp/img/default_3.jpg );} /* 社会 */
.md .list li[data-category="政治"] .no-img:before{ background-image: url( https://news.tv-asahi.co.jp/img/default_1.jpg );} /* 政治 */
.md .list li[data-category="経済"] .no-img:before{ background-image: url( https://news.tv-asahi.co.jp/img/default_2.jpg );} /* 経済 */
.md .list li[data-category="国際"] .no-img:before{ background-image: url( https://news.tv-asahi.co.jp/img/default_4.jpg );} /* 国際 */
.md .list li[data-category="エンタメ"] .no-img:before{ background-image: url( https://news.tv-asahi.co.jp/img/geinou/geinou_no_img.jpg );} /* エンタメ */
.md .list li[data-category="スポーツ"] .no-img:before{ background-image: url( https://news.tv-asahi.co.jp/img/default_5.jpg );} /* スポーツ */

/* preloader */

.md .list + p,
.preloader + p{ display: none;}


/* label */

.md .list li[data-category]:before,
.md .list li[data-category]:after,
.md .list li[data-subcategory]:before,
.md .list li[data-subcategory]:after{
  font-size: 0.7em;
  text-align: center;
  border: solid 1px #222;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  position: absolute;
  top: 0.75em;
  left: 1em;
  display: block;
}
.md .list li[data-category]:before{ content: attr(data-category)""; min-width: 50px; background-color: #fff; z-index: 9;}
.md .list li[data-subcategory]:after{ content: attr(data-subcategory)""; color: #fff; background-color: #222; margin-left: 40px; padding: 0 1em 0 1.75em; z-index: 8;}
.md[data-font="big"] .list li[data-subcategory]:after{ margin-left: 38px;}

.md .list li[data-category="LIVE"]:before{ display: none;}

.md .list li[data-category="みんながカメラマン"]:before{ color: #fff; background-color: #eb6b20; border-color: #eb6b20; padding: 0 1em;}
.md .list li[data-category="報道STATION"]:before{ color: #fff; background-color: #ff4401; border-color: #ff4401; padding: 0 1em;}
.md .list li[data-category="教えてあの店あの情報"]:before{ background-color: #ffcc01; border-color: #ffcc01; padding: 0 1em;}

.md #social .list li[data-category]:not(.list-banner-nativbead):before,
.md #politics .list li[data-category]:not(.list-banner-nativbead):before,
.md #economics .list li[data-category]:not(.list-banner-nativbead):before,
.md #international .list li[data-category]:not(.list-banner-nativbead):before,
.md #entertainment .list li[data-category]:not(.list-banner-nativbead):before,
.md #sports .list li[data-category]:not(.list-banner-nativbead):before,
.md #recomend .list li[data-category]:not(.list-banner-nativbead):before,
.md #special .list li[data-category]:not(.list-banner-nativbead):before,
.md #social .list li[data-category]:not(.list-banner-nativbead):after,
.md #politics .list li[data-category]:not(.list-banner-nativbead):after,
.md #economics .list li[data-category]:not(.list-banner-nativbead):after,
.md #international .list li[data-category]:not(.list-banner-nativbead):after,
.md #entertainment .list li[data-category]:not(.list-banner-nativbead):after,
.md #sports .list li[data-category]:not(.list-banner-nativbead):after,
.md #recomend .list li[data-category]:not(.list-banner-nativbead):after,
.md #special .list li[data-category]:not(.list-banner-nativbead):after{ display: none;}

.md .list li[data-subcategory="注目ニュース"]:first-child:before,
.md .list li[data-subcategory="注目ニュース"]:first-child:after{ display: none;}
.md .list li[data-subcategory="注目ニュース"]:first-child a:before,
.md .list li[data-subcategory="注目ニュース"]:first-child a:after{ display: none;}

/* new */

.md li.new > *:first-child{ position: relative;}
.md li.new > *:first-child:before,
.md li.new > *:first-child:after{ position: absolute; top: 0.75em; left: 0.75em; z-index: 9999;}
.md li.new > *:first-child:before{
  content: "";
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: transparent transparent transparent #eb0000;
  border-width: 3px 0 3px 6px;
}
.md li.new > *:first-child:after{
  content: "new";
  color: #e00;
  font-size: 0.7em;
  font-weight: bold;
  margin-left: 10px;
}
.page[data-name="headline"] li[data-subcategory="注目ニュース"].new:first-child .list-video:before,
.page[data-name="headline"] li[data-subcategory="注目ニュース"].new:first-child .list-video:after{ display: none;}

.md #headline li.new[data-category] > *:first-child:before{ margin-left: 56px;}
.md #headline li.new[data-category] > *:first-child:after{ margin-left: 68px;}
.md #headline li.new[data-category][data-subcategory] > *:first-child:before{ margin-left: 136px;}
.md #headline li.new[data-category][data-subcategory] > *:first-child:after{ margin-left: 146px;}
.md #headline li.new[data-category][data-subcategory="特集"] > *:first-child:before{ margin-left: 100px;}
.md #headline li.new[data-category][data-subcategory="特集"] > *:first-child:after{ margin-left: 112px;}
.md #headline li.new[data-category][data-subcategory="ブログ"] > *:first-child:before{ margin-left: 108px;}
.md #headline li.new[data-category][data-subcategory="ブログ"] > *:first-child:after{ margin-left: 120px;}
.md #headline li.new[data-category][data-subcategory="オススメ"] > *:first-child:before{ margin-left: 118px;}
.md #headline li.new[data-category][data-subcategory="オススメ"] > *:first-child:after{ margin-left: 130px;}
.md #headline li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:before{ margin-left: 136px;}
.md #headline li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:after{ margin-left: 146px;}

.md *[data-name="detail"] li.new[data-category] > *:first-child:before{ margin-left: 56px;}
.md *[data-name="detail"] li.new[data-category] > *:first-child:after{ margin-left: 68px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory] > *:first-child:before{ margin-left: 136px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory] > *:first-child:after{ margin-left: 146px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="特集"] > *:first-child:before{ margin-left: 100px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="特集"] > *:first-child:after{ margin-left: 112px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="ブログ"] > *:first-child:before{ margin-left: 112px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="ブログ"] > *:first-child:after{ margin-left: 124px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="オススメ"] > *:first-child:before{ margin-left: 108px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="オススメ"] > *:first-child:after{ margin-left: 130px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:before{ margin-left: 136px;}
.md *[data-name="detail"] li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:after{ margin-left: 146px;}

.md[data-font="big"] #headline li.new > *:first-child:after{ margin-top: -1px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="特集"] > *:first-child:before{ margin-left: 100px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="特集"] > *:first-child:after{ margin-left: 112px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="ブログ"] > *:first-child:before{ margin-left: 112px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="ブログ"] > *:first-child:after{ margin-left: 124px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="オススメ"] > *:first-child:before{ margin-left: 124px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="オススメ"] > *:first-child:after{ margin-left: 136px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:before{ margin-left: 148px;}
.md[data-font="big"] #headline li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:after{ margin-left: 158px;}

.md[data-font="big"] *[data-name="detail"] li.new > *:first-child:after{ margin-top: -1px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="特集"] > *:first-child:before{ margin-left: 100px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="特集"] > *:first-child:after{ margin-left: 112px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="ブログ"] > *:first-child:before{ margin-left: 112px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="ブログ"] > *:first-child:after{ margin-left: 124px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="オススメ"] > *:first-child:before{ margin-left: 124px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="オススメ"] > *:first-child:after{ margin-left: 136px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:before{ margin-left: 148px;}
.md[data-font="big"] *[data-name="detail"] li.new[data-category][data-subcategory="注目ニュース"] > *:first-child:after{ margin-left: 158px;}



/* rank */

.md .list li[data-rank]{ position: relative;}
.md .list li[data-rank]:before{
  content: attr(data-rank)"";
  color: #fff;
  font-size: 0.9em;
  text-align: center;
  line-height: 28px;
  width: 28px;
  height: 28px;
  background-color: #fb0001;
  background-image: -webkit-gradient( linear, left top, left bottom, from(#fb0001), to(#cc0000));
  background-image: -moz-linear-gradient( to bottom, #fb0001, #cc0000);
  background-image: linear-gradient( to bottom, #fb0001, #cc0000);
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  margin-top: -14px;
  position: absolute;
  top: 50%;
  left: -3px;
  display: block;
}

/* banner */

.md .list .list-banner{ border: none; margin: 0.5em;}
.md .list .list-banner > *{ padding: 0;}
.md .list .list-banner .list-thum{ max-width: inherit;}
.md .list .list-banner p{ padding: 0.75em;}
.md .list .list-banner + li:not(.list-banner){ border-top: solid 1px #ccc}

/* native banner */

.md .list .list-banner-nativbead .item-content{
  background-image: url(https://news.tv-asahi.co.jp/img/icon-webview.png);
  background-position: left 0.75em bottom 0.75em;
  background-size: 1em;
  background-repeat: no-repeat;
}
.md .list .list-banner-nativbead .list-title{ font-weight: normal}



/* list card layout */

.md.device-ios .list .list-card:before,
.md.device-ios .list .list-card:after{ -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0);}
.md .list .list-card > *{ padding: 0;  flex-direction: column; flex-wrap: wrap;}
.md .list .list-card .list-title{
  max-width: 100%;
  padding: 0.5em 0.5em 1.5em;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 2;
  -webkit-order: 2;
  order: 2;
}
.md .list .list-card .list-title:before{ right: 0.75em; bottom: 0.75em;}
.md .list .list-card .list-thum{ 
  max-width: 100%;
  margin-left: 0;
  -webkit-box-ordinal-group: 1;
  -ms-flex-order: 1;
  -webkit-order: 1;
  order: 1;
}

.md.device-ios .list .list-card video:focus:before,
.md.device-ios .list .list-card video:focus:after{ display: none;}

.md.device-ios .list .list-card video:active:before,
.md.device-ios .list .list-card video:active:after{ display: none;}

/* headline */

.page[data-name="headline"] .block[data-name="live"],
/* .page[data-name="headline"] .block[data-name="ranking1"], */
.page[data-name="headline"] .block[data-name="keyword"]{ background-color: #fff; padding: 0.5em;}

/* list simul live */

.md .list.emergency-simul-live{ color: #000; background-color: #ffa287; padding: 0.5em;}
.md .list.emergency-simul-live .list-card{ background-color: transparent;}
.md .list.emergency-simul-live .list-card .list-description{ margin-bottom: 0.5em;}
.md .list.emergency-simul-live .list-card .ob-title{ font-weight: bold;}
.md .list.emergency-simul-live .list-card .list-title{ margin-top: 0.5em; padding: 0;}
.md .list.emergency-simul-live .list-card .list-thum{ -webkit-box-ordinal-group: initial; -ms-flex-order: initial; -webkit-order: initial; order: initial;}
.md .list.emergency-simul-live .list-card .list-thum iframe{ position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; z-index: 9999;}

/* webinfo */

.md .list.webinfo li[data-color-pattern="0"]{ background-color: #fff;}
.md .list.webinfo li[data-color-pattern="1"]{ background-color: #faf18c;}
.md .list.webinfo li[data-color-pattern="2"]{ background-color: #d4d4d4;}
.md .list.webinfo li > *{ display: block;}
.md .list.webinfo .list-description{ padding-bottom: 0.5em;}
.md .list.webinfo .list-thum{ max-width: inherit; margin: 0 auto; background-color: transparent;}

/* live */

.block[data-name="live"] .list{ border-bottom: solid 1px #ccc;}
.block[data-name="live"] .list:last-child{ border-bottom: none;}
.block[data-name="live"] .list .list-description{ margin: 0; padding: 0;}
.block[data-name="live"] .list .ob-title{ font-weight: bold; margin: 0.75em 0; padding: 0 0 0 15px; position: relative;}
.block[data-name="live"] .list .ob-title:before{
    content: "";
    width: 0px;
    height: 0px;
    margin: auto;
    border-style: solid;
    border-color: transparent transparent transparent #eb0000;
    border-width: 6px 0 6px 12px;
    position: absolute;
    top: 2px;
    left: 0;
}
.block[data-name="live"] .list .list-title{ text-align: left; width: 100%; margin: 0.5em 0; padding: 0;}
.block[data-name="live"] .list .live-iframe{ position: relative; max-width: 100%; padding-top: 56.25%;}
.block[data-name="live"] .list .live-iframe iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important;}

.emergency-live-item{ position: relative;}
.block[data-name="live"] .list-card:after,
.emergency-live-item:after{ content: ""; width: 75%; height: 85px; position: absolute; top: 0; left: 0; z-index: 9999; display: block;}
.md[data-font="big"] .emergency-live-item:after{ height: 90px;}
video{ max-width: 100%; display: block;}

/* ranking */

.md .list li[data-rank] a{ padding: 0.25em;}
.md .list li[data-rank] .list-title{ padding: 0 0 0 25px;}
.md .list .item-cell {margin-left: 0.5em;}


/* keyword */

.md *[data-name="keyword"]{ text-align: center; }
.md *[data-name="keyword"] li{ border: none; margin-bottom: 0; display: inline-block;}
.md.device-ios *[data-name="keyword"] li{ margin-bottom: 0;}
.md *[data-name="keyword"] li a{ font-size: 0.9em; font-weight: bold; border: solid 1px #ccc; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; padding: 0.5em 1em; }
.md *[data-name="keyword"] ul{margin-top: 1em;}


/* recommend */

.page[data-name="recomend"] .list-card{ }



/* tab */

/* sokuhou */

.md .page[data-name="sokuhou"] .list li:not(.list-banner-nativbead) .list-title{ padding-top: 0;}



/* special */

.page[data-name="special"] .special-description{ font-weight: bold; padding-top: 0.5em; margin: 0.5em; position: relative;}
.page[data-name="detail"] .special-description > *:not(a):first-child{ margin-bottom: 0.75em;}
.page[data-name="special"] .special-description > *:not(a):first-child{ padding-right: 110px; margin-bottom: 0.75em;}
.page[data-name="special"] .special-description .block-strong p{ font-size: 1.1em;}
.page[data-name="special"] .special-title,
.page[data-name="detail"] .page-content .special-description .special-title{ margin-bottom: 0.75em; padding-left: 15px; position: relative;}
.page[data-name="special"] .special-title:before,
.page[data-name="detail"] .special-title:before{
  content: "";
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: transparent transparent transparent #eb0000;
  border-width: 6px 0 6px 12px;
  position: absolute;
  top: 4px;
  left: 0;
}
.page[data-name="special"] .special-more{ text-align: right; position: absolute; top: 0.5em; right: 0; z-index: 9999; overflow: hidden;}
.page[data-name="special"] .special-description > .special-more:first-child{ padding: 1.5em 0.75em; position: relative;}
.page[data-name="special"] .special-more p{ 
  color: #fff; 
  font-size: 0.9em;
  font-weight: normal;
  line-height: 24px;
  background-color: #eb0000; 
  border-top-left-radius: 3px; 
  border-bottom-left-radius: 3px; 
  margin-right: 12px;
  padding: 0 0.5em;
  display: inline-block;
}
.page[data-name="special"] .special-more p:after{
  content: "";
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: transparent transparent transparent #eb0000;
  border-width: 12px;
  position: absolute;
  top: 0;
  right: -12px;
}

.page[data-name="special"] .item-content{
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
	-webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.special-description .item-content{ display: block!important;}
.special-description .special-title-description{ font-size: 0.9em; width: 100%;}
.special-description .special-title-description .list-title a{ text-decoration: underline; display: inline-block;}
.special-description .special-title-thum{ /* max-width: 40%;margin-left: 0.75em; */ margin-bottom: 0.75em;}

.page[data-name="special"] *[data-name="keyword"]{ background-color: #fff; border-top: solid 1px #ccc; padding: 0.5em 0 0.75em;}



/* saved */

.md #saved .list:after{ 
  content: "test"; 
  color: #aaa;
  text-align: center; 
  position: absolute; 
  bottom: -1em; 
  display: block;
  z-index: 9999;
}


/* detail */

.page[data-name="detail"] .page-content{ padding-bottom: 65px;}

.page[data-name="detail"] .detail-desctiption{ margin: 0.5em; position: relative;}
.page[data-name="detail"] .detail-title{ 
  font-size: 1.1em; 
  font-weight: bold; 
  min-height: 0px; 
/*  margin-right: 50px; */
}
.page[data-name="detail"] .detail-date{ color: #aaa; font-size: 0.7em; text-align: right; margin-top: 0.5em;}
.page[data-name="detail"] .detail-category{ 
  font-size: 0.8em; 
  background-color: #fff; 
  border: solid 1px #222; 
  padding: 0 1em; 
  border-radius: 100px;
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 0;
}
.page[data-name="detail"] .page-content .detail-img{ background-color: #fff; transition: all 500ms ease 0s;}
.geinou-detail-img{height: 100%;}
.geinou-detail-img img{height: 100%; width:auto; margin: 0 auto;}
.page[data-name="detail"] .page-content .sns{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.page[data-name="detail"] .page-content .sns > div{ width : -webkit-calc(100% / 4)!important; width : calc(100% / 4);}
.page[data-name="detail"] .page-content .sns a{ padding: 0.75em 0; display: block;}
.page[data-name="detail"] .page-content .sns div[id*="facebook"]{ background-color: #3f5eb1;}
.page[data-name="detail"] .page-content .sns div[id*="twitter"]{ background-color: #01aaef;}
.page[data-name="detail"] .page-content .sns div[id*="bookmark"]{ background-color: #056dc4;}
.page[data-name="detail"] .page-content .sns div[id*="line"]{ background-color: #00c400;}

.page[data-name="detail"] .page-content .detail-text{ font-weight: normal; background-color: #fff;}
.page[data-name="detail"] .page-content .detail-text p{ font-size: 1.1em; line-height: 1.8; padding: 0.5em;}

.page[data-name="detail"] .save-func{ 
  width: 17vw;
  background-image: url(https://news.tv-asahi.co.jp/app/img/icon_clip_off.png);
  background-repeat: no-repeat;
  background-size:  auto 50%;
  background-position: center center;
  /* border: solid 1px #ccc; */
  position: absolute;
  top: 0;
  right: 17vw;
	display: block;
}
.page[data-name="detail"] .save-func button,
.page[data-name="detail"] .share-func > button{
/*
  color: #ccc;
  font-weight: normal;
  text-align: center;
	*/
  width: 100%;
  height: 100%;
	/*
  left: -1px;
  top: -1px;
	*/
  min-width: auto;
	/*
max-width: initial;
  background-repeat: no-repeat;
  background-size: 50%;
  background-position: center center;  border-radius: 100%;
	*/
  margin: 0;
  padding: 0;
  display: block;
}
.page[data-name="detail"] .save-func.style-deleteSaveButton{
  background-image: url( https://news.tv-asahi.co.jp/app/img/icon_clip_on_02.png);
}
.page[data-name="detail"] .share-func{ 
    width: 17vw;
    background-image: url(https://news.tv-asahi.co.jp/app/img/share.png);
    background-repeat: no-repeat;
    background-size: auto 50%;
    background-position: center center;
    /* border: solid 1px #ccc; */
    position: absolute;
    top: 0;
    right: 0;
		display: block;
}
/*
.page[data-name="detail"] .share-func > button{
  height: 100%;
}
*/
.page[data-name="detail"] .page-content .block > p { padding: 0.75em;}
.page[data-name="detail"] .page-content .block-title{ border-bottom: solid 1px #ccc; margin: 0; padding: 1.5em 0.75em 0.5em;}
.page[data-name="detail"] .page-content .block-title p{ font-size: 0.8em; font-weight: bold;}

.page[data-name="detail"] .page-content .list li:last-child{ border-bottom: solid 1px #ccc;}
.page[data-name="detail"] .page-content .list ul > p{ font-size: 0.8em; padding: 0.5em 1em;}
.page[data-name="detail"] .style-specials a{ padding: 0.75em;}

/* special detail*/

.page[data-name="detail"] .special-description{ font-weight: bold; margin: 1.5em 0.75em; position: relative;}
.page[data-name="detail"] .special-description .block > p{ padding: 0;}



/* menu */

#menucomponent .page-content{ height: calc( 100vh - 65px ); /* overflow: scroll; */ -webkit-overflow-scrolling: touch; }

*[data-name^="menu-"]{ padding-bottom: 65px;}

*[data-name="menu"]{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; /* z-index: 9999; */}
*[data-name="menu"] .block-title + .list{ border-top: solid 1px #ccc; border-bottom: solid 1px #ccc;}

*[data-name^="menu"] .list{ font-weight: bold;}
*[data-name^="menu"] .list .item-content{ padding: 1em;}

/* slide open close */

/*
*[data-name="menu"].menu-close{ -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-transform: translate(-100%, 0); transform: translate(-100%, 0);}
*[data-name="menu"].menu-open{ -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-transform: translate(0, 0); transform: translate(0, 0);}
*/


/*
*[data-name^="menu"] .list a#location{
    background-size: 8px 13px;
    background-repeat: no-repeat;
    background-position: calc(100% - 16px) center;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23c7c7cc'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
}
*/
*[data-name^="menu"]:not([data-name*="information"]) .list *[data-setting]:after,
*[data-name^="menu"]:not([data-name*="information"]) .list *[data-update]:before{ content: attr(data-setting)""; color: #777; font-size: 0.9em; position: absolute; right: 3em;}
*[data-name^="menu"]:not([data-name*="information"]) .list *[data-update]:not([data-update="0"]):before{ 
  color: #fff;
  font-size: 0.9em;
  font-weight: normal;
  text-align: center;
  background-color: #fb0001;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  display: block;
}
*[data-name^="menu"]:not([data-name*="information"]) .list *[data-update]:not([data-update="0"]):not([data-update="on"]):before{ content: attr(data-update)""; padding: 0 5px;}
*[data-name^="menu"]:not([data-name*="information"]) .list *[data-update="on"]:before{ 
  content: ""; 
  width: 10px;
  height: 10px;
  margin-top: -5px;
  top: 50%;
}

.page[data-name="menu-locate"] .weather + .block-title,
.page[data-name="menu-fontsize"] .block-title,
.page[data-name="menu-information"] .block-title, 
.page[data-name="menu-aboutsave"] .block-title,
.page[data-name="menu-caution"] .block-title{ display: none;}

.page[data-name="menu-fontsize"] .page-content .style-list-item a > p + p,
.page[data-name="menu-locate"] .page-content .links-list a > p + p{ color: #e00; width: 20px; background-color: #fff; margin-right: 0;}

/* locate */

.page[data-name="menu-locate"] .weather{ font-weight: bold; border-bottom: solid 1px #ccc;}
.page[data-name="menu-locate"] .weather .block-title{ font-size: inherit; text-align: center; border: none; padding: 1em 1em 0 1em;}
.page[data-name="menu-locate"] .weather .block-title p:first-child{ font-size: 0.8em; margin-bottom: 1em;}
.page[data-name="menu-locate"] .weather .block-title p:last-child{ font-size: 1.2em;}
.page[data-name="menu-locate"] .weather .style-row{ align-items: center; justify-content: center;}
.page[data-name="menu-locate"] .weather .style-row > div:first-child{ text-align: right;}
.page[data-name="menu-locate"] .weather .style-row > div:first-child img{ width: 120px; display: inline-block;}
.page[data-name="menu-locate"] .weather .style-row > div:last-child{ padding-left: 1em;}
.page[data-name="menu-locate"] .weather-temp{ margin-bottom: 0.5em; display: inline-block;}
.page[data-name="menu-locate"] .weather-temp p{ display: inline-block;}
.page[data-name="menu-locate"] .weather-rain { font-size: 0.9em;}

/* push */

.page[data-name="menu-push"] .list{ background-color: #fff; border-top: solid 1px #ccc; border-bottom: solid 1px #ccc; margin-bottom: 0.75em;}
.page[data-name="menu-push"] #locatemenu .list{ margin-bottom: 0;}
.page[data-name="menu-push"] .list:first-child{ border-top: none;}
.page[data-name="menu-push"] #rootmenu > div:first-child:before{
  content: "端末のアプリ設定でプッシュ通知を許可すると、お知らせを受け取ることができます。";
  font-size: 0.9em;
  width: 60%;
  display: inline-block;
}
.page[data-name="menu-push"] #rootmenu > div:first-child{
  margin: 1em;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.page[data-name="menu-push"] #rootmenu > div:first-child a{
  color: #fff;
  font-size: 0.9em;
  text-align: center;
  line-height: 30px;
  min-width: 30%;
  height: 30px;
  background-color: #e00;
  border-radius: 100px;
  padding: 0 1em;
}
.page[data-name="menu-push"] #rootmenu .list:nth-child(2) li:nth-of-type(1n+2),
.page[data-name="menu-push"] #rootmenu .list:last-child li:nth-of-type(1n+3){ margin-left: 0.75em;}
.page[data-name="menu-push"] #rootmenu .list:last-child li:nth-of-type(1n+4){ margin-left: 1.5em;}

/* on off parts */

*[class^="switch-"]{ 
  font-size: 0.9em; 
  text-align: center; 
  line-height: 25px;
  min-width: 30px;
  height: 25px;
  border-radius: 100px; 
  padding: 0 1em;
}
.switch-on{ color: #fff; background-color: #e00;}
.switch-off{ background-color: #ccc;}

/* information */

.md *[data-name="menu-information"] .list li.new{ position: relative;}
.md *[data-name="menu-information"] .list li.new:before{
  content: ""; 
  width: 10px;
  height: 10px;
  background-color: #fb0001;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  margin-top: -5px;
  position: absolute;
  top: 50%;
  right: 2.5em;
  bottom: initial;
  display: block;
}

.page[data-name="menu-information"] .list-title{ width: 100%; padding-top: 0; padding-right: 3em;}
.page[data-name="menu-information"] .list > .list-title{ font-weight: normal; padding: 0.75em;}
.page[data-name="menu-information"] .list-title:before{ left: 0; right: initial;}
.md *[data-name="menu-information"] .list a:before{ display: none;}
.page[data-name="menu-information"] .info-title{ font-size: 1.1em; font-weight: bold; padding-bottom: 1em; margin-bottom: 0.75em; position: relative;}
.page[data-name="menu-information"] .info-title:after{
  content: attr(data-update)"";
  color: #aaa;
  font-size: 0.7em;
  font-weight: normal;
  position: absolute;
  right: 0;
  bottom: 0;
}

/* other */

.page[data-name="menu-error"] .page-content p,
.page[data-name="menu-aboutsave"] .style-page-content p,
.page[data-name="menu-caution"] .style-page-content p,
.page[data-name="menu-information"] .info-detail,
.page[data-name="menu-information"] .list > .list-title{ font-weight: normal; line-height: 2em; padding: 1em;}

.page[data-name="menu-error"] .page-content a,
.page[data-name="menu-aboutsave"] .style-page-content a,
.page[data-name="menu-caution"] .style-page-content a,
.page[data-name="menu-information"] .style-page-content .info-text a{ text-decoration: underline;}

/* sns accounte */

*[data-name^="menu"] .list .menu-fontsize{ border-bottom: none;}
*[data-name^="menu"] .list .menu-snsaccount{ display: none;}

/* version */

*[data-name^="menu"] .list .menu-version{ padding: 1em;}
*[data-name^="menu"] .list .menu-version p{ padding: 0;}
*[data-name^="menu"] .list .menu-version p[data-setting]:after{ right: 1.5em;}

/* weather */

.page[data-name="menu-weather"]{ text-align: center;}
.page[data-name="menu-weather"] img{ margin: 0 auto;}
.page[data-name="menu-weather"] span{ font-size: 0.7em;}
.page[data-name="menu-weather"] .page-content{ background-color: #fff;}
.page[data-name="menu-weather"] .page-content .style-list{ padding: 0.75em; border-bottom: none;}

.page[data-name="menu-weather"] .page-content > .style-block-title{ color: #fff; background-color: #333; border-bottom: none;}
.page[data-name="menu-weather"] .page-content > .style-block-title:first-child{ text-align: center; padding: 1em; position: relative;}
.page[data-name="menu-weather"] .page-content > .style-block-title:first-child a{
  background-size: 8px 13px;
  background-repeat: no-repeat;
  background-position: right center;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D'8px'%20height%3D'13px'%20viewBox%3D'0%200%208%2013'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpolygon%20fill%3D'%23c7c7cc'%20transform%3D'translate(1.500000%2C%206.500000)%20rotate(-45.000000)%20translate(-1.500000%2C%20-6.500000)%20'%20points%3D'6%2011%206%202%204%202%204%209%20-3%209%20-3%2011%205%2011'%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E");
  margin-top: -10px;
  padding-right: 1.5em;
  position: absolute;
  top: 50%;
  right: 1em;
}
.page[data-name="menu-weather"] .page-content > .style-block-title:nth-child(3){ text-align: left; border-bottom: none; padding: 0.5em 0.75em;}
.page[data-name="menu-weather"] .page-content > .style-block-title:nth-child(3) p{ font-weight: normal;}

.page[data-name="menu-weather"] .page-content .style-list li{ text-align: center; align-items: center; justify-content: center; border: none;}
.page[data-name="menu-weather"] .page-content .style-list li .style-item-content > *{ width: 15%;}
.page[data-name="menu-weather"] .page-content .style-list li .style-item-content .weather-date{ font-size: 0.75em;}

.page[data-name="menu-weather"] .page-content .style-list .weather-daily *[class*="Mes"]{ font-weight: normal; background-color: #fffaea; border: solid 2px #ffc100; margin-bottom: 0.5em; position: relative;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily *[class*="Mes"] p{ color: #fff; text-align: center; font-size: 0.9em; width: 20%; background-color: #ffc100; padding: 0.5em;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily *[class*="Mes"] p:after{ content: attr(data-mes)""; color: #ffc100; padding: 0.5em; position: absolute; top: 0; left: 24%;}

.page[data-name="menu-weather"] .page-content .style-list .weather-daily *[class*="Warning"]{ background-color: #ffeaea; border-color: #e00;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily *[class*="Warning"] p{ background-color: #e00;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily *[class*="Warning"] p:after{ color: #e00;}

.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content{ padding: 1em 0 2em;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content .weather-date{ font-weight: bold;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content > div:not(.weather-daily-summary){ height: 55px; border-left: solid 1px #ccc; position: relative;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content > div:not(.weather-daily-summary):before{ content: "-"; font-weight: normal; width: 100%; position: absolute; top: 1.5em; left: 0; z-index: 0;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content > div:not(.weather-daily-summary) div{ background-color: #fff; position: relative; z-index:1;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content > div:not(.weather-daily-summary) img{ width: 50%; margin: 0.25em auto;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content > div:not(.weather-daily-summary) p:first-child{ font-size: 0.7em;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .style-item-content > div:not(.weather-daily-summary) div + p{ font-size: 0.6em; font-weight: normal;}

.page[data-name="menu-weather"] .page-content .style-list .weather-daily .weather-daily-summary{ width: 25%; border-left: none;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .weather-daily-summary img{ width: 80%;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .weather-daily-summary p{ font-size: 0.8em;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .weather-daily-summary .weather-rain{ font-size: 0.7em;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily .weather-daily-summary .weather-temp > *{ display: inline-block;}

.page[data-name="menu-weather"] .page-content .style-list .weather-daily-hourly p:not(.weather-date){ font-size: 0.8em;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily-hourly .style-item-content{ padding: 0.5em 0;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily-hourly:nth-child(even){ background-color: #f5f5f5;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily-hourly .weather-date{ font-weight: normal;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily-hourly .weather-thum{ width: 25%;}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily-hourly .weather-thum img{ width: 60%}
.page[data-name="menu-weather"] .page-content .style-list .weather-daily-hourly .weather-wind-thum{ 
  text-align: left; 
  width: 30%; 
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.page[data-name="menu-weather"] .weather-daily-hourly .weather-wind-thum img{ width: 35px;}
.page[data-name="menu-weather"] .weather-daily-hourly .weather-wind-thum p{ width: 100%;}

.page[data-name="menu-weather"] .weather-item{ display: none;}

.page[data-name="menu-weather"] .weather-week{
  text-align: center;
  width: 100%;
  padding: 0.75em;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}
.page[data-name="menu-weather"] .weather-week img{ width: 80%; margin: 0 auto;}
.page[data-name="menu-weather"] .weather-week > div{ width : -webkit-calc(100% / 7)!important; width : calc(100% / 7)!important; }
.page[data-name="menu-weather"] .weather-week > div:nth-child(even){ background-color: #f5f5f5;}
.page[data-name="menu-weather"] .weather-week > div > * { margin: 1em 0;}
.page[data-name="menu-weather"] .weather-week .weather-date{ font-size: 0.6em;}
.page[data-name="menu-weather"] .weather-week .weather-temp,
.page[data-name="menu-weather"] .weather-week .weather-rain{ font-size: 0.8em; font-weight: bold;}

.page[data-name="menu-weather"] .page-content > div:nth-child(5){ color: inherit; text-align: left; background-color: #ecf6f7; border: none; margin: 0 0.75em; padding: 0.75em 0.75em 0; }
.page[data-name="menu-weather"] .page-content > div:nth-child(5) p{ font-weight: normal; border-bottom: solid 1px #333; padding-bottom: 0.75em;}
.page[data-name="menu-weather"] .page-content > .row:last-child{ text-align: left; background-color: #ecf6f7; margin: 0 0.75em 0.75em; }
.page[data-name="menu-weather"] .page-content > .row:last-child p{ font-size: 0.9em; line-height: 1.7; padding: 0.75em;}
.page[data-name="menu-weather"] .page-content > .row:last-child div:first-child{ margin: 0 0.75em 0.75em auto; -webkit-box-ordinal-group: 2; -ms-flex-order: 2; -webkit-order: 2; order: 2;}
.page[data-name="menu-weather"] .page-content > .row:last-child div:last-child{ -webkit-box-ordinal-group: 1; -ms-flex-order: 1; -webkit-order: 1; order: 1;}


/*防災系*/
.japanews24{
  padding: 0.5em;
  background: #FFF;
  margin-top: 0.5em;
}
#japaNews24-banner-linkimage img{
  width: 50%;
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding: 0.5em;
}
.japanews24-detail .list-title{
  padding: 0.5em 0;
  color: #000;
  font-size: 0.8em;
  font-weight: normal;
}

.bousai{
  border: #f35427 solid 1.06vw;
  margin: 0.5em;
  position: relative;
}
.c-exitButton{
  position: absolute;
  right: -2.2vw;
  top: -2.2vw;
  font-size: 5vw;
  width: 7vw;
  height: 7vw;
  color: #fff;
  background-color: #7e7e7e;
  border-radius: 50%;
  text-align: center;
  line-height: 6vw;
  z-index: 10;
}
.bousai-detail{
  background: #f35427
}
.bousai-title{
  color: #fff;
  padding: 1.8vw 0 2.8vw;
  text-align: center;
  margin: -2px;
}
.bousai-title h1{
  font-size: 4vw;
  letter-spacing: .5vw;
}
.bousai-list{
  width: 100%;
  letter-spacing: -1em; /* 文字間を詰める */
  white-space: nowrap; /* 自動で折り返ししない */
  display: flex;
}
.bousai-list-title{
  background-color: #cecece;
  width: 30%;
  position: relative;
  word-wrap: normal;
  text-align: center;
  top: 50%;
  display: flex;
  letter-spacing: normal;
  white-space: normal;
  justify-content: center;
  align-items: center;
}
.bousai-list-area{
  background-color: #fff;
  width: 70%;
  font-size: 3.3vw;
  line-height: 4.6vw;
  display: inline-block;
  letter-spacing: normal;
  white-space: normal;
  padding: 0.5em; 
}
.okiai-post{
  word-break: break-all;
  font-size: 3.3vw;
  position: absolute;
  color: #FFF;
  z-index: 2;
  margin-top: -6vw;
  margin-left: 0.75em;
}
#tsunami .bousai-list{
  border-bottom: #f5f5f5 solid 1px;
}
#tsunami .bousai-list:last-of-type{
  border-bottom: none;
}
#tokubetsu .bousai-list{
  border-bottom: #f5f5f5 solid 1px;
}
#tokubetsu .bousai-list:last-of-type{
  border-bottom: none;
}
#tokubetsu .bousai-list-title{width: 40%}
#tokubetsu .bousai-list-area{width: 60%}
#jishin .bousai-list-title{
  width: 15%;
  align-items: normal;
  padding-top: 0.75em;
  
}
#jishin .bousai-post{
  background: #FFF;
  padding: 0.75em;
  border-bottom: #f5f5f5 solid 1px;
  font-size: 3.3vw;
}
#jishin .bousai-list-area{
  width: 85%;
  padding: 0;
}
.mag-list{
  border-bottom: #f5f5f5 solid 1px;
  display: flex;
}
.mag-list-area{
  padding: 0.9em 0 0 0.75em;
  width: 20%;
}
.mag-list-shindo-wrapper{
  padding: 0.55em 0.75em;
  width: 80%;
}
.mag-list-ravel{
  color: #fff;
  width: 30%;
  text-align: center;
  border-radius: 20vw;
  padding: 0.3em 0;
  margin-bottom: 2.1vw;
}
.mag7{
  background-color: #aa00ff;
}
.mag6s{
  background-color: #fe00fe;
}
.mag6w{
  background-color: #fe0000;
}
.mag5s{
  background-color: #fd5800;
}
.mag5w{
  background-color: #feb200;
}
.mag4{
  background-color: #dfe900;
  color: #000000;
}
.mag-list-area-list{
  padding-left: 1em;
  padding-bottom: 0.75em;
}

/*ランキング切り替えモジュール*/
.ranking-range-selecter-wrapper{
  padding: 2px;
  margin: 1em 0.5em;
  background-color: #e7e7e7;
}
.ranking-range-selecter{
  display: flex;
  font-weight: bold;
  text-align: center;
  padding: 2px;
  margin: 1em 0.5em;
  background-color: #e7e7e7;
  border-radius: 9px;
}
.ranking-select-wrapper{
  width: 25%;
  margin: 0px;
  z-index: 2;
}
.ranking-select-wrapper::before{
  content: '';
  display: inline-block;
  background: #cfcfcf;
  height: 19px;
  width: 1px;
  margin-right: 0px;
  position: absolute;
  margin-top: 4px;
}

.ranking-select-borderless::before{
  background: transparent !important;
}
.ranking-select{
  display: inline-block;
  width: 98%;
  color: #000;
  border-left: none;
  border-radius: 6px;
  height: 28px;
}
.selected-ranking .ranking-select{
  background-color: #FFFFFF;
  box-shadow: 0px 1px 4px 0px #ccc;
}
.ranking-select p{
  display: inline-block;
  background-color: transparent;
  font-size: 0.9em;
  padding: 0.3em;
  z-index: 1;
}

.ranking-focus {
  background-color: #FFFFFF;
  width: 23%;
  position: absolute;
  z-index: 0;
  height: 28px;
  border-radius: 6px;
  margin-top: 0px;
  left: 4%;
  transition: all 300ms 0s ease;
  box-shadow: 0px 1px 4px 0px #ccc;
  /*
  left: 28%;
  left: 52%;
  left: 75%;
  */
}

/*みんカメタブ*/

.mincame-list-title{
  color: #f35427
}
.mincame-list-date{
  font-weight: normal;
}
.mincame-list-name{
  font-weight: normal;
}
.mincame-btn{
  background-image: url(https://news.tv-asahi.co.jp/img/icon-webview.png);
  background-repeat: no-repeat;
  margin: 0 auto;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  color: #e76b1f !important;
  font-weight: bold;
  text-align: center;
  background-color: #ffeee4;
  background-size: 8%;
  background-position: 92%;
  border: 2px solid #e76a1f;
  padding: 0.5em 0.75em;
  width: 60%;
}
.mincame-detail{
    padding-bottom: 0.75em;
}
.mincame-detail .mincame-btn-detail{
    width: 80%;
    margin-bottom: 0px;
    background-image: url(https://news.tv-asahi.co.jp/img/icon-webview.png),url( https://news.tv-asahi.co.jp/app/img/icon-oa.png);
    background-position: 92%,8%;
}

.page[data-name="mincame"] .list-card{border-bottom: none;}
.page[data-name="mincame"] .list-card .list-title{padding: 0.5em;}


/*L字速報用*/
.emergencySwipe-p {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.swiper-openable {
  /*
  background-image: url(https://news.tv-asahi.co.jp/app/img/arrow_down.svg);
  */
  background-position: 92% center;
  background-repeat: no-repeat;
  background-size: 5%;
  display: flex
}

.swiper-openable p {
  width: 80%;
    margin-right: 0px;
}
.swiper-openable p:nth-of-type(2){
  background-image: url(https://news.tv-asahi.co.jp/app/img/arrow_down.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40%;
    display: inline-block;
    width: 15%;
    transition: all 500ms ease 0s;
    margin-left: 0px;
    margin-right: 3%;
}

#emergency-swipe-detail {
  background-color: #222222;
  color: #ffffff;
  /*padding: 0.75em;*/
  height: auto;
  transition: all 500ms ease 0s;
  height:0px;
}
#emergency-swipe-detail #emergency-swipe-detail-text{
  padding: 0.75em;
}

#emergency-swipe-detail-close {
  width: 80px;
  margin-right: 0px;
  margin-left: auto;
}

/*動画追従*/
.sticky-wrapper {
  /*
  position: absolute;
  margin-bottom: -1px;
  */
  transition: all 500ms ease 0s;
  /*background-color: #f5f5f5;*/
  pointer-events: none;
  height: 211px;
}
.sticky-wrapper video {
  pointer-events: auto;
}
.stickymov {

  z-index: 9999;
}

.sticky-desctiption {
  z-index: 9997;
  width: 99%;
  right: 0.5px;
  position: absolute;
  top: 0px;
  transform: scale(1, 1) translate(250px,0px);
  transition: all 500ms ease 0s;
  color: rgba(0,0,0,0);
  pointer-events: auto;
  background-color: #f5f5f5;
  z-index: -1;
}

.sticky-title {
   /* margin: 0.75em; */
   width: 43%;
   /* margin-right: 5%; */
   margin-left: 50%;
  padding: 0.75em;
}

.sticky-title p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

/*動画アイコン*/
.list li[data-movie="on"] .list-title:after {
  content: "";
  height: 9px;
  width: 50px;
  background-image: url(https://news.tv-asahi.co.jp/app/img/icon_movie.png);
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 0.6;
  position: absolute;
  left: 0;
  bottom: 5px;
}
.list .list-card[data-movie="on"] .list-title:after {
  left: 0.75em !important;
  bottom: 0.75em !important;
}


/*スクロール制御*/
.list.scrolling a {
  pointer-events: none;
}

/*ブライトコーブプレイヤー*/
.bcplayerif{
  width: 100%;
  height: 211px;
  border: none;
  pointer-events: auto;
}


/*フッター*/
/*
*/
.toolbar-bottom {
  background: #f5f5f5 !important;
}

.toolbar-bottom .tab-link {
  background-size: 60%;
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: 0.5em;
}

.footer-home {
  background-image: url(../img/footer_home2.png);
}

.tab-link-active.footer-home {
  background-image: url(../img/footer_home_on2.png);
}

.footer-special {
  background-image: url(../img/footer_special2.png);
}

.tab-link-active.footer-special {
  background-image: url(../img/footer_special_on2.png);
}

.footer-eq {
  background-image: url(../img/footer_eq2.png);
}

.tab-link-active.footer-eq {
  background-image: url(../img/footer_eq_on2.png);
}

.footer-mincame {
  background-image: url(../img/footer_mincame2.png);
}

.tab-link-active.footer-mincame {
  background-image: url(../img/footer_mincame_on2.png);
}

.footer-live {
  background-image: url(../img/footer_live2.png);
}

.tab-link-active.footer-live {
  background-image: url(../img/footer_live_on2.png);
}

.tab-footer-page-content {
  background-color: #eee!important;
  padding:0.5em;
}
.footer-page-content-wrapper{
  background: #fff;
    padding-top: 0.1em;
    margin-top: 0.5em;
}

#tab-2 .tab-footer-page-content {
  padding:0;
}

.special {
  background-color: #f5f5f5;
  margin: 0.5em;
}


/*検索エリア*/
.search-article{
  margin: 0; padding: 10px; background-color: #e5e5e5; height: 100%; margin-top: -50px;
  transition: all 200ms 0s ease;
  position: relative;
}

#search-form{
  background-color: #FFF; padding-left: 1em; padding-right: 1em; border-radius: 5px;
}

#search-text{
  background-image: url(https://news.tv-asahi.co.jp/app/img/search_icon_form.png);
  background-size: 25px;
  background-repeat: no-repeat;
  background-position-x: right;
  background-position-y: center;
  width: 100%;
  height: 35px;
}

#search-button{
  position: absolute;
    top: 0;
    right: 0;
    width: 20%;
    height: 100%;
}

#show-search{
  background-image: url(https://news.tv-asahi.co.jp/app/img/search.png);
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: center;
  width: 30px;
  background-color: #e5e5e5;
  z-index: 100000;
}

/*ランキング*/
.ranking-list-thum{
  max-width: 30%;
    background-color: #f5f5f5;
    margin-left: 0.75em;
    position: relative;
}
.ranking-list-thum img{
  width: auto;
  max-height: 60px;
  margin: 0 auto;
}