/**なぞとき！ふしぎなグミラムネ**/
.wrapper{
	overflow: hidden;
}
#gr-main {
	position:relative;
	box-sizing:content-box;
	background: url('../img/product/gummyramune/bg_02.png') top center repeat;
	padding:0 calc(50% - 375px) 90px ;
	margin:0 auto;
	width:750px;
}
#gr-main * {
	font-family:
			'Noto Sans JP',
			sans-serif;
			font-display: swap;

}
#gr-main * img {
	width:100% !important;
}
.over {
    transition: .6s;
}
.over:hover {
    opacity: 0.7;
}

@media screen and (max-width: 768px) {
#gr-main {
	background-size:256% auto;
	padding:0 0 12%;
	width:100%;
}
}
	
#gr-header  {
	position:relative;
	width:100%;
	padding:20.26% 0 0;
	margin-bottom: 9.86%;
}
.gr-header-bg1  {
	position:absolute;
	top:0;
	left:0;
	margin-left:-10.6%;
	width:121.2%;
	height:0;
	padding-top:121.2%;
	background: url('../img/product/gummyramune/light_01.png') top center no-repeat;
	background-size:100% auto;
	mix-blend-mode: overlay;
}
.gr-header-bg2  {
	position:absolute;
	top:0;
	left:0;
	margin-left:calc(50% - 52.105vw);
	width:104.21vw;
	height:0;
	padding-top:2.76vw;
	background: url('../img/product/gummyramune/bg_01.png') bottom center no-repeat;
	background-size:100% auto;
}
@media screen and (max-width: 768px) {
	.gr-header-bg2  {
		margin-left: 0;
		width:100%;
		padding-top:7.06vw;
		background: url('../img/product/gummyramune/bg_01.png') bottom center no-repeat;
		background-size:266.8% auto;
	}
}
#gr-header h1 {
	position:relative;
	width:85.06%;
	margin-left: 7.46%;
}
#gr-header h2 {
	position:relative;
	width:94%;
	margin-top: -4.13%;
	margin-left: 4.26%;
}

#gr-01{
	position: relative;
	width: 93.86%;
	margin: 0 auto 16%;
	background-color: #FFF;
	border-radius: 20px;
	padding: 7.33% 0 5.2%;
}
.gr-01-bg{
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 0.71%;
	margin-left: 0.71%;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	border-radius: 18px;
	border: solid 10px #d961ff;
}
@media screen and (max-width: 768px) {
#gr-01{
	border-radius: 2.66vw;
}
.gr-01-bg{
	width: calc(100% - 1.33vw);
	height: calc(100% - 1.33vw);
	border-radius: 2.4vw;
	border: solid 1.33vw #d961ff;
}
}
#gr-01 h3{
	position: absolute;
	top: 0;
	left: 0;
	width: 92.04%;
	margin-top: -6.39%;
	margin-left: 3.97%;
}
#gr-01 p{
	position: relative;
	width: 89.06%;
	margin: 0 auto;
}

#gr-02{
	position: relative;
	width: 65.86%;
	margin: 0 auto 23.06%;
}
.gr-02-bg1  {
	position:absolute;
	top:0;
	left:0;
	margin-top:-36.43%;
	margin-left:-18.62%;
	width:137.24%;
	height:0;
	padding-top:137.24%;
	background: url('../img/product/gummyramune/light_01.png') top center no-repeat;
	background-size:100% auto;
	mix-blend-mode: overlay;
}
#gr-02 ul{
	position: relative;
	width: 100%;
}
#gr-02 ul li{
	font-size: 0;
	line-height: 0;
	margin-bottom: 6.47%;
}
#gr-02 ul li:last-of-type{
	margin-bottom: 0;
}

