<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";
/* reset.css */
body,dd,div,dl,dt,footer,h1,h3,h4,h5,header,html,i,img,li,nav,p,section,small,span,ul{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;-webkit-text-size-adjust:100%}body{line-height:1}footer,header,nav,section{display:block}ul{list-style:none}dd,dl,dt{font-style:normal}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}a img{border:0}img{vertical-align:bottom}

/* common.css */
.t-m10{margin-top:10px}.t-m15{margin-top:15px}.b-m10{margin-bottom:10px}.b-m20{margin-bottom:20px}.tcenter{text-align:center}.orange{color:#f60}.red{color:red}.bg-beige{background:#f2efe1}.scrollbar::-webkit-scrollbar:horizontal{height:1px}.scrollbar::-webkit-scrollbar-piece:start{background:#eee}

/* font-awesome.css*/
.fa, .far, .fas{
  font-family:"Font Awesome 5 Free";
  font-style: normal;
}
.fab{
  font-family: "Font Awesome 5 Brands";
  font-style: normal;
}
.fa, .fab, .fal, .far, .fas{
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}
.fa, .fas{
  font-weight:900;
}

.fa-mobile-alt:before{
  content:"\f3cd";
}
 .fa-youtube:before {
  content: "　";
  background : url(../img/youtube-brands.svg) center center no-repeat;
}

.fa-map-marker-alt:before {
  content: "\f3c5";
}
.fa-twitter:before {
  content: "　";
  background : url(../img/twitter-brands.svg) center center no-repeat;
}

/* 以下 basis.css */
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/NotoSansJP-Regular-Subset.woff) format("woff");
  font-display: swap
}

@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/Awesome5Free-900.woff) format("woff");
  font-display: swap
}
/*
@font-face {
  font-family: 'Font Awesome 5 Brands';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/fontawesome-5Brands.woff) format("woff");
  font-display: swap
}
*/
html {
  height: 100%
}

body {
  width: 100%;
  height: 100%;
  color: #222;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  line-height: 1.7;
  margin: 0 auto
}

a:link, a:visited, a:hover {
  color: #60410b
}

a:link {
  text-decoration: none
}
.mtitle1 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #60410b;
  line-height:1.4;
}
.mtitle3 {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 1px;
  text-align: center;
  position: relative;
  color: #555;
  padding: 0 15px
}

.mtitle3:before {
  content: "＼";
  position: absolute;
  left: 0;
  bottom: 0
}

.mtitle3:after {
  content: "／";
  position: absolute;
  right: 0;
  bottom: 0
}
.mtitle4 {
	font-size:18px;
	font-weight:500;
	color: #60410b;
	margin:10px 0;
}
.mtitle4:before {
	font-family:"Font Awesome 5 Free";
	content:"\f0a9";
	margin-right:6px;
}
.mtitle4 span {
	font-weight:600;
}
.mtitle-tel {
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 2px;
  line-height: 1;
  margin: 20px 0;
  text-align: center;
  font-family: 'Century Gothic', sans-serif
}

.mtitle-tel span {
  font-size: 38px;
  font-weight: 600;
  color: #60410b;
  letter-spacing: 2px
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 20;
  width: 260px;
  height: 100vh;
  background: #b8e0eb;
  border-right: 1px solid #CCC;
  z-index: 99999
}

#header .inner {
  width: 100%;
  position: absolute;
  top: 30px;
  color: #333
}

#header #logo {
  text-align: center;
  margin: 0 auto 5px
}

#header #logo img {
  width: 90%;
  height:auto;
}

.telephone {
  color: #60410b;
  font-size: 22px;
  text-align: center;
  line-height: 1.5;
}

.telephone span {
  font-size: 1.2em;
  font-weight: 500;
  letter-spacing: 1px;
  font-family: 'Century Gothic', sans-serif
}

.headtext {
  font-size: 14px;
  text-align: center;
  line-height: 1.5;
  color: #60410b;  
}

#header #navi {
  text-align: center;
  margin: 15px 10px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;  
}
#header #navi&gt;li {
	width:48%;
}
#header #navi&gt;li&gt;a {
  display: block;
  padding: 3px 0;
  color: #FFF;
  background: linear-gradient(#60410b, #7F673B);
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 1px;
  margin-bottom: 10px;
  border-radius: 10px;
  line-height:1;
  padding:8px 0 10px;  
}
#header #navi&gt;li.staffblog&gt;a {
  background: #8bc34a;
  font-weight: 600;
  font-size: 20px;
  font-family: 'Century Gothic', sans-serif;
  padding: 6px 0;
}
#header #navi&gt;li.staffblog {
	width:100%;
}

#header ul.sns_links {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center;
  align-items:center;
}

#header #navi&gt;li&gt;a:hover {
    background: #5a4c34;
  }
  
  
  #header ul.sns_links li {
    margin: 0 15px;
  }
  
  #header ul.sns_links li a {
    display: block;
    font-size: 36px;
    color: #60410b;
  }
  
  #header ul.sns_links li.ytb a {
    color: #FF0000;
  }
  
  #header ul.sns_links li.twt a {
    color: #1DA1F2;
  }

.rec {
  margin: 0 10px
}

.rec li {
  margin-bottom: 10px;
  font-size: 13px
}

.rec li img {
  width: 100%
}

