body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,form,fieldset,p,button,select{margin:0;padding:0}
img,fieldset{border:0;vertical-align:middle}
ul,ol,li,dl{list-style:none} 
table caption{display:none}
table{border-collapse:collapse} 
 

.gift-list-area * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6, th, td, table, input, button, select, textarea, sub {
    font-size: 1em;
}

fieldset, img {
    border: 0 none;
}

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

img[src$=".gif"], img[src$=".png"], img[src$=".jpg"] {
/*    image-rendering: -moz-crisp-edges;*/
/*    /* Firefox */*/
/*    image-rendering: -o-crisp-edges;*/
/*    /* Opera */*/
/*    image-rendering: -webkit-optimize-contrast;*/
/*    /* Webkit (non-standard naming) */*/
/*    image-rendering: crisp-edges;*/
/*    -ms-interpolation-mode: nearest-neighbor;*/
/*    /* IE (non-standard property) */*/
/*    transform: translateZ(0);*/
/*    backface-visibility: hidden;*/
}

.gift-list-area {
    margin-bottom: 100px;
}
.gift-list-area > ul {
    display: flex; flex-wrap: wrap;
	gap:20px; 
}

.gift-list-area > ul li {
    width: calc((100% - 40px) / 3);
}

.gift-list-area > ul > li span.disc {
	position:absolute;
	top:3px; right:3px; color:#fff; background-color:#FF0000;
	font-weight:bold;
	padding:5px 10px;
	z-index:9;
	border-radius: 16px
}

.gift-list-area > ul li a {
	padding:20px;
	display: block;
}

.gift-list-area > ul li:nth-child(3n) {
    margin-right: 0;
}

.gift-list-area > ul > li {
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
    border-radius: 16px;
    border: 1px solid #ddd;
    position: relative;
}

.gift-list-area > ul > li:hover {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
}

.gift-list-area > ul > li .thumbnail {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
	text-align:center;
}

.gift-list-area > ul > li .thumbnail img {
	width: auto;
	height: 100px;
}

.gift-list-area > ul > li .exh-txt {
    position: relative;
	text-align:center;
    padding: 20px 15px;
}

