@font-face {font-family: "Satoshi";src: url("../fonts/Satoshi-Regular.otf")} /* "Cairo","Satoshi" */ *,html{ margin: 0px; padding: 0px; } html{ font-size: 62.5%; } body{ margin: 0px; padding: 0px; line-height: 100%; background:#fff; font-family: "Satoshi", MiSans, sans-serif; -webkit-text-size-adjust: none; position: relative; } h1,h2,h3,h4,h5,h6 { font-size: 1em; line-height: 100%; margin: 0px; padding: 0px; font-weight:normal; } article, aside, dialog, figure, footer, header, hgroup, menu, nav, address, section { display: block; } ::-moz-selection{ background: #000; color: #fff; } ::selection{ background: #000; color: #fff; } a, input, button { -webkit-touch-callout:none; -webkit-tap-highlight-color:rgba(0,0,0,0); cursor: pointer; } img { border: none; margin: 0px; padding: 0px; } hr{ display: none; } div.clear{ clear: both; height: 1px; } table { border-collapse: collapse; border-spacing: 0px; } /* new clearfix */ .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .i_reset{ font-size: 0px; line-height: 0; } * html .clearfix { zoom: 1; } /* IE6 */ *:first-child+html .clearfix { zoom: 1; } /* IE7 */ :focus{ outline: 0; } /*--------------------- Helper CSS -----------------------*/ .img-responsive{ width: 100%; height: auto; } .section-title { margin-bottom: 50px; text-align: center; } .section-title h2 { color: #737373; font-size: 36px; font-weight: 700; position: relative; } .section-title h2>p { color: #2767b6; font-size: 30px; font-weight: bold; position: relative; } .set-bg { background-repeat: no-repeat; background-size: cover; background-position: top center; } .spad { padding-top: 100px; padding-bottom: 100px; } .text-white h1, .text-white h2, .text-white h3, .text-white h4, .text-white h5, .text-white h6, .text-white p, .text-white span, .text-white li, .text-white a { color: #fff; } /* buttons */ .primary-btn { display: inline-block; font-size: 14px; padding: 10px 28px 10px; color: #ffffff; text-transform: uppercase; font-weight: 700; background: #0952a0; letter-spacing: 2px; } .badge-primary { color: #fff; background-color: #4c689a; } .site-btn { font-size: 14px; color: #ffffff; font-weight: 800; text-transform: uppercase; display: inline-block; padding: 13px 30px 12px; background: #0952a0; border: none; } /*--------------------- Header -----------------------*/ header{ -webkit-transition: all, 0.3s; -moz-transition: all, 0.3s; -ms-transition: all, 0.3s; -o-transition: all, 0.3s; transition: all, 0.3s; } .head-sticky{ padding-top: 72px; } .head-sticky header{ position: fixed; top:0; left: 0; height: 72px; right: 0; background: #fff; z-index: 99; } .head-sticky.over_hid header{ z-index: 1; } .header{ width: 100%; height: 72px; background: #fff; border-bottom: 4px solid #e6ecf0; z-index: 999; } .headerAreaContents { width: 1120px; height: 72px; margin: 0px auto; position: relative; } .headerArealogoArea { width: 244px; height: 72px; position: relative; border-bottom: 4px solid #4c689a; z-index: 9999; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .headerArealogoArea a { width: 244px; height: 28px; display: block; position: absolute; top: 22px; left: 0px; } .headerAreaMenu{ position: absolute; top: 0; left: 280px; } .headerAreaMenu ul, .headerLang ul{ list-style: none; } .headerAreaMenu ul li, .headerLang ul li{ line-height: 68px; float: left; font-size: 1.4rem; font-size: 14px; font-weight: 600; letter-spacing: 0.2px; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .headerAreaMenu ul li a, .headerLang ul li a{ display: inline-block; padding: 0px 12px; background: #fff; text-decoration: none; color: #111111; font-weight: bold; } .headerAreaMenu ul li.active a, .headerLang ul li.active a{ display: block; padding: 0px 12px; background: #f4f4f4; } .headerAreaMenu ul li.active a span { border-bottom: 2px solid #afafaf; padding-bottom: 2px; } .headerLang{ position: absolute; top: 0px; right: 0px; } /*--------------------- to-top -----------------------*/ .to-top{ display: inline-block; position: relative; overflow: hidden; width: 40px; height: 40px; line-height: 40px; text-align: center; background: #004973; color: #fff; border-radius: 4px; z-index:1; -webkit-transition: all, 0.3s; -moz-transition: all, 0.3s; -ms-transition: all, 0.3s; -o-transition: all, 0.3s; transition: all, 0.3s; } .to-top:hover{ background: #4c689a; } .to-top:hover span{ opacity: 0; } .to-top i{ position: absolute; left: 0; top: -1px; width: 40px; height: 40px; line-height: 40px; text-align: center; color:#fff; font-size: 2.2rem; font-size: 22px; -webkit-transition: all, 0.3s; -moz-transition: all, 0.3s; -ms-transition: all, 0.3s; -o-transition: all, 0.3s; transition: all, 0.3s; } .to-top:hover i{ bottom: 0; } /* Hero Banner */ .hero{ width: 100%; height: 786px; background: #2b2b2d; } .banner_item { width: 100%; height: 788px; } .banner_item_base{ background: url(../img/banner/banner01.jpg) no-repeat; background-position: center center; background-size: cover; } .banner_item_content { width: 1120px; margin: 0px auto; } .banner_item_content_base { width: 569px; margin: 330px 0px 0px 550px; float: left; } .banner_title1 { width: 569px; font-size: 4rem; color:#fff; line-height: 58px; margin: 0px auto; font-weight: bold; } .banner_title1 .banner_num{ font-size: 5rem; margin-right: 5px; } .banner_title1:before { width: 100%; height: 2px; display: block; content: ""; background: #fff; margin: 0px 0px 20px 0px; } .banner_title1:after { width: 100%; height: 2px; display: block; content: ""; background: #fff; margin: 20px 0px 0px 0px; } .banner_text1 { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #fff; font-weight: bold; letter-spacing: 0.2px; margin: 30px auto 0px auto; } .banner_button { display: inline-block; border-radius: 4px; border: 2px solid #fff; margin: 30px auto 0px auto; font-size: 1.8rem; font-size: 18px; line-height: 1.1; font-weight: bold; letter-spacing: 0.2px; vertical-align: middle; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .banner_button:hover{ /*border-color:#77a8ff;*/ background-color: #4c689a; } .banner_button a { display: block; padding: 18px 80px; color: #fff; text-decoration: none; position: relative; } .banner_button a:after { width: 22px; height: 22px; content: ""; display: inline-block; background: url(../img/arrow-right-white.png) no-repeat; background-size: 22px 22px; margin: -1px 8px 0px 0px; vertical-align: middle; position: absolute; right: 0px; } .productArea{ background: #e8e8e8; overflow: hidden; } .section_titleArea{ padding: 30px 0px; } .section_titleArea h2 { font-size: 2.0rem; font-size: 20px; line-height: 1.4; color: #111111; font-weight: bold; text-align: center; position: relative; } .section_titleArea h2:before { width: 36px; height: 1px; content: ""; background: #b3b3b3; display: inline-block; margin: 0px 20px 0px 0px; top: -7px; position: relative; } .section_titleArea h2:after { width: 36px; height: 1px; content: ""; background: #b3b3b3; display: inline-block; margin: 0px 0px 0px 20px; top: -7px; position: relative; } .section_titleArea p{ font-size: 1.2rem; font-size: 12px; line-height: 1.4; color: #b3b3b3; text-align: center; font-weight: bold; margin-bottom: 0; } .productArea_contents:before { height: 310px; content: ""; display: block; margin: 0px 200px 0px 0px; border-radius: 0px 4px 4px 0px; background: url(../img/index/product_bg.jpg) no-repeat; background-position: center center; background-size: cover; } .productArea_contentsInner { margin: -224px 0px 0px 0px; } .prodcut_readArea { width: 50%; float: left; text-align: right; } .prodcut_readAreaInner { width: 560px; margin: 0px 0px 0px auto; text-align: left; } .prodcut_title{ font-weight: bold; font-size: 2.6rem; font-size: 26px; line-height: 1.4; color: #fff; margin: 0px 0px 30px 0px; letter-spacing: 0.2px; } .prodcut_subtitle { width: 335px; font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #fff; text-align: left; letter-spacing: 0.2px; margin-bottom: 0; border-left:1px solid #bcc9d5; margin-left: 17px; padding-left: 10px; } .dp_pc { display: block; } .dp_mobile { display: none; } .prodcut_img { width: 539px; height: 318px; } .prodcut_linkArea { width: 50%; float: right; text-align: left; border-radius: 4px 0px 0px 4px; background: #fff; box-shadow: 0px 0px 3px 0px #cccccc; -moz-box-shadow: 0px 0px 3px 0px #cccccc; -webkit-box-shadow: 0px 0px 3px 0px #cccccc; } .prodcut_linkAreaInner { width: 560px; margin: 0px auto 0px 0px; text-align: left; } .prodcut_linkArea_navArea { padding: 30px 0px 40px 40px; } .prodcut_linkArea_nav { width: 320px; float: left; } .prodcut_linkArea_title { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; font-weight: bold; cursor: pointer; } .prodcut_linkArea_nav_list { list-style: none; border-top: 1px dotted #b4b4b4; margin: 14px 0px 0px 0px; display: block; } .prodcut_linkArea_nav_list li { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; border-bottom: 1px dotted #b4b4b4; } .prodcut_linkArea_nav_list li a { color: #0b3c58; text-decoration: none; padding: 8px 0px; display: block; position: relative; } .prodcut_linkArea_nav_list li a:before { width: 16px; height: 16px; content: ""; display: inline-block; background: url(../img/arrow-right.png) no-repeat; background-size: 16px 16px; margin: -3px 6px 0px 0px; vertical-align: middle; } .prodcut_linkArea_nav_list-type1 { width: 150px; float: left; } .prodcut_linkArea_nav_list-type2 { width: 150px; float: right; } .prodcut_linkArea_nav2 { width: 180px; float: right; } .prodcut_button { margin: 0px 0px 40px 40px; border-radius: 4px; background: #004973; font-size: 1.6rem; font-size: 16px; line-height: 1.5; font-weight: bold; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .prodcut_button a { display: block; color: #fff; text-decoration: none; padding: 14px 0px 14px 0px; text-align: center; position: relative; font-size: 1.6rem; font-size: 16px; line-height: 1.5; font-weight: bold; } .prodcut_button a:after { width: 22px; height: 22px; content: ""; display: inline-block; background: url(../img/arrow-right-white.png) no-repeat; background-size: 22px 22px; margin: 0px 14px 0px 0px; vertical-align: middle; position: absolute; right: 0px; } .solserviceArea{ background: #fff; } .solservice_title { font-weight: bold; font-size: 2.6rem; font-size: 26px; line-height: 1.4; color: #004973; margin: 20px 0px 30px 0px; letter-spacing: 0.2px; text-align: center; } .solservice_text { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; margin: 0px 0px 0px 0px; text-align: center; } .solservice_linkArea{ margin: 100px 0px 0px 0px; } .solservice_solArea { width: 50%; float: left; background: #c2cdd3; padding: 0px 0px 40px 0px; position: relative; } .solservice_solArea:before { width: 66px; height: 12px; background: #fff; content: ""; display: block; position: absolute; top: 60px; right: -33px; z-index: 90; } .solservice_solAreaInner { width: 540px; margin: -70px 20px 0px auto; border-radius: 4px; background: #fff; box-shadow: 0px 0px 3px 0px #8e8e8e; -moz-box-shadow: 0px 0px 3px 0px #8e8e8e; -webkit-box-shadow: 0px 0px 3px 0px #8e8e8e; } .solservice_image { width: 540px; height: auto; } .solservice_image img { border-radius: 4px 4px 0px 0px; } .solservice_subtitle { font-size: 1.8rem; font-size: 18px; line-height: 1.8; color: #111111; letter-spacing: 0.2px; margin: 0px 40px 2px 40px; font-weight: bold; } .solservice_info { font-size: 1.4rem; font-size: 14px; line-height: 1.7; color: #2d3134; letter-spacing: 0.2px; margin: 0px 40px 0px 40px; padding: 0px 0px 20px 0px; } .solservice_serviceArea { width: 50%; float: right; background: #dbe0e3; padding: 0px 0px 40px 0px; position: relative; } .solservice_serviceArea:before { width: 12px; height: 66px; background: #fff; content: ""; display: block; position: absolute; top: 33px; left: -6px; z-index: 90; } .solservice_serviceAreaInner { width: 540px; margin: -70px auto 0px 20px; border-radius: 4px; background: #fff; box-shadow: 0px 0px 3px 0px #8e8e8e; -moz-box-shadow: 0px 0px 3px 0px #8e8e8e; -webkit-box-shadow: 0px 0px 3px 0px #8e8e8e; } .solservice_buttonArea { width: 100%; height: 100px; position: relative; } .solservice_buttonArea:before { width: 50%; height: 100px; background: #c2cdd3; content: ""; display: block; position: absolute; top: 0px; left: 0px; } .solservice_buttonArea:after { width: 50%; height: 100px; background: #dbe0e3; content: ""; display: block; position: absolute; top: 0px; right: 0px; } .solservice_button { width: 400px; display: block; margin: 0px auto 60px auto; position: relative; z-index: 90; border-radius: 4px; background: #004973; font-size: 1.6rem; font-size: 16px; line-height: 1.5; font-weight: bold; } .solservice_button a { display: block; color: #fff; text-decoration: none; padding: 14px 0px 14px 0px; text-align: center; position: relative; } .solservice_button a:after { width: 22px; height: 22px; content: ""; display: inline-block; background: url(../img/arrow-right-white.png) no-repeat; background-size: 22px 22px; margin: 0px 14px 0px 0px; vertical-align: middle; position: absolute; right: 0px; } .pc-wh{ color:#fff!important; } .companyArea{ background: url("../img/index/factory.jpg") no-repeat; background-position: center center; background-size: cover; } .section_titleArea h2.pc-wh:before, .section_titleArea h2.pc-wh:after { background: #fff; } .company_linkArea{ width: 1120px; margin: 0px auto; padding: 0px 0px 70px 0px; overflow: hidden; } .company_linkAreaInner{ width: 500px; float: right; } .company_title{ font-weight: bold; font-size: 2.6rem; font-size: 26px; line-height: 1.4; color: #fff; margin: 20px 0px 30px 0px; letter-spacing: 0.2px; } .company_text{ font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #fff; letter-spacing: 0.2px; margin: 0px 0px 30px 0px; } .company_button { width: 430px; display: block; margin: 0; position: relative; z-index: 90; border-radius: 4px; background: #004973; font-size: 1.6rem; font-size: 16px; line-height: 1.5; font-weight: bold; } .company_button a { display: block; color: #fff; text-decoration: none; padding: 14px 0px 14px 0px; text-align: center; position: relative; } .company_button a:after { width: 22px; height: 22px; content: ""; display: inline-block; background: url(../img/arrow-right-white.png) no-repeat; background-size: 22px 22px; margin: 0px 14px 0px 0px; vertical-align: middle; position: absolute; right: 0px; } .newsArea{ background: #fff; text-align: center; padding: 0px 0px 50px 0px; } .n-listTable { width: 1120px; margin: 0px auto 20px auto; border-top: 1px solid #e7e7e7; text-align: left; border-collapse: collapse; border-spacing: 0px; } .n-listTable tr th { border-bottom: 1px solid #e7e7e7; text-align: left; width: 140px; font-size: 1.4rem; font-size: 14px; line-height: 1.5; color: #2d3134; padding: 14px 0px; cursor: pointer; } .n-listTable tr td { border-bottom: 1px solid #e7e7e7; text-align: left; font-size: 1.4rem; font-size: 14px; line-height: 1.5; color: #0b3c58; padding: 14px 0px; position: relative; cursor: pointer; } .n-listTable tr td p{ transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .n-listTable tr td:after { width: 8px; height: 13px; background: url(../img/arrow-right2.png) no-repeat; background-size: 8px 13px; content: ""; display: block; position: absolute; right: 0px; top: 0; bottom: 0; margin: auto; } .n-listTable tr:hover td p a{ opacity: .6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; -khtml-opacity: .6; -moz-opacity: .6; } .n-listTable tr td p a{ text-decoration: none; color: #0b3c58; display: block; } .news_button { font-size: 1.4rem; font-size: 14px; line-height: 1.5; font-weight: bold; display: inline-block; border-radius: 4px; border: 2px solid #0b3c58; position: relative; } .news_button a { display: block; color: #0b3c58; text-decoration: none; padding: 10px 40px 10px 20px; text-align: center; position: relative; } .news_button a:before { width: 8px; height: 13px; background: url(../img/arrow-right2.png) no-repeat; background-size: 8px 13px; content: ""; display: block; position: absolute; right: 10px; top: 0; bottom: 0; margin: auto; } .footer{ width: 100%; background: #232b33; position: relative; } .footer a{ transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .footer a:hover{ opacity: .6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; -khtml-opacity: .6; -moz-opacity: .6; } .footerAreaContents{ width: 1120px; margin: 0px auto; padding: 60px 0px 0px; position: relative; } .footer_companyInfo { width: 142px; text-align: center; float: left; } .footer_companyInfo p{ width: 142px; } .footer_navInfo { width: 880px; float: right; } .footer_nav { float: left; } .footer_nav_link{ width: 170px; } .footer_nav_contact{ width: 370px; } .footer_nav_other{ width: 160px; } .footer_nav_title { font-size: 1.4rem; font-size: 14px; line-height: 1.5; font-weight: bold; letter-spacing: 0.2px; color:#fff; } .footer_nav_title a{ color: #fff; text-decoration: none; } .footer_nav_list{ list-style: none; margin: 10px 0px 10px 0px; } .footer_nav_list li { font-size: 1.3rem; font-size: 13px; line-height: 2.4; letter-spacing: 0.2px; } .footer_nav_list li a { color: #bdc8d4; text-decoration: none; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .footer_nav_list li a:before { width: 6px; height: 10px; content: ""; display: inline-block; background: url(../img/arrow-right-footer.png) no-repeat; background-size: 6px 10px; margin: 0px 4px 0px 0px; } .footer_nav_contact .footer_nav_list li{ color:#fff; } .footer_nav_contact .footer_nav_list li a:before{ display: none; } .footer_nav_list .nav_icon i{ width: 24px; height: 24px; line-height: 24px; margin-right: 6px; text-align: center; border-radius: 50%; border: 1px solid #fff; } .footer_nav_list .nav_item{ padding-left: 30px; } .footer_douyin{ margin-top: 20px; } .footer_nav_other .footer_nav_title{ width: 142px; text-align: center; } .footer_copyright{ border-top: 1px solid #373737; margin: 20px 0 0; overflow: hidden; color:#bdc8d4; font-size: 1.3rem; font-size: 13px; line-height: 2.4; letter-spacing: 0.2px; padding: 5px 0; } .footer_copyright a{ color:#bdc8d4; float:right; text-decoration: none; } .dm-contentsArea { } .dm-pageTitleArea { width: 100%; position: relative; } .dm-pageTitleArea--pageIndex { height: 440px; } .dm-pageTitleArea--pageHierarchy{ height:300px; } .p-pageTitle--pageHierarchy{ padding-top: 120px; } .dm-pageTitleArea--product { background: url(../img/banner/productIndex-bg.jpg) no-repeat; background-position: center top; background-size: cover; } .dm-pageTitleArea--news{ background: url(../img/banner/newsIndex-bg.jpg) no-repeat; background-position: center top; background-size: cover; } .dm-pageTitleArea--case { background: url(../img/banner/caseIndex-bg.jpg) no-repeat; background-position: center center; background-size: cover; } .dm-pageTitleArea--contact{ background: url(../img/banner/contact-bg.jpg) no-repeat; background-position: center top; background-size: cover; } .dm-pageTitleArea--about{ background: url(../img/banner/about-bg.jpg) no-repeat; background-position: center top; background-size: cover; } .dm-pageTitleAreaInner { width: 100%; height: 100%; background: rgba(0,0,0, 0.25); } .p-pageTitle { font-size: 2.8rem; font-size: 28px; line-height: 1.4; color: #fff; font-weight: bold; text-align: center; } .p-pageTitle--index{ padding: 200px 0px 0px 0px; } .p-pageTitle_eng { font-size: 1.2rem; font-size: 12px; line-height: 1.4; color: #b3b3b3; font-weight: bold; text-align: center; } .p-pkArea { width: 100%; position: absolute; } .p-pkArea--index { bottom: 66px; } .p-pkAreaInner { width: 1120px; margin: 0px auto; } .p-pkArea nav ul { list-style: none; } .p-pkArea nav ul li { float: left; font-size: 1.2rem; font-size: 12px; line-height: 1.4; position: relative; color: #fff; padding: 0px 10px 0px 0px; } .p-pkArea nav ul li a { text-decoration: none; } .p-pkArea nav ul li a span { color: #fff; border-bottom: 1px solid #fff; text-decoration: none; } .p-pkArea nav ul li:before { width: 6px; height: 10px; background: url(../img/arrow-right2-white.png) no-repeat; background-size: 6px 10px; content: ""; display: inline-block; margin: 0px 10px 0px 0px; opacity: .6; filter: alpha(opacity=60); -ms-filter: "alpha(opacity=60)"; -khtml-opacity: .6; -moz-opacity: .6; } .p-pkArea nav ul li:first-child:before{ display: none; } .p-pagenaviArea { width: 100%; height: 46px; background: rgba(0,0,0, 0.7); position: absolute; bottom: 0px; } .p-pagenaviAreaInner { width: 1120px; height: 46px; margin: 0px auto; } .p-pagenaviArea nav p { font-size: 1.4rem; font-size: 14px; line-height: 46px; color: #111111; font-weight: bold; background: #fff; display: inline-block; float: left; } .p-pagenaviArea nav p a { display: block; padding: 0px 20px; text-decoration: none; color: #fff; background: #2e2e2e; } .p-pagenaviArea nav p.active a { color: #111111; background: #fff; } .p-pagenaviArea nav ul { float: left; list-style: none; } .p-pagenaviArea nav ul li { font-size: 1.4rem; font-size: 14px; line-height: 46px; color: #111111; font-weight: bold; float: left; display: inline-block; border-left: 1px solid #e4e4e4; } .p-pagenaviArea nav ul li a { display: block; padding: 0px 20px; text-decoration: none; color: #004973; background: #f6f6f6; position: relative; } .p-pagenaviArea nav ul li a:before { width: 16px; height: 16px; content: ""; display: inline-block; background: url(../img/arrow-right.png) no-repeat; background-size: 16px 16px; margin: -3px 6px 0px 0px; vertical-align: middle; } .p-pagenaviArea nav ul li.active a { color: #111111; background: #ffffff; } .p-pagenaviArea nav ul li.active a:before { background-image: url(../img/arrow-down.png); } .pageProductIndex_pagelistArea{ width: 100%; background: #f6f6f6; } .pageProductIndex_pagelistAreaInner{ width: 1200px; margin: 0px auto; padding: 0px 0px 40px 0px; } .pageProductIndex__titleArea1{ text-align: center; padding: 46px 10px; } .pageProductIndex__titleArea1 h2{ display: inline-block; margin: 0px auto 0px auto; position: relative; font-size: 2rem; font-size: 20px; line-height: 1.7; color: #110f0e; letter-spacing: 0.2px; font-weight: bold; } .pageProductIndex__titleArea1 h2:after{ width: 100%; height: 4px; content: ""; display: block; background: #004973; } .pageProductIndex__titleArea2{ width: 1120px; margin: 0px auto; border-bottom: 1px solid #dedede; padding: 0px 0px 10px 0px; } .pageProductIndex__titleArea2 h3{ float: left; padding: 0px 20px 0px 0px; font-size: 1.6rem; font-size: 16px; line-height: 1.7; color: #110f0e; letter-spacing: 0.2px; font-weight: bold; } .pageProductIndex__titleArea2 p{ font-size: 1.4rem; font-size: 14px; line-height: 2; color: #110f0e; letter-spacing: 0.2px; } .pageProductIndex_pagelist{ margin: 0px 0px 0px 40px; padding: 44px 0px 44px 0px; } .pageProductIndex_boxArea{ width: 284px; float: left; padding: 0px 0px 40px 0px; } .pageProductIndex_box{ width: 270px; } .pageProductIndex_box_image{ width: 268px; background: #fff; border: 1px solid #fff; border-radius: 4px; } .pageProductIndex_box_image img{ border-radius: 4px; box-shadow:0px 0px 3px 0px #cccccc; -moz-box-shadow:0px 0px 3px 0px #cccccc; -webkit-box-shadow:0px 0px 3px 0px #cccccc; } .pageProductIndex_box_linktext{ font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; margin: 8px 0px 0px 0px; font-weight: bold; } .pageProductIndex_box a{ text-decoration: none; } .pageProductIndex_box_linktext:before{ width: 16px; height: 16px; content: ""; display: inline-block; background: url("../img/arrow-right.png") no-repeat; background-size: 16px 16px; margin: -3px 6px 0px 0px; vertical-align: middle; } .pageProductIndex_box a:hover .pageProductIndex_box_image{ border: 1px solid #004973; } .pageProductIndex_box a:hover .pageProductIndex_box_linktext span{ color: #37799f; } .pageHierarchyIndex_area{ width: 100%; background: #fff; padding: 0px 0px 40px 0px; } .p-hierarchyPageTitleArea { text-align: center; padding: 50px 0px 50px 0px; } .p-hierarchyPageTitle { font-size: 2.4rem; font-size: 24px; line-height: 1.4; color: #111111; font-weight: bold; text-align: center; } .p-hierarchyPageTitle:before, .p-hierarchyPageTitle:after { width: 36px; height: 1px; content: ""; background: #b3b3b3; display: inline-block; margin: 0px 20px 0px 0px; top: -7px; position: relative; } .p-hierarchyPageTitle:after { margin: 0px 0px 0px 20px; } .product__pagination, .blog__pagination { padding-top: 10px; } .product__pagination a, .blog__pagination a { display: inline-block; width: 30px; height: 30px; border: 1px solid #e6e6e6; font-size: 14px; color: #808080; font-weight: 700; line-height: 28px; text-align: center; margin-right: 16px; border-radius: 4px; -webkit-transition: all, 0.3s; -moz-transition: all, 0.3s; -ms-transition: all, 0.3s; -o-transition: all, 0.3s; transition: all, 0.3s; text-decoration:none; } .product__pagination a:hover, .product__pagination a.active, .blog__pagination a:hover, .blog__pagination a.active { background: #004973; border-color: #004973; color: #ffffff; } .product__pagination a:last-child, .blog__pagination a:last-child { margin-right: 0; } .pageNewsBoxArera { width: 900px; margin: 0px auto 0px auto; padding: 40px 0px 0px 0px; } .pageNewsBoxAreraInner { width: 900px; padding: 0px 0px 20px 0px; } .pageNewsBoxArera__title { font-size: 2.4rem; font-size: 24px; line-height: 1.8; color: #111; font-weight: bold; letter-spacing: 0.2px; padding-bottom: 20px; text-align: center; } .pageNewsBoxArera__day { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #4c4c4c; letter-spacing: 0.2px; padding-bottom: 20px; margin: 0 60px 20px; border-bottom: 1px solid #d9d9d9; text-align: center; } .pageNewsBoxArera__inputArea { padding: 0px 60px; } .pageNewsBoxArera__inputAreaInner { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #4c4c4c; letter-spacing: 0.2px; line-height: 1.6; } .pageNewsBoxArera__inputAreaInner a{ color: #4c4c4c; } .pageNewsBoxArera__inputAreaInner img{ margin-top: 10px; } .p-hierarchyBackButtonArea { text-align: center; padding: 0px 0px 60px 0px; background: #fff; margin: -1px 0px 0px 0px; display: block; } .p-hierarchyBackButton { margin: 0px auto; } .p-button-type3 { font-size: 1.4rem; font-size: 14px; line-height: 1.5; font-weight: bold; display: inline-block; border-radius: 4px; border: 2px solid #0b3c58; position: relative; } .p-button-type3:hover { border: 2px solid #f0f0f0; } .p-button-type3 a { display: block; color: #0b3c58; text-decoration: none; padding: 10px 20px 10px 40px; text-align: center; position: relative; } .p-button-type3 a:before { width: 8px; height: 13px; background: url(../img/arrow-left.png) no-repeat; background-size: 8px 13px; content: ""; display: block; position: absolute; left: 10px; top: 0; bottom: 0; margin: auto; } .pageHierarchyContact_area { width: 100%; background: #fff; padding: 50px 0px 120px 0px; } .pageHierarchyIndex_areaInner { width: 900px; margin: 0px auto; } .pageContact__text { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; font-weight: bold; } .pageContact__list { margin: 20px 0px 0px 1.7em; } .pageContact__list li { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; } .pageContact__actionArea { border-left: 1px dotted #d9d9d9; border-right: 1px dotted #d9d9d9; margin: 30px 0px 0px 0px; } .pageContact__actionAreaType1 { width: 33%; float: left; } .pageContact__actionAreaType2 { width: 34%; float: left; } .pageContact__actionAreaType3 { width: 33%; float: left; } .pageContact__actionAreaBox { padding: 0px 16px; text-align: center; } .pageContact__actionAreaType2 .pageContact__actionAreaBox { border-left: 1px dotted #d9d9d9; border-right: 1px dotted #d9d9d9; } .pageContact__title { font-size: 1.6rem; font-size: 16px; line-height: 1.4; color: #2d3134; letter-spacing: 0.2px; background: #f5f5f5; font-weight: bold; border-radius: 4px; margin: 0px 0px 0px 0px; padding: 10px 14px; } .pageContact__tel { font-size: 3.4rem; font-size: 34px; line-height: 1.4; color: #004973; letter-spacing: 0.4px; font-weight: bold; border-radius: 4px; margin: 20px 0px 0px 0px; font-family: Helvetica; } .pageContact__mail { font-size: 1.4rem; font-size: 14px; line-height: 1.4; color: #004973; letter-spacing: 0.4px; font-weight: bold; border-radius: 4px; margin: 10px 0px 0px 0px; } .pageContact__mail a, .pageContact__tel a { color: #004973; text-decoration: none; } .pageHierarchyForm_area { width: 100%; background: #f6f6f6; padding: 0px 0px 120px 0px; } .pageHierarchyForm_areaInner { width: 900px; margin: 0px auto; } .pageHierarchyForm__titleArea { text-align: center; padding: 46px 10px; } .pageHierarchyForm__titleArea h2 { display: inline-block; margin: 0px auto 0px auto; position: relative; font-size: 2rem; font-size: 20px; line-height: 1.7; color: #110f0e; letter-spacing: 0.2px; font-weight: bold; } .pageHierarchyForm__titleArea h2:after { width: 100%; height: 4px; content: ""; display: block; background: #004973; } .pageContact__text2 { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; margin: 20px 0px 0px 0px; } .pageHierarchyFormBox { border-radius: 6px; background: #fff; box-shadow: 0px 0px 3px 0px #cccccc; -moz-box-shadow: 0px 0px 3px 0px #cccccc; -webkit-box-shadow: 0px 0px 3px 0px #cccccc; } .pageHierarchyFormBox table { width: 100%; } .pageHierarchyFormBox table tr th { padding: 30px 60px; font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; text-align: left; font-weight: bold; vertical-align: top; border-bottom: 1px dotted #d9d9d9; width: 30%; } .pageHierarchyFormBox table tr th span { color: #c7121d; font-weight: normal; } .pageHierarchyFormBox table tr td { padding: 30px 60px 30px 0px; font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; text-align: left; vertical-align: top; border-bottom: 1px dotted #d9d9d9; } .pageHierarchyFormBox table tr td textarea { border-radius: 4px; background: #ecf2f6; border: none; padding: 10px 14px; width: 90%; height: 120px; font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; border: 1px solid #ecf2f6; } .pageHierarchyFormBox table tr td input{ font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; border-radius: 4px; background: #ecf2f6; border: none; padding: 10px 14px; width: 60%; border: 1px solid #ecf2f6; } .sendButton { text-align: center; padding: 30px; vertical-align: middle; } .checkBtn { padding: 12px 25px; background: #004973; border: none; border-radius: 4px; font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #fff; font-weight: bold; margin: 0px 10px; position: relative; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .checkBtn:hover { background: #002d47; } .pageCompanyPhilosophy__boxArea--mission { background: url(../img/mission_bg.jpg) no-repeat; background-position: center center; background-size: cover; } .pageCompanyPhilosophy__boxArea--vision { background: url(../img/vision_bg.jpg) no-repeat; background-position: center center; background-size: cover; } .pageCompanyPhilosophy__boxArea--values { background: url(../img/values_bg.jpg) no-repeat; background-position: center center; background-size: cover; } .pageCompanyPhilosophy__boxAreaInner { width: 590px; margin: 0px auto; padding: 100px 0px 130px 0px; text-align: center; } .pageCompanyPhilosophy__title1 { font-size: 3.0rem; font-size: 30px; line-height: 1.1; color: #4c689a; letter-spacing: 0.2px; font-family: Helvetica; font-weight: bold; position: relative; } .pageCompanyPhilosophy__title1:after { width: 40px; height: 4px; background: #4c689a; content: ""; display: block; margin: 10px auto 0px auto; } .pageCompanyPhilosophy__title2 { font-size: 1.6rem; font-size: 16px; line-height: 1.1; color: #fff; letter-spacing: 0.2px; font-weight: bold; position: relative; background: #111; display: inline-block; padding: 4px 10px; margin: 20px auto 0px auto; } .pageCompanyPhilosophy__title3 { font-size: 2.4rem; font-size: 24px; line-height: 1.6; color: #111; letter-spacing: 0.2px; font-weight: bold; position: relative; margin: 30px auto 0px auto; } .pageCompanyPhilosophy__text1 { font-size: 1.6rem; font-size: 16px; line-height: 2; color: #2d3134; letter-spacing: 0.2px; position: relative; margin: 30px auto 0px auto; text-align: left; float: left; } .pageProductIndex_visualArea { width: 100%; background: #fff; } .pageProductIndex_visualAreaInner { width: 1120px; margin: 0px auto; text-align: left; padding: 100px 0px 70px 0px; } .pageProductIndex_visualImageArea { width: 560px; float: left; } .pageProductIndex_visualArea__obj_movie { width: 560px; height: 351px; margin: 0px auto 0px auto; position: relative; background: #000; border-radius: 4px; } .pageProductIndex_visualArea__obj_movie a { z-index: 999; display: block; } .pageProductIndex_visualArea__obj_movie a::before { width: 100px; height: 100px; content: ""; display: block; border-radius: 50%; background: #4c689a; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; position: absolute; top: 0; bottom: 0; right: 0; left: 0; letter-spacing: 0; margin: auto; opacity: 0.7; z-index: 99; } .pageProductIndex_visualArea__obj_movie img { border-radius: 4px; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; z-index: 91; } .pageProductIndex_visualArea__obj_movie:hover img { opacity: 0.5; } .pageProductIndex_visualArea__obj_movie a::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 16px 0px 16px 28px; border-color: transparent transparent transparent #fff; display: block; position: absolute; position: absolute; top: 0; bottom: 0; right: -10px; left: 0; margin: auto; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; z-index: 999; } .pageProductIndex_visualBodyArea { width: 516px; float: right; } .pageProductIndex_visual__title1 { font-weight: bold; font-size: 4.0rem; font-size: 40px; line-height: 1.4; color: #111111; letter-spacing: 0.2px; margin: 0px 0px 0px -14px; } .pageProductIndex_visual__text1 { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; margin: 28px auto 0px auto; } .pageProductPageList { width: 1120px; margin: 0px auto; text-align: center; padding: 46px 0px 0px 0px; } .pageProductPageList ul { list-style: none; } .pageProductPageList ul li { display: inline; margin: 0px 20px; font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; font-weight: bold; } .pageProductPageList ul li a { color: #004973; text-decoration: none; } .pageProductPageList ul li.active a span { border-bottom: 2px solid #afafaf; padding-bottom: 2px; color: #959595; } .pageProductPageArea_bottomArea { width: 100%; margin: 0px auto; text-align: center; padding: 0px 0px 46px 0px; background: #ffffff; } .p-hierarchyNaviArea { display: none; } .pageProductPageItemArea { width: 100%; background: url(../img/pro_hero_bg.png) center center no-repeat; background-size: cover; } .pageProductPageItemArea__boxArea { padding: 60px 0px; } .pageProductPageItemArea__boxAreaInner { width: 1120px; margin: 0px auto; } .pageProductPageItemArea__image { max-width: 1120px; margin: 0px auto; } .pageProductPageItemArea__body__title { font-size: 2.4rem; font-size: 24px; line-height: 1.8; letter-spacing: 0.2px; font-weight: bold; } .pageProductPageItemArea__body__features{ font-size: 1.6rem; font-size: 16px; line-height: 1.8; letter-spacing: 0.2px; color:#666; } .pageProductPageItemArea__body__features span{ display: inline-block; position: relative; padding-left: 20px; } .pageProductPageItemArea__body__features span::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 6px 0px 6px 10px; border-color: transparent transparent transparent #333; display: block; position: absolute; position: absolute; top: -1px; bottom: 0; left: 0; margin: auto; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; z-index: 9; } .pageProductPageItemArea__body__features ul li{ display: inline-block; margin-left: 6px; padding-left: 10px; position: relative; } .pageProductPageItemArea__body__features ul li::after{ content: ""; position: absolute; width: 4px; height: 4px; background-color: #666; border-radius: 2px; left: 0; top:50%; margin-top: -2px; } .pageProductPageItemArea__moreTableInner{ margin: 0 auto; width: 960px; } .pageProductPageItemArea__moreTable { width: 100%; border-bottom: 1px solid #d6d6da; } .pageProductPageItemArea__moreTable tr th.type2 { font-size: 1.3rem; font-size: 13px; line-height: 1.6; letter-spacing: 0.2px; padding: 10px; color: #2d3134; text-align: center; background: #fbfcfd; font-weight: normal; border-top: 1px solid #d6d6da; border-right: 1px solid #d6d6da; border-left: 1px solid #d6d6da; width: 300px; } .pageProductPageItemArea__moreTable tr td.type1 { font-size: 1.3rem; font-size: 13px; line-height: 1.6; letter-spacing: 0.2px; padding: 10px; color: #2d3134; text-align: center; font-weight: normal; border-top: 1px solid #d6d6da; border-right: 1px solid #d6d6da; } .pageProductPageFEArea{ width: 100%; background: url(../img/pro_features_bg.png) center center no-repeat; background-size: cover; margin: 60px 0 20px; padding: 60px 0; } .pageProductPageFEArea__boxAreaInner{ width: 1120px; margin: 0px auto; overflow: hidden; } .pageProductPageFEArea__body { width: 400px; text-align: left; float:left; padding-top: 80px; } .pageProductPageFEArea__image{ width: 660px; float: right; } .pageProductPageFEArea__body__title{ font-size: 2.8rem; font-size: 28px; line-height: 1.6; color: #110f0e; letter-spacing: 0.2px; font-weight: bold; border-radius: 3px; padding: 2px 0px; display: block; margin: 0px 0px 20px 0px; width: 300px; background: url(../img/pro_fetit_bg.png) right center no-repeat; } .pageProductPageItemArea__body__list { list-style: none; } .pageProductPageItemArea__body__list li { font-size: 1.4rem; font-size: 14px; line-height: 1.6; color: #2d3134; letter-spacing: 0.2px; margin: 10px 0px 20px 0px; position: relative; padding-left:15px; } .pageProductPageItemArea__body__list li::after{ content: ""; position: absolute; width: 5px; height: 5px; background-color: #333; transform: rotate(45deg); left: 1px; top:8px; } .pageProductPageApplyArea__boxArea{ width: 1200px; margin: 0px auto; overflow: hidden; } .pageProductIndex__titleArea1 span{ display: inline-block; width: 30px; height: 0px; position: relative; } .pageProductIndex__titleArea1 span:after{ content: ""; position: absolute; width: 5px; height: 5px; background-color: #333; transform: rotate(45deg); left: 12px; top:-9px; } .pageApplyIndex_pagelist { margin: 0px 0px 0px 40px; padding: 20px 0; } .pageApplyIndex_boxArea { width: 380px; float: left; padding: 0px 0px 40px 0px; } .pageApplyIndex_box { width: 358px; } .pageApplyIndex_box a { text-decoration: none; } .pageApplyIndex_box_image { position: relative; width: 356px; border: 1px solid #fff; border-radius: 4px; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .pageApplyIndex_box_image img { border-radius: 4px; box-shadow: 0px 0px 3px 0px #cccccc; -moz-box-shadow: 0px 0px 3px 0px #cccccc; -webkit-box-shadow: 0px 0px 3px 0px #cccccc; } .pageApplyIndex_box_linktext { font-size: 1.4rem; font-size: 14px; line-height: 1.8; color: #2d3134; letter-spacing: 0.2px; margin: 8px 0px 0px 0px; font-weight: bold; text-align: center; min-height: 52px; } .pageApplyIndex_box_title{ position: absolute; height: 36px; line-height: 36px; font-size: 2.4rem; font-size: 24px; color: #fff; left: 0; right: 0; text-align: center; top:50%; margin-top: -18px; display: block; } .pageProductPageDemoArea{ width: 100%; background: url(../img/pro_demo_bg.png) center center no-repeat; background-size: cover; padding: 20px 0; } .pageDemoIndex_boxArea{ width: 284px; float: left; padding: 0px 0px 40px 0px; } .pageDemoIndex_box { width: 270px; } .pageDemoIndex_box a{ text-decoration: none; } .pageDemoIndex_box_image { width: 268px; background: #fff; border: 1px solid #fff; border-radius: 4px; } .pageDemoIndex_box_image img { border-radius: 4px; box-shadow: 0px 0px 3px 0px #cccccc; -moz-box-shadow: 0px 0px 3px 0px #cccccc; -webkit-box-shadow: 0px 0px 3px 0px #cccccc; } .pageDemoIndex_pagelist{ padding-bottom: 20px; margin:0px 0px 0px 40px; } .pageApplyIndex_pagelist .slick-dots{ bottom:10px; } .pageDemoIndex_pagelist .slick-dots li button:before, .pageApplyIndex_pagelist .slick-dots li button:before{ background:#d4d8d8; } .pageDemoIndex_pagelist .slick-dots li.slick-active button:before, .pageApplyIndex_pagelist .slick-dots li.slick-active button:before{ background:#4c689a; } .footer-nav-frist{ width:150px; } .footer-nav-second{ width:190px; } /*--------------------------------- Responsive Media Quaries -----------------------------*/ @media screen and (max-width: 768px){ #hero-full .slick-dots{ bottom:10px; } .headerAreaMenu { width: 100%; height: 100%; background: #fff; position: fixed; top: 0px; left: 0px; display: none; } .head-sticky header{ height: 46px; } .spMenu { position: fixed; top: 10px; right: 22px; width: 28px; height: 28px; z-index: 9999999; } .panelBtn { display: inline-block; position: relative; width: 26px; height: 26px; margin: 1px auto 0px auto; } .panelBtnIcon { display: block; position: absolute; top: 50%; left: 50%; width: 14px; height: 2px; margin: -1px 0 0 -6px; background: #11374c; transition: .2s; } .panelBtnIcon:before { margin-top: -6px; } .panelBtnIcon:after { margin-top: 4px; } .panelBtnIcon:before, .panelBtnIcon:after { display: block; content: ""; position: absolute; top: 49%; left: 0; width: 14px; height: 2px; background: #11374c; transition: .3s; } .panelBtn .open { background: transparent; } .panelBtn .open:before { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); background: #11374c; } .panelBtn .open:before, .panelBtn .open:after { margin-top: -1px; } .panelBtn .open:after { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); background: #11374c; } .header { width: 100%; height: 46px; background: #fff; position: fixed; top: 0; border-bottom: 0px; z-index: 999; } .headerAreaContents { width: 100%; height: 46px; margin: 0px auto; position: relative; } .headerArealogoArea { width: 171px; height: 20px; position: relative; border-bottom: 0px; } .headerArealogoArea a { width: 171px; height: 20px; display: block; position: absolute; top: 13px; left: 16px; } .headerAreaMenu{ width: 100%; height: 100%; background: #fff; position: fixed; top: 0px; left: 0px; display: none; } .headerLang{ background: #fff; position: fixed; top: 0px; right: 68px; display: none; } .headerAreaMenu ul { padding-top: 46px; } .headerAreaMenu ul li{ line-height: 4; float: none; text-align: center; font-size: 1.5rem; font-size: 15px; font-weight: 600; } .headerAreaMenu ul li a { display: block; padding: 0px 22px; background: #fff; text-decoration: none; color: #111111; } .headerAreaMenu ul li.active a { background: #f4f4f4; } .hero{ height: 360px; } .banner_item{ width: 100%; height: 360px; } .banner_item_content { width: 100%; margin: 0px auto; } .banner_item_content_base { width: 100%; margin: 95px 0px 0px 0px; text-align: center; } .banner_title1 { width: 284px; margin: 0px auto 45px auto; font-size: 3rem; line-height: 42px; } .banner_title1 .banner_num{ font-size: 4rem; margin-right: 5px; } .banner_text1 { display: none; } .banner_button { display: block; border-radius: 4px; border: 2px solid #fff; margin: 50px 14px 0px 14px; font-size: 1.4rem; font-size: 14px; line-height: 1.1; font-weight: bold; letter-spacing: 0.2px; vertical-align: middle; } .banner_button a { padding: 14px 20px; } .section_titleArea { padding: 16px 0px; } .section_titleArea h2{ font-size: 1.4rem; font-size: 14px; } .section_titleArea h2:before, .section_titleArea h2:after { top: -5px; } .section_titleArea p { font-size: 1rem; font-size: 10px; } .banner_button a:after { width: 14px; height: 14px; background-size: 14px 14px; margin: 0px 8px 0px 0px; vertical-align: middle; } .productArea_contents:before { height: 218px; margin: 0px 0px 0px 0px; border-radius: 0px; } .productArea_contentsInner { margin: 0; } .prodcut_readArea { width: 100%; float: none; text-align: left; margin: 0; } .prodcut_readAreaInner { width: 100%; margin: -180px 0px 0px 0px; } .dp_pc { display: none; } .dp_mobile { display: block; } .prodcut_title { font-size: 1.6rem; font-size: 16px; margin: 0px 16px 10px 16px; } .prodcut_subtitle { width: 100%; padding: 0px 16px 20px 25px; border-left: none; margin: 0; } .prodcut_img { width: 300px; height: auto; margin: 0 auto; } .prodcut_button a:after { margin-top: 1px; } .prodcut_linkArea { width: 100%; float: none; text-align: left; border-radius: 0px; background: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } .prodcut_linkAreaInner { width: 100%; margin: 0px 0px 0px 0px; text-align: left; } .prodcut_linkArea_navArea { padding: 0px 0px 0px 0px; border-top: 1px dotted #b4b4b4; } .prodcut_linkArea_nav, .prodcut_linkArea_nav2{ width: 100%; float: none; } .prodcut_linkArea_title { padding: 12px 0px; text-align: center; border-bottom: 1px dotted #b4b4b4; background: #fff; } .prodcut_linkArea_title:before { width: 18px; height: 18px; content: "\4c"; color: #fff; line-height: 18px; display: inline-block; border-radius: 50%; background: #004973; vertical-align: middle; margin: -3px 6px 0px 0px; font-family: 'ElegantIcons'; } .prodcut_linkArea_title.active:before { content: "\4b"; } .prodcut_linkArea_nav_list { list-style: none; border-top: none; margin: 0px 0px 0px 0px; display: none; } .prodcut_linkArea_nav_list-type1, .prodcut_linkArea_nav_list-type2{ width: 100%; float: none; } .prodcut_linkArea_nav_list li { background: #fff; } .prodcut_linkArea_nav_list li a { padding: 8px 16px; } .prodcut_button { margin: 16px 16px 30px 16px; } .prodcut_button a{ font-size: 1.4rem; font-size: 14px; } .prodcut_button a:after { width: 14px; height: 14px; background-size: 14px 14px; margin: 3px 14px 0px 0px; } .solservice_title { font-size: 1.6rem; font-size: 16px; } .solservice_text { line-height: 1.6; margin: 0px 16px 0px 16px; text-align: left; } .solservice_linkArea{ margin: 20px 0px 0px 0px; } .solservice_solArea { width: 100%; float: none; background: #fff; padding: 0px 0px 0px 0px; } .solservice_solArea:before { display: none; } .solservice_solAreaInner { width: 100%; margin: 0px; border-radius: 0px; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } .solservice_image { width: 100%; } .solservice_image img { border-radius: 0px; } .solservice_subtitle { font-size: 1.4rem; font-size: 14px; margin: 0px 16px 2px 16px; } .solservice_info { line-height: 1.6; margin: 0px 16px 0px 16px; } .solservice_serviceArea { width: 100%; float: none; background: #fff; padding: 0px 0px 20px 0px; } .solservice_serviceArea:before { display: none; } .solservice_serviceAreaInner { width: 100%; margin: 0px; border-radius: 0px; box-shadow: none; } .solservice_buttonArea { height: auto; padding: 0px 0px 30px 0px; } .solservice_buttonArea:before { display: none; } .solservice_buttonArea:after { display: none; } .solservice_button { width: auto; margin: 0px 16px 0px 16px; font-size: 1.4rem; font-size: 14px; } .solservice_button a:after { width: 14px; height: 14px; background-size: 14px 14px; margin: 3px 14px 0px 0px; } .section_titleArea h2.pc-wh:before, .section_titleArea h2.pc-wh:after { background: #b3b3b3; } .pc-wh{ color:#111!important; } .section_titleArea p.pc-wh{ color:#b3b3b3!important; } .companyArea{ background: #fff; } .company_linkArea{ width: 100%; padding: 0px 0px 20px 0px; overflow: hidden; } .company_linkAreaInner{ width: auto; padding: 0px 0px; float: none; } .company_title{ font-size: 1.6rem; font-size: 16px; color: #2d3134; margin: 10px 0px 16px 0px; text-align: center; } .company_text{ line-height: 1.6; color: #2d3134; margin: 16px 16px 30px 16px; text-align: left; } .company_button { width: auto; margin: 0px 16px 0px 16px; font-size: 1.4rem; font-size: 14px; } .company_button a:after { width: 14px; height: 14px; background-size: 14px 14px; margin: 3px 14px 0px 0px; } .n-listTable { width: 100%; } .n-listTable tr th { border-bottom: none; font-size: 1.2rem; font-size: 12px; padding: 14px 16px 0px 16px; display: block; } .n-listTable tr td { padding: 4px 22px 14px 16px; display: block; } .n-listTable tr td p{ transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; } .n-listTable tr td:after { right: 16px; top: -28px; } .news_button { font-size: 1.2rem; font-size: 12px; } .news_button a { display: block; color: #0b3c58; text-decoration: none; padding: 10px 40px 10px 20px; text-align: center; position: relative; } .news_button a:before { width: 8px; height: 13px; background: url(../img/arrow-right2.png) no-repeat; background-size: 8px 13px; content: ""; display: block; position: absolute; right: 10px; top: 0; bottom: 0; margin: auto; } .footerAreaContents { width: 100%; margin: 0px auto; padding: 0; position: relative; } .footer_companyInfo { width: 100%; float: none; } .footer_companyInfo p { width: 90px; margin: 0 auto; padding-top: 18px; } .footer_navInfo { width: 100%; float: none; border-top: 1px dotted #434e59; margin: 24px auto 0px auto; } .footer_nav { float: none; } .footer_nav_link{ width: 100%; } .footer_nav_title { font-size: 1.4rem; font-size: 14px; line-height: 1.3; font-weight: bold; margin-bottom: 0; } .footer_nav_title a { padding: 12px 15px; display: block; border-bottom: 1px dotted #434e59; } .footer_nav_title a:before { width: 16px; height: 16px; content: ""; display: inline-block; background: url(../img/arrow-right-white.png) no-repeat; background-size: 16px 16px; margin: -3px 6px 0px 0px; vertical-align: middle; } .footer_nav_list { margin: 0px; } .footer_nav_list li { border-bottom: 1px dotted #434e59; line-height: 1.7; } .footer_nav_list li a { display: block; padding: 10px 26px; } .footer_nav_contact{ width: 100%; } .footer_nav_list .nav_icon{ border-bottom: none; padding-top: 10px; padding-left: 26px; } .footer_nav_list .nav_item a{ display: inline-block; padding: 10px 0 10px 26px; } .footer_nav_list .nav_item a+a{ padding-left:10px; } .footer_nav_other{ width: 100%; } .footer_douyin{ width: 292px; margin: 0 auto; padding-top: 20px; } .footer_nav_other .footer_nav_title{ width: 100%; text-align: left; } .footer_douyin img{ width: 129px; } .footer_copyright{ padding:12px 15px; } .dm-pageTitleArea--pageIndex { height: 140px; } .p-pageTitle { font-size: 2rem; font-size: 20px; } .p-pageTitle--index { padding: 50px 0px 0px 0px; } .p-pageTitle_eng { font-size: 0.9rem; font-size: 9px; } .p-pkArea { display: none; } .p-pagenaviArea { display: none; } .pageProductIndex_pagelistAreaInner{ width: 100%; } .pageProductIndex_pagelist{ margin: 0px 0px 0px 0px; padding: 16px 0px 24px 0px; position: relative; } .pageProductIndex_boxArea{ width: auto; /* float: none;*/ padding: 0px 16px 20px 16px; } .pageProductIndex_box{ width: 100%; } .pageProductIndex_box_image{ width: 100%; } .pageProductIndex_box a:hover .pageProductIndex_box_image{ opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; -khtml-opacity: 1; -moz-opacity: 1; } .pageProductIndex_box a:hover .pageProductIndex_box_linktext span{ color: #2d3134; } .pageProductIndex__titleArea1{ padding: 24px 16px; } .pageProductIndex__titleArea1 h2{ font-size: 1.6rem; font-size: 16px; } .pageProductIndex__titleArea2{ width: auto; border-bottom: none; border-top: 1px solid #dedede; padding: 20px 16px 0px 16px; } .pageProductIndex__titleArea2 h3{ float: none; font-size: 1.4rem; font-size: 14px; } .pageProductIndex__titleArea2 p{ line-height: 1.7; } .index_newsArea{ background: #fff; text-align: center; padding: 0px 0px 50px 0px; overflow: hidden; } .slick-dots li{ width: 8px !important; height: 8px !important; margin: 0 5px; } .slick-dots li button{ width: 8px !important; height: 8px !important; } .slick-dots li button:before{ line-height: 8px !important; width: 8px !important; height: 8px !important; } .pageProductIndex_box a:hover .pageProductIndex_box_image{ border: 1px solid #fff; } .dm-pageTitleArea--pageHierarchy{ height:140px; margin-top: 46px; } .p-pageTitle--pageHierarchy{ padding-top: 50px; } .pageHierarchyIndex_area { width: 100%; background: #fff; padding: 0px 0px 30px 0px; } .pageNewsBoxArera { width: 100%; padding: 16px 0px 0px 0px; } .pageNewsBoxAreraInner { width: auto; padding: 0px 0px 20px 0px; margin: 0px 16px; } .pageNewsBoxArera__title { font-size: 1.6rem; font-size: 16px; padding-bottom: 5px; } .pageNewsBoxArera__day { padding: 4px 16px 14px 16px; margin: 0 0 20px; } .pageNewsBoxArera__inputArea { padding: 0px 16px; } .pageNewsBoxArera__inputAreaInner img{ width: 100%; height: auto; max-width: 100%; } .pageHierarchyContact_area { padding: 16px 0px 60px 0px; } .pageHierarchyIndex_areaInner { width: auto; padding: 0px 16px; } .pageContact__list li { font-size: 1.2rem; font-size: 12px; line-height: 1.7; } .pageContact__actionArea { border-left: none; border-right: none; } .pageContact__actionAreaType1, .pageContact__actionAreaType2, .pageContact__actionAreaType3{ width: 100%; float: none; } .pageContact__actionAreaBox { padding: 0; } .pageContact__actionAreaType2 .pageContact__actionAreaBox { border-left: none; border-right: none; } .pageContact__title { font-size: 1.4rem; font-size: 14px; margin: 20px 0px 0px 0px; } .pageContact__tel { font-size: 2.8rem; font-size: 28px; } .pageContact__mail { font-size: 1.6rem; font-size: 16px; } .pageHierarchyForm_area { padding: 0px 0px 60px 0px; } .pageHierarchyForm_areaInner { width: 100%; } .pageHierarchyForm__titleArea { padding: 24px 16px; } .pageHierarchyForm__titleArea h2 { font-size: 1.6rem; font-size: 16px; } .pageContact__text2 { font-size: 1.3rem; font-size: 13px; text-align: left; } .pageHierarchyFormBox { border-radius: 0px; } .pageHierarchyFormBox table tr th { padding: 16px 16px 0px 16px; width: auto; display: block; border-bottom: none; } .pageHierarchyFormBox table tr td { padding: 10px 16px 16px 16px; display: block; } .checkBtn { padding: 9px 20px; } .pageCompanyPhilosophy__boxAreaInner { width: 100%; padding: 50px 0px 70px 0px; } .pageCompanyPhilosophy__title1 { font-size: 1.8rem; font-size: 18px; } .pageCompanyPhilosophy__title1:after { height: 2px; } .pageCompanyPhilosophy__title3 { font-size: 1.8rem; font-size: 18px; margin: 20px 16px 0px 16px; } .pageCompanyPhilosophy__text1 { font-size: 1.4rem; font-size: 14px; margin: 20px 16px 0px 16px; } .pageProductIndex_visualAreaInner { width: 100%; text-align: center; padding: 20px 0px 30px 0px; } .pageProductIndex_visualImageArea { width: 100%; float: none; } .pageProductIndex_visualArea__obj_movie { width: auto; height: auto; margin: 0px 16px 0px 16px; } .pageProductIndex_visualArea__obj_movie a::before { width: 60px; height: 60px; } .pageProductIndex_visualArea__obj_movie a::after { border-width: 8px 0px 8px 12px; right: -4px; } .pageProductIndex_visualBodyArea { width: 100%; float: none; } .pageProductIndex_visual__title1 { font-size: 2.0rem; font-size: 20px; margin-top: 25px; line-height: 1.6; } .pageProductIndex_visual__text1 { margin: 20px 16px 0px 16px; text-align: left; } .pageProductPageList { display: none; } .p-hierarchyPageTitleArea { padding: 20px 0px 20px 0px; } .p-hierarchyPageTitle { font-size: 1.6rem; font-size: 16px; } .p-hierarchyPageTitle:before, .p-hierarchyPageTitle:after { width: 30px; } .pageProductPageArea_bottomArea { display: none; } .p-hierarchyNaviArea { background: #fff; border-top: 1px dotted #b4b4b4; display: block; } .p-hierarchyNaviArea nav ul { list-style: none; margin: 0px; } .p-hierarchyNaviArea nav ul li { font-size: 1.3rem; font-size: 13px; line-height: 1.7; border-bottom: 1px dotted #b4b4b4; } .p-hierarchyNaviArea nav ul li a { display: block; padding: 10px 26px; text-decoration: none; color: #004973; } .p-hierarchyNaviArea nav ul li a:before { width: 6px; height: 10px; content: ""; display: inline-block; background: url(../img/arrow-right2.png) no-repeat; background-size: 6px 10px; margin: 0px 4px 0px 0px; } .p-hierarchyNaviArea nav ul li.active a:before { background-image: url(../img/arrow-right2-red.png); } .pageProductPageItemArea { width: 100%; background: url(../img/pro_hero_bg.png) center center no-repeat; background-size: cover; } .pageProductPageItemArea__boxArea { padding: 20px 0px; } .pageProductPageItemArea__boxAreaInner { width: 100%; } .pageProductPageItemArea__body{ padding: 0 16px; } .pageProductPageItemArea__body__title { font-size: 1.6rem; font-size: 16px; } .pageProductPageItemArea__body__features{ font-size: 1.4rem; font-size: 14px; } .pageProductPageItemArea__body__features span{ padding-left: 14px; } .pageProductPageItemArea__body__features span::after { border-width: 5px 0px 5px 8px; top: 0; } .pageProductPageItemArea__moreArea{ padding: 0 16px; } .pageProductPageItemArea__moreTableInner{ width: 100%; } .pageProductPageItemArea__moreTable { width: 100%; border-bottom: 1px solid #d6d6da; } .pageProductPageItemArea__moreTable tr th.type2 { width: auto; background: #f7f7f7; } .pageProductPageFEArea{ margin: 24px 0 0; padding: 20px 0; } .pageProductPageFEArea__boxArea{ padding: 0 16px; } .pageProductPageFEArea__boxAreaInner{ width: 100%; } .pageProductPageFEArea__body { width: 100%; text-align: left; float:none; padding-top: 20px; } .pageProductPageFEArea__image{ width: 100%; float:none; } .pageProductPageFEArea__body__title{ font-size: 1.8rem; font-size: 18px; width: 200px; } .pageProductPageApplyArea__boxArea{ width: 100% } .pageProductIndex__titleArea1 span:after{ top: -8px; } .pageApplyIndex_pagelist { margin: 0; padding: 0 0 16px; } .pageApplyIndex_boxArea { width: 100%; padding: 0px 16px 20px 16px; } .pageApplyIndex_box { width: 100%; } .pageApplyIndex_box_image { width: 100%; } .pageApplyIndex_box_linktext { text-align: left; min-height: 20px; } .pageProductPageDemoArea{ margin: 20px 0 20px; padding: 0; } .pageDemoIndex_boxArea{ width: 100%; padding: 0px 16px 20px 16px; } .pageDemoIndex_box { width: 100%; } .pageDemoIndex_box_image { width: 100%; } .pageDemoIndex_pagelist{ margin:0; } .pageProductIndex_pagelist .slick-dots li button:before { background: #d4d8d8; } .pageProductIndex_pagelist .slick-dots li.slick-active button:before { background: #4c689a; } }