/* INITIAL CSS */
body {font-family: 'GeneralFont', Arial, Verdana;}

h1, h2, h3, h4, h5, h6 {font-family: 'TitleFont', Arial, Verdana;}
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong,
h1 b, h2 b, h3 b, h4 b, h5 b, h6 b {font-family: 'TitleBoldFont', Arial, Verdana;}
h1 em, h2 em, h3 em, h4 em, h5 em, h6 em,
h1 i, h2 i, h3 i, h4 i, h5 i, h6 i {font-family: 'TitleItalicFont', Arial, Verdana;}
h1 b i, h1 i b, h1 b em, h1 em b, h1 strong i, h1 i strong, h1 strong em, h1 em strong, 
h2 b i, h2 i b, h2 b em, h2 em b, h2 strong i, h2 i strong, h2 strong em, h2 em strong, 
h3 b i, h3 i b, h3 b em, h3 em b, h3 strong i, h3 i strong, h3 strong em, h3 em strong, 
h4 b i, h4 i b, h4 b em, h4 em b, h4 strong i, h4 i strong, h4 strong em, h4 em strong, 
h5 b i, h5 i b, h5 b em, h5 em b, h5 strong i, h5 i strong, h5 strong em, h5 em strong, 
h6 b i, h6 i b, h6 b em, h6 em b, h6 strong i, h6 i strong, h6 strong em, h6 em strong {font-family: 'TitleBoldItalicFont', Arial, Verdana;}

h1 {font-size: 40px; line-height: 48px; margin-bottom: 15px;}
h2 {font-size: 36px; line-height: 44px; margin-bottom: 15px;}
h3 {font-size: 32px; line-height: 40px; margin-bottom: 15px;}
h4 {font-size: 28px; line-height: 36px; margin-bottom: 15px;}
h5 {font-size: 24px; line-height: 32px; margin-bottom: 15px;}

@media only screen and (max-width: 768px) {
	h1 {font-size: 37px; line-height: 45px; }
	h2 {font-size: 33px; line-height: 41px; }
	h3 {font-size: 29px; line-height: 37px; }
	h4 {font-size: 25px; line-height: 33px; }
	h5 {font-size: 21px; line-height: 29px; }	
}
@media only screen and (max-width: 500px) {
	h1 {font-size: 34px; line-height: 42px; }
	h2 {font-size: 30px; line-height: 38px; }
	h3 {font-size: 26px; line-height: 34px; }
	h4 {font-size: 22px; line-height: 30px; }
	h5 {font-size: 18px; line-height: 26px; }	
}

