@charset "utf-8";
/* スマホだけに適用するCSS */
@media screen and (max-width:479px){
	html {
		min-width:initial;
		min-width:auto;
	}
	
	body {
		min-width:initial;
		min-width:auto;
		overflow-y: scroll;
		font-size:3.6vw;
	}
	
	#container{
		min-width:initial;
		min-width:auto;
	}
	
	/*----------header----------*/
	header{
		min-width:initial;
		min-width:auto;
		width:100%;
		height:auto;
		margin:0;
	}
	
		header > .box_header {
			min-width: initial;
			min-width: auto;
		}
	
			header > .box_header .ext_links{
				display: none;
			}
	
		header > .box_inner{
			width: auto;
			height: auto;
		}
	
			header > .box_inner .site_title{
				box-sizing: border-box;
				width: 84vw;
			}

				header > .box_inner .site_title h1{}

					header > .box_inner .site_title h1 a{
						box-sizing: border-box;
						align-items: flex-end;
						height: 14vw;
						padding: 0 0 2.4vw 3vw;
					}

						header > .box_inner .site_title h1 a .lbl1{
							width: 28vw;
							padding-right: 0;
							margin-right: 3vw;
							border-right: none;
						}

						header > .box_inner .site_title h1 a .lbl2{
							width: 46.4vw;
						}
	
			header > .box_inner .header_nav_box{
				display: none;
			}
	

	
		
	/*-----contents-----*/
	.contents {}
		
	/*-----footer-----*/
	footer{}
	
			footer > .box_header{
				padding: 5vw 5vw 4vw 5vw;
			}
	
			footer > .box_header .pg_links{
				display: block;
				margin-bottom: 1.5em;
			}
	
				footer > .box_header .pg_links ul{
					display: flex;
					flex-direction: column;
					align-items: center;
					font-size: 0.9em;
				}
	
					footer > .box_header .pg_links ul li{
						margin-bottom: 1em;
					}
	
					footer > .box_header .pg_links ul li:last-child{
						margin-bottom: 0;
					}
						
						footer > .box_header .pg_links ul li a{
							display: inline-block;
							text-decoration: none;
							padding-right: 4vw;
							color: #505050;
							background-position: right center;
							background-size: 2vw 2vw;
							background-repeat: no-repeat;
						}
	
						footer > .box_header .pg_links ul li.el_chemistry_bioscience a{
							background-image: url("../shared/icon_el_chemistry_bioscience.png");
						}
	
						footer > .box_header .pg_links ul li.el_chemistry_materials a{
							background-image: url("../shared/icon_el_chemistry_materials.png");
						}

			footer > .box_header .ext_links{
				height: auto;
			}

				footer > .box_header .ext_links ul{
					display: block;
					line-height: 2;
				}

					footer > .box_header .ext_links ul li{
						padding: 0 0.8em;
						display: inline;
						border-right: none;
						position: relative;
					}
	
					footer > .box_header .ext_links ul li:nth-child(1){
						border-left: none;
					}
	
						footer > .box_header .ext_links ul li:before{
							content: "";
							display: block;
							width: 0;
							height: 1em;
							border-left: 1px solid #a2a2a2;
							position: absolute;
							top: 0.2em;
							left: 0;
						}
	
					footer > .box_header .ext_links ul li a{
						background-size: 2vw 2vw;
						padding-right: 4vw;
						font-weight: normal;
						display: inline;
					}

		footer > .box_inner{
			width: auto;
		}

			footer > .box_inner .f_navs1{
				margin-bottom: 5vw;
				justify-content: center;
			}

				footer > .box_inner .f_navs1 .ku_logo_site_title{
					margin-right: 0;
				}

					footer > .box_inner .f_navs1 .ku_logo{
						width: 20vw;
						height: 20vw;
						border-radius: 0 0 2vw 2vw;
					}

						footer > .box_inner .f_navs1 .ku_logo a{
							padding-top: 3vw;
						}

							footer > .box_inner .f_navs1 .ku_logo a .fig{
								width: 12vw;
							}

					footer > .box_inner .f_navs1 .site_title{
						padding: 1vw 0 0 5vw;
						display: flex;
						align-items: center;
					}

						footer > .box_inner .f_navs1 .site_title a{
							width: 54vw;
						}

					footer > .box_inner .f_navs1 ul{
						display: none;
					}
	
			footer > .box_inner .f_navs2{
				margin-bottom: 3vw;
			}

			footer > .box_inner .f_navs2 .pc{
				display: none;
			}

			footer > .box_inner .f_navs2 .sp{
				display: block;
				padding: 0 10vw;
			}
	
				footer > .box_inner .f_navs2 .sp ul{
					display: flex;
					flex-wrap: wrap;
					font-size: 0.9em;
				}
	
					footer > .box_inner .f_navs2 .sp ul li{
						width: calc((100% - 8vw) / 2);
						margin-right: 8vw;
						border-bottom: 1px solid #585a8d;
					}
	
					footer > .box_inner .f_navs2 .sp ul li:nth-child(even){
						margin-right: 0;
					}
	
						footer > .box_inner .f_navs2 .sp ul li a{
							box-sizing: border-box;
							display: flex;
							align-items: center;
							width: 100%;
							height: 9vw;
							padding: 0 0 0 0.4em;
							text-decoration: none;
							transition: .3s all ease;
							line-height: 1.2;
						}
	
						footer > .box_inner .f_navs2 .sp ul li a:hover{
							background: rgba(255,255,255,0.1);
						}


			footer > .box_footer{
				height: 20vw;
				padding-top: 0;
			}


				footer > .box_footer .copyright{
					line-height: 1.8;
					text-align: center;
				}
		
	
	/*ハンバーガーボタン*/
	.nav_oc{
		display:block;
		position:fixed;
		z-index:99;
		text-align:center;
		width: 16vw;
		height: 16vw;
		top: 0;
		right: 0;
	}
	
		.menu-trigger{
			cursor:pointer;
		}
		
		.menu-trigger,
		.menu-trigger span {
			display: inline-block;
			transition: all .4s;
			box-sizing: border-box;
		}
		
		.menu-trigger {
			position:relative;
			width: 100%;
			height: 100%;
			background:none;
			border:none;
			outline:none;
		}
		
			.menu-trigger span {
				width: 7vw;
				left: 4.5vw;
				height: 2px;
				background: #373737;
				position: absolute;
			}

			.menu-trigger span:nth-of-type(1) {
				top: 5vw;
			}

			.menu-trigger span:nth-of-type(2) {
				top: 7.8vw;
			}
			.menu-trigger span:nth-of-type(3) {
				bottom: 5vw;
			}
	
			.menu-trigger.active span:nth-of-type(1) {
				-webkit-transform: translateY(2.8vw) rotate(-315deg);
				transform: translateY(2.8vw) rotate(-315deg);
			}
	
			.menu-trigger.active span:nth-of-type(2) {
				opacity: 0;
			}
	
			.menu-trigger.active span:nth-of-type(3) {
				-webkit-transform: translateY(-3.6vw) rotate(315deg);
				transform: translateY(-2.7vw) rotate(315deg);
			}
	

	
	/*ナビゲーション*/
	.side_nav{
		display:block;
		position:fixed;
		top:0;
		right:0;
		box-sizing:border-box;
		width:100vw;
		height:100vh;
		transition:.3s all ease;
		z-index:-1;
		opacity:0;
	}
	
	.side_nav.active{
		padding:18vw 3vw 0 3vw;
		z-index:98;
		opacity:1;
		background:rgba(199,154,226,0.95);
	}
	
		.side_nav ul{
			width:100%;
			display:flex;
			flex-wrap:wrap;
		}
		
			.side_nav ul li{}
			
			.side_nav ul li a{
				display:block;
				text-decoration:none;
			}
		
		.side_nav ul.side_global_nav{
			margin-bottom:1vw;
		}
		
			.side_nav ul.side_global_nav li{
				width:calc(50% - 0.5vw);
				margin-right:1vw;
				margin-bottom:2vw;
			}
			
			.side_nav ul.side_global_nav li:nth-child(even){
				margin-right:0;
			}
			
				.side_nav ul.side_global_nav li a{
					text-align:center;
					color:#111;
					font-size:3.4vw;
					padding:0.9em 0;
					border:1px solid #fff;
					background:#fff;
					box-shadow:0 0 1px 1px rgba(0,0,0,0.1);
				}


	/*ページトップ*/
	.pagetop{
		right: 2vw;
		bottom: 2vw;
		width:12vw;
		height:12vw;
	}
	
		.pagetop a:before{
			width:4vw;
			height:4vw;
		}
		

	
	/*改行のPC,SPでの表示切替*/
	br.pc,
	img.pc,
	span.pc{
		display:none;
	}
	
	br.sp,
	img.sp,
	span.sp{
		display:inline;
	}

}