@charset "UTF-8";
 /* ------------------------------------------ */
 /* Style naming basically follows BEM: http://getbem.com/ */
 /* ------------------------------------------ */
 .gb-fsize-h1 {
   font-size: 90px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h1 {
       font-size: 70px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h1 {
       font-size: 56px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h1 {
       font-size: 36px; } }

 .gb-fsize-h2 {
   font-size: 50px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h2 {
       font-size: 48px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h2 {
       font-size: 42px; } }
   @media screen and (max-width: 767px) {
     .gb-fsize-h2 {
       font-size: 28px; } }
   @media screen and (max-width: 350px) {
     .gb-fsize-h2 {
       font-size: 24px; } }

 .gb-fsize-h3, .pair-ring-title {
   font-size: 25px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 25px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 25px; } }
   @media screen and (max-width: 767px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 20px; } }
   @media screen and (max-width: 350px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 18px; } }

 .gb-fsize-h4, .pair-ring-title-s {
   font-size: 20px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h4, .pair-ring-title-s {
       font-size: 20px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h4, .pair-ring-title-s {
       font-size: 18px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h4, .pair-ring-title-s {
       font-size: 16px; } }

 .gb-fsize-h5 {
   font-size: 16px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h5 {
       font-size: 16px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h5 {
       font-size: 14px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h5 {
       font-size: 14px; } }

 .gb-fsize-h6 {
   font-size: 14px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h6 {
       font-size: 14px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h6 {
       font-size: 12px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h6 {
       font-size: 12px; } }

 .gb-fsize-p, p {
   font-size: 18px; }
   @media screen and (max-width: 640px) {
     .gb-fsize-p, p {
       font-size: 14px; } }

 .pair-ring-menu-btn.section-swap-btn.active{
 	text-decoration: underline;
 }
 .gb-fsize-m, #pair-ring-menu .pair-ring-menu-btn {
   font-size: 17px; }
   @media screen and (max-width: 640px) {
     .gb-fsize-m, #pair-ring-menu .pair-ring-menu-btn {
       font-size: 15px; } }

 .gb-fsize-ms, .pair-ring-btn, .shop-serial__field, .pair-ring-load-design__field, .pair-ring-setting__field, .pair-ring-popup-block--design-code__content p, .pair-ring-popup-block--design-code__content input, .pair-ring-popup-block--design-code__field {
   font-size: 14px; }
   @media screen and (max-width: 640px) {
     .gb-fsize-ms, .pair-ring-btn, .shop-serial__field, .pair-ring-load-design__field, .pair-ring-setting__field, .pair-ring-popup-block--design-code__content p, .pair-ring-popup-block--design-code__content input, .pair-ring-popup-block--design-code__field {
       font-size: 12px; } }

 .gb-fsize-s {
   font-size: 12.8px; }

 /* BEGIN Noto Sans */
 @font-face {
   font-family: "Noto Sans SC";
   src: url("fonts/noto-sans/Thin/NotoSansSC-Thin.woff2") format("woff2"), url("fonts/noto-sans/Thin/NotoSansSC-Thin.woff") format("woff"), url("fonts/noto-sans/Thin/NotoSansSC-Thin.otf") format("opentype");
   font-weight: 100;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans TC";
   src: url("fonts/noto-sans/Thin/NotoSansTC-Thin.woff2") format("woff2"), url("fonts/noto-sans/Thin/NotoSansTC-Thin.woff") format("woff"), url("fonts/noto-sans/Thin/NotoSansTC-Thin.otf") format("opentype");
   font-weight: 100;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans SC";
   src: url("fonts/noto-sans/Light/NotoSansSC-Light.woff2") format("woff2"), url("fonts/noto-sans/Light/NotoSansSC-Light.woff") format("woff"), url("fonts/noto-sans/Light/NotoSansSC-Light.otf") format("opentype");
   font-weight: 300;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans TC";
   src: url("fonts/noto-sans/Light/NotoSansTC-Light.woff2") format("woff2"), url("fonts/noto-sans/Light/NotoSansTC-Light.woff") format("woff"), url("fonts/noto-sans/Light/NotoSansTC-Light.otf") format("opentype");
   font-weight: 300;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans SC";
   src: url("fonts/noto-sans/Regular/NotoSansSC-Regular.woff2") format("woff2"), url("fonts/noto-sans/Regular/NotoSansSC-Regular.woff") format("woff"), url("fonts/noto-sans/Regular/NotoSansSC-Regular.otf") format("opentype");
   font-weight: 400;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans TC";
   src: url("fonts/noto-sans/Regular/NotoSansTC-Regular.woff2") format("woff2"), url("fonts/noto-sans/Regular/NotoSansTC-Regular.woff") format("woff"), url("fonts/noto-sans/Regular/NotoSansTC-Regular.otf") format("opentype");
   font-weight: 400;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans SC";
   src: url("fonts/noto-sans/Medium/NotoSansSC-Medium.woff2") format("woff2"), url("fonts/noto-sans/Medium/NotoSansSC-Medium.woff") format("woff"), url("fonts/noto-sans/Medium/NotoSansSC-Medium.otf") format("opentype");
   font-weight: 500;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans TC";
   src: url("fonts/noto-sans/Medium/NotoSansTC-Medium.woff2") format("woff2"), url("fonts/noto-sans/Medium/NotoSansTC-Medium.woff") format("woff"), url("fonts/noto-sans/Medium/NotoSansTC-Medium.otf") format("opentype");
   font-weight: 500;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans SC";
   src: url("fonts/noto-sans/Bold/NotoSansSC-Bold.woff2") format("woff2"), url("fonts/noto-sans/Bold/NotoSansSC-Bold.woff") format("woff"), url("fonts/noto-sans/Bold/NotoSansSC-Bold.otf") format("opentype");
   font-weight: 700;
   font-style: normal; }
 @font-face {
   font-family: "Noto Sans TC";
   src: url("fonts/noto-sans/Bold/NotoSansTC-Bold.woff2") format("woff2"), url("fonts/noto-sans/Bold/NotoSansTC-Bold.woff") format("woff"), url("fonts/noto-sans/Bold/NotoSansTC-Bold.otf") format("opentype");
   font-weight: 700;
   font-style: normal; }
 /* END Noto Sans */
 /* Style commonly used  */
 /* ------------------------------------------ */
 /*
 body,
 body * {
   max-height: 1000000px; }

 html {
   font-size: 16px;

   @media screen and (max-width:1580px) {
       font-size:15px;
   }
   @media screen and (max-width:991px) {
       font-size:14px;
   }
   @media screen and (max-width:767px) {
       font-size:13px;
   }

   }
 */

 body {
 /*
   font-size: 16px;

   @media screen and (max-width:1580px) {
       font-size:15px;
   }
   @media screen and (max-width:991px) {
       font-size:14px;
   }
   @media screen and (max-width:767px) {
       font-size:13px;
   }

   font-family: "Noto Sans TC", "Microsoft JhengHei", 微軟正黑體, 微軟雅黑體, Arial, sans-serif;
   font-weight: 300;
   margin: 0 !important;
   */
   padding: 0;
   background-image: url(../images/background.jpg);
   background-size: cover;
 /*  letter-spacing: 0.2em;*/
   color: #000;
   height: 100%;
   width: 100%;
   overflow-x: hidden;
   position: relative; }
   /*
   body:lang(zh-hk), :lang(tc) body, :lang(zh-hk) body{
     font-family: "Noto Sans TC", "Microsoft JhengHei", 微軟正黑體, 微軟雅黑體, Arial, sans-serif; }
   body:lang(zh-cn), :lang(sc) body, :lang(zh-cn) body{
     font-family: "Noto Sans SC", "Microsoft JhengHei", 微軟正黑體, 微軟雅黑體, Arial, sans-serif; }
   @media screen and (max-width: 767px) {
     body.is-eshop {
       height: auto;
       background-image: url(""); } }

 * {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box; }
 */
 a {
   color: #000;
   text-decoration: none;
   display: inline-block;
   outline: none; }
   a:hover, a:active {
     text-decoration: none; }
   a:focus {
     text-decoration: none;
     outline: none; }

 img {
   image-rendering: -webkit-optimize-contrast;
   max-width: 100%;
   height: auto; }

 br {
   display: block;
   opacity: 0;
   font-family: "Arial", sans-serif !important;
   font-size: 0;
   color: transparent;
   line-height: 1em; }

 p {
   margin-top: 0; }
   p:last-child {
     margin-bottom: 0; }

 .clearfix {
   content: '';
   display: table;
   width: 100%;
   height: 0;
   clear: both; }

 #pair-ring-container {
   position: relative;
   width: 100%;
   height: 100%; }
 @media screen and (max-width: 767px) {
     .is-eshop #pair-ring-container {
         overflow: hidden;
         height: auto;
         min-height: 100%;
         background: url(../images/background.jpg) no-repeat center center;
         background-size: cover;
         padding-top: 100px;
         padding-bottom: 60px;
     }
     .is-eshop #pair-ring-container.pair-ring-selected, .is-eshop #pair-ring-container.single-ring-selected{
         padding-bottom: 0px;
     }
 }
 .block-size {
   position: relative; }
   .block-size--full-width {
     width: 100%; }
   .block-size--full-height {
     width: 100%; }
   .block-size--full-fill {
     width: 100%;
     height: 100%; }
   .block-size--half-width {
     width: 50%; }
   .block-size--quarter-width {
     width: 25%; }
   .block-size--one-third-width {
     width: 33.33%; }

 .pair-ring-btn {
   font-weight: 400;
   display: block;
   padding: 10px 0px;
   margin: auto;
   box-sizing: border-box;
   text-align: center; }
   .pair-ring-btn--solid {
     color: #FFF;
     background-color: #cb7d74; }
   .pair-ring-btn--outline {
     color: #cb7d74;
     border: solid 1px #cb7d74; }
   .pair-ring-btn--ruler:before {
     content: '';
     display: inline-block;
     width: 22px;
     height: 22px;
     background-image: url(../images/icon/pink/ruler.svg);
     vertical-align: middle;
     margin: auto 5px; }
   /* Add By Harlan King 20191230 */
 .is-eshop .sticky a.pair-ring-btn--opacity {
     color: #cb7d74;
     background:none;
     border: solid 1px #cb7d74;;
 }
 /* Add By Harlan King 20191230 */
 #slidePanel-reserve {
 z-index: 99;
 }
 #slidePanel-reserve .slidePanel-body{
 padding: 110px 0px 15px 0px;
 }
#slidePanel-reserve .captchaWrap-mobile{
    position: absolute;
    right: 20px;
    bottom: 5px;
}
/* End Add */
 @media screen and (min-width: 767px) {
     .is-eshop a.pair-ring-btn--opacity {
         display: none;
     }
 }

 .is-eshop .sticky .pair-ring-btn {
     display: inline-block;
     background: #cb7d74;
     border: 1px solid #cb7d74;
     color: #FFF;
     width: 49%; }
 /* End Add */
   .is-eshop .pair-ring-btn {
     display: inline-block;
     background: #cb7d74;
     border: 1px solid #cb7d74;
     color: #FFF;
     /*padding: 10px 35px;*/
     width: 55%; }

  .is-eshop .pair-ring-btn.ring-add-to-bag-btn{
 	margin-top:50px;
 	width:95%
  }

 .pair-ring-btn.pair-ring-share__btn{
    width:100% !important;
 }

  .pair-ring-btn-disabled{
     opacity:0.3;
     cursor:default;
  }

       @media screen and (max-width: 767px) {
         /* Add By Harlan King 20191230 */
         .is-eshop a.pair-ring-btn--opacity{
             color: #cb7d74;
             background:none;
             border: solid 1px #cb7d74;
         }
         .is-eshop .sticky a.pair-ring-btn--opacity {
             display: none;
         }
         /* End Add */

       .is-eshop .pair-ring-btn {
         display: block;
         margin: 0 auto;
         width: 49%;
         max-width: 330px;
         float: left;
         margin-right: 1%;
        }

        .is-eshop .pair-ring-btn.pair-ring-story__btn{
            width: 100%;
             margin: 0 auto;
             float: unset;
         }

         .pair-ring-btn.ring-situation2-btn{
              width: 50%;
              float:left;
         }

		 .pair-ring-load-design__field{
			margin-bottom:20px !important;
		 }



        }


     .is-eshop .pair-ring-btn.pair-ring-back-btn, .is-eshop .pair-ring-btn.ring-reset-btn {
       border: 1px solid #E9E7E8;
       background: #E9E7E8;
       color: black; }

 .is-eshop .ring-reset-btn{
 	color:#caa474;
     text-decoration: underline;
     /*margin-top: 10px;*/
     position: absolute;
     right: 20px;
     top: -105px;
     border: solid 1px #000;
     width: 30px;
     height: 30px;
     z-index:10;
 }

 .highlight-p {
   font-weight: 700; }
   .highlight-p--pink {
     color: #cb7d74; }
   .highlight-p--black {
     color: #000; }

 .pair-ring-custom-input, .shop-serial__field, .pair-ring-load-design__field, .pair-ring-setting__field, .pair-ring-popup-block--design-code__content input, .pair-ring-popup-block--design-code__field, .ring-style-option .option-block--ring-msg .ring-msg-textarea {
   border: none;
   background-color: transparent;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none; }

 .pair-ring-title {
   font-weight: 300; }

 .pair-ring-title-s {
   font-weight: 300; }

 .pair-ring-control {
   position: relaive;
   width: 100%;
   margin-bottom: 30px;
   text-align: center; }
   .pair-ring-control__btn {
     width: 25%;
     max-width: 70px;
     display: inline-block;
     padding: 0px 10px;
     box-sizing: border-box;
     vertical-align: top; }
     .pair-ring-control__btn img {
       width: 100%;
       opacity: 0.3; }
     .pair-ring-control__btn.active img {
       opacity: 1; }
     .pair-ring-control__btn.active:after {
       content: '';
       width: 100%;
       height: 5px;
       border-top: solid 1px #000;
       background-image: url(../images/icon/black/down-arrow.png);
       background-repeat: no-repeat;
       background-position: center;
       background-size: auto 100%;
       display: block; }

 .single-ring-selected .pair-ring-control {
   display: none; }
 .single-ring-selected .ring-situation-select-btn:nth-child(2) {
   display: none; }
 .single-ring-selected .pair-ring-confirm__list--pair {
   display: none; }

 .pair-ring-selected .pair-ring-confirm__list--single {
   display: none; }

 .display--inline-block {
   display: inline-block; }

 .display--block {
   display: inline-block; }

 .display--inline {
   display: inline; }

 .display--table {
   display: table; }

 .display--table-cell {
   display: table-cell; }

 .align--hc {
   text-align: center; }
 .align--hl {
   text-align: left; }
 .align--hr {
   text-align: right; }
 .align--vt {
   vertical-align: top; }
 .align--vb {
   vertical-align: bottom; }
 .align--vm {
   vertical-align: middle; }
 .align--hvc {
   text-align: center;
   vertical-align: middle; }

 .hidden-all {
   display: none !important; }

 .is-eshop .hidden-in-eshop {
   display: none !important; }

 /* END Style commonly used  */
 /* ------------------------------------------ */
 /* Style for menu */
 /* ------------------------------------------ */
 #pair-ring-menu {
   position: absolute;
   width: 50%;
   left: 25%;
   padding: 25px 45px;
   z-index: 9;
    margin-top:30px;
    }
   .is-eshop #pair-ring-menu {
     padding: 15px 45px;
     text-align: center;
     /*background: #FFF;*/
     font-size: 0; }
   #pair-ring-menu .pair-ring-logo {
     position: relative;
     width: 112px;
     margin-right: 65px;
     vertical-align: middle; }
     .is-eshop #pair-ring-menu .pair-ring-logo {
 /*      display: none; */}
   #pair-ring-menu .pair-ring-menu-btn {
     position: relative;
     margin-right: 65px;
     vertical-align: middle; }
     .is-eshop #pair-ring-menu .pair-ring-menu-btn {
       margin: 0;
       padding: 0 30px;
       color: #000; }
       .is-eshop #pair-ring-menu .pair-ring-menu-btn:before {
         content: '';
         display: block;
         position: absolute;
         right: 0;
         top: 50%;
         width: 1px;
         height: 20px;
         margin-top: -10px;
         background: #000; }
       .is-eshop #pair-ring-menu .pair-ring-menu-btn:last-child:before {
         display: none; }
       @media screen and (max-width: 767px) {
         .is-eshop #pair-ring-menu .pair-ring-menu-btn {
           font-size: 13px;
           padding: 0 5px; }
           .is-eshop #pair-ring-menu .pair-ring-menu-btn:before {
             height: 16px;
             margin-top: -8px; }
             #pair-ring-menu{
                 margin:0px;
             }

             }
     #pair-ring-menu .pair-ring-menu-btn.active {
       font-weight: 700;
       color: #cb7d74; }
       /*
       #pair-ring-menu .pair-ring-menu-btn.active:after {
         content: '';
         position: absolute;
         bottom: -5px;
         left: 0px;
         width: 100%;
         border-bottom: solid 2px #cb7d74;
         opacity: 0.5; }
         */.mobile-tips, .mobile-reset, .mobile-viewDesign
         color: #000; }
         body.is-eshop #pair-ring-menu .pair-ring-menu-btn.active:after {
           display: none; }
     body:not(.mobile) #pair-ring-menu .pair-ring-menu-btn:hover {
       font-weight: 700;
       color: #cb7d74; }
       /*
       body:not(.mobile) #pair-ring-menu .pair-ring-menu-btn:hover:after {
         content: '';
         position: absolute;
         bottom: -5px;
         left: 0px;
         width: 100%;
         border-bottom: solid 2px #cb7d74;
         opacity: 0.5; }
         */
     body.is-eshop #pair-ring-menu .pair-ring-menu-btn:hover {
       color: #000; }
       body.is-eshop #pair-ring-menu .pair-ring-menu-btn:hover:after {
         display: none; }
   #pair-ring-menu .pair-ring-setting-btn {
     position: absolute;
     top: 28px;
     right: 45px;
     width: 24px;
     height: 24px; }

 /* END Style menu  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #shop-serial {
   position: relative;
   width: 100%;
   height: 100%; }

 .shop-serial__content {
   position: relative;
   padding: 0px 33%; }

 .shop-serial__field {
   border-bottom: solid 1px #000;
   line-height: 3em;
   margin-top: 35px;
   margin-bottom: 80px; }
   .shop-serial__field::placeholder {
     color: #727272; }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-story {
   position: relative;
   width: 100%;
   height: 100% }

 .pair-ring-story__content {
   position: relative;
   padding: 0px 30%; }
   .is-eshop .pair-ring-story__content {
     padding: 0px 30%; }
     @media screen and (max-width: 991px) {
       .is-eshop .pair-ring-story__content {
         padding: 0px 20%; } }
     @media screen and (max-width: 767px) {
       .is-eshop .pair-ring-story__content {
         padding: 0px 5% 100px 5%;

         }
         #pair-ring-story {
           position: relative;
           width: 100%;
           height: calc(100% - 300px); }

         }

 .pair-ring-story__txt {
   margin-top: 200px;
   margin-bottom: 80px; }
   .is-eshop .pair-ring-story__txt {
     margin-bottom: 35px; }

 @media screen and (max-width: 767px){
       .pair-ring-story__txt{
             margin-top: 70px;
       }
 }
 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-select {
   position: relative;
   width: 100%;
   height: 100%;
    min-height: 800px;
    }

 .pair-ring-select__content {
   position: relative;
   padding: 50px 20%; }
   @media screen and (max-width: 991px) {
     .is-eshop .pair-ring-select__content {
       padding: 0px 20%; } }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-select__content {
       padding: 0px 5%; }
       .display--table-cell{
         display:block;
       }
       #pair-ring-select {
         position: relative;
         width: 100%;
         height: calc(100% - 300px);
          min-height:auto;
          }

       }

 .pair-ring-select__btn {
   width: 45%;
   display: inline-block;
   border-right: solid 1px #000;
   padding: 10px 0px; }
   @media screen and (max-width: 640px) {
     .is-eshop .pair-ring-select__btn {
       position: relative;
       width: 100%;
       border: 0;
       padding: 35px 0px; }
       .is-eshop .pair-ring-select__btn:after {
         content: '';
         display: block;
         position: absolute;
         width: 100vw;
         height: 1px;
         background: rgba(0, 0, 0, 0.3);
         bottom: 0;
         left: 50%;
         -webkit-transform: translateX(-50%);
         -ms-transform: translateX(-50%);
         transform: translateX(-50%); }
       .is-eshop .pair-ring-select__btn:last-child:after {
         display: none; } }
   .pair-ring-select__btn:last-child {
     border-right: none; }
   .pair-ring-select__btn img {
     width: 40%; }
   .pair-ring-select__btn span {
     position: relative;
     width: 50%;
     display: block;
     margin: 10px auto; }
     .pair-ring-select__btn span:after {
       content: '';
       position: absolute;
       top: 50%;
       margin-top: -4px;
       right: 0px;
       width: 8px;
       height: 8px;
       border-right: solid 1px #000;
       border-bottom: solid 1px #000;
       transform: rotate(-45deg); }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-shape-select {
   position: relative;
   width: 100%;
   height: 100%; }

 .pair-ring-shape-select__content {
   position: relative;
   padding: 0px 15%; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-shape-select__content {
       padding: 0px 5%; } }

 .pair-ring-shape-select__btn {
   position: relative;
   width: 30%;
   border-right: solid 1px #000;
   box-sizing: border-box;
   margin-bottom: 50px;
   display: inline-block; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-shape-select__btn {
       max-width: 120px;
       border-right: 0; } }
   .pair-ring-shape-select__btn:nth-child(4) {
     border-right: none; }
   .pair-ring-shape-select__btn img {
     width: 30%;
     display: inline-block;
     vertical-align: middle; }
     @media screen and (max-width: 767px) {
       .is-eshop .pair-ring-shape-select__btn img {
         display: none; } }
   .pair-ring-shape-select__btn span {
     width: 55%;
     display: inline-block;
     vertical-align: middle;
     padding: 0px 15px;
     box-sizing: border-box; }
     @media screen and (max-width: 767px) {
       .is-eshop .pair-ring-shape-select__btn span {
         width: 100%;
         padding: 5px 15px; } }
     .pair-ring-shape-select__btn span:before {
       content: '';
       width: 80%;
       max-width: 50px;
       height: 18px;
       display: block;
       margin: 15px auto;
       border: solid 1px #000; }
   .pair-ring-shape-select__btn.active span {
     font-weight: 700;
     color: #cb7d74; }
     .pair-ring-shape-select__btn.active span:before {
       border: solid 1px #cb7d74; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-shape-select__btn.active {
       border-radius: 50%;
       border: solid 1px #000; }
       .is-eshop .pair-ring-shape-select__btn.active span {
         color: #000; }
         .is-eshop .pair-ring-shape-select__btn.active span:before {
           border: solid 1px #000; } }
   .pair-ring-shape-select__btn--square span:before {
     border-radius: 0 0 50% 50%; }
   .pair-ring-shape-select__btn--square-round span:before {
     border-radius: 20% 20% 50% 50%; }
   .pair-ring-shape-select__btn--round span:before {
     border-radius: 50% 50% 50% 50%; }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-confirm {
   position: relative;
   width: 100%;
   height: 100%;
   min-height:800px;
   margin-top: 30px;
   }
   @media screen and (max-width: 767px) {
     .is-eshop #pair-ring-confirm {
       height: auto; } }

 .pair-ring-confirm__content {
   position: relative;
   padding-left: 45px; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-confirm__content {
       padding-left: 0;
       text-align: center; } }

 .pair-ring-confirm__preview {
   position: relative;
   width: 50%;
   display: inline-block;
   vertical-align: middle;
   text-align: center;
   margin-top: 3%;}
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-confirm__preview {
       width: 90%;
       display: block;
       margin: 0 auto 15px;
       max-width: 500px; } }
   .pair-ring-confirm__preview img {
     width: 100%; }
   @media screen and (max-width: 480px) {
     .is-eshop .pair-ring-confirm__preview {
       width: 90%;
       display: block;
       margin: 0px auto 15px;
       padding-top:15px;
       max-width: 500px; }
     .is-eshop .pair-ring-confirm__preview.is-singlering {
       padding-top:0;
     }

       }

 .pair-ring-confirm__details {
   position: relative;
   width: 45%;
   display: inline-block;
   vertical-align: middle; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-confirm__details {
       width: 90%;
       text-align: center; } }
   .pair-ring-confirm__details .pair-ring-btn {
     display: inline-block; }
     @media screen and (max-width: 767px) {
       .is-eshop .pair-ring-confirm__details .pair-ring-btn {
         /*margin-bottom: 10px;*/ } }

 .pair-ring-confirm__list {
   width: 100%;
   letter-spacing: normal;
   margin-bottom: 35px; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-confirm__list {
       width: 100%;
       text-align: left; }
        .is-eshop .pair-ring-confirm__list p{
            font-size:12px }
     }
   .pair-ring-confirm__list--single td {
     width: 50%;
     padding: 5px 5px;
     vertical-align: middle; }
   .pair-ring-confirm__list--pair td {
     width: 33%;
     padding: 5px 5px;
     vertical-align: middle; }
   .pair-ring-confirm__list .design-serial {
     display: table-row; }
   /* Add by Harlanking 20190117 */
 .pair-ring-confirm__list .design-serial td{
     width: 100%; }
 .pair-ring-confirm__list .design-serial td p{
     text-align: left;}
 /* End Add */
   .pair-ring-confirm__list .clear-line {
     border-top: solid 1px #000; }

 .ring-edit-btn {
   display: inline-block; }
   .ring-edit-btn img {
     width: 25%; }
   .ring-edit-btn:after {
     content: '';
     width: 18px;
     height: 18px;
     display: inline-block;
     background-image: url(../images/icon/black/edit.svg);
     background-size: cover;
     margin-left: 5px; }

 .pair-ring-confirm-btn {
   display: inline-block;
   padding: 0px 30px;
   border-right: solid 1px #000; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-confirm-btn {
       font-size: 12px;
       padding: 0 5px; } }
   .pair-ring-confirm-btn:last-child {
     border-right: none; }
   .pair-ring-confirm-btn--save:before {
     content: '';
     width: 20px;
     height: 15px;
     display: inline-block;
     background-image: url(../images/icon/black/favourite.svg);
     background-size: cover;
     margin-right: 5px; }
   .pair-ring-confirm-btn--mail:before {
     content: '';
     width: 20px;
     height: 15px;
     display: inline-block;
     background-image: url(../images/icon/black/mail.svg);
     background-size: cover;
     margin-right: 5px; }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-thanks {
   position: relative;
   width: 100%;
   height: 100%; }
   @media screen and (max-width: 991px) {
     .is-eshop #pair-ring-thanks {
       height: auto; } }

 .pair-ring-thanks__content {
   position: relative;
   padding: 0px 30%; }
   @media screen and (max-width: 991px) {
     .is-eshop .pair-ring-thanks__content {
       padding: 0px 5%; } }
   .pair-ring-thanks__content p {
     margin: 25px auto; }
 /**
 pair-ring-share
 **/
 #pair-ring-share {
   position: relative;
   min-height: 800px;
   width: 100%;
   height: 100%; }
 @media screen and (max-width: 991px) {
   .is-eshop #pair-ring-share {
     height: auto; } }

 .pair-ring-share__content {
   position: relative;
   padding: 0px 30%; }
 @media screen and (max-width: 991px) {
   .is-eshop .pair-ring-share__content {
     padding: 0px 5%; } }
 .pair-ring-share__content p {
   margin: 25px auto; }
 #qrcodeDiv img{
   width: 100%;
   height: 100%;
 }

 .share-email{
   padding: 0;
   background-image: url(../images/background.jpg);
   background-size: cover;
   /* letter-spacing: 0.2em; */
   color: #000;
   height: 100%;
   width: 100%;
 }

 .share-mail_div{
   margin: 20px 50px;
   line-height: 30px;
 }

 .share-mail_btn{
   margin: 30px 50px 50px 50px;
   line-height: 30px;

   /* padding: 10px 35px; */

 }
 .share-mail_btn .share-mail-submit{
   display: inline-block;
   background: #cb7d74;
   border: 1px solid #cb7d74;
   color: #FFF;
   padding: 10px 35px;
   width: 100%;
 }
 .share-mail_txt{
   margin: 50px 50px 20px 50px;
   line-height: 30px;
 }

 #pair-ring-mail .share-mail_div .ipt {
   border: none 0;
   outline: medium;
   background: transparent;
   -webkit-appearance: none;
   -moz-appearance: none;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   -moz-tap-highlight-color: transparent;
   border-bottom: 1px solid #111;
 }
 .order-code {
   font-weight: 700;
   border-bottom: solid 1px #000;
   display: inline-block;
   line-height: 2em; }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-design-code {
   position: relative;
   width: 100%;
   height: 100%; }
   @media screen and (max-width: 991px) {
     .is-eshop #pair-ring-design-code {
       height: auto; } }

 .pair-ring-design-code__content {
   position: relative;
   padding: 0px 30%; }
   @media screen and (max-width: 991px) {
     .is-eshop .pair-ring-design-code__content {
       padding: 0px 5%; } }
   .pair-ring-design-code__content p {
     margin: 25px auto; }

 .design-code {
   font-weight: 700;
   border-bottom: solid 1px #000;
   display: inline-block;
   line-height: 2em; }

 .design-qr-code {
   width: 50%; }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-load-design {
   position: relative;
   width: 100%;
   height: 100%;
   overflow: hidden;}

 .pair-ring-load-design__content {
   position: relative;
   padding: 11% 0%;
       min-width: 800px;
       width: 54%;
           margin: 0 auto;
           display: block;
       }
   .pair-ring-load-design__content .pair-ring-title {
     margin-bottom: 35px; }

 .pair-ring-load-design__field {
   border-bottom: solid 1px #000;
   line-height: 3em;
   margin-top: 10px;
   margin-bottom: 40px; }
   .pair-ring-load-design__field::placeholder {
     color: #727272; }

   .main_contant{
     position:relative;
     margin:20px;
     height: 100%;
     width: 100%;
   }
   .leftPage{
 width: 45%;
     height: 100%;
   }
   .centerLine{
     width: 10%;
     height: 100%;
   }
   .rightPage{
     width: 45%;
     height: 100%;
   }


 .main-group{
   display: flex;
   top: 100px;
   bottom: 100px;
   width: 800px;
       margin: 0 auto;
 }
 .left-group, .right-group{
   width: 390px;
   text-align: center;
 }
#pair-ring-load-design .left-group div{
    width: 90%;
    margin-top: 30px;
}