@media all and (max-width: 1100px) {
  .rec {
    display: none
  }
}

@media all and (max-width: 820px) {
  #header {
    position: relative;
    z-index: 2000;
    width: 100%;
    height: auto;
    border-right: none;
    padding: 5px 0
  }
  #header .inner {
    width: 100%;
    position: relative;
    top: 0
  }
  #header #logo {
    padding: 0;
    margin: 0;
    width: 30%
  }
  #header .headtext, #header .headbanner, #header #navi {
    display: none
  }
  #header ul.sns_links {
    display: none
  }
  .telephone {
    display: none
  }
}

@media all and (max-width: 600px) {
  #header #logo {
    width: 55%
  }
}

.headbanner {
  margin: 0 10px
}

.headbanner li {
  margin-bottom: 10px
}

.headbanner li p {
  font-size: 13px;
  line-height: 1.5
}

.headbanner li img {
  width: 100%
}

#menuA {
  width: 100%;
  position: relative;
  background: #b8e0eb;
  z-index: 9999
}

#menu {
  width: calc(100% - 10% - 260px);
  margin-left: calc(10% + 260px);
  overflow: hidden
}

#menu ul {
  box-sizing: border-box;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin: 5px 0
}

#menu li {
  text-align: center;
  line-height: 1;
  margin: 0 5px
}

#menu li a {
  padding: 10px;
  display: block;
  font-weight: 500;
  font-size: 14px;
  color: #333;
  border-radius: 5px
}

#menu li a:hover {
  text-decoration: none;
  color: #FFF;
  background: #4fb2cd
}

#menu * {
  -webkit-transition: .3s;
  -moz-transition: .3s;
  -ms-transition: .3s;
  -o-transition: .3s;
  transition: .3s
}

#flashA {
  width: 100%;
  position: relative
}

#flash {
  width: calc(100% - 260px);
  margin-left: 260px;
  overflow: hidden;
  position: relative;
  opacity: .8;
}

#flash img{
  width:100%;
  height:auto;
}

.flashimg {
  height: auto;
  position: absolute;
  bottom: 30px;
  right: 30px;
  text-align: right;
  line-height: 1.6;
  color: #FFF;
  font-weight: 600;
  font-size: 24px;
  z-index: 999999;
  letter-spacing:2px;
  text-shadow: 3px 3px 6px #111
}

.flashimg span {
  font-size: 1.6em;
  letter-spacing: .1em
}
.single {
	width:94%;
	margin-left:4%;
	max-width:1000px;
	padding:30px 0;
	overflow:hidden;
}
.single1 {
	width:100%;
	max-width:1400px;
	overflow:hidden;
}
.single2 {
	width:94%;
	margin-left:4%;
	max-width:1300px;
	padding:30px 0;
	overflow:hidden;
}
.single3 {
  width: 96%;
  max-width: 1500px;
  margin: 0 auto;
  padding: 30px 0;
  overflow: hidden
}

#body {
  position: relative;
  width: 100%;
  min-height: 100%;
  height: auto!important;
  height: 100%
}

.lsingle {
  float: left
}

.rsingle {
  float: right;
}

.lsingle {
  width: 40%;
}
.rsingle {
  width: 59%;
}
.lbox {
  float: left
}
.rbox {
  float: right;
}
.lbox,
.rbox {
	width:49%;
}
@media screen and (max-width: 600px) {
.lbox,
.rbox {
	width:100%;
	float:none;
}	
}
.clearbox {
	width:100%;
	overflow: hidden;	
}	
.mbox {
	width:100%;
	max-width:1100px;
	margin:20px 0;
	overflow: hidden;
}
.mbox0 {
	width:100%;
	margin:20px 0;
	overflow:hidden;
}
.mbox1 {
	padding:15px 20px;
	margin:20px 0;
	background:#f7f7f7;
}
.mbox1 h3 {
	color:#555;
	margin-bottom:10px;
	font-size:20px;
	font-weight:500;
}
.mbox2 {
    padding: 15px;
    border: 1px solid #c8c8c8;
    background: #FFF;
    margin: 10px 0;
    overflow: hidden;
}
#page-top {
  position: fixed;
  bottom: 5px;
  right: 5px;
  font-size: 12px;
  font-weight: 700;
  z-index: 9999
}

#page-top a {
  color: #FFF;
  font-size: 25px;
  font-family: 'Font Awesome 5 Free';
  content: "\f102";
  text-decoration: none;
  padding: 0 15px 5px;
  text-align: center;
  display: block;
  background: #72c1d7;
  border-radius: 50%
}

#page-top a:hover {
  background: #CCC;
  text-decoration: none
}

footer {
  display: flex;
  justify-content: space-around;
  width: 100%;
  flex-direction: column;
  color: #333
}

#footerA {
  width: calc(100% - 260px);
  margin-left: auto
}

#footer {
  width: 94%;
  margin: 0 auto;
  padding: 0 0 15px;
  font-size: 13px;
}

.logo-f {
  float: right;
  margin-right: 15px;
  overflow: hidden
}

.logo-f li {
  float: left;
  margin-right: 5px
}

#footer a:link, #footer a:visited {}

#fnavi {
  margin-top: 10px
}

#fnavi ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start
}

