/* ******************************************************************
 *	File name		: style.css
 *	Summary			: page layout
 * ******************************************************************
 */

/*

orange #D2691E rgba(210,105,30,1.0)

*/

/*----------------------------------------------------------------- nav_active */


.bdcs_research #main_nav nav > ul li:nth-child(2) a::after,
.bdcs_about #main_nav nav > ul li:nth-child(2) a::after,
.bdcs_equipment #main_nav nav > ul li:nth-child(2) a::after,
.bdcs_link #main_nav nav > ul li:nth-child(2) a::after,
.bdcs_monde #main_nav nav > ul li:nth-child(2) a::after,
.bdcs_members #main_nav nav > ul li:nth-child(3) a::after,
.bdcs_achievements #main_nav nav > ul li:nth-child(4) a::after,
.bdcs_announcements #main_nav nav > ul li:nth-child(5) a::after,
.bdcs_news #main_nav nav > ul li:nth-child(6) a::after,
.bdcs_events #main_nav nav > ul li:nth-child(7) a::after,
#bdid_student_activities #main_nav nav > ul li:nth-child(6) a::after,
.bdcs_for_students #main_nav nav > ul li:nth-child(7) a::after,
.bdcs_contact #main_nav nav > ul li:nth-child(8) a::after,
.bdcs_movie #main_nav nav > ul li:nth-child(9) a::after
{
	width:100%;
	background:rgba(210,105,30,1.0);
}

/*----------------------------------------------------------------- h */

main h2,main .h2{
	position:relative;
	padding:10px 15px 8px;
	margin-bottom:20px;
	font-weight:bold;
	font-size:1.4rem;
	text-align:left;
	color:#D2691E;
	background:rgba(210,105,30,0.1);
	border-left:7px solid rgba(210,105,30,1);
	}
	main h2 span,main .h2 span{
		display:inline-block;
		position:relative;
		top:-2px;
		font-size:1.1rem;
}

main h3,main .h3{
	display:block;
	position:relative;
	margin-bottom:5px;
	padding:0px;
	font-weight:bold;
	font-size:1.2em;
	text-align:left;
	color:#D2691E;
	}
	main h3:after,main .h3:after{
		display:block;
		position:relative;
}

main h4,main .h4{
	display:inline-block;
	position:relative;
	margin-bottom:7px;
	padding:5px 15px;
	font-weight:bold;
	font-size:1.0rem;
	text-align:center;
	background:rgba(210,105,30,0.2);
	color:#D2691E;
	}
	main h4:after,main .h4:after{
		display:block;
		position:relative;
}

main h0,main .h0{
	padding:0px !important;
	margin-bottom:10px;
	font-weight:bold;
	font-size:1.4rem;
	text-align:left;
	color:#000;
	background:none;
	border-left:none;
	}
	main h0 span,main .h0 span{
}

/* ----------------------------------------------------------------- section */

main a{
	color:#D2691E;
}


/* ----------------------------------------------------------------- p */

main p{
	text-align:justify;
	text-align-last:left;
	margin-bottom:10px;
}
main p.en{
}
@media(max-width:767px){
	main p{
		line-height:1.3;
	}
}

/* ----------------------------------------------------------------- ul */

main ul{
	position:relative;
	margin-bottom:15px;
	padding-left:30px;
	list-style:disc;
	}
	main ul li{
		position:relative;
	}
	main ul > li p:last-child{
		margin-bottom:0px;
}

main ul.default{
	position:relative;
	margin-bottom:15px;
	padding-left:0px;
	list-style:none;
	}
	main ul.default > li{
		margin-bottom:7px;
		line-height:1.35;
}

main ul.num{
	position:relative;
	margin-bottom:15px;
	padding-left:20px;
	list-style:decimal;
	}
	main ul.disc > li{
		margin-bottom:7px;
		line-height:1.35;
}

main ul.check{
	position:relative;
	margin-bottom:15px;
	padding-left:30px;
	list-style:url(../../image/base/check.png);
	}
	main ul.check > li{
		margin-bottom:7px;
		line-height:1.35;
}

main ul.disc{
	position:relative;
	margin-bottom:15px;
	padding-left:30px;
	list-style:disc;
	}
	main ul.disc > li{
		margin-bottom:7px;
		line-height:1.35;
}

main ul.date{
	position:relative;
	margin-bottom:15px;
	padding-left:0px;
	list-style:none;
	}
	main ul.date > li{
		padding-left:55px;
		margin-bottom:7px;
		line-height:1.35;
	}
	main ul.date > li span:first-child{
		position:absolute;
		left:0px;
}

main ul.liline{
	}
	main ul.liline > li{
		margin-bottom:7px;
		padding-bottom:6px;
		border-bottom:1px dotted rgba(0,0,0,0.3)
}

/* ----------------------------------------------------------------- line */

