#wrapper {
	position: relative;
	width: 100%;
	min-width: 320px;
	overflow: hidden;
	background-color: #fff;

}
/*---------------------------------------------
	Header
  ---------------------------------------------*/

@media screen and (min-width: 769px/*680*/) {

	header {display: block !important; }

	#header-bar {
		position: fixed;
		z-index: 6;
		width: 100%;
		height: 40px;
		top: 0;
		left: 0;
		text-align: right;
		background-color: #4570ba;
	}

	#target-menu {
		display: inline-block;
		vertical-align: top;
	}

	#target-menu li {float: left;}

	#target-menu li a {
		display: block;
		padding: 0 15px;
		line-height: 40px;
		font-size: 83%;
		color: #fff;
		text-decoration: none;
		border-left: solid 1px #1a53b5;
		-moz-transition: background-color .2s linear, color .2s linear;
		-webkit-transition: background-color .2s linear, color .2s linear;
		-o-transition: background-color .2s linear, color .2s linear;
		-ms-transition: background-color .2s linear, color .2s linear;
		transition: background-color .2s linear, color .2s linear;
	}
	html:not(.sp) #target-menu li a:hover {
		color: #fff;
		background-color: #1a53b5;
	}

	#sns-menu {
		float: right;
		overflow: hidden;
	}

	#sns-menu li {float: right;}

	#sns-menu li a {
		position: relative;
		display: block;
		height: 40px;
		color: #3B5998;
		font-size: 1.5rem;
		text-align: center;
		text-decoration: none;
		padding: 0 15px;
		line-height: 40px;
		background-color: #fff;
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	#utility-menu {
		float: right;
		overflow: hidden;
	}

	#utility-menu li {float: left;}

	#utility-menu li a {
		position: relative;
		display: block;
		height: 40px;
		color: #fff;
		font-size: 83%;
		text-align: center;
		text-decoration: none;
		padding: 0 30px;
		line-height: 40px;
		background-color: #5bd0d2;
		/*border-left: solid 1px #007b36;*/
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	#utility-menu li:first-of-type a {border-left: 0 none;}
	#utility-menu .utility-menu-icon a {
		width: 40px;
		text-indent: -9999px;
		overflow: hidden;
	}
	#utility-menu .utility-menu-icon-text a,
	#utility-menu .utility-menu-lang a {padding: 0 15px 0 35px;}
	html:not(.sp) #utility-menu li a:hover,
	#utility-menu li.current a {background-color: #81e7e9;}

	#header-nav {
		position: fixed;
		z-index: 8;
		width: 70%;
		max-width: 1300px;
		height: 95px;
		top: 40px;
		left: 306;
		right: 0;
		background-color: #fff;
	}
	
}

#utility-menu .utility-menu-icon a:after,
#utility-menu .utility-menu-icon-text a:after,
#utility-menu .utility-menu-lang a:after {
	content: "";
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	top: 50%;
	left: 8px;
	margin: -12px 0 0 0;
	background-repeat: no-repeat;
	-moz-background-size: 240px 120px;
	-webkit-background-size: 240px 120px;
	-o-background-size: 240px 120px;
	-ms-background-size: 240px 120px;
	background-size: 240px 120px;

	-moz-transition: opacity .2s linear;
	-webkit-transition: opacity .2s linear;
	-o-transition: opacity .2s linear;
	-ms-transition: opacity .2s linear;
	transition: opacity .2s linear;

	opacity: .6;
}

#utility-menu-search a:after {background-position: -168px -48px;}
#utility-menu-access a:after {background-position: 0 -24px;}
#utility-menu-contact a:after {background-position: -24px -24px;}
.utility-menu-lang a:after {background-position: -120px 0;}

html:not(.sp) #utility-menu .utility-menu-icon a:hover:after,
#utility-menu .utility-menu-icon.current a:after,
html:not(.sp) #utility-menu .utility-menu-icon-text a:hover:after,
html:not(.sp) #utility-menu .utility-menu-lang a:hover:after {opacity: 1;}

#logo {
	position: fixed;
	z-index: 2;
	display: table;
	width: 100%;
	height: 107px;
	top: 40px;
	left: 0;
	background-color: #fff;
    -webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
    box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
}



