/* .video ///////////////////////*/
#videoArea {
  position: absolute;
  z-index: 10;
min-width: 100%;
min-height: 100%;
}
/* .video2 ///////////////////////*/
#videoArea2 {
position: absolute;
z-index: 10;
min-width: 100%;
min-height: 100%;
}

/* .main ///////////////////////*/
.main {
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.main article {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.main .bg,
.main .bg li {
  /* position: absolute; */
  width: 100%;
  height: 100%;
}
.main .bg img {
width: 100%;
min-height: 100%;
}
.main header {
  position: absolute;
  text-align: center;
  z-index: 100;
  width: 100%;
  height: 100%;
}
.main .shopping {
  position: absolute;
  left: 5%;
}
.main h1 {
  position: absolute;
  top: 32%;
  left: 50%;
  margin-left: -155px;
}
.main h2 {
    position: absolute;
    top: 93px;
    left: 52px;
}
.main .scroll {
  position: absolute;
  left: 50%;
  margin-left: -25px;
  bottom: 100px;
}


/* .main boxslider ///////////////////////*/
.main {
overflow: hidden;
width: 100%;
height: 100vh;
border:0px #FF0000 solid;
}
.main .slider{
height:100vh;
}
.slider img{
height:100vh;
width:100vw;
object-fit:cover;
}

/* .videoArea ///////////////////////*/
#videoArea{
border:0px #FF0000 solid;
width:100vw;
min-width:1300px;
}
@media (max-width:1300px) {
#videoArea{
position:absolute;
left: 50%; 
margin-left:-650px;
}
}

/*
@media (max-width: 1280px) {
  .main .bg {
    width: 1280px;
    left: 50%;
    margin-left: -640px;
  }
}
*/

@media (max-width: 800px) {
  .main .scroll {
    bottom: 20px;
  }
  .main .shopping {
    display: none;
  }
}
@media (max-width: 500px) {
/*
  .main .bg {
    width: 880px;
    left: 50%;
    margin-left: -440px;
  }
*/
  .main h1 {
    top: 50%;
    margin-left: -100px;
  }
  .main h1 img {
    width: 200px;
  }
  .main h2 {
    left: 50%;
    margin-left: -60px;
    width: 120px;
  }
  .main h2 img {
    width: 120px;
  }
}


