@charset "utf-8";

/* common */

@import url('common.css');
a:hover {
    text-decoration: none !important;
}


/* page-head */

#page-head {
    padding: 0 20px;
    background: #FFF;
    border-bottom: 1px solid #edebeb;
}

#page-head .wrap {
    max-width: 1240px;
    margin: 0 auto;
    line-height: 20px;
}

#page-head .wrap>div:last-child {
    border-bottom: none;
}


/* breadcrumb */

#breadcrumb {
    padding: 15px 0;
    border-bottom: 1px solid #edebeb;
    font-size: 15px;
    color: #000;
}

#breadcrumb a,
#breadcrumb span {
    display: inline-block;
    margin: 0 10px;
}

#breadcrumb a {
    color: #888;
}

#breadcrumb a:hover {
    text-decoration: underline;
}

#breadcrumb .focus {
    padding: 5px 10px;
    background: #dd1229;
    color: #FFF;
}


/* main-title */

#main-title {
    position: relative;
    margin: 20px 0;
    padding: 5px 180px 5px 20px;
    border-left: 4px solid #dd1229;
    font-size: 25px;
    line-height: 30px;
}

#main-title .serial {
    display: block;
    font-size: 14px;
    color: #666;
}

#main-title .originalPriceLogin {
    display: block;
    font-size: 16px;
    color: #666;
    letter-spacing: .5px;
    text-decoration-line: line-through;
}

#main-title .priceLogin {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -10px;
    font-size: 35px;
    color: #333;
    font-weight: bold;
}

#main-title .price {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -10px;
    font-size: 35px;
    color: #333;
    font-weight: bold;
}


/* container */

#container {
    padding: 30px 20px;
    、
}

#container .outer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    flex-direction: row-reverse;
    max-width: 1240px;
    margin: 0 auto;
}

#container .outer.mem {
    flex-direction: row;
}

#container .inner-left {
    width: 28%;
    margin-right: 2%;
}

#container .inner-left .ad {
    display: block;
    margin-bottom: 30px;
    transition: all .3s;
}

#container .inner-left .ad img {
    display: block;
    width: 100%;
    height: auto;
}

#container .inner-left .ad:hover {
    opacity: .6;
}

#container .inner-right {
    width: 70%;
}


/* article-nav */

#article-nav {
    padding: 0 20px;
    background: #FFF;
    border: 1px solid #edebeb;
}

#article-nav li {
    border-bottom: 1px solid #edebeb;
}

#article-nav li a {
    display: block;
    padding: 20px 0;
    font-size: 18px;
    color: #666;
    transition: all .3s;
}

#article-nav li a:hover {
    text-decoration: underline;
}


/* fill-form */

.member_login .fill-form {
    width: 50%;
    max-width: 100%;
    margin: 0;
    padding: 50px 20px;
}

.member_login .fill-form li {
    margin-bottom: 45px;
}

.member_login ul {
    margin-bottom: 120px;
}

.fill-form {
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
    padding: 20px;
    background: #FFF;
    border: 1px solid #edebeb;
    box-sizing: border-box;
}

@media screen and (max-width: 768px) {
    .member_login .fill-form {
        width: 100%;
    }
}

.fill-form>* {
    margin-bottom: 20px;
}

.fill-form> :last-child {
    margin: 0;
}

.fill-form .title {
    margin-bottom: 10px;
    font-size: 16px;
    color: #000;
    font-weight: bold;
}

.fill-form li {
    margin-bottom: 40px;
}

.fill-form li span {
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
    color: #666;
}

.fill-form li input,
.fill-form li select,
.fill-form li textarea {
    display: block;
    width: 100%;
    height: 36px;
    padding: 0 10px;
    background: #FFF;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 14px;
    color: #666;
    line-height: 36px;
    box-sizing: border-box;
}

.fill-form li select {
    padding-right: 20px;
}

.fill-form li textarea {
    height: 100px;
}

.fill-form li .select {
    position: relative;
}

.fill-form li .select::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 15px;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 3px 0 3px;
    border-color: #666 transparent transparent transparent;
}

.fill-form li .select-list {
    display: flex;
    margin-bottom: 10px;
}

.fill-form li .select-list .select {
    width: 100%;
}

.fill-form li .select-list .select.country {
    margin-right: 5px;
}

.fill-form li .select-list .select.dist {
    margin-left: 5px;
}

.fill-form li .option-list {
    display: flex;
    flex-wrap: wrap;
}

.fill-form li .option-list label {
    display: inline-flex;
    align-items: flex-start;
    margin-right: 10px;
    padding: 5px 0;
    font-size: 14px;
    color: #666;
}

.fill-form li .option-list label input[type="radio"],
.fill-form li .option-list label input[type="checkbox"] {
    width: 15px;
    height: 15px;
    margin-right: 3px;
}

.fill-form .note {
    font-size: 14px;
    color: #666;
    line-height: 20px;
}

.fill-form .links {
    font-size: 14px;
    text-align: center;
}

.fill-form .links p {
    margin: 10px 0;
}

.fill-form .links a {
    color: #dd1229;
}

.fill-form .links a:hover {
    text-decoration: underline;
}

.fill-form .links a.fb {
    display: inline-block;
    margin: 5px auto;
    padding: 10px 20px 10px 40px;
    background: url('../images/fb.png') 15px center no-repeat #3b5998;
    border-radius: 5px;
    color: #FFF;
}

.fill-form .first {
    font-size: 14px;
    color: #666;
    text-align: center;
}

.fill-form .first dt {
    display: flex;
    align-items: center;
}

.fill-form .first dt::before,
.fill-form .first dt::after {
    content: "";
    flex-grow: 1;
    display: block;
    height: 1px;
    margin: 0 5px;
    background: #edebeb;
}

