main > div.container {
  width: auto;
  max-width: 780px;
  padding: 0 15px;
}
span.mini {
	font-size: 12px; !important
}
input.form-control, 
textarea.form-control {
	background-color: rgba(0,0,0,0.04); !important
}

.color label {
	display: block;
	float: left;
	width: 5em;
	max-width:32%;
	height: 2.4em;
	margin: 2px;
	padding: 4px;
	box-sizing: border-box;
	font-size:13px;
}
.color input[type="radio"]{
	display: none;
}
.color2 label {
	width: 6em;
	max-width:45%;
	padding: 2px;
	border-bottom: solid 4px #ffffff;
}
.color2 div.cname {
	width: 7em;
	height:1.8em;
	padding-left: 2px;
	float: left;
	box-sizing: border-box;
}

.color2 div.cname span{
	font-size:90%;
}
.color input[type="radio"]:checked + label {
	border-bottom: solid 6px #0d6efd;
}
.form-check-input {
	border-color: #94a4b5;
}
#bg #bg_list {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	height: 320px;
	overflow-x: scroll;
	align-content: flex-start;
}
#bg #bg_list section {
	height: 100px;
	padding-right: 10px;
	font-size:12px;
}
#bg #bg_list section input[type="radio"] {
	display: none;
}
#bg #bg_list section input[type="radio"] + label img {
 	border: solid 1px #999;
}
#bg #bg_list input[type="radio"][class="bgselect"]:checked + label img {
 	border: solid 3px #0d6efd;
}
#bg #caution {
	display: none;
}
#bg {
	position: relative;
}
#bg .leftbutton,.rightbutton {
    font-size: 26px;
    position: absolute;
    top: 100px;
    padding: 20px 10px;
}
.leftbutton {
    left: -30px;
    border-radius: 0 3px 3px 0;
    box-shadow: 1px 1px 1px #888;
}
.rightbutton {
    right: -30px;
    border-radius: 3px 0 0 3px;
    box-shadow: -1px 1px 1px #888;
}
.bottom-btn {
  position: sticky;
  bottom: 0;
  left: 0;
}
.top-btn {
  position: sticky;
  top: 0;
  left: 0;
}
@media screen and (min-width: 480px) {
	#count2 br.sp_break,
	#count3 br.sp_break {
		display: none;
	}
	#count2, #count3 {
		padding: 12px 0;
	}
}
#count2,
#count3 {
	font-size: calc(13px + 3 * ((100vw - 320px) / 1120));
}
button.createbtn {
 background: linear-gradient(to bottom, #4e4376 0%,#2b5876 100%);
 border-color: #2b5876;
}

canvas#display {
	max-width: 80vw;
}
.fsize_mini {
	font-size: 13px;
	line-height:1.2;
}

.btn-custom1 {
	background: none;
	border-color: #2b5876;
	color: #2b5876;
}
.btn-custom2 {
	background: linear-gradient(to bottom, #4e4376 0%,#2b5876 100%);
	border-color: #2b5876;
	color: #fff;
}

.btn-custom1:hover, .btn-custom1:focus, 
.btn-custom1:active, .btn-custom1:active:focus, .btn-custom1:active:hover, .btn-custom1:active.focus,
.btn-custom1.active, .btn-custom1.active:focus, .btn-custom1.active:hover, .btn-custom1.active.focus,
.open > .dropdown-toggle.btn-custom1, 
.open > .dropdown-toggle.btn-custom1:hover,
.open > .dropdown-toggle.btn-custom1:focus, 
.open > .dropdown-toggle.btn-custom1.focus,
.btn-custom1.disabled:hover, .btn-custom1[disabled]:hover, fieldset[disabled] .btn-custom1:hover,
.btn-custom1.disabled:focus, .btn-custom1[disabled]:focus, fieldset[disabled] .btn-custom1:focus,
.btn-custom1.disabled.focus, .btn-custom1[disabled].focus, fieldset[disabled] .btn-custom1.focus {
    background: #2b5876;
    color: #fff;
}

.btn-custom1.outline {
    border: 3px solid #103487;
    color: #103487;
}