.detail_wrap { display: flex; flex-wrap: nowrap; background-color: #fff; padding: 30px; border-radius: 10px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); }

.list_box ul {background-color: #fff; padding: 30px; border-radius: 10px; }
.list_box ul li:nth-last-child(-n+4) { margin-bottom: 0;}

/* -------------------------left_box */
.detail_wrap .detail_left {  width:67%; padding-right: 50px; }

/* 이미지영역 */
.detail_wrap .detail_left .image_box { position:relative; margin-bottom: 50px; }
.detail_wrap .detail_left .image_box .image_thumbs1_btn { position:absolute; top:0; left:0; width:66px; height: 100%;  }
.detail_wrap .detail_left .image_box .image_thumbs1_btn .swiper-wrapper { height: 100%;  }
.detail_wrap .detail_left .image_box .image_thumbs1_btn .swiper-slide {  position: relative;  }
.detail_wrap .detail_left .image_box .image_thumbs1_btn .swiper-slide a { display: block;  position: relative; opacity: 0.2;   overflow: hidden; border-radius: 5px;  }
.detail_wrap .detail_left .image_box .image_thumbs1_btn .swiper-slide a img { }
.detail_wrap .detail_left .image_box .image_thumbs1_btn .swiper-slide:hover a { opacity:0.6; }
.detail_wrap .detail_left .image_box .image_thumbs1_btn .swiper-slide-thumb-active:hover a,
.detail_wrap .detail_left .image_box .image_thumbs1_btn .swiper-slide-thumb-active a { opacity:1; border:1px solid #c4c4c4; }

.detail_wrap .detail_left .image_box .image_thumbs1 { margin-left: 86px; position:relative; }
.detail_wrap .detail_left .image_box .image_thumbs1 .swiper-wrapper {  align-items: center;  } 
.detail_wrap .detail_left .image_box .image_thumbs1 .swiper-wrapper .swiper-slide { opacity:0!important;   }
.detail_wrap .detail_left .image_box .image_thumbs1 .swiper-wrapper .swiper-slide a {  display: block; overflow: hidden; border-radius: 5px; }
.detail_wrap .detail_left .image_box .image_thumbs1 .swiper-wrapper .swiper-slide a img { }
.detail_wrap .detail_left .image_box .image_thumbs1 .swiper-wrapper .swiper-slide.swiper-slide-active { opacity:1!important; }

#wrap .swiper-button-next, #wrap .swiper-button-prev {     width: 52px; height: 52px; font-size:18px; }
/*#wrap .swiper-button-prev, #wrap .swiper-container-rtl .swiper-button-next { left:00px; }
#wrap .swiper-button-next, #wrap .swiper-container-rtl .swiper-button-prev { right:00px; }*/

/* review_box */
.detail_wrap .detail_left .review_box {  }

.review_box .detail_title { margin-left: 10px; }
.review_box .detail_title > span { margin-left: 15px; color: #949494; font-weight: 400; font-size: 18px;}
.review_box .detail_title > span b { color:#333;  font-weight: 700; font-size: 21px; }
.review_box .detail_title .stars{ position:relative; top:-3px; left:0px; transform: scale(1.2,1.2); -webkit-transform: scale(1.2,1.2); -moz-transform: scale(1.2,1.2);  }

/*
  .list_tab { border-bottom:2px solid #d9d9d9; padding-bottom:10px; margin:10px auto 15px; }
  .list_tab li { display:inline-block; margin-right:20px; position:relative;  }
  .list_tab li::before, .list_tab li::after { display:block; position:absolute; bottom:-12px; width:0%; height:2px; font-size:0; content:'　'; background-color: #333;  -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s;	transition: all 0.3s ease 0s;}
  .list_tab li.on::before, .list_tab li.on::after { width:50%; }
  .list_tab li::before { left:50%; }
  .list_tab li::after { right:50%; }
  .list_tab li span { line-height: 30px; font-size:15px;}
  .list_tab li span.num { display:inline-block; background-color:#eaeaea; font-size:13px; margin-left:10px; padding:0px 10px; border-radius:15px;}
*/

/* review list */

.rv_list_wrap { border-top:1px solid #e7e7e7; margin-top:10px; }
.rv_list_wrap .rv_list { position:relative; border-bottom:1px solid #e7e7e7; padding:20px 0;   }
.rv_list_wrap .rv_list:last-child {  border-bottom:0; }
.rv_list_wrap .rv_list .rv_list_inner { position:relative; display:flex; flex-wrap: nowrap; align-items: flex-end; }
.rv_list .rv_con_wrap { width:100%; padding-right:30px; }

.rv_con_wrap .stars { margin-bottom:10px; }
.rv_con_wrap .con { position:relative; line-height:20px; max-height:63px; padding-bottom: 3px; font-size: 15px; margin-bottom: 20px; padding-right: 30px;
  overflow: hidden;  word-break: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; text-overflow: ellipsis;  
 }
.rv_list.on .rv_con_wrap  .con { max-height:1000px;      -webkit-line-clamp:inherit; }

.rv_con_wrap .con p {  }
.rv_con_wrap .con button { display:none; position: absolute; bottom:0px; right:0px; width:40px; height:20px; border-radius: 15px; padding-bottom: 5px; line-height: 20px; background-color: #e7e7e7; }
.rv_con_wrap .con button i { font-size: 19px; }
.rv_con_wrap .rv_image { white-space: nowrap; margin-top:10px; }
.rv_con_wrap .rv_image li { display:inline-block; margin-right:5px; }
.rv_con_wrap .rv_image li a {  }
.rv_con_wrap .rv_image li a img { height:66px; border-radius: 5px;}

/* review IMAGE slider */
.review_image_wrap {  }
.review_image_wrap > h5 { margin-top: 40px; margin-bottom:10px; font-size:15px; }

.review_image { position:relative; }

#wrap .review_image_wrap .swiper-button-prev,
#wrap .review_image_wrap .swiper-button-next { width: 40px ; height: 40px ; }


/* review writer */
.rv_con_wrap .both_side_box {  }
.rv_list .both_side_box .writer { margin-top:10px; }
.rv_list .both_side_box > .writer { margin-top:-5px; margin-bottom:15px; }

.rv_list .both_side_box .writer .wt_image { margin-right: 10px; border-radius: 50%; overflow: hidden; display: inline-block; vertical-align: middle;}
.rv_list .both_side_box .writer .wt_image img {  height:35px; width: 37px;}
.rv_list .both_side_box .writer .wt_name { margin-right: 10px; }
.rv_list .both_side_box .writer .wt_date { color:#949494; }
.rv_list .both_side_box .both_right {  }
.rv_list .both_side_box .both_right button { margin-left:15px; }
.rv_list > .both_side_box .both_right button:hover { text-decoration: underline; }
.rv_list .both_side_box .both_right button i {  }
.rv_list .both_side_box .both_right button .count { display: inline-block; background-color: #eaeaea; width:20px; line-height: 20px; border-radius: 50%; }


/* review quality bar */

.rv_list .rv_bar_wrap { width:280px; }
.rv_list .rv_bar_wrap > ul {  }
.rv_list .rv_bar_wrap > ul > li {  }
.rv_list .rv_bar_wrap > ul > li .ser_name {  }
.rv_list .rv_bar_wrap > ul > li .ser_num_wrap {  width:200px; display:flex; align-items: center; }
.rv_list .rv_bar_wrap > ul > li .ser_num_wrap .ser_bar { width:220px; background-color: #cecece; height:10px; border-radius: 5px; }
.rv_list .rv_bar_wrap > ul > li .ser_num_wrap .ser_bar span { display:block; background-color: #333; height:10px; border-radius: 5px; }
.rv_list .rv_bar_wrap > ul > li .ser_num_wrap .ser_num { width:40px;text-align: right; font-size: 15px; font-weight: 400; }


/* review like */

.rv_list .rv_like_effect { position:absolute; top:50%; left:50%; pointer-events : none; opacity: 0;  transform:translate(-50%,-50%);  -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); z-index: 20; }
.rv_list .rv_like_effect i { font-size: 64px;   transform:scale(0.6); -webkit-transform:scale(0.6); -moz-transform:scale(0.6) ; color:#ff7919;  -webkit-transition: transform 0.3s ease 0s; -moz-transition: transform 0.3s ease 0s;	transition: transform 0.3s ease 0s;}
.rv_list.like_this .rv_like_effect i { transform:scale(1);  -webkit-transform:scale(1); -moz-transform:scale(1); }
.rv_list .box_left .con {word-break:break-all;}

.rv_list button.rv_like_btn { position:absolute; top:-10px; right:-5px; width:20px; height:20px; }
.rv_list button.rv_like_btn i { position:absolute; display:block; width:20px; height:20px; top:50%; right:50%; font-size:18px;  transform-origin: 50% 50%; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s;	transition: all 0.3s ease 0s; }
.rv_list button.rv_like_btn i.regular { opacity:1; transform:scale(1); -webkit-transform:scale(1); -moz-transform:scale(1) ; }
.rv_list button.rv_like_btn i.solid { opacity:0; transform:scale(0.3); -webkit-transform:scale(0.3); -moz-transform:scale(0.3) ;  color:#ff7919; }

.rv_list.like_this button.rv_like_btn i.regular { opacity:0; transform:scale(0.3); -webkit-transform:scale(0.3); -moz-transform:scale(0.3) ; }
.rv_list.like_this button.rv_like_btn i.solid {  opacity:1; transform:scale(1); -webkit-transform:scale(1); -moz-transform:scale(1) ;}


/* review comment */
.rv_list .rv_comment_wrap.main {padding: 0; border: none; padding: 0;}
	
.rv_list .rv_comment_wrap { margin:20px auto 10px;  border:1px solid #e7e7e7; padding:20px 20px; background-color: #fff; border-radius: 8px; display: none;}
.rv_list .rv_comment_wrap .comment_list { position:relative;  margin-top:10px; margin-bottom:10px;  }
.rv_comment_wrap > .comment_list_wrap > .comment_list { padding-top:10px; border-radius: 8px; border:1px solid #e7e7e7; padding-bottom:10px; } 

.rv_list .rv_comment_wrap .comment_con { }
.rv_list .rv_comment_wrap .comment_text { margin-bottom: 20px; }
.rv_list .rv_comment_wrap .rv_image { white-space: nowrap; margin-top:10px; }
.rv_list .rv_comment_wrap .rv_image li { display:inline-block; margin-right:5px; }
.rv_list .rv_comment_wrap .rv_image li a {  }
.rv_list .rv_comment_wrap .rv_image li a img { height:66px; border-radius: 5px;}


.rv_list .rv_comment_wrap .comment_list_wrap {  }
.rv_list .rv_comment_wrap .comment_list_wrap .writer { margin-top:10px; }
.rv_list .rv_comment_wrap .comment_list_wrap .writer .stars { position: relative; top:-2px; left:-3px; transform: scale(0.8); }
.rv_list .rv_comment_wrap .comment_list .delete { position: absolute; top:10px; right:0; line-height: 24px; height: 26px; padding: 0 15px; }

/* review comment 쓰기 */
.rv_list .rv_comment_wrap .rv_comment_input { display:flex;  flex-direction: column;  align-items: stretch; width:100%; gap: 5px;  padding-bottom:10px; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_comment_title {  line-height: 35px; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_comment_title .rv_ct_t { display:flex; align-items: center; justify-content: space-between; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_comment_title .rv_ct_t h3 {  font-size: 15px; font-weight: 700; color:#008d8e; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_comment_title .rv_ct_t .rv_ct_scope {  }
.rv_list .rv_comment_wrap .rv_comment_input .rv_comment_title .rv_ct_t .rv_ct_scope .stars { white-space: nowrap; width:90px; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_comment_title .rv_ct_t .rv_ct_scope .stars .star-rating { transform: scale(0.7); transform-origin: left center; }


.rv_list .rv_comment_wrap .rv_comment_input .rv_ct_input { position:relative; display:flex; align-items: center; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_ct_input input[type="text"] { width:100%; padding-right: 90px;}
.rv_list .rv_comment_wrap .rv_comment_input .rv_ct_input .file_btn { position:absolute; top:6px; right:198px; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_ct_input .file_btn input[type="file"] { opacity:0; position:absolute; top:0; right:0; width:77px; height:27px; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_ct_input .file_btn button { line-height: 25px; padding:0 5px; border-radius: 3px;}
.rv_list .rv_comment_wrap .rv_comment_input .rv_ct_input .rv_ct_btn { white-space: nowrap; }
.rv_list .rv_comment_wrap .rv_comment_input .rv_ct_input .rv_ct_btn button { margin-left: 5px; }

/* review comment 의 comment */
.rv_list .rv_comment_input.re_to_re {  margin-top:10px; }
.rv_list .comment_list_wrap.re_to_re .comment_list { border-bottom: 1px solid #e7e7e7; }
.rv_list .comment_list_wrap.re_to_re .comment_list:last-child { border-bottom: 0; }
.rv_list .comment_list_wrap.re_to_re .comment_list_wrap { position: relative; top:10px;   padding:10px 20px; background-color: #fff; border-radius: 8px; }

.rv_list .comment_list_wrap.re_to_re .both_side_box { }
.rv_list .comment_list_wrap.re_to_re .both_side_box button { line-height: 24px; height: 26px; padding: 0 15px; }
.rv_list .comment_list_wrap.re_to_re .comment_con { margin-bottom: 20px;   }

/* 작성자 댓글 */
.rv_list .rv_comment_wrap .comment_list.writer_cm { background-color: #f1f1f1;  } 
.rv_list .rv_comment_wrap .writer_icon { margin-left:-5px; margin-right: 15px; border-radius: 3px; padding:1px 10px; display:inline-block; vertical-align: middle; border: 1px solid #eb6b0f; color:#eb6b0f; font-weight: 700; }

.rv_list .rv_comment_wrap > .comment_list_wrap > .comment_list > .delete { top: 20px; right: 20px; }

.rv_list .comment_list_wrap.re_to_re ,
.rv_list .rv_comment_wrap > .comment_list_wrap > .comment_list > .both_side_box,
.rv_list .rv_comment_wrap > .comment_list_wrap > .comment_list > .comment_con > .both_side_box,
.rv_list .rv_comment_wrap > .comment_list_wrap > .comment_list > .comment_con > .comment_text {  margin:0 20px; }
.rv_list .rv_comment_wrap > .comment_list_wrap > .comment_list > .comment_con > .rv_comment_input  {  margin:0 20px; width:calc( 100% - 40px ); }

/* -------------------------right_box */

.detail_wrap .detail_right {  width:33%; }

/* info_box */
.detail_wrap .info_box {  }

.caption { display: block; color: #949494; }
.txt { display: block; font-size: 15px;  line-height: 20px; }
h2.detail_title { font-size: 21px; line-height: 42px; }
h2.detail_title > span { display:inline-block; vertical-align: middle; margin-right:30px; }


.detail_wrap .info_box .info_title { position: relative; }


/* 타이틀 하트 모션 */
@-webkit-keyframes like_motion {
  0% {
    transform: scale(1);
    opacity: 1; 
  }
  10% {
    transform: scale(0.5);
    opacity: 0; 
  }
  20% {
    transform: scale(0.5);
    opacity: 1; 
  }
  50% {
    transform: scale(1.2);
  }
  80% {
    transform: scale(0.8);
  }
  100% {
    transform: scale(1);
  }
}
 
.detail_wrap .info_box .info_title .sub_title { position:absolute; top:13px; right:0; font-weight: 600; line-height: 20px; font-size: 21px; opacity: 0; color: #eb6b0f; margin-bottom: 10px; -webkit-transition: all 0.8s ease 0s; -moz-transition: all 0.8s ease 0s;	transition: all 0.8s ease 0s;}
.detail_wrap .info_box .info_title .sub_title i { font-size: 24px; transform: scale(0.5); opacity: 0; }
.detail_wrap .info_box .info_title .sub_title .num { position: relative; top:-3px; left:-7px; font-size: 18px;}

.detail_wrap .info_box .info_title .sub_title.on { opacity: 1; }
.detail_wrap .info_box .info_title .sub_title.on i { animation: like_motion 0.8s ease-in-out 2s; transform: scale(1); opacity: 1; }

/* 타이틀 하트 모션 끝 */
.detail_wrap .info_box .info_title .title { font-size: 28px; line-height: 36px; font-weight: 700; margin-bottom: 5px; }
.detail_wrap .info_box .info_title .caption { margin-bottom: 20px; }
.detail_wrap .info_box .info_title .txt {  margin-bottom: 10px; }
.detail_wrap .info_box .info_title .seller_name { display: block; margin-bottom: 20px; }
.detail_wrap .info_box .info_title .seller_name a { font-weight: 700; vertical-align: middle;}
.detail_wrap .info_box .info_title .seller_name a:hover { text-decoration: underline; }
.detail_wrap .info_box .info_title .seller_name .stars { position:relative; top:-1px; left:-1px; transform: scale(0.8,0.8); -webkit-transform: scale(0.8,0.8); -moz-transform: scale(0.8,0.8); }

.detail_wrap .info_box .check_txt { margin-bottom: 20px; }
.detail_wrap .info_box .check_txt i {  }
.detail_wrap .info_box .check_txt span { color: #636363; }

.detail_wrap .info_box .option {  }
.detail_wrap .info_box .option > button { position:relative; width:100%; border:1px solid #e6e6e6; margin-bottom:15px; display:flex; justify-content: space-between; padding:10px 15px; padding-left: 35px; border-radius: 8px;}
.detail_wrap .info_box .option > button:hover { border:1px solid #cfcfcf; }
.detail_wrap .info_box .option > button .icon { position: absolute; top:10px; left:10px; }
.detail_wrap .info_box .option > button.lock {  }
.detail_wrap .info_box .option > button.open { border-color:#666666;}
.detail_wrap .info_box .option > button.lock i.open,
.detail_wrap .info_box .option > button.open i.lock { display:none; }
.detail_wrap .info_box .option > button.lock span.info { color:#cecece; position: relative; top:2px; }

.detail_wrap .info_box .btn_area { margin-top:10px; }
.detail_wrap .info_box .btn_area button { width:100%; border-radius: 30px; font-size: 18px;  padding:6px 0; margin-top:10px; }
.detail_wrap .info_box .btn_area button:hover { box-shadow: 0 1px 5px 0 rgba(28,35,69,0.12); }
.detail_wrap .info_box .info_.caption { margin-top:15px; margin-bottom:20px; padding:0 10px; }

.detail_wrap .info_toggle_wrap {  }
.detail_wrap .info_to_box {  }
.detail_wrap .info_to_box .info_to_title { z-index: 3;position:relative; padding:10px 10px; border:1px solid #e7e7e7; border-width: 1px 0; cursor: pointer; -webkit-transition: all 0.3s ease 0.1s; -moz-transition: all 0.3s ease 0.1s;	transition: all 0.3s ease 0.1s;}
.detail_wrap .info_to_box .info_to_title:hover {  border-color: #8d8d8d;  z-index: 4; }
.detail_wrap .info_to_box .info_to_title span { font-size: 15px; font-weight: 600; }
.detail_wrap .info_to_box .info_to_title span:last-child { position:absolute; top:1px; right:1px; padding:10px 15px; height:40px; width:40px;}
.detail_wrap .info_to_box .info_to_title span:last-child i { position:absolute;  right:15px; opacity:1; }
.detail_wrap .info_to_box .info_to_title span:last-child i.up { top:12px; }
.detail_wrap .info_to_box .info_to_title span:last-child i.down { top:10px; }

.detail_wrap .fav_list { margin-top: 10px; border-bottom: 1px solid #e7e7e7; padding-bottom:20px; }
.detail_wrap .fav_list li { position: relative; padding:10px 15px; border-radius: 30px; }
.detail_wrap .fav_list li:hover { background-color: #f9f9f9; }
.detail_wrap .fav_list button.fav_list_con { position:absolute; top:12px; right:22px; line-height: 30px; border-radius: 31px; }
.detail_wrap .fav_list li button.fav_list_con:hover  { color: #fff;  border: 1px solid #ff7919; background-color: #ff7919; }

.detail_wrap .info_to_box .info_to_con { display: none; padding:10px 0px; font-size: 15px; line-height:25px; color: #636363; }

.info_toggle_wrap .info_to_box.close .info_to_title span:last-child i.up { opacity:0; }
.info_toggle_wrap .info_to_box.open .info_to_title span:last-child i.down { opacity:0; }
.info_toggle_wrap .info_to_box.close .info_to_title  { margin-bottom:-1px;}
.info_toggle_wrap .info_to_box.close .info_to_con { padding:10px 0px; }


.writer_icon {margin-right: 15px; border-radius: 3px; padding: 1px 10px; display: inline-block; vertical-align: middle; border: 1px solid #eb6b0f; color: #eb6b0f; font-weight: 700; margin-top: -2px; margin-left: 5px;}
.delete.btn {line-height: 24px; height: 26px; padding: 0 15px; top: 0px; right: 40px; position: absolute;}