@charset "utf-8";


/* =======================================================
	buycontroller
========================================================*/
.buycontroller-containter {}
.buycontroller-containter:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


/* 버튼 영역 */
.buycontroller-btn-group {
	position: fixed;
	left: 0; bottom: 0;
	z-index: 800;
	width: 100%; height: 50px;
	box-sizing: border-box;
}
.buycontroller-btn-group:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.buycontroller-btn {
	float: left;
	width: 50%; height: 50px;
	padding: 0 20px;
	padding-bottom: env(safe-area-inset-bottom);
	padding-bottom: constant(safe-area-inset-bottom);
	border: 0;
	border-radius: 0;
	box-sizing: border-box;
	font-size: 14px;
	line-height: 50px;
	color: #ececec;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	outline: none;
}
.buycontroller-btn.mc--btn-disabled,
.buycontroller-btn:disabled {
	-webkit-filter: grayscale(60%);
	-moz-filter: grayscale(60%);
	-ms-filter: grayscale(60%);
	-o-filter: grayscale(60%);
	filter: grayscale(60%);
	filter: gray;
}

.buycontroller-btn-soldout {
	float: none;
	display: block;
	width: 100%;
	background-color: #ccc;
}
.buycontroller-btn-member {
	float: none;
	display: block;
	width: 100%;
	background-color: #ccc;
}
.buycontroller-btn-cart {
	background-color: #4f4f4f;
}

.buycontroller-btn-buy {
	width: 100%;
}

.buycontroller-btn-cart + .buycontroller-btn-buy {
	width: 50%;
}

/* 옵션 영역 */
.buycontroller-layer {
	display: none;
	position: fixed;
	top: 0; left: 0;
	z-index: 1002;
	width: 100%; height: 100%;
	background: rgba(0, 0, 0, 0);
	-webkit-transition: background .4s;
	transition: background .4s;
}
.buycontroller-layer.show {
	display: block;
	background: rgba(0, 0, 0, 0.5);
}
.buycontroller-layer .buycontroller-btn-group {
	position: absolute;
	z-index: 10;
}
.buycontroller-layer.show .buycontroller-inner {
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	z-index: 10;
}

.buycontroller-inner {
	position: absolute;
	left: 0; bottom: 50px;
	z-index: 10;
	width: 100%;
	background-color: #fff;
	border: none;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
	box-sizing: border-box;
	-webkit-transform:translateY(150%);
	-ms-transform:translateY(150%);
	transform:translateY(150%);
	-webkit-transition:-webkit-transform .4s;
	transition:-webkit-transform .4s;
	transition:transform .4s,	-webkit-transform .4s;
	transition:transform .4s;
}
.buycontroller-inner.open-option {height: 276px; /*옵션나오는 영역과 높이값 일치 */}

