@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oxanium:wght@300;400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');

:root{

--thm-clr1:#466F00;

--thm-clr2:#629B02;

}



#ifrm {

  width: 100%;

  min-height: 300px;

  overflow: hidden;

  border: 0;

}

/* pc */

@media screen and (min-width:1300px) {

  #memofile {

    max-width: 1250px;

  }

}

/* tablet */

@media screen and (min-width:768px) and (max-width:1024px) {

  #memofile {

    width: 99%;

  }

}

/* mobile */

@media screen and (min-width:0) and (max-width:767px) {

  #memofile {

    width: 99%;

  }

}

body, div, p, h1, h2, h3, h4, h5, h6, ol, li, dl, dt, dd, ul, pre, form, fieldset, legend, button, table, th, td {

  border: 0;

  margin: 0;

  padding: 0;

}

ul, ol, li, dl {

  list-style: none;

}

img {

  border: 0;

  vertical-align: middle;

  font-size: 0;

}

address, caption, cite, code, dfn, em, var {

  font-style: normal;

}

a {

  text-decoration: none;

  color: #333;

}

a:hover, a:active, a:focus {

  text-decoration: none;

}

table {

  border: 0;

  border-spacing: 0;

  border-collapse: collapse;

  padding: 0;

}

strong {

  font-weight: 500;

}

h1, h2, h3, h4, h5, h6 {

  font-weight: 400;

}

article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main {

  display: block;

}

body, th, td, input, select, textarea, button {

  color: #3b3b3b;

  font-size: 16px;

  line-height: 1.5;

  letter-spacing: -0.05em;

  font-family: 'Oxanium', 'Noto Sans KR', 'Roboto', sans-serif;

  font-weight: 400;

}

:focus {

  outline: none;

}

.material-symbols-outlined {
  font-display: block;
  font-variation-settings:

  'FILL' 0,

  'wght' 200,

  'GRAD' 0,

  'opsz' 24;

  vertical-align: middle;

}



.blind, .gnb-open-btn, .gnb-close-btn, .mobile-gnb {

  display: none;

}

.gnb:after, .sub-content:after {

  clear: both;

  display: block;

  height: 0;

  content: "";

  visibility: hidden;

}

.header-tnb-ul, .header-link-ico, .slick-slide {

  display: inline-block;

}

.side-quick {

  position: fixed;

  right: 10px;

  top: 40vh;

  z-index: 9999;

}

.side-quick a {

  display: flex;

  width: 55px;

  height: 55px;

  box-sizing: border-box;

  border-radius: 34px ;

  background: #1B569F;

  align-items: center;

  justify-content: center;

  color: #fff;

  border-top: 1px rgba(255, 255, 255, 0.3) solid;

}

.side-quick li .material-symbols-outlined {

  font-size: 30px;

}



.side-quick li.sq-top a {

  border-top-width: 0;

  flex-direction: column;

  font-size: 16px;

  margin-top: 5px;

  background: #397E24;

}

.side-quick li.sq-cart a {

  position: relative;

}

.side-quick li.sq-cart a span {

  position: absolute;

  width: 20px;

  height: 20px;

  background: #FF0000;

  color: #fff;

  font-size: 10px;

  line-height: 20px;

  border-radius: 9999px;

  display: flex;

  align-items: center;

  justify-content: center;

  right: 5px;

  top: 10px;

}

/*cart-popup*/

.quick-cart {

  position: absolute;

  left: -650px;

  top: -20px;

  width: 600px;

  height: 400px;

  background: #fff;

  box-sizing: border-box;

  display: none;

  z-index: 999999999;

  border-radius: 20px;

  overflow: hidden;

}

.quick-cart:after {

  content: "";

  width: 30px;

  height: 50px;

  position: absolute;

  right: -30px;

  top: 85px;

  background: url(img/arrow.png);

  background-size: cover;

  display: block;

}

.quick-cart dt {

  font-size: 24px;

  color: #fff;

  font-weight: 600;

  background: #eb264b;

  padding: 0px 30px;

  height: 60px;

  line-height: 60px;

  box-sizing: border-box;

}

.qc-img {

  display: flex;

  justify-content: center;

  align-items: center;

  height: 41px;

  width: 55px;

  overflow: hidden;

  border-radius: 5px;

}

.quick-cart dd {

  padding: 15px 30px;

}

.quick-cart ul {

  max-height: 200px;

  overflow-x: hidden;

  overflow-y: auto;

}

.quick-cart li {

  border-bottom: 1px #e0e0e0 solid;

}

.qc-img img {

  width: 100%;

}

.qc-box {

  display: flex;

  padding: 15px 10px;

  gap: 10px;

  align-items: center;

}

.qc-txt {

  padding-left: 20px;

}

.quick-cart .ea-box {

  position: relative;

  flex-grow: 1;

  display: flex;

  justify-content: flex-end;

}

.quick-cart .ea-box input {

  width: 22px;

  height: 22px;

  line-height: 22px;

  font-size: 12px;

}

.ea-box input[type="text"] {

  border: 0;

  border: 1px #e0e0e0 solid;

  min-width: 60px;

}

.qc-t1 {

  font-weight: 600;

}

.qc-t2 {

  font-size: 0.9em;

  color: #888;

}

.qc-t2 span {

  display: inline-block;

  padding: 0 10px;

  position: relative;

}

/*.qc-t2 span:after,



.quick-cart .ea-box:after{



content:"";



width:1px;



height:14px;



background:#e0e0e0;



display:block;



position:absolute;



left:0;



bottom:5px;



}



.qc-t2 span:first-child{



padding-left:0;



}







.qc-t2 span:first-child:after{



display:none;



}*/

.bc-close {

  position: absolute;

  top: 0;

  right: 0;

  height: 60px;

  line-height: 60px;

  width: 60px;

  text-align: center;

  border-left: 1px rgba(255, 255, 255, 0.3) solid;

  font-size: 28px;

  color: #fff;

}

.quick-cart-bg {

  position: fixed;

  z-index: 99999999;

  width: 100%;

  height: 100%;

  background: rgba(0, 0, 0, 0.6);

  display: none;

  left: 0;

  top: 0;

}

.button-box {

  display: flex;

  justify-content: center;

  gap: 10px;

}

.button-box input {

  padding: 5px 30px;

  background: #fff;

  border: 1px #e0e0e0 solid;

  border-radius: 5px;

}

.button-box input.button-order {

  background: #333;

  color: #fff;

  border-color: #333;

}

.header-mobile-search {

  display: none;

}

header#header {

  width: 100%;

  position: relative;

  z-index: 999;

  /*background:#35343b;*/

  /*background:#3c0f3e;*/

  background: #fff;

  border-bottom: 1px solid #dfdfdf;

  box-shadow: 3px 0px 5px rgba(23,23,23,0.1);

}

.tnb {  

  width: 100%;

  border-bottom: 1px solid #adadad;

  background: #efefef;

}

.tnb-area {

  display: flex;

  width:98%;

  justify-content: flex-end;

  align-items: center;

  max-width: 1280px;

  margin: 0 auto;

  height: 35px;

}

.tnb ul {

  display: flex;

  /*border-left:1px #4d4c59 solid;*/

}

.tnb li {

  font-size: 16px;

  /*border-right:1px #4d4c59 solid;*/

  height: 100%;

}

