@charset "UTF-8";
/* CSS Document */
/*==============header===============*/

html { width: 100%;height: 100%;margin: 0;	padding: 0;} 
body{width:100%;height: 100%;margin:0;padding:0; -webkit-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;}
body.open_navigation{	position: fixed;height: 100vh;}

.mincho{font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
.clearfix:after{content: "";clear: both;display: block;}
.alternate-gothic{font-family: "alternate-gothic-atf", sans-serif;font-style: normal;}
:hover{-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all  0.3s ease;}

@media (min-width:1051px) {
	header{width: 100%;height:160px;}
	
	header #header_wrapper{position: fixed;	top:0;left:0%;width: 100%;height:160px; background:white;z-index: 999}
	
	header #header_wrapper .site_title{position:absolute;	top:40px;left: 2%;}
	header #header_wrapper .site_title a{display: block; text-decoration:none;color:#002551}
	header #header_wrapper .site_title a p{padding: 0px 0px 2px 0;margin: 0;font-size: 14px;letter-spacing:1px;font-weight: 500}
	header #header_wrapper .site_title a h1{padding: 0px 0px;margin: 0;font-size:22px;letter-spacing: 1px;font-weight: 500}
	header #header_wrapper .site_title a:hover{opacity:0.5;}
	
	nav{}	
	nav .button{display:none}	
	
	nav #menu_area{/*background: linear-gradient(45deg, #1e4668 0%, #0f3461 38%, #004e7e 65%, #0c4151 100%);background: linear-gradient(90deg, #004e7e 0%, #1e4668 50%, #004e7e 100%);*/}
	nav #menu_area .inner{}
	
	nav #menu_area .inner .base{position:absolute;	bottom:0px;left:0%;width: 100%;min-width: 1200px;background: #00477f;box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);text-align: center}
	nav #menu_area .inner .base a{display:inline-block;height: 40px;margin: 0; padding: 18px 12px 0 12px;color: white;font-size: 15px;letter-spacing:1px;text-decoration: none;font-weight:300}
	nav #menu_area .inner .base a:hover{background: linear-gradient(45deg, #009fa1 0%, #0099b2 100%);;color: white}
	
	nav #menu_area .inner .member_login{position:fixed;	top:10px;right: 30px;}
	nav #menu_area .inner .member_login a{display: block;padding:8px 14px 6px 14px;text-decoration: none;color: white;background:#009fa1;border-radius:5px 5px;font-weight:300}
	nav #menu_area .inner .member_login a:hover{background:#4590d2;}
	nav #menu_area .inner .member_login a .sub{font-size: 13px;letter-spacing: 0px;}
	nav #menu_area .inner .member_login a .mail{font-size: 14px;letter-spacing: 1px;}
	
	nav #menu_area .inner .e-defense_banner{position:fixed;	top:62px;right: 30px;}
	nav #menu_area .inner .e-defense_banner a{position: relative;display: block; padding:0px 30px 0px 0px;/*border: 1px solid #C1C1C1;border-radius: 5px*/}
	nav #menu_area .inner .e-defense_banner a span{display:none;}
	nav #menu_area .inner .e-defense_banner a img{width: 120px;}
	nav #menu_area .inner .e-defense_banner a::before{content:'\f08e';position: absolute;right: 10px;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight: 900;font-size: 12px;color:#999999}
	nav #menu_area .inner .e-defense_banner a:hover{opacity:0.5;}
	
	nav #menu_area .inner .sub_menu{position:fixed;	top:65px;right: 190px;border-right: 1px solid #D5D5D5}
	nav #menu_area .inner .sub_menu a{position: relative;padding: 0px 0px 0 12px;margin: 0 10px 0 0;text-decoration: none;color:#001126;font-size: 14px;letter-spacing:0px;font-weight: 400}
	
	nav #menu_area .inner .sub_menu a::before{content:'\f0da';position:absolute;left:0px;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight:900;font-size: 12px;color:#009fa1}
	
	
	nav #menu_area .inner .sub_menu a:hover{color:#009fa1;}
	nav #menu_area .inner .sub_menu a.contact_member{display:none;}
	
	/*フッター*/
	footer{background: linear-gradient(45deg, #20294b 30%, #2d2e5a 100%);}
	
	footer .link_banner{background: #eef2f2;padding:50px 0;text-align: center;border-top: 1px solid #DCDCDC;}
	footer .link_banner a{display:inline-block;width: 400px; background:white;padding:16px 0 14px 0;margin: 0 10px;border: 1px solid #DCDCDC;color: #2b4759}
	footer .link_banner a img{display: block;height:50px;margin: 0 auto 10px auto}
	footer .link_banner a span{display: block; font-size: 12px}
	footer .link_banner a:hover{opacity:0.5;}
	
	footer #site_map_area{width: 1000px;margin:0px auto 0 auto; display:flex;justify-content: space-between;padding:50px 0 100px 0;}
	footer #site_map_area .unit a{font-size: 14px;color: white;padding:6px 0px 6px 0;text-decoration: none;display: block;letter-spacing: 1px;font-weight:400}
	footer #site_map_area .unit a:hover{color:#4590d2}
	
	footer #laboratory_area{width: 1000px;margin:0px auto 0 auto; display:flex;justify-content: space-between;padding:0px 0 0px 0;}	
	footer #laboratory_area .title{width:50%;margin:  0}	
	footer #laboratory_area .title a{display: block;margin: 0 auto; padding:0px 0;font-size: 18px;letter-spacing:1px;color: white;text-decoration: none;font-weight: 300;}
	footer #laboratory_area .title a span{display: block;font-size: 12px;margin: 0 auto 5px 0}	
	footer #laboratory_area .title a:hover{color:#4590d2}
	footer #laboratory_area .member_login{width: 40%;padding:0px 0;}
	footer #laboratory_area .member_login a{display: block;padding:8px 16px;color: white;letter-spacing: 1px;text-decoration: none;text-align: center;background: linear-gradient(45deg, #009fa1 0%, #0099b2 100%);border-radius: 5px;}
	footer #laboratory_area .member_login a .sub{font-size: 14px;display: block;}
	footer #laboratory_area .member_login a .main{font-size: 16px;}
	footer #laboratory_area .member_login a:hover{background:#4590d2;}
	
	footer small{display: block;border-top: 1px solid #484e54;font-size: 11px;color:white;letter-spacing: 2px;padding: 30px 0 30px 0;margin: 50px auto 0 auto;text-align: center}
}

@media screen and (min-width:701px) and ( max-width:1050px)  {
	header{width: 100%;}
	
	header #header_wrapper{position: fixed;	top:0;left:0%;width: 100%;height:80px; background:white;box-shadow: 0 0.3rem 0.7rem rgba(0, 0, 0, 0.15);z-index: 999}
	
	header #header_wrapper .site_title{position:absolute;top:50%;transform: translateY(-50%);left: 2%;}
	header #header_wrapper .site_title a{display: block; text-decoration:none;color:#002551}
	header #header_wrapper .site_title a p{padding: 0px 0px;margin: 0;font-size:clamp(14px,1.0vw,16px);letter-spacing: 1px;font-weight: 500}
	header #header_wrapper .site_title a h1{padding: 0px 0px;margin: 0;font-size:clamp(20px,1.9vw,26px);letter-spacing: 1px;font-weight: 500}
	header #header_wrapper .site_title a:hover{opacity:0.5;}	
	
	nav{}		
	.button{display:block;	position: absolute;	right:1%;top:50%;transform: translateY(-50%);width: 70px;height:70px;padding:0px 0 0 0px;margin: 0 0; background: linear-gradient(45deg, #0049a1 0%, #008fb2 100%);cursor:pointer;border-radius:6px} 	
	.button p{position: absolute;	top:25%;left: 0;width: 100%;margin: 0;padding: 0;	color:white;font-size: 13px;letter-spacing:1px;font-weight: 500;text-align: center;transition: .35s ease-in-out;}
	.button span {display:block;position: absolute;	height:2px;border-radius: 2px;	background:#caeaf6;right:25%;	-webkit-transition: .35s ease-in-out;	-moz-transition: .35s ease-in-out;	transition: .35s ease-in-out;}
    .button span:nth-child(1) {	top:55%;width:50%;}
    .button span:nth-child(2) {	top:65%;width:50%;}
    .button span:nth-child(3) {	/*top:60%;width:50%;*/}      
	.button.open_navigation{z-index:9999;}
	.button.open_navigation p{display:none;}
	.button.open_navigation span{display:block;	background:#fffff4;}
    .button.open_navigation span:nth-child(1) {width:30%;top: 50%;left: 35%;	-webkit-transform: rotate(45deg);	-moz-transform: rotate(45deg);	transform: rotate(45deg);}
    /*.button.open_navigation span:nth-child(2) {width: 0;	left: 50%;}*/
    .button.open_navigation span:nth-child(2) {	width:30%;top:50%;left: 35%;	-webkit-transform: rotate(-45deg);	-moz-transform: rotate(-45deg);	transform: rotate(-45deg);}
    #menu_area.open_navigation{	display: block;	animation-duration: 0.6s;	animation-name:button_open;z-index:999;/*background-color:white;*/}         
    @keyframes button_open{ from { opacity:0.1;}        to { opacity:1;}    }	
	
	nav #menu_area{display: none;width: 100%;height:100vh;position:fixed;	top:80px;left: 0;background: rgba(0,67,113,0.8)/*background:#004371;*/}
	nav #menu_area .inner{position: fixed;top:80px;left:0%;width:100%;height:78vh;margin:0 auto;padding:0 0 80px 0;background:#f7f9f9;overflow-y: scroll;	-webkit-overflow-scrolling: touch;	overflow-scrolling: touch;}
	
	nav #menu_area .inner .base{margin-top: 30px}
	nav #menu_area .inner .base a{position: relative;display:block;width: 80%;margin: 0 auto; padding: 24px 0%;color: #004371;font-size: 16px;letter-spacing:1px;text-decoration: none;font-weight:400;border-bottom: 1px solid #cccccc}
	nav #menu_area .inner .base a::before{content:'\f105';position: absolute;right:3%;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight: 900;font-size: 12px;color:#009fa1}
	nav #menu_area .inner .base a:hover{;color: #009fa1}
	
	nav #menu_area .inner .member_login{margin-top:20px}
	nav #menu_area .inner .member_login a{position: relative;display: block;width: 80%;margin: 0 auto; padding:12px 0% 12px 3%;text-decoration: none;color: white;background:#009fa1;border-radius:5px 5px;font-weight:300;box-sizing: border-box;}	
	nav #menu_area .inner .member_login a .sub{display: block;font-size: 14px;letter-spacing: 0px;}
	nav #menu_area .inner .member_login a .mail{font-size: 16px;letter-spacing: 1px;}
	nav #menu_area .inner .member_login a::before{content:'\f105';position: absolute;right:3%;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight:900;font-size: 12px;color:white}
	nav #menu_area .inner .member_login a:hover{background:#4590d2;}
	
	nav #menu_area .inner .e-defense_banner{margin-top: 20px}
	nav #menu_area .inner .e-defense_banner a{position: relative;display: block;width: 80%;margin: 0 auto; padding:12px 0% 12px 3%;background: white;box-sizing: border-box;text-decoration: none;}
	nav #menu_area .inner .e-defense_banner a img{width:25%;}
	nav #menu_area .inner .e-defense_banner a span{display:block;font-size: 12px;letter-spacing: 0px;color: #4d4d4d}
	nav #menu_area .inner .e-defense_banner a::before{content:'\f08e';position: absolute;right: 3%;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight: 900;font-size: 12px;color:#999999}
	nav #menu_area .inner .e-defense_banner a:hover{opacity:0.5;}
	
	nav #menu_area .inner .sub_menu{margin-top: 20px}
	nav #menu_area .inner .sub_menu a{position: relative;display: block;width: 80%;margin: 0 auto; padding: 16px 0% 16px 2%;text-decoration: none;color:#001126;font-size: 16px;letter-spacing:1px;font-weight: 400;box-sizing: border-box;}
	nav #menu_area .inner .sub_menu a::before{content:'\f0da';position: absolute;left:0px;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight:900;font-size: 12px;color:#009fa1}
	nav #menu_area .inner .sub_menu a:hover{color:#009fa1;}
	
	
	
	/*フッター*/
	footer{background: linear-gradient(45deg, #20294b 30%, #2d2e5a 100%);}
	
	footer .link_banner{width: 100%;margin: 0 auto;background: #eef2f2;padding:50px 5%;box-sizing: border-box;text-align: center;border-top: 1px solid #DCDCDC;display: flex;justify-content: space-between}
	footer .link_banner a{display:block;width: 49%; background:white;padding:16px 3% 14px 3%;margin: 0 0px;box-sizing: border-box;border: 1px solid #DCDCDC;color: #2b4759}
	footer .link_banner a img{display: block;height:50px;margin: 0 auto 10px auto}
	footer .link_banner a span{display: block; font-size: 12px}
	footer .link_banner a:hover{opacity:0.5;}
	
	footer #site_map_area{width:80%;margin:0px auto 30px auto;padding:50px 0 30px 0;border-bottom: 1px solid #484e54;}
	footer #site_map_area .unit a{font-size: 14px;color: white;padding:10px 0px 10px 0;text-decoration: none;display: block;letter-spacing: 1px;font-weight:400}
	footer #site_map_area .unit a:hover{color:#4590d2}
	
	footer #laboratory_area{width:80%;margin:0px auto 0 auto; padding:0px 0 0px 0;}		
	footer #laboratory_area .title{margin:0px auto 30px auto;}
	footer #laboratory_area .title a{display: block;margin: 0 auto; padding:0px 0;font-size: 18px;letter-spacing:1px;color: white;text-decoration: none;font-weight: 300;}
	footer #laboratory_area .title a span{display: block;font-size: 12px;margin: 0 auto 5px 0}	
	footer #laboratory_area .title a:hover{color:#4590d2}	
	footer #laboratory_area .member_login a{display: block;padding:8px 16px;color: white;letter-spacing: 1px;text-decoration: none;text-align: center;background: linear-gradient(45deg, #009fa1 0%, #0099b2 100%);border-radius: 5px;}
	footer #laboratory_area .member_login a .sub{font-size: 14px;display: block;}
	footer #laboratory_area .member_login a .main{font-size: 16px;}
	footer #laboratory_area .member_login a:hover{background:#4590d2;}
	
	footer small{display: block;border-top: 1px solid #484e54;font-size: 11px;color:white;letter-spacing: 2px;padding: 30px 0 30px 0;margin: 50px auto 0 auto;text-align: center}
}

@media (max-width: 700px) {
	header{width: 100%;}
	
	header #header_wrapper{position: fixed;	top:0;left:0%;width: 100%;height:100px; background:white;box-shadow: 0 0.3rem 0.7rem rgba(0, 0, 0, 0.15);z-index: 999}
	
	header #header_wrapper .site_title{position:absolute;top:50%;transform: translateY(-50%);left: 2%;width: 80%}
	header #header_wrapper .site_title a{display: block; text-decoration:none;color:#001126}
	header #header_wrapper .site_title a p{padding: 0px 0px;margin: 0;font-size:clamp(10px,0.6vw,12px);letter-spacing:0px;font-weight: 600;line-height: 1.4}
	header #header_wrapper .site_title a h1{padding: 0px 0px;margin: 0;font-size:clamp(16px,1.0vw,22px);letter-spacing: 0px;font-weight: 600;line-height: 1.4}
	header #header_wrapper .site_title a:hover{opacity:0.5;}	
	
	nav{}		
	.button{display:block;	position: absolute;	right:2%;top:50%;transform: translateY(-50%);width: 60px;height:60px;padding:0px 0 0 0px;margin: 0 0; background: linear-gradient(45deg, #0049a1 0%, #008fb2 100%);cursor:pointer;border-radius:6px} 	
	.button p{position: absolute;	top:25%;left: 0;width: 100%;margin: 0;padding: 0;	color:white;font-size: 12px;letter-spacing:0px;font-weight: 500;text-align: center;transition: .35s ease-in-out;}
	.button span {display:block;position: absolute;	height:2px;border-radius: 2px;	background:#caeaf6;right:25%;	-webkit-transition: .35s ease-in-out;	-moz-transition: .35s ease-in-out;	transition: .35s ease-in-out;}
    .button span:nth-child(1) {	top:55%;width:50%;}
    .button span:nth-child(2) {	top:65%;width:50%;}
    .button span:nth-child(3) {	/*top:60%;width:50%;*/}      
	.button.open_navigation{z-index:9999;}
	.button.open_navigation p{display:none;}
	.button.open_navigation span{display:block;	background:#fffff4;}
    .button.open_navigation span:nth-child(1) {width:30%;top: 50%;left: 35%;	-webkit-transform: rotate(45deg);	-moz-transform: rotate(45deg);	transform: rotate(45deg);}
    /*.button.open_navigation span:nth-child(2) {width: 0;	left: 50%;}*/
    .button.open_navigation span:nth-child(2) {	width:30%;top:50%;left: 35%;	-webkit-transform: rotate(-45deg);	-moz-transform: rotate(-45deg);	transform: rotate(-45deg);}
    #menu_area.open_navigation{	display: block;	animation-duration: 0.6s;	animation-name:button_open;z-index:999;/*background-color:white;*/}         
    @keyframes button_open{ from { opacity:0.1;}        to { opacity:1;}    }	
	
	nav #menu_area{display: none;width: 100%;height:100vh;position:fixed;	top:100px;left: 0;background: rgba(0,67,113,0.8)/*background:#004371;*/}
	nav #menu_area .inner{position: fixed;top:100px;left:0%;width:100%;height:78vh;margin:0 auto;padding:0 0 50px 0;background:#f7f9f9;overflow-y: scroll;	-webkit-overflow-scrolling: touch;	overflow-scrolling: touch;}
	
	nav #menu_area .inner .base{margin-top: 10px}
	nav #menu_area .inner .base a{position: relative;display:block;width: 80%;margin: 0 auto; padding: 16px 5% 16px 0;color: #004371;font-size: 14px;letter-spacing:1px;text-decoration: none;font-weight:400;border-bottom: 1px solid #cccccc;box-sizing: border-box;}
	nav #menu_area .inner .base a::before{content:'\f105';position: absolute;right:3%;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight: 900;font-size: 12px;color:#009fa1}
	nav #menu_area .inner .base a:hover{;color: #009fa1}
	
	nav #menu_area .inner .member_login{margin-top:10px}
	nav #menu_area .inner .member_login a{display: block;width: 80%;margin: 0 auto; padding:12px 0 12px 0%;text-decoration: none;color: white;background:#009fa1;border-radius:5px 5px;font-weight:300;box-sizing: border-box;text-align: center}	
	nav #menu_area .inner .member_login a .sub{display: block;font-size: 12px;letter-spacing: 0px;}
	nav #menu_area .inner .member_login a .mail{position: relative;font-size: 15px;letter-spacing: 0px;}
	nav #menu_area .inner .member_login a .mail::before{content:'\f105';position: absolute;left:105%;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight: 900;font-size: 12px;color:white}
	nav #menu_area .inner .member_login a:hover{background:#4590d2;}
	
	nav #menu_area .inner .e-defense_banner{margin-top: 10px}
	nav #menu_area .inner .e-defense_banner a{position: relative;display: block;width: 80%;margin: 0 auto; padding:12px 0% 12px 0%;background: white;box-sizing: border-box;text-decoration: none;text-align: center}
	nav #menu_area .inner .e-defense_banner a img{width:45%;max-width: 150px}
	nav #menu_area .inner .e-defense_banner a span{display:block;width: 95%;margin:5px auto 0 auto;font-size:9px;letter-spacing: 0px;color: #4d4d4d}
	nav #menu_area .inner .e-defense_banner a::before{content:'\f08e';position: absolute;right: 5%;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight: 900;font-size: 12px;color:#999999}
	nav #menu_area .inner .e-defense_banner a:hover{opacity:0.5;}
	
	nav #menu_area .inner .sub_menu{margin-top: 10px}
	nav #menu_area .inner .sub_menu a{position: relative;display: block;width: 80%;margin: 0 auto; padding: 10px 0% 10px 5%;text-decoration: none;color:#001126;font-size: 14px;letter-spacing:1px;font-weight: 400;box-sizing: border-box;}
	nav #menu_area .inner .sub_menu a::before{content:'\f0da';position: absolute;left:0px;top: 50%;transform: translateY(-50%);font-family: 'Font Awesome 5 Free';  font-weight: 900;font-size: 12px;color:#009fa1}
	nav #menu_area .inner .sub_menu a:hover{color:#009fa1;}
	
	footer{background: linear-gradient(45deg, #20294b 30%, #2d2e5a 100%);}
	
	footer .link_banner{width: 100%;margin: 0 auto;background: #eef2f2;padding:30px 0% 20px 0;text-align: center;border-top: 1px solid #DCDCDC;}
	footer .link_banner a{display:block;width: 80%; background:white;padding:16px 3% 14px 3%;margin: 0 auto 10px auto;border: 1px solid #DCDCDC;color: #2b4759}
	footer .link_banner a img{display: block;width:30%;margin: 0 auto 10px auto}
	footer .link_banner a span{display: block; font-size: 11px}
	footer .link_banner a:hover{opacity:0.5;}
	
	footer #site_map_area{width:80%;margin:0px auto 30px auto;padding:30px 0 20px 0;border-bottom: 1px solid #484e54;}
	footer #site_map_area .unit a{font-size: 13px;color: white;padding:6px 0px 6px 0;text-decoration: none;display: block;letter-spacing: 1px;font-weight:400}
	footer #site_map_area .unit a:hover{color:#4590d2}
	
	footer #laboratory_area{width:80%;margin:0px auto 0 auto; padding:0px 0 0px 0;}		
	footer #laboratory_area .title{margin:0px auto 10px auto;}
	footer #laboratory_area .title a{display: block;margin: 0 auto; padding:0px 0;font-size: 15px;letter-spacing:0px;color: white;text-decoration: none;font-weight: 300;}
	footer #laboratory_area .title a span{display: block;font-size: 10px;margin: 0 auto 5px 0}	
	footer #laboratory_area .title a:hover{color:#4590d2}	
	footer #laboratory_area .member_login a{display: block;padding:8px 16px;color: white;letter-spacing: 1px;text-decoration: none;text-align: center;background: linear-gradient(45deg, #009fa1 0%, #0099b2 100%);border-radius: 3px;}
	footer #laboratory_area .member_login a .sub{font-size: 11px;display: block;}
	footer #laboratory_area .member_login a .main{font-size: 16px;}
	footer #laboratory_area .member_login a:hover{background:#4590d2;}
	
	footer small{width:90%;display: block;border-top: 1px solid #484e54;font-size: 10px;color:white;letter-spacing: 0px;padding: 30px 0 30px 0;margin: 30px auto 0 auto;text-align: center}
}