@charset "utf-8";
/* CSS Document */
/*news-normal（「コース紹介」ブロックで使用）
---------------------------------------------------------------------------*/
.news-normal * {
	margin: 0;padding: 0;
	text-align: center;
}

/*画面幅600px以上の追加指定*/
	@media screen and (min-width:600px) {

	.news-normal * {
		margin: 0;
		padding: 0;
		text-align: center;
}
	}/*追加指定ここまで*/
	
	/*画面幅600px以上の追加指定*/
	@media screen and (min-width:600px) {

	/*テキストブロック*/
	.news-normal .text {
		flex: 1;
	}
}


/*ブロック１個あたり*/
.news-normal .list {
	background-color: #fff;
	color: var(--base-inverse-color);	/*文字色。冒頭のbase-inverse-colorを読み込みます。*/
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: 3px 3px 10px rgba(0,0,0,0.1);
	position: relative;
}

	/*画面幅600px以上の追加指定*/
	@media screen and (min-width:600px) {

	/*ブロック１個あたり*/
	.news-normal .list {
		display: flex;
		padding: 3rem;
		gap: 2rem;	/*画像とテキストの間のスペース。２文字分。画像がない場合はこれは適用されません。*/
	}
	
	}/*追加指定ここまで*/

.news-normal h4 {
    font-size: 1.3rem;
    line-height: 1.5;
    margin: 1.5rem auto 1rem;
}
@media screen and (min-width: 700px) {
    #news_contents h4 {
        font-size: 1.6rem;
    }
}
/*---------------------------------------------------------------------------*/
		
		
#news_contents{
	padding: 80px 20px 40px;
}

#news_contents h4{
	padding-bottom: 15px;
	border-bottom: 1px solid #000846;
}

#news_contents p{
	margin-top: 15px;
	text-align: left;
}

#news_contents h5{
	font-size: 15px;
	font-weight: bold;
	border-bottom: solid 1px #111;
	display: inline-block;
	text-align: left;
	margin-top: 30px;
}

#news_contents h6{
	font-size: 14px;
	font-weight: bold;
	margin-top: 20px;
	text-align: left;
}

/*画面幅700px以上の追加指定*/
	@media screen and (min-width:700px) {

	#news_contents{
	padding: 130px 10vw 60px;
}
		
		#news_contents h2{
	margin-bottom: 40px;
}
		
		#news_contents h4{
	font-size: 1.6rem;
}
		#news_contents h5{
	font-size: 1.6rem;
	font-weight: bold;
	border-bottom: solid 1px #111;
	display: inline-block;
}

#news_contents h6{
	font-size: 1.4rem;
	font-weight: bold;
}
		
		}/*追加指定ここまで*/

/*news_grid
---------------------------------------------------------------------------*/
.news_grid .news_list * {margin: 0;padding: 0;}

	/*画面幅800px以上の追加指定*/
	@media screen and (min-width:800px) {

	/*listブロック全体を囲むブロック*/
	.news_grid{
		display: grid;
		grid-template-columns: repeat(2, 1fr);	/*3列にする指定。4列にしたければrepeat(4, 1fr)とする。*/
		gap: 2vw;	/*ブロックの間に空けるマージン的な指定*/
	}

	}/*追加指定ここまで*/


/*ボックス１個あたり*/
.news_grid .news_list {
    display: inline-block;
	margin-bottom: 0;	/*ボックスの下に空けるスペース*/
	position: relative;
	background: #fff;	/*背景色*/
	color: #333;		/*文字色*/
	padding: 0;	/*ボックス内の余白。２文字分。*/
}

	/*画面幅800px以上の追加指定*/
	@media screen and (min-width:800px) {

	/*ボックス１個あたり*/
	.news_grid .news_list {
		margin-bottom: 0;	/*下に空けるスペースをなくす*/
	}
		
		

	}/*追加指定ここまで*/

	/*画面幅800px以上の追加指定*/
	@media screen and (min-width:800px) {
		.news_grid .news_list h4 {
			font-size: 1.8rem;	/*文字サイズを140%に*/
			display: flex;
			justify-content: center;
			align-items: center;
}

	}/*追加指定ここまで*/

/*news_grid02
---------------------------------------------------------------------------*/
.news_grid02 .news_list * 
		{
			margin: 0;
			padding: 0;
		}
		
		.news_grid02{
		display: grid;
		grid-template-columns: repeat(2, 1fr);	/*3列にする指定。4列にしたければrepeat(4, 1fr)とする。*/
		gap: 2vw;	/*ブロックの間に空けるマージン的な指定*/
		margin-top: 20px;
	}
		
	/*画面幅800px以上の追加指定*/
	@media screen and (min-width:700px) {
	/*listブロック全体を囲むブロック*/
	.news_grid02{
		display: grid;
		grid-template-columns: repeat(3, 1fr);	/*3列にする指定。4列にしたければrepeat(4, 1fr)とする。*/
		gap: 2vw;	/*ブロックの間に空けるマージン的な指定*/
		margin-top: 20px;
	}

	}/*追加指定ここまで*/


/*ボックス１個あたり*/
.news_grid02 .news_list {
    display: inline-block;
	margin-bottom: 0;	/*ボックスの下に空けるスペース*/
	position: relative;
	background: #fff;	/*背景色*/
	color: #333;		/*文字色*/
	padding: 0;	/*ボックス内の余白。２文字分。*/
}

	/*画面幅800px以上の追加指定*/
	@media screen and (min-width:800px) {

	/*ボックス１個あたり*/
	.news_grid02 .news_list {
		margin-bottom: 0;	/*下に空けるスペースをなくす*/
	}
		
		

	}/*追加指定ここまで*/


.news_grid02 figcaption{
	color: #959595;
	text-align: left;
	font-size: 13px;
}

.news_box{
	margin-top: 20px;
	padding: 0 20px 20px;
	border: 1px solid #ccc;
}

.news_img{
	width: 60%;
}

.news_img02{
	width: 60%;
	text-align: center;
	margin: 0 auto;
		}

.img_c{
	text-align: center;
	margin-top: 20px;
}
		
.insta_btn {
  display: inline-block;
  text-align: center;/*中央揃え*/
  color: #2e6ca5;/*文字色*/
  font-size: 20px;/*文字サイズ*/
  text-decoration: none;/*下線消す*/
}

.insta_btn:hover {/*ホバー時*/
  color:#668ad8;/*文字色*/
  transition: .5s;/*ゆっくり変化*/
}

.insta_btn .insta{/*アイコンの背景*/
  position: relative;/*相対配置*/
  display: inline-block;
  width: 50px;/*幅*/
  height: 50px;/*高さ*/
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;/*グラデーション①*/
  overflow: hidden;/*はみ出た部分を隠す*/
  border-radius: 13px;/*角丸に*/

}

.insta_btn .insta:before{/*グラデーションを重ねるため*/
  content: '';
  position: absolute;/*絶対配置*/
  top: 23px;/*ずらす*/
  left: -18px;/*ずらす*/
  width: 60px;/*グラデーションカバーの幅*/
  height: 60px;/*グラデーションカバーの高さ*/
  background: -webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
  background: radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);/*グラデーション②*/
}

.insta_btn .fa-instagram {/*アイコン*/
  color: #FFF;/*白に*/
  position: relative;/*z-indexを使うため*/
  z-index: 2;/*グラデーションより前に*/
  font-size: 35px;/*アイコンサイズ*/
  line-height: 50px;/*高さと合わせる*/
}