/* ******************************************************************
 *	File name		: top.css
 *	Summary			: css base
 * ******************************************************************
*/

:root {
	--fontsize-p:1.2rem;
	--fontsize-p-sp:1.0rem;
	--fontsize-mini:0.8rem;
	--fontsize-strong:1.48rem;
}

/* -----------------------------------------------------------------
   main
----------------------------------------------------------------- */

body{
	background:none;
}
main{
	padding:150px 0 0;
}
#main_contents{
	position:relative;
	max-width:100%;
	margin:0px;
	padding:0px 0 0px;
	text-align:center;
	z-index:1;
}
section:last-child{
	margin:0 auto 50px;
}

/* -----------------------------------------------------------------
   pnkz
----------------------------------------------------------------- */


#pnkz{
	display:-webkit-flex;
	display:flex;
	justify-content:center;
	align-items:center;
	position:relative;
	width:1140px;
	max-width:100%;
	height:50px;
	margin:0 auto 30px;
	padding:0 20px;
	max-width:100%;
	text-align:left;
	background:none;
	list-style:none;
	background:rgba(6,11,111,0.1);
	z-index:100;
	}
	#pnkz *{
		font-size:0.87rem;
		color:#000;
	}
	#pnkz ul{
		position:relative;
		width:1240px;
		max-width:100%;
		margin:0 auto;
		list-style:none;
	}
	#pnkz ul li{
		display:inline-block;
		position:relative;
		}
		#pnkz ul li:first-child{
			padding-left:35px;
		}
		#pnkz ul li::before{
			content:">";
			position:relative;
			top:-1px;
			margin:0 12px;
		}
		#pnkz ul li:first-child::before{
			content:" ";
			display:block;
			position:absolute;
			top:-2px;
			left:0px;
			width:26px;
			height:26px;
			margin:0px;
			background:url(../../image/base/home.png) no-repeat 0 0;
		}
		#pnkz ul li a{
			color:#060B6F;
			text-decoration:underline;
}
/* --- responsive --- */
@media only screen and (max-width:767px){
	#pnkz{
		display:none;
	}
}

/* -----------------------------------------------------------------
   footer
----------------------------------------------------------------- */

footer{
	position:relative;
	width:100%;
	height:auto;
	margin:0px;
	padding:calc(29.27vw + 50px) 0 30px;
	text-align:left;
	background:#060B6F;
	z-index:10;
	overflow:hidden;
	}
	footer::before{
		content:" ";
		position:absolute;
		top:0px;
		left:0px;
		width:100vw;
		height:29.27vw;
		background:url(../../image/base/nanoTerasu.jpg) no-repeat 0 0;
		background-size:contain;
}

/* --- responsive --- */
@media screen and (max-width:767px){
	.maglass{
		pointer-events:none;
	}
	.maglass::after{
		display:none;
	}
}


/* -----------------------------------------------------------------
   news
----------------------------------------------------------------- */

section h2{
	display:inline-block;
	position:absolute;
	left:0px;
	text-align:center;
	margin:0 0 40px;
	font-weight:bold;
	font-size:2.0rem;
	line-height:1.5;
	color:#060B6F;
	}
	section h2::after{
		content:" ";
		display:block;
		position:relative;
		width:50px;
		height:35px;
		margin:0 auto;
		background:url(../../image/base/section_h2.png) no-repeat center center;
		background-size:contain;
}

#news h2{
	width:160px;
}

#title_box{
	position:relative;
	width:100%;
	margin:0 0 25px;
	min-height:100px;
	text-align:left;
	border-bottom:1px solid #060B6F;
	}
	#title_box .date{
		display:block;
		width:100%;
		margin:0 0 10px;
		font-weight:bold;
		font-size:1.2rem;
		text-align:left;
		color:#060B6F;
	}
	#title_box h3{
		display:-webkit-flex;
		display:flex;
		justify-content:flex-start;
		align-items:center;
		width:100%;
		min-height:50px;
		margin:0 0 15px;
		font-weight:bold;
		font-size:1.4rem;
		color:#060B6F;
		line-height:1.5;
}

#news #title_box{
	padding-left:180px;
}

/* --- responsive --- */
@media only screen and (max-width:767px){
	section h2{
		position:relative;
		margin:0 auto 40px;
	}
	#title_box{
		padding-left:0px !important;
	}
	#title_box h2{
		width:100%;
		text-align:center;
	}
	#title_box h3{
		font-size:1.2rem;
	}
}


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

section p{
	position:relative;
	margin:0 0 15px;
	font-weight:bold;
	font-size:1.1rem;
	text-align:justify;
	line-height:1.75;
}

section h4{
	position:relative;
	margin:0 0 15px;
	font-weight:bold;
	font-size:1.3rem;
	text-align:left;
	border-bottom:1px solid #000;
	line-height:1.75;
}

/* --- responsive --- */
@media only screen and (max-width:767px){
	section p{
		font-size:0.9rem;
	}
	section h4{
		font-size:1.1rem;
	}
}

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

#article_box{
	position:relative;
	width:800px;
	max-width:100%;
	margin:0 auto;
}

.box{
	position:relative;
	width:100%;
	margin:0 0 50px;
	text-align:left;
}

/* -----------------------------------------------------------------
   table
----------------------------------------------------------------- */

