<<<<<<< .mine /*------------------ index ------------------*/ /* module images news */ .space-top { margin-top: 110px } .news_img { padding: 0px; margin: 0px; list-style: none; } .news_img li { width: 50%; display: inline-block; float: left; padding: 15px 15px 0 0; } .news_img li div { width: 100%; height: 223px; position: relative; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; overflow: hidden; } .news_img li div img { width: 100%!important; height: 100%!important; object-fit: cover; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s; } .news_img li div img:hover { transform: scale(1.07); } .news_img li div span { width: 100%; max-height: 58px; background: rgba(0, 0, 0, .7); position: absolute; bottom: 0px; left: 0px; padding: 10px 15px; display: inline-block; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden } .news_img li div span a:link { color: rgba(255, 255, 255, 1); font-size: 1.1em; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .news_img li div span a:visited { color: rgba(255, 255, 255, 1); font-size: 1.1em; } .news_img li div span a:hover { color: rgba(231, 130, 51, 1); font-size: 1.1em; text-decoration: none; } .news_img li div span a:active { color: rgba(255, 255, 255, 1); font-size: 1.1em; } /* module tag */ .tag-title-con { width: 100%; } .tag-title { padding: 10px 0; margin: 15px 0 0 0; list-style: none; border-bottom: 1px solid rgba(230, 232, 235, 1); display: block; } .tag-title li { float: left; } .tag-title li a { font-size: 1.1em; color: rgba(50, 54, 59, 1); font-weight: bold; padding: 8px 18px; margin: 0 2px; display: inline-block; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -webkit-transition: background-color 0.3s ease-out, color 0.3s ease-out; -moz-transition: background-color 0.3s ease-out, color 0.3s ease-out; -o-transition: background-color 0.3s ease-out, color 0.3s ease-out; transition: background-color 0.3s ease-out, color 0.3s ease-out; } .tag-title li a:hover { background: rgba(38, 159, 209, 1); color: rgba(255, 255, 255, 1); text-decoration: none } .tag-title li .current-tag { background: rgba(38, 159, 209, 1); color: rgba(255, 255, 255, 1); -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; } .tag-con { width: 100%; padding: 0px; margin: 0px; list-style: none; display: none; } .tag-con li { border-bottom: 1px solid rgba(230, 232, 235, 1); padding: 20px 0; position: relative; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .tag-con li:hover { background: rgba(246, 246, 246, 1); } .tag-con li .tag-img-con { width: 35%; float: left; position: relative; overflow: hidden; } .tag-con li .tag-img-con img { width: 100%; position: relative; z-index: 88; cursor: pointer; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s } .tag-con li:hover .tag-img-con img { transform: scale(1.07); } .tag-img-con span { height: 22px; line-height: 22px; padding: 0 10px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; text-align: center; background: rgba(0, 0, 0, .7); color: rgba(255, 255, 255, 1); font-size: .9em;position: absolute; top: 15px; left: 15px; z-index: 98; } .tag-text-con { width: 65%; height: 100%; float: left; padding: 0 0 0 15px; } .tag-text-con .tag-caption { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-top: -2px; font-size: 1.3em; font-weight: bold; color: rgba(50, 54, 59, 1); -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; -o-transition: color 0.3s ease-out; transition: color 0.3s ease-out; border-bottom: none; } .tag-text-con .tag-caption:hover { color: rgba(229, 130, 61, 1); } .tag-text-con .tag-subtitle { width: 100%; max-height: 70px; display: block; font-size: 1em; color: rgba(158, 153, 149, 1); text-align: left; margin-top: 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; } .tag-text-con .tag-bottom { width: 65%; position: absolute; right: 0px; bottom: 23px; } .tag-text-con .tag-time { width: 60%; float: left; text-align: left; padding-left: 15px; } .tag-text-con .tag-time .text-from { display: inline-block; color: rgba(210, 210, 210, 1); } .tag-text-con .tag-time .text-from span:first-of-type { color: rgba(38, 159, 209, 1); padding-right: 3px; } .tag-text-con .tag-time .text-from span:last-of-type { color: rgba(229, 130, 61, 1); padding-left: 3px; } .tag-text-con .tag-time .tag-time-con { color: rgba(210, 210, 210, 1); padding-left: 15px; } .tag-text-con .tag-time .tag-time-con i { width: 13px; height: 13px; display: inline-block; background: url(../img/hr_tach@2x.png) -168px -75px no-repeat; background-size: 200px auto; vertical-align: middle; margin-right: 4px; } .tag-text-con .tag-operate { width: 40%; float: right; text-align: right; } .tag-text-con .tag-operate a { color: rgba(210, 210, 210, 1); margin-left: 10px; -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; -o-transition: color 0.3s ease-out; transition: color 0.3s ease-out; } .tag-text-con .tag-operate a:hover { color: rgba(38, 159, 209, 1); text-decoration: none; } .tag-text-con .tag-operate a i { width: 19px; height: 17px; vertical-align: middle; display: inline-block; margin-right: 3px; } .tag-text-con .tag-operate a .icon-seen { background: url(../img/hr_tach@2x.png) -92px -19px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a .icon-like { background: url(../img/hr_tach@2x.png) -116px -19px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a .icon-share { background: url(../img/hr_tach@2x.png) -141px -19px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a:hover .icon-seen { background: url(../img/hr_tach@2x.png) -92px -44px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a:hover .icon-like { background: url(../img/hr_tach@2x.png) -116px -44px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a:hover .icon-share { background: url(../img/hr_tach@2x.png) -141px -44px no-repeat; background-size: 200px auto; } /* module information */ .info_right { padding-left: 10px; } .info_title { background: rgba(231, 130, 51, 1); padding: 10px 15px; margin-top: 15px; } .info_title span { font-size: 1.2em; color: rgba(255, 255, 255, 1); font-weight: bold; display: inline-block; } .info_list { padding: 0px; margin: 0px; list-style: none; } .info_list li { width: 100%; display: inline-block; border-bottom: 1px solid rgba(224, 224, 224, 1); padding: 18px 0 15px 0; } .info_list li i { width: 0; height: 0; border-top: 5px solid transparent; border-left: 6px solid rgba(231, 130, 51, 1); border-bottom: 5px solid transparent; display: block; } .info_list li a:link { height: 22px; font-size: 1.1em; color: rgba(34, 34, 34, 1); margin-top: -15px; padding: 0 40px 0 13px; display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .info_list li a:visited { font-size: 1.1em; color: rgba(34, 34, 34, 1); } .info_list li a:hover { font-size: 1.1em; color: rgba(231, 130, 51, 1); text-decoration: none; } .info_list li a:active { font-size: 1.1em; color: rgba(34, 34, 34, 1); } .info_list li span { font-size: 1em; color: rgba(195, 191, 191, 1); display: block; text-align: right; margin-top: -21px; } /* module advertisement */ .ad_con { width: 100%; overflow: hidden; margin: 20px 0; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .ad_con a img { width: 100%;} /* module news */ .salon_news_left { padding-right: 15px; } .salon_news_right { padding-left: 15px; } .salon_news_title { border-bottom: 1px solid rgba(224, 224, 224, 1); margin-bottom: 20px; } .salon_news_title span { display: inline-block; padding: 0px 0 7px 0; font-size: 1.4em; color: rgba(34, 34, 34, 1); font-weight: bold; border-bottom: 3px solid rgba(231, 130, 51, 1); } .salon_news_con { width: 100%; margin-bottom: 20px; } .salon_news_con:hover { background: rgba(248,248,248,1); } .salon_news_con a:nth-of-type(2) { max-height: 38px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .salon_news_con .salon_news_img { width: 100%; height: 250px; overflow: hidden; display: inline-block; margin-bottom: 5px; } .salon_news_con .salon_news_img img { width: 100%!important; height: 100%!important; object-fit: cover; cursor: pointer; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s } .salon_news_con:hover .salon_news_img img { transform: scale(1.07); } .salon_news_summary { height: 57px; font-size: 1em; color: rgba(183, 183, 183, 1); margin: 5px 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden } .salon_news_hour { font-size: 1em; color: rgba(195, 191, 191, 1); display: block; } .salon_news_list { width: 100%; padding: 0px; margin: 0px; list-style: none; display: inline-block; } .salon_news_list li { border-bottom: 1px solid rgba(224, 224, 224, 1); display: block; padding: 15px 0; } .salon_news_list li:hover { background:rgba(248,248,248,1); } .salon_news_list li .salon_news_sm { width: 35%; height: 100px; display: inline-block; float: left; overflow: hidden; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .salon_news_list li .salon_news_sm img { width: 100%!important; height: 100%!important; object-fit: cover; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s; } .salon_news_list li:hover .salon_news_sm img { transform: scale(1.07); } .salon_news_sm_text { width: 65%; float: left; padding-left: 20px; } .salon_news_sm_text a:link { max-height: 64px; font-size: 1.2em; color: rgba(34, 34, 34, 1); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .salon_news_sm_text a:visited { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .salon_news_sm_text a:hover { font-size: 1.2em; color: rgba(231, 130, 51, 1); text-decoration: none; } .salon_news_sm_text a:active { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .salon_news_sm_text span { font-size: 1em; color: rgba(195, 191, 191, 1) !important; display: block; margin-top: 10px; } /* module news activity */ .activeity_con { padding: 0px; margin: -15px 0 0 0 !important; list-style: none; } .activeity_con li { display: block; padding: 15px 0; border-bottom: 1px solid rgba(224, 224, 224, 1); } .activeity_con li div { width: 100%; } .activeity_con li div i { width: 0; height: 0; border-top: 5px solid transparent; border-left: 6px solid rgba(231, 130, 51, 1); border-bottom: 5px solid transparent; display: inline-block; margin-right: 5px; vertical-align: middle; } .activeity_con li div a:link { max-height: 20px; font-size: 1.1em; margin-top: -17px; padding-left: 12px; color: rgba(34, 34, 34, 1); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .activeity_con li div a:visited { font-size: 1.1em; color: rgba(34, 34, 34, 1); } .activeity_con li div a:hover { font-size: 1.1em; color: rgba(231, 130, 51, 1); text-decoration: none;} .activeity_con li div a:active { font-size: 1.1em; color: rgba(34, 34, 34, 1);} .activeity_con li span { font-size: 1em; color: rgba(195, 191, 191, 1);} /* module recommend */ .recommend_title { border-bottom: 1px solid rgba(224, 224, 224, 1); margin-top: 20px; } .recommend_title span { border-bottom: 3px solid rgba(231, 130, 51, 1); display: inline-block; padding: 10px 0px; font-size: 1.4em; font-weight: bold; color: rgba(34, 34, 34, 1); } .recommend_con { margin: 0px; padding: 0px; list-style: none; } .recommend_con li { width: 25%; float: left; box-sizing: border-box; margin-top: 25px; padding-right: 25px; } .recommend_con li:nth-of-type(4) { padding-right: 0px; } .recommend_con li:nth-of-type(8) { padding-right: 0px; } .recommend_con li a:link { display: block; border: 1px solid rgba(204, 204, 204, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a:visited { display: block; border: 1px solid rgba(204, 204, 204, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a:hover { display: block; border: 1px solid rgba(231, 131, 51, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a:active { display: block; border: 1px solid rgba(204, 204, 204, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a img { height: 40px; } /*-------------- modal --------------*/ .custom-width { width: 400px !important; } .custom-modal-content { -webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; -o-border-radius: 0px !important; border-radius: 0px !important; padding: 10px 15px !important; } /*-------------- user center --------------*/ .center-left { width: 240px; border: 1px solid rgba(220,220,220,1); background: rgba(2552, 255, 255, 1); text-align: center; padding-top: 50px; padding-bottom: 5px; position: absolute; top: 15px; left: 15px; } .center-header-box { width: 90px; height: 90px; margin-right: auto; margin-left: auto; position: relative; } .center-header-box a:link { width: 22px; height: 22px; display: inline-block; position: absolute; right: 2px; top: 2px; background: rgba(255, 255, 255, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(153, 153, 153, 1); -moz-box-shadow: 0 0 4px rgba(153, 153, 153, 1); -o-box-shadow: 0 0 4px rgba(153, 153, 153, 1); box-shadow: 0 0 4px rgba(153, 153, 153, 1); -webkit-transition: background-color 0.4s ease-out; -moz-transition: background-color 0.4s ease-out; -o-transition: background-color 0.4s ease-out; transition: background-color 0.4s ease-out; } .center-header-box a:visite { background: rgba(255, 255, 255, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; } .center-header-box a:hover { background: rgba(242, 242, 242, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; } .center-header-box a:active { background: rgba(255, 255, 255, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; } .center-header { width: 90px; height: 90px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; overflow: hidden; background: rgba(244, 244, 244, 1); text-align: center; position: relative; } .center-header img { width: 90px; } .center-nav { width: 100%; margin: 50px 0 0 0; padding: 0px; list-style: none; } .center-nav li { display: block; } .center-nav li a:link { display: block; border-left: 3px solid none; color: rgba(36, 36, 36, 1); font-size: 1.1em; text-align: center; background: none; padding: 10px 0; -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out;transition: all 0.4s ease-out; } .center-nav li a:visited { border-left: 3px solid rgba(255, 255, 255, 1); color: rgba(36, 36, 36, 1); } .center-nav li a:hover { border-left: 3px solid rgba(229, 130, 61, 1); text-decoration: none; background: rgba(242, 242, 242, 1); color: rgba(36, 36, 36, 1); } .center-nav li a:active { border-left: 3px solid rgba(255, 255, 255, 1); color: rgba(36, 36, 36, 1); } .current-center-nav { border-left: 3px solid rgba(229, 130, 61, 1) !important; text-decoration: none; background: rgba(242, 242, 242, 1) !important; } .center-nav li a i { width: 25px; height: 25px; display: inline-block; vertical-align: middle; margin-right: 5px; } .icon-personal-info { background: url(../img/salon@2x.png) -50px -300px no-repeat;background-size: 200px auto; } .icon-modify-psd { background: url(../img/salon@2x.png) -126px -300px no-repeat; background-size: 200px auto; } .icon-empower-account { background: url(../img/salon@2x.png) -163px -300px no-repeat; background-size: 200px auto;} .icon-file { background: url(../img/salon@2x.png) -90px -302px no-repeat; background-size: 200px auto; } .icon-user-info { background: url(../img/salon@2x.png) -15px -300px no-repeat; background-size: 200px auto; } .center-exit { margin: 70px 15px 0px 15px; border-top: 1px solid rgba(220, 220, 220, 1); } .center-exit a i { width: 25px; height: 25px; display: inline-block; background: url(../img/salon@2x.png) -14px -328px no-repeat; background-size: 200px auto; vertical-align: middle; margin-right: 5px; } .center-exit a:link { display: block; padding: 10px 0; text-align: center; font-size: 1.1em; color: rgba(36, 36, 36, 1); background: none; -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .center-exit a:visited { background: none; color: rgba(36, 36, 36, 1); } .center-exit a:hover { background: rgba(242, 242, 242, 1); text-decoration: none; color: rgba(36, 36, 36, 1); } .center-exit a:active { background: none; color: rgba(36, 36, 36, 1); } .add-header { width: 60%; float: left; text-align: center; } .add-header a { width: 100px; height: 100px; border: 1px dotted rgba(172, 172, 172, 1); display: inline-block; padding-top: 25px; text-align: center; margin-right: auto; margin-left: auto; -webkit-transition: background 0.3s ease-out, border 0.3s ease-out; -moz-transition: background 0.3s ease-out, border 0.3s ease-out; -o-transition: background 0.3s ease-out, border 0.3s ease-out; transition: background 0.3s ease-out, border 0.3s ease-out; } .add-header a i { width: 50px; height: 50px; background: url(../img/hr_tach@2x.png) -17px -345px no-repeat; background-size: 200px auto; display: inline-block; margin-left: auto; margin-right: auto; } .add-header a:hover { width: 100px; height: 100px; border: 1px dotted rgba(46, 186, 238, 1); display: inline-block; padding-top: 25px; text-align: center; margin-right: auto; margin-left: auto;} .add-header a:hover i { width: 50px; height: 50px; background: url(../img/hr_tach@2x.png) -89px -345px no-repeat; background-size: 200px auto; display: inline-block; margin-left: auto; margin-right: auto; } .add-header span { display: block; text-align: center; padding: 10px 0; } .add-header-show-title { font-size: 1em; color: rgba(135, 135, 135, 1); display: block; text-align: center; } .add-header-show { background: rgba(236, 239, 241, 1); text-align: center; padding: 20px 0; } .add-header-show-img { width: 120px; height: 120px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; overflow: hidden; margin-right: auto; margin-left: auto; } .add-header-show-img img { width: 120px; } .center-right-box { width: 100%; min-height: 550px; padding-left: 260px; } .center-right { margin-right: 0px; padding-top: 15px; } .center-right-title { border-bottom: 1px solid rgba(221, 221, 221, 1); text-align: left; margin-bottom: 15px; } .center-right-title span { font-size: 1.1em; font-weight: bold; color: rgba(36, 36, 36, 1); padding: 0px 0px 5px 0px; display: inline-block; border-bottom: 4px solid rgba(229, 130, 61, 1); margin-bottom: -1px; } .center-right-con { background: rgba(255, 255, 255, 1); padding: 15px 30px 40px 15px; } .form-group-new label { font-weight: 500 !important; color: rgba(135, 135, 135, 1) !important; font-size: 1.1em; } .form-group-new input { -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .form-group-new select { -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .center-empower { width: 100%; margin: 30px 0 0 0; padding: 0px; list-style: none; } .center-empower li { display: block; padding: 10px 0; } .center-empower li img { width: 50px; float: left; vertical-align: middle; margin-left: 30px; } .center-empower li span { display: inline-block; vertical-align: middle; float: left; } .center-empower li span:nth-of-type(1) { width: 25%; text-align: center; padding-top: 15px; } .center-empower li span:nth-of-type(2) { width: 30%; text-align: center; padding-top: 15px; } .center-empower li a { float: right; margin-top: 10px; text-align: center; display: inline-block; padding: 6px 30px; } .video_con { width:263px!important; height:180px!important; } @media screen and (max-width: 768px) { /* module images news */ .space-top { margin-top: 60px; } .news_img { padding: 0px; margin: 0px; list-style: none; } .news_img li:nth-of-type(1) { padding: 15px 8px 0 0; } .news_img li:nth-of-type(2) { width: 50%; display: inline-block; float: left; padding: 15px 0px 0 7px; } .news_img li:nth-of-type(3) { padding: 15px 8px 0 0; } .news_img li:nth-of-type(4) { width: 50%; display: inline-block; float: left; padding: 15px 0px 0 7px; } .news_img li div { height: auto!important; } .news_img li div a img { width: 100%!important; height: 120px!important; } .news_img li div span { width: 100%; max-height: 28px; background: rgba(0, 0, 0, .7); position: absolute; bottom: 0px; left: 0px; padding: 5px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } /* module information */ .info_right { padding-left: 0px; } /* module news */ .salon_news_left { padding-right: 0px; } .salon_news_right { padding-left: 0px; } /* module news */ .salon_news_sm_text a:link { max-height: 55px; font-size: 1.2em; color: rgba(34, 34, 34, 1); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .salon_news_sm_text a:visited { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .salon_news_sm_text a:hover { font-size: 1.2em; color: rgba(231, 130, 51, 1); text-decoration: none; } .salon_news_sm_text a:active { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .tag-con { width: 100%; padding: 0px; margin: 0px; list-style: none; overflow: hidden; overflow-y: hidden; overflow-x: scroll; display: none; } .tag-con li { border-bottom: 1px solid rgba(230, 232, 235, 1); padding: 15px 0 70px 0; position: relative; display: inline-block; } .tag-con li .tag-img-con { width: 100%; float: left; position: relative; overflow: hidden; } .tag-con li .tag-img-con img { width: 100%; position: relative; z-index: 88; } .tag-con li .tag-img-con span { height: 22px; line-height: 22px; padding: 0 10px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; text-align: center; background: rgba(0, 0, 0, .7); color: rgba(255, 255, 255, 1); font-size: .9em; position: absolute; top: 15px; left: 15px; z-index: 98; } .tag-text-con { width: 100%; height: 100%; margin: 0; padding: 0 0 20px 0; } .tag-text-con .tag-caption { max-height: 45px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 1.2em; color: rgba(50, 54, 59, 1); -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; -o-transition: color 0.3s ease-out; transition: color 0.3s ease-out; border-bottom: none; margin-top: 8px; } .tag-text-con .tag-caption:hover { color: rgba(229, 130, 61, 1); } .tag-text-con .tag-subtitle { width: 100%; max-height: 80px; display: block; font-size: 1.1em; color: rgba(158, 153, 149, 1); text-align: left; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 3; overflow: hidden; } .tag-text-con .tag-bottom { width: 100%; position: absolute; right: 0px; bottom: 15px; } .tag-text-con .tag-time { width: 100%; text-align: left; padding-left: 0px; display: block; } .tag-text-con .tag-time .text-from { display: inline-block; color: rgba(210, 210, 210, 1); } .tag-text-con .tag-time .text-from span:first-of-type { color: rgba(38, 159, 209, 1); padding-right: 3px; } .tag-text-con .tag-time .text-from span:last-of-type { color: rgba(229, 130, 61, 1); padding-left: 3px; } .tag-text-con .tag-time .tag-time-con { color: rgba(210, 210, 210, 1); padding-left: 15px; } .tag-text-con .tag-time .tag-time-con i { width: 13px; height: 13px; display: inline-block; background: url(../img/hr_tach@2x.png) -168px -75px no-repeat; background-size: 200px auto; vertical-align: middle; margin-right: 4px; } .tag-text-con .tag-operate { width: 100%; text-align: left; display: block; padding-top: 6px; } .tag-text-con .tag-operate a { margin-left: 0px; margin-right: 8px;} .salon_news_list li .salon_news_sm { width: 35%; height: 70px; display: inline-block; float: left; overflow: hidden; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } /* module recommend */ .recommend_title { border-bottom: 1px solid rgba(224, 224, 224, 1); margin-top: 20px; } .recommend_title span { border-bottom: 3px solid rgba(231, 130, 51, 1); display: inline-block; padding: 10px 0px; font-size: 1.4em; font-weight: bold; color: rgba(34, 34, 34, 1); } .recommend_con { margin: 0px; padding: 0px; list-style: none; } .recommend_con li { width: 50%; float: left; box-sizing: border-box; margin-top: 25px; padding-right: 25px; } .recommend_con li:nth-of-type(2) { padding-right: 0px;} .recommend_con li:nth-of-type(4) { padding-right: 0px; } .recommend_con li:nth-of-type(6) { padding-right: 0px; } .recommend_con li:nth-of-type(8) { padding-right: 0px; } .recommend_con li a img { height: 26px; } /*------------------ bottom ------------------*/ .mobile_hidden { width: 100%; margin-top: 30px; } /* module advertisement */ .ad_con { width: 100%; overflow: hidden; margin: 15px 0; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .ad_con a img { width: 100%; } } ======= /*------------------ index ------------------*/ /* module images news */ .space-top { margin-top: 110px } .news_img { padding: 0px; margin: 0px; list-style: none; } .news_img li { width: 50%; display: inline-block; float: left; padding: 15px 15px 0 0; } .news_img li div { width: 100%; height: 223px; position: relative; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; overflow: hidden; } .news_img li div img { width: 100%!important; height: 100%!important; object-fit: cover; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s; } .news_img li div img:hover { transform: scale(1.07); } .news_img li div span { width: 100%; max-height: 58px; background: rgba(0, 0, 0, .7); position: absolute; bottom: 0px; left: 0px; padding: 10px 15px; display: inline-block; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden } .news_img li div span a:link { color: rgba(255, 255, 255, 1); font-size: 1.1em; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .news_img li div span a:visited { color: rgba(255, 255, 255, 1); font-size: 1.1em; } .news_img li div span a:hover { color: rgba(231, 130, 51, 1); font-size: 1.1em; text-decoration: none; } .news_img li div span a:active { color: rgba(255, 255, 255, 1); font-size: 1.1em; } /* module tag */ .tag-title-con { width: 100%; } .tag-title { padding: 10px 0; margin: 15px 0 0 0; list-style: none; border-bottom: 1px solid rgba(230, 232, 235, 1); display: block; } .tag-title li { float: left; } .tag-title li a { font-size: 1.1em; color: rgba(50, 54, 59, 1); font-weight: bold; padding: 8px 18px; margin: 0 2px; display: inline-block; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -webkit-transition: background-color 0.3s ease-out, color 0.3s ease-out; -moz-transition: background-color 0.3s ease-out, color 0.3s ease-out; -o-transition: background-color 0.3s ease-out, color 0.3s ease-out; transition: background-color 0.3s ease-out, color 0.3s ease-out; } .tag-title li a:hover { background: rgba(38, 159, 209, 1); color: rgba(255, 255, 255, 1); text-decoration: none } .tag-title li .current-tag { background: rgba(38, 159, 209, 1); color: rgba(255, 255, 255, 1); -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; } .tag-con { width: 100%; padding: 0px; margin: 0px; list-style: none; display: none; } .tag-con li { border-bottom: 1px solid rgba(230, 232, 235, 1); padding: 20px 0; position: relative; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .tag-con li:hover { background: rgba(246, 246, 246, 1); } .tag-con li .tag-img-con { width: 35%; float: left; position: relative; overflow: hidden; } .tag-con li .tag-img-con img { width: 100%; position: relative; z-index: 88; cursor: pointer; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s } .tag-con li:hover .tag-img-con img { transform: scale(1.07); } .tag-img-con span { height: 22px; line-height: 22px; padding: 0 10px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; text-align: center; background: rgba(0, 0, 0, .7); color: rgba(255, 255, 255, 1); font-size: .9em;position: absolute; top: 15px; left: 15px; z-index: 98; } .tag-text-con { width: 65%; height: 100%; float: left; padding: 0 0 0 15px; } .tag-text-con .tag-caption { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-top: -2px; font-size: 1.3em; font-weight: bold; color: rgba(50, 54, 59, 1); -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; -o-transition: color 0.3s ease-out; transition: color 0.3s ease-out; border-bottom: none; } .tag-text-con .tag-caption:hover { color: rgba(229, 130, 61, 1); } .tag-text-con .tag-subtitle { width: 100%; max-height: 70px; display: block; font-size: 1em; color: rgba(158, 153, 149, 1); text-align: left; margin-top: 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; } .tag-text-con .tag-bottom { width: 65%; position: absolute; right: 0px; bottom: 23px; } .tag-text-con .tag-time { width: 60%; float: left; text-align: left; padding-left: 15px; } .tag-text-con .tag-time .text-from { display: inline-block; color: rgba(210, 210, 210, 1); } .tag-text-con .tag-time .text-from span:first-of-type { color: rgba(38, 159, 209, 1); padding-right: 3px; } .tag-text-con .tag-time .text-from span:last-of-type { color: rgba(229, 130, 61, 1); padding-left: 3px; } .tag-text-con .tag-time .tag-time-con { color: rgba(210, 210, 210, 1); padding-left: 15px; } .tag-text-con .tag-time .tag-time-con i { width: 13px; height: 13px; display: inline-block; background: url(../img/hr_tach@2x.png) -168px -75px no-repeat; background-size: 200px auto; vertical-align: middle; margin-right: 4px; } .tag-text-con .tag-operate { width: 40%; float: right; text-align: right; } .tag-text-con .tag-operate a { color: rgba(210, 210, 210, 1); margin-left: 10px; -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; -o-transition: color 0.3s ease-out; transition: color 0.3s ease-out; } .tag-text-con .tag-operate a:hover { color: rgba(38, 159, 209, 1); text-decoration: none; } .tag-text-con .tag-operate a i { width: 19px; height: 17px; vertical-align: middle; display: inline-block; margin-right: 3px; } .tag-text-con .tag-operate a .icon-seen { background: url(../img/hr_tach@2x.png) -92px -19px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a .icon-like { background: url(../img/hr_tach@2x.png) -116px -19px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a .icon-share { background: url(../img/hr_tach@2x.png) -141px -19px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a:hover .icon-seen { background: url(../img/hr_tach@2x.png) -92px -44px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a:hover .icon-like { background: url(../img/hr_tach@2x.png) -116px -44px no-repeat; background-size: 200px auto; } .tag-text-con .tag-operate a:hover .icon-share { background: url(../img/hr_tach@2x.png) -141px -44px no-repeat; background-size: 200px auto; } /* module information */ .info_right { padding-left: 10px; } .info_title { background: rgba(231, 130, 51, 1); padding: 10px 15px; margin-top: 15px; } .info_title span { font-size: 1.2em; color: rgba(255, 255, 255, 1); font-weight: bold; display: inline-block; } .info_list { padding: 0px; margin: 0px; list-style: none; } .info_list li { width: 100%; display: inline-block; border-bottom: 1px solid rgba(224, 224, 224, 1); padding: 18px 0 15px 0; } .info_list li i { width: 0; height: 0; border-top: 5px solid transparent; border-left: 6px solid rgba(231, 130, 51, 1); border-bottom: 5px solid transparent; display: block; } .info_list li a:link { height: 22px; font-size: 1.1em; color: rgba(34, 34, 34, 1); margin-top: -15px; padding: 0 40px 0 13px; display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .info_list li a:visited { font-size: 1.1em; color: rgba(34, 34, 34, 1); } .info_list li a:hover { font-size: 1.1em; color: rgba(231, 130, 51, 1); text-decoration: none; } .info_list li a:active { font-size: 1.1em; color: rgba(34, 34, 34, 1); } .info_list li span { font-size: 1em; color: rgba(195, 191, 191, 1); display: block; text-align: right; margin-top: -21px; } /* module advertisement */ .ad_con { width: 100%; overflow: hidden; margin: 20px 0; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .ad_con a img { width: 100%;} /* module news */ .salon_news_left { padding-right: 15px; } .salon_news_right { padding-left: 15px; } .salon_news_title { border-bottom: 1px solid rgba(224, 224, 224, 1); margin-bottom: 20px; } .salon_news_title span { display: inline-block; padding: 0px 0 7px 0; font-size: 1.4em; color: rgba(34, 34, 34, 1); font-weight: bold; border-bottom: 3px solid rgba(231, 130, 51, 1); } .salon_news_con { width: 100%; margin-bottom: 20px; } .salon_news_con:hover { background: rgba(248,248,248,1); } .salon_news_con a:nth-of-type(2) { max-height: 38px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .salon_news_con .salon_news_img { width: 100%; height: 250px; overflow: hidden; display: inline-block; margin-bottom: 5px; } .salon_news_con .salon_news_img img { width: 100%!important; height: 100%!important; object-fit: cover; cursor: pointer; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s } .salon_news_con:hover .salon_news_img img { transform: scale(1.07); } .salon_news_summary { height: 57px; font-size: 1em; color: rgba(183, 183, 183, 1); margin: 5px 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden } .salon_news_hour { font-size: 1em; color: rgba(195, 191, 191, 1); display: block; } .salon_news_list { width: 100%; padding: 0px; margin: 0px; list-style: none; display: inline-block; } .salon_news_list li { border-bottom: 1px solid rgba(224, 224, 224, 1); display: block; padding: 15px 0; } .salon_news_list li:hover { background:rgba(248,248,248,1); } .salon_news_list li .salon_news_sm { width: 35%; height: 100px; display: inline-block; float: left; overflow: hidden; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .salon_news_list li .salon_news_sm img { width: 100%!important; height: 100%!important; object-fit: cover; -webkit-transition: all 0.8s; -moz-transition: all 0.8s; -o-transition: all 0.8s; transition: all 0.8s; } .salon_news_list li:hover .salon_news_sm img { transform: scale(1.07); } .salon_news_sm_text { width: 65%; float: left; padding-left: 20px; } .salon_news_sm_text a:link { max-height: 64px; font-size: 1.2em; color: rgba(34, 34, 34, 1); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .salon_news_sm_text a:visited { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .salon_news_sm_text a:hover { font-size: 1.2em; color: rgba(231, 130, 51, 1); text-decoration: none; } .salon_news_sm_text a:active { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .salon_news_sm_text span { font-size: 1em; color: rgba(195, 191, 191, 1) !important; display: block; margin-top: 10px; } /* module news activity */ .activeity_con { padding: 0px; margin: -15px 0 0 0 !important; list-style: none; } .activeity_con li { display: block; padding: 15px 0; border-bottom: 1px solid rgba(224, 224, 224, 1); } .activeity_con li div { width: 100%; } .activeity_con li div i { width: 0; height: 0; border-top: 5px solid transparent; border-left: 6px solid rgba(231, 130, 51, 1); border-bottom: 5px solid transparent; display: inline-block; margin-right: 5px; vertical-align: middle; } .activeity_con li div a:link { max-height: 20px; font-size: 1.1em; margin-top: -17px; padding-left: 12px; color: rgba(34, 34, 34, 1); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .activeity_con li div a:visited { font-size: 1.1em; color: rgba(34, 34, 34, 1); } .activeity_con li div a:hover { font-size: 1.1em; color: rgba(231, 130, 51, 1); text-decoration: none;} .activeity_con li div a:active { font-size: 1.1em; color: rgba(34, 34, 34, 1);} .activeity_con li span { font-size: 1em; color: rgba(195, 191, 191, 1);} /* module recommend */ .recommend_title { border-bottom: 1px solid rgba(224, 224, 224, 1); margin-top: 20px; } .recommend_title span { border-bottom: 3px solid rgba(231, 130, 51, 1); display: inline-block; padding: 10px 0px; font-size: 1.4em; font-weight: bold; color: rgba(34, 34, 34, 1); } .recommend_con { margin: 0px; padding: 0px; list-style: none; } .recommend_con li { width: 25%; float: left; box-sizing: border-box; margin-top: 25px; padding-right: 25px; } .recommend_con li:nth-of-type(4) { padding-right: 0px; } .recommend_con li:nth-of-type(8) { padding-right: 0px; } .recommend_con li a:link { display: block; border: 1px solid rgba(204, 204, 204, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a:visited { display: block; border: 1px solid rgba(204, 204, 204, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a:hover { display: block; border: 1px solid rgba(231, 131, 51, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a:active { display: block; border: 1px solid rgba(204, 204, 204, 1); text-align: center; padding: 15px 0; cursor: pointer; } .recommend_con li a img { height: 40px; } /*-------------- modal --------------*/ .custom-width { width: 400px !important; } .custom-modal-content { -webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; -o-border-radius: 0px !important; border-radius: 0px !important; padding: 10px 15px !important; } /*-------------- user center --------------*/ .center-left { width: 240px; border: 1px solid rgba(220,220,220,1); background: rgba(2552, 255, 255, 1); text-align: center; padding-top: 50px; padding-bottom: 5px; position: absolute; top: 15px; left: 15px; } .center-header-box { width: 90px; height: 90px; margin-right: auto; margin-left: auto; position: relative; } .center-header-box a:link { width: 22px; height: 22px; display: inline-block; position: absolute; right: 2px; top: 2px; background: rgba(255, 255, 255, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 4px rgba(153, 153, 153, 1); -moz-box-shadow: 0 0 4px rgba(153, 153, 153, 1); -o-box-shadow: 0 0 4px rgba(153, 153, 153, 1); box-shadow: 0 0 4px rgba(153, 153, 153, 1); -webkit-transition: background-color 0.4s ease-out; -moz-transition: background-color 0.4s ease-out; -o-transition: background-color 0.4s ease-out; transition: background-color 0.4s ease-out; } .center-header-box a:visite { background: rgba(255, 255, 255, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; } .center-header-box a:hover { background: rgba(242, 242, 242, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; } .center-header-box a:active { background: rgba(255, 255, 255, 1) url(../img/salon@2x.png) -51px -327px no-repeat; background-size: 200px auto; } .center-header { width: 90px; height: 90px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; overflow: hidden; background: rgba(244, 244, 244, 1); text-align: center; position: relative; } .center-header img { width: 90px; } .center-nav { width: 100%; margin: 50px 0 0 0; padding: 0px; list-style: none; } .center-nav li { display: block; } .center-nav li a:link { display: block; border-left: 3px solid none; color: rgba(36, 36, 36, 1); font-size: 1.1em; text-align: center; background: none; padding: 10px 0; -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out;transition: all 0.4s ease-out; } .center-nav li a:visited { border-left: 3px solid rgba(255, 255, 255, 1); color: rgba(36, 36, 36, 1); } .center-nav li a:hover { border-left: 3px solid rgba(229, 130, 61, 1); text-decoration: none; background: rgba(242, 242, 242, 1); color: rgba(36, 36, 36, 1); } .center-nav li a:active { border-left: 3px solid rgba(255, 255, 255, 1); color: rgba(36, 36, 36, 1); } .current-center-nav { border-left: 3px solid rgba(229, 130, 61, 1) !important; text-decoration: none; background: rgba(242, 242, 242, 1) !important; } .center-nav li a i { width: 25px; height: 25px; display: inline-block; vertical-align: middle; margin-right: 5px; } .icon-personal-info { background: url(../img/salon@2x.png) -50px -300px no-repeat;background-size: 200px auto; } .icon-modify-psd { background: url(../img/salon@2x.png) -126px -300px no-repeat; background-size: 200px auto; } .icon-empower-account { background: url(../img/salon@2x.png) -163px -300px no-repeat; background-size: 200px auto;} .icon-file { background: url(../img/salon@2x.png) -90px -302px no-repeat; background-size: 200px auto; } .icon-user-info { background: url(../img/salon@2x.png) -15px -300px no-repeat; background-size: 200px auto; } .center-exit { margin: 70px 15px 0px 15px; border-top: 1px solid rgba(220, 220, 220, 1); } .center-exit a i { width: 25px; height: 25px; display: inline-block; background: url(../img/salon@2x.png) -14px -328px no-repeat; background-size: 200px auto; vertical-align: middle; margin-right: 5px; } .center-exit a:link { display: block; padding: 10px 0; text-align: center; font-size: 1.1em; color: rgba(36, 36, 36, 1); background: none; -webkit-transition: all 0.4s ease-out; -moz-transition: all 0.4s ease-out; -o-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .center-exit a:visited { background: none; color: rgba(36, 36, 36, 1); } .center-exit a:hover { background: rgba(242, 242, 242, 1); text-decoration: none; color: rgba(36, 36, 36, 1); } .center-exit a:active { background: none; color: rgba(36, 36, 36, 1); } .add-header { width: 60%; float: left; text-align: center; } .add-header a { width: 100px; height: 100px; border: 1px dotted rgba(172, 172, 172, 1); display: inline-block; padding-top: 25px; text-align: center; margin-right: auto; margin-left: auto; -webkit-transition: background 0.3s ease-out, border 0.3s ease-out; -moz-transition: background 0.3s ease-out, border 0.3s ease-out; -o-transition: background 0.3s ease-out, border 0.3s ease-out; transition: background 0.3s ease-out, border 0.3s ease-out; } .add-header a i { width: 50px; height: 50px; background: url(../img/hr_tach@2x.png) -17px -345px no-repeat; background-size: 200px auto; display: inline-block; margin-left: auto; margin-right: auto; } .add-header a:hover { width: 100px; height: 100px; border: 1px dotted rgba(46, 186, 238, 1); display: inline-block; padding-top: 25px; text-align: center; margin-right: auto; margin-left: auto;} .add-header a:hover i { width: 50px; height: 50px; background: url(../img/hr_tach@2x.png) -89px -345px no-repeat; background-size: 200px auto; display: inline-block; margin-left: auto; margin-right: auto; } .add-header span { display: block; text-align: center; padding: 10px 0; } .add-header-show-title { font-size: 1em; color: rgba(135, 135, 135, 1); display: block; text-align: center; } .add-header-show { background: rgba(236, 239, 241, 1); text-align: center; padding: 20px 0; } .add-header-show-img { width: 120px; height: 120px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; overflow: hidden; margin-right: auto; margin-left: auto; } .add-header-show-img img { width: 120px; } .center-right-box { width: 100%; min-height: 550px; padding-left: 260px; } .center-right { margin-right: 0px; padding-top: 15px; } .center-right-title { border-bottom: 1px solid rgba(221, 221, 221, 1); text-align: left; margin-bottom: 15px; } .center-right-title span { font-size: 1.1em; font-weight: bold; color: rgba(36, 36, 36, 1); padding: 0px 0px 5px 0px; display: inline-block; border-bottom: 4px solid rgba(229, 130, 61, 1); margin-bottom: -1px; } .center-right-con { background: rgba(255, 255, 255, 1); padding: 15px 30px 40px 15px; } .form-group-new label { font-weight: 500 !important; color: rgba(135, 135, 135, 1) !important; font-size: 1.1em; } .form-group-new input { -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .form-group-new select { -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .center-empower { width: 100%; margin: 30px 0 0 0; padding: 0px; list-style: none; } .center-empower li { display: block; padding: 10px 0; } .center-empower li img { width: 50px; float: left; vertical-align: middle; margin-left: 30px; } .center-empower li span { display: inline-block; vertical-align: middle; float: left; } .center-empower li span:nth-of-type(1) { width: 25%; text-align: center; padding-top: 15px; } .center-empower li span:nth-of-type(2) { width: 30%; text-align: center; padding-top: 15px; } .center-empower li a { float: right; margin-top: 10px; text-align: center; display: inline-block; padding: 6px 30px; } .video_con { width:263px!important; height:180px!important; } @media screen and (max-width: 768px) { /* module images news */ .space-top { margin-top: 60px; } .news_img { padding: 0px; margin: 0px; list-style: none; } .news_img li:nth-of-type(1) { padding: 15px 8px 0 0; } .news_img li:nth-of-type(2) { width: 50%; display: inline-block; float: left; padding: 15px 0px 0 7px; } .news_img li:nth-of-type(3) { padding: 15px 8px 0 0; } .news_img li:nth-of-type(4) { width: 50%; display: inline-block; float: left; padding: 15px 0px 0 7px; } .news_img li div { height: auto!important; } .news_img li div a img { width: 100%!important; height: 120px!important; } .news_img li div span { width: 100%; max-height: 28px; background: rgba(0, 0, 0, .7); position: absolute; bottom: 0px; left: 0px; padding: 5px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } /* module information */ .info_right { padding-left: 0px; } /* module news */ .salon_news_left { padding-right: 0px; } .salon_news_right { padding-left: 0px; } /* module news */ .salon_news_sm_text a:link { max-height: 55px; font-size: 1.2em; color: rgba(34, 34, 34, 1); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; -webkit-transition: color 0.4s ease; -moz-transition: color 0.4s ease; -o-transition: color 0.4s ease; transition: color 0.4s ease; } .salon_news_sm_text a:visited { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .salon_news_sm_text a:hover { font-size: 1.2em; color: rgba(231, 130, 51, 1); text-decoration: none; } .salon_news_sm_text a:active { font-size: 1.2em; color: rgba(34, 34, 34, 1); } .tag-con { width: 100%; padding: 0px; margin: 0px; list-style: none; overflow: hidden; overflow-y: hidden; overflow-x: scroll; display: none; } .tag-con li { border-bottom: 1px solid rgba(230, 232, 235, 1); padding: 15px 0 70px 0; position: relative; display: inline-block; } .tag-con li .tag-img-con { width: 100%; float: left; position: relative; overflow: hidden; } .tag-con li .tag-img-con img { width: 100%; position: relative; z-index: 88; } .tag-con li .tag-img-con span { height: 22px; line-height: 22px; padding: 0 10px; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; text-align: center; background: rgba(0, 0, 0, .7); color: rgba(255, 255, 255, 1); font-size: .9em; position: absolute; top: 15px; left: 15px; z-index: 98; } .tag-text-con { width: 100%; height: 100%; margin: 0; padding: 0 0 20px 0; } .tag-text-con .tag-caption { max-height: 45px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 1.2em; color: rgba(50, 54, 59, 1); -webkit-transition: color 0.3s ease-out; -moz-transition: color 0.3s ease-out; -o-transition: color 0.3s ease-out; transition: color 0.3s ease-out; border-bottom: none; margin-top: 8px; } .tag-text-con .tag-caption:hover { color: rgba(229, 130, 61, 1); } .tag-text-con .tag-subtitle { width: 100%; max-height: 80px; display: block; font-size: 1.1em; color: rgba(158, 153, 149, 1); text-align: left; display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 3; overflow: hidden; } .tag-text-con .tag-bottom { width: 100%; position: absolute; right: 0px; bottom: 15px; } .tag-text-con .tag-time { width: 100%; text-align: left; padding-left: 0px; display: block; } .tag-text-con .tag-time .text-from { display: inline-block; color: rgba(210, 210, 210, 1); } .tag-text-con .tag-time .text-from span:first-of-type { color: rgba(38, 159, 209, 1); padding-right: 3px; } .tag-text-con .tag-time .text-from span:last-of-type { color: rgba(229, 130, 61, 1); padding-left: 3px; } .tag-text-con .tag-time .tag-time-con { color: rgba(210, 210, 210, 1); padding-left: 15px; } .tag-text-con .tag-time .tag-time-con i { width: 13px; height: 13px; display: inline-block; background: url(../img/hr_tach@2x.png) -168px -75px no-repeat; background-size: 200px auto; vertical-align: middle; margin-right: 4px; } .tag-text-con .tag-operate { width: 100%; text-align: left; display: block; padding-top: 6px; } .tag-text-con .tag-operate a { margin-left: 0px; margin-right: 8px;} .salon_news_list li .salon_news_sm { width: 35%; height: 70px; display: inline-block; float: left; overflow: hidden; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } /* module recommend */ .recommend_title { border-bottom: 1px solid rgba(224, 224, 224, 1); margin-top: 20px; } .recommend_title span { border-bottom: 3px solid rgba(231, 130, 51, 1); display: inline-block; padding: 10px 0px; font-size: 1.4em; font-weight: bold; color: rgba(34, 34, 34, 1); } .recommend_con { margin: 0px; padding: 0px; list-style: none; } .recommend_con li { width: 50%; float: left; box-sizing: border-box; margin-top: 25px; padding-right: 25px; } .recommend_con li:nth-of-type(2) { padding-right: 0px;} .recommend_con li:nth-of-type(4) { padding-right: 0px; } .recommend_con li:nth-of-type(6) { padding-right: 0px; } .recommend_con li:nth-of-type(8) { padding-right: 0px; } .recommend_con li a img { height: 26px; } /*------------------ bottom ------------------*/ .mobile_hidden { width: 100%; margin-top: 30px; display:none; } /* module advertisement */ .ad_con { width: 100%; overflow: hidden; margin: 15px 0; -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .ad_con a img { width: 100%; } } >>>>>>> .r94