@charset "UTF-8";
/* =======================================================================
  Date: 2021-2-3
  CSS Document ： タロット占い 共通パーツ（PC）
  1.
  ======================================================================= */
/* -----------------------------------------------------------------------
## リセット ##################################################
----------------------------------------------------------------------- */
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) body, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) h1, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) h2, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) h3, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) h4, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) h5, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) h6,
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) div, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) p, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) pre, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) ul, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) ol, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) dl, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) dt, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) dd,
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) address, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) form, :where(.contents_fc, #sp-foot-cts, #ff-foot-cts) blockquote {
  margin: 0;
  padding: 0;
  text-align: left;
  display: block;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) table {
  margin: 0;
  empty-cells: show;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 100%;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) table thead th {
  text-align: center;
  vertical-align: middle;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) table tbody th,
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) table tbody td {
  padding: 0px;
  margin: 0px;
  text-align: left;
  vertical-align: top;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) hr {
  display: none;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) img {
  border: none;
  vertical-align: bottom;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) li {
  list-style: none;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) option {
  padding-right: 10px;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) a {
  text-decoration: none;
  outline: none;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) a img {
  border: 0px;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) object {
  /*Objectタグをクリッカブルにする*/
  pointer-events: none;
}
:where(.contents_fc, #sp-foot-cts, #ff-foot-cts) select {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* -----------------------------------------------------------------------
## ヘッダー・フッターなど調整 ##################################################
----------------------------------------------------------------------- */
body {
  min-width: 960px;
}

body.is-fixed_fc {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  overflow: hidden;
}

.clearfix:after {
  display: block;
  clear: both;
  content: "";
}

.cmn-sp_show_fc {
  display: none;
}

.cmn-pc_show_fc {
  display: inline;
}

.cmn-marker_fc {
  padding: 4px 0;
  background: #fff793;
}

[data-device=sp] {
  display: none !important;
}

/* ################# パンくず ################# */
.plist_wrap {
  line-height: 1;
  _line-height: 1.1;
  margin: 0 auto;
  padding: 0 0.9375rem;
}

#plist {
  max-width: 1170px;
  margin: auto;
  padding: 20px 0;
  line-height: 1;
  vertical-align: middle;
}
#plist li {
  float: left;
  font-size: 0.75rem;
}
#plist a {
  color: #444;
  text-decoration: none;
}
#plist a:hover {
  text-decoration: underline;
}

/* ################# コンテンツベース ################# */
.contents_fc {
  padding-bottom: 65px;
  background: #fff;
  text-align: left;
  color: #222;
  font-family: "游ゴシック", "Yu Gothic", "YuGothic", "ヒラギノ角ゴ Pro W3", "ヒラギノ角ゴ W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic", "メイリオ", "Meiryo", "Noto Sans", "Noto Sans CJK JP", "system-ui", sans-serif;
  -webkit-font-feature-settings: "palt" 0;
          font-feature-settings: "palt" 0;
}

