.no-js {
}

.headline-title
{
    margin: 0;
    padding: 22px 25px 24px 25px;
    font-family: 'Open Sans', Arial, Helvetica, 'Noto Sans TC';
    font-weight: 700;
}


.homescreen
{
    height: 85vh;
}

a:link {
	color: blue;
}

a:visited {
	color: blue;
}

a:hover {
	color: hotpink;
}

a:active {
	color: red;
}

tr.row-link:hover {
	background: #f2f3ff;
	
	cursor: pointer;
}

@media screen and (min-width: 100px) and (max-width: 540px)
{
    .homescreen
    {
        height: 70vh;
    }
}

.fullscr
{
    min-height: 100%;
    height: 100%;
/*            background: rgba(51,51,51,0.7); */
}

img
{
    max-width: 100%;
    height: auto;
}


.textframe
{
    color: white;
    text-shadow:
    -2px -2px 0 #fff,
    2px -2px 0 #fff,
    -2px  2px 0 #fff,
    2px  2px 0 #fff;
}

.blackframe
{
    box-shadow:
    5px  5px 5px #aaa,
    -5px -5px 5px #aaa,
    -5px  5px 5px #aaa,
    5px -5px 5px #aaa;
}

.image_preview
{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.center
{
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

.swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23666666'%2F%3E%3C%2Fsvg%3E") !important;
}

.swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23666666'%2F%3E%3C%2Fsvg%3E") !important;
}

.swiper-container {
	width: 100%;
	height: 300px;
}

.swiper-wrapper {
	width: 100%;
	height: 300px;
}

.swiper-slide {
	width: 100%;
	background-position: center;
	background-size: cover;
}

.quantity-widget
{
	display: inline-block;
	position: relative;
	color: #111;
	font-size: 2em;
}

.input-group .input-group-btn .minus
{
	display: inline-block;
	position: relative;
	margin: 0;
	cursor: pointer;
	color: #333;
	font-weight: bold;
	background-color: transparent;
	border: 1px solid #aaa;
	border-right: 0;
	vertical-align: top;
	border-radius: 0;
}

.input-group .input-group-btn .plus
{
	display: inline-block;
	position: relative;
	margin: 0;
	cursor: pointer;
	color: #333;
	font-weight: bold;
	background-color: transparent;
	border: 1px solid #aaa;
	border-left: 0;
	vertical-align: top;
	border-radius: 0;
}

.input-group .input-group-btn .minus:disabled
{
	color: #aaa;
	border: 1px solid #aaa;
}

.input-group .input-group-btn .plus:disabled
{
	color: #aaa;
	border: 1px solid #aaa;
}

.input-group .qty
{
	display: inline-block;
	position: relative;
	margin: 0;
	background-color: transparent;
	text-align: center;
	border: 1px solid #aaa;
	vertical-align: top;
}

.uploadfile
{
	cursor:pointer;
	overflow:hidden;
	position:absolute;
}

.uploadfile-input
{
	opacity:0;
	-moz-opacity:0;
	position:absolute;
	height:0%;
	width:0%;
	top:0;
	right:0;
	z-index:99;
}

.product_list_cell
{
	padding-top: 5px;
	padding-bottom: 5px;
}

.input_number
{
	width: 80px !important;
	color: #111;
	font-size: 1.5em;
}

.table_top_border
{
	border-top: 1px #000000 solid !important;
}

.table_bottom_border
{
	border-bottom: 1px #000000 solid !important;
}

/*GDPR*/
.cookie_policy{ text-align: center; width:100%; height: auto; padding: 20px 25px; position: fixed; bottom:0; background: rgba(255,255,255,.95); font-size: 14px; line-height: 30px; color: #222; z-index: 9999; border-top: 1px solid #dfdfdf;box-shadow: 0px -4px 5px -3px #8A8A8A;
-webkit-box-shadow: 0px -4px 5px -3px #8A8A8A;
-moz-box-shadow: 0px -4px 5px -3px #8A8A8A;
-o-box-shadow: 0px -4px 5px -3px #8A8A8A;}
.btn_cookie_policy{ cursor: pointer; text-align: left; width: 100px; height: 40px; color: #fff; border: 0; background: url(images/checked.svg) 15px center no-repeat #666; background-size: 15px; padding-left: 40px; transition: 0.5s;letter-spacing: .2px; }
.btn_cookie_policy:hover{ background: url(images/checked.svg) 15px 10px no-repeat #333; background-size: 15px;}
.btn_cookie_policy_box{ display:inline-block; width: 100px; height: 40px; margin: 0 auto; margin-left: 15px;}


.product_amount
{
}

.product_price
{
}

.order_discount
{
}

.shopcom-no
{
	display: none  !important;
}

.shopcom-only
{
}

.member_readonly
{
}

.member_update
{
}

.nav-tabs .nav-link:not(.active) {
	border-color: transparent !important;
}


:target::before {
  content: "";
  display: block;
  height: 80px;
  margin: -80px 0 0;
}

a.fill-div {
	display: block; 
	height: 100%;
	width: 100%;
	text-decoration: none;
}

a.fill-menu {
	display: block; 
	height: 100%;
	width: 100%;
	text-decoration: none;
}

a.fill-menu:hover {
/*	background: #f8f8f8; */
	
	cursor: pointer;
}

[data-toggle='collapse'].collapsed .if-not-collapsed {
	display: none;
}

[data-toggle='collapse']:not(.collapsed) .if-collapsed {
	display: none;
}

.product-zoom {
}

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #fff;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}


.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

#main {
  transition: margin-left .5s;
  padding: 16px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}






.tree-caret {
  cursor: pointer;
  user-select: none; /* Prevent text selection */
}

.tree-caret::before {
  content: "\25B6";
  color: black;
  display: inline-block;
  margin-right: 2px;
}

.tree-caret-down::before {
  transform: rotate(90deg);
}

.tree-leaf-caret::before {
  content: "\26ac";
  color: black;
  display: inline-block;
  margin-right: 2px;
}

.tree-item::before {
  content: "\00a0";
}

.tree-item::after {
  content: "\00a0";
}


/*
.shopcom-no
{
}

.shopcom-only
{
	display: none  !important;
}
*/

.ui-dialog
{
	z-index:100100 !important;
}

.ui-widget-overlay
{
	opacity: 0.5 !important;
	background: rgb(50, 50, 50) !important;
	filter: Alpha(Opacity=50) !important;
}

.dialogWithDropShadow
{
	-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);  
	-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5); 
}