@charset "utf-8";

/* =============================================
	構造LP
============================================= */
/*****
common
*****/
h1,h2,h3,h4,h5{
	line-height: 1.3;
}
table{
	width: 100%;
	margin-bottom: 1em;
}

.font_red{
	color: #e04536;
}
.font_blue{
	color: #203864;
}
.font_gold{
	color: #d2b071;
}
.font_white{
	color: #fff;
}

.font_size_s{
	font-size: 0.8em;
}
.font_size_l{
 font-size: 1.25em;
}

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

.line_through{
	text-decoration: line-through;
}

/***リンクボタン***/
.btn_normal{
	max-width: 420px;
}
.btn_normal::before{
	background-color: rgba(0,0,0,0.5);
}
.btn_normal a{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
}
.btn_bg_green{
	background-color: #12baa6;
}
.btn_bg_blue{
	background-color: #203864;
}

.btn_anchor{
	display: inline-block;
	color: #1e83c5;
	padding: 0.5em;
	border: solid 1px #1e83c5;
}

.outer_link{
	margin: 1em 0;
}
.outer_link a{
	display: inline-block;
	color: #203864;
	padding: 0.5em 1em;
	border: solid 1px #203864;
}

/*** 拡大表示 ***/

#overlay{
	width: 100%;
	background-color: rgba(0,0,0,0.75);
	position: fixed;
	/*position: absolute;*/
	top: 0;
	left: 0;
}

/*閉じるボタン*/
#overlay::before{
	content: '×';
	display: block;
	font-size: 4vh;
	text-align: center;
	line-height: 1;
	color: #fff;
	padding: 0 0.25em;
	border: solid 1px #fff;
	position: absolute;
	top: 1em;
	right: 2%;
	cursor: pointer;
}

#overlay #view_container{
	width: 90%;
	max-width: 970px;
	max-height: 90vh;
	margin: 0 auto;
	overflow-y: auto;
}

#overlay #view_container #view_img{
 max-width: 928px;
 margin: 0 auto;
}

#overlay #view_container #view_img img{
	width: 100%;
	height: auto;
}

#overlay #view_container #nav_area{
	display: none;
	/*display: flex;
	justify-content: space-between;
	margin-top: 0.25em;*/
}

/*#overlay #view_container #nav_area #prev_btn{
	display: inline-block;
	padding: 0.5em 1em;
	background-color: #fff;
	cursor: pointer;
}

#overlay #view_container #nav_area #next_btn{
	display: inline-block;
	padding: 0.5em 1em;
	background-color: #fff;
	cursor: pointer;
}*/

/*** 拡大表示 ここまで ***/

/*---------------------------------------------
	page_header
---------------------------------------------*/
#page_header{
	width: 100%;
	padding: 6em 0;
	background-color: #f6f6f6;
	background-image: url("../img/page_header_bg.png");
	background-repeat: repeat;
}
#voice_header{
	line-height: 1.6;
	width: 100%;
	padding: 6em 0;
	background-color: #203864;
	background-image: url("../img/voice_header_bg.png");
	background-repeat: repeat;
}

.page_header_wrap{
	background-color: rgba(246,246,246,0.85);
}
.page_header{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 970px;
	margin: 0 auto;
	padding: 20px;
	background-color: #f6f6f6;
	overflow: hidden;
}
.page_header h1{
	font-size: 4rem;
	color: #787878;
}
.page_header .page_header_nav{
	display: flex;
	flex-direction: row-reverse;
}
.page_header_nav li{
	margin-left: 1em;
}

