body#index *{touch-action: pan-y;} body#index{touch-action: pan-y;} html.skrollr {touch-action: pan-y;} body{background:#f2f2f3;color:#535353;font-family: '\5FAE\8F6F\96C5\9ED1',Arial,Helvetica,STHeiti;font-size:12px;margin:0 auto;padding:0;text-align:left;overflow-x:hidden !important;} /* 重置 */ div, form, p, i, img, ul, li, ol, dl, dt, dd, table, tr, td, th, fieldset, label, legend, select, button, input {margin:0;padding:0;} body#index p,body#index li,body#index div{/* add */line-height:24px;} /* 标题样式 */ body#index h1, body#index h2, body#index h3, body#index h4, body#index h5, body#index h6 {margin:0;padding:0;font-size:12px;font-weight:normal;} h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin: 0;} /* 列表样式 */ ul, ol, li, dl, dt, dd {list-style:none;} /* 图片样式 */ img, a img {border:0px;padding:0px;margin:0px;vertical-align:middle;} /* 链接样式 */ a:link{color:#535353;text-decoration:none;} a:visited{color:#535353;text-decoration:none;} a:hover{color:#da251d;text-decoration:none;} a:active{color:#535353;text-decoration:none;} a:focus {outline:none;-moz-outline:none;} /*网站头部*/ #box_logo{width:140px;float:left;position:relative;z-index:12;} #box_header{width:1200px;margin:0 auto;position:relative;} /*菜单导航*/ #box_aurora_nav {position:absolute;left: -941px;top:0;z-index:11;width:1200px;height:100vw;overflow: hidden;background:url(/img/aurora_navbg.png);margin-left: -100%;transition: all ease-out 0.5s;-webkit-transition: all ease-out 0.5s;-moz-transition: all ease-out 0.5s;-ms-transition: all ease-out 0.5s;-o-transition: all ease-out 0.5s;} #box_aurora_nav::after {content: '';width:1200px;height: 100%;background: #49b140;position: absolute;top: 0;left: 0;transition: all ease-out 1s;-webkit-transition: all ease-out 1s;-moz-transition: all ease-out 1s;-ms-transition: all ease-out 1s;-o-transition: all ease-out 1s;} #box_aurora_nav.tnav::after {left:100%;} #box_aurora_nav.tnav {margin-left: 0;display:block;} #box_aurora_nav ul a:hover{color: #ddea22;} #box_aurora_nav li {transform: translateX(100px);opacity: 0;transition: all ease-out 0.8s;-webkit-transition: all ease-out 0.8s;-moz-transition: all ease-out 0.8s;-ms-transition: all ease-out 0.8s;-o-transition: all ease-out 0.8s;} #box_aurora_nav.tnav li {transform: translateX(0);opacity: 1;} #box_aurora_nav.tnav li:nth-of-type(1) {-webkit-transition-delay: 0.9s;-moz-transition-delay: 0.9s;-ms-transition-delay: 0.9s;-o-transition-delay: 0.9s;transition-delay: 0.9s;} #box_aurora_nav.tnav li:nth-of-type(2) {-webkit-transition-delay: 1s;-moz-transition-delay: 1s;-ms-transition-delay: 1s;-o-transition-delay: 1s;transition-delay: 1s;} #box_aurora_nav.tnav li:nth-of-type(3) {-webkit-transition-delay: 1.1s;-moz-transition-delay: 1.1s;-ms-transition-delay: 1.1s;-o-transition-delay: 1.1s;transition-delay: 1.1s;} #box_aurora_nav.tnav li:nth-of-type(4) {-webkit-transition-delay: 1.2s;-moz-transition-delay: 1.2s;-ms-transition-delay: 1.2s;-o-transition-delay: 1.2s;transition-delay: 1.2s;} #box_aurora_nav.tnav li:nth-of-type(5) {-webkit-transition-delay: 1.3s;-moz-transition-delay: 1.3s;-ms-transition-delay: 1.3s;-o-transition-delay: 1.3s;transition-delay: 1.3s;} #box_aurora_nav.tnav li:nth-of-type(6) {-webkit-transition-delay: 1.4s;-moz-transition-delay: 1.4s;-ms-transition-delay: 1.4s;-o-transition-delay: 1.4s;transition-delay: 1.4s;} #aurora_nav{display:block;float:right;margin-top:150px;} #aurora_nav li{text-align:center;margin:6% 0;text-align:right;height:7vh;line-height:7vh;} #aurora_nav li a{color:#fff;position:relative;text-decoration:none;padding:0 50px 10px 7px;font-size:1.8vw;text-transform:uppercase;font-weight:bold;} #aurora_nav li a:hover{color:#ccc;} #aurora_nav li a SPAN{position: absolute;background-color: #49b140;transition: all 0.3s cubic-bezier(0.15, 0.26, 0.45, 0.74) 0s;} #aurora_nav li a .line{width: 0px;bottom: 0px;height: 2px;right: 0px;} #aurora_nav li a:hover .line{width: 100%;} .submenu {background:url(/img/aurora_navbg.png) repeat 0 0;display: none;left: 259px;margin: 0;overflow: hidden;padding: 0;position: absolute;text-align: left; top: 315px;width: 240px;z-index: 5555;} .sub_menu li {height: 40px;margin: 10px 0;} .sub_menu li a {color: #fff;display: block;font-size: 24px;height: 40px;line-height: 40px;padding: 0 18px;} .sub_menu li a:hover {color: #49b140;text-decoration: underline;} /*点击后CSS*/ .kovant_nav {margin: 0px auto;cursor: pointer;background:url(/img/nav_bg.jpg) no-repeat center center #49b140;width:119px;height:119px;float:left;padding:30px 40px;position:relative;z-index:12;-webkit-transition: all ease 0.3s;-moz-transition: all ease 0.3s;-ms-transition: all ease 0.3s;-o-transition: all ease 0.3s;transition: all ease 0.3s;} .kovant_nav span {width: 100%;background: #fff;display: block;height: 3px;margin: 4px 0;float: left;-webkit-transition: all ease 0.8s, opacity ease 0.3s;-moz-transition: all ease 0.8s, opacity ease 0.3s;-ms-transition: all ease 0.8s, opacity ease 0.3s;-o-transition: all ease 0.8s, opacity ease 0.3s;transition: all ease 0.8s, opacity ease 0.3s;opacity: 1;} .kovant_nav span:nth-of-type(1) {width: 50%;float: left;} .kovant_nav span:nth-of-type(3) {width: 50%;float: right;} .kovant_nav.show_nav {animation: show_nav 1s 1;-webkit-animation: show_nav 1s 1;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;} .kovant_nav.show_nav span {background: #fff;-webkit-animation: animaspan 0.5s 1;animation: animaspan 0.5s 1;animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;} .kovant_nav.show_nav span:nth-of-type(1) {transform: translateY(10px)rotate(720deg);width: 100%;} .kovant_nav.show_nav span:nth-of-type(2) {transform: rotate(720deg);} .kovant_nav.show_nav span:nth-of-type(3) {transform: translateY(-10px)rotate(720deg);width: 100%;} .kovant_nav.show_nav span.knav:nth-of-type(1) {transform: translateY(10px)rotate(670deg);} .kovant_nav.show_nav span.knav:nth-of-type(2) {transform: translateY(0px)rotate(768deg);} .kovant_nav.show_nav span.knav:nth-of-type(3) {width: 0;opacity: 0;} @-webkit-keyframes show_nav { 0% {background: #323538;} 100% {background:url(/img/nav_bg.jpg) no-repeat center center #43a33b;} } @keyframes show_nav { 0% {background: #323538;} 100% {background:url(/img/nav_bg.jpg) no-repeat center center #43a33b;} } /*第一栏CSS*/ .kovant_main01{position:relative;height: auto;padding-bottom: 20px;/* margin-bottom: 50px; */} .next_down{position:absolute;left:50%;margin-left:-200px;width:400px; background:url(/img/scroll_bg.png) no-repeat 0 13px;height:35px;bottom: -40px;z-index:99;} .view-next{width:45px;height:35px;background:url(/img/scroll.png) no-repeat center top; -webkit-animation:move ease-in-out 2s infinite;animation:move ease-in-out 2s infinite;display:block;margin: 0 auto;} @-webkit-keyframes move{ 0% {-webkit-transform: translateY(0);transform: translateY(0);} 50% {-webkit-transform: translateY(5px);transform: translateY(5px);} 100% {-webkit-transform: translateY(0);transform: translateY(0);} } @keyframes move{ 0% {-webkit-transform: translateY(0);transform: translateY(0);} 50% {-webkit-transform: translateY(5px);transform: translateY(5px);} 100% {-webkit-transform: translateY(0);transform: translateY(0);} } /*第二栏CSS*/ body.index .kovant_main02 > .inner > .inner .copy{color: #fff;font-size: 36px;font-weight: bold;line-height: 36px;width: auto;/* margin: 0 0 160px 625px; */display: none;margin-bottom: 20%;float: right;} body.index .kovant_main02 > .inner{width:100%;padding-top:70px;} body.index .inner > .inner > .btn .more_btn {color: #49b140;cursor: pointer;display: block;font-size: 16px;font-weight: 400;line-height: 45px;margin-right: 2em;text-align: center;max-width: 160px;position: relative;text-decoration: none;text-transform: uppercase;vertical-align: middle;width: 100%;} body.index .inner > .inner > .btn .more_btn:hover {text-decoration: none;} body.index .inner > .inner > .btn .Vbtn-3 {background:transparent;text-align: center;float:left;} body.index .inner > .inner > .btn .Vbtn-3 svg {height: 45px;left: 0;position: absolute;top: 0;width: 100%;} body.index .inner > .inner > .btn .Vbtn-3 rect {fill: none;stroke: #49b140;stroke-width: 2;stroke-dasharray: 422, 0;transition: all 450ms linear 0s;} body.index .inner > .inner > .btn .Vbtn-3:hover {background: rgba(73, 177, 64, 0);font-weight: 900;letter-spacing: 1px;transition: all 150ms linear 0s;} body.index .inner > .inner > .btn .Vbtn-3:hover rect {stroke-width: 5;stroke-dasharray: 15, 310;stroke-dashoffset: 48;-webkit-transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);transition: all 1.35s cubic-bezier(0.19, 1, 0.22, 1);} /*第三栏CSS*/ body.index .kovant_main03 > .inner > .inner .copy{color: #fff;font-size: 36px;font-weight: bold;line-height: 36px;width: 575px;margin:-140px 0 160px;display: none;} /*第四栏CSS*/ body.index .kovant_main04 > .inner > .inner .copy{color: #fff;font-size: 36px;font-weight: bold;line-height: 36px;width: 475px;margin:0 0 308px 720px;display: none;} /*第五栏CSS*/ body.index .kovant_main05 > .inner > .inner .copy{color: #fff;font-size: 36px;font-weight: bold;line-height: 36px;width: 575px;margin:-15px 0 160px;display: none;} /*底部版权CSS*/ .l-footer {width: 100%;background: url(/img/footer_bg.jpg) no-repeat center top;position: relative;z-index: 1;height: auto;background-size: cover;} .l-footer01{padding: 4% 20px;border-bottom:1px solid #494949;max-width: 1240px;margin:0 auto;position:relative;width: 100%;} .l-footer01 ul{width: 100%;margin:0 auto;max-width: 430px;display: flex;} .l-footer01 ul:after{content:'';display:table;clear:both;} .l-footer01 li{float:left;position:relative;flex-basis: 33.33%;} .foot_a{text-align:center;margin:0 auto;} .foot_a a{width:76px;height:76px;line-height:76px;display:block;text-align:center;font-size:0;text-indent:-999px;margin:0 auto 10px;transition:all 0.5s ease-in-out 0s;background-size: cover;background-repeat: no-repeat;background-position: center;} .foot_a a.foot_01{background-image: url(/img/add_ico.png);} .l-footer01 li:hover a.foot_01{background-image:url(/img/add_icohover.png);transform:rotate(360deg) scale(1.0);} .foot_a a.foot_02{background-image: url(/img/tel_ico.png);} .l-footer01 li:hover a.foot_02{background-image:url(/img/tel_icohover.png) ;transform:rotate(360deg) scale(1.0);} .foot_a a.foot_03{background-image: url(/img/mail_ico.png);} .l-footer01 li:hover a.foot_03{background-image: url(/img/mail_icohover.png) ;transform:rotate(360deg) scale(1.0);} .foot_h2{text-align:center;} .foot_h2 a{font-size:16px;color:#fff;text-align:center;text-transform:uppercase;} .l-footer02{max-width: 1240px;margin:0 auto;overflow: hidden;padding: 10px 20px;display: flex;align-items: center;justify-content: space-between;} .l-footer02 .copyright{color:#fff;font-size:14px;float:left;width:auto;} .l-footer02 .copyright a{color:#fff;} .f_share{float:right;width:auto;} /*回到顶部*/ .scroll_top {top:-15px;display:block;height:51px;position:absolute;right: 0;width:51px;} .scroll_top .s_cursor{background: url(/img/icon_top.png) no-repeat center center #49b140;cursor: pointer;display: block;height: 51px;width:51px;} /*图标css*/ .jiathis_txt{margin:0 5px;} .f_share >div> .bds_weixin{background:url(/img/f_ico_wx.png) no-repeat 0 0;width:32px;height:32px!important;padding-left:0!important;} .f_share >div> .bds_sqq{background:url(/img/f_ico_qq.png) no-repeat 0 0;width:32px;height:32px!important;padding-left:0!important;} .f_share >div> .bds_tsina{background:url(/img/f_ico_wb.png) no-repeat 0 0;width:32px;height:32px!important;padding-left:0!important;} .f_share >div> .bds_fbook{background:url(/img/f_ico_fb.png) no-repeat 0 0;width:32px;height:32px!important;padding-left:0!important;} .f_share >div> .bds_twi{background:url(/img/f_ico_tw.png) no-repeat 0 0;width:32px;height:32px!important;padding-left:0!important;} /*渐变放大*/ .animated2 { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; overflow:hidden; } .animated2.pulse { animation:pulse 10s infinite; -webkit-animation:pulse 10s infinite; } @-webkit-keyframes pulse { 0% { -webkit-transform: scale3d(1, 1, 1) translateZ(0); transform: scale3d(1, 1, 1) translateZ(0); } 50% { -webkit-transform: scale3d(1.08, 1.08, 1.08) translateZ(0); transform: scale3d(1.08, 1.08, 1.08) translateZ(0); } 100% { -webkit-transform: scale3d(1, 1, 1) translateZ(0); transform: scale3d(1, 1, 1) translateZ(0); } } @keyframes pulse { 0% { -webkit-transform: scale3d(1, 1, 1) translateZ(0); transform: scale3d(1, 1, 1) translateZ(0); } 50% { -webkit-transform: scale3d(1.08, 1.08, 1.08) translateZ(0); transform: scale3d(1.08, 1.08, 1.08) translateZ(0); } 100% { -webkit-transform: scale3d(1, 1, 1) translateZ(0); transform: scale3d(1, 1, 1) translateZ(0); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } /*公用样式*/ .l-header{left: 0;position: absolute;top: 0;width: 100%;z-index: 100;} .Scroll_Tr {left: 0;position: fixed;right: 0;top: 0;width: 100%;will-change: transform;} .fegre {transform: scale(0.25, 0.25);top: 10%;} .l-load { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #000; z-index: 1000; } .l-load .num { font-size: 24px; color: #fff; font-family: 'Pathway Gothic One', sans-serif; position: absolute; top: 50%; left: 50%; z-index: 1; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); } .l-load .num .h, .l-load .num .t, .l-load .num .o { text-align: center; width: 11px; display: inline-block; } .l-load .kanji { width: 470px; height: 360px; background: url(/img/img_kanji.png) no-repeat 0 0; position: absolute; top: 50%; left: 50%; z-index: 0; margin: -180px 0 0 -235px; } .l-load .mask { background: #f0f0f0; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2; overflow: hidden; } .l-load .mask .top { background: #000; width: 100%; height: 50%; -webkit-transform: skewY(-12.5deg); transform: skewY(-12.5deg); position: absolute; top: 0; left: 0; margin-top: -1px; } .l-load .mask .bottom { background: #000; width: 100%; height: 50%; -webkit-transform: skewY(-12.5deg); transform: skewY(-12.5deg); position: absolute; bottom: 0; left: 0; } body.index .kovant_main02{ margin-top: 250px; position: relative; } body.index .kovant_main03 { margin-top:450px; position: relative; } body.index .kovant_main04 { margin-top:380px; position: relative; } body.index .kovant_main05 { margin-top:200px; position: relative; } body.index .kovant_main02 .line, body.index .kovant_main03 .line, body.index .kovant_main04 .line, body.index .kovant_main05 .line { width: 100%; height: 400px; overflow: hidden; position: absolute; top: 0; left: 0; z-index: -2; } body.index .kovant_main02 .line > .inner, body.index .kovant_main03 .line > .inner, body.index .kovant_main04 .line > .inner, body.index .kovant_main05 .line > .inner { width: 100%; height: 200px; background: #000 url(/img/bg_black.jpg) repeat 0 0; background-size: 1280px 1280px; position: absolute; top: 50%; left: 0; overflow: hidden; -webkit-transform-origin: top center; transform-origin: top center; } body.index .kovant_main02 .line > .inner .img, body.index .kovant_main03 .line > .inner .img, body.index .kovant_main04 .line > .inner .img, body.index .kovant_main05 .line > .inner .img { width: 1920px; margin-left: -960px; position: absolute; top: -142px; left: 50%; } body.index .kovant_main02 .line > .inner .img img, body.index .kovant_main03 .line > .inner .img img, body.index .kovant_main04 .line > .inner .img img, body.index .kovant_main05 .line > .inner .img img { width: 100%; } body.index .kovant_main03 > .inner, body.index .kovant_main05 > .inner { width: 100%; padding-top:200px; } body.index .kovant_main05 > .inner { width: 100%; padding-top:100px; } body.index .kovant_main04 > .inner{ width: 100%; padding-top:60px; } body.index .kovant_main02 > .inner > .inner, body.index .kovant_main03 > .inner > .inner, body.index .kovant_main04 > .inner > .inner, body.index .kovant_main05 > .inner > .inner { max-width: 1240px; margin: 0 auto; position: relative; width: 100%; padding: 0 20px; } .inner > .inner:after{ content:''; display:table; clear:both; } body.index .kovant_main02 > .inner > .inner > .title:after, body.index .kovant_main03 > .inner > .inner > .title:after, body.index .kovant_main04 > .inner > .inner > .title:after, body.index .kovant_main05 > .inner > .inner > .title:after { top: 104px; } body.index .kovant_main02 > .inner > .inner > .txt, body.index .kovant_main03 > .inner > .inner > .txt{ width: auto; margin-bottom: 49px; font-size:20px; color:#5c5a5a; line-height:30px; } body.index .kovant_main04 > .inner > .inner > .txt{ width: 720px; margin-bottom: 49px; font-size:16px; color:#5c5a5a; line-height:26px; } body.index .kovant_main05 > .inner > .inner > .txt { width: 100%; margin: 0 auto; position: relative; } body.index .kovant_main02 > .inner > .inner .kanji, body.index .kovant_main03 > .inner > .inner .kanji, body.index .kovant_main04 > .inner > .inner .kanji, body.index .kovant_main05 > .inner > .inner .kanji { position: absolute; z-index: -1; } body.index .kovant_main02 > .inner > .inner .kanji img, body.index .kovant_main03 > .inner > .inner .kanji img, body.index .kovant_main04 > .inner > .inner .kanji img, body.index .kovant_main05 > .inner > .inner .kanji img { width: 100%; } body.index .kovant_main02 .line > .inner, body.index .kovant_main04 .line > .inner { -webkit-transform: skewY(-12.5deg) translateY(-50%); transform: skewY(-12.5deg) translateY(-50%); } body.index .kovant_main02 .line > .inner .img, body.index .kovant_main04 .line > .inner .img { -webkit-transform: skewY(12.5deg); transform: skewY(12.5deg); } body.index .kovant_main02 > .inner > .inner > .title{ text-align:left; position:absolute; top:-315px; left:0; transition: all 1s ease-out 0s; } body.index .kovant_main02 > .inner > .inner > .title img{ width: 100%; } body.index .kovant_main04 > .inner > .inner > .title { text-align:left; position:absolute; top:-130px; left:0; transition: all 1s ease-out 0s; } body.index .kovant_main03 > .inner > .inner > .title { text-align:left; position:absolute; top:-215px; right:0; transition: all 1s ease-out 0s; } body.index .kovant_main03 > .inner > .inner > .txt{ width: 46%; } body.index .kovant_main05 > .inner > .inner > .title { text-align:left; position:absolute; top:-160px; right:0; transition: all 1s ease-out 0s; } body.index .kovant_main02 > .inner > .inner > .title:after, body.index .kovant_main04 > .inner > .inner > .title:after { right: 2px; } body.index .kovant_main02 > .inner > .inner > .txt { margin-left: auto; width: auto; clear: both; padding-left: 60%; float: right; } body.index .kovant_main04 > .inner > .inner > .txt{ margin-left: 480px; } body.index .kovant_main02 > .inner > .inner > .btn { margin-left: 60%; background:url(/img/more_line.jpg) no-repeat 134px 21px; height:45px; -webkit-animation:move ease-in-out 2s infinite; animation:move ease-in-out 2s infinite; width: auto; clear: both; padding: 0; width: 200px; } body.index .kovant_main04 > .inner > .inner > .btn { margin-left:480px; background:url(/img/more_line.jpg) no-repeat 134px 21px; height:45px; -webkit-animation:move ease-in-out 2s infinite; animation:move ease-in-out 2s infinite; padding: 0; width: 200px; } body.index .kovant_main03 > .inner > .inner > .btn{ background:url(/img/more_line.jpg) no-repeat 134px 21px; height:45px; -webkit-animation:move ease-in-out 2s infinite; animation:move ease-in-out 2s infinite; padding: 0; width: 200px; } body.index .kovant_main05 > .inner > .inner > .btn { background:url(/img/more_line.jpg) no-repeat 134px 21px; height:45px; margin: 50px auto; -webkit-animation:move ease-in-out 2s infinite; animation:move ease-in-out 2s infinite; padding: 0; width: 200px; display: block; } body.index .kovant_main03 .line > .inner, body.index .kovant_main05 .line > .inner { -webkit-transform: skewY(12.5deg) translateY(-50%); transform: skewY(12.5deg) translateY(-50%); } body.index .kovant_main03 .line > .inner .img, body.index .kovant_main05 .line > .inner .img { -webkit-transform: skewY(-12.5deg); transform: skewY(-12.5deg); } body.index .kovant_main03 > .inner > .inner > .title:after, body.index .kovant_main05 > .inner > .inner > .title:after { left: 2px; } body.index .kovant_main02 > .inner > .inner .kanji { width: 44%; top: 25%; left:0; } body.index .kovant_main03 { padding-bottom: 112px; } body.index .kovant_main03 > .inner > .inner .kanji { width: 62%; top: 5%; right:0; } body.index .kovant_main04 { padding-bottom: 80px; } body.index .kovant_main04 > .inner > .inner .kanji { width: 447px; top:380px; left:0px; } body.index .kovant_main04 > .inner .img { width: 683px; margin-top: 80px; position: relative; left: 50%; margin-left: -202px; } body.index .kovant_main04 > .inner .img img { width: 100%; } body.index .kovant_main05 { padding-bottom: 96px; } body.index .kovant_main05 > .inner > .inner .kanji { width: 618px; top: -96px; right: -256px; } /*top add*/ .cc_head{width:100%;} .head_wrap{max-width: 1240px;margin:0 auto;display:flex;align-items: center;min-height: 120px;padding: 0 20px;} .head_logo{ width: 16%; } .head_logo img{ width: 100%; } .head_right{ width: 84%; padding-left: 20px; } .search_top{ min-height: 30px; margin-bottom: 10px; text-align:right; } .search_top > div{display:inline-block;width:auto;} .top_nav{} @media only screen and (min-width: 769px){ /*大屏*/ .mob_conts{display:none;} } @media only screen and (max-width: 1024px) and (min-width: 769px){ body.index .kovant_main02{margin-top: 18%;} body.index .kovant_main02 > .inner > .inner > .title{ width: 24%; top: -37%; } .inner > .inner > .title img{width:100%} body.index .kovant_main02 > .inner > .inner .copy{ font-size: 26px; } body.index .kovant_main02 > .inner > .inner > .txt, body.index .kovant_main03 > .inner > .inner > .txt{ font-size: 16px; line-height: 26px; } body.index .kovant_main03{ margin-top: 25%; } body.index .kovant_main03 > .inner > .inner > .title{ width: 25%; } body.index .kovant_main03 > .inner > .inner .copy{font-size: 26px;} body.index .kovant_main04{ margin-top: 16%; padding-bottom: 30px; } body.index .kovant_main04 > .inner > .inner > .title{ width: 25%; top: -17%; } body.index .kovant_main04 > .inner > .inner .copy{font-size: 26px;width: auto;padding-left: 75%;margin: 0 0 20% 0;} body.index .kovant_main04 > .inner > .inner > .txt{ margin-left: 0; padding-left: 54%; width: 100%; } body.index .kovant_main04 > .inner > .inner > .btn{ margin-left: 54%; padding: 0; width: 200px; } body.index .kovant_main04 > .inner > .inner .kanji{ width: 48%; top: 42%; } body.index .kovant_main05{ margin-top: 20%; } body.index .kovant_main05 > .inner > .inner > .title{ width: 25%; top: -16%; } } @media only screen and (max-width: 768px){ /*小屏*/ html{height:auto;overflow: visible !important;} .cc_head{width:100%;background: #fff;} .head_wrap{ padding: 0 10px; min-height: 80px; } .head_logo{ width: calc(100% - 50px); } .head_logo img{ max-width: 200px; } .head_right{ width: 50px; padding: 0; } .search_top{display:none;} .kovant_main02 .line,.kovant_main02 .inner{display:none;} .kovant_main03 .line,.kovant_main03 .inner{display:none;} .kovant_main04 .line,.kovant_main04 .inner{display:none;} body.index .kovant_main02{margin-top: 17%;} .mob_s2{ padding: 0 15px; background: url(/img/mob_index_s1.png) bottom center / 100% auto no-repeat; padding-bottom: 36%; position: relative; } .scene_title{ position: relative; padding-left: 10px; font-size: 18px; color: #000; margin-bottom: 20px; } .scene_title:before{content: '';position: absolute;width: 3px;height: 20px;background: #49b140;left: 0;top: 0;} .scene_title b{ color: #3cac32; margin-right: 10px; } .scene_p{ line-height: 25px; font-size: 14px; } .scene_btn{ position: absolute; width: auto; height: 40px; border: 1px #49b140 solid; } .mob_s2 .scene_btn{ bottom: -15px; left: 10%; } .scene_btn:after{ content: ''; position: absolute; width: 40%; height: 1px; background: #49b140; left: 87%; top: 50%; transform: translate(0, -50%); } .scene_btn a{ color: #49b140; font-size: 14px; line-height: 40px; padding: 0 15px; } body.index .kovant_main03{margin-top: 17%;padding-bottom: 10px;} .mob_s3{ padding: 0 15px; background: url(/img/mob_index_s2.png) bottom center / 100% auto no-repeat; padding-bottom: 44%; position: relative; } .mob_s3 .scene_p{ text-align: right; } .mob_s3 .scene_btn{ bottom: -10px; right: 10%; } body.index .kovant_main04{margin-top: 10%;padding-bottom: 0;} .mob_s4{ padding: 0 15px; padding-bottom: 60px; position: relative; } .intro_img{margin-bottom:15px;} .intro_img img{width:100%;} .mob_s4 .scene_btn{ left: 50%; transform: translate(-50%, 0); bottom: 0; } .kovant_main05 .line,.kovant_main05 .inner .title,.kovant_main05 .inner .copy{display:none !important;} body.index .kovant_main05{ margin-top: 30px; padding-bottom: 20px; } body.index .kovant_main05 > .inner{ padding-top: 0; } body.index .kovant_main05 > .inner > .inner > .btn{ margin: 5px auto; } .foot_a a{width:50px;height:50px;} .l-footer02{ display: block; } .l-footer02 > div{float:none;} }