.buycontroller-btn-close {
	position: absolute;
	left: 50%; bottom: 100%;
	width: 100px; height: 31px;
	margin-left: -50px;
	border: none;
	box-sizing: border-box;
	background-color: none;
	background-image: url("/AppData/images/mediacommerce/button/buycontroller.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	/*-webkit-transform: translateY(1px);
	transform: translateY(1px);*/
}

.buycontroller-bg {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	border: none;
	background-color: transparent;
	outline: none;
}


/* 옵션 선택 영역 */
.buycontroller-choice-area {
	max-height: 342px;
	-webkit-overflow-scrolling: touch;
	overflow: auto;
}

/* 구매 예정 상품 목록 */
.buycontroller-purchase-list {
	padding-bottom: 61px;
}
.buycontroller-purchase-list ul {
	background-color: #f9f9f9;
}
.buycontroller-purchase-list li {
	width: 100%;
	padding: 20px 20px;
	box-sizing: border-box;
}
.buycontroller-purchase-list li + li {
	border-top: 1px solid #e9eaee;
}


.buycontroller-purchase-title {
	margin-bottom: 10px;
	font-size: 14px;
	color: #444;
}

.buycontroller-quantity-wrapper {}
.buycontroller-quantity-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.buycontroller-quantity-wrapper .quantity-count {
	float: left;
}
.buycontroller-quantity-wrapper .buycontroller-quantity-util {
	float: right;
}
.buycontroller-quantity-util .price {
	float: left;
	font-size: 15px;
	color: #444;
	font-weight: 400;
	line-height: 28px;
}
.buycontroller-quantity-util .price span {
	font-size: 18px;
	font-weight: 700;
	line-height: 28px;
	vertical-align: bottom ;
}

.clear-purchase-item {
	float: left;
	width: 26px; height: 26px;
	margin-top: 1px;
	margin-left: 10px;
  border: 0;
  border-radius: 999px;
  box-sizing: border-box;
  background-color: #dfdfdf;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline: none;
}

.clear-purchase-item .icon-delete {
	display: block;
  width: 10px; height: 10px;
  margin: 0 auto;
  background-image: url("/AppData/images/mediacommerce/button/btn_delete.svg");
  background-size: 8px 8px;
  background-repeat: no-repeat;
  background-position: center;
}

/* 옵션 선택 후 나오는 옵션 리스트 영역 */
.buycontroller-option-area {
	display: none;
	position: absolute;
	left: 0; bottom: 0;
	width: 100%; height: 276px;
	background-color: #fff;
	box-sizing: border-box;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}
.buycontroller-option-area.show {display: block; }

.buycontroller-selectbox {
	position: relative;
	width: 100%;
	padding: 20px 20px;
	box-sizing: border-box;
	-ms-overflow-style: none; /* 스크롤바 숨기기 IE and Edge */
	scrollbar-width: none; /* 스크롤바 숨기기 Firefox */
}

.buycontroller-select {
	position: relative;
	z-index: 750;
	width: 100%; height: 42px;
	padding: 0 42px 0 10px;
	background-color: #fff;
	background-image: url("/AppData/images/mediacommerce/button/buycontroller_select.png");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 12px 8px;
	border: 1px solid #bbb;
	border-radius: 5px;
	box-sizing: border-box;
	text-align: left;
}
.buycontroller-select span {
	display: block;
	width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	line-height: 28px;
	color: #444;
}
.buycontroller-selectbox-option {
	position: absolute;
	left: 0; top: 56px;
	z-index: 700;
	width: 100%; height: 220px;
	overflow: scroll;
	padding: 0 20px;
	box-sizing: border-box;
	background-color: #fff;
}
.buycontroller-selectbox-option ul {
	padding-top: 5px;
	border: 1px solid #bbb;
	border-bottom: 0;
	border-radius: 5px;
}
.buycontroller-selectbox-option li {
	border-bottom: 1px solid #dfdfdf;
}
.buycontroller-option {
	width: 100%;
	padding: 15px 10px;
	background-color: #fff;
	border: none;
	box-sizing: border-box;
	font-size: 14px;
	color: #444;
	text-align: left;
}
.buycontroller-option:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.buycontroller-option p {
	float: left;
	width: 70%;
}
.buycontroller-option span {
	float: right;
	width: 30%;
	text-align: right;
	font-size: 13px;
	color: #666;
}
.buycontroller-option span em {
	font-style: normal;
}

.soldout .buycontroller-option,
.soldout .buycontroller-option span {color: #aaaaaa; }


/* 총 상품 금액 */
.buycontroller-total-wrapper {
	position: absolute;
	left: 0; bottom: 0;
	width: 100%; height: 61px;
	padding: 0 20px;
	border-top: 1px solid #e9eaee;
	background-color: #fff;
	box-sizing: border-box;
}
.buycontroller-total-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.buycontroller-total-text {
	float: left;
	font-size: 18px;
	color: #222;
	text-align: left;
	line-height: 60px;
}
.buycontroller-total-price {
	float: right;
	font-size: 18px;
	text-align: right;
	line-height: 60px;
}
.buycontroller-total-price span {
	font-size: 22px;
	font-weight: 700;
}






/* =======================================================
	share-container
========================================================*/
.share-container {
	position: fixed;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: 9998;
	display: none;
	background: rgba(28, 28, 28, 0.6);
}
.share-bg {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	border: none;
	background-color: transparent;
	outline: none;
}
.share-contents {
	position: absolute;
	left: 0; bottom: -100%;
	z-index: 9999;
	display: block;
	width: 100%;
	overflow: hidden;
	padding: 30px 20px 20px;
	padding-bottom: calc(env(safe-area-inset-bottom) + 20px);
  padding-bottom: calc(constant(safe-area-inset-bottom) + 20px);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  box-sizing: border-box;
  background-color: #fff;
}
.share-contents.active {
	bottom: 0;
}


.share-contents .title {
	margin-bottom: 30px;
	font-size: 18px;
	font-weight: 700;
	color: #222;
	text-align: center;
}

.share-contents ul:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.share-contents li {
	float: left;
	width: 20%;
	margin-bottom: 20px;
}
.share-contents .btn-sns {
	display: block;
	width: 100%;
}
.share-contents .btn-sns .icon-sns {
	display: block;
	width: 40px; height: 40px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	margin: 0 auto;
}
.share-contents li:nth-child(6) {
	clear: both;
}
.share-contents .btn-sns span {
	font-size: 12px;
	line-height: 1;
	color: #444;
	text-align: center;
}
.icon-copy {
	background-image: url("/AppData/images/mediacommerce/sns/copy.png");
}
.icon-katalk {
	background-image: url("/AppData/images/mediacommerce/sns/kakao.png");
}
.icon-twitter {
	background-image: url("/AppData/images/mediacommerce/sns/twitter.png");
}
.icon-blog {
	background-image: url("/AppData/images/mediacommerce/sns/blog.png");
}
.icon-facebook {
	background-image: url("/AppData/images/mediacommerce/sns/facebook.png");
}
.icon-insta {
	background-image: url("/AppData/images/mediacommerce/sns/instagram.png");
}
.icon-line {
	background-image: url("/AppData/images/mediacommerce/sns/line.png");
}
.icon-band {
	background-image: url("/AppData/images/mediacommerce/sns/band.png");
}
.icon-katory {
	background-image: url("/AppData/images/mediacommerce/sns/kakaostory.png");
}
.icon-sns-share {
	background-image: url("/AppData/images/mediacommerce/sns/share.png");
}



/* =======================================================
	mc--product
========================================================*/
.mc--product {}

.section-product {
	position: relative;
	width: 100%;
	margin-bottom: 20px;
	border-bottom: 1px solid #dadbdf;
	box-sizing: border-box;
	background-color: #fff;
}


/* 상품 슬라이더 */
.product-slider {
	visibility: hidden;
	position: relative;
}
.product-slider ul > li {width: 100%; height: 100vw; overflow: hidden; }
.product-slider ul > li img {
	display: block;
	width: 100%; height: 100%;
	margin: 0 auto;
}
.product-slider .bx-controls {
	position: absolute;
	bottom: 10px; left: 0;
	z-index: 50;
	display: block;
	width: 100%;
	text-align: center;
}
.product-slider .bx-pager {
	display: inline-block;
	min-width: 50px;
	margin: 0 auto;
	border-radius: 999px;
	background: rgba(34, 34, 34, .6);
	text-align: center;
	font-size: 12px;
	color: #fff;
	line-height: 24px;
	font-weight: 400;
}


/* 상품 정보 */
.product-topinfo {
	padding: 20px 20px;
	box-sizing: border-box;
}


/* 상품 타이틀 영역 */
.product-title-area {margin-bottom: 20px; }
.product-title-area .title {
	font-size: 16px;
	font-weight: 400;
	color: #222;
	line-height: 1.25;
}


/* 상품 판매정보  */
.product-selling-area {box-sizing: border-box; }
.product-selling-area:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.product-selling-area .sale {
	float: left;
	margin-right: 10px;
	font-size: 15px;
	font-weight: 500;
	font-style: normal;
	vertical-align: bottom;
}
.product-selling-area .sale strong {
	font-size: 30px;
	font-weight: 700;
}
.product-selling-area .price {
	float: left;
}
.product-selling-area .price em {
	font-size: 13px;
	color: #999;
	font-style: normal;
	text-decoration: line-through;
	line-height: 0.8;
}
.product-selling-area .price p {
	font-size: 18px;
	font-weight: 500;
	color: #444;
	line-height: 1;
}

.product-selling-area .btn-group {
	float: right;
}
.product-selling-area .btn-group .btn {
	height: 30px;
	border: none;
	border-radius: 999px;
	background-color: #eee;
	font-size: 12px;
	color: #444;
	line-height: 30px;
}
.product-selling-area .btn-group  .btn + .btn {
	margin-left: 10px;
}
.product-selling-area .btn-zzim {
	padding: 0;
	width: 30px;
}
.product-selling-area .btn-zzim .svg-icon-heart {
	display: block;
	width: 16px;
	height: 24px;
	margin: 0 auto;
}
/*.product-selling-area .btn-zzim .icon {
	background-color: #444;
	width: 30px; height: 30px;
	margin: 0 auto;
}
.product-selling-area .btn-zzim.active .icon {
  background-image: url("/AppData/images/mediacommerce/icon/icon_heart_full.svg");
}*/

.product-selling-area .btn-share {overflow: hidden; }
.product-selling-area .btn-share span,
.product-selling-area .btn-share .icon {
	float: left;
}
.product-selling-area .btn-share .icon {
	width: 14px; height: 30px;
	margin-left: 5px;
}


/* 쿠폰할인가 */
.product-coupon-area {
	box-sizing: border-box;
	margin-top: 10px;
}
.product-coupon-area p {
	font-size: 15px;
}
.product-coupon-area .price {
	display: inline-block;
	padding-left: 5px;
	font-weight: 500;
	font-size: 18px;
}

/* 할인 쿠폰 */
.product-btn-group {
	margin-top: 20px;
}
.product-btn-group .btn-coupon {
	width: 100%; height: 40px;
	background-color: #fff;
	border: 1px solid #bbb;
	font-size: 14px;
	color: #666;
	overflow: hidden;
}
.section-product .btn-coupon span {
	float: left;
}
.section-product .btn-coupon .icon {
	float: right;
	width: 14px; height: 38px;
}


/* product-info */
.product-info {
	position: relative;
	width: 100%;
	padding: 20px 20px;
	border-top: 1px solid #f2f2f2;
	box-sizing: border-box;
}
.product-info .dl-info02 dt {
	width: 64px;
	font-size: 12px;
}
.product-info .dl-info02 dd {
	width: calc(100% - 64px);
	font-size: 14px;
	color: #444;
}




/* =======================================================
	mc--prodia
========================================================*/
.mc--prodia {}


.section-prodia {
	position: relative;
	width: 100%;
	margin-bottom: 10px;
	border-bottom: 1px solid #dadbdf;
	box-sizing: border-box;
	background-color: #fff;
	transition: all ease .3s;
}

.section-prodia:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


/* 영상 */
.prodia-video {
	position: relative;
	height: 0;
	padding-bottom: 56.25%;
}
.prodia-video iframe {
	position: absolute;
	width: 100%;
	height: 100%;
}
#player-full { position: absolute; width: 80px; height: 35px; bottom: 0; right: 0; z-index: 4;  }
#player-screen { position: absolute; width: 100%; height: 100%; z-index: 3; background-color: rgba(34, 34, 34, 0.85); top: 0; }
#player-screen .play-btn { width: 65px; height: 65px; background: rgba(34, 34, 34, 0.6) url(../../images/mediacommerce/button/video_play.png) no-repeat center right 18px; border: 2px solid #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-size: 20px auto;  border-radius:999px; opacity: 0.8;}
#player-screen .play-btn:hover {	background-color: rgba(34, 34, 34, 0.9);
	opacity: 1; }
#player-button { height : calc(100% - 48px) }
#player-button:hover button:hover{
	background-color: rgba(34, 34, 34, 0.8);
	opacity: 1;
}
.prodia-fixed .pop-full-btn{display: none;}