.anim{
	opacity: 0;
	animation-name: anim_fade;
	animation-duration: 1s;
	animation-delay: 1s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

.anim_slide01{
	opacity: 0;
	transform: translateX(500%);
	animation-name: anim_slide;
	animation-duration: 1s;
	animation-delay: 1s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_slide02{
	opacity: 0;
	transform: translateX(500%);
	animation-name: anim_slide;
	animation-duration: 1s;
	animation-delay: 1.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_slide03{
	opacity: 0;
	transform: translateX(500%);
	animation-name: anim_slide;
	animation-duration: 1s;
	animation-delay: 2s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_slide04{
	opacity: 0;
	transform: translateX(500%);
	animation-name: anim_slide;
	animation-duration: 1s;
	animation-delay: 2.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_slide05{
	opacity: 0;
	transform: translateX(500%);
	animation-name: anim_slide;
	animation-duration: 1s;
	animation-delay: 3s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}
.anim_slide06{
	opacity: 0;
	transform: translateX(500%);
	animation-name: anim_slide;
	animation-duration: 1s;
	animation-delay: 3.5s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

/*****
タイトルアニメーション設定
*****/
@keyframes anim_fade{
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}

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


/*---------------------------------------------
	section
---------------------------------------------*/
.normal_section{
 font-size: 1.6rem;
	line-height: 1.6;
	width: 970px;
	margin: 6em auto 0 auto;
	padding: 40px 0;
}
.section_wrap{
	margin: 6em auto 0 auto;
	background-color: #f6f6f6;
	position: relative;
}
.section_wrap::before,
.section_wrap::after{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 4em 50vw 4em 50vw;
}
.section_wrap::before{
	border-color: transparent transparent #f6f6f6 #f6f6f6;
	position: absolute;
	bottom: 100%;
	left: 0;
}
.section_wrap::after{
	border-color: #f6f6f6 #f6f6f6 transparent transparent;
	position: absolute;
	top: 100%;
	left: 0;
}
.section_wrap .normal_section{
	margin: 0 auto;
}

.ttl_type01{
	font-size: 2.4rem;
	margin: 1em 0 1.5em 2em;
	padding: 0.5em 1em;
	border-bottom: solid 2px #555;
}

.ttl_type02{
	font-size: 2.4rem;
	color: #fff;
	text-align: center;
	margin-bottom: 1em;
	padding: 0.5em;
	background-color: #203864;
	background-image: url("../img/ttl_type02_bg.png");
	text-shadow: 0 2px 0 rgba(0,0,0,0.8);
}

/*****
構造計算とは
*****/
#kz_info{}
.kouzou_info01{
	background-image: url("../img/kouzou_info_bg01.png");
	background-repeat: no-repeat;
	background-position: left top;
}
.kouzou_info02{
	background-image: url("../img/kouzou_info_bg02.png");
	background-repeat: no-repeat;
	background-position: left top;
}
.kouzou_info03{
	background-image: url("../img/kouzou_info_bg03.png");
	background-repeat: no-repeat;
	background-position: left top;
}

.kz_info03_list{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.kz_info03_list li{
	width: 48.5%;
	max-width: 466px;
	margin: 1em 0;
	border: solid 1px #ccc;
}
.kz_info03_list li img{
	width: 100%;
	height: auto;
}
.kz_info03_list li a{
	display: block;
	position: relative;
}
.kz_info03_list li a .icon_large{
	width: 20%;
	max-width: 84px;
	position: absolute;
	bottom: 0.5em;
	right: 0.5em;
}

/*****
講座パック紹介 ナビ
*****/
.pack_nav{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.pack_nav li{
	font-size: 1.6rem;
	text-align: center;
	width: 200px;
	height: 160px;
	margin: 0 2em 2em 2em;
}
.pack_nav li a{
	/*display: block;*/
	display: flex;
	justify-content: center;
	align-items: center;
	color: #203864;
	height: 100%;
	background-position: center center;
	transition: color 0.5s;
}
.pack_nav li a span{
	width: 100%;
	padding: 0.5em;
	background-color: rgba(255,255,255,0.8);
}

#nav_kz_kiwami{}
#nav_st1q_kiwami{}
#nav_st1q_honka{}
#nav_kz_lv1{}
#nav_kz_lv2{}
#nav_kz_other{}

#nav_kz_kiwami a:hover{
	color: #94839d;
}
#nav_st1q_kiwami a:hover{
	color: #c04853;
}
#nav_st1q_honka a:hover{
	color: #e4a544;
}
#nav_kz_lv1 a:hover{
	color: #83995b;
}
#nav_kz_lv2 a:hover{
	color: #556e89;
}
#nav_kz_other a:hover{
	color: #70a6b9;
}

#nav_kz_kiwami a{
	background-color: #94839d;
	background-image: url("../img/wa_bg01.png");
}
#nav_st1q_kiwami a{
	background-color: #c04853;
	background-image: url("../img/wa_bg02.png");
}
#nav_st1q_honka a{
	background-color: #e4a544;
	background-image: url("../img/wa_bg03.png");
}
#nav_kz_lv1 a{
	background-color: #83995b;
	background-image: url("../img/wa_bg04.png");
}
#nav_kz_lv2 a{
	background-color: #556e89;
	background-image: url("../img/wa_bg05.png");
}
#nav_kz_other a{
	background-color: #70a6b9;
	background-image: url("../img/wa_bg06.png");
}


