* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    font-size: 62.5%; /*기본 폰트사이즈 10px*/
}
body {
    font-size: 1.6rem;
    cursor: default; /*기본커서*/
    padding-right: 0 !important; /* sweetalert2 페딩방지용 */
    font-family: 'Pretendard', 'Noto Sans', sans-serif;
    margin: 0;
    background-image: url(/images/squidNFT/default/background.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    min-height: 100%;
    color: var(--Gold100);
    line-height: normal;
}
label{
    margin-bottom: 0;
}
/* 숫자에만 폰트 montserrat사용 */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: local(''), url('font/righteous/Righteous-Regular.ttf') format('truetype');
    unicode-range: U+0030-0039;
}
@font-face {
    font-family: 'ubuntu-b';
    font-style:normal;
    font-weight: 700;
    src: local(''), url('font/ubuntu/Ubuntu-Bold.ttf') format('truetype');
}

body::-webkit-scrollbar,
div::-webkit-scrollbar,
textarea::-webkit-scrollbar {
    width: 4px;
}
body::-webkit-scrollbar-thumb,
div::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb {
    background-color: var(--gray400);
    border-radius: 2px;
}
body::-webkit-scrollbar-track,
div::-webkit-scrollbar-track,
textarea::-webkit-scrollbar-thumb {
    background-color: transparent;
}

li {
    list-style: none;
}
ul {
    padding-left: 0;
    margin-bottom: 0;
}
a {
    text-decoration: none;
    color: initial;
    cursor: pointer;
}
a:hover {
    text-decoration: none;
    color: inherit;
}
h6,
.h6,
h5,
.h5,
h4,
.h4,
h3,
.h3,
h2,
.h2,
h1,
.h1,
p,
span {
    margin: 0;
    padding: 0;
}
h1 {
    font-size: 64px;
}
h1,
h2 {
    font-weight: 700;
    line-height: 1.3;
}
h2 {
    font-size: 50px;
}
h3 {
    font-size: 40px;
}
h3,
h4 {
    font-weight: 700;
    line-height: 1.3;
}
h4 {
    font-size: 36px;
    letter-spacing: 0;
}
h5 {
    font-size: 24px;
}
h5,
h6 {
    font-weight: 700;
    line-height: 1.3;
}
h6 {
    font-size: 22px;
}
.subtitle,
h6 {
    letter-spacing: 0;
}
h1,h2,h3,h4,h5,h6{
    font-family: 'ubuntu-b','Pretandard','Noto sans';
}
/* 익스플로러 select박스 x표시 지움 */
select::-ms-expand {
    display: none;
}
a:focus{
    text-decoration: none;
}

/* 셀렉트박스 */
.select_box {
    padding: 17px 24px;
    width: 200px;
    height: 60px;
    border-radius: 4px;
    color: inherit;
    background-color: transparent;
    border: 1px solid var(--gray400);
    font-size: 16px;
    letter-spacing: 0;
    line-height: 1.6;
    outline: 0 none;
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    transition: 0.2s;
}
.select_wrap{
    position: relative;
}
.select_arrow{
    position: absolute;
    top:22px;
    color: var(--black) !important;
    font-size: 14px;
    right: 10px;
    transition: 0.2s;
    background-repeat: no-repeat;
    background-size: contain;
}

.select_box:focus {
    border: 1px solid var(--black);
}
/* input */
input,
textarea,
button {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}
input:focus{
    border: 1px solid var(--Gold100);
}
input::-webkit-input-placeholder {
    color: var(--Gold200);
    font-size: 16px;
    font-weight: 400;
}
input:-ms-input-placeholder {
    color:var(--Gold200);
    font-size: 16px;
    font-weight: 400;
}
textarea::-webkit-input-placeholder {
    color:var(--Gold200);
    font-size: 16px;
    font-weight: 400;
}
textarea:-ms-input-placeholder {
    color:var(--Gold200);
    font-size: 16px;
    font-weight: 400;
}
input::placeholder {
    color:var(--Gold200);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}
textarea::placeholder {
    color: var(--Gold200);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}
textarea:focus,
input:focus {
    outline: none;
    box-shadow: 0 0 0 2px var(--Gold300);
}
.row:after, .row:before {
    content: none;
}

/* grid.scss 초기화용 */
.row > * {
    padding: 0;
    margin: 0;
}
.row {
    --bs-gutter-y: 0;
    --bs-gutter-x: 0;
    margin: 0;
}
/* 그리드 관련 */
.container {
    margin: 0 auto;
}
.row {
    display: flex;
    flex-wrap: wrap;
}
.grid {
    position: relative;
    width: 100%;
}
.g12 {
    width: 8.333333%;
}
.g11 {
    width: 9.09%;
}
.g10 {
    width: 10%;
}
.g8 {
    width: 12.5%;
}
.g60p {
    width: 60%;
}
.g5 {
    width: 20%;
}
.g4 {
    width: 25%;
}
.g40p {
    width: 40%;
}
.g3 {
    width: 33.333333%;
    padding: 0;
}
.g2 {
    width: 50%;
}
.g4-3 {
    width: 75%;
}
.g3-2 {
    width: 66.666666%;
}
.w-100 {
    width: 100%;
}
.w-50 {
    width: 50%;
}
.w-920 {
    width: 920px;
}
.bg-test-box {
    background: rgba(255, 0, 0, 0.1);
    height: 125px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.bg-test-container {
    background: rgba(255, 0, 0, 0.05);
}
.bg-test-container .grid {
    padding-top: 0;
    padding-bottom: 0;
}

/* .subtitle {
    font-size: 20px;
    line-height: 1.3;
} */

/* 폰트 */
.noto {
    font-family: 'Noto Sans', sans-serif;
}
.mont {
    font-family: 'Montserrat', sans-serif;
}

/* 폰트 스타일 */
.bold {
    font-weight: 700;
}
.regular {
    font-weight: 400;
}
.underline {
    text-decoration: underline;
}

.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}

