@import url(http://fonts.googleapis.com/css?family=Droid+Serif);

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;  
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section,{
    display: block;
}
body {
}
ol, ul,li {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

#smartfabric_wrap .clear01{
clear:both;
}

#smartfabric_wrap{
max-width: 900px;
height: auto;
margin: 0 auto;
padding: 20px;
}

.material_wrap{
max-width: 900px;
height: auto;
margin: 0 auto;
}

#smartfabric_wrap .container{
/* padding:0 30px; */
}

#smartfabric_wrap .smsf_header{ /*占쎄쑴猿� 占쎄낯�� 占썬끇��*/
display: block;
width: 100%;
height: 40px;
line-height: 40px;
font-size: 12px;
font-weight: normal;
color: #000; 	
text-align: left;
font-family: 'Droid Serif', serif;
}

#smartfabric_wrap .smsf_header b{
color: #000;	
}

#smartfabric_wrap .smsf_header b span{
color: #ffb657;	
font-weight: normal;
font-size: 7px;
}

/* --- 占쎄쑬以덌옙類λ뱜 占쎈챸猷� 占쎌뮇�� --- ///////////////////////////////////////////////////// */
#detail_text .text_con{
font-size:12px;
text-align:center;
color: #777;
padding:30px;
line-height:18px;
}

#detail_text .text_con b{
font-weight:bold;
}

#product_wrap{
display: block;
width: 100%;
height: auto;
clear: both;
overflow: hidden;
}

.product_img{
display: block;
width: 39%;		
float: left;
margin-top: 14px;
}

.product_img img{
display: block;
text-align: center;
margin: 0 auto;
}

.product_info{
display: block;
float: right;
width: 60%;
color: #6C6C6C;
text-align: left;
font-weight: normal;
font-size: 11px;
line-height: 16px;	
margin-top: 27px;
}

.product_info div ul{
	position: relative;

	width:100%;

	/* display: block; */
	/* border-bottom: 1px solid #ddd; */
}


.product_info div li{
	display: inline-block;
/* float: inherit; */

	/* min-height:30px; */

	overflow:hidden;
width:67%;

	padding: 1px;

	margin: 0px;

	vertical-align: middle;
}

.smsf_sizeinfo_line li{
float: left;
}


.product_info div li.title{
width: 20% !important;
font-weight: bold !important;
color: #4C4C4C !important;
text-decoration: underline !important;
line-height: 30px !important;
}

.product_info_detail{
display: block;
float: right;
width: 50%;
height: auto;
color: #6C6C6C;
text-align: left;
font-weight: bold;
font-size: 11px;
line-height: 28px;
margin-top: 27px;
border-bottom: 1px solid #ddd;
}

.product_info_detail ul{
display: block;
height: 35px;
line-height: 35px;
border-top: 1px solid #ddd;
}

.product_info_detail ul:last-child{font-weight: normal;}

.product_info_detail li{
display: inline-block;
float: left;
width: 16.6%;
text-align: center;
}

/* --- 占쎄쑬以덌옙類λ뱜 占쎈챸猷� 占쏙옙 --- ///////////////////////////////////////////////////// */


/* --- 占싼딆뵠筌앾옙 占쎈챸猷� 占쎌뮇�� -- ///////////////////////////////////////////////////// */
.skin_info_wrap{
width: 100%;
display: block;
float: left;
}

.smsf_sizeinfo{
width: 100%;
height: auto;
margin: 10px auto 1px;
}

.smsf_sizeinfo span.unit{
display:inline-block;
width:100%;
text-align:left;
font-size:11px;
color:#555;
padding:3px 0;
}

.smsf_sizeinfo ul{
display:inline-block;
width: 100%;
vertical-align: top;
}

.smsf_sizeinfo_line{
	overflow: hidden;

	border-left: 1px solid #bcbcbc;
}

.smsf_sizeinfo ul li{
width: 12.5%;
/* float: left; */
color: #8C8C8C;
text-align: center;
font-size:12px;
line-height: 27px;
background: #fff;
border-right: 1px solid #BCBCBC;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
margin-bottom: 0 !important;
border-bottom: 1px solid #BCBCBC; 
}


*div.smsf_sizeinfo ul li{width: 11%;}
.smsf_sizeinfo ul li{width: 11%\0/IE8+9;}
*div.smsf_sizeinfo span.unit {width: 97%;}
.smsf_sizeinfo span.unit {width: 93%\0/IE8+9;}


.smsf_sizeinfo ul li:nth-child(1){
	margin-bottom: 0 !important;
}

.smsf_sizeinfo ul:last-child{
	/* border-bottom: 1px solid #BCBCBC;*/
}

