/* CSS Document */

@charset "utf-8";

body{	
color: #212121;
    font-family: "Zen Maru Gothic",sans-serif,"Hiragino Kaku Gothic Pro","メイリオ",sans-serif;
font-weight: 700;
    font-feature-settings: "palt";
font-style: normal;}

.cont{width: 94%; max-width: 1100px; margin: 0 auto;}

a:hover{opacity: 0.8;transition: 0.3s;}

.spOnly{display: none;}
.pcOnly{display: block;}

header{width: 100%;background: #fff;border-bottom: 1px solid #aeaeae;height: 70px;display: block;position: fixed;z-index: 100;}
.logo{position: absolute;
    top: 12px;
    left: 0;
    right: 0;
    width: 5%;
    margin: 0 auto;
    min-width: 112px;}

.logo_poke1{position: absolute;
    top: 2px;
    left: -194px;
    right: 0;
    width: 3.5%;
    margin: 0 auto;min-width: 66px}

.logo_poke2{position: absolute;
    top: 2px;
    left: 0;
    right: -194px;
    width: 3.5%;
    margin: 0 auto;min-width: 66px}

.oficiallogo{position: absolute;
    top: 13px;
    left: 13px;
    width: 8%;
    margin: 0 auto;
    min-width: 152px;}

.oficiallogo2{position: absolute;
    top: 16px;
    left: 183px;
    width: 5%;
    margin: 0 auto;
    min-width: 85px;}

.menu-trigger {
  display: inline-block;
    width: 33px;
    height: 21px;
    vertical-align: middle;
    cursor: pointer;
    position: fixed;
    top: 16px;
    right: 20px;
    z-index: 100;
    transform: translateX(0);
    transition: transform .5s;
 }
 .menu-trigger.active {
  transform: translateX(-250px);
  right: -225px;
}
.menu-trigger span {
display: inline-block;
box-sizing: border-box;
position: absolute;
left: 0;
width: 100%;
height: 2px;
background-color: #000;
}
.menu-trigger.active span {
  background-color: #595656;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger.active span:nth-of-type(1) {
  transform: translateY(7px) rotate(-45deg);
}
.menu-trigger span:nth-of-type(2) {
  top: 10px;
}
.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);
}

.menu-trigger p { font-size: 11px; margin-top: 28px; font-weight: bold;}

nav {
  width: 250px;
  height: 100%;
  padding-top: 90px;
  background-color: #fff;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10;
  transform: translate(250px);
  transition: all .5s;
}
nav.open {
  transform: translateZ(0);
}
nav li {
	
	display: inline-block;
	width: 100%;
	border-bottom: #e6e6e7 1px solid;
	font-size: 14px;
	font-weight: bold;
}
nav li a{
	background: #fff;
	position: relative;
	color: #212121;
	width:92%;
    height:100%;
	padding: 20px 4%;
    display: block;
    text-decoration: none;
}

nav li a:hover{background: #ffe155;}

nav li a:before{
	content: url(../image/common/listicon.png);
    padding-right: 7px;
	vertical-align: middle;
}

nav li:nth-of-type(1){
  border-top: #e6e6e7 1px solid;
}


.youji_glnavi{background: #ff5e6b;}
.youji_glnavi:hover{background: #e60012;}

.shougakusei_glnavi{background: #ffa63d;}

.navsubmenu{}
.navsubmenu li{font-size: 12px; padding-left: 22px;}
.navsubmenu li a{position: relative;}

.navsubmenu li a .red{color:#e70012;}
.navsubmenu li a .blue{color:#00a1e9;}
.navsubmenu li a .orange{color:#f28e00;}

.navsubmenu li a:before{
	content:"・";
    padding-right: 7px;
	vertical-align: middle;
}

.menuWrapper {
  height: 100%;
  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: 100vh;
  opacity: 1;
}
.overlay .menulist{
		opacity: 1;

	}


.mgBt0{margin-bottom: 0!important;}

.small{font-size:80%;}
img{width: 100%; height: auto;}

#index-footer{background: #fff; padding: 30px 15px;text-align: center;}
.infoLINK{color: #5d5d5d; text-align: center; text-decoration: underline; margin-bottom: 20px; font-size: 1.2rem;}
.copy{color: #5d5d5d;font-size: 1.2rem;    line-height: 1.8rem;}
#shogakukan{padding: 3rem 2rem;}
#shogakukan a{color: #5d5d5d;
	padding: 0.5rem 1rem;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1;
    text-decoration: none;
    border: 1px solid #5d5d5d;}

#index{padding-top: 150px;max-width: 980px;width: 90%; margin: 0px auto 60px auto;}

.main{margin: 0px auto 60px auto;}

#top_btn {position: fixed;
    cursor: pointer;
    width: 65px;
    height: 64px;
    z-index: 999;
    bottom: 15px;
    right: 15px;}

#top_btn2 {position: fixed;
    cursor: pointer;
    width: 116px;
    height: 80px;
    z-index: 999;
    bottom: 15px;
    right: 15px;}

.ankerLink {
    padding-top: 90px;
    margin-top: -90px;
}

.Bnr02{width: 100%; margin-top: 70px;}

@media screen and (max-width:768px){
    
    .spOnly{display: block;}
.pcOnly{display: none;}
    
    .oficiallogo {
position: absolute;
        top: 7px !important;
        left: 10px !important;
        width: 15% !important;
        min-width: 95px !important;
}
    
    .oficiallogo2 {
                position: absolute;
        top: 34px !important;
        left: 10px !important;
        width: 3% !important;
        min-width: 50px !important;
}
	
	.logo_poke1{
    left: -158px;
    right: 0;
    width: 3.5%;min-width: 66px}

.logo_poke2{
    left: 0;
    right: -158px;
    width: 3.5%;min-width: 66px}
	
	#index{padding-top: 125px;}
	
	.menu-trigger p { font-size: 9px; margin-top: 28px; font-weight: bold;}
	.menu-trigger {top: 13px;}
	
	header{height: 60px;}
	.logo{position: absolute;
    top: 16px;
    left: 0;
    right: 0;
    width: 22.3%;
    margin: 0 auto;
	min-width: auto;
    max-width: 88px;}
	
	#top_btn {position: fixed; cursor:pointer; width: 50px;height: 63px;z-index: 999;bottom: 10px;right: 10px;}
	#top_btn2 {position: fixed; cursor:pointer; width: 100px;
    height: 75px;z-index: 999;bottom: 10px;right: 10px;}
	
}
