html {
	height: 100%;
}
body {
	height: 100%;
	margin: 0;
}
.head-navi{
	position:fixed;
	top:10px;
	z-index:99;
	right:50px;
}
@media only screen and (max-width:736px) {
	.head-navi{
		display:none;
	}
}
.head-navi ul li{
	float:left;
	font-size:13px;
	margin-left:15px;
}
.head-navi ul li a{
	color:#333 !important;
}
.head-navi ul li a:before{
	content:">";
	display:inline-block;
	transform:scale(0.7,1);
	margin-right:5px;
}
.centre {
	text-align: center;
}
input[type=text].type-box, input[type=password].type-box, input[type=email].type-box {
	padding: 10px;
	box-sizing: border-box;
	background: #EEE;
	width: 100%;
	border: none;
	border-radius: 30px;
	font-size: 16px;
}
input[type=submit].type-ok {
	padding: 10px;
	box-sizing: border-box;
	background: #F05A28;
	width: 100%;
	border: none;
	border-radius: 30px;
	font-size: 16px;
	color: #FFF;
	font-weight: bold;
	letter-spacing: 3px;
}
.search-box{
	position:relative;
	margin:0 auto 10px auto;
	max-width:736px;
	padding:0 15px;
}

input[type=submit].scope {
	position:absolute;
	right:25px;
	top:7px;
	text-indent:-999em;
	background:url(../img/icon/icon-scope.png) no-repeat;
	background-size:20px;
	width: 20px;
	height:20px;
	border: none;
	z-index:7;
}
@media only screen and (max-width:736px) {
input[type=text].type-box, input[type=password].type-box {
	font-size: 14px;
	padding: 7px;
}
.search-box input[type=text]{
	font-size:13px;
	padding:7px 14px;

}
}
/*=============================================================*/
#wrapper,
#list {
	max-width: 736px;
	margin: 0 auto 0 auto;
	padding-bottom: 120px;
}
h1.logo {
	text-align: center;
	padding: 75px 0;
    color: #F05A28;
    font-size: 20px;
    font-weight: bold;
}
h1.logo img {
	max-width: 35%;
}
@media only screen and (max-width:736px) {
h1.logo {
	padding: 0 0 50px 0;
	margin: 0 auto;
    font-size: 16px;
}
h1.logo img {
	max-width: 100%;
}
#wrapper {
	margin: 10px 15px 0 15px;
	padding-bottom:60px
}
#list{
	margin: 0;
	padding-bottom:50px
}
p {
	font-size: 13px;
}
}
table.table {
	width: 100%;
	margin: 0 0 25px 0;
}
table.table th {
	padding: 20px;
}
table.table.under th {
	border-bottom: 1px solid rgba(236,125,99,.2);
	color: #F05A28;
}
table.table.under td iframe {
	width: 100%;
	height: 250px;
	margin: 10px 0 0 0;
}
table.table td {
	padding: 10px;
}
table.table span.must {
	float: right;
	border: 1px solid #F30;
	color: #F30;
	font-size: 13px;
	padding: 3px;
	border-radius: 5px;
	font-weight: normal;
}
table.table td label {
	margin: 0 10px 0 5px;
}
@media only screen and (max-width:736px) {
table.table th {
	padding: 10px 0 0 0;
	display: block;
	font-size: 13px;
}
table.table td {
	padding: 7px 0;
	display: block;
	font-size: 14px;
}
table.table span.must {
	font-size: 11px;
	position: relative;
	top: -3px;
	padding: 1px 3px;
}
}


ul#gnav {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #F5835F;
	box-shadow: 0 0 2px #F05A28;
}
ul#gnav li {
	float: left;
	width:20%;
}
ul#gnav li a {
	display: block;
	padding: 10px 0;
}
ul#gnav li a p {
	text-align:center;
	color:#FFF;
	font-size:12px;
}
@media only screen and (max-width:736px) {
	ul#gnav li a p {
		display:none;
	}
}
ul#gnav li a.active {
	background: rgba(240,90,40,1);
}
ul#gnav li a img {
	height: 30px;
	display: block;
	margin: 0 auto;
}
/*NAV HEADER*/

