@media screen and (min-width: 600px) {
	body{
		margin: 0;
		color: #000000 !important;
	}
	body::-webkit-scrollbar{
		display: none;
	}
	main{
		width: 100vw;
		padding: 0;
		margin: 0;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		animation: opacity 2s backwards;
	}
	main > h1{
		font-size: 3vw;
		line-height: 3vw;
		text-align: center;
		padding: 6vw 0 3vw 0;
		width: 100vw;
	}
	@keyframes opacity{
		0%{opacity: 0;}
		100%{opacity: 1;}
	}
	.button{
		box-shadow: .3vw .3vw .8vw #a1a1a1, 
		            -.3vw -.3vw .8vw #fefefe;
		transition: all .1s;
		cursor: pointer;
		user-select: none;
	}
	.button:active{
		box-shadow: .15vw .15vw .4vw #a1a1a1, 
		            -.15vw -.15vw .4vw #fefefe;
	}
	.input{
		box-shadow: inset .3vw .3vw .8vw #a1a1a1, 
            		inset -.3vw -.3vw .8vw #fefefe;
	}
	#mat{
		width: 35vw;
		position: relative;
		color: #000;
		margin: 1.5vw;
		user-select: none;
	}
	#pro{
		width: 35vw;
		position: relative;
		display: flex;
		color: #000;
		margin: 1.5vw;
		user-select: none;
	}
	#mat-input, #pro-input{
		width: 33vw;
		height: 4.5vw;
		text-align: center;
		font-weight: bold;
		line-height: 4.5vw;
		font-size: 2vw;
		border-radius: 1.6vw;
		padding-right: 2vw;
		background-color: #f1f1f1;
	}
	#mat-button, #pro-button{
		position: absolute;
		top: .5vw;
		right: .5vw;
		width: 3.5vw;
		height: 3.5vw;
		text-align: center;
		font-weight: bold;
		line-height: 4.5vw;
		font-size: 2vw;
		border-radius: 1.2vw;
		margin-left: 1.5vw;
		background-image: url(../image/calc-arrow.svg);
		background-size: 60%;
		background-repeat: no-repeat;
		background-position: center;
	}



	#mat-select{
		width: 100vw;
		height: calc(100vh - 10vw);
		position: fixed;
		left: 0vw;
		top: 4.5vw;
		padding-top: 5.5vw; 
		overflow-y: scroll;
		overflow-x: hidden;
		display: flex;
		flex-direction: column;
		align-items: center;
		align-content: center;
		opacity: 1;
		pointer-events: inherit;
		transition: all .3s;
		background-color: #fff;
		z-index: 5;
		user-select: none;
	}
	#mat-select::-webkit-scrollbar{
		background: transparent;
		width: .8vw;
	}
	#mat-select::-webkit-scrollbar-corner{
		background: transparent;
	}
	#mat-select::-webkit-scrollbar-track{
		box-shadow: inset .1vw .1vw .5vw #a1a1a1, 
            		inset -.1vw -.1vw .5vw #fefefe;
		border-radius: 2vw;
		background: transparent;
	}
	#mat-select::-webkit-scrollbar-thumb{
		background: #bd7d57;
		border-radius: 2vw;
	}
	#mat-select > h2{
		width: 100vw;
		font-size: 3vw;
		line-height: 5vw;
		padding: 3vw 0 1vw 0;
		text-align: center;
	}
	#mat-select > div{
		width: 100vw;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin: 1vw 0;
	}
	#mat-select > div:last-child{
		padding-bottom: 5vw;
	}
	#mat-select > div > h3{
		width: 80vw;
		font-size: 2.5vw;
		font-weight: bold;
		text-align: center;
		margin: 1vw 0;
	}
	.grade-button{
		width: 20vw;
		height: 4.5vw;
		border-radius: 5vw;
		margin: 1vw;
		position: relative;
	}
	.grade-name{
		width: 20vw;
		position: absolute;
		font-size: 1.8vw;
		text-align: center;
		font-weight: bold;
		color: #000;
		left: 0;
		top: .3vw;
	}
	.grade-density{
		width: 20vw;
		position: absolute;
		font-size: 1.5vw;
		text-align: center;
		color: #000;
		left: 0;
		top: 2.3vw;
	}



	#pro-select{
		width: 100vw;
		height: calc(100vh - 15.5vw);
		position: fixed;
		left: 0vw;
		top: 4.5vw;
		padding: 5.5vw 0; 
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		align-content: center;
		background-color: #fff;
		opacity: 0;
		pointer-events: none;
		transition: all .3s;
		z-index: 1;
		user-select: none;
	}
	#pro-select > h2{
		width: 100vw;
		font-size: 3vw;
		line-height: 5vw;
		padding: 3vw 0 1vw 0;
		text-align: center;
		position: absolute;
		top: 5.5vw;
	}
	#pro-select > div{
		display: flex;
		height: 12vw;
		width: 12vw;
		margin: 1vw;
		border-radius: 10vw;
		position: relative;
	}
	#ill-1{
		width: 2vw;
		height: 2vw;
		border-radius: 2vw;
		border: solid 1vw #333;
		position: absolute;
		left: 4vw;
		top: 2.5vw;
	}
	#ill-2{
		width: 2vw;
		height: 2vw;
		background-color: #000;
		border-radius: 2vw;
		border: solid 1vw #333;
		position: absolute;
		left: 4vw;
		top: 2.5vw;
	}
	#ill-3{
		width: 3vw;
		height: 0vw;
		background-color: #000;
		border-radius: .2vw;
		border: solid 1vw #333;
		position: absolute;
		left: 3.5vw;
		top: 3.5vw;
	}
	#ill-4{
		width: 2.887vw;
		height: 1.667vw;
		background-color: #000;
		border-radius: .1vw;
		position: absolute;
		left: 4.5vw;
		top: 3.8vw;
		transform: scale(1.3) rotate(30deg);
	}
	#ill-4::before{
		content: "";
		width: 2.887vw;
		height: 1.667vw;
		position: absolute;
		top: 0;
		left: 0;
		transform: rotate(60deg);
		background-color: #000;
		border-radius: .1vw;
	}
	#ill-4::after{
		content: "";
		width: 2.887vw;
		height: 1.667vw;
		position: absolute;
		top: 0;
		left: 0;
		transform: rotate(-60deg);
		background-color: #000;
		border-radius: .1vw;
	}
	#ill-5{
		width: 1.5vw;
		height: 1.5vw;
		background-color: #000;
		border-radius: .2vw;
		border: solid 1vw #333;
		position: absolute;
		left: 4.25vw;
		top: 2.75vw;
	}
	#ill-6{
		width: 9vw;
		height: .8vw;
		border-radius: .2vw;
		background-color: #000;
		position: absolute;
		left: 1.5vw;
		top: 4.5vw;
	}
	.pro-name{
		width: 12vw;
		font-size: 1.6vw;
		line-height: 5vw;
		text-align: center;
		font-weight:  bold;
		position: absolute;
		left: 0vw;
		top: 5.5vw;

	}




	#calc-form{
		width: 80vw;
		height: 36vw;
		position: relative;
		border-radius: 3vw;
		transition: all .3s;
		margin: 0 0 8vw 0;
	}
	#calc-form{
		opacity: 0;
		pointer-events: none;
	}
	.calc-form{
		position: absolute;
		top: 0;
		width: 80vw;
		height: 100%;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		align-items: flex-start;
		align-content: flex-start;
		opacity: 0;
		pointer-events: none;
	}
	.amount{
		margin: 1vw 28vw!important;
	}
	#center{
		font-size: 3vw;
		font-weight: bold;
	}
	.form-input{
		width: 23vw;
		height: 4vw;
		margin: 1vw;
		border: none;
		border-radius: 4vw;
		font-size: 1.5vw;
		text-align: center;
		line-height: 4vw;
		font-weight: bold;
		color: #000;
		background-color: transparent;
	}
	.confirm-button{
		width: 20vw;
		height: 4vw;
		margin: 1.5vw 35vw;
		font-size: 2vw;
		text-align: center;
		line-height: 4vw;
		font-weight: bold;
		border-radius: 4vw;
		color: #fff;
		user-select: none;
		background-color: #bd7d57;
	}
	.result{
		width: 30vw;
		height: 10vw;
		margin: 1vw;
		border: none;
		border-radius: 1.6vw;
		font-size: 3.5vw;
		text-align: center;
		line-height: 10vw;
		font-weight: bold;
		color: #000;
		position: relative;
		background-color: transparent;
		box-shadow: inset .1vw .1vw .5vw #a1a1a1, 
            		inset -.1vw -.1vw .5vw #fefefe;
	}
	.result-unit{
		color: #bd7d57;
		font-size: 2vw;
		line-height: 4vw;
	}
	.switch{
		box-shadow: .2vw .2vw .6vw #a1a1a1, 
		            -.2vw -.2vw .6vw #fefefe;
		width: 6vw;
		height: 2.5vw;
		border-radius: 3vw;
		font-size: 1.5vw;
		text-align: center;
		line-height: 2.5vw;
		position: absolute;
		right: 0.5vw;
		top: 7vw;
		cursor: pointer;
		transition: all .1s;
		user-select: none;
	}
	.result-ton:active::after{
		box-shadow: .15vw .15vw .4vw #a1a1a1, 
		            -.15vw -.15vw .4vw #fefefe;
	}
	.error{
		height: 0;
		font-size: 1.5vw;
		color: #e83719;
		width: 80vw;
		text-align: center;
		position: relative;
		top: 3vw;
	}

	#batch-frame{
		width: 80vw;
		height: 36vw;
		position: absolute;
		left: 0vw;
		top: 0vw;
		border-radius: 3vw;
		transition: all .3s;
		opacity: 0;
		pointer-events: none;
	}

	#data-input{
		width: 25vw;
		height: 25vw;
		padding: 2vw;
		border-radius: 2vw;
		border: none;
		position: absolute;
		left: 5vw;
		top: 0vw;
		font-size: 1.5vw;
		line-height: 2vw;
		font-weight: bold;
		color: #000;
		background-color: transparent;
	}
	#amount-input{
		width: 10vw;
		height: 25vw;
		padding: 2vw 1vw;
		border-radius: 2vw;
		border: none;
		position: absolute;
		text-align: center;
		left: 36vw;
		top: 0vw;
		font-size: 1.5vw;
		line-height: 2vw;
		font-weight: bold;
		color: #000;
		background: transparent;
	}
	.confirm-button-2{
		position: absolute;
		left: 50vw;
		top: 12.5vw;
		width: 6vw;
		height: 4vw;
		font-size: 2vw;
		text-align: center;
		line-height: 4vw;
		font-weight: bold;
		border-radius: 4vw;
		color: #fff;
		background-color: #bd7d57;
	}
	#weight-output{
		width: 15vw;
		height: 25vw;
		padding: 2vw 1vw;
		border-radius: 2vw;
		border: none;
		position: absolute;
		text-align: center;
		left: 58vw;
		top: 0vw;
		line-height: 2vw;
		box-shadow: inset .1vw .1vw .5vw #a1a1a1, 
            		inset -.1vw -.1vw .5vw #fefefe;
		font-size: 1.5vw;
		font-weight: bold;
		color: #000;
		user-select: text;
	}
	#amount-all{
		width: 10vw;
		height: 2vw;
		line-height: 2vw;
		padding: 1vw;
		border-radius: 2vw;
		border: none;
		position: absolute;
		text-align: center;
		font-weight: bold;
		left: 36vw;
		color: #000;
		top: 31vw;
		font-size: 1.5vw;
		user-select: text;
		box-shadow: inset .1vw .1vw .5vw #a1a1a1, 
            		inset -.1vw -.1vw .5vw #fefefe;
	}
	#amount-all::before{
		content: "In Total";
		font-size: 2vw;
		line-height: 5vw;
		position: absolute;
		top: 0;
		left: -10vw;
		font-weight: bold;
		height: 5vw;
	}
	#weight-all{
		width: 15vw;
		height: 2vw;
		line-height: 2vw;
		padding: 1vw;
		border-radius: 2vw;
		border: none;
		position: absolute;
		text-align: center;
		left: 58vw;
		color: #000;
		top: 31vw;
		box-shadow: inset .1vw .1vw .5vw #a1a1a1, 
            		inset -.1vw -.1vw .5vw #fefefe;
		font-size: 1.5vw;
		font-weight: bold;
		user-select: text;
	}
	#mode{
		user-select: none;
		position: relative;
		width: 16vw;
		margin: 3vw 30vw;
		border-radius: 2vw;
		display: flex;
		justify-content: center;
		user-select: none;
		box-shadow: inset .3vw .3vw .8vw #a1a1a1, 
            		inset -.3vw -.3vw .8vw #fefefe;
	}
	.batch-button{
		width: 8vw;
		height: 3vw;
		font-size: 1.5vw;
		color: #000;
		text-align: center;
		line-height: 3vw;
		border-radius: 0 2vw 2vw 0;
		font-weight: bold;
		cursor: pointer;
		background: transparent;
	}
	#back-button{
		width: 8vw;
		height: 3vw;
		font-size: 1.5vw;
		color: #fff;
		text-align: center;
		line-height: 3vw;
		border-radius: 2vw 0 0 2vw;
		font-weight: bold;
		cursor: pointer;
		background-color: #bd7d57;
	}
	#batch-error{
		position: absolute;
		left: 0;
		top: 36.5vw;
	}

	#unit-switch{
		content: "switch";
		box-shadow: .2vw .2vw .6vw #a1a1a1, 
		            -.2vw -.2vw .6vw #fefefe;
		width: 6vw;
		height: 2.5vw;
		border-radius: 3vw;
		font-size: 1.5vw;
		text-align: center;
		line-height: 2.5vw;
		position: absolute;
		right: 5.5vw;
		font-weight: bold;
		top: 26vw;
		cursor: pointer;
		transition: all .1s;
		user-select: none;
	}
	#unit-switch:active{
		box-shadow: .15vw .15vw .4vw #a1a1a1, 
		            -.15vw -.15vw .4vw #fefefe;
	}

	#bookmark{
		position: fixed;
		z-index: 300;
		width: 30vw;
		height: 15vw;
		left: 65vw;
		top: 3vw;
		opacity: 0;
		pointer-events: none;
		transition: all .3s;
	}
	.bookmark{
		display: none;
	}
	#bookmark::before{
		content: "";
		width: 2vw;
		height: 2vw;
		position: absolute;
		left: 14vw;
		top: -1vw;
		transform: rotate(45deg);
		background: linear-gradient(45deg, #8653ea 0%, #7053ea 20%, #535aea 40%, #5385ea 60%, #4fabde 80%, #50aadc 100%);
	}
	#bookmark-des{
		width: 30vw;
		height: 10vw;
		position: relative;
		z-index: 1;
		border-radius: 1vw;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		background-color: #bd7d57;
	}
	#bookmark-des > div{
		font-weight: bold;
		color: #fff;
	}
	#bookmark-des > div:nth-child(1){
		font-size: 1.5vw;
		line-height: 2vw;
	}
	#bookmark-des > div:nth-child(2){
		font-size: 3vw;
		line-height: 3.5vw;
	}




	#calc-cta{
		position: fixed;
		left: 0;
		bottom: 2vw;
		height: 8vw;
		background-color: #fff;
		z-index: 20;
		display: flex;
		align-items: center;
		border-radius: 8vw;
		box-shadow: 1vw 1vw 2vw #999;
		padding: 0 2vw;
		opacity: 0;
		pointer-events: none;
		transition: all .2s;
		border: solid .5vw #bd7d57;
		margin: 0 15vw;
		transform: translate(0, 10vw);
	}

	#calc-contact-cross{
		border-radius: 4vw;
		width: 4vw;
		height: 4vw;
		cursor: pointer;
		display: block;
		background: #eee;
	    transform: rotate(45deg);
	}
	#calc-contact-cross::before{
		content: "";
		width: 2.5vw;
		height: .6vw;
		background-color: #999;
		position: absolute;
		left: .75vw;
		top: 1.7vw;
	}
	#calc-contact-cross::after{
		content: "";
		height: 2.5vw;
		width: .6vw;
		background-color: #999;
		position: absolute;
		top: .75vw;
		left: 1.7vw;
	}

	#calc-contact-text{
		font-size: 2.5vw;
		font-weight: bold;
		margin: 0 2.5vw;
		color: #bd7d57;
	}



	#calc-contact-button{
		border-radius: 25vw;
		width: 25vw;
		height: 4vw;
		position: relative;
		background-color: #bd7d57;
		box-shadow: 0.5vw 0.5vw 2vw #666;
		cursor: pointer;
		transition: all 0.5s;
		transform: translate(0, 0);
		opacity: 1;
		overflow: hidden;
		margin: 0 .5vw;
	}
	#calc-contact-button:hover{
		transform: translate(0, -0.5vw);
	}
	#calc-contact-button img{
		width: 4vw;
		position: absolute;
		top: 0vw;
		left: 1.5vw;
	}
	#calc-contact-button p{
		position: absolute;
		font-weight: bold;
		font-size: 1.8vw;
		color: #fff;
		top: 1vw;
		left: 6vw;
		display: block;
		width: 20vw;
		line-height: 2vw;
	}

}




