.fill-form .first dd p {
    margin-top: 15px;
}

.fill-form .first dd p a {
    display: block;
    padding: 10px;
    border: 1px solid #edebeb;
    color: #666;
    transition: all .3s;
}

.fill-form .first dd p a:hover {
    background: #EEE;
}


/* common-buttons */

.common-buttons {
    text-align: center;
}

.common-buttons button,
.common-buttons a {
    display: block;
    width: 100%;
    margin: 10px 0;
    border: none;
    border-radius: 3px;
    font-size: 14px;
    color: #FFF;
    line-height: 36px;
    transition: all .3s;
}

.common-buttons button:hover,
.common-buttons a:hover {
    opacity: .6;
}

.common-buttons .red {
    background: #dd1229;
}

.common-buttons .grey {
    background: #AAA;
}


/* system-msg */

#system-msg {
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: 50px;
    background: #000;
    font-size: 18px;
    color: #FFF;
    line-height: 35px;
    text-align: center;
    box-sizing: border-box;
}

#system-msg a {
    color: #dd1229;
}

#system-msg a:hover {
    text-decoration: underline;
}


/* page */

#page {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
}

#page a {
    display: block;
    width: 45px;
    height: 34px;
    margin: 0 7px;
    background: #FFF;
    border: 1px solid #CCC;
    border-radius: 5px;
    font-size: 13px;
    color: #666;
    line-height: 32px;
    text-align: center;
    box-sizing: border-box;
    transition: all .3s;
}

#page a:hover,
#page a.active {
    border-color: #666;
    color: #333;
}


/* banner */

#banner {
    margin-bottom: 30px;
}

#banner img {
    display: block;
    width: 100%;
    height: auto;
}

.customizePosition {
    position: relative;
}

.bannerCustomizeMainTitle {
    width: 100%;
    padding-left: 20px;
    font-size: 42px;
    font-weight: bold;
    color: #FFF;
    text-shadow: 0 3px 10px #000;
    position: absolute;
    bottom: 10px;
}

@media screen and (max-width: 768px) {
    .bannerCustomizeMainTitle {
        padding-left: 0px;
        text-align: center;
    }
}

.bannerCustomize {
    width: 100%;
    height: auto;
    text-align: center;
}

.bannerCustomizeTitle {
    font-size: 26px;
    line-height: 32px;
    margin-bottom: 10px;
}

.bannerCustomizeSubTitle {
    line-height: 22px;
}


/* filter */

#filter {
    width: 100%;
    margin-bottom: 30px;
}

#filter .wrap {
    display: flex;
}

#filter .wrap li {
    margin-right: 20px;
}

#filter .wrap li:last-child {
    margin: 0;
}

#filter .wrap li span {
    display: block;
    margin-bottom: 5px;
    font-size: 15px;
    color: #666;
}

#filter .wrap li .select {
    position: relative;
    width: 100px;
}

#filter .wrap li .select::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 15px;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 3px 0 3px;
    border-color: #666 transparent transparent transparent;
}

#filter .wrap li .select select {
    display: block;
    width: 100%;
    height: 35px;
    padding: 0 20px 0 10px;
    border: 1px solid #CCC;
    font-size: 14px;
    color: #666;
    line-height: 33px;
    box-sizing: border-box;
}

#filter .wrap li .show {
    display: flex;
    padding: 10px;
    background: #FFF;
    border: 1px solid #CCC;
}

#filter .wrap li .show a {
    display: block;
    width: 16px;
    height: 13px;
    background: url('../images/filter.svg') no-repeat;
    background-size: 200% auto;
    text-indent: -9999px;
    opacity: .5;
    transition: all .3s;
}

#filter .wrap li .show a.grid {
    margin-right: 5px;
    background-position: left top;
}

#filter .wrap li .show a.list {
    background-position: right top;
}

#filter .wrap li .show a:hover,
#filter .wrap li .show a.active {
    opacity: 1;
}


/* editor */

.editor {
    font-size: 16px;
    color: #666;
    line-height: 25px;
}

.editor img {
    display: inline-block;
    max-width: 100%;
    height: auto;
}

.editor ul {
    margin: 20px 0;
    padding-left: 20px;
    list-style: disc;
    font-size: 16px;
    color: #666;
    line-height: 25px;
}


/* product-list */

#product-list {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

#product-list dl {
    width: 24%;
    margin: 0 1.33% 3% 0;
}

#product-list dl:nth-child(4n) {
    margin-right: 0;
}

#product-list dt {
    margin-bottom: 10px;
    background: #FFF;
    border: 1px solid #CCC;
}

#product-list dt a {
    position: relative;
    display: block;
    padding-bottom: 100%;
}

#product-list dt a img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: block;
    width: auto;
    max-width: 90%;
    height: auto;
    max-height: 90%;
    margin: auto;
    transition: all .3s;
}

#product-list dt a .tagCustomize {
    position: absolute;
    right: 0;
    padding: 5px;
    background: #000;
    font-size: 15px;
    color: #FFF;
}

#product-list dt a .tagCustomize.t1 {
    top: 10px;
}

#product-list dt a .tagCustomize.t2 {
    top: 40px;
}

#product-list dt a .tag {
    position: absolute;
    left: 0;
    padding: 5px;
    background: #dd1229;
    font-size: 15px;
    color: #FFF;
}

#product-list dt a .tag.t1 {
    top: 10px;
}

#product-list dt a .tag.t2 {
    top: 40px;
}

#product-list dt a .tag.t3 {
    top: 70px;
}

#product-list dt a:hover img {
    opacity: .6;
}