p, p a {font-size: 14px; line-height: 24px; color: #555555;}
p a:hover {text-decoration: underline; color: #a8b324; }

a {color: #000000; font-size: 14px; line-height: 24px; text-decoration: none;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
a:hover {color: none; text-decoration: none;}
.cl-secondary {color: #a8b324;}
.cl-ternary {color: #0a472e;}

b, strong {font-family: 'BoldFont', Arial, Verdana;}
i, em {font-family: 'ItalicFont', Arial, Verdana;}
b i, i b, b em, em b, strong i, i strong, strong em, em strong {font-family: 'BoldItalicFont', Arial, Verdana; font-style: italic;}

.ta-center {text-align: center;}
.ta-left {text-align: left;}
.ta-right {text-align: right;}
.fl-left {float: left;}
.fl-right {float: right;}
.fl-clear {clear: both;}

img {display: block; max-width: 100%; max-height: 100%;}
.gen-img-wrap {position: relative;}
.gen-img-wrap img.centered {margin: 0 auto;}
/* /INITIAL CSS */


/* GENERAL LAYOUT CSS */
.sfw {float: left; width: 100%; position: relative;}
.wrap {width: 95%; margin: 0 auto; position: relative;}
/* /GENERAL LAYOUT CSS */


/* TABLE */
table {width: 100%;}
table thead {}
table thead th {border: 1px solid #bfbfbf; background: #ffff00; padding: 8px; font-size: 15px; line-height: 23px; text-align: left; vertical-align: middle;}
table tbody {}
table tbody tr {}
table tbody tr td {border-top: 1px solid #bfbfbf; border-left: 1px solid #bfbfbf; padding: 8px; vertical-align: middle; font-size: 15px; line-height: 23px;}
table tbody tr:last-child td {border-bottom: 1px solid #bfbfbf;}
table tbody tr td:last-child {border-right: 1px solid #bfbfbf;}
table tfoot td {border: 1px solid #bfbfbf; background: #00ffff; padding: 8px; font-size: 15px; line-height: 23px; text-align: left; vertical-align: middle;}
/* /TABLE */


/* FORM */
input[type=text], input[type=email], input[type=password], input[type=number], textarea {background: #ffffff; font-family: 'GeneralFont', Arial, Verdana; border: 1px solid #e1e1e1; box-sizing: border-box; height: 55px; padding: 15px 20px; font-size: 14px; line-height: 20px; color: #555555; width: 100%;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
input[type=text]:hover, input[type=text]:focus, input[type=email]:hover, input[type=email]:focus, input[type=password]:hover, input[type=password]:focus, 
input[type=number]:hover, input[type=number]:focus, textarea:hover, textarea:focus {outline: 0; border: 1px solid #a8b324;}
input[type=text]:read-only, input[type=email]:read-only, input[type=password]:read-only, textarea:read-only {background: #eaeaea; cursor: not-allowed;}
textarea.no-resize {resize: none;}

select {font-family: 'GeneralFont', Arial, Verdana; font-size: 15px; line-height: 23px; color: #000; box-sizing: border-box;}
select:hover, select:focus {outline: 0;}
.styled-select-wrapper {width: 100%; box-sizing: border-box; overflow: hidden; border: 1px solid #e1e1e1; height: 55px; background: url(../images/icon/arrow-down.png) no-repeat right 15px center #ffffff; background-size: auto 6px;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}
.styled-select-wrapper select {display: block; width: 120%; border: none; box-sizing: border-box; background: transparent; height: 55px; padding: 0px 12px; color: #555555; font-size: 14px; line-height: 20px;}
.styled-select-wrapper select option {background: none;}

input[type="checkbox"] {font-family: 'GeneralFont', Arial, Verdana; font-size: 15px; line-height: 23px;}
.styled-checkbox-wrapper {}
.styled-checkbox-wrapper input[type="checkbox"] {display: none;}
.styled-checkbox-wrapper label {font-family: 'GeneralFont'; font-size: 15px; line-height: 23px; padding-top: 3px; color: #000; display: inline-block; padding-left: 35px; background: url(../images/icon/checkbox.png) no-repeat left top; background-size: 25px auto;}
.styled-checkbox-wrapper label:hover {cursor: pointer;}
.styled-checkbox-wrapper input[type="checkbox"]:checked + label {background: url(../images/icon/checkbox-checked.png) no-repeat left top; background-size: 25px auto;}

input[type="radio"] {font-family: 'GeneralFont', Arial, Verdana;font-size: 15px; line-height: 23px;}
.styled-radio-wrapper input[type="radio"] {display:none;}
.styled-radio-wrapper label {display:inline-block; padding: 1px 0px 0px 31px; font-size: 15px; line-height: 23px; font-family: 'GeneralFont', Arial, Verdana; background: url(../images/icon/radio-off.png) no-repeat left top 0px; cursor: pointer;}
.styled-radio-wrapper input[type="radio"]:checked + label {background: url(../images/icon/radio-on.png) no-repeat left top 0;}

input[type="file"] {font-family: 'GeneralFont', Arial, Verdana;}
.styled-input-file-wrapper {cursor: pointer; font-size: 14px; line-height: 55px; color: #555555; padding: 0px 20px; font-family: 'GeneralFont', Arial, Verdana; box-sizing: border-box; height: 55px; background: url(../images/icon/file-upload.png) no-repeat 99% center #ffffff; background-size: 16px 16px; border: 1px solid #e1e1e1;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.styled-input-file-wrapper:hover {border: 1px solid #a8b324;}
.styled-input-file-wrapper input[type="file"] {display: none;}
.styled-input-file-wrapper label {}

input[type="submit"], button, a.btn {display: inline-block; background: #a8b324; border: none; outline: 0; box-sizing: border-box; cursor: pointer;
font-family: 'GeneralFont', Arial, Verdana; color: #ffffff; font-size: 15px; line-height: 15px; height: 55px; padding: 15px 20px;
border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
input[type="submit"]:hover, input[type="submit"]:focus, button:hover, button:focus, a.btn:hover, a.btn:focus {background: #879018;}
a.btn {padding: 0 20px; line-height: 55px; font-size: 14px;}

form.gen-form::-webkit-input-placeholder, form.gen-form ::placeholder {color: #b1b1b1;}
/* /FORM */


/* WYSIWYG CONTENT */
.wysiwyg-content, .wysiwyg-content p, .wysiwyg-content a, .wysiwyg-content ul li, .wysiwyg-content ol li {font-size: 14px; color: #555555; line-height: 24px; font-family: 'GeneralFont', Arial, Verdana;}
.wysiwyg-content.medium, .wysiwyg-content.medium p, .wysiwyg-content.medium a, .wysiwyg-content.medium ul li, .wysiwyg-content.medium ol li {font-size: 14px; line-height: 24px;}
.wysiwyg-content.big, .wysiwyg-content.big p, .wysiwyg-content.big a, .wysiwyg-content.big ul li, .wysiwyg-content.big ol li {font-size: 18px; line-height: 28px; font-family: 'GeneralFont', Arial, Verdana;}
.wysiwyg-content.white, .wysiwyg-content.white p, .wysiwyg-content.white a, .wysiwyg-content.white ul li, .wysiwyg-content.white ol li {color: #fff;}
.wysiwyg-content img {}
.wysiwyg-content img.fr-dib {display: block; margin: 0 auto;}
.wysiwyg-content img.fr-dib.fr-fil {text-align: left;}
.wysiwyg-content img.fr-dib.fr-fir {text-align: right;}
.wysiwyg-content img.fr-dii {}
.wysiwyg-content img.fr-dii.fr-fil {float: left; margin-right: 30px;}
.wysiwyg-content img.fr-dii.fr-fir {float: right; margin-left: 30px;}

.wysiwyg-content a {color: #000;}
.wysiwyg-content a:hover {color: #c30d23; text-decoration: underline;}
.wysiwyg-content p a {color: #000;}
.wysiwyg-content p a:hover {color: #000;}
.wysiwyg-content.white a {color: #fff;}
.wysiwyg-content.white a:hover {color: #fff; text-decoration: underline}
.wysiwyg-content.white h1, .wysiwyg-content.white h2, .wysiwyg-content.white h3, .wysiwyg-content.white h4, .wysiwyg-content.white h5 {color: #fff;}
/* .wysiwyg-content ul li {padding-left: 0px; padding-bottom: 3px; margin-left: 40px; padding-left: 15px; float: none; display: block; background: url(../images/icon/black-dot.png) no-repeat left 10px; background-size: 4px auto;} */
.wysiwyg-content ul li {list-style-type: disc; margin-left: 55px;}
.wysiwyg-content ol li {list-style-type: decimal; margin-left: 55px;}
.wysiwyg-content.list-flat ol li {margin-left: 15px;}

.wysiwyg-content img.feat-img {float: left; max-width: 50%; margin-right: 20px; margin-bottom: 20px;}
.wysiwyg-content img {max-width: 100% !important;}

.wysiwyg-content table {width: 100%;}
.wysiwyg-content table tbody tr {border-top: 1px solid #eaeaea;}
.wysiwyg-content table tbody tr:last-child {border-bottom: 1px solid #eaeaea;}
.wysiwyg-content table tbody tr td {padding: 15px 20px; font-size: 15px; line-height: 23px; border-left: 1px solid #eaeaea; vertical-align: middle;} 
.wysiwyg-content table tbody tr td:last-child {border-right: 1px solid #eaeaea;}
.wysiwyg-content table.fr-alternate-rows tr:nth-child(odd) td {background: #fff;}
.wysiwyg-content table.fr-alternate-rows tr:nth-child(even) td {background: #f5f5f5;}

@media only screen and (max-width: 500px) {
	.wysiwyg-content, .wysiwyg-content p, .wysiwyg-content a, .wysiwyg-content ul li, .wysiwyg-content ol li {font-size: 14px; line-height: 23px;}
}
/* /WYSIWYG CONTENT */


/* HEADER */
#header {}

#header-top {padding: 8px 0; background: #0a472e;}
#header-top p {text-align: center; color: #fff;}

#header-bottom {padding: 15px 0; background: #fff;}
#hlogo-ct {float: left; width: 18%; box-sizing: border-box; padding-right: 40px;}
img#logo {max-height: 70px;}

#hnav-ct {float: left; width: 55%; box-sizing: border-box; padding-right: 40px;}
ul#hnav-list {margin-top: 23px;}
ul#hnav-list > li {float: left; margin-right: 40px;}
ul#hnav-list > li:last-child {margin-right: 0;}
ul#hnav-list > li.resp-show {display: none;}
ul#hnav-list > li > a {font-family: 'BoldFont', Arial, Verdana; color: #000; display: inline-block; cursor: pointer;}
ul#hnav-list > li > a:hover {color: #a8b324;}
ul#hnav-list > li > a.has-sub {padding-right: 18px; background: url(../images/icon/arrow-down.png) no-repeat right center; background-size: 8px auto;}
ul#hnav-list > li > a.has-sub:hover, ul#hnav-list > li > a.has-sub.active, ul#hnav-list > li > a.has-sub.active:hover {padding-right: 18px; background: url(../images/icon/arrow-down-2.png) no-repeat right center; background-size: 8px auto;}
ul#hnav-list > li > a.active, ul#hnav-list > li > a.active:hover {color: #a8b324;}
.hsubnav-container {padding: 15px 0; position: absolute; display: none; z-index: 100;}
.hsubnav-container .inner {background: #ffffff; padding: 15px 0;
border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px;
box-shadow: 0px 0px 5px #efefef; -webkit-box-shadow: 0px 0px 5px #efefef; -moz-box-shadow: 0px 0px 5px #efefef; -o-box-shadow: 0px 0px 5px #efefef;}
.hsubnav-container .inner.no-record {width: 250px; box-sizing: border-box; padding: 15px;}
.hsubnav-container .inner.no-record p {}
ul.hsubnav-list {}
ul.hsubnav-list > li {position: relative;}
ul.hsubnav-list > li > a {display: block; width: 250px; box-sizing: border-box; font-size: 14px; line-height: 24px; color: #555555; padding: 8px 20px 6px 20px; cursor: pointer;}
ul.hsubnav-list > li > a.has-sub-2 {background: url(../images/icon/arrow-right.png) no-repeat right 20px center; background-size: 5px auto;}
ul.hsubnav-list > li > a:hover {background: #f7f7f7; color: #a8b324;}
ul.hsubnav-list > li > a.has-sub-2:hover, ul.hsubnav-list > li > a.has-sub-2.active, ul.hsubnav-list > li > a.has-sub-2.active:hover {background: url(../images/icon/arrow-right-2.png) no-repeat right 20px center #f7f7f7; background-size: 5px auto;}
ul.hsubnav-list > li > a.active, ul.hsubnav-list > li > a.active:hover {font-family: 'BoldFont', Arial, Verdana; color: #a8b324; background: #f7f7f7;}
.hsubnav-2-container {position: absolute; left: 100%; top: 0; display: none;}
.hsubnav-2-container .inner {background: #ffffff; padding: 15px 0;}
ul.hsubnav-2-list {}
ul.hsubnav-2-list > li {position: relative;}
ul.hsubnav-2-list > li > a {display: block; width: 250px; box-sizing: border-box; font-size: 14px; line-height: 24px; color: #555555; padding: 8px 20px 6px 20px; cursor: pointer;}
ul.hsubnav-2-list > li > a:hover {background: #f7f7f7; color: #a8b324;}
ul.hsubnav-2-list > li > a.active, ul.hsubnav-2-list > li > a.active:hover {font-family: 'BoldFont', Arial, Verdana; color: #a8b324; background: #f7f7f7;}

#hicon-ct {float: right; box-sizing: border-box;}
ul#hicon-list {margin-top: 10px;}
ul#hicon-list > li {float: left; margin-right: 10px; position: relative;}
ul#hicon-list > li:last-child {margin-right: 0;}
ul#hicon-list > li.resp-2-show {display: none;}
ul#hicon-list > li > a {display: inline-block; width: 45px; height: 45px; cursor: pointer;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}
a#hicon-search {background: url(../images/icon/hicon-lup.png) no-repeat center #f4f4f4; background-size: 17px auto !important;}
a#hicon-search:hover {background: url(../images/icon/hicon-lup-white.png) no-repeat center #a8b324;}
a#hicon-nav {background: url(../images/icon/hicon-nav.png) no-repeat center #f4f4f4; background-size: 20px auto !important;}
a#hicon-nav:hover {background: url(../images/icon/hicon-nav-white.png) no-repeat center #a8b324;}
a#hicon-my-account {background: url(../images/icon/hicon-my-account.png) no-repeat center #e8f8f7; background-size: 17px auto !important;}
a#hicon-my-account:hover {background: url(../images/icon/hicon-my-account-white.png) no-repeat center #a8b324;}
a#hicon-my-password {background: url(../images/icon/hicon-my-password.png) no-repeat center #e8f8f7; background-size: 17px auto !important;}
a#hicon-my-password:hover {background: url(../images/icon/hicon-my-password-white.png) no-repeat center #a8b324;}
a#hicon-my-order {background: url(../images/icon/hicon-my-order.png) no-repeat center #e8f8f7; background-size: 17px auto !important;}
a#hicon-my-order:hover {background: url(../images/icon/hicon-my-order-white.png) no-repeat center #a8b324;}
a#hicon-payment-confirmation {background: url(../images/icon/hicon-payment-confirmation.png) no-repeat center #e8f8f7; background-size: auto 15px !important;}
a#hicon-payment-confirmation:hover {background: url(../images/icon/hicon-payment-confirmation-white.png) no-repeat center #a8b324;}
a#hicon-logout {background: url(../images/icon/hicon-logout.png) no-repeat center #f6f3e3; background-size: auto 16px !important;}
a#hicon-logout:hover {background: url(../images/icon/hicon-logout-white.png) no-repeat center #a8b324;}
a#hicon-cart {background: url(../images/icon/hicon-cart.png) no-repeat center #f3e4dc; background-size: 17px auto !important;}
a#hicon-cart:hover {background: url(../images/icon/hicon-cart-white.png) no-repeat center #a8b324;}
ul#hicon-list > li .cart-num {position: absolute; top: -10px; right: -10px; width: 26px; height: 26px; background: #dfb178; text-align: center; display: inline-block; color: #fff; font-family: 'BoldFont', Arial, Verdana; font-size: 11px; line-height: 26px;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}

#header-resp {display: none;}
#header-nav-resp {display: none;}

#header-nav-resp {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 2000; background: #ffffff;}
#header-nav-resp-close-btn {position: absolute; top: 40px; right: 20%; z-index: 102; width: 35px; height: 35px; cursor: pointer; background: url(../images/icon/close.png) no-repeat center; background-size: 35px 35px !important;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;
-webkit-backface-visibility: hidden;}
#header-nav-resp-close-btn:hover {background: url(../images/icon/close-hover.png) no-repeat center; }
#header-nav-resp-inner {width: 50%; margin: 0 auto; height: 100%; box-sizing: border-box; padding: 100px 0; overflow-y: scroll;}
#header-nav-resp-inner::-webkit-scrollbar {display: none;}
#header-nav-resp-search-ct {width: 100%; box-sizing: border-box; position: relative; margin-bottom: 30px;}
.search-form {position: relative;}
.search-form input[type="text"] {background: url(../images/icon/hicon-lup.png) no-repeat left 20px center #f4f4f4; background-size: 16px auto; border: none; height: 50px; padding: 10px 100px 10px 55px;
border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
.search-form input[type="text"]::-webkit-input-placeholder, .search-form input[type="text"] ::placeholder {color: #bfbfbf;}
.search-form input[type="submit"] {position: absolute; right: 30px; top: 50%; transform: translateY(-50%); background: none; border: none; color: #000000; padding: 0; font-family: 'BoldFont', Arial, Verdana;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.search-form input[type="submit"]:hover {color: #a8b324;}
img#logo-resp {display: none;}
#header-nav-resp-list-ct {width: 100%; height: 75%; box-sizing: border-box; overflow-y: scroll; display: none;}
#header-nav-resp-list-ct::-webkit-scrollbar {display: none;}
ul#header-nav-resp-list > li {padding: 10px 0; border-bottom: 1px solid #e1e1e1;}
ul#header-nav-resp-list > li a {display: inline-block; color: #555555; cursor: pointer; font-size: 14px;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul#header-nav-resp-list > li a:hover {color: #a8b324; text-decoration: none;}
ul#header-nav-resp-list > li a.active, ul#header-nav-resp-list > li a.active:hover {font-family: 'TitleBoldFont' !important; color: #a8b324;}
ul#header-nav-resp-list > li a.has-sub, ul#header-nav-resp-list > li a.has-sub-sub {padding-right: 20px; background: url(../images/icon/arrow-down.png) no-repeat right top 10px; background-size: 8px auto;}
ul#header-nav-resp-list > li a.has-sub.opened, ul#header-nav-resp-list > li a.has-sub-sub.opened {background: url(../images/icon/arrow-up.png) no-repeat right top 10px; background-size: 8px auto;}
.header-subnav-resp-ct, .header-sub-subnav-resp-ct {padding-left: 30px; padding-right: 30px; display: none;}


@media only screen and (max-width: 1024px) {
	#hlogo-ct {width: 23%;}
	#hnav-ct {width: 62%;}
	ul#hnav-list > li.resp-hide {display: none;}
	ul#hnav-list > li.resp-show {display: block;}
	
	ul#hicon-list > li.resp-hid {display: none;}
	
	ul.hsubnav-list > li > a, ul.hsubnav-2-list > li > a {width: 225px;}
	
	#header-nav-resp-inner {width: 70%;}
	#header-nav-resp-close-btn {right: 15%;}
}

@media only screen and (max-width: 768px) {
	#header {position: fixed; top: 0; z-index: 2000;}
	#header-top {display: none;}
	img#logo {height: 50px;}
	#header-bottom  {padding: 10px 0;
	box-shadow: 0px 0px 5px #dfdfdf; -webkit-box-shadow: 0px 0px 5px #dfdfdf; -moz-box-shadow: 0px 0px 5px #dfdfdf; -o-box-shadow: 0px 0px 5px #dfdfdf;}
	#hlogo-ct {width: 50%;}
	#hnav-ct {display: none;}
	ul#hicon-list {margin-top: 5px;}
	ul#hicon-list > li, ul#hicon-list > li:last-child {margin-right: 7px;}
	ul#hicon-list > li > a {width: 40px; height: 40px;}
	
	#header-nav-resp-inner {padding: 60px 0;}
	#header-nav-resp-close-btn {top: 30px; right: 30px;}
	img#logo-resp {display: block; height: 60px; margin: 0 auto; margin-bottom: 20px;}
	#header-nav-resp-list-ct {display: block;}
	
	ul#hicon-list > li.resp-2-hid {display: none;}
	ul#hicon-list > li.resp-2-show {display: block;}
	
	#mt-top-resp {height: 70px;}
}

@media only screen and (max-width: 500px) {
	#header-top p {font-size: 13px;}
	
	#header-nav-resp-inner {width: 90%;}
	#header-nav-resp-close-btn {top: 20px; right: 5%; width: 30px; height: 30px; background-size: 30px 30px !important;}
}
/* /HEADER */


/* HOME */
#content {min-height: 450px;}

#home-slideshow-sfw {margin-bottom: 80px;}
#home-slideshow-sfw .slick-dots {bottom: 40px;}
#home-slideshow-sfw .slick-dots li {width: 20px; height: 20px;}
#home-slideshow-sfw .slick-dots li:last-child {margin-bottom: 0;}
#home-slideshow-sfw .slick-dots li button { width: 20px; height: 20px; background: url(../images/icon/bullet.png) no-repeat center; background-size: 20px auto;
transition: background 0.2s linear; -webkit-transition: background 0.2s linear; -moz-transition: background 0.2s linear; -o-transition: background 0.2s linear;}
#home-slideshow-sfw .slick-dots li button::before {content: "";}
#home-slideshow-sfw .slick-dots li.slick-active button {background: url(../images/icon/bullet-active.png) no-repeat center; background-size: 20px auto;}
.slideshow-item {}
.slideshow-item img.featured {display: block; width: 100%;}
.slideshow-item img.thumb {display: none;}

#home-new-product-sfw {margin-bottom: 60px;}
h2.section-title {font-family: 'BoldFont', Arial, Verdana; color: #0a472e; margin-bottom: 50px;}
h2.section-title.type-2 {font-size: 30px; line-height: 38px; margin-bottom: 20px;}
.product-item {}
.product-item .img-wrap {position: relative; box-sizing: border-box;}
.product-item .img-wrap.st-height {height: 320px;}

@media only screen and (min-width: 1601px) {
	.product-item .img-wrap.st-height {height: 400px;}
}

.product-item .img-wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 85%; max-height: 85%;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.product-item .img-wrap img:hover {
transform: translate(-50%, -50%) scale(1.1); -webkit-transform: translate(-50%, -50%) scale(1.1); -moz-transform: translate(-50%, -50%) scale(1.1); -o-transform: translate(-50%, -50%) scale(1.1);}
.oos-cover {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background: rgba(255, 255, 255, 0.7);}
.prd-ribbon-ct {position: absolute; z-index: 50;}
.prd-ribbon-ct.tleft {top: 12px; left: 12px;}
.prd-ribbon-ct.tright {top: 12px; right: 12px;}
.prd-ribbon-ct span {display: block; font-size: 10px; line-height: 10px; color: #fff; padding: 7px 10px; margin-bottom: 5px; min-width: 50px; text-align: center;
border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
.prd-ribbon-ct span:last-child {margin-bottom: 0;}
.prd-ribbon-ct span.oos {background: #999999;}
.prd-ribbon-ct span.new {background: #84ccc8;}
.prd-ribbon-ct span.sale {background: #e55757;}
.product-item .desc-wrap {text-align: center; padding: 15px;}
.product-item .desc-wrap h3, .product-item .desc-wrap h3 a {font-family: 'GeneralFont', Arial, Verdana; color: #555555; font-size: 14px; line-height: 20px; margin-bottom: 5px;}
.product-item .desc-wrap h3 a:hover {color: #80891b;}
.product-item .desc-wrap p.price {font-family: 'BoldFont', Arial, Verdana; color: #a8b324; font-size: 16px; line-height: 26px;}
.product-item .desc-wrap p.price span {display: inline-block; font-family: 'GeneralFont', Arial, Verdana; color: #999999; font-size: 12px; margin-right: 10px; text-decoration: line-through;}
.product-item .desc-wrap a.add-to-cart {display: inline-block; margin-top: 15px; padding-top: 15px; font-family: 'BoldFont', Arial, Verdana; color: #000000; font-size: 13px; line-height: 18px; cursor: pointer; background: url(../images/bg/line.png) no-repeat top center; background-size: 50% 1px;}
.product-item .desc-wrap a.add-to-cart:hover, .product-item .desc-wrap a.add-to-cart:hover:focus {color: #a8b324; background-size: 100% 1px; border: 0;}

.product-slick-list {padding-bottom: 60px;}
/* .product-slick-list .slick-prev, .product-slick-list .slick-next {width: 45px; height: 45px; z-index: 1000;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.product-slick-list .slick-prev:before, .product-slick-list .slick-next:before {content: "";}
.product-slick-list .slick-prev, .product-slick-list .slick-prev:focus {background: url(../images/icon/button-left.png) no-repeat center ; background-size: 45px 45px; top: 35%; left: -25px; transform: translateY(-35%);}
.product-slick-list .slick-prev:hover {background: url(../images/icon/button-left-2.png) no-repeat center ; background-size: 45px 45px;}
.product-slick-list .slick-next, .product-slick-list .slick-next:focus {background: url(../images/icon/button-right.png) no-repeat center ; background-size: 45px 45px; top: 35%; right: -25px; transform: translateY(-35%);}
.product-slick-list .slick-next:hover {background: url(../images/icon/button-right-2.png) no-repeat center ; background-size: 45px 45px;} */
.product-slick-list .slick-dots {bottom: 0;}
.product-slick-list .slick-dots li {width: 20px; height: 20px;}
.product-slick-list .slick-dots li:last-child {margin-bottom: 0;}
.product-slick-list .slick-dots li button { width: 20px; height: 20px; background: url(../images/icon/bullet-2.png) no-repeat center; background-size: 20px auto;
transition: background 0.2s linear; -webkit-transition: background 0.2s linear; -moz-transition: background 0.2s linear; -o-transition: background 0.2s linear;}
.product-slick-list .slick-dots li button::before {content: "";}
.product-slick-list .slick-dots li.slick-active button {background: url(../images/icon/bullet-2-active.png) no-repeat center; background-size: 20px auto;}

#home-banner-top-sfw {margin-bottom: 80px;}

#home-sale-product-sfw {margin-bottom: 60px;}

#home-banner-bottom-sfw {margin-bottom: 80px;}

@media only screen and (max-width: 768px) {	
	h2.section-title  {margin-bottom: 30px;}
	h2.section-title.type-2 {font-size: 26px; line-height: 34px; margin-bottom: 20px;}
	
	#home-slideshow-sfw {margin-bottom: 60px;}
	.slideshow-item img.featured {display: none;}
	.slideshow-item img.thumb {display: block; width: 100%;}
	#home-slideshow-sfw .slick-dots {bottom: 30px;}
	
	#home-new-product-sfw {margin-bottom: 40px;}
	.product-item .img-wrap.st-height {height: 350px;}
	
	#home-banner-top-sfw {margin-bottom: 60px;}
	
	#home-sale-product-sfw {margin-bottom: 40px;}
	
	#home-banner-bottom-sfw {margin-bottom: 60px;}
}

@media only screen and (max-width: 500px) {
	h2.section-title.type-2 {font-size: 24px; line-height: 32px; margin-bottom: 20px;}
	
	#home-slideshow-sfw {margin-bottom: 40px;}
	#home-slideshow-sfw .slick-dots {bottom: 20px;}
	#home-slideshow-sfw .slick-dots li {width: 16px; height: 16px; margin: 0 3px;}
	#home-slideshow-sfw .slick-dots li button {width: 16px; height: 16px;}
	#home-slideshow-sfw .slick-dots li button, #home-slideshow-sfw .slick-dots li.slick-active button {background-size: 16px auto;}
	
	#home-new-product-sfw {margin-bottom: 20px;}
	.product-item .img-wrap img {max-width: 95%; max-height: 95%;}
	.product-item .img-wrap.st-height {height: 200px;}	
	.product-slick-list .slick-dots li {width: 16px; height: 16px; margin: 0 3px;}
	.product-slick-list .slick-dots li button {width: 16px; height: 16px;}
	.product-slick-list .slick-dots li button, .product-slick-list .slick-dots li.slick-active button {background-size: 16px auto;}
	.product-item .desc-wrap p.price {text-align: center;}
	.product-item .desc-wrap p.price span {display: block; margin-right: 0; margin-bottom: -7px;}
	
	#home-banner-top-sfw {margin-bottom: 40px;}
	
	#home-sale-product-sfw {margin-bottom: 20px;}
	
	#home-banner-bottom-sfw {margin-bottom: 40px;}
}
/* /HOME */


/* ABOUT */
#page-top-sfw {margin-bottom: 80px;}
#page-top-sfw img.main-bg-img {width: 100%; height: 100%; object-fit: cover;}
#page-top-caption-ct {position: absolute; top: 50%; left: 2.5%; transform: translateY(-50%); width: 60%;}
#page-top-caption-ct h2 {color: #0a472e; font-family: 'BoldFont', Arial, Verdana; font-size: 50px; line-height: 58px; margin-bottom: 10px;}

ul.breadcrumb-list {}
ul.breadcrumb-list > li {float: left; margin-right: 15px;}
ul.breadcrumb-list > li:last-child {margin-right: 0;}
ul.breadcrumb-list > li > a {font-size: 14px; line-height: 24px; color: #999999;}
ul.breadcrumb-list > li > a:hover {color: #a8b324;}
ul.breadcrumb-list > li > a.sep, ul.breadcrumb-list a.sep:hover {color: #999999;}
ul.breadcrumb-list > li > a.active, ul.breadcrumb-list > li > a.active:hover {color: #000000; font-family: 'BoldFont', Arial, Verdana;}

#about-content-sfw {margin-bottom: 80px;}
ul#about-content-list {}
ul#about-content-list > li {padding-bottom: 60px; margin-bottom: 60px; border-bottom: 1px dashed #e1e1e1;}
ul#about-content-list > li:last-child {padding-bottom: 0; margin-bottom: 0; border-bottom: none;}
ul#about-content-list > li .img-wrap {float: left; width: 47.5%; box-sizing: border-box;}
ul#about-content-list > li .img-wrap img {
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}
ul#about-content-list > li .desc-wrap  {float: right; width: 47.5%; box-sizing: border-box; padding: 0px 40px;}
ul#about-content-list > li .desc-wrap.full-width {float: none; width: 100%; padding: 0;}
ul#about-content-list > li .desc-wrap h3.abp-title {font-size: 30px; line-height: 38px; color: #0a472e; font-family: 'BoldFont', Arial, Verdana; margin-bottom: 20px;}
ul#about-content-list > li:nth-child(even) .img-wrap {float: right;}
ul#about-content-list > li:nth-child(even) .desc-wrap {float: left;}

@media only screen and (min-width: 1601px) {
	#page-top-sfw {height: 450px;}
}

@media only screen and (max-width: 1600px) {
	#page-top-sfw {height: 400px;}
}

@media only screen and (max-width: 1400px) {
	#page-top-sfw {height: 350px;}
}

@media only screen and (max-width: 1024px) {
	#page-top-sfw {height: 300px;}
	#page-top-caption-ct {width: 70%;}
	#page-top-caption-ct h2 {font-size: 40px; line-height: 48px;}
	
	ul#about-content-list > li .desc-wrap {padding: 0;}
}

@media only screen and (max-width: 768px) {
	#page-top-sfw {height: 250px; margin-bottom: 60px;}
	#page-top-caption-ct h2 {font-size: 30px; line-height: 38px; margin-bottom: 5px;}
	
	#about-content-sfw {margin-bottom: 60px;}
	ul#about-content-list > li {padding-bottom: 40px; margin-bottom: 40px;}
	ul#about-content-list > li .img-wrap, ul#about-content-list > li .desc-wrap {float: none; width: 100%; padding: 0; margin: 0;}
	ul#about-content-list > li .img-wrap {margin-bottom: 30px;}
}

@media only screen and (max-width: 500px) {
	#page-top-sfw {margin-bottom: 40px;}
	#page-top-caption-ct h2 {font-size: 24px; line-height: 32px; margin-bottom: 5px;}
	ul.breadcrumb-list > li {margin-right: 10px;}
	ul.breadcrumb-list > li:last-child {margin-right: 0;}
	ul.breadcrumb-list > li > a {font-size: 13px; line-height: 21px;}
	
	#about-content-sfw {margin-bottom: 40px;}
}

@media only screen and (max-width: 360px) {
	#page-top-sfw {height: 200px;}
}
/* /ABOUT */


/* STATIC PAGES */
#pages-content-sfw {margin-bottom: 80px;}

@media only screen and (max-width: 768px) {
	#pages-content-sfw {margin-bottom: 60px;}
}

@media only screen and (max-width: 500px) {
	#pages-content-sfw {margin-bottom: 40px;}
}
/* /STATIC PAGES */


/* FAQ */
#faq-content-sfw {margin-bottom: 80px;}

ul#faq-list {}
ul#faq-list > li {padding: 20px 0; border-top: 1px solid #e6e6e6;}
ul#faq-list > li:last-child {border-bottom: 1px solid #e6e6e6;}
ul#faq-list > li .question {padding-left: 45px; background: url(../images/icon/plus.png) no-repeat left top; background-size: 22px auto;}
ul#faq-list > li .question.opened {background: url(../images/icon/minus-2.png) no-repeat left top; background-size: 22px auto;}
ul#faq-list > li .question h3 {font-family: 'GeneralFont', Arial, Verdana; font-size: 16px; line-height: 25px; cursor: pointer; margin-bottom: 0; color: #000000;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul#faq-list > li .question h3:hover {color: #a8b324;}
ul#faq-list > li .question.opened h3, ul#faq-list > li .question.opened h3:hover {font-family: 'BoldFont', Arial, Verdana;}
ul#faq-list > li .answer {margin-top: 20px; display: none; padding-left: 45px;}

@media only screen and (max-width: 768px) {
	#faq-content-sfw {margin-bottom: 60px;}
}

@media only screen and (max-width: 500px) {
	#faq-content-sfw {margin-bottom: 40px;}
}

@media only screen and (max-width: 360px) {
	ul#faq-list > li .question {padding-left: 35px; background-position: left top 3px; background-size: 17px auto;}
	ul#faq-list > li .question.opened {background-position: left top 3px; background-size: 17px auto;}
	ul#faq-list > li .answer {padding-left: 35px;}
}
/* /FAQ */


/* CONTACT */
#contact-top-sfw {margin-bottom: 80px;}

#contact-img-ct {float: left; width: 35%;}

#contact-form-ct {float: right; width: 60%;}
#contact-form-ct.full-width {float: none; width: 100%;}
#contact-detail-ct {margin-bottom: 40px; border-bottom: 1px solid #e1e1e1;}
.contact-detail-item {float: left; width: 45%; margin-right: 10%; margin-bottom: 40px;}
#contact-detail-ct .contact-detail-item:nth-child(2n) {margin-right: 0;}
#contact-detail-ct .contact-detail-item:nth-child(2n + 1) {clear: both;}
.cdi-item {margin-bottom: 40px;}
.contact-detail-item .cdi-item:last-child {margin-bottom: 0;}
.cdi-item h3 {font-size: 14px; line-height: 22px; margin-bottom: 10px; font-family: 'BoldFont', Arial, Verdana; color: #000000;}
.cdi-item p, .cdi-item  p a {color: #555555;}
.cdi-item p a:hover {color: #a8b324; text-decoration: underline;}

#contact-form {margin-top: 30px;}
.gen-form-row {float: left; width: 100%; position: relative; margin-bottom: 20px;}
.gen-form-row.half {width: 49%; margin-right: 2%;}
.gen-form-row.half.no-mr {margin-right: 0;}
#contact-form textarea {height: 155px;}
#contact-form input[type="submit"] {min-width: 175px;}

#contact-gmap-sfw {margin-bottom: 80px;}
#contact-gmap-sfw iframe {width: 100% !important; height: 500px !important;}

@media only screen and (max-width: 1024px) {
	#contact-form .gen-form-row.half {width: 100%; margin-right: 0;}
	#contact-form-ct.full-width .gen-form-row.half {width: 49%; margin-right: 2%;}
	#contact-form-ct.full-width .gen-form-row.half.no-mr {margin-right: 0;}
}

@media only screen and (max-width: 768px) {
	#contact-top-sfw {margin-bottom: 60px;}
	#contact-img-ct {display: none;}
	#contact-form-ct {float: none; width: 100%;}
	#contact-form .gen-form-row.half {width: 49%; margin-right: 2%;}
	#contact-form .gen-form-row.half.no-mr {margin-right: 0;}
	
	#contact-gmap-sfw {margin-bottom: 60px;}
	#contact-gmap-sfw iframe {height: 425px !important;}
}

@media only screen and (max-width: 500px) {
	#contact-top-sfw {margin-bottom: 40px;}
	.contact-detail-item {float: none; width: 100%; margin: 0; margin-bottom: 40px;}
	.cdi-item h3 {margin-bottom: 0;}
	#contact-form .gen-form-row.half, #contact-form-ct.full-width .gen-form-row.half {width: 100%; margin-right: 0;}
	
	#contact-gmap-sfw {margin-bottom: 40px;}
	#contact-gmap-sfw iframe {height: 350px !important;}
}
/* /CONTACT */


/* PRODUCT */
#product-content-sfw {margin-bottom: 80px;}

#product-sidebar-ct {float: left; width: 23%;}
.sidebar-section-ct {margin-bottom: 50px;}
#product-sidebar-ct .sidebar-section-ct:last-child {margin-bottom: 0;}
.sidebar-section-ct h3 {font-family: 'BoldFont', Arial, Verdana; color: #0a472e; font-size: 20px; line-height: 28px; padding-bottom: 10px; margin-bottom: 20px; border-bottom: 1px dashed #e1e1e1;}
ul.sidebar-nav-list {}
ul.sidebar-nav-list  li {margin-bottom: 5px;}
ul.sidebar-nav-list  li:last-child {margin-bottom: 0;}
ul.sidebar-nav-list  li a {cursor: pointer; font-size: 14px; line-height: 20px; color: #555555; display: inline-block; padding-left: 20px; background: url(../images/icon/tri-right.png) no-repeat left top 3px; background-size: 7px auto;}
ul.sidebar-nav-list  li a:hover {color: #a8b324;}
ul.sidebar-nav-list  li a.active, ul.sidebar-nav-list  li a.active:hover {font-family: 'BoldFont', Arial, Verdana; color: #a8b324;}
.sidebar-subnav-container {margin-top: 5px; padding-left: 30px; display: none;}
.sidebar-subnav-container.opened {display: block;}

#product-list-ct {float: right; width: 75%;}
#product-list-header-ct {padding-bottom: 10px; margin-bottom: 15px; border-bottom: 1px solid #e1e1e1;}
#product-list-header-ct p {line-height: 28px;}
#prdlist-info-ct {float: left; width: 45%;}
#prdlist-filter-ct {float: right;}
#prdlist-filter-ct .styled-select-wrapper {width: 300px; margin-top: -15px; height: 40px;}
#prdlist-filter-ct .styled-select-wrapper select {height: 40px;}
ul.gen-product-list {}
ul.gen-product-list > li {float: left; width: 32%; margin-right: 2%; margin-bottom: 50px;}
ul.gen-product-list > li:nth-child(3n) {margin-right: 0;}
ul.gen-product-list > li:nth-child(3n + 1) {clear: both;}

#page-top-breadcrumb-sfw {padding: 25px 0; background: #f8eee3; margin-bottom: 60px;}

#prdet-img-ct {float: left; width: 53%;}
#prdet-img-list-ct {float: left; width: 16%;}
ul#prdet-img-list {}
ul#prdet-img-list > li {margin-bottom: 10px;}
ul#prdet-img-list > li:last-child {margin-bottom: 0;}
ul#prdet-img-list > li .img-wrap {width: 100%; position: relative; border: 1px solid #e1e1e1; cursor: pointer; opacity: 0.75; -webkit-backface-visibility: hidden;
border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul#prdet-img-list > li .img-wrap:hover {opacity: 1.0;}
ul#prdet-img-list > li .img-wrap.active, ul#prdet-img-list > li .img-wrap.active:hover {opacity: 1.0; border: 1px solid #a8b324;}
ul#prdet-img-list > li .img-wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 90%; max-height: 90%;}
#prdet-cur-img-ct {float: right; width: 80%;}
#prdet-cur-img-ct .img-wrap {width: 100%; position: relative; border: 1px solid #e1e1e1;
border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px;}
#prdet-cur-img-ct .img-wrap img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 90%; max-height: 90%;}

#prdet-detail-ct {float: right; width: 43%;}
#prdet-detail-ct h2.section-title {margin-bottom: 10px;}
p.prdet-ribbon {display: inline-block; font-size: 10px; line-height: 15px; padding: 7px 15px; margin-bottom: 20px;}
p.prdet-ribbon.oos {background: #999999; color: #ffffff;}
p.prdet-ribbon.ins {background: #defaf2; color: #0a472e;}
p.prdet-price {font-family: 'BoldFont', Arial, Verdana; font-size: 24px; line-height: 32px; color: #a8b324; margin-bottom: 30px;}
p.prdet-price span {font-family: 'GeneralFont', Arial, Verdana; font-size: 14px; display: inline-block; margin-right: 10px; text-decoration: line-through; color: #999999;}
#prdet-description-ct {margin-bottom: 30px;}
#prdet-form-ct input[type="number"] {width: 100px; height: 50px; text-align: center;
border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
#prdet-form-ct a.btn {margin-left: 15px; height: 50px; font-size: 13px; line-height: 50px; min-width: 175px; text-align: center; position: absolute;}
#prdet-additional-ct {margin-top: 30px; padding-top: 30px; border-top: 1px solid #e1e1e1;}

#product-related-sfw {margin-bottom: 80px;}
#product-related-sfw .wrap {padding-top: 80px; border-top: 1px dashed #e1e1e1;}

@media only screen and (max-width: 1024px) {
	#product-sidebar-ct {width: 27%;}
	#product-list-ct {width: 71%;}	
	
	#prdlist-info-ct {width: 50%;}
	#prdlist-filter-ct .styled-select-wrapper {width: 250px;}
	ul.gen-product-list > li {width: 48.5%; margin-right: 3%;}
	ul.gen-product-list > li:nth-child(3n) {margin-right: 3%;}
	ul.gen-product-list > li:nth-child(3n + 1) {clear: none;}
	ul.gen-product-list > li:nth-child(2n) {margin-right: 0;}
	ul.gen-product-list > li:nth-child(2n + 1) {clear: both;}
	
	#prdet-form-ct a.btn {min-width: 150px;}
}

@media only screen and (max-width: 768px) {
	#product-content-sfw {margin-bottom: 60px;}
	#product-sidebar-ct {display: none;}
	#product-list-ct {float: none; width: 100%;}
	ul.gen-product-list > li {width: 32%; margin-right: 2%;}
	ul.gen-product-list > li:nth-child(2n) {margin-right: 2%;}
	ul.gen-product-list > li:nth-child(2n + 1) {clear: none;}
	ul.gen-product-list > li:nth-child(3n) {margin-right: 0;}
	ul.gen-product-list > li:nth-child(3n + 1) {clear: both;}
	
	#prdet-img-ct, #prdet-detail-ct {float: none; width: 100%; padding: 0; margin: 0;}
	#prdet-img-ct {margin-bottom: 30px;}
	#prdet-cur-img-ct {float: left;}
	#prdet-img-list-ct {float: right;}
	
	#product-related-sfw {margin-bottom: 60px;}
}

@media only screen and (max-width: 600px) {
	#prdlist-info-ct {display: none;}
}

@media only screen and (max-width: 500px) {
	#product-content-sfw {margin-bottom: 40px;}
	ul.gen-product-list > li {width: 49%; margin-right: 2%;}
	ul.gen-product-list > li:nth-child(3n) {margin-right: 2%;}
	ul.gen-product-list > li:nth-child(3n + 1) {clear: none;}
	ul.gen-product-list > li:nth-child(2n) {margin-right: 0;}
	ul.gen-product-list > li:nth-child(2n + 1) {clear: both;}
	
	#product-related-sfw {margin-bottom: 40px;}
	
	#page-top-breadcrumb-sfw {margin-bottom: 40px;}
}
/* /PRODUCT */


/* SIGN UP & SIGN IN */
#gen-popup-bg-ct {position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.75); width: 100%; height: 100%; z-index: 2500; display: none;}

.popup-ct {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); box-sizing: border-box; width: 800px; height: 550px; overflow-y: scroll; overflow-x: visible; background: #ffffff; display: none;}
.popup-ct::-webkit-scrollbar {display: none;}
.popup-ct h2 {font-size: 30px; line-height: 36px; color: #0a472e;}
.popup-form {margin-top: 20px;}
.popup-form .gen-form-row {margin-bottom: 15px;}
.popup-form input[type="text"], .popup-form input[type="email"], .popup-form input[type="password"] {height: 50px;}
.popup-form ::-webkit-input-placeholder, .popup-form ::placeholder {color: #bfbfbf;}
.popup-form input[type="submit"] {height: 50px; min-width: 150px; padding: 15px 30px;}
.popup-img-ct {float: left; width: 40%; height: 100%; box-sizing: border-box; position: relative;}
.popup-img-ct img {width: 100%; height: 100%; object-fit: cover; object-position: top;}
.popup-form-ct {float: right; width: 60%; height: 100%; box-sizing: border-box; padding: 40px 50px; position: relative;}
.popup-close-btn {width: 30px; height: 30px; position: absolute; top: 15px; right: 15px; background: url(../images/icon/close.png) no-repeat center; background-size: 30px 30px !important; cursor: pointer;
transition: opacity 0.2s linear; -webkit-transition: opacity 0.2s linear; -moz-transition: opacity 0.2s linear; -o-transition: opacity 0.2s linear;
-webkit-backface-visibility: hidden;}
.popup-close-btn:hover {background: url(../images/icon/close-hover.png) no-repeat center;}
.popup-caption-ct {position: absolute; bottom: 30px; left: 0; width: 100%; text-align: center; box-sizing: border-box; padding: 0 50px;}
.popup-caption-ct p a  {cursor: pointer;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
.popup-caption-ct p a:hover {color: #a8b324; text-decoration: none;}
.form-note {color: #555555; font-size: 16px; line-height: 16px; font-family: 'BoldFont', Arial, Verdana;}
a.form-note {cursor: pointer;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
a.form-note:hover {color: #a8b324;}

@media only screen and (max-width: 1024px) {
	.popup-ct {width: 600px;}
	.popup-img-ct {display: none;}
	.popup-form-ct {float: none; width: 100%;}
}

@media only screen and (max-width: 768px) {	
	.popup-ct {width: 95%;}
}

@media only screen and (max-width: 500px) {
	.popup-caption-ct {padding: 0 30px;}
	.popup-ct h2 {font-size: 26px; line-height: 32px;}
	.popup-caption-ct p, .popup-caption-ct p a  {font-size: 13px; line-height: 18px;}
}

@media only screen and (max-width: 360px) {
	.popup-form-ct {padding: 50px 30px;}
}
/* /SIGN UP & SIGN IN */


/* SHOPPING CART */
#shcart-content-sfw {margin-bottom: 80px;}

#shcart-step-1-sfw {margin-bottom: 50px;}
h3.with-icon {font-family: 'BoldFont'; font-size: 18px; line-height: 24px; color: #555555;}
h3#protect-icon {padding-left: 40px; background: url(../images/icon/protect.png) no-repeat left center; background-size: 25px auto;}
.shcart-bg-ct {border: 1px solid #e1e1e1; box-sizing: border-box; padding: 30px; position: relative;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}
.shcart-bg-ct .inner-pd {padding-right: 60px;}
.shcart-bg-ct h4 {font-family: 'BoldFont'; font-size: 18px; line-height: 24px; color: #0a472e; margin-bottom: 10px;}
.shcart-bg-ct a.float-href {display: inline-block; position: absolute; top: 30px; right: 30px; color: #a8b324; font-family: 'BoldFont';}
.shcart-bg-ct a.float-href:hover {text-decoration: underline;}
table.shcart-table {width: 100%;}
table.shcart-table tr td {vertical-align: middle; padding: 10px 15px; font-size: 14px; line-height: 20px; color: #555555; font-family: 'GeneralFont'; position: relative; z-index: 50; border: 0;}
table.shcart-table tr td:first-child, table.shcart-table tr td:last-child {padding-left: 0; padding-right: 0; border: 0;}
table.shcart-table tr td span.cl-caption {display: block; margin-top: 5px; color: #a8b324; font-size: 13px; line-height: 18px;}
table.shcart-table tr.thead td, table.shcart-table tr.tfoot td {font-family: 'BoldFont'; font-size: 14px; line-height: 20px; color: #0a472e; border-bottom: 1px solid #e1e1e1; padding-top: 0;}
table.shcart-table tr.thead td b, table.shcart-table tr.tfoot td b {font-family: 'BoldFont';}
table.shcart-table tr.tfoot td {padding-top: 10px; border-bottom: none; border-top: 1px solid #e1e1e1;}
table.shcart-table tr.tfoot.no-brd td {border-top: none;}
table.shcart-table tr td img.prd-img {
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px;}
table.shcart-table tr td .qty-float {position: absolute; top: 5px; right: -8px; width: 26px; height: 26px; text-align: center; font-family: 'BoldFont'; color: #fff; font-size: 11px; line-height: 26px; background: #dfb178;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}
table.shcart-table tr td .remove {position: absolute; top: 5px; right: -10px; width: 20px; height: 20px; background: url(../images/icon/remove.png) no-repeat center; background-size: 20px auto; cursor: pointer; z-index: 51;}
table.shcart-table tr td .minus {display: inline-block; margin-right: 5px; width: 16px; height: 16px; background: url(../images/icon/minus-2.png) no-repeat center; background-size: 16px auto; cursor: pointer;}
table.shcart-table tr td .plus {display: inline-block; margin-left: 5px; width: 16px; height: 16px; background: url(../images/icon/plus-2.png) no-repeat center; background-size: 16px auto; cursor: pointer;}
table.shcart-table tr td .qty-input {border: none; width: 50px; text-align: center; border-bottom: 1px solid #e1e1e1; height: 50px;}
#shcart-step-1-table tr td span.prd-code {display: none;}
#shcart-step-1-table-resp {display: none;}

#shcart-table-content {}
#shcart-table-header {padding-bottom: 10px; border-bottom: 1px solid #e1e1e1;}
#shcart-table-footer {margin-top: 20px; padding-top: 10px; border-top: 1px solid #e1e1e1;}
.shtable-col {float: left; font-size: 14px; line-height: 19px; color: #555555; font-family: 'GeneralFont'; box-sizing: border-box; position: relative;}
#shcart-table-header .shtable-col, #shcart-table-footer .shtable-col {font-family: 'BoldFont'; color: #0a472e;}
.shtable-col.prd-img-col {width: 7%; margin-right: 3%;}
.shtable-col.prd-name-col {width: 36%; margin-right: 3%;}
#shcart-table-header .shtable-col.prd-name-col span, #shcart-table-footer .shtable-col.prd-name-col span {display: none;}
.shtable-col.prd-name-col .prd-code {display: none;}
.shtable-col.prd-code-col {text-align: center; width: 14%; margin-right: 3%;}
.shtable-col.prd-qty-col {text-align: center; width: 15%; margin-right: 3%;}
.shtable-col.prd-subtotal-col {text-align: right; width: 16%;}
ul#shcart-content-list {}
ul#shcart-content-list > li {float: left; width: 100%; position: relative; margin-top: 15px; display: flex; align-items: center;}
.shtable-col .remove {position: absolute; top: -5px; right: -10px; width: 20px; height: 20px; background: url(../images/icon/remove.png) no-repeat center; background-size: 20px auto; cursor: pointer; z-index: 51;}
.shtable-col .remove-resp {display: none;}
.shtable-col .minus {display: inline-block; margin-right: 5px; width: 16px; height: 16px; background: url(../images/icon/minus-2.png) no-repeat center; background-size: 16px auto; cursor: pointer;}
.shtable-col .plus {display: inline-block; margin-left: 5px; width: 16px; height: 16px; background: url(../images/icon/plus-2.png) no-repeat center; background-size: 16px auto; cursor: pointer;}
.shtable-col .qty-input {border: none; width: 70px; text-align: center; border: 1px solid #e1e1e1; height: 40px; text-align: center; font-size: 14px;
border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
.shtable-col .qty-input:hover, .shtable-col .qty-input:focus {background: #fcfcfc;}

#shcart-step-3-sfw {margin-bottom: 50px;}
#shcart-step-3-billing-ct {float: left; width: 48.5%;}
#shcart-step-3-cart-ct {float: right; width: 48.5%;}
.shcart-form label.form-label {display: block; margin-bottom: 5px; font-size: 14px; line-height: 24px; color: #555555;}
.shcart-form input[type="text"], .shcart-form input[type="email"], .shcart-form textarea {border: 1px solid #e1e1e1; color: #555555;}
.shcart-form textarea {height: 140px;}
.shcart-form .styled-select-wrapper {border: 1px solid #e1e1e1;}
.shcart-form .styled-select-wrapper select {color: #555555;}
p.small-note {font-size: 15px; line-height: 25px;}

#shcart-step-4-sfw {margin-bottom: 50px;}
#shcart-step-4-summary-ct {float: left; width: 48.5%;}
#shcart-step-4-cart-ct {float: right; width: 48.5%;}
#shcart-step-4-sfw .styled-radio-wrapper label {margin-bottom: 10px; font-family: 'MediumFont';}

#shcart-step-5-sfw {margin-bottom: 50px;}
#shcart-step-5-sfw .wrap {width: 80%;}
#shcart-step-5-sfw .shcart-bg-ct {padding: 50px;}

#shcart-prev-next-sfw {}
#shcart-prev-step {float: left;}
#shcart-next-step {float: right;}
#shcart-prev-next-sfw a.gen-btn, #shcart-prev-next-sfw input[type="submit"] {display: inline-block; background: #a8b324; font-size: 15px; height: 50px; line-height: 50px; padding: 0px 30px; min-width: 150px; text-align: center; font-family: 'BoldFont'; color: #fff; cursor: pointer; box-sizing: border-box;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;
border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
#shcart-prev-next-sfw a.gen-btn:hover, #shcart-prev-next-sfw input[type="submit"]:hover {background: #879018;}

@media only screen and (max-width: 1024px) {	
	ul#shcart-step-list > li {width: 25%;}
	ul#shcart-step-list > li:first-child, ul#shcart-step-list > li:last-child {display: none;}
	
	#shcart-step-1-table td:nth-child(3) {display: none;}
	#shcart-step-1-table tr td span.prd-code {display: block; margin-top: 5px;}
	table.shcart-table tr td, table.shcart-table tr.thead td, table.shcart-table tr.tfoot td, table.shcart-table tr td .qty-input {font-size: 13px; line-height: 18px;}
	
	.shcart-form label.form-label {font-size: 15px;}
	.shtable-col {font-size: 13px; line-height: 18px;}
	
	#order-step-4-form .gen-form-row {margin-bottom: 0;}
	#order-step-4-form .gfr-half, #order-step-4-form .gfr-full {width: 100%; margin: 0; margin-bottom: 30px;}
	.shcart-form input[type="text"], .shcart-form input[type="email"], .shcart-form input[type="password"], .shcart-form textarea, .shcart-form .styled-select-wrapper select {font-size: 14px;}
}
@media only screen and (max-width: 768px) {	
	#shcart-content-sfw {margin-bottom: 60px;}
	
	#shcart-step-sfw {display: none;}
	table.shcart-table tr td .minus, table.shcart-table tr td .plus {display: none;}
	table.shcart-table tr td, table.shcart-table tr.thead td, table.shcart-table tr.tfoot td, table.shcart-table tr td .qty-input {font-size: 14px; line-height: 20px;}
	
	.shtable-col.prd-img-col {width: 12%; margin-right: 3%;}
	.shtable-col.prd-name-col {width: 40%; margin-right: 3%;}
	.shtable-col.prd-name-col .prd-code {display: block; margin-top: 5px;}
	.shtable-col.prd-code-col {display: none;}
	.shtable-col.prd-qty-col {width: 17%; margin-right: 3%;}
	.shtable-col .minus, .shtable-col .plus {display: none;}	
	.shtable-col.prd-subtotal-col {width: 22%;}
	
	#shcart-step-3-billing-ct, #shcart-step-3-cart-ct {width: 100%; margin: 0;}
	#shcart-step-3-billing-ct {margin-bottom: 50px;}
	#order-step-4-form .gen-form-row {margin-bottom: 30px;}
	#order-step-4-form .gfr-half {width: 48%; margin-right: 4%; margin-bottom: 0;}
	#order-step-4-form .gfr-half:nth-child(2) {margin-right: 0;}
	#order-step-4-form .gfr-full {width: 100%; margin-bottom: 0;}
	
	#shcart-step-4-summary-ct, #shcart-step-4-cart-ct {width: 100%; margin: 0;}
	#shcart-step-4-summary-ct {margin-bottom: 50px;}
	
	.shcart-form input[type="text"], .shcart-form input[type="email"], .shcart-form input[type="password"], .shcart-form textarea, .shcart-form .styled-select-wrapper select {font-size: 13px;}
	
	#shcart-step-5-sfw .wrap  {width: 95%;}
}
@media only screen and (max-width: 600px) {	
	.shtable-col.prd-img-col {display: none;}
	#shcart-table-header .shtable-col.prd-name-col span, #shcart-table-footer .shtable-col.prd-name-col span {display: inline;}
	.shtable-col .remove-resp {display: inline-block; margin-top: 8px; margin-bottom: 20px; font-size: 12px; line-height: 12px; color: #fff; padding: 10px 15px; background: #a8b324; cursor: pointer;
	transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;
	border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
	.shtable-col .remove-resp:hover {background: #879018;}
	
	.shtable-col.prd-name-col {width: 40%; margin-right: 5%;}
	.shtable-col.prd-qty-col {width: 20%; margin-right: 5%;}
	.shtable-col.prd-subtotal-col {width: 30%;}
}
@media only screen and (max-width: 500px) {	
	#shcart-content-sfw {margin-bottom: 40px;}
	
	table.shcart-table tr td, table.shcart-table tr.thead td, table.shcart-table tr.tfoot td, table.shcart-table tr td .qty-input {font-size: 11px; line-height: 16px;}
	#shcart-step-3-table tr td, #shcart-step-3-table tr.thead td, #shcart-step-3-table tr.tfoot td, #shcart-step-3-table tr td .qty-input,
	#shcart-step-4-table tr td, #shcart-step-4-table tr.thead td, #shcart-step-4-table tr.tfoot td, #shcart-step-4-table tr td .qty-input	{font-size: 13px; line-height: 18px;}
	.shtable-col .qty-input {width: 60px;}
	
	.shcart-form label.form-label {font-size: 14px;}
		
	#order-step-3-form .gen-form-row, #order-step-4-form .gen-form-row {margin-bottom: 0;}
	#order-step-3-form .gfr-half, #order-step-3-form .gfr-full,
	#order-step-4-form .gfr-half, #order-step-4-form .gfr-full {width: 100%; margin: 0; margin-bottom: 20px;}
	
	#shcart-next-step, #shcart-prev-step {float: none; width: 100%;}
	#shcart-next-step a, #shcart-prev-step a {display: block; text-align: center; width: 100%;}
	#shcart-next-step a {margin-bottom: 10px;}
	#shcart-next-step input[type="submit"] {margin-top: 0; margin-bottom: 10px; width: 100%;}
	
	#shcart-step-5-sfw .shcart-bg-ct {padding: 50px 25px;}
}

@media only screen and (max-width: 360px) {
	.shcart-bg-ct {padding: 20px;}
	#shcart-step-1-table {display: none;}
	#shcart-step-1-table-resp {display: block;}
	#shcart-step-1-table-resp tr td {vertical-align: middle;}
	#shcart-step-1-table-resp tr td span.prd-code {display: block; margin-top: 5px;}
	#shcart-step-1-table-resp tr td .remove {position: absolute; top: 5px; right: 0;}
	
	.shcart-bg-ct p {font-size: 14px; line-height: 22px;}
	.shcart-bg-ct .inner-pd {padding-right: 0;}
	.shcart-bg-ct a.float-href {position: relative; top: auto; right: auto; margin-top: 30px; background: #a8b324; color: #fff; padding: 7px 25px;
	transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;
	border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
	.shcart-bg-ct a.float-href:hover {background: #879018; color: #fff;}
}
/* /SHOPPING CART */


/* ACCOUNT */
#account-content-sfw {margin-bottom: 80px;}

.gen-form-row .gfr-half {float: left; width: 48%; margin-right: 4%; position: relative;}
.gen-form-row .gfr-half:nth-child(2n) {margin-right: 0;}
.gen-form-row .gfr-full {width: 100%; position: relative;}

#account-sidebar-ct {float: left; width: 27%;}

.account-section-ct {box-sizing: border-box; background: #f4f4f4; padding: 40px;}
#my-pic-outer-ct {margin-bottom: 30px;}
#my-pic-ct {margin: 0 auto; margin-bottom: 15px; width: 150px; height: 150px; overflow: hidden; position: relative;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}
#my-pic-ct .cover {position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); display: none;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}
#my-pic-ct .cover img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: 30px; cursor: pointer;}
img#my-pic {width: 100%; height: 100%; object-fit: cover;}
#my-pic-outer-ct h3 {text-align: center; font-size: 16px; line-height: 22px; color: #181818; font-family: 'BoldFont';}
#my-pic-form input[type="reset"], #my-pic-form input[type="submit"], #my-pic-form a.btn {font-size: 14px; line-height: 14px; min-width: 90px; height: 35px; padding: 7px 20px;}
#my-pic-form a.btn {height: 40px; line-height: 40px; padding: 0px 25px; font-size: 13px;}
#my-pic-form input[type="file"] {width: 0; height: 0;}

ul#account-sidebar-nav-list {}
ul#account-sidebar-nav-list > li {margin-bottom: 10px;}
ul#account-sidebar-nav-list > li:last-child {margin-bottom: 0;}
ul#account-sidebar-nav-list > li > a {display: block; background: #f4f4f4; padding: 15px 20px; font-size: 15px; line-height: 25px;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul#account-sidebar-nav-list > li > a:hover {color: #a8b324;}
ul#account-sidebar-nav-list > li > a.active, ul#account-sidebar-nav-list > li > a.active:hover {color: #a8b324; font-family: 'BoldFont';}
#my-pic-form input[type="reset"] {margin-right: 5px;}

#account-content-ct {float: right; width: 70%; box-sizing: border-box;}
.account-section-title {padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #adb5aa;}
.account-section-title h3{color: #0a472e; font-size: 26px; line-height: 32px; margin-bottom: 5px;}
.account-section-title p {color: #555555; font-size: 15px; line-height: 25px; margin-bottom: 5px;}

.my-account-form label.form-label {font-size: 14px; color: #555555;}
.my-account-form textarea {height: 140px;}
.my-account-form input[type="submit"] {min-width: 200px;}
.my-account-form .gen-form-row {margin-bottom: 35px;}
.my-account-form .gen-form-row label {line-height: 23px; display: inline-block; margin-bottom: 5px;}

ul#my-order-list {}
ul#my-order-list > li {margin-bottom: 20px;
box-shadow: 0px 0px 10px #efefef; -webkit-box-shadow: 0px 0px 10px #efefef; -moz-box-shadow: 0px 0px 10px #efefef; -o-box-shadow: 0px 0px 10px #efefef;}
ul#my-order-list > li:last-child {margin-bottom: 0;}
ul#my-order-list > li h3.title {padding: 20px 25px; background: #fff; font-size: 16px; line-height: 22px; color: #555555; padding-right: 50px; background: url(../images/icon/arrow-down.png) no-repeat right 25px center #fff; background-size: 12px auto; cursor: pointer; margin-bottom: 0;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul#my-order-list > li h3.title:hover {color: #a8b324; background: url(../images/icon/arrow-down.png) no-repeat right 25px center #fff; background-size: 12px auto;}
ul#my-order-list > li h3.title.opened {background: url(../images/icon/arrow-up.png) no-repeat right 25px center #fff; background-size: 12px auto; color: #a8b324; font-family: 'BoldFont', Arial, Verdana;}
.order-detail-list-ct {padding: 25px; background: #e8f8f7; display: none;}
ul.my-order-detail-list {}
ul.my-order-detail-list > li {padding: 20px; background: #fff; font-size: 14px; line-height: 24px; color: #555555; margin-bottom: 30px;}
ul.my-order-detail-list > li:last-child {margin-bottom: 0;}
.order-detail-header {font-size: 14px; color: #0a472e;}
.order-detail-header .no {float: left; width: 30%; margin-right: 3%; font-family: 'BoldFont', Arial, Verdana;}
.order-detail-header .date {float: left; width: 20%; margin-right: 3%; text-align: center;}
.order-detail-header .status {float: right; width: 44%; text-align: right;}
.sep-line {height: 1px; background: #e6e6e6; margin-top: 15px; margin-bottom: 15px;}
.order-detail-product {margin-bottom: 20px; display: flex; align-items: center;}
.order-detail-product.no-mb {margin-bottom: 0;}
.order-detail-product .prd {float: left; width: 15%; margin-right: 3%; position: relative;}
.order-detail-product .prd img {width: 100%;}
.order-detail-product .prd .qty {position: absolute; top: -10px; right: -10px; width: 25px; height: 25px; text-align: center; background: #dfb178; color: #fff; font-size: 11px; line-height: 25px; font-family: 'BoldFont', Arial, Verdana;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}
.order-detail-product .prd-name {float: left; width: 55%; margin-right: 3%;}
.order-detail-product .prd-name span {display: block; font-size: 13px; line-height: 18px; color: #a8b324;}
.order-detail-product .prd-subtotal {float: right; width: 24%; text-align: right;}
.order-detail-footer {font-size: 16px; line-height: 26px; color: #0a472e;}
.order-detail-footer .caption {float: left; width: 50%; font-family: 'BoldFont', Arial, Verdana;}
.order-detail-footer .value {font-family: 'BoldFont', Arial, Verdana;}
.order-detail-footer .caption.full-width {width: 100%;}
.order-detail-footer .caption p {font-size: 14px; line-height: 21px; color: #555555; font-family: 'GeneralFont';}
.order-detail-footer .caption p b {font-size: 16px; line-height: 26px; color: #0a472e;}
.order-detail-footer .value {float: right; width: 50%; text-align: right;}

#payment-confirmation-form #example1 > div {margin: 0 auto;}
#payment-confirmation-form .styled-input-file-wrapper {width: 200px; text-align: center; display: inline-block;}
label.upload-file-info {display: inline-block !important; font-size: 14px !important; line-height: 22px !important; color: #999999 !important; font-family: 'GeneralFont', Arial, Verdana !important; margin-left: 10px;}
label.upload-file-info.no-ml {margin-left: 0;}
label.upload-file-info.dis-bl {display: block !important;}

@media only screen and (max-width: 1200px) {
	#account-sidebar-ct {width: 32%;}
	#account-content-ct {width: 65%;}
	
	ul#my-order-list > li h3.title {padding: 20px 25px;}
	ul.my-order-detail-list > li {font-size: 14px; line-height: 20px;}
	.order-detail-header .no, .order-detail-header .date {width: 50%; margin: 0;}
	.order-detail-header .date {text-align: right;}
	.order-detail-header .status {float: none; width: 100%; margin: 0; text-align: left;}
	.order-detail-product .prd-name {margin-top: 0; width: 45%;}
	.order-detail-product .prd-name span {margin-top: 3px;}
	.order-detail-product .prd-subtotal {width: 34%; margin-top: 0;}
	.order-detail-footer {font-size: 14px; line-height: 20px;}
	.order-detail-footer .caption p {font-size: 13px; line-height: 18px;}
	.order-detail-footer .caption p b {font-size: 14px; line-height: 20px;}
}
@media only screen and (max-width: 1024px) {
	#account-sidebar-ct {width: 33%;}
	#account-content-ct {width: 64%;}
	
	.account-section-ct  {padding: 30px;}
	.order-detail-product .prd {display: none;}
	.order-detail-product .prd-name {width: 55%; margin-right: 5%}
	.order-detail-product .prd-subtotal {width: 40%;}
}
@media only screen and (max-width: 768px) {
	#account-content-sfw {margin-bottom: 60px;}
	
	.account-section-ct {padding: 20px;}
	
	#account-sidebar-ct, #account-content-ct {width: 100%; margin: 0;}
	#account-content-ct {margin-bottom: 30px;}
	#account-sidebar-nav-ct {display: none;}
}

@media only screen and (max-width: 500px) {
	#account-content-sfw {margin-bottom: 40px;}
	
	.account-section-title h3 {font-size: 22px; line-height: 30px;}
	.account-section-title p {font-size: 15px; line-height: 21px;}
	
	.my-account-form .gen-form-row {margin-bottom: 0;}
	.my-account-form .gfr-half, .my-account-form .gfr-full {width: 100%; margin: 0; margin-bottom: 30px;}
	.my-account-form label.form-label, .upload-file-info, .my-account-form input[type="text"], .my-account-form input[type="email"], .my-account-form input[type="password"], .my-account-form textarea, .my-account-form .styled-select-wrapper select, .my-account-form .styled-input-file-wrapper   {font-size: 14px;}
	.my-account-form .styled-input-file-wrapper {line-height: 55px;}
	
	ul#my-order-list > li h3.title {font-size: 16px; line-height: 22px; padding: 15px 20px;}
	.order-detail-list-ct {padding: 20px;}
	ul.my-order-detail-list > li {padding: 18px;}
	ul.my-order-detail-list > li, .order-detail-footer {font-size: 13px; line-height: 18px;}
}

@media only screen and (max-width: 360px) {
	ul#my-order-list > li h3.title {font-size: 14px; line-height: 20px; padding: 15px 20px;}
	ul#my-order-list > li h3.title, ul#my-order-list > li h3.title:hover, ul#my-order-list > li h3.title.opened {background-size: 9px auto;}
	.order-detail-header {font-size: 12px;}
	.order-detail-header .no, .order-detail-header .date  {width: 100%; margin: 0;}
	.order-detail-header .date {text-align: left;}
	
	.order-detail-footer {font-size: 14px; line-height: 20px;}
	.order-detail-footer .caption p {font-size: 12px; line-height: 17px;}
	.order-detail-footer .caption p b {font-size: 14px; line-height: 20px;}
	
	#payment-confirmation-form .styled-input-file-wrapper {width: 150px;}
	label.upload-file-info {font-size: 12px; line-height: 16px;}
}
/* /ACCOUNT */


/* FOOTER */
#footer {padding: 40px 0 20px 0; background: #0a472e;}
#footer h4 {font-size: 12px; line-height: 20px; font-family: 'BoldFont', Arial, Verdana; color: #fff; letter-spacing: 3px; margin-bottom: 20px;}
#footer h4.no-mb {margin-bottom: 0;}
#footer h4.mb-small {margin-bottom: 15px;}
#footer h4 span {display: block; font-size: 20px; line-height: 25px; color: #bac34e; font-family: 'GeneralFont', Arial, Verdana; letter-spacing: 0;}
#footer h4 span.mt {margin-top: 10px;}
#footer h4.with-icon {padding-left: 75px; min-height: 50px;}
#footer h4.with-icon.headset {background: url(../images/icon/headset.png) no-repeat left top; background-size: 50px auto;}
#footer h4.with-icon.whour {background: url(../images/icon/whour.png) no-repeat left top; background-size: 50px auto;}
#footer, #footer p, #footer p a {color: #909896; font-size: 14px; line-height: 24px;}
#footer p a:hover {color: #fff; text-decoration: none;}

#footer-top {padding-bottom: 30px; margin-bottom: 30px; border-bottom: 2px solid #235a43;}
#ftop-contact-ct, #ftop-whour-ct {float: left; width: 35%; box-sizing: border-box; padding-right: 50px;}
#ftop-socmed-ct {float: right;}
#ftop-socmed-ct h4 {text-align: right;}
ul.socmed-list {}
ul.socmed-list > li {float: left; margin-right: 10px;}
ul.socmed-list > li:last-child {margin-right: 0;}
ul.socmed-list > li img {height: 40px; width: auto; -webkit-backface-visibility: hidden;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;}
ul.socmed-list > li img:hover {opacity: 0.8;}

#footer-middle {padding-bottom: 30px; margin-bottom: 30px; border-bottom: 2px solid #235a43;}
#fmid-col-1, #fmid-col-2, #fmid-col-3, #fmid-col-4 {float: left; width: 25%; box-sizing: border-box; padding-right: 50px;}
#fmid-col-5 {float: left; display: none;}
ul.footer-nav-list {}
ul.footer-nav-list > li {margin-bottom: 5px;}
ul.footer-nav-list > li:last-child {margin-bottom: 0;}
ul.footer-nav-list > li > a {color: #909896; font-size: 14px; line-height: 24px; cursor: pointer;}
ul.footer-nav-list > li > a:hover {color: #a8b324;}

#footer-bottom {}
#footer-bottom p, #footer-bottom p a {text-align: center; font-size: 13px; line-height: 20px;}
#footer-bottom p a {color: #a8b324;}
#footer-bottom p a:hover {color: #a8b324; text-decoration: underline;}

@media only screen and (max-width: 1024px) {
	#footer h4.with-icon {padding-left: 60px;}
	#footer h4.with-icon.headset, #footer h4.with-icon.whour {background-size: 40px auto;}
	#footer h4 span {font-size: 16px; line-height: 22px;}
	
	#fmid-col-3 {display: none;}
	#fmid-col-1 {width: 38%;}
	#fmid-col-2 {width: 30%;}
	#fmid-col-4 {width: 32%;}
}

@media only screen and (max-width: 768px) {	
	#ftop-contact-ct {width: 55%;}
	#ftop-whour-ct  {width: 45%; padding-right: 0;}
	
	#ftop-socmed-ct {display: none;}
	
	#fmid-col-2, #fmid-col-4 {display: none;}
	#fmid-col-1 {width: 60%;}
	#fmid-col-5 {float: left; display: block; width: 40%;}
}

@media only screen and (max-width: 500px) {
	#ftop-contact-ct, #ftop-whour-ct, #fmid-col-1, #fmid-col-5 {float: none; width: 100%; padding: 0; margin: 0;}
	#ftop-contact-ct, #fmid-col-1 {margin-bottom: 40px;}
}
/* /FOOTER */


/* PAGINATION */
.mt-30 {margin-top: 30px;}
.mt-20 {margin-top: 20px;}
.mt-10 {margin-top: 10px;}
.pagination-sfw {}
.pagination-container {}
.pagination-list {}
.pagination-list.centered {display: inline-block; margin: 0 auto;}
.pagination-list li {float: left; margin-bottom: 5px; margin-right: 8px;}
.pagination-list li:last-child {margin-right: 0px;}
.pagination-list li a {font-size: 12px; line-height: 12px; color: #999999; background: #ffffff; display: inline-block; padding: 12px 14px 10px 14px; cursor: pointer;
transition: all 0.2s linear; -moz-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}
.pagination-list li a:hover {background: #a8b324; text-decoration: none; color: #222222;}
.pagination-list li a.active, .pagination-list li a.active:hover {background: #a8b324; color: #fff; text-decoration: none; font-family: 'BoldFont', Arial, Verdana;}

@media only screen and (max-width: 768px) {
	.pagination-list li {margin-right: 7px;}
	.pagination-list li a {font-size: 14px; line-height: 14px; padding: 9px 12px;}
}

@media only screen and (max-width: 500px) {
	.pagination-list li a  {font-size: 13px; line-height: 13px;}
	.pagination-list li a.edge {display: none;}
	.pagination-container.fl-right, .pagination-container.fl-left {float: none !important;}
	.pagination-container {text-align: center;}
	.pagination-list {display: inline-block; margin: 0 auto;}
}
/* /PAGINATION */


/* ADDITIONAL */
#fp-waiting {background: #fff; position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.7; z-index: 9000; display: none;}
#fp-waiting img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

#go-to-top {position: fixed; bottom: 60px; left: 10px; z-index: 2000; width: 70px; height: 70px; background: url(../images/icon/arrow-up-double.png) no-repeat top 23px center #a8b324; background-size: 20px 20px; cursor: pointer;
transition: background 0.2s linear; -webkit-transition: background 0.2s linear; -moz-transition: background 0.2s linear; -o-transition: background 0.2s linear;
border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%;}
#go-to-top:hover {background-position: top 15px center; background-color: #879018;}

#not-found-sfw {padding: 80px 0;}

@media only screen and (max-width: 768px) {
	#go-to-top {display: none !important;}
	
	#not-found-sfw {padding: 60px 0;}
}

@media only screen and (max-width: 500px) {
	#not-found-sfw {padding: 40px 0;}
}
/* /ADDITIONAL */


/* FLOATING WA */
.sticky-wa {position: fixed; right: 0; bottom: 60px; z-index: 2000; height: 70px; width: 100px;}
.sticky-wa img {width: 70px; height: 70px; position: absolute; right: 10px; z-index: 2001;
transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -o-transition: all 0.25s linear;}
.sticky-wa img.opened {right: 100px;}
.ste-text {position: absolute; right: 0; margin-top: 12px; z-index: 1000;}
.ste-text a {font-family: 'GeneralFont'; display: inline-block; color: #fff; width: 0; font-size: 14px; line-height: 45px; background: #1bd741; text-align: center; padding-left: 0; padding-right: 0;
transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -o-transition: all 0.25s linear;}
.ste-text a:hover {text-decoration: underline;}
.ste-text a.opened {padding-left: 40px; padding-right: 30px; width: 60px;}

@media only screen and (max-width: 500px) {
	.sticky-wa img {width: 60px; height: 60px;}
	.sticky-wa img.opened {right: 90px;}
	.ste-text {margin-top: 13px;}
	.ste-text a {font-size: 13px; line-height: 35px;}
	.ste-text a.opened  {width: 60px; padding-left: 20px; padding-right: 20px;}
}
/* /FLOATING WA */


/* OVERLAY NOTIFICATION */
.overlay-bg, .overlay-bg2  { width: 100%; height: 100%; background: #7f7f7f; opacity: 0.5; z-index: 9000; left: 0; top: 0; position: fixed;}
.notification-content, .notification-content2 {width: 40%; box-sizing: border-box; padding: 40px; background: #ffffff; z-index: 10000; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center;}
.notification-content h3, .notification-content2 h3 {font-size: 30px; line-height: 36px; font-family: 'BoldFont', Arial, Verdana; color: #555555; margin-bottom: 20px;}
.notification-content p, .notification-content2 p {font-size: 18px; line-height: 26px; margin-bottom: 0px; font-family: 'GeneralFont', Arial, Verdana; color: #555555;}
.notification-content small, .notification-content2 small {padding-left: 3px; font-size: 13px; color: #555555; font-family: 'GeneralFont', Arial, Verdana;}

.notif-success h3, .notif-success2 h3 {padding-top: 100px; background: url(../images/icon/success-notif.png) no-repeat top center; background-size: auto 72px;}
a.notification-close-btn {margin-top: 20px; cursor: pointer; display: inline-block;}
a.notification-close-btn.gen-btn {font-size: 14px; line-height: 14px; padding: 12px 25px; background: #a8b324; border: none; color: #fff; border: 1px solid #a8b324; font-family: 'BoldFont', Arial, Verdana;
transition: all 0.2s linear; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -o-transition: all 0.2s linear;
border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px;}
a.notification-close-btn.gen-btn:hover {background: #879018; border: 1px solid #879018;}

.overlay-bg2, .notification-content2 {display: none;}
.form-control.type2 {display: inline; width: 60%;}

@media only screen and (max-width: 1024px) {
	.notification-content, .notification-content2 {width: 450px;}
	.notification-content h3, .notification-content2 h3 {font-size: 28px;}
	.notification-content p, .notification-content2 p {font-size: 15px; line-height: 23px;}
}

@media only screen and (max-width: 500px) {
	.notification-content, .notification-content2 {width: 280px; padding: 30px;}
	.notification-content h3, .notification-content2 h3 {font-size: 24px; line-height: 32px;}
	a.notification-close-btn.gen-btn {font-size: 13px; line-height: 13px;}
}
/* /OVERLAY NOTIFICATION */