/* 20210719 #GOG-102 */

/* 20190821 Jane 新增 */
.mark,
.mdbox {
    transform: translate3d(0px, 0px, 0px);
}


.iconlinks a.i_d05.off1 {
    background-image: url(../theme/tw/images/content/icon_d05.png);
}

.iconlinks a.i_d05.off {
    background-image: url(../theme/tw/images/content/icon_d05_3.png) !important;
}

#canvasAreaBottom {
    z-index: 98;
    position: absolute;
}

#canvasArea {
    z-index: 99;
    position: absolute;
}

#canvasArea .canvas-container,
#canvasAreaBottom .canvas-container {
    position: absolute !important;
    top: 0;
}

.slash {
    animation: slash 1.2s ease;
    -webkit-animation: slash 1.2s ease;
    -moz-animation: slash 1.2s ease;
    -ms-animation: slash 1.2s ease;
}

@keyframes slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.1);
    }

    100% {
        background-color: transparent;
    }
}

@-webkit-keyframes slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.1);
    }

    100% {
        background-color: transparent;
    }
}

@-moz-keyframes slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.1);
    }

    100% {
        background-color: transparent;
    }
}

@-ms-keyframes slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.1);
    }

    100% {
        background-color: transparent;
    }
}

.iconSlash {
    animation: icon_slash 2s ease;
    -webkit-animation: icon_slash 2s ease;
    -moz-animation: icon_slash 2s ease;
    -ms-animation: icon_slash 2s ease;
}

@keyframes icon_slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.4);
    }

    100% {
        background-color: transparent;
    }
}

@-webkit-keyframes icon_slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.4);
    }

    100% {
        background-color: transparent;
    }
}

@-moz-keyframes icon_slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.4);
    }

    100% {
        background-color: transparent;
    }
}

@-ms-keyframes icon_slash {
    0% {
        background-color: transparent;
    }

    50% {
        background-color: rgba(255, 221, 51, 0.4);
    }

    100% {
        background-color: transparent;
    }
}

/* 螢光筆 */
.btns a.i_d11 {
    background-image: url(../theme/tw/images/content/mbk_i_d11.png);
}

/* 文字 */
.btns a.i_d12 {
    background-image: url(../theme/tw/images/content/mbk_i_d12.png);
}

.pentype .tf.color {
    margin-top: 3.5px !important;
    cursor: pointer;
}

.fontsize {
    margin-left: 20px;
    height: 25px;
    position: absolute;
    border-radius: 5px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.9375em;
}

input.fontsize {
    z-index: 1;
    padding-left: 20px;
    width: 50px;
    border: none;
}

/* IE 移除INPUT內的x鈕*/
input.fontsize::-ms-clear,
input.mobile_fontsize::-ms-clear {
    display: none;
}


select.fontsize {
    height: 30px;
    width: 100px;
    padding-left: 14px;
}

/* IE 防止點選OPTION後背景變為藍色*/
select.fontsize:focus::-ms-value {
    background: #FFFFFF;
    color: #000000;
}

.lrSwitch {
    color: #FFFFFF;
    background-color: transparent;
    border-radius: 50px;
    border: 0.5px solid #FFFFFF;
    height: 30px;
    width: 50px;
}

#clist03box .lrSwitch {
    margin-top: 3.5px;
    float: right;
}

.mobile_fontsize {
    padding-left: 15px;
    position: absolute;
    margin-left: 10px;
    width: 25%;
    height: 25px;
    margin-top: 3.5px;
}


#clist03box .pentype .tf.color {
    width: 32px;
}

#clist03 .pentype .tf.color {
    width: 23%;
    height: 70px;
    float: right;
}


#clist03box .tfbar {
    margin-top: 15px;
}

.mobile_show ul a:active {
    background-color: rgba(0, 0, 0, 0.1);
    box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.2);
}

.mobile_save,
.mobile_brush,
.mobile_save a::before,
.mobile_brush a::before,
.mobile_save a::after,
.mobile_brush a::after {
    -webkit-transition: all 0.5s;
    /* Safari prior 6.1 */
    transition: all 0.5s;
}

.mobile_show .mobile_brush .on {
    background-color: white;
    color: #2e3233;
}

