@charset "utf-8";

/***************************************************
 * Section title
 * 
***************************************************/
.wpb_row .col .runpick-section-title__wrap{ padding-bottom: 10px;}
.wpb_row .col .runpick-section-title__wrap.center{ text-align: center;}

.wpb_row .col .runpick-section-title__wrap h2{ margin-bottom: 15px; font-size: 52px; font-weight: 900; line-height: 58px; letter-spacing: -1px; color: #fff; text-shadow: -1px -1px 0 #695903, 1px -1px 0 #FFD700, -1px 1px 0 #695903, 1px 1px 0 #FFD700; word-break: keep-all;}
.wpb_row .col .runpick-section-title__wrap p{ margin-top: 10px; font-size: 20px; font-weight: 500; line-height: 26px; letter-spacing: -1px; color: #fff;}

.wpb_row .col .runpick-section-title__wrap h3{ font-size: 46px; font-weight: 900; line-height: 52px; color: #000;}
.wpb_row .col .runpick-section-title__wrap .desc{ font-size: 17px; font-weight: 500; line-height: 23px; color: #fff;}


/***************************************************
 * Button
 * 
***************************************************/
.row .col .button__wrap{ display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 30px;}

.row .col .button-section{ display: flex; align-items: center; flex-wrap: nowrap; justify-content: center; gap: 8px; width: 240px; height: 76px; border-radius: 1000px; background: #0078F1;}
.row .col .button-section:hover{ background-color: #000; background: linear-gradient(45deg, rgb(144 187 235) 0%, #0078F1 80%); background-size: 300% 300%; animation: gradientAnimation 3000ms infinite !important;}
.row .col .button-section .text{ font-size: 18px; font-weight: 500; line-height: 24px; color: #fff;}
.row .col .button-section img{ width: 30px; height: 30px; margin-bottom: 0px;}

.row .col .button-section-white{ display: flex; align-items: center; flex-wrap: nowrap; justify-content: center; width: 365px; height: 76px; border-radius: 1000px; background-color: #000; background: #fff;}
.row .col .button-section-white .text{ font-size: 20px; font-weight: 700; line-height: 26px; color: #24242e;}
.row .col .button-section-white img{ width: 30px; height: 30px; margin-bottom: 0px;}
.row .col .button-section-white.align-center{ margin: 0px auto;}


/***************************************************
 * Table
 * 
***************************************************/
body.page-id-16861 .main-content table{ background-color: #24242e !important;}
body.page-id-16861 .main-content table tr:nth-child(2n+1) { background-color: #24242e !important;}

body.page-id-16861 .main-content tr td:first-child, 
body.page-id-16861 .main-content tr th:first-child{ border: 1px solid #333;}

body.page-id-16861 .main-content table thead tr th, 
body.page-id-16861 .main-content table tbody tr td{ border-top: 1px solid #555; border-color: #555 !important; color: #fff; text-align: center;}
body.page-id-16861 .main-content table thead tr th{ background-color: #00ff8c; font-size: 15px; font-weight: 700; color: #000;}


/***************************************************
 * #runpick-main-visual
 * "쇼핑하며 돈 버세요, 런픽에서!"
 * 
***************************************************/
.partners-section-intro ul{ margin: 0px;}
.partners-section-intro ul li{ font-size: 20px; font-weight: 500; line-height: 40px; color: #fff; list-style: none;}

.row .col .button-intro__wrap{ display: flex; align-items: center; justify-content: center; gap: 10px;}
.row .col .button-intro__wrap .button-intro{ position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 20px 30px; border: 0px; border-radius: 60px; background: #000000c4; /* background: linear-gradient(266deg, rgba(218,201,2,1) 0%, rgba(254,255,135,1) 52%, rgba(218,201,2,1) 100%); */ background-size: 300% 300%; animation: gradientAnimation 3000ms infinite !important; cursor: pointer; transition: all 300ms ease-in-out;}
.row .col .button-intro__wrap .button-intro:hover{ background-color: #000;}
.row .col .button-intro__wrap .button-intro img{ width: 24px; margin-bottom: 0px;}
.row .col .button-intro__wrap .button-intro .text{ font-size: 17px; font-weight: 700; line-height: 24px; color: #fff;}

.row .col .button-intro__wrap .button-intro--blue{ position: relative; display: inline-block; padding: 20px 30px; border: 0px; border-radius: 60px; background: #0078F1;  cursor: pointer;}
.row .col .button-intro__wrap .button-intro--blue .text{ font-size: 17px; font-weight: 700; line-height: 24px; color: #fff;}

@keyframes gradientAnimation { 
	0% {background-position: 0% 50%;} 
	50% { background-position: 100% 50%;} 
	100% { background-position: 0% 50%;} 
}

@keyframes round_wave {
	from {-webkit-transform: scale(0,0); transform: scale(0,0); opacity: 1;} 
	to { -webkit-transform: scale(1.35,1.5); transform: scale(1.35,1.5); opacity: 0;}
}


/***************************************************
 * #runpick-benefit
 * "런픽의 두 가지 보상 시스템"
 * 
***************************************************/
#runpick-benefit{ position: relative;}

/* 타이틀 */
.wpb_row .col .runpick-benefit-title__wrap{ text-align: center;}
.wpb_row .col .runpick-benefit-title__wrap h4{ display: inline-block; padding: 10px 15px; border-radius: 15px; background-color: #FFD700;}
.wpb_row .col .runpick-benefit-title__wrap h4 .heading__inner{ display: flex; align-items: center; justify-content: center; gap: 10px;}
.wpb_row .col .runpick-benefit-title__wrap h4 .heading__inner img{ width: 32px; height: 32px; margin-bottom: 0px;}
.wpb_row .col .runpick-benefit-title__wrap h4 .heading__inner .text{ font-size: 17px; font-weight: 700; line-height: 21px; color: #fff; text-align: center; color: #222;}

/* 포인트 제도 - 박스 */
.wpb_row .col .runpick-benefit__item{ display: flex; flex-direction: column; align-items: center; justify-content: flex-start; min-height: 290px; padding: 40px; border: 1px solid #FFD700; border-radius: 30px; background-color: #fafafa; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;}
.wpb_row .col .runpick-benefit__item .title{ width: 100%; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #ddd; font-size: 20px; font-weight: 900; line-height: 26px; text-align: center; color: #222;}
.wpb_row .col .runpick-benefit__item .desc{ font-size: 15px; font-weight: 500; line-height: 21px; color: #555; text-align: center;}
.wpb_row .col .runpick-benefit__item .desc .point{ font-weight: 700;}
.wpb_row .col .runpick-benefit__item .desc .point-max{ display: inline-block; margin-bottom: 10px; font-size: 20px; font-weight: 900; color: #000;}

/* 캐시 제도 - 박스 */
.wpb_row .col .runpick-benefit-title__wrap h4.cash{ background-color: #FFD700;}

.wpb_row .col .runpick-benefit__item.cash{ position: relative; min-height: 250px; border: 1px solid #FFD700;}
.wpb_row .col .runpick-benefit__item.cash .title{ margin-bottom: 0px; border-bottom: 0px;}
.wpb_row .col .runpick-benefit__item.cash::before{ content: "";	position: absolute;	top: 50%; left: 100%; transform: translateY(-50%); width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 10px solid #FFD700;}
.wpb_row .col .runpick-benefit__item.cash.last::before{ display: none;}


/***************************************************
 * #runpick-seller
 * "판매자님, 런픽으로 매출 올리세요!"
 * 
***************************************************/
#runpick-seller .wpb_row .col .runpick-section-title__wrap h3{ font-size: 46px; color: #007BFF;}

.wpb_row .col .runpick-seller__item{ display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 400px; padding: 40px; border: 1px solid #fff; background-color: #ffffff8f; border-radius: 30px; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; backdrop-filter: blur(20px);}
.wpb_row .col .runpick-seller__item .title{ padding-bottom: 10px; font-size: 20px; font-weight: 700; line-height: 26px; color: #fff; text-align: center; color: #222;}
.wpb_row .col .runpick-seller__item .desc{ font-size: 15px; font-weight: 500; line-height: 21px; color: #555; text-align: center;}
.wpb_row .col .runpick-seller__item .desc .point{ font-weight: 700;}


/***************************************************
 * #runpick-buyer
 * "구매자님, 런픽으로 혜택 쌓으세요!"
 * 
***************************************************/
.row .col .runpick-buyer__wrap{ padding: 30px; text-align: left;}

.wpb_row .col .runpick-buyer__wrap h4{ display: inline-block; padding: 10px 15px; margin-bottom: 20px; border-radius: 15px; background-color: #FFD700;}
.wpb_row .col .runpick-buyer__wrap h4 .heading__inner{ display: flex; align-items: center; justify-content: center; gap: 10px;}
.wpb_row .col .runpick-buyer__wrap h4 .heading__inner img{ width: 32px; height: 32px; margin-bottom: 0px;}
.wpb_row .col .runpick-buyer__wrap h4 .heading__inner .text{ font-size: 17px; font-weight: 700; line-height: 23px; color: #fff; text-align: center; color: #222;}

.wpb_row .col .runpick-buyer__wrap h4.cash{ background-color: #34bd73;}
.wpb_row .col .runpick-buyer__wrap h4.cash .heading__inner .text{ color: #fff;}

.wpb_row .col .runpick-buyer__list{ width: 100%; margin-left: 0px;}
.wpb_row .col .runpick-buyer__list li{ display: flex; gap: 10px; align-items: flex-start; padding: 20px; margin-bottom: 10px; border-bottom: 0px solid #222; border-radius: 15px; background: #efead8; font-size: 16px; font-weight: 700; line-height: 24px; color: #000; list-style: none; word-break: keep-all;}
.wpb_row .col .runpick-buyer__list li img{ width: 24px; height: 24px; margin: 0px;}
.wpb_row .col .runpick-buyer__list li .point{ font-weight: 900; color: #bb8900;}
.wpb_row .col .runpick-buyer__list li .point-max{ font-weight: 900; color: #bb8900;}

.wpb_row .col .runpick-buyer__list.green li{ position: relative; background: #efead8; margin-bottom: 20px;}
.wpb_row .col .runpick-buyer__list.green li .point{ font-weight: 900; color: #1b9352;}
.wpb_row .col .runpick-buyer__list.green li::before{ content: ""; position: absolute; left: 50%; bottom: -10px; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent;	border-top: 10px solid #efead8; transform: translateX(-50%);}
.wpb_row .col .runpick-buyer__list.green li:last-child::before{ display: none;}


/***************************************************
 * #runpick-howto
 * "런픽, 이렇게 쉽습니다!"
 * 
***************************************************/
.wpb_row .col .runpick-howto__item{ overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 0px; border: 1px solid #007BFF; background-color: #fff; border-radius: 10px;}
.wpb_row .col .runpick-howto__item img{ margin-bottom: 0px;}
.wpb_row .col .runpick-howto__item .nbr{ display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 10px; margin: 40px 0px 20px; border-radius: 20px; background-color: #007bff;  font-weight: 700; color: #fff;}
.wpb_row .col .runpick-howto__item .title{ padding: 0px 20px 60px; font-size: 20px; font-weight: 700; line-height: 26px; color: #fff; text-align: center; color: #000;}
.wpb_row .col .runpick-howto__item .desc{ font-size: 15px; font-weight: 500; line-height: 21px; color: #555; text-align: center;}
.wpb_row .col .runpick-howto__item .desc .point{ font-weight: 700;}


/***************************************************
 * #runpick-review
 * "런픽 유저들의 이야기"
 * 
***************************************************/
.wpb_row .col .runpick-review__item{ overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 0px; border: 0px solid #fff;}
.wpb_row .col .runpick-review__item .title{ position: relative; width: 100%; padding: 40px 20px; margin-bottom: 20px; border-radius: 15px; background-color: #fff; font-size: 20px; font-weight: 700; line-height: 26px; color: #fff; text-align: center; color: #000;}
.wpb_row .col .runpick-review__item .title::before{ content: ""; position: absolute; left: 50%; bottom: -10px; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent;	border-top: 10px solid #fff; transform: translateX(-50%);}
.wpb_row .col .runpick-review__item figure{ overflow: hidden; width: 80px; height: 80px; border-radius: 40px;}
.wpb_row .col .runpick-review__item figure img{ width: 80px; height: 80px;}

#runpick-review .nectar-flickity[data-controls*=arrows_overlaid] .flickity-prev-next-button.next { position: absolute; right: 0px; width: 40px; height: 40px; top: 75%;}
#runpick-review .nectar-flickity[data-controls*=arrows_overlaid] .flickity-prev-next-button.previous { position: absolute; left: 0px; width: 40px; height: 40px; top: 75%;}


/***************************************************
 * #runpick-cta
 * "출석 100P, 캐시 3% 혜택, 지금 런픽에서!"
 * 
***************************************************/
.wpb_row .col .runpick-cta-title__wrap{ overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 0px; border: 0px solid #fff;}
.wpb_row .col .runpick-cta-title__wrap h3{ position: relative; width: 100%; padding: 40px 20px; margin-bottom: 20px; border-radius: 15px; font-size: 46px; font-weight: 700; line-height: 52px; color: #fff; text-align: center; text-shadow: -1px -1px 0 #695903, 1px -1px 0 #FFD700, -1px 1px 0 #695903, 1px 1px 0 #FFD700}


/***************************************************
 * #responsive
 * 
***************************************************/
@media only screen and (max-width: 990px) {

	/* 비주얼 영역 */
	.wpb_row .col .runpick-section-title__wrap h2{ margin-bottom: 0px;}
	.wpb_row .col .runpick-section-title__wrap p{ font-size: 20px !important;}
	
	.button-intro__wrap .button-intro--blue{ padding: 20px 20px;}

	/* 런픽의 두 가지 보상 시스템 - 캐시제도 */
	.wpb_row .col .runpick-benefit__item.cash::before{ top: auto; left: 50%; bottom: -20px; transform: translateX(-50%); width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #FFD700;}

	.wpb_row .col .runpick-seller__item{ min-height: 300px;}
}

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

	.row .col .button-intro__wrap{ flex-direction: row; flex-wrap: wrap;}
	.row .col .button-intro__wrap .button-intro{ width: calc(50% - 10px); padding: 20px 0px;}
	.row .col .button-intro__wrap .button-intro .text{ font-size: 14px;}
	.row .col .button-intro__wrap .button-intro--blue .text{ font-size: 14px;}

	/* 비주얼 영역 */
	.wpb_row .col .runpick-section-title__wrap p{ font-size: 14px !important;}
	
	/* 구매자님 런픽으로 혜택 쌓으세요! */
	.row .col .runpick-buyer__wrap{ padding: 30px 0px 0px;}
	.nectar-flickity.nectar-carousel.nectar-carousel:not(.masonry) .flickity-viewport{ margin-top: 20px !important; margin-bottom: 0px !important;}

	.wpb_row .col .runpick-cta-title__wrap h3{ font-size: 26px; font-weight: 700; line-height: 36px;}

	.button-intro__wrap .button-intro .text, .button-intro__wrap .button-intro--blue .text{ font-size: 13px;}

	.wpb_row .col .runpick-cta-title__wrap h3{ padding: 40px 20px 20px;}

	.row .col .button-section{ height: 66px;}
	.row .col .button-section .text{ font-size: 14px;}

}