#fnavi li {
  text-align: left;
  padding: 0;
  margin: 10px 10px 0;
  font-size: 14px;
  letter-spacing: 1px
}

#fnavi li:before {
  font-family: 'Font Awesome 5 Free';
  content: "\f0da";
  margin-right: 3px
}

#fnavi li a:link, #fnavi li a:visited, #fnavi li a:hover {
  color: #333!important;
  text-decoration: none
}

@media screen and (max-width: 1100px) {
  #fnavi li {
    margin: 0 10px
  }
}

@media screen and (max-width: 820px) {
  #fnavi {
    display: none
  }
}

.copyright {
  text-align: left;
  margin: 15px 0 0 10px;
  font-size: 10px
}

@media screen and (max-width: 820px) {
  footer {
    background: #FFF
  }
  #footerA {
    width: 100%;
    margin: 0
  }
  #footer {
    width: 90%;
    margin: 10px auto 0;
    padding-bottom: 60px;
    font-size: 12px
  }
}

.bg-wall {
  background: #72c1d7;
  overflow: hidden
}
.bg-wall2 {
  background: #fff9f5;
  overflow: hidden
}

.cbtn * {
  -moz-transition: .3s;
  -ms-transition: .3s;
  -o-transition: .3s;
  transition: .3s
}

.cbtn {
  width: 350px;
  margin: 20px auto 0;
  max-width: 100%
}

.cbtn a {
  text-align: center;
  width: 100%;
  display: block;
  padding:3px 0;
  font-weight: 400;
  background: #5a4c34;
  border-radius: 5px
}

.cbtn a:link, .cbtn a:visited {
  color: #fff;
  text-decoration: none
}

.cbtn a:hover {
  color: #FFF;
  background: #72c1d7;
  text-decoration: none
}

.cbtn a:before {
  font-family: 'Font Awesome 5 Free';
  content: "\f0a9";
  margin-right: 10px
}

.cbtn1 * {
  -moz-transition: .3s;
  -ms-transition: .3s;
  -o-transition: .3s;
  transition: .3s
}

.cbtn1 {
  width: 380px;
  margin: 15px 0 0
}

.cbtn1 a {
  text-align: center;
  width: 100%;
  display: block;
  padding: 3px 0;
  background: #5a4c34;
  border-radius: 5px
}

.cbtn1 a:link, .cbtn1 a:visited {
  color: #FFF;
  text-decoration: none
}

.cbtn1 a:hover {
  background: #72c1d7;
  text-decoration: none
}

.cbtn1 a:before {
  font-family: 'Font Awesome 5 Free';
  content: "\f0a9";
  margin-right: 10px
}
.cbtn2 {
	-moz-transition: 0.3s;
	-ms-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}
