@charset "utf-8";
/* CSS Document */
.section {padding: 10px 0 30px;}
#content{width: 950px;}
#LeftCont{width:100%;}
#toc_container{display: none;}
.Main_Img{
    width: 95%;
    display: flex;
    justify-content: center;
    margin: 0 auto 30px;
}
.Main_Img img{}
.toc_list .icon_moon:before{display:none;}
.share{display:none;}
.post p {
	width: 95%;
	margin: 0 auto 30px;
	color: #000;
}
.back_number_wrap p{
    font-size: 17px;
    margin: 0 auto 30px;	
}
.back_number_wrap p.back_number_title{
    color: #dd3e85;
    font-size: 20px;
    font-weight: bold;	
}

/*リセットcss*/
button {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
}
button:focus {
  outline: none;
}

/*見出し*/
#LeftCont .post.horoscope h2.pt2,h2.pt2{
    width: 95%;
    position: relative;
    padding: 20px 10px;
    text-align: center;
    border: 2px solid #5d3111 !important;
    background: #fff;
    margin: 70px auto 40px !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;	
    color: #5d3111;
}
#LeftCont .post.horoscope h2.pt2:before,h2.pt2:before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/ornament_0426.png), url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/ornament_0426_02.png)#fff;
    background-repeat: no-repeat;
    background-size: 6%;
    background-position: left 2px top 2px, right 2px top 2px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
#LeftCont .post.horoscope h2.pt2:after,h2.pt2:after {
	content: "";
	top: -40px;
	left: calc(50% - 40px);
	width: 80px;
	height: 80px;
	border: 2px solid #5d3111;
	border-radius: 50%;
	background: #fff;
	position: absolute;
}
#LeftCont .post.horoscope h2.pt2 span,h2.pt2 span{
    max-width: 95%;
    position: relative;
    z-index: 2;
    text-align: left;
    font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}
#LeftCont .post .zodiac_rank h2,.back_number_wrap h2{
    width: 95%;
    color: #5d3111;
    font-size: 2rem;
    padding: 4px 15px 2px;
    border-left: 8px solid #ec5c9c;
    border-bottom: none;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background-color: #f8f8f8;
}
h2.pt2 i.icon_moon:before{top: -50px;}
#LeftCont .post.horoscope h2.pt2 i.icon_moon:before{top:0px;}

.back_number_wrap h2{width: 100%;}

.h2_wrap{
    display: flex;
    flex-wrap: wrap;
    position: relative;
    margin: 0 0 30px;
    align-items: center;	
}
.h2_wrap h2{}
.h2_wrap i{
    width: 12%;
    aspect-ratio: 248 / 43;
    display: block;
	position: absolute;
    left: 13%;	
}
.h2_wrap i.star5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star5.png);
    background-size: 100%;
}
.h2_wrap i.star4_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star4_5.png);
    background-size: 100%;
}
.h2_wrap i.star4{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star4.png);
    background-size: 100%;
}
.h2_wrap i.star3_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star3_5.png);
    background-size: 100%;
}
.h2_wrap i.star3{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star3.png);
    background-size: 100%;
}
.h2_wrap i.star2_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star2_5.png);
    background-size: 100%;
}
.h2_wrap i.star2{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star2.png);
    background-size: 100%;
}
.h2_wrap i.star1_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star1_5.png);
    background-size: 100%;
}
.h2_wrap i.star1{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star1.png);
    background-size: 100%;
}
#Content h3{
	color: #4e3413;
    margin: 0 15px 20px;
    padding: 3px 10px 3px;
    font-size: 21px;
    border-left: 6px #4e3413 solid;
    border-bottom: 1px dotted #4e3413;
}
/*blockquote*/
blockquote.image figcaption{
    width: max-content;
    max-width: 100%;
    margin: 0 auto 15px;
    display: flex;
    justify-content: center;
}
blockquote.image cite{
    width: max-content;
    max-width: 90%;
    max-block-size: fit-content;
    margin: 15px auto;
    text-align: left;	
}

