@charset "utf-8";

/* .fake {display: none;} */

.portSlide {background: url('/html/images/new/bg_review2.jpg') center top no-repeat; padding:115px 0 0 0;}
.portSlide .titleWrap {margin-bottom:45px;}
.portSlide .bestList {padding-bottom:50px; margin-bottom:50px; border-bottom:1px solid #eaeaea;}
.portSlide .bestList ul:after {content:''; display: block; clear:both;}
.portSlide .bestList ul li {float:left; width:19.5%; margin-left:0.5%;}
.portSlide .bestList ul li:first-child {margin-left:0;}
.portSlide .bestList ul li a {display: block; position: relative; text-align: center;}
.portSlide .bestList ul li a .best {position: absolute; left:10px; top:10px; text-indent:-999em; width:71px; height:30px; background:url('/html/images/new/ico_best.png') center no-repeat;}
.portSlide .bestList ul li a .img { border-radius:50%; overflow:hidden;}
.portSlide .bestList ul li a .line {display: block; text-align: center; padding-top:13px; font-size:16px; line-height:16px; font-weight:500; color:#bf94a2;}
.portSlide .bestList ul li a .line .cm {font-size:20px; font-style: italic;}
.portSlide .bestList ul li a .line .count {padding-left:22px; background:url('/html/images/new/ico_heart.png') left center no-repeat; }



.listType4 { background:#fff; }
.listType4 .countInfo {font-size:24px; color:#222222; margin-bottom:25px; font-weight:300; padding-left:33px; background:url('../images/port/ico_heart02.png') left center no-repeat;}
.listType4 .countInfo em {font-weight:700;}
.listType4 .in {max-width:1280px; margin:0 auto;}
.listType4 ul {font-size: 0; margin-left:-1.5%;}
.listType4 ul:after {content:''; display: block; clear:both;}
.listType4 ul li { position: relative; display: inline-block; vertical-align: top; width:23.5%; margin-bottom:30px; margin-left:1.5%;}
.listType4 ul li a {position: relative; display: block; }
.listType4 ul li a .best {position: absolute; left:0; top:0; text-indent:-999em; width:47px; height:20px; background:url('/html/images/new/ico_best_main.png') center no-repeat; z-index: 5;}
.listType4 ul li a .img {position: relative; margin-bottom:15px;border-radius:10px; overflow:hidden;}
.listType4 ul li a .img img {width:100%;}
.listType4 ul li a .txtWrap {position: relative;}
.listType4 ul li a .txtWrap .tit01 {font-size:18px; color:#222222; font-weight:300; margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.listType4 ul li a .txtWrap .tit01 em{font-weight:700;}
.listType4 ul li a .txtWrap .tit02 {font-size:14px; color:#bf94a2; font-weight:300; padding-left:6px; position: relative;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.listType4 ul li a .txtWrap .tit02:after {content:''; position: absolute; left:0; top:50%; background:#bf94a2; margin-top:-5px; width:1px; height:10px;}
.listType4 ul li .check {position: absolute; right:0; top:-5px;}
.listType4 ul li .check input {position: absolute; visibility: hidden;}
.listType4 ul li .check label {min-width:27px; font-size:14px; line-height:14px; color:#888888; font-weight:300; text-align: center; display: inline-block; vertical-align: middle; background:url('/html/images/new/ico_ckHeart.png') center top no-repeat; padding-top:27px;}
.listType4 ul li .check input:checked + label { background:url('/html/images/new/ico_ckHeart_on.png') center top no-repeat; font-weight:500; color:#bf94a2;}
.listType4 ul li .popText {opacity:0; transition:.3s all; position: absolute; left:0; top:0; width: 100%; height:100%; background:rgba(97,73,81,.8);}
.listType4 ul li .popText .in {position: absolute; left:0; width: 100%; top:50%; transform:translateY(-50%); text-align: center;}
.listType4 ul li .popText .in .btnShowCard {display: inline-block; vertical-align: top; width:117px; font-size:0; border:1px solid #a7969c; border-radius:30px;}
.listType4 ul li .popText .in .btnShowCard span{padding:9px 0; padding-left:17px; font-size:14px; line-height:14px; color:#efe8ea; font-weight: 300; display: inline-block; vertical-align: middle; background:url('/html/images/new/ico_link2.png') left 12px no-repeat;}
.listType4 ul li .popText .in .text {font-size:14px; color:#efe8ea; font-weight:300; padding:0 40px 0 40px; margin:40px 0 60px 0; -webkit-box-orient:vertical; -webkit-line-clamp:5; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; max-height:105px}
.listType4 ul li .popText .in .design {font-size:14px; color:#cab4ba; font-weight:500; }
.listType4 ul li .popText .in .design span {font-size:16px; font-style: italic;}
.listType4 ul li a:hover .popText {opacity:1;}
.listType4 ul li a:hover .best {display: none;}
.listType4 ul li.onlyText .popText {opacity:1; position: relative; background:#fbf7f8;  min-height:305px;}
.listType4 ul li.onlyText .popText .in {}
.listType4 ul li.onlyText .popText .in .btnShowCard { border:1px solid #eee0e4; }
.listType4 ul li.onlyText .popText .in .btnShowCard span{ color:#c095a2; background:url('/html/images/port/ico_reviewMore.png') left 12px no-repeat;}
.listType4 ul li.onlyText .popText .text {color:#75384a;}
.listType4 ul li.onlyText .popText .in .design {color:#c095a2;  }

.detailMenu {position: fixed; left:0; top:0; height: 100%; z-index: 50; background: #222222; transition:.3s all;}
.detailMenu .in { width:368px;padding:50px;  }
.detailMenu .in .btnClose {position: absolute; right:-75px; top:50%; margin-top:-27px;}
.detailMenu .in .btnClose a {position: relative; display: block; text-indent:-999em;  width:55px; height: 55px; background:url('../images/port/ico_folder.png') no-repeat;}
.detailMenu.off {left:-368px;}
.detailMenu.off .btnClose a{transform:rotate(180deg); }

.detailMenu .txtWrap {position: relative; margin-bottom:300px; }
.detailMenu .txtWrap .tit01 {font-size:20px; color:#fff; font-weight:300; margin-bottom:5px; padding-right:30px;}
.detailMenu .txtWrap .tit01 em{font-weight:700;}
.detailMenu .txtWrap .tit02 {font-size:18px; color:#bf94a2; font-weight:300; padding-left:10px; position: relative; margin-bottom:45px;}
.detailMenu .txtWrap .tit02:after {content:''; position: absolute; left:0; top:5px; background:#bf94a2; width:1px; height:15px;}
.detailMenu .txtWrap .detail {font-size:18px; color:#aaaaaa; font-weight:300; max-height:calc(100vh - 450px); overflow-y:auto;}
.detailMenu .txtWrap .btn {margin-top:20px;}
.detailMenu .txtWrap .btn a {font-size:20px; color:#222222; background:#fff; height:75px; line-height:72px; display: block; text-align: center; font-weight:500;}
.detailMenu .txtWrap .btn a span {padding-left:35px; background:url('../images/ico_dot01.png') left center no-repeat;}
.detailMenu .check {position: absolute; right:0; top:5px;}
.detailMenu .check .num {display: inline-block; vertical-align: middle; font-size:18px; color:#bf94a2; font-weight:500; margin-right:5px;}
.detailMenu .check input {position: absolute; visibility: hidden;}
.detailMenu .check label {width:27px; height:30px; display: inline-block; vertical-align: middle; text-indent:-999em; background:url('../images/ico_book.png') center no-repeat;}
.detailMenu .check input:checked + label { background:url('../images/ico_book_on.png') center no-repeat;}
.detailMenu.type2 .check label  {width:27px; height:24px;  background:url('../images/port/ico_heart01.png') center no-repeat;}
.detailMenu.type2 .check input:checked + label { background:url('../images/port/ico_heart01_on.png') center no-repeat;}




.detailMenu .in .selectDv {position: absolute; left:0; bottom:140px; width:100%; padding:0 50px;}
.detailMenu .in .selectDv .tit {font-size:20px;line-height:20px; color:#fff; font-weight:700; text-align: center; margin-bottom:20px; letter-spacing:-0.04em;}

.detailMenu .in .control {position: absolute; left:50px; bottom:50px; width:calc(100% - 100px);}
.detailMenu .in .control p a {display: block; height:75px; line-height:73px; background:#fff; text-align: center; font-size:20px; color:#222222; font-weight:500;}
.detailMenu .in .control p.link {margin-bottom:10px;}
.detailMenu .in .control p.link a span {padding-left:35px;  background:url('../images/port/ico_sharePop.png') left center no-repeat;}
	


.detailMenu.type3 {background:#fff;}
.detailMenu.type3 .in {width: 450px; padding:25px;}

.detailMenu.type3 .txtWrap .tit01 {font-size:22px; color:#222222; padding-right: 75px;  margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #eeeeee;}
.detailMenu.type3 .txtWrap .tit03 {display: inline-block; vertical-align: top; margin-bottom:15px; background:#f2f2f2; border-radius:7px; padding:4px 12px; font-size: 15px; font-weight:500; color:#aaaaaa;}
.detailMenu.type3 .txtWrap .tit03 span { display: inline-block; height: 14px; line-height:14px; }
.detailMenu.type3 .txtWrap .tit03 span:first-child {margin-right: 8px; padding-right: 11px; border-right:1px solid #d9d9d9;}
.detailMenu.type3 .txtWrap .detail {color:#555555; max-height:calc(100vh - 386px); padding-right:10px;}
.detailMenu.type3 .txtWrap .detail::-webkit-scrollbar {
    width: 4px;
  }
.detailMenu.type3 .txtWrap .detail::-webkit-scrollbar-thumb {
    background-color: #cccccc;
    border-radius: 10px;
    background-clip: padding-box;
  }
.detailMenu.type3 .txtWrap .detail::-webkit-scrollbar-track {
    background-color: #eaeaea;
    border-radius: 10px;
  }


.detailMenu.type3 .check {overflow:hidden;  height: 29px; background:#f8f4f6; border-radius:8px; padding:7px 12px;}
.detailMenu.type3 .check .num {margin-right: 0; font-size: 15px; float:right; height: 16px; line-height: 16px; }
.detailMenu.type3 .check label  {float:left; margin-right: 5px; width:19px; height:16px;  background:url('../images/port/ico_heart03_off.png') center no-repeat;}
.detailMenu.type3 .check input:checked + label { background:url('../images/port/ico_heart03.png') center no-repeat;}
.detailMenu.type3 .in .btnClose {position: absolute; right:-77px; top:15px; margin-top:0;}
.detailMenu.type3 .in .btnClose a {box-shadow:0 0 15px 15px rgba(0,0,0,.01); width:62px; height: 62px; border-radius:50%; background:url('../images/port/ico_folder01.png') no-repeat;}
.detailMenu.type3.off {left:-465px;}
.detailMenu.type3.off .btnClose a{transform:rotate(180deg);  display: none;}

.detailMenu.type3 .btnCloseText {display:none; position: absolute; right:-220px; top:15px;}
.detailMenu.type3 .btnCloseText a {display: block; border-radius:100px; width:190px; height:62px; line-height:62px; text-align: center; color:#fff; background:#222222; font-size:18px;font-weight:500;}
.detailMenu.type3 .btnCloseText a span {display: inline-block; padding-right: 33px;  background:url('../images/port/ico_folder_close2.png') right center no-repeat;}
.detailMenu.type3.off .btnCloseText {display:block; }

.detailMenu.type3 .in .selectDv {padding: 25px 0 0 0; left:25px; bottom:25px; width:calc(100% - 50px);    border-top:1px solid #eeeeee;}
.detailMenu.type3 .in .selectDv .warn { margin-bottom:15px; font-size:14px; line-height:20px; color:#222222;  font-weight:300; padding-left:27px; background:url('../images/port/ico_warn03.png') left 0 no-repeat; }
.detailMenu.type3 .in .selectDv .btnBalck { display:block;}

.detailMenu.type3 .sortingPort .value .lstBox {background:#fff; border:1px solid #222222; border-radius:10px;}
.detailMenu.type3 .sortingPort .value .lstBox span {height:65px; line-height:64px;  font-weight:500; color:#222222; border:none;}
.detailMenu.type3 .sortingPort .value .lstBox:after {right:24px; width:15px; height:9px; background:url('../images/port/ico_portSel01.png') right center no-repeat;}
.detailMenu.type3 .sortingPort .lstValue {top:49px; background:#fff; border:1px solid #222222; border-top:none; border-bottom-left-radius:10px;  border-bottom-right-radius:10px; }
.detailMenu.type3 .sortingPort .lstValue .lstBox {padding:5px 0; }
.detailMenu.type3 .sortingPort .lstValue .lstBox span {font-weight:15px; color:#222; }

.btnBalck { margin-top:10px; display:none;}
.btnBalck a {text-align: center; background:#222222 ;font-size:18px; color:#fff; display: block; font-weight:500; height:65px; line-height:65px; border-radius:10px; }


#iframeWrap {width: 100%; height: 100vh;}
#iframeWrap iframe{position: relative; width: 100%; height: 100vh; display: block;}
#iframeWrap.tablet_dv {position: relative; right:56px; padding:60px 105px 0 0; margin-top:50px; width:844px; height:923px;   margin:38px auto 0 auto; background:url('../images/port/bgDevicePad.png?V=03') no-repeat; }
#iframeWrap.tablet_dv .frameBox{position: relative; padding-left: 209px; position: relative; left:15px; top:7px;}
#iframeWrap.tablet_dv .frameBox iframe { width:524px; height: 768px !important; margin:0 auto; display:block; border-radius:10px; background:#fff;}

#iframeWrap.mobile_dv  {position: relative; right:-63px; width:452px; height:836px; margin:38px auto 0 auto; padding-top:20px; background:url('../images/port/bgDeviceMob2.png') no-repeat; }
#iframeWrap.mobile_dv .frameBox {position: relative; border-radius:30px; padding-top: 42px; overflow:hidden; width:348px; margin-left:85px;}
#iframeWrap.mobile_dv .frameBox iframe { width: 100%; height:705px !important;  display:block; overflow-x:hidden;  }

#iframeWrap.mobile_dv .frameBox.type3:after {content:''; position: fixed; left:0; top:0; width:100%; height:100%; z-index:-1; background:#f8f8f8;}
#iframeWrap.tablet_dv .frameBox.type3:after {content:''; position: fixed; left:0; top:0; width:100%; height:100%; z-index:-1; background:#f8f8f8;}


.test {position: fixed; left:0; top:0; width:100%; text-align: center; z-index:999;}
.sortingPort {position: relative; z-index:10;  }
.sortingPort .value .lstBox:after {content:''; position: absolute; right:28px; top:50%; margin-top:-4px; width:14px; height: 8px; background:url('../images/port/ico_portSel.png') no-repeat; }
.sortingPort .value .lstBox { background:#222222;}
.sortingPort .value .lstBox span {height: 75px; line-height: 73px; border:1px solid #fff;}
.sortingPort .value .lstBox.on:after {transform:rotate(180deg); }
.sortingPort .value .lstBox.on {border-bottom-left-radius:0;  border-bottom-right-radius:0;}

.sortingPort .lstBox {position: relative; cursor:pointer; }
.sortingPort .lstBox br {display: none;}
.sortingPort .lstBox span{position: relative; display: block;  font-size:18px;padding-left:30px; font-weight:300; color:#fff; }

.sortingPort .lstValue {position: absolute; left:0; top:75px; width: 100%; background:#333333; overflow:hidden; border:1px solid #555555; display: none; z-index:5; padding:10px 0;}
.sortingPort .lstValue .lstBox { padding:10px 0 10px 0}
.sortingPort .lstValue .lstBox.hidden {display: none;}


.popPort {position: fixed; left:0; top:0; width: 100%; height:100%; z-index:500; background:rgba(0,0,0,.5); display:flex; justify-content:center; align-items:center; }
.popPort .in {position: relative; background:#fff; width:510px; padding:36px;}
.popPort .in .text {padding-left:50px; padding-top:5px; background:url('../images/port/ico_port_warn.png') left top no-repeat; background-size:25px auto;}
.popPort .in .text .tit01{font-size:18px; line-height:18px; color:#222222; font-weight:500; margin-bottom:14px;}
.popPort .in .text .tit02 {font-size:16px; color:#222222; font-weight:300;}
.popPort .in .closeIco {position: absolute; right:36px; top:40px; width:16px; height:16px; background:url('../images/port/ico_port_close.png') left top no-repeat;  background-size:16px auto; cursor:pointer; }


/* �̵������ */
@media all and (max-height:750px){
	.detailMenu .txtWrap {margin-bottom:15px; padding-bottom:15px;}
}


/* �̵������ */
@media all and (max-width:1240px){

	.portSlide {background: url('/html/images/new/bg_review2_m.jpg') left top no-repeat; background-size:100% 250px; padding:75px 15px 0 15px;}
	.portSlide .titleWrap {margin-bottom:25px;}
	.portSlide .bestList {padding-bottom:30px; margin-bottom:30px; border-bottom:1px solid #eaeaea;}
	.portSlide .bestList ul {overflow-x:scroll; overflow-y:hidden; white-space:nowrap;}
	.portSlide .bestList ul:after {content:''; display: block; clear:both;}
	.portSlide .bestList ul li {float:none; display: inline-block; vertical-align: top; width:105px; margin-left:0.5%;}
	.portSlide .bestList ul li:first-child {margin-left:0;}
	.portSlide .bestList ul li a {display: block; position: relative; text-align: center;}
	.portSlide .bestList ul li a .best {position: absolute; left:0; top:0; text-indent:-999em; width:35px; height:20px; background:url('/html/images/new/ico_best_m.png') left top no-repeat; background-size:35px auto;}
	.portSlide .bestList ul li a .img { border-radius:50%; overflow:hidden;}
	.portSlide .bestList ul li a .line {display: block; text-align: center; padding-top:13px; font-size:12px; line-height:12px; font-weight:500; color:#bf94a2;}
	.portSlide .bestList ul li a .line .cm {font-size:13px; font-style: italic;}
	.portSlide .bestList ul li a .line .count {padding-left:15px; background:url('/html/images/new/ico_heart_m.png') left center no-repeat;  background-size:13px auto;}



	.listType4 { background:#fff; padding:0 15px;}
	.listType4 .countInfo {font-size:14px; color:#222222; margin-bottom:15px; font-weight:300; padding-left:20px; background:url('../images/port/ico_heart02_m.png') left center no-repeat; background-size:17px auto;}
	.listType4 .countInfo em {font-weight:700;}
	.listType4 .in {max-width:1280px; margin:0 auto;}
	.listType4 ul {font-size: 0; margin-left:0;}
	.listType4 ul:after {content:''; display: block; clear:both;}
	.listType4 ul li {position: relative; display: inline-block; vertical-align: top; width:49%; margin-bottom:30px; margin-left:0;}
	.listType4 ul li:nth-child(2n) {margin-left:2%;}
	.listType4 ul li a {position: relative; display: block; }
	.listType4 ul li a .best {position: absolute; left:0; top:0; text-indent:-999em; width:47px; height:20px; background:url('/html/images/new/ico_best_m.png') left top no-repeat;  background-size:25px auto; z-index: 5;}
	.listType4 ul li a .img {position: relative; margin-bottom:10px;border-radius:5px; overflow:hidden;}
	.listType4 ul li a .img img {width:100%;}
	.listType4 ul li a .txtWrap {position: relative; padding-right:20px;}
	.listType4 ul li a .txtWrap .tit01 {font-size:12px; color:#222222; font-weight:300; margin-bottom:5px; }
	.listType4 ul li a .txtWrap .tit01 em{font-weight:700;}
	.listType4 ul li a .txtWrap .tit02 {font-size:10px; color:#bf94a2; font-weight:300; padding-left:3px; position: relative;}
	.listType4 ul li a .txtWrap .tit02:after {content:''; position: absolute; left:0; top:50%; background:#bf94a2; margin-top:-4px; width:1px; height:8px;}
	.listType4 ul li .check {position: absolute; right:0; top:0;}
	.listType4 ul li .check input {position: absolute; visibility: hidden;}
	.listType4 ul li .check label {min-width:20px; font-size:11px; line-height:11px; color:#888888; font-weight:300; text-align: center; display: inline-block; vertical-align: middle; background:url('/html/images/new/ico_ckHeart_m.png') center top no-repeat; background-size:20px auto; padding-top:22px;}
	.listType4 ul li .check input:checked + label { background:url('/html/images/new/ico_ckHeart_on_m.png') center top no-repeat; font-weight:500; color:#bf94a2; background-size:20px auto; }
	.listType4 ul li .popText {display: none;}
	.listType4 ul li .popText .in {position: absolute; left:0; width: 100%; top:50%; transform:translateY(-50%); text-align: center;}
	.listType4 ul li .popText .in .btnShowCard {display: inline-block; vertical-align: top; width:117px;  border:1px solid #a7969c; border-radius:20px;}
	.listType4 ul li .popText .in .btnShowCard span{padding-left:17px; font-size:12px; line-height:12px; color:#efe8ea; font-weight: 300; display: inline-block; vertical-align: middle; background:url('/html/images/new/ico_link2.png') left center no-repeat; background-size:5px auto;}
	.listType4 ul li .popText .in .text {font-size:14px; color:#efe8ea; font-weight:300; padding:40px 0 60px 0;}
	.listType4 ul li .popText .in .design {font-size:14px; color:#cab4ba; font-weight:500; }
	.listType4 ul li .popText .in .design span {font-size:16px; font-style: italic;}
	.listType4 ul li a:hover .popText {opacity:1;}
	.listType4 ul li a:hover .best {display: block;}
	.listType4 ul li.onlyText .popText {display: block;; min-height:0; padding-bottom:100%} 
	.listType4 ul li.onlyText .popText .in {position:absolute; height:100%; top:0; left:0; width:100%; transform:none; display:flex; align-items:center; justify-content: center;}
	.listType4 ul li.onlyText .popText .in .btnShowCard {position:absolute; top:10px; left:50%; margin-left:-58px;}
	.listType4 ul li.onlyText .popText .in .btnShowCard span { background-size:10px auto; background-position:left 10px;;}
	.listType4 ul li.onlyText .popText .in .text {max-height:100%; margin:0; padding:10px 10px 0 10px;  margin:10px 0;  color:#75384a; font-size:12px;}
	.listType4 ul li.onlyText .popText .in .design {position:absolute; left:0; bottom:10px; width:100%;}
	.listType4 ul li.onlyText .popText .in .design span {font-size:12px;}



	.detailMenu {position: fixed; left:0; top:auto; bottom:0; height:auto; z-index:150; background: #222222; transition:.3s all; width:100%;}
	.detailMenu .in { width:100%;padding:15px;  }
	.detailMenu .in .btnClose {position: absolute; right:50%; margin-right:-23px; top:-55px; margin-top:0;}
	.detailMenu .in .btnClose a {position: relative; display: block; text-indent:-999em;  width:45px; height: 45px; background:url('../images/port/ico_folder_m.png') no-repeat; background-size:45px auto;}
	.detailMenu.off {left:0; top:100%;}
	.detailMenu.off .btnClose a{transform:rotate(180deg); }

	.detailMenu .txtWrap {position: relative; padding-bottom:0; margin-bottom:0; border-bottom:none; margin-bottom:0; padding-bottom:0;}
	.detailMenu .txtWrap .tit01 {font-size:13px; color:#fff; font-weight:300; margin-bottom:0; margin-right:5px; display: inline-block; vertical-align: top;  padding-right:0;}
	.detailMenu .txtWrap .tit01 em{font-weight:700;}
	.detailMenu .txtWrap .tit02 {font-size:12px; color:#bf94a2; font-weight:300; padding-left:10px; position: relative; margin-bottom:0; display:block; padding-right: 25px;}
	.detailMenu .txtWrap .tit02:after {content:''; position: absolute; left:0; top:4px; background:#bf94a2;  width:1px; height:10px;}
	.detailMenu .txtWrap .detail {font-size:12px; color:#aaaaaa; font-weight:300; max-height:90px; overflow-y:auto; padding-top:15px; margin-top:15px; border-top:1px solid #333333;}
	.detailMenu .check {position: absolute; right:0; top:1px;}
	.detailMenu .check .num {display: inline-block; vertical-align: middle; font-size:12px; color:#bf94a2; font-weight:500; margin-right:0;}
	.detailMenu .check input {position: absolute; visibility: hidden;}
	.detailMenu .check label {width:18px; height:20px; display: inline-block; vertical-align: middle; text-indent:-999em; background:url('../images/ico_book_m.png') center no-repeat; background-size:17px auto;}
	.detailMenu .check input:checked + label { background:url('../images/ico_book_on_m.png') center no-repeat;  background-size:17px auto;}
	.detailMenu .txtWrap .btn {border-top:1px solid #292929; padding-top:20px; margin-top:20px;}
	.detailMenu .txtWrap .btn a {font-size:14px; color:#222222; background:#fff; height:45px; line-height:42px; display: block; text-align: center; font-weight:500;}
	.detailMenu .txtWrap .btn a span {padding-left:25px; background:url('../images/ico_dot01_m.png') left center no-repeat; background-size:15px auto;}

	.detailMenu.type2 .check label  {width:18px; height:20px;  background:url('../images/port/ico_heart01.png') center no-repeat; background-size:17px auto;}
	.detailMenu.type2 .check input:checked + label { background:url('../images/port/ico_heart01_on_m.png') center no-repeat;  background-size:17px auto;}


	.detailMenu .in .selectDv {display: none;}
	.detailMenu .in .selectDv .tit {font-size:20px;line-height:20px; color:#fff; font-weight:700; text-align: center; margin-bottom:20px; letter-spacing:-0.04em;}

	.detailMenu .in .control {position: static; width:100%; padding:15px 0;}
	.detailMenu .in .control:after {content:''; display: block; clear:both; }
	.detailMenu .in .control p {float:left; width:48.5%; }
	.detailMenu .in .control p:last-child {float:right;}
	.detailMenu .in .control p a {display: block; height:45px; line-height:43px; background:#fff; text-align: center; font-size:14px; color:#222222; font-weight:500;}
	.detailMenu .in .control p.link {margin-bottom:0;}
	.detailMenu .in .control p.link a span {padding-left:20px;  background:url('../images/port/ico_sharePop_m.png') left center no-repeat; background-size:15px auto;}
		

	#iframeWrap {width: 100%; height: 100vh;}
	#iframeWrap iframe{position: relative; width: 100%; height: 100vh; vertical-align: top;}
	#iframeWrap.tablet_dv {position: relative; right:56px; padding:60px 105px 0 0; margin-top:50px; width:844px; height:923px;   margin:50px auto 0 auto; background:url('../images/port/bgDevicePad.png?V=03') no-repeat; }
	#iframeWrap.tablet_dv .frameBox{position: relative; padding-left: 209px; position: relative; left:15px; top:7px;}
	#iframeWrap.tablet_dv .frameBox iframe { width:524px; height: 768px !important; margin:0 auto; display:block; border-radius:10px; background:#fff;}

	#iframeWrap.mobile_dv  {position: relative; right:56px; width:565px; height:923px; margin:50px auto 0 auto; padding-top:20px; background:url('../images/port/bgDeviceMob.png') no-repeat; }
	#iframeWrap.mobile_dv .frameBox {position: relative; border-radius:30px; padding-top: 82px; overflow:hidden; width:345px; margin-left:170px;}
	#iframeWrap.mobile_dv .frameBox iframe { width: 100%; height:720px !important;  display:block; overflow-x:hidden;  }


	.test {position: fixed; left:0; top:0; width:100%; text-align: center; z-index:999;}
	.sortingPort {position: relative;  }
	.sortingPort .value .lstBox:after {content:''; position: absolute; right:28px; top:50%; margin-top:-4px; width:14px; height: 85px; background:url('../images/port/ico_portSel.png') no-repeat; }
	.sortingPort .value .lstBox { background:#222222;}
	.sortingPort .value .lstBox span {height: 75px; line-height: 73px; border:1px solid #fff;}
	.sortingPort .value .lstBox.on:after {transform:rotate(180deg); }
	.sortingPort .value .lstBox.on {border-bottom-left-radius:0;  border-bottom-right-radius:0;}

	.sortingPort .lstBox {position: relative; cursor:pointer; }
	.sortingPort .lstBox br {display: none;}
	.sortingPort .lstBox span{position: relative; display: block;  font-size:18px;padding-left:30px; font-weight:300; color:#fff; }

	.sortingPort .lstValue {position: absolute; left:0; top:75px; width: 100%; background:#333333; overflow:hidden; border:1px solid #555555; display: none; z-index:5; padding:10px 0;}
	.sortingPort .lstValue .lstBox { padding:10px 0 10px 0}
	.sortingPort .lstValue .lstBox.hidden {display: none;}


	.popPort {position: fixed; left:0; top:0; width: 100%; height:100%; z-index:500; background:rgba(0,0,0,.5); display:flex; justify-content:center; align-items:center; padding:0 15px; }
	.popPort .in {position: relative; background:#fff; width:100%; padding:20px;}
	.popPort .in .text {padding-left:30px; padding-top:2px; background:url('../images/port/ico_port_warn.png') left top no-repeat; background-size:20px auto;}
	.popPort .in .text .tit01{font-size:12px; line-height:16px; margin-bottom:5px;}
	.popPort .in .text .tit02 {font-size:11px; color:#222222; font-weight:300; padding-right: 20px; word-break:keep-all;}
	.popPort .in .text .tit02 br {display: none;}
	.popPort .in .closeIco {position: absolute; right:20px; top:22px; width:12px; height:12px; background:url('../images/port/ico_port_close.png') left top no-repeat;  background-size:12px auto; cursor:pointer; }

	.topBanner  {display: none;}



	.detailMenu.type3 {border-top-left-radius:10px; border-top-right-radius:10px;}
	.detailMenu.type3 .in {width: 100%; padding:40px 15px 0; }
	.detailMenu.type3 .txtWrap .tit01 {font-size:15px; color:#222222; padding-right: 40px;  margin-bottom:12px; padding-bottom:12px; border-bottom:1px solid #eeeeee; width:100%;}
	.detailMenu.type3 .txtWrap .tit03 {display: inline-block; vertical-align: top; margin-bottom:10px; background:#f2f2f2; border-radius:7px; padding:3px 6px; font-size: 12px; font-weight:500; color:#aaaaaa;}
	.detailMenu.type3 .txtWrap .tit03 span { display: inline-block; height: 10px; line-height:10px; }
	.detailMenu.type3 .txtWrap .tit03 span:first-child {margin-right: 5px; padding-right: 7px; border-right:1px solid #d9d9d9;}
	.detailMenu.type3 .txtWrap .detail {color:#555555; max-height:100%; height:130px; padding-right:10px; border-top:none; padding-top:0 ; margin-top: 0; margin-bottom:10px;}
	.detailMenu.type3 .txtWrap .detail::-webkit-scrollbar {width: 3px;	  }

	.detailMenu.type3 .check {overflow:hidden;  height: 24px; background:#f8f4f6; border-radius:6px; padding:5px 10px;}
	.detailMenu.type3 .check .num {margin-right: 0; font-size: 13px; float:right; height: 13px; line-height: 13px; }
	.detailMenu.type3 .check label  {float:left; margin-right: 3px; width:16px; height:14px;  background:url('../images/port/ico_heart03_off_m.png') center no-repeat; background-size:16px auto;}
	.detailMenu.type3 .check input:checked + label { background:url('../images/port/ico_heart03_m.png') center no-repeat; background-size:16px auto;}
	.detailMenu.type3 .in .btnClose {position: absolute; right:auto; left:50%; margin-left:-20px;  top:13px; margin-top:0;}
	.detailMenu.type3 .in .btnClose a {box-shadow:none; width:30px; height:13px; border-radius:0; background:url('../images/port/ico_folder_open_m.png') no-repeat; background-size:30px auto;}
	.detailMenu.type3.off {left:0;}
	.detailMenu.type3.off .btnClose a{transform:rotate(180deg);  display: none;}

	.detailMenu.type3 .btnCloseText {position: absolute; right:auto; left:50%; margin-left:-85px; top:-40px;}
	.detailMenu.type3 .btnCloseText a {font-size:15px; border-radius:0; width:170px; height:40px; line-height:40px; text-align: center; border-top-left-radius:10px; border-top-right-radius:10px;}
	.detailMenu.type3 .btnCloseText a span {display: inline-block; padding-left: 22px; padding-right: 0;  background:url('../images/port/ico_folder_close_m2.png') left center no-repeat; background-size:13px;;}
	.detailMenu.type3.off .btnCloseText {display:block; }

	.detailMenu.type3 .in .selectDv {padding: 25px 0 0 0; left:25px; bottom:25px; width:calc(100% - 50px);    border-top:1px solid #eeeeee;}
	.detailMenu.type3 .in .selectDv .warn { margin-bottom:15px; font-size:14px; line-height:20px; color:#222222;  font-weight:300; padding-left:27px; background:url('../images/port/ico_warn03.png') left 0 no-repeat; }

	.detailMenu.type3 .sortingPort .value .lstBox {background:#fff; border:1px solid #222222; border-radius:10px;}
	.detailMenu.type3 .sortingPort .value .lstBox span {height:65px; line-height:64px;  font-weight:500; color:#222222; border:none;}
	.detailMenu.type3 .sortingPort .value .lstBox:after {right:24px; width:15px; height:9px; background:url('../images/port/ico_portSel01.png') right center no-repeat;}
	.detailMenu.type3 .sortingPort .lstValue {top:49px; background:#fff; border:1px solid #222222; border-top:none; border-bottom-left-radius:10px;  border-bottom-right-radius:10px; }
	.detailMenu.type3 .sortingPort .lstValue .lstBox {padding:5px 0; }
	.detailMenu.type3 .sortingPort .lstValue .lstBox span {font-weight:15px; color:#222; }

	.btnBalck { margin-top:10px; margin-bottom:7px; margin:7px -8px; display:block;}
	.btnBalck a {text-align: center; background:#222222 ;font-size:15px; color:#fff; display: block; font-weight:500; height:50px; line-height:50px; border-radius:10px; }


}