@charset "utf-8";
/* ==================================================
		
		header/footer/pagetop PC/SP共通

================================================== */
@font-face {
  font-family: "icons";
  src: url("../fonts/icons.eot");
  src: url("../fonts/icons.eot") format("eot"), url("../fonts/icons.woff") format("woff"), url("../fonts/icons.ttf") format("truetype");
}


/* ==================================================
		
		header/footer/pagetop PC

================================================== */
@media screen and (min-width:750px) {

/* --------------------------------------------------
		Header
-------------------------------------------------- */
#header {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 z-index: 10;
 transition: all .3s ease 0s;
}
#header .headerInner {
 position: relative;
 z-index: 100;
 height: 80px;
}
#header .headerInner .logo-s {
 position: absolute;
 top: 0;
 bottom: 0;
 right: 0;
 left: 0;
 margin: auto;
 width: 37px;
 height: 45px;
}
#header .headerInner .logo-s a {
 display: block;
}
#header .headerInner .logo-s a img {
 height: 44px;
}
#header .logoShimadzu {
 display: block;
 position: absolute;
 top: 22px;
 left: 30px;
 z-index: 96;
 transition: 0.2s;
}
#header .logoShimadzu a svg {
 fill: #fff;
 width: 172px;
 height: 37px;
}
#header.change {
 background: #fff;
}
#header .logo-s a .white, 
#header.change .logo-s a .black, 
.open #header .headerInner .logo-s a .black {
 display: block;
}
#header.change .logo-s a .white, 
#header .logo-s a .black, 
.open #header .headerInner .logo-s a .white {
 display: none;
}
body.open #header .logoShimadzu a svg,
#header.change .logoShimadzu a svg {
 fill: #000;
}
  
/*	.drawer
-------------------------------------------------- */ 
.drawer {
 position: absolute;
 z-index: 102;
 right: 20px;
 top: 20px;
 height: 40px;
 display: flex;
 align-items: center;
}
.drawer .link-mail {
 margin-right: 20px;
}
.drawer .link-mail a {
 color: #ffffff;
 display: block;
 font-size: 12px;
 text-decoration: none;
 padding-left: 25px;
 background-image: url(../img/icon_mail_white.png);
 background-size: 18px auto;
 background-position: left center;
 background-repeat: no-repeat;
}
.change .drawer .link-mail a {
 color: #000000;
 background-image: url(../img/icon_mail_black.png);
}
 
/*OPEN*/
.open .drawer .link-mail a {
 color: #000000;
 background-image: url(../img/icon_mail_black.png);
}
  
/*	#navbar_toggle
-------------------------------------------------- */ 
#navbar_toggle {
 z-index: 9999;
 cursor: pointer;
 padding: 10px;
}
.navbar_toggle_icon {
 position: relative;
 display: block;
 height: 2px;
 width: 30px;
 background: #ffffff;
 -webkit-transition: ease .3s;
 transition: ease .3s;
}
.navbar_toggle_icon:nth-child(1) {
 top: 0;
}
.navbar_toggle_icon:nth-child(2) {
 margin: 8px 0;
}
.navbar_toggle_icon:nth-child(3) {
 top: 0;
 width: 20px;
}
.change .navbar_toggle_icon {
 background: #000000;
}

/*OPEN*/
.open .navbar_toggle_icon {
 background: #000000;
}
.open .navbar_toggle_icon:nth-child(1) {
 top: 9px;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}
.open .navbar_toggle_icon:nth-child(2) {
 -webkit-transform: translateY(-45%);
 transform: translateY(-45%);
 opacity: 0;
}
.open .navbar_toggle_icon:nth-child(3) {
 top: -11px;
 width: 30px;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}

/*	menu
-------------------------------------------------- */ 
.overlay {
 position: fixed;
 left: 0;
 top: 0;
 width: 100%;
 height: 100%;
 z-index: 6;
 background: #000;
 opacity: 0;
 visibility: hidden;
 transition: all .2s;
 cursor: pointer;
}
.menu {
 font-weight: bold;
 width: 400px;
 position: absolute;
 -webkit-transition: ease .3s;
 transition: ease .3s;
 right:-100%;
 z-index: 0;
 background: #fff;
 overflow-y:auto;
} 
.menu ul {
 padding-bottom: 10px;
}
.menu ul li a {
 display: block;
 text-decoration: none;
}
.menu > ul > li {
 margin: 0 40px;
}
.menu > ul > li:not(:last-child) {
 border-bottom: 1px solid #eaeaea;
}
.menu > ul > li > a, 
.menu > ul > li > p {
 padding: 20px 0;
 font-size: 18px;
}

