@charset "utf-8";

/*
* File       : site-custom.css
* Author     : B-WORKER
*      
 * SUMMARY:
 * 1) SITE CUSTOM 
*/

/* color set */
[data-color="00"]{color:var(--c-01) !important;}
[data-color="01"]{color:var(--c-02) !important;}
[data-color="02"]{color:var(--c-03) !important;}

/* button common */
*.basic-btn{display:inline-flex; justify-content:space-between; align-items:center; position:relative; box-sizing:border-box; padding:23rem 25rem; background:var(--c-01); border:1px solid var(--c-01); font-weight:600; font-size:15rem; color:var(--f-01); min-width:190rem; transition: var(--trans-01);}
*.basic-btn:hover{background:var(--c-01); color:#fff !important; border-color:var(--c-01);}
*.basic-btn::after{content:""; display:block; height:11rem; margin-left:20rem; background-position:50% 50%; transform:rotate(-90deg); min-width:11rem; background-image:url(../img/common/arrow-basic_w.svg); background-repeat:no-repeat;}

.border20,
[data-radius="20"]{border-radius: 20rem; overflow: hidden;}

.btn-bubble{display:inline-flex; justify-content:center; align-items:center; padding:19rem 29rem; background-color:#222; border:1px solid #222; font-size:15rem; color:#fff; transition:all .5s; border-radius:0rem 90rem 90rem 100rem; min-width:150rem;}
a.btn-bubble.download::after{content:""; display:block; width:15rem; height:15rem; margin-left:25rem; background:url(../img/sub/ic-download.svg) no-repeat 50% 50%;}

@media (hover: hover) and (pointer: fine){
    .btn-bubble:hover{background-color:#fff; box-shadow:20px 20px 40px 0px rgba(44, 44, 44, 0.33); color:#222; border-radius:90rem 0rem 90rem 100rem;}
    a.btn-bubble.download:hover::after{background-image:url(../img/sub/ic-download_b.svg);}
}

@media (max-width: 540px){
	*.basic-btn{padding:19rem 20rem;font-size:14rem;min-width:160rem;display: flex;}
}

/*  */
@media all and (max-width:1023px){
	.btn-bubble{padding:16rem 24rem; font-size:14rem;}
	.border20,
	[data-radius="20"]{border-radius:10rem;}
}

@media (max-width: 540px){
    .border20{border-radius: 10rem;}
    .btn-bubble{font-size: 14rem;padding: 13rem 23rem;}
}

/* 영상 full */
.cnm-video{object-fit: cover;position: absolute;top: 50%;left: 50%;width: 100vw;height: 100vh;transform: translate(-50%, -50%);}
.cnm-video-wrap{top:0; left:0; width:100%; height:100vh;}

@media (min-aspect-ratio: 16/9) {
  .cnm-video{height: 56.25vw;}
}
@media (max-aspect-ratio: 16/9) {
	.cnm-video{width: 177.78vh;}
}