@gray1: #e7e7e7; @blue1: #283B6D; @blue2: #4E78A7; @color_theme: #283b6d; @gray_bg: #f2f2f2; @font_common: "YuGothic Medium", "Yu Gothic Medium", "游ゴシック Medium", "游ゴシック体 Medium",YuGothic, "游ゴシック体","ヒラギノ角ゴ Pro W3","メイリオ",sans-serif,"Helvetica","MS Pゴシック","Lucida Sans Unicode","Lucida Grande",Osaka, Arial,Verdana,helvetica; @font_title: 'ヒラギノ角ゴ Std W6', "Hiragino Kaku Gothic Std",'ヒラギノ角ゴシック Pro','Hiragino Kaku Gothic Pro', @font_common; body, p, h1, h2, h3, h4, h5, h6, dd, dl, dt, th, td, ul, li, ol, form, input, select, textarea, button, pre, legend { margin: 0; padding: 0; font-size: 16px; font-family: @font_common; } button, input, select, textarea { vertical-align: middle; -webkit-appearance: none; border-radius: 0 } h1, h2, h3, h4, h5, h6 { font-size: 100% } table { border-collapse: collapse; border-spacing: 0 } img, fieldset { border: 0 } img{ max-width: 100%; } address, cite, dfn, em, var, i { font-style: normal } ul, ol { list-style-type: none } sup { vertical-align: text-top } sub { vertical-align: text-bottom } a { text-decoration: none; cursor: pointer; color: #000 } select, input, textarea { outline: none } input { border-radius: 0; border: 0; background: 0 } .clearfix:after { clear: both; content: ''; display: block; font-size: 0; line-height: 0; visibility: hidden; width: 0; height: 0 } .clearfix { *display: inline-block } *html.clearfix { height: 1% } #wrap { overflow: hidden; } // rotate .rotate90 { transform: rotate(90deg); -ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg) } .rotate_90 { transform: rotate(-90deg); -ms-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg) } .rotate180 { transform: rotate(180deg); -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg) } .mart10 { margin-top: 10px } // flex .flexBox .boxWrap { display: box; display: -webkit-box } .flexBox .box { box-flex: 1; -webkit-box-flex: 1; -moz-box-flex: 1 } .flexBox .ulBox { display: box; display: -webkit-box } .flexBox .ulBox li { box-flex: 1; -webkit-box-flex: 1; -moz-box-flex: 1 } .fixedTop { position: fixed; top: 0; left: 0 } .fixedBottom { position: fixed; bottom: 0; left: 0 } .textcenter { text-align: center } .textleft { text-align: left } .textright { text-align: right } .menuIcon .btnItem { display: block; text-align: center } .menuIcon .mIcon { display: block; margin: 0 auto } //select .selTxt { position: relative; } .selTxt select { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .selTxt .txt { display: inline-block; width: 100%; height: 100%; position: absolute; top: 0; left: 0 } .border { border: 1px solid @gray1 } .borderT { border-top: 1px solid @gray1 } .borderB { border-bottom: 1px solid @gray1 } .borderR { border-right: 1px solid @gray1 } .bodderL { border-left: 1px solid @gray1 } .borderTB { border-top: 1px solid @gray1; border-bottom: 1px solid @gray1 } // css3 .rotateAni { -webkit-animation: anirt 5s linear infinite } @keyframes anirt { 0% { -webkit-transform: rotate(0deg) } 50% { -webkit-transform: rotate(180deg) } 100% { -webkit-transform: rotate(360deg) } } @-ms-keyframes anirt { 0% { -webkit-transform: rotate(0deg) } 50% { -webkit-transform: rotate(180deg) } 100% { -webkit-transform: rotate(360deg) } } @-moz-keyframes anirt { 0% { -webkit-transform: rotate(0deg) } 50% { -webkit-transform: rotate(180deg) } 100% { -webkit-transform: rotate(360deg) } } @-webkit-keyframes anirt { 0% { -webkit-transform: rotate(0deg) } 50% { -webkit-transform: rotate(180deg) } 100% { -webkit-transform: rotate(360deg) } } .arrow { display: block; animation: moveIcon 1s linear infinite forwards; -webkit-animation: moveIcon 1s linear infinite forwards; -moz-animation: moveIcon 1s linear infinite forwards } @-webkit-keyframes moveIcon { 0% { -webkit-transform: translateY(-10px); opacity: 0 } 100% { -webkit-transform: translateY(0); opacity: 1 } } @keyframes moveIcon { 0% { transform: translateY(-10px); opacity: 0 } 100% { transform: translateY(0); opacity: 1 } } .whit::-webkit-input-placeholder { color: #fff } //-moz-placeholder .whit:-moz-placeholder { color: #fff } .whit::-moz-placeholder { color: #fff } .whit:-ms-input-placeholder { color: #fff } .clo_gy::-webkit-input-placeholder { color: #999999 } .fl { float: left } .fr { float: right } .hide { display: none } /*main_header start*/ .center, #container { max-width: 1000px; margin: 0 auto; } .container { max-width: 1000px; } .main_header { .center { max-width: 960px; padding: 15px 20px 10px; } .lf_message { float: left; .p1 { font-size: 11px; } h1 { font-size: 23px; margin: 5px 0; } .p2 { font-size: 10px; } } .rf_message { color: #283B6D; font-size: 11px; width: 446px; float: right; } .p3 { font-size: 11px; text-align: center; a {} &:before { display: inline-block; content: ''; width: 76px; border-top: 1px solid #293b6d; float: left; margin-top: 8px; } &:after { display: inline-block; content: ''; width: 76px; border-top: 1px solid #293b6d; float: right; margin-top: 8px; } } .menu_button { float: right; margin-top: 20px; margin-left: 30px; } .contact { position: relative; } .phone_msg { float: left; } .phone_num { font-size: 25px; color: @blue1; img { vertical-align: middle; margin-right: 5px; } } .phone_time { font-size: 13px; color: #808080; span { font-size: 12px; color: #fff; display: inline-block; background: @blue1; padding: 1px 7px 0; margin-right: 5px; border-radius: 2px; } } .main_button { display: inline-block; float: right; width: 230px; height: 36px; background: @blue1; color: #fff; line-height: 36px; text-align: center; border-radius: 2px; position: absolute; top: 21px; right: 2px; img { margin-right: 10px; margin-top: -3px; } } } @media (min-width: 768px) { body { padding-top: 87px; } .main_header { background-color: #fff; position: fixed; width: 100%; left: 0; right: 0; top: 0; min-height: 87px; z-index: 9998; } } .stopScroll { overflow: hidden; } .slide_menu { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; display: none; } .slide_menu .mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: 0.6; } .slide_menu .menu { position: absolute; top: 0; left: -222px; width: 222px; height: 100%; background: @color_theme; overflow: auto; } .slide_menu .closebutton { position: fixed; top: 0; left: -222px; width: 182px; padding-top: 20px; padding-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, .5); background: @color_theme; } .slide_menu .closebutton a { display: inline-block; } .slide_menu .menu_box { padding: 20px; } .slide_menu .menu_box ul { padding-top: 60px; } .slide_menu li { padding-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, .5); margin-bottom: 27px; } .slide_menu li:last-child { border-bottom: 0; } .slide_menu dt, .slide_menu dd, .slide_menu dt a, .slide_menu dd a { color: #ffffff; } .slide_menu dt, .slide_menu dt a { font-size: 16px; } .slide_menu dd a { font-size: 13px; display: inline-block; } .slide_menu dd { padding-left: 12px; } .slide_menu .dlb dd, .slide_menu .dlb dt, .slide_menu .dlb dt { padding-bottom: 19px; } .slide_menu .dlb dd:last-child { padding-bottom: 0; } .slide_menu .dlb dd.active a { border-bottom: 1px solid rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .8); } /*header end*/ .banner { background-color: @gray_bg; img { width: 100%; } } #home .banner { background-color: transparent; } /*floor1*/ .gfloor { background: @gray_bg; position: relative; &:after { background: @gray_bg; content: ""; position: absolute;right: 0;top: 0;bottom: 0;left: -150%;width: 400%;height: 100%;z-index: -1;visibility: visible;font-size: 1em;line-height: 1em; } } .business_index1 { padding-top: 52px; padding-bottom: 40px; font-weight: bold; .busi_titlebox { text-align: center; } h2 { color: #283b6d; font-size: 25px; font-weight: bold; } .bsi_title { font-size: 14px; border: 1px solid #283b6d; color: #283b6d; margin-top: 10px; display: inline-block; padding: 5px 15px; } .item_box { padding-left: 35px; margin-top: 40px; li { display: inline-block; width: 300px; height: 270px; margin: 0 5px; background: #fff; float: left; } .imgbox { padding-top: 35px; text-align: center; padding-bottom: 25px; } .busititle { width: 100%; margin-bottom: 10px; td { height: 50px; font-size: 20px; color: #283B6D; text-align: center; font-weight: bold; } } .details { font-size: 13px; margin: 0 24px; text-align: left; line-height: 22px; } } } .tipwrap { .tipbox { float: left; width: 596px; p { font-size: 16px; font-weight: bold; } .tiptitle { font-size: 28px; color: #283B6D; font-weight: bold; font-family: @font_title; line-height: 36px; margin-bottom: 23px; width: 105%; i { display: inline-block; float: left; width: 70px; height: 70px; text-align: center; line-height: 70px; color: #fff; font-size: 29px; background: url(../img/icon_number.png) no-repeat; margin-right: 15px; } } } } .index_tip1 { padding-top: 100px; padding-bottom: 45px; .tipbox { margin-left: 30px; margin-top: 20px; } .tipimgbox { float: right; } } .tipimgbox { img { max-width: 100%; } } .index_tip2 { padding-top: 78px; background: #ebf5fb; position: relative; .tipbox { margin-left: 15px; } .tipimgbox { margin-top: 60px; margin-left: 30px; float: left; } &:before { display: inline-block; content: ''; width: 200px; height: 52px; background: url(../img/icon_arrow_white.png) no-repeat; position: absolute; top: 0; left: 50%; margin-left: -100px; } &:after { display: inline-block; content: ''; width: 200px; height: 52px; background: url(../img/icon_arrow_blue.png) no-repeat; position: absolute; bottom: -52px; left: 50%; margin-left: -100px; } } .tipimgbox2 { display: none; } .index_tip3 { padding-top: 73px; padding-bottom: 86px; .tipbox { margin-left: 30px; margin-top: 20px; } .tipimgbox { float: right; } } .index_tb { margin: 0 25px; border-top: 1px dotted #e3e3e3; padding-top: 20px; } .base_title { position: relative; font-size: 20px; color: #283B6D; padding-left: 15px; font-weight: bold; &:before { display: inline-block; content: ''; width: 6px; height: 19px; background: #283B6D; position: absolute; left: 0; top: 1px; } .more { font-size: 14px; color: #000000; float: right; } } .data_tb { table { width: 100%; margin-top: 23px; tr th, tr td { border: 1px solid #c8c8c8; padding: 10px 15px; } } thead { th { background: @gray_bg; text-align: center; font-size: 14px; color: #283B6D; font-weight: bold; } } tbody { tr td:nth-child(1), tr td:nth-child(2) { font-weight: bold; } td { font-size: 15px; height: 100px; p { margin: 5px 15px; font-size: 13px; span { float: right; } } } tr:nth-child(even) { background: @gray_bg; } } } .index_peo { padding-top: 84px; text-align: center; img { max-width: 100%; } } .index_area { padding-top: 32px; padding-bottom: 20px; background: @gray_bg; font-weight: bold; position: relative; &:after { background: @gray_bg; content: ""; position: absolute;right: 0;top: 0;bottom: 0;left: -150%;width: 400%;height: 100%;z-index: -1;visibility: visible;font-size: 1em;line-height: 1em; } .areablock { margin-top: -8px; width: 600px; float: left; margin-left: 33px; td { font-size: 12px; padding: 5px 0; a, span { display: inline-block; margin-right: 5px; margin-bottom: 2px; } } } .rf_mes { float: left; width: 23%; margin-left: 10px; img { width: 100%; } } } .index_area_2 { .areablock { // margin-top: -8px; width: 440px; // float: left; // margin-left: 33px; // td{ // font-size: 12px; // padding: 5px 0; // a { // display: inline-block; // margin-right: 5px; // margin-bottom: 2px; // } // } } } .lftl { float: left; height: 170px; border-right: 1px dotted #b9b9b9; padding: 0 30px; h2 { font-weight: bold; font-size: 13px; text-align: center; padding-top: 48px; span { font-size: 24px; display: block; } } } .index_zixun { padding-top: 75px; text-align: center; padding-bottom: 25px; p { margin-top: 20px; font-size: 22px; font-weight: bold; span { font-size: 16px; } } } .index_phone_floor { padding: 20px 0; text-align: center; font-size: 22px; vertical-align: middle; font-weight: bold; span { font-size: 44px; margin-left: 30px; margin-right: 20px; position: relative; top: 5px; img { position: relative; top: -5px; margin-right: 10px; } } i { font-size: 16px; font-weight: normal; position: relative; top: -2px; } } .index_footer { padding: 30px 20px; ul { float: left; margin-right: 20px; li { margin-bottom: 10px; } a { display: inline-block; padding: 2px 0 2px 25px; background: url(../img/icon_arrow_rf.png) no-repeat 5px 4px; border-bottom: 1px solid #9AA5A0; min-width: 120px; padding-right: 5px; padding-bottom: 5px; font-size: 12px; font-weight: bold; } } .detmes { float: right; img { max-width: 100%; } p, h2 { color: #4D4D4D; } p { font-size: 15px; } h2 { font-size: 29px; margin: 10px 0; } } } .copyright { text-align: center; padding-top: 10px; padding-bottom: 30px; font-size: 14px; } /*index.html */ /*index2.html*/ .index2_lf_msg { h1 { font-size: 23px; span { font-size: 30px; } } .p2 { font-size: 10px; color: #4E78A6; } } .index2_f2 { background: url(../img/i2_f2_bg.jpg) no-repeat; background-size: 100% auto; padding-top: 209px; padding-bottom: 43px; .row { margin-right: -22px; margin-left: -22px; } .i2f2_item { padding-left: 22px; padding-right: 22px; text-align: center; img { max-width: 100%; } } .tbox { text-align: center; margin-top: 23px; font-weight: bold; font-family: @font_title; p { display: inline-block; font-size: 21px; color: #293146; position: relative; &:before { display: inline-block; content: ''; width: 100%; height: 6px; background: url(../img/icon_blue_line.png); background-size: 100% 100%; border-radius: 5px; position: absolute; top: 50%; margin-top: -5px; left: 0; } } } } .business_index2 { padding-top: 60px; padding-bottom: 73px; h3 { font-size: 37px; color: #293146; text-align: center; margin: 0 45px; font-family: @font_title; line-height: 1.3; } .row { margin-left: 0; margin-right: 0; padding-left: 20px; padding-right: 20px; } .itemwrap { padding-left: 0; padding-right: 0; margin-bottom: 10px; } .bi_wrap { margin-top: 60px; } .bi_item { background: #fff; margin: 0 5px; padding: 0 24px; height: 270px; } .imgbox { text-align: center; padding-top: 34px; } .busititle { width: 100%; margin-top: 26px; td { text-align: center; font-size: 20px; color: #297ED0; height: 56px; font-weight: bold; } } .details { font-size: 13px; } } .index2_step { margin-top: 40px; img { max-width: 100%; } } .bigtitle { font-size: 31px; color: #4E78A6; text-align: center; padding: 20px 0; border-top: 1px solid #d3dde9; border-bottom: 1px solid #d3dde9; font-family: @font_title; } .tipwrap2 { .tipbox { .tiptitle { color: #4E78A6; line-height: 27px; white-space: nowrap; i { background: url(../img/icon_number2.png) -1px 50% no-repeat; color: #333; font-family: @font_common; } td { font-size: 18px; font-family: @font_title; } } } } .index2_tip1 { padding-top: 44px; .tipbox { p { margin-left: 10px; } } .tipimgbox { float: left; } } .indes2_tip2 { background: #e4ebf3; position: relative; padding-bottom: 70px; padding-top: 75px; .tipbox { margin-left: 66px; position: relative; z-index: 20; } .tipimgbox { position: absolute; right: 20px; bottom: 0; margin-top: 0; margin-left: 0; } &:after { background: url(../img/icon_arrow_blue2.png) no-repeat; } } .index2_tip3 { padding-top: 75px; padding-bottom: 100px; } .index2_phone_floor { margin-top: 10px; } .index2_tbint { padding-top: 90px; padding-bottom: 105px; .tip { font-size: 12px; color: #4D4D4D; margin-bottom: 10px; } .wrap { max-width: 730px; margin: 0 auto; } .twrap { background: url(../img/bg_tb.png); padding: 0 20px; padding-bottom: 24px; .title { font-size: 30px; color: #fff; text-align: center; padding: 20px 0; } table { width: 100%; th, td { padding: 2.5px; vertical-align: top; color: #3c8faf; } th { font-size: 12px; position: relative; .tbbox { background: #e5e5e5; height: 100%; } i { display: inline-block; color: #fff; font-size: 10px; background: #e86747; padding: 0 5px; margin-left: 10px; } } td { .tbbox { background: #fff; } } } .tbbox { width: 100%; padding: 18px; vertical-align: middle; .tx1 { width: 460px; border: none; max-width: 460px; height: 135px; background: #e5e5e5; text-indent: 10px; } .int2 { width: 460px; height: 24px; border: none; max-width: 460px; background: #e5e5e5; text-indent: 10px; } .stwrap { line-height: 24px; span { color: #000; margin: 0 5px; } } .short_int { background: #e5e5e5; width: 85px; height: 24px; text-indent: 10px; margin-top: -5px; } .tip2 { font-size: 14px; font-weight: bold; color: #666; margin-top: 5px; span { display: inline-block; color: #fff; background: #828284; margin-right: 10px; padding: 3px 5px; } } } } .btntb { text-align: center; padding-top: 30px; input { width: 220px; height: 54px; background: url(../img/bg_tb.png); color: #fff; } } } .selects { display: inline-block; background: url(../img/sel_bg.png); background-size: 100% 100%; height: 24px; padding: 2px 10px; font-size: 14px; border: none; min-width: 84px; margin-bottom: 10px; } /*index3.html*/ .crumbs { font-size: 11px; color: #333; margin: 0 25px; text-transform: uppercase; span { margin: 0 5px; } title { font-size: 11px; color: #333; } } .mp1 { padding-top: 20px; margin-bottom: 100px; } .ct2 { margin: 0 35px; } .k3_fj { text-align: center; margin-bottom: 25px; img { max-width: 100%; } } .index_area .k3_bt { width: auto; max-width: 650px; } /*index5.html*/ .index5_business { padding-top: 30px; h3 { font-size: 25px; color: #283B6D; text-align: center; font-weight: bold; font-family: @font_title; } .row { margin-top: 27px; margin-left: 0; margin-right: 0; padding-left: 19px; padding-right: 19px; } .item { height: 376px; margin-bottom: 14px; .top { text-align: center; img { max-width: 100%; } } } .busi_title { font-size: 24px; color: #4E78A7; margin-top: 25px; margin-bottom: 10px; text-align: center; font-weight: bold; font-family: @font_title; a { color: #4E78A7; } } .busi_deta { color: #1A1A1A; font-size: 14px; padding: 0 20px; background: url(../img/icon_arrow_rb.jpg) no-repeat right bottom; padding-bottom: 10px; } } .index5_timeline { padding-top: 66px; padding-bottom: 44px; .lftl { font-size: 13px; color: #4E78A7; width: 208px; text-align: center; h2 { padding-top: 40px; } span { font-size: 22px; display: block; margin-bottom: 6px; } a { display: inline-block; margin-top: 14px; } } .timeline_list { float: right; margin-left: 0; width: 75%; li { font-size: 14px; margin-bottom: 13px; color: #333; table tr { th, td { vertical-align: top; font-size: 14px; } } } a { font-size: 14px; // border-bottom: 1px solid #737373; text-decoration: underline; } span { display: inline-block; width: 85px; height: 17px; font-size: 12px; text-align: center; margin-left: 5px; margin-right: 20px; } .sp_deep { color: #0f6199; background: #e3ecf3; } .sp_light { color: #4591c2; background: #ebf4f9; } } } #news-list.index5_timeline { padding-top: 0; li table, li table tr, li table td { vertical-align: top; } .date { width: 25%; font-size: 85%; line-height: 1.5; padding-top: 0; } li .link { line-height: 1.2; padding-left: 1em; } .timeline_list { width: 95%; span { margin-right: 0; min-height: 17px; height: auto; } } } //.lftl{ // margin-left: 33px; //} .index5_area { .lftl { text-align: center; h2 { color: #4E78A7; } } .rf_mes { display: none; } } .index5_companymsg { .row { margin-left: 0; margin-right: 0; } .item { padding-left: 0; padding-right: 0; img { max-width: 100%; } } .companymsg { background: #4e78a7; padding-left: 105px; padding-top: 35px; height: 224px; } p { color: #fff; font-size: 12px; line-height: 1.5; } h2 { font-size: 23px; color: #fff; margin-top: 5px; margin-bottom: 10px; font-weight: bold; // font-family: @font_title; span { font-size: 30px; margin-left: 10px; } } .white_button { display: inline-block; background: #fff; text-align: center; width: 271px; height: 31px; font-size: 14px; line-height: 31px; margin-top: 20px; font-weight: bold; } } .index5_footer { padding-top: 30px; padding-bottom: 60px; .row { margin-left: 0; margin-right: 0; } .item { padding-left: 0; padding-right: 0; img { max-width: 100%; } } .lfmsg { padding-left: 55px; padding-right: 40px; } .list1 { width: 100%; td { padding: 10px 0; } a { display: inline-block; padding-left: 16px; background: url(../img/icon_arrow_circular.jpg) no-repeat left center; font-size: 13px; font-weight: bold; } } .list2 { width: 100%; td { padding: 8px 0; } a { display: inline-block; padding-left: 7px; background: url(../img/icon_arrow_rf2.jpg) no-repeat left center; font-size: 10px; color: #969696; } } .rfbox { text-align: center; font-weight: bold; a { margin-bottom: 16px; display: inline-block; width: 350px; height: 60px; text-align: center; line-height: 60px; font-size: 16px; background: #d9f0fe; color: #4E78A7; } } } /*outline.html*/ .selbox { overflow: hidden; .row { margin-left: 0; margin-right: 0; } .item { padding-left: 0; padding-right: 0; img { max-width: 100%; } } .selbox { margin: 0 4px; border: 1px solid #283B6D; background: @gray_bg; position: relative; margin-bottom: 10px; font-weight: bold; a { display: block; height: 40px; line-height: 40px; background: @gray_bg; font-size: 12px; color: #283B6D; text-indent: 15px; } i { position: absolute; top: 10px; right: 10px; color: #283B6D; } } } .mp2 { margin-left: 0; margin-top: 10px; margin-bottom: 25px; } .blueline { font-size: 14px; color: #fff; background: #273b6d; padding: 10px 20px; font-weight: bold; } #policy .blueline { position: relative; &:after { background: #273b6d; content: ""; position: absolute;right: 0;top: 0;bottom: 0;left: -150%;width: 400%;height: 100%;z-index: -1;visibility: visible;font-size: 1em;line-height: 1em; } } .itb2 { margin-top: 10px; border-bottom: 1px solid #e8e8e8; margin-bottom: 60px; table { width: 100%; th { padding: 20px; background: @gray_bg; color: #283B6D; } td, th { font-size: 14px; } td { padding: 10px 20px; line-height: 28px; color: #000; } tr { border-top: 1px solid #e8e8e8; } } } .mp3 { margin-bottom: 50px; } /*service.html*/ .service_det { padding-bottom: 50px; background: @gray_bg; padding-top: 100px; position: relative; &:after { background: @gray_bg; content: ""; position: absolute;right: 0;top: 0;bottom: 0;left: -150%;width: 400%;height: 100%;z-index: -1;visibility: visible;font-size: 1em;line-height: 1em; } .se_imgbox { float: left; margin-left: 67px; } .det_content { float: left; margin-left: 15px; max-width: 600px; h2 { font-size: 21px; padding-left: 100px; margin-bottom: 50px; font-weight: bold; } .p1 { font-size: 12px; line-height: 28px; margin-bottom: 50px; font-weight: bold; } .p2 { font-size: 11px; max-width: 409px; line-height: 20px; } } } .se_title { font-size: 20px; text-align: center; margin-bottom: 22px; line-height: 32px; } /*table_data.html*/ .mp4 { margin-bottom: 80px; } .mp5 { padding-bottom: 52px; margin-bottom: 20px; } .td_style { /*background: url(../img/bg_bolang.png) no-repeat bottom center; background-size: 100%;*/ } .scrpoll_top { display: block; width: 55px; height: 55px; background: url(../img/scroll_top.png); background-size: 100% 100%; position: fixed; bottom: 30px; right: 30px; display: none; } // .menu_button { // position: fixed; // top: 0; // left: 0; // width: 66px; // height: 66px; // background: url(../img/menu_button.jpg) no-repeat; // z-index: 999; // cursor: pointer; // } .bluecol { color: #283B6D; } /*tabs.html*/ .tab_tip { font-size: 20px; color: #588DB3; font-weight: bold; } .mp6 { margin-top: 50px; margin-bottom: 105px; } .tab_wrap { padding-top: 25px; margin-top: 10px; border-top: 1px dashed @gray_bg; } .yuan_title { position: relative; font-size: 24px; color: #333333; padding-left: 22px; font-weight: bold; // span{ // color: #4c79a3; // } &:before { display: block; content: ''; width: 16px; height: 16px; background: #4c79a3; border-radius: 100%; position: absolute; top: 6px; left: 0; } } .mp7 { margin-bottom: 18px; } .tab_tip2 { font-size: 14px; color: #333333; margin-bottom: 10px; font-weight: bold; } .tab_wrap .itemwrap { background: @gray_bg; padding-top: 34px; margin-top: 16px; .row { margin-left: 0; margin-right: 0; } .item { padding-left: 0; padding-right: 0; img { max-width: 100%; } } } .itemwrap2 { .row { margin-left: 0; margin-right: 0; } .item { padding-left: 0; padding-right: 0; img { max-width: 100%; } } .lf_content { margin-top: 10px; font-weight: bold; .p1 { font-size: 16px; color: #000; margin-bottom: 10px; } .p2 { font-size: 14px; color: #333333; line-height: 24px; } } .rf_content { text-align: right; } } .mp10 { margin-bottom: 30px; } .ibitem { padding: 0 30px; margin-bottom: 50px; font-weight: bold; .toptitle { font-size: 16px; color: #283B6D; background: #fff; height: 34px; line-height: 34px; &:before { display: inline-block; content: ''; width: 5px; height: 25px; background: #283B6D; float: left; margin-left: 17px; margin-right: 12px; margin-top: 5px; } } .bottomcontent { background: #fff; padding: 0 15px; line-height: 26px; font-size: 14px; // min-height: 180px; margin-top: 35px; padding-bottom: 10px; padding-top: 10px; } } .mp8 { margin-bottom: 150px; } .mp9 { margin-bottom: 170px; } .notopstyle { padding-top: 0; border-top: 0; } .tab_tip3 { font-size: 14px; color: #283B6D; margin: 10px 0; font-weight: bold; } .mp11 { margin-bottom: 150px; } .mp12 { margin-bottom: 127px; } .article_box { max-width: 714px; margin: 0 auto; margin-bottom: 180px; margin-top: 90px; padding-bottom: 100px; border-bottom: 1px dotted #ccc; .content p { font-size: 14px; line-height: 1.8; margin-bottom: 28px; } .lfcontent { float: left; max-width: 362px; } .rfimgbox { float: right; img { max-width: 100%; } } } .article_box2{ width: 714px; } .art_title { font-size: 30px; font-weight: bold; line-height: 1.4; margin: 26px 0 18px 0; border-bottom: 1px dotted #ccc; margin-bottom: 30px; padding-bottom: 24px; } .qbblock { max-width: 710px; margin: 0 auto; margin-bottom: 50px; clear: both; .qb_table { table { width: 100%; margin: 5px 0; } thead { th { color: #ffffff; background-color: #588db3; padding: 5px 8px; border: 1px solid #ccc; } } tbody { th, td { border: 1px solid #ccc; padding: 5px 8px; font-size: 14px; word-break: break-all; } th { background-color: #e5e5e5; font-weight: bold; } } } } .qb_title { font-size: 18px; line-height: 100%; border-bottom: 1px dotted #ccc; padding-bottom: 15px; position: relative; clear: both; margin-bottom: 30px; font-weight: bold; font-family: @font_title; &:before { display: block; content: ''; width: 200px; background: #283b6d; height: 1px; position: absolute; bottom: 0; left: 0; } } .slidebarbox{ float: right; width: 210px; .sidebar{ h1{ background: url(../img/sidebar_title.png) no-repeat 0 0; text-indent: -999px; display: block; height: 35px; border-bottom: 1px solid #b8b6b5; overflow: hidden; } } .side_menu { margin-bottom: 30px; } .side_menu li a { border-bottom: 1px solid #d9d9d9; background: #f7f6f5 url(../img/arrow_off2.png) no-repeat 15px 17px; display: block; font-size: 14px; text-decoration: none; color: #333; padding: 11px 10px 10px 28px; font-weight: bold; } .side_menu li a { -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; transition-property: all; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; transition-duration: 0.3s; } .side_menu li a span { font-weight: normal; font-size: 79%; } .side_menu .current a, .side_menu .current-cat a { color: #283b6d; background: #d9f0fe url(../img/arrow_on.png) no-repeat 15px 17px; } } .cart{ max-width: 960px; margin: 0 auto; } .sy_index_f2{ padding-top: 135px; background: url(../img/img16.png) no-repeat 50% 0 #f3f4f8 !important; background-size: 100%; position: relative; &:before { background: url(../img/img16.png) repeat-x 50% 0 #f3f4f8 !important; content: ""; position: absolute;right: 0;top: 0;left: -150%;width: 400%;height: 133px;z-index: 1;visibility: visible;font-size: 1em;line-height: 1em; } &:after { background: #f3f4f8; content: ""; position: absolute;right: 0;top: 0;bottom: 0;left: -150%;width: 400%;height: 100%;z-index: -1;visibility: visible;font-size: 1em;line-height: 1em; } .lf_item{ width: 35%; float: left; padding-top: 48px; img{ max-width: 100%; } } .rf_item{ width: 65%; float: right; padding-top: 50px; padding-left: 20px; padding-right: 15px; } .font_title{ margin-bottom: 20px; img{ max-width: 100%; } } .f2_tb{ width: 100%; td{ background: url(../img/line_dotten.jpg) repeat-x bottom left; padding: 8px 0; font-size: 14px; } tr td:first-child{ min-width: 30px; } } } .sy_hotline{ text-align: center; padding-top: 77px; padding-bottom: 90px; img{ max-width: 100%; } } .sy_index_f3{ background: #4c729d; padding-top: 40px; padding-bottom: 50px; position: relative; &:after { background: #4c729d; content: ""; position: absolute;right: 0;top: 0;bottom: 0;left: -150%;width: 400%;height: 100%;z-index: -1;visibility: visible;font-size: 1em;line-height: 1em; } .row{ margin-left: 0; margin-right: 0; } .item{ padding-left: 0; padding-right: 0; } .if3title{ text-align: center; padding-bottom: 40px; } .indexf3boxlf{ text-align: right; padding-right: 30px; } .indexf3boxrf{ padding-left: 30px; font-size: 14px; color: #fff; padding-right: 70px; line-height: 30px; margin-top: -6px; font-weight: bold; } } .sy_blue_block{ background: #4c729d !important; position: relative; &:after { background: #4c729d; content: ""; position: absolute;right: 0;top: 0;bottom: 0;left: -150%;width: 400%;height: 100%;z-index: -1;visibility: visible;font-size: 1em;line-height: 1em; } } .sy_index_f4{ padding: 16px 0; text-align: center; } .sy_index_f5{ padding: 30px 0; } .blue_font{ font-size: 18px; color: #4c729d; font-weight: bold; } .sy_index10_f5{ padding-top: 0; background: none !important; &:before, &:after { display: none; } } .sy_index10_f3{ background: #368487; &:after { background: #368487; } } /*media*/ @media only screen and (max-width: 1000px) { .index_area .rf_mes { width: 18%; } } @media only screen and (max-width: 970px) { .article_box2{ width: auto; margin: 0 auto; float: none; } .slidebarbox{ float: none; max-width: 710px; clear: both; margin: 0 auto; width: auto; } .business_index1 .item_box { padding-left: 0; } .business_index1 .item_box li { float: none; display: block; width: 90%; height: auto; padding-bottom: 20px; margin: 0 auto 20px; } .main_header .menu_button { margin-left: 0; } .tipwrap .tipbox { float: none; width: auto; margin-left: 20px; margin-right: 20px; } .tipimgbox { float: none!important; text-align: center; } .index_tip2 .tipimgbox { margin-left: 0; margin-top: 0; } .index_tip2 { padding-bottom: 20px; } .index_tip1 { padding-top: 20px; } .tipimgbox1 { display: none; } .tipimgbox2 { display: block; } /*index2*/ .index2_lf_msg { width: 70%; img { max-width: 100%; } } .main_header .lf_message h1 { font-size: 18px; span { font-size: 20px; } } .business_index2 h3 { font-size: 20px; } .bigtitle { font-size: 20px; padding-left: 20px; padding-right: 20px; } .tipwrap .tipbox .tiptitle { white-space: normal; } .tipwrap .tipbox .tiptitle table { width: 100%; } .indes2_tip2 .tipimgbox { position: initial; margin-top: 20px; } .index2_tbint .twrap table th, .index2_tbint .twrap table td { display: block; width: 100%; } .selects { margin-bottom: 0; } .index2_tbint .twrap .tbbox .int2, .index2_tbint .twrap .tbbox .tx1 { width: 100%; } .index2_f2 .row { margin-left: 0; margin-right: 0; } .index2_f2 .i2f2_item { margin-bottom: 20px; } /*index3*/ .ct2 { margin: 0; .index_tb { margin: 0 10px; } } .index5_business { .item { height: auto; } } .index5_business .busi_title { font-size: 20px; } .index5_business .busi_deta { font-size: 12px; } /*index5*/ .index5_timeline { padding-top: 0; .lftl { float: none; margin-left: 0; width: auto; border-right: 0; } .timeline_list { float: none; margin-left: 15px; margin-right: 15px; } } .index5_area { .lftl { width: auto; } } .index5_companymsg .companymsg { padding-left: 20px; } .index5_footer .lfmsg { padding-left: 20px; padding-right: 20px; } .index5_footer .rfbox a { width: 90%; } /*outline*/ .mp2 { margin-left: 20px; } /*service.html*/ .service_det { .se_imgbox { text-align: center; float: none; margin-bottom: 20px; margin-left: 0; img { max-width: 100%; } } } .service_det .det_content h2 { padding-left: 0; text-align: center; margin-bottom: 20px; } .se_title { font-size: 16px; } .scrpoll_top { right: 20px; bottom: 20px; width: 30px; height: 30px; } .qbblock .qb_table tbody th, .qbblock .qb_table tbody td{ font-size: 12px; } .sy_index_f3 .indexf3boxrf{ padding-right: 20px; padding-left: 20px; } .sy_index_f3 .indexf3boxlf{ padding-right: 20px; } } @media only screen and (max-width: 850px) { .rf_message { display: none; } .selects { margin-bottom: 10px; } .data_tb tbody td p span { float: none; display: block; } .data_tb tbody td p { margin: 0; } .data_tb table tr th, .data_tb table tr td { padding: 10px 10px; } .index_area .lftl { float: none; border-right: 0; text-align: center; height: auto; padding-bottom: 20px; h2 { padding-top: 0; } } .index_area .areablock { width: auto; } .rf_mes { display: none; } .index_zixun { a { display: block; margin: 0 20px; img { max-width: 100%; } } } .index_zixun p { font-size: 14px; margin: 10px 20px 0; } .index_phone_floor { font-size: 16px; } .index_phone_floor span { display: block; font-size: 28px; margin-bottom: 10px; img { width: 20px; } } .index_footer ul { float: none; } .index_footer ul a { display: block; } .index_footer .detmes h2 { font-size: 18px; } .tipwrap .tipbox .tiptitle { font-size: 24px; } .index_footer .detmes { float: none; } .itemwrap2 .rf_content { text-align: center; margin: 10px 0; img { max-width: 100%; } } .itemwrap2 .lf_content { margin: 0 20px; } .yuan_title { margin: 10px 20px 10px; } .tab_tip2, .tab_tip3 { margin: 10px 20px 10px; } .index5_timeline .timeline_list a { display: block; margin-top: 0; } .index5_timeline { .timeline_list { width: 90%; li table tbody tr { td { display: inline-block; } .link { display: block; width: 100%; } } } } .article_box{ margin: 0 10px 50px; .lfcontent,.rfimgbox{ width: auto; max-width: 100%; float: none; } .lfcontent p{ font-size: 14px; } h1{ font-size: 20px; } .rfimgbox{ text-align: center; } } .sy_index_f2{ padding-top: 106px; } .sy_index_f2 .lf_item{ text-align: center; padding-top: 0; } .sy_index_f2 .lf_item,.sy_index_f2 .rf_item{ float: none; width: 95%; margin: 0 auto; } .sy_index_f2 .f2_tb tr td:first-child{ } .sy_index_f3 .indexf3boxlf{ text-align: center; padding-left: 10px; padding-right: 10px; padding-bottom: 20px; } .sy_hotline{ padding-top: 30px; padding-bottom: 30px; } .sy_hotline,.if3title{ margin: 0 15px; } .sy_index_f2{ padding-top: 2.1rem; } .sy_index10_f5{ padding-top: 0; } } /*article3*/ .bigtitle2{ text-align: center; font-size: 30px; font-weight: bold; margin-bottom: 20px; span{ font-weight: normal; font-size: 14px; } } .gray_title{ max-width: 640px; margin: 0 auto; text-align: center; padding: 66px 0; background: #f1f1f1; font-size: 43px; } .page{ text-align: center; a{ display: inline-block; font-size: 14px; padding: 10px 8px; color: #6a4064; border: 1px solid #edede5; } .active{ color: #333; background: #edede5; } } .fz11 { font-size: 11px !important; } .post { padding-top: 1em; padding-bottom: 1em; margin-bottom: 2em; p { margin-bottom: 1.6em; line-height: 1.6; } } /* #mailform ----------------------- */ #mailform { max-width: 730px; margin: 0 auto; h1 { margin: 0 0 20px; } .txt { margin: 0 0 25px; padding: 0 20px; } .formWrap { padding: 10px; background: url(../img/bg_ptn04.png); } .form { padding: 16px 27px 40px; border: 1px solid #dfdfdf; background: #fff; } .form table { width: 100%; margin: 0 0 20px; border-collapse: collapse; border-spacing: 0; border: 0; padding: 0; border: 0; outline: 0; // font-size: 100%; // vertical-align: bottom; // background: transparent; } .form th, .form td { border-bottom: 1px dotted #c0c0c0; font-size: 14px; text-align: left; } .form th { width: 30%; padding: 18px 0 16px; font-weight: bold; vertical-align: top; line-height: 1.5; } .form th .cellIn { position: relative; padding: 0 95px 0 0; } .form th .cellIn span { position: absolute; top: 0; right: 40px; display: block; width: 42px; height: 17px; text-indent: 100%; white-space: nowrap; overflow: hidden; } .form th .cellIn span.required { background: url(../img/label_mailform01.gif) no-repeat; } .form th .cellIn span.option { background: url(../img/label_mailform02.gif) no-repeat; } .form td { padding: 13px 0 12px; vertical-align: middle; } .form td .wpcf7-form-control-wrap { // display: inline-block; } .form td input[type="text"], .form td input[type="tel"], .form td input[type="email"], .form td textarea, .form td select { display: inline-block; width: 95%; margin: 0; padding: 5px 4px 2px; border: none; border: 1px solid #dfdfdf; background: none; background: #fff; box-shadow: none; box-shadow: inset 0 2px 2px #e9e9e9; font-size: 14px; line-height: 1.5; } .form td input[type="text"].your-post { // width: 140px; margin: 0 0 6px; } .form td input[type="text"].your-address { // width: 531px; } .form td textarea { // width: 630px; } .form td select { width: auto; height: 30px; margin: 0 6px 0 0; } .form td input[type="radio"] { margin: -2px 0 0; -webkit-appearance: radio; } .form td .wpcf7-list-item { margin: 0; padding: 0 15px 0 0; } .form td input[type="text"].wpcf7c-conf, .form td input[type="tel"].wpcf7c-conf, .form td input[type="email"].wpcf7c-conf, .form td textarea.wpcf7c-conf, .form td select.wpcf7c-conf { background: #c2c2c2; color: #666; } .btns { text-align: center; } .btns input { position: relative; top: 0; display: inline-block; margin: 0 10px; padding: 11px 0 10px; width: 190px; border: 0; border-radius: 3px; outline: none; background-color: #278bc3; box-shadow: 0 3px rgba(0, 0, 0, .1); text-align: center; font-size: 14px; line-height: 1.5; color: #fff; -webkit-transition: all .1s linear; -moz-transition: all .1s linear; transition: all .1s linear; cursor: pointer; } .btns input.wpcf7-back { background: #c2c2c2; } .btns input:hover { top: 3px; box-shadow: none; } } @media (max-width: 767px) { .ibitem { .bottomcontent { height: auto; min-height: 180px; padding-bottom: 10px; } } #mailform .form th, #mailform .form td { display: block; width: 100%; } #news-list.index5_timeline { .date { width: 100%; display: block; font-size: 100%; // line-height: 1.5; // padding-top: 5px; } li .link { line-height: 1.2; display: block; width: 100%; } .timeline_list span { margin-right: 0; min-height: 17px; height: auto; } } } /* ========================================================= RESPONSIVE IMAGES ========================================================= */ .entry-content img, .comment-content img, .widget img { max-width: 100%; /* Fluid images for posts, comments, and widgets */ } img[class*="align"], img[class*="wp-image-"], img[class*="attachment-"] { height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ } img.size-full, img.size-large, img.header-image, img.wp-post-image { /*width: 100%;*/ max-width: 100%; height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ } /* Make sure videos and embeds fit their containers */ .page-content img.size-full, .page-content img.size-large, .page-content img.header-image, .page-content img.wp-post-image { width: 100%; } embed, iframe, object, video { max-width: 100%; width: 100%; } .entry-content .twitter-tweet-rendered { max-width: 100% !important; /* Override the Twitter embed fixed width */ } /* Images */ .alignleft { float: left; } .alignright { float: right; } .aligncenter { display: block; margin-left: auto; margin-right: auto; } .entry-content img, .comment-content img, .widget img, img.header-image, .author-avatar img, img.wp-post-image { /* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */ /*border-radius: 3px;*/ /* box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); */ } .wp-caption { max-width: 100%; /* Keep wide captions from overflowing their container. */ /*padding: 4px;*/ } .wp-caption .wp-caption-text, .gallery-caption, .entry-caption { font-style: italic; /*font-size: 12px; font-size: 0.857142857rem;*/ line-height: 2; color: #757575; /*display: none;*/ } img.wp-smiley, .rsswidget img { border: 0; border-radius: 0; box-shadow: none; margin-bottom: 0; margin-top: 0; padding: 0; } @media (max-width: 767px) { img.alignleft, img.alignright { float: none; display: block; margin: 1em auto; } } @media (min-width: 768px) { img.alignleft { margin: 12px 24px 12px 0; // margin: 0.857142857rem 1.714285714rem 0.857142857rem 0; } img.alignright { margin: 12px 0 12px 24px; // margin: 0.857142857rem 0 0.857142857rem 1.714285714rem; } img.aligncenter { margin-top: 12px; // margin-top: 0.857142857rem; margin-bottom: 12px; // margin-bottom: 0.857142857rem; } } /** * Accessibility */ /* Text meant only for screen readers */ .says, .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute !important; width: 1px; } /* must have higher specificity than alternative color schemes inline styles */ .site .skip-link { background-color: #f1f1f1; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.2); color: #21759b; display: block; font: bold 14px/normal "Noto Sans", sans-serif; left: -9999em; outline: none; padding: 15px 23px 14px; text-decoration: none; text-transform: none; top: -9999em; } .logged-in .site .skip-link { box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); font: bold 14px/normal "Open Sans", sans-serif; } .site .skip-link:focus { clip: auto; height: auto; left: 6px; top: 7px; width: auto; z-index: 100000; } .show_print { display: none; } @media print { @page { size: auto; /* auto is the initial value */ margin: 0; /* this affects the margin in the printer settings */ } body, *, .table-body-bdr>tbody>tr>th, .btn-danger { print-color-adjust: exact; -webkit-print-color-adjust: exact !important; } .show_print { display: block; } .show_print_inline { display: inline-block; } .content-header { display: block !important; } .breadcrumb, .pagination, .btn_print, .hidden_print, .table-column-setup { display: none; } a[href]:after { content: none !important; } .print_tb.table, .print_tb.table tr, .print_tb.table tr th, .print_tb.table tr td { font-size: 12px; } .print_tb.table tr th, .print_tb.table tr td, .print_tb.table > thead > tr > th, .print_tb.table > tbody > tr > th, .print_tb.table > tfoot > tr > th, .print_tb.table > thead > tr > td, .print_tb.table > tbody > tr > td, .print_tb.table > tfoot > tr > td { padding: 2px; } .table-data-print th, .table-data-print td { font-size: 11px !important; } .table-data-print thead th { font-size: 11px !important; width: 20px } .table-data-print thead tr th:first-child, .table-data-print tbody tr td:first-child { font-size: 11px !important; width: 20px !important; } .text-center, .title-center { text-align: center !important; } .main_header { position: absolute; } }