#contents {
  background: #fff;
}
#contents_inner {
/*  padding-bottom: 2em;*/
}

.divider_block{
  background: url("./../image/common/divider_block.svg") no-repeat scroll center center/36px 36px;
  width: 36px;
  height: 36px;
  margin: 2em auto;
}
.arrow_btm{
  background: url("./../image/tarot/arrow_btm.svg") no-repeat scroll center center/36px 36px;
  width: 36px;
  height: 36px;
  margin: 2em auto;
}
h1#tryagain P ,
h1#tarot P {
  position: relative;
  display: inline-block;
}
h1#tryagain P::before ,
h1#tarot 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#tarot P::after {
  position: absolute;
  content: '';
  background: url("./../image/tarot/tarot_title.svg") no-repeat scroll center center/69px 17px;
  width: 100%;
  height: 17px;
  top: -30px;
  left: 0;
}
h1#tryagain P::after {
  position: absolute;
  content: '';
  background: url("./../image/tarot/try again.svg") no-repeat scroll center center/70px 12px;
  width: 100%;
  height: 12px;
  top: -30px;
  left: 0;
}

.area_main {
  padding: 20px;
  position: relative;
}
.area_main::before, .area_main::after {
  content: '';
  width: 20px;
  height: 100%;
  position: absolute;
}
.area_main::before {
  border-left: solid 2px #888;
  border-top: solid 2px #888;
  border-bottom: solid 2px #888;
  top: 0;
  left: 0;
}
.area_main::after {
  border-right: solid 2px #888;
  border-top: solid 2px #888;
  border-bottom: solid 2px #888;
  top: 0;
  right: 0;
}
.circle_free {
  width: 54px;
  height: 54px;
  border-radius: 50px;
  border: dashed 1px #000;
  line-height: 16px;
  text-align: center;
  padding: 10px;
  font-size: 12px;
  position: absolute;
  top: -28px;
}
.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;
}
.area_main .goto {
  font-size: 0.8em;
  background-color: #000;
  border-radius: 50px;
  margin: 15px auto;
  text-align: center;
  color: #fff;
  display: block;
  width: 140px;
  height: 28px;
  line-height: 28px;
  cursor: pointer;
}
.area_main .goto.second {
  display: none;
}
.area_main .goto.second a{color:#fff;}

#for_more_detail{
  margin: 1em auto ;
  text-align: center;
}

#for_more_detail span {
  font-size: 18px;
  position: relative;
  margin: 40px auto 0;
  display: flex;
  justify-content: center;
  line-height: 24px;
}

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

#ez-toc-container li,
.telling li{
  font-size: 14px;
  line-height: 16px;
  padding-left: 23px;
  position: relative;
}
.ez-toc-heading-level-3,
.telling span{
  font-size: 14px;
  line-height: 2;
  position: relative;
  display: block;
  padding-left: 50px;
}

.ez-toc-heading-level-3::before,
.telling span::before{
  content: '';
  border: 0px;
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  position: absolute;
  top: 4px;
  left: 0;
  width: 10px;
  height: 8px;
  border-top: solid 1px #1F2121; 
  border-right: solid 1px #1F2121;  
}
.ez-toc-heading-level-3::before{
  margin-left: 5px;
}
.ez-toc-list li.ez-toc-heading-level-2::before,
.telling li.number::before{
  position: absolute;
  left: 0;
  width: 2em;
  line-height: 18px;
  top:2px;
  color: #B49A2E;
  font-family: stencil-creek, sans-serif;
  font-size: 16px;
  
}
.ez-toc-list li:before{}
.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'; }

#ez-toc-container li {}