/* .global nav ///////////////////////*/
.global nav {
  background-color: transparent;
  background-image: url("../image/global_bg.png");
}
/* .dekiru ///////////////////////*/
.dekiru {
  /* ベージュ */
  background-color: #F0ECE5;
  height: 440px;
  overflow: hidden;
  position: relative;
}
.dekiru header {
  position: absolute;
  text-align: center;
  width: 100%;
  z-index: 10;
}
.dekiru h2 {
  margin-top: 80px;
}
.dekiru h2 img {
  max-width: 90%;
}
.dekiru h3 {
  font-size: 10pt;
  margin-top: 30px;
letter-spacing: .1em;
}
.dekiru .a1 {
  margin-top: 30px;
}
.dekiru article {
  position: absolute;
  width: 100%;
}
.dekiru .image1 {
  position: absolute;
  top: 100px;
  left: -100px;
}
.dekiru .image2 {
  position: absolute;
  top: -170px;
  right: 0px;
}
.dekiru .image3 {
  position: absolute;
  top: 100px;
  right: -200px;
}
.dekiru .tb {
  display: none;
}
.dekiru .sp {
  display: none;
}
@media (max-width: 800px) {
  .dekiru .image1 {
    position: absolute;
    top: 200px;
    left: -150px;
    width: 640px;
  }
  .dekiru .image2 {
    position: absolute;
    top: -100px;
    right: -100px;
    width: 300px;
  }
  .dekiru .image3 {
    position: absolute;
    top: 200px;
    right: -100px;
    width: 350px;
  }
  .dekiru .tb {
    display: inline;
  }
}
@media (max-width: 500px) {
  .dekiru h2 {
    margin-top: 60px;
  }
  .dekiru h3 {
    font-size: 9pt;
  }
  .dekiru .image1 {
    position: absolute;
    top: 250px;
    left: -100px;
    width: 480px;
  }
  .dekiru .image2 {
    position: absolute;
    top: -80px;
    right: -100px;
    width: 250px;
  }
  .dekiru .image3 {
    position: absolute;
    top: 200px;
    right: -250px;
    width: 350px;
  }
  .dekiru .sp {
    display: inline;
  }
}
/* .product ///////////////////////*/
.product dl {
  display: table;
  width: 100%;
}
.product dd {
  display: table-cell;
  position: relative;
  overflow: hidden;
  vertical-align: middle;
  height: 300px;
  width: 50%;
}
.product .bg {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -320px;
}
.product .wrap {
  position: relative;
  z-index: 10;
  text-align: center;
}
.product .a2,
.product .a3 {
  margin: 0 auto;
}
.product .product2,
.product .product3 {
  color: #FFFFFF;
  /* 黒 */
  background-color: #333333;
}
.product p {
  padding: 20px;
}
@media (min-width: 1280px) {
  .product .bg {
    left: 0;
    margin-left: 0px;
    width: 100%;
  }
}
@media (max-width: 500px) {
  .product dd {
    display: table;
    width: 100%;
  }
  .product .wrap {
    display: table-cell;
    vertical-align: middle;
    height: 300px;
  }
  .product .bg {
    left: 50%;
    margin-left: -320px;
  }
}
/* .gift_store ///////////////////////*/
.gift_store dl {
  display: table;
  width: 100%;
}
.gift_store dd {
  display: table-cell;
  position: relative;
  overflow: hidden;
  vertical-align: middle;
  height: 300px;
  width: 50%;
}
.gift_store .bg {
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -320px;
}
.gift_store .wrap {
  position: relative;
  text-align: center;
  z-index: 10;
}
.gift_store .a2,
.gift_store .a3 {
  margin: 0 auto;
}
.gift_store p {
  padding: 20px;
  color: #FFFFFF;
}
@media (min-width: 1280px) {
  .gift_store .bg {
    left: 0;
    margin-left: 0px;
    width: 100%;
  }
}
@media (max-width: 500px) {
  .gift_store dd {
    display: table;
    width: 100%;
  }
  .gift_store .wrap {
    display: table-cell;
    vertical-align: middle;
    height: 300px;
  }
  .gift_store .bg {
    left: 50%;
    margin-left: -320px;
  }
}
/* .news ///////////////////////*/
.news {
  padding: 80px 0 60px 0;
}
.news header {
  text-align: center;
  padding-bottom: 30px;
}
.news dl {
  display: table;
  width: 100%;
}
.news dd {
  display: block;
  vertical-align: top;
  width: 33%;
  float: left;
  padding-bottom: 30px;
}
.news .wrap {
  width: 95%;
}
.news .image {
  overflow: hidden;
}
.news .image img {
  width: 100%;
}
.news h3 {
  font-size: 11pt;
  padding: 5px 0;
}
.news .date {
  margin-top: 10px;
  font-size: 9pt;
}
.news p {
  line-height: 160%;
}
.news .a1 {
  margin-top: 40px;
}
@media (min-width: 500px) and (max-width: 800px) {
  .news {
    padding: 60px 0 40px 0;
  }
  .news dd {
    display: block;
    clear: both;
    width: 100%;
  }
  .news .wrap {
    width: 100%;
    text-align: left;
  }
  .news .image {
    float: left;
    width: 45%;
    margin: 0 15px 10px  0;
  }
  .news .image img {
    width: 100%;
  }
  .news h3 {
    font-weight: bold;
    font-size: 12pt;
    padding: 0 0 15px 0;
  }
}
@media (max-width: 500px) {
  .news {
    padding: 40px 0 30px 0;
  }
  .news dd {
    display: block;
    margin: 0 auto;
    width: 100%;
  }
  .news .wrap {
    width: 100%;
  }
  .news .image img {
    width: 100%;
  }
  .news .a1 {
    margin: 20px auto;
  }
}