/*****
各講座パック紹介
*****/
.ttl_type03{
	font-size: 2.4rem;
	color: #fff;
	margin-bottom: 1em;
	padding: 0.5em 5em 0.5em 6em;
	text-shadow: 0 2px 0 rgba(0,0,0,0.8);
	position: relative;
}
.ttl_type03::before{
	content: '';
	display: block;
	width: 5em;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.icon_kiwami{
	position: absolute;
	top: 50%;
	right: 1em;
	transform: translateY(-50%);
}

.point_area{
	margin: 2em 0;
}
.point_area .ttl_point{
	font-size: 3rem;
	margin: 1em 0 0 0;
	border-bottom: dashed 1px #ccc;
}
.point_area p{
	padding: 0.5em 1em;
	background-color: #f6f6f6;
}

.ttl_type04{
	display: inline-block;
	font-size: 1.8rem;
	line-height: 1;
	color: #fff;
	width: 12.25em;
	padding: 0.5em 0 0.5em 0.5em;
	background-color: #858585;
	position: relative;
}
.ttl_type04::after{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1em 1em 1em 1em;
	border-color: transparent transparent #858585 #858585;
	position: absolute;
	bottom: 0;
	left: 100%;
}
.curriculum_table{
	border-top: solid 1px #858585;
}
.curriculum_table tr{}

.curriculum_table th,
.curriculum_table td{
	padding: 1em;
}

.curriculum_table th{
	color: #fff;
	position: relative;
}
.curriculum_table .th_wide_s th{
	width: 5em;
}
.curriculum_table .th_wide_l th{
	width: 16em;
}
.curriculum_table th.th_arrow::after{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 99;
}
.curriculum_table .th_wide_s th.th_arrow::after{
	border-width: 0.75em 2.5em 0 2.5em;
}
.curriculum_table .th_wide_l th.th_arrow::after{
	border-width: 0.75em 8em 0 8em;
}

.curriculum_table td{}
.curriculum_table td h4{
	font-size: 1.6rem;
	margin: 1em 0 0.5em 0;
	padding-top: 0.5em;
	border-top: dashed 1px #ccc;
}
.curriculum_table td h4:first-of-type{
	margin-top: 0;
	padding-top: 0;
	border-top: none;
}
.curriculum_table td p{
	padding-bottom: 0.5em;
}
.curriculum_table td p:last-of-type{
	padding-bottom: 0;
}

.pack_detail_area{
	text-align: center;
	margin: 2em auto;
}
.pack_detail{
	display: inline-block;
	padding: 1em;
}
.pack_detail h3{
	font-size: 2rem;
	margin-bottom: 1em;
}
.icon_price{
	display: inline-block;
	font-size: 0.85em;
	margin-right: 1em;
	padding: 0.5em;
	border: solid 1px #ccc;
}
.pack_detail .special_price{}
.pack_detail .special_price::before{
	content: '';
	display: block;
	width: 0;
	height: 0;
	margin: 1em auto;
	border-style: solid;
	border-width: 1em 2em 0 2em;
	border-color: #e04536 transparent transparent transparent;
}
.pack_detail ul{
	margin: 1em auto;
}
.pack_detail ul li{
	font-size: 1.6rem;
}

/***構造計算マスターWeb極パック***/
#kouzou_kiwami{}

.kz_kiwami_color,
#kouzou_kiwami .ttl_point{
	color: #94839d;
}