.article_h3_dashed,
h2.article_h2 {
  font-size: 18px;
  text-align: left;
  border-bottom: 1px solid #1F2121;
  position:relative;
}
h2.article_h2 span{
  z-index: 10;
  position: relative;
  display:block;
  font-weight: 500;
}
.articles h2::before {
  position: absolute;
  left: -32px;
  height: 80px;
  font-size: 80px;
  top: -12px;
  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"; }

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

.articles ul{
  margin: 20px auto 12px;
}
.articles ul.dot {
  width: 100%;
  margin: 1em auto;
}
.articles ul li{
  margin-top: 16px;
}
.articles ul.dot li{
  position: relative;
  padding-left: 15px;
  line-height: 22.5px;
}

.articles ul.dot li:before {
  content: "";
  position: absolute;
  top: 0.5em;
  left: 0;
  width: 6px;
  height: 6px;
  background-color: #1F2121;
  border-radius: 50%;
}

.articles ul.checked li{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 20px;
  gap: 8px;
  line-height: 22.5px;
  margin-bottom: 8px;
/*  display: inline-block;*/
}
.articles ul.checked li:before {
  content: "";
  position: absolute;
  top: 0.5em;
  left: 0;
  -webkit-transform: rotate(50deg);
  -ms-transform: rotate(50deg);
  transform: rotate(50deg);
  width: 5px;
  height: 10px;
  border-right: 1px solid #1F2121;
  border-bottom: 1px solid #1F2121;
  font-weight: 500;
  margin-left: 4px;
}
.articles ol.number{
  margin: 1em auto;
}
.articles ol.number li{
  list-style: decimal;
  margin-left: 1em;
  line-height: 22.5px;
  margin-bottom: 8px;
  padding-left: 8px;
}
.articles P.text_sub{
  background: #F6F5EE;
  margin: 1em auto;
  padding: 1em;
  font-size: 0.8em;
}
.area_main .card_omote {
  width: 200px;
  height: 337px;
  position: relative;
  margin: 0 auto;
  z-index:1;
} 
.area_main .card_omote::before{
  opacity: 0;
  background-color:#F6F5EE;
  content: "";
  width: 80px;
  height: 80px;
  border-radius:50px;
  top:-30px;
  right:-30px;
  position: absolute;
  z-index:-1;
}
.area_main .card_omote.is-show::before {
  opacity: 1;
  transition: all 1s ease-out;
}

.area_main .left_block .card_omote::before{
  opacity: 0;
  background-color:#F6F5EE;
  content: "";
  width: 80px;
  height: 80px;
  border-radius:50px;
  top:-30px;
  left:-30px;
  position: absolute;
  z-index:-1;
}

.area_main P.name_card{
  font-size: 18px;
  text-align: center;
}
.area_main .tarot1_card1 {
  margin: 20px auto;
}
/*.c_keyword2 ,
.c_keyword {
  margin: 28px auto 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.c_keyword:before, .c_keyword:after {
  border-top: 1px solid;
  content: "";
  width: 1em;
}
.c_keyword:before {
  margin-right: 1em;
}
.c_keyword:after {
  margin-left: 1em; 
}

.c_keyword2:after {
  content: "";
  margin-right: 1em;
  background: url("./../image/tarot/keyword_right.svg") no-repeat scroll center right/9px 24px;
  width: 24px;
  height: 24px;
}
.c_keyword2:before{
  content: "";
  margin-left: 1em; 
  background: url("./../image/tarot/keyword_left.svg") no-repeat scroll center left/9px 24px;
  width: 24px;
  height: 24px;
}
.c_keyword2 {
  font-size: 1.1em;
}
.c_keyword span{font-size: 0.9em;}
.c_keyword_advice{
  background: #F6F5EE;
  padding: 1px 20px 20px;
  margin: 1em auto 0;
}
.c_keyword_advice .c_keyword_txt{
  font-size: 14px;
  line-height: 170%;
}
P.c_keyword3  {
  position: relative;
  display: inline-block;
  text-align: center;
  width: 100%;
}
P.c_keyword3::after {
  position: absolute;
  content: '';
  background: url("./../image/common/line.svg") no-repeat scroll center center/80px 5px;
  width: 100%;
  height: 5px;
  bottom: -12px;
  left: 0;
}
*/

.block_S.rec{
  width: 284px;
  margin: 0 auto 1em;
}
.topic_img {
  margin: 20px auto;
}
.more_tarot .block_S.rec,
.telling .block_S.rec {
  width: 300px;
}
@media screen and (max-width: 599px){
  .more_tarot .block_S.rec,
  .telling .block_S.rec {
    width: auto;
    max-width: 335px;
    margin: 0 auto;
  }
}


.article.motif .left P{
  width: 260px;
  height: 233px;
  background:#000;
}

.text_list{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px;
  gap: 20px;
}
.article_h3.sub  {
  margin: 1em auto 28px;
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: 16px;
}

.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_h3_dashed,
.article.interpretation h4 {
  border-bottom: 1px dashed #1F2121;
  line-height: 2em;
  font-weight: 500;
  font-size: 16px;
}
.i_ct_keywords {
  margin: 0.8em auto;
}
.i_ct_keywords span{
  font-size: 14px;
  display: inline-block;
  border: 1px solid #000;
  border-radius: 30px;
  padding: 0px 10px;
  margin-right: 1em;
}
.article.advice{
  margin: 3em auto 0;
  position:relative;
}

.about_author.moon {
  background:#F2F5F5;
}
.about_author {
  display: grid;
  grid-template-areas: 
              "a  b"
              "c  c"
              "d  d";
  column-gap: 20px;
  row-gap: 12px;
  
  width: 540px;
  margin: 2em auto 0;
  background-color: #F6F5EE;
  padding: 20px;
  grid-template-columns: 80px 4fr;
}
.about_author.sun {
  display: grid;
  grid-template-areas: 
              "a  b"
              "c  c"
              "d  d";
}
@media screen and (min-width: 600px) {
  .see_all_outer{position: relative;left: 191px;}
}
@media screen and (max-width: 599px) {
  .see_all_outer{position: relative;left: 90px;}
}
.about_author.sun .sns_icons{display:none;}
.about_author.sun P.author_prof {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    position: relative;
}
.text_mos {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    content: '';
    width: 100%;
    height: 50%;
    background: linear-gradient(rgba(246,245,238, 0) 0, rgba(246,245,238, 0.8) 80%);
}

.see_all_shadow:hover{
  cursor: pointer;
}
.see_all_shadow{
  border: 1px solid #1F2121;
  border-radius: 16px;
  font-size: 13px;
  width: 118px;
  margin: 0 auto ;
  text-align: center;
  padding: 3px;
}
.about_author P.author_img{
  grid-area: a;
  width:80px;
  margin: 0 auto;
}
.about_author P.author_img img{
  border-radius:50px
}
.about_author P.author_name{
  grid-area: b;
  width: 100%;
}
.about_author P.author_prof{
  grid-area: c;
  width: 100%;
}

/*.about_author P.author_prof::after {
  background: linear-gradient(rgba(246, 245, 238, 0) 0, rgba(246, 245, 238, 0.8) 80%);
}*/

.about_author.moon P.author_prof::after {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
  content: '';
  width: 100%;
  height: 50%;
  background: linear-gradient(rgba(242, 245, 245, 0) 0, rgba(242, 245, 245, 0.8) 80%);
}
.about_author P.author_prof{
  text-align: justify;
}
.about_author.moon P.author_prof{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  position: relative;
}
.about_author .sns_icons{
  grid-area: d;
  width: 100%;
  display: flex;
  gap: 10px;
  justify-content: start;
}
.about_author.moon a.to_moon{
  grid-area: d;
  margin: 0 auto;
  display: flex;
  gap: 20px;
  justify-content: start;
  display: block;
  text-align: center;
  border: 1px solid #1F2121;
  padding: 3px;
  border-radius: 16px;
  width: 118px;
  font-size: 13px;
}

.about_author .sns_icons a li {
  width: 100%;
  height: 100%;
  display: block;
  color: #BAB6AA;
}
.about_author .sns_icons li.none{
  background: #fff;
  padding: 6px 10px;
  border-radius: 13px;
  font-size: 11px;
}
.about_author .sns_icons li.instagram{
  background: url(./../image/common/sns/prof_btn_instagram.svg) no-repeat scroll top left/24px 24px;
  width: 24px;
  height: 24px;
}
.about_author .sns_icons li.twitter{
  background: url(./../image/common/sns/prof_btn_twitter.svg) no-repeat scroll top left/24px 24px;
  width: 24px;
  height: 24px;
}
.about_author .sns_icons li.blog{
  background: url(./../image/common/sns/prof_btn_blog.svg) no-repeat scroll top left/43px 24px;
  width: 43px;
  height: 24px;
}
.area_main.n3 .sub_title {
  margin: 2em auto 1em;
}
.article.interpretation .i_card_img.pos_re{
  transform: rotate(180deg);
}
.i_card_txt.tarot{
  text-align: justify;
}
.i_card_img.tarot P.icon_enlarge{
  background: url("./../image/teso/icon_enlarge2.svg") no-repeat scroll center center/20px 21px;
}

@media screen and (max-width: 599px) {
  .i_card_img.tarot P.icon_enlarge{
    top: 140px;
    left: 79px;
  }
  .i_card_img.tarot{
    width: 90px;
    float: left;
    height: auto;
    margin-right: 20px;
  }
  .i_card_txt.tarot,
  .four_divisions P{
    font-size:14px;
    line-height:24px;
  }
  

  .four_divisions{
    display: grid;
    grid-template-columns: repeat(2, 167.5px);
    text-align: justify;
  }
  .four_divisions .left_top_inner{
    padding: 0 20px 20px 0;
  }
  .four_divisions .right_top_inner{
    padding: 0 0 20px 20px;
  }
  .four_divisions .left_bottom_inner{
    padding: 20px 20px 0 0;
  }
  .four_divisions .right_bottom_inner{
    padding: 20px 0 0 20px;
  }

}
@media screen and (min-width: 600px) {
  .i_card_img.tarot P.icon_enlarge{
    top: 242px;
    left: 140px;
  }
  .i_card_img.tarot{
    width: 150px;
    float: left;
    height: auto;
    margin-right: 28px;
  }
  .four_divisions{
    display: grid;
    grid-template-columns: repeat(2, 270px);
    text-align: justify;
  }
  .four_divisions .left_top_inner{
    padding: 0 28px 28px 0;
  }
  .four_divisions .right_top_inner{
    padding: 0 0 28px 28px;
  }
  .four_divisions .left_bottom_inner{
    padding: 28px 28px 0 0;
  }
  .four_divisions .right_bottom_inner{
    padding: 28px 0 0 28px;
  }
}
.four_divisions .left_top,
.four_divisions .left_bottom{
  border-right: 1px dashed #1F2121;
}
.four_divisions .left_top,
.four_divisions .right_top{
  border-bottom: 1px dashed #1F2121;
}

.article_date{
  display: block;
  margin: 8px auto 40px;
  color: #908E87;
  font-size: 14px;
}
.article h5{
  text-align: center;
  font-weight: bold;
  margin: 1em auto;
  font-size: 15px;
}
.topic_img_mini{
  width: 128px;
  height: 128px;
  margin: 0 auto;
}
.i_ct_keywords.left_right{
  display: grid;
  grid-template-columns: 60px auto;
  grid-template-areas: "a b";
  gap: 0 10px;
}
.i_ct_keywords.left_right span{
  grid-area: a;
  width: 62px;
  text-align: center;
  height: 24px;
}
.i_ct_keywords.left_right p{
  grid-area: b;
  width: 100%;
}

@media screen and (max-width: 599px) {
  .article_date{
    width: 90%;
  }
  .article_h3_dashed{
    width: 90%;
    margin: 0 auto;
  }
  .area_main {
    width:90%;
    margin: 30px auto 30px;
  }
  .article .caption ,
  .article.interpretation ,
  .article.interpretation h3,
  .articles .article,
  article_h3_dashed,
  h2.article_h2 ,
  .telling,
  #ez-toc-container,
  #for_more_detail span ,
  #for_more_detail{
    width: calc(100% - 40px);
    margin: 0 auto;
    line-height: 170%;
  }
  article_h3_dashed,
  h2.article_h2 {
    margin: 3em auto 1em;
  }
  .article.motif .left P{
    width:340px;
  }
  .article.motif .right P {
    width: 100%;
  }
  .article.interpretation.mini {
    grid-template-columns: 70px auto;
    column-gap: 20px;
    row-gap: 0;
  }
  .article.up_bottom_layout .i_card_img{
    width: 120px;
    height: 200px;
    margin: 0 auto;  
  }
  .article.interpretation {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-template-areas: 
                "a  a"
                "b  c"
                "d  d"
                "e  e";
    column-gap: 20px;
    row-gap: 20px;
    margin: 2em auto 0;
  }

  .article.interpretation.w380 {
    grid-template-areas: 
                "a  a"
                "b  c";
  }

  .article.interpretation h3{
    grid-area: a;
    width: 100%;
    margin: 0 auto;
  }
  .article.interpretation .i_card_img{
    grid-area: b;
    width: 120px;
    height: 202px;
  }
  .article.interpretation .i_card_img.mini{
    width: 70px;
    height: 70px;
  }
  .article.interpretation .i_card_img img{
    width: 100%;
    height: auto;
  }

  .article.interpretation .i_card_txt:nth-of-type(2){
    grid-area: c;
    width: 100%;
  }
  .article.interpretation .i_card_txt:nth-of-type(3){
    grid-area: d;
    width: 100%;
    font-size: 15px;
    text-align: justify;
  }
  #for_more_detail span{
    margin: 2em auto 0;
  }
  #ez-toc-container,
  .telling {
    padding: 20px;
  }
  .area_main.n1{
    min-height: 590px;
  }
  .tarot1_card1 .card_ura img{
    width: 200px;
    height: 337px;
  }
  .area_main  [class^="card_"] {
/*    width: 121px;
    height: 200px;*/
    margin: 0 auto;
  }
  .circle_free {
    left: calc(50% - 27px);
  }
  h2#main {
    width: 90%;
  }
  .area_main .tarot1_card1 {
    width: 200px;
    height: 337px;
  }
  .about_author {
    width: 90%;
  }
