:root {
    --defaultfontcolor: #222222;
    --color-secondary: #ffffff;
    --color-primary: #ffffff;
    --color-accent: #dddddd;
    --topbarcolor: #000000;
    --heroiconbox: 'GmarketSansMedium', 'GmarketSansLight', 'GmarketSansBold','Poppins', sans-serif;

}

/* Fonts */
:root {
    --font-default: 'GmarketSansMedium', 'GmarketSansLight', 'GmarketSansBold','Open Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-primary: 'GmarketSansMedium', 'GmarketSansLight', 'GmarketSansBold','Montserrat', sans-serif;
    --font-secondary: 'GmarketSansMedium', 'GmarketSansLight', 'GmarketSansBold','Poppins', sans-serif;
}

/* Colors */
:root {
    --color-default: var(--defaultfontcolor);
}

/* Smooth scroll behavior */
:root {
    scroll-behavior: smooth;
}




.header .logo h1 {
    color: #ffffff;
}

.header {
    background-color: #000000;
}

.topbar {
    background: #000000;
    color: #ffffff;
}

.topbar a{color:#ffffff;}

.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover>a {
    color: #ffffff;
}

.navbar a,
.navbar a:focus {
    color: #ffffff;
}

.navbar .dropdown ul a {
    color: #ffffff;
}



/*기본속성모음*/


#section3 a.btn, .btn{padding:0;font-size:1em;}



.basicline h3 {
    color: var(--color-default);
    font-weight: 700;
    margin: 0 0 20px 0;
    padding-bottom: 8px;
    font-size: 1.5rem;
    line-height: 2.8rem;
    font-weight: 600;
    position: relative;
    display: block;
    border-bottom: 4px solid #eeeeee;
    transition: 0.3s;
    word-break: break-word;
    overflow: hidden;
    display: block;
    max-height: 5.6rem;
    -webkit-line-clamp: 2;
    display: box;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
}

.basicline p {
    font-weight: 500;
    margin: 0 0 20px 0;
    padding-bottom: 8px;

}



.basic h3 {
    color: var(--color-default);
    font-weight: 700;
    margin: 0 0 20px 0;
    padding-bottom: 8px;
    font-size: 1.5rem;
    line-height: 2.8rem;
    font-weight: 600;
    position: relative;
    display: block;
    transition: 0.3s;
    word-break: break-word;
    overflow: hidden;
    display: block;
    max-height: 5.6rem;
    -webkit-line-clamp: 2;
    display: box;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    white-space: normal;
}

.basi p {
    font-weight: 500;
    margin: 0 0 20px 0;
    padding-bottom: 8px;
    font-size: 1.2rem;
    line-height: 1.8rem;
}

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

#gnb .gnb_wrap,
#container_wr,
#ft_wr {
    width: unset !important;
}

#gnb #gnb_1dul {
    border-bottom: 0px !important;
}

.gnb_2dul .gnb_2dul_box {
    background: #ffffff;
    width: 100%;
}

.gnb_2dul {
    top: 35px !important;
}

.gnb_2dli a {
    min-width: 140px;
    height: 40px;
    padding: 0 5px 0 5px;
}

.gnb_1dli .bg {
    top: 18px !important;
}


.navbar .dropdown ul a {
    padding: 0 0 0 30px !important;
    line-height: 50px !important;
    color: #ffffff !important;
}

.navbar .dropdown ul,
.navbar .dropdown .dropdown ul {
    border: 1px solid #5b5b5b !important;
    background: var(--color-primary) !important;
}


.contact .php-email-form button[type=submit]:hover {
    background: var(--color-accent);
}


.basicbtn {
    background: var(--color-primary);
    border: 0;
    padding: 5px 10px 5px 10px;
    color: #fff;
    transition: 0.4s;
    border-radius: 5px;
}

.basicbtn:hover {
    background: var(--color-accent);
}

.btnwrite {
    background: var(--color-accent);
}

.more-opt {
    min-width: 90px;
}


/*폰트 색상 관련*/
.color-white {
    color: #ffffff;
}

.color-accent {
    color: var(--color-accent);
}

