@charset "UTF-8";
.pc {
  display: block; }

.tablet {
  display: none; }

.smp {
  display: none; }

/* ================================================ 
	loding 
==============================================================================================================================================================*/
#loader-bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #fff;
  z-index: 9999999999; }
  #loader-bg #loader {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 500px;
    margin-left: -250px;
    text-align: center;
    color: #fff;
    z-index: 999999999; }

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

/* ================================================ 
	header 
==============================================================================================================================================================*/
header {
  width: 94%;
  padding: 20px 3%;
  position: fixed;
  top: 0;
  background: rgba(255, 255, 255, 0.7);
  z-index: 9999; }
  header.blogHeader {
    position: static;
    padding: 20px 3% 50px; }
  header.under {
    position: relative;
    padding: 20px 3%; }
  header .inner {
    margin: 0 auto;
    max-width: 1120px;
    position: relative;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: center; }
    header .inner .logo {
      width: 20%; }
    header .inner nav {
      margin-left: 5%;
      width: 75%; }
      header .inner nav ul {
        display: flex;
        flex-flow: row wrap;
        justify-content: flex-end;
        align-items: center; }
        header .inner nav ul li {
          margin-left: 30px;
          font-size: 20px;
          line-height: 150%;
          font-weight: bold;
          font-family: "Vollkorn", serif; }
          header .inner nav ul li a {
            color: #000;
            text-decoration: none; }

/* ================================================ 
	sp-nav
==============================================================================================================================================================*/
.spMenu {
  display: none;
  position: absolute;
  width: 100%;
  pointer-events: none;
  left: 0;
  top: 18px;
  z-index: 100000; }
  .spMenu dt {
    pointer-events: auto;
    position: absolute;
    right: 3%;
    top: 0; }
  .spMenu dd {
    pointer-events: auto;
    position: absolute;
    top: 46px;
    width: 100%;
    padding: 0 0 20px;
    background: rgba(0, 0, 0, 0.8);
    text-align: left;
    box-shadow: 0px 7px 3px -3px rgba(150, 150, 150, 0.6); }
    .spMenu dd ul {
      margin-bottom: 20px; }
      .spMenu dd ul li {
        position: relative; }
        .spMenu dd ul li::before {
          content: '';
          width: 6px;
          height: 6px;
          border: 0px;
          border-top: solid 2px #fff;
          border-right: solid 2px #fff;
          -ms-transform: rotate(45deg);
          -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
          position: absolute;
          top: 50%;
          right: 3%;
          margin-top: -4px; }
        .spMenu dd ul li a {
          display: block;
          border-bottom: 1px #fff dashed;
          padding: 15px 3%;
          text-decoration: none;
          color: #fff; }
    .spMenu dd .logoCover {
      text-align: center; }
    .spMenu dd h2 {
      display: inline-block;
      background: #fff;
      padding: 10px;
      text-align: center; }

.menu-trigger,
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
  cursor: pointer; }

.menu-trigger {
  position: relative;
  width: 50px;
  height: 34px;
  right: 3%; }

.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #221815;
  border-radius: 4px; }

.menu-trigger span:nth-of-type(1) {
  top: 0; }

.menu-trigger span:nth-of-type(2) {
  top: 15px; }

.menu-trigger span:nth-of-type(3) {
  bottom: 0; }

.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(17px) rotate(-315deg);
  transform: translateY(17px) rotate(-315deg); }

.menu-trigger.active span:nth-of-type(2) {
  opacity: 0; }

.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-14px) rotate(315deg);
  transform: translateY(-14px) rotate(315deg); }

