@charset "utf-8";
/* CSS Document */

/* 2021 12月追加 */
.Cfeat_Topimg_Wrap{
    background-color: #601f1f;
}
.Cfeat_Topimg{
    width: 100%;
    height: auto;
}
.h3_Cfeat_Wrap{
    padding: 16px 0 16px 0;
    margin-bottom: 8px;
}
.h3_Cfeat_Col1{
    background: #4e8f3e; /* Old browsers */
    background: -moz-linear-gradient(top, #4e8f3e 0%, #4b8d3b 32%, #448836 51%, #3c8430 61%, #19711a 88%, #0f6b14 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #4e8f3e 0%,#4b8d3b 32%,#448836 51%,#3c8430 61%,#19711a 88%,#0f6b14 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #4e8f3e 0%,#4b8d3b 32%,#448836 51%,#3c8430 61%,#19711a 88%,#0f6b14 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4e8f3e', endColorstr='#0f6b14',GradientType=0 ); /* IE6-9 */    
}
.h3_Cfeat_Col2{
    background: #db8740; /* Old browsers */
    background: -moz-linear-gradient(top, #db8740 0%, #c86537 56%, #ba452b 96%, #ba452a 97%, #b95700 99%, #c06a18 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #db8740 0%,#c86537 56%,#ba452b 96%,#ba452a 97%,#b95700 99%,#c06a18 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #db8740 0%,#c86537 56%,#ba452b 96%,#ba452a 97%,#b95700 99%,#c06a18 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#db8740', endColorstr='#c06a18',GradientType=0 ); /* IE6-9 */    
}
.h3_Cfeat_Col3{
    background: #0093da; /* Old browsers */
    background: -moz-linear-gradient(top, #0093da 0%, #0091d9 17%, #0082d2 32%, #0079cf 48%, #0074c9 57%, #0060a2 88%, #00568b 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #0093da 0%,#0091d9 17%,#0082d2 32%,#0079cf 48%,#0074c9 57%,#0060a2 88%,#00568b 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #0093da 0%,#0091d9 17%,#0082d2 32%,#0079cf 48%,#0074c9 57%,#0060a2 88%,#00568b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0093da', endColorstr='#00568b',GradientType=0 ); /* IE6-9 */    
}
.h3_Cfeat_Col4{
    background: #b93537; /* Old browsers */
    background: -moz-linear-gradient(top, #b93537 0%, #b93537 13%, #a92835 32%, #982033 52%, #761829 86%, #62151b 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #b93537 0%,#b93537 13%,#a92835 32%,#982033 52%,#761829 86%,#62151b 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #b93537 0%,#b93537 13%,#a92835 32%,#982033 52%,#761829 86%,#62151b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b93537', endColorstr='#62151b',GradientType=0 ); /* IE6-9 */    
}
.h3_Cfeat_Col5{
    background: #ae86d3; /* Old browsers */
    background: -moz-linear-gradient(top, #ae86d3 0%, #ae86d3 14%, #a276cc 31%, #905bbf 70%, #7c3cae 99%, #72349d 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ae86d3 0%,#ae86d3 14%,#a276cc 31%,#905bbf 70%,#7c3cae 99%,#72349d 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ae86d3 0%,#ae86d3 14%,#a276cc 31%,#905bbf 70%,#7c3cae 99%,#72349d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ae86d3', endColorstr='#72349d',GradientType=0 ); /* IE6-9 */    
}
.h3_Cfeat{
    color: #FFF;
    padding: 4px 0 4px 16px;
    font-size: 22px;
}
.h3_Cfeat2{
    color: #FFF;
    padding: 0 0 0 16px;
    font-size: 20px;
}

.Cfeat_TopWrap{
    background-color: #673b44;
    padding: 16px;
}
.Cfeat_Top{
    background-color: #fff6dc;
    padding: 16px;
    border: solid 2px #d4b75f;
    background-image: url(../img/Dytop_BenefFrame1.png),url(../img/Dytop_BenefFrame2.png),url(../img/Dytop_BenefFrame3.png),url(../img/Dytop_BenefFrame4.png);
    background-repeat: no-repeat;
    background-position: left top, right top, left bottom, right bottom;
    background-size: 8%;
    margin: 0 0 16px 0;
    text-align: center;
}
.Cfeat_Frameimg{
    height: auto;  
}
.Cfeat_Top_Txt {
    font-size: 20px;
    color: #555;
    padding: 16px 16px 0 16px;
    margin-bottom: 16px;
    line-height: 1.4;
    text-align: left;
}
.Cfeat_CmtWrap{
    background: #fff;
    border: solid 1px #d4b75f;
    padding: 8px;
    color: #654a1b;
    margin-left: 16px;
    width: 50%;
}
.Cfeat_Cmt{
    font-size: 16px;
    line-height: 1.3;
}
.Cfeat_SuppleWrap{
    background: #fff;
    padding: 16px 16px 0 16px;  
}
.Cfeat_Supple_Tit{
    font-size: 24px;
    color: #030080;
    font-weight: bold;
    padding: 16px 16px 0 16px;
    line-height: 1.4;
    text-align: left;
}
.Cfeat_Supple_Txt{
    font-size: 20px;
    color: #555;
    padding: 16px;
    line-height: 1.4;
    text-align: left;
}

.Cfeat_SGenre_Wrap{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 8px;
}
.Cfeat_SGenre_TopTxt {
    font-size: 20px;
    color: #555;
    padding: 0 16px 0 16px;
    margin-bottom: 16px;
    line-height: 1.4;
}
.Cfeat_SGenre_Txt {
    font-size: 18px;
    color: #555;
    padding: 16px 16px 0 16px;
    margin-bottom: 16px;
    line-height: 1.4;
    width: 50%;
}
.Cfeat_SGenre_img{
    width: 50%;
}
.Cfeat_SGenre_AlertTxt{
    width: 98%;
    padding: 1%;
    background: #dec8ff;
    font-size: 16px;
}
.Cfeat_Tab_Txt{
    font-size: 20px;
    color: #fffad0;;
    padding: 16px;
    line-height: 1.4;
}
.FTList_Cfeat{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 96% !important;
}
/* アコーディオン */
.tab {
    position: relative;
    margin-bottom: 1px;
    width: 100%;
    color: #fff;
    overflow: hidden;
  }
  .tab input[name] {
    position: absolute;
    opacity: 0;
    z-index: -1;
  }
  .opelabel {
    position: relative;
    display: block;
    padding: 0 0 0 16px;
    font-weight: bold;
    line-height: 2.5;
    cursor: pointer;
    color: #f8db7e;
    background: #951636;
    border: 4px solid #d4b046;
    box-sizing: border-box;
    font-size: 22px;
  }
  .tab-content {
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height .35s;
    -o-transition: max-height .35s;
    transition: max-height .35s;
    color: #000;
    line-height: 1.4;
  }
  /* :checked */
  .tab input[name]:checked ~ .tab-content {
    max-height: 100%;
  }
  /* Icon */
  .opelabel::after {
    position: absolute;
    right: 0;
    top: 0;
    display: block;
    width: 3em;
    height: 3em;
    text-align: center;
    -webkit-transition: all .35s;
    -o-transition: all .35s;
    transition: all .35s;
  }
  .tab input[name][type=checkbox] + label::after {
    content: "+";
  }
  .tab input[type=radio] + label::after {
    content: "\25BC";
  }
  .tab input[name][type=checkbox]:checked + label::after {
    transform: rotate(315deg);
  }
  .tab input[type=radio]:checked + label::after {
    transform: rotateX(180deg);
  }

@media (min-width: 1000px) {
    .Cfeat_Topimg_Wrap{
        margin: 0 calc(50% - 50vw);
    }
    .Cfeat_Topimg{
        display: block;
        width: 1000px;
        margin: 0 auto;
    }
    .Cfeat_TopWrap{
        margin: 0 calc(50% - 50vw);
    }
    .Cfeat_Top{
        margin: 0 auto 16px auto;
        width: 964px;
    }
    .tab{
        width: 1000px;
        margin: 0 auto;
    }
}

/* 初回追加 */    
.Cfeat_Mainimg{
	margin-bottom:16px;
}
.Cfeat_Bar{
	margin:2%;
}
.Cfeat_Txt{
    font-size: 20px;
    color: #654a1b;
    margin: 2% 2% 2% 2%;
	line-height: 1.2;
}
.Cfeat_Txt2{
    font-size: 30px;
    color: #e5449d;
    margin: 2% 2% 2% 2%;
	text-align:center;
	line-height: 1.5;
	font-weight:bold;
}
.Cfeat_Txt3{
	font-size: 30px;
    color: #1c27b2;
    margin: 2% 2% 2% 2%;
	text-align:center;
	line-height: 1.4;
	font-weight:bold;
}
.Cfeat_Txt_Center{
	text-align:center;
    font-size: 20px;
    color: #654a1b;
    margin: 2% 2% 2% 2%;
	line-height: 1.2;
}
.Cfeat_TxtBig{
	font-size: 30px;
	font-weight:bold;
	background: linear-gradient(transparent 50%, #ffff66 50%);
}

/* チャットルーム説明 */
.Cfeat_Manu_Wrap{
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	margin: 2% 2% 2% 2%;
}
.Cfeat_Manu_img{
	width:25%;
}
.Cfeat_Manu_img img{
	width:100%;
	height:auto;
}
.Cfeat_Manu_Descr{
	width:75%;
}
.Cfeat_DesTitle{
	font-size: 24px;
	color:#e5449d;
	font-weight:bold;
	margin: 0 2% 2% 2%;
}
.Cfeat_FeeTit{
	font-size: 24px;
	color: #3b154f;
    background: #edd1fc;
    margin: 2%;
    padding: 12px 0 12px 0;
	text-align:center;
}

/* ピックアップ占い師 */
.Cfeat_P_wrap{
	display:-webkit-box;/*--- Android4.3以下ブラウザ用 ---*/
	display:-ms-flexbox;
	display:flex;
	flex-wrap: wrap;
}
.Cfeat_P{
	margin:2% 0;
	width:50%;
	}
.Cfeat_PName{
	background:#3d45ae;
	font-size: 24px;
	text-align:center;
	color: #FFF;
	padding:2%;
	margin: 2% 2% 2% 2%;
}
.Cfeat_PWrap{
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	margin: 2% 2% 2% 2%;
}
.Cfeat_Pimg{
	width:30%;
}
.Cfeat_Pimg img{
	width:144px;
	height:192px;
}
.Cfeat_PProf{
	width:70%;
}
.Cfeat_Pyears{
	 font-size: 20px;
	font-weight:bold;
	color:#4a3dae;
}
.Cfeat_Comment{
	height:170px;
	background:#fffae6;
	border:solid 1px #ae9a69;
    font-size: 20px;
	padding:2%;
    margin: 2% 2% 2% 2%;
	color: #654a1b;
	line-height: 1.3;
}
.Cfeat_ComTxt{
	margin-bottom:2%;
}
.Cfeat_Notice{
	background:#feefa2;
	border:solid 1px #ca4b74;
    font-size: 18px;
	padding:2%;
    margin: 2% 2% 2% 2%;
	color: #c40a45;
	line-height: 1.2;
}
.Cfeat_GenreWrap{
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	justify-content: space-evenly;
	font-size: 40px;
	margin:4% 0;
}
.Cfeat_Genre{
	font-weight:bold;
	color: #e5449d;
	background: linear-gradient(transparent 50%, #ffff66 50%);
    width: 18%;
    text-align: center;
}

.Cfeat_Title{
	font-size: 24px;
    background: #ca1274;
    color: #FFF;
    font-weight: bold;
    padding: 20px 15px;
}


.Button_blueWrap a:hover, .Button_blueWrap a:link, .Button_blueWrap a:visited, .Button_blueWrap a:active {
    text-decoration: none;
}
.Button_blue {
	margin: 1%;
    padding: 4%;
    border-radius: 50px;
    box-shadow: 0px 4px 3px -3px #3a3a3a;
    text-align: center;
    border: #cda455 5px solid;
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    text-shadow: 1px 1px 2px rgb(0 0 0 / 60%);
    background: #5454b9;
    background: -moz-linear-gradient(top, #5454b9 0%, #4d4daf 22%, #37378f 71%, #2d2d81 100%);
    background: -webkit-linear-gradient(top, #5454b9 0%, #4d4daf 22%, #37378f 71%, #2d2d81 100%);
    background: linear-gradient(to bottom, #5454b9 0%, #4d4daf 22%, #37378f 71%, #2d2d81 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5454b9', endColorstr='#2d2d81',GradientType=0 );
}
.Button_blue_red {
    background: #e91659;
    background: -moz-linear-gradient(top, #e91659 0%, #cf0e4d 30%, #b7053c 67%, #8d012a 100%);
    background: -webkit-linear-gradient(top, #e91659 0%, #cf0e4d 30%, #b7053c 67%, #8d012a 100%);
    background: linear-gradient(to bottom, #e91659 0%, #cf0e4d 30%, #b7053c 67%, #8d012a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e91659', endColorstr='#8d012a',GradientType=0 );
}

.PerList_AllWrap{
	display:-webkit-box;/*--- Android4.3以下ブラウザ用 ---*/
	display:-ms-flexbox;
	display:flex;
	}