.smsf_sizeinfo ul.title01 li{
/*border-top: 1px solid #BCBCBC;*/
border-top: 1px solid #BCBCBC; 
}

.smsf_sizeinfo ul:nth-child(2) li{
/*border-top: 1px solid #BCBCBC;*/
line-height: 25px;
}

.smsf_sizeinfo ul.title01 li{
background: #DADADA !important;
color: #2D2D2D;
font-size: 11px;
overflow: hidden;
margin-bottom: 0 !important;
line-height: 25px;
}

.smsf_sizeinfo ul li b{ /*占썬끇梨�*/
display: block;
background: #fff;
line-height: 28px;
height: 30px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}

.skin_info_wrap .smsf_sizeinfo_text{
	position: relative;
	clear: both;
display: block;
font-size: 11px;
height: auto;
line-height: 20px;
text-align: left;
}

/* --- 占싼딆뵠筌앾옙 占쎈챸猷� 占쏙옙 --  ///////////////////////////////////////////////////// */


/*占쎈슣�� 占쏙옙 ///////////////////////////////////////////////////// */
.wahhing_icon{
width: 50%;
float: right;
height: auto;
border-bottom: 1px solid #ddd;
padding-bottom: 15px;
}

.wahhing_icon ul{
width: 100%;
}

.wahhing_icon ul li{
width: 20%;
float: left;
color: #555;
text-align: center;
font-size: 12px;
background: #fff;
}

.wahhing_icon .red_check li{height: 18px; padding-top: 5px; margin-top: 20px;}
.wahhing_icon .red_check li b{
display: block;
width: 7px;
height: 7px;
background: #444;
margin: 0 auto;
}

.wahhing_icon .red_check li b.check_red{ background: #ED4141;}
.wahhing_icon .red_check li b.check_black{ background: #444; }

.wahhing_icon .red_img li{height: 55px;}
.wahhing_icon .red_img li img {
display: block;
margin: 0 auto;
width: auto;
max-width: 100%;
}

.wahhing_icon .red_text { }
.wahhing_icon .red_text li{ height: 20px; line-height: 20px; }

.wahhing_bottom_text{
display: block;
width: 60%;
height: auto;
margin: 10px 0px;
float: right;
}

.wahhing_bottom_text div{
width:100%;
}

.wahhing_bottom_text div li{
width: 98%;
font-size: 11px;
line-height: 16px !important;
text-align: left;
margin: 0px;
vertical-align: middle;
color:#6A6A6A;

}

.wahhing_bottom_text div li.title{width:2%;vertical-align: top;}

.wahhing_bottom_text ul li .enter{
font-weight:normal;
margin-left:10px;
}

/*占쎈슣�� 占쏙옙 ///////////////////////////////////////////////////// */



/*筌띲끋�껆뵳�堉� /////////////////////////////////////////////////////*/
.material_wrap{
width: 100%;
height: auto;
margin: 80px auto 0;
clear: both;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}

.material_icon{
width: 100%;
height: auto;
}

.material_icon ul{
width: 100%;
height: auto;
clear: both;
overflow: hidden;
}


.material_icon ul li{
width: 20%;
float: left;
color: #555;
font-size: 11px;
text-align: left;
overflow: hidden;
/* border-bottom: 1px solid #ddd; */
text-indent: 18px;
margin-bottom: 0 !important;
height: 33px;
line-height: 33px;
}

.material_icon ul{
border-bottom: 1px solid #ddd;
}

.material_icon ul:last-child li{ border-bottom: none;}

.material_icon .red_check li b{
display: inline-block;
width: 7px;
height: 7px;
background: #444;
margin-right: 5px;
margin-left: 5%;
}

.material_icon ul li.material_header{ 
background: #fff;  
text-align: center; 
text-indent: 0px; 
color:#444; 
font-weight: bold;
overflow: hidden;
height: 33px;
line-height: 33px;
}

.material_icon .red_check li b.check_red {
background: #ffb657;
border: 1px solid #B2B2B2;
}

.material_icon .red_check li b.check_black{ 
	background: #fff; 
	border:1px solid #B2B2B2;
}


.material_wrap .wahhing_bottom_wrap{
	display: block;
width: 100%;
}

.material_wrap .wahhing_bottom_wrap .wahhing_bottom_text{
	width: 100%;
	border-bottom: 1px solid #ddd;
	padding-bottom: 15px;
}
/*筌띲끋�껆뵳�堉� /////////////////////////////////////////////////////*/

#sms_btns{
margin:30px 0px;
text-align:center;
overflow:hidden;
}

#sms_btns div{
width:50%;
float:left;
}

