@charset "utf-8";
/* =============================================
	正直不動産×日建
============================================= */
.font_red{
	color: #e60012;
}
.font_blue{
	color: #4472C4;
}

.bg_red{
	background-color: #e60012;
}
.bg_yell{
	background-color: #ffde00;
}
.bg_blue{
	background-color: #4472C4;
}

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

.content_main{
	overflow: hidden;
}

/*---------------------------------------------
	page nav
---------------------------------------------*/
.page_nav_wrap{
	width: 100%;
}
.page_nav_wrap .page_nav{
	width: 94%;
	max-width: 1000px;
	margin: 0 auto;
}
.page_nav ul{
	display: flex;
	justify-content: space-between;
	text-align: center;
}
.page_nav ul li{
	font-size: 1.6rem;
	width: 18%;
	line-height: 1.2;
	position: relative;
}
.page_nav ul li a{
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	height: 100%;
	padding: 0.5em;
	border: solid 4px #fff;
	border-radius: 0.5em;
	background-color: #4472C4;
	box-shadow: 0 0 2px 2px #002060;
	transition: background 0.5s;
}
.page_nav ul li.on_anchor a,
.page_nav ul li:hover a{
	text-decoration: none;
	background-color: #002060;
}

/***アンカー用ID***/
#shoujiki_info,
#digest_video,
#teacher_comm{
	padding-top: 2em;
}
#colabo_info{}
#digest_movie{}
#takken_course{}

/*---------------------------------------------
	page_header
---------------------------------------------*/
#page_header{
	line-height: 1.6;
	margin-bottom: 2em;
}

.page_header{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
}

.page_ttl{
	width: 94%;
	max-width: 1042px;
	margin: 0 auto 2em auto;
}

.header_bn{
	text-align: center;
	margin: 1em auto 0.5em auto;
	padding: 0 0.5em;
	background-color: #002060;
}
.header_caption{
	font-size: 1.3rem;
	width: 94%;
	max-width: 750px;
	margin: 0 auto;
}