#kouzou_kiwami .ttl_type03,
#kouzou_kiwami .btn_bg_pack,
.course_list_table td.kouzou_kiwami_bg{
	background-color: #94839d;
}
#kouzou_kiwami .ttl_type03::before{
	background-image: url("../img/wa_bg01.png");
}

#kouzou_kiwami .curriculum_table tr{
	border-bottom: solid 1px #94839d;
	border-right: solid 1px #94839d;
}
#kouzou_kiwami .curriculum_table th{
	background-color: #94839d;
}
#kouzou_kiwami .curriculum_table tr:nth-of-type(1) th{
	background-color: #cfc3d5;
}
#kouzou_kiwami .curriculum_table tr:nth-of-type(1) th.th_arrow::after{
	border-color: #cfc3d5 transparent transparent transparent;
}
#kouzou_kiwami .curriculum_table tr:nth-of-type(2) th{
	background-color: #b0a1b8;
}
#kouzou_kiwami .curriculum_table tr:nth-of-type(2) th.th_arrow::after{
	border-color: #b0a1b8 transparent transparent transparent;
}

#kouzou_kiwami .pack_detail{
	border: solid 2px #94839d;
}


/***構造設計一級建築士極パック***/
#structure1q_kiwami{}

.st1q_kiwami_color,
#structure1q_kiwami .ttl_point{
	color: #c04853;
}

#structure1q_kiwami .ttl_type03,
#structure1q_kiwami .btn_bg_pack,
.course_list_table td.structure1q_kiwami_bg{
	background-color: #c04853;
}
#structure1q_kiwami .ttl_type03::before{
	background-image: url("../img/wa_bg02.png");
}

#structure1q_kiwami .curriculum_table tr{
	border-bottom: solid 1px #c04853;
	border-right: solid 1px #c04853;
}
#structure1q_kiwami .curriculum_table th{
	background-color: #c04853;
}
#structure1q_kiwami .curriculum_table tr:nth-of-type(1) th{
	background-color: #dc8f96;
}
#structure1q_kiwami .curriculum_table tr:nth-of-type(1) th.th_arrow::after{
	border-color: #dc8f96 transparent transparent transparent;
}
#structure1q_kiwami .curriculum_table tr:nth-of-type(2) th{
	background-color: #d16f78;
}
#structure1q_kiwami .curriculum_table tr:nth-of-type(2) th.th_arrow::after{
	border-color: #d16f78 transparent transparent transparent;
}

#structure1q_kiwami .pack_detail{
	border: solid 2px #c04853;
}


/***構造設計一級建築士本科Web***/
#structure1q_honka{}

.st1q_honka_color,
#structure1q_honka .ttl_point{
	color: #e4a544;
}

#structure1q_honka .ttl_type03,
#structure1q_honka .btn_bg_pack,
.course_list_table td.structure1q_honka_bg{
	background-color: #e4a544;
}
#structure1q_honka .ttl_type03::before{
	background-image: url("../img/wa_bg03.png");
}

#structure1q_honka .curriculum_table tr{
	border-bottom: solid 1px #e4a544;
	border-right: solid 1px #e4a544;
}
#structure1q_honka .curriculum_table th{
	background-color: #e4a544;
}
#structure1q_honka .curriculum_table th.th_arrow::after{
	border-color: #e4a544 transparent transparent transparent;
}
#structure1q_honka .curriculum_table tr:nth-of-type(even) th{
	background-color: #eab461;
}
#structure1q_honka .curriculum_table tr:nth-of-type(even) th.th_arrow::after{
	border-color: #eab461 transparent transparent transparent;
}

#structure1q_honka .pack_detail{
	border: solid 2px #e4a544;
}


/***構造計算初級Web***/
#kouzou_lv1{}

.kz_lv1_color,
#kouzou_lv1 .ttl_point{
	color: #83995b;
}