/*  h1#for_more_detail{
    margin:3em auto 1em;
    padding:0;
  }
  */
  .area_main.n3  [class^="card_"] ,
  .area_main.n3  [class^="card_"] img {
    width: 85px;
    height: 140px;
    position: relative;
  }

  .tarot3_box ,
  .area_main.n3 .tarot3_inner {
    width: 295px;
    margin: 0 auto;
  }
  .area_main.n3{
    min-height: 400px;
  }
  .tarot3_box .goto.first, .tarot3_box .goto.second {
    position: static;
    margin: 1em auto 0;
  }
  .area_main.n3 .tarot3_inner {
    height: 200px;
  }
  .tarot3_result_inner .rec__card{
    padding: 0 10px;
  }
  .tarot3_inner [class*="_block"]{
    height: 195px;
  }

}

.tarot3_result_inner{
  display: grid;
  grid-template-areas: 
              "a  b";
  column-gap: 20px;
  row-gap: 20px;
  margin: 2em auto 0;
}
.tarot3_result_inner .rec__card{
  grid-area: a;
}
.tarot3_result_inner .rec__txt{
  grid-area: b;
}
.tarot3_result_inner .c_keyword_txt span{
  font-size: 1.1em;
  margin: 1em auto 0;
  display: flex;
  justify-content: start;
  align-items: center;
}
.tarot3_result_inner .c_keyword_txt span::after {
  border-top: 1px solid;
  content: "";
  width: 1em;
  margin-left: 0.3em;
}
.article.interpretation.mini img{
  width:70px;
  height:70px;
}
.topic_img.img_334{
  width:334px;
  height:334px;
  margin: 2em auto;
}
.topic_img.img_334 img{
  width:100% !important;
  height:auto !important;
}
@media screen and (min-width: 600px) {
  .article_date{
    width: 540px;
  }

  P.caption,
  .article_h3_dashed{
    width: 540px;
    margin: 0 auto;
  }

  .tarot3_inner [class*="_block"]{
    height: 245px;
  }
  .area_main  [class^="card_"] {
    width: 200px;
    height: 337px;
    margin: 0 auto;
  }
  .tarot3_box ,
  .area_main.n3 .tarot3_inner {
    width: 392px;
    margin: 0 auto;
  }
  .area_main.n3{
    min-height: 450px;
  }
  .tarot3_box .goto.first, .tarot3_box .goto.second {
    position: static;
    margin-top: 30px;
  }
  .area_main.n3 .tarot3_inner {
    height: 245px;
  }
  .area_main.n3  [class^="card_"] ,
  .area_main.n3  [class^="card_"] img{
    width: 118px;
    height: 193px;
    position: relative;
  }
  .area_main {
    width:540px;
    margin: 60px auto 30px;
    min-height: 570px;

  }
  .article.up_bottom_layout ,
  .article.up_bottom_layout h3,
  .article.interpretation ,
  .article.interpretation h3,
  .articles .article,
  .article_ttl_h1,
  .topic_img ,
  P.text_main ,
  h2.article_h2 ,
  #ez-toc-container,
  .telling,
  #for_more_detail span ,
  #for_more_detail{
    width: 540px;
    margin: 0 auto;
  }
  .article.motif .right P{
    width: 280px;
    padding-left: 10px;
  }
  #for_more_detail span, #for_more_detail {
    margin: 2em auto 0;
  }
  .article.motif {
    display:flex;
  }
  .article.up_bottom_layout.mini ,
  .article.interpretation.mini {
    grid-template-columns: 70px auto;
    column-gap: 28px;
  }
  .article.up_bottom_layout{
    display: grid;
    grid-template-areas: 
                "a" "b";
  }
  .article.up_bottom_layout h4{
    width:100%;
  }
  .article.interpretation {
    display: grid;
    grid-template-areas: 
                "a  a"
                "b  c"
                "b  d";
    column-gap: 20px;
    row-gap: 10px;
    margin: 1em auto 0;
  }
  .article.up_bottom_layout h3,
  .article.interpretation h3{
    grid-area: a;
    margin: 0 auto;
  }
  .article.interpretation .i_card_img{
    grid-area: b;
    width: 200px;
    height: 337px;
  }
  .article.up_bottom_layout .i_card_img{
    width: 200px;
    height: 300px;
    margin:0 auto;
  }
  .article.interpretation.w380 .i_card_img{
    width: 120px;
    height: 202px;
    margin:0 auto;
  }
 
  .article.up_bottom_layout .i_card_img.mini,
  .article.interpretation .i_card_img.mini{
    width: 70px;
    height: 70px;
  }

  .article.up_bottom_layout.mini .i_card_txt:nth-of-type(2),
  .article.interpretation.mini .i_card_txt:nth-of-type(2){
    width: 100%;
  }
  .article.up_bottom_layout  .i_card_txt:nth-of-type(2),
  .article.interpretation .i_card_txt:nth-of-type(2){
    grid-area: c;
    width: 312px;
  }
  .article.interpretation.w380 .i_card_txt:nth-of-type(2){
    grid-area: c;
    width: 380px;
  }

  .article.up_bottom_layout .i_card_txt:nth-of-type(3),
  .article.interpretation .i_card_txt:nth-of-type(3){
    grid-area: d;
    width: 312px;
  }
  #ez-toc-container,
  .telling{
    padding: 24px 40px 32px;
  }
  .topic_img{
    margin: 1em auto;
  }
  .articles h2{
    margin: 4em auto 1em;
  }
  .article.advice {
    margin: 3em auto 0;
  }
  .circle_free {
    left: 245px;
  }
  h2#main {
    width: 540px;
  }
  .about_author {
    width: 540px;
  }
  .tarot3_result_inner .rec__card{
    padding: 0 20px;
  }
}
.area_main .tarot1_card1 {
  width: 200px;
  height: 337px;
}
/**  ^   b g2       **/
.area_main.n2 {
  min-height: 430px;
}
.area_main .tarot2_card {
  width: 270px;
  height: 200px;
  display: grid;
  grid-template-areas: 
              "a  b";
  row-gap: 20px;
  margin: 2em auto;
  justify-items: center;
}
.tarot2_box .tarot2_inner [class^="card_"] {
  width: 121px;
  height: 200px;
}
.tarot2_inner {
  width: 100%;
  height: 200px;
}
.tarot2_box {
  margin: 0 auto;
  height: 200px;

}
.tarot2_box.result{
  height: 350px;
  margin: 30px auto 0;
}
.tarot2_box.result .tarot2_inner{
  height: 285px;
  margin: 30px auto 0;
}
.tarot2_box .goto.first, .tarot2_box .goto.second {
  top: 215px;
}
.goto.first a{
  color:#fff;
}
.rec_card {
  margin: 0.5em auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1em;
}
.rec_card b{
  font-size: 1.4em;
}
.rec_card:before{
  content: "";
  margin-left: 1em; 
  background: url("./../image/tarot/point_choice.svg") no-repeat scroll top left/14px 16px;
  width: 18px;
  height: 30px;
}
.area_main .rec__card{
  transform-origin: center bottom 0px;
  transform: scale(1.1) rotate(0.1deg);
  transition: transform 1s ease 0s;
}
.area_main.n2 .txt_card{
  font-size: 0.7em;
  text-align: center;
  margin: 1em auto;
  z-index: 2;
  position: relative;
}
.rec_card_icon{
  background: #fff;
  color: #000;
  width: 30px;
  height: 30px;
  line-height: 30px;
  display: block;
  font-size: 1em;
  border-radius: 50px;
  border: 1px solid #000;
  text-align:center;
}
.rec__card .rec_card_icon,
.rec___card .rec_card_icon{
  background: #000;
  color: #fff;
}
.rec_card_top{
  width: 30px;
  margin: 0 auto;
}

