@charset 'utf-8';

.container { min-height:calc(100vh - 22.0rem); }

#ft .menu-wr { display:block; }

/* main-bnr */
#main-bnr { position:relative; border-radius:20px; overflow:hidden; margin-bottom:3.5rem; } 
#main-bnr .swiper { }
#main-bnr .swiper-slide { text-align:center; }
#main-bnr .swiper-slide img { width:100%; height:auto; } 
#main-bnr .swiper-slide.swiper-slide-active { z-index:100; }
#main-bnr .swiper-button-prev:after,
#main-bnr .swiper-button-next:after { display:none; }
#main-bnr .swiper-button-prev,
#main-bnr .swiper-button-next { position:absolute; left:50%; top:50%; display:block; width:51px; height:51px; background-repeat:no-repeat; background-position:center; background-size:100% auto; display:block; z-index:10; margin:0; } 
#main-bnr .swiper-button-prev { background-image:url('../img/main/btn_prev.png'); transform:translate(-580%, -50%); }
#main-bnr .swiper-button-next { background-image:url('../img/main/btn_next.png'); transform:translate(500%, -50%); }

.custmoer-service { }
.custmoer-service h3 { text-align:left; font-size:1.547rem; line-height:1.1; font-weight:700; color:#000000; margin-bottom:1.5rem; } 

.service-list { }
.service-list li { display:flex; margin-bottom:2.0rem; }
.service-list dl { position:relative; width:100%; height:10.5rem; border-radius:1.0rem; padding:1.7rem 2.0rem; box-sizing:border-box; cursor:pointer; overflow:hidden; }
.service-list dl:after { position:absolute; content:""; right:1.7rem; top:50%; transform:translateY(-50%); background-repeat:no-repeat; background-position:center; background-size:100% auto; }
.service-list dl dt,
.service-list dl dd { color:#333; }
.service-list dl dt { font-size:1.251rem; font-weight:700; margin-bottom:1.4rem; font-family: 'GmarketSans'; letter-spacing:-1px; }
.service-list dl dd { font-size:0.866rem; }
.service-list dl dd p { margin-top:0.3rem; }
.service-list dl dd p:frist-child { margin-top:0; }
.service-list dl dd p strong {  } 
.service-list dl .link { position:Relative; display:inline-block; padding-right:1.4rem; color:#333333; }
.service-list dl .link:after { content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); display:block; width:1.0rem; height:1.0rem; background-repeat:no-repeat; background-position:center; background-image:url('../img/main/ic_link_ar.png'); background-size:100% auto; }

.service-list dl.service1 { background-color:#fef7ea; }
.service-list dl.service1:after { background-image:url('../img/main/img_service01.png'); width:8.5rem; height:8.5rem;  }
.service-list dl.service2 { background-color:#f5e8ff; }
.service-list dl.service2:after { background-image:url('../img/main/img_service02.png'); width:9.5rem; height:7.1rem; }
.service-list dl.service3 { background-color:#eefff7; }
.service-list dl.service3:after { background-image:url('../img/main/img_service03.png'); width:9.0rem; height:5.4rem; right:1.4rem; }
.service-list dl.service4 { background-color:#ffe800; }
.service-list dl.service4:after { background-image:url('../img/main/img_service04.png'); width:auto; height:2.0rem; right:0.7rem; left:0.5rem; top:auto; bottom:0.8rem; transform:none; }
.service-list dl.service5 { background-color:#eae3fd; }

.service-list li.box2 { display:grid; grid-template-columns:repeat(2, 1fr); gap:1.4rem; margin-bottom:0; }
.service-list li.box2 dl { padding:0; display:flex; align-items:center; justify-content:flex-start; flex-direction: column; text-align:center; padding-top:1.5rem; }


/* 로그인 */
.sub-top.main { background-color:#fafafc; padding:5.0rem 1.0rem 2.0rem 1.0rem; box-sizing:border-box; height:auto; }
.sub-top.main .inbox { padding-bottom:11.0rem; }
.sub-top.main .text { font-size:1.9rem; color:#000; text-align:center;  }
.sub-top.main .text em { font-style:normal; color:#4271db; }
.sub-top.main .text small { font-size:1.267rem; display:Block; }
.sub-top.main .inbox:after { background-image:url('../img/main/ic_main.png'); width:9.7rem; height:9.7rem; left:50%; bottom:0; transform:translateX(-50%); content:""; }

section.section { margin-top:4.0rem; }
section.section h3 { font-size:1.933rem; margin-bottom:1.6rem; }

.prd-list.swiper-wrapper { gap:0; }
.prd-list.swiper-wrapper .swiper-slide { width:12.5rem; padding:0 0.5rem 1.0rem 0; }
.prd-list.swiper-wrapper .swiper-slide .thumb { height:6.4rem; }
.prd-list.swiper-wrapper li .info { padding:1.0rem; }
.prd-list.swiper-wrapper li .info .info-top { gap:0.5rem; margin-bottom:0.5rem; }
.prd-list.swiper-wrapper li .info .info-top .category {  width:3.5rem; height:1.2rem; font-size:0.6rem; }
.prd-list.swiper-wrapper li .info .info-top .date { font-size:0.6rem; }
.prd-list.swiper-wrapper li .info .subject { font-size:0.96rem; height :2.8rem; margin-bottom:1.0rem; }

.prd-list.swiper-wrapper li .info .info-tail .viewers { font-size:0.6rem; }
.prd-list.swiper-wrapper li .info .info-tail .btn-bookmark { width:1.4rem; height:1.4rem;  }


#reg-ranking { background-color:#fef7ea; border:1px solid #af6419; border-radius:0.5rem; padding:1.4rem 1.2rem; }
#reg-ranking dl { }
#reg-ranking dl dt { position:relative; font-size:1.933rem; font-weight:700; color:#333333; padding-left:4.5rem; margin-bottom:1.4rem; font-family: 'GmarketSans'; }
#reg-ranking dl dt:before { content:""; position:absolute; left:0; top:0.3rem; width:3.3rem; height:3.0rem; display:block; background-repeat:no-repeat; background-position:center; background-image:url('../img/main/ic_reg_ranking.png'); background-size:100% auto; }
#reg-ranking dl dt .date { text-align: left; font-size: 11px; font-weight: normal; }
#reg-ranking dl dd { }
#reg-ranking dl ul { }
#reg-ranking dl ul li { background-color:#fff; border-radius:0.5rem;  text-align:center; padding:0.5rem 1.0rem; box-shadow:2px 2px 5px #ddd; box-sizing:border-box; margin-bottom:0.3rem; display:grid; grid-template-columns:2.2rem 1fr 2.5rem 2.5rem; gap:0.5rem; }
#reg-ranking dl ul li p { display:flex; align-items:center; justify-content:flex-start; font-size:0.928rem; line-height:1.45; color:#333333; }
#reg-ranking dl ul li p strong { color:#999999; font-weight:400; }
#reg-ranking dl ul li .no { width:2.2rem; height:2.2rem; border-radius:2.2rem; display:flex; align-items:Center; justify-content:center; margin:0 auto; background-color:#dff0ff; font-size:1.2rem; justify-content:center; }
#reg-ranking dl ul li .title {  }

#reg-ranking dl ul li.no1 { border:1px solid #798ee1;  } 


.service-list dl.service7 { background-color:#fafafc; }
.service-list dl.service7:after { background-image:url('../img/main/ic_promotion.png'); width:7.6rem; height:8.0rem; right:1.5rem;  }
.service-list dl.service8 { background-color:#fafafc; }
.service-list dl.service8:after { background-image:url('../img/main/ic_price_info.png'); width:7.6rem; height:7.1rem; right:2.0rem;  }
