.more {
	margin:0px auto;
    margin-top: 10px;
	width: 25%;
}

@media all and (max-width: 999px) {
.more {
	margin:0px auto;
    margin-top: 10px;
	width: 50%;
}
}

/*----- Top page 3カラムカードレイアウト----*/

/* カードレイアウト部分をラッピングし、
Flexboxを指定"space-between"で各アイテムを均等に配置し、
最初と最後のアイテムを端に寄せます。*/
#cardlayout-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    margin: 0.5em auto;
/*    max-width: 960px;*/
    max-width: 100%;/*1140px*/	
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
}

/* リンクテキストの下線を非表示 */
a.card-link {
    text-decoration: none;
}



/* カードレイアウト内の画像を幅いっぱいに表示 */
#cardlayout-wrap img {
    display: block;
    max-width: 100%;
    height: auto;
}

.card-figure {
    margin: 0;
    padding: 0;
}

/* カードレイアウトのタイトル部分 */
.card-title h2{
	font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    margin: 0.6em 0 0;
    color: #222;
	font-weight: 600;
    text-align: center;
    font-size: 140%;
}
.card-title h3{
    	font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    color: #555;
    text-align: center;
    font-size: 110%;
}


/* カードレイアウトの説明文部分 */
.card-text-tax {
    margin: 0;
    padding: 1em;
    color: #555;
	font-size: 90%;
}


/* 続き */
.card-next {
    margin: 0;
    padding: 1em;
    color: #555;
	font-size: 100%;
}

/* カードレイアウトを1カラムで配置 */
.card-list {
    margin: 0.5em auto;
	margin-bottom: 20px;
    padding: 0;
    width: 100%;
 /*   background: #f0f0f0;*/
	border: 1px solid #dddddd;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* カードレイアウトを1カラムで配置 */
.card-list-no {
    margin: 0.5em auto;
	margin-bottom: 20px;
    padding: 0;
    width: 100%;
	height: 100%;
}


.card-list h2 {
/*  position: absolute;
  top: 10%;
  left: 30%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);

  color: #fff;
    background:rgba(153, 153, 153, 0.9);*/
	padding: 8px 8px;
  font-size: 18px;
    font-weight: 500;
    
}


/*--------　画像hover テキスト　-------------*/


.rcm-box {
  width: 100%;
  position: relative;
  overflow: hidden;
   background: rgba(255,255,255, 0.8);  
}
.rcm-box img {
  display: block;
  width: 100%;
  opacity: 0.8;
  -webkit-transition: opacity 0.4s, transform 0.4s;
  transition: opacity 0.4s, transform 0.4s;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}
.rcm-box:hover img {
  opacity: 0.3;
 /* -webkit-transform: scale3d(1.1, 1.1, 1);
  transform: scale3d(1.1, 1.1, 1);*/
}
.rcm-overlay {
  opacity: 0;
  position: absolute;
  top: 40%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
  -webkit-transition: opacity 0.4s;
  transition: opacity 0.4s;
}
.rcm-box:hover .rcm-overlay {
  opacity: 1;
}

.rcm-overlay p{color: #111111;}




/*
.rcm-contents {
  padding: 0 10px 5px;
  color: #111111;
  -webkit-transform: scale3d(0, 0, 1);
  transform: scale3d(0, 0, 1);
  -webkit-transition: transform 0.4s, color 0.4s;
  transition: transform 0.4s, color 0.4s;
}
.rcm-box:hover .rcm-contents {
  color: #111111;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}
*/







/* 画面幅300px以上の場合カードレイアウトを2カラムで配置 */
@media all and (min-width: 300px) {
	
.card-title h2{
    font-size: 120%;
}
.card-title h3{
    font-size: 90%;
	
	
}
}




/* 画面幅768px以上の場合カードレイアウトを4カラムで配置 
@media all and (min-width: 768px) {
    .card-list {
        width: calc(90% / 3); 
    }
}


@media all and (min-width: 992px) {
    .card-list {
        width: calc(90% / 4);
    }
    

    #cardlayout-wrap::after{
        content: "";
        display: block;
        width: calc(100% / 4);
    }
}
*/


/* 画面幅768px以上の場合カードレイアウトを2カラムで配置 */
@media all and (min-width: 494px) {
    .card-list {
		float: left;
        width: calc(90% / 2); /* 100%幅を2で割るという指定 */
    }
	  .card-list-no {
		float: left;
        width: calc(90% / 2); /* 100%幅を2で割るという指定 */
    }
	
}

/* 画面幅992px以上の場合カードレイアウトを3カラムで配置 */
@media all and (min-width: 992px) {
    .card-list {
		float: left;
        width: calc(90% / 3); /* 100%幅を3で割るという指定 */
    }
    	  .card-list-no {
		float: left;
        width: calc(90% / 3); /* 100%幅を2で割るという指定 */
    }
	
	
	
/* 最後の行が3列より少ない場合左寄せにレイアウトさせる */
    #cardlayout-wrap::after{
        content: "";
        display: block;
        width: calc(90% / 3);
    }

}


/* 最後の行が3列より少ない場合 768以下は表示しない */
@media all and (max-width: 768px) {

	  .card-list-no {
		display: none;
    }
	
}
	


/*--------------------------------------------------------------------------*/


/**/
.sample1 {

	overflow:		hidden;
	margin:			10px 8px 10px 16px;
	position:		relative;	/* 相対位置指定 */
		border: 1px solid #dddddd;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.sample1 .caption {
	font-size:		;
	text-align: 		center;
	padding-top:		20px;
	color:			#222;
}
.sample1 .mask {
	width:			100%;
	height:			100%;
	position:		absolute;	/* 絶対位置指定 */
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgba(255,255,255,0.9);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.sample1:hover .mask {
	opacity:		1;	/* マスクを表示する */
}


/* カードレイアウトを1カラムで配置 */
.sample1-list {
    margin: 0.5em auto;
    padding: 0;
    width: 100%;
 /*   background: #f0f0f0;*/
	border: 1px solid #dddddd;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

/* 画面幅768px以上の場合カードレイアウトを2カラムで配置 */
@media all and (min-width: 768px) {
    .sample1 {
        width: calc(90% / 2); /* 100%幅を2で割るという指定 */
    }
}

/* 画面幅992px以上の場合カードレイアウトを3カラムで配置 */
@media all and (min-width: 992px) {
    .sample1 {
        width: calc(90% / 3); /* 100%幅を3で割るという指定 */
    }
}
    

/* カードレイアウトのタイトル部分 */
.sample1  h2{
	font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    margin: 0.6em 0 0;
    color: #222;
	font-weight: 600;
    text-align: center;
    font-size: 140%;
}
.sample1  h3{
    	font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    color: #222;
    text-align: center;
    font-size: 105%;
}
.sample1  p{
        margin: 0;
    padding: 1em;
    color: #222;
	font-size: 90%;
}