.tarot2_box2 .left_block,
.tarot2_box2 .right_block{
  width:50%;
  padding: 20px;
}
.tarot2_box2 .rec___card {
  background: #F6F5EE;
}
.area_main.n3 span.status{
  background: #F6F5EE;
  width: 50px;
  height: 50px;
  display: block;
  font-size: 0.9em;
  line-height: 50px;
  text-align: center;
  border-radius: 50px;
  left: calc( 50% - 25px);
  top: 10px;
  position: relative;
}
.join_us {
  display: block;
  text-align: center;
  text-decoration: underline;
}
.goto.login{
  background-color: #fff;
  border: 1px solid #000;
  font-size: 1.1em;
  line-height: 30px;
  height: 30px;
  width: 120px;
}

h2.article_h2 {  
  margin: 80px auto 28px; 
  padding-bottom:4px;
}

/* 20220801 tuika */

@media only screen and (min-width: 600px){
    .articles h2::before{
        top: -60px;      
    }
    }

.topic_img_mini {
    width: 128px;
    height: 88px;
    margin: 0 auto;
}

.mercury_girl_img{
  height: 128px;
  animation:8s linear infinite rotation1;
}

@keyframes rotation1{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}

.block_S .mini_summary {
  /*    display: inline-flex;*/
      align-items: center;
  }
  .more_tarot .block_S.rec,
  .telling .block_S.rec {
    width: 300px;
  }
  @media screen and (max-width: 599px){
    .more_tarot .block_S.rec,
    .telling .block_S.rec {
      width: auto;
      max-width: 335px;
      margin: 0 auto;
    }
  }
  .more_tarot .block_S .mini_summary,
  .telling .block_S .mini_summary {
    display: inline-flex;
  }
  .more_tarot .block_S .mini_summary h4 {
    padding-right: 0;
  }
  