#product-list dl.soldout dt a b {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: 50px;
    height: 50px;
    margin: -25px 0 0 -25px;
    padding: 0 5px;
    background: #000;
    border-radius: 50%;
    font-size: 15px;
    color: #FFF;
    line-height: 50px;
    text-align: center;
    box-sizing: border-box;
}

#product-list dd .title {
    margin-bottom: 5px;
    height: 50px;
    overflow: hidden;
}

#product-list dd .title a {
    font-size: 18px;
    color: #333;
    line-height: 25px;
    transition: all .3s;
}

#product-list dd .title a:hover {
    color: #666;
}

#product-list dd .price {
    margin-bottom: 10px;
    font-size: 16px;
    color: #666;
    letter-spacing: .5px;
}

#product-list dd .more {
    display: block;
    background: #dd1229;
    border-radius: 3px;
    font-size: 15px;
    text-align: center;
    color: #FFF;
    line-height: 32px;
    transition: all .3s;
}

#product-list dd .more::before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-right: 5px;
    background: url('../images/fire.png');
    background-size: 100% auto;
}

#product-list dd .more:hover {
    opacity: .6;
}


/* product-info */

#product-info {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 20px;
    background: #FFF;
    border: 1px solid #edebeb;
    overflow: hidden;
    box-sizing: border-box;
}

#product-info .wrap {
    margin-bottom: 50px;
    padding-bottom: 50px;
    border-bottom: 1px solid #edebeb;
    overflow: hidden;
}

#product-info .wrap .img-show {
    float: left;
    display: flex;
    flex-direction: row-reverse;
    width: 48%;
}

#product-info .wrap .img-show img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

#product-info .wrap .img-show .big-img {
    width: 442px;
    height: 442px;
    padding: 20px;
    background: #FFF;
    border: 1px solid #CCC;
    box-sizing: border-box;
    position: relative;
}

@media screen and (max-width: 768px) {
    #product-info .wrap .img-show .big-img {
        width: 100%;
    }
}

#product-info .wrap .img-show .big-img .fancybox {
    display: none;
}

#product-info .wrap .img-show .big-img .fancybox.active {
    display: block;
}

#product-info .wrap .img-show .big-img .fancybox img {
    /* max-width: 400px; */
    max-width: 90%;
    max-height: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#product-info .wrap .img-show .small-img {
    margin-right: 10px;
}

#product-info .wrap .img-show .small-img li {
    width: 88px;
    height: 88px;
    margin-bottom: 10px;
    padding: 10px;
    background: #FFF;
    border: 1px solid #CCC;
    cursor: pointer;
    box-sizing: border-box;
    transition: all .3s;
    position: relative;
}

#product-info .wrap .img-show .small-img li:last-child {
    margin: 10px 0 0 0;
}

#product-info .wrap .img-show .small-img li:hover,
#product-info .wrap .img-show .small-img li.active {
    border-color: #000;
}

#product-info .wrap .img-show .small-img li img {
    max-width: 90%;
    max-height: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#product-info .wrap .info {
    float: right;
    width: 48%;
}

#product-info .wrap .info .checkout {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

#product-info .wrap .info .checkout span {
    display: block;
    width: 100%;
    margin-bottom: 5px;
    font-size: 12px;
    color: #666;
}

#product-info .wrap .info .checkout input {
    display: inline-block;
    width: 75px;
    padding: 10px 10px 10px 10px;
    background: #FFF;
    border: 1px solid #CCC;
    border-radius: 3px;
    font-size: 12px;
    color: #666;
    box-sizing: border-box;
}

#product-info .wrap .info .checkout .addcart {
    display: flex;
    align-items: center;
    margin-left: 10px;
    padding: 0 20px;
    background: #dd1229;
    border-radius: 3px;
    font-size: 15px;
    text-align: center;
    color: #FFF;
    line-height: 32px;
    transition: all .3s;
}

.addcart_noFlame {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-left: 10px;
    padding: 0 20px;
    background: #dd1229;
    border-radius: 3px;
    font-size: 15px;
    text-align: center;
    color: #FFF;
    line-height: 32px;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

#product-info .wrap .info .checkout .addcart::before {
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    margin-right: 5px;
    background: url('../images/fire.png');
    background-size: 100% auto;
}

#product-info .wrap .info .checkout .addcart:hover {
    opacity: .6;
}

#product-info .wrap .info .symblo img {
    display: inline-block;
    margin-right: 20px;
    vertical-align: middle;
}

#product-info .wrap .info .symblo img.voice {
    cursor: pointer;
}


/* -------------------------------customize-engrave */