#logo img {
	display: block;
	/*width: 304px;
	height: 56px;*/
	margin-top: 15px;
}

	@media screen and (max-width: 1215px) and (min-width: /*901*/870px){
	#logo img {
		display: block;
		width: 250px;
		height: auto;
		margin-top: 20px;}
	}

	@media screen and (max-width: 869px) and (min-width: 795px){
	#logo img {
		display: block;
		width: 220px;
		height: 41px;
		margin-top: 20px;
		-webkit-box-shadow: none;
        box-shadow: none;}
	}

	@media screen and (max-width: 794px) and (min-width: 769px){
	#logo img {
		display: block;
		width: 210px;
		height: 39px;
		margin-top: 20px;
		-webkit-box-shadow: none;
        box-shadow: none;}
	}


#logo a {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
#utility-menu li.current a:before {
	content: "";
	position: absolute;
	display: block;
	left: 50%;
	bottom: 0;
	margin: 0 0 0 -7px;
	border-bottom: solid 7px #444;
	border-left: solid 7px transparent;
	border-right: solid 7px transparent;
}



/*---------------------------------------------
	Global Navigation
  ---------------------------------------------*/

@media screen and (min-width: 769px) {

	#gnav {
		list-style-type: none;
  		width: 95%;
		margin: 0 auto;
}

	}
	#gnav:hover {z-index: /*6*/1;}

	#gnav ul {
		  background: /*#102CAF; #0099cc;*/ #fff;
	}

	#gnav ul li {
		position: relative;
		width: 16.666666%;
		float: left;
		margin: 0;
		padding: 0;
		text-align: center;
	}

	#gnav ul li a {
		  display: block;
		  margin: 0;
		  padding: 16px 0;
		  background: /*#102CAF; #0099cc;*/ #fff;
		  color: /*#5bd0d2;*/ #000;
		  line-height: 1.5;
		  text-decoration: none;
		  border-left:1px solid /*#5b70d1; #3273dc;*/ #ccc;
		  font-weight: 600;
		  font-size: 88%;

	}
@media screen and (max-width: 768px) {
	#gnav ul li {
		position: relative;
		width: 100%;
		margin: 0;
		padding: 0;
		text-align: left;
		}
}

@media screen and (max-width: 1000px) and (min-width: 880px){
	#gnav ul li a {
		  font-weight: 600;
		  font-size: 80%;}

	}
@media screen and (max-width: 879px) and (min-width: 769px){
	#gnav ul li a {
		  font-weight: 500;
		  font-size: 70%;}

	}

@media screen and (max-width: 900px) and (min-width: 769px){ 
	#Logo img {display: block; margin-top:20px; width: 220px; height: 41px;}
	}

#gnav ul li a.cline::after {
		  position: absolute;
		  bottom: 0px;
		  left: 0;
		  content: '';
		  width: 100%;
		  height: 3px;
		  background: #5bd0d2;
		  transform: scale(0, 1);
		  transform-origin: center top;
		  transition: transform .3s;
}
	#gnav ul li a:hover::after {
  	transform: scale(1, 1);
}

/* */
#gnav li a:hover {
    background: /*#5b70d1; #58B0CD;*/ /*★#fff;*/
    color: #000;
	}
#gnav li ul li a:hover {
    /*background: #fff;*/
    color: #fff;
	}