#pair-ring-load-design .right-group .right-group1{
     margin-top: 35px;
}

#pair-ring-load-design .right-group .right-group2{
     margin-top: 35px;
     margin-left: 45px;
}

 .mid-group {
   flex: 1;
   text-align: center;
   /*margin-top: 40px;*/
 }

 .min-line{
   height:50%; float:left; text-align:center;   border-right:1px solid #cb7d74;margin:4px 0px 4px 8px
 }

 .logo-site img {
   display: block;
   margin: 0 auto;
   width: 55%;
 }

 .design-price{
   text-align: center;
 }

 .design-buy{
   display: block;
   border: 1px solid #cb7d74;
   color: #cb7d74;
   margin: 10px auto;
   padding: 8px 30px;
   width: 190px;
 }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-setting {
   position: relative;
   width: 100%;
   height: 100%; }

 .pair-ring-setting__content {
   position: relative;
   padding: 0px 33%; }

 .pair-ring-setting__field {
   border-bottom: solid 1px #000;
   line-height: 3em;
   margin-top: 30px;
   margin-bottom: 30px; }
   .pair-ring-setting__field::placeholder {
     color: #727272; }

 .pair-ring-setting__lang {
   margin-top: 30px;
   margin-bottom: 30px; }
   .pair-ring-setting__lang .v-line {
     margin: auto 30px;
     display: inline-block; }

 .pair-ring-setting__btn.active {
   font-weight: 700; }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 #pair-ring-popup {
     position: absolute;
     top: 60px;
   left: 0px;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.8);
   z-index: 20; }

 .pair-ring-popup-block {
   position: relative; }
   .pair-ring-popup-block__close {
     position: absolute;
     width: 30px;
     height: 30px;
     top: 20px;
     right: 20px;
     transform: rotate(45deg); }
     .pair-ring-popup-block__close:before {
       content: '';
       position: absolute;
       top: 50%;
       left: 0px;
       width: 30px;
       border-bottom: solid 1px #000; }
     .pair-ring-popup-block__close:after {
       content: '';
       position: absolute;
       top: 0px;
       left: 50%;
       height: 30px;
       border-left: solid 1px #000; }
   .pair-ring-popup-block--design-code {
     width: 70%;
     margin: auto; }
     .pair-ring-popup-block--design-code__kv {
       position: absolute;
       width: 50%;
       height: 100%;
       display: inline-block;
       background-image: url(../images/kv.jpg);
       background-size: cover;
       background-position: center; }
     .pair-ring-popup-block--design-code__content {
       width: 50%;
       height: 100%;
       margin-left: 50%;
       display: inline-block;
       background-image: url(../images/background.jpg);
       background-size: cover;
       padding: 20% 30px;
       box-sizing: border-box; }
       .pair-ring-popup-block--design-code__content p {
         margin: 20px auto; }
     .pair-ring-popup-block--design-code__content input, .pair-ring-popup-block--design-code__field {
       border-bottom: solid 1px #000;
       line-height: 3em;
       margin-top: 20px;
       margin-bottom: 50px; }
       .pair-ring-popup-block--design-code__content input::placeholder, .pair-ring-popup-block--design-code__field::placeholder {
         color: #727272; }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 /* ------------------------------------------ */
 .pair-ring-mobnav {
   display: none; }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-mobnav {
       position: relative;
       padding: 0 5% 30px;
       display: -ms-flexbox;
       display: -webkit-flex;
       display: flex;
       -webkit-flex-direction: row;
       -ms-flex-direction: row;
       flex-direction: row;
       -webkit-flex-wrap: nowrap;
       -ms-flex-wrap: nowrap;
       flex-wrap: nowrap;
       -webkit-justify-content: space-between;
       -ms-flex-pack: justify;
       justify-content: space-between;
       -webkit-align-content: center;
       -ms-flex-line-pack: center;
       align-content: center;
       -webkit-align-items: center;
       -ms-flex-align: center;
       align-items: center; } }

 .pair-ring-mobnav__cell {
   position: relative;
   width: 33.3333%; }

 .pair-ring-mobnav__title {
   position: relative;
   font-weight: bold;
   text-align: center;
   width: 100%; }
   @media screen and (max-width: 380px) {
     .pair-ring-mobnav__title {
       font-size: 14px; } }
   .pair-ring-mobnav__title > span {
     display: inline-block;
     position: relative;
     text-decoration: underline;
     /*
     &:after{
     	content:'';
     	position:absolute;
     	display:block;
     	width:100%;
     	height:1px;
     	bottom:0;
     	left:0;
     	background:#000;
     }
     */ }

 .pair-ring-mobnav__prev {
   position: relative;
   font-size: 12px;
   width: 100%;
   text-align: left;
   padding-left: 16px; }
   .pair-ring-mobnav__prev:before {
     content: '';
     display: block;
     position: absolute;
     width: 12px;
     height: 12px;
     border-top: 2px solid #000;
     border-left: 2px solid #000;
     left: 0;
     top: 50%;
     margin-top: -6px;
     -webkit-transform: rotate(-45deg);
     -ms-transform: rotate(-45deg);
     transform: rotate(-45deg); }

 .pair-ring-mobnav__next {
   position: relative;
   font-size: 12px;
   width: 100%;
   text-align: right;
   padding-right: 16px; }
   .pair-ring-mobnav__next:after {
     content: '';
     display: block;
     position: absolute;
     width: 12px;
     height: 12px;
     border-top: 2px solid #000;
     border-right: 2px solid #000;
     right: 0;
     top: 50%;
     margin-top: -6px;
     -webkit-transform: rotate(45deg);
     -ms-transform: rotate(45deg);
     transform: rotate(45deg); }

 /* END Style ring-design used  */
 /* ------------------------------------------ */
 .gb-fsize-h1 {
   font-size: 90px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h1 {
       font-size: 70px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h1 {
       font-size: 56px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h1 {
       font-size: 36px; } }

 .gb-fsize-h2 {
   font-size: 50px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h2 {
       font-size: 48px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h2 {
       font-size: 42px; } }
   @media screen and (max-width: 767px) {
     .gb-fsize-h2 {
       font-size: 28px; } }
   @media screen and (max-width: 350px) {
     .gb-fsize-h2 {
       font-size: 24px; } }

 .gb-fsize-h3, .pair-ring-title {
   font-size: 25px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 25px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 25px; } }
   @media screen and (max-width: 767px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 20px; } }
   @media screen and (max-width: 350px) {
     .gb-fsize-h3, .pair-ring-title {
       font-size: 18px; } }

 .gb-fsize-h4, .pair-ring-title-s {
   font-size: 20px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h4, .pair-ring-title-s {
       font-size: 20px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h4, .pair-ring-title-s {
       font-size: 18px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h4, .pair-ring-title-s {
       font-size: 16px; } }

 .gb-fsize-h5 {
   font-size: 16px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h5 {
       font-size: 16px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h5 {
       font-size: 14px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h5 {
       font-size: 14px; } }

 .gb-fsize-h6 {
   font-size: 14px; }
   @media screen and (max-width: 1580px) {
     .gb-fsize-h6 {
       font-size: 14px; } }
   @media screen and (max-width: 991px) {
     .gb-fsize-h6 {
       font-size: 12px; } }
   @media screen and (max-width: 640px) {
     .gb-fsize-h6 {
       font-size: 12px; } }

 .gb-fsize-p, p {
   font-size: 16px; }
   @media screen and (max-width: 640px) {
     .gb-fsize-p, p {
       font-size: 14px; } }

 .gb-fsize-m, #pair-ring-menu .pair-ring-menu-btn {
   font-size: 17px; }
   @media screen and (max-width: 640px) {
     .gb-fsize-m, #pair-ring-menu .pair-ring-menu-btn {
       font-size: 15px; } }

 .gb-fsize-ms, .pair-ring-btn, .shop-serial__field, .pair-ring-load-design__field, .pair-ring-setting__field, .pair-ring-popup-block--design-code__content p, .pair-ring-popup-block--design-code__content input, .pair-ring-popup-block--design-code__field {
   font-size: 16px; }
   @media screen and (max-width: 640px) {
     .gb-fsize-ms, .pair-ring-btn, .shop-serial__field, .pair-ring-load-design__field, .pair-ring-setting__field, .pair-ring-popup-block--design-code__content p, .pair-ring-popup-block--design-code__content input, .pair-ring-popup-block--design-code__field {
       font-size: 12px; } }

 .gb-fsize-s {
   font-size: 12.8px; }

 /* ------------------------------------------ */
 #ring-design {
   width: 100%;
   height: 100%; }
   @media screen and (max-width: 767px) {
     .is-eshop #ring-design {
       height: auto;
       display: -ms-flexbox;
       display: -webkit-flex;
       display: flex;
       -webkit-flex-direction: column;
       -ms-flex-direction: column;
       flex-direction: column;
       -webkit-flex-wrap: nowrap;
       -ms-flex-wrap: nowrap;
       flex-wrap: nowrap;
       -webkit-justify-content: center;
       -ms-flex-pack: center;
       justify-content: center;
       -webkit-align-content: center;
       -ms-flex-line-pack: center;
       align-content: center;
       -webkit-align-items: center;
       -ms-flex-align: center;
       align-items: center; }
       .is-eshop #ring-design .ring-holder {
         -webkit-order: 1;
         -ms-flex-order: 1;
         order: 1;
         margin: 0 auto 30px; }
       .is-eshop #ring-design .ring-style {
         -webkit-order: 3;
         -ms-flex-order: 3;
         order: 3;
         position: relative;
         width: 100%;
         padding: 15px 0; }
         .is-eshop #ring-design .ring-style .ring-design__panel .line,
         .is-eshop #ring-design .ring-style .ring-design__panel .ring-style-btn {
           display: none; }
       .is-eshop #ring-design .ring-style-option {
         -webkit-order: 2;
         -ms-flex-order: 2;
         order: 2; } }

 .ring-holder {
   position: absolute;
   width: 500px;
   height: 375px;
   top: 50%;
   margin-top: -187.5px;
   left: 50%;
   margin-left: -250px; }
   @media screen and (max-width: 767px) {
     .ring-holder {
       position: relative;
       width: 320px;
       height: 240px;
       top: auto;
       left: auto;
       margin: auto; } }

 .ring-design__panel {
   position: relative;
   top: 15%; }

 .ring-style {
   position: absolute;
   top: 0px;
   right: 0px;
   width: 20%;
   height: 100%; }
   .ring-style .line {
     width: calc(100% - 25px);
     margin: 20px 0px;
     border-bottom: solid 1px #727272; }
     .is-eshop .ring-style .line {
       margin: 35px 0px; }
   .ring-style .pair-ring-btn--solid, .ring-style .pair-ring-btn--outline {
     margin: 15px 25px; }
     .is-eshop .ring-style .pair-ring-btn--outline {
       margin: 5px 25px; }
   .is-eshop .ring-style .pair-ring-btn--solid{margin:0px;}
       @media screen and (max-width: 767px) {
         .is-eshop .ring-style .pair-ring-btn--solid, .is-eshop .ring-style .pair-ring-btn--outline {
           /*margin: 5px auto;*/ } }
   .ring-style .ring-style-btn {
     position: relative;
     display: block;
     padding-left: 45px;
     color: #727272;
     margin: 20px auto;
     line-height: 25px; }

 	.ring-style .ring-style-btn span{
 		display:none;
 	}
 	 @media screen and (max-width: 767px) {
 		.ring-style .ring-style-btn span{
 		display:block;
 	}
 	.ring-style {
       height: auto; }
 	 }
     .ring-style .ring-style-btn.active {
       font-weight: 700;
       color: #cb7d74; }
       .ring-style .ring-style-btn.active:before {
         content: '';
         position: absolute;
         top: 50%;
         left: 0px;
         width: 40px;
         border-bottom: solid 1px #cb7d74; }
       .ring-style .ring-style-btn.active:after {
         content: '';
         position: relative;
         width: 15px;
         height: 22px;
         background-image: url(../images/icon/black/hints.svg);
         background-size: cover;
         display: inline-block;
         vertical-align: middle;
         margin-left: 5px;
         margin-top: -2px; }
       .ring-style .ring-style-btn.active.hints:after {
         background-image: url(../images/icon/pink/hints.svg); }


 .ring-style-option, .ring-style-option2 {
   position: absolute;
   top: 0px;
   left: 0px;
   width: 25%;
   height: 100%;
   background-color: #feede5;
       padding-bottom: 250px;
   }

   .ring-style-option2{
 	display:none;
 	right: 0px;
 	left:unset;
 }

   .is-eshop .ring-style-option, is-eshop .ring-style-option2 {
     max-width: 420px; }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option {
         max-width: 100%;
         background-color: transparent; } }
   @media screen and (max-width: 767px) {
     .ring-style-option, .ring-style-option2 {
       position: relative;
       width: 100%;
       height: auto; } }
   .ring-style-option .option-block, .ring-style-option2 .option-block {
     margin: auto 25px; }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .option-block, .is-eshop .ring-style-option2 .option-block {
         padding: 15px 5%;
         margin: 0;
         font-size: 12px;
         border-top: 1px solid rgba(0, 0, 0, 0.3);
        /* border-bottom: 1px solid rgba(0, 0, 0, 0.3);  */} }
     .ring-style-option .option-block--ring-msg .line,  .ring-style-option2 .option-block--ring-msg .line {
       border-bottom: solid 1px #000;
       margin: 25px auto; }
     .ring-style-option .option-block--ring-msg .ring-msg-textarea, .ring-style-option2 .option-block--ring-msg .ring-msg-textarea {
       border: solid 1px #000;
       width: 100%;
       display: block;
       margin-top: 25px;
       margin-bottom: 5px;
       padding: 5px;
       box-sizing: border-box; }
     .ring-style-option .option-block--ring-msg .remark-txt small {
       width: 70%;
       opacity: 0.5;
       display: inline-block; }
     .ring-style-option .option-block--ring-msg .heart-icon {
       width: 10%;
       border: solid 1px #000;
       display: inline-block;
       letter-spacing: normal;
       text-align: center;
       margin-left: 5px;
       float: right; }
     .ring-style-option2 .option-block--ring-situation {
       margin-right: 0px; }
   .ring-style-option .gold-type {
     margin: 35px auto;
     padding: 10px 25px;
     display: block;
     box-sizing: border-box;
     border-radius: 30px; }
     @media screen and (max-width: 1480px) {
       .is-eshop .ring-style-option .gold-type {
         font-size: 13px;
         white-space: nowrap; } }
     @media screen and (max-width: 991px) {
       .is-eshop .ring-style-option .gold-type {
         font-size: 12px; } }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .gold-type {
         width: 45%;
         display: inline-block;
         font-size: 12px;
         padding: 10px 10px;
         margin: 5px auto; } }
     .ring-style-option .gold-type span {
       display: inline-block;
       vertical-align: middle;
       margin-left: 10px; }
       @media screen and (max-width: 1480px) {
         .is-eshop .ring-style-option .gold-type span {
           width: calc(100% - 45px);
           white-space: normal; } }
       @media screen and (max-width: 991px) {
         .is-eshop .ring-style-option .gold-type span {
           width: calc(100% - 35px);
           white-space: normal; } }
     .ring-style-option .gold-type:before {
       content: '';
       width: 42px;
       height: 42px;
       border-radius: 50%;
       background-color: #FFF;
       display: inline-block;
       vertical-align: middle;
       background-size: cover; }
       @media screen and (max-width: 1480px) {
         .is-eshop .ring-style-option .gold-type:before {
           width: 32px;
           height: 32px; } }
       @media screen and (max-width: 991px) {
         .is-eshop .ring-style-option .gold-type:before {
           width: 24px;
           height: 24px; } }
     .ring-style-option .gold-type.active {
       font-weight: 700;
       background-color: #FFF; }
     .ring-style-option .gold-type--kw:before {
       background-image: url(../images/gold/kw.jpg); }
     .ring-style-option .gold-type--ky:before {
       background-image: url(../images/gold/ky.jpg); }
     .ring-style-option .gold-type--kr:before {
       background-image: url(../images/gold/kr.jpg); }
     .ring-style-option .gold-type--pt:before {
       background-image: url(../images/gold/kw.jpg); }
   .ring-style-option .texture-type {
     margin: 35px auto;
     padding: 10px 25px;
     display: block;
     box-sizing: border-box;
     border-radius: 30px; }
     @media screen and (max-width: 1480px) {
       .is-eshop .ring-style-option .texture-type {
         font-size: 13px;
         white-space: nowrap; } }
     @media screen and (max-width: 991px) {
       .is-eshop .ring-style-option .texture-type {
         font-size: 12px; } }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .texture-type {
         width: 45%;
         display: inline-block;
         font-size: 12px;
         padding: 10px 10px;
         margin: 5px auto; } }
     .ring-style-option .texture-type span {
       display: inline-block;
       vertical-align: middle;
       margin-left: 10px; }
       @media screen and (max-width: 1480px) {
         .is-eshop .ring-style-option .texture-type span {
           width: calc(100% - 45px);
           white-space: normal; } }
       @media screen and (max-width: 991px) {
         .is-eshop .ring-style-option .texture-type span {
           width: calc(100% - 24px);
           white-space: normal; } }
     .ring-style-option .texture-type:before {
       content: '';
       width: 42px;
       height: 42px;
       border-radius: 50%;
       background-color: #FFF;
       display: inline-block;
       vertical-align: middle;
       background-size: cover; }
       @media screen and (max-width: 1480px) {
         .is-eshop .ring-style-option .texture-type:before {
           width: 32px;
           height: 32px; } }
       @media screen and (max-width: 991px) {
         .is-eshop .ring-style-option .texture-type:before {
           width: 24px;
           height: 24px; } }
     .ring-style-option .texture-type.active {
       font-weight: 700;
       background-color: #FFF; }
     .ring-style-option .deactive {
       opacity: 0.3; }
     .ring-style-option .texture-type--hammer:before,
     .ring-style-option .texture-type--hammertone:before  {
       background-image: url(../images/texture/hammer.jpg); }
     .ring-style-option .texture-type--linear:before,
     .ring-style-option .texture-type--linea:before {
       background-image: url(../images/texture/linear.jpg); }
     .ring-style-option .texture-type--smooth:before,
     .ring-style-option .texture-type--shine:before{
       background-image: url(../images/texture/smooth.jpg); }
     .ring-style-option .texture-type--sand:before,
     .ring-style-option .texture-type--frosted:before {
       background-image: url(../images/texture/sand.jpg); }
     .ring-style-option .texture-type--hairline:before {
       background-image: url(../images/texture/hairline.jpg); }
   .ring-style-option .width-type {
     margin: 35px auto;
     padding: 10px 25px;
     display: block;
     box-sizing: border-box;
     border-radius: 30px;
     text-align: center; }
     .ring-style-option .width-type.active {
       font-weight: 700;
       background-color: #FFF; }
     @media screen and (max-width: 1480px) {
       .is-eshop .ring-style-option .width-type {
         font-size: 13px; } }
     @media screen and (max-width: 991px) {
       .is-eshop .ring-style-option .width-type {
         font-size: 12px; } }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .width-type {
         width: 30%;
         display: inline-block;
         font-size: 12px;
         white-space: nowrap;
         padding: 10px 10px;
         margin: 5px auto;
         text-align: center; } }
   .ring-style-option .size-type {
     width: 33%;
     height: 35px;
     line-height: 35px;
     display: inline-block;
     text-align: center;
     letter-spacing: normal;
     margin: 10px auto; }
     @media screen and (max-width: 1480px) {
       .is-eshop .ring-style-option .size-type {
         font-size: 13px; } }
     @media screen and (max-width: 991px) {
       .is-eshop .ring-style-option .size-type {
         font-size: 12px; } }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .size-type {
         width: 24%;
         display: inline-block;
         font-size: 12px;
         white-space: nowrap;
         padding: 10px 10px;
         margin: 5px auto;
         text-align: center; } }
     .ring-style-option .size-type.active span {
       font-weight: 700;
       width: 35px;
       background-color: #FFF;
       display: inline-block;
       border-radius: 50%; }
   .ring-style-option .outer-diamond-type {
     margin: 35px auto;
     padding: 10px 50px;
     display: block;
     box-sizing: border-box;
     border-radius: 30px; }
     @media screen and (max-width: 1480px) {
       .is-eshop .ring-style-option .outer-diamond-type {
         font-size: 13px; } }
     @media screen and (max-width: 991px) {
       .is-eshop .ring-style-option .outer-diamond-type {
         font-size: 12px; } }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .outer-diamond-type {
         width: 45%;
         display: inline-block;
         font-size: 12px;
         white-space: nowrap;
         padding: 10px 10px;
         margin: 5px auto; } }
     .ring-style-option .outer-diamond-type span {
       display: inline-block;
       vertical-align: middle;
       margin-left: 10px; }
     .ring-style-option .outer-diamond-type:before {
       content: '';
       width: 27px;
       height: 27px;
       border-radius: 50%;
       display: inline-block;
       vertical-align: middle;
       background-size: cover; }
     .ring-style-option .outer-diamond-type.active {
       font-weight: 700;
       background-color: #FFF; }
     .ring-style-option .outer-diamond-type--diamond:before {
       background-image: url(../images/gems/diamond.png); }
     .ring-style-option .outer-diamond-type--none:before {
       background-image: url(../images/gems/none.png); }
   .ring-style-option .inner-diamond-type {
     position: relative;
     width: 33.3%;
     display: inline-block;
     text-align: center;
     letter-spacing: normal;
     margin: 20px auto;
     line-height: 1.2em; }
     @media screen and (max-width: 1480px) {
       .is-eshop .ring-style-option .inner-diamond-type {
         font-size: 13px; } }
     @media screen and (max-width: 991px) {
       .is-eshop .ring-style-option .inner-diamond-type {
         font-size: 12px; } }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .inner-diamond-type {
         margin: 12px auto; } }
     .ring-style-option .inner-diamond-type .birth-month {
       font-size: 65%;
       color: #f1af8f;
       display: block; }
     .ring-style-option .inner-diamond-type.active .birth-stone {
       font-weight: 700; }
       /*
     .ring-style-option .inner-diamond-type.active:before {
       content: '';
       position: absolute;
       top: 50%;
       left: 50%;
       width: 80px;
       height: 80px;
       margin-top: -40px;
       margin-left: -40px;
       background-color: #FFF;
       display: inline-block;
       border-radius: 50%; }
       */
       @media screen and (max-width: 767px) {
         .is-eshop .ring-style-option .inner-diamond-type.active:before {
           width: 45px;
           height: 45px;
           margin-top: -22.5px;
           margin-left: -22.5px; } }
     .ring-style-option .inner-diamond-type .birth-stone {
       position: relative;
       z-index: 10; }
       .ring-style-option .inner-diamond-type .birth-stone:before {
         content: '';
         width: 25px;
         height: 25px;
         border-radius: 50%;
         display: block;
         margin: auto;
         background-size: cover; }
       .ring-style-option .inner-diamond-type .birth-stone--garnet:before {
         background-image: url(../images/gems/garnet.png); }
       .ring-style-option .inner-diamond-type .birth-stone--amethst:before {
         background-image: url(../images/gems/amethst.png); }
       .ring-style-option .inner-diamond-type .birth-stone--aquamarine:before {
         background-image: url(../images/gems/aquamarine.png); }
       .ring-style-option .inner-diamond-type .birth-stone--diamond:before {
         background-image: url(../images/gems/diamond.png); }
       .ring-style-option .inner-diamond-type .birth-stone--emerald:before {
         background-image: url(../images/gems/emerald.png); }
       .ring-style-option .inner-diamond-type .birth-stone--moonstone:before {
         background-image: url(../images/gems/moonstone.png); }
       .ring-style-option .inner-diamond-type .birth-stone--ruby:before {
         background-image: url(../images/gems/ruby.png); }
       .ring-style-option .inner-diamond-type .birth-stone--peridot:before {
         background-image: url(../images/gems/peridot.png); }
       .ring-style-option .inner-diamond-type .birth-stone--sapphire:before {
         background-image: url(../images/gems/sapphire.png); }
       .ring-style-option .inner-diamond-type .birth-stone--tourmaline:before {
         background-image: url(../images/gems/tourmaline.png); }
       .ring-style-option .inner-diamond-type .birth-stone--citrine:before {
         background-image: url(../images/gems/citrine.png); }
       .ring-style-option .inner-diamond-type .birth-stone--tanzanite:before {
         background-image: url(../images/gems/tanzanite.png); }
       .ring-style-option .inner-diamond-type .birth-stone--none:before {
         background-image: url(../images/gems/none.png); }
   .ring-style-option .font-type {
     margin: 25px auto;
     padding: 5px 35px;
     display: block;
     box-sizing: border-box;
     border-radius: 30px;
     text-align: center; }
     @media screen and (max-width: 1480px) {
       .is-eshop .ring-style-option .font-type {
         font-size: 13px; } }
     @media screen and (max-width: 991px) {
       .is-eshop .ring-style-option .font-type {
         font-size: 12px; } }
     @media screen and (max-width: 767px) {
       .is-eshop .ring-style-option .font-type {
         width: 45%;
         display: inline-block;
         font-size: 12px;
         white-space: nowrap;
         padding: 10px 10px;
         margin: 5px auto;
         text-align: center; } }
     .ring-style-option .font-type img {
       width: 100%;
       max-width: 125px; }
     .ring-style-option .font-type.active {
       font-weight: 700;
       background-color: #FFF; }
   .ring-style-option .ring-situation-select-btn, .ring-style-option2 .ring-situation-select-btn {
     width: 45%;
     display: inline-block; }
     .ring-style-option .ring-situation-select-btn img, .ring-style-option2 .ring-situation-select-btn img {
       width: 100%;
       max-width: 40px;
       opacity: 0.3; }
     .ring-style-option .ring-situation-select-btn.active img, .ring-style-option2 .ring-situation-select-btn.active img {
       opacity: 1; }
   .ring-style-option .ring-situation-list, .ring-style-option2 .ring-situation-list {
     width: 100%;
     letter-spacing: normal; }
     .ring-style-option .ring-situation-list td,  .ring-style-option2 .ring-situation-list td {
       width: 55%;
       padding: 5px 5px; }
     .ring-style-option .ring-situation-list .clear-line, .ring-style-option2 .ring-situation-list .clear-line {
       border-top: solid 1px #000; }

 .is-eshop .pair-ring-btn.ring-situation-btn, .is-eshop .pair-ring-btn.ring-situation2-btn, .is-eshop .pair-ring-btn.pair-ring-back-btn {
 	background: #F5F5F5;
     color: black;
 	border:1px solid #F5F5F5;
 }
 .is-eshop .pair-ring-btn.pair-ring-reserve-mobile-btn {
     background: #F5F5F5;
     color: #000;
     border:1px solid #F5F5F5;
 }


  @media screen and (max-width: 767px) {
 	.is-eshop .pair-ring-btn.ring-situation-btn,.is-eshop .pair-ring-btn.ring-next-btn,
 	.is-eshop .pair-ring-btn.pair-ring-back-btn, .is-eshop .pair-ring-btn.pair-ring-buy-btn,
 	.is-eshop .pair-ring-btn.ring-prev-btn, .is-eshop .pair-ring-btn.pair-ring-reserve-mobile-btn{
 		width:50%;
 		float:left;
 		margin:0px;
 	}
     .is-eshop .pair-ring-btn.ring-next-btn{
         float:right;
     }

     .is-eshop .ring-style .pair-ring-btn--solid.pair-ring-btn.ring-situation2-btn{
         /*margin-right:2%;*/
     }
  }
 /* END Style ring-design used  */
 /* ------------------------------------------ */
 .is-eshop .option-block--size {
   text-align: center; }
   .is-eshop .option-block--size .display--table {
     width: 100%;
     text-align: left; }
   .is-eshop .option-block--size .pair-ring-btn {
     margin-top: 15px; }

 .is-eshop .pair-ring-btn--ruler{
 	color: #caa474;
     text-decoration: underline;
     margin-top: 10px;
 }

 .is-eshop .pair-ring-btn--ruler:before {
   background-image: url("../images/icon/gold/ruler.svg"); }
 @media screen and (max-width: 767px) {
   .is-eshop .ring-situation-btn {
  /*   display: none;*/ } }
 @media screen and (max-width: 767px) {
   .is-eshop .ring-style-option .option-block--ring-msg .line {
     border-bottom: 0; }
     .is-eshop .ring-style-option .option-block--ring-msg .line:before {
       content: '';
       display: block;
       position: relative;
       background: rgba(0, 0, 0, 0.3);
       width: 200vw;
       height: 1px;
       margin-left: -50vw; }

 	.sticky{
 		position: fixed;
 		bottom:0px;
 		width:100%;
 		z-index:98;
 	    left: 0px;
        margin: 0 auto;
 	}


 	  }


 .mobile-tips, .mobile-reset, .mobile-viewDesign {
   display: none;
   position: absolute;
   top: 530px;
 	right: 20px;
 	z-index: 10;
   width: 30px;
   height: 30px;
   border: 1px solid #000;
   }
   .mobile-tips:before {
     content: '';
     position: absolute;
     width: 15px;
     height: 22px;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     background: url(../images/icon/black/hints.svg) no-repeat center center;
     background-size: cover; }

 .ring-reset-btn.mobile-reset{
 	top:60px;
 	left:20px;
 	right:unset;
 }


 .mobile-viewDesign{
 	top:100px;
 	left:20px;
 	right:unset;
 }
 .is-eshop .ring-reset-btn:before, .mobile-reset:before {
 		content: '';
 		position: absolute;
 		width: 25px;
 		height: 41px;
 		left: 50%;
 		top: 89%;
 		-webkit-transform: translate(-50%, -50%);
 		-ms-transform: translate(-50%, -50%);
 		transform: translate(-50%, -50%);
 		background: url(../images/icon/black/redesign.svg) no-repeat center center;
 		background-size: cover;
 	}

 .mobile-viewDesign:before {
 		content: '';
 		position: absolute;
 		width: 20px;
 		height: 20px;
 		left: 50%;
 		top: 50%;
 		-webkit-transform: translate(-50%, -50%);
 		-ms-transform: translate(-50%, -50%);
 		transform: translate(-50%, -50%);
 		background: url(../images/icon/black/view.svg) no-repeat center center;
 		background-size: cover;
 	}

 	.single-ring-selected .mobile-tips{
 		top: 445px;
 	}
   @media screen and (min-width: 768px) {
     .is-eshop .mobile-tips {
       display: none !important; } }

 @media screen and (max-width: 767px) {
   .is-eshop .pair-ring-popup-block--white {
     width: 90%;
     padding: 80px 5%;
     max-height: 80vh;
     overflow: auto; }

 	.is-eshop .ring-design__panel .ring-reset-btn{
 		display:none;
 	}

 	.mobile-reset, .mobile-viewDesign{
 		display:block;
 	}

     #pair-ring-popup .pair-ring-popup-block--white {
         position: fixed !important;
         top: 40%;
         left: 0%;
     }

     .newsTop  #pair-ring-popup .pair-ring-popup-block--white.pair-ring-popup-block--size-ref,
     .newsTop  #pair-ring-popup .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond{
         top: 13%;
         left: 5%;
     }
     #pair-ring-popup .pair-ring-popup-block--white.pair-ring-popup-block--size-ref,
     #pair-ring-popup .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond,
     #pair-ring-popup .pair-ring-popup-block--white.pair-ring-popup-block--reserve-shop{
         top: 10%;
         left: 5%;
     }

   #pair-ring-popup .pair-ring-popup-block--white.pair-ring-popup-block--share--email{
     top: 10%;
     left: 5%;
   }

 }


 @media screen and (max-width: 767px) {
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref {
     width: 90%; }
     .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref table,
     .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref tbody,
     .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref tr {
       position: relative;
       display: block;
       font-size: 0; }
     .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref tr {
       display: -ms-flexbox;
       display: -webkit-flex;
       display: flex;
       -webkit-flex-direction: row;
       -ms-flex-direction: row;
       flex-direction: row;
       -webkit-flex-wrap: wrap;
       -ms-flex-wrap: wrap;
       flex-wrap: wrap;
       -webkit-justify-content: flex-start;
       -ms-flex-pack: start;
       justify-content: flex-start;
       -webkit-align-content: stretch;
       -ms-flex-line-pack: stretch;
       align-content: stretch;
       -webkit-align-items: flex-start;
       -ms-flex-align: start;
       align-items: flex-start; }
     .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref td {
       display: inline-block;
       width: 33.3333%; }
       .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref td p {
         margin: 0 auto; } }
 @media screen and (max-width: 480px) {
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--size-ref td {
     display: inline-block;
     width: 50%; } }

 @media screen and (max-width: 991px) {
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond {
     width: 90%;
     padding: 80px 5%;
     max-height: 80vh;
     overflow: auto; }
     .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond td p {
       font-size: 12px; } }
 @media screen and (max-width: 640px) {
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond table,
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond tbody,
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond tr {
     position: relative;
     display: block;
     font-size: 0; }
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond tr {
     display: -ms-flexbox;
     display: -webkit-flex;
     display: flex;
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
     flex-direction: row;
     -webkit-flex-wrap: wrap;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -webkit-justify-content: flex-start;
     -ms-flex-pack: start;
     justify-content: flex-start;
     -webkit-align-content: stretch;
     -ms-flex-line-pack: stretch;
     align-content: stretch;
     -webkit-align-items: flex-start;
     -ms-flex-align: start;
     align-items: flex-start; }
   .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond td {
     display: inline-block;
     width: 50%; }
     .is-eshop .pair-ring-popup-block--white.pair-ring-popup-block--inner-diamond td p {
       margin: 0 auto; } }

 .is-eshop .ring-holder > div,
 .is-eshop .ring-holder canvas {
   top: 0;
   left: 0;
   width: 100% !important;
   height: 100% !important; }
 @media screen and (max-width: 991px) and (min-width: 768px) {
   .is-eshop .ring-holder {
     height: auto;
     top: 50%;
     -webkit-transform: translateY(-50%);
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
     left: 30%;
     width: 40%;
     margin: 0;
     max-width: 500px; }
     .is-eshop .ring-holder:before {
       content: '';
       display: block;
       position: relative;
       width: 100%;
       padding-bottom: 75%; } }

 @media screen and (max-width: 767px) {
   .is-eshop .pair-ring-popup-block--design-code {
     display: block;
     width: 90%;
     max-height: 80vh;
     padding: 0;
     overflow: auto; }
   .is-eshop .pair-ring-popup-block__close {
     z-index: 15; }
   .is-eshop .pair-ring-popup-block--design-code__kv {
     display: block;
     width: 100%; }
   .is-eshop .pair-ring-popup-block--design-code__content {
     display: block;
     width: 100%;
     padding: 30px 5%; }
     .is-eshop .pair-ring-popup-block--design-code__content .pair-ring-btn {
       width: 100%; }
     .is-eshop .pair-ring-popup-block--design-code__content input {
       margin: 0 auto 45px; } }

 .email-kv-mb {
   display: none; }

 @media screen and (max-width: 767px) {
   .is-eshop .email-kv-dt {
     display: none; }
   .is-eshop .email-kv-mb {
     display: block; } }

 .mob-option-title {
   display: none;
   font-size: 16px;
   position: relative;
   font-weight: bold;
   width: 100%;
   margin-bottom: 15px;
   text-align: left; }

 @media screen and (max-width: 767px) {
   .is-eshop .dt-option-title {
     display: none; }
   .is-eshop .mob-option-title {
     display: block; } }

 .message-container{
     margin:0px;
     margin-bottom:40px;
 }
 .message-container p{
     font-size:20px;
 }
 .message-container p:first-child{
     font-size:30px;
 }
 .btn btn-block.btn-gray-darker.btn-close{
     width: 92%;
     margin: 0 auto;
 }

 @media screen and (max-width: 768px) {
 #nav-title{
     padding: 0px;
     display: none;
 }
 }


 #colorbox, #cboxWrapper, #cboxContent, #cboxLoadedContent{
     width: 460px !important;
 }

 #colorbox{
      left: 50% !important;
      margin-left:-230px !important;
 }

 .page-diyPromessaPairRing #content .btn-gray-darker{
 background: #cb7d74;
     border: 1px solid #cb7d74;
    }

 .page-diyPromessaPairRing #content .btn-gray-darker:hover {
      background: #cb7d74;
    }


 /* ------------------------------------------ */
 #pair-ring-share {
   position: relative;
   width: 100%;
   height: 100%;
    min-height: 800px;
    }

 .pair-ring-share__content {
   position: relative;
}
   @media screen and (max-width: 991px) {
     .is-eshop .pair-ring-share__content {
       padding: 0px 20%; } }
   @media screen and (max-width: 767px) {
     .is-eshop .pair-ring-share__content {
       padding: 0px 5%;   }
       .display--table-cell{
         display:block;
       }
       #pair-ring-share {
         position: relative;
         width: 100%;
         height: calc(100% - 300px);
          min-height:auto;
          }

       }

 #table-shopping-bag-c #details{
    width: 100%;
    min-width: 800px;
 }

 #table-shopping-bag-c .img,
 #table-shopping-bag-c .info,
 #table-shopping-bag-c .price{
     background: rgba(255,255,255,0.7);
     position: relative;
     padding: 5px;
     display:table-cell;
     vertical-align: middle;
 }

 #table-shopping-bag-c .price{
     vertical-align: middle;
     width: 35%;
     text-align: center;
 }
