/* common */
/* common */
/* common */

.fabluxcentent.container .textBox h2 {
	position: relative;
	padding: 10px 0 10px 20%;
	font-size: 30px;
	font-weight: 500;
}
.fabluxcentent.container .textBox h2::before { content: ""; position: absolute; top: 50%; left: 50px; width: 100px; height: 110%; background:url("/images/sub/simbol.png")no-repeat; background-size: contain; transform: translateY(-50%); }

@media(max-width: 768px){
	.fabluxcentent.container .textBox h2::before { left: 10px; width: 80px; }
}
@media(max-width: 480px){
	.fabluxcentent.container .textBox h2 { font-size: 25px; line-height: 20px; }
	.fabluxcentent.container .textBox h2::before { left: 10px; width: 80px; }
}
@media(max-width: 360px){
	.fabluxcentent.container .textBox h2 { padding: 10px 0 10px 25%; }
}


.fabluxcentent .displayGrid {
	display: grid;
	grid-template-columns: repeat(2, 50%);
	grid-template-rows: none;
	grid-gap: 0;
}

/* responsive */
/* responsive */
/* responsive */

@media(max-width: 768px){
	.fabluxcentent .displayGrid {
		grid-template-columns: none;
		grid-template-rows: repeat(2, auto);
		grid-gap: 0;
	}
	.fabluxcentent .displayGrid .leftBox:not(.realadd .displayGrid .leftBox, .boardstanding .displayGrid .leftBox, .woodframe .displayGrid .leftBox) { width: 60%; margin: 0 auto; }
}

/* fabricboard */
/* fabricboard */
/* fabricboard */

	/* tab responsive custom */
	/* tab responsive custom */

