@charset "utf-8";
/* CSS Document */
body {
margin: 0;
padding: 0;
font-family: "Helvetica Neue",
Arial,
"Hiragino Kaku Gothic ProN",
"Hiragino Sans",
Meiryo,
sans-serif;
}

body:before{
content:"";
display:block;
position:fixed;
top:0;
left:0;
z-index:-1;
width:100%;
height:100%;
background:url(../img/bg.jpg) center no-repeat;
background-size:cover;
background-position: top;
}


@media screen and (max-width : 900px) {/* small */
#topbutton img {
width: 45%;
}

#topbutton {
position: fixed;
bottom: 62px;
right: -7%;
z-index:100;
display: none;
text-align: center; 
margin: 0px; 
transition: filter 0.3s ease;
filter: brightness(1.0);
}
#wapper {
width: 100%;
}
/* メニューボタン */
#sp_menu {}
#btn-menu {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 85px;
  height: 85px;
  z-index: 2;
  background: url("../img/menu.png") no-repeat;
  background-size: 60%;
  background-position: 100% 10%;
}

.open-menu #btn-menu {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 85px;
  height: 85px;
  z-index: 2;
  background: url("../img/menu_close.png") no-repeat;
  visibility: visible;
  background-size: 60%;
background-position: 100% 10%;
}
 
/* メニュー */

button {
  border: none;
}

button:focus {
	outline:0;
}

#sp-menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255,255,255,0.9);
overflow: scroll;
z-index: 1;
transition: all .1s ease-in;
visibility: hidden;
opacity: 0;
}
 
.open-menu #sp-menu {
visibility: visible;
opacity: 1;
}

#sp-menu-position {
}

.sp-menu-list {
list-style: none;
text-align: center;
margin: 0 auto 0 auto;
padding-right: 40px;
padding-top: 100px;
}
.sp-menu-list img {
max-width: 100%;
}


.sp-menu-list a {
font-size: 22px;
font-weight: bold;
color: #e73363;
}
#pagename01 {
width: 60%;
margin: 0 0 3% 2%; 
}

#pagename02 {
width: 60%;
margin: 0 0 3% 2%;  
}
#footerbox{
position: relative;
max-width:100vw;
margin:auto;
}

img.footerbk{
display: inline-block;
margin: 0 0;
width: 100%;
}

#footeritem001 {
position: absolute;
top: 8%;
left: 5%;
max-width: 11%;
height:auto;
}
#footeritem009 {
position: absolute;
top: 9%;
left: 17%;
max-width: 28%;
height:auto;
}
#footeritem002 {
position: absolute;
top: 9%;
left: 48%;
max-width: 10%;
height:auto;
}
#footeritem003 {
position: absolute;
top: 9%;
left: 60%;
max-width: 10%;
height:auto;
}
#footeritem004 {
position: absolute;
top: 9%;
left: 72%;
max-width: 10%;
height:auto;
}
#footeritem005 {
position: absolute;
top: 34%;
left: 5%;
max-width: 37%;
height:auto;
}
#footeritem006 {
position: absolute;
top: 34%;
left: 45%;
max-width: 37%;
height:auto;
}
#footeritem007 {
position: absolute;
top: 60%;
left: 4%;
max-width :92%;
height:auto;
}

#navibox{
display: none;
}
.langbox{
  display: none;
}

.link-none {
  -webkit-filter: grayscale(0%);
  -moz-filter: grayscale(0%);
  -o-filter: grayscale(0%);
  -ms-filter: grayscale(0%);
  filter: grayscale(0%);
  transition:0.5s;
  transition:0.5s;
}

.link-none:hover{
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: grayscale(100%);
}


img.navibk{
display: inline-block;
margin: 0 0;
width: 100%;
max-width: 1000px;
}

#naviitem000 {
position: absolute;
top: 0%;
left: 3%;
max-width: 1%;
height:auto;
}

#naviitem001 {
position: absolute;
top: 8%;
left: 3%;
max-width: 5%;
height:auto;
}
#naviitem002 {
position: absolute;
top: 6%;
left: 8%;
max-width: 15%;
height:auto;
}
#naviitem003 {
position: absolute;
top: 4%;
left: 22%;
max-width: 12%;
height:auto;
}
#naviitem004 {
position: absolute;
top: 4%;
left: 34%;
max-width: 22%;
height:auto;
}

#naviitem005 {
position: absolute;
top: 4%;
left: 56%;
max-width: 16%;
height:auto;
}

#naviitem006 {
position: absolute;
top: 7%;
left: 72%;
max-width: 25%;
height:auto;
}
}
/* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large *//* large */
@media screen and (min-width : 901px) {/* large */
#topbutton img {
width: 70%;
}