#gnav li ul {
	  list-style: none;
	  position: absolute;
	  z-index: 100;
	  top: 100%;
	  left: 0;
	  width: /*100%*/ 240px;
	  margin: 0;
	  padding: 0;
	  opacity:0.9;
   	  /*height: auto;
      max-height: 600px;
      overflow-y: scroll;*/
 }

	#gnav li ul li {
	  overflow: hidden;
	  width: 240px;
	  height: 0;
	  color: #fff;
	  transition: .2s;
	 /*opacity:0.5;*/
	}

	/* add */
	/*#gnav li ul li:before {
		font-family: FontAwesome;
		content: '\f054';
	}*/

	#gnav li ul li a {
	  padding: 13px 15px;
	  background: /*#5b70d1; #58B0CD;*/ #102CAF;
	  text-align: left;
	  font-weight: normal;
	  border: none;
	  color: #fff;
	 /*opacity:0.5;*/
	}
	
	/*---------------------*/
	#gnav li ul li ul li {
	  overflow: hidden;
	  width: 240px;
	  height: 0;
	  color: #fff;
	  transition: .2s;
	 /*opacity:0.5;*/
	}

	#gnav li ul li ul li span a {
	  padding: 13px 15px;
	  background: /*#5b70d1; #58B0CD;*/ #102CAF;
	  text-align: left;
	  font-weight: normal;
	  border: none;
	  color: #fff;
	 /*opacity:0.5;*/
	}
	/*---------------------*/
	
	#gnav li ul li.sub a {
	  padding: 13px 15px 13px 25px;
	  background: #58B0CD;
	  text-align: left;
	  font-weight: normal;
	  border: none;
	  color: #fff;
	 /*opacity:0.5;*/
	}

	#gnav li ul li.sub a:hover {
		background: #499EB9;
		color: #fff;
		
	}
	
	#gnav > li:hover > a {  background:  /*#102CAF;*/ #0099cc; }
	#megnavnu > li:hover li:hover > a {  background:  /*#102CAF;*/ #0099cc; }
	#gnav li:hover > ul > li {
	  overflow: visible;
	  height: /*42px★*/ auto;
	}


	#gnav li:first-child a{
		/*border-radius:8px 0 0 8px;*/
		border-left:0;

	}

	/*#gnav > ul > li:last-child > span > a {border-bottom: 0 none;}
	
	html:not(.sp) #gnav > ul > li:hover > span > a,
	#gnav > ul > li.parent > span > a {background-color: rgba(255, 255, 255, .1);}
	#gnav > ul > li.parent:not(:last-child) > span > a {border-bottom: solid 1px rgba(255, 255, 255, .0);}
	html:not(.sp) #gnav > ul > li:last-child:hover > span > a {border-bottom: 0 none;}

	html:not(.sp) #gnav > ul > li > span > a:hover,
	#gnav > ul > li.current > span > a {background-color: #9fd25b !important;}

	#gnav > ul > li > ul {
		position: fixed;
		display: block !important;
		width: 0;
		height: 540px;
		top: 70px;
		margin: 0 0 0 180px;
		overflow: hidden;
		background-color: rgba(24, 24, 24, .7);
		-moz-transition: width .2s ease-out, height .2s ease-out;
		-webkit-transition: width .2s ease-out, height .2s ease-out;
		-o-transition: width .2s ease-out, height .2s ease-out;
		-ms-transition: width .2s ease-out, height .2s ease-out;
		transition: width .2s ease-out, height .2s ease-out;
	}
	#gnav > ul > li > ul {height: 580px;}
	#gnav > ul > li:hover > ul {
		width: 180px;
		height: 88%;
	}
	#gnav > ul > li > ul:hover {overflow: visible;}

	#gnav > ul > li > ul > li {
		clear: both;
		float: right;
	}
*/
	#gnav > ul > li > ul > li > span > a {
		position: relative;
		display: block;
		/*width: 180px;*/
		padding: *15px★*/4px 20px;
		line-height: /*140%★*/ 100%;
		color: #fff;
		font-size: 90%;
		text-decoration: none;
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	html:not(.sp) #gnav > ul > li > ul > li:hover > span > a,
	#gnav > ul > li > ul > li.parent > span > a {background-color: rgba(255, 255, 255, .1);}
	html:not(.sp) #gnav > ul > li > ul > li > span > a:hover,
	#gnav > ul > li > ul > li.current > span > a {background-color: /*#9fd25b*/ #091F83 !important;}
	html:not(.sp) #gnav > ul > li > ul > li.sub > span > a:hover,
	#gnav > ul > li > ul > li.current > span > a {background-color: /*#9fd25b*/ #0099cc !important;}
	
	#gnav > ul > li > ul > li > ul  {
		position: /*fixed*/ relative;
		display: block !important;
		width: 240px;
		/*height: 540px;*/
		top: 0px;
		left:240px;
		margin: 0 0 0 180px;
		overflow: hidden;
		/*background-color: rgba(47, 47, 47, .7);
		-moz-transition: width .2s ease-out, height .2s ease-out;
		-webkit-transition: width .2s ease-out, height .2s ease-out;
		-o-transition: width .2s ease-out, height .2s ease-out;
		-ms-transition: width .2s ease-out, height .2s ease-out;
		transition: width .2s ease-out, height .2s ease-out;*/
	}


	#gnav > ul > li > ul:hover > li > ul  {height: 88%;}
	#gnav > ul > li > ul > li:hover > ul  {width: 180px;}

	#gnav > ul > li > ul > li > ul > li {
		clear: both;
		float: right;
	}

	/*#gnav > ul > li > ul > li > ul > li > span > a {
		position: relative;
		display: block;
		width: 180px;
		padding: 15px 20px;
		line-height: 140%;
		color: #fff;
		font-size: 83%;
		text-decoration: none;
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	html:not(.sp) #gnav > ul > li > ul > li > ul > li > span > a:hover,
	#gnav > ul > li > ul > li > ul > li.current > span > a {background-color: #9fd25b;}*/