.tnb li a {

  font-size: 14px;

  color: #000;

  display: flex;

  align-items: center;

  text-align: center;

  padding: 0 1rem;

  height: 100%;

}

.tnb li a i {

  font-size: 20px;

}



#topSearch {

display: inline-block;

background: #fff;  

flex-grow: 1;

max-width: 360px;

padding:0 2rem;

}

#topSearch .header-search{

display: flex;

width:100%;

align-items: center;

overflow: hidden;  

border:2px solid var(--thm-clr1);    

max-width: 360px;

}



#topSearch .header-search button {

  width: 40px;

  font-size: 26px;

  color: var(--thm-clr1);

  flex-shrink: 0;

  background: transparent;

  cursor: pointer;

}

#topSearch .header-search input {

  flex-grow: 1;

  border: 0;

  background: transparent;

  padding: 0 10px;

  color: #000;

  width: calc(100% - 42px);

}

#topSearch .header-search input::placeholder {

  color: #a9a9a9;

  opacity: 1;

  font-size: 0.85em;

  font-weight: 300;

}

.header-box1 {

  width: 98%;

  max-width: 1280px;

  margin: 0 auto;

  position: relative;

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding:0.8rem 0;

}

.header-box2 {

  width: 98%;

  max-width: 1280px;

  margin: 0 auto;

  position: relative;

  display: flex;

  justify-content: space-between;

  align-items: center;

   padding-bottom:0.8rem;

}



.header-logo img {

  width: 280px;

}

.header-logo a {  

  font-size:3rem;

  font-weight:600;

  color: var(--thm-clr1);

}

.search-open-btn {

  display: none;

}



.hgnb {

  text-align: center;

  position: relative;

  width: auto;

  height: auto;

  box-sizing: border-box;

  margin: 0;

  display: flex;

  justify-content: space-around;

  flex-grow: 1;

}

.hgnb > li {

  position: relative;

  text-align: center;

  box-sizing: border-box;

  margin-left: 10px;

}

.hgnb > li:hover > a {

  font-weight: 600;

}

.hgnb > li > a {

  font-size: 20px;

  color: #000;

  position: relative;

  width: 100%;

  text-transform: uppercase;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 10px 0px;

  box-sizing: border-box;

}

.hgnb > li > a > i {

  font-size: 24px;

  color: #999;

  margin-right: 5px;

}

.hgnb > li > ul {

  display: none;

  position: absolute;

  left: 50%;

  width: 160px;

  z-index: 5;

  background: #fff;

  box-sizing: border-box;

  border: 1px #e0e0e0 solid;

  bottom: 0px;

  transform: translateX(-50%) translateY(100%);

}

.hgnb > li:hover > ul {

  height: auto;

  display: block;

}

.hgnb > li > ul > li {

  height: 35px;

  line-height: 35px;

  border-top: 1px rgba(0, 0, 0, 0.1) dashed;

  position: relative;

}

.hgnb > li > ul li:first-child {

  border-top-width: 0;

}

.hgnb > li > ul li a {

  display: block;

  color: rgba(0, 0, 0, 0.5);

  font-size: 15px;

}

.hgnb > li > ul li a span {

  font-size: 12px;

}

.hgnb > li > ul li:hover > a {

  color: rgba(0, 0, 0, 0.9);

  font-weight: 500;

}

.hgnb > li > ul li:hover ul {

  display: block;

  opacity: 1;

}



.hgnb > li > ul .gnb-ss {

  position: absolute;

  left: 100%;

  top: -1px;

  width: 120px;

  background: #f9f9f9;

  border: 1px #e0e0e0 solid;

  border-bottom-width: 0;

  opacity: 0;

  transition: .3s ease;

}

.hgnb > li > ul .gnb-ss li {

  width: 100%;

  border-bottom: 1px #e0e0e0 solid;

  height: 26px;

  line-height: 26px;

}

.hgnb > li > ul .gnb-ss a {

  width: 100%;

  font-size: 0.75em;

  color: #999;

}



#allmenu{

    color:#FF0003;

    font-size:1.2rem;    

    font-weight: 400;

    width:120px;

    display: flex;

    align-items: center;

}



.gnb {

  text-align: center;

  position: relative;

  width:100%;

  height: 2rem;

  box-sizing: border-box;

  margin: 0;

  display: flex;

  justify-content: flex-start;

  flex-wrap: wrap;

  flex-grow: 1;

  overflow-y: hidden;

  

}

.gnb > li {

  position: relative;

  text-align: center;

  box-sizing: border-box;

  margin-left: 10px;

}

.gnb > li:hover > a {

  font-weight: 600;

}

.gnb > li > a {

  font-size: 1.1rem;

  color: #000;

  position: relative;

  width: 100%;

  text-transform: uppercase;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 0px 22px;

  line-height: 2rem;

  box-sizing: border-box;

}

.gnb > li > a > i {

  font-size: 24px;

  color: #999;

  margin-right: 5px;

}

.gnb > li > ul {

  display: none;

  position: absolute;

  left: 50%;

  margin-left: -60px;

  width: 120px;

  z-index: 5;

  background: #fff;

  box-sizing: border-box;

  border: 1px #e0e0e0 solid;

  top: 90px;

}

.gnb > li:hover > ul {

  height: auto;

  display: block;

}

.gnb > li > ul > li {

  height: 35px;

  line-height: 35px;

  border-top: 1px rgba(0, 0, 0, 0.1) dashed;

  position: relative;

}

.gnb > li > ul li:first-child {

  border-top-width: 0;

}

.gnb > li > ul li a {

  display: block;

  color: rgba(0, 0, 0, 0.5);

  font-size: 15px;

}

.gnb > li > ul li a span {

  font-size: 12px;

}

.gnb > li > ul li:hover > a {

  color: rgba(0, 0, 0, 0.9);

  font-weight: 500;

}

.gnb > li > ul li:hover ul {

  display: block;

  opacity: 1;

}

.mobile-open-btn, .all-menu-area {

  display: none;

}

.gnb > li > ul .gnb-ss {

  position: absolute;

  left: 100%;

  top: -1px;

  width: 120px;

  background: #f9f9f9;

  border: 1px #e0e0e0 solid;

  border-bottom-width: 0;

  opacity: 0;

  transition: .3s ease;

}

.gnb > li > ul .gnb-ss li {

  width: 100%;

  border-bottom: 1px #e0e0e0 solid;

  height: 26px;

  line-height: 26px;

}

.gnb > li > ul .gnb-ss a {

  width: 100%;

  font-size: 0.75em;

  color: #999;

}





#allmenuCont{

   position:absolute;

   display: none;

   top:160px;

   left:50%;

   transform: translateX(-50%);

   width: 1250px;

   max-width: 98%;

   background: #fff;

   padding:1rem;

   z-index:5556;

   border:1px solid #dfdfdf;

   box-shadow:1px 1px 5px rgba(0,0,0,0.1);

   border-radius: 0 0 1rem 1rem;

   

}



#allmenuCont ul{

   position:relative;

   width:100%;

   display: flex;

   justify-content: flex-start;

   align-items: center;

   flex-wrap: wrap;   

}

#allmenuCont ul.cates li{

   margin:0 0 1rem 0;

}



#allmenuCont ul.cates li a{

   display: inline-block;

   font-size:1rem;

   line-height: 1.4rem;

   padding:0 0.5rem;

}

#allmenuCont ul li.depth1 a{

   font-size:1.1rem;

   font-weight: 600;

}

