@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	outline: 0;
	font-size: 1em;
}

/*@media only screen and (max-width: 960px) {
    img { max-width: 100%; }
}
*/
.main{max-width:700px;
margin:0 auto;
text-align:center;}
  body {
	  margin: 0px;
	  padding:0px;
	  color:#715235;
	font-size:1.2rem;
	line-height:2;
	font-family: 'Noto Sans JP', sans-serif;
  }


.backcolor{
		background-color:#f9f1ec;
}



.sect02{
		padding:0px;
		max-width:700px;
		margin:0 auto;
		text-align:center;
}
.sect02 div {
	
}
.sect02 p {
	margin: 40px 0;
	text-align: center;
}

span {
	position: absolute;
	top: 0;
	width: 24px;
	height: 24px;
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
	transform: rotate(-45deg);
	animation: sdb 2s infinite;
	opacity: 0;
	box-sizing: border-box;
}
 span:nth-of-type(1) {
	animation-delay: 0s;
}
span:nth-of-type(2) {
	top: 16px;
	animation-delay: .15s;
}
span:nth-of-type(3) {
	top: 32px;
	animation-delay: .3s;
}

@keyframes sdb {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

/*------------------------------------------------------------------------------
 new item
------------------------------------------------------------------------------*/

#disney, #babygoods, #babygift, #newborn{
	max-width:700px;
	color:#715235;
	font-size:1.2rem;
	line-height:2;
	font-family: 'Noto Sans JP', sans-serif;
	 }
	#mainAll{
		position:relative;}
		
	#icon{
		width:60px;
	height:60px;
	background-color:#715235;
	border-radius:50%;
	 margin: 0 auto;
    text-align: center;
	 position:fixed;
	 bottom:70px;
	 right:0px;
	 z-index:9999;
	 font-size:.9rem;
	 line-height:60px;
	 font-weight:700;
	 }
	 .icon{color:#fff;}

#goods{
	background-color:#e7e2e8;}
#goods2{
	background-color:#fff;}
#goods3{
	background-color:#e0ecf2;}
.ttlp{
	/*width:100%;
	margin:0 auto;
	text-align:center;*/
	padding:50px 0;}
.ttl{
	width:130px;
	height:130px;
	background-color:#715235;
	border-radius:50%;
	 margin: 0 auto;
    text-align: center;
	 position: relative;
	}
	.ttl p{ 
	line-height:1.5;
	position: absolute;
	color:#fff;
    top: 15%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);/**/
		}

.topImg, .intro{position:relative;}
	
.imgft{
	position:absolute;
	bottom:0;}
.box{
	position:absolute;
	top:-50px;
	right:0;
	width:200px;
	}
.box2{position:absolute;
	top:0px;
	right:0;
	width:200px;}
.text{
	padding: 30px 50px;}
.text p{
	text-align:left;
	font-weight:500;}
	
#container{
	display:flex;
	flex-wrap: wrap;
    align-items: center;
	padding:50px 5%;	
	}
.item{
	width:45%;
	padding:0 2.5%;
 
	}	
.item p{
	display: inline-block;
	text-align:left;}
.item2{
	width:50%;}	

.btn{
	padding:10px 30px;
	font-weight: 700;
	user-select: none;
	color:#715235;
	}
a{ text-decoration:none; color:#715235;}	

a.btn-border {
  border: 2px solid #715235;
  border-radius: 0;
  background: #fff;
}

a.btn-border:hover {
  color: #fff;
  background: #715235;
}

.way1,.way2{
	position:absolute;
	width:50%;
	top:0;}
.way2{
	right:0;}
.way1{
	left:0;}
.waytl_1{
	font-size:2rem;
	font-weight:700;
	position:absolute;
	left:5px;
	top:-30px;}
	
.wayImg{
	position:absolute;
	top:-20px;
	width:80%;
	left:10%;
	right:10%;}
	
.wayTx{
	position:absolute;
	bottom:-480px;
	width:70%;
	lleft:10%;
	right:20%;
	}
	
.wayTx2{
	position:absolute;
	width:70%;
	right:10%;
	left:20%;
	top:30px;}
		
.wayImg2{
	position:absolute;
	top:210px;
	width:80%;
	left:10%;
	right:10%;}
	
.waytl_2{
	font-size:2rem;
	font-weight:700;
	position:absolute;
	left:0;
	top:370px;
	}
.mainImg2{
	width:80%;
	right:20%;}
.imgs{
	position:absolute;
	top:0;
	right:0;
	transform:rotate(45deg);
	}
.imgs2{
	position:absolute;
	top:30%;
	right:15%;
	
	}
	.item1{width:25%;}	
	.item3{width:60%;}
	.item4{width:40%;}
	.item4 p{
	display: inline-block;
	text-align:left;}
	
	#container2{
		padding:0px 20px;
		display:flex;
	flex-wrap: wrap;
    align-items: center;
		}
	
	.intro3{
		width:80%;
		position:relative;
		padding:10%;
		}
	.mgif{
		border-radius:80px;}
	.imgs3{
		position:absolute;
		top:0;
		left:0;}
	.imgs4{position:absolute;
		top:20%;
		right:30%;
		}	
	.intro3_text{
		position:absolute;
		width:35%;
		right:5%;
		top:45%
		}
	.introImg2{width:65%;}
	.intro3_text p{text-align:left;}
	
	.itemImg2{
		width:100%;
		margin:0 auto;
		text-align:center;}
		
	.btn2{padding-bottom:50px;}
	.btn3{padding:50px 0px;}
	.cril{
		border-radius:80px;}

     h1{
		 font-size:2rem;}


