@charset "utf-8";
@import url('./fonts/Pretendard/pretendard.css');


:root {
    --body-max-width: 1360px;
}

/* 초기화 */
body {margin:0;padding:0;font-size:16px; font-family:'Pretendard', serif; line-height:150%;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
ul {margin:0;padding:0;list-style:none}
ol,li,dl,dt,dd {margin:0;padding:0} 
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}


input:not([type="checkbox"], [type="radio"],[type="file"]),
select,
textarea {box-sizing: border-box; font-size: 1em; line-height: 1.25; margin: 0; padding: 0.6em 0.9em;border: 1px solid #d0d4d8; border-radius: 8px;
background: #ffffff;
color: #222;
transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
-webkit-appearance: none;   /* iOS/Chrome 기본 스타일 제거 */
appearance: none;
vertical-align:middle
}
select {
    background-position: right center;
    background-repeat: no-repeat;
    background-size: auto 70%;
    padding-right:2em;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
}

/* 포커스와 액티브 */
input:not([type="checkbox"], [type="radio"]) :focus,
select:focus,
textarea:focus {border-color: #ccc; box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.15);}

/* 비활성화/읽기전용 */
input[disabled],
input:disabled,
input[readonly],
textarea[disabled],
textarea:disabled,
textarea[readonly],
select[disabled],
select:disabled,
select[readonly] {background: #f5f7fa; border-color: #e2e6ea; color: #9aa4ae; cursor: not-allowed; }


.checkbox {
    position:relative;
}
.checkbox input[type="checkbox"] {
    display: none;
}

.checkbox label {
    position:relative;
    padding-left:1.25em;
    color:var(--checkbox-color, rgba(25, 25, 25, 1));
    font-weight:500;

}
.checkbox label::before {
    content:"";
    display:block;
    position:absolute;
    top:50%;
    left:0;
    transform:translateY(-50%);
    width: 0.9375em;
    height: 0.9375em;
    border:1px solid var(--checkbox-color, rgba(25, 25, 25, 1));
    border-radius:0;
    background-color:transparent;
}
.checkbox input[type="checkbox"]:checked + label::before {
    background:var(--checkbox-color, rgba(25, 25, 25, 1)) url('../images/icon_checkbox.png?2') no-repeat center;
    border:1px solid var(--checkbox-color, rgba(25, 25, 25, 1));;
}



img {vertical-align:middle}

button {cursor:pointer; padding:0.6em 0.9em; border:1px solid transparent; background-color:#444; color:#fff; font-weight:400; font-size:1em; line-height:1.25;}
textarea {min-height: 4rem; resize: vertical; width:100%;}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a {color:#000;text-decoration:none}

*, :after, :before {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}



	
header {width:100%; margin: 0 auto; background:#191919;}
header a {color:#fff; font-size:0.75em; font-weight:500; }
header .brand {position:relative; width:100%; max-width:calc(var(--body-max-width)); display:flex; padding:18px 0; margin:0 auto; align-items:center; justify-content:center; gap:2em;}
header .brand .search {flex:1; text-align:right;}
header .brand .search form {display:inline-block; width:auto; margin-left:auto; position:relative;}
header .brand .search form #search_word {width:350px; font-size:0.75em; padding: 1em 2em; color:#fff; background-color:transparent; border:1px solid #fff; border-radius:5em;}
header .brand .search form .btn_search {position:absolute; width:3em; height:3em; right:1em; top:50%; transform:translateY(-50%); background-size:70%; background-repeat:no-repeat; background-position:center; background-color:transparent; background-image:url('/images/bg_search.png'); text-indent:-9999px; overflow:hidden; border:none;}
header .brand .switch {display:flex; justify-content:flex-end; align-items:center;}
header .brand .switch .switch-19 {position: relative; width: 30px; height: 9px; display: inline-block;}
header .brand .switch .switch-19 input {opacity: 0; width: 0; height: 0; }
header .brand .switch .switch-19 .switch-track {position: absolute; width: 100%; height: 9px; background-color: #d5d5d5; border-radius: 9px; transition: background-color 0.3s ease;}
header .brand .switch .switch-19 .switch-thumb {position: absolute; top: 50%; left: 0; width:26px; height:26px; border:2px solid #E60000; background:#fff; color:#191919; transform: translateY(-50%); transition: left 0.3s ease; display:flex; justify-content:center; align-items:center; line-height:1; font-size:13px; font-weight:700; border-radius:26px; padding:0; margin:0;}
header .brand .switch .switch-19 input:checked + .switch-track {background-color: #E60000; }
header .brand .switch .switch-19 input:checked + .switch-track + .switch-thumb {left: calc(100% - 10px);}
header .header_nav {width:100%; max-width:calc(var(--body-max-width)); height:auto; display:flex; align-items:center; justify-content: space-between; margin:0 auto;}
header .header_nav li {padding:1.125em 0;}
header .header_nav a {font-size:1em;}
header .header_nav a:hover,
header .header_nav a.active {font-weight:700;}

.main_top_notice_wrap {width:100%; height:auto; background-color:#f6f6f6;}
.main_top_notice {width:100%; max-width:calc(var(--body-max-width)); display:flex; align-items:flex-start; justify-content: space-between; margin:0 auto; padding:1.5em 0;}
.main_top_notice .notice_title {font-size:0.875em; color:#191919; font-weight:500; line-height:1.25;}
.main_top_notice .notice_title:before {content:"공지"; position:relative; background:#191919; color:#fff; font-size:1.075em; padding:0.5em 1em; border-radius:5em; margin-right:0.75em;}
.main_top_notice .more {position:relative; display:block; font-size:0.875em; text-indent: -9999px; overflow:hidden; widtH:1.075em; height:1.075em; overflow:hidden;}
.main_top_notice .more:before {content:""; position:absolute; width:100%; height:2px; background:#191919; top:50%; left:0; transform:translateY(-50%);}
.main_top_notice .more:after {content:""; position:absolute; width:2px; height:100%; background:#191919; top:0; left:50%; transform:translateX(-50%);}

section.main_wrap {width:100%; max-width:calc(var(--body-max-width)); display:flex; align-items:flex-start; justify-content: space-between; margin:0em auto;}
section.main_wrap .content {position:relative; width:935px; border-right:1px solid #E2E2E2; padding-right:50px; padding-bottom:10em; margin-bottom:1.25em;}
section.main_wrap .right_ctt {position:relative; width:425px; padding-left:50px;}

section.main_wrap .content h2 {font-size:1.75em; font-weight:600; letter-spacing:-0.02em; line-height:1.25; margin-bottom:1.75em;}
section.main_wrap .content .main_banner {width:100%; height:auto; margin-top:3em; padding-bottom:5em;}
section.main_wrap .content .main_banner .main_banner_inner {position:relative; width:100%; height:460px; border-radius:1em; box-shadow:0 0 1.075em 0 rgba(0,0,0,0.2);}
section.main_wrap .content .main_banner .main_banner_inner .swiper-slide {position:relative; width:100%; height:460px; margin:0; padding:0; border-radius:1em; overflow:hidden; z-index:1;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-slide img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-slide .desc {position:absolute; bottom:0; left:0; width:100%; height:180px; background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); z-index:2; font-size:1.125em; color:#e5e5e5; font-weight:500; display:flex; flex-direction: column; align-items:flex-start; justify-content: center; gap:0.75em; padding-left:4em;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-slide .desc strong {font-size:1.56em; line-height:1.25; font-weight:600; letter-spacing:-0.02em;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-pagination-bullets.swiper-pagination-horizontal {bottom:-2.5em;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-pagination-bullet {transition: width 0.5s ease; border-radius:3em;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-pagination-bullet.swiper-pagination-bullet-active {width:2em; border-radius:3em; background-color:#000;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-button-prev,
section.main_wrap .content .main_banner .main_banner_inner .swiper-button-next {width:50px; height:50px; background-color:rgba(25,25,25,0.3); border-radius:50px; background-position: center; background-repeat: no-repeat;}
section.main_wrap .content .main_banner .main_banner_inner .swiper-button-prev {left:-25px; background-image: url('/images/slide_arrow_left.png');}
section.main_wrap .content .main_banner .main_banner_inner .swiper-button-next {right:-25px; background-image: url('/images/slide_arrow_right.png');}
section.main_wrap .content .main_banner .main_banner_inner .swiper-button-prev:after,
section.main_wrap .content .main_banner .main_banner_inner .swiper-button-next:after {content:""; display:none;}


section.main_wrap .content .set_prefs {position:relative; display:flex; align-items:center; justify-content:space-between; background:rgba(244,244,244,1); padding:45px 30px 45px 45px;}
section.main_wrap .content .set_prefs .title {font-size:1em;}
section.main_wrap .content .set_prefs .title strong {font-size:1.5em; font-weight:700; line-height:1.5;}
section.main_wrap .content .set_prefs .title p {font-size:0.75em; margin-top:1em; line-height:1.5;}
section.main_wrap .content .set_prefs .set_prefs_inner {position:relative; width:100%; max-width:610px; height:max-content; overflow:hidden; padding-bottom:2em;}
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-slide {width:160px; height:160px; overflow:hidden; background:#ccc; border:1px solid rgba(226,226,226,1); background-color:#fff; border-radius:0.5em; padding:25px;}
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-slide p {color:rgba(66,66,66,1); font-size:0.8125em; line-height:1.7; font-weight:500; word-break:keep-all;}
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-slide icon {position:absolute; display:block; width:30px; height:30px; border-radius:30px; background:rgba(233,233,233,1); bottom:20px; left:25px; overflow:hidden;}
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-slide icon img {width:100%; height:auto; object-fit:cover;}
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-button-next, 
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-button-prev {bottom:0em; top:auto; height:auto; padding:0.5em 0; width:auto;}
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-button-next {right:0;} 
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-button-prev {left:0;}
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-button-next:after, 
section.main_wrap .content .set_prefs .set_prefs_inner .swiper-button-prev:after {content:""; display:none;}


section.main_wrap .content .realtime_ctt {position:relative; margin-top:3.125em; }
section.main_wrap .content .realtime_ctt ul.cate {position:absolute; top:0.25em; right:0; display:flex; align-items:center; gap:1em; z-index:2; justify-content: flex-start;}
section.main_wrap .content .realtime_ctt ul.cate a {display:block; font-size:0.815em; font-weight:500; line-height:1; border-bottom:2px solid transparent;}
section.main_wrap .content .realtime_ctt ul.cate a.active {border-bottom:2px solid rgba(25, 25, 25, 1); font-weight:700;}
section.main_wrap .content .realtime_ctt h2 {margin-bottom:0;}
section.main_wrap .content .realtime_ctt ul.list {position:relative; display:block; width:100%; height:auto; padding:0; margin:0; margin-top:1em;}
section.main_wrap .content .realtime_ctt ul.list li {position:relative; padding:1.5em 0; margin:0; border-bottom:1px solid rgba(226, 226, 226, 1); display:flex; align-items:flex-start; justify-content: space-between; gap:4em;}
section.main_wrap .content .realtime_ctt ul.list li:last-child {border-bottom:none;}
section.main_wrap .content .realtime_ctt ul.list li .info {position:relative; display:flex; align-items:flex-start; flex-direction: column; justify-content: flex-start;}
section.main_wrap .content .realtime_ctt ul.list li .info .tags {position:relative; display:block; width:100%;}
section.main_wrap .content .realtime_ctt ul.list li .info .tags span {display:inline-block; font-size:0.75em; font-weight:500; line-height:1.25; margin-right:1em; padding:0.625em 1em; background:rgba(237, 237, 237, 1); color:rgba(83, 83, 83, 1); border-radius:5em;}
section.main_wrap .content .realtime_ctt ul.list li .info .tags span.more {position:absolute; right:0; top:50%; transform:translateY(-50%); background-color:transparent; padding:0; margin-right:0;}
section.main_wrap .content .realtime_ctt ul.list li .info .auth {font-size:1em; font-weight:600; height:35px; display:flex; align-items:center; justify-content: flex-start; gap:0.5em; margin-top:27px;} 
section.main_wrap .content .realtime_ctt ul.list li .info .auth icon {display:block; width:35px; height:35px; border-radius:35px; overflow:hidden; background:rgba(0,0,0,0.1);}
section.main_wrap .content .realtime_ctt ul.list li .info .auth icon img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .content .realtime_ctt ul.list li .info .title { font-size:1.125em; font-weight:700; line-height:1.25; padding:1em 0;}
section.main_wrap .content .realtime_ctt ul.list li .info .desc {font-size:0.825em; font-weight:500; color:rgba(124, 124, 124, 1); line-height:1.5; display:flex; align-items:flex-end; justify-content: center; gap:1em;}
section.main_wrap .content .realtime_ctt ul.list li .info .desc p {flex:1; margin-right:5em; width:100%; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
section.main_wrap .content .realtime_ctt ul.list li .info .desc span {display:block; margin-bottom:0.25em;}
section.main_wrap .content .realtime_ctt ul.list li .info .desc span.fav {padding-left:1em; background:url('/images/realtime_ctt_icon_fav.png') no-repeat left center; }
section.main_wrap .content .realtime_ctt ul.list li .info .desc span.like {padding-left:1.25em; background:url('/images/realtime_ctt_icon_like.png') no-repeat left center;}
section.main_wrap .content .realtime_ctt ul.list li .thumb {width:340px; height:195px; overflow:hidden; border-radius:0.6em; border:1px solid rgba(228, 228, 228, 1);}
section.main_wrap .content .realtime_ctt ul.list li .thumb img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .content .realtime_ctt .more_realtime_ctt {position:relative; width:60%; height:auto; padding:0.75em; background:rgba(25, 25, 25, 1); color:#fff; font-size:0.9375em; font-weight:500; border-radius:6px;; line-height:1.25; margin:2em auto; text-align:center;}
section.main_wrap .content .realtime_ctt .more_realtime_ctt a {display:block; text-align:center; color:#fff;  }

section.main_wrap .content .main-ad-01 {margin-top:3.125em; width:100%; height:auto; max-height:180px; overflow:hidden;}

section.main_wrap .content .hot_rank {position:relative; margin-top:5.25em; display:flex; gap:25px;}
section.main_wrap .content .hot_rank > div {width:50%; height:auto;}
section.main_wrap .content .hot_rank h2 {font-size:1.375em; margin-bottom:1.375em}
section.main_wrap .content .hot_rank ul {width:100%; height:auto; margin:0; padding:0;}
section.main_wrap .content .hot_rank ul li {position:relative; padding:1.75em 0; border-bottom:1px solid rgba(211, 211, 211, 1); display:flex; align-items:flex-start; justify-content: space-between;}
section.main_wrap .content .hot_rank ul li .thumb {width:175px; height:95px; overflow:hidden;}
section.main_wrap .content .hot_rank ul li .thumb img {width:100%; height:100%; object-fit:cover; }
section.main_wrap .content .hot_rank ul li .info {position:relative; height:95px; flex:1;}
section.main_wrap .content .hot_rank ul li .info .rank {font-size:0.9375em; width:1.35em; height:1.35em; display:inline-flex; align-items:center; justify-content: center; font-weight:500; color:#fff; background:rgba(116, 103, 85, 1);}
section.main_wrap .content .hot_rank ul li:nth-child(2) .info .rank {background:rgba(173,173,173,1);}
section.main_wrap .content .hot_rank ul li .info .auth {font-size:1em; font-weight:600; margin-left:0.25em; color:rgba(25, 25, 25, 1); line-height:1.25em;} 
section.main_wrap .content .hot_rank ul li .info p {font-size:0.925em; font-weight:500; color:rgba(169,169,169,1); line-height:1.25; padding:0.75em 0;}
section.main_wrap .content .hot_rank ul li .info .small {position:absolute; bottom:0; left:0; color:rgba(105, 105, 105, 1); font-size:0.75em; font-weight:500;}
section.main_wrap .content .hot_rank ul li .info .small span {display:inline-block; background-position:left center; margin-right:1em; background-repeat:no-repeat;}
section.main_wrap .content .hot_rank ul li .info .view {background-image: url('/images/icon_hot_rank_view.png'); padding-left:2.25em;}
section.main_wrap .content .hot_rank ul li .info .like {background-image: url('/images/icon_hot_rank_like.png'); padding-left:2em;}
section.main_wrap .content .hot_rank ul li .info .fav {background-image: url('/images/icon_hot_rank_fav.png'); padding-left:1.5em;}

section.main_wrap .content .hot_rank ul li:nth-child(1) {display:block; width:100%; height:260px; overflow:hidden; border-radius:1em; box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15); padding:0;}
section.main_wrap .content .hot_rank ul li:nth-child(1) .thumb {position:absolute; width:100%; height:100%; top:0; left:0; z-index:1; overflow:hidden; }
section.main_wrap .content .hot_rank ul li:nth-child(1) .thumb img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .content .hot_rank ul li:nth-child(1) .info {position:relative; z-index:2; width:100%; height:100%; padding:0; color:rgba(221, 221, 221, 1); padding-left:40px; }
section.main_wrap .content .hot_rank ul li:nth-child(1) .info:before {position:relative; content:""; display:block; width:100%; height:calc(100% - 100px);}
section.main_wrap .content .hot_rank ul li:nth-child(1) .info:after {position:absolute; z-index:-1; content:""; width:100%; height:100px; bottom:0; left:0;  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);}
section.main_wrap .content .hot_rank ul li:nth-child(1) .info .rank {display:block; position:absolute; top:0.5em; right:0.5em; color:#fff; font-size:3.75em; font-weight:600; width:auto; height:auto; text-shadow:0 0 6px rgba(0,0,0,0.35), 0 0 2px rgba(0,0,0,0.25); line-height:1; background-color:transparent;}
section.main_wrap .content .hot_rank ul li:nth-child(1) .info .auth {position:relative; display:block; color:rgba(255, 219, 120, 1); font-weight:600; font-size:1.25em; line-height:1.25; margin-bottom:0.25em; margin-top:1em;}
section.main_wrap .content .hot_rank ul li:nth-child(1) .info .auth:after {content:""; position:absolute; display:inline-block; width:1.125em; height:1.125em; top:50%; transform: translateY(-50%); border-radius:1.125em; background:rgba(255, 219, 120, 1) url('/images/icon_hot_rank_medal.png') no-repeat center; margin-left:0.25em;}
section.main_wrap .content .hot_rank ul li:nth-child(1) .info p {color:rgba(221, 221, 221, 1); font-size:1em; font-weight:500; padding:0;}
section.main_wrap .content .hot_rank ul li:nth-child(1) .info .view,
section.main_wrap .content .hot_rank ul li:nth-child(1) .info .like,
section.main_wrap .content .hot_rank ul li:nth-child(1) .info .fav {display:none;}

section.main_wrap .content .monthly_cosplay_rank {position:relative; margin-top:6.3em;}
section.main_wrap .content .monthly_cosplay_rank h2 {font-size:1.625em; margin-bottom:0.5em;}
section.main_wrap .content .monthly_cosplay_rank p.subtitle {font-size:1em; font-weight:500; color:rgba(66, 66, 66, 1); margin-bottom:6em;}

section.main_wrap .content .btn_main_more {position:absolute; top:1em; right:0; display:block; font-size:0.875em; font-weight:500; padding-right:50px; background:url('/images/icon_btn_main_more.png') right center no-repeat;}
section.main_wrap .content .rank_box {width:100%; height:auto; display:flex; gap:25px; flex-wrap:wrap; align-items:center; justify-content: space-between;}
section.main_wrap .content .rank_box .rank {position:relative; width:30%; background:rgba(251, 251, 251, 1); border:1px solid rgba(238, 238, 238, 1); box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1); padding:2em 2em 6em 2em; display:flex; align-items:center; justify-content: center; gap:1em;}
section.main_wrap .content .rank_box .rank:before {content: ""; position: absolute; top: 0; left: 0; width: 65px; height: 65px; clip-path: polygon(0 0, 100% 0, 0 100%);}
section.main_wrap .content .rank_box .rank:nth-child(1) {order:2; transform:scale(1.2);}
section.main_wrap .content .rank_box .rank:nth-child(1):before {background: url('/images/icon_monthly_cosplay_crown.png?1') no-repeat 25% 25%,linear-gradient(135deg, rgba(255, 192, 4, 1), rgba(255, 228, 146, 1));}
section.main_wrap .content .rank_box .rank:nth-child(2) {order:3;}
section.main_wrap .content .rank_box .rank:nth-child(2):before {background: url('/images/icon_monthly_cosplay_crown.png?1') no-repeat 25% 25%,linear-gradient(135deg, rgba(136, 128, 103, 1), rgba(186, 177, 148, 1));}
section.main_wrap .content .rank_box .rank:nth-child(3) {order:1;}
section.main_wrap .content .rank_box .rank:nth-child(3):before {background: url('/images/icon_monthly_cosplay_crown.png?1') no-repeat 25% 25%,linear-gradient(135deg, rgba(166,166,166,1), rgba(222,222,222,1));}
section.main_wrap .content .rank_box .rank icon {width:100px; height:100px; border-radius:100px; overflow:hidden; background-color:rgba(0,0,0,0.05);}
section.main_wrap .content .rank_box .rank icon img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .content .rank_box .rank .info {flex:1;}
section.main_wrap .content .rank_box .rank .info span {display:block;}
section.main_wrap .content .rank_box .rank .info .auth {font-weight:500; font-size:1em; color:rgba(25, 25, 25, 1);}
section.main_wrap .content .rank_box .rank .info .like {font-size:1.25em; font-weight:600; color:#000; padding-left:1.25em; background:url('/images/icon_monthly_cosplay_like.png?1') left center no-repeat;}
section.main_wrap .content .rank_box .rank .vote {position:absolute; bottom:2em; left:50%; transform:translateX(-50%); width:calc(100% - 4em); padding:0.5em; text-align:center; font-size:1em; font-weight:500; border-radius:5px;}
section.main_wrap .content .rank_box .rank:nth-child(1) .vote {background:rgba(255, 202, 202, 1); border:1px solid rgba(255, 133, 133, 1); color:rgba(255, 86, 86, 1);}
section.main_wrap .content .rank_box .rank:nth-child(2) .vote {background:rgba(235, 238, 255, 1); border:1px solid rgba(202, 209, 245, 1); color:rgba(177, 187, 229, 1);}
section.main_wrap .content .rank_box .rank:nth-child(3) .vote {background:rgba(255, 231, 215, 1); border:1px solid rgba(255, 201, 165, 1); color:rgba(255, 177, 125, 1);}

section.main_wrap .content .main_recommend {position:relative; margin-top:10em;}
section.main_wrap .content .main_recommend .cate {position:relative; display:flex; gap:1.5em; align-items:center; justify-content: flex-start;}
section.main_wrap .content .main_recommend .cate li a {font-size:1em; font-weight:500; border-bottom:2px solid transparent; color:#000; padding:0.25em 0;}
section.main_wrap .content .main_recommend .cate li a:hover,
section.main_wrap .content .main_recommend .cate li a.active {border-bottom:2px solid rgba(25, 25, 25, 1); font-weight:700;}
section.main_wrap .content .main_recommend .list {position:relative; width:100%; height:auto; display:flex; align-items:flex-start; justify-content: space-between; gap:1.25em; margin-top:2em;}
section.main_wrap .content .main_recommend .list li {width:33%;}
section.main_wrap .content .main_recommend .list li .thumb {width:100%; height:355px; overflow:hidden; border:1px solid rgba(230, 230, 230, 1); }
section.main_wrap .content .main_recommend .list li .thumb img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .content .main_recommend .list li .info {margin-top:2em;}
section.main_wrap .content .main_recommend .list li .info .title {font-weight:600;}
section.main_wrap .content .main_recommend .list li .info .auth {font-size:0.875em; padding:0.5em 0; font-weight:500; color:rgba(169, 169, 169, 1);}
section.main_wrap .content .main_recommend .list li .info .tags {display:flex; gap:0.5em;}
section.main_wrap .content .main_recommend .list li .info .tags span {display:block; color:#fff; border-radius:5px; padding:0.25em 0.75em; font-size:0.75em; font-weight:500;}
section.main_wrap .content .main_recommend .list li .info .tags span.free {background:rgba(25, 25, 25, 1);}
section.main_wrap .content .main_recommend .list li .info .tags span.state.completed {background:rgba(227, 0, 0, 1);}
section.main_wrap .content .main_recommend .list li .info .tags span.state.ongoing {background:rgba(0, 137, 234, 1);}


section.main_wrap .right_ctt h2 {position:relative; font-weight:600; font-size:1.125em; line-height:1.25; width:100%;}
section.main_wrap .right_ctt h2 a {position:absolute; top:50%; right:0; transform:translateY(-50%); display:block; width:1.5em; height:1.5em; background:#ccc; text-indent: -999px; overflow:hidden; background: url('/images/icon_right_ctt_more.png') center center no-repeat;}
section.main_wrap .right_ctt .pickcre_guide {margin-top:3em;}
section.main_wrap .right_ctt .pickcre_guide .pickcre_guide_inner {position:relative; display:flex; flex-direction: column; align-items:center; justify-content: center; margin-top:3.35em; height:235px; overflow:hidden; border-radius:12px; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); background:url('/images/pickcre_guide_bg.png') no-repeat center; color:#fff;}
section.main_wrap .right_ctt .pickcre_guide .pickcre_guide_inner small {font-size:0.875em; font-weight:500; margin-bottom:1em;}
section.main_wrap .right_ctt .pickcre_guide .pickcre_guide_inner small strong {font-weight:600; color:rgba(238, 0, 0, 1);}
section.main_wrap .right_ctt .pickcre_guide .pickcre_guide_inner p {background: linear-gradient(180deg, #FFFFFF 52.55%, #878787 100.01%); -webkit-background-clip: text; background-clip: text; color: transparent; font-size:1.5em; font-weight:700; line-height:1.25; margin-bottom:1em;}
section.main_wrap .right_ctt .pickcre_guide .pickcre_guide_inner a {width:calc(100% - 70px); height:auto; background:rgba(255, 255, 255, 1); color:#000; font-size:0.9375em; font-weight:500; text-align:center; border-radius:8px; padding:1em;}

section.main_wrap .right_ctt .event {margin-top:1.25em; }
section.main_wrap .right_ctt .event h2 {border-bottom:2px solid rgba(25, 25, 25, 1); padding:0.75em 0;}
section.main_wrap .right_ctt .event .list li {position:relative; display:flex; align-items:flex-start; justify-content:space-between; padding:1.5em 0; border-bottom:1px solid rgba(226, 226, 226, 1);}
section.main_wrap .right_ctt .event .list li .thumb {width:130px; height:90px; overflow:hidden; border-radius:5px; background:rgba(0,0,0,0.1)}
section.main_wrap .right_ctt .event .list li .desc {position:relative; flex:1; height:90px;}
section.main_wrap .right_ctt .event .list li .desc .cate {font-size:0.9375em; font-weight:600;}
section.main_wrap .right_ctt .event .list li .desc .title {font-size:0.8125em; font-weight:500;}
section.main_wrap .right_ctt .event .list li .desc .info {position:absolute; bottom:0; left:0; display:flex; gap:1em; align-items: center;}
section.main_wrap .right_ctt .event .list li .desc .info icon {width:26px; height:26px; border-radius: 26px; overflow:hidden; background:rgba(0,0,0,0.1);}
section.main_wrap .right_ctt .event .list li .desc .info icon img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .right_ctt .event .list li .desc .info .auth {font-size:0.75em; color:#000; font-weight:500;}
section.main_wrap .right_ctt .event .list li .desc .info .time {font-size:0.625em; color:rgba(161, 161, 161, 1); font-weight:500;}


section.main_wrap .right_ctt .returns_rank {margin-top:2em;}
section.main_wrap .right_ctt .returns_rank h2 {border-bottom:2px solid rgba(25, 25, 25, 1); padding:0.75em 0;}
section.main_wrap .right_ctt .returns_rank .list {position:relative;}
section.main_wrap .right_ctt .returns_rank .list li {position:relative;counter-increment: item;}
section.main_wrap .right_ctt .returns_rank .list li .title {position:relative; display:flex; align-items:center; justify-content: space-between; border-bottom:1px solid rgba(221, 221, 221, 1); padding:1.25em 0;}
section.main_wrap .right_ctt .returns_rank .list li .title .number {display:block; width:2em; text-align:center; font-size:1.3125em; font-weight:600; color:rgba(114, 95, 61, 1);}
section.main_wrap .right_ctt .returns_rank .list li:nth-child(-n+3) .title .number {color:rgba(143, 143, 143, 1);}
section.main_wrap .right_ctt .returns_rank .list li .title .auth {flex:1; text-align:left; font-size:0.9375em; font-weight:600; color:rgba(25, 25, 25, 1);}
section.main_wrap .right_ctt .returns_rank .list li .title .rank {display:block; width:4em; text-align:right; font-size:1.0625em; font-weight:500; padding-left:1em; background-repeat: no-repeat; background-position: left center;}
section.main_wrap .right_ctt .returns_rank .list li .title .rank.up {background-image: url('/images/icon_returns_rank_up.png');}
section.main_wrap .right_ctt .returns_rank .list li .title .rank.down {background-image: url('/images/icon_returns_rank_down.png');}
section.main_wrap .right_ctt .returns_rank .list li .title .rank.steady {background-image: url('/images/icon_returns_rank_steady.png');}

section.main_wrap .right_ctt .returns_rank .list li .detail {background:rgba(25, 25, 25, 1); border-radius:10px; overflow:hidden; color:#fff;}
section.main_wrap .right_ctt .returns_rank .list li .detail .info {display:flex; align-items:center; justify-content: space-between;}
section.main_wrap .right_ctt .returns_rank .list li .detail .info .thumb {width:115px; height:115px; border-radius:8px; overflow:hidden;}
section.main_wrap .right_ctt .returns_rank .list li .detail .info .thumb img {width:100%; height:100%; object-fit:cover;}
section.main_wrap .right_ctt .returns_rank .list li .detail .info .desc {flex:1; margin-left:1em; display:flex; flex-direction: column;gap:0.25em; justify-content: flex-start;}
section.main_wrap .right_ctt .returns_rank .list li .detail .info .desc .auth {position:relative; display:block; width:max-content; font-size:0.9375em; font-weight:600;}
section.main_wrap .right_ctt .returns_rank .list li .detail .info .desc .auth:after {content:counter(item) "rd"; position:absolute; display:block; right:-3.5em; top:50%; transform: translateY(-50%); padding:0.125em 0.75em; background:rgba(255, 226, 112, 1); border-radius:4px; font-size: 1.0625em; font-weight:600; color:rgba(25, 25, 25, 1);}
section.main_wrap .right_ctt .returns_rank .list li .detail .info .desc .rank,
section.main_wrap .right_ctt .returns_rank .list li .detail .info .desc p {font-size:0.8125em; font-weight:400;}
section.main_wrap .right_ctt .returns_rank .list li .detail .time {width:100%; border-radius:7px; margin-top:0.5em; font-size:1.75em; font-weight:700; padding:0.75em 0 1em; text-align:center;} 
section.main_wrap .right_ctt .returns_rank .list li .detail .time {background:linear-gradient(rgba(25, 25, 25, 1), rgba(25, 25, 25, 1)) padding-box, linear-gradient(45deg, rgba(255, 226, 112, 1), rgba(255, 240, 179, 1)) border-box; border: 3px solid transparent; }
section.main_wrap .right_ctt .returns_rank .list li .detail .time span {display:inline-block; position:relative; line-height:1;}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span:before {content:":"; position:relative; display:inline-block; width:0.75em;}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span:first-child:before {content:""; width:0;}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span:after {content:""; font-size:0.35em; line-height:1.25; position:absolute; bottom:-1.25em; left:50%; transform:translateX(-50%); font-weight:500; color:rgba(175, 175, 175, 1); margin-left:0.75em;}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span:first-child:after {margin-left:0;}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span.day:after {content:"day";}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span.hour:after {content:"hour";}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span.min:after {content:"min";}
section.main_wrap .right_ctt .returns_rank .list li .detail .time span.sec:after {content:"sec";}


section.main_wrap .right_ctt .returns_rank .list li .title {max-height: max-content; overflow: hidden; transition: max-height 0.35s ease, opacity 0.28s ease, transform 0.28s ease, padding 0.28s ease; opacity: 1; transform: translateY(0); }
section.main_wrap .right_ctt .returns_rank .list li.active .title {opacity: 0; transform: translateY(-8px); max-height: 0; padding:0;}

section.main_wrap .right_ctt .returns_rank .list li .detail {padding:0; margin:0; max-height:0; opacity: 0; overflow:hidden;transform: translateY(-8px); transition: max-height 0.45s ease, opacity 0.35s ease, transform 0.35s ease, padding 0.35s ease;}
section.main_wrap .right_ctt .returns_rank .list li.active .detail {opacity: 1; transform: translateY(0); max-height: max-content; margin-top:1.25em; padding:30px; margin:1.25em 0; }



footer {width:100%; position:relative; margin-top:2em; background:rgba(25, 25, 25, 1); padding:60px 0;}
footer .footer_inner {width:100%; max-width:var(--body-max-width); margin:0 auto; display:flex; align-items:flex-start; justify-content:space-between; color:#fff;}
footer .footer_inner .info {flex:1; }
footer .footer_inner .info img {width:auto; height:auto;}
footer .footer_inner .info p {font-size:0.9375em; line-height:1.8; font-weight:600; margin:0.5em 0;}
footer .footer_inner .info p span {position:relative; display:inline-block; padding-left:1.5em;}
footer .footer_inner .info p span:before {content:""; position:absolute; width:1px; height:1em; top:50%; left:0.75em; transform:translateY(-50%); background:#fff;}
footer .footer_inner .info p.copy {font-size:0.875em; font-weight:400;}
footer .footer_inner .btns {width:max-content; text-align:right;}
footer .footer_inner .btns a {display:inline-block; font-size:0.875em; font-weight:600; margin-right:20px; background:rgba(0, 138, 197, 1); border-radius:4px; color:#fff; line-height:1.25; padding:0.5em 1.25em;}