table{
	position:relative;
	min-width:25%;
	margin-bottom:20px;
	border-collapse:collapse;
	border-spacing:0px;
	line-height:2;
	}
	table th,
	table td{
		padding:5px 10px 3px 10px;
		font-size:1rem;
		text-align:left;
		border-bottom:1px solid rgba(6,11,111,0.3);
	}
	table th{
		min-width:120px;
		font-weight:bold;
		color:rgba(59,65,130,1);
		background:none;
		vertical-align:middle;
	}	
	.color-black table th{
		color:#FFF;
	}
	table td{
		font-weight:normal;
}
/* th */
table.th_fwn th{font-weight:normal;}
table.th_center th{text-align:center;}
table.th_left th{text-align:left;}
table.th_right th{text-align:right;}
table.th_middle th{vertical-align:middle;}

/* td */
table.td_fwb th{font-weight:bold;}
table.td_center td{text-align:center;}
table.td_left td{text-align:left;}
table.td_right td{text-align:right;}
table.td_middle td{vertical-align:middle;}

/* ex */
table .bg_blue{background:rgba(0,97,177,0.1);}
table .bg_blue2{background:rgba(0,97,177,0.2);}
table .bg_green{background:rgba(111,185,44,0.1);}
table .bg_green2{background:rgba(111,185,44,0.2);}


/* --- responsive --- */
@media only screen and (max-width:767px){
	table{
		width:100%;
	}
	table th,
	table td{
		font-size:0.94rem;
	}

	table.change_sp_table{
		border:none;
	}
	table.change_sp_table th,
	table.change_sp_table td{
		display:block;
		border:none;
		}
		table.change_sp_table td:last-child{
			border-bottom:1px dotted rgba(0,0,0,0.3);
			margin:0 0 15px;
	}
}

/*-----------------------------------
  sp kumikawari
-----------------------------------*/

table.break_table{}

/* --- responsive --- */
@media only screen and (max-width:767px){
	table.break_table tr{
		display:block;
		margin:0 0 20px;
	}
	table.break_table th,
	table.break_table td{
		display:block;
		width:100% !important;
		padding:0px;
	}
	table.break_table td{
		border:none;
	}
}

table.noborder,
table.noborder tr,
table.noborder th,
table.noborder td{
	border:none;
}

/* -----------------------------------------------------------------
   photo_list
----------------------------------------------------------------- */

ul.photo_list{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	list-style:none;
	}
	.photo_list li{
		width:100%;
		margin:0 0 30px;
	}
	.photo_list.col2 li{
		width:49%;
		margin:0 0 18px;
	}
	.photo_list.col3 li{
		width:32.5%;
		margin:0 0 8px;
	}
	.photo_list.col3 li:nth-child(3n+2):last-child{
		width:32.5%;
		margin:0 33.75% 8px 0;
	}
	.photo_list li.wide{
		width:100% !important;
	}
	.photo_list li figure{
		margin:0 auto;
	}
	.photo_list li figure figcaption{
		padding:5px 0px;
		font-size:1.0rem;
		text-align:center;
}
/* --- responsive --- */
@media only screen and (max-width:767px){
	.photo_list.col3 li,
	.photo_list.col3 li:nth-child(3n+2):last-child{
		width:49%;
		margin:0 0 18px;
	}
	.photo_list li figure figcaption{
		font-size:0.77rem;
	}
}

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

.colorbox{
	display:inline-block;
	position:relative;
	margin:0 0 20px;
	padding:15px 25px;
	background:rgba(6,11,111,0.1);
	border:1px solid rgba(6,11,111,0.5);
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	}
	.colorbox *:last-child{
		margin-bottom:0px !important;
	}
	.colorbox .colorbox_title{
		font-weight:bold;
		border-bottom:2px solid rgba(6,11,111,0.5);
		color:rgba(6,11,111,1) !important;
}

.colorbox_b{
	display:inline-block;
	position:relative;
	margin:0 0 20px;
	padding:15px 25px;
	background:rgba(35,50,101,0.05);
	border:1px solid rgba(35,50,101,0.5);
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	}
	.colorbox_b *:last-child{
		margin-bottom:0px !important;
	}
	.colorbox_b .colorbox_title{
		font-weight:bold;
		border-bottom:2px solid rgba(35,50,101,0.5);
		color:rgba(35,50,101,1) !important;
}

/* -----------------------------------------------------------------
   back_btn
----------------------------------------------------------------- */

#back_btn{
	margin:50px 0 0 0;
	padding:50px 0;
	text-align:center !important;
	border-top:1px solid #060B6F;
	}
	#back_btn a{
		margin:0px auto;
}

/* -----------------------------------------------------------------
   news_list
----------------------------------------------------------------- */

#news_list{
	position:relative;
	padding:0px 0 0 160px;
	z-index:1;
	}
	#news_list ul{
		margin:0 0 0px;
		list-style:none;
	}
	#news_list ul li{
		margin:0 0 20px;
		font-weight:bold;
		font-size:0.84rem;
		font-size:1.00rem;
		list-style:none;
		text-align:left;
		color:#0B248E;
	}
	#news_list ul li a{
		font-weight:inherit;
		font-size:inherit;
		color:inherit;
		}
		#news_list ul li a:hover{
			text-decoration:none;
			color:#51AEC8;
	}
	#news_list ul li .date{
		display:block;
		margin:0 0 5px;
		font-weight:bold;
		font-size:inherit;
		font-size:1.00rem;
		color:#0B248E;
		}
		#news_list ul li.new .date::after{
			content:"New";
			display:inline-block;
			margin:0 0 0 15px;
			padding:1px 10px;
			font-weight:bold;
			font-size:1.0rem;
			background:#0B248E;
			line-height:1;
			color:#FFF;
	}
	#news_list ul li a:hover .date{
		color:#51AEC8;
		}
		#news_list ul li a:hover .date::after{
			background:#51AEC8;
	}

/* --- responsive --- */
@media screen and (max-width:767px){
	#news_list{
		padding:0px 0 0;
	}
}