.mobile_show .mobile_save a::before,
.mobile_show .mobile_save a::after {
    content: '';
    background: none;
}

.mobile_show .pentype li {
    padding: 2px 0px 2px 10px;
}


.mobile_icon {
    width: 15px;
    height: 15px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.mobile_disable {
    background-color: rgba(100, 100, 100, 0.8);
    color: rgb(45, 45, 45);
}

.mobile_disable a::before,
.mobile_disable a::after {
    background: #FFFFFF !important;
    width: 18px;
    margin-top: 0px;
    right: 15px;
}

.mobile_disable a::before {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
}

.pop_wrap {
    margin: 0px auto;
    top: 0;
    left: 0;
}

.popbox {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: fixed;
}

#clist03 .i_radio {
    display: none;
}

#clist03 .pentype.blushType li {
    display: inline;
    background: transparent;
    box-shadow: none;
    width: 10%;
    padding: 5px 4%;
    min-width: 40px;
}

#clist03 .pentype.blushType img {
    padding: 7.5px;
}

#clist03 .pentype.blushType input:checked+label img {
    background: rgba(0, 0, 0, 0.5);
    box-shadow: inset 5px 5px 10px rgba(0, 0, 0, 0.5);
}

@media(max-width:850px) {
    .popbox {
        width: 90%;
        max-width: 400px;
    }

    .pentype li {
        padding: 4px 0px 4px 5%;
    }



    #auto04 > .tool_autoHide {
        display: none;
    }
}

.colorpicker_field {
    display: none;
}

.colorpicker_hex {
    top: 110px;
}

.colorpicker_current_color {
    left: 213px;
    top: 55px;
    width: 72px;
}

.colorpicker_new_color {
    width: 72px;
}

.colorpicker_submit {
    left: 239px;
}

.colorpicker {
    width: 298px;
}


.mobile_show .tool_autoHide.off .autoHide_hide {
    display: none !important;
}

.mobile_show .tool_autoHide.off .autoHide_show {
    display: block !important;
}

.mobile_show .tool_autoHide .autoHide_hide {
    display: block !important;
}

.mobile_show .tool_autoHide .autoHide_show {
    display: none !important;
}

.i_d05.off span.i_d05_hideAll,
.i_d05.off1 span.i_d05_hideUser,
.i_d05 .i_d05_showAll {
    display: block;
}

.mobile_show .i_d05.off span.i_d05_hideAll,
.mobile_show .i_d05.off1 span.i_d05_hideUser,
.mobile_show .i_d05 .i_d05_showAll {
    display: inline;
}

.i_d05 span,
.i_d05.off .i_d05_showAll,
.i_d05.off1 .i_d05_showAll {
    display: none;
}



#clist03 .pentype02 .sdbar {
    width: 70%;
}

@media(max-width:300px) {
    #clist03 .pentype02 .sdbar {
        width: 55%;
    }
}

#clist02box textarea,
#clist03box textarea {
    min-height: 50px;
    height: 20%;
}

#sendbox .popbox {
    width: 340px;
}

@media(max-width:360px) {
    #sendbox .popbox {
        width: 90%;
    }
}

#sendbox .popbox .popinfo {
    padding-bottom: 15px;
}

.i_d06 .mobile_icon {
    background-image: url(../theme/tw/images/content/icon_d06_m.png);
}

.i_d07 .mobile_icon {
    background-image: url(../theme/tw/images/content/icon_d07_m.png);
}

.i_d13 .mobile_icon {
    background-image: url(../theme/tw/images/content/icon_d08_m.png);
}

.btns a.i_d01 {
    background-image: url(../theme/tw/images/content/mbk_i_d02_2.png);
}

.btns a.i_d13 {
    background-image: url(../theme/tw/images/content/mbk_i_d02_1.png);
}

#invoiceTypeContent .tfbar {
    padding: 0px;
}

#invoiceTypeContent span {
    width: 75px;
    display: inline-block;
}

#invoiceTypeContent .tf.tf_m {
    width: calc(100% - 80px);
}

#MobileinvoiceTypeContent .tf.tf_m {
    width: 100%;
}

#m10cont .title em {
    font-family: '微軟正黑體', Arial, Helvetica, sans-serif;
}

.popbox b {
    top: 0px;
}