#hint{
	position: relative;
	width: 100%;
	margin-bottom: 15.33%;
}
.hint-bg-1,
.hint-bg-2 {
	position:absolute;
	top:0;
	left:0;
	width:90.4%;
	height:0;
	padding-top:90.4%;
	background: url('../img/product/gummyramune/light_01.png') top center no-repeat;
	background-size:100% auto;
	mix-blend-mode: overlay;
}
.hint-bg-1  {
	margin-top:62.53%;
	margin-left:75.6%;
}
.hint-bg-2  {
	margin-top:272.13%;
	margin-left:-58.13%;
}
.hint-main{
	position: relative;
	width: 93.86%;
	margin: 0 auto;
	padding-top: 10.26%;
	padding-bottom: 10.08%;
	background-color: #FFF;
	border-radius: 20px;
	z-index: 10;
}
.hint-main-bg{
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 0.71%;
	margin-left: 0.71%;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	border-radius: 18px;
	border: solid 10px #61b6ff;
}
@media screen and (max-width: 768px) {
	.hint-main{
		border-radius: 2.66vw;
	}
	.hint-main-bg{
		width: calc(100% - 1.33vw);
		height: calc(100% - 1.33vw);
		border-radius: 2.4vw;
		border: solid 1.33vw #61b6ff;
	}
	}
	
.hint-main h3{
	position: absolute;
	width: 68.75%;
	top: 0;
	left: 0;
	margin-top: -5.11%;
	margin-left: 15.625%;
}
.kaiwa-1{
	position: relative;
	display: flex;
}
.kaiwa-2{
	position: relative;
	display: flex;
	flex-direction: row-reverse;
}

.hk-01{
	width: 83.38%;
	margin-bottom: 5.25%;
	margin-left: 7.38%;
}
.hk-01 p:nth-of-type(1){
	width: 20.27%;
}
.hk-01 p:nth-of-type(2){
	width: 80.57%;
	margin-top: 2.04%;
	margin-left: -0.85%;
}
.hk-02{
	width: 81.25%;
	margin-bottom: 3.69%;
	margin-left: 9.375%;
}
.hk-02 p:nth-of-type(1){
	width: 22.02%;
	margin-left: -3.32%;
}
.hk-02 p:nth-of-type(2){
	width: 81.29%;
	margin-top: 2.44%;
}
.hk-03{
	width: 82.95%;
	margin-bottom: 11.22%;
	margin-left: 7.81%;
}
.hk-03 p:nth-of-type(1){
	width: 20.37%;
}
.hk-03 p:nth-of-type(2){
	width: 80.99%;
	margin-left: -1.36%;
}
.hk-04{
	width: 91.19%;
	margin-bottom: 6.67%;
	margin-left: 5.82%;
}
.hk-04 p:nth-of-type(1){
	width: 18.53%;
	margin-top: 3.11%;
	margin-left: -1.86%;
}
.hk-04 p:nth-of-type(2){
	width: 79.61%;
}
.hk-05{
	width: 84.375%;
	margin-bottom: 7.81%;
	margin-left: 6.67%;
}
.hk-05 p:nth-of-type(1){
	width: 22.55%;
	margin-top: 7.91%;
}
.hk-05 p:nth-of-type(2){
	width: 81.64%;
	margin-left: -4.37%;
}
.hk-06{
	width: 84.51%;
	margin-bottom: 8.66%;
	margin-left: 8.94%;
}
.hk-06 p:nth-of-type(1){
	width: 21.17%;
	margin-top: 5.37%;
	margin-left: -4.36%;
}
.hk-06 p:nth-of-type(2){
	width: 83.19%;
}
.hint-open1{
	position: relative;
	width: 82.67%;
	margin: 0 auto 5.96%;
}
.hint-open1 h4{
	position: relative;
	width: 99.82%;
	margin: 0 auto;
	z-index: 10;
	cursor: pointer;
}
.hint-open1-main{
	position: relative;
	display: none;
}
.hint-open1-main1{
	position: relative;
	border: solid 6px #9aff00;
	background-color: #ecffd2;
	border-radius: 15px;
	margin-top: -4.12%;
	padding: 4.93% 0 3.04%;
}
.hint-open1-main1-1{
	width: 93.88%;
	margin-bottom: 1.03%;
	margin-left: 4.81%;
}
.hint-open1-main1-1 p:nth-of-type(1){
	width: 20.29%;
	margin-top: 0.93%;
	margin-left: -3.35%;
}
.hint-open1-main1-1 p:nth-of-type(2){
	width: 83.05%;
}
.hint-open1-main1-2{
	width: 93.88%;
	margin-left: 4.81%;
}
.hint-open1-main1-2 p:nth-of-type(1){
	width: 20.29%;
	margin-left: -3.35%;
}
.hint-open1-main1-2 p:nth-of-type(2){
	width: 83.05%;
}
.hint-open1-main2{
	position: relative;
	width: 99.48%;
	margin-top: 8.93%;
	margin-bottom: 5.67%;
}
.hint-open1-main2 p:nth-of-type(1){
	position: relative;
	width: 24.69%;
}
.hint-open1-main2 p:nth-of-type(2){
	position: relative;
	width: 76.68%;
	margin-top: 0.51%;
	margin-left: -1.38%;
}
.hint-open1-main3{
	position: relative;
	width: 96.9%;
	margin-bottom: 10.99%;
	margin-left: 2.06%;
}
.hint-open1-main3 p:nth-of-type(1){
	position: relative;
	width: 23.75%;
	margin-top: 2.3%;
}
.hint-open1-main3 p:nth-of-type(2){
	position: relative;
	width: 77.83%;
	margin-left: -1.58%;
}
.hint-open1-main4{
	position: relative;
	width: 96.04%;
	margin: 0 auto 8.39%;
}
.hint-open1-main5{
	position: relative;
	width: 78.52%;
	margin-left: 7.38%;
}
.hint-open1-main5 p{
	position: relative;
	width: 76.14%;
	margin-left: 13.12%;
}
.hint-open1-main5-kangaechu{
	width: 100%;
	height: 0;
	padding-top: 15.97%;
	margin-top: -4.59%;
	background: url('../img/product/gummyramune/img_03-2.png') no-repeat;
	background-size:400% auto;
	animation: run 4s steps(4,end) infinite;
}
@keyframes run {
	to {
	  background-position:-1828px;
	}
  }
  @-webkit-keyframes run {
	to {
	  -webkit-background-position:-1828px;
	}
  }
  @media screen and (max-width: 768px) {
@keyframes run {
	to {
	  background-position:-243.73vw;
	}
  }
  @-webkit-keyframes run {
	to {
	  -webkit-background-position:-243.73vw;
	}
  }
  }
