@media screen and (max-width: 599px) {
  ul.choice_btn3 li{
    width: 78px;
  }
  ul.choice_btn3{
    width: 335px;
  }
}
@media screen and (min-width: 600px) {
  ul.choice_btn3 li{
    width: 140px;
  }
  ul.choice_btn3{
    width: 444px;
  }
}
ul.choice_btn3{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;  
  justify-content: center;
  margin: 2em auto ;
  gap: 8px;
}
ul.choice_btn3 li{
  text-align: center;
  background: #EEE4BA;
  font-size: 13px;
  height: 30px;
  line-height: 30px;
}
ul.choice_btn3 li.tab {
  border-radius: 0;
}
ul.choice_btn3 li.tab a {
  display: block;
  color: inherit;
  text-decoration: none;
}
ul.choice_btn3 li.left_block{
  border-top-left-radius: 15px;
  border-bottom-left-radius: 15px;
}
ul.choice_btn3 li.center_block{
  border-radius: 0;
}
ul.choice_btn3 li.right_block{
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
}
ul.choice_btn3 li.is-active{
  background: #fff;
  transition: all 0.2s ease-out;
}

#list_keyword{
  margin:0 auto;
}
#list_keyword .box_list5 .box_bottom{
  min-height:92px;
  padding: 16px 20px;
}
#list_keyword .box_bottom p{
  font-size: 11px;
  margin-top: 8px;
  line-height: 1.4;
}
/*.article_inner .panel{
  display: flex;
  justify-content: flex-start;
  align-content: center;
  gap: 24px;
  flex-flow: row wrap;
}
.article_inner .panel::after{
  display: block;
  content:"";
  width: 316px;
}*/
.article_inner .panel{
  display: grid;
  grid-template-columns: repeat(auto-fill, 316px);
  grid-gap: 28px 26px;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: flex-start;
}
@media screen and (max-width: 599px){
  .article_inner .panel{
    /*width: calc(100% - 40px);*/
    margin: 0 auto;
    grid-template-columns: repeat(auto-fill,335px);
  }
  #list_keyword .article_inner .panel.is-keyword{
    width: calc(100% - 40px);
  }
}

#list_keyword .box_list5{
  margin: 0 auto;
  width: 316px;
  background: #fff;
  border-radius: 12px;
}
#list_keyword  .pic_mosaic_1{
  width: 316px ;
  height:120px ;
}
*#list_keyword .box_list5 .pic_mosaic_1 img{
  width: 100%;
  object-fit: cover;
  object-position: center center;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  height: 120px !important;
}
#list_keyword.ranking .block_S,
#list_keyword.new .boxL{
  width: 316px;
}
.box_list5 h4{
  font-size:16px;
}
#list_keyword.new .boxL img{
  height: 166px;
}
#list_keyword.ranking .block_S span.rank{
  position: absolute;
  top: -8px;
  left: -8px;
  background: #DDCB80;
  color: #fff;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 30px;
}
SPAN.box_tag.pr::before {
  position: static;
}
#list_keyword .boxL img {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  width: 100%;
  height: 120px;
  object-fit: cover;
  object-position: center center;
}
#list_keyword .pic_mosaic img{
  width: 100%;
  object-fit: cover;
  object-position: center center;
}
#list_keyword .pic_mosaic{
  display: grid;
  grid-template-areas: 
              "a a b c"
              "a a d e";
  column-gap: 0px;
  row-gap: 0px;
}
#list_keyword .pic_0{
  grid-area: a;
  height: 120px!important;
  border-top-left-radius: 12px;
}
#list_keyword .pic_1{
  grid-area: b;
  height: 60px!important;
}
#list_keyword .pic_2{
  grid-area: c;
  height: 60px!important;
  border-top-right-radius: 12px;
}
#list_keyword .pic_3{
  grid-area: d;
  height: 60px!important;
}
#list_keyword .pic_4{
  grid-area: e;
  height: 60px!important;
}
@media screen and (max-width: 599px){
  #list_keyword .box_list5,
  #list_keyword .block_L,
  #list_keyword .block_S {
    width: 335px;
  }
  #list_keyword  .pic_mosaic_1 {
    width: 335px;
    height: 176px;
  }  
  *#list_keyword .box_list5 .pic_mosaic_1 img {
    height: 176px !important;
  }
  #list_keyword .pic_0 {
    height: 128px !important;
  }
  #list_keyword .pic_1, #list_keyword .pic_2, #list_keyword .pic_3, #list_keyword .pic_4{
    height: 64px !important;
  }
  #list_keyword .box_list5 .box_bottom{
    min-height: auto;
  }

  #sidemenus #ranking .slider::-webkit-scrollbar {display: none;-webkit-appearance: none;}
  #sidemenus #ranking .slider{
    display: flex;
    overflow-x: scroll;
    scroll-behavior: smooth;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
}

