@charset "utf-8";
.article-ranking__head{margin:24px 0;}
.article-ranking__heading{text-align:center;font-size:18px;line-height:22px;font-weight:normal;}
.article-ranking__subtitle{display:block;font-size:14px;line-height:24px;}

.article-ranking__menu{margin:24px 16px 8px;}
.article-ranking__menu-link{display:inline-block;background: #F5F5F5;border-radius: 8px;padding: 8px;font-size: 14px;line-height: 24px;color:#5a5a5a;margin:0 0 16px 10px;}

.article-ranking-select{margin:0 16px 14px;position:relative;}
.article-ranking-select__block{display:flex;}
.article-ranking-select__list{font-size:14px;line-height:20px;font-weight:bold;margin-right:30px;padding-right:12px;position:relative;cursor:pointer;}
.article-ranking-select__list::after{content: "";display: block;position: absolute;right: 0;top: 4px;width: 6px;height: 6px;border-right: solid 1px #000;border-bottom: solid 1px #000;transform: rotate(45deg);}
.article-ranking-select__list.slideup::after{content: "";display: block;position: absolute;right: 0;top: 8px;width: 6px;height: 6px;border-right: solid 1px #000;border-bottom: solid 1px #000;transform: rotate(-135deg);}
.article-past-ranking-weekly{display:none;}

.article-ranking-calendar{display:none;z-index: 100;position: absolute;padding: 16px;border-radius: 16px;box-shadow: 0px 10px 60px rgb(0 0 0 / 10%);background: #fff;width: 320px;box-sizing: border-box;top: 24px;right: 16px;}
.article-ranking-calendar__wrap{display:flex;flex-wrap:wrap;justify-content: space-between;}
.article-ranking-calendar__link{color:#000;font-weight:bold;font-size:16px;width:30%;text-align:center;padding:13px 0;}

.article-past-ranking-calendar__box{display:none;z-index: 100;position: absolute;padding: 16px;border-radius: 16px;box-shadow: 0px 10px 60px rgb(0 0 0 / 10%);background: #fff;width: 320px;box-sizing: border-box;top: 80px;right: 16px;}
.article-past-ranking-calendar__wrap{display:flex;flex-wrap:wrap;justify-content: space-between;}
.article-past-ranking-calendar__link{color:#000;font-weight:bold;font-size:16px;width:30%;text-align:center;padding:13px 0;cursor:pointer;}
.article-past-ranking-calendar__year{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;}
.article-past-ranking-calendar__year .prev-year{width:20px;height:20px;display:block;text-indent:100%;overflow:hidden;white-space:nowrap;font-size:0;position:relative;cursor:pointer;}
.article-past-ranking-calendar__year .prev-year::before{content:"";display:block;width:6px;height:6px;border-top:solid 2px #2c2c2c;border-left:solid 2px #2c2c2c;transform:rotate(-45deg);position:absolute;left:7px;top:7px;}
.article-past-ranking-calendar__year .next-year{width:20px;height:20px;display:block;text-indent:100%;overflow:hidden;white-space:nowrap;font-size:0;position:relative;cursor:pointer;}
.article-past-ranking-calendar__year .next-year:before{content:"";display:block;width:6px;height:6px;border-bottom:solid 2px #2c2c2c;border-right:solid 2px #2c2c2c;transform:rotate(-45deg);position:absolute;right:7px;top:7px;}

.article-past-ranking-calendar__select{font-size: 16px;line-height: 32px;margin-right:24px;text-align:center;border-radius:8px;border:1px solid #BDBDBD;width:184px;padding:4px 0;cursor:pointer;margin:10px 0;position:relative;}
.article-past-ranking-calendar__select::after{content: "";display: block;position: absolute;right: 30px;top: 14px;width: 6px;height: 6px;border-right: solid 1px #000;border-bottom: solid 1px #000;transform: rotate(45deg);}
.article-past-ranking-calendar__select.slideup::after{content: "";display: block;position: absolute;right: 30px;top: 18px;width: 6px;height: 6px;border-right: solid 1px #000;border-bottom: solid 1px #000;transform: rotate(-135deg);}
.article-past-ranking__list{display:flex;justify-content:space-between;}
.article-past-ranking__link{font-size: 16px;line-height: 32px;display:block;text-align:center;line-height:32px;padding:4px;border-radius:8px;border:1px solid #BDBDBD;color:#000;width:20%;}
.article-past-ranking__link.--current{font-weight:bold;color:#fff;background:#055F96;border-color:#055F96;}

.present__summary{margin:24px 16px;}
.present__summary > p{font-size: 16px;line-height: 32px;text-align:center;}
.present__summary .present__attention{font-size:14px;color:#BE0123;font-weight:bold;}
p.present__catch{margin:48px 16px 0;font-weight:bold;line-height:24px;}
.present__image{width:60%;padding:16px 0;border-radius:4px;}

.present__info{margin:16px;}
.present__info > p{display:none;}
.present__info table{width:100%;border:solid 1px #dde7eb;margin-top:16px;}
.present__info th{background:#F2F7F9;padding: 8px 16px;font-size: 14px;line-height: 20px;color:#5a5a5a;display:block;text-align:left;}
.present__info td{display:block;font-size: 14px;line-height: 24px;padding: 16px;}
.present__heading{font-weight: 600;font-size: 22px;line-height: 33px;margin-bottom:4px;}
.present__info .p-body-btn a{margin-top:32px;display:block;text-align:center;line-height:48px;height:48px;background:#055F96;border-radius:10px;font-size:16px;font-weight:bold;color:#fff;}
.present__info .p-body-btn a .subscribe{width:20px;height:22px;display:inline-block;text-indent:100%;overflow:hidden;white-space:nowrap;font-size:0;background:url(/common/images/v2/books/icon-present.svg) no-repeat;margin:0 10px 0 0;vertical-align: text-top;}

.mailmagazine{border:solid 1px #D07046;padding:24px 16px;margin:16px;}
.mailmagazine__summary{text-align:center;font-size:16px;line-height:32px;}
.mailmagazine__attenstion{font-weight:bold;color:#BE0123;}
.mailmagazine__note{font-size: 12px;line-height: 18px;margin-bottom:16px;}
.mailmagazine__btn{width:80%;margin:auto;height:48px;line-height:48px;text-align:center;display:block;font-size: 16px;font-weight:bold;color:#D07046;border:solid 1px #D07046;border-radius:10px;}

.hon__logo{margin:16px auto;width:112px;display:block;}
.hon__logo img{max-width:100%;}

.information__list{margin:16px;}
.information__item{border-bottom: 1px solid #DDE7EB;padding:8px 0;}
.information__date{color: #5A5A5A;font-size: 14px;line-height: 24px;margin-bottom:4px;}
.information__title{display:block;font-size: 16px;line-height: 28px;font-weight:bold;}

.return-top{text-align: center;margin: 0px auto; font-weight: bold; border-top: 1px solid #DDE7EB;padding: 24px 0;}
.return-top__link{font-weight: bold; padding: 24px 0;display:block;}

.article-info{margin:16px;}
.article-info__contents p{font-size: 16px;line-height: 32px;margin-bottom:36px;}
.signage{border-bottom: 1px solid #DDE7EB;margin-bottom:8px;padding-bottom:8px;}
.signage__date{color: #5A5A5A;font-size: 14px;line-height: 24px;margin-bottom:4px;}
.signage__heading{font-weight: bold;font-size: 22px;line-height: 30px;}

@media screen and (min-width: 1024px) {
   .article-ranking-select{margin:0 0 14px;}
   .article-past-ranking{display:flex;margin:16px 0;}
   .article-past-ranking-calendar__select{margin:0;}
   .article-past-ranking__list{justify-content:start;margin-left:24px;}
   .article-past-ranking__link{margin-right:24px;width:auto;padding:4px 20px;}
   
   .article-past-ranking-weekly__wrap{display:flex;}
   .article-ranking-calendar{left:140px;}
   
   .article-past-ranking-calendar__box{left:0;top: 86px;}
   
  .article-ranking__menu{text-align:center;}
  .article-info{margin:auto;}
  .signage{margin-bottom:16px;padding-bottom:32px;}
  
  .information__item{display:flex;padding:16px 0;}
  .information__date{width:100px;margin-right:10px;}
  .information__title{width:100%;}
  
  .mailmagazine{margin:16px auto;width:500px;}
  .mailmagazine__btn{width:240px;}
  .mailmagazine__wrap{display:flex;justify-content:space-around;margin:16px auto;}
  .mailmagazine__wrap .hon__logo{width:112px;}
  .mailmagazine__note{width:369px;}
  
  .present__catch{text-align:center;}
  .present__detail{width:1000px;margin:16px auto;display:flex;}
  .present__detail > a{width:384px;}
  .present__info{width:600px;margin-top:0;}
  .present__info .p-body-btn a{width: 480px;margin: 32px auto;height: 56px;line-height: 56px;}
  .present__info th{display:revert;border-top: solid 1px #DDE7EB;}
  .present__info td{display:revert;border-right: solid 1px #DDE7EB;border-bottom: solid 1px #DDE7EB;}
}.ranking{padding-top:48px;}
.ranking__heading{padding:14px;display:flex;justify-content:space-between;align-items:baseline;}
.ranking-block{margin-bottom:80px}
.ranking-block__header{padding:8px 14px;display:flex;justify-content:space-between;align-items:center;}
.ranking-block__heading{color:#4E4645;font-size:24px;font-weight:600;}
.ranking-block__more{border:solid 1px #055F96;border-radius:10px;padding:14px 10px 14px 40px;box-sizing:border-box;font-size:14px;font-weight:bold;background:url(/common/images/v2/books/icon-calendar.svg) no-repeat 10px center;}
.ranking-list{display:flex;justify-content:space-between;flex-wrap: wrap;}
.ranking-list__bg{padding:24px 0;}
.ranking-list__bg .ranking-list__img{
  width:60%;
}
.ranking-list__bg-img{
  position: absolute;
  top: -20px;
  left: -20px;
  right: -20px;
  bottom: -20px;
  z-index: -1;
  -webkit-filter: blur(20px);
  filter: blur(20px);
  object-fit: cover;
  width: 130%;
  height: 120%;
}
.ranking-list__img{
  border-radius: 4px;
  max-width: 100%;
  width: 100%;
  height: auto;
  border:1px solid rgba(204,204,204,0.3);
  box-sizing: border-box;
}
.ranking-list__item{width:50%;box-sizing:border-box;margin-bottom:24px;}
.ranking-list__item:nth-child(odd){padding:0 16px 0 8px;}
.ranking-list__item:nth-child(even){padding:0 8px 0 16px;}
.ranking-list__item:first-child{width:100%;padding:0;}
.ranking-list__item:first-child .ranking-list__text{padding:16px;background-color:#fff;text-align:left;}
.ranking-list__text{color:#000;}
.ranking-list__catch{font-size:22px;line-height:33px;font-weight:600;margin-bottom:4px;}
.ranking-list__summary{font-size:14px;line-height:24px;margin-bottom:4px;}
.ranking-list__title{font-size:14px;font-weight:bold;line-height:20px;}
.ranking-list__author{font-size:12px;line-height:18px;}
.ranking-list__cover{overflow:hidden;position:relative;}
.ranking-list__item:not(:first-child){max-width: 350px;margin: 0 auto;}
.ranking-list__label{position:relative;}
.ranking-list__label::after{content:"";display:block;border-width:36px;border-style:solid;border-color:transparent transparent #66899E transparent;transform: rotate(135deg);position:absolute;bottom:-34px;right:-36px;}
.ranking-list__num{color:#fff;font-weight:bold;font-size:20px;position:absolute;right:11px;bottom:6px;z-index:1;}
.ranking-list__item:first-child .ranking-list__label::after{content:"";display:block;border-width:46px;border-style:solid;border-color:transparent transparent #EBB050 transparent;transform: rotate(135deg);position:absolute;bottom:-70px;right:-46px;}
.ranking-list__item:first-child .ranking-list__num{font-size:36px;position:absolute;right:9px;bottom:-23px;z-index:1;}
.ranking-list__item:nth-child(2) .ranking-list__label::after{border-style:solid;border-color:transparent transparent #818181 transparent;}
.ranking-list__item:nth-child(3) .ranking-list__label::after{border-style:solid;border-color:transparent transparent #A86923 transparent;}

@media screen and (min-width: 1024px) {
   .ranking__heading{padding:14px 0;}
   .ranking-block__header{padding:8px 0;}
   .ranking-list__item{width:22%;}
   .ranking-list__item:first-child .ranking-list__url{display:flex;flex-wrap:wrap;align-items: center;justify-content: center;padding:32px;position:relative;}
   .ranking-list__item:first-child .ranking-list__text{background:transparent;width:362px;padding:32px;}
   .ranking-list__item:first-child .ranking-list__inner{background:#fff;padding:24px;}
   .ranking-list__item:first-child .ranking-list__cover{width:224px;}
   .ranking-list__item:nth-child(odd){padding:0;}
   .ranking-list__item:nth-child(even){padding:0;}
   .ranking-list__bg{padding:0;}
   .ranking-list__bg .ranking-list__img{width:100%;}
   .ranking-list__cover{background-image:none !important;}
   .ranking-list__title{font-size: 16px;line-height: 22px;}
   .ranking-list__author{font-size:14px;line-height:24px;}
   .ranking-list__label.is-pc.--num-first{position:absolute;right:0;bottom:24px;}
   
}