@charset "UTF-8";

/* **************************************** *
 * visual
 * **************************************** */
.msec-visual{position:relative}
.msec-visual .visual-swiper-container{position:relative; background:url("../img/main/visual-bg01.jpg") no-repeat 50% 50%; background-size:cover}
.msec-visual .visual-swiper .swiper-slide .slide-box{display:flex; flex-direction:column; justify-content:center; width:140rem; height:90rem; margin:0 auto; padding:0 8rem; box-sizing:border-box}
.msec-visual .visual-swiper .swiper-slide .slide-box .slogan-m{display:flex; flex-direction:column}
.msec-visual .visual-swiper .swiper-slide .slide-box .slogan-m strong{line-height:6.5rem; color:#fff; font-size:5.5rem; font-weight:600; letter-spacing:-0.05rem}
.msec-visual .visual-swiper .swiper-slide .slide-box .slogan-s{display:flex; flex-direction:column; margin-top:4rem}
.msec-visual .visual-swiper .swiper-slide .slide-box .slogan-s p{line-height:3.5rem; color:#92734c; font-size:2.5rem; font-weight:normal; letter-spacing:-0.05rem}

.msec-visual .visual-object{position:absolute; bottom:0; left:50%; width:140rem; margin-left:-70rem; z-index:1}
.msec-visual .visual-object .object-l{content:''; position:absolute; left:13.5rem; bottom:-3rem; width:12.7rem; height:15.1rem; background:url("../img/main/visual-gcoin-l.png") no-repeat 50% 50%; background-size:12.7rem; height:15.1rem}
.msec-visual .visual-object .object-r{content:''; position:absolute; right:-15rem; bottom:-18rem; width:69.6rem; height:55.4rem; background:url("../img/main/visual-gcoin-r.png") no-repeat 50% 50%; background-size:69.6rem; height:55.4rem}

.msec-visual .visual-object .scroll-down{display:flex; position:absolute; left:0; bottom:5rem; width:12.1rem; height:12.1rem; margin:0; padding:0; background-color:transparent; border:0; cursor:pointer; box-sizing:border-box}
.msec-visual .visual-object .scroll-down:before{content:''; width:12.1rem; height:12.1rem; background:url("../img/main/scroll-down-circle.png") no-repeat 50% 50%; background-size:12.1rem 12.1rem}
.msec-visual .visual-object .scroll-down:before{animation: scroll-down 15s linear infinite; transform-origin:center center}
@keyframes scroll-down{from{transform: rotate(0deg)} to{transform:rotate(360deg)}}
.msec-visual .visual-object .scroll-down:after{content:''; position:absolute; left:0; top:0; right:0; bottom:0; background:url("../img/main/scroll-down-arrow.png") no-repeat 50% 50%}


/* **************************************** *
 * intro
 * **************************************** */
.msec-intro .msec-inner{display:flex; flex-direction:column; width:140rem; margin:0 auto; padding:15rem 0}
.msec-intro .intro-token{display:flex}
.msec-intro .intro-token:before{content:''; flex:none; position:relative; min-width:56.9rem; max-width:56.9rem; min-height:70rem; max-height:70rem; margin-left:-29rem; background:url("../img/main/intro-token-bg.jpg") no-repeat 50% 50%; border-radius:2rem}
.msec-intro .intro-token .event-message-01{padding-left:6rem; padding-top:11rem}
.msec-intro .intro-token .event-message-01 .message-01{display:flex; flex-direction:column}
.msec-intro .intro-token .event-message-01 .message-01 p{line-height:4.1rem; color:#202020; font-size:3.1rem; font-weight:300; letter-spacing:-0.05rem}
.msec-intro .intro-token .event-message-01 .message-02{display:flex; flex-direction:column; gap:0.4rem; margin-top:4rem}
.msec-intro .intro-token .event-message-01 .message-02 strong{line-height:5.4rem; color:#92734c; font-size:4.4rem; font-weight:600; letter-spacing:-0.2rem; background:linear-gradient(130deg, #c4951a 0%, #dfba5e 60%, #dfba5e); -webkit-background-clip:text; -webkit-text-fill-color:transparent}
.msec-intro .intro-token .event-message-01 .message-03{display:flex; flex-direction:column; gap:0.4rem; margin-top:7rem}
.msec-intro .intro-token .event-message-01 .message-03 p{line-height:3.3rem; color:#505050; font-size:2.3rem; font-weight:normal; letter-spacing:-0.08rem}

.msec-intro .intro-vision{margin-top:14rem}
.msec-intro .intro-vision .vision-message-01 .message-01{display:flex; flex-direction:column; gap:0.4rem}
.msec-intro .intro-vision .vision-message-01 .message-01 strong{line-height:5.4rem; color:#533d19; font-size:4.4rem; font-weight:600; letter-spacing:-0.2rem; background:linear-gradient(130deg, #533d19 0%, #9c8255 20%, #9c8255 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent}
.msec-intro .intro-vision .vision-message-01 .message-02{display:flex; flex-direction:column; gap:0.4rem; margin-top:4.4rem}
.msec-intro .intro-vision .vision-message-01 .message-02 p{line-height:4.1rem; color:#202020; font-size:3.1rem; font-weight:300; letter-spacing:-0.05rem}

.msec-intro .vision-swiper-container{position:relative; margin-top:7rem}
.msec-intro .vision-swiper .swiper-box{display:flex; flex-direction:column; position:relative; background-color:#101010; border-radius:2.8rem; overflow:hidden; box-sizing:border-box}
.msec-intro .vision-swiper .swiper-thum{width:100%; height:100%}
.msec-intro .vision-swiper .swiper-thum img{display:block; width:100%; height:100%; transform:scale(1); image-rendering:-webkit-optimize-contrast; transition:all .35s ease}
.msec-intro .vision-swiper .swiper-thum:before{content:''; position:absolute; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,.1); border-radius:2.8rem; z-index:1}
.msec-intro .vision-swiper .swiper-info{display:flex; flex-direction:column; justify-content:flex-end; position:absolute; top:0; left:0; bottom:0; right:0; padding:5rem 3.5rem; z-index:2; box-sizing:border-box}
.msec-intro .vision-swiper .swiper-info.align-t{justify-content:flex-start}
.msec-intro .vision-swiper .swiper-info:before{content:''; position:absolute; bottom:0; left:0; right:0; height:30rem; background:transparent; background:linear-gradient(0deg,rgba(0,0,0,.5),rgba(0,0,0,0))}
.msec-intro .vision-swiper .swiper-info.align-t:before{bottom:auto; top:0;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,0))}
.msec-intro .vision-swiper .swiper-info .info{min-height:10.2rem; line-height:3.4rem; color:#fff; font-size:2.1rem; font-weight:normal; letter-spacing:-0.05rem; overflow:hidden; z-index:1}



/* **************************************** *
 * events
 * **************************************** */
.msec-event{background:url("../img/main/event-bg.jpg") no-repeat 50% 50%; background-size:cover}
.msec-event .msec-inner{display:flex; flex-direction:column; width:140rem; margin:0 auto; padding:14.5rem 0}
.msec-event .msec-tit{display:flex; align-items:center; margin-bottom:3.5rem}
.msec-event .msec-tit .tit span{line-height:4.7rem; color:#fff; font-size:4.7rem; font-weight:900; text-align:center; letter-spacing:-0.05rem}

.msec-event .event-message-01{display:flex; flex-direction:column; gap:2rem}
.msec-event .event-message-01 .message-01{display:flex; flex-direction:column; gap:0.4rem}
.msec-event .event-message-01 .message-01 p{line-height:4.1rem; color:#92734c; font-size:3.1rem; font-weight:300; letter-spacing:-0.08rem; background:linear-gradient(130deg, #c4951a, #dfba5e); -webkit-background-clip:text; -webkit-text-fill-color:transparent}
.msec-event .event-message-01 .message-02{display:flex; flex-direction:column; gap:0.4rem}
.msec-event .event-message-01 .message-02 p{line-height:4.1rem; color:#fff; font-size:3.1rem; font-weight:300; letter-spacing:-0.05rem}

.msec-event .event-step{display:flex; margin-top:9rem}
.msec-event .event-step .step-tit{flex:none; min-width:24rem; padding-top:0.6rem}
.msec-event .event-step .step-tit .tit{line-height:3.1rem; color:#fff; font-size:3.1rem; font-weight:300; letter-spacing:-0.05rem}
.msec-event .event-step .step-detail{display:flex; flex-direction:column; flex:1}
.msec-event .event-step .step-num{display:flex; flex-direction:column; gap:2rem}
.msec-event .event-step .step-num .num-box{display:flex}
.msec-event .event-step .step-num .num-box .num{display:flex; align-items:center; justify-content:center; min-width:4.2rem; max-width:4.2rem; min-height:4.2rem; max-height:4.2rem; margin-right:2rem; background-color:#202020; border-radius:50%}
.msec-event .event-step .step-num .num-box .num span{line-height:2.1rem; color:#fff; font-size:2.1rem; font-weight:300; letter-spacing:-0.05rem}
.msec-event .event-step .step-num .num-box .info{flex:1; padding-top:0.5rem; padding-bottom:1.7rem; line-height:3.3rem; color:#fff; font-size:2.3rem; font-weight:normal; letter-spacing:-0.05rem; border-bottom:0.3rem solid #fff}
.msec-event .event-step .step-link{
      display:inline-flex; align-items:center; justify-content:center; flex-direction:row; gap:2rem;
      width:fit-content; height:10.8rem; margin-top:4rem; margin-left:6.2rem; padding:0 4rem; line-height:2.3rem;
      color:#fff; font-weight:300; font-size:2.3rem; white-space:nowrap; letter-spacing:-0.02rem;
      background:#d2930a url("../img/main/event-link-btn.png") no-repeat right 1rem top -0.5rem; background-size:14.1rem 15.9rem; border:0; border-radius:1.2rem; vertical-align:middle; cursor:pointer; box-sizing:border-box
 }
.msec-event .event-step .step-link:after{content:'\f5dc'; position:relative; right:0; color:#fff; font-family:remixicon; font-size:2.8rem; font-weight:normal; transition:all .35s ease}
.msec-event .event-step .step-link:hover:after{right:-1rem}


/* **************************************** *
 * market
 * **************************************** */
.msec-market{background-color:#fff}
.msec-market .msec-inner{display:flex; flex-direction:column; width:140rem; margin:0 auto; padding:14.5rem 0 16rem; box-sizing:border-box}
.msec-market .msec-tit{display:flex; align-items:center; justify-content:center; position:relative; margin-bottom:3.5rem}
.msec-market .msec-tit .tit span{line-height:4.7rem; color:#202020; font-size:4.7rem; font-weight:900; text-align:center; letter-spacing:-0.05rem}

.msec-market .msec-tit .construction-message{display:flex; flex-direction:column; align-items:center; position:absolute; left:50%; top:-5.2rem; padding:1.6rem 4rem; background-color:#101010; border-radius:1.2rem; z-index:1; transform:translate(-50%, -50%);  box-sizing:border-box}
.msec-market .msec-tit .construction-message:before{content:''; position:absolute; left:50%; margin-left:-0.8rem; bottom:-0.7rem; width:0; height:0; border-bottom:0.8rem solid none; border-top:0.8rem solid #101010; border-right:0.8rem solid transparent; border-left:0.8rem solid  transparent; z-index:1}
.msec-market .msec-tit .construction-message p{line-height:2.2rem; color:#fff; font-size:1.6rem; font-weight:300; text-align:center; letter-spacing:-0.02rem; white-space:nowrap}



.msec-market .market-message-01{display:flex; flex-direction:column; gap:4.5rem}
.msec-market .market-message-01 .message-01{display:flex; flex-direction:column; gap:0.4rem}
.msec-market .market-message-01 .message-01 strong{line-height:5.5rem; color:#92734c; font-size:4.5rem; font-weight:600; text-align:center; letter-spacing:-0.08rem; background:linear-gradient(130deg, #c4951a, #dfba5e); -webkit-background-clip:text; -webkit-text-fill-color:transparent}
.msec-market .market-message-01 .message-02{display:flex; flex-direction:column; gap:0.4rem}
.msec-market .market-message-01 .message-02 p{line-height:4.1rem; color:#202020; font-size:3.1rem; font-weight:300; text-align:center; letter-spacing:-0.05rem}

.msec-market .market-message-02{display:flex; flex-direction:column; gap:3.5rem; margin-top:7.5rem}
.msec-market .market-message-02 .message-0201,
.msec-market .market-message-02 .message-0202{display:flex; flex-direction:column; gap:0.4rem}
.msec-market .market-message-02 .message-0201 p{line-height:3.3rem; color:#505050; font-size:2.3rem; font-weight:normal; text-align:center; letter-spacing:-0.08rem}
.msec-market .market-message-02 .message-0202 p{line-height:4.1rem; color:#202020; font-size:3.1rem; font-weight:300; text-align:center; letter-spacing:-0.05rem}

.msec-market .market-swiper-container{position:relative; margin-top:7rem}
.msec-market .market-swiper .swiper-box{display:flex; flex-direction:column; position:relative; background-color:#101010; border-radius:2.8rem; overflow:hidden; box-sizing:border-box}

.msec-market .market-swiper .swiper-thum{width:100%; height:100%}
.msec-market .market-swiper .swiper-thum img{display:block; width:100%; height:100%; transform:scale(1); image-rendering:-webkit-optimize-contrast; transition:all .35s ease}
.msec-market .market-swiper .swiper-thum:before{content:''; position:absolute; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,.1); border-radius:2.8rem; z-index:1}

.msec-market .market-swiper .swiper-info{display:flex; flex-direction:column; justify-content:flex-end; position:absolute; top:0; left:0; bottom:0; right:0; padding:5rem 3.5rem; z-index:2; box-sizing:border-box}
.msec-market .market-swiper .swiper-info:before{content:''; position:absolute; bottom:0; left:0; right:0; height:20rem; background:transparent; background:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,0))}
.msec-market .market-swiper .swiper-info .info{min-height:10.2rem; line-height:3.4rem; color:#fff; font-size:2.1rem; font-weight:normal; letter-spacing:-0.05rem; overflow:hidden; z-index:1}