@charset "utf-8";

/*============================
解答速報
=============================*/
.font_normal{
	font-weight: normal;
}

.under_yell{
	padding: 0 0.15em;
	background-image: linear-gradient(to top,#fbe54f 0, #fbe54f 40%, transparent 40%);
}

.bg_red_block{
	background-color: #900e0e;
	background-image: repeating-linear-gradient(0deg,transparent 0,transparent 20px,rgba(255,255,255,0.25) 20px,rgba(255,255,255,0.25) 21px),repeating-linear-gradient(90deg,transparent 0,transparent 20px,rgba(255,255,255,0.25) 20px,rgba(255,255,255,0.25) 21px);
	background-size: auto,auto;
	background-position: center center;
	background-attachment: scroll,scroll;
}

.bg_lightred_block{
	background-color: #deacac;
	background-image: repeating-linear-gradient(0deg,transparent 0,transparent 20px,rgba(255,255,255,0.25) 20px,rgba(255,255,255,0.25) 21px),repeating-linear-gradient(90deg,transparent 0,transparent 20px,rgba(255,255,255,0.25) 20px,rgba(255,255,255,0.25) 21px);
	background-size: auto,auto;
	background-position: center center;
	background-attachment: scroll,scroll;
}

.bg_gray_block{
	background-color: #ccc;
	background-image: repeating-linear-gradient(0deg,transparent 0,transparent 20px,rgba(255,255,255,0.25) 20px,rgba(255,255,255,0.25) 21px),repeating-linear-gradient(90deg,transparent 0,transparent 20px,rgba(255,255,255,0.25) 20px,rgba(255,255,255,0.25) 21px);
	background-size: auto,auto;
	background-position: center center;
	background-attachment: scroll,scroll;
}

/*****
解答速報LIVE
*****/
/***LIVE配信が無い場合***/
.no_live_section .no_live_ttl{
	background-color: rgba(47,81,209,0.65);
}

/*****
LIVEイレギュラー
*****/
/***ページヘッダー***/
.saiten_header{
	width: 100%;
	background-color: #e7d4d5;
}
.page_header{
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
	position: relative;
}

/*****
WEB採点サービス
*****/
/***タイトル***/
.ttl_gradingservice{
	border: solid 6px #db2929;
	background-color: rgba(255,255,255,0.65);
	background-image: url("../img/kaisoku_webttl_bg01.png"),url("../img/kaisoku_webttl_bg02.png");
}
.icon_kentei{
	background-color: #db2929;
}

/***推奨点***/
.guess_area{
	margin-bottom: 2em;
}

/***注意書き調整***/
.service_note{
	background-color: rgba(255,255,255,0.85);
}

/***直前チェックリンク***/
.check_book_img{
	flex-shrink: 0;
	width: 17%;
	max-width: 150px;
	margin-left: 1em;
}


/*****
設計製図課題対策
*****/
.section_inner{
	padding: 2em;
	background-color: #fff;
}
.event_present_cont{
	margin: 2em 0;
	background-color: #fff;
	border: 1px solid #ccc;
}
.event_present_cont h4{
	font-weight: bold;
	color: #fff;
	text-align: center;
	margin: 0;
	padding: 0.5em;
	background: #d80000;
}
.present_list{
	display: flex;
	justify-content: space-between;
}
.present_list li{
	flex: 1;
	padding: 1em;
	border-left: 1px dotted #ccc;
}
.present_list li:first-child{ border: none; }
.present_list h5{
	font-weight: bold;
	text-align: center;
}
.present_list .kadai_present_img{
	text-align: center;
}
.event_present_text{
	padding: 1em;
}

.event_info_table{}

/*** コンテンツリンク ***/
/*テキストリンク*/
.link_text_box{
	margin-bottom: 0.5em;
}
.link_text_box a{
	display: flex;
	align-items: center;
	text-decoration: none;
	color: #333;
	width: 100%;
	height: 100%;
	padding: 1em 1em 1em 3em;
	border: solid 1px #ccc;
	background-image: url("../img/content_arrow.png");
	background-repeat: no-repeat;
	background-position: left 1em center;
}
.link_text_box a p{
	margin: 0;
}
.link_text_box a:hover{
	background-color: #ddd;
}

.link_2col .link_text_box{}

/*おすすめブロック*/
.recom_pickup_area{
	margin-top: 2em;
}

.recom_pickup_box{
	padding: 1em;
	border: solid 1px #ccc;
}
.recom_pickup_ttl{
	font-weight: bold;
	color: #fff;
	margin-bottom: 0.5em;
	padding: 0.5em;
	background-color: #d80000;
}
.recom_pickup_detail{
	display: flex;
}
.recom_pickup_detail .pickup_img{
	flex-shrink: 0;
	margin-right: 1em;
}

/***コース一覧***/
.course_list_table{
	font-size: 1.3rem;
}

.course_list_table h3 a{
	font-weight: bold;
	text-decoration: none;
}
.course_list_table h3 a:before{
	top: 2px;
}
.course_list_table h4{
	font-weight: bold;
}

/*****
総評
*****/
.tbl_suisyou{
	margin-bottom: 0.5em;
	border: solid 1px #ccc;
}
.tbl_suisyou th,
.tbl_suisyou td{
	text-align: left;
	padding: 0.5em;
}
.tbl_suisyou th{
	white-space: nowrap;
}

/***平行定規プレゼント***/
.lbp_img{
	flex-shrink: 0;
	text-align: center;
	margin: 0 2em 0 0;
}

/***解答速報 利用方法***/
.how_step{
	margin: 4em 0 0 0;
}
.how_step .ttl_how{
	display: inline-block;
	font-size: 3.2rem;
	font-weight: bold;
	text-align: center;
	color: #fff;
	margin-bottom: 1em;
	text-shadow: 0 0 4px #000;
	position: relative;
}
.how_step .ttl_how .ttl_how_icon{
	display: block;
	max-width: 102px;
	height: 100%;
	max-height: 102px;
	position: absolute;
	top: 0;
	right: 0;
	transform: translate(110%,-15%);
}
.how_step .ttl_how .ttl_how_icon img{
	width: auto;
	height: 100%;
}

.how_step .how_arrow{
	font-size: 6.4rem;
	text-align: center;
	color: #fbe54f;
}

.step_box{
	text-align: center;
	padding: 1em;
	background-color: #fff;
	box-shadow: 0.5em 0.5em 0 rgba(0,0,0,0.5);
}
.step_box .ttl_step{
	width: 200px;
	margin: 0 auto 1em auto;
}

.step_box2{
	padding: 1em;
	border-radius: 0.5em;
	background-color: #fff;
	box-shadow: 0.5em 0.5em 0 rgba(0,0,0,0.5);
}


/***YouTube配信***/
#kaisoku_youtube{}

.bn_live{
	width: 94%;
	max-width: 1200px;
	margin: 0 auto 2em auto;
}
.sec_ttl{
	width: 100%;
	max-width: 970px;
	margin: 0 auto 0.5em auto;
}
.bn_live_text{
	padding: 1em;
	background-color: #fff;
}


/* ===========================================
	MediaQueries
=========================================== */

/* PC----------------------------- */
@media screen and (min-width: 768px){
	/*****
	LIVEイレギュラー
	*****/
	/***ページヘッダー***/
	.saiten_header{}
	.page_header{}
	
	
	/*****
	設計製図課題対策
	*****/
	/*** コンテンツリンク ***/
	/*テキストリンク*/
	.link_text_box{}
	
	.link_2col{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.link_2col .link_text_box{
		width: 48%;
	}
	
	/*おすすめブロック*/
	.recom_pickup_area{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		font-size: 1.4rem;
	}
	
	.recom_pickup_box{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		width: 48%;
	}
	
	/***解答速報 利用方法***/
	#step1_box{}
	#step2_box{
		margin-top: 2em;
	}
	#step3_box{
		margin-top: 4em;
	}
	.step_box{
		font-size: 1.8rem;
		width: 300px;
		border-radius: 0.5em;
	}
	#step1_box .step_img{
		margin: 2em auto 0 auto;
	}
	#step2_box .step_img{
		margin: 0.5em auto 0 auto;
	}
	#step3_box .step_img{
		margin: 2em auto 0 auto;
	}
	
	.step_box2{
		display: flex;
		justify-content: space-around;
		align-items: center;
		font-size: 1.8rem;
	}
	.step4_img01{
		width: 186px;
		margin: 1em auto 0 auto;
	}
	.step4_img02{
		width: 196px;
		margin: 1em auto 0 auto;
	}
	
}

/* スマホ----------------------------- */
@media screen and (max-width: 767px){
	/*****
	LIVEイレギュラー
	*****/
	/***ページヘッダー***/
	.saiten_header{}
	.page_header{
		font-size: clamp(1.2rem,2.4vw,1.8rem);
	}
	
	/*****
	WEB採点サービス
	*****/
	/***直前チェックリンク***/
	.check_book_img{
		display: none;
	}
	
	
	/*****
	設計製図課題対策
	*****/
	.section_inner{
		padding: 1em;
	}
	
	.present_list{
		display: block;
	}
	
	.event_info_table{}
	.event_info_table th,
	.event_info_table td{
		display: block;
	}
	
	/*** コンテンツリンク ***/
	/*テキストリンク*/
	.link_text_box{}
	
	/*おすすめブロック*/
	
	
	
	/***解答速報 利用方法***/
	.how_step .ttl_how{
		font-size: 2rem;
	}
	.step_box{
		margin-top: 1em;
	}
	.step_box:first-of-type{
		margin-top: 0;
	}
	.step_box .step_img{
		margin: 1em auto;
		width: 65%;
	}
	.step4_img01,
	.step4_img02{
		width: 50%;
		margin: 1em auto;
	}
	
}