.m_caption{
  width: 90%;
  margin: 2em auto;
  font-size: 0.8em;

}
#ranking .block_M .rank {
  left: 8px;
}


#sidemenus #ranking .block_M {
  width: 146px;
  min-width: 146px;
  height: 196px;
  margin-top: 10px;
  box-sizing: content-box;
  padding-left:16px;
}
/*#sidemenus #ranking .block_M:first-child {
  padding-left:20px;
}*/
#sidemenus #ranking .block_M:last-child {
  padding-right:20px;
}
.block_M img {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  width: 100%;
  object-fit: cover;
  object-position: center center;
  height: 111px;
}
.block_M .mini_summary {
  background: #fff;
  min-height: 83px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.block_M .mini_summary h4 {
  margin-top: 2px;
  line-height: 1.4;
}
/*.block_S .mini_summary h4 {
  margin-top: 2px;
}*/
#contents {
  background: #fff;
  padding-bottom: 40px;
}
#contents_inner {
  /*padding-bottom: 2em;*/
}
.divider_block{
  background: url("./../image/common/points/divider_block.svg") no-repeat scroll center center/36px 36px;
  width: 36px;
  height: 36px;
  margin: 60px auto 32px;
}
.arrow_btm{
  background: url("./../image/common/points/arrow_btm.svg") no-repeat scroll center center/36px 36px;
  width: 36px;
  height: 36px;
  margin: 2em auto;
}
#for_more_detail{
  text-align: center;
/*  padding: 1em 0 0;*/
}

#for_more_detail P {
  font-size: 16px;
  position: relative;
  margin: 40px auto 0;
  display: flex;
  justify-content: center;
}

#for_more_detail P::before {
  position: absolute;
  content: '';
  background: url("./../image/common/line.svg") no-repeat scroll center center/80px 5px;
  width: 100%;
  height: 5px;
  top: -10px;
  margin: 0 auto;
}
#for_more_detail P::after {
  position: absolute;
  content: '';
  background: url("./../image/tarot/for_more_details.svg") no-repeat scroll center center/110px 13px;
  width: 100%;
  height: 13px;
  top: -30px;
  margin: 0 auto;
}
.telling{
  background: #F6F5EE;
  margin: 0 auto;
}


h2.article_h2 {
  font-size: 18px;
  text-align: left;
  border-bottom: 1px solid #1F2121;
  position:relative;
}
h2.article_h2 P{
  z-index: 10;
  position: relative;
}
.articles h2::before {
  position: absolute;
  left: -23px;
  height: 80px;
  font-size: 80px;
  top: -60px;
  font-family: stencil-creek, sans-serif;
  color:#F6F5EE;
}

.articles h2:nth-of-type(1)::before { content: "01"; }
.articles h2:nth-of-type(2)::before { content: "02"; }
.articles h2:nth-of-type(3)::before { content: "03"; }
.articles h2:nth-of-type(4)::before { content: "04"; }
.articles h2:nth-of-type(5)::before { content: "05"; }
.articles h2:nth-of-type(6)::before { content: "06"; }
.articles h2:nth-of-type(7)::before { content: "07"; }
.articles h2:nth-of-type(8)::before { content: "08"; }
.articles h2:nth-of-type(9)::before { content: "09"; }
.articles h2:nth-of-type(10)::before { content: "10"; }