.customizeEngrave {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

@media screen and (max-width: 768px) {
    .customizeEngrave {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
}

.customizeGuide {
    width: 7.5%;
    height: auto;
    padding-left: 20px;
}

@media screen and (max-width: 768px) {
    .customizeGuide {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }
}

.customizeGuideSelect {
    margin-bottom: 20px;
    border: 1px solid #333;
    cursor: pointer;
}

.customizeGuideSelect.active {
    border: 1px solid #dd1229;
}

.customizeGuideSelect img {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

@media screen and (max-width: 768px) {
    .customizeGuideSelect {
        width: 15%;
        margin-right: 20px;
    }
    .customizeGuideSelect img {
        width: 100%;
    }
}

.customizeGuideSelect p {
    padding: 5px;
    text-align: center;
    color: #FFF;
    background-color: #333;
}

.customizeGuideSelect.active p {
    background-color: #dd1229;
}

.customizeProduct {
    width: 48%;
    height: 560px;
    background-image: url("../images/upload/product_list_17_front.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    -webkit-transition: .3s all;
    -o-transition: .3s all;
    transition: .3s all;
    position: relative;
}

@media screen and (max-width: 768px) {
    .customizeProduct {
        width: 100%;
    }
}

.customizeProduct input {
    width: 42%;
    height: 8%;
    font-family: Times;
    font-size: 40px;
    text-align: center;
    background-color: #a8cee8;
    border: none;
    display: block;
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.customizeProduct input:focus {
    border: 1px solid #333;
}

.customizeProduct_t {
    top: 30%;
}

.customizeProduct_b {
    top: 50%;
}

.customizeDetail {
    width: 44.5%;
    height: auto;
}

@media screen and (max-width: 768px) {
    .customizeDetail {
        width: 100%;
    }
}

.customizeSelectList {
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    padding: 20px;
    border: 1px solid #edebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.customizeSelectList_title {
    margin-bottom: 20px;
    padding-left: 20px;
    border-left: 4px solid #dd1229;
}

.customizeSelectList_title h3 {
    font-size: 20px;
    font-weight: bold;
}

.customizeSelectList_items {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.customizeSelectList>ul>li {
    width: 12.5%;
    height: auto;
}

.customizeSelectItem {
    width: 100%;
    height: auto;
    padding-bottom: 100%;
    background: #fff;
    border: 1px solid #dd1229;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
}

.customizeSelectItem::before {
    content: '\f058';
    font-family: "fontawesome";
    font-size: 20px;
    color: #dd1229;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.customizeSelectItem img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.customizeToolkit {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.customizeToolkit h3 {
    padding: 18px 20px;
    color: #FFF;
    background-color: #1b1b1b;
    border-bottom: 1px solid #666;
}

.engrave {
    margin-bottom: 10px;
    padding: 0;
    background: #fff;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    cursor: pointer;
}

.engraveMenu {
    width: 100%;
}

.engrave h4 {
    width: 100%;
    padding: 21px;
    color: #666666;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}

.engrave h4::after {
    content: '\f107';
    font-family: "fontawesome";
    font-size: 16px;
    color: #666666;
    position: absolute;
    right: 20px;
}

.engrave li {
    margin-bottom: 10px;
    border: 1px solid #edebeb;
}

.engraveDropdown {
    width: 100%;
    height: auto;
    padding: 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: none;
}

.engraveDropdown h5 {
    padding: 5px;
    font-size: 16px;
    color: #666;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.engraveInput {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.engraveInput input {
    background-color: white;
    cursor: text;
}

.engraveInput input:focus {
    border-color: #93b0ee;
}

.customizeFront {
    display: inline-block;
}

.customizeBack {
    display: none;
}

.max16 {
    padding-top: 3px;
    font-size: 14px;
    color: #666;
    display: block;
}

.engrave select {
    padding: 10px 25px 10px 10px;
    border-color: #edebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.engrave select::-ms-expand {
    display: none;
}

.engravePrice {
    width: 100%;
    height: auto;
    padding: 20px;
    border: 1px solid #edebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.engravePrice_title {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #edebeb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.engravePrice_title .left {
    width: 50%;
    color: #666;
}

.engravePrice_title .right {
    width: 50%;
    text-align: end;
    color: #666;
}

.engravePrice_buy {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
}

.engravePrice_qty {
    width: 33.3333%;
    height: auto;
}

.engravePrice_qty>span {
    color: #666;
    display: block;
}

.engravePrice_qty>input {
    max-width: 100%;
    max-height: 36px;
    padding: 10px;
    font-size: 14px;
    text-transform: none;
    color: #666;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.engravePrice_buyBtn {
    width: 33.3333%;
    height: auto;
    padding-left: 20px;
}

.engravePrice_buyBtn>button {
    padding: 10px 20px;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    background-color: #dd1229;
    border: 0;
    border-radius: 3px;
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
}

.customizeOrder {
    width: 50%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
    .customizeOrder {
        width: 100%;
    }
}

.customizeOrder>h2,
.customizeOrderDetail>h2 {
    width: 100%;
    height: auto;
    padding: 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
}

.customizeOrderImg {
    width: 100%;
    height: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.productImg {
    width: 50%;
    height: 300px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    position: relative;
}

@media screen and (max-width: 1000px) {
    .productImg {
        height: 300px;
    }
}

.productfront {
    background-image: url("../images/upload/product_list_17_front.jpg");
}

.productback {
    background-image: url("../images/upload/product_list_17_back.jpg");
}

.customizeOrderInput {
    width: 50%;
    height: 10%;
    background-color: #a8cee8;
    border: none;
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.inputTop {
    top: 32%;
}

.inputBottom {
    top: 52%;
}

@media screen and (max-width: 1000px) {
    .customizeOrderInput {
        width: 50%;
        height: 8%;
    }
    .inputTop {
        top: 34%;
    }
    .inputBottom {
        top: 54%;
    }
}

@media screen and (max-width: 768px) {
    .customizeOrderInput {
        width: 45%;
        height: 10%;
    }
    .inputTop {
        top: 34%;
    }
    .inputBottom {
        top: 54%;
    }
}

@media screen and (max-width: 480px) {
    .customizeOrderInput {
        width: 48%;
        height: 7%;
        font-size: 0.5rem;
    }
    .inputTop {
        top: 38%;
    }
    .inputBottom {
        top: 54%;
    }
}

.customizeOrderDetail {
    width: 50%;
    height: auto;
}

@media screen and (max-width: 768px) {
    .customizeOrderDetail {
        width: 100%;
    }
}

.customizeOrderWarning {
    width: 100%;
    padding: 20px;
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: bold;
    line-height: 28px;
    color: #666;
    border: 2px solid #dd1229;
    border-radius: 3px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.customizeOrderConfirm {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
    padding: 20px;
    border: 1px solid #edebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

@media screen and (max-width: 480px) {
    .customizeOrderConfirm {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .customizeOrderConfirm button,
    .customizeOrderConfirm input {
        margin-bottom: 10px;
    }
}

.customizeOrderConfirm button {
    width: 32%;
    height: 36px;
    padding: 10px 0;
    font-size: 16px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    background-color: #dd1229;
    border: 0;
    border-radius: 3px;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
}

.customizeOrderConfirm input {
    width: 32%;
    height: 36px;
    padding-left: 10px;
    font-size: 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
}

.verify {
    width: 32%;
}

.verify img {
    width: 100%;
    height: 36px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
}

.customizeOrderInfo {
    width: 100%;
    padding: 20px;
    margin-bottom: 10px;
    border: 1px solid #edebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.customizeOrderInfo h3 {
    padding: 10px 0;
    font-size: 16px;
    color: #666;
}

.customizeOrderInfo input {
    width: 100%;
    height: 36px;
    padding-left: 10px;
    font-size: 20px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.customizeOrderBank {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
    padding: 20px;
    border: 1px solid #edebeb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.customizeOrderBank h3 {
    padding-bottom: 10px;
    font-size: 18px;
    color: #666;
}

.customizeOrderBankInfo {
    font-size: 16px;
    font-weight: bold;
    line-height: 28px;
    color: #666;
}


/* -------------------------------customize-engrave */


/* article-list */

#article-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

#article-list dl {
    width: 48%;
    margin-bottom: 70px;
}

#article-list dt {
    margin-bottom: 25px;
    padding-left: 20px;
    border-left: 2px solid #CCC;
}

#article-list dt a {
    font-size: 26px;
    color: #333;
    transition: all .3s;
}

#article-list dt a:hover {
    color: #dd1229;
    text-decoration: underline;
}

#article-list dd {
    font-size: 16px;
    color: #666;
    line-height: 25px;
}

#article-list dd a {
    color: #dd1229;
}

#article-list dd a:hover {
    text-decoration: underline;
}

.engraveTip {
    margin-top: 10px;
    padding: 20px;
    background: #fff;
    border: 1px solid #edebeb;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.engraveTip_title {
    padding-left: 20px;
    border-left: 4px solid #dd1229;
    display: inline-block;
    box-sizing: border-box;
}

.engraveTip_title p {
    font-size: 22px;
    font-weight: bold;
    line-height: 36px;
    font-style: italic;
}

.engraveTip>a {
    padding: 10px 20px;
    line-height: 16px;
    text-align: center;
    color: #fff;
    background: #dd1229;
    border-radius: 3px;
    display: inline-block;
    cursor: pointer;
}


/* data-list */

.data-list {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    background: #FFF;
    font-size: 14px;
    color: #666;
}

.data-list table {
    width: 100%;
}

.data-list thead,
.data-list tfoot {
    background: #f1f1f1;
    color: #000;
    font-weight: bold;
}

.data-list tr {
    border-bottom: 1px solid #dedede;
}

.data-list td {
    padding: 20px;
}

.data-list td a {
    display: inline-block;
    color: #666;
    transition: all .3s;
}

.data-list td a.del {
    position: relative;
    display: block;
    width: 30px;
    height: 30px;
    text-indent: -9999px;
}

.data-list td a.del::before,
.data-list td a.del::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 50%;
    width: 20px;
    height: 2px;
    margin-top: -1px;
    background: #999;
}

.data-list td a.del::before {
    transform: rotate(45deg);
}

.data-list td a.del::after {
    transform: rotate(-45deg);
}

.data-list td a img {
    display: block;
    width: 100%;
    max-width: 100px;
    height: auto;
    margin-bottom: 10px;
}

.data-list td a:hover {
    opacity: .6;
}

.data-list td input,
.data-list td select {
    display: block;
    width: 100px;
    height: 36px;
    padding: 0 10px;
    background: #FFF;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 14px;
    color: #666;
    line-height: 36px;
    text-align: center;
    box-sizing: border-box;
}

.data-list td .select {
    position: relative;
}

.data-list td .select::after {
    content: "";
    position: absolute;
    right: 10px;
    top: 15px;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 3px 0 3px;
    border-color: #666 transparent transparent transparent;
}

.data-list td .select select {
    width: 100%;
    padding-right: 20px;
}

.data-list .common-buttons {
    padding: 30px 0;
    text-align: center;
}

.data-list .common-buttons a,
.data-list .common-buttons button {
    display: inline-block;
    width: 100%;
    max-width: 200px;
    margin: 5px;
}


/* news-list */

#news-list {
    width: 100%;
}

#news-list dl {
    margin-bottom: 40px;
}

#news-list dl:last-child {
    margin: 0;
}

#news-list dt {
    margin-bottom: 30px;
    font-size: 30px;
    color: #dd1229;
}

#news-list dd .wrap li {
    margin-bottom: 30px;
}

