*{
	margin: 0;
	padding: 0;
}
body{
	font-family: 'Gotham' !important;
}

a{
	text-decoration: none !important;

}

.video-text img{
	width: 50vw;
	padding: 0 !important;
}

.row{
	padding: 0 !important;
}
.sliders{
	padding: 0 !important;
}
/*flex style*/
.flex-space-between{
	display: flex;
	justify-content: space-between;
}

.flex-center{
	display: flex;
	align-items: center;
}
.flex-c-center{
	display: flex;
	align-items: center;
	justify-content: center;
}
.flex-y-line{
	display: flex;
	justify-content: center;
}
.inline { 
	display: inline-block; 
}

/*header style*/
.header{
	position: absolute;
	z-index: 5;
}
.qimage-shadow{
	position: absolute;
	width: 100%;
	z-index: 4;
}
.qimage-background{
	position: absolute;
	width: 100%;
	z-index: 1;
}
.qimage-backgroundx2{
	position: absolute;
	width: 100%;
	z-index: 1;
	display: none;
}
.qprod-science-tel{
	width: 100%;
	display: none;
}

.header .header-buttons{
	width: 100%;
	position: absolute;
	z-index: 5;
}
/* Menu */

/* The side navigation menu */
.sidenav {
	font-family: "Gotham Ultra";
  float: right; 
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 12; /* Stay on top */
  top: 0; /* Stay at the top */
  right: 0;
  background-color: #fff; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 60px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 3vh;
  color: #000;
  display: block;
  transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
  transition: margin-left .5s;
  padding: 20px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}



/*logo*/
.logo{
	display: inline-block;
	margin-top: 1vw;
}

.logo .logo-butt{
	margin-left: 2vw;
	width: 5vw;
}

.logo .logo-qjutsu{
	width: 9vw;
}

.header .header-buttons .register-menu{
	display: inline-block
}

/*register menu*/
.register-menu {
	display: inline-block;
	float: right;
    margin-right: 2vw;
}
.register-menu .register-butt{
	display: block;
	padding-top: 2vh;
	padding-bottom: 2vh;
	padding-left: 3vh;
	padding-right: 3vh;
	border-radius: 5vh;
	background-color: #431a6e;
	font-family: 'Gotham';
	color:white;
	margin-right: 4vh;
	margin-top: 3vh;
	float: left;
}
.form-button{
	display: block;
	padding-top: 1.5vh;
	padding-bottom: 1.5vh;
	padding-left: 4vh;
	padding-right: 4vh;
	border-radius: 5vh;
	border:0;
	background-color: #431a6e;
	font-family: 'Gotham';
	color:white;
	float: right;
}
.form-button:hover{
	color: #fff;
}
.question-button{
	display: block;
	padding-top: 2vh;
	padding-bottom: 2vh;
	padding-left: 3vh;
	padding-right: 3vh;
	border-radius: 5vh;
	background-color: #431a6e;
	font-family: 'Gotham';
	color:white;
	float: left;
}

.register-menu .menu-butt{
	font-size: 6vh;
    color: white;
    float: right;
}

/*body*/
.qjutsu-flower{
	float: right;
	margin-top: 45vw;
 	width:36vw; 
 	margin-right: 5vh;
}

.qtitle-flower{
	text-align: right;
	font-family: 'Gotham Ultra';
	font-size: 3.5vw;
	line-height: 3.5vw;
	float: left;
}

.qtext-flower{
	float: right;
	margin-top: 1vh;
	font-size: 1.15vw;
	line-height: 1.75vw;
	font-family: 'Gotham Book';
	text-align: right;
}
.right-flower{
	margin-top: 50vw;
	width: 33vw;
}
.car-img-tel{
	display: none;
}
.qtitle{
	margin-top: 15vh;
	margin-bottom: 5vh;
	font-family: 'Gotham Ultra';
	font-size: 4.5vw;
	margin-left: auto;
	margin-right: auto;
	width: fit-content;
}
.qtext{
	
}

.qline-flower{
	width: 70%;
	float: right;
}
.qprod{
	margin-top: 10vh !important;
	padding: 0 !important;
	width: 100%;
	height: 100% !important;
    width: 100% !important;
}
.s-image{
	width: 100%;
}
.qprod-science{
	padding: 0 !important;
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}
.nav{
	display: flex !important;
	justify-content: center;
}

.nav-tabs .nav-link{
	color: black !important;
	text-align: center;
	width: 20vw;
	font-size: 1.5vw;
	padding-right: 1.60vw;
	padding-left: 1.60vw;
	border: 1px solid transparent !important;
}
.nav-tabs .nav-link.active{
	font-family: 'Gotham Ultra'; 
	border-bottom: 6px solid #431a6e !important;
}
.vid{
	width: 100%;
	height: 100%;
}

.on-picture-text{
	margin-top: 11vw !important;
    margin-left: 11vw;
    position: absolute;
    width: 33vw !important;
}

