/* 메인////////////////////////////////////////////// */
.main-top{margin-bottom: 100px;}
.main-top .mySwiper{height: 620px; overflow: hidden; position: relative;}
.main-top .swiper-wrapper{height: 565px;}
.main-top .swiper-slide{position: relative;}
.main-top .swiper-slide .bg-cl{position: absolute; top: 0; left: 0; right: 0; background-color: #1c97d0; width: 100%; height: 470px; z-index: -1;}
.main-top .swiper-slide .container{display: flex; height: 100%;}
.main-top .swiper-slide .main-top-le{width: 384px; height: 100%; position: relative; display: flex; flex-direction: column; align-items: center; padding-top: 120px; gap: 20px;}
.main-top .swiper-slide .main-top-le span{font-size: 20px; font-weight: 200; color: #fff;}
.main-top .swiper-slide .main-top-le p{line-height: 1.24; font-size: 46px; color: #fff; text-align: center;}
.main-top .swiper-slide .main-top-le .radius-btn{width: 256px; height: 64px; font-size: 20px; color: #1c97d0; border-color: #1c97d0; position: absolute; bottom: 63px;}
/*
.main-top .swiper-slide .main-top-le .radius-btn:hover{background-color: #1c97d0; border-color: #fff; color: #fff;}
 */
.main-top .swiper-slide .main-top-le span{transform: translateY(30px); opacity: 0; transition: 1s; transition-delay: 0s;}
.main-top .swiper-slide .main-top-le p{transform: translateY(30px); opacity: 0; transition: 1s; transition-delay: 0s;}
.main-top .swiper-slide .main-top-ri .img-wrap{transform: translateY(30px); opacity: 0; transition: 1s; transition-delay: 0s;}
.main-top .swiper-slide.swiper-slide-active .main-top-le span{transform: unset; opacity: 1; transition-delay: 0.2s;}
.main-top .swiper-slide.swiper-slide-active .main-top-le p{transform: unset; opacity: 1; transition-delay: 0.5s;}
.main-top .swiper-slide.swiper-slide-active .main-top-ri .img-wrap{transform: unset; opacity: 1; transition-delay: 0.7s;}
.main-top .swiper-slide .main-top-ri{width: calc(100% - 384px);  display: flex; align-items: center}
.main-top .swiper-pagination{bottom: 20px;}
.main-top .swiper-pagination .swiper-pagination-bullet{width: 64px; border-radius: 5px; background-color: #fff; border: solid 2px #ef7d4b; opacity: 1;}
.main-top .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color: #ef7d4b;}

.main .side-h2{text-align: right; display: inline-flex; flex-direction: column; width: 200px; position: absolute; top: 0; left: calc(-200px + -40px);}
.main .side-h2 .num{font-size: 88px; -webkit-text-stroke: 2px #000; color: transparent; position: relative; z-index: 1;}
.main .side-h2 .num::before{content: ""; position: absolute; width: 40px; height: 40px; background-color: #6db575; border-radius: 100%; right: 63px; top: -3px; z-index: -1;}
.main .side-h2 span:nth-child(2){font-size: 30px;}
.main .side-h2 h2{font-size: 46px;}

.main .section1{padding: 50px 0; background-color: #fff6e6;}
.main .section1 .best-wrap{display: flex; position: relative; padding-bottom:60px;}
.main .section1 .best-wrap .mySwiper3{overflow: hidden; width: calc(100% - 284px); pointer-events: none;}
.main .section1 .best-wrap .mySwiper3 .swiper-wrapper{transition: none;}
.main .section1 .best-wrap .mySwiper3 .swiper-slide{display: flex; gap: 80px;}
.main .section1 .best-wrap .mySwiper3 .img-wrap{width: 216px; height: 310px; border-radius: 8px; overflow: hidden;}
.main .section1 .best-wrap .mySwiper3 .img-wrap img{height: 100%; }
.main .section1 .best-wrap .mySwiper3 .ex-wrap{width: calc(100% - 80px - 216px);}
.main .section1 .best-wrap .mySwiper3 .ex-wrap h3{font-size: 52px; margin-bottom: 24px; word-break: keep-all;}
.main .section1 .best-wrap .mySwiper3 .ex-wrap p.blue{font-size: 18px; font-weight: 400; color: #1c97d0; margin-bottom: 17px;}
.main .section1 .best-wrap .mySwiper3 .ex-wrap p{font-size: 14px; font-weight: 300; color: #404040; line-height: 1.57; max-width: 480px;}
.main .section1 .best-wrap .mySwiper3 .ex-wrap p span{color: #1c97d0;}

.main .section1 .best-wrap .btn-wrap{position: absolute; left: calc(216px + 80px); bottom: 0; display: flex; gap: 30px; z-index: 1;}

.main .section1 .best-wrap .swiper-pagination3{width: 284px; display: flex; justify-content: center; flex-direction: column; gap: 22px;}
.main .section1 .best-wrap .swiper-pagination-bullet{width: 100%; height: 79px; border-radius: unset; background-color: unset; opacity: 1; background-size: cover; display: flex; justify-content: center; padding-top: 24px; font-family: "GangwonEdu_OTFBoldA"; line-height: 1.24; font-size: 20px;}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(1){background-image: url(../images/balloon4.png); color: #1c97d0;}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(2){background-image: url(../images/balloon5.png); color: #6db575;}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(3){background-image: url(../images/balloon6.png); color: #f9c678;}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(1):hover{background-image: url(../images/balloon1.png);}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(2):hover{background-image: url(../images/balloon2.png);}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(3):hover{background-image: url(../images/balloon3.png);}
.main .section1 .best-wrap .swiper-pagination-bullet:hover{color: #fff;}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(1).swiper-pagination-bullet-active{background-image: url(../images/balloon1.png);}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(2).swiper-pagination-bullet-active{background-image: url(../images/balloon2.png);}
.main .section1 .best-wrap .swiper-pagination-bullet:nth-child(3).swiper-pagination-bullet-active{background-image: url(../images/balloon3.png);}
.main .section1 .best-wrap .swiper-pagination-bullet.swiper-pagination-bullet-active{color: #fff;}

.main .section2{padding-top: 110px; margin-bottom: 92px;}
.main .section2 .side-h2 .num::before{background-color: #f9c678;}
.main .section2 .mySwiper2{height: 340px; overflow: hidden; position: relative;}
.main .section2 .swiper-wrapper{height: 287px;}
.main .section2 .swiper-slide .pdmv-wrap{border-radius: 8px; border: solid 2px #e4e4e4; overflow: hidden; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: 48px 15px 45px; transition: all 0.3s; position: relative;}
.main .section2 .swiper-slide .img-wrap{width: 100%;}
.main .section2 .swiper-slide h4 {max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size: 18px; font-weight: 500; color: #333;}
.main .section2 .swiper-slide .btn-wrap{display: flex; gap: 34px; transition: all 0.3s; position: absolute; top: 100%;}
.main .section2 .swiper-slide .btn-wrap .move-btn{gap: 7px;}
.main .section2 .swiper-slide .btn-wrap .move-btn a{width: 32px; height: 32px; border: solid 2px #fff; background-color: transparent;}
.main .section2 .swiper-slide .btn-wrap .move-btn a i{font-size: 18px;}
.main .section2 .swiper-slide .btn-wrap .move-btn span{font-size: 12px; color: #fff;}
@media (hover: hover) {
    .main .section2 .swiper-slide .pdmv-wrap:hover .btn-wrap{top: 214px;}
    .main .section2 .swiper-slide .pdmv-wrap:hover h4{color: #fff;}
    .main .section2 .swiper-slide .move-btn:hover a{background-color: #b487ba; border-color: #b487ba;}
    .main .section2 .swiper-slide .move-btn.bl:hover a{background-color: #1c97d0; border-color: #1c97d0;}
    .main .section2 .swiper-slide .pdmv-wrap:hover{background-color: #6db575; padding-top: 20px; padding-bottom: 86px;}
    .main .section2 .swiper-slide:nth-child(2n) .pdmv-wrap:hover{background-color: #E6BAD3;}
    .main .section2 .swiper-slide:nth-child(4n - 1) .pdmv-wrap:hover{background-color: #1C97D0;}
    .main .section2 .swiper-slide:nth-child(4n) .pdmv-wrap:hover{background-color: #F9C678;}
}

.main .section2 .swiper-button-next , .main .section2 .swiper-button-prev{ background-image: unset; width: 32px; height: 32px; border-radius: 100%; border: solid 2px #e4e4e4; background-color: #fff; bottom: 0; top: unset; display: flex; justify-content: center; align-items: center;}
.main .section2 .swiper-button-next i , .main .section2 .swiper-button-prev i{color: #e4e4e4; font-size: 18px;}
.main .section2 .swiper-button-next{right: 0;}
.main .section2 .swiper-button-prev{right: 48px; left: unset;}
.main .section2 .swiper-pagination{display: none;}
.main .banner-wrap{margin-bottom: 80px;}

.main .section3{margin-bottom: 120px;}
.main .section3 .side-h2{top: 30px;}
.main .section3 .side-h2 .num::before{background-color: #b487ba;}
.main .section3 .board-wrap{padding: 30px 40px;}
.main .section3 .board-wrap h3{margin-bottom: 16px; font-size: 28px; font-weight: 500; color: #040005;}
.main .section3 .board-wrap ul{border-top: 3px solid #333;}
.main .section3 .board-wrap ul li{display: flex; justify-content: space-between; align-items: center; height: 62px; border-bottom: 1px solid #e4e4e4;}
.main .section3 .board-wrap ul li a{font-size: 20px; font-weight: 300;}
.main .section3 .board-wrap ul li .days{font-size: 18px; font-weight: 300; color: #717171;}
.main .section3 .board-wrap > a{position: absolute; right: 40px; top: 28px; font-size: 28px;}

/* 공통 */
.bg-cl-wrap{position: relative;}
.bg-cl-wrap .bg-cl{position: absolute; width: 100%; height: 320px; z-index: -1;}
.top-section{height: 320px; display: flex;}
.top-section .container{display: flex; justify-content: space-between;}
.top-section .top-text{padding-left: 50px; display: flex; flex-direction: column; justify-content: center;}
.top-section .top-text h2{display: inline-block; font-size: 40px; letter-spacing: 0.4px; color: #fff; margin-bottom: 28px; position: relative; font-weight: 500;}
.top-section .top-text h2::before{content: ""; background-image: url(../images/qm1.png); position: absolute; width: 25px; height: 23px;  top: -13px; left: -31px;}
.top-section .top-text h2::after{content: ""; background-image: url(../images/qm2.png); position: absolute; width: 25px; height: 23px;  top: -13px; right: -31px;}
.top-section .top-text p{font-size: 16px; font-weight: 300; line-height: 1.63; letter-spacing: 0.16px; color: #fff;}
.top-section .img-wrap{display: flex;}

/* 회사소개///////////////////////////////////////////////////////////////////// */
.introduce .bg-cl{background-color: #f9c678;}
.introduce .top-section .top-text h2{width:173px; color: #040005; font-weight: 600;}
.introduce .top-section .top-text p{color: #040005; font-weight: 400;}
.introduce .circle-wrap{display: flex; gap: 8px; margin-bottom: 12px;}
.introduce .circle-wrap > li{width: 16px; height: 16px; border-radius: 100%;}
.introduce .section1 {padding-top: 55px; margin-bottom: 90px; overflow: hidden; padding-bottom: 20px;}
.introduce .section1 .int-li:nth-child(1) .circle-wrap li{background-color: #9cd6e2;}
.introduce .section1 .int-li:nth-child(2) .circle-wrap li{background-color: #f9c678;}
.introduce .section1 .int-li:nth-child(3) .circle-wrap li{background-color: #b487ba;}
.introduce .section1 .int-li{display: flex; justify-content: space-between; align-items: center; height: 300px;}
.introduce .section1 .int-li h3{font-size: 40px; margin-bottom: 40px;}
.introduce .section1 .int-li p{font-size: 20px; font-weight: 300; color: #333;}
.introduce .section1 .int-li:nth-child(1) .img-wrap{width: 635px;}
.introduce .section1 .int-li:nth-child(2) .img-wrap{width: 668px;}
.introduce .section1 .int-li:nth-child(1) .img-wrap img{transform: translateX(57px);}
.introduce .section1 .int-li:nth-child(2) .img-wrap img{transform: translateX(-44px);}
.introduce .section1 .int-li:nth-child(2){margin-bottom: 50px;}
.introduce .section1 .int-li:nth-child(3){align-items: normal; height: auto; gap: 5%;}
.introduce .section1 .int-li:nth-child(3) .text-wrap{margin-top: 16px;}
.introduce .section1 .int-li .vision-li{display: flex; gap: 40px; width: 100%;}
.introduce .section1 .int-li .vision-li li{position: relative; width: calc((100% - 80px) / 3);}
.introduce .section1 .int-li .vision-li li::before{content: ""; display: block; padding-top: 100%;}
.introduce .section1 .int-li .vision-li li .vision-wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; border-radius: 100%; box-shadow: 3px 3px 36px 0 rgba(0, 0, 0, 0.1); background-color: #eed1e1;}
.introduce .section1 .int-li .vision-li li img{width: 50%;}
.introduce .section1 .int-li .vision-li li p{ text-align: center; font-size: 18px; line-height: 1.39; color: #333; }

.introduce .section2 {margin-bottom: 145px;}
.introduce .section2 .s2-top{padding: 40px; border-radius: 16px; box-shadow: 3px 3px 36px 0 rgba(0, 0, 0, 0.1); border: solid 6px #6db575; margin-bottom: 85px;}
.introduce .section2 .circle-wrap li{background-color: #6db575;}
.introduce .section2 .s2-top h3{font-size: 40px; color: #333; margin-bottom: 10px;}
.introduce .section2 .s2-top p{font-size: 18px; font-weight: 300; letter-spacing: -0.18px;}
.introduce .section2 .s2-top .green{color: #6db575; font-size: 24px; font-weight: 200; margin-bottom: 35px;}
.introduce .section2 .s2-ct{margin-bottom: 102px;}
.introduce .section2 .s2-ct ul{display: flex; flex-direction: column; gap: 64px;}
.introduce .section2 .s2-ct ul li{display: flex; padding-left: 60px;}
.introduce .section2 .s2-ct ul li .num{font-size: 70px; margin-right: 26px; position: relative;}
.introduce .section2 .s2-ct ul li .num::before{content: ""; width: 23px; height: 23px; position: absolute; background-color: #6db575; border-radius: 100%; z-index: -1; left: -7px;}
.introduce .section2 .s2-ct ul li p{font-size: 18px; font-weight: 400; line-height: 1.67;}
.introduce .section2 .s2-bt{text-align: center;}
.introduce .section2 .s2-bt p:first-child{display: inline-block; color: #6db575; font-size: 22px; font-weight: 500; margin-bottom: 80px; position: relative;}
.introduce .section2 .s2-bt p:first-child::before{content: ''; width: 20px; height: 19px; position: absolute; background-image: url(../images/qm1.png); background-size: cover; left: -31px; top: -5px;}
.introduce .section2 .s2-bt p:first-child::after{content: ''; width: 20px; height: 19px; position: absolute; background-image: url(../images/qm2.png); background-size: cover; right: -31px;; top: -5px;}
.introduce .section2 .s2-bt p:last-child{text-align: right; font-size: 18px; color: #333; font-weight: 300;}
.introduce .section2 .s2-bt p:last-child span{font-size: 20px; font-weight: 400; position: relative;}
.introduce .section2 .s2-bt p:last-child span::before{content: ""; width: 60px; height: 93px; position: absolute; right: -52px; top: -15px; opacity: 0.38; background-image: url(../images/sign.gif); background-position: center; background-size: cover;}


/* 교재소개 ////////////////////////////////////////////////////////*/
.textbook .bg-cl{background-color: #1c97d0;}
.textbook .top-section .top-text h2::before{background-image: url(../images/qm3.png);}
.textbook .top-section .top-text h2::after{background-image: url(../images/qm4.png);}
.textbook .top-section .top-text h2 span{color: #fff;}
.textbook .section1{padding-top: 52px; margin-bottom: 140px;}
.textbook .section1 .textbook-list{display: flex; gap: 40px; flex-wrap: wrap; align-items: center;}
.textbook .section1 .textbook-list li{width: calc((100% - 40px) / 2); min-height: 326px; display: flex; border-radius: 8px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); position: relative;}
.textbook .section1 .textbook-list li > a{position: absolute; width: 100%; height: 100%; left: 0; right: 0; top: 0; bottom: 0;}
.textbook .section1 .textbook-list li .img-wrap{width: 208px; height: 290px; border-radius: 8px; box-shadow: 8px 8px 36px 0 rgba(0, 0, 0, 0.1); overflow: hidden;}
.textbook .section1 .textbook-list li .text-wrap{width: calc(100% - 208px); padding: 40px; position: relative;}
.textbook .section1 .textbook-list li .text-wrap h3{font-size: 24px; line-height:32px; font-weight: 400; margin-bottom: 20px; }
.textbook .section1 .textbook-list li .text-wrap p{font-size: 14px; font-weight: 300; color: #404040; line-height: 1.57;}
.textbook .section1 .textbook-list li .text-wrap p.blue{font-size: 16px; color: #1c97d0; letter-spacing: -0.32px; margin-bottom: 10px;}
/*///////////////////////////////////////////////////////// 장바구니 추가 */
.textbook .section1 .textbook-list li .text-wrap .price-wrap{width: calc(100% - 80px); display: flex; gap: 8px; position: absolute; bottom: 40px; left: 40px;}
.textbook .section1 .textbook-list li .text-wrap .price-wrap .basket-btn{width: 40px; height: 40px; background-color: #fff; border-radius: 8px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.1); border: unset; transition: all 0.3s;}
.textbook .section1 .textbook-list li .text-wrap .price-wrap .basket-btn i{font-size: 24px; color: #6db575;}
.textbook .section1 .textbook-list li .text-wrap .price-wrap .basket-btn:hover{background-color: #6db575;}
.textbook .section1 .textbook-list li .text-wrap .price-wrap .basket-btn:hover i{color: #fff;}
.textbook .section1 .textbook-list li .text-wrap .price-wrap .price{width: calc(100% - 48px); display: flex; border-radius: 9px; background-color: #f5f5f5; gap: 12px; align-items: flex-end; padding: 9px 0; justify-content: center; flex-wrap: wrap;}
.textbook .section1 .textbook-list li .text-wrap .price-wrap .price span{font-size: 20px; font-weight: 500; letter-spacing: -0.8px; color: #333;}
.textbook .section1 .textbook-list li .text-wrap .price-wrap .price span.sale{font-size: 16px; font-weight: 400; letter-spacing: -0.64px; opacity: 0.7; text-decoration: line-through;}
/*///////////////////////////////////////////////////////// 장바구니 추가 */

/* 교재소개 상새 */
.textbook-dt .tb-top{padding-top: 56px; margin-bottom: 30px;}
.textbook-dt .tb-top-wrap{padding: 50px 40px; border-radius: 16px; border: solid 1px #e4e4e4; background-color: #fff; display: flex; justify-content: space-between; position: relative;}
.textbook-dt .tb-le{display: flex; gap: 80px;}
.textbook-dt .tb-le .img-wrap {width: 216px; }
.textbook-dt .tb-le .img-wrap img {
    width:100%;
    border-radius: 8px; box-shadow: 8px 8px 36px 0 rgba(0, 0, 0, 0.1);
}
.textbook-dt p{font-size: 14px; font-weight: 400; line-height: 1.57; color: #404040;}
.textbook-dt p span{color: #1c97d0;}
.textbook-dt .tb-le .text-wrap{
    padding-bottom:80px;
    position: relative;
}
.textbook-dt .tb-le .text-wrap h3{font-size: 52px; color: #333333; margin-bottom: 15px;}
.textbook-dt .tb-le .text-wrap p{max-width: 304px;}
.textbook-dt .tb-le .text-wrap p.blue{color: #1c97d0; font-size: 18px; font-weight: 400; margin-bottom: 17px;}
.textbook-dt .tb-le .text-wrap .btn-wrap{position: absolute; left: 0; bottom: 0;}
.textbook-dt .tb-ri{padding-left: 40px; border-left: 1px solid #e4e4e4;}
.textbook-dt .tb-ri p{max-width: 406px; font-family: 'Noto Sans KR';}
.textbook-dt .tb-ri p span.blue{color: #1c97d0; font-weight: 200;}
.textbook-dt .pg-bt a{width: 78px; height: 78px; display: flex; justify-content: center; align-items: center; opacity: 0.7; background-color: #fff; border-radius: 100%; transition: all 0.3s; border: 2px solid #fff; position: absolute; top: 50%; transform: translateY(-50%);}
.textbook-dt .pg-bt a i{font-size: 43px; color: #e4e4e4;}
.textbook-dt .pg-bt a:hover{border: 2px solid #717171;}
.textbook-dt .pg-bt a:hover i{color: #717171;}
.textbook-dt .pg-bt a.prev{left: -39px;}
.textbook-dt .pg-bt a.next{right: -39px;}

.textbook-dt .section2 {border-top: solid 1px #e4e4e4; border-bottom: solid 1px #e4e4e4; padding: 10px 0;}
.textbook-dt .section2 .container{display: flex; justify-content: space-between;}
.textbook-dt .section2 .tabs {display: flex; gap: 16px;}
.textbook-dt .section2 .tabs .tab-link{width: 126px; height: 55px; border: solid 1px #e4e4e4; border-radius: 8px; background-color: #fff; display: flex; justify-content: center; align-items: center; font-weight: 500; color: #8a8a8a; cursor: pointer; font-size: 18px; transition: all 0.3s;}
.textbook-dt .section2 .tabs .tab-link:hover{background-color: #1c97d0; color: #fff; border-color: #1c97d0;}
.textbook-dt .section2 .tabs .tab-link.current{background-color: #1c97d0; color: #fff; border-color: #1c97d0;}
.textbook-dt .section2 .buy-bt-wrap{display: flex; gap: 16px;}
.textbook-dt .section2 .buy-bt-wrap li{display: flex; justify-content: center; align-items: center; cursor: pointer;}
.textbook-dt .section2 .buy-bt-wrap .basket{width: 55px; height: 55px; border-radius: 8px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.1); background-color: #fff;}
.textbook-dt .section2 .buy-bt-wrap .basket i{color: #6db575; font-size: 36px;}
.textbook-dt .section2 .buy-bt-wrap .basket.put{background-color: #6db575;}
.textbook-dt .section2 .buy-bt-wrap .basket.put i{color: #fff;}
.textbook-dt .section2 .buy-bt-wrap .buy-bt{width: 240px; height: 55px; background-color: #d33840; border-radius: 8px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); position: relative;}
.textbook-dt .section2 .buy-bt-wrap .buy-bt span{font-size: 24px; font-weight: 500; color: #fff; position: absolute; transition: all 0.3s;}
.textbook-dt .section2 .buy-bt-wrap .buy-bt span:last-child{opacity: 0;}
.textbook-dt .section2 .buy-bt-wrap .buy-bt:hover span:first-child{opacity: 0;}
.textbook-dt .section2 .buy-bt-wrap .buy-bt:hover span:last-child{opacity: 1;}

.textbook-dt .section2 .buy-box{display: none; position: absolute; width: 100%; padding: 18px 24px 30px; border: solid 2px #eee; background-color: #fff; z-index: 1; top: calc(100% + 40px);}
.textbook-dt .section2 .buy-box.open{display: block;}
.textbook-dt .section2 .buy-box .close{width: 23px; height: 23px; position: absolute; top: 18px; right: 24px; display: flex; justify-content: center; align-items: center; border: unset; background-color: unset;}
.textbook-dt .section2 .buy-box .close i{font-size: 23px;}
.textbook-dt .section2 .buy-box .close i:last-child{display: none;}
.textbook-dt .section2 .buy-box h3{font-weight: 500; margin-bottom: 18px;}
.textbook-dt .section2 .buy-box .buy-wrap{display: flex; gap: 40px; border-top: solid 2px #333;}
.textbook-dt .section2 .buy-box .buy-le{width: 556px;}
.textbook-dt .section2 .buy-box .buy-le-top{display: flex; padding: 15px 0; gap: 16px; border-bottom: 1px solid #e4e4e4; margin-bottom: 25px;}
.textbook-dt .section2 .buy-box .buy-le-top .img-wrap{width: 56px;}
.textbook-dt .section2 .buy-box .buy-le-top .img-wrap img{height: 100%;}
.textbook-dt .section2 .buy-box .buy-le-top .product-dt{display: flex; flex-direction: column; justify-content: space-between;}
.textbook-dt .section2 .buy-box .buy-le-top .product-dt .pd-name{font-weight: 400; color: #333;}
.textbook-dt .section2 .buy-box .buy-le-top .product-dt p{font-size: 12px; font-weight: 400; color: #717171;}
.textbook-dt .section2 .buy-box .buy-le-top .product-dt .price{font-size: 12px; font-weight: 400; color: #717171;}
.textbook-dt .section2 .buy-box .put-list{border-radius: 3px; border: solid 1px #e4e4e4; background-color: #fff;}
.textbook-dt .section2 .buy-box .put-list li{height: 40px; display: flex; position: relative; align-items: center; justify-content: space-between; padding: 0 56px 0 16px; border-radius: 3px; border-bottom: 1px solid #e4e4e4;}
.textbook-dt .section2 .buy-box .put-list li span{font-size: 14px; font-weight: 400; color: #333;}
.textbook-dt .section2 .buy-box .put-list li .eliminate{width: 24px; height: 24px; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #fff; position: absolute; right: 16px;}
.textbook-dt .section2 .buy-box .put-list li .eliminate i{font-size: 14px; color: #e4e4e4;}
.textbook-dt .section2 .buy-box .buy-ri{width: calc(100% - 556px - 40px); padding-top: 15px; display: flex; flex-direction: column; justify-content: space-between;}
.textbook-dt .section2 .buy-box .buy-ri ul{display: flex; flex-direction: column; gap: 20px; padding-bottom: 25px; border-bottom: 1px solid #e4e4e4;}
.textbook-dt .section2 .buy-box .buy-ri ul li{display: flex; justify-content: space-between; color: #333; font-weight: 400;}
.textbook-dt .section2 .buy-box .buy-ri ul li span{color: #333; font-weight: 500;}
.textbook-dt .section2 .buy-box .buy-ri ul li:last-child{font-size: 20px; font-weight: 500;}
.textbook-dt .section2 .buy-box .buy-ri ul li:last-child span{color: #ef7c4a; font-size: 28px; font-weight: bold; letter-spacing: 0.84px; margin-top: 42px;}
.textbook-dt .section2 .buy-box .buy-ri a.buy-bt2{width: 100%; height: 68px; display: flex; justify-content: center; align-items: center; background-color: #d33840; color: #fff; font-size: 28px; font-weight: 400; border-radius: 8px;}

.textbook-dt .section3{margin-bottom: 140px;}
.textbook-dt .section3 .tab-content{display: none;}
.textbook-dt .section3 .tab-content.current{display: block;}
.textbook-dt .section3 .tab-content:nth-child(1){padding-top: 30px;}
.textbook-dt .section3 .tab-content:nth-child(2){padding-top: 80px;}
.textbook-dt .section3 .tab-content:nth-child(3){padding-top: 30px;}
.textbook-dt .section3 .video{border-radius: 16px; border: solid 1px #e4e4e4; background-color: #fff;}
.textbook-dt .section3 .video iframe{width: 100%; height: 599px;}
.textbook-dt .section3 .video .vd-ex{display: flex; justify-content: space-between; min-height: 326px; padding: 32px 0 32px;}
.textbook-dt .section3 .video .vd-ex .vd-le{padding: 0 34px;}
.textbook-dt .section3 .video .vd-ex .vd-le h3{font-size: 52px; margin-bottom: 8px;}
.textbook-dt .section3 .video .vd-ex .vd-le p{font-size: 18px; font-weight: 400; color: #1c97d0; max-width: 205px;}
.textbook-dt .section3 .video .vd-ex .vd-ri{padding: 0 24px; border-left: 1px solid #e4e4e4;}
.textbook-dt .section3 .video .vd-ex .vd-ri p{max-width: 770px; font-size: 14px; font-weight: 300; line-height: 1.57; color: #404040;}
.textbook-dt .section3 .postscript .write-wrap{padding: 15px 24px; border-radius: 8px; border: solid 1px #e4e4e4; background-color: #fff; margin-bottom: 40px;}
.textbook-dt .section3 .postscript .write{display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 10px;}
.textbook-dt .section3 .postscript .write input{padding: 6px 8px; border: unset; border-bottom: solid 1px #707070; font-weight: 300; width: 83%;}
.textbook-dt .section3 .postscript .star{display: flex; gap: 3px; font-size: 12px;}
.textbook-dt .section3 .postscript .star li{cursor: pointer;}
.textbook-dt .section3 .postscript .star i{color: #f9c678;}
.textbook-dt .section3 .postscript .star i.inactive{color: #eee;}
.textbook-dt .section3 .postscript .write .write-btn{display: flex; justify-content: center; align-items: center; color: #717171; border-radius: 8px; border: solid 1px #e4e4e4; background-color: #fff; width: 88px; height: 34px;}
.textbook-dt .section3 .postscript .write-wrap .upload{display: flex; align-items: center;}
.textbook-dt .section3 .postscript .write-wrap .upload input{display: none;}
.textbook-dt .section3 .postscript .write-wrap .upload label{margin-right: 8px; width: 28px; height: 28px; border-radius: 8px; border: solid 1px #e4e4e4; background-color: #fff; display: flex; justify-content: center; align-items: center;}
.textbook-dt .section3 .postscript .write-wrap .upload span{margin-right: 24px; font-size: 14px; font-weight: 400; letter-spacing: -0.56px; color: #333;}
.textbook-dt .section3 .postscript .write-wrap .upload .file-list{display: flex; gap: 4px;}
.textbook-dt .section3 .postscript .write-wrap .upload .file-list li{font-size: 12px; font-weight: 300; letter-spacing: -0.48px; color: #333;}
.textbook-dt .section3 .postscript .postscript-list{border-top: 1px solid #333; margin-bottom: 80px;}
.textbook-dt .section3 .postscript .postscript-list > li{padding: 10px 0;}
.textbook-dt .section3 .postscript .ps-top{display: flex; gap: 16px; align-items: center; position: relative; margin-bottom: 15px;}
.textbook-dt .section3 .postscript .ps-top > a{position: absolute; right: 0; font-size: 14px; font-weight: 300; color: #333; text-decoration: underline;}
.textbook-dt .section3 .postscript .ps-top .user-name{font-weight: 400; color: #333; }
.textbook-dt .section3 .postscript .ps-top .day{font-size: 14px; font-weight: 300; color: #c1c1c1;}
.textbook-dt .section3 .postscript .ps-bottom{border-bottom: 1px solid #e4e4e4; padding-bottom: 10px;}
.textbook-dt .section3 .postscript .ps-bottom p{font-size: 14px; font-weight: 300; line-height: 1.86; color: #707070;}
.textbook-dt .section3 .postscript .ps-bottom .img-box{max-width: 80px; height: 80px; cursor: pointer;}
.textbook-dt .section3 .postscript .ps-bottom .img-box img{width: 100%; height: 100%;}
.textbook-dt .section3 .postscript .ps-bottom .img-box.open{max-width: 560px; height: auto;}
.textbook-dt .section3 .postscript .ps-sm{padding-top: 20px;}
.textbook-dt .section3 .postscript .ps-sm .write{padding-left: 40px;}
.textbook-dt .section3 .postscript .ps-sm .write input{border-color: #e4e4e4;}
.textbook-dt .section3 .postscript .ps-sm .postscript-list{border: unset; margin-bottom: unset;}
.textbook-dt .section3 .postscript .ps-sm .postscript-list li{position: relative;}
.textbook-dt .section3 .postscript .ps-sm .postscript-list li::before{content: ""; position: absolute; top: 9px; width: 16px; height: 10px; background-image: url(../images/sm.png);}
.textbook-dt .section3 .postscript .ps-sm .ps-top{padding-left: 40px;}
.textbook-dt .section3 .postscript .ps-sm .ps-bottom{padding-left: 40px;}

/* 구매 페이지 */
.pay-pg .section1{padding-top: 30px; margin-bottom: 146px;}
.pay-pg .section1 .container{display: flex; gap: 40px;}
.pay-pg .pay-le {width: 640px;}
.pay-pg .pay-le .deliver-wrap{border-top: 2px solid #333;}
.pay-pg .pay-le .dv-top{height: 56px; display: flex; gap: 16px; padding-left: 16px; align-items: center;}
.pay-pg .pay-le .dv-top span{font-weight: 500; letter-spacing: 0.48px;}
.pay-pg .pay-le .dv-top .dv-bt-wrap{display: flex; gap: 10px;}
.pay-pg .pay-le .dv-top .dv-bt-wrap button{width: 60px; height: 24px; font-size: 10px; background-color: #e4e4e4; border-radius: 3px; border: unset; color: #333; font-weight: 300;}
.pay-pg .pay-le .dv-top .dv-bt-wrap button.choice{background-color: #1c97d0; color: #fff;}
.pay-pg .pay-le .dv-ct{display: flex; flex-direction: column; gap: 16px; padding: 20px 136px 50px 16px; border-top: 1px solid #e4e4e4;}
.pay-pg .pay-le .dv-ct li{display: flex; justify-content: space-between;}
.pay-pg .pay-le .dv-ct li label{line-height: 40px; font-weight: 400; color: #333;}
.pay-pg .pay-le .dv-ct li label span{color: #d33840;}
.pay-pg .pay-le .dv-ct li .inf-wrap{width: 368px; display: flex; flex-wrap: wrap; gap: 16px;}
.pay-pg .pay-le .dv-ct li .inf-wrap input{width: 100%; height: 40px; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #fff; padding: 0 16px; font-size: 12px; font-weight: 500;}
.pay-pg .pay-le .dv-ct li:nth-child(3) .inf-wrap{gap: 16px 8px;}
.pay-pg .pay-le .dv-ct li:nth-child(3) .inf-wrap input:first-child{width: calc(100% - 120px - 8px);}
.pay-pg .pay-le .dv-ct li:nth-child(4) .inf-wrap input , .pay-pg .pay-le .dv-ct li:nth-child(5) .inf-wrap input{width: 64px;}
.pay-pg .pay-le .dv-ct li .inf-wrap .add-pd{margin: unset;}
.pay-pg .pay-le .dv-ct li .inf-wrap textarea{width: 100%; height: 40px; outline: unset; padding: 12px 16px; font-size: 12px; font-weight: 500; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #f5f5f5;}
.pay-pg .pay-le .means-wrap{border-top: 2px solid #333;}
.pay-pg .pay-le .ms-top{height: 56px; display: flex; gap: 16px; padding-left: 16px; align-items: center;}
.pay-pg .pay-le .ms-top span{font-weight: 500; letter-spacing: 0.48px;}
.pay-pg .pay-le .ms-li{display: flex; flex-wrap: wrap; gap: 10px 8px; padding: 20px 16px; border-top: 1px solid #e4e4e4;}
.pay-pg .pay-le .ms-li li{width: calc((100% - 24px) / 4); height: 39px; display: flex; justify-content: center; align-items: center; font-size: 12px; font-weight: 500; letter-spacing: 0.36px; background-color: #fff; border-radius: 3px; border: solid 1px #e4e4e4; cursor: pointer;}
.pay-pg .pay-le .ms-li li.choice{background-color: #333; color: #fff;}
.pay-pg .pay-ri{width: calc(100% - 40px - 640px); padding: 18px 24px 30px; border-radius: 8px; border: solid 2px #333; background-color: #fff; }
.pay-pg .pay-ri h3{margin-bottom: 16px; font-weight: 500; color: #333;}
.pay-pg .pay-ri .product-list{border-top: 2px solid #333; max-height: 476px; overflow: auto; -ms-overflow-style: none; margin-bottom: 30px;}
.pay-pg .pay-ri .product-list::-webkit-scrollbar{ display:none; }
.pay-pg .pay-ri .product-list li{padding: 15px 0; display: flex; border-bottom: solid 1px #e4e4e4; gap: 16px;}
.pay-pg .pay-ri .product-list li .img-wrap{width: 56px;}
.pay-pg .pay-ri .product-list li .product-dt{display: flex; flex-direction: column; justify-content: space-between;}
.pay-pg .pay-ri .product-list li .product-dt .pd-name{font-weight: 400; color: #333;}
.pay-pg .pay-ri .product-list li .product-dt p{font-size: 12px; font-weight: 400; color: #717171;}
.pay-pg .pay-ri .product-list li .product-dt .price{margin-top:8px; font-size: 12px; font-weight: 400; color: #717171;}
.pay-pg .pay-ri .price-wrap{display: flex; flex-direction: column; gap: 20px; padding-bottom: 25px; border-bottom: 1px solid #e4e4e4; margin-bottom: 20px;}
.pay-pg .pay-ri .price-wrap li{display: flex; justify-content: space-between; color: #333; font-weight: 400;}
.pay-pg .pay-ri .price-wrap li span{color: #333; font-weight: 500;}
.pay-pg .pay-ri .price-wrap li:last-child{font-size: 20px; font-weight: 500;}
.pay-pg .pay-ri .price-wrap li:last-child span{color: #ef7c4a; font-size: 28px; font-weight: bold; letter-spacing: 0.84px; margin-top: 42px;}
.pay-pg .pay-ri .consent-wrap{margin-bottom: 30px;}
.pay-pg .pay-ri .consent-wrap p{font-size: 12px; font-weight: 400; margin-bottom: 10px;}
.pay-pg .pay-ri .consent-wrap ul{display: flex; flex-direction: column; gap: 10px;}
.pay-pg .pay-ri .consent-wrap ul li{font-size: 10px; font-weight: 300; color: #333;}
.pay-pg .pay-ri .consent-wrap ul li a{margin-left: 8px; text-decoration: underline;}
.pay-pg .pay-ri a.black-btn{width: 100%; height: 68px; font-size: 28px; border-radius: 8px; transition: all 0.3s;}
.pay-pg .pay-ri a.black-btn:hover{background-color: #ef7c4a;}

/* 약관,방침 */
.policy{padding: 25px 0 52px}
.policy .policy-top{border-top: 2px solid #333;}
.policy .policy-top h2{font-weight: 500; line-height: 2.88; color: #070303;}
.policy .policy-top p{font-size: 10px; font-weight: 500; color: #707070; line-height: 1.5; padding: 15px 0 20px; border-top: 1px solid #e4e4e4;}
.policy .policy-list{display: flex; flex-direction: column; gap: 40px; padding-top: 15px; border-top: 1px solid #e4e4e4; margin-bottom: 52px;}
.policy .policy-list h3{margin-bottom: 8px; font-size: 14px; font-weight: 500; color: #1c97d0;}
.policy .policy-list h4{color: #333;}
.policy .policy-list p{font-size: 10px; font-weight: 500; line-height: 1.5; color: #707070;}
.policy .policy-list p span{color: #333; font-weight: 500;}
.policy .policy-list table{width: 100%; font-size: 10px; margin-top: 20px; border: 1px solid #333;}
.policy .policy-list thead{text-align: center; background-color: #dadada;}
.policy .policy-list th{padding: 8px; border: 1px solid #333;}
.policy .policy-list td{padding: 8px; border: 1px solid #333;}

.policy .btn-wrap{display: flex; justify-content: center;}
.policy .btn-wrap .up-btn{width: 30px; height: 30px; border-radius: 100%; border: solid 2px #1c97d0; background-color: #fff; display: flex; justify-content: center; align-items: center; outline: unset;}
.policy .btn-wrap .up-btn i{font-size: 26px; color: #1c97d0;}



/* 강의영상 ////////////////////////////////////////////////////////*/
.lecture .bg-cl{background-color: #e6bad3;}
.lecture .top-section .top-text h2 {width:208px;}
.lecture .top-section .img-wrap { width: 480px; }
.lecture .section1{padding-top: 52px; margin-bottom: 140px;}
.lecture .section1 .lecture-list{display: flex; gap: 53px; flex-wrap: wrap; justify-content: center;}
.lecture .section1 .lecture-list li{width: 260px; display: flex; flex-flow: column; position: relative; gap: 30px;}
.lecture .section1 .lecture-list li::after { content: ""; display: block; width: 1px; height: 100%; position: absolute; top: 0; right: -27px; background: #e4e4e4; }
.lecture .section1 .lecture-list li:last-child::after { display: none; }
.lecture .section1 .lecture-list li .img-wrap { border-radius: 8px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); overflow: hidden; width: 100%; padding-top: 140%; position: relative;}
.lecture .section1 .lecture-list li .img-wrap img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.lecture .section1 .lecture-list li .text-wrap{ text-align: center; }
.lecture .section1 .lecture-list li .text-wrap h3{font-size: 24px; font-weight: 400; margin-bottom: 8px; }
.lecture .section1 .lecture-list li .text-wrap p.blue{font-size: 16px; color: #1c97d0; letter-spacing: -0.32px; margin-bottom: 30px; font-weight: 300;}
.lecture .section1 .lecture-list li .text-wrap a { display: block; margin: 0 auto; width: 200px; height: 45px; border-radius: 22.5px; border: 2px solid #1c97d0; text-align: center; background: #fff; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); line-height: 41px; font-size: 18px; font-weight: 500; color: #1c97d0; transition: .3s; }
.lecture .section1 .lecture-list li .text-wrap a i { color: #1c97d0; font-size: 18px; display: inline-block; margin-left: 26px;  transition: .3s;line-height: 41px;}
.lecture .section1 .lecture-list li .text-wrap a:hover { background: #1c97d0; color: #fff; }
.lecture .section1 .lecture-list li .text-wrap a:hover i { color: #fff; }

/* 강의영상 상세 */
.lecture-dt .section1 .lecture-list{ gap: 40px 27px; justify-content: unset; }
.lecture-dt .section1 .lecture-list li { width: calc( ( 100% - 54px ) / 3 ); }
.lecture-dt .section1 .lecture-list li::after { display: none; }
.lecture-dt .section1 .lecture-list li a { display: flex; flex-flow: column; gap: 13px; }
.lecture-dt .section1 .lecture-list li .img-wrap { padding-top: 56.25%; }
.lecture-dt .section1 .lecture-list li .text-wrap{ text-align: left; }
.lecture-dt .section1 .lecture-list li .text-wrap h4{font-size: 15px; margin-bottom: 8px; font-weight: 400; }
.lecture-dt .section1 .lecture-list li .text-wrap p{font-size: 14px; line-height: 1.5; font-weight: 300; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

.lecture-dt2 .section1 > .container { flex-flow: column; border-radius: 16px; overflow: hidden; border: 1px solid #e4e4e4; }
.lecture-dt2 .section1 .video-wrap { position: relative; width: 100%; padding-top: 56.25%; }
.lecture-dt2 .section1 .video-wrap iframe { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; border-radius: 16px; overflow: hidden; }
.lecture-dt2 .section1 .text-wrap { padding: 32px 0; }
.lecture-dt2 .section1 .text-wrap .left { width: 30%; padding: 0 24px; border-right: 1px solid #e4e4e4; }
.lecture-dt2 .section1 .text-wrap .right { width: 70%; padding: 0 24px; }
.lecture-dt2 .section1 .text-wrap h2 { font-size: 52px; font-weight: bold; }
.lecture-dt2 .section1 .text-wrap pre.blue { font-size: 18px; white-space: pre-line; font-weight: 400; line-height: 1.5; color: #1c97d0; }
.lecture-dt2 .section1 .text-wrap pre { font-size: 14px; white-space: pre-line; font-weight: 300; line-height: 1.5; word-break: keep-all; }

/* 게시판 ////////////////////////////////////////////////////////*/
.board .bg-cl{background-color: #6db575;}
.board .top-section .img-wrap { width: 480px; }
.board .top-section .top-text h2::before{background-image: url(../images/qm3.png);}
.board .top-section .top-text h2::after{background-image: url(../images/qm4.png);}
.board .section1{padding-top: 80px; margin-bottom: 140px;}
.board .section1 .search-wrap form { width: fit-content; margin: 0 auto 80px; position: relative; }
.board .section1 .search-wrap input { width: 680px; height: 55px; padding: 0 24px; border-radius: 8px; border: 2px solid #e4e4e4; font-size: 18px; }
.board .section1 .search-wrap input::placeholder { color: #c9c9c9; }
.board .section1 .search-wrap input:focus { border: 2px solid #6db575; }
.board .section1 .search-wrap .search-btn { width: 30px; height: 30px; border: 0; outline: 0; background: none; position: absolute; right: 20px; top: 12.5px; }
.board .section1 .search-wrap .search-btn i { font-size: 26px; color: #333; transition: .2s; }
.board .section1 .search-wrap .search-btn:hover i { color: #6db575; }
.board .section1 .table-wrap { border-top: 3px solid #6db575; border-bottom: 3px solid #6db575; }
.board .section1 .table-wrap table { table-layout: fixed; width: 100%; }
.board .section1 .table-wrap table tr { border-bottom: 1px solid #e4e4e4; }
.board .section1 .table-wrap table tr td { font-size: 16px; padding: 24px 0; font-weight: 300; }
.board .section1 .table-wrap table tr td:not(:nth-child(2)) { text-align: center; }
.board .section1 .table-wrap table tr td:nth-child(1) { width: 7%; font-weight: 400;}
.board .section1 .table-wrap table tr td:nth-child(2) { width: 76%; padding-left: 24px; }
.board .section1 .table-wrap table tr td:nth-child(2) a{font-weight: 400;}
.board .section1 .table-wrap table tr td:nth-child(3) { width: 17%; font-weight: 400;}
.board .section1 .table-wrap table tr td a:hover { text-decoration: underline; }

/* 게시판 상세 */
.board-dt .board-wrap { border-top: 3px solid #6db575; border-bottom: 2px solid #6db575; }
.board-dt .board-wrap .title-wrap { padding: 26px 30px; border-bottom: 1px solid #e4e4e4; }
.board-dt .board-wrap .title-wrap .title { font-size: 24px; line-height: 1.46; font-weight: 400; margin-bottom: 15px; }
.board-dt .board-wrap .title-wrap .date { font-size: 18px; letter-spacing: -0.45px; font-weight: 400; color: #717171; }
.board-dt .board-wrap .content-wrap { padding: 40px 30px; }
.board-dt .board-wrap .content-wrap pre { white-space: pre-line; line-height: 2.5; }
.board-navigation { padding-top: 50px; justify-content: space-between; }
.board-navigation a { gap: 10px; align-items: center; }
.board-navigation a i { font-size: 44px; color: #e4e4e4; transition: .2s; }
.board-navigation a i.mb { display: none; }
.board-navigation a h4 { font-size: 30px; color: #717171; font-weight: 400; transition: .2s; }
.board-navigation a:hover i, .board-navigation a:hover h4 { color: #6db575; }
.board-navigation a .col-group { flex-flow: column; margin-left: 15px; }
.board-navigation a.next .col-group { align-items: flex-end; margin-left: 0; margin-right: 15px; }
.board-navigation a .col-group .title { font-weight: 400; font-size: 14px; color: #484848; line-height: 1.5; display: block; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.board-navigation a .col-group .date { font-weight: 400; font-size: 12px; color: #717171; font-weight: 300; display: block; width: fit-content; }

/* 페이지네이션 */
.pagination { margin-top: 80px; justify-content: center; gap: 15px; flex-flow: wrap; }
.pagination a { width: 30px; height: 45px; border: 1px solid #e4e4e4; color: #c1c1c1; text-align: center; line-height: 43px; font-weight: 300; font-size: 14px; border-radius: 4px; transition: .3s; }
.pagination a.active, .pagination a:hover { border: 1px solid #333; color: #333; }


/* 로그인 페이지 ////////////////////////////////////////////////////////*/
.login-wrap { padding: 50px 0; }
.login-wrap> * { width: 50%; }
.login-wrap .left { padding: 24px 40px 24px 94px; }
.login-wrap .left .img-box { width: 460px; height: 460px; border-radius: 16px; overflow: hidden; }
.login-wrap .left .img-box img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.login-wrap .right { padding: 34px 40px; }
.login-wrap .right .text-wrap { margin-bottom: 62px; }
.login-wrap .right .text-wrap h2 { font-size: 26px; line-height: 1.77; font-weight: 500; }
.login-wrap .right .text-wrap img { width: 187px; margin-bottom: 30px; }
.login-wrap .right .text-wrap p { font-size: 16px; font-weight: 400; line-height: 1.56; }
.login-wrap .right .login-btn { flex-flow: column; gap: 8px; }
.login-wrap .right .login-btn li { width: 330px; height: 50px; border-radius: 6px; box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.06); position: relative }
.login-wrap .right .login-btn li.login-n { background: #03c75a; }
.login-wrap .right .login-btn li.login-k { background: #fee500; }
.login-wrap .right .login-btn li.login-g { background: #ffffff; }
.login-wrap .right .login-btn li.login-f { background: #1877f2; }
.login-wrap .right .login-btn li img { position: absolute; left: 0; top: 0; width: 50px; }
.login-wrap .right .login-btn li p { line-height: 50px; text-align: center; padding-left: 18px; color: #fff; font-size: 16px; font-weight: 500; }
.login-wrap .right .login-btn li.login-k p { color: #191919; }
.login-wrap .right .login-btn li.login-g p { color: #707070; }


/* 마이페이지///////////////////////////////////////////////////////////// */
.mypage .section1{margin-bottom: 140px;}
.mypage .container{display: flex;}
.mypage .banner-wrap{margin-bottom: 40px;}
.mypage .my-le{width: 328px; padding-right: 40px;}
.mypage .my-le .my-le-top{display: flex; margin-bottom: 80px;}
.mypage .my-le .my-le-top .img-wrap{width: 80px; height: 80px;}
.mypage .my-le .my-le-top div:last-child{width: calc(100% - 80px); padding-left: 21px; display: flex; flex-direction: column; justify-content: center; gap: 3px;}
.mypage .my-le .my-le-top p:first-child{font-weight: 400; color: #333;}
.mypage .my-le .my-le-top p:last-child{font-size: 20px; font-weight: 400; color: #333;}
.mypage .my-le .my-nav li a{display: flex; width: 100%; height: 53px; align-items: center; justify-content: space-between; padding: 0 16px; font-size: 20px; font-weight: 300; color: #8f8f8f;}
.mypage .my-le .my-nav li a i{color: #fff;}
.mypage .my-le .my-nav li.now a{background-color: #1c97d0; color: #fff; box-shadow: 6px 0 6px 0 rgba(0, 0, 0, 0.16);}
.mypage .my-le .my-nav li:nth-child(5).now a{background-color: #b487ba;}
.mypage .my-le .my-nav li:nth-child(6).now a , .mypage .my-le .my-nav li:nth-child(7).now a{background-color: #6db575;}
.mypage .my-ri{width: calc(100% - 328px);}
.mypage .my-ri .img-wrap{width: 56px;}
.mypage .my-ri .product-wrap {display: flex; padding: 24px; position: relative;}
.mypage .my-ri .product-wrap .tb-bt-wrap {margin-left:20px;}
.mypage .my-ri .product-dt{display: flex; padding-left: 22px; flex-direction: column; justify-content: center; text-align: left; gap: 3px;}
.mypage .my-ri .product-dt .pd-name{font-weight: 400; color: #333;}
.mypage .my-ri .product-dt p{font-size: 12px; font-weight: 400; color: #717171; }
.mypage .my-ri .product-dt .price{font-size: 12px; font-weight: 400; color: #717171;}
.mypage .my-ri .product-wrap > .close-btn{width: 16px; height: 16px; display: flex; justify-content: center; align-items: center; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #fff; position: absolute; right: 16px; top: 24px;}
.mypage .my-ri .product-wrap > .close-btn i{color: #e4e4e4;}
.mypage .my-ri .chbx{margin: 0 auto;}
.mypage .my-ri .num{display: flex; width: 90px; justify-content: space-between; align-items: center;  border: solid 1px #e4e4e4; margin: 0 auto;}
.mypage .my-ri .num span{color: #333; font-size: 12px;}
.mypage .my-ri .num button{width: 24px; height: 24px; border-radius: 3px; background-color: #fff; border: unset;}
.mypage .my-ri .num button i{color: #717171;}
.mypage .my-ri .num button:first-child{border-right: solid 1px #e4e4e4;}
.mypage .my-ri .num button:last-child{border-left: solid 1px #e4e4e4;}
.mypage .my-ri .tb-bt-wrap{display: flex; flex-direction: column; align-items: center; gap: 8px;}
.mypage .my-ri .tb-bt-wrap > a{width: 60px; height: 24px; display: flex; justify-content: center; align-items: center; font-size: 10px; font-weight: 300; border-radius: 3px; background-color: #fff; border: solid 1px #afafaf; color: #afafaf;}
.mypage .my-ri .tb-bt-wrap > a.pp{background-color: #b487ba; color: #fff; border: unset;}
.mypage .my-ri .tb-bt-wrap > a.bl{background-color: #1c97d0; color: #fff; border: unset;}
.mypage table{border-top: 2px solid #333; width: 100%; text-align: center;}
.mypage thead{border-bottom: 2px solid #e4e4e4; height: 56px;}
.mypage thead th{font-weight: 400; letter-spacing: 0.48px; color: #333;}
.mypage tbody tr{border-bottom: 1px solid #f5f5f5;}
/* 데이터가 없습니다 */
.mypage .no-data{font-size: 16px; color: rgb(119, 119, 119);}


/* mypage1 */
.mypage1 .tb1{margin-bottom: 22px;}
.mypage1 .tb1 thead tr th:nth-child(1){width: 6%;}
.mypage1 .tb1 thead tr th:nth-child(2){width: 49%;}
.mypage1 .tb1 thead tr th:nth-child(3){width: 15%;}
.mypage1 .tb1 thead tr th:nth-child(4){width: 15%;}
.mypage1 .tb1 thead tr th:nth-child(5){width: 15%;}
.mypage1 .tb1 tbody tr td:nth-child(4){color: #333; font-weight: 500;}
.mypage1 .tb1 tbody tr td:nth-child(5){color: #717171; font-size: 12px; font-weight: 400;}
.mypage1 .tb1 .product-dt p{max-width: 244px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mypage1 .all-el{display: flex; justify-content: center; align-items: center; width: 80px; height: 32px; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #fff; color: #717171; font-size: 12px; font-weight: 300; margin-bottom: 80px;}
.mypage1 .tb2{border-bottom: 2px solid #333; margin-bottom: 80px;}
.mypage1 .tb2 tbody{height: 140px;}
.mypage1 .tb2 tbody td{font-size: 22px; font-weight: 500; letter-spacing: 0.66px;}
.mypage1 .tb2 tbody td:nth-child(2n){font-size: 16px;}
.mypage1 .tb2 tbody td:nth-child(5){color: #ef7c4a; font-weight: 800;}
.mypage1 .white-btn{margin: 0 auto; width: 320px; height: 64px; border-radius: 32px; box-shadow: 3px 3px 16px 0 rgba(0, 0, 0, 0.1); border: solid 3px #333; font-size: 20px; font-weight: 500;}
.mypage1 .white-btn:hover{background-color: #EF7C4A; border: solid 3px #EF7C4A; color: #fff;}

/* mypage2 */
.mypage2 .tb1{margin-bottom: 81px;}
.mypage2 .tb1 thead tr th:nth-child(1){width: 59%;}
.mypage2 .tb1 thead tr th:nth-child(2){width: 15%;}
.mypage2 .tb1 thead tr th:nth-child(3){width: 15%;}
.mypage2 .tb1 thead tr th:nth-child(4){width: auto;}
.mypage2 .tb1 tbody tr td:nth-child(3) > div{display: flex; flex-direction: column;}
.mypage2 .tb1 tbody tr td:nth-child(3) > div > span:nth-child(1){font-weight: 500; color: #333; margin-bottom: 6px;}
.mypage2 .tb1 tbody tr td:nth-child(3) .day{font-size: 10px; font-weight: 400; color: #717171;}
.mypage2 .tb1 tbody tr td:nth-child(3) p{font-size: 8px; color: #717171; font-weight: 400;}
.mypage2 .tb1 tbody tr td:nth-child(3) p span{color: #1c97d0;}
.mypage2 .tb1 .product-wrap{padding: 9px 0;}

/* mypage3 */
.mypage3 .tb1{margin-bottom: 50px;}
/*
.mypage3 .tb1 thead tr th:nth-child(1){width: 15%;}
.mypage3 .tb1 thead tr th:nth-child(2){width: 61%;}
.mypage3 .tb1 thead tr th:nth-child(3){width: 15%;}
.mypage3 .tb1 thead tr th:nth-child(4){width: auto;}
 */
.mypage3 .tb1 tbody tr td{font-size: 14px; color: #717171; font-weight: 500;}
.mypage3 .tb1 .product-wrap{padding: 9px 20px;}
.mypage .my-ri .product-wrap {align-items: center;}


/* mypage-tb */
.mypage-tb .tb-list{width: 640px; margin-bottom: 80px;}
.mypage-tb .tb-list > li{border-top: 2px solid #333;}
.mypage-tb .tb-list > li h3{padding: 16px; font-weight: 500; letter-spacing: 0.48px; padding-bottom: 16px; border-bottom: 1px solid #e4e4e4;}
.mypage-tb .tb-list > li .product-wrap{padding: 16px; border-bottom: 1px solid #e4e4e4;}
.mypage-tb .tb-list > li .price-wrap{padding: 16px; display: flex; justify-content: space-between;}
.mypage-tb .tb-list > li .reason-wrap{padding: 16px;}
.mypage-tb .tb-list > li .reason-wrap textarea{width: 100%; height: 40px; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #f5f5f5; outline: unset; padding: 12px 16px;}
.mypage-tb .tb-list > li .ip-wrap{padding: 16px; display: flex; align-items: center;}
.mypage-tb .tb-list > li .ip-wrap input{width: 16px; height: 16px; margin-right: 8px;}
.mypage-tb .tb-list > li .ip-wrap label{font-size: 14px; color: #717171; letter-spacing: 0.42px; font-weight: 200; margin-right: 40px;}
.mypage-tb .my-ri .white-btn{width: 240px; height: 40px; font-size: 16px;}
.mypage-tb .my-ri .white-btn:hover{background-color: #333333; color: #fff;}

/* mypage4 */
.mypage4 .pdf-wrap{display: flex;  padding-top: 16px; flex-wrap: wrap; gap:10px;}
.mypage4 .pdf-wrap li{width: calc(100% / 4); border-radius: 8px; background-color: #f5f5f5; position: relative; overflow: hidden;}
.mypage4 .pdf-wrap li .img-wrap{width: 100%; padding: 20px 40px;}
.mypage4 .pdf-wrap li .download-wrap{opacity: 0; transition: all 0.3s; position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.466); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);}
.mypage4 .pdf-wrap li .download-wrap:hover{opacity: 1;}
.mypage4 .pdf-wrap li .download-wrap a{width: 32px; height: 32px; display: flex; justify-content: center; align-items: center; box-shadow: 0px 3px 6px #00000029; border: 1px solid #FFFFFF; border-radius: 3px; position: absolute; top: 50%; left: 50%; transform: translate(-50% , -50%); transition: all .3s;}
.mypage4 .pdf-wrap li .download-wrap a i{color: #fff; font-size: 21px;}
.mypage4 .pdf-wrap li .download-wrap a:hover{background-color: #1C97D0; border-color: #1C97D0;}
.mypage4 .pdf-wrap li .download-wrap p{position: absolute; width: 100%; color: #fff; font-weight: 200; left: 0; bottom: 25%; text-align: center;}
.mypage4 .pdf-comment {
    display: flex; align-items: center;
    padding:12px 0;
    border-top:2px solid #333;
}
.mypage4 .pdf-comment .body {
    font-size:14px;
    color:#929292; font-family: SCDream;
}
.mypage4 .pdf-comment .body .point {
    font-size:14px;
    color:#EF7C4A; font-family: SCDream; font-weight:bold;
}
.mypage4 .pdf-comment i {
    margin-right:8px;
    color:#929292;
}

/* mypage5 */
.mypage5 .tb1{margin-bottom: 80px;}
.mypage5 .tb1 thead tr th:nth-child(1){width: 15%;}
.mypage5 .tb1 thead tr th:nth-child(2){width: 9%;}
.mypage5 .tb1 thead tr th:nth-child(3){width: auto;}
.mypage5 .tb1 thead tr th:nth-child(4){width: 15%;}
.mypage5 .tb1 thead tr th:nth-child(5){width: 15%;}
.mypage5 .tb1 tbody tr td:nth-child(1){font-size: 12px; font-weight: 400; color: #333;}
.mypage5 .tb1 tbody tr td:nth-child(4){font-weight: 500;}
.mypage5 .tb1 tbody tr td:nth-child(5){font-size: 12px; font-weight: 200; color: #717171;}
.mypage5 .tb1 .product-wrap{padding: 24px;}
.mypage5 .tb1 .product-dt p {max-width: 244px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

/* mypage6 */
.mypage6 .tb1{margin-bottom: 80px;}
.mypage6 .tb1 thead tr th:nth-child(1){width: 15%;}
.mypage6 .tb1 thead tr th:nth-child(2){width: 28%;}
.mypage6 .tb1 thead tr th:nth-child(3){width: auto;}
.mypage6 .tb1 thead tr th:nth-child(4){width: 9%;}
.mypage6 .tb1 tbody tr td:nth-child(3) .review-wrap{display: flex; flex-direction: column; gap: 5px;}
.mypage6 .tb1 tbody tr td:nth-child(3) .review-wrap p{font-size: 12px; font-weight: 400; color: #040005; letter-spacing: 0.36px;}
.mypage6 .tb1 tbody tr td:nth-child(3) .review-wrap .star{justify-content: center;}
.mypage6 .tb1 tbody tr td .tb-bt-wrap > a{background-color: #e4e4e4; color: #717171; border: unset;}
.mypage6 .tb1 .product-wrap{padding: 10px 20px;}

/* mypage7 */
.mypage7 .my-ri{border-top: 2px solid #333;}
.mypage7 .my-ri h3{padding: 16px; font-weight: 500; border-bottom: solid 1px #e4e4e4;}
.mypage7 .user-data{margin-bottom: 20px;}
.mypage7 .user-data > li{padding: 33px 16px; border-bottom: solid 1px #e4e4e4;}
.mypage7 .user-data > li h4{font-size: 14px; font-weight: 400; letter-spacing: 0.42px; margin-bottom: 20px;}
.mypage7 .user-data > li:nth-child(1) p{font-size: 14px; font-weight: 300; color: #717171; margin-bottom: 20px;}
.mypage7 .user-data > li .sns-wrap{display: flex; gap: 7px; margin-bottom: 20px;}
.mypage7 .user-data > li .sns-wrap .img-wrap{width: 32px; height: 32px;}
.mypage7 .user-data > li .logout{font-size: 16px; font-weight: 500; letter-spacing: 0.36px; text-decoration: underline;}
.mypage7 .user-data .individual-data{display: flex; flex-direction: column; gap: 10px;}
.mypage7 .user-data .individual-data li{display: flex; align-items: center;}
.mypage7 .user-data .individual-data li *{font-size: 14px; color: #717171;}
.mypage7 .user-data .individual-data li span{width: 70px;}
.mypage7 .user-data .individual-data li p{line-height: 1;}
.mypage7 .user-data .input-wrap {display: flex; flex-wrap: wrap; width: 368px; gap: 16px 8px;}
.mypage7 .user-data .input-wrap input {width: 100%; height: 40px; padding: 12px 16px; outline: unset; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #fff;}
.mypage7 .user-data .input-wrap input:nth-child(1){width: 65%;}
.mypage7 .user-data .input-wrap .white-btn{width: 100%;}
.mypage7 .my-ri > a.withdraw{font-size: 12px; font-weight: 500; letter-spacing: 0.36px; padding-left: 16px; text-decoration: underline;}
.mypage7.withdraw .user-data > li:nth-child(1) p:nth-child(1){margin-bottom: 10px; font-weight: 200; color: #333333;}
.mypage7.withdraw .pw-wrap{display: flex; flex-direction: column; gap: 16px; width: 508px;}
.mypage7.withdraw .pw-wrap li{display: flex; justify-content: space-between; align-items: center;}
.mypage7.withdraw .pw-wrap li span{font-weight: 200; letter-spacing: 0.48px;}
.mypage7.withdraw .pw-wrap li input{width: 368px; height: 40px; border-radius: 3px; border: solid 1px #e4e4e4; background-color: #fff;}
.mypage7.withdraw .white-btn{width: 100px; font-weight: 500; letter-spacing: 0.36px;}
.mypage7.withdraw .white-btn:hover{background-color: #333333; color: #fff;}

@media screen and (max-width:1680px) {
    .main .side-h2{position: absolute; width: auto; left: 40px; top: -64px; z-index: 1;}
    .main .side-h2 span{display: none;}
    .main .side-h2 h2{font-size: 33px; position: relative; z-index: 1;}
    .main .side-h2 h2::before{position: absolute; content: ""; width: 18px; height: 18px; background-color: #6db575; border-radius: 100%; z-index: -1; left: -9px;}
    .main .section1 .side-h2 h2::before{ background-color: #6db575;}

    .main .section2 .side-h2 h2::before{ background-color: #f9c678;}
    .main .section3 .side-h2{display: none;}
    .introduce .section2 .s2-bt p:last-child{ margin-right: 40px;}
    .introduce .section2 .s2-bt p:last-child span::before{right: -28px;}
}

@media screen and (max-width:1240px) {
    .textbook-dt .tb-le .text-wrap h3{font-size: 40px;}
    .textbook-dt .section2 .buy-box{position: fixed; top: auto; bottom: 0; left: 0; z-index: 999; padding: 26px 21px 30px; box-shadow: 0 -3px 6px 0 rgba(0, 0, 0, 0.06);}
    .textbook-dt .section2 .buy-box h3{display: none;}
    .textbook-dt .section2 .buy-box .buy-wrap{gap: unset; flex-direction: column; border: unset;}
    .textbook-dt .section2 .buy-box .buy-le{width: 100%; padding-bottom: 20px; border-bottom: 1px solid #e4e4e4;}
    .textbook-dt .section2 .buy-box .buy-ri{width: 100%;}
    .textbook-dt .section2 .buy-box .buy-ri ul li:last-child span{margin: unset; font-size: 20px;}
    .textbook-dt .section2 .buy-box .buy-le-top{gap: 10px; margin-bottom: 15px;}
    .textbook-dt .section2 .buy-box .buy-le-top .product-dt{width: calc(100% - 56px);}
    .textbook-dt .section2 .buy-box .buy-le-top .product-dt p{width: 100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size: 11px;}
    .textbook-dt .section2 .buy-box .close{width: 100%; left: 0; right: 0; top: 0;}
    .textbook-dt .section2 .buy-box .close i:first-child{display: none;}
    .textbook-dt .section2 .buy-box .close i:last-child{display: unset;}
    .textbook-dt .section2 .buy-box .close i{font-size: 26px; color: #e4e4e4;}
    .textbook-dt .section2 .buy-box .buy-ri a.buy-bt2{height: 46px; font-size: 20px; font-weight: 500;}
    .textbook-dt .section2 .buy-box .buy-ri ul{padding-bottom: 35px;}

}

@media screen and (max-width:1080px) {
    .main .section1 .best-wrap .mySwiper3 .swiper-slide{gap: 40px;}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap{width: calc(100% - 40px - 216px);}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap h3{font-size: 42px; margin-bottom: 12px;}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap p.blue{font-size: 14px;}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap p{font-size: 10px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
    .main .section1 .best-wrap .btn-wrap{left: calc(216px + 40px);}


    .textbook .section1 .textbook-list{flex-direction: column}
    .textbook .section1 .textbook-list li{width: 100%;}

    .introduce .section1 .int-li:nth-child(3){flex-flow: column; align-items: flex-start; gap: 10px; height: unset;}
    .introduce .section1 .int-li .vision-li{gap: 24px;}
    .introduce .section1 .int-li .vision-li li{width: calc((100% - 48px) / 3);}
    .introduce .section1 .int-li .vision-li li p{font-size: 14px;}
    .introduce .section2 .s2-bt p:first-child{font-size: 16px; margin-bottom: 50px; padding: 0 30px;}
    .introduce .section2 .s2-bt p:first-child::before{width: 12px; height: 12px; left: 20px; top: 0;}
    .introduce .section2 .s2-bt p:first-child::after{width: 12px; height: 12px; right: 20px;; top: 0;}
    .introduce .section2 .s2-bt p:last-child{font-size: 12px; line-height: 2;}
    .introduce .section2 .s2-bt p:last-child span{font-size: 18px; display: block;}

    .textbook-dt .tb-top{margin-bottom: 40px; padding-top: 16px;}
    .textbook-dt .bg-cl-wrap .bg-cl{left: 0; width: 100%; border-radius: unset; height: 236px;}
    .textbook-dt .tb-top-wrap{flex-direction: column; padding: 15px;}
    .textbook-dt .tb-le{gap: 10px; margin-bottom: 25px;}
    .textbook-dt .tb-le .text-wrap {
        padding-bottom:0;
    }
    .textbook-dt .tb-le .text-wrap h3{font-size: 20px;}
    .textbook-dt .tb-le .text-wrap p.blue{font-size: 12px; }
    .textbook-dt .tb-le .text-wrap p{font-size: 10px; line-height: 1.6;}
    .textbook-dt .tb-le .text-wrap{padding-top: 10px;}
    .textbook-dt .tb-le .text-wrap .btn-wrap{display: none;}
    .textbook-dt .tb-ri p{font-size: 12px; font-weight: 200; max-width: unset;}
    .textbook-dt .tb-top-wrap .pg-bt{display: none;}
    .textbook-dt .tb-ri{padding: unset; border: unset; margin-bottom: 50px;}
    .textbook-dt .tb-top-wrap .pp-btn{width: 100%; height: 40px; display: flex; justify-content: center; align-items: center; border-radius: 3px; background-color: #b487ba; color: #fff; font-size: 14px; font-weight: 500;}

    .pay-pg .section1{padding-top: 22px; margin-bottom: 90px;}
    .pay-pg .section1 .container{padding: 0 20px; gap: 20px; flex-flow: column;}
    .pay-pg .pay-le .dv-top { padding-left: 0; }
    .pay-pg .pay-le {width: 100%;}
    .pay-pg .pay-le .dv-ct{gap: 10px; padding: 20px 0;}
    .pay-pg .pay-le .dv-ct li{flex-flow: column; gap: 10px;}
    .pay-pg .pay-le .dv-ct li label{line-height: normal; font-size: 16px;}
    .pay-pg .pay-le .dv-ct li .inf-wrap{width: 100%; gap: 8px;}
    .pay-pg .pay-le .dv-ct li:nth-child(3) .inf-wrap{gap: 8px;}
    .pay-pg .pay-le .dv-ct li:nth-child(3) .inf-wrap input:first-child{width: calc(100% - 120px - 8px);}
    .pay-pg .pay-le .dv-ct li:nth-child(4) .inf-wrap input , .pay-pg .pay-le .dv-ct li:nth-child(5) .inf-wrap input{width: calc( ( 100% - 16px ) / 3 )  ;}
    .pay-pg .means-wrap{border-top: 2px solid #333;}
    .pay-pg .ms-top{height: 56px; display: flex; gap: 16px; padding-left: 0; align-items: center;}
    .pay-pg .ms-top span{font-weight: 500; letter-spacing: 0.48px;}
    .pay-pg .ms-li{display: flex; flex-wrap: wrap; gap: 10px 8px; padding: 10px 0 30px; border-top: 1px solid #e4e4e4;}
    .pay-pg .ms-li li{width: calc((100% - 16px) / 3); height: 40px; display: flex; justify-content: center; align-items: center; font-size: 12px; font-weight: 500; letter-spacing: 0.36px; background-color: #fff; border-radius: 3px; border: solid 1px #e4e4e4; cursor: pointer;}
    .pay-pg .ms-li li.choice{background-color: #333; color: #fff;}
    .pay-pg .pay-ri{width: 100%; padding: 0; border: 0; ; }
    .pay-pg .pay-ri h3{ height: 56px; line-height: 56px; border-top: 2px solid #333;}
    .pay-pg .pay-ri .product-list{border-top: 1px solid #e4e4e4;}
    .pay-pg .pay-ri .product-list li .product-dt{gap: 4px;}
    .pay-pg .pay-ri .price-wrap{border-bottom: 2px solid #333; margin-bottom: 0;}
    .pay-pg .pay-ri .price-wrap li { align-items: center; font-size: 16px; }
    .pay-pg .pay-ri .price-wrap li span { font-size: 22px; font-weight: 500; letter-spacing: 0.66px; }
    .pay-pg .pay-ri .price-wrap li:last-child{font-size: 16px;}
    .pay-pg .pay-ri .price-wrap li:last-child span{font-size: 22px; letter-spacing: 0.66px; margin-top: 0;}
    .pay-pg .pay-ri a.black-btn{max-width: 320px; height: 64px; font-size: 20px; border-radius: 32px; background: #fff; border: 3px solid #333; color: #333; font-weight: 500;}
    .pay-pg .pay-ri a.black-btn:hover{color: #fff;}

}

@media screen and (max-width:768px) {
    /* 메인 */
    .main-top .swiper-slide .main-top-ri{order: 1; width: 100%; padding: 16px 28px; width: 375px;}
    .main-top .swiper-slide.swiper-slide-active .main-top-ri .img-wrap{height: 281px;}
    .main-top .swiper-slide .main-top-le{order: 2; padding: unset; height: unset; margin-bottom: 40px;}
    .main-top .swiper-slide .container{flex-direction: column; align-items: center;}
    .main-top .swiper-slide .bg-cl{height: 270px; border-radius: 0px 0px 60% 60%;}
    .main-top .swiper-slide .main-top-le .radius-btn{ width: 100%; height: 100%; bottom: 0; opacity: 0;}
    .main-top .swiper-slide .main-top-le span{color: #1c97d0; font-size: 14px; font-weight: 400;}
    .main-top .swiper-slide .main-top-le p{color: #1c97d0; font-size: 26px;}
    .main-top .swiper-pagination .swiper-pagination-bullet{width: 10px; height: 10px;}
    .main-top .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 24px;}
    .main-top .swiper-pagination{position: static;}
    .main-top .mySwiper{height: unset;}
    .main-top .swiper-wrapper{height: unset;}

    .main .side-h2{top: -46px;}
    .main .container{padding: unset;}
    .main .section1{padding: 33px 0;}
    .main .section1 .best-wrap .mySwiper3{width: 100%; pointer-events: unset;}
    .main .section1 .best-wrap .mySwiper3 .swiper-wrapper{transition: unset;}
    .main .section1 .best-wrap .mySwiper3 .swiper-slide{gap: 20px; flex-direction: column; padding: 0 40px;}
    .main .section1 .best-wrap .mySwiper3 .img-wrap{width: 100%; height: auto;}
    .main .section1 .best-wrap .mySwiper3 .img-wrap img{height: 100%;}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap{width: 100%;}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap h3{font-size: 26px; margin-bottom: 4px;}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap p.blue{margin-bottom: 5px; font-size: 14px;}
    .main .section1 .best-wrap .mySwiper3 .ex-wrap p{font-size: 10px;}
    .main .section1 .best-wrap .btn-wrap{left: 40px; bottom: -80px;}
    .main .section1 .best-wrap .swiper-pagination3{flex-direction: row; gap: 10px; position: absolute; bottom: -57px; right: 40px; width: auto;}
    .main .section1 .best-wrap .swiper-pagination-bullet{width: 8px; height: 8px; padding: unset; text-indent: 999em; overflow: hidden; opacity: 0.4; background-color: #f18f64; border-radius: 100%;}
    .main .section1 .best-wrap .swiper-pagination-bullet.swiper-pagination-bullet-active{opacity: 1;}
    .main .section1 .best-wrap .swiper-pagination-bullet:nth-child(1){background-image: none;}
    .main .section1 .best-wrap .swiper-pagination-bullet:nth-child(2){background-image: none;}
    .main .section1 .best-wrap .swiper-pagination-bullet:nth-child(3){background-image: none;}
    .main .section1 .best-wrap .swiper-pagination-bullet:nth-child(1).swiper-pagination-bullet-active{background-image: none;}
    .main .section1 .best-wrap .swiper-pagination-bullet:nth-child(2).swiper-pagination-bullet-active{background-image: none;}
    .main .section1 .best-wrap .swiper-pagination-bullet:nth-child(3).swiper-pagination-bullet-active{background-image: none;}
    .main .section2{padding-top: 175px; margin-bottom: 100px;}
    .main .section2 .side-h2{left: 50%; transform: translateX(-50%);}
    .main .section2 .swiper-button-next{display: none;}
    .main .section2 .swiper-button-prev{display: none;}
    .main .section2 .mySwiper2{height: 270px;}
    .main .section2 .swiper-slide{width: 200px; padding: 13px; transition: all 0.3s; pointer-events: none;}
    .main .section2 .swiper-slide.swiper-slide-active{padding: unset; pointer-events: all;}
    .main .section2 .swiper-wrapper{height: 250px;}
    .main .section2 .swiper-slide .pdmv-wrap{padding: 30px 9px 47px;}
    .main .section2 .swiper-slide.swiper-slide-active .pdmv-wrap{background-color: #6db575; padding-top: 20px; padding-bottom: 90px;}
    .main .section2 .swiper-slide:nth-child(2n).swiper-slide-active .pdmv-wrap{background-color: #E6BAD3;}
    .main .section2 .swiper-slide:nth-child(4n - 1).swiper-slide-active .pdmv-wrap{background-color: #1C97D0;}
    .main .section2 .swiper-slide:nth-child(4n).swiper-slide-active .pdmv-wrap{background-color: #F9C678;}
    .main .section2 .swiper-slide.swiper-slide-active .pdmv-wrap .btn-wrap{top: 173px;}
    .main .section2 .swiper-slide.swiper-slide-active .pdmv-wrap h4{color: #fff;}
    .main .section2 .swiper-slide.swiper-slide-active .move-btn a{background-color: transparent; border-color: #fff;}
    .main .section2 .swiper-slide.swiper-slide-active .move-btn.bl a{background-color: transparent; border-color: #fff;}
    .main .section2 .swiper-pagination{display: unset; max-width: 305px; bottom: 0; top: unset; left: 50%; transform: translateX(-50%); background-color: #e4e4e4;}
    .main .section2 .swiper-pagination .swiper-pagination-progressbar-fill{background-color: #6db575;}

    .main .section3{margin-bottom: 80px;}
    .main .section3 .side-h2 {display: inline-flex;}
    .main .section3 .side-h2 h2::before{background-color: #b487ba;}
    .main .section3 .board-wrap{padding: 20px 24px; background-color: #f5f5f5; position: relative;}
    .main .section3 .side-h2{position: unset; padding-left: 32px;}
    .main .section3 .board-wrap h3{font-size: 16px; font-weight: bold; margin-bottom: 10px;}
    .main .section3 .board-wrap ul{border-top: 1px solid #333; padding-top: 14px; display: flex; flex-direction: column; gap: 16px;}
    .main .section3 .board-wrap ul li .days{display: none;}
    .main .section3 .board-wrap ul li a{font-size: 14px; font-weight: 400;}
    .main .section3 .board-wrap ul li{border: unset; height: auto;}
    .main .section3 .board-wrap > a{position: absolute; top: 20px; right: 24px; font-size: 16px;}

    /* 교제소개 */
    .textbook .top-section h2 span{display: none;}
    .textbook .section1 .textbook-list{gap: 42px 13px; flex-direction: unset;}
    .textbook .section1 .textbook-list li{flex-direction: column; width: calc((100% - 13px) / 2); height: auto; box-shadow: unset;}
    .textbook .section1 .textbook-list li .text-wrap p.ex{display: none;}
    .textbook .section1 .textbook-list li .img-wrap{width: 100%; max-width: 160px; height: 228px; box-shadow: 8px 8px 36px 0 rgba(0, 0, 0, 0.1); margin: 0 auto;}
    .textbook .section1 .textbook-list li .img-wrap img{height: 100%;}
    .textbook .section1 .textbook-list li .text-wrap{padding: unset; width: 100%; text-align: center; padding-top: 10px;}
    .textbook .section1 .textbook-list li .text-wrap h3{font-size: 16px; margin-bottom: 1px;}
    .textbook .section1 .textbook-list li .text-wrap p.blue{font-size: 12px; letter-spacing: -0.24px; margin: unset;}
    /*///////////////////////////////////////////////////////// 장바구니 추가 */
    .textbook .section1 .textbook-list li .text-wrap .price-wrap{position: static; width: 100%; margin-top: 16px}
    .textbook .section1 .textbook-list li .text-wrap .price-wrap .basket-btn{width: 32px; height: 32px;}
    .textbook .section1 .textbook-list li .text-wrap .price-wrap .basket-btn i{font-size: 20px;}
    .textbook .section1 .textbook-list li .text-wrap .price-wrap .price{gap: 4px;}
    .textbook .section1 .textbook-list li .text-wrap .price-wrap .price span{font-size: 14px;}
    .textbook .section1 .textbook-list li .text-wrap .price-wrap .price span.sale{font-size: 10px;}
    /*///////////////////////////////////////////////////////// 장바구니 추가 */
    .textbook-dt .tb-top{margin-bottom: 40px; padding-top: 16px;}
    .textbook-dt .bg-cl-wrap .bg-cl{left: 0; width: 100%; border-radius: unset; height: 236px;}
    .textbook-dt .tb-top-wrap{flex-direction: column; padding: 15px;}
    .textbook-dt .tb-le{gap: 10px; margin-bottom: 25px;}
    .textbook-dt .tb-le .text-wrap h3{font-size: 20px;}
    .textbook-dt .tb-le .text-wrap p.blue{font-size: 12px; }
    .textbook-dt .tb-le .text-wrap p{font-size: 10px; line-height: 1.6;}
    .textbook-dt .tb-le .text-wrap{padding-top: 10px;}
    .textbook-dt .tb-le .text-wrap .btn-wrap{display: none;}
    .textbook-dt .tb-ri p{font-size: 12px; font-weight: 200; max-width: unset;}
    .textbook-dt .tb-top-wrap .pg-bt{display: none;}
    .textbook-dt .tb-ri{padding: unset; border: unset; margin-bottom: 50px;}
    .textbook-dt .tb-top-wrap .pp-btn{width: 100%; height: 40px; display: flex; justify-content: center; align-items: center; border-radius: 3px; background-color: #b487ba; color: #fff; font-size: 14px; font-weight: 500;}
    .textbook-dt .section2{padding: unset; border: unset;}
    .textbook-dt .section2 .buy-bt-wrap{position: fixed; bottom: 0; left: 0; z-index: 99; background-color: #fff; width: 100%; gap: 12px; padding: 12px 21px 20px;}
    .textbook-dt .section2 .buy-bt-wrap .basket{width: 46px; height: 46px;}
    .textbook-dt .section2 .buy-bt-wrap .basket i{font-size: 30px;}
    .textbook-dt .section2 .buy-bt-wrap .buy-bt{width: calc(100% - 58px); height: 46px;}
    .textbook-dt .section2 .buy-bt-wrap .buy-bt span{font-size: 20px;}
    .textbook-dt .section2 .tabs{width: 100%; gap: unset; border-radius: 8px; overflow: hidden; border: solid 1px #1c97d0;}
    .textbook-dt .section2 .tabs .tab-link{height: 42px; color: #8a8a8a; font-size: 14px; border-radius: unset; border: unset; width: calc(100% / 3);}

    .textbook-dt .section3{margin-bottom: 100px;}
    .textbook-dt .section3 .tab-content:nth-child(2){padding-top: 20px;}
    .textbook-dt .section3 .video iframe{max-width: 333px; height: 212px;}
    .textbook-dt .section3 .video{border: unset;}
    .textbook-dt .section3 .video .vd-ex{flex-direction: column; padding-top: 34px;}
    .textbook-dt .section3 .video .vd-ex .vd-le{padding: unset; margin-bottom: 20px;}
    .textbook-dt .section3 .video .vd-ex .vd-ri{padding: unset; border: unset;}
    .textbook-dt .section3 .video .vd-ex .vd-le h3{font-size: 20px;}
    .textbook-dt .section3 .video .vd-ex .vd-le p{font-size: 12px;}
    .textbook-dt .section3 .video .vd-ex .vd-ri p{font-size: 12px;}

    .textbook-dt .section3 .postscript .write-wrap{padding: unset; margin-bottom: 20px;}
    .textbook-dt .section3 .postscript .write-wrap .upload{display: none;}
    .textbook-dt .section3 .postscript .write{margin: unset;}
    .textbook-dt .section3 .postscript .write .star{display: none;}
    .textbook-dt .section3 .postscript .write input{padding: 9px 10px; border: unset; font-size: 12px;}
    .textbook-dt .section3 .postscript .write .write-btn{font-size: 12px;}
    .textbook-dt .section3 .postscript .postscript-list{padding-top: 30px; margin-bottom: 10px;}
    .textbook-dt .section3 .postscript .ps-top .user-name{font-size: 12px;}
    .textbook-dt .section3 .postscript .ps-top .day{font-size: 12px;}
    .textbook-dt .section3 .postscript .ps-top > a{font-size: 10px;}
    .textbook-dt .section3 .postscript .ps-bottom p{font-size: 10px;}
    .textbook-dt .section3 .postscript .ps-sm .write{padding: unset;}
    .textbook-dt .section3 .postscript .ps-sm{padding-top: 10px;}
    .textbook-dt .section3 .postscript .ps-sm .postscript-list{padding: unset;}
    .textbook-dt .section3 .postscript .ps-sm .write{border-radius: 8px; border: solid 1px #e4e4e4;}
    .textbook-dt .section3 .postscript .ps-sm .ps-top{margin-bottom: 3px; padding-left: 20px;}
    .textbook-dt .section3 .postscript .ps-sm .ps-bottom{padding-left: 20px;}
    .textbook-dt .section3 .postscript .ps-bottom{padding-bottom: 7px;}
    .textbook-dt .section3 .postscript .ps-bottom .img-box{margin-top: 20px;}
    .textbook-dt .section3 .postscript .ps-top{margin-bottom: 12px;}
    .textbook-dt .section3 .postscript .page-btn{display: none;}
    .textbook-dt .section3 .postscript > .white-btn{display: flex; width: 100%; border: solid 1px #e4e4e4; color: #d2d2d2;}

    /* 공통 */
    .bg-cl-wrap{position: relative;}
    .bg-cl-wrap .bg-cl{ top:0; left: 20px; width: calc( 100% - 40px ); height: 76px; border-radius: 16px;}
    .top-section{height: unset;}
    .top-section .container{display: flex; justify-content: space-between;}
    .top-section .top-text{ width: 100%; margin-top: 0; }
    .top-section .top-text h2{font-size: 23px; line-height: 76px; margin-bottom: 0;}
    .top-section .top-text h2::before, .top-section .top-text h2::after{ display: none; }
    .top-section .top-text p{ display: none; }
    .top-section .img-wrap { width: 155px; position: absolute; top: 0; right: 20px; }
    .pagination a{display: none;}
    .pagination a:last-child , .pagination a:first-child , .pagination a.active { display: unset; }
    /* 회사소개///////////////////////////////////////////////////////////////////// */
    .introduce .circle-wrap{margin-bottom: 8px;}
    .introduce .circle-wrap > li{width: 10px; height: 10px; border-radius: 100%;}
    .introduce section> .container { padding: 0 20px; }
    .introduce .section1 {padding-top: 50px; margin-bottom: 75px; overflow: hidden;}
    .introduce .section1 .int-li{flex-flow: column; align-items: flex-start; gap: 10px; height: unset;}
    .introduce .section1 .int-li h3{font-size: 26px; margin-bottom: 0;}
    .introduce .section1 .int-li .text-wrap { padding-left: 10px; }
    .introduce .section1 .int-li .img-wrap.mb {width: 100%; height: 240px; border-radius: 16px; display: flex; flex-flow: column; justify-content: center; gap: 20px; text-align: center;}
    .introduce .section1 .int-li .img-wrap p { font-size: 14px; }
    .introduce .section1 .int-li:nth-child(1) .img-wrap { border: 4px solid #9cd6e2; }
    .introduce .section1 .int-li:nth-child(1) .img-wrap img{transform: unset; width: 265px; margin: 0 auto;}
    .introduce .section1 .int-li:nth-child(2) .img-wrap { border: 4px solid #f9c678; order: 1; }
    .introduce .section1 .int-li:nth-child(2) .img-wrap img{transform: unset; width: 290px; margin: 0 auto;}
    .introduce .section1 .int-li:nth-child(1){margin-bottom: 50px;}
    .introduce .section1 .int-li:nth-child(2){margin-bottom: 50px;}
    .introduce .section1 .int-li .vision-li{flex-direction: column; gap: 15px;}
    .introduce .section1 .int-li .vision-li li{width: 100%;}
    .introduce .section1 .int-li .vision-li li::before{display: none;}
    .introduce .section1 .int-li .vision-li li .vision-wrap{position: static; justify-content:unset; flex-direction:unset; border-radius: 16px; padding: 8px 10px;}
    .introduce .section1 .int-li .vision-li li img{width: 60px;}
    .introduce .section1 .int-li .vision-li li p{text-align: unset; color: #fff; line-height: 1.57;}
    .introduce .section1 .int-li .vision-li li p br{display: none;}

    .introduce .section2 {margin-bottom: 120px;}
    .introduce .section2 .s2-top{padding: 40px 25px; border: solid 4px #6db575; margin-bottom: 70px;}
    .introduce .section2 .circle-wrap { justify-content: center; }
    .introduce .section2 .s2-top h3{font-size: 26px; margin-bottom: 20px; text-align: center;}
    .introduce .section2 .s2-top p{font-size: 14px; text-align: center; }
    .introduce .section2 .s2-top .green{font-size: 18px; margin-bottom: 20px; text-align: center;}
    .introduce .section2 .s2-ct{margin-bottom: 48px;}
    .introduce .section2 .s2-ct ul{gap: 36px;}
    .introduce .section2 .s2-ct ul li{ flex-flow: column; padding-left: 0;}
    .introduce .section2 .s2-ct ul li .num{font-size: 37px; margin-right: 0; text-align: center;}
    .introduce .section2 .s2-ct ul li .num::before{content: ""; width: 12px; height: 12px; left: 50%; transform: translateX(-50%); margin-left: -18px;}
    .introduce .section2 .s2-ct ul li p{font-size: 14px; text-align: center; }
    .introduce .section2 .s2-bt p:first-child{font-size: 16px; margin-bottom: 50px; padding: 0 30px;}
    .introduce .section2 .s2-bt p:first-child::before{width: 12px; height: 12px; left: 20px; top: 0;}
    .introduce .section2 .s2-bt p:first-child::after{width: 12px; height: 12px; right: 20px;; top: 0;}
    .introduce .section2 .s2-bt p:last-child{font-size: 12px; line-height: 2; margin-right: 20px;}
    .introduce .section2 .s2-bt p:last-child span{font-size: 18px; display: block;}
    .introduce .section2 .s2-bt p:last-child span::before{right: -28px;}


    /* 강의영상 ////////////////////////////////////////////////////////*/
    .lecture .top-section .img-wrap { width: 155px; }
    .lecture .section1{padding-top: 50px; margin-bottom: 90px;}
    .lecture .section1 .lecture-list{gap: 63px 13px; justify-content: unset;}
    .lecture .section1 .lecture-list li{width: calc( ( 100% - 13px ) / 2 ); gap: 16px;}
    .lecture .section1 .lecture-list li::after { display: none; }
    .lecture .section1 .lecture-list li .text-wrap h3{font-size: 16px; margin-bottom: 4px; }
    .lecture .section1 .lecture-list li .text-wrap p.blue{font-size: 12px; letter-spacing: -0.24px; margin-bottom: 15px;}
    .lecture .section1 .lecture-list li .text-wrap a { width: 148px; height: 30px; border-radius: 15px; border: 1px solid #1c97d0; line-height: 28px; font-size: 12px; }
    .lecture .section1 .lecture-list li .text-wrap a i { font-size: 14px; margin-left: 20px; line-height: 28px;}

    /* 강의영상 상세 */
    .lecture-dt .section1 .lecture-list{ gap: 30px; }
    .lecture-dt .section1 .lecture-list li { width: 100%; }
    .lecture-dt .section1 .lecture-list li .img-wrap { padding-top: 63.66%; }
    .lecture-dt .section1 .lecture-list li .text-wrap h4{font-size: 12px; }
    .lecture-dt .section1 .lecture-list li .text-wrap p{font-size: 10px; line-height: 1.8; }

    .lecture-dt2 .bg-cl-wrap .bg-cl { width: 100%; left: 0; border-radius: 0; height: 180px;}
    .lecture-dt2 .section1 { padding-top: 20px; }
    .lecture-dt2 .section1> .container { border-radius: unset;  border: 0; }
    .lecture-dt2 .section1 .text-wrap { padding: 32px 0 0; flex-flow: column; gap: 20px; }
    .lecture-dt2 .section1 .text-wrap .left { width: 100%; padding: 0; border-right: 0; }
    .lecture-dt2 .section1 .text-wrap .right { width: 100%; padding: 0; }
    .lecture-dt2 .section1 .text-wrap h2 { font-size: 20px; }
    .lecture-dt2 .section1 .text-wrap pre.blue { font-size: 12px; }
    .lecture-dt2 .section1 .text-wrap pre { font-size: 12px; }

    .lecture .pagination { display: none; }

    /* 게시판 ////////////////////////////////////////////////////////*/
    .board .top-section .img-wrap { width: 155px; }
    .board .section1{padding-top: 50px; margin-bottom: 90px;}
    .board .section1> .container { padding: 0 20px; }
    .board .section1 .search-wrap form { width: 100%; margin: 0 auto 36px; }
    .board .section1 .search-wrap input { width: 100%; height: 40px; padding: 0 16px; font-size: 12px; }
    .board .section1 .search-wrap .search-btn { width: 20px; height: 20px;right: 16px; top: 10px; }
    .board .section1 .search-wrap .search-btn i { font-size: 18px; }
    .board .section1 .table-wrap { border-top: 2px solid #6db575; border-bottom: 2px solid #6db575; }
    .board .section1 .table-wrap table tr td { font-size: 12px; padding: 12px 0; }
    .board .section1 .table-wrap table tr td:nth-child(1) { display: none; }
    .board .section1 .table-wrap table tr td:nth-child(2) { width: 80%; padding-left: 0; }
    .board .section1 .table-wrap table tr td:nth-child(3) { width: 20%; font-size: 10px; }

    /* 게시판 상세 */
    .board-dt .board-wrap { border-top: 2px solid #6db575; }
    .board-dt .board-wrap .title-wrap { padding: 12px 0; }
    .board-dt .board-wrap .title-wrap .title { font-size: 14px; line-height: 1.57; font-weight: 300; margin-bottom: 4px; }
    .board-dt .board-wrap .title-wrap .date { font-size: 10px; letter-spacing: -0.25; }
    .board-dt .board-wrap .content-wrap { padding: 30px 0; }
    .board-navigation { padding-top: 12px; flex-flow: column; gap: 8px; }
    .board-navigation a { gap: 10px; }
    .board-navigation a i.mb { display: block; font-size: 20px; }
    .board-navigation a i.pc { display: none; }
    .board-navigation a h4 { display: none; }
    .board-navigation a .col-group { margin-left: 0; }
    .board-navigation a.next .col-group { margin-right: 0; }
    .board-navigation a .col-group .title { font-size: 13px; }
    .board-navigation a .col-group .date { display: none; }

    /* 로그인 페이지 ////////////////////////////////////////////////////////*/
    main.login{display: flex; flex-direction: column;}
    main.login .banner-wrap{order: 1;}
    .login-wrap { padding: 0 0 60px; gap: 15px; flex-flow: column; }
    .login-wrap> * { width: 100%; }
    .login-wrap .left { padding: 0; }
    .login-wrap .left .img-box { width: 100%; height: 156px; background-color: #f7d4d2; display: flex; justify-content: center; align-items: center;}
    .login-wrap .left .img-box img{width: 143px; height: 143px;}
    .login-wrap .right { padding: 0; }
    .login-wrap .right .text-wrap { margin-bottom: 90px; padding: 0 8px; }
    .login-wrap .right .login-btn { flex-flow: column; gap: 8px; }
    .login-wrap .right .login-btn li { width: 100%; }

    /* 마이페이지///////////////////////////////////////////////////////////// */
    .mypage .section1{margin-bottom: 30px;}
    .mypage .container{overflow: hidden;}
    .mypage:not(.mypage-index) .container { padding: 0 20px; }
    .mypage .banner-wrap{margin-bottom: 22px;}
    .mypage .banner-wrap .container{padding: unset;}
    .mypage table { table-layout: fixed; }
    .mypage .my-le{ display: none; }
    .mypage .my-ri{width: 100%;}
    .mypage .my-ri h2 { display: block; font-size: 20px; font-weight: 500; margin-bottom: 10px; }
    .mypage .my-ri .product-wrap {padding: 15px 10px; width: 100%; gap: 15px;}
    .mypage .my-ri .product-dt{ width: calc( 100% - 71px ); padding-left: 0; justify-content: flex-start;}
    .mypage .my-ri .product-wrap > .close-btn{right: 0; top: 15px;}
    .mypage .my-ri .num { margin-left: 81px; }
    .mypage .my-ri .tb-bt-wrap { width: calc( 100% - 71px ); flex-flow: row wrap; gap: 8px; padding: 15px 0; }
    .mypage .my-ri .tb-bt-wrap > a{ width: calc( 100% - 168px ); height: 34px; font-size: 14px; font-weight: 500; }
    .mypage .my-ri .tb-bt-wrap > a.pp{ width: 160px; }
    .mypage .my-ri .tb-bt-wrap > a.bl{ width: 100%; }
    .mypage .tb1 .product-dt .txt-box { width: 100%; }
    .mypage .tb1 .product-dt .txt-box p{ max-width: unset; width: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .mypage .page-btn { display: none; }

    .mypage-index .banner-wrap{margin-bottom: 30px;}
    .mypage-index .my-ri { display: none; }
    .mypage-index .my-le { display: block; width: 100%; padding: 0; }
    .mypage-index .my-le .my-le-top { margin-bottom: 30px; padding: 0 20px; }
    .mypage-index .my-le .my-nav li a { padding: 0 20px; }

    /* mypage1 */
    .mypage1 .tb1{margin-bottom: 90px;}
    .mypage1 .tb1 thead tr th:nth-child(1){width: 6%;}
    .mypage1 .tb1 thead tr th:nth-child(2){width: calc( 94% / 3 );}
    .mypage1 .tb1 thead tr th:nth-child(3){width: calc( 94% / 3 );}
    .mypage1 .tb1 thead tr th:nth-child(4){width: calc( 94% / 3 );}
    .mypage1 .tb1 thead tr th:nth-child(5){width: none;}
    .mypage1 .tb1 tbody tr { border-bottom: 1px solid #333; }
    .mypage1 .tb1 tbody tr td:not(:nth-child(1)) { display: block; }
    .mypage1 .tb1 tbody tr td:nth-child(4) { font-size: 20px; text-align: right; padding: 20px 0 16px; font-weight: bold; }
    .mypage1 .tb1 tbody tr td:nth-child(5) { display: none; }
    .mypage1 .tb1 tbody tr td:nth-child(5){color: #717171; font-size: 12px; font-weight: 200;}
    .mypage1 .all-el{position: absolute; top: 43px; right: 20px; margin-bottom: 0;}
    .mypage1 .tb2 {border-bottom: 0; margin-bottom: 50px; border-top: 0; display: flex; justify-content: space-between;}
    .mypage1 .tb2 thead { border-bottom: 0; }
    .mypage1 .tb2 thead th { display: block; line-height: 22px; text-align: left; margin-bottom: 15px; }
    .mypage1 .tb2 thead th:nth-child(2n){display: none;}
    .mypage1 .tb2 thead th:last-child { margin-bottom: 0; }
    .mypage1 .tb2 tbody {height: unset;}
    .mypage1 .tb2 tbody td{ display: block; text-align: right; margin-bottom: 15px;}
    .mypage1 .tb2 tbody td:nth-child(2n){display: none;}
    .mypage1 .tb2 tbody td:nth-child(5){margin-bottom: 0;}
    .mypage1 .white-btn{width: 100%; max-width: 320px; }

    /* mypage2 */
    .mypage2 .tb1{margin-bottom: 40px;}
    .mypage2 .tb1 thead { display: none; }
    .mypage2 .tb1 tbody tr td { display: block; width: 100%; text-align: left; }
    .mypage2 .tb1 tbody tr td:not(:nth-child(1)) { margin-left: 71px; }
    .mypage2 .tb1 tbody tr td:nth-child(2) { display: none; }
    .mypage2 .tb1 tbody tr td:nth-child(3) > div{flex-flow: row wrap; align-items: baseline; gap: 2px 8px;}
    .mypage2 .tb1 tbody tr td:nth-child(3) > div > span:nth-child(1) { margin-bottom: 0; }
    .mypage2 .tb1 tbody tr td:nth-child(3) p{width: 100%;}
    .mypage2 .tb1 .product-wrap{padding: 9px 0;}

    /* mypage3 */
    .mypage3 .tb1{margin-bottom: 40px;}
    .mypage3 .tb1 thead { display: none; }
    .mypage3 .tb1 tbody tr td{display: block; width: 100%; text-align: left;}
    .mypage3 .tb1 tbody tr td:nth-child(1), .mypage3 .tb1 tbody tr td:nth-child(3) { display: none; }
    .mypage3 .tb1 tbody tr td:not(:nth-child(2)) { margin-left: 71px; }
    .mypage3 .tb1 tbody tr td:nth-child(4){width: calc((50% - 71px));}
    .mypage3 .tb1 tbody tr td:nth-child(4) p { font-weight: 500;}
    .mypage3 .tb1 tbody tr td:nth-child(5){margin: unset; width: 50%;}
    .mypage3 .tb1 tbody tr td:nth-child(5) p { font-weight: 500;}
    .mypage3 .my-ri .tb-bt-wrap{width: 100%;}
    .mypage3 .tb1 .product-wrap{padding: 15px 0 0;}
    .mypage3 .tb1 tbody tr{display: flex; flex-wrap: wrap;}
    .mypage3 .my-ri .tb-bt-wrap > a.bl { width: 160px; }

    /* mypage-tb */
    .mypage-tb .tb-list{width: 100%; margin-bottom: 80px;}
    .mypage-tb .tb-list > li{border-top: 2px solid #333;}
    .mypage-tb .tb-list > li h3{padding: 16px 0; font-size: 16px;}
    .mypage-tb .tb-list > li .product-wrap{padding: 16px 0; }
    .mypage-tb .tb-list > li .price-wrap{padding: 16px 0; }
    .mypage-tb .tb-list > li .reason-wrap{padding: 16px 0;}
    .mypage-tb .tb-list > li .ip-wrap{padding: 16px 0;}
    .mypage-tb .my-ri .white-btn{ margin: 0 auto;}

    /* mypage4 */
    .mypage4 .pdf-wrap{padding-top: 10px;}
    .mypage4 .pdf-wrap li{width: calc(100% / 2); }

    /* mypage5 */
    .mypage5 .tb1{margin-bottom: 40px;}
    .mypage5 .tb1 thead { display: none; }
    .mypage5 .tb1 tbody tr td{display: block; width: 100%; text-align: left;}
    .mypage5 .tb1 tbody tr td:nth-child(1), .mypage5 .tb1 tbody tr td:nth-child(2) { display: none; }
    .mypage5 .tb1 tbody tr td:nth-child(4){ margin-left: 71px; padding-bottom: 15px;}
    .mypage5 .tb1 tbody tr td:nth-child(5){ display: none; }
    .mypage5 .tb1 .product-wrap{padding: 15px 0;}

    /* mypage6 */
    .mypage6 .tb1{margin-bottom: 40px;}
    .mypage6 .tb1 thead { display: none; }
    .mypage6 .tb1 tbody tr td{display: block; width: 100%; text-align: left;}
    .mypage6 .tb1 tbody tr td:nth-child(2n-1) { display: none; }
    .mypage6 .tb1 tbody tr td:nth-child(3) .review-wrap{display: flex; flex-direction: column; gap: 5px;}
    .mypage6 .tb1 tbody tr td:nth-child(3) .review-wrap p{font-size: 12px; font-weight: 200; color: #040005; letter-spacing: 0.36px;}
    .mypage6 .tb1 tbody tr td:nth-child(3) .review-wrap .star{justify-content: center;}
    .mypage6 .tb1 tbody tr td .tb-bt-wrap > a{background-color: #e4e4e4; color: #717171; border: unset;}
    .mypage6 .tb1 .product-wrap{padding: 15px 0 0;}
    .mypage6 .my-ri .tb-bt-wrap { margin-left: 71px; }
    .mypage6 .my-ri .tb-bt-wrap > a { width: 100%; }

    /* mypage7 */
    .mypage7 .my-ri{border-top: 0;}
    .mypage7 .my-ri h3{ padding: 16px 0; border-top: 2px solid #333;}
    .mypage7 .user-data > li{padding: 20px 0; ;}
    .mypage7 .user-data .input-wrap {width: 100%; }
    .mypage7 .user-data .input-wrap input {padding: 12px 0;}
    .mypage7 .user-data .input-wrap input:nth-child(1){width: calc( 100% - 128px );}
    .mypage7 .user-data > li:nth-child(1) p:nth-of-type(2) { font-size: 12px; margin-bottom: 50px; }
    .mypage7 .my-ri > a.withdraw{padding-left: 0; }
    .mypage7.withdraw .user-data > li:nth-child(1) p:nth-child(1){margin-bottom: 15px; }
    .mypage7.withdraw .pw-wrap { width: 100%; }
    .mypage7.withdraw .pw-wrap li{flex-flow: column; align-items: flex-start; gap: 10px;}
    .mypage7.withdraw .pw-wrap li input{width: 100%;}

    .mypage .my-ri h2 { display: block; font-size: 20px; font-weight: 500; margin-bottom: 10px; text-align: center; position: relative;}
    .mypage .my-ri h2 > a{position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
    .mypage .my-ri h2 > a i{font-size: 26px;}
}

.orders-pay {display:flex; align-items:center; justify-content:center; min-height:calc(100vh - 364px); text-align: center;}
.orders-pay .title {font-size:40px;}

@media screen and (max-width:768px) {
    .orders-pay {min-height:calc(100vh - 60px);}
    .orders-pay .title {font-size:24px;}

}

.pay-result {margin-bottom:80px;}
.pay-result .subContent-title {margin-top:60px; margin-bottom:40px; font-size:24px; text-align: center;}
.pay-result .section {margin-top:60px;}
.pay-result .section-title {margin-bottom:10px;}
.pay-result .comment {margin-top:20px; font-weight:300; text-align: right;}
.pay-result .product {padding: 15px 0; display: flex; border-bottom: solid 1px #e4e4e4; gap: 16px;}
.pay-result .product .img-wrap{width: 56px;}
.pay-result .product .product-dt{display: flex; flex-direction: column; justify-content: space-between;}
.pay-result .product .product-dt .pd-name{font-weight: 200; color: #333;}
.pay-result .product .product-dt p{font-size: 12px; font-weight: 200; color: #717171;}
.pay-result .product .product-dt .price {margin-top:8px; font-size: 12px; font-weight: 200; color: #717171;}

.m-input-error { margin-top:4px; color:red;}