#kouzou_lv1 .ttl_type03,
#kouzou_lv1 .btn_bg_pack,
.course_list_table td.kouzou_lv1_bg{
	background-color: #83995b;
}
#kouzou_lv1 .ttl_type03::before{
	background-image: url("../img/wa_bg04.png");
}

#kouzou_lv1 .curriculum_table tr{
	border-bottom: solid 1px #83995b;
	border-right: solid 1px #83995b;
}
#kouzou_lv1 .curriculum_table th{
	background-color: #83995b;
}
#kouzou_lv1 .curriculum_table th.th_arrow::after{
	border-color: #83995b transparent transparent transparent;
}
#kouzou_lv1 .curriculum_table tr:nth-of-type(even) th{
	background-color: #9bae79;
}
#kouzou_lv1 .curriculum_table tr:nth-of-type(even) th.th_arrow::after{
	border-color: #9bae79 transparent transparent transparent;
}

#kouzou_lv1 .pack_detail{
	border: solid 2px #83995b;
}


/***構造計算中級Web***/
#kouzou_lv2{}

.kz_lv2_color,
#kouzou_lv2 .ttl_point{
	color: #556e89;
}

#kouzou_lv2 .ttl_type03,
#kouzou_lv2 .btn_bg_pack,
.course_list_table td.kouzou_lv2_bg{
	background-color: #556e89;
}
#kouzou_lv2 .ttl_type03::before{
	background-image: url("../img/wa_bg05.png");
}

#kouzou_lv2 .curriculum_table tr{
	border-bottom: solid 1px #556e89;
	border-right: solid 1px #556e89;
}
#kouzou_lv2 .curriculum_table th{
	background-color: #556e89;
}
#kouzou_lv2 .curriculum_table th.th_arrow::after{
	border-color: #556e89 transparent transparent transparent;
}
#kouzou_lv2 .curriculum_table tr:nth-of-type(even) th{
	background-color: #7189a2;
}
#kouzou_lv2 .curriculum_table tr:nth-of-type(even) th.th_arrow::after{
	border-color: #7189a2 transparent transparent transparent;
}

#kouzou_lv2 .pack_detail{
	border: solid 2px #556e89;
}


/***その他構造計算講座***/
#kouzou_other{}

.kz_other_color,
#kouzou_other .ttl_point{
	color: #70a6b9;
}

#kouzou_other .ttl_type03,
#kouzou_other .btn_bg_pack{
	background-color: #70a6b9;
}
#kouzou_other .ttl_type03::before{
	background-image: url("../img/wa_bg06.png");
}

.pack_other_box{
	margin-bottom: 2em;
	border: solid 1px #70a6b9;
}
.pack_other_box .other_inner{
	padding: 1em 1em 0 1em;
}

.ttl_other{
	font-size: 1.8rem;
	text-align: center;
	color: #fff;
	padding: 0.5em;
	background-color: #70a6b9;
}

.other_detail{
	flex-grow: 1;
	font-size: 1.4rem;
	margin: 1em auto;
	padding: 0.5em;
	border: dashed 1px #70a6b9;
}
.plus_mark{
	flex-shrink: 0;
	font-size: 2rem;
	font-weight: bold;
	color: #70a6b9;
	text-align: center;
	margin: 0 0.5em;
}

.set_price{
	font-size: 1.25em;
	text-align: center;
}


/*****
受講生の声
*****/
#kz_voice{}
.success_area{
	margin: 2em auto;
	padding: 1em;
	border: solid 2px #203864;
	background-color: #fff;
}

.success_header{
	display: flex;
	margin-bottom: 1em;
}

.success_header .face_area{
	flex-shrink: 0;
	font-size: 1.4rem;
	/*text-align: center;*/
	width: 200px;
	margin: 0 2em 0 0;
}
.face_area h2{
	margin-bottom: 0.5em;
}
.face_area b{
	font-size: 1.15em;
}
.job{
	font-size: 1.15em;
	line-height: 1;
	text-align: center;
	color: #fff;
	margin-bottom: 0.25em;
	padding: 0.25em;
	background-color: #203864;
}

.success_header .be_af_area{
	flex-grow: 1;
}

