@charset "Shift_JIS";

/* **************************************************

Name: floating.css

Description: Setting of Floating Menu

Create: 2018.8

Copyright 2018 Hitachi, Ltd. 

***************************************************** */



/* Internal Link
=========================================================================================== */

.fixed {
	position: fixed !important;
	top: 0;
	margin-top: 0 !important;
	margin-bottom: 0;
	z-index: 9999;
	width: 100% !important;
}

.FloatingUnit {
	position: absolute;
	width: 100%;
  margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #333;
	z-index: 1;
}
.FloatingUnit + .programWrap {
	padding-top: 70px;
  position: relative;
}
.FloatingUnit > .ClearFix {
	max-width: 965px;
	margin: 0 auto;
	text-align: center;
}
.LeftLinks {
  float: left;
}
.RightLinks {
  float: right;
}
.LeftLinks ul,
.RightLinks ul {
	margin: 0;
}
.LeftLinks li,
.RightLinks li{
	float: left;
}
.LeftLinks li a {
	display: inline-block;
	min-width: 100px;
/*	min-height: 42px;*/
	padding: 12px 20px;
	font-size: 83%;
	text-align: center;

  -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.LeftLinks li a:link,
.LeftLinks li a:visited {
	color: #fff;
	text-decoration: none;
}
.LeftLinks li a:hover,
.LeftLinks li a:active,
.LeftLinks li.Current a {
	color: #fff;
	text-decoration: none;
	background-color: #E40A2D !important;
}
.RightLinks li a {
	display: inline-block;
/*	min-width: 1px;
	min-height: 1px;*/
  margin: 11px 6px 0;
	padding: 8px 20px 8px 16px;
	background-image: url(../../../image/jp/r1/icon/icon_link_right_hd.gif);
	background-repeat: no-repeat;
	background-position: right center;
  
	-webkit-background-size:  16px 16px;
  -ms-background-size: 16px 16px;
	background-size:  16px 16px;

  border-radius: 13px;
	font-size: 83%;
  line-height: 100%;
	text-align: center;
  background-color: #fff;

  -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.RightLinks li.myPage a {
	color: #fff;
  background-color: #E40A2D;
	background-image: url(../../../image/jp/r1/icon/icon_link_right_white_hd.gif);
}
.RightLinks li a:link,
.RightLinks li a:visited {
	text-decoration: none;
  border-right: solid 3px transparent;
}
.RightLinks li a:hover,
.RightLinks li a:active {
	text-decoration: underline;
  padding-right: 22px;
	border-right: solid 1px transparent;
/*	background-image: url(../../../image/jp/r1/icon/icon_link_right_hover_hd.gif);*/
}


#t_lecture,
#t_lecture2,
#t_lecture3,
#t_lecture4,
#t_bs_sp,
#t_sp1,
#t_bs1,
#t_bs2,
#t_bs3,
#t_bs4,
#t_bs5,
#t_bs6,
#t_sdgs {
	margin-top:-70px;
	padding-top:70px;
}


/* for - 994px
=========================================================================================== */

@media screen and (max-width: 994px) {
	.JS .FloatingUnit {
		margin-left: -15px;
		margin-right: -15px;
	}
}

/* for - 965px
=========================================================================================== */

@media screen and (max-width: 965px) {

	.JS .FloatingUnit:after {
		position: absolute;
		content: "";
		left: 0;
		right: 0;
		bottom: 0;
	}
	.JS .FloatingUnit + .TopMarginSet {
		padding-top: 0;
	}

}

/* for - 910px　文字量多く2行となるここをブレインクポイント
=========================================================================================== */

@media screen and (max-width: 910px) {
  
  .JS .LeftLinks { width: 100%;}
  .JS .LeftLinks li {width: 18%;	}
  .JS .LeftLinks li:nth-of-type(4) {width: 46%;}
  .JS .LeftLinks li a {width: 100%;}
  
  .JS .RightLinks {
    float: left;
    padding-left: 10px;
  }
  .JS .RightLinks li a {
    margin: 11px 6px;
  }
  
  .FloatingUnit + .programWrap {
	padding-top: 120px;
}
  #t_lecture,
  #t_lecture2,
  #t_lecture3,
  #t_lecture4,
  #t_bs_sp,
  #t_sp1,
  #t_bs1,
  #t_bs2,
  #t_bs3,
  #t_bs4,
  #t_bs5,
  #t_bs6,
  #t_sdgs {
  margin-top:-100px;
  padding-top:100px;
  }

}



/* for - 767px
=========================================================================================== */

@media screen and (max-width: 767px) {

  .JS .LeftLinks li {width: 15%;}
  .JS .LeftLinks li:nth-of-type(4) {width: auto;}

}



/* for - 579px
=========================================================================================== */

@media screen and (max-width: 579px) {

	.JS .FloatingUnit {
  position: relative;
  width: 103.2%;
  width: -webkit-calc(100% + 30px);
  width: calc(100% + 30px);
	}

	.JS .LeftLinks li,
  .JS .LeftLinks li:nth-of-type(4) {
		width: 50%;
	}
	.JS .LeftLinks li a {
		width: 100%;
		padding: 6px 0;
		border-bottom: 1px solid #fff;
		font-size: 76%;
	}
  .JS .RightLinks li a {
   margin: 6px;
  }
  .JS .LeftLinks li:nth-of-type(3) a,
  .JS .LeftLinks li:nth-of-type(4) a {
    border-bottom: none;
  }
  .JS .RightLinks {
    width: 100%;
    border-top: 1px solid #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .JS .FloatingUnit + .programWrap {
    padding-top: 20px;
  }
	.JS #t_lecture,
	.JS #t_lecture2,
	.JS #t_lecture3,
	.JS #t_lecture4,
	.JS #t_bs_sp,
	.JS #t_sp1,
	.JS #t_bs1,
	.JS #t_bs2,
	.JS #t_bs3,
	.JS #t_bs4,
	.JS #t_bs5,
	.JS #t_bs6,
	.JS #t_sdgs {
		margin-top: 0;
		padding-top: 0;
	}

}

/* for - 399px
=========================================================================================== */

@media screen and (max-width: 399px) {



}