/*はじめての方へ：アコーディオンメニュー*/

.an-title {
	margin: 0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #3e4b75), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #3e4b75);
	background: -moz-linear-gradient(#5e6ea2, #3e4b75);
	background: -o-linear-gradient(#5e6ea2, #3e4b75);
	background: -ms-linear-gradient(#5e6ea2, #3e4b75);
	background: linear-gradient(#5e6ea2, #3e4b75);}
.an-title a {
	background: url("../js/sprite-w.png") 10px 8px no-repeat;
	display: block;
	padding: 8px 10px;
	padding-left: 32px;
	margin: 0;
	color: #fff;
	text-decoration: none;
	font-weight: normal;
	border-bottom: 1px solid rgba(33, 36, 126, 0.5);
	border-bottom: 1px solid #353EAA;}
.an-title:hover,
.an-title.open {
	background-color: #5e6ea2;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #889ad3), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #889ad3);
	background: -moz-linear-gradient(#5e6ea2, #889ad3);
	background: -o-linear-gradient(#5e6ea2, #889ad3);
	background: -ms-linear-gradient(#5e6ea2, #889ad3);
	background: linear-gradient(#5e6ea2, #889ad3);}
.an-title.open a { background-position: 10px -32px;}
.an-title + div { padding: 10px; }
/* Pre hide sections with JavaScript on--- */
.an-title+div {
	display: none;}
/* CSS3 Animation example--- */
.an-list .an-title + div {
	height: 0px;
	padding: 0px;
	overflow: hidden;
	background: #000;
	display: block!important;
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition:all 0.3s ease;
	transition: all 0.3s ease;}
.an-list .content_l {
	padding: 10px;
	color: #06002E;}
.an-list .an-title.open + div {
/*	height: auto;*/
	height: 100%;
	background: rgba(255, 255, 255, 0.8) url(../image/tex);}
.an-list a {
	text-decoration: none!important;
	color: #fff!important;
	text-shadow:0 0 0 #000!important;}
.aco_list_title {
	margin: 10px auto;
	color: #FF0;}
	
	
/*コラム一覧：占い師プロフのコラム*/
@media screen and (min-width:481px){
.an-title-prof {
	margin: 0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #3e4b75), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #3e4b75);
	background: -moz-linear-gradient(#5e6ea2, #3e4b75);
	background: -o-linear-gradient(#5e6ea2, #3e4b75);
	background: -ms-linear-gradient(#5e6ea2, #3e4b75);
	background: linear-gradient(#5e6ea2, #3e4b75);}
.an-title-prof a {
	background:rgba(0, 0, 61, 0.5);
	display: block;
	padding: 8px 10px;
	padding-left: 5px;
	margin: 0;
	color: #fff;
	text-decoration: none;
	font-weight: normal;
	border-bottom: 1px solid rgba(33, 36, 126, 0.5);
	border-bottom: 1px solid #353EAA;}
.an-title-prof:hover,
.an-title-prof.open {
	background-color: #5e6ea2;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #889ad3), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #889ad3);
	background: -moz-linear-gradient(#5e6ea2, #889ad3);
	background: -o-linear-gradient(#5e6ea2, #889ad3);
	background: -ms-linear-gradient(#5e6ea2, #889ad3);
	background: linear-gradient(#5e6ea2, #889ad3);}
.an-title-prof.open a { background-position: 10px -32px;}
.an-title-prof + div { padding: 10px; }
/* Pre hide sections with JavaScript on--- */
.an-title-prof+div {
	display: none;}
/* CSS3 Animation example--- */
.an-list-prof .an-title-prof + div {
	height: 0px;
	padding: 0px;
	overflow: hidden;
	background: #000;
	display: block!important;
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition:all 0.3s ease;
	transition: all 0.3s ease;}
.close .date_prof:after{
    content: "";
    position: relative;
    top: -5px;
    left: 8px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);} 
.open .date_prof:after{
    content: "";
    position: relative;
    top: 1px;
    left: 5px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);}
.an-list-prof .content_l_prof {
	padding: 10px;
	color: #fff;}
.an-list-prof .an-title-prof.open + div {
/*	height: auto;*/
	height: 100%;
/*	background: rgba(255, 255, 255, 0.8) url(../image/tex);*/
	background: rgba(0, 0, 61, 0.5);}
.an-list-prof a {
	text-decoration: none!important;
	color: #fff!important;
	text-shadow:0 0 0 #000!important;}
.aco_list_title {
	margin: 10px auto;
	color: #FF0;}
h5.an-title-prof.close{
	padding: 0;
	border-bottom: none;}
h5.an-title-prof.open{
	padding: 0;
	border-bottom: none;}
.all-col{
	text-align: right;
	display: block;
	margin: 10px;}
}

/*コラム一覧：占い師プロフのコラム*/
@media screen and (max-width:480px){
.an-title-prof {
	margin: 0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #3e4b75), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #3e4b75);
	background: -moz-linear-gradient(#5e6ea2, #3e4b75);
	background: -o-linear-gradient(#5e6ea2, #3e4b75);
	background: -ms-linear-gradient(#5e6ea2, #3e4b75);
	background: linear-gradient(#5e6ea2, #3e4b75);}
.an-title-prof a {
	background: rgba(0, 0, 61, 0.5);
	font-size: 0.8em;
	display: block;
	padding: 8px 10px;
	padding-left: 5px;
	margin: 0;
	color: #fff;
	text-decoration: none;
	font-weight: normal;
	border-bottom: 1px solid rgba(33, 36, 126, 0.5);
	border-bottom: 1px solid #353EAA;}
.an-title-prof:hover,
.an-title-prof.open {
	background-color: #5e6ea2;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #889ad3), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #889ad3);
	background: -moz-linear-gradient(#5e6ea2, #889ad3);
	background: -o-linear-gradient(#5e6ea2, #889ad3);
	background: -ms-linear-gradient(#5e6ea2, #889ad3);
	background: linear-gradient(#5e6ea2, #889ad3);}
.an-title-prof.open a { background-position: 10px -32px;}
.an-title-prof + div { padding: 10px; }
/* Pre hide sections with JavaScript on--- */
.an-title-prof+div {
	display: none;}
/* CSS3 Animation example--- */
.an-list-prof .an-title-prof + div {
	height: 0px;
	padding: 0px;
	overflow: hidden;
	background: #000;
	display: block!important;
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition:all 0.3s ease;
	transition: all 0.3s ease;}
.close .date_prof:after{
    content: "";
    position: relative;
    top: -5px;
    left: 8px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);}
.open .date_prof:after{
    content: "";
    position: relative;
    top: 1px;
    left: 5px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);}

  
    .date_prof{
    font-size: 0.8em;
    }
.an-list-prof .content_l_prof {
	padding: 10px;
	color: #fff;}
.an-list-prof .an-title-prof.open + div {
/*	height: auto;*/
	height: 100%;
/*	background: rgba(255, 255, 255, 0.8) url(../image/tex);*/
	background: rgba(0, 0, 61, 0.5);}
.an-list-prof a {
	text-decoration: none!important;
	color: #fff!important;
	text-shadow:0 0 0 #000!important;}
.aco_list_title {
	margin: 10px auto;
	color: #FF0;}
h5.an-title-prof.close{
	border-bottom: none;}
h5.an-title-prof.open{
	border-bottom: none;}
.all-col{
	text-align: right;
	display: block;
	margin: 5px;}
}
@media screen and (max-width:300px){

.an-title-prof a {
	background: rgba(0, 0, 61, 0.5);
	font-size: 0.8em;
	display: block;
	padding: 8px 10px;
	padding-left: 5px;
	margin: 0;
	color: #fff;
	text-decoration: none;
	font-weight: normal;
	border-bottom: 1px solid rgba(33, 36, 126, 0.5);
	border-bottom: 1px solid #353EAA;}
}

/*コラム一覧：アコーディオンメニュー*/
@media screen and (min-width:481px){
.an-title-col {
	margin: 0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #3e4b75), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #3e4b75);
	background: -moz-linear-gradient(#5e6ea2, #3e4b75);
	background: -o-linear-gradient(#5e6ea2, #3e4b75);
	background: -ms-linear-gradient(#5e6ea2, #3e4b75);
	background: linear-gradient(#5e6ea2, #3e4b75);}
.an-title-col a {
/*	background: url("../js/sprite-w.png") 10px 8px no-repeat;*/
	background: rgba(0, 0, 61, 0.5);
	display: block;
	padding: 8px 10px;
	padding-left: 32px;
	margin: 0;
	color: #fff;
	text-decoration: none;
	font-weight: normal;
	border-bottom: 1px solid rgba(33, 36, 126, 0.5);
	border-bottom: 1px solid #353EAA;
/*	border-bottom: 1px solid yellow;*/}
.an-title-col:hover,
.an-title-col.open {
	background-color: #5e6ea2;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #889ad3), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #889ad3);
	background: -moz-linear-gradient(#5e6ea2, #889ad3);
	background: -o-linear-gradient(#5e6ea2, #889ad3);
	background: -ms-linear-gradient(#5e6ea2, #889ad3);
	background: linear-gradient(#5e6ea2, #889ad3);}
.an-title-col.open a { background-position: 10px -32px;}
.an-title-col + div { padding: 10px; }
/* Pre hide sections with JavaScript on--- */
.an-title-col+div {
	display: none;}
/* CSS3 Animation example--- */
.an-list-col .an-title-col + div {
	height: 0px;
	padding: 0px;
	overflow: hidden;
	background: #000;
	display: block!important;
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition:all 0.3s ease;
	transition: all 0.3s ease;}
.close .date_col:after{
    content: "";
    position: relative;
    top: -5px;
    left: 8px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);}


.open .date_col:after{
    content: "";
    position: relative;
    top: 1px;
    left: 5px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);}


.date_col{
float: right;
display: inline-block;
}
.an-list-col .content_l_col {
	padding: 10px;
	color: #06002E;}
.an-list-col .content_l_col p {
	color: #fff;}
.an-list-col .an-title-col.open + div {
/*	height: auto;*/
	height: 100%;
	background: rgba(0, 0, 61, 0.5);}
.an-list-col a {
	text-decoration: none!important;
	color: #fff!important;
	text-shadow:0 0 0 #000!important;}
.aco_list_title-col {
	margin: 10px auto;
	color: #FF0;}
}

	

/*コラム一覧：アコーディオンメニュー*/
@media screen and (max-width:480px){
.an-title-col {
	margin: 0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #3e4b75), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #3e4b75);
	background: -moz-linear-gradient(#5e6ea2, #3e4b75);
	background: -o-linear-gradient(#5e6ea2, #3e4b75);
	background: -ms-linear-gradient(#5e6ea2, #3e4b75);
	background: linear-gradient(#5e6ea2, #3e4b75);}
.an-title-col a {
/*	background: url("../js/sprite-w.png") 10px 8px no-repeat;*/
	background: rgba(0, 0, 61, 0.5);
	display: block;
	padding: 8px 10px;
	padding-left: 3px;
	margin: 0;
	color: #fff;
	text-decoration: none;
	font-weight: normal;
	border-bottom: 1px solid rgba(33, 36, 126, 0.5);
	border-bottom: 1px solid #353EAA;
/*	border-bottom: 1px solid yellow;*/}
.an-title-col:hover,
.an-title-col.open {
	background-color: #5e6ea2;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #889ad3), color-stop(0.00, #5e6ea2));
	background: -webkit-linear-gradient(#5e6ea2, #889ad3);
	background: -moz-linear-gradient(#5e6ea2, #889ad3);
	background: -o-linear-gradient(#5e6ea2, #889ad3);
	background: -ms-linear-gradient(#5e6ea2, #889ad3);
	background: linear-gradient(#5e6ea2, #889ad3);}
.an-title-col.open a { background-position: 10px -32px;}
.an-title-col + div { padding: 10px; }
/* Pre hide sections with JavaScript on--- */
.an-title-col+div {
	display: none;}
/* CSS3 Animation example--- */
.an-list-col .an-title-col + div {
	height: 0px;
	padding: 0px;
	overflow: hidden;
	background: #000;
	display: block!important;
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition:all 0.3s ease;
	transition: all 0.3s ease;}
.date_col{
    float: right;
    font-size: 0.8em;
    line-height: inherit;
    width: 23%;
}
.close .date_col:after{
    content: "";
    position: relative;
    top: -1px;
    left: 8px;
    float: right;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);}  

.open .date_col:after{
    content: "";
    position: relative;
    top: 6px;
    left: 5px;
    float: right;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);}

.an-list-col .content_l_col {
	padding: 10px;
	color: #06002E;}
.an-list-col .content_l_col p {
	color: #fff;}
.an-list-col .an-title-col.open + div {
/*	height: auto;*/
	height: 100%;
	background: rgba(0, 0, 61, 0.5);}
.an-list-col a {
	text-decoration: none!important;
	color: #fff!important;
	text-shadow:0 0 0 #000!important;}
.aco_list_title-col {
	margin: 10px auto;
	color: #FF0;}

}

@media screen and (max-width:420px){

.close .date_col:after{
    content: "";
    position: relative;
    top: -1px;
    left: 8px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);}   
.open .date_col:after{
    content: "";
    position: relative;
    top: 6px;
    left: 5px;
    margin: 0 5px;transition: all 0.2s ease-in-out;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);}.date_col{
    float: right;
    font-size: smaller;
    width: 30%;
    }
}

@media screen and (max-width:380px){
.date_col{
    float: right;
    font-size: 0.8em;
    width: 27%;}
}

@media screen and (max-width:380px){
.date_col{
    float: right;
    font-size: 0.8em;
    width: 30%;}
}

@media screen and (max-width:330px){
.date_col{
    float: right;
    font-size: 0.8em;
    width: 35%;}
.an-title-col a {
    font-size: 0.8rem;}
}