#view_skin{
	min-width: 800px; overflow:hidden;
	margin: 0px auto 100px;
} 

#view_skin *{
	margin: 0px;
	padding: 0px; letter-spacing:0;
	
	font-family: "Noto Sans KR", sans-serif;

	line-height: normal;
}

#view_skin > h1.title{
	margin: 50px 0px;
	font-size: 30px;
	font-weight: normal;
}

.btngro{text-align:center; padding-top:50px !important}
.btn{display: inline-block;
    padding: 10px 15px !important;
    color: #fff !important;
    text-align: center;
    letter-spacing: -1px;
    vertical-align: middle;
    box-sizing: border-box;
    min-width: 200px;
    padding: 10px 40px; background-color: #595bd1 !important;}
	
.productable{width: 100%;
    border-collapse: collapse;
    border-top: 1px solid #dbdbdb;
    border-right: 1px solid #dbdbdb;}
.productable thead th,
.productable tbody th{padding:15px 0 !important;font-size:14px;color:#666;border-bottom:1px solid #dbdbdb;border-left:1px solid #dbdbdb;background:#f8f8f8; font-weight:400}
.productable tbody td{padding:7px 2px !important;font-size:14px; text-align:center;color:#666;border-bottom:1px solid #dbdbdb;border-left:1px solid #dbdbdb; min-width: 70px;} 

#view_skin .stcation{background: #FAFAFA;
    padding: 10px;
    display: inline-block;
    margin-top: 50px;
    font-size: 14px;
    font-weight: 500;
    color: #1f70c3;}
#view_skin .stcation span{font-weight:500; background:#1f70c3; padding:1px 5px;}
#view_skin .stcation span a{ color:rgba(255,255,255,1)}
.imgbig {display: table;
    padding: 10px !important;
    border: 1px solid #eee;
    width: 470px;
    height: 470px;
    text-align: center;
    box-sizing: border-box;    display: table-cell;
    vertical-align: middle;}
.imgbig img{width:auto; max-width:100%}

.proimg{float:left;width:550px;position:relative;}
.standard{float:right;width: calc(100% - 600px);}
.standard h3{font-size:24px; font-weight:400; padding: 10px 0 !important;
    border-bottom: 1px solid #999; margin-bottom: 20px !important;}
.prodetail{padding-top:50px !important;}

.prodetail .tit{padding-bottom:50px !important;}

 .imgthb{position:absolute;top:0;right:0;height: 400px;width:70px;}
.imgthb ul li{position:relative;margin-bottom:10px;background:#fff;display: inline-block;}
.imgthb ul li img{width:65px;height:65px;border:1px solid #eee;cursor:pointer;/* margin-left: -50px !important; */}
.imgthb ul li a{display:table;border:1px solid #eee}
.imgthb ul li a i{position:absolute;top:0;right:0;display:none;width:70px;height:70px;line-height:70px;font-size:24px;text-align:center}
.imgthb ul li a:hover i{display:block}
.imgthb ul li:hover img{opacity:0.7}

.khwrap{overflow:hidden; position: relative;}



#view_skin > h2.subject{
	height: 70px;
	padding: 0px 20px;
	border-top: 1px solid #333333;
	border-bottom: 1px solid #CCCCCC;
	font-size: 18px;
	font-weight: normal;
	line-height: 70px;
	clear:both;
}

#view_skin > h2.subject .subjectlist{float:right; line-height: 70px;}
#view_skin > h2.subject p{ display:inline; color:#a3a3a3; padding-left:10px; font-weight:300}

#view_skin > table.view{
	width: 100%;
	border-collapse: collapse;
}

#view_skin > table.view > tbody > tr > td{
	width: 180px;
	height: 50px;
	padding: 0px 20px;
	border-bottom: 1px solid #CCCCCC;
	color: #333; font-size:16px;
}

#view_skin > table.view > tbody > tr > td.wide{
	width: 200px;
}

#view_skin > table.view > tbody > tr > td.auto{
	width: auto;
}

#view_skin > table.view > tbody > tr > td > span{
	margin-left: 10px;
}

#view_skin > table.view > tbody > tr > td > a{
	margin-left: 10px;
	text-decoration: none;
}

#view_skin > table.view > tbody > tr > td > a:hover{
	color: #0066CC;
}

#view_skin > div.content{
	min-height: 300px;
	padding: 20px 0; width: 100%;
	
}

#view_skin > div.content > a{
	display: inline-block;
	margin-bottom: 20px;
}

#view_skin > div.content > ul{
	list-style: none;
	margin-top: 20px;
	text-align: right;
}

#view_skin > div.content > ul > li{
	display: inline-block;
}

#view_skin > div.content > p{
	margin-top: 20px;
	padding: 20px;
	border-radius: 10px;
	background-color: #F5F5F5;
}

#view_skin > p.button{
	margin: 40px 0px;
	text-align: center;
	clear: both; 	font-size: 16px;
}

#view_skin > p.button > a{
	display: inline-block;
	height: 30px;
	padding: 0px 15px 0px 15px;
	background-color: #333333;
	color: #FFFFFF;
	font-weight: normal;
	line-height: 30px;
	text-decoration: none;
}