.articles ul{
  margin: 1em auto;
}
.articles ul.dot {
  width: 100%;
  margin: 1em auto;
}
.articles ul.dot li{
  position: relative;
  padding-left: 15px;
}

.articles ul.dot li:before {
  content: "";
  position: absolute;
  top: 0.5em;
  left: 0;
  width: 7px;
  height: 7px;
  background-color: #1F2121;
  border-radius: 50%;
}
.articles ul.checked li{
  position: relative;
  padding-left: 10px;
}
.articles ul.checked li:before {
  content: "";
  position: absolute;
  top: 0.3em;
  left: 0;
  -webkit-transform: rotate(50deg);
  -ms-transform: rotate(50deg);
  transform: rotate(50deg);
  width: 5px;
  height: 10px;
  border-right: 3px solid #1F2121;
  border-bottom: 3px solid #1F2121;
}
.articles ol.number{
  margin: 1em auto;
}
.articles ol.number li{
  list-style: decimal;
  margin-left: 1em;
}
.articles P.text_sub{
  background: #F6F5EE;
  margin: 1em auto;
  padding: 1em;
  font-size: 0.8em;
}

.sub_title{
  text-align: center;
  font-size: 12px;
  margin: 2em auto 3em;
}
.sub_title b{
  font-size: 14px;
  font-weight: normal;
  display: block;
  padding-bottom: 0.5em;
}
.telling {
  padding: 1px 20px 20px;
  background: #F6F5EE;
  margin: 0 auto;
}
.telling li{
  font-size: 14px;
  line-height: 2;
  padding-left: 2em;
  position: relative;
}
.telling span{
  font-size: 14px;
  line-height: 2;
  padding-left: 4em;
  position: relative;
  display: block;
  padding-left: 50px;
}
.telling span::before{
  content: '';
  width: 8px;
  height: 8px;
  border: 0px;
  border-top: solid 2px #000;
  border-right: solid 2px #000;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  position: absolute;
  top: 65%;
  left: 0;
  margin-top: -8px;
  margin-left: 37px;
}
.telling li.number::before{
  position: absolute;
  left: 0;
  width: 2em;
  height: 16px;
  top:0;
  color: #B49A2E;
  font-family: stencil-creek, sans-serif;
  font-size: 16px;
}
.telling li.number:nth-of-type(1)::before{  content: '01'; }
.telling li.number:nth-of-type(2)::before{  content: '02'; }
.telling li.number:nth-of-type(3)::before{  content: '03'; }
.telling li.number:nth-of-type(4)::before{  content: '04'; }
.telling li.number:nth-of-type(5)::before{  content: '05'; }
.telling li.number:nth-of-type(6)::before{  content: '06'; }
.telling li.number:nth-of-type(7)::before{  content: '07'; }
.telling li.number:nth-of-type(8)::before{  content: '08'; }
.telling li.number:nth-of-type(9)::before{  content: '09'; }
.telling li.number:nth-of-type(10)::before{  content: '10'; }
.telling li.number:nth-of-type(11)::before{  content: '11'; }
.telling li.number:nth-of-type(12)::before{  content: '12'; }
.telling li.number:nth-of-type(13)::before{  content: '13'; }
.telling li.number:nth-of-type(14)::before{  content: '14'; }
.telling li.number:nth-of-type(15)::before{  content: '15'; }
.telling li.number:nth-of-type(16)::before{  content: '16'; }
.telling li.number:nth-of-type(17)::before{  content: '17'; }
.telling li.number:nth-of-type(18)::before{  content: '18'; }
.telling li.number:nth-of-type(19)::before{  content: '19'; }
.telling li.number:nth-of-type(20)::before{  content: '20'; }

