@charset "utf-8";
/* =============================================
	宅建LIVEセミナー
============================================= */
/*****
common
*****/
.font_red{
 color: #e04536;
}
.font_yell{
 color: #f1bb15;
}
.font_orange{
 color: #F99107;
}
.font_green{
 color: #006f5e;
}
.font_blue{
	color: #4472C4;
}
.font_purple{
	background-color: #873e86;
}

.bg_red{
	background-color: #e04536;
}
.bg_blue{
	background-color: #5eb6de;
}
.bg_yell{
	background-color: #f1bb15;
}
.bg_orange{
	background-color: #F99107;
}
.bg_green{
	background-color: #006f5e;
}
.bg_purple{
	background-color: #8368ab;
}

.float_left{
	float: left;
	margin-right: 1em;
}

.rotate90{
	display: inline-block;
	transform: rotateZ(-90deg);
}

.under_orange{
	padding: 0 0.15em;
	background-image: linear-gradient(to top,#f3cba4 0, #f3cba4 40%, transparent 40%);
}
.under_green{
	padding: 0 0.15em;
	background-image: linear-gradient(to top,#ebffc1 0, #ebffc1 40%, transparent 40%);
}
.under_purple{
	padding: 0 0.15em;
	background-image: linear-gradient(to top,#f3ecfe 0, #f3ecfe 40%, transparent 40%);
}

.btn_area{
	text-align: center;
	margin: 2em auto;
}
/*.btn_area .btn_live{
	font-size: 1.8em;
	width: 65%;
	margin: 0.5em auto;
	border-radius: 0.25em;
	background-color: #873e86;
	box-shadow: 0 4px 0 0 #512650;
	transition: transform 0.5s, box-shadow 0.5s;
}
.btn_area .btn_live:hover{
	box-shadow: 0 0 0 0 #873e86;
	transform: translateY(3px);
}
.btn_area .btn_live a{
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	padding: 0.5em 2.5em;
	background-image: url("/nikken/guidance/img/icon_arrow.png");
	background-repeat: no-repeat;
	background-size: 1em auto;
	background-position: right 1em center;
}
.btn_area .btn_live a:hover{
	text-decoration: none;
}
.btn_live a img{
	width: auto;
	height: 1em;
	margin-right: 0.5em;
}*/

.btn_push{
	font-size: clamp(1.6rem,2.88vw,2.9rem);
	width: 100%;
	margin: 0.5em auto;
	border-radius: 0.25em;
	box-shadow: 0 4px 0 0 #333;
	transition: transform 0.5s, box-shadow 0.5s;
}
.btn_push:hover{
	box-shadow: 0 0 0 0 #333;
	transform: translateY(3px);
}
.btn_push a{
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	padding: 0.5em 2.5em;
	background-image: url("/nikken/guidance/img/icon_arrow.png");
	background-repeat: no-repeat;
	background-size: 1em auto;
	background-position: right 1em center;
}
.btn_push a:hover{
	text-decoration: none;
}
.btn_push a img{
	width: auto;
	height: 1em;
	margin-right: 0.5em;
}

/*---------------------------------------------
	ページヘッダー
---------------------------------------------*/
#page_header{
	border-top: solid 10px #873e86;
	background-color: #f4f1cf;
	overflow: hidden;
}

.page_header{
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	padding-top: 2em;
}
.page_ttl{
	width: 88%;
	max-width: 1232px;
	margin: 0 auto;
}

.p_h_koushi{
	display: flex;
	justify-content: space-around;
	width: 100%;
}
.p_h_koushi li{
	width: 27.5%;
	position: relative;
}
.p_h_koushi li img{}

.p_h_bar{
	padding: 1em 0;
	background-color: #8368ab;
}
.p_h_bar_inner{
	width: 94%;
	max-width: 1400px;
	margin: 0 auto;
}
.p_h_date{
	max-width: 522px;
}
.p_h_place{
	max-width: 620px;
}

.anim01,
.anim02,
.anim03,
.anim04,
.anim05{
	transform: perspective(1120px) rotateY(-90deg);
	transform-origin: left center;
	transform-style: preserve-3d;
	animation-name: anim_rotate;
	animation-duration: 0.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim01{
	animation-delay: 2.5s;
	z-index: 5;
}
.anim02{
	animation-delay: 2s;
	z-index: 4;
}
.anim03{
	animation-delay: 1.5s;
	z-index: 3;
}
.anim04{
	animation-delay: 1s;
	z-index: 2;
}
.anim05{
	animation-delay: 0.5s;
	z-index: 1;
}


/*****
タイトルアニメーション設定
*****/
@keyframes anim_rotate{
	0%{
		transform: perspective(1120px) rotateY(-90deg);
	}
	100%{
		transform: perspective(1120px) rotateY(0);
	}
}


/*---------------------------------------------
	section
---------------------------------------------*/
.section_wrap{
	margin: 0 auto;
	padding: 4em 0;
}

.normal_section{
 font-size: 1.6rem;
	line-height: 1.6;
	width: 94%;
	max-width: 1000px;
 margin: 0 auto;
}

.ttl_type01{
	font-size: 2.4rem;
	line-height: 1.3;
	margin-bottom: 1em;
	padding: 0.5em 1em;
	border-bottom: solid 2px #873e86;
	position: relative;
}
.ttl_type01::after{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0.25em;
	border-color: transparent transparent #873e86 #873e86;
	position: absolute;
	bottom: 0;
	right: 0;
}

/*****
リード
*****/
.ttl_lead{
	font-size: 2rem;
	text-align: center;
	margin-bottom: 2em;
	padding: 0.5em;
	border: solid 2px #873e86;
	border-radius: 0 0.5em 0 0.5em;
	background-image: linear-gradient(135deg,#873e86 0, #873e86 20px, transparent 21px,transparent 100%),linear-gradient(315deg,#873e86 0, #873e86 20px, transparent 21px,transparent 100%);
	position: relative;
}
.ttl_lead::before,
.ttl_lead::after{
	content: '';
	display: block;
	clip-path: polygon(0 0,100% 0,10% 100%);
	position: absolute;
	left: 4em;
	transform: translateX(-50%);
}
.ttl_lead::before{
	background-color: #873e86;
	width: 2em;
	height: 2em;
	top: 100%;
}
.ttl_lead::after{
	background-color: #fff;
	width: calc(2em - 4px);
	height: calc(2em - 3px);
	top: calc(100% - 1px);
}
.ttl_lead h2{
	font-size: 1em;
}

.lead_img{
	float: left;
	margin-right: 1em;
}


/*****
講師紹介、概要
*****/
.detail_table{
	margin: 1em auto;
	border-top: solid 2px #873e86;
}

.detail_table tr{
	border-bottom: solid 2px #873e86;
}

.detail_table th{
	width: 8em;
	background-color: #f3ecfe;
}
.detail_table th,
.detail_table td{
	padding: 1em;
}

/*****
開催日程
*****/
.sche_nav{
	margin-top: 2em;
	padding-bottom: 0.5em;
	border-bottom: dashed 1px #873e86;
}
.sche_nav ul{
	display: flex;
	justify-content: space-around;
}
.sche_nav ul li{}
.sche_nav ul li a{
	color: #873e86;
}
.sche_nav ul li a::after{
	content: '';
	display: inline-block;
	width: 0.75em;
	height: 0.75em;
	border-bottom: solid 1px #873e86;
	border-right: solid 1px #873e86;
	transform: translate(1em, -25%) rotateZ(45deg);
}
.sche_nav ul li a:hover{
	text-decoration: none;
}

.schedule_area{
	margin-top: 2em;
}
.schedule_area h3{
	font-size: 1.2em;
	padding: 0.5em 0;
	border-bottom: solid 1px #ccc;
}
.schedule_tbl{
	margin-top: 1em;
	border-top: solid 1px #873e86;
	border-left: solid 1px #873e86;
}
.schedule_tbl th,
.schedule_tbl td{
	padding: 0.5em;
	border-bottom: solid 1px #873e86;
	border-right: solid 1px #873e86;
}
.schedule_tbl th{
	background-color: #f3ecfe;
}
.schedule_tbl th.th_date{}
.schedule_tbl th.th_place{}
.schedule_tbl th.th_teach{}
.schedule_tbl td{}
.schedule_tbl td.td_date{
	width: 7em;
	border-right: none;
}
.schedule_tbl td.td_time{}

/*終了表記*/
.end_date{
	text-decoration: line-through;
}
.end_txt{
	font-size: 0.85em;
	color: #e04536;
	text-decoration: none;
	margin-left: 0em;
}


/*****
講座一覧
*****/
.course_section{}

/*****
調整
*****/
.btn_bn_area .btn_banner{
	max-width: 714px;
	margin: 0 auto;
}


/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	
	.btn_area_flex{
		display: flex;
		justify-content: space-around;
	}
	
	
	/*---------------------------------------------
 	ページヘッダー
 ---------------------------------------------*/
	#page_header{}
	
	.page_header{}
	
	.p_h_bar_inner{
		display: flex;
		justify-content: space-around;
	}
	.p_h_date{
		width: 37.5%;
	}
	.p_h_place{
		width: 44.5%;
	}
	
	/*---------------------------------------------
	section
	---------------------------------------------*/
	/*****
	開催日程
	*****/
	.schedule_area h3{
		width: 80%;
		margin: 0 auto;
	}
	.schedule_tbl{
		width: 80%;
		margin: 1em auto 0 auto;
	}
	.schedule_tbl th.th_date{
	}
	.schedule_tbl th.th_place{
		width: 36%;
	}
	.schedule_tbl th.th_teach{
		width: 20%;
	}
	
	/*終了表記*/
	.end_txt{
		display: inline-block;
	}
	.td_date .end_txt{
		display: none;
	}
	
	/*****
	講座一覧
	*****/
	.course_section{
		font-size: 1.3rem;
	}
	
}

/* スマホ----------------------------- */
@media screen and (max-width: 767px){
	/*****
	common
	*****/
	
	.btn_area{}
	.btn_area .font_size_l{
		font-size: 1em;
	}
	
	.btn_area .btn_live{
		font-size: 1.6rem;
		width: 100%;
	}
 
 /*---------------------------------------------
 	ページヘッダー
 ---------------------------------------------*/
	#page_header{}
	.page_header{}
	.page_ttl{
		width: 94%;
	}
	
	.p_h_bar_inner{}
 .p_h_date{
		width: 66%;
		margin: 0 auto;
	}
	.p_h_place{
		width: 80%;
		margin: 0.5em auto 0 auto;
	}
 
 /*---------------------------------------------
	section
---------------------------------------------*/
 .section_wrap{
		padding: 2em 0;
	}
	
	.normal_section{
		font-size: 1.4rem;
		padding: 0.5em 0;
	}
	
	.ttl_type01{
		font-size: 1.8rem;
		padding: 0.5em;
	}
	
	/*****
	リード
	*****/
	.ttl_lead{
		font-size: 1.6rem;
		padding: 1em;
	}
	
	.lead_img{
		width: 20%;
		max-width: 94px;
	}
	
	/*****
	講師紹介、概要
	*****/
	.teacher_single{
  display: block;
		width: 100%;
		margin: 0 auto 2em auto;
	}
 .teacher_single .teacher_info{
  margin-bottom: 1em;
 }
	
	.detail_table th,
	.detail_table td{
		display: block;
		width: 100%;
	}
	
	/*****
	開催日程
	*****/
	.sche_nav ul{
		flex-wrap: wrap;
	}
	.sche_nav ul li{
		padding: 0.5em 1em;
	}
	
	.schedule_tbl{
		width: 100%;
	}
	
	.schedule_tbl th.th_place,
	.schedule_tbl th.th_teach{
		width: 6em;
	}
	
	/*終了表記*/
	.end_txt{
		display: block;
	}
	.td_time .end_txt{
		display: none;
	}
	
	/*****
	講座一覧
	*****/
	.course_section{}
 
}