/*ul*/
ul.custom{
    width: 90%;
    padding: 0;
    margin: 0 auto 50px;	
}
ul.custom li{
    font-size: 17px;
    margin: 0 0 10px;	
}
ul.back_number{
    padding: 0;
    width: 95%;
    margin: 30px auto;
    display: flex;
    flex-wrap: wrap;
}
ul.back_number li{
    list-style-type: none;
    margin: 0 5px 20px;	
}
ul.back_number li a{
    color: #ec5c9c;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid #ec5c9c;
    padding: 8px;
    border-radius: 5px;	
}
/*dl*/
dl.custom{
    width: 95%;
    /* background: #efefef; */
    margin: 0 auto 10px;
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
}
dl.custom dt:before{display: none;}
dl.custom dt{
    width: max-content;
    color: #fff;
    padding: 2px 5px;
    margin: 0 0 10px;	
}
dl.custom dd{
    width: 100%;
    font-size: 15px;
    margin: 0 0 10px;
    padding: 0 0 0 5px;
    color: #000;
    display: flex;
    flex-wrap: wrap;	
}
dl.custom dd:before{
    content: "";
    width: 5px;
    height: 5px;
    display: block;
    background: #000;
    border-radius: 100px;
    transform: translate(-4px,9px);	
}
dl.custom dd:nth-last-child(1){margin: 0;}
dl.custom.note{background: #fff0f0;}
dl.custom.note dt{background: #f12d2d;}
dl.custom.info{background: #f0fcff;}
dl.custom.info dt{background: #169abb;}

/*lity*/
.back_number_wrap {
    width: 950px;
    background: #fff;
    padding: 20px;
    max-height: 800px !important;
    overflow-y: scroll;	
}

.lity-close{z-index: 100000;}

/*今週の順位*/
.Ranking_text{
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}
.Ranking_text .Ranking{
    font-size: 40px;
    font-weight: bold;
    color: #5d3111;
}
.Ranking_text .Ranking.no1{color: #cda61f;}
.Ranking_text .Ranking.no2{color: #999a9a;}
.Ranking_text .Ranking.no3{color: #8f5b27;}

.Ranking_text .day{
    font-size: 22px;
    color: #5d3111;
    font-weight: bold;	
}
.Ranking_text .star{
    width: 18%;
    aspect-ratio: 248 / 43;
    display: block;
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star5.png);
    background-size: 100%;
    margin: 0 0 5px;	
}
.description i{
    width: 40%;
    aspect-ratio: 248 / 43;
    display: block;
    margin: 0 0 5px;
}
.description i.star5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star5.png);
    background-size: 100%;	
}
.description i.star4_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star4_5.png);
    background-size: 100%;	
}
.description i.star4{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star4.png);
    background-size: 100%;	
}
.description i.star3_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star3_5.png);
    background-size: 100%;	
}
.description i.star3{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star3.png);
    background-size: 100%;	
}
.description i.star2_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star2_5.png);
    background-size: 100%;	
}
.description i.star2{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star2.png);
    background-size: 100%;	
}
.description i.star1_5{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star1_5.png);
    background-size: 100%;	
}
.description i.star1{
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star1.png);
    background-size: 100%;	
}
/*記事のチラ見せ*/
#Content.collapsed {
  max-height: 150px; /* チラ見せする高さを調整 */
  overflow: hidden;
  position: relative;
}
#Content.collapsed::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 50px;
  background: linear-gradient(to bottom, rgba(255,255,255,0), white); /* フェード効果 */
}
#Content.expanded {
  max-height: none;
}
#toggleButton{
    width: 90%;
    font-size: 20px;
    color: #fff;
    background: #ec5c9c;
    box-shadow: rgb(179 67 117) 0px 3px 0px;
    margin: 10px auto 20px;
    padding: 10px;
    border-radius: 100px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
#toggleButton:after{
    content: "";
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/arrow_w.png);
    background-size: 100%;
    width: 13px;
    aspect-ratio: 30 / 46;
    position: absolute;
    margin: auto;
    right: 30px;
    transform: rotate(90deg);
}
#toggleButton.active:after{transform: rotate(270deg);}

/*週間12星座占いランキング*/
#Ranking_list {
    width: 90%;
    counter-reset: ranking;
    list-style: none;
    padding: 0;
    margin: auto;
    /* display: flex; */
    flex-wrap: wrap;
    column-count: 2;
    column-gap: 20px;
}
#Ranking_list li {
    break-inside: avoid;
    width: 95%;
    counter-increment: ranking;
    position: relative;
    margin: 0 0 20px;
    padding: 0 0 0 35px;
    min-height: 140px;
}
#Ranking_list li::before {
    content: counter(ranking);
    position: absolute;
    font-weight: bold;
    font-size: 30px;
    left: 0;
    display: flex;
    align-items: center;
    height: 100%;
    font-family: "游明朝体", "Yu Mincho", YuMincho, serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
#Ranking_list li:nth-child(1)::before{color: #cda61f;}
#Ranking_list li:nth-child(2)::before{color: #999a9a;}
#Ranking_list li:nth-child(3)::before{color: #8f5b27;}
#Ranking_list li a{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    color: #000;
	transform: translateY(20px);
}
#Ranking_list li img{width:100px; height:auto;}
#Ranking_list li .description{width: calc(100% - 110px);}
#Ranking_list li .description h3{
    font-size: 20px;
    margin: 0 0 5px;	
}
#Ranking_list li .description .star{
    width: 40%;
    aspect-ratio: 248 / 43;
    display: block;
    background: url(https://kizuna3.com/uranai/wp-content/themes/kizuna/img/star5.png);
    background-size: 100%;
    margin: 0 0 5px;
}
#Ranking_list li .description p{font-size: 14px;}