/*}*/

/*#gnav > ul > li.gnav-icon > span > a:after {
	content: "";
	position: absolute;
	display: block;
	width: 24px;
	height: 24px;
	top: 50%;
	left: 15px;
	margin: -12px 0 0;
	background-image: url(../images/icon.png);
	background-repeat: no-repeat;
	-moz-background-size: 240px 120px;
	-webkit-background-size: 240px 120px;
	-o-background-size: 240px 120px;
	-ms-background-size: 240px 120px;
	background-size: 240px 120px;

	-moz-transition: opacity .2s linear;
	-webkit-transition: opacity .2s linear;
	-o-transition: opacity .2s linear;
	-ms-transition: opacity .2s linear;
	transition: opacity .2s linear;

	opacity: .6;
}
*/

html:not(.sp) #gnav > ul > li > span > a:hover:after,
#gnav > ul > li.current > span > a:after,
#gnav > ul > li.parent > span > a:after {opacity: 1;}

#sp-gnav-btn,
.sp-gnav-layer-btn {display: none;}

@media screen and (min-width: 769px) {
	#gnav {margin-top: 1.25rem;}
	.Logo{text-align:center;}
}


/*---------------------------------------------
	For - 768(XX999)px 
  ---------------------------------------------*/

@media screen and (max-width: 768px), /*print*/ {

	body {background-color: #fff;}

	#wrapper {
		-moz-transition: -moz-transform .3s ease-in-out;
		-webkit-transition: -webkit-transform .3s ease-in-out;
		-o-transition: -o-transform .3s ease-in-out;
		-ms-transition: -ms-transform .3s ease-in-out;
		transition: transform .3s ease-in-out;
	}
	.sp-gnav-open #wrapper {
		left: -255px\9;
		-moz-transform: translate3d(-255px, 0, 0);
		-webkit-transform: translate3d(-255px, 0, 0);
		-o-transform: translate3d(-255px, 0, 0);
		-ms-transform: translate3d(-255px, 0, 0);
		transform: translate3d(-255px, 0, 0);
	}

	/*#header-nav {
		position: fixed;
		z-index: 8;
		width: 70%;
		height: 95px;
		top: 40px;
		left: 306;
		right: 0.5rem;
		background-color: #fff;
		display: none;
	}*/

	.copy {font-size: 140%;}

	#spfixed {
	position: fixed;
	background-color: #fff;
	height: 70px;
	width: 100%;
	z-index: 1;
	border-bottom: solid 1px #ededed;
	}

	#logo {
		position: fixed;
		width: 150px;
		/*height: 150px;*/
		top: 30px;
		left: 30px;
		padding: 0.3rem 0 0.3rem 0.5rem;
		z-index: 2;
		-webkit-box-shadow: none;
        box-shadow: none;
	}

	header {
		position: /*absolute*/ fixed;
		z-index: 0;
		display: none;
		width: 255px;
		top: 0;
		right: 0;
		overflow: hidden;
		-moz-transition: width .3s ease-in-out;
		-webkit-transition: width .3s ease-in-out;
		-o-transition: width .3s ease-in-out;
		-ms-transition: width .3s ease-in-out;
		transition: width .3s ease-in-out;
 		height: 100%;
 		overflow: auto;
 		-webkit-overflow-scrolling: touch;
	}

	#target-menu {/*display: none;*/padding: 15px; margin-top: 420px;}

	#target-menu a {
		/*position: relative;*/
		display: block;
		padding: 12px 15px;
		color: #000;
		font-size: 90%;
		text-decoration: none;
		border-bottom: solid 1px #fff;
		background-color: #5BD0D1;
		z-index: 0;
		-moz-transition: background-color .2s linear, color .2s linear;
		-webkit-transition: background-color .2s linear, color .2s linear;
		-o-transition: background-color .2s linear, color .2s linear;
		-ms-transition: background-color .2s linear, color .2s linear;
		transition: background-color .2s linear, color .2s linear;
	}
	html:not(.sp) #target-menu a:hover {
		color: #fff;
		background-color: #444;
	}

	#utility-menu {display: none;}

	
	/*#utility-menu li {
		position: relative;
		display: table;
		width: 100%;
	}

	#utility-menu a {
		position: relative;
		display: block;
		padding: 12px 15px;
		color: #fff;
		font-size: 90%;
		text-decoration: none;
		border-bottom: solid 1px #007b36;
		background-color: #094;
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	#utility-menu li:last-of-type a {border-bottom: 0 none;}
	html:not(.sp) #utility-menu a:hover {background-color: #9fd25b #fff;}

	#utility-menu .utility-menu-icon-text a:after,
	#utility-menu .utility-menu-lang a:after {left: 15px;}

	#utility-menu .utility-menu-icon a:after {
		left: 50%;
		margin: -12px 0 0 -12px;
	}*/

	#sns-menu {display: none;}
	
	#corporate-menu {
		display: none;
		padding: 0 15px;
	}

	#corporate-menu ul {
		display: block;
		margin: 0;
	}

	#corporate-menu .col-half {
		display: block\9;
		width: auto;
		margin-right: 0;
	}

	#corporate-menu a {
		position: relative;
		display: block;
		padding: 12px 15px 12px 30px;
		color: #fff;
		font-size: 90%;
		text-decoration: none;
		border-top: solid 1px #007b36;
		background-color: #1aa256;
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	html:not(.sp) #corporate-menu a:hover {background-color: #9fd25b;}
	#corporate-menu a:before {
		display: none;