.color-grey1 {
    color: #757575;
}

.testimonials {
    background: url("https://gmp21.com/theme/design/img/main/testimonials_bg.png") no-repeat;
    background-size: cover;
    background-position: center -150px;
}

/*서브 공통 시작*/
#subbg {
    height: 30vh;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.sub_community_bg {
    background: url('https://gmp21.com/theme/design/img/sub/sub_customer_bg2.jpg');
    background-size: cover;
    background-position: bottom center;
}

.sub_layout_bg {
    position: absolute;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 30vh;
    padding: 120px 0 70px;
    background: rgb(0, 0, 0, 0.2);
}

.sub_layout_content {
    position: relative;
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.sub_layout_content h2 {
    font-size: 48px;
    font-weight: 700;
    line-height: 1.1;
    margin-top: -0.1em;
    margin-bottom: 13px;
    text-align: center;
    opacity: 1;
    letter-spacing: -0.01em;
}

.sub_layout_content h4 {
    font-size: 18px;
    line-height: 1.333;
    font-weight: 400;
    opacity: .5;
    letter-spacing: -0.01em;
}


/*서브 중간 셀렉트메뉴 관련*/

.snb_inner {
    position: relative;
    z-index: 100;
}

.snb_inner .subselectbox {
    display: flex;
    align-items: center;
    height: 100%;
    margin: 20px auto;
    background: #fff;
    position: relative;
    justify-content: center;
    z-index: 10;
}

.snb_home {
    flex-shrink: 0;
    width: 80px;
    height: 60px;
    padding-top: 22px;
    border-right: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
}


.snb_home .el_btn {
    height: 100%;
    width: 100%;
}

.el_btn {
    display: inline-flex;
    justify-content: center;
    padding-bottom: 0.15em;
    cursor: pointer;
}

.dropdown select {
    padding: 10px;
    border-color: #dddddd;
    margin-right: 30px;
    width: 100%;
    outline: 0;
}

.dropdown.basic .drop_btn,
.dropdown.basic .drop_content a {
    font-size: 16px;
    padding: 0 var(--padding-inner);
    color: var(--color-tab);
}

.dropdown.basic .drop_btn {
    width: 100%;
    height: 100%;
    background: #fff;
}

.snb_menu .drop_btn {
    line-height: inherit;
}

.dropdown .drop_btn,
.drop_content a {
    display: flex;
    align-items: center;
    line-height: 1;
    letter-spacing: -0.025em;
}

.dropdown .drop_btn {
    position: relative;
    z-index: 1;
}

@media (min-width: 1201px) {
    .ly_snb {
        margin-top: -70px;
    }

    .sticky_wrap {
        position: relative;
    }

    .snb_home {}

    .snb_menu {
        max-width: 345px;
    }

    .snb_menu {
        height: 100%;
        position: relative;
    }
}

/*end*/


#snb {
    display: flex;
    justify-content: left;
    border-bottom: 1px solid #e1e1e1;
}

#snb .menu {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    /*justify-content: flex-start;*/
    justify-content: flex-start;
}

#snb .category-wrapper {
    position: relative;
    /* Required for absolute positioning of dropdown */
}

#snb .category-button {
    display: inline-block;
    border-right: 1px solid #ddd;
    padding: 10px;
    background-color: #fff;
    cursor: pointer;
    white-space: nowrap;
    height: 60px;
    line-height: 40px;
    text-overflow: ellipsis;
    width: 180px;
    text-align: center;
}

#snb .category {
    list-style-type: none;
    margin: 0;
    padding: 0;
    border: 1px solid #ccc;
    border-radius: 0px;
    position: absolute;
    /* Position absolutely to show dropdown on top of other content */
    width: 180px;
    /* Adjust as per your design */
    display: none;
    /* Initially hide the dropdown */
    z-index: 99;
    background: #ffffff;
}

#snb .category li {
    padding: 10px;
    cursor: pointer;
}

#snb .category li:hover {
    background-color: #ddd;
}

#snb .category-button .arrow {
    padding-left: 5px;
}

#snb .category li.active {
    color: red;
}

