@charset "utf-8";

:root {
	--color-bk: #171718;
	--mainbgcolor: #EBF2FC;
	--bgcolor: #f3f3f3;

	--gray-color: #767676;
	--gray-color2: #737981;
	--main-color: #00A3E4;
    --box-bg-color: #EFF4F6;
	--border-color: #DEE6E9;
	--placeholder: #A1A1A1;
	--alert-color: #E00000;
}

body.on {
    touch-action: none;
    overflow: hidden !important;
    -webkit-user-select: none;
}

html.on {
    touch-action: none;
    overflow: hidden !important;
    overscroll-behavior: none;
    -webkit-user-select: none;
}

#load {
    display: none;
    z-index: 999999999;
}

input[type=search] {
    padding-right: 15px;
}

input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
    -webkit-appearance: none;
    width: calc(100vw * (10/375));
    height: calc(100vw * (10/375));
    background-color: transparent;
    background: url(../image/sub/up_x_btn.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-border-radius: 0;
    cursor: pointer;
}

.loading-container {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .6);
    z-index: 99999999999;
    display: flex;
    align-items: center;
    justify-content: center
}

.loading-container .loading {
    width: calc(100vw * (100/640));
    height: calc(100vw * (100/640));
    border-radius: 50%;
    border: 2px solid transparent;
    border-color: transparent #fff transparent #FFF;
    -moz-animation: rotate-loading 1.5s linear 0s infinite normal;
    -moz-transform-origin: 50% 50%;
    -o-animation: rotate-loading 1.5s linear 0s infinite normal;
    -o-transform-origin: 50% 50%;
    -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;
    -webkit-transform-origin: 50% 50%;
    animation: rotate-loading 1.5s linear 0s infinite normal;
    transform-origin: 50% 50%
}

.loading-container #loading-text {
    -moz-animation: loading-text-opacity 2s linear 0s infinite normal;
    -o-animation: loading-text-opacity 2s linear 0s infinite normal;
    -webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
    animation: loading-text-opacity 2s linear 0s infinite normal;
    color: #ffffff;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: calc(100vw * (10/640));
    font-weight: bold;
    opacity: 0;
    text-align: center;
    text-transform: uppercase;
    width: calc(100vw * (100/640))
}

@keyframes rotate-loading {
    0% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -moz-transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -moz-transform: rotate(360deg)
    }
}

@-moz-keyframes rotate-loading {
    0% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -moz-transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -moz-transform: rotate(360deg)
    }
}

@-webkit-keyframes rotate-loading {
    0% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -moz-transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -moz-transform: rotate(360deg)
    }
}

@-o-keyframes rotate-loading {
    0% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -moz-transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        -moz-transform: rotate(360deg)
    }
}