.anim_effect{
	opacity: 0;
	animation-name: anim_effect;
	animation-duration: 0.35s;
	animation-delay: 1.2s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_slide_lr{
	opacity: 0;
	animation-name: anim_slide_lr;
	animation-duration: 0.5s;
	animation-delay: 0.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_slide_rl{
	opacity: 0;
	animation-name: anim_slide_rl;
	animation-duration: 0.5s;
	animation-delay: 0.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_rotate{
	animation-name: anim_rotate;
	animation-duration: 1s;
	animation-iteration-count: infinite;
}

/*****
タイトルアニメーション設定
*****/
@keyframes anim_effect{
	0%{
		opacity: 0;
		transform: scale(0.2);
	}
	80%{
		opacity: 1;
		transform: scale(1.5);
	}
	100%{
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes anim_slide_lr{
	0%{
		opacity: 0;
		transform: translateX(-100%);
	}
	100%{
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes anim_slide_rl{
	0%{
		opacity: 0;
		transform: translateX(100%);
	}
	100%{
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes anim_rotate{
	0%{
		transform: rotateZ(0);
	}
	50%{
		transform: rotateZ(5deg);
	}
	100%{
		transform: rotateZ(0);
	}
}


/*---------------------------------------------
	section
---------------------------------------------*/
.section_wrap{
	font-size: 1.6rem;
	line-height: 1.6;
	width: 100%;
	margin: 0 auto;
	padding: 4em 0 6em 0;
	/*overflow: hidden;*/
}
.normal_section{
 width: 970px;
	margin: 4em auto 0 auto;
}

.section_bg{
	background-image: url("../img/section_bg.jpg");
}

.koma_section{
	margin: 6em auto 0 auto;
	position: relative;
}

/*****
問い合わせナビ
*****/
.btn_box{
	text-align: center;
	width: 100%;
	padding: 2em;
	border: solid 6px #000;
	background-color: #fff;
}

.btn_box .btn_nav_ttl{
	font-size: 1.8rem;
}
.btn_nav{
	font-weight: bold;
	width: 100%;
	max-width: 400px;
	margin: 1em auto;
}
.btn_nav a{
	display: block;
	color: #fff;
	padding: 0.5em 1em;
	position: relative;
	transition: 0.5s;
}
.btn_nav a::after{
	content: '';
	display: block;
	width: 0.5em;
	height: 0.5em;
	border-top: solid 1px #fff;
	border-right: solid 1px #fff;
	position: absolute;
	top: 50%;
	right: 0.5em;
	transform: translateY(-50%) rotateZ(45deg);
}
.btn_nav a{
	background-color: #f99107;
	box-shadow: 2px 2px 0 0 #8c5409;
}
.btn_nav a:hover{
	background-color: #8c5409;
	box-shadow: 2px 2px 0 0 #fff;
}

/*****
コラボ概要
*****/
#collabo_info{}
.collabo_info{
	max-width: 900px;
	padding: 2em;
	border: solid 6px #000;
	background-color: #fff;
	background-image: url("../img/c02_bg_top.jpg"),url("../img/c02_bg_bottom.jpg");
	background-repeat: no-repeat;
	background-position: left top,right bottom;
}
.collabo_catch{
	text-align: center;
	font-size: 3rem;
	font-weight: bold;
	color: #f99107;
}
.collabo_catch_inner{
	display: inline-block;
	padding: 0.25em 1em;
	background-color: #fff;
}
.collabo_ttl{
	text-align: center;
	margin: 1em auto;
}
.collabo_kyouzai_text{
	margin-top: 2em;
}
.collabo_kyouzai{
	margin-top: 2em;
}


/*****
コマ02
*****/
#koma02{
	width: 900px;
	margin-top: 9em;
	padding: 2em;
	border: solid 6px #000;
	background-color: #fff;
	background-image: url("../img/c02_bg_top.jpg"),url("../img/c02_bg_bottom.jpg");
	background-repeat: no-repeat;
	background-position: left top,right bottom;
}

.c02_ttl{
	position: absolute;
	top: -3em;
	left: 35%;
}

.c02_img{
	flex-shrink: 0;
	width: 300px;
}

.c02_text{
	padding: 1em;
	border: solid 4px #e60012;
}

.c02_book{
	float: right;
	max-width: 159px;
	margin: 0 0 0.5em 1em;
}

.c02_fukidashi{
	text-align: right;
	margin: -10em -3em 0 auto;
	position: relative;
}

/*****
コマ03
*****/
#koma03{
	width: 900px;
	border: solid 6px #000;
	background-image: url("../img/c03_bg.png"),linear-gradient(to right,#f0962b 0,#f2ed9d 100%);
	background-size: contain, auto;
}

.c03_ttl{
	margin: -44px 0 -90px -40px;
}
.c03_koushi{
	position: absolute;
	bottom: 0;
	right: -40px;
}


/*****
コマ04
*****/
#koma04{
	/*display: flex;
	justify-content: space-between;*/
	width: 970px;
}

.c04_koma{
	width: 100%;
	max-width: 315px;
	text-align: center;
	margin: 1em auto 2em auto;
}

.c04_miyazaki{
	margin-bottom: 0.5em;
}
.c04_yoshino{
	margin-bottom: 0.5em;
}
.c04_itou{
	margin-bottom: 0.5em;
}

.c04_ttl01{
	margin: 0 0 0 1em;
}
.c04_ttl02{
	margin: 0 0 0 1em;
}


/*****
コマ05
*****/
#koma05{
	width: 900px;
	padding: 2em;
	border: solid 6px #000;
	background-image: url("../img/c05_bg.jpg");
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: cover;
}

.c05_ttl{
	position: absolute;
	top: 1em;
	left: -40px;
}

.c05_detail_area{
	text-align: right;
	position: relative;
	z-index: 100;
}
.c05_detail_area .c05_detail{}
.c05_detail_area .c05_miyazaki{
	position: absolute;
	top: 8%;
	right: -96px;
}
.c05_detail_area .c05_yoshino{
	position: absolute;
	top: 40%;
	right: -80px;
}
.c05_detail_area .c05_itou{
	position: absolute;
	top: 75%;
	right: -50px;
}

.c05_img{
	position: absolute;
	bottom: 0;
	left: -40px;
	z-index: 99;
}

.c05_effect{
	position: absolute;
	top: -110px;
	right: -44px;
	z-index: 101;
}

.c05_caption{
	width: 94%;
	max-width: 900px;
	margin: 0.5em auto;
	padding: 0.5em;
	background-color: rgba(255,255,255,0.85);
}

/*****
映像枠
*****/
.h_video_wrap{
	padding: 2em 1em 1em 1em;
	border: solid 6px #000;
	background-color: #fff;
}

.h_video_text{
	font-size: 2.6rem;
	text-align: center;
	color: #e60012;
}


/*****
コマ06
*****/
#koma06{
	text-align: center;
	width: 900px;
	padding: 3em 1em;
	border: solid 6px #000;
	background-color: #bf000f;
	background-image: url("../img/c06_bg.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.c06_ttl{
	position: absolute;
	top: -3em;
	left: 2em;
	z-index: 100;
}

.c06_img{
	width: 100%;
	position: absolute;
	top: 50%;
	left: 0%;
	transform: translateY(-50%);
	z-index: 99;
}

.c06_detail_area{
	display: inline-block;
	text-align: left;
	padding: 2em;
	border: solid 4px #000;
	border-radius: 1em;
	background-color: rgba(251,229,214,0.9);
	position: relative;
	z-index: 101;
}
.c06_detail_area .c06_tbl{}
.c06_detail_area .c06_tbl th{
	padding-right: 1em;
	white-space: nowrap;
}

/*****
受講生の声
*****/
#voice_jukou{}

.j_voice_ttl{}

.j_voice_box{
	margin: 2em auto 4em auto;
	padding: 1em;
	border: solid 4px #000;
	border-radius: 1em 0;
	background-color: #fff;
	position: relative;
}
.j_voice_box::before,
.j_voice_box::after{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	position: absolute;
	top: 100%;
	left: 35%;
}
.j_voice_box::before{
	border-color: #000 transparent transparent transparent;
	border-width: 38px 30px 0 0;
}
.j_voice_box::after{
	border-color: #fff transparent transparent transparent;
	border-width: 32px 24px 0 0;
}

.j_voice_icon{
	position: absolute;
	bottom: 0;
	right: 0;
	transform: translate(30%,40%);
}

/*****
コマ07
*****/
#koma07{}
#koma07 .koma_section{
	width: 900px;
	padding: 2em;
	border: solid 6px #000;
	background-color: #fff;
	background-image: url("../img/c02_bg_top.jpg"),url("../img/c02_bg_bottom.jpg");
	background-repeat: no-repeat;
	background-position: left top,right bottom;
}

.c07_ttl{
	position: absolute;
	top: -3em;
	left: 3em;
}

.c07_img{
	flex-shrink: 0;
	width: 200px;
}

.c07_text_wrap{
	flex-grow: 1;
	margin: 0 0 0 2em;
}
.c07_text{
	padding: 1em;
	border: solid 4px #e60012;
	background-color: #fff;
}

/*****
講義動画切り抜き
*****/
.kougi_img_area{
	padding: 2em 0;
}

.kougi_comm{
	font-size: 3rem;
	color: #fff;
	text-align: center;
	margin-bottom: 1.5em;
	padding: 0.5em;
	border-radius: 0.5em;
	background-color: #4472C4;
	position: relative;
}
.kougi_comm::after{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1em 1em 0 0.25em;
	border-color: #4472C4 transparent transparent transparent;
	position: absolute;
	top: 100%;
	left: 50%;
}

.kougi_sub_comm{
	font-size: 2.6rem;
	font-weight: bold;
	color: #002060;
	text-align: center;
	margin-bottom: 1em;
}

.kougi_li_img{}
.kougi_li_img li{
	margin-bottom: 2em;
}

/*****
追加決定枠
*****/
.addition_area{
	margin-top: 8em;
	border: solid 6px #e60012;
	background-color: #fffca7;
	background-image: url("../img/c06_bg.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
.addition_ttl{
	text-align: center;
	margin: -4em auto 1em auto;
}
.addition_text{
	margin: 0 2em 1em 2em;
	padding: 1em;
	background-color: rgba(255,252,167,0.8);
}
.addition_ttl_sub{
	font-size: 1.25em;
	text-align: center;
	color: #4472C4;
	margin-bottom: 1em;
	border-bottom: solid 2px #4472C4;
	position: relative;
}
.addition_ttl_sub::after{
	content: '';
	border-style: solid;
	border-width: 1em 0.75em 0 0.75em;
	border-color: #4472C4 transparent transparent transparent;
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
}

.addition_area .btn_normal{}

.icon_new{
	position: relative;
}
.icon_newmark{
	display: inline-block;
	color: #fff;
	line-height: 1;
	padding: 0.25em;
	border: solid 2px #fff;
	border-radius: 0.25em;
	background-color: #e60012;
	box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.25);
	position: absolute;
	top: -0.5em;
	left: -0.5em;
	animation-name: anim_new;
	animation-duration: 1s;
	animation-iteration-count: infinite;
}

/***newアイコンアニメーション設定***/
@keyframes anim_new{
	0%{
		transform: rotateZ(-5deg);
	}
	50%{
		transform: rotateZ(-15deg);
	}
	100%{
		transform: rotateZ(-5deg);
	}
}

/*****
コース一覧
*****/
.ttl_type01{
	font-size: 2.4rem;
	font-weight: bold;
	text-align: center;
	color: #000;
	margin-bottom: 1em;
	padding: 0.5em;
	border: solid 4px #000;
}

.course_info_cont{
	font-size: 1.3rem;
}

.course_list_table{
	margin: 0;
	border-top: solid 2px #fff46a;
}

.course_list_table h3,
.course_list_table h4{
	font-weight: bold;
}


/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	/*---------------------------------------------
		section
	---------------------------------------------*/
	.btn_area_flex{
		display: flex;
		justify-content: space-around;
	}
	
	.flex_wrap{
		flex-wrap: wrap;
	}
	
	.flex_grow1{
		flex-grow: 1;
	}
	.flex_shrink0{
		flex-shrink: 0;
	}
	
	/*---------------------------------------------
		page nav
	---------------------------------------------*/
	
	
	/*---------------------------------------------
		page_header
	---------------------------------------------*/
	
	/*---------------------------------------------
		section
	---------------------------------------------*/
	/*****
	コラボ概要
	*****/
	.collabo_kyouzai_text{}
	.collabo_kyouzai{
		width: 320px;
	}
	
	/*****
	受講生の声
	*****/
	.j_left_pc{
		flex-shrink: 0;
		width: 57%;
		max-width: 552px;
		margin-right: 2em;
	}
	.j_right_pc{}
	
	.j_mgn_a{
		margin-left: 2em;
	}
	.j_mgn_b{
		margin-right: 1em;
	}
	
	/*****
	追加決定枠
	*****/
	.addition_area .btn_normal{
		width: 45%;
	}
	
	/*****
	バナーエリア
	*****/
	.btn_bn_area .btn_banner{
		max-width: 714px;
		margin: 0 auto;
	}
	.btn_bn_area.flex_between_pc .btn_banner{
		width: 49.5%;
		max-width: 476px;
		margin: 0;
	}
	
	/*****
	コマ06
	*****/
	#koma06{
		margin-bottom: 6em;
	}
	
}

/* スマホ----------------------------- */
@media screen and (max-width: 767px){
	/*---------------------------------------------
	page nav
	---------------------------------------------*/
	.page_nav{
		border-bottom: none;
	}
	.page_nav ul{
		flex-wrap: wrap;
	}
	.page_nav ul li{
		width: 48%;
		font-size: 1.4rem;
		margin-bottom: 1em;
	}
	.page_nav ul li a{
		padding: 0.5em 0.25em;
		border-width: 2px;
	}
	
	/*---------------------------------------------
		page_header
	---------------------------------------------*/
	#page_header{}
	.page_header{}
	
	.page_ttl{
		margin: 0 auto 1em auto;
	}
	
	.header_bn{
		margin: 0.5em auto;
	}
	
	
	
	/*---------------------------------------------
		section
	---------------------------------------------*/
	.section_wrap{
		font-size: 1.4rem;
		padding: 2em 0;
	}
	.section_wrap li{
  font-size: 1.4rem;
 }
	.normal_section{
		width: 94%;
		margin: 2em auto 0 auto;
	}
	
	.koma_section{
		width: 94%;
		margin: 4em auto 0 auto;
	}
	
	/*****
	コラボ概要
	*****/
	.collabo_catch{
		font-size: 2rem;
	}
 
 /*****
	コマ02
	*****/
	#koma02{
		width: 94%;
		margin-top: 4em;
		padding: 2em 0.5em 1em 0.5em;
	}
	
	.c02_ttl{
		width: 65%;
		left: 0;
	}
	
	.c02_img{
		width: 100%;
		max-width: 300px;
		margin: 0 auto 1em auto;
	}
	
	.c02_book{
		width: 25%;
	}
	
	.c02_fukidashi{
		text-align: center;
		width: 80%;
		max-width: 300px;
		margin: -3em auto 0 auto;
	}
	
	/*****
	コマ03
	*****/
	#koma03{
		text-align: center;
		width: 94%;
	}
	
	.c03_ttl{
		margin: -4em -15%;
	}
	
	.c03_koushi{
		position: static;
	}
	
	
	/*****
	コマ04
	*****/
	#koma04{
		display: block;
		text-align: center;
		width: 94%;
	}
	
	.c04_ttl01,
	.c04_ttl02{
		text-align: left;
		height: 4em;
		margin: 0;
	}
	.c04_ttl01 img,
	.c04_ttl02 img{
		height: 100%;
		width: auto;
	}
	
	
	/*****
	コマ05
	*****/
	#koma05{
		width: 94%;
		padding: 2em 0.5em 0 0.5em;
	}
	
	.c05_ttl{
		width: 65%;
		top: -3em;
		left: 0;
	}
	
	.c05_detail_area{}
	.c05_detail_area .c05_detail{
		transform: translateX(-5%);
	}
	
	.c05_detail_area .c05_miyazaki{
		width: 16%;
		max-width: 105px;
		right: -1.8em;
	}
	.c05_detail_area .c05_yoshino{
		width: 12%;
		max-width: 78px;
		right: -1em;
	}
	.c05_detail_area .c05_itou{
		width: 11%;
		max-width: 74px;
		right: -1em;
	}
	
	.c05_img{
		width: 65%;
		margin: 1em auto 0 -1.5em;
		position: static;
	}
	
	.c05_effect{
		width: 80%;
		max-width: 394px;
		top: auto;
		bottom: -2em;
		right: -4%;
	}
	
	/*****
	映像枠
	*****/
	.h_video_wrap h2 img{
		height: 2.4em;
	}
	
	.h_video_text{
		font-size: 1.6rem;
		text-align: left;
	}
	
	/*****
	コマ06
	*****/
	#koma06{
		width: 94%;
		padding: 2em 0.5em;
	}
	
	.c06_ttl{
		width: 65%;
		top: -3em;
		left: 0;
	}
	
	.c06_img{
		width: 150%;
		max-width: 640px;
		left: 50%;
		transform: translate(-50%,-50%);
	}
	
	/*****
	受講生の声
	*****/
	
	/*****
	コマ07
	*****/
	#koma07 .koma_section{
		width: 94%;
		padding: 2em 0.5em 1em 0.5em;
	}
	
	.c07_ttl{
		width: 100%;
		left: 0;
	}
	
	.c07_img{
		width: 100%;
		max-width: 200px;
		margin: 0 auto 1em auto;
	}
	
	.c07_text_wrap{
		margin: 0 auto;
	}
	
	/*****
	講義動画切り抜き
	*****/
	.kougi_comm{
		font-size: 1.6rem;
	}
	.kougi_sub_comm{
		font-size: 1.6rem;
	}
	
	/*****
	追加決定枠
	*****/
	.addition_area{
		margin: 2em auto 0 auto;
		padding-top: 1em;
		background-size: auto 100%;
	}
	.addition_ttl{
		margin: 0 auto;
	}
	.addition_text{
		margin: 1em;
	}
	.addition_area .flex_between_pc{
		padding: 0 1em;
	}
	
	/*****
	コース一覧
	*****/
	.ttl_type01{
		font-size: 1.6rem;
	}
	
	/***タブ***/
	.course_tab{
		flex-wrap: wrap;
	}
	.course_tab li{
		font-size: 1.4rem;
	}
	
	/*****
	バナーエリア
	*****/
	.btn_bn_area .btn_banner{
		margin-top: 1em;
	}
	
}


/* print----------------------------- */
@media print{
	#footer,.page_top{ display: none; }
	body{ min-height: 0; }
}