#news-list dd .wrap li:last-child {
    margin: 0;
}

#news-list dd .wrap li .title {
    font-size: 24px;
    color: #666;
    transition: all .3s;
}

#news-list dd .wrap li .title:hover {
    color: #dd1229;
}

#news-list dd .wrap li p {
    margin: 15px 0 0 15px;
    padding-left: 15px;
    border-left: 2px solid #CCC;
    font-size: 14px;
    color: #666;
    line-height: 30px;
}


/* news-info */

#news-info .title {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #CCC;
    font-size: 24px;
    color: #dd1229;
}


/* sitemap */

#sitemap {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

#sitemap dl {
    width: 25%;
    margin-bottom: 70px;
}

#sitemap dt {
    margin-bottom: 25px;
    padding-left: 20px;
    border-left: 2px solid #CCC;
    font-size: 26px;
    color: #333;
}

#sitemap dd a {
    font-size: 16px;
    color: #dd1229;
    line-height: 25px;
}

#sitemap dd a:hover {
    text-decoration: underline;
}


/* RWD */

@media screen and (max-width: 1000px) {
    /* container */
    #container {
        padding: 20px;
    }
    #container .outer {
        /* display: block; */
    }
    #container .inner-left {
        width: 100%;
        margin: 0;
    }
    #container .inner-left .ad {
        display: none;
    }
    #container .inner-right {
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    /* product-list */
    #product-list dl {
        width: 49%;
        margin: 0 2% 2% 0;
    }
    #product-list dl:nth-child(3n) {
        margin-right: 2%;
    }
    #product-list dl:nth-child(2n) {
        margin-right: 0;
    }
    /* product-info */
    #product-info .wrap .img-show,
    #product-info .wrap .info {
        float: none;
        width: 100%;
    }
    #product-info .wrap .img-show {
        display: block;
        margin-bottom: 50px;
    }
    #product-info .wrap .img-show .big-img {
        margin-bottom: 10px;
    }
    #product-info .wrap .img-show .small-img {
        display: flex;
        flex-wrap: wrap;
        margin: 10px 0 0 0;
    }
    #product-info .wrap .img-show .small-img li {
        /* float: left; */
        width: 24%;
        margin: 10px 1% 0 0;
    }
    /* article-list */
    #article-list dl {
        width: 100%;
    }
    /* sitemap */
    #sitemap dl {
        width: 50%;
    }
}