@keyframes loading-text-opacity {
    0% {
        opacity: 0
    }

    20% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-moz-keyframes loading-text-opacity {
    0% {
        opacity: 0
    }

    20% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes loading-text-opacity {
    0% {
        opacity: 0
    }

    20% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-o-keyframes loading-text-opacity {
    0% {
        opacity: 0
    }

    20% {
        opacity: 0
    }

    50% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

/* header */
#header {
    display: flex;
    align-items: center;
    padding: calc(100vw * (16/375)) calc(100vw * (20/375)) calc(100vw * (10/375));
    .header_logo {
        font-size: calc(100vw * (24/375));
        font-weight: 500;
        width: calc(100vw * (28/375));
		margin-left:calc(100vw * (8 / 375));
    }
    .header_ham_btn {
        width: calc(100vw * (30/375));
    }
    .header_bell {
        width: calc(100vw * (30/375));
        margin: 0 calc(100vw * (6/375));
        margin-left: auto;
    }
    .header_bell.on::after {
        content: '';
        width: calc(100vw * (7 / 375));
        height: calc(100vw * (7 / 375));
        border-radius: 50%;
        position: absolute;
        top: calc(100vw * (2 / 375));
        right: calc(100vw * (6 / 375));
        background-color: #0093ce;
        display: block;
    }
}



/* END header */

/* footer */

#footer {
    padding: calc(100vw * (30/375)) calc(100vw * (12/375)) calc(100vw * (130/375));
    .footer_logo {
        width: calc(100vw * (72/375));
        margin-bottom: calc(100vw * (20/375));
    }
    .footer_etc {
        display: flex;
        align-items: center;
        gap: calc(100vw * (12/375));
        font-size: calc(100vw * (14/375));
    }
    .footer_line {
        width: 1px;
        height: calc(100vw * (12/375));
        background-color: #999;
    }
    .top_btn {
        width: calc(100vw * (40/375));
        height: calc(100vw * (40/375));
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        right: 0;
        top: 0;
        box-shadow: 0px 6px 20px 0px rgba(0, 0, 0, 0.12);
    }
    .footer_info {
        margin-top: calc(100vw * (17/375));
        font-size: calc(100vw * (12/375));
        font-weight: 400;
        color: #767676;
    }
    .footer_fixed {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #fff;
        box-shadow: 0px -3px 12px 0px rgba(0, 0, 0, 0.12);
        height: calc(100vw * (84/375));
        z-index: 10000;
        border-radius: calc(100vw * (24/375)) calc(100vw * (24/375)) 0 0;
    }
    .footer_btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        gap: calc(100vw * (6/375));
        font-size: calc(100vw * (12/375));
        color: #c2c2c2;
        font-weight: 400;
/*        flex: 1;*/
		width:calc((100% - (100vw * (72/375)))/2);
    }
    .footer_btn_logo {
        display: block;
        width: calc(100vw * (20/375));
        height: calc(100vw * (20/375));
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .footer_btn.btn1 .footer_btn_logo{background-image: url(../image/common/footer_btn1.png);}
    .footer_btn.btn2 .footer_btn_logo{background-image: url(../image/common/footer_btn2.png);}
    .footer_btn.btn3 .footer_btn_logo{background-image: url(../image/common/footer_btn3.png);}
    .footer_btn.on {color: #202020;}
    .footer_btn.btn1.on .footer_btn_logo{background-image: url(../image/common/footer_btn1_on.png);}
    .footer_btn.btn2.on .footer_btn_logo{background-image: url(../image/common/footer_btn2_on.png);}
    .footer_btn.btn3.on .footer_btn_logo{background-image: url(../image/common/footer_btn3_on.png);}
    .footer_center {
        width: calc(100vw * (64/375));
		img {
			width:100%;
		}
    }
}

/* END footer */

/* gnb */
.gnb_wrap {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: transparent;
    -moz-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -o-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -ms-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
    overflow: auto;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: rgba(244, 244, 249, 0.4);
    backdrop-filter: blur(5px);
}

.gnb_big_wrap.on .gnb_wrap {
    -moz-transform: translateX(0%);
    -webkit-transform: translateX(0%);
    -o-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.gnb_big_wrap.close .gnb_wrap {
    -moz-transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -o-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: 0;
    -moz-transition: 0;
    -ms-transition: 0;
    -o-transition: 0;
    transition: 0;
}

.gnb_box {
    flex: 1;
    background-color: var(--bgcolor);
    padding: calc(100vw * (20/375)) calc(100vw * (12/375));
	padding-bottom: calc(100vw * (154 / 375));
    .gnb_top {
        display: flex;
        align-items: center;
    }
    .gnb_name {
        font-size: calc(100vw * (16/375));
        font-weight: 700;
        max-width: calc(100vw * (180/375));
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .header_bell {
        width: calc(100vw * (30/375));
        margin: 0 calc(100vw * (6/375));
    }
    .header_bell.on::after {
        content: '';
        width: calc(100vw * (7 / 375));
        height: calc(100vw * (7 / 375));
        border-radius: 50%;
        position: absolute;
        top: calc(100vw * (2 / 375));
        right: calc(100vw * (6 / 375));
        background-color: #0093ce;
        display: block;
    }
    .gnb_xbtn {
        width: calc(100vw * (30/375));
    }
    .gnb_qr {
        display: flex;
        align-items: center;
        color: #fff;
        border-radius: calc(100vw * (50/375));
        background-color: #202020;
        padding: calc(100vw * (4/375)) calc(100vw * (8/375));
        font-size: calc(100vw * (14/375));
        gap: calc(100vw * (10/375));
        margin-left: auto;
    }
    .gnb_qr img {
        width: calc(100vw * (24/375));
    }
    .gnb_btn_box {
        padding: calc(100vw * (8/375));
        border-radius: calc(100vw * (18/375));
        display: flex;
        flex-direction: column;
        gap: calc(100vw * (8/375));
        background-color: #fff;
        margin-top: calc(100vw * (20/375));
    }
    .top_btn_row {
        display: flex;
        align-items: center;
        gap: calc(100vw * (6/375));
    }
    .top_btn {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: calc(100vw * (10/375));
        background-color: #f3f3f3;
        border-radius: calc(100vw * (8/375));
        padding: calc(100vw * (20/375)) calc(100vw * (12/375));
		.btn_idx{
			text-align:left;
			color:var(--gray-color);
		}
    }
    .btn_val {
        display: flex;
        align-items: center;
        color: #c2c2c2;
        font-size: calc(100vw * (16/375));
        line-height: calc(100vw * (16/375));
    }
    .btn_val span {
        color: #202020;
        font-weight: 700;
        margin-right: calc(100vw * (2/375));
    }
    .btn_val svg {
        margin-left: auto;
    }
    .benefit_btn {
        display: flex;
        align-items: center;
        gap: calc(100vw * (10/375));
        justify-content: center;
        font-size: calc(100vw * (14/375));
        font-weight: 700;
        background-color: #f2f6f5;
        border-radius: calc(100vw * (8/375));
        padding: calc(100vw * (16/375)) calc(100vw * (12/375));
    }
    .benefit_btn img {
        width: calc(100vw * (24/375));
    }
    .gnb_btn_group {
        display: flex;
        flex-direction: column;
        margin: calc(100vw * (16/375)) 0 calc(100vw * (30/375));
    }
    .gnb_btn {
        display: flex;
        align-items: center;
        padding: calc(100vw * (20/375)) 0;
        border-bottom: 1px solid #e4e4e4;
    }
    .gnb_btn img {
        width: calc(100vw * (22/375));
        margin-right: calc(100vw * (8/375));
    }
    .gnb_btn svg {
        margin-left: auto;
    }
	.gnb_btn_sns {
		display: flex;
		flex-direction: column;
		padding: calc(100vw * (20/375)) calc(100vw * (16/375));
		gap: calc(100vw * (12/375));
		border-radius: calc(100vw * (8/375));
		border: 1px solid var(--lineColor, #E4E4E4);
		background: var(--white, #FFF);
		margin-bottom:calc(100vw * (40/375));
		.title {
			width: 100%;
			font-size: calc(100vw * (15/375));
			font-weight: 400;
		}
		.btn_area {
			display: flex;
			width: 100%;
			gap: calc(100vw * (6 / 375));
			.com_btn {
				width: calc((100% - (100vw * (6 / 375)) / 2));
				background-color: transparent;
				color:#202020;
				font-size:calc(100vw * (14/375));
				font-weight:600;
				display:flex !important;
				gap: calc(100vw * (12/375));
				border-radius:calc(100vw * (5/375));
				padding:0;
				height:calc(100vw * (46/375));
				border: 1px solid var(--lineColor, #E4E4E4);
				img {
					width:calc(100vw * (24 / 375));
				}
			}
		}
	}
    .signout_btn {
        display: flex;
        align-items: center;
        gap: calc(100vw * (18/375));
		border-radius: calc(100vw * (4/375));
        border: 1px solid var(--textLightGrey, #C2C2C2);
        width: fit-content;
        padding: calc(100vw * (16 / 375));
    }
}

/* END gnb */

/* sub_header */
.sub_header {
    background-color: var(--bgcolor);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 0 calc(100vw * (15/375));
    height: calc(100vw * (60/375));
    z-index: 100;
}
.login_img {
	img {
		width:100%;
	}
}

.sub_header.pw {
    background-color: #F4F4F9;
}

.sub_header_box {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.back_link {
    width: calc(100vw * (36/375));
    height: calc(100vw * (36/375));
    display: block;
}

.sub_header .right {
    display: flex;
    align-items: center;
    gap: calc(100vw * (21/375));
}

.sub_header .left {
    display: flex;
    gap: calc(100vw * (10/375));
    align-items: center;
}

.sub_header .name {
    font-weight: 700;
    font-size: calc(100vw * (16/375));
    line-height: 1em;
    height: calc(100vw * (30/375));
    display: flex;
    align-items: center;
    position: absolute;
    top: 50%;
    left: calc(100vw * (45 / 375));
    transform: translateY(-50%);
	text-align: left;
	max-width: calc(100vw * (222 / 375));
}

.sub_header .h_menu {
    width: calc(100vw * (36/375));
}

.sub_header .sub_home {
    width: calc(100vw * (26/375));
}

.sub_header .sub_right {
    display: flex;
    gap: calc(100vw * (6/375));
}

.sub_header .sub_right .home_btn {
    width: calc(100vw * (30/375));
    height: calc(100vw * (30/375));
}

.sub_header.card_header {
    background-color: #fff;
}

.card_cancel {
    font-size: calc(100vw * (14/375));
    font-weight: 600;
    color: var(--main-color);
    line-height: calc(100vw * (30/375));
}

.sub_right .coin_home_btn {
    width: calc(100vw * (36/375));
}
/* END sub_header */


/* modal */
.modal {
    position: fixed;
    z-index: 10001;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
}

.modal_con {
    position: fixed;
    left: 0;
    right: 0;
    display: none;
    bottom: 0;
    max-height: 95%;
    overflow: auto;
    z-index: 1002;
    background: #fff;
    border-radius: calc(100vw * (20/375)) calc(100vw * (20/375)) 0 0;
}

.modal_head {
    padding: 0 calc(100vw * (20/375));
    height: calc(100vw * (60/375));
    justify-content: space-between;
    border-radius: calc(100vw * (20/375)) calc(100vw * (20/375)) 0 0;
    background-color: #fff;
}

.modal_head .modal_tit {
    font-weight: 600;
    color: #111;
    font-size: calc(100vw * (16/375));
}

.modal_head .modal_close {
    width: calc(100vw * (25/375));
    height: calc(100vw * (25/375));
    justify-content: center;
}

.modal_head .modal_close .img_icon {
    width: calc(100vw * (13/375));
    height: calc(100vw * (13/375));
}

/* END modal */

/* pop */
.pop * {
    font-family: 'pretendard' !important;
}

.pop {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 95%;
    max-height: 95%;
    background-color: #fff;
    z-index: 10010;
    border-radius: 10px;
    display: none;
}

.pw_pop .pop {
    width: 95%;
}

.pop_close_btn {
    position: absolute;
    width: calc(100vw * (10/375));
    right: calc(100vw * (15/375));
    top: calc(100vw * (15/375));
    z-index: 2;
}

.pop_close_btn img {
    filter: invert(1);
    width: 100%;
}

.common_pop .pop {
    width: 90%;
    padding: calc(100vw * (25/375)) calc(100vw * (15/375));
}

.id_btn button.chk {
    background: #c8c8c8;
}

.id_btn button {
    color: #fff;
}

.id_btn button {
    height: calc(100vw * (42/375));
    width: calc(100vw * (120/375));
    margin: 0 calc(100vw * (5/375));
    border-radius: calc(100vw * (10/375));
    font-size: 15px;
    background: #00A3E4;
    font-size: calc(100vw * (16/375));
}

/* END pop */
.g_home_btn {
    width: calc(100vw * (24/375));
    justify-content: center;
    margin-right: calc(100vw * (10/375));
}

.g_home_btn .icon {
    width: calc(100vw * (24/375));
    height: calc(100vw * (24/375));
}

a {
    -webkit-tap-highlight-color: transparent;
}

/* pw modal */

.pw_modal {
    position: fixed;
    width: 100%;
    height: 100vh;
    bottom: 0;
    left: 0;
    z-index: 10000;
    background-color: #f3f3f3;
/*    transform: translateY(100%);*/
    transition: 0.5s ease-in-out transform;
	display:none;
    .pw_box {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: 100%;
    }
    .pw_title {
        font-size: calc(100vw * (23/375));
        font-weight: 700;
        text-align: center;
        margin-top: 18vh;
		gap: calc(100vw * (10 / 375));
		width: calc(100vw * (260 / 375));
		img {
			width: calc(100vw * (24 / 375));
			display: inline-block;
			margin-right: calc(100vw * (10 / 375));
			transform: translateY(calc(100vw * (2.5 / 375)));
		}
    }
    .pw_tit {
        color: #767676;
        font-weight: 400;
        font-size: calc(100vw * (12/375));
        color: #767676;
        margin-top: calc(100vw * (6/375));
    }
    .dot_group {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: calc(100vw * (25/375));
        margin-top: calc(100vw * (24/375));
		margin-bottom: auto;
        height: calc(100vw * (12/375));
    }
    .dot {
        width: calc(100vw * (16/375));
        height: calc(100vw * (16/375));
        border-radius: 50%;
        border: 1px solid #c2c2c2;
        transition: 0.3s;
		display: flex;
		align-items: center;
		justify-content: center;
    }
    .dot.active, 
    .dot.ok {
        background-color: #00A3E4;
        border: none;
    }
    .forgot_link {
        font-size: calc(100vw * (12/375));
        font-weight: 400;
        line-height: calc(100vw * (20/375));
        text-decoration: underline;
    }
    .num_pad {
        width: 100%;
        padding: calc(100vw * (34/375)) calc(100vw * (25/375)) calc(100vw * (60/375));
        border-radius: calc(100vw * (25/375)) calc(100vw * (25/375)) 0 0;
        display: grid;
        grid-template-columns: repeat(3,1fr);
        column-gap: calc(100vw * (17/375));
        row-gap: calc(100vw * (4/375));
        align-items: center;
        font-family: "Roboto", sans-serif;
        font-weight: 500;
    }
    .pad {
        border-radius: calc(100vw * (24/375));
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: calc(100vw * (24/375));
        font-weight: 500;
        max-height: calc(100vw * (64/375));
        min-height: calc(100vw * (64/375));
    }
    .pad_A, .pad_B {
        display: flex;
        align-items: center;
        justify-content: center;
        img {
            width: calc(100vw * (30/375));
        }
    }
	.num_pad_card {
        margin-top: auto;
        width: 100%;
        padding: calc(100vw * (34/375)) calc(100vw * (25/375)) calc(100vw * (60/375));
        border-radius: calc(100vw * (25/375)) calc(100vw * (25/375)) 0 0;
        display: grid;
        grid-template-columns: repeat(3,1fr);
        column-gap: calc(100vw * (17/375));
        row-gap: calc(100vw * (4/375));
        align-items: center;
        font-family: "Roboto", sans-serif;
        font-weight: 500;
        margin-top: auto;
    }
    .pad_card {
        border-radius: calc(100vw * (24/375));
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: calc(100vw * (24/375));
        font-weight: 500;
        max-height: calc(100vw * (64/375));
        min-height: calc(100vw * (64/375));
    }
    .pad_card_A, .pad_card_B {
        display: flex;
        align-items: center;
        justify-content: center;
        img {
            width: calc(100vw * (30/375));
        }
    }
    .modal_xbtn {
        width: calc(100vw * (28/375));
        height: calc(100vw * (28/375));
        position: absolute;
        top: calc(100vw * (10/375));
        right: calc(100vw * (12/375));
        z-index: 3;
    }
}

.pw_modal.on {
    transform: translateY(0%);
}

/* END pw modal */



/* daterangpicker*/
/*.daterangepicker {*/
/*	width: calc(100vw * (346/375)) !important;*/
/*}*/
/*.daterangepicker .drp-calendar {*/
/*	max-width: unset !important;*/
/*	width:100% !important;*/
/*}*/
/*.daterangepicker .calendar-table table {*/
/*	border-collapse: separate !important;*/
/*}*/
/*.daterangepicker td.start-date {*/
/*	border-radius: 50px 0 0 50px !important;*/
/*}*/
/*.daterangepicker td.end-date {*/
/*	border-radius: 0 50px 50px 0 !important;*/
/*}*/
/*.daterangepicker .drp-calendar.left {*/
/*	padding: calc(100vw * (12 / 375)) calc(100vw * (12 / 375)) calc(100vw * (5 / 375)) !important;*/
/*}*/
/*.daterangepicker .drp-calendar.right {*/
/*	padding: calc(100vw * (5 / 375)) calc(100vw * (12 / 375)) calc(100vw * (12 / 375)) !important;*/
/*}*/
/*.daterangepicker select {*/
/*	background: url(../image/sub/datepicker_sel.png) no-repeat right center;*/
/*    background-size: calc(100vw * (22/375)) calc(100vw * (22/375));*/
/*}*/
/*.daterangepicker select.monthselect {*/
/*	text-align:right;*/
/*	font-size: calc(100vw * (18/375)) !important;*/
/*	font-weight:400;*/
/*	padding-right: calc(100vw * (22 / 375)) !important;*/
/*	height: auto !important;*/
/*    line-height: normal !important;*/
/*}*/
/*.daterangepicker select.yearselect {*/
/*	font-size: calc(100vw * (18/375)) !important;*/
/*	font-weight:400;*/
/*	width: 28% !important;*/
/*}*/
/*.daterangepicker .calendar-table th, .daterangepicker .calendar-table td {*/
/*	font-size: calc(100vw * (13/375)) !important;*/
/*	font-weight: 400 !important;*/
/*	width:auto !important;*/
/*	height: auto !important;*/
/*	line-height: normal !important;*/
/*}*/
/*.daterangepicker .calendar-table tr:nth-child(2) th,*/
/*.daterangepicker .calendar-table td {*/
/*	padding:calc(100vw * (4/375)) 0;*/
/*}*/
.daterangepicker td.in-range {
	background-color: #E7F0F3 !important;
}
.daterangepicker td.active, .daterangepicker td.active:hover {
	background-color: var(--main-color) !important;
}
.daterangepicker td.off {
	background:transparent !important;
}
/*.daterangepicker .calendar-table .next span, .daterangepicker .calendar-table .prev span {*/
/*	width: calc(100vw * (32/375)) !important;*/
/*    height: calc(100vw * (32/375)) !important;*/
/*    border: 0 !important;*/
/*    transform: none !important;*/
/*	background-size: 100% 100%;*/
/*}*/
/*.daterangepicker .calendar-table .prev span {*/
/*	background-image:url('../image/sub/datepicker_prev.png');*/
/*}*/
/*.daterangepicker .calendar-table .next span {*/
/*	background-image:url('../image/sub/datepicker_next.png');*/
/*}*/
/* END - daterangpicker*/




/* copy Ãß°¡ºÐ */
#header {
    position: fixed !important;
    background-color: var(--mainbgcolor);
}
#header .header_proimg {
    width: calc(100vw * (36/375));
    height: calc(100vw * (28/375));
    border: 0;
    img {
        width: 100%;
    }
}
#header .header_profile {
    display: flex;
    flex-direction: column;
    margin-left: calc(100vw * (14/375));
}
#header .header_profile .pro_name{
    color: #202020;
    font-size: calc(100vw * (18/375));
    font-weight: 700;
}
#header .header_profile .pro_id{
    color: #767676;
    font-size: calc(100vw * (14/375));
    font-weight: 400;
    margin-top: calc(100vw * (-4/375));
}

#footer {
    background-color:var(--mainbgcolor);
}
#footer .footer_logo {
    width: auto;
    display: flex;
    gap: calc(100vw * (10/375));
    img {
        width: calc(100vw * (82/375));
    }
    span {
        font-family: "Gmarket Sans";
        font-size: calc(100vw * (22/375));
        font-weight: 500;
    }
}
#footer .footer_etc {
    font-size: calc(100vw * (16/375));
}
#footer .footer_info {
    color: #98A2A6;
    font-size: calc(100vw * (14/375));
    font-weight: 400;
}
#footer .footer_fixed{
    box-shadow: none;
    border-radius: 0;
    height: unset;
    background-color: transparent;
    min-height: calc(100vw * (84 / 375));
    align-items: flex-start;
}
#footer .footer_fixed .footer_bg {
    position: absolute;
    width: calc(100vw * (400 / 375));
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 100%;
}
#footer .footer_fixed .footer_bg img {
    width: 100%;
	max-height:unset;
}
#footer .footer_fixed .footer_bg .over_bg {
    background-color: #fff;
    width: 100%;
    height: 100%;
    margin-top: calc(100vw * (-8 / 375));
}
#footer .footer_center {
    width: calc(100vw * (72/375));
    img {
        width: 100%;
    }
}
#footer .footer_btn {
    padding-top: calc(100vw * (30/375));
    word-break: keep-all;
    overflow-wrap: anywhere;
}
/* END - copy Ãß°¡ºÐ */