.hint-open1-main5-bg1,.hint-open1-main5-bg2,.hint-open1-main5-bg3,.hint-open1-main5-bg4,.hint-open1-main5-bg5,.hint-open1-main5-bg6{position: absolute;top: 0;left: 0;}
.hint-open1-main5-bg1{width: 13.34%; margin-top: 9.4%;margin-left: -14.87%; animation: fuwa1 1s ease-in-out infinite alternate;	-webkit-animation: fuwa1 1s ease-in-out infinite alternate; animation-duration: 1.1s; -webkit-animation-duration: 1.1s;}
.hint-open1-main5-bg1 span{	display: block; animation: fuwa2 1s ease-in-out infinite alternate; -webkit-animation: fuwa2 1s ease-in-out infinite alternate; animation-duration: 1.3s;-webkit-animation-duration: 1.3s;}
.hint-open1-main5-bg2{width: 15.97%; margin-top: -1.75%;margin-left: 17.94%; animation: fuwa1 1s ease-in-out infinite alternate;	-webkit-animation: fuwa1 1s ease-in-out infinite alternate; animation-duration: 1.5s; -webkit-animation-duration: 1.5s;}
.hint-open1-main5-bg2 span{	display: block; animation: fuwa2 1s ease-in-out infinite alternate; -webkit-animation: fuwa2 1s ease-in-out infinite alternate; animation-duration: 1.7s;-webkit-animation-duration: 1.7s;}
.hint-open1-main5-bg3{width: 17.5%; margin-top: -3.93%;margin-left: 75.27%; animation: fuwa1 1s ease-in-out infinite alternate;	-webkit-animation: fuwa1 1s ease-in-out infinite alternate; animation-duration: 1.9s; -webkit-animation-duration: 1.9s;}
.hint-open1-main5-bg3 span{	display: block; animation: fuwa2 1s ease-in-out infinite alternate; -webkit-animation: fuwa2 1s ease-in-out infinite alternate; animation-duration: 2.1s;-webkit-animation-duration: 2.1s;}
.hint-open1-main5-bg4{width: 13.34%; margin-top: 10.5%;margin-left: 106.34%; animation: fuwa1 1s ease-in-out infinite alternate;	-webkit-animation: fuwa1 1s ease-in-out infinite alternate; animation-duration: 2.3s; -webkit-animation-duration: 2.3s;}
.hint-open1-main5-bg4 span{	display: block; animation: fuwa2 1s ease-in-out infinite alternate; -webkit-animation: fuwa2 1s ease-in-out infinite alternate; animation-duration: 2.5s;-webkit-animation-duration: 2.5s;}
.hint-open1-main5-bg5{width: 17.28%; margin-top: 30.63%;margin-left: -1.96%; animation: fuwa1 1s ease-in-out infinite alternate;	-webkit-animation: fuwa1 1s ease-in-out infinite alternate; animation-duration: 2.7s; -webkit-animation-duration: 2.7s;}
.hint-open1-main5-bg5 span{	display: block; animation: fuwa2 1s ease-in-out infinite alternate; -webkit-animation: fuwa2 1s ease-in-out infinite alternate; animation-duration: 2.9s;-webkit-animation-duration: 2.9s;}
.hint-open1-main5-bg6{width: 16.84%; margin-top: 31.29%;margin-left: 91.24%; animation: fuwa1 1s ease-in-out infinite alternate;	-webkit-animation: fuwa1 1s ease-in-out infinite alternate; animation-duration: 3.1s; -webkit-animation-duration: 3.1s;}
.hint-open1-main5-bg6 span{	display: block; animation: fuwa2 1s ease-in-out infinite alternate; -webkit-animation: fuwa2 1s ease-in-out infinite alternate; animation-duration: 3.3s;-webkit-animation-duration: 3.3s;}
.hint-open2{
	position: relative;
	width: 82.67%;
	margin: 0 auto;
}
.hint-open2 h4{
	position: relative;
	width: 99.82%;
	margin: 0 auto;
	z-index: 10;
	cursor: pointer;
}
.hint-open2-main{
	position: relative;
	display: none;
}
.hint-open2-main1{
	position: relative;
	border: solid 6px #ffff00;
	background-color: #ffffd2;
	border-radius: 15px;
	margin-top: -4.12%;
	padding: 4.93% 0 3.04%;
}
.hint-open2-main1-1{
	position: relative;
	width: 96.9%;
	margin-bottom: 2.57%;
	margin-left: 2.12%;
}
.hint-open2-main1-1 p:nth-of-type(1){
	position: relative;
	width: 23.75%;
}
.hint-open2-main1-1 p:nth-of-type(2){
	position: relative;
	width: 77.83%;
	margin-top: 2.12%;
	margin-left: -1.59%;
}
.hint-open2-main1-2{
	position: relative;
	width: 96.04%;
	margin: 0 auto;
}