#allmenuCont ul li.vt span{   

   display: inline-block;

   margin:0 0.7rem;

   border-left:1px solid #adadad;

   height:0.7rem;

   width:1px;

}



#allmenuCont ul.func{

   justify-content: flex-end;

}



#allmenuCont ul.func li{

   margin:0 0 0rem 0.5rem;

}



#allmenuCont ul.func li a{

   display: inline-block;

   font-size:1.1rem;

   line-height: 1.4rem;

   padding:0.3rem 0.5rem;

   background: #f7f7f7;

   border-radius: 0.2rem;

   box-shadow:1px 1px 1px rgba(0,0,0,0.1);

}

@media (min-width:992px){	

    #allmenuCont.on{

       display: block;

    }

}

/*footer*/

footer {

  width: 100%;

  padding: 0px 0 30px 0;

  /*background: #131314;*/

  /*background: #3c0f3e;*/

  background: #f7f7f7;

  color: #000;

}

footer a {

  color: #000;

}

.foot-area {

  width: 95%;

  max-width: 1280px;

  margin: 0 auto 0;

  box-sizing: border-box;

  position: relative;

}

.fnb {

  width: 100%;

  border-top: 1px solid #bababa;

  border-bottom: 1px solid #dfdfdf;

}

.fnb ul {

  width: 95%;

  max-width: 1280px;

  margin: 0 auto;

  padding: 0.5rem 0;

  text-align: center;

  display: flex;

  justify-content: center;

  align-items: center;

}

.fnb li {

  position: relative;

  display: flex;

  align-items: center;

}

.fnb li a {

  display: block;

  padding: 0 15px;

  font-weight: 600;

  font-size:0.95rem;

}

.fnb li:first-child a {

  padding-left: 0;

}

.fnb li span.vt {

  display: inline-block;

  width: 1px;

  height: 1rem;

  border-right: 1px solid #8E8E8E;

  line-height: 1.4rem;

}

.foot-info {

  position: relative;

  margin: 15px 0;

  font-size:0.925rem;

  text-align: center;

}

.foot-info p {

  display: inline-block;

  margin-right: 25px;

}

.foot-copy {

  position: relative;

  margin: 15px 0;

  font-size:0.875rem;

  text-align: center;

}



.ban-link {

  position: absolute;

  right: 0;

  top: -20px;

}

.ban-link img {

  width: 110px;

}

.link {

  background: #000;

  color: rgba(255, 255, 255, 0.6);

  padding: 5px 15px;

  border-radius: 5px;

  display: inline-block;

  margin-left: 10px;

}

/********************* main *********************************/

#main-visual {

  width: 100%;

  overflow: hidden;

  position: relative;

}

#main-visual .slick-arrow {

  position: absolute;

  left: 50px;

  top: 50%;

  margin-top: -50px;

  z-index: 99;

  background: transparent;

  color: #fff;  

  line-height: 100px;

}

#main-visual .slick-arrow .material-symbols-outlined{

    font-size: 60px!important;

}

#main-visual .slick-arrow.slick-next {

  left: auto;

  right: 50px;

}

#main-visual .slick-list {

  position: relative;

  z-index: 55;

}

.mv-box {

  width: 2000px;

  position: relative;

  left: 50%;

  transform: translateX(-50%);

  z-index: 88;

}

.mo-mv-img {

  display: none;

}

.main-box {

  width: 100%;

  /*background:#1e1e21;*/

  padding: 90px 0;

}

#main-list {

  position: relative;

}

.main-tit {

  display: flex;

  /*color:#fff;*/

  color: #000;

  align-items: baseline;

  gap: 10px;

}

.main-tit p {

  font-weight: 800;

  font-size: 52px;

}

.main-tit span {

  font-size: 22px;

  opacity: 0.6;

}

#main-list {

  width: 96%;

  max-width: 1280px;

  margin: 0 auto;

}

.list-type-btn {

  position: absolute;

  display: flex;

  top: 40px;

  right: 0;

  color: #fff;

  font-size: 22px;

  gap: 5px;

}

.list-type-btn.ltb-sub {

  color: #333;

  top: 0;

}

.list-type-btn li {

  opacity: 0.3;

}

.list-type-btn li.current {

  opacity: 1;

}

.list-type.current {

  display: block;

}

.main-list-type1 ul {

  display: flex;

  flex-wrap: wrap;

  gap: 2%;

}

.main-list-type1 ul li {

  width: 23.5%;

  margin-top: 40px;

}

.main-list-type1 ul li a {

  display: block;

  width: 100%;

  /*color:#fff;*/

  color: #000;

}

.main-list-type2 ul li {

  margin-top: 40px;

  border-top: 1px rgba(255, 255, 255, 0.2) solid;

  padding-top: 40px;

}

.main-list-type2 ul li:first-child {

  border-top-width: 0;

  padding-top: 0;

}

.main-list-type2 ul li a {

  width: 100%;

  color: #fff;

  display: flex;

  gap: 40px;

  align-items: flex-end;

}

.main-list-type2 .list-li-top {

  width: 260px;

  padding: 25px;

  flex-shrink: 0;

}

.main-list-type2 .list-text1 {

  flex-grow: 1;

}

.main-list-type2 .list-li-price {

  border-top: 0;

  margin-top: 0;

  padding-top: 5px;

}

.main-list-type2 .list-text1 p {

  height: 1.2em;

  max-height: 2.4em;

}

.list-li-top {

  /*background:#2d2d33;*/

  padding: 30px 40px 15px 40px;

  transition: .5s ease;

  border: 1px #E3E3E3 solid;

}

.list-li-top:hover {

  border-color: #ff5e7c;

}

.list-img1 {

  width: 100%;

  padding-top: 74%;

  overflow: hidden;

  position: relative;

  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);

  border-radius: 10px;

}

.list-img1-box {

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

}

.list-li-top img {

  max-width: 100%;

  transition: .5s ease;

}

.list-li-top:hover img {

  -webkit-transform: scale(1.2);

  transform: scale(1.2)

}

.img-text1 {

  text-align: center;

  font-size: 19px;

  margin-top: 20px;

  font-weight: 300;

  transition: .5s ease;

  word-break: keep-all;

}

.list-li-top:hover .img-text1 {

  color: #ff486b

}

.list-text1 {

  text-align: center;

  padding-top: 25px;

  color: #a0a0a0;

}

.list-text1 span {

  opacity: 0.8;

}

.list-text1 p {

  font-size: 20px;

  margin: 10px 0;

  height: 2.6em;

  line-height: 1.3em;

  overflow: hidden;

}

.main-list-type2 ul li a .list-text1 {

  text-align: left;

}

.list-li-price {

  border-top: 1px rgba(255, 255, 255, 0.2) solid;

  margin-top: 15px;

  padding-top: 15px;

  display: flex;

  justify-content: space-between;

  align-items: center;

}

.list-li-price p {

  display: flex;

  align-items: center;

}

.list-li-price p strong {

  font-size: 25px;

  font-weight: 600;

  display: inline-block;

  margin-right: 5px;

}

.list-li-price p em {

  text-decoration: line-through;

  opacity: 0.7;

  font-weight: 300;

}

.list-basket {

  width: 54px;

  height: 54px;

  display: flex;

  justify-content: center;

  align-items: center;

  color: #fff;

  font-size: 30px;

  background: rgba(0, 0, 0, 0.5);

  transition: .5s ease;

  cursor: pointer;

  border-radius: 40px 10px 30px 40px;

}