/* Ŭ¸¯½Ã ·Îµù ¹öÆ° */
.com_loading_btn.loading {
	position:relative;
}
.com_loading_btn.loading:before {
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:10;
}
.com_loading_btn.loading:after {
	content:"";
	width: calc(100vw * (80 / 640));
    height: calc(100vw * (80 / 640));
    border-radius: 50%;
    border: 2px solid transparent;
    border-color: transparent #fff transparent #fff;
    -moz-animation: rotate-loading-btn 2s linear 0s infinite normal;
    -moz-transform-origin: 50% 50%;
    -o-animation: rotate-loading-btn 2s linear 0s infinite normal;
    -o-transform-origin: 50% 50%;
    -webkit-animation: rotate-loading-btn 2s linear 0s infinite normal;
    -webkit-transform-origin: 50% 50%;
    animation: rotate-loading-btn 2s linear 0s infinite normal;
    transform-origin: 50% 50%;
	position:absolute;
	top:50%;
	left:50%;
	z-index:10;
}
.com_loading_btn.loading .com_btn{
	position:relative;
	overflow:hidden;
}
.com_loading_btn.loading .com_btn:before {
	content:"";
	width:100%;
	height:100%;
	background-color: rgba(0, 0, 0, .6);
	position:absolute;
	top:0;
	left:0;
}

@keyframes rotate-loading-btn {
	0% {
		transform: translate(-50%,-50%) rotate(0deg);
		-ms-transform: translate(-50%,-50%) rotate(0deg);
		-webkit-transform: translate(-50%,-50%) rotate(0deg);
		-o-transform: translate(-50%,-50%) rotate(0deg);
		-moz-transform: translate(-50%,-50%) rotate(0deg);
	}

	100% {
		transform: translate(-50%,-50%) rotate(360deg);
		-ms-transform: translate(-50%,-50%) rotate(360deg);
		-webkit-transform: translate(-50%,-50%) rotate(360deg);
		-o-transform: translate(-50%,-50%) rotate(360deg);
		-moz-transform: translate(-50%,-50%) rotate(360deg);
	}
}
/* END - Ŭ¸¯½Ã ·Îµù ¹öÆ° */