@charset "utf-8";
/* ===================================================================
CSS information

 file name  :module.css
 author     :日本歯科基礎医学会
 style info :共通（ヘッダー、フッター）
=================================================================== */
/* -----------------------------------------------------------
	#header
		ヘッダー
----------------------------------------------------------- */
#header {
	position: relative;
 	background: #FFF;
    box-shadow: 0 6px 4px -4px rgba(0, 0, 0, .3);
    z-index: 100;
}

h1 {
 font-size: 10px;
	height: 120px;
/*	margin-bottom: 5px;	*/
}

/* -----------------------------------------------------------
 #utilityNav
----------------------------------------------------------- */
#header #utilityNav {
	position: absolute;
	top: 10px;
	right: 0;
}

#header #utilityNav li {
	display: inline;
	font-size: 14px;
}

#header #utilityNav li a {
	color: #222;
	text-decoration: none;
}

#header #utilityNav li a:hover {
	color: #666;
	text-decoration: none;
}

.arrow2 {
    position: relative;
    display: inline-block;
    padding-left: 20px;
				padding-right: 10px;
}
.arrow2:before {
    content: '';
    width: 14px;
    height: 14px;
    background: #148fcb;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -7px;
}
.arrow2:after {
    content: '';
    width: 0;
    height: 0;
    border: solid 3px transparent;
    border-left: solid 5px #ffffff;
    position: absolute;
    top: 50%;
    left: 5px;
    margin-top: -3px;
}

#header #memberNav {
	position: absolute;
	top: 60px;
	right: 10px;
}

.member {
  display: inline-block;
  width: 160px;
  height: 34px;
  text-align: center;
  text-decoration: none;
  line-height: 34px;
  outline: none;
}
.member::before,
.member::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.member,
.member::before,
.member::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.member {
  background-color: #148fcb;
  border: 2px solid #148fcb;
  color: #fff !important;
		font-weight: bold;
  line-height: 30px;
}
.member:hover {
  background-color: #fff;
  border-color: #3aace9;
  color: #148fcb !important;
}

.arrow3 {
    position: relative;
    display: inline-block;
    padding-left: 20px;
				padding-right: 10px;
}
.arrow3:before {
    content: '';
    width: 14px;
    height: 14px;
    background: #fff;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -7px;
}
.arrow3:after {
    content: '';
    width: 0;
    height: 0;
    border: solid 3px transparent;
    border-left: solid 5px #148fcb;
    position: absolute;
    top: 50%;
    left: 5px;
    margin-top: -3px;
}


/* -----------------------------------------------------------
 #btn 
----------------------------------------------------------- */
#header .btn {
	position: absolute;
	top: 0;
	right: 0;
	margin:	37px 0 0 0;
}

#header .btn li {
	display: inline;
}

/* -----------------------------------------------------------
 #nav

.nav {
 position:relative;
 width: 961px;
 height: 54px;
	margin-bottom: 5px;
}

.nav a.menu {
	float: left;
	display: inline-block;
	width: 160px;
	text-align: center;
	text-decoration: none;
	line-height: 20px;
	outline: none;
	font-size: 16px;
	border-left: 1px solid #FFF;
}

.nav a.menu::before,
.nav a.menu::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.nav a.menu,
.nav a.menu::before,
.nav a.menu::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.nav a.menu {
	position: relative;
	z-index: 2;
	background-color: #21609A;
	color: #FFF;
	line-height: 50px;
	overflow: hidden;
}
.nav a.menu:hover {
	background-color: #1A4C7B;
	color: #FFF;
}

.nav #contact {
	border-right: 1px solid #FFF;
}


----------------------------------------------------------- */


/* -----------------------------------------------------------
 #dropmenu

.dropmenu{
 *zoom: 1;
 list-style-type: none;
 width: 960px;
 padding: 0;
}

.dropmenu:before, .dropmenu:after{
 content: "";
 display: table;
}

.dropmenu:after{
 clear: both;
}

.dropmenu li{
 position: relative;
 width: 160px;
 float: left;
	padding-left: 1px;
 padding: 0;
 text-align: center;
}

.dropmenu li a{
 display: block;
 margin: 0;
	background-color: #21609A;
	color: #FFF;
 font-size: 15px;
 line-height: 1;
 text-decoration: none;
}

.dropmenu li ul{
 list-style: none;
 position: absolute;
 z-index: 9999;
 top: 100%;
 left: 0;
 margin: 0;
 padding: 0;
}

.dropmenu li ul li{
	width: 160px;
}

.dropmenu li ul li a{
 padding: 13px 15px;
 border-top: 1px solid #FFF;
	background-color: #21609A;
	color: #FFF;
 text-align: left;
	opacity: 0.9;
}

.dropmenu li:hover > a{
	background-color: #1A4C7B;
	color: #fff;
}

.dropmenu li a:hover{
	background-color: #1A4C7B;
	color: #fff;
}

.dropmenu li ul{
 opacity: 0;
 top: 50%;
 visibility: hidden;
 transition: .5s;
}

.dropmenu li:hover ul{
 top: 100%;
 visibility: visible;
 opacity: 1;
}

----------------------------------------------------------- */


