@charset "utf-8";






/*-------------------------------------------------------------------------------------------------------------
	File : base.css
	CSS 적용순서 : 아이디 > 태그와 클래스 > 클래스 > 태그
	CSS 선택자 선언순서 : Type Selector, Layout Selector, Class Selector, Etc
	CSS 속성 선언순서 : display, position, float/clear, overflow, width/height, margin/padding, border, background, font/color, align, etc
-------------------------------------------------------------------------------------------------------------*/
* {
  word-break: keep-all;
  word-wrap: break-word;
  font-family: "NotoSansKR", "NotoSans", "NotoSansja", "맑은 고딕", "돋움", "Malgun Gothic", "Dotum", "Arial";
}

*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  font-family: "NotoSansKR", "NotoSans", "NotoSansja", "Malgun Gothic", "Dotum", "Arial", sans-serif;
  letter-spacing: -0.05rem;
}

*:lang(ja),
*:lang(ja)::before,
*:lang(ja)::after {
  font-family: 'NotoSansKR', sans-serif;
}






html,
body {
  min-width: 320px;
  background: linear-gradient(to top, #fff, #f4f4f4 50px);
  -webkit-overflow-scrolling: touch;
}

html {
  font-size: 62.5%;
  font-size: 0.65rem;
  font-family: "NotoSansKR", "NotoSans", "NotoSansja", "맑은 고딕", "돋움", "Malgun Gothic", "Dotum", "Arial";
  font-weight: 400;
}
html:lang(ja) {
  font-family:'NotoSansKR', "NotoSansja",'Hiragino Sans',Meiryo,sans-serif;
}

address,
article,
aside,
canvas,
details,
figure,
figcaption,
footer,
header,
menu,
nav,
section {
  display: block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

img {
  vertical-align: top;
  width: auto;
  min-width: 100%;
  height: auto;
}

ol,
ul,
li,
dl,
dt,
dd {
  list-style: none;
}

table {
  width: 100%;
  table-layout: fixed;
  border-spacing: 0px;
  border-collapse: collapse;
}

th,
td {
  word-break: break-all;
  font-weight: normal;
}

fieldset,
iframe {
  width: 100%;
}

em,
address {
  font-style: normal;
}

button,
select,
input,
label,
textarea {
  vertical-align: middle;
  font-family: "NotoSansKR", "NotoSans", "NotoSansja", "맑은 고딕", "돋움", "Malgun Gothic", "Dotum", "Arial";
}
button:lang(ja),
select:lang(ja),
input:lang(ja),
label:lang(ja),
textarea:lang(ja) {
  
  font-family:'Hiragino Kaku Gothic ProN', "NotoSansja",'Hiragino Sans',Meiryo,sans-serif;
}

hr {
  display: none;
}

legend {
  position: absolute;
  left: -9999em;
  top: -9999em;
}

caption {
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
}

a {
  text-decoration: none;
  color: #333;
}

a:hover {
  color: #ff8a00;
}

a.btn-search:hover {
  color: #fff;
}

a.btn-orange:hover {
  color: #fff;
}

a.btn-comfirm:hover {
  color: #fff;
}

input {
  /*ios대응*/
  appearance: none;
  -webkit-appearance: none;
  -webkit-border-radius: 0;
}




.align-l {
  text-align: left !important;
}

.align-c {
  text-align: center !important;
}

.align-r {
  text-align: right !important;
}

.j-end {
  justify-content: flex-end !important;
}

.scroll-h {
  overflow: hidden !important;
}

.scroll-y {
  overflow-y: hidden !important;
}

.scroll-x {
  overflow-x: hidden !important;
}

.scroll-auto {
  overflow: auto !important;
}

.clear {
  clear: both;
}

.float-l {
  float: left !important;
}

.float-r {
  float: right !important;
}

.float-n {
  float: none !important;
}



.err-txt {

  display: inline-block;
  font-size: 1.2rem;
  margin-top: 0.1rem;
  color: #999 !important;
  width: 100%;
}

.err-txt:lang(en) {
  margin-top: 1rem;
  font-size: 1rem;
  line-height: 1.2rem;
}

.err-txt:lang(en)+.err-txt:lang(en) {
  margin-top: 0.2rem;
}

.err-txt.point {
  color: #ff8a00 !important;
}

.bpoint {
  color: #ff8a00 !important;
  font-size: 1.4rem;
}

.font14 {
  font-size: 1.4rem !important;

}

.tow-box {
  display: flex !important;
  justify-content: space-between;
}

.tow-box>div>input.inp {
  width: calc(100% - 15%);
}

.input-flex input.inp {
  width: calc(100% - 8%);
}

.input-flex {
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.input-cell-flex {
  display: flex;
  gap:10px;
  align-items: center;
}

.spa-tow {
  justify-content: space-between;
  align-items: flex-end;
}

.w100p {
  width: 100% !important;
}

.w70p {
  width: 70% !important;
}

.w60p {
  width: 60% !important;
}

.w40p {
  width: 40% !important;
}

.w50p {
  width: 50% !important;
}

.w30p {
  width: 30% !important;
}

.mt20 {
  margin-top: 2rem !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.mar-t35 {
  margin-top: 3.5rem !important;
}


.w90p {
  width: 93% !important;
}

.mar-t0 {
  margin-top: 0rem !important;
}

.mar-t10 {
  margin-top: 1rem !important;
}

.mar-t20 {
  margin-top: 2rem !important;
}

.mar-t30 {
  margin-top: 3rem !important;
}

.mar-t40 {
  margin-top: 4rem !important;
}

.mar-t60 {
  margin-top: 6rem !important;
}

.mar-b10 {
  margin-bottom: 1rem !important;
}

.mar-b20 {
  margin-bottom: 2rem !important;
}

.mar-b5 {
  margin-bottom: 0.5rem !important;
}

.mar-b0 {
  margin-bottom: 0rem !important;
}

.pad-b50 {
  padding-bottom: 5rem !important;
}

.pad-b10 {
  padding-bottom: 1rem !important;
}

.pad-b24 {
  padding-bottom: 2.4rem !important;
}

.pd0 {
  padding: 0 !important;
}

.pdr-t0 {
  padding-top: 0rem !important;
}

.pdr-t5 {
  padding-top: 0.5rem !important;
}

.pdr-t20 {
  padding-top: 2rem !important;
}

.pdr-b0 {
  padding-bottom: 0rem !important;
}

.pd-tb0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.pad-t60 {
  padding-top: 1.5rem !important;
}

.pad-t50 {
  padding-top: 5rem !important;
}

.pad-t10 {
  padding-top: 1rem !important;
}

.pad-r14 {
  padding-right: 1.4rem !important;
}

.pdr-l1 {
  padding-left: 1rem !important;
}

.pdr-r0 {
  padding-right: 0rem !important;
}

.mar-l1 {
  margin-left: 1rem !important;
}

.mar-l0 {
  margin-left: 0rem !important;
}

.mar-20 {
  margin-right: 1rem !important;
}

.mar-r1 {
  margin-right: 1rem !important;
}

.mar-r14 {
  margin-right: 1.4rem !important;
}

.mar-l4 {
  margin-left: 4rem !important;
}

.mr10 {
  margin-right: 0.5rem;
}

.mar0 {
  margin: 0 !important;
}

.right0 {
  right: 0 !important;
}

.boder-t0 {
  border-top: 0 !important;
}

.boder-b0 {
  border-bottom: 0 !important;
}

.relative {
  position: relative !important;
}

.flex-end {
  justify-content: flex-end !important;
}

.f-bold {
  font-family: 'NotoSans-Bold' !important;
}

.align-top {
  align-items: start !important;
}


.none-minw {
  min-width: inherit !important;
}

.ok-number {
  position: relative
}

.ok-number .ok-txt {
  position: absolute;
  right: 0.7rem;
  top: 0.5rem;
  color: #f20f0f;
  font-size: 1.4rem;

}


input[type="checkbox" i]:disabled {
  background-color: #ccc;
  border-color: #ccc
}

.inp.min-w23 {
  min-width: 100%;
}

/*홈하단 버튼*/
.home-navigation {
  position: fixed;
  display: none;
  background-color: #fafafa;
  height: 6rem;
  z-index: 100;
  width: 100%;
  bottom: 0;
}

.home-navigation>div {
  display: flex;
  height: 6rem;
  justify-content: space-around;
  align-items: center;
}

.home-navigation button {
  display: flex;
  width: 100%;
  justify-content: center;
  height: 6rem;
  align-items: center;
}

.home-navigation button i {
  display: block;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  width: 3rem;
  height: 3rem;
}






.home-navigation>div>button:nth-child(1) i {
  background-image: url(/images/mobile/common/home1.svg);
}

.home-navigation>div>button:nth-child(2) i {
  background-image: url(/images/mobile/common/home2.svg);
}

.home-navigation>div>button:nth-child(3) i {
  background-image: url(/images/mobile/common/home3.svg);
}

.home-navigation>div>button:nth-child(4) i {
  background-image: url(/images/mobile/common/home4.svg);
}

.form-check.disabled label>span:before {
  border-color: #f1f1f1;
  color: #ccc;
}

.form-check.disabled label>span {
  color: #ccc;
}

.flag-footer {
  display: flex;
  justify-content: flex-end;
}

.flag-footer button {
  display: flex;
  border: 1px solid #6e6e6e;
  border-radius: 0.3rem;
  padding-right: 0.5rem;
  width: max-content;
}

.flag-footer button p {
  color: #fff;
  display: flex;
  font-size: 1rem;
  padding-left: 5px;
  padding-right: 5px;
}

.flag-footer .flag-img {
  width: 2.4rem;
  max-height: 15px;
  width: 100%;
  min-width: auto;
}


/*-------------------------------------------------------------------
    ## Responsive
-------------------------------------------------------------------*/
/* Font Size */
@media all and (max-width: 1024px) {
  .company-logo {
    display: flex;
    align-items: center;
    font-size: 1.2rem;
    color: #b4b4b4;
    font-weight: 500;
  }

  .company-logo p {
    color: #8c8c8c;
    padding-left: 4rem;
  }

  .footer-info {
    display: flex;
    align-items: center;
  }

  .company-logo ul.addr-info {
    display: block;
    margin-left: 1rem;
  }

  .company-logo ul.tel-info {
    display: flex;
    margin-left: 1rem;
  }

  .company-logo ul {
    display: block;
  }

  .company-logo ul li {
    font-size: 1.2rem;
    color: #999;
    position: relative;
    padding-left: 1rem;
  }

  .company-logo ul.tel-info li:first-child::after {
    content: "";
    display: block;
    position: absolute;
    top: 0.3rem;
    right: -0.5rem;
    width: 1px;
    height: 1.2rem;
    background-color: #8c8c8c;
  }

  .copy-inner {
    display: block;
    justify-content: space-between;
    align-items: center;
    margin-top: 1rem;
  }

  .footer .f-logo {
    display: none;
    height: 2rem;
  }

  .footer .f-logo img {
    min-width: auto;
  }

  .copy-inner .f-logo {
    display: block;
  }

  .company-logo {
    flex-wrap: wrap;
  }

  .company-logo ul.tel-info {
    margin-left: 8.5rem;
  }

}

/* Mobile */

@media all and (max-width: 570px) {
  .company-logo p {
    padding-left: 0rem;
  }

  .company-logo ul.addr-info,
  .company-logo ul.tel-info {
    width: 100%;
    margin-left: 0;
  }

  .company-logo ul.addr-info li,
  .company-logo ul.tel-info li {
    padding-left: 0;
  }

  .company-logo ul.tel-info li {
    padding-right: 0.3rem;
    margin-right: 1rem;
  }

  .flag-footer {
    margin-top: 2rem;
  }

}

/* Mobile */

@media all and (max-width: 750px) {}

/* Mobile */


@media all and (max-width: 360px) {
  .date-wrap input.inp.inp-date.mar-l1 {
    margin-left: 0.5rem !important;
  }


}

/* Mobile */



/*-------------------------------------------------------------------
	Form
-------------------------------------------------------------------*/
/* Default */
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  font-family: "NotoSansKR";
  color: #e6e6e6;
  font-size: 1.4rem;
}

/* IE 10 + */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  font-family: "NotoSansKR";
  color: #e6e6e6;
  font-size: 1.4rem;
}

/* Webkit Browser */
input:-moz-placeholder,
textarea:-moz-placeholder {
  font-family: "NotoSansKR";
  color: #e6e6e6;
  font-size: 1.4rem;
}

/* Mozilla Firefox 4 to 18 */
input::-moz-placeholder,
textarea::-moz-placeholder {
  font-family: "NotoSansKR";
  color: #e6e6e6;
  font-size: 1.4rem;
}

/* Mozilla Firefox 19+ */
input:focus:-ms-input-placeholder,
textarea:focus:-ms-input-placeholder {
  color: transparent;
  font-size: 1.4rem;
}

/* IE 10 + */
input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder {
  color: transparent;
}

/* Webkit Browser */
input:focus:-moz-placeholder,
textarea:focus:-moz-placeholder {
  color: transparent;
  font-size: 1.4rem;
}

/* Mozilla Firefox 4 to 18 */
input:focus::-moz-placeholder,
textarea:focus::-moz-placeholder {
  color: transparent;
  font-size: 1.4rem;
}

/* Mozilla Firefox 19+ */
input {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  border: 0px;
  vertical-align: middle;
  font-size: 1.4rem;
}

textarea {
  width: 100%;
  vertical-align: middle;
  resize: none;
  font-size: 1.4rem;
  outline: none;
}

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -o-appearance: none;
  font-size: 1.4rem;
}

select::-ms-expand {
  display: none;
  font-size: 1.4rem;
}

:root select {
  padding: 0 2rem 0 0.52rem;
}

input[type="text"]::placeholder {
  color: #dcdcdc;
}

input:-ms-input-placeholder:lang(en),
textarea:-ms-input-placeholder:lang(en),
input::-webkit-input-placeholder:lang(en),
textarea::-webkit-input-placeholder:lang(en),
input:-moz-placeholder:lang(en),
textarea:-moz-placeholder:lang(en),
input::-moz-placeholder:lang(en),
textarea::-moz-placeholder:lang(en),
input:focus:-ms-input-placeholder:lang(en),
textarea:focus:-ms-input-placeholder:lang(en),
input:focus::-webkit-input-placeholder:lang(en),
textarea:focus::-webkit-input-placeholder:lang(en),
input:focus:-moz-placeholder:lang(en),
textarea:focus:-moz-placeholder:lang(en),
input:focus::-moz-placeholder:lang(en),
textarea:focus::-moz-placeholder:lang(en),
input::placeholder:lang(en) {
  font-size: 1.4rem;
}

/* Mozilla Firefox 19+ */


@media all and (min-width: 1024px) {
  .inp.min-w23 {
    min-width: 23rem !important;
  }

}

/* Mobile */


@media all and (min-width: 1200px) {
  .home-navigation {
    display: none;
  }

}

/* Mobile */

.txt-bul-deduction {
	display: inline-block;
	position: relative;
	height: 24px;
	padding: 4px 6px;
	border: 1px solid #1449A3;
	border-radius: 4px;
	background: #fff;
	color: #1449A3;
	overflow: hidden;
	font-size: 12px;
	font-weight: normal;
	line-height: 14px;
	vertical-align: middle;
	box-sizing: border-box;
}

.txt-bul-deduction i {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	height: 24px;
	width: 24px;
	background: #1CE47D;
	text-align: center;
	line-height: 22px;
	font-style: normal;
}

.center-product-list ul li .product-info .txt-bul-deduction {
	position: absolute;
	top: 0;
	right: 0;	
}

.product-inner .product_top .discont-price .option {
	display: flex;
	gap: 6px;
}

.product-inner .product_top .discont-price .option .txt-bul-deduction {
	height: 32px;
	line-height: 22px;
}

.product-inner .bascket_item .item_top .txt-bul-deduction {
	position: absolute;
    left: 0;
    bottom: 16px;
}

.product-inner .bascket_item .item_top:has(.txt-bul-deduction + .icon_round) .txt-bul-deduction {
	bottom: 21px;
}