@charset "utf-8";
/* CSS Document */

/* MATERIALS ******************************** */
.nav{margin: 0;}

.nav-tabs.nav-justified > li > a {
  border-bottom: 1px solid #ddd;
  border-radius: 10px 10px 0 0;
}
.nav-tabs > li {
  font-size: 16px;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
  color: #3296e6;
  cursor: default;
}

/* FOAM
 ******************************** */
.topslides {
	position: relative;
	list-style: none;
	overflow: hidden;
	width: 100%;
	padding: 0;
	margin: 0;
}
.topslides li {
	-webkit-backface-visibility: hidden;
	position: absolute;
	display: none;
	width: 100%;
	left: 0;
	top: 0;
}
.topslides li:first-child {
	position: relative;
	display: block;
	float: left;
}
.topslides img {
	display: block;
	height: auto;
	float: left;
	width: 100%;
	border: 0;
} 

.materials_sd{
	max-height: 500px;
	overflow: hidden;
}
.foam_type{
	position: absolute;
	top:40%;
	left: 0;
	right: 0;
	text-align: center;
	color: #ffffff;
	text-transform: uppercase;
}
.mover .foam_type h1{
	font-size: 28px;
	padding-bottom: 10px;
}
.foam_type h1{
	font-size: 45px;
	padding-bottom: 10px;
}
.foam_type p{
	font-size: 16px;
}
.mover .foam_type p{
	font-size: 14px;
}
.viscoform{
	background-color: #3296e6;
	position: relative;
	line-height: 1;
	text-align: center;
}
.viscoform ul{
	display: inline-block;
}
.viscoform li{
	float: left;
	padding: 20px 30px;
}
.viscoform li a{
	color: #000000;
	font-size: 18px;
}
.viscoform li a:hover, .viscoform li.active a{
	color: #ffffff;
}

.materials_item{
	text-align: center;
	padding-top: 90px;
}
.materials_item dd{
	padding-top: 30px;
	line-height: 1.6;	
}
.dd_tit{
	font-size: 20px;
}
.materials_bg{
	display: block;
	position: relative;
}
.materials_bg p{
	width: 100%;
	height: 700px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	margin-top: 60px;
}
.materials_bg p span{
	color: #ffffff;
	display: block;
	width: 60%;
	position: absolute;
  left: 20%;
	right: 0;
	bottom: 20px;
	text-align: center;
}
.vfoam{
	background-image: url('../images/07material_img/female_memory.jpg');
	background-repeat: no-repeat;
	background-position: 100% 50%;
	margin-bottom: 30px;
	padding-top: 60px;
}
.memory_info .memory_tit{
	font-size: 20px;
	color: #3296e6;
	padding-bottom: 10px;
}
.memory_info > dd > img{
	padding: 0 0 40px;
	width: 360px;
	height: auto;
}
.memory_info .memory_p{
	line-height: 1.6;
	padding-bottom: 40px;
}
.memory_info.trma{
	text-align: center;
	padding-top: 60px;
}
.material_visual{
	padding-bottom: 100px;
}
.material_visual.pd_trans{
	padding-top: 60px;
}
.material_visual.pd_trans02{
	padding-top: 60px;
	padding-bottom: 0;
}
.material_visual.pd_trans > div{
	text-align: center;
}
.material_visual.pd_trans > div > h1, .material_visual.pd_trans > div > h2{
	color: #646464;
}
.material_visual.pd_trans > div > h1{
  font-family:'GothamBook', "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform: uppercase;
  line-height: 1;
	padding: 60px 0 20px;
}
.material_visual.pd_trans > div > h2{
	padding-bottom: 60px;
}	
.material_visual.pd_trans > div > img{
	padding-top: 60px;
}	
.material_visual.line{
	border-bottom: 1px solid #efefef;
}
.material_name {
	padding: 30px 0 15px;
}
.material_name h2{
	color: #3296e6;
	font-size: 28px;
}
.material_name p{
	font-size: 14px;
	color: #ccc;
}
.temper_info{
	padding: 30px 30px 0;
}
.temper_info dt{
	font-size: 20px;
	line-height: 2;
}
.more{
	text-align: center;
	padding: 25px 0 20px;
	margin: 0;
	background-color: #eee;
}
.visco_item{
	text-align: center;
	display: inline-block;
}
.visco_item dd{
	float: left;
	margin-right: 30px;
}
.visco_item dd:last-child{
	margin-right: 0;
}
.visco_item dd p{
	padding-top: 30px;
}
.visco_item dd a{
	display: block;
	border-radius: 10px; 
	padding: 10px 20px;	
	color: #bbb;
}
.visco_item dd a:hover{
	background-color: #ffffff;
	color: #646464;
}