.cbtn2 {
	width:400px;	
	margin:15px 0;
}
.cbtn2 a{
	text-align:center;
	width:100%;
	display:block;
	padding:10px 0 12px;
	line-height:1;
	font-weight:500;
	background:#E7DFD1;
	border-radius:10px;	
    background: -webkit-gradient(linear, 0 0, 0 bottom, from(#FF9900), to(#ff7200));
    background: -moz-linear-gradient(#FF9900, #ff7200);
    -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(StartColorStr=#FF9900, EndColorStr=#ff7200)";
    background: linear-gradient(to bottom, #FF9900, #ff7200);	
	font-size:20px;	
	letter-spacing:1px;
}
.cbtn2 a:link,
.cbtn2 a:visited {
	color: #FFF;
	text-decoration:none;
}
.cbtn2 a:hover{
	color: #FFF;
	background:#FF6600;
	text-decoration:none;
} 
#contentwrap {
  padding: 0;
  width: calc(100% - 260px);
  margin-left: auto
}

.mtitle-big0 {
  font-size: 26px;
  letter-spacing: .1em;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  line-height: 1.6;
  padding: 0 10px;
  color: #60410b;
  font-weight: 500
}

.mtitle-big5 {
  font-size: 26px;
  letter-spacing: 2px;
  color: #60410b;
  line-height: 1.4;
  font-weight: 600;
  padding-bottom: 5px;
  border-bottom: #333 1px dashed
}
.mtitle-big5 span {
	color:#FF0000;
	font-size:0.8em;
}
.hidden {
  display: none
}

.topbox {
  margin: 0 0 0 30px;
  width: calc(100% - 30px);
  padding: 20px;
  overflow: hidden;
  background: #FFF
}

.topbox h3 {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
  color: #60410b;
  margin-bottom: 10px
}
/*トップページブログ*/
  .topbox dl{
    font-size: 14px;
  }
  .topbox dt{
    float: left;
      width: 8em;
      padding-top: 5px;
      line-height: 1.6;
      font-weight: 500;
      letter-spacing: .1em;
      color: #60410b;
  }

  .topbox dd{
    padding-left: 8em;
      padding-bottom: 5px;
      padding-top: 5px;
      line-height: 1.6;
      border-bottom: dashed 1px #AAA;
  }
  .blogWriter {
  font-size: 15px;
  color: #992E00;
  font-weight: 500;
  margin-right: 10px
}
@media screen and (max-width: 599px) {
  .topbox dl dt {
    width: 75px;
    font-size: 12px;
    letter-spacing: normal
  }
  .topbox dl dd {
    padding-left: 80px;
    line-height: 1.5
  }
}
/*本日出演の占い師*/
.top_today {
  box-sizing: border-box;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start
}

.top_today li {
  width: 100px;
  border: #CCC 1px solid;
  background: #FFF;
  padding: 5px;
  margin: 0 5px 10px;
  box-shadow: 2px 2px 3px gray
}

.top_today li p {
  color: #60410b;
  font-weight: 300;
  font-size: 14px;
  line-height: 1;
  letter-spacing: 1px
}

.top_today li img {
  max-width: 100%;
  margin-bottom: 3px;
  height:auto;
}

.voicebox {
  width: calc(100% - 26px);
  padding: 10px;
  margin: 0 auto;
  border: 3px solid #4fb2cd;
  border-radius: 10px;
}

.voicetitle {
  font-size: 20px;
  text-align: center;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 15px
}

.voicetitle span {
  color: #eb5592;
  font-weight: 600;
  font-size: 2.4em
}

.voicebox img {
  max-width: 100%;
  height:auto;
}

@media screen and (max-width: 599px) {
  .voicetitle span {
    font-size: 40px
  }
}
.titlearea {
	background:#F2EFE1;
}
.titleimg {
	width:96%;
	max-width: 1500px;
	color: #60410b;
	font-weight: 600;
	font-size: 26px;
	letter-spacing: 0.1em;
	margin: 0 auto;
	padding:40px 0;
}
@media screen and (max-width: 820px) {
.titleimg {
	padding:30px 0;
	text-align:center;
}	
}
@media screen and (max-width: 599px) {
.titleimg {
	font-size: 20px;
	padding:15px 0;	
}	
}
/*占い師一覧ページ*/
.list {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
}
.list li {
    width:calc(16.66% - 22px);
	margin:0 10px 20px;
	border:1px #AAA solid;
	overflow:hidden;
	background:#fffef8;
}
.list li h3 {
	color: #60410b;
	font-weight:500;
	text-align:center;
	letter-spacing:1px;
	font-size:16px;
	line-height:1.1;
	padding:5px 0;
	background:#E7DFD1;		
}
.list li h3 span {
	font-size:12px;
	color:#937352;
}
.list li p {
	margin:5px 3px;
	font-size:11px;
	line-height:1.4;
	font-weight:normal;
}
.list li img {
	width:100%;
}
@media screen and (max-width: 1024px) {
.list li {
    width:calc(25% - 22px);
}			
}
@media screen and (max-width: 599px) {
.list li {
    width:calc(50% - 12px);
	margin:0 5px 10px;	
}	
}
/*出演リスト*/
.schedule {
    display: flex;
    flex-wrap: wrap;
    justify-content:flex-start;	
}
.schedule li {
	margin:0 5px;
	width:calc(33.3% - 10px);
}	
.schedule li h5 {
	font-size:18px;
	font-weight:600;
	padding:5px 0;
	color:#111;
	background:#CBC2B0;
	text-align:center;	
}
.schedule_list {
}
.schedule_list li {
	width:calc(100% - 12px);
	border:#CCC solid 1px;
	padding:5px;
	margin:0 0 5px;
	overflow:hidden;
}
.schedule_list li img {
	width:20%;
	float:left;
	margin-right:5px;
}
.schedule_list li p {
	font-size:14px;
}
.schedule_list li p.name {
	font-size:16px;
	font-weight:bold;
	margin-top:10px;
}
.sche_arrow {
	margin:0 0 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content:space-evenly;		
}
.sche_arrow li {
	width:45%;
	text-align:center;
}
@media screen and (max-width:810px) {	
.schedule_list li p.name {
	font-size:15px;
	font-weight:500;
	margin:0;
}
}
@media screen and (max-width:600px) {	
.schedule li {
	margin:0 3px;
	width:calc(33.33% - 6px);
}
.schedule li h5 {
	font-size:15px;
}
.schedule_list li {
	width:calc(100% - 8px);
	padding:3px;
	margin:0 0 5px;	
	text-align:center;
}
.schedule_list li img {
	width:50%;
	float:none;
	margin:0;
}
.schedule_list li p {
	font-size:13px;
	line-height:1.4;
}
.schedule_list li p.name {
	font-size:14px;
	margin:3px 0 0;
}
}
/* list-check */
.list-price {
	overflow:hidden;
	line-height:1.6;
	font-size:18px;
	font-weight:500;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.list-price li:before {
	font-family:"Font Awesome 5 Free";
	content:"\f0a9";
	margin-right:5px;
	margin-left:3px;
	color:#E66106;
}
.list-price li {
	width:45%;
	padding-left: 1.4em;
	padding-top:5px;
	padding-bottom:5px;
	text-indent: -1.5em;
	border-bottom: dotted 1px #888;
}
.list-price li span {
	font-size:1.5em;
	margin-right:3px;
	color:#E66106;
	letter-spacing:1px;
	font-weight:600;
}
.list-price li p {
	color:#555;
	letter-spacing:1px;
	font-weight:normal;
	font-size:14px;
}
@media screen and (max-width:600px) {	
.list-price li {
	width:100%;
	letter-spacing:1px;
}
}
/* list-check */
.list-check {
	overflow:hidden;
}
.list-check li:before {
	font-family:"Font Awesome 5 Free";
	content:"\f0a9";
	margin-right:8px;
	padding-left: 5px;
	color:#988562;
}
.list-check li {
	padding-left: 1.5em;
	padding-top:5px;
	padding-bottom:5px;
	text-indent: -1.5em;
	border-bottom: dashed 1px #888;
}
.list-check li p {
	font-weight:400;
	font-size:15px;
	text-indent: 0;
	color:#555;
	line-height:2;
}
.list-check2 {
	overflow:hidden;
	font-size:1.1em;
}
.list-check2 li:before {
	font-family:"Font Awesome 5 Free";
	content:"\f0a9";
	margin-right:8px;
	padding-left: 5px;
	/*color:#988562;*/
}
.list-check2 li {
	padding-left: 1.5em;
	padding-top:5px;
	padding-bottom:5px;
	text-indent: -1.5em;
	/*border-bottom: dashed 1px #888;*/
}
.fright {
	float:right;
	margin-left:30px;
}
.fleft {
	float:left;
	margin-right:30px;
}
@media screen and (max-width: 820px) {
.fright,
.fleft {
	float:none;
	text-align:center;
	margin:0;
}
}
/*.photo*/
.photo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.photo li {
  width: calc(100%/4 - 20px);
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 10px 10px;
  text-align: center;
}

.photo a {
  display: block;
  padding-bottom: 80.25%;
  height: 0;
  position: relative;
  overflow: hidden;
  margin-bottom: 10px;
}

.photo img {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  min-width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.photo h3 {
  text-align: center;
  line-height: 1.6;
  color: #02012b;
  font-size:16px;
  font-weight:500;
}
.photo p {
  text-align: center;
  line-height: 1.5;
  color: #60410b;
  font-size:13px;
  font-weight: 300;
}
@media screen and (max-width: 599px) {
  .photo li {
    width: calc(100%/2 - 10px);
    margin: 0 5px 5px;
  }

  .photo:nth-child(2n) {
    margin-right: 0;
  }
  .photo h3 {
    font-size: 14px;
  }
  .photo p {
    font-size: 12px;
  }
}
/*.photo2*/
.photo2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.photo2 li {
  width: calc(100%/4 - 20px);
  margin: 0 10px 10px;
}
.photo2 img {
	width:100%;
	height: 100%;
}
@media screen and (max-width: 599px) {
  .photo2 li {
    width: calc(100%/2 - 10px);
    margin: 0 5px 10px;
  }
}
&lt;!--アクセスCSS--&gt;
.way_flow {
}
.way_flow dt {
    background-color: #4fb2cd;
    color: #60410b;
	line-height:1.8;
    padding: 5px 15px;
    font-size: 18px;
	font-weight:600;
    border-radius: 3px;
}
.way_flow dd {
    border-left: 4px dotted #555;
    margin-left: 25px;
    padding: 10px 15px;
    box-sizing: border-box;
}
.way_flow dd img {
	max-width:50%;
}
.way_flow dd:last-child {
    border: none;
}
@media screen and (max-width: 599px) {
.way_flow dt {
    font-size: 16px;
}
.way_flow dd img {
	max-width:100%;
}
}
.mtitle-check {
	padding-left: 1.5em;
	text-indent: -1.5em;
	font-size:20px;
	letter-spacing:0.1em;
	color:#111;
	font-weight:600;
	overflow:hidden;
	margin: 15px 0;
}
.mtitle-check:before {
	font-family:"Font Awesome 5 Free";
	content:"\f0a9";
	margin-right:6px;
}
/*FAQ*/
.faq {
}
.faq dt {
	padding:5px 5px 3px 2px;
	color:#111;
	font-weight:500;
	border-bottom:1px dotted #aaa;
	margin-bottom:10px;
	font-size:20px;
	line-height:1.5;
}
.faq dt:before {
	font-family:"Font Awesome 5 Free";
	content:"\f059";
	margin-right:8px;
	font-size:20px;
}
.faq dd {
	margin-bottom:20px;
	background:#f5f3ea;
	padding:15px;
}
@media screen and (max-width:600px) {
.faq dt {
	font-size:17px;
}
}
.news-s {
}
.news-s dt {
	float: left;
	width: 4em;
	height:20px;
	color:#111;
	padding-top: 5px;
	line-height: 1.3;

	font-weight:500;
	font-size:13px;	
}
.news-s dd {
	padding-left:5em;
	padding-bottom: 10px;
	padding-top: 5px;
	line-height: 1.3;
	font-size:14px;	
	border-bottom: dotted 1px #938041;
}
.news-s dd  span {
	color: #992E00;
}
.news-s dd:last-child {
	border-bottom:0px;

}
/*会社概要*/
.news-bl {
	overflow:hidden;
	margin:0 auto;
	padding:10px;
}
.news-bl:nth-child(odd) {
  background: #f7f7f7 !important;
}
.news-bl dt {
	float: left;
	width: 7em;
	font-size:15px;
	text-align:center;
	font-weight:600;
	color:#555;
}
.news-bl dd {
	padding-left:8em;
	font-size:16px;
}
@media screen and (max-width: 599px) {
.news-bl {
}
.news-bl dt {
	width:100%;
	float:none;
	text-align:left;
}
.news-bl dd{
	width:100%;
	padding:0;
}
}
/*新メールフォーム*/
.form {
	margin:10px 0 10px;
}
.form dt span {
	color:#fff;
	background:#FF0000;
	padding: 0 5px 0;
	margin-right:5px;
	font-size:10px;
	border-radius:2px;
	position:relative;
	top:-2px;
}
.form dl {
	margin:10px 0;
}
.form dt {
	float: left;
	width:200px;
	padding-top: 20px;
	margin-right:30px;
}
.form dd {
	padding-left:230px;
	padding-bottom: 20px;
	padding-top: 23px;
	/*line-height:1.8;*/
	border-bottom:1px solid #eee;
}
.form dd p {
	font-size:15px;
	padding-top:5px;
	color:#333;
}
.form dd:last-child {
	border-bottom:0px;
	margin-bottom:0px;
}
.textarea, textarea, .dropdown {
	border-radius:2px;
	border:1px solid #ddd;
}
.textarea {
	border-radius:2px;
	border:1px solid #ddd;
	height:30px;
	padding:0 5px;
}

.form button {
}
.form-button {
	padding:5px;
	border-radius:5px;
	text-align:center;
	margin:10px 0;
}
#mailform button {
	cursor:pointer;
	display: block;
	margin: 0 0 5px 230px;
	padding: 10px 0 10px;
	color: #fff;
	text-align: center;
	width: 250px;
	border-radius: 5px;
	background: #111;
	font-size: 16px;
}
#mailform button:before{
	/*font-family:"FontAwesome";
	content:"\f0e0";
	margin-right:6px;*/
}
#mailform button:hover {
	background: #555;
}
#mailform button *,
.form-button * {
	-moz-transition: 0.2s;
	-ms-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}
/*RadioとText*/
label.radio_text {
	cursor       : pointer;
	position     : relative;
	margin-right : 20px;
	overflow     : hidden;
	padding-left : 20px;
	display      : inline-block;
}
label.radio_text:before {
	position      : absolute;
	width         : 15px;
	height        : 15px;
	border        : 1px solid #ccc;
	border-radius : 50%;
	left          : 0px;
	top           : 2px;
	content       : '';
	z-index       : 3;
}
label.radio_text:after {
	content          : '';
	position         : absolute;
	width            : 11px;
	height           : 11px;
	border-radius    : 100%;
	left             : 3px;
	top              : 5px;
	background-color : #aaa;
	z-index          : 1;
}
label.radio_text input[type="radio"] {
	-moz-appearance: none;
	-webkit-appearance: none;
	position   : absolute;
	z-index    : 2;
	width      : 20px;
	height     : 20px;
	left       : -23px;
	top        : 0px;
	margin     : 0px;
	box-shadow : 20px -1px #FFF;
}
label.radio_text input[type="radio"]:checked {
	box-shadow : none;
}
label.radio_text input[type="radio"]:focus {
	opacity    : 0.2;
	box-shadow : 20px -1px #FFF;
}
/*CheckBoxとText */
label.checkbox_text {
	cursor       : pointer;
	position     : relative;
	padding-left : 25px;
	margin-right : 20px;
	overflow     : hidden;
	display      : inline-block;
	box-sizing   : border-box;
}
label.checkbox_text:before {
	content  : '';
	position : absolute;
	width    : 18px;
	height   : 18px;
	left     : 0px;
	top      : 0;
	border   : 1px solid #ccc;
	z-index  : 3;
}
label.checkbox_text:after {
	content           : '';
	position          : absolute;
	top               : 40%;
	left              : 5px;
	display           : block;
	margin-top        : -9px;
	width             : 8px;
	height            : 12px;
	border-right      : 3px solid #aaa;
	border-bottom     : 3px solid #aaa;
	transform         : rotate(45deg);
	z-index           : 1;
}
label.checkbox_text input[type="checkbox"] {
	-moz-appearance: none;
	-webkit-appearance: none;
	position   : absolute;
	left       : -40px;
	width      : 20px;
	height     : 20px;
	display    : block;
	box-shadow : 41px 0px #FFF;
	z-index    : 2;
	margin     : 0px;
	padding    : 0px;
}
label.checkbox_text input[type="checkbox"]:checked {
	box-shadow : none;
}
label.checkbox_text input[type="checkbox"]:checked:focus {
	box-shadow : 40px 0px #666;
	opacity    : 0.1;
}
label.checkbox_text input[type="checkbox"]:focus {
	box-shadow : 41px 0px #EEE;
}
.fm-text {
	padding:10px;
	font-size:12px;
	margin: 10px 0 10px 230px;
}
@media screen and (max-width: 599px) {
.form dl {
	margin:10px 0;
}
.form dt {
	float: none;
	width:100%;
	height:20px;
	line-height:20px;
	padding-top: 10px;
    text-align: left;	
}
.form dd {
	width:100%;
	padding-left:0;
	padding-bottom: 10px;
	padding-top: 10px;
	border-bottom:0px solid #eee;
}
.form dd:last-child {
	border-bottom:0px;
	margin-bottom:0px;
}
.textarea, textarea {
	width:93%;
	font-size:16px;
}
.dropdown {
	font-size:16px;
}
#mailform button {
	margin:0 auto;
}
.fm-text {
	margin:10px 0;
	text-align:left;
}
}
/* /新メールフォーム */
/*プロフィールページ*/
.profile_content {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.profile_content li:first-child {
	width:250px;
}
.profile_content li:last-child {
	width:calc(100% - 290px);
}
.profile_content li img {
	width:100%;
	border:#CCC solid 1px;
}
.profile_content li h3 {
	font-size:18px;
	line-height:1.2;
	color:#60410b;
	text-align:center;
	letter-spacing:0.1em;
	margin:5px 0;
}
.profile_content li h3 span {
	font-size:13px;
	color:#5a4c34;
}
@media screen and (max-width: 599px) {
.profile_content li:first-child,
.profile_content li:last-child {
	width:96%;
	margin:0 auto;
}
.profile_content li:first-child {
	text-align:center;
}
.profile_content li img {
	width:85%;
	border:#CCC solid 1px;
}
}
/*占術*/
.senjutu {
	background:#faf8e8;
	margin:10px 0;
	text-align:left;
}
.senjutu h4 {
	background:#60410b;
	color:#FFF;
	font-size:15px;
	text-align:center;
}
.senjutu p {
	padding:10px;
	font-size:14px;
	line-height:1.5;
}
/*ボタン*/
.profile_btn {
	width:100%;	
	margin:10px 0 ;		
}
.profile_btn a{
	text-align:center;
	width:100%;
	display:block;
	padding:3px 0;
	font-weight:500;
	letter-spacing:1px;
	color: #FFF;
	border-radius:5px;	
    background: #60410b;	
}
.profile_btn.yoyaku a {
	background:#8bc34a;
}
.profile_btn.twitter a {
	background:#000;
}
.profile_btn.twitter a img.xlogo {
	width:20px;
	border:none;
	padding-bottom:4px;
}
.profile_btn a:hover{
	background:#4fb2cd;
}
.profile_btn a:before {
 	font-family:"Font Awesome 5 Free";
	content:"\f0a9";
	margin-right:10px;
 }
/*メッセージ*/
.messagebox {
	background:#FFF;
	padding:15px;
	line-height:1.8;
}
/*特別鑑定*/
.special {
}
.special dt {
	font-size: 20px;
	padding: 0px 0px 3px 10px;
	color: #FFF;
	letter-spacing: 1px;
	background: #60410b;
	border-radius: 5px 5px 0 0;
}
.special .Price {
	color:#FF6600;
	font-weight:600;
	letter-spacing:1px;
	margin-bottom:10px;
}
.special dd {
	padding:10px;
	background: #FFF;
	border-radius: 0 0 5px 5px;
	margin-bottom:25px;
	line-height:1.8;	
}
@media screen and (max-width: 599px) {
.special dt {
	font-size: 18px;
	line-height:1.5;
	padding:5px;
}
.special .Price {
	font-size:15px;
	letter-spacing:normal;
}
}
.pcshow {
	display:block;
}
@media screen and (max-width: 820px) {
.pcshow {
	display:none;
}	
}
/*プライスリスト*/
.pricelist {
	overflow:hidden;
	line-height:1.5;
	font-weight:bold;
	font-size:20px;
	width:90%;
	font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.pricelist dt {
	float: left;
	padding-top:8px;
}
.pricelist dt:before {
	font-family:"Font Awesome 5 Free";
	content:"\f0a9";
	margin-right:5px;
	margin-left:3px;
	color:#E66106;
}
.pricelist dd {
	text-align:right;
	border-bottom: dotted 1px #aaa;
}
.pricelist dd span {
	font-size: 1.5em;
    color: #E66106;
	margin-right:3px;
}
.pricelist dd p {
	color:#555;
	font-size:14px;
	text-align:left;
}
.shutuen_yotei {
    letter-spacing: 1px;	
}
.shutuen_yotei dt {
    float: left;
    width: 150px;
    padding-top: 5px;
    line-height: 1.6;
    color: #60410b;
    font-weight: 600;	
}
.shutuen_yotei dd{
    padding-left:160px;
    padding-bottom: 5px;
    padding-top: 5px;
    line-height: 1.6;
    border-bottom: dashed 1px #AAA;
}

/* パンくず */
.breadcrumbs{
	list-style:none;
	margin:20px;
	padding:0;
}

.breadcrumbs li{
	display:inline-block;
}
.breadcrumbs li::after{
  content: '&gt;';
  display: inline-block;
  padding: 0 10px; /*左右に余白*/
}

.breadcrumbs li:last-child::after{
  display: none;
}
/*youtube*/
.youtube{
  width: 100%;
  position: relative;
  padding-top: 56.25%;
}
.youtube iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}
/*ご利用の流れ*/
:root {
  --flowchart-size: 80px;/* 番号大きさ 変更可 */
  --flowchart-border: 30px;/* 縦線太さ 変更可(12px以上) */
  --flowchart-gradient: linear-gradient(to right, rgb(171,236,214) 0%, rgb(251,237,150) 100%);/* 番号背景 変更可 */
}
.flowchart {
  list-style: none !important;
  counter-reset: flownum;/* リストアイテムの名称(任意) */
  position: relative;
  margin: 1em 0;/* フローチャートと前後要素との距離(任意) */
  padding: 0 !important;
}
.flowchart li {
  position: relative;
  padding: 0 0 0 calc(var(--flowchart-size) + var(--flowchart-border) + 15px + 30px);
}
.flowchart-content {
  position: relative;
  padding: 0 0 2em;
  overflow:hidden;
}
.flowchart-content img {
	float:left;
	max-width:300px;
	margin:15px 25px 0 0;
}
/* 縦線デザイン */
.flowchart::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: calc(var(--flowchart-size) + 15px);
  width: var(--flowchart-border);
  height: calc(100% + 6px);
  background: rgb(230,230,230);
  border-radius: 30px;/* 縦線角の丸み, 不要ならこの一行削除 */
}

/* 番号部位デザイン */
.flowchart li::before {
  content: counter(flownum);
  counter-increment: flownum;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -.4em;/* 通常は 0, 横に並ぶタイトルとのバランスを見て調整 */
  left: 0;
  z-index: 2;
  width: var(--flowchart-size);
  height: var(--flowchart-size);
  border-radius: 50%;/* 番号円形, 四角形で良ければこの一行削除 */
  background: var(--flowchart-gradient);
  color: rgb(51,51,51);/* 番号文字色 */
  font-size: 36px;
  line-height:1;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif;  
}

/* ドットデザイン */
.flowchart li::after {
  content: "";
  display: block;
  position: absolute;
  top: .2em;/* 破線とのバランスを見て適宜調整 */
  left: calc(var(--flowchart-size) + 15px + 2px);
  width: calc(var(--flowchart-border) - 4px);
  height: calc(var(--flowchart-border) - 4px);
  border-radius: 50%;
  background: rgb(85,171,197);/* ドットの色 */
}

/* 工程タイトル */
.flowchart-title {
  position: relative;
  font-size:1.4em;
  font-weight: 600;
  color:#444;
  line-height: 1;/* 大きめの文字は 1.2 〜 1.4 程度で調整すると良い */
}

/* タイトル横破線 デザイン */
.flowchart-title::before {
  content: "";
  display: block;
  position: absolute;
  top: .5em;
  left: calc(calc(calc(var(--flowchart-border) / 2) + 30px) * -1);
  width: 28px;
  border-top: 1px dashed rgb(150,150,150);/* 破線の太さと色 */
}

/* p要素を利用した場合の調整 */
.flowchart li p {
  margin: 1em 0 !important;
}
.flowchart li p:last-of-type {
  margin-bottom: 0 !important;
}
@media screen and (max-width: 600px) {
:root {
  --flowchart-size: 34px;/* 番号大きさ 変更可 */
  --flowchart-border: 10px;/* 縦線太さ 変更可(12px以上) */
}
.flowchart::before {
  left: calc(var(--flowchart-size) + 8px);
}
.flowchart li {
  padding: 0 0 0 calc(var(--flowchart-size) + var(--flowchart-border) + 8px + 30px);
}
.flowchart li::after {
  left: calc(var(--flowchart-size) + 8px + 2px);
}
/* 番号部位デザイン */
.flowchart li::before {
  top: -.4em;/* 通常は 0, 横に並ぶタイトルとのバランスを見て調整 */
  color: rgb(51,51,51);/* 番号文字色 */
  font-size: 16px; 
}
.flowchart-title {
  font-size: 4.4vw;
  line-height:1.4;
}
.flowchart-title::before {
  top: .2em;
}
.flowchart li p:last-of-type {
	font-size:15px;
}
.flowchart-content img {
	float:left;
	max-width:100%;
	margin:10px 0;
}
}
/*fee */
  .fee {
    width: 99%;
	margin:0 auto 0;
  }
  .fee th {
	  background:#EEE;
	  font-weight:500;
	  text-align:left;
	  padding:0 10px;
	  vertical-align: middle;
	  line-height: 1.5;
	  border: #CCC 1px solid;
  }
  .fee td {
	  line-height:1.3;
	  padding:10px 15px;
	  vertical-align:middle;
	  border: #CCC 1px solid;
	  }  
@media screen and (max-width: 640px) {
  .fee {
    width: 98%;
	font-size:14px;
  }	
  .fee th {
    border-bottom: none;
	padding:5px 10px;
  }
  .fee th,
  .fee td {
    display: block;
  }
  .fee td {
	padding:10px;
  }  
}
/*YouTube埋め込み*/
.video-container-outer{
	max-width:600px;
	width:100%;
}
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
	background: #000;
}
.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.newsbox {
	width: 96%;
	max-width: 1500px;
	margin:0 auto;
	padding:30px 0 20px;
	overflow:hidden;
}
.newsboxtitle {
  font-size: 26px;
  letter-spacing: 2px;
  color: #60410b;
  line-height: 1.4;
  font-weight: 600;
  padding-bottom: 5px;
  border-bottom: #60410b 1px dashed;
  line-height:1.4;
  margin-bottom:20px;
}
.newsboxcontent {
	margin:10px 0;
	overflow:hidden;
}
.newsboxcontent_title {
	font-size: 19px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #60410b;
    line-height: 1.5;
    margin-bottom: 5px;	
}
@media screen and (max-width: 640px) {
.newsbox {
	padding:10px 0 10px;
	overflow:hidden;
}
.newsboxtitle {
	font-size: 20px;
	letter-spacing: 1px;
	text-align: center;
}
.newsboxcontent_title {
	font-size: 18px;
}
}</pre></body></html>