@charset "UTF-8";

/****** 25년초 리뉴얼 작업 ******/
/* 메인 리뉴얼 작업 (2025-02-10 홍선기) */
.index_content.home {
	background: #fafafa;
}
.cland_main_center.center {
	margin: 0;
	width: 100%;
}
.inConts.safe_inConts {
	margin-top: -24px;
    z-index: 1;
    transition: all .6s;
}
.index_content .top_quick_nav {
	display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 32px 0;
}
.index_content .top_quick_nav .leftarea {
	padding: 16px;
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
}
.index_content .top_quick_nav .leftarea p {
	color: var(--main-black);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
}
.index_content .top_quick_nav .leftarea .imgbox {
	display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 15px;
}
.index_content .top_quick_nav .rightarea {
	flex: 1;
}
.index_content .top_quick_nav .right_list_item {
	display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: flex-start;
    row-gap: 18px;
}
.index_content .top_quick_nav .right_list_item li {
	text-align: center;
}
.index_content .top_quick_nav .right_list_item a {
	display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    min-height: 53px;
}
.index_content .top_quick_nav .right_list_item p {
	color: #6f6f6f;
    font-size: 12px;
    line-height: 1.5;
}
.index_content .main_top_ad {
	border-radius: 20px;
	overflow: hidden;
	margin-bottom: 32px;
}
.swiper-containermiddlebanner {
	overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
}
.swiper-containermiddlebanner .swiper-slide {
	box-shadow: none;
}
.culture_hot_issue {
	margin-top: 32px;
}
.culture_hot_issue h3 {
	color: var(--main-black);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
}
.culture_hot_issue div {
	margin-top: 16px;
}
.culture_hot_issue img {
	border-radius: 20px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.10);
}
.main_service_area {
	padding-top: 12px;
    padding-bottom: 28px;
    margin-top: 32px;
    width: calc(100% + 40px);
    margin-left: -20px;
    padding-left: 20px;
    overflow-x: hidden;
    box-sizing: border-box;
}
.main_service_area .txt p {
	border-radius: 99px;
    background: rgba(218, 70, 52, 0.10);
    padding: 2px 8px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    color: #fa4634;
    display: inline-block;
}
.main_service_area .txt h4 {
	margin-top: 4px;
    color: var(--main-black);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
}
.main_service_area .swiper-slide {
	border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
    flex: 1;
    min-width: 130px;
}
.main_service_area .swiper-slide:first-child {
	 width: 84px !important;
	 background: transparent;
     box-shadow: none;
     margin-right: 24px !important;
     border-radius: 0;
     min-width: 72px;
}
.main_service_area .swiper-slide:last-child {
	margin-right: 0 !important;
}
.social_list_area {
	margin: 20px 0 48px;
}
.social_list_area ul {
	display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.social_list_area ul a {
	display: flex;
    align-items: center;
    gap: 4px;
}
.social_list_area ul a img {
	width: 32px;
}
.social_list_area ul a p {
	color: #6f6f6f;
    font-size: 14px;
    line-height: 1.4;
}
.index_content .toast_bottompop {
	position: fixed;
    bottom: 99px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: max-content;
    max-width: calc(100% - 40px);
    z-index: 1;
    background: rgba(48, 48, 48, 0.98);
    border-radius: 70px;                                                                                                                                                                        
    backdrop-filter: blur(2.5px);
    padding: 0 20px 0 16px;
    white-space: nowrap;
}
.index_content .toast_closebtn img {
	width: 4rem;
}
.index_content .toast_closebtn {
	width: 20px;
    height: 20px;
    flex-shrink: 0;
}
.cshMain_content .article1 {
	display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: center;
    margin-top: 40px;
}
.cshMain_content .article1 .imgbox {
	background: #fff;
    border-radius: 20px;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 96px;
    height: 90px;
    margin: 0 auto;
}
.cshMain_content .article1 .imgbox.slide {
	overflow: hidden;
}
.cshMain_content .article1 .imgbox > img {
	width: 60px;
}
.cshMain_content .article1 .article_list {
	text-align: center;
	position: relative;
}
.cshMain_content .article1 .article_list p:not(.txt_animation) {
	margin-top: 8px;
    color: var(--main-black);
    font-size: 14px;
    line-height: 1.5;
}
.cshMain_content .article1 .article_list .slick.marquee {
	display: flex;
    align-items: center;
}
.cshMain_content .txt_animation {
	font-weight: 600;
	background: linear-gradient(90deg, #f00 0%, #f00 49.26%, #fcc 23.72%, #f00 58.31%,
		#ff1717 100%) repeat;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	-webkit-font-smoothing: antialiased;
	-webkit-background-size: 50% 100%;
	-webkit-animation-name: moving-gradient;
	-webkit-animation-duration: 2.3s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
	display: inline-block;
	width: 300px;
	letter-spacing: -0.04em;
	font-size: 12px;
    line-height: 1.5;
    position: absolute;
    bottom: calc(100% + 2px);
    left: 50%;
    transform: translateX(-50%);
}
.cshMain_content .top_banner {
	margin-top: 32px;
	border-radius: 20px;
	overflow: hidden;
}
.cshMain_content .article {
	background: #fff;
    border-radius: 20px;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
    margin-top: 24px;
}
.cshMain_content .article:first-child {
	margin-top: 32px;
}
.cshMain_content .article h3 {
	padding: 20px;
    color: var(--main-black);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
}
.cshMain_content .article ul {
	padding: 0 8px 24px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    justify-content: center;
    align-items: center;
    row-gap: 16px;
}
.cshMain_content .article ul li {
	text-align: center;
	position: relative;
}
.cshMain_content .article ul li:after { 
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 1px;
	height: 20px;
	background: #dfe1e5;
}
.cshMain_content .article ul li:nth-of-type(3n):after {
	content: unset;
}
.cshMain_content .article ul li:last-child:after {
	content: unset;
}
.cshMain_content .article li .tit {
	color: #767676;
    font-size: 14px;
    line-height: 1.5;
    margin-top: 3px;
    padding: 0 8px;
    word-break: keep-all;
}
.cshMain_content .article li .logobox {
	height: 50px;
	display: flex;
    justify-content: center;
    align-items: center;
}
.cshMain_content .chage_adarea {
	margin-top: 35px;
    border-radius: 20px;
    overflow: hidden;
}
.cshMain_content .speech_area {
	position: absolute;
    bottom: calc(100% - 12px);
    right: 8px;
}
.cash_toparea {
	width: calc(100% + 8rem);
	margin-left: -4rem;
}
.gift_main_content .top_txt,
.trdMain_content .top_txt {
	font-size: 20px;
    line-height: 1.4;
    margin-bottom: 16px;
}
.trdMain_content .top_txt {
	font-weight: 600;
    color: var(--main-black);
    display: flex;
    align-items: center;
}
.gift_main_content .gift_main_top,
.trdMain_content .trd_main_top {
	margin-top: 24px;
}
.gift_main_content .gift_main_bottom {
	margin-top: 32px;
}
.gift_main_content .cPoint_list.gft,
.trdMain_content .cPoint_list.gft {
	margin-bottom: 0;
	border: none;
    background: transparent;
    display: block;
    overflow: unset;
}
.gift_main_content .cPoint_list.gft>li,
.trdMain_content .cPoint_list.gft>li {
	background: #fff;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
    border-radius: 20px;
    margin-bottom: 0;
    border-top: 0;
    overflow: hidden;
}
.gift_main_content .cPoint_list.gft>li:not(:last-child) {
	border-bottom: 0;
	margin-bottom: 12px;
}
.trdMain_content .cPoint_list.gft>li {
	margin: 0;
}
.trdMain_content .cPoint_list.gft>li:not(:last-child) {
	border-bottom: 0;
	margin-bottom: 12px;
}
.gift_main_content .cPoint_list.gft>li>a,
.trdMain_content .cPoint_list.gft>li>a {
	padding: 12px 16px;
	font-size: 16px;
    line-height: 1.5;
}
.gift_main_content .cPoint_list.gft>li.jx_ad>a {
	padding: 0;
}
.gift_main_content .cPoint_list.gft>li.jx_ad>a img {
	width: 100% !important;
}
.trdMain_content .cPoint_list.gft>li>a {
	width: 100%;
    display: flex;
    align-items: center;
    color: var(--main-black);
    box-sizing: border-box;
}
.trdMain_content .cPoint_list.gft>li>a:before {
	content: unset;
}
.gift_main_content .cPoint_list.gft>li>a img:nth-of-type(1),
.trdMain_content .cPoint_list.gft>li>a img:nth-of-type(1) {
	width: 40px;
	margin-right: 12px;
}
.trdMain_content .cPoint_list.gft>li>a img:nth-of-type(2) {
	position: absolute;
    top: 50%;
    right: 1.9rem;
    transform: translateY(-50%);
}
.inConts.main {
	width: calc(100% - 40px);
}
.slide-container-main {
	position: relative;
	visibility: hidden;
	margin-top: 3px;
}
.slide-container-main .slick-slide {
	height: auto;
}
.slide-container-main .custom-pagination {
	position: absolute;
    bottom: 37px;
    right: 20px;
    background: rgba(0, 0, 0, 0.10);
    padding: 2px 8px;
    border-radius: 99px;
    color: var(--main-black);
    font-size: 12px;
    line-height: 1.5;
}
.slide-container-main .custom-pagination .pagination-current {
	font-weight: 600;
}
.online_popup.login .login_adarea.swiper-containerreLoginAdbox {
	overflow: hidden;
    width: calc(100% - 40px);
    margin-left: 20px;
    padding: 0;
}

.index_middle_banner {
	border-radius: 12px;
	overflow: hidden;
}


/* 충전 뱃지 교체  (2025-05-12 홍선기) */
.cshMain_content .event-list {
	position: absolute;
    bottom: calc(100% - 12px);
    right: 8px;
    background: #69b6a4;
    border-radius: 99px;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.5;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1px 5px;
}
.cshMain_content .event-list.num {
	background: #ff3838;
}
.cshMain_content .event-list .tail {
	position: absolute;
    bottom: -4px;
    right: 1px;
}

/* 간격 및 ui 수정 (2025-05-27 홍선기) */
.index_middle_banner {
	border-radius: 20px;
	box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.10);
}
.culture_hot_issue .index_middle_banner {
	border-radius: 20px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.10);
}