.list-basket:hover {

  background: #5f1cce;

}

/********************* sub *********************************/

#sub {

  width: 95%;

  max-width: 1280px;

  margin: 0 auto;

  padding: 50px 0 80px;

}

#sub-view-top {

  padding-top: 50px;

  width: 95%;

  max-width: 1280px;

  margin: 0 auto;

}



#sub.sub-1000{  

  max-width: 1000px;

}





.sub-tit {

  display: block;

  position: relative;

  text-align: center;  

  margin: 0;

}

.sub-tit span {

  position: relative;

  display: inline-block;

  max-width:90%;

  font-size: 2rem;

  font-weight: 600;

  margin:0 auto;  

  line-height: 2.4rem;

  white-space: nowrap;

  text-overflow: ellipsis;

  overflow: hidden;

}

.sub-tit span:after {

  content: '';

  position: relative;

  display: block;

  width:80%;

  height:0px;

  line-height: 0;

  margin:0.5rem auto 0;

  padding:0;

  border-bottom: 2px solid #232323;

}

.sub-tit2 {

  font-size: 1.6rem;

  font-weight: 600;

  margin-bottom: 1rem;

}

.sub-tit3 {

  font-size: 1.3rem;

  font-weight: 500;

  margin-bottom: 0.85rem;

}

.sub-tit4 {

  font-size: 1.2rem;

  font-weight: 500;

  margin-bottom: 0.5rem;

}

.sub-tit5 {

  font-size: 1rem;

  font-weight: 500;

  margin-bottom: 0.5rem;

}

.sub-nav {

  font-size: 14px;

  margin-bottom: 2rem;

  text-align: right;

}

.sub-nemu {

  display: flex;

  /*background:#edeff0;*/

  background: #b4f1f2;

  padding: 10px;

  box-sizing: border-box;

  justify-content: center;

  flex-wrap: wrap;

  align-items: center;

}

.sub-nemu a {

  padding: 5px 20px;

  margin: 0 20px;

  color: #777;

}

.sub-nemu a.current {

  font-weight: 600;

  color: #111;

}

.list-info {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin: 40px 0 25px;

  position: relative;

}

.list-info p {

  font-weight: 300;

  letter-spacing: -0.05em;

  color: #666;

}

.list-info p strong {

  color: #333;

  font-weight: 600;

}

.type-btn {

  display: flex;

}

.type-btn li {

  width: 27px;

  height: 27px;

  background: #f0f0f0;

  display: flex;

  justify-content: center;

  align-items: center;

  border-radius: 2px;

  margin-left: 5px;

}

.type-btn li.current {

  background: #333;

  color: #fff;

}

.list-type {

  display: none;

}

.list-type.current {

  display: block;

}

/*page*/

.paging {

  width: 95%;

  max-width: 1280px;

  margin: 20px auto 0;

  display: flex;

  align-items: center;

  justify-content: center;

}

.paging a, .paging strong {

  height: 40px;

  width: 40px;

  box-sizing: border-box;

  color: #222;

  display: flex;

  align-items: center;

  justify-content: center;

}

.paging .p-prev {

  margin-right: 10px;

  width: 35px;

  color: #c5c5c5;

  font-size: 25px;

}

.paging .p-next {

  margin-left: 10px;

  width: 35px;

  color: #c5c5c5;

  font-size: 25px;

}

.paging strong {

  background: #222;

  color: #fff;

  width: 40px;

  height: 40px;

  border-radius: 999px;

}

/*cart*/

.sub-cart table {

  border-top: 2px #154108 solid;

  width: 100%;

  table-layout: fixed;

  margin-bottom: 20px;

}

.sub-cart table thead th {

  border-bottom: 1px #e0e0e0 solid;

  padding: 10px 0;

  font-weight: 700;

}

.sub-cart table tbody td {

  border-bottom: 1px #e0e0e0 solid;

  text-align: center;

  padding: 10px;

}

.sub-cart table tfoot td {

  text-align: right;

  padding: 20px 20px;

}

.sub-cart table tfoot td strong {

  font-size: 1.25em;

  font-weight: 600;

}

.cart-img {

  background: #fff;

  padding-top: 43%;

  position: relative;

  width: 50%;

  box-sizing: border-box;

  margin: 0 auto;

}

.cart-img a {

  padding-top: 0;

  height: 100%;

  top: 0;

  left: 0;

  width: 100%;

  position: absolute;

  display: flex;

  justify-content: center;

  align-items: center;

  overflow: hidden;

}

.cart-img img {

  width: 100%;

}

.cl-btn input {

  border: 0;

  background: #fff;

  border: 1px #e0e0e0 solid;

  border-radius: 5px;

  font-size: 0.85em;

  padding: 5px 20px;

}

.sub-button-box {

  display: flex;

  justify-content: center;

  gap: 10px;

}

.sub-button-box input {

  background: #323131;

  color: #fff;

  flex-grow: 1;

  border: 0;

  padding: 15px 0;

}

.sub-button-box input.button-order {

  /*background:#2833c2;*/

}

.ea-box {

  position: relative;

}

.ea-box p {

  display: inline-block;

  border: 1px #e0e0e0 solid;

  padding: 0 20px;

  height: 30px;

  line-height: 30px;

  box-sizing: border-box;

  margin: 0 -5px;

}

.ea-box span {

  font-size: 0.85em;

  color: #888;

}

.ea-box input {

  width: 30px;

  height: 30px;

  line-height: 30px;

  border: 0;

  border: 1px #e0e0e0 solid;

  text-align: center;

  display: inline-block;

  color: #666;

  font-size: 16px;

  cursor: pointer;

  vertical-align: top;

  box-sizing: border-box;

}

.status-serch {

  text-align: center;

  border-top: 2px #333 solid;

  padding: 25px 0;

  box-sizing: border-box;

  margin-bottom: 20px;

  background: #f4f4f4;

}

.status-serch p {

  display: inline-block;

}

.status-serch input {

  border: 1px #e0e0e0 solid;

  margin-right: 20px;

  text-align: left;

  padding: 5px;

  border-radius: 999px;

}

.status-serch span {

  display: inline-block;

  margin-right: 5px;

}

.status-serch input[type="button"] {

  background: #030303;

  color: #fff;

  padding: 5px 20px;

  margin-right: 0;

  border-radius: 999px;

  border: 0;

}

.status-list {}

.status-list li {

  border-bottom: 1px #e0e0e0 solid;

  padding: 20px;

  position: relative;

  box-sizing: border-box;

}

.stl-t1 {

  font-weight: 300;

  color: #666;

}

.stl-t1 span {

  display: inline-block;

  font-weight: 600;

  color: #000;

  margin-left: 10px;

  padding-left: 10px;

  position: relative;

}

.stl-t1 span:after {

  content: "";

  display: block;

  width: 1px;

  height: 15px;

  background: rgb(185, 185, 185);

  left: 0;

  top: 5px;

  position: absolute;

}

.stl-t2 {

  font-weight: 500;

  font-size: 1.15em;

  padding: 10px 0;

}

.stl-t4 p {

  display: inline-block;

  margin-right: 15px;

}

