html{
	overflow: hidden;
	width: 100vw;
	height: 100%;
}

img{
	max-width: 100vw;
	width: 100%;
}

body{
	margin: 0;
	overflow: hidden;
}

p{
	width: 100%;
	-webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
    -moz-margin-before: 0em;
    -moz-margin-after: 0em;
    -moz-margin-start: 0px;
    -moz-margin-end: 0px;
    -moz-padding-start: 0px;
    -ms-margin-before: 0em;
    -ms-margin-after: 0em;
    -ms-margin-start: 0px;
    -ms-margin-end: 0px;
    -ms-padding-start: 0px;
    -o-margin-before: 0em;
    -o-margin-after: 0em;
    -o-margin-start: 0px;
    -o-margin-end: 0px;
    -o-padding-start: 0px;
    margin:0;
    padding: 0;
    margin-before: 0em;
    margin-after: 0em;
    margin-start: 0px;
    margin-end: 0px;
    padding-start: 0px;
}

ul{
	-webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
    -moz-margin-before: 0em;
    -moz-margin-after: 0em;
    -moz-margin-start: 0px;
    -moz-margin-end: 0px;
    -moz-padding-start: 0px;
    -ms-margin-before: 0em;
    -ms-margin-after: 0em;
    -ms-margin-start: 0px;
    -ms-margin-end: 0px;
    -ms-padding-start: 0px;
    -o-margin-before: 0em;
    -o-margin-after: 0em;
    -o-margin-start: 0px;
    -o-margin-end: 0px;
    -o-padding-start: 0px;
    margin:0;
    padding: 0;
    margin-before: 0em;
    margin-after: 0em;
    margin-start: 0px;
    margin-end: 0px;
    padding-start: 0px;
}

img[src$=".svg"] {
    width: 100%;
}

#wrapper{
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	background-image: url(../images/bg.png);
	font-family: "Rounded Mplus 1c";
}

.flex{
	display: flex;
	justify-content: space-around;
	list-style: none;
}

.column{
	flex-direction: column;
}

.flex-start{
	justify-content: flex-start;
}

.relative{
	position: relative;
	width: 100%;
}

.absolute{
	position: absolute;
}

.melonbooks img{
	width: 10vw;
	min-width: 200px;
}

.melonbooks{
	text-align: center;
}

.lazyload, .lazyloading {
    opacity: 0;
}

.lazyloaded {
    opacity: 1;
    transition: opacity 500ms;
}

.bg-white{
	background: #fff;
}

.credit{
	font-size: 2vh;
	font-weight: 700;
}
/*メディアクエリ最小*/

.pc{
	display: none;
}

.phone{
	display: block;
}

#r-18{
	position: fixed;
	width: 100vw;
	height: 100vh;
	background: #fff;
	z-index: 999;
}

#comments{
	position: absolute;
	z-index: -99;
	opacity: 0;
}

.phone-menu{
	width: 100vw;
	height: 17vw;
	background: #ffcee2;
	z-index: 99;
	position: fixed;
	bottom: 0;
	display: flex;
	list-style: none;
	justify-content: space-around;
}

.phone-menu a{
	margin-top: .8%;
}

.phone-menu-list{
	width: 15vw;
	height: 15vw;
	margin-top: 1.3%;
	background: #fff;
	border-radius: 1vw;
}

.hide {
	display: none;
}

.tab{
	overflow:hidden;
	width: 100vw;
}

.tab li{
	transition-duration: .5s;
	animation-duration: 0.5s;
	transition-timing-function: lenear;
	cursor: pointer;
	position: relative;
	z-index: 1;
	width: 16vw;
	height: 4vw;
	margin-top: 2.5vh;
}

.tab li .letter{
	fill: #4c8dcb;
	transition-duration: 0.3s;
	transition-timing-function: lenear;
}

.tab li:hover .letter{
	fill:#ff0000;
}

.tab li.select{
	z-index: 5;
}

.tab li.select .letter{
	fill: #e4007f;
}

.content{
}

.content li{
	transition-duration: .5s;
	animation-duration: 0.5s;
}


#container{
	position: relative;
	width: 100vw;
	height: calc(100% - 17vw);
	top: 0;
	overflow-y: auto;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}

li.contents{
}

.contents-01{
}

.top{
	background:url(../images/header-bg.svg);
	background-size: cover;
}

.top .flex{
	flex-wrap: wrap;
}

.contents-01 li{
}

.header-01{
	width:100%;
}
.header-02{
	width:100%;
	position: relative;
	top: -18vh;
	text-align: center;
}
.header-img01{
	width: 100%;
}

