@charset "utf-8";

/* ============================================================
pc css setting
============================================================ */
.flowting-btn {
	display: none;
}

@media screen and (max-width: 768px) {
	.flowting-btn {
		display: block;
		position: fixed;
		bottom: 10px;
		left: 10px;
		background: #f7a42e;
		color: #FFF;
		font-weight: bold;
		letter-spacing: .1em;
		text-indent: .1em;
		border-radius: 300px;
		border: 2px solid #FFF;
		padding: 1em 2em;
		z-index: 9999;
		transition: .3s;
	}

	.flowting-btn.display-none {
	    display: none;
	}

	.flowting-btn span {
		background: #FFF;
		color: #f7a42e;
		padding: 3px 4px;
		margin-right: 6px;
		border-radius: 2px;
	}

	.flowting-btn:hover {
		opacity: .9;
	}
}

/* ============================================================
pc css setting
============================================================ */
.flowting {
	width: 100%;
	display:flex;
}
.flowting-btn {
	display: none;
}

.flowting_add {
	display: none;
}

@media screen and (max-width: 480px) {
	.flowting_add {
		width: 100%;
		display:flex;
	}
	.flowting-btn1 {
		display: block;
		position: fixed;
		bottom: 83px;
		left: 10px;
		background: #f7a42e;
		color: #FFF;
		font-weight: bold;
		letter-spacing: .1em;
		text-indent: .1em;
		border-radius: 0px;
		border: 2px solid #FFF;
		padding: 1.7em 2em;
		z-index: 9999;
		transition: .3s;
		width: calc(100% / 1.8);
	}

	.flowting-btn1 span {
		background: #FFF;
        color: #f7a42e;
        padding: 7px 5px;
        margin-right: 18px;
		border-radius: 2px;
	}

	.flowting-btn1:hover {
		opacity: .9;
	}
}
.flowting-btn2 {
	display: none;
}

.flowting-btn1 a{
	color: #FFF !important;
    cursor: pointer;
}

.flowting-btn2 a{
	color: #FFF !important;
    cursor: pointer;
}

@media screen and (max-width: 480px) {
	.flowting-btn2 {
		display: block;
		position: fixed;
		bottom: 10px;
		left: 10px;
		background: #007aff;;
		color: #FFF;
		font-weight: bold;
		letter-spacing: .1em;
		text-indent: .1em;
		border-radius: 0px;
		border: 2px solid #FFF;
		padding: 1em 2em;
		z-index: 9999;
		transition: .3s;
		width: calc(100% / 1.8);
	}

    .flowting-btn2.display-none {
        display: none;
    }

	.flowting-btn2 span {
		padding: 3px 4px;
		margin-right: 6px;
		border-radius: 2px;
	}
	.flowting-btn2 span img {
		max-width: 10% !important;
	}

	.flowting-btn2:hover {
		opacity: .9;
	}
	.flowting-font{
		font-size: 1.2ex;
		background:none;
		color: #FFF;
	}
	
}