@charset "UTF-8";
/*
 Theme Name: PORTFOLIOベーシック（子テーマ）
 Template: portfolio-basic
 Version: 1.0.0
*/

/* 例：投稿一覧をPCで３カラム、SPで1カラムに変更。*/
.articleList-list {
  grid-template-columns: repeat(3,1fr);
}

/* -----------------------
TOPページ
----------------------- */
.mv-titleArea--black-shadow .mv-title {
	text-shadow : none;
}

/* -----------------------
SKILLページ
----------------------- */
/* ボックス */
.skill-card {
	height: 400px;
	background-color: #fff;
	padding: 30px 25px;
}
.skill-card figure {
	text-align: center;
}
.skill-card h2 {
	text-align: center;
	margin: 0 auto 0;
}
/* 星レビュー */
.star5_rating{
    position: relative;
    z-index: 0;
    display: inline-block;
    white-space: nowrap;
    color: #CCCCCC;
}
.star5_rating:before, .star5_rating:after{
    content: '★★★★★';
}
.star5_rating:after{
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #ffcf32;
}
.star5_rating[data-rate="5"]:after{ width: 100%; } /* 星5 */
.star5_rating[data-rate="4.5"]:after{ width: 90%; } /* 星4.5 */
.star5_rating[data-rate="4"]:after{ width: 80%; } /* 星4 */
.star5_rating[data-rate="3.5"]:after{ width: 70%; } /* 星3.5 */
.star5_rating[data-rate="3"]:after{ width: 60%; } /* 星3 */
.star5_rating[data-rate="2.5"]:after{ width: 50%; } /* 星2.5 */
.star5_rating[data-rate="2"]:after{ width: 40%; } /* 星2 */
.star5_rating[data-rate="1.5"]:after{ width: 30%; } /* 星1.5 */
.star5_rating[data-rate="1"]:after{ width: 20%; } /* 星1 */
.star5_rating[data-rate="0.5"]:after{ width: 10%; } /* 星0.5 */
.star5_rating[data-rate="0"]:after{ width: 0%; } /* 星0 */

@media screen and (max-width: 767px) {/* 767pxからの適用 */
  .articleList-list {
    grid-gap: 15px;
    grid-template-columns: 1fr;
  }
}