/* 영상 아코디언 */
.prodia-accordion {
	display: block;
	position: relative;
	margin: 0;
}
/* 영상 타이틀 */
.prodia-title-area {
	position: relative;
	width: 100%;
	padding: 15px 50px 15px 20px;
	background-color: #fff;
	background-image: url("/AppData/images/mediacommerce/button/accordion_down.svg");
  background-repeat: no-repeat;
  background-position: right 20px top 20px;
  background-size: 14px 8px;
  box-sizing: border-box;
}
.prodia-title-area.active {
  background-image: url("/AppData/images/mediacommerce/button/accordion_up.svg");
}
.prodia-title-area .title {
	font-size: 14px;
	font-weight: 400;
	color: #444;
	line-height: 1.3;
	text-align: left;
}


/* 영상 정보 */
.prodia-contents {
	display: none;
	position: relative;
	width: 100%;
	padding: 20px 20px;
	border-top: 1px solid #e9eaee;
	box-sizing: border-box;
	background-color: #f7f7f7;
}
.prodia-contents.active {
	display: block;
	border-top: 1px solid #f2f2f2;
}
.prodia-contents .prebox {
	color: #666;
}
.prodia-contents .prodia-hash-group {
	margin-top: 20px;
	padding-top: 10px;
	border-top: 1px solid #e9eaee;
}
.hashtag {
	margin-left: 3px;
	font-size: 12px;
	font-weight: 400;
	color: #999;
}
.hashtag:first-child {
	margin-left: 0;
}
.hashtag:before {
	content: "\0023";
}