/* ================================================ 
	mainVisial
==============================================================================================================================================================*/
.mainVisial {
  margin: 0 auto 30px;
  width: 100%;
  background-size: cover; }
  .mainVisial.contact {
    background: url("../img/mani_contact.jpg") no-repeat center center; }
  .mainVisial .inner {
    margin: 0 auto;
    height: 260px;
    width: 94%;
    max-width: 1120px;
    display: flex;
    flex-flow: row nowrap;
    justify-content: flex-start;
    align-items: center; }
  .mainVisial h1 {
    font-size: 26px;
    line-height: 150%;
    color: #fff; }

/* ================================================ 
	トップ　目次 
==============================================================================================================================================================*/
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span {
  background: #fdd903; }

#fp-nav ul li .fp-tooltip.right {
  color: #fdd903; }

/* ================================================ 
	トップ　共通　
==============================================================================================================================================================*/
.categoryTtl {
  margin-bottom: 40px;
  text-align: center;
  font-family: "Vollkorn", serif;
  font-size: 30px;
  line-height: 150%;
  padding-bottom: 5px;
  background: url("../img/bg_line1.png") no-repeat center bottom; }

.threeColumn {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: stretch; }
  .threeColumn .cont {
    width: 32%;
    margin-right: 2%; }
    .threeColumn .cont:last-child {
      margin-right: 0; }

.twoColumn {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: stretch; }
  .twoColumn .cont {
    width: 48%;
    margin-right: 4%; }
    .twoColumn .cont:last-child {
      margin-right: 0; }

.columnimage {
  text-align: center;
  margin-bottom: 15px; }

.columTtl {
  text-align: center;
  margin-bottom: 10px;
  font-size: 18px;
  line-height: 150%; }

/* ================================================ 
	トップ　各セクション背景画像　
==============================================================================================================================================================*/
#mainVisual,
#webBlock,
#otherBlock,
#section3 {
  background-size: cover !important;
  background-attachment: fixed !important; }

#mainVisual {
  width: 100%;
  height: 100vh;
  position: relative; }
  #mainVisual .swiper-container {
    width: 100%;
    height: 100vh; }
    #mainVisual .swiper-container .swiper-wrapper {
      width: 100%;
      height: 100vh; }
      #mainVisual .swiper-container .swiper-wrapper .swiper-slide {
        width: 100%;
        height: 100vh; }
        #mainVisual .swiper-container .swiper-wrapper .swiper-slide.slide01 {
          background: url(../img/main01.jpg) no-repeat center center;
          background-size: cover; }
        #mainVisual .swiper-container .swiper-wrapper .swiper-slide.slide02 {
          background: url(../img/main02.jpg) no-repeat center center;
          background-size: cover; }
        #mainVisual .swiper-container .swiper-wrapper .swiper-slide.slide03 {
          background: url(../img/main03.jpg) no-repeat center center;
          background-size: cover; }
  #mainVisual .main {
    text-align: center;
    margin: 0 auto;
    width: 94%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2000; }

#aboutBlock {
  padding: 100px 0; }
  #aboutBlock .inner {
    margin: 0 auto;
    width: 94%;
    max-width: 1120px; }
    #aboutBlock .inner .aboutCont {
      position: relative;
      padding: 40px 0 0; }
      #aboutBlock .inner .aboutCont .cont {
        position: absolute;
        top: 0;
        left: 0;
        width: 62%;
        box-sizing: border-box;
        padding: 30px;
        background: rgba(255, 255, 255, 0.9);
        border: 1px #999 solid; }
        #aboutBlock .inner .aboutCont .cont h3 {
          margin-bottom: 10px;
          text-align: center;
          letter-spacing: 0.02em;
          font-family: "Vollkorn", serif;
          font-size: 28px;
          line-height: 150%; }
        #aboutBlock .inner .aboutCont .cont p {
          margin-bottom: 1em;
          font-size: 16px;
          line-height: 180%; }
          #aboutBlock .inner .aboutCont .cont p:last-child {
            margin-bottom: 0; }
      #aboutBlock .inner .aboutCont .image {
        text-align: right;
        padding-left: 5px; }