table.zukan_table{
  width:100%;
}
table.zukan_table th,table.zukan_table td {
  padding: 4px 8px;
  border:  1px solid #1F2121;
  width: 50%;
  text-align: left;
  height: auto;
  font-weight: 400;
  color: #1F2121;
}
@media screen and (min-width: 600px){
  #tarot_card_list .list_area{
    width: calc(100% - 248px);
  }
}
@media screen and (max-width: 599px){
  #tarot_card_list p.sub_title,
  h3.sub_title{
    width: calc(100% - 80px);
    margin:20px auto;
  }
  #tarot_card_list .block_SS img{
    width: 100px;
    height: 76px;
    border-radius: 8px;
  }
  #tarot_card_list{
    margin: 80px auto 60px;
  }
  #tarot_card_list .list_area{
    width: calc(100% - 40px);
  }
}
#tarot_card_list .block_SS img{
  width: 100px;
  height: 76px;
  border-radius: 8px;
  border: 1px solid #EAE9E2;
}
#tarot_card_list{
  margin: 80px auto 30px;
}
#tarot_card_list .list_area{
  display: grid;
  grid-template-columns: repeat(auto-fill,100px);
  grid-gap: 20px 17px;
  justify-content: flex-start;
/*  padding-top: 20px;*/
  margin: 0 auto;
}