.be_af_area .graduation b{
	color: #203864;
}
.be_af_area h3{
	font-size: 2rem;
	color: #660f59;
	margin-bottom: 3em;
}

.be_af_area .be_af_list{
	display: flex;
	border: solid 2px #203864;
}
.be_af_area .be_af_list li{
	font-size: 1.6rem;
	width: 50%;
	padding-top: 1em;
	padding-bottom: 1em;
	position: relative;
}
.be_af_area .be_af_list li.li_before{
	color: #203864;
	padding-left: 1em;
	padding-right: 0;
}
.be_af_area .be_af_list li.li_after{
	color: #fff;
	padding-left: 2em;
	padding-right: 1em;
	background-color: #203864;
}
.be_af_area .be_af_list li::before{
	content: '';
	display: block;
	width: 92px;
	height: 28px;
	background-repeat: no-repeat;
	background-position: left bottom;
	position: absolute;
	bottom: 100%;
	left: 0;
}
.be_af_area .be_af_list li.li_before::before{
	background-image: url("../img/icon_before.png");
}
.be_af_area .be_af_list li.li_after::before{
	background-image: url("../img/icon_after.png");
}

.be_af_area .be_af_list li.li_before::after{
	content: '';
	display: block;
	width: 1em;
	height: 100%;
	background-image: url("../img/icon_be_af_arrow.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	position: absolute;
	top: 0;
	left: 100%;
	z-index: 99;
}

/***開閉パネル設定***/
.btn_toggle{
	display: block;
	text-align: center;
	color: #660f59;
	margin: 0 auto;
	padding: 0.5em 1em;
	border: solid 1px #660f59;
	border-radius: 0.25em;
	cursor: pointer;
}
.btn_toggle::after{
	content: '▼';
	display: inline;
}
.btn_open{
	color: #fff;
	background-color: #660f59;
}
.btn_open::after{
	content: '▲';
	display: inline;
}

.panel_show_box{
	padding-top: 1em;
}

/***タブ設定***/
.tab_menu{
	display: flex;
	margin-bottom: 0.5em;
}
.tab_menu li{
	font-size: 1.6rem;
	font-weight: bold;
	text-align: center;
	width: 23%;
	margin: 0 1% 0 1%;
}
.tab_menu li a{
	display: block;
	padding: 0.5em 1em;
	border: solid 1px #ccc;
	border-radius: 0.25em;
}
.tab_menu li a:hover{
	text-decoration: none;
}
.tab_menu li:nth-of-type(1) a{
	color: #15438f;
}
.tab_menu li:nth-of-type(2) a{
	color: #56a471;
}
.tab_menu li:nth-of-type(3) a{
	color: #b98c1b;
}
.tab_menu li:nth-of-type(4) a{
	color: #b42e57;
}

.tab_menu .show_box{
	position: relative;
	cursor: default;
}
.tab_menu .show_box::before{
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1em 1em 0 1em;
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	z-index: 999;
}
.tab_menu li:nth-of-type(1) a.show_box{
	border: solid 1px #15438f;
}
.tab_menu li:nth-of-type(1) a.show_box::before{
	border-color: #15438f transparent transparent transparent;
}
.tab_menu li:nth-of-type(2) a.show_box{
	border: solid 1px #56a471;
}
.tab_menu li:nth-of-type(2) a.show_box::before{
	border-color: #56a471 transparent transparent transparent;
}
.tab_menu li:nth-of-type(3) a.show_box{
	border: solid 1px #b98c1b;
}
.tab_menu li:nth-of-type(3) a.show_box::before{
	border-color: #b98c1b transparent transparent transparent;
}
.tab_menu li:nth-of-type(4) a.show_box{
	border: solid 1px #b42e57;
}
.tab_menu li:nth-of-type(4) a.show_box::before{
	border-color: #b42e57 transparent transparent transparent;
}

.comment_area{
	padding: 1em;
	border-radius: 0.25em;
}
.success_area .comment_area:nth-of-type(1){
	border: solid 1px #15438f;
}
.success_area .comment_area:nth-of-type(2){
	border: solid 1px #56a471;
}
.success_area .comment_area:nth-of-type(3){
	border: solid 1px #b98c1b;
}
.success_area .comment_area:nth-of-type(4){
	border: solid 1px #b42e57;
}


/*****
コース一覧
*****/
#kz_course{}
.course_info_cont{
	font-size: 1.3rem;
}
.course_list_table{
	margin: 0;
	border-top: solid 2px #203864;
  border-left: none;
}

.course_list_table h3.font_white a{
	color: #fff;
}

/***タブ***/
.course_tab{
	display: flex;
}
.course_tab li{
	font-size: 1.8rem;
	font-weight: bold;
	margin-right: 1em;
}
.course_tab li a{
	display: block;
	color: #333;
	padding: 0.5em 1em;
	background-color: #ccc;
	border-radius: 0.5em 0.5em 0 0;
}
.course_tab li a:hover{
	text-decoration: none;
}
.course_tab li a.show_box{
	cursor: default;
	color: #fff;
	background-color: #203864;
}

/* =============================================
	受講生の声ページ
============================================= */
.voice_lead_area{
	font-size: 1.6rem;
	width: 970px;
	margin: 0 auto;
	padding: 1em 2em;
	background-color: #f6f6f6;
}


/* ===========================================
	MediaQueries
=========================================== */
/* PC----------------------------- */
@media (min-width: 768px){
	/*---------------------------------------------
		section
	---------------------------------------------*/
	/*** 非表示 ***/
	.sp_only{
  display: none;
 }
	
	.btn_area_flex{
		display: flex;
		justify-content: space-around;
	}
	
	.flex_between{
		display: flex;
		justify-content: space-between;
	}
	.flex_between .flex_block2{
		width: 48%;
	}
	.flex_align_center{
		align-items: center;
	}
	
	.content_main{
		overflow: hidden;
	}
	
	/*****
	各講座パック紹介
	*****/
	/***その他構造計算講座***/
	.other_info{
		position: relative;
	}
	.other_info .btn_detail{
		display: inline-block;
		padding: 0.5em;
		background-color: #70a6b9;
		cursor: default;
	}
	.other_info .other_info_area{
		display: none;
		width: 320px;
		padding: 0.5em;
		border: solid 1px #70a6b9;
		background-color: #fff;
		position: absolute;
		top: 3em;
		right: 0;
		z-index: 999;
	}
	.other_info .btn_detail:hover + .other_info_area{
		display: block;
	}
	
}

/* スマホ----------------------------- */
@media screen and (max-width: 767px){
 /*** 非表示 ***/
 .pc_only{
  display: none;
 }
 
	/*****
	common
	*****/
	
	.simple_btn a{
		width: 95%;
		min-width: 0;
	}
	
	.btn_normal{
		font-size: 1.6rem;
	}
	
	/*---------------------------------------------
		page_header
	---------------------------------------------*/
	#page_header{
		padding: 2em 0;
		background-size: 30px auto;
	}
	
	.page_header{
		display: block;
		width: 94%;
		padding: 2em 1em;
	}
	.page_header h1{
		font-size: 5vw;
	}
	
	.page_header .page_header_nav{
		display: block;
		margin-top: 1em;
	}
	.page_header_nav li{
		width: 100%;
		max-width: 320px;
		margin: 0.5em auto;
	}
	
	
	/*---------------------------------------------
		section
	---------------------------------------------*/
	.normal_section{
		font-size: 1.4rem;
		width: 94%;
		margin: 2em auto 0 auto;
		padding: 1em 0.5em;
	}
	
	.section_wrap{
		margin: 2em auto 0 auto;
	}
	
	.section_wrap::before,
	.section_wrap::after{
		border-width: 1em 50vw 1em 50vw;
	}
	
	.flex_block2{
		margin-bottom: 2em;
	}
	
	/*****
	構造計算とは
	*****/
	.kouzou_info01,
	.kouzou_info02,
	.kouzou_info03{
		background-size: 25% auto;
	}
	
	.ttl_type01{
		font-size: 1.8rem;
		margin: 0 0 1em 2em;
	}
	
	/*****
	講座パック紹介 ナビ
	*****/
	.ttl_type02{
		font-size: 1.8rem;
	}
	.pack_nav{
		justify-content: space-between;
	}
	.pack_nav li{
		font-size: 1.4rem;
		width: 48%;
		height: auto;
		margin: 0 0 1.5em 0;
	}
	
	.pack_nav li a{
		padding: 2em 0
	}
	
	/*****
	各講座パック紹介
	*****/
	.ttl_type03{
		font-size: 1.6rem;
		padding: 1.5em 2em 0.5em 1em;
	}
	.ttl_type03::before{
		width: 100%;
		height: 1em;
	}
	.icon_kiwami{
		width: 15%;
		right: 0.5em;
	}
	
	.point_area .ttl_point{
		font-size: 1.6rem;
	}
	
	.ttl_type04{
		font-size: 1.4rem;
		width: auto;
	}
	.curriculum_table{
		font-size: 1.2rem;
	}
	.curriculum_table td h4{
		font-size: 1.2rem;
	}
	.curriculum_table .th_wide_l th{
		width: 34vw;
	}
	.curriculum_table .th_wide_l th.th_arrow::after{
		border-width: 0.75em 17vw 0 17vw;
	}
	
	.pack_detail h3{
		font-size: 1.6rem;
	}
	
	.pack_detail ul li{
		font-size: 1.2rem;
	}
	
	/***構造計算マスターWeb極パック***/
	#kouzou_kiwami{}
	
	/***構造設計一級建築士極パック***/
	#structure1q_kiwami{}
	
	/***構造設計一級建築士本科Web***/
	#structure1q_honka{}
	
	/***構造計算初級Web***/
	#kouzou_lv1{}
	
	/***構造計算中級Web***/
	#kouzou_lv2{}
	
	/***その他構造計算講座***/
	#kouzou_other{}
	#kouzou_other .set_price{}
	#kouzou_other .set_price .icon_price{
		display: block;
		margin: 1em auto;
	}
	
	/*****
	受講生の声
	*****/
	.success_header{
		display: block;
	}
	.success_header .face_area{
		display: flex;
		width: 100%;
		margin: 0 auto 1em auto;
	}
	.success_header .face_area h2{
		flex-shrink: 0;
		width: 40%;
		max-width: 200px;
		margin: 0 0.5em 0 0;
	}
	.face_area div{
		flex-grow: 1;
	}
	
	.be_af_area h3{
		font-size: 1.6rem;
		margin-bottom: 34px;
	}
	.be_af_area .be_af_list{
		display: block;
		border: none;
	}
	.be_af_area .be_af_list li{
		font-size: 1.4rem;
		width: 100%;
	}
	.be_af_area .be_af_list li.li_before,
	.be_af_area .be_af_list li.li_after{
		padding: 0.5em;
	}
	.be_af_area .be_af_list li.li_before{
		margin-bottom: 34px;
		border: solid 2px #203864;
	}
	.be_af_area .be_af_list li.li_before::after{
		display: none;
	}
	
	/***タブ設定***/
	.tab_menu li{
		flex-grow: 1;
		font-size: 1.2rem;
		width: auto;
		min-width: 23%;
	}
	.tab_menu li a{
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
		padding: 0.5em 0.25em;
	}
	
	/*****
	コース一覧
	*****/
	/***タブ***/
	.course_tab{
		flex-wrap: wrap;
	}
	.course_tab li{
		flex-grow: 1;
		font-size: 3.6vw;
		text-align: center;
		min-width: 28%;
		margin-right: 2%;
	}
	.course_tab li a{
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
		padding: 0.5em;
	}
	
  .course_list_table tr td{
    margin: 0;
    padding: 10px 10px 10px 5.6em;;
  }
  .course_list_table td::before{
    left: 10px;
    width: 4em;
  }

	/* =============================================
	受講生の声ページ
	============================================= */
	.voice_lead_area{
		font-size: 1.4rem;
		width: 94%;
		padding: 1em;
	}
	
}


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