@charset "utf-8";

* {font-family: tahoma;}
body {text-align: center; height: 100%; width: 100%; overflow: auto; overflow-x: hidden; font-size: 16px;}
h3 {font-size: 24px; font-family: Times New Roman;}
div {display: block; overflow: auto; box-sizing: border-box;}
a {cursor: pointer;}

/* The emerging W3C standard that is currently Firefox-only */
* {scrollbar-width: thin; scrollbar-color: #000000 #b2b2b2;}
/* Works on Chrome/Edge/Safari */
*::-webkit-scrollbar {width: 12px;}
*::-webkit-scrollbar-track {background: #b2b2b2;}
*::-webkit-scrollbar-thumb {background-color: #000000; border-radius: 5px; border: 3px solid #000000;}

.clear {clear: both;}
.mr_wrap {padding: 20px; max-width: 1200px; margin: 20px auto; box-shadow: 0 0 5px #eee;}
.mr_top_box, .mr_middle_box, .mr_bottom_box {padding: 10px;}
.mr_pallet_cell_link {position: absolute; z-index: 10; top: 0; right: 0; bottom: 0; left: 0;}

.mr_pallet_cell {display:inline-block; width: 155px; padding: 10px; position: relative;}
.mr_pallet_cell_title {display: inline-block; align-items: baseline; color: #fff; font-weight: lighter;}
.mr_pallet_cell_holder {border: 5px solid #fff;}
.mr_pallet_cell:hover .mr_pallet_cell_title, .mr_pallet_cell_check .mr_pallet_cell_title {color: #4d4d4d;}
.mr_pallet_cell:hover .mr_pallet_cell_holder, .mr_pallet_cell_check .mr_pallet_cell_holder {border-color: #bf0004;}
.mr_pallet_cell_split {float: left; width: 33.33%; height: 36px;}

.mr_image_holder {position: relative; float: left; width: 49%; height: 420px; line-height: 0; padding: 10px; background-position: top left; background-repeat: repeat; background-size: 100% auto;}
.mr_image_holder_title {position: absolute; z-index: 9; top: 0; right: 0; width: 100%; padding: 30px 20px; background-color: rgba(0, 0, 0, 0.5); text-align: left; color: #fff; font-weight: bold; font-size: 18px;}
.mr_image_holder_title span { font-weight: lighter; padding-left: 10px;}
.mr_image_holder img {position: absolute; z-index: 5; bottom: 0; right: 0; width: 100%; height: auto;}

.mr_big_pallet {float: right; width: 49%; overflow-y: hidden; overflow-x: scroll;}
.mr_each_pallet {display: none; height: 412px; width: 1700px; overflow: auto;}
.mr_each_pallet_cell {position: relative; overflow: visible; float: left; width: 108px; height: 64px; border: 1px solid #fff;}
.mr_each_pallet_cell_frame {display: none; position: absolute; z-index: 5; top: -5px; right: -5px; bottom: -5px; left: -5px; border: 5px solid #fff; box-shadow: 0 -3px 3px #eee;}
.mr_each_pallet_cell_title {display: none; position: absolute; z-index: 5; right: -5px; bottom: -25px; left: -5px; padding: 5px; background-color: #fff; font-size: 12px;}
.mr_each_pallet_cell_title span{display: block; font-size: 11px;}
.mr_each_pallet_cell:hover .mr_each_pallet_cell_frame, .mr_each_pallet_cell:hover .mr_each_pallet_cell_title {display: block;}

.mr_pattern_cell {position: relative; width: 140px; height: 180px; padding: 20px;}
.mr_pattern_cell img {width: 100%;}

@media only screen and (max-width: 800px) {
.mr_image_holder {width: 100%;}
.mr_big_pallet {width: 100%; margin-top:20px;}
}