.count,
.tag {
    font-size: 14px;
    letter-spacing: 0;
}
.count {
    font-family: 'Montserrat', sans-serif;
}

.text-underline {
    text-decoration: underline;
    text-underline-position: under;
    -webkit-text-decoration: underline solid 1px;
    text-decoration: underline solid 1px;
}
.text-overlay {
    position: absolute;
    bottom: 0;
    top: 80px;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), var(--white) 64.24%);
    width: 100%;
    height: 80px;
}
.word_break {
    word-break: break-all;
}
/* 폰트사이즈 */

.font-sz16 {
    font-size: 16px;
}
.p-18 {
    font-size: 18px;
}
.p-22 {
    font-size: 22px;
}
.font-sz24 {
    font-size: 24px;
}
.font-sz20 {
    font-size: 20px;
}
.p-30 {
    font-size: 30px;
}

.font-sz40 {
    font-size: 40px;
}

.hide{
    display: none;
}
.hides{
    display: none;
}

/* 플렉스 관련 */
.flex {
    display: flex;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}
.flex-row {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}
.flex-line {
    display: flex;
    align-items: baseline;
}
.flex-end {
    display: flex;
    justify-content: flex-end;
}
.flex-row-align-center {
    display: flex;
    align-items: center;
}
.flex-row-justify-center {
    display: flex;
    justify-content: center;
}
.flex-space {
    display: flex;
    justify-content: space-between;
}
.flex-row-center {
    display: flex;
    justify-content: center;
    align-items: center;
}
.flex1 {
    flex: 1 1;
}
.flex-1_1_0 {
    flex: 1 1 0%;
}
.float {
    float: left;
}
/* 포지션관련 */
.relative {
    position: relative;
}
/* margin관련 클래스 */
.m-auto {
    margin: 0 auto;
}
.margin-0 {
    margin: 0 auto;
}
.mt-8p {
    margin-top: 8px;
}
.mt-10p {
    margin-top: 10px;
}
.mt-12p {
    margin-top: 12px;
}
.mt-15p {
    margin-top: 15px;
}
.mt-16p {
    margin-top: 16px;
}
.mt-17p {
    margin-top: 17px;
}
.mt-20p {
    margin-top: 20px;
}
.mt-24p {
    margin-top: 24px;
}
.mt-30p {
    margin-top: 30px;
}
.mt-32p {
    margin-top: 32px;
}
.mt-40p {
    margin-top: 40px;
}
.mt-60p {
    margin-top: 60px;
}
.mt-50p {
    margin-top: 50px;
}
.mt-73p {
    margin-top: 73px;
}
.mt-100p {
    margin-top: 100px;
}
.mt-118p {
    margin-top: 118px;
}
.mt-120p {
    margin-top: 120px;
}
.mt-130p {
    margin-top: 130px;
}
.mt-140p {
    margin-top: 140px;
}
.mt-150p {
    margin-top: 100px;
}
.mb-5p {
    margin-bottom: 5px;
}
.mb-8p {
    margin-bottom: 8px;
}
.mb-10p {
    margin-bottom: 10px;
}
.mb-20p {
    margin-bottom: 20px;
}
.mb-24p {
    margin-bottom: 24px;
}
.mb-30p {
    margin-bottom: 30px;
}
.mb-40p {
    margin-bottom: 40px;
}
.mb-60p {
    margin-bottom: 60px;
}
.mb-110p {
    margin-bottom: 110px;
}
.mb-150p {
    margin-bottom: 150px;
}
.mb-500p {
    margin-bottom: 500px;
}
.mr-4p {
    margin-right: 4px;
}
.mr-8p {
    margin-right: 8px;
}
.mr-9p {
    margin-right: 9px;
}
.mr-10p {
    margin-right: 10px;
}
.mr-11p {
    margin-right: 11px;
}
.mr-12p {
    margin-right: 12px;
}
.mr-15p {
    margin-right: 15px;
}
.mr-20p {
    margin-right: 20px;
}
.mr-30p {
    margin-right: 30px;
}

.mr-40p {
    margin-right: 40px;
}

.ml-4p {
    margin-left: 4px;
}
.ml-10p {
    margin-left: 10px;
}
.ml-12p {
    margin-left: 12px;
}
.ml-15p {
    margin-left: 15px;
}
.ml-20p {
    margin-left: 20px;
}
.ml-25p {
    margin-left: 25px;
}
.ml-30p {
    margin-left: 30px;
}
.ml-40p {
    margin-left: 40px;
}
/* 패딩관련 클래스 */
.pt-10p {
    padding-top: 10px;
}
.pt-40p {
    padding-top: 40px;
}
.pt-60p {
    padding-top: 60px;
}
.pr-0 {
    padding-right: 0;
}
.pr-20p {
    padding-right: 20px;
}
.pl-0 {
    padding-left: 0;
}
.pl-20p {
    padding-left: 20px;
}
.pl-60 {
    padding-left: 60px;
}

.pb-10p {
    padding-bottom: 10px;
}
.pb-20p {
    padding-bottom: 20px;
}
.pb-30 {
    padding-bottom: 30px;
}
.pb-150 {
    padding-bottom: 150px !important;
}