#topbutton {
position: fixed;
bottom: 5px;
right: 5px;
z-index:100;
display: none;
text-align: center; 
margin: 0px; 
transition: filter 0.3s ease;
filter: brightness(1.0);
}

#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 80%;
}

#wapper {
max-width: 1080px;
margin: auto;
/*background-color: #000;*/
}


/* メニューボタン */
#sp_menu {
display: none;
}
#btn-menu {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 85px;
  height: 85px;
  z-index: 2;
  background: url("../img/menu.png") no-repeat;
}

.open-menu #btn-menu {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 85px;
  height: 85px;
  z-index: 2;
  background: url("../img/menu_close.png") no-repeat;
  visibility: visible;
}
 
/* メニュー */

button {
  border: none;
}

button:focus {
	outline:0;
}

#sp-menu {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255,255,255,0.65);
overflow: scroll;
z-index: 1;
transition: all .1s ease-in;
visibility: hidden;
opacity: 0;
}
 
.open-menu #sp-menu {
visibility: visible;
opacity: 1;
}

#sp-menu-position {
}

.sp-menu-list {
list-style: none;
text-align: center;
margin: 0 auto 0 auto;
padding-right: 17px;
padding-top: 100px;
}
.sp-menu-list img {
max-width: 100%;
}


.sp-menu-list a {
font-size: 22px;
font-weight: bold;
color: #e73363;
}

#footerbox{
position: relative;
max-width:1000px;
margin:auto;
}

img.footerbk{
display: inline-block;
margin: 0 0;
width: 100%;
max-width: 1000px;
}

#pagename01{
max-width: 46%;
margin: 0 0 0 4%;
}

#pagename02{
max-width: 46%;
margin: 0 0 2% 4%;
}

#footerbox {}
#footeritem001 {
position: absolute;
top: 8%;
left: 4%;
max-width: 9%;
height:auto;
}
#footeritem009 {
position: absolute;
top: 11%;
left: 14%;
height:auto;
}
#footeritem002 {
position: absolute;
top: 12%;
left: 37%;
max-width: 8%;
height:auto;
}
#footeritem003 {
position: absolute;
top: 12%;
left: 46%;
max-width: 8%;
height:auto;
}
#footeritem004 {
position: absolute;
top: 12%;
left: 55%;
max-width: 8%;
height:auto;
}
#footeritem005 {
position: absolute;
top: 9%;
left: 42%;
max-width: 27%;
height:auto;
}
#footeritem006 {
position: absolute;
top: 9%;
left: 69%;
max-width: 27%;
height:auto;
}
#footeritem007 {
position: absolute;
top: 43%;
left: 4%;
max-width :84%;
height:auto;
}

.link-none {
  -webkit-filter: grayscale(0%);
  -moz-filter: grayscale(0%);
  -o-filter: grayscale(0%);
  -ms-filter: grayscale(0%);
  filter: grayscale(0%);
  transition:0.5s;
  transition:0.5s;
}

.link-none:hover{
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  filter: grayscale(100%);
}

.langbox{
  position: relative;
  max-width:1080px;
  padding: 10px 0;
  margin: 0 auto 0 auto;
  background: url('../img/nav_box_bg.png') no-repeat bottom center;
  background-size: cover;
}
.langbox ul {
  display: flex;
  justify-content: flex-end;
  padding: 0 1.3em 0 0;
  margin-top: 0;
}
.langbox ul li {
  list-style: none;
}
.langbox ul li.lang a {
  opacity: 1;
  transition: 0.3s;
}
.langbox ul li.lang a:hover {
  opacity: 0.7;
  transition: 0.3s;
}

#navibox{
position: relative;
max-width:1000px;
margin: 0 auto 0 auto;
}

img.navibk{
display: inline-block;
margin: 0 0;
width: 100%;
max-width: 1000px;
}

#naviitem000 {
position: absolute;
top: 0%;
left: 1%;
max-width: 20%;
height:auto;
}

#naviitem001 {
position: absolute;
top: 8%;
left: 2%;
max-width: 5%;
height:auto;
}
#naviitem002 {
position: absolute;
top: 6%;
left: 7%;
max-width: 15%;
height:auto;
}
#naviitem003 {
position: absolute;
top: 4%;
left: 22%;
max-width: 12%;
height:auto;
}
#naviitem004 {
position: absolute;
top: 4%;
left: 32.7%;
max-width: 22%;
height:auto;
}

#naviitem005 {
position: absolute;
top: 4%;
left: 53%;
max-width: 16%;
height:auto;
}

#naviitem006 {
position: absolute;
top: 7%;
left: 72%;
max-width: 25%;
height:auto;
}
}