@charset "UTF-8";
/* sp(320px) */

.card_container {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	grid-template-rows: auto;
	column-gap: 1.8%;
	row-gap: 1.5em;
}
.card_container .card {
	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 4;
	column-gap: 0;
	row-gap: 0;

	border: 1px solid #ffe2f2;
	border-radius: 1em;
	padding: 2em 1.8em;
}
.card_container .card .status {
	font-size: 14px;
	font-weight: bold;
	line-height: 1.0;
	color: #fff;
	text-align: center;
	border-radius: 20px;
	padding: .6em 1em;
}
.card_container .card .status.status1 {
	background-color: #fa7fc5;
}
.card_container .card .status.status2 {
	background-color: #fa7fc5;
}
.card_container .card .status.status3 {
	background-color: #53cdc9;
}
.card_container .card .status.status4 {
	background-color: #fa7fc5;
}
.card_container .card .status.status5 {
	background-color: #b3b3b3;
}

.card_container .card .intro {
	margin-block-start: 1em;
	display: grid;
	grid-template-columns: 36% auto;
	grid-template-rows: auto;
	column-gap: 4%;
	row-gap: 0;
}
.card_container .card .intro .msg {
	font-size: 13px;
	line-height: 1.4;
}
.card_container .card .intro .name {
	margin-block-start: 1em;
	font-size: 17px;
	line-height: 1.4;
	font-weight: bold;
}
.card_container .card .intro .name rt {
	font-weight: normal;
	font-size: 11px;
	line-height: 2;
}
.card_container .card .intro .name a {
	color: #000;
	border-block-end: 1px solid #000;
	padding-block-end: .2em;
}
.card_container .card .intro .name a:hover {
	text-decoration: none;
	opacity: 0.7;
}
.card_container .card .links {
	margin-block-start: 1em;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto;
	column-gap: .8em;
	row-gap: 0;
}
.card_container .card .links a {
	font-size: 13px;
	font-weight: bold;
	line-height: 1.8;
	color: #000;
	text-align: center;
	border: 1px solid #000;
	border-radius: 1em;
}
.card_container .card .links a:hover {
	text-decoration: none;
}
.card_container .card .info {
	margin-block-start: 1em;
}
.card_container .card .info dl {
	margin-block: 0;
	font-size: 13px;
	line-height: 1.4;
/*	border: 1px solid #000;*/
}
.card_container .card .info dt {
	color: #fa7fc5;
}
.card_container .card .info dd {
	margin-inline-start: 0;
}

.card_container .card .info dl:nth-of-type(1) {
	display: grid;
	grid-template-columns: 2.5em auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 0;
}
.card_container .card .info dl:nth-of-type(2) {
	display: grid;
	grid-template-columns: 4.5em auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 0;
	margin-block-start: .5em;
}
.card_container .card .info dl:nth-of-type(3) {
	display: grid;
	grid-template-columns: 2.2em auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 0;
	margin-block-start: .7em;
}
/* 戦術 */
.divination a {
	display: inline-block;
	font-size: 13px;
	line-height: 1;
	color: #fa3ea8;
	border: 1px solid #fa3ea8;
	border-radius: .4em;
	padding: .2em .7em;
	margin-inline-start: .2em;
	margin-block-end: .4em;
}
.divination a:hover {
	text-decoration: none;
}



@media handheld, print, screen and (min-width: 375px) {
/* iphone6 */


/* end of media query(iphone6) */	
}



@media handheld, print, screen and (min-width: 414px) {
/*  iPhone6 Plus */

/* end of media query(iPhone6 Plus) */	
}



@media handheld, print, screen and (min-width: 480px) {
/* tablet */

.card_container .card .status {
	font-size: 15px;
}
.card_container .card .intro .msg {
	font-size: 14px;
}
.card_container .card .intro .name {
	font-size: 17px;
	margin-block-start: .5em;
}
.card_container .card .intro .name rt {
	font-size: 12px;
}
.card_container .card .links a {
	font-size: 14px;
}
.card_container .card .info dl {
	font-size: 14px;
}


	@media (-webkit-min-device-pixel-ratio: 2){
		

	/* end of media query(retina) */	
	}

/* end of media query(tablet) */	
}



@media handheld, print, screen and (min-width: 620px) {
/* iPad */


/* end of media query(iPad) */	
}



@media handheld, print, screen and (min-width: 835px) {
/* pc */

.card_container .card .status {
	font-size: 16px;
}
.card_container .card .intro .msg {
	font-size: 15px;
}
.card_container .card .intro .name {
	font-size: 18px;
	margin-block-start: 1em;
}
.card_container .card .intro .name rt {
	font-size: 12px;
}
.card_container .card .links a {
	font-size: 15px;
}
.card_container .card .info dl {
	font-size: 15px;
}
/* 戦術 */
.divination a {
	font-size: 15px;
}

/* end of media query(pc) */
}