.colorbox01{
	background-color: #efefef;	
}
.colorbox02{
	background-color: #99ccff;
}
.colorbox03{
	background-color: #004e8c;
}
.colorbox01 dl, .colorbox02 dl, .colorbox03 dl  {
	height: 320px;
	padding: 20px;
}
.colorbox01 dl dt, .colorbox02 dl dt, .colorbox03 dl dt{
	padding-bottom: 60px;
	line-height: 2;
}
.colorbox01 dl dd, .colorbox02 dl dd, .colorbox03 dl dd{
	text-align: justify;
}
.colorbox03 dl{
	color: #ffffff;
} 
.colorbox03.bgimg{
	background-image: url('../images/07material_img/female_bluetex02.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

/* --------- Blue tex --------- */
.bluetex_layer{
	padding-top: 130px;
	padding-bottom: 60px;
	text-align: left;
}
.bluetex_layer dl dt{
	width: 100%;
}
.bluetex_layer dl dt img{
	width: 100%;
}
.bluetex_layer dl .kr_en_tit{
	font-size: 20px;
	line-height: 1.6;
	padding: 30px 0 5px;
	color: #004e8c;
}

.bluetex_layer dl .kr_en_tit span{
	color: #646464;
	font-size: 17px;
	padding-left: 10px;
}

.bluetex_layer .col-md-6{
	padding: 0;
}
.bluetex_layer .col-md-6.lf{
	padding-right: 30px;
}
.bluetex_layer .col-md-6.rt{
	padding-left: 30px;
}
.baby{
	padding-top: 60px;
}

.upper{
	text-transform: uppercase;
}
.coolinfo{
	padding-top: 60px;
	text-align: center;
}
.imgbox02{
	display: inline-block;
}
.imgbox02 dd{
	float: left;
	padding: 20px 20px 60px;
}
.bioinfo, .ball_info{
	padding: 60px 0;
}
.bioinfo img{
	width: 35%;
	float: left;
}
.bioinfo dl{
	width: 65%;
	padding-left: 90px;
	text-align: justify;
	display: inline-block;
}
.row.ballimg{
	padding-top:30px;
}
.col-md-4.ballimg{
	padding: 0;
}
.pd_transimg{
	padding-top: 20px;
}
.pressure{
	display: inline-block;
	padding-top: 20px;
}
.pressure dl{
	float: left;
	margin: 0 30px;
}
.pressure01{
	width: 300px;
	text-align: justify;
}
.pressure02{
	width: 500px;
	text-align: justify;
}
.pressure01 dt, .pressure02 dt{
	width: 100%;
}
.pressure01 .tit, .pressure02 .tit{
	padding: 30px 0 10px;
	font-size: 18px;
	color: #3296e6;
}
.ball_infogram{
	padding-top: 100px;
}
.infogram{
	width: 15%;
	border: 1px solid #99ccff;
	height: 300px;
	padding: 30px 20px;;
	margin: 0 8px;
	display: inline-block;
}
.infogram dl{
	float: left;
}
.infogram dl dt img{
	margin: 0 auto;
}
.infogram dl dt{
	padding-bottom: 30px;
}
.infogram dl h4{
	padding-bottom: 10px;
}
.infogram dl dd{
	font-size: 13px;
}

.poly{
	padding-top: 60px;
}
.poly_hd{
	text-align: center;
	color: #004e8c;
	line-height: 1.6;
	padding: 90px 0 60px;
}
.polymain{
	position: relative;
}
.polymain p{
	position: absolute;
	right: 2%;
	bottom: 2%;
}
.row.hd{
	padding-top: 60px;
}
.col-md-6.hdl{
	padding-right: 50px;
	padding-left: 0;
}
.col-md-6.hdr{
	padding-right: 0;
	padding-left: 50px;
}
.col-md-6.hdl dl dt, .col-md-6.hdr dl dt{
	color: #3296e6;
	padding-bottom: 10px;
}
.col-md-6.hdl dl dd, .col-md-6.hdr dl dd{
	padding-bottom: 60px;
	text-align: justify;
}
.sg_slider{
	max-height: 600px;
}
.carousel-control.sg_slider{
	width: 10%;
}
.sg_slider dl{
	position: absolute;
	bottom: 15%;
	left: 10%;
}
.sg_slider dl dt h1{
	font-family: 'NanumBarungothicB';
	padding-bottom: 5px; 
}
.sg_slider dl dt h1 b{
	font-family: 'Roboto';
	font-size: 54px;
	padding-bottom: 5px; 
}
.sg_slider dl dt h1 span{
	font-family: 'NanumBarungothicL';
	font-size: 18px;
}
.sg_slider dl dt img{
	width: 180px;
	padding-bottom: 15px;	
}
.foam_en{
	padding-bottom: 20px;
}
.sg_slider dl h2{
	padding-bottom: 20px;
}
.sg_slider p{
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	height: 600px;
}
.control { position: relative; top: 45%; z-index: 5; display: inline-block; /*! right: 50%; */} 
.white{
	color: #ffffff;
}
.container.cellpur{
	padding-top: 100px;
}
.memory_info.cellpur{
	padding-top: 60px;
	text-align: justify;
}
.tencel{
	border: 1px solid #00a2a4;
	padding: 60px 150px;
	text-align: center;
	margin-top: 30px;
}
.tencel ul{
	display: inline-block;
}
.tencel ul li.col-xs-12{
	clear: both;
	padding-bottom: 60px;
}
.tencel ul li img{
	margin: 0 auto;
}
.tpd{
	padding: 10px 0;
}
.tencel_info{
	text-align: left;
	padding: 30px 15px 0;
}
.tencel_info dt{
	font-size: 24px;
	line-height: 1.8;
	color: #00a2a4;
}
.tencel_info dd img{
	padding-top: 90px;
}
.tencel_info dt h3{
	color: #646464;
	padding-top: 20px;
}

.materials_bg2 p{
	width: 100%;
	height: 500px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.mtls_img{
	padding-top: 60px;
}
.mtls_img li{
	width: 100%;
}
.mtls_img li img{
	width: 100%;
}
.latex_tt{
	position: relative;
	display: block;
	text-align: center;
}
.latex_info{
	position: absolute;
	color: #ffffff;
	padding-top: 30px;
	font-size: 20px;
	top:0;
	left: 0;
	right: 0;
}
.trma_latex{
	padding-top: 150px;
}
.trma_latex h3{
	font-family: 'NanumBarungothicB';
	padding-top: 20px;
	color: #646464;
}
.trma_latex dd img{
	padding-top: 30px;
}
.good{
	position: relative;
	display: inline-block; 
}
.good ul li{
	float: left;
	display: table;
	width: 160px;
	height: 160px;
	padding: 10px;
	background-color: #90b821;
	margin:10px 20px 0;
	border-radius:20px;
}	
.good ul li span{
	display: table-cell;
	color: #ffffff;
	vertical-align: middle;
	font-size: 20px;
}

/* Fiber Felt 
 ******************************** */
.materials_bg2{
 	position: relative;
 	display: block;
}
.fiber_tit{
	position: absolute;
	text-align: center;
	top:10%;
	left: 0;
	right: 0;
}
.fiber_tit h1{
	font-family: 'Roboto', sans-serif;
	font-size: 76px;
	font-weight: 900;
	padding-bottom: 15px;
}
.fiber_tit h3{
	font-family: 'NanumBarungothicB';
	padding-bottom: 20px;
}
.col-xs-12.fiber{
	padding: 50px 0;
	height: 300px;
	text-align: center;
}
.col-xs-12.quantum{
	padding: 50px 0;
	height: 620px;
	margin-bottom: 150px;
	/*text-align: center;*/
	background-image: url('../images/07material_img/quantum_main.jpg');
	background-size:100%;
	background-repeat: no-repeat;
	/*background-position: center;*/
}

.btn.btn-primary.btn-lg.quantum{
	font-size: 16px;
	color: #ffffff;
	background-color: #3296e6;
	padding: 10px 25px;
	border-radius: 0;
	position: absolute;
	bottom: 50px;
	left: 50px;
}
.btn.btn-primary.btn-lg.quantum:hover{
	background-color: #50a0dc;
}
.modal-dialog.quantum{
	margin: 100px auto;
}
.modal-body.quantum{
	padding: 0;
}
.carousel-control.right.mqt, .carousel-control.left.mqt{
	background-image: none;
}
.fiber dt{
	padding-bottom: 10px;
}
.fiber dt img{
	width: 250px;
}
.fiber dt h1{
	font-family: 'Roboto', sans-serif;
	font-weight: 900;
	color: #ccc;
}
.fiber dt h1 span{
	color: #3296e6;
	font-size: 56px;
}
.fiber dt h1.kr{
	color: #3296e6;
	font-family: 'NanumBarungothicB';
	font-size: 46px;
	padding-top: 10px;
}
.fiber dd h2{
	color: #004e8c;
	padding-top: 40px;
}
.fiber dd h2.od{
	padding: 10px 0;
}
.fiber dd{
	font-size: 20px;
	padding-top:10px; 
	line-height: 1.6;
}
.row.fiber{
	padding-bottom: 150px;
}
.col-md-6.fiber{
	padding: 0;
}
.col-md-6.fiber img{
	width: 100%;
}
.col-md-6.fiber p{
	position: absolute;
	padding: 0 40px 20px;
	bottom: 0;
	text-align: justify;
	font-size: 1.6vh;
	line-height: 1.4;
}
.fiber_h{
  font-family: 'Roboto', sans-serif;
  font-size: 76px;
  font-weight: 900;
  padding-bottom: 15px;
}
.fiber_icon, .fiber_info{
	display: table-cell;
}
.sg_slider dl.fiber_hh{
	bottom: 10%;
}
.sg_slider dl dt.fiber_icon img{
	width: 230px;
	padding: 0;
}
.sg_slider dl dd.fiber_icon{
	padding-right: 10%;
	padding-left: 50px;
	vertical-align: bottom;
	font-size: 18px;
}
.sg_slider dl dd.fiber_info{
	padding-left: 50px;
	vertical-align: bottom;
	line-height: 1.6;
}
.sg_slider dl dd.fiber_info h3{
	padding-bottom: 15px;
}
.sg_slider dl dd.fiber_info h3 span{
	font-size: 36px;	
}
.sg_slider dl dd.fiber_info h1{
  font-family: 'Roboto', sans-serif;
  font-weight: 900;
  padding-bottom: 15px;	
}

.sg_slider dl dd.fiber_info h1 span{
	font-size: 65px;
}
.sg_slider dl dd.fiber_info > span{
	font-family: 'NanumBarungothicB';
}
.ff{
	text-align: center;
	padding: 100px 0 50px;
}
.ff figcaption{
	font-size: 20px;
	padding-top: 10px;
}
/* 하단 소재 리스트 
******************************** */
.material_list{
 	position: relative;
 	padding: 100px 0;
}

.col-md-6.foam > img{
 	width: 100%;
}
.col-md-4 dl{
 	padding: 50px;
 	background-color: #004e8c;
 	color: #ffffff;
 	height: 220px;
}
.col-md-6.foam > dl{
 	padding: 50px;
 	background-color: #004e8c;
 	color: #ffffff;
 	height: 220px;
}
.foam dt{
	font-size: 24px;
	padding-bottom: 10px;
}
.foam dd{
	text-transform: uppercase;
  font-family:'GothamBook', "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.foam dd a{
	color: #ffffff;
}
.foam dd a:hover{
	color: #99ccff;
	text-decoration: underline;
}