/* 색상관련 클래스 */
:root {
    --white: #fff;
    --black: #000;
    --link: #0d66d0;
    --rating: #ff8a34;
    --positive: #20a666;
    --gray100: #fff;
    --gray150: #e8e8ed;
    --gray200: #e7e7e7;
    --gray300: #ddd;
    --gray400: #c3c3c3;
    --gray500: #aaa;
    --gray600: #838383;
    --gray700: #636363;
    --gray800: #424242;
    --gray900: #1c1e21;
    --gray1000: #333;
    --red: #eb362a;
    --redhover: #ff624d;
    --blue: #0e75ff;
    --gradation1: #f43838;
    --gradation2: linear-gradient(135deg, #f43838, #f69650);
    --language: #f6b4d2;
    --media: #ebb85c;
    --tech: #1a5561;
    --arts: #624f30;
    --writing: #b5afe5;
    --economy: #001aa5;
    --start-up: #f06d5b;
    --life: #0599ed;
    --sale: #f24d37;
    --all: #1c1e21;
    --sports: #6d63e4;
    --metaverse: #53bbbb;
    --thesis: #7aa566;
    --journal: #c7ac83;
    --collection: #1f779c;
    --main-background1: #eff8ff;
    --auraBlue:#30A3FF;
    --bg:rgba(255,255,255,0.15);
    --box:rgba(0,0,0,0.15);
    --blur:3px;
    --Gold100:#101F47;
    --Gold200:#B6BBCF;
    --Gold300:#7EA0BF;
    --Gold500:#5B7DD2;
    --Gray100:#FFF;
    --Gray200:#707F8D;
}


/* 인풋 셀렉트 등 */
.bg_style{
    background-color: var(--bg);
    backdrop-filter: blur(var(--blur));
    border: 1px solid var(--Gold100);
}
.bg_style::placeholder{
    color:var(--Gold200);
}
.r-10p{
    border-radius: 10px;
}

/* 버튼스타일 */
.bt_style{
    background-color: var(--bg);
    backdrop-filter: blur(var(--blur));
    border: 1px solid var(--Gold300);
    transition: 0.1s;
    color: var(--Gold100);
    font-weight: normal;
}

.box_size_s{
    width: 100%;
    border-radius: 4px;
    padding: 10px 15px;
    font-size: 16px;
}
.box_size_b{
    width: 100%;
    border-radius: 4px;
    padding: 20px;
}

.bt_style:hover{
    border-color: var(--Gold100);
    outline: none;
    box-shadow: 0 0 0 2px var(--Gold300);
}
.main_sub_swiper.bt_style:hover{
    border-color: var(--Gold100);
    outline: 0;
    outline: none;
    box-shadow: 0 0 0 2px transparent;
}
.bt_style2{
    background-color: var(--bg);
    backdrop-filter: blur(var(--blur));
    border: 1px solid var(--Gold100);
    transition: 0.2s;
    color: var(--Gray100);
    background-color: var(--Gold500);
    font-weight: normal;
    transition: 0.2s;
}
.bt_style2:hover{
    background-color: var(--Gold100);
}
/* section */
.box_style{
    background-color: var(--bg);
    backdrop-filter: blur(var(--blur));
    border: 1px solid var(--Gold300);
    border-radius: 7px;
}
.box_style2{
    background-color: var(--bg);
    backdrop-filter: blur(var(--blur));
    border: 1px solid var(--Gold100);
    border-radius: 7px;
}
.box_style3{
    background-color: var(--bg);
    border: 1px solid var(--Gold300);
    border-radius: 7px;
    padding: 0 30px;
}

.input_size2{
    border-radius: 6px;
    margin-bottom: 20px;
    font-size: 16px;
    padding: 15px; 
    width: 100%;
    display: block;
    max-width: 240px;
}
.video_filter{
    filter:sepia(100%) grayscale(0%) brightness(234%) saturate(75%) hue-rotate(-175deg);
}
.swal2-html-container{
    font-size: 16px;
}
.swal2-content{
    background-image: url(/images/squidNFT/default/background.png);
    background-size: 100%;
}
.submit-modal{
    background-image: url(/images/squidNFT/default/background.png);
    background-size: 100%;
    border:1px solid var(--Gold500);
    border-radius:7px;
    overflow-y: auto;
    padding: 30px;
    height: auto;
    width: 100%;
    max-width: 500px;
    margin: 150px auto;
    position: relative;
}
.pd-30p{
    padding: 30px;
}
.a:focus{
    text-decoration: none;
}
.input_size{
    border-radius: 4px;
    margin-bottom: 20px;
    font-size: 16px;
    padding: 15px; 
    width: 100%;
    display: block;
    max-width: 320px;
}
.container::after,
.container::before{
    display: inherit;
    content:none;
}
.list_sale{
    display: none;
}
.ubuntu{
    font-family: 'ubuntu-b', 'Pretandard','Noto sans';
}
.c100{
    color: var(--Gold100);
}
.c300{
    color: var(--Gold300);
}

.c500{
    color: var(--Gold500);
}
/* squidNFT 추가분 22-11-08 끝*/
.white {
    color: var(--white);
}
.bg-white {
    background-color: var(--white);
}
.black {
    color: var(--black);
}
.link {
    color: var(--link);
}
.bg-link {
    background-color: var(--link);
}
.rating {
    color: var(--rating);
}
.bg-rating {
    background-color: var(--rating);
}
.positive {
    color: var(--positive);
}
.bg-positive {
    background-color: var(--positive);
}
.bg-black {
    background-color: var(--black);
}
.gray100 {
    color: var(--gray100);
}
.bg-gray100 {
    background-color: var(--gray100);
}
.gray200 {
    color: var(--gray200);
}
.bg-gray200 {
    background-color: var(--gray200);
}
.gray300 {
    color: var(--gray300);
}
.bg-gray300 {
    background-color: var(--gray300);
}
.gray400 {
    color: var(--gray400);
}
.bg-gray400 {
    background-color: var(--gray400);
}
.gray500 {
    color: var(--gray500);
}
.bg-gray500 {
    background-color: var(--gray500);
}
.gray600 {
    color: var(--gray600);
}
.bg-gray600 {
    background-color: var(--gray600);
}
.gray700 {
    color: var(--gray700);
}
.bg-gray700 {
    background-color: var(--gray700);
}
.gray800 {
    color: var(--gray800);
}
.bg-gray800 {
    background-color: var(--gray800);
}
.gray900 {
    color: var(--gray900);
}
.bg-gray900 {
    background-color: var(--gray900);
}
.gray1000 {
    color: var(--gray1000);
}
.Gold100{
    color: var(--Gold100);
}
.Gold200{
    color: var(--Gold200);
}
.Gold300{
    color: var(--Gold300);
}
.Gold500{
    color: var(--Gold500);
}
.red {
    color: var(--red);
}
.bg-red {
    background-color: var(--red);
}
.bg-redhover {
    background-color: var(--redhover);
}
.blue {
    color: var(--blue);
}
.gradation {
    background: var(--gradation1);
    background: var(--gradation2);
}
.language {
    color: var(--language);
}
.c-language {
    background-color: var(--language);
}
.b-language {
    border-color: var(--language);
}
.blur-language {
    background: rgba(246, 180, 210, 0.7);
}

.tech {
    color: var(--tech);
}
.c-tech {
    background-color: var(--tech);
}
.b-tech {
    border-color: var(--tech);
}
.blur-tech {
    background: rgba(26, 85, 97, 0.8);
}

.writing {
    color: var(--writing);
}
.c-writing {
    background-color: var(--writing);
}
.b-writing {
    border-color: var(--writing);
}
.blur-writing {
    background: rgba(181, 175, 229, 0.6);
}

.life {
    color: var(--life);
}
.b-life {
    border-color: var(--life);
}
.c-life {
    background-color: var(--life);
}
.blur-life {
    background: rgba(5, 153, 237, 0.6);
}

.media {
    color: var(--media);
}
.b-media {
    border-color: var(--media);
}
.c-media {
    background-color: var(--media);
}
.blur-media {
    background: rgba(235, 184, 92, 0.7);
}

.arts {
    color: var(--arts);
}
.c-arts {
    background-color: var(--arts);
}
.b-arts {
    border-color: var(--arts);
}
.blur-art {
    background: rgba(98, 79, 48, 0.6);
}

.economy {
    color: var(--economy);
}
.c-economy {
    background-color: var(--economy);
}
.b-economy {
    border-color: var(--economy);
}
.blur-economy {
    background: rgba(0, 26, 165, 0.8);
}

.start-up {
    color: var(--start-up);
}
.c-start-up {
    background-color: var(--start-up);
}
.b-start-up {
    background-color: var(--start-up);
}
.blur-start-up {
    background: rgba(240, 109, 91, 0.8);
}

.sale {
    color: var(--sale);
}
.c-sale {
    background-color: var(--sale);
}
.b-sale {
    background-color: var(--sale);
}
.blur-sale {
    background: rgba(242, 77, 55, 0.8);
}

.c-all {
    background-color: var(--all);
}
.b-all {
    border-color: var(--all);
}
.all {
    color: var(--all);
}

.sports {
    color: var(--sports);
}
.c-sports {
    background-color: var(--sports);
}
.b-sports {
    border-color: var(--sports);
}
.blur-sports {
    background: rgba(109, 99, 228, 0.8);
}
.metaverse {
    color: var(--metaverse);
}
.c-metaverse {
    background-color: var(--metaverse);
}
.b-metaverse {
    border-color: var(--metaverse);
}
.blur-metaverse {
    background: rgba(83, 187, 187, 0.8);
}
.thesis {
    color: var(--thesis);
}
.c-thesis {
    background-color: var(--thesis);
}
.b-thesis {
    border-color: var(--thesis);
}
.blur-thesis {
    background: rgba(122, 165, 102, 0.8);
}

.journal {
    color: var(--journal);
}
.c-journal {
    background-color: var(--journal);
}
.b-journal {
    border-color: var(--journal);
}
.blur-journal {
    background: rgba(199, 172, 131, 0.8);
}

.collection {
    color: var(--collection);
}
.c-collection {
    background-color: var(--collection);
}
.b-collection {
    border-color: var(--collection);
}
.blur-collection {
    background: rgba(31, 119, 156, 0.8);
}
/* 그림자 */
.shadow {
    box-shadow: 0 8px 32px rgba(28, 30, 33, 0.08);
}
/* 커서 */
.cursor {
    cursor: pointer;
}

input::placeholder{
    font-size: 16px;
    color: var(--Gold200);
}
.category_main_box .select_arrow{
    right: 3rem;
    top:24px;
}

/* 미디어쿼리 */

@media (max-width: 1400px)
{
	.flex-space{
		margin-right: 20px;
	}
}

@media (max-width: 1263px) {
    .g3,
    .g4,
    .g12 {
        width: 50%;
    }
    .g2 {
        width: 100%;
    }
    h1 {
        font-size: 42px;
    }
    h2 {
        font-size: 30px;
    }
    h3 {
        font-size: 26px;
    }
    h4 {
        font-size: 24px;
    }
    h5,
    h6 {
        font-size: 20px;
    }
    .subtitle {
        font-size: 18px;
    } 
    .count,
    .tag {
        font-size: 14px;
    }
}
@media (max-width: 767px) {
	
	.flex-space {
		margin-top: 10px;
		margin-right: 0;
		padding: 0 20px;
	}

    .g3,
    .g4,
    .g12 {
        width: 100%;
    }
}

@media (min-width: 1447px) {
    .container {
        max-width: 1350px;
    }
}



/*  이미지 스타일 */

.bg-img {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-img-test {
    background-position: 50% 10%;
    background-repeat: no-repeat;
    background-size: cover;
}

.r-img {
    width: 100%;
    height: auto;
}

.img_box {
    position: relative;
}

.border-radius {
    border-radius: 16px;
}
/* images end */

/* test */
.styleguide .grid {
    padding-top: 50px;
    padding-bottom: 50px;
    align-items: center;
    text-align: center;
}
/* test end */

/* 프로젝트 스타일 */
.box-project {
    margin-bottom: 34px;
}
.box-project-cover {
    height: 320px;
    border-radius: 16px;
    position: relative;
    background-size: 100% 100%;
    transition: background-size 0.4s ease;
}
.box-project-cover:hover {
    background-size: 120% 120%;
    transition: background-size 0.4s ease;
}
.project-bottom-box {
    padding: 24px 20px;
}
.project-bottom-box img {
    width: 16px;
    height: 16px;
    margin-right: 4px;
    margin-top: 2px;
}
.project-subtitlebox {
    padding-top: 10px;
    height: 85px;
}

.projectbox-hr {
    background-color: var(--gray500);
    height: 0.5px;
    width: 100%;
    opacity: 0.5;
    margin-top: 16px;
    margin-bottom: 16px;
}

.project_main_container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 920px;
    height: 528px;
    margin: 120px auto 100px;
}

.project_main_img {
    width: 440px;
    height: 440px;
    object-fit: cover;
    border-radius: 24px;
    margin-right: 60px;
}
/* 버튼 스타일 */
.btn-normal {
    padding: 0 40px;
    height: 60px;
    font-size: 20px;
}
.btn-normal,
.btn-normal2 {
    border: 1px solid var(--gray400);
    border-radius: 4px;
    color: var(--black);
    background-color: var(--white);
    font-weight: 700;
    cursor: pointer;
}
.btn-normal2 {
    width: 200px;
    height: 48px;
    font-size: 16px;
}
.pick_btn {
    position: absolute;
    left: 360px;
    top: 20px;
    width: 61px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 48px;
    background: rgba(28, 30, 33, 0.4);
    font-weight: 700;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}
.project_main_right {
    width: 420px;
    padding: 31px 0;
    height: 440px;
}
.project_magin_text {
    font-size: 40px;
    line-height: 52px;
    letter-spacing: -2%;
}
.project_p_margin {
    margin-left: 9px;
}
.project_slider_dot {
    width: 10px;
    height: 10px;
    border-radius: 5px;
}
.project_small_card_container {
    background-color: var(--gray100);
    width: 100%;
    padding: 60px 0;
    margin-bottom: 100px;
}
.project_small_card {
    background-color: var(--white);
    min-height: 160px;
    border-radius: 16px;
    display: flex;
}
.project_small_card_box {
    min-width: 240px;
    height: 160px;
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
    background-size: 100% 100%;
    transition: background-size 0.4s ease;
}
.project_small_card_box:hover {
    background-size: 120% 120%;
    transition: background-size 0.4s ease;
}
.project_small_card_box_right {
    padding: 0 40px 0 0;
}
.project_small_card_text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-left: 40px;
    padding-right: 40px;
}