.header-img02{
}

img[src$=".svg"].header-img03{
	width: 30%;
	margin: auto;
}

.contents-02{

}

.companys{

}

.company-header{
	padding: 2vw 0 0 0;
	text-align: center;
}

.company-header img[src$=".svg"]{
	width: 80vw;
	max-width: 1000px;
}

.companys .flex{
	flex-wrap: wrap;
	width: 100vw;
	max-width: 1300px;
	margin: 0 auto;
}

.contents-02 .col{
	max-width: 200px;
	max-height: 80px;
	width: 40%;
	margin: 2vh 2.5vh;
}

.contents-02 .col img{
	width: 100%;
	max-width: 200px;
}

.contents-02 .col a{
	display: flex;
	flex-direction: column;
	text-align: center;
	text-decoration: none;
	color: #00479d;
}

.contents-02 .col a:hover{
	opacity: 0.7;
}

.contents-02 .col span{
	font-size: 21px;
	font-weight: 500;
}

#link{
	font-size: 21px;
	color: #eb6d91;
	max-width: 1500px;
	width: 95vw;
	padding: 0 0 15vh 0; 
	margin: 0 auto;
}

#link .flex{
	flex-wrap: wrap;
	margin: auto;
}

#link-info{
	background: #fff;
	border-radius: 10px;
	border: 5px solid #f4b3c2;
	padding: 0 2.5vw;
	text-align: center;
}

.link{
	max-width: 90vw;
	margin: auto;
	overflow-x: auto;
}

.link span{
	background: rgba(0, 0, 255, 0.5);
	color: #fff;
}

.banner200{
	max-width: 300px;
	width: 100%;
}

.banner200 img{
	width: 100%;
	max-width: 200px;
	margin: auto;
}

.banner200 p{
	overflow-x: scroll;
}

.banner700{
	max-width: 90vw;
	width: 700px;
}

.banner700 p{
	overflow-x: scroll;
}

.banner700 img{
	max-width: 90vw;
	width: 100%;
	margin: auto;
}

.contents-03{
}

.anchor{
	width: 80vw;
	margin: 3vw;
}

.goods-anchor svg{
	width: 100%;
}

.goods-anchor svg:hover .goods-header{
	fill: #00FE61;
}

.phone-stand,.b2-tapestry,.b4-deskmat,.goods-gacha,.shikishi{
	margin: 5vh auto 0 auto;
}

.re-right{
	right: 0;
	width: 20vw;
	padding-top: 2vh;
	margin-left: 75%;
}

.flex-wrap{
	width: 100%;
	flex-wrap: wrap;
	margin: auto;
}

.goods-wrap-flex{
	width: 90vw;
	flex-wrap: wrap;
	margin: auto;
}

.goods-contents.flex,.goods-contents{
	width: 25vw;
	height: auto;
	position: relative;
	margin: auto;
	padding: 2vh 0 2vh 0;
}

.goods-contents.flex img{
	max-width: 100%;
	max-height: 100%;
	margin-bottom: 1vh; 
}

.goods-gacha .goods-contents img{
	width: 100%;
}

.bottom{
	position: absolute;
	bottom: 0;
}

.left{
	position: absolute;
	left: 0;
}

.right{
	position: absolute;
	right: 0;
}

img.limited{
	position: absolute;
	top: 10%;
	right: -5%;
	width: 25%;
}

.goods-wrap{
	flex-wrap: wrap;
}

.goods-wrap-flex{
	width: 90vw;
}

img[src$=".svg"].middle{
	position: absolute;
	top: 0;
	width: 100%;
}

.phone-stand .goods-contents{
	width: 17vw;
}

.phone-stand .goods-info{
	width: 45vw;
}

.goods-contents.stand-info{
	position: relative;
	width: 100%;
}

img[src$=".svg"].stand-info-contents{
	width: 50%;
	height: 100%;
}

.goods-info img{
	width: 45vw;
}

.shikishi .goods-contents{
	width: 17vw;
}

.shikishi .goods-contents.shikishi-info{
	width: 35vw;
	position: relative;
}

.shikishi-info .shikishi-info-contents{
	position: absolute;
}

.goods-gacha .flex{
	width: 85vw;
}

.goods-gacha .goods-contents{
	width: 14vw;
}

.goods-gacha .goods-contents img[src$=".svg"]{
	max-width: none;
}

.goods-gacha .goods-contents.goods-gacha-info{
	width: 90vw;
}

.wakuwaku{
	background: #ffdb90;
}