/* ################# ボタン ################# */
.cmn-buttons_fc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.cmn-button_fc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 360px;
  height: 60px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 1000px;
  background: #000;
  -webkit-box-shadow: 1px 2px 6px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 1px 2px 6px 0 rgba(0, 0, 0, 0.1);
  letter-spacing: 0.1em;
  font-size: 1rem;
  font-weight: bold;
  -webkit-transition: all 0.2s 0s ease;
  transition: all 0.2s 0s ease;
}
.cmn-button_fc:link, .cmn-button_fc:visited {
  color: #fff;
}
.cmn-button_fc:hover {
  background-color: #fff;
  color: #222;
  text-decoration: none;
}
.cmn-button_fc.is-finger_fc {
  padding-right: 70px;
  background: #000 url("../images/ico_arrow_white.png") no-repeat right 35px center;
  background-size: 50px auto;
}
.cmn-button_fc.is-finger_fc:hover {
  border: 1px solid #000;
  background-color: #fff;
  background-image: url("../images/ico_arrow_black.png");
  background-size: 50px auto;
}
.cmn-button_fc.is-repeat_fc {
  border: 1px solid #000;
  background: #000 url("../images/ico_repeat_white.png") no-repeat right 27px center;
  background-size: 22px auto;
  color: #fff;
  cursor: pointer;
}
.cmn-button_fc.is-repeat_fc:focus {
  outline: none;
}
.cmn-button_fc.is-repeat_fc:hover {
  background-color: #fff;
  background-image: url("../images/ico_repeat_black.png");
  background-position: right 27px center;
  background-size: 22px auto;
  color: #222;
}
.cmn-button_fc.is-start_fc, .cmn-button_fc.is-stop_fc {
  width: 280px;
  height: 70px;
  padding-right: 55px;
  border: 1px solid #000;
  color: #fff;
  text-transform: uppercase;
  font-family: "Times New Roman", serif;
  font-size: 1.5rem;
  font-weight: normal;
  cursor: pointer;
}
.cmn-button_fc.is-start_fc:focus, .cmn-button_fc.is-stop_fc:focus {
  outline: none;
}
.cmn-button_fc.is-start_fc span, .cmn-button_fc.is-stop_fc span {
  position: relative;
}
.cmn-button_fc.is-start_fc span::after, .cmn-button_fc.is-stop_fc span::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: -55px;
  width: 46px;
  height: 21px;
  margin: auto;
  background: url("../images/ico_arrow_white.png") no-repeat 0 center;
  background-size: 46px auto;
  content: "";
}
.cmn-button_fc.is-start_fc:hover, .cmn-button_fc.is-stop_fc:hover {
  color: #222;
}
.cmn-button_fc.is-start_fc:hover span::after, .cmn-button_fc.is-stop_fc:hover span::after {
  background-image: url("../images/ico_arrow_black.png");
  background-size: 46px auto;
}

.cmn-whiteButton_fc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 360px;
  height: 60px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 1000px;
  background: #fff;
  -webkit-box-shadow: 1px 2px 6px 0 rgba(0, 0, 0, 0.1);
          box-shadow: 1px 2px 6px 0 rgba(0, 0, 0, 0.1);
  letter-spacing: 0.1em;
  font-size: 1rem;
  font-weight: bold;
  -webkit-transition: all 0.2s 0s ease;
  transition: all 0.2s 0s ease;
}
.cmn-whiteButton_fc:hover {
  background: #000;
  color: #fff;
  text-decoration: none;
}
.cmn-whiteButton_fc.is-finger_fc span {
  position: relative;
  padding-right: 60px;
}
.cmn-whiteButton_fc.is-finger_fc span::after {
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 53px;
  height: 22px;
  margin: auto;
  background: url("../images/ico_arrow_black.png") no-repeat 0 0;
  background-size: 100% auto;
  content: "";
}
.cmn-whiteButton_fc.is-finger_fc:hover {
  color: #fff;
  text-decoration: none;
}
.cmn-whiteButton_fc.is-finger_fc:hover span::after {
  background: url("../images/ico_arrow_white.png") no-repeat 0 0;
  background-size: 100% auto;
}
.themesTop_fc .cmn-whiteButton_fc.is-finger_fc, .themesDetail_fc .cmn-whiteButton_fc.is-finger_fc {
  background-position: right 62px center;
}
.themesTop_fc .cmn-whiteButton_fc.is-finger_fc:hover, .themesDetail_fc .cmn-whiteButton_fc.is-finger_fc:hover {
  background-position: right 62px center;
}

.cmn-whiteButton_fc.is-more_fc {
  position: relative;
  width: 320px;
  border: 1px solid #000;
  overflow-anchor: none;
}
.cmn-whiteButton_fc.is-more_fc::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 35px;
  width: 14px;
  height: 9px;
  margin: auto;
  content: "";
  background: url("../images/ico_arrow_down.png") no-repeat 0 0;
  background-size: 14px auto;
}
.cmn-whiteButton_fc.is-more_fc:hover {
  background: #000;
  color: #fff;
}
.cmn-whiteButton_fc.is-more_fc:hover::after {
  background: url("../images/ico_arrow_down_wh.png") no-repeat 0 0;
  background-size: 14px auto;
}
.cmn-whiteButton_fc.is-more_fc.is-show_fc::after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}

/* ################# テーマ一覧タブ ################# */
.tabs-categories_fc {
  border-bottom: 4px solid #000;
}

.tabs-category_fc {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  width: 960px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0 auto;
  padding: 0 20px;
}

