@charset "utf-8";

/*
* File       : site-custom.css
* Author     : B-WORKER
*      
 * SUMMARY:
 * 1) SITE CUSTOM 
    2) 사이트 전반적으로 함께 쓰이는 클레스 들 ex)버튼스타일
*/

/* text */
[data-title="60"]{font-size: 60rem; line-height: 1.3333; font-weight: 600;}
[data-title="48"]{font-size: 48rem; font-weight: 600; line-height: 1.625;}
[data-title="30"]{font-size: 30rem; font-weight: 500; line-height: 1.6;}
[data-title="18"]{font-size: 18rem; font-weight: 300;}
[data-mode="bright"] [data-title="60"]{font-weight: 700;}
[data-mode="bright"] [data-title="48"]{font-weight: 700;}
[data-mode="bright"] [data-title="30"]{font-weight: 700;}
[lang="en-US"] [data-title="30"]{line-height: 1.4}

@media (max-width:1480px){
    [data-title="60"]{font-size: 50rem}
}
@media all and (max-width:1023px){
    [data-title="60"]{font-size: 42rem;}
    [data-title="48"]{font-size: 38rem;}
	[data-title="30"]{font-size: 26rem;}
    
}
@media (max-width:860px){
    [data-title="60"]{font-size: 36rem;}
    [data-title="30"]{font-size: 22rem;}
    [data-title="48"]{font-size: 30rem;}
    [data-title="18"]{font-size: 16rem;}
}
@media (max-width: 540px){
    [data-title="60"]{font-size: 27rem;}
    [data-title="48"]{font-size: 20rem;}
    [data-title="30"]{font-size: 17rem;}
    [data-title="18"]{font-size: 15rem;}
    [data-title="30"]{line-height: 1.4;}
}

/* color set */
[data-color="01"]{color:var(--c-01);}

/* 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;}

[data-linkBtn]{border-radius: 8rem;  transition: all .3s ease;display: flex;  justify-content: center; align-items: center;}
[data-linkBtn] *{font-size: 14rem !important; transition: all .3s ease; text-transform: uppercase;}
[data-linkBtn].white{border:1px solid #cecece}
[data-linkBtn].white * {color: var(--b-01);  fill: var(--b-01);}
[data-linkBtn].dark{border:1px solid #5f5f5f;}
[data-linkBtn].dark *{color: #c9c9c9;  fill: #c9c9c9; }
[data-linkBtn].pure{border:1px solid #fff}
[data-linkBtn].pure *{color: #fff; fill: #fff;}
[data-linkBtn="basic"]{width: 174rem; height: 63rem;  }
[data-linkBtn="basic"] svg,[data-linkBtn="basic"] img{width: 12rem; margin-left: 29rem;}
[data-linkBtn="small"]{min-width: 116rem; height: 40rem; text-align: center; line-height: 40rem; padding: 0 18rem;}


@media (hover: hover) {
    [data-linkBtn="basic"]:hover svg{margin-left: 37rem;}
    [data-linkBtn].dark:hover{border-color: var(--c-01);}
    [data-linkBtn].dark:hover *{color: #fff; fill: #fff;}
}

/* border-box */
[data-box]{border-radius: 12rem; border:1px solid #373737;  overflow: hidden; box-sizing: border-box;}
[data-box="image"]{}
[data-box="padding"]{padding: 10rem; background-color: transparent;}
[data-box="conts"]{border:none; border-radius: 0; padding:36rem 40rem;}

@media all and (max-width:1023px){
	[data-box="conts"]{padding: 32rem 22rem;}
    [data-linkBtn="basic"]{width: 164rem; height: 58rem;}
}
@media (max-width:860px){
    [data-box="conts"]{padding: 24rem 14rem 12rem 20rem;}
    
    [data-linkBtn="small"]{height: 45rem; padding: 0 15rem;}
}

@media (max-width: 540px){
    [data-linkBtn] *{font-size: 13rem !important;}
    [data-box="conts"]{padding: 24rem 20rem 22rem 20rem;}
    [data-linkBtn="small"]{height: 42rem; min-width: 104rem; padding: 0 12rem;}
    [data-linkBtn="basic"]{width: 124rem; height: 48rem;}
    [data-linkBtn="basic"] svg, [data-linkBtn="basic"] img {margin-left: 9rem;}
	*.basic-btn{padding:19rem 20rem;font-size:14rem;min-width:160rem;display: flex;}
    @media (hover: hover) {
        [data-linkBtn="basic"]:hover svg{margin-left: 1rem;}
    }

    [data-box]{border-radius: 8rem;}

}


/* border-radius */
[data-border]{overflow: hidden;}
[data-border="12"]{border-radius: 12rem;}
[data-border="40"]{border-radius: 40rem;}

/* dark-mode */
[data-mode="bright"] [data-linkBtn="basic"].dark{background-color: #222;}
[data-mode="bright"] [data-linkBtn="basic"].dark *{color: #fff; fill: #fff;}
[data-mode="bright"] [data-linkBtn="small"].dark{border-color:transparent; background-color: #f2f2f2;}

[data-mode="bright"] [data-box]{border-color:#e6e6e6}
[data-mode="bright"] [data-box="image"]{border:none}

@media (hover: hover) {
    [data-mode="bright"]  [data-linkBtn="basic"]:hover svg{margin-left: 37rem;}
    [data-mode="bright"]  [data-linkBtn].dark:hover{border-color: var(--c-01); background-color: var(--c-01);}
    [data-mode="bright"]  [data-linkBtn].white:hover{border-color: var(--c-01); color: var(--c-01);}
    [data-mode="bright"]  [data-linkBtn].white:hover *{color: var(--c-01); fill: var(--c-01);}
}

.swiper-controls .wrap *{cursor:pointer;}
.swiper-container img{width:100%;}
.swiper-controls > div{cursor: pointer;}
.button-next.swiper-button-disabled,
.button-prev.swiper-button-disabled{opacity:0.5;}

.swiper-controls{display:flex; justify-content:center; align-items:center;}
.swiper-controls *[class^="swiper-btn--"]{position:relative;width:30rem;height:30rem;cursor:pointer;display: flex;align-items: center;margin: 0 25rem;font-size: 16rem; font-weight: 600;}
.swiper-controls *[class^="swiper-btn--"]::after{content:"";display:block;min-width: 30rem;height: 30rem;background:url(/theme/basic/img/common/arrow-basic.svg) no-repeat 50% 50%;background-size: 8rem;}
.swiper-controls .swiper-btn--prev{flex-direction: row-reverse;}