#webBlock {
  background: url(../img/bg02.jpg) no-repeat center center;
  background-size: cover;
  padding: 150px 0; }
  #webBlock .inner {
    margin: 0 auto;
    width: 94%;
    max-width: 1120px;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.8);
    padding: 30px; }
    #webBlock .inner p {
      line-height: 180%; }

#section33333 {
  background: url(../img/bg04.jpg) no-repeat center center;
  background-size: cover; }
  #section33333 .astrologyBlock {
    margin: 3% auto;
    width: 94%;
    max-width: 1120px;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.8);
    padding: 30px; }
    #section33333 .astrologyBlock .readTxt {
      margin-bottom: 20px; }

#otherBlock {
  background: #fff;
  padding: 100px 0 0; }
  #otherBlock .topicsBlock {
    margin: 0 auto 80px;
    width: 94%;
    max-width: 1120px; }
    #otherBlock .topicsBlock .topicsCont {
      border: 10px #333 solid;
      padding: 30px;
      background: #fff; }
      #otherBlock .topicsBlock .topicsCont dl {
        margin-bottom: 10px;
        display: table;
        width: 100%;
        border-collapse: collapse;
        border-bottom: 1px #333 solid; }
        #otherBlock .topicsBlock .topicsCont dl dt {
          display: table-cell;
          vertical-align: top;
          width: 100px;
          padding: 0 10px 10px 0; }
        #otherBlock .topicsBlock .topicsCont dl dd {
          display: table-cell;
          padding: 0 0 10px; }
          #otherBlock .topicsBlock .topicsCont dl dd a {
            color: #333; }
        #otherBlock .topicsBlock .topicsCont dl:last-child {
          margin-bottom: 0; }
    #otherBlock .topicsBlock .submitBtn {
      margin-top: 30px;
      text-align: center; }
      #otherBlock .topicsBlock .submitBtn a {
        cursor: pointer;
        margin: 0 auto;
        display: block;
        text-align: center;
        border-radius: 20px;
        border: 1px #333 solid;
        padding: 10px;
        width: 260px;
        text-decoration: none;
        box-sizing: border-box;
        background: #333;
        color: #fff;
        transition: 0.6s; }
        #otherBlock .topicsBlock .submitBtn a:hover {
          background: #fff;
          color: #333; }
  #otherBlock .blogBlockTop {
    margin: 0 auto 80px;
    max-width: 1120px;
    width: 94%; }
    #otherBlock .blogBlockTop .blogList {
      overflow: hidden;
      width: 100%;
      display: flex;
      flex-flow: row wrap;
      justify-content: flex-start;
      align-items: stretch; }
      #otherBlock .blogBlockTop .blogList li {
        width: 32%;
        margin-right: 2%;
        margin-bottom: 30px; }
        #otherBlock .blogBlockTop .blogList li:nth-child(3n) {
          margin-right: 0; }
        #otherBlock .blogBlockTop .blogList li:last-child {
          margin-right: 0; }
        #otherBlock .blogBlockTop .blogList li .blogImage {
          margin-bottom: 10px;
          position: relative; }
          #otherBlock .blogBlockTop .blogList li .blogImage a {
            display: block;
            position: relative; }
          #otherBlock .blogBlockTop .blogList li .blogImage .category {
            position: absolute;
            bottom: 0;
            left: 0;
            color: #fff;
            text-decoration: none;
            padding: 5px 20px; }
          #otherBlock .blogBlockTop .blogList li .blogImage img {
            transition: 0.4s; }
            #otherBlock .blogBlockTop .blogList li .blogImage img:hover {
              opacity: 0.7; }
        #otherBlock .blogBlockTop .blogList li .date {
          text-align: right;
          margin-bottom: 6px; }
        #otherBlock .blogBlockTop .blogList li .ttl {
          margin-bottom: 8px;
          font-size: 20px;
          line-height: 150%; }
          #otherBlock .blogBlockTop .blogList li .ttl a {
            text-decoration: none;
            color: #333;
            font-size: 20px;
            line-height: 160%;
            font-weight: bold; }
            #otherBlock .blogBlockTop .blogList li .ttl a:hover {
              text-decoration: underline; }
        #otherBlock .blogBlockTop .blogList li .author {
          font-size: 10px;
          line-height: 150%; }
          #otherBlock .blogBlockTop .blogList li .author i {
            margin-right: 0.5em; }
          #otherBlock .blogBlockTop .blogList li .author a {
            text-decoration: none;
            color: #333;
            font-size: 12px;
            line-height: 160%; }
            #otherBlock .blogBlockTop .blogList li .author a:hover {
              text-decoration: underline; }
    #otherBlock .blogBlockTop .submitBtn {
      text-align: center; }
      #otherBlock .blogBlockTop .submitBtn a {
        cursor: pointer;
        margin: 0 auto;
        display: block;
        text-align: center;
        border-radius: 20px;
        border: 1px #333 solid;
        padding: 10px;
        width: 260px;
        text-decoration: none;
        box-sizing: border-box;
        background: #333;
        color: #fff;
        transition: 0.6s; }
        #otherBlock .blogBlockTop .submitBtn a:hover {
          background: #fff;
          color: #333; }
  #otherBlock .contactBlock {
    padding: 80px 0;
    background: url("../img/bg_contact.jpg") no-repeat center center;
    background-size: cover; }
    #otherBlock .contactBlock .inner {
      margin: 0 auto;
      max-width: 1120px;
      width: 94%; }
    #otherBlock .contactBlock p {
      margin-bottom: 20px;
      text-align: center; }
    #otherBlock .contactBlock a {
      cursor: pointer;
      margin: 0 auto;
      display: block;
      text-align: center;
      border-radius: 20px;
      border: 1px #333 solid;
      padding: 10px;
      width: 260px;
      text-decoration: none;
      box-sizing: border-box;
      background: #333;
      color: #fff;
      transition: 0.6s; }
      #otherBlock .contactBlock a:hover {
        background: #fff;
        color: #333; }
    #otherBlock .contactBlock dl {
      margin: 0 auto;
      width: 100%;
      max-width: 500px;
      display: table;
      border-collapse: collapse;
      border-top: 1px #ccc solid;
      border-left: 1px #ccc solid; }
      #otherBlock .contactBlock dl dt {
        display: table-cell;
        width: 60px;
        padding: 10px;
        background: #eee;
        border-right: 1px #ccc solid;
        border-bottom: 1px #ccc solid;
        text-align: center; }
      #otherBlock .contactBlock dl dd {
        display: table-cell;
        padding: 10px;
        border-right: 1px #ccc solid;
        border-bottom: 1px #ccc solid; }

