﻿@charset "utf-8";

#header { 
	height: 110px;
	padding: 0;
	z-index:10;
}

#header .gototop a {
	display:block;
	width:880px;
	height:110px;
	margin:0px 0px -110px 0px;
}

#header .gototop a:after {
	background:url(image/minamo5.png) no-repeat center center;
    content: '';
    position: absolute;
    top: 0;
    left: 0px;
	width:880px;
	height:110px;
	opacity:0;
	background-size:0px 0px;
	z-index:20;
}

#header .gototop a:hover:after {
    -webkit-animation: ripple3 1.5s ease;
    animation: ripple3 1.5s ease;
}

#header .gototop a:before {
	background:url(image/minamo6.png) no-repeat center center;
    content: '';
    position: absolute;
    top: 0;
    left: 0px;
	width:880px;
	height:110px;
	opacity:0;
	background-size:550px 550px;
	z-index:20;
}

#header .gototop a:hover:before {
    -webkit-animation: ripple4 .8s ease .6s;
    animation: ripple4 .8s ease .6s;
}


/*　波紋３ */
@-webkit-keyframes ripple3 {
    0%{opacity:0.5;-webkit-background-size:0px 0px;background-size:0px 0px;}
    100%{opacity:0;-webkit-background-size:1000px 1000px;background-size:1000px 1000px;}
}

@keyframes ripple3 {
    0%{opacity:0.5;-webkit-background-size:0px 0px;background-size:0px 0px;}
    100%{opacity:0;-webkit-background-size:1000px 1000px;background-size:1000px 1000px;}
}

/*　波紋４ */
@-webkit-keyframes ripple4 {
    0%{opacity:0;-webkit-background-size:550px 550px;background-size:550px 550px;}
	10%{opacity:0.05;}
    100%{opacity:0;-webkit-background-size:750px 750px;background-size:750px 750px;}
}

@keyframes ripple4 {
    0%{opacity:0;-webkit-background-size:550px 550px;background-size:550px 550px;}
	10%{opacity:0.05;}	
    100%{opacity:0;-webkit-background-size:750px 750px;background-size:750px 750px;}
}


#dd {
  margin: 0;
  padding: 0px;
  font-size: 16px;
  line-height:20px;
}

#dd li {
  list-style: none;
  width:220px;
}

#dd li a {
  color: #000000;
  font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "小塚明朝 Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif; 
  position: relative;
  display: block;
  text-align: left;
  margin: 0;
  padding: 10px 10px;
  font-weight:bold;
  text-decoration:none;
  list-style:none;
  border-top:solid 1px #dfdfdf;
  border-left:solid 1px #bfbfbf;
  border-right: solid 1px #9f9f9f;
  border-bottom: solid 1px #7f7f7f;
}

#dd li.green a {
  color: #32bd8c;
}

#dd li a.current {
  color: #32bd8c;
}

#dd li a:hover {
  color: #cf1000;
  border-bottom:solid 1px #dfdfdf;
  border-right:solid 1px #bfbfbf;
  border-left: solid 1px #9f9f9f;
  border-top: solid 1px #7f7f7f;
}

#dd li a:after {
	background:url(image/minamo1.png) no-repeat center center;
    content: '';
    position: absolute;
    top: 0;
    left: 0px;
    width: 220px;
	height:40px;
	opacity:0;
	background-size:0px 0px;
}

#dd li.wide a:after { height:60px; }

#dd li a:hover:after {
    -webkit-animation: ripple 1.5s ease;
    animation: ripple 1.5s ease;
}

#dd li a:before {
	background:url(image/minamo2.png) no-repeat center center;
    content: '';
    position: absolute;
    top: 0;
    left: 0px;
    width: 220px;
	height:40px;
	opacity:0;
	background-size:250px 250px;
}

#dd li.wide a:before { height:60px; }

#dd li a:hover:before {
    -webkit-animation: ripple2 1s ease .5s;
    animation: ripple2 1s ease .5s;
}

/*　波紋１ */
@-webkit-keyframes ripple {
    0%{opacity:0.1;-webkit-background-size:0px 0px;background-size:0px 0px;}
    100%{opacity:0;-webkit-background-size:500px 500px;background-size:500px 500px;}
}

