@charset "utf-8";
/* CSS Document */
/*===============================================
●共通
===============================================*/
.ly-mod-ttl-main {
  display: none;
}
#famirank h1,
h2,
h3,
p {
  margin: 0;
  padding: 0;
  list-style: none;
  display: block;
}
#famirank ul,
li,
dl,
dt,
dd {
  margin: 0;
  list-style: none;
  padding: 0;
}
#famirank img {
  display: block;
  width: 100%;
  height: auto;
}

/*===============================================
●pc.css 画面の横幅が737px以上
===============================================*/
@media screen and (min-width: 737px) {
  /*===== common ======*/
  #famirank .pc-none {
    display: none;
  }
  #famirank {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 3% 3%;
    position: relative;
    font-feature-settings: 'palt';
    letter-spacing: 0.05em;
    background: #00a33e;
    /* background: #eaf7e6; */
  }
  #famirank .wrapper {
    background: #fff;
    margin: 0 auto;
    border-radius: 20px;
    padding: 3%;
  }

  #rank_ex-item {
    margin-top: -95px;
    padding-top: 95px;
  }
  #famirank h2.ly-mod-ttl-l {
    font-size: 2.4rem;
    margin: 0 0 2rem;
    padding: 0;
  }
  /* #famirank h3.ly-mod-ttl-l {
    font-size: 1.8rem;
    margin: 0 0 1rem;
    padding: 0;
  }
 */

  /*===== ファミマメンバーズプログラムとは？ ======*/
  #famirank .rank_what {
    margin: 0 0 3rem;
  }
  #famirank .rank_what .box {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    margin: 0 auto;
    gap: 20px;
  }
  #famirank .rank_what .inner p {
    width: 100%;
    margin: 0 0 2rem;
    font-size: 1.067rem;
  }
  #famirank .rank_what .box p:first-child {
    width: calc(100% / 2);
    display: flex;
    justify-content: flex-end;
  }
  #famirank .rank_what .box p:last-child {
    width: calc(150% / 2);
    font-size: 1.067rem;
  }

  /*===== ランククリア ======*/

  #famirank .rank_clear hgroup p {
    margin: 0 auto 2rem;
    font-size: 1.067rem;
  }
  #famirank .rank_clear .sm{
    margin: .5rem 0 0;
    font-size: .9rem;
    display: block;
  }
  #famirank .rank_clear dl {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.3rem;
    margin: 0 auto 2rem;
    width: min(93%, 1200px);
    box-sizing: border-box;
  }
  #famirank .rank_clear dt {
    text-align: center;
    font-size: 1.2rem;
    font-weight: 600;
    background: #008cd6;
    padding: 1.5rem;
    width: 100%;
    color: #fff;
    border-radius: 15px 15px 0 0;
    box-sizing: border-box;
  }
  #famirank .rank_clear dt span {
    position: relative;
  }
  #famirank .rank_clear dt span::before {
    content: '';
    display: inline-block;
    width: 41px;
    height: 47px;
    position: absolute;
    top: -7px;
    margin: 0 0 0 -3rem;
  }
  #famirank .rank_clear .sil dt span::before {
    background: url(../images/rank_s.webp) no-repeat;
    background-size: 100%;
  }
  #famirank .rank_clear .gol dt span::before {
    background: url(../images/rank_g.webp) no-repeat;
    background-size: 100%;
  }
  #famirank .rank_clear .anb dt span::before {
    background: url(../images/rank_a.webp) no-repeat;
    background-size: 100%;
  }

  #famirank .rank_clear dl div {
    background: #f5feff;
    border: 4px solid #008cd6;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
  }
  #famirank .rank_clear dd {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1rem;
    flex-grow: 1;
    
  }
  #famirank .rank_clear dd img {
    width: 40%;
    margin: 0 auto;
    border-radius: 20px;
    border: solid 1px #ddd;
  }

  #famirank .rank_clear table {
    width: 100%;
    font-size: 0.88rem;
    border-collapse: collapse;
    table-layout: fixed;
  }
  #famirank .rank_clear th {
    border: solid 1px #ddd;
    color: #fff;
    background-color: #008cd6;
    padding: 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    position: relative;
  }
  #famirank .rank_clear th:nth-child(1) {
    width: 37%;
  }

  /* #famirank .rank_clear th:not(:first-child):before {
    content: '';
    display: block;
    width: 20%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    margin: auto;
  } */

  #famirank .rank_clear th span {
    width: 30%;
    margin: 0 auto 0.5rem;
    display: block;
  }

  #famirank .rank_clear td:nth-child(2),
  #famirank .rank_clear td:nth-child(3),
  #famirank .rank_clear td:nth-child(4),
  #famirank .rank_clear td:nth-child(5) {
    text-align: center;
  }

  #famirank .rank_clear td {
    border: solid 1px #ddd;
    color: #333;
    text-align: left;
    background-color: #f5feff;
    padding: 7px;
    font-size: 1.1rem;
    font-weight: 600;
  }
  #famirank .rank_clear td span {
    display: inline-block;
  }
  #famirank .rank_clear .gry td {
    background-color: #eee;
  }

  #famirank .rank_clear .gry td:first-child {
    display: table-cell;
    gap: 0.5rem;
  }
  #famirank .rank_clear .gry td:first-child::before {
    content: '';
    display: inline-block;
    background: transparent;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
    font-size: 0.8rem;
    margin: 0 0.5rem 0 0;
  }
  #famirank .rank_clear tr:not(.gry) td:first-child {
    display: table-cell;
    align-items: center;
  }
  #famirank .rank_clear tr:not(.gry) td:first-child::before {
    content: 'NEW';
    display: inline-block;
    background: #e30000;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
    color: #fff;
    font-size: 0.8rem;
    vertical-align: top;
    position: relative;
    top: 5px;
    margin: 0 0.5rem 0 0;
  }
  #famirank .rank_clear td img {
    width: 20%;
    margin: 0 auto;
  }

  #famirank .rank_clear td small {
    font-size: 0.9rem;
    font-weight: 400;
  }

  /*===== ファミマメンバーズプログラムについて ======*/
  #famirank .rank_about {
    margin: 0 auto 5%;
  }
  #famirank .rank_about ul {
    width: 100%;
    margin: 5% auto 2%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
    gap: 1rem;
  }
  #famirank .rank_about p {
    width: 100%;
    margin: 2rem 0 5rem;
    font-size: 1.067rem;
  }
  #famirank .rank_about p span {
    font-size: 0.87rem;
  }
  #famirank .rank_about ul li {
    background: #fff;
    padding: 4rem 0 0 0;
    position: relative;
    box-sizing: border-box;
    border-radius: 20px;
  }
  #famirank .rank_about .wrap {
    padding: 0 15px 15px;
    box-sizing: border-box;
  }
  #famirank .rank_about h3 {
    color: #fff;
    text-align: center;
    padding: 10px 0;
  }
  #famirank .rank_about .reg h3 {
    background: #2f872e;
  }
  #famirank .rank_about .sil h3 {
    background: #6a6c7c;
  }
  #famirank .rank_about .gol h3 {
    background: #a6691b;
  }
  #famirank .rank_about .anb h3 {
    background: #030101;
  }
  #famirank .rank_about .rank p {
    background: #008cd6;
    color: #fff;
    font-weight: 600;
    padding: 3px;
    border-radius: 50px;
    text-align: center;
    width: 50%;
    margin: 0 auto;
    position: relative;
    top: 14px;
  }
  #famirank .rank_about .rank::before {
    content: '';
    display: block;
    width: 60%;
    height: 60%;
    position: absolute;
    top: -30%;
    left: 0;
    right: 0;
    margin: auto;
  }
  #famirank .rank_about .reg {
    border: 5px solid #2f872e;
  }
  #famirank .rank_about .sil {
    border: 5px solid #6a6c7c;
  }
  #famirank .rank_about .gol {
    border: 5px solid #a6691b;
  }
  #famirank .rank_about .anb {
    border: 5px solid #030101;
  }
  #famirank .rank_about .reg::before {
    background: url('../images/rank_r.webp') no-repeat;
    background-size: 70%;
    background-position: center;
  }
  #famirank .rank_about .sil::before {
    background: url('../images/rank_s.webp') no-repeat;
    background-size: 70%;
    background-position: center;
  }
  #famirank .rank_about .gol::before {
    background: url('../images/rank_g.webp') no-repeat;
    background-size: 70%;
    background-position: center;
  }
  #famirank .rank_about .anb::before {
    background: url('../images/rank_a.webp') no-repeat;
    background-size: 70%;
    background-position: center;
  }
  #famirank .rank_about .wrap dl {
    background: #f7fff4;
    padding: 20px 10px 10px;
    border: 1px solid #07a33e;
    border-radius: 10px;
    text-align: center;
  }
  #famirank .rank_about .wrap dl hr {
    border: none;
    width: 88%;
    background: #008cd6;
    height: 1px;
    margin: 8% auto 10%;
    position: relative;
  }
  #famirank .rank_about .wrap dl hr::after {
    content: '＆';
    width: 31%;
    background: #f7fff4;
    height: 26px;
    position: absolute;
    top: -14px;
    left: 0;
    right: 0;
    margin: auto;
    color: #008cd6;
    border-radius: 50px;
    font-weight: bold;
    font-size: 1.3rem;
  }

  #famirank .rank_about .reg .wrap dl hr::after {
    content: 'or';
  }
  #famirank .rank_about .wrap dt {
    font-size: 1.13rem;
    font-weight: 500;
    margin: 0 0 3%;
  }
  #famirank .rank_about .wrap dd {
    font-size: 1.13rem;
    font-weight: 500;
    margin: 0 0 3%;
  }
  #famirank .rank_about .wrap dd .big {
    font-size: 1.6rem;
    font-weight: 600;
    margin: 0 0 3%;
    color: #008cd6;
  }
  #famirank .note .subttl {
    margin: 1rem 0 0;
    font-size: 1.2rem;
    color: #313131;
    text-align: left;
    padding: 0;
  }
  #famirank .note .kome_list {
    display: block;
    padding: 0;
    margin: 0;
  }
  #famirank .note p {
    padding: 0;
    margin: 0;
  }
  #famirank .note .kome_list li {
    padding: 0;
  }
  #famirank .note .kome_list li::before {
    display: inline-block;
    content: '※';
  }

  /*===== ランクの確認方法 ======*/
  #famirank .rank_check {
    margin: 0 auto 5%;
  }
  /*===== キャンペーン ======*/
  #famirank .rank_cpn {
    /* background: #f5feff;*/
    margin: 0 auto 5%;
    padding: 20px 20px 10px;
  }
  #famirank .rank_cpn .item-box {
    width: 58.07%;
    margin: 0px 25.5%;
  }
  #famirank .ly-pc-fs12 {
    color: #535353;
  }
  /*  .ly-mod-layout-2clmspl .ly-mod-layout-clm {
    width: 39.75%;
    margin-left: 4.5%;
  }*/
  /*===== ランク対象外品 ======*/
  #famirank .rank_ex-item {
    margin: 0 auto 5%;
  }
  #famirank .rank_ex-item p {
    background: #eee;
    padding: 20px;
    margin: 0 auto;
    box-sizing: border-box;
  }
  #famirank .rank_ex-item p span {
    font-size: 0.96rem;
  }
  /*===== 注意事項 ======*/
}
/*===============================================
●sp.css  画面の横幅が736pxまで
===============================================*/
@media screen and (max-width: 736px) {
  #famirank .sp-none {
    display: none;
  }
  #famirank {
    max-width: 100%;
    margin: 0 auto;
    padding: 3%;
    font-feature-settings: 'palt';
    letter-spacing: 0.05em;
    background: #00a33e;
    /* background: #eaf7e6; */
  }
  #famirank .wrapper {
    background: #fff;
    margin: 0 auto;
    border-radius: 10px;
    padding: 3%;
  }

  #famirank h2.ly-mod-ttl-l {
    font-size: 1.4rem;
    margin: 0 0 1rem;
  }

  /*===== ファミマメンバーズプログラムとは？ ======*/
  #famirank .rank_what {
    margin: 0 0 10%;
  }
  #famirank .rank_what .box {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
    gap: 10px;
  }
  #famirank .rank_what .inner p {
    width: 100%;
    margin: 0 auto 1rem;
  }

  /*===== ランククリア ======*/
  #famirank .rank_clear hgroup p {
    width: 100%;
    margin: 0 auto 1rem;
  }
  #famirank .rank_clear .sm{
    margin: .5rem 0 0;
    font-size: .8rem;
    display: block;
  }
  #famirank .rank_clear dl {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem;
    margin: 0 0 2rem;
  }
  #famirank .rank_clear dt {
    text-align: center;
    font-size: 1.05rem;
    font-weight: 600;
    background: #008cd6;
    padding: 0.6rem;
    width: 100%;
    color: #fff;
    border-radius: 10px 10px 0 0;
    box-sizing: border-box;
  }
  #famirank .rank_clear dt span {
    position: relative;
  }
  #famirank .rank_clear dt span::before {
    content: '';
    display: inline-block;
    width: 28px;
    height: 30px;
    position: absolute;
    top: -3px;
    margin: 0 0 0 -2.3rem;
  }
  #famirank .rank_clear .sil dt span::before {
    background: url(../images/rank_s.webp) no-repeat;
    background-size: 100%;
    background-position: center;
  }
  #famirank .rank_clear .gol dt span::before {
    background: url(../images/rank_g.webp) no-repeat;
    background-size: 100%;
    background-position: center;
  }
  #famirank .rank_clear .anb dt span::before {
    background: url(../images/rank_a.webp) no-repeat;
    background-size: 100%;
    background-position: center;
  }

  #famirank .rank_clear dl div {
    background: #f5feff;
    border: 2px solid #008cd6;
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
  }
  #famirank .rank_clear dd {
    display: grid;
    grid-template-columns: 2fr 0.5fr;
    align-items: center;
    padding: 0.8rem;
    gap: 0.5rem;
  }
  #famirank .rank_clear dd img {
    width: 100%;
    margin: 0 auto;
    border-radius: 10px;
    border: solid 1px #ddd;
  }

  #famirank .rank_clear table {
    width: 100%;
    font-size: 0.88rem;
    border-collapse: collapse;
    table-layout: fixed;
  }
  #famirank .rank_clear th {
    border: solid 1px #ddd;
    color: #fff;
    background-color: #008cd6;
    padding: 0.5rem 0.3rem;
    font-size: 0.85rem;
    font-weight: 600;
    position: relative;
  }
  #famirank .rank_clear th:nth-child(1) {
    width: 35%;
  }
  /* #famirank .rank_clear th:not(:first-child):before {
    content: '';
    display: block;
    width: 20%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    margin: auto;
  } */
  #famirank .rank_clear th span {
    width: 80%;
    margin: 0 auto;
    display: block;
  }

  #famirank .rank_clear td:nth-child(2),
  #famirank .rank_clear td:nth-child(3),
  #famirank .rank_clear td:nth-child(4),
  #famirank .rank_clear td:nth-child(5) {
    text-align: center;
  }

  #famirank .rank_clear td {
    border: solid 1px #ddd;
    color: #333;
    text-align: left;
    background-color: #f5feff;
    padding: 0.3rem;
    font-size: 0.85rem;
    font-weight: 600;
  }
  #famirank .rank_clear .gry td {
    background-color: #eee;
  }

  #famirank .rank_clear .gry td:first-child {
    display: table-cell;
    gap: 0.5rem;
  }
  #famirank .rank_clear .gry td:first-child::before {
    content: none;
  }
  #famirank .rank_clear tr:not(.gry) td:first-child {
    display: table-cell;
    align-items: center;
    gap: 0.5rem;
  }
  #famirank .rank_clear tr:not(.gry) td:first-child::before {
    content: 'NEW';
    display: inline-block;
    background: #e30000;
    width: 100%;
    height: 15px;
    text-align: center;
    line-height: 15px;
    color: #fff;
    font-size: 0.7rem;
    vertical-align: top;
  }
  #famirank .rank_clear td img {
    width: 70%;
    margin: 0 auto;
  }

  #famirank .rank_clear td small {
    font-size: 0.8rem;
    font-weight: 400;
    display: inline-block;
  }

  /*===== ファミマメンバーズプログラムについて ======*/
  #famirank .rank_about {
    margin: 0 auto 10%;
  }
  #famirank .rank_about ul {
    width: 100%;
    margin: 1rem auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }
  #famirank .rank_about p {
    margin: 1.5rem 0;
  }
  #famirank .rank_about p span {
    font-size: 0.8rem;
  }
  #famirank .rank_about ul li {
    width: 100%;
    background: #fff;
    padding: 0;
    position: relative;
    box-sizing: border-box;
    border-radius: 15px;
  }
  #famirank .rank_about .wrap {
    padding: 0 10px 10px;
  }
  #famirank .rank_about h3 {
    color: #fff;
    text-align: center;
    padding: 5px 0;
    font-size: 1rem;
    border-radius: 10px 10px 0 0;
  }
  #famirank .rank_about .reg h3 {
    background: #2f872e;
  }
  #famirank .rank_about .sil h3 {
    background: #6a6c7c;
  }
  #famirank .rank_about .gol h3 {
    background: #a6691b;
  }
  #famirank .rank_about .anb h3 {
    background: #030101;
  }

  #famirank .rank_about ul li p {
    background: #008cd6;
    color: #fff;
    font-weight: 600;
    padding: 3px;
    border-radius: 50px;
    text-align: center;
    width: 20%;
    margin: 0 24vw 0 auto;
    position: relative;
    top: 14px;
    font-size: 0.88rem;
  }
  #famirank .rank_about ul .rank::before {
    content: '';
    display: block;
    width: 40%;
    height: 62%;
    position: absolute;
    top: 33%;
    left: -9%;
    right: 20%;
    margin: 0;
  }

  #famirank .rank_about .reg {
    border: 3px solid #2f872e;
  }
  #famirank .rank_about .sil {
    border: 3px solid #6a6c7c;
  }
  #famirank .rank_about .gol {
    border: 3px solid #a6691b;
  }
  #famirank .rank_about .anb {
    border: 3px solid #030101;
  }

  #famirank .rank_about .reg::before {
    background: url('../images/rank_r.webp') no-repeat;
    background-size: 50%;
    background-position: center;
  }
  #famirank .rank_about .sil::before {
    background: url('../images/rank_s.webp') no-repeat;
    background-size: 50%;
    background-position: center;
  }
  #famirank .rank_about .gol:before {
    background: url('../images/rank_g.webp') no-repeat;
    background-size: 50%;
    background-position: center;
  }
  #famirank .rank_about .anb::before {
    background: url('../images/rank_a.webp') no-repeat;
    background-size: 50%;
    background-position: center;
  }
  #famirank .rank_about .wrap dl {
    background: #f7fff4;
    padding: 15px 5px 5px;
    border: 1px solid #07a33e;
    border-radius: 10px;
    text-align: center;
    width: calc(100% - 17vw);
    margin: 0 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-around;
    box-sizing: border-box;
  }
  #famirank .rank_about .wrap dl hr {
    border: none;
    width: 1px;
    background: #008cd6;
    height: 46px;
    margin: 4% 3px 5%;
    position: relative;
  }
  /* #famirank .rank_about .wrap dl hr::after {
    content: '&';
    width: 30px;
    background: #f7fff4;
    height: 26px;
    position: absolute;
    top: 10px;
    left: -13px;
    right: 0;
    margin: auto;
    color: #008cd6;
    border-radius: 50px;
    font-weight: bold;
    font-size: 1.1rem;
  }*/
  #famirank .rank_about .wrap dl hr::after {
    content: '＆';
    width: 14px;
    background: #f7fff4;
    height: 24px;
    position: absolute;
    top: 8px;
    left: -7px;
    right: 0;
    margin: auto;
    color: #008cd6;
    border-radius: 50px;
    font-weight: bold;
    font-size: 1.1rem;
  }
  #famirank .rank_about .reg .wrap dl hr::after {
    content: 'or';
  }
  #famirank .rank_about .wrap dt {
    font-size: 0.88rem;
    font-weight: 500;
    margin: 0 0 3%;
  }
  #famirank .rank_about .wrap dd {
    font-size: 0.88rem;
    font-weight: 500;
    margin: 0 0 3%;
  }
  #famirank .rank_about .wrap dd .big {
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0 0 3%;
    color: #008cd6;
  }
  #famirank .ly-mod-ttl-l {
    font-size: 1.4rem;
    margin: 0 0 2%;
  }

  #famirank .note .subttl {
    margin: 1rem 0 0;
    font-size: 1rem;
    color: #313131;
    text-align: left;
    padding: 0;
  }
  #famirank .note .kome_list {
    display: block;
    padding: 0;
    margin: 0;
  }
  #famirank .note p {
    padding: 0;
    margin: 0;
  }
  #famirank .note .kome_list li {
    padding: 0;
  }
  #famirank .note .kome_list li::before {
    display: inline-block;
    content: '※';
  }

  /*===== ランクの確認方法 ======*/
  #famirank .rank_check {
    margin: 0 auto 10%;
  }
  /*===== キャンペーン ======*/
  #famirank .rank_cpn {
    /*    background: #f5feff;*/
    margin: 0 auto 10%;
  }
  #famirank .ly-pc-fs12 {
    font-size: 0.8rem;
    color: #535353;
  }
  /*===== ランク対象外品 ======*/

  #famirank .rank_ex-item p {
    background: #eee;
    padding: 20px;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
  }
  #famirank .rank_ex-item p span {
    font-size: 0.8rem;
  }
  #famirank .ly-pc-fs14 li {
    font-size: 0.8rem;
  }
  /*===== spアンカーボタン ======*/
  #rank_what,
  #rank_about,
  #rank_cpn,
  #rank_ex-item,
  #rank_clear {
    margin-top: -54px;
    padding-top: 54px;
  }
  #famirank .flex {
    width: 100%;
    flex-direction: column;
    justify-content: flex-start;
    border: 1px solid #ddd;
    position: inherit;
    flex-wrap: nowrap;
    box-sizing: border-box;
    padding: 10px;
    font-weight: bold;
    margin: 2% 0 10%;
  }
  #famirank .flex li {
    line-height: 2.6;
  }
  #famirank .anclist:before {
    content: '\e914';
    margin-right: 8px;
    position: relative;
    font-family: 'icn_font';
    font-size: 0.93333333333333rem;
    font-weight: normal;
    line-height: 0;
    display: inline-block;
  }
  #famirank ul li a:link {
    color: #0171a6;
    text-decoration: none;
  }
  .others {
    padding: 0 0.8rem;
  }
}
/* ============= */