#table-shopping-bag-c .info {
    padding-top: 3%;
    width: 41%;
}
 #table-shopping-bag-c .price .removeItem{
     position: absolute;
     right: 3%;
     top: 4%;
 }

 #table-shopping-bag-c .price .product-real-price{
     color:#cb7d74;
     font-size: 25px;
 }

 #table-shopping-bag-c .info .name{
     margin-bottom: 5px;
 }

  #table-shopping-bag-c .borderhr{
    width: 4px;
  }
 #table-shopping-bag-c .borderhr hr{
    width: 1px;
    height:50px;
    border: none;
    border-right: 1px solid #999;
    margin-right: 4px;
 }

 #table-shopping-bag-c .info .maxcont .one{
    width: 160px;
    margin: 25px 4px 0px;
    height: fit-content;
 }
 #table-shopping-bag-c .info .maxcont .two{
   width: 160px;
   margin: 25px 0px 0px 15px;
   height: fit-content;
 }
#table-shopping-bag .price .item.product-real-price{
    font-size:24px;
}

#table-shopping-bag #cartData{
    margin: 10px 0;
}

#table-shopping-bag-c .name .name1{
    font-size:15px;
}

#table-shopping-bag-c .name .name2{
    font-weight: bold;
}

#table-shopping-bag-c .info .maxcont{
        display: flex;
    }