.dokidoki{
	background: #ffbecd;
}

.kirakira{
	background: #d7f1ff;
}

.flex.goods-wrap-flex.kirakira-wrap{
	width: 71vw;
}

.goods-gacha .radius{
	border-radius: 30px;
	width: 90vw;
	margin: auto;
}

.opacity0{
	opacity: 0;
	z-index: -99;
}

.swiper-container {
    width: 95vw;
    height: auto;
}

.swiper-container img{
    width: 100%;
}

.table-header a{
	text-decoration: none;
}

.goods-list{
	box-sizing: border-box;
	padding: 1vw 3vw;
	background: #4c8dcb;
	border-radius: 30px;
	border: solid 2px #4c8dcb;
	color: #fff;
	font-size: 2.5vh;
	margin: 2vw;
	display: inline-block;
	font-weight: 900;
	transition-duration: 0.3s;
}

.table{
	margin-bottom: 3vw;
}

.table table{
	border-collapse: collapse;
	font-size: 1.3vw;
	margin: auto;
}

.table td{
	border: 1px #ee87b4 solid;
	background: rgba(255,255,255,.55);
	padding: 0.5vw;
	font-weight: 500;
	vertical-align: top;
}

.table th{
	border: 1px #fff solid;
	background: #ee87b4;
	color: #fff;
	padding: 0.5vw;
}

.table img{
	width: 10vw;
}

.table-header{
	text-align: center;
}

.table-header img{
	width: 80vw;
}


.contents-04{

}

.gacha{
	padding: 2vh 0 0 0;
}

.gacha img{
	margin: 2vh 0 0 0;
}

.gacha-wrap .flex{
	flex-wrap: wrap;
	padding-bottom: 20vw;
}

.gacha-contents{
	width: 90vw;
}

.gacha-contents img{
	width: 100%;
}

.thisisimage img[src$=".svg"]{
	width: 100%;
}

.thisisimage{
	width: 30vw;
	margin: auto;
}

.comingsoon{
	height: 50vh;
}

.contents-05{
	font-size: 2vw;
	font-weight: 800;
	margin-bottom: 0;
}

.service-contents{
	width: 80vw;
	margin: auto;
}

.service-contents p{
	color: #ff019e;
	text-shadow:0px 0px 3px #ffffff;
}

.matsumiya{
	background: #ff019e;
	border-radius: 30px;
	color: #fff;
	padding: 0 1vw;
	text-shadow: none;
}

.service-contents img{
	width: 100%;
}

.service-contents-01{
	width: 100%;
}

.service-contents-02{
	width: 100%;
}

.service-contents-03{
	width: 20%;
}

.service-contents-04{
	width: 75%;
}

.service-contents-05{
	width: 100%;
}

.service-contents-06{
	width: 100%;
}

.contents-06{
	font-size: 2.5vh;
	font-weight: 500;
	text-align: center;
	margin-bottom: 0;
}

.entry{
	margin: auto;
	width: 95vw;
	padding: 3vw 0;
}

.entry p{
	color: #54c2ff;
	text-shadow:0px 0px 3px #ffffff;
}

.map{
	width: 90vw;
}

.map-contents{
	width: 100%;
	text-align: center;
	margin: 2vw .5vw;
}

.map-contents p{
	text-align: left;
	font-size: 2.5vh;
	font-weight: 700;
	color: #ff6d90;
	margin: auto;
	width: 80%;
	text-shadow:0px 0px 3px #ffffff;
}

.osaka.map-contents p{
	color: #54c2ff;
}

.access-png{
	width: 100%;
	height: auto;
}

.access-svg{
	width: 100%;
	height: 10%;
}

.map-contents span{
}

.map-contents iframe{
	width: 90%;
	max-width: 100vw;
	margin: auto;
}

.twitter .account{
	color: #41c2ff;
	font-weight: 900;
}

.twitter span{
	background: #41c2ff;
	color: #fff;
	border-radius: 30px;
	padding: 0 3vh;
}

.twitter a{
	text-decoration: none;
}

.footer{
	text-align: center;
	font-size: 1vw;
	margin-top: 5vh;
}


