/* BASIC css start */
/* 공통 */
.cont_tit {font-size:26px; font-weight:700; margin-bottom:18.5px;}
.cont_subtxt {font-size:16px; color:#191919; margin-top:6px;}
.prdCont .prd_more {float: right; text-decoration: underline; font-size: 15px; font-weight: 400; margin-top: 10px;}
body .swiper-button-next.swiper-button-disabled, 
body .swiper-button-prev.swiper-button-disabled {opacity: 1; pointer-events: inherit; cursor: no-drop;}
body .row_container {margin-top:50px;}


/* 상품 */
.prd_wrap .inner {padding-bottom:5px;}


/* 슬라이드 상품 공통 */
.slideType .prd_wrap .inner {overflow:hidden;}
.slideType .prd_wrap ul .prd_list.list_banner a {position:absolute; left:0; top:0; background: url(/design/khk31712/img/pc/month_pick.png)no-repeat center top; background-size: cover; height: 330.66px; width:100%; border-radius:20px;}
.slideType .swiper-button-prev {background: rgba(255, 255, 255, 1); border-radius:32px; width:32px; height:62px; transition:all .3s ease; border:1px solid #ebebeb; box-sizing: border-box; left:-16px; margin:0;}
.slideType .swiper-button-prev:after {content:''; display:inline-block; background:url(/design/khk31712/img/pc/swiper_left2.png)no-repeat center; width:9px; height:17px; background-size:9px auto;}
.slideType .swiper-button-next {background: rgba(255, 255, 255, 1); border-radius:32px; width:32px; height:62px; transition:all .3s ease; border:1px solid #ebebeb; box-sizing: border-box; right:-16px; margin:0;}
.slideType .swiper-button-next:after {content:''; display:inline-block; background:url(/design/khk31712/img/pc/swiper_right2.png)no-repeat center; width:9px; height:17px; background-size:9px auto;}
.slideType .swiper-button-prev:hover,
.slideType .swiper-button-next:hover {background: rgba(0, 0, 0, 0.2);}


/* sec01 */
.sec01 {overflow:hidden; position:relative;}
.sec01 .inner {}
.sec01 .inner ul {}
.sec01 .inner ul li img {width:100%; height:315px;}
.sec01 .swiper-pagination-bullets.swiper-pagination-horizontal {bottom:20px;}
.sec01 .swiper-pagination span {width:8px; height:8px;}
.sec01 .swiper-pagination span.swiper-pagination-bullet-active {background:#191919;}

/* sec02 */
.sec02 {display:flex; align-items:center; justify-content: center;}
.sec02 .left_txt {font-size:34px; font-weight:700; flex:1; color:#191919;}
.sec02 .right_cont {width:77%; float:right;}
.sec02 .right_cont ul {display:flex; align-items:center; gap:4%; justify-content: center;}
.sec02 .right_cont ul li {flex:1; text-align:center;}
.sec02 .right_cont ul li img {}
.sec02 .right_cont ul li p {margin:11px 0 6px; font-size:15px; color:#000; font-weight:700;}
.sec02 .right_cont ul li span {word-break:keep-all; font-size:13px; color:#757575; line-height:17px;}

/* sec03 */
.sec03 {display:flex; gap:1%; margin:40px auto;}
.sec03 .cont_tit {color:#0071E3; margin-bottom:10px;}
.sec03 .prd01 {width:24%; background:#EFF6FF; border-radius:20px; padding:28px 20px 0; box-sizing:border-box;}
.sec03 .prd01 .prd_wrap {position:relative; padding:77px 0 0;}
.sec03 .prd01 .prd_wrap .inner {overflow:hidden; }
.sec03 .prd01 .prd_wrap .thumb {position:relative; display:block; width:62%; margin:0 auto;}
.sec03 .prd01 .prd_wrap .thumb img {width:100%; border-radius:20px;}
.sec03 .prd01 .swiper-button-prev {background: rgba(0, 0, 0, 0.2); border-radius:32px; width:32px; height:62px; margin-top: -31px; transition:all .3s ease; top:57%;}
.sec03 .prd01 .swiper-button-prev:after {content:''; display:inline-block; background:url(/design/khk31712/img/pc/swiper_left.png)no-repeat center; width:9px; height:17px; background-size:9px auto;}
.sec03 .prd01 .swiper-button-next {background: rgba(0, 0, 0, 0.2); border-radius:32px; width:32px; height:62px; margin-top: -31px; transition:all .3s ease; top:57%;}
.sec03 .prd01 .swiper-button-next:after {content:''; display:inline-block; background:url(/design/khk31712/img/pc/swiper_right.png)no-repeat center; width:9px; height:17px; background-size:9px auto;}
.sec03 .prd01 .swiper-button-prev:hover,
.sec03 .prd01 .swiper-button-next:hover {background: rgba(0, 0, 0, 0.5);}
.sec03 .prd01 .discount_percen {position:absolute; right:-32px; bottom:0; font-weight: 700; font-size: 35px; color: #fff; background:url(/design/khk31712/img/pc/dc_bg.png)no-repeat center; background-size: 106px 89px; width: 106px; height: 89px; display: flex; align-items: center; justify-content: center;}
.sec03 .prd01 .discount_percen:after {content:'%'; font-size:32px; color:#fff; display:inline-block;}
.sec03 .prd02 {width:33%; background:#F5F5F5; border-radius: 20px; padding: 20px 20px 20px; box-sizing: border-box;}
.sec03 .prd02 .prd_wrap {margin-top:20px;}
.sec03 .prd02 .prd_wrap .inner {padding:20px 20px; background:#fff; gap:11%; border-radius: 20px; box-sizing: border-box; display:flex; align-items:center; justify-content: center;}
.sec03 .prd02 .prd_wrap .inner li img {width:100%; border-radius: 20px;}
.sec03 .prd02 .prd_wrap .inner .left_prd {width:50%;}
.sec03 .prd02 .prd_wrap .inner .right_prd {width:30%;}
.sec03 .prd02 .prd_wrap .inner .right_prd li:first-child  {margin-bottom:20px;}
.sec03 .prd02 .discount_percen {background:#E7F1FF; display:inline-block; margin-left:5px; width:45px; line-height:24px; text-align:center; border-radius:4px; position: relative; top: -2px; font-weight:700; color:#0071E3; font-size:14px;}
.sec03 .prd03 {width:41%;}
.sec03 .prd03 .top_prd {background:#F5F5F5; border-radius: 20px; padding: 20px 20px 14px; box-sizing: border-box;}
.sec03 .prd03 .top_prd .prd_wrap {margin-top:20px;}
.sec03 .prd03 .top_prd .prd_wrap ul {display:flex; gap:5%; justify-content: center;}
.sec03 .prd03 .top_prd .prd_wrap ul li {flex:1; max-width:23%;}
.sec03 .prd03 .top_prd .prd_wrap ul li img {width:100%; border-radius: 20px;}
.sec03 .prd03 .bottom_prd {background:#F5F5F5; border-radius: 20px; padding: 15px 20px 13px; box-sizing: border-box; margin-top:16px; display:flex;}
.sec03 .prd03 .bottom_prd .left_txt {flex: 1;}
.sec03 .prd03 .bottom_prd .left_txt p {color:#191919; font-size:30px; font-family: 'GangwonEdu Power',sans-serif;}
.sec03 .prd03 .bottom_prd .left_txt p em {color:#0071E3; font-size:32px;}
.sec03 .prd03 .bottom_prd .left_txt span {font-size:16px; color:#191919; margin-top:12px; display:block;}
.sec03 .prd03 .bottom_prd .right_prd {width:48.4%;}
.sec03 .prd03 .bottom_prd .right_prd ul {display:flex; gap:5.2%;}
.sec03 .prd03 .bottom_prd .right_prd ul li {flex:1; }
.sec03 .prd03 .bottom_prd .right_prd ul li a {display:block; position:relative;}
.sec03 .prd03 .bottom_prd .right_prd ul li a .discount_percen {position:absolute; left:-38px; top:0; font-weight: 700; font-size: 28px; color: #fff; background:url(/design/khk31712/img/pc/dc_bg.png)no-repeat center; background-size: 85px 72px; width: 85px; height: 72px; display: flex; align-items: center; justify-content: center;}
.sec03 .prd03 .bottom_prd .right_prd ul li a .discount_percen:after {content: '%'; font-size: 26px; color: #fff; display: inline-block;}
.sec03 .prd03 .bottom_prd .right_prd ul li img {width:100%; border-radius: 20px;}

/* sec04 */
.sec04 {margin-bottom:40px; position:relative;}
.sec04 .prd_wrap {max-height:330px;}
.sec04 .prd_icon {display:none;}
.sec04.slideType .prd_wrap ul .prd_list.on {box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.08);}

/* sec05 */
.sec05 {margin-bottom:40px; position:relative;}
.sec05 .prd_wrap {max-height:353px;}
.sec05.slideType .prd_wrap ul .prd_list.on {box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.08);}

/* sec06 */
.sec06 {margin-bottom:40px; position:relative; padding:50px 0 45px; background: linear-gradient(90deg, #FFF8DC 0%, #FFEEA8 50%, #FFF8DC 100%);}
.sec06 .widthCont {position:relative;}
.sec06 .cont_tit {color:#0071E3;}
.sec06 .cont_tit img {margin-right:3px;}
.sec06 .prd_wrap {max-height:330px;}
.sec06 .prd_icon {display:none;}
.sec06.slideType .prd_wrap ul .prd_list.on {box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.08);}

/* sec07 */
.sec07 {margin-bottom:40px; position:relative;}
.sec07 .prd_wrap {max-height:330px;}
.sec07 .prd_icon {display:none;}
.sec07.prdCont .prd_wrap ul .prd_list {border:none; padding:0;}
.sec07.prdCont .prd_wrap ul .prd_list .thumb img {border-radius:20px;}
.sec07.slideType .swiper-button-prev {margin-top:-31px;}
.sec07.slideType .swiper-button-next {margin-top:-31px;}

/* sec08 */
.sec08 {margin-bottom:40px; position:relative;}
.sec08 .prd_wrap {max-height:330px;}
.sec08 .prd_icon {display:none;}
.sec08.prdCont .prd_wrap ul .prd_list {border:none; padding:0;}
.sec08.prdCont .prd_wrap ul .prd_list .thumb img {border-radius:20px;}
.sec08.slideType .swiper-button-prev {margin-top:-31px;}
.sec08.slideType .swiper-button-next {margin-top:-31px;}

/* sec09 */
.sec09 {margin-bottom:40px; position:relative;}
.sec09 .more {float: right; text-decoration: underline; font-size: 15px; font-weight: 400; margin-top: 10px;}
.sec09 .inner {overflow:hidden;}
.sec09 ul {padding:34px 0 16px; text-align:center;}
.sec09 ul li a {}
.sec09 ul li a img {}
.sec09 ul li a p {font-size:16px; margin-top:12px;}
.sec09 .swiper-button-prev {background: rgba(255, 255, 255, 1); border-radius:32px; width:32px; height:62px; transition:all .3s ease; border:1px solid #ebebeb; box-sizing: border-box; left:-16px; margin-top: -15px;}
.sec09 .swiper-button-prev:after {content:''; display:inline-block; background:url(/design/khk31712/img/pc/swiper_left2.png)no-repeat center; width:9px; height:17px; background-size:9px auto;}
.sec09 .swiper-button-next {background: rgba(255, 255, 255, 1); border-radius:32px; width:32px; height:62px; transition:all .3s ease; border:1px solid #ebebeb; box-sizing: border-box; right:-16px; margin-top: -15px;}
.sec09 .swiper-button-next:after {content:''; display:inline-block; background:url(/design/khk31712/img/pc/swiper_right2.png)no-repeat center; width:9px; height:17px; background-size:9px auto;}
.sec09 .swiper-button-prev:hover,
.sec09 .swiper-button-next:hover {background: rgba(0, 0, 0, 0.2);}

/* sec10 */
.sec10 {margin-bottom:40px; position:relative;}
.sec10.prdCont .prd_wrap ul .prd_list {border:none; padding:0; /*max-height:347.92px;*/ margin-bottom:40.5px;}
.sec10.prdCont .prd_wrap ul .prd_list.on {position:relative; z-index:1;}
.sec10.prdCont .prd_wrap ul .prd_list.on:after {content: ''; background: #fff; display: block; position: absolute; width: 100%; height: calc(100% + 40px); padding: 20px 20px 25px; border: 1px solid #ebebeb; left: -20px; top: -20px; border-radius: 20px; z-index: -1;}
.sec10.prdCont .prd_wrap ul .prd_list .thumb img {border-radius:20px;}
/* BASIC css end */