.menu > ul > li > a.lang-button {
 background-color: #464646;
 color: #fff;
 display: inline-block;
 border-radius: 9px;
 padding: 5px 10px;
 transition: 0.5s;
 margin: 20px 0;
}

.menu > ul > li > a.lang-button:hover {
 opacity: 0.7;
}

/*OPEN*/
.open #header {
 background: #fff;
}
.open .overlay {
 opacity: .6;
 visibility: visible;
}
.open .menu {
 right:0;
 overflow-y: auto;
 -webkit-overflow-scrolling: touch;
} 
 
/* --------------------------------------------------
		footer
-------------------------------------------------- */
footer {
 border-top: 5px solid #adadad;
 padding: 12px 0;
 position: relative;
 background-color: #ebebeb;
 line-height: 0;
}
footer:before {
 background-color: #ff0000;
 content: "";
 display: inline-block;
 height: 5px;
 left: 0;
 position: absolute;
 top: -5px;
 width: 30px;
} 
footer .footer-inner {
 width: 1040px;
 margin: 0 auto;
 display: -webkit-flex;
 display: -moz-flex;
 display: -ms-flex;
 display: -o-flex;
 display: flex;
 justify-content: space-between;
}
footer .footer-inner .footer-link {
 font-size: 13px;
 line-height: 1;
}
footer .footer-inner .footer-link .footer-link-list li {
 display: inline-block;
}
footer .footer-inner .footer-link .footer-link-list li a {
 border-right: 1px solid #080808;
 color: #004ecc;
 display: inline-block;
 line-height: 1;
 padding: 0 15px;
 font-size: 13px;
}
footer .footer-inner .footer-link .footer-link-list li:first-of-type a {
 border-left: 1px solid #080808;
}
footer .footer-inner .footer-link .footer-link-list li:nth-of-type(2) a {
 padding: 0 15px 0 16px;
}
footer .footer-inner .footer-link .footer-link-list li:last-of-type a {
 padding-left: 16px;
}
footer .footer-inner .footer-link .footer-link-list li a:hover {
 text-decoration: underline;
}
footer .footer-inner .footer-copyright {
 position: relative;
 top: -1px;
}
footer .footer-inner .footer-copyright img {
 width: 383px;
}

/* --------------------------------------------------
		#pagetop
-------------------------------------------------- */
#pagetop {
 position: fixed;
 right: 25px;
 bottom: 90px;
 transition: 0.5s;
 opacity: 0;
 visibility: hidden;
 z-index: 6;
}
#pagetop.active {
 opacity: 1;
 visibility: visible;
} 
#pagetop .gotop a:link, 
#pagetop .gotop a:visited {
 text-decoration: none;
} 
#pagetop .gotop a:hover {
 transition: opacity 0.5s;
 opacity: 0.7;
} 
#pagetop .gotop a img {
 width: 55px;
} 
.footer-pageTop {
 display: none;
} 
 
}


/* ==================================================
		
		header/footer/pagetop SP

================================================== */
@media screen and (max-width:749px) {

/* --------------------------------------------------
		Header
-------------------------------------------------- */
#header {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 60px;
 z-index: 10;
 transition: all .3s ease 0s;
}
#header.change {
 background: #fff;
}
#header .logo-s a .white, 
#header.change .logo-s a .black, 
.open #header .headerInner .logo-s a .black {
 display: block;
}
#header.change .logo-s a .white, 
#header .logo-s a .black, 
.open #header .headerInner .logo-s a .white {
 display: none;
}
#header .headerInner {
 position: relative;
 z-index: 100;
 height: 60px;
}
#header .headerInner .logo-s {
 position: absolute;
 top: 0;
 bottom: 0;
 right: 0;
 left: 0;
 margin: auto;
 width: 29px;
 height: 39px;
}
#header .headerInner .logo-s a {
 display: block;
}
#header .headerInner .logo-s a img {
 width: 24px;
}
#header .logoShimadzu {
 display: block;
 position: absolute;
 top: 14px;
 left: 9px;
 z-index: 96;
}
#header .logoShimadzu a svg {
 fill: #fff;
 width: 140px;
 height: 30px;
} 
body.open #header .logoShimadzu a svg,
#header.change .logoShimadzu a svg {
 fill: #000;
}
  
/*	.drawer
-------------------------------------------------- */ 
.drawer {
 position: absolute;
 z-index: 102;
 right: 5px;
 top: 10px;
 height: 40px;
 display: flex;
 align-items: center;
}
.drawer .link-mail {
 margin-right: 15px;
}
.drawer .link-mail a {
 font-size: 12px;
 color: #ffffff;
 text-decoration: none;
 width: 30px;
 text-indent: 100%;
 white-space: nowrap;
 overflow: hidden;
 padding-left: 30px;
 background-image: url(../img/icon_mail_white.png);
 background-repeat: no-repeat;
 background-size: 18px auto;
 background-position: center center;
 display: block;
}
.change .drawer .link-mail a {
 color: #000000;
 background-image: url(../img/icon_mail_black.png);
}
 