#sms_bottom_text{
text-align:center;
font-size:12px;
line-height:18px;
margin:0 0 30px;
}






/* 960 over screen size (for PC) */
@media only screen and (min-width: 960px) {
}
	
/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {		
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
#smartfabric_wrap{ padding: 5px !important;}
#smartfabric_wrap .container{ padding: 0 !important; }
#detail-item .others-wrap li{font-size: 11px;}
#product_wrap{ height: auto; }
.product_img{ width: 100%; }
.product_info{ width: 100%; }
.product_info_detail{ width: 100% }
.wahhing_icon{ width: 100%; }
.wahhing_bottom_text{ width: 100%;  margin-bottom: 8px; }
.material_wrap{width: 100%; margin-top: 20px;}
.material_icon{ width: 100% }
.wahhing_icon ul li{font-size: 11px;}
.wahhing_bottom_wrap{padding-left: 0px;}
#sms_btns div img{width:100%;}
.smsf_sizeinfo ul li{margin-bottom: 0 !important;}
.wahhing_bottom_text div li.title {width: 2%; vertical-align: top !important; }
#container .title{ vertical-align: top !important; line-height: 20px !important;}


#detail-item .others-wrap ul { 
padding-top: 0px; 
vertical-align: top;
height: auto;
display: block;
overflow: hidden;
}


/* .smartskinDetailImagesLoader .smartskinDetailImagesContent li{padding: 3px !important;} */
.material_icon ul li{text-indent: 0px;}
#detail_text .text_con {padding: 30px 5px 30px 5px;}
#smartfabric_wrap .clear {
clear: both;
visibility: inherit !important;
width: 100%;
height: auto;
text-align: center;
margin: 0 auto;
overflow: hidden;
}

.material_icon ul li {
width: 20%;
float: left;
color: #555;
font-size: 11px;
text-align: left;
overflow: auto;
margin-bottom: 0 !important;
height: auto !important;
}

.product_info div li.title{
width: 20% !important;
font-weight: bold !important;
color: #4C4C4C !important;
text-decoration: underline !important;
}


.wahhing_bottom_text div li{
	line-height: 16px;
}

}



/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px){					
}



/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 400px) {
/*/////////////*/
.smsf_sizeinfo ul{
width: 50%;
display: inline-block;
border: none;
border-bottom: 1px solid #CECECE;
}
.smsf_sizeinfo ul:nth-child(1){border:none;}
.smsf_sizeinfo ul li:nth-child(1) { border-left: none;}
.smsf_sizeinfo ul li{
width: 100%;
display: inline-block;
float: left;
border-top:1px solid #CECECE;	
border-right: 1px solid #CECECE;
height: 30px;
line-height: 24px !important;
}

.smsf_sizeinfo ul:last-child {border-bottom: 1px solid #CECECE;}
.smsf_sizeinfo ul:nth-child(2) {border-bottom: 1px solid #CECECE;}
.smsf_sizeinfo ul:first-child {border-bottom: 1px solid #CECECE !important;}
.smsf_sizeinfo ul.title01 li {
background: #E8E8E8;
color: #2D2D2D;
font-size: 11px;
overflow: hidden;
border-left: 1px solid #dadada;
line-height: 24px !important;
}

/*#detail-item .others-wrap ul{border-bottom:1px solid #ddd;}*/

.material_icon ul{
	padding: 4px 0 !important;
}

.material_icon ul li.material_header{ 
width: 43px;
}

.material_icon ul li {
width: 20%;
}

.smsf_sizeinfo_line {
border-top: none; 
}


.smsf_sizeinfo_line{
display:box !important;
display:-webkit-box!important;
display:-moz-box!important;
box-orient:horizontal!important;
-webkit-box-orient:horizontal!important;
-moz-box-orient:horizontal!important;
width:100%!important;
line-height:0!important;
padding:0!important;
margin:0 auto!important;
}

.title01, .con {
box-flex:1!important;
-webkit-box-flex:1!important;
-moz-box-flex:1!important;
}






.smsf_sizeinfo_line{
	overflow: hidden;

	border-bottom: none;
}


/* .material_icon ul li{
line-height: 34px !important;	
} */

.product_info div li.title{
width: 20%;
font-weight: bold;
color: #4C4C4C;
text-decoration: underline;
line-height: 30px !important;
}

.smsf_sizeinfo ul li {
border-bottom: none;
}

/*/////////////*/
}




.material_icon .red_check li b.check_red,
.material_icon .red_check li b.check_black{
	display: none;
}

.material_icon .red_check li span{
	background: #FFD9A6;
	padding: 5px;
}

/*/////////////*/
}