@charset "utf-8";
/* CSS Document */
.DeliveryFee .pleasr_h2{font-size: 16px; margin-bottom: 10px;}
.DeliveryFeeWarp{display: flex;}
.CountryWarp{ display: flex;align-items: center;}
.DeliveryFeeWarp > div > font{ font-size: 16px;margin-right: 5px;}
.CountryWarp .WeightText{position: relative;height: 38px;font-size: 16px;padding-left: 10px;box-sizing: border-box;border: 1px solid #dddddd;}
.CountryWarp .CountrySelect{ width: 425px !important; position: relative; background: #FFF; border: 1px solid #C7C7C7;}
.CountrySelect .CountrySingle{cursor: pointer; height: 36px;line-height: 36px;padding: 0;margin: 0;border: none;box-shadow: none;font-size: 16px;color: #000000;padding-left: 10px;box-sizing: border-box;}
.CountrySelect .CountryResults li{font-size: 16px;height: 30px;line-height: 30px;}
.CountrySelect .CountryResults li:hover{background: #3875d7;color: #fff;}
.ChoosedCountryName{ font-size: 16px; color: #666666;}
.SelectChoose{ position: absolute; background: url(../../imagesNew/master/arrow-down.png) center no-repeat; top: 12px; right: 10px; width: 18px; height: 12px;}
.CountryDrop { display: none; background: #FFFFFF; border: 1px solid #C7C7C7; position: absolute; border-top: none; z-index: 1001; left: -1px; top: 37px; width: 100% !important;}
.CountrySelect input { cursor: pointer; background: url(../../imagesNew/login/icon-search.png) center right no-repeat; background-size: 20px auto; height: 30px; border: 1px solid #AAA; box-shadow: 0 3px 1px #EEEEEE inset; margin: 5px 5px 2px; padding: 2px 20px 2px 4px; width: calc(100% - 10px); box-sizing: border-box;}
.CountrySelect .CountryResults li{ color: #666666; cursor: pointer; display: block; height: 30px; line-height: 30px; padding: 0 7px;}
.CountrySelect .CountryResults{ margin: 0 4px 4px 0; overflow-x: hidden; overflow-y: auto;}
.CountrySelect:hover .CountryDrop{display: block;}
.WeightWarp{display: flex;align-items: center;margin-left: 40px;}
.WeightWarp .WeightText{ width: 320px; position: relative;height: 38px;font-size: 16px;padding-left: 10px;box-sizing: border-box;border: 1px solid #dddddd;}
.WeightWarp .ProNum{position: absolute;right: 10px;width: 38px;display: flex;justify-content: space-between;top: 50%;transform: translateY(-50%);}
.WeightWarp .ProNum em{width: 12px;display: inline-block;height: 12px;position: relative;cursor: pointer;padding: 2px;}
.WeightWarp .ProNum em:hover,.WeightWarp .ProNum em:active{background: #2F333A;}
.WeightWarp .ProNum em:hover::after,.WeightWarp .ProNum em:active::after{border-top: 2px solid #FFFFFF;}
.WeightWarp .ProNum em:hover::before,.WeightWarp .ProNum em:active::before{border-left: 2px solid #FFFFFF;}
.WeightWarp .ProNum .Reduce::after{content: "";display: block;width: 12px;border-top: 2px solid #2F333A;top: 50%;transform: translateY(-50%);position: absolute;}
.WeightWarp .ProNum .Add::before{content: "";display: block;height: 12px;border-left: 2px solid #2F333A;left: 50%;transform: translateX(-50%);position: absolute;}
.WeightWarp .ProNum .Add::after{content: "";display: block;width: 12px;border-top: 2px solid #2F333A;top: 50%;transform: translateY(-50%);position: absolute;}
.WeightWarp p{position: relative;}
.DeliveryFeeWarp .Check{background-color: #2F333A;color: #FFFFFF;width: 93px;height: 38px;line-height: 38px;text-align: center;font-size: 16px;border-radius: 3px;margin-left: 10px;cursor: pointer;}
.DeliveryFeeWarp .Check:hover{background-color: #2F333A;color: #FFFFFF;}
.ContentTable table{ width: 1300px;border-collapse: collapse;margin-top: 20px; border: #dddddd solid 1px; box-sizing: border-box;}
.ContentTable table td, .ContentTable table th{ height: 60px; text-align: center;}
.ContentTable table th{background: #2F333A; color: #FFFFFF; font-size: 18px; border-bottom: #FFFFFF solid 1px; border-right: #FFFFFF solid 1px;}
.ContentTable table th:last-child{border-right: none;}
.ContentTable table td{ font-size: 16px; background: #FFFFFF; border-bottom: 1px solid #dddddd; border-right: #dddddd solid 1px;}
.ContentTable table td:last-child{border-right: none;}
.ContentTable table tr:last-child td{ border-bottom: none;}
.shipTip{padding: 20px 0;font-size: 15px;line-height: 30px;}

.WeightWarp .ProNum .disabled:hover {background: none !important; cursor: not-allowed !important;}
.WeightWarp .ProNum .disabled::after,.WeightWarp .ProNum .disabled::before {border-color: #ccc !important;}
@media screen and (max-width:767px) {
    .DeliveryFee{ padding: 0 10px;}
    .DeliveryFee .pleasr_h2{ font-size: 15px;}
    .DeliveryFeeWarp{ flex-wrap: wrap;}
    .DeliveryFeeWarp > div > font{text-align: right; font-size: 14px;width: 125px;}
    .DeliveryFeeWarp .Check{height: 30px;line-height: 30px;font-size: 14px;margin: 10px 0 0 130px;width: 130px;}
    .CountryWarp{ width: 100%;}
    .CountryWarp .CountrySelect{ width: calc(100% - 132px) !important;}
    .WeightWarp{ margin: 10px 0 0; width:100%;}
    .WeightWarp p{ width:calc(100% - 130px);}
    .WeightWarp .WeightText{ width: 100%;}
    .ContentTable table{ width: 100%;}
    .ContentTable table td, .ContentTable table th{ height: 40px; width: 36%;}
    .ContentTable table td:last-child, .ContentTable table th:last-child{ width: 28%;}
    .ContentTable table th{ font-size: 14px;}
    .ContentTable table td{ font-size: 12px; padding: 0 10px;}
    .ChoosedCountryName, .WeightWarp .WeightText{ font-size: 14px;}
    .CountrySelect .CountryResults li{ font-size: 14px; height: 24px; line-height: 24px;}
}
@media screen and (max-width:1023px) and (min-width:768px) {
    .DeliveryFeeWarp > div > font{ text-align: right; font-size: 14px;}
    .CountryWarp{ width: 52%;}
    .CountryWarp > font{ width: 130px;}
    .CountryWarp .CountrySelect{ width: calc(100% - 137px) !important;}
    .WeightWarp{ margin-left: 10px; width: calc(48% - 10px);}
    .WeightWarp > font{ width: 80px;}
    .WeightWarp p{ width: calc(100% - 85px);}
    .WeightWarp .WeightText{ width: 100%;}
    .ContentTable table{ width: 100%;}
    .ContentTable table td, .ContentTable table th{ height: 45px;}
    .ContentTable table th{ font-size: 16px;}
    .ContentTable table td{ font-size: 14px;}
    .ChoosedCountryName, .WeightWarp .WeightText{ font-size: 14px;}
    .CountrySelect .CountryResults li{ font-size: 14px; height: 24px; line-height: 24px;}
}
@media only screen and (min-width: 1024px) and (max-width: 1365px) {
    .DeliveryFeeWarp > div > font{ text-align: right; font-size: 15px;}
    .CountryWarp{ width: 52%;}
    .CountryWarp > font{ width: 130px;}
    .CountryWarp .CountrySelect{ width: calc(100% - 137px) !important;}
    .WeightWarp{ margin-left: 20px; width: calc(48% - 20px);}
    .WeightWarp > font{ width: 80px;}
    .WeightWarp p{ width: calc(100% - 85px);}
    .WeightWarp .WeightText{ width: 100%;}
    .ContentTable table{ width: 100%;}
    .ContentTable table td, .ContentTable table th{ height: 50px;}
    .ContentTable table th{ font-size: 17px;}
    .ContentTable table td{ font-size: 15px;}
    .ChoosedCountryName, .WeightWarp .WeightText{ font-size: 15px;}
    .CountrySelect .CountryResults li{ font-size: 15px; height: 27px; line-height: 27px;}
}
@media only screen and (min-width: 1366px) and (max-width: 1535px) {
    .ContentTable table td, .ContentTable table th{ height: 55px;}
}