/*OPEN*/
.open .drawer .link-mail a {
 color: #000000;
 background-image: url(../img/icon_mail_black.png);
}

/*	#navbar_toggle
-------------------------------------------------- */ 
#navbar_toggle {
 z-index: 9999;
 cursor: pointer;
 padding: 10px;
}
.navbar_toggle_icon {
 position: relative;
 display: block;
 height: 2px;
 width: 30px;
 background: #ffffff;
 -webkit-transition: ease .3s;
 transition: ease .3s;
}
.navbar_toggle_icon:nth-child(1) {
 top: 0;
}
.navbar_toggle_icon:nth-child(2) {
 margin: 8px 0;
}
.navbar_toggle_icon:nth-child(3) {
 top: 0;
 width: 20px;
}
.change .navbar_toggle_icon {
 background: #000000;
}

/*OPEN*/
.open .navbar_toggle_icon {
 background: #000000;
}
.open .navbar_toggle_icon:nth-child(1) {
 top: 9px;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}
.open .navbar_toggle_icon:nth-child(2) {
 -webkit-transform: translateY(-45%);
 transform: translateY(-45%);
 opacity: 0;
}
.open .navbar_toggle_icon:nth-child(3) {
 top: -11px;
 width: 30px;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}

/*	menu
-------------------------------------------------- */ 
.overlay {
 position: fixed;
 left: 0;
 top: 0;
 width: 100%;
 height: 100%;
 z-index: 6;
 background: #000;
 opacity: 0;
 visibility: hidden;
 transition: all .2s;
 cursor: pointer;
}
.menu {
 font-weight: bold;
 width: 100%;
 position: absolute;
 -webkit-transition: ease .3s;
 transition: ease .3s;
 right: -100%;
 z-index: 110;
 background: #fff;
 overflow-y: auto;
}
.menu ul {
 padding-bottom: 10px;
}
.menu ul li a {
 display: block;
 text-decoration: none;
}
.menu > ul > li {
 margin: 0 40px;
}
.menu > ul > li:not(:last-child) {
 border-bottom: 1px solid #eaeaea;
}
.menu > ul > li > a, 
.menu > ul > li > p {
 padding: 20px 0;
 font-size: 16px;
}

.menu > ul > li > a.lang-button {
	background-color: #464646;
	color: #fff;
	display: inline-block;
	border-radius: 5px;
	padding: 5px 10px;
	transition: 0.5s;
	margin: 20px 0;
}
 
/*OPEN*/
.open #header {
 background: #fff;
}
.open .overlay {
 opacity: .6;
 visibility: visible;
}
.open .menu {
 height: calc(100vh - 60px);
 right:0;
 overflow-y: auto;
 -webkit-overflow-scrolling: touch;
} 
 
/* --------------------------------------------------
		footer
-------------------------------------------------- */
footer {
 border-top: 5px solid #adadad;
 padding-bottom: 22px;
 position: relative;
}
footer:before {
 background-color: #ff0000;
 content: "";
 display: inline-block;
 height: 5px;
 left: 0;
 position: absolute;
 top: -5px;
 width: 30px;
} 
footer .footer-inner .footer-link .footer-link-list li {
 background-color: #d8d8d8;
 border-bottom: 1px solid #adadad;
}
footer .footer-inner .footer-link .footer-link-list li a {
 color: inherit;
 display: block;
 padding: 24px 20px;
 position: relative;
 text-align: center;
 text-decoration: none;
 font-size: 12px;
 height: 68px;
}
footer .footer-inner .footer-link .footer-link-list li a:before {
 border: 0;
 content: "";
 display: inline-block;
 height: 8px;
 position: absolute;
 right: 20px;
 top: 45%;
 width: 8px;
 border-right: solid 1px #dd0000;
 border-top: solid 1px #dd0000;
 transform: rotate(45deg);
}
footer .footer-inner .footer-copyright {
 text-align: center;
 margin: 3px 0 25px;
}
footer .footer-inner .footer-copyright img {
 width: 280px;
}

/* --------------------------------------------------
		#pagetop
-------------------------------------------------- */
.footer-pageTop {
 text-align: center;
}
.footer-pageTop a {
 display: block;
}
.footer-pageTop a:before {
 border: 0;
 content: "";
 display: inline-block;
 height: 22px;
 position: relative;
 top: 4px;
 width: 22px;
 border-right: solid 1px #111111;
 border-top: solid 1px #111111;
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
}
#pagetop {
 display: none;
} 
 
}