.stl-s {

  position: absolute;

  right: 10px;

  top: 15px;

  display: inline-block;

  font-weight: 500;

  color: #000;

  padding: 7px 14px;

  font-size: 0.95em;

  letter-spacing: -0.05em;

}

.stl-s1 {

  color: #4a9309;

}

.stl-s2 {

  color: #999;

}

.stl-s4 {

  color: #677809;

}

.stl-s5 {

  color: #bb3412;

}

.delivery-info {

  border-top: 1px #e0e0e0 solid;

  border-bottom: 1px #e0e0e0 solid;

  margin-bottom: 30px;

}

.delivery-info table {

  width: 100%;

}

.delivery-info table th {

  text-align: left;

  width: 25%;

  font-weight: 600;

}

.delivery-info table th, .delivery-info table td {

  border-top: 1px #e0e0e0 solid;

  padding: 20px 10px;

}

.delivery-info table tr:first-child th, .delivery-info table tr:first-child td {

  border-top-width: 0;

}

.delivery-info input, .delivery-info select {

  width: 90%;

  max-width: 500px;

  border: 1px solid #d3d3d3;

  height: 32px;

  line-height: 32px;

  border-radius: 2px;

}

.delivery-info textarea {

  width: 90%;

  max-width: 500px;

  border: 1px solid #d3d3d3;

  height: 32px;

  line-height: 32px;

  border-radius: 2px;

  resize: none;

}

.success-box {

  border: 1px #e0e0e0 solid;

  padding: 50px;

  box-sizin: border-box;

  background: #f2f2f2;

  text-align: center;

  margin-bottom: 20px;

}

.success-box p {

  font-weight: 600;

  color: #111;

  font-size: 1.25em;

  margin-bottom: 20px;

  border-bottom: 1px #e0e0e0 solid;

  padding-bottom: 20px;

}

/*view*/

.view-top {

  display: flex;

  margin-bottom: 70px;

}

.view-top-img-area {

  width: 48%;

  flex-shrink: 0;

  border: 1px #e0e0e0 solid;

  box-sizing: border-box;

  padding: 50px 60px 30px 60px;

}

.vt-img {

  position: relative;

  width: 100%;

  padding-top: 74%;

  overlay: hidden;

  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);

  border-radius: 10px;

}

.vt-img-box {

  width: 100%;

  height: 100%;

  position: absolute;

  left: 0;

  top: 0;

  display: flex;

  align-items: center;

  justify-content: center;

}

.vt-img-box img {

  width: 100%;

}

.view-top-img-area p {

  text-align: center;

  font-size: 40px;

  margin-top: 20px;

}

.view-top-img-area p strong {

  font-weight: 700;

}

.vt-info {

  width: 48%;

  margin-left: 4%;

}

.vt-info dt {

  font-size: 30px;

  font-weight: 700;

  padding: 20px 0;

}

.vt-info dt .view001 {

  font-size: 16px;

  font-weight: 400;

  letter-spacing: -0.05em;

}

.vt-info dd table {

  width: 100%;

}

.vt-info dd table th {

  text-align: left;

  font-weight: 500;

}

.vt-info dd table td {

  text-align: right;

  padding: 7px 0;

  color: #666;

}

.vt-info dd .total-box {}

.vt-table {

  padding: 20px 10px;

  border-top: 1px #e0e0e0 solid;

}

.vt-info dd .total-box th {

  font-weight: 600;

  font-size: 1.125em;

}

.vt-info dd .total-box td.total-color {

  color: #d7473e;

  font-size: 1.1em;

}

.vt-info dd .total-box td.total-color strong {

  font-weight: 700;

  font-size: 1.125em;

}

.view-ea-box {

  position: relative;

}

.view-ea-box p {

  display: inline-block;

  border: 1px #e0e0e0 solid;

  padding: 0 20px;

  height: 30px;

  line-height: 30px;

  box-sizing: border-box;

  margin: 0 -5px;

}

.view-ea-box span {

  font-size: 0.85em;

  color: #888;

}

.view-ea-box input {

  width: 30px;

  height: 30px;

  line-height: 30px;

  border: 0;

  border: 1px #e0e0e0 solid;

  text-align: center;

  display: inline-block;

  color: #666;

  font-size: 20px;

  cursor: pointer;

  vertical-align: top;

  box-sizing: border-box;

}

.view-ea-box input[type="text"] {

  border: 0;

  border: 1px #e0e0e0 solid;

  min-width: 60px;

}

.view002 {}

.view002 img {

  height: 25px;

}

.view-content {

  width: 96%;

  max-widrth: 1280px;

  margin: 50px auto;

}

.view-content img {

  max-width: 100%;

}

.view-slide {

  width: 100%;

  padding: 50px 0;

  background: #edeff0;

}

.view-slide-box {

  width: 96%;

  max-width: 12800px;

  margin: 0 auto;

  position: relative;

}

.vs-tit {

  font-weight: 700;

  color: #333;

  font-size: 24px;

  margin-bottom: 20px;

}

.view-slide-box .slick-slide > div {

  margin-left: 20px;

}

.view-slide-box .slick-list {

  overflow: hidden;

  margin-left: -20px;

}

.view-slide-box .slick-arrow {

  position: absolute;

  right: 0;

  top: 0px;

  font-size: 28px;

}

.view-slide-box .slick-arrow.slick-prev {

  right: 30px;

}

/*sub-view-list*/

.vs-list .list-li-top {

  background: #fff;

  border-color: #fff;

  padding: 15px;

}

.vs-list .list-li-top:hover {

  border-color: #eb264b;

}

.vs-list .img-text1 {

  color: #666;

}

.vs-list .list-text1 p {

  font-size: 18px;

}

.vs-list .list-li-price {

  border-top-color: #e0e0e0;

  justify-content: center;

}

.vs-list .list-text1 .list-li-price p {

  height: auto;

  gap: 10px;

}

.sub-list-type1 {

  display: flex;

  flex-wrap: wrap;

  gap: 2%;

}

.sub-list-type1 li {

  margin-bottom: 40px;

  width: 23.5%;

}

.sub-list-type1 .list-li-top {

  background: #fff;

  border: 1px #e0e0e0 solid;

  box-sizing: border-box;

}

.sub-list-type1 .list-img1, .sub-list-type2 .list-img1, .vs-list .list-img1 {

  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2);

}

.sub-list-type1 .list-li-top:hover {

  border: 1px red solid;

}

.sub-list-type1 .img-text1 {

  color: #666;

}

.sub-list-type1 .list-text1 {

  color: #666;

}

.sub-list-type1 .list-text1 p {

  font-size: 18px;

}

.sub-list-type1 .list-li-price {

  border-top-color: #e0e0e0;

}

.sub-list-type1 .list-text1 .list-li-price p {

  height: auto;

  gap: 10px;

}

.sub-list-type1 .list-li-price .list-basket, .sub-list-type2 .list-li-price .list-basket {

  width: 40px;

  height: 40px;

  background: rgba(0, 0, 0, 0.8);

  font-size: 22px;

}

.sub-list-type2 li {

  display: flex;

  margin-bottom: 40px;

  border-bottom: 1px #e0e0e0 solid;

  padding-bottom: 40px;

}

.sub-list-type2 .list-li-top {

  background: #fff;

  border: 1px #e0e0e0 solid;

}

.sub-list-type2 .list-li-top:hover {

  border: 1px red solid;

}

.sub-list-type2 .img-text1 {

  color: #666;

}

