@charset "utf-8";

@media (max-width: 1280px){
	
	/* main */
	.home-section .item .over {bottom:16%;}
	.home-section .item .over h3 {font-size:38px;}
	.home-section .owl-dots {bottom:7%;}


	/* board */
	.project-list .wrap {margin:0 -3px;}
	.project-list .head,
	.project-list .item {padding:3px;}
	.project-list .item .thumb {padding-bottom:75%;}
	.project-list .item .over {bottom:15px; right:18px; left:18px;}
	.project-list .head .box {padding-bottom:75%;}
	.project-list .head a {display:block; margin:6px auto;}

	.project-detail .head {margin:0 100px 40px;}
	.project-detail .head .title {font-size:35px;}
	.project-detail .control .left {left:30px;}
	.project-detail .control .right {right:30px; width:88px;}
	.project-detail .control .right:after {display:none;}
	.project-detail .prev,
	.project-detail .next {padding:0 !important; text-indent:-999em; width:29px;}
	.project-detail .items,
	.project-detail .item {padding-bottom:46.42857143%;}

}

/* landscape tablet and desktop */
@media (max-width: 1024px){

	/* main */
	.home-section .item .over h3 {font-size:30px;}
	.home-section .owl-dots {bottom:4%;}


	.project-list .head h2 {font-size:22px;}
	.project-list .head a {height:38px; line-height:36px; font-size:13px;}
	.project-list .item .over h3 {font-size:15px; line-height:22px;}
	.project-list .item .over h3:after {display:none;}
	.project-list .item a:hover .over {bottom:15px;}
}

/* portrait tablet */
@media (max-width: 800px) {	
	.only-desktop {display:none;}
	.only-tablet {display:block;}
	.only-mobile {display:none;}


	/* main */
	.home-section .items,
	.home-section .item {}
	.home-section .item .over {bottom:14%;}
	.home-section .item .over h3 {font-size:26px;}
	.home-section .owl-dots {bottom:2%;}

	.owl-dots .owl-dot {padding:1px 5px;}
	.owl-dots .owl-dot span {width:9px; height:9px;}
	.owl-dots .owl-dot.active {padding:0 3px;}
	.owl-dots .owl-dot.active span {width:11px; height:11px;}
	.owl-next, .owl-prev {opacity:1 !important; width:50px; height:50px;}

	
	.project-list .head, .project-list .item {width:33.33333333%;}
	
	.project-detail {padding-top:25px; margin-bottom:-30px;}
	.project-detail .control {position:relative; height:40px;}
	.project-detail .control .left,
	.project-detail .control .right {top:0;}
	.project-detail .control .right {width:140px;}
	.project-detail .control .right:after {display:block;}
	.project-detail .control a {padding:0 22px; height:23px; background-size:auto 23px; font-size:13px; line-height:23px;}
	.project-detail .prev, .project-detail .next {padding:0 22px !important; width:70px; text-indent:0;}
	.project-detail .head {margin:0 30px 25px;}
	.project-detail .head .title {font-size:24px;}
	.project-detail .head .description {font-size:15px;}
	.project-detail .head .info {font-size:13px;}
	.project-detail .items,
	.project-detail .item {padding-bottom:75%;}
	.project-detail .slider .over {display:block;}
	.project-detail .owl-dots {bottom:2%;}

} 

/* Landscape phone */
@media (max-width: 640px) {	
	.only-desktop-tablet {display:none;}
	.only-desktop {display:none;}
	.only-tablet {display:none;}
	.only-mobile {display:block;}

	/* main */
	.home-section .items, .home-section .item {}
	.home-section .item .over h3 {font-size:22px;}

	.owl-next, .owl-prev {margin-top:-20px; width:40px; height:40px; background-size:40%;}
	.owl-prev {left:16px;}
	.owl-next {right:16px;}

	.project-section {padding:16px 0 40px;}


	.paginate a, .paginate strong {width:32px; height:32px; margin:0 -2px 0 -3px; font-size:14px; line-height:32px;}
	.paginate a.direction {border:1px solid #ddd; background-size:32px;}
	.paginate a.direction.prev {margin-right:7px;}
	.paginate a.direction.next {margin-left:7px;}

	.project-list .head {width:100%; padding:0 16px 10px; color:#2c2c2c; text-align:left;}
	.project-list .head .box {height:auto; padding:0; background:none;}
	.project-list .head .box .box-in {position:static; overflow:hidden;}
	.project-list .head h2 {float:left; margin:0; font-size:20px;}
	.project-list .head .btn {margin-left:40%; margin-right:-5px;}
	.project-list .head a {float:left; width:calc(50% - 5px); height:30px; padding:0; margin:0 5px 0 0; display:block; border:0; background:#121212; text-align:center; color:#fff; font-size:13px; line-height:30px;}

	.project-list .item {width:50%; padding:2px;}
	.project-list .item .thumb {padding-bottom:100%;}
	.project-list .item .over {bottom:14px; left:16px; right:16px; text-align:left;}
	.project-list .item .over h3 {font-size:14px; font-weight:300; line-height:19px;}

	.read-more {width:110px; height:35px; font-size:15px;}

	.project-detail .control .left {left:16px;}
	.project-detail .control .right {right:16px; width:117px;}
	.project-detail .control a {padding:0 15px; background-size:auto 18px;}
	.project-detail .prev, .project-detail .next {padding:0 15px !important; width:auto;}
	.project-detail .next {text-align:right;}
	.project-detail .head {margin:0 16px 20px; text-align:left;}
	.project-detail .head .title {font-size:21px; margin-bottom:3px;}
	.project-detail .head .description {font-size:18px;}
	.project-detail .head .info ul {margin:0 -14px;}
	.project-detail .head .info ul:after {content:" "; display:block; clear:both;}
	.project-detail .head .info ul li {float:left; display:block; margin:0; padding:0 14px; position:relative;}
	.project-detail .head .info ul li:after {content:" "; position:absolute; top:6px; left:0; bottom:6px; width:1px; background:#ddd;}
	.project-detail .head .info ul li:first-child::after {display:none;}
	.project-detail .head .info ul li .tt {display:block;}
	.project-detail .head .info ul li .bar {display:none;}

	.project-detail .items, .project-detail .item {padding-bottom:100%;}
	.project-detail .slider .over h3 {font-size:22px;}
}

/* Landscape phones and down */
@media (max-width: 480px) {
} 