#view_skin > p.button > a > span{
	color: #FFFFFF;
}

#view_skin span.sv_wrap > a > img{
	height: 21px;
	vertical-align: -6px;
}

#view_skin span.sv_wrap > span.sv{
	margin: 0px;
	padding: 5px 0px;
	border: 1px solid #CCCCCC;
	background-color: #FFFFFF;
	text-align: left;
}

#view_skin span.sv_wrap > span.sv > a{
	width: 80px;
	padding: 5px 10px;
	border-style: none;
	background-color: #FFFFFF;
	color: #333333 !important;
	font-size: 12px;
}

#view_skin > p.button > a.listbtn{ background:#75777f; width:120px; height:40px; line-height:40px; text-align:center; box-sizing:border-box; display:block; float:right; margin-bottom: 10px;}

#view_skin .previco a{height:40px; line-height:40px; width:120px; background:url(../img/previco.png) no-repeat 20px center; padding-left:50px; box-sizing:border-box; border:1px solid #e8e8e8; display:block; float:left ; margin-right:-1px; }
#view_skin .nextico a{height:40px; line-height:40px; width:120px; background:url(../img/nextico.png) no-repeat 80px center; padding-left:30px; box-sizing:border-box;  border:1px solid #e8e8e8; display:block; float:right}
#view_skin .btnw{overflow:hidden; float:left; margin-top:40px; width: 100%; margin-bottom:20px !important }

.youtubeWrap{text-align:center; padding-top:20px !important;}
.tbt{text-align:center; padding:20px 0  5px !important;} 
.profetit {    font-size: 17px;    color: rgba(0,51,153,1);    padding-bottom: 5px !important;}
.productit{font-size:18px; padding-bottom:30px !important; font-weight:600; padding-top:50px !important}
.profew{display:flex; margin-bottom:50px !important}
.profeDiv{flex:1;}
.profeDiv ul li:before{width:3px; height:3px; background:rgba(102,102,102,1); border-radius:3px; content:''; display:inline-block; position:absolute; left:0; top:10px}
.profeDiv ul li{padding-left:10px !important; position:relative}

.productable2{width:100%; border-top: 1px solid #dbdbdb; border-right: 1px solid #dbdbdb;}
.productable2 td{padding: 7px 2px !important;
    font-size: 14px;
    text-align: center;
    color: #666;
    border-bottom: 1px solid #dbdbdb;
    border-left: 1px solid #dbdbdb;
    min-width: 70px;}
.prosimg{margin: 50px 0 !important;    text-align: center;}
.prosimg img{width:250px; display:inline-block; padding:0 20px !important}

.productit2{font-size:20px;  font-weight:600; padding-top:50px !important}
.prodc{padding-bottom:50px !important;  padding-top:20px !important}
.proTec{text-align:center;}
.proTec span{display:inline-block; padding:0 20px !important}
.proTec .t1 img{width:300px;}
.proTec .t2 img{width:200px;}
.proTec .t3 img{width:200px;}
.proTec2 img{width:80%;}
.proTe3c img{width:40%;}
.proTe3c, .proTec2 {text-align:center;}
.probox-t{padding-bottom:20px !important; font-size:17px}
.probox-img{padding-bottom:30px !important;}
.mdboxw{overflow:hidden; display:flex}
.mdbox{  flex:1; padding: 10px !important;}
.mdbox img{width:100%;}
.mdboxt{text-align:center; font-size:18px; }
.mdboxt span{font-weight:500;}


@media only all and (max-width: 1130px){
.imgthb{position:relative; left:0; height: auto;    width: 100%; top: 5px;}
.imgthb ul li{display:inline-block;}
}
@media only all and (max-width: 1024px){
#view_skin{min-width:100%; margin-top:20px; margin-bottom:0px;}
#view_skin > h2.subject{height:auto; font-size:15px; line-height:inherit; overflow:hidden; padding:10px 0}
#view_skin > table.view > tbody > tr > td{padding:0; width:100%; display:block; height:auto; padding:10px 0}
#view_skin > table.view > tbody > tr > td.auto{width:100%;}
#view_skin > table.view > tbody > tr > td.wide{width:100%;}
#view_skin > h2.subject .subjectlist{line-height:inherit;}
#view_skin > h2.subject p{line-height:none;}
#view_skin > p.button > a.listbtn{float:none; margin:50px auto 0;}
.standard{width:100%;}
.overtable{overflow-x:scroll;}
}

@media only all and (max-width: 840px){
.proimg{width:100%;}

.imgbig{width: 100%;
    padding: 10px !important;
    box-sizing: border-box; height: 300px; display: table-cell;    vertical-align: middle;}
.standard h3{font-size:20px;}
.stable-in{overflow:scroll;}
.stable-in table{width:600px;}
.productable tbody td{padding:5px 0 !important; font-size:12px}
#view_skin > div.content{padding:0;}
.imgthb ul li img{margin-left:0 !important;}
.productable{width: 550px;}
.productable thead th, .productable tbody th{font-size:13px;}
.mdbox{display:block; flex:none;}
.mdboxw{display:block;}
}