/*---common css---*/

:root {
	/*color*/
	--color-base: #000;
	--color-gray: #777;
	--color-base2: #333;
	--color-base3: #999;
	--color-red: #e60019;
	--color-kakao-text: #442f01;
	--color-naver: #00c13a;
	--color-foot: #666;

	/*font-size*/
	--font-size-14: 0.875rem;
	--font-size-15: 0.938rem;
	--font-size-16: 1rem; 
	--font-size-17: 1.0625rem; 
	--font-size-18: 1.125rem;
	--font-size-20: 1.25rem; 
	--font-size-22: 1.375rem; 
	--font-size-25: 1.563rem; 
	--font-size-26: 1.625rem;
	--font-size-27: 1.688rem; 
	--font-size-28: 1.75rem; 
	--font-size-32: 2rem; 
	--font-size-35: 2.188rem; 
	--font-size-42: 2.625rem; 
	--font-size-80: 5rem;




	/*font-weight*/
	--font-r: 400;
	--font-m: 500;
	--font-sb: 600;
	--font-b: bold;
	--font-eb: 800;
	--font-bl: 900;
}

/*font size*/
.fs_14{font-size: var(--font-size-14);}
.fs_16{font-size: var(--font-size-16);} 
.fs_17{font-size: var(--font-size-17);} 
.fs_18{font-size: var(--font-size-18);}
.fs_20{font-size: var(--font-size-20);} 
.fs_22{font-size: var(--font-size-22);} 
.fs_25{font-size: var(--font-size-25);} 
.fs_26{font-size: var(--font-size-26);}
.fs_27{font-size: var(--font-size-27);} 
.fs_28{font-size: var(--font-size-28);} 
.fs_32{font-size: var(--font-size-32);}
.fs_35{font-size: var(--font-size-35);}
.fs_42{font-size: var(--font-size-42);}
.fs_80{font-size: var(--font-size-80);}


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

}

@media screen and (max-width:767px){
.fs_18 {font-size:12px;}
.fs_25 {font-size:14px;}
.fs_42 {font-size:21px;}
}


/*color*/

.fc_77 {color: var(--color-gray);}
.fc_33 {color: var(--color-base2);}
.fc_99 {color: var(--color-base3);}
.fc_red {color: var(--color-red);}
.fc_66  {color: var(--color-foot);}


/*font weight*/
.font_r{font-weight: var(--font-r);}
.font_m{font-weight: var(--font-m);}
.font_sb{font-weight: var(--font-sb);}
.font_b{font-weight: var(--font-b);}
.font_eb{font-weight: var(--font-eb);}
.font_bl{font-weight: var(--font-bl);}

/*text-motion*/

.j_motion.common_motion{transform: translateY(25px);opacity: 0;transition: transform .8s ease, opacity .4s;}
.j_motion.common_motion.on {transform: translateY(0);opacity: 1;}

.j_delay_01{transition-delay: .2s !important;}
.j_delay_02{transition-delay: .4s !important;}
.j_delay_03{transition-delay: .6s !important;}
.j_delay_04{transition-delay: .8s !important;}
.j_delay_05{transition-delay: 1s !important;}
.j_delay_06{transition-delay: 1.2s !important;}
.j_delay_07{transition-delay: 1.4s !important;}
.j_delay_08{transition-delay: 1.6s !important;}
.j_delay_09{transition-delay: 1.8s !important;}
.j_delay_10{transition-delay: 2s !important;}
.j_delay_11{transition-delay: 2.2s !important;}


/*margin-top*/
.mt_10 {margin-top:10px;}
.mt_13 {margin-top:13px;}
.mt_20 {margin-top:20px;}
.mt_22 {margin-top:22px;}
.mt_25 {margin-top:25px;}
.mt_26 {margin-top:26px;}
.mt_28 {margin-top:28px;}
.mt_30 {margin-top:30px;}
.mt_33 {margin-top:30px;}
.mt_38 {margin-top:38px;}
.mt_42 {margin-top:42px;}
.mt_45 {margin-top:45px;}
.mt_50 {margin-top:50px;}
.mt_80 {margin-top:80px;}
.mt_86 {margin-top:86px;}

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

}

@media screen and (max-width:1020px){
.mt_86 {margin-top:50px;}
}


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

.mt_26 {margin-top:13px;}
.mt_28 {margin-top:14px;}
.mt_30 {margin-top:15px;}
.mt_33 {margin-top:16px;}
.mt_50 {margin-top:25px;}
.mt_86 {margin-top:23px;}
}



/*paddin*/
.pt_0 {padding-top:0 !important;}

/*---header---*/

#j_header {width:100%; position:fixed; padding:47px 0 30px 0; transition:0.28s; left:0; top:0; z-index:99; background:#fff;}
#j_header.active {top:-100px;}  
.j_hd_con {max-width:1400px; width:96%; margin:0 auto;}


/*--- hd_top ---*/
.hd_top {display:flex; justify-content:space-between; align-items:center;}