@media screen and (max-width: 480px) {
    /* main-title */
    #main-title {
        padding: 5px 20px;
    }
    #main-title .priceLogin {
        position: static;
    }
    #main-title .price {
        position: static;
        display: block;
        margin-top: 5px;
        font-size: 30px;
    }
    /* filter */
    #filter .wrap {
        display: block;
    }
    #filter .wrap li {
        margin: 0 0 10px 0;
    }
    #filter .wrap li .select {
        width: 100%;
    }
    /* product-list */
    #product-list {
        display: block;
    }
    #product-list dl {
        width: 100%;
        margin: 0 auto 20px auto !important;
    }
    /* data-list */
    .data-list thead {
        display: none;
    }
    .data-list tbody tr {
        position: relative;
        display: block;
        padding: 20px 0;
    }
    .data-list td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    .data-list tbody td {
        margin: 20px 0;
        padding: 0;
        text-align: center;
    }
    .data-list td a {
        display: block;
    }
    .data-list td a img {
        max-width: none;
        margin-bottom: 20px;
    }
    .data-list td input {
        margin: 0 auto;
    }
    .data-list td a.del {
        position: absolute;
        right: 20px;
        top: 20px;
    }
    .data-list tfoot tr {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .data-list tfoot td {
        padding: 20px 10px;
    }
    .data-list tfoot td:first-child {
        width: 130px;
    }
    /* sitemap */
    #sitemap dl {
        width: 100%;
    }
}

.table tr {
    border: none !important;
}

.table tr:first-of-type th {
    background-color: #f1f1f1 !important;
}

.table tr:nth-of-type(2n - 1) td {
    background-color: #F6F6F6;
}

.table tr th {
    font-size: 15px;
    font-weight: bold;
    border: none !important;
    padding: 10px 20px;
}

.table tr td {
    vertical-align: middle;
    border: none !important;
    padding: 10px 20px;
}

.table tr td a {
    font-size: 15px;
    color: #551A8B;
}

.regis_login {
    width: 50%;
    padding: 0 30px 30px;
}

.regis_login h3 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 24px;
    letter-spacing: 2px;
    font-weight: bold;
    line-height: 30px;
    color: #5a5a5a;
    font-family: "Microsoft Jheng Hei Regular";
    margin-bottom: 30px;
}

.regis_login h3::before {
    content: "";
    display: block;
    width: 35px;
    height: 35px;
    margin-right: 10px;
    background: url('../images/bighead.png');
    background-repeat: no-repeat;
    background-size: 35px;
    background-position: center;
}

.regis_login p {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 22px;
    color: #5a5a5a;
}

.regis_login strong {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 18px;
    letter-spacing: 1px;
    line-height: 30px;
    color: #d8262c;
    margin-bottom: 10px;
}

.regis_login strong::before {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    margin-right: 10px;
    background: url('../images/voice.svg');
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center;
}

.regis_login a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 52px;
    color: #fff;
    border-radius: 10px;
    margin: 0 2px;
}

.regis_login a:first-of-type {
    margin-left: 0;
}

.regis_login .regis_log {
    background-color: #000;
}

.regis_login .regis_fb {
    background-color: #3a5ca9;
}

.regis_login .regis_line {
    background-color: #07bb04;
}

.regis_login .btn-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin-top: 50px;
}

.discount {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 30px;
}

.discount img {
    margin-right: 10px;
}

.discount p {
    font-size: 14px;
    line-height: 36px;
    margin-right: 10px;
    color: #9d1919;
}

.discount a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 85px;
    height: 30px;
    color: #fff;
    margin-right: 50px;
    border-radius: 5px;
    background-color: #d8262c;
}

.discount input {
    width: 100%;
    max-width: 360px;
    margin-right: 30px;
}

.warning_info {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 10px 20px;
    width: 100%;
    max-width: 1030px;
    min-height: 100px;
    margin: 0 auto;
    margin-top: 50px;
    background-color: #f1f1f1;
}

.warning_info img {
    display: block;
    margin-right: 30px;
}

.warning_info p {
    font-size: 14px;
    line-height: 24px;
    color: #010101;
}

.plus_cart {
    margin-top: 30px;
}

.plus_cart .pc-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
}