/* 영상 유틸 버튼 그룹 */
.prodia-player-wrapper {display: none; }

.prodia-pager {
	position: relative;
	width: 100%;
	padding: 5px 20px;
	border-bottom: 1px solid #e9eaee;
	box-sizing: border-box;
	background-color: #fff;
}
.prodia-pager .swiper-container {width: 68%; margin: 0 0; }
.prodia-pager-item {
	width: 45px; height: 45px;
	overflow: hidden;
	border: 1px solid #f2f2f2;
	border-radius: 5px;
	box-sizing: border-box;
}
.prodia-pager-item.current {
	border-width: 2px;
	border-style: solid;
}
.prodia-pager-item img {
	display: block;
	margin: 0;
	width: 100%; height: 100%;
}




/*
	스크롤시 고정
---------------------------------------------------*/
.section-prodia.prodia-fixed  {
	position: fixed;
	top: 0; left: 0;
	z-index: 900;
	width: 100%; height: auto;
	margin-bottom: 0;
	border-bottom: 0;
	box-sizing: border-box;
	background-color: transparent;
}
.prodia-fixed .prodia-container {
	width: 100%;
	box-sizing: border-box;
	background: rgba(34, 34, 34, 0.85);
}
.prodia-fixed .prodia-container:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

/* 영상 */
.prodia-fixed .prodia-video {
	position: relative;
	width: 188px; height: 105px;
	float: left;
	padding: 0;
}
.prodia-fixed .prodia-video iframe {
	position: absolute;
	width: 100%; height: 100%;
	top: 0; left: 0;
}
.prodia-fixed #player-screen .play-btn { width: 50px;  height: 50px; background-position: center right 13px; background-size: 16px auto; }
.prodia-fixed #player-button { height: 100%; }
.prodia-fixed #player-button:hover button._btnPlayer {  width: 50px; height: 50px; margin-top: 0;  background-size: 12px auto;  }

.prodia-fixed #player-full { display: none!important; }

/* 영상 아코디언 */
.prodia-fixed .prodia-accordion {
	float: right;
	width: calc(100% - 188px);
	position: relative;
	margin: 0;
	border-bottom: 0;
}