.text-slider .active {
    /* Your active styles here. For example: */
    color: #ffffff;
}







/*서브 공통 끝*/


.pconly {
    display: block;
}

.mobileonly {
    display: none;
}

.modal {
    z-index: 9999999;
}

#wrapper_title{font-size: 1.5em !important;}
#bo_v_title .bo_v_tit{font-size: 1.5em !important;}

.btn_confirm a:hover, .btn_confirm .btn:hover, .btn_confirm a.btn:hover {
   color: #FFFFFF;
   text-decoration: none;
}

/*쇼핑몰 관련 시작*/

#topmember_after {
    display:flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
	gap:10px;
}

#topmember_before {
    
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
	gap:10px;
}

.smt_40 .sct_cost {
    font-size: 0.9em;
}

.smt_30 .sct_cost {
    font-size: 0.9em;
    line-height: 20px;
}

.smt_30 .sct_cost .half {
    font-size: 0.7em;
}

.smt_30 .sct_cnt div {
    padding-top: 5px !important;
}

.smt_30 li {
    padding: 0 !important;
}

.topbar .social-links a {
    margin-left: 10px;
}


.shop-content {
    position: relative;
}

.shop_select_to_html .option.selected,
.shop_select_to_html .option.selected a {
    color: var(--color-accent) !important;
}

.shop_select_to_html:hover .category_title,
.shop_select_to_html:hover .category_title i {
    color: var(--color-accent) !important;
}

.mticon a{color:#ffffff;}
.mticon i{color:#ffffff;}
.mticon .icon {
    position: absolute;
    top: 11px;             
    right: 32px;         
    font-size: 11px;
    border-radius: 50%;
    background: red;
    color: #ffffff;
    display: inline-block;
    text-align: center;
    width: 15px;
    height: 15px;
    line-height: 15px;
}



/* 마이페이지 */
#smb_my_ov {
    position: relative;
    background: #fff;
    margin-right: 20px
}

#smb_my_ov h2 {
    position: absolute;
    font-size: 0;
    text-indent: -9999em;
    line-height: 0;
    overflow: hidden
}

#smb_my_ov .my_name {
    display: block;
    background: #fff;
    border-bottom: 1px solid #efefef;
    padding: 15px 10px 15px 80px;
    font-size: 1.167em
}

#smb_my_ov .profile_img {
    display: inline-block;
    position: absolute;
    top: 15px;
    left: 15px
}

#smb_my_ov .my_info_modi {
    position: absolute;
    bottom: 0;
    right: -5px;
    text-align: center;
    background: #212020;
    width: 20px;
    height: 20px;
    line-height: 20px;
    color: #fff;
    font-size: 13px;
    border-radius: 50%
}

#smb_my_ov .my_name>strong {
    display: block
}

#smb_my_ov .win_point {
    color: #c7d4e6;
    font-size: 0.92em
}

#smb_my_ov .win_point strong {
    color: #3a8afd
}

#smb_my_ov .my_name img {
    width: 45px;
    border-radius: 50%
}

#smb_my_ov .my_name .my_ov_name {
    display: inline-block;
    margin-bottom: 10px;
    line-height: 28px
}

#smb_my_ov .my_name a.smb_info {
    color: #3a8afd
}

#smb_my_ov .smb_my_act {
    position: absolute;
    right: 15px;
    top: 20px;
    display: inline-block
}

#smb_my_ov .smb_my_act li {
    display: inline-block;
    font-size: 0.92em
}

#smb_my_ov .smb_my_act li a {
    line-height: 28px;
    height: 30px;
    vertical-align: middle;
    padding: 0 5px;
    margin: 0;
    border-radius: 3px
}

#smb_my_ov .smb_my_act li a.btn_logout {
    display: inline-block;
    border: 1px solid #4f93fd;
    color: #4f93fd
}

#smb_my {}

#smb_my .btn_more {
    display: block;
    height: 43px;
    margin: 15px;
    background: #eee;
    font-size: 1.167em;
    color: #7f7e7e;
    line-height: 43px;
    text-align: center;
    border-radius: 3px
}