/* .kids ///////////////////////*/
.kids{
color: #FFFFFF;
background-color: #333333;
overflow: hidden;
position:relative;
height:300px;
}
.kids header{
position:absolute;
top:0;
left:0;
background:url("../../image/kids_frame.png") no-repeat 0 0;
background-size:100% 100%;
text-align:center;
width:100%;
height:300px;
}
.kids h3{
margin:80px 0 20px 0;
}
.kids .a3{
margin:20px auto 0 auto;
}
.kids .new{
position:absolute;
top:0;
left:0;
}

.kids .bg{
-webkit-transition: opacity .5s, -webkit-transform .5s;
transition: opacity .5s, transform .5s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;

position:absolute;
left:50%;
margin-left:-490px;
}

.kids:hover .bg{
opacity: 0.3;
-webkit-transform: scale3d(1.1,1.1,1);
transform: scale3d(1.1,1.1,1);
}

.dotted{
border-top:1px #333333 dotted;
margin:0 0 60px 0;
}

@media (max-width: 800px) {
.kids header{
background:url("../../image/kids_frame2.png") no-repeat 0 0;
background-size:100% 100%;
}
}

@media (max-width: 500px) {
.kids header{
background:url("../../image/kids_frame3.png") no-repeat 0 0;
background-size:100% 100%;
}
}



/* .girido_banner ///////////////////////*/
.girido_banner{
color: #FFFFFF;
background-color: #FFFFFF;
overflow: hidden;
position:relative;
height:300px;
margin-bottom:40px;
}

.girido_banner header{
position:absolute;
top:0;
left:0;
background:url("../../image/kids_frame.png") no-repeat 0 0;
background-size:100% 100%;
text-align:left;
width:100%;
height:300px;
border:5px #FF0000 sloid;
}

.girido_banner header img{
position:absolute;
top:50px;
left:20%;
}

.girido_banner .new{
position:absolute;
top:0;
left:0;
}

.girido_banner .bg{
-webkit-transition: opacity .5s, -webkit-transform .5s;
transition: opacity .5s, transform .5s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
position:absolute;
left:50%;
margin-left:-490px;
}

.girido_banner:hover .bg{
opacity: 0.3;
-webkit-transform: scale3d(1.1,1.1,1);
transform: scale3d(1.1,1.1,1);
}


@media (max-width: 700px) {
.girido_banner header img{
position:absolute;
top:120px;
left:10%;
width:75%;
}
.girido_banner .bg{
left:50%;
margin-left:-590px;
}
}


@media (max-width: 800px) {
.girido_banner header{
background:url("../../image/kids_frame2.png") no-repeat 0 0;
background-size:100% 100%;
}
}

@media (max-width: 500px) {
.girido_banner header{
background:url("../../image/kids_frame3.png") no-repeat 0 0;
background-size:100% 100%;
}
}



/* .movie ///////////////////////*/
.movie{background: url(../../image/movie_bg.jpg) no-repeat center top;background-size: cover;height: auto!important;}
.movie a {display: block;}
.movie header{position: relative;height: 332px;}
#index-youtube{
	position: relative;
	display: block;
	width: 100%;
	padding: 20px 0;
	background-color: rgba(255,255,255,0.4);
	text-align: center;
	z-index: 11;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}
#index-youtube img{display: block;max-width: 100%;margin: 0 auto;}
#index-youtube:hover{background-color: rgba(255,255,255,1);}
@media (max-width: 800px){
.movie header {
	height: 232px;
}
}
@media (max-width: 500px){
.movie header {
	height: 155px;
}
}



/* .girido ///////////////////////*/
.girido{
text-align:center;
margin-bottom:50px;
width:100%;
}

.girido img{ 
width:100%;
height:auto;
}

.girido a {
opacity:1;
transition: all 0.75s cubic-bezier(0.19, 1, 0.22, 1);
}

.girido a:hover{
opacity: 0.5;
}

@media (max-width: 800px) { 

.girido{ margin-bottom:30px; }

}
