@charset "utf-8";
.mein{ margin:0px auto; padding: 0px; text-align: center; }
li { list-style: none; }
.item { width: 250px; margin: 0 auto; padding: 32px 0; display: flex; align-items: center; }
#detail { align-items: center; text-align: left;}
.point { font-family: serif; margin-top: 20px; }
.point span { background-color: #E67373; color: #fff; padding: 3px 5px; }

.contents {
  max-width: 300px;
  margin: 10px auto;
}
a.btn_01 {
  display: inline-block;
  justify-content: center;
  align-items: center;
  width: 100%;
  /*height: 50px;*/
  box-sizing: border-box;
  background: #fff;
  position: relative;
}
a.btn_01 span {
  display: inline-block;
  justify-content: center;
  text-align: center;
  width: 100%;
  height: 50px;
  background: #fff;
  box-sizing: border-box;
  color: #333;
  /*font-size: 14px;*/
  letter-spacing: 0.1em;
  text-decoration: none;
  box-shadow: 0px 5px 12px #CAD4E2, -6px -6px 12px #FFF;
  border-radius: 10px;
  position: absolute;
  top: -5px;
  left: 0;
  transition-duration: 0.2s;
		padding-top: 2px;
}
a.btn_01:hover span {
  left: 0;
  top: 0;
  box-shadow: 0 0 4px #bdc8d8, -2px -2px 4px #FFF;
}

/*===============================================
●SP 画面の横幅が640pxまで
===============================================*/
@media only screen and (max-width: 768px) {
.pc { display: none !important; }
.sp { display: block !important; }
img { max-width: 100%; }
.blok { padding: 24px;}
#content ui { display: flex; flex-wrap: wrap; justify-content: space-between; }
#content li { width: 32%; }
a.anchor { display: block; padding-top: 170px; margin-top: -170px;	margin-right: 20px; }
.btn .sp { margin: 0 auto; }
.contents { margin: 40px auto; margin-top: 20px;}
}
/*===============================================
●PC 画面の横幅が640px
===============================================*/
 @media only screen and (min-width: 768px) {
.pc { display: block !important; }
.sp { display: none !important; }
#content ui { display: flex; flex-wrap: wrap; justify-content: space-between; }
#content li { width: calc(16% - 3px); }
#content li img {width: 100%; }
.blok { width: 50%;}
.blok { float: left; box-sizing:border-box; padding: 30px;} 
.item { width: auto; padding: 24px; text-align: center;}
.anchor img { width: 80%; }
.seiza { width: 70%; }
.seiza img { width: 60%;}
.item_box { display: table-cell; text-align: center; }
.item_box img { vertical-align: middle;}
a.anchor { display: block; padding-top: 160px; margin-top: -160px;	margin-right: 20px; }
.panel {margin: 0 auto;}
}
/*===============================================
　250731
===============================================*/
#horoscope .best {font-family: serif;font-weight: bold;}
#horoscope h1 {background: url(/excludes/ozio/community/horoscope/img/common/sp_line.jpg) no-repeat 100% 30%/100%;color: #333;line-height: 1.6;font-size: 1.4em;text-align:center;}
#horoscope h1 span {background-color: #fff;display: inline-block;padding: 0 1em;font-size: 1.2em;line-height:1.4;}
#horoscope .mmdd { text-align: center; font-size: 1.8em; font-weight: 600; margin: 0.5em 1em 2em;}
#horoscope dl {width: 90%;margin: 3% auto;font-size: 1.2em;}
#horoscope dt {font-size: 1.4em;display: inline-block;margin-right: 1em;}
#horoscope dd {margin: 0.5em 1em 2em;font-weight: 400;font-size: 1.0em;font-family: "Noto Sans Japanese", sans-serif;color: #444;}
#horoscope dt:nth-of-type(odd) {color: #ce900c;}
#horoscope dt:nth-of-type(even) {color: #641bcd;}

@media only screen and (min-width: 768px) {
 #horoscope h1 {background: url(/excludes/ozio/community/horoscope/img/common/pc_line.jpg) no-repeat 100% 0/100%;font-size: 2.0em;line-height: 2;}
 #horoscope h1 span{font-size: 1.4em;padding: 0 2em;}
 #horoscope dl {width: max-content;font-size: 1.4em;}
 #horoscope .mmdd {text-align: center; font-size: 2.4em; font-weight: 600;margin: 0;}
}
