@import url('/comm/css/sub.css');


/* 카테고리 */
.cate_con {overflow:hidden; margin: 0 auto 60px; box-sizing:border-box; position: relative;}
.cate_con ul{display:flex; flex-wrap:wrap; justify-content: center;}
.cate_con ul li{width:auto; margin: 2px;}
.cate_con ul li a{display:block; font-size:1rem; min-width:180px; padding:0 20px; line-height:63px; height: 65px; border-radius:65px; letter-spacing:var(--letter-spacing-button); color:var(--basic); box-sizing:border-box; transition:all .3s linear; position:relative; text-align:center; border:1px solid var(--border); font-weight: 400;}
.cate_con ul li:hover a{border-color:var(--main); color:var(--main);}
.cate_con ul li.hover a{background:var(--main) !important; border-color:var(--main) !important; color:var(--white) !important;}

/* 리스트 */
.equipment-list{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap:30px;}
.equipment-list .list{box-sizing: border-box; border: 1px solid var(--border); padding: 35px 30px; display: flex; align-items: flex-start;}
.equipment-list .list .thumb{width: 260px; aspect-ratio: 260/180; overflow: hidden;}
.equipment-list .list .thumb img{display: block; width: 100%; height: 100%; object-fit: contain; }
.equipment-list .list .desc{width: calc(100% - 260px); box-sizing: border-box; padding: 0 0 0 30px;}
.equipment-list .list .desc .prdname-eng{font-family: var(--eng); letter-spacing: 0; font-weight: 400; color: var(--main); padding-bottom: 2px;}
.equipment-list .list .desc .prdname{font-weight: 800; color: var(--black); line-height: 140%;}
.equipment-list .list .desc .info-list{padding: 12px 0 0; display: flex; flex-direction: column; gap:6px;}
.equipment-list .list .desc .info-list dl{display: flex; gap:10px;}
.equipment-list .list .desc .info-list dl dt{min-width: 80px;}
.equipment-list .list .desc .info-list dl dt p{font-weight: 700; color: var(--black);}
.equipment-list .list .desc .info-list dl dd{flex:1;}
.equipment-list .list .desc .info-list dl dd p{font-weight: 400;}




/* 검색 */
.bbs_search {text-align:center; padding:30px 0 0; font-size:0; }
.bbs_search dl{display:flex; gap:2px; align-items:center; max-width:404px; width:100%; margin:0 auto;}
.bbs_search dt {width:100px; flex-shrink:0;}
.bbs_search dt select{border:1px solid var(--border); padding:0 15px; width:100%; height:50px !important; font-size:0.889rem; color: var(--basic); line-height:175%; letter-spacing:var(--letter-spacing-input); background-position:right 15px center !important; }
.bbs_search dd{display:flex; gap:2px; width:302px; flex-shrink:0;}
.bbs_search dd .search_input {font-size:1rem; color:var(--basic); border:1px solid var(--border); background-color:var(--white); padding:0 15px; font-family:inherit; height:50px; line-height:175%; letter-spacing:var(--letter-spacing-input); box-sizing:border-box; width:250px; flex-shrink:0; -webkit-appearance:none; -webkit-border-radius:0;}
.bbs_search dd .bbs_s_b{padding:0; border:1px solid var(--main); background:var(--main); outline:none; cursor:pointer; width:50px; height:50px; display:flex; align-items:center; justify-content:center; transition:all .3s linear; position:relative; font-size:0;}
.bbs_search dd .bbs_s_b:hover{background:var(--black);}
.bbs_search dd .bbs_s_b span{color:var(--white); font-size:24px;}
.bbs_search dd .bbs_s_b::after{content:'\e8b6'; display:block; width:100%; height:100%; line-height:50px; font-size:24px; position:absolute; left:0; top:0; text-align:center; color:var(--white); font-family:var(--icon); font-weight:400;}