/* ================================================ 
	footer
==============================================================================================================================================================*/
footer {
  background: #222;
  padding: 20px 3%; }
  footer .footerInner {
    margin: 0 auto 30px;
    max-width: 1120px;
    display: flex;
    flex-flow: row wrap;
    justify-content: flex-start;
    align-items: center; }
    footer .footerInner .logo {
      width: 20%; }
    footer .footerInner nav {
      margin-left: 5%;
      width: 75%; }
      footer .footerInner nav ul {
        display: flex;
        flex-flow: row wrap;
        justify-content: flex-end;
        align-items: center; }
        footer .footerInner nav ul li {
          margin-left: 30px;
          font-size: 20px;
          line-height: 150%;
          font-weight: bold;
          font-family: "Vollkorn", serif; }
          footer .footerInner nav ul li a {
            color: #fff;
            text-decoration: none; }
  footer .copyrights {
    text-align: center;
    color: #fff;
    font-size: 16px;
    line-height: 150%; }

/* ================================================ 
	contact
==============================================================================================================================================================*/
#formWrap {
  max-width: 700px;
  width: 94%;
  margin: 0 auto 60px; }
  #formWrap h2 {
    margin: 0 0 30px;
    padding: 0 0 5px;
    font-size: 140%;
    line-height: 150%;
    border-bottom: 1px #ccc solid; }
  #formWrap .formTable {
    width: 100%;
    margin: 0 auto 30px;
    border-collapse: collapse;
    font-size: 16px;
    line-height: 150%; }
    #formWrap .formTable th {
      border: 1px solid #ccc;
      font-weight: normal;
      text-align: left;
      padding: 10px;
      width: 30%;
      background: #efefef; }
      #formWrap .formTable th span {
        display: inline-block;
        background: #cc0000;
        color: #fff;
        margin: 0 0 0 0.5em;
        font-size: 10px;
        line-height: 150%;
        padding: 2px 10px; }
    #formWrap .formTable td {
      border: 1px solid #ccc;
      padding: 10px;
      font-weight: normal;
      text-align: left; }
      #formWrap .formTable td input {
        width: 60%;
        font-size: 16px;
        line-height: 150%; }
      #formWrap .formTable td textarea {
        width: 80%;
        font-size: 16px;
        line-height: 150%; }
  #formWrap .submitBtn {
    text-align: center; }
    #formWrap .submitBtn input {
      cursor: pointer;
      border-radius: 20px;
      border: 1px #333 solid;
      padding: 10px;
      width: 160px;
      box-sizing: border-box;
      background: #333;
      color: #fff;
      transition: 0.6s; }
      #formWrap .submitBtn input:hover {
        background: #fff;
        color: #333; }

