@charset "UTF-8";

button 									{border: 0 none; font-family: inherit; color: inherit;
											-webkit-appearance:none; -moz-appearance: none; appearance: none; 
										}
button:focus,
a:focus									{outline-color: transparent; outline-style: none;}
.btn 									{text-align: center; vertical-align: middle; border: 0 none; outline: none; cursor: pointer; background-color: transparent;
											display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; 
											-webkit-box-align: center; -ms-flex-align: center; align-items: center; 
											-webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
											-webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;
											font-weight: 500;
										}

a.btn									{text-decoration: none;}
input.btn,
button.btn								{overflow: visible; margin: 0; background-color: transparent;}

@media all and (min-width: 769px) {
	.btn:not(.bdr-w){font-size: 18px;}
	.btn.bdr-w{font-size: 16px;}
	.btn > .ico{margin-left: 6px;}
}
@media all and (max-width: 768px) {
	.btn{font-size: 16px;}
	.btn > .ico{margin-left: 4px;}
}

/* button size */
.btn.small{height: 54px; line-height: 54px; border-radius: 27px; padding: 0 16px;}
.btn.regular{height: 60px; line-height: 60px; border-radius: 30px; padding: 0 16px;}
.btn.medium{height: 68px; line-height: 68px; border-radius: 34px; padding: 0 16px;}
@media all and (max-width: 768px) {
	.btn.small{height: 50px; line-height: 50px;}
	.btn.regular{height: 51px; line-height: 51px;}
	.btn.medium{height: 60px; line-height: 60px;}
}

/* button size */
.w-290{min-width: 290px;}
.w-240{min-width: 240px;}
.w-180{min-width: 180px;}
.w-162{min-width: 162px;}

@media all and (max-width:768px) {
	.w-290{min-width: 246px;}
	.w-240{min-width: 200px;}
	.w-180{min-width: 170px;}
	.w-162{min-width: 140px;}
}

/* button color */
.btn.normal{background-color: var(--white); color: var(--black); }
.btn.black{background-color: var(--black); color: var(--white);}
.btn.bdr,
.btn.bdr-bg{border: 2px solid #111; color: var(--black);}
.btn.bdr{background-color: var(--white);}
.btn.bdr-w{border: 2px solid var(--white); background-color: transparent; color: var(--white);}

@media all and (min-width:769px) {
	.btn.normal:hover,
	.btn.black:hover{color: var(--white); background-color: var(--violet);}
	.btn.bdr:hover{border-color: var(--violet); color: var(--violet);}
	.btn.bdr-bg:hover{background-color: var(--black); color: var(--white);}
	.btn.bdr-w:hover{background-color: var(--white); color: var(--black);}
}

/* button circle */
.btn.circle{width: 48px; height: 48px; border-radius: 24px; border: 1px solid #d8dae5;}
/* .btn.circle:hover{background-color: var(--black-op-7); border: 1px solid #000; } */

/* button etc */
.btn.more{color: var(--black); font-size: 16px; font-weight: 500; line-height: 2;}
.btn.more + .ico{margin-left: 10px;}
@media all and (min-width:769px) {
	.btn.more:hover{color: var(--violet);}
	.btn.more:hover .ico{background-image: url("../images/common/ico_arr_left-v.svg");}
}
/* btn disabled */
.btn[disabled] {}