P.topic {
  text-align: center;
}
/*.c_keyword4, .c_keyword2, .c_keyword {
  margin: 1em auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.c_keyword::before {
  margin-right: 1em;
}
.c_keyword::before, .c_keyword::after {
  border-top: 1px solid;
  content: "";
  width: 1em;
}
.c_keyword::after {
  margin-left: 1em;
}
.c_keyword::before, .c_keyword::after {
  border-top: 1px solid;
  content: "";
  width: 1em;
}
.c_keyword5{
  border: 1px solid #1F2121;
  width: 100%;
  font-size: 14px;
  border-radius: 50px;
  width: 113px;
  padding: 4px 12px;
  text-align: center;
}
.c_keyword6{
  font-weight: bold;
  padding: 10px 0;
}
h1 span,h2 span,h3 span,h4 span{display:block;}
*/

.i_card_txt{line-height:170%;}
P.text_main {
  margin: 0 auto;
  line-height:170%;
  font-size: 15px;
}

.article_h3.sub  {
  margin: 1em auto;
  display: flex;
  align-items: center;
}
.article_h3.sub:after {
  content: "";
  background: url("./../image/tarot/sub_right.svg") no-repeat scroll center right/5px 24px;
  width: 15px;
  height: 24px;
}
.article_h3.sub:before{
  content: "";
  background: url("./../image/tarot/sub_left.svg") no-repeat scroll center left/5px 24px;
  width: 15px;
  height: 24px;
}
.article h4 {
  border-bottom: 1px dashed #1F2121;
  line-height: 2em;
  margin: 2em auto 0;
}
.article.interpretation h4 {
  border-bottom: 1px dashed #1F2121;
  line-height: 2em;
  font-weight: 500;
  margin: 0 auto;
}