@media screen and (max-width: 600px) {
	body{
		margin: 0;
		color: #000000 !important;
	}
	body::-webkit-scrollbar{
		display: none;
	}
	main{
		width: 100vw;
		padding: 0;
		margin: 0;
		user-select: none;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}
	main > h1{
		font-size: 8vw;
		line-height: 8vw;
		text-align: center;
		padding: 27.5vw 5vw 12vw 5vw;
		width: 90vw;
	}
	#bookmark{
		display: none;
	}
	.button{
		box-shadow: .6vw .6vw 1.6vw #a1a1a1, 
		            -.6vw -.6vw 1.6vw #fefefe;
		transition: all .1s;
		cursor: pointer;
	}
	.button:active{
		box-shadow: .3vw .3vw .8vw #a1a1a1, 
		            -.3vw -.3vw .8vw #fefefe;
	}
	.input{
		box-shadow: inset .6vw .6vw 1.6vw #a1a1a1, 
            		inset -.6vw -.6vw 1.6vw #fefefe;
	}
	#mat{
		width: 70vw;
		position: relative;
		color: #000;
		margin: 1vw;
	}
	#pro{
		width: 70vw;
		position: relative;
		display: flex;
		color: #000;
		margin: 1vw;
	}
	#mat-input, #pro-input{
		width: 66vw;
		height: 13.5vw;
		text-align: center;
		font-weight: bold;
		line-height: 13.5vw;
		font-size: 5vw;
		border-radius: 3.2vw;
		padding-right: 4vw;
		background-color: #f1f1f1;
	}
	#mat-button, #pro-button{
		position: absolute;
		top: 1.5vw;
		right: 1.5vw;
		width: 10.5vw;
		height: 10.5vw;
		text-align: center;
		font-weight: bold;
		line-height: 13.5vw;
		font-size: 5vw;
		border-radius: 3.6vw;
		margin-left: 4.5vw;
		background-image: url(../image/calc-arrow.svg);
		background-size: 60%;
		background-repeat: no-repeat;
		background-position: center;
	}



	#mat-select{
		width: 100vw;
		height: calc(100vh - 12vw);
		position: fixed;
		left: 0vw;
		top: 12vw;
		padding-top: 5.5vw; 
		overflow-y: scroll;
		overflow-x: hidden;
		-webkit-overflow-scrolling: touch;
		display: flex;
		flex-direction: column;
		align-items: center;
		align-content: center;
		opacity: 1;
		pointer-events: inherit;
		transition: all .3s;
		background-color: #fff;
		z-index: 5;
	}
	#mat-select::-webkit-scrollbar{
		background: transparent;
		width: .8vw;
	}
	#mat-select::-webkit-scrollbar-corner{
		background: transparent;
	}
	#mat-select::-webkit-scrollbar-track{
		box-shadow: inset .1vw .1vw .5vw #a1a1a1, 
            		inset -.1vw -.1vw .5vw #fefefe;
		border-radius: 2vw;
	}
	#mat-select::-webkit-scrollbar-thumb{
		background: #bd7d57;
		border-radius: 2vw;
	}
	#mat-select > h2{
		width: 100vw;
		font-size: 8vw;
		line-height: 10vw;
		padding: 6vw 0 2vw 0;
		text-align: center;
	}
	#mat-select > div{
		width: 100vw;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin: 1vw 0;
	}
	#mat-select > div:last-child{
		padding-bottom: 25vw;
	}
	#mat-select > div > h3{
		width: 80vw;
		font-size: 6vw;
		font-weight: bold;
		text-align: center;
		margin: 2vw 0;
	}
	.grade-button{
		width: 40vw;
		height: 12vw;
		border-radius: 10vw;
		margin: 1vw;
		position: relative;
	}
	.grade-name{
		width: 40vw;
		position: absolute;
		font-size: 4.5vw;
		text-align: center;
		font-weight: bold;
		color: #000;
		left: 0;
		top: 1.3vw;
	}
	.grade-density{
		width: 40vw;
		position: absolute;
		font-size: 3.6vw;
		text-align: center;
		color: #000;
		left: 0;
		top: 6.2vw;
	}



	#pro-select{
		width: 100vw;
		height: calc(100vh - 12vw);
		position: fixed;
		left: 0vw;
		top: 12vw;
		padding: 5.5vw 0; 
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		align-content: center;
		background-color: #fff;
		opacity: 0;
		pointer-events: none;
		transition: all .3s;
		z-index: 1;
	}
	#pro-select > h2{
		width: 100vw;
		font-size: 8vw;
		line-height: 10vw;
		padding: 6vw 0 2vw 0;
		text-align: center;
		position: absolute;
		top: 11vw;
	}
	#pro-select > div{
		display: flex;
		height: 36vw;
		width: 36vw;
		margin: 3vw;
		border-radius: 30vw;
		position: relative;
	}
	#ill-1{
		width: 6vw;
		height: 6vw;
		border-radius: 6vw;
		border: solid 3vw #333;
		position: absolute;
		left: 12vw;
		top: 7.5vw;
	}
	#ill-2{
		width: 6vw;
		height: 6vw;
		background-color: #000;
		border-radius: 6vw;
		border: solid 3vw #333;
		position: absolute;
		left: 12vw;
		top: 7.5vw;
	}
	#ill-3{
		width: 9vw;
		height: 0vw;
		background-color: #000;
		border-radius: .6vw;
		border: solid 3vw #333;
		position: absolute;
		left: 10.5vw;
		top: 10.5vw;
	}
	#ill-4{
		width: 8.661vw;
		height: 5.001vw;
		background-color: #000;
		border-radius: .3vw;
		position: absolute;
		left: 13.5vw;
		top: 11.4vw;
		transform: scale(1.3) rotate(30deg);
	}
	#ill-4::before{
		content: "";
		width: 8.661vw;
		height: 5.001vw;
		position: absolute;
		top: 0;
		left: 0;
		transform: rotate(60deg);
		background-color: #000;
		border-radius: .3vw;
	}
	#ill-4::after{
		content: "";
		width: 8.661vw;
		height: 5.001vw;
		position: absolute;
		top: 0;
		left: 0;
		transform: rotate(-60deg);
		background-color: #000;
		border-radius: .3vw;
	}
	#ill-5{
		width: 4.5vw;
		height: 4.5vw;
		background-color: #000;
		border-radius: .4vw;
		border: solid 3vw #333;
		position: absolute;
		left: 12.75vw;
		top: 8.25vw;
	}
	#ill-6{
		width: 27vw;
		height: 2.4vw;
		border-radius: .4vw;
		background-color: #000;
		position: absolute;
		left: 4.5vw;
		top: 13.5vw;
	}
	.pro-name{
		width: 36vw;
		font-size: 4.8vw;
		line-height: 15vw;
		text-align: center;
		font-weight:  bold;
		position: absolute;
		left: 0vw;
		top: 16.5vw;

	}




	#calc-form{
		width: 80vw;
		height: 200vw;
		position: relative;
		border-radius: 3vw;
		transition: all .3s;
		margin: 8vw 0 16vw 0;
	}
	#calc-form{
		opacity: 0;
		pointer-events: none;
	}
	.calc-form{
		position: absolute;
		top: 0;
		width: 80vw;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		align-items: flex-start;
		align-content: flex-start;
		opacity: 0;
		pointer-events: none;
	}
	.amount{
		margin: 3vw 28vw!important;
	}
	#center{
		font-size: 3vw;
		font-weight: bold;
	}
	.form-input{
		width: 69vw;
		height: 12vw;
		margin: 3vw;
		border: none;
		border-radius: 12vw;
		font-size: 4.5vw;
		text-align: center;
		line-height: 12vw;
		font-weight: bold;
		color: #000;
		outline: none;
		background-color: transparent;
	}
	.confirm-button{
		width: 60vw;
		height: 12vw;
		margin: 4.5vw 20vw;
		font-size: 6vw;
		text-align: center;
		line-height: 12vw;
		font-weight: bold;
		border-radius: 12vw;
		color: #fff;
		user-select: none;
		background-color: #bd7d57;
	}
	.result{
		width: 90vw;
		height: 30vw;
		margin: 3vw;
		margin-bottom: 12vw;
		border: none;
		border-radius: 4.8vw;
		font-size: 10.5vw;
		text-align: center;
		line-height: 30vw;
		font-weight: bold;
		color: #000;
		position: relative;
		background-color: transparent;
		box-shadow: inset .3vw .3vw 1vw #a1a1a1, 
            		inset -.3vw -.3vw 1vw #fefefe;
	}
	.result-unit{
		color: #bd7d57;
		font-size: 6vw;
		line-height: 12vw;
	}
	.switch{
		box-shadow: .6vw .6vw 1.8vw #a1a1a1, 
		            -.6vw -.6vw 1.8vw #fefefe;
		width: 18vw;
		user-select: none;
		height: 7.5vw;
		border-radius: 9vw;
		font-size: 4.5vw;
		text-align: center;
		line-height: 7.5vw;
		position: absolute;
		right: 1.5vw;
		top: 21vw;
		cursor: pointer;
		transition: all .1s;
	}
	.result-ton:active::after{
		box-shadow: .45vw .45vw 1.2vw #a1a1a1, 
		            -.45vw -.45vw 1.2vw #fefefe;
	}
	.error{
		height: 0;
		font-size: 4.5vw;
		color: #e83719;
		width: 80vw;
		text-align: center;
		position: relative;
		top: 3vw;
	}

	#batch-frame{
		display: none;
	}
	#mode{
		display: none;
	}
	#batch-error{
		position: absolute;
		left: 0;
		top: 36.5vw;
	}

	#unit-switch{
		content: "switch";
		box-shadow: .2vw .2vw .6vw #a1a1a1, 
		            -.2vw -.2vw .6vw #fefefe;
		width: 6vw;
		height: 2.5vw;
		border-radius: 3vw;
		font-size: 1.5vw;
		text-align: center;
		line-height: 2.5vw;
		position: absolute;
		right: 5.5vw;
		font-weight: bold;
		top: 26vw;
		cursor: pointer;
		transition: all .1s;
		user-select: none;
	}
	#unit-switch:active{
		box-shadow: .15vw .15vw .4vw #a1a1a1, 
		            -.15vw -.15vw .4vw #fefefe;
	}
	#calc-cta{
		display: none;
	}
}