/* 개편 추가 수정 (2025-05-28 홍선기) */
.cash_toparea {
	width: calc(100% + 40px);
    margin-left: -20px;
}
.social_list_area ul {
	justify-content: center;
}
.index_content .top_quick_nav .right_list_item p {
	line-height: 1.1;
}
.cshMain_content .article li .tit {
	line-height: 1.2
}
.index_content .toast_bottompop {
	z-index: 13;
}


/* 개편 추가 수정 (2025-05-30 홍선기) */
.social_list_area ul {
	gap: 20px;
}
.trdAppAll-content .coupon_full {
	border-bottom: 0;
	padding: 0;
    width: auto;
    margin: 24px 0 0;
}
.trdAppAll-content .couponTitle {
	padding-bottom: 0;
}
.trdAppAll-content .couponTitle>dt {
	color: var(--main-black);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.64px;
}
.trdAppAll-content .phoneNumber {
	margin-top: 12px;
}
.trdAppAll-content .phoneNumber>li {
	padding-top: 0;
}
.trdAppAll-content .phoneNumber>li>input[type=number], 
.trdAppAll-content .phoneNumber>li>input[type=tel], 
.trdAppAll-content .phoneNumber>li>input[type=text] {
	border-radius: 12px;
    border-color: #dfe1e5;
    height: 48px;
    padding: 0 20px;
    line-height: 1.5;
    color: var(--main-black);
    font-size: 16px;
    letter-spacing: -0.64px;
}
.trdAppAll-content .phoneNumber>li>input[type=number]::placeholder, 
.trdAppAll-content .phoneNumber>li>input[type=tel]::placeholder, 
.trdAppAll-content .phoneNumber>li>input[type=text]::placeholder {
	color: #d6d8dc;
}
.trdAppAll-content .choice-box {
	margin-top: 24px;
}
.trdAppAll-content .choiceMoney {
	margin: 12px 0;
    gap: 8px;
}
.trdAppAll-content .choiceMoney>li {
	padding: 0;
    flex: 1;
}
.trdAppAll-content .choiceMoney>li>a {
	min-height: unset;
    padding: 0;
    border: 1px solid #dfe1e5;
    border-radius: 8px;
    color: #6f6f6f;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.48px;
    height: 52px;
}
.trdAppAll-content .choiceMoney>li>a.active {
	border-color: #da4634;
	color: #da4634;
}
.trdAppAll-content .check-box {
	margin-top: 24px;
    padding: 8px 0;
}
.trdAppAll-content .check-box label {
	color: #767676;
    font-size: 14px;
    line-height: 1.5;
    letter-spacing: -0.56px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.trdAppAll-content .check-box input[type="checkbox"]{
    display: none;
}
.trdAppAll-content .check-box .check-style {
    display: inline-block;
    width: 20px;
    height: 20px;
    position: relative;
    background: url('https://image.cultureland.co.kr/upload/web/etc/login-non-checked.png');
 	background-position: center;
    background-size: cover;
 }
.trdAppAll-content .check-box input[id="googleChkAgree"]:checked + label .check-style {
    background: url('https://image.cultureland.co.kr/upload/web/etc/login-checked.png');        
	background-position: center;
    background-size: cover;
}
.trdAppAll-content .btnArea {
	margin-top: 36px;
    gap: 8px;
}
.trdAppAll-content .btnArea a {
	margin: 0;
    padding: 0;
    height: 52px;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.64px;
    border: none;
    background-color: #da4634;
}
.trdAppAll-content .note {
	margin-top: 40px;
    padding: 12px 16px;
    background-color: #eceef2;
    border-radius: 12px;
    border: none;
}
.trdAppAll-content .note .mini-title {
	display: flex;
    justify-content: space-between;
    align-items: center;
}
.trdAppAll-content .note .mini-title h4 {
	color: #6f6f6f;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.56px;
}
.trdAppAll-content .note .mini-title img {
	width: 14px;
	transition: all 0.4s;
}
.trdAppAll-content .note .mini-title.active img {
	transform: rotate(-180deg);
}
.trdAppAll-content .note .add-info {
	margin-top: 12px;
	display: none;
}
.trdAppAll-content .bul_2x2>li {
    padding: 0;
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: -0.48px;
}
.trdAppAll-content .note .red {
	color: #fa4634 !important;
}
.trdAppAll-content .bul_2x2>li:before {
	content: unset;
}
.trdAppAll-content .note dl.tits {
	padding-top: 6px;
}
.trdAppAll-content .note dl.tits>dt {
	padding-bottom: 6px;
    color: #6f6f6f;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    letter-spacing: -0.48px;
}
.trdAppAll-content .bul_2x2>li {
	color: #6f6f6f;
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: -0.48px;
    display: flex;
    gap: 4px;
    margin-top: 4px;
}
.trdAppAll-content .bul_2x2>li:first-child {
	margin-top: 0;
}
.cshMain_content .article2 {
	margin-top: 32px;
}
.index_content .toast_bottompop .toast-inner {
	display: inline-flex;
	justify-content: center;
	align-items: center;
    gap: 8px;
}
.index_content .toast_bottompop .left-img {
	width: 80px;
    flex-shrink: 0;
}
.index_content .toast_bottompop .txt-area {
	display: flex;
    flex-direction: column;
    justify-content: center;
    white-space: nowrap;
}
.index_content .toast_bottompop .txt-area p:first-child {
	color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: -0.56px;
}
.index_content .toast_bottompop .txt-area p:last-child {
	color: rgba(255, 255, 255, 0.8);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: -0.48px;
}





/* 반응형 */
@media (min-width: 500px) {
	.index_content .toast_closebtn img {
		width: 3.5rem;
	}
	.inConts.main {
		width: calc(100% - 100px);
	}
	.slide-container-main .slick-slide img {
		width: 100%;
	}
	.nam-container {
		aspect-ratio: 65 / 10.5;
	}
}