#smb_my_ov {
    margin: 0 0 20px
}

#smb_my_ov .my_pocou {
    background: #fff
}

#smb_my_ov .my_pocou:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: ''
}

#smb_my_ov .my_pocou li {
    width: 50%;
    float: left;
    padding: 15px;
    border-right: 1px solid #efefef
}

#smb_my_ov .my_pocou li:last-child {
    border-right: 0
}

#smb_my_ov .my_pocou li a {
    display: block;
    position: relative;
    line-height: 20px
}

#smb_my_ov .my_pocou li a span {
    display: inline-block;
    float: right;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: clip;
    padding: 0 5px;
    line-height: 20px;
    border-radius: 35px;
    font-weight: normal;
    font-size: 0.846em
}

#smb_my_ov .my_pocou li.my_cou a span {
    background: #a352c1
}

#smb_my_ov .my_pocou li.my_memo a span {
    background: #ff8b77
}

#smb_my_ov .my_pocou li i {
    color: #8c9eb0;
    font-size: 16px
}

#smb_my_ov .my_info {
    display: none;
    clear: both;
    width: 100%;
    margin-top: -1px;
    background: #fff;
    padding: 5px 20px 20px;
    border-bottom: 1px solid #e6e6e6
}

#smb_my_ov .my_info:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: ''
}

#smb_my_ov .my_info_wr {
    float: left;
    width: 50%;
    line-height: 20px;
    padding-bottom: 10px;
    margin: 5px 0;
    border-bottom: 1px dashed #e5e5e5
}

#smb_my_ov .my_info_wr strong {
    display: block;
    vertical-align: top;
    padding: 3px 0px;
    color: #8c9eb0
}

#smb_my_ov .my_info_wr span {
    display: block;
    text-align: left
}

#smb_my_ov .ov_addr {
    border-bottom: 0
}

#smb_my_ov .ov_addr a {
    color: #c7c7c7
}

#smb_my_ov .my_ov_btn {
    border-top: 1px solid #efefef
}

#smb_my_ov .my_ov_btn button {
    display: block;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #dde7e9;
    background: #fff;
    padding: 15px;
    text-align: left;
    font-size: 1.125em;
    font-weight: bold
}

#smb_my_ov .my_ov_btn button i {
    display: inline-block;
    float: right
}

#smb_my_od h2 {
    font-size: 1.167em;
    margin: 10px
}

#smb_my_wish h2 {
    font-size: 1.167em;
    margin: 30px 10px 10px
}

.wishlist ul {
    margin: 10px 10px 0
}

.wishlist ul:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: ''
}

.wishlist li {
    float: left;
    padding: 5px;
    width: 33.333%;
    text-align: center
}

.wishlist li img {
    width: 100%;
    height: auto;
    max-width: 250px
}

.wishlist li .info_link {
    display: block;
    font-weight: bold;
    margin: 5px 0 2px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.wishlist li .info_date {
    font-size: 0.92em;
    color: #666
}



#sod_inquiry {
    border-bottom: 1px solid #dde7e9
}

#sod_inquiry li {
    background: #fff;
    border-top: 1px solid #ececec;
    padding: 15px;
    position: relative
}

#sod_inquiry li:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: ''
}

#sod_inquiry li .idtime_link {
    font-weight: bold;
    font-size: 1.167em
}

#sod_inquiry li .idtime_time {
    color: #999
}

#sod_inquiry li .inq_wr:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: ''
}

#sod_inquiry li .inquiry_name {
    margin: 10px 0;
}

#sod_inquiry li .inquiry_price {
    font-size: 1.25em;
    font-weight: bold;
    color: #3a8afd;
    float: left
}

#sod_inquiry li .inv_status {
    display: inline-block;
    float: right;
    margin: 0;
    font-weight: bold
}

#sod_inquiry li .inv_inv {
    margin: 10px 0 0;
    display: block;
    border: 1px solid #e5ecf2;
    border-radius: 3px;
    color: #4963b8;
    background: #f9fdff;
    padding: 10px;
}

#sod_inquiry li .inv_inv i {
    margin-right: 5px
}

