.tem01-blog-detail .mainlist{flex-direction: row-reverse} .tem01-blog-detail .leftlist .con{padding-right:40px;} .tem01-blog-detail .rightlist .con{padding-right:40px;} .tem03-news-detail-ms{text-align: center;line-height: 170%;color:#333;} .tem03-news-detail-ms .title{font-size: 2.5rem;} .tem03-news-detail-ms .info{margin-top: 20px;opacity: .6;} .tem03-news-detail-ms .info span{display:inline-block;margin-right: 10px;} .tem03-news-detail-ms .description{text-align: left;color:#6f6f6f;padding:30px 0;} .tem03-news-detail-ms .image{text-align: center;} .tem03-news-detail-ms .image img{max-width: 100%;width:auto;margin:20px 0;} .tem03-news-detail-ms .like .num{color:#666;display:block;padding-top: 5px;font-size:16px;} .tem03-news-detail-ms .like .icon{background-color:#3aafff;font-size: 22px;width: 60px;height: 60px;line-height: 60px;color:#fff;display: block;border-radius: 50%;margin:0 auto;;cursor: pointer;transition: .3s;position: relative;} .tem03-news-detail-ms .like .icon::after{content: "+1";color:#fea200;transition: .4s;position: absolute;width:100%;height: 100%;left:100%;top:0;font-size: 14px;opacity: 0;transform: translateY(50%)} .tem03-news-detail-ms .like .icon.active::after{animation: add 1.2s ease-out} .tem03-news-detail-ms .like .icon.active{background-color:#fea200;} .tem03-news-detail-ms .like .icon.active::before{display: block;animation: move 1.2s ease-out;} @keyframes move{ 20%{transform: scale(1.3) rotate(-20deg)} 40%{transform: scale(.5) rotate(20deg)} 60%{transform: scale(1.3) rotate(-20deg)} 80%{transform: scale(.5) rotate(20deg)} 80%{transform: scale(1) rotate(0)} } @keyframes add{ 0%{opacity: 0;} 80%{color:#fea200;transform:translateY(-50%) scale(1.2);opacity: 1;} 100%{transform:translateY(-50%) scale(1);opacity: 0;} } .tem03-news-detail-ms .headline{font-size:18px;color:#333;margin:30px 0 10px;} .tem03-news-detail-ms .blog_tag{width:100%;text-align: left;} .tem03-news-detail-ms .blog_tag a{display:inline-block;color: #232323;padding: 5px 8px;border: 1px solid #d9d9d9;font-size: 12px;transition: .5s;} .tem03-news-detail-ms .blog_tag a:hover{background-color:#232323;color:#fff;} @media (max-width:768px){ .tem01-blog-detail .leftlist .con, .tem01-blog-detail .rightlist .con{padding: 0;} .tem03-news-detail-ms .title .h1{font-size: 18px;line-height: 170%;} .tem03-news-detail-ms .info{font-size: 12px;margin-top: 5px;} .tem03-news-detail-ms .description{padding:3% 2%;} .tem03-news-detail-ms .like .icon{width: 50px;height: 50px;line-height: 50px;font-size: 18px;} .tem03-news-detail-ms .like .num{font-size: 14px;} .tem03-news-detail-ms .blog_tag{margin-top:10px;} .tem01-blog-detail .rightlist .con{padding:0 2%;} }