@charset "UTF-8";
/* CSS Document */

* {box-sizing: border-box;}

.btn { -webkit-transition-duration: 0.4s; /* Safari */ transition-duration: 0.4s; border:none; border-radius:12px;  padding: 1.5px 30px 1.5px 30px; font: 12px / 1.2; color:#fff; background: linear-gradient(90deg,#b7b0b0,#666662); /* blue */}

.btn:hover { background: linear-gradient(90deg,#595959,#666662); /* white */ color: #f85811; /*box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19); */cursor:pointer;}

.banner {
	
	padding-top:10px;
	padding-bottom:0px;
	
}
	
.sec1 {
	
	padding-top:10px;
	padding-bottom:0px;
	
}
	
.sec1 .breadcrumb{
	list-style: none; 
    overflow: hidden; 
   color: #fff;
	background:linear-gradient(90deg,#b7b0b0,#666662);
	
	
}


.sec1 h1{
	
	
	font-size:3em !important;
	font-weight:bold;
	font-family: Helvetica Neue, Helvetica, Arial, 微软雅黑;
}
	

.sec1 .breadcrumb li { 
  float: left; 
}
.sec1 .breadcrumb li a {
  color: white;
  text-decoration: none; 
  /*padding: 10px 0 10px 65px;*/
  background:linear-gradient(90deg,#b7b0b0,#666662);   /* fallback color */
  position: relative; 
  display: block;
  padding-left: 65px;
  padding-top: 10px;
  padding-bottom: 10px;
  float: left;
}	

.sec1 .breadcrumb li a::before { 
  content: " "; 
  display: block; 
  width: 0; 
  height: 0;
  border-top: 50px solid transparent;       
  border-bottom: 50px solid transparent;
  border-left: 30px solid white;	
  position: absolute;
  top: 50%;
  margin-top: -50px; 
  margin-left: 1px;
  left: 100%;
  z-index: 1; 
}
.sec1 .breadcrumb li a::after { 
  content: " "; 
  display: block; 
  width: 0; 
  height: 0;
  border-top: 50px solid transparent; /* Go big on the size, and let overflow hide */
  border-bottom: 50px solid transparent;
  border-left: 30px solid #666662;
  position: absolute;
  top: 50%;
  margin-top: -50px; 
  left: 100%;
  z-index: 2; 
}	
	
.sec1 .breadcrumb li a:hover { 
	color: #f85811;
  background-color: #666662; 
}
.sec1 .breadcrumb li a:hover:after { 
  border-left-color: #666662 !important; 
}
.sec1 .breadcrumb li:first-child a {
  padding-left: 30px;
}
	
.clearfix {
	clear:both;
	
}
.column {
  float: left;
  width: 100%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}


.touchpoints li.cur:hover {
    background: linear-gradient(90deg,#b7b0b0,#666662); 
}

.alignleft {
	float:left;	
}


.alignright {
	float:right;	
}


.hh1 {
	
	float:left;
	padding-top:10px;
	/*padding-left:15px;*/
	/*border: 1px solid #434343;*/
	display:inline-block;
}

.hh2 {
	padding-top:40px;
	text-align:center;
	
}

.hh3 {

	padding-top:10px;
	padding-right:0;
	display: block;
	/*position:fixed;*/
	float:right;
	right:0%;
	/*background:#linear-gradient(90deg,#b7b0b0,#666662);*/
}

.link_selector {
	padding-top:10px;
	
}

.hh_selector {
	float:left;
	left:50%;
	padding-bottom:10px;	
	display: inline-block;
}

.h_search {
	padding-top:10px;
	padding-bottom:10px;
	
}
.center_block {
	text-align:center;
	
}

.link_indicator {
	border-bottom:#rgba(255, 213, 55, 1) 3px solid; 
	padding-bottom:3px;
	
}

/* reset webkit search input browser style */
input {
	outline: none;
}
input[type=search] {
	-webkit-appearance: textfield;
	-webkit-box-sizing: content-box;
	font-family: inherit;
	font-size: 100%;
}
input::-webkit-search-decoration,
input::-webkit-search-cancel-button {
	display: none; /* remove the search and cancel icon */
}

/* search input field */
input[type=search] {
	background: #ededed url(../images/search-icon.png) no-repeat 9px center;
	border: solid 1px #ccc;
	padding: 9px 10px 9px 32px;
	width: 100px;
	
	-webkit-border-radius: 10em;
	-moz-border-radius: 10em;
	border-radius: 10em;
	
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	transition: all .5s;
}
input[type=search]:focus {
	width: 200px;
	background-color: #434343;
	border-color: #aa1428; /* #A21F2C */
	
	-webkit-box-shadow: 0 0 5px linear-gradient(90deg,#b7b0b0,#666662);/*rgba(170,24,44,.5); */
	-moz-box-shadow: 0 0 5px linear-gradient(90deg,#b7b0b0,#666662);
	box-shadow: 0 0 5px linear-gradient(90deg,#b7b0b0,#666662);
}

input:-internal-autofill-selected {
    background-color: #rgba(255, 213, 55, 1) !important;
    background-image: none !important;
    color: rgb(0, 0, 0) !important;
}

/* placeholder */
input:-moz-placeholder {
	color: #999;
}
input::-webkit-input-placeholder {
	color: #999;
}

.tp:focus {
	
	border-color: #aa1428; /* #A21F2C */
	
	-webkit-box-shadow: 0 0 5px linear-gradient(90deg,#b7b0b0,#666662); /*rgba(170,24,44,.5); */
	-moz-box-shadow: 0 0 5px linear-gradient(90deg,#b7b0b0,#666662);
	box-shadow: 0 0 5px linear-gradient(90deg,#b7b0b0,#666662);
}

.dropbtn {
	font: 16px;
	width:100px;
	height:30px;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
	
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 14343430;
	float:left;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: rgb(189, 212, 222);
}

.step_grad {
    background: #ab1a2d; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#b4b4b2, #ab1a2d); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#b4b4b2, #ab1a2d); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#b4b4b2, #ab1a2d); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#b4b4b2, #ab1a2d); /* Standard syntax */


}

.step_grad2 {
    background: #ab1a2d; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#b4b4b2, #ab1a2d); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#b4b4b2, #ab1a2d); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#b4b4b2, #ab1a2d); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#b4b4b2, #ab1a2d); /* Standard syntax */
}

.jplist .block {
	width:100%;	
	
}

.jplist-panel .jplist-views {
    float: none ;
}

.jplist-thumbs-view .list-item {
    width: 31% !important;
}
.jplist-list-view .list-item {
	border-color:#aaa;
	
	border-bottom: 1px solid;
	margin-top:10px;
	margin-bottom:10px;
	padding: 5px 5px;

}

.jplist-list-view .img {
	display:none;
	
}
.jplist-grid-view .img {
	display:block;
	
}

.jplist-grid-view .list-item .img {
	max-height:260px;
    /*width: 260px !important; */ 
   
}


.jplist-thumbs-view .list-item .block {
	padding: 5px 5px;
}
.jplist-grid-view .list-item .block {
	
	
	
}


.jplist-list-view .list-item .period {
	font-weight:bold;
	font-size:1.2em;
	color:#434343;
}

.jplist-grid-view .list-item .period {
	font-weight:bold;
	font-size:1.2em;
	color:#434343;
}
.jplist-thumbs-view .list-item .period {
	font-weight:bold;
	font-size:1.2em;
	color:#434343;
}

.jplist-list-view .list-item .artist {
	float:left;
	font-size:1.2em;
	font-weight:bold;
	padding-right:10px;
	color:#434343;
	
}
.jplist-grid-view .list-item .artist {

	font-weight:bold;
	font-size:1.2em;
	color:#434343;
}
.jplist-thumbs-view .list-item .artist {
	font-weight:bold;
	font-size:1.2em;
	color:#434343;
}


.jplist-list-view .list-item .item {
	float:left;
	font-weight:bold;
	font-size:1.2em;
	padding-right:10px;
	color:#434343;
}

.jplist-grid-view .list-item .item {
	
	font-weight:bold;
	font-size:1.2em;
	color:#434343;
}

.jplist-thumbs-view .list-item .item {
	font-weight:bold;
	font-size:1.2em;
	color:#434343;
}

.jplist-list-view .list-item .materials {
	float:left;
	padding-right:10px;

}

.jplist-grid-view .list-item .materials {
	
	padding-right:10px;
}

.jplist-list-view .list-item .size {
	float:left;
	
}

.jplist-grid-view .list-item .size {
	float:left;
	
}


.jplist-list-view .list-item .estimate_price {
	float:left;
	
	font-size:1em;
	
}
.jplist-grid-view .list-item .estimate_price {
	float:left;
	
	font-size:1em;
	
}
.jplist-thumbs-view .list-item .estimate_price {
	font-size:1em;
	
}

.jplist-list-view .list-item .price {
	float:right;
	color:#ff530d;
	font-size:1em;
	
	
}
.jplist-grid-view .list-item .price {
	
	float:right;
	color:#ff530d;
	font-size:1em;
	
}
.jplist-thumbs-view .list-item .price {
	color:#ff530d;
	font-size:1em;
}

.jplist-grid-view .list-item {
	border-color:#aaa;
	border-bottom: 1px solid;
	margin-top:10px;
	margin-bottom:10px;
	float:left;
	display:table-cell;

}
.jplist-thumbs-view .list-item {
	border-color:#f0f0f0;
	border-radius: 15px 15px 15px 15px;
	border: 1px solid;
	margin-top:10px;
	margin-bottom:10px;
	padding: 5px 5px;

}
.jplist-thumbs-view .img {
	margin-left:auto;
	margin-right:auto;
}


.jplist-thumbs-view .img img {
	width:100%;
	display:inline;
	border-radius: 15px 15px 15px 15px;
	
}

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


.hh3 a.la {
	
	}


.auct {
	
	font-size:0.8em;
}

/*replace announcement page table color*/
.table>thead>tr>td.info, .table>tbody>tr>td.info, .table>tfoot>tr>td.info, .table>thead>tr>th.info, .table>tbody>tr>th.info, .table>tfoot>tr>th.info, .table>thead>tr.info>td, .table>tbody>tr.info>td, .table>tfoot>tr.info>td, .table>thead>tr.info>th, .table>tbody>tr.info>th, .table>tfoot>tr.info>th {
	background-color:#aa1428 !important;
	color:#434343;
}

@media only screen and (min-width: 600px)
{
.jplist-grid-view .list-item .img {
	width:200px !important;
	
}

.jplist-thumbs-view .list-item {
	width:42% !important;

}
.lot-display {
	
	display:block;
	margin-right:auto;
	margin-left:auto;
	width:auto;
}

.lot_desc
{
	width:auto;
	
}


}
@media only screen and (min-width: 600px)
{
.jplist-thumbs-view .list-item {
	
	width:100% !important;
}

.lot-display {
	
	display:block;
	margin-right:auto;
	margin-left:auto;
	width:auto;
}
  .square-box a{
	font-size:1em !important;
	
}

}
@media only screen and (min-width: 800px)
{
.lot-display {
	
	display:block;
	margin-right:auto;
	margin-left:auto;
	width:100%;
}

.lot_desc {

display:inline;
float:left;
width:50%;

}
  .square-box a{
	font-size:1em !important;
	
}


}
@media only screen and (max-width: 999px)
{
.hh3 a.langselector {
font: 16px/2.5 "Noto Sans TC", "arial", "微软雅黑";
}
.hh3 .divider{display:inline; visibility: hidden;}	
	
}
@media only screen and (min-width: 1434343px)
{
.lot-display {
	
	display:block;
	margin-right:auto;
	margin-left:auto;
	width:900px;
}

.lot_desc {

display:inline;
float:left;
width:50%;

}
  .square-box a{
	font-size:1.1em !important;
	
}
a {
	
font: 12px/1 "Noto Sans TC", "arial", "微软雅黑";
	
}
.hh3 a {
font: 14px/1 "Noto Sans TC", "arial", "微软雅黑";
}
.hh3 a.langselector {
font: 16px/1.5 "Noto Sans TC", "arial", "微软雅黑";
}	
.hh3 .divider{display:inline;visibility: visible;}		
	
}
@media only screen and (min-width: 801px)
{
.hh3 a {
font: 14px/1 "Noto Sans TC", "arial", "微软雅黑";
}
.hh3 a.langselector {
font: 16px/1.5 "Noto Sans TC", "arial", "微软雅黑";
}	
}


@media only screen and (max-width: 1199px)
{
.hh3 a {
font: 14px/1 "Noto Sans TC", "arial", "微软雅黑";
}
.hh3 a.langselector {
font: 16px/2.5 "Noto Sans TC", "arial", "微软雅黑";
}
}
@media only screen and (min-width: 1200px){
.hh1 a {
font: 18px/1.5 "Mulish", "Noto Sans TC", "arial", "微软雅黑";
font-weight:700;
}	
.hh3 a {
font: 16px/1.5 "Noto Sans TC", "arial", "微软雅黑";
}
.hh3 a.langselector {
font: 16px/1.5 "Noto Sans TC", "arial", "微软雅黑";
}

.jplist-thumbs-view .list-item {
	
	width:28% !important;
}

.lot-display {
	

	margin-right:auto;
	margin-left:auto;
	width:100%;
	margin-bottom:20px;
}

.img-magnifier-container {
display:inline-block;
}
.lot_desc {
float:right;
display:inline-block;
width:50%;

}

  .square-box a{
	font-size:1.3em !important;
	
}
a {
	
	font: 14px/1.5  "Noto Sans TC", "arial", "微软雅黑";
	
	
}
.bottom_link dl dt {
	font: 18px/1.5  "Noto Sans TC", "arial", "微软雅黑";
}

}

.callout {
  position: fixed;
  bottom: 0px;
  left: 0px;
 
  width:100%;
  background:rgba(245, 245, 245,.8);  /* fallback color */
  z-index:99999;
}

.callout-header {
  padding: 25px 15px;
  
  font-size: 30px;
  color: white;
}

.callout-container {
  padding: 15px;
  
  color: #434343;
}

.closebtn {
  position: absolute;
  top: 5px;
  right: 15px;
  color: white;
  font-size: 30px;
  cursor: pointer;
}

.closebtn:hover {
  color: lightgrey;
}

.cookie-msg {
    position: fixed;
    bottom: -100%;
    left: 0;
    right: 0;
	background:#eeeeee;
	
	padding: 15px 15px;
	-webkit-transition: 400ms;
	-o-transition: 400ms;
	transition: 400ms;
	
}

.cookie-msg.activebanner {
  bottom: 0;
}

.cookie-msg p{
	color:#2F2F2F;
	display:inline-block;

}
.cookie-msg a {font: 13px/1 "Noto Sans JP", "Noto Sans TC", "arial", "微软雅黑";color:linear-gradient(90deg,#b7b0b0,#666662);}
.cookie-btn {
	background: rgb(255,255,255);
	border:0;
	color:#2F2F2F;
	padding: 10px 10px;
	font: 14px/1 "Noto Sans JP", "Noto Sans TC", "arial", "微软雅黑";
	border-radius: 10px;
	cursor:pointer;
	float:right;
	display:inline-block;

}

#loader {
	width:100px;
	height:100px;
	position: fixed;
	top:50%; 
	left:50%;
	transform: translate(-50%, -50%);
	z-index:10;
	overflow: hidden;
}

.loaderDiv {
	width: calc(100% - 16px);
	height: calc(100% - 16px);
	border: 4px solid #eeeeee;
	border-top: 4px solid #aa1428;
	border-radius: 50%;
	animation: rotate 2s linear infinite;
	
}

@keyframes rotate {
	100% {transform: rotate(360deg);}
	
}

.smr {
	/*margin: 15px 15px 0;*/
	padding: 0;
	display:inline-block;
}
.smr:last-child {
	padding-bottom: 0;
}
.smr::after {
	content: '';
	clear: both;
	display: block;
}
.smr div {
	position: relative;
	float: left;
	margin: 0 0 0 5px;
	padding: 0;
	display:inline;
}
.smr div:first-child {
	margin-left: 0;
}
.smr div span {
	position: absolute;
	top: -100px;
	left: 0;
	z-index: 0;
	display: block;
	width:100%;
	margin: 0;
	padding: 0;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity: 0;
}
figure {
	
	margin: 0;
	padding: 0;
	overflow: hidden;
}
figure:hover+span {
	top: -100px;
	opacity: 1;
	z-index:100;
	display:block;
	
	width:100px;
}