@charset "utf-8";
body{margin:0; padding:0;}

#tmpl_main{
 width:100% !important;
 min-width:1190px;
 padding:0 !important;
 margin:0 auto;
 position:relative;
 font-size: 125%;
 line-height:1.2;
}
.ten-years-content{
 width:100%;
 max-width:950px;
 margin:0 auto;
 text-align:center;
}
.ten-years-content h2{
 font-size:200%;
 margin:0 auto;
 text-align:center;
}
.ten-years-content .ten-years-ttl{
 display:inline-block;
 width:auto;
 padding:5px 0;
 margin:0 auto;
 text-align:center;
 border-bottom:3px solid #000;
}

/***************************************
 * menu buttom
 **************************************/
.menu-btn-box{
 position:absolute;
 top:0;
 left:0;
 width:50px;
 z-index:999;
}
@media screen and (max-width: 640px){
    .menu-btn-box{
    top:40px !important;
    }
}
.menu-btn-box p{
 display:block;
 width:50px;
 height:50px;
 margin:0;
 padding:0;
 text-align:center;
 vertical-align:middle;
 box-sizing:border-box;
}
.menu-btn-box p.ten-years-top{
 border:2px solid #ccc;
}
.menu-btn-box p.barger-btn{
 padding:16px 0 0;
 background-color:#00c0ee;
 cursor:pointer;
}
.menu-trigger {
	display:block;
 margin:0 auto;
	position: relative;
	width: 34px;
	height: 18px;
}
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
 border:none;
	background-color: #fff;
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger span:nth-of-type(2) {
	top: 8px;
}
.menu-trigger span:nth-of-type(3) {
	bottom: 0;
}

.menu-trigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(8px) rotate(-45deg);
	transform: translateY(8px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
	opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
	-webkit-transform: translateY(-8px) rotate(45deg);
	transform: translateY(-8px) rotate(45deg);
}


/***************************************
 * Menu
 **************************************/
.menu-container{
 min-width:100%;
 min-height:100%;
 background-color:rgba(255,255,255,0.95);
 position:absolute;
 top:0;
 left:0;
 z-index:998;
 display:none;
}
@media screen and (max-width: 640px){
    .menu-container{
    top:40px !important;
    }
}
.menu-container a{
 display:block;
 margin:0 auto;
 padding:20px 0;
 line-height:1.2;
 font-size:150%;
 color:#000;
 text-decoration:none;
}
.menu-container a:hover{
 background-color:#fff;
}
.menu-container ul{
 display:block;
 width:84.21%;
 max-width:800px;
 list-style:none;
 margin:45px auto 0;
 padding:0;
 text-align:center;
 border-top:2px solid #000;
}
.menu-container li{
 margin:0;
 padding:0;
 border-bottom:2px solid #000;
}
.menu-container li.ten-years-menu07{
 display:block;
 height:70px;
}



/***************************************
 * pagetop buttom
 **************************************/
.pagetop {
	height: 1px;
	margin: 0 auto;
	width: 100%;
}
.pagetop .floater {
	height: 0;
	margin: 0 auto;
	min-width: 1190px;
	position: static;
	width: 100%;
}
.pagetop .floater.fixed {
	bottom: 0;
	height: 0;
	position: fixed;
	z-index: 1000;
}
.pagetop .floater a {
    background-color: rgba(33, 37, 48, 0.4);
    border-radius: 0.125em;
    display: block;
    height: 32px;
    margin: 0 0 0 auto;
    overflow: hidden;
    position: relative;
    right: 40px;
    text-align: center;
    top: -74px;
    transition: background-color 0.2s ease-out 0s;
    width: 40px;
}
.touch .pagetop .floater a {
    transition: none 0s ease 0s ;
}
.pagetop .floater a:hover {
    background-color: rgba(33, 37, 48, 0.8);
}
.touch .pagetop .floater a:hover {
    background-color: rgba(33, 37, 48, 0.4);
}
.pagetop .floater a span {
    display: inline-block;
    height: 6px;
    margin-top: 0.7em;
    position: relative;
    width: 16px;
}
.pagetop .floater a img {
    height: 6px;
    left: 12px;
    position: absolute;
    top: 11px;
    width: 16px;
}
.pagetop .target {
	bottom: 0;
	height: 0;
	left: 0;
	position: fixed;
	width: 100%;
}

@media screen and (max-width: 640px) {
 #tmpl_main{
  font-size:100%;
  width:100%;
  min-width:100%;
  line-height:1.15;
 }
 .ten-years-content{
  width:auto;
  margin:0 25px;
 }
 .menu-container a{
  padding:10px 0;
  font-size:119%;
 }
 .menu-container ul{
  display:block;
  width:100%;
  list-style:none;
  margin:25px auto 0;
 }
 .menu-container li.ten-years-menu07{
  display:block;
  height:40px;
 }
 
 .pagetop {
  margin-top: 22px;
  min-width: 320px;
  padding-bottom: 15px;
 }
 .pagetop .floater {
  min-width: 320px;
  width: 100%;
 }
 .pagetop .floater.fixed {
  bottom: 15px;
  left: 0;
  position: fixed;
 }
 .pagetop .floater a {
  margin: 0 6.3% 0 auto;
  right: 0;
  top: -32px;
  transition: none 0s ease 0s ;
 }
 .pagetop .floater a:hover {
  background-color: rgba(33, 37, 48, 0.4);
 }
 .pagetop .target {
  bottom: 15px;
 }
}
@media screen and (max-width: 320px) {
 #tmpl_main{
  font-size:90%;
 }
 .menu-container a{
  font-size:100%;
 }
}