@charset "utf-8"; a:link, a:visited { color: #333; } a:hover, a:active { color: #ff0000; text-decoration: none; } a { color: #fff; } .phone { display: none; } .pc { display: block; } p { color: #666666; font-size: 14px; line-height: 26px; } p a:link, p a:visited { color: #333; } .banner img { width: 100%; margin: 0 auto; } .w1200{ width: 1200px; margin: 0 auto; overflow: hidden; } .col{ /* overflow: hidden; */ box-shadow: 0px 5px 10px 5px #c9bca8; } .col.col a:hover{ color: #ff0000; } .container{ width: 1200px; margin: 0 auto; /* overflow: hidden; */ } .d1img{ margin: 40px auto; } .d1img img{ width: 100%; } .d2img{ margin: 28px auto; } .col1{ width: 1200px; height: 172px; background: url(/uploads/image/mt2255images/col1-bg.jpg) no-repeat center top; overflow: hidden; } .col1 .area{ width: 1082px; height: 122px; margin: 26px 0 0 106px; color: #fff; } .col1 .area h2{ font-size: 28px; text-align: center; } .col1 .area p{ font-size: 16px; line-height: 25px; margin-top: 10px; color: #fff; text-indent: 2em; } .col1 .area a{ color: #fff; } /* col2 */ .col2{ margin: 65px auto 0; } .col2 .bd{ height: 476px; background:url(/uploads/image/mt2255images/col2-bg.jpg) no-repeat center top; padding: 15px 17px; box-sizing: border-box; } .col2-slider{ width: 585px; float: left; } .col2-slider .img-area{ position: relative; width: 585px; } .col2-slider .img-area img,.col2-slider .img-area p{ width: 100%; } .col2-slider .img-area img{ height: 329px; } .col2-slider p{ height: 75px; background-color: #9a6813; font-size: 22px; line-height: 75px; text-align: center; } .col2-slider.col2-slider a{ color: #fff; } .col2-slider .slick-arrow { position: absolute; top: 50%; width:35px; height: 60px; font-size: 0; margin-top: -90px; background: 0; border: 0; outline: 0; z-index: 99; -webkit-transition: all .3s ease-in; -o-transition: all .3s ease-in; transition: all .3s ease-in; } .col2-slider .slick-arrow.slick-prev { left: 0; background: url(/uploads/image/mt2255images/a1.png) no-repeat top center; } .col2-slider .slick-arrow.slick-next { right: 0; background: url(/uploads/image/mt2255images/a2.png) no-repeat top center; } .col2-slider .slick-dots { width: 100%; text-align: center; margin-top: 18px; } .col2-slider .slick-dots *{ display: inline-block; } .col2-slider .slick-dots li{ margin-left: 8px; } .col2-slider .slick-dots button{ width: 18px; height: 18px; font-size: 0; background: url(/uploads/image/mt2255images/i2.png) no-repeat center top; } .col2-slider .slick-dots .slick-active button{ background: url(/uploads/image/mt2255images/i1.png) no-repeat center top; } .col2 .right-side{ float: right; width: 534px; position: relative; } .foldpanel { width: 534px; } .foldpanel dt{ width: 532px; height: 70px; font-size: 18px; line-height: 70px; text-indent: 40px; font-weight: bold; color: #fff; margin-top: 14px; background: url(/uploads/image/mt2255images/col2-1.png) no-repeat center top; } .foldpanel dt:first-child{ margin-top: 0; } .foldpanel dt:visited,.foldpanel .no{ background: url(/uploads/image/mt2255images/col2-2.png) no-repeat center top; } .foldpanel dd{ font-size: 16px; line-height: 30px; width: 512px; height: 60px; overflow: hidden; margin: 14px auto ; } .foldpanel dd a{ color: #ba1e20; } #my-foldpanel dd { display: none; } .col2 .right-side .more{ position: absolute; bottom: -45px; left: 50%; font-size: 16px; color: #ba1e20; } .col2 .right-side .more:after{ content: ''; width: 9px; height: 3px; background-color: #936209; display: block; position: absolute; top: 10px; left: -20px; } .col2 .right-side .more::before{ content: ''; width: 9px; height: 3px; background-color: #936209; display: block; position: absolute; top: 10px; right: -20px; } /* col3 */ .col3{ box-sizing: border-box; padding: 0 17px; border-radius: 20px; background-color: #fcf7ec; } .col3 .top-block{ margin: 23px auto 0; } .col3 .top-block ul{ width: 386px; margin-top: 22px; } .col3 .top-block li{ padding: 13px 0; border-top: 1px dashed #c2c1c1; /* overflow: hidden; */ } .col3 .top-block li{ display: flex; } .col3 .top-block li:first-child{ border:none } .col3 .top-block li .time{ width: 82px; height: 58px; background-color: #9a6813; box-shadow: -3px -3px 2px #c8bc97; } .col3 .top-block .time p{ text-align: center; color: #fff; } .col3 .top-block .time p:first-child{ font-size: 24px; font-weight: bold; margin-top: 5px; } .col3 .top-block .time p:first-child p{ font-size: 14px; margin-top: 0px; } .col3 .top-block h2{ width: 310px; margin-left: 12px; font-size: 18px; line-height: 30px; font-weight: normal; } .col3 .top-block a{ color: #282828; } .col3 .col3-logo{ float: left; margin-left: 65px; margin-top: 135px; } .col3 .img-block{ margin-top: 15px; padding-bottom: 40px; } .col3 .img-block .img-area{ float: left; margin: 24px 0 0 14px; width: 379px; box-shadow: 3px 3px 3px #b0c1b5; } .col3 .img-block .img-area img{ width: 100%; border: 4px solid #d3911a; box-sizing: border-box; width: 379px; height: 212px; } .col3 .img-block .img-area p{ width: 379px; height: 79px; background-color: #9a6813; padding:8px 13px; box-sizing: border-box; font-size: 20px; line-height: 30px; color: #fff; overflow: hidden; text-align: left; } .col3 .img-block .img-area:first-child,.col3 .img-block .img-area:first-child .img-area .img-area .img-area{ margin-left: 0; } /* col4 */ .col4{ float: left; width: 600px; } .col4,.col5{ margin-top: 53px; background: none; box-shadow: none; } .col .hd{ position: relative; overflow: hidden; padding-bottom: 6px; border-bottom: 3px solid #e1d1b8; } .col .hd *{ display: inline-block; } .col .hd h2{ font-size: 35px; font-weight: bold; } .col .hd h2 i{ width: 69px; height: 58px; border-left: 10px solid #9a6813; text-indent: 12px; } .col .hd h2 a{ margin-left: 20px; position: relative; top: -6px; color: #9a6813; } .col .hd .more{ position: absolute; bottom: 6px; right: 0; width: 60px; line-height: 20px; font-size: 14px; text-align: center; border-radius: 10px; background-color: #9a6813; color: #fff; } .col4-slider{ width: 597px; } .col4-slider .img-block{ overflow: hidden; } .col4-slider .img-area{ width: 597px; padding: 20px 0; border-top: 1px dashed #e1e1e1; } .col4-slider .img-area:first-child{ margin-top: 0; } .col4-slider .img-area img{ width: 100%; height: 337px; border-radius: 35px; } .col4-slider .img-area p{ margin-top: 20px; text-align: center; font-size: 20px; color: #282828; } .col4-slider .slick-dots { width: 100%; text-align: center; margin-top: 5px; } .col4-slider .slick-dots *{ display: inline-block; } .col4-slider .slick-dots li{ width: 33%; font-size: 0; background-color: #e5e5e5; } .col4-slider .slick-dots button{ font-size: 0; height: 9px; } .col4-slider .slick-dots .slick-active button{ background-color: #bfbfbf; border-radius: 5px; width: 100%; outline: none; } .col4 .hd i{ background: url(/uploads/image/mt2255images/col4-hd-i.png) no-repeat 15px top; } .col5 .hd i{ background: url(/uploads/image/mt2255images/col5-hd-i.png) no-repeat 15px 4px; } .col5{ width: 540px; float: right; } .col5 ul{ margin-top: 30px; } .col5 li{ position: relative; margin: 3px auto 0; height: 73px; width: 540px; background: url(/uploads/image/mt2255images/col5-i1.png) no-repeat 493px 22px; background-color: #f5e3be; font-size: 18px; line-height: 73px; font-weight: bold; text-indent: 20px; } .col5 li:hover{ background: url(/uploads/image/mt2255images/col5-i2.png) no-repeat 493px 22px; background-color: #9a6813; } .col5 li a{ color: #9a6813; } .col5.col5 li:hover a,.col5 li:visited a{ color: #fff; } .bottom-side{ margin: 30px auto 0; background: url(/uploads/image/mt2255images/footerbg.jpg) no-repeat center top; height: 253px; font-size: 16px; text-align: center; width: 100%; display: flex; flex-flow: row wrap; align-content: center; justify-content: center; } .bottom-side span{ vertical-align: middle; color: #fff; display: table-cell; padding-top: 58px; } .bottom-side span:nth-child(2) { margin: 0 40px; } @media screen and (max-width:768px) { .pc{ display: none; } .phone{ display: block; } .container{ width: auto; margin: 5px; } .d1img.d1img{ margin: 15px 0; } .col.col{ width: 100%; height: auto; margin: 15px auto; } .col1{ background: none; background-color: #a67503; } .col.col .area,.col.col .block,.col.col .right-side{ width: 100%; height: auto; margin: 0; padding: 5px; box-sizing: border-box; } .col.col ul{ width: 100%; margin: 0; } .col.col li{ width: 100%; height: auto; line-height: 26px; padding: 10px 0; } .col.col .bd{ height: auto; background: none; } .slick-slider.slick-slider{ width: 100%; height: auto; } .col.col .slick-slider .block{ padding: 0; box-sizing: inherit; } .col.col .img-area img{ width: 100%; height: auto; } .col.col .img-area{ width: 100%; margin: 15px auto; } .col.col .img-area p{ width: 100%; height: auto; } .slick-slider p{ font-size: 16px; } .foldpanel,.foldpanel dt,.foldpanel dd{ width: 100%; } .foldpanel dt{ height: auto; font-size: 16px; line-height: 32px; text-indent: 0; width: auto; padding: 0 5px; } .col3 .col3-logo{ width: 100%; margin: 15px 0; } .col3 .col3-logo img{ margin: 0 auto; display: block; } .col2-slider .slick-dots li{ width: auto!important; } .col5.col5 li{width:90%;padding: 10px 5%;text-indent: 0;} .col2 .right-side .more{ position: static; font-size: 16px; color: #ba1e20; display: inline-block; height: 20px; margin: 15px auto; text-align: center; display: block; clear: both; } .col4-slider .slick-dots li{ width: 33%; } .bottom-side{ padding-top: 5rem; box-sizing: border-box; } .bottom-side span{ width: 100%; padding: 10px 0; } }