.plus_cart h3 {
    width: 100%;
    font-size: 18px;
    line-height: 23px;
    font-weight: bold;
    color: #c81616;
    border-bottom: 2px solid #c81616;
    margin-bottom: 30px;
}

.plus_cart .pc-wrap .block {
    width: 100%;
    max-width: 280px;
    /* margin-right: 15px; */
    margin: 0 7.5px;
    margin-bottom: 20px;
}


/* .plus_cart .pc-wrap .block:nth-of-type(4n) {
    margin-right: 0;
} */

.plus_cart .pc-wrap .block span {
    display: block;
}

.plus_cart .pc-wrap .block a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 30px;
    color: #fff;
    background-color: #ef1b20;
    border-radius: 5px;
}

.plus_cart .pc-wrap .block .pcp {
    position: relative;
    width: 100%;
}

.plus_cart .pc-wrap .block .pcp .label {
    position: absolute;
    left: 0;
    top: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.plus_cart .pc-wrap .block .pcp .label strong {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 25px;
    color: #fff;
    font-weight: normal;
    background-color: #ef1b20;
    margin-bottom: 5px;
}

.plus_cart .pc-wrap .block p {
    font-size: 18px;
    font-weight: bold;
    line-height: 20px;
    height: 40px;
    margin-bottom: 5px;
    color: #000;
}

.plus_cart .pc-wrap .block s {
    color: rgb(80, 80, 80);
    display: block;
    margin-bottom: 5px;
}

.plus_cart .pc-wrap .block span {
    display: block;
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 23px;
    color: #a31616;
    margin-bottom: 5px;
}

.plus_cart .pc-wrap .block .pcp img {
    display: block;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 10px;
    object-fit: contain;
}

.total_price .tp {
    padding: 20px 0;
    border: 1px solid #000;
    margin-bottom: 20px;
}

.total_price .tp .t1 {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    border-bottom: 1px solid rgb(163, 163, 163);
    margin-bottom: 5px;
    padding-bottom: 5px;
    padding-right: 20px;
}

.total_price .tp .t2 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 20px;
}

.total_price .tp .t1 p {
    font-size: 14px;
    line-height: 30px;
    color: #565656;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.total_price .tp .t1 p span {
    display: block;
    width: 100px;
    text-align: right;
}

.total_price .tp .t2 p span {
    display: block;
    width: 100px;
    text-align: right;
}

.total_price .tp .t2 p {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    line-height: 30px;
    color: #565656;
}

.neworder .tabcontent {
    display: none;
}

.neworder .tab {
    display: flex;
    margin-bottom: 30px;
    /* overflow: auto; */
}

.neworder .tab button {
    flex-shrink: 0;
    font-size: 16px;
    line-height: 24px;
    color: #000000;
    border: none;
    padding: 20px;
    padding-bottom: 10px;
    background-color: #fff;
    border-bottom: 2px solid #c8c8c8;
    transition-duration: .3s;
    min-width: 120px;
}

.neworder .tab button.active {
    font-weight: bold;
    border-bottom: 2px solid #0f7ce1;
}

.neworder .tab button:last-of-type {
    pointer-events: none;
    width: 100%;
    flex-shrink: 1;
}

.neworder .n_myorder h3 {
    font-size: 20px;
    letter-spacing: 2px;
    font-weight: bold;
    line-height: 30px;
    color: #333333;
    margin-bottom: 10px;
}

.neworder .n_myorder h3::before {
    display: none;
}

.neworder .n_myorder p {
    font-size: 16px;
    letter-spacing: 2px;
    color: #333333;
    margin-bottom: 30px;
}

.n_detail {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    margin-bottom: 15px;
}

.n_detail div {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-right: 50px;
}

.n_detail p {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 24px;
    color: #000000;
}

.n_detail a {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 24px;
}

.n_totalcount {
    margin-bottom: 30px;
}

.neworder .tabcontent li {
    position: relative;
    margin-bottom: 30px;
    border-bottom: 1px dashed #000;
}

.neworder .tabcontent .more {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 30px;
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 19px;
    color: #3e3e3e;
}

.neworder .tabcontent .more img {
    margin-left: 5px;
}

.n_order {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: auto;
    margin-bottom: 30px;
    width: 100%;
    max-width: 1050px;
    flex-wrap: wrap;
}

.n_order img {
    display: block;
    width: 100%;
    max-width: 205px;
    height: 205px;
    object-fit: contain;
    flex-shrink: 0;
    margin-right: 20px;
}

.n_order img:last-of-type {
    margin-right: 0;
}

.n_page {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 30px;
}

.n_page p {
    font-size: 10px;
    letter-spacing: 1px;
    line-height: 30px;
    margin-right: 10px;
    color: #8a8a8a;
}

.n_page a img {
    display: block;
    margin-right: 5px;
}

.n_page select {
    display: block;
    width: 100px;
    height: 30px;
    margin-right: 10px;
    border: 1px solid #d3d3d3;
    background-color: #f6f6f6;
    font-size: 12px;
    letter-spacing: 1px;
    line-height: 30px;
    color: #1f1f1f;
    padding: 0 5px 0;
    /* background-image: url(../images/down.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center right; */
}

.odt th:first-of-type {
    width: 100px;
}

.odt th.nright {
    text-align: right;
}

.odt td p {
    font-size: 15px;
    color: #551A8B;
}

.od_detail ul {
    padding-top: 10px;
    padding-left: 20px;
    margin-bottom: 20px;
}

.od_detail ul li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 20px;
}

.od_detail ul.firstp li p:first-of-type {
    width: 100%;
    max-width: 120px;
}

.od_detail ul.secondp li p {
    margin-left: 130px;
    font-weight: bold;
}

.od_detail ul h3 {
    font-size: 18px;
    letter-spacing: 1px;
    line-height: 30px;
    font-weight: bold;
    color: #2d2d2d;
}