#pair-ring-load-design .left-group div.designNowBtn{
    margin-top: 115px;
 }

   @media screen and (max-width: 767px) {
     .noneDesign{
         width:90%;
         margin:0 auto;
     }

     #pair-ring-load-design .left-group div.designNowBtn{
         margin-top: 35px;
      }

     .pair-ring-load-design__content{
        min-width:unset;
        width:80%;
        display: table;
     }

      #pair-ring-load-design{
        overflow: hidden;
        height: auto;
        min-height: 100%;
        background: url(../images/background.jpg) no-repeat center center;
        background-size: cover;
        padding-top: 100px;
        padding-bottom: 60px;
     }

     .main-group{
        width:100%;
        display: block;
     }
     .left-group, .right-group{
        width:100%;
     }
    #pair-ring-load-design .left-group div{
        width:100%;
    }

    #pair-ring-load-design .right-group .right-group1{
        margin:0px;
    }

    #pair-ring-load-design .right-group .right-group2{
            margin:30px 0px;
        }

    #pair-ring-load-design .left-group .pair-ring-btn,
    #pair-ring-load-design .right-group .pair-ring-load-design__btn{
        float: unset !important;
        width:100%
        }

     .mid-group{
            clear: both;
            margin-top: 30px;
     }
     .min-line {
         width: 42%;
         float: unset;
         border-top: 1px solid #cb7d74;
         display: inline-block;
		 margin: 4px;
     }

     .logo-site img{
        width: 75%;
     }

     .page-diyPromessaPairRing #table-shopping-bag-c .img{
        width: 130px !important;
        min-width: 100px !important;
        margin-top: 64px;
        padding: 13px 0px;
     }
     #table-shopping-bag-c .info{
        padding:0px !important;
     }

      #table-shopping-bag-c .info .name{
        padding:30px 5px 5px 5px;
        text-align:center;
     }
    #table-shopping-bag-c .info .maxcont{
        display:unset;
        width: calc(100% - 130px);
        position: absolute;
        left: 130px;
        background: rgba(255,255,255,0.7);
        height: 124px;
    }
     #table-shopping-bag-c .info .maxcont .one,
     #table-shopping-bag-c .info .maxcont .two{
        width: 100%;
        margin: 10px 0px;
        height: fit-content;
     }
     #table-shopping-bag-c .borderhr{
        width:90%;
     }
    #table-shopping-bag-c .borderhr hr{
        width: 100%;
        height: 1px;
        border: none;
        border-top: 1px solid #999;
        margin: 0px;
    }
    #table-shopping-bag-c .price{
        padding:10px 0px !important;
        display: block;
        margin-top: 124px;
        width: 100%;
    }
    #table-shopping-bag-c .price .removeItem{
        font-size: 14px !important;
        width: 85px !important;
        top: -184px !important;
    }

    #table-shopping-bag-c .name .name1{
        font-size:13px;
        display:inline-block !important;
    }

    #table-shopping-bag-c .name .name2{
       font-size:14px;
        display:inline-block !important;
    }
    .design-serial p{
        font-size: 18px;
    }
 }