/* 검색 스타일 */
.block-search-wrapper {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    padding: 40px 0 0;
}
.block-search {
    width: 440px;
    height: 60px;
    border: 1px solid var(--gray400);
    border-radius: 4px;
    padding-left: 44px;
}

/* 값 없음 스타일 */
.no-result {
    padding: 240px 0 360px;
}
/* 북마크 */
.bookmark-wrapper {
    width: 60px;
    height: 60px;
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    border: 1px solid var(--gray300);
}

.card-right-buy-btn {
    width: 100%;
    height: 60px;
    border: none;
    border-radius: 4px;
    background: linear-gradient(127.03deg, #40D0FB 0%, #0060E0 100.6%);
    transition: 0.2s;
}

.bg-img-about {
    background-size: cover;
    background-position: 50% 33%;
    border-radius: 4px;
}

/* 카테고리 스타일 */
.category-bottom-box {
    height: 270px;
    padding: 30px 40px 20px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 0 0 16px 16px;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}
.categorybox-title {
    height: 100px;
    word-break: break-all;
    padding-top: 12px;
}
.categorybox-hr {
    background-color: var(--white);
    height: 0.5px;
    width: 100%;
    opacity: 0.3;
    margin-top: 24px;
    margin-bottom: 20px;
}
.category {
    position: absolute;
    height: 32px;
    display: flex;
    padding: 0 16px 0 8px;
    align-items: center;
    top: 20px;
    left: 20px;
    border-radius: 48px;
    background-color: rgba(255, 255, 255, 0.7);
}
.category_c {
    width: 16px;
    height: 16px;
    margin-right: 8px;
    border-radius: 8px;
}
.category-tagbox p {
    line-height: normal;
}

/* 크리에이터 스타일 */
.creator-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.creator-img {
    width: 96px;
    height: 96px;
    border-radius: 48px;
    margin-right: 24px;
}
.creator-text {
    position: relative;
}

.contents {
    height: 46px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--gray200);
    margin-bottom: 20px;
}
.contents-player {
    height: 24px;
    border-radius: 15px;
    padding: 0 10px;
    display: flex;
    align-items: center;
}
.contents-overlay {
    position: absolute;
    bottom: 28px;
    width: 680px;
    height: 86px;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), var(--white) 64.24%);
}