.sub-list-type2 .list-text1 {

  text-align: left;

  color: #666;

}

.sub-list-type2 .list-text1 p {

  font-size: 18px;

}

.sub-list-type2 li:first-child {

  border-top-width: 0;

  padding-top: 0;

}

.sub-list-type2 li a {

  width: 100%;

  display: flex;

  gap: 40px;

  align-items: flex-end;

}

.sub-list-type2 .list-li-top {

  width: 260px;

  padding: 25px;

  flex-shrink: 0;

}

.sub-list-type2 .list-text1 {

  flex-grow: 1;

}

.sub-list-type2 .list-li-price {

  border-top: 0;

  margin-top: 0;

  padding-top: 5px;

}

.sub-list-type2 .list-text1 p {

  height: 1.2em;

  max-height: 2.4em;

}

.sub-list-type2 li, #list-type2 li {

  position: relative;

}

.sub-list-type2 li .list-basket, #list-type2 li .list-basket {

  position: absolute;

  right: 0;

  bottom: 40px;

  background: rgba(0, 0, 0, 0.8);

  cursor: pointer;

}

.jl-btn {

  border: 1px #e0e0e0 solid;

  width: 16%;

  box-sizing: border-box;

  height: 36px;

  line-height: 36px;

  text-align: center;

  border-radius: 5px;

  font-size: 0.85em;

}

ul.tabs {

  display: inline-block;

  width: auto;

  margin: 0 auto 2rem auto;

  padding: 0;

  position: relative;

  list-style: none;

  overflow: hidden;

  border-bottom: 1px solid #dfdfdf;

}

ul.tabs li {

  float: left;

  margin: 0;

  overflow: hidden;

  position: relative;

  background: #fff;

  padding: 0px 1rem;

}

ul.tabs li a {

  width: 100%;

  text-decoration: none;

  display: inline-block;

  font-size: 1.2rem;

  line-height: 38px;

  padding: 0px 1rem;

  outline: none;

  text-align: center;

  margin: 0;

  border-bottom: 2px solid transparent;

  word-break: keep-all;

  word-wrap: normal;

}

ul.tabs li a:hover {

  font-weight: 600;

  border-bottom: 2px solid #E39D19;

}

ul.tabs li.active a {

  font-weight: 800;

  border-bottom: 2px solid #E39D19;

}

ul.tabs.div-3 li {

  width: 33.3%;

}

ul.tabs-box {

  display: flex;

  justify-content: flex-start;

  width: 100%;

  margin: 0 auto 2rem auto;

  padding: 0;

  position: relative;

  list-style: none;

  overflow: hidden;

}

ul.tabs-box li {

  float: left;

  margin: 0;

  overflow: hidden;

  position: relative;

  background: #fff;

  padding: 0px;

}

ul.tabs-box li a {

  width: 100%;

  text-decoration: none;

  display: inline-block;

  font-size: 0.925rem;

  line-height: 1rem;

  padding: 0.8rem;

  outline: none;

  border: 1px solid #dfdfdf;

  text-align: center;

  margin: 0;

}

ul.tabs-box li:first-child a {

  border-radius: 0.4rem 0 0 0.4rem;

  overflow: hidden;

}

ul.tabs-box li:last-child a {

  border-radius: 0 0.4rem 0.4rem 0;

  overflow: hidden;

}

ul.tabs-box li a:hover {

  font-weight: 600;

  background: #7584DC;

  color: #fff;

}

ul.tabs-box li a > p {

  font-size: 1.2rem;

  font-weight: normal;

  color: rgba(255, 80, 83, 1.00);

  margin: 0.5rem 0 0 0 !important;

}

ul.tabs-box.div-5 li {

  width: calc(20% - 0px);

}

ul.tabs-box.div-6 li {

  width: calc(16.6% - 0px);

}

ul.tabs-box li.active a {

  font-weight: 600;

  background: #4858B2;

  color: #fff;

}

ul.tabs-box li.active a > p {

  color: #FFB5B6;

}





ul.sub-tab-wrap{

display:flex;

flex-wrap:wrap;

align-items: center;

justify-content: center;

gap:10px;

margin-bottom:20px;

}

ul.sub-tab-wrap a{

display: inline-block;

width: 100%;

padding:0px 1rem;

line-height: 2.5rem;

background:#eaebf2;

border:1px #d3d5e1 solid;

color:#575a70;

transition: all .3s ease-out;

text-align: center;

}

ul.sub-tab-wrap a:hover{

background:#ffffff;

color:#25262a;

}

ul.sub-tab-wrap li.active a{

font-weight:700;

background:#192d79;

border-color:#192d79;

color:#fff;

}





@media screen and  (max-width:576px){

    

    ul.sub-tab-wrap {     

        justify-content: flex-start;

        gap:0px;

    }

    ul.sub-tab-wrap li {

        width:calc(50%);

        border-left:1px solid #adadad;

        border-bottom:1px solid #adadad;

    }

    ul.sub-tab-wrap li:last-child:nth-child(odd) {

        width:calc(50% + 1px);

    }

    ul.sub-tab-wrap li:first-child, ul.sub-tab-wrap li:nth-child(2){

        border-top:1px solid #adadad;

    }

    ul.sub-tab-wrap li.vt {

        display: none;

    }

    ul.sub-tab-wrap li:nth-child(even), ul.sub-tab-wrap li:last-child{    

        border-right:1px solid #adadad;

    }

    .menu li:last-child {

        width:calc(50% ) !important;

        border-right:1px solid #adadad;

    }

    

    ul.sub-tab-wrap li.current{        

        border-color:#192d79;

     }



    ul.sub-tab-wrap li a{           

        border:none;

    }    

}



/*--------------------------------------------------------------



# 갤러리 타일



--------------------------------------------------------------*/

/* 메인 캠페인 목록 */

.gal-list-1 {

  display: flex;

  grid-gap: 1rem;

  justify-content: flex-start;

  flex-wrap: wrap;

  width: 100%;

  padding: 1rem 0;

  margin: 0;

  overflow: hidden;

}

.gal-list-1 li {

  position: relative;

  width: calc(14.2% - 6rem / 7);

  border-radius: 5px;

  padding: 0.5rem;

  margin: 0;

  border: 1px solid #efefef;

  box-shadow: 1px 1px 5px 1px rgba(145, 145, 145, 0.2);

}

.gal-list-1.gal-list-1000 li {

  width: calc(25% - 3rem / 4);

}

.gal-list-1 li .head {

  width: 100%;

  margin-bottom: 12px;

  font-size: 14px;

  line-height: 44px;

}

.gal-list-1 li .pic {

  position: relative;

  display: inline-block;

  width: 100%;

  margin-bottom: 12px;

}

.gal-list-1 li.closed .pic {

  filter: grayscale(100%);

}

.gal-list-1 li .pic .badges {

  position: absolute;

  bottom: 0.2rem;

  left: 0.2rem;

  width: 100%;

  text-align: center;

}

.gal-list-1 li .pic .badges .sit_icon {

  margin: 0 auto;

  justify-content: center;

  align-items: center;

}

.gal-list-1 li .info {

  width: 100%;

}

.gal-list-1 li .info > div {

  width: 100%;

  overflow: hidden;

  word-break: keep-all;

  white-space: nowrap;

  text-overflow: ellipsis;

  line-height: 1.6rem;

}

.gal-list-1 li .info img {

  margin-right: 10px;

  vertical-align: middle;

}