.od_detail ul li.break {
    flex-wrap: wrap;
}

.od_detail ul li p {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 30px;
    color: #2d2d2d;
    margin-right: 10px;
}

.od_detail ul li p a {
    display: block;
    margin-left: 5px;
    color: #1a87b0;
}

.od_detail ul li span {
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 30px;
    color: #808080;
    width: 100%;
    max-width: 100px;
}

.od_detail ul li.timewrap p {
    width: 100%;
    max-width: 220px;
}

.n_confirm {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.n_confirm img {
    display: block;
    margin-bottom: 20px;
}

.n_confirm h4 {
    font-size: 18px;
    letter-spacing: 1px;
    line-height: 30px;
    color: #d8262c;
    margin-bottom: 10px;
}

.n_confirm h3 {
    font-size: 30px;
    letter-spacing: 2px;
    line-height: 36px;
    font-weight: bold;
    color: #000000;
    margin-bottom: 20px;
}

.n_confirm p {
    font-size: 18px;
    letter-spacing: 1px;
    line-height: 36px;
    font-weight: bold;
    color: #000000;
    margin-bottom: 15px;
    text-align: center;
}

.n_confirm span {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 36px;
    color: #000000;
    margin-bottom: 15px;
}

.n_warning {
    width: 100%;
    max-width: 920px;
    margin: 0 auto;
    padding: 30px 50px;
    background-color: #e9e9e9;
    padding-top: 30px;
    margin-bottom: 100px;
}

.n_warning p {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 36px;
    color: #393939;
}

.order_title {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 30px;
}

.order_title .ot_group {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    margin-top: 20px;
}

.order_title p {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 24px;
    color: #000000;
    font-weight: bold;
    margin-right: 30px;
    flex-shrink: 0;
}

.order_title p.otlp {
    width: 100%;
    text-align: right;
    flex-shrink: 1;
    margin-top: 20px;
}

.order_title p a {
    color: #1a87b0;
    text-decoration: none;
    margin-right: 0;
}

.order_title a {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 24px;
    /* text-decoration: underline; */
    margin-right: 30px;
    flex-shrink: 0;
}

.order_title a.print {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    padding: 3px 5px;
    border: 1px solid #4a88cf;
    color: #4a88cf;
}

.order_title a.print.cancel {
    display: flex;
    align-items: center;
    line-height: 24px;
    justify-content: center;
    border: 1px solid #dd1128;
    color: #dd1128;
}

.order_title a.print::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 5px;
    background: url(../images/print.png);
    background-size: auto 30px;
    background-repeat: no-repeat;
    background-position: -6px center;
    transition: .3s all;
}

.order_title a.print.cancel::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 5px;
    background: url(../images/1631870773941.png);
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center;
    transition: .3s all;
}

.n_addcart:hover {
    opacity: 0.6;
    transition: .3s all;
}

.megaorder {
    display: none !important;
}

#CVSPaymentNo {
    /* font-size: 14px !important; */
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    width: 140px !important;
}

.od_state {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 30px;
}

.od_state h2 {
    font-size: 22px;
    font-weight: bold;
    color: #4a88cf;
}

.od_state p {
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 24px;
    color: #000000;
    font-weight: bold;
    margin-right: 5px;
    flex-shrink: 0;
}

.od_state h2.ods_red {
    color: #dd1128;
}

.function.mega.disapear {
    display: none;
}

.scrollbar-outer>.scroll-element,
.scrollbar-outer>.scroll-element div {
    z-index: 5 !important;
}

@media screen and (max-width: 1220px) {
    .plus_cart .pc-wrap .block {
        width: calc((100% - 45px) / 3);
        max-width: initial;
    }
}

@media screen and (max-width: 1000px) {
    .function.mega.disapear {
        display: block;
    }
    #page-head {
        margin-top: 70px;
    }
    .neworder .tabcontent .more {
        position: relative;
        top: initial;
        right: initial;
        transform: translateY(0);
    }
    .od_detail ul {
        padding-left: 0;
    }
    .od_detail ul.firstp li p:first-of-type {
        width: 100%;
        max-width: 80px;
    }
    .megaorder {
        display: block !important;
    }
}

@media screen and (max-width: 910px) {
    .order_title {
        flex-wrap: wrap;
    }
    .order_title p.otlp {
        text-align: left;
        float: initial;
    }
}

@media screen and (max-width: 768px) {
    .regis_login {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    .regis_login .btn-wrap {
        order: -1;
        margin-top: 0;
        margin-bottom: 30px;
        flex-direction: column;
    }
    .regis_login a {
        width: 100%;
        margin: 0;
        margin-bottom: 10px;
    }
    .plus_cart .pc-wrap {
        flex-wrap: wrap;
        justify-content: center;
    }
    .plus_cart .pc-wrap .block {
        width: calc((100% - 30px) / 2);
        max-width: initial;
    }
    /* .plus_cart .pc-wrap .block:nth-of-type(2n) {
        margin-right: 0;
    } */
    .od_detail ul.secondp li p {
        margin-left: 0;
    }
    .neworder .tab {
        flex-wrap: wrap;
    }
    .neworder .tab button:last-of-type {
        display: none;
    }
}

@media screen and (max-width: 621px) {
    .order_title .ot_group.o3 {
        order: 3;
    }
}

@media screen and (max-width: 576px) {
    .n_order a {
        width: 50%;
    }
}

@media screen and (max-width: 500px) {
    .plus_cart .pc-wrap {
        flex-direction: column;
    }
    .plus_cart .pc-wrap .block {
        width: 100%;
        max-width: auto;
        margin: 0;
        /* margin-right: 0; */
    }
}