/* 디테일 스타일 */
.detail-m-ad {
    height: 280px;
    margin-top: 100px;
}
.detail-ad-contents {
    width: 680px;
    height: 160px;
    display: flex;
    margin: 0 auto;
    border-radius: 16px;
    background-color: var(--white);
}
.detail-reviews {
    flex: 1 1;
    border: 1px solid var(--gray200);
    border-radius: 2px;
    margin-top: 30px;
}
.detail-reviews-total {
    margin: 0 auto;
    width: 416px;
    padding: 25px 0;
    display: flex;
}

/* 토탈 스타일 */
.rate-total-left {
    width: 163px;
    padding: 14px 0;
    border-right: 1px solid var(--gray200);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.total-t {
    margin-left: 5px;
    margin-top: 22px;
}
.rate-total-right {
    width: 258px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
.rate-star {
    width: 16px;
    height: 16px;
    margin-right: 4px;
}
.rate-star-g {
    width: 12px;
    height: 12px;
    margin-right: 2px;
}
.rate-progress-bar {
    width: 160px;
    height: 4px;
    position: relative;
}
.rate-progress-bar-f {
    position: absolute;
    width: 127px;
    height: 4px;
}

/* 리뷰 스타일 */
.reviews-tab {
    margin-top: 40px;
    display: flex;
    justify-content: flex-end;
}
.reviews-card-status {
    height: 24px;
    border-radius: 12px;
    padding: 0 10px;
    margin-left: 10px;
}
.review-card {
    margin-top: 40px;
}
.reviews-overlay {
    width: 100%;
    height: 80px;
    background-color: var(--language);
    position: absolute;
    bottom: 30px;
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), var(--white) 64.24%);
}

