@charset "UTF-8";

body {
	magin: 0!important;
	padding: 0!important;
}

a img {
  transition: 0.3s;
}

a img:hover {
  opacity: 0.7;
}

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

.colorRed {
  color: #d70000;
}

ul {
  padding-left: 0;
}

ul li {
  list-style: none;
}

.header {
  position: relative;
}


.px-0 {
  padding-left: 0;
  padding-right: 0;
}

a {
  text-decoration-color:yellow;
}

.moveWrapContainer {
  position: relative;
}

.toPolicy1.pc{
	position: absolute;
	bottom: 13.3%;
	left: 17%;
	font-size: 1.4vw;
}
.toPolicy2.pc{
	position: absolute;
	bottom: 13.3%;
	right: 17%;
	font-size: 1.4vw;
}
.toPolicy3.pc{
	position: absolute;
	bottom: 10%;
	left: 17%;
	font-size: 1.4vw;
}
.toPolicy4.pc{
	position: absolute;
	bottom: 10%;
	left: 36.5%;
	font-size: 1.4vw;
}
.toShopping1.pc{
	width: 30%;
	position: absolute;
	bottom:5%;
	left:15%;
}
.toShopping2.pc{
	width: 30%;
	position: absolute;
	bottom:5%;
	right:15%;
}
.toShopping3.pc{
	width: 30%;
	position: absolute;
	bottom:2%;
	left:15%;
}
.pict1.pc{
	position: absolute;
	width: 35%;
	bottom: 55%;
	right: 13%;
}
.pict2.pc{
	position: absolute;
	width: 35%;
	bottom: 52%;
	left: 12%;
}
.touketsuke{
	width: 45%;
	position: absolute;
	bottom:14%;
	left:27%;
}
.pagelink1{
	position: absolute;
	width: 27%;
	bottom: 8%;
	left: 22%;
}
.pagelink2{
	position: absolute;
	width: 27%;
	bottom: 8%;
	right: 22%;
}
.toPolicy10.pc{
	position: absolute;
	bottom: 10%;
	left: 17%;
	font-size: 1.4vw;
}
.toShopping10.pc{
	width: 30%;
	position: absolute;
	bottom:1%;
	left:15%;
}

.toTopBtn{
	width: 30%;
	position: absolute;
	bottom:20%;
	left:34.5%;
}
p#toTop {
	display: none;
	position: fixed;
	bottom: 10px;
	right: 2%;
	z-index: 50;
	width: 8%;
}
#toTop img{
	width: 100%;
}
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}

.wrapper {
/*	background-color: #0f2cb9;
	background-color: #002cc3; */
}

 .main-bl {
/*	background-image: url('https://nobi-kids.jp/wp-content/themes/nobinobinokichi/images/bluelock/goods/bluelock_goods_bg_pc.jpg');
    position: relative;
    background-size: cover; / *-- 背景画像のサイズ-- * /
    background-size: 100% auto; / *-- 背景画像のサイズ-- * /
    background-attachment: fixed; / * --背景画像の固定-- * /
    background-repeat: no-repeat; / * --背景画像の繰り返し-- * /
    background-position: top center; / * --背景画像の位置-- * /
	z-index: 2; */
    padding: 2rem 0;
	margin: 0;
/*	width: 100%; */
} 