#kotaeawase{
	position: relative;
	width: 100%;
	margin-bottom: 15.33%;
}
.kotaeawase-bg-1 {
	position:absolute;
	top:0;
	left:0;
	width:90.4%;
	height:0;
	padding-top:90.4%;
	background: url('../img/product/gummyramune/light_01.png') top center no-repeat;
	background-size:100% auto;
	mix-blend-mode: overlay;
	margin-top:-26.8%;
	margin-left:75.46%;
}
.kotaeawase-main{
	position: relative;
	width: 93.86%;
	margin: 0 auto;
	padding-top: 10.26%;
	padding-bottom: 7.33%;
	background-color: #FFF;
	border-radius: 20px;
}
.kotaeawase-main-bg{
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 0.71%;
	margin-left: 0.71%;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	border-radius: 18px;
	border: solid 10px #ff6164;
}
@media screen and (max-width: 768px) {
	.kotaeawase-main{
		border-radius: 2.66vw;
	}
	.kotaeawase-main-bg{
		width: calc(100% - 1.33vw);
		height: calc(100% - 1.33vw);
		border-radius: 2.4vw;
		border: solid 1.33vw #ff6164;
	}
	}

.kotaeawase-main h3{
	position: absolute;
	width: 68.75%;
	top: 0;
	left: 0;
	margin-top: -5.11%;
	margin-left: 15.625%;
}
.kotaeawase-1{
	position: relative;
	width: 82.24%;
	margin-left: 9.51%;
}
.kotaeawase-1 p:nth-of-type(1){
	position: relative;
	width: 25.04%;
	margin-top: 3.79%;
	margin-left: -1.37%;
}
.kotaeawase-1 p:nth-of-type(2){
	position: relative;
	width: 76.33%;
}
.kotaeawase-2{
	position: relative;
	width: 87.78%;
	margin: -11.5% auto 1.84%;
}
.kotaeawase-3{
	position: relative;
	width: 95.59%;
	margin: 0 auto;
}
.kotaeawase-3 p{
	font-size: 0;
	line-height: 0;
}
.kotaeawase-3 p:nth-of-type(1){
	position: relative;
	width: 100%;
	padding-top: 7.12%;
}
.kotaeawase-3 p:nth-of-type(2){
	position: absolute;
	top: 0;
	left: 0;
	margin-left: 29.52%;
	width: 44.95%;
}