/* Style for generic-loading */
/* ------------------------------------------ */
/* Add By Harlan king 20200324 */
.generic-loading {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: url() no-repeat center center rgba(255, 255, 255, 0.7);
    background-image: url(../images/icon-loading-circle.gif) !important;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 10000; }
.theme-mg .generic-loading {
    background-image: url(../images/icon-loading-circle-mg.gif) !important; }
.loading-design .generic-loading, .generic-loading.is-active {
    display: block; }

/* ------------------------------------------ */
/* END Style generic-loading  */



#slidePanel-reserve .reservation-done-success{
    padding: 40% 15%;
    text-align: center;
}


/* promotion */

.is-eshop #pair-ring-menu .header-nav-btn.backtopromotion{
        font-size: 12px;
}

.is-eshop #pair-ring-menu .pair-ring-menu-btn.backtopromotion:before{
    background:none;
}

body:not(.mobile) #pair-ring-menu .pair-ring-menu-btn.backtopromotion:hover{
    font-weight:normal;
}

 @media screen and (max-width: 768px) {
    .is-eshop #pair-ring-menu .pair-ring-menu-btn.backtopromotion{
         top: 7px;
         left: 4%;
    }
 }


 .solitaire_promotion{
     position: relative;
     margin: 0px auto 10px -510px;
     display:none;
 }

  @media screen and (max-width: 768px) {
     .solitaire_promotion{
         margin: 0px;
         text-align: left;
     }
  }

 .monthly .solitaire_promotion,
 .flashSale .solitaire_promotion{
     display:block;
}