.gal-list-1 li .stars {

  float: left;

  font-size: 12px;

  font-family: Roboto;

  text-align: left;

}

.gal-list-1 li .hits {

  float: right;

  font-size: 12px;

  font-family: Roboto;

  text-align: right;

}

.gal-list-1 li .sbj {

  font-size: 1rem;

  text-align: left;

  font-weight: 500;

  line-height: 1.1rem;

  height: 2.2rem;

  overflow: hidden;

  text-overflow: ellipsis;

}

@media (max-width: 1600px) {

  .gal-list-1 li {

    width: calc(16.6% - 5rem / 6);

  }

  .gal-list-1.gal-list-1000 li {

    width: calc(25% - 3rem / 4);

  }

}

@media (max-width: 1400px) {

  .gal-list-1 li {

    width: calc(20% - 4rem / 5);

  }

  .gal-list-1.gal-list-1000 li {

    width: calc(25% - 3rem / 4);

  }

}

@media (max-width: 1199px) {

  .gal-list-1 li {

    width: calc(25% - 3rem / 4);

  }

  .gal-list-1.gal-list-1000 li {

    width: calc(25% - 3rem / 4);

  }

}

@media (max-width: 768px) {

  .gal-list-1 li {

    width: calc(33.3% - 2rem / 3);

  }

  .gal-list-1.gal-list-1000 li {

    width: calc(33.3% - 2rem / 3);

  }

}

@media (max-width: 576px) {

  .gal-list-1 li {

    width: calc(50% - 1rem / 2);

  }

  .gal-list-1.gal-list-1000 li {

    width: calc(50% - 1rem / 2);

  }

}

/* 메인 상품 목록 */

.gal-list-swiper {

  display: flex;

  justify-content: flex-start;

  flex-wrap: nowrap;

  width: 100%;

  padding: 1rem 0;

  margin: 0;

}

.gal-list-swiper li {

  border-radius: 5px;

  padding: 0;

  margin: 0 0 0px 0;

  border: 1px solid #efefef;

  box-shadow: 1px 1px 5px 1px rgba(145, 145, 145, 0.2);

}

.gal-list-swiper li a {

  display: inline-block;

  width: 100%;

}

.gal-list-swiper li .head {

  width: 100%;

  margin-bottom: 12px;

  font-size: 14px;

  line-height: 44px;

}

.gal-list-swiper li .pic {

  position: relative;

  display: inline-block;

  width: 100%;

  margin-bottom: 12px;

  border-top: 1px solid #efefef;

  border-bottom: 1px solid #efefef;

}

.gal-list-swiper li.closed .pic {

  filter: grayscale(100%);

}

.gal-list-swiper li .pic .badges {

  position: absolute;

  bottom: 0.1rem;

  left: 0.2rem;

  width: 100%;

  padding: 0.2rem;

}

.gal-list-swiper li .pic .badges .sit_icon {

  margin: 0 auto;

  display: flex;

  justify-content: center;

  align-items: center;

}

.gal-list-swiper li .info {

  width: 100%;

  padding: 0.5rem;

}

.gal-list-swiper li .info > div {

  width: 100%;

  overflow: hidden;

  word-break: keep-all;

  white-space: nowrap;

  text-overflow: ellipsis;

  line-height: 1.6rem;

}

.gal-list-swiper li .stars {

  float: left;

  font-size: 12px;

  font-family: Roboto;

  text-align: left;

}

.gal-list-swiper li .hits {

  float: right;

  font-size: 12px;

  font-family: Roboto;

  text-align: right;

}

.gal-list-swiper li .tit {

  padding: 0.8rem;

  font-size: 1.1rem;

  text-align: left;

  font-weight: 500;

  line-height: 1.1rem;

  height: 2.2rem;

  overflow: hidden;

  text-overflow: ellipsis;

}

.gal-list-swiper li .sbj {

  padding: 0.5rem;

  font-size: 1rem;

  text-align: center;

  font-weight: 500;

  line-height: 1.1rem;

  height: 2.2rem;

  overflow: hidden;

  text-overflow: ellipsis;

}

.gal-list-swiper li .memo {

  padding: 0.5rem;

  font-size: 1rem;

  text-align: center;

  font-weight: 400;

  line-height: 1rem;

  height: 2.2rem;

  overflow: hidden;

  text-overflow: ellipsis;

  color: #8E8E8E;

}

.gal-list-swiper li .sct_cost {

  text-align: center;

}

.gal-list-swiper li .sct_dict {

  text-decoration: line-through;

  font-size: 0.925rem;

}

.gal-list-swiper li .sct_price {

  font-size: 1.1rem;

  font-weight: 700;

  color: #ff0000;

}







/*--------------------------------------------------------------



# 여행상품 목록



--------------------------------------------------------------*/



.list-slick{

  

}



.list-slick .slick-slide{

    margin:0 0.5rem;

}

.list-slick .prod-img{

position:relative;

display:block;

overflow:hidden;

border-radius:5px;

cursor:pointer;

width:100%;

padding-top:100%;

}

.list-slick .prodimg-line{

border:3px rgba(206, 38, 40, 1) solid;

}



.list-slick .pi-area{

position:absolute;

width:100%;

height:100%;

left:0;

top:0;

display:flex;

justify-content: center;

align-items: center;

background:#f9f9f9;

}



.list-slick .pi-area img{

width:100%;

}

.list-slick .pi-wish{

position:absolute;

right:10px;

bottom:10px;

width:40px;

height:40px;

background:#fff;

border-radius:999px;

display:flex;

justify-content: center;

align-items: center;

font-size:24px;

transition: all 0.3s;

transform: translate(0px, 0px);

}

.list-slick .prod-img:hover .pi-wish{

transform: translate(0px, -50px);

}

.list-slick .pi-wish span{

marign:0;

padding:0;

margin-left:-1px;

color:var(--maincolor);

}

.list-slick .pi-basket{

position:absolute;

width:100%;

text-align:center;

left:0;

bottom:0;

background:rgba(255,255,255,0.8);

color:var(--maincolor);

padding:10px 0;

transition: all 0.3s;

transform: translate(0px, 50px);

}



.list-slick .prod-img:hover .pi-basket{

transform: translate(0px, 0px);

}



.list-slick .price-box{

margin-top:10px;

display:flex;

flex-direction: column;

gap:5px;

position:relative;

font-size:var(--fsize2);

}



.list-slick .price-tit{

line-height:1.5em;

height:1.5rem;

overflow:hidden;

text-overflow: ellipsis;

white-space: nowrap;

text-align: center;



}

.list-slick .price-box .memo{

    height:3rem;

    overflow-y:hidden;

    text-overflow: ellipsis;

}



.list-slick .pi-best{

font-size:var(--fsize7);

position:absolute;

z-index:9;

right:10px;

top:10px;

background:var(--maincolor);

color:#fff;

padding:0 10px;

border-radius:999px;

}

.list-slick .per{

color:var(--maincolor);

font-weight:500;



}

.list-slick .daystr{

font-size:1.1rem;

font-weight:600;

color:#004E6C;

}

.list-slick .p-num{

font-size:1.5rem;

text-align: center;

}

.list-slick .p-num span{

font-weight:600;

color:#FF0000;

}

.list-slick .review-rate{

display:flex;

gap:5px;

}

.list-slick .rr-star{

color:var(--point3);

}