@keyframes ripple {
    0%{opacity:0.1;-webkit-background-size:0px 0px;background-size:0px 0px;}
    100%{opacity:0;-webkit-background-size:500px 500px;background-size:500px 500px;}
}

/*　波紋２ */
@-webkit-keyframes ripple2 {
    0%{opacity:0.02;-webkit-background-size:250px 250px;background-size:250px 250px;}
    100%{opacity:0;-webkit-background-size:375px 375px;background-size:375px 375px;}
}

@keyframes ripple2 {
    0%{opacity:0.02;-webkit-background-size:250px 250px;background-size:250px 250px;}
    100%{opacity:0;-webkit-background-size:375px 375px;background-size:375px 375px;}
}

.bokuga {
  font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "小塚明朝 Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif; 
  display: block;
  text-align: left;
  margin: 0;
  padding: 10px 10px;
  color: #101010;
  font-weight:bold;
  text-decoration: none;
  list-style:none;
}

.unesco {
  font-size:12px;
  line-height:1.5em;
  display: block;
  text-align: left;
  margin: 0 10px 10px 10px;
  padding: 10px 10px;
  color: #101010;
  text-decoration: none;
  list-style:none;
}

#menu_m{	font-size: 15px;	}
#menu_s{	font-size: 14px;	}
#menu_xs{	font-size: 12px;	}
#menu_xxs{	font-size: 10px;	}


.upbutton {
	display: inline-block;
	text-align: center;
	text-decoration: none;
	outline: none;
	z-index:10;
	position: relative;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-perspective: 300px;
	-moz-perspective: 300px;
	-ms-perspective: 300px;
	-o-perspective: 300px;
	perspective: 300px;
/*	background:white; */
}
.upbutton span {
	display: block;
	text-align: center;
	z-index:-10;
	position: absolute;
/*	background:white; */
}
.upbutton span:nth-child(2) {
    content: '';
    position: absolute;
	margin:-30px 0 0 50px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: none;
}

.upbutton span:nth-child(3) {
    content: '';
    position: absolute;
	margin:-30px 0 0 50px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: none;
}

.upbutton span:nth-child(4) {
    content: '';
    position: absolute;
	margin:-30px 0 0 50px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: none;
}

.upbutton span:nth-child(5) {
    content: '';
    position: absolute;
	margin:-30px 0 0 50px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: none;
}

.upbutton:hover span:nth-child(2) {
    -webkit-animation: wave 1s ease;
    animation: wave 1s ease;
}

.upbutton:hover span:nth-child(3) {
    -webkit-animation: wave2 1s ease;
    animation: wave2 1s ease;
}

.upbutton:hover span:nth-child(4) {
    -webkit-animation: wave2 1s ease;
    animation: wave2 1s ease;
}

.upbutton:hover span:nth-child(5) {
    -webkit-animation: wave2 1s ease;
    animation: wave2 1s ease;
}


@keyframes wave {
    0%{opacity:1;-webkit-transform:scale(1);transform:scale(1);box-shadow: 0 0 0 1px rgba(233,88,91,0);}
    100%{opacity:0;-webkit-transform:scale(2);transform:scale(2);box-shadow: 0 0 0 2px rgba(233,88,91,1);}
}

@keyframes wave2 {
    0%{opacity:1;-webkit-transform:scale(2);transform:scale(2);box-shadow: 0 0 0 1px rgba(233,88,91,0);}
    100%{opacity:0;-webkit-transform:scale(3);transform:scale(3);box-shadow: 0 0 0 2px rgba(233,88,91,1);}
}

@keyframes wave3 {
    0%{opacity:1;-webkit-transform:scale(3);transform:scale(3);box-shadow: 0 0 0 1px rgba(233,88,91,0);}
    100%{opacity:0;-webkit-transform:scale(4);transform:scale(4);box-shadow: 0 0 0 2px rgba(233,88,91,1);}
}

@keyframes wave4 {
    0%{opacity:1;-webkit-transform:scale(4);transform:scale(4);box-shadow: 0 0 0 1px rgba(233,88,91,0);}
    100%{opacity:0;-webkit-transform:scale(5);transform:scale(5);box-shadow: 0 0 0 2px rgba(233,88,91,1);}
}