.overlay {
	content: "";
	display: block;
	width: 0;
	height: 0;
	background-color: rgba(0, 0, 0, 0.8);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9;
	opacity: 0;
	transition: opacity .5s;
}
.overlay.open {
	width: 100%;
	height: 100%;
	opacity: 1;
}
.menu-trigger {
	display: inline-block;
	width: 20px;
	height: 20px;
	vertical-align: middle;
	cursor: pointer;
	position: fixed;
	top: 13px;
	right: 15px;
	z-index: 100;/*   transform: translateX(0);
  transition: transform .5s;
 */
}
/* .menu-trigger.active {
  transform: translateX(-250px);
}
 */.menu-trigger span {
	display: inline-block;
	box-sizing: border-box;
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: #F05537;
	transition: all .5s;
	z-index: 99;
}
.menu-trigger.active span {
	background-color: #F05537;
}
.menu-trigger span:nth-of-type(1) {
	top: 0;
}
.menu-trigger.active span:nth-of-type(1) {
	transform: translateY(6px) rotate(-45deg);
}
.menu-trigger span:nth-of-type(2) {
	top: 6px;
}
.menu-trigger.active span:nth-of-type(2) {
	opacity: 0;
}
.menu-trigger span:nth-of-type(3) {
	top: 12px;
}
.menu-trigger.active span:nth-of-type(3) {
	transform: translateY(-6px) rotate(45deg);
}
main {
	padding: 60px 0 0 0;
}
nav#topnav {
	width: 250px;
	height: 100%;
	padding-top: 50px;
	background: #FFF;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 99;
	transform: translate(250px);
	transition: all .5s;
}
nav#topnav p{
	margin:0 20px 20px 20px;
    color: #F05537;
    font-weight: bold;
}
nav#topnav.open {
	transform: translateZ(0);
}
nav#topnav li {
	color: #333;
	font-size: 14px;
	padding:5px 20px;
}
/*nav#topnav li:nth-child(1),
nav#topnav li:nth-child(2){
	display:none;
}*/
@media only screen and (max-width:736px) {
nav#topnav li:nth-child(1),
nav#topnav li:nth-child(2){
	display:block;
}
}

/*customize section*/
article.text-inside p {
	overflow-wrap: break-word;
	white-space: pre-wrap;
}

p.e-pic img {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

.login-section, .register-section {
	margin: 0 auto 20px auto !important;
}

div.alert {
	margin-top: 10px;
}
.alert-success {
	color: #1d643b;
	background-color: #d7f3e3;
	border-color: #c7eed8;
}
.alert-danger{
	color:#761b18;
	background-color:#f9d6d5;
	border-color:#f7c6c5
}
.alert-warning{
	color:#857b26;
	background-color:#fffbdb;
	border-color:#fffacc
}

.alert-info{
	color:#385d7a;
	background-color:#e2f0fb;
	border-color:#d6e9f9
}

.alert {
	position: relative;
	padding: .75rem 1.25rem;
	margin-bottom: 1rem;
	border: 1px solid transparent;
	border-radius: .25rem;
}

p.error-text {
	color: #F05A28;
}

a.link-content {
	color: #333333 !important;
	display: inline !important;
	overflow: unset !important;
	clear: none !important;
	padding: unset !important;
	position: unset  !important;
	text-decoration: underline;
}

.text-right {
	text-align: right;
}

.w50 {
	width: 50px;
}

.w70 {
    width: 70px;
}

.w100 {
	width: 100px;
}

.price {
	font-weight: bold;
	margin: 10px 0;
}

.price span{
	font-size: 16px
}

.price del{
	font-size: 14px
}

.product-divide {
	margin-top: 10px;
}

.product-quantity {
	margin: 10px 0;
}

@media only screen and (max-width:736px) {
	.price span{
		font-size: 14px
	}
	.price del{
		font-size: 12px
	}
}

.t-bold {
	font-weight: bold;
}

/*customize section*/