#programmingthinking{
	position: relative;
	width: 100%;
}
.programmingthinking-bg-1,
.programmingthinking-bg-2,
.programmingthinking-bg-3 {
	position:absolute;
	top:0;
	left:0;
	width:90.4%;
	height:0;
	padding-top:90.4%;
	background: url('../img/product/gummyramune/light_01.png') top center no-repeat;
	background-size:100% auto;
	mix-blend-mode: overlay;
}
.programmingthinking-bg-1  {
	margin-top:48.26%;
	margin-left:-58.13%;
}
.programmingthinking-bg-2  {
	margin-top:202.4%;
	margin-left:75.46%;
}
.programmingthinking-bg-3  {
	margin-top:377.6%;
	margin-left:-58.13%;
}
.programmingthinking-main{
	position: relative;
	width: 93.86%;
	margin: 0 auto;
	padding-top: 12.66%;
	padding-bottom: 5.33%;
	background-color: #FFF;
	border-radius: 20px;
	z-index: 10;
}
.programmingthinking-main-bg{
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 0.71%;
	margin-left: 0.71%;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	border-radius: 18px;
	border: solid 10px #ffba61;
}
@media screen and (max-width: 768px) {
	.programmingthinking-main{
		border-radius: 2.66vw;
	}
	.programmingthinking-main-bg{
		width: calc(100% - 1.33vw);
		height: calc(100% - 1.33vw);
		border-radius: 2.4vw;
		border: solid 1.33vw #ffba61;
	}
}