@media (min-width: 1024px){

	.phone{
		display: none;
	}

	.pc{
		display: block;
	}

	#container{
		height: calc(100vh - 2.5vh - 4vw);
	}

	.header-01{
		width:60%;
	}
	.header-02{
		width:45%;
		position: absolute;
		right: 2vw;
		top: 3vh;
	}

	.companys .flex{
		flex-wrap: wrap;
		width: 100vw;
		height: auto;
		max-width: 1300px;
		margin: 0 auto;
	}

	li.contents{
		margin-bottom: 0vw;
	}

	.anchor{
		width: 40vw;
		margin: 0vw;
	}

	.gacha-wrap .flex{
		padding-bottom: 0vw;
	}

	.gacha-contents{
		width: 28vw;
	}

	.service-contents-01{
		width: 40%;
	}

	.service-contents-02{
		width: 45%;
	}

	.map-contents{
		width: 48%;
	}

	.service-contents-05{
		width: 32.4%;
	}

	.service-contents-06{
		width: 63%;
	}

	.contents-01{
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fdeff5+0,fdeff5+70,fdeff5+100&1+0,1+70,0+100 */
		background: -moz-linear-gradient(top, rgba(253,239,245,1) 0%, rgba(253,239,245,1) 70%, rgba(253,239,245,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(253,239,245,1) 0%,rgba(253,239,245,1) 70%,rgba(253,239,245,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(253,239,245,1) 0%,rgba(253,239,245,1) 70%,rgba(253,239,245,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdeff5', endColorstr='#00fdeff5',GradientType=0 ); /* IE6-9 */
	}

	.companys{
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#faddea+0,faddea+70,faddea+100&1+0,1+70,0+100 */
		background: -moz-linear-gradient(top, rgba(250,221,234,1) 0%, rgba(250,221,234,1) 70%, rgba(250,221,234,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(250,221,234,1) 0%,rgba(250,221,234,1) 70%,rgba(250,221,234,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(250,221,234,1) 0%,rgba(250,221,234,1) 70%,rgba(250,221,234,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#faddea', endColorstr='#00faddea',GradientType=0 ); /* IE6-9 */
	}

	.contents-03{
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f6c9dd+0,f6c9dd+100&1+0,0+30,0+100 */
		background: -moz-linear-gradient(top, rgba(246,201,221,1) 0%, rgba(246,201,221,0) 30%, rgba(246,201,221,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(246,201,221,1) 0%,rgba(246,201,221,0) 30%,rgba(246,201,221,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(246,201,221,1) 0%,rgba(246,201,221,0) 30%,rgba(246,201,221,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6c9dd', endColorstr='#00f6c9dd',GradientType=0 ); /* IE6-9 */
	}

	.contents-04{
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f4b4d0+0,f4b4d0+100&1+0,1+70,0+100 */
		background: -moz-linear-gradient(top, rgba(244,180,208,1) 0%, rgba(244,180,208,1) 70%, rgba(244,180,208,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(244,180,208,1) 0%,rgba(244,180,208,1) 70%,rgba(244,180,208,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(244,180,208,1) 0%,rgba(244,180,208,1) 70%,rgba(244,180,208,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4b4d0', endColorstr='#00f4b4d0',GradientType=0 ); /* IE6-9 */
	}

	.contents-05{
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f19ec2+0,f19ec2+100&1+0,0.5+10,0+50,0+100 */
		background: -moz-linear-gradient(top, rgba(241,158,194,1) 0%, rgba(241,158,194,0.5) 10%, rgba(241,158,194,0) 50%, rgba(241,158,194,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(241,158,194,1) 0%,rgba(241,158,194,0.5) 10%,rgba(241,158,194,0) 50%,rgba(241,158,194,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(241,158,194,1) 0%,rgba(241,158,194,0.5) 10%,rgba(241,158,194,0) 50%,rgba(241,158,194,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f19ec2', endColorstr='#00f19ec2',GradientType=0 ); /* IE6-9 */
	}

	.contents-06{
			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ed86b3+1,ed86b3+100&1+0,0.5+10,0+50,0+100 */
		background: -moz-linear-gradient(top, rgba(237,134,179,1) 0%, rgba(237,134,179,0.95) 1%, rgba(237,134,179,0.5) 10%, rgba(237,134,179,0) 50%, rgba(237,134,179,0) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(237,134,179,1) 0%,rgba(237,134,179,0.95) 1%,rgba(237,134,179,0.5) 10%,rgba(237,134,179,0) 50%,rgba(237,134,179,0) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(237,134,179,1) 0%,rgba(237,134,179,0.95) 1%,rgba(237,134,179,0.5) 10%,rgba(237,134,179,0) 50%,rgba(237,134,179,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed86b3', endColorstr='#00ed86b3',GradientType=0 ); /* IE6-9 */
	}

	.goods-list:hover{
		box-sizing: border-box;
		background: #fff;
		color: #4c8dcb;
		border: #4c8dcb solid 2px;
	}

}