/*검색*/
.hd_search_box {max-width: 471px; height: 45px; border-radius: 22.5px; border: 1px solid #dddddd; width: 100%; position: relative; padding: 12px 18px;}
.j_hd_sch {width:100%; border:none; outline:none;}
.j_hd_sch:focus{outline:none;}
.j_hd_sch::placeholder {font-size:15px; color:#cccccc; font-weight:500;}
.hd_sch_btn {position: absolute; right: 18px; top: 50%; transform: translateY(-50%);}

/*유틸 링크*/
.util_box > ul {display:flex;}
.util_box > ul > li + li {margin-left:20px;}
.util_box > ul > li a {font-size:16px; font-weight:500; color:#777;}

/*--- hd_bottom ---*/

.hd_bottom {display:flex; justify-content:space-between; align-items:center; margin-top:35px;}
.hd_cate_box {width:140px; position:relative;}
.hd_cate_box .burger_wrap {display:flex; justify-content: space-between; align-items:center; font-size:1.188rem; font-weight:700; transition:all 0.28s;}
.hd_cate_box .burger_wrap:hover {color:#0054ff;}
.hd_cate_box .burger_btn {position:relative; display:block; width:22px; height:23px;margin-right: 10px;}
.hd_cate_box .burger_btn i {display:block; position:absolute; width:100%; height:2px; background:#111111; top:50%; transform:translateY(-50%);}
.hd_cate_box .burger_btn i:nth-of-type(1) {transform:translateY(6px);}
.hd_cate_box .burger_btn i:nth-of-type(3) {transform:translateY(-8px);}

/*j_gnb*/

.hd_bottom > .j_gnb {display:flex;}
.hd_bottom > .j_gnb > li {margin:0 41px;}
.hd_bottom > .j_gnb > li > a {display:block; font-size:1.188rem; font-weight:700; transition:all 0.28s;}
.hd_bottom > .j_gnb > li > a:hover {color:#0054ff;}
.hd_bottom > .j_gnb > li:first-child {margin-left:0;}
.hd_bottom > .j_gnb > li > ul {display:none;}

/*hd_mymenu*/

.hd_mymenu ul {display:flex; align-items:center;}
.hd_mymenu ul li + li {margin-left:30px;}


/*all_side_menu*/
.all_side_menu {position:absolute; width: 230px; top:270%; padding:15px; background:#fff; border-radius:10px; display:none; z-index:50; box-shadow: 0px 10px 24px 0px rgba(0, 0, 0, 0.11);}
.all_side_menu > .j_gnb > li.active > a {color:#0054ff;}
.all_side_menu > .j_gnb > li > a {font-size:1.25rem; font-weight:700; padding:15px 0; display:block; width:100%; transition:0.28s;}
.all_side_menu > .j_gnb > li:hover > a {color:#0054ff;}
.all_side_menu > .j_gnb > li > .depth02 > li > a {font-size:16px; color:#ccc; font-weight:500; padding:10px 0; display:block; transition:0.28s;}
.all_side_menu > .j_gnb > li > .depth02 > li > a:hover {color:#0054ff;}
.all_side_menu > .j_gnb > li > .depth02 {display:none;} 


@media screen and (max-width:1020px){
.hd_top .util_box {display:none;}
.hd_bottom > .j_gnb > li {margin:0 20px;}
}

@media screen and (max-width:767px){
#j_header {padding:27px 0 15px 0;}
#j_header.active {top: -75px;}
.hd_search_box {max-width:180px;}
.hd_bottom  {margin-top:15px;}
.hd_bottom > .j_gnb {display:none;}
.hd_logo img {width:70%;}
.all_side_menu {width:180px;}
}



/*---main_visual ---*/
#main_visual {margin-top:188px;}
.main_swip .mv .j_bg {width:100%; height:610px; position:relative; .1.3}
.main_swip .mv .j_bg.j_bg01 {background:url('../img/main/mv_img01.jpg') no-repeat center / cover; }
.mv_txt {position:absolute; top:50%; transform:translateY(-50%);}
.mv_txt h2 {line-height:1.3em;}
.mv_txt h3 {color:#333; line-height:1.3em;}
.mv_txt h4 {color:#666; line-height:1.3em;}
.main_page_box {left:50%; bottom:38px; width:170px; height:40px; line-height:40px; position:absolute; z-index:15; display:flex; align-items:center;}

.main_page_box .num_box {height:100%; width:100%; position:relative;}
.main_page_box .mv_more_box {height:100%; margin-right:10px;}
.swiper-pagination.page_num {position:unset; width:100%; max-width:120px; height:100%; background:rgba(0, 0, 0, 0.3); border-radius:20px;     display: flex; align-items: center; text-align: center; justify-content: center;}
.swiper-pagination.page_num span {display:block; color:#fff; font-size:1.063rem; font-weight:700; }

.swiper-pagination.page_num span.mainLine {width:1px; height:8px; background:rgba(255, 255, 255, 0.45); }
.swiper-pagination.page_num .swiper-pagination-current {margin-right:12px;}
.swiper-pagination.page_num .swiper-pagination-total{margin-left:12px;}


.swiper-button-next.main_next {right:17px;}
.swiper-button-next.main_prev {left:17px;}

.mv_txt h2 {translateY(25px);opacity: 0;transition: transform 1s ease, opacity .6s;}
.mv_txt h3 {transform: translateY(25px);opacity: 0;transition: transform 1s ease, opacity .6s;}
.mv_txt h4 {transform: translateY(25px);opacity: 0;transition: transform 1s ease, opacity .6s;}

.mv.on .mv_txt h2 {transform: translateY(0);opacity: 1;}
.mv.on .mv_txt h3 {transform: translateY(0);opacity: 1;}
.mv.on .mv_txt h4  {transform: translateY(0);opacity: 1;}




.main_next {
  background: url(../img/icon/next_btn.png) no-repeat center / cover;
  width:6px;
  height:10px;
}

.main_prev {
  background: url(../img/icon/prev_btn.png)  no-repeat center / cover;
  width:6px;
  height:10px;
}
.swiper-button-next.main_next, .swiper-button-prev.main_prev {top:92%;}


.swiper-button-next::after,
.swiper-button-prev::after {
  display: none;
}


@media screen and (max-width:767px){
	#main_visual {margin-top:130px;}
	.main_page_box {left:15px; bottom:18px;}
	.main_swip .mv .j_bg {height:310px;}
	.main_page_box {width:115px; height:25px;}
	.swiper-button-next.main_next {right:11px;}
	.swiper-button-next.main_prev {left:11px;}
	.main_page_box .mv_more_box {height:auto; margin-right:5px; }
	.swiper-button-next.main_next, .swiper-button-prev.main_prev {top:117%;} 
	.swiper-pagination.page_num .swiper-pagination-current {margin-right:8px;}
	.swiper-pagination.page_num .swiper-pagination-total{margin-left:8px;}
}



/*common*/

.section_wrap {display:flex;}
#main_wrap {width:calc(100% - 343px); margin-right:43px;}
#sticky_box {width:343px; position:relative;}
.disc_p {text-decoration:line-through}
.prod_p {margin:0 8px;}
.section_loop {display:flex; display: flex; justify-content: space-between;  align-items: flex-end; padding-top:20px;}
.section80 {padding:80px 0;}
.section170 {padding:170px 0;}
.loop_rt i{margin-left:10px;}
.banner_section {margin-bottom:102px;}
.banner_section figure {border-radius:10px; overflow:hidden;}


@media screen and (max-width:767px){
.sale_p {font-size:15px;}
.prod_p {margin:0 4px;}
.disc_p {font-size:12px;}
}



/*sticky*/

#sticky_box {text-align:center;}
.sticky_content {position:absolute; top:170px; z-index:20;}
.sticky_list {display:flex; justify-content: space-around;}
.stick_util_box {max-width:300px;}
.stick_util_box a {display:block; width:100%; text-align:center;    border-radius: 5px; overflow: hidden;}
.j_login_btn {color:#fff; background:#000; border-radius:5px; height:60px; line-height:60px;}
.j_res_btn {color:#000; background:#fff; border:1px solid #000; border-radius:5px; height:60px; line-height:60px;}

@media screen and (max-width:1480px){
	.section170 {padding:100px 0;}
	.sticky_content {width:250px;}
	#main_wrap {width:calc(100% - 293px); margin-right:43px;}
}

@media screen and (max-width:1480px){
	#main_wrap {width:calc(100% - 273px); margin-right:23px;}
}

@media screen and (max-width:1360px){
	.sticky_content {width:215px;}
	#main_wrap {width:calc(100% - 238px); margin-right:23px;}
}
@media screen and (max-width:1320px){
	.sticky_content {display:none;}
	#main_wrap {width:100%; margin-right:0;}
}

@media screen and (max-width:1020px){
.banner_section {margin-bottom:50px;}
}


@media screen and (max-width:767px){
.section170 {padding:80px 0;}
.section80 {padding:40px 0;}
}


/*section01*/
.main_sec01 {overflow:hidden;}
.swiper.sec01_swip {position:relative; overflow:visible !important;}
.sec01_page  {bottom:-63px !important;}
.sec01_page .swiper-pagination-bullet {color:#d6d6d6;}
.sec01_page .swiper-pagination-bullet-active {background:#000;}
.prod_txt h3 {overflow:hidden; white-space:nowrap; text-overflow: ellipsis; max-width:202px;}



@media screen and (max-width:1320px){
	.sec01_swip .swiper-slide figure img {width:100%;}
}

@media screen and (max-width:1320px){
	.sec01_page {bottom: -35px !important;}
}




/*section02*/
.main_sec02 {background:#e9e7e6; padding:102px 42px 102px 0; position:relative}
.main_sec02::before {position:absolute; left:-100%; top:0; width:100%; height:100%; background:#e9e7e6; content:'';}
.sec02_desc p {line-height:1.6em;}
.sec02_list {display:flex;}
.sec02_time h2{display:flex; align-items:center;}
.sec02_time h2 i:nth-of-type(2) {margin-left:10px;}
.sec02_time a {display:flex; align-items:center;}
.sec02_time a i {margin-left:10px;}

.sec02_rt_list {display:flex;}
.sec02_lt {width:317px;}
.sec02_rt {width:calc(100% - 317px); background:#fff; border-radius:10px; padding:45px 53px; box-sizing:border-box;}
.sec02_rt_list {align-items:center;}
.sec02_rt_list li:nth-of-type(1) {width:281px;}
.sec02_rt_list li:nth-of-type(2) {width:calc(100% - 281px);}
.buy_btn {display:block; height:60px; width:100%; border-radius:5px; background:#333333; color:#fff; text-align:center; line-height:60px; max-width:311px;}


@media screen and (max-width:1020px){
.main_sec02 {padding:50px;}
.sec02_list {flex-wrap:wrap;}
.sec02_lt {width:100%; text-align:center;}
.sec02_time h2 { display: flex; align-items: center;  justify-content: center; }
.sec02_time a {justify-content: center;}
.sec02_rt {width:100%; margin-top:20px; padding:20px;}

}


@media screen and (max-width:767px){
	.main_sec02 {padding:40px 20px;}
	.sec02_rt_list {flex-wrap:wrap;}
	.sec02_rt_list li:nth-of-type(1) {width:100%;}
	.sec02_rt_list li:nth-of-type(2) {width:100%;}
	.prod_txt {text-align:center;}
	.prod_img figure {text-align:center;}
	.prod_txt h3 {margin: 10px auto 0 auto;}
	.buy_btn {margin: 10px auto 0 auto;}
	.sec02_time a i {margin-left:5px;}
	.sec02_time a i img {width:80%;}

}


/*sec03*/

.main_sec03 {overflow:hidden;}
.swiper.sec03_swip {position:relative; overflow:visible !important;}
.sec03_page {bottom:-63px !important;}
.sec03_page .swiper-pagination-bullet {color:#d6d6d6;}
.sec03_page .swiper-pagination-bullet-active {background:#000;}

@media screen and (max-width:1320px){
	.sec03_swip .swiper-slide figure img {width:100%;}
}


/*sec04*/
.swiper.sec04_swip {padding-bottom:38px; overflow:visible;}
.sec04_list {display:flex; position:relative;}
.sec04_list::after {position:absolute; left:-100%; top:0; width:151%; height:91%; background:#fff; content:''; z-index:2}
.sec04_list::before {position:absolute; right:-100%; top:0; width:100%; height:100%; background:#fff; content:''; z-index:2}
.sec04_list li:nth-of-type(1) {width:540px; overflow: hidden; z-index:20; margin-right:25px;}
.sec04_list li:nth-of-type(2) {max-width:516px; width:calc(100% - 540px);}
.sec04_list li figure{position:relative;}
.sec04_desc_box {position:absolute; bottom:40px; left:45px; color:#fff; z-index:20;}
.sec04_page {bottom:0px !important; left:-50% !important;}
.sec04_page .swiper-pagination-bullet {color:#d6d6d6;}
.sec04_page .swiper-pagination-bullet-active {background:#000;}



@media screen and (max-width:1080px){
	.sec04_list {flex-wrap:wrap;}
	.sec04_list li:nth-of-type(1) {width:100%;}
	.sec04_list li:nth-of-type(2) {width:100%; margin-top: 20px;}
	.sec04_page {left:-43% !important;}
	.swiper.sec04_swip {padding-bottom:25px;}
	.sec04_list::after {width:100%;}
}

@media screen and (max-width:767px){
	.sec04_page {left:0% !important;}
}


/*sec05*/

.sec05_lsit {display:flex;}
.sec05_lsit > li {width: calc((100% - 25px*2)/3); margin-right:25px; background:#f8f8f8; padding-top:40px; border-radius:15px; overflow:hidden;  transition: 0.28s;}
.sec05_lsit > li:last-child {margin-right:0;}
.sec05_lsit > li:hover {background:#e9e7e6;}
.sec05_tp h2 {text-align:center;}
.sec05_tp figure img {width:100%;}
.sec05_md > ul > li {display:flex; align-items:center;}

.sec05_md > ul > li + li {margin-top:10px;}
.sec05_md > ul > li figure {margin-right:25px; border-radius:15px; overflow:hidden;}
.sec05_md > ul > li p {margin-top:20px;}
.sec05_md {padding:15px 20px; box-sizing:border-box;}
.sec05_desc h4 {display:block; text-overflow: ellipsis; white-space:nowrap; overflow:hidden; max-width:164px;}
.sec05_bt {color:#fff; background:#333333; width:100%;}
.sec05_bt a.more_btn {width:100%; text-align:center; padding:14px; display:flex; align-items:center; justify-content:center;}
.sec05_bt a.more_btn i {margin-left:10px;}

@media screen and (max-width:1080px){
	.sec05_lsit {flex-wrap:wrap;}
	.sec05_lsit > li {width:100%; margin-right:0; max-width:500px; margin:0 auto;}
	.sec05_lsit > li + li {margin-top:20px;}
	.sec05_lsit > li:last-child {margin-right:auto;}
}

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




/*sec06*/
.main_sec06 {overflow:hidden;}
.swiper.sec06_swip {position:relative; overflow:visible !important;}
.sec06_page {bottom:-63px !important;}
.sec06_page .swiper-pagination-bullet {color:#d6d6d6;}
.sec06_page .swiper-pagination-bullet-active {background:#000;}


/*banner_section02*/

.banner_section02 ul {display:flex; justify-content: space-between;}
.banner_section02 ul li {border-radius:10px;overflow:hidden; }
.banner_section02 ul li #main_bn {border-radius:10px;overflow:hidden;}
.banner_section02 ul li:nth-of-type(1) {width:655px; }
.banner_section02 ul li:nth-of-type(2) {width:calc(100% - 670px);}




/*sec07*/
.main_sec07 {padding:80px 0; background:#eae1dc; position:relative;}
.main_sec07:after {position:absolute; left:-100%; background:#eae1dc; width:100%; top:0; height:100%; content:'';} 
.tab_wrap {display:flex; padding: 0 20px; box-sizing: border-box;}
.sec07_lt {width:233px; padding-top:40px;}
.sec07_rt {width:calc(100% - 233px);}

.sec07_tit h2 {line-height:1.2em;}

.tab_list {display:flex; flex-wrap:wrap; width:100%;}
.tab_list li {width:calc((100% - 34px*2)/3); margin-right:34px;}
.tab_list li:nth-of-type(3n){margin-right:0;}
.tab_list li:nth-of-type(n + 4) {margin-top:34px;}

.tabs li a {width:108px; height:44px; background:#fff; border: 1px solid #999999; border-radius:22px; text-align:center; line-height:44px; cursor:pointer; display:block;}
.tabs li.current a {background:#000; color:#fff; border:1px solid #000;}
.tabs li + li {margin-top:16px;}
.tab_list li figure {position:relative;}
.tab_list li:hover .hover_cart{opacity:1;}


.tab-content {display:none;}
.tab-content.current {display:block;}

.tab_list > li figure {border-radius:5px; overflow:hidden;}
.tab_list > li figure img {width:100%;}


/*상품 진열 리스트 */
.tab_list.sub_list {padding:20px 0;}
.tab_list.sub_list li {width:calc((100% - 34px*3)/4); margin-right:34px;}
.tab_list.sub_list li:nth-of-type(4n){margin-right:0;}
.tab_list.sub_list li:nth-of-type(n + 4) {margin-top:0px;}
.tab_list.sub_list li:nth-of-type(n + 5) {margin-top:34px;}





@media screen and (max-width:1080px){
.tab_list li {width:calc((100% - 20px*2)/3); margin-right:20px;}
.tab_list li:nth-of-type(n + 4) {margin-top:20px;}
.sec07_lt {padding-top:20px;}

.tab_list.sub_list li {width:calc((100% - 34px)/2); margin-right:34px;}
.tab_list.sub_list li:nth-of-type(2n){margin-right:0;}
.tab_list.sub_list li:nth-of-type(n + 3) {margin-top:34px;}


}

@media screen and (max-width:940px){
	.tab_list li {width:calc((100% - 20px)/2); margin-right:20px;}
	.tab_list li:nth-of-type(3n) {margin-right:20px;}
	.tab_list li:nth-of-type(2n) {margin-right:0;}
	.tab_list li:nth-of-type(n + 4) {margin-top:20px;}
}
@media screen and (max-width:767px){
	.tab_list li {width:calc((100% - 10px)/2); margin-right:10px;}
	.tab_list li:nth-of-type(2n) {margin-right:0px;}
	.tab_list li:nth-of-type(n + 3) {margin-top:10px;}
	.tab_list li:nth-of-type(3n) {margin-right:10px;}
	.tab_list li:nth-of-type(6) {margin-right:0px;}
	.tab_wrap {flex-wrap:wrap;}
	.sec07_lt {width:100%;}
	.sec07_rt {width:100%; margin-top:20px;}
	.sec07_tit {text-align:center;}
	.tabs {display:flex;     justify-content: space-between; flex-wrap:wrap; gap:10px;}
	.tabs li + li {margin-top:0;}
	.tabs li a {width:94px;}
	.main_sec07 {padding:40px 0;}
}
@media screen and (max-width:500px){
	.tabs{justify-content: flex-start;}
}


/*sec08*/

.main_sec08 {overflow:hidden;}
.swiper.sec08_swip {position:relative; overflow:visible !important;}
.sec08_page {bottom:-63px !important;}
.sec08_page .swiper-pagination-bullet {color:#d6d6d6;}
.sec08_page .swiper-pagination-bullet-active {background:#000;}


/*sec09*/
.main_sec09 {padding-bottom:90px;}
.insta_list {display:flex;}
.insta_list li {width:calc((100% - 27px*3)/3);margin-right:27px;}
.insta_list li:nth-of-type(4n) {margin-right:0;}

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

}
@media screen and (max-width:767px){
.insta_list {flex-wrap:wrap;}
.insta_list li figure img {width:100%;}
.insta_list li {width:calc((100% - 20px)/2);margin-right:20px;}
.insta_list li:nth-of-type(2n) {margin-right:0;}
.insta_list li:nth-of-type(n + 3) {margin-top:20px;}
}


/*footer*/
.j_footer {background:#000; box-sizing:border-box;}
.ft_top {background:#212121; width:100%; padding:24.5px 0;}
.ft_top_box {display:flex;justify-content: space-between; align-items: center;}
.info_list {display:flex;}
.info_list li {position:relative;}
.info_list li:after {content:''; width:1px; height:12px; background:#999; position:absolute; left:-50px; top:50%; transform:translateY(-50%);}
.info_list li:first-child:after {display:none;}
.info_list li + li {margin-left:96px;}

.ft_tp_rt {display:flex;  align-items: center;}

.social_list {display:flex; align-items:center; }
.social_list li + li {margin-left:25px;}
.family_box {margin-left:34px; position:relative;}
.family_box > a {display:block; width:160px; height:34px; line-height:34px; text-align:center; border-radius:17px; border:1px solid #666;}
.family_box > a > i {margin-left:12px;}
.family_list {display:none; position:absolute; top:120%; text-align:center; width:100%; background:#fff; border-radius: 12px;} 
.family_list > li > a {display:block; padding:10px 0;}

.ft_bt {padding:40px 0;}
.ft_bottom_box {display:flex; justify-content: space-between;}

.ft_bt_lt {line-height:1.6em;}
.ft_bt_lt p i {position:relative;}
.ft_bt_lt p i + i {margin-left:23px;}
.ft_bt_lt p i:after {content:''; position:absolute; background:#7e7e7e; width:1px; height:16px; top:50%; transform:translateY(-50%); left:-16px;}
.ft_bt_lt p i.after_n:after {display:none;}
.ft_bt_rt h3 {text-align:right;}
.ft_bt_rt p {text-align:right;}


@media screen and (max-width:960px){
.ft_top_box {flex-wrap:wrap;}
.ft_tp_lt {width:100%;}
.info_list {justify-content: center;}
.ft_tp_rt {width:100%; justify-content: center; margin-top:20px;} 
.info_list li + li {margin-left:55px;}
.info_list li:after {display:none;}
}
@media screen and (max-width:767px){
.ft_bt_lt p i:after {display:none;}
}

.swiper-slide figure {position:relative;}
.swiper-slide figure:hover .hover_cart{opacity:1;}
.prod_img figure {position:relative; margin-right:38px;}
.prod_img figure img {width:100%;}
.prod_img figure:hover .hover_cart{opacity:1;} 
.hover_cart {position:absolute; bottom:20px; right:20px; opacity:0; transition:0.28s; }


@media screen and (max-width:767px){
	
.prod_img figure {margin-right:0;}
}




.j_sub_section {max-width:1400px; margin:0 auto; padding:188px 0; width:92%;}
.j_sub_section02 {max-width:700px; margin:0 auto; padding:188px 0 100px 0; width:92%;}


@media screen and (max-width:767px){
.j_sub_section {padding:150px 0; }
.j_sub_section02 {padding:120px 0 80px 0; }

}


/*로그인 페이지*/

/*로그인, 회원가입 - 로그인*/
.mbWrap{padding: 80px 0;}
.mbInner{width: 92%;max-width: 400px;margin: 0 auto;}
.regInner{width: 92%;max-width: 640px;margin: 0 auto;}
.mbTitle{font-size: 2.25rem;font-weight: 700;text-align: center;margin-bottom: 40px;}

.comInput{font-size: .9375rem;line-height: 50px;border: 1px solid #dbdbdb;padding: 0 15px;font-weight: 400;border-radius: 5px;outline: none;overflow: hidden;}
.comInput:focus{outline: none;}
.comInput::placeholder{color: #999;font-size: .9375rem;}
.comInput_w100{display: block;width: 100%;}

.mbSave{display: flex;align-items: center;justify-content: space-between;font-size: .875rem;font-weight: 400;}

.mbCheck{position: relative;}
.mbCheck input[type=checkbox] + label{display: flex;align-items: center;gap: 8px;cursor: pointer;}
.mbCheck input[type=checkbox] + label span{width: 20px;height: 20px;border: 1px solid #dbdbdb;background: #FFF;}
.mbCheck input[type=checkbox]:checked + label span{background: url(/img/chk.png) no-repeat 50% 50% #222;border-color: #000;}

.mb_btnBox{margin-top: 20px;}
.mbBtn{display: block;width: 100%;text-align: center;line-height: 50px;border: 1px solid #ccc;border-radius: 5px;font-weight: 400;color: #888;font-size: .9375rem;overflow: hidden;}
.mbBtn_01{background: #000;border-color: #000;color: #FFF;font-weight: 600;}

@media screen and (max-width: 720px){ 
	
	.mbWrap{padding: 60px 0;}

	.mbTitle{margin-bottom: 30px;}

	.comInput{line-height: 45px;padding: 0 13px;font-size: 13px;}

	.mbSave, .mbBtn{font-size: 13px;}
	.mbBtn{line-height: 45px;}
}

/*로그인, 회원가입 - 회원가입 약관*/
.regNavi{display: flex;align-items: center;justify-content: center;gap: 24px;margin-bottom: 40px;}
.regNavi li{font-size: .9375rem;font-weight: 600;color: #979797;position: relative;}
.regNavi li.on{color: #000;}
.regNavi li::after{content: "\e93f";font-family: xeicon!important;position: absolute;top: -1px;left: calc( 100% + 3px );z-index: 1;font-size: 1.13rem;}
.regNavi li:last-child::after{display: none;}

.mbInfobox{padding: 20px;background: #f4f4f4;border-radius: 5px;overflow: hidden;}

.regTerms{margin-top: 35px;}
.regTerms>h4{font-size: 1.13rem;font-weight: bold;padding-bottom: 13px;margin-bottom: 15px;border-bottom: 2px solid #000;}
.regTerms .mbCheck{font-size: .875rem;font-weight: 400;margin-bottom: 15px;}
#fregister textarea{border: 1px solid #dbdbdb;background: #FFF;font-size: .875rem;padding: 20px 5%;font-weight: 400;outline: none;resize: vertical;}

.regTable, .regTable th, .regTable td{font-size: .875rem !important;font-weight: 400;}
.regTable th{font-weight: 500;background: #f4f4f4;}
.regTable td{padding: 13px 15px;border-color: #dbdbdb;}
.regTable .regTcolor td{background: #f9f9f9;font-weight: 500;}

.mb_flexBox{display: flex;align-items: center;justify-content: center;gap: 5px;}

@media screen and (max-width: 720px){ 
	
	.regNavi{margin-bottom: 25px;}

	.mbInfobox{padding: 15px;}
	
	.regTerms{margin-top: 30px;}
	.regTerms>h4{font-size: 16px;padding-bottom: 12px;margin-bottom: 14px;}
	.regTerms .mbCheck{font-size: 13px;margin-bottom: 14px;}
	#fregister textarea{height: 150px;font-size: 13px;}

	.regTable, .regTable th, .regTable td{font-size: 12px !important;}
}

/*로그인, 회원가입 - 정보입력*/
.regTerms>h4.regGen{display: flex;align-items: flex-end;justify-content: space-between;margin-bottom: 25px;}
.regGen span{font-size: .875rem;font-weight: 500;color: #979797;}
.regGen span i{color: #F00;}

.regBox li{margin-bottom: 20px;}
.regBox li:last-child{margin-bottom: 0;}

.regText{display: block;font-size: .9375rem;font-weight: 500;margin-bottom: 8px;}
.regText b{color: #F00;}

.regInfo, #captcha #captcha_info{display: block;font-size: .875rem;font-weight: 400;margin-top: 8px;color: #888;}

.regCheck label{font-size: .9375rem;}

@media screen and (max-width: 720px){ 
	
	.regGen span{font-size: 12px;}
	.regText, .regCheck label{font-size: 13px;}
	.regInfo, #captcha #captcha_info{font-size: 12px;}
}

/*로그인, 회원가입 - 회원가입완료*/
.regResult{text-align: center;}

.regResult h2{font-weight: 400;margin-bottom: 20px;}
.regResult h2 b{font-weight: 700;}
.regResult p{font-size: .875rem;font-weight: 400;line-height: 180%;border: 1px solid #dbdbdb;border-radius: 5px;overflow: hidden;padding: 33px 20px;}

/*비회원구매*/
.guestWrap{margin-top: 40px;}
.guestWrap p{font-size: .875rem;text-align: center;}
.guestWrap .mb_btnBox{margin-top: 10px;}

.mb_t10 {margin-top:10px;}


@media screen and (max-width: 720px){ 
	
	.guestWrap p{font-size: 13px;}
}

/*---mypage css---*/

/*common*/
.myWrap{width: 90%;max-width: 1400px;margin: 0 auto;padding: 50px 0;padding-top: 0;}

.nwBtn-wrap{display: flex;gap: 5px;}
.nwBtn{font-size: .875rem;border: 1px solid #ccc;background: #FFF;border-radius: 5px;overflow: hidden;padding: 8px 15px;font-weight: 500;color: #999;}
.nwBtn-1{background: #000;border-color: #000;color: #FFF;font-weight: 700;}

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

	.nwBtn-wrap a{flex: 1;text-align: center;}
	.nwBtn{padding: 10px 5px;font-size: 13px;}
}

/*-- mypage - profile --*/
.myProfile{display: flex;align-items: center;justify-content: space-between;padding: 28px;background-color: #F6F6F6;border-radius: 8px;overflow: hidden;}

.myName h4{font-size: 1.5rem;font-weight: 400;margin-bottom: 10px;}
.myName h4 b{font-weight: bold;}
.myName p{font-size: .875rem;font-weight: 400;margin-bottom: 25px;}

.myInfo{display: flex;justify-content: flex-end;width: 75%;}
.myInfo li{border-left: 1px solid #ddd;padding: 0 25px;}
.myInfo li h4{font-size: 1rem;font-weight: 600;margin-bottom: 18px;}
.myInfo li span{font-size: .9375rem;font-weight: 400;line-height: 150%;}

/*-- mypage - myList --*/
.myList{margin-top: 50px;}
.myList>h4{font-size: 1.5rem;font-weight: bold;margin-bottom: 15px;}

#sod_inquiry li:first-child{border-top-color: #000;}
#sod_inquiry li .idtime_link, #sod_inquiry li .inquiry_price{font-size: 1rem;}
#sod_inquiry li .inquiry_name{margin-top: 5px;}

#myWish{display: flex;gap: 10px;}
#myWish li{width: calc( ( 100% - 40px ) / 5 );}

.wish_img{margin-bottom: 15px;}
.wish_img img{display: block;width: 100%;height: auto;}
.wish_info a, .wish_info span{display: block;}
.wish_info a{font-weight: 600;margin-bottom: 5px;}
.wish_info span{font-weight: 400;color: #999;}

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

	.myProfile{display: block;}
	
	.myInfo{justify-content: flex-start;margin-top: 30px;}
	.myInfo li:first-child{border-left: none;padding-left: 0;}
	.myInfo li h4{margin-bottom: 13px;}
	.myInfo li span{white-space: nowrap;}
}

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

	.myList{margin-top: 30px;}
}

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

	.myProfile{padding: 22px;}

	.myInfo{display: block;margin-top: 20px;width: 100%;}
	.myInfo li{width: 100%;padding: 0;border-left: none;border-bottom: 1px solid #ddd;padding-bottom: 9px;margin-bottom: 12px;}
	.myInfo li:last-child{padding-bottom: 0;margin-bottom: 0;border-bottom: none;}
	.myInfo li h4{margin-bottom: 5px;}
}

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

	.myProfile{padding: 20px;}

	.myName h4{font-size: 20px;}
	.myName p{font-size: 13px;margin-bottom: 20px;}

	.myInfo li h4{font-size: 14px;}
	.myInfo li span{font-size: 13px;white-space: normal;word-break: keep-all;}
	
	#sod_inquiry li{padding: 15px 0;}
	#sod_inquiry li .idtime_link, #sod_inquiry li .inquiry_name{font-size: 14px;}
	#sod_inquiry li .inquiry_name{line-height: 160%;}
	#sod_inquiry li .inquiry_price{font-size: 16px;}

	#myWish li{width: calc( ( 100% - 10px ) / 2 );}
	.wish_info a{font-size: 14px;}
}

/* add_pop */
.add_pop_wrap {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.9);z-index: 9999;display: none;}
.add_pop_wrap *{color: #fff;}
.add_pop_inner{position: absolute;top: 50%;left: 50%;width: 94%;max-width: 800px;height: 600px;border-radius: 15px;overflow: hidden;transform: translate(-50%,-50%) scale(.9);transition: transform .3s ease;}
#add_wrap_02 .add_pop_inner{height: 250px;}
.add_pop_wrap.active .add_pop_inner{transform: translate(-50%,-50%) scale(1);}

.add_pop_tit{background: #000;color: #FFF;display: flex;flex-direction: row;align-items: center;justify-content: space-between;padding: 0 25px;}
.add_pop_close{width: 20px;height: 60px;position: relative;}
.add_pop_close span{position: absolute;top: 29px;left: 0;width: 20px;height: 2px;background: #fff;z-index: 1;transition: transform .3s ease; }
.add_pop_close span:nth-child(1){transform: rotate(45deg);}
.add_pop_close span:nth-child(2){transform: rotate(-45deg);}

.add_pop_close:hover span{transform: rotate(0);}

.add_pop_con{background: #FFF;padding: 22px 25px;overflow-y: scroll;height: calc( 100% - 60px );}
.add_pop_con h5{font-size: 1rem;font-weight: bold;margin-bottom: 10px; color:#000;}
.add_pop_con p{font-size: 14px;line-height: 160%;margin-bottom: 25px; color:#000;}


@media (max-width: 780px){ 
	.add_pop_con p{font-size: 12px;}
}


.j_search_box form {line-height:0;}