.programmingthinking-main h3{
	position: absolute;
	width: 68.75%;
	top: 0;
	left: 0;
	margin-top: -4.11%;
	margin-left: 15.625%;
}
.pt-1{
	position: relative;
	width: 79.82%;
	margin-bottom: 3.125%;
	margin-left: 10.51%;
}
.pt-1 p:nth-of-type(1){
	position: relative;
	width: 23.84%;
}
.pt-1 p:nth-of-type(2){
	position: relative;
	width: 78.11%;
	margin-top: 4.27%;
	margin-left: -1.95%;
}
.pt-2 {
	position: relative;
	width: 79.82%;
	margin: 0 auto 6.81%;
}
.pt-3 {
	position: relative;
	margin-bottom: 8.52%;
}
.pt-3 h4 {
	position: relative;
	width: 91.72%;
	margin: 0 auto 3.26%;
}
.pt-3 ul {
	position: relative;
	width: 91.61%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
.pt-3 ul li{
	position: relative;
	width: 32.24%;
}
.pt-4 {
	position: relative;
}
.pt-4 h4 {
	position: relative;
	width: 91.72%;
	margin: 0 auto 3.26%;
}
.pt-box{
	position: relative;
	width: 90.625%;
	margin: 0 auto;
	background-color: #ffffdc;
	border-radius: 20px;
}
.pt-4-arrow{
	position: relative;
	width: 12.35%;
	height: 0;
	padding-top: 8.94%;
	margin: 0 auto 3.83%;
	background: url(../img/product/gummyramune/arrow_01.png) top center no-repeat;
	background-size: 100% auto;
}
.pt-4-1{
	margin-bottom: 4.97%;
}
.pt-4-1 h5{
	position: relative;
	width: 78.21%;
	margin: 0 auto 6.58%;
	padding-top: 2.35%;
}
.pt-4-1-1 {
	position: relative;
	width: 93.26%;
	margin-left: 4.23%;
	padding-bottom: 3.29%;
}
.pt-4-1-1 {
	position: relative;
	width: 93.26%;
	padding-bottom: 3.29%;
}
.pt-4-1-1 p:nth-of-type(1){
	position: relative;
	width: 21.17%;
	margin-top: 5.37%;
	margin-left: -4.36%;
}
.pt-4-1-1 p:nth-of-type(2){
	position: relative;
	width: 83.19%;
}
.pt-4-2 {
	position: relative;
	margin-bottom: 4.4%;
	padding-top: 1.27%;
	padding-bottom: 3.97%;
}
.pt-4-2 h5 {
	position: absolute;
	top: 0;
	left: 0;
	width: 18.96%;
	margin-top: -10.50%;
	margin-left: 2.19%;
}
.pt-4-2 p {
	position: relative;
	width: 65.98%;
	margin: 0 auto;
}
.pt-4-3 {
	position: relative;
	margin-bottom: 4.82%;
	padding-top: 3.55%;
	padding-bottom: 3.4%;
}
.pt-4-3 h5 {
	position: absolute;
	top: 0;
	left: 0;
	width: 18.96%;
	margin-top: -10.50%;
	margin-left: 2.19%;
}
.pt-4-3 p {
	position: relative;
	width: 90.43%;
	margin: 0 auto;
}
.pt-4-4 {
	position: relative;
	margin-bottom:4.26%;
	padding-top: 1.84%;
	padding-bottom: 3.4%;
}
.pt-4-4-bg1{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 9.56%;
	margin-bottom: 1.72%;
	animation: fuwa1 1s ease-in-out infinite alternate;
	-webkit-animation: fuwa1 1s ease-in-out infinite alternate;
	animation-duration: 1.1s;
	-webkit-animation-duration: 1.1s;
}
.pt-4-4-bg1 span{
	display: block;
	animation: fuwa2 1s ease-in-out infinite alternate;
	-webkit-animation: fuwa2 1s ease-in-out infinite alternate;
	animation-duration: 1.3s;
	-webkit-animation-duration: 1.3s;
}
@keyframes fuwa1 {
	0% {
		transform:translateX( -3px);
	}
	100% {
		transform:translateX(  0px);
	}
}
@keyframes fuwa2 {
	0% {
		transform:translateY(-10px);
	}
	100% {
		transform:translateY(  0px);
	}
}

@-webkit-keyframes fuwa1 {
    0% {
		-webkit-transform:translateX( -3px);
	}
	100% {
		-webkit-transform:translateX(  0px);
	}
}
@-webkit-keyframes fuwa2 {
	0% {
		-webkit-transform:translateY(-10px);
	}
	100% {
		-webkit-transform:translateY(  0px);
	}
}
.pt-4-4-bg2{
	position: absolute;
	top: 0;
	right: 0;
	width: 9.56%;
	margin-top: 6.26%;
	margin-right: 1.56%;
	animation: fuwa1 1s ease-in-out infinite alternate;
	-webkit-animation: fuwa1 1s ease-in-out infinite alternate;
	animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
}
.pt-4-4-bg2 span{
	display: block;
	animation: fuwa2 1s ease-in-out infinite alternate;
	-webkit-animation: fuwa2 1s ease-in-out infinite alternate;
	animation-duration: 1.7s;
	-webkit-animation-duration: 1.7s;
}
.pt-4-4 p{
	position: relative;
	width: 90.43%;
	margin: 0 auto;
}
.pt-4-5 {
	margin-bottom: 3.83%;
	padding-top: 2.27%;
	padding-bottom: 3.83%;
}
.pt-4-5 h5 {
	position: absolute;
	top: 0;
	left: 0;
	width: 18.96%;
	margin-top: -10.50%;
	margin-left: 2.19%;
}
.pt-4-5 p {
	position: relative;
	width: 76.48%;
	margin-left: 22.25%;
}
.pt-4-6{
	margin-bottom: 7.38%;
	padding-top: 3.125%;
	padding-bottom: 2.41%;
}
.pt-4-6-1{
	width: 92.78%;
	margin-bottom: 3.69%;
	margin-left: 1.72%;
}
.pt-4-6-1 p:nth-of-type(1){
	width: 22.63%;
	margin-top: 7.6%;
}
.pt-4-6-1 p:nth-of-type(2){
	width: 81.92%;
	margin-left: -4.55%;
}
.pt-4-6 p.pt-4-6-img{
	width: 90.43%;
	margin: 0 auto;
}
.pt-4-7{
	position: relative;
	width: 81.96%;
	margin: 0 auto 12.64%;
}
.pt-4-8 {
	margin-bottom: 5.39%;
	padding-top: 2.27%;
	padding-bottom: 2.84%;
}
.pt-4-8 h5 {
	position: absolute;
	top: 0;
	left: 0;
	width: 18.96%;
	margin-top: -10.50%;
	margin-left: 2.19%;
}
.pt-4-8 p {
	position: relative;
	width: 85.42%;
	margin-left: 13.9%;
}
.pt-4-9 {
	padding-top: 2.27%;
	padding-bottom: 2.84%;
}
.pt-4-9 h5 {
	position: absolute;
	top: 0;
	left: 0;
	width: 18.96%;
	margin-top: -10.50%;
	margin-left: 2.19%;
}
.pt-4-9 p {
	position: relative;
	width: 90.43%;
	margin: 0 auto;
}

#gr-footer{
	position:absolute;
	bottom:0;
	left:0;
	margin-left:calc(50% - 52.105vw);
	width:104.21vw;
	height:0;
	padding-top:2.39vw;
	background: url('../img/product/gummyramune/bg_01.png') top center no-repeat;
	background-size:100% auto;
}