/* 커뮤니티 스타일 */
.community-comment-wrapper {
    width: 100%;
    height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 4px;
    padding: 20px 0 20px 120px;
}
.community-comment {
    resize: none;
    width: calc(100% - 20px);
    height: 92px;
    border: none;
}
.community-comment::-webkit-input-placeholder {
    font-size: 16px;
}
.community-comment:-ms-input-placeholder {
    font-size: 16px;
}
.community-comment::placeholder {
    font-size: 16px;
}
.add-photo {
    width: 80px;
    height: 80px;
}
.comment-done-btn {
    border-radius: 4px;
    outline: none;
    border: none;
    cursor: pointer;
}

/* 크리에이터 카드 */
.creator-c {
    background: linear-gradient(127.03deg, var(--gradation1) 20.43%, #f79650 91.17%);
    border-radius: 12px;
    padding: 2px 10px;
    margin-left: 10px;
}

/* 코멘트 스타일 */
.comment-body {
    padding: 16px 0 20px;
}
.community-c-like {
    padding: 0 8px;
    height: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid var(--gray300);
    box-sizing: border-box;
    border-radius: 4px;
}

/* 이미지 모달 스타일 */
.img-modal-container {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 13;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.img-modal-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
}
.img-modal-contents {
    width: 920px;
    z-index: 100;
}
.img-close {
    display: flex;
    justify-content: flex-end;
}

.payement-goods-img {
    width: 80px;
    height: 80px;
    border-radius: 4px;
}
.payment-goods-text {
    margin-top: 10px;
    margin-bottom: 17px;
}
.payments-contents {
    margin: 40px 0 150px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.payments-contents-row {
    display: grid;
    grid-template-columns: 32% 65%;
    grid-column-gap: 3%;
    -webkit-column-gap: 3%;
    column-gap: 3%;
    align-items: center;
    padding: 24px 0;
    border-bottom: 1px solid var(--gray150);
}
.payments-list-btn {
    height: 60px;
    width: 117px;
    margin-top: 40px;
    border: 1px solid var(--gray400);
    box-sizing: border-box;
    border-radius: 4px;
}
/* 마이리워드 */
.myreward-wrap {
    margin-top: 50px;
    margin-bottom: 150px;
}
.myreward-belt {
    padding: 20px 120px 22px;
}
.myreward-table-wrap {
    margin-top: 60px;
}
.myreward-table {
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.myreward-table-header {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--gray400);
}
.myreward-table-body-row,
.myreward-table-header {
    display: grid;
    grid-template-columns: 6% 14% 43% 17% 14%;
    grid-column-gap: 1.5%;
    -webkit-column-gap: 1.5%;
    column-gap: 1.5%;
}
.myreward-table-body-row {
    padding: 24px 0;
    border-bottom: 1px solid var(--gray150);
}
.carde-bottom-box {
    padding: 24px 20px 60px;
}
.carde-process-box {
    margin-top: 16px;
    display: flex;
    align-items: center;
}
.carde-process-bar {
    width: 160px;
    height: 3px;
    margin-left: 9px;
    position: relative;
}
.carde-process-bar-percentage {
    height: 3px;
    position: absolute;
}
.carde-btn {
    height: 48px;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.carde-btn-black {
    margin-top: 30px;
    margin-bottom: 10px;
}
.carde-btn-white {
    border: 1px solid var(--gray400);
    box-sizing: border-box;
}
.carde-complete-icon {
    width: 92px;
    height: 24px;
    border-radius: 12px;
    margin-bottom: 10px;
}
/* 마이월렛 */

.mywallet-wrap {
    margin-top: 50px;
    margin-bottom: 150px;
}
.mywallet-belt {
    padding: 40px 60px;
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.mywallet-belt-left {
    text-align: start;
}
.mywallet-belt-left p {
    margin-top: 10px;
}
.mywallet-belt-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.mywallet-table-wrap {
    margin-top: 60px;
}
.mywallet-table {
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.mywallet-table-header {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--gray400);
}
.mywallet-table-body-row,
.mywallet-table-header {
    display: grid;
    grid-template-columns: 5.5% 11.5% 30% 30% 17%;
    grid-column-gap: 1.5%;
    -webkit-column-gap: 1.5%;
    column-gap: 1.5%;
}
.mywallet-table-body-row {
    padding: 24px 0;
    border-bottom: 1px solid var(--gray150);
}
.reset-email-input {
    width: 100%;
    height: 60px;
    border: 1px solid var(--gray400);
    padding-left: 24px;
    border-radius: 4px;
}
.reset-email-input::-webkit-input-placeholder {
    color: var(--Gold200);
    font-size: 16px;
    line-height: 26px;
}
.reset-email-input:-ms-input-placeholder {
    color: var(--Gold200);
    font-size: 16px;
    line-height: 26px;
}
.reset-email-input::placeholder {
    color: var(--Gold200);
    font-size: 16px;
    line-height: 26px;
}
.pw-reset-btn {
    width: 100%;
    height: 60px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
.account-settings > input::-webkit-input-placeholder {
    color:var(--Gold200);
    font-size: 16px;
    line-height: 26px;
}
.account-settings > input:-ms-input-placeholder {
    color: var(--Gold200);
    font-size: 16px;
    line-height: 26px;
}
.account-settings > input::placeholder {
    color: var(--Gold200);
    font-size: 16px;
    line-height: 26px;
}
.form-disabled {
    width: 100%;
    height: 60px;
    border: 1px solid var(--gray300);
    border-radius: 4px;
    padding-left: 24px;
}
.account-btn {
    border: none;
    width: 100%;
    height: 60px;
    border-radius: 4px;
}
.authour-textarea {
    min-height: 180px;
    padding-top: 10px;
    padding-left: 24px;
    background-color: var(--white);
    border: 1px solid var(--gray400);
    border-radius: 4px;
    font-size: 16px;
}
.authour-textarea::-webkit-input-placeholder {
    font-size: 16px;
}
.authour-textarea:-ms-input-placeholder {
    font-size: 16px;
}
.authour-textarea::placeholder {
    font-size: 16px;
}
.register-btn {
    padding: 20px 80px;
    margin-top: 80px;
    margin-bottom: 80px;
    background-color: var(--gray900);
    border-radius: 4px;
    color: var(--white);
    font-weight: 700;
    border: none;
    outline: none;
    cursor: pointer;
    font-size: 18px;
}
.plus-btn {
    margin-top: 8px;
    height: 56px;
    border-radius: 4px;
    background-color: #ececec;
    border: none;
    font-size: 20px;
    color: #979797;
}
.img-box-img,
.plus-btn {
    width: 180px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.img-box,
.img-box-img {
    margin-right: 20px;
    border: 1px solid var(--gray400);
    color: var(--gray400);
    height: 180px;
    border-radius: 4px;
    font-size: 30px;
}
.img-box {
    width: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0 20px;
}
.loading {
    border: 3px solid #979797;
    border-top-color: var(--white);
    border-radius: 50%;
    width: 30px;
    height: 30px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
}
/* 스와이퍼 */

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

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swal2-styled.swal2-file,
.swal2-styled.swal2-input,
.swal2-styled.swal2-textarea,
.swal2-styled.swal2-styled.swal2-cancel,
.swal2-styled.swal2-styled.swal2-confirm {
    font-size: 16px;
}
.alert{
    font-size: 16px;
    text-align: center;
}
.category-menu-mb,
.mb-c-li,
.flex-row-align-center .subtitle,
.select_box,
.detail-ad-contents,
.card-circle{
    cursor: pointer;
}
.category-arrow-img{
    transition: 0.2s;
}

/* 버튼 스타일 */
.detail-ad-contents,
.contents-player{
    border: 1px solid transparent;
}
.block-main-link,
.link,
.account-list a,
.text-underline,
.login-each-btn,
.material-icons-outlined,
.account-btn,
.payments-list-btn,
.header-bt,
.card-circle,
.reviews-tab-bt,
.detail-ad-contents,
.contents-player,
.community-c-like,
.carde-btn,.carde-btn-white,
.input_title,.category1{
    transition: 0.2s;
}
/* 검정버튼 */
.account-btn:hover,
.header-bt:hover,
.carde-btn:hover{
    background-color: var(--gray700);
}

/* 보더버튼 */
.payments-list-btn:hover,
.sign-in:hover,
.carde-btn-white:hover{
    background-color: var(--white);
    border: 1px solid var(--black);
}
.toggle{
    transform: rotate(180deg);
}
/* 텍스트 버튼 */
.block-main-link,
.link,
.account-list a,
.mb-c-li p,
.mb-menu-bottom a,
.mb-menu-bold a,
.mb-mypage-menu a,
.mb-c-li,
.flex-row-align-center .subtitle,
.category_subtitle_box p,
.footer-right a,
.reviews-tab-bt,
.project-category p,
.bt-comu,
.sub_header_menu_li p,
.myInfoMenu span{
    color: var(--Gold300);
    transition: 0.2s;
}

.link:hover{
    text-decoration-color: var(--link);
}
.account-list a:hover,
.mb-c-li p:hover,
.mb-menu-bottom a:hover,
.mb-menu-bold a:hover,
.mb-mypage-menu a:hover,
.mb-c-li:hover,
.flex-row-align-center .subtitle:hover,
.category_subtitle_box p:hover,
.reviews-tab-bt:hover,
.project-category p:hover,
.bt-comu:hover,
.myInfoMenu span:hover,
.sub_header_menu_li p:hover{
    color: var(--Gold100);
}
.block-main-link:hover{
    text-decoration-color: var(--gray600);
    text-decoration-thickness: 2px;
}
.footer-right a:hover{
    text-decoration-color: var(--gray400);
}
/* 셀렉트 스타일 */
.input_title:focus,
.category1:focus{
    border: 1px solid var(--Gold100);
    outline: none;
    box-shadow: 0 0 0 2px var(--Gold300);
}

/* 네모 버튼 */
.detail-ad-contents:hover,
.contents-player:hover,
.community-c-like:hover{
    border: 1px solid var(--black);
}

.card-right-buy-btn:hover{
    background: linear-gradient(127.03deg, var(--auraBlue) 0%, var(--auraBlue) 100.6%)
}
.card-right-buy-btn:disabled{
    background-color: var(--gray300);
    color: var(--gray400);
}
.select_arrow{
    font-size: 22px;
}
.NFTHistory{
    /* justify-content: space-between; */
}
.my-p-menu-box{
    padding-right: 7rem;
}
.loading_img {
    width: 100vw;
    background-color: rgba(0, 0, 0, 0.4);
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    z-index: 14;
    justify-content: center;
    align-items: center;
    display: none;
}
.loading_img img{
    width: 200px;
    height: 200px;
}


/* 리스트 공통부분*/
.list_sale {
    position: absolute;
    top: 15px;
    left: 12px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: bold;
    width: 81px;
    height: 32px;
}
.nft_container{
    display: flex;
    flex-wrap: wrap;  
 }
 .nft_container .nft_outline{
    padding: 20px;
 }
.nft_list{
    display: block;
    padding: 20px;
    border-radius: 7px;
 }
 .nft_container .basis-2{
    flex-basis: 50%;
 }
 .nft_container .basis-3{
    flex-basis: 33%;
 }
 .nft_container .basis-4{
    flex-basis: 25%;
 }

.nft_list .nft_list_cover{
    border-radius: 10px;
    padding-top: 100%;
    position: relative;
    background-size: 100% 100%;
    transition: background-size 0.4s ease;
 }

.nft_list .nft_list_cover:hover {
    background-size: 120% 120%;
    transition: background-size 0.4s ease;
}
.nft_list .list_textbox{
    padding-top: 20px;
}
.nft_list .list_textbox .title {
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    min-height: 50px;
    word-break: break-word;     
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 17px;
 }

.nft_list .list_textbox .name { 
    font-size: 18px;
    padding-bottom: 13px;
 }

.nft_list .list_textbox .price { 
    font-weight: 700;
    font-size: 25px;
    display: flex;
    align-items: center;
 }
 
.nft_list .list_textbox .price span { 
    font-weight: 700;
    font-size: 25px;
    padding: 0 6px;
    padding-left: 0;
 }
 .nft_list .list_textbox .w_price span{
    padding-left: 0;
}
 .nft_list .list_textbox .price img { 
    max-width: 23px;
 }

 .pd65{
    padding-bottom: 65px;
}

.pd50{
    padding-bottom: 50px;
}


/* 페이지네이션 */
.pagination{
    justify-content: center;
    margin: 40px 0;
}
.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
    z-index: 2;
    color: #5B7DD2;
    cursor: default;
    background-color: initial;
    border: none;
    font-size: 16px;
}

.pagination>li>a:focus,
.pagination>li>a:hover,
.pagination>li>span:focus,
.pagination>li>span:hover {
    color: var(--Gold500);
    background-color: initial;
    border: none;
    font-size: 16px;
}

.pagination>li>a,
.pagination>li>span {
    position: relative;
    font-size: 16px;
    float:none;
    padding: 5px 7px;
    margin-left: 0;
    line-height: 1.42857143;
    color: var(--Gold100);
    text-decoration: none;
    background-color: initial;
    border: none;
}
@media (max-width: 992px){
    .my-p-menu-box{
        padding-right: 0rem;
    }
}
@media all and (max-width: 765px) {
    .select_box:focus{
        border: 0;
    }

    .nft_list .list_textbox .title{
        min-height: initial;
        margin-bottom: 8px;
        font-size: 18px;
    }
    .nft_list .list_textbox .name{
        font-size: 16px;
        padding-bottom: 8px;
    }
    .nft_list .list_textbox .price{
        font-size: 15px;
    }
    .nft_list .list_textbox .price span{
        font-size: 15px;
    }
    .nft_list .list_textbox .price img{
        max-width: 14px;
    }
}