.four_divisions .single_kakko span{
  display: inline-block;
  padding: 0 6px;
}
.four_divisions P.circle_silver ,
.four_divisions P.circle_gold {
  z-index: 1;
  position: relative;
  display: inline-block;
}
.four_divisions P.circle_silver::before ,
.four_divisions P.circle_gold::before {
  position: absolute;
  content: '';
  width: 14px;
  height: 14px;
  border-radius: 50px;
  top: 2px;
  left: -5px;
  z-index: -1;
}
.four_divisions P.circle_gold::before {
  background: #EEE4BA;
}
.four_divisions P.circle_silver::before {
  background: #DAE2E2;
}
.four_divisions .single_kakko{
  display: inline-block;
  padding: 0 6px;
}

.scroll_table td{
  height:30px;
  color:#1F2121;
}
.scroll_table .table_midashi1 td:nth-child(1)::before,
.scroll_table .table_midashi2 td:nth-child(1)::before,
.scroll_table .table_summary td:nth-child(1)::before{
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-right: 1px solid #1F2121;
  border-left: 1px solid #1F2121;
}

.scroll_table .table_midashi1 td:nth-child(1),
.scroll_table .table_midashi2 td:nth-child(1){
  background: #F2F2F2;
  position: sticky;
  left: 0;
  height: 100%;
}
.scroll_table .table_summary td:nth-child(1){
  position: sticky;
  left: 0;
  height: 100%;
}
.scroll_table .table_midashi1 td:nth-child(2){background:#F8DADA;}
.scroll_table .table_midashi1 td:nth-child(3){background:#CFEDE2;}
.scroll_table .table_midashi1 td:nth-child(4){background:#DCE7C8;}
.scroll_table .table_midashi1 td:nth-child(5){background:#F4D6CA;}

.scroll_table .table_midashi2 td:nth-child(2n){
  background:#EEE4BA;
  border-right: 1px dashed #1F2121;
}
.scroll_table .table_summary td:nth-child(2n){
  border-right: 1px dashed #1F2121;
  background: #F6F5EE;
}
.scroll_table .table_summary td:nth-child(2n+3){
  background: #F2F5F5;
}
.scroll_table .table_midashi2 td:nth-child(2n+3){
  background:#DAE2E2;
}
.scroll_table .table_midashi1{
  font-size:14px;
  text-align:center;
  width:228px;
  line-height:22px;
}
.scroll_table .table_midashi2 td{
  width:114px;
}
.scroll_table .table_midashi2{
  font-weifht:500;
  font-size:14px;
  text-align:center;
}
.scroll_table .table_summary{
  font-size:14px;
  text-align:justify;
  line-height:19px;
  background:#F6F5EE;
}
.scroll_table td:nth-child(1){
  width:88px;
  background: #FFFFFF;
  text-align:center;
  border-right: 1px solid #1F2121;
}
.scroll_table .table_summary td:nth-child(n+2){
  vertical-align: top;
  padding:8px;
}
@media screen and (min-width: 600px) {
  .table_scroll{
    width: 540px;
    margin: 0 auto;
  }
  .tarot_table2{
    width: 540px;
    margin: 0 auto;
    -ms-writing-mode : tb-lr;
    writing-mode : vertical-lr;
    word-wrap: break-word;
    table-layout: fixed;
  }
  .tarot_table2 .table_summary1 td:nth-child(1) ,
  .tarot_table2 .table_summary2 td:nth-child(1) ,
  .tarot_table2 .table_summary3 td:nth-child(1) ,
  .tarot_table2 .table_summary4 td:nth-child(1) {
    width: 114px;
    text-align: center;
  }
  .tarot_table2 [class^="table_summary"] td:nth-child(n+2) P{
    width: 98px;
  }

  .tarot_table2 td ,.tarot_table2 th {
    -ms-writing-mode : lr-tb;
    writing-mode : horizontal-tb;
    white-space : pre-wrap;
    word-wrap: break-word;
  }
/*  .tarot_table2 td p,.tarot_table2 th p{
    white-space : normal;
    word-wrap: break-word;
    width: 98px;
  }
  */
  .tarot_table2 .table_midashi3 td,
  .tarot_table2 .table_midashi3 td P{
    width: 88px;
  }
}

@media screen and (max-width: 599px) {
  .table_scroll{
    margin-left: 20px;
    margin-right: 20px;
  }
  .tarot_table2{
    width: 335px;
  }
  .tarot_table2 td:nth-child(1) {
    width: 88px;
    text-align: center;
  }
}

.arrow_link_v3{
  width:295px;
  margin:0 auto;
}
.arrow_link_v2_over{
  width:260px;
  margin:0 auto;
}
.arrow_link_v2_over a{
  display: block;
  position: relative;
  font-weight: 700;
  font-size: 13px;
}
.arrow_link_v2_over span{
  line-height: 20px;
  vertical-align: top;
}
.arrow_link_v3 a{
  display: block;
  border-bottom: 1px solid #E6E6E6;
  padding-bottom: 10px;
  position: relative;
  font-weight: 700;
  font-size: 13px;
}
.arrow_link_v2:nth-child(1){
  float:left;
  max-width: 130px;
}
.arrow_link_v2:nth-child(2){
  float:right;
  padding-right: 24px;
  max-width: 130px;
}
.circle_up_arrow_icon{
  background: url("./../image/tarot/up_arrow.svg") no-repeat scroll center center/100% auto;
  width: 20px;
  height: 20px;
  margin-left: 4px;
  display: inline-block;
  vertical-align: bottom;
}
.circle_down_arrow_icon{
  background: url("./../image/tarot/up_arrow.svg") no-repeat scroll center center/100% auto;
  transform: rotate(180deg);
  width: 20px;
  height: 20px;
  margin-left: 4px;
  display: inline-block;
  vertical-align: bottom;
}

.arrow_link_v2 a .up_arrow:after,
.arrow_link_v3 a .up_arrow:after{
  content:'';
  background: url("./../image/tarot/up_arrow.svg") no-repeat scroll center center/100% auto;
  width: 20px;
  height: 20px;
  position:absolute;
  cursor: pointer;
  right: 0;
}
.arrow_link_v2 a .down_arrow:after,
.arrow_link_v3 a .down_arrow:after{
  content:'';
  background: url("./../image/tarot/up_arrow.svg") no-repeat scroll center center/100% auto;
  transform: rotate(180deg);
  width: 20px;
  height: 20px;
  position:absolute;
  cursor: pointer;
  right: 0;
}
.arrow_link_v2 a .up_arrow:after,
.arrow_link_v2 a .down_arrow:after{
  right: -24px;
}

.tarot_table2 [class^="table_summary"] td:nth-child(n+2) {
  vertical-align: top;
  padding: 8px;
}
.tarot_table2 .table_midashi3 {
  font-size: 14px;
  text-align: center;
}
.tarot_table2 td {
  height: 30px;
  color: #1F2121;
}
.tarot_table2 [class^="table_summary"] {
  font-size: 14px;
  text-align: justify;
  line-height: 19px;
  background: #F6F5EE;
}
.tarot_table2 [class^="table_summary"] td:nth-child(2n) {
  background: #F6F5EE;
}
.tarot_table2 [class^="table_summary"] td:nth-child(2n+3) {
    background: #F2F5F5;
}
.tarot_table2 .table_midashi3 td:nth-child(1) {
  background: #F2F2F2;
}
.tarot_table2 .table_midashi3 td:nth-child(2) {
  background: #EEE4BA;
}
.tarot_table2 .table_midashi3 td:nth-child(3) {
  background: #DAE2E2;
}
.tarot_table2 .table_summary1 td:nth-child(1) {
  background: #F8DADA;
}
.tarot_table2 .table_summary2 td:nth-child(1) {
  background: #CFEDE2;
}
.tarot_table2 .table_summary3 td:nth-child(1) {
  background: #DCE7C8;
}
.tarot_table2 .table_summary4 td:nth-child(1) {
  background: #F4D6CA;
}


.table_scroll{
  position:relative;
  border-collapse:separate;
  border-spacing:0;
}
.point_scroll{
  background: url("./../image/tarot/point_scroll.png") no-repeat scroll center center/100% auto;
  width: 114px;
  height: 117px;
  top:150px;
  left:calc(50% - 57px);
  position:absolute;
  cursor: pointer;
}