@media screen and (max-width: 768px) {
	#gr-footer{
		margin-left:0;
		width:100%;
		padding-top:6.13vw;
		background: url('../img/product/gummyramune/bg_01.png') top center no-repeat;
		background-size:266.8% auto;
	}	
}
	
#hintpop{
	position: relative;
	width: 750px;
	margin: 0 auto;
}
#hintpop img{
	width: 100%;
}
.hintpop-main{
	position: relative;
	padding-top: 9.46%;
	padding-bottom: 9.73%;
	background-color: #FFF;
	border-radius: 20px;
	z-index: 10;
	width: 93.86%;
	margin: 0 auto;
}
.hintpop-bg{
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 0.71%;
	margin-left: 0.71%;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	border-radius: 18px;
	border: solid 10px #ffba61;
}

.hintpop-1{
	width: 80.53%;
	margin-bottom: 2.84%;
	margin-left: 10.36%;
}
.hintpop-2{
	position: relative;
}
.hintpop-2 h3{
	position: relative;
	margin: 0 auto 3.55%;
}
.hintpop-2 h3:nth-of-type(1){
	width: 64.77%;
}
.hintpop-2 h3:nth-of-type(2){
	width: 45.17%;
}
.hintpop-2 h3:nth-of-type(3){
	width: 56.25%;
}
.hintpop-2 h3:nth-of-type(4){
	width: 73.57%;
	margin-bottom: 0;
}
.hintpop-2 p{
	position: relative;
	margin: 0 auto 5.82%;
}
.hintpop-2 p:nth-of-type(1){
	width: 79.4%;
}
.hintpop-2 p:nth-of-type(2){
	width: 67.32%;
}
.hintpop-2 p:nth-of-type(3){
	width: 79.4%;
	margin-bottom: 8.23%;
}
.hintpop-2 p:nth-of-type(4){
	width: 80.82%;
}
.hintpop-2 p:nth-of-type(5){
	width: 79.4%;
}

@media screen and (max-width: 768px) {
	#hintpop{
		width: 100%;
	}
	.hintpop-main{
		border-radius: 2.66vw;
	}
	.hintpop-bg{
		width: calc(100% - 1.33vw);
		height: calc(100% - 1.33vw);
		border-radius: 2.4vw;
		border: solid 1.33vw #ffba61;
	}
}

.c-closeBtn{
	position: fixed !important;
	width: 76px !important;
	top: 0 !important;
	right: calc(50% - 436px) !important;
}
@media screen and (max-width: 768px) {
.c-closeBtn{
	position: fixed !important;
	width: 12vw !important;
	top: 0 !important;
	right: 0 !important;
	z-index: 20 !important;
}
}


[data-aos=vanishanime] {
	opacity: 1;
}
[data-aos=vanishanime].aos-animate {
	opacity: 0;
}
[data-aos=appearanime] {
	opacity: 0;
}
[data-aos=appearanime].aos-animate {
	opacity: 1;
}

@keyframes join1{
	0% {opacity: 0;}
	20% {opacity: 1;}
	80% {opacity: 1;}
	100% {opacity: 0;}
}
@-webkit-keyframes join1 {
	0% {opacity: 0;}
	20% {opacity: 1;}
	80% {opacity: 1;}
	100% {opacity: 0;}
}