#cReclist .fy_bd .bk_clist li em {
    font-size: 1em;
}

.popbox .tfbar textarea.tf {
    height: auto;
    padding: 0px 5px;
}

@media(max-width:850px) {
    #cReclist .fy_bd {
        padding-bottom: 20px;
    }
}

/* 音樂播放器 */
#pop_music .green-audio-player {
    padding: 0px 5px;
    width: 100%;
    background-color: transparent;
    box-shadow: none;
}

@media (max-width: 550px) {
    #pop_music .green-audio-player {
        min-width: auto;
    }
}

#pop_music .green-audio-player .speed:before {
    color: #55606e;
}

#pop_music .volume__controls {
    background-color: rgba(255, 255, 255, 0.9);
}

/* header 調整 */
#hot_product .title {
    max-width: 250px;
    display: inline-block; 
    text-overflow: ellipsis;
    overflow:hidden;
    white-space: nowrap;
    vertical-align: bottom;
}

@media (max-width: 550px) {
    #header .bk_logo img {
        max-height: 80%;
    }
    #hot_product .title {
        max-width: 90px;
    }
}

@media (max-width: 375px) {
    .btnbar a {
        font-size: 0.75em;
        padding: 11px 6px;
    }
    #header .bk_logo img {
        max-height: 65%;
    }
    #hot_product .title {
        max-width: 70px;
    }
}

#loading_wrap .loginButton {
    color: #5390D8;
    font-size: 1.25em;
    margin: 20px 0px 50px;
    display: inline-block;
    padding-bottom: 3px;
    border: 2px solid transparent;
    border-bottom-color: #5390D8;
}


#loading_wrap .loginButton:hover {
    text-decoration: none;
    color: #78B3F7;
    border-bottom-color: #78B3F7;
}

#loading_wrap .returnButton {
    color: #FFF;
    background-color:#999;
    text-decoration: none;
    font-size: 0.875em;
    padding: 5px 30px;
}

#loading_wrap .returnButton:hover {
    background-color:#696969;
}

#loading_wrap .no_permission {
    display: none;
    color: #78B3F7;
    font-size: 1.25em;
    margin: 20px 0px 50px;
}

#memberbox {
    z-index: 99999;
}

.tfbar.tfimg{position:relative;}
.tfbar.tfimg> img{position:absolute;right:5px;top:50%;margin-top:-12px;}
.tfbar.tfimg> input {margin-bottom: 5px;}
.codere__icon {width: 25px; height: 25px;text-align: center;display: inline-block;}
.codere__icon i {line-height: 1.6;}


/* 購物車多規格 */
.multi_spec.hide {
    display: none;
}

.buyinfo > div:not(.multi_spec) {
    padding: 5px 0px;
}

.spec_list {
    padding: 5px 0px;
    display: flex;
}

.spec_wrap {
    flex: 1;
}

.spec_list .title {
    max-width: 90px;
    margin-right: 5px;
}

.btn_03 {
    font-size: 0.8125em;
    border: 1px solid #F60;
    background-color: transparent;
    color: #F60;
    padding: 2.5px 5px;
    margin: 0px 3px 2px 3px;
    min-width: 50px;
    transition: color 0.3s, backgroundColor 0.3s;
}

.btn_03.selected {
    border: 1px solid #F60;
    background-color: #F60;
    color: #FFF;
}

#addCart_btn:disabled {
    cursor: default;
    background-color: gray;
    opacity: 0.8;
}

#linkBoxContent.rwdbox iframe {
    position: relative;
}

#linkBoxContent.rwdbox a {
    color: #4493d9;
}


/* 音樂播放器 */


/* .multiSelect > * {
    padding: 5px 0px;
}

.buyinfo > * {
    padding: 5px 0px;
}

.buyinfo .title {
    display: inline-block;
    width: 50px;
}

.btn_03 {
    border: 1px solid #F60;
    background: transparent;
    color:#F60;
    height: 30px;
    font-size: 13px;
    line-height: 30px;
    padding: 0px 10px;
    font-weight: bold;
    min-width: 50px;
}

.btn_03:hover {
    border: 1px solid #7B370A;
    color:#7B370A;
}

.btn_03.selected {
    background: #F60;
    color:#FFF;
}

.btn_03.selected:hover {
    border-color: #F60;
} */