/* CSS Document */
*{ margin: 0; }
ul{ padding: 0; margin: 0; }
ul li{ list-style: none; }
.left{ float: left; }
.right{ float: right; }
.meeting{ background: #f2f2f2; }
.meeting .header{ border-bottom: 1px solid #e7e7e7; background: #fff; }
.meeting .header div{ margin: 0 auto; width: 1200px; padding: 15px 0; overflow: auto; }
.meeting .header img{ float: left; }
.meeting .header a{ display: inline-block; float: right; width: 100px; height: 28px; line-height: 28px; text-align: center; font-size: 12px; color: #3089f7; border: 1px solid #3089f7; border-radius: 14px; }
.meeting .banner{ height: 400px; overflow: hidden; width: 100%; position: relative; }
.meeting .banner:hover .arrow-left,.meeting .banner:hover .arrow-right{  opacity: 1; }
.meeting .banner .arrow-left,.meeting .banner .arrow-right{ opacity: 0; width: 56px; height: 53px; line-height: 53px; text-align: center; background: url(/images/meeting/meeting-arrow-small-bg.png); position: absolute; top: 180px; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; cursor: pointer;}
.meeting .banner .arrow-left, .meeting .banner .arrow-right img{ vertical-align: text-bottom; }
.meeting .banner .banner-first-img{ height: 400px; position: absolute; left: 0; opacity: .5; }
.meeting .banner .banner-last-img{ height: 400px; position: absolute; right: 0; opacity: 0; }
.meeting .banner ul{  overflow: hidden; }
.meeting .banner ul li{ position: relative; display: block; float: left; opacity: .5; -webkit-transition:-webkit-transform .3s ease;-moz-transition:-moz-transform .3s ease;-o-transition:-o-transform .3s ease;-ms-transition:-ms-transform .3s ease;transition:transform .3s ease; }
.meeting .banner ul li a img{ width: 1200px; height: 400px; }
.meeting .banner ul li.on{ width: 1200px !important; opacity: 1; }
.meeting .banner .bottom-state{ position: absolute; width: 100%; text-align: center; bottom: 10px; }
.meeting .banner .bottom-state span{ width: 25px; margin: 0 5px; display: inline-block; border: 2px solid #d3d3d3; }
.meeting .banner .bottom-state span.on{ border: 2px solid #3089f7; }

.meeting .main-con{ overflow: hidden; width: 1200px; margin: 0 auto; margin-top: 20px; padding:25px 0 60px 0; }
.meeting .main-con .main-con-left{ width: 915px; float: left; }
.meeting .main-con .main-con-right{ width: 285px; float: right; background: #fff; padding: 40px 15px 0 15px; position: relative; margin-top: 20px; }
.meeting .main-con .main-con-title{ margin-bottom: 30px; }
.meeting .main-con .main-con-title span{ cursor: pointer; display: inline-block; margin-right: 40px; font-size: 18px; color: #333333; font-weight: bold; }
.meeting .main-con .main-con-title span.active{ font-size: 24px; color: #3089f7; border-bottom: 3px solid #3089f7; box-sizing: border-box; padding: 5px 0; }
.meeting .main-con .main-con-info{ overflow: auto; }
.meeting .main-con .main-con-info>div{ width: 282px; height: 300px; margin: 0 23px 20px 0; margin-top: 0px; float: left; background: #fff; transition: all .2s linear; -webkit-transition: all .2s linear; }
.meeting .main-con .main-con-info>div:hover { -moz-box-shadow: 0 15px 30px rgba(0,0,0,.1); -webkit-box-shadow: 0 15px 30px rgba(0,0,0,.1); box-shadow: 0 15px 30px rgba(0,0,0,.1);  position: relative; top: -1px; left: -2px; transform: translate3d(0,-2px,0); -webkit-transform: translate3d(0,-2px,0);
}
.meeting .main-con .main-con-info>div.addanimatino{ -webkit-animation: reviewinfo-animate 1s ease;-moz-animation: reviewinfo-animate 1s ease;-o-animation: reviewinfo-animate 1s ease;-ms-animation: reviewinfo-animate 1s ease;animation: reviewinfo-animate 1s ease; }
.meeting .main-con .main-con-info a{ display: block; }
.meeting .main-con .main-con-info a img{ width: 282px; height: 170px; }
.meeting .main-con .info-detail{ padding: 15px; position: relative; }
.meeting .main-con .info-detail .active-state{ position: absolute; top: -15px; right: 0; line-height: 30px; width: 60px; text-align: center; font-size: 12px; color: #ffffff; background: #a1a1a1; }
.meeting .main-con .info-detail .active-state.signup{ background: #3089f7; }
.meeting .main-con .info-detail .active-state.active{ background: #ff6600; }
.meeting .main-con .info-detail .detail-title{ display: block; margin-bottom: 5px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; color: #030b20; }
.meeting .main-con .info-detail .detail-describe{ height: 35px; margin-bottom: 15px; font-size: 12px; color: #a2a2a2; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; }
.meeting .main-con .info-detail .detail-bottom{ font-size: 12px; color: #666666; overflow: auto; }
.meeting .main-con .info-detail .detail-bottom img{ margin-right: 5px; vertical-align: bottom; }
.meeting .main-con .main-con-right .main-con-right-top{ position: absolute; width: 280px; top: -20px; }
.meeting .main-con .main-con-right .main-con-right-top .con-right-title{ font-size: 20px; color: #333; float: left; }
.meeting .main-con .main-con-right .main-con-right-top .con-right-title .bor{ width: 40px; padding-top: 5px; border-bottom: 3px solid #ff9900; }
.meeting .main-con-right-top .con-right-arrow{ float: right; background: #fff; color: #e7ebec; width: 97px; height: 55px; line-height: 50px; text-align: center; background: url(/images/meeting/meeting-arrow-bg.png); margin-top: -5px; }
.meeting .main-con-right-top span{ display: inline-block; padding: 0px 10px; cursor: pointer;}
.meeting .main-con-right-top span img{ vertical-align: middle; }
.meeting .review-item a{ display: block; }
.meeting .review-item a img{ width: 250px; height: 150px; }
.meeting .wonderful-review{ overflow: hidden; }
.meeting .wonderful-review-con{ width: 255px; float: left; overflow: auto; }
.meeting .main-con .main-con-info>div.nomore{ width: 893px; height: 30px; line-height: 30px; text-align: center; }

@keyframes reviewinfo-animate
{
	from { margin-top: 150px; }
	to { margin-top: 0; }
}

@-moz-keyframes reviewinfo-animate /* Firefox */
{
	from { margin-top: 150px; }
	to { margin-top: 0; }
}

@-webkit-keyframes reviewinfo-animate /* Safari บอ Chrome */
{
	from { margin-top: 150px; }
	to { margin-top: 0; }
}

@-o-keyframes reviewinfo-animate /* Opera */
{
	from { margin-top: 150px; }
	to { margin-top: 0; }
}