/* -----------------------------------------------------------
 #nav
----------------------------------------------------------- */

.menu {
    position: relative;
    width: 100%;
    height: 50px;
    max-width: 1000px;
    margin: 0 auto;
				background: #148fcb;
}

.menu > li {
    float: left;
    width: 14.2%; /* グローバルナビ4つの場合 */
    height: 50px;
    line-height: 50px;
				background: #148fcb;
}

.menu > li a {
    display: block;
    color: #fff;
				
	/*			padding-left: 5px; */
				text-align: center;
				text-decoration: none !important;
}

.menu > li a:hover {
    color: #fff;
}

ul.menu__second-level {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
}

ul.menu__third-level {
    visibility: hidden;
    opacity: 0;
}

ul.menu__fourth-level {
    visibility: hidden;
    opacity: 0;
}

.menu > li:hover {
    background: #3aace9;
    -webkit-transition: all .5s;
    transition: all .5s;
}

.menu__second-level li {
    border-top: 1px solid #148fcb;
}

.menu__third-level li {
    border-top: 1px solid #148fcb;
}

.menu__second-level li a:hover {
    background: #148fcb;
}

.menu__third-level li a:hover {
    background: #2a1f1f;
}

.menu__fourth-level li a:hover {
    background: #1d0f0f;
}

/* 下矢印 */
.init-bottom:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 15px;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* floatクリア */
.menu:before,
.menu:after {
    content: " ";
    display: table;
}

.menu:after {
    clear: both;
}

.menu {
    *zoom: 1;
}

/* シングル用ドロップダウン */

.menu > li.menu__single {
    position: relative;
}

li.menu__single ul.menu__second-level {
    position: absolute;
    top: 40px;
    width: 100%;
    background: #0B9EE5;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}

li.menu__single:hover ul.menu__second-level {
    top: 50px;
    visibility: visible;
    opacity: 1;
}

.menu li a {
  text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
}


/* -----------------------------------------------------------
	#breadcrumbs
		パンくずリスト
----------------------------------------------------------- */
/* [ul] */
#breadcrumbs {
	overflow: hidden ;
	list-style-type: none ;
}

/* [li] */
#breadcrumbs li {
	float: left ;
	font-weight: 400 ;
}

/* [>] */
#breadcrumbs li:after {
	content: ">" ;
	padding: 0 8px ;
	font-weight: 400 ;
}

/* 一番最後の[li] */
#breadcrumbs li:last-child:after {
	content: none ;
}

/* -----------------------------------------------------------
	#footer
		フッター
----------------------------------------------------------- */
#footer {
	overflow: hidden;
	width: 980px;
	background: #fff; /* fallback for old browsers */
	height: 150px;
	color: #333;
	margin: 0 -200%; /* マージンを追記 フッター横幅用 */
	padding: 0 200%; /* マージンで横にはみ出した部分を戻す フッター横幅用 */
}

/* ウィンドウ幅が480〜768pxの場合に適用するCSS */
@media screen and ( max-width:768px )
{
#footer {
	margin: 0 0;
	padding: 0 0;
}
}

#footer p {
	font-size: 90%;
	margin-top: 20px;
}
#footer p a {
}

#footer .foot_nav {
	background: #0A84BF;
	color: #fff;
	margin: 0 -200%; /* マージンを追記 フッター横幅用 */
	padding: 10px 200%; /* マージンで横にはみ出した部分を戻す フッター横幅用 */
}
#footer .foot_nav li {
	display:	inline;
	list-style-type:	none;
	margin-right:	6px;
	padding-left:	10px;
	border-left:	1px solid #fff;
}
#footer .foot_nav li.start {
	border-left:	0;
	padding-left:	0;
}

#footer .foot_nav li a {
	color: #fff;
	text-decoration: none;
}

#footer .foot_nav li a:hover {
	text-decoration: underline;
}

#footer .foot_nav2 {
	color: #666;
	margin-top: 20px;
}
#footer .foot_nav2 li {
	display:	inline;
	list-style-type:	none;
	margin-right:	6px;
	padding-left:	10px;
	border-left:	1px solid #aaa;
}
#footer .foot_nav2 li.start {
	border-left:	0;
	padding-left:	0;
}

#footer .foot_nav2 li a {
	color: #666;
	text-decoration: none;
}

#footer .foot_nav2 li a:hover {
	text-decoration: underline;
}

#footer .copyright {
	padding: 10px 0 0 0;
}