#sod_inquiry .li_cancel {
    background: #fcf1f1
}

.status_01 {
    display: block;
    background: #edfbde;
    color: #8cc152;
    line-height: 24px;
    border-radius: 5px;
    border-radius: 5px;
    padding: 0 5px;
    font-weight: normal;
    font-size: 0.85em
}

.status_02 {
    display: block;
    background: #84c93a;
    color: #fff;
    line-height: 24px;
    border-radius: 5px;
    border-radius: 5px;
    padding: 0 5px;
    font-weight: normal;
    font-size: 0.85em
}

.status_03 {
    display: block;
    background: #5bd085;
    color: #16b494;
    line-height: 24px;
    border-radius: 5px;
    border-radius: 5px;
    padding: 0 5px;
    font-weight: normal;
    font-size: 0.85em
}

.status_04 {
    display: block;
    background: #e2eaf6;
    color: #3a8afd;
    line-height: 24px;
    border-radius: 5px;
    border-radius: 5px;
    padding: 0 5px;
    font-weight: normal;
    font-size: 0.85em
}

.status_05 {
    display: block;
    background: #3a8afd;
    color: #fff;
    line-height: 24px;
    border-radius: 5px;
    border-radius: 5px;
    padding: 0 5px;
    font-weight: normal;
    font-size: 0.85em
}

.status_06 {
    display: block;
    background: #fff;
    color: red;
    line-height: 24px;
    border-radius: 5px;
    border-radius: 5px;
    padding: 0 5px;
    font-weight: normal;
    font-size: 0.85em
}

#smb_my_ov {
    width: 20% !important;
}

#smb_my_list {
    width: 77% !important;
}


.header .mticon {
    font-size: 24px;
}

.cartmobileonly {
    display: none;
}

#section5 .shadow-xss {
    box-shadow: 2px 7px 10px rgba(0, 0, 0, .05) !important;
}

.chk_box input[type="checkbox"]+label span {
    margin-right: 5px !important;
}


.effectimg {
    overflow: hidden;
}

.effectimg img {
    transition: transform 0.3s ease-out;
}

.effectimg img:hover {
    transform: scale(1.1);
}

.sct_wrap h2{font-size:2em !important;}

.sod_left{width:55% !important;;}
.sod_right{width:42% !important;}

/*쇼핑몰 관련 끝*/


/*반응형관련시작*/

@media (max-width: 971px) {
.sod_left{width:100% !important;;}
.sod_right{width:100% !important;}
#sod_frm #sod_bsk_tot li{height:100px !important;}
#settle_dcard label{width:35% !important;}

}





@media (max-width: 790px) {
    .sub_community_bg {
        background: url('https://gmp21.com/theme/design/img/sub/sub_customer_bg2.jpg');
        background-size: cover;
        background-position: center bottom;
    }
	.mticon .icon {
    position: absolute;
    top: 11px;             
    right: 43px;         
    font-size: 11px;
    border-radius: 50%;
    background: red;
    color: #ffffff;
    display: inline-block;
    text-align: center;
    width: 15px;
    height: 15px;
    line-height: 15px;
    }
	#smb_my_ov{width:100% !important;}
	#smb_my_list{width:100% !important;}
	.review_detail_in{left:unset !important;right:0;width:100% !important;}
}

@media (max-width: 420px) {
	#sod_frm #od_name, #sod_frm #od_tel, #sod_frm #od_hp, #sod_frm #od_pwd, #sod_frm #od_b_name, #sod_frm #od_b_tel, #sod_frm #od_b_hp, #sod_frm #ad_subject, #sod_frm #od_hope_date{width:100%;}
	#topmember_after{gap:7px;}
	#settle_dcard label{width:25% !important;}
	#sit_use_wbtn a {
		padding: 0 5px !important;
		line-height: 35px !important;
		font-size: 1em !important;
	}
	.sit_use_li_title{position:unset !important;padding:5px !important;margin-top:5px !important;}
	.sit_use_con{margin-right:5px !important;}
	
}


#sct_hhtml img{width:100% !important;}