.list-slick .rr-txt{

color:var(--subcolor);

}

.list-slick .price-basket{

position:absolute;

bottom:0;

right:0;

width:40px;

height:40px;

border-radius:999px;

background:#ff0000;

display:flex;

justify-content: center;

align-items: center;

font-size:24px;

color:#fff;

cursor:pointer;

}

.list-slick .price-basket img{

width:90%;

}















.list1{

display:flex;

flex-wrap:wrap;

gap:30px 3%;

}



.list1 .prod-img{

position:relative;

display:block;

overflow:hidden;

border-radius:5px;

cursor:pointer;

width:100%;

padding-top:100%;

}

.list1 .prodimg-line{

border:3px rgba(206, 38, 40, 1) solid;

}



.list1 .pi-area{

position:absolute;

width:100%;

height:100%;

left:0;

top:0;

display:flex;

justify-content: center;

align-items: center;

background:#f9f9f9;

}



.list1 .pi-area img{

width:100%;

}

.list1 .pi-wish{

position:absolute;

right:10px;

bottom:10px;

width:40px;

height:40px;

background:#fff;

border-radius:999px;

display:flex;

justify-content: center;

align-items: center;

font-size:24px;

transition: all 0.3s;

transform: translate(0px, 0px);

}

.list1 .prod-img:hover .pi-wish{

transform: translate(0px, -50px);

}

.list1 .pi-wish span{

marign:0;

padding:0;

margin-left:-1px;

color:var(--maincolor);

}

.list1 .pi-basket{

position:absolute;

width:100%;

text-align:center;

left:0;

bottom:0;

background:rgba(255,255,255,0.8);

color:var(--maincolor);

padding:10px 0;

transition: all 0.3s;

transform: translate(0px, 50px);

}



.list1 .prod-img:hover .pi-basket{

transform: translate(0px, 0px);

}



.list1 .price-box{

margin-top:10px;

display:flex;

flex-direction: column;

gap:5px;

position:relative;

font-size:var(--fsize2);

}



.list1 .price-tit{

line-height:1.5em;

height:3em;

overflow:hidden;

}

.list1 .price-box .memo{

    height:3rem;

    overflow-y:hidden;

    text-overflow: ellipsis;

}



.list1 .pi-best{

font-size:var(--fsize7);

position:absolute;

z-index:9;

right:10px;

top:10px;

background:var(--maincolor);

color:#fff;

padding:0 10px;

border-radius:999px;

}

.list1 .per{

color:var(--maincolor);

font-weight:500;



}

.list1 .daystr{

font-size:1.1rem;

font-weight:600;

color:#004E6C;

}

.list1 .p-num{

font-size:1.5rem;

text-align: left;

}

.list1 .p-num span{

font-weight:600;

color:#FF0000;

}

.list1 .review-rate{

display:flex;

gap:5px;

}

.list1 .rr-star{

color:var(--point3);

}

.list1 .rr-txt{

color:var(--subcolor);

}

.list1 .price-basket{

position:absolute;

bottom:0;

right:0;

width:40px;

height:40px;

border-radius:999px;

background:#ff0000;

display:flex;

justify-content: center;

align-items: center;

font-size:24px;

color:#fff;

cursor:pointer;

}

.list1 .price-basket img{

width:90%;

}













#preloader {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  z-index: 9999;

  overflow: hidden;

  background: #fff;

}

#preloader:before {

  content: "";

  position: fixed;

  top: calc(50% - 30px);

  left: calc(50% - 30px);

  border: 6px solid #0d6efd;

  border-top-color: #fff;

  border-bottom-color: #fff;

  border-radius: 50%;

  width: 60px;

  height: 60px;

  -webkit-animation: animate-preloader 1s linear infinite;

  animation: animate-preloader 1s linear infinite;

}

@-webkit-keyframes animate-preloader {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

@keyframes animate-preloader {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

.board-box {

  background: #fff;

  padding: 0;

  max-width: 1280px;

}

.board-box .container {}

.board {

  margin: 0 auto;

  border-radius: 6px;

  border: 1px #e7eaf0 solid;

  /*box-shadow: 3px 3px 5px rgba(0,0,0,0.1);*/

  position: relative;

  overflow: hidden;

}

.board-tab {

  text-align: center;

  border-bottom: 1px #e7eaf0 solid;

  background: #f0f3f7;

  height: 3rem;

  line-height: 3rem;

}

.board-tab li {

  width: calc(30% - 1rem);

  min-width: 80px;

  display: inline-block;

  font-size: 1.2rem;

  color: #747e88;

  cursor: pointer;

  position: relative;

  text-align: center;

}

.board-cont {

  box-sizing: border-box;

  width: 100%;

  padding: 1rem 1rem;

  text-align: left;

  display: inline-block;

  min-height: 250px;

}

.b-more {

  position: absolute;

  right: 0;

  top: 0;

  width: 3rem;

  height: 3rem;

  line-height: 3rem;

  text-align: center;

  background: #a9a9a9;

  color: #fff;

}

.b-more img {

  width: 100%;

}

@media (max-width:767px) {

  .board-cont {

    min-height: 0;

  }

}

@media (max-width:576px) {

  .board-cont {

    min-height: 0px;

  }

}

/*--------------------------------------------------------------



# etc



--------------------------------------------------------------*/

.btn-lg {

  border-radius: 5px;

}

.btn-secondary {

  background: #A2A2A2;

}

.btn-yellow {

  background: #f9e001;

  color: #392020 !important;

}

.btn-yellow:hover, .btn-yellow:active {

  background: #F1E78B;

  color: #392020 !important;

}

.btn-dark {

  background: #272727;

  color: #fff !important;

}

.btn-dark:hover, .btn-dark:active {

  background: #464646;

  color: #fff !important;

}



.btn-green {

  background:var(--thm-clr1);

  color: #fff !important;

}

.btn-green:hover, .btn-green:active {

  background: var(--thm-clr2);

  color: #fff !important;

}



.btn-grey {

  background: #A2A2A2;

  color: #fff !important;

}

.btn-navy {

  background: #192d79;

  color: #fff;

}

.btn-navy:hover {

  background: #30407E;

  color: #fff;

}

.btn-blue {

  background: #254587;

  color: #fff;

}

.btn-blue:hover {

  background: #3F598D;

  color: #fff;

}

.btn-mblue {

  background: #4c68e3;

  color: #fff;

}

.btn-mblue:hover {

  background: #798CDF;

  color: #fff;

}

.btn-lblue {

  background: #4858d2;

  color: #fff;

}

.btn-lblue:hover {

  background: #6470CF;

}

.btn {

  border-radius: 0px;

}

input[type=text].form-control, input[type=password].form-control, textarea.form-control, .input-group .input-group-text, select.form-select {

  /*border:1px solid #707070;*/

  border-radius: 0px;

}

.bg-navy {

  background: #192d79;

}

.bg-blue {

  background: #254587;

}

.bg-rblue {

  background: #3261bb;

}

.bg-mblue {

  background: #4c68e3;

}

.bg-lblue {

  background: #4858d2;

}

.bg-sky {

  background: #4892f1;

}

.bg-lsky {

  background: #e6f2ff;

}

.text-navy {

  color: #192d79;

}

.text-blue {

  color: #254587;

}

.text-lblue {

  color: #4858d2;

}

.text-mblue {

  color: #4c68e3;

}