/* カードイラスト */

.ca-illust {
	width: 300px;
	height: 280px;
	background-color:#CC0000;
	vertical-align: middle;
	margin: 0px 0px;
	border-radius: 6px;
	box-shadow: 6px 6px 4px #aaa;
	display: inline-block;
}


/* 幅960以下のときは横幅を280pxにする*/
@media (max-width: 960px){
.ca-illust {
	width: 280px;
  }
}


/* 幅600以下のときは横幅を100%にする*/
@media (max-width: 600px){
.ca-illust {
	width: 100%;
  }
}



.ca-illust a {
	text-decoration: none;
}


.ca-illust h1 {
	text-align: center;
	font-size: 18px;
	margin: 6px 24px  6px  24px;
	line-height: 125%;
	border-radius: 6px 6px 6px 6px;
	background-color:#CC0000;
	color: white;
}

.ca-illust p {
	text-top
	font-size: 16px;
	padding: 0px 16px;
	margin: 0px 0px;
	border-radius: 0px 0px 6 6;
	background-color:#fff;
	color: #5c5c5c;
}

.ca-illust img {
	width: 300px;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}

/* 幅960以下のときは横幅を280pxで縮小*/
@media (max-width: 960px){
.ca-illust img {
	width: 280px;
	height: auto;
	border-radius: 6px 6px 6px 6px;
}
}

/* 幅600以下のときは縦幅180で合わせる(原寸大)*/
@media (max-width: 600px){
.ca-illust img {
	width: auto;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}
}


.ca-illust:hover {
	box-shadow: 6px 6px 4px #aaa;
	opacity: 0.7;
}

/* カード4コマ */

.ca-4koma {
	width: 300px;
	height: 280px;
	background-color:#2668F1;
	vertical-align: middle;
	margin: 0px 0px;
	border-radius: 6px;
	box-shadow: 6px 6px 4px #aaa;
	display: inline-block;
}


/* 幅960以下のときは横幅を280pxにする*/
@media (max-width: 960px){
.ca-4koma {
	width: 280px;
  }
}


/* 幅600以下のときは横幅を100%にする*/
@media (max-width: 600px){
.ca-4koma {
	width: 100%;
  }
}



.ca-4koma a {
	text-decoration: none;
}


.ca-4koma h1 {
	text-align: center;
	font-size: 18px;
	margin: 6px 24px  6px  24px;
	line-height: 125%;
	border-radius: 6px 6px 6px 6px;
	background-color:#2668F1;
	color: white;
}

.ca-4koma p {
	text-top
	font-size: 16px;
	padding: 0px 16px;
	margin: 0px 0px;
	border-radius: 0px 0px 6 6;
	background-color:#fff;
	color: #5c5c5c;
}

.ca-4koma img {
	width: 300px;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}

/* 幅960以下のときは横幅を280pxで縮小*/
@media (max-width: 960px){
.ca-4koma img {
	width: 280px;
	height: auto;
	border-radius: 6px 6px 6px 6px;
}
}

/* 幅600以下のときは縦幅180で合わせる(原寸大)*/
@media (max-width: 600px){
.ca-4koma img {
	width: auto;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}
}


.ca-4koma:hover {
	box-shadow: 6px 6px 4px #aaa;
	opacity: 0.7;
}


/* カードマンガ */

.ca-manga {
	width: 300px;
	height: 280px;
	background-color:#2524EF;
	vertical-align: middle;
	margin: 0px 0px;
	border-radius: 6px;
	box-shadow: 6px 6px 4px #aaa;
	display: inline-block;
}


/* 幅960以下のときは横幅を280pxにする*/
@media (max-width: 960px){
.ca-manga {
	width: 280px;
  }
}


/* 幅600以下のときは横幅を100%にする*/
@media (max-width: 600px){
.ca-manga {
	width: 100%;
  }
}



.ca-manga a {
	text-decoration: none;
}


.ca-manga h1 {
	text-align: center;
	font-size: 18px;
	margin: 6px 24px  6px  24px;
	line-height: 125%;
	border-radius: 6px 6px 6px 6px;
	background-color:#2524EF;
	color: white;
}

.ca-manga p {
	text-top
	font-size: 16px;
	padding: 0px 16px;
	margin: 0px 0px;
	border-radius: 0px 0px 6 6;
	background-color:#fff;
	color: #5c5c5c;
}

.ca-manga img {
	width: 300px;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}

/* 幅960以下のときは横幅を280pxで縮小*/
@media (max-width: 960px){
.ca-manga img {
	width: 280px;
	height: auto;
	border-radius: 6px 6px 6px 6px;
}
}

/* 幅600以下のときは縦幅180で合わせる(原寸大)*/
@media (max-width: 600px){
.ca-manga img {
	width: auto;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}
}


.ca-manga:hover {
	box-shadow: 6px 6px 4px #aaa;
	opacity: 0.7;
}


.ca-special {
	width: 300px;
	height: 280px;
	background-color:#B013CB;
	vertical-align: middle;
	margin: 0px 0px;
	border-radius: 6px;
	box-shadow: 6px 6px 4px #aaa;
	display: inline-block;
}


/* 幅960以下のときは横幅を280pxにする*/
@media (max-width: 960px){
.ca-special {
	width: 280px;
  }
}


/* 幅600以下のときは横幅を100%にする*/
@media (max-width: 600px){
.ca-special {
	width: 100%;
  }
}



.ca-special a {
	text-decoration: none;
}


.ca-special h1 {
	text-align: center;
	font-size: 18px;
	margin: 6px 24px  6px  24px;
	line-height: 125%;
	border-radius: 6px 6px 6px 6px;
	background-color:#B013CB;
	color: white;
}

.ca-special p {
	text-top
	font-size: 16px;
	padding: 0px 16px;
	margin: 0px 0px;
	border-radius: 0px 0px 6 6;
	background-color:#fff;
	color: #5c5c5c;
}

.ca-special img {
	width: 300px;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}

/* 幅960以下のときは横幅を280pxで縮小*/
@media (max-width: 960px){
.ca-special img {
	width: 280px;
	height: auto;
	border-radius: 6px 6px 6px 6px;
}
}

/* 幅600以下のときは縦幅180で合わせる(原寸大)*/
@media (max-width: 600px){
.ca-special img {
	width: auto;
	height: 180px;
	border-radius: 6px 6px 6px 6px;
}
}


.ca-special:hover {
	box-shadow: 6px 6px 4px #aaa;
	opacity: 0.7;
}