p.error_messe {
  margin: 5px 0;
  color: #cc0000; }

/* ================================================ 
	blog
==============================================================================================================================================================*/
.writer {
  margin: 0 0 30px;
  font-size: 18px;
  line-height: 150%;
  border-bottom: 1px #ccc solid;
  padding: 0 0 5px; }

.memberData {
  margin-bottom: 50px;
  width: 100%;
  box-sizing: border-box;
  padding: 15px;
  border: 1px #ccc solid;
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: stretch; }
  .memberData .image {
    width: 120px;
    margin-right: 20px; }
  .memberData .txt {
    flex: 1; }
    .memberData .txt h3 {
      margin: 0 0 10px;
      font-size: 20px;
      line-height: 150%;
      font-weight: normal; }
    .memberData .txt p {
      line-height: 160%; }

.notfound {
  margin: 0 0 30px;
  font-size: 26px;
  line-height: 150%;
  border-bottom: 1px #ccc solid;
  padding: 0 0 5px; }

.blogBlock {
  margin: 0 auto;
  width: 94%;
  max-width: 1120px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  align-items: flex-start; }
  .blogBlock .blogContent {
    flex: 1;
    margin-right: 30px; }
    .blogBlock .blogContent .thumbnailImage {
      margin: 0 0 30px; }
  .blogBlock .sideContent {
    width: 300px; }
    .blogBlock .sideContent .recentPost {
      margin: 0 0 50px; }
      .blogBlock .sideContent .recentPost h2 {
        margin: 0 0 15px;
        font-size: 22px;
        line-height: 150%;
        font-weight: bold;
        padding-bottom: 5px;
        border-bottom: 1px #ccc dotted; }
        .blogBlock .sideContent .recentPost h2 i {
          margin-right: 0.5em; }
      .blogBlock .sideContent .recentPost ul li {
        margin-bottom: 15px;
        padding-bottom: 15px;
        border-bottom: 1px #ccc dotted;
        width: 100%;
        display: flex;
        flex-flow: row nowrap;
        justify-content: flex-start;
        align-items: stretch; }
        .blogBlock .sideContent .recentPost ul li .thumbnailImage {
          width: 120px;
          margin-right: 20px;
          transition: 0.4s; }
          .blogBlock .sideContent .recentPost ul li .thumbnailImage:hover {
            opacity: 0.7; }
        .blogBlock .sideContent .recentPost ul li .txtArea {
          flex: 1; }
          .blogBlock .sideContent .recentPost ul li .txtArea a {
            color: #333;
            text-decoration: none; }
            .blogBlock .sideContent .recentPost ul li .txtArea a:hover {
              text-decoration: underline; }
          .blogBlock .sideContent .recentPost ul li .txtArea h3 {
            margin: 0 0 8px;
            font-size: 14px;
            line-height: 160%;
            font-weight: normal; }
          .blogBlock .sideContent .recentPost ul li .txtArea .author {
            font-size: 12px;
            line-height: 150%; }
            .blogBlock .sideContent .recentPost ul li .txtArea .author i {
              margin-right: 0.5em; }
    .blogBlock .sideContent .tagList {
      margin: 0 0 50px; }
      .blogBlock .sideContent .tagList h2 {
        margin: 0 0 15px;
        font-size: 22px;
        line-height: 150%;
        font-weight: bold;
        padding-bottom: 5px;
        border-bottom: 1px #ccc dotted; }
        .blogBlock .sideContent .tagList h2 i {
          margin-right: 0.5em; }
      .blogBlock .sideContent .tagList ul {
        width: 100%;
        display: flex;
        flex-flow: row wrap;
        justify-content: flex-start;
        align-items: stretch; }
        .blogBlock .sideContent .tagList ul li a {
          display: block;
          border: 1px #ccc solid;
          padding: 5px;
          margin: 0 5px 5px 0;
          color: #333;
          text-decoration: none;
          transition: 0.4s; }
          .blogBlock .sideContent .tagList ul li a:hover {
            background: #ccc; }

.tagTtl {
  margin: 0 0 20px;
  font-size: 22px;
  line-height: 150%;
  font-weight: bold;
  padding-bottom: 5px;
  border-bottom: 1px #ccc dotted; }
  .tagTtl i {
    margin-right: 0.5em; }

/* ================================================ 
	category
==============================================================================================================================================================*/
.categoryList {
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items: stretch; }
  .categoryList .categoryListCont {
    width: 48%;
    margin-right: 4%;
    margin-bottom: 40px; }
    .categoryList .categoryListCont:nth-child(2n) {
      margin-right: 0; }
    .categoryList .categoryListCont .categoryListContImage {
      margin-bottom: 10px;
      position: relative; }
      .categoryList .categoryListCont .categoryListContImage a {
        display: block;
        max-width: 380px;
        height: 210px;
        overflow: hidden;
        position: relative; }
        .categoryList .categoryListCont .categoryListContImage a.noImage {
          box-sizing: border-box;
          border: 1px #000 solid; }
        .categoryList .categoryListCont .categoryListContImage a img {
          transition: 0.4s;
          width: 100%;
          height: auto; }
          .categoryList .categoryListCont .categoryListContImage a img:hover {
            opacity: 0.7; }
      .categoryList .categoryListCont .categoryListContImage .category {
        position: absolute;
        display: block;
        bottom: 0;
        left: 0;
        color: #fff;
        text-decoration: none;
        padding: 5px 20px; }
    .categoryList .categoryListCont .date {
      text-align: right;
      margin-bottom: 6px; }
    .categoryList .categoryListCont .ttl {
      margin-bottom: 8px;
      font-size: 20px;
      line-height: 150%;
      font-weight: bold; }
      .categoryList .categoryListCont .ttl a {
        color: #333;
        text-decoration: none; }
        .categoryList .categoryListCont .ttl a:hover {
          text-decoration: underline; }
    .categoryList .categoryListCont .author {
      font-size: 12px;
      line-height: 150%;
      text-align: right; }
      .categoryList .categoryListCont .author i {
        margin-right: 0.5em; }
      .categoryList .categoryListCont .author a {
        color: #333;
        text-decoration: none; }
        .categoryList .categoryListCont .author a:hover {
          text-decoration: underline; }

.topicsContList dl {
  margin-bottom: 10px;
  display: table;
  width: 100%;
  border-collapse: collapse;
  border-bottom: 1px #333 solid; }
  .topicsContList dl dt {
    display: table-cell;
    vertical-align: top;
    width: 100px;
    padding: 0 10px 10px 0; }
  .topicsContList dl dd {
    display: table-cell;
    padding: 0 0 10px; }
    .topicsContList dl dd a {
      color: #333; }
  .topicsContList dl:last-child {
    margin-bottom: 0; }

.categorySingle {
  display: inline-block;
  color: #fff;
  text-decoration: none;
  padding: 5px 20px;
  margin-right: 0.5em; }
  .categorySingle.astrology {
    background: #F9295B; }
  .categorySingle.web {
    background: #4077A0; }
  .categorySingle.seo {
    background: #006400; }
  .categorySingle.outing {
    background: #E92F4A; }
  .categorySingle.news {
    background: #222; }
  .categorySingle.topics {
    background: #222; }
  .categorySingle.game {
    background: #6DD900; }

.category.astrology {
  background: #F9295B; }
.category.web {
  background: #4077A0; }
.category.seo {
  background: #006400; }
.category.outing {
  background: #E92F4A; }
.category.news {
  background: #222; }
.category.topics {
  background: #222; }
.category.game {
  background: #6DD900; }

.blogTtl {
  margin: 0 0 10px;
  padding: 0;
  color: #000;
  font-size: 36px;
  line-height: 160%;
  font-weight: normal; }

.blog-tit a {
  color: #000; }

.sideCategoryList {
  margin: 0 0 50px; }
  .sideCategoryList h2 {
    margin: 0 0 15px;
    font-size: 22px;
    line-height: 150%;
    font-weight: bold;
    padding-bottom: 5px;
    border-bottom: 1px #ccc dotted; }
    .sideCategoryList h2 i {
      margin-right: 0.5em; }
  .sideCategoryList ul li {
    padding: 10px 0 10px 0;
    border-bottom: 1px #ccc dotted; }
    .sideCategoryList ul li:first-child {
      padding-top: 0; }
    .sideCategoryList ul li a {
      color: #333;
      text-decoration: none; }
      .sideCategoryList ul li a:hover {
        text-decoration: underline; }

.addtoany_content_bottom {
  margin-top: 40px !important; }

.addtoany_content {
  margin: 0 0 20px !important;
  display: flex;
  justify-content: flex-end;
  box-sizing: border-box;
  padding: 0; }

.addtoany_list a:not(.addtoany_special_service) > span {
  display: block !important; }

.addtoany_content_bottom {
  margin: 30px 0 0 !important; }

#kanrenBlock {
  margin-bottom: 60px; }
  #kanrenBlock ul {
    width: 100%;
    display: flex;
    flex-flow: row wrap; }
    #kanrenBlock ul li {
      width: 23.5%;
      margin-right: 2%; }
      #kanrenBlock ul li:nth-child(4n) {
        margin-right: 0; }
      #kanrenBlock ul li .image {
        margin-bottom: 10px;
        position: relative; }
        #kanrenBlock ul li .image a {
          display: block;
          transition: 0.6s; }
          #kanrenBlock ul li .image a:hover {
            opacity: 0.7; }
        #kanrenBlock ul li .image .category {
          position: absolute;
          bottom: 0;
          left: 0;
          color: #fff;
          text-decoration: none;
          font-size: 12px;
          line-height: 130%;
          padding: 2px 15px; }
      #kanrenBlock ul li .txt {
        font-size: 14px;
        line-height: 150%; }
        #kanrenBlock ul li .txt a {
          text-decoration: none;
          color: #333; }
          #kanrenBlock ul li .txt a:hover {
            text-decoration: underline; }