.main-bl::before {
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	z-index:-1;
	width: 100%;
	height:100vh;
	background-repeat:no-repeat;
	background-position:50% 100%;
	background-image:url(https://nobi-kids.jp/wp-content/themes/nobinobinokichi/images/bluelock/goods/bluelock_goods_bg_pc.jpg);
	background-size:cover;
}

.main-inner {
	width: 70%;
	margin: 0 auto;
	background-color: #fff;
	border-radius: 20px;
	padding: 1rem;
}

.content-bl {
	display: flex;
	flex-wrap: wrap;
}

.column-bl {
	width: 50%;
}

.column-bl_bottom {
	width: 100%;
}

section.qa-bl {
	border-radius: 20px;
	width: 90%;
	margin: 1rem auto 2rem;
	font-size: 135%;
	line-height: 3rem;
}

section.qa-bl p {
	margin: 0!important;
}

h2.qa-title {
	background-color: #0a205c;
	color: #fff;
	padding: 2.5rem 0;
	text-align: center;
	margin: 0;
	font-size: 2.75rem;
	font-weight: bold;
}

h2.qa-title span::before {
/*	display: block;
	content: url(https://nobi-kids.jp/wp-content/themes/nobinobinokichi/images/bluelock/goods/bluelock_goods_qa_icon.png);
	width: 3rem; */
	content: '';
	display: inline-block;
	width: 4rem;
	height: 4rem;
	background-image: url(https://nobi-kids.jp/wp-content/themes/nobinobinokichi/images/bluelock/goods/bluelock_goods_qa_icon.png);
	background-size: contain;
	vertical-align: middle;
	margin-right: 1.25rem;
}

/* .qa-question,
.qa-answer {
	padding: 2rem;
	display: flex;
} */

.qa-icon {
	margin-right: 1rem;
}

.qa-set {
  border-bottom: solid 2px #fff;
}

.qa-question {
	background-color: #f2f2f2;
	display: flex;
	width: 100%;
	margin: 0;
	cursor: pointer;
	padding: 1rem 1.4rem;
}

.qa-question-main {
  width: calc(100% - 4rem);
}

.qa-icon-oc {
  width: 4rem;
  position: relative;
}
/* .qa-icon-oc::before, */
.qa-icon-oc::after {
/*  content: " ";
  background-color: #0a205c; */
  width: 1.6rem;
  height: 1px;
/*  top: 1.3rem; */
  top: 25%;
  right: 0;
  position: absolute;
  display: block;
  transition: 0.3s;
  content: url(https://nobi-kids.jp/wp-content/themes/nobinobinokichi/images/bluelock/goods/bluelock_goods_qa_open.png);
}

.qa-answer {
	display: flex;
	transition: 0.3s;
  overflow: hidden;
  height: 0;
  opacity: 0;
  visibility: hidden;
  background-color: #fff;
  padding-right: 1.4rem;
  padding-left: 1.4rem;
}

.qa-input {
  display: none;
}
/*.qa-input:checked + .qa-question .qa-icon-oc::before {
   -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
} */
.qa-input:checked + .qa-question .qa-icon-oc::after {
/*  -webkit-transform: rotate(130deg);
          transform: rotate(130deg); */
	content: url(https://nobi-kids.jp/wp-content/themes/nobinobinokichi/images/bluelock/goods/bluelock_goods_qa_close.png);
	top: 0;
}
.qa-input:checked + .qa-question + .qa-answer {
  height: auto;
  opacity: 1;
  visibility: visible;
  padding-top: 1rem;
  padding-bottom: 1rem;
}


.footer-bl {
	width: 100%;
	background-color: #fff;
}

.footer-bl .content-bl {
	width: 85%;
    margin: 0 auto;
    padding: 1rem 0;
}

.copyright-bl {
	margin: 0!important;
	padding: 1rem 0;
	background-color: #002cc3; 
}

@media screen and (max-width: 767px) {
	.main-bl::before {
		background-image: url('https://nobi-kids.jp/wp-content/themes/nobinobinokichi/images/bluelock/goods/bluelock_goods_bg_sp.jpg');
	}

	.main-inner {
		width: 90%;
		border-radius: 10px;
	}
	.column-bl {
		width: 100%;
	}

	section.qa-bl {
		border-radius: 10px;
		width: 100%;
		margin: 1rem auto 2rem;
		font-size: 110%;
	}
	
	h2.qa-title {
		padding: 1.5rem 0;
		font-size: 2.15rem;
	}

	h2.qa-title span::before {
		width: 3rem;
		height: 3rem;
		margin-right: 1.0rem;
	}


	.footer-bl .content-bl {
		width: 100%;
	}


	
	  .pc {
		display: none !important;
	  }
	  .sp {
		display: block !important;
	  }

	.toTopBtn{
		width: 75%;
		position: absolute;
		bottom: 23%;
		left:13%;
		}
	p#toTop {
		width: 110px;
		}
	small {
		font-size: 50%;
		}
	
	.toPolicy1.sp{
		position: absolute;
		bottom: 12%;
		left: 29%;
		font-size: 2.5vw;
		}
	.toPolicy2.sp{
		position: absolute;
		bottom: 12.8%;
		left: 29%;
		font-size: 2.5vw;
		}
	.toPolicy3.sp{
		position: absolute;
		bottom: 12%;
		left: 29%;
		font-size: 2.5vw;
		}
	.toPolicy4.sp{
		position: absolute;
		bottom: 8%;
		left: 29%;
		font-size: 2.5vw;
		}
	.toPolicy5.sp{
		position: absolute;
		bottom: 11.3%;
		left: 27%;
		font-size: 2.5vw;
		}
	.toShopping1.sp{
		width: 60%;
		position: absolute;
		bottom:4%;
		left:22%;
		}
	.toShopping2.sp{
		width: 60%;
		position: absolute;
		bottom:4.5%;
		left:22%;
		}
	.toShopping3.sp{
		width: 60%;
		position: absolute;
		bottom:3.8%;
		left:22%;
		}
	.toShopping4.sp{
		width: 60%;
		position: absolute;
		bottom:0%;
		left:22%;
		}
	.toShopping5.sp{
		width: 60%;
		position: absolute;
		bottom:4%;
		left:22%;
		}
	.pict1.sp{
		position: absolute;
		width: 66%;
		bottom: 54%;
		right: 16%;
		}
		.touketsuke{
		width: 65%;
		position: absolute;
		bottom:10.5%;
		left:19%;
		}
	.pagelink1{
		position: absolute;
		width: 47%;
		bottom: 7%;
		left: 2%;
		}
	.pagelink2{
		position: absolute;
		width: 47%;
		bottom: 7%;
		right: 2%;
		}
	.toPolicy10.sp{
		position: absolute;
		bottom: 12%;
		left: 27%;
		font-size: 2.5vw;
		}
	.toShopping10.sp{
		width: 60%;
		position: absolute;
		bottom:4%;
		left:22%;
		}
	.toPolicy11.sp{
		position: absolute;
		bottom: 14%;
		left: 27%;
		font-size: 2.5vw;
		}
	.toShopping11.sp{
		width: 60%;
		position: absolute;
		bottom:6%;
		left:22%;
		}
		.toPolicy12.sp{
		position: absolute;
		bottom: 11%;
		left: 27%;
		font-size: 2.5vw;
		}
	.toPolicy13.sp{
		position: absolute;
		bottom: 15%;
		left: 27%;
		font-size: 2.5vw;
		}
	.toShopping12.sp{
		width: 60%;
		position: absolute;
		bottom:6.5%;
		left:22%;
		}
}
@media screen and (max-width: 414px) {

	#toTop img{
		width: 65%;
	}
	p#toTop {
	  display: none;
	  position: fixed;
	  bottom: 10px;
	  right: 0%;
	}
	.toPolicy{
		bottom: 18%;
		left: 43%;
		font-size:9px;
	}
	p#toTop {
		width: 80px;
	  }
}