@charset "utf-8";

/*
 ★ Coding By DumiCode
 ★ homepage: http://www.dumicode.com
*/

/* font */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');
@import url("fonts/GmarketSans/GmarketSans.css");
@import url("fonts/NotoSansKR/NotoSansKR.css");

/* default set */
@import url("base.css");

/* common */
@import url("common.css");



/* Text Selection Color */
::-moz-selection {color:#fff; background:#00AEEF;}
::selection {color:#fff; background:#00AEEF;}

/* Placeholder Color */
::-webkit-input-placeholder {opacity:1; color:#9E9E9E;}
:-moz-placeholder {opacity:1; color:#9E9E9E;}
::-moz-placeholder {opacity:1; color:#9E9E9E;}
:-ms-input-placeholder {opacity:1 !important; color:#9E9E9E !important;}
::-ms-input-placeholder {opacity:1; color:#9E9E9E;}
::placeholder {opacity:1; color:#9E9E9E;}

/* Design Font */
.gmarketL {font-family: 'Gmarket Sans'; font-weight:300;}
.gmarketM {font-family: 'Gmarket Sans'; font-weight:500;}
.gmarketB {font-family: 'Gmarket Sans'; font-weight:700;}

/* Remixicon */
[class^="ri-"]:before, [class*=" ri-"]:before {vertical-align:top; font-family:'remixicon' !important; font-style:normal; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}

/* Clearfix */
.clearfix::before {display:block; content:"";}
.clearfix::after {display:block; clear:both; content:"";}

/* Helper Classes */
.align-t {vertical-align:top;}
.align-m {vertical-align:middle;}
.align-b {vertical-align:bottom;}
.align-l {text-align:left;}
.align-c {text-align:center;}
.align-r {text-align:right;}
.align-j {-webkit-text-align-last:justify; -moz-text-align-last:justify; text-align:justify; text-align-last:justify;}
.float-l {float:left;}
.float-r {float:right;}
.ellipsis {overflow:hidden; white-space:nowrap; -o-text-overflow:ellipsis; text-overflow:ellipsis;}

.line_solid {display:block; margin:40px 0; border:none; border-top:1px solid #CECECE;}
.line_dashed {display:block; margin:40px 0; border:none; border-top:1px dashed #CECECE;}
.line_dotted {display:block; margin:40px 0; border:none; border-top:1px dotted #CECECE;}

/*-------------------------------------------------------------------
    @Only (Display 스타일은 다양하므로 숨길경우만 사용)
-------------------------------------------------------------------*/
/* Viewport */
@media screen and (min-width: 1024px){.hide-pc {display:none !important;}}
@media screen and (min-width: 768px) and (max-width: 1023px){.hide-pad {display:none !important;}}
@media screen and (max-width: 767px){.hide-mobile {display:none !important;}}

/* Media */
@media screen {.hide-screen {display:none !important;}}
@media print {.hide-print {display:none !important;}}

/*------------------------------------------------------------------------------
    @Color Set
    - 배경: bg-, 텍스트: txt-, 라인: line-
    - 밝은: -light, 어두운: -dark, 더 밝은/어두운: ~er
------------------------------------------------------------------------------*/
/* 기본 */
.bg-none {background-color:transparent !important;}
.txt-none {color:transparent !important;}
.line-none {border-color:transparent !important;}

/* 주 강조 */
.bg-primary {background-color:#FBD74A;}
.txt-primary {color:#FBD74A;}
.line-primary {border-color:#FBD74A;}
.bg-primary2 {background-color:#FB7A4A;}
.txt-primary2 {color:#FB7A4A;}
.line-primary2 {border-color:#FB7A4A;}
.bg-primary3 {background-color:#424242;}
.txt-primary3 {color:#424242;}
.line-primary3 {border-color:#424242;}

/* 부 강조 */
.bg-secondary {background-color:#00AEEF;}
.txt-secondary {color:#00AEEF;}
.line-secondary {border-color:#00AEEF;}
.bg-secondary2 {background-color:#EF0078;}
.txt-secondary2 {color:#EF0078;}
.line-secondary2 {border-color:#EF0078;}
.bg-secondary3 {background-color:#05AA5C;}
.txt-secondary3 {color:#05AA5C;}
.line-secondary3 {border-color:#05AA5C;}

/* 그라디언트 */
/* .bg-gradient {background-color:; background-image:linear-gradient(90deg,  0%,  100%);}
.txt-gradient {background-image:linear-gradient(90deg,  0%,  100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; color:;}
.line-gradient {border-color:; border-image:linear-gradient(90deg,  0%,  100%); border-image-slice:1;} */

/* 상태 */
.bg-errored {background-color:#C50027;}
.txt-errored {color:#C50027;}
.line-errored {border-color:#C50027;}
.bg-reviewed {background-color:#097B9B;}
.txt-reviewed {color:#097B9B;}
.line-reviewed {border-color:#097B9B;}
.bg-succeed {background-color:#008A28;}
.txt-succeed {color:#008A28;}
.line-succeed {border-color:#008A28;}
.bg-waited {background-color:#CD3700;}
.txt-waited {color:#CD3700;}
.line-waited {border-color:#CD3700;}
.bg-completed {background-color:#088A20;}
.txt-completed {color:#088A20;}
.line-completed {border-color:#088A20;}

/*------------------------------------------------------------------------------
    @에러 / 준비중
------------------------------------------------------------------------------*/
#wrap.full-page {display:table; width:100vw; height:100vh; padding:40px 0; margin:0 auto; word-wrap:break-word; word-break:keep-all;}
#wrap.full-page > div {display:table-cell; vertical-align:middle;}

#errow-wrap {word-wrap:break-word; word-break:keep-all;}
#errow-wrap .errow-wrap-inr {margin:0 auto;}
#errow-wrap .errow-wrap-inr.inr {max-width:656px; padding:0; padding-left:395px; background:url(../images/error-img.png) no-repeat left center;}
#errow-wrap .error-message {}
#errow-wrap .error-message h1 {margin-bottom:25px; font-weight:300; font-size:5rem; line-height:1.48; letter-spacing:-0.025em; color:#E81515;}
#errow-wrap .error-message h1 b {font-weight:900;}
#errow-wrap .error-message p {font-weight:400; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#212121;}
#errow-wrap .error-message p + p {margin-top:24px;}
#errow-wrap .error-message p b {font-weight:700;}
#errow-wrap .button-box {margin-top:24px;}
#errow-wrap .button-box .btn {width:120px;}

#prepare-wrap {border:1px solid #C4C4C4; background-color:#F9F9F9; word-wrap:break-word; word-break:keep-all;}
#prepare-wrap .prepare-wrap-inr {}
#prepare-wrap .prepare-wrap-inr.inr {padding:119px 100px 132px 529px; background:url(../images/preparing-img.png) no-repeat left 92px center;}
#prepare-wrap .prepare-message {min-height:180px;}
#prepare-wrap .prepare-message h1 {margin-bottom:32px; font-weight:400; font-size:3.5rem; line-height:1.4857; letter-spacing:-0.05em; color:#1C1C1C;}
#prepare-wrap .prepare-message h1 b {font-weight:700; color:#E81515;}
#prepare-wrap .prepare-message p {font-weight:400; font-size:1.8rem; line-height:1.5556; letter-spacing:-0.025em; color:#4D4D4D;}
#prepare-wrap .prepare-message p + p {margin-top:14px;}
#prepare-wrap .prepare-message p b {font-weight:500;}
#prepare-wrap .prepare-message p span {color:#E81515;}

@media only screen and (max-width:767px) {
	#errow-wrap .errow-wrap-inr.inr {padding:0 5%; padding-top:310px; background-position:center top; text-align:center;}

	#prepare-wrap .prepare-wrap-inr.inr {padding:370px 5% 92px 5%; background-position:center top 92px; text-align:center;}
}

/*------------------------------------------------------------------------------
    @팝업
------------------------------------------------------------------------------*/
.pop-layer {display:none; position:absolute; top:50%; left:50%; width:auto; height:auto; background-color:#333; z-index:999;}
.dim-layer {display:none; position:fixed; z-index:1000; top:0; left:0; width:100%; height:100%;}
.dim-layer .dimBg {position:absolute; top:0; left:0; width:100%; height:100%; background-color:#081023; opacity:0.4;}
.pop-layer .pop-container .pop-conts {font-size:0;}
.pop-layer .pop-container .pop-conts .cont_txt{overflow-x:hidden auto; padding:15px; background-color:#fff;}
.pop-layer .close-bottom {width:100%; height:50px; font-size:0;}
.pop-layer .close-bottom a {display:inline-block; position:relative; width:50%; padding:0 10px; text-align:center; font-weight:500; font-size:1.6rem; line-height:50px; letter-spacing:-0.025em; color:#fff; cursor:pointer;}
.pop-layer .close-bottom a:hover,
.pop-layer .close-bottom a:focus {text-decoration:underline;}
.pop-layer .close-bottom a.btn-layerClose {background-color:#343434;}
.pop-layer .close-bottom a.close_text {background-color:#000;}
.pop_padding {padding:30px;}

#slide-pop {position:absolute; z-index:89; top:88px; left:0; overflow:hidden; width:100%; text-align:center; transition:all 0.3s;}
#slide-pop.show {overflow:visible;}
#slide-pop img {vertical-align:top; width:100%; height:100%; max-width:100%;}
#slide-pop > a {display:table; width:100%; height:40px; padding:8px; background-color:#00AEEF; transition:all 0.3s;}
#slide-pop > a > span {display:table-cell; vertical-align:middle; font-size:0;}
#slide-pop > a > span > i {display:inline-block; vertical-align:top; margin-right:5px; font-size:2.4rem; line-height:1; color:#fff;}
#slide-pop > a > span > b {display:inline-block; vertical-align:top; margin-right:5px; font-weight:700; font-size:2rem; line-height:1.2; letter-spacing:-0.025em; color:#FBD74A;}
#slide-pop > a > span > span {display:inline-block; vertical-align:top; font-weight:700; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#fff;}
#slide-pop > div {position:absolute; top:100%; right:0; left:0; padding:12px 18px 15px 18px; background-color:rgba(0,0,0,0.7);}
#slide-pop .slide-pop-upr {position:relative; margin-bottom:12px;}
#slide-pop .slide-pop-upr > p {}
#slide-pop .slide-pop-upr > p > span {display:inline-block; vertical-align:top; font-weight:700; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#fff;}
#slide-pop .slide-pop-upr > p > i {display:inline-block; vertical-align:top; margin-right:5px; font-size:2.4rem; line-height:1; color:#fff;}
#slide-pop .slide-pop-inr {}
#slide-pop .pop-slider {margin:0 auto;}
#slide-pop .pop-slider.swiper-container {}
#slide-pop .pop-slider .swiper-wrapper {}
#slide-pop .pop-slider .swiper-slide {}
#slide-pop .pop-slider .swiper-slide a {display:block;}
#slide-pop .pop-slider .swiper-slide .cont {overflow:hidden; border-radius:10px; background-color:#fff;}
#slide-pop .pop-slider .swiper-slide .cont > div {overflow:auto; max-height:100%; padding:15px; font-weight:400; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#212121;}
#slide-pop .pop-slider .swiper-slide .cont > div * {font-weight:400; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#212121;}
#slide-pop .pop-slider .swiper-slide .tit {display:block; overflow:hidden; margin-top:8px; white-space:nowrap; text-overflow:ellipsis; font-weight:500; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#fff;}
#slide-pop .pop-slider-controller {position:absolute; z-index:1; top:0; right:0; left:0; text-align:right; font-size:0;}
#slide-pop .swiper-pagination {display:inline-block; vertical-align:top; position:static; top:auto; right:auto; bottom:auto; left:auto; float:left; width:auto; margin:0; margin-right:22px; font-weight:700; font-size:1.6rem; line-height:1.5; letter-spacing:-0.05em; color:#fff;}
#slide-pop .swiper-pagination .swiper-pagination-current {vertical-align:top; color:#FBD74A;}
#slide-pop .swiper-pagination .swiper-pagination-total {vertical-align:top; opacity:1;}
#slide-pop .swiper-pagination .swiper-pagination-total::before {content:""; display:inline-block; vertical-align:top; opacity:0.5; height:15px; margin:0 9px; margin-top:4px; border-left:2px solid #fff; transform:rotate(23deg);}
#slide-pop .swiper-button-prev {display:inline-block; vertical-align:top; position:static; top:auto; right:auto; bottom:auto; left:auto; width:24px; height:24px; margin:0; background:url(../images/ico_banner-prev_w.png) no-repeat 0 0/auto; font-size:2.4rem; color:#000;}
#slide-pop .swiper-button-next {display:inline-block; vertical-align:top; position:static; top:auto; right:auto; bottom:auto; left:auto; width:24px; height:24px; margin:0; background:url(../images/ico_banner-next_w.png) no-repeat 0 0/auto; font-size:2.4rem; color:#000;}
#slide-pop .swiper-button-pause {display:inline-block; vertical-align:top; width:24px; height:24px; margin:0 4px; font-size:2.4rem; line-height:1; color:#fff; cursor:pointer;}
#slide-pop.show > a {background-color:#2E2E2E;}

@media (min-width: 1279px) {

}

@media (min-width: 1024px) {
	#slide-pop {top:152px; overflow:visible; width:auto; border-radius:0 10px 10px 0;}
	#slide-pop > a {position:absolute; top:0; left:100%; width:80px; height:80px; padding:0; margin-left:18px; border-radius:50%; box-shadow:0 3px 6px 0 rgba(0,0,0,0.2);}
	#slide-pop > a > span > span {display:block; margin-right:0; font-weight:700; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#fff;}
	#slide-pop > div {position:static; border-radius:0 10px 10px 0;}
    #slide-pop .slide-pop-upr > p {text-align:left;}
    #slide-pop .slide-pop-upr > p > span {font-weight:700; font-size:1.6rem; line-height:1.5; letter-spacing:-0.025em; color:#fff;}
    #slide-pop .pop-slider-controller {left:auto;}
    #slide-pop .swiper-pagination {float:none;}
	#slide-pop.show > a {width:48px; height:48px; margin-left:8px; box-shadow:none;}
	#slide-pop.show > a > span > i {margin-right:0; font-size:2.6rem;}
	#slide-pop.show > a > span > b {display:none;}
	#slide-pop.show > a > span > span {display:none;}
}
@media (min-width: 768px) {
	.pop-layer {margin-left:0 !important;}
}
@media (max-width: 767px) {
    .pop-layer {top:0 !important; left:50% !important;}

	#slide-pop {top:60px;}
	#slide-pop .pop-slider {width:270px !important;}
	#slide-pop .pop-slider .cont {width:270px !important; height:324px !important;}
}
@media (max-width: 550px) {
    .pop-layer {right:10%; left:10% !important; margin-left:0 !important;}
    .pop-layer img {width:100%;}
}