.video-text{
	position: absolute;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;

}
.qjutsu-left{
	margin-top: 100vh;
 	width:65vh; 
 	margin-right: 5vh;
}

.qtitle-left{
	text-align: left;
	font-family: 'Gotham Ultra';
	font-size: 3.5vw;
	line-height: 3.5vw;
}
.qtext-left{
	margin-top: 1vh;
	font-size: 1.15vw;
	line-height: 1.75vw;
	font-family: 'Gotham Book';
	text-align: left;
}
.qline-left{
	width: 70%;
}
.accordion-body{
	width: 70% !important;
	margin-left: auto;
	margin-right: auto;
}
.accordion-button{
	font-size: 1vw !important;
	width: 70% !important;
	margin-left: auto;
	margin-right: auto;
	border-width: 0px !important;
	font-family: 'Gotham Ultra';
}
.accordion-button:not(.collapsed) {
    color: #000 !important;
    background-color: #FBFBFD !important;
}
.accordion-button:focus{
	border:0 !important;
	box-shadow:none !important;
}
.accordion-header{
	border-bottom: 1px solid #C2C2C2;
	border-top: 1px solid #C2C2C2;
}
.accordion-button:not(.collapsed)::after {
	color:#431a6e !important;
}
.panel-heading
{
  padding:0px;
}
.panel-title a
{
  padding:10px; 
  display:block;
}
.panel-title a[aria-expanded='true']
{
  background-color: red;
  color:#fff;
}
.panel-title a[aria-expanded='true']::after
{
  color:blue;
}
.mapa-footer{
	padding: 0 !important;
	width: 100%;
}
.qjutsu-prod {
	width: 20%;
}
.qjutsu-img{
	border-bottom: 1px solid #C2C2C2;
	height: 40vh;
	padding-bottom: 10vh;
}
@media screen and (max-width: 1100px) {
  	.qjutsu-blank{
  		display: none !important;
	}
		.all-qjutsu{
		width: 1400px !important;
	}
	.qjutsu-prod {
	    width: 25%;
	}

}


.prod-scroll{
	padding: 0 !important;
	width: 100%;
}

.sliderQ{
	padding: 0 !important;
	position: absolute;
	display: flex;
	justify-content: space-between;
	width: 100%;
	height: 100%;
}
.butt-slide{
	width: 10%;
	height: 100%;
	text-align: center;
	font-size: 10vh;
	cursor: pointer;
	color: #431a6e;
	transition: 0.1s;
}
@media screen and (max-width: 900px) {
	.car-img-tel{
		display: block;
	}
	.form-shop {
		width: 75% !important;
	}
	.car-img{
		display: none;
	}
	.qimage-background{
		display: none;
	}
	.qimage-backgroundx2{
		display: block;
	}
  	.qjutsu-flower{
  		position: absolute;
	    z-index: 11;
	    margin-top: 0;
	    top: 58vW;
	    left: -13vW;
	    width: 64vw;
  	}
  	.right-flower{
		margin-top: 102vW;
    	width: 90vw;
	}
	.qtitle-flower{
		text-align: right;
	    font-family: 'Gotham Ultra';
	    font-size: 19.5vw;
	    line-height: 15.5vw;
	    float: left;
	}
	.qtext-flower {
	    float: right;
	    margin-top: 1vh;
	    font-size: 3.25vh;
    	line-height: 3.75vh;
	    font-family: 'Gotham Book';
	    text-align: right;
	}
	.qprod-science {
	    width: 90%;
	}
	.register-butt{
		display: none !important;
	}
	.logo {
	    display: inline-flex;
	    margin-top: 5vw;
	}
	.logo .logo-qjutsu {
	    width: 57vw;
	    height: 11vw;
	}
	.logo .logo-butt {
	    margin-left: 2vw;
	    margin-right: 5vw;
	    width: 14vw;
	}
	.accordion-button {
		width: 100% !important;
	}
	.accordion-body {
		width: 100% !important;
	}
	.accordion-button {
	    font-size: 3vw !important;
	}
	.nav-tabs .nav-link{
		color: black !important;
		text-align: center;
		width: 30vw;
    	font-size: 2.65vw;
		padding-right: 1.60vw;
		padding-left: 1.60vw;
		border: 1px solid transparent !important;
	}
	.nav-tabs .nav-link.active {
	    font-family: 'Gotham Ultra';
	    border-bottom: 3px solid #431a6e !important;
	}
	.qprod-science-tel{
		display: block;
	}
	.qprod-science{
		display: none;
	}
	.on-picture-text {
	    margin-top: 11vw !important;
	    margin-left: 14vw;
	    position: inherit;
	    width: 76vw !important;
	}
	.qtitle-left {
	    text-align: left;
	    font-family: 'Gotham Ultra';
	    font-size: 9.5vw;
	    line-height: 3.5vw;
	    margin-bottom: 5vw;
	}
	.qtext-left {
	    margin-top: 1vh;
	    font-size: 3.15vw;
	    line-height: 2.75vw;
	    font-family: 'Gotham Book';
	    text-align: left;
	}
	.question-area{
		text-align: center;
	}
	.question-button{

	}
}
@media screen and (max-width: 580px) {

  	.reg{
  		position: absolute;
  	}
 }