table.mutual{
	width:100%;
	margin-bottom:20px;
	}
	table.mutual th,
	table.mutual td{
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	table.mutual th{
		width:300px;
		background:#EEEEEE;
	}
	table.mutual tr:nth-child(even) th{
		background:#E6E6E6;
	}
	table.mutual td{
		width:auto;
		background:#FFFFFF;
	}
	table.mutual tr:nth-child(even) td{
		background:#F8F8F8;
}

@media(max-width:600px){
	table.mutual th,
	table.mutual td{
		width:100% !important;
		display:block;
	}
}

/* ----------------------------------------------------------------- box */

.box{
	width:100%;
	margin-bottom:30px;
}
.box:after{
    content:" ";
    display:block;
    clear:both;
	}
	#main_contents .box p:last-child{
		margin-bottom:0px;
	}
	#main_contents .box .ul:last-child{
		margin-bottom:0px;
}

/* ----------------------------------------------------------------- colorbox */

.colorbox{
	display:inline-block;
	width:100%;
	padding:20px 20px 13px;
	margin-bottom:10px;
	background:rgba(210,105,30,0.1);
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	}
	.colorbox h3,h4{
		padding:0px !important;
		background:none !important;
}

/* ----------------------------------------------------------------- line */

.line{
	margin-bottom:15px;
	padding-bottom:15px;
	border-bottom:2px dotted rgba(210,105,30,1.0);
}


/* ----------------------------------------------------------------- arow */

/* .arrow */
main .arrow{
	display:block;
	position:relative;
	margin:0 0 7px 0;
	padding:0 0 0 27px !important;
	text-align:left;
	font-weight:bold;
	font-size:1.1em;
	border:none;
	background:none;
	}
	main .arrow:before,
	main .arrow:after{
		content:" ";
		display:block;
		position:absolute;
	}
	main .arrow:before{
		top:1px;
		left:0px;
		width:20px;
		height:20px;
		margin-left:0;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10px;
		background:#D2691E;
	}
	main .arrow:after{
		top:6px;
		left:7px;
		border: 5px solid transparent;
		border-left: 7px solid rgba(255,255,255,1);
}

/* ----------------------------------------------------------------- photo_box */

.photo_box ul{
	display: flex;
	display: -webkit-flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	flex-wrap:wrap;
	width:100%;
	padding:0px;
	list-style:none;
}
.photo_box ul li{
	margin:0 0 10px;
}
.photo_box.row2 ul li{width:49.5%;margin:0 0 10px;}
.photo_box.row3 ul li{width:33%;margin:0 0 7px;}
.photo_box.row4 ul li{width:24.5%;margin:0 0 5px;}

.photo_box.row2 ul li.wide{width:100% !important;}
.photo_box.row3 ul li.wide{width:100% !important;}
.photo_box.row4 ul li.wide{width:100% !important;}

.photo_box ul li img{
	width:100%;
	height:auto;
}

.photo_box.ex_right ul{
    display:grid;
    grid-template-columns:calc(63% - 10px) 37%;
    grid-template-rows:50% 50%;
}
.photo_box.ex_right ul li:nth-child(1){
    grid-column:1 / 2;
    grid-row:1 / 2;
}
.photo_box.ex_right ul li:nth-child(2){
    grid-column:1 / 2;
    grid-row:2 / 3;
}
.photo_box.ex_right ul li:nth-child(3){
    grid-column:2 / 3;
    grid-row:1 / 3;
}

/* --- responsive --- */
@media(max-width:1000px){
}

/* ----------------------------------------------------------------- photo_box_tile */

.photo_box_tile{
	margin-bottom:0px;
}
.photo_box_tile ul{
	display: flex;
	display: -webkit-flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	flex-wrap:nowrap;
	width:100%;
	padding:0px;
	margin-bottom:0px;
	list-style:none;
}
.photo_box ul li img{
	width:100%;
	height:auto;
}

/* ----------------------------------------------------------------- super_lr */

.super_lr{
	display: -webkit-flex;
	display: flex;
}
.super_lr .move_left{
	-webkit-flex: 1;
	flex: 1;
	padding-right:20px;
}
.super_lr .move_right{
	-webkit-flex: 1;
	flex: 1;
	padding-left:20px;
}

/* --- responsive --- */
@media(max-width:1000px){
	.super_lr{
		display:block;
	}
	.super_lr div{
		width:100% !important;
		padding:0px !important;
	}
}

/* ----------------------------------------------------------------- other */

.btn{
	position:relative;
}
.btn a{
	display:inline-block;
	position:relative;
	padding:5px 20px 6px 30px;
	text-decoration:none;
	background:rgba(210,105,30,0.8);
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	color:#FFF;
	}
	.btn a:after{
		content:" ";
		position:absolute;
		top:calc(50% - 6px);
		left:20px;
		border: 6px solid transparent;
		border-left: 6px solid #FFF;
	}
	.btn a:hover{
		opacity:0.85;
}

/* ----------------------------------------------------------------- other */

.pdf{
	position:relative;
	top:0px;
	margin-right:5px;
}