@media (min-width: 768px) {
/* PC用 */
	.sp-show{ display: none;}
	
	
	
}

@media (max-width: 767px) {
/* tablet用 */
	.sp-hide{ display: none;}
	
	
	
	
}


@media (min-width: 768px) {
/* PC用 */
	
	body p{color: #0b132f; font-size: 14px; margin: 0 0 30px 0; font-family: 'Noto Sans JP', sans-serif;}
	.rightImg{float: right; margin-left: 30px;}
	.leftImg{float: left; margin-right: 30px;}
	.left{float: left;}
	.right{float: right;}
	.en{font-family: 'Oswald', sans-serif;}
	.language{text-align: center; padding:10px; font-size: 10px;}
	.language img{width:24px;}
	
	
		/* header
-----------------------------------------*/
	
	h1{font-size:30px; text-align: center;}
	h1 .title{font-size:15px; font-weight: normal;}
	h1 .subTit{font-size:12px; font-weight: normal;}
	.logo{position: fixed; left:0!important; top: 0!important; width:75px; z-index: 9999;}
	h1 a{color:#0b132f;}
	h1 a:hover{ text-decoration: none;}
	
		/* navigation
-----------------------------------------*/	
	
	.navigation{ color: #ddd;}

	
	
	
	
	/* footer
-----------------------------------------*/
	
	.footerWrap{ clear: both; border-top: 3px solid #0b132f; padding-top: 50px; background-color: #F6F7F7; padding-bottom: 50px; overflow: hidden;}
	.footerWrap .footinner{width:1000px; margin: auto;}
	.footerWrap .contentsMenu{width:600px; float: right;}
	.footerWrap .contentsMenu .block{width:200px; float: left;}
	.footerWrap .contentsMenu .block li{background-image: url("../img/maru.png"); background-repeat: no-repeat; background-position: 0 4px; padding:0 0 0 20px; font-size:  14px; margin-bottom: 20px;}
	.footerWrap .contentsMenu .block li a{color: #0b132f;}
	.footerWrap .contentsMenu .block li ul {margin-top: 5px;}
	.footerWrap .contentsMenu .block li ul li{background:none; margin:0 0 5px 10px; padding: 0 0 0 0; list-style-type: disc; font-size: 12px;}
	.footerWrap .footer{ width:330px; float: left;}
	.footerWrap .footer .siteName{ font-size: 20px; text-align: center; padding-bottom: 0px;}
	.footerWrap .footer .siteName .title{font-size:12px; font-weight: normal;}
	.footerWrap .footer .siteName .subTit{font-size:10px; font-weight: normal;}
	.footerWrap .copy{font-size: 10px; text-align: center;}
		
	
}







@media (max-width: 767px) {
/* tablet用 */	
	body p{color: #0b132f; font-size: 14px; line-height: 150%; margin: 0 0 30px 0;  font-family: 'Noto Sans JP', sans-serif;}
	.en{font-family: 'Oswald', sans-serif;}
	
	
		/* header
-----------------------------------------*/
	
	h1{font-size:4.2vw; width:70%; margin:5% auto; text-align: center; font-weight: normal;}
	h1 .title{font-size:2vw;  font-weight: normal;}
	h1 .subTit{font-size:2vw;  font-weight: normal;}
	.logo{position: fixed; left:0!important; top: 0!important; width:50px; z-index: 9999;}
	h1 a{color:#0b132f;}
	h1 a:hover{ text-decoration: none;}
	
		/* navigation
-----------------------------------------*/	
	
	.navigation{ color: #ddd;}
	
	
	
	
	/* footer
-----------------------------------------*/
	
	.footerWrap{}
	.footerWrap .contentsMenu{ height: 0; display: none;}
	.footerWrap .footer{ border-top: 3px solid #0b132f; padding: 5%; background-color: #F6F7F7; padding-bottom: 5%;}
	.footerWrap .footer .siteName{ font-size: 4vw; text-align: center; padding-bottom: 0;}
	.footerWrap .footer .siteName .title{font-size:2.5vw; font-weight: normal; line-height: 150%;}
	.footerWrap .footer .siteName .subTit{font-size:2.5vw; font-weight: normal;}
	.footerWrap .copy{font-size: 10px; text-align: center;}
	
	
}






/* 共通 */
body{margin: 0px!important; padding: 0px!important; overflow-x: hidden; animation: fadeIn 1s ease 0s 1 normal;  -webkit-animation: fadeIn 1s ease 0s 1 normal;color: #0b132f;}
@keyframes fadeIn { 0% {opacity: 0} 100% {opacity: 1}}
@-webkit-keyframes fadeIn { 0% {opacity: 0} 100% {opacity: 1}}
#english{font-family: 'Roboto Condensed', sans-serif!important; letter-spacing: 0!important;}
#english h2{letter-spacing: 1px!important;}
#english .en{font-family: 'Roboto Condensed', sans-serif!important; letter-spacing: 0!important;}
#english nav{font-family: 'Roboto Condensed', sans-serif!important; letter-spacing: 0!important;}
#chinese{font-family : 'SimSun','宋体','sans-serif'!important;}
#chinese p{font-family : 'SimSun','宋体','sans-serif'!important;}
#chinese .en{ font-family :'Oswald'!important;}
#chinese .date{ font-family :'Oswald'!important;}
#chinese .aicon{ font-family :'Oswald'!important;}
img{ max-width:100%;}
a{color: #0EA8C9; text-decoration: none;}
a:hover{text-decoration:underline;}
a img:hover{opacity: 0.6;}
.red{color: #C00;}
.checkpoint{color: #C00; font-size: 20px; padding: 0 5px;}

.language{text-align: center; padding:10px; font-size: 10px;}
	.language img{width:24px;}

/*メニュー動作*/
.wrapper {
  height: 100%;
  overflow-x: hidden;
  position: relative;
}
.overlay {
  content: "";
  display: block;
  width: 0;
  height: 0;
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  opacity: 0;
  transition: opacity .5s;
}
.overlay.open {
  width: 100%;
  height: 100%;
  opacity: 1;
}
main {
  height: 100%;
/*  min-height: 100vh;*/
  padding: 0;
  transition: all .5s;
	margin: 0;

}
main.open {
  transform: translateX(-250px);
}


.menu-trigger {
  display: inline-block;
  width: 36px;
  height: 28px;
  vertical-align: middle;
  cursor: pointer;
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 999;
/*   transform: translateX(0);
  transition: transform .5s;
 */}
/* .menu-trigger.active {
  transform: translateX(-250px);
}
 */.menu-trigger span {
  display: inline-block;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #0b132f;;
  transition: all .5s;
}
.menu-trigger.active span {
  background-color: #0b132f;;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger.active span:nth-of-type(1) {
  transform: translateY(12px) rotate(-45deg);
}
.menu-trigger span:nth-of-type(2) {
  top: 12px;
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  transform: translateY(-12px) rotate(45deg);
}

nav {
  width: 250px;
  height: 100%;
  padding-top: 30px;
  background-color:#fff;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10;
  transform: translate(250px);
  transition: all .5s;
	overflow: auto;

	
	
}
nav.open {
  transform: translateZ(0);
}
nav li {
  color: #fff;
  text-align: center;
  padding: 10px;
	width:90%;
	text-align: left;
	margin: auto;
 font-size: 18px;
}

nav li p{margin: 0; display: block; width:100%; font-size: 18px;}
nav li a{color: #0b132f;}
nav li a:hover{color: #0EA8C9; text-decoration: none; }

nav li .subCont li{line-height: 150%; font-size: 14px!important; margin-bottom: 5px; margin-left: 10px; border-left: 2px solid #ddd; padding: 0 0 0 50px;}

* {
  box-sizing: border-box;
}
nav .inner{padding-top: 5%;}
.accordion7 .accordion{ background-image: url(../img/close.png); background-repeat: no-repeat; background-position:right 10px; font-size: 15px;}
.accordion7 .accordion.op{ background-image: url(../img/open.png); background-repeat: no-repeat; background-position:right 10px;}


nav .subCont{padding-top: 10%; font-size: 15px!important;}
nav .subCont li a{ font-size: 15px!important;}
ul {  list-style: none;  margin: 0 0 20px;  padding: 0;}

.accordion7 {text-align: center;}
.accordion7 .inner {display: none;}
.accordion7 .inner li ul{display: none; }
.accordion7 p{cursor: pointer;}
.accordion7 p.ac1{}
.accordion7 p.ac2{}
.accordion7 p.ac3{}
.accordion7 .inner li{font-size: 15px!important; margin-right: 0;  width: 100%; padding: 5px 0 5px 10px!important;}
.accordion7 .inner li p{font-size: 15px!important;}
.accordion7 .inner li ul li a{padding: 0; font-size: 15px!important; padding: 5px 0 ;}
.accordion7 .inner li .accordion{cursor: pointer;background-image: url(../img/close.png); background-repeat: no-repeat; background-position:right 10px;}
.accordion7 .inner li .accordion.op2{cursor: pointer; background-image: url(../img/open.png); background-repeat: no-repeat; background-position:right 10px;}

.navigation{font-size:40px; width:80%; margin: 0 auto 10%; }
.cat{ border-bottom: 1px solid #ddd;font-size: 15px!important;}







/*トップへ戻るボタン*/
#page_top{
  width: 50px;
  height: 50px;
  position: fixed;
  right: 0;
  bottom: 0;
  background: #405ABC;
  opacity: 0.6;
  border-radius: 50%;
right: -50px;
}
#page_top a{
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  text-decoration: none;
}
#page_top a::before{
  font-family: FontAwesome;
  content: '\f106';
  font-size: 25px;
  color: #fff;
  position: absolute;
  width: 25px;
  height: 25px;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}



.clear{ clear: both;}