.gift-list-area > ul > li .exh-txt .subject {
    height: 25px;
    font-weight: 600;
    font-size: 16px;
    color: #333;
    line-height: 25px;

    display: block;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.inf-ord-add {
    margin: 10px 0 60px 0;;
    padding: 20px;
    background: #eee;
    border-radius: 5px;
    font-size: 14px;
	color:#636363;
	font-weight:600
}

.inf-ord-add p {
	margin-bottom:5px;
}

.inf-ord-add p::before {
  content: "กค";
  margin: 0 8px;
  color: #999;
}

/*view*/
.gift-view {
	display: flex;
	border-radius: 10px;
	border: 1px solid #ddd;
	align-items: center;
	flex: 1;
    height: 280px;
	background:#F5F7F8;
	position:relative;
}
 
.gift-view .disc {
	position: absolute;
	top: 3px;
	left: 3px;
	color: #fff;
	background-color: #FF0000;
	font-weight: bold;
	padding: 5px 10px;
	z-index: 9;
	border-radius: 10px;
}
 
.gift-view .title_img {
	width: 300px;
    height: 100%;
	border-right: 1px solid #ddd;
	display: flex;
	justify-content: center;    
	align-items: center;        
}
 
.gift-view .title_img img {
	width: 85%; 
}
 
.gift-view .title_info {
	padding:0 30px;
    height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.gift-view .gift-txt p.subject {
	margin:40px 0 0 0;
	font-size:20px;
	font-weight:bold;
	color:#111;
}
.gift-view .gift-txt p.sub {
	margin:20px 0 0;
	font-size:15px;
	font-weight:bold;
	color:3000;
	line-height:28px;
	color:#70706C;
}
 
.gift-btn {
	margin:30px 0;
	text-align: left;
}
.gift-btn button {
	border-radius: 10px;
    display: inline-block;
    font-weight: 600;
    font-size: 16px;
    vertical-align: middle;
    padding: 12px 30px;
	cursor: pointer;
}

.gift-btn .list {
    color:#277fe8 !important;
    background: #fff;
	border:1px solid #277fe8;;
	margin-right:5px;
}
.gift-btn .buy {
    color: #fff !important;
    background: #277fe8;
    background: linear-gradient(to bottom, #64a6ff, #277fe8);
	border:none;
}

/*pop*/
.popup{margin: 0 auto;position:relative;width:100%; min-width:430px;  overflow:hidden; }
.popup_div { margin:0 auto;;position: relative;}
.ftbl{ margin:0 auto;width:100%; border-top:1px solid #000;}
.ftbl th{ height:33px;line-height:33px;border-bottom:1px solid #e4e8f0;text-align:center;padding:0px 17px;background:#F8F8F8;}
.ftbl td{border-bottom:1px solid #e4e8f0;font-weight:bold;text-align:center;line-height:43px; padding:0px 17px;color:#3d3d3d;text-align:center; }
.ftbl td:nth-child(2) {text-align:right;} 
.info_area { padding:10px; }
.info_area h3 { font-size:16px; }
.info_area ul { color:#000; display:flex; justify-content: space-between; }
.info_area ul li p.right {padding-top:10px;font-weight:bold; color:#000; font-size:14px; margin-bottom:5px;}
.info_area ul li p.right .price {color:#D40F00; font-weight:900; margin-right:2px; }
p.top {padding-top:10px;font-weight:bold; color:#000; font-size:18px; margin-bottom:5px;margin-top:20px;}
.giftBuyBtn {display:flex;gap:5px;height: 28px;}
.btnAdd {border-radius: 4px;border: solid 1px #467fe1;background-color: #fff;color: #467fe1; cursor:pointer; width: 30px; }
.btnMinus {border-radius: 4px;border: solid 1px #ff6633;background-color: #fff;color: #ff6633; cursor:pointer; width: 30px; }
.inptxt {border: 1px solid #e7e7e7;width: 70px;font-size: 13px;padding: 0 10px;text-align:center;}
.price { margin-right:5px;}
.infoTxt {font-weight:bold; color:#3d3d3d; margin-top:10px;background:#DCEDFF; border:1px solid #e4e8f0;padding:10px;}
.infoTxt .noti {margin-top:10px; color:red;}
.infoTxt .infoBtm {margin-top:10px; color:#2162C6;}

.loading-modal{
    position: fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,0.5);
    display:none;
    z-index:9999;
}

.loading-box{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    text-align:center;
    color:#fff;
}

.spinner{
    width:50px;
    height:50px;
    border:5px solid #ccc;
    border-top:5px solid #3498db;
    border-radius:50%;
    animation:spin 1s linear infinite;
    margin:0 auto 10px;
}

@keyframes spin{
    0%{ transform:rotate(0deg); }
    100%{ transform:rotate(360deg); }
}

p.top span.disc {
	color:#fff;
	background-color:#FF0000;
	padding:2px 7px;
	border-radius: 5px
}

span.discPrice {
	color:#FF0000;
	text-decoration: line-through;
}
img.discImg{
	margin:0 5px;
}
.copyBnt{
    padding: 0px 8px;
    border-radius: 2px;
    border: 1px solid #4854c6;
    background: #4854c6;
    color: #fff !important;
    font-size: 12px;
    height: 20px;
    line-height: 20px;
	cursor:pointer;
}
.gift-infoTxt {font-weight:bold; margin-top:10px;background:#DCEDFF; border:1px solid #e4e8f0;padding:10px;border-top: 1px solid #000;}
.gift-infoTxt .infoBtm {margin-top:10px; color:#3d3d3d;}
.gift-infoTxt .infoBtm p {text-indent: -1em;padding-left: 1em;}
.gift-infoTxt .infoBtm p::before {content: "- ";}

.gift-infoImg {margin:30px 0 50px;}

.partnerArea {background-color:#E6EDFB;padding:0 35px 80px;}
.partnerList {display:flex;flex-wrap: wrap;justify-content: flex-start;gap: 10px;}
.partnerList li {width: calc(20% - 10px);height:145px;text-align: center;background-color:#F8FAFE;border-radius:10px;border:1px solid #F8FAFE;cursor:pointer}
.partnerList li a {display: inline-block;width: 100%;height: 100%;text-align: center;}
.partnerList li:hover {border:1px solid #507FE5;}
.partnerList li .partnerImg {width: 80px;height: 80px;border-radius: 50%;overflow: hidden;margin: 10px auto 10px;padding: 3px;background: linear-gradient(45deg, #E6EDFB, #509BE7);}
.partnerList li .partnerImg img {width: 100%;height: 100%;object-fit: cover;border-radius: 50%;}
.partnerList li .partnerName {font-size:14px;font-weight:bold;color:#507FE5}