/* main */ .main{ background-color: #f4f4f4; width: 100%; padding-bottom: 75px; } @media(min-width: 300px) and (max-width: 1000px){ .main{ padding-bottom: 50px; } } /* news */ .main .news{ padding-top: 55px; } .news .news-title,.notice .notice-title,.works .works-title,.marmk .news-title{ color: #5d392d; font-size: 28px; font-weight: bold; padding-bottom: 20px; margin-bottom: 40px; border-bottom: 1px solid #999999; } .news .news-title span,.notice .notice-title span,.works .works-title span,.marmk .news-title span{ color: #999999; font-size: 26px; font-weight: normal; margin-left: 8px; } .news .news-title .more,.notice .notice-title .more,.works .works-title .more,.marmk .news-title .more{ display: block; float: right; color: #999999; margin-right: 21px; font-size: 18px; font-weight: normal; transition: all 0.5s ease; line-height: 30px; } .news .news-title .more:hover,.notice .notice-title .more:hover,.works .works-title .more:hover,.marmk .news-title .more:hover{ color: #cbb174; } .news_box_lg { height: 280px; margin-bottom: 20px; box-shadow: 0 0 30px 0 rgba(0,0,0,0.1); } .news_box_lg .item-news{ display: block; overflow: hidden; } .item-news .item-img{ width: 100%; display: block; height: 0; padding-bottom: 58.667%; overflow: hidden; position: relative; } .item-news .item-img img{ width: 100%; max-width: 100%; height: auto; display: block; transition: all 0.3s ease 0s; } .item-news .item-img:hover img{ filter: grayscale(100%); transform: scale(1.2); } .item-news .item-txt p{ font-size: 16px; color: #161616; font-weight: bold; text-align: center; padding: 24px 0; background-color: #fff; transition: all 0.5s ease; } .item-news .item-txt p:hover{ color: #cbb174; } .item-news .item-mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all .3s ease-out; opacity: 0; background: #000; border-top-left-radius: 6px; border-top-right-radius: 6px; filter: alpha(opacity=0); } .item-news .btn-search__hover_i{ opacity: 0; filter: alpha(opacity=0); position: absolute; top: 50%; left: 50%; width: 50px; height: 50px; margin: -25px 0 0 -25px; background: url(../images/search3.png) no-repeat; -webkit-transform: scale(2); transform: scale(2); -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: all ease-out 250ms; } .item-news .item-img:hover .item-mask { opacity: .5; background: #000; filter: alpha(opacity=50); } .item-img:hover .btn-search__hover_i { opacity: 1; filter: alpha(opacity=100); -webkit-transform: scale(1); transform: scale(1); } /* notice */ .main .notice{ padding-top: 35px; } .item-notice{ display: block; overflow: hidden; } .notice_box_lg{ margin-bottom: 20px; box-shadow: 0 0 30px 0 rgba(0,0,0,0.1); } .item-notice .item-img{ width: 100%; display: block; height: 0; padding-bottom: 103.667%; overflow: hidden; position: relative; } .item-notice .item-img img{ width: 100%; max-width: 100%; height: auto; display: block; transition: all 0.3s ease 0s; } .item-notice .item-txt p{ font-size: 16px; color: #161616; font-weight: bold; text-align: center; padding: 24px 0; background-color: #fff; transition: all 0.5s ease; } .item-notice .item-txt p:hover{ color: #cbb174; } .item-img .home-event-date { position: absolute; bottom: 0; left: 0; background-color: #5d382d; display: flex; flex-direction: column; padding: 8px 16px; align-items: center; } .home-event-d { font-size: 30px; line-height: 1; color: #fff; font-weight: bold; } .home-event-m { font-size: 13px; line-height: 18px; color: #fff; padding-top: 5px; } /* works */ .main .works{ padding-top: 35px; } .works_box_lg { height: 280px; margin-bottom: 20px; box-shadow: 0 0 30px 0 rgba(0,0,0,0.1); } .works_box_lg .item-works{ display: block; overflow: hidden; } .item-works .item-img{ width: 100%; display: block; height: 0; padding-bottom: 58.667%; overflow: hidden; position: relative; } .item-works .item-img img{ width: 100%; max-width: 100%; height: auto; display: block; transition: all 0.3s ease 0s; } .item-works .item-img:hover img{ transform: scale(1.2); } .item-works .item-txt p{ font-size: 16px; color: #161616; font-weight: bold; text-align: center; padding: 24px 0; background-color: #fff; transition: all 0.5s ease; } .item-works .item-txt p:hover{ color: #cbb174; } .item-works .item-mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all .3s ease-out; border-top-left-radius: 6px; border-top-right-radius: 6px; } .item-works .btn-search__hover_i{ opacity: 0; filter: alpha(opacity=0); position: absolute; top: 50%; left: 48%; width: 61px; height: 61px; margin: -25px 0 0 -25px; background: url(../images/video.png) no-repeat; -webkit-transform: scale(2); transform: scale(2); -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: all ease-out 250ms; } .item-works .item-img:hover .item-mask { background: url(../images/worksbg.png) no-repeat; } .item-img:hover .btn-search__hover_i { opacity: 1; filter: alpha(opacity=100); -webkit-transform: scale(1); transform: scale(1); } /* tabclass */ .tabclass{ padding-top: 45px; } .tab-content>.active{ display: flex; } .tabclass .tab-content{ justify-content: space-around; line-height: 1; padding: 0; } .tabclass .tab-pic{ width: 50%; } .tabclass .tab-pic img{ width: 100%; height: 100%; } .tabclass .tab-introduce{ width: 50%; padding: 30px 32px; background-color: #5d392d; } .tab-introduce .tab-title { color: #fefefe ; font-size: 18px ; font-weight: bold; line-height: 22px; margin-top: 0; margin-bottom: 15px; } .tab-introduce .article-tit{ color: #fefefe ; line-height: 26px; } .tab-introduce .article-con{ color: #fefefe ; line-height: 26px; margin-bottom: 25px; } .tab-introduce .learnmore{ color: #cab16f; transition: all 0.5s ease; } .tab-introduce .learnmore:hover{ color: #fff; } .tabclass-ul{ overflow: hidden; } .tabclass-ul li{ width: 20%; float: left; } .tabclass-ul li.active{ background-color: #5d392d; } .tabclass-ul li.active a{ color: #fff; } .tabclass-ul li a{ text-align: center; color: #292929; font-weight: bold; font-size: 18px; display: block; padding: 18px 0; } .marnewcloun{ display: flex; justify-content:space-between; padding-top:35px;} .marmk{ width:49%;} .marnewscont{ background-color:#fff;} .marnewscont ul{ padding:15px 27px 27px;} .marnewscont ul li{ height:50px; line-height: 50px; border-bottom:1px solid #efefef;} .marnewscont ul li span{ float:right; font-size:14px; color:#c8c8c8;} .marnewscont ul li a{ color:#2c2c2c; font-size:16px;} .marnewscont ul li a:hover{ color:#5d392d;} @media (max-width: 980px){ .marnewcloun{ flex-wrap: wrap;} .marmk{ width:100%;} .noticemarnew{ margin-top:30px;} } @media (max-width: 415px){ .marnewscont ul li a{ font-size:12px;} .marnewscont ul li span{ font-size:12px;} }