/*
		top: 50%;
		left: 15px;
		margin-top: -10px;
		background-position: -4px -51px;
		border-color: #fff;
*/
	}

	#sp-corporate-layer-btn {
		position: absolute;
		display: block;
		width: 40px;
		height: 100%;
		top: 0;
		right: 0;
		border-left: solid 1px #007b35;
		cursor: pointer;
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	#sp-corporate-layer-btn:before {
		content: "";
		position: absolute;
		display: block;
		width: 16px;
		height: 2px;
		top: 50%;
		right: 12px;
		margin: -1px 0 0;
		background-color: #fff;
	}
	#sp-corporate-layer-btn:after {
		content: "";
		position: absolute;
		display: block;
		width: 2px;
		height: 16px;
		top: 50%;
		right: 19px;
		margin: -8px 0 0;
		background-color: #fff;
		-moz-transition: -moz-transform .2s linear;
		-webkit-transition: -webkit-transform .2s linear;
		-o-transition: -o-transform .2s linear;
		-ms-transition: -ms-transform .2s linear;
		transition: transform .2s linear;
	}
/*	html:not(.sp) #sp-corporate-layer-btn:hover,*/
	#utility-menu-corporate.current #sp-corporate-layer-btn {background-color: #1aa256;}
	html:not(.sp) #utility-menu-corporate.current a:hover #sp-corporate-layer-btn {background-color: #9fd25b;}
	#utility-menu-corporate.current #sp-corporate-layer-btn:after {
		-moz-transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
	}

	#utility-menu #utility-menu-corporate.current a:before {display: none;}

	#gnav a {
		color: #4570ba;
		text-decoration: none;
		line-height: 140%;
		-moz-transition: background-color .2s linear, color .2s linear;
		-webkit-transition: background-color .2s linear, color .2s linear;
		-o-transition: background-color .2s linear, color .2s linear;
		-ms-transition: background-color .2s linear, color .2s linear;
		transition: background-color .2s linear, color .2s linear;
	}
	html:not(.sp) #gnav a:hover,
	#gnav .current > span > a {background-color: #1a53b5 /*#fff;*/}
	#gnav .parent > span > a {background-color: rgba(159, 210, 91, .3);}

	#gnav ul li a {
		  color: /*#5bd0d2;*/ #000;
		  text-decoration: none;
		  font-weight: 600;
		  font-size: 90%;
	}
	#gnav ul li  a.cline::after {
		  position: absolute;
		  bottom: 0px;
		  left: 0;
		  content: '';
		  width: 100%;
		  height: 0px;
		  background: #000;
		  transform:none;
}
	#gnav li > span {
		position: relative;
		display: table;
		width: 100%;
	}

	#gnav li ul li a:hover {
	  background: #091F83;*/ #0099cc;*/
	  color: #fff;
	  }
	  
	#gnav > ul > li > span > a {
		display: table-cell;
		height: 70px;
		padding: 0 15px;
		font-size: 90%;
		border-bottom: solid 1px #1a53b5;
		overflow: hidden;
		vertical-align: middle;
	}
	#gnav > ul > li/*.gnav-icon*/ > span > a {padding: 0 15px 0 30px;}

	#gnav > ul  ul {
		display: none;
		overflow: hidden;
	}

	#gnav > ul > li > ul > li > span > a {
		display: table-cell;
		/*padding: 15px 15px 15px 30px;*/
		padding: 13px 15px 13px 25px;
		font-size: 90%;
		background-color: #1a53b5;
		border-bottom: solid 1px #444;
		overflow: hidden;
	}

	#gnav > ul > li > ul > li > ul > li > span > a {
		display: table-cell;
		padding: 15px 15px 15px 45px;
		font-size: 90%;
		background-color: #444;
		border-bottom: solid 1px #555;
		overflow: hidden;
	}

	#sp-gnav-btn {
		position: /*absolute*/ fixed;
		z-index: 11;
		display: block;
		top: 30px;
		right: 25px;
		cursor: pointer;
	}
	
	#sp-lang-btn {
		position: /*absolute*/ fixed;
		z-index: 10;
		display: block;
		top: 15px;
		right: 65px;
		cursor: pointer;
	}

	
	#sp-fb-btn {
		position: /*absolute*/ fixed;
		z-index: 11;
		display: block;
		top: 15px;
		right: 60px;
		cursor: pointer;
	}
	
	#sp-gnav-btn:before,
	#sp-gnav-btn:after {
		content: "";
		position: absolute;
		z-index: 1;
		display: block;
		width: 28px;
		height: 3px;
		right: 11px;
		background-color: #4570ba;

		-moz-transition: -moz-transform 0.3s ease-in-out, top 0.3s linear, bottom 0.3s linear, right 0.3s linear, width 0.3s linear;
		-webkit-transition: -webkit-transform 0.3s ease-in-out, top 0.3s linear, bottom 0.3s linear, right 0.3s linear, width 0.3s linear;
		-o-transition: -o-transform 0.3s ease-in-out, top 0.3s linear, bottom 0.3s linear, right 0.3s linear, width 0.3s linear;
		-ms-transition: -ms-transform 0.3s ease-in-out, top 0.3s linear, bottom 0.3s linear, width 0.3s linear;
		transition: transform 0.3s ease-in-out, top 0.3s linear, bottom 0.3s linear, right 0.3s linear, width 0.3s linear;
	}
	#sp-gnav-btn:before {top: 5px;}
	#sp-gnav-btn:after {top: 25px;}
	html:not(.sp) #sp-gnav-btn:hover:before {width: 23px;}

	#sp-gnav-btn a {
		position: relative;
		display: block;
		width: 50px;
		height: 50px;
		padding: 35px 0 0;
		text-decoration: none;
		color: /*#fff*/;
		font-size: 10px;
		line-height: 140%;
		text-align: center;
	}

	#sp-gnav-btn a:before {
		content: "";
		position: absolute;
		display: block;
		width: 28px;
		height: 3px;
		top: 15px;
		right: 11px;
		background-color: #4570ba;

		-moz-transition: width 0.3s linear;
		-webkit-transition: width 0.3s linear;
		-o-transition: width 0.3s linear;
		-ms-transition: width 0.3s linear;
		transition: width 0.3s linear;
	}
	html:not(.sp) #sp-gnav-btn:hover a:before {width: 18px;}

	.sp-gnav-open #sp-gnav-btn:before {
		width: 28px !important;
		top: 16px;
		right: 7;
		-moz-transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.sp-gnav-open #sp-gnav-btn:after {
		width: 28px !important;
		top: 16px;
		right: 7;
		-moz-transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	.sp-gnav-open #sp-gnav-btn a:before {width: 0 !important;position: absolute;}

	#gnav > ul > li > span > .sp-gnav-layer-btn,
	#gnav > ul > li > ul > li > span > .sp-gnav-layer-btn {
		display: table-cell;
		width: 40px;
		cursor: pointer;
		-moz-transition: background-color .2s linear;
		-webkit-transition: background-color .2s linear;
		-o-transition: background-color .2s linear;
		-ms-transition: background-color .2s linear;
		transition: background-color .2s linear;
	}
	#gnav > ul > li > span > .sp-gnav-layer-btn { /*★*/
		border-left: solid 1px /*#333*/ #4570ba;
		border-bottom: solid 1px /*#333*/ #4570ba;
		background-color: #fff;
	}
	#gnav > ul > li > ul > li > span > .sp-gnav-layer-btn {
		border-left: solid 1px /*#444*/ #4570ba;
		border-bottom: solid 1px /*#444*/ #4570ba;
		background-color: /*#333*/ #4570ba;
	}
	.sp-gnav-layer-btn:before {
		content: "";
		position: absolute;
		display: block;
		width: 16px;
		height: 2px;
		top: 50%;
		right: 12px;
		margin: -1px 0 0;
		background-color: /*#fff*/ #4570ba;
	}
	.sp-gnav-layer-btn:after {
		content: "";
		position: absolute;
		display: block;
		width: 2px;
		height: 16px;
		top: 50%;
		right: 19px;
		margin: -8px 0 0;
		background-color: /*#fff*/ #4570ba;
		-moz-transition: -moz-transform .2s linear;
		-webkit-transition: -webkit-transform .2s linear;
		-o-transition: -o-transform .2s linear;
		-ms-transition: -ms-transform .2s linear;
		transition: transform .2s linear;
	}
	html:not(.sp) #gnav > ul > li > span > .sp-gnav-layer-btn:hover,
	#gnav > ul > li > span > .sp-gnav-layer-btn.current {
		border-left: solid 1px /*#444*/ #4570ba;
		border-bottom: solid 1px /*#444*/ #4570ba;
		background-color: /*#333*/ #5bd0d2;
	}
	html:not(.sp) #gnav > ul > li > ul > li > span > .sp-gnav-layer-btn:hover,
	#gnav > ul > li > ul > li > span > .sp-gnav-layer-btn.current {
		border-left: solid 1px #555;
		border-bottom: solid 1px #555;
		background-color: #444;
	}

	.sp-gnav-layer-btn.current:after {
		-moz-transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
	}

	#wrapper-cover {
		position: absolute;
		z-index: 10;
		display: none;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background-color: #000;
		opacity: .6;
	}

	#page-top-btn {right: 30px;}
	#page-top-btn.scroll {bottom: 30px;}
	.sp-gnav-open #page-top-btn.scroll {bottom: -40px;}


	#contents-container {
		width: 100%;
		padding: 0;
		left: 0;
	}

	#viewer-container {
		width: 100%;
		padding: 0;
		z-index: 20;
	}

	#viewer-container > div {width: 100%;}

	#viewer-cover {background-color: rgba(0, 0, 0, .8);}
}


/*---------------------------------------------
	For - 599px
  ---------------------------------------------*/

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

	#logo {
		position: absolute;
		width: 230px;
		height: 42px;
		top: 0;
		left: 0;
		-webkit-box-shadow: none;
        box-shadow: none;
	}

	#logo img {width: 230px;height: 42px; margin-top: 0px;}

	#sp-gnav-btn {
		top: 15px;
		right: 10px;
	}