/*base*/ *, :before, :after { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, p, blockquot, filedset, input, nav, aside, header, article, section, figure, figcaption, video, audio { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, em, i, b { font-size: 1em; font-style: normal; font-weight: normal; } ul, ol, li { list-style: none; } fieldset, img, video { max-width: 100%; height: auto; display: block; } table { border-collapse: separate; } table td { line-height: 24px; padding: 10px; } input, select, textarea, button { outline: none; border: none; resize: none; } input[type="button"], input[type="submit"], input[type="reset"] { outline: none; -webkit-appearance: none; border: none; } :focus { outline: none; } a { color: #00132b; text-decoration: none; outline: none; cursor: pointer; } a:link, a:visited { text-decoration: none; } a:hover { color: #272731; } a:active { text-decoration: none; } .clearfix:after { clear: both; content: ''; display: block; height: 0; line-height: 0; visibility: hidden; } .clearfix { zoom: 1; } .clear { clear: both; } .fl { float: left; } .fr { float: right; } body { max-width: 1920px; font-size: 14px; font-family: "Lato-Regular"; color: #41444b; line-height: 1; margin: 0 auto; } .wrap { max-width: 1420px; margin: 0 auto; } /*base end*/ @font-face { font-family: "Lato-Light"; src: url("../font/Lato-Light.otf") format("opentype"); font-weight: normal; font-style: normal; } @font-face { font-family: "Lato-Regular"; src: url("../font/Lato-Regular.otf") format("opentype"); font-weight: normal; font-style: normal; } @font-face { font-family: "Lato-Bold"; src: url("../font/Lato-Bold.otf") format("opentype"); font-weight: normal; font-style: normal; } @font-face { font-family: "tt0144m_0"; src: url("../font/tt0144m_0.otf") format("opentype"); font-weight: normal; font-style: normal; } .swiper-container { width: 100%; position: relative; } .swiper-wrapper { width: 100%; position: relative; } .swiper-container .swiper-slide { width: 100%; display: none; } .swiper-container .swiper-slide-active { display: block; } .special { width: 100%; background: url(../images/special-bg.jpg) repeat; } .same-tit { font-size: 56px; color: #313931; font-family: "tt0144m_0"; line-height: 84px; } .same-tit span{ display: block; } .header { font-size: 0; position: absolute; left: 0; right: 0; top: 0; } .header .logo { width: 196px; display: inline-block; padding: 29px 0; } .header .fw-txt { font-size: 20px; color: #ffffff; font-family: "Lato-Regular"; line-height: 36px; display: inline-block; vertical-align: top; padding: 19px 40px; margin: 0 40px; position: relative; } .header .fw-txt::before { content: ""; background-color: #2b7051; background-image: linear-gradient(to right, #1d6245, #2b7051); position: absolute; left: 0; right: 0; top: 0; bottom: -20px; z-index: -1; } .header .fw-txt span { display: block; } .header .language { position: absolute; right: 6.5%; top: 34px; cursor: pointer; display: none; } .header .language dd { font-size: 20px; color: #ffffff; line-height: 23px; background: url(../images/diqiu.png) left center no-repeat; padding-left: 32px; opacity: 0.62; } .header .language dd::after { content: ""; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #ffffff; display: inline-block; vertical-align: middle; margin-left: 7px; } .header .language dt { width: 100px; background: #ffffff; border-radius: 5px; margin: 10px 0 0 18px; padding: 8px 0; box-shadow: 0 5px 15px rgba(43, 112, 81, 0.5); display: none; } .header .language dt a { font-size: 20px; text-align: center; padding: 8px 0; display: block; } .special01 { padding: 118px 0 45px; overflow: hidden; } .special01 .swiper-tab { width: 67.54%; } .swiper-container .swiper-slide img { border-radius: 35px; box-shadow: 0 12px 120px rgba(15, 86, 56, 0.58); } .special01 .swiper-tab .swiper-hd { padding: 35px 0; } .special01 .swiper-tab .swiper-hd .swiper-item { width: 190px; float: left; text-align: center; margin-left: 38px; position: relative; cursor: pointer; } .special01 .swiper-tab .swiper-hd .swiper-item span { font-size: 20px; color: #0f5437; } .special01 .swiper-tab .swiper-hd .swiper-item span::after { content: ""; width: 5px; height: 5px; background: #0f5437; border-radius: 50%; display: block; margin: 11px auto; } .special01 .swiper-tab .swiper-hd .swiper-item img { width: 100%; border-radius: 25px; } .special01 .swiper-tab .swiper-hd .swiper-item-active img { border: 2px solid #0e5134; } .special01 .swiper-tab .swiper-hd .swiper-item-active::before { content: ""; width: 251px; height: 51px; background: url(../images/shadow-zs.png) no-repeat; background-size: 100%; display: block; position: absolute; left: 50%; bottom: -15px; margin-left: -125px; z-index: -1; } .special01 .fr { width: 32.46%; padding-top: 55px; position: relative; } .special01 .fr::before { content: ""; width: 1167px; height: 1210px; background: #2b7051; border-radius: 50% 0 50% 50%; display: block; position: absolute; right: -390px; bottom: -88px; z-index: -1; } .special01 .fr::after { content: ""; width: 875px; height: 875px; background: #ffffff; border-radius: 50%; display: block; position: absolute; right: -235px; bottom: -5px; z-index: -1; } .special01 .fr h1 { font-size: 56px; color: #313931; font-family: "tt0144m_0"; font-weight: bold; text-align: center; } .special01 .fr .swiper-slide{ display: none; } .special01 .fr .swiper-slide-active{ display: block; } .special01 .fr .cs { overflow: hidden; margin: 70px 0 38px; position: relative; } .special01 .fr .cs::before { content: ""; width: 1px; background-image: linear-gradient(rgba(255, 255, 255, 0), #c5c8c7, rgba(255, 255, 255, 0)); position: absolute; left: 50%; top: 0; bottom: 0; } .special01 .fr .cs p { width: 50%; float: left; font-size: 22px; color: #575d57; text-align: center; } .special01 .fr .cs p span { font-size: 28px; color: #dd674e; font-family: "tt0144m_0"; font-weight: bold; display: block; } .special01 .fr .cs p span::after { content: ""; width: 24px; height: 3px; background: #dd674e; display: block; margin: 12px auto; } .special01 .fr .cs p:first-child span { color: #0f5638; } .special01 .fr .cs p:first-child span::after { background: #0f5638; } .special01 .fr .text { font-size: 18px; color: #606760; line-height: 36px; padding: 0 44px; } .special01 .fr .offer { width: 330px; height: 330px; background: #f3f1e4; border-radius: 50%; text-align: center; padding: 84px 0; margin: 65px 30px 0; position: relative; float: right; } .special01 .fr .offer::before { content: ""; height: 153px; background: url(../images/money-zs.png) center no-repeat; background-size: 193px; display: block; position: absolute; left: 0; right: 0; top: -60px; animation: bounce-down 2.2s linear infinite; } .special01 .fr .offer .p1 { font-size: 18px; color: #606760; font-family: "Lato-Light"; } .special01 .fr .offer .p2 { font-size: 0px; color: #313931; font-family: "tt0144m_0"; font-weight: bold; margin: 12px 0 5px; } .special01 .fr .offer .p2 span { font-size: 80px; display: inline-block; vertical-align: middle; } .special01 .fr .offer .p2 span:first-child { font-size: 50px; } .special01 .fr .offer .p3 { font-size: 18px; color: #313931; line-height: 24px; padding: 0 15%; } .special01 .fr .offer .swt { width: 337px; height: 80px; background:url(../images/swt-bg.png) center no-repeat; background-size:cover; border-radius: 40px; font-size: 36px; font-family: "tt0144m_0"; font-weight: bold; color: #ffffff; text-align: center; line-height: 80px; position: absolute; left: 50%; bottom: -15px; margin-left: -168px; box-shadow: 0 2px 10px rgba(43, 112, 81, 0.5); } .special02 { margin: 86px 0; overflow: hidden; } .special02 .left { width: 43.87%; float: left; } .special02 .left h2 span { color: #307556; display: block; } .special02 .left p { font-size: 18px; color: #606760; line-height: 36px; padding: 66px 7% 0 0; } .special02 .right { width: 56.13%; float: right; } .special03 { padding: 10px 0 70px; position: relative; z-index: 1; } .special03::before { content: ""; width: 704px; height: 684px; border: 1px dashed #469274; border-radius: 50%; display: block; position: absolute; left: 50%; bottom: 0; margin-left: -352px; z-index: -1; } .special03::after { content: ""; width: 684px; height: 684px; background: #469274; border-radius: 50%; display: block; position: absolute; left: 50%; bottom: 10px; margin-left: -342px; z-index: -1; } .special03 .wrap { padding: 0 70px; } .special03 .wrap:before{ content: ""; border-radius: 50%; display: block; box-shadow: 0 0 440px 300px rgba(33, 163, 108, 0.58); position: absolute; right: 22%; bottom: 176px; } .special03 h2 { text-align: center; } .special03 .text { font-size: 18px; color: #606760; line-height: 36px; margin: 78px 0 45px; } .special03 .swiper-tab2 { width: 100%; background: #ffffff; box-shadow: 0px 2px 20px 1px rgba(15, 86, 56, 0.46); border-radius: 20px; padding: 37px; overflow: hidden; } .special03 .swiper-wrapper { width: 68.41%; float: left; } .special03 .swiper-slide { border: 2px solid #0f5638; border-radius: 10px; overflow: hidden; } .special03 .swiper-hd { width: 29.5%; height: 100%; float: right; background-image: linear-gradient(to right, #eff6f3, #ffffff); border-radius: 10px; padding: 0 20px 0 62px; } .special03 .swiper-hd .swiper-hd-wrap { position: relative; z-index: 1; } .special03 .swiper-hd .swiper-item { background: #ffffff; border-radius: 10px; padding: 23px 0 23px 84px; margin: 23px 0; box-shadow: 0px 6px 5px 0px rgba(18, 102, 67, 0.05); position: relative; cursor: pointer; } .special03 .swiper-hd .swiper-item span { font-size: 24px; color: #0f5638; font-family: "tt0144m_0"; line-height: 118px; position: absolute; left: -40px; top: 0; bottom: 0; } .special03 .swiper-hd .swiper-item p { font-size: 18px; color: #0f5638; line-height: 36px; } .special03 .swiper-hd .swiper-item-active { box-shadow: 0px 13px 18px 0px rgba(18, 67, 102, 0.35); } .special03 .swiper-hd .swiper-item-active::before { content: ""; background-image: linear-gradient(to right, #ffffff, #368e67); border-radius: 11px; position: absolute; left: -1px; right: -1px; top: -1px; bottom: -1px; z-index: -1; } .special03 .swiper-hd .swiper-item-active::after { content: ""; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 8px solid #eff6f3; position: absolute; left: -69px; top: 50%; margin-top: -15px; } .special03 .swt { width: 338px; margin: 33px auto 0; display:block; } .special03 .swt a{ width: 100%; height: 56px; background: url(../images/swt-bg.png) center no-repeat; background-size: 110% 100%; border-radius: 28px; font-size: 30px; line-height: 56px; font-family: "Lato-Bold"; text-align: center; color: #ffffff; display: block; box-shadow: 0 4px 8px #17583b; } .special03 .swt::after { content: ""; width: 0; border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 15px solid #0F5739; display: block; margin: 16px auto 0; } .special04 { padding: 50px 0 0; position: relative; } .special04::before { content: ""; background: #0f5638; border-radius: 0px 200px 200px 0px; position: absolute; left: 0; right: 160px; top: -420px; bottom: 190px; z-index: -1; } .special04::after { content: ""; height: 200px; background: url(../images/special-bg.jpg) repeat; border: 4px solid #08462c; border-top: none; border-right: none; border-radius: 0px 0px 0px 200px; position: absolute; left: -4px; right: 50%; top: -620px; box-shadow: -190px 0 0 #0f5638; } .special04 h2 { text-align: center; color: #ffffff; position: relative; z-index: 2; } .special04 ul { margin-top: 66px; } .special04 ul li { width: 30.66%; background: #ffffff; float: left; margin-left: 4%; padding: 13px 13px 47px 13px; border-radius: 20px 20px 200px 200px; box-shadow: 0px 0px 62px 0px rgba(18, 67, 102, 0.35); position: relative; } .special04 ul li::before { content: ""; border: 1px dashed #469274; border-radius: 20px 20px 200px 200px; position: absolute; left: 6px; right: 6px; top: 6px; bottom: 6px; } .special04 ul li:first-child { margin: 0; } .special04 ul li p { font-size: 20px; color: #606760; text-align: center; line-height: 36px; margin-top: 37px; padding: 0 12%; } .special05 { margin: 120px 0; } .special05 dl dd { width: 56%; position: relative; } .special05 dl dd::before { content: ""; border: 2px dashed #269f6c; border-radius: 20px; position: absolute; } .special05 dl dd img { border-radius: 20px; } .special05 dl dd span { width: 176px; height: 176px; background: #d6dbd9; border-radius: 50%; padding: 10px; position: absolute; bottom: -55px; } .special05 dl dd span img { width: 100%; height: 100%; border: 4px solid #ffffff; border-radius: 50%; box-shadow: 0px 0px 32px 0px rgba(18, 102, 67, 0.91); } .special05 dl dt { width: 44%; padding: 17px 76px 0; } .special05 dl dt h3 { width: 110%; font-size: 56px; font-family: Futura Md BT; font-weight: bold; color: #313931; line-height: 84px; } .special05 dl dt .text { padding: 10px 0; margin-top: 50px; position: relative; } .special05 dl dt .text::before { content: ""; background: #d6dbd9; border-radius: 20px; position: absolute; top: 0; bottom: 0; z-index: -1; } .special05 dl dt .text p { font-size: 18px; font-family: Lato; font-weight: 400; color: #606760; line-height: 36px; margin: 47px 0; } .special05 .al-one dd { padding: 18px 0 0 18px; } .special05 .al-one dd::before { left: 0; right: 18px; top: 0; bottom: 18px; } .special05 .al-one dd span { right: -45px; } .special05 .al-one dt .text::before { left: -148%; right: -76px; } .special05 .al-two dd { padding: 18px 18px 0 0; } .special05 .al-two dd::before { left: 18px; right: 0; top: 0; bottom: 18px; } .special05 .al-two dd span { left: -45px; } .special05 .al-two dt .text::before { right: -148%; left: -76px; } .special05 .swt{ width: 338px; margin: 58px auto 88px; display:block; } .special05 .swt a{ width:100%; height: 56px; background: url(../images/swt-bg.png) center no-repeat; background-size: 110% 100%; border-radius: 28px; font-size: 30px; line-height: 56px; font-family: "Lato-Bold"; text-align: center; color: #ffffff; display: block; box-shadow: 0 4px 8px rgba(205, 56, 64, 0.8); } .special05 .swt::after { content: ""; width: 0; border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 15px solid #cd3840; display: block; margin: 16px auto 0; } .special06 { margin: 120px 0; } .special06 h2 { text-align: center; } .special06 .table-template { background: url(../images/table-bg.jpg) repeat; border-radius: 10px; margin-top: 60px; padding: 27px; position: relative; } .special06 .table-template .table-hide { max-height: 233px; overflow: hidden; transition: all ease 0.5s; } .special06 .table-template .table-hide table { border: 10px solid #ffffff; border-radius: 10px; } .special06 .table-template .table-show { max-height: 2000px; } .special06 .table-template .table-close { width: 76px; height: 76px; background: #ffffff; border: 1px solid #0f5638; box-shadow: 0px 5px 35px 0px rgba(15, 88, 57, 0.65), 0px 0 24px 0px rgba(15, 88, 57, 0.33) inset; border-radius: 50%; text-align: center; line-height: 76px; position: absolute; left: 50%; bottom: -32px; margin-left: -38px; cursor: pointer; } .special06 .table-template .table-close img { display: inline; vertical-align: middle; } .special07 { margin: 170px 0 110px; } .special07 .fl { width: 42%; } .special07 .fl .text p { font-size: 18px; color: #606760; line-height: 36px; padding-left: 22px; margin: 48px 0; position: relative; } .special07 .fl .text p::before { content: ""; width: 6px; height: 6px; background: #0f5638; border-radius: 50%; display: block; position: absolute; left: 0; top: 15px; } .special07 .fl .more { width: 550px; background-color: #176041; background-image: linear-gradient(to right, #317a5c, #176041); border-radius: 80px; box-shadow: 4px 4px 0 #0f5638; font-size: 24px; color: #ffffff; line-height: 34px; font-family: "tt0144m_0"; display: block; padding: 15px 26% 14px 55px; position: relative; } .special07 .fl .more::before { content: ""; width: 176px; height: 198px; background: url(../images/ren-zs.png) center no-repeat; background-size: 100%; display: block; position: absolute; right: -33px; bottom: 0; } .special07 .fl .more strong { color: #dd674e; } .special07 .fl .more span { width: 199px; height: 32px; border: 1px solid #ffffff; border-radius: 20px; font-size: 18px; color: #ffffff; line-height: 30px; font-family: "Lato-Regular"; text-align: center; display: block; margin: 17px 0 0 40px; position: relative; } .special07 .fl .more span::before { content: ""; width: 22px; height: 32px; background: url(../images/jiantou.png) center no-repeat; background-size: 100%; display: block; position: absolute; right: -12px; top: 0; } .special07 .fl .more:hover span{ background:#dd674e; border:1px solid #dd674e; } .special07 .fr { width: 54.8%; } .special07 .fr ul li { width: 45.12%; float: left; border-radius: 18px; margin: 20px 0 20px 4.88%; box-shadow: 0 16px 0 -7px #467964; } .special07 .fr ul li img { border-radius: 10px; box-shadow: 0px 0px 9px 0px rgba(131, 136, 131, 0.91); } .special07 .fr ul .one, .special07 .fr ul .three { position: relative; top: -38px; } .special08 { position: relative; } .special08 h2 { text-align: center; } .special08 ul { padding: 44px 134px 102px; } .special08 ul li { background: #d6dbd9; border-radius: 20px; padding: 22px 45px; margin-top: 24px; } .special08 ul li .title { background: #ffffff; border-radius: 50px; font-size: 24px; color: #313931; line-height: 36px; padding: 19px 170px; cursor: pointer; position: relative; } .special08 ul li .title::before { content: ""; width: 42px; background: url(../images/jiantou2.png) center no-repeat; background-size: 100%; display: block; position: absolute; right: 18px; top: 0; bottom: 0; transition: all ease 0.5s; } .special08 ul li .active::before { -moz-transform: scaleY(-1); -webkit-transform: scaleY(-1); -o-transform: scaleY(-1); transform: scaleY(-1); /*IE*/ filter: FlipV; } .special08 ul li .text { font-size: 18px; color: #606760; line-height: 36px; padding: 18px 170px; display: none; } .special09 { background: url(../images/msg-bg.jpg) center bottom no-repeat; padding: 460px 0 55px; margin-top: -240px; } .special09 .wrap { padding: 0 72px; } .special09 .message { height: 815px; background: url(../images/msg-bg2.jpg) center bottom no-repeat #ffffff; background-size: 100.5%; padding: 50px 72px; border-radius: 20px; box-shadow: 0px 5px 35px 0px rgba(15, 88, 57, 0.41); position: relative; } .special09 .message h3 { display: inline; vertical-align: middle; } .special09 .message .slogan { display: inline; vertical-align: middle; } .special09 .message .slogan span { font-size: 18px; color: #317a5c; line-height: 34px; border: 1px solid #317a5c; border-radius: 30px; padding: 6px 17px; display: inline; margin-left: 22px; } .special09 .message .text { font-size: 18px; color: #606760; line-height: 30px; margin: 34px 0 10px; } .special09 .message form .same { width: 100%; height: 74px; background: none; border-bottom: 1px solid #dadada; margin-top: 22px; font-size: 22px; font-family: "Lato-Regular"; } .special09 .message form .msg-name { width: 48%; float: left; } .special09 .message form .msg-tel { width: 48%; float: right; } .special09 .message form .msg-txt { height: 136px; line-height: 36px; padding: 25px 0; } .special09 .message form .notice { font-size: 18px; color: #317a5c; line-height: 36px; margin: 46px 0 0 5px; } .special09 .message form .notice::before { content: ""; width: 6px; height: 6px; background: #317a5c; border-radius: 50%; display: inline-block; vertical-align: middle; margin-right: 16px; } .special09 .message form .msg-submit{ width: 337px; height: 79px; background: url(../images/swt-bg.png) center no-repeat; background-size: 105%; border-radius: 50px; font-size: 36px; color: #ffffff; line-height: 79px; text-align: center; font-family: "tt0144m_0"; display:block; box-shadow: 0 4px 8px rgba(205, 56, 64, 0.8); margin-top: -40px; float: right; cursor: pointer; } .special09 .message .shipping { width: 575px; overflow: hidden; padding: 15px 0; position: absolute; right: 60px; bottom: 10px; z-index: 1; } .special09 .message .shipping::before { content: ""; height: 3px; background: #ffffff; position: absolute; left: 4%; right: 12%; top: 28px; z-index: -1; } .special09 .message .shipping::after { content: ""; width: 54px; height: 23px; background: url(../images/Ship.png) no-repeat; background-size: 100%; display: block; position: absolute; left: 3%; top: 5px; z-index: -1; } .special09 .message .shipping span { font-size: 18px; color: #ffffff; padding-top: 38px; } .special09 .message .shipping .fl { background: url(../images/national-flag.png) center top no-repeat; } .special09 .message .shipping .fr { background: url(../images/wharf.png) center top no-repeat; } .right-float{ position: fixed; right: 0; bottom: 40%; z-index: 9999; cursor: pointer; } .to-top{ width: 70px; height: 70px; background: #287053; border-radius: 10px; padding: 0.6%; position: fixed; right: 1.5%; bottom: 40px; cursor: pointer; z-index: 9999; display: none; } .btn-hover{overflow:hidden;position:relative;transition:all 0.8s ease} .btn-hover:before{content:"";display:block;position:absolute;left:-100%;top:0;width:30%;height:100%;background-image:-webkit-linear-gradient(0deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.5),hsla(0,0%,100%,0));transform:skewx(-25deg);-o-transform:skewx(-25deg);-moz-transform:skewx(-25deg);-webkit-transform:skewx(-25deg);transition:all 1s ease;opacity:.5;z-index: 2;} .btn-hover:hover:before{left:100%} #LRdiv0{display: none!important;} @-webkit-keyframes bounce-down { 25% { -webkit-transform: translateY(-10px); } 50%, 100% { -webkit-transform: translateY(0); } 75% { -webkit-transform: translateY(10px); } } @keyframes bounce-down { 25% { transform: translateY(-10px); } 50%, 100% { transform: translateY(0); } 75% { transform: translateY(10px); } } .animated::after { -webkit-animation: 6s animationPlane linear 1 forwards; animation: 6s animationPlane linear 1 forwards; animation-iteration-count: infinite; } @keyframes animationPlane { 0% { left: 3%; } 50% { left: 44%; } 100% { left: 80%; } } @-webkit-keyframes animationPlane { 0% { left: 3%; } 50% { left: 44%; } 100% { left: 80%; } } @media screen and (max-width:1800px){ .special04::before{right: 0;} } @media screen and (max-width:1440px){ .wrap{ max-width: 1120px; } .special01 .swiper-tab .swiper-hd .swiper-item span{ font-size: 18px; } .special01 .fr{ padding: 45px 0 0; } .special01 .fr::before{ width: 900px; height: 900px; background: #226749; border-radius: 0 0 50% 50%; right: -270px; bottom: -56px; } .special01 .fr::after{ width: 750px; height: 750px; right: -200px; } .special01 .fr h1{ font-size: 50px; } .special01 .fr .cs{ margin: 46px 0 26px; } .special01 .fr .cs p{ font-size: 18px; } .special01 .fr .cs p span{ font-size: 24px; } .special01 .fr .text{ font-size: 16px; line-height: 33px; padding: 0 30px; } .special01 .fr .offer{ width: 300px; height: 300px; } .special01 .fr .offer .p1{ font-size: 16px; } .special01 .fr .offer .p2 span{ font-size: 55px; } .special01 .fr .offer .p2 span:first-child{ font-size: 40px; } .special01 .fr .offer .p3{ font-size: 16px; } .special01 .fr .offer::before{ background-size: 170px; } .special01 .fr .offer .swt{ width: 300px; height: 70px; font-size: 30px; line-height: 70px; margin-left: -150px; bottom: -5px; } .same-tit,.special05 dl dt h3{ font-size: 40px; line-height: 60px; } .special02 .left p{ font-size: 16px; line-height: 32px; padding: 33px 7% 0 0; } .special03::before{ width: 580px; height: 580px; margin-left: -290px; } .special03::after{ width: 560px; height: 560px; margin-left: -280px; } .special03 .text{ font-size: 16px; line-height: 32px; margin: 40px 0 30px; } .special03 .swiper-tab2{padding: 25px;} .special03 .swiper-hd .swiper-item{ padding: 15px 0 15px 50px; margin: 21px 0; } .special03 .swiper-hd .swiper-item span{ font-size: 18px; line-height: 90px; } .special03 .swiper-hd .swiper-item p{ font-size: 16px; line-height: 30px; } .special04 ul li p{ font-size: 16px; line-height: 33px; margin-top: 20px; padding: 0 15%; } .special05 dl dt{padding: 17px 30px 0 60px;} .special05 dl dt .text{ margin-top: 30px; } .special05 .al-one dt .text::before{ right: -30px; } .special05 dl dt .text p{ font-size: 16px; line-height: 32px; margin: 20px 0; } .special06 .table-template{ padding: 20px; margin-top: 40px; } .special07 .fl .text p{ font-size: 16px; line-height: 32px; margin: 40px 0; } .special07 .fl .more{ width: 460px; font-size: 18px; line-height: 30px; } .special07 .fl .more span{ width: 180px; font-size: 16px; margin-left: 30px; } .special08 ul{padding: 30px 80px;} .special08 ul li{ padding: 20px 30px; } .special08 ul li .title{ font-size: 20px; line-height: 32px; padding: 19px 120px; } .special08 ul li .text{ font-size: 16px; padding: 18px 120px; } .special09{ background-size: 100%; padding: 320px 0 55px; } .special09 .message{ height: 730px; } .special09 .message h3{ font-size: 35px; } .special09 .message .slogan span{ font-size: 14px; } .special09 .message .text{ font-size: 16px; } .special09 .message form .same{ height: 60px; font-size: 18px; } .special09 .message form .msg-txt{ height: 140px; padding-top: 15px; } .special09 .message form .notice{ font-size: 16px; } .special09 .message form .msg-submit{ width: 300px; height: 66px; font-size: 30px; line-height: 66px; } .special09 .message .shipping{ width: 420px; bottom: -5px; } .special09 .message .shipping span{ font-size: 16px; } } @media screen and (max-width:1280px){ .wrap{ max-width: 960px; } .header .fw-txt{ font-size: 18px; line-height: 33px; } .special01 .swiper-tab .swiper-hd .swiper-item{ width: 170px; margin-left: 20px; } .special01 .swiper-tab .swiper-hd .swiper-item span{ font-size: 18px; } .special01 .fr{ padding: 45px 0 0; } .special01 .fr::before{ width: 800px; height: 820px; background: #226749; border-radius: 0 0 50% 50%; right: -235px; bottom: -45px; } .special01 .fr::after{ width: 680px; height: 680px; right: -178px; } .special01 .fr h1{ font-size: 40px; } .special01 .fr .cs{ margin: 46px 0 26px; } .special01 .fr .cs p{ font-size: 14px; } .special01 .fr .cs p span{ font-size: 20px; } .special01 .fr .text{ font-size: 14px; line-height: 30px; padding: 0 30px; } .special01 .fr .offer{ width: 280px; height: 280px; } .special01 .fr .offer .p1{ font-size: 16px; } .special01 .fr .offer .p2 span{ font-size: 45px; } .special01 .fr .offer .p2 span:first-child{ font-size: 35px; } .special01 .fr .offer .p3{ font-size: 14px; line-height: 20px; } .special01 .fr .offer::before{ background-size: 170px; } .special01 .fr .offer .swt{ width: 260px; height: 60px; font-size: 25px; line-height: 60px; margin-left: -130px; bottom: -5px; } .same-tit,.special05 dl dt h3{ font-size: 30px; line-height: 50px; } .special02 .left p{ font-size: 14px; line-height: 30px; padding: 33px 7% 0 0; } .special03::before{ width: 480px; height: 480px; margin-left: -240px; } .special03::after{ width: 460px; height: 460px; margin-left: -230px; } .special03 .text{ font-size: 14px; line-height: 30px; margin: 30px 0; } .special03 .swiper-tab2{ padding: 20px; } .special03 .swiper-hd{ padding: 0 0 0 50px; } .special03 .swiper-hd .swiper-item{ padding: 10px 15px 10px 30px; margin: 22px 0; } .special03 .swiper-hd .swiper-item-active::after{ left: -58px; } .special03 .swiper-hd .swiper-item span{ font-size: 14px; line-height: 68px; } .special03 .swiper-hd .swiper-item p{ font-size: 14px; line-height: 24px; } .special03 .swt,.special05 .swt{width:300px;} .special03 .swt a,.special05 .swt a{ font-size:25px; } .special04 ul{margin-top:40px;} .special04 ul li p{ font-size: 14px; line-height: 32px; margin-top: 20px; } .special05 dl dd span{ width: 140px; height: 140px; } .special05 dl dt .text{ margin-top: 10px; } .special05 .al-one dt .text::before{ right: -30px; } .special05 dl dt .text p{ font-size: 14px; line-height: 30px; margin: 10px 0; } .special06 .table-template{ padding: 15px; } .special06 .table-template .table-hide table{border: 6px solid #ffffff;} .special06 .table-template .table-close{ width: 60px; height: 60px; line-height: 60px; padding: 0 1%; margin-left: -30px; } .special07 .fl .text p{ font-size: 14px; line-height: 30px; margin: 30px 0; } .special07 .fl .more{ width: 410px; font-size: 16px; line-height: 24px; } .special07 .fl .more::before{ width: 140px; height: 160px; right: -24px; } .special07 .fl .more span{ width: 160px; font-size: 14px; margin-left: 20px; } .special08 ul{padding: 15px 40px;} .special08 ul li{ padding: 15px 20px; } .special08 ul li .title{ font-size: 16px; line-height: 30px; padding: 19px 90px; } .special08 ul li .title::before{ width: 30px; } .special08 ul li .text{ line-height: 30px; padding: 18px 90px; font-size: 14px; } .special09 .message{ height: 688px; background-size: 118%; } .special09 .message h3{ font-size: 26px; } .special09 .message .slogan span{ font-size: 12px; } .special09 .message .text{ font-size: 14px; margin: 20px 0 0; } .special09 .message form .same{ height: 50px; font-size: 16px; } .special09 .message form .msg-txt{ height: 140px; padding-top: 15px; } .special09 .message form .notice{ font-size: 14px; } .special09 .message form .msg-submit{ width: 240px; height: 60px; font-size: 25px; line-height: 60px; } .special09 .message .shipping{ width: 420px; right: 15px; } .special09 .message .shipping span{ font-size: 14px; } }