.tabs-category_tab_fc {
  -ms-flex-preferred-size: 200px;
      flex-basis: 200px;
  max-width: 200px;
  height: 56px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0 5px;
  padding: 2px 2px 0 2px;
  background: #000;
  border-radius: 5px 5px 0 0;
  -webkit-transition: height 0.2s 0s ease;
  transition: height 0.2s 0s ease;
}
.tabs-category_tab_fc a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 100%;
  background: #fff;
  border-radius: 3px 3px 0 0;
  letter-spacing: 0.1em;
  font-size: 1rem;
}
.tabs-category_tab_fc a:hover {
  text-decoration: none;
}
.tabs-category_tab_fc:hover {
  height: 65px;
}
.tabs-category_tab_fc:hover a {
  background: #000;
  color: #fff;
}
.tabs-category_tab_fc.is-active_fc {
  height: 65px;
}
.tabs-category_tab_fc.is-active_fc a {
  background: #000;
  color: #fff;
  pointer-events: none;
}

/* -----------------------------------------------------------------------
## PICKUP ##################################################
----------------------------------------------------------------------- */
#sp-foot-cts,
div.sns {
  display: none;
}

#ff-foot-cts {
  display: block;
}

#ff-foot-cts {
  font-size: 0.75rem;
  -webkit-font-feature-settings: normal;
          font-feature-settings: normal;
}

#ff-foot-cts #ff-foot-inner {
  text-align: center;
  background: #F5F6F6;
  padding: 0 0 60px;
}

#ff-foot-cts #ff-foot-inner p {
  text-align: center;
}

#ff-foot-cts ul li a {
  display: block;
  color: #3E3A39;
  -webkit-transition: all 130ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
  transition: all 130ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

#ff-foot-cts ul li a:hover {
  text-decoration: none;
  opacity: 0.7;
}

#ff-foot-cts #ff-foot-picup {
  width: 920px;
  margin: 0 auto;
}

#ff-foot-cts #ff-foot-shop {
  width: 920px;
  margin: 0 auto 2em;
}

/****　PICK UP　****/
#ff-foot-cts #ff-foot-picup ul {
  display: -webkit-box;
  display: -ms-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#ff-foot-cts #ff-foot-picup ul li {
  width: 293px;
  background: #FFF;
  padding: 9px;
  border: 1px solid #FFF;
  border-radius: 5px;
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
}

#ff-foot-cts #ff-foot-picup ul li:nth-child(3n) {
  margin-right: 0px;
}

#ff-foot-cts #ff-foot-picup ul li:nth-child(3n+1) {
  clear: both;
}

#ff-foot-cts #ff-foot-picup ul li p {
  margin: 0.5em 0.3em;
  color: #3E3A39;
  text-align: left;
  line-height: 1.4;
  letter-spacing: 1px;
  min-height: 2.7em;
}

#ff-foot-cts #ff-foot-picup p.ff-foot-more {
  clear: both;
  text-align: right;
}

#ff-foot-cts #ff-foot-picup p.ff-foot-more a {
  margin-right: 1px;
}

#ff-foot-cts ul:after {
  content: "";
  display: block;
  clear: both;
}

/****　RECOMMENDED SHOP　****/
#ff-foot-cts #ff-foot-shop ul li {
  width: 450px;
  background: #FFF;
  border: 10px solid #FFF;
  border-radius: 5px;
  float: left;
  margin-right: 20px;
  margin-bottom: 20px;
}

#ff-foot-cts #ff-foot-shop ul li:nth-child(2n) {
  margin-right: 0px;
}

#ff-foot-cts #ff-foot-shop ul li:nth-child(2n+1) {
  clear: both;
}

#ff-foot-cts #ff-foot-shop ul li .ff-foot-logo {
  margin-top: 8px;
  width: 200px;
  float: left;
}

#ff-foot-cts #ff-foot-shop ul li p {
  color: #3E3A39;
  min-height: 2em;
  line-height: 1.4;
  letter-spacing: 1px;
}

#ff-foot-cts .ff-foot-midashi {
  padding: 3em 0 1.5em;
}

#ff-foot-cts .ff-foot-guide {
  text-align: center;
  display: inline-block;
  margin: 0;
}

#ff-foot-cts .ff-foot-guide img {
  display: inline-block;
}

.ff-foot-more a,
a.ff-foot-guide {
  -webkit-transition: all 130ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
  transition: all 130ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

.ff-foot-more a:hover,
a.ff-foot-guide:hover {
  opacity: 0.7;
}