/* 영상 타이틀 */
.prodia-fixed .prodia-title-area {
	padding: 10px 15px;
	background: none;
	border-bottom: 1px solid #444;
}
.prodia-fixed .prodia-title-area.active {
  background: none;
}
.prodia-fixed .prodia-title-area .title {
	display: block;
	height: 43px;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 14px;
	font-weight: 400;
	color: #fff;
	line-height: 21px;
	text-align: left;
	white-space: normal;
	word-wrap: break-word;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.prodia-fixed .prodia-title-area .count {
	display: none;
}


/* 영상 정보 */
.prodia-fixed .prodia-contents {
	display: none;
}
.prodia-fixed .prodia-contents.active {
	display: none;
	border-top: 0;
}



/* play 아이콘 */
.player-pause {
	width: 15px; height: 15px;
  background-image: url("/AppData/images/mediacommerce/icon/player_pause.svg");
  background-size: 15px 15px;
  background-repeat: no-repeat;
  background-position: left center;
}
.player-play {
	width: 15px; height: 15px;
  background-image: url("/AppData/images/mediacommerce/icon/player_play.svg");
  background-size: 15px 15px;
  background-repeat: no-repeat;
  background-position: left center;
}
.player-top {
	width: 15px; height: 15px;
  background-image: url("/AppData/images/mediacommerce/icon/player_top.svg");
  background-size: 15px 15px;
  background-repeat: no-repeat;
  background-position: center center;
}
.player-close {
	width: 15px; height: 15px;
  background-image: url("/AppData/images/mediacommerce/icon/player_close.svg");
  background-size: 15px 15px;
  background-repeat: no-repeat;
  background-position: right center;
}



/* 영상 유틸 버튼 그룹 */
.prodia-fixed .prodia-player-wrapper {
	display: block;
	float: right;
	width: calc(100% - 188px); height: 42px;
	padding: 0 15px;
	box-sizing: border-box;
}
.prodia-player-wrapper ul {
	float: none;
	display: table;
	width: 100%;
	margin: 0 auto;
}
.prodia-player-wrapper ul li {
	display: table-cell;
	width: 1%;
	text-align: center;
	vertical-align: middle ;
	color: #fff;
}
.prodia-player-wrapper .btn {
	display: inline-block;
	width: 40px; height: 42px;
	padding: 0;
	background: none;
	border: none;
}
.prodia-player-wrapper .btn .icon {
	display: inline-block;
	margin-top: 0;
	margin-left: 0;
}
.prodia-fixed .prodia-pager {
	position: fixed;
	top: 105px;
	left: 0;
	padding: 5px 20px;
	background-color: #444;
	border-bottom: 0;
}
.prodia-fixed .prodia-pager-item {
	width: 40px; height: 40px;
}


/* 연관영상 */
.section-connect {
	position: relative;
	width: 100%;
	margin-bottom: 10px;
	border-bottom: 1px solid #dadbdf;
	box-sizing: border-box;
	background-color: #fff;
	transition: all ease .3s;
}
.section-connect .inner {
	position: relative;
	padding: 15px 20px;
	box-sizing: border-box;
}
.section-connect .title {
	margin-bottom: 10px;
	font-size: 14px; font-weight: 500;
	color: #222;
}
.connect-item {
	position: relative;
	width: 120px;
}

.connect-item a {
	position: absolute;
	display: block;
	width: 100%; height: 100%;
	border-radius: 5px;
	overflow: hidden;
	box-sizing: border-box;
	z-index: 10;
}

.connect-thumb {
	position: relative;
	border-radius: 5px;
	overflow: hidden;
}
.connect-item img {display: block; width: 100%; }
.connect-info {
	padding: 5px;
	overflow: hidden;
	box-sizing: border-box;
}
.connect-info .connect-title.text-ellipsis02 {
	height: 2.8em;
	font-size: 13px; color: #222; line-height: 1.4;
}

.swiper-connect-container {padding-bottom: 20px; }





/* =======================================================
	mc--edu
========================================================*/
.mc--edu {}


.section-edudia {
	position: relative;
	width: 100%;
	margin-bottom: 10px;
	border-bottom: 1px solid #dadbdf;
	box-sizing: border-box;
	background-color: #fff;
	transition: all ease .3s;
}
.section-edudia:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


/* 영상 */
.edudia-video {
	position: relative;
	height: 0;
	padding-bottom: 56.25%;
}
.edudia-video iframe {
	position: absolute;
	width: 100%; height: 100%;
}


/* 영상 pager */
.edudia-pager {
	width: 100%;
	padding: 5px 20px;
	border-bottom: 1px solid #e9eaee;
	box-sizing: border-box;
	background-color: #fff;
}
.edudia-pager-item {
	width: 45px; height: 45px;
	overflow: hidden;
	border: 1px solid #f2f2f2;
	border-radius: 5px;
	box-sizing: border-box;
}
.edudia-pager-item.current {
	border-width: 2px;
	border-style: solid;
}
.edudia-pager-item img {
	display: block;
	margin: 0;
	width: 100%; height: 100%;
}



/* play wrapper */
.edudia-player-wrapper {
	display: none;
	float: right;
	width: calc(100% - 188px); height: 49px;
	padding: 0 15px;
	box-sizing: border-box;
}

.edudia-player-wrapper ul {
	float: none;
	display: table;
	width: 100%;
	margin: 0 auto;
}
.edudia-player-wrapper ul li {
	display: table-cell;
	width: 1%;
	text-align: center;
	vertical-align: middle;
	color: #fff;
}
.edudia-player-wrapper .btn {
	display: inline-block;
	width: 40px; height: 49px;
	padding: 0;
	background: none;
	border: none;
}
.edudia-player-wrapper .icon {
	display: inline-block;
}


/* 재생시 스크롤할 경우
---------------------------------------------------*/
.section-edudia.fixed {
	position: fixed;
	top: 0; left: 0;
	z-index: 900;
	width: 100%; height: auto;
	margin-bottom: 0;
	border-bottom: 0;
	box-sizing: border-box;
	background-color: transparent;
}

.section-edudia.fixed .edudia-container {
	width: 100%;
	box-sizing: border-box;
	background: rgba(34, 34, 34, 0.85);
}
.section-edudia.fixed .edudia-container:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.section-edudia.fixed .edudia-video {
	position: relative;
	width: 188px; height: 105px;
	float: left;
	padding: 0;
}
.section-edudia.fixed .edudia-video iframe {
	position: absolute;
	width: 100%; height: 100%;
	top: 0; left: 0;
}

.section-edudia.fixed .edudia-player-wrapper {
	display: block;
}



/* 학습진행상태
---------------------------------------------------*/
.prodia-duration {width: 100%; margin-bottom: 10px; padding: 20px 20px; background-color: #fff; box-sizing: border-box; border-bottom: 1px solid #dadbdf; }

.prodia-duration .duration-header { }
.prodia-duration .duration-header:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.duration-header .duration-toggle {float: left; padding-top: 5px; }
.duration-header .duration-toggle span {display: inline-block; padding-right: 20px; background-image: url("/AppData/images/mediacommerce/button/btn_arrow_close.png"); background-repeat: no-repeat; background-position: right center; background-size: 16px auto; font-size: 15px; font-weight: 500; line-height: 1.25; }
.duration-header .duration-toggle.active span{background-image: url("/AppData/images/mediacommerce/button/btn_arrow_open.png");}
/* 파일다운로드 버튼 */
.duration-header .btn-prodiadown {float: right; padding: 8px 10px; border: 1px solid #eaeaea; border-radius: 5px; font-size: 12px; }

.duration-guide {margin: 10px 0 20px; }
.duration-guide p {font-size: 12px; font-weight: 400; font-style: normal; color: #888; }
.duration-guide p + p {margin-top:  5px; }

.duration-content {margin-top: 20px; }

.prodia-duration .edu-progress {margin-top: 10px; }
.prodia-duration .edu-progress:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.prodia-duration .edu-progress-current {width: 18%; float: left; }
.prodia-duration .edu-progress-bar {position: relative; width: 45%; float: left; border-radius: 999px; box-sizing: border-box; overflow: hidden; }
/*.edu-progress-bar .progressbar-completion {position: absolute; top: 0; left: 0; display: block; width: 3px; height: 100%; background-color: #222; }*/
.prodia-duration .outer-therm {margin: 0 auto; }
.prodia-duration .edu-progress-duration {width: 37%; float: right; }
.prodia-duration .edu-progress-duration .left {margin-left: 10px;}
/*.//2021-04-22 mine 항상 보여야해서 수정
prodia-fixed .prodia-duration {display: none; }*/





/* =======================================================
	deal-nav
========================================================*/
.deal-nav {
	position: relative;
}
.deal-nav ul {
	display: table;
  margin: 0 auto;
  background-color: #fff;
  border-bottom: 1px solid #dadbdf;
}
.deal-nav ul li {
  position: relative;
  display: table-cell;
  width: 1%; height: 55px;
  line-height: 55px;
  text-align: center;
  vertical-align: middle;
}
.deal-menu {
	display: block;
	width: 100%;
	margin: 0 auto;
	font-size: 14px;
	line-height: 55px;
	color: #222;
	box-sizing: border-box;
}
.deal-nav .active {
	position: absolute;
	display: none;
	left: 0; bottom: -1px;
	width: 100%; height: 3px;
}
.deal-nav .current .active {
	display: block;
}
.deal-nav ul.fixed {
	position: fixed;
  left: 0; top: 0;
  z-index: 300;
}
.deal-nav ul.fixed li {
  width: 1%; height: 40px;
}
.deal-menu {
	line-height: 55px;
	font-size: 13px;
}


.section-deal {}
.section-deal:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.deal-container {
	position: relative;
	width: 100%;
	padding: 0 0 20px;
	margin-bottom: 20px;
	background-color: #fff;
	border-bottom: 1px solid #dadbdf;
	box-sizing: border-box;
}
.deal-container:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


.deal-more{
	position: relative;
	width: 100%;
	padding: 20px 20px 0;
	background-color: #fff;
	box-sizing: border-box;
}



/* =======================================================
	상품정보
========================================================*/
.deal-container.detail {
	min-height: calc(100vh - 390px);
	overflow: hidden;
	padding: 10px 10px;
}
.deal-container.detail.cut {
	max-height: 1200px;
	overflow: hidden;
}


.deal-container.detail .deal-more {
	display: none;
	position: absolute;
	left: 0; bottom: 0;
	z-index: 1;
	width: 100%;
	padding: 20px 20px;
	background-color: #fff;
	box-sizing: border-box;
}
.deal-container.detail.cut .deal-more {
	display: block;
}

.deal-container.detail img {
	display: block;
	margin: 0 auto;
	padding: 0;
	max-width: 100%;
	height: auto;
}

.deal-info .nodata {padding: 100px 0; text-align: center; color: #888; }



/* =======================================================
	구매정보
========================================================*/
.deal-container.info {
	padding: 0;
	background-color: transparent;
	border-bottom: 0;
}

.deal-container.info .accordion-wrapper {
	border-bottom: 1px solid #dadbdf;
}
.deal-container.info .accordion-wrapper + .accordion-wrapper {margin-top: 5px; }
.deal-container.info .accordion-contents p {
	font-size: 14px;
	color: #444;
}





/* =======================================================
	구매후기
========================================================*/
.deal-container.review {}


/* 별점 */
.deal-container.review .total-rating-wrapper {
	width: 100%;
	padding: 40px 20px;
	box-sizing: border-box;
	text-align: center;
}
.deal-container.review .total-rating-wrapper .title {
	font-size: 13px;
	color: #444;
	font-weight: 400;
}
.deal-container.review .total-rating strong {
	font-size: 40px;
	color: #222;
	font-weight: 700;
}


/* 포토리뷰 */
.deal-photoreview-container {
	padding: 20px 0;
	background-color: #f7f7f7;
	border-top: 1px solid #f2f2f2;
	box-sizing: border-box;
}
.deal-photoreview-container .title {
	display: block;
	margin-bottom: 15px;
	padding: 0 20px;
	box-sizing: border-box;
	font-size: 16px;
	color: #222;
	font-weight: 400;
}
.deal-photoreview-list {
	padding: 0 15px;
	box-sizing: border-box;
}
.deal-photoreview-list:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.deal-photoreview-list li {
	float: left;
	width: 25%;
	padding: 0 5px;
	box-sizing: border-box;
}
.deal-photoreview-list li.nodata {
	float: none;
	width: 100%;
	padding: 20px 20px;
	box-sizing: border-box;
	text-align: center;
	font-size: 14px;
	color: #888;
}
.photoreview-btn {
	position: relative;
	display: block;
	width: calc((100vw - 70px)/4);
	height: calc((100vw - 70px)/4);
	border: 1px solid #e9eaee ;
	background-color: #fafafa;
	border-radius: 5px;
	box-sizing: border-box;
	overflow: hidden;
}
.photoreview-btn img {
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	border: 0;
}
.photoreview-btn .icon-photo {
	position: absolute;
	right: 5px; bottom: 5px;
	z-index: 5;
	display: block;
	width: 18px; height: 18px;
	background-color: transparent;
	background-image: url("/AppData/images/mediacommerce/icon/icon_photo.png");
	background-repeat: no-repeat;
	background-position: center;
}


.photoreview-btn.photoreview-more {}
.photoreview-btn.photoreview-more .more-bg {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: 10;
	width: 100%; height: 100%;
	display: block;
	opacity: 0.5;
}
.photoreview-btn.photoreview-more .more-text {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	width: 100%;
	margin-top: 30px;
	z-index: 20;
	color: #fff;
}
.photoreview-btn.photoreview-more .icon-plus {
	display: block;
	width: 9px; height: 9px;
	margin: 0 auto;
  background-image: url("/AppData/images/mediacommerce/icon/icon_plus.svg");
  background-size: 10px 10px;
  background-repeat: no-repeat;
  background-position: center;
}
.photoreview-btn.photoreview-more .more-text em {
	display: block;
	font-style: normal;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
}


/* 리뷰 리스트 */
.deal-review-list {
	border-top: 1px solid #f2f2f2;
}
.deal-review-list .nodata {
	padding: 100px 20px;
	box-sizing: border-box;
	font-size: 14px;
	color: #888;
	text-align: center;
}
.deal-review-list .review-info {}
.deal-review-list .review-info:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.deal-review-list .review-info .rating-wrapper {
	float: left;
	margin-bottom: 15px;
}
.deal-review-list .review-info .rating-wrapper span {
  width: 15px; height: 15px;
}
.deal-review-list .option {
	margin-bottom: 10px;
	font-size: 12px;
	color: #888;
}
.deal-review-list .review-info .user-id {
	float: left;
	position: relative;
	margin: 0 10px;
	padding-right: 11px;
	font-size: 14px;
	color: #444;
	line-height: 14px;
}
.deal-review-list .review-info .user-id:after {
	content: "";
	position: absolute;
	right: 0;
	display: inline-block;
	width: 1px; height: 14px;
	margin-left: 10px;
	background: #bbb;
	line-height: 14px;
}
.deal-review-list .review-info .date {
	float: left;
	font-size: 12px;
	line-height: 14px;
	color: #888;
}
.deal-review-list .accordion-contents {
	padding: 20px 0;
	box-sizing: border-box;
}
.deal-review-list .prebox {
	padding: 0 20px;
	box-sizing: border-box;
	font-size: 14px;
	color: #666;
}

.deal-review-list .deal-photoreview-list {
	box-sizing: border-box;
	padding: 0 20px;
}
.deal-review-list .deal-photoreview-list li {
	margin-top: 20px;
	width: calc((100vw - 60px)/3);
	height: calc((100vw - 60px)/3);
	padding: 0;
}
.deal-review-list .deal-photoreview-list li + li {
	margin-left: 10px;
}
.deal-review-list .deal-photoreview-list .photoreview-btn {
	width: calc((100vw - 60px)/3);
	height: calc((100vw - 60px)/3);
}





/* =======================================================
	구매문의
========================================================*/
.deal-container.qna .deal-header {
	padding: 20px 20px;
	box-sizing: border-box;
	border-bottom: 1px solid #f2f2f2;
}

.deal-container.qna .deal-header .title {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: 500;
}
.deal-container.qna .deal-header p {
	margin-bottom: 20px;
	font-size: 13px;
	color: #888;
}


/* 비밀글 */
.deal-container.qna .board-lock-wrapper .input-btn-group {
	margin: 20px 0 10px;
}
.deal-container.qna .board-lock-wrapper .input-text {margin: 0; }


/* 질문 정보 */
.deal-container.qna .deal-qna-list {}
.deal-container.qna .nodata {
	padding: 100px 20px;
	box-sizing: border-box;
	font-size: 14px;
	color: #888;
	text-align: center;
}
.deal-container.qna .accordion-wrapper:last-of-type {
	border-bottom: 1px solid #e9eaee;
}
.deal-container.qna .board-util {margin-bottom: 10px; }
.deal-container.qna .board-util:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.deal-container.qna .board-state {float: left; }

.deal-container.qna .board-writer {
	float: left;
	position: relative;
	margin: 0 10px;
	padding-right: 11px;
	font-size: 14px;
	color: #444;
	line-height: 20px;
}

.deal-container.qna .board-writer:after {
	content: "";
	position: absolute;
	right: 0; top: 3px;
	display: inline-block;
	width: 1px; height: 14px;
	background-color: #bbb;
	line-height: 20px;
}
.deal-container.qna .board-date {
	float: left;
	font-size: 12px;
	line-height: 20px;
	color: #888;
}


/* 질문&답변 */
.deal-container.qna .qna-wrapper {
	box-sizing: border-box;
}
.deal-container.qna .qna-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.deal-container.qna .qna-wrapper .icon {
	float: left;
	margin-top: 5px;
}
.deal-container.qna .qna-wrapper .qna-question,
.deal-container.qna .qna-wrapper .qna-answer {
	float: left;
	width: calc(100% - 25px);
	margin-left: 15px;
}
.deal-container.qna .qna-wrapper .prebox {
	font-size: 14px;
	color: #666;
}

/* 첨부파일 */
.deal-container.qna .attachment-list {margin-left: -15px; }
.deal-container.qna .attachment-list li {
	width: 100px;	height: 100px;
}
.deal-container.qna .attachment-list li + li {
	margin-left: 5px;
}
.deal-container.qna .attachment-btn {
	width: 100px; height: 100px;
}

.deal-container.qna .qna-wrapper.answer {
	padding-top: 20px;
	margin-top: 20px;
	border-top: 1px solid #e9eaee;
}





/* =======================================================
	설문조사
========================================================*/
.deal-container.survey {padding: 20px 20px 30px; }

.deal-container.survey input[type="radio"] + label:before,
.deal-container.survey input[type="checkbox"] + label::before {margin-top: 2px; vertical-align: top; }
.deal-container.survey input[type="radio"]:checked + label:after {top: 7px; }
.deal-container.survey label {width: 100%; }
.deal-container.survey .radiobox span,
.deal-container.survey .checkbox span {display: inline-block; width: calc(100% - 30px);}

.deal-container.survey .deal-header .title {margin-bottom: 15px; font-size: 18px;   font-weight: 500; }
.deal-container.survey .deal-header strong {font-size: 16px; font-weight: 500; }
.deal-container.survey .deal-header .deal-guide {margin-bottom: 20px; font-size: 13px; }
.deal-container.survey .deal-header .survey-login {margin-top: 20px; padding: 40px 0; border-top: 1px solid #f0f0f0; }
.deal-container.survey .deal-header .survey-login p {margin-bottom: 10px; text-align: center; font-size: 14px; }

.deal-survey-container {margin-top: 30px; }
.deal-survey-container .item-survey {margin-bottom: 40px; }
.deal-survey-container .survey-title {display: block; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 2px solid #eee; font-weight: 500; }
.deal-survey-container .survey-list li + li {margin-top: 15px; }
.deal-survey-container .textarea {height: 100px; }
.deal-survey-container .text-guide + .btn {margin-top: 5px; }






/* =======================================================
	판매자
========================================================*/
.mc--seller .seller-header {
	padding: 40px 20px;
}
.mc--seller .shop-img {
	display: block;
  margin: 0 auto 20px;
  max-width: 80%;
}
.mc--seller .shop-title {
	display: block;
	font-size: 22px;
	color: #222;
	font-weight: 500;
	text-align: center;
}
.mc--seller .shop-tel {
	margin-top: 20px;
	font-size: 15px;
	color: #444;
	text-decoration: underline;
}
.mc--seller .seller-container {
	padding: 20px 20px;
	box-sizing: border-box;
}


/* =======================================================
* Device = 태블릿, 아이패드(세로), PC
* Screen = 768 이상
* ========================================================*/

@media all and (min-width: 690px) {

/* =======================================================
	detail
========================================================*/
.product-slider ul > li {
	width: 100%;
	height: 690px;
	overflow: hidden;
}

.section-prodia {
	transition: none;
}

.section-prodia.prodia-fixed {
	width: 690px;
	left: 50%;
	margin: 0 auto;
	transform: translateX(-50%);
}

/* product detail - 포토후기
---------------------------------------------------*/
	.photoreview-btn {
		width: 100%; height: 100%;
	}

	.photoreview-btn.photoreview-more .more-text {
		top: 50%;
		margin-top: 0;
	}

	.deal-review-list .deal-photoreview-list li {
		width: 25%; height: 100%;
	}

	.deal-review-list .deal-photoreview-list .photoreview-btn {
		width: 100%; height: 100%;
	}

	/*
	 buycontroller
--------------------------------------------------- */
	.buycontroller-selectbox-option::-webkit-scrollbar {
		display: none; /* 스크롤바 안보이게 처리*/
	}

	.buycontroller-btn-group {
		left: 50%;
		width: 690px;
		margin: 0 auto;
		transform: translateX(-50%);
	}

	.buycontroller-layer.show .buycontroller-inner {
		width: 690px;
		left: 50%;
		transform: translateX(-50%);
	}


/*
	deal-nav
--------------------------------------------------- */
	.deal-nav ul.fixed {
		left: 50%;
		width: 690px;
		transform: translateX(-50%);
	}


/*
	share-contents
--------------------------------------------------- */
	.share-contents {
		left: 50%;
		width: 690px;
		margin: 0 auto;
		transform: translateX(-50%);
	}



/*
	detail - 교육문의
--------------------------------------------------- */
.deal-container.qna .qna-wrapper .icon {margin-left: 0; }
.deal-container.qna .board-lock .icon-lock {width: 10px; height: 15px; margin: 0 15px 0 0; }





/* =======================================================
	mc--list
========================================================*/

/*
	list viewstyle01
---------------------------------------------------*/
	.product-list .product-item {
		margin-top: 30px;
	}
	.product-item-thumb {
		width: 650px; height: 650px;
	}
	.product-item-thumb .matching-tag {
		top: 20px;
		padding: 5px 20px;
	}



/*
	list viewstyle02
---------------------------------------------------*/
	.product-list.viewstyle02 .product-item {
		width: 206px;
		margin-top: 30px;
	}
	.product-list.viewstyle02 .product-item:first-child,
	.product-list.viewstyle02 .product-item:nth-child(2),
	.product-list.viewstyle02 .product-item:nth-child(3) {margin-top: 0; }

	.product-list.viewstyle02 .product-item:nth-child(2n) {
		float: left;
	}
	.product-list.viewstyle02 .product-item + .product-item {
		margin-left: 16px;
	}
	.product-list.viewstyle02 .product-item:nth-child(3n + 1) {
		margin-left: 0;
	}
	.product-list.viewstyle02 .product-item-thumb {
		width: 206px; height: 206px;
	}



/*
	list viewstyle03
--------------------------------------------------- */
	.product-list.viewstyle03 .product-item {
		margin-top: 30px;
	}
	.product-list.viewstyle03 .product-item-thumb {
		float: left;
		position: relative;
		display: block;
		width: 200px;	height: 200px;
	}
	.product-list.viewstyle03 .product-item-thumb .matching-tag {
		top: 20px;
		padding: 3px 10px;
	}
	.product-list.viewstyle03 .product-item-info {
		width: calc(100% - 200px);
	}



} 

@media(max-width:500px){
	#player-screen .play-btn { width: 55px; height: 55px; background-size: 16px auto; background-position: center right 15px;  }

	#player-button:hover button { width: 55px; height: 55px; background-size: 13px auto; }
	.pop-full-btn{display: none !important;}

}
/* 반응형 끝 */






/* =======================================================
	영상 전체보기
========================================================*/
#player-button .pop-full-btn {
	position: absolute;
	bottom: 20px;
	/*right: 20px;*/
	/*right: calc(50% - 45px);*/
	right: calc(50% - 17px);
	/*color: #fff;
	font-size: 13px;
	border-radius: 8px;
	border: 2px solid #fff;
	background: rgba(34, 34, 34, 0.6);
	box-sizing: border-box;
	text-align: center;
	*/
	width: 34px;
	height: 34px;
	background: rgba(34, 34, 34, 0.6) url(/AppData/images/common/fullscreen.svg) no-repeat center;
}

#player-screen .pop-full-btn {
	position: absolute;
	bottom: 68px;
	/*right: 20px;*/
	/*right: calc(50% - 45px);*/
	right: calc(50% - 17px);
	/*color: #fff;
	font-size: 13px;
	border-radius: 8px;
	border: 2px solid #fff;
	background: rgba(34, 34, 34, 0.6);
	text-align: center;
	box-sizing: border-box;*/
	width: 34px;
	height: 34px;
	background: rgba(34, 34, 34, 0.6) url(/AppData/images/common/fullscreen.svg) no-repeat center;
}

#player-screen{z-index:10;}

#player-screen .play-btn {
  width: 70px;
  height: 48px;
  background: rgba(34, 34, 34, 0.6) url(../../images/mediacommerce/button/video_play.png) no-repeat center right 18px;
  border: 2px solid #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-size: 20px auto;
  border-radius: 8px;
  opacity: 0.8;
  background-position: center;
}
	
#player-button:hover button._btnPlayer{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
	width: 70px;
	height: 48px;
	box-sizing: border-box;
	background: rgba(34, 34, 34, 0.6) url(../../images/mediacommerce/button/video_pause.png) no-repeat center;
	background-size: 14px auto;
	border: 2px solid #fff;
	opacity: 0.8;
	border-radius: 8px;
	margin-top: 24px;
}


.header-inner.full{width:100%;}
.prodia-video.full{position:fixed; top:0; left:0; width:100%; height:100%; padding-bottom:0; z-index:100;}

.full-close{display:none;}
.full-close.full{display:block;}


@media(max-width:1024px){
	#btnFullSize{display:none !important;}
}