/*===============================================
●tablet.css  画面の横幅が737px～
===============================================*/
@media screen and (min-width: 456px) and (max-width: 736px) {
  #famirank .rank_what .box {
    gap: 20px;
    padding: 20px;
    box-sizing: border-box;
  }
  #famirank .rank_about {
    padding: 20px;
  }
  #famirank .rank_about .wrap {
    padding: 0 20px 20px;
  }
  #famirank .rank_about ul .rank.reg::before,
  #famirank .rank_about ul .rank.sil::before,
  #famirank .rank_about ul .rank.gol::before,
  #famirank .rank_about ul .rank.anb::before {
    background-size: 39%;
  }
  #famirank .rank_about ul .rank::before {
    width: 44%;
    height: 70%;
    top: 25%;
    left: -10%;
  }
  #famirank .rank_about .wrap dt {
    font-size: 1.2rem;
  }
  #famirank .rank_about .wrap dd {
    font-size: 1.2rem;
  }
  #famirank .rank_about .wrap dd .big {
    font-size: 1.6rem;
  }
  #famirank .rank_about ul li p {
    font-size: 1rem;
    margin: 0 23vw 0 auto;
  }
  #famirank .rank_about ul li h3 {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 737px) and (max-width: 950px) {
  #famirank .rank_what .box {
    width: 80%;
  }
  #famirank .rank_about {
    padding: 0;
  }
  #famirank .rank_about p {
    width: 80%;
    margin: 0 auto 8%;
  }
  #famirank .rank_about ul {
    gap: 10px;
  }
  #famirank .rank_about ul li {
    width: calc(100% / 4 - 10px);
  }
  #famirank .rank_about .wrap dl hr {
    margin: 13% auto 16%;
  }
}
@media screen and (min-width: 951px) and (max-width: 1024px) {
  #famirank .rank_about ul li {
    width: calc(100% / 4);
  }
  #famirank .rank_about {
    padding: 0;
  }
  #famirank .rank_about ul {
    gap: 12px;
  }
}