.imgft2{
	margin-top:-10px;;
	}
	.imgft3{
		bottom:0px;}	



/*------------------------------------------------------------------------------
  anim
------------------------------------------------------------------------------*/

.scrollanime {
	opacity: 0;
}

.scrollanime2 {
	opacity: 0;
}


.fadeInDown {
	animation-name: fadeInDown;
	animation-duration: 1s;   /*フェード時間*/
	animation-fill-mode: forwards;   /*アニメーション後そのまま*/
}
@keyframes fadeInDown {
	0% {
		opacity: 0;			
	}
	100% {
	opacity: 1;
	transform: translate(0);
	}
}

.fadeInDown2 {
	animation-name: fadeInDown;
	animation-duration: 3s;   /*フェード時間*/
	animation-fill-mode: forwards;   /*アニメーション後そのまま*/
}
@keyframes fadeInDown2 {
	0% {
		opacity: 0;			
	}
	100% {
	opacity: 1;
	transform: translate(0);
	}
}

.fadeInDown3 {
	animation-name: fadeInDown;
	animation-duration: 1.5s;   /*フェード時間*/
	animation-fill-mode: forwards;   /*アニメーション後そのまま*/
}
@keyframes fadeInDown2 {
	0% {
		opacity: 0;			
	}
	100% {
	opacity: 1;
	transform: translate(0);
	}
}


.updown {
	transform: translateY(-50px);
}
.downup {
	transform: translateY(25px);
}

.sect02{
	overflow: hidden;    /*スクロールバー非表示*/
}
.slide-right {
	transform: translateX(80px);
}
.slide-left {
	transform: translateX(-80px);
}







  /*スライダー*/



.wrap {
  	width: 1200%;
  overflow: hidden;
  display: flex;
  align-items: center;
}

button {
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  outline: none;
  border-radius: 0;
}

.slideshow {
  display: flex;
  -webkit-animation: loop-slide 25s infinite linear 1s both;
  animation: loop-slide 20s infinite linear 1s both;
}


@-webkit-keyframes loop-slide {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}

@keyframes loop-slide {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}
 
  .slideshow {
  	width: 1200%;
    display: flex;
    -webkit-animation: loop-slide 40s infinite linear 1s both;
    animation: loop-slide 40s infinite linear 1s both;
  }

  .slide-paused:active .slideshow {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
/*
.slide-paused:hover .slideshow {
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}
*/
/*
 .content {
  }
  
  .content-hover {
    transition: all 0.2s;
    margin-right: 20px;
  }

  .content-hover:active {
    transform: translateY(-20px);
    border-radius: 0 10%;
    box-shadow: 0 3px 10px 0 #333;
    opacity: 0.8;
    cursor: pointer;
  }*/
}




/*------------------------------------------------------------
	フッター
------------------------------------------------------------*/
#gFooter .fLinkList li a {
    padding: 29px;
    display: block;
    color: #666;
    font-size: 2.9rem;
    font-weight: 700;
    text-align: center;
    background-color: #e2e2e2;
}
#gFooter .fLinkList li a:hover {
    opacity: 0.7;
}
#gFooter address {
    padding: 35px 5px 56px;
    color: #666;
    font-size: 1rem;
    font-weight: 400;
    font-style: normal;
    text-align: center;
    font-family: "Helvetica Neue" , Helvetica , Arial , sans-serif;
    background-color: #D9D9D9;
}
@media all and (max-width: 749px) {
    #gFooter .fLinkList li a {
        padding: 13px;
        font-size: 1.5rem;
    }
    #gFooter address {
        padding: 18px 5px 28px;
        font-size: 0.7rem;
    }
}
@media screen and (max-width: 749px) {
	.main{
		width:100vw;}
	.sect02{max-width:100vw;}
	
	#disney, #babygoods, #babygift, #newborn{
	max-width:100vw;
	color:#715235;
	font-size:1.2rem;
	line-height:2;
	font-family: 'Noto Sans JP', sans-serif;
	 }
	
.box, .box2{
	width:150px;	
	}
.box2{top:-5%;}
.text{
	padding: 5px 30px;}
.wayTx{
	bottom:-300px;
	width:70%;
	lleft:10%;
	right:20%;
	}

.wayImg2{
	top:150px;
	}
.wayImg2 img{
	width:150px;}
.wayImg img{
	width:150px;}
.waytl_2{
	top:280px;}
.wayTx, .wayTx2{
	line-height:1.8;
	font-size:.8rem;}
	
.introImg2{width:100%;}
.imgs4{right:0;width:15%;}	
.imgs{width:30%;}
.imgs3{width:35%;}
.intro3_text{
	width:40%;top:55%;
	font-size:.8rem;
}	

.item p{
font-size:.8rem;
	}
.item4 p{font-size:.8rem;}
}