@media all and (max-width: 1170px) {
	.fabricboard .tab_container { padding: 30px 0;}
	/* 탭메뉴 디자인 */
	.fabricboard ul.tabs { border-bottom: 0;}
	.fabricboard ul.tabs li { margin-right: 1px;}
	.fabricboard ul.tabs li a { width: 100%; display: inline-block; font-size: 12px; padding: 3px 10px; border-bottom-color: #CCC; }
	.fabricboard ul.tabs li.active a { border-bottom-color: #000; }
}


.fabricboard ul.tabs li a { padding: 10px 15px; }

.fabricboard .textBox { padding: 20px 0; }
.fabricboard .textBox p { display: flex; flex-direction: row; }
.fabricboard .textBox p span.ptitle { width: 10%; }

.fabricboard .tab_container .textBox h3 { position: relative; padding: 10px 0 10px 20%; font-size: 30px; font-weight: 500; }
.fabricboard .tab_container .textBox h3::before { content: ""; position: absolute; top: 50%; left: 50px; width: 100px; height: 66px; background:url("/images/sub/simbol.png")no-repeat center; background-size: contain; transform: translateY(-50%); }

/* responsive */
/* responsive */
/* responsive */

@media(max-width: 768px){
	.fabricboard .tab_container .textBox h3 { padding: 10px 0 10px 15%; font-size: 24px; line-height: 24px; }
	.fabricboard .tab_container .textBox h3::before { left: 10px; width: 80px; }
}
@media(max-width: 620px){
	.fabricboard .tab_container .textBox h3 { padding: 10px 0 10px 15%; font-size: 20px; line-height: 20px; }
	.fabricboard .tab_container .textBox h3::before { left: 10px; width: 60px; }
}
@media(max-width: 460px){
	.fabricboard .tab_container .textBox h3 { padding: 10px 0 10px 20%; }
}
@media(max-width: 360px){
	.fabricboard .tab_container .textBox h3 { padding: 10px 0 10px 25%; font-size: 18px; line-height: 18px; }
	.fabricboard .tab_container .textBox h3::before { left: 10px; width: 66px; }
}



.fabricboard table { width: 100%; }

.fabricboard table thead {}
.fabricboard table thead tr {
	padding: 15px 0;
	border-top: 1px solid #0c0c0c;
	border-bottom: 1px solid #0c0c0c;
	text-transform: uppercase;
}

.fabricboard table thead td { text-align: center; s}

.fabricboard table td { border-right: 1px solid #0c0c0c; border-bottom: 1px solid #0c0c0c; }
.fabricboard #tab1 table tbody td:first-child { width: 35%; }
.fabricboard #tab2 table tbody td:first-child { width: 25%; }
.fabricboard #tab3 table tbody td:first-child { width: 25%; }
.fabricboard #tab4 table tbody td:first-child { width: 25%; }
.fabricboard #tab4 table tbody td { border: none; text-align: left; }
.fabricboard #tab4 table tbody tr.tr1 td:last-child { width: 35%; }
.fabricboard #tab4 table tbody tr.tr1 td:last-child img { border: 1px solid #0c0c0c; }
.fabricboard #tab4 table tbody tr.tr1 td:last-child figcaption { text-align: center; }
.fabricboard table tbody td:nth-child(2) { text-align: center; }
.fabricboard table tbody td:nth-child(3) { text-align: center; }
.fabricboard table tbody td:last-child, .fabricboard table thead td:last-child { }
.fabricboard table .imgBox { width: 100%; }
.fabricboard table .imgBox img { width: 100%; height: 100%; object-fit: contain; }

.fabricboard table tbody td { padding: 10px 40px; }

.fabricboard #tab4 div.none { display: none; }
.fabricboard #tab4 div.none .imgBox { width: 100%; }
.fabricboard #tab4 div.none img { width: 100%; height: 100%; object-fit: contain; border: 1px solid #0c0c0c; }
.fabricboard #tab4 div.none figcaption { text-align: center; }



/* responsive */
/* responsive */
/* responsive */

@media(max-width: 768px){
	.fabricboard table tbody td:first-child { width: 30%; }
	.fabricboard table tbody td { padding: 10px 20px; }

	.fabricboard #tab4 table tbody td:nth-child(2) { float: left; margin-top: 30px; margin-right: 50%; }
	.fabricboard #tab4 table tbody td:nth-child(3) { float: left; }
	.fabricboard #tab4 table tbody td { padding: 10px 5px; }
}
@media(max-width: 568px){
	.fabricboard #tab4 table tbody td:nth-child(2) { margin-top: 20px; }
}
@media(max-width: 567px){
	.fabricboard #tab4 table tbody td:first-child { width: 50%; }
	.fabricboard #tab4 table tbody td:nth-child(2) { margin-top: 25%; }
	.fabricboard #tab4 table tbody td.none { display: none; }
	.fabricboard #tab4 div.none { display: block; margin: 0 auto; width: 50%; }
}
@media(max-width: 490px){
	.fabricboard table tbody td { padding: 10px 5px; }
}

/* title background color */

.fabricboard #tab1 .textBox h3 { background-color: #f8cfc7; }
.fabricboard #tab2 .textBox h3 { background-color: #e2dacc; }
.fabricboard #tab3 .textBox h3 { background-color: #d1e0b8; }
.fabricboard #tab4 .textBox h3 { background-color: #ebf0b9; }
.fabricboard #tab5 .textBox h3 { background-color: #a8caeb; }
.fabricboard #tab6 .textBox h3 { background-color: #f5ddec; }
.fabricboard #tab7 .textBox h3 { background-color: #e4c4bd; }

/*tab 5*/

.fabricboard #tab5 .imgBox { width: 100%; }
.fabricboard #tab5 .way1 { margin-bottom: 100px; }
.fabricboard #tab5 .leftBox img { width: 100%; height: 100%; object-fit: contain; }

.fabricboard #tab5 .rightBox h4 { margin-bottom: 50px; padding-bottom: unset; }
.fabricboard #tab5 .rightBox p { margin-bottom: 30px; }
.fabricboard #tab5 .rightBox p:last-child { margin-bottom: unset; }
.fabricboard #tab5 .rightBox p.way { display: flex; flex-direction: row; }
.fabricboard #tab5 .rightBox p.way > span.title { display: inline-block; width: 12%; }
.fabricboard #tab5 .rightBox p.colorRed { color: #f00; }

.fabricboard #tab5 .rightBox {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 30px 0 0 30px;
}
.fabricboard #tab5 .rightBox p:nth-child(2) span.title { color: #f40089; }
.fabricboard #tab5 .rightBox p:nth-child(3) span.title { color: #00abf4; }

@media(max-width: 768px){
	.fabricboard .textBox p span.ptitle { width: 15%; }
	.fabricboard #tab5 .rightBox { align-items: center; }
}
@media(max-width: 480px){
	.fabricboard .textBox p span.ptitle { width: 18%; }
}
@media(max-width: 370px){
	.fabricboard .textBox p span.ptitle { width: 22%; }
}

/*tab 6*/
/*tab 6*/
/*tab 6*/

.fabricboard #tab6 .imgBox { width: 100%; }
.fabricboard #tab6 .way1 { margin-bottom: 100px; }
.fabricboard #tab6 .leftBox img { width: 100%; height: 100%; object-fit: contain; }

.fabricboard #tab6 .rightBox h4 { margin-bottom: 50px; padding-bottom: unset; }
.fabricboard #tab6 .rightBox p { line-height: 1.5; }
.fabricboard #tab6 .rightBox p:first-child { margin-bottom: 30px; }

.fabricboard #tab6 .rightBox {
	padding: 30px 0 0 80px;
	display: flex;
	align-items: center;
}

@media(max-width: 768px){
	.fabricboard #tab6 .rightBox { justify-content: center; padding: 30px 0 0 0px; }
}

/*tab 7*/
/*tab 7*/
/*tab 7*/

.fabricboard #tab7 .imgBox { width: 100%; }
.fabricboard #tab7 .way1 { margin-bottom: 100px; }
.fabricboard #tab7 .leftBox img { width: 100%; height: 100%; object-fit: contain; }

.fabricboard #tab7 .rightBox {
	padding: 30px 0 0 80px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.fabricboard #tab7 .rightBox h4 { margin-bottom: 50px; padding-bottom: unset; }
.fabricboard #tab7 .rightBox p { line-height: 1.5; }
.fabricboard #tab7 .rightBox p:first-child { margin-bottom: 20px; }

.fabricboard #tab7 .rightBox ul { display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 30px; }
.fabricboard #tab7 .rightBox ul li { position: relative; padding-left: 30px; width: 30px; height: 30px; }
.fabricboard #tab7 .rightBox ul li::before { position: absolute; display: block; left: 50%; top: 50%; width: 100%; height: 100%; border-radius: 50%; background-color: #fded1c; transform: translate(-50%, -50%); text-align: center; }
.fabricboard #tab7 .rightBox ul li:nth-child(1)::before { content: "1"; }
.fabricboard #tab7 .rightBox ul li:nth-child(2)::before { content: "2"; }
.fabricboard #tab7 .rightBox ul li:nth-child(3)::before { content: "3"; }
.fabricboard #tab7 .rightBox ul li:nth-child(4)::before { content: "4"; }

.fabricboard #tab7 .rightBox ul li i { padding-left: 10px; }

.fabricboard #tab7 .rightBox .way1 p { text-align: center; }

.fabricboard #tab7 .rightBox .way2 { padding-left: 15%; }
.fabricboard #tab7 .rightBox .way2 p { position: relative; padding-left: 50px; }
.fabricboard #tab7 .rightBox .way2 p::before { content: "5"; position: absolute; top: 50%; left: -15px; z-index: -1; width: 50px; height: 50px; padding: 10px; border-radius: 50%; background-color: #3ac4f2; color: #0c0c0c; transform: translateY(-50%); font-size: 30px; font-weight: 500; text-align: center; line-height: 1; }

@media(max-width: 1023px){
	.fabricboard #tab7 .rightBox ul li::before { padding-top: 3px; }
}

@media(max-width: 768px){
	.fabricboard #tab7 .rightBox { padding: 30px 0 0 0px; }
	.fabricboard #tab7 .rightBox .way2 { padding-left: unset; }
	.fabricboard #tab7 .way1 { margin-bottom: 50px; }
	.fabricboard #tab7 .rightBox ul li::before { padding-top: 1px; line-height: 2; }
	.fabricboard #tab7 .rightBox ul li { line-height: 2; }

}

/* real add */
/* real add */
/* real add */

.realadd br.none { display: none; }

.realadd .textBox h2 { background-color: #f8cfc7; }

.realadd .imgBox { width: 100%; padding: 10px 60px; }
.realadd .imgBox img { width: 100%; height: 100%; object-fit: contain; }

.realadd .textBox:not(.leftBox .textBox) { margin-bottom: 50px; }

.realadd .displayGrid > div { padding-bottom: 30px; }

.realadd .leftBox { border: 1px solid #0c0c0c; border-right: none; }
.realadd .rightBox { border: 1px solid #0c0c0c; }

.realadd .leftBox .textBox { padding: 20px 0; }
.realadd .leftBox .textBox p {
	display: flex;
	flex-direction: row;
	justify-content: center;
	margin: 0 auto;
	width: 80%;
	font-weight: 500;
	font-size: 20px;
	line-height: 1.5;
	white-space: nowrap;
}
.realadd .leftBox .textBox p span:first-child { display: block; width: 70%; }

@media(max-width: 768px){
	.realadd .leftBox { border-right: 1px solid #0c0c0c; border-bottom: none; }
}
@media(max-width: 568px){
	.realadd .leftBox .textBox p { font-size: 16px; width: 90%; }
}
@media(max-width: 420px){
	.realadd .leftBox .textBox p { font-size: 13px; }
}


/* board standing */
/* board standing */
/* board standing */

.boardstanding .textBox h2 { background-color: #e2dacc; }

.boardstanding .imgBox { width: 100%; padding: 10px 60px; }
.boardstanding .imgBox img { width: 100%; height: 100%; object-fit: contain; }

.boardstanding .textBox { margin-bottom: 50px; }

/* wood frame */
/* wood frame */
/* wood frame */

.woodframe .displayGrid { align-items: center; }

.woodframe .textBox h2 { background-color: #b5a791; }
.woodframe .textBox { margin-bottom: 50px; }

.woodframe .imgBox { width: 100%; height: 100%; padding: 10px 60px; overflow: hidden; }
.woodframe .imgBox img { width: 100%; height: 100%; object-fit: cover; }

.woodframe .displayGrid > div { height: 100%; }

.woodframe .rightBox img { /*object-fit: cover;*/ }