/*テーブル*/
table.custom {
    width: 95%;
    margin: 50px auto;
}
table.custom caption {
    color: #ffffff;
    background: #42a396;
    text-align: center;
    font-size: 20px;
    padding: 10px 0;
    caption-side: top;
}
table.custom th {
    color: #393939;
    background-color: #f8feff;
}
table.custom th:nth-child(1) {
    width: 35%;
}

@media (max-width: 991px) {
#content {width: 100%;}
.section {
    padding: 0;
}
.Main_Img{
    margin: 0 auto 5vw;
    aspect-ratio: 715 / 330;
    overflow: hidden;
}
.Main_Img img{
    height: 100%;
    width: auto;
    max-width: unset;
}
#Ranking_list {
    width: 90%;
    column-count: 1;
    column-gap: 0;
}
#Ranking_list li img {
    width: 30%;
    height: auto;
}
#Ranking_list li::before {
    font-size: 8vw;
}	
#LeftCont .post.horoscope h2.pt2, h2.pt2 {
    width: 97%;
    padding: 3vw 1vw;
    margin: 8vw auto 8vw !important;
    font-size: 3.5vw;
}
#LeftCont .post.horoscope h2.pt2:after, h2.pt2:after {
    top: -6vw;
    left: calc(50% - 10%);
    width: 15vw;
    height: 15vw;
}	
h2.pt2 i.icon_moon:before {
    top: -7vw;
    transform: translate(-1vw);
    width: 5vw;
}
#Ranking_list li {
    margin: 0 0 5vw;
    padding: 0 0 0 10vw;
	min-height: auto;
}
#Ranking_list li .description {
    width: calc(100% - 35%);
}
#Ranking_list li .description h3 {
    font-size: 4vw;
}	
#Ranking_list li .description p {
    font-size: 3.5vw;
}	
#toggleButton {
    font-size: 4vw;
    margin: 5vw auto 3vw;
    padding: 2vw;
}
ul.custom {
    width: 90%;
    padding: 0;
    margin: 3vw auto 3vw 8vw;
}
ul.custom li {
    color: #000;
    font-size: 3.7vw;
    margin: 0 0 2vw;
}	
#toggleButton:after {
    width: 4%;
    aspect-ratio: 30 / 46;
    right: 5vw;
}	
.h2_wrap i{
    width: 27%;
    left: 27%;
}
.description i {
    width: 50%;
    margin: 0 0 1vw;
}
.Ranking_text .Ranking{
    font-size: 7vw;
}	
.Ranking_text .day {
    font-size: 4vw;
}	
.back_number_wrap {
    width: 95%;
    padding: 3vw;
    max-height: 85vh !important;
    margin: auto;
}
.back_number_wrap p {
    font-size: 3.5vw;
    margin: 0 auto 3vw;
    line-height: 1.5;
}
.h2_wrap {
    margin: 0 0 5vw;
}	
p.back_number_title {
    font-size: 3.7vw;
}	
ul.back_number li a {
    padding: 1.5vw;
}
.back_number_wrap p.back_number_title{font-size: 3.7vw;}	
.back_number_wrap h2{
	width: 100%;
	font-size: 4vw;
	padding: 1vw 0 1vw 2vw;
}
.back_number_wrap .h2_wrap i{
	width: 27%;
	left: 22%;
}
dl.custom {
    margin: 0 auto 3vw;
    padding: 2vw;
}
dl.custom dt {
    font-size: 3.5vw;
    padding: 0.5vw 1.5vw;
    margin: 0 0 1vw;
}
dl.custom dd {
    font-size: 3.5vw;
    margin: 0 0 3vw;
    padding: 0 0 0 2vw;
}
dl.custom dd:before {
    width: 1vw;
    height: 1vw;
    transform: translate(-2vw, 2.5vw);
}	
#LeftCont .post.horoscope h2.pt2 i.icon_moon:before{top: 5vw;}

table.custom caption {
	font-size: 3.7vw;
    padding: 1.5vw;
}
table.custom th:nth-child(1){
	font-size: 3.5vw;
    padding: 1vw;	
}
#LeftCont .post.horoscope h2.pt2 span,h2.pt2 span{
    font-size: 3.7vw !important;
}

.lity-close{
	width: 15vw !important;
    height: 15vw !important;
	font-size: 15vw !important;
}
#Ranking_list li a{
	transform: translateY(0);
}
	
	
}