.moon_phase{
  display: flex;
  justify-content: space-between;
}
.moon_phase [class^="color_line"] {
  position: absolute;
  width: 1px;
  height: 100%;
  top: 1px;
  left: 25px;
}
.c_keyword_txt{
  display: table;
  margin: auto;
  text-align: left;
}
.moon_phase .color_line1{
  background-image: linear-gradient(to bottom, #C4D6D4 0%, #D2D0A6 100%);
}
.moon_phase .color_line2{
  background-image: linear-gradient(to bottom, #D2D0A6 0%, #DDCB80 100%);
}
.moon_phase .color_line3{
  background-image: linear-gradient(to bottom, #DDCB80 0%, #D2D0A6 100%);
}
.moon_phase .color_line4{
  background-image: linear-gradient(to bottom, #D2D0A6 0%, #C4D6D4 100%);
}
.moon_phase .left_box{
}
.article .moon_phase .left_box{
  width:50px;
  position: relative;
}
.article .moon_phase .right_box{
  width:270px;
}
.first_quarter_moon{  
  background: url("./../image/moon/first_quarter_moon.svg") no-repeat scroll center center/50px 50px;  
  width:50px;
  height:50px;
  display: block;
}
.new_moon{  
  background: url("./../image/moon/new_moon.svg") no-repeat scroll center center/50px 50px;  
  width:50px;
  height:50px;
  display: block;
}
.full_moon{  
  background: url("./../image/moon/full_moon.svg") no-repeat scroll center center/50px 50px;  
  width:50px;
  height:50px;
  display: block;
}
.warning_moon{  
  background: url("./../image/moon/warning_moon.svg") no-repeat scroll center center/50px 50px;  
  width:50px;
  height:50px;
  display: block;
}
h1#todaysmoon P {
  position: relative;
  display: inline-block;
}
h1#todaysmoon P::before {
  position: absolute;
  content: '';
  background: url("./../image/common/line.svg") no-repeat scroll center center/80px 5px;
  width: 100%;
  height: 5px;
  top: -10px;
  left: 0;
}
h1#todaysmoon P::after {
  position: absolute;
  content: '';
  background: url("./../image/moon/todaysmoon.svg") no-repeat scroll center center/89px 15px;
  width: 100%;
  height: 15px;
  top: -30px;
  left: 0;
}

.articles P.text_sub{
  background: #F6F5EE;
  margin: 1em auto;
  padding: 1em;
  font-size: 0.8em;
}


@media screen and (max-width: 599px){
  #for_more_detail{
    text-align: center;
    padding: 1px 0 0;
  }
  .article.interpretation, .article.interpretation h3, .articles .article, .telling,   #ez-toc-container,#for_more_detail P, #for_more_detail {
    width: 90%;
    margin: 0 auto;
  }
  h2.article_h2 {
    width: 90%;
    margin: 3em auto 1em;
  }
  .koyomi_box{
    width: 255px;
    height: 255px;
    margin: 20px auto;
  }
  #sidemenus .week.bg_white{
    margin: 60px auto;
  }

  #sidemenus .week,
  #sidemenus .keyword{
    width: calc(100% - 40px);
    margin:0 auto;
  }
 .is_sp .week.bg_white{
    width: calc(100% - 40px);
    margin: 0 auto;
 }
 .is_sp .week.bg_white .day_box .right_block{
   background:#F6F5EE;
  }
  .tag_caption{
    font-size: 13px;
    line-height: 1.7;
    width: calc(100% - 80px);
    margin: 20px auto 32px;
  }
  .search_explore {
    margin: 0 auto;
    margin-top: 1em;
    width: 335px;
  }
}
@media screen and (min-width: 600px) {
  .tag_caption{
    font-size: 13px;
    line-height: 1.7;
    width: calc(100% - 80px);
     margin: 20px auto 32px;
   }
  .tag_caption P{
    text-align:center;
  }
  #for_more_detail{
    text-align: center;
    padding: 1em 0 0;
  }
  .article.interpretation ,
  .article.interpretation h3,
  .articles .article,
  .topic_img ,
  P.text_main ,
  h2.article_h2 ,
  .telling,
  #ez-toc-container,
  #for_more_detail P ,
  #for_more_detail{
    width: 540px;
    margin: 0 auto;
  }
  .article.motif .right P{
    width: 280px;
    padding-left: 10px;
  }
  #for_more_detail P, #for_more_detail {
    margin: 2em auto 0;
  }
  .article.motif {
    display:flex;
  }
  .article.interpretation {
    display: grid;
    grid-template-areas: 
                "a  a"
                "b  c"
                "b  d";
    column-gap: 20px;
    row-gap: 20px;
    margin: 2em auto 0;
  }
  .article.interpretation h3{
    grid-area: a;
    margin: 0 auto;
  }
  .topic_img{
    margin: 1em auto;
  }
  .articles h2{
    margin: 4em auto 1em;
  }
  .article.advice {
    margin: 3em auto 0;
  }
  .topic_img{
    margin: 1em auto ;
  }
  #for_more_detail P{
    margin: 2em auto 0;
  }
  h2#main {
    width: 90%;
  }
  .about_author {
    width: 90%;
  }
  .telling {
    padding: 1px 40px 20px;
  }

  .article .moon_phase .right_box{
    width:450px;
  }
  .koyomi_box{
    width: 344px;
    height: 344px;
    margin: 20px auto;
  }
  .area_main.koyomi .c_keyword_txt{
    width: 344px;
  }
  .search_explore {
    margin: 0 auto;
    margin-top: 1em;
    width: 596px;
  }
}
.keyword_inner{
  align-items: center;
  justify-content: center;
  display: flex;
}
.outer_block_S .rank,
#ranking .rank {
  width: 30px;
  height: 30px;
  border-radius: 50px;
  background: #DDCB80;
  color: #fff;
  text-align: center;
  line-height: 30px;
  position: absolute;
  left: -8px;
  top: -8px;
}
.cl989898 {
  color: #989898;
}
.search_info {
  text-align: center;
}