@charset "UTF-8"; /* Scss Document */ @import url(base.jpg.css); @import url(stylesheet.jpg.css); @import url(font.jpg.css); .header { position: relative;} .header .topline { background: #e71616; /*filter: progid: dximagetransform . microsoft . gradient(gradienttype = 1, startcolorstr = '#6510ad', endcolorstr = '#4627ad');*/ /*background: linear-gradient(90deg, #6510ad 60%, #104fad);*/ height: 6px;} .header .navwrapper { position: absolute; width: 100%; z-index: 10;} .header .navwrapper .nav { float: right; padding-right: 35px; padding-top: 30px; padding-bottom: 30px;} @media screen and (max-width: 1400px) { .header .navwrapper .nav { padding-right: 10px;} } @media screen and (max-width: 1000px) { .header .navwrapper .nav { display: none;} } .header .navwrapper .nav .subnav ul { float: right; position: absolute; top: 40px; right: 60px;} @media screen and (max-width: 1400px) { .header .navwrapper .nav .subnav ul { right: 25px;} } .header .navwrapper .nav .subnav li { float: left; font-size: 14px; color: #fff;} @media screen and (max-width: 1280px) { .header .navwrapper .nav .subnav li { font-size: 12px;} } .header .navwrapper .nav .subnav li a { color: #fff; opacity: 0.75; display: block; padding-left: 25px;} .header .navwrapper .nav .subnav li a:hover { color: #d18e59;} .header .navwrapper .nav .subnav li.en { border-left: 1px solid rgba(255, 255, 255, 0.3); margin-left: 15px;} .header .navwrapper .nav .subnav li.en a { padding-left: 10px;} .header .navwrapper .nav .subnav li.search { padding-left: 50px; font-size: 16px; cursor: pointer; position: relative;} .header .navwrapper .nav .subnav li.search input { border: 1px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.1); height: 28px; line-height: 28px; color: #fff; border-radius: 14px; margin-top: -20px; width: 0px; text-indent: 10px; opacity: 0;} .header .navwrapper .nav .subnav li.search i.active { position: absolute; right: 0px; top: 0px;} .header .navwrapper .nav .subnav li.search button { display: none;} .header .navwrapper .nav .subnav li.search.active input { width: 150px; opacity: 1;} .header .navwrapper .nav .subnav li.search.active i.active { position: absolute; right: 10px; top: 0px;} .header .navwrapper .nav .subnav li.search.active i.active:before { content: '\ea1f';} .header .navwrapper .nav .mainnav { margin-top:39px; background:rgba(255,255,255,.6); border-radius:5px;} @media screen and (max-width: 1400px) { .header .navwrapper .nav .mainnav { margin-top: 35px;} } .header .navwrapper .nav .mainnav li { float: left; font-size: 18px; position: relative; line-height: 46px;} @media screen and (max-width: 1400px) { .header .navwrapper .nav .mainnav li { font-size: 16px;} } @media screen and (max-width: 1280px) { .header .navwrapper .nav .mainnav li { font-size: 14px;} } .header .navwrapper .nav .mainnav li a { color: #fff; display: block; padding: 0 25px;} @media screen and (max-width: 1400px) { .header .navwrapper .nav .mainnav li a { padding: 0 20px;} } @media screen and (max-width: 1280px) { .header .navwrapper .nav .mainnav li a { padding: 0 15px;} } .header .navwrapper .nav .mainnav li a.hover { color: #5e068c; background: #fff; border-top: 2px solid #d18e59; line-height: 44px;} .header .navwrapper .nav .mainnav li ul { background: #fff; position: absolute; top: 46px; width: 220px; z-index: 2; display: none; box-shadow: 0 8px 12px rgba(0, 0, 0, 0.1);} .header .navwrapper .nav .mainnav li ul.last { right: 0;} .header .navwrapper .nav .mainnav li ul li { float: none; display: block; padding: 0; margin: 0;} .header .navwrapper .nav .mainnav li ul li a { line-height: 44px; font-size: 16px; color: #000; padding: 0 0 0 25px;} @media screen and (max-width: 1400px) { .header .navwrapper .nav .mainnav li ul li a { font-size: 14px; padding-left: 20px;} } .header .navwrapper .nav .mainnav li ul li a:hover { background: #eee;} .header .navwrapper .logowrapper { position: absolute; width: 180px; left: 60px; top: 40px;} @media screen and (max-width: 1280px) { .header .navwrapper .logowrapper { width: 150px; left: 25px;} } @media screen and (max-width: 1000px) { .header .navwrapper .logowrapper { width: 90px; left: 12px; top: -37px;} } .header .navwrapper .logowrapper .logo { display: block;} .header .navwrapper .logowrapper .logo .logo1 { display: none;} .header .navwrapper .logowrapper img { height: 60px;} .header .topimg { position: relative; z-index: 0;} .header .topimg .slick-list li { background-repeat: no-repeat; background-position: center top; background-size: cover; height: calc(100vh - 6px); position: relative;} @media screen and (max-width: 1000px) { .header .topimg .slick-list li { height: calc(100vw * 0.469);} } @media screen and (max-width: 1000px){ .header .navwrapper .logowrapper .logo .logo1 { display: block;} .header .navwrapper .logowrapper .logo .logo2 { display: none;} .logo>img{ height: 26px !important; line-height: 48px;} } @media screen and (max-width: 400px) { .header .topimg .slick-list li { height: calc(100vw * 0.6);} } .header .topimg .slick-list li h3 { font-size: 40px; color: #fff; position: absolute; bottom: 220px; right: 100px; line-height: 1.5em; text-shadow: 2px 2px 0px #000; text-align: right; max-width: 70%;} @media screen and (max-width: 1400px) { .header .topimg .slick-list li h3 { font-size: 30px; right: 50px; bottom: 140px;} } @media screen and (max-width: 1280px) { .header .topimg .slick-list li h3 { font-size: 24px; right: 40px; max-width: 50%;} } @media screen and (max-width: 1000px) { .header .topimg .slick-list li h3 { bottom: 40px;} } @media screen and (max-width: 700px) { .header .topimg .slick-list li h3 { max-width: 100%; text-align: center; width: auto; right: 25px; left: 25px; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; bottom: 15px; text-shadow: 1px 1px 0px #000;} } @media screen and (max-width: 700px) { .header .topimg .slick-list li h3 { bottom: 10px;} } .header .topimg .slick-list li a { position: absolute; top: 0; width: 100%; height: 100%; background: url() left -1px repeat-x, url() repeat-x bottom left;} @media screen and (max-width: 1000px) { .header .topimg .slick-list li a { background: url() repeat-x bottom left; background-size: 7%;} } .header .topimg .arrow { position: absolute; top: 50%; background: #000; color: #fff; font-size: 40px; height: 70px; width: 70px; margin-top: -35px; border-radius: 50%; opacity: 0.5; filter: alpha(opacity=50); text-align: center; cursor: pointer; z-index: 1000; border: 1px solid rgba(255, 255, 255, 0.5);} @media screen and (max-width: 1280px) { .header .topimg .arrow { display: none !important;} } .header .topimg .arrow i { line-height: 65px;} .header .topimg .arrow.pre { left: 30px;} .header .topimg .arrow.next { right: 30px;} .header .topimg .arrow:hover { opacity: 0.4; filter: alpha(opacity=40);} .header .topimg .slick-dots { position: absolute; bottom: -40px; width: 100%; text-align: center; z-index: 1000;} .header .topimg .slick-dots li { display: inline-block; width: auto; float: none; vertical-align: middle;} .header .topimg .slick-dots li button { background: #A8B3C6; border: 0 none; border-radius: 7px; cursor: pointer; display: block; font-size: 0; height: 12px; line-height: 0; margin: 0 8px; outline: medium none; padding: 0; width: 12px;} .header .topimg .slick-dots li.slick-active button {} .header .topimg .slick-dots { bottom: 220px; left: 70px; text-align: left;} @media screen and (max-width: 1400px) { .header .topimg .slick-dots { bottom: 200px; left: 25px; text-align: left; bottom: 130px;} } @media screen and (max-width: 1000px) { .header .topimg .slick-dots { bottom: 30px;} } @media screen and (max-width: 700px) { .header .topimg .slick-dots { text-align: center; bottom: 45px; left: 0;} } .header .topimg .slick-dots li button { font-size: 16px; color: #fff; background: none; height: 50px; width: 34px; border-radius: 0; font-family: 'Raleway';} @media screen and (max-width: 700px) { .header .topimg .slick-dots li button { font-size: 0; border-radius: 6px; height: 10px; width: 10px; background: #fff;} } .header .topimg .slick-dots li.slick-active button { background: #e5212d; font-weight: bold;} .header .topimg .slick-dots .moreimg { display: inline-block; background: #9f8027; color: #fff; padding: 0 15px; height: 30px; line-height: 30px; border-radius: 15px; margin-left: 30px;} @media screen and (max-width: 700px) { .header .topimg .slick-dots .moreimg { margin-left: 10px; font-size: 9px; line-height: 20px; height: 20px; border-radius: 10px; padding: 0 8px;} } .header .topimg .slick-dots .moreimg:hover {} .content .section_1 { position: relative; z-index: 0; padding-bottom: 280px;} .content .section_1 .list-bg{ background: url() no-repeat;} .list-bg>li:nth-child(1){ border-right: 1px solid firebrick; background: url(../images/news_1.jpg) 100% no-repeat !important; background-position:0 0;} .list-bg>li:nth-child(2){ border-right: 1px solid firebrick; background: url(../images/news_2.jpg) 100% no-repeat !important; background-position:0 0;} .list-bg>li:nth-child(3){ border-right: 1px solid firebrick; background: url(../images/news_3.jpg) 100% no-repeat !important; background-position:0 0;} .list-bg>li>a{ width:100% !important; background:none !important;} .list-bg>li>a>img{ width:70% !important; padding:20px 0 35px 50px;} .fi>a>img{ padding:20px 0 35px 80px !important;} .list-bg>li>a>.txtwrapper{ background-color:white; position:absolute; bottom:0; height:150px !important;} @media screen and (max-width: 1000px) { .content .section_1 { padding-bottom: 50px;} } .content .section_1 .news { top: -160px; position: relative;} @media screen and (max-width: 1400px) { .content .section_1 .news { top: -100px;} } @media screen and (max-width: 1000px) { .content .section_1 .news { top: 0; padding-top: 30px;} } .content .section_1 .news ul { display: table;} @media screen and (max-width: 1000px) { .content .section_1 .news ul { display: block;} } .content .section_1 .news li { display: table-cell; width: 26%; vertical-align: top; position: relative; background: #fff;} @media screen and (max-width: 1000px) { .content .section_1 .news li { display: block; width: 100%;} } .content .section_1 .news li a { display: block; background: #fff;} @media screen and (max-width: 1000px) { .content .section_1 .news li a { position: relative; margin-left: 0;} } .content .section_1 .news li .txtwrapper p { font-size: 18px; padding: 35px 40px; line-height: 1.5em;} @media screen and (max-width: 1400px) { .content .section_1 .news li .txtwrapper p { font-size: 14px; padding: 20px 25px;} } @media screen and (max-width: 1000px) { .content .section_1 .news li .txtwrapper p { font-size: 16px; padding-top: 0; padding-bottom: 40px;} } .content .section_1 .news li .time { position: absolute; bottom: 30px; color: #ba2c3c; left: 38px;} @media screen and (max-width: 1400px) { .content .section_1 .news li .time { left: 23px;} } @media screen and (max-width: 1280px) { .content .section_1 .news li .time { bottom: 15px;} } @media screen and (max-width: 1000px) { .content .section_1 .news li .time { position: static; margin-top: 15px; margin-bottom: 10px; margin-left: 23px;} } .content .section_1 .news li.fi { width: 48%;} @media screen and (max-width: 1000px) { .content .section_1 .news li.fi { width: 100%;} } .content .section_1 .news li.fi a { position: relative; display: block;} .content .section_1 .news li.fi .txtwrapper { position: absolute; right: 0; bottom: 0; width: 50%; background: #fff; height: 45.83%; padding-bottom: 0; margin-bottom: 0;} @media screen and (max-width: 1000px) { .content .section_1 .news li.fi .txtwrapper { position: static; width: auto;} } .content .section_1 .news li img { width: 100%;} .content .section_1 .events { margin-top: -80px;} @media screen and (max-width: 1400px) { .content .section_1 .events { margin-top: -40px;} } @media screen and (max-width: 1000px) { .content .section_1 .events { margin-top: 40px;} } .content .section_1 .events h2 { font-family: "Microsoft JhengHei", "明黑", Arial, Helvetica; font-size: 36px; color: #fff; text-align: center; line-height: 1em; margin-bottom: 40px;} @media screen and (max-width: 1000px) { .content .section_1 .events h2 { font-size: 30px;} } .content .section_1 .events h2 b { height: 1px; width: 60px; background: #fff; display: inline-block; vertical-align: middle; opacity: 0.5; margin: 0 20px;} @media screen and (max-width: 400px) { .content .section_1 .events h2 b { width: 30px;} } .content .section_1 .events ul { margin-left: -50px;} .content .section_1 .events ul li { float: left; width: 33.33%;} @media screen and (max-width: 1000px) { .content .section_1 .events ul li { width: 100%;} } .content .section_1 .events ul li a { display: block; color: #fff; border-left: 1px solid rgba(255, 255, 255, 0.3); padding-left: 20px; margin-left: 50px;} .events>ul>li:first-child>a{ border-left: none !important;} .clearfix>li:first-child>a{ border-left: none !important;} @media screen and (max-width: 1000px) { .content .section_1 .events ul li a { padding-bottom: 30px;} } @media screen and (max-width: 400px) { .content .section_1 .events ul li a { padding-left: 0;} } .content .section_1 .events ul li a:hover h3, .content .section_1 .events ul li a:hover .time { color: #d18e59;} .content .section_1 .events ul li .time { font-family: 'EB Garamond', serif; width: 80px; text-align: center; float: left;} .title-box{ background: #eeeeee; width: 110px; height: 360px; float: left;} .content .section_1 .events ul li .time span { display: block; font-size: 36px; line-height: 1em;} @media screen and (max-width: 400px) { .content .section_1 .events ul li .time { width: 70px;} } .content .section_1 .events ul li .txtwrapper { margin-left: 100px;} @media screen and (max-width: 400px) { .content .section_1 .events ul li .txtwrapper { margin-left: 75px;} } .content .section_1 .events ul li .txtwrapper h3 { font-size: 16px; line-height: 1.5em;} .content .section_1 .events ul li .txtwrapper p { opacity: 0.7; padding-top: 10px;} .content .section_1 .newsmore { height: 48px; font-size: 14px; line-height: 48px; border: 1px solid #fff; padding: 0 20px; display: block; margin: 60px auto 0px auto; width: 150px; color: #fff; text-align: center; opacity: 0.5;} @media screen and (max-width: 1000px) { .content .section_1 .newsmore { margin-top: 30px;} } .content .section_1 .newsmore:hover { opacity: 0.8;} .content .section_1 .advpic { display: block; margin: 80px auto 20px auto;} .content .section_1 .advpic img { max-width: 100%;} @media screen and (max-width: 1000px) { .content .section_1 .advpic { margin: 40px auto 0 auto;} } .content .section_2 { margin-top: -150px; padding-bottom: 50px;} @media screen and (max-width: 1000px) { .content .section_2 { margin-top: 30px;} } .content .section_2 h2 { font-size: 40px; /*writing-mode: tb-rl; writing-mode:vertical-lr;*/ color: #963637; width: 110px; top: 0px; line-height: 40px; font-family: "Microsoft JhengHei", "明黑", Arial, Helvetica; padding-top: 60px; float: left; position: relative; background-color: #dfdfdf;} @media screen and (max-width: 1000px) { .content .section_2 h2 { font-size: 30px; position: static; line-height: 2em; padding-bottom: 20px; background: none; float: none; padding-top: 0; width: auto;} } .content .section_2 h2 span { width: 40px; display: block; padding-left: 36px;} @media screen and (max-width: 1000px) { .content .section_2 h2 span { width: auto; padding: 0; display: inline;} } .content .section_2 h2 a.more { position: absolute; bottom: -80px; font-size: 14px; color: #777; width: 1em; line-height: 14px; left: 50%; margin-left: -7px; writing-mode: tb-rl; writing-mode: vertical-lr;} @media screen and (max-width: 1000px) { .content .section_2 h2 a.more { position: static; float: right; width: auto; line-height: inherit; writing-mode: lr-tb; writing-mode: horizontal-tb;} } .content .section_2 .focus { margin-left: 160px; position: relative;} @media screen and (max-width: 1000px) { .content .section_2 .focus { margin-left: 0;} } .content .section_2 .focus .bigpic { width: 70%;} @media screen and (max-width: 1000px) { .content .section_2 .focus .bigpic { width: auto;} } .content .section_2 .focus .bigpic a { display: block;} .content .section_2 .focus .bigpic a .txtwrapper { margin-top: -80px; background: #fff; width: 85%; z-index: 1; padding: 40px 50px; position: relative; box-sizing: border-box;} @media screen and (max-width: 1000px) { .content .section_2 .focus .bigpic a .txtwrapper { width: 90%;} } @media screen and (max-width: 400px) { .content .section_2 .focus .bigpic a .txtwrapper { width: auto; margin-top: 0; padding: 30px 40px;} } .content .section_2 .focus .bigpic a .txtwrapper .cata { background: #963637; color: #fff; padding: 15px 30px; display: inline-block; margin-bottom: 10px;} .content .section_2 .focus .bigpic a .txtwrapper h3 { font-size: 22px; line-height: 1.5em;} @media screen and (max-width: 1280px) { .content .section_2 .focus .bigpic a .txtwrapper h3 { font-size: 16px;} } .content .section_2 .focus .bigpic a .txtwrapper p { color: #777; padding-top: 10px; display: block;} .content .section_2 .focus .bigpic a img { width: 100%;} .content .section_2 .focus .bigpic .slick-dots { position: absolute; bottom: -40px; width: 100%; text-align: center; z-index: 1000;} .content .section_2 .focus .bigpic .slick-dots li { display: inline-block; width: auto; float: none; vertical-align: middle;} .content .section_2 .focus .bigpic .slick-dots li button { background: #A8B3C6; border: 0 none; border-radius: 7px; cursor: pointer; display: block; font-size: 0; height: 12px; line-height: 0; margin: 0 8px; outline: medium none; padding: 0; width: 12px;} .content .section_2 .focus .bigpic .slick-dots li.slick-active button { background: #ba2c3c;} .content .section_2 .focus .bigpic .slick-dots { z-index: 100; bottom: -60px; width: 126%;} @media screen and (max-width: 1000px) { .content .section_2 .focus .bigpic .slick-dots { width: 100%;} } .content .section_2 .focus .smallpic { position: absolute; right: 0; width: 37%; top: 50%; margin-top: -240px;} @media screen and (max-width: 1280px) { .content .section_2 .focus .smallpic { margin-top: -190px;} } @media screen and (max-width: 1000px) { .content .section_2 .focus .smallpic { display: none;} } .content .section_2 .focus .smallpic a .txtwrapper { margin-top: -40px; background: #fff; width: 90%; z-index: 1; padding: 0 40px 25px 40px; position: relative; box-sizing: border-box;} .content .section_2 .focus .smallpic a .txtwrapper p { display: none;} .content .section_2 .focus .smallpic a .txtwrapper h3 { font-size: 18px; line-height: 1.5em;} @media screen and (max-width: 1280px) { .content .section_2 .focus .smallpic a .txtwrapper h3 { font-size: 14px;} } .content .section_2 .focus .smallpic a img { width: 100%;} .content .section_2 .focus .smallpic a .cata { background: #963637; color: #fff; padding: 15px 30px; display: inline-block; margin-bottom: 0px; top: -16px; position: relative;} .content .section_3 .events { margin-top: -80px;} @media screen and (max-width: 1400px) { .content .section_3 .events { margin-top: -40px;} } @media screen and (max-width: 1000px) { .content .section_3 .events { margin-top: 40px;} } .content .section_3 .events h2 { font-family: "Microsoft JhengHei", "明黑", Arial, Helvetica; font-size: 36px; color: #b32b38; text-align: center; line-height: 1em; margin-bottom: 40px;} @media screen and (max-width: 1000px) { .content .section_3 .events h2 { font-size: 30px;} } .content .section_3 .events h2 b { height: 1px; width: 60px; background: #b32b38; display: inline-block; vertical-align: middle; opacity: 0.5; margin: 0 20px;} @media screen and (max-width: 400px) { .content .section_3 .events h2 b { width: 30px;} } .content .section_3 .events ul { margin-left: -50px;} .content .section_3 .events ul li { float: left; width: 33.33%;} @media screen and (max-width: 1000px) { .content .section_3 .events ul li { width: 100%;} } .content .section_3 .events ul li a { display: block; color: #ba2c3c; border-left: 1px solid #b32b38; padding-left: 20px; margin-left: 50px;} @media screen and (max-width: 1000px) { .content .section_3 .events ul li a { padding-bottom: 30px;} } @media screen and (max-width: 400px) { .content .section_3 .events ul li a { padding-left: 0;} } .content .section_3 .events ul li a:hover h3, .content .section_3 .events ul li a:hover .time { color: #d18e59;} .content .section_3 .events ul li .time { font-family: 'EB Garamond', serif; width: 80px; text-align: center; float: left;} .content .section_3 .events ul li .time span { display: block; font-size: 36px; line-height: 1em;} @media screen and (max-width: 400px) { .content .section_3 .events ul li .time { width: 70px;} } .content .section_3 .events ul li .txtwrapper { margin-left: 100px;} @media screen and (max-width: 400px) { .content .section_3 .events ul li .txtwrapper { margin-left: 75px;} } .content .section_3 .events ul li .txtwrapper h3 { font-size: 16px; line-height: 1.5em;} .content .section_3 .events ul li .txtwrapper p { opacity: 0.7; padding-top: 10px;} .content .section_3 .newsmore { height: 48px; font-size: 14px; line-height: 48px; border: 1px solid #fff; padding: 0 20px; display: block; margin: 60px auto 0px auto; width: 150px; color: #fff; text-align: center; opacity: 0.5;} @media screen and (max-width: 1000px) { .content .section_3 .newsmore { margin-top: 30px;} } .content .section_3 .newsmore:hover { opacity: 0.8;} .content .section_3 .advpic { display: block; margin: 80px auto 20px auto;} .content .section_3 .advpic img { max-width: 100%;} @media screen and (max-width: 1000px) { .content .section_3 .advpic { margin: 40px auto 0 auto;} } .content .section_3 { position: relative; z-index: 1; padding-bottom: 60px;} @media screen and (max-width: 1000px) { .content .section_3 { padding-bottom: 90px;} } /*.content .section_3 h2 {*/ /* margin-top: 150px;*/ /* margin-bottom: 40px;*/ /* font-family: "Microsoft JhengHei", "明黑", Arial, Helvetica;*/ /* font-size: 36px;*/ /* color: #cc2336;*/ /* text-align: center;*/ /* line-height: 1em;*/ /* margin-bottom: 40px;*/ /*}*/ /*.content .section_3 h2 b {*/ /* height: 1px;*/ /* width: 60px;*/ /* background: #cc2336;*/ /* display: inline-block;*/ /* vertical-align: middle;*/ /* opacity: 0.5;*/ /* margin: 0 20px;*/ /*}*/ /*@media screen and (max-width: 400px) {*/ /* .content .section_3 h2 b {*/ /* width: 20px;*/ /* }*/ /*}*/ /*@media screen and (max-width: 1000px) {*/ /* .content .section_3 h2 {*/ /* font-size: 30px;*/ /* }*/ /*}*/ /*.content .section_3 .dataitem ul {*/ /* display: flex;*/ /* flex-wrap: wrap;*/ /*}*/ /*.content .section_3 .dataitem li {*/ /* width: 100%;*/ /* padding: 20px 0;*/ /*}*/ /*.content .section_3 .dataitem li img {*/ /* width: 80px;*/ /* float: left;*/ /*}*/ /*.content .section_3 .dataitem li .wrapper {*/ /* margin: 0 20px;*/ /*}*/ /*.content .section_3 .dataitem li .txtwrapper {*/ /* margin-left: 100px;*/ /*}*/ /*.content .section_3 .dataitem li .txtwrapper h4 {*/ /* font-size: 36px;*/ /* color: #6416a6;*/ /* line-height: 1em;*/ /* font-family: Raleway;*/ /*}*/ /*.content .section_3 .dataitem li .txtwrapper p {*/ /* font-size: 14px;*/ /* color: #666;*/ /* padding-top: 5px;*/ /*}*/ .content .section_3 .slick-dots { position: absolute; bottom: -40px; width: 100%; text-align: center; z-index: 1000;} .content .section_3 .slick-dots li { display: inline-block; width: auto; float: none; vertical-align: middle;} .content .section_3 .slick-dots li button { background: #A8B3C6; border: 0 none; border-radius: 7px; cursor: pointer; display: block; font-size: 0; height: 12px; line-height: 0; margin: 0 8px; outline: medium none; padding: 0; width: 12px;} .content .section_3 .slick-dots li.slick-active button {} .content .section_3 .tbg { position: absolute; width: 100%; top: -100px; z-index: -1; overflow: hidden;} .content .section_3 .tbg img { width: 100%; min-width: 1920px;} @media screen and (max-width: 1920px) { .content .section_3 .tbg img { padding-left: 50%; margin-left: -800px;} } .notice-box{ padding: 50px 50px 20px 50px; background:rgba(255,255,255,.6); border: 2px solid #cecece;} .content .section_3 .tcbg { position: absolute; background: url(../images/tgb108.jpg) center; transform: rotate(-3deg); transform-origin: right bottom; -ms-transform: rotate(-3deg); -ms-transform-origin: right bottom; height: 133px; width: 200%; right: -104px; bottom: -15px; z-index: -2;} @media screen and (max-width: 1000px) { .content .section_3 .tcbg { display: none;} } .content .cbg { background: url(../images/tbg107.jpg); position: absolute; z-index: -1; transform: rotate(-3deg); transform-origin: center top; -ms-transform: rotate(-3deg); -ms-transform-origin: center top; height: 100%; width: 200%; right: -5px; top: 0;} .content .cbg2 { background: url(../images/tgb108.jpg); position: absolute; z-index: -1; transform: rotate(-3deg); transform-origin: center top; -ms-transform: rotate(-3deg); -ms-transform-origin: center top; height: 170%; width: 200%; right: -5px; top: 110px;} @media screen and (max-width: 1000px) { .content .cbg { transform: none; -ms-transform: none; right: 0;} .content .cbg2 { transform: none; -ms-transform: none; right: 0;} } .h730{ height:730px;} .footer { position: relative; background: url(../images/4.jpg) no-repeat bottom center; background-size: cover;} .footer .ulink { padding-top: 250px; padding-bottom: 150px;} @media screen and (max-width: 1920px) { .footer .ulink { padding-top: 200px; padding-bottom: 100px;} } @media screen and (max-width: 1280px) { .footer .ulink { padding-top: 150px; padding-bottom: 80px;} } @media screen and (max-width: 1000px) { .footer .ulink { padding-top: 40px; padding-bottom: 50px;} } .footer .ulink .plink { margin-right: 25%; margin-left: -44px;} @media screen and (max-width: 1280px) { .footer .ulink .plink { margin-left: -20px;} } @media screen and (max-width: 1000px) { .footer .ulink .plink { margin-right: 0; margin-top: 30px;} } .footer .ulink .plink li { float: left; width: 33.33%;} @media screen and (max-width: 700px) { .footer .ulink .plink li { width: 100%;} } .footer .ulink .plink li a { display: block; margin-left: 44px;} @media screen and (max-width: 1280px) { .footer .ulink .plink li a { margin-left: 20px;} } .footer .ulink .plink li a img { width: 100%;} .footer .ulink .tlink { float: right; width: 25%; color: #fff;} @media screen and (max-width: 1000px) { .footer .ulink .tlink { float: none; width: auto;} } .footer .ulink .tlink .txtwrapper { margin-left: 60px; padding-left: 40px; border-left: 1px solid rgba(255, 255, 255, 0.3);} @media screen and (max-width: 1280px) { .footer .ulink .tlink .txtwrapper { margin-left: 40px; padding-left: 20px;} } @media screen and (max-width: 1000px) { .footer .ulink .tlink .txtwrapper { margin-left: 0; padding-left: 0; border-left: 0;} } .footer .ulink .tlink .txtwrapper h2 { font-size: 20px; line-height: 1em; padding-bottom: 20px;} @media screen and (max-width: 1000px) { .footer .ulink .tlink .txtwrapper h2 { padding-bottom: 10px;} } .footer .ulink .tlink .txtwrapper a { color: #fff; font-size: 14px; line-height: 38px;} .footer .ulink .tlink .txtwrapper a:hover { color: #d18e59;} .footer .ulink .tlink .txtwrapper li { float: left; width: 50%;} @media screen and (max-width: 1000px) { .footer .ulink .tlink .txtwrapper li { width: 16.66%;} } @media screen and (max-width: 700px) { .footer .ulink .tlink .txtwrapper li { width: 33.33%;} } .footer .copy { padding: 50px 0 30px 0;} .footer .copy .en { float: right; font-size: 14px;} @media screen and (max-width: 400px) { .footer .copy .en { float: none; margin-bottom: 30px;} } .footer .copy .en a { display: block; color: #fff; padding: 8px 30px 8px 15px; border: 1px solid rgba(255, 255, 255, 0.4); background: rgba(255, 255, 255, 0.1);} .footer .copy .en a:hover { background: none;} .footer .copy .contact { padding-bottom: 40px;} .footer .copy .contact img { height: 50px;} @media screen and (max-width: 1000px) { .footer .copy .contact img { width: 150px;} } @media screen and (max-width: 400px) { .footer .copy .contact img { width: 90%; display: block; margin: auto;} } .footer .copy .contact .txtwrapper { display: inline-block; color: #fff; opacity: 0.7; font-size: 13px; line-height: 1.75em; padding-left: 40px;} @media screen and (max-width: 1000px) { .footer .copy .contact .txtwrapper { font-size: 12px; padding-left: 20px;} } @media screen and (max-width: 700px) { .footer .copy .contact .txtwrapper { padding-left: 0px; display: block; padding-top: 20px;} } @media screen and (max-width: 400px) { .footer .copy .contact .txtwrapper { text-align: center;} .footer .copy .contact .txtwrapper br { display: none;} .footer .copy .contact .txtwrapper span { display: block;} } .footer .copy .copyrights { color: #fff; opacity: 0.6; border-top: 1px solid #883733; padding-top: 20px;} @media screen and (max-width: 400px) { .footer .copy .copyrights { text-align: center;} } .footer .copy .copyrights span { opacity: 0.5; padding: 0 20px;} @media screen and (max-width: 400px) { .footer .copy .copyrights span { display: block; padding: 0;} } .anniv107 .anniv107pic { display: block; margin: 80px auto 20px auto;} .anniv107 .anniv107pic img { max-width: 100%;} @media screen and (max-width: 1000px) { .anniv107 .anniv107pic { margin: 40px auto 0 auto;} } @media screen and (max-width: 1000px) { .header .topline { height: 48px;} .header .smenu { display: block; position: absolute; right: 15px; top: 14px; z-index: 1001; cursor: pointer;} .header .smenu i { color: #fff; padding: 6px; font-size: 20px;} .header.active .smenu i { background: none; font-size: 30px; margin-right: -30px;} .header.active .smenu .icon-menu:before { content: '\ea1f';} .header.active .navwrapper { z-index: 1000;} .header.active .navwrapper .nav { display: block; padding-right: 0; width: 100%; padding-top: 0px;} .header.active .navwrapper .nav li { float: none;} .header.active .navwrapper .nav li a { color: #fff; display: block; text-align: center; margin: 0; padding: 0; line-height: 3em !important; font-size: 18px; border-bottom: 1px solid rgba(255, 255, 255, 0.2);} .header.active .navwrapper .nav li.current a { /*background: #5e068c;*/ border: 0;} .header.active .navwrapper .nav .mainnav { padding-top: 0px;} .header.active .navwrapper .nav .mainnav ul ul { display: none !important;} .header.active .navwrapper .nav .subnav ul { position: static; width: 100%;} .header.active .navwrapper .nav .subnav ul li { float: none;} .header.active .navwrapper .nav .subnav ul li a { font-size: 14px; font-weight: bold; padding: 0; border-bottom: 0; color: #e4d8b5;} .header.active .navwrapper .nav .subnav ul li.en { padding: 0; margin: 0; border: 0;} .header.active .navwrapper .nav .subnav ul li.en a { padding-left: 0;} .header.active .navwrapper .nav .subnav ul li.search { padding: 25px;} .header.active .navwrapper .nav .subnav ul li.search input { width: 100%; opacity: 1; height: 30px; line-height: 30px; border-radius: 15px;} .header.active .navwrapper .nav .subnav ul li.search i.active { right: 35px; top: 25px; display: none;} .header.active .navwrapper .nav .subnav ul li.search button { display: block; position: absolute; color: #fff; font-size: 16px; background: none; right: 35px; top: 25px;} } /*****/ /* @media screen and (max-width:1400px) { .header { .navwrapper { .nav { padding-right: 25px; .mainnav { padding-top:15px; li { font-size: 16px; a { padding-left: 40px; } } } } .logowrapper { width: 200px; left: 25px; top:30px; } } .topimg { .slick-list li { h3 { font-size: 30px; right: 50px; } } .slick-dots { bottom: 200px; left: 25px; text-align: left; } } } } @media screen and (max-width:1280px) { .header { .navwrapper { .nav { .subnav { li { font-size: 12px; } } .mainnav { li { font-size: 14px; a { padding-left: 30px; } } } } .logowrapper { width: 150px; .logo { padding: 20px 27px 20px 20px; } } } .topimg { .arrow { display: none !important; } .slick-list li { h3 { font-size: 24px; right: 40px; max-width: 60%; } } } } } @media screen and (max-width:1000px) { .header { .smenu { display: block; position: absolute; right: 25px; top: 40px; z-index: 1001; cursor: pointer; i { background: $purplecolor; color: #fff; padding: 8px; font-size: 20px; } &.active { i { background: none; font-size: 30px; margin-right: -30px; } .icon-menu:before { content: '\ea1f'; } } } .navwrapper { .nav { display: none; } } } } */