/* 뷰 */
.pro_view{}
	.pro_top{display:flex; flex-wrap:wrap; justify-content:space-between; margin: 0 0 100px;}
	.pro_top > div{box-sizing:border-box; width: calc(50% - 15px);}
	.pro_top .pro_img{}
	.pro_top .pro_img .prdImg{display:block; overflow:hidden;}
	.pro_top .pro_img .prdImg img{width: 100%;}
	.pro_top .pro_txt{padding:10px 0 0 40px;}
	.pro_top .pro_txt .prdnum{display: block; font-size:1rem; letter-spacing:var(--letter-spacing-none); font-family:var(--eng); color:var(--main); line-height:130%; padding:0 0 8px;}
	.pro_top .pro_txt .prdname{display:block; font-size:2.5rem; line-height:120%; letter-spacing:var(--letter-spacing-heading); color:var(--black); font-weight:700;}
	.pro_top .pro_txt .shortexp{display:block; font-size:1.125rem; line-height:150%; letter-spacing:var(--letter-spacing-body); color:var(--basic); font-weight:400; padding: 10px 0 0;}
	.pro_top .pro_txt .pro_info{margin: 30px 0 0; padding:18px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border);}
	.pro_top .pro_txt .pro_info ul{}
	.pro_top .pro_txt .pro_info ul li{font-size:1rem; letter-spacing:var(--letter-spacing-body); line-height: 160%; padding:0 0 10px 82px; box-sizing:border-box; position:relative;}
	.pro_top .pro_txt .pro_info ul li:last-child{padding-bottom: 0 !important;}
	.pro_top .pro_txt .pro_info ul li .tit{display:inline-block; color:var(--black); letter-spacing: var(--letter-spacing-body); position: absolute; left: 0; top:0;}
	.pro_top .pro_txt .pro_info .download_icon{vertical-align: middle; font-size:20px; margin: -4px 5px 0 0; color:#1C1B1F;}
	.pro_top .pro_txt .pro_info .upfile2{padding: 20px 0 0; font-size:0.875rem; letter-spacing: var(--letter-spacing-caption); line-height: 150%; color:var(--black);}
	.pro_top .pro_txt .pro_btn{padding: 30px 0 0; display: flex; justify-content:space-between;}
	.pro_top .pro_txt .pro_btn a{display: inline-block; width: 130px; height: 60px; line-height: 58px; box-sizing:border-box; border:1px solid var(--border); text-align:center; transition:all .3s linear; font-size:1rem; letter-spacing: var(--letter-spacing-button); font-weight: 500;}
	.pro_top .pro_txt .pro_btn a:before{display: inline-block; font-size:24px; vertical-align: middle; margin: -2px 20px 0 0; font-family: "Material Symbols Outlined";}
	.pro_top .pro_txt .pro_btn a.listBtn:before{content:'\e5d2';}
	.pro_top .pro_txt .pro_btn a.printBtn:before{content:'\e8ad';}
	.pro_top .pro_txt .pro_btn a.listBtn{}
	.pro_top .pro_txt .pro_btn a.listBtn:hover{border-color:var(--black); color:var(--black);}
	.pro_top .pro_txt .pro_btn a.printBtn{background:var(--main); border-color:var(--main); color:var(--white);}
	.pro_top .pro_txt .pro_btn a.printBtn:hover{background:var(--sub); border-color:var(--sub);}

	.datail_info{font-size:1.25rem; font-weight: 500; color:var(--white); line-height: 120%; letter-spacing: var(--letter-spacing-body); margin: 0 0 40px; padding: 20px 25px; box-sizing:border-box; background:var(--black); }
	.pro_content{padding: 0 0 60px;}
	.pro_content img{max-width:100%; height: auto !important;}



/* 관련상품 */
.pro_roll{position: relative; width: calc(100% + 30px); margin: 0 -15px;}
.pro_roll:after{content:''; display:block; clear:both;}
.pro_roll dl{padding: 0 15px;}
.pro_roll dl a{display:block;}
.pro_roll dl dt{overflow:hidden;}
.pro_roll dl dt img{width:100%; background-repeat:no-repeat; background-position:center; background-size:contain; transition:all .3s linear;}
.pro_roll dl:hover dt img{transform:scale(1.1); transition:all .3s linear;}
.pro_roll dl dd{padding:20px 0; box-sizing:border-box;}
.pro_roll dl dd .title{font-size:1.125rem; font-weight: 500; color:var(--black); line-height:120%; letter-spacing:var(--letter-spacing-body); text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block;}
.pro_roll dl dd .multiple{font-size:1rem; line-height:120%; height:1.4em; letter-spacing:var(--letter-spacing-body); margin:10px 0 0; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block;}

.pro_roll .slick-arrow{border:0; padding:0; font-size:0; outline:none; cursor:pointer; width:30px; height:30px; transition:all .3s linear; position: absolute; z-index: 9999; opacity: 1; right: 47px; top:-86px;}
.pro_roll .slick-arrow:hover{opacity: 0.5;}
.pro_roll .slick-prev{background:url('/img/arrow_p_w.png') no-repeat center/100% auto; margin-right:50px;}
.pro_roll .slick-next{background:url('/img/arrow_n_w.png') no-repeat center/100% auto;}


/*******************************************************************************
    @media 1350px
*******************************************************************************/
@media all and (max-width:1500px){

/* 리스트 */
.equipment-list{grid-template-columns: repeat(1, 1fr);}


}
/*******************************************************************************
    @media ~1280px
*******************************************************************************/
@media all and (max-width:1300px){



}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){

/* 카테고리 */
.cate_con {margin: 0 auto 40px;}
.cate_con ul{}
.cate_con ul li a{min-width:140px; padding:0 20px; line-height:53px; height: 55px;}

/* 리스트 */
.equipment-list{grid-gap:20px;}
.equipment-list .list{padding: 25px 20px;}
.equipment-list .list .thumb{width: 200px;}
.equipment-list .list .desc{width: calc(100% - 200px); padding: 0 0 0 20px;}
.equipment-list .list .desc .info-list{padding: 8px 0 0;}
.equipment-list .list .desc .info-list dl dt{min-width: 70px;}



/* 뷰 */
.pro_view{}
	.pro_top{margin: 0 0 80px;}
	.pro_top > div{width: calc(50% - 10px);}
	.pro_top .pro_txt{padding:10px 0 0 20px;}
	.pro_top .pro_txt .prdname{font-size:2rem;}
	.pro_top .pro_txt .shortexp{font-size:1rem; padding: 8px 0 0;}
	.pro_top .pro_txt .pro_info{margin: 20px 0 0; padding:15px 0;}
	.pro_top .pro_txt .pro_info ul{}
	.pro_top .pro_txt .pro_info ul li{padding:0 0 8px 82px;}
	.pro_top .pro_txt .pro_info .download_icon{font-size:18px; margin: -4px 5px 0 0;}
	.pro_top .pro_txt .pro_btn{padding: 30px 0 0;}
	.pro_top .pro_txt .pro_btn a{width: 110px; height: 50px; line-height: 48px;}
	.pro_top .pro_txt .pro_btn a:before{font-size:18px; margin: -2px 10px 0 0;}
	.pro_top .pro_txt .pro_btn a.printBtn{display: none;}


	.datail_info{font-size:1.12rem; margin: 0 0 30px; padding: 15px 20px;}
	.pro_content{padding: 0 0 40px;}


/* 관련상품 */
.pro_roll{width: calc(100% + 20px); margin: 0 -10px;}
.pro_roll dl{padding: 0 10px;}
.pro_roll dl dd{padding:15px 0;}
.pro_roll dl dd .multiple{margin:8px 0 0;}

.pro_roll .slick-arrow{width:25px; height:25px; right: 38px; top:-68px;}
.pro_roll .slick-prev{margin-right:40px;}




}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){


/* 카테고리 */
.cate_con {margin: 0 auto 20px; padding:0 30px; display:block; position:relative;}
.cate_con:before{content:''; display:block; box-sizing:border-box; width:100%; height:100%; border:1px solid var(--border); position:absolute; left:0; bottom:0;}
.cate_con ul{display:block; white-space:nowrap; text-align:center; font-size:0;}
.cate_con ul li{float:none; display:inline-block; margin:0; width: auto; padding:0 10px;}
.cate_con ul li a{min-width:auto; line-height:120%; height: auto; padding:12px 0; border-radius:0; border:0;}
.cate_con ul li a:after{content:''; display:block; width:0; height:2px; background:var(--main); position:absolute; left:0; bottom:0; z-index:2; transition:all .3s linear;}
.cate_con ul li.hover a{background:transparent !important; color:var(--main) !important; font-weight:700;}
.cate_con ul li.hover a:after{width:100%;}


/* 리스트 */
.equipment-list{grid-gap:10px;}
.equipment-list .list{padding: 20px; flex-wrap: wrap;}
.equipment-list .list .thumb{width: 100%;}
.equipment-list .list .desc{width: 100%; padding: 20px 0 0;}
.equipment-list .list .desc .info-list{gap:4px;}
.equipment-list .list .desc .info-list dl dt{min-width: 60px;}

/* 검색 */
.bbs_search {padding:20px 0 0;}
.bbs_search dl{max-width:100%;}
.bbs_search dt {width:100px;}
.bbs_search dt select{height:40px !important; padding: 0 10px; background-position: right 10px center !important; background-size: 8px auto !important;}
.bbs_search dd{width:auto; flex:1; min-width:0;}
.bbs_search dd .search_input {padding:0 10px; height:40px; line-height:175%; width:auto; flex:1; min-width:0;}
.bbs_search dd .bbs_s_b{width:40px; height:40px; flex-shrink:0;}
.bbs_search dd .bbs_s_b span{font-size:20px;}
.bbs_search dd .bbs_s_b::after{line-height:40px; font-size:20px;}

/* 뷰 */
.pro_view{}
	.pro_top{margin: 0 0 40px;}
	.pro_top > div{width: 100%;}
	.pro_top .pro_txt{padding:20px 0 0;}
	.pro_top .pro_txt .prdnum{padding:0 0 6px;}
	.pro_top .pro_txt .prdname{font-size:1.8rem;}
	.pro_top .pro_txt .pro_info{margin: 15px 0 0; padding:12px 0;}
	.pro_top .pro_txt .pro_info ul{}
	.pro_top .pro_txt .pro_info ul li{padding:0 0 6px 70px;}
	.pro_top .pro_txt .pro_info .download_icon{font-size:16px;}
	.pro_top .pro_txt .pro_info .upfile2{padding: 15px 0 0; font-size:12px;}
	.pro_top .pro_txt .pro_btn{padding: 20px 0 0;}
	.pro_top .pro_txt .pro_btn a{width: 100px; height: 40px; line-height: 38px;}
	.pro_top .pro_txt .pro_btn a:before{font-size:16px;}


	.datail_info{margin: 0 0 20px; padding: 12px 15px;}
	.pro_content{padding: 0 0 30px;}

/* 관련상품 */
.pro_roll dl dd{padding:12px 0;}
.pro_roll dl dd .multiple{margin:6px 0 0;}

.pro_roll .slick-arrow{right: 30px; top:-54px;}




}
/*******************************************************************************
    @media ~480px              
*******************************************************************************/
@media all and (max-width:480px){


/* 리스트 */
.pro_list dl{margin:0 0 20px; width:100%;}
.pro_list dl:nth-child(3n){margin-right: 0;}
.pro_list dl:nth-child(2n){margin-right: 0;}


}
/*******************************************************************************
    @media ~360px
*******************************************************************************/
@media all and (max-width:360px){




}