@media screen and (max-width: 700px) {

  	.sliderQ, #slideRight, #slideLeft{
  		display: none;
  	}
  	.container-scroll{ 
  		overflow: scroll !important;
  	}
  	.qtitle {
  		font-size: 9.5vw;
  	}
  	.qjutsu-img {
	    height: 35vh;
	}
	.qjutsu-desc {
	    padding-right: 8vw !important;
	    padding-left: 8vw !important;
	    padding-top: 8vw !important;
	}
	.prod-desc {
	    font-size: 2vh !important;
	}
	.qjutsu-img img{
		width: 25vh;
	}
	.form-shop {
	    width: 95% !important;
	}

}
.policy{
	color:#431a6e;
	text-decoration: underline !important
}
.policy:hover{
	color:#431a6e;
}
@media screen and (min-width: 1870px) {
  	.sliderQ, #slideRight, #slideLeft{
  		display: none;
  	}
}
.butt-slide:active{
	font-size: 8vh;
}
.butt-slide:hover{
	color: #6a2aad;
}

#slideLeft{
background: rgb(255,255,255);
background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5130427170868348) 50%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5130427170868348) 50%, rgba(255,255,255,0) 100%);
background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.5130427170868348) 50%, rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}

#slideRight{
	background: rgb(255,255,255);
background: -moz-linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5130427170868348) 50%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5130427170868348) 50%, rgba(255,255,255,1) 100%);
background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5130427170868348) 50%, rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}

.qjutsu-selected{
	border-bottom: 6px solid #431a6e !important;
}

.qjutsu-img img{
	width: 30vh;
}
.prod-desc{
	white-space: pre-wrap !important;
}
.container-scroll {
	padding: 0 !important;
    width: 100%;
    overflow-x: auto;
    overflow: hidden;
    white-space: nowrap;
    margin-bottom: 30vh;
}
.qjutsu-desc {
    width: 100%;
    padding-bottom: 4vw;
    padding-right: 4vw;
    padding-left: 4vw;
    padding-top: 2vw;
}
.prod-desc{
	font-family: 'Gotham Book';
    /*height: 33vh;*/
    font-size: 80%;
}
.prod-title{
	font-size: 3vh;
	font-family: 'Gotham Ultra';
}
.prod-butt{
	display: block;
	text-align: center;
	background-color: #F2F2F2;
	padding: 13px;
	border-radius: 30px;
	/*width: 60%;*/
	width: 100%;
	color: #431a6e;
}
.prod-butt:hover{
	color: #431a6e;
}
.all-qjutsu{
	width: 1870px;
	align-items: start;
}
.faq-section{
	background-color: #FBFBFD !important;
	padding-bottom: 30vh !important;
}
.question-area{
	margin-top: 3vw !important;
	width: 67%;
	margin-left: 16.5%;
	margin-right: 16.5%;
}
.question-button:hover{
	color: #fff;
}
.accordion-button:not(.collapsed)::after {
    background-image: url("../img/arrow.png") !important;
}
form{
	font-family: 'Gotham Book';
}

.form-shop {
    width: 40%;
    margin-top: 5vh;
    margin-bottom: 8vh;
}
.custom-select.is-invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .was-validated .form-control:invalid {
    border-color: #431a6e !important;
}
.form-label{
	font-size: 2.3vh;
}
.form-control{
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
	border-radius: 0px !important;
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
  border-color: rgb(67, 26, 110);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgb(67, 26, 110);
  outline: 0 none;
}
.form-check-input:checked{
	background-color: #431a6e !important;
    border-color: #431a6e !important;
}

/* footer */

#footer {
    text-align: center;
    margin-top: 120px;
    margin-bottom: 120px;
}

.footer-social {}
.footer-social-item {
    margin-left: 10px;
    margin-right: 10px;
}

.footer-social-item img {
    height: auto;
    transition: all .2s;
}

.footer-social-item img:hover {
    transform: scale(1.1);
}

.footer-claim {
    margin-bottom:30px;
    margin-top: 30px;
}
.footer-claim p {
    font-family: 'Gotham';
    font-weight: 500;
    font-style: normal;
    font-size: 16px;
    padding-left: 10px;
    padding-right: 10px;
}

.footer-logo img{
    height: 70px; 

}


.premap-header {
	font-family: 'Gotham Ultra';
	text-align: center;
	font-size: 72px;
	font-weight